@workday/canvas-kit-react 13.2.25 → 13.2.26

package/dist/es6/expandable/lib/ExpandableAvatar.d.ts

@@ -4,7 +4,7 @@ export interface ExpandableAvatarProps extends AvatarProps {
 export declare const expandableAvatarStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
     variant: {
         light: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -15,7 +15,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         dark: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -28,7 +28,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
     };
     size: {
         extraSmall: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -40,7 +40,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         small: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -52,7 +52,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         medium: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -64,7 +64,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         large: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -76,7 +76,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         extraLarge: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -88,7 +88,7 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
             };
         };
         extraExtraLarge: ({ iconPart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
@@ -102,109 +102,109 @@ export declare const expandableAvatarStencil: import("@workday/canvas-kit-stylin
     };
     objectFit: {
         contain: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "contain";
+                objectFit: string;
             };
         };
         fill: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "fill";
+                objectFit: string;
             };
         };
         cover: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "cover";
+                objectFit: string;
             };
         };
         "scale-down": ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "scale-down";
+                objectFit: string;
             };
         };
         none: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "none";
+                objectFit: string;
             };
         };
         "-moz-initial": ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "-moz-initial";
+                objectFit: string;
             };
         };
         initial: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "initial";
+                objectFit: string;
             };
         };
         inherit: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "inherit";
+                objectFit: string;
             };
         };
         revert: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "revert";
