text:
fileFormatVersion: 2
guid: c5ecb056713efd14db83b1315790ec0a
timeCreated: 1463897209
licenseType: Pro
ModelImporter:
  serializedVersion: 19
  fileIDToRecycleName:
    100000: 135_01
    100002: //RootNode
    100004: abdomen
    100006: chest
    100008: head
    100010: hip
    100012: lButtock
    100014: lCollar
    100016: leftEye
    100018: lFoot
    100020: lForeArm
    100022: lHand
    100024: lIndex1
    100026: lIndex2
    100028: lMid1
    100030: lMid2
    100032: lPinky1
    100034: lPinky2
    100036: lRing1
    100038: lRing2
    100040: lShin
    100042: lShldr
    100044: lThigh
    100046: lThumb1
    100048: lThumb2
    100050: neck
    100052: rButtock
    100054: rCollar
    100056: rFoot
    100058: rForeArm
    100060: rHand
    100062: rightEye
    100064: rIndex1
    100066: rIndex2
    100068: rMid1
    100070: rMid2
    100072: rPinky1
    100074: rPinky2
    100076: rRing1
    100078: rRing2
    100080: rShin
    100082: rShldr
    100084: rThigh
    100086: rThumb1
    100088: rThumb2
    400000: 135_01
    400002: //RootNode
    400004: abdomen
    400006: chest
    400008: head
    400010: hip
    400012: lButtock
    400014: lCollar
    400016: leftEye
    400018: lFoot
    400020: lForeArm
    400022: lHand
    400024: lIndex1
    400026: lIndex2
    400028: lMid1
    400030: lMid2
    400032: lPinky1
    400034: lPinky2
    400036: lRing1
    400038: lRing2
    400040: lShin
    400042: lShldr
    400044: lThigh
    400046: lThumb1
    400048: lThumb2
    400050: neck
    400052: rButtock
    400054: rCollar
    400056: rFoot
    400058: rForeArm
    400060: rHand
    400062: rightEye
    400064: rIndex1
    400066: rIndex2
    400068: rMid1
    400070: rMid2
    400072: rPinky1
    400074: rPinky2
    400076: rRing1
    400078: rRing2
    400080: rShin
    400082: rShldr
    400084: rThigh
    400086: rThumb1
    400088: rThumb2
    7400000: 135_01
    9500000: //RootNode
  materials:
    importMaterials: 0
    materialName: 0
    materialSearch: 1
  animations:
    legacyGenerateAnimations: 4
    bakeSimulation: 0
    resampleCurves: 1
    optimizeGameObjects: 0
    motionNodeName:
    animationImportErrors:
    animationImportWarnings:
    animationRetargetingWarnings:
    animationDoRetargetingWarnings: 0
    animationCompression: 3
    animationRotationError: 0.5
    animationPositionError: 0.5
    animationScaleError: 0.5
    animationWrapMode: 0
    extraExposedTransformPaths: []
    clipAnimations:
    - serializedVersion: 16
      name: 135_01
      takeName: 135_01
      firstFrame: 10
      lastFrame: 1211
      wrapMode: 0
      orientationOffsetY: 0
      level: 0
      cycleOffset: 0
      loop: 0
      hasAdditiveReferencePose: 0
      loopTime: 1
      loopBlend: 1
      loopBlendOrientation: 0
      loopBlendPositionY: 0
      loopBlendPositionXZ: 0
      keepOriginalOrientation: 0
      keepOriginalPositionY: 0
      keepOriginalPositionXZ: 0
      heightFromFeet: 1
      mirror: 0
      bodyMask: 01000000010000000100000001000000010000000100000001000000010000000100000001000000010000000100000001000000
      curves: []
      events: []
      transformMask:
      - path:
        weight: 1
      - path: 135_01
        weight: 1
      - path: 135_01/hip
        weight: 1
      - path: 135_01/hip/abdomen
        weight: 1
      - path: 135_01/hip/abdomen/chest
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lIndex1
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lIndex1/lIndex2
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lMid1
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lMid1/lMid2
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lPinky1
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lPinky1/lPinky2
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lRing1
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lRing1/lRing2
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lThumb1
        weight: 1
      - path: 135_01/hip/abdomen/chest/lCollar/lShldr/lForeArm/lHand/lThumb1/lThumb2
        weight: 1
      - path: 135_01/hip/abdomen/chest/neck
        weight: 1
      - path: 135_01/hip/abdomen/chest/neck/head
        weight: 1
      - path: 135_01/hip/abdomen/chest/neck/head/leftEye
        weight: 1
      - path: 135_01/hip/abdomen/chest/neck/head/rightEye
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rIndex1
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rIndex1/rIndex2
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rMid1
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rMid1/rMid2
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rPinky1
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rPinky1/rPinky2
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rRing1
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rRing1/rRing2
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rThumb1
        weight: 1
      - path: 135_01/hip/abdomen/chest/rCollar/rShldr/rForeArm/rHand/rThumb1/rThumb2
        weight: 1
      - path: 135_01/hip/lButtock
        weight: 1
      - path: 135_01/hip/lButtock/lThigh
        weight: 1
      - path: 135_01/hip/lButtock/lThigh/lShin
        weight: 1
      - path: 135_01/hip/lButtock/lThigh/lShin/lFoot
        weight: 1
      - path: 135_01/hip/rButtock
        weight: 1
      - path: 135_01/hip/rButtock/rThigh
        weight: 1
      - path: 135_01/hip/rButtock/rThigh/rShin
        weight: 1
      - path: 135_01/hip/rButtock/rThigh/rShin/rFoot
        weight: 1
      maskType: 0
      maskSource: {instanceID: 0}
      additiveReferencePoseFrame: 0
    isReadable: 1
  meshes:
    lODScreenPercentages: []
    globalScale: 0.01
    meshCompression: 0
    addColliders: 0
    importBlendShapes: 1
    swapUVChannels: 0
    generateSecondaryUV: 0
    useFileUnits: 1
    optimizeMeshForGPU: 1
    keepQuads: 0
    weldVertices: 1
    secondaryUVAngleDistortion: 8
    secondaryUVAreaDistortion: 15.000001
    secondaryUVHardAngle: 88
    secondaryUVPackMargin: 4
    useFileScale: 0
  tangentSpace:
    normalSmoothAngle: 60
    normalImportMode: 0
    tangentImportMode: 4
  importAnimation: 1
  copyAvatar: 0
  humanDescription:
    human:
    - boneName: hip
      humanName: Hips
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rThigh
      humanName: RightUpperLeg
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rShin
      humanName: RightLowerLeg
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rFoot
      humanName: RightFoot
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: abdomen
      humanName: Spine
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: chest
      humanName: Chest
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rShldr
      humanName: RightUpperArm
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rForeArm
      humanName: RightLowerArm
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rHand
      humanName: RightHand
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: neck
      humanName: Neck
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: head
      humanName: Head
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rightEye
      humanName: RightEye
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: leftEye
      humanName: LeftEye
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lShldr
      humanName: LeftUpperArm
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lForeArm
      humanName: LeftLowerArm
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lHand
      humanName: LeftHand
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lThigh
      humanName: LeftUpperLeg
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lShin
      humanName: LeftLowerLeg
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lFoot
      humanName: LeftFoot
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lThumb1
      humanName: Left Thumb Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lThumb2
      humanName: Left Thumb Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lIndex1
      humanName: Left Index Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lIndex2
      humanName: Left Index Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lMid1
      humanName: Left Middle Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lMid2
      humanName: Left Middle Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lRing1
      humanName: Left Ring Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lRing2
      humanName: Left Ring Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lPinky1
      humanName: Left Little Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lPinky2
      humanName: Left Little Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rThumb1
      humanName: Right Thumb Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rThumb2
      humanName: Right Thumb Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rIndex1
      humanName: Right Index Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rIndex2
      humanName: Right Index Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rMid1
      humanName: Right Middle Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rMid2
      humanName: Right Middle Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rRing1
      humanName: Right Ring Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rRing2
      humanName: Right Ring Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rPinky1
      humanName: Right Little Proximal
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rPinky2
      humanName: Right Little Intermediate
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: rCollar
      humanName: RightShoulder
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    - boneName: lCollar
      humanName: LeftShoulder
      limit:
        min: {x: 0, y: 0, z: 0}
        max: {x: 0, y: 0, z: 0}
        value: {x: 0, y: 0, z: 0}
        length: 0
        modified: 0
    skeleton:
    - name: 135_01(Clone)
      position: {x: 0, y: 0, z: 0}
      rotation: {x: 0, y: 0, z: 0, w: 1}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: 135_01
      position: {x: -0, y: 0, z: 0}
      rotation: {x: -0.7071068, y: 0, z: -0, w: 0.7071068}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: hip
      position: {x: -0.000000029802322, y: -0.009753684, z: 0.8396781}
      rotation: {x: 0.51429075, y: 0.51429075, z: -0.4852886, w: 0.48528862}
      scale: {x: 0.9999999, y: 0.9999998, z: 0.9999999}
      transformModified: 1
    - name: abdomen
      position: {x: -0.20610893, y: 0.000000016511331, z: -0.0192977}
      rotation: {x: -0.0005397447, y: -0.049835663, z: 0.015217903, w: 0.9986414}
      scale: {x: 1, y: 1, z: 0.99999994}
      transformModified: 1
    - name: chest
      position: {x: -0.11714456, y: -0.0000000019371509, z: 0.00000004767906}
      rotation: {x: -0.00022811952, y: -0.07624861, z: 0.004258881, w: 0.99707973}
      scale: {x: 1, y: 0.99999994, z: 1.0000001}
      transformModified: 1
    - name: lCollar
      position: {x: -0.19842516, y: -0.026822379, z: -0.010655813}
      rotation: {x: 0.07454781, y: 0.18828988, z: 0.76491416, w: 0.6114703}
      scale: {x: 1, y: 1.0000001, z: 1.0000002}
      transformModified: 1
    - name: lShldr
      position: {x: -0.09110616, y: 0.00000003695488, z: 0.00000009357929}
      rotation: {x: -0.082963906, y: -0.082535334, z: -0.07934688, w: 0.9899541}
      scale: {x: 1.0000001, y: 0.99999994, z: 1}
      transformModified: 1
    - name: lForeArm
      position: {x: -0.2823035, y: 0.00000019788742, z: 0.000000043213365}
      rotation: {x: 0.13971372, y: 0.02159743, z: -0.045933153, w: 0.98889023}
      scale: {x: 1.0000001, y: 1.0000001, z: 1}
      transformModified: 1
    - name: lHand
      position: {x: -0.23681538, y: 0.000000023841856, z: 0.00000019073485}
      rotation: {x: 0.033943765, y: 0.029351646, z: -0.023630295, w: 0.99871314}
      scale: {x: 0.99999994, y: 1, z: 0.9999999}
      transformModified: 1
    - name: lIndex1
      position: {x: -0.09312054, y: 0.0124484105, z: 0.020685349}
      rotation: {x: 0.09573041, y: 0.047165446, z: 0.01425977, w: 0.99418694}
      scale: {x: 1, y: 0.9999999, z: 1.0000001}
      transformModified: 1
    - name: lIndex2
      position: {x: -0.031123465, y: 0.00000006437301, z: 0.000000038146972}
      rotation: {x: 0.045215365, y: 0.03193482, z: -0.02478917, w: 0.99815893}
      scale: {x: 0.9999999, y: 0.99999994, z: 0.99999976}
      transformModified: 1
    - name: lMid1
      position: {x: -0.0897765, y: 0.006776161, z: -0.0009475517}
      rotation: {x: -0.023375504, y: 0.00792468, z: 0.04062101, w: 0.9988697}
      scale: {x: 0.99999994, y: 1, z: 1.0000001}
      transformModified: 1
    - name: lMid2
      position: {x: -0.03331972, y: -0.000000057220458, z: 0.0000002670288}
      rotation: {x: -0.0033165556, y: -0.0015662755, z: 0.000607564, w: 0.9999931}
      scale: {x: 0.9999999, y: 1, z: 0.9999998}
      transformModified: 1
    - name: lPinky1
      position: {x: -0.075154945, y: -0.017121058, z: -0.030372467}
      rotation: {x: -0.39941558, y: -0.046603046, z: -0.0042102206, w: 0.91557515}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: lPinky2
      position: {x: -0.020614814, y: 0.0000000667572, z: 0}
      rotation: {x: 0.014297169, y: 0.0075066946, z: 0.0036974496, w: 0.9998628}
      scale: {x: 0.9999998, y: 0.9999999, z: 0.99999994}
      transformModified: 1
    - name: lRing1
      position: {x: -0.087880015, y: -0.006282749, z: -0.017068023}
      rotation: {x: -0.20938978, y: -0.035993323, z: 0.022935905, w: 0.97690034}
      scale: {x: 1, y: 0.99999994, z: 0.9999999}
      transformModified: 1
    - name: lRing2
      position: {x: -0.02735144, y: -0.00000008463859, z: 0.000000013113022}
      rotation: {x: 0.051607497, y: 0.03863811, z: -0.0011236817, w: 0.9979191}
      scale: {x: 0.9999999, y: 0.9999997, z: 1.0000001}
      transformModified: 1
    - name: lThumb1
      position: {x: -0.02351521, y: 0.004178476, z: 0.027701778}
      rotation: {x: 0.17862464, y: 0.2864356, z: -0.16118467, w: 0.9273982}
      scale: {x: 0.99999994, y: 1.0000001, z: 0.9999999}
      transformModified: 1
    - name: lThumb2
      position: {x: -0.04825781, y: -0.000000057220458, z: 0}
      rotation: {x: -0.0733445, y: 0.08143229, z: 0.17280978, w: 0.97883916}
      scale: {x: 0.9999999, y: 0.9999998, z: 1}
      transformModified: 1
    - name: neck
      position: {x: -0.22195564, y: 0.000000025629996, z: 0.02131148}
      rotation: {x: -0.0016533935, y: 0.18145773, z: -0.016965078, w: 0.98325104}
      scale: {x: 0.9999999, y: 0.9999998, z: 0.9999999}
      transformModified: 1
    - name: head
      position: {x: -0.07179801, y: -0.000000011324882, z: 0.00000009685755}
      rotation: {x: -0.0075099333, y: 0.30242908, z: 0.027297666, w: 0.95275134}
      scale: {x: 0.9999999, y: 0.9999999, z: 0.9999998}
      transformModified: 1
    - name: leftEye
      position: {x: -0.11465987, y: -0.0390039, z: -0.0003461319}
      rotation: {x: -0.2705483, y: -0.27054828, z: 0.64505225, w: 0.6614491}
      scale: {x: 0.9999999, y: 0.99999994, z: 0.9999998}
      transformModified: 1
    - name: rightEye
      position: {x: -0.112988204, y: 0.039003946, z: 0.0003461653}
      rotation: {x: -0.2705483, y: -0.27054828, z: 0.64505225, w: 0.6614491}
      scale: {x: 0.9999999, y: 0.99999994, z: 0.9999998}
      transformModified: 1
    - name: rCollar
      position: {x: -0.19842525, y: 0.026822416, z: -0.010655716}
      rotation: {x: -0.07454778, y: 0.18828991, z: -0.7649142, w: 0.6114703}
      scale: {x: 0.9999999, y: 1, z: 1.0000002}
      transformModified: 1
    - name: rShldr
      position: {x: -0.09110616, y: 0.000000102519984, z: -0.00000011920929}
      rotation: {x: 0.08357811, y: -0.07988422, z: 0.070287086, w: 0.9908042}
      scale: {x: 0.99999994, y: 0.9999998, z: 1}
      transformModified: 1
    - name: rForeArm
      position: {x: -0.28230348, y: 0.00000007510185, z: 0.000000039339064}
      rotation: {x: -0.14298977, y: 0.023383886, z: 0.023120577, w: 0.9891777}
      scale: {x: 0.9999999, y: 0.99999994, z: 0.9999998}
      transformModified: 1
    - name: rHand
      position: {x: -0.23681538, y: 0.0000001335144, z: -0.000000057220458}
      rotation: {x: -0.033943787, y: 0.029351661, z: 0.02363029, w: 0.99871314}
      scale: {x: 1, y: 0.99999994, z: 0.99999994}
      transformModified: 1
    - name: rIndex1
      position: {x: -0.09312055, y: -0.01244852, z: 0.020685615}
      rotation: {x: -0.09573083, y: 0.047167845, z: -0.014259749, w: 0.9941869}
      scale: {x: 0.9999998, y: 0.9999998, z: 0.99999994}
      transformModified: 1
    - name: rIndex2
      position: {x: -0.031123428, y: -0.000000028610229, z: -0.000000038146972}
      rotation: {x: -0.045215435, y: 0.031934824, z: 0.024789182, w: 0.99815893}
      scale: {x: 1, y: 0.9999999, z: 1.0000001}
      transformModified: 1
    - name: rMid1
      position: {x: -0.089776464, y: -0.006776123, z: -0.0009472084}
      rotation: {x: 0.02337547, y: 0.007925701, z: -0.040623423, w: 0.99886966}
      scale: {x: 0.99999994, y: 1, z: 0.9999999}
      transformModified: 1
    - name: rMid2
      position: {x: -0.033319738, y: 0.000000076293944, z: 0.00000015258789}
      rotation: {x: 0.0033165629, y: -0.0015662567, z: -0.00060755294, w: 0.9999931}
      scale: {x: 0.9999997, y: 1, z: 0.9999999}
      transformModified: 1
    - name: rPinky1
      position: {x: -0.07515492, y: 0.017121028, z: -0.03037222}
      rotation: {x: 0.39941624, y: -0.046603017, z: 0.004210133, w: 0.9155748}
      scale: {x: 0.9999999, y: 0.9999999, z: 0.9999999}
      transformModified: 1
    - name: rPinky2
      position: {x: -0.020614624, y: -0.000000009536743, z: -0.000000057220458}
      rotation: {x: -0.014297139, y: 0.007506709, z: -0.0036974605, w: 0.9998628}
      scale: {x: 1, y: 1.0000001, z: 1.0000001}
      transformModified: 1
    - name: rRing1
      position: {x: -0.0878801, y: 0.0062825964, z: -0.01706768}
      rotation: {x: 0.20938921, y: -0.03599258, z: -0.0229409, w: 0.97690046}
      scale: {x: 0.9999999, y: 0.9999999, z: 1}
      transformModified: 1
    - name: rRing2
      position: {x: -0.027351601, y: 0.000000010728836, z: -0.00000007510185}
      rotation: {x: -0.051607493, y: 0.038638126, z: 0.0011236429, w: 0.9979191}
      scale: {x: 1, y: 0.9999999, z: 1.0000001}
      transformModified: 1
    - name: rThumb1
      position: {x: -0.023515204, y: -0.0041786386, z: 0.027702045}
      rotation: {x: -0.17798145, y: 0.28570738, z: 0.16375004, w: 0.9272971}
      scale: {x: 0.99999976, y: 0.99999994, z: 0.99999994}
      transformModified: 1
    - name: rThumb2
      position: {x: -0.04825775, y: 0.000000014305114, z: 0.000000076293944}
      rotation: {x: 0.07334454, y: 0.08143226, z: -0.17280978, w: 0.97883916}
      scale: {x: 1, y: 0.99999976, z: 1}
      transformModified: 1
    - name: lButtock
      position: {x: -0.044142127, y: -0.08778242, z: 0.009648962}
      rotation: {x: 0.000000068754346, y: 0.91067886, z: 3.8493683e-15, w: -0.413115}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: lThigh
      position: {x: -0.027801964, y: 0.0000000014802936, z: 0.000000076293944}
      rotation: {x: 0.004530241, y: -0.5014767, z: -0.015193336, w: 0.8650259}
      scale: {x: 1, y: 1, z: 0.9999999}
      transformModified: 1
    - name: lShin
      position: {x: -0.36827174, y: 0.00000002503395, z: 0.00000007532537}
      rotation: {x: -0.14003558, y: 0.12716408, z: 0.009993375, w: 0.98189586}
      scale: {x: 1.0000001, y: 1, z: 1}
      transformModified: 1
    - name: lFoot
      position: {x: -0.45406002, y: 0.0000000885129, z: -0.000000011324882}
      rotation: {x: 0.042298403, y: -0.63525516, z: -0.08520254, w: 0.7664218}
      scale: {x: 1.0000001, y: 1, z: 1.0000001}
      transformModified: 1
    - name: rButtock
      position: {x: -0.044142112, y: 0.08778242, z: 0.009648962}
      rotation: {x: 0.000000068754346, y: 0.91067886, z: 3.8493683e-15, w: -0.413115}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: rThigh
      position: {x: -0.027801951, y: 0.000000049164008, z: 0.000000076293944}
      rotation: {x: 0.0031724991, y: -0.46318567, z: -0.0068964097, w: 0.88622874}
      scale: {x: 0.9999999, y: 0.9999999, z: 0.99999994}
      transformModified: 1
    - name: rShin
      position: {x: -0.3682716, y: 0.000000058501026, z: -0.000000085663046}
      rotation: {x: 0.14181285, y: 0.048929553, z: 0.0011238921, w: 0.98868287}
      scale: {x: 1, y: 1, z: 1}
      transformModified: 1
    - name: rFoot
      position: {x: -0.45405996, y: 0.00000008903444, z: 0.00000003620982}
      rotation: {x: -0.045377005, y: -0.6082458, z: 0.079096496, w: 0.78849334}
      scale: {x: 0.9999999, y: 0.9999999, z: 1}
      transformModified: 1
    armTwist: 0.5
    foreArmTwist: 0.5
    upperLegTwist: 0.5
    legTwist: 0.5
    armStretch: 0.05
    legStretch: 0.05
    feetSpacing: 0
    rootMotionBoneName:
    hasTranslationDoF: 0
  lastHumanDescriptionAvatarSource: {instanceID: 0}
  animationType: 3
  humanoidOversampling: 1
  additionalBone: 0
  userData:
  assetBundleName:
  assetBundleVariant:

