@workday/canvas-kit-react 12.4.0-1015-next.0 → 12.4.0

package/banner/lib/Banner.tsx

@@ -4,13 +4,7 @@ import {jsx} from '@emotion/react';
 import * as React from 'react';
 
 import {borderRadius, CSSProperties, space, type} from '@workday/canvas-kit-react/tokens';
-import {
-  createContainer,
-  ExtractProps,
-  focusRing,
-  hideMouseFocus,
-  useIsRTL,
-} from '@workday/canvas-kit-react/common';
+import {createContainer, ExtractProps, focusRing, useIsRTL} from '@workday/canvas-kit-react/common';
 import {Flex} from '@workday/canvas-kit-react/layout';
 
 import {useBannerModel, useThemedPalette} from './hooks';
@@ -29,11 +23,10 @@ export interface BannerProps extends ExtractProps<typeof Flex, never> {
 const styles: CSSProperties = {
   cursor: 'pointer',
   transition: 'background-color 120ms',
-  '&:focus': {
+  '&:focus-visible, &.focus': {
     outline: 'none',
     ...focusRing({separation: 2}),
   },
-  ...hideMouseFocus,
 };
 
 /**

package/common/lib/CanvasProvider.tsx

@@ -44,12 +44,6 @@ const defaultBranding = createStyles({
   [brand.primary.base]: base.blueberry400,
   [brand.primary.light]: base.blueberry200,
   [brand.primary.lightest]: base.blueberry100,
-  [brand.action.accent]: base.frenchVanilla100,
-  [brand.action.darkest]: base.blueberry600,
-  [brand.action.dark]: base.blueberry500,
-  [brand.action.base]: base.blueberry400,
-  [brand.action.light]: base.blueberry200,
-  [brand.action.lightest]: base.blueberry100,
   [brand.gradient
     .primary]: `linear-gradient(90deg, ${brand.primary.base} 0%, ${brand.primary.dark} 100%)`,
 });
@@ -71,22 +65,20 @@ export const useCanvasThemeToCssVars = (
   const className = (elemProps.className || '').split(' ').concat(defaultBranding).join(' ');
   const style = elemProps.style || {};
   const {palette} = filledTheme.canvas;
-  (['common', 'primary', 'error', 'alert', 'success', 'neutral', 'action'] as const).forEach(
-    color => {
-      if (color === 'common') {
+  (['common', 'primary', 'error', 'alert', 'success', 'neutral'] as const).forEach(color => {
+    if (color === 'common') {
+      // @ts-ignore
+      style[brand.common.focusOutline] = palette.common.focusOutline;
+    }
+    (['lightest', 'light', 'main', 'dark', 'darkest', 'contrast'] as const).forEach(key => {
+      // We only want to set custom colors if they do not match the default. The `defaultBranding` class will take care of the rest.
+      // @ts-ignore
+      if (palette[color][key] !== defaultCanvasTheme.palette[color][key]) {
         // @ts-ignore
-        style[brand.common.focusOutline] = palette.common.focusOutline;
+        style[brand[color][mappedKeys[key]]] = palette[color][key];
       }
-      (['lightest', 'light', 'main', 'dark', 'darkest', 'contrast'] as const).forEach(key => {
-        // We only want to set custom colors if they do not match the default. The `defaultBranding` class will take care of the rest.
-        // @ts-ignore
-        if (palette[color][key] !== defaultCanvasTheme.palette[color][key]) {
-          // @ts-ignore
-          style[brand[color][mappedKeys[key]]] = palette[color][key];
-        }
-      });
-    }
-  );
+    });
+  });
   return {...elemProps, className, style};
 };
 

package/common/lib/styles/hideMouseFocus.ts

@@ -4,6 +4,7 @@ import {CSSProperties} from '@workday/canvas-kit-react/tokens';
 /**
  * A utility to hide the default canvas style focus ring when using mouse input.
  * Requires wrapping your components in an InputProvider component.
+ * @deprecated `hideMouseFocus` is deprecated and will be removed in a future major version. Please use [`focus-visible`](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible) when applying focus styles to elements.
  */
 export const hideMouseFocus: CSSProperties = {
   [`[data-whatinput="mouse"] &:focus,
@@ -15,7 +16,7 @@ export const hideMouseFocus: CSSProperties = {
   },
 };
 
-/*
+/**
  * A utility that simplifies focus selectors since you can't use nested syntax for some reason. Example:
  * [`[data-whatinput="mouse"],
      [data-whatinput="touch"],
@@ -24,6 +25,7 @@ export const hideMouseFocus: CSSProperties = {
           ...
        }
    },
+ * @deprecated `mouseFocusBehavior` is deprecated and will be removed in a future major version. Please use [`focus-visible`](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible) when applying focus styles to elements.
  */
 export const mouseFocusBehavior = (
   selectors: Record<string, Interpolation<any>>

package/common/lib/theming/createCanvasTheme.ts

@@ -80,13 +80,12 @@ function fillPalette(
 
 function calculateCanvasTheme(partialTheme: PartialCanvasTheme): CanvasTheme {
   const {palette = {}, breakpoints = {}, direction, ...extraFields} = partialTheme;
-  const {primary, alert, error, success, neutral, action, common = {}} = palette!;
+  const {primary, alert, error, success, neutral, common = {}} = palette!;
 
   const mergeable: PartialCanvasTheme = {
     palette: {
       common,
       primary: fillPalette(defaultCanvasTheme.palette.primary, primary),
-      action: fillPalette(defaultCanvasTheme.palette.primary, action || primary),
       alert: fillPalette(defaultCanvasTheme.palette.alert, alert),
       error: fillPalette(defaultCanvasTheme.palette.error, error),
       success: fillPalette(defaultCanvasTheme.palette.success, success),

package/common/lib/theming/theme.ts

@@ -12,14 +12,6 @@ export const defaultCanvasTheme: CanvasTheme = {
       darkest: colors.blueberry600,
       contrast: colors.frenchVanilla100,
     },
-    action: {
-      lightest: colors.blueberry100,
-      light: colors.blueberry200,
-      main: colors.blueberry400,
-      dark: colors.blueberry500,
-      darkest: colors.blueberry600,
-      contrast: colors.frenchVanilla100,
-    },
     alert: {
       lightest: colors.cantaloupe100,
       light: colors.cantaloupe300,

package/common/lib/theming/types.ts

@@ -37,7 +37,6 @@ export interface CanvasTheme {
     alert: CanvasThemePalette;
     success: CanvasThemePalette;
     neutral: CanvasThemePalette;
-    action: CanvasThemePalette;
   };
   /**
    * ### Theme Breakpoints

package/dist/commonjs/avatar/lib/Avatar.js

@@ -44,35 +44,35 @@ exports.avatarStencil = (0, canvas_kit_styling_1.createStencil)({
     vars: {
         size: '',
     },
-    base: { name: "i8m52u", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-caution-default);position:relative;display:flex;align-items:center;justify-content:center;padding:0;border:0;overflow:hidden;cursor:default;border-radius:var(--cnvs-sys-shape-round);width:var(--size-avatar-69cee0);height:var(--size-avatar-69cee0);&:focus-visible:not([disabled]), &.focus:not([disabled]){outline:none;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, rgba(8,117,225,1));}:is(button){cursor:pointer;}& > [data-part=\"avatar-icon\"]{transition:opacity 150ms linear;display:flex;align-items:center;justify-content:center;--size-svg-a30d66:calc(var(--size-avatar-69cee0) * 0.625);}& > [data-part=\"avatar-image\"]{position:absolute;width:100%;height:100%;border-radius:999px;transition:opacity 150ms linear;}" },
+    base: { name: "n17q2u", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-caution-default);position:relative;display:flex;align-items:center;justify-content:center;padding:0;border:0;overflow:hidden;cursor:default;border-radius:var(--cnvs-sys-shape-round);width:var(--size-avatar-69cee0);height:var(--size-avatar-69cee0);&:focus-visible:not([disabled]), &.focus:not([disabled]){outline:none;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, rgba(8,117,225,1));}:is(button){cursor:pointer;}& > [data-part=\"avatar-icon\"]{transition:opacity 150ms linear;display:flex;align-items:center;justify-content:center;--size-svg-a30d66:calc(var(--size-avatar-69cee0) * 0.625);}& > [data-part=\"avatar-image\"]{position:absolute;width:100%;height:100%;border-radius:999px;transition:opacity 150ms linear;}" },
     modifiers: {
         variant: {
-            light: { name: "i8m52v", styles: "background-color:var(--cnvs-sys-color-bg-alt-default);& [data-part=\"avatar-icon\"]{--color-system-icon-212f69:var(--cnvs-sys-color-fg-default);}" },
-            dark: { name: "i8m52w", styles: "background-color:var(--cnvs-sys-color-bg-primary-default);& [data-part=\"avatar-icon\"]{--color-system-icon-212f69:var(--cnvs-sys-color-fg-inverse);}" }
+            light: { name: "n17q2v", styles: "background-color:var(--cnvs-sys-color-bg-alt-default);& [data-part=\"avatar-icon\"]{--color-system-icon-212f69:var(--cnvs-sys-color-fg-default);}" },
+            dark: { name: "n17q2w", styles: "background-color:var(--cnvs-sys-color-bg-primary-default);& [data-part=\"avatar-icon\"]{--color-system-icon-212f69:var(--cnvs-sys-color-fg-inverse);}" }
         },
         size: {
-            extraSmall: { name: "i8m52x", styles: "width:var(--cnvs-sys-space-x4);height:var(--cnvs-sys-space-x4);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x4) * 0.625);}" },
-            small: { name: "i8m52y", styles: "width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x6) * 0.625);}" },
-            medium: { name: "i8m52z", styles: "width:var(--cnvs-sys-space-x8);height:var(--cnvs-sys-space-x8);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x8) * 0.625);}" },
-            large: { name: "i8m530", styles: "width:var(--cnvs-sys-space-x10);height:var(--cnvs-sys-space-x10);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x10) * 0.625);}" },
-            extraLarge: { name: "i8m531", styles: "width:var(--cnvs-sys-space-x16);height:var(--cnvs-sys-space-x16);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x16) * 0.625);}" },
-            extraExtraLarge: { name: "i8m532", styles: "width:calc(var(--cnvs-sys-space-x10) * 3);height:calc(var(--cnvs-sys-space-x10) * 3);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(calc(var(--cnvs-sys-space-x10) * 3) * 0.625);}" }
+            extraSmall: { name: "n17q2x", styles: "width:var(--cnvs-sys-space-x4);height:var(--cnvs-sys-space-x4);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x4) * 0.625);}" },
+            small: { name: "n17q2y", styles: "width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x6) * 0.625);}" },
+            medium: { name: "n17q2z", styles: "width:var(--cnvs-sys-space-x8);height:var(--cnvs-sys-space-x8);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x8) * 0.625);}" },
+            large: { name: "n17q30", styles: "width:var(--cnvs-sys-space-x10);height:var(--cnvs-sys-space-x10);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x10) * 0.625);}" },
+            extraLarge: { name: "n17q31", styles: "width:var(--cnvs-sys-space-x16);height:var(--cnvs-sys-space-x16);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x16) * 0.625);}" },
+            extraExtraLarge: { name: "n17q32", styles: "width:calc(var(--cnvs-sys-space-x10) * 3);height:calc(var(--cnvs-sys-space-x10) * 3);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(calc(var(--cnvs-sys-space-x10) * 3) * 0.625);}" }
         },
         objectFit: {
-            contain: { name: "i8m533", styles: "& [data-part=\"avatar-image\"]{object-fit:contain;}" },
-            fill: { name: "i8m534", styles: "& [data-part=\"avatar-image\"]{object-fit:fill;}" },
-            cover: { name: "i8m535", styles: "& [data-part=\"avatar-image\"]{object-fit:cover;}" },
-            ['scale-down']: { name: "i8m536", styles: "& [data-part=\"avatar-image\"]{object-fit:scale-down;}" },
-            none: { name: "i8m537", styles: "& [data-part=\"avatar-image\"]{object-fit:none;}" },
-            ['-moz-initial']: { name: "i8m538", styles: "& [data-part=\"avatar-image\"]{object-fit:-moz-initial;}" },
-            ['initial']: { name: "i8m539", styles: "& [data-part=\"avatar-image\"]{object-fit:initial;}" },
-            ['inherit']: { name: "i8m53a", styles: "& [data-part=\"avatar-image\"]{object-fit:inherit;}" },
-            ['revert']: { name: "i8m53b", styles: "& [data-part=\"avatar-image\"]{object-fit:revert;}" },
-            ['unset']: { name: "i8m53c", styles: "& [data-part=\"avatar-image\"]{object-fit:unset;}" }
+            contain: { name: "n17q33", styles: "& [data-part=\"avatar-image\"]{object-fit:contain;}" },
+            fill: { name: "n17q34", styles: "& [data-part=\"avatar-image\"]{object-fit:fill;}" },
+            cover: { name: "n17q35", styles: "& [data-part=\"avatar-image\"]{object-fit:cover;}" },
+            ['scale-down']: { name: "n17q36", styles: "& [data-part=\"avatar-image\"]{object-fit:scale-down;}" },
+            none: { name: "n17q37", styles: "& [data-part=\"avatar-image\"]{object-fit:none;}" },
+            ['-moz-initial']: { name: "n17q38", styles: "& [data-part=\"avatar-image\"]{object-fit:-moz-initial;}" },
+            ['initial']: { name: "n17q39", styles: "& [data-part=\"avatar-image\"]{object-fit:initial;}" },
+            ['inherit']: { name: "n17q3a", styles: "& [data-part=\"avatar-image\"]{object-fit:inherit;}" },
+            ['revert']: { name: "n17q3b", styles: "& [data-part=\"avatar-image\"]{object-fit:revert;}" },
+            ['unset']: { name: "n17q3c", styles: "& [data-part=\"avatar-image\"]{object-fit:unset;}" }
         },
         isImageLoaded: {
-            true: { name: "i8m53d", styles: "& [data-part=\"avatar-icon\"]{opacity:0;}& [data-part=\"avatar-image\"]{opacity:1;}" },
-            false: { name: "i8m53e", styles: "& [data-part=\"avatar-icon\"]{opacity:1;}& [data-part=\"avatar-image\"]{opacity:0;}" }
+            true: { name: "n17q3d", styles: "& [data-part=\"avatar-icon\"]{opacity:0;}& [data-part=\"avatar-image\"]{opacity:1;}" },
+            false: { name: "n17q3e", styles: "& [data-part=\"avatar-icon\"]{opacity:1;}& [data-part=\"avatar-image\"]{opacity:0;}" }
         }
     },
     defaultModifiers: {

package/dist/commonjs/badge/lib/CountBadge.js

@@ -28,14 +28,14 @@ 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 grow = (0, canvas_kit_styling_1.keyframes)({ name: "i8m53f", styles: "from{transform:scale(0.85);}to{transform:scale(1.0);}" });
+const grow = (0, canvas_kit_styling_1.keyframes)({ name: "n17q3f", styles: "from{transform:scale(0.85);}to{transform:scale(1.0);}" });
 // .cnvs-count-badge
 const countBadgeStencil = (0, canvas_kit_styling_1.createStencil)({
-    base: { name: "i8m53g", styles: "box-sizing:border-box;align-items:center;animation:animation-i8m53f 0.2s ease;background:var(--cnvs-sys-color-static-red-default);border-radius:var(--cnvs-sys-shape-round);color:var(--cnvs-sys-color-text-inverse);display:inline-flex;font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-medium);font-weight:var(--cnvs-sys-font-weight-bold);height:1.25rem;justify-content:center;line-height:1.25rem;min-width:1.25rem;padding:0 0.40625rem;text-shadow:0 0 0.0625rem rgba(0,0,0, 0.35);" },
+    base: { name: "n17q3g", styles: "box-sizing:border-box;align-items:center;animation:animation-n17q3f 0.2s ease;background:var(--cnvs-sys-color-static-red-default);border-radius:var(--cnvs-sys-shape-round);color:var(--cnvs-sys-color-text-inverse);display:inline-flex;font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-medium);font-weight:var(--cnvs-sys-font-weight-bold);height:1.25rem;justify-content:center;line-height:1.25rem;min-width:1.25rem;padding:0 0.40625rem;text-shadow:0 0 0.0625rem rgba(0,0,0, 0.35);" },
     modifiers: {
         variant: {
             // .cnvs-count-badge--variant-inverse
-            inverse: { name: "i8m53h", styles: "background:var(--cnvs-sys-color-bg-default);box-shadow:0 0.0625rem 0.125rem rgba(0,0,0, 0.25);color:var(--cnvs-sys-color-text-primary-default);text-shadow:none;" }
+            inverse: { name: "n17q3h", styles: "background:var(--cnvs-sys-color-bg-default);box-shadow:0 0.0625rem 0.125rem rgba(0,0,0, 0.25);color:var(--cnvs-sys-color-text-primary-default);text-shadow:none;" }
         }
     }
 }, "count-badge-183e28");

package/dist/commonjs/banner/lib/Banner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../banner/lib/Banner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAEL,YAAY,EAIb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAQtD,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACnE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAYD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;IAIf;;;;;;;OAOG;;;;;;;;;IAEH;;;;;;;OAOG;;;;;;;;;IAEH;;;;;;;;OAQG;;;;;;;;;CA4CL,CAAC"}
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../banner/lib/Banner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAkB,YAAY,EAAsB,MAAM,kCAAkC,CAAC;AACpG,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAQtD,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACnE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAWD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;IAIf;;;;;;;OAOG;;;;;;;;;IAEH;;;;;;;OAOG;;;;;;;;;IAEH;;;;;;;;OAQG;;;;;;;;;CA4CL,CAAC"}

package/dist/commonjs/banner/lib/Banner.js

@@ -14,11 +14,10 @@ const BannerActionText_1 = require("./BannerActionText");
 const styles = {
     cursor: 'pointer',
     transition: 'background-color 120ms',
-    '&:focus': {
+    '&:focus-visible, &.focus': {
         outline: 'none',
         ...(0, common_1.focusRing)({ separation: 2 }),
     },
-    ...common_1.hideMouseFocus,
 };
 /**
  * `Banner` is a container component rendered as a `<button>` element that is responsible for creating

package/dist/commonjs/button/lib/BaseButton.js

@@ -55,7 +55,7 @@ exports.buttonStencil = (0, canvas_kit_styling_1.createStencil)({
         opacity: '',
         borderRadius: '',
     },
-    base: { name: "i8m518", styles: "box-sizing:border-box;font-family:\"Roboto\", \"Helvetica Neue\", \"Helvetica\", Arial, sans-serif;font-size:0.875rem;line-height:normal;letter-spacing:0.015rem;font-weight:var(--cnvs-sys-font-weight-bold);background-color:var(--background-b5fb58, var(--background-button-65cb05, transparent));color:var(--label-b5fb58, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));border-width:0.0625rem;border-style:solid;gap:var(--cnvs-sys-space-x2);border-color:var(--border-b5fb58, var(--border-button-65cb05, transparent));cursor:pointer;display:inline-flex;box-shadow:none;align-items:center;justify-content:center;outline:0.125rem transparent;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--borderRadius-b5fb58, var(--borderRadius-button-65cb05, var(--cnvs-sys-shape-round)));position:relative;vertical-align:middle;overflow:hidden;--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));transition:box-shadow 120ms linear, border 120ms linear, background-color 120ms linear, color 120ms linear;&:disabled, &:disabled:active, &.disabled{cursor:default;box-shadow:none;opacity:var(--opacity-b5fb58, var(--opacity-button-65cb05, var(--cnvs-sys-opacity-full)));}&:focus-visible, &.focus{background-color:var(--background-2ae7b1, var(--background-button-65cb05, transparent));border-color:var(--border-2ae7b1, var(--border-button-65cb05, transparent));color:var(--label-2ae7b1, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));box-shadow:0 0 0 2px var(--boxShadowInner-2ae7b1, var(--boxShadowInner-button-65cb05, var(--cnvs-sys-color-border-inverse))), 0 0 0 4px var(--boxShadowOuter-2ae7b1, var(--boxShadowOuter-button-65cb05, var(--cnvs-brand-common-focus-outline)));}&:hover, &.hover{background-color:var(--background-c4b8f8, var(--background-button-65cb05, var(--cnvs-sys-color-bg-contrast-strong)));border-color:var(--border-c4b8f8, var(--border-button-65cb05, transparent));color:var(--label-c4b8f8, var(--label-button-65cb05, var(--cnvs-sys-color-fg-stronger)));--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:hover:active{transition-duration:40ms;}&:active, &.active{background-color:var(--background-93b1ce, var(--background-button-65cb05, transparent));border-color:var(--border-93b1ce, var(--border-button-65cb05, transparent));color:var(--label-93b1ce, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{background-color:var(--background-c34400, var(--background-button-65cb05, transparent));border-color:var(--border-c34400, var(--border-button-65cb05, transparent));color:var(--label-c34400, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
+    base: { name: "n17q18", styles: "box-sizing:border-box;font-family:\"Roboto\", \"Helvetica Neue\", \"Helvetica\", Arial, sans-serif;font-size:0.875rem;line-height:normal;letter-spacing:0.015rem;font-weight:var(--cnvs-sys-font-weight-bold);background-color:var(--background-b5fb58, var(--background-button-65cb05, transparent));color:var(--label-b5fb58, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));border-width:0.0625rem;border-style:solid;gap:var(--cnvs-sys-space-x2);border-color:var(--border-b5fb58, var(--border-button-65cb05, transparent));cursor:pointer;display:inline-flex;box-shadow:none;align-items:center;justify-content:center;outline:0.125rem transparent;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--borderRadius-b5fb58, var(--borderRadius-button-65cb05, var(--cnvs-sys-shape-round)));position:relative;vertical-align:middle;overflow:hidden;--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));transition:box-shadow 120ms linear, border 120ms linear, background-color 120ms linear, color 120ms linear;&:disabled, &:disabled:active, &.disabled{cursor:default;box-shadow:none;opacity:var(--opacity-b5fb58, var(--opacity-button-65cb05, var(--cnvs-sys-opacity-full)));}&:focus-visible, &.focus{background-color:var(--background-2ae7b1, var(--background-button-65cb05, transparent));border-color:var(--border-2ae7b1, var(--border-button-65cb05, transparent));color:var(--label-2ae7b1, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));box-shadow:0 0 0 2px var(--boxShadowInner-2ae7b1, var(--boxShadowInner-button-65cb05, var(--cnvs-sys-color-border-inverse))), 0 0 0 4px var(--boxShadowOuter-2ae7b1, var(--boxShadowOuter-button-65cb05, var(--cnvs-brand-common-focus-outline)));}&:hover, &.hover{background-color:var(--background-c4b8f8, var(--background-button-65cb05, var(--cnvs-sys-color-bg-contrast-strong)));border-color:var(--border-c4b8f8, var(--border-button-65cb05, transparent));color:var(--label-c4b8f8, var(--label-button-65cb05, var(--cnvs-sys-color-fg-stronger)));--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:hover:active{transition-duration:40ms;}&:active, &.active{background-color:var(--background-93b1ce, var(--background-button-65cb05, transparent));border-color:var(--border-93b1ce, var(--border-button-65cb05, transparent));color:var(--label-93b1ce, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{background-color:var(--background-c34400, var(--background-button-65cb05, transparent));border-color:var(--border-c34400, var(--border-button-65cb05, transparent));color:var(--label-c34400, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
     modifiers: {
         /**
          * Button modifiers that will overwrite the base styles of Buttons.
@@ -64,70 +64,70 @@ exports.buttonStencil = (0, canvas_kit_styling_1.createStencil)({
          * within a button or if there is only an icon and no text.
          */
         size: {
-            large: { name: "i8m519", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-small);font-size:var(--cnvs-sys-font-size-body-small);letter-spacing:var(--cnvs-base-letter-spacing-200);height:3rem;padding-inline:var(--cnvs-sys-space-x8);min-width:7rem;" },
-            medium: { name: "i8m51a", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);min-width:6rem;padding-inline:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x10);" },
-            small: { name: "i8m51b", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);height:var(--cnvs-sys-space-x8);min-width:var(--cnvs-sys-space-x20);padding-inline:var(--cnvs-sys-space-x4);gap:var(--cnvs-sys-space-x1);" },
-            extraSmall: { name: "i8m51c", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-medium);font-size:var(--cnvs-sys-font-size-subtext-medium);letter-spacing:var(--cnvs-base-letter-spacing-100);height:var(--cnvs-sys-space-x6);min-width:auto;padding-inline:var(--cnvs-sys-space-x3);gap:var(--cnvs-sys-space-x1);" }
+            large: { name: "n17q19", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-small);font-size:var(--cnvs-sys-font-size-body-small);letter-spacing:var(--cnvs-base-letter-spacing-200);height:3rem;padding-inline:var(--cnvs-sys-space-x8);min-width:7rem;" },
+            medium: { name: "n17q1a", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);min-width:6rem;padding-inline:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x10);" },
+            small: { name: "n17q1b", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);height:var(--cnvs-sys-space-x8);min-width:var(--cnvs-sys-space-x20);padding-inline:var(--cnvs-sys-space-x4);gap:var(--cnvs-sys-space-x1);" },
+            extraSmall: { name: "n17q1c", styles: "font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-medium);font-size:var(--cnvs-sys-font-size-subtext-medium);letter-spacing:var(--cnvs-base-letter-spacing-100);height:var(--cnvs-sys-space-x6);min-width:auto;padding-inline:var(--cnvs-sys-space-x3);gap:var(--cnvs-sys-space-x1);" }
         },
         grow: {
-            true: { name: "i8m51d", styles: "width:100%;max-width:100%;" }
+            true: { name: "n17q1d", styles: "width:100%;max-width:100%;" }
         },
         // IconPosition Styles
         iconPosition: {
-            only: { name: "i8m51e", styles: "padding:var(--cnvs-sys-space-zero);" },
-            start: { name: "i8m51f", styles: "" },
-            end: { name: "i8m51g", styles: "" }
+            only: { name: "n17q1e", styles: "padding:var(--cnvs-sys-space-zero);" },
+            start: { name: "n17q1f", styles: "" },
+            end: { name: "n17q1g", styles: "" }
         }
     },
     // Compound Modifier Styles
     compound: [
         {
             modifiers: { size: 'large', iconPosition: 'only' },
-            styles: { name: "i8m51h", styles: "min-width:calc(var(--cnvs-sys-space-x4) * 3);" }
+            styles: { name: "n17q1h", styles: "min-width:calc(var(--cnvs-sys-space-x4) * 3);" }
         },
         {
             modifiers: { size: 'large', iconPosition: 'start' },
-            styles: { name: "i8m51i", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:var(--cnvs-sys-space-x8);" }
+            styles: { name: "n17q1i", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:var(--cnvs-sys-space-x8);" }
         },
         {
             modifiers: { size: 'large', iconPosition: 'end' },
-            styles: { name: "i8m51j", styles: "padding-inline-start:var(--cnvs-sys-space-x8);padding-inline-end:var(--cnvs-sys-space-x6);" }
+            styles: { name: "n17q1j", styles: "padding-inline-start:var(--cnvs-sys-space-x8);padding-inline-end:var(--cnvs-sys-space-x6);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'only' },
-            styles: { name: "i8m51k", styles: "min-width:var(--cnvs-sys-space-x10);" }
+            styles: { name: "n17q1k", styles: "min-width:var(--cnvs-sys-space-x10);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'start' },
-            styles: { name: "i8m51l", styles: "padding-inline-start:calc(var(--cnvs-sys-space-x1) * 5);padding-inline-end:var(--cnvs-sys-space-x6);" }
+            styles: { name: "n17q1l", styles: "padding-inline-start:calc(var(--cnvs-sys-space-x1) * 5);padding-inline-end:var(--cnvs-sys-space-x6);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'end' },
-            styles: { name: "i8m51m", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:calc(var(--cnvs-sys-space-x1) * 5);" }
+            styles: { name: "n17q1m", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:calc(var(--cnvs-sys-space-x1) * 5);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'only' },
-            styles: { name: "i8m51n", styles: "min-width:var(--cnvs-sys-space-x8);" }
+            styles: { name: "n17q1n", styles: "min-width:var(--cnvs-sys-space-x8);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'start' },
-            styles: { name: "i8m51o", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x4);" }
+            styles: { name: "n17q1o", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x4);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'end' },
-            styles: { name: "i8m51p", styles: "padding-inline-start:var(--cnvs-sys-space-x4);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "n17q1p", styles: "padding-inline-start:var(--cnvs-sys-space-x4);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'only' },
-            styles: { name: "i8m51q", styles: "min-width:var(--cnvs-sys-space-x6);" }
+            styles: { name: "n17q1q", styles: "min-width:var(--cnvs-sys-space-x6);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'start' },
-            styles: { name: "i8m51r", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "n17q1r", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'end' },
-            styles: { name: "i8m51s", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
+            styles: { name: "n17q1s", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
         }
     ]
 }, "button-65cb05");

package/dist/commonjs/button/lib/DeleteButton.js

@@ -33,7 +33,7 @@ const Button_1 = require("./Button");
 const icon_1 = require("@workday/canvas-kit-react/icon");
 const deleteButtonStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: BaseButton_1.buttonStencil,
-    base: { name: "i8m52h", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-error-base);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-error-accent));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-error-accent));--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-error-dark);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-error-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-error-darkest);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-error-accent));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-error-accent));--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);}" }
+    base: { name: "n17q2h", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-error-base);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-error-accent));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-error-accent));--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-error-dark);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-error-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-error-darkest);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-error-accent));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-error-accent));--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);}" }
 }, "delete-button-880e51");
 /**
  * Use sparingly for destructive actions that will result in data loss, can’t be undone, or will

package/dist/commonjs/button/lib/Hyperlink.js

@@ -29,10 +29,10 @@ 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 hyperlinkStencil = (0, canvas_kit_styling_1.createStencil)({
-    base: { name: "i8m52b", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);text-decoration:underline;color:var(--cnvs-sys-color-text-primary-default);cursor:pointer;border-radius:var(--cnvs-sys-shape-half);display:inline-block;padding:0 2px;margin:0 -2px;transition:color 0.15s,background-color 0.15s;&:hover, &.hover{color:var(--cnvs-sys-color-text-primary-strong);background:var(--cnvs-sys-color-bg-alt-soft);}&:focus, &.focus, &:focus-visible{box-shadow:0 0 0 2px var(--cnvs-sys-color-bg-primary-default);outline:none;}&:active, &.active{color:var(--cnvs-sys-color-text-primary-stronger);background:var(--cnvs-sys-color-bg-alt-default);}" },
+    base: { name: "n17q2b", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);text-decoration:underline;color:var(--cnvs-sys-color-text-primary-default);cursor:pointer;border-radius:var(--cnvs-sys-shape-half);display:inline-block;padding:0 2px;margin:0 -2px;transition:color 0.15s,background-color 0.15s;&:hover, &.hover{color:var(--cnvs-sys-color-text-primary-strong);background:var(--cnvs-sys-color-bg-alt-soft);}&:focus, &.focus, &:focus-visible{box-shadow:0 0 0 2px var(--cnvs-sys-color-bg-primary-default);outline:none;}&:active, &.active{color:var(--cnvs-sys-color-text-primary-stronger);background:var(--cnvs-sys-color-bg-alt-default);}" },
     modifiers: {
         variant: {
-            inverse: { name: "i8m52c", styles: "color:var(--cnvs-sys-color-text-inverse);&:hover, &.hover{color:var(--cnvs-sys-color-text-inverse);background:rgba(255, 255, 255, 0.1);}&:focus, &.focus, &:focus-visible{box-shadow:0 0 0 2px var(--cnvs-sys-color-text-inverse);}&:active, &.active{color:var(--cnvs-sys-color-text-primary-stronger);background:var(--cnvs-sys-color-bg-alt-soft);}" }
+            inverse: { name: "n17q2c", styles: "color:var(--cnvs-sys-color-text-inverse);&:hover, &.hover{color:var(--cnvs-sys-color-text-inverse);background:rgba(255, 255, 255, 0.1);}&:focus, &.focus, &:focus-visible{box-shadow:0 0 0 2px var(--cnvs-sys-color-text-inverse);}&:active, &.active{color:var(--cnvs-sys-color-text-primary-stronger);background:var(--cnvs-sys-color-bg-alt-soft);}" }
         }
     }
 }, "hyperlink-aaf9ad");

package/dist/commonjs/button/lib/PrimaryButton.js

@@ -33,11 +33,11 @@ const BaseButton_1 = require("./BaseButton");
 const Button_1 = require("./Button");
 const primaryButtonStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: BaseButton_1.buttonStencil,
-    base: { name: "i8m52d", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-action-dark, var(--cnvs-brand-primary-dark));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-action-darkest, var(--cnvs-brand-primary-darkest));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}" },
+    base: { name: "n17q2d", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-action-dark, var(--cnvs-brand-primary-dark));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-action-darkest, var(--cnvs-brand-primary-darkest));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));--label-button-65cb05:var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent));--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-action-accent, var(--cnvs-brand-primary-accent)));}" },
     modifiers: {
         variant: {
             // Inverse Styles
-            inverse: { name: "i8m52e", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" }
+            inverse: { name: "n17q2e", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" }
         }
     }
 }, "primary-button-cc7f35");

package/dist/commonjs/button/lib/SecondaryButton.js

@@ -33,10 +33,10 @@ const Button_1 = require("./Button");
 const icon_1 = require("@workday/canvas-kit-react/icon");
 const secondaryButtonStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: BaseButton_1.buttonStencil,
-    base: { name: "i8m52f", styles: "box-sizing:border-box;--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-default);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-strong);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-strong);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-accent));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
+    base: { name: "n17q2f", styles: "box-sizing:border-box;--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-default);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-strong);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-strong);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-accent));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
     modifiers: {
         variant: {
-            inverse: { name: "i8m52g", styles: "--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-inverse));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-inverse));}" }
+            inverse: { name: "n17q2g", styles: "--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-inverse));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-inverse));}" }
         }
     }
 }, "secondary-button-e11131");

package/dist/commonjs/button/lib/TertiaryButton.js

@@ -34,71 +34,71 @@ const icon_1 = require("@workday/canvas-kit-react/icon");
 const tertiaryButtonStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: BaseButton_1.buttonStencil,
     // Base Styles
-    base: { name: "i8m51t", styles: "box-sizing:border-box;padding-inline:var(--cnvs-sys-space-x2);min-width:auto;text-decoration:underline;border:var(--cnvs-sys-space-zero);--background-button-65cb05:transparent;--borderRadius-button-65cb05:var(--cnvs-sys-shape-x1);--label-button-65cb05:var(--cnvs-brand-primary-base);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-primary-base));&:focus-visible, &.focus{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-brand-primary-base);--boxShadowInner-button-65cb05:var(--cnvs-brand-common-focus-outline);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-primary-base));box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse), 0 0 0 2px var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--label-button-65cb05:var(--cnvs-brand-primary-dark);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-dark));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--label-button-65cb05:var(--cnvs-brand-primary-darkest);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-darkest));}&:disabled, &.disabled{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-brand-primary-base);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-base));}" },
+    base: { name: "n17q1t", styles: "box-sizing:border-box;padding-inline:var(--cnvs-sys-space-x2);min-width:auto;text-decoration:underline;border:var(--cnvs-sys-space-zero);--background-button-65cb05:transparent;--borderRadius-button-65cb05:var(--cnvs-sys-shape-x1);--label-button-65cb05:var(--cnvs-brand-primary-base);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-primary-base));&:focus-visible, &.focus{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-brand-primary-base);--boxShadowInner-button-65cb05:var(--cnvs-brand-common-focus-outline);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-primary-base));box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse), 0 0 0 2px var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--label-button-65cb05:var(--cnvs-brand-primary-dark);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-dark));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--label-button-65cb05:var(--cnvs-brand-primary-darkest);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-darkest));}&:disabled, &.disabled{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-brand-primary-base);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-base));}" },
     modifiers: {
         // IconPosition Styles
         iconPosition: {
-            only: { name: "i8m51u", styles: "padding:0;border-radius:var(--cnvs-sys-shape-round);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-strong));}&:active, &.active{--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
-            start: { name: "i8m51v", styles: "" },
-            end: { name: "i8m51w", styles: "" }
+            only: { name: "n17q1u", styles: "padding:0;border-radius:var(--cnvs-sys-shape-round);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-strong));}&:active, &.active{--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
+            start: { name: "n17q1v", styles: "" },
+            end: { name: "n17q1w", styles: "" }
         },
         isThemeable: {
-            true: { name: "i8m51x", styles: "--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-primary-base));&:focus-visible, &.focus{--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-primary-base));}&:hover, &.hover{--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-dark));}&:active, &.active{--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-darkest));}&:disabled, &.disabled{--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-primary-base));}" }
+            true: { name: "n17q1x", styles: "--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-brand-primary-base));&:focus-visible, &.focus{--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-brand-primary-base));}&:hover, &.hover{--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-brand-primary-dark));}&:active, &.active{--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-brand-primary-darkest));}&:disabled, &.disabled{--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-brand-primary-base));}" }
         },
         variant: {
             // Inverse Styles
-            inverse: { name: "i8m51y", styles: "--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-inverse));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));box-shadow:inset 0 0 0 2px var(--cnvs-sys-color-border-contrast-default), 0 0 0 2px var(--cnvs-sys-color-border-inverse);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-strong));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-soft);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-inverse));}" }
+            inverse: { name: "n17q1y", styles: "--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-b5fb58, var(--cnvs-sys-color-fg-inverse));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));box-shadow:inset 0 0 0 2px var(--cnvs-sys-color-border-contrast-default), 0 0 0 2px var(--cnvs-sys-color-border-inverse);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-strong));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-soft);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-212f69:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{--background-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-212f69:var(--icon-c34400, var(--cnvs-sys-color-fg-inverse));}" }
         }
     },
     // Compound Modifier Styles
     compound: [
         {
             modifiers: { size: 'large', iconPosition: 'only' },
-            styles: { name: "i8m51z", styles: "min-width:calc(var(--cnvs-sys-space-x4) * 3);" }
+            styles: { name: "n17q1z", styles: "min-width:calc(var(--cnvs-sys-space-x4) * 3);" }
         },
         {
             modifiers: { size: 'large', iconPosition: 'start' },
-            styles: { name: "i8m520", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "n17q20", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { size: 'large', iconPosition: 'end' },
-            styles: { name: "i8m521", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
+            styles: { name: "n17q21", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'only' },
-            styles: { name: "i8m522", styles: "min-width:var(--cnvs-sys-space-x10);" }
+            styles: { name: "n17q22", styles: "min-width:var(--cnvs-sys-space-x10);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'start' },
-            styles: { name: "i8m523", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "n17q23", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { size: 'medium', iconPosition: 'end' },
-            styles: { name: "i8m524", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
+            styles: { name: "n17q24", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'only' },
-            styles: { name: "i8m525", styles: "min-width:var(--cnvs-sys-space-x8);" }
+            styles: { name: "n17q25", styles: "min-width:var(--cnvs-sys-space-x8);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'start' },
-            styles: { name: "i8m526", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
+            styles: { name: "n17q26", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
         },
         {
             modifiers: { size: 'small', iconPosition: 'end' },
-            styles: { name: "i8m527", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
+            styles: { name: "n17q27", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'only' },
-            styles: { name: "i8m528", styles: "min-width:var(--cnvs-sys-space-x6);" }
+            styles: { name: "n17q28", styles: "min-width:var(--cnvs-sys-space-x6);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'start' },
-            styles: { name: "i8m529", styles: "padding-inline-start:var(--cnvs-sys-space-x1);padding-inline-end:var(--cnvs-sys-space-x2);" }
+            styles: { name: "n17q29", styles: "padding-inline-start:var(--cnvs-sys-space-x1);padding-inline-end:var(--cnvs-sys-space-x2);" }
         },
         {
             modifiers: { size: 'extraSmall', iconPosition: 'end' },
-            styles: { name: "i8m52a", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x1);" }
+            styles: { name: "n17q2a", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x1);" }
         }
     ]
 }, "tertiary-button-4896ac");

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

@@ -33,7 +33,7 @@ const CardHeading_1 = require("./CardHeading");
 const CardBody_1 = require("./CardBody");
 // .cnvs-card
 exports.cardStencil = (0, canvas_kit_styling_1.createStencil)({
-    base: { name: "i8m5w", styles: "box-sizing:border-box;box-shadow:var(--cnvs-sys-depth-1);padding:var(--cnvs-sys-space-x8);background-color:var(--cnvs-sys-color-bg-default);border:0.0625rem solid var(--cnvs-sys-color-border-container);border-radius:var(--cnvs-sys-shape-x2);" }
+    base: { name: "n17qw", styles: "box-sizing:border-box;box-shadow:var(--cnvs-sys-depth-1);padding:var(--cnvs-sys-space-x8);background-color:var(--cnvs-sys-color-bg-default);border:0.0625rem solid var(--cnvs-sys-color-border-container);border-radius:var(--cnvs-sys-shape-x2);" }
 }, "card-f60e02");
 /**
  * `Card` is a container component that holds a {@link CardBody Card.Body} and an optional

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

@@ -32,7 +32,7 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 // .cnvs-card-body
 exports.cardBodyStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: text_1.textStencil,
-    base: { name: "i8m5v", styles: "box-sizing:border-box;" },
+    base: { name: "n17qv", styles: "box-sizing:border-box;" },
     defaultModifiers: { typeLevel: 'subtext.large' }
 }, "card-body-18c24e");
 exports.CardBody = (0, common_1.createComponent)('div')({

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

@@ -33,7 +33,7 @@ const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 // .cnvs-card-heading
 exports.cardHeadingStencil = (0, canvas_kit_styling_1.createStencil)({
     extends: text_1.textStencil,
-    base: { name: "i8m5u", styles: "box-sizing:border-box;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);" },
+    base: { name: "n17qu", styles: "box-sizing:border-box;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' }
 }, "card-heading-a7538d");
 exports.CardHeading = (0, common_1.createComponent)('h3')({