@workday/canvas-kit-preview-react 15.0.0-alpha.1326-next.0 → 15.0.1

package/dist/commonjs/status-indicator/lib/StatusIndicatorIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicatorIcon.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAE3E,MAAM,WAAW,wBAAyB,SAAQ,eAAe;CAAG;AAEpE,eAAO,MAAM,mBAAmB,sFAK9B,CAAC"}
+{"version":3,"file":"StatusIndicatorIcon.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAE3E,MAAM,WAAW,wBAAyB,SAAQ,eAAe;CAAG;AAEpE,eAAO,MAAM,mBAAmB,sFAS9B,CAAC"}

package/dist/commonjs/status-indicator/lib/StatusIndicatorIcon.js

@@ -7,6 +7,10 @@ const icon_1 = require("@workday/canvas-kit-react/icon");
 exports.StatusIndicatorIcon = (0, common_1.createComponent)('span')({
     displayName: 'StatusIndicatorIcon',
     Component: (elemProps, ref, Element) => {
+        var _a;
+        if (!((_a = elemProps.icon) === null || _a === void 0 ? void 0 : _a.type)) {
+            return null;
+        }
         return (0, jsx_runtime_1.jsx)(icon_1.SystemIcon, { as: Element, ref: ref, size: 20, role: "img", ...elemProps });
     },
 });

