@workday/canvas-kit-react 12.1.0-937-next.0 → 12.1.0-945-next.0

package/dist/es6/collection/lib/useOverflowListModel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useOverflowListModel.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListModel.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"useOverflowListModel.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListModel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AAExC,wBAAgB,YAAY,CAC1B,aAAa,EAAE,MAAM,EACrB,YAAY,EAAE,MAAM,EACpB,kBAAkB,EAAE,MAAM,EAC1B,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACrC,WAAW,EAAE,MAAM,EAAE,GAAG,KAAK,EAC7B,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,GACjB,MAAM,EAAE,CAmDV;AAED,eAAO,MAAM,oBAAoB;;;IAK7B;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;QA+BH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA0C0B,MAAM;;;;QAjDnC;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAwDiC,MAAM;gBAAU,MAAM;;;;QA/D1D;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAkEkC,MAAM;;;;QAzE3C;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA2EqB,MAAM;eAAS,MAAM;;;;QAlF7C;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA8EoB,MAAM;eAAS,MAAM;gBAAU,MAAM;;;;QArF5D;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAkGuB,MAAM;;;;QAzGhC;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAyHwB,MAAM;;;;QAhIjC;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA4HqB,MAAM;;;;QAnI9B;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA+HwB,MAAM;;;;QAtIjC;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA0C0B,MAAM;;;;QAjDnC;;WAEG;;;QAGH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAwDiC,MAAM;gBAAU,MAAM;;;;QA/D1D;;WAEG;;;QAGH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"}

package/dist/es6/collection/lib/useOverflowListModel.js

@@ -1,44 +1,46 @@
 import React from 'react';
 import { createModelHook } from '@workday/canvas-kit-react/common';
 import { useSelectionListModel } from './useSelectionListModel';
