@workday/canvas-kit-react 13.0.0-alpha.944-next.0 → 13.0.0-alpha.950-next.0

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

@@ -1 +1 @@
-{"version":3,"file":"useListResetCursorOnBlur.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListResetCursorOnBlur.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAGhB,mBAAmB;;;EAetC,CAAC"}
+{"version":3,"file":"useListResetCursorOnBlur.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListResetCursorOnBlur.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAYhB,mBAAmB;;;EAoBtC,CAAC"}

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

@@ -24,6 +24,13 @@ const useListModel_1 = require("./useListModel");
  */
 exports.useListResetCursorOnBlur = (0, common_1.createElemPropsHook)(useListModel_1.useListModel)(({ state, events }) => {
     const programmaticFocusRef = react_1.default.useRef(false);
+    const requestAnimationFrameRef = react_1.default.useRef(0);
+    (0, common_1.useMountLayout)(() => {
+        return () => {
+            // Cancelling the animation frame prevents React unmount errors
+            cancelAnimationFrame(requestAnimationFrameRef.current);
+        };
+    });
     return {
         onKeyDown(event) {
             // Programmatic focus only on any focus change via keyboard
@@ -36,7 +43,12 @@ exports.useListResetCursorOnBlur = (0, common_1.createElemPropsHook)(useListMode
         },
         onBlur() {
             if (!programmaticFocusRef.current) {
-                events.goTo({ id: state.selectedIds[0] });
+                // use an animation frame to wait for any other model changes that may happen on a blur
+                requestAnimationFrameRef.current = requestAnimationFrame(() => {
+                    if (state.selectedIds[0] !== state.cursorId) {
+                        events.goTo({ id: state.selectedIds[0] });
+                    }
+                });
             }
         },
     };

package/dist/commonjs/collection/lib/useOverflowListItemMeasure.d.ts

@@ -12,7 +12,9 @@
 export declare const useOverflowListItemMeasure: 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;
@@ -44,12 +46,20 @@ export declare const useOverflowListItemMeasure: import("@workday/canvas-kit-rea
         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;
@@ -57,6 +67,14 @@ export declare const useOverflowListItemMeasure: import("@workday/canvas-kit-rea
             id: string;
             width: number;
         }): void;
+        addItemSize(data: {
+            id: string;
+            width: number;
+            height: number;
+        }): void;
+        removeItemSize(data: {
+            id: string;
+        }): void;
         removeItemWidth(data: {
             id: string;
         }): void;
@@ -69,6 +87,11 @@ export declare const useOverflowListItemMeasure: import("@workday/canvas-kit-rea
         selectAll(): void;
         unselectAll(): void;
         setSelectedIds(ids: string[] | "all"): void;
+        remove(data: {
+            id: string;
+            nextId?: string | undefined;
+            event?: Event | import("react").SyntheticEvent<Element, Event> | undefined;
+        }): void;
         goTo(data: {
             id: string;
         }): void;

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

@@ -1 +1 @@
-{"version":3,"file":"useOverflowListItemMeasure.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListItemMeasure.tsx"],"names":[],"mappings":"AASA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCtC,CAAC"}
+{"version":3,"file":"useOverflowListItemMeasure.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListItemMeasure.tsx"],"names":[],"mappings":"AASA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCtC,CAAC"}

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

@@ -24,15 +24,18 @@ exports.useOverflowListItemMeasure = (0, common_1.createElemPropsHook)(useOverfl
     (0, common_1.useMountLayout)(() => {
         if (localRef.current) {
             const styles = getComputedStyle(localRef.current);
-            model.events.addItemWidth({
+            model.events.addItemSize({
                 id: name,
                 width: localRef.current.offsetWidth +
                     parseFloat(styles.marginLeft) +
                     parseFloat(styles.marginRight),
+                height: localRef.current.offsetHeight +
+                    parseFloat(styles.marginTop) +
+                    parseFloat(styles.marginBottom),
             });
         }
         return () => {
-            model.events.removeItemWidth({ id: name });
+            model.events.removeItemSize({ id: name });
         };
     });
     const hidden = model.state.hiddenIds.includes(name);

package/dist/commonjs/collection/lib/useOverflowListMeasure.d.ts

@@ -6,7 +6,9 @@ import * as React from 'react';
 export declare const useOverflowListMeasure: 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;
@@ -38,12 +40,20 @@ export declare const useOverflowListMeasure: import("@workday/canvas-kit-react/c
         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;
@@ -51,6 +61,14 @@ export declare const useOverflowListMeasure: import("@workday/canvas-kit-react/c
             id: string;
             width: number;
         }): void;
+        addItemSize(data: {
+            id: string;
+            width: number;
+            height: number;
+        }): void;
+        removeItemSize(data: {
+            id: string;
+        }): void;
         removeItemWidth(data: {
             id: string;
         }): void;
@@ -63,6 +81,11 @@ export declare const useOverflowListMeasure: import("@workday/canvas-kit-react/c
         selectAll(): void;
         unselectAll(): void;
         setSelectedIds(ids: string[] | "all"): void;
+        remove(data: {
+            id: string;
+            nextId?: string | undefined;
+            event?: Event | React.SyntheticEvent<Element, Event> | undefined;
+        }): void;
         goTo(data: {
             id: string;
         }): void;

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

@@ -1 +1 @@
-{"version":3,"file":"useOverflowListMeasure.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListMeasure.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B;;;GAGG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBjC,CAAC"}
+{"version":3,"file":"useOverflowListMeasure.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useOverflowListMeasure.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B;;;GAGG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBjC,CAAC"}

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

@@ -12,7 +12,7 @@ exports.useOverflowListMeasure = (0, common_1.createElemPropsHook)(useOverflowLi
     const gapProperty = model.state.orientation === 'horizontal' ? 'columnGap' : 'rowGap';
     (0, common_1.useResizeObserver)({
         ref: localRef,
-        onResize: model.events.setContainerWidth,
+        onResize: model.events.setContainerSize,
     });
     (0, common_1.useMountLayout)(() => {
         if (localRef.current) {