Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

il y a 3 ans
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. import postcss from 'postcss';
  2. import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive';
  3. import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
  4. import postcssColorHexAlpha from 'postcss-color-hex-alpha';
  5. import postcssColorModFunction from 'postcss-color-mod-function';
  6. import postcssColorRebeccapurple from 'postcss-color-rebeccapurple';
  7. import postcssCustomMedia from 'postcss-custom-media';
  8. import postcssCustomProperties from 'postcss-custom-properties';
  9. import postcssCustomSelectors from 'postcss-custom-selectors';
  10. import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
  11. import postcssEnvFunction from 'postcss-env-function';
  12. import postcssFocusVisible from 'postcss-focus-visible';
  13. import postcssFocusWithin from 'postcss-focus-within';
  14. import postcssFontVariant from 'postcss-font-variant';
  15. import postcssGapProperties from 'postcss-gap-properties';
  16. import postcssImageSetPolyfill from 'postcss-image-set-function';
  17. import postcssInitial from 'postcss-initial';
  18. import postcssLabFunction from 'postcss-lab-function';
  19. import postcssLogical from 'postcss-logical';
  20. import postcssMediaMinmax from 'postcss-media-minmax';
  21. import postcssNesting from 'postcss-nesting';
  22. import postcssOverflowShorthand from 'postcss-overflow-shorthand';
  23. import postcssPageBreak from 'postcss-page-break';
  24. import postcssPlace from 'postcss-place';
  25. import postcssPseudoClassAnyLink from 'postcss-pseudo-class-any-link';
  26. import postcssReplaceOverflowWrap from 'postcss-replace-overflow-wrap';
  27. import postcssSelectorMatches from 'postcss-selector-matches';
  28. import postcssSelectorNot from 'postcss-selector-not';
  29. import { features, feature } from 'caniuse-lite';
  30. import autoprefixer from 'autoprefixer';
  31. import browserslist from 'browserslist';
  32. import cssdb from 'cssdb';
  33. var postcssFontFamilySystemUi = postcss.plugin('postcss-system-ui-font', () => root => {
  34. root.walkDecls(propertyRegExp, decl => {
  35. decl.value = decl.value.replace(systemUiMatch, systemUiReplace);
  36. });
  37. });
  38. const propertyRegExp = /(?:^(?:-|\\002d){2})|(?:^font(?:-family)?$)/i;
  39. const whitespace = '[\\f\\n\\r\\x09\\x20]';
  40. const systemUiFamily = ['system-ui',
  41. /* macOS 10.11-10.12 */
  42. '-apple-system',
  43. /* Windows 6+ */
  44. 'Segoe UI',
  45. /* Android 4+ */
  46. 'Roboto',
  47. /* Ubuntu 10.10+ */
  48. 'Ubuntu',
  49. /* Gnome 3+ */
  50. 'Cantarell',
  51. /* KDE Plasma 5+ */
  52. 'Noto Sans',
  53. /* fallback */
  54. 'sans-serif'];
  55. const systemUiMatch = new RegExp(`(^|,|${whitespace}+)(?:system-ui${whitespace}*)(?:,${whitespace}*(?:${systemUiFamily.join('|')})${whitespace}*)?(,|$)`, 'i');
  56. const systemUiReplace = `$1${systemUiFamily.join(', ')}$2`;
  57. var plugins = {
  58. 'all-property': postcssInitial,
  59. 'any-link-pseudo-class': postcssPseudoClassAnyLink,
  60. 'break-properties': postcssPageBreak,
  61. 'case-insensitive-attributes': postcssAttributeCaseInsensitive,
  62. 'color-functional-notation': postcssColorFunctionalNotation,
  63. 'color-mod-function': postcssColorModFunction,
  64. 'custom-media-queries': postcssCustomMedia,
  65. 'custom-properties': postcssCustomProperties,
  66. 'custom-selectors': postcssCustomSelectors,
  67. 'dir-pseudo-class': postcssDirPseudoClass,
  68. 'environment-variables': postcssEnvFunction,
  69. 'focus-visible-pseudo-class': postcssFocusVisible,
  70. 'focus-within-pseudo-class': postcssFocusWithin,
  71. 'font-variant-property': postcssFontVariant,
  72. 'gap-properties': postcssGapProperties,
  73. 'hexadecimal-alpha-notation': postcssColorHexAlpha,
  74. 'image-set-function': postcssImageSetPolyfill,
  75. 'lab-function': postcssLabFunction,
  76. 'logical-properties-and-values': postcssLogical,
  77. 'matches-pseudo-class': postcssSelectorMatches,
  78. 'media-query-ranges': postcssMediaMinmax,
  79. 'nesting-rules': postcssNesting,
  80. 'not-pseudo-class': postcssSelectorNot,
  81. 'overflow-property': postcssOverflowShorthand,
  82. 'overflow-wrap-property': postcssReplaceOverflowWrap,
  83. 'place-properties': postcssPlace,
  84. 'rebeccapurple-color': postcssColorRebeccapurple,
  85. 'system-ui-font-family': postcssFontFamilySystemUi
  86. };
  87. // return a list of features to be inserted before or after cssdb features
  88. function getTransformedInsertions(insertions, placement) {
  89. return Object.keys(insertions).map(id => [].concat(insertions[id]).map(plugin => ({
  90. [placement]: true,
  91. plugin,
  92. id
  93. }))).reduce((array, feature$$1) => array.concat(feature$$1), []);
  94. }
  95. function getUnsupportedBrowsersByFeature(feature$$1) {
  96. const caniuseFeature = features[feature$$1]; // if feature support can be determined
  97. if (caniuseFeature) {
  98. const stats = feature(caniuseFeature).stats; // return an array of browsers and versions that do not support the feature
  99. const results = Object.keys(stats).reduce((browsers, browser) => browsers.concat(Object.keys(stats[browser]).filter(version => stats[browser][version].indexOf('y') !== 0).map(version => `${browser} ${version}`)), []);
  100. return results;
  101. } else {
  102. // otherwise, return that the feature does not work in any browser
  103. return ['> 0%'];
  104. }
  105. }
  106. // ids ordered by required execution, then alphabetically
  107. var idsByExecutionOrder = ['custom-media-queries', 'custom-properties', 'environment-variables', // run environment-variables here to access transpiled custom media params and properties
  108. 'image-set-function', // run images-set-function before nesting-rules so that it may fix nested media
  109. 'media-query-ranges', // run media-query-range here to prevent duplicate transpilation after nesting-rules
  110. 'nesting-rules', 'custom-selectors', // run custom-selectors after nesting-rules to correctly transpile &:--custom-selector
  111. 'any-link-pseudo-class', 'case-insensitive-attributes', 'focus-visible-pseudo-class', 'focus-within-pseudo-class', 'matches-pseudo-class', 'not-pseudo-class', // run matches-pseudo-class and bit-pseudo-class after other selectors have been transpiled
  112. 'logical-properties-and-values', // run logical-properties-and-values before dir-pseudo-class
  113. 'dir-pseudo-class', 'all-property', // run all-property before other property polyfills
  114. 'color-functional-notation', 'hexadecimal-alpha-notation', 'lab-function', 'rebeccapurple-color', 'color-mod-function', // run color-mod after other color modifications have finished
  115. 'break-properties', 'font-variant-property', 'gap-properties', 'overflow-property', 'overflow-wrap-property', 'place-properties', 'system-ui-font-family'];
  116. var index = postcss.plugin('postcss-preset-env', opts => {
  117. // initialize options
  118. const features$$1 = Object(Object(opts).features);
  119. const insertBefore = Object(Object(opts).insertBefore);
  120. const insertAfter = Object(Object(opts).insertAfter);
  121. const browsers = Object(opts).browsers;
  122. const stage = 'stage' in Object(opts) ? opts.stage === false ? 5 : parseInt(opts.stage) || 0 : 2;
  123. const autoprefixerOptions = Object(opts).autoprefixer;
  124. const sharedOpts = initializeSharedOpts(Object(opts));
  125. const stagedAutoprefixer = autoprefixer(Object.assign({
  126. browsers
  127. }, autoprefixerOptions)); // polyfillable features (those with an available postcss plugin)
  128. const polyfillableFeatures = cssdb.concat( // additional features to be inserted before cssdb features
  129. getTransformedInsertions(insertBefore, 'insertBefore'), // additional features to be inserted after cssdb features
  130. getTransformedInsertions(insertAfter, 'insertAfter')).filter( // inserted features or features with an available postcss plugin
  131. feature$$1 => feature$$1.insertBefore || feature$$1.id in plugins).sort( // features sorted by execution order and then insertion order
  132. (a, b) => idsByExecutionOrder.indexOf(a.id) - idsByExecutionOrder.indexOf(b.id) || (a.insertBefore ? -1 : b.insertBefore ? 1 : 0) || (a.insertAfter ? 1 : b.insertAfter ? -1 : 0)).map( // polyfillable features as an object
  133. feature$$1 => {
  134. // target browsers for the polyfill
  135. const unsupportedBrowsers = getUnsupportedBrowsersByFeature(feature$$1.caniuse);
  136. return feature$$1.insertBefore || feature$$1.insertAfter ? {
  137. browsers: unsupportedBrowsers,
  138. plugin: feature$$1.plugin,
  139. id: `${feature$$1.insertBefore ? 'before' : 'after'}-${feature$$1.id}`,
  140. stage: 6
  141. } : {
  142. browsers: unsupportedBrowsers,
  143. plugin: plugins[feature$$1.id],
  144. id: feature$$1.id,
  145. stage: feature$$1.stage
  146. };
  147. }); // staged features (those at or above the selected stage)
  148. const stagedFeatures = polyfillableFeatures.filter(feature$$1 => feature$$1.id in features$$1 ? features$$1[feature$$1.id] : feature$$1.stage >= stage).map(feature$$1 => ({
  149. browsers: feature$$1.browsers,
  150. plugin: typeof feature$$1.plugin.process === 'function' ? features$$1[feature$$1.id] === true ? sharedOpts // if the plugin is enabled and has shared options
  151. ? feature$$1.plugin(Object.assign({}, sharedOpts)) // otherwise, if the plugin is enabled
  152. : feature$$1.plugin() : sharedOpts // if the plugin has shared options and individual options
  153. ? feature$$1.plugin(Object.assign({}, sharedOpts, features$$1[feature$$1.id])) // if the plugin has individual options
  154. : feature$$1.plugin(Object.assign({}, features$$1[feature$$1.id])) // if the plugin is already initialized
  155. : feature$$1.plugin,
  156. id: feature$$1.id
  157. }));
  158. return (root, result) => {
  159. // browsers supported by the configuration
  160. const supportedBrowsers = browserslist(browsers, {
  161. path: result.root.source && result.root.source.input && result.root.source.input.file,
  162. ignoreUnknownVersions: true
  163. }); // features supported by the stage and browsers
  164. const supportedFeatures = stagedFeatures.filter(feature$$1 => supportedBrowsers.some(supportedBrowser => browserslist(feature$$1.browsers, {
  165. ignoreUnknownVersions: true
  166. }).some(polyfillBrowser => polyfillBrowser === supportedBrowser))); // polyfills run in execution order
  167. const polyfills = supportedFeatures.reduce((promise, feature$$1) => promise.then(() => feature$$1.plugin(result.root, result)), Promise.resolve()).then(() => stagedAutoprefixer(result.root, result));
  168. return polyfills;
  169. };
  170. });
  171. const initializeSharedOpts = opts => {
  172. if ('importFrom' in opts || 'exportTo' in opts || 'preserve' in opts) {
  173. const sharedOpts = {};
  174. if ('importFrom' in opts) {
  175. sharedOpts.importFrom = opts.importFrom;
  176. }
  177. if ('exportTo' in opts) {
  178. sharedOpts.exportTo = opts.exportTo;
  179. }
  180. if ('preserve' in opts) {
  181. sharedOpts.preserve = opts.preserve;
  182. }
  183. return sharedOpts;
  184. }
  185. return false;
  186. };
  187. export default index;