package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicatorLabel.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorLabel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAc,MAAM,gCAAgC,CAAC;AAKtE,MAAM,WAAW,yBAA0B,SAAQ,SAAS;CAAG;AAe/D,eAAO,MAAM,oBAAoB,gGAS/B,CAAC"}
+{"version":3,"file":"StatusIndicatorLabel.d.ts","sourceRoot":"","sources":["../../../../status-indicator/lib/StatusIndicatorLabel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,SAAS,EAAc,MAAM,gCAAgC,CAAC;AAItE,MAAM,WAAW,yBAA0B,SAAQ,SAAS;CAAG;AAe/D,eAAO,MAAM,oBAAoB,gGAS/B,CAAC"}

package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.js

@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.StatusIndicatorLabel = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
 const text_1 = require("@workday/canvas-kit-react/text");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
-const layout_1 = require("@workday/canvas-kit-react/layout");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const statusIndicatorLabelStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: text_1.textStencil,
-    base: { name: "2042fs", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:capitalize;color:inherit;" },
+    base: { name: "3skb1a", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:capitalize;color:inherit;" },
     defaultModifiers: { typeLevel: 'subtext.large' }
 }, "status-indicator-label-63258e");
 exports.StatusIndicatorLabel = (0, common_1.createComponent)('span')({

package/dist/commonjs/switch/index.d.ts

@@ -0,0 +1,7 @@
+export * from './lib/Switch';
+export * from './lib/SwitchBackground';
+export * from './lib/SwitchCircle';
+export * from './lib/SwitchContainer';
+export * from './lib/SwitchIcon';
+export * from './lib/SwitchInput';
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC"}

package/dist/commonjs/{avatar → switch}/index.js

@@ -14,8 +14,9 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./lib/Avatar"), exports);
-__exportStar(require("./lib/AvatarImage"), exports);
-__exportStar(require("./lib/AvatarName"), exports);
-__exportStar(require("./lib/BaseAvatar"), exports);
-__exportStar(require("./lib/getInitialsFromName"), exports);
+__exportStar(require("./lib/Switch"), exports);
+__exportStar(require("./lib/SwitchBackground"), exports);
+__exportStar(require("./lib/SwitchCircle"), exports);
+__exportStar(require("./lib/SwitchContainer"), exports);
+__exportStar(require("./lib/SwitchIcon"), exports);
+__exportStar(require("./lib/SwitchInput"), exports);

package/dist/commonjs/switch/lib/Switch.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { ErrorType } from '@workday/canvas-kit-react/common';
+import { CSProps } from '@workday/canvas-kit-styling';
+export interface SwitchProps extends CSProps {
+    /**
+     * If true, set the Switch to the on state.
+     * @default false
+     */
+    checked?: boolean;
+    /**
+     * If true, set the Switch to the disabled state.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The HTML `id` of the underlying checkbox input element.
+     * @default A uniquely generated id
+     */
+    id?: string;
+    /**
+     * The function called when the Switch state changes.
+     */
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * The value of the Switch.
+     */
+    value?: string;
+    /**
+     * The type of error associated with the Switch (if applicable).
+     */
+    error?: ErrorType;
+}
+export declare const Switch: import("@workday/canvas-kit-react/common").ElementComponent<"input", SwitchProps> & {
+    ErrorType: typeof ErrorType;
+};
+//# sourceMappingURL=Switch.d.ts.map

package/dist/commonjs/switch/lib/Switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../../switch/lib/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAA+B,MAAM,kCAAkC,CAAC;AACzF,OAAO,EAAC,OAAO,EAAC,MAAM,6BAA6B,CAAC;AAQpD,MAAM,WAAW,WAAY,SAAQ,OAAO;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,eAAO,MAAM,MAAM;;CAgCjB,CAAC"}

package/dist/commonjs/switch/lib/Switch.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Switch = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const SwitchBackground_1 = require("./SwitchBackground");
+const SwitchCircle_1 = require("./SwitchCircle");
+const SwitchContainer_1 = require("./SwitchContainer");
+const SwitchIcon_1 = require("./SwitchIcon");
+const SwitchInput_1 = require("./SwitchInput");
+exports.Switch = (0, common_1.createComponent)('input')({
+    displayName: 'Switch',
+    Component: ({ checked = false, id, disabled = false, onChange, value, ...elemProps }, ref, Element) => {
+        const inputId = (0, common_1.useUniqueId)(id);
+        return ((0, jsx_runtime_1.jsxs)(SwitchContainer_1.SwitchContainer, { children: [(0, jsx_runtime_1.jsx)(SwitchInput_1.SwitchInput, { as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, onChange: onChange, role: "switch", type: "checkbox", value: value, ...elemProps }), (0, jsx_runtime_1.jsxs)(SwitchBackground_1.SwitchBackground, { children: [(0, jsx_runtime_1.jsx)(SwitchCircle_1.SwitchCircle, { checked: checked }), (0, jsx_runtime_1.jsx)(SwitchIcon_1.SwitchIcon, { checked: checked })] })] }));
+    },
+    subComponents: {
+        ErrorType: common_1.ErrorType,
+    },
+});

package/dist/commonjs/switch/lib/SwitchBackground.d.ts

@@ -0,0 +1,3 @@
+export declare const switchBackgroundStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, never, never>;
+export declare const SwitchBackground: import("@workday/canvas-kit-react/common").ElementComponent<"div", unknown>;
+//# sourceMappingURL=SwitchBackground.d.ts.map

package/dist/commonjs/switch/lib/SwitchBackground.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchBackground.d.ts","sourceRoot":"","sources":["../../../../switch/lib/SwitchBackground.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,uBAAuB,iJAiBlC,CAAC;AAEH,eAAO,MAAM,gBAAgB,6EAS3B,CAAC"}

package/dist/commonjs/switch/lib/SwitchBackground.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwitchBackground = exports.switchBackgroundStencil = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+exports.switchBackgroundStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "340noe", styles: "box-sizing:border-box;position:absolute;display:flex;align-items:center;pointer-events:none;border:0.0625rem solid transparent;height:var(--cnvs-base-size-225, 1.125rem);width:2.125rem;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));padding:0 0.125rem;transition:background-color 200ms ease;background-color:var(--cnvs-sys-color-accent-muted-soft, var(--cnvs-sys-color-bg-muted-softer, oklch(0.754 0.0181 256.33 / 1)));" }
+}, "switch-background-71891f");
+exports.SwitchBackground = (0, common_1.createComponent)('div')({
+    displayName: 'SwitchBackground',
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.switchBackgroundStencil)()), children: children }));
+    },
+});

package/dist/commonjs/switch/lib/SwitchCircle.d.ts

@@ -0,0 +1,13 @@
+import { SwitchProps } from './Switch';
+export declare const switchCircleStencil: import("@workday/canvas-kit-styling").Stencil<{
+    checked: {
+        true: {
+            transform: string;
+            ':dir(rtl)': {
+                transform: string;
+            };
+        };
+    };
+}, {}, {}, never, never>;
+export declare const SwitchCircle: import("@workday/canvas-kit-react/common").ElementComponent<"div", SwitchProps>;
+//# sourceMappingURL=SwitchCircle.d.ts.map

