@workday/canvas-kit-react 12.0.0-alpha.862-next.0 → 12.0.0-alpha.898-next.0

package/dist/es6/testing/lib/propTypes.d.ts

@@ -1,14 +1,14 @@
-export declare type PropDeclaration = {
+export type PropDeclaration = {
     value: any;
     label: string;
 };
-export declare type PropsDeclaration = {
+export type PropsDeclaration = {
     [key: string]: PropDeclaration[];
 };
-export declare type Props = {
+export type Props = {
     [key: string]: any;
 };
-export declare type PropCombination = {
+export type PropCombination = {
     label: string;
     props: Props;
 };

package/dist/es6/testing/lib/propTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"propTypes.d.ts","sourceRoot":"","sources":["../../../../testing/lib/propTypes.ts"],"names":[],"mappings":"AAAA,oBAAY,eAAe,GAAG;IAC5B,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,oBAAY,gBAAgB,GAAG;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,eAAe,EAAE,CAAA;CAAC,CAAC;AAElE,oBAAY,KAAK,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC;CACd,CAAC"}
+{"version":3,"file":"propTypes.d.ts","sourceRoot":"","sources":["../../../../testing/lib/propTypes.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,eAAe,EAAE,CAAA;CAAC,CAAC;AAElE,MAAM,MAAM,KAAK,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC;CACd,CAAC"}

package/dist/es6/text/lib/LabelText.js

@@ -6,21 +6,21 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { textStencil } from './Text';
 const labelTextStencil = createStencil({
     extends: textStencil,
-    base: { name: "06da77", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-sys-color-text-default);" },
+    base: { name: "hbbco", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-sys-color-text-default);" },
     modifiers: {
         disabled: {
-            true: { name: "71fefd", styles: "cursor:default;color:var(--cnvs-sys-color-text-disabled);" }
+            true: { name: "hbbcp", styles: "cursor:default;color:var(--cnvs-sys-color-text-disabled);" }
         },
         variant: {
-            inverse: { name: "e7666d", styles: "color:var(--cnvs-sys-color-text-inverse);" },
-            error: { name: "3c432f", styles: "color:var(--cnvs-sys-color-text-critical-default);" },
-            hint: { name: "65f07b", styles: "color:var(--cnvs-sys-color-text-hint);" }
+            inverse: { name: "hbbcq", styles: "color:var(--cnvs-sys-color-text-inverse);" },
+            error: { name: "hbbcr", styles: "color:var(--cnvs-sys-color-text-critical-default);" },
+            hint: { name: "hbbcs", styles: "color:var(--cnvs-sys-color-text-hint);" }
         }
     },
     compound: [
         {
             modifiers: { variant: 'inverse', disabled: true },
-            styles: { name: "30e2b3", styles: "opacity:var(--cnvs-sys-opacity-disabled);color:var(--cnvs-sys-color-text-inverse);" }
+            styles: { name: "hbbct", styles: "opacity:var(--cnvs-sys-opacity-disabled);color:var(--cnvs-sys-color-text-inverse);" }
         }
     ]
 }, "label-text-047ddd");
@@ -45,6 +45,6 @@ const labelTextStencil = createStencil({
 export const LabelText = createComponent('label')({
     displayName: 'Label',
     Component: ({ disabled, typeLevel, variant, ...elemProps }, ref, Element) => {
-        return (React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, labelTextStencil({ variant, disabled, typeLevel })))));
+        return (React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, labelTextStencil({ variant, disabled, typeLevel })) }));
     },
 });

package/dist/es6/text/lib/Text.d.ts

@@ -1,7 +1,7 @@
 import { system } from '@workday/canvas-tokens-web';
 import { BoxProps } from '@workday/canvas-kit-react/layout';
