datocms-react-ui 2.1.4 → 3.0.1-alpha.0

package/dist/esm/SelectInput/index.js

@@ -25,19 +25,19 @@ import RawSelect from 'react-select';
 import RawAsyncSelect from 'react-select/async';
 import RawAsyncCreatableSelect from 'react-select/async-creatable';
 import RawCreatableSelect from 'react-select/creatable';
-var themeConfig = function (existing) { return (__assign(__assign({}, existing), { borderRadius: 0, colors: __assign(__assign({}, existing.colors), { primary25: 'var(--semi-transparent-accent-color)', 
+var themeConfig = function (existing) { return (__assign(__assign({}, existing), { borderRadius: 0, colors: __assign(__assign({}, existing.colors), { primary25: 'var(--color--surface-hover)', 
         // disabled
-        neutral10: 'var(--border-color)', 
+        neutral10: 'var(--color--border)', 
         // normal
-        neutral20: 'var(--border-color)', 
+        neutral20: 'var(--color--border)', 
         // focused
-        primary: 'var(--accent-color)', 
+        primary: 'var(--color--focus--border)', 
         // hover
-        neutral30: 'var(--darker-border-color)' }) })); };
+        neutral30: 'var(--color--border-hover)' }) })); };
 var useStyles = function (isDisabled, error) {
     return useMemo(function () {
         return {
-            placeholder: function (provided) { return (__assign(__assign({}, provided), { color: 'var(--placeholder-body-color)' })); },
+            placeholder: function (provided) { return (__assign(__assign({}, provided), { color: 'var(--color--ink-placeholder)' })); },
             container: function (provided) {
                 return __assign(__assign({}, provided), { fontSize: 'inherit' });
             },
@@ -46,32 +46,51 @@ var useStyles = function (isDisabled, error) {
                 var result = provided;
                 result = __assign(__assign({}, result), { minHeight: 40 });
                 if (isFocused) {
-                    return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', boxShadow: "0 0 0 3px ".concat(error
-                            ? 'rgba(var(--alert-color-rgb-components), 0.2)'
-                            : 'var(--semi-transparent-accent-color)'), '&:hover': {
-                            borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)',
+                    return __assign(__assign({}, result), { borderColor: error
+                            ? 'var(--color--feedback-fail--border)'
+                            : 'var(--color--focus--border)', backgroundColor: isDisabled
+                            ? 'var(--color--disabled--surface)'
+                            : 'var(--color--surface)', boxShadow: "0 0 0 3px ".concat(error
+                            ? 'var(--color--feedback-fail--outline)'
+                            : 'var(--color--focus--outline)'), '&:hover': {
+                            borderColor: error
+                                ? 'var(--color--feedback-fail--border)'
+                                : 'var(--color--focus--border)',
                         } });
                 }
-                return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--border-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', '&:hover': {
+                return __assign(__assign({}, result), { borderColor: error
+                        ? 'var(--color--feedback-fail--border)'
+                        : 'var(--color--border)', backgroundColor: isDisabled
+                        ? 'var(--color--disabled--surface)'
+                        : 'var(--color--surface)', '&:hover': {
                         borderColor: error
-                            ? 'var(--alert-color)'
-                            : 'var(--darker-border-color)',
+                            ? 'var(--color--feedback-fail--border)'
+                            : 'var(--color--border-hover)',
                     } });
             },
-            multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer' })); },
+            multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer', color: 'var(--color--tinted--ink)', ':hover': {
+                    backgroundColor: 'var(--color--tinted--surface-hover)',
+                    color: 'var(--color--tinted--ink)',
+                } })); },
             menu: function (provided) {
-                return __assign(__assign({}, provided), { zIndex: 1000, minWidth: 250 });
+                return __assign(__assign({}, provided), { zIndex: 1000, minWidth: 250, backgroundColor: 'var(--color--raised--surface)' });
             },