package/dist/commonjs/switch/lib/SwitchCircle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchCircle.d.ts","sourceRoot":"","sources":["../../../../switch/lib/SwitchCircle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,eAAO,MAAM,mBAAmB;;;;;;;;;wBAuB9B,CAAC;AAEH,eAAO,MAAM,YAAY,iFAKvB,CAAC"}

package/dist/commonjs/switch/lib/SwitchCircle.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwitchCircle = exports.switchCircleStencil = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+exports.switchCircleStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "25zgn5", styles: "box-sizing:border-box;width:var(--cnvs-base-size-150, 0.75rem);height:var(--cnvs-base-size-150, 0.75rem);border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));border:0.0625rem solid transparent;box-shadow:var(--cnvs-sys-depth-1);transition:transform 150ms ease;pointer-events:none;background-color:var(--cnvs-sys-color-fg-inverse);transform:translateX(0);" },
+    modifiers: {
+        checked: {
+            true: { name: "276nms", styles: "transform:translateX(1rem);:dir(rtl){transform:translateX(-1rem);}" }
+        }
+    }
+}, "switch-circle-1553b5");
+exports.SwitchCircle = (0, common_1.createComponent)('div')({
+    displayName: 'SwitchCircle',
+    Component: ({ checked, ...elemProps }, ref, Element) => {
+        return (0, jsx_runtime_1.jsx)(Element, { ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.switchCircleStencil)({ checked })) });
+    },
+});

package/dist/commonjs/switch/lib/SwitchContainer.d.ts

@@ -0,0 +1,3 @@
+export declare const switchContainerStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, never, never>;
+export declare const SwitchContainer: import("@workday/canvas-kit-react/common").ElementComponent<"div", unknown>;
+//# sourceMappingURL=SwitchContainer.d.ts.map

package/dist/commonjs/switch/lib/SwitchContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchContainer.d.ts","sourceRoot":"","sources":["../../../../switch/lib/SwitchContainer.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,sBAAsB,iJASjC,CAAC;AAEH,eAAO,MAAM,eAAe,6EAS1B,CAAC"}

package/dist/commonjs/switch/lib/SwitchContainer.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwitchContainer = exports.switchContainerStencil = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+exports.switchContainerStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "47s8v3", styles: "box-sizing:border-box;position:relative;margin-top:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));height:var(--cnvs-base-size-225, 1.125rem);width:2.125rem;" }
+}, "switch-container-0724f3");
+exports.SwitchContainer = (0, common_1.createComponent)('div')({
+    displayName: 'SwitchContainer',
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.switchContainerStencil)()), children: children }));
+    },
+});

package/dist/commonjs/switch/lib/SwitchIcon.d.ts

@@ -0,0 +1,13 @@
+import { SwitchProps } from './Switch';
+export declare const switchIconStencil: import("@workday/canvas-kit-styling").Stencil<{
+    checked: {
+        true: {
+            transform: string;
+            ':dir(rtl)': {
+                transform: string;
+            };
+        };
+    };
+}, {}, {}, never, never>;
+export declare const SwitchIcon: import("@workday/canvas-kit-react/common").ElementComponent<"div", SwitchProps>;
+//# sourceMappingURL=SwitchIcon.d.ts.map

package/dist/commonjs/switch/lib/SwitchIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchIcon.d.ts","sourceRoot":"","sources":["../../../../switch/lib/SwitchIcon.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,eAAO,MAAM,iBAAiB;;;;;;;;;wBAsB5B,CAAC;AAEH,eAAO,MAAM,UAAU,iFAWrB,CAAC"}

