columns.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. 'use strict';
  2. exports.__esModule = true;
  3. var _postcss = require('postcss');
  4. var _postcssValueParser = require('postcss-value-parser');
  5. var _stylehacks = require('stylehacks');
  6. var _genericMerge = require('../genericMerge');
  7. var _getValue = require('../getValue');
  8. var _getValue2 = _interopRequireDefault(_getValue);
  9. var _insertCloned = require('../insertCloned');
  10. var _insertCloned2 = _interopRequireDefault(_insertCloned);
  11. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  12. var properties = ['column-width', 'column-count'];
  13. var auto = 'auto';
  14. /**
  15. * Normalize a columns shorthand definition. Both of the longhand
  16. * properties' initial values are 'auto', and as per the spec,
  17. * omitted values are set to their initial values. Thus, we can
  18. * remove any 'auto' definition when there are two values.
  19. *
  20. * Specification link: https://www.w3.org/TR/css3-multicol/
  21. */
  22. function normalize(values) {
  23. if (values[0] === auto) {
  24. return values[1];
  25. }
  26. if (values[1] === auto) {
  27. return values[0];
  28. }
  29. return values.join(' ');
  30. }
  31. function explode(rule) {
  32. if (rule.nodes.some(_stylehacks.detect)) {
  33. return false;
  34. }
  35. rule.walkDecls('columns', function (decl) {
  36. var values = _postcss.list.space(decl.value);
  37. if (values.length === 1) {
  38. values.push(auto);
  39. }
  40. values.forEach(function (value, i) {
  41. var prop = properties[1];
  42. if (value === auto) {
  43. prop = properties[i];
  44. } else if ((0, _postcssValueParser.unit)(value).unit) {
  45. prop = properties[0];
  46. }
  47. (0, _insertCloned2.default)(rule, decl, {
  48. prop: prop,
  49. value: value
  50. });
  51. });
  52. decl.remove();
  53. });
  54. }
  55. var merge = (0, _genericMerge.genericMergeFactory)({
  56. prop: 'columns',
  57. properties: properties,
  58. value: function value(rules) {
  59. return normalize(rules.map(_getValue2.default));
  60. }
  61. });
  62. exports.default = {
  63. explode: explode,
  64. merge: merge
  65. };
  66. module.exports = exports['default'];