@navikt/ds-react 8.9.1 → 8.10.1

package/esm/data/drag-and-drop/root/DragAndDropRoot.js

@@ -1,4 +1,5 @@
-import React, { forwardRef, useEffect } from "react";
+/** biome-ignore-all lint/correctness/useHookAtTopLevel: False positive because of the way forwardRef() is added */
+import React, { forwardRef, useCallback, useEffect, useRef, useState, } from "react";
 import { Floating } from "../../../utils/components/floating/Floating.js";
 import DragAndDropItem from "../item/DragAndDropItem.js";
 import { DragAndDropProvider } from "./DragAndDrop.context.js";
@@ -11,25 +12,39 @@ import { DragAndDropProvider } from "./DragAndDrop.context.js";
  * [x] Keyboard navigation
  * [ ] UU - announce on drag start, item moved, drag end
  * [x] Make overlay same width as the OG item, currently jumps to content width
- * [ ] Look into adding a cancel listener event
- * [ ] Make onClick work on drag handler button, currently blocked by pointer down/up listeners
- * [ ] Talk to design about what should happen on ESC key press, currently just cancels dragging, should it also reset position?
- * [ ] Make arrow icons into buttons that react to keyboard events, currently just decorative
+ * [x] Look into adding a cancel listener event
+ * [x] Make onClick work on drag handler button, currently blocked by pointer down/up listeners
+ * [x] Talk to design about what should happen on ESC key press, currently just cancels dragging, should it also reset position?
+ * [x] Make arrow icons into buttons that react to keyboard events, currently just decorative
+ * [x] Keep handler focus after clicking arrows for dragging
+ * [x] Look into data-based API vs component-based API
+ * [ ] Should we have hidden instructions for screen readers on how to use the drag and drop, and should we announce the position of the item while dragging?
+ * [x] Discuss if this component should be generic for drag and drop, or if it should be specifically for tables - just for table for now
+ * [x] Discuss items type
+ * [ ] Discuss how to implement label best
+ * [ ] Quick nav (< > samtidig) - få piltastene til å fungere
+ * [x] Implement new type for items - ColumnDefinitions<T>
+ * [ ] Remove announcer div and use a live region component instead
+ * [ ] Make ESC reset position, not just cancel dragging
+ * [ ] Make instructions for keyboard users (visible?)
+ * [ ] Ask design about visible keyboard instructions
+ *
  */
