@workday/canvas-kit-react 8.0.0-alpha.253-next.22 → 8.0.0-alpha.428-next.2

package/dist/commonjs/tabs/lib/TabsPanel.d.ts

@@ -22,7 +22,7 @@ export interface TabPanelProps extends ExtractProps<typeof Box, never> {
      */
     tabIndex?: number;
 }
-export declare const useTabsPanel: <P extends {}, R>(model: {
+export declare const useTabsPanel: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         getId: (item: any) => string;
         orientation: import("../../collection/lib/useBaseListModel").Orientation;
@@ -32,10 +32,14 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
         itemWidthCache: Record<string, number>;
         containerWidth: number;
         overflowTargetWidth: number;
-        selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+        selectedIds: string[] | "all";
         unselectedIds: string[];
         cursorId: string;
         columnCount: number;
+        pageSizeRef: React.MutableRefObject<number>;
+        cursorIndexRef: {
+            readonly current: number;
+        };
         UNSTABLE_virtual: {
             virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
             totalSize: number;
@@ -83,10 +87,6 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
         }): void;
         selectAll(): void;
         unselectAll(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
         goTo(data: {
             id: string;
         }): void;
@@ -100,6 +100,10 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;
@@ -115,11 +119,15 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
             returnFocusRef: React.RefObject<any> | undefined;
             placement: import("@popperjs/core").Placement;
             id: string;
-            visibility: import("../..").Visibility;
-            selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+            visibility: "hidden" | "visible";
+            selectedIds: string[] | "all";
             unselectedIds: string[];
             cursorId: string;
             columnCount: number;
+            pageSizeRef: React.MutableRefObject<number>;
+            cursorIndexRef: {
+                readonly current: number;
+            };
             UNSTABLE_virtual: {
                 virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
                 totalSize: number;
@@ -129,7 +137,7 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
             };
             UNSTABLE_defaultItemHeight: number;
             containerRef: React.RefObject<HTMLDivElement>;
-            orientation: import("../../collection/lib/useBaseListModel").Orientation;
+            orientation: "horizontal" | "vertical";
             indexRef: React.MutableRefObject<number>;
             nonInteractiveIds: string[];
             isVirtualized: boolean;
@@ -147,10 +155,6 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
             }): void;
             selectAll(): void;
             unselectAll(): void;
-            registerItem(data: {
-                item: any;
-                textValue: string;
-            }): void;
             goTo(data: {
                 id: string;
             }): void;
@@ -164,6 +168,10 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
             goToLastOfRow(): void;
             goToNextPage(): void;
             goToPreviousPage(): void;
+            registerItem(data: {
+                item: any;
+                textValue: string;
+            }): void;
             unregisterItem(data: {
                 id: string;
             }): void;