package/dist/commonjs/switch/lib/SwitchIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwitchIcon = exports.switchIconStencil = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+exports.switchIconStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "4badkt", styles: "box-sizing:border-box;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--size-svg-bca693:var(--cnvs-component-system-icon-size-sm, 1.125rem);position:absolute;transition:transform 0ms;pointer-events:none;transform:translateX(0.75rem);:dir(rtl){transform:translateX(-0.75rem);}" },
+    modifiers: {
+        checked: {
+            true: { name: "93ntc", styles: "transform:translateX(-0.125rem);:dir(rtl){transform:translateX(0.125rem);}" }
+        }
+    }
+}, "switch-icon-8fcbbf");
+exports.SwitchIcon = (0, common_1.createComponent)('div')({
+    displayName: 'SwitchIcon',
+    Component: ({ checked, ...elemProps }, ref) => {
+        return ((0, jsx_runtime_1.jsx)(icon_1.SystemIcon, { icon: checked ? canvas_system_icons_web_1.checkSmallIcon : canvas_system_icons_web_1.xSmallIcon, ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.switchIconStencil)({ checked })) }));
+    },
+});

package/dist/commonjs/switch/lib/SwitchInput.d.ts

@@ -0,0 +1,17 @@
+import { SwitchProps } from './Switch';
+export declare const switchInputStencil: import("@workday/canvas-kit-styling").Stencil<{
+    error: {
+        error: {
+            '& ~ div:first-of-type': {
+                boxShadow: string;
+            };
+        };
+        caution: {
+            '& ~ div:first-of-type': {
+                boxShadow: string;
+            };
+        };
+    };
+}, {}, {}, never, never>;
+export declare const SwitchInput: import("@workday/canvas-kit-react/common").ElementComponent<"input", SwitchProps>;
+//# sourceMappingURL=SwitchInput.d.ts.map

package/dist/commonjs/switch/lib/SwitchInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchInput.d.ts","sourceRoot":"","sources":["../../../../switch/lib/SwitchInput.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;wBA8D7B,CAAC;AAEH,eAAO,MAAM,WAAW,mFAKtB,CAAC"}

package/dist/commonjs/switch/lib/SwitchInput.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwitchInput = exports.switchInputStencil = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const common_1 = require("@workday/canvas-kit-react/common");
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
+exports.switchInputStencil = (0, canvas_kit_styling_1.createStencil)({
+    base: { name: "47vuzl", styles: "box-sizing:border-box;display:flex;position:absolute;margin:0;height:var(--cnvs-base-size-225, 1.125rem);width:2.125rem;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));opacity:0;cursor:pointer;& ~ div:first-of-type{outline-offset:0.125rem;}&:checked, &.checked{& ~ div:first-of-type{background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));}&:disabled, &.disabled{& ~ div:first-of-type{opacity:var(--cnvs-sys-opacity-disabled);}}}&:disabled, &.disabled{cursor:not-allowed;& ~ div:first-of-type{opacity:var(--cnvs-sys-opacity-disabled);}}&:focus-visible, &:focus, &.focus{outline:none;& ~ div:first-of-type{outline:0.0625rem solid transparent;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}}" },
+    modifiers: {
+        error: {
+            error: { name: "1kym0f", styles: "& ~ div:first-of-type{box-shadow:\n              0 0 0 var(--cnvs-base-size-25, 0.125rem) var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))),\n              0 0 0 var(--cnvs-base-size-50, 0.25rem) var(--cnvs-sys-color-brand-focus-critical, var(--cnvs-brand-common-error-inner, oklch(0.6495 0.2369 30.04 / 1))),\n              0 0 0 0.3125rem transparent;}" },
+            caution: { name: "4avb29", styles: "& ~ div:first-of-type{box-shadow:\n          0 0 0 var(--cnvs-base-size-25, 0.125rem) var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))),\n          0 0 0 var(--cnvs-base-size-50, 0.25rem) var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1))),\n          0 0 0 0.3125rem var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));}" }
+        }
+    }
+}, "switch-input-cce660");
+exports.SwitchInput = (0, common_1.createComponent)('input')({
+    displayName: 'SwitchInput',
+    Component: ({ error, ...elemProps }, ref, Element) => {
+        return (0, jsx_runtime_1.jsx)(Element, { ref: ref, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.switchInputStencil)({ error })) });
+    },
+});

package/dist/commonjs/version/lib/version.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.version = void 0;
-exports.version = '14.1.10';
+exports.version = '15.0.1';

package/dist/es6/color-picker/index.d.ts