-            input: function (provided) {
-                var result = __assign(__assign({}, provided), { boxShadow: 'none', 'input:focus': {
-                        boxShadow: 'none',
-                    } });
-                return result;
+            singleValue: function (provided) { return (__assign(__assign({}, provided), { color: 'var(--color--ink)' })); },
+            input: function (provided) { return (__assign(__assign({}, provided), { color: 'var(--color--ink)', boxShadow: 'none', 'input:focus': {
+                    boxShadow: 'none',
+                } })); },
+            option: function (provided, _a) {
+                var isFocused = _a.isFocused, isSelected = _a.isSelected;
+                return (__assign(__assign({}, provided), { backgroundColor: isSelected
+                        ? 'var(--color--selected--surface)'
+                        : isFocused
+                            ? 'var(--color--surface-hover)'
+                            : undefined, color: 'var(--color--ink)' }));
             },
             multiValue: function (provided) {
-                return __assign(__assign({}, provided), { zIndex: 100, backgroundColor: 'var(--light-color)', userSelect: 'none' });
+                return __assign(__assign({}, provided), { zIndex: 100, backgroundColor: 'var(--color--tinted--surface)', userSelect: 'none' });
             },
-            multiValueLabel: function (provided) { return (__assign(__assign({}, provided), { fontSize: 'inherit', padding: 3 })); },
+            multiValueLabel: function (provided) { return (__assign(__assign({}, provided), { fontSize: 'inherit', padding: 3, color: 'var(--color--tinted--ink)' })); },
         };
     }, [isDisabled, error]);
 };

package/dist/esm/SelectInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}

package/dist/esm/SidebarPanel/index.d.ts

@@ -14,7 +14,7 @@ export declare type SidebarPanelProps = {
  *     <div
  *       style={{
  *         width: '300px',
- *         borderRight: '1px solid var(--border-color)',
+ *         borderRight: '1px solid var(--color--border)',
  *       }}
  *     >
  *       <SidebarPanel title="Default">Content</SidebarPanel>
@@ -31,7 +31,7 @@ export declare type SidebarPanelProps = {
  *         display: 'flex',
  *         justifyContent: 'center',
  *         alignItems: 'center',
- *         background: 'var(--light-bg-color)',
+ *         background: 'var(--color--surface-muted)',
  *       }}
  *     >
  *       Main content

package/dist/esm/SidebarPanel/index.js

@@ -1,14 +1,7 @@
 import classNames from 'classnames';
 import React, { useState } from 'react';
+import { CaretDownIcon, CaretUpIcon } from '../icons';
 import s from './styles.module.css.json';
