index.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _browserslist = require("browserslist");
  6. var _browserslist2 = _interopRequireDefault(_browserslist);
  7. var _postcss = require("postcss");
  8. var _postcss2 = _interopRequireDefault(_postcss);
  9. var _postcssValueParser = require("postcss-value-parser");
  10. var _postcssValueParser2 = _interopRequireDefault(_postcssValueParser);
  11. var _colours = require("./colours");
  12. var _colours2 = _interopRequireDefault(_colours);
  13. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  14. function walk(parent, callback) {
  15. parent.nodes.forEach((node, index) => {
  16. const bubble = callback(node, index, parent);
  17. if (node.nodes && bubble !== false) {
  18. walk(node, callback);
  19. }
  20. });
  21. }
  22. /*
  23. * IE 8 & 9 do not properly handle clicks on elements
  24. * with a `transparent` `background-color`.
  25. *
  26. * https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer
  27. */
  28. function hasTransparentBug(browser) {
  29. return ~["ie 8", "ie 9"].indexOf(browser);
  30. }
  31. exports.default = _postcss2.default.plugin("postcss-colormin", () => {
  32. return (css, result) => {
  33. const resultOpts = result.opts || {};
  34. const browsers = (0, _browserslist2.default)(null, {
  35. stats: resultOpts.stats,
  36. path: __dirname,
  37. env: resultOpts.env
  38. });
  39. const isLegacy = browsers.some(hasTransparentBug);
  40. const colorminCache = {};
  41. const cache = {};
  42. css.walkDecls(decl => {
  43. if (/^(composes|font|filter|-webkit-tap-highlight-color)/i.test(decl.prop)) {
  44. return;
  45. }
  46. if (cache[decl.value]) {
  47. decl.value = cache[decl.value];
  48. return;
  49. }
  50. const parsed = (0, _postcssValueParser2.default)(decl.value);
  51. walk(parsed, (node, index, parent) => {
  52. if (node.type === "function") {
  53. if (/^(rgb|hsl)a?$/i.test(node.value)) {
  54. const { value } = node;
  55. node.value = (0, _colours2.default)((0, _postcssValueParser.stringify)(node), isLegacy, colorminCache);
  56. node.type = "word";
  57. const next = parent.nodes[index + 1];
  58. if (node.value !== value && next && (next.type === "word" || next.type === "function")) {
  59. parent.nodes.splice(index + 1, 0, {
  60. type: "space",
  61. value: " "
  62. });
  63. }
  64. } else if (node.value.toLowerCase() === "calc") {
  65. return false;
  66. }
  67. } else if (node.type === "word") {
  68. node.value = (0, _colours2.default)(node.value, isLegacy, colorminCache);
  69. }
  70. });
  71. const optimizedValue = parsed.toString();
  72. decl.value = optimizedValue;
  73. cache[decl.value] = optimizedValue;
  74. });
  75. };
  76. });