autoprefixer - npm Package Compare versions

Comparing version 8.0.0 to 8.1.0

CHANGELOG.md

 # Change Log
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## 8.1 “Rex, Familia et Ultio”
+* Add `overscroll-behavior` support.
+* Add `grid-template` shortcut support (by Evgeny Petukhov).
+* Add better `grid-column-end` and `grid-row-end` support (by Evgeny Petukhov).
+* Fix Grid properties support in `@supports`.
+
 ## 8.0 “Excelsior”
@@ -5,0 +11,0 @@ * Use Browserslist 3.0.

data/prefixes.js

@@ -708,2 +708,11 @@ 'use strict';
     });
+});
+
+// overscroll-behavior selector
+var over = require('caniuse-lite/data/features/css-overscroll-behavior.js');
+f(over, { match: /a #1/ }, function (browsers) {
+    return prefix(['overscroll-behavior'], {
+        feature: 'css-overscroll-behavior',
+        browsers: browsers
+    });
 });

lib/hacks/grid-area.js

@@ -12,3 +12,3 @@ 'use strict';
 var Declaration = require('../declaration');
-var shorthand = require('./grid-shorthand');
+var utils = require('./grid-utils');
 
@@ -30,46 +30,19 @@ var GridArea = function (_Declaration) {
 
-        if (decl.parent.some(function (i) {
-            return i.prop === '-ms-grid-row';
-        })) {
-            return undefined;
-        }
+        var values = utils.parse(decl);
 
-        var values = shorthand.parse(decl);
+        var _utils$translate = utils.translate(values, 0, 2),
+            rowStart = _utils$translate[0],
+            rowSpan = _utils$translate[1];
 
-        var _shorthand$translate = shorthand.translate(values, 0, 2),
-            rowStart = _shorthand$translate[0],
-            rowSpan = _shorthand$translate[1];
+        var _utils$translate2 = utils.translate(values, 1, 3),
+            columnStart = _utils$translate2[0],
+            columnSpan = _utils$translate2[1];
 
-        var _shorthand$translate2 = shorthand.translate(values, 1, 3),
-            columnStart = _shorthand$translate2[0],
-            columnSpan = _shorthand$translate2[1];
+        [['grid-row', rowStart], ['grid-row-span', rowSpan], ['grid-column', columnStart], ['grid-column-span', columnSpan]].forEach(function (_ref) {
+            var prop = _ref[0],
+                value = _ref[1];
 
-        if (rowStart) {
-            decl.cloneBefore({
-                prop: '-ms-grid-row',
-                value: rowStart.toString()
-            });
-        }
+            utils.insertDecl(decl, prop, value);
+        });
 
-        if (rowSpan) {
-            decl.cloneBefore({
-                prop: '-ms-grid-row-span',
-                value: rowSpan.toString()
-            });
-        }
-
-        if (columnStart) {
-            decl.cloneBefore({
-                prop: '-ms-grid-column',
-                value: columnStart.toString()
-            });
-        }
-
-        if (columnSpan) {
-            decl.cloneBefore({
-                prop: '-ms-grid-column-span',
-                value: columnSpan.toString()
-            });
-        }
-
         return undefined;
@@ -76,0 +49,0 @@ };

lib/hacks/grid-end.js

@@ -23,40 +23,38 @@ 'use strict';
     /**
-     * Do not add prefix for unsupported value in IE
+     * Change repeating syntax for IE
      */
