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

package/dist/es6/status-indicator/lib/StatusIndicator.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createComponent } from '@workday/canvas-kit-react/common';
+import { systemIconStencil } from '@workday/canvas-kit-react/icon';
+import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { createStencil, px2rem } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
-import { mergeStyles } from '@workday/canvas-kit-react/layout';
-import { systemIconStencil } from '@workday/canvas-kit-react/icon';
 import { StatusIndicatorIcon } from './StatusIndicatorIcon';
 import { StatusIndicatorLabel } from './StatusIndicatorLabel';
 // TODO: Remove this in a future release
@@ -15,7 +15,7 @@ const deprecatedVariantsMap = {
     gray: 'neutral',
 };
 const statusIndicatorStencil = createStencil({
-    base: { name: "3f4qvc", styles: "box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-space-x1);max-width:12.5rem;align-items:center;border-radius:var(--cnvs-sys-shape-round);height:1.25rem;padding:var(--cnvs-sys-space-zero) var(--cnvs-sys-space-x2);outline:0.0625rem solid transparent;--color-system-icon-3a4847:currentColor;" },
+    base: { name: "3476o5", styles: "box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));max-width:12.5rem;align-items:center;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));padding:0 var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));outline:0.0625rem solid transparent;--color-system-icon-c9acc3:currentColor;" },
     modifiers: {
         /**
          * Defines the color of the `StatusIndicator`.
@@ -30,13 +30,12 @@ const statusIndicatorStencil = createStencil({
          * @default 'neutral'
          */
         variant: {
-            info: { name: "1s61y8", styles: "color:var(--cnvs-sys-color-fg-info-strong);background-color:var(--cnvs-sys-color-bg-info-softer);" },
-            positive: { name: "3tfvkp", styles: "color:var(--cnvs-sys-color-fg-positive-strong);background-color:var(--cnvs-sys-color-fg-positive-softer);" },
-            caution: { name: "12an3t", styles: "color:var(--cnvs-sys-color-fg-caution-soft);background-color:var(--cnvs-sys-color-bg-caution-softer);" },
-            critical: { name: "20dtg7", styles: "color:var(--cnvs-sys-color-fg-critical-strong);background-color:var(--cnvs-sys-color-bg-critical-softer);" },
-            neutral: { name: "vjzzy", styles: "color:var(--cnvs-sys-color-fg-muted-strong);background-color:var(--cnvs-sys-color-bg-alt-default);" },
-            ai: { name: "2krgei", styles: "color:var(--cnvs-sys-color-fg-ai);background-color:var(--cnvs-sys-color-bg-ai-default);" },
-            transparent: { name: "37vfbo", styles: "color:var(--cnvs-sys-color-fg-inverse);background-color:var(--cnvs-sys-color-bg-translucent);" }
+            info: { name: "b4eki", styles: "color:var(--cnvs-sys-color-fg-info-strong, var(--cnvs-sys-color-fg-primary-strong, oklch(0.4658 0.1562 255.5 / 1)));background-color:var(--cnvs-sys-color-surface-info-strong, var(--cnvs-sys-color-bg-info-softer, oklch(0.6152 0.2108 256.1 / 0.11)));" },
+            positive: { name: "16j92m", styles: "color:var(--cnvs-sys-color-fg-success-strong, oklch(0.4463 0.1422 144.58 / 1));background-color:var(--cnvs-sys-color-surface-success-strong, oklch(0.8685 0.2814 143.77 / 0.15));" },
+            caution: { name: "3ujgu0", styles: "color:var(--cnvs-sys-color-fg-warning-strong, oklch(0.4824 0.1353 46.11 / 1));background-color:var(--cnvs-sys-color-surface-warning-strong, var(--cnvs-sys-color-static-amber-stronger, oklch(0.8864 0.1845 100.28 / 0.22)));" },
+            critical: { name: "3gofff", styles: "color:var(--cnvs-sys-color-fg-danger-strong, var(--cnvs-sys-color-fg-critical-strong, oklch(0.4517 0.1847 28.2 / 1)));background-color:var(--cnvs-sys-color-surface-danger-strong, oklch(0.6434 0.2428 30.17 / 0.1));" },
+            neutral: { name: "4c7hpn", styles: "color:var(--cnvs-sys-color-fg-muted-strong);background-color:var(--cnvs-sys-color-surface-alt-strong, var(--cnvs-sys-color-bg-alt-default, oklch(0.3337 0.0688 250.79 / 0.09)));" },
+            transparent: { name: "1rcrsa", styles: "color:var(--cnvs-sys-color-fg-inverse);background-color:var(--cnvs-sys-color-surface-contrast-default, var(--cnvs-sys-color-bg-contrast-default, oklch(0.0969 0 0 / 0.84)));" }
         },
         /**
          * Defines the emphasis of the `StatusIndicator`. `low` should be used in almost all cases.
@@ -49,8 +48,8 @@ const statusIndicatorStencil = createStencil({
          *
          */
         emphasis: {
-            low: { name: "1lsruo", styles: "" },
-            high: { name: "3l5psq", styles: "" }
+            low: { name: "1k8y8s", styles: "" },
+            high: { name: "2i6rok", styles: "" }
         }
     },
     compound: [
@@ -59,42 +58,42 @@ const statusIndicatorStencil = createStencil({
                 variant: 'info',
                 emphasis: 'high',
             },
-            styles: { name: "3p9u4h", styles: "background-color:var(--cnvs-sys-color-bg-info-default);color:var(--cnvs-sys-color-fg-inverse);" }
+            styles: { name: "392z83", styles: "background-color:var(--cnvs-sys-color-accent-info, var(--cnvs-sys-color-bg-info-default, oklch(0.5198 0.1782 256.11 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
         },
         {
             modifiers: {
                 variant: 'positive',
                 emphasis: 'high',
             },
-            styles: { name: "1t7ehj", styles: "background-color:var(--cnvs-sys-color-bg-positive-default);color:var(--cnvs-sys-color-fg-inverse);" }
+            styles: { name: "28kltp", styles: "background-color:var(--cnvs-sys-color-accent-success, var(--cnvs-sys-color-bg-positive-default, oklch(0.5069 0.1569 145.56 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
         },
         {
             modifiers: {
                 variant: 'caution',
                 emphasis: 'high',
             },
-            styles: { name: "1tyluv", styles: "background-color:var(--cnvs-sys-color-bg-caution-default);color:var(--cnvs-sys-color-fg-caution-strong);" }
+            styles: { name: "3bkx75", styles: "background-color:var(--cnvs-sys-color-accent-warning, oklch(0.7909 0.1711 70.15 / 1));color:var(--cnvs-sys-color-fg-contrast-default);" }
         },
         {
             modifiers: {
                 variant: 'critical',
                 emphasis: 'high',
             },
-            styles: { name: "4empw0", styles: "background-color:var(--cnvs-sys-color-bg-critical-default);color:var(--cnvs-sys-color-fg-inverse);" }
+            styles: { name: "3k3ozm", styles: "background-color:var(--cnvs-sys-color-accent-danger, var(--cnvs-sys-color-bg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
         },
         {
             modifiers: {
                 variant: 'neutral',
                 emphasis: 'high',
             },
-            styles: { name: "zsqv7", styles: "background-color:var(--cnvs-sys-color-bg-muted-default);color:var(--cnvs-sys-color-fg-inverse);" }
+            styles: { name: "1p86nc", styles: "background-color:var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
         }
     ],
     defaultModifiers: {
         variant: 'neutral',
         emphasis: 'low',
     }
-}, "status-indicator-c55f02");
+}, "status-indicator-dc1ecc");
 /**
  * `StatusIndicator` is a container component has a default maximum width of `200px`.
  *

package/dist/es6/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/es6/status-indicator/lib/StatusIndicatorIcon.js

@@ -4,6 +4,10 @@ import { SystemIcon } from '@workday/canvas-kit-react/icon';
 export const StatusIndicatorIcon = 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 _jsx(SystemIcon, { as: Element, ref: ref, size: 20, role: "img", ...elemProps });
     },
 });

package/dist/es6/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/es6/status-indicator/lib/StatusIndicatorLabel.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createComponent } from '@workday/canvas-kit-react/common';
+import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { textStencil } from '@workday/canvas-kit-react/text';
 import { createStencil } from '@workday/canvas-kit-styling';
-import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { system } from '@workday/canvas-tokens-web';
 const statusIndicatorLabelStencil = createStencil({
     extends: 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: "3j9qhy", 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");
 export const StatusIndicatorLabel = createComponent('span')({

package/dist/es6/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/es6/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/es6/switch/index.js

@@ -0,0 +1,6 @@
+export * from './lib/Switch';
+export * from './lib/SwitchBackground';
+export * from './lib/SwitchCircle';
+export * from './lib/SwitchContainer';
+export * from './lib/SwitchIcon';
+export * from './lib/SwitchInput';

package/dist/es6/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/es6/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/es6/switch/lib/Switch.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ErrorType, createComponent, useUniqueId } from '@workday/canvas-kit-react/common';
+import { SwitchBackground } from './SwitchBackground';
+import { SwitchCircle } from './SwitchCircle';
+import { SwitchContainer } from './SwitchContainer';
+import { SwitchIcon } from './SwitchIcon';
+import { SwitchInput } from './SwitchInput';
+export const Switch = createComponent('input')({
+    displayName: 'Switch',
+    Component: ({ checked = false, id, disabled = false, onChange, value, ...elemProps }, ref, Element) => {
+        const inputId = useUniqueId(id);
+        return (_jsxs(SwitchContainer, { children: [_jsx(SwitchInput, { as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, onChange: onChange, role: "switch", type: "checkbox", value: value, ...elemProps }), _jsxs(SwitchBackground, { children: [_jsx(SwitchCircle, { checked: checked }), _jsx(SwitchIcon, { checked: checked })] })] }));
+    },
+    subComponents: {
+        ErrorType,
+    },
+});

package/dist/es6/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/es6/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/es6/switch/lib/SwitchBackground.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { base, system } from '@workday/canvas-tokens-web';
+export const switchBackgroundStencil = createStencil({
+    base: { name: "1lhfy2", 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");
+export const SwitchBackground = createComponent('div')({
+    displayName: 'SwitchBackground',
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (_jsx(Element, { ref: ref, ...handleCsProp(elemProps, switchBackgroundStencil()), children: children }));
+    },
+});

package/dist/es6/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/es6/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/es6/switch/lib/SwitchCircle.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { base, system } from '@workday/canvas-tokens-web';
+export const switchCircleStencil = createStencil({
+    base: { name: "1nbrpk", 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: "12dpoq", styles: "transform:translateX(1rem);:dir(rtl){transform:translateX(-1rem);}" }
+        }
+    }
+}, "switch-circle-1553b5");
+export const SwitchCircle = createComponent('div')({
+    displayName: 'SwitchCircle',
+    Component: ({ checked, ...elemProps }, ref, Element) => {
+        return _jsx(Element, { ref: ref, ...handleCsProp(elemProps, switchCircleStencil({ checked })) });
+    },
+});

package/dist/es6/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/es6/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/es6/switch/lib/SwitchContainer.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { base, system } from '@workday/canvas-tokens-web';
+export const switchContainerStencil = createStencil({
+    base: { name: "xj0ee", 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");
+export const SwitchContainer = createComponent('div')({
+    displayName: 'SwitchContainer',
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (_jsx(Element, { ref: ref, ...handleCsProp(elemProps, switchContainerStencil()), children: children }));
+    },
+});

package/dist/es6/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/es6/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/es6/switch/lib/SwitchIcon.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { SystemIcon, systemIconStencil } from '@workday/canvas-kit-react/icon';
+import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { checkSmallIcon, xSmallIcon } from '@workday/canvas-system-icons-web';
+import { component, system } from '@workday/canvas-tokens-web';
+export const switchIconStencil = createStencil({
+    base: { name: "3rcozx", 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: "sc4sn", styles: "transform:translateX(-0.125rem);:dir(rtl){transform:translateX(0.125rem);}" }
+        }
+    }
+}, "switch-icon-8fcbbf");
+export const SwitchIcon = createComponent('div')({
+    displayName: 'SwitchIcon',
+    Component: ({ checked, ...elemProps }, ref) => {
+        return (_jsx(SystemIcon, { icon: checked ? checkSmallIcon : xSmallIcon, ref: ref, ...handleCsProp(elemProps, switchIconStencil({ checked })) }));
+    },
+});

package/dist/es6/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/es6/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/es6/switch/lib/SwitchInput.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createComponent, focusRing } from '@workday/canvas-kit-react/common';
+import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { base, system } from '@workday/canvas-tokens-web';
+export const switchInputStencil = createStencil({
+    base: { name: "1662el", 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: "2j0ox1", 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: "3eie8r", 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");
+export const SwitchInput = createComponent('input')({
+    displayName: 'SwitchInput',
+    Component: ({ error, ...elemProps }, ref, Element) => {
+        return _jsx(Element, { ref: ref, ...handleCsProp(elemProps, switchInputStencil({ error })) });
+    },
+});

package/dist/es6/version/lib/version.js

@@ -1 +1 @@
-export const version = '14.1.10';
+export const version = '15.0.0';

package/divider/lib/Divider.tsx

@@ -1,25 +1,25 @@
 import {createComponent} from '@workday/canvas-kit-react/common';
 import {
-  createStencil,
-  handleCsProp,
   CSProps,
   calc,
+  createStencil,
   cssVar,
+  handleCsProp,
   px2rem,
 } from '@workday/canvas-kit-styling';
 import {system} from '@workday/canvas-tokens-web';
 
 export const dividerStencil = createStencil({
   vars: {
-    space: cssVar(system.space.x4),
+    space: '',
   },
   base: ({space}) => {
     return {
       display: 'block',
       height: px2rem(1),
       border: 'none',
-      borderTop: `1px solid ${system.color.border.divider}`,
-      margin: `${calc.divide(space, 2)} 0`,
+      borderTop: `1px solid ${system.legacy.color.border.default}`,
+      margin: `${calc.divide(cssVar(space, system.legacy.gap.xs), 2)} 0`,
     };
   },
 });
@@ -28,7 +28,7 @@ export interface DividerProps extends CSProps {
   /**
    * Applies top and bottom margin evenly. It divides the provided value by two and applies half to each end.
    * E.g. `space="2rem"` would apply `1rem` margin to the top, and `1rem` margin to the bottom.
-   * @default `system.space.x4` (1rem)
+   * @default `system.gap.md` (1rem)
    */
   space?: string;
 }
@@ -40,14 +40,14 @@ export interface DividerProps extends CSProps {
  * [View Docs](https://workday.github.io/canvas-kit/?path=/docs/preview-divider--docs)
  *
  * The `space` prop will equally apply top and bottom margin styles.
- * In the example below, `x2` (0.5rem), adds `0.25rem` margin to the top and `0.25rem` to the bottom
+ * In the example below, `system.gap.xs` (0.5rem), adds `0.25rem` margin to the top and `0.25rem` to the bottom
  *
  * @example
  * ```tsx
  * import { Divider } from '@workday/canvas-kit-preview-react/divider';
- * import {system} from '@workday/canvas-tokens-web';
  *
- * <Divider space={system.space.x2} />
+ *
+ * <Divider space={system.gap.xs} />
  *
  * ```
  */

package/index.ts

@@ -1,13 +1,10 @@
-export * from './avatar';
+export * from '@workday/canvas-kit-react/avatar';
 export * from './color-picker';
 export * from './divider';
-export * from './information-highlight';
 export * from './loading-sparkles';
 export * from './multi-select';
-export * from './pill';
 export * from './radio';
-export * from './segmented-control';
-export * from './select';
 export * from './side-panel';
 export * from './status-indicator';
+export * from './switch';
 export * from './version';

package/loading-sparkles/lib/LoadingSparkles.tsx

@@ -1,7 +1,7 @@
-import {system} from '@workday/canvas-tokens-web';
 import {createComponent} from '@workday/canvas-kit-react/common';
 import {SystemIcon, systemIconStencil} from '@workday/canvas-kit-react/icon';
 import {CSProps, createStencil, handleCsProp, keyframes, px2rem} from '@workday/canvas-kit-styling';
+import {system} from '@workday/canvas-tokens-web';
 
 import {sparkleIcon} from './sparkleIcon';
 
@@ -32,7 +32,7 @@ const LOADING_ANIMATION = keyframes({
  * An individual loading sparkle. ✨
  */
 const Sparkle = () => {
-  return <SystemIcon data-part="sparkle" icon={sparkleIcon} size={system.space.x3} />;
+  return <SystemIcon data-part="sparkle" icon={sparkleIcon} size={px2rem(12)} />;
 };
 
 export const loadingSparklesStencil = createStencil({

package/loading-sparkles/lib/sparkleIcon.ts

@@ -1,4 +1,4 @@
-import {CanvasSystemIcon, CanvasIconTypes} from '@workday/design-assets-types';
+import {CanvasIconTypes, CanvasSystemIcon} from '@workday/design-assets-types';
 
 export const sparkleIcon: CanvasSystemIcon = {
   name: 'sparkle',

package/multi-select/lib/MultiSelect.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 
-import {createContainer} from '@workday/canvas-kit-react/common';
 import {Combobox} from '@workday/canvas-kit-react/combobox';
+import {createContainer} from '@workday/canvas-kit-react/common';
 
-import {useMultiSelectModel} from './useMultiSelectModel';
-import {MultiSelectInput, MultiSelectSearchInput} from './MultiSelectInput';
 import {MultiSelectCard} from './MultiSelectCard';
+import {MultiSelectInput, MultiSelectSearchInput} from './MultiSelectInput';
+import {useMultiSelectModel} from './useMultiSelectModel';
 
 export interface MultiSelectProps extends React.PropsWithChildren {}
 

package/multi-select/lib/MultiSelectCard.tsx

@@ -1,12 +1,12 @@
 import {
+  ExtractProps,
   createElemPropsHook,
   createSubcomponent,
-  ExtractProps,
 } from '@workday/canvas-kit-react/common';
 import {Menu} from '@workday/canvas-kit-react/menu';
+import {calc, px2rem} from '@workday/canvas-kit-styling';
 
 import {useMultiSelectModel} from './useMultiSelectModel';
-import {calc, px2rem} from '@workday/canvas-kit-styling';
 
 export interface MultiSelectCardProps extends ExtractProps<typeof Menu.Card> {}