123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149 |
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
- function splitValues(value) {
- if (typeof value === 'number') {
- return [[value], false];
- }
- var rawStyle = String(value).trim();
- var importantCells = rawStyle.match(/(.*)(!important)/);
- var splitStyle = (importantCells ? importantCells[1] : rawStyle).trim().split(/\s+/);
- // Combine styles split in brackets, like `calc(1px + 2px)`
- var temp = [];
- var brackets = 0;
- return [splitStyle.reduce(function (list, item) {
- if (item.includes('(') || item.includes(')')) {
- var left = item.split('(').length - 1;
- var right = item.split(')').length - 1;
- brackets += left - right;
- }
- if (brackets >= 0) temp.push(item);
- if (brackets === 0) {
- list.push(temp.join(' '));
- temp = [];
- }
- return list;
- }, []), !!importantCells];
- }
- function noSplit(list) {
- list.notSplit = true;
- return list;
- }
- var keyMap = {
- // Inset
- inset: ['top', 'right', 'bottom', 'left'],
- insetBlock: ['top', 'bottom'],
- insetBlockStart: ['top'],
- insetBlockEnd: ['bottom'],
- insetInline: ['left', 'right'],
- insetInlineStart: ['left'],
- insetInlineEnd: ['right'],
- // Margin
- marginBlock: ['marginTop', 'marginBottom'],
- marginBlockStart: ['marginTop'],
- marginBlockEnd: ['marginBottom'],
- marginInline: ['marginLeft', 'marginRight'],
- marginInlineStart: ['marginLeft'],
- marginInlineEnd: ['marginRight'],
- // Padding
- paddingBlock: ['paddingTop', 'paddingBottom'],
- paddingBlockStart: ['paddingTop'],
- paddingBlockEnd: ['paddingBottom'],
- paddingInline: ['paddingLeft', 'paddingRight'],
- paddingInlineStart: ['paddingLeft'],
- paddingInlineEnd: ['paddingRight'],
- // Border
- borderBlock: noSplit(['borderTop', 'borderBottom']),
- borderBlockStart: noSplit(['borderTop']),
- borderBlockEnd: noSplit(['borderBottom']),
- borderInline: noSplit(['borderLeft', 'borderRight']),
- borderInlineStart: noSplit(['borderLeft']),
- borderInlineEnd: noSplit(['borderRight']),
- // Border width
- borderBlockWidth: ['borderTopWidth', 'borderBottomWidth'],
- borderBlockStartWidth: ['borderTopWidth'],
- borderBlockEndWidth: ['borderBottomWidth'],
- borderInlineWidth: ['borderLeftWidth', 'borderRightWidth'],
- borderInlineStartWidth: ['borderLeftWidth'],
- borderInlineEndWidth: ['borderRightWidth'],
- // Border style
- borderBlockStyle: ['borderTopStyle', 'borderBottomStyle'],
- borderBlockStartStyle: ['borderTopStyle'],
- borderBlockEndStyle: ['borderBottomStyle'],
- borderInlineStyle: ['borderLeftStyle', 'borderRightStyle'],
- borderInlineStartStyle: ['borderLeftStyle'],
- borderInlineEndStyle: ['borderRightStyle'],
- // Border color
- borderBlockColor: ['borderTopColor', 'borderBottomColor'],
- borderBlockStartColor: ['borderTopColor'],
- borderBlockEndColor: ['borderBottomColor'],
- borderInlineColor: ['borderLeftColor', 'borderRightColor'],
- borderInlineStartColor: ['borderLeftColor'],
- borderInlineEndColor: ['borderRightColor'],
- // Border radius
- borderStartStartRadius: ['borderTopLeftRadius'],
- borderStartEndRadius: ['borderTopRightRadius'],
- borderEndStartRadius: ['borderBottomLeftRadius'],
- borderEndEndRadius: ['borderBottomRightRadius']
- };
- function wrapImportantAndSkipCheck(value, important) {
- var parsedValue = value;
- if (important) {
- parsedValue = "".concat(parsedValue, " !important");
- }
- return {
- _skip_check_: true,
- value: parsedValue
- };
- }
- /**
- * Convert css logical properties to legacy properties.
- * Such as: `margin-block-start` to `margin-top`.
- * Transform list:
- * - inset
- * - margin
- * - padding
- * - border
- */
- var transform = {
- visit: function visit(cssObj) {
- var clone = {};
- Object.keys(cssObj).forEach(function (key) {
- var value = cssObj[key];
- var matchValue = keyMap[key];
- if (matchValue && (typeof value === 'number' || typeof value === 'string')) {
- var _splitValues = splitValues(value),
- _splitValues2 = _slicedToArray(_splitValues, 2),
- _values = _splitValues2[0],
- _important = _splitValues2[1];
- if (matchValue.length && matchValue.notSplit) {
- // not split means always give same value like border
- matchValue.forEach(function (matchKey) {
- clone[matchKey] = wrapImportantAndSkipCheck(value, _important);
- });
- } else if (matchValue.length === 1) {
- // Handle like `marginBlockStart` => `marginTop`
- clone[matchValue[0]] = wrapImportantAndSkipCheck(_values[0], _important);
- } else if (matchValue.length === 2) {
- // Handle like `marginBlock` => `marginTop` & `marginBottom`
- matchValue.forEach(function (matchKey, index) {
- var _values$index;
- clone[matchKey] = wrapImportantAndSkipCheck((_values$index = _values[index]) !== null && _values$index !== void 0 ? _values$index : _values[0], _important);
- });
- } else if (matchValue.length === 4) {
- // Handle like `inset` => `top` & `right` & `bottom` & `left`
- matchValue.forEach(function (matchKey, index) {
- var _ref, _values$index2;
- clone[matchKey] = wrapImportantAndSkipCheck((_ref = (_values$index2 = _values[index]) !== null && _values$index2 !== void 0 ? _values$index2 : _values[index - 2]) !== null && _ref !== void 0 ? _ref : _values[0], _important);
- });
- } else {
- clone[key] = value;
- }
- } else {
- clone[key] = value;
- }
- });
- return clone;
- }
- };
- export default transform;
|