@workday/canvas-kit-react 11.0.0-alpha.726-next.0 → 11.0.0-alpha.760-next.0

package/dist/commonjs/card/lib/CardBody.d.ts

@@ -1,5 +1,108 @@
 import { BoxProps } from '@workday/canvas-kit-react/layout';
 export interface CardBodyProps extends BoxProps {
 }
+export declare const cardBodyStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, never>, {}, import("@workday/canvas-kit-styling").Stencil<{
+    typeLevel: {
+        'title.large': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-600";
+            fontSize: "--cnvs-base-font-size-600";
+        };
+        'title.medium': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-500";
+            fontSize: "--cnvs-base-font-size-500";
+        };
+        'title.small': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-400";
+            fontSize: "--cnvs-base-font-size-400";
+        };
+        'heading.large': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-350";
+            fontSize: "--cnvs-base-font-size-300";
+        };
+        'heading.medium': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-300";
+            fontSize: "--cnvs-base-font-size-250";
+        };
+        'heading.small': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-250";
+            fontSize: "--cnvs-base-font-size-200";
+        };
+        'body.large': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-200";
+            fontSize: "--cnvs-base-font-size-150";
+        };
+        'body.medium': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-200";
+            fontSize: "--cnvs-base-font-size-125";
+        };
+        'body.small': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-150";
+            fontSize: "--cnvs-base-font-size-100";
+            letterSpacing: "--cnvs-base-letter-spacing-200";
+        };
+        'subtext.large': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-100";
+            fontSize: "--cnvs-base-font-size-75";
+            letterSpacing: "--cnvs-base-letter-spacing-150";
+        };
+        'subtext.medium': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-50";
+            fontSize: "--cnvs-base-font-size-50";
+            letterSpacing: "--cnvs-base-letter-spacing-100";
+        };
+        'subtext.small': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-50";
+            fontSize: "--cnvs-base-font-size-25";
+            letterSpacing: "--cnvs-base-letter-spacing-50";
+        };
+    };
+    variant: {
+        error: {
+            color: "--cnvs-sys-color-text-critical-default";
+        };
+        hint: {
+            color: "--cnvs-sys-color-text-hint";
+        };
+        inverse: {
+            color: "--cnvs-sys-color-text-inverse";
+        };
+    };
+}, {}, never, never>, never>;
 export declare const CardBody: import("@workday/canvas-kit-react/common").ElementComponent<"div", CardBodyProps>;
 //# sourceMappingURL=CardBody.d.ts.map

package/dist/commonjs/card/lib/CardBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardBody.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAG1D,MAAM,WAAW,aAAc,SAAQ,QAAQ;CAAG;AAElD,eAAO,MAAM,QAAQ,mFASnB,CAAC"}
+{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardBody.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,QAAQ,EAAc,MAAM,kCAAkC,CAAC;AAIvE,MAAM,WAAW,aAAc,SAAQ,QAAQ;CAAG;AAGlD,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAI1B,CAAC;AAEH,eAAO,MAAM,QAAQ,mFASnB,CAAC"}

package/dist/commonjs/card/lib/CardBody.js

@@ -19,13 +19,21 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardBody = void 0;
+exports.CardBody = exports.cardBodyStencil = void 0;
 const React = __importStar(require("react"));
 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");
+// .cnvs-card-body
+exports.cardBodyStencil = canvas_kit_styling_1.createStencil({
+    extends: text_1.textStencil,
+    base: { name: "859f1f", styles: "" },
+    defaultModifiers: { typeLevel: 'subtext.large' }
+}, "cnvs-card-body");
 exports.CardBody = common_1.createComponent('div')({
     displayName: 'Card.Body',
     Component: ({ children, ...elemProps }, ref, Element) => {
-        return (React.createElement(text_1.Subtext, Object.assign({ size: "large", ref: ref, as: Element }, elemProps), children));
+        return (React.createElement(Element, Object.assign({ ref: ref }, layout_1.mergeStyles(elemProps, exports.cardBodyStencil())), children));
     },
 });

package/dist/commonjs/card/lib/CardHeading.d.ts

@@ -7,5 +7,108 @@ export interface CardHeadingProps extends BoxProps {
     id?: string;
     children?: React.ReactNode;
 }
+export declare const cardHeadingStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, never>, {}, import("@workday/canvas-kit-styling").Stencil<{
+    typeLevel: {
+        'title.large': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-600";
+            fontSize: "--cnvs-base-font-size-600";
+        };
+        'title.medium': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-500";
+            fontSize: "--cnvs-base-font-size-500";
+        };
+        'title.small': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-400";
+            fontSize: "--cnvs-base-font-size-400";
+        };
+        'heading.large': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-350";
+            fontSize: "--cnvs-base-font-size-300";
+        };
+        'heading.medium': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-300";
+            fontSize: "--cnvs-base-font-size-250";
+        };
+        'heading.small': {
+            color: "--cnvs-sys-color-text-strong";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-700";
+            lineHeight: "--cnvs-base-line-height-250";
+            fontSize: "--cnvs-base-font-size-200";
+        };
+        'body.large': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-200";
+            fontSize: "--cnvs-base-font-size-150";
+        };
+        'body.medium': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-200";
+            fontSize: "--cnvs-base-font-size-125";
+        };
+        'body.small': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-150";
+            fontSize: "--cnvs-base-font-size-100";
+            letterSpacing: "--cnvs-base-letter-spacing-200";
+        };
+        'subtext.large': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-100";
+            fontSize: "--cnvs-base-font-size-75";
+            letterSpacing: "--cnvs-base-letter-spacing-150";
+        };
+        'subtext.medium': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-50";
+            fontSize: "--cnvs-base-font-size-50";
+            letterSpacing: "--cnvs-base-letter-spacing-100";
+        };
+        'subtext.small': {
+            color: "--cnvs-sys-color-text-default";
+            fontFamily: "--cnvs-base-font-family-50";
+            fontWeight: "--cnvs-base-font-weight-400";
+            lineHeight: "--cnvs-base-line-height-50";
+            fontSize: "--cnvs-base-font-size-25";
+            letterSpacing: "--cnvs-base-letter-spacing-50";
+        };
+    };
+    variant: {
+        error: {
+            color: "--cnvs-sys-color-text-critical-default";
+        };
+        hint: {
+            color: "--cnvs-sys-color-text-hint";
+        };
+        inverse: {
+            color: "--cnvs-sys-color-text-inverse";
+        };
+    };
+}, {}, never, never>, never>;
 export declare const CardHeading: import("@workday/canvas-kit-react/common").ElementComponent<"h3", CardHeadingProps>;
 //# sourceMappingURL=CardHeading.d.ts.map

