@wordpress/theme 0.1.0 → 0.2.0

package/build/prebuilt/ts/color-tokens.js

@@ -0,0 +1,137 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/prebuilt/ts/color-tokens.ts
+var color_tokens_exports = {};
+__export(color_tokens_exports, {
+  default: () => color_tokens_default
+});
+module.exports = __toCommonJS(color_tokens_exports);
+var color_tokens_default = {
+  "primary-bgFill1": ["bg-interactive-brand-strong"],
+  "primary-fgFill": [
+    "fg-interactive-brand-strong-active",
+    "fg-interactive-brand-strong"
+  ],
+  "primary-bgFill2": ["bg-interactive-brand-strong-active"],
+  "primary-surface2": ["bg-interactive-brand-active"],
+  "primary-surface4": ["bg-interactive-brand-weak-active"],
+  "primary-fgSurface3": [
+    "fg-interactive-brand-active",
+    "fg-interactive-brand"
+  ],
+  "primary-stroke3": [
+    "bg-thumb-brand-active",
+    "bg-thumb-brand",
+    "stroke-focus-brand",
+    "stroke-interactive-brand",
+    "stroke-surface-brand-strong"
+  ],
+  "primary-stroke4": ["stroke-interactive-brand-active"],
+  "primary-stroke1": ["stroke-surface-brand"],
+  "primary-surface1": ["bg-surface-brand"],
+  "info-surface2": ["bg-surface-info-weak"],
+  "info-surface4": ["bg-surface-info"],
+  "info-fgSurface4": ["fg-content-info"],
+  "info-fgSurface3": ["fg-content-info-weak"],
+  "info-stroke3": ["stroke-surface-info-strong"],
+  "info-stroke1": ["stroke-surface-info"],
+  "success-surface2": ["bg-surface-success-weak"],
+  "success-surface4": ["bg-surface-success"],
+  "success-fgSurface4": ["fg-content-success"],
+  "success-fgSurface3": ["fg-content-success-weak"],
+  "success-stroke3": ["stroke-surface-success-strong"],
+  "success-stroke1": ["stroke-surface-success"],
+  "warning-surface2": ["bg-surface-warning-weak"],
+  "warning-surface4": ["bg-surface-warning"],
+  "warning-fgSurface4": ["fg-content-warning"],
+  "warning-fgSurface3": ["fg-content-warning-weak"],
+  "warning-stroke3": ["stroke-surface-warning-strong"],
+  "warning-stroke1": ["stroke-surface-warning"],
+  "error-surface2": ["bg-surface-error-weak"],
+  "error-surface4": ["bg-surface-error"],
+  "error-fgSurface4": ["fg-content-error"],
+  "error-fgSurface3": ["fg-content-error-weak"],
+  "error-stroke3": [
+    "stroke-interactive-error-strong",
+    "stroke-surface-error-strong"
+  ],
+  "error-stroke1": ["stroke-surface-error"],
+  "bg-surface2": ["bg-surface-neutral"],
+  "bg-surface6": [
+    "bg-interactive-brand-strong-disabled",
+    "bg-interactive-neutral-strong-disabled"
+  ],
+  "bg-surface5": [
+    "bg-interactive-brand-disabled",
+    "bg-interactive-brand-weak-disabled",
+    "bg-interactive-neutral-disabled",
+    "bg-interactive-neutral-weak-disabled"
+  ],
+  "bg-surface4": [
+    "bg-interactive-neutral-active",
+    "bg-interactive-neutral-weak-active"
+  ],
+  "bg-surface3": ["bg-surface-neutral-strong"],
+  "bg-fgSurface4": [
+    "fg-content-neutral",
+    "fg-interactive-neutral-active",
+    "fg-interactive-neutral"
+  ],
+  "bg-fgSurface3": [
+    "fg-content-neutral-weak",
+    "fg-interactive-brand-strong-disabled",
+    "fg-interactive-neutral-strong-disabled",
+    "fg-interactive-neutral-weak"
+  ],
+  "bg-fgSurface2": [
+    "fg-interactive-brand-disabled",
+    "fg-interactive-neutral-disabled",
+    "fg-interactive-neutral-weak-disabled"
+  ],
+  "bg-stroke3": [
+    "bg-thumb-neutral-weak",
+    "stroke-interactive-neutral",
+    "stroke-surface-neutral-strong"
+  ],
+  "bg-stroke4": [
+    "bg-thumb-neutral-weak-active",
+    "stroke-interactive-neutral-active",
+    "stroke-interactive-neutral-strong"
+  ],
+  "bg-stroke2": [
+    "bg-thumb-brand-disabled",
+    "bg-track-neutral",
+    "stroke-interactive-brand-disabled",
+    "stroke-interactive-neutral-disabled",
+    "stroke-surface-neutral"
+  ],
+  "bg-stroke1": ["bg-track-neutral-weak", "stroke-surface-neutral-weak"],
+  "bg-bgFillInverted2": ["bg-interactive-neutral-strong-active"],
+  "bg-bgFillInverted1": ["bg-interactive-neutral-strong"],
+  "bg-fgFillInverted": [
+    "fg-interactive-neutral-strong-active",
+    "fg-interactive-neutral-strong"
+  ],
+  "bg-surface1": ["bg-surface-neutral-weak"],
+  "caution-surface2": ["bg-surface-caution-weak"],
+  "caution-surface4": ["bg-surface-caution"],
+  "caution-fgSurface4": ["fg-content-caution"],
+  "caution-fgSurface3": ["fg-content-caution-weak"]
+};
+//# sourceMappingURL=color-tokens.js.map