-    GridEnd.prototype.check = function check(decl) {
-        return decl.value.indexOf('span') !== -1;
-    };
+    GridEnd.prototype.insert = function insert(decl, prefix, prefixes, result) {
+        if (prefix !== '-ms-') return _Declaration.prototype.insert.call(this, decl, prefix, prefixes);
 
-    /**
-     * Return a final spec property
-     */
+        var clonedDecl = this.clone(decl);
 
+        var startProp = decl.prop.replace(/end$/, 'start');
+        var spanProp = prefix + decl.prop.replace(/end$/, 'span');
 
-    GridEnd.prototype.normalize = function normalize(prop) {
-        return prop.replace(/(-span|-end)/, '');
-    };
+        if (decl.parent.some(function (i) {
+            return i.prop === spanProp;
+        })) {
+            return undefined;
+        }
 
-    /**
-     * Change property name for IE
-     */
+        clonedDecl.prop = spanProp;
 
-
-    GridEnd.prototype.prefixed = function prefixed(prop, prefix) {
-        var result = _Declaration.prototype.prefixed.call(this, prop, prefix);
-        if (prefix === '-ms-') {
-            result = result.replace('-end', '-span');
+        if (decl.value.includes('span')) {
+            clonedDecl.value = decl.value.replace(/span\s/i, '');
+        } else {
+            var startDecl = void 0;
+            decl.parent.walkDecls(startProp, function (d) {
+                startDecl = d;
+            });
+            if (startDecl) {
+                var value = Number(decl.value) - Number(startDecl.value) + '';
+                clonedDecl.value = value;
+            } else {
+                decl.warn(result, 'Can not prefix ' + decl.prop + ' (' + startProp + ' is not found)');
+            }
         }
-        return result;
-    };
 
-    /**
-     * Change repeating syntax for IE
-     */
+        decl.cloneBefore(clonedDecl);
 
-
-    GridEnd.prototype.set = function set(decl, prefix) {
-        if (prefix === '-ms-') {
-            decl.value = decl.value.replace(/span\s/i, '');
-        }
-        return _Declaration.prototype.set.call(this, decl, prefix);
+        return undefined;
     };
@@ -70,3 +68,3 @@
     writable: true,
-    value: ['grid-row-end', 'grid-column-end', 'grid-row-span', 'grid-column-span']
+    value: ['grid-row-end', 'grid-column-end']
 });
@@ -73,0 +71,0 @@

lib/hacks/grid-row-column.js

@@ -12,3 +12,3 @@ 'use strict';
 var Declaration = require('../declaration');
-var shorthand = require('./grid-shorthand');
+var utils = require('./grid-utils');
 