package/dist/commonjs/card/lib/CardHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeading.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,QAAQ,EAAc,MAAM,kCAAkC,CAAC;AAKvE,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAQD,eAAO,MAAM,WAAW,qFAkBtB,CAAC"}
+{"version":3,"file":"CardHeading.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,QAAQ,EAAc,MAAM,kCAAkC,CAAC;AAKvE,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAS7B,CAAC;AAEH,eAAO,MAAM,WAAW,qFAStB,CAAC"}

package/dist/commonjs/card/lib/CardHeading.js

@@ -19,17 +19,22 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardHeading = void 0;
+exports.CardHeading = exports.cardHeadingStencil = void 0;
 const React = __importStar(require("react"));
 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 canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
-const cardHeadingBaseStyles = canvas_kit_styling_1.createStyles({ name: "qs1nz6", styles: "font-weight:var(--cnvs-sys-font-weight-bold, 700);margin-bottom:var(--cnvs-sys-space-x6, calc(0.25rem * 6));margin-top:0;" });
+// .cnvs-card-heading
+exports.cardHeadingStencil = canvas_kit_styling_1.createStencil({
+    extends: text_1.textStencil,
+    base: { name: "3b06e8", styles: "color:var(--cnvs-sys-color-text-strong);font-weight:var(--cnvs-sys-font-weight-bold);margin-bottom:var(--cnvs-sys-space-x6);margin-top:var(--cnvs-sys-space-zero);" },
+    defaultModifiers: { typeLevel: 'body.large' }
+}, "cnvs-card-heading");
 exports.CardHeading = common_1.createComponent('h3')({
     displayName: 'Card.Heading',
     Component: ({ children, ...elemProps }, ref, Element) => {
-        return (React.createElement(text_1.BodyText, Object.assign({ size: "large", color: "blackPepper400", fontWeight: "bold", marginBottom: "m", marginTop: 0, ref: ref, as: Element }, layout_1.mergeStyles(elemProps, cardHeadingBaseStyles)), children));
+        return (React.createElement(Element, Object.assign({ ref: ref }, layout_1.mergeStyles(elemProps, exports.cardHeadingStencil())), children));
     },
 });

package/dist/commonjs/checkbox/lib/CheckBackground.js

@@ -26,14 +26,14 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 exports.backgroundVars = canvas_kit_styling_1.createVars({ id: "cnvs-background", args: ["inner", "outer"] });
 const checkboxBackgroundStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "1yucu7c", styles: "align-items:center;background-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));border-radius:var(--cnvs-sys-shape-half, calc(0.25rem * 0.5));box-sizing:border-box;display:flex;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);justify-content:center;padding:var(--cnvs-sys-space-zero, 0) calc(var(--cnvs-sys-space-x1, 0.25rem) / 2);pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);border:0.0625rem solid var(--cnvs-base-palette-licorice-200, rgba(123,133,143,1));" },
