@prezly/theme-kit-ui
Version:
UI components for Prezly themes
50 lines • 1.78 kB
JavaScript
import { isNotUndefined } from '@technically/is-not-undefined';
import { twMerge } from 'tailwind-merge';
export function createStyling() {
for (var _len = arguments.length, styles = new Array(_len), _key = 0; _key < _len; _key++) {
styles[_key] = arguments[_key];
}
return function () {
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
for (var _len2 = arguments.length, extraClasses = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
extraClasses[_key2 - 1] = arguments[_key2];
}
return twMerge(...compileStyling(config, styles), ...extraClasses);
};
}
function compileStyling(props, styles) {
return styles.map(styling => {
if (!styling) {
return undefined;
}
if (typeof styling === 'string') {
return styling;
}
if (Array.isArray(styling)) {
return compileStyling(props, styling);
}
if (typeof styling === 'object') {
return compileMapping(props, styling);
}
return undefined;
}).filter(isNotUndefined).flat();
}
function compileMapping(props, mapping) {
var parts = Object.entries(mapping).map(_ref => {
var [key, subStyling] = _ref;
var propName = key;
var isTruthy = Boolean(props[propName]);
if (isTruthy && typeof subStyling === 'string') {
return subStyling;
}
if (isTruthy && Array.isArray(subStyling)) {
return compileStyling(props, subStyling);
}
if (typeof subStyling === 'object' && subStyling !== null) {
var prop = props[propName];
return [isTruthy ? subStyling.$on : subStyling.$off, typeof prop === 'string' ? subStyling[prop] : undefined];
}
return undefined;
}).filter(isNotUndefined).flat();
return compileStyling(props, parts);
}