repo_name: keijiro/KinoDatamosh

repo_language: C#

mime_type: text/plain


text:
The motion-captured animation data in this directory is originally created by
Carnegie Mellon University Graphics Lab.

http://mocap.cs.cmu.edu

cMonkeys converted these mocap data into FBX files for ease of importing into
Unity. These FBX files are distributed on Unity Asset Store.

http://u3d.as/8An


text:
fileFormatVersion: 2
guid: 60bb4480dbb174616bc9731e372b3406
timeCreated: 1436690642
licenseType: Pro
TextScriptImporter:
  userData:
  assetBundleName:
  assetBundleVariant:


text:
fileFormatVersion: 2
guid: 1369ccb1c34454cc2967c59f41afb9ca
timeCreated: 1463897715
licenseType: Pro
TextureImporter:
  fileIDToRecycleName:
    8900000: generatedCubemap
  serializedVersion: 2
  mipmaps:
    mipMapMode: 0
    enableMipMap: 1
    linearTexture: 0
    correctGamma: 0
    fadeOut: 0
    borderMipMap: 0
    mipMapFadeDistanceStart: 1
    mipMapFadeDistanceEnd: 3
  bumpmap:
    convertToNormalMap: 0
    externalNormalMap: 0
    heightScale: 0.25
    normalMapFilter: 0
  isReadable: 0
  grayScaleToAlpha: 0
  generateCubemap: 6
  cubemapConvolution: 0
  cubemapConvolutionSteps: 7
  cubemapConvolutionExponent: 1.5
  seamlessCubemap: 0
  textureFormat: -3
  maxTextureSize: 2048
  textureSettings:
    filterMode: -1
    aniso: -1
    mipBias: -1
    wrapMode: 1
  nPOTScale: 1
  lightmap: 0
  rGBM: 0
  compressionQuality: 50
  allowsAlphaSplitting: 0
  spriteMode: 0
  spriteExtrude: 1
  spriteMeshType: 1
  alignment: 0
  spritePivot: {x: 0.5, y: 0.5}
  spriteBorder: {x: 0, y: 0, z: 0, w: 0}
  spritePixelsToUnits: 100
  alphaIsTransparency: 0
  spriteTessellationDetail: -1
  textureType: 3
  buildTargetSettings: []
  spriteSheet:
    sprites: []
    outline: []
  spritePackingTag:
  userData:
  assetBundleName:
  assetBundleVariant:


text:
The HDR images in this directory are provided from sIBL Archive under the
Creative Commons license (CC BY-NC-SA 3.0 US). Please see the page below for
further details.

http://www.hdrlabs.com/sibl/archive.html


text:
const fs = require('fs');
const chokidar = require('chokidar');
const path = require('path');
const stylup = require('stylup');

let options = {
	processBlockStyles: true
}

var watching = process.argv[2]

function processPHTML(event, filepath) {

	if (/.phtml$/.test(filepath)) {
		let dirname = path.dirname(filepath)
		let basename = path.basename(filepath, '.phtml')
		let output = path.join(dirname, basename + '.html');

		fs.readFile(filepath, 'utf8', (err, html) => {
			stylup.process(html, null, options).then((result) => {
				// console.log(result.html)
				fs.writeFile(output, result.html, () => true);
				console.log("HTML file rebuilt")
				// if (result.map) {
				// 	fs.writeFile(output + '.map', result.map, () => true);
				// }
			});
		});
	}

}

// processPHTML('docs/')

if (watching) {
	console.log("Watching for changes to phtml files...")
	chokidar.watch('docs/').on('all', processPHTML)
}
else {
	chokidar.watch('docs/', { persistent: false }).on('all', processPHTML)
}

repo_name: gavinmcfarland/flex-gap-polyfill

repo_language: CSS


text:
# Changes to postcss-gap-polyfil

### 4.10 (15 Aug 2021)

- Polyfill now adjusts the widths/heights of elements with flex applied to account for the negative margin used to emulate flex gap.

### 4.00 (1 May 2021)

- Completely refactored from the ground up
- Now supports use cases where `display: flex | inline-flex` and `gap` exist in two different classes
- Now supports margins on items as well
- More accurate calculation of percentage gaps

### 3.00 (18 Apr 2021)

- Refactored plugin with optimisations
- Added option to use with JavaScript flex gap detection
- Added option for support for TailwindCSS

### 2.2.1 (10 Mar 2020)

- Renamed and updated docs

### Older

- Added support for horizontal and vertical gutters
- Fixed issue where calculation for percentages was incorrect
- Works when nested using any mixture of gutters with pixels or percentage
- Works with percentage widths or fixed widths


text:
# Spec

1. Loop through each rule and get computed/resolved properties
    1. Check if rule has `display: flex | inline-flex`
    2. Get `gapValues[]` for rule
    3. Get `marginValues[]` for rule
2. Create selectors used by polyfill which vary depending on options
    1. Selectors are:
        - `orig` the original rule
        - `container` a duplicate of the original rule
        - `item` targets children of the container
        - `reset` resets children of the container
        - `slotted` slotted version of container
2. Append `--has-display-flex: ;` to all rules that have `display: flex | inline-flex`
    1. TODO: Probably need to check against resolved property rather than looping through each declartion because some declarations could be overridden
3. Append `--fgp-gap-column` and `--fgp-row` to all rules where `gapValues[] !== null`
3. Overwrite all occurances of `margin-left`, `margin-top` and `margin`
4. Add `margin-left` and `margin-top` to every rule where `gapValues[] !== null`
    1. Caution: This must apply to anything where `gapValues[] !== null` because user could dynamically add or remove `diplay: flex`
        1. If `percentages` use one calculation, else use a different calculation
            1. Don't apply if `marginValues[] !== null` (this is to avoid duplicating the declaration)
            2. Add custom properties used by polyfill
            3. Add custom properties to `item` of container
            4. Add `margin-left` and `margin-top`


text:
module.exports = {
	classes: [
		{
			name: 'spacing',
			class: ['p', 'm'],
			children: [
				't',
				'r',
				'b',
				'l'
			],
			style({ rule, args, str }) {
				if (args) {
					let values = args;

					switch (values.length) {
						case 1:
							values.push(values[0]);
						case 2:
							values.push(values[0]);
						case 3:
							values.push(values[1]);
					}

					for (let [index, side] of rule.children.entries()) {
						str`--${rule.class}${side}: ${values[index]};\n`
					}

					return str()
				}
			}
		},
		{
			name: 'colour',
			class: 'c',
			style({ rule, str }) {
				if (rule.args) {

					str`--${rule.class}: ${rule.args[0]};\n`

					return str()
				}
			}
		},
		{
			name: 'background color',
			class: 'bgc',
			style({ rule, str }) {
				if (rule.args) {

					str`--${rule.class}: ${rule.args[0]};\n`

					return str()
				}
			}
		}
	]
}


text:
module.exports = {
	plugins: [
		// require('autoprefixer')(),
		require('postcss-preset-env')({
			features: {
				'nesting-rules': true,
				'gap-properties': false,
			}
		}),
		require('./dist/index.js')({
			flexGapNotSupported: ".flex-gap-not-supported"
		})
	]
};


text:
# Flex Gap Polyfill

[![NPM Version][npm-img]][npm-url]
[![Linux Build Status][cli-img]][cli-url]
[![Gitter Chat][git-img]][git-url]

This is a pure CSS polyfill using PostCSS to emulate flex gap using margins.

## Known limitations

- Must use a wrapper div when using `margin: auto` or `background`.
- Percentage gaps aren't reliable if the container is not full width of parent container
- Width of flex items with percentages vary slightly from spec because of negative margin on container.