@@ -1,2 +1,2 @@
-export { ColorPicker, ColorPickerProps } from './lib/ColorPicker';
+export { ColorPicker, type ColorPickerProps } from './lib/ColorPicker';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/color-picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../color-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAE,gBAAgB,EAAC,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../color-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAE,KAAK,gBAAgB,EAAC,MAAM,mBAAmB,CAAC"}

package/dist/es6/color-picker/lib/ColorPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../../color-picker/lib/ColorPicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAa,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAIrE,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E;;OAEG;IACH,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAC9C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,CAAC;IACjD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAmED,eAAO,MAAM,kBAAkB;;;;;;;;;;oBA4B7B,CAAC;AAiBH,eAAO,MAAM,WAAW;kKAYrB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDlB,CAAC"}
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../../color-picker/lib/ColorPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAa,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAErE,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E;;OAEG;IACH,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAC9C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,CAAC;IACjD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;oBA4B7B,CAAC;AAiBH,eAAO,MAAM,WAAW;kKAYrB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDlB,CAAC"}

package/dist/es6/color-picker/lib/ColorPicker.js

@@ -1,71 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { checkIcon } from '@workday/canvas-system-icons-web';
-import { ColorInput } from '@workday/canvas-kit-react/color-picker';
-import { SecondaryButton } from '@workday/canvas-kit-react/button';
 import * as React from 'react';
+import { SecondaryButton } from '@workday/canvas-kit-react/button';
+import { ColorInput } from '@workday/canvas-kit-react/color-picker';
 import { FormField } from '@workday/canvas-kit-react/form-field';
-import { ResetButton } from './parts/ColorReset';
-import { SwatchBook } from './parts/SwatchBook';
 import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { checkIcon } from '@workday/canvas-system-icons-web';
 import { system } from '@workday/canvas-tokens-web';