+    base: { name: "ce0479", styles: "align-items:center;background-color:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-half);box-sizing:border-box;display:flex;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);justify-content:center;padding:var(--cnvs-sys-space-zero) calc(var(--cnvs-sys-space-x1) / 2);pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;width:calc(var(--cnvs-sys-space-x4) + 0.125rem);border:0.0625rem solid var(--cnvs-base-palette-licorice-200);" },
     modifiers: {
-        modifiers: {
-            error: { name: "zk536q", styles: "--cnvs-background-inner:var(--cnvs-brand-error-base, var(--cnvs-base-palette-cinnamon-500, rgba(222,46,33,1)));--cnvs-background-outer:transparent;" },
-            alert: { name: "1lt6c51", styles: "--cnvs-background-inner:var(--cnvs-brand-alert-base, var(--cnvs-base-palette-cantaloupe-600, rgba(192,108,0,1)));--cnvs-background-outer:var(--cnvs-brand-alert-darkest, var(--cnvs-base-palette-cantaloupe-400, rgba(255,161,38,1)));" }
+        error: {
+            error: { name: "b3e9dd", styles: "--cnvs-background-inner:var(--cnvs-brand-error-base, var(--cnvs-base-palette-cinnamon-500));--cnvs-background-outer:transparent;" },
+            alert: { name: "c13fa0", styles: "--cnvs-background-inner:var(--cnvs-brand-alert-base, var(--cnvs-base-palette-cantaloupe-600));--cnvs-background-outer:var(--cnvs-brand-alert-darkest, var(--cnvs-base-palette-cantaloupe-400));" }
         }
     }
-}, "checkbox-background");
+}, "cnvs-checkbox-background");
 exports.CheckBackground = common_1.createComponent('div')({
     displayName: 'CheckBackground',
     Component: ({ error, children }) => {

package/dist/commonjs/checkbox/lib/CheckboxCheck.js

@@ -28,20 +28,20 @@ const icon_1 = require("@workday/canvas-kit-react/icon");
 const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
 const CheckBackground_1 = require("./CheckBackground");
 const checkboxCheckStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "1ei0szh", styles: "display:flex;flex-direction:column;max-width:100%;pointer-events:none;transition:transform 200ms ease, opacity 200ms ease;span{margin-inline-start:calc(0.375rem * -1);transition:margin 200ms ease;}opacity:0;transform:scale(0.5);" },
+    base: { name: "94bef2", styles: "display:flex;flex-direction:column;max-width:100%;pointer-events:none;transition:transform 200ms ease, opacity 200ms ease;span{margin-inline-start:calc(0.375rem * -1);transition:margin 200ms ease;}opacity:0;transform:scale(0.5);" },
     modifiers: {
-        modifiers: {
-            true: { name: "1exxrn1", styles: "opacity:1;transform:scale(1);" }
+        checked: {
+            true: { name: "8cb110", styles: "opacity:1;transform:scale(1);" }
         },
-        modifiers: {
-            true: { name: "1exxrn1", styles: "opacity:1;transform:scale(1);" }
+        indeterminate: {
+            true: { name: "997065", styles: "opacity:1;transform:scale(1);" }
         },
-        modifiers: {
-            inverse: { name: "18xh6xb", styles: "& > div{background-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));}" }
+        variant: {
+            inverse: { name: "2928d4", styles: "& > div{background-color:var(--cnvs-brand-primary-base);}" }
         }
     }
-}, "checkbox-check");
-const indeterminateBoxStyles = canvas_kit_styling_1.createStyles({ name: "i3blod", styles: "width:calc(var(--cnvs-sys-space-x2, calc(0.25rem * 2)) + 0.125rem);height:calc(var(--cnvs-sys-space-x1, 0.25rem) / 2);background-color:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));" });
+}, "cnvs-checkbox-check");
+const indeterminateBoxStyles = canvas_kit_styling_1.createStyles({ name: "5445f8", styles: "width:calc(var(--cnvs-sys-space-x2) + 0.125rem);height:calc(var(--cnvs-sys-space-x1) / 2);background-color:var(--cnvs-brand-primary-accent);" });
 exports.CheckboxCheck = common_1.createComponent('div')({
     displayName: 'CheckboxCheck',
     Component: ({ checked, error, indeterminate, variant }) => {

package/dist/commonjs/checkbox/lib/CheckboxContainer.js

@@ -26,7 +26,7 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const text_1 = require("@workday/canvas-kit-react/text");
 exports.inputVars = canvas_kit_styling_1.createVars({ id: "cnvs-input", args: ["errorInner", "errorOuter", "alertInner", "alertOuter"] });
-const checkboxContainerStyles = canvas_kit_styling_1.createStyles({ name: "e6xila", styles: "display:flex;align-items:center;min-height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));position:relative;&>div{display:flex;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);min-width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);margin-top:0.1875rem;align-self:flex-start;}& > label{padding-inline-start:var(--cnvs-sys-space-x3, calc(var(--cnvs-base-unit, 0.25rem) * 3));}" });
+const checkboxContainerStyles = canvas_kit_styling_1.createStyles({ name: "ce6ecb", styles: "display:flex;align-items:center;min-height:var(--cnvs-sys-space-x6);position:relative;&>div{display:flex;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);min-width:calc(var(--cnvs-sys-space-x4) + 0.125rem);margin-top:0.1875rem;align-self:flex-start;}& > label{padding-inline-start:var(--cnvs-sys-space-x3);}" });
 exports.CheckboxContainer = common_1.createComponent('div')({
     displayName: 'CheckboxContainer',
     Component: ({ children, disabled, id, label, variant }) => {

package/dist/commonjs/checkbox/lib/CheckboxInput.js

@@ -26,30 +26,30 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const CheckBackground_1 = require("./CheckBackground");
 const checkboxInputStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "11nefzn", styles: "border-radius:var(--cnvs-sys-shape-half, calc(0.25rem * 0.5));width:var(--cnvs-sys-space-x6, calc(0.25rem * 6));height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));margin:var(--cnvs-sys-space-zero, 0);margin-top:calc(0.1875rem * -1);margin-inline-start:calc(0.1875rem * -1);position:absolute;opacity:0;&:not(:disabled){cursor:pointer;}&:where(:hover, .hover) ~ span:first-of-type{box-shadow:0 0 0 0.4375rem var(--cnvs-base-palette-soap-200, rgba(240,241,242,1));}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-500, rgba(51,61,71,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));background-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));}&:disabled ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-100, rgba(161,170,179,1));background-color:var(--cnvs-base-palette-soap-100, rgba(246,247,248,1));opacity:1;}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-light, rgba(166,210,255,1));background-color:var(--cnvs-brand-primary-light, rgba(166,210,255,1));}&:where(:focus-visible, :active, .focus, .active){outline:none;}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));border-width:0.125rem;box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 0px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:checked:focus-visible, &:indeterminate:focus-visible, &:checked.focus, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, var(--cnvs-base-palette-blueberry-400, rgba(8,117,225,1)));border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));border-width:0.125rem;span{margin-inline-start:calc(0.4375rem * -1);}}}" },
+    base: { name: "54c399", styles: "border-radius:var(--cnvs-sys-shape-half);width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);margin:var(--cnvs-sys-space-zero);margin-top:calc(0.1875rem * -1);margin-inline-start:calc(0.1875rem * -1);position:absolute;opacity:0;&:not(:disabled){cursor:pointer;}&:where(:hover, .hover) ~ span:first-of-type{box-shadow:0 0 0 0.4375rem var(--cnvs-base-palette-soap-200);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-500);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);background-color:var(--cnvs-brand-primary-base);}&:disabled ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-100);background-color:var(--cnvs-base-palette-soap-100);opacity:1;}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-light);background-color:var(--cnvs-brand-primary-light);}&:where(:focus-visible, :active, .focus, .active){outline:none;}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 0px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:checked:focus-visible, &:indeterminate:focus-visible, &:checked.focus, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline);border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;span{margin-inline-start:calc(0.4375rem * -1);}}}" },
     modifiers: {
-        modifiers: {
-            inverse: { name: "k4w4a2", styles: "& ~ span:first-of-type{opacity:var(--cnvs-sys-opacity-disabled, 0.4);}& ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));background-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}&:disabled ~ div:first-of-type{background-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));opacity:var(--cnvs-sys-opacity-disabled, 0.4);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));background-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));box-shadow:0 0 0 0px var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}&:checked:focus-visible, &:checked.focus, &:indeterminate:focus-visible, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)), 0 0 0 4px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));border-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}}" }
+        variant: {
+            inverse: { name: "d7f48e", styles: "& ~ span:first-of-type{opacity:var(--cnvs-sys-opacity-disabled);}& ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);background-color:var(--cnvs-base-palette-french-vanilla-100);}&:disabled ~ div:first-of-type{background-color:var(--cnvs-base-palette-soap-300);opacity:var(--cnvs-sys-opacity-disabled);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);background-color:var(--cnvs-base-palette-soap-300);}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-base-palette-black-pepper-400);box-shadow:0 0 0 0px var(--cnvs-base-palette-black-pepper-400), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100);}&:checked:focus-visible, &:checked.focus, &:indeterminate:focus-visible, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-black-pepper-400), 0 0 0 4px var(--cnvs-base-palette-french-vanilla-100);border-color:var(--cnvs-base-palette-french-vanilla-100);}}" }
         },
-        modifiers: {
-            true: { name: "fg9j9p", styles: "&:where(:hover, .hover) ~ span:first-of-type{box-shadow:none;}" }
+        disabled: {
+            true: { name: "8a663b", styles: "&:where(:hover, .hover) ~ span:first-of-type{box-shadow:none;}" }
         },
-        modifiers: {
-            error: { name: "cgjiki", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border-color:var(--cnvs-background-inner);box-shadow:\n            0 0 0 0.0625rem var(--cnvs-background-inner), \n            0 0 0 0.125rem var(--cnvs-background-outer);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n            0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)),\n            0 0 0 0.25rem var(--cnvs-background-inner),\n            0 0 0 0.3125rem var(--cnvs-background-outer);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}" },
-            alert: { name: "hps6d7", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-background-inner);box-shadow:\n            0 0 0 0.0625rem var(--cnvs-background-inner), \n            0 0 0 0.125rem var(--cnvs-background-outer);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n            0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)),\n            0 0 0 0.25rem var(--cnvs-background-inner),\n            0 0 0 0.3125rem var(--cnvs-background-outer);}" }
+        error: {
+            error: { name: "020b45", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border-color:var(--cnvs-background-inner);box-shadow:\n            0 0 0 0.0625rem var(--cnvs-background-inner), \n            0 0 0 0.125rem var(--cnvs-background-outer);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n            0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100),\n            0 0 0 0.25rem var(--cnvs-background-inner),\n            0 0 0 0.3125rem var(--cnvs-background-outer);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}" },
+            alert: { name: "b5c214", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-background-inner);box-shadow:\n            0 0 0 0.0625rem var(--cnvs-background-inner), \n            0 0 0 0.125rem var(--cnvs-background-outer);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n            0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100),\n            0 0 0 0.25rem var(--cnvs-background-inner),\n            0 0 0 0.3125rem var(--cnvs-background-outer);}" }
         }
     },
     compound: [
         {
             modifiers: { variant: 'inverse', error: 'error' },
-            styles: { name: "b2voah", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}" }
+            styles: { name: "bc9f16", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}" }
         },
         {
             modifiers: { variant: 'inverse', error: 'alert' },
-            styles: { name: "b2voah", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}" }
+            styles: { name: "bdcc4f", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}" }
         }
     ]
-}, "checkbox-input");
+}, "cnvs-checkbox-input");
 exports.CheckboxInput = common_1.createComponent('input')({
     displayName: 'CheckboxInput',
     Component: ({ variant, error, ...elemProps }, ref, Element) => {

package/dist/commonjs/checkbox/lib/CheckboxRipple.js

@@ -24,7 +24,7 @@ const React = __importStar(require("react"));
 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");
-const checkboxRippleStyles = canvas_kit_styling_1.createStyles({ name: "1pxif3r", styles: "border-radius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));box-shadow:none;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);transition:box-shadow 150ms ease-out;position:absolute;pointer-events:none;" });
+const checkboxRippleStyles = canvas_kit_styling_1.createStyles({ name: "b4530c", styles: "border-radius:var(--cnvs-sys-shape-round);box-shadow:none;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);width:calc(var(--cnvs-sys-space-x4) + 0.125rem);transition:box-shadow 150ms ease-out;position:absolute;pointer-events:none;" });
 exports.CheckboxRipple = common_1.createComponent('span')({
     displayName: 'CheckboxRipple',
     Component: elemProps => {

package/dist/commonjs/collection/lib/ListBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListBox.d.ts","sourceRoot":"","sources":["../../../../collection/lib/ListBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAM,IAAI,EAAc,MAAM,kCAAkC,CAAC;AAQxE,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC/F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC5E;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMtB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOrB,CAAC;AA0BH;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKhB;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyBN,CAAC"}
+{"version":3,"file":"ListBox.d.ts","sourceRoot":"","sources":["../../../../collection/lib/ListBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAM,IAAI,EAAc,MAAM,kCAAkC,CAAC;AAQxE,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC/F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC5E;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMtB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOrB,CAAC;AA0BH;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKhB;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BN,CAAC"}

package/dist/commonjs/collection/lib/ListBox.js

@@ -28,17 +28,17 @@ exports.useListBox = common_1.createElemPropsHook(useListModel_1.useListModel)(m
     };
 });
 const listBoxContainerStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "roynbj", styles: "box-sizing:border-box;" },
+    base: { name: "7a791a", styles: "box-sizing:border-box;" },
     modifiers: {
-        modifiers: {
-            vertical: { name: "13v3rg8", styles: "overflow-y:auto;" },
-            horizontal: { name: "mru7yp", styles: "overflow-y:undefined;" }
+        orientation: {
+            vertical: { name: "dcd369", styles: "overflow-y:auto;" },
+            horizontal: { name: "453e0f", styles: "overflow-y:undefined;" }
         }
     }
-}, "list-box-container");
+}, "cnvs-list-box-container");
 const listBoxStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "1rhzmpl", styles: "flex-direction:column;margin-top:var(--cnvs-sys-space-zero, 0);margin-bottom:var(--cnvs-sys-space-zero, 0);" }