-export function getHiddenIds(containerWidth, overflowTargetWidth, itemWidthCache, selectedIds, items) {
+export function getHiddenIds(containerSize, containerGap, overflowTargetSize, itemSizeCache, selectedIds, items) {
     /** Allows us to prioritize showing the selected item */
     let selectedKey;
     /** Tally of combined item widths. We'll add items that fit until the container is full */
-    let itemWidth = 0;
+    let itemSize = 0;
     /** Tally ids that won't fit inside the container. These will be used by components to hide
      * elements that won't fit in the container */
     const hiddenIds = [];
+    /** Track if gap should be calculated since gap doesn't apply to the width of the first item, only
+     * consecutive items */
+    let shouldAddGap = false;
     if (selectedIds !== 'all' && selectedIds.length) {
-        if (items === null || items === void 0 ? void 0 : items.length) {
+        if (items.length) {
             // If selectedIds[0] is not in items, use the first id from items
             selectedKey = items.find(item => item.id === selectedIds[0]) ? selectedIds[0] : items[0].id;
         }
-        else {
-            selectedKey = selectedIds[0];
-        }
     }
-    if (Object.keys(itemWidthCache).reduce((sum, key) => sum + itemWidthCache[key], 0) <= containerWidth) {
+    if (Object.keys(itemSizeCache).reduce((sum, key, index) => sum + itemSizeCache[key] + (index > 0 ? containerGap : 0), 0) <= containerSize) {
         // All items fit, return empty array
         return [];
     }
     else if (selectedKey) {
-        if (itemWidthCache[selectedKey] + overflowTargetWidth > containerWidth) {
+        if (itemSizeCache[selectedKey] + overflowTargetSize > containerSize) {
             // If the selected item doesn't fit, only show overflow (all items hidden)
-            return Object.keys(itemWidthCache);
+            return Object.keys(itemSizeCache);
         }
         else {
             // at least the selected item and overflow target fit. Update our itemWidth with the sum
-            itemWidth += itemWidthCache[selectedKey] + overflowTargetWidth;
+            itemSize += itemSizeCache[selectedKey] + overflowTargetSize;
+            shouldAddGap = true;
         }
     }
     else {
-        itemWidth += overflowTargetWidth;
+        itemSize += overflowTargetSize;
     }
-    for (const key in itemWidthCache) {
+    for (const key in itemSizeCache) {
         if (key !== selectedKey) {
-            itemWidth += itemWidthCache[key];
-            if (itemWidth > containerWidth) {
+            itemSize += itemSizeCache[key] + (shouldAddGap ? containerGap : 0);
+            shouldAddGap = true;
+            if (itemSize > containerSize) {
                 hiddenIds.push(key);
             }
         }
@@ -61,12 +63,13 @@ export const useOverflowListModel = createModelHook({
 })(config => {
     const shouldCalculateOverflow = config.shouldCalculateOverflow === undefined ? true : config.shouldCalculateOverflow;
     const [hiddenIds, setHiddenIds] = React.useState(config.initialHiddenIds);
-    const [itemWidthCache, setItemWidthCache] = React.useState({});
-    const [containerWidth, setContainerWidth] = React.useState(0);
-    const containerWidthRef = React.useRef(0);
-    const itemWidthCacheRef = React.useRef(itemWidthCache);
+    const [itemSizeCache, setItemSizeCache] = React.useState({});
+    const [containerSize, setContainerSize] = React.useState(0);
+    const [containerGap, setContainerGap] = React.useState(0);
+    const containerSizeRef = React.useRef(0);
+    const itemSizeCacheRef = React.useRef(itemSizeCache);
     const [overflowTargetWidth, setOverflowTargetWidth] = React.useState(0);
-    const overflowTargetWidthRef = React.useRef(0);
+    const overflowTargetSizeRef = React.useRef(0);
     const internalHiddenIds = shouldCalculateOverflow ? hiddenIds : [];
     // Cursors skip over disabled ids, but know nothing of hidden ids. We'll go ahead and disable
     // hidden ids as well
@@ -78,47 +81,91 @@ export const useOverflowListModel = createModelHook({
     const state = {
         ...model.state,
         hiddenIds: internalHiddenIds,
-        itemWidthCache,
-        containerWidth,
+        itemSizeCache,
+        /**
+         * @deprecated Use `itemSizeCache` instead
+         */
+        itemWidthCache: itemSizeCache,
+        containerSize,
+        /**
+         * @deprecated Use `containerSize` instead
+         */
+        containerWidth: containerSize,
+        containerGap,
         overflowTargetWidth,
     };
     const events = {
         ...model.events,
         select(data) {
             const { selectedIds } = model.selection.select(data.id, state);
-            const ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, selectedIds, config.items);
+            const ids = getHiddenIds(containerSizeRef.current, containerGap, overflowTargetSizeRef.current, itemSizeCacheRef.current, selectedIds, config.items);
             model.events.select(data);
             setHiddenIds(ids);
         },
+        setContainerSize(data) {
+            containerSizeRef.current =
+                model.state.orientation === 'horizontal' ? data.width || 0 : data.height || 0;
+            setContainerSize(containerSizeRef.current);
+            const ids = getHiddenIds(containerSizeRef.current, containerGap, overflowTargetSizeRef.current, itemSizeCacheRef.current, state.selectedIds, config.items);
+            setHiddenIds(ids);
+        },
+        /**
+         * @deprecated Use `setContainerSize` instead and pass both `width` and `height`
+         */
         setContainerWidth(data) {
-            containerWidthRef.current = data.width || 0;
-            setContainerWidth(data.width || 0);
-            const ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds, config.items);
+            events.setContainerSize({ width: data.width, height: 0 });
+        },
+        setContainerGap(data) {
+            setContainerGap(data.size);
+            const ids = getHiddenIds(containerSizeRef.current, data.size, overflowTargetSizeRef.current, itemSizeCacheRef.current, state.selectedIds, config.items);
             setHiddenIds(ids);
         },
+        setOverflowTargetSize(data) {
+            overflowTargetSizeRef.current =
+                model.state.orientation === 'horizontal' ? data.width || 0 : data.height || 0;
+            setOverflowTargetWidth(overflowTargetSizeRef.current);
+        },
+        /**
+         *
+         * @deprecated `setOverflowTargetWidth` is deprecated. Please use `setOverflowTargetSize` and pass in the `width` and set `height` to `0`.
+         */
         setOverflowTargetWidth(data) {
-            overflowTargetWidthRef.current = data.width;
-            setOverflowTargetWidth(data.width);
+            overflowTargetSizeRef.current = data.width;
+            events.setOverflowTargetSize({ width: overflowTargetSizeRef.current, height: 0 });
         },
+        /**
+         *
+         * @deprecated `addItemWidth` is deprecated. Please use `addItemSize` and set the `width`
+         */
         addItemWidth(data) {
-            itemWidthCacheRef.current = {
-                ...itemWidthCacheRef.current,
-                [data.id]: data.width,
+            events.addItemSize({ id: data.id, width: data.width, height: 0 });
+        },
+        addItemSize(data) {
+            itemSizeCacheRef.current = {
+                ...itemSizeCacheRef.current,
+                [data.id]: model.state.orientation === 'horizontal' ? data.width : data.height,
             };
-            setItemWidthCache(itemWidthCacheRef.current);
-            const ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds, config.items);
+            setItemSizeCache(itemSizeCacheRef.current);
+            const ids = getHiddenIds(containerSizeRef.current, containerGap, overflowTargetSizeRef.current, itemSizeCacheRef.current, state.selectedIds, config.items);
             setHiddenIds(ids);
         },
-        removeItemWidth(data) {
-            const newCache = { ...itemWidthCacheRef.current };
+        removeItemSize(data) {
+            const newCache = { ...itemSizeCacheRef.current };
             delete newCache[data.id];
-            itemWidthCacheRef.current = newCache;
-            setItemWidthCache(itemWidthCacheRef.current);
-            const ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds !== 'all'
+            itemSizeCacheRef.current = newCache;
+            setItemSizeCache(itemSizeCacheRef.current);
+            const ids = getHiddenIds(containerSizeRef.current, containerGap, overflowTargetSizeRef.current, itemSizeCacheRef.current, state.selectedIds !== 'all'
                 ? state.selectedIds.filter(sId => data.id !== sId)
                 : state.selectedIds, config.items);
             setHiddenIds(ids);
         },
+        /**
+         *
+         * @deprecated `removeItemWidth` is deprecated. Please use `removeItemSize`.
+         */
+        removeItemWidth(data) {
+            events.removeItemSize({ id: data.id });
+        },
         addHiddenKey(data) {
             setHiddenIds(ids => ids.concat(data.id));
         },

package/dist/es6/collection/lib/useOverflowListTarget.d.ts

@@ -6,8 +6,11 @@ import React from 'react';
 export declare const useOverflowListTarget: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         hiddenIds: string[];
+        itemSizeCache: Record<string, number>;
         itemWidthCache: Record<string, number>;
+        containerSize: number;
         containerWidth: number;
+        containerGap: number;
         overflowTargetWidth: number;
         selectedIds: string[] | "all";
         unselectedIds: string[];
@@ -37,9 +40,20 @@ export declare const useOverflowListTarget: import("@workday/canvas-kit-react/co
         select(data: {
             id: string;
         }): void;
+        setContainerSize(data: {
+            width?: number | undefined;
+            height?: number | undefined;
+        }): void;
         setContainerWidth(data: {
             width?: number | undefined;
         }): void;
+        setContainerGap(data: {
+            size: number;
+        }): void;
+        setOverflowTargetSize(data: {
+            width: number;
+            height: number;
+        }): void;
         setOverflowTargetWidth(data: {
             width: number;
         }): void;
@@ -47,6 +61,14 @@ export declare const useOverflowListTarget: import("@workday/canvas-kit-react/co
             id: string;
             width: number;
         }): void;
+        addItemSize(data: {
+            id: string;
+            width: number;
+            height: number;
+        }): void;
+        removeItemSize(data: {
+            id: string;
+        }): void;
         removeItemWidth(data: {
             id: string;
         }): void;

package/dist/es6/collection/lib/useOverflowListTarget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useOverflowListTarget.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListTarget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2BhC,CAAC"}
+{"version":3,"file":"useOverflowListTarget.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListTarget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+BhC,CAAC"}

package/dist/es6/collection/lib/useOverflowListTarget.js

@@ -18,10 +18,13 @@ export const useOverflowListTarget = createElemPropsHook(useOverflowListModel)((
         firstRender.current = false;
         if (localRef.current) {
             const styles = getComputedStyle(localRef.current);
-            model.events.setOverflowTargetWidth({
+            model.events.setOverflowTargetSize({
                 width: localRef.current.offsetWidth +
                     parseFloat(styles.marginLeft) +
                     parseFloat(styles.marginRight),
+                height: localRef.current.offsetWidth +
+                    parseFloat(styles.marginTop) +
+                    parseFloat(styles.marginBottom),
             });
         }
     });

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

@@ -18,7 +18,7 @@ export const useComboboxMenuList = createElemPropsHook(useMenuModel)(model => {
     };
 });
 const comboboxMenuListStencil = createStencil({
-    base: { name: "hhyn46", styles: "box-sizing:border-box;" },
+    base: { name: "dnm146", styles: "box-sizing:border-box;" },
     extends: menuListStencil
 }, "combobox-menu-list-04543a");
 export const ComboboxMenuList = createSubcomponent('ul')({

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

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

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

@@ -5,7 +5,7 @@ import { defaultCanvasTheme, useTheme } from './theming';
 import { brand, base } from '@workday/canvas-tokens-web';
 import { createStyles, getCache } from '@workday/canvas-kit-styling';
 // copied from brand/_variables.css
-const defaultBranding = createStyles({ name: "hhyn3", styles: "--cnvs-brand-error-darkest:rgba(128,22,14,1);--cnvs-brand-common-alert-inner:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-common-error-inner:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-common-focus-outline:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-neutral-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-neutral-darkest:var(--cnvs-base-palette-licorice-400);--cnvs-brand-neutral-dark:var(--cnvs-base-palette-licorice-300);--cnvs-brand-neutral-base:var(--cnvs-base-palette-soap-600);--cnvs-brand-neutral-light:var(--cnvs-base-palette-soap-300);--cnvs-brand-neutral-lightest:var(--cnvs-base-palette-soap-200);--cnvs-brand-success-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-success-darkest:var(--cnvs-base-palette-green-apple-600);--cnvs-brand-success-dark:var(--cnvs-base-palette-green-apple-500);--cnvs-brand-success-base:var(--cnvs-base-palette-green-apple-400);--cnvs-brand-success-light:var(--cnvs-base-palette-green-apple-300);--cnvs-brand-success-lightest:var(--cnvs-base-palette-green-apple-100);--cnvs-brand-error-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-error-dark:var(--cnvs-base-palette-cinnamon-600);--cnvs-brand-error-base:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-error-light:var(--cnvs-base-palette-cinnamon-200);--cnvs-brand-error-lightest:var(--cnvs-base-palette-cinnamon-100);--cnvs-brand-alert-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-alert-darkest:var(--cnvs-base-palette-cantaloupe-600);--cnvs-brand-alert-dark:var(--cnvs-base-palette-cantaloupe-500);--cnvs-brand-alert-base:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-alert-light:var(--cnvs-base-palette-cantaloupe-200);--cnvs-brand-alert-lightest:var(--cnvs-base-palette-cantaloupe-100);--cnvs-brand-primary-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-primary-darkest:var(--cnvs-base-palette-blueberry-600);--cnvs-brand-primary-dark:var(--cnvs-base-palette-blueberry-500);--cnvs-brand-primary-base:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-primary-light:var(--cnvs-base-palette-blueberry-200);--cnvs-brand-primary-lightest:var(--cnvs-base-palette-blueberry-100);--cnvs-brand-gradient-primary:linear-gradient(90deg, var(--cnvs-brand-primary-base) 0%, var(--cnvs-brand-primary-dark) 100%);" });
+const defaultBranding = createStyles({ name: "dnm13", styles: "--cnvs-brand-error-darkest:rgba(128,22,14,1);--cnvs-brand-common-alert-inner:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-common-error-inner:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-common-focus-outline:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-neutral-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-neutral-darkest:var(--cnvs-base-palette-licorice-400);--cnvs-brand-neutral-dark:var(--cnvs-base-palette-licorice-300);--cnvs-brand-neutral-base:var(--cnvs-base-palette-soap-600);--cnvs-brand-neutral-light:var(--cnvs-base-palette-soap-300);--cnvs-brand-neutral-lightest:var(--cnvs-base-palette-soap-200);--cnvs-brand-success-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-success-darkest:var(--cnvs-base-palette-green-apple-600);--cnvs-brand-success-dark:var(--cnvs-base-palette-green-apple-500);--cnvs-brand-success-base:var(--cnvs-base-palette-green-apple-400);--cnvs-brand-success-light:var(--cnvs-base-palette-green-apple-300);--cnvs-brand-success-lightest:var(--cnvs-base-palette-green-apple-100);--cnvs-brand-error-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-error-dark:var(--cnvs-base-palette-cinnamon-600);--cnvs-brand-error-base:var(--cnvs-base-palette-cinnamon-500);--cnvs-brand-error-light:var(--cnvs-base-palette-cinnamon-200);--cnvs-brand-error-lightest:var(--cnvs-base-palette-cinnamon-100);--cnvs-brand-alert-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-alert-darkest:var(--cnvs-base-palette-cantaloupe-600);--cnvs-brand-alert-dark:var(--cnvs-base-palette-cantaloupe-500);--cnvs-brand-alert-base:var(--cnvs-base-palette-cantaloupe-400);--cnvs-brand-alert-light:var(--cnvs-base-palette-cantaloupe-200);--cnvs-brand-alert-lightest:var(--cnvs-base-palette-cantaloupe-100);--cnvs-brand-primary-accent:var(--cnvs-base-palette-french-vanilla-100);--cnvs-brand-primary-darkest:var(--cnvs-base-palette-blueberry-600);--cnvs-brand-primary-dark:var(--cnvs-base-palette-blueberry-500);--cnvs-brand-primary-base:var(--cnvs-base-palette-blueberry-400);--cnvs-brand-primary-light:var(--cnvs-base-palette-blueberry-200);--cnvs-brand-primary-lightest:var(--cnvs-base-palette-blueberry-100);--cnvs-brand-gradient-primary:linear-gradient(90deg, var(--cnvs-brand-primary-base) 0%, var(--cnvs-brand-primary-dark) 100%);" });
 const mappedKeys = {
     lightest: 'lightest',
     light: 'light',

package/dist/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: "hhyn4g", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
+    base: { name: "dnm14g", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
 }, "form-field-container-b7ba71");
 /**
  * @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: "hhyn4p", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
+    base: { name: "dnm14p", styles: "box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cnvs-sys-space-x2);" }
 }, "form-field-field-fc001f");
 export const FormFieldField = createSubcomponent('div')({
     displayName: 'FormField.Field',

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

@@ -8,15 +8,15 @@ import { useFormFieldModel } from './hooks';
 export const formFieldGroupLabelStencil = createStencil({
     extends: textStencil,
     // @ts-ignore Still weird about CSS font variables
-    base: { name: "hhyn4t", 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: "dnm14t", 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: "hhyn4u", 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: "dnm14u", 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: "hhyn4v", styles: "width:100%;" },
-            horizontalStart: { name: "hhyn4w", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
-            horizontalEnd: { name: "hhyn4x", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" }
+            vertical: { name: "dnm14v", styles: "width:100%;" },
+            horizontalStart: { name: "dnm14w", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
+            horizontalEnd: { name: "dnm14x", 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: "hhyn4q", 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: "dnm14q", 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: "hhyn4r", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" },
-            alert: { name: "hhyn4s", 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: "dnm14r", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" },
+            alert: { name: "dnm14s", 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-ea1ca7");

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: "hhyn4d", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
+    base: { name: "dnm14d", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
     modifiers: {
         error: {
-            error: { name: "hhyn4e", styles: "color:var(--cnvs-brand-error-base);" },
-            alert: { name: "hhyn4f", styles: "" }
+            error: { name: "dnm14e", styles: "color:var(--cnvs-brand-error-base);" },
+            alert: { name: "dnm14f", styles: "" }
         }
     },
     defaultModifiers: {

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

@@ -8,18 +8,18 @@ import { useFormFieldLabel, useFormFieldModel } from './hooks';
 export const formFieldLabelStencil = createStencil({
     extends: textStencil,
     // @ts-ignore Still weird about CSS font variables
-    base: { name: "hhyn47", 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: "dnm147", 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: "hhyn48", 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: "dnm148", 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: "hhyn49", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
-            horizontalEnd: { name: "hhyn4a", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" },
-            vertical: { name: "hhyn4b", styles: "width:100%;" }
+            horizontalStart: { name: "dnm149", styles: "justify-content:flex-start;float:left;max-height:var(--cnvs-sys-space-x10);" },
+            horizontalEnd: { name: "dnm14a", styles: "max-height:var(--cnvs-sys-space-x10);float:left;justify-content:flex-end;" },
+            vertical: { name: "dnm14b", styles: "width:100%;" }
         },
         isHidden: {
-            true: { name: "hhyn4c", styles: "clip:rect(1px, 1px, 1px, 1px);clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);position:absolute;overflow:hidden;white-space:nowrap;height:1px;width:1px;margin:-1px;padding:0;border:0;" }
+            true: { name: "dnm14c", styles: "clip:rect(1px, 1px, 1px, 1px);clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);position:absolute;overflow:hidden;white-space:nowrap;height:1px;width:1px;margin:-1px;padding:0;border:0;" }
         }
     },
     defaultModifiers: {

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: "hhyn4h", 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: "dnm14h", 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: "hhyn4i", styles: "width:100%;[data-width=\"ck-formfield-width\"]{width:100%;}&:has(div[data-width=\"ck-formfield-width\"]){width:100%;}" }
+            true: { name: "dnm14i", styles: "width:100%;[data-width=\"ck-formfield-width\"]{width:100%;}&:has(div[data-width=\"ck-formfield-width\"]){width:100%;}" }
         },
         orientation: {
-            horizontalStart: { name: "hhyn4j", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
-            horizontalEnd: { name: "hhyn4k", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
-            vertical: { name: "hhyn4l", styles: "flex-direction:column;gap:var(--cnvs-sys-space-x1);align-items:flex-start;" }
+            horizontalStart: { name: "dnm14j", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
+            horizontalEnd: { name: "dnm14k", styles: "flex-direction:row;gap:var(--cnvs-sys-space-x8);" },
+            vertical: { name: "dnm14l", styles: "flex-direction:column;gap:var(--cnvs-sys-space-x1);align-items:flex-start;" }
         },
         required: {
-            true: { name: "hhyn4m", styles: "" }
+            true: { name: "dnm14m", styles: "" }
         },
         error: {
-            error: { name: "hhyn4n", styles: "" },
-            alert: { name: "hhyn4o", styles: "" }
+            error: { name: "dnm14n", styles: "" },
+            alert: { name: "dnm14o", styles: "" }
         }
     },
     defaultModifiers: {

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

@@ -21,10 +21,10 @@ export const accentIconStencil = createStencil({
     vars: {
         color: '',
     },
-    base: { name: "hhyn11", styles: "box-sizing:border-box;--size-svg-a30d66:3.5rem;& .color-500{fill:var(--color-accent-icon-f47b2a, var(--cnvs-base-palette-blueberry-500));}& .french-vanilla-100{fill:var(--cnvs-base-palette-french-vanilla-100);}" },
+    base: { name: "dnm111", styles: "box-sizing:border-box;--size-svg-a30d66:3.5rem;& .color-500{fill:var(--color-accent-icon-f47b2a, var(--cnvs-base-palette-blueberry-500));}& .french-vanilla-100{fill:var(--cnvs-base-palette-french-vanilla-100);}" },
     modifiers: {
         transparent: {
-            true: { name: "hhyn12", styles: "& .french-vanilla-100{fill:transparent;}" }
+            true: { name: "dnm112", styles: "& .french-vanilla-100{fill:transparent;}" }
         }
     }
 }, "accent-icon-f47b2a");

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

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

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

@@ -36,10 +36,10 @@ export const graphicStyles = ({ width, height, grow }) => {
 };
 export const graphicStencil = createStencil({
     extends: svgStencil,
-    base: { name: "hhyn16", styles: "box-sizing:border-box;" },
+    base: { name: "dnm116", styles: "box-sizing:border-box;" },
     modifiers: {
         grow: {
-            true: { name: "hhyn17", styles: "width:100%;--width-svg-a30d66:100%;" }
+            true: { name: "dnm117", styles: "width:100%;--width-svg-a30d66:100%;" }
         }
     }
 }, "graphic-ee386a");

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

@@ -13,10 +13,10 @@ export const svgStencil = createStencil({
         /** sets width and height of svg element */
         size: '',
     },
-    base: { name: "hhynz", styles: "box-sizing:border-box;display:inline-block;> svg{display:block;width:var(--width-svg-a30d66, var(--size-svg-a30d66));height:var(--height-svg-a30d66, var(--size-svg-a30d66));}" },
+    base: { name: "dnm1z", styles: "box-sizing:border-box;display:inline-block;> svg{display:block;width:var(--width-svg-a30d66, var(--size-svg-a30d66));height:var(--height-svg-a30d66, var(--size-svg-a30d66));}" },
     modifiers: {
         shouldMirror: {
-            true: { name: "hhyn10", styles: "transform:scaleX(-1);" }
+            true: { name: "dnm110", styles: "transform:scaleX(-1);" }
         }
     }
 }, "svg-a30d66");

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

@@ -55,7 +55,7 @@ export const systemIconStencil = createStencil({
         accentColor: '',
         backgroundColor: '',
     },
-    base: { name: "hhyn14", styles: "box-sizing:border-box;& .wd-icon-fill{fill:var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200));}& .wd-icon-accent, & .wd-icon-accent2{fill:var(--accentColor-system-icon-583fae, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200)));}& .wd-icon-background{fill:var(--backgroundColor-system-icon-583fae, transparent);}&:where(:hover, .hover) .wd-icon-fill{fill:var(--fillHover-193ff4, var(--colorHover-193ff4, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200))));}&:where(:hover, .hover) .wd-icon-accent, & .wd-icon-accent2{fill:var(--accentHover-193ff4, var(--colorHover-193ff4, var(--accentColor-system-icon-583fae, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200)))));}&:where(:hover, .hover) .wd-icon-background{fill:var(--backgroundHover-193ff4, var(--backgroundColor-system-icon-583fae, transparent));}" }
+    base: { name: "dnm114", styles: "box-sizing:border-box;& .wd-icon-fill{fill:var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200));}& .wd-icon-accent, & .wd-icon-accent2{fill:var(--accentColor-system-icon-583fae, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200)));}& .wd-icon-background{fill:var(--backgroundColor-system-icon-583fae, transparent);}&:where(:hover, .hover) .wd-icon-fill{fill:var(--fillHover-193ff4, var(--colorHover-193ff4, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200))));}&:where(:hover, .hover) .wd-icon-accent, & .wd-icon-accent2{fill:var(--accentHover-193ff4, var(--colorHover-193ff4, var(--accentColor-system-icon-583fae, var(--color-system-icon-583fae, var(--cnvs-base-palette-licorice-200)))));}&:where(:hover, .hover) .wd-icon-background{fill:var(--backgroundHover-193ff4, var(--backgroundColor-system-icon-583fae, transparent));}" }
 }, "system-icon-583fae");
 export const SystemIcon = createComponent('span')({
     displayName: 'SystemIcon',

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

@@ -20,7 +20,7 @@ const systemIconCircleStencil = createStencil({
         backgroundColor: '',
         iconColor: '',
     },
-    base: { name: "hhyn15", styles: "box-sizing:border-box;background:var(--backgroundColor-system-icon-circle-554859, var(--cnvs-base-palette-soap-200));display:flex;align-items:center;justify-content:center;padding:var(--cnvs-sys-space-zero);border:none;border-radius:var(--cnvs-sys-shape-round);overflow:hidden;width:var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10));height:var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10));--size-svg-a30d66:calc(var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10)) * 0.625);--color-system-icon-583fae:var(--iconColor-system-icon-circle-554859);& img{width:100%;height:100%;}" }
+    base: { name: "dnm115", styles: "box-sizing:border-box;background:var(--backgroundColor-system-icon-circle-554859, var(--cnvs-base-palette-soap-200));display:flex;align-items:center;justify-content:center;padding:var(--cnvs-sys-space-zero);border:none;border-radius:var(--cnvs-sys-shape-round);overflow:hidden;width:var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10));height:var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10));--size-svg-a30d66:calc(var(--containerSize-system-icon-circle-554859, var(--cnvs-sys-space-x10)) * 0.625);--color-system-icon-583fae:var(--iconColor-system-icon-circle-554859);& img{width:100%;height:100%;}" }
 }, "system-icon-circle-554859");
 export const SystemIconCircle = createComponent('span')({
     displayName: 'SystemIconCircle',

package/dist/es6/loading-dots/lib/LoadingDots.js

@@ -5,13 +5,13 @@ import { handleCsProp, keyframes, createStencil, calc } from '@workday/canvas-ki
 /**
  * Keyframe for the dots loading animation.
  */
-const keyframesLoading = keyframes({ name: "hhyn4y", styles: "0%, 80%, 100%{transform:scale(0);}40%{transform:scale(1);}" });
+const keyframesLoading = keyframes({ name: "dnm14y", styles: "0%, 80%, 100%{transform:scale(0);}40%{transform:scale(1);}" });
 export const loadingDotsStencil = createStencil({
     vars: {
         animationDurationMs: '40ms',
         loadingDotColor: system.color.bg.alt.strong,
     },
-    base: { name: "hhyn4z", styles: "--animationDurationMs-loading-dots-f22098:40ms;--loadingDotColor-loading-dots-f22098:var(--cnvs-sys-color-bg-alt-strong);box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-space-x2);& [data-part=\"loading-animation-dot\"]{background-color:var(--loadingDotColor-loading-dots-f22098);width:var(--cnvs-sys-space-x4);height:var(--cnvs-sys-space-x4);font-size:var(--cnvs-sys-space-zero);border-radius:var(--cnvs-sys-shape-round);transform:scale(0);display:inline-block;animation-name:animation-hhyn4y;animation-duration:calc(var(--animationDurationMs-loading-dots-f22098) * 35);animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-fill-mode:both;&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(var(--animationDurationMs-loading-dots-f22098) * 4);}&:nth-child(3){animation-delay:calc(var(--animationDurationMs-loading-dots-f22098) * 8);}}" }
+    base: { name: "dnm14z", styles: "--animationDurationMs-loading-dots-f22098:40ms;--loadingDotColor-loading-dots-f22098:var(--cnvs-sys-color-bg-alt-strong);box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-space-x2);& [data-part=\"loading-animation-dot\"]{background-color:var(--loadingDotColor-loading-dots-f22098);width:var(--cnvs-sys-space-x4);height:var(--cnvs-sys-space-x4);font-size:var(--cnvs-sys-space-zero);border-radius:var(--cnvs-sys-shape-round);transform:scale(0);display:inline-block;animation-name:animation-dnm14y;animation-duration:calc(var(--animationDurationMs-loading-dots-f22098) * 35);animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-fill-mode:both;&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(var(--animationDurationMs-loading-dots-f22098) * 4);}&:nth-child(3){animation-delay:calc(var(--animationDurationMs-loading-dots-f22098) * 8);}}" }
 }, "loading-dots-f22098");
 /**
  * A simple component that displays three horizontal dots, to be used when some data is loading.

package/dist/es6/menu/lib/MenuCard.js

@@ -12,7 +12,7 @@ export const menuCardStencil = createStencil({
         transformOriginVertical: 'top',
         transformOriginHorizontal: 'left',
     },
-    base: { name: "hhyn2n", styles: "--minWidth-menu-card-07ca6c:0.0625rem;--transformOriginVertical-menu-card-07ca6c:top;--transformOriginHorizontal-menu-card-07ca6c:left;box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-base-palette-black-pepper-300);position:relative;display:flex;flex-direction:column;transition:transform ease-out 150ms;padding:var(--cnvs-sys-space-zero);max-width:calc(100vw - var(--cnvs-sys-space-x8));box-shadow:var(--cnvs-sys-depth-3);min-width:var(--minWidth-menu-card-07ca6c);transform-origin:var(--transformOriginVertical-menu-card-07ca6c) var(--transformOriginHorizontal-menu-card-07ca6c);.wd-no-animation &{animation:none;}" }
+    base: { name: "dnm12n", styles: "--minWidth-menu-card-07ca6c:0.0625rem;--transformOriginVertical-menu-card-07ca6c:top;--transformOriginHorizontal-menu-card-07ca6c:left;box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);color:var(--cnvs-base-palette-black-pepper-300);position:relative;display:flex;flex-direction:column;transition:transform ease-out 150ms;padding:var(--cnvs-sys-space-zero);max-width:calc(100vw - var(--cnvs-sys-space-x8));box-shadow:var(--cnvs-sys-depth-3);min-width:var(--minWidth-menu-card-07ca6c);transform-origin:var(--transformOriginVertical-menu-card-07ca6c) var(--transformOriginHorizontal-menu-card-07ca6c);.wd-no-animation &{animation:none;}" }
 }, "menu-card-07ca6c");
 export const useMenuCard = createElemPropsHook(useMenuModel)(() => {
     return {};

package/dist/es6/menu/lib/MenuItem.js

@@ -8,7 +8,7 @@ import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { useListItemRegister, useListItemRovingFocus, useListItemSelect, } from '@workday/canvas-kit-react/collection';
 import { useMenuModel } from './useMenuModel';
 export const menuItemStencil = createStencil({
-    base: { name: "hhyn2m", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);display:flex;align-items:center;width:100%;gap:var(--cnvs-sys-space-x4);padding:var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x4);cursor:pointer;color:var(--cnvs-sys-color-fg-default);border-width:0;text-align:start;transition:background-color 80ms, color 80ms;background-color:inherit;min-height:var(--cnvs-sys-space-x10);--color-system-icon-583fae:currentcolor;& :where([data-part=\"menu-item-selected\"]){transition:opacity 80ms linear;opacity:var(--cnvs-sys-opacity-zero);}&:where(:has(span)){display:flex;}&:is([aria-selected=true]){color:var(--cnvs-brand-primary-dark);background-color:var(--cnvs-brand-primary-lightest);}&:is(.hover, :hover){color:var(--cnvs-sys-color-fg-strong);background-color:var(--cnvs-brand-neutral-lightest);}&:is(.focus, :focus){color:var(--cnvs-brand-primary-accent);outline:none;background-color:var(--cnvs-brand-primary-base);}&:is(:disabled, [aria-disabled=true]){color:var(--cnvs-sys-color-text-disabled);cursor:default;&:where(.focus, :focus){background-color:var(--cnvs-brand-primary-light);}}& :where([data-part=\"menu-item-text\"]){flex-grow:1;align-self:center;}& :where([data-part=\"menu-icon-icon\"]){align-self:start;}" }
+    base: { name: "dnm12m", styles: "box-sizing:border-box;font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-base-font-weight-400);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);display:flex;align-items:center;width:100%;gap:var(--cnvs-sys-space-x4);padding:var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x4);cursor:pointer;color:var(--cnvs-sys-color-fg-default);border-width:0;text-align:start;transition:background-color 80ms, color 80ms;background-color:inherit;min-height:var(--cnvs-sys-space-x10);--color-system-icon-583fae:currentcolor;& :where([data-part=\"menu-item-selected\"]){transition:opacity 80ms linear;opacity:var(--cnvs-sys-opacity-zero);}&:where(:has(span)){display:flex;}&:is([aria-selected=true]){color:var(--cnvs-brand-primary-dark);background-color:var(--cnvs-brand-primary-lightest);}&:is(.hover, :hover){color:var(--cnvs-sys-color-fg-strong);background-color:var(--cnvs-brand-neutral-lightest);}&:is(.focus, :focus){color:var(--cnvs-brand-primary-accent);outline:none;background-color:var(--cnvs-brand-primary-base);}&:is(:disabled, [aria-disabled=true]){color:var(--cnvs-sys-color-text-disabled);cursor:default;&:where(.focus, :focus){background-color:var(--cnvs-brand-primary-light);}}& :where([data-part=\"menu-item-text\"]){flex-grow:1;align-self:center;}& :where([data-part=\"menu-icon-icon\"]){align-self:start;}" }
 }, "menu-item-7213c6");
 const MenuItemIcon = (elemProps) => {
     return React.createElement(SystemIcon, { "data-part": "menu-item-icon", ...elemProps });

package/dist/es6/menu/lib/MenuList.js

@@ -12,11 +12,11 @@ export const useMenuList = composeHooks(createElemPropsHook(useMenuModel)(model
     };
 }), useReturnFocus, useFocusRedirect);
 export const menuListStencil = createStencil({
-    base: { name: "hhyn2o", styles: "box-sizing:border-box;background:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-zero);padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-zero);" },
+    base: { name: "dnm12o", styles: "box-sizing:border-box;background:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-zero);padding:var(--cnvs-sys-space-zero);gap:var(--cnvs-sys-space-zero);" },
     modifiers: {
         orientation: {
-            vertical: { name: "hhyn2p", styles: "flex-direction:column;" },
-            horizontal: { name: "hhyn2q", styles: "flex-direction:row;" }
+            vertical: { name: "dnm12p", styles: "flex-direction:column;" },
+            horizontal: { name: "dnm12q", styles: "flex-direction:row;" }
         }
     }
 }, "menu-list-b9b420");