@navikt/ds-react 8.9.0 → 8.10.0

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,32 @@
+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
+ * - Keyboard-nav breaks in headers now because of the resize-handles.
+ * 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,72 @@
+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
+ * - Keyboard-nav breaks in headers now because of the resize-handles.
+ * 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-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 { CheckboxProps } from "../../../../form/checkbox/types.js";
-import type { SelectionT } from "./selection.types.js";
+import type { CheckboxInputProps } from "../../../../form/checkbox/checkbox-input/CheckboxInput.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): {
-    getTheadCheckboxProps: () => CheckboxProps;
-    getRowCheckboxProps: (key: string | number) => CheckboxProps;
+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 {
-                children: "Select all rows",
-                onChange: handleToggleAll,
-                checked: (selectedKeys === "all" ||
-                    (Array.isArray(selectedKeys) && selectedKeys.length > 0)) &&
-                    !indeterminate,
-                indeterminate,
-                disabled: disabledKeys.length === totalCount,
-                hideLabel: true,
-            };
-        },
+        getTheadCheckboxProps: () => ({
+            onChange: handleToggleAll,
+            checked: allSelectableSelected,
+            indeterminate,
+            disabled: selectableKeys.length === 0,
+        }),
         getRowCheckboxProps: (key) => ({
-            children: `Select row with id ${key}`,
             onChange: () => handleToggleRow(key),
-            checked: isChecked(key),
-            disabled: disabledKeys.includes(key),
-            hideLabel: true,
+            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,GAAkB,EAAE;YACzC,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,QAAQ,EAAE,iBAAiB;gBAC3B,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;gBAC5C,SAAS,EAAE,IAAI;aAChB,CAAC;QACJ,CAAC;QACD,mBAAmB,EAAE,CAAC,GAAoB,EAAiB,EAAE,CAAC,CAAC;YAC7D,QAAQ,EAAE,sBAAsB,GAAG,EAAE;YACrC,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;YACpC,SAAS,EAAE,IAAI;SAChB,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 { RadioProps } from "../../../../form/radio/types.js";
+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): {
-    getRowRadioProps: (key: string | number) => RadioProps;
+declare function getSingleSelectProps({ selectedKeysSet, setSelectedKeys, disabledKeysSet, name, }: GetSingleSelectPropsArgs): {
+    getRowRadioProps: (key: string | number) => RadioInputProps;
+    toggleSelection: (key: string | number) => void;
 };
 export { getSingleSelectProps };

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

@@ -1,20 +1,19 @@
-function getSingleSelectProps({ selectedKeys, setSelectedKeys, disabledKeys, }) {
+function getSingleSelectProps({ selectedKeysSet, setSelectedKeys, disabledKeysSet, name, }) {
     const handleSelectionChange = (key) => {
-        if (selectedKeys.includes(key)) {
-            setSelectedKeys([]);
-        }
-        else {
-            setSelectedKeys([key]);
+        if (disabledKeysSet.has(key)) {
+            return;
         }
+        setSelectedKeys([key]);
     };
     return {
         getRowRadioProps: (key) => ({
-            children: `Select row with id ${key}`,
-            checked: selectedKeys.includes(key),
+            checked: selectedKeysSet.has(key),
             onChange: () => handleSelectionChange(key),
-            disabled: disabledKeys.includes(key),
+            disabled: disabledKeysSet.has(key),
             value: key,
+            name,
         }),
+        toggleSelection: handleSelectionChange,
     };
 }
 export { getSingleSelectProps };

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

@@ -1 +1 @@
-{"version":3,"file":"getSingleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getSingleSelectProps.ts"],"names":[],"mappings":"AAQA,SAAS,oBAAoB,CAAC,EAC5B,YAAY,EACZ,eAAe,EACf,YAAY,GACa;IACzB,MAAM,qBAAqB,GAAG,CAAC,GAAoB,EAAE,EAAE;QACrD,IAAI,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/B,eAAe,CAAC,EAAE,CAAC,CAAC;QACtB,CAAC;aAAM,CAAC;YACN,eAAe,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QACzB,CAAC;IACH,CAAC,CAAC;IAEF,OAAO;QACL,gBAAgB,EAAE,CAAC,GAAoB,EAAc,EAAE,CAAC,CAAC;YACvD,QAAQ,EAAE,sBAAsB,GAAG,EAAE;YACrC,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC;YACnC,QAAQ,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,GAAG,CAAC;YAC1C,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC;YACpC,KAAK,EAAE,GAAG;SACX,CAAC;KACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAC"}
+{"version":3,"file":"getSingleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getSingleSelectProps.ts"],"names":[],"mappings":"AASA,SAAS,oBAAoB,CAAC,EAC5B,eAAe,EACf,eAAe,EACf,eAAe,EACf,IAAI,GACqB;IACzB,MAAM,qBAAqB,GAAG,CAAC,GAAoB,EAAE,EAAE;QACrD,IAAI,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC7B,OAAO;QACT,CAAC;QACD,eAAe,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO;QACL,gBAAgB,EAAE,CAAC,GAAoB,EAAmB,EAAE,CAAC,CAAC;YAC5D,OAAO,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;YACjC,QAAQ,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,GAAG,CAAC;YAC1C,QAAQ,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;YAClC,KAAK,EAAE,GAAG;YACV,IAAI;SACL,CAAC;QACF,eAAe,EAAE,qBAAqB;KACvC,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAC"}

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

@@ -1,6 +1,6 @@
-import type { CheckboxProps } from "../../../../form/checkbox/types.js";
-import type { RadioProps } from "../../../../form/radio/types.js";
-type SelectionT = (string | number)[] | "all";
+import type { CheckboxInputProps } from "../../../../form/checkbox/checkbox-input/CheckboxInput.js";
+import type { RadioInputProps } from "../../../../form/radio/radio-input/RadioInput.js";
+type SelectedKeysT = (string | number)[];
 type SelectionProps = {
     /**
      * Enables selection of rows.
@@ -12,31 +12,54 @@ type SelectionProps = {
      * @default "none"
      */
     selectionMode?: "none" | "single" | "multiple";
-    selectedKeys?: SelectionT;
-    defaultSelectedKeys?: SelectionT;
-    onSelectionChange?: (keys: SelectionT) => void;
-    disabledKeys?: (string | number)[];
+    /**
+     * Controlled selected keys. Should be used in conjunction with `onSelectionChange`.
+     */
+    selectedKeys?: SelectedKeysT;
+    /**
+     * Default selected keys when using uncontrolled selection. Should not be used together with `selectedKeys`.
+     */
+    defaultSelectedKeys?: SelectedKeysT;
+    /**
+     * Callback with array of selected keys.
+     */
+    onSelectionChange?: (keys: SelectedKeysT) => void;
+    /**
+     * Keys that should be disabled for selection. These keys will not be selectable and will be styled as disabled.
+     *
+     *
+     * TODO: Consider making this optionally a callback with (rowData:T) => boolean, to allow for more dynamic disabling of selection based on row data.
+     */
+    disabledSelectionKeys?: SelectedKeysT;
+    /**
+     * If true, stops clicking a row from toggling its selection state. This can be used if you want to only allow selection through the checkboxes/radios, and not have the entire row be clickable for selection.
+     *
+     * @default false
+     */
+    disableRowSelectionOnClick?: boolean;
 };
 type NoneSelection = {
     selectionMode: "none";
-    allKeys: (string | number)[];
-    selectedKeys: (string | number)[];
-    disabledKeys: (string | number)[];
+    selectedKeys: SelectedKeysT;
+    disabledSelectionKeys: SelectedKeysT;
 };
 type SingleSelection = {
     selectionMode: "single";
-    allKeys: (string | number)[];
-    selectedKeys: (string | number)[];
-    disabledKeys: (string | number)[];
-    getRowRadioProps: (key: string | number) => RadioProps;
+    selectedKeys: SelectedKeysT;
+    disabledSelectionKeys: SelectedKeysT;
+    getRowRadioProps: (key: string | number) => RadioInputProps;
+    toggleSelection: (key: string | number) => void;
 };
 type MultipleSelection = {
     selectionMode: "multiple";
-    allKeys: (string | number)[];
-    selectedKeys: SelectionT;
-    disabledKeys: (string | number)[];
-    getTheadCheckboxProps: () => CheckboxProps;
-    getRowCheckboxProps: (key: string | number) => CheckboxProps;
+    selectedKeys: SelectedKeysT;
+    disabledSelectionKeys: SelectedKeysT;
+    getTheadCheckboxProps: () => CheckboxInputProps;
+    getRowCheckboxProps: (key: string | number) => CheckboxInputProps;
+    toggleSelection: (key: string | number) => void;
+};
+type TableSelectionBase = {
+    isRowSelected: (rowId: string | number) => boolean;
 };
-type TableSelection = NoneSelection | SingleSelection | MultipleSelection;
-export type { MultipleSelection, NoneSelection, SelectionProps, SelectionT, SingleSelection, TableSelection, };
+type TableSelection = TableSelectionBase & (NoneSelection | SingleSelection | MultipleSelection);
+export type { MultipleSelection, NoneSelection, SelectionProps, SingleSelection, TableSelection, SelectedKeysT, };

package/esm/data/table/hooks/useColumnOptions.d.ts

@@ -0,0 +1,19 @@
+import type { ColumnDefinition, ColumnDefinitions } from "../root/DataTable.types.js";
+import type { SelectionProps } from "./useTableSelection.js";
+type UseColumnOptions = {
+    stickyColumns?: {
+        first?: "1";
+        last?: "1";
+    };
+    selectionMode: SelectionProps["selectionMode"];
+};
+type UseColumnOptionsResult<T> = {
+    columns: {
+        isSticky: "start" | "end" | false;
+        colDef: ColumnDefinition<T>;
+    }[];
+    stickySelection: boolean;
+};
+declare function useColumnOptions<T>(columnDefinitions: ColumnDefinitions<T>, options: UseColumnOptions): UseColumnOptionsResult<T>;
+export { useColumnOptions };
+export type { UseColumnOptionsResult };

package/esm/data/table/hooks/useColumnOptions.js

@@ -0,0 +1,17 @@
+function useColumnOptions(columnDefinitions, options) {
+    const { stickyColumns, selectionMode } = options;
+    const hasSelection = selectionMode !== "none";
+    return {
+        stickySelection: selectionMode !== "none" && (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) === "1",
+        columns: columnDefinitions.map((colDef, index) => {
+            const isFirstSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) === "1" && index === 0 && !hasSelection;
+            const isLastSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.last) === "1" && index === columnDefinitions.length - 1;
+            return {
+                isSticky: isFirstSticky ? "start" : isLastSticky ? "end" : false,
+                colDef,
+            };
+        }),
+    };
+}
+export { useColumnOptions };
+//# sourceMappingURL=useColumnOptions.js.map