View the [demo page](https://gavinmcfarland.github.io/flex-gap-polyfill/) for various test cases of the polyfill in action.

## Example

```css
.container {
    display: flex;
    gap: 40px;
}
```

Becomes:

```css
/* Output simplified for purpose of example */

.container > * {
    --fgp-parent-gap-row: 40px;
    --fgp-parent-gap-column: 40px;
    --fgp-margin-top: calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
    --fgp-margin-left: calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
    margin-top: var(--fgp-margin-top);
    margin-left: var(--fgp-margin-left);
}

.container {
    --fgp-gap: var(--has-fgp, 40px);
    --fgp-gap-row: 40px;
    --fgp-gap-column: 40px;
    --fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--orig-margin-top, 0px));
    --fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--orig-margin-left, 0px));
    display: flex;
    gap: var(--fgp-gap, 0px);
    margin-top: var(--fgp-margin-top, var(--orig-margin-top));
    margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}
```

The polyfill emulates flex gap by adding margins to each child element and applying a negative margin to the container.

- <mark>NEW</mark> Now works regardless of whether `display: flex` and `gap` are used in the same rule (see [Options](#Options) for ways to optimise)
- Works with unlimited nested elements with any combination of units, px > px, px > %, % > %, etc
- No additional class names or divs needed (except when using `margin: auto` or `background`)
- Works even when margin already exists on element (inline styles not supported)
- Style margin, borders and padding as normal
- Supports `gap`, `row-gap` and `column-gap`

## Browser support

Supports all current modern browsers, Edge, Firefox, Chrome, Safari, Opera (any browser that supports `calc()` and `var()`).

## Usage

Add [Flex Gap Polyfill] to your project:

```bash
npm install flex-gap-polyfill postcss --save-dev
```

Use **Flex Gap Polyfill** to process your CSS:

```js
const flexGapPolyfill = require('flex-gap-polyfill');

flexGapPolyfill.process(YOUR_CSS /*, processOptions, pluginOptions */);
```

Or use it as a [PostCSS] plugin:

```js
const postcss = require('postcss');
const flexGapPolyfill = require('flex-gap-polyfill');

postcss([
    flexGapPolyfill(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);
```

[npm-url]: https://www.npmjs.com/package/flex-gap-polyfill
[npm-img]: https://img.shields.io/npm/v/flex-gap-polyfill.svg
[cli-url]: https://travis-ci.org/limitlessloop/flex-gap-polyfill
[cli-img]: https://img.shields.io/travis/limitlessloop/flex-gap-polyfill.svg
[git-url]: https://gitter.im/postcss/postcss
[git-img]: https://img.shields.io/badge/chat-gitter-blue.svg

[PostCSS]: https://github.com/postcss/postcss
[Flex Gap Polyfill]: https://github.com/limitlessloop/flex-gap-polyfill

## Options

- `only`

    __Type__: Array __Default__: undefined

    When `true` polyfill will only apply when `display: flex | inline-flex` and `gap` are used in the same rule. Provide an array of selectors to match additional rules. Can be `strings` or `regexes`. Inlcude `/* apply fgp */` within a rule to manually apply the polyfill.

- `flexGapNotSupported`

    __Type__: String __Default__: false

    Manually specify a selector to use when flex gap is not supported by [detection via JavaScript](https://github.com/Modernizr/Modernizr/blob/master/feature-detects/css/flexgap.js), eg `flexGapNotSupported: '.flex-gap-not-supported'`.

<!-- - `tailwindCSS`

    __Type__: Boolean __Default__: false

    When `true` polyfill will add extra CSS to support TailwindCSS. -->

- `webComponents`

    __Type__: Boolean __Default__: false

    When `true` polyfill will also target slotted elements

<!-- - `percentageRowGaps`

    __Type__: Boolean __Default__: false

    When `true` percentage row gaps will be calculated based on width of element (non spec). -->


text:
		<meta charset="UTF-8"/>
		<meta name="viewport" content="width=device-width"/>

Flex Gap Polyfill

Below are a list of test cases demonstrating scenarios this polyfill works with. Github

Polyfill: on Red lines show container with negative margins.

Basic

.container {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

One

Two

Three

Four

Five

Nested

.container {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.container .container {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
}

A

B

C

D

A

B

C

D

Percentages

(Percentage row gaps only appear when height is specified, disabled in polyfill for now).

.container
	display: flex;
	flex-wrap: wrap;
	gap: 6%;
}

A

B

C

D

Ems

.container
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
}

A

B

C

D

Nested Combination (% > px, px > %, em > px, etc)

.container
	display: flex;
	flex-wrap: wrap;
	gap: 6%;
}

.container .container {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

A

B

C

D

A

B

C

D

Percentage gaps aren't that reliable if the width of the container is not 100% of it's parent.

.container
	display: flex;
	flex-wrap: wrap;
	gap: 6%;
}

.container .container {
	display: flex;
	flex-wrap: wrap;
	gap: 3%;
}

A

B

C

D

A

B

C

D

Margin + Gap

.container
	display: flex;
	flex-wrap: wrap;
	margin: 20px;
	gap: 3%;
}

A

B

C

D

Justify End

.container
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 3%;
}

A

B

C

D

Space Evenly

.container
	display: flex;
	flex-wrap: wrap;
	gap: 3%;
	justify-content: space-evenly;
}

A

B

C

D

Grid

.container {
	display: flex;
	flex-wrap: wrap;
	flex-grow: 1;
	--gap: 20px;
	gap: var(--gap);
	max-width: 400px;
}

.item {
	flex: calc(50% - var(--gap));
}

A

B

C

D

Columns and Rows Independently

.container {
	display: flex;
	flex-wrap: wrap;
	row-gap: 40px;
}

.container .container {
	display: flex;
	flex-wrap: wrap;
	column-gap: 20px;
}

A

B

C

D

A

B

C

D

When container doesn't have flex

.container {
	display: grid;
	gap: 40px;
	margin-left: 40px;
}

A

B

C

D


text:
import postcss from "postcss";
import { parse } from 'postcss-values-parser';

// var twMarginRegex = /^.-?m(y-[0-9]|x-[0-9]|-px|-[0-9].?[0-9]?)/gmi

// TODO: To support Tailwind need to cover all variants of class names including device eg md:. margin, width, flex, height

// TODO: Test with example repos
// TODO: Check webComponents option works
// TODO: Check works with tailwind

module.exports = (opts = {}) => {
	opts = opts || {}

	const pf = "fgp-";
	const flexGapNotSupported = opts.flexGapNotSupported ? opts.flexGapNotSupported + " " : "";

	function getFlex(decl, obj) {
		if (decl.prop === "display" && decl.value === "flex" || decl.prop === "display" && decl.value === "inline-flex") {
			obj.hasFlex = true;
		}
	}

	function getWidth(decl, obj) {
		if (decl.prop === "width" || decl.prop === "max-width" || decl.prop === "min-width") {
			obj.hasWidth = true
		}
		if (decl.prop === "height" || decl.prop === "max-height" || decl.prop === "min-height") {
			obj.hasHeight = true
		}
	}

	function getGap(decl, obj) {
		if (decl.prop === "gap" || decl.prop === "column-gap" || decl.prop === "row-gap") {
			obj.hasGap = true;
			if (decl.prop === "row-gap") {
				obj.gapValues[0] = decl.value
			}

			if (decl.prop === "column-gap") {
				obj.gapValues[1] = decl.value
			}

			if (decl.prop === "gap") {
				obj.gapValues = postcss.list.space(decl.value);
				if (obj.gapValues.length === 1) {
					obj.gapValues.push(obj.gapValues[0]);
				}
			}

		}
	}

	function getMargin(decl, obj) {
		if (decl.prop === "margin" || decl.prop === "margin-left" || decl.prop === "margin-top") {
			var value;
			obj.hasMargin = true
			if (decl.prop === "margin-top") {
				if (decl.value === "0") {
					value = '0px'
				}
				obj.marginValues[0] = value
			}

			if (decl.prop === "margin") {
				obj.marginValues = postcss.list.space(decl.value);

				if (decl.prop === "margin-left") {
					if (decl.value === "0") {
						value = '0px'
					}
					obj.marginValues[3] = value
				}

				if (obj.marginValues[0] === "0") {
					obj.marginValues[0] = '0px'
				}

				if (obj.marginValues[1] === "0") {
					obj.marginValues[1] = '0px'
				}

				switch (obj.marginValues.length) {
					case 1:
						obj.marginValues.push(obj.marginValues[0]);
					// falls through
					case 2:
						obj.marginValues.push(obj.marginValues[0]);
					// falls through
					case 3:
						obj.marginValues.push(obj.marginValues[1]);
				}
			}
		}
	}

	function getRules(decl, obj, root) {
		var fileName = root.source.input.file
		obj.rules.orig = decl.parent

		var selector;

		// These are needed to specifiy global scope for CSS modules
		var cssModule = "";
		var cssModuleEnd = ""

		if ((fileName && fileName.endsWith(".module.css")) && opts.flexGapNotSupported) {
			cssModule = ":global("
			cssModuleEnd = ") "
		}

		// if (obj.hasGap && obj.hasFlex) {
			selector = {
				container: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector}`,
				item: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector
					.split(",")
					.map((item) => `${item} > *`)
					.join(",")}`,
				reset: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector
					.split(",")
					.map((item) => `${item} > * > *`)
					.join(",")}`,
			};

			if (opts.webComponents) {
				selector.item = `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector
					.split(",")
					.map((item) => `${item} > *`)
					.join(",")},
