grid-rows-columns.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. "use strict";
  2. function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
  3. function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _defaults(subClass, superClass); }
  4. function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
  5. var Declaration = require('../declaration');
  6. var _require = require('./grid-utils'),
  7. prefixTrackProp = _require.prefixTrackProp,
  8. prefixTrackValue = _require.prefixTrackValue,
  9. autoplaceGridItems = _require.autoplaceGridItems,
  10. getGridGap = _require.getGridGap,
  11. inheritGridGap = _require.inheritGridGap;
  12. var Processor = require('../processor');
  13. var GridRowsColumns =
  14. /*#__PURE__*/
  15. function (_Declaration) {
  16. _inheritsLoose(GridRowsColumns, _Declaration);
  17. function GridRowsColumns() {
  18. return _Declaration.apply(this, arguments) || this;
  19. }
  20. var _proto = GridRowsColumns.prototype;
  21. /**
  22. * Change property name for IE
  23. */
  24. _proto.prefixed = function prefixed(prop, prefix) {
  25. if (prefix === '-ms-') {
  26. return prefixTrackProp({
  27. prop: prop,
  28. prefix: prefix
  29. });
  30. }
  31. return _Declaration.prototype.prefixed.call(this, prop, prefix);
  32. }
  33. /**
  34. * Change IE property back
  35. */
  36. ;
  37. _proto.normalize = function normalize(prop) {
  38. return prop.replace(/^grid-(rows|columns)/, 'grid-template-$1');
  39. };
  40. _proto.insert = function insert(decl, prefix, prefixes, result) {
  41. if (prefix !== '-ms-') return _Declaration.prototype.insert.call(this, decl, prefix, prefixes);
  42. var parent = decl.parent,
  43. prop = decl.prop,
  44. value = decl.value;
  45. var isRowProp = prop.includes('rows');
  46. var isColumnProp = prop.includes('columns');
  47. var hasGridTemplate = parent.some(function (i) {
  48. return i.prop === 'grid-template' || i.prop === 'grid-template-areas';
  49. });
  50. /**
  51. * Not to prefix rows declaration if grid-template(-areas) is present
  52. */
  53. if (hasGridTemplate && isRowProp) {
  54. return false;
  55. }
  56. var processor = new Processor({});
  57. var status = processor.gridStatus(parent, result);
  58. var gap = getGridGap(decl);
  59. gap = inheritGridGap(decl, gap) || gap;
  60. var gapValue = isRowProp ? gap.row : gap.column;
  61. if ((status === 'no-autoplace' || status === true) && !hasGridTemplate) {
  62. gapValue = null;
  63. }
  64. var prefixValue = prefixTrackValue({
  65. value: value,
  66. gap: gapValue
  67. });
  68. /**
  69. * Insert prefixes
  70. */
  71. decl.cloneBefore({
  72. prop: prefixTrackProp({
  73. prop: prop,
  74. prefix: prefix
  75. }),
  76. value: prefixValue
  77. });
  78. var autoflow = parent.nodes.find(function (i) {
  79. return i.prop === 'grid-auto-flow';
  80. });
  81. var autoflowValue = 'row';
  82. if (autoflow && !processor.disabled(autoflow, result)) {
  83. autoflowValue = autoflow.value.trim();
  84. }
  85. if (status === 'autoplace') {
  86. /**
  87. * Show warning if grid-template-rows decl is not found
  88. */
  89. var rowDecl = parent.nodes.find(function (i) {
  90. return i.prop === 'grid-template-rows';
  91. });
  92. if (!rowDecl && hasGridTemplate) {
  93. return undefined;
  94. } else if (!rowDecl && !hasGridTemplate) {
  95. decl.warn(result, "Autoplacement does not work without grid-template-rows property");
  96. return undefined;
  97. }
  98. /**
  99. * Show warning if grid-template-columns decl is not found
  100. */
  101. var columnDecl = parent.nodes.find(function (i) {
  102. return i.prop === 'grid-template-columns';
  103. });
  104. if (!columnDecl && !hasGridTemplate) {
  105. decl.warn(result, "Autoplacement does not work without grid-template-columns property");
  106. }
  107. /**
  108. * Autoplace grid items
  109. */
  110. if (isColumnProp && !hasGridTemplate) {
  111. autoplaceGridItems(decl, result, gap, autoflowValue);
  112. }
  113. }
  114. return undefined;
  115. };
  116. return GridRowsColumns;
  117. }(Declaration);
  118. _defineProperty(GridRowsColumns, "names", ['grid-template-rows', 'grid-template-columns', 'grid-rows', 'grid-columns']);
  119. module.exports = GridRowsColumns;