-}, "list-box");
+    base: { name: "aef6ed", styles: "flex-direction:column;margin-top:var(--cnvs-sys-space-zero);margin-bottom:var(--cnvs-sys-space-zero);" }
+}, "cnvs-list-box");
 /**
  * The `ListBox` component that offers vertical rendering of a collection in the form of a
  * 2-dimension list. It supports virtualization, rendering only visible items in the DOM while also
@@ -75,6 +75,12 @@ exports.ListBox = common_1.createContainer('ul')({
 })(({ height, maxHeight, marginY, marginBottom, overflowY, marginTop, ...elemProps }, Element, model) => {
     // We're removing `marginY, marginBottom, overflowY, marginTo` from elemProps and applying them to the container as to not interfere with the virtualization size. We set
     // the `marginY` on the Flex to `0` to avoid inaccurate scrollbars
-    return (react_1.default.createElement("div", Object.assign({ ref: model.state.containerRef }, layout_1.mergeStyles({ maxHeight, marginBottom: marginY, marginTop: marginY }, listBoxContainerStencil({ orientation: model.state.orientation }))),
+    return (react_1.default.createElement("div", Object.assign({ ref: model.state.containerRef }, canvas_kit_styling_1.handleCsProp({
+        style: {
+            maxHeight,
+            marginBottom: marginY || marginBottom,
+            marginTop: marginY || marginBottom,
+        },
+    }, listBoxContainerStencil({ orientation: model.state.orientation }))),
         react_1.default.createElement(layout_1.Flex, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, listBoxStencil())), useListRenderItem_1.useListRenderItems(model, elemProps.children))));
 });

package/dist/commonjs/combobox/lib/ComboboxMenuItem.js

@@ -42,16 +42,16 @@ exports.useComboboxMenuItem = common_1.composeHooks(common_1.createElemPropsHook
     };
 }), collection_1.useListItemRegister, collection_1.useListItemAllowChildStrings);
 const comboboxMenuItemIconStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "1hcehcy", styles: "align-self:start;" }
-}, "combobox-menu-item-icon");
+    base: { name: "0631bc", styles: "align-self:start;" }
+}, "cnvs-combobox-menu-item-icon");
 exports.ComboboxMenuItemIcon = common_1.createSubcomponent('span')({
     modelHook: useComboboxModel_1.useComboboxModel,
 })((elemProps, Element) => {
     return react_1.default.createElement(icon_1.SystemIcon, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, comboboxMenuItemIconStencil())));
 });
 const comboboxMenuItemStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "4xv1tq", styles: "min-height:var(--cnvs-sys-space-x10, calc(0.25rem * 10));" }
-}, "combobox-menu-item");
+    base: { name: "1963d4", styles: "min-height:var(--cnvs-sys-space-x10);" }
+}, "cnvs-combobox-menu-item");
 exports.ComboboxMenuItem = common_1.createSubcomponent('li')({
     modelHook: useComboboxModel_1.useComboboxModel,
     elemPropsHook: exports.useComboboxMenuItem,

package/dist/commonjs/combobox/lib/ComboboxMenuList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenuList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAU,YAAY,EAAC,MAAM,sCAAsC,CAAC;AAO3E,MAAM,WAAW,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,YAAY,CAAC,CAAC,CAAC;CAAG;AAE1E;;;;GAIG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAM9B,CAAC;AAOH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAc3B,CAAC"}
+{"version":3,"file":"ComboboxMenuList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAU,YAAY,EAAC,MAAM,sCAAsC,CAAC;AAM3E,MAAM,WAAW,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,YAAY,CAAC,CAAC,CAAC;CAAG;AAE1E;;;;GAIG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAM9B,CAAC;AAOH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAc3B,CAAC"}

package/dist/commonjs/combobox/lib/ComboboxMenuList.js

@@ -11,7 +11,6 @@ const collection_1 = require("@workday/canvas-kit-react/collection");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const useComboboxModel_1 = require("./hooks/useComboboxModel");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
-const layout_1 = require("@workday/canvas-kit-react/layout");
 /**
  * The `listbox` uses `aria-labelledby` pointing to the {@link ComboboxInput Combobox.Input}. This
  * input should be labelled by a form field label for proper accessibility. Use {@link FormField} to
@@ -24,13 +23,13 @@ exports.useComboboxMenuList = common_1.createElemPropsHook(menu_1.useMenuModel)(
         id: `${model.state.id}-list`,
     };
 });
-const comoboxMenuListStencil = canvas_kit_styling_1.createStencil({
-    base: { name: "0", styles: "" },
+const comboboxMenuListStencil = canvas_kit_styling_1.createStencil({
+    base: { name: "030ac8", styles: "" },
     extends: menu_1.menuListStencil
-}, "comobox-menu-list");
+}, "cnvs-combobox-menu-list");
 exports.ComboboxMenuList = common_1.createSubcomponent('ul')({
     modelHook: useComboboxModel_1.useComboboxModel,
     elemPropsHook: exports.useComboboxMenuList,
 })(({ children, ...elemProps }, Element, model) => {
-    return (react_1.default.createElement(collection_1.ListBox, Object.assign({ as: Element, model: model, marginY: canvas_kit_styling_1.cssVar(canvas_tokens_web_1.system.space.x2) }, layout_1.mergeStyles(elemProps, comoboxMenuListStencil({ orientation: model.state.orientation }))), children));
+    return (react_1.default.createElement(collection_1.ListBox, Object.assign({ as: Element, model: model, marginY: canvas_kit_styling_1.cssVar(canvas_tokens_web_1.system.space.x2) }, canvas_kit_styling_1.handleCsProp(elemProps, comboboxMenuListStencil({ orientation: model.state.orientation }))), children));
 });

package/dist/commonjs/common/lib/AccessibleHide.js

@@ -39,7 +39,7 @@ exports.accessibleHide = {
     padding: 0,
     border: 0,
 };
-const accessibleHideStyles = canvas_kit_styling_1.createStyles({ name: "i19yjz", styles: "clip:rect(1px, 1px, 1px, 1px);clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);position:absolute;overflow:hidden;white-space:nowrap;height:1px;width:1px;margin:-1px;padding:0;border:0;" });
+const accessibleHideStyles = canvas_kit_styling_1.createStyles({ name: "ad6b80", styles: "clip:rect(1px, 1px, 1px, 1px);clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);position:absolute;overflow:hidden;white-space:nowrap;height:1px;width:1px;margin:-1px;padding:0;border:0;" });
 /**
  * A convenient component wrapper to visually hide content, while still making it accessible to screen readers
  */