-const defaultColorSet = {
-    blueberry600: '#004387',
-    grapeSoda600: '#7c3882',
-    pomegranate600: '#99003a',
-    cinnamon600: '#a31b12',
-    cantaloupe600: '#c06c00',
-    sourLemon600: '#bd9100',
-    greenApple600: '#217a37',
-    jewel600: '#156973',
-    blueberry500: '#005cb9',
-    grapeSoda500: '#97499e',
-    pomegranate500: '#c70550',
-    cinnamon500: '#de2e21',
-    cantaloupe500: '#f38b00',
-    sourLemon500: '#ebb400',
-    greenApple500: '#319c4c',
-    jewel500: '#1a818c',
-    blueberry400: '#0875e1',
-    grapeSoda400: '#c860d1',
-    pomegranate400: '#f31167',
-    cinnamon400: '#ff5347',
-    cantaloupe400: '#ffa126',
-    sourLemon400: '#ffc629',
-    greenApple400: '#43c463',
-    jewel400: '#1ea4b3',
-    blueberry300: '#40a0ff',
-    grapeSoda300: '#de8ae6',
-    pomegranate300: '#ff5c9a',
-    cinnamon300: '#ff867d',
-    cantaloupe300: '#ffbc63',
-    sourLemon300: '#ffda61',
-    greenApple300: '#5fe380',
-    jewel300: '#44c8d7',
-    blueberry200: '#a6d2ff',
-    grapeSoda200: '#fac0ff',
-    pomegranate200: '#ffbdd6',
-    cinnamon200: '#fcc9c5',
-    cantaloupe200: '#fcd49f',
-    sourLemon200: '#ffecab',
-    greenApple200: '#acf5be',
-    jewel200: '#acecf3',
-    blueberry100: '#d7eafc',
-    grapeSoda100: '#feebff',
-    pomegranate100: '#ffebf3',
-    cinnamon100: '#ffefee',
-    cantaloupe100: '#ffeed9',
-    sourLemon100: '#fff9e6',
-    greenApple100: '#ebfff0',
-    jewel100: '#ebfdff',
-    blackPepper600: '#000000',
-    blackPepper400: '#333333',
-    blackPepper300: '#494949',
-    blackPepper100: '#787878',
-    frenchVanilla500: '#a6a6a6',
-    frenchVanilla400: '#bdbdbd',
-    frenchVanilla200: '#ebebeb',
-    frenchVanilla100: '#ffffff',
-};
+import { defaultColorSet } from './defaultColorSet';
+import { ResetButton } from './parts/ColorReset';
+import { SwatchBook } from './parts/SwatchBook';
 export const colorPickerStencil = createStencil({
     parts: {
         button: 'color-picker-button',
@@ -73,8 +16,8 @@ export const colorPickerStencil = createStencil({
         hexInput: 'color-picker-hex-input',
         inputWrapper: 'color-picker-input-wrapper',
     },
-    base: { name: "3fumvk", styles: "box-sizing:border-box;width:13.5rem;[data-part=\"color-picker-form\"]{width:100%;display:flex;flex-direction:row;justify-content:space-between;margin-block-start:var(--cnvs-sys-space-x4);}[data-part=\"color-picker-input-wrapper\"]{display:flex;flex-direction:column;margin:var(--cnvs-sys-space-zero);}[data-part=\"color-picker-button\"]{align-self:flex-end;}[data-part=\"color-picker-hex-input\"]{width:10.5rem;}" }
-}, "color-picker-c9dd1d");
+    base: { name: "v1i4o", styles: "box-sizing:border-box;width:13.5rem;[data-part=\"color-picker-form\"]{width:100%;display:flex;flex-direction:row;justify-content:space-between;margin-block-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));}[data-part=\"color-picker-input-wrapper\"]{display:flex;flex-direction:column;margin:0;}[data-part=\"color-picker-button\"]{align-self:flex-end;}[data-part=\"color-picker-hex-input\"]{width:10.5rem;}" }
+}, "color-picker-a530b2");
 const isCustomColor = (colors, hexCode) => {
     if (!hexCode) {
         return false;

package/dist/es6/color-picker/lib/defaultColorSet.d.ts

@@ -0,0 +1,59 @@
+export declare const defaultColorSet: {
+    blueberry600: string;
+    grapeSoda600: string;
+    pomegranate600: string;
+    cinnamon600: string;
+    cantaloupe600: string;
+    sourLemon600: string;
+    greenApple600: string;
+    jewel600: string;
+    blueberry500: string;
+    grapeSoda500: string;
+    pomegranate500: string;
+    cinnamon500: string;
+    cantaloupe500: string;
+    sourLemon500: string;
+    greenApple500: string;
+    jewel500: string;
+    blueberry400: string;
+    grapeSoda400: string;
+    pomegranate400: string;
+    cinnamon400: string;
+    cantaloupe400: string;
+    sourLemon400: string;
+    greenApple400: string;
+    jewel400: string;
+    blueberry300: string;
+    grapeSoda300: string;
+    pomegranate300: string;
+    cinnamon300: string;
+    cantaloupe300: string;
+    sourLemon300: string;
+    greenApple300: string;
+    jewel300: string;
+    blueberry200: string;
+    grapeSoda200: string;
+    pomegranate200: string;
+    cinnamon200: string;
+    cantaloupe200: string;
+    sourLemon200: string;
+    greenApple200: string;
+    jewel200: string;
+    blueberry100: string;
+    grapeSoda100: string;
+    pomegranate100: string;
+    cinnamon100: string;
+    cantaloupe100: string;
+    sourLemon100: string;
+    greenApple100: string;
+    jewel100: string;
+    blackPepper600: string;
+    blackPepper400: string;
+    blackPepper300: string;
+    blackPepper100: string;
+    frenchVanilla500: string;
+    frenchVanilla400: string;
+    frenchVanilla200: string;
+    frenchVanilla100: string;
+};
+//# sourceMappingURL=defaultColorSet.d.ts.map

package/dist/es6/color-picker/lib/defaultColorSet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultColorSet.d.ts","sourceRoot":"","sources":["../../../../color-picker/lib/defaultColorSet.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+D3B,CAAC"}

package/dist/es6/color-picker/lib/defaultColorSet.js

@@ -0,0 +1,58 @@
+export const defaultColorSet = {
+    blueberry600: '#004387',
+    grapeSoda600: '#7c3882',
+    pomegranate600: '#99003a',
+    cinnamon600: '#a31b12',
+    cantaloupe600: '#c06c00',
+    sourLemon600: '#bd9100',
+    greenApple600: '#217a37',
+    jewel600: '#156973',
+    blueberry500: '#005cb9',
+    grapeSoda500: '#97499e',
+    pomegranate500: '#c70550',
+    cinnamon500: '#de2e21',
+    cantaloupe500: '#f38b00',
+    sourLemon500: '#ebb400',
+    greenApple500: '#319c4c',
+    jewel500: '#1a818c',
+    blueberry400: '#0875e1',
+    grapeSoda400: '#c860d1',
+    pomegranate400: '#f31167',
+    cinnamon400: '#ff5347',
+    cantaloupe400: '#ffa126',
+    sourLemon400: '#ffc629',
+    greenApple400: '#43c463',
+    jewel400: '#1ea4b3',
+    blueberry300: '#40a0ff',
+    grapeSoda300: '#de8ae6',
+    pomegranate300: '#ff5c9a',
+    cinnamon300: '#ff867d',
+    cantaloupe300: '#ffbc63',
+    sourLemon300: '#ffda61',
+    greenApple300: '#5fe380',
+    jewel300: '#44c8d7',
+    blueberry200: '#a6d2ff',
+    grapeSoda200: '#fac0ff',
+    pomegranate200: '#ffbdd6',
+    cinnamon200: '#fcc9c5',
+    cantaloupe200: '#fcd49f',
+    sourLemon200: '#ffecab',
+    greenApple200: '#acf5be',
+    jewel200: '#acecf3',
+    blueberry100: '#d7eafc',
+    grapeSoda100: '#feebff',
+    pomegranate100: '#ffebf3',
+    cinnamon100: '#ffefee',
+    cantaloupe100: '#ffeed9',
+    sourLemon100: '#fff9e6',
+    greenApple100: '#ebfff0',
+    jewel100: '#ebfdff',
+    blackPepper600: '#000000',
+    blackPepper400: '#333333',
+    blackPepper300: '#494949',
+    blackPepper100: '#787878',
+    frenchVanilla500: '#a6a6a6',
+    frenchVanilla400: '#bdbdbd',
+    frenchVanilla200: '#ebebeb',
+    frenchVanilla100: '#ffffff',
+};

package/dist/es6/color-picker/lib/parts/ColorReset.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { calc, createStencil, handleCsProp } from '@workday/canvas-kit-styling';
 import { ColorSwatch } from '@workday/canvas-kit-react/color-picker';
 import { focusRing } from '@workday/canvas-kit-react/common';
-import { system } from '@workday/canvas-tokens-web';
 import { Subtext } from '@workday/canvas-kit-react/text';
+import { calc, createStencil, handleCsProp } from '@workday/canvas-kit-styling';
+import { base, system } from '@workday/canvas-tokens-web';
 export const resetButtonStencil = createStencil({
     parts: {
         label: 'reset-button-label',
     },
-    base: { name: "3e4w86", styles: "box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;width:calc(100% + var(--cnvs-sys-space-x8));height:var(--cnvs-sys-space-x8);margin:calc(var(--cnvs-sys-space-x2) * -1) calc(var(--cnvs-sys-space-x4) * -1) var(--cnvs-sys-space-x2);padding:0 var(--cnvs-sys-space-x4);white-space:nowrap;border:none;outline:none;background:none;cursor:pointer;transition:color 120ms ease, background-color 120ms ease;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}&:active, &.active{background-color:var(--cnvs-sys-color-bg-alt-strong);}&:focus-visible, &.focus{box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}[data-part=\"reset-button-label\"]{margin-left:var(--cnvs-sys-space-x2);}" }
-}, "reset-button-af92a8");
+    base: { name: "193qgn", styles: "box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;width:calc(100% + var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem)));height:var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem));margin:calc(var(--cnvs-base-size-100, 0.5rem) * -1) calc(var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem)) * -1) var(--cnvs-base-size-100, 0.5rem);padding:0 var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));white-space:nowrap;border:none;outline:none;background:none;cursor:pointer;transition:color 120ms ease, background-color 120ms ease;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}&:active, &.active{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));}&:focus-visible, &.focus{box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}[data-part=\"reset-button-label\"]{margin-left:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));}" }
+}, "reset-button-531e85");
 export const ResetButton = ({ onClick, resetColor, label }) => {
     const handleResetColor = () => onClick(resetColor);
     return (_jsxs("button", { onClick: handleResetColor, ...handleCsProp({}, resetButtonStencil()), children: [_jsx(ColorSwatch, { color: resetColor, "data-color": "" }), _jsx(Subtext, { size: "medium", as: "div", ...resetButtonStencil.parts.label, children: label })] }));

package/dist/es6/color-picker/lib/parts/SwatchBook.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SwatchBook.d.ts","sourceRoot":"","sources":["../../../../../color-picker/lib/parts/SwatchBook.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,CAAC,MAAM,GAAG,qBAAqB,CAAC,EAAE,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAiDD,eAAO,MAAM,UAAU,gCAA+B,eAAe,4CA6BpE,CAAC"}
+{"version":3,"file":"SwatchBook.d.ts","sourceRoot":"","sources":["../../../../../color-picker/lib/parts/SwatchBook.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,CAAC,MAAM,GAAG,qBAAqB,CAAC,EAAE,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAiDD,eAAO,MAAM,UAAU,gCAA+B,eAAe,4CA6BpE,CAAC"}

package/dist/es6/color-picker/lib/parts/SwatchBook.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { focusRing } from '@workday/canvas-kit-react/common';
 import { ColorSwatch } from '@workday/canvas-kit-react/color-picker';
+import { focusRing } from '@workday/canvas-kit-react/common';
 import { calc, createStencil, px2rem } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
 const colorPickerSwatchBookStencil = createStencil({
     vars: {
-        shadow: `${system.color.border.inverse} 0 0 0 ${px2rem(2)}, ${system.color.border.input.default} 0 0 0 ${px2rem(3)}`,
+        shadow: `${system.legacy.color.border.inverse.default} 0 0 0 ${px2rem(2)}, ${system.color.border.input.default} 0 0 0 ${px2rem(3)}`,
     },
     parts: {
         tile: 'color-picker-swatch-book-tile',
     },
-    base: { name: "12094g", styles: "--shadow-color-picker-swatch-book-a4010d:var(--cnvs-sys-color-border-inverse) 0 0 0 0.125rem, var(--cnvs-sys-color-border-input-default) 0 0 0 0.1875rem;box-sizing:border-box;display:flex;flex-wrap:wrap;margin:0 calc(var(--cnvs-sys-space-x2) * -1) calc(var(--cnvs-sys-space-x2) * -1) 0;[data-part=\"color-picker-swatch-book-tile\"]{display:flex;width:1.25rem;height:1.25rem;cursor:pointer;border-radius:var(--cnvs-sys-shape-half);transition:box-shadow 120ms ease;margin:0px var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2) 0px;&:hover{box-shadow:var(--shadow-color-picker-swatch-book-a4010d);}&:focus-visible{outline:none;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&[aria-selected=\"true\"]{box-shadow:var(--shadow-color-picker-swatch-book-a4010d);&:focus-visible{animation:none;box-shadow:none;}&:hover{box-shadow:var(--shadow-color-picker-swatch-book-a4010d);}}}" }
-}, "color-picker-swatch-book-a4010d");
+    base: { name: "o767q", styles: "--shadow-color-picker-swatch-book-915ea6:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1))) 0 0 0 0.125rem, var(--cnvs-sys-color-border-input-default) 0 0 0 0.1875rem;box-sizing:border-box;display:flex;flex-wrap:wrap;margin:0 calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) 0;[data-part=\"color-picker-swatch-book-tile\"]{display:flex;width:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));cursor:pointer;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));transition:box-shadow 120ms ease;margin:0px var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) 0px;&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}&:focus-visible{outline:none;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&[aria-selected=\"true\"]{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);&:focus-visible{animation:none;box-shadow:none;}&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}}}" }
+}, "color-picker-swatch-book-915ea6");
 export const SwatchBook = ({ colors, value, onSelect }) => {
     return (_jsx("div", { ...colorPickerSwatchBookStencil(), children: colors.map((color, index) => {
             const hexCode = typeof color === 'object' ? color.value : color.toLowerCase();