${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector
					.split(",")
					.map((item) => `${item} > ::slotted(*)`)
					.join(",")}`;
			}
		// }

		// if ((opts.tailwindCSS && /^.gap(?=\b|[0-9])/gmi.test(obj.rules.orig.selector) && !obj.hasFlex) || (obj.hasWidth || obj.hasHeight) || (opts.tailwindCSS && /^.-?m(y-[0-9]|x-[0-9]|-px|-[0-9].?[0-9]?)/gmi.test(obj.rules.orig.selector) && !obj.hasFlex)) {
		// 	selector = {
		// 		container: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector}, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector}`,
		// 		item: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > *, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > *`,
		// 		reset: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > * > *, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > * > *`,
		// 		slotted: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > ::slotted(*), ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > ::slotted(*)`
		// 	};
		// }

		obj.rules.container = postcss.rule({ selector: selector.container });
		obj.rules.item = postcss.rule({ selector: selector.item });
		obj.rules.reset = postcss.rule({ selector: selector.reset });

		obj.rules.container.prepend(postcss.comment({ text: 'added by fgp' }))
		obj.rules.item.prepend(postcss.comment({ text: 'added by fgp' }))
		obj.rules.reset.prepend(postcss.comment({ text: 'added by fgp' }))
	}

	function addRootSelector(root, rule) {
		var fileName = root.source.input.file

		// This avoids adding :root selector to module files used by Next.js
		if (!(fileName && (fileName.endsWith(".module.css") || fileName.endsWith(".module.scss") || fileName.endsWith(".module.sass") || fileName.endsWith(".module.pcss") ))) {
			const rootRule = postcss.rule({ selector: ":root" });

			rule.before(rootRule);
			rootRule.prepend(postcss.comment({ text: 'added by fgp' }))

			rootRule.append(
				`--has-fgp: initial;
				--element-has-fgp: initial;
				--parent-has-fgp: initial;`
			);

			rootRule.walk(i => { i.raws.before = "\n\t"; });

		}
	}

	function addWidth(rule, obj) {

		if (obj.hasWidth || obj.hasHeight) {
			rule.walkDecls((decl) => {

				var value = parse(decl.value).nodes[0];
				let prop = decl.prop;

				if (decl.value === 0) {
					decl.value = "0px";
				}

				let { orig, container } = obj.rules

				orig.before(container);

				let axis = prop === "width" ? "column" : "row";

				if (decl.prop === "width" || decl.prop === "height" || decl.prop === "max-height" || decl.prop === "min-height" || decl.prop === "max-width" || decl.prop === "min-width") {
					// Percentages

					if (value.unit === "%") {
						container.append(
							`--${pf}${prop}: var(--element-has-fgp) calc(${decl.value} + var(--${pf}gap-${axis}, 0%));`
						);

						// var precentageToDecimal = value.value / 100

						// Sort of a guess for forumla when width is a percentage
						// container.append(
						// 	`--${pf}${prop}: var(--element-has-fgp) calc((${decl.value} - ${precentageToDecimal}%) + (1.0${value.value} * var(--${pf}gap-${axis}, 0%)));`
						// );
						// container.append(
						// 	`--${pf}${prop}-percentages-decimal: ${value.number / 100} !important;`
						// );

						// reset.append(
						// 	`--${pf}${prop}-percentages-decimal: initial;`
						// );
					}

					// Pixels, Ems
					else {
						container.append(
							`--${pf}${prop}: var(--element-has-fgp) calc(${decl.value} + var(--${pf}gap-${axis}, 0%));`
						);

						// 			container.append(
						// 				`--${pf}gap-percentage-to-pixels-column: calc(-1 * ${decl.value} * var(${pf}gap_percentage-decimal-${axis})) !important;
						// ${pf}gap-percentage-to-pixels-row: calc(-1 * ${decl.value} * var(${pf}gap-percentage-decimal-${axis})) !important;`
						// 			);

						// 			reset.append(
						// 				`--${pf}gap-percentage-to-pixels-column: initial;
						// ${pf}gap-percentage-to-pixels-row: initial;`
						// 			);
					}

					decl.value = `var(--fgp-${prop}, ${decl.value})`

					container.walk(i => { i.raws.before = "\n\t"; });
					// reset.walk(i => { i.raws.before = "\n\t"; });
					// decl.remove()
				}
			})
		}
	}

	function rewriteFlex(rule, obj) {

		rule.walkDecls((decl) => {
			if (decl.prop === "display" && decl.value === "flex" || decl.prop === "display" && decl.value === "inline-flex") {

				obj.rules.container.append(`--has-fgp: ;`)
				obj.rules.container.append(`--element-has-fgp: ;`)

				obj.rules.item.append(`--parent-has-fgp: !important;`)
				obj.rules.item.append(`--element-has-fgp: initial;`)

				obj.rules.reset.append(`--parent-has-fgp: initial;`)

			}

		})
	}

	function rewriteMargin(rule, obj) {

		let { orig, container, item, reset} = obj.rules

		// 1. Replace existing margin-left and margin-top
		orig.walkDecls((decl) => {
			if (decl.prop === "margin-top" || decl.prop === "margin-left") {
				// don't do this is margin is auto because cannot calc with auto
				if (decl.value !== "auto") {
					var value = decl.value;
					if (value === "0") {
						value = "0px";
					}
					decl.before(`--${pf}${decl.prop}: initial;`)
					decl.before(`--orig-${decl.prop}: ${value};`);
					decl.value = `var(--${pf}${decl.prop}, var(--orig-${decl.prop}))`

					item.append(`--orig-${decl.prop}: initial;`)
				}
			}

			if (decl.prop === "margin") {
				// TODO: Need to catch when value is auto as can't work with calc
				decl.before(`--${pf}margin-top: initial;`);
				decl.before(`--${pf}margin-left: initial;`);
					decl.before(`--orig-margin-top: ${obj.marginValues[0]};`);
					decl.before(`--orig-margin-right: ${obj.marginValues[1]};`);
					decl.before(`--orig-margin-bottom: ${obj.marginValues[2]};`);
					decl.before(`--orig-margin-left: ${obj.marginValues[3]};`);
				decl.value = `var(--${pf}margin-top, var(--orig-margin-top)) var(--orig-margin-right) var(--orig-margin-bottom) var(--${pf}margin-left, var(--orig-margin-left))`

				item.append(`--orig-margin-top: initial;`)
				item.append(`--orig-margin-right: initial;`)
				item.append(`--orig-margin-bottom: initial;`)
				item.append(`--orig-margin-left: initial;`)
			}
		})

		// 2. Add margin when gap present
		const properties = [
			["row", "top"],
			["column", "left"]
		];

		// Disable gap when element has display flex
		// TODO: Needs modifying to work on gap shorthand
		orig.walkDecls((decl) => {
			if (decl.prop === "gap" || decl.prop === "row-gap" || decl.prop === "column-gap") {
				// don't do this is margin is auto because cannot calc with auto
				decl.before(`--${pf}${decl.prop}: var(--has-fgp, ${decl.value})`)
				decl.value = `var(--${pf}${decl.prop}, 0px)`
			}
		})

		if (obj.hasFlex || obj.hasGap) {
		container.append(`pointer-events: var(--has-fgp) none;`)
		item.append(`pointer-events: var(--parent-has-fgp) auto;`)
		}

		properties.forEach((property, index) => {
			var axis = property[0];
			var side = property[1];
			var value = obj.gapValues[index];
			var gapNumber = axis === "row" ? 0 : 1;
			var marginNumber = axis === "row" ? 0 : 3;
			if (value === "0") {
				value = "0px";
			}

			// Only add if gap is not null
			if ((obj.gapValues[gapNumber] !== null)) {

				// Don't add margin if rule already contains margin
				if (!obj.marginValues[marginNumber] && obj.marginValues[marginNumber] !== 0) {
					orig.append(`margin-${side}: var(--${pf}margin-${side}, var(--orig-margin-${side}));`)
				}

				if (parse(value).nodes[0].unit === "%") {
					var unitlessPercentage = parse(value).nodes[0].value / 100
					// formula: (parent - self) / (100 - 1 + percentageAsDecimal) * 100
					if (side !== "top") {
						container.append(
							`--${pf}gap-${axis}: ${value};
						--${pf}-parent-gap-as-decimal: ${unitlessPercentage};
						`)
						container.append(`--${pf}margin-${side}: calc(
						(var(--${pf}parent-gap-${axis}, 0px) - var(--${pf}gap-${axis}) / (100 - (1 + ${unitlessPercentage})) * 100)
						+ var(--${pf}orig-margin-${side}, 0px)
						) !important`
						);
					}

				}
				else {
					// formula: (parent - self)
					container.append(
						`--${pf}gap-${axis}: ${value};`
					)
					container.append(`--${pf}margin-${side}: var(--has-fgp) calc(var(--${pf}parent-gap-${axis}, 0px) / (1 + var(--${pf}-parent-gap-as-decimal, 0)) - var(--${pf}gap-${axis}) + var(--orig-margin-${side}, 0px)) !important;`
						);
				}

				if (parse(value).nodes[0].unit === "%") {
					if (side !== "top") {
						item.append(
							`--${pf}parent-gap-${axis}: ${value};
					--${pf}margin-${side}: var(--parent-has-fgp) calc(var(--${pf}gap-${axis}) / (1 + ${unitlessPercentage}) + var(--orig-margin-${side}, 0px));`
						)
					}
				}
				else {
					item.append(
						`--${pf}parent-gap-${axis}: ${value};
					--${pf}margin-${side}: var(--parent-has-fgp) calc(var(--${pf}gap-${axis}) + var(--orig-margin-${side}, 0px));`
					)
				}

				// Add margin to items
				item.append(`margin-${side}: var(--${pf}margin-${side});`)

				// // Reset fgp margins
				// reset.append(`--${pf}margin-${side}: initial`)

				// // Reset fgp parent gap
				reset.append(`--${pf}parent-gap-${axis}: initial`)

			}
		})

	}

	return {
		postcssPlugin: 'postcss-gap',
		Once(root) {

			var rootAdded = false;
			root.walkRules(rule => {
				if (rule.name !== 'import' && !rootAdded) {
					addRootSelector(root, rule)
					rootAdded = true
				}

			})

			root.walkRules(rule => {

				// To check if rule original or added by plugin
				var origRule = true;
				rule.walkDecls(decl => {
					if (decl.prop.startsWith("--fgp") || decl.prop.startsWith("--has")) {
						origRule = false;
					}
				})

				rule.walkComments(comment => {
					if (comment.text === "added by fgp") {
						origRule = false;
					}
				})

				var shouldPolyfill = false;

				if (Array.isArray(opts.only) || opts.only === true) {
					shouldPolyfill = false
				}

				if (origRule) {
					var obj = {
						rules: {},
						gapValues: [null, null],
						marginValues: [null, null, null, null],
						hasGap: false,
						hasFlex: false,
						hasMargin: false,
						shouldPolyfill: shouldPolyfill
					}

					rule.walkDecls((decl) => {
						getRules(decl, obj, root)
						getFlex(decl, obj);
						getGap(decl, obj)
						getMargin(decl, obj)
						getWidth(decl, obj)
					});

					if (Array.isArray(opts.only) || opts.only === true) {
						if (obj.hasFlex && obj.hasGap) {
							obj.shouldPolyfill = true
						}
					}
					else {
						if (obj.hasFlex || obj.hasMargin || obj.hasGap || obj.hasWidth || obj.hasHeight) {
							obj.shouldPolyfill = true
						}
					}

					if (Array.isArray(opts.only)) {
						if (opts.only.includes(rule.selector) || opts.only.some((item) => {
							if (item instanceof RegExp) {
								return item.test(rule.selector)
							}
						})) {
							obj.shouldPolyfill = true
						}

					}

					// If rule contains comment /* apply fgp */ then polyfill it
					rule.walkComments(comment => {
						if (comment.text === "apply fgp") {
							comment.remove()
							obj.shouldPolyfill = true;
						}
					})

					if (obj.shouldPolyfill) {
						addWidth(rule, obj);
						rewriteFlex(rule, obj)
						// addMargin(rule, obj)
						rewriteMargin(rule, obj)

						if ((obj.hasFlex || obj.hasGap || obj.hasMargin) || !(obj.hasWidth || obj.hasHeight)) {
							if (!(obj.hasMargin && !obj.hasFlex && !obj.hasGap)) {
								obj.rules.orig.before(obj.rules.container);

								obj.rules.container.before(obj.rules.item);

								obj.rules.item.before(obj.rules.reset);
							}

							if (obj.hasFlex) {
								obj.rules.item.before(obj.rules.reset);
							}

							if (obj.hasMargin && !obj.hasFlex && !obj.hasGap) {
								obj.rules.orig.before(obj.rules.item);
							}

							// Clean
							obj.rules.orig.walk(i => {
								return i.raws.before = "\n\t"
							});
							obj.rules.container.walk(i => { i.raws.before = "\n\t" });
							obj.rules.item.walk(i => { i.raws.before = "\n\t" });
							obj.rules.reset.walk(i => { i.raws.before = "\n\t" });
						}

					}
				}
			})
		}
	}
}

module.exports.postcss = true


text:
:root {
	/* added by fgp */
	--has-fgp: initial;
	--element-has-fgp: initial;
	--parent-has-fgp: initial;
}

