autoprefixer 10.4.13 → 10.4.15

package/lib/hacks/gradient.js

@@ -9,145 +9,79 @@ let IS_DIRECTION = /top|left|right|bottom/gi
 
 class Gradient extends Value {
   /**
-   * Change degrees for webkit prefix
+   * Do not add non-webkit prefixes for list-style and object
    */
-  replace(string, prefix) {
-    let ast = parser(string)
-    for (let node of ast.nodes) {
-      let gradientName = this.name // gradient name
-      if (node.type === 'function' && node.value === gradientName) {
-        node.nodes = this.newDirection(node.nodes)
-        node.nodes = this.normalize(node.nodes, gradientName)
-        if (prefix === '-webkit- old') {
-          let changes = this.oldWebkit(node)
-          if (!changes) {
-            return false
-          }
-        } else {
-          node.nodes = this.convertDirection(node.nodes)
-          node.value = prefix + node.value
-        }
+  add(decl, prefix) {
+    let p = decl.prop
+    if (p.includes('mask')) {
+      if (prefix === '-webkit-' || prefix === '-webkit- old') {
+        return super.add(decl, prefix)
       }
-    }
-    return ast.toString()
-  }
-
-  /**
-   * Replace first token
-   */
-  replaceFirst(params, ...words) {
-    let prefix = words.map(i => {
-      if (i === ' ') {
-        return { type: 'space', value: i }
+    } else if (
+      p === 'list-style' ||
+      p === 'list-style-image' ||
+      p === 'content'
+    ) {
+      if (prefix === '-webkit-' || prefix === '-webkit- old') {
+        return super.add(decl, prefix)
       }
-      return { type: 'word', value: i }
-    })
-    return prefix.concat(params.slice(1))
-  }
-
-  /**
-   * Convert angle unit to deg
-   */
-  normalizeUnit(str, full) {
-    let num = parseFloat(str)
-    let deg = (num / full) * 360
-    return `${deg}deg`
+    } else {
+      return super.add(decl, prefix)
+    }
+    return undefined
   }
 
   /**
-   * Normalize angle
+   * Get div token from exists parameters
    */
-  normalize(nodes, gradientName) {
-    if (!nodes[0]) return nodes
-
-    if (/-?\d+(.\d+)?grad/.test(nodes[0].value)) {
-      nodes[0].value = this.normalizeUnit(nodes[0].value, 400)
-    } else if (/-?\d+(.\d+)?rad/.test(nodes[0].value)) {
-      nodes[0].value = this.normalizeUnit(nodes[0].value, 2 * Math.PI)
-    } else if (/-?\d+(.\d+)?turn/.test(nodes[0].value)) {
-      nodes[0].value = this.normalizeUnit(nodes[0].value, 1)
-    } else if (nodes[0].value.includes('deg')) {
-      let num = parseFloat(nodes[0].value)
-      num = range.wrap(0, 360, num)
-      nodes[0].value = `${num}deg`
-    }
-
-    if (
-      gradientName === 'linear-gradient' ||
-      gradientName === 'repeating-linear-gradient'
-    ) {
-      let direction = nodes[0].value
-
-      // Unitless zero for `<angle>` values are allowed in CSS gradients and transforms.
-      // Spec: https://github.com/w3c/csswg-drafts/commit/602789171429b2231223ab1e5acf8f7f11652eb3
-      if (direction === '0deg' || direction === '0') {
-        nodes = this.replaceFirst(nodes, 'to', ' ', 'top')
-      } else if (direction === '90deg') {
-        nodes = this.replaceFirst(nodes, 'to', ' ', 'right')
-      } else if (direction === '180deg') {
-        nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom') // default value
-      } else if (direction === '270deg') {
-        nodes = this.replaceFirst(nodes, 'to', ' ', 'left')
+  cloneDiv(params) {
+    for (let i of params) {
+      if (i.type === 'div' && i.value === ',') {
+        return i
       }
     }
-
-    return nodes
+    return { after: ' ', type: 'div', value: ',' }
   }
 
   /**
-   * Replace old direction to new
+   * Change colors syntax to old webkit
    */
-  newDirection(params) {
-    if (params[0].value === 'to') {
-      return params
-    }
-    IS_DIRECTION.lastIndex = 0 // reset search index of global regexp
-    if (!IS_DIRECTION.test(params[0].value)) {
-      return params
-    }
-
-    params.unshift(
-      {
-        type: 'word',
-        value: 'to'
-      },
-      {
-        type: 'space',
-        value: ' '
+  colorStops(params) {
+    let result = []
+    for (let i = 0; i < params.length; i++) {
+      let pos
+      let param = params[i]
+      let item
+      if (i === 0) {
+        continue
       }
-    )
 
-    for (let i = 2; i < params.length; i++) {
-      if (params[i].type === 'div') {
-        break
-      }
-      if (params[i].type === 'word') {
-        params[i].value = this.revertDirection(params[i].value)
+      let color = parser.stringify(param[0])
+      if (param[1] && param[1].type === 'word') {
+        pos = param[1].value
+      } else if (param[2] && param[2].type === 'word') {
+        pos = param[2].value
       }
-    }
-
-    return params
-  }
 
-  /**
-   * Look for at word
-   */
-  isRadial(params) {
-    let state = 'before'
-    for (let param of params) {
-      if (state === 'before' && param.type === 'space') {
-        state = 'at'
-      } else if (state === 'at' && param.value === 'at') {
-        state = 'after'
-      } else if (state === 'after' && param.type === 'space') {
-        return true
-      } else if (param.type === 'div') {
-        break
+      let stop
+      if (i === 1 && (!pos || pos === '0%')) {
+        stop = `from(${color})`
+      } else if (i === params.length - 1 && (!pos || pos === '100%')) {
+        stop = `to(${color})`
+      } else if (pos) {
+        stop = `color-stop(${pos}, ${color})`
       } else {
-        state = 'before'
+        stop = `color-stop(${color})`
+      }
+
+      let div = param[param.length - 1]
+      params[i] = [{ type: 'word', value: stop }]
+      if (div.type === 'div' && div.value === ',') {
+        item = params[i].push(div)
       }
+      result.push(item)
     }
-    return false
+    return result
   }
 
   /**
@@ -166,6 +100,17 @@ class Gradient extends Value {
     return params
   }
 
+  /**
+   * Add 90 degrees
+   */
+  fixAngle(params) {
+    let first = params[0].value
+    first = parseFloat(first)
+    first = Math.abs(450 - first) % 360
+    first = this.roundFloat(first, 3)
+    params[0].value = `${first}deg`
+  }
+
   /**
    * Replace `to top left` to `bottom right`
    */
@@ -182,17 +127,6 @@ class Gradient extends Value {
     }
   }
 
-  /**
-   * Add 90 degrees
-   */
-  fixAngle(params) {
-    let first = params[0].value
-    first = parseFloat(first)
-    first = Math.abs(450 - first) % 360
-    first = this.roundFloat(first, 3)
-    params[0].value = `${first}deg`
-  }
-
   /**
    * Fix radial direction syntax
    */
@@ -226,61 +160,136 @@ class Gradient extends Value {
     params.splice(0, i, ...second, div, ...first)
   }
 
-  revertDirection(word) {
-    return Gradient.directions[word.toLowerCase()] || word
+  /**
+   * Look for at word
+   */
+  isRadial(params) {
+    let state = 'before'
+    for (let param of params) {
+      if (state === 'before' && param.type === 'space') {
+        state = 'at'
+      } else if (state === 'at' && param.value === 'at') {
+        state = 'after'
+      } else if (state === 'after' && param.type === 'space') {
+        return true
+      } else if (param.type === 'div') {
+        break
+      } else {
+        state = 'before'
+      }
+    }
+    return false
   }
 
   /**
-   * Round float and save digits under dot
+   * Replace old direction to new
    */
-  roundFloat(float, digits) {
-    return parseFloat(float.toFixed(digits))
+  newDirection(params) {
+    if (params[0].value === 'to') {
+      return params
+    }
+    IS_DIRECTION.lastIndex = 0 // reset search index of global regexp
+    if (!IS_DIRECTION.test(params[0].value)) {
+      return params
+    }
+
+    params.unshift(
+      {
+        type: 'word',
+        value: 'to'
+      },
+      {
+        type: 'space',
+        value: ' '
+      }
+    )
+
+    for (let i = 2; i < params.length; i++) {
+      if (params[i].type === 'div') {
+        break
+      }
+      if (params[i].type === 'word') {
+        params[i].value = this.revertDirection(params[i].value)
+      }
+    }
+
+    return params
   }
 
   /**
-   * Convert to old webkit syntax
+   * Normalize angle
    */
-  oldWebkit(node) {
-    let { nodes } = node
-    let string = parser.stringify(node.nodes)
+  normalize(nodes, gradientName) {
+    if (!nodes[0]) return nodes
 
-    if (this.name !== 'linear-gradient') {
-      return false
-    }
-    if (nodes[0] && nodes[0].value.includes('deg')) {
-      return false
+    if (/-?\d+(.\d+)?grad/.test(nodes[0].value)) {
+      nodes[0].value = this.normalizeUnit(nodes[0].value, 400)
+    } else if (/-?\d+(.\d+)?rad/.test(nodes[0].value)) {
+      nodes[0].value = this.normalizeUnit(nodes[0].value, 2 * Math.PI)
+    } else if (/-?\d+(.\d+)?turn/.test(nodes[0].value)) {
+      nodes[0].value = this.normalizeUnit(nodes[0].value, 1)
+    } else if (nodes[0].value.includes('deg')) {
+      let num = parseFloat(nodes[0].value)
+      num = range.wrap(0, 360, num)
+      nodes[0].value = `${num}deg`
     }
+
     if (
-      string.includes('px') ||
-      string.includes('-corner') ||
-      string.includes('-side')
+      gradientName === 'linear-gradient' ||
+      gradientName === 'repeating-linear-gradient'
     ) {
-      return false
-    }
+      let direction = nodes[0].value
 
-    let params = [[]]
-    for (let i of nodes) {
-      params[params.length - 1].push(i)
-      if (i.type === 'div' && i.value === ',') {
-        params.push([])
+      // Unitless zero for `<angle>` values are allowed in CSS gradients and transforms.
+      // Spec: https://github.com/w3c/csswg-drafts/commit/602789171429b2231223ab1e5acf8f7f11652eb3
+      if (direction === '0deg' || direction === '0') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'top')
+      } else if (direction === '90deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'right')
+      } else if (direction === '180deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom') // default value
+      } else if (direction === '270deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'left')
       }
     }
 
-    this.oldDirection(params)
-    this.colorStops(params)
+    return nodes
+  }
 
-    node.nodes = []
-    for (let param of params) {
-      node.nodes = node.nodes.concat(param)
-    }
+  /**
+   * Convert angle unit to deg
+   */
+  normalizeUnit(str, full) {
+    let num = parseFloat(str)
+    let deg = (num / full) * 360
+    return `${deg}deg`
+  }
 
-    node.nodes.unshift(
-      { type: 'word', value: 'linear' },
-      this.cloneDiv(node.nodes)
-    )
-    node.value = '-webkit-gradient'
+  /**
+   * Remove old WebKit gradient too
+   */
+  old(prefix) {
+    if (prefix === '-webkit-') {
+      let type
+      if (this.name === 'linear-gradient') {
+        type = 'linear'
+      } else if (this.name === 'repeating-linear-gradient') {
+        type = 'repeating-linear'
+      } else if (this.name === 'repeating-radial-gradient') {
+        type = 'repeating-radial'
+      } else {
+        type = 'radial'
+      }
+      let string = '-gradient'
+      let regexp = utils.regexp(
+        `-webkit-(${type}-gradient|gradient\\(\\s*${type})`,
+        false
+      )
 
-    return true
+      return new OldValue(this.name, prefix + this.name, string, regexp)
+    } else {
+      return super.old(prefix)
+    }
   }
 
   /**
@@ -311,106 +320,97 @@ class Gradient extends Value {
   }
 
   /**
-   * Get div token from exists parameters
+   * Convert to old webkit syntax
    */
-  cloneDiv(params) {
-    for (let i of params) {
+  oldWebkit(node) {
+    let { nodes } = node
+    let string = parser.stringify(node.nodes)
+
+    if (this.name !== 'linear-gradient') {
+      return false
+    }
+    if (nodes[0] && nodes[0].value.includes('deg')) {
+      return false
+    }
+    if (
+      string.includes('px') ||
+      string.includes('-corner') ||
+      string.includes('-side')
+    ) {
+      return false
+    }
+
+    let params = [[]]
+    for (let i of nodes) {
+      params[params.length - 1].push(i)
       if (i.type === 'div' && i.value === ',') {
-        return i
+        params.push([])
       }
     }
-    return { type: 'div', value: ',', after: ' ' }
-  }
 
-  /**
-   * Change colors syntax to old webkit
-   */
-  colorStops(params) {
-    let result = []
-    for (let i = 0; i < params.length; i++) {
-      let pos
-      let param = params[i]
-      let item
-      if (i === 0) {
-        continue
-      }
+    this.oldDirection(params)
+    this.colorStops(params)
 
-      let color = parser.stringify(param[0])
-      if (param[1] && param[1].type === 'word') {
-        pos = param[1].value
-      } else if (param[2] && param[2].type === 'word') {
-        pos = param[2].value
-      }
+    node.nodes = []
+    for (let param of params) {
+      node.nodes = node.nodes.concat(param)
+    }
 
-      let stop
-      if (i === 1 && (!pos || pos === '0%')) {
-        stop = `from(${color})`
-      } else if (i === params.length - 1 && (!pos || pos === '100%')) {
-        stop = `to(${color})`
-      } else if (pos) {
-        stop = `color-stop(${pos}, ${color})`
-      } else {
-        stop = `color-stop(${color})`
-      }
+    node.nodes.unshift(
+      { type: 'word', value: 'linear' },
+      this.cloneDiv(node.nodes)
+    )
+    node.value = '-webkit-gradient'
 
-      let div = param[param.length - 1]
-      params[i] = [{ type: 'word', value: stop }]
-      if (div.type === 'div' && div.value === ',') {
-        item = params[i].push(div)
+    return true
+  }
+
+  /**
+   * Change degrees for webkit prefix
+   */
+  replace(string, prefix) {
+    let ast = parser(string)
+    for (let node of ast.nodes) {
+      let gradientName = this.name // gradient name
+      if (node.type === 'function' && node.value === gradientName) {
+        node.nodes = this.newDirection(node.nodes)
+        node.nodes = this.normalize(node.nodes, gradientName)
+        if (prefix === '-webkit- old') {
+          let changes = this.oldWebkit(node)
+          if (!changes) {
+            return false
+          }
+        } else {
+          node.nodes = this.convertDirection(node.nodes)
+          node.value = prefix + node.value
+        }
       }
-      result.push(item)
     }
-    return result
+    return ast.toString()
   }
 
   /**
-   * Remove old WebKit gradient too
+   * Replace first token
    */
-  old(prefix) {
-    if (prefix === '-webkit-') {
-      let type
-      if (this.name === 'linear-gradient') {
-        type = 'linear'
-      } else if (this.name === 'repeating-linear-gradient') {
-        type = 'repeating-linear'
-      } else if (this.name === 'repeating-radial-gradient') {
-        type = 'repeating-radial'
-      } else {
-        type = 'radial'
+  replaceFirst(params, ...words) {
+    let prefix = words.map(i => {
+      if (i === ' ') {
+        return { type: 'space', value: i }
       }
-      let string = '-gradient'
-      let regexp = utils.regexp(
-        `-webkit-(${type}-gradient|gradient\\(\\s*${type})`,
-        false
-      )
+      return { type: 'word', value: i }
+    })
+    return prefix.concat(params.slice(1))
+  }
 
-      return new OldValue(this.name, prefix + this.name, string, regexp)
-    } else {
-      return super.old(prefix)
-    }
+  revertDirection(word) {
+    return Gradient.directions[word.toLowerCase()] || word
   }
 
   /**
-   * Do not add non-webkit prefixes for list-style and object
+   * Round float and save digits under dot
    */
-  add(decl, prefix) {
-    let p = decl.prop
-    if (p.includes('mask')) {
-      if (prefix === '-webkit-' || prefix === '-webkit- old') {
-        return super.add(decl, prefix)
-      }
-    } else if (
-      p === 'list-style' ||
-      p === 'list-style-image' ||
-      p === 'content'
-    ) {
-      if (prefix === '-webkit-' || prefix === '-webkit- old') {
-        return super.add(decl, prefix)
-      }
-    } else {
-      return super.add(decl, prefix)
-    }
-    return undefined
+  roundFloat(float, digits) {
+    return parseFloat(float.toFixed(digits))
   }
 }
 
@@ -422,27 +422,27 @@ Gradient.names = [
 ]
 
 Gradient.directions = {
-  top: 'bottom', // default value
-  left: 'right',
   bottom: 'top',
-  right: 'left'
+  left: 'right',
+  right: 'left',
+  top: 'bottom' // default value
 }
 
 // Direction to replace
 Gradient.oldDirections = {
-  'top': 'left bottom, left top',
-  'left': 'right top, left top',
   'bottom': 'left top, left bottom',
-  'right': 'left top, right top',
-
-  'top right': 'left bottom, right top',
-  'top left': 'right bottom, left top',
-  'right top': 'left bottom, right top',
-  'right bottom': 'left top, right bottom',
-  'bottom right': 'left top, right bottom',
   'bottom left': 'right top, left bottom',
+  'bottom right': 'left top, right bottom',
+  'left': 'right top, left top',
+
+  'left bottom': 'right top, left bottom',
   'left top': 'right bottom, left top',
-  'left bottom': 'right top, left bottom'
+  'right': 'left top, right top',
+  'right bottom': 'left top, right bottom',
+  'right top': 'left bottom, right top',
+  'top': 'left bottom, left top',
+  'top left': 'right bottom, left top',
+  'top right': 'left bottom, right top'
 }
 
 module.exports = Gradient

package/lib/hacks/grid-column-align.js

@@ -9,17 +9,17 @@ class GridColumnAlign extends Declaration {
   }
 
   /**
-   * Change property name for IE
+   * Change IE property back
    */
-  prefixed(prop, prefix) {
-    return prefix + 'grid-column-align'
+  normalize() {
+    return 'justify-self'
   }
 
   /**
-   * Change IE property back
+   * Change property name for IE
    */
-  normalize() {
-    return 'justify-self'
+  prefixed(prop, prefix) {
+    return prefix + 'grid-column-align'
   }
 }
 

package/lib/hacks/grid-row-align.js

@@ -9,17 +9,17 @@ class GridRowAlign extends Declaration {
   }
 
   /**
-   * Change property name for IE
+   * Change IE property back
    */
-  prefixed(prop, prefix) {
-    return prefix + 'grid-row-align'
+  normalize() {
+    return 'align-self'
   }
 
   /**
-   * Change IE property back
+   * Change property name for IE
    */
-  normalize() {
-    return 'align-self'
+  prefixed(prop, prefix) {
+    return prefix + 'grid-row-align'
   }
 }