package/esm/data/table/hooks/useColumnOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useColumnOptions.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useColumnOptions.ts"],"names":[],"mappings":"AAsBA,SAAS,gBAAgB,CACvB,iBAAuC,EACvC,OAAyB;IAEzB,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,OAAO,CAAC;IAEjD,MAAM,YAAY,GAAG,aAAa,KAAK,MAAM,CAAC;IAE9C,OAAO;QACL,eAAe,EAAE,aAAa,KAAK,MAAM,IAAI,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,MAAK,GAAG;QACzE,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC/C,MAAM,aAAa,GACjB,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,MAAK,GAAG,IAAI,KAAK,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC;YAC/D,MAAM,YAAY,GAChB,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,IAAI,MAAK,GAAG,IAAI,KAAK,KAAK,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;YAExE,OAAO;gBACL,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;gBAChE,MAAM;aACP,CAAC;QACJ,CAAC,CAAC;KACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/esm/data/table/hooks/useTableExpansion.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+type DataTableExpansionContextT = {
+    expandedIds: (string | number)[];
+    isExpanded: (id: string | number) => boolean;
+    toggleExpansion: (id: string | number) => void;
+    toggleAll: () => void;
+    isAllExpanded: boolean;
+    getDetailsPanelContent?: (row: unknown) => React.ReactNode;
+    getDetailsPanelHeight?: (row: unknown) => number | "auto";
+    showExpandAll?: boolean;
+    enableExpansion: boolean;
+};
+declare const useDataTableExpansion: <S extends boolean = true>(strict?: S | undefined) => S extends true ? DataTableExpansionContextT : DataTableExpansionContextT | undefined;
+type TableExpansionOptions<T> = {
+    detailsPanelRowIds?: (string | number)[];
+    defaultDetailsPanelRowIds?: (string | number)[];
+    onDetailsPanelChange?: (ids: (string | number)[]) => void;
+    allRowKeys: (string | number)[];
+    getDetailsPanelContent?: (row: T) => React.ReactNode;
+    getDetailsPanelHeight?: (row: T) => number | "auto";
+    showExpandAll?: boolean;
+};
+declare function DataTableExpansionProvider<T>({ children, detailsPanelRowIds, defaultDetailsPanelRowIds, onDetailsPanelChange, allRowKeys, getDetailsPanelContent, getDetailsPanelHeight, showExpandAll, }: TableExpansionOptions<T> & {
+    children: React.ReactNode;
+}): React.JSX.Element;
+export { DataTableExpansionProvider, useDataTableExpansion };

