: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
function dotCase(input, options) {
if (options === void 0) { options = {}; }
return noCase(input, __assign({ delimiter: "." }, options));
;// CONCATENATED MODULE: ./node_modules/param-case/dist.es2015/index.js
function paramCase(input, options) {
if (options === void 0) { options = {}; }
return dotCase(input, __assign({ delimiter: "-" }, options));
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/constants.js
const VARIABLE_REFERENCE_PREFIX = 'var:';
const VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE = '|';
const VARIABLE_PATH_SEPARATOR_TOKEN_STYLE = '--';
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/utils.js
* Helper util to return a value from a certain path of the object.
* Path is specified as an array of properties, like `[ 'x', 'y' ]`.
* @param object Input object.
* @param path Path to the object property.
* @return Value of the object property at the specified path.
const getStyleValueByPath = (object, path) => {
path.forEach(fieldName => {
value = value?.[fieldName];
* Returns a JSON representation of the generated CSS rules.
* @param style Style object.
* @param options Options object with settings to adjust how the styles are generated.
* @param path An array of strings representing the path to the style value in the style object.
* @param ruleKey A CSS property key.
* @return GeneratedCSSRule[] CSS rules.
function generateRule(style, options, path, ruleKey) {
const styleValue = getStyleValueByPath(style, path);
selector: options?.selector,
value: getCSSVarFromStyleValue(styleValue)
* Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.
* @param style Style object.
* @param options Options object with settings to adjust how the styles are generated.
* @param path An array of strings representing the path to the style value in the style object.
* @param ruleKeys An array of CSS property keys and patterns.
* @param individualProperties The "sides" or individual properties for which to generate rules.
* @return GeneratedCSSRule[] CSS rules.
function generateBoxRules(style, options, path, ruleKeys, individualProperties = ['top', 'right', 'bottom', 'left']) {
const boxStyle = getStyleValueByPath(style, path);
if (typeof boxStyle === 'string') {
selector: options?.selector,
const sideRules = individualProperties.reduce((acc, side) => {
const value = getCSSVarFromStyleValue(getStyleValueByPath(boxStyle, [side]));
selector: options?.selector,
key: ruleKeys?.individual.replace('%s', upperFirst(side)),
rules.push(...sideRules);
* Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.
* @param styleValue A raw style value.
* @return string A CSS var value.
function getCSSVarFromStyleValue(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
// 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})`;
* Capitalizes the first letter in a string.
* @param string The string whose first letter the function will capitalize.
* @return String with the first letter capitalized.
function upperFirst(string) {
const [firstLetter, ...rest] = string;
return firstLetter.toUpperCase() + rest.join('');
* Converts an array of strings into a camelCase string.
* @param strings The strings to join into a camelCase string.
* @return camelCase string.
function camelCaseJoin(strings) {
const [firstItem, ...rest] = strings;
return firstItem.toLowerCase() + rest.map(upperFirst).join('');
* Safely decodes a URI with `decodeURI`. Returns the URI unmodified if
* `decodeURI` throws an error.
* @param {string} uri URI to decode.
* const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'
* @return {string} Decoded URI if possible.
function safeDecodeURI(uri) {
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/border/index.js
* Creates a function for generating CSS rules when the style path is the same as the camelCase CSS property used in React.
* @param path An array of strings representing the path to the style value in the style object.
* @return A function that generates CSS rules.
function createBorderGenerateFunction(path) {
return (style, options) => generateRule(style, options, path, camelCaseJoin(path));
* Creates a function for generating border-{top,bottom,left,right}-{color,style,width} CSS rules.
* @param edge The edge to create CSS rules for.
* @return A function that generates CSS rules.
function createBorderEdgeGenerateFunction(edge) {
return (style, options) => {
return ['color', 'style', 'width'].flatMap(key => {
const path = ['border', edge, key];
return createBorderGenerateFunction(path)(style, options);
generate: createBorderGenerateFunction(['border', 'color'])
generate: (style, options) => {
return generateBoxRules(style, options, ['border', 'radius'], {
individual: 'border%sRadius'
}, ['topLeft', 'topRight', 'bottomLeft', 'bottomRight']);
generate: createBorderGenerateFunction(['border', 'style'])
generate: createBorderGenerateFunction(['border', 'width'])
generate: createBorderEdgeGenerateFunction('top')
generate: createBorderEdgeGenerateFunction('right')
generate: createBorderEdgeGenerateFunction('bottom')
generate: createBorderEdgeGenerateFunction('left')
/* harmony default export */ const border = ([color, borderStyle, width, radius, borderTop, borderRight, borderBottom, borderLeft]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/color/background.js
generate: (style, options) => {
return generateRule(style, options, ['color', 'background'], 'backgroundColor');
/* harmony default export */ const color_background = (background);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/color/gradient.js
generate: (style, options) => {
return generateRule(style, options, ['color', 'gradient'], 'background');
/* harmony default export */ const color_gradient = (gradient);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/color/text.js
generate: (style, options) => {
return generateRule(style, options, ['color', 'text'], 'color');
/* harmony default export */ const color_text = (text_text);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/color/index.js
/* harmony default export */ const styles_color = ([color_text, color_gradient, color_background]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/dimensions/index.js
generate: (style, options) => {
return generateRule(style, options, ['dimensions', 'minHeight'], 'minHeight');
generate: (style, options) => {
return generateRule(style, options, ['dimensions', 'aspectRatio'], 'aspectRatio');
/* harmony default export */ const dimensions = ([minHeight, aspectRatio]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/background/index.js
const backgroundImage = {
generate: (style, options) => {
const _backgroundImage = style?.background?.backgroundImage;
if (typeof _backgroundImage === 'object' && _backgroundImage?.url) {
selector: options.selector,
// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.
value: `url( '${encodeURI(safeDecodeURI(_backgroundImage.url))}' )`
* If the background image is a string, it could already contain a url() function,
* or have a linear-gradient value.
if (typeof _backgroundImage === 'string') {
return generateRule(style, options, ['background', 'backgroundImage'], 'backgroundImage');
const backgroundPosition = {
name: 'backgroundPosition',
generate: (style, options) => {
return generateRule(style, options, ['background', 'backgroundPosition'], 'backgroundPosition');
const backgroundRepeat = {
name: 'backgroundRepeat',
generate: (style, options) => {
return generateRule(style, options, ['background', 'backgroundRepeat'], 'backgroundRepeat');
generate: (style, options) => {
return generateRule(style, options, ['background', 'backgroundSize'], 'backgroundSize');
/* harmony default export */ const styles_background = ([backgroundImage, backgroundPosition, backgroundRepeat, backgroundSize]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/shadow/index.js
generate: (style, options) => {
return generateRule(style, options, ['shadow'], 'boxShadow');
/* harmony default export */ const styles_shadow = ([shadow]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/outline/index.js
generate: (style, options, path = ['outline', 'color'], ruleKey = 'outlineColor') => {
return generateRule(style, options, path, ruleKey);
generate: (style, options, path = ['outline', 'offset'], ruleKey = 'outlineOffset') => {
return generateRule(style, options, path, ruleKey);
generate: (style, options, path = ['outline', 'style'], ruleKey = 'outlineStyle') => {
return generateRule(style, options, path, ruleKey);
generate: (style, options, path = ['outline', 'width'], ruleKey = 'outlineWidth') => {
return generateRule(style, options, path, ruleKey);
/* harmony default export */ const outline = ([outline_color, outlineStyle, offset, outline_width]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/spacing/padding.js
generate: (style, options) => {
return generateBoxRules(style, options, ['spacing', 'padding'], {
/* harmony default export */ const spacing_padding = (padding);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/spacing/margin.js
generate: (style, options) => {
return generateBoxRules(style, options, ['spacing', 'margin'], {
/* harmony default export */ const spacing_margin = (margin);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/spacing/index.js
/* harmony default export */ const spacing = ([spacing_margin, spacing_padding]);
;// CONCATENATED MODULE: ./node_modules/@wordpress/style-engine/build-module/styles/typography/index.js
generate: (style, options) => {
return generateRule(style, options, ['typography', 'fontSize'], 'fontSize');
generate: (style, options) => {
return generateRule(style, options, ['typography', 'fontStyle'], 'fontStyle');
generate: (style, options) => {
return generateRule(style, options, ['typography', 'fontWeight'], 'fontWeight');
generate: (style, options) => {
return generateRule(style, options, ['typography', 'fontFamily'], 'fontFamily');
generate: (style, options) => {
return generateRule(style, options, ['typography', 'letterSpacing'], 'letterSpacing');
generate: (style, options) => {
return generateRule(style, options, ['typography', 'lineHeight'], 'lineHeight');
generate: (style, options) => {