postcss-preset-env
Advanced tools
Comparing version 3.5.0 to 4.0.0
# Changes to PostCSS Preset Env | ||
### 4.0.0 (April 7, 2018) | ||
- Added: `postcss-focus-within` | ||
- Updated: `postcss-focus-visible` to v3.0.0 (major update) | ||
- Updated: `caniuse-lite` to v1.0.30000824 (patch update) | ||
- Updated: `cssdb` to v2.0.0 (major update) | ||
- Changed: All `specificationId` names to new `id` names for the `cssdb` update. | ||
### 3.5.0 (April 5, 2018) | ||
@@ -4,0 +12,0 @@ |
@@ -6,23 +6,24 @@ 'use strict'; | ||
var postcssApply = _interopDefault(require('postcss-apply')); | ||
var postcssInitial = _interopDefault(require('postcss-initial')); | ||
var postcssAttributeCaseInsensitive = _interopDefault(require('postcss-attribute-case-insensitive')); | ||
var postcssColorHexAlpha = _interopDefault(require('postcss-color-hex-alpha')); | ||
var postcssColorModFunction = _interopDefault(require('postcss-color-mod-function')); | ||
var postcssColorRebeccapurple = _interopDefault(require('postcss-color-rebeccapurple')); | ||
var postcssCustomMedia = _interopDefault(require('postcss-custom-media')); | ||
var postcssCustomProperties = _interopDefault(require('postcss-custom-properties')); | ||
var postcssCustomSelectors = _interopDefault(require('postcss-custom-selectors')); | ||
var postcssDirPseudoClass = _interopDefault(require('postcss-dir-pseudo-class')); | ||
var postcssFocusVisible = _interopDefault(require('postcss-focus-visible')); | ||
var postcssFocusWithin = _interopDefault(require('postcss-focus-within')); | ||
var postcssFontVariant = _interopDefault(require('postcss-font-variant')); | ||
var postcssFontFamilySystemUi = _interopDefault(require('postcss-font-family-system-ui')); | ||
var postcssImageSetPolyfill = _interopDefault(require('@csstools/postcss-image-set-function')); | ||
var postcssInitial = _interopDefault(require('postcss-initial')); | ||
var postcssLogical = _interopDefault(require('postcss-logical')); | ||
var postcssMediaMinmax = _interopDefault(require('postcss-media-minmax')); | ||
var postcssNesting = _interopDefault(require('postcss-nesting')); | ||
var postcssReplaceOverflowWrap = _interopDefault(require('postcss-replace-overflow-wrap')); | ||
var postcssCustomProperties = _interopDefault(require('postcss-custom-properties')); | ||
var postcssCustomMedia = _interopDefault(require('postcss-custom-media')); | ||
var postcssMediaMinmax = _interopDefault(require('postcss-media-minmax')); | ||
var postcssPageBreak = _interopDefault(require('postcss-page-break')); | ||
var postcssPseudoClassAnyLink = _interopDefault(require('postcss-pseudo-class-any-link')); | ||
var postcssAttributeCaseInsensitive = _interopDefault(require('postcss-attribute-case-insensitive')); | ||
var postcssReplaceOverflowWrap = _interopDefault(require('postcss-replace-overflow-wrap')); | ||
var postcssSelectorMatches = _interopDefault(require('postcss-selector-matches')); | ||
var postcssSelectorNot = _interopDefault(require('postcss-selector-not')); | ||
var postcssDirPseudoClass = _interopDefault(require('postcss-dir-pseudo-class')); | ||
var caniuse = require('caniuse-lite'); | ||
@@ -35,26 +36,27 @@ var browserslist = _interopDefault(require('browserslist')); | ||
// postcss plugins ordered by specification id | ||
// postcss plugins ordered by id | ||
var plugins = { | ||
'all-property': postcssInitial, | ||
'any-link-pseudo-class': postcssPseudoClassAnyLink, | ||
'break-properties': postcssPageBreak, | ||
'css-apply-rule': postcssApply, | ||
'css-cascade-all-shorthand': postcssInitial, | ||
'css-color-hex-notation': postcssColorHexAlpha, | ||
'css-color-modifying-colors': postcssColorModFunction, | ||
'css-color-valdef-color-rebeccapurple': postcssColorRebeccapurple, | ||
'css-extensions-custom-selectors': postcssCustomSelectors, | ||
'css-fonts-propdef-font-variant': postcssFontVariant, | ||
'css-fonts-system-ui-def': postcssFontFamilySystemUi, | ||
'css-images-image-set-notation': postcssImageSetPolyfill, | ||
'css-logical': postcssLogical, | ||
'css-nesting': postcssNesting, | ||
'css-text-overflow-wrap-property': postcssReplaceOverflowWrap, | ||
'css-variables': postcssCustomProperties, | ||
'mediaqueries-custom-mq': postcssCustomMedia, | ||
'mediaqueries-mq-ranges': postcssMediaMinmax, | ||
'selectors-any-link-pseudo': postcssPseudoClassAnyLink, | ||
'selectors-attribute-case': postcssAttributeCaseInsensitive, | ||
'selectors-dir-pseudo': postcssDirPseudoClass, | ||
'selectors-focus-visible-pseudo': postcssFocusVisible, | ||
'selectors-matches-pseudo': postcssSelectorMatches, | ||
'selectors-negation': postcssSelectorNot | ||
'case-insensitive-attributes': postcssAttributeCaseInsensitive, | ||
'color-mod-function': postcssColorModFunction, | ||
'custom-media-queries': postcssCustomMedia, | ||
'custom-properties': postcssCustomProperties, | ||
'custom-property-sets': postcssApply, | ||
'custom-selectors': postcssCustomSelectors, | ||
'dir-pseudo-class': postcssDirPseudoClass, | ||
'font-variant-property': postcssFontVariant, | ||
'hexadecimal-alpha-notation': postcssColorHexAlpha, | ||
'image-set-function': postcssImageSetPolyfill, | ||
'logical-properties-and-values': postcssLogical, | ||
'matches-pseudo-class': postcssSelectorMatches, | ||
'media-query-ranges': postcssMediaMinmax, | ||
'nesting-rules': postcssNesting, | ||
'not-pseudo-class': postcssSelectorNot, | ||
'overflow-wrap-property': postcssReplaceOverflowWrap, | ||
'rebeccapurple-color': postcssColorRebeccapurple, | ||
'focus-visible-pseudo-class': postcssFocusVisible, | ||
'focus-within-pseudo-class': postcssFocusWithin, | ||
'system-ui-font-family': postcssFontFamilySystemUi | ||
}; | ||
@@ -64,8 +66,8 @@ | ||
function getTransformedInsertions(insertions, placement) { | ||
return Object.keys(insertions).map(function (specificationId) { | ||
return [].concat(insertions[specificationId]).map(function (plugin) { | ||
return Object.keys(insertions).map(function (id) { | ||
return [].concat(insertions[id]).map(function (plugin) { | ||
return { | ||
[placement]: true, | ||
plugin, | ||
specificationId | ||
id | ||
}; | ||
@@ -104,4 +106,4 @@ }); | ||
// specification ids ordered by execution | ||
var specificationIdsByExecutionOrder = ['css-variables', 'postcss-apply', 'css-images-image-set-notation', 'css-logical', 'css-nesting', 'mediaqueries-5-custom-mq', 'mediaqueries-mq-ranges', 'css-extensions-custom-selectors', 'selectors-attribute-case', 'css-color-valdef-color-rebeccapurple', 'css-color-hex-notation', 'css-color-modifying-colors', 'css-fonts-system-ui-def', 'css-fonts-propdef-font-variant', 'css-cascade-all-shorthand', 'selectors-matches', 'selectors-negation', 'selectors-any-link-pseudo', 'selectors-dir-pseudo', 'css-text-overflow-wrap-property']; | ||
// ids ordered by execution | ||
var idsByExecutionOrder = ['custom-properties', 'custom-property-sets', 'image-set-function', 'logical-properties-and-values', 'nesting-rules', 'custom-media-queries', 'media-query-ranges', 'custom-selectors', 'case-insensitive-attributes', 'rebeccapurple-color', 'hexadecimal-alpha-notation', 'color-mod-function', 'system-ui-font-family', 'font-variant-property', 'all-property', 'matches-pseudo-class', 'not-pseudo-class', 'any-link-pseudo-class', 'dir-pseudo-class', 'overflow-wrap-property', 'focus-visible-pseudo-class', 'focus-within-pseudo-class']; | ||
@@ -127,7 +129,7 @@ // tooling | ||
function (feature) { | ||
return feature.insertBefore || feature.specificationId in plugins; | ||
return feature.insertBefore || feature.id in plugins; | ||
}).sort( | ||
// features sorted by execution order and then insertion order | ||
function (a, b) { | ||
return specificationIdsByExecutionOrder.indexOf(a.specificationId) - specificationIdsByExecutionOrder.indexOf(b.specificationId) || (a.insertBefore ? -1 : b.insertBefore ? 1 : 0) || (a.insertAfter ? 1 : b.insertAfter ? -1 : 0); | ||
return idsByExecutionOrder.indexOf(a.id) - idsByExecutionOrder.indexOf(b.id) || (a.insertBefore ? -1 : b.insertBefore ? 1 : 0) || (a.insertAfter ? 1 : b.insertAfter ? -1 : 0); | ||
}).map( | ||
@@ -142,8 +144,8 @@ // polyfillable features as an object | ||
plugin: feature.plugin, | ||
specificationId: `${feature.insertBefore ? 'before' : 'after'}-${feature.specificationId}`, | ||
id: `${feature.insertBefore ? 'before' : 'after'}-${feature.id}`, | ||
stage: 6 | ||
} : { | ||
browsers: unsupportedBrowsers, | ||
plugin: plugins[feature.specificationId], | ||
specificationId: feature.specificationId, | ||
plugin: plugins[feature.id], | ||
id: feature.id, | ||
stage: feature.stage | ||
@@ -155,8 +157,8 @@ }; | ||
var stagedFeatures = polyfillableFeatures.filter(function (feature) { | ||
return feature.specificationId in features ? features[feature.specificationId] : feature.stage >= stage; | ||
return feature.id in features ? features[feature.id] : feature.stage >= stage; | ||
}).map(function (feature) { | ||
return { | ||
browsers: feature.browsers, | ||
plugin: typeof feature.plugin.process === 'function' ? features[feature.specificationId] === true ? feature.plugin() : feature.plugin(features[feature.specificationId]) : feature.plugin, | ||
specificationId: feature.specificationId | ||
plugin: typeof feature.plugin.process === 'function' ? features[feature.id] === true ? feature.plugin() : feature.plugin(features[feature.id]) : feature.plugin, | ||
id: feature.id | ||
}; | ||
@@ -163,0 +165,0 @@ }); |
import postcssApply from 'postcss-apply'; | ||
import postcssInitial from 'postcss-initial'; | ||
import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive'; | ||
import postcssColorHexAlpha from 'postcss-color-hex-alpha'; | ||
import postcssColorModFunction from 'postcss-color-mod-function'; | ||
import postcssColorRebeccapurple from 'postcss-color-rebeccapurple'; | ||
import postcssCustomMedia from 'postcss-custom-media'; | ||
import postcssCustomProperties from 'postcss-custom-properties'; | ||
import postcssCustomSelectors from 'postcss-custom-selectors'; | ||
import postcssDirPseudoClass from 'postcss-dir-pseudo-class'; | ||
import postcssFocusVisible from 'postcss-focus-visible'; | ||
import postcssFocusWithin from 'postcss-focus-within'; | ||
import postcssFontVariant from 'postcss-font-variant'; | ||
import postcssFontFamilySystemUi from 'postcss-font-family-system-ui'; | ||
import postcssImageSetPolyfill from '@csstools/postcss-image-set-function'; | ||
import postcssInitial from 'postcss-initial'; | ||
import postcssLogical from 'postcss-logical'; | ||
import postcssMediaMinmax from 'postcss-media-minmax'; | ||
import postcssNesting from 'postcss-nesting'; | ||
import postcssReplaceOverflowWrap from 'postcss-replace-overflow-wrap'; | ||
import postcssCustomProperties from 'postcss-custom-properties'; | ||
import postcssCustomMedia from 'postcss-custom-media'; | ||
import postcssMediaMinmax from 'postcss-media-minmax'; | ||
import postcssPageBreak from 'postcss-page-break'; | ||
import postcssPseudoClassAnyLink from 'postcss-pseudo-class-any-link'; | ||
import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive'; | ||
import postcssReplaceOverflowWrap from 'postcss-replace-overflow-wrap'; | ||
import postcssSelectorMatches from 'postcss-selector-matches'; | ||
import postcssSelectorNot from 'postcss-selector-not'; | ||
import postcssDirPseudoClass from 'postcss-dir-pseudo-class'; | ||
import { features, feature } from 'caniuse-lite'; | ||
@@ -30,26 +31,27 @@ import browserslist from 'browserslist'; | ||
// postcss plugins ordered by specification id | ||
// postcss plugins ordered by id | ||
var plugins = { | ||
'all-property': postcssInitial, | ||
'any-link-pseudo-class': postcssPseudoClassAnyLink, | ||
'break-properties': postcssPageBreak, | ||
'css-apply-rule': postcssApply, | ||
'css-cascade-all-shorthand': postcssInitial, | ||
'css-color-hex-notation': postcssColorHexAlpha, | ||
'css-color-modifying-colors': postcssColorModFunction, | ||
'css-color-valdef-color-rebeccapurple': postcssColorRebeccapurple, | ||
'css-extensions-custom-selectors': postcssCustomSelectors, | ||
'css-fonts-propdef-font-variant': postcssFontVariant, | ||
'css-fonts-system-ui-def': postcssFontFamilySystemUi, | ||
'css-images-image-set-notation': postcssImageSetPolyfill, | ||
'css-logical': postcssLogical, | ||
'css-nesting': postcssNesting, | ||
'css-text-overflow-wrap-property': postcssReplaceOverflowWrap, | ||
'css-variables': postcssCustomProperties, | ||
'mediaqueries-custom-mq': postcssCustomMedia, | ||
'mediaqueries-mq-ranges': postcssMediaMinmax, | ||
'selectors-any-link-pseudo': postcssPseudoClassAnyLink, | ||
'selectors-attribute-case': postcssAttributeCaseInsensitive, | ||
'selectors-dir-pseudo': postcssDirPseudoClass, | ||
'selectors-focus-visible-pseudo': postcssFocusVisible, | ||
'selectors-matches-pseudo': postcssSelectorMatches, | ||
'selectors-negation': postcssSelectorNot | ||
'case-insensitive-attributes': postcssAttributeCaseInsensitive, | ||
'color-mod-function': postcssColorModFunction, | ||
'custom-media-queries': postcssCustomMedia, | ||
'custom-properties': postcssCustomProperties, | ||
'custom-property-sets': postcssApply, | ||
'custom-selectors': postcssCustomSelectors, | ||
'dir-pseudo-class': postcssDirPseudoClass, | ||
'font-variant-property': postcssFontVariant, | ||
'hexadecimal-alpha-notation': postcssColorHexAlpha, | ||
'image-set-function': postcssImageSetPolyfill, | ||
'logical-properties-and-values': postcssLogical, | ||
'matches-pseudo-class': postcssSelectorMatches, | ||
'media-query-ranges': postcssMediaMinmax, | ||
'nesting-rules': postcssNesting, | ||
'not-pseudo-class': postcssSelectorNot, | ||
'overflow-wrap-property': postcssReplaceOverflowWrap, | ||
'rebeccapurple-color': postcssColorRebeccapurple, | ||
'focus-visible-pseudo-class': postcssFocusVisible, | ||
'focus-within-pseudo-class': postcssFocusWithin, | ||
'system-ui-font-family': postcssFontFamilySystemUi | ||
}; | ||
@@ -59,8 +61,8 @@ | ||
function getTransformedInsertions(insertions, placement) { | ||
return Object.keys(insertions).map(function (specificationId) { | ||
return [].concat(insertions[specificationId]).map(function (plugin) { | ||
return Object.keys(insertions).map(function (id) { | ||
return [].concat(insertions[id]).map(function (plugin) { | ||
return { | ||
[placement]: true, | ||
plugin, | ||
specificationId | ||
id | ||
}; | ||
@@ -99,4 +101,4 @@ }); | ||
// specification ids ordered by execution | ||
var specificationIdsByExecutionOrder = ['css-variables', 'postcss-apply', 'css-images-image-set-notation', 'css-logical', 'css-nesting', 'mediaqueries-5-custom-mq', 'mediaqueries-mq-ranges', 'css-extensions-custom-selectors', 'selectors-attribute-case', 'css-color-valdef-color-rebeccapurple', 'css-color-hex-notation', 'css-color-modifying-colors', 'css-fonts-system-ui-def', 'css-fonts-propdef-font-variant', 'css-cascade-all-shorthand', 'selectors-matches', 'selectors-negation', 'selectors-any-link-pseudo', 'selectors-dir-pseudo', 'css-text-overflow-wrap-property']; | ||
// ids ordered by execution | ||
var idsByExecutionOrder = ['custom-properties', 'custom-property-sets', 'image-set-function', 'logical-properties-and-values', 'nesting-rules', 'custom-media-queries', 'media-query-ranges', 'custom-selectors', 'case-insensitive-attributes', 'rebeccapurple-color', 'hexadecimal-alpha-notation', 'color-mod-function', 'system-ui-font-family', 'font-variant-property', 'all-property', 'matches-pseudo-class', 'not-pseudo-class', 'any-link-pseudo-class', 'dir-pseudo-class', 'overflow-wrap-property', 'focus-visible-pseudo-class', 'focus-within-pseudo-class']; | ||
@@ -122,7 +124,7 @@ // tooling | ||
function (feature$$1) { | ||
return feature$$1.insertBefore || feature$$1.specificationId in plugins; | ||
return feature$$1.insertBefore || feature$$1.id in plugins; | ||
}).sort( | ||
// features sorted by execution order and then insertion order | ||
function (a, b) { | ||
return specificationIdsByExecutionOrder.indexOf(a.specificationId) - specificationIdsByExecutionOrder.indexOf(b.specificationId) || (a.insertBefore ? -1 : b.insertBefore ? 1 : 0) || (a.insertAfter ? 1 : b.insertAfter ? -1 : 0); | ||
return idsByExecutionOrder.indexOf(a.id) - idsByExecutionOrder.indexOf(b.id) || (a.insertBefore ? -1 : b.insertBefore ? 1 : 0) || (a.insertAfter ? 1 : b.insertAfter ? -1 : 0); | ||
}).map( | ||
@@ -137,8 +139,8 @@ // polyfillable features as an object | ||
plugin: feature$$1.plugin, | ||
specificationId: `${feature$$1.insertBefore ? 'before' : 'after'}-${feature$$1.specificationId}`, | ||
id: `${feature$$1.insertBefore ? 'before' : 'after'}-${feature$$1.id}`, | ||
stage: 6 | ||
} : { | ||
browsers: unsupportedBrowsers, | ||
plugin: plugins[feature$$1.specificationId], | ||
specificationId: feature$$1.specificationId, | ||
plugin: plugins[feature$$1.id], | ||
id: feature$$1.id, | ||
stage: feature$$1.stage | ||
@@ -150,8 +152,8 @@ }; | ||
var stagedFeatures = polyfillableFeatures.filter(function (feature$$1) { | ||
return feature$$1.specificationId in features$$1 ? features$$1[feature$$1.specificationId] : feature$$1.stage >= stage; | ||
return feature$$1.id in features$$1 ? features$$1[feature$$1.id] : feature$$1.stage >= stage; | ||
}).map(function (feature$$1) { | ||
return { | ||
browsers: feature$$1.browsers, | ||
plugin: typeof feature$$1.plugin.process === 'function' ? features$$1[feature$$1.specificationId] === true ? feature$$1.plugin() : feature$$1.plugin(features$$1[feature$$1.specificationId]) : feature$$1.plugin, | ||
specificationId: feature$$1.specificationId | ||
plugin: typeof feature$$1.plugin.process === 'function' ? features$$1[feature$$1.id] === true ? feature$$1.plugin() : feature$$1.plugin(features$$1[feature$$1.id]) : feature$$1.plugin, | ||
id: feature$$1.id | ||
}; | ||
@@ -158,0 +160,0 @@ }); |
// return a list of features to be inserted before or after cssdb features | ||
export default function getTransformedInsertions(insertions, placement) { | ||
return Object.keys(insertions).map( | ||
specificationId => [].concat(insertions[specificationId]).map( | ||
id => [].concat(insertions[id]).map( | ||
plugin => ({ | ||
[placement]: true, | ||
plugin, | ||
specificationId | ||
id | ||
}) | ||
@@ -10,0 +10,0 @@ ) |
{ | ||
"name": "postcss-preset-env", | ||
"version": "3.5.0", | ||
"version": "4.0.0", | ||
"description": "Convert modern CSS into something browsers understand", | ||
@@ -31,4 +31,4 @@ "author": "Jonathan Neal <jonathantneal@hotmail.com>", | ||
"browserslist": "^3.2.4", | ||
"caniuse-lite": "^1.0.30000823", | ||
"cssdb": "^1.6.0", | ||
"caniuse-lite": "^1.0.30000824", | ||
"cssdb": "^2.0.0", | ||
"postcss": "^6.0.21", | ||
@@ -45,3 +45,4 @@ "postcss-apply": "^0.9.0", | ||
"postcss-dir-pseudo-class": "^3.0.0", | ||
"postcss-focus-visible": "^2.0.0", | ||
"postcss-focus-visible": "^3.0.0", | ||
"postcss-focus-within": "^2.0.0", | ||
"postcss-font-family-system-ui": "^3.0.0", | ||
@@ -48,0 +49,0 @@ "postcss-font-variant": "^3.0.0", |
@@ -189,6 +189,6 @@ # PostCSS Preset Env [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][postcss] | ||
The `features` key determines which CSS features to polyfill based upon their | ||
unique specification id found at [cssdb]. Pass `true` to enable a feature, and | ||
pass `false` to disable a feature. Pass an object `{}` to configure options of | ||
an individual polyfill. Any features not explicitly toggled here will be | ||
determined by [stage](#stage). | ||
unique id found at [cssdb]. Pass `true` to enable a feature, and pass `false` | ||
to disable a feature. Pass an object `{}` to configure options of an individual | ||
polyfill. Any features not explicitly toggled here will be determined by | ||
[stage](#stage). | ||
@@ -195,0 +195,0 @@ ```js |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
452
37444
28
+ Addedpostcss-focus-within@^2.0.0
+ Addedcssdb@2.2.0(transitive)
+ Addedpostcss-focus-visible@3.0.0(transitive)
+ Addedpostcss-focus-within@2.0.0(transitive)
- Removedcssdb@1.6.0(transitive)
- Removedpostcss-focus-visible@2.0.0(transitive)
Updatedcaniuse-lite@^1.0.30000824
Updatedcssdb@^2.0.0
Updatedpostcss-focus-visible@^3.0.0