package/esm/data/table/hooks/useTableExpansion.js

@@ -0,0 +1,31 @@
+import React, { useCallback } from "react";
+import { createStrictContext } from "../../../utils/helpers/index.js";
+import { useControllableState } from "../../../utils/hooks/index.js";
+const { Provider: DataTableExpansionContextProvider, useContext: useDataTableExpansion, } = createStrictContext({
+    name: "DataTableExpansionContext",
+    errorMessage: "useDataTableExpansion must be used within a DataTableExpansionProvider.",
+});
+function DataTableExpansionProvider({ children, detailsPanelRowIds, defaultDetailsPanelRowIds = [], onDetailsPanelChange, allRowKeys, getDetailsPanelContent, getDetailsPanelHeight, showExpandAll = false, }) {
+    const [expandedIds, setExpandedIds] = useControllableState({
+        value: detailsPanelRowIds,
+        defaultValue: defaultDetailsPanelRowIds,
+    });
+    const isExpanded = useCallback((id) => expandedIds.includes(id), [expandedIds]);
+    const toggleExpansion = useCallback((id) => {
+        const next = expandedIds.includes(id)
+            ? expandedIds.filter((eid) => eid !== id)
+            : [...expandedIds, id];
+        setExpandedIds(next);
+        onDetailsPanelChange === null || onDetailsPanelChange === void 0 ? void 0 : onDetailsPanelChange(next);
+    }, [expandedIds, setExpandedIds, onDetailsPanelChange]);
+    const isAllExpanded = allRowKeys.length > 0 &&
+        allRowKeys.every((key) => expandedIds.includes(key));
+    const toggleAll = useCallback(() => {
+        const next = isAllExpanded ? [] : [...allRowKeys];
+        setExpandedIds(next);
+        onDetailsPanelChange === null || onDetailsPanelChange === void 0 ? void 0 : onDetailsPanelChange(next);
+    }, [isAllExpanded, allRowKeys, setExpandedIds, onDetailsPanelChange]);
+    return (React.createElement(DataTableExpansionContextProvider, { expandedIds: expandedIds, isExpanded: isExpanded, toggleExpansion: toggleExpansion, toggleAll: toggleAll, isAllExpanded: isAllExpanded, getDetailsPanelContent: getDetailsPanelContent, getDetailsPanelHeight: getDetailsPanelHeight, showExpandAll: showExpandAll, enableExpansion: !!getDetailsPanelContent }, children));
+}
+export { DataTableExpansionProvider, useDataTableExpansion };
+//# sourceMappingURL=useTableExpansion.js.map