@@ -178,16 +186,14 @@ export declare const useTabsPanel: <P extends {}, R>(model: {
     selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
     navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
     getId: (item: any) => string;
-}, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {
-    role: string;
+}, {
+    role: "tabpanel";
     'aria-labelledby': string;
     hidden: boolean;
     id: string;
-    tabIndex: number;
-} & P & (R extends HTMLOrSVGElement ? {
-    ref: React.Ref<R>;
-} : {});
-export declare const TabsPanel: import("../../common").ElementComponentM<"div", TabPanelProps, {
+    tabIndex: 0;
+}>;
+export declare const TabsPanel: import("@workday/canvas-kit-react/common").ElementComponentM<"div", TabPanelProps, {
     state: {
         getId: (item: any) => string;
         orientation: import("../../collection/lib/useBaseListModel").Orientation;
@@ -197,10 +203,14 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
         itemWidthCache: Record<string, number>;
         containerWidth: number;
         overflowTargetWidth: number;
-        selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+        selectedIds: string[] | "all";
         unselectedIds: string[];
         cursorId: string;
         columnCount: number;
+        pageSizeRef: React.MutableRefObject<number>;
+        cursorIndexRef: {
+            readonly current: number;
+        };
         UNSTABLE_virtual: {
             virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
             totalSize: number;
@@ -248,10 +258,6 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
         }): void;
         selectAll(): void;
         unselectAll(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
         goTo(data: {
             id: string;
         }): void;
@@ -265,6 +271,10 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;
@@ -280,11 +290,15 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
             returnFocusRef: React.RefObject<any> | undefined;
             placement: import("@popperjs/core").Placement;
             id: string;
-            visibility: import("../..").Visibility;
-            selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+            visibility: "hidden" | "visible";
+            selectedIds: string[] | "all";
             unselectedIds: string[];
             cursorId: string;
             columnCount: number;
+            pageSizeRef: React.MutableRefObject<number>;
+            cursorIndexRef: {
+                readonly current: number;
+            };
             UNSTABLE_virtual: {
                 virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
                 totalSize: number;
@@ -294,7 +308,7 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
             };
             UNSTABLE_defaultItemHeight: number;
             containerRef: React.RefObject<HTMLDivElement>;
-            orientation: import("../../collection/lib/useBaseListModel").Orientation;
+            orientation: "horizontal" | "vertical";
             indexRef: React.MutableRefObject<number>;
             nonInteractiveIds: string[];
             isVirtualized: boolean;
@@ -312,10 +326,6 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
             }): void;
             selectAll(): void;
             unselectAll(): void;
-            registerItem(data: {
-                item: any;
-                textValue: string;
-            }): void;
             goTo(data: {
                 id: string;
             }): void;
@@ -329,6 +339,10 @@ export declare const TabsPanel: import("../../common").ElementComponentM<"div",
             goToLastOfRow(): void;
             goToNextPage(): void;
             goToPreviousPage(): void;
+            registerItem(data: {
+                item: any;
+                textValue: string;
+            }): void;
             unregisterItem(data: {
                 id: string;
             }): void;

package/dist/commonjs/tabs/lib/TabsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsPanel.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAIL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,sCAAsC,CAAC;AAC1D,OAAO,EAAC,GAAG,EAAC,MAAM,kCAAkC,CAAC;AAIrD,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC;IACpE;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA2BxB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUpB,CAAC"}
+{"version":3,"file":"TabsPanel.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAIL,YAAY,EAIb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,sCAAsC,CAAC;AAC1D,OAAO,EAAC,GAAG,EAAC,MAAM,kCAAkC,CAAC;AAIrD,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC;IACpE;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAID,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBxB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUpB,CAAC"}

package/dist/commonjs/tabs/lib/TabsPanel.js

@@ -1,56 +1,32 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabsPanel = exports.useTabsPanel = void 0;
-var react_1 = __importDefault(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var useTabsModel_1 = require("./useTabsModel");
-var StyledTabsPanel = styled_1.default(layout_1.Box)(common_1.hideMouseFocus);
-exports.useTabsPanel = common_1.createElemPropsHook(useTabsModel_1.useTabsModel)(function (_a, _, elemProps) {
-    var _b;
-    var state = _a.state, events = _a.events;
-    if (elemProps === void 0) { elemProps = {}; }
-    var _c = react_1.default.useState(elemProps['data-id'] || ((_b = elemProps.item) === null || _b === void 0 ? void 0 : _b.id) || ''), localId = _c[0], setLocalId = _c[1];
-    common_1.useMountLayout(function () {
-        var defaultId = state.panelIndexRef.current;
-        var itemId = localId || String(defaultId);
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const useTabsModel_1 = require("./useTabsModel");
+const StyledTabsPanel = styled_1.default(layout_1.Box)(common_1.hideMouseFocus);
+exports.useTabsPanel = common_1.createElemPropsHook(useTabsModel_1.useTabsModel)(({ state, events }, _, elemProps = {}) => {
+    var _a;
+    const [localId, setLocalId] = react_1.default.useState(elemProps['data-id'] || ((_a = elemProps.item) === null || _a === void 0 ? void 0 : _a.id) || '');
+    common_1.useMountLayout(() => {
+        const defaultId = state.panelIndexRef.current;
+        const itemId = localId || String(defaultId);
         events.registerPanel({ item: { id: itemId }, textValue: '' });
         setLocalId(itemId);
-        return function () {
+        return () => {
             events.unregisterPanel({ id: itemId });
         };
     });
     return {
         role: 'tabpanel',
-        'aria-labelledby': state.id + "-" + localId,
+        'aria-labelledby': common_1.slugify(`${state.id}-${localId}`),
         hidden: !!localId && localId !== state.selectedIds[0],
-        id: "tabpanel-" + state.id + "-" + localId,
+        id: common_1.slugify(`tabpanel-${state.id}-${localId}`),
         tabIndex: 0,
     };
 });
@@ -58,7 +34,6 @@ exports.TabsPanel = common_1.createSubcomponent('div')({
     displayName: 'Tabs.Panel',
     modelHook: useTabsModel_1.useTabsModel,
     elemPropsHook: exports.useTabsPanel,
-})(function (_a, Element) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return (react_1.default.createElement(StyledTabsPanel, __assign({ as: Element }, elemProps), children));
+})(({ children, ...elemProps }, Element) => {
+    return (react_1.default.createElement(StyledTabsPanel, Object.assign({ as: Element }, elemProps), children));
 });

package/dist/commonjs/tabs/lib/TabsPanels.d.ts

@@ -5,20 +5,24 @@ export interface TabsPanelsProps<T = any> {
      */
     children: ((item: T) => React.ReactNode) | React.ReactNode;
 }
-export declare const TabsPanels: import("../../common").ElementComponentM<React.FC<{}>, TabsPanelsProps<any>, {
+export declare const TabsPanels: import("@workday/canvas-kit-react/common").ElementComponentM<React.FC<{}>, TabsPanelsProps<any>, {
     state: {
         getId: (item: any) => string;
         orientation: import("../../collection/lib/useBaseListModel").Orientation;
-        panels: import("../../collection").Item<any>[];
+        panels: import("@workday/canvas-kit-react/collection").Item<any>[];
         panelIndexRef: React.MutableRefObject<number>;
         hiddenIds: string[];
         itemWidthCache: Record<string, number>;
         containerWidth: number;
         overflowTargetWidth: number;
-        selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+        selectedIds: string[] | "all";
         unselectedIds: string[];
         cursorId: string;
         columnCount: number;
+        pageSizeRef: React.MutableRefObject<number>;
+        cursorIndexRef: {
+            readonly current: number;
+        };
         UNSTABLE_virtual: {
             virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
             totalSize: number;
@@ -32,7 +36,7 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
         indexRef: React.MutableRefObject<number>;
         nonInteractiveIds: string[];
         isVirtualized: boolean;
-        items: import("../../collection").Item<any>[];
+        items: import("@workday/canvas-kit-react/collection").Item<any>[];
     };
     events: {
         registerPanel: (data: {
@@ -66,10 +70,6 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
         }): void;
         selectAll(): void;
         unselectAll(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
         goTo(data: {
             id: string;
         }): void;
@@ -83,6 +83,10 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;
@@ -98,11 +102,15 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
             returnFocusRef: React.RefObject<any> | undefined;
             placement: import("@popperjs/core").Placement;
             id: string;
-            visibility: import("../..").Visibility;
-            selectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
+            visibility: "hidden" | "visible";
+            selectedIds: string[] | "all";
             unselectedIds: string[];
             cursorId: string;
             columnCount: number;
+            pageSizeRef: React.MutableRefObject<number>;
+            cursorIndexRef: {
+                readonly current: number;
+            };
             UNSTABLE_virtual: {
                 virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
                 totalSize: number;
@@ -112,11 +120,11 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
             };
             UNSTABLE_defaultItemHeight: number;
             containerRef: React.RefObject<HTMLDivElement>;
-            orientation: import("../../collection/lib/useBaseListModel").Orientation;
+            orientation: "horizontal" | "vertical";
             indexRef: React.MutableRefObject<number>;
             nonInteractiveIds: string[];
             isVirtualized: boolean;
-            items: import("../../collection").Item<any>[];
+            items: import("@workday/canvas-kit-react/collection").Item<any>[];
             mode: "multiple" | "single";
         };
         events: {
@@ -130,10 +138,6 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
             }): void;
             selectAll(): void;
             unselectAll(): void;
-            registerItem(data: {
-                item: any;
-                textValue: string;
-            }): void;
             goTo(data: {
                 id: string;
             }): void;
@@ -147,6 +151,10 @@ export declare const TabsPanels: import("../../common").ElementComponentM<React.
             goToLastOfRow(): void;
             goToNextPage(): void;
             goToPreviousPage(): void;
+            registerItem(data: {
+                item: any;
+                textValue: string;
+            }): void;
             unregisterItem(data: {
                 id: string;
             }): void;

package/dist/commonjs/tabs/lib/TabsPanels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsPanels.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanels.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,eAAe,CAAC,CAAC,GAAG,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5D;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAKrB,CAAC"}
+{"version":3,"file":"TabsPanels.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsPanels.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,eAAe,CAAC,CAAC,GAAG,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5D;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAKrB,CAAC"}

package/dist/commonjs/tabs/lib/TabsPanels.js

@@ -20,14 +20,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabsPanels = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var collection_1 = require("@workday/canvas-kit-react/collection");
-var useTabsModel_1 = require("./useTabsModel");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const collection_1 = require("@workday/canvas-kit-react/collection");
+const useTabsModel_1 = require("./useTabsModel");
 exports.TabsPanels = common_1.createSubcomponent()({
     displayName: 'Tabs.Panels',
     modelHook: useTabsModel_1.useTabsModel,
-})(function (_a, _, model) {
-    var children = _a.children;
+})(({ children }, _, model) => {
     return React.createElement(React.Fragment, null, collection_1.useListRenderItems(model, children));
 });