package/build/prebuilt/ts/color-tokens.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/prebuilt/ts/color-tokens.ts"],
+  "sourcesContent": ["/**\n * This file is generated by the @wordpress/terrazzo-plugin-inline-alias-values plugin.\n * Do not edit this file directly.\n */\n\nexport default {\n\t'primary-bgFill1': [ 'bg-interactive-brand-strong' ],\n\t'primary-fgFill': [\n\t\t'fg-interactive-brand-strong-active',\n\t\t'fg-interactive-brand-strong',\n\t],\n\t'primary-bgFill2': [ 'bg-interactive-brand-strong-active' ],\n\t'primary-surface2': [ 'bg-interactive-brand-active' ],\n\t'primary-surface4': [ 'bg-interactive-brand-weak-active' ],\n\t'primary-fgSurface3': [\n\t\t'fg-interactive-brand-active',\n\t\t'fg-interactive-brand',\n\t],\n\t'primary-stroke3': [\n\t\t'bg-thumb-brand-active',\n\t\t'bg-thumb-brand',\n\t\t'stroke-focus-brand',\n\t\t'stroke-interactive-brand',\n\t\t'stroke-surface-brand-strong',\n\t],\n\t'primary-stroke4': [ 'stroke-interactive-brand-active' ],\n\t'primary-stroke1': [ 'stroke-surface-brand' ],\n\t'primary-surface1': [ 'bg-surface-brand' ],\n\t'info-surface2': [ 'bg-surface-info-weak' ],\n\t'info-surface4': [ 'bg-surface-info' ],\n\t'info-fgSurface4': [ 'fg-content-info' ],\n\t'info-fgSurface3': [ 'fg-content-info-weak' ],\n\t'info-stroke3': [ 'stroke-surface-info-strong' ],\n\t'info-stroke1': [ 'stroke-surface-info' ],\n\t'success-surface2': [ 'bg-surface-success-weak' ],\n\t'success-surface4': [ 'bg-surface-success' ],\n\t'success-fgSurface4': [ 'fg-content-success' ],\n\t'success-fgSurface3': [ 'fg-content-success-weak' ],\n\t'success-stroke3': [ 'stroke-surface-success-strong' ],\n\t'success-stroke1': [ 'stroke-surface-success' ],\n\t'warning-surface2': [ 'bg-surface-warning-weak' ],\n\t'warning-surface4': [ 'bg-surface-warning' ],\n\t'warning-fgSurface4': [ 'fg-content-warning' ],\n\t'warning-fgSurface3': [ 'fg-content-warning-weak' ],\n\t'warning-stroke3': [ 'stroke-surface-warning-strong' ],\n\t'warning-stroke1': [ 'stroke-surface-warning' ],\n\t'error-surface2': [ 'bg-surface-error-weak' ],\n\t'error-surface4': [ 'bg-surface-error' ],\n\t'error-fgSurface4': [ 'fg-content-error' ],\n\t'error-fgSurface3': [ 'fg-content-error-weak' ],\n\t'error-stroke3': [\n\t\t'stroke-interactive-error-strong',\n\t\t'stroke-surface-error-strong',\n\t],\n\t'error-stroke1': [ 'stroke-surface-error' ],\n\t'bg-surface2': [ 'bg-surface-neutral' ],\n\t'bg-surface6': [\n\t\t'bg-interactive-brand-strong-disabled',\n\t\t'bg-interactive-neutral-strong-disabled',\n\t],\n\t'bg-surface5': [\n\t\t'bg-interactive-brand-disabled',\n\t\t'bg-interactive-brand-weak-disabled',\n\t\t'bg-interactive-neutral-disabled',\n\t\t'bg-interactive-neutral-weak-disabled',\n\t],\n\t'bg-surface4': [\n\t\t'bg-interactive-neutral-active',\n\t\t'bg-interactive-neutral-weak-active',\n\t],\n\t'bg-surface3': [ 'bg-surface-neutral-strong' ],\n\t'bg-fgSurface4': [\n\t\t'fg-content-neutral',\n\t\t'fg-interactive-neutral-active',\n\t\t'fg-interactive-neutral',\n\t],\n\t'bg-fgSurface3': [\n\t\t'fg-content-neutral-weak',\n\t\t'fg-interactive-brand-strong-disabled',\n\t\t'fg-interactive-neutral-strong-disabled',\n\t\t'fg-interactive-neutral-weak',\n\t],\n\t'bg-fgSurface2': [\n\t\t'fg-interactive-brand-disabled',\n\t\t'fg-interactive-neutral-disabled',\n\t\t'fg-interactive-neutral-weak-disabled',\n\t],\n\t'bg-stroke3': [\n\t\t'bg-thumb-neutral-weak',\n\t\t'stroke-interactive-neutral',\n\t\t'stroke-surface-neutral-strong',\n\t],\n\t'bg-stroke4': [\n\t\t'bg-thumb-neutral-weak-active',\n\t\t'stroke-interactive-neutral-active',\n\t\t'stroke-interactive-neutral-strong',\n\t],\n\t'bg-stroke2': [\n\t\t'bg-thumb-brand-disabled',\n\t\t'bg-track-neutral',\n\t\t'stroke-interactive-brand-disabled',\n\t\t'stroke-interactive-neutral-disabled',\n\t\t'stroke-surface-neutral',\n\t],\n\t'bg-stroke1': [ 'bg-track-neutral-weak', 'stroke-surface-neutral-weak' ],\n\t'bg-bgFillInverted2': [ 'bg-interactive-neutral-strong-active' ],\n\t'bg-bgFillInverted1': [ 'bg-interactive-neutral-strong' ],\n\t'bg-fgFillInverted': [\n\t\t'fg-interactive-neutral-strong-active',\n\t\t'fg-interactive-neutral-strong',\n\t],\n\t'bg-surface1': [ 'bg-surface-neutral-weak' ],\n\t'caution-surface2': [ 'bg-surface-caution-weak' ],\n\t'caution-surface4': [ 'bg-surface-caution' ],\n\t'caution-fgSurface4': [ 'fg-content-caution' ],\n\t'caution-fgSurface3': [ 'fg-content-caution-weak' ],\n} as Record< string, string[] >;\n"],
+  "mappings": "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",
+  "names": []
+}

package/build/private-apis.js