.flex-gap-not-supported .pixels > * {
	/* added by fgp */
	--parent-has-fgp: !important;
	--element-has-fgp: initial;
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 20px;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 20px;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}

.flex-gap-not-supported .pixels > * > * {
	/* added by fgp */
	--parent-has-fgp: initial;
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}

.flex-gap-not-supported .pixels {
	/* added by fgp */
	--has-fgp: ;
	--element-has-fgp: ;
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 20px;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 20px;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}

.pixels {
	display: flex;
	--fgp-gap: var(--has-fgp, 20px);
	gap: var(--fgp-gap, 0px);
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}

.flex-gap-not-supported .width-400 {
	/* added by fgp */
	--fgp-width: var(--element-has-fgp) calc(400px + var(--fgp-gap-column, 0%));
}

.width-400 {
	width: var(--fgp-width, 400px);
}


text:
.gap-and-no-flex {
	gap: 20px;
}

.flex-and-gap {
	display: flex;
	gap: 20px;
	margin-top: 1em;
}

.gap-and-no-flex {
	margin-top: 20px;
	margin-left: 1em;
	margin-right: 2em;
}

.width-400 {
	width: 400px;
}


text:
.test {
	--thingy: 200px;
	width: var(--thingy);
	height: var(--thingy);
}


text:
.pixels {
	display: flex;
	gap: 20px;
}

.width-400 {
	width: 400px;
}


text:
.flex,
[anyPrefix-flex~="~"] {
  display: flex;
}
.flex-col,
[anyPrefix-flex~="col"] {
  flex-direction: column;
}
.gap-8 {
  grid-gap: 2rem;
  gap: 2rem;
}


text:
/* TailwindCSS Test*/
.gap-1 {
	row-gap: 20px;
	column-gap: 20px;
}