@@ -30,21 +30,14 @@ var GridRowColumn = function (_Declaration) {
 
-        var values = shorthand.parse(decl);
+        var values = utils.parse(decl);
 
-        var _shorthand$translate = shorthand.translate(values, 0, 1),
-            start = _shorthand$translate[0],
-            span = _shorthand$translate[1];
+        var _utils$translate = utils.translate(values, 0, 1),
+            start = _utils$translate[0],
+            span = _utils$translate[1];
 
-        if (start) {
-            decl.cloneBefore({
-                prop: '-ms-' + decl.prop,
-                value: start.toString()
-            });
-        }
+        [[decl.prop, start], [decl.prop + '-span', span]].forEach(function (_ref) {
+            var prop = _ref[0],
+                value = _ref[1];
 
-        if (span) {
-            decl.cloneBefore({
-                prop: '-ms-' + decl.prop + '-span',
-                value: span.toString()
-            });
-        }
+            utils.insertDecl(decl, prop, value);
+        });
 
@@ -51,0 +44,0 @@ return undefined;

lib/hacks/grid-rows-columns.js

@@ -12,3 +12,3 @@ 'use strict';
 var Declaration = require('../declaration');
-var shorthand = require('./grid-shorthand');
+var utils = require('./grid-utils');
 
@@ -51,3 +51,3 @@ var GridRowsColumns = function (_Declaration) {
         if (prefix === '-ms-' && decl.value.indexOf('repeat(') !== -1) {
-            decl.value = shorthand.changeRepeat(decl.value);
+            decl.value = utils.changeRepeat(decl.value);
         }
@@ -54,0 +54,0 @@ return _Declaration.prototype.set.call(this, decl, prefix);

lib/hacks/grid-template-areas.js

@@ -13,45 +13,10 @@ 'use strict';
 
-var DOTS = /^\.+$/;
+var _require = require('./grid-utils'),
+    parseGridAreas = _require.parseGridAreas,
+    insertAreas = _require.insertAreas;
 
-function track(start, end) {
-    return { start: start, end: end, span: end - start };
-}
-
-function getRows(tpl) {
+function getGridRows(tpl) {
     return tpl.trim().slice(1, -1).split(/['"]\s*['"]?/g);
 }
 
-function getColumns(line) {
-    return line.trim().split(/\s+/g);
-}
-
-function parseGridAreas(tpl) {
-    return getRows(tpl).reduce(function (areas, line, rowIndex) {
-        if (line.trim() === '') return areas;
-        getColumns(line).forEach(function (area, columnIndex) {
-            if (DOTS.test(area)) return;
-            if (typeof areas[area] === 'undefined') {
-                areas[area] = {
-                    column: track(columnIndex + 1, columnIndex + 2),
-                    row: track(rowIndex + 1, rowIndex + 2)
-                };
-            } else {
-                var _areas$area = areas[area],
-                    column = _areas$area.column,
-                    row = _areas$area.row;
-
-
-                column.start = Math.min(column.start, columnIndex + 1);
-                column.end = Math.max(column.end, columnIndex + 2);
-                column.span = column.end - column.start;
-
-                row.start = Math.min(row.start, rowIndex + 1);
-                row.end = Math.max(row.end, rowIndex + 2);
-                row.span = row.end - row.start;
-            }
-        });
-        return areas;
-    }, {});
-}
-
 var GridTemplateAreas = function (_Declaration) {
@@ -66,61 +31,12 @@ _inherits(GridTemplateAreas, _Declaration);
 
-    GridTemplateAreas.prototype.getRoot = function getRoot(parent) {
-        if (parent.type === 'atrule' || !parent.parent) {
-            return parent;
-        }
-        return this.getRoot(parent.parent);
-    };
-
     /**
      * Translate grid-template-areas to separate -ms- prefixed properties
      */
-
-
     GridTemplateAreas.prototype.insert = function insert(decl, prefix, prefixes, result) {
         if (prefix !== '-ms-') return _Declaration.prototype.insert.call(this, decl, prefix, prefixes);
 
-        var areas = parseGridAreas(decl.value);
-        var missed = Object.keys(areas);
+        var areas = parseGridAreas(getGridRows(decl.value));
 
-        this.getRoot(decl.parent).walkDecls('grid-area', function (gridArea) {
-            var value = gridArea.value;
-            var area = areas[value];
+        insertAreas(areas, decl, result);
 
-            missed = missed.filter(function (e) {
-                return e !== value;
-            });
-
-            if (area) {
-                gridArea.parent.walkDecls(/-ms-grid-(row|column)/, function (d) {
-                    d.remove();
-                });
-
-                gridArea.cloneBefore({
-                    prop: '-ms-grid-row',
-                    value: String(area.row.start)
-                });
-                if (area.row.span > 1) {
-                    gridArea.cloneBefore({
-                        prop: '-ms-grid-row-span',
-                        value: String(area.row.span)
-                    });
-                }
-                gridArea.cloneBefore({
-                    prop: '-ms-grid-column',
-                    value: String(area.column.start)
-                });
-                if (area.column.span > 1) {
-                    gridArea.cloneBefore({
-                        prop: '-ms-grid-column-span',
-                        value: String(area.column.span)
-                    });
-                }
-            }
-            return undefined;
-        });
-
-        if (missed.length > 0) {
-            decl.warn(result, 'Can not find grid areas: ' + missed.join(', '));
-        }
-
         return decl;
@@ -127,0 +43,0 @@ };

lib/hacks/grid-template.js

@@ -12,4 +12,7 @@ 'use strict';
 var Declaration = require('../declaration');
-var shorthand = require('./grid-shorthand');
 
+var _require = require('./grid-utils'),
+    parseTemplate = _require.parseTemplate,
+    insertAreas = _require.insertAreas;
+
 var GridTemplate = function (_Declaration) {
@@ -25,14 +28,5 @@ _inherits(GridTemplate, _Declaration);
     /**
-     * Do not add prefix for unsupported value in IE
-     */
-    GridTemplate.prototype.check = function check(decl) {
-        return decl.value.includes('/') && !decl.value.includes('[') && !decl.value.includes('"') && !decl.value.includes('\'');
-    };
-
-    /**
      * Translate grid-template to separate -ms- prefixed properties
      */
-
-
-    GridTemplate.prototype.insert = function insert(decl, prefix, prefixes) {
+    GridTemplate.prototype.insert = function insert(decl, prefix, prefixes, result) {
         if (prefix !== '-ms-') return _Declaration.prototype.insert.call(this, decl, prefix, prefixes);
@@ -46,20 +40,27 @@
 
-        var _shorthand$parseTempl = shorthand.parseTemplateShortcut(decl),
-            templateRows = _shorthand$parseTempl[0],
-            templateColumns = _shorthand$parseTempl[1];
+        var _parseTemplate = parseTemplate(decl),
+            rows = _parseTemplate.rows,
+            columns = _parseTemplate.columns,
+            areas = _parseTemplate.areas;
 
-        if (templateRows) {
+        var hasAreas = Object.keys(areas).length > 0;
+
+        if (rows && columns || hasAreas) {
             decl.cloneBefore({
                 prop: '-ms-grid-rows',
-                value: shorthand.changeRepeat(templateRows.join(''))
+                value: rows
             });
         }
 
-        if (templateColumns) {
+        if (columns) {
             decl.cloneBefore({
                 prop: '-ms-grid-columns',
-                value: shorthand.changeRepeat(templateColumns.join(''))
+                value: columns
             });
         }
 
+        if (hasAreas) {
+            insertAreas(areas, decl, result);
+        }
+
         return decl;
@@ -66,0 +67,0 @@ };

lib/prefixes.js

@@ -55,2 +55,3 @@ 'use strict';
 Declaration.hack(require('./hacks/grid-column-align'));
+Declaration.hack(require('./hacks/overscroll-behavior'));
 Declaration.hack(require('./hacks/grid-template-areas'));
@@ -57,0 +58,0 @@ Declaration.hack(require('./hacks/text-emphasis-position'));

lib/supports.js

@@ -93,4 +93,8 @@ 'use strict';
 
+        var result = { warn: function warn() {
+                return null;
+            } };
+
         var prefixer = this.prefixer().add[rule.first.prop];
-        prefixer && prefixer.process && prefixer.process(rule.first);
+        prefixer && prefixer.process && prefixer.process(rule.first, result);
 
@@ -97,0 +101,0 @@ for (var _iterator = rule.nodes, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {

package.json

 {
   "name": "autoprefixer",
-  "version": "8.0.0",
+  "version": "8.1.0",
   "description": "Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website",
@@ -16,7 +16,7 @@ "keywords": [
   "dependencies": {
-    "browserslist": "^3.0.0",
-    "caniuse-lite": "^1.0.30000808",
+    "browserslist": "^3.1.1",
+    "caniuse-lite": "^1.0.30000810",
     "normalize-range": "^0.1.2",
     "num2fraction": "^1.2.2",
-    "postcss": "^6.0.17",
+    "postcss": "^6.0.19",
     "postcss-value-parser": "^3.2.3"
@@ -23,0 +23,0 @@ },

README.md

@@ -1,2 +0,2 @@
-# Autoprefixer [![Build Status][ci-img]][ci]
+# Autoprefixer [![Cult Of Martians][cult-img]][cult]
 
@@ -8,3 +8,3 @@ <img align="right" width="94" height="71"
 [PostCSS] plugin to parse CSS and add vendor prefixes to CSS rules using values
-from [Can I Use]. It is [recommended] by Google and used in Twitter and Taobao.
+from [Can I Use]. It is [recommended] by Google and used in Twitter and Taobao.
 
@@ -21,3 +21,3 @@ Write your CSS rules without vendor prefixes (in fact, forget about them
 Autoprefixer will use the data based on current browser popularity and property
-support to apply prefixes for you. You can try the [interactive demo]
+support to apply prefixes for you. You can try the [interactive demo]
 of Autoprefixer.
@@ -50,5 +50,5 @@
 [Can I Use]:        http://caniuse.com/
+[cult-img]:         http://cultofmartians.com/assets/badges/badge.svg
 [PostCSS]:          https://github.com/postcss/postcss
-[ci-img]:           https://travis-ci.org/postcss/autoprefixer.svg
-[ci]:               https://travis-ci.org/postcss/autoprefixer
+[cult]:             http://cultofmartians.com/tasks/autoprefixer-grid.html
 
@@ -526,3 +526,3 @@
 
-There are 4 plugin’s options to disable some Autoprefixer features.
+You can use these plugin options to disable some of the Autoprefixer's features.
 
@@ -587,3 +587,3 @@ * `supports: false` will disable `@supports` parameters prefixing.
 
-There are 8 options:
+Available options are:
 
@@ -590,0 +590,0 @@ * `browsers` (array): list of browsers query (like `last 2 versions`),

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

325385

increased by0.99%

Number of package files

73

increased by1.39%

Lines of code

6128

increased by0.91%

Dependency changes

• Updatedbrowserslist@^3.1.1

• Updatedcaniuse-lite@^1.0.30000810

• Updatedpostcss@^6.0.19