@@ -1,4 +1,3 @@
-"use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -16,6 +15,8 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/private-apis.ts
 var private_apis_exports = {};
 __export(private_apis_exports, {
   privateApis: () => privateApis
@@ -24,7 +25,7 @@ module.exports = __toCommonJS(private_apis_exports);
 var import_lock_unlock = require("./lock-unlock");
 var import_theme_provider = require("./theme-provider");
 var import_use_theme_provider_styles = require("./use-theme-provider-styles");
-const privateApis = {};
+var privateApis = {};
 (0, import_lock_unlock.lock)(privateApis, {
   ThemeProvider: import_theme_provider.ThemeProvider,
   useThemeProviderStyles: import_use_theme_provider_styles.useThemeProviderStyles

package/build/private-apis.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../src/private-apis.ts"],
   "sourcesContent": ["/**\n * Internal dependencies\n */\nimport { lock } from './lock-unlock';\nimport { ThemeProvider } from './theme-provider';\nimport { useThemeProviderStyles } from './use-theme-provider-styles';\n\nexport const privateApis = {};\nlock( privateApis, {\n\tThemeProvider,\n\tuseThemeProviderStyles,\n} );\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,yBAAqB;AACrB,4BAA8B;AAC9B,uCAAuC;AAEhC,MAAM,cAAc,CAAC;AAAA,IAC5B,yBAAM,aAAa;AAAA,EAClB;AAAA,EACA;AACD,CAAE;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,yBAAqB;AACrB,4BAA8B;AAC9B,uCAAuC;AAEhC,IAAM,cAAc,CAAC;AAAA,IAC5B,yBAAM,aAAa;AAAA,EAClB;AAAA,EACA;AACD,CAAE;",
   "names": []
 }

package/build/theme-provider.js

@@ -1,9 +1,6 @@
-"use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,25 +14,30 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/theme-provider.tsx
 var theme_provider_exports = {};
 __export(theme_provider_exports, {
   ThemeProvider: () => ThemeProvider
 });
 module.exports = __toCommonJS(theme_provider_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
 var import_element = require("@wordpress/element");
 var import_context = require("./context");
 var import_use_theme_provider_styles = require("./use-theme-provider-styles");
-var import_style = __toESM(require("./style.module.css"));
+
+// packages/theme/src/style.module.css
+var css = `.style-module__root__26kw6 {
+	display: contents;
+}
+`;
+document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
+var style_default = {
+  "root": "style-module__root__26kw6"
+};
+
+// packages/theme/src/theme-provider.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
 function cssObjectToText(values) {
   return Object.entries(values).map(([key, value]) => `${key}: ${value};`).join("");
 }
@@ -48,13 +50,13 @@ function generateCSSSelector({
   const selectors = [];
   if (isRoot) {
     selectors.push(
-      `:root:has(.${import_style.default.root}${rootSel}${instanceIdSel})`
+      `:root:has(.${style_default.root}${rootSel}${instanceIdSel})`
     );
   }
-  selectors.push(`.${import_style.default.root}.${import_style.default.root}${instanceIdSel}`);
+  selectors.push(`.${style_default.root}.${style_default.root}${instanceIdSel}`);
   return selectors.join(",");
 }
-const ThemeProvider = ({
+var ThemeProvider = ({
   children,
   color = {},
   isRoot = false
@@ -79,7 +81,7 @@ const ThemeProvider = ({
       {
         "data-wpds-theme-provider-id": instanceId,
         "data-wpds-root-provider": isRoot,
-        className: import_style.default.root,
+        className: style_default.root,
         children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_context.ThemeContext.Provider, { value: contextValue, children })
       }
     )

package/build/theme-provider.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/theme-provider.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useId } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ThemeContext } from './context';\nimport { useThemeProviderStyles } from './use-theme-provider-styles';\nimport { type ThemeProviderProps } from './types';\nimport styles from './style.module.css';\n\nfunction cssObjectToText( values: CSSProperties ) {\n\treturn Object.entries( values )\n\t\t.map( ( [ key, value ] ) => `${ key }: ${ value };` )\n\t\t.join( '' );\n}\n\nfunction generateCSSSelector( {\n\tinstanceId,\n\tisRoot,\n}: {\n\tinstanceId: string;\n\tisRoot: boolean;\n} ) {\n\tconst rootSel = `[data-wpds-root-provider=\"true\"]`;\n\tconst instanceIdSel = `[data-wpds-theme-provider-id=\"${ instanceId }\"]`;\n\n\tconst selectors = [];\n\n\tif ( isRoot ) {\n\t\tselectors.push(\n\t\t\t`:root:has(.${ styles.root }${ rootSel }${ instanceIdSel })`\n\t\t);\n\t}\n\n\tselectors.push( `.${ styles.root }.${ styles.root }${ instanceIdSel }` );\n\n\treturn selectors.join( ',' );\n}\n\nexport const ThemeProvider = ( {\n\tchildren,\n\tcolor = {},\n\tisRoot = false,\n}: ThemeProviderProps ) => {\n\tconst instanceId = useId();\n\n\tconst { themeProviderStyles, resolvedSettings } = useThemeProviderStyles( {\n\t\tcolor,\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tresolvedSettings,\n\t\t} ),\n\t\t[ resolvedSettings ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ themeProviderStyles ? (\n\t\t\t\t<style>\n\t\t\t\t\t{ `${ generateCSSSelector( {\n\t\t\t\t\t\tinstanceId,\n\t\t\t\t\t\tisRoot,\n\t\t\t\t\t} ) } {${ cssObjectToText( themeProviderStyles ) }}` }\n\t\t\t\t</style>\n\t\t\t) : null }\n\t\t\t<div\n\t\t\t\tdata-wpds-theme-provider-id={ instanceId }\n\t\t\t\tdata-wpds-root-provider={ isRoot }\n\t\t\t\tclassName={ styles.root }\n\t\t\t>\n\t\t\t\t<ThemeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</ThemeContext.Provider>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEE;AA1DF,qBAA+B;AAK/B,qBAA6B;AAC7B,uCAAuC;AAEvC,mBAAmB;AAEnB,SAAS,gBAAiB,QAAwB;AACjD,SAAO,OAAO,QAAS,MAAO,EAC5B,IAAK,CAAE,CAAE,KAAK,KAAM,MAAO,GAAI,GAAI,KAAM,KAAM,GAAI,EACnD,KAAM,EAAG;AACZ;AAEA,SAAS,oBAAqB;AAAA,EAC7B;AAAA,EACA;AACD,GAGI;AACH,QAAM,UAAU;AAChB,QAAM,gBAAgB,iCAAkC,UAAW;AAEnE,QAAM,YAAY,CAAC;AAEnB,MAAK,QAAS;AACb,cAAU;AAAA,MACT,cAAe,aAAAA,QAAO,IAAK,GAAI,OAAQ,GAAI,aAAc;AAAA,IAC1D;AAAA,EACD;AAEA,YAAU,KAAM,IAAK,aAAAA,QAAO,IAAK,IAAK,aAAAA,QAAO,IAAK,GAAI,aAAc,EAAG;AAEvE,SAAO,UAAU,KAAM,GAAI;AAC5B;AAEO,MAAM,gBAAgB,CAAE;AAAA,EAC9B;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,SAAS;AACV,MAA2B;AAC1B,QAAM,iBAAa,sBAAM;AAEzB,QAAM,EAAE,qBAAqB,iBAAiB,QAAI,yDAAwB;AAAA,IACzE;AAAA,EACD,CAAE;AAEF,QAAM,mBAAe;AAAA,IACpB,OAAQ;AAAA,MACP;AAAA,IACD;AAAA,IACA,CAAE,gBAAiB;AAAA,EACpB;AAEA,SACC,4EACG;AAAA,0BACD,4CAAC,WACE,aAAI,oBAAqB;AAAA,MAC1B;AAAA,MACA;AAAA,IACD,CAAE,CAAE,KAAM,gBAAiB,mBAAoB,CAAE,KAClD,IACG;AAAA,IACJ;AAAA,MAAC;AAAA;AAAA,QACA,+BAA8B;AAAA,QAC9B,2BAA0B;AAAA,QAC1B,WAAY,aAAAA,QAAO;AAAA,QAEnB,sDAAC,4BAAa,UAAb,EAAsB,OAAQ,cAC5B,UACH;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
-  "names": ["styles"]
+  "sources": ["../src/theme-provider.tsx", "../src/style.module.css"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useId } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ThemeContext } from './context';\nimport { useThemeProviderStyles } from './use-theme-provider-styles';\nimport { type ThemeProviderProps } from './types';\nimport styles from './style.module.css';\n\nfunction cssObjectToText( values: CSSProperties ) {\n\treturn Object.entries( values )\n\t\t.map( ( [ key, value ] ) => `${ key }: ${ value };` )\n\t\t.join( '' );\n}\n\nfunction generateCSSSelector( {\n\tinstanceId,\n\tisRoot,\n}: {\n\tinstanceId: string;\n\tisRoot: boolean;\n} ) {\n\tconst rootSel = `[data-wpds-root-provider=\"true\"]`;\n\tconst instanceIdSel = `[data-wpds-theme-provider-id=\"${ instanceId }\"]`;\n\n\tconst selectors = [];\n\n\tif ( isRoot ) {\n\t\tselectors.push(\n\t\t\t`:root:has(.${ styles.root }${ rootSel }${ instanceIdSel })`\n\t\t);\n\t}\n\n\tselectors.push( `.${ styles.root }.${ styles.root }${ instanceIdSel }` );\n\n\treturn selectors.join( ',' );\n}\n\nexport const ThemeProvider = ( {\n\tchildren,\n\tcolor = {},\n\tisRoot = false,\n}: ThemeProviderProps ) => {\n\tconst instanceId = useId();\n\n\tconst { themeProviderStyles, resolvedSettings } = useThemeProviderStyles( {\n\t\tcolor,\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tresolvedSettings,\n\t\t} ),\n\t\t[ resolvedSettings ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ themeProviderStyles ? (\n\t\t\t\t<style>\n\t\t\t\t\t{ `${ generateCSSSelector( {\n\t\t\t\t\t\tinstanceId,\n\t\t\t\t\t\tisRoot,\n\t\t\t\t\t} ) } {${ cssObjectToText( themeProviderStyles ) }}` }\n\t\t\t\t</style>\n\t\t\t) : null }\n\t\t\t<div\n\t\t\t\tdata-wpds-theme-provider-id={ instanceId }\n\t\t\t\tdata-wpds-root-provider={ isRoot }\n\t\t\t\tclassName={ styles.root }\n\t\t\t>\n\t\t\t\t<ThemeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</ThemeContext.Provider>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n", "const css = `.style-module__root__26kw6 {\n\tdisplay: contents;\n}\n`;\ndocument.head\n    .appendChild(document.createElement(\"style\"))\n    .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n  \"root\": \"style-module__root__26kw6\"\n};"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,qBAA+B;AAK/B,qBAA6B;AAC7B,uCAAuC;;;ACdvC,IAAM,MAAM;AAAA;AAAA;AAAA;AAIZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAe,GAAG,CAAC;AAE7C,IAAO,gBAAQ;AAAA,EACb,QAAQ;AACV;;;ADwDE;AAhDF,SAAS,gBAAiB,QAAwB;AACjD,SAAO,OAAO,QAAS,MAAO,EAC5B,IAAK,CAAE,CAAE,KAAK,KAAM,MAAO,GAAI,GAAI,KAAM,KAAM,GAAI,EACnD,KAAM,EAAG;AACZ;AAEA,SAAS,oBAAqB;AAAA,EAC7B;AAAA,EACA;AACD,GAGI;AACH,QAAM,UAAU;AAChB,QAAM,gBAAgB,iCAAkC,UAAW;AAEnE,QAAM,YAAY,CAAC;AAEnB,MAAK,QAAS;AACb,cAAU;AAAA,MACT,cAAe,cAAO,IAAK,GAAI,OAAQ,GAAI,aAAc;AAAA,IAC1D;AAAA,EACD;AAEA,YAAU,KAAM,IAAK,cAAO,IAAK,IAAK,cAAO,IAAK,GAAI,aAAc,EAAG;AAEvE,SAAO,UAAU,KAAM,GAAI;AAC5B;AAEO,IAAM,gBAAgB,CAAE;AAAA,EAC9B;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,SAAS;AACV,MAA2B;AAC1B,QAAM,iBAAa,sBAAM;AAEzB,QAAM,EAAE,qBAAqB,iBAAiB,QAAI,yDAAwB;AAAA,IACzE;AAAA,EACD,CAAE;AAEF,QAAM,mBAAe;AAAA,IACpB,OAAQ;AAAA,MACP;AAAA,IACD;AAAA,IACA,CAAE,gBAAiB;AAAA,EACpB;AAEA,SACC,4EACG;AAAA,0BACD,4CAAC,WACE,aAAI,oBAAqB;AAAA,MAC1B;AAAA,MACA;AAAA,IACD,CAAE,CAAE,KAAM,gBAAiB,mBAAoB,CAAE,KAClD,IACG;AAAA,IACJ;AAAA,MAAC;AAAA;AAAA,QACA,+BAA8B;AAAA,QAC9B,2BAA0B;AAAA,QAC1B,WAAY,cAAO;AAAA,QAEnB,sDAAC,4BAAa,UAAb,EAAsB,OAAQ,cAC5B,UACH;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
+  "names": []
 }

package/build/token-id.js

@@ -0,0 +1,30 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/token-id.ts
+var token_id_exports = {};
+__export(token_id_exports, {
+  publicTokenId: () => publicTokenId
+});
+module.exports = __toCommonJS(token_id_exports);
+var publicTokenId = (id) => id.replace(/\.(normal|resting|semantic|primitive)/g, "");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  publicTokenId
+});
+//# sourceMappingURL=token-id.js.map

package/build/token-id.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/token-id.ts"],
+  "sourcesContent": ["/**\n * Normalizes a token ID by removing default states and visibility identifiers,\n * making it human-readable as a publicly-accessible variable name.\n *\n * @param id The token ID to normalize.\n * @return The normalized token ID.\n */\nexport const publicTokenId = ( id: string ) =>\n\tid.replace( /\\.(normal|resting|semantic|primitive)/g, '' );\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOO,IAAM,gBAAgB,CAAE,OAC9B,GAAG,QAAS,0CAA0C,EAAG;",
+  "names": []
+}

package/build/types/css-modules.d.js

@@ -1,2 +1 @@
-"use strict";
 //# sourceMappingURL=css-modules.d.js.map

package/build/types.js

@@ -1,4 +1,3 @@
-"use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -12,6 +11,8 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/types.ts
 var types_exports = {};
 module.exports = __toCommonJS(types_exports);
 //# sourceMappingURL=types.js.map

package/build/types.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../src/types.ts"],
   "sourcesContent": ["/**\n * External dependencies\n */\nimport { type ReactNode } from 'react';\n\nexport interface ThemeProviderSettings {\n\t/**\n\t * The set of color options to apply to the theme.\n\t */\n\tcolor?: {\n\t\t/**\n\t\t * The primary seed color to use for the theme.\n\t\t *\n\t\t * By default, it inherits from parent `ThemeProvider`,\n\t\t * and fallbacks to statically built CSS.\n\t\t */\n\t\tprimary?: string;\n\t\t/**\n\t\t * The background seed color to use for the theme.\n\t\t *\n\t\t * By default, it inherits from parent `ThemeProvider`,\n\t\t * and fallbacks to statically built CSS.\n\t\t */\n\t\tbg?: string;\n\t};\n}\n\nexport interface ThemeProviderProps extends ThemeProviderSettings {\n\t/**\n\t * The children to render.\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * When a ThemeProvider is the root provider, it will apply its theming\n\t * settings also to the root document element (e.g. the html element).\n\t * This is useful, for example, to make sure that the `html` element can\n\t * consume the right background color, or that overlays rendered inside a\n\t * portal can inherit the correct color scheme.\n\t *\n\t * @default false\n\t */\n\tisRoot?: boolean;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;",
   "names": []
 }

package/build/use-theme-provider-styles.js

@@ -1,4 +1,3 @@
-"use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -9,13 +8,13 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __copyProps = (to, from, except, desc) => {
+var __copyProps = (to2, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+      if (!__hasOwnProp.call(to2, key) && key !== except)
+        __defProp(to2, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return to;
+  return to2;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
   // If the importer is in node compatibility mode or this is not an ESM
@@ -26,17 +25,23 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/theme/src/use-theme-provider-styles.ts
 var use_theme_provider_styles_exports = {};
 __export(use_theme_provider_styles_exports, {
   useThemeProviderStyles: () => useThemeProviderStyles
 });
 module.exports = __toCommonJS(use_theme_provider_styles_exports);
-var import_colorjs = __toESM(require("colorjs.io"));
+var import_fn = require("colorjs.io/fn");
+var import_memize = __toESM(require("memize"));
 var import_element = require("@wordpress/element");
+var import_register_color_spaces = require("./color-ramps/lib/register-color-spaces");
 var import_context = require("./context");
-var import_design_tokens = __toESM(require("./prebuilt/ts/design-tokens"));
+var import_color_tokens = __toESM(require("./prebuilt/ts/color-tokens"));
 var import_color_ramps = require("./color-ramps");
-const legacyWpComponentsOverridesCSS = [
+var getCachedBgRamp = (0, import_memize.default)(import_color_ramps.buildBgRamp, { maxSize: 10 });
+var getCachedAccentRamp = (0, import_memize.default)(import_color_ramps.buildAccentRamp, { maxSize: 10 });
+var legacyWpComponentsOverridesCSS = [
   ["--wp-components-color-accent", "var(--wp-admin-theme-color)"],
   [
     "--wp-components-color-accent-darker-10",
@@ -92,37 +97,49 @@ const legacyWpComponentsOverridesCSS = [
   ]
 ];
 function customRgbFormat(color) {
-  const rgb = color.to("srgb");
-  return [rgb.r, rgb.g, rgb.b].map((n) => Math.round(n * 255)).join(", ");
+  const rgb = (0, import_fn.to)(color, import_fn.sRGB);
+  return [(0, import_fn.get)(rgb, "srgb.r"), (0, import_fn.get)(rgb, "srgb.g"), (0, import_fn.get)(rgb, "srgb.b")].map((n) => Math.round(n * 255)).join(", ");
 }
 function legacyWpAdminThemeOverridesCSS(accent) {
-  const parsedAccent = new import_colorjs.default(accent).to("hsl");
-  const hsl = parsedAccent.coords;
-  const darker10 = new import_colorjs.default("hsl", [
-    hsl[0],
-    // h
-    hsl[1],
-    // s
-    Math.max(0, Math.min(100, hsl[2] - 5))
-    // l (reduced by 5%)
-  ]).to("srgb");
-  const darker20 = new import_colorjs.default("hsl", [
-    hsl[0],
-    // h
-    hsl[1],
-    // s
-    Math.max(0, Math.min(100, hsl[2] - 10))
-    // l (reduced by 10%)
-  ]).to("srgb");
+  const parsedAccent = (0, import_fn.to)((0, import_fn.parse)(accent), import_fn.HSL);
+  const coords = parsedAccent.coords;
+  const darker10 = (0, import_fn.to)(
+    {
+      space: import_fn.HSL,
+      coords: [
+        coords[0],
+        // h
+        coords[1],
+        // s
+        Math.max(0, Math.min(100, coords[2] - 5))
+        // l (reduced by 5%)
+      ]
+    },
+    import_fn.sRGB
+  );
+  const darker20 = (0, import_fn.to)(
+    {
+      space: import_fn.HSL,
+      coords: [
+        coords[0],
+        // h
+        coords[1],
+        // s
+        Math.max(0, Math.min(100, coords[2] - 10))
+        // l (reduced by 10%)
+      ]
+    },
+    import_fn.sRGB
+  );
   return [
     [
       "--wp-admin-theme-color",
-      parsedAccent.to("srgb").toString({ format: "hex" })
+      (0, import_fn.serialize)((0, import_fn.to)(parsedAccent, import_fn.sRGB), { format: "hex" })
     ],
     ["--wp-admin-theme-color--rgb", customRgbFormat(parsedAccent)],
     [
       "--wp-admin-theme-color-darker-10",
-      darker10.toString({ format: "hex" })
+      (0, import_fn.serialize)(darker10, { format: "hex" })
     ],
     [
       "--wp-admin-theme-color-darker-10--rgb",
@@ -130,7 +147,7 @@ function legacyWpAdminThemeOverridesCSS(accent) {
     ],
     [
       "--wp-admin-theme-color-darker-20",
-      darker20.toString({ format: "hex" })
+      (0, import_fn.serialize)(darker20, { format: "hex" })
     ],
     [
       "--wp-admin-theme-color-darker-20--rgb",
@@ -138,23 +155,21 @@ function legacyWpAdminThemeOverridesCSS(accent) {
     ]
   ];
 }
-function semanticTokensCSS(filterFn = () => true) {
-  return Object.entries(import_design_tokens.default).filter(filterFn).map(([variableName, modesAndValues]) => [
-    variableName,
-    modesAndValues["."]
-  ]);
-}
-const toKebabCase = (str) => str.replace(
-  /[A-Z]+(?![a-z])|[A-Z]/g,
-  ($, ofs) => (ofs ? "-" : "") + $.toLowerCase()
-);
-function colorRampCSS(ramp, prefix) {
-  return [...Object.entries(ramp.ramp)].map(
-    ([tokenName, tokenValue]) => [
-      `${prefix}${toKebabCase(tokenName)}`,
-      tokenValue.color
-    ]
-  );
+function colorTokensCSS(computedColorRamps) {
+  const entries = [];
+  for (const [rampName, { ramp }] of computedColorRamps) {
+    for (const [tokenName, tokenValue] of Object.entries(ramp)) {
+      const key = `${rampName}-${tokenName}`;
+      const aliasedBy = import_color_tokens.default[key] ?? [];
+      for (const aliasedId of aliasedBy) {
+        entries.push([
+          `--wpds-color-${aliasedId}`,
+          tokenValue.color
+        ]);
+      }
+    }
+  }
+  return entries;
 }
 function generateStyles({
   primary,
@@ -162,15 +177,8 @@ function generateStyles({
 }) {
   return Object.fromEntries(
     [
-      // Primitive tokens
-      Array.from(computedColorRamps).map(([rampName, computedColorRamp]) => [
-        colorRampCSS(
-          computedColorRamp,
-          `--wpds-color-private-${rampName}-`
-        )
-      ]).flat(2),
-      // Semantic color tokens (other semantic tokens for now are static)
-      semanticTokensCSS(([key]) => /color/.test(key)),
+      // Semantic color tokens
+      colorTokensCSS(computedColorRamps),
       // Legacy overrides
       legacyWpAdminThemeOverridesCSS(primary),
       legacyWpComponentsOverridesCSS
@@ -199,17 +207,14 @@ function useThemeProviderStyles({
       primary
     };
     const computedColorRamps = /* @__PURE__ */ new Map();
-    const bgRamp = (0, import_color_ramps.buildBgRamp)({ seed: seeds.bg });
+    const bgRamp = getCachedBgRamp(seeds.bg);
     Object.entries(seeds).forEach(([rampName, seed]) => {
       if (rampName === "bg") {
         computedColorRamps.set(rampName, bgRamp);
       } else {
         computedColorRamps.set(
           rampName,
-          (0, import_color_ramps.buildAccentRamp)({
-            seed,
-            bgRamp
-          })
+          getCachedAccentRamp(seed, bgRamp)
         );
       }
     });

package/build/use-theme-provider-styles.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/use-theme-provider-styles.ts"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\nimport Color from 'colorjs.io';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ThemeContext } from './context';\nimport semanticVariables from './prebuilt/ts/design-tokens';\nimport {\n\tbuildBgRamp,\n\tbuildAccentRamp,\n\tDEFAULT_SEED_COLORS,\n\ttype RampResult,\n} from './color-ramps';\nimport type { ThemeProviderProps } from './types';\n\ntype Entry = [ string, string ];\n\nconst legacyWpComponentsOverridesCSS: Entry[] = [\n\t[ '--wp-components-color-accent', 'var(--wp-admin-theme-color)' ],\n\t[\n\t\t'--wp-components-color-accent-darker-10',\n\t\t'var(--wp-admin-theme-color-darker-10)',\n\t],\n\t[\n\t\t'--wp-components-color-accent-darker-20',\n\t\t'var(--wp-admin-theme-color-darker-20)',\n\t],\n\t[\n\t\t'--wp-components-color-accent-inverted',\n\t\t'var(--wpds-color-fg-interactive-brand-strong)',\n\t],\n\t[\n\t\t'--wp-components-color-background',\n\t\t'var(--wpds-color-bg-surface-neutral-strong)',\n\t],\n\t[\n\t\t'--wp-components-color-foreground',\n\t\t'var(--wpds-color-fg-content-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-foreground-inverted',\n\t\t'var(--wpds-color-bg-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-100',\n\t\t'var(--wpds-color-bg-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-200',\n\t\t'var(--wpds-color-stroke-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-300',\n\t\t'var(--wpds-color-stroke-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-400',\n\t\t'var(--wpds-color-stroke-interactive-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-600',\n\t\t'var(--wpds-color-stroke-interactive-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-700',\n\t\t'var(--wpds-color-fg-content-neutral-weak)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-800',\n\t\t'var(--wpds-color-fg-content-neutral)',\n\t],\n];\n\nfunction customRgbFormat( color: Color ) {\n\tconst rgb = color.to( 'srgb' );\n\treturn [ rgb.r, rgb.g, rgb.b ]\n\t\t.map( ( n ) => Math.round( n * 255 ) )\n\t\t.join( ', ' );\n}\n\nfunction legacyWpAdminThemeOverridesCSS( accent: string ): Entry[] {\n\tconst parsedAccent = new Color( accent ).to( 'hsl' );\n\n\tconst hsl = parsedAccent.coords;\n\tconst darker10 = new Color( 'hsl', [\n\t\thsl[ 0 ], // h\n\t\thsl[ 1 ], // s\n\t\tMath.max( 0, Math.min( 100, hsl[ 2 ] - 5 ) ), // l (reduced by 5%)\n\t] ).to( 'srgb' );\n\tconst darker20 = new Color( 'hsl', [\n\t\thsl[ 0 ], // h\n\t\thsl[ 1 ], // s\n\t\tMath.max( 0, Math.min( 100, hsl[ 2 ] - 10 ) ), // l (reduced by 10%)\n\t] ).to( 'srgb' );\n\n\treturn [\n\t\t[\n\t\t\t'--wp-admin-theme-color',\n\t\t\tparsedAccent.to( 'srgb' ).toString( { format: 'hex' } ),\n\t\t],\n\t\t[ '--wp-admin-theme-color--rgb', customRgbFormat( parsedAccent ) ],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-10',\n\t\t\tdarker10.toString( { format: 'hex' } ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-10--rgb',\n\t\t\tcustomRgbFormat( darker10 ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-20',\n\t\t\tdarker20.toString( { format: 'hex' } ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-20--rgb',\n\t\t\tcustomRgbFormat( darker20 ),\n\t\t],\n\t];\n}\n\nfunction semanticTokensCSS(\n\tfilterFn: ( entry: [ string, Record< string, string > ] ) => boolean = () =>\n\t\ttrue\n): Entry[] {\n\treturn Object.entries( semanticVariables )\n\t\t.filter( filterFn )\n\t\t.map( ( [ variableName, modesAndValues ] ) => [\n\t\t\tvariableName,\n\t\t\tmodesAndValues[ '.' ],\n\t\t] );\n}\n\nconst toKebabCase = ( str: string ) =>\n\tstr.replace(\n\t\t/[A-Z]+(?![a-z])|[A-Z]/g,\n\t\t( $, ofs ) => ( ofs ? '-' : '' ) + $.toLowerCase()\n\t);\n\nfunction colorRampCSS( ramp: RampResult, prefix: string ): Entry[] {\n\treturn [ ...Object.entries( ramp.ramp ) ].map(\n\t\t( [ tokenName, tokenValue ] ) => [\n\t\t\t`${ prefix }${ toKebabCase( tokenName ) }`,\n\t\t\ttokenValue.color,\n\t\t]\n\t);\n}\n\nfunction generateStyles( {\n\tprimary,\n\tcomputedColorRamps,\n}: {\n\tprimary: string;\n\tcomputedColorRamps: Map< string, RampResult >;\n} ): CSSProperties {\n\treturn Object.fromEntries(\n\t\t[\n\t\t\t// Primitive tokens\n\t\t\tArray.from( computedColorRamps )\n\t\t\t\t.map( ( [ rampName, computedColorRamp ] ) => [\n\t\t\t\t\tcolorRampCSS(\n\t\t\t\t\t\tcomputedColorRamp,\n\t\t\t\t\t\t`--wpds-color-private-${ rampName }-`\n\t\t\t\t\t),\n\t\t\t\t] )\n\t\t\t\t.flat( 2 ),\n\t\t\t// Semantic color tokens (other semantic tokens for now are static)\n\t\t\tsemanticTokensCSS( ( [ key ] ) => /color/.test( key ) ),\n\t\t\t// Legacy overrides\n\t\t\tlegacyWpAdminThemeOverridesCSS( primary ),\n\t\t\tlegacyWpComponentsOverridesCSS,\n\t\t].flat()\n\t);\n}\n\nexport function useThemeProviderStyles( {\n\tcolor = {},\n}: {\n\tcolor?: ThemeProviderProps[ 'color' ];\n} = {} ) {\n\tconst { resolvedSettings: inheritedSettings } = useContext( ThemeContext );\n\n\t// Compute settings:\n\t// - used provided prop value;\n\t// - otherwise, use inherited value from parent instance;\n\t// - otherwise, use fallback value (where applicable).\n\tconst primary =\n\t\tcolor.primary ??\n\t\tinheritedSettings.color?.primary ??\n\t\tDEFAULT_SEED_COLORS.primary;\n\tconst bg =\n\t\tcolor.bg ?? inheritedSettings.color?.bg ?? DEFAULT_SEED_COLORS.bg;\n\n\tconst resolvedSettings = useMemo(\n\t\t() => ( {\n\t\t\tcolor: {\n\t\t\t\tprimary,\n\t\t\t\tbg,\n\t\t\t},\n\t\t} ),\n\t\t[ primary, bg ]\n\t);\n\n\tconst themeProviderStyles = useMemo( () => {\n\t\t// Determine which seeds are needed for generating ramps.\n\t\tconst seeds = {\n\t\t\t...DEFAULT_SEED_COLORS,\n\t\t\tbg,\n\t\t\tprimary,\n\t\t};\n\n\t\t// Generate ramps.\n\t\tconst computedColorRamps = new Map< string, RampResult >();\n\t\tconst bgRamp = buildBgRamp( { seed: seeds.bg } );\n\t\tObject.entries( seeds ).forEach( ( [ rampName, seed ] ) => {\n\t\t\tif ( rampName === 'bg' ) {\n\t\t\t\tcomputedColorRamps.set( rampName, bgRamp );\n\t\t\t} else {\n\t\t\t\tcomputedColorRamps.set(\n\t\t\t\t\trampName,\n\t\t\t\t\tbuildAccentRamp( {\n\t\t\t\t\t\tseed,\n\t\t\t\t\t\tbgRamp,\n\t\t\t\t\t} )\n\t\t\t\t);\n\t\t\t}\n\t\t} );\n\n\t\treturn generateStyles( {\n\t\t\tprimary: seeds.primary,\n\t\t\tcomputedColorRamps,\n\t\t} );\n\t}, [ primary, bg ] );\n\n\treturn {\n\t\tresolvedSettings,\n\t\tthemeProviderStyles,\n\t};\n}\n"],
-  "mappings": "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",
-  "names": ["Color", "semanticVariables"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\nimport {\n\tparse,\n\tto,\n\tget,\n\tserialize,\n\tsRGB,\n\tHSL,\n\ttype ColorTypes,\n} from 'colorjs.io/fn';\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport './color-ramps/lib/register-color-spaces';\nimport { ThemeContext } from './context';\nimport colorTokens from './prebuilt/ts/color-tokens';\nimport {\n\tbuildBgRamp,\n\tbuildAccentRamp,\n\tDEFAULT_SEED_COLORS,\n\ttype RampResult,\n} from './color-ramps';\nimport type { ThemeProviderProps } from './types';\n\ntype Entry = [ string, string ];\n\nconst getCachedBgRamp = memoize( buildBgRamp, { maxSize: 10 } );\nconst getCachedAccentRamp = memoize( buildAccentRamp, { maxSize: 10 } );\n\nconst legacyWpComponentsOverridesCSS: Entry[] = [\n\t[ '--wp-components-color-accent', 'var(--wp-admin-theme-color)' ],\n\t[\n\t\t'--wp-components-color-accent-darker-10',\n\t\t'var(--wp-admin-theme-color-darker-10)',\n\t],\n\t[\n\t\t'--wp-components-color-accent-darker-20',\n\t\t'var(--wp-admin-theme-color-darker-20)',\n\t],\n\t[\n\t\t'--wp-components-color-accent-inverted',\n\t\t'var(--wpds-color-fg-interactive-brand-strong)',\n\t],\n\t[\n\t\t'--wp-components-color-background',\n\t\t'var(--wpds-color-bg-surface-neutral-strong)',\n\t],\n\t[\n\t\t'--wp-components-color-foreground',\n\t\t'var(--wpds-color-fg-content-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-foreground-inverted',\n\t\t'var(--wpds-color-bg-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-100',\n\t\t'var(--wpds-color-bg-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-200',\n\t\t'var(--wpds-color-stroke-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-300',\n\t\t'var(--wpds-color-stroke-surface-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-400',\n\t\t'var(--wpds-color-stroke-interactive-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-600',\n\t\t'var(--wpds-color-stroke-interactive-neutral)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-700',\n\t\t'var(--wpds-color-fg-content-neutral-weak)',\n\t],\n\t[\n\t\t'--wp-components-color-gray-800',\n\t\t'var(--wpds-color-fg-content-neutral)',\n\t],\n];\n\nfunction customRgbFormat( color: ColorTypes ) {\n\tconst rgb = to( color, sRGB );\n\treturn [ get( rgb, 'srgb.r' ), get( rgb, 'srgb.g' ), get( rgb, 'srgb.b' ) ]\n\t\t.map( ( n ) => Math.round( n * 255 ) )\n\t\t.join( ', ' );\n}\n\nfunction legacyWpAdminThemeOverridesCSS( accent: string ): Entry[] {\n\tconst parsedAccent = to( parse( accent ), HSL );\n\n\tconst coords = parsedAccent.coords;\n\tconst darker10 = to(\n\t\t{\n\t\t\tspace: HSL,\n\t\t\tcoords: [\n\t\t\t\tcoords[ 0 ], // h\n\t\t\t\tcoords[ 1 ], // s\n\t\t\t\tMath.max( 0, Math.min( 100, coords[ 2 ] - 5 ) ), // l (reduced by 5%)\n\t\t\t],\n\t\t},\n\t\tsRGB\n\t);\n\tconst darker20 = to(\n\t\t{\n\t\t\tspace: HSL,\n\t\t\tcoords: [\n\t\t\t\tcoords[ 0 ], // h\n\t\t\t\tcoords[ 1 ], // s\n\t\t\t\tMath.max( 0, Math.min( 100, coords[ 2 ] - 10 ) ), // l (reduced by 10%)\n\t\t\t],\n\t\t},\n\t\tsRGB\n\t);\n\n\treturn [\n\t\t[\n\t\t\t'--wp-admin-theme-color',\n\t\t\tserialize( to( parsedAccent, sRGB ), { format: 'hex' } ),\n\t\t],\n\t\t[ '--wp-admin-theme-color--rgb', customRgbFormat( parsedAccent ) ],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-10',\n\t\t\tserialize( darker10, { format: 'hex' } ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-10--rgb',\n\t\t\tcustomRgbFormat( darker10 ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-20',\n\t\t\tserialize( darker20, { format: 'hex' } ),\n\t\t],\n\t\t[\n\t\t\t'--wp-admin-theme-color-darker-20--rgb',\n\t\t\tcustomRgbFormat( darker20 ),\n\t\t],\n\t];\n}\n\nfunction colorTokensCSS(\n\tcomputedColorRamps: Map< string, RampResult >\n): Entry[] {\n\tconst entries: Entry[] = [];\n\n\tfor ( const [ rampName, { ramp } ] of computedColorRamps ) {\n\t\tfor ( const [ tokenName, tokenValue ] of Object.entries( ramp ) ) {\n\t\t\tconst key = `${ rampName }-${ tokenName }`;\n\t\t\tconst aliasedBy = colorTokens[ key ] ?? [];\n\t\t\tfor ( const aliasedId of aliasedBy ) {\n\t\t\t\tentries.push( [\n\t\t\t\t\t`--wpds-color-${ aliasedId }`,\n\t\t\t\t\ttokenValue.color,\n\t\t\t\t] );\n\t\t\t}\n\t\t}\n\t}\n\n\treturn entries;\n}\n\nfunction generateStyles( {\n\tprimary,\n\tcomputedColorRamps,\n}: {\n\tprimary: string;\n\tcomputedColorRamps: Map< string, RampResult >;\n} ): CSSProperties {\n\treturn Object.fromEntries(\n\t\t[\n\t\t\t// Semantic color tokens\n\t\t\tcolorTokensCSS( computedColorRamps ),\n\t\t\t// Legacy overrides\n\t\t\tlegacyWpAdminThemeOverridesCSS( primary ),\n\t\t\tlegacyWpComponentsOverridesCSS,\n\t\t].flat()\n\t);\n}\n\nexport function useThemeProviderStyles( {\n\tcolor = {},\n}: {\n\tcolor?: ThemeProviderProps[ 'color' ];\n} = {} ) {\n\tconst { resolvedSettings: inheritedSettings } = useContext( ThemeContext );\n\n\t// Compute settings:\n\t// - used provided prop value;\n\t// - otherwise, use inherited value from parent instance;\n\t// - otherwise, use fallback value (where applicable).\n\tconst primary =\n\t\tcolor.primary ??\n\t\tinheritedSettings.color?.primary ??\n\t\tDEFAULT_SEED_COLORS.primary;\n\tconst bg =\n\t\tcolor.bg ?? inheritedSettings.color?.bg ?? DEFAULT_SEED_COLORS.bg;\n\n\tconst resolvedSettings = useMemo(\n\t\t() => ( {\n\t\t\tcolor: {\n\t\t\t\tprimary,\n\t\t\t\tbg,\n\t\t\t},\n\t\t} ),\n\t\t[ primary, bg ]\n\t);\n\n\tconst themeProviderStyles = useMemo( () => {\n\t\t// Determine which seeds are needed for generating ramps.\n\t\tconst seeds = {\n\t\t\t...DEFAULT_SEED_COLORS,\n\t\t\tbg,\n\t\t\tprimary,\n\t\t};\n\n\t\t// Generate ramps.\n\t\tconst computedColorRamps = new Map< string, RampResult >();\n\t\tconst bgRamp = getCachedBgRamp( seeds.bg );\n\t\tObject.entries( seeds ).forEach( ( [ rampName, seed ] ) => {\n\t\t\tif ( rampName === 'bg' ) {\n\t\t\t\tcomputedColorRamps.set( rampName, bgRamp );\n\t\t\t} else {\n\t\t\t\tcomputedColorRamps.set(\n\t\t\t\t\trampName,\n\t\t\t\t\tgetCachedAccentRamp( seed, bgRamp )\n\t\t\t\t);\n\t\t\t}\n\t\t} );\n\n\t\treturn generateStyles( {\n\t\t\tprimary: seeds.primary,\n\t\t\tcomputedColorRamps,\n\t\t} );\n\t}, [ primary, bg ] );\n\n\treturn {\n\t\tresolvedSettings,\n\t\tthemeProviderStyles,\n\t};\n}\n"],
+  "mappings": "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",
+  "names": ["memoize", "colorTokens"]
 }