-declare type TypeSize = 'large' | 'medium' | 'small';
-declare type TokenName = `${keyof typeof system.type}.${TypeSize}`;
+type TypeSize = 'large' | 'medium' | 'small';
+type TokenName = `${keyof typeof system.type}.${TypeSize}`;
 export interface TextProps extends BoxProps {
     /**
      * Type token as string with level and size separated by dot.

package/dist/es6/text/lib/Text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../../text/lib/Text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAGlD,OAAO,EAAc,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAEvE,aAAK,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC7C,aAAK,SAAS,GAAG,GAAG,MAAM,OAAO,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE,CAAC;AAE3D,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CACxC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA+DtB,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,IAAI,gFASf,CAAC"}
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../../text/lib/Text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAGlD,OAAO,EAAc,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAEvE,KAAK,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC7C,KAAK,SAAS,GAAG,GAAG,MAAM,OAAO,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE,CAAC;AAE3D,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CACxC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA+DtB,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,IAAI,gFASf,CAAC"}

package/dist/es6/text/lib/Text.js

@@ -4,30 +4,30 @@ import { createComponent } from '@workday/canvas-kit-react/common';
 import { createStencil } from '@workday/canvas-kit-styling';
 import { mergeStyles } from '@workday/canvas-kit-react/layout';
 export const textStencil = createStencil({
-    base: { name: "474d4e", styles: "box-sizing:border-box;" },
+    base: { name: "hbbc4", styles: "box-sizing:border-box;" },
     modifiers: {
         typeLevel: {
             // Title level styles
-            'title.large': { name: "ec2152", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-600);font-size:var(--cnvs-base-font-size-600);color:var(--cnvs-sys-color-text-strong);" },
-            'title.medium': { name: "10cd08", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-500);font-size:var(--cnvs-base-font-size-500);color:var(--cnvs-sys-color-text-strong);" },
-            'title.small': { name: "2d40bb", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-400);font-size:var(--cnvs-base-font-size-400);color:var(--cnvs-sys-color-text-strong);" },
+            'title.large': { name: "hbbc5", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-600);font-size:var(--cnvs-base-font-size-600);color:var(--cnvs-sys-color-text-strong);" },
+            'title.medium': { name: "hbbc6", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-500);font-size:var(--cnvs-base-font-size-500);color:var(--cnvs-sys-color-text-strong);" },
+            'title.small': { name: "hbbc7", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-400);font-size:var(--cnvs-base-font-size-400);color:var(--cnvs-sys-color-text-strong);" },
             // Heading level styles
-            'heading.large': { name: "e7495d", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-350);font-size:var(--cnvs-base-font-size-300);color:var(--cnvs-sys-color-text-strong);" },
-            'heading.medium': { name: "57bd0c", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-300);font-size:var(--cnvs-base-font-size-250);color:var(--cnvs-sys-color-text-strong);" },
-            'heading.small': { name: "453f9f", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-250);font-size:var(--cnvs-base-font-size-200);color:var(--cnvs-sys-color-text-strong);" },
+            'heading.large': { name: "hbbc8", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-350);font-size:var(--cnvs-base-font-size-300);color:var(--cnvs-sys-color-text-strong);" },
+            'heading.medium': { name: "hbbc9", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-300);font-size:var(--cnvs-base-font-size-250);color:var(--cnvs-sys-color-text-strong);" },
+            'heading.small': { name: "hbbca", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-700);line-height:var(--cnvs-base-line-height-250);font-size:var(--cnvs-base-font-size-200);color:var(--cnvs-sys-color-text-strong);" },
             // Body level styles
-            'body.large': { name: "2ecfeb", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-200);font-size:var(--cnvs-base-font-size-150);color:var(--cnvs-sys-color-text-default);" },
-            'body.medium': { name: "72deca", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-200);font-size:var(--cnvs-base-font-size-125);color:var(--cnvs-sys-color-text-default);" },
-            'body.small': { name: "005094", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-150);font-size:var(--cnvs-base-font-size-100);letter-spacing:var(--cnvs-base-letter-spacing-200);color:var(--cnvs-sys-color-text-default);" },
+            'body.large': { name: "hbbcb", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-200);font-size:var(--cnvs-base-font-size-150);color:var(--cnvs-sys-color-text-default);" },
+            'body.medium': { name: "hbbcc", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-200);font-size:var(--cnvs-base-font-size-125);color:var(--cnvs-sys-color-text-default);" },
+            'body.small': { name: "hbbcd", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-150);font-size:var(--cnvs-base-font-size-100);letter-spacing:var(--cnvs-base-letter-spacing-200);color:var(--cnvs-sys-color-text-default);" },
             // Subtext level styles
-            'subtext.large': { name: "3c4fca", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-sys-color-text-default);" },
-            'subtext.medium': { name: "41ff51", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-50);font-size:var(--cnvs-base-font-size-50);letter-spacing:var(--cnvs-base-letter-spacing-100);color:var(--cnvs-sys-color-text-default);" },
-            'subtext.small': { name: "6e1406", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-50);font-size:var(--cnvs-base-font-size-25);letter-spacing:var(--cnvs-base-letter-spacing-50);color:var(--cnvs-sys-color-text-default);" }
+            'subtext.large': { name: "hbbce", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-sys-color-text-default);" },
+            'subtext.medium': { name: "hbbcf", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-50);font-size:var(--cnvs-base-font-size-50);letter-spacing:var(--cnvs-base-letter-spacing-100);color:var(--cnvs-sys-color-text-default);" },
+            'subtext.small': { name: "hbbcg", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-50);font-size:var(--cnvs-base-font-size-25);letter-spacing:var(--cnvs-base-letter-spacing-50);color:var(--cnvs-sys-color-text-default);" }
         },
         variant: {
-            error: { name: "0003fd", styles: "color:var(--cnvs-sys-color-text-critical-default);" },
-            hint: { name: "b00e72", styles: "color:var(--cnvs-sys-color-text-hint);" },
-            inverse: { name: "8bc750", styles: "color:var(--cnvs-sys-color-text-inverse);" }
+            error: { name: "hbbch", styles: "color:var(--cnvs-sys-color-text-critical-default);" },
+            hint: { name: "hbbci", styles: "color:var(--cnvs-sys-color-text-hint);" },
+            inverse: { name: "hbbcj", styles: "color:var(--cnvs-sys-color-text-inverse);" }
         }
     }
 }, "text-e3da06");
@@ -65,6 +65,6 @@ export const textStencil = createStencil({
 export const Text = createComponent('span')({
     displayName: 'Text',
     Component: ({ children, typeLevel, variant, ...elemProps }, ref, Element) => {
-        return (React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, textStencil({ typeLevel, variant }))), children));
+        return (React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, textStencil({ typeLevel, variant })) }, children));
     },
 });

package/dist/es6/text/lib/TypeLevelComponents.d.ts

@@ -1,5 +1,5 @@
 import { TextProps } from './Text';
-declare type Size = 'large' | 'medium' | 'small';
+type Size = 'large' | 'medium' | 'small';
 /**
  * Prop interface for type level specific components:
  * Title, Heading, BodyText, Subtext.

package/dist/es6/text/lib/TypeLevelComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TypeLevelComponents.d.ts","sourceRoot":"","sources":["../../../../text/lib/TypeLevelComponents.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,SAAS,EAAc,MAAM,QAAQ,CAAC;AAI9C,aAAK,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzC;;;GAGG;AACH,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC;IAClE;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;CACZ;AAOD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,OAAO,kFAMlB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,QAAQ,kFAMnB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,OAAO,mFAMlB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,KAAK,mFAMhB,CAAC"}
+{"version":3,"file":"TypeLevelComponents.d.ts","sourceRoot":"","sources":["../../../../text/lib/TypeLevelComponents.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,SAAS,EAAc,MAAM,QAAQ,CAAC;AAI9C,KAAK,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzC;;;GAGG;AACH,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC;IAClE;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;CACZ;AAOD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,OAAO,kFAMlB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,QAAQ,kFAMnB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,OAAO,mFAMlB,CAAC;AAOH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,KAAK,mFAMhB,CAAC"}

package/dist/es6/text/lib/TypeLevelComponents.js

@@ -5,7 +5,7 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { createStencil } from '@workday/canvas-kit-styling';
 const subtextStencil = createStencil({
     extends: textStencil,
-    base: { name: "26be9a", styles: "box-sizing:border-box;" }
+    base: { name: "hbbck", styles: "box-sizing:border-box;" }
 }, "subtext-4e8604");
 /**
  * This component is intended to be used for small subtext content or in tight spaces.
@@ -35,12 +35,12 @@ export const Subtext = createComponent('p')({
     displayName: 'Subtext',
     Component: ({ size, variant, ...elemProps }, ref, Element) => {
         const typeLevel = `subtext.${size}`;
-        return React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, subtextStencil({ typeLevel, variant }))));
+        return React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, subtextStencil({ typeLevel, variant })) });
     },
 });
 const bodyTextStencil = createStencil({
     extends: textStencil,
-    base: { name: "b117dc", styles: "box-sizing:border-box;" }
+    base: { name: "hbbcl", styles: "box-sizing:border-box;" }
 }, "body-text-44de3e");
 /**
  * This component is intended to be used for standard body text.
@@ -70,12 +70,12 @@ export const BodyText = createComponent('p')({
     displayName: 'BodyText',
     Component: ({ size, variant, ...elemProps }, ref, Element) => {
         const typeLevel = `body.${size}`;
-        return React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, bodyTextStencil({ typeLevel, variant }))));
+        return React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, bodyTextStencil({ typeLevel, variant })) });
     },
 });
 const headingStencil = createStencil({
     extends: textStencil,
-    base: { name: "7ba7e1", styles: "box-sizing:border-box;" }
+    base: { name: "hbbcm", styles: "box-sizing:border-box;" }
 }, "heading-5a3efc");
 /**
  * This component is intended to be used for headings and large text.
@@ -105,12 +105,12 @@ export const Heading = createComponent('h2')({
     displayName: 'Heading',
     Component: ({ size, variant, ...elemProps }, ref, Element) => {
         const typeLevel = `heading.${size}`;
-        return React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, headingStencil({ typeLevel, variant }))));
+        return React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, headingStencil({ typeLevel, variant })) });
     },
 });
 const titleStencil = createStencil({
     extends: textStencil,
-    base: { name: "23b801", styles: "box-sizing:border-box;" }
+    base: { name: "hbbcn", styles: "box-sizing:border-box;" }
 }, "title-2c12c2");
 /**
  * This component is intended to be used large page titles.
@@ -140,6 +140,6 @@ export const Title = createComponent('h1')({
     displayName: 'Title',
     Component: ({ size, variant, ...elemProps }, ref, Element) => {
         const typeLevel = `title.${size}`;
-        return React.createElement(Element, Object.assign({ ref: ref }, mergeStyles(elemProps, titleStencil({ typeLevel, variant }))));
+        return React.createElement(Element, { ref: ref, ...mergeStyles(elemProps, titleStencil({ typeLevel, variant })) });
     },
 });

package/dist/es6/text-area/lib/TextArea.d.ts

@@ -1,5 +1,5 @@
 import { GrowthBehavior, ErrorType } from '@workday/canvas-kit-react/common';
-export declare type ValueOf<T> = T[keyof T];
+export type ValueOf<T> = T[keyof T];
 export interface TextAreaProps extends GrowthBehavior {
     /**
      * The type of error associated with the TextArea (if applicable).
@@ -45,22 +45,22 @@ export declare const textAreaStencil: import("@workday/canvas-kit-styling").Sten
     error: {
         error: {
             borderColor: "--cnvs-brand-error-base";
-            boxShadow: string;
+            boxShadow: `inset 0 0 0 ${string} --cnvs-brand-error-base`;
             '&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled])': {
                 borderColor: "--cnvs-brand-error-base";
             };
             '&:focus-visible:not([disabled]), &.focus:not([disabled])': {
-                boxShadow: string;
+                boxShadow: `inset 0 0 0 ${string} --cnvs-brand-error-base, 0 0 0 2px --cnvs-sys-color-border-inverse, 0 0 0 4px --cnvs-brand-common-focus-outline`;
             };
         };
         alert: {
             borderColor: "--cnvs-brand-alert-darkest";
-            boxShadow: string;
+            boxShadow: `inset 0 0 0 ${string} --cnvs-brand-alert-base`;
             '&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled])': {
                 borderColor: "--cnvs-brand-alert-darkest";
             };
             '&:focus-visible:not([disabled]), &.focus:not([disabled])': {
-                boxShadow: string;
+                boxShadow: `inset 0 0 0 ${string} --cnvs-brand-alert-base,\n        0 0 0 2px --cnvs-sys-color-border-inverse,\n        0 0 0 4px --cnvs-brand-common-focus-outline`;
             };
         };
     };

package/dist/es6/text-area/lib/TextArea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextArea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,cAAc,EAAE,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAI5F,oBAAY,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAEpC,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,OAAO,uBAAuB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,uBAAuB;;;;;CAK1B,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBA6B1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;CAWnB,CAAC"}
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextArea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,cAAc,EAAE,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAI5F,MAAM,MAAM,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAEpC,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,OAAO,uBAAuB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,uBAAuB;;;;;CAK1B,CAAC;AAEX,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBA6B1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;CAWnB,CAAC"}

package/dist/es6/text-area/lib/TextArea.js

@@ -11,13 +11,13 @@ export const TextAreaResizeDirection = {
 };
 export const textAreaStencil = createStencil({
     extends: textInputStencil,
-    base: { name: "22b420", styles: "box-sizing:border-box;min-height:var(--cnvs-sys-space-x16);min-width:calc(calc(var(--cnvs-sys-space-x20) * 3) + var(--cnvs-sys-space-x10));&::webkit-resizer{display:none;}" },
+    base: { name: "hbbc5k", styles: "box-sizing:border-box;min-height:var(--cnvs-sys-space-x16);min-width:calc(calc(var(--cnvs-sys-space-x20) * 3) + var(--cnvs-sys-space-x10));&::webkit-resizer{display:none;}" },
     modifiers: {
         resize: {
-            both: { name: "7c01d6", styles: "resize:both;" },
-            horizontal: { name: "5904a0", styles: "resize:horizontal;" },
-            vertical: { name: "d5a9dd", styles: "resize:vertical;" },
-            none: { name: "1997d7", styles: "resize:none;" }
+            both: { name: "hbbc5l", styles: "resize:both;" },
+            horizontal: { name: "hbbc5m", styles: "resize:horizontal;" },
+            vertical: { name: "hbbc5n", styles: "resize:vertical;" },
+            none: { name: "hbbc5o", styles: "resize:none;" }
         }
     },
     defaultModifiers: {
@@ -26,7 +26,7 @@ export const textAreaStencil = createStencil({
 }, "text-area-3e725a");
 export const TextArea = createComponent('textarea')({
     displayName: 'TextArea',
-    Component: ({ resize = TextAreaResizeDirection.Both, grow, error, ...elemProps }, ref, Element) => React.createElement(Element, Object.assign({ ref: ref }, handleCsProp(elemProps, textAreaStencil({ error, grow, resize })))),
+    Component: ({ resize = TextAreaResizeDirection.Both, grow, error, ...elemProps }, ref, Element) => React.createElement(Element, { ref: ref, ...handleCsProp(elemProps, textAreaStencil({ error, grow, resize })) }),
     subComponents: {
         ErrorType,
         ResizeDirection: TextAreaResizeDirection,

package/dist/es6/text-input/lib/InputGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/InputGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B,eAAO,MAAM,kBAAkB;;;;;;;;;;;;EAS7B,CAAC;AAEH,eAAO,MAAM,oBAAoB;;;;;EAc/B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;;;;EAc7B,CAAC;AAUH,eAAO,MAAM,eAAe;;;;;;;EAK1B,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;kCAwBJ,gBAAgB;;;;;;EAYrC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,WAAW;;;;;EAKtB,CAAC;AAmBH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,UAAU;;;;;;IAInB;;;;;OAKG;;;;;;;IAEH;;;OAGG;;;;;;;;;IAEH;;;;;OAKG;;;;;;;IAEH;;;OAGG;;;;;;;CA6DL,CAAC"}
+{"version":3,"file":"InputGroup.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/InputGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAoB1B,eAAO,MAAM,kBAAkB;;;;;;;;;;;;EAS7B,CAAC;AAEH,eAAO,MAAM,oBAAoB;;;;;EAc/B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;;;;EAc7B,CAAC;AAUH,eAAO,MAAM,eAAe;;;;;;;EAK1B,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;kCAwBJ,gBAAgB;;;;;;EAYrC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,WAAW;;;;;EAKtB,CAAC;AAmBH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,UAAU;;;;;;IAInB;;;;;OAKG;;;;;;;IAEH;;;OAGG;;;;;;;;;IAEH;;;;;OAKG;;;;;;;IAEH;;;OAGG;;;;;;;CA6DL,CAAC"}

package/dist/es6/text-input/lib/InputGroup.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { space } from '@workday/canvas-kit-react/tokens';
+import { maybeWrapCSSVariables } from '@workday/canvas-kit-styling';
+import { system } from '@workday/canvas-tokens-web';
 import { createContainer, createElemPropsHook, createModelHook, createSubcomponent, dispatchInputEvent, useForkRef, useIsRTL, } from '@workday/canvas-kit-react/common';
 import { Flex } from '@workday/canvas-kit-react/layout';
 import { TertiaryButton } from '@workday/canvas-kit-react/button';
@@ -17,12 +18,12 @@ export const useInputGroupModel = createModelHook({})(() => {
 export const InputGroupInnerStart = createSubcomponent('div')({
     modelHook: useInputGroupModel,
 })((elemProps, Element) => {
-    return (React.createElement(Flex, Object.assign({ as: Element, position: "absolute", alignItems: "center", justifyContent: "center", height: "xl", width: "xl" }, elemProps)));
+    return (React.createElement(Flex, { as: Element, position: "absolute", alignItems: "center", justifyContent: "center", height: "xl", width: "xl", ...elemProps }));
 });
 export const InputGroupInnerEnd = createSubcomponent('div')({
     modelHook: useInputGroupModel,
 })((elemProps, Element) => {
-    return (React.createElement(Flex, Object.assign({ as: Element, position: "absolute", alignItems: "center", justifyContent: "center", height: "xl", width: "xl" }, elemProps)));
+    return (React.createElement(Flex, { as: Element, position: "absolute", alignItems: "center", justifyContent: "center", height: "xl", width: "xl", ...elemProps }));
 });
 const useInputGroupInput = createElemPropsHook(useInputGroupModel)((model, ref) => {
     const elementRef = useForkRef(ref, model.state.inputRef);
@@ -34,7 +35,7 @@ export const InputGroupInput = createSubcomponent(TextInput)({
     modelHook: useInputGroupModel,
     elemPropsHook: useInputGroupInput,
 })((elemProps, Element) => {
-    return React.createElement(Flex, Object.assign({ as: Element, width: "100%" }, elemProps));
+    return React.createElement(Flex, { as: Element, width: "100%", ...elemProps });
 });
 export const useClearButton = createElemPropsHook(useInputGroupModel)(model => {
     const [inputHasValue, setInputHasValue] = React.useState(false);
@@ -77,7 +78,7 @@ export const ClearButton = createSubcomponent(TertiaryButton)({
     modelHook: useInputGroupModel,
     elemPropsHook: useClearButton,
 })((elemProps, Element) => {
-    return React.createElement(Element, Object.assign({}, elemProps));
+    return React.createElement(Element, { ...elemProps });
 });
 // make sure we always use pixels if the input is a number - this is required for `calc`
 const toPx = (input) => {
@@ -151,11 +152,11 @@ export const InputGroup = createContainer('div')({
     // `offsetEnd` arrays
     React.Children.forEach(children, child => {
         if (React.isValidElement(child) && child.type === InputGroupInnerStart) {
-            const width = child.props.width || space.xl;
+            const width = maybeWrapCSSVariables(child.props.width || system.space.x10);
             offsetsStart.push(width);
         }
         if (React.isValidElement(child) && child.type === InputGroupInnerEnd) {
-            const width = child.props.width || space.xl;
+            const width = maybeWrapCSSVariables(child.props.width || system.space.x10);
             offsetsEnd.push(width);
         }
     });
@@ -190,5 +191,5 @@ export const InputGroup = createContainer('div')({
         }
         return child;
     });
-    return (React.createElement(Flex, Object.assign({ as: Element, position: "relative" }, elemProps), mappedChildren));
+    return (React.createElement(Flex, { as: Element, position: "relative", ...elemProps }, mappedChildren));
 });

package/dist/es6/text-input/lib/TextInput.d.ts

@@ -1,5 +1,6 @@
 import { GrowthBehavior, ErrorType } from '@workday/canvas-kit-react/common';
-export interface TextInputProps extends GrowthBehavior {
+import { CSProps } from '@workday/canvas-kit-styling';
+export interface TextInputProps extends GrowthBehavior, CSProps {
     /**
      * The type of error associated with the TextInput (if applicable).
      */
@@ -22,22 +23,22 @@ export declare const textInputStencil: import("@workday/canvas-kit-styling").Ste
     error: {
         error: {
             borderColor: "--cnvs-brand-error-base";
-            boxShadow: string;
+            boxShadow: `inset 0 0 0 ${string} --cnvs-brand-error-base`;
             '&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled])': {
                 borderColor: "--cnvs-brand-error-base";
             };
             '&:focus-visible:not([disabled]), &.focus:not([disabled])': {
-                boxShadow: string;
+                boxShadow: `inset 0 0 0 ${string} --cnvs-brand-error-base, 0 0 0 2px --cnvs-sys-color-border-inverse, 0 0 0 4px --cnvs-brand-common-focus-outline`;
             };
         };
         alert: {
             borderColor: "--cnvs-brand-alert-darkest";
-            boxShadow: string;
+            boxShadow: `inset 0 0 0 ${string} --cnvs-brand-alert-base`;
             '&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled])': {
                 borderColor: "--cnvs-brand-alert-darkest";
             };
             '&:focus-visible:not([disabled]), &.focus:not([disabled])': {
-                boxShadow: string;
+                boxShadow: `inset 0 0 0 ${string} --cnvs-brand-alert-base,\n        0 0 0 2px --cnvs-sys-color-border-inverse,\n        0 0 0 4px --cnvs-brand-common-focus-outline`;
             };
         };
     };

package/dist/es6/text-input/lib/TextInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,cAAc,EAAE,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAI5F,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAqF3B,CAAC;AAEH,eAAO,MAAM,SAAS;;CAepB,CAAC"}
+{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,cAAc,EAAE,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EAAsC,OAAO,EAAC,MAAM,6BAA6B,CAAC;AAIzF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,OAAO;IAC7D;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAqF3B,CAAC;AAEH,eAAO,MAAM,SAAS;;CAepB,CAAC"}

package/dist/es6/text-input/lib/TextInput.js

@@ -1,29 +1,30 @@
 import * as React from 'react';
 import { createComponent, ErrorType } from '@workday/canvas-kit-react/common';
-import { createStencil, cssVar, px2rem, calc, handleCsProp } from '@workday/canvas-kit-styling';
+import { createStencil, cssVar, px2rem, calc } from '@workday/canvas-kit-styling';
 import { brand, system } from '@workday/canvas-tokens-web';
+import { mergeStyles } from '@workday/canvas-kit-react/layout';
 export const textInputStencil = createStencil({
     vars: {
         width: '',
     },
-    base: { name: "edcc19", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);display:block;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);background-color:var(--cnvs-sys-color-bg-default);border-radius:var(--cnvs-sys-shape-x1);height:var(--cnvs-sys-space-x10);transition:0.2s box-shadow, 0.2s border-color;padding:var(--cnvs-sys-space-x2);margin:0rem;width:var(--width-text-input-ac8e50);min-width:var(--width-text-input-ac8e50, calc(calc(var(--cnvs-sys-space-x20) * 3) + var(--cnvs-sys-space-x10)));color:var(--cnvs-sys-color-text-default);::-ms-clear{display:none;}&::placeholder{color:var(--cnvs-sys-color-text-hint);}&:hover, &.hover{border-color:var(--cnvs-sys-color-border-input-strong);}&:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-common-focus-outline);box-shadow:inset 0 0 0 1px var(--cnvs-brand-common-focus-outline);outline:none;}&:disabled, .disabled{background-color:var(--cnvs-sys-color-bg-alt-softer);border-color:var(--cnvs-sys-color-border-input-disabled);color:var(--cnvs-sys-color-text-disabled);&::placeholder{color:var(--cnvs-sys-color-text-disabled);}}" },
+    base: { name: "hbbc3u", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);display:block;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);background-color:var(--cnvs-sys-color-bg-default);border-radius:var(--cnvs-sys-shape-x1);height:var(--cnvs-sys-space-x10);transition:0.2s box-shadow, 0.2s border-color;padding:var(--cnvs-sys-space-x2);margin:0rem;width:var(--width-text-input-d81f49);min-width:var(--width-text-input-d81f49, calc(calc(var(--cnvs-sys-space-x20) * 3) + var(--cnvs-sys-space-x10)));color:var(--cnvs-sys-color-text-default);::-ms-clear{display:none;}&::placeholder{color:var(--cnvs-sys-color-text-hint);}&:hover, &.hover{border-color:var(--cnvs-sys-color-border-input-strong);}&:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-common-focus-outline);box-shadow:inset 0 0 0 1px var(--cnvs-brand-common-focus-outline);outline:none;}&:disabled, .disabled{background-color:var(--cnvs-sys-color-bg-alt-softer);border-color:var(--cnvs-sys-color-border-input-disabled);color:var(--cnvs-sys-color-text-disabled);&::placeholder{color:var(--cnvs-sys-color-text-disabled);}}" },
     modifiers: {
         grow: {
-            true: { name: "6c63b7", styles: "width:100%;resize:vertical;" },
-            false: { name: "ba7d2f", styles: "width:initial;" }
+            true: { name: "hbbc3v", styles: "width:100%;resize:vertical;" },
+            false: { name: "hbbc3w", styles: "width:initial;" }
         },
         error: {
-            error: { name: "a75f3c", styles: "border-color:var(--cnvs-brand-error-base);box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-error-base);&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-error-base);}&:focus-visible:not([disabled]), &.focus:not([disabled]){box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-error-base), 0 0 0 2px var(--cnvs-sys-color-border-inverse), 0 0 0 4px var(--cnvs-brand-common-focus-outline);}" },
-            alert: { name: "277895", styles: "border-color:var(--cnvs-brand-alert-darkest);box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-alert-base);&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-alert-darkest);}&:focus-visible:not([disabled]), &.focus:not([disabled]){box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-alert-base),\n        0 0 0 2px var(--cnvs-sys-color-border-inverse),\n        0 0 0 4px var(--cnvs-brand-common-focus-outline);}" }
+            error: { name: "hbbc3x", styles: "border-color:var(--cnvs-brand-error-base);box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-error-base);&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-error-base);}&:focus-visible:not([disabled]), &.focus:not([disabled]){box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-error-base), 0 0 0 2px var(--cnvs-sys-color-border-inverse), 0 0 0 4px var(--cnvs-brand-common-focus-outline);}" },
+            alert: { name: "hbbc3y", styles: "border-color:var(--cnvs-brand-alert-darkest);box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-alert-base);&:hover, &.hover, &:disabled, &.disabled, &:focus-visible:not([disabled]), &.focus:not([disabled]){border-color:var(--cnvs-brand-alert-darkest);}&:focus-visible:not([disabled]), &.focus:not([disabled]){box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-alert-base),\n        0 0 0 2px var(--cnvs-sys-color-border-inverse),\n        0 0 0 4px var(--cnvs-brand-common-focus-outline);}" }
         }
     },
     defaultModifiers: {
         grow: 'false',
     }