-function ChevronDownIcon() {
-    return (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", width: "1em", height: "1em" },
-        React.createElement("path", { d: "M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z" })));
-}
-function ChevronUpIcon() {
-    return (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", width: "1em", height: "1em" },
-        React.createElement("path", { d: "M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z" })));
-}
 /**
  * @example Basic example
  *
@@ -18,7 +11,7 @@ function ChevronUpIcon() {
  *     <div
  *       style={{
  *         width: '300px',
- *         borderRight: '1px solid var(--border-color)',
+ *         borderRight: '1px solid var(--color--border)',
  *       }}
  *     >
  *       <SidebarPanel title="Default">Content</SidebarPanel>
@@ -35,7 +28,7 @@ function ChevronUpIcon() {
  *         display: 'flex',
  *         justifyContent: 'center',
  *         alignItems: 'center',
- *         background: 'var(--light-bg-color)',
+ *         background: 'var(--color--surface-muted)',
  *       }}
  *     >
  *       Main content
@@ -54,7 +47,7 @@ export function SidebarPanel(_a) {
     return (React.createElement("div", { className: s.SidebarPanel },
         title && (React.createElement("button", { type: "button", className: s.SidebarPanel__header, onClick: handleToggle },
             React.createElement("div", { className: s.SidebarPanel__header__title }, title),
-            React.createElement("div", { className: s.SidebarPanel__header__chevron }, open ? React.createElement(ChevronDownIcon, null) : React.createElement(ChevronUpIcon, null)))),
+            React.createElement("div", { className: s.SidebarPanel__header__chevron }, open ? React.createElement(CaretDownIcon, null) : React.createElement(CaretUpIcon, null)))),
         open && (React.createElement("div", { className: classNames(s.SidebarPanel__content, (_b = {},
                 _b[s['SidebarPanel__content--no-padding']] = noPadding,
                 _b)) }, children))));

package/dist/esm/SidebarPanel/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SidebarPanel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,EAAE,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAEzC,SAAS,eAAe;IACtB,OAAO,CACL,6BACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK;QAEZ,8BAAM,CAAC,EAAC,yRAAyR,GAAG,CAChS,CACP,CAAC;AACJ,CAAC;AAED,SAAS,aAAa;IACpB,OAAO,CACL,6BACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK;QAEZ,8BAAM,CAAC,EAAC,8RAA8R,GAAG,CACrS,CACP,CAAC;AACJ,CAAC;AASD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,UAAU,YAAY,CAAC,EAKT;;QAJlB,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,SAAS,eAAA;IAEH,IAAA,KAAkB,QAAQ,CAAC,SAAS,CAAC,EAApC,IAAI,QAAA,EAAE,OAAO,QAAuB,CAAC;IAE5C,IAAM,YAAY,GAAG;QACnB,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAE,CAAC,CAAC,YAAY;QAC3B,KAAK,IAAI,CACR,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAC,CAAC,oBAAoB,EACjC,OAAO,EAAE,YAAY;YAErB,6BAAK,SAAS,EAAE,CAAC,CAAC,2BAA2B,IAAG,KAAK,CAAO;YAC5D,6BAAK,SAAS,EAAE,CAAC,CAAC,6BAA6B,IAC5C,IAAI,CAAC,CAAC,CAAC,oBAAC,eAAe,OAAG,CAAC,CAAC,CAAC,oBAAC,aAAa,OAAG,CAC3C,CACC,CACV;QACA,IAAI,IAAI,CACP,6BACE,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,qBAAqB;gBAC3C,GAAC,CAAC,CAAC,mCAAmC,CAAC,IAAG,SAAS;oBACnD,IAED,QAAQ,CACL,CACP,CACG,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SidebarPanel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,EAAE,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,CAAC,MAAM,0BAA0B,CAAC;AASzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,UAAU,YAAY,CAAC,EAKT;;QAJlB,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,SAAS,eAAA;IAEH,IAAA,KAAkB,QAAQ,CAAC,SAAS,CAAC,EAApC,IAAI,QAAA,EAAE,OAAO,QAAuB,CAAC;IAE5C,IAAM,YAAY,GAAG;QACnB,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAE,CAAC,CAAC,YAAY;QAC3B,KAAK,IAAI,CACR,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAC,CAAC,oBAAoB,EACjC,OAAO,EAAE,YAAY;YAErB,6BAAK,SAAS,EAAE,CAAC,CAAC,2BAA2B,IAAG,KAAK,CAAO;YAC5D,6BAAK,SAAS,EAAE,CAAC,CAAC,6BAA6B,IAC5C,IAAI,CAAC,CAAC,CAAC,oBAAC,aAAa,OAAG,CAAC,CAAC,CAAC,oBAAC,WAAW,OAAG,CACvC,CACC,CACV;QACA,IAAI,IAAI,CACP,6BACE,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,qBAAqB;gBAC3C,GAAC,CAAC,CAAC,mCAAmC,CAAC,IAAG,SAAS;oBACnD,IAED,QAAQ,CACL,CACP,CACG,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/SidebarPanel/styles.module.css.json

@@ -1 +1 @@
-{ "SidebarPanel": "_SidebarPanel_4uwco_1", "SidebarPanel__header": "_SidebarPanel__header_4uwco_5", "SidebarPanel__header__title": "_SidebarPanel__header__title_4uwco_30", "SidebarPanel__header__chevron": "_SidebarPanel__header__chevron_4uwco_36", "SidebarPanel__content": "_SidebarPanel__content_4uwco_42", "SidebarPanel__content--no-padding": "_SidebarPanel__content--no-padding_4uwco_47" }
+{ "SidebarPanel": "_SidebarPanel_q32h5_1", "SidebarPanel__header": "_SidebarPanel__header_q32h5_5", "SidebarPanel__header__title": "_SidebarPanel__header__title_q32h5_30", "SidebarPanel__header__chevron": "_SidebarPanel__header__chevron_q32h5_36", "SidebarPanel__content": "_SidebarPanel__content_q32h5_42", "SidebarPanel__content--no-padding": "_SidebarPanel__content--no-padding_q32h5_47" }

package/dist/esm/Spinner/styles.module.css.json

@@ -1 +1 @@
-{ "Spinner--inline": "_Spinner--inline_oumod_1", "Spinner--centered": "_Spinner--centered_oumod_7", "Spinner__bar": "_Spinner__bar_oumod_13", "Spinner__spin": "_Spinner__spin_oumod_1" }
+{ "Spinner--inline": "_Spinner--inline_1u42l_1", "Spinner--centered": "_Spinner--centered_1u42l_7", "Spinner__bar": "_Spinner__bar_1u42l_13", "Spinner__spin": "_Spinner__spin_1u42l_1" }

package/dist/esm/SplitView/SplitViewSash/styles.module.css.json

@@ -1 +1 @@
-{ "SplitViewSash": "_SplitViewSash_tds51_1", "SplitViewSash--dragging": "_SplitViewSash--dragging_tds51_15", "SplitViewSash__content": "_SplitViewSash__content_tds51_19", "SplitViewSash--no-resize": "_SplitViewSash--no-resize_tds51_24", "SplitViewSash--vertical": "_SplitViewSash--vertical_tds51_28", "SplitViewSash--horizontal": "_SplitViewSash--horizontal_tds51_32", "SplitViewSash__content__button": "_SplitViewSash__content__button_tds51_46" }
+{ "SplitViewSash": "_SplitViewSash_5k1ng_1", "SplitViewSash--dragging": "_SplitViewSash--dragging_5k1ng_15", "SplitViewSash__content": "_SplitViewSash__content_5k1ng_19", "SplitViewSash--no-resize": "_SplitViewSash--no-resize_5k1ng_24", "SplitViewSash--vertical": "_SplitViewSash--vertical_5k1ng_28", "SplitViewSash--horizontal": "_SplitViewSash--horizontal_5k1ng_32", "SplitViewSash__content__button": "_SplitViewSash__content__button_5k1ng_46" }

package/dist/esm/SwitchField/styles.module.css.json

@@ -1 +1 @@
-{ "switchField__flex": "_switchField__flex_16z4j_1", "switchField__switchInput": "_switchField__switchInput_16z4j_6", "switchField__label": "_switchField__label_16z4j_10", "switchField__below": "_switchField__below_16z4j_22" }
+{ "switchField__flex": "_switchField__flex_ietsf_1", "switchField__switchInput": "_switchField__switchInput_ietsf_6", "switchField__label": "_switchField__label_ietsf_10", "switchField__below": "_switchField__below_ietsf_22" }

package/dist/esm/SwitchInput/styles.module.css.json

@@ -1 +1 @@
-{ "switchInput__inner": "_switchInput__inner_1knbg_1", "switchInput": "_switchInput_1knbg_1", "switchInput__off": "_switchInput__off_1knbg_1", "switchInput__on": "_switchInput__on_1knbg_1", "switchInput__checked": "_switchInput__checked_1knbg_47", "switchInput__disabled": "_switchInput__disabled_1knbg_60", "none": "_none_1knbg_1" }
+{ "switchInput__inner": "_switchInput__inner_190is_1", "switchInput": "_switchInput_190is_1", "switchInput__off": "_switchInput__off_190is_1", "switchInput__on": "_switchInput__on_190is_1", "switchInput__checked": "_switchInput__checked_190is_50", "switchInput__disabled": "_switchInput__disabled_190is_63", "none": "_none_190is_1" }

package/dist/esm/TextInput/styles.module.css.json

@@ -1 +1 @@
-{ "TextInput": "_TextInput_x2oj2_1", "TextInput--monospaced": "_TextInput--monospaced_x2oj2_30", "TextInput--disabled": "_TextInput--disabled_x2oj2_35", "TextInput--error": "_TextInput--error_x2oj2_41" }
+{ "TextInput": "_TextInput_it0d0_1", "TextInput--monospaced": "_TextInput--monospaced_it0d0_32", "TextInput--disabled": "_TextInput--disabled_it0d0_37", "TextInput--error": "_TextInput--error_it0d0_43" }

package/dist/esm/TextareaInput/styles.module.css.json

@@ -1 +1 @@
-{ "TextareaInput": "_TextareaInput_1wnu9_1", "TextareaInput--monospaced": "_TextareaInput--monospaced_1wnu9_30", "TextareaInput--disabled": "_TextareaInput--disabled_1wnu9_35", "TextareaInput--error": "_TextareaInput--error_1wnu9_41" }
+{ "TextareaInput": "_TextareaInput_3v51p_1", "TextareaInput--monospaced": "_TextareaInput--monospaced_3v51p_32", "TextareaInput--disabled": "_TextareaInput--disabled_3v51p_37", "TextareaInput--error": "_TextareaInput--error_3v51p_43" }

package/dist/esm/Toolbar/Button/styles.module.css.json

@@ -1 +1 @@
-{ "Button": "_Button_fy6g6_1" }
+{ "Button": "_Button_36kvr_1" }

package/dist/esm/Toolbar/Toolbar/index.d.ts

@@ -19,7 +19,7 @@ export declare type ToolbarProps = {
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >
@@ -50,7 +50,7 @@ export declare type ToolbarProps = {
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >
@@ -79,7 +79,7 @@ export declare type ToolbarProps = {
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >

package/dist/esm/Toolbar/Toolbar/index.js

@@ -16,7 +16,7 @@ import s from './styles.module.css.json';
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >
@@ -47,7 +47,7 @@ import s from './styles.module.css.json';
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >
@@ -76,7 +76,7 @@ import s from './styles.module.css.json';
  *       display: 'flex',
  *       justifyContent: 'center',
  *       alignItems: 'center',
- *       background: 'var(--light-bg-color)',
+ *       background: 'var(--color--surface-muted)',
  *       height: '150px',
  *     }}
  *   >

package/dist/esm/Toolbar/Toolbar/styles.module.css.json

@@ -1 +1 @@
-{ "Toolbar": "_Toolbar_1cwb8_1" }
+{ "Toolbar": "_Toolbar_50246_1" }

package/dist/esm/Tooltip/TooltipContent/styles.module.css.json

@@ -1 +1 @@
-{ "tooltip": "_tooltip_3z5rn_1" }
+{ "tooltip": "_tooltip_m9vka_1" }

package/dist/esm/Tooltip/TooltipDelayGroup/index.d.ts

@@ -87,8 +87,8 @@ export declare type TooltipDelayGroupProps = {
  *       display: 'flex',
  *       gap: 'var(--spacing-xs)',
  *       padding: 'var(--spacing-s)',
- *       borderRadius: 'var(--border-radius-m)',
- *       backgroundColor: 'var(--light-bg-color)'
+ *       borderRadius: '4px',
+ *       backgroundColor: 'var(--color--surface-muted)'
  *     }}>
  *       <Tooltip>
  *         <TooltipTrigger>

package/dist/esm/Tooltip/TooltipDelayGroup/index.js

@@ -78,8 +78,8 @@ import * as React from 'react';
  *       display: 'flex',
  *       gap: 'var(--spacing-xs)',
  *       padding: 'var(--spacing-s)',
- *       borderRadius: 'var(--border-radius-m)',
- *       backgroundColor: 'var(--light-bg-color)'
+ *       borderRadius: '4px',
+ *       backgroundColor: 'var(--color--surface-muted)'
  *     }}>
  *       <Tooltip>
  *         <TooltipTrigger>

package/dist/esm/VerticalSplit/index.d.ts

@@ -36,7 +36,7 @@ export declare type VerticalSplitProps = {
  *           Main content
  *         </div>
  *       </div>
- *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--border-color)' }}>
+ *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--color--border)' }}>
  *         <Toolbar>
  *           <ToolbarStack stackSize="l">
  *             <ToolbarTitle>Secondary</ToolbarTitle>
@@ -83,7 +83,7 @@ export declare type VerticalSplitProps = {
  *           Sidebar
  *         </div>
  *       </div>
- *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--border-color)' }}>
+ *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--color--border)' }}>
  *         <Toolbar>
  *           <ToolbarStack stackSize="l">
  *             <ToolbarTitle>Primary</ToolbarTitle>
@@ -143,7 +143,7 @@ export declare type VerticalSplitProps = {
  *                display: 'flex',
  *                flexDirection: 'column',
  *                height: '100%',
- *                borderLeft: '1px solid var(--border-color)',
+ *                borderLeft: '1px solid var(--color--border)',
  *              }}
  *            >
  *              <Toolbar>
@@ -208,7 +208,7 @@ export declare type VerticalSplitProps = {
  *                display: 'flex',
  *                flexDirection: 'column',
  *                height: '100%',
- *                borderLeft: '1px solid var(--border-color)',
+ *                borderLeft: '1px solid var(--color--border)',
  *              }}
  *            >
  *              <Toolbar>

package/dist/esm/VerticalSplit/index.js

@@ -47,7 +47,7 @@ function calculateSizes(_a) {
  *           Main content
  *         </div>
  *       </div>
- *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--border-color)' }}>
+ *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--color--border)' }}>
  *         <Toolbar>
  *           <ToolbarStack stackSize="l">
  *             <ToolbarTitle>Secondary</ToolbarTitle>
@@ -94,7 +94,7 @@ function calculateSizes(_a) {
  *           Sidebar
  *         </div>
  *       </div>
- *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--border-color)' }}>
+ *       <div style={{ display: 'flex', flexDirection: 'column', height: '100%', borderLeft: '1px solid var(--color--border)' }}>
  *         <Toolbar>
  *           <ToolbarStack stackSize="l">
  *             <ToolbarTitle>Primary</ToolbarTitle>
@@ -154,7 +154,7 @@ function calculateSizes(_a) {
  *                display: 'flex',
  *                flexDirection: 'column',
  *                height: '100%',
- *                borderLeft: '1px solid var(--border-color)',
+ *                borderLeft: '1px solid var(--color--border)',
  *              }}
  *            >
  *              <Toolbar>
@@ -219,7 +219,7 @@ function calculateSizes(_a) {
  *                display: 'flex',
  *                flexDirection: 'column',
  *                height: '100%',
- *                borderLeft: '1px solid var(--border-color)',
+ *                borderLeft: '1px solid var(--color--border)',
  *              }}
  *            >
  *              <Toolbar>

package/dist/esm/VerticalSplit/styles.module.css.json

@@ -1 +1 @@
-{ "VerticalSplitPane__expand": "_VerticalSplitPane__expand_80tii_1", "VerticalSplitPane__expand--left": "_VerticalSplitPane__expand--left_80tii_22", "VerticalSplitPane__expand--right": "_VerticalSplitPane__expand--right_80tii_25", "VerticalSplitPaneOverlay": "_VerticalSplitPaneOverlay_80tii_42", "VerticalSplitPaneOverlay__primary": "_VerticalSplitPaneOverlay__primary_80tii_58", "VerticalSplitPaneOverlay__primary--left": "_VerticalSplitPaneOverlay__primary--left_80tii_67", "VerticalSplitPaneOverlay__primary--right": "_VerticalSplitPaneOverlay__primary--right_80tii_71", "VerticalSplitPaneOverlay__secondary": "_VerticalSplitPaneOverlay__secondary_80tii_75", "VerticalSplitPaneOverlay__secondary--left": "_VerticalSplitPaneOverlay__secondary--left_80tii_83", "VerticalSplitPaneOverlay__secondary--right": "_VerticalSplitPaneOverlay__secondary--right_80tii_87", "VerticalSplitPaneOverlay__sash": "_VerticalSplitPaneOverlay__sash_80tii_91" }
+{ "VerticalSplitPane__expand": "_VerticalSplitPane__expand_1j6ko_1", "VerticalSplitPane__expand--left": "_VerticalSplitPane__expand--left_1j6ko_22", "VerticalSplitPane__expand--right": "_VerticalSplitPane__expand--right_1j6ko_25", "VerticalSplitPaneOverlay": "_VerticalSplitPaneOverlay_1j6ko_42", "VerticalSplitPaneOverlay__primary": "_VerticalSplitPaneOverlay__primary_1j6ko_54", "VerticalSplitPaneOverlay__primary--left": "_VerticalSplitPaneOverlay__primary--left_1j6ko_63", "VerticalSplitPaneOverlay__primary--right": "_VerticalSplitPaneOverlay__primary--right_1j6ko_67", "VerticalSplitPaneOverlay__secondary": "_VerticalSplitPaneOverlay__secondary_1j6ko_71", "VerticalSplitPaneOverlay__secondary--left": "_VerticalSplitPaneOverlay__secondary--left_1j6ko_79", "VerticalSplitPaneOverlay__secondary--right": "_VerticalSplitPaneOverlay__secondary--right_1j6ko_83", "VerticalSplitPaneOverlay__sash": "_VerticalSplitPaneOverlay__sash_1j6ko_87" }

package/dist/esm/generateStyleFromCtx/index.js

@@ -15,9 +15,131 @@ function camelToDash(str) {
     }
     return str.replace(/[A-Z]/g, function (m) { return "-".concat(m.toLowerCase()); });
 }
+/**
+ * Maps camelCase semantic token keys to their CSS custom property names
+ * (without the `--` prefix). The CSS names preserve the double-dash
+ * namespace separators used by the host application.
+ */
+var semanticTokenCssNames = {
+    /* --- Standalone --- */
+    colorSurface: 'color--surface',
+    colorSurfaceHover: 'color--surface-hover',
+    colorSurfaceMuted: 'color--surface-muted',
+    colorInk: 'color--ink',
+    colorInkSubtle: 'color--ink-subtle',
+    colorInkHover: 'color--ink-hover',
+    colorInkMuted: 'color--ink-muted',
+    colorInkPlaceholder: 'color--ink-placeholder',
+    colorInkPrimary: 'color--ink-primary',
+    colorInkAccent: 'color--ink-accent',
+    colorInkDisabled: 'color--ink-disabled',
+    colorBorder: 'color--border',
+    colorBorderHover: 'color--border-hover',
+    /* --- Context: raised --- */
+    colorRaisedSurface: 'color--raised--surface',
+    colorRaisedSurfaceHover: 'color--raised--surface-hover',
+    colorRaisedSurfaceActive: 'color--raised--surface-active',
+    /* --- Context: primary --- */
+    colorPrimarySurface: 'color--primary--surface',
+    colorPrimarySurfaceHover: 'color--primary--surface-hover',
+    colorPrimarySurfaceActive: 'color--primary--surface-active',
+    colorPrimarySurfaceMuted: 'color--primary--surface-muted',
+    colorPrimaryInk: 'color--primary--ink',
+    colorPrimaryBorder: 'color--primary--border',
+    /* --- Context: tinted --- */
+    colorTintedSurface: 'color--tinted--surface',
+    colorTintedSurfaceHover: 'color--tinted--surface-hover',
+    colorTintedSurfaceActive: 'color--tinted--surface-active',
+    colorTintedInk: 'color--tinted--ink',
+    /* --- Context: accent --- */
+    colorAccentSurface: 'color--accent--surface',
+    colorAccentInk: 'color--accent--ink',
+    /* --- Context: selected --- */
+    colorSelectedSurface: 'color--selected--surface',
+    colorSelectedInk: 'color--selected--ink',
+    colorSelectedBorder: 'color--selected--border',
+    /* --- Context: disabled --- */
+    colorDisabledSurface: 'color--disabled--surface',
+    colorDisabledInk: 'color--disabled--ink',
+    /* --- Context: danger --- */
+    colorDangerSurface: 'color--danger--surface',
+    colorDangerInk: 'color--danger--ink',
+    /* --- Context: enterprise --- */
+    colorEnterpriseSurface: 'color--enterprise--surface',
+    /* --- Context: focus --- */
+    colorFocusBorder: 'color--focus--border',
+    colorFocusOutline: 'color--focus--outline',
+    /* --- Feedback --- */
+    colorFeedbackFailInk: 'color--feedback-fail--ink',
+    colorFeedbackFailBorder: 'color--feedback-fail--border',
+    colorFeedbackFailOutline: 'color--feedback-fail--outline',
+    colorFeedbackWarningInk: 'color--feedback-warning--ink',
+    colorFeedbackWarningSurface: 'color--feedback-warning--surface',
+    colorFeedbackSuccessInk: 'color--feedback-success--ink',
+    colorFeedbackWarningBorder: 'color--feedback-warning--border',
+    colorFeedbackSuccessBorder: 'color--feedback-success--border',
+    /* --- Context: highlight --- */
+    colorHighlightSurface: 'color--highlight--surface',
+    /* --- Diffs --- */
+    colorDiffAddedSurface: 'color--diff-added--surface',
+    colorDiffRemovedSurface: 'color--diff-removed--surface',
+    colorDiffChangedSurface: 'color--diff-changed--surface',
+    colorDiffAddedSurfaceSubtle: 'color--diff-added--surface-subtle',
+    colorDiffRemovedSurfaceSubtle: 'color--diff-removed--surface-subtle',
+    colorDiffChangedSurfaceSubtle: 'color--diff-changed--surface-subtle',
+    colorDiffAddedOutlineSubtle: 'color--diff-added--outline-subtle',
+    colorDiffRemovedOutlineSubtle: 'color--diff-removed--outline-subtle',
+    colorDiffChangedOutlineSubtle: 'color--diff-changed--outline-subtle',
+    colorDiffChangedBorder: 'color--diff-changed--border',
+    colorDiffChangedBorderNegative: 'color--diff-changed--border-negative',
+    /* --- Status --- */
+    colorStatusDraftInk: 'color--status-draft--ink',
+    colorStatusOutdatedInk: 'color--status-outdated--ink',
+    colorStatusPublishedInk: 'color--status-published--ink',
+    /* --- Backdrop --- */
+    colorBackdropSurface: 'color--backdrop--surface',
+    colorBackdropInk: 'color--backdrop--ink',
+    /* --- Overlay --- */
+    colorOverlaySurface: 'color--overlay--surface',
+    colorOverlaySurfaceSubtle: 'color--overlay--surface-subtle',
+    colorOverlayInk: 'color--overlay--ink',
+    /* --- Stacked --- */
+    colorStackedSurfaceBase: 'color--stacked--surface-base',
+    colorStackedSurface: 'color--stacked--surface',
+    colorStackedSurfaceRaised: 'color--stacked--surface-raised',
+    colorStackedInk: 'color--stacked--ink',
+    colorStackedInkSubtle: 'color--stacked--ink-subtle',
+    colorStackedBorder: 'color--stacked--border',
+    colorStackedSurfaceHover: 'color--stacked--surface-hover',
+    colorStackedSurfaceTranslucent: 'color--stacked--surface-translucent',
+    colorStackedSurfaceButton: 'color--stacked--surface-button',
+    colorStackedSurfaceButtonActive: 'color--stacked--surface-button-active',
+    /* --- Progress --- */
+    colorProgressTrack: 'color--progress--track',
+    colorProgressFill: 'color--progress--fill',
+    colorProgressFillHover: 'color--progress--fill-hover',
+    /* --- Tooltip --- */
+    colorTooltipSurface: 'color--tooltip--surface',
+    colorTooltipSurfaceHover: 'color--tooltip--surface-hover',
+    colorTooltipInk: 'color--tooltip--ink',
+    colorTooltipInkSubtle: 'color--tooltip--ink-subtle',
+    /* --- Code --- */
+    colorCodeSurface: 'color--code--surface',
+    colorCodeInk: 'color--code--ink',
+    /* --- Shadows --- */
+    colorShadowSubtle: 'color--shadow-subtle',
+    colorShadow: 'color--shadow',
+    colorShadowStrong: 'color--shadow-strong',
+    /* --- Scrollbar --- */
+    colorScrollbar: 'color--scrollbar',
+    /* --- Shadow composites --- */
+    shadowElevated: 'shadow--elevated',
+    shadowFloat: 'shadow--float',
+    shadowAmbient: 'shadow--ambient',
+};
 export function generateStyleFromCtx(ctx, noBodyPadding) {
     if (noBodyPadding === void 0) { noBodyPadding = false; }
-    return __assign({ padding: noBodyPadding
+    return __assign(__assign({ padding: noBodyPadding
             ? undefined
             : ctx.bodyPadding.map(function (p) { return "".concat(p, "px"); }).join(' ') }, Object.fromEntries(Object.entries(ctx.theme).flatMap(function (_a) {
         var _b;
@@ -29,6 +151,15 @@ export function generateStyleFromCtx(ctx, noBodyPadding) {
                 ((_b = v.match(/rgb\((\d+, \d+, \d+)\)/)) === null || _b === void 0 ? void 0 : _b[1]) || undefined,
             ],
         ];
-    })));
+    }))), (ctx.semanticColorTokensTheme
+        ? Object.fromEntries(Object.entries(ctx.semanticColorTokensTheme).map(function (_a) {
+            var _b;
+            var k = _a[0], v = _a[1];
+            return [
+                "--".concat((_b = semanticTokenCssNames[k]) !== null && _b !== void 0 ? _b : camelToDash(k)),
+                v,
+            ];
+        }))
+        : undefined));
 }
 //# sourceMappingURL=index.js.map