+                objectFit: string;
             };
         };
         unset: ({ imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";
         }>) => {
             "[data-part=\"avatar-image\"]": {
-                objectFit: "unset";
+                objectFit: string;
             };
         };
     };
     isImageLoaded: {
         true: ({ iconPart, imagePart }: {
-            size: string;
+            size: `--${string}`;
         } & import("@workday/canvas-kit-styling").StencilVarsParts<{
             readonly icon: "avatar-icon";
             readonly image: "avatar-image";

package/dist/es6/expandable/lib/ExpandableAvatar.js

@@ -6,7 +6,7 @@ import { createStencil } from '@workday/canvas-kit-styling';
 import { mergeStyles } from '@workday/canvas-kit-react/layout';
 export const expandableAvatarStencil = createStencil({
     extends: avatarStencil,
-    base: { name: "371rkg", styles: "box-sizing:border-box;margin-inline-end:var(--cnvs-sys-space-x2);flex-shrink:0;" }
+    base: { name: "2tc2ut", styles: "box-sizing:border-box;margin-inline-end:var(--cnvs-sys-space-x2);flex-shrink:0;" }
 }, "expandable-avatar-d56832");
 // When the component is created, it needs to be a button element to match AvatarProps.
 // Once Avatar becomes a `createComponent` we can default the element type to a `div`

package/dist/es6/expandable/lib/ExpandableContent.js

@@ -6,7 +6,7 @@ import { useExpandableModel } from './hooks/useExpandableModel';
 import { createStencil } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
 export const expandableContentStencil = createStencil({
-    base: { name: "2km6d0", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-transparent);padding:var(--cnvs-sys-space-x4) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2);" }
+    base: { name: "38b4h1", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-transparent);padding:var(--cnvs-sys-space-x4) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2);" }
 }, "expandable-content-25e157");
 export const ExpandableContent = createSubcomponent('div')({
     modelHook: useExpandableModel,

package/dist/es6/expandable/lib/ExpandableIcon.d.ts

@@ -32,7 +32,7 @@ export declare const expandableIconStencil: import("@workday/canvas-kit-styling"
 }, import("@workday/canvas-kit-styling").Stencil<{
     shouldMirror: {
         true: {
-            transform: "scaleX(-1)";
+            transform: string;
         };
     };
 }, {}, {

package/dist/es6/expandable/lib/ExpandableIcon.js

@@ -9,34 +9,34 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { system } from '@workday/canvas-tokens-web';
 export const expandableIconStencil = createStencil({
     extends: systemIconStencil,
-    base: { name: "405z6m", styles: "box-sizing:border-box;padding:var(--cnvs-sys-space-x1);" },
+    base: { name: "1e1nd3", styles: "box-sizing:border-box;padding:var(--cnvs-sys-space-x1);" },
     modifiers: {
         isExpanded: {
-            true: { name: "izrah", styles: "" },
-            false: { name: "15kj8y", styles: "" }
+            true: { name: "3ojo5x", styles: "" },
+            false: { name: "2qoqei", styles: "" }
         },
         position: {
-            start: { name: "49hbni", styles: "" },
-            end: { name: "2z5e3w", styles: "" },
-            only: { name: "1j8h1o", styles: "" }
+            start: { name: "1p6669", styles: "" },
+            end: { name: "15eiic", styles: "" },
+            only: { name: "1rw8zf", styles: "" }
         }
     },
     compound: [
         {
             modifiers: { position: 'end', isExpanded: false },
-            styles: { name: "42thb7", styles: "margin-inline-start:auto;transform:rotate(180deg);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "2r5ndj", styles: "margin-inline-start:auto;transform:rotate(180deg);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { position: 'end', isExpanded: true },
-            styles: { name: "1jc6dt", styles: "margin-inline-start:auto;padding-inline-start:var(--cnvs-sys-space-x3);" }
+            styles: { name: "2fnyyr", styles: "margin-inline-start:auto;padding-inline-start:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { position: 'start', isExpanded: false },
-            styles: { name: "2rq6nw", styles: "margin-inline-end:var(--cnvs-sys-space-x2);transform:rotate(90deg);:dir(rtl){transform:rotate(-90deg);}" }
+            styles: { name: "1kl9u9", styles: "margin-inline-end:var(--cnvs-sys-space-x2);transform:rotate(90deg);:dir(rtl){transform:rotate(-90deg);}" }
         },
         {
             modifiers: { position: 'start', isExpanded: true },
-            styles: { name: "1gkd6s", styles: "margin-inline-end:var(--cnvs-sys-space-x2);transform:rotate(180deg);" }
+            styles: { name: "s2o34", styles: "margin-inline-end:var(--cnvs-sys-space-x2);transform:rotate(180deg);" }
         }
     ]
 }, "expandable-icon-a75423");

package/dist/es6/expandable/lib/ExpandableTarget.js

@@ -7,7 +7,7 @@ import { system } from '@workday/canvas-tokens-web';
 import { useExpandableTarget } from './hooks/useExpandableTarget';
 import { useExpandableModel } from './hooks/useExpandableModel';
 export const expandableTargetStencil = createStencil({
-    base: { name: "2fdtqi", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-transparent);border-color:var(--cnvs-sys-color-bg-transparent);border-radius:var(--cnvs-sys-shape-x1);border-width:0;display:flex;align-items:flex-start;flex-direction:row;justify-content:start;padding:var(--cnvs-sys-space-x2);cursor:pointer;width:100%;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}" }
+    base: { name: "3ug3kb", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-transparent);border-color:var(--cnvs-sys-color-bg-transparent);border-radius:var(--cnvs-sys-shape-x1);border-width:0;display:flex;align-items:flex-start;flex-direction:row;justify-content:start;padding:var(--cnvs-sys-space-x2);cursor:pointer;width:100%;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}" }
 }, "expandable-target-23cf82");
 export const ExpandableTarget = createSubcomponent('button')({
     modelHook: useExpandableModel,

package/dist/es6/expandable/lib/ExpandableTitle.js

@@ -4,7 +4,7 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { system } from '@workday/canvas-tokens-web';
 import { createStencil, px2rem } from '@workday/canvas-kit-styling';
 export const expandableTitleStencil = createStencil({
-    base: { name: "2nrhfy", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-medium);font-size:var(--cnvs-sys-font-size-body-medium);color:var(--cnvs-sys-color-text-strong);padding:0.125rem var(--cnvs-sys-space-zero);text-align:left;" }
+    base: { name: "2a9nbd", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-medium);font-size:var(--cnvs-sys-font-size-body-medium);color:var(--cnvs-sys-color-text-strong);padding:0.125rem var(--cnvs-sys-space-zero);text-align:left;" }
 }, "expandable-title-afdcf8");
 export const ExpandableTitle = createComponent('div')({
     displayName: 'Expandable.Title',

package/dist/es6/form-field/lib/FormFieldContainer.js

@@ -7,7 +7,7 @@ import { system } from '@workday/canvas-tokens-web';
  * @deprecated `formFieldContainerStencil` is deprecated and will be removed in a future major version. Please use `FormField.Field` to always wrap `FormField.Input` and `FormField.Hint` to always ensure correct label and input alignment.
  */
 export const formFieldContainerStencil = createStencil({
-    base: { name: "42gydo", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
+    base: { name: "27xuk", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
 }, "form-field-container-6a4115");
 /**
  * @deprecated `FormField.Container` is deprecated and will be removed in a future major version. Please use `FormField.Field` to always wrap `FormField.Input` and `FormField.Hint` to always ensure correct label and input alignment.

package/dist/es6/form-field/lib/FormFieldField.js

@@ -4,7 +4,7 @@ import { handleCsProp, createStencil } from '@workday/canvas-kit-styling';
 import { useFormFieldModel } from './hooks';
 import { system } from '@workday/canvas-tokens-web';
 export const formFieldFieldStencil = createStencil({
-    base: { name: "1q091r", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
+    base: { name: "h86tq", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
 }, "form-field-field-a35e82");
 export const FormFieldField = createSubcomponent('div')({
     displayName: 'FormField.Field',

package/dist/es6/form-field/lib/FormFieldGroupLabel.d.ts

@@ -8,7 +8,35 @@ export interface FormFieldGroupLabelProps extends FlexProps, Omit<ExtractProps<t
      */
     children: React.ReactNode;
 }
-export declare const formFieldGroupLabelStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
+export declare const formFieldGroupLabelStencil: import("@workday/canvas-kit-styling").Stencil<{
+    isRequired: {
+        true: {
+            '&::after': {
+                content: string;
+                fontSize: "--cnvs-sys-font-size-body-large";
+                fontWeight: "--cnvs-sys-font-weight-normal";
+                color: "--cnvs-brand-error-base";
+                textDecoration: string;
+                marginInlineStart: "--cnvs-sys-space-x1";
+            };
+        };
+    };
+    orientation: {
+        vertical: {
+            width: string;
+        };
+        horizontalStart: {
+            justifyContent: string;
+            float: string;
+            maxHeight: "--cnvs-sys-space-x10";
+        };
+        horizontalEnd: {
+            maxHeight: "--cnvs-sys-space-x10";
+            float: string;
+            justifyContent: string;
+        };
+    };
+}, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
     typeLevel: {
         'title.large': {
             color: "--cnvs-sys-color-text-strong";

package/dist/es6/form-field/lib/FormFieldGroupLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldGroupLabel.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormFieldGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAElF,OAAO,EAAC,IAAI,EAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAC,SAAS,EAAc,MAAM,kCAAkC,CAAC;AAIxE,MAAM,WAAW,wBACf,SAAQ,SAAS,EACf,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA4CrC,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;;;;;EAoB9B,CAAC"}
+{"version":3,"file":"FormFieldGroupLabel.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormFieldGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAElF,OAAO,EAAC,IAAI,EAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAC,SAAS,EAAc,MAAM,kCAAkC,CAAC;AAIxE,MAAM,WAAW,wBACf,SAAQ,SAAS,EACf,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA0CrC,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;;;;;EAoB9B,CAAC"}

package/dist/es6/form-field/lib/FormFieldGroupLabel.js

@@ -7,16 +7,15 @@ import { brand, system } from '@workday/canvas-tokens-web';
 import { useFormFieldModel } from './hooks';
 export const formFieldGroupLabelStencil = createStencil({
     extends: textStencil,
-    // @ts-ignore Still weird about CSS font variables
-    base: { name: "1c623y", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-medium);color:var(--cnvs-sys-color-text-default);padding-inline-start:var(--cnvs-sys-space-zero);display:flex;align-items:center;min-width:11.25rem;" },
+    base: { name: "2n704y", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-medium);color:var(--cnvs-sys-color-text-default);padding-inline-start:var(--cnvs-sys-space-zero);display:flex;align-items:center;min-width:11.25rem;" },
     modifiers: {
         isRequired: {
-            true: { name: "t7ih5", styles: "&::after{content:\"*\";font-size:var(--cnvs-sys-font-size-body-large);font-weight:var(--cnvs-sys-font-weight-normal);color:var(--cnvs-brand-error-base);text-decoration:unset;margin-inline-start:var(--cnvs-sys-space-x1);}" }
+            true: { name: "3wwlmb", styles: "&::after{content:\"*\";font-size:var(--cnvs-sys-font-size-body-large);font-weight:var(--cnvs-sys-font-weight-normal);color:var(--cnvs-brand-error-base);text-decoration:unset;margin-inline-start:var(--cnvs-sys-space-x1);}" }
         },
         orientation: {
-            vertical: { name: "32n1wk", styles: "width:100%;" },
-            horizontalStart: { name: "1z4lf2", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
-            horizontalEnd: { name: "3svbm5", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" }
+            vertical: { name: "3pszdg", styles: "width:100%;" },
+            horizontalStart: { name: "4cy437", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
+            horizontalEnd: { name: "3kemr3", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" }
         }
     },
     defaultModifiers: {

package/dist/es6/form-field/lib/FormFieldGroupList.js

@@ -4,11 +4,11 @@ import { createStencil, calc, px2rem, handleCsProp } from '@workday/canvas-kit-s
 import { brand, system } from '@workday/canvas-tokens-web';
 import { useFormFieldModel } from './hooks';
 const formFieldGroupListStencil = createStencil({
-    base: { name: "2bcc16", styles: "box-sizing:border-box;display:flex;flex-direction:column;border-radius:var(--cnvs-sys-shape-x1);gap:var(--cnvs-sys-space-x2);padding:0.625rem var(--cnvs-sys-space-x3) var(--cnvs-sys-space-x2);margin:0 calc(var(--cnvs-sys-space-x3) * -1);transition:100ms box-shadow;width:fit-content;" },
+    base: { name: "9k0ic", styles: "box-sizing:border-box;display:flex;flex-direction:column;border-radius:var(--cnvs-sys-shape-x1);gap:var(--cnvs-sys-space-x2);padding:0.625rem var(--cnvs-sys-space-x3) var(--cnvs-sys-space-x2);margin:0 calc(var(--cnvs-sys-space-x3) * -1);transition:100ms box-shadow;width:fit-content;" },
     modifiers: {
         error: {
-            error: { name: "j4k6x", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" },
-            alert: { name: "2z4nh7", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-alert-darkest), inset 0 0 0 0.1875rem var(--cnvs-brand-alert-base);" }
+            error: { name: "egh3l", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" },
+            alert: { name: "15zdjw", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-alert-darkest), inset 0 0 0 0.1875rem var(--cnvs-brand-alert-base);" }
         }
     }
 }, "form-field-group-list-9f0751");

package/dist/es6/form-field/lib/FormFieldHint.js

@@ -7,11 +7,11 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { useFormFieldHint, useFormFieldModel } from './hooks';
 export const formFieldHintStencil = createStencil({
     extends: textStencil,
-    base: { name: "29px2v", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
+    base: { name: "35d2sd", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
     modifiers: {
         error: {
-            error: { name: "3fnxnx", styles: "color:var(--cnvs-brand-error-base);" },
-            alert: { name: "3y3mpi", styles: "" }
+            error: { name: "3f5l1a", styles: "color:var(--cnvs-brand-error-base);" },
+            alert: { name: "420vay", styles: "" }
         }
     },
     defaultModifiers: {

package/dist/es6/form-field/lib/FormFieldLabel.d.ts

@@ -12,7 +12,51 @@ export interface FormFieldLabelProps extends FlexProps, Omit<ExtractProps<typeof
      */
     isHidden?: boolean;
 }
-export declare const formFieldLabelStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
+export declare const formFieldLabelStencil: import("@workday/canvas-kit-styling").Stencil<{
+    isRequired: {
+        true: {
+            '&::after': {
+                content: string;
+                fontSize: "--cnvs-sys-font-size-body-large";
+                fontWeight: "--cnvs-sys-font-weight-normal";
+                color: "--cnvs-brand-error-base";
+                textDecoration: string;
+                marginInlineStart: "--cnvs-sys-space-x1";
+            };
+        };
+    };
+    orientation: {
+        horizontalStart: {
+            justifyContent: string;
+            float: string;
+            maxHeight: "--cnvs-sys-space-x10";
+        };
+        horizontalEnd: {
+            maxHeight: "--cnvs-sys-space-x10";
+            float: string;
+            justifyContent: string;
+        };
+        vertical: {
+            width: string;
+        };
+    };
+    isHidden: {
+        true: {
+            clip: "rect(1px, 1px, 1px, 1px)";
+            clipPath: "polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px)";
+            position: "absolute";
+            overflow: "hidden";
+            whiteSpace: "nowrap";
+            height: "1px";
+            minHeight: "1px";
+            width: "1px";
+            minWidth: "1px";
+            margin: "-1px";
+            padding: 0;
+            border: 0;
+        };
+    };
+}, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
     typeLevel: {
         'title.large': {
             color: "--cnvs-sys-color-text-strong";

package/dist/es6/form-field/lib/FormFieldLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldLabel.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormFieldLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,YAAY,EAAiB,MAAM,kCAAkC,CAAC;AAElG,OAAO,EAAC,IAAI,EAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAC,SAAS,EAAc,MAAM,kCAAkC,CAAC;AAKxE,MAAM,WAAW,mBACf,SAAQ,SAAS,EACf,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAiDhC,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;EAuB1B,CAAC"}
+{"version":3,"file":"FormFieldLabel.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormFieldLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,YAAY,EAAiB,MAAM,kCAAkC,CAAC;AAElG,OAAO,EAAC,IAAI,EAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAC,SAAS,EAAc,MAAM,kCAAkC,CAAC;AAKxE,MAAM,WAAW,mBACf,SAAQ,SAAS,EACf,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA+ChC,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;EAuB1B,CAAC"}

package/dist/es6/form-field/lib/FormFieldLabel.js

@@ -7,19 +7,18 @@ import { brand, system } from '@workday/canvas-tokens-web';
 import { useFormFieldLabel, useFormFieldModel } from './hooks';
 export const formFieldLabelStencil = createStencil({
     extends: textStencil,
-    // @ts-ignore Still weird about CSS font variables
-    base: { name: "474qsv", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-medium);color:var(--cnvs-sys-color-text-default);padding-inline-start:var(--cnvs-sys-space-zero);display:flex;align-items:center;min-width:11.25rem;" },
+    base: { name: "3zcj8b", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-medium);color:var(--cnvs-sys-color-text-default);padding-inline-start:var(--cnvs-sys-space-zero);display:flex;align-items:center;min-width:11.25rem;" },
     modifiers: {
         isRequired: {
-            true: { name: "4e12ja", styles: "&::after{content:\"*\";font-size:var(--cnvs-sys-font-size-body-large);font-weight:var(--cnvs-sys-font-weight-normal);color:var(--cnvs-brand-error-base);text-decoration:unset;margin-inline-start:var(--cnvs-sys-space-x1);}" }
+            true: { name: "3x81vi", styles: "&::after{content:\"*\";font-size:var(--cnvs-sys-font-size-body-large);font-weight:var(--cnvs-sys-font-weight-normal);color:var(--cnvs-brand-error-base);text-decoration:unset;margin-inline-start:var(--cnvs-sys-space-x1);}" }
         },
         orientation: {
-            horizontalStart: { name: "3a2lk6", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
-            horizontalEnd: { name: "2mjawd", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" },
-            vertical: { name: "1r45qv", styles: "width:100%;" }
+            horizontalStart: { name: "x8nhj", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
+            horizontalEnd: { name: "1n1fy6", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" },
+            vertical: { name: "3k9y56", styles: "width:100%;" }
         },
         isHidden: {
-            true: { name: "30mniu", 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;min-height:1px;width:1px;min-width:1px;margin:-1px;padding:0;border:0;" }
+            true: { name: "44zfdy", 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;min-height:1px;width:1px;min-width:1px;margin:-1px;padding:0;border:0;" }
         }
     },
     defaultModifiers: {

package/dist/es6/form-field/lib/formFieldStencil.d.ts

@@ -12,17 +12,17 @@ export declare const formFieldStencil: import("@workday/canvas-kit-styling").Ste
     };
     orientation: {
         horizontalStart: {
-            flexDirection: "row";
+            flexDirection: string;
             gap: "--cnvs-sys-space-x8";
         };
         horizontalEnd: {
-            flexDirection: "row";
+            flexDirection: string;
             gap: "--cnvs-sys-space-x8";
         };
         vertical: {
-            flexDirection: "column";
+            flexDirection: string;
             gap: "--cnvs-sys-space-x1";
-            alignItems: "flex-start";
+            alignItems: string;
         };
     };
     required: {

package/dist/es6/form-field/lib/formFieldStencil.js

@@ -1,22 +1,22 @@
 import { createStencil } from '@workday/canvas-kit-styling';
 import { system } from '@workday/canvas-tokens-web';
 export const formFieldStencil = createStencil({
-    base: { name: "nki05", styles: "box-sizing:border-box;display:flex;border:none;padding:var(--cnvs-sys-space-zero);margin:var(--cnvs-sys-space-zero) var(--cnvs-sys-space-zero) var(--cnvs-sys-space-x6);" },
+    base: { name: "1ftd6n", styles: "box-sizing:border-box;display:flex;border:none;padding:var(--cnvs-sys-space-zero);margin:var(--cnvs-sys-space-zero) var(--cnvs-sys-space-zero) var(--cnvs-sys-space-x6);" },
     modifiers: {
         grow: {
-            true: { name: "7jhrl", styles: "width:100%;[data-width=\"ck-formfield-width\"]{width:100%;}&:has(div[data-width=\"ck-formfield-width\"]){width:100%;}" }
+            true: { name: "ryy4o", styles: "width:100%;[data-width=\"ck-formfield-width\"]{width:100%;}&:has(div[data-width=\"ck-formfield-width\"]){width:100%;}" }
         },
         orientation: {
-            horizontalStart: { name: "11hypl", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
-            horizontalEnd: { name: "15sfkv", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
-            vertical: { name: "2gdsrh", styles: "flex-direction:column;gap:var(--cnvs-sys-space-x1);align-items:flex-start;" }
+            horizontalStart: { name: "43q8wj", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
+            horizontalEnd: { name: "3ikwbq", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
+            vertical: { name: "2ilurz", styles: "flex-direction:column;gap:var(--cnvs-sys-space-x1);align-items:flex-start;" }
         },
         required: {
-            true: { name: "3f0g3h", styles: "" }
+            true: { name: "46v8jg", styles: "" }
         },
         error: {
-            error: { name: "p8w2d", styles: "" },
-            alert: { name: "28rrnf", styles: "" }
+            error: { name: "1mmuxv", styles: "" },
+            alert: { name: "16uw6x", styles: "" }
         }
     },
     defaultModifiers: {

package/dist/es6/icon/lib/AccentIcon.d.ts

@@ -37,7 +37,7 @@ export declare const accentIconStencil: import("@workday/canvas-kit-styling").St
     transparent: {
         true: {
             '& .french-vanilla-100': {
-                fill: "transparent";
+                fill: string;
             };
         };
     };
@@ -46,7 +46,7 @@ export declare const accentIconStencil: import("@workday/canvas-kit-styling").St
 }, import("@workday/canvas-kit-styling").Stencil<{
     shouldMirror: {
         true: {
-            transform: "scaleX(-1)";
+            transform: string;
         };
     };
 }, {}, {

package/dist/es6/icon/lib/AccentIcon.js

@@ -21,10 +21,10 @@ export const accentIconStencil = createStencil({
     vars: {
         color: '',
     },
-    base: { name: "2vem2w", styles: "box-sizing:border-box;--size-svg-728c60:3.5rem;& .color-500{fill:var(--color-accent-icon-5d368a, var(--cnvs-base-palette-blueberry-500));}& .french-vanilla-100{fill:var(--cnvs-base-palette-french-vanilla-100);}" },
+    base: { name: "3xlvd5", styles: "box-sizing:border-box;--size-svg-728c60:3.5rem;& .color-500{fill:var(--color-accent-icon-5d368a, var(--cnvs-base-palette-blueberry-500));}& .french-vanilla-100{fill:var(--cnvs-base-palette-french-vanilla-100);}" },
     modifiers: {
         transparent: {
-            true: { name: "18wthv", styles: "& .french-vanilla-100{fill:transparent;}" }
+            true: { name: "317zq", styles: "& .french-vanilla-100{fill:transparent;}" }
         }
     }
 }, "accent-icon-5d368a");

package/dist/es6/icon/lib/AppletIcon.d.ts

@@ -40,7 +40,7 @@ export declare const appletIconStencil: import("@workday/canvas-kit-styling").St
 }, import("@workday/canvas-kit-styling").Stencil<{
     shouldMirror: {
         true: {
-            transform: "scaleX(-1)";
+            transform: string;
         };
     };
 }, {}, {

package/dist/es6/icon/lib/AppletIcon.js

@@ -51,7 +51,7 @@ export const appletIconStencil = createStencil({
         color400: '',
         color500: '',
     },
-    base: { name: "3r5bhi", styles: "box-sizing:border-box;--size-svg-728c60:5.75rem;& .color-100{fill:var(--cnvs-base-palette-french-vanilla-100);}& .color-200{fill:var(--color200-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-200));}& .color-300{fill:var(--color300-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-300));}& .color-400{fill:var(--color400-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}& .color-400-alpha-20{fill:var(--color400-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}& .color-500{fill:var(--color500-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}" }
+    base: { name: "2k8urk", styles: "box-sizing:border-box;--size-svg-728c60:5.75rem;& .color-100{fill:var(--cnvs-base-palette-french-vanilla-100);}& .color-200{fill:var(--color200-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-200));}& .color-300{fill:var(--color300-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-300));}& .color-400{fill:var(--color400-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}& .color-400-alpha-20{fill:var(--color400-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}& .color-500{fill:var(--color500-applet-icon-1f1db3, var(--cnvs-base-palette-blueberry-400));}" }
 }, "applet-icon-1f1db3");
 export const AppletIcon = createComponent('span')({
     displayName: 'AppletIcon',

package/dist/es6/icon/lib/Graphic.d.ts

@@ -72,7 +72,7 @@ export declare const graphicStencil: import("@workday/canvas-kit-styling").Stenc
 }, {}, {}, import("@workday/canvas-kit-styling").Stencil<{
     shouldMirror: {
         true: {
-            transform: "scaleX(-1)";
+            transform: string;
         };
     }; /**
      * The width of the graphic