'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var jss = require('jss'); var px = jss.hasCSSTOMSupport && CSS ? CSS.px : 'px'; var ms = jss.hasCSSTOMSupport && CSS ? CSS.ms : 'ms'; var percent = jss.hasCSSTOMSupport && CSS ? CSS.percent : '%'; /** * Generated jss-plugin-default-unit CSS property units * * @type object */ var defaultUnits = { // Animation properties 'animation-delay': ms, 'animation-duration': ms, // Background properties 'background-position': px, 'background-position-x': px, 'background-position-y': px, 'background-size': px, // Border Properties border: px, 'border-bottom': px, 'border-bottom-left-radius': px, 'border-bottom-right-radius': px, 'border-bottom-width': px, 'border-left': px, 'border-left-width': px, 'border-radius': px, 'border-right': px, 'border-right-width': px, 'border-top': px, 'border-top-left-radius': px, 'border-top-right-radius': px, 'border-top-width': px, 'border-width': px, 'border-block': px, 'border-block-end': px, 'border-block-end-width': px, 'border-block-start': px, 'border-block-start-width': px, 'border-block-width': px, 'border-inline': px, 'border-inline-end': px, 'border-inline-end-width': px, 'border-inline-start': px, 'border-inline-start-width': px, 'border-inline-width': px, 'border-start-start-radius': px, 'border-start-end-radius': px, 'border-end-start-radius': px, 'border-end-end-radius': px, // Margin properties margin: px, 'margin-bottom': px, 'margin-left': px, 'margin-right': px, 'margin-top': px, 'margin-block': px, 'margin-block-end': px, 'margin-block-start': px, 'margin-inline': px, 'margin-inline-end': px, 'margin-inline-start': px, // Padding properties padding: px, 'padding-bottom': px, 'padding-left': px, 'padding-right': px, 'padding-top': px, 'padding-block': px, 'padding-block-end': px, 'padding-block-start': px, 'padding-inline': px, 'padding-inline-end': px, 'padding-inline-start': px, // Mask properties 'mask-position-x': px, 'mask-position-y': px, 'mask-size': px, // Width and height properties height: px, width: px, 'min-height': px, 'max-height': px, 'min-width': px, 'max-width': px, // Position properties bottom: px, left: px, top: px, right: px, inset: px, 'inset-block': px, 'inset-block-end': px, 'inset-block-start': px, 'inset-inline': px, 'inset-inline-end': px, 'inset-inline-start': px, // Shadow properties 'box-shadow': px, 'text-shadow': px, // Column properties 'column-gap': px, 'column-rule': px, 'column-rule-width': px, 'column-width': px, // Font and text properties 'font-size': px, 'font-size-delta': px, 'letter-spacing': px, 'text-decoration-thickness': px, 'text-indent': px, 'text-stroke': px, 'text-stroke-width': px, 'word-spacing': px, // Motion properties motion: px, 'motion-offset': px, // Outline properties outline: px, 'outline-offset': px, 'outline-width': px, // Perspective properties perspective: px, 'perspective-origin-x': percent, 'perspective-origin-y': percent, // Transform properties 'transform-origin': percent, 'transform-origin-x': percent, 'transform-origin-y': percent, 'transform-origin-z': percent, // Transition properties 'transition-delay': ms, 'transition-duration': ms, // Alignment properties 'vertical-align': px, 'flex-basis': px, // Some random properties 'shape-margin': px, size: px, gap: px, // Grid properties grid: px, 'grid-gap': px, 'row-gap': px, 'grid-row-gap': px, 'grid-column-gap': px, 'grid-template-rows': px, 'grid-template-columns': px, 'grid-auto-rows': px, 'grid-auto-columns': px, // Not existing properties. // Used to avoid issues with jss-plugin-expand integration. 'box-shadow-x': px, 'box-shadow-y': px, 'box-shadow-blur': px, 'box-shadow-spread': px, 'font-line-height': px, 'text-shadow-x': px, 'text-shadow-y': px, 'text-shadow-blur': px }; /** * Clones the object and adds a camel cased property version. */ function addCamelCasedVersion(obj) { var regExp = /(-[a-z])/g; var replace = function replace(str) { return str[1].toUpperCase(); }; var newObj = {}; for (var _key in obj) { newObj[_key] = obj[_key]; newObj[_key.replace(regExp, replace)] = obj[_key]; } return newObj; } var units = addCamelCasedVersion(defaultUnits); /** * Recursive deep style passing function */ function iterate(prop, value, options) { if (value == null) return value; if (Array.isArray(value)) { for (var i = 0; i < value.length; i++) { value[i] = iterate(prop, value[i], options); } } else if (typeof value === 'object') { if (prop === 'fallbacks') { for (var innerProp in value) { value[innerProp] = iterate(innerProp, value[innerProp], options); } } else { for (var _innerProp in value) { value[_innerProp] = iterate(prop + "-" + _innerProp, value[_innerProp], options); } } // eslint-disable-next-line no-restricted-globals } else if (typeof value === 'number' && isNaN(value) === false) { var unit = options[prop] || units[prop]; // Add the unit if available, except for the special case of 0px. if (unit && !(value === 0 && unit === px)) { return typeof unit === 'function' ? unit(value).toString() : "" + value + unit; } return value.toString(); } return value; } /** * Add unit to numeric values. */ function defaultUnit(options) { if (options === void 0) { options = {}; } var camelCasedOptions = addCamelCasedVersion(options); function onProcessStyle(style, rule) { if (rule.type !== 'style') return style; for (var prop in style) { style[prop] = iterate(prop, style[prop], camelCasedOptions); } return style; } function onChangeValue(value, prop) { return iterate(prop, value, camelCasedOptions); } return { onProcessStyle: onProcessStyle, onChangeValue: onChangeValue }; } exports.default = defaultUnit;