package/dist/esm/generateStyleFromCtx/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/generateStyleFromCtx/index.ts"],"names":[],"mappings":";;;;;;;;;;;AAGA,SAAS,WAAW,CAAC,GAAW;IAC9B,IAAI,GAAG,KAAK,GAAG,CAAC,WAAW,EAAE,EAAE;QAC7B,OAAO,GAAG,CAAC;KACZ;IACD,OAAO,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,WAAI,CAAC,CAAC,WAAW,EAAE,CAAE,EAArB,CAAqB,CAAC,CAAC;AAC7D,CAAC;AAED,MAAM,UAAU,oBAAoB,CAClC,GAAY,EACZ,aAAqB;IAArB,8BAAA,EAAA,qBAAqB;IAErB,kBACE,OAAO,EAAE,aAAa;YACpB,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,UAAC,CAAC,IAAK,OAAA,UAAG,CAAC,OAAI,EAAR,CAAQ,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAC/C,MAAM,CAAC,WAAW,CACnB,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,EAAM;;YAAL,CAAC,QAAA,EAAE,CAAC,QAAA;QAAM,OAAA;YAC5C,CAAC,YAAK,WAAW,CAAC,CAAC,CAAC,CAAE,EAAE,CAAC,CAAC;YAC1B;gBACE,YAAK,WAAW,CAAC,UAAG,CAAC,kBAAe,CAAC,CAAE;gBACvC,CAAA,MAAA,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,0CAAG,CAAC,CAAC,KAAI,SAAS;aACpD;SACF,CAAA;KAAA,CAAC,CACH,EACD;AACJ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/generateStyleFromCtx/index.ts"],"names":[],"mappings":"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"}