package/esm/data/table/hooks/useTableExpansion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableExpansion.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableExpansion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAc5D,MAAM,EACJ,QAAQ,EAAE,iCAAiC,EAC3C,UAAU,EAAE,qBAAqB,GAClC,GAAG,mBAAmB,CAA6B;IAClD,IAAI,EAAE,2BAA2B;IACjC,YAAY,EACV,yEAAyE;CAC5E,CAAC,CAAC;AAYH,SAAS,0BAA0B,CAAI,EACrC,QAAQ,EACR,kBAAkB,EAClB,yBAAyB,GAAG,EAAE,EAC9B,oBAAoB,EACpB,UAAU,EACV,sBAAsB,EACtB,qBAAqB,EACrB,aAAa,GAAG,KAAK,GACoC;IACzD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,oBAAoB,CAAC;QACzD,KAAK,EAAE,kBAAkB;QACzB,YAAY,EAAE,yBAAyB;KACxC,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,EAAmB,EAAE,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE,CAAC,EACjD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAmB,EAAE,EAAE;QACtB,MAAM,IAAI,GAAG,WAAW,CAAC,QAAQ,CAAC,EAAE,CAAC;YACnC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC;YACzC,CAAC,CAAC,CAAC,GAAG,WAAW,EAAE,EAAE,CAAC,CAAC;QACzB,cAAc,CAAC,IAAI,CAAC,CAAC;QACrB,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,IAAI,CAAC,CAAC;IAC/B,CAAC,EACD,CAAC,WAAW,EAAE,cAAc,EAAE,oBAAoB,CAAC,CACpD,CAAC;IAEF,MAAM,aAAa,GACjB,UAAU,CAAC,MAAM,GAAG,CAAC;QACrB,UAAU,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAEvD,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,MAAM,IAAI,GAAG,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC;QAClD,cAAc,CAAC,IAAI,CAAC,CAAC;QACrB,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,IAAI,CAAC,CAAC;IAC/B,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEtE,OAAO,CACL,oBAAC,iCAAiC,IAChC,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,aAAa,EAC5B,sBAAsB,EACpB,sBAEa,EAEf,qBAAqB,EACnB,qBAAwE,EAE1E,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,CAAC,CAAC,sBAAsB,IAExC,QAAQ,CACyB,CACrC,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,0BAA0B,EAAE,qBAAqB,EAAE,CAAC"}