-}, "text-input-ac8e50");
+}, "text-input-d81f49");
 export const TextInput = createComponent('input')({
     displayName: 'TextInput',
-    Component: ({ grow, error, width, ...elemProps }, ref, Element) => (React.createElement(Element, Object.assign({ type: "text", ref: ref }, handleCsProp(elemProps, textInputStencil({ width: typeof width === 'number' ? px2rem(width) : width, grow, error }))))),
+    Component: ({ grow, error, width, ...elemProps }, ref, Element) => (React.createElement(Element, { type: "text", ref: ref, ...mergeStyles(elemProps, textInputStencil({ width: typeof width === 'number' ? px2rem(width) : width, grow, error })) })),
     subComponents: {
         ErrorType,
     },

package/dist/es6/toast/lib/Toast.js

@@ -42,7 +42,7 @@ const getAriaAttributes = (mode, id) => {
     }
 };
 const toastStencil = createStencil({
-    base: { name: "cdbf88", styles: "box-sizing:border-box;display:flex;flex-direction:row;width:calc(calc(var(--cnvs-sys-space-x20) * 4) + var(--cnvs-sys-space-x10));padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-x1);" }
+    base: { name: "hbbc5t", styles: "box-sizing:border-box;display:flex;flex-direction:row;width:calc(calc(var(--cnvs-sys-space-x20) * 4) + var(--cnvs-sys-space-x10));padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-x1);" }
 }, "toast-55513d");
 /**
  * Toast is a compound component that has different modes based on its contents. The modes add the proper aria attributes for accessibility
@@ -96,5 +96,5 @@ export const Toast = createContainer('div')({
         Link: ToastLink,
     },
 })(({ children, ...elemProps }, _, model) => {
-    return (React.createElement(Popup.Card, Object.assign({}, getAriaAttributes(model.state.mode, model.state.id), mergeStyles(elemProps, toastStencil())), children));
+    return (React.createElement(Popup.Card, { ...getAriaAttributes(model.state.mode, model.state.id), ...mergeStyles(elemProps, toastStencil()) }, children));
 });

package/dist/es6/toast/lib/ToastBody.js

@@ -4,11 +4,11 @@ import { Flex, mergeStyles } from '@workday/canvas-kit-react/layout';
 import { createStencil } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
 export const toastBodyStencil = createStencil({
-    base: { name: "758c52", styles: "box-sizing:border-box;align-items:flex-start;flex-direction:column;justify-content:center;padding-top:var(--cnvs-sys-space-x4);padding-bottom:var(--cnvs-sys-space-x4);flex-grow:1;gap:var(--cnvs-sys-space-x1);" }
+    base: { name: "hbbc5s", styles: "box-sizing:border-box;align-items:flex-start;flex-direction:column;justify-content:center;padding-top:var(--cnvs-sys-space-x4);padding-bottom:var(--cnvs-sys-space-x4);flex-grow:1;gap:var(--cnvs-sys-space-x1);" }
 }, "toast-body-7d81ac");
 export const ToastBody = createComponent('div')({
     displayName: 'Toast.Body',
     Component: ({ children, ...elemProps }, ref, Element) => {
-        return (React.createElement(Flex, Object.assign({ ref: ref, as: Element }, mergeStyles(elemProps, toastBodyStencil())), children));
+        return (React.createElement(Flex, { ref: ref, as: Element, ...mergeStyles(elemProps, toastBodyStencil()) }, children));
     },
 });

package/dist/es6/toast/lib/ToastCloseIcon.js

@@ -4,11 +4,11 @@ import { Popup } from '@workday/canvas-kit-react/popup';
 import { createStencil } from '@workday/canvas-kit-styling';
 import { mergeStyles } from '@workday/canvas-kit-react/layout';
 export const toastCloseIconStencil = createStencil({
-    base: { name: "721e6c", styles: "box-sizing:border-box;position:relative;" }
+    base: { name: "hbbc5p", styles: "box-sizing:border-box;position:relative;" }
 }, "toast-close-icon-be7e9f");
 export const ToastCloseIcon = createComponent('button')({
     displayName: 'Toast.CloseIcon',
     Component: (elemProps, ref, Element) => {
-        return (React.createElement(Popup.CloseIcon, Object.assign({ as: Element, ref: ref, size: "small" }, mergeStyles(elemProps, toastCloseIconStencil()))));
+        return (React.createElement(Popup.CloseIcon, { as: Element, ref: ref, size: "small", ...mergeStyles(elemProps, toastCloseIconStencil()) }));
     },
 });

package/dist/es6/toast/lib/ToastIcon.js

@@ -4,11 +4,11 @@ import { SystemIcon } from '@workday/canvas-kit-react/icon';
 import { createStencil, handleCsProp } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
 export const toastIconStencil = createStencil({
-    base: { name: "78413e", styles: "box-sizing:border-box;align-self:start;margin:var(--cnvs-sys-space-x4) var(--cnvs-sys-space-x3);" }
+    base: { name: "hbbc5q", styles: "box-sizing:border-box;align-self:start;margin:var(--cnvs-sys-space-x4) var(--cnvs-sys-space-x3);" }
 }, "toast-icon-4b0701");
 export const ToastIcon = createComponent('div')({
     displayName: 'Toast.Icon',
     Component: (elemProps, ref, Element) => {
-        return React.createElement(SystemIcon, Object.assign({ ref: ref, as: Element }, handleCsProp(elemProps, toastIconStencil())));
+        return React.createElement(SystemIcon, { ref: ref, as: Element, ...handleCsProp(elemProps, toastIconStencil()) });
     },
 });

package/dist/es6/toast/lib/ToastLink.js

@@ -4,6 +4,6 @@ import { Hyperlink } from '@workday/canvas-kit-react/button';
 export const ToastLink = createComponent('a')({
     displayName: 'Toast.Link',
     Component: ({ children, href, ...elemProps }, ref, Element) => {
-        return (React.createElement(Hyperlink, Object.assign({ ref: ref, href: href, as: Element }, elemProps), children));
+        return (React.createElement(Hyperlink, { ref: ref, href: href, as: Element, ...elemProps }, children));
     },
 });

package/dist/es6/toast/lib/ToastMessage.js

@@ -6,10 +6,10 @@ import { createStencil } from '@workday/canvas-kit-styling';
 import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { system } from '@workday/canvas-tokens-web';
 export const toastMessageStencil = createStencil({
-    base: { name: "d80f47", styles: "box-sizing:border-box;word-break:break-word;margin-block-start:var(--cnvs-sys-space-zero);margin-block-end:var(--cnvs-sys-space-zero);" }
+    base: { name: "hbbc5r", styles: "box-sizing:border-box;word-break:break-word;margin-block-start:var(--cnvs-sys-space-zero);margin-block-end:var(--cnvs-sys-space-zero);" }
 }, "toast-message-759382");
 export const ToastMessage = createSubcomponent('p')({
     modelHook: useToastModel,
 })(({ children, ...elemProps }, Element, model) => {
-    return (React.createElement(Subtext, Object.assign({ size: "large", id: model.state.id, as: Element }, mergeStyles(elemProps, toastMessageStencil())), children));
+    return (React.createElement(Subtext, { size: "large", id: model.state.id, as: Element, ...mergeStyles(elemProps, toastMessageStencil()) }, children));
 });

package/dist/es6/toast/lib/hooks/useToastModel.d.ts

@@ -1,4 +1,4 @@
-export declare type AriaRoleMode = 'dialog' | 'status' | 'alert';
+export type AriaRoleMode = 'dialog' | 'status' | 'alert';
 export declare const useToastModel: (<TT_Special_Generic>(config?: (Partial<{
     /**
      * Sets the correct aria attributes for the Toast.

package/dist/es6/toast/lib/hooks/useToastModel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useToastModel.d.ts","sourceRoot":"","sources":["../../../../../toast/lib/hooks/useToastModel.tsx"],"names":[],"mappings":"AACA,oBAAY,YAAY,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD,eAAO,MAAM,aAAa;IAEtB;;;;;;;;OAQG;;IAEH;;OAEG;;;;;QAZH;;;;;;;;WAQG;;;;;IARH;;;;;;;;OAQG;;IAEH;;OAEG;;;;IAZH;;;;;;;;OAQG;;;;;QARH;;;;;;;;WAQG;;;;EAeL,CAAC"}
+{"version":3,"file":"useToastModel.d.ts","sourceRoot":"","sources":["../../../../../toast/lib/hooks/useToastModel.tsx"],"names":[],"mappings":"AACA,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD,eAAO,MAAM,aAAa;IAEtB;;;;;;;;OAQG;;IAEH;;OAEG;;;;;QAZH;;;;;;;;WAQG;;;;;IARH;;;;;;;;OAQG;;IAEH;;OAEG;;;;IAZH;;;;;;;;OAQG;;;;;QARH;;;;;;;;WAQG;;;;EAeL,CAAC"}

package/dist/es6/tokens/lib/colors.types.d.ts

@@ -25,9 +25,9 @@ export declare enum BrandingColor {
     Licorice = "licorice",
     BlackPepper = "blackPepper"
 }
-declare type RemoveIndex<T> = {
+type RemoveIndex<T> = {
     [K in keyof T as string extends K ? never : number extends K ? never : K]: T[K];
 };
-export declare type CanvasColor = keyof RemoveIndex<typeof colors>;
+export type CanvasColor = keyof RemoveIndex<typeof colors>;
 export {};
 //# sourceMappingURL=colors.types.d.ts.map

package/dist/es6/tokens/lib/colors.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.types.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/colors.types.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAEhD,oBAAY,aAAa;IACvB,QAAQ,aAAa;IACrB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,UAAU,eAAe;IACzB,UAAU,eAAe;IACzB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,aAAa,kBAAkB;IAC/B,UAAU,eAAe;IACzB,WAAW,gBAAgB;IAC3B,SAAS,cAAc;IACvB,WAAW,gBAAgB;IAC3B,UAAU,eAAe;IACzB,QAAQ,aAAa;IACrB,kBAAkB,uBAAuB;IACzC,UAAU,eAAe;IACzB,QAAQ,aAAa;IACrB,WAAW,gBAAgB;CAC5B;AAED,aAAK,WAAW,CAAC,CAAC,IAAI;KACnB,CAAC,IAAI,MAAM,CAAC,IAAI,MAAM,SAAS,CAAC,GAAG,KAAK,GAAG,MAAM,SAAS,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAChF,CAAC;AAEF,oBAAY,WAAW,GAAG,MAAM,WAAW,CAAC,OAAO,MAAM,CAAC,CAAC"}
+{"version":3,"file":"colors.types.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/colors.types.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAEhD,oBAAY,aAAa;IACvB,QAAQ,aAAa;IACrB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,UAAU,eAAe;IACzB,UAAU,eAAe;IACzB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,aAAa,kBAAkB;IAC/B,UAAU,eAAe;IACzB,WAAW,gBAAgB;IAC3B,SAAS,cAAc;IACvB,WAAW,gBAAgB;IAC3B,UAAU,eAAe;IACzB,QAAQ,aAAa;IACrB,kBAAkB,uBAAuB;IACzC,UAAU,eAAe;IACzB,QAAQ,aAAa;IACrB,WAAW,gBAAgB;CAC5B;AAED,KAAK,WAAW,CAAC,CAAC,IAAI;KACnB,CAAC,IAAI,MAAM,CAAC,IAAI,MAAM,SAAS,CAAC,GAAG,KAAK,GAAG,MAAM,SAAS,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAChF,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,MAAM,WAAW,CAAC,OAAO,MAAM,CAAC,CAAC"}

package/dist/es6/tokens/lib/depth.d.ts

@@ -1,4 +1,4 @@
-export declare type CanvasDepth = {
+export type CanvasDepth = {
     /**
      * ### Depth None
      * 	Used for removing existing depth
@@ -111,8 +111,8 @@ export declare type CanvasDepth = {
         boxShadow: '0 0.375rem 1.5rem rgba(31, 38, 46, 0.12), 0 0.75rem 3rem rgba(31, 38, 46, 0.08)';
     };
 };
-declare type ValueOf<T> = T[keyof T];
-export declare type CanvasDepthValues = ValueOf<CanvasDepth>;
+type ValueOf<T> = T[keyof T];
+export type CanvasDepthValues = ValueOf<CanvasDepth>;
 /**
  * ### Depth Tokens
  *

package/dist/es6/tokens/lib/depth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"depth.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/depth.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW,GAAG;IACxB;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE;QACJ,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,iFAAiF,CAAC;KAC9F,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;OAWG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,6EAA6E,CAAC;KAC1F,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,iFAAiF,CAAC;KAC9F,CAAC;CACH,CAAC;AAEF,aAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7B,oBAAY,iBAAiB,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,KAAK,EAAE,WAyBnB,CAAC"}
+{"version":3,"file":"depth.d.ts","sourceRoot":"","sources":["../../../../tokens/lib/depth.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACxB;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE;QACJ,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,iFAAiF,CAAC;KAC9F,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;OAWG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,6EAA6E,CAAC;KAC1F,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,sFAAsF,CAAC;KACnG,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,CAAC,EAAE;QACD,SAAS,EAAE,iFAAiF,CAAC;KAC9F,CAAC;CACH,CAAC;AAEF,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7B,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,KAAK,EAAE,WAyBnB,CAAC"}