.g_20px {
	display: flex;
	--has-display-flex: ;
	/* gap: 20px 10px; */
	row-gap: 20px;
	column-gap: 20px;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_20px {
	--fgp-gap-row: 20px;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 20px;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_20px > * {
	--fl-row-gap: 20px;
	--fl-column-gap: 20px;
}

.g_40px {
	display: flex;
	--has-display-flex: ;
	/* gap: 40px 10px; */
	row-gap: 40px;
	column-gap: 40px;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_40px {
	--fgp-gap-row: 40px;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 40px;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_40px > * {
	--fl-row-gap: 40px;
	--fl-column-gap: 40px;
}

.g_10\% {
	display: flex;
	--has-display-flex: ;
	gap: 10%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_10\% {
	--fgp-gap-row: 10%;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 10%;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_10\% > * {
	--fl-row-gap: 10%;
	--fl-column-gap: 10%;
}

.g_30\% {
	display: flex;
	--has-display-flex: ;
	gap: 30%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_30\% {
	--fgp-gap-row: 30%;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 30%;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_30\% > * {
	--fl-row-gap: 30%;
	--fl-column-gap: 30%;
}

.g_25\% {
	display: flex;
	--has-display-flex: ;
	gap: 25%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_25\% {
	--fgp-gap-row: 25%;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 25%;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_25\% > * {
	--fl-row-gap: 25%;
	--fl-column-gap: 25%;
}

.g_3\% {
	display: flex;
	--has-display-flex: ;
	gap: 3%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_3\% {
	--fgp-gap-row: 3%;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 3%;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_3\% > * {
	--fl-row-gap: 3%;
	--fl-column-gap: 3%;
}

.g_6\% {
	display: flex;
	--has-display-flex: ;
	gap: 6%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .g_6\% {
	--fgp-gap-row: 6%;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
	--fgp-gap-column: 6%;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.g_6\% > * {
	--fl-row-gap: 6%;
	--fl-column-gap: 6%;
}

.r_20px {
	display: flex;
	--has-display-flex: ;
	row-gap: 20px;
	--fl-row-gap: 0px;
	margin-top: var(--has-display-flex) calc(var(--orig-margin-top, 0px) + var(--fgp-margin-top));
}

.flexGapNotSupported .r_20px {
	--fgp-gap-row: 20px;
	--fgp-margin-top: calc(var(--fgp-parent-gap-row, 0px) - var(--fgp-gap-row) + var(--fgp-orig-margin-top)) !important;
}

.c_20px {
	display: flex;
	--has-display-flex: ;
	column-gap: 20px;
	--fl-column-gap: 0px;
	margin-left: var(--has-display-flex) calc(var(--orig-margin-left, 0px) + var(--fgp-margin-left));
}

.flexGapNotSupported .c_20px {
	--fgp-gap-column: 20px;
	--fgp-margin-left: calc(var(--fgp-parent-gap-column, 0px) - var(--fgp-gap-column) + var(--fgp-orig-margin-left)) !important;
}

.w_400px {
	width: 400px;
}

.w_600px {
	width: 600px;
}

.w_800px {
	width: 800px;
}

.w_25\% {
	width: 25%;
}

.w_50\% {
	width: 50%;
}

.wg_400px {
	width: calc(400px - var(--fl-column-gap));
}

.wg_600px {
	width: calc(600px - var(--fl-column-gap));
}

.wg_800px {
	width: calc(800px - var(--fl-column-gap));
}

.wg_25\% {
	width: calc(25% - var(--fl-column-gap));
}

.wg_50\% {
	width: calc(50% - var(--fl-column-gap));
}

.w_auto {
	width: auto;
}

.w_fit-content {
	width: fit-content;
}

.w_max-content {
	width: max-content;
}


text:
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');

:root{
	/* added by fgp */
	--has-fgp: initial;
	--element-has-fgp: initial;
	--parent-has-fgp: initial;
}

.gap-8 > * > *{
	/* added by fgp */
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}

.gap-8 > *{
	/* added by fgp */
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 2em;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 2em;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}

.gap-8{
	/* added by fgp */
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 2em;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 2em;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}

.gap-8 {
	--fgp-gap: var(--has-fgp, 2em);
	gap: var(--fgp-gap, 0px);
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}

.flex {
	display: flex;
	--fgp-gap: var(--has-fgp, 2em);
	gap: var(--fgp-gap, 0px);
	width: var(--fgp-width, 200px);
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}

.flex > *{
	/* added by fgp */
	--parent-has-fgp: !important;
	--element-has-fgp: initial;
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 2em;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 2em;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}

.flex > * > *{
	/* added by fgp */
	--parent-has-fgp: initial;
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}

.flex{
	/* added by fgp */
	--fgp-width: var(--element-has-fgp) calc(200px + var(--fgp-gap-column, 0%));
	--has-fgp: ;
	--element-has-fgp: ;
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 2em;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 2em;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}

.test{
	/* added by fgp */
	--fgp-width: var(--element-has-fgp) calc(200px + var(--fgp-gap-column, 0%));
}

.test {
	width: var(--fgp-width, 200px);
}


text:
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');

.gap-8 {
	/* apply fgp */
	gap: 2em;
}

.flex {
	display: flex;
	gap: 2em;
	width: 200px;
}

.test {
	width: 200px;
}


text:
:root {
	/* added by fgp */
	--has-fgp: initial;
	--element-has-fgp: initial;
	--parent-has-fgp: initial;
}
.test {
	/* added by fgp */
	--fgp-width: var(--element-has-fgp) calc(var(--thingy) + var(--fgp-gap-column, 0%));
	--fgp-height: var(--element-has-fgp) calc(var(--thingy) + var(--fgp-gap-row, 0%));
}
.test {
	--thingy: 200px;
	width: var(--fgp-width, var(--thingy));
	height: var(--fgp-height, var(--thingy));
}


text:
/* TailwindCSS Test*/
.gap-1 {
	row-gap: 20px;
	column-gap: 20px;
}

.g_20px {
	display: flex;
	/* gap: 20px 10px; */
	row-gap: 20px;
	column-gap: 20px;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_20px > * {
	--fl-row-gap: 20px;
	--fl-column-gap: 20px;
}

.g_40px {
	display: flex;
	/* gap: 40px 10px; */
	row-gap: 40px;
	column-gap: 40px;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_40px > * {
	--fl-row-gap: 40px;
	--fl-column-gap: 40px;
}

.g_10\% {
	display: flex;
	gap: 10%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_10\% > * {
	--fl-row-gap: 10%;
	--fl-column-gap: 10%;
}

.g_30\% {
	display: flex;
	gap: 30%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_30\% > * {
	--fl-row-gap: 30%;
	--fl-column-gap: 30%;
}

.g_25\% {
	display: flex;
	gap: 25%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_25\% > * {
	--fl-row-gap: 25%;
	--fl-column-gap: 25%;
}

.g_3\% {
	display: flex;
	gap: 3%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_3\% > * {
	--fl-row-gap: 3%;
	--fl-column-gap: 3%;
}

.g_6\% {
	display: flex;
	gap: 6%;
	--fl-row-gap: 0px;
	--fl-column-gap: 0px;
}

.g_6\% > * {
	--fl-row-gap: 6%;
	--fl-column-gap: 6%;
}

.r_20px {
	display: flex;
	row-gap: 20px;
	--fl-row-gap: 0px;
}

.c_20px {
	display: flex;
	column-gap: 20px;
	--fl-column-gap: 0px;
}

.w_400px {
	width: 400px;
}

.w_600px {
	width: 600px;
}

.w_800px {
	width: 800px;
}

.w_25\% {
	width: 25%;
}

.w_50\% {
	width: 50%;
}

.wg_400px {
	width: calc(400px - var(--fl-column-gap));
}

.wg_600px {
	width: calc(600px - var(--fl-column-gap));
}

.wg_800px {
	width: calc(800px - var(--fl-column-gap));
}

.wg_25\% {
	width: calc(25% - var(--fl-column-gap));
}

.wg_50\% {
	width: calc(50% - var(--fl-column-gap));
}

.w_auto {
	width: auto;
}

.w_fit-content {
	width: fit-content;
}

.w_max-content {
	width: max-content;
}


text:
:root {
	/* added by fgp */
	--has-fgp: initial;
	--element-has-fgp: initial;
	--parent-has-fgp: initial;
}

.gap-and-no-flex > * > * {
	/* added by fgp */
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}

.gap-and-no-flex > *,
.gap-and-no-flex > ::slotted(*) {
	/* added by fgp */
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 20px;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 20px;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}

.gap-and-no-flex {
	/* added by fgp */
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 20px;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 20px;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}

.gap-and-no-flex {
	--fgp-gap: var(--has-fgp, 20px);
	gap: var(--fgp-gap, 0px);
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}

.flex-and-gap > *,
.flex-and-gap > ::slotted(*) {
	/* added by fgp */
	--parent-has-fgp: !important;
	--element-has-fgp: initial;
	--orig-margin-top: initial;
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 20px;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 20px;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}

.flex-and-gap > * > * {
	/* added by fgp */
	--parent-has-fgp: initial;
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}

.flex-and-gap {
	/* added by fgp */
	--has-fgp: ;
	--element-has-fgp: ;
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 20px;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 20px;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}

.flex-and-gap {
	display: flex;
	--fgp-gap: var(--has-fgp, 20px);
	gap: var(--fgp-gap, 0px);
	--fgp-margin-top: initial;
	--orig-margin-top: 1em;
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}

.gap-and-no-flex > *,
.gap-and-no-flex > ::slotted(*) {
	/* added by fgp */
	--orig-margin-top: initial;
	--orig-margin-left: initial;
}

.gap-and-no-flex {
	--fgp-margin-top: initial;
	--orig-margin-top: 20px;
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	--fgp-margin-left: initial;
	--orig-margin-left: 1em;
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
	margin-right: 2em;
}

.width-400 {
	/* added by fgp */
	--fgp-width: var(--element-has-fgp) calc(400px + var(--fgp-gap-column, 0%));
}

.width-400 {
	width: var(--fgp-width, 400px);
}


text:
:root {
	/* added by fgp */
	--has-fgp: initial;
	--element-has-fgp: initial;
	--parent-has-fgp: initial;
}
.flex > *,
[anyPrefix-flex~="~"] > * {
	/* added by fgp */
	--parent-has-fgp: !important;
	--element-has-fgp: initial;
	pointer-events: var(--parent-has-fgp) auto;
}
.flex > * > *,
[anyPrefix-flex~="~"] > * > * {
	/* added by fgp */
	--parent-has-fgp: initial;
}
.flex,
[anyPrefix-flex~="~"] {
	/* added by fgp */
	--has-fgp: ;
	--element-has-fgp: ;
	pointer-events: var(--has-fgp) none;
}
.flex,
[anyPrefix-flex~="~"] {
	display: flex;
}
.flex-col,
[anyPrefix-flex~="col"] {
  flex-direction: column;
}
.gap-8 > * > * {
	/* added by fgp */
	--fgp-parent-gap-row: initial;
	--fgp-parent-gap-column: initial;
}
.gap-8 > * {
	/* added by fgp */
	pointer-events: var(--parent-has-fgp) auto;
	--fgp-parent-gap-row: 2rem;
	--fgp-margin-top: var(--parent-has-fgp) calc(var(--fgp-gap-row) + var(--orig-margin-top, 0px));
	margin-top: var(--fgp-margin-top);
	--fgp-parent-gap-column: 2rem;
	--fgp-margin-left: var(--parent-has-fgp) calc(var(--fgp-gap-column) + var(--orig-margin-left, 0px));
	margin-left: var(--fgp-margin-left);
}
.gap-8 {
	/* added by fgp */
	pointer-events: var(--has-fgp) none;
	--fgp-gap-row: 2rem;
	--fgp-margin-top: var(--has-fgp) calc(var(--fgp-parent-gap-row, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-row) + var(--orig-margin-top, 0px)) !important;
	--fgp-gap-column: 2rem;
	--fgp-margin-left: var(--has-fgp) calc(var(--fgp-parent-gap-column, 0px) / (1 + var(--fgp--parent-gap-as-decimal, 0)) - var(--fgp-gap-column) + var(--orig-margin-left, 0px)) !important;
}
.gap-8 {
	grid-gap: 2rem;
	--fgp-gap: var(--has-fgp, 2rem);
	gap: var(--fgp-gap, 0px);
	margin-top: var(--fgp-margin-top, var(--orig-margin-top));
	margin-left: var(--fgp-margin-left, var(--orig-margin-left));
}


text:
var postcss = require('postcss');
var postcssValuesParser = require('postcss-values-parser');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var postcss__default = /*#__PURE__*/_interopDefaultLegacy(postcss);

// TODO: To support Tailwind need to cover all variants of class names including device eg md:. margin, width, flex, height
// TODO: Test with example repos
// TODO: Check webComponents option works
// TODO: Check works with tailwind

module.exports = (opts = {}) => {
  opts = opts || {};
  const pf = "fgp-";
  const flexGapNotSupported = opts.flexGapNotSupported ? opts.flexGapNotSupported + " " : "";

  function getFlex(decl, obj) {
    if (decl.prop === "display" && decl.value === "flex" || decl.prop === "display" && decl.value === "inline-flex") {
      obj.hasFlex = true;
    }
  }

  function getWidth(decl, obj) {
    if (decl.prop === "width" || decl.prop === "max-width" || decl.prop === "min-width") {
      obj.hasWidth = true;
    }

    if (decl.prop === "height" || decl.prop === "max-height" || decl.prop === "min-height") {
      obj.hasHeight = true;
    }
  }

  function getGap(decl, obj) {
    if (decl.prop === "gap" || decl.prop === "column-gap" || decl.prop === "row-gap") {
      obj.hasGap = true;

      if (decl.prop === "row-gap") {
        obj.gapValues[0] = decl.value;
      }

      if (decl.prop === "column-gap") {
        obj.gapValues[1] = decl.value;
      }

      if (decl.prop === "gap") {
        obj.gapValues = postcss__default['default'].list.space(decl.value);

        if (obj.gapValues.length === 1) {
          obj.gapValues.push(obj.gapValues[0]);
        }
      }
    }
  }

  function getMargin(decl, obj) {
    if (decl.prop === "margin" || decl.prop === "margin-left" || decl.prop === "margin-top") {
      var value;
      obj.hasMargin = true;

      if (decl.prop === "margin-top") {
        if (decl.value === "0") {
          value = '0px';
        }

        obj.marginValues[0] = value;
      }

      if (decl.prop === "margin") {
        obj.marginValues = postcss__default['default'].list.space(decl.value);

        if (decl.prop === "margin-left") {
          if (decl.value === "0") {
            value = '0px';
          }

          obj.marginValues[3] = value;
        }

        if (obj.marginValues[0] === "0") {
          obj.marginValues[0] = '0px';
        }

        if (obj.marginValues[1] === "0") {
          obj.marginValues[1] = '0px';
        }

        switch (obj.marginValues.length) {
          case 1:
            obj.marginValues.push(obj.marginValues[0]);
          // falls through

          case 2:
            obj.marginValues.push(obj.marginValues[0]);
          // falls through

          case 3:
            obj.marginValues.push(obj.marginValues[1]);
        }
      }
    }
  }

  function getRules(decl, obj, root) {
    var fileName = root.source.input.file;
    obj.rules.orig = decl.parent;
    var selector; // These are needed to specifiy global scope for CSS modules

    var cssModule = "";
    var cssModuleEnd = "";

    if (fileName && fileName.endsWith(".module.css") && opts.flexGapNotSupported) {
      cssModule = ":global(";
      cssModuleEnd = ") ";
    } // if (obj.hasGap && obj.hasFlex) {

    selector = {
      container: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector}`,
      item: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector.split(",").map(item => `${item} > *`).join(",")}`,
      reset: `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector.split(",").map(item => `${item} > * > *`).join(",")}`
    };

    if (opts.webComponents) {
      selector.item = `${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector.split(",").map(item => `${item} > *`).join(",")},
${cssModule}${flexGapNotSupported}${cssModuleEnd}${obj.rules.orig.selector.split(",").map(item => `${item} > ::slotted(*)`).join(",")}`;
    } // }
    // if ((opts.tailwindCSS && /^.gap(?=\b|[0-9])/gmi.test(obj.rules.orig.selector) && !obj.hasFlex) || (obj.hasWidth || obj.hasHeight) || (opts.tailwindCSS && /^.-?m(y-[0-9]|x-[0-9]|-px|-[0-9].?[0-9]?)/gmi.test(obj.rules.orig.selector) && !obj.hasFlex)) {
    // 	selector = {
    // 		container: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector}, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector}`,
    // 		item: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > *, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > *`,
    // 		reset: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > * > *, ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > * > *`,
    // 		slotted: `${cssModule}${flexGapNotSupported}${cssModuleEnd}.flex${obj.rules.orig.selector} > ::slotted(*), ${cssModule}${flexGapNotSupported}${cssModuleEnd}.inline-flex${obj.rules.orig.selector} > ::slotted(*)`
    // 	};
    // }

    obj.rules.container = postcss__default['default'].rule({
      selector: selector.container
    });
    obj.rules.item = postcss__default['default'].rule({
      selector: selector.item
    });
    obj.rules.reset = postcss__default['default'].rule({
      selector: selector.reset
    });
    obj.rules.container.prepend(postcss__default['default'].comment({
      text: 'added by fgp'
    }));
    obj.rules.item.prepend(postcss__default['default'].comment({
      text: 'added by fgp'
    }));
    obj.rules.reset.prepend(postcss__default['default'].comment({
      text: 'added by fgp'
    }));
  }

  function addRootSelector(root, rule) {
    var fileName = root.source.input.file; // This avoids adding :root selector to module files used by Next.js

    if (!(fileName && (fileName.endsWith(".module.css") || fileName.endsWith(".module.scss") || fileName.endsWith(".module.sass") || fileName.endsWith(".module.pcss")))) {
      const rootRule = postcss__default['default'].rule({
        selector: ":root"
      });
      rule.before(rootRule);
      rootRule.prepend(postcss__default['default'].comment({
        text: 'added by fgp'
      }));
      rootRule.append(`--has-fgp: initial;
				--element-has-fgp: initial;
				--parent-has-fgp: initial;`);
      rootRule.walk(i => {
        i.raws.before = "\n\t";
      });
    }
  }

  function addWidth(rule, obj) {
    if (obj.hasWidth || obj.hasHeight) {
      rule.walkDecls(decl => {
        var value = postcssValuesParser.parse(decl.value).nodes[0];
        let prop = decl.prop;

        if (decl.value === 0) {
          decl.value = "0px";
        }

        let {
          orig,
          container
        } = obj.rules;
        orig.before(container);
        let axis = prop === "width" ? "column" : "row";

        if (decl.prop === "width" || decl.prop === "height" || decl.prop === "max-height" || decl.prop === "min-height" || decl.prop === "max-width" || decl.prop === "min-width") {
          // Percentages
          if (value.unit === "%") {
            container.append(`--${pf}${prop}: var(--element-has-fgp) calc(${decl.value} + var(--${pf}gap-${axis}, 0%));`); // var precentageToDecimal = value.value / 100
            // Sort of a guess for forumla when width is a percentage
            // container.append(
            // 	`--${pf}${prop}: var(--element-has-fgp) calc((${decl.value} - ${precentageToDecimal}%) + (1.0${value.value} * var(--${pf}gap-${axis}, 0%)));`
            // );
            // container.append(
            // 	`--${pf}${prop}-percentages-decimal: ${value.number / 100} !important;`
            // );
            // reset.append(
            // 	`--${pf}${prop}-percentages-decimal: initial;`
            // );
          } // Pixels, Ems
          else {
              container.append(`--${pf}${prop}: var(--element-has-fgp) calc(${decl.value} + var(--${pf}gap-${axis}, 0%));`); // 			container.append(
              // 				`--${pf}gap-percentage-to-pixels-column: calc(-1 * ${decl.value} * var(${pf}gap_percentage-decimal-${axis})) !important;
              // ${pf}gap-percentage-to-pixels-row: calc(-1 * ${decl.value} * var(${pf}gap-percentage-decimal-${axis})) !important;`
              // 			);
              // 			reset.append(
              // 				`--${pf}gap-percentage-to-pixels-column: initial;
              // ${pf}gap-percentage-to-pixels-row: initial;`
              // 			);
            }

          decl.value = `var(--fgp-${prop}, ${decl.value})`;
          container.walk(i => {
            i.raws.before = "\n\t";
          }); // reset.walk(i => { i.raws.before = "\n\t"; });
          // decl.remove()
        }
      });
    }
  }

  function rewriteFlex(rule, obj) {
    rule.walkDecls(decl => {
      if (decl.prop === "display" && decl.value === "flex" || decl.prop === "display" && decl.value === "inline-flex") {
        obj.rules.container.append(`--has-fgp: ;`);
        obj.rules.container.append(`--element-has-fgp: ;`);
        obj.rules.item.append(`--parent-has-fgp: !important;`);
        obj.rules.item.append(`--element-has-fgp: initial;`);
        obj.rules.reset.append(`--parent-has-fgp: initial;`);
      }
    });
  }

  function rewriteMargin(rule, obj) {
    let {
      orig,
      container,
      item,
      reset
    } = obj.rules; // 1. Replace existing margin-left and margin-top

    orig.walkDecls(decl => {
      if (decl.prop === "margin-top" || decl.prop === "margin-left") {
        // don't do this is margin is auto because cannot calc with auto
        if (decl.value !== "auto") {
          var value = decl.value;

          if (value === "0") {
            value = "0px";
          }

          decl.before(`--${pf}${decl.prop}: initial;`);
          decl.before(`--orig-${decl.prop}: ${value};`);
          decl.value = `var(--${pf}${decl.prop}, var(--orig-${decl.prop}))`;
          item.append(`--orig-${decl.prop}: initial;`);
        }
      }

      if (decl.prop === "margin") {
        // TODO: Need to catch when value is auto as can't work with calc
        decl.before(`--${pf}margin-top: initial;`);
        decl.before(`--${pf}margin-left: initial;`);
        decl.before(`--orig-margin-top: ${obj.marginValues[0]};`);
        decl.before(`--orig-margin-right: ${obj.marginValues[1]};`);
        decl.before(`--orig-margin-bottom: ${obj.marginValues[2]};`);
        decl.before(`--orig-margin-left: ${obj.marginValues[3]};`);
        decl.value = `var(--${pf}margin-top, var(--orig-margin-top)) var(--orig-margin-right) var(--orig-margin-bottom) var(--${pf}margin-left, var(--orig-margin-left))`;
        item.append(`--orig-margin-top: initial;`);
        item.append(`--orig-margin-right: initial;`);
        item.append(`--orig-margin-bottom: initial;`);
        item.append(`--orig-margin-left: initial;`);
      }
    }); // 2. Add margin when gap present

    const properties = [["row", "top"], ["column", "left"]]; // Disable gap when element has display flex
    // TODO: Needs modifying to work on gap shorthand

    orig.walkDecls(decl => {
      if (decl.prop === "gap" || decl.prop === "row-gap" || decl.prop === "column-gap") {
        // don't do this is margin is auto because cannot calc with auto
        decl.before(`--${pf}${decl.prop}: var(--has-fgp, ${decl.value})`);
        decl.value = `var(--${pf}${decl.prop}, 0px)`;
      }
    });

    if (obj.hasFlex || obj.hasGap) {
      container.append(`pointer-events: var(--has-fgp) none;`);
      item.append(`pointer-events: var(--parent-has-fgp) auto;`);
    }

    properties.forEach((property, index) => {
      var axis = property[0];
      var side = property[1];
      var value = obj.gapValues[index];
      var gapNumber = axis === "row" ? 0 : 1;
      var marginNumber = axis === "row" ? 0 : 3;

      if (value === "0") {
        value = "0px";
      } // Only add if gap is not null

      if (obj.gapValues[gapNumber] !== null) {
        // Don't add margin if rule already contains margin
        if (!obj.marginValues[marginNumber] && obj.marginValues[marginNumber] !== 0) {
          orig.append(`margin-${side}: var(--${pf}margin-${side}, var(--orig-margin-${side}));`);
        }

        if (postcssValuesParser.parse(value).nodes[0].unit === "%") {
          var unitlessPercentage = postcssValuesParser.parse(value).nodes[0].value / 100; // formula: (parent - self) / (100 - 1 + percentageAsDecimal) * 100

          if (side !== "top") {
            container.append(`--${pf}gap-${axis}: ${value};
						--${pf}-parent-gap-as-decimal: ${unitlessPercentage};
						`);
            container.append(`--${pf}margin-${side}: calc(
						(var(--${pf}parent-gap-${axis}, 0px) - var(--${pf}gap-${axis}) / (100 - (1 + ${unitlessPercentage})) * 100)
						+ var(--${pf}orig-margin-${side}, 0px)
						) !important`);
          }
        } else {
          // formula: (parent - self)
          container.append(`--${pf}gap-${axis}: ${value};`);
          container.append(`--${pf}margin-${side}: var(--has-fgp) calc(var(--${pf}parent-gap-${axis}, 0px) / (1 + var(--${pf}-parent-gap-as-decimal, 0)) - var(--${pf}gap-${axis}) + var(--orig-margin-${side}, 0px)) !important;`);
        }

        if (postcssValuesParser.parse(value).nodes[0].unit === "%") {
          if (side !== "top") {
            item.append(`--${pf}parent-gap-${axis}: ${value};
					--${pf}margin-${side}: var(--parent-has-fgp) calc(var(--${pf}gap-${axis}) / (1 + ${unitlessPercentage}) + var(--orig-margin-${side}, 0px));`);
          }
        } else {
          item.append(`--${pf}parent-gap-${axis}: ${value};
					--${pf}margin-${side}: var(--parent-has-fgp) calc(var(--${pf}gap-${axis}) + var(--orig-margin-${side}, 0px));`);
        } // Add margin to items

        item.append(`margin-${side}: var(--${pf}margin-${side});`); // // Reset fgp margins
        // reset.append(`--${pf}margin-${side}: initial`)
        // // Reset fgp parent gap

        reset.append(`--${pf}parent-gap-${axis}: initial`);
      }
    });
  }

  return {
    postcssPlugin: 'postcss-gap',

    Once(root) {
      var rootAdded = false;
      root.walkRules(rule => {
        if (rule.name !== 'import' && !rootAdded) {
          addRootSelector(root, rule);
          rootAdded = true;
        }
      });
      root.walkRules(rule => {
        // To check if rule original or added by plugin
        var origRule = true;
        rule.walkDecls(decl => {
          if (decl.prop.startsWith("--fgp") || decl.prop.startsWith("--has")) {
            origRule = false;
          }
        });
        rule.walkComments(comment => {
          if (comment.text === "added by fgp") {
            origRule = false;
          }
        });
        var shouldPolyfill = false;

        if (Array.isArray(opts.only) || opts.only === true) {
          shouldPolyfill = false;
        }

        if (origRule) {
          var obj = {
            rules: {},
            gapValues: [null, null],
            marginValues: [null, null, null, null],
            hasGap: false,
            hasFlex: false,
            hasMargin: false,
            shouldPolyfill: shouldPolyfill
          };
          rule.walkDecls(decl => {
            getRules(decl, obj, root);
            getFlex(decl, obj);
            getGap(decl, obj);
            getMargin(decl, obj);
            getWidth(decl, obj);
          });

          if (Array.isArray(opts.only) || opts.only === true) {
            if (obj.hasFlex && obj.hasGap) {
              obj.shouldPolyfill = true;
            }
          } else {
            if (obj.hasFlex || obj.hasMargin || obj.hasGap || obj.hasWidth || obj.hasHeight) {
              obj.shouldPolyfill = true;
            }
          }

          if (Array.isArray(opts.only)) {
            if (opts.only.includes(rule.selector) || opts.only.some(item => {
              if (item instanceof RegExp) {
                return item.test(rule.selector);
              }
            })) {
              obj.shouldPolyfill = true;
            }
          } // If rule contains comment /* apply fgp */ then polyfill it

          rule.walkComments(comment => {
            if (comment.text === "apply fgp") {
              comment.remove();
              obj.shouldPolyfill = true;
            }
          });

          if (obj.shouldPolyfill) {
            addWidth(rule, obj);
            rewriteFlex(rule, obj); // addMargin(rule, obj)

            rewriteMargin(rule, obj);

            if (obj.hasFlex || obj.hasGap || obj.hasMargin || !(obj.hasWidth || obj.hasHeight)) {
              if (!(obj.hasMargin && !obj.hasFlex && !obj.hasGap)) {
                obj.rules.orig.before(obj.rules.container);
                obj.rules.container.before(obj.rules.item);
                obj.rules.item.before(obj.rules.reset);
              }

              if (obj.hasFlex) {
                obj.rules.item.before(obj.rules.reset);
              }

              if (obj.hasMargin && !obj.hasFlex && !obj.hasGap) {
                obj.rules.orig.before(obj.rules.item);
              } // Clean

              obj.rules.orig.walk(i => {
                return i.raws.before = "\n\t";
              });
              obj.rules.container.walk(i => {
                i.raws.before = "\n\t";
              });
              obj.rules.item.walk(i => {
                i.raws.before = "\n\t";
              });
              obj.rules.reset.walk(i => {
                i.raws.before = "\n\t";
              });
            }
          }
        }
      });
    }

  };
};

module.exports.postcss = true;
//# sourceMappingURL=index.js.map