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

package/dist/commonjs/segmented-control/lib/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAS3B,CAAC"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIzB;;;;;;;OAOG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;OAOG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}

package/dist/commonjs/segmented-control/lib/SegmentedControl.js

@@ -4,19 +4,54 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SegmentedControl = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
-var SegmentedControlList_1 = require("./SegmentedControlList");
-var SegmentedControlItem_1 = require("./SegmentedControlItem");
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
+const SegmentedControlList_1 = require("./SegmentedControlList");
+const SegmentedControlItem_1 = require("./SegmentedControlItem");
+/**
+ * `SegmentedControl` is a container component that is responsible for creating a
+ * {@link SegmentedControlModel} and sharing it with its subcomponents using React context. It does
+ * not represent a real element.
+ *
+ * ```tsx
+ * <SegmentedControl items={[]}>{Child components}</SegmentedControl>
+ * ```
+ *
+ * Alternatively, you may pass in a model using the [hoisted model
+ * pattern](/getting-started/for-developers/resources/compound-components/#configuring-a-model).
+ *
+ * ```tsx
+ * const model = useSegmentedControlModel({
+ *   items: [],
+ * });
+ *
+ * <SegmentedControl model={model}>{Child components}</SegmentedControl>;
+ * ```
+ */
 exports.SegmentedControl = common_1.createContainer()({
     displayName: 'SegmentedControl',
     modelHook: useSegmentedControlModel_1.useSegmentedControlModel,
     subComponents: {
+        /**
+         * `SegmentedControl.List` renders {@link Grid} under the hood. It is a container for
+         * {@link SegmentedControlItem SegmentedControl.Item} subcomponents.
+         *
+         * ```tsx
+         * <SegmentedControl.List>{SegmentedControl.Items}</SegmentedControl.List>
+         * ```
+         */
         List: SegmentedControlList_1.SegmentedControlList,
+        /**
+         * `SegmentedControl.Item` is a `button` element built on `BaseButton`. `SegmentedControl.Item`
+         * has a `data-id` prop to handle `onSelect` properly.
+         *
+         * ```tsx
+         * <SegmentedControl.Item data-id="table">Table</SegmentedControl.Item>
+         * ```
+         */
         Item: SegmentedControlItem_1.SegmentedControlItem,
     },
-})(function (_a) {
-    var children = _a.children;
+})(({ children }) => {
     return react_1.default.createElement(react_1.default.Fragment, null, children);
 });

package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts

@@ -43,10 +43,14 @@ export declare const SegmentedControlItem: import("@workday/canvas-kit-react/com
     state: {
         disabled: boolean;
         size: "small" | "medium" | "large";
-        selectedIds: import("@workday/canvas-kit-react/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("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
             totalSize: number; /**
@@ -72,10 +76,6 @@ export declare const SegmentedControlItem: import("@workday/canvas-kit-react/com
         }): void;
         selectAll(): void;
         unselectAll(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
         goTo(data: {
             id: string;
         }): void;
@@ -89,6 +89,10 @@ export declare const SegmentedControlItem: import("@workday/canvas-kit-react/com
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;

package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAU,YAAY,EAAC,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAEL,oBAAoB,EAIrB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAK9D,MAAM,WAAW,SAAU,SAAQ,oBAAoB;IACrD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;CAC/C;AA0FD,eAAO,MAAM,oBAAoB;;;;;;;;;;+BA7G/B;;;eAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyIH,CAAC"}
+{"version":3,"file":"SegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAU,YAAY,EAAC,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAEL,oBAAoB,EAIrB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAK9D,MAAM,WAAW,SAAU,SAAQ,oBAAoB;IACrD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;CAC/C;AA0FD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;+BA7G/B;;;eAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyIH,CAAC"}

package/dist/commonjs/segmented-control/lib/SegmentedControlItem.js

@@ -1,15 +1,4 @@
 "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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -29,28 +18,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SegmentedControlItem = void 0;
-var React = __importStar(require("react"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var tooltip_1 = require("@workday/canvas-kit-react/tooltip");
-var button_1 = require("@workday/canvas-kit-react/button");
-var useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
-var text_1 = require("@workday/canvas-kit-react/text");
-var useSegmentedControlItem_1 = require("./hooks/useSegmentedControlItem");
-var getButtonSize = function (size) {
+const React = __importStar(require("react"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const tooltip_1 = require("@workday/canvas-kit-react/tooltip");
+const button_1 = require("@workday/canvas-kit-react/button");
+const useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
+const text_1 = require("@workday/canvas-kit-react/text");
+const useSegmentedControlItem_1 = require("./hooks/useSegmentedControlItem");
+const getButtonSize = (size) => {
     switch (size) {
         case 'large':
             return 'medium';
@@ -62,7 +40,7 @@ var getButtonSize = function (size) {
             return 'medium';
     }
 };
-var getIconButtonColors = function (toggled) {
+const getIconButtonColors = (toggled) => {
     return {
         default: {
             background: toggled ? tokens_1.colors.frenchVanilla100 : tokens_1.colors.soap200,
@@ -87,44 +65,41 @@ var getIconButtonColors = function (toggled) {
         },
     };
 };
-var getPaddingStyles = function (children, size, icon) {
+const getPaddingStyles = (children, size, icon) => {
     if (!children) {
         return 0;
     }
     switch (size) {
         case 'large':
-            return icon ? "0 " + tokens_1.space.m + " 0 20px" : "0 " + tokens_1.space.m;
+            return icon ? `0 ${tokens_1.space.m} 0 20px` : `0 ${tokens_1.space.m}`;
         case 'medium':
-            return icon ? "0 20px 0 " + tokens_1.space.s : "0 " + tokens_1.space.s;
+            return icon ? `0 20px 0 ${tokens_1.space.s}` : `0 ${tokens_1.space.s}`;
         case 'small':
-            return icon ? "0 " + tokens_1.space.xs + " 0 " + tokens_1.space.xxs : "0 " + tokens_1.space.xs;
+            return icon ? `0 ${tokens_1.space.xs} 0 ${tokens_1.space.xxs}` : `0 ${tokens_1.space.xs}`;
         default:
-            return icon ? "0 20px 0 " + tokens_1.space.s : "0 " + tokens_1.space.s;
+            return icon ? `0 20px 0 ${tokens_1.space.s}` : `0 ${tokens_1.space.s}`;
     }
 };
-var geButtonStyles = function (size, children, icon) {
-    var buttonSize = getButtonSize(size);
-    var minWidthValue = button_1.getMinWidthStyles(children, children ? size : buttonSize);
+const geButtonStyles = (size, children, icon) => {
+    const buttonSize = getButtonSize(size);
+    const minWidthValue = button_1.getMinWidthStyles(children, children ? size : buttonSize);
     return {
         height: button_1.getMinWidthStyles(false, buttonSize),
         minWidth: minWidthValue,
         padding: getPaddingStyles(children, size, icon),
     };
 };
-var Container = function (_a) {
-    var tooltipProps = _a.tooltipProps, children = _a.children;
-    return tooltipProps ? (React.createElement(tooltip_1.Tooltip, __assign({}, tooltipProps), children)) : (React.createElement(React.Fragment, null, children));
+const Container = ({ tooltipProps, children, }) => {
+    return tooltipProps ? (React.createElement(tooltip_1.Tooltip, Object.assign({}, tooltipProps), children)) : (React.createElement(React.Fragment, null, children));
 };
 exports.SegmentedControlItem = common_1.createSubcomponent('button')({
     displayName: 'SegmentedControl.Item',
     modelHook: useSegmentedControlModel_1.useSegmentedControlModel,
     elemPropsHook: useSegmentedControlItem_1.useSegmentedControlItem,
-})(function (_a, Element, _b) {
-    var size = _b.state.size;
-    var children = _a.children, icon = _a.icon, tooltipProps = _a.tooltipProps, elemProps = __rest(_a, ["children", "icon", "tooltipProps"]);
-    var _c = tokens_1.type.levels.subtext[size === 'small' ? 'medium' : 'large'], color = _c.color, textStyles = __rest(_c, ["color"]);
+})(({ children, icon, tooltipProps, ...elemProps }, Element, { state: { size } }) => {
+    const { color, ...textStyles } = tokens_1.type.levels.subtext[size === 'small' ? 'medium' : 'large'];
     return (React.createElement(Container, { tooltipProps: tooltipProps },
-        React.createElement(button_1.BaseButton, __assign({ as: Element, borderRadius: "m", colors: getIconButtonColors(elemProps['aria-pressed']) }, geButtonStyles(size, children, icon), elemProps),
+        React.createElement(button_1.BaseButton, Object.assign({ as: Element, borderRadius: "m", colors: getIconButtonColors(elemProps['aria-pressed']) }, geButtonStyles(size, children, icon), elemProps),
             icon && (React.createElement(button_1.BaseButton.Icon, { size: size === 'small' ? 'extraSmall' : 'medium', icon: icon, shouldMirrorIcon: common_1.useIsRTL() })),
-            children && (React.createElement(text_1.Text, __assign({}, textStyles, { fontWeight: "bold", textAlign: "left" }), children)))));
+            children && (React.createElement(text_1.Text, Object.assign({}, textStyles, { fontWeight: "bold", textAlign: "left" }), children)))));
 });

package/dist/commonjs/segmented-control/lib/SegmentedControlList.d.ts

@@ -5,14 +5,18 @@ export interface SegmentedControlListProps<T = any> extends Omit<Partial<Extract
     'aria-label': string;
     children: ((item: T) => React.ReactNode) | React.ReactNode;
 }
-export declare const SegmentedControlList: import("@workday/canvas-kit-react/common").ElementComponentM<"div", SegmentedControlListProps<any>, {
+export declare const useSegmentedControlList: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         disabled: boolean;
         size: "small" | "medium" | "large";
-        selectedIds: import("@workday/canvas-kit-react/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("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
             totalSize: number;
@@ -35,10 +39,71 @@ export declare const SegmentedControlList: import("@workday/canvas-kit-react/com
         }): void;
         selectAll(): void;
         unselectAll(): void;
+        goTo(data: {
+            id: string;
+        }): void;
+        goToNext(): void;
+        goToPrevious(): void;
+        goToPreviousRow(): void;
+        goToNextRow(): void;
+        goToFirst(): void;
+        goToLast(): void;
+        goToFirstOfRow(): void;
+        goToLastOfRow(): void;
+        goToNextPage(): void;
+        goToPreviousPage(): void;
         registerItem(data: {
             item: any;
             textValue: string;
         }): void;
+        unregisterItem(data: {
+            id: string;
+        }): void;
+        updateItemHeight(data: {
+            value: number;
+        }): void;
+    };
+    selection: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectionManager;
+    navigation: import("@workday/canvas-kit-react/collection/lib/useCursorListModel").NavigationManager;
+    getId: (item: any) => string;
+}, {
+    [x: string]: string | number | undefined;
+    opacity: number | undefined;
+}>;
+export declare const SegmentedControlList: import("@workday/canvas-kit-react/common").ElementComponentM<"div", SegmentedControlListProps<any>, {
+    state: {
+        disabled: boolean;
+        size: "small" | "medium" | "large";
+        selectedIds: string[] | "all";
+        unselectedIds: string[];
+        cursorId: string;
+        columnCount: number;
+        pageSizeRef: React.MutableRefObject<number>;
+        cursorIndexRef: {
+            readonly current: number;
+        };
+        UNSTABLE_virtual: {
+            virtualItems: import("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
+            totalSize: number;
+            scrollToOffset: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
+            scrollToIndex: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
+            measure: () => void;
+        };
+        UNSTABLE_defaultItemHeight: number;
+        containerRef: React.RefObject<HTMLDivElement>;
+        id: string;
+        orientation: "horizontal" | "vertical";
+        indexRef: React.MutableRefObject<number>;
+        nonInteractiveIds: string[];
+        isVirtualized: boolean;
+        items: import("@workday/canvas-kit-react/collection").Item<any>[];
+    };
+    events: {
+        select(data: {
+            id: string;
+        }): void;
+        selectAll(): void;
+        unselectAll(): void;
         goTo(data: {
             id: string;
         }): void;
@@ -52,6 +117,10 @@ export declare const SegmentedControlList: import("@workday/canvas-kit-react/com
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;

package/dist/commonjs/segmented-control/lib/SegmentedControlList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlList.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAItD,MAAM,WAAW,yBAAyB,CAAC,CAAC,GAAG,GAAG,CAChD,SAAQ,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,CAAC,EAAE,UAAU,CAAC;IACnE,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5D;AAYD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqB/B,CAAC"}
+{"version":3,"file":"SegmentedControlList.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAItD,MAAM,WAAW,yBAAyB,CAAC,CAAC,GAAG,GAAG,CAChD,SAAQ,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,CAAC,EAAE,UAAU,CAAC;IACnE,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5D;AAED,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAQnC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqB/B,CAAC"}

package/dist/commonjs/segmented-control/lib/SegmentedControlList.js

@@ -1,15 +1,4 @@
 "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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -29,38 +18,24 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SegmentedControlList = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var collection_1 = require("@workday/canvas-kit-react/collection");
-var useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
-var useSegmentedControlList = common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)(function (_a) {
-    var _b;
-    var _c = _a.state, orientation = _c.orientation, disabled = _c.disabled, items = _c.items;
-    var directionName = orientation === 'vertical' ? 'Row' : 'Column';
-    return _b = {},
-        _b["gridTemplate" + directionName + "s"] = "repeat(" + items.length + ", 1fr)",
-        _b.opacity = disabled ? 0.4 : undefined,
-        _b;
+exports.SegmentedControlList = exports.useSegmentedControlList = void 0;
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const collection_1 = require("@workday/canvas-kit-react/collection");
+const useSegmentedControlModel_1 = require("./hooks/useSegmentedControlModel");
+exports.useSegmentedControlList = common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)(({ state: { orientation, disabled, items } }) => {
+    const directionName = orientation === 'vertical' ? 'Row' : 'Column';
+    return {
+        [`gridTemplate${directionName}s`]: `repeat(${items.length}, 1fr)`,
+        opacity: disabled ? 0.4 : undefined,
+    };
 });
 exports.SegmentedControlList = common_1.createSubcomponent('div')({
     displayName: 'SegmentedControl.List',
     modelHook: useSegmentedControlModel_1.useSegmentedControlModel,
-    elemPropsHook: useSegmentedControlList,
-})(function (_a, Element, model) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return (React.createElement(layout_1.Grid, __assign({ as: Element, display: "inline-grid", role: "group", backgroundColor: "soap200", border: "1px solid transparent", borderColor: "licorice200", borderRadius: "l", padding: "3px", gridGap: "xxs" }, elemProps), collection_1.useListRenderItems(model, children)));
+    elemPropsHook: exports.useSegmentedControlList,
+})(({ children, ...elemProps }, Element, model) => {
+    return (React.createElement(layout_1.Grid, Object.assign({ as: Element, display: "inline-grid", role: "group", backgroundColor: "soap200", border: "1px solid transparent", borderColor: "licorice200", borderRadius: "l", padding: "3px", gridGap: "xxs" }, elemProps), collection_1.useListRenderItems(model, children)));
 });

package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts

@@ -1,10 +1,14 @@
 import * as React from 'react';
-export declare const useSegmentedControlItem: <P extends {}, R>(model: {
+export declare const useSegmentedControlItem: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
-        selectedIds: import("@workday/canvas-kit-react/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("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
             totalSize: number;
@@ -27,10 +31,6 @@ export declare const useSegmentedControlItem: <P extends {}, R>(model: {
         }): void;
         selectAll(): void;
         unselectAll(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
         goTo(data: {
             id: string;
         }): void;
@@ -44,6 +44,10 @@ export declare const useSegmentedControlItem: <P extends {}, R>(model: {
         goToLastOfRow(): void;
         goToNextPage(): void;
         goToPreviousPage(): void;
+        registerItem(data: {
+            item: any;
+            textValue: string;
+        }): void;
         unregisterItem(data: {
             id: string;
         }): void;
@@ -54,7 +58,22 @@ export declare const useSegmentedControlItem: <P extends {}, R>(model: {
     selection: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectionManager;
     navigation: import("@workday/canvas-kit-react/collection/lib/useCursorListModel").NavigationManager;
     getId: (item: any) => string;
-}, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {} & P & (R extends HTMLOrSVGElement ? {
-    ref: React.Ref<R>;
-} : {});
+}, {
+    onClick: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+} & {
+    id: string;
+    'aria-pressed': boolean;
+} & {
+    ref: (instance: HTMLElement | null) => void;
+    'data-id': string;
+    disabled: boolean | undefined;
+    item: null;
+    virtual: null;
+    'aria-setsize': number | undefined;
+    'aria-posinset': number | undefined;
+    style: React.CSSProperties;
+    id: string;
+} & {
+    disabled: boolean | undefined;
+}>;
 //# sourceMappingURL=useSegmentedControlItem.d.ts.map

package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../../segmented-control/lib/hooks/useSegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0BnC,CAAC"}
+{"version":3,"file":"useSegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../../segmented-control/lib/hooks/useSegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsBnC,CAAC"}

package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.js

@@ -1,19 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useSegmentedControlItem = void 0;
-var common_1 = require("@workday/canvas-kit-react/common");
-var collection_1 = require("@workday/canvas-kit-react/collection");
-var useSegmentedControlModel_1 = require("./useSegmentedControlModel");
-exports.useSegmentedControlItem = common_1.composeHooks(collection_1.useListItemSelect, common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)(function (model, _, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
-    var name = elemProps['data-id'] || '';
-    var selected = !!name && collection_1.isSelected(name, model.state);
+const common_1 = require("@workday/canvas-kit-react/common");
+const collection_1 = require("@workday/canvas-kit-react/collection");
+const useSegmentedControlModel_1 = require("./useSegmentedControlModel");
+exports.useSegmentedControlItem = common_1.composeHooks(collection_1.useListItemSelect, common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)((model, _, elemProps = {}) => {
+    const name = elemProps['data-id'] || '';
+    const selected = !!name && collection_1.isSelected(name, model.state);
     return {
-        id: model.state.id + "-" + name,
+        id: `${model.state.id}-${name}`,
         'aria-pressed': selected,
     };
-}), collection_1.useListItemRegister, common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)(function (_a) {
-    var state = _a.state;
+}), collection_1.useListItemRegister, common_1.createElemPropsHook(useSegmentedControlModel_1.useSegmentedControlModel)(({ state }) => {
     return {
         // override the default disabled functionality of `useListItemRegister`
         // it shouldn't allow to set disabled state only for one button