-const DragAndDrop = forwardRef(({ setItems, children }, forwardedRef) => {
-    const DRAG_THRESHOLD = 4; // Minimum movement in pixels to start dragging
-    const [activeItem, setActiveItem] = React.useState(null);
-    const [dropTarget, setDropTarget] = React.useState(null);
-    const [dragHandlerActive, setDragHandlerActive] = React.useState(null);
-    const [overlayWidth, setOverlayWidth] = React.useState(null);
-    const activeItemRef = React.useRef(null);
-    const dropTargetRef = React.useRef(null);
-    const activeChild = children.find((child) => child.props.id === (activeItem === null || activeItem === void 0 ? void 0 : activeItem.id));
-    const [virtualRef, setVirtualRef] = React.useState({
+const DRAG_THRESHOLD = 4; // Minimum movement in pixels to start dragging
+function DragAndDropInner({ items, setItems, renderItem }, forwardedRef) {
+    const [activeItem, setActiveItem] = useState(null);
+    const [dropTarget, setDropTarget] = useState(null);
+    const [dragHandlerActive, setDragHandlerActive] = useState(null);
+    const [overlayWidth, setOverlayWidth] = useState(null);
+    const [announcement, setAnnouncement] = useState("");
+    const activeData = items.find((item) => item.id === (activeItem === null || activeItem === void 0 ? void 0 : activeItem.id));
+    const activeItemRef = useRef(null);
+    const dropTargetRef = useRef(null);
+    const [virtualRef, setVirtualRef] = useState({
         getBoundingClientRect: () => DOMRect.fromRect({ width: 0, height: 0, x: 0, y: 0 }),
     });
-    const pendingDragStartRef = React.useRef(null);
-    const startPendingDragStart = (event, item, element) => {
+    const pendingDragStartRef = useRef(null);
+    const startPendingDrag = (event, item, element) => {
         pendingDragStartRef.current = {
             item,
             element: element || null,
@@ -38,21 +53,26 @@ const DragAndDrop = forwardRef(({ setItems, children }, forwardedRef) => {
             startY: event.clientY,
         };
     };
-    const cancelDragStart = () => {
-        pendingDragStartRef.current = null;
-    };
-    const setCombinedActiveItem = React.useCallback((item) => {
+    const setCombinedActiveItem = useCallback((item) => {
         activeItemRef.current = item;
         setActiveItem(item);
     }, []);
-    const setCombinedDropTarget = React.useCallback((item) => {
+    const setCombinedDropTarget = useCallback((item) => {
         dropTargetRef.current = item;
         setDropTarget(item);
     }, []);
+    const reorderItems = useCallback((fromIndex, toIndex) => {
+        setItems((currentItems) => {
+            const newItems = [...currentItems];
+            const [movedItem] = newItems.splice(fromIndex, 1);
+            newItems.splice(toIndex, 0, movedItem);
+            return newItems;
+        });
+    }, [setItems]);
     useEffect(() => {
         /* This useEffect is used to toggle a class on the html element when dragging,
-        to prevent cursor issues when dragging over interactive elements,
-        and to prevent text selection during dragging. */
+          to prevent cursor issues when dragging over interactive elements,
+          and to prevent text selection during dragging. */
         if (activeItem) {
             document.documentElement.setAttribute("data-dragging-cursor", "true");
             document.body.style.userSelect = "none";
@@ -124,12 +144,8 @@ const DragAndDrop = forwardRef(({ setItems, children }, forwardedRef) => {
             const active = activeItemRef.current;
             const target = dropTargetRef.current;
             if (active && target && active.id !== target.id) {
-                setItems((items) => {
-                    const newItems = [...items];
-                    const [movedItem] = newItems.splice(active.index, 1);
-                    newItems.splice(target.index, 0, movedItem);
-                    return newItems;
-                });
+                reorderItems(active.index, target.index);
+                setAnnouncement(`Element flyttet til posisjon ${(target === null || target === void 0 ? void 0 : target.index) + 1} av ${items.length}`); // TODO - Bedre formulering?
             }
             setOverlayWidth(null);
             setDragHandlerActive(null);
@@ -137,43 +153,54 @@ const DragAndDrop = forwardRef(({ setItems, children }, forwardedRef) => {
             setCombinedDropTarget(null);
             pendingDragStartRef.current = null;
         };
-        // TODO - Look into adding a cancel listener event
+        const handlePointerCancel = () => {
+            setOverlayWidth(null);
+            setDragHandlerActive(null);
+            setCombinedActiveItem(null);
+            setCombinedDropTarget(null);
+            pendingDragStartRef.current = null;
+        };
         window.addEventListener("pointermove", handlePointerMove);
         window.addEventListener("pointerup", handlePointerUp);
+        window.addEventListener("pointercancel", handlePointerCancel);
         return () => {
             window.removeEventListener("pointermove", handlePointerMove);
             window.removeEventListener("pointerup", handlePointerUp);
+            window.removeEventListener("pointercancel", handlePointerCancel);
         };
-    }, [setCombinedDropTarget, setCombinedActiveItem, setItems]);
+    }, [
+        setCombinedDropTarget,
+        setCombinedActiveItem,
+        reorderItems,
+        items.length,
+    ]);
     const onKeyboardDragEnd = (diff) => {
         if (!dragHandlerActive)
             return;
         const targetIndex = dragHandlerActive.index + diff;
-        if (targetIndex < 0 || targetIndex >= children.length) {
+        if (targetIndex < 0 || targetIndex >= items.length) {
             return;
         }
-        setItems((items) => {
-            const newItems = [...items];
-            const [movedItem] = newItems.splice(dragHandlerActive.index, 1);
-            newItems.splice(targetIndex, 0, movedItem);
-            return newItems;
-        });
+        reorderItems(dragHandlerActive.index, targetIndex);
         setDragHandlerActive(Object.assign(Object.assign({}, dragHandlerActive), { index: targetIndex }));
+        setAnnouncement(`Element flyttet til posisjon ${targetIndex + 1} av ${items.length}`); // TODO - Bedre formulering?
     };
-    return (React.createElement(DragAndDropProvider, { activeItem: activeItem, setActiveItem: setCombinedActiveItem, dropTarget: dropTarget, setDropTarget: setCombinedDropTarget, dragHandlerActive: dragHandlerActive, setDragHandlerActive: setDragHandlerActive, onKeyboardDragEnd: onKeyboardDragEnd, startPendingDragStart: startPendingDragStart, cancelDragStart: cancelDragStart },
-        React.createElement("div", { ref: forwardedRef }, children),
-        activeItem && activeChild && (React.createElement(Floating, null,
+    return (React.createElement(DragAndDropProvider, { activeItem: activeItem, setActiveItem: setCombinedActiveItem, dropTarget: dropTarget, setDropTarget: setCombinedDropTarget, dragHandlerActive: dragHandlerActive, setDragHandlerActive: setDragHandlerActive, onKeyboardDragEnd: onKeyboardDragEnd, startPendingDrag: startPendingDrag, itemAmount: items.length },
+        React.createElement("ul", { ref: forwardedRef, "aria-label": "Dra og slipp elementer" }, items.map((item, index) => {
+            return (React.createElement(DragAndDropItem, { key: item.id, id: item.id, index: index, itemLabel: item.label }, renderItem(item, index)));
+        })),
+        activeItem && activeData && (React.createElement(Floating, null,
             React.createElement(Floating.Anchor, { virtualRef: virtualRef },
                 React.createElement("span", null)),
             React.createElement(Floating.Content, { align: "start", updatePositionStrategy: "always", style: {
                     pointerEvents: "none",
                     boxSizing: "border-box",
                     width: overlayWidth ? `${overlayWidth}px` : "fit-content",
-                } }, React.cloneElement(activeChild, {
-                isOverlay: true,
-            }))))));
-});
-DragAndDrop.Item = DragAndDropItem;
+                } },
+                React.createElement(DragAndDropItem, { id: activeItem.id, index: activeItem.index, isOverlay: true, itemLabel: activeData.label }, renderItem(activeData, activeItem.index))))),
+        React.createElement("div", { "aria-live": "assertive", className: "sr-only", "aria-atomic": "true" }, announcement)));
+}
+const DragAndDrop = forwardRef(DragAndDropInner);
 export { DragAndDrop, DragAndDropItem };
 export default DragAndDrop;
 //# sourceMappingURL=DragAndDropRoot.js.map

package/esm/data/drag-and-drop/root/DragAndDropRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"DragAndDropRoot.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DragAndDropRoot.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DragAndDropRoot.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DragAndDropRoot.tsx"],"names":[],"mappings":"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"}

package/esm/data/drag-and-drop/types.d.ts

@@ -2,3 +2,7 @@ export interface DragAndDropElement {
     id: string;
     index: number;
 }
+export interface DragAndDropItemData {
+    id: string;
+    label: string;
+}

package/esm/data/table/base-cell/DataTableBaseCell.d.ts

@@ -0,0 +1,46 @@
+import React from "react";
+interface DataTableBaseCellProps extends React.HTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Content alignment inside cell
+     * @default "left"
+     */
+    textAlign?: "left" | "center" | "right";
+    /**
+     * TODO: Shouldnt be needed to declare these here... But getting type-errors if not
+     */
+    colSpan?: number;
+    rowSpan?: number;
+    /**
+     * Temp hack to solve overflow and alignment
+     */
+    UNSAFE_isSelection?: boolean;
+    /**
+     * When true, clicking this cell will not trigger `onRowClick` on the row.
+     * Useful for cells that contain their own interactive content or actions
+     * that should be independent of row-level click handling.
+     */
+    preventRowClick?: boolean;
+    /**
+     * Sets a max-width on the content wrapper div inside the cell.
+     * This is only needed when using `layout="auto"` together with
+     * `truncateContent` on `<DataTable>` and you want the cell to be truncated.
+     */
+    contentMaxWidth?: number | `${number}${string}`;
+    /**
+     * Makes the cell sticky.
+     */
+    isSticky?: "start" | "end" | false;
+}
+/**
+ * TODO:
+ * - Need a "type" or something that centers content instead of relying on isSelection prop.
+ * - Need a separate prop do disabled resizing instead of relying on isSelection prop.
+ */
+declare const DataTableBaseCell: React.ForwardRefExoticComponent<DataTableBaseCellProps & {
+    /**
+     * Cell type
+     */
+    as: "th" | "td";
+} & React.RefAttributes<HTMLTableCellElement>>;
+export { DataTableBaseCell };
+export type { DataTableBaseCellProps };

package/esm/data/table/base-cell/DataTableBaseCell.js

@@ -0,0 +1,27 @@
+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;
+};
+import React, { forwardRef } from "react";
+import { cl } from "../../../utils/helpers/index.js";
+import { useDataTableContext } from "../root/DataTableRoot.context.js";
+/**
+ * TODO:
+ * - Need a "type" or something that centers content instead of relying on isSelection prop.
+ * - Need a separate prop do disabled resizing instead of relying on isSelection prop.
+ */
+const DataTableBaseCell = forwardRef((_a, forwardedRef) => {
+    var { className, children, as: Component, textAlign = "left", colSpan, UNSAFE_isSelection, preventRowClick, contentMaxWidth, rowSpan, isSticky } = _a, rest = __rest(_a, ["className", "children", "as", "textAlign", "colSpan", "UNSAFE_isSelection", "preventRowClick", "contentMaxWidth", "rowSpan", "isSticky"]);
+    const { withKeyboardNav } = useDataTableContext();
+    return (React.createElement(Component, Object.assign({}, rest, { ref: forwardedRef, className: cl("aksel-data-table__cell", className), tabIndex: withKeyboardNav ? -1 : undefined, "data-align": textAlign, "data-selectable": UNSAFE_isSelection, "data-prevent-row-click": preventRowClick || UNSAFE_isSelection || undefined, "data-sticky": isSticky || undefined, colSpan: colSpan, rowSpan: rowSpan }),
+        React.createElement("div", { style: { maxWidth: contentMaxWidth } }, children)));
+});
+export { DataTableBaseCell };
+//# sourceMappingURL=DataTableBaseCell.js.map

package/esm/data/table/base-cell/DataTableBaseCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableBaseCell.js","sourceRoot":"","sources":["../../../../src/data/table/base-cell/DataTableBaseCell.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AAmCpE;;;;GAIG;AACH,MAAM,iBAAiB,GAAG,UAAU,CASlC,CACE,EAYC,EACD,YAAY,EACZ,EAAE;QAdF,EACE,SAAS,EACT,QAAQ,EACR,EAAE,EAAE,SAAS,EACb,SAAS,GAAG,MAAM,EAClB,OAAO,EACP,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,OAAO,EACP,QAAQ,OAET,EADI,IAAI,cAXT,0IAYC,CADQ;IAIT,MAAM,EAAE,eAAe,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAElD,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,EAClD,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,gBAC9B,SAAS,qBACJ,kBAAkB,4BAEjC,eAAe,IAAI,kBAAkB,IAAI,SAAS,iBAEvC,QAAQ,IAAI,SAAS,EAClC,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO;QAEhB,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE,IAAG,QAAQ,CAAO,CACjD,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,CAAC"}

package/esm/data/table/column-header/DataTableColumnHeader.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import { type DataTableBaseCellProps } from "../base-cell/DataTableBaseCell.js";
+import type { SortDirection } from "../root/DataTable.types.js";
+import { type ResizeProps } from "./useTableColumnResize.js";
+interface DataTableColumnHeaderProps extends ResizeProps, DataTableBaseCellProps {
+    resizeHandler?: (event: React.MouseEvent<HTMLButtonElement> | React.TouchEvent<HTMLButtonElement>) => void;
+    /**
+     * Makes the column header sortable. The entire header cell content becomes
+     * a clickable button when true.
+     */
+    sortable?: boolean;
+    /**
+     * Current sort direction. Only relevant when `sortable` is true.
+     * Uses values matching the `aria-sort` attribute directly.
+     * @default "none"
+     */
+    sortDirection?: SortDirection;
+    /**
+     * Called when the user clicks the sortable header.
+     * The consumer is responsible for determining and setting the next sort state.
+     */
+    onSortClick?: (event: React.MouseEvent<HTMLElement>) => void;
+}
+/**
+ * TODO:
+ * - Plan for pinning: Move it into "settings" dialog like here: https://cloudscape.design/examples/react/table.html
+ * Toggling `data-block-keyboard-nav` does not work since the created "grid" does not update when toggling this attribute.
+ */
+declare const DataTableColumnHeader: React.ForwardRefExoticComponent<Omit<DataTableColumnHeaderProps, "ref"> & React.RefAttributes<HTMLTableCellElement>>;
+export { DataTableColumnHeader };
+export type { DataTableColumnHeaderProps };

package/esm/data/table/column-header/DataTableColumnHeader.js

@@ -0,0 +1,71 @@
+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;
+};
+import React, { forwardRef, useState } from "react";
+import { ArrowsUpDownIcon, CaretLeftCircleFillIcon, CaretRightCircleFillIcon, SortDownIcon, SortUpIcon, } from "@navikt/aksel-icons";
+import { cl } from "../../../utils/helpers/index.js";
+import { useMergeRefs } from "../../../utils/hooks/index.js";
+import { DataTableBaseCell, } from "../base-cell/DataTableBaseCell.js";
+import { useTableColumnResize } from "./useTableColumnResize.js";
+const SORT_ICON = {
+    asc: SortUpIcon,
+    desc: SortDownIcon,
+    none: ArrowsUpDownIcon,
+};
+/**
+ * TODO:
+ * - Plan for pinning: Move it into "settings" dialog like here: https://cloudscape.design/examples/react/table.html
+ * Toggling `data-block-keyboard-nav` does not work since the created "grid" does not update when toggling this attribute.
+ */
+const DataTableColumnHeader = forwardRef((_a, forwardedRef) => {
+    var { className, children, sortable = false, sortDirection = "none", onSortClick, style, width, minWidth, maxWidth, onWidthChange, defaultWidth, colSpan, rowSpan, UNSAFE_isSelection } = _a, rest = __rest(_a, ["className", "children", "sortable", "sortDirection", "onSortClick", "style", "width", "minWidth", "maxWidth", "onWidthChange", "defaultWidth", "colSpan", "rowSpan", "UNSAFE_isSelection"]);
+    const [isOverflowing, setIsOverflowing] = React.useState(false);
+    const contentRef = React.useRef(null);
+    const [thRefState, setThRefState] = useState(null);
+    const mergedRef = useMergeRefs(forwardedRef, setThRefState);
+    const resizeResult = useTableColumnResize({
+        ref: thRefState,
+        width,
+        defaultWidth,
+        minWidth,
+        maxWidth,
+        onWidthChange,
+        style,
+        colSpan,
+    });
+    const SortIcon = sortable ? SORT_ICON[sortDirection] : null;
+    return (React.createElement(DataTableBaseCell, Object.assign({ as: "th" }, rest, { ref: mergedRef, className: cl("aksel-data-table__column-header", className), "data-sortable": sortable, style: resizeResult.style, "aria-sort": sortable ? getAriaSort(sortDirection) : undefined, onPointerEnter: () => {
+            const el = contentRef.current;
+            setIsOverflowing(el ? el.scrollWidth > el.offsetWidth : false);
+            console.info("is overflowing", isOverflowing);
+        }, onPointerLeave: () => setIsOverflowing(false), UNSAFE_isSelection: UNSAFE_isSelection, colSpan: colSpan, rowSpan: rowSpan }),
+        sortable ? (React.createElement("button", { className: "aksel-data-table__th-sort-button", onClick: onSortClick },
+            React.createElement("div", { ref: contentRef, className: "aksel-data-table__th-content" }, children),
+            SortIcon && (React.createElement(SortIcon, { "aria-hidden": true, "data-sort-direction": sortDirection, className: "aksel-data-table__th-sort-icon", fontSize: "1.25rem" })))) : (React.createElement("div", { ref: contentRef, className: cl({
+                "aksel-data-table__th-content": !UNSAFE_isSelection,
+            }) }, children)),
+        resizeResult.enabled && !UNSAFE_isSelection && (React.createElement("button", Object.assign({}, resizeResult.resizeHandlerProps, { className: "aksel-data-table__th-resize-handle", "data-active": resizeResult.isResizingWithKeyboard, "data-disable-keyboard-nav": resizeResult.isResizingWithKeyboard, "data-block-keyboard-nav": true }), resizeResult.isResizingWithKeyboard && (React.createElement(React.Fragment, null,
+            React.createElement("span", { className: "aksel-data-table__th-resize-handle-indicator aksel-data-table__th-resize-handle-indicator--start" },
+                React.createElement(CaretLeftCircleFillIcon, { "aria-hidden": true, fontSize: "1.5rem" })),
+            React.createElement("span", { className: "aksel-data-table__th-resize-handle-indicator aksel-data-table__th-resize-handle-indicator--end" },
+                React.createElement(CaretRightCircleFillIcon, { "aria-hidden": true, fontSize: "1.5rem" }))))))));
+});
+function getAriaSort(sortDirection) {
+    if (sortDirection === "asc")
+        return "ascending";
+    if (sortDirection === "desc")
+        return "descending";
+    if (sortDirection === "none")
+        return "none";
+    return undefined;
+}
+export { DataTableColumnHeader };
+//# sourceMappingURL=DataTableColumnHeader.js.map

package/esm/data/table/column-header/DataTableColumnHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableColumnHeader.js","sourceRoot":"","sources":["../../../../src/data/table/column-header/DataTableColumnHeader.tsx"],"names":[],"mappings":"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"}

package/esm/data/table/column-header/useTableColumnResize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableColumnResize.js","sourceRoot":"","sources":["../../../../src/data/table/column-header/useTableColumnResize.ts"],"names":[],"mappings":"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"}

package/esm/data/table/empty-state/DataTableEmptyState.d.ts

@@ -1,5 +1,9 @@
 import React from "react";
-type DataTableEmptyStateProps = React.HTMLAttributes<HTMLDivElement>;
-declare const DataTableEmptyState: React.ForwardRefExoticComponent<DataTableEmptyStateProps & React.RefAttributes<HTMLDivElement>>;
+type DataTableEmptyStateProps = React.HTMLAttributes<HTMLDivElement> & {
+    colSpan?: number;
+};
+declare const DataTableEmptyState: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    colSpan?: number;
+} & React.RefAttributes<HTMLDivElement>>;
 export { DataTableEmptyState };
 export type { DataTableEmptyStateProps };

package/esm/data/table/empty-state/DataTableEmptyState.js

@@ -12,9 +12,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React, { forwardRef } from "react";
 import { cl } from "../../../utils/helpers/index.js";
 const DataTableEmptyState = forwardRef((_a, forwardedRef) => {
-    var { className, children } = _a, rest = __rest(_a, ["className", "children"]);
+    var { className, children, colSpan = 999 } = _a, rest = __rest(_a, ["className", "children", "colSpan"]);
     return (React.createElement("tr", null,
-        React.createElement("td", { colSpan: 999 },
+        React.createElement("td", { colSpan: colSpan },
             React.createElement("div", Object.assign({}, rest, { ref: forwardedRef, className: cl("aksel-data-table__empty-state", className) }), children))));
 });
 export { DataTableEmptyState };

package/esm/data/table/empty-state/DataTableEmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableEmptyState.js","sourceRoot":"","sources":["../../../../src/data/table/empty-state/DataTableEmptyState.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAI5C,MAAM,mBAAmB,GAAG,UAAU,CAGpC,CAAC,EAAgC,EAAE,YAAY,EAAE,EAAE;QAAlD,EAAE,SAAS,EAAE,QAAQ,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAC/B,OAAO,CACL;QACE,4BAAI,OAAO,EAAE,GAAG;YACd,6CACM,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,KAExD,QAAQ,CACL,CACH,CACF,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
+{"version":3,"file":"DataTableEmptyState.js","sourceRoot":"","sources":["../../../../src/data/table/empty-state/DataTableEmptyState.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAM5C,MAAM,mBAAmB,GAAG,UAAU,CAGpC,CAAC,EAA+C,EAAE,YAAY,EAAE,EAAE;QAAjE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,GAAG,GAAG,OAAW,EAAN,IAAI,cAA7C,oCAA+C,CAAF;IAC9C,OAAO,CACL;QACE,4BAAI,OAAO,EAAE,OAAO;YAClB,6CACM,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,KAExD,QAAQ,CACL,CACH,CACF,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/esm/data/table/helpers/selection/getMultipleSelectProps.d.ts

@@ -1,14 +1,14 @@
 import type { CheckboxInputProps } from "../../../../form/checkbox/checkbox-input/CheckboxInput.js";
-import type { SelectionT } from "./selection.types.js";
 type GetMultipleSelectPropsArgs = {
-    selectedKeys: SelectionT;
-    setSelectedKeys: (keys: SelectionT) => void;
-    disabledKeys: (string | number)[];
-    allKeys: (string | number)[];
-    totalCount: number;
+    selectedKeysSet: Set<string | number>;
+    selectedKeys: (string | number)[];
+    setSelectedKeys: (keys: (string | number)[]) => void;
+    disabledKeysSet: Set<string | number>;
+    allRowKeys: (string | number)[];
 };
-declare function getMultipleSelectProps({ selectedKeys, setSelectedKeys, disabledKeys, allKeys, totalCount, }: GetMultipleSelectPropsArgs): {
+declare function getMultipleSelectProps({ selectedKeysSet, selectedKeys, setSelectedKeys, disabledKeysSet, allRowKeys, }: GetMultipleSelectPropsArgs): {
     getTheadCheckboxProps: () => CheckboxInputProps;
     getRowCheckboxProps: (key: string | number) => CheckboxInputProps;
+    toggleSelection: (key: string | number) => void;
 };
 export { getMultipleSelectProps };

package/esm/data/table/helpers/selection/getMultipleSelectProps.js

@@ -1,45 +1,46 @@
-function getMultipleSelectProps({ selectedKeys, setSelectedKeys, disabledKeys, allKeys, totalCount, }) {
+function getMultipleSelectProps({ selectedKeysSet, selectedKeys, setSelectedKeys, disabledKeysSet, allRowKeys, }) {
+    const allRowKeysSet = new Set(allRowKeys);
+    const selectableKeys = allRowKeys.filter((k) => !disabledKeysSet.has(k));
+    const selectedSelectableCount = selectableKeys.filter((k) => selectedKeysSet.has(k)).length;
+    const allSelectableSelected = selectableKeys.length > 0 &&
+        selectedSelectableCount === selectableKeys.length;
+    const indeterminate = selectedSelectableCount > 0 &&
+        selectedSelectableCount < selectableKeys.length;
+    const selectedKeysNotInView = selectedKeys.filter((k) => !allRowKeysSet.has(k));
+    const disabledSelected = selectedKeys.filter((k) => disabledKeysSet.has(k));
+    const preservedKeys = [...selectedKeysNotInView, ...disabledSelected];
     const handleToggleAll = () => {
-        const allSelected = selectedKeys === "all" ||
-            (Array.isArray(selectedKeys) && selectedKeys.length === totalCount);
-        setSelectedKeys(allSelected ? [] : allKeys);
+        if (allSelectableSelected) {
+            setSelectedKeys(preservedKeys);
+        }
+        else {
+            setSelectedKeys([...new Set([...preservedKeys, ...selectableKeys])]);
+        }
     };
     const handleToggleRow = (key) => {
-        if (selectedKeys === "all") {
-            setSelectedKeys(allKeys.filter((id) => id !== key));
+        if (disabledKeysSet.has(key)) {
+            return;
         }
-        else if (selectedKeys.includes(key)) {
+        if (selectedKeysSet.has(key)) {
             setSelectedKeys(selectedKeys.filter((k) => k !== key));
         }
         else {
             setSelectedKeys([...selectedKeys, key]);
         }
     };
-    const isChecked = (key) => selectedKeys === "all" ||
-        (Array.isArray(selectedKeys) && selectedKeys.includes(key));
     return {
-        getTheadCheckboxProps: () => {
-            const indeterminate = Array.isArray(selectedKeys) &&
-                selectedKeys.length > 0 &&
-                selectedKeys.length < totalCount;
-            return {
-                /* TODO: Add support for label visuallyhidden */
-                /* children: "Select all rows", */
-                onChange: handleToggleAll,
-                checked: (selectedKeys === "all" ||
-                    (Array.isArray(selectedKeys) && selectedKeys.length > 0)) &&
-                    !indeterminate,
-                indeterminate,
-                disabled: disabledKeys.length === totalCount,
-            };
-        },
+        getTheadCheckboxProps: () => ({
+            onChange: handleToggleAll,
+            checked: allSelectableSelected,
+            indeterminate,
+            disabled: selectableKeys.length === 0,
+        }),
         getRowCheckboxProps: (key) => ({
-            /* TODO: Add support for label visuallyhidden */
-            /* children: `Select row with id ${key}`, */
             onChange: () => handleToggleRow(key),
-            checked: isChecked(key),
-            disabled: disabledKeys.includes(key),
+            checked: selectedKeysSet.has(key),
+            disabled: disabledKeysSet.has(key),
         }),
+        toggleSelection: handleToggleRow,
     };
 }
 export { getMultipleSelectProps };

package/esm/data/table/helpers/selection/getMultipleSelectProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"getMultipleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getMultipleSelectProps.ts"],"names":[],"mappings":"AAWA,SAAS,sBAAsB,CAAC,EAC9B,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,OAAO,EACP,UAAU,GACiB;IAC3B,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,MAAM,WAAW,GACf,YAAY,KAAK,KAAK;YACtB,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,YAAY,CAAC,MAAM,KAAK,UAAU,CAAC,CAAC;QAEtE,eAAe,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,GAAoB,EAAE,EAAE;QAC/C,IAAI,YAAY,KAAK,KAAK,EAAE,CAAC;YAC3B,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;QACtD,CAAC;aAAM,IAAI,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YACtC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QACzD,CAAC;aAAM,CAAC;YACN,eAAe,CAAC,CAAC,GAAG,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,GAAoB,EAAE,EAAE,CACzC,YAAY,KAAK,KAAK;QACtB,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAE9D,OAAO;QACL,qBAAqB,EAAE,GAAuB,EAAE;YAC9C,MAAM,aAAa,GACjB,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC;gBAC3B,YAAY,CAAC,MAAM,GAAG,CAAC;gBACvB,YAAY,CAAC,MAAM,GAAG,UAAU,CAAC;YAEnC,OAAO;gBACL,gDAAgD;gBAChD,kCAAkC;gBAClC,QAAQ,EAAE,eAAe;gBACzB,OAAO,EACL,CAAC,YAAY,KAAK,KAAK;oBACrB,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBAC3D,CAAC,aAAa;gBAChB,aAAa;gBACb,QAAQ,EAAE,YAAY,CAAC,MAAM,KAAK,UAAU;aAC7C,CAAC;QACJ,CAAC;QACD,mBAAmB,EAAE,CAAC,GAAoB,EAAsB,EAAE,CAAC,CAAC;YAClE,gDAAgD;YAChD,4CAA4C;YAC5C,QAAQ,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC;YACpC,OAAO,EAAE,SAAS,CAAC,GAAG,CAAC;YACvB,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC;SACrC,CAAC;KACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,sBAAsB,EAAE,CAAC"}
+{"version":3,"file":"getMultipleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getMultipleSelectProps.ts"],"names":[],"mappings":"AAUA,SAAS,sBAAsB,CAAC,EAC9B,eAAe,EACf,YAAY,EACZ,eAAe,EACf,eAAe,EACf,UAAU,GACiB;IAC3B,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,UAAU,CAAC,CAAC;IAC1C,MAAM,cAAc,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAEzE,MAAM,uBAAuB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAC1D,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,CACvB,CAAC,MAAM,CAAC;IAET,MAAM,qBAAqB,GACzB,cAAc,CAAC,MAAM,GAAG,CAAC;QACzB,uBAAuB,KAAK,cAAc,CAAC,MAAM,CAAC;IAEpD,MAAM,aAAa,GACjB,uBAAuB,GAAG,CAAC;QAC3B,uBAAuB,GAAG,cAAc,CAAC,MAAM,CAAC;IAElD,MAAM,qBAAqB,GAAG,YAAY,CAAC,MAAM,CAC/C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CAC7B,CAAC;IACF,MAAM,gBAAgB,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAC5E,MAAM,aAAa,GAAG,CAAC,GAAG,qBAAqB,EAAE,GAAG,gBAAgB,CAAC,CAAC;IAEtE,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,qBAAqB,EAAE,CAAC;YAC1B,eAAe,CAAC,aAAa,CAAC,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,eAAe,CAAC,CAAC,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,aAAa,EAAE,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;QACvE,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,GAAoB,EAAE,EAAE;QAC/C,IAAI,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC7B,OAAO;QACT,CAAC;QACD,IAAI,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC7B,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QACzD,CAAC;aAAM,CAAC;YACN,eAAe,CAAC,CAAC,GAAG,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC,CAAC;IAEF,OAAO;QACL,qBAAqB,EAAE,GAAuB,EAAE,CAAC,CAAC;YAChD,QAAQ,EAAE,eAAe;YACzB,OAAO,EAAE,qBAAqB;YAC9B,aAAa;YACb,QAAQ,EAAE,cAAc,CAAC,MAAM,KAAK,CAAC;SACtC,CAAC;QACF,mBAAmB,EAAE,CAAC,GAAoB,EAAsB,EAAE,CAAC,CAAC;YAClE,QAAQ,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC;YACpC,OAAO,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;YACjC,QAAQ,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;SACnC,CAAC;QACF,eAAe,EAAE,eAAe;KACjC,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,sBAAsB,EAAE,CAAC"}

package/esm/data/table/helpers/selection/getSingleSelectProps.d.ts

@@ -1,10 +1,12 @@
 import type { RadioInputProps } from "../../../../form/radio/radio-input/RadioInput.js";
 type GetSingleSelectPropsArgs = {
-    selectedKeys: (string | number)[];
+    selectedKeysSet: Set<string | number>;
     setSelectedKeys: (keys: (string | number)[]) => void;
-    disabledKeys: (string | number)[];
+    disabledKeysSet: Set<string | number>;
+    name: string;
 };
-declare function getSingleSelectProps({ selectedKeys, setSelectedKeys, disabledKeys, }: GetSingleSelectPropsArgs): {
+declare function getSingleSelectProps({ selectedKeysSet, setSelectedKeys, disabledKeysSet, name, }: GetSingleSelectPropsArgs): {
     getRowRadioProps: (key: string | number) => RadioInputProps;
+    toggleSelection: (key: string | number) => void;
 };
 export { getSingleSelectProps };