@wordpress/style-engine 2.4.0 → 2.6.0

package/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## Unreleased
 
+## 2.6.0 (2024-08-21)
+
+### New Features
+
+-   Style engine: export util to compile CSS custom var from preset string. ([#64490](https://github.com/WordPress/gutenberg/pull/64490))
+
+## 2.5.0 (2024-08-07)
+
 ## 2.4.0 (2024-07-24)
 
 ## 2.3.0 (2024-07-10)

package/README.md

@@ -258,6 +258,24 @@ _Changelog_
 
 `6.1.0` Introduced in WordPress core.
 
+### getCSSValueFromRawStyle
+
+Returns a WordPress CSS custom var value from incoming style preset value, if one is detected.
+
+The preset value is a string and follows the pattern `var:description|context|slug`.
+
+Example:
+
+`getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'
+
+_Parameters_
+
+-   _styleValue_ `StyleValue`: A string representing a raw CSS value. Non-strings won't be processed.
+
+_Returns_
+
+-   `StyleValue`: A CSS custom var value if the incoming style value is a preset value.
+
 <!-- END TOKEN(Autogenerated API docs) -->
 
 ## Glossary

package/build/index.js

@@ -5,8 +5,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.compileCSS = compileCSS;
 exports.getCSSRules = getCSSRules;
+Object.defineProperty(exports, "getCSSValueFromRawStyle", {
+  enumerable: true,
+  get: function () {
+    return _utils.getCSSValueFromRawStyle;
+  }
+});
 var _changeCase = require("change-case");
 var _styles = require("./styles");
+var _utils = require("./styles/utils");
 /**
  * External dependencies
  */
@@ -75,4 +82,6 @@ function getCSSRules(style, options = {}) {
   });
   return rules;
 }
+
+// Export style utils.
 //# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_changeCase","require","_styles","compileCSS","style","options","rules","getCSSRules","selector","inlineRules","forEach","rule","push","kebabCase","key","value","join","groupedRules","reduce","acc","selectorRules","Object","keys","subSelector","map","styleDefinitions","definition","generate"],"sources":["@wordpress/style-engine/src/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tStyle,\n\tStyleOptions,\n\tGeneratedCSSRule,\n\tStyleDefinition,\n} from './types';\nimport { styleDefinitions } from './styles';\n\n/**\n * Generates a stylesheet for a given style object and selector.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A generated stylesheet or inline style declarations.\n */\nexport function compileCSS( style: Style, options: StyleOptions = {} ): string {\n\tconst rules = getCSSRules( style, options );\n\n\t// If no selector is provided, treat generated rules as inline styles to be returned as a single string.\n\tif ( ! options?.selector ) {\n\t\tconst inlineRules: string[] = [];\n\t\trules.forEach( ( rule ) => {\n\t\t\tinlineRules.push( `${ kebabCase( rule.key ) }: ${ rule.value };` );\n\t\t} );\n\t\treturn inlineRules.join( ' ' );\n\t}\n\n\tconst groupedRules = rules.reduce(\n\t\t( acc: Record< string, GeneratedCSSRule[] >, rule ) => {\n\t\t\tconst { selector } = rule;\n\t\t\tif ( ! selector ) {\n\t\t\t\treturn acc;\n\t\t\t}\n\t\t\tif ( ! acc[ selector ] ) {\n\t\t\t\tacc[ selector ] = [];\n\t\t\t}\n\t\t\tacc[ selector ].push( rule );\n\t\t\treturn acc;\n\t\t},\n\t\t{}\n\t);\n\tconst selectorRules = Object.keys( groupedRules ).reduce(\n\t\t( acc: string[], subSelector: string ) => {\n\t\t\tacc.push(\n\t\t\t\t`${ subSelector } { ${ groupedRules[ subSelector ]\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( rule: GeneratedCSSRule ) =>\n\t\t\t\t\t\t\t`${ kebabCase( rule.key ) }: ${ rule.value };`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ' ' ) } }`\n\t\t\t);\n\t\t\treturn acc;\n\t\t},\n\t\t[]\n\t);\n\n\treturn selectorRules.join( '\\n' );\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.\n */\nexport function getCSSRules(\n\tstyle: Style,\n\toptions: StyleOptions = {}\n): GeneratedCSSRule[] {\n\tconst rules: GeneratedCSSRule[] = [];\n\tstyleDefinitions.forEach( ( definition: StyleDefinition ) => {\n\t\tif ( typeof definition.generate === 'function' ) {\n\t\t\trules.push( ...definition.generate( style, options ) );\n\t\t}\n\t} );\n\n\treturn rules;\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAWA,IAAAC,OAAA,GAAAD,OAAA;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASE,UAAUA,CAAEC,KAAY,EAAEC,OAAqB,GAAG,CAAC,CAAC,EAAW;EAC9E,MAAMC,KAAK,GAAGC,WAAW,CAAEH,KAAK,EAAEC,OAAQ,CAAC;;EAE3C;EACA,IAAK,CAAEA,OAAO,EAAEG,QAAQ,EAAG;IAC1B,MAAMC,WAAqB,GAAG,EAAE;IAChCH,KAAK,CAACI,OAAO,CAAIC,IAAI,IAAM;MAC1BF,WAAW,CAACG,IAAI,CAAG,GAAG,IAAAC,qBAAS,EAAEF,IAAI,CAACG,GAAI,CAAG,KAAKH,IAAI,CAACI,KAAO,GAAG,CAAC;IACnE,CAAE,CAAC;IACH,OAAON,WAAW,CAACO,IAAI,CAAE,GAAI,CAAC;EAC/B;EAEA,MAAMC,YAAY,GAAGX,KAAK,CAACY,MAAM,CAChC,CAAEC,GAAyC,EAAER,IAAI,KAAM;IACtD,MAAM;MAAEH;IAAS,CAAC,GAAGG,IAAI;IACzB,IAAK,CAAEH,QAAQ,EAAG;MACjB,OAAOW,GAAG;IACX;IACA,IAAK,CAAEA,GAAG,CAAEX,QAAQ,CAAE,EAAG;MACxBW,GAAG,CAAEX,QAAQ,CAAE,GAAG,EAAE;IACrB;IACAW,GAAG,CAAEX,QAAQ,CAAE,CAACI,IAAI,CAAED,IAAK,CAAC;IAC5B,OAAOQ,GAAG;EACX,CAAC,EACD,CAAC,CACF,CAAC;EACD,MAAMC,aAAa,GAAGC,MAAM,CAACC,IAAI,CAAEL,YAAa,CAAC,CAACC,MAAM,CACvD,CAAEC,GAAa,EAAEI,WAAmB,KAAM;IACzCJ,GAAG,CAACP,IAAI,CACN,GAAGW,WAAa,MAAMN,YAAY,CAAEM,WAAW,CAAE,CAChDC,GAAG,CACDb,IAAsB,IACtB,GAAG,IAAAE,qBAAS,EAAEF,IAAI,CAACG,GAAI,CAAG,KAAKH,IAAI,CAACI,KAAO,GAC9C,CAAC,CACAC,IAAI,CAAE,GAAI,CAAG,IAChB,CAAC;IACD,OAAOG,GAAG;EACX,CAAC,EACD,EACD,CAAC;EAED,OAAOC,aAAa,CAACJ,IAAI,CAAE,IAAK,CAAC;AAClC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAAST,WAAWA,CAC1BH,KAAY,EACZC,OAAqB,GAAG,CAAC,CAAC,EACL;EACrB,MAAMC,KAAyB,GAAG,EAAE;EACpCmB,wBAAgB,CAACf,OAAO,CAAIgB,UAA2B,IAAM;IAC5D,IAAK,OAAOA,UAAU,CAACC,QAAQ,KAAK,UAAU,EAAG;MAChDrB,KAAK,CAACM,IAAI,CAAE,GAAGc,UAAU,CAACC,QAAQ,CAAEvB,KAAK,EAAEC,OAAQ,CAAE,CAAC;IACvD;EACD,CAAE,CAAC;EAEH,OAAOC,KAAK;AACb","ignoreList":[]}
+{"version":3,"names":["_changeCase","require","_styles","_utils","compileCSS","style","options","rules","getCSSRules","selector","inlineRules","forEach","rule","push","kebabCase","key","value","join","groupedRules","reduce","acc","selectorRules","Object","keys","subSelector","map","styleDefinitions","definition","generate"],"sources":["@wordpress/style-engine/src/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tStyle,\n\tStyleOptions,\n\tGeneratedCSSRule,\n\tStyleDefinition,\n} from './types';\nimport { styleDefinitions } from './styles';\n\n/**\n * Generates a stylesheet for a given style object and selector.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A generated stylesheet or inline style declarations.\n */\nexport function compileCSS( style: Style, options: StyleOptions = {} ): string {\n\tconst rules = getCSSRules( style, options );\n\n\t// If no selector is provided, treat generated rules as inline styles to be returned as a single string.\n\tif ( ! options?.selector ) {\n\t\tconst inlineRules: string[] = [];\n\t\trules.forEach( ( rule ) => {\n\t\t\tinlineRules.push( `${ kebabCase( rule.key ) }: ${ rule.value };` );\n\t\t} );\n\t\treturn inlineRules.join( ' ' );\n\t}\n\n\tconst groupedRules = rules.reduce(\n\t\t( acc: Record< string, GeneratedCSSRule[] >, rule ) => {\n\t\t\tconst { selector } = rule;\n\t\t\tif ( ! selector ) {\n\t\t\t\treturn acc;\n\t\t\t}\n\t\t\tif ( ! acc[ selector ] ) {\n\t\t\t\tacc[ selector ] = [];\n\t\t\t}\n\t\t\tacc[ selector ].push( rule );\n\t\t\treturn acc;\n\t\t},\n\t\t{}\n\t);\n\tconst selectorRules = Object.keys( groupedRules ).reduce(\n\t\t( acc: string[], subSelector: string ) => {\n\t\t\tacc.push(\n\t\t\t\t`${ subSelector } { ${ groupedRules[ subSelector ]\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( rule: GeneratedCSSRule ) =>\n\t\t\t\t\t\t\t`${ kebabCase( rule.key ) }: ${ rule.value };`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ' ' ) } }`\n\t\t\t);\n\t\t\treturn acc;\n\t\t},\n\t\t[]\n\t);\n\n\treturn selectorRules.join( '\\n' );\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.\n */\nexport function getCSSRules(\n\tstyle: Style,\n\toptions: StyleOptions = {}\n): GeneratedCSSRule[] {\n\tconst rules: GeneratedCSSRule[] = [];\n\tstyleDefinitions.forEach( ( definition: StyleDefinition ) => {\n\t\tif ( typeof definition.generate === 'function' ) {\n\t\t\trules.push( ...definition.generate( style, options ) );\n\t\t}\n\t} );\n\n\treturn rules;\n}\n\n// Export style utils.\nexport { getCSSValueFromRawStyle } from './styles/utils';\n"],"mappings":";;;;;;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAWA,IAAAC,OAAA,GAAAD,OAAA;AAiFA,IAAAE,MAAA,GAAAF,OAAA;AA/FA;AACA;AACA;;AAGA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASG,UAAUA,CAAEC,KAAY,EAAEC,OAAqB,GAAG,CAAC,CAAC,EAAW;EAC9E,MAAMC,KAAK,GAAGC,WAAW,CAAEH,KAAK,EAAEC,OAAQ,CAAC;;EAE3C;EACA,IAAK,CAAEA,OAAO,EAAEG,QAAQ,EAAG;IAC1B,MAAMC,WAAqB,GAAG,EAAE;IAChCH,KAAK,CAACI,OAAO,CAAIC,IAAI,IAAM;MAC1BF,WAAW,CAACG,IAAI,CAAG,GAAG,IAAAC,qBAAS,EAAEF,IAAI,CAACG,GAAI,CAAG,KAAKH,IAAI,CAACI,KAAO,GAAG,CAAC;IACnE,CAAE,CAAC;IACH,OAAON,WAAW,CAACO,IAAI,CAAE,GAAI,CAAC;EAC/B;EAEA,MAAMC,YAAY,GAAGX,KAAK,CAACY,MAAM,CAChC,CAAEC,GAAyC,EAAER,IAAI,KAAM;IACtD,MAAM;MAAEH;IAAS,CAAC,GAAGG,IAAI;IACzB,IAAK,CAAEH,QAAQ,EAAG;MACjB,OAAOW,GAAG;IACX;IACA,IAAK,CAAEA,GAAG,CAAEX,QAAQ,CAAE,EAAG;MACxBW,GAAG,CAAEX,QAAQ,CAAE,GAAG,EAAE;IACrB;IACAW,GAAG,CAAEX,QAAQ,CAAE,CAACI,IAAI,CAAED,IAAK,CAAC;IAC5B,OAAOQ,GAAG;EACX,CAAC,EACD,CAAC,CACF,CAAC;EACD,MAAMC,aAAa,GAAGC,MAAM,CAACC,IAAI,CAAEL,YAAa,CAAC,CAACC,MAAM,CACvD,CAAEC,GAAa,EAAEI,WAAmB,KAAM;IACzCJ,GAAG,CAACP,IAAI,CACN,GAAGW,WAAa,MAAMN,YAAY,CAAEM,WAAW,CAAE,CAChDC,GAAG,CACDb,IAAsB,IACtB,GAAG,IAAAE,qBAAS,EAAEF,IAAI,CAACG,GAAI,CAAG,KAAKH,IAAI,CAACI,KAAO,GAC9C,CAAC,CACAC,IAAI,CAAE,GAAI,CAAG,IAChB,CAAC;IACD,OAAOG,GAAG;EACX,CAAC,EACD,EACD,CAAC;EAED,OAAOC,aAAa,CAACJ,IAAI,CAAE,IAAK,CAAC;AAClC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAAST,WAAWA,CAC1BH,KAAY,EACZC,OAAqB,GAAG,CAAC,CAAC,EACL;EACrB,MAAMC,KAAyB,GAAG,EAAE;EACpCmB,wBAAgB,CAACf,OAAO,CAAIgB,UAA2B,IAAM;IAC5D,IAAK,OAAOA,UAAU,CAACC,QAAQ,KAAK,UAAU,EAAG;MAChDrB,KAAK,CAACM,IAAI,CAAE,GAAGc,UAAU,CAACC,QAAQ,CAAEvB,KAAK,EAAEC,OAAQ,CAAE,CAAC;IACvD;EACD,CAAE,CAAC;EAEH,OAAOC,KAAK;AACb;;AAEA","ignoreList":[]}

package/build/styles/background/index.js

@@ -13,6 +13,12 @@ const backgroundImage = {
   name: 'backgroundImage',
   generate: (style, options) => {
     const _backgroundImage = style?.background?.backgroundImage;
+
+    /*
+     * The background image can be a string or an object.
+     * If the background image is a string, it could already contain a url() function,
+     * or have a linear-gradient value.
+     */
     if (typeof _backgroundImage === 'object' && _backgroundImage?.url) {
       return [{
         selector: options.selector,
@@ -21,15 +27,7 @@ const backgroundImage = {
         value: `url( '${encodeURI((0, _utils.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 (0, _utils.generateRule)(style, options, ['background', 'backgroundImage'], 'backgroundImage');
-    }
-    return [];
+    return (0, _utils.generateRule)(style, options, ['background', 'backgroundImage'], 'backgroundImage');
   }
 };
 const backgroundPosition = {

package/build/styles/background/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_utils","require","backgroundImage","name","generate","style","options","_backgroundImage","background","url","selector","key","value","encodeURI","safeDecodeURI","generateRule","backgroundPosition","backgroundRepeat","backgroundSize","backgroundAttachment","_default","exports","default"],"sources":["@wordpress/style-engine/src/styles/background/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule, safeDecodeURI } from '../utils';\n\nconst backgroundImage = {\n\tname: 'backgroundImage',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\tconst _backgroundImage = style?.background?.backgroundImage;\n\t\tif ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tselector: options.selector,\n\t\t\t\t\tkey: 'backgroundImage',\n\t\t\t\t\t// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.\n\t\t\t\t\tvalue: `url( '${ encodeURI(\n\t\t\t\t\t\tsafeDecodeURI( _backgroundImage.url )\n\t\t\t\t\t) }' )`,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\t/*\n\t\t * If the background image is a string, it could already contain a url() function,\n\t\t * or have a linear-gradient value.\n\t\t */\n\t\tif ( typeof _backgroundImage === 'string' ) {\n\t\t\treturn generateRule(\n\t\t\t\tstyle,\n\t\t\t\toptions,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\t'backgroundImage'\n\t\t\t);\n\t\t}\n\n\t\treturn [];\n\t},\n};\n\nconst backgroundPosition = {\n\tname: 'backgroundPosition',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t'backgroundPosition'\n\t\t);\n\t},\n};\n\nconst backgroundRepeat = {\n\tname: 'backgroundRepeat',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t'backgroundRepeat'\n\t\t);\n\t},\n};\n\nconst backgroundSize = {\n\tname: 'backgroundSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundSize' ],\n\t\t\t'backgroundSize'\n\t\t);\n\t},\n};\n\nconst backgroundAttachment = {\n\tname: 'backgroundAttachment',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t'backgroundAttachment'\n\t\t);\n\t},\n};\n\nexport default [\n\tbackgroundImage,\n\tbackgroundPosition,\n\tbackgroundRepeat,\n\tbackgroundSize,\n\tbackgroundAttachment,\n];\n"],"mappings":";;;;;;AAIA,IAAAA,MAAA,GAAAC,OAAA;AAJA;AACA;AACA;;AAIA,MAAMC,eAAe,GAAG;EACvBC,IAAI,EAAE,iBAAiB;EACvBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,MAAMC,gBAAgB,GAAGF,KAAK,EAAEG,UAAU,EAAEN,eAAe;IAC3D,IAAK,OAAOK,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,EAAEE,GAAG,EAAG;MACpE,OAAO,CACN;QACCC,QAAQ,EAAEJ,OAAO,CAACI,QAAQ;QAC1BC,GAAG,EAAE,iBAAiB;QACtB;QACAC,KAAK,EAAG,SAASC,SAAS,CACzB,IAAAC,oBAAa,EAAEP,gBAAgB,CAACE,GAAI,CACrC,CAAG;MACJ,CAAC,CACD;IACF;;IAEA;AACF;AACA;AACA;IACE,IAAK,OAAOF,gBAAgB,KAAK,QAAQ,EAAG;MAC3C,OAAO,IAAAQ,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,iBAAiB,CAAE,EACnC,iBACD,CAAC;IACF;IAEA,OAAO,EAAE;EACV;AACD,CAAC;AAED,MAAMU,kBAAkB,GAAG;EAC1Bb,IAAI,EAAE,oBAAoB;EAC1BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,oBAAoB,CAAE,EACtC,oBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMW,gBAAgB,GAAG;EACxBd,IAAI,EAAE,kBAAkB;EACxBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,kBAAkB,CAAE,EACpC,kBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMY,cAAc,GAAG;EACtBf,IAAI,EAAE,gBAAgB;EACtBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,gBAAgB,CAAE,EAClC,gBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMa,oBAAoB,GAAG;EAC5BhB,IAAI,EAAE,sBAAsB;EAC5BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,sBAAsB,CAAE,EACxC,sBACD,CAAC;EACF;AACD,CAAC;AAAC,IAAAc,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEa,CACdpB,eAAe,EACfc,kBAAkB,EAClBC,gBAAgB,EAChBC,cAAc,EACdC,oBAAoB,CACpB","ignoreList":[]}
+{"version":3,"names":["_utils","require","backgroundImage","name","generate","style","options","_backgroundImage","background","url","selector","key","value","encodeURI","safeDecodeURI","generateRule","backgroundPosition","backgroundRepeat","backgroundSize","backgroundAttachment","_default","exports","default"],"sources":["@wordpress/style-engine/src/styles/background/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule, safeDecodeURI } from '../utils';\n\nconst backgroundImage = {\n\tname: 'backgroundImage',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\tconst _backgroundImage = style?.background?.backgroundImage;\n\n\t\t/*\n\t\t * The background image can be a string or an object.\n\t\t * If the background image is a string, it could already contain a url() function,\n\t\t * or have a linear-gradient value.\n\t\t */\n\t\tif ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tselector: options.selector,\n\t\t\t\t\tkey: 'backgroundImage',\n\t\t\t\t\t// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.\n\t\t\t\t\tvalue: `url( '${ encodeURI(\n\t\t\t\t\t\tsafeDecodeURI( _backgroundImage.url )\n\t\t\t\t\t) }' )`,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t'backgroundImage'\n\t\t);\n\t},\n};\n\nconst backgroundPosition = {\n\tname: 'backgroundPosition',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t'backgroundPosition'\n\t\t);\n\t},\n};\n\nconst backgroundRepeat = {\n\tname: 'backgroundRepeat',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t'backgroundRepeat'\n\t\t);\n\t},\n};\n\nconst backgroundSize = {\n\tname: 'backgroundSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundSize' ],\n\t\t\t'backgroundSize'\n\t\t);\n\t},\n};\n\nconst backgroundAttachment = {\n\tname: 'backgroundAttachment',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t'backgroundAttachment'\n\t\t);\n\t},\n};\n\nexport default [\n\tbackgroundImage,\n\tbackgroundPosition,\n\tbackgroundRepeat,\n\tbackgroundSize,\n\tbackgroundAttachment,\n];\n"],"mappings":";;;;;;AAIA,IAAAA,MAAA,GAAAC,OAAA;AAJA;AACA;AACA;;AAIA,MAAMC,eAAe,GAAG;EACvBC,IAAI,EAAE,iBAAiB;EACvBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,MAAMC,gBAAgB,GAAGF,KAAK,EAAEG,UAAU,EAAEN,eAAe;;IAE3D;AACF;AACA;AACA;AACA;IACE,IAAK,OAAOK,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,EAAEE,GAAG,EAAG;MACpE,OAAO,CACN;QACCC,QAAQ,EAAEJ,OAAO,CAACI,QAAQ;QAC1BC,GAAG,EAAE,iBAAiB;QACtB;QACAC,KAAK,EAAG,SAASC,SAAS,CACzB,IAAAC,oBAAa,EAAEP,gBAAgB,CAACE,GAAI,CACrC,CAAG;MACJ,CAAC,CACD;IACF;IAEA,OAAO,IAAAM,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,iBAAiB,CAAE,EACnC,iBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMU,kBAAkB,GAAG;EAC1Bb,IAAI,EAAE,oBAAoB;EAC1BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,oBAAoB,CAAE,EACtC,oBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMW,gBAAgB,GAAG;EACxBd,IAAI,EAAE,kBAAkB;EACxBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,kBAAkB,CAAE,EACpC,kBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMY,cAAc,GAAG;EACtBf,IAAI,EAAE,gBAAgB;EACtBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,gBAAgB,CAAE,EAClC,gBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMa,oBAAoB,GAAG;EAC5BhB,IAAI,EAAE,sBAAsB;EAC5BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAO,IAAAS,mBAAY,EAClBV,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,sBAAsB,CAAE,EACxC,sBACD,CAAC;EACF;AACD,CAAC;AAAC,IAAAc,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEa,CACdpB,eAAe,EACfc,kBAAkB,EAClBC,gBAAgB,EAChBC,cAAc,EACdC,oBAAoB,CACpB","ignoreList":[]}

package/build/styles/utils.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.camelCaseJoin = camelCaseJoin;
 exports.generateBoxRules = generateBoxRules;
 exports.generateRule = generateRule;
-exports.getCSSVarFromStyleValue = getCSSVarFromStyleValue;
+exports.getCSSValueFromRawStyle = getCSSValueFromRawStyle;
 exports.getStyleValueByPath = void 0;
 exports.safeDecodeURI = safeDecodeURI;
 exports.upperFirst = upperFirst;
@@ -52,7 +52,7 @@ function generateRule(style, options, path, ruleKey) {
   return styleValue ? [{
     selector: options?.selector,
     key: ruleKey,
-    value: getCSSVarFromStyleValue(styleValue)
+    value: getCSSValueFromRawStyle(styleValue)
   }] : [];
 }
 
@@ -81,7 +81,7 @@ function generateBoxRules(style, options, path, ruleKeys, individualProperties =
     });
   } else {
     const sideRules = individualProperties.reduce((acc, side) => {
-      const value = getCSSVarFromStyleValue(getStyleValueByPath(boxStyle, [side]));
+      const value = getCSSValueFromRawStyle(getStyleValueByPath(boxStyle, [side]));
       if (value) {
         acc.push({
           selector: options?.selector,
@@ -97,13 +97,21 @@ function generateBoxRules(style, options, path, ruleKeys, individualProperties =
 }
 
 /**
- * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.
+ * Returns a WordPress CSS custom var value from incoming style preset value,
+ * if one is detected.
  *
- * @param styleValue A raw style value.
+ * The preset value is a string and follows the pattern `var:description|context|slug`.
  *
- * @return string A CSS var value.
+ * Example:
+ *
+ * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'
+ *
+ * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.
+ *
+ * @return A CSS custom var value if the incoming style value is a preset value.
  */
-function getCSSVarFromStyleValue(styleValue) {
+
+function getCSSValueFromRawStyle(styleValue) {
   if (typeof styleValue === 'string' && styleValue.startsWith(_constants.VARIABLE_REFERENCE_PREFIX)) {
     const variable = styleValue.slice(_constants.VARIABLE_REFERENCE_PREFIX.length).split(_constants.VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE).map(presetVariable => (0, _changeCase.paramCase)(presetVariable, {
       splitRegexp: [/([a-z0-9])([A-Z])/g,

package/build/styles/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_changeCase","require","_constants","getStyleValueByPath","object","path","value","forEach","fieldName","exports","generateRule","style","options","ruleKey","styleValue","selector","key","getCSSVarFromStyleValue","generateBoxRules","ruleKeys","individualProperties","boxStyle","rules","push","default","sideRules","reduce","acc","side","individual","replace","upperFirst","startsWith","VARIABLE_REFERENCE_PREFIX","variable","slice","length","split","VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE","map","presetVariable","kebabCase","splitRegexp","join","VARIABLE_PATH_SEPARATOR_TOKEN_STYLE","string","firstLetter","rest","toUpperCase","camelCaseJoin","strings","firstItem","toLowerCase","safeDecodeURI","uri","decodeURI","uriError"],"sources":["@wordpress/style-engine/src/styles/utils.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCssRulesKeys,\n\tGeneratedCSSRule,\n\tStyle,\n\tBox,\n\tStyleOptions,\n} from '../types';\nimport {\n\tVARIABLE_REFERENCE_PREFIX,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_STYLE,\n} from './constants';\n\n/**\n * Helper util to return a value from a certain path of the object.\n * Path is specified as an array of properties, like `[ 'x', 'y' ]`.\n *\n * @param object Input object.\n * @param path   Path to the object property.\n * @return Value of the object property at the specified path.\n */\nexport const getStyleValueByPath = (\n\tobject: Record< any, any >,\n\tpath: string[]\n) => {\n\tlet value: any = object;\n\tpath.forEach( ( fieldName: string ) => {\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value;\n};\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @param style   Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path    An array of strings representing the path to the style value in the style object.\n * @param ruleKey A CSS property key.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateRule(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKey: string\n): GeneratedCSSRule[] {\n\tconst styleValue: string | undefined = getStyleValueByPath( style, path );\n\n\treturn styleValue\n\t\t? [\n\t\t\t\t{\n\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\tkey: ruleKey,\n\t\t\t\t\tvalue: getCSSVarFromStyleValue( styleValue ),\n\t\t\t\t},\n\t\t  ]\n\t\t: [];\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.\n *\n * @param style                Style object.\n * @param options              Options object with settings to adjust how the styles are generated.\n * @param path                 An array of strings representing the path to the style value in the style object.\n * @param ruleKeys             An array of CSS property keys and patterns.\n * @param individualProperties The \"sides\" or individual properties for which to generate rules.\n *\n * @return GeneratedCSSRule[]  CSS rules.\n */\nexport function generateBoxRules(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKeys: CssRulesKeys,\n\tindividualProperties: string[] = [ 'top', 'right', 'bottom', 'left' ]\n): GeneratedCSSRule[] {\n\tconst boxStyle: Box | string | undefined = getStyleValueByPath(\n\t\tstyle,\n\t\tpath\n\t);\n\tif ( ! boxStyle ) {\n\t\treturn [];\n\t}\n\n\tconst rules: GeneratedCSSRule[] = [];\n\tif ( typeof boxStyle === 'string' ) {\n\t\trules.push( {\n\t\t\tselector: options?.selector,\n\t\t\tkey: ruleKeys.default,\n\t\t\tvalue: boxStyle,\n\t\t} );\n\t} else {\n\t\tconst sideRules = individualProperties.reduce(\n\t\t\t( acc: GeneratedCSSRule[], side: string ) => {\n\t\t\t\tconst value: string | undefined = getCSSVarFromStyleValue(\n\t\t\t\t\tgetStyleValueByPath( boxStyle, [ side ] )\n\t\t\t\t);\n\t\t\t\tif ( value ) {\n\t\t\t\t\tacc.push( {\n\t\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\t\tkey: ruleKeys?.individual.replace(\n\t\t\t\t\t\t\t'%s',\n\t\t\t\t\t\t\tupperFirst( side )\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\trules.push( ...sideRules );\n\t}\n\n\treturn rules;\n}\n\n/**\n * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.\n *\n * @param styleValue A raw style value.\n *\n * @return string A CSS var value.\n */\nexport function getCSSVarFromStyleValue( styleValue: string ): string {\n\tif (\n\t\ttypeof styleValue === 'string' &&\n\t\tstyleValue.startsWith( VARIABLE_REFERENCE_PREFIX )\n\t) {\n\t\tconst variable = styleValue\n\t\t\t.slice( VARIABLE_REFERENCE_PREFIX.length )\n\t\t\t.split( VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE )\n\t\t\t.map( ( presetVariable ) =>\n\t\t\t\tkebabCase( presetVariable, {\n\t\t\t\t\tsplitRegexp: [\n\t\t\t\t\t\t/([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t\t\t\t/([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t\t\t\t],\n\t\t\t\t} )\n\t\t\t)\n\t\t\t.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );\n\t\treturn `var(--wp--${ variable })`;\n\t}\n\treturn styleValue;\n}\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param string The string whose first letter the function will capitalize.\n *\n * @return String with the first letter capitalized.\n */\nexport function upperFirst( string: string ): string {\n\tconst [ firstLetter, ...rest ] = string;\n\treturn firstLetter.toUpperCase() + rest.join( '' );\n}\n\n/**\n * Converts an array of strings into a camelCase string.\n *\n * @param strings The strings to join into a camelCase string.\n *\n * @return camelCase string.\n */\nexport function camelCaseJoin( strings: string[] ): string {\n\tconst [ firstItem, ...rest ] = strings;\n\treturn firstItem.toLowerCase() + rest.map( upperFirst ).join( '' );\n}\n\n/**\n * Safely decodes a URI with `decodeURI`. Returns the URI unmodified if\n * `decodeURI` throws an error.\n *\n * @param {string} uri URI to decode.\n *\n * @example\n * ```js\n * const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'\n * ```\n *\n * @return {string} Decoded URI if possible.\n */\nexport function safeDecodeURI( uri: string ): string {\n\ttry {\n\t\treturn decodeURI( uri );\n\t} catch ( uriError ) {\n\t\treturn uri;\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_changeCase","require","_constants","getStyleValueByPath","object","path","value","forEach","fieldName","exports","generateRule","style","options","ruleKey","styleValue","selector","key","getCSSValueFromRawStyle","generateBoxRules","ruleKeys","individualProperties","boxStyle","rules","push","default","sideRules","reduce","acc","side","individual","replace","upperFirst","startsWith","VARIABLE_REFERENCE_PREFIX","variable","slice","length","split","VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE","map","presetVariable","kebabCase","splitRegexp","join","VARIABLE_PATH_SEPARATOR_TOKEN_STYLE","string","firstLetter","rest","toUpperCase","camelCaseJoin","strings","firstItem","toLowerCase","safeDecodeURI","uri","decodeURI","uriError"],"sources":["@wordpress/style-engine/src/styles/utils.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCssRulesKeys,\n\tGeneratedCSSRule,\n\tStyle,\n\tBox,\n\tStyleOptions,\n} from '../types';\nimport {\n\tVARIABLE_REFERENCE_PREFIX,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_STYLE,\n} from './constants';\n\n/**\n * Helper util to return a value from a certain path of the object.\n * Path is specified as an array of properties, like `[ 'x', 'y' ]`.\n *\n * @param object Input object.\n * @param path   Path to the object property.\n * @return Value of the object property at the specified path.\n */\nexport const getStyleValueByPath = (\n\tobject: Record< any, any >,\n\tpath: string[]\n) => {\n\tlet value: any = object;\n\tpath.forEach( ( fieldName: string ) => {\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value;\n};\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @param style   Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path    An array of strings representing the path to the style value in the style object.\n * @param ruleKey A CSS property key.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateRule(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKey: string\n): GeneratedCSSRule[] {\n\tconst styleValue: string | undefined = getStyleValueByPath( style, path );\n\n\treturn styleValue\n\t\t? [\n\t\t\t\t{\n\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\tkey: ruleKey,\n\t\t\t\t\tvalue: getCSSValueFromRawStyle( styleValue ),\n\t\t\t\t},\n\t\t  ]\n\t\t: [];\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.\n *\n * @param style                Style object.\n * @param options              Options object with settings to adjust how the styles are generated.\n * @param path                 An array of strings representing the path to the style value in the style object.\n * @param ruleKeys             An array of CSS property keys and patterns.\n * @param individualProperties The \"sides\" or individual properties for which to generate rules.\n *\n * @return GeneratedCSSRule[]  CSS rules.\n */\nexport function generateBoxRules(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKeys: CssRulesKeys,\n\tindividualProperties: string[] = [ 'top', 'right', 'bottom', 'left' ]\n): GeneratedCSSRule[] {\n\tconst boxStyle: Box | string | undefined = getStyleValueByPath(\n\t\tstyle,\n\t\tpath\n\t);\n\tif ( ! boxStyle ) {\n\t\treturn [];\n\t}\n\n\tconst rules: GeneratedCSSRule[] = [];\n\tif ( typeof boxStyle === 'string' ) {\n\t\trules.push( {\n\t\t\tselector: options?.selector,\n\t\t\tkey: ruleKeys.default,\n\t\t\tvalue: boxStyle,\n\t\t} );\n\t} else {\n\t\tconst sideRules = individualProperties.reduce(\n\t\t\t( acc: GeneratedCSSRule[], side: string ) => {\n\t\t\t\tconst value = getCSSValueFromRawStyle(\n\t\t\t\t\tgetStyleValueByPath( boxStyle, [ side ] )\n\t\t\t\t);\n\t\t\t\tif ( value ) {\n\t\t\t\t\tacc.push( {\n\t\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\t\tkey: ruleKeys?.individual.replace(\n\t\t\t\t\t\t\t'%s',\n\t\t\t\t\t\t\tupperFirst( side )\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\trules.push( ...sideRules );\n\t}\n\n\treturn rules;\n}\n\n/**\n * Returns a WordPress CSS custom var value from incoming style preset value,\n * if one is detected.\n *\n * The preset value is a string and follows the pattern `var:description|context|slug`.\n *\n * Example:\n *\n * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'\n *\n * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.\n *\n * @return A CSS custom var value if the incoming style value is a preset value.\n */\n\nexport function getCSSValueFromRawStyle< StyleValue = string >(\n\tstyleValue: StyleValue\n): StyleValue {\n\tif (\n\t\ttypeof styleValue === 'string' &&\n\t\tstyleValue.startsWith( VARIABLE_REFERENCE_PREFIX )\n\t) {\n\t\tconst variable = styleValue\n\t\t\t.slice( VARIABLE_REFERENCE_PREFIX.length )\n\t\t\t.split( VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE )\n\t\t\t.map( ( presetVariable ) =>\n\t\t\t\tkebabCase( presetVariable, {\n\t\t\t\t\tsplitRegexp: [\n\t\t\t\t\t\t/([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t\t\t\t/([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t\t\t\t],\n\t\t\t\t} )\n\t\t\t)\n\t\t\t.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );\n\t\treturn `var(--wp--${ variable })` as StyleValue;\n\t}\n\treturn styleValue;\n}\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param string The string whose first letter the function will capitalize.\n *\n * @return String with the first letter capitalized.\n */\nexport function upperFirst( string: string ): string {\n\tconst [ firstLetter, ...rest ] = string;\n\treturn firstLetter.toUpperCase() + rest.join( '' );\n}\n\n/**\n * Converts an array of strings into a camelCase string.\n *\n * @param strings The strings to join into a camelCase string.\n *\n * @return camelCase string.\n */\nexport function camelCaseJoin( strings: string[] ): string {\n\tconst [ firstItem, ...rest ] = strings;\n\treturn firstItem.toLowerCase() + rest.map( upperFirst ).join( '' );\n}\n\n/**\n * Safely decodes a URI with `decodeURI`. Returns the URI unmodified if\n * `decodeURI` throws an error.\n *\n * @param {string} uri URI to decode.\n *\n * @example\n * ```js\n * const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'\n * ```\n *\n * @return {string} Decoded URI if possible.\n */\nexport function safeDecodeURI( uri: string ): string {\n\ttry {\n\t\treturn decodeURI( uri );\n\t} catch ( uriError ) {\n\t\treturn uri;\n\t}\n}\n"],"mappings":";;;;;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAYA,IAAAC,UAAA,GAAAD,OAAA;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAME,mBAAmB,GAAGA,CAClCC,MAA0B,EAC1BC,IAAc,KACV;EACJ,IAAIC,KAAU,GAAGF,MAAM;EACvBC,IAAI,CAACE,OAAO,CAAIC,SAAiB,IAAM;IACtCF,KAAK,GAAGA,KAAK,GAAIE,SAAS,CAAE;EAC7B,CAAE,CAAC;EACH,OAAOF,KAAK;AACb,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATAG,OAAA,CAAAN,mBAAA,GAAAA,mBAAA;AAUO,SAASO,YAAYA,CAC3BC,KAAY,EACZC,OAAqB,EACrBP,IAAc,EACdQ,OAAe,EACM;EACrB,MAAMC,UAA8B,GAAGX,mBAAmB,CAAEQ,KAAK,EAAEN,IAAK,CAAC;EAEzE,OAAOS,UAAU,GACd,CACA;IACCC,QAAQ,EAAEH,OAAO,EAAEG,QAAQ;IAC3BC,GAAG,EAAEH,OAAO;IACZP,KAAK,EAAEW,uBAAuB,CAAEH,UAAW;EAC5C,CAAC,CACA,GACD,EAAE;AACN;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASI,gBAAgBA,CAC/BP,KAAY,EACZC,OAAqB,EACrBP,IAAc,EACdc,QAAsB,EACtBC,oBAA8B,GAAG,CAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAE,EAChD;EACrB,MAAMC,QAAkC,GAAGlB,mBAAmB,CAC7DQ,KAAK,EACLN,IACD,CAAC;EACD,IAAK,CAAEgB,QAAQ,EAAG;IACjB,OAAO,EAAE;EACV;EAEA,MAAMC,KAAyB,GAAG,EAAE;EACpC,IAAK,OAAOD,QAAQ,KAAK,QAAQ,EAAG;IACnCC,KAAK,CAACC,IAAI,CAAE;MACXR,QAAQ,EAAEH,OAAO,EAAEG,QAAQ;MAC3BC,GAAG,EAAEG,QAAQ,CAACK,OAAO;MACrBlB,KAAK,EAAEe;IACR,CAAE,CAAC;EACJ,CAAC,MAAM;IACN,MAAMI,SAAS,GAAGL,oBAAoB,CAACM,MAAM,CAC5C,CAAEC,GAAuB,EAAEC,IAAY,KAAM;MAC5C,MAAMtB,KAAK,GAAGW,uBAAuB,CACpCd,mBAAmB,CAAEkB,QAAQ,EAAE,CAAEO,IAAI,CAAG,CACzC,CAAC;MACD,IAAKtB,KAAK,EAAG;QACZqB,GAAG,CAACJ,IAAI,CAAE;UACTR,QAAQ,EAAEH,OAAO,EAAEG,QAAQ;UAC3BC,GAAG,EAAEG,QAAQ,EAAEU,UAAU,CAACC,OAAO,CAChC,IAAI,EACJC,UAAU,CAAEH,IAAK,CAClB,CAAC;UACDtB;QACD,CAAE,CAAC;MACJ;MACA,OAAOqB,GAAG;IACX,CAAC,EACD,EACD,CAAC;IACDL,KAAK,CAACC,IAAI,CAAE,GAAGE,SAAU,CAAC;EAC3B;EAEA,OAAOH,KAAK;AACb;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEO,SAASL,uBAAuBA,CACtCH,UAAsB,EACT;EACb,IACC,OAAOA,UAAU,KAAK,QAAQ,IAC9BA,UAAU,CAACkB,UAAU,CAAEC,oCAA0B,CAAC,EACjD;IACD,MAAMC,QAAQ,GAAGpB,UAAU,CACzBqB,KAAK,CAAEF,oCAAyB,CAACG,MAAO,CAAC,CACzCC,KAAK,CAAEC,kDAAwC,CAAC,CAChDC,GAAG,CAAIC,cAAc,IACrB,IAAAC,qBAAS,EAAED,cAAc,EAAE;MAC1BE,WAAW,EAAE,CACZ,oBAAoB;MAAE;MACtB,iBAAiB;MAAE;MACnB,oBAAoB;MAAE;MACtB,sBAAsB,CAAE;MAAA;IAE1B,CAAE,CACH,CAAC,CACAC,IAAI,CAAEC,8CAAoC,CAAC;IAC7C,OAAQ,aAAaV,QAAU,GAAE;EAClC;EACA,OAAOpB,UAAU;AAClB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASiB,UAAUA,CAAEc,MAAc,EAAW;EACpD,MAAM,CAAEC,WAAW,EAAE,GAAGC,IAAI,CAAE,GAAGF,MAAM;EACvC,OAAOC,WAAW,CAACE,WAAW,CAAC,CAAC,GAAGD,IAAI,CAACJ,IAAI,CAAE,EAAG,CAAC;AACnD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASM,aAAaA,CAAEC,OAAiB,EAAW;EAC1D,MAAM,CAAEC,SAAS,EAAE,GAAGJ,IAAI,CAAE,GAAGG,OAAO;EACtC,OAAOC,SAAS,CAACC,WAAW,CAAC,CAAC,GAAGL,IAAI,CAACR,GAAG,CAAER,UAAW,CAAC,CAACY,IAAI,CAAE,EAAG,CAAC;AACnE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASU,aAAaA,CAAEC,GAAW,EAAW;EACpD,IAAI;IACH,OAAOC,SAAS,CAAED,GAAI,CAAC;EACxB,CAAC,CAAC,OAAQE,QAAQ,EAAG;IACpB,OAAOF,GAAG;EACX;AACD","ignoreList":[]}

package/build/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/style-engine/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\ntype BoxVariant = 'margin' | 'padding';\nexport interface Box< T extends BoxVariant | undefined = undefined > {\n\ttop?: CSSProperties[ T extends undefined ? 'top' : `${ T }Top` ];\n\tright?: CSSProperties[ T extends undefined ? 'right' : `${ T }Right` ];\n\tbottom?: CSSProperties[ T extends undefined ? 'bottom' : `${ T }Bottom` ];\n\tleft?: CSSProperties[ T extends undefined ? 'left' : `${ T }Left` ];\n}\n\nexport type BoxEdge = 'top' | 'right' | 'bottom' | 'left';\n\n// `T` is one of the values in `BorderIndividualProperty`. The expected CSSProperties key is something like `borderTopColor`.\nexport interface BorderIndividualStyles< T extends BoxEdge > {\n\tcolor?: CSSProperties[ `border${ Capitalize< T > }Color` ];\n\tstyle?: CSSProperties[ `border${ Capitalize< T > }Style` ];\n\twidth?: CSSProperties[ `border${ Capitalize< T > }Width` ];\n}\n\nexport interface Style {\n\tbackground?: {\n\t\tbackgroundImage?:\n\t\t\t| { url?: CSSProperties[ 'backgroundImage' ]; source?: string }\n\t\t\t| CSSProperties[ 'backgroundImage' ];\n\t\tbackgroundPosition?: CSSProperties[ 'backgroundPosition' ];\n\t\tbackgroundRepeat?: CSSProperties[ 'backgroundRepeat' ];\n\t\tbackgroundSize?: CSSProperties[ 'backgroundSize' ];\n\t};\n\tborder?: {\n\t\tcolor?: CSSProperties[ 'borderColor' ];\n\t\tradius?:\n\t\t\t| CSSProperties[ 'borderRadius' ]\n\t\t\t| {\n\t\t\t\t\ttopLeft?: CSSProperties[ 'borderTopLeftRadius' ];\n\t\t\t\t\ttopRight?: CSSProperties[ 'borderTopRightRadius' ];\n\t\t\t\t\tbottomLeft?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t\t\tbottomRight?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t  };\n\t\tstyle?: CSSProperties[ 'borderStyle' ];\n\t\twidth?: CSSProperties[ 'borderWidth' ];\n\t\ttop?: BorderIndividualStyles< 'top' >;\n\t\tright?: BorderIndividualStyles< 'right' >;\n\t\tbottom?: BorderIndividualStyles< 'bottom' >;\n\t\tleft?: BorderIndividualStyles< 'left' >;\n\t};\n\tdimensions?: {\n\t\taspectRatio?: CSSProperties[ 'aspectRatio' ];\n\t\tminHeight?: CSSProperties[ 'minHeight' ];\n\t};\n\tspacing?: {\n\t\tmargin?: CSSProperties[ 'margin' ] | Box< 'margin' >;\n\t\tpadding?: CSSProperties[ 'padding' ] | Box< 'padding' >;\n\t};\n\ttypography?: {\n\t\tfontSize?: CSSProperties[ 'fontSize' ];\n\t\tfontFamily?: CSSProperties[ 'fontFamily' ];\n\t\tfontWeight?: CSSProperties[ 'fontWeight' ];\n\t\tfontStyle?: CSSProperties[ 'fontStyle' ];\n\t\tletterSpacing?: CSSProperties[ 'letterSpacing' ];\n\t\tlineHeight?: CSSProperties[ 'lineHeight' ];\n\t\ttextColumns?: CSSProperties[ 'columnCount' ];\n\t\ttextDecoration?: CSSProperties[ 'textDecoration' ];\n\t\ttextTransform?: CSSProperties[ 'textTransform' ];\n\t\twritingMode?: CSSProperties[ 'writingMode' ];\n\t};\n\tcolor?: {\n\t\ttext?: CSSProperties[ 'color' ];\n\t\tbackground?: CSSProperties[ 'backgroundColor' ];\n\t\tgradient?: CSSProperties[ 'background' ];\n\t};\n\telements?: {\n\t\tlink?: {\n\t\t\tcolor?: {\n\t\t\t\ttext?: CSSProperties[ 'color' ];\n\t\t\t};\n\t\t};\n\t};\n}\n\nexport interface CssRulesKeys {\n\tdefault: string;\n\tindividual: string;\n}\n\nexport interface StyleOptions {\n\t/**\n\t * CSS selector for the generated style.\n\t */\n\tselector?: string;\n}\n\nexport interface GeneratedCSSRule {\n\tselector?: string;\n\tvalue: string;\n\t/**\n\t * The CSS key in JS style attribute format, compatible with React.\n\t * E.g. `paddingTop` instead of `padding-top`.\n\t */\n\tkey: string;\n}\n\nexport interface GenerateFunction {\n\t( style: Style, options: StyleOptions ): GeneratedCSSRule[];\n}\n\nexport interface StyleDefinition {\n\tname: string;\n\tgenerate?: GenerateFunction;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/style-engine/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\ntype BoxVariant = 'margin' | 'padding';\nexport interface Box< T extends BoxVariant | undefined = undefined > {\n\ttop?: CSSProperties[ T extends undefined ? 'top' : `${ T }Top` ];\n\tright?: CSSProperties[ T extends undefined ? 'right' : `${ T }Right` ];\n\tbottom?: CSSProperties[ T extends undefined ? 'bottom' : `${ T }Bottom` ];\n\tleft?: CSSProperties[ T extends undefined ? 'left' : `${ T }Left` ];\n}\n\nexport type BoxEdge = 'top' | 'right' | 'bottom' | 'left';\n\n// `T` is one of the values in `BorderIndividualProperty`. The expected CSSProperties key is something like `borderTopColor`.\nexport interface BorderIndividualStyles< T extends BoxEdge > {\n\tcolor?: CSSProperties[ `border${ Capitalize< T > }Color` ];\n\tstyle?: CSSProperties[ `border${ Capitalize< T > }Style` ];\n\twidth?: CSSProperties[ `border${ Capitalize< T > }Width` ];\n}\n\nexport interface Style {\n\tbackground?: {\n\t\tbackgroundImage?:\n\t\t\t| { url?: CSSProperties[ 'backgroundImage' ]; source?: string }\n\t\t\t| CSSProperties[ 'backgroundImage' ];\n\t\tbackgroundPosition?: CSSProperties[ 'backgroundPosition' ];\n\t\tbackgroundRepeat?: CSSProperties[ 'backgroundRepeat' ];\n\t\tbackgroundSize?: CSSProperties[ 'backgroundSize' ];\n\t};\n\tborder?: {\n\t\tcolor?: CSSProperties[ 'borderColor' ];\n\t\tradius?:\n\t\t\t| CSSProperties[ 'borderRadius' ]\n\t\t\t| {\n\t\t\t\t\ttopLeft?: CSSProperties[ 'borderTopLeftRadius' ];\n\t\t\t\t\ttopRight?: CSSProperties[ 'borderTopRightRadius' ];\n\t\t\t\t\tbottomLeft?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t\t\tbottomRight?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t  };\n\t\tstyle?: CSSProperties[ 'borderStyle' ];\n\t\twidth?: CSSProperties[ 'borderWidth' ];\n\t\ttop?: BorderIndividualStyles< 'top' >;\n\t\tright?: BorderIndividualStyles< 'right' >;\n\t\tbottom?: BorderIndividualStyles< 'bottom' >;\n\t\tleft?: BorderIndividualStyles< 'left' >;\n\t};\n\tdimensions?: {\n\t\taspectRatio?: CSSProperties[ 'aspectRatio' ];\n\t\tminHeight?: CSSProperties[ 'minHeight' ];\n\t};\n\tspacing?: {\n\t\tmargin?: CSSProperties[ 'margin' ] | Box< 'margin' >;\n\t\tpadding?: CSSProperties[ 'padding' ] | Box< 'padding' >;\n\t};\n\ttypography?: {\n\t\tfontSize?: CSSProperties[ 'fontSize' ];\n\t\tfontFamily?: CSSProperties[ 'fontFamily' ];\n\t\tfontWeight?: CSSProperties[ 'fontWeight' ];\n\t\tfontStyle?: CSSProperties[ 'fontStyle' ];\n\t\tletterSpacing?: CSSProperties[ 'letterSpacing' ];\n\t\tlineHeight?: CSSProperties[ 'lineHeight' ];\n\t\ttextColumns?: CSSProperties[ 'columnCount' ];\n\t\ttextDecoration?: CSSProperties[ 'textDecoration' ];\n\t\ttextTransform?: CSSProperties[ 'textTransform' ];\n\t\twritingMode?: CSSProperties[ 'writingMode' ];\n\t};\n\tcolor?: {\n\t\ttext?: CSSProperties[ 'color' ];\n\t\tbackground?: CSSProperties[ 'backgroundColor' ];\n\t\tgradient?: CSSProperties[ 'background' ];\n\t};\n\telements?: {\n\t\tlink?: {\n\t\t\tcolor?: {\n\t\t\t\ttext?: CSSProperties[ 'color' ];\n\t\t\t};\n\t\t};\n\t};\n}\n\nexport interface CssRulesKeys {\n\tdefault: string;\n\tindividual: string;\n}\n\nexport interface StyleOptions {\n\t/**\n\t * CSS selector for the generated style.\n\t */\n\tselector?: string;\n}\n\nexport interface GeneratedCSSRule {\n\tselector?: string;\n\tvalue: string | unknown;\n\t/**\n\t * The CSS key in JS style attribute format, compatible with React.\n\t * E.g. `paddingTop` instead of `padding-top`.\n\t */\n\tkey: string;\n}\n\nexport interface GenerateFunction {\n\t( style: Style, options: StyleOptions ): GeneratedCSSRule[];\n}\n\nexport interface StyleDefinition {\n\tname: string;\n\tgenerate?: GenerateFunction;\n}\n"],"mappings":"","ignoreList":[]}

package/build-module/index.js

@@ -69,4 +69,7 @@ export function getCSSRules(style, options = {}) {
   });
   return rules;
 }
+
+// Export style utils.
+export { getCSSValueFromRawStyle } from './styles/utils';
 //# sourceMappingURL=index.js.map

package/build-module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["paramCase","kebabCase","styleDefinitions","compileCSS","style","options","rules","getCSSRules","selector","inlineRules","forEach","rule","push","key","value","join","groupedRules","reduce","acc","selectorRules","Object","keys","subSelector","map","definition","generate"],"sources":["@wordpress/style-engine/src/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tStyle,\n\tStyleOptions,\n\tGeneratedCSSRule,\n\tStyleDefinition,\n} from './types';\nimport { styleDefinitions } from './styles';\n\n/**\n * Generates a stylesheet for a given style object and selector.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A generated stylesheet or inline style declarations.\n */\nexport function compileCSS( style: Style, options: StyleOptions = {} ): string {\n\tconst rules = getCSSRules( style, options );\n\n\t// If no selector is provided, treat generated rules as inline styles to be returned as a single string.\n\tif ( ! options?.selector ) {\n\t\tconst inlineRules: string[] = [];\n\t\trules.forEach( ( rule ) => {\n\t\t\tinlineRules.push( `${ kebabCase( rule.key ) }: ${ rule.value };` );\n\t\t} );\n\t\treturn inlineRules.join( ' ' );\n\t}\n\n\tconst groupedRules = rules.reduce(\n\t\t( acc: Record< string, GeneratedCSSRule[] >, rule ) => {\n\t\t\tconst { selector } = rule;\n\t\t\tif ( ! selector ) {\n\t\t\t\treturn acc;\n\t\t\t}\n\t\t\tif ( ! acc[ selector ] ) {\n\t\t\t\tacc[ selector ] = [];\n\t\t\t}\n\t\t\tacc[ selector ].push( rule );\n\t\t\treturn acc;\n\t\t},\n\t\t{}\n\t);\n\tconst selectorRules = Object.keys( groupedRules ).reduce(\n\t\t( acc: string[], subSelector: string ) => {\n\t\t\tacc.push(\n\t\t\t\t`${ subSelector } { ${ groupedRules[ subSelector ]\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( rule: GeneratedCSSRule ) =>\n\t\t\t\t\t\t\t`${ kebabCase( rule.key ) }: ${ rule.value };`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ' ' ) } }`\n\t\t\t);\n\t\t\treturn acc;\n\t\t},\n\t\t[]\n\t);\n\n\treturn selectorRules.join( '\\n' );\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.\n */\nexport function getCSSRules(\n\tstyle: Style,\n\toptions: StyleOptions = {}\n): GeneratedCSSRule[] {\n\tconst rules: GeneratedCSSRule[] = [];\n\tstyleDefinitions.forEach( ( definition: StyleDefinition ) => {\n\t\tif ( typeof definition.generate === 'function' ) {\n\t\t\trules.push( ...definition.generate( style, options ) );\n\t\t}\n\t} );\n\n\treturn rules;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,IAAIC,SAAS,QAAQ,aAAa;;AAEpD;AACA;AACA;;AAOA,SAASC,gBAAgB,QAAQ,UAAU;;AAE3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,UAAUA,CAAEC,KAAY,EAAEC,OAAqB,GAAG,CAAC,CAAC,EAAW;EAC9E,MAAMC,KAAK,GAAGC,WAAW,CAAEH,KAAK,EAAEC,OAAQ,CAAC;;EAE3C;EACA,IAAK,CAAEA,OAAO,EAAEG,QAAQ,EAAG;IAC1B,MAAMC,WAAqB,GAAG,EAAE;IAChCH,KAAK,CAACI,OAAO,CAAIC,IAAI,IAAM;MAC1BF,WAAW,CAACG,IAAI,CAAG,GAAGX,SAAS,CAAEU,IAAI,CAACE,GAAI,CAAG,KAAKF,IAAI,CAACG,KAAO,GAAG,CAAC;IACnE,CAAE,CAAC;IACH,OAAOL,WAAW,CAACM,IAAI,CAAE,GAAI,CAAC;EAC/B;EAEA,MAAMC,YAAY,GAAGV,KAAK,CAACW,MAAM,CAChC,CAAEC,GAAyC,EAAEP,IAAI,KAAM;IACtD,MAAM;MAAEH;IAAS,CAAC,GAAGG,IAAI;IACzB,IAAK,CAAEH,QAAQ,EAAG;MACjB,OAAOU,GAAG;IACX;IACA,IAAK,CAAEA,GAAG,CAAEV,QAAQ,CAAE,EAAG;MACxBU,GAAG,CAAEV,QAAQ,CAAE,GAAG,EAAE;IACrB;IACAU,GAAG,CAAEV,QAAQ,CAAE,CAACI,IAAI,CAAED,IAAK,CAAC;IAC5B,OAAOO,GAAG;EACX,CAAC,EACD,CAAC,CACF,CAAC;EACD,MAAMC,aAAa,GAAGC,MAAM,CAACC,IAAI,CAAEL,YAAa,CAAC,CAACC,MAAM,CACvD,CAAEC,GAAa,EAAEI,WAAmB,KAAM;IACzCJ,GAAG,CAACN,IAAI,CACN,GAAGU,WAAa,MAAMN,YAAY,CAAEM,WAAW,CAAE,CAChDC,GAAG,CACDZ,IAAsB,IACtB,GAAGV,SAAS,CAAEU,IAAI,CAACE,GAAI,CAAG,KAAKF,IAAI,CAACG,KAAO,GAC9C,CAAC,CACAC,IAAI,CAAE,GAAI,CAAG,IAChB,CAAC;IACD,OAAOG,GAAG;EACX,CAAC,EACD,EACD,CAAC;EAED,OAAOC,aAAa,CAACJ,IAAI,CAAE,IAAK,CAAC;AAClC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASR,WAAWA,CAC1BH,KAAY,EACZC,OAAqB,GAAG,CAAC,CAAC,EACL;EACrB,MAAMC,KAAyB,GAAG,EAAE;EACpCJ,gBAAgB,CAACQ,OAAO,CAAIc,UAA2B,IAAM;IAC5D,IAAK,OAAOA,UAAU,CAACC,QAAQ,KAAK,UAAU,EAAG;MAChDnB,KAAK,CAACM,IAAI,CAAE,GAAGY,UAAU,CAACC,QAAQ,CAAErB,KAAK,EAAEC,OAAQ,CAAE,CAAC;IACvD;EACD,CAAE,CAAC;EAEH,OAAOC,KAAK;AACb","ignoreList":[]}
+{"version":3,"names":["paramCase","kebabCase","styleDefinitions","compileCSS","style","options","rules","getCSSRules","selector","inlineRules","forEach","rule","push","key","value","join","groupedRules","reduce","acc","selectorRules","Object","keys","subSelector","map","definition","generate","getCSSValueFromRawStyle"],"sources":["@wordpress/style-engine/src/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tStyle,\n\tStyleOptions,\n\tGeneratedCSSRule,\n\tStyleDefinition,\n} from './types';\nimport { styleDefinitions } from './styles';\n\n/**\n * Generates a stylesheet for a given style object and selector.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A generated stylesheet or inline style declarations.\n */\nexport function compileCSS( style: Style, options: StyleOptions = {} ): string {\n\tconst rules = getCSSRules( style, options );\n\n\t// If no selector is provided, treat generated rules as inline styles to be returned as a single string.\n\tif ( ! options?.selector ) {\n\t\tconst inlineRules: string[] = [];\n\t\trules.forEach( ( rule ) => {\n\t\t\tinlineRules.push( `${ kebabCase( rule.key ) }: ${ rule.value };` );\n\t\t} );\n\t\treturn inlineRules.join( ' ' );\n\t}\n\n\tconst groupedRules = rules.reduce(\n\t\t( acc: Record< string, GeneratedCSSRule[] >, rule ) => {\n\t\t\tconst { selector } = rule;\n\t\t\tif ( ! selector ) {\n\t\t\t\treturn acc;\n\t\t\t}\n\t\t\tif ( ! acc[ selector ] ) {\n\t\t\t\tacc[ selector ] = [];\n\t\t\t}\n\t\t\tacc[ selector ].push( rule );\n\t\t\treturn acc;\n\t\t},\n\t\t{}\n\t);\n\tconst selectorRules = Object.keys( groupedRules ).reduce(\n\t\t( acc: string[], subSelector: string ) => {\n\t\t\tacc.push(\n\t\t\t\t`${ subSelector } { ${ groupedRules[ subSelector ]\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( rule: GeneratedCSSRule ) =>\n\t\t\t\t\t\t\t`${ kebabCase( rule.key ) }: ${ rule.value };`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ' ' ) } }`\n\t\t\t);\n\t\t\treturn acc;\n\t\t},\n\t\t[]\n\t);\n\n\treturn selectorRules.join( '\\n' );\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @since 6.1.0 Introduced in WordPress core.\n *\n * @param style   Style object, for example, the value of a block's attributes.style object or the top level styles in theme.json\n * @param options Options object with settings to adjust how the styles are generated.\n *\n * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.\n */\nexport function getCSSRules(\n\tstyle: Style,\n\toptions: StyleOptions = {}\n): GeneratedCSSRule[] {\n\tconst rules: GeneratedCSSRule[] = [];\n\tstyleDefinitions.forEach( ( definition: StyleDefinition ) => {\n\t\tif ( typeof definition.generate === 'function' ) {\n\t\t\trules.push( ...definition.generate( style, options ) );\n\t\t}\n\t} );\n\n\treturn rules;\n}\n\n// Export style utils.\nexport { getCSSValueFromRawStyle } from './styles/utils';\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,IAAIC,SAAS,QAAQ,aAAa;;AAEpD;AACA;AACA;;AAOA,SAASC,gBAAgB,QAAQ,UAAU;;AAE3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,UAAUA,CAAEC,KAAY,EAAEC,OAAqB,GAAG,CAAC,CAAC,EAAW;EAC9E,MAAMC,KAAK,GAAGC,WAAW,CAAEH,KAAK,EAAEC,OAAQ,CAAC;;EAE3C;EACA,IAAK,CAAEA,OAAO,EAAEG,QAAQ,EAAG;IAC1B,MAAMC,WAAqB,GAAG,EAAE;IAChCH,KAAK,CAACI,OAAO,CAAIC,IAAI,IAAM;MAC1BF,WAAW,CAACG,IAAI,CAAG,GAAGX,SAAS,CAAEU,IAAI,CAACE,GAAI,CAAG,KAAKF,IAAI,CAACG,KAAO,GAAG,CAAC;IACnE,CAAE,CAAC;IACH,OAAOL,WAAW,CAACM,IAAI,CAAE,GAAI,CAAC;EAC/B;EAEA,MAAMC,YAAY,GAAGV,KAAK,CAACW,MAAM,CAChC,CAAEC,GAAyC,EAAEP,IAAI,KAAM;IACtD,MAAM;MAAEH;IAAS,CAAC,GAAGG,IAAI;IACzB,IAAK,CAAEH,QAAQ,EAAG;MACjB,OAAOU,GAAG;IACX;IACA,IAAK,CAAEA,GAAG,CAAEV,QAAQ,CAAE,EAAG;MACxBU,GAAG,CAAEV,QAAQ,CAAE,GAAG,EAAE;IACrB;IACAU,GAAG,CAAEV,QAAQ,CAAE,CAACI,IAAI,CAAED,IAAK,CAAC;IAC5B,OAAOO,GAAG;EACX,CAAC,EACD,CAAC,CACF,CAAC;EACD,MAAMC,aAAa,GAAGC,MAAM,CAACC,IAAI,CAAEL,YAAa,CAAC,CAACC,MAAM,CACvD,CAAEC,GAAa,EAAEI,WAAmB,KAAM;IACzCJ,GAAG,CAACN,IAAI,CACN,GAAGU,WAAa,MAAMN,YAAY,CAAEM,WAAW,CAAE,CAChDC,GAAG,CACDZ,IAAsB,IACtB,GAAGV,SAAS,CAAEU,IAAI,CAACE,GAAI,CAAG,KAAKF,IAAI,CAACG,KAAO,GAC9C,CAAC,CACAC,IAAI,CAAE,GAAI,CAAG,IAChB,CAAC;IACD,OAAOG,GAAG;EACX,CAAC,EACD,EACD,CAAC;EAED,OAAOC,aAAa,CAACJ,IAAI,CAAE,IAAK,CAAC;AAClC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASR,WAAWA,CAC1BH,KAAY,EACZC,OAAqB,GAAG,CAAC,CAAC,EACL;EACrB,MAAMC,KAAyB,GAAG,EAAE;EACpCJ,gBAAgB,CAACQ,OAAO,CAAIc,UAA2B,IAAM;IAC5D,IAAK,OAAOA,UAAU,CAACC,QAAQ,KAAK,UAAU,EAAG;MAChDnB,KAAK,CAACM,IAAI,CAAE,GAAGY,UAAU,CAACC,QAAQ,CAAErB,KAAK,EAAEC,OAAQ,CAAE,CAAC;IACvD;EACD,CAAE,CAAC;EAEH,OAAOC,KAAK;AACb;;AAEA;AACA,SAASoB,uBAAuB,QAAQ,gBAAgB","ignoreList":[]}

package/build-module/styles/background/index.js

@@ -7,6 +7,12 @@ const backgroundImage = {
   name: 'backgroundImage',
   generate: (style, options) => {
     const _backgroundImage = style?.background?.backgroundImage;
+
+    /*
+     * The background image can be a string or an object.
+     * If the background image is a string, it could already contain a url() function,
+     * or have a linear-gradient value.
+     */
     if (typeof _backgroundImage === 'object' && _backgroundImage?.url) {
       return [{
         selector: options.selector,
@@ -15,15 +21,7 @@ const backgroundImage = {
         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');
-    }
-    return [];
+    return generateRule(style, options, ['background', 'backgroundImage'], 'backgroundImage');
   }
 };
 const backgroundPosition = {

package/build-module/styles/background/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["generateRule","safeDecodeURI","backgroundImage","name","generate","style","options","_backgroundImage","background","url","selector","key","value","encodeURI","backgroundPosition","backgroundRepeat","backgroundSize","backgroundAttachment"],"sources":["@wordpress/style-engine/src/styles/background/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule, safeDecodeURI } from '../utils';\n\nconst backgroundImage = {\n\tname: 'backgroundImage',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\tconst _backgroundImage = style?.background?.backgroundImage;\n\t\tif ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tselector: options.selector,\n\t\t\t\t\tkey: 'backgroundImage',\n\t\t\t\t\t// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.\n\t\t\t\t\tvalue: `url( '${ encodeURI(\n\t\t\t\t\t\tsafeDecodeURI( _backgroundImage.url )\n\t\t\t\t\t) }' )`,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\t/*\n\t\t * If the background image is a string, it could already contain a url() function,\n\t\t * or have a linear-gradient value.\n\t\t */\n\t\tif ( typeof _backgroundImage === 'string' ) {\n\t\t\treturn generateRule(\n\t\t\t\tstyle,\n\t\t\t\toptions,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\t'backgroundImage'\n\t\t\t);\n\t\t}\n\n\t\treturn [];\n\t},\n};\n\nconst backgroundPosition = {\n\tname: 'backgroundPosition',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t'backgroundPosition'\n\t\t);\n\t},\n};\n\nconst backgroundRepeat = {\n\tname: 'backgroundRepeat',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t'backgroundRepeat'\n\t\t);\n\t},\n};\n\nconst backgroundSize = {\n\tname: 'backgroundSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundSize' ],\n\t\t\t'backgroundSize'\n\t\t);\n\t},\n};\n\nconst backgroundAttachment = {\n\tname: 'backgroundAttachment',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t'backgroundAttachment'\n\t\t);\n\t},\n};\n\nexport default [\n\tbackgroundImage,\n\tbackgroundPosition,\n\tbackgroundRepeat,\n\tbackgroundSize,\n\tbackgroundAttachment,\n];\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,YAAY,EAAEC,aAAa,QAAQ,UAAU;AAEtD,MAAMC,eAAe,GAAG;EACvBC,IAAI,EAAE,iBAAiB;EACvBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,MAAMC,gBAAgB,GAAGF,KAAK,EAAEG,UAAU,EAAEN,eAAe;IAC3D,IAAK,OAAOK,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,EAAEE,GAAG,EAAG;MACpE,OAAO,CACN;QACCC,QAAQ,EAAEJ,OAAO,CAACI,QAAQ;QAC1BC,GAAG,EAAE,iBAAiB;QACtB;QACAC,KAAK,EAAG,SAASC,SAAS,CACzBZ,aAAa,CAAEM,gBAAgB,CAACE,GAAI,CACrC,CAAG;MACJ,CAAC,CACD;IACF;;IAEA;AACF;AACA;AACA;IACE,IAAK,OAAOF,gBAAgB,KAAK,QAAQ,EAAG;MAC3C,OAAOP,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,iBAAiB,CAAE,EACnC,iBACD,CAAC;IACF;IAEA,OAAO,EAAE;EACV;AACD,CAAC;AAED,MAAMQ,kBAAkB,GAAG;EAC1BX,IAAI,EAAE,oBAAoB;EAC1BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,oBAAoB,CAAE,EACtC,oBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMS,gBAAgB,GAAG;EACxBZ,IAAI,EAAE,kBAAkB;EACxBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,kBAAkB,CAAE,EACpC,kBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMU,cAAc,GAAG;EACtBb,IAAI,EAAE,gBAAgB;EACtBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,gBAAgB,CAAE,EAClC,gBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMW,oBAAoB,GAAG;EAC5Bd,IAAI,EAAE,sBAAsB;EAC5BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,sBAAsB,CAAE,EACxC,sBACD,CAAC;EACF;AACD,CAAC;AAED,eAAe,CACdJ,eAAe,EACfY,kBAAkB,EAClBC,gBAAgB,EAChBC,cAAc,EACdC,oBAAoB,CACpB","ignoreList":[]}
+{"version":3,"names":["generateRule","safeDecodeURI","backgroundImage","name","generate","style","options","_backgroundImage","background","url","selector","key","value","encodeURI","backgroundPosition","backgroundRepeat","backgroundSize","backgroundAttachment"],"sources":["@wordpress/style-engine/src/styles/background/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Style, StyleOptions } from '../../types';\nimport { generateRule, safeDecodeURI } from '../utils';\n\nconst backgroundImage = {\n\tname: 'backgroundImage',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\tconst _backgroundImage = style?.background?.backgroundImage;\n\n\t\t/*\n\t\t * The background image can be a string or an object.\n\t\t * If the background image is a string, it could already contain a url() function,\n\t\t * or have a linear-gradient value.\n\t\t */\n\t\tif ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tselector: options.selector,\n\t\t\t\t\tkey: 'backgroundImage',\n\t\t\t\t\t// Passed `url` may already be encoded. To prevent double encoding, decodeURI is executed to revert to the original string.\n\t\t\t\t\tvalue: `url( '${ encodeURI(\n\t\t\t\t\t\tsafeDecodeURI( _backgroundImage.url )\n\t\t\t\t\t) }' )`,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t'backgroundImage'\n\t\t);\n\t},\n};\n\nconst backgroundPosition = {\n\tname: 'backgroundPosition',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t'backgroundPosition'\n\t\t);\n\t},\n};\n\nconst backgroundRepeat = {\n\tname: 'backgroundRepeat',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t'backgroundRepeat'\n\t\t);\n\t},\n};\n\nconst backgroundSize = {\n\tname: 'backgroundSize',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundSize' ],\n\t\t\t'backgroundSize'\n\t\t);\n\t},\n};\n\nconst backgroundAttachment = {\n\tname: 'backgroundAttachment',\n\tgenerate: ( style: Style, options: StyleOptions ) => {\n\t\treturn generateRule(\n\t\t\tstyle,\n\t\t\toptions,\n\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t'backgroundAttachment'\n\t\t);\n\t},\n};\n\nexport default [\n\tbackgroundImage,\n\tbackgroundPosition,\n\tbackgroundRepeat,\n\tbackgroundSize,\n\tbackgroundAttachment,\n];\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,YAAY,EAAEC,aAAa,QAAQ,UAAU;AAEtD,MAAMC,eAAe,GAAG;EACvBC,IAAI,EAAE,iBAAiB;EACvBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,MAAMC,gBAAgB,GAAGF,KAAK,EAAEG,UAAU,EAAEN,eAAe;;IAE3D;AACF;AACA;AACA;AACA;IACE,IAAK,OAAOK,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,EAAEE,GAAG,EAAG;MACpE,OAAO,CACN;QACCC,QAAQ,EAAEJ,OAAO,CAACI,QAAQ;QAC1BC,GAAG,EAAE,iBAAiB;QACtB;QACAC,KAAK,EAAG,SAASC,SAAS,CACzBZ,aAAa,CAAEM,gBAAgB,CAACE,GAAI,CACrC,CAAG;MACJ,CAAC,CACD;IACF;IAEA,OAAOT,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,iBAAiB,CAAE,EACnC,iBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMQ,kBAAkB,GAAG;EAC1BX,IAAI,EAAE,oBAAoB;EAC1BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,oBAAoB,CAAE,EACtC,oBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMS,gBAAgB,GAAG;EACxBZ,IAAI,EAAE,kBAAkB;EACxBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,kBAAkB,CAAE,EACpC,kBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMU,cAAc,GAAG;EACtBb,IAAI,EAAE,gBAAgB;EACtBC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,gBAAgB,CAAE,EAClC,gBACD,CAAC;EACF;AACD,CAAC;AAED,MAAMW,oBAAoB,GAAG;EAC5Bd,IAAI,EAAE,sBAAsB;EAC5BC,QAAQ,EAAEA,CAAEC,KAAY,EAAEC,OAAqB,KAAM;IACpD,OAAON,YAAY,CAClBK,KAAK,EACLC,OAAO,EACP,CAAE,YAAY,EAAE,sBAAsB,CAAE,EACxC,sBACD,CAAC;EACF;AACD,CAAC;AAED,eAAe,CACdJ,eAAe,EACfY,kBAAkB,EAClBC,gBAAgB,EAChBC,cAAc,EACdC,oBAAoB,CACpB","ignoreList":[]}

package/build-module/styles/utils.js

@@ -40,7 +40,7 @@ export function generateRule(style, options, path, ruleKey) {
   return styleValue ? [{
     selector: options?.selector,
     key: ruleKey,
-    value: getCSSVarFromStyleValue(styleValue)
+    value: getCSSValueFromRawStyle(styleValue)
   }] : [];
 }
 
@@ -69,7 +69,7 @@ export function generateBoxRules(style, options, path, ruleKeys, individualPrope
     });
   } else {
     const sideRules = individualProperties.reduce((acc, side) => {
-      const value = getCSSVarFromStyleValue(getStyleValueByPath(boxStyle, [side]));
+      const value = getCSSValueFromRawStyle(getStyleValueByPath(boxStyle, [side]));
       if (value) {
         acc.push({
           selector: options?.selector,
@@ -85,13 +85,21 @@ export function generateBoxRules(style, options, path, ruleKeys, individualPrope
 }
 
 /**
- * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.
+ * Returns a WordPress CSS custom var value from incoming style preset value,
+ * if one is detected.
  *
- * @param styleValue A raw style value.
+ * The preset value is a string and follows the pattern `var:description|context|slug`.
  *
- * @return string A CSS var value.
+ * Example:
+ *
+ * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'
+ *
+ * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.
+ *
+ * @return A CSS custom var value if the incoming style value is a preset value.
  */
-export function getCSSVarFromStyleValue(styleValue) {
+
+export 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 => kebabCase(presetVariable, {
       splitRegexp: [/([a-z0-9])([A-Z])/g,

package/build-module/styles/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["paramCase","kebabCase","VARIABLE_REFERENCE_PREFIX","VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE","VARIABLE_PATH_SEPARATOR_TOKEN_STYLE","getStyleValueByPath","object","path","value","forEach","fieldName","generateRule","style","options","ruleKey","styleValue","selector","key","getCSSVarFromStyleValue","generateBoxRules","ruleKeys","individualProperties","boxStyle","rules","push","default","sideRules","reduce","acc","side","individual","replace","upperFirst","startsWith","variable","slice","length","split","map","presetVariable","splitRegexp","join","string","firstLetter","rest","toUpperCase","camelCaseJoin","strings","firstItem","toLowerCase","safeDecodeURI","uri","decodeURI","uriError"],"sources":["@wordpress/style-engine/src/styles/utils.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCssRulesKeys,\n\tGeneratedCSSRule,\n\tStyle,\n\tBox,\n\tStyleOptions,\n} from '../types';\nimport {\n\tVARIABLE_REFERENCE_PREFIX,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_STYLE,\n} from './constants';\n\n/**\n * Helper util to return a value from a certain path of the object.\n * Path is specified as an array of properties, like `[ 'x', 'y' ]`.\n *\n * @param object Input object.\n * @param path   Path to the object property.\n * @return Value of the object property at the specified path.\n */\nexport const getStyleValueByPath = (\n\tobject: Record< any, any >,\n\tpath: string[]\n) => {\n\tlet value: any = object;\n\tpath.forEach( ( fieldName: string ) => {\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value;\n};\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @param style   Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path    An array of strings representing the path to the style value in the style object.\n * @param ruleKey A CSS property key.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateRule(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKey: string\n): GeneratedCSSRule[] {\n\tconst styleValue: string | undefined = getStyleValueByPath( style, path );\n\n\treturn styleValue\n\t\t? [\n\t\t\t\t{\n\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\tkey: ruleKey,\n\t\t\t\t\tvalue: getCSSVarFromStyleValue( styleValue ),\n\t\t\t\t},\n\t\t  ]\n\t\t: [];\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.\n *\n * @param style                Style object.\n * @param options              Options object with settings to adjust how the styles are generated.\n * @param path                 An array of strings representing the path to the style value in the style object.\n * @param ruleKeys             An array of CSS property keys and patterns.\n * @param individualProperties The \"sides\" or individual properties for which to generate rules.\n *\n * @return GeneratedCSSRule[]  CSS rules.\n */\nexport function generateBoxRules(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKeys: CssRulesKeys,\n\tindividualProperties: string[] = [ 'top', 'right', 'bottom', 'left' ]\n): GeneratedCSSRule[] {\n\tconst boxStyle: Box | string | undefined = getStyleValueByPath(\n\t\tstyle,\n\t\tpath\n\t);\n\tif ( ! boxStyle ) {\n\t\treturn [];\n\t}\n\n\tconst rules: GeneratedCSSRule[] = [];\n\tif ( typeof boxStyle === 'string' ) {\n\t\trules.push( {\n\t\t\tselector: options?.selector,\n\t\t\tkey: ruleKeys.default,\n\t\t\tvalue: boxStyle,\n\t\t} );\n\t} else {\n\t\tconst sideRules = individualProperties.reduce(\n\t\t\t( acc: GeneratedCSSRule[], side: string ) => {\n\t\t\t\tconst value: string | undefined = getCSSVarFromStyleValue(\n\t\t\t\t\tgetStyleValueByPath( boxStyle, [ side ] )\n\t\t\t\t);\n\t\t\t\tif ( value ) {\n\t\t\t\t\tacc.push( {\n\t\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\t\tkey: ruleKeys?.individual.replace(\n\t\t\t\t\t\t\t'%s',\n\t\t\t\t\t\t\tupperFirst( side )\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\trules.push( ...sideRules );\n\t}\n\n\treturn rules;\n}\n\n/**\n * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.\n *\n * @param styleValue A raw style value.\n *\n * @return string A CSS var value.\n */\nexport function getCSSVarFromStyleValue( styleValue: string ): string {\n\tif (\n\t\ttypeof styleValue === 'string' &&\n\t\tstyleValue.startsWith( VARIABLE_REFERENCE_PREFIX )\n\t) {\n\t\tconst variable = styleValue\n\t\t\t.slice( VARIABLE_REFERENCE_PREFIX.length )\n\t\t\t.split( VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE )\n\t\t\t.map( ( presetVariable ) =>\n\t\t\t\tkebabCase( presetVariable, {\n\t\t\t\t\tsplitRegexp: [\n\t\t\t\t\t\t/([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t\t\t\t/([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t\t\t\t],\n\t\t\t\t} )\n\t\t\t)\n\t\t\t.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );\n\t\treturn `var(--wp--${ variable })`;\n\t}\n\treturn styleValue;\n}\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param string The string whose first letter the function will capitalize.\n *\n * @return String with the first letter capitalized.\n */\nexport function upperFirst( string: string ): string {\n\tconst [ firstLetter, ...rest ] = string;\n\treturn firstLetter.toUpperCase() + rest.join( '' );\n}\n\n/**\n * Converts an array of strings into a camelCase string.\n *\n * @param strings The strings to join into a camelCase string.\n *\n * @return camelCase string.\n */\nexport function camelCaseJoin( strings: string[] ): string {\n\tconst [ firstItem, ...rest ] = strings;\n\treturn firstItem.toLowerCase() + rest.map( upperFirst ).join( '' );\n}\n\n/**\n * Safely decodes a URI with `decodeURI`. Returns the URI unmodified if\n * `decodeURI` throws an error.\n *\n * @param {string} uri URI to decode.\n *\n * @example\n * ```js\n * const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'\n * ```\n *\n * @return {string} Decoded URI if possible.\n */\nexport function safeDecodeURI( uri: string ): string {\n\ttry {\n\t\treturn decodeURI( uri );\n\t} catch ( uriError ) {\n\t\treturn uri;\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["paramCase","kebabCase","VARIABLE_REFERENCE_PREFIX","VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE","VARIABLE_PATH_SEPARATOR_TOKEN_STYLE","getStyleValueByPath","object","path","value","forEach","fieldName","generateRule","style","options","ruleKey","styleValue","selector","key","getCSSValueFromRawStyle","generateBoxRules","ruleKeys","individualProperties","boxStyle","rules","push","default","sideRules","reduce","acc","side","individual","replace","upperFirst","startsWith","variable","slice","length","split","map","presetVariable","splitRegexp","join","string","firstLetter","rest","toUpperCase","camelCaseJoin","strings","firstItem","toLowerCase","safeDecodeURI","uri","decodeURI","uriError"],"sources":["@wordpress/style-engine/src/styles/utils.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCssRulesKeys,\n\tGeneratedCSSRule,\n\tStyle,\n\tBox,\n\tStyleOptions,\n} from '../types';\nimport {\n\tVARIABLE_REFERENCE_PREFIX,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE,\n\tVARIABLE_PATH_SEPARATOR_TOKEN_STYLE,\n} from './constants';\n\n/**\n * Helper util to return a value from a certain path of the object.\n * Path is specified as an array of properties, like `[ 'x', 'y' ]`.\n *\n * @param object Input object.\n * @param path   Path to the object property.\n * @return Value of the object property at the specified path.\n */\nexport const getStyleValueByPath = (\n\tobject: Record< any, any >,\n\tpath: string[]\n) => {\n\tlet value: any = object;\n\tpath.forEach( ( fieldName: string ) => {\n\t\tvalue = value?.[ fieldName ];\n\t} );\n\treturn value;\n};\n\n/**\n * Returns a JSON representation of the generated CSS rules.\n *\n * @param style   Style object.\n * @param options Options object with settings to adjust how the styles are generated.\n * @param path    An array of strings representing the path to the style value in the style object.\n * @param ruleKey A CSS property key.\n *\n * @return GeneratedCSSRule[] CSS rules.\n */\nexport function generateRule(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKey: string\n): GeneratedCSSRule[] {\n\tconst styleValue: string | undefined = getStyleValueByPath( style, path );\n\n\treturn styleValue\n\t\t? [\n\t\t\t\t{\n\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\tkey: ruleKey,\n\t\t\t\t\tvalue: getCSSValueFromRawStyle( styleValue ),\n\t\t\t\t},\n\t\t  ]\n\t\t: [];\n}\n\n/**\n * Returns a JSON representation of the generated CSS rules taking into account box model properties, top, right, bottom, left.\n *\n * @param style                Style object.\n * @param options              Options object with settings to adjust how the styles are generated.\n * @param path                 An array of strings representing the path to the style value in the style object.\n * @param ruleKeys             An array of CSS property keys and patterns.\n * @param individualProperties The \"sides\" or individual properties for which to generate rules.\n *\n * @return GeneratedCSSRule[]  CSS rules.\n */\nexport function generateBoxRules(\n\tstyle: Style,\n\toptions: StyleOptions,\n\tpath: string[],\n\truleKeys: CssRulesKeys,\n\tindividualProperties: string[] = [ 'top', 'right', 'bottom', 'left' ]\n): GeneratedCSSRule[] {\n\tconst boxStyle: Box | string | undefined = getStyleValueByPath(\n\t\tstyle,\n\t\tpath\n\t);\n\tif ( ! boxStyle ) {\n\t\treturn [];\n\t}\n\n\tconst rules: GeneratedCSSRule[] = [];\n\tif ( typeof boxStyle === 'string' ) {\n\t\trules.push( {\n\t\t\tselector: options?.selector,\n\t\t\tkey: ruleKeys.default,\n\t\t\tvalue: boxStyle,\n\t\t} );\n\t} else {\n\t\tconst sideRules = individualProperties.reduce(\n\t\t\t( acc: GeneratedCSSRule[], side: string ) => {\n\t\t\t\tconst value = getCSSValueFromRawStyle(\n\t\t\t\t\tgetStyleValueByPath( boxStyle, [ side ] )\n\t\t\t\t);\n\t\t\t\tif ( value ) {\n\t\t\t\t\tacc.push( {\n\t\t\t\t\t\tselector: options?.selector,\n\t\t\t\t\t\tkey: ruleKeys?.individual.replace(\n\t\t\t\t\t\t\t'%s',\n\t\t\t\t\t\t\tupperFirst( side )\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\trules.push( ...sideRules );\n\t}\n\n\treturn rules;\n}\n\n/**\n * Returns a WordPress CSS custom var value from incoming style preset value,\n * if one is detected.\n *\n * The preset value is a string and follows the pattern `var:description|context|slug`.\n *\n * Example:\n *\n * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'\n *\n * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.\n *\n * @return A CSS custom var value if the incoming style value is a preset value.\n */\n\nexport function getCSSValueFromRawStyle< StyleValue = string >(\n\tstyleValue: StyleValue\n): StyleValue {\n\tif (\n\t\ttypeof styleValue === 'string' &&\n\t\tstyleValue.startsWith( VARIABLE_REFERENCE_PREFIX )\n\t) {\n\t\tconst variable = styleValue\n\t\t\t.slice( VARIABLE_REFERENCE_PREFIX.length )\n\t\t\t.split( VARIABLE_PATH_SEPARATOR_TOKEN_ATTRIBUTE )\n\t\t\t.map( ( presetVariable ) =>\n\t\t\t\tkebabCase( presetVariable, {\n\t\t\t\t\tsplitRegexp: [\n\t\t\t\t\t\t/([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t\t\t\t/([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t\t\t\t],\n\t\t\t\t} )\n\t\t\t)\n\t\t\t.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );\n\t\treturn `var(--wp--${ variable })` as StyleValue;\n\t}\n\treturn styleValue;\n}\n\n/**\n * Capitalizes the first letter in a string.\n *\n * @param string The string whose first letter the function will capitalize.\n *\n * @return String with the first letter capitalized.\n */\nexport function upperFirst( string: string ): string {\n\tconst [ firstLetter, ...rest ] = string;\n\treturn firstLetter.toUpperCase() + rest.join( '' );\n}\n\n/**\n * Converts an array of strings into a camelCase string.\n *\n * @param strings The strings to join into a camelCase string.\n *\n * @return camelCase string.\n */\nexport function camelCaseJoin( strings: string[] ): string {\n\tconst [ firstItem, ...rest ] = strings;\n\treturn firstItem.toLowerCase() + rest.map( upperFirst ).join( '' );\n}\n\n/**\n * Safely decodes a URI with `decodeURI`. Returns the URI unmodified if\n * `decodeURI` throws an error.\n *\n * @param {string} uri URI to decode.\n *\n * @example\n * ```js\n * const badUri = safeDecodeURI( '%z' ); // does not throw an Error, simply returns '%z'\n * ```\n *\n * @return {string} Decoded URI if possible.\n */\nexport function safeDecodeURI( uri: string ): string {\n\ttry {\n\t\treturn decodeURI( uri );\n\t} catch ( uriError ) {\n\t\treturn uri;\n\t}\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/style-engine/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\ntype BoxVariant = 'margin' | 'padding';\nexport interface Box< T extends BoxVariant | undefined = undefined > {\n\ttop?: CSSProperties[ T extends undefined ? 'top' : `${ T }Top` ];\n\tright?: CSSProperties[ T extends undefined ? 'right' : `${ T }Right` ];\n\tbottom?: CSSProperties[ T extends undefined ? 'bottom' : `${ T }Bottom` ];\n\tleft?: CSSProperties[ T extends undefined ? 'left' : `${ T }Left` ];\n}\n\nexport type BoxEdge = 'top' | 'right' | 'bottom' | 'left';\n\n// `T` is one of the values in `BorderIndividualProperty`. The expected CSSProperties key is something like `borderTopColor`.\nexport interface BorderIndividualStyles< T extends BoxEdge > {\n\tcolor?: CSSProperties[ `border${ Capitalize< T > }Color` ];\n\tstyle?: CSSProperties[ `border${ Capitalize< T > }Style` ];\n\twidth?: CSSProperties[ `border${ Capitalize< T > }Width` ];\n}\n\nexport interface Style {\n\tbackground?: {\n\t\tbackgroundImage?:\n\t\t\t| { url?: CSSProperties[ 'backgroundImage' ]; source?: string }\n\t\t\t| CSSProperties[ 'backgroundImage' ];\n\t\tbackgroundPosition?: CSSProperties[ 'backgroundPosition' ];\n\t\tbackgroundRepeat?: CSSProperties[ 'backgroundRepeat' ];\n\t\tbackgroundSize?: CSSProperties[ 'backgroundSize' ];\n\t};\n\tborder?: {\n\t\tcolor?: CSSProperties[ 'borderColor' ];\n\t\tradius?:\n\t\t\t| CSSProperties[ 'borderRadius' ]\n\t\t\t| {\n\t\t\t\t\ttopLeft?: CSSProperties[ 'borderTopLeftRadius' ];\n\t\t\t\t\ttopRight?: CSSProperties[ 'borderTopRightRadius' ];\n\t\t\t\t\tbottomLeft?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t\t\tbottomRight?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t  };\n\t\tstyle?: CSSProperties[ 'borderStyle' ];\n\t\twidth?: CSSProperties[ 'borderWidth' ];\n\t\ttop?: BorderIndividualStyles< 'top' >;\n\t\tright?: BorderIndividualStyles< 'right' >;\n\t\tbottom?: BorderIndividualStyles< 'bottom' >;\n\t\tleft?: BorderIndividualStyles< 'left' >;\n\t};\n\tdimensions?: {\n\t\taspectRatio?: CSSProperties[ 'aspectRatio' ];\n\t\tminHeight?: CSSProperties[ 'minHeight' ];\n\t};\n\tspacing?: {\n\t\tmargin?: CSSProperties[ 'margin' ] | Box< 'margin' >;\n\t\tpadding?: CSSProperties[ 'padding' ] | Box< 'padding' >;\n\t};\n\ttypography?: {\n\t\tfontSize?: CSSProperties[ 'fontSize' ];\n\t\tfontFamily?: CSSProperties[ 'fontFamily' ];\n\t\tfontWeight?: CSSProperties[ 'fontWeight' ];\n\t\tfontStyle?: CSSProperties[ 'fontStyle' ];\n\t\tletterSpacing?: CSSProperties[ 'letterSpacing' ];\n\t\tlineHeight?: CSSProperties[ 'lineHeight' ];\n\t\ttextColumns?: CSSProperties[ 'columnCount' ];\n\t\ttextDecoration?: CSSProperties[ 'textDecoration' ];\n\t\ttextTransform?: CSSProperties[ 'textTransform' ];\n\t\twritingMode?: CSSProperties[ 'writingMode' ];\n\t};\n\tcolor?: {\n\t\ttext?: CSSProperties[ 'color' ];\n\t\tbackground?: CSSProperties[ 'backgroundColor' ];\n\t\tgradient?: CSSProperties[ 'background' ];\n\t};\n\telements?: {\n\t\tlink?: {\n\t\t\tcolor?: {\n\t\t\t\ttext?: CSSProperties[ 'color' ];\n\t\t\t};\n\t\t};\n\t};\n}\n\nexport interface CssRulesKeys {\n\tdefault: string;\n\tindividual: string;\n}\n\nexport interface StyleOptions {\n\t/**\n\t * CSS selector for the generated style.\n\t */\n\tselector?: string;\n}\n\nexport interface GeneratedCSSRule {\n\tselector?: string;\n\tvalue: string;\n\t/**\n\t * The CSS key in JS style attribute format, compatible with React.\n\t * E.g. `paddingTop` instead of `padding-top`.\n\t */\n\tkey: string;\n}\n\nexport interface GenerateFunction {\n\t( style: Style, options: StyleOptions ): GeneratedCSSRule[];\n}\n\nexport interface StyleDefinition {\n\tname: string;\n\tgenerate?: GenerateFunction;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/style-engine/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\ntype BoxVariant = 'margin' | 'padding';\nexport interface Box< T extends BoxVariant | undefined = undefined > {\n\ttop?: CSSProperties[ T extends undefined ? 'top' : `${ T }Top` ];\n\tright?: CSSProperties[ T extends undefined ? 'right' : `${ T }Right` ];\n\tbottom?: CSSProperties[ T extends undefined ? 'bottom' : `${ T }Bottom` ];\n\tleft?: CSSProperties[ T extends undefined ? 'left' : `${ T }Left` ];\n}\n\nexport type BoxEdge = 'top' | 'right' | 'bottom' | 'left';\n\n// `T` is one of the values in `BorderIndividualProperty`. The expected CSSProperties key is something like `borderTopColor`.\nexport interface BorderIndividualStyles< T extends BoxEdge > {\n\tcolor?: CSSProperties[ `border${ Capitalize< T > }Color` ];\n\tstyle?: CSSProperties[ `border${ Capitalize< T > }Style` ];\n\twidth?: CSSProperties[ `border${ Capitalize< T > }Width` ];\n}\n\nexport interface Style {\n\tbackground?: {\n\t\tbackgroundImage?:\n\t\t\t| { url?: CSSProperties[ 'backgroundImage' ]; source?: string }\n\t\t\t| CSSProperties[ 'backgroundImage' ];\n\t\tbackgroundPosition?: CSSProperties[ 'backgroundPosition' ];\n\t\tbackgroundRepeat?: CSSProperties[ 'backgroundRepeat' ];\n\t\tbackgroundSize?: CSSProperties[ 'backgroundSize' ];\n\t};\n\tborder?: {\n\t\tcolor?: CSSProperties[ 'borderColor' ];\n\t\tradius?:\n\t\t\t| CSSProperties[ 'borderRadius' ]\n\t\t\t| {\n\t\t\t\t\ttopLeft?: CSSProperties[ 'borderTopLeftRadius' ];\n\t\t\t\t\ttopRight?: CSSProperties[ 'borderTopRightRadius' ];\n\t\t\t\t\tbottomLeft?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t\t\tbottomRight?: CSSProperties[ 'borderBottomLeftRadius' ];\n\t\t\t  };\n\t\tstyle?: CSSProperties[ 'borderStyle' ];\n\t\twidth?: CSSProperties[ 'borderWidth' ];\n\t\ttop?: BorderIndividualStyles< 'top' >;\n\t\tright?: BorderIndividualStyles< 'right' >;\n\t\tbottom?: BorderIndividualStyles< 'bottom' >;\n\t\tleft?: BorderIndividualStyles< 'left' >;\n\t};\n\tdimensions?: {\n\t\taspectRatio?: CSSProperties[ 'aspectRatio' ];\n\t\tminHeight?: CSSProperties[ 'minHeight' ];\n\t};\n\tspacing?: {\n\t\tmargin?: CSSProperties[ 'margin' ] | Box< 'margin' >;\n\t\tpadding?: CSSProperties[ 'padding' ] | Box< 'padding' >;\n\t};\n\ttypography?: {\n\t\tfontSize?: CSSProperties[ 'fontSize' ];\n\t\tfontFamily?: CSSProperties[ 'fontFamily' ];\n\t\tfontWeight?: CSSProperties[ 'fontWeight' ];\n\t\tfontStyle?: CSSProperties[ 'fontStyle' ];\n\t\tletterSpacing?: CSSProperties[ 'letterSpacing' ];\n\t\tlineHeight?: CSSProperties[ 'lineHeight' ];\n\t\ttextColumns?: CSSProperties[ 'columnCount' ];\n\t\ttextDecoration?: CSSProperties[ 'textDecoration' ];\n\t\ttextTransform?: CSSProperties[ 'textTransform' ];\n\t\twritingMode?: CSSProperties[ 'writingMode' ];\n\t};\n\tcolor?: {\n\t\ttext?: CSSProperties[ 'color' ];\n\t\tbackground?: CSSProperties[ 'backgroundColor' ];\n\t\tgradient?: CSSProperties[ 'background' ];\n\t};\n\telements?: {\n\t\tlink?: {\n\t\t\tcolor?: {\n\t\t\t\ttext?: CSSProperties[ 'color' ];\n\t\t\t};\n\t\t};\n\t};\n}\n\nexport interface CssRulesKeys {\n\tdefault: string;\n\tindividual: string;\n}\n\nexport interface StyleOptions {\n\t/**\n\t * CSS selector for the generated style.\n\t */\n\tselector?: string;\n}\n\nexport interface GeneratedCSSRule {\n\tselector?: string;\n\tvalue: string | unknown;\n\t/**\n\t * The CSS key in JS style attribute format, compatible with React.\n\t * E.g. `paddingTop` instead of `padding-top`.\n\t */\n\tkey: string;\n}\n\nexport interface GenerateFunction {\n\t( style: Style, options: StyleOptions ): GeneratedCSSRule[];\n}\n\nexport interface StyleDefinition {\n\tname: string;\n\tgenerate?: GenerateFunction;\n}\n"],"mappings":"","ignoreList":[]}

package/build-types/index.d.ts

@@ -24,4 +24,5 @@ export declare function compileCSS(style: Style, options?: StyleOptions): string
  * @return A collection of objects containing the selector, if any, the CSS property key (camelcase) and parsed CSS value.
  */
 export declare function getCSSRules(style: Style, options?: StyleOptions): GeneratedCSSRule[];
+export { getCSSValueFromRawStyle } from './styles/utils';
 //# sourceMappingURL=index.d.ts.map

package/build-types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EACX,KAAK,EACL,YAAY,EACZ,gBAAgB,EAEhB,MAAM,SAAS,CAAC;AAGjB;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAE,KAAK,EAAE,KAAK,EAAE,OAAO,GAAE,YAAiB,GAAI,MAAM,CA0C7E;AAED;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAC1B,KAAK,EAAE,KAAK,EACZ,OAAO,GAAE,YAAiB,GACxB,gBAAgB,EAAE,CASpB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EACX,KAAK,EACL,YAAY,EACZ,gBAAgB,EAEhB,MAAM,SAAS,CAAC;AAGjB;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAE,KAAK,EAAE,KAAK,EAAE,OAAO,GAAE,YAAiB,GAAI,MAAM,CA0C7E;AAED;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAC1B,KAAK,EAAE,KAAK,EACZ,OAAO,GAAE,YAAiB,GACxB,gBAAgB,EAAE,CASpB;AAGD,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC"}

package/build-types/styles/background/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/styles/background/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;;;sBAKnC,KAAK,WAAW,YAAY;;AAgFhD,wBAME"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/styles/background/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;;;sBAKnC,KAAK,WAAW,YAAY;;AA8EhD,wBAME"}

package/build-types/styles/utils.d.ts

@@ -35,13 +35,20 @@ export declare function generateRule(style: Style, options: StyleOptions, path:
  */
 export declare function generateBoxRules(style: Style, options: StyleOptions, path: string[], ruleKeys: CssRulesKeys, individualProperties?: string[]): GeneratedCSSRule[];
 /**
- * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.
+ * Returns a WordPress CSS custom var value from incoming style preset value,
+ * if one is detected.
  *
- * @param styleValue A raw style value.
+ * The preset value is a string and follows the pattern `var:description|context|slug`.
  *
- * @return string A CSS var value.
+ * Example:
+ *
+ * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'
+ *
+ * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.
+ *
+ * @return A CSS custom var value if the incoming style value is a preset value.
  */
-export declare function getCSSVarFromStyleValue(styleValue: string): string;
+export declare function getCSSValueFromRawStyle<StyleValue = string>(styleValue: StyleValue): StyleValue;
 /**
  * Capitalizes the first letter in a string.
  *

package/build-types/styles/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/styles/utils.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EACX,YAAY,EACZ,gBAAgB,EAChB,KAAK,EAEL,YAAY,EACZ,MAAM,UAAU,CAAC;AAOlB;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,WACvB,MAAM,CAAE,GAAG,EAAE,GAAG,CAAE,QACpB,MAAM,EAAE,QAOd,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,YAAY,EACrB,IAAI,EAAE,MAAM,EAAE,EACd,OAAO,EAAE,MAAM,GACb,gBAAgB,EAAE,CAYpB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,YAAY,EACrB,IAAI,EAAE,MAAM,EAAE,EACd,QAAQ,EAAE,YAAY,EACtB,oBAAoB,GAAE,MAAM,EAAyC,GACnE,gBAAgB,EAAE,CAwCpB;AAED;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CAAE,UAAU,EAAE,MAAM,GAAI,MAAM,CAsBpE;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAGnD;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAE,OAAO,EAAE,MAAM,EAAE,GAAI,MAAM,CAGzD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAE,GAAG,EAAE,MAAM,GAAI,MAAM,CAMnD"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/styles/utils.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EACX,YAAY,EACZ,gBAAgB,EAChB,KAAK,EAEL,YAAY,EACZ,MAAM,UAAU,CAAC;AAOlB;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,WACvB,MAAM,CAAE,GAAG,EAAE,GAAG,CAAE,QACpB,MAAM,EAAE,QAOd,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,YAAY,EACrB,IAAI,EAAE,MAAM,EAAE,EACd,OAAO,EAAE,MAAM,GACb,gBAAgB,EAAE,CAYpB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,YAAY,EACrB,IAAI,EAAE,MAAM,EAAE,EACd,QAAQ,EAAE,YAAY,EACtB,oBAAoB,GAAE,MAAM,EAAyC,GACnE,gBAAgB,EAAE,CAwCpB;AAED;;;;;;;;;;;;;GAaG;AAEH,wBAAgB,uBAAuB,CAAE,UAAU,GAAG,MAAM,EAC3D,UAAU,EAAE,UAAU,GACpB,UAAU,CAsBZ;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,GAAI,MAAM,CAGnD;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAE,OAAO,EAAE,MAAM,EAAE,GAAI,MAAM,CAGzD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAE,GAAG,EAAE,MAAM,GAAI,MAAM,CAMnD"}

package/build-types/types.d.ts

@@ -85,7 +85,7 @@ export interface StyleOptions {
 }
 export interface GeneratedCSSRule {
     selector?: string;
-    value: string;
+    value: string | unknown;
     /**
      * The CSS key in JS style attribute format, compatible with React.
      * E.g. `paddingTop` instead of `padding-top`.

package/build-types/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,KAAK,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AACvC,MAAM,WAAW,GAAG,CAAE,CAAC,SAAS,UAAU,GAAG,SAAS,GAAG,SAAS;IACjE,GAAG,CAAC,EAAE,aAAa,CAAE,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,GAAI,CAAE,KAAK,CAAE,CAAC;IACjE,KAAK,CAAC,EAAE,aAAa,CAAE,CAAC,SAAS,SAAS,GAAG,OAAO,GAAG,GAAI,CAAE,OAAO,CAAE,CAAC;IACvE,MAAM,CAAC,EAAE,aAAa,CAAE,CAAC,SAAS,SAAS,GAAG,QAAQ,GAAG,GAAI,CAAE,QAAQ,CAAE,CAAC;IAC1E,IAAI,CAAC,EAAE,aAAa,CAAE,CAAC,SAAS,SAAS,GAAG,MAAM,GAAG,GAAI,CAAE,MAAM,CAAE,CAAC;CACpE;AAED,MAAM,MAAM,OAAO,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAG1D,MAAM,WAAW,sBAAsB,CAAE,CAAC,SAAS,OAAO;IACzD,KAAK,CAAC,EAAE,aAAa,CAAE,SAAU,UAAU,CAAE,CAAC,CAAG,OAAO,CAAE,CAAC;IAC3D,KAAK,CAAC,EAAE,aAAa,CAAE,SAAU,UAAU,CAAE,CAAC,CAAG,OAAO,CAAE,CAAC;IAC3D,KAAK,CAAC,EAAE,aAAa,CAAE,SAAU,UAAU,CAAE,CAAC,CAAG,OAAO,CAAE,CAAC;CAC3D;AAED,MAAM,WAAW,KAAK;IACrB,UAAU,CAAC,EAAE;QACZ,eAAe,CAAC,EACb;YAAE,GAAG,CAAC,EAAE,aAAa,CAAE,iBAAiB,CAAE,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,CAAA;SAAE,GAC7D,aAAa,CAAE,iBAAiB,CAAE,CAAC;QACtC,kBAAkB,CAAC,EAAE,aAAa,CAAE,oBAAoB,CAAE,CAAC;QAC3D,gBAAgB,CAAC,EAAE,aAAa,CAAE,kBAAkB,CAAE,CAAC;QACvD,cAAc,CAAC,EAAE,aAAa,CAAE,gBAAgB,CAAE,CAAC;KACnD,CAAC;IACF,MAAM,CAAC,EAAE;QACR,KAAK,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;QACvC,MAAM,CAAC,EACJ,aAAa,CAAE,cAAc,CAAE,GAC/B;YACA,OAAO,CAAC,EAAE,aAAa,CAAE,qBAAqB,CAAE,CAAC;YACjD,QAAQ,CAAC,EAAE,aAAa,CAAE,sBAAsB,CAAE,CAAC;YACnD,UAAU,CAAC,EAAE,aAAa,CAAE,wBAAwB,CAAE,CAAC;YACvD,WAAW,CAAC,EAAE,aAAa,CAAE,wBAAwB,CAAE,CAAC;SACvD,CAAC;QACL,KAAK,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;QACvC,KAAK,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;QACvC,GAAG,CAAC,EAAE,sBAAsB,CAAE,KAAK,CAAE,CAAC;QACtC,KAAK,CAAC,EAAE,sBAAsB,CAAE,OAAO,CAAE,CAAC;QAC1C,MAAM,CAAC,EAAE,sBAAsB,CAAE,QAAQ,CAAE,CAAC;QAC5C,IAAI,CAAC,EAAE,sBAAsB,CAAE,MAAM,CAAE,CAAC;KACxC,CAAC;IACF,UAAU,CAAC,EAAE;QACZ,WAAW,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;QAC7C,SAAS,CAAC,EAAE,aAAa,CAAE,WAAW,CAAE,CAAC;KACzC,CAAC;IACF,OAAO,CAAC,EAAE;QACT,MAAM,CAAC,EAAE,aAAa,CAAE,QAAQ,CAAE,GAAG,GAAG,CAAE,QAAQ,CAAE,CAAC;QACrD,OAAO,CAAC,EAAE,aAAa,CAAE,SAAS,CAAE,GAAG,GAAG,CAAE,SAAS,CAAE,CAAC;KACxD,CAAC;IACF,UAAU,CAAC,EAAE;QACZ,QAAQ,CAAC,EAAE,aAAa,CAAE,UAAU,CAAE,CAAC;QACvC,UAAU,CAAC,EAAE,aAAa,CAAE,YAAY,CAAE,CAAC;QAC3C,UAAU,CAAC,EAAE,aAAa,CAAE,YAAY,CAAE,CAAC;QAC3C,SAAS,CAAC,EAAE,aAAa,CAAE,WAAW,CAAE,CAAC;QACzC,aAAa,CAAC,EAAE,aAAa,CAAE,eAAe,CAAE,CAAC;QACjD,UAAU,CAAC,EAAE,aAAa,CAAE,YAAY,CAAE,CAAC;QAC3C,WAAW,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;QAC7C,cAAc,CAAC,EAAE,aAAa,CAAE,gBAAgB,CAAE,CAAC;QACnD,aAAa,CAAC,EAAE,aAAa,CAAE,eAAe,CAAE,CAAC;QACjD,WAAW,CAAC,EAAE,aAAa,CAAE,aAAa,CAAE,CAAC;KAC7C,CAAC;IACF,KAAK,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,aAAa,CAAE,OAAO,CAAE,CAAC;QAChC,UAAU,CAAC,EAAE,aAAa,CAAE,iBAAiB,CAAE,CAAC;QAChD,QAAQ,CAAC,EAAE,aAAa,CAAE,YAAY,CAAE,CAAC;KACzC,CAAC;IACF,QAAQ,CAAC,EAAE;QACV,IAAI,CAAC,EAAE;YACN,KAAK,CAAC,EAAE;gBACP,IAAI,CAAC,EAAE,aAAa,CAAE,OAAO,CAAE,CAAC;aAChC,CAAC;SACF,CAAC;KACF,CAAC;CACF;AAED,MAAM,WAAW,YAAY;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAY;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,gBAAgB;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,GAAG,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,gBAAgB;IAChC,CAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,GAAI,gBAAgB,EAAE,CAAC;CAC5D;AAED,MAAM,WAAW,eAAe;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC5B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/style-engine",
-	"version": "2.4.0",
+	"version": "2.6.0",
 	"description": "A suite of parsers and compilers for WordPress styles.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -36,5 +36,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "363edb39b8dda8727f652e42cbb8497732693ed2"
+	"gitHead": "ab9564947967bb3f00343130954b9efacba6cdd7"
 }

package/src/index.ts

@@ -91,3 +91,6 @@ export function getCSSRules(
 
 	return rules;
 }
+
+// Export style utils.
+export { getCSSValueFromRawStyle } from './styles/utils';

package/src/styles/background/index.ts

@@ -8,6 +8,12 @@ const backgroundImage = {
 	name: 'backgroundImage',
 	generate: ( style: Style, options: StyleOptions ) => {
 		const _backgroundImage = style?.background?.backgroundImage;
+
+		/*
+		 * The background image can be a string or an object.
+		 * If the background image is a string, it could already contain a url() function,
+		 * or have a linear-gradient value.
+		 */
 		if ( typeof _backgroundImage === 'object' && _backgroundImage?.url ) {
 			return [
 				{
@@ -21,20 +27,12 @@ const backgroundImage = {
 			];
 		}
 
-		/*
-		 * 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'
-			);
-		}
-
-		return [];
+		return generateRule(
+			style,
+			options,
+			[ 'background', 'backgroundImage' ],
+			'backgroundImage'
+		);
 	},
 };
 

package/src/styles/test/utils.js

@@ -0,0 +1,54 @@
+/**
+ * Internal dependencies
+ */
+import { camelCaseJoin, getCSSValueFromRawStyle, upperFirst } from '../utils';
+
+describe( 'utils', () => {
+	describe( 'upperFirst()', () => {
+		it( 'should return an string with a capitalized first letter', () => {
+			expect( upperFirst( 'toontown' ) ).toEqual( 'Toontown' );
+		} );
+	} );
+
+	describe( 'camelCaseJoin()', () => {
+		it( 'should return a camelCase string', () => {
+			expect( camelCaseJoin( [ 'toon', 'town' ] ) ).toEqual( 'toonTown' );
+		} );
+	} );
+
+	describe( 'getCSSValueFromRawStyle()', () => {
+		it.each( [
+			[ 'min(40%, 400px)', 'min(40%, 400px)' ],
+			[
+				'var(--wp--preset--color--yellow-bun)',
+				'var:preset|color|yellow-bun',
+			],
+			[ 'var(--wp--preset--font-size--h-1)', 'var:preset|font-size|h1' ],
+			[
+				'var(--wp--preset--font-size--1-px)',
+				'var:preset|font-size|1px',
+			],
+			[
+				'var(--wp--preset--color--orange-11-orange)',
+				'var:preset|color|orange11orange',
+			],
+			[
+				'var(--wp--preset--color--heavenly-blue)',
+				'var:preset|color|heavenlyBlue',
+			],
+			[
+				'var(--wp--preset--background--dark-secrets-100)',
+				'var:preset|background|dark_Secrets_100',
+			],
+			[ null, null ],
+			[ false, false ],
+			[ 1000, 1000 ],
+			[ undefined, undefined ],
+		] )(
+			'should return %s using an incoming value of %s',
+			( expected, value ) => {
+				expect( getCSSValueFromRawStyle( value ) ).toEqual( expected );
+			}
+		);
+	} );
+} );

package/src/styles/utils.ts

@@ -61,7 +61,7 @@ export function generateRule(
 				{
 					selector: options?.selector,
 					key: ruleKey,
-					value: getCSSVarFromStyleValue( styleValue ),
+					value: getCSSValueFromRawStyle( styleValue ),
 				},
 		  ]
 		: [];
@@ -103,7 +103,7 @@ export function generateBoxRules(
 	} else {
 		const sideRules = individualProperties.reduce(
 			( acc: GeneratedCSSRule[], side: string ) => {
-				const value: string | undefined = getCSSVarFromStyleValue(
+				const value = getCSSValueFromRawStyle(
 					getStyleValueByPath( boxStyle, [ side ] )
 				);
 				if ( value ) {
@@ -127,13 +127,23 @@ export function generateBoxRules(
 }
 
 /**
- * Returns a CSS var value from incoming style value following the pattern `var:description|context|slug`.
+ * Returns a WordPress CSS custom var value from incoming style preset value,
+ * if one is detected.
  *
- * @param styleValue A raw style value.
+ * The preset value is a string and follows the pattern `var:description|context|slug`.
  *
- * @return string A CSS var value.
+ * Example:
+ *
+ * `getCSSValueFromRawStyle( 'var:preset|color|heavenlyBlue' )` // returns 'var(--wp--preset--color--heavenly-blue)'
+ *
+ * @param styleValue A string representing a raw CSS value. Non-strings won't be processed.
+ *
+ * @return A CSS custom var value if the incoming style value is a preset value.
  */
-export function getCSSVarFromStyleValue( styleValue: string ): string {
+
+export function getCSSValueFromRawStyle< StyleValue = string >(
+	styleValue: StyleValue
+): StyleValue {
 	if (
 		typeof styleValue === 'string' &&
 		styleValue.startsWith( VARIABLE_REFERENCE_PREFIX )
@@ -152,7 +162,7 @@ export function getCSSVarFromStyleValue( styleValue: string ): string {
 				} )
 			)
 			.join( VARIABLE_PATH_SEPARATOR_TOKEN_STYLE );
-		return `var(--wp--${ variable })`;
+		return `var(--wp--${ variable })` as StyleValue;
 	}
 	return styleValue;
 }

package/src/types.ts

@@ -94,7 +94,7 @@ export interface StyleOptions {
 
 export interface GeneratedCSSRule {
 	selector?: string;
-	value: string;
+	value: string | unknown;
 	/**
 	 * The CSS key in JS style attribute format, compatible with React.
 	 * E.g. `paddingTop` instead of `padding-top`.

package/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"program":{"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.es2019.d.ts","../../node_modules/typescript/lib/lib.es2020.d.ts","../../node_modules/typescript/lib/lib.es2021.d.ts","../../node_modules/typescript/lib/lib.es2022.d.ts","../../node_modules/typescript/lib/lib.es2023.d.ts","../../node_modules/typescript/lib/lib.esnext.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.dom.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2019.array.d.ts","../../node_modules/typescript/lib/lib.es2019.object.d.ts","../../node_modules/typescript/lib/lib.es2019.string.d.ts","../../node_modules/typescript/lib/lib.es2019.symbol.d.ts","../../node_modules/typescript/lib/lib.es2019.intl.d.ts","../../node_modules/typescript/lib/lib.es2020.bigint.d.ts","../../node_modules/typescript/lib/lib.es2020.date.d.ts","../../node_modules/typescript/lib/lib.es2020.promise.d.ts","../../node_modules/typescript/lib/lib.es2020.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2020.string.d.ts","../../node_modules/typescript/lib/lib.es2020.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2020.intl.d.ts","../../node_modules/typescript/lib/lib.es2020.number.d.ts","../../node_modules/typescript/lib/lib.es2021.promise.d.ts","../../node_modules/typescript/lib/lib.es2021.string.d.ts","../../node_modules/typescript/lib/lib.es2021.weakref.d.ts","../../node_modules/typescript/lib/lib.es2021.intl.d.ts","../../node_modules/typescript/lib/lib.es2022.array.d.ts","../../node_modules/typescript/lib/lib.es2022.error.d.ts","../../node_modules/typescript/lib/lib.es2022.intl.d.ts","../../node_modules/typescript/lib/lib.es2022.object.d.ts","../../node_modules/typescript/lib/lib.es2022.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2022.string.d.ts","../../node_modules/typescript/lib/lib.es2022.regexp.d.ts","../../node_modules/typescript/lib/lib.es2023.array.d.ts","../../node_modules/typescript/lib/lib.es2023.collection.d.ts","../../node_modules/typescript/lib/lib.es2023.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.array.d.ts","../../node_modules/typescript/lib/lib.esnext.collection.d.ts","../../node_modules/typescript/lib/lib.esnext.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.disposable.d.ts","../../node_modules/typescript/lib/lib.esnext.string.d.ts","../../node_modules/typescript/lib/lib.esnext.promise.d.ts","../../node_modules/typescript/lib/lib.esnext.decorators.d.ts","../../node_modules/typescript/lib/lib.esnext.object.d.ts","../../node_modules/typescript/lib/lib.esnext.regexp.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../node_modules/no-case/dist/index.d.ts","../../node_modules/pascal-case/dist/index.d.ts","../../node_modules/camel-case/dist/index.d.ts","../../node_modules/capital-case/dist/index.d.ts","../../node_modules/constant-case/dist/index.d.ts","../../node_modules/dot-case/dist/index.d.ts","../../node_modules/header-case/dist/index.d.ts","../../node_modules/param-case/dist/index.d.ts","../../node_modules/path-case/dist/index.d.ts","../../node_modules/sentence-case/dist/index.d.ts","../../node_modules/snake-case/dist/index.d.ts","../../node_modules/change-case/dist/index.d.ts","../../node_modules/@types/react/global.d.ts","../../node_modules/csstype/index.d.ts","../../node_modules/@types/prop-types/index.d.ts","../../node_modules/@types/react/index.d.ts","./src/types.ts","./src/styles/constants.ts","./src/styles/utils.ts","./src/styles/border/index.ts","./src/styles/color/background.ts","./src/styles/color/gradient.ts","./src/styles/color/text.ts","./src/styles/color/index.ts","./src/styles/dimensions/index.ts","./src/styles/background/index.ts","./src/styles/shadow/index.ts","./src/styles/outline/index.ts","./src/styles/spacing/padding.ts","./src/styles/spacing/margin.ts","./src/styles/spacing/index.ts","./src/styles/typography/index.ts","./src/styles/index.ts","./src/index.ts"],"fileInfos":[{"version":"44e584d4f6444f58791784f1d530875970993129442a847597db702a073ca68c","affectsGlobalScope":true},"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","3facaf05f0c5fc569c5649dd359892c98a85557e3e0c847964caeb67076f4d75","9a68c0c07ae2fa71b44384a839b7b8d81662a236d4b9ac30916718f7510b1b2d","5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","68d73b4a11549f9c0b7d352d10e91e5dca8faa3322bfb77b661839c42b1ddec7","5efce4fc3c29ea84e8928f97adec086e3dc876365e0982cc8479a07954a3efd4","feecb1be483ed332fad555aff858affd90a48ab19ba7272ee084704eb7167569","5514e54f17d6d74ecefedc73c504eadffdeda79c7ea205cf9febead32d45c4bc","27bdc30a0e32783366a5abeda841bc22757c1797de8681bbe81fbc735eeb1c10","17edc026abf73c5c2dd508652d63f68ec4efd9d4856e3469890d27598209feb5",{"version":"4af6b0c727b7a2896463d512fafd23634229adf69ac7c00e2ae15a09cb084fad","affectsGlobalScope":true},{"version":"9c00a480825408b6a24c63c1b71362232927247595d7c97659bc24dc68ae0757","affectsGlobalScope":true},{"version":"6920e1448680767498a0b77c6a00a8e77d14d62c3da8967b171f1ddffa3c18e4","affectsGlobalScope":true},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true},{"version":"4443e68b35f3332f753eacc66a04ac1d2053b8b035a0e0ac1d455392b5e243b3","affectsGlobalScope":true},{"version":"bc47685641087c015972a3f072480889f0d6c65515f12bd85222f49a98952ed7","affectsGlobalScope":true},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true},{"version":"93495ff27b8746f55d19fcbcdbaccc99fd95f19d057aed1bd2c0cafe1335fbf0","affectsGlobalScope":true},{"version":"6fc23bb8c3965964be8c597310a2878b53a0306edb71d4b5a4dfe760186bcc01","affectsGlobalScope":true},{"version":"ea011c76963fb15ef1cdd7ce6a6808b46322c527de2077b6cfdf23ae6f5f9ec7","affectsGlobalScope":true},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true},{"version":"bb42a7797d996412ecdc5b2787720de477103a0b2e53058569069a0e2bae6c7e","affectsGlobalScope":true},{"version":"4738f2420687fd85629c9efb470793bb753709c2379e5f85bc1815d875ceadcd","affectsGlobalScope":true},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true},{"version":"9fc46429fbe091ac5ad2608c657201eb68b6f1b8341bd6d670047d32ed0a88fa","affectsGlobalScope":true},{"version":"61c37c1de663cf4171e1192466e52c7a382afa58da01b1dc75058f032ddf0839","affectsGlobalScope":true},{"version":"b541a838a13f9234aba650a825393ffc2292dc0fc87681a5d81ef0c96d281e7a","affectsGlobalScope":true},{"version":"9e9fbd7030c440b33d021da145d3232984c8bb7916f277e8ffd3dc2e3eae2bdb","affectsGlobalScope":true},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true},{"version":"d7e7d9b7b50e5f22c915b525acc5a49a7a6584cf8f62d0569e557c5cfc4b2ac2","affectsGlobalScope":true},{"version":"71c37f4c9543f31dfced6c7840e068c5a5aacb7b89111a4364b1d5276b852557","affectsGlobalScope":true},{"version":"576711e016cf4f1804676043e6a0a5414252560eb57de9faceee34d79798c850","affectsGlobalScope":true},{"version":"89c1b1281ba7b8a96efc676b11b264de7a8374c5ea1e6617f11880a13fc56dc6","affectsGlobalScope":true},{"version":"74f7fa2d027d5b33eb0471c8e82a6c87216223181ec31247c357a3e8e2fddc5b","affectsGlobalScope":true},{"version":"ae37d6ccd1560b0203ab88d46987393adaaa78c919e51acf32fb82c86502e98c","affectsGlobalScope":true},{"version":"063600664504610fe3e99b717a1223f8b1900087fab0b4cad1496a114744f8df","affectsGlobalScope":true},{"version":"934019d7e3c81950f9a8426d093458b65d5aff2c7c1511233c0fd5b941e608ab","affectsGlobalScope":true},{"version":"bf14a426dbbf1022d11bd08d6b8e709a2e9d246f0c6c1032f3b2edb9a902adbe","affectsGlobalScope":true},{"version":"5e07ed3809d48205d5b985642a59f2eba47c402374a7cf8006b686f79efadcbd","affectsGlobalScope":true},{"version":"2b72d528b2e2fe3c57889ca7baef5e13a56c957b946906d03767c642f386bbc3","affectsGlobalScope":true},{"version":"479553e3779be7d4f68e9f40cdb82d038e5ef7592010100410723ceced22a0f7","affectsGlobalScope":true},{"version":"368af93f74c9c932edd84c58883e736c9e3d53cec1fe24c0b0ff451f529ceab1","affectsGlobalScope":true},{"version":"af3dd424cf267428f30ccfc376f47a2c0114546b55c44d8c0f1d57d841e28d74","affectsGlobalScope":true},{"version":"995c005ab91a498455ea8dfb63aa9f83fa2ea793c3d8aa344be4a1678d06d399","affectsGlobalScope":true},{"version":"d3d7b04b45033f57351c8434f60b6be1ea71a2dfec2d0a0c3c83badbb0e3e693","affectsGlobalScope":true},{"version":"956d27abdea9652e8368ce029bb1e0b9174e9678a273529f426df4b3d90abd60","affectsGlobalScope":true},{"version":"4fa6ed14e98aa80b91f61b9805c653ee82af3502dc21c9da5268d3857772ca05","affectsGlobalScope":true},{"version":"e6633e05da3ff36e6da2ec170d0d03ccf33de50ca4dc6f5aeecb572cedd162fb","affectsGlobalScope":true},{"version":"d8670852241d4c6e03f2b89d67497a4bbefe29ecaa5a444e2c11a9b05e6fccc6","affectsGlobalScope":true},{"version":"8444af78980e3b20b49324f4a16ba35024fef3ee069a0eb67616ea6ca821c47a","affectsGlobalScope":true},{"version":"caccc56c72713969e1cfe5c3d44e5bab151544d9d2b373d7dbe5a1e4166652be","affectsGlobalScope":true},{"version":"3287d9d085fbd618c3971944b65b4be57859f5415f495b33a6adc994edd2f004","affectsGlobalScope":true},{"version":"b4b67b1a91182421f5df999988c690f14d813b9850b40acd06ed44691f6727ad","affectsGlobalScope":true},{"version":"08a58483392df5fcc1db57d782e87734f77ae9eab42516028acbfe46f29a3ef7","affectsGlobalScope":true},{"version":"436aaf437562f276ec2ddbee2f2cdedac7664c1e4c1d2c36839ddd582eeb3d0a","affectsGlobalScope":true},{"version":"8e3c06ea092138bf9fa5e874a1fdbc9d54805d074bee1de31b99a11e2fec239d","affectsGlobalScope":true},{"version":"0b11f3ca66aa33124202c80b70cd203219c3d4460cfc165e0707aa9ec710fc53","affectsGlobalScope":true},{"version":"6a3f5a0129cc80cf439ab71164334d649b47059a4f5afca90282362407d0c87f","affectsGlobalScope":true},{"version":"811c71eee4aa0ac5f7adf713323a5c41b0cf6c4e17367a34fbce379e12bbf0a4","affectsGlobalScope":true},{"version":"15b98a533864d324e5f57cd3cfc0579b231df58c1c0f6063ea0fcb13c3c74ff9","affectsGlobalScope":true},{"version":"0a6282c8827e4b9a95f4bf4f5c205673ada31b982f50572d27103df8ceb8013c","affectsGlobalScope":true},{"version":"ac77cb3e8c6d3565793eb90a8373ee8033146315a3dbead3bde8db5eaf5e5ec6","affectsGlobalScope":true},{"version":"d4b1d2c51d058fc21ec2629fff7a76249dec2e36e12960ea056e3ef89174080f","affectsGlobalScope":true},{"version":"2fef54945a13095fdb9b84f705f2b5994597640c46afeb2ce78352fab4cb3279","affectsGlobalScope":true},{"version":"56e4ed5aab5f5920980066a9409bfaf53e6d21d3f8d020c17e4de584d29600ad","affectsGlobalScope":true},{"version":"33358442698bb565130f52ba79bfd3d4d484ac85fe33f3cb1759c54d18201393","affectsGlobalScope":true},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true},"b4e123af1af6049685c93073a15868b50aebdad666d422edc72fa2b585fa8a37","f86c04a744ebcede96bac376f9a2c90f2bd3c422740d91dda4ca6233199d4977","6ae1bddee5c790439bd992abd063b9b46e0cadd676c2a8562268d1869213ff60","606244fc97a6a74b877f2e924ba7e55b233bc6acb57d7bf40ba84a5be2d9adb0","4a1cabac71036b8a14f5db1b753b579f0c901c7d7b9227e6872dadf6efb104e8","062959a1d825b96639d87be35fe497cbd3f89544bf06fdad577bbfb85fcf604c","4c3672dc8f4e4fdd3d18525b22b31f1b5481f5a415db96550d3ac5163a6c3dd3","f9a69ca445010b91fe08f08c06e0f86d79c0d776905f9bdb828477cb2a1eb7fc","ad7fd0e7ee457d4884b3aaecbcbd2a80b6803407c4ce2540c296170d4c7918ef","a50ef21605f41c6acad6c3ef0307e5311b94963c846ca093c764b80cdb5318d6","74b4035dd26d09a417c44ca23ab5ee69b173f8c2f6b2e47350ab0795cf2d4a17","918f86ee2b19cc38cb8b1a4cf8f223eb228aaa39df3604c42f700fac2f0b3ea1",{"version":"55461596dc873b866911ef4e640fae4c39da7ac1fbc7ef5e649cb2f2fb42c349","affectsGlobalScope":true},"4c68749a564a6facdf675416d75789ee5a557afda8960e0803cf6711fa569288","f7b46d22a307739c145e5fddf537818038fdfffd580d79ed717f4d4d37249380",{"version":"8ca4709dbd22a34bcc1ebf93e1877645bdb02ebd3f3d9a211a299a8db2ee4ba1","affectsGlobalScope":true},{"version":"5eda71b220b6d4e6ac0f6acacec8ab0dd80eab9064d7935af5c4c755fae7cf41","signature":"f1d007bd4931371005e5f1fba59952797157555b52420a36f85099eec59b65c1"},{"version":"301543eebfdd2fc5e5d6d928c5ed3f65bd377e95d184eb1351df5fe38ef9eac0","signature":"b6dbb3376b4265410d8aad2c234b41ac0a1f8d29e0ae0bf06c159c9f2ef13fc0"},{"version":"c3f0acdbfdc730cfafa6c7dec5bee986b9b2aa876641fd9f8b576c364e8e5940","signature":"774455d4fcae6aee2339b51f319ca5d0279ea7832fece5195875a9a3b94d2f35"},{"version":"6a47ab963c0de27ca91c40b8a8370d4c368f51bbcfeb70ca028fa3679afa56f9","signature":"65511c14946110a16693dd09273dfc0f8060d0ac6d0ad40cbcebdced0b251961"},{"version":"49dec6685c69b84a795d1e2c2a8d7ac8953efb4a7dadb9b1b04c836053e0ea21","signature":"9a4c1e89a7eeff330b95276972fee79058b121b261d1118ef7d5ef9cfc3bccdd"},{"version":"8cbcd8c85fe3627d4c9e75ccf2784b7e4d0082396600e9d432f1cd61009a7933","signature":"1bcecf449f856cced1aeb30fbb82a49e1037833139fd43bf1c1740ccc9ba0b6a"},{"version":"f303eb9a884f47802f08d6b1d376c737856c29783532a44116bfc7e4929a7204","signature":"629dbceb125f23c956f1f42fc11f9b37d42f49519267b4f8448a4e5c1214d142"},{"version":"e8dc9f16ad89ba54f1e7202369a69a265ccd5eec0df39cf429ff1a941603d4da","signature":"2439cec606f95353956bd2e48af0b238600ec807f6270db4fc22e6433bb59efd"},{"version":"becf1f4571b39ee129d55d8b3df006d11d72b3c8c880ebc4a49113a200b8812d","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"0424af0b8e7089a8fc3ff08348fa0b7d05c7db697ac71b5dc68a7c6e106645f0","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"51f25b3291c4ca38c72cb150453eb2961bb0ca2891102719064e2a695c47a55a","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"697ce73163b0e4ac9fe325a666e48b76b0754eff4b3fe7906369894a76cd860f","signature":"a69042401e8a750db9b3e8be7898ee61a6af5bacdc2abfa373b596923b68f170"},{"version":"caa45d96bc56c4f2ea6dfbe715413636f0d8b74121a8820b70526a3ae1bfd9b9","signature":"aaf7dd84606d5f76aa8219904020c11a858ce264dc846a4023faff5e3823e9b4"},{"version":"3d0705f37a3de49d9210d2656cd697ae0cd93476a7e60f7b099797166e4d78b0","signature":"76fc0038ad0327ca885df7e552ebbf68e65ec59cf5ecab10cbdcb48486367cb0"},{"version":"b7003bd91d5a0b8bf84a3ef07a0cf5a4b8e0cef58d9e6404f54f05fd4ed6f0b2","signature":"2439cec606f95353956bd2e48af0b238600ec807f6270db4fc22e6433bb59efd"},{"version":"8f78e17d875af8af5817ba21888947d6a220016b0968e5f220292c24f09e5fb7","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"c79131802a0c87da52604e6e6c6e87ef62168bbc7eb8f37ba587b0ef456d2e30","signature":"ed379548d37856782da05eb4ead24db026f64d325c2cfbe256e667da7efe7c42"},{"version":"babca4a1e05e5028c677a19ff566fc84f8b66ea081631a7fef795ff56e8aec60","signature":"41b50b205d6a222f23c5a4858b5250fb61998c40e89564e5f255221d9157135d"}],"root":[[90,107]],"options":{"allowJs":true,"allowSyntheticDefaultImports":true,"checkJs":true,"composite":true,"declaration":true,"declarationDir":"./build-types","declarationMap":true,"emitDeclarationOnly":true,"esModuleInterop":false,"jsx":1,"module":99,"noFallthroughCasesInSwitch":true,"noImplicitReturns":true,"rootDir":"./src","skipDefaultLibCheck":true,"strict":true,"target":99},"fileIdsList":[[86,87,88],[75],[74],[74,75,76,77,78,79,80,81,82,83,84],[77],[79],[85,90,106],[90,92],[94,95,96],[93,97,98,99,100,101,104,105],[102,103],[85,90,91],[89]],"referencedMap":[[89,1],[76,2],[77,3],[85,4],[78,3],[79,3],[80,5],[81,6],[75,3],[82,6],[83,3],[84,6],[107,7],[99,8],[93,8],[94,8],[95,8],[97,9],[96,8],[98,8],[106,10],[101,8],[100,8],[104,11],[103,8],[102,8],[105,8],[92,12],[90,13]],"latestChangedDtsFile":"./build-types/index.d.ts"},"version":"5.5.3"}
+{"program":{"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.es2019.d.ts","../../node_modules/typescript/lib/lib.es2020.d.ts","../../node_modules/typescript/lib/lib.es2021.d.ts","../../node_modules/typescript/lib/lib.es2022.d.ts","../../node_modules/typescript/lib/lib.es2023.d.ts","../../node_modules/typescript/lib/lib.esnext.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.dom.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2019.array.d.ts","../../node_modules/typescript/lib/lib.es2019.object.d.ts","../../node_modules/typescript/lib/lib.es2019.string.d.ts","../../node_modules/typescript/lib/lib.es2019.symbol.d.ts","../../node_modules/typescript/lib/lib.es2019.intl.d.ts","../../node_modules/typescript/lib/lib.es2020.bigint.d.ts","../../node_modules/typescript/lib/lib.es2020.date.d.ts","../../node_modules/typescript/lib/lib.es2020.promise.d.ts","../../node_modules/typescript/lib/lib.es2020.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2020.string.d.ts","../../node_modules/typescript/lib/lib.es2020.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2020.intl.d.ts","../../node_modules/typescript/lib/lib.es2020.number.d.ts","../../node_modules/typescript/lib/lib.es2021.promise.d.ts","../../node_modules/typescript/lib/lib.es2021.string.d.ts","../../node_modules/typescript/lib/lib.es2021.weakref.d.ts","../../node_modules/typescript/lib/lib.es2021.intl.d.ts","../../node_modules/typescript/lib/lib.es2022.array.d.ts","../../node_modules/typescript/lib/lib.es2022.error.d.ts","../../node_modules/typescript/lib/lib.es2022.intl.d.ts","../../node_modules/typescript/lib/lib.es2022.object.d.ts","../../node_modules/typescript/lib/lib.es2022.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2022.string.d.ts","../../node_modules/typescript/lib/lib.es2022.regexp.d.ts","../../node_modules/typescript/lib/lib.es2023.array.d.ts","../../node_modules/typescript/lib/lib.es2023.collection.d.ts","../../node_modules/typescript/lib/lib.es2023.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.array.d.ts","../../node_modules/typescript/lib/lib.esnext.collection.d.ts","../../node_modules/typescript/lib/lib.esnext.intl.d.ts","../../node_modules/typescript/lib/lib.esnext.disposable.d.ts","../../node_modules/typescript/lib/lib.esnext.string.d.ts","../../node_modules/typescript/lib/lib.esnext.promise.d.ts","../../node_modules/typescript/lib/lib.esnext.decorators.d.ts","../../node_modules/typescript/lib/lib.esnext.object.d.ts","../../node_modules/typescript/lib/lib.esnext.regexp.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../node_modules/no-case/dist/index.d.ts","../../node_modules/pascal-case/dist/index.d.ts","../../node_modules/camel-case/dist/index.d.ts","../../node_modules/capital-case/dist/index.d.ts","../../node_modules/constant-case/dist/index.d.ts","../../node_modules/dot-case/dist/index.d.ts","../../node_modules/header-case/dist/index.d.ts","../../node_modules/param-case/dist/index.d.ts","../../node_modules/path-case/dist/index.d.ts","../../node_modules/sentence-case/dist/index.d.ts","../../node_modules/snake-case/dist/index.d.ts","../../node_modules/change-case/dist/index.d.ts","../../node_modules/@types/react/global.d.ts","../../node_modules/csstype/index.d.ts","../../node_modules/@types/prop-types/index.d.ts","../../node_modules/@types/react/index.d.ts","./src/types.ts","./src/styles/constants.ts","./src/styles/utils.ts","./src/styles/border/index.ts","./src/styles/color/background.ts","./src/styles/color/gradient.ts","./src/styles/color/text.ts","./src/styles/color/index.ts","./src/styles/dimensions/index.ts","./src/styles/background/index.ts","./src/styles/shadow/index.ts","./src/styles/outline/index.ts","./src/styles/spacing/padding.ts","./src/styles/spacing/margin.ts","./src/styles/spacing/index.ts","./src/styles/typography/index.ts","./src/styles/index.ts","./src/index.ts"],"fileInfos":[{"version":"44e584d4f6444f58791784f1d530875970993129442a847597db702a073ca68c","affectsGlobalScope":true},"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","3facaf05f0c5fc569c5649dd359892c98a85557e3e0c847964caeb67076f4d75","9a68c0c07ae2fa71b44384a839b7b8d81662a236d4b9ac30916718f7510b1b2d","5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","68d73b4a11549f9c0b7d352d10e91e5dca8faa3322bfb77b661839c42b1ddec7","5efce4fc3c29ea84e8928f97adec086e3dc876365e0982cc8479a07954a3efd4","feecb1be483ed332fad555aff858affd90a48ab19ba7272ee084704eb7167569","5514e54f17d6d74ecefedc73c504eadffdeda79c7ea205cf9febead32d45c4bc","27bdc30a0e32783366a5abeda841bc22757c1797de8681bbe81fbc735eeb1c10","17edc026abf73c5c2dd508652d63f68ec4efd9d4856e3469890d27598209feb5",{"version":"4af6b0c727b7a2896463d512fafd23634229adf69ac7c00e2ae15a09cb084fad","affectsGlobalScope":true},{"version":"9c00a480825408b6a24c63c1b71362232927247595d7c97659bc24dc68ae0757","affectsGlobalScope":true},{"version":"6920e1448680767498a0b77c6a00a8e77d14d62c3da8967b171f1ddffa3c18e4","affectsGlobalScope":true},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true},{"version":"4443e68b35f3332f753eacc66a04ac1d2053b8b035a0e0ac1d455392b5e243b3","affectsGlobalScope":true},{"version":"bc47685641087c015972a3f072480889f0d6c65515f12bd85222f49a98952ed7","affectsGlobalScope":true},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true},{"version":"93495ff27b8746f55d19fcbcdbaccc99fd95f19d057aed1bd2c0cafe1335fbf0","affectsGlobalScope":true},{"version":"6fc23bb8c3965964be8c597310a2878b53a0306edb71d4b5a4dfe760186bcc01","affectsGlobalScope":true},{"version":"ea011c76963fb15ef1cdd7ce6a6808b46322c527de2077b6cfdf23ae6f5f9ec7","affectsGlobalScope":true},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true},{"version":"bb42a7797d996412ecdc5b2787720de477103a0b2e53058569069a0e2bae6c7e","affectsGlobalScope":true},{"version":"4738f2420687fd85629c9efb470793bb753709c2379e5f85bc1815d875ceadcd","affectsGlobalScope":true},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true},{"version":"9fc46429fbe091ac5ad2608c657201eb68b6f1b8341bd6d670047d32ed0a88fa","affectsGlobalScope":true},{"version":"61c37c1de663cf4171e1192466e52c7a382afa58da01b1dc75058f032ddf0839","affectsGlobalScope":true},{"version":"b541a838a13f9234aba650a825393ffc2292dc0fc87681a5d81ef0c96d281e7a","affectsGlobalScope":true},{"version":"9e9fbd7030c440b33d021da145d3232984c8bb7916f277e8ffd3dc2e3eae2bdb","affectsGlobalScope":true},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true},{"version":"d7e7d9b7b50e5f22c915b525acc5a49a7a6584cf8f62d0569e557c5cfc4b2ac2","affectsGlobalScope":true},{"version":"71c37f4c9543f31dfced6c7840e068c5a5aacb7b89111a4364b1d5276b852557","affectsGlobalScope":true},{"version":"576711e016cf4f1804676043e6a0a5414252560eb57de9faceee34d79798c850","affectsGlobalScope":true},{"version":"89c1b1281ba7b8a96efc676b11b264de7a8374c5ea1e6617f11880a13fc56dc6","affectsGlobalScope":true},{"version":"74f7fa2d027d5b33eb0471c8e82a6c87216223181ec31247c357a3e8e2fddc5b","affectsGlobalScope":true},{"version":"ae37d6ccd1560b0203ab88d46987393adaaa78c919e51acf32fb82c86502e98c","affectsGlobalScope":true},{"version":"063600664504610fe3e99b717a1223f8b1900087fab0b4cad1496a114744f8df","affectsGlobalScope":true},{"version":"934019d7e3c81950f9a8426d093458b65d5aff2c7c1511233c0fd5b941e608ab","affectsGlobalScope":true},{"version":"bf14a426dbbf1022d11bd08d6b8e709a2e9d246f0c6c1032f3b2edb9a902adbe","affectsGlobalScope":true},{"version":"5e07ed3809d48205d5b985642a59f2eba47c402374a7cf8006b686f79efadcbd","affectsGlobalScope":true},{"version":"2b72d528b2e2fe3c57889ca7baef5e13a56c957b946906d03767c642f386bbc3","affectsGlobalScope":true},{"version":"479553e3779be7d4f68e9f40cdb82d038e5ef7592010100410723ceced22a0f7","affectsGlobalScope":true},{"version":"368af93f74c9c932edd84c58883e736c9e3d53cec1fe24c0b0ff451f529ceab1","affectsGlobalScope":true},{"version":"af3dd424cf267428f30ccfc376f47a2c0114546b55c44d8c0f1d57d841e28d74","affectsGlobalScope":true},{"version":"995c005ab91a498455ea8dfb63aa9f83fa2ea793c3d8aa344be4a1678d06d399","affectsGlobalScope":true},{"version":"d3d7b04b45033f57351c8434f60b6be1ea71a2dfec2d0a0c3c83badbb0e3e693","affectsGlobalScope":true},{"version":"956d27abdea9652e8368ce029bb1e0b9174e9678a273529f426df4b3d90abd60","affectsGlobalScope":true},{"version":"4fa6ed14e98aa80b91f61b9805c653ee82af3502dc21c9da5268d3857772ca05","affectsGlobalScope":true},{"version":"e6633e05da3ff36e6da2ec170d0d03ccf33de50ca4dc6f5aeecb572cedd162fb","affectsGlobalScope":true},{"version":"d8670852241d4c6e03f2b89d67497a4bbefe29ecaa5a444e2c11a9b05e6fccc6","affectsGlobalScope":true},{"version":"8444af78980e3b20b49324f4a16ba35024fef3ee069a0eb67616ea6ca821c47a","affectsGlobalScope":true},{"version":"caccc56c72713969e1cfe5c3d44e5bab151544d9d2b373d7dbe5a1e4166652be","affectsGlobalScope":true},{"version":"3287d9d085fbd618c3971944b65b4be57859f5415f495b33a6adc994edd2f004","affectsGlobalScope":true},{"version":"b4b67b1a91182421f5df999988c690f14d813b9850b40acd06ed44691f6727ad","affectsGlobalScope":true},{"version":"08a58483392df5fcc1db57d782e87734f77ae9eab42516028acbfe46f29a3ef7","affectsGlobalScope":true},{"version":"436aaf437562f276ec2ddbee2f2cdedac7664c1e4c1d2c36839ddd582eeb3d0a","affectsGlobalScope":true},{"version":"8e3c06ea092138bf9fa5e874a1fdbc9d54805d074bee1de31b99a11e2fec239d","affectsGlobalScope":true},{"version":"0b11f3ca66aa33124202c80b70cd203219c3d4460cfc165e0707aa9ec710fc53","affectsGlobalScope":true},{"version":"6a3f5a0129cc80cf439ab71164334d649b47059a4f5afca90282362407d0c87f","affectsGlobalScope":true},{"version":"811c71eee4aa0ac5f7adf713323a5c41b0cf6c4e17367a34fbce379e12bbf0a4","affectsGlobalScope":true},{"version":"15b98a533864d324e5f57cd3cfc0579b231df58c1c0f6063ea0fcb13c3c74ff9","affectsGlobalScope":true},{"version":"0a6282c8827e4b9a95f4bf4f5c205673ada31b982f50572d27103df8ceb8013c","affectsGlobalScope":true},{"version":"ac77cb3e8c6d3565793eb90a8373ee8033146315a3dbead3bde8db5eaf5e5ec6","affectsGlobalScope":true},{"version":"d4b1d2c51d058fc21ec2629fff7a76249dec2e36e12960ea056e3ef89174080f","affectsGlobalScope":true},{"version":"2fef54945a13095fdb9b84f705f2b5994597640c46afeb2ce78352fab4cb3279","affectsGlobalScope":true},{"version":"56e4ed5aab5f5920980066a9409bfaf53e6d21d3f8d020c17e4de584d29600ad","affectsGlobalScope":true},{"version":"33358442698bb565130f52ba79bfd3d4d484ac85fe33f3cb1759c54d18201393","affectsGlobalScope":true},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true},"b4e123af1af6049685c93073a15868b50aebdad666d422edc72fa2b585fa8a37","f86c04a744ebcede96bac376f9a2c90f2bd3c422740d91dda4ca6233199d4977","6ae1bddee5c790439bd992abd063b9b46e0cadd676c2a8562268d1869213ff60","606244fc97a6a74b877f2e924ba7e55b233bc6acb57d7bf40ba84a5be2d9adb0","4a1cabac71036b8a14f5db1b753b579f0c901c7d7b9227e6872dadf6efb104e8","062959a1d825b96639d87be35fe497cbd3f89544bf06fdad577bbfb85fcf604c","4c3672dc8f4e4fdd3d18525b22b31f1b5481f5a415db96550d3ac5163a6c3dd3","f9a69ca445010b91fe08f08c06e0f86d79c0d776905f9bdb828477cb2a1eb7fc","ad7fd0e7ee457d4884b3aaecbcbd2a80b6803407c4ce2540c296170d4c7918ef","a50ef21605f41c6acad6c3ef0307e5311b94963c846ca093c764b80cdb5318d6","74b4035dd26d09a417c44ca23ab5ee69b173f8c2f6b2e47350ab0795cf2d4a17","918f86ee2b19cc38cb8b1a4cf8f223eb228aaa39df3604c42f700fac2f0b3ea1",{"version":"55461596dc873b866911ef4e640fae4c39da7ac1fbc7ef5e649cb2f2fb42c349","affectsGlobalScope":true},"4c68749a564a6facdf675416d75789ee5a557afda8960e0803cf6711fa569288","f7b46d22a307739c145e5fddf537818038fdfffd580d79ed717f4d4d37249380",{"version":"8ca4709dbd22a34bcc1ebf93e1877645bdb02ebd3f3d9a211a299a8db2ee4ba1","affectsGlobalScope":true},{"version":"cb2ceed19e0b7482dc537ed2490bdb4491d90cfa0bd5f3e403ac5042f36d0fe4","signature":"156bc964d404f5c75fc9982ed04809cbf3db8c9e351a98dd9f09fec7d4b949ec"},{"version":"301543eebfdd2fc5e5d6d928c5ed3f65bd377e95d184eb1351df5fe38ef9eac0","signature":"b6dbb3376b4265410d8aad2c234b41ac0a1f8d29e0ae0bf06c159c9f2ef13fc0"},{"version":"32811f8d79e4d888efededdac647f2049192e86ee2bbedb6c592cd1118debe63","signature":"a9a2b2976cf46df21e0f23c4ab90e0f8a9ae7f551a3dec463252df8a6b893c3d"},{"version":"6a47ab963c0de27ca91c40b8a8370d4c368f51bbcfeb70ca028fa3679afa56f9","signature":"65511c14946110a16693dd09273dfc0f8060d0ac6d0ad40cbcebdced0b251961"},{"version":"49dec6685c69b84a795d1e2c2a8d7ac8953efb4a7dadb9b1b04c836053e0ea21","signature":"9a4c1e89a7eeff330b95276972fee79058b121b261d1118ef7d5ef9cfc3bccdd"},{"version":"8cbcd8c85fe3627d4c9e75ccf2784b7e4d0082396600e9d432f1cd61009a7933","signature":"1bcecf449f856cced1aeb30fbb82a49e1037833139fd43bf1c1740ccc9ba0b6a"},{"version":"f303eb9a884f47802f08d6b1d376c737856c29783532a44116bfc7e4929a7204","signature":"629dbceb125f23c956f1f42fc11f9b37d42f49519267b4f8448a4e5c1214d142"},{"version":"e8dc9f16ad89ba54f1e7202369a69a265ccd5eec0df39cf429ff1a941603d4da","signature":"2439cec606f95353956bd2e48af0b238600ec807f6270db4fc22e6433bb59efd"},{"version":"becf1f4571b39ee129d55d8b3df006d11d72b3c8c880ebc4a49113a200b8812d","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"e02067cf9aa8586210240c0c9b52f7abc6ec5f65a3ecb5a4efeaf1115264de6e","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"51f25b3291c4ca38c72cb150453eb2961bb0ca2891102719064e2a695c47a55a","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"697ce73163b0e4ac9fe325a666e48b76b0754eff4b3fe7906369894a76cd860f","signature":"a69042401e8a750db9b3e8be7898ee61a6af5bacdc2abfa373b596923b68f170"},{"version":"caa45d96bc56c4f2ea6dfbe715413636f0d8b74121a8820b70526a3ae1bfd9b9","signature":"aaf7dd84606d5f76aa8219904020c11a858ce264dc846a4023faff5e3823e9b4"},{"version":"3d0705f37a3de49d9210d2656cd697ae0cd93476a7e60f7b099797166e4d78b0","signature":"76fc0038ad0327ca885df7e552ebbf68e65ec59cf5ecab10cbdcb48486367cb0"},{"version":"b7003bd91d5a0b8bf84a3ef07a0cf5a4b8e0cef58d9e6404f54f05fd4ed6f0b2","signature":"2439cec606f95353956bd2e48af0b238600ec807f6270db4fc22e6433bb59efd"},{"version":"8f78e17d875af8af5817ba21888947d6a220016b0968e5f220292c24f09e5fb7","signature":"06f5b632cabf37fd02dd4ebff4cb0f8a693846cac3f30a47f1a517e9ff956bd3"},{"version":"c79131802a0c87da52604e6e6c6e87ef62168bbc7eb8f37ba587b0ef456d2e30","signature":"ed379548d37856782da05eb4ead24db026f64d325c2cfbe256e667da7efe7c42"},{"version":"59f1688c24d09455eed4b73a555ce536c5ba7c197043efa8aadd09c5ad7f97e0","signature":"9a234928ebfed61c66bd5d8f281281085f3dcf93ad00a5aa289929cbba3a7a05"}],"root":[[90,107]],"options":{"allowJs":true,"allowSyntheticDefaultImports":true,"checkJs":true,"composite":true,"declaration":true,"declarationDir":"./build-types","declarationMap":true,"emitDeclarationOnly":true,"esModuleInterop":false,"jsx":1,"module":99,"noFallthroughCasesInSwitch":true,"noImplicitReturns":true,"rootDir":"./src","skipDefaultLibCheck":true,"strict":true,"target":99},"fileIdsList":[[86,87,88],[75],[74],[74,75,76,77,78,79,80,81,82,83,84],[77],[79],[85,90,92,106],[90,92],[94,95,96],[93,97,98,99,100,101,104,105],[102,103],[85,90,91],[89]],"referencedMap":[[89,1],[76,2],[77,3],[85,4],[78,3],[79,3],[80,5],[81,6],[75,3],[82,6],[83,3],[84,6],[107,7],[99,8],[93,8],[94,8],[95,8],[97,9],[96,8],[98,8],[106,10],[101,8],[100,8],[104,11],[103,8],[102,8],[105,8],[92,12],[90,13]],"latestChangedDtsFile":"./build-types/index.d.ts"},"version":"5.5.3"}

package/src/test/utils.js

@@ -1,62 +0,0 @@
-/**
- * Internal dependencies
- */
-import {
-	camelCaseJoin,
-	getCSSVarFromStyleValue,
-	upperFirst,
-} from '../styles/utils';
-
-describe( 'utils', () => {
-	describe( 'upperFirst()', () => {
-		it( 'should return an string with a capitalized first letter', () => {
-			expect( upperFirst( 'toontown' ) ).toEqual( 'Toontown' );
-		} );
-	} );
-
-	describe( 'camelCaseJoin()', () => {
-		it( 'should return a camelCase string', () => {
-			expect( camelCaseJoin( [ 'toon', 'town' ] ) ).toEqual( 'toonTown' );
-		} );
-	} );
-
-	describe( 'getCSSVarFromStyleValue()', () => {
-		it( 'should return a compiled CSS var', () => {
-			expect(
-				getCSSVarFromStyleValue( 'var:preset|color|yellow-bun' )
-			).toEqual( 'var(--wp--preset--color--yellow-bun)' );
-		} );
-
-		it( 'should kebab case numbers', () => {
-			expect(
-				getCSSVarFromStyleValue( 'var:preset|font-size|h1' )
-			).toEqual( 'var(--wp--preset--font-size--h-1)' );
-		} );
-
-		it( 'should kebab case numbers as prefix', () => {
-			expect(
-				getCSSVarFromStyleValue( 'var:preset|font-size|1px' )
-			).toEqual( 'var(--wp--preset--font-size--1-px)' );
-		} );
-
-		it( 'should kebab case both sides of numbers', () => {
-			expect(
-				getCSSVarFromStyleValue( 'var:preset|color|orange11orange' )
-			).toEqual( 'var(--wp--preset--color--orange-11-orange)' );
-		} );
-
-		it( 'should kebab case camel case', () => {
-			expect(
-				getCSSVarFromStyleValue( 'var:preset|color|heavenlyBlue' )
-			).toEqual( 'var(--wp--preset--color--heavenly-blue)' );
-		} );
-
-		it( 'should kebab case underscores', () => {
-			expect(
-				getCSSVarFromStyleValue(
-					'var:preset|background|dark_Secrets_100'
-				)
-			).toEqual( 'var(--wp--preset--background--dark-secrets-100)' );
-		} );
-	} );
-} );