package/dist/commonjs/common/lib/CanvasProvider.js

@@ -27,7 +27,7 @@ const theming_1 = require("./theming");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 // copied from brand/_variables.css
-const defaultBranding = canvas_kit_styling_1.createStyles({ name: "fijyj9", styles: "--cnvs-brand-error-darkest:rgba(128,22,14,1);--cnvs-brand-common-alert-inner:var(--cnvs-base-palette-cantaloupe-400, rgba(255,161,38,1));--cnvs-brand-common-error-inner:var(--cnvs-base-palette-cinnamon-500, rgba(222,46,33,1));--cnvs-brand-common-focus-outline:var(--cnvs-base-palette-blueberry-400, rgba(8,117,225,1));--cnvs-brand-neutral-accent:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-brand-neutral-darkest:var(--cnvs-base-palette-licorice-400, rgba(74,85,97,1));--cnvs-brand-neutral-dark:var(--cnvs-base-palette-licorice-300, rgba(94,106,117,1));--cnvs-brand-neutral-base:var(--cnvs-base-palette-soap-600, rgba(185,192,199,1));--cnvs-brand-neutral-light:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));--cnvs-brand-neutral-lightest:var(--cnvs-base-palette-soap-200, rgba(240,241,242,1));--cnvs-brand-success-accent:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-brand-success-darkest:var(--cnvs-base-palette-green-apple-600, rgba(33,122,55,1));--cnvs-brand-success-dark:var(--cnvs-base-palette-green-apple-500, rgba(49,156,76,1));--cnvs-brand-success-base:var(--cnvs-base-palette-green-apple-400, rgba(67,196,99,1));--cnvs-brand-success-light:var(--cnvs-base-palette-green-apple-300, rgba(95,227,128,1));--cnvs-brand-success-lightest:var(--cnvs-base-palette-green-apple-100, rgba(235,255,240,1));--cnvs-brand-error-accent:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-brand-error-dark:var(--cnvs-base-palette-cinnamon-600, rgba(163,27,18,1));--cnvs-brand-error-base:var(--cnvs-base-palette-cinnamon-500, rgba(222,46,33,1));--cnvs-brand-error-light:var(--cnvs-base-palette-cinnamon-200, rgba(252,201,197,1));--cnvs-brand-error-lightest:var(--cnvs-base-palette-cinnamon-100, rgba(255,239,238,1));--cnvs-brand-alert-accent:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-brand-alert-darkest:var(--cnvs-base-palette-cantaloupe-600, rgba(192,108,0,1));--cnvs-brand-alert-dark:var(--cnvs-base-palette-cantaloupe-500, rgba(243,139,0,1));--cnvs-brand-alert-base:var(--cnvs-base-palette-cantaloupe-400, rgba(255,161,38,1));--cnvs-brand-alert-light:var(--cnvs-base-palette-cantaloupe-200, rgba(252,212,159,1));--cnvs-brand-alert-lightest:var(--cnvs-base-palette-cantaloupe-100, rgba(255,238,217,1));--cnvs-brand-primary-accent:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-brand-primary-darkest:var(--cnvs-base-palette-blueberry-600, rgba(0,67,135,1));--cnvs-brand-primary-dark:var(--cnvs-base-palette-blueberry-500, rgba(0,92,185,1));--cnvs-brand-primary-base:var(--cnvs-base-palette-blueberry-400, rgba(8,117,225,1));--cnvs-brand-primary-light:var(--cnvs-base-palette-blueberry-200, rgba(166,210,255,1));--cnvs-brand-primary-lightest:var(--cnvs-base-palette-blueberry-100, rgba(215,234,252,1));--cnvs-brand-gradient-primary:linear-gradient(90deg, var(--cnvs-brand-primary-base, rgba(8,117,225,1)) 0%, var(--cnvs-brand-primary-dark, rgba(0,92,185,1)) 100%);" });
+const defaultBranding = canvas_kit_styling_1.createStyles({ name: "2fed25", styles: "--cnvs-brand-error-darkest:rgba(128,22,14,1);--cnvs-brand-common-alert-inner:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-common-error-inner:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-common-focus-outline:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-neutral-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-neutral-darkest:var(--cnvs-base-palette-licorice-400);--cnvs-brand-neutral-dark:var(--cnvs-base-palette-licorice-300);--cnvs-brand-neutral-base:var(--cnvs-base-palette-soap-600);--cnvs-brand-neutral-light:var(--cnvs-base-palette-soap-300);--cnvs-brand-neutral-lightest:var(--cnvs-base-palette-soap-200);--cnvs-brand-success-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-success-darkest:var(--cnvs-base-palette-green-apple-600);--cnvs-brand-success-dark:var(--cnvs-base-palette-green-apple-500);--cnvs-brand-success-base:var(--cnvs-base-palette-green-apple-400);--cnvs-brand-success-light:var(--cnvs-base-palette-green-apple-300);--cnvs-brand-success-lightest:var(--cnvs-base-palette-green-apple-100);--cnvs-brand-error-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-error-dark:var(--cnvs-base-palette-cinnamon-600);--cnvs-brand-error-base:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-error-light:var(--cnvs-base-palette-cinnamon-200);--cnvs-brand-error-lightest:var(--cnvs-base-palette-cinnamon-100);--cnvs-brand-alert-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-alert-darkest:var(--cnvs-base-palette-cantaloupe-600);--cnvs-brand-alert-dark:var(--cnvs-base-palette-cantaloupe-500);--cnvs-brand-alert-base:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-alert-light:var(--cnvs-base-palette-cantaloupe-200);--cnvs-brand-alert-lightest:var(--cnvs-base-palette-cantaloupe-100);--cnvs-brand-primary-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-primary-darkest:var(--cnvs-base-palette-blueberry-600);--cnvs-brand-primary-dark:var(--cnvs-base-palette-blueberry-500);--cnvs-brand-primary-base:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-primary-light:var(--cnvs-base-palette-blueberry-200);--cnvs-brand-primary-lightest:var(--cnvs-base-palette-blueberry-100);--cnvs-brand-gradient-primary:linear-gradient(90deg, var(--cnvs-brand-primary-base) 0%, var(--cnvs-brand-primary-dark) 100%);" });
 const mappedKeys = {
     lightest: 'lightest',
     light: 'light',

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

@@ -3,5 +3,5 @@ export * from './lib/AppletIcon';
 export * from './lib/SystemIcon';
 export * from './lib/SystemIconCircle';
 export * from './lib/Graphic';
-export * from './lib/Svg';
+export { Svg, SvgProps, svgStencil } from './lib/Svg';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAC,GAAG,EAAE,QAAQ,EAAE,UAAU,EAAC,MAAM,WAAW,CAAC"}

package/dist/commonjs/icon/index.js

@@ -10,9 +10,12 @@ 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 });
+exports.svgStencil = exports.Svg = void 0;
 __exportStar(require("./lib/AccentIcon"), exports);
 __exportStar(require("./lib/AppletIcon"), exports);
 __exportStar(require("./lib/SystemIcon"), exports);
 __exportStar(require("./lib/SystemIconCircle"), exports);
 __exportStar(require("./lib/Graphic"), exports);
-__exportStar(require("./lib/Svg"), exports);
+var Svg_1 = require("./lib/Svg");
+Object.defineProperty(exports, "Svg", { enumerable: true, get: function () { return Svg_1.Svg; } });
+Object.defineProperty(exports, "svgStencil", { enumerable: true, get: function () { return Svg_1.svgStencil; } });