@navikt/ds-react 8.6.0 → 8.7.0

package/cjs/data/drag-and-drop/item/DataDragAndDropItem.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+interface DataDragAndDropItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    /**
+     * Unique id
+     */
+    id: string;
+    /**
+     * Index of the item being dragged
+     */
+    index: number;
+}
+/**
+ * TODO
+ *
+ * @see 🏷️ {@link DataDragAndDropItemProps}
+ * @example
+ * ```tsx
+ * <DragAndDrop.Item numOfSelectedRows={selectedRows.length} onClear={handleClear}>
+ *   TODO
+ * </DragAndDrop.Item>
+ * ```
+ */
+declare const DataDragAndDropItem: React.ForwardRefExoticComponent<DataDragAndDropItemProps & React.RefAttributes<HTMLDivElement>>;
+export default DataDragAndDropItem;
+export { DataDragAndDropItem };
+export type { DataDragAndDropItemProps };

package/cjs/data/drag-and-drop/item/DataDragAndDropItem.js

@@ -0,0 +1,91 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.DataDragAndDropItem = void 0;
+const sortable_1 = require("@dnd-kit/react/sortable");
+const react_1 = __importStar(require("react"));
+const aksel_icons_1 = require("@navikt/aksel-icons");
+const stack_1 = require("../../../primitives/stack");
+const helpers_1 = require("../../../utils/helpers");
+const hooks_1 = require("../../../utils/hooks");
+const DataDragAndDrop_context_1 = require("../root/DataDragAndDrop.context");
+/**
+ * TODO
+ *
+ * @see 🏷️ {@link DataDragAndDropItemProps}
+ * @example
+ * ```tsx
+ * <DragAndDrop.Item numOfSelectedRows={selectedRows.length} onClear={handleClear}>
+ *   TODO
+ * </DragAndDrop.Item>
+ * ```
+ */
+const DataDragAndDropItem = react_1.default.forwardRef((_a, forwardedRef) => {
+    var { children, id, index, className } = _a, rest = __rest(_a, ["children", "id", "index", "className"]);
+    const handleRef = (0, react_1.useRef)(null);
+    const { ref, isDragging, isDropTarget } = (0, sortable_1.useSortable)({
+        id,
+        index,
+        handle: handleRef,
+    });
+    const mergedRef = (0, hooks_1.useMergeRefs)(ref, forwardedRef);
+    const context = react_1.default.useContext(DataDragAndDrop_context_1.DataDragAndDropContext);
+    const mouseDragging = isDragging && (context === null || context === void 0 ? void 0 : context.inputMethod) === "mouse";
+    const mouseDropTarget = isDropTarget && (context === null || context === void 0 ? void 0 : context.inputMethod) === "mouse";
+    const keyboardDragging = isDragging && (context === null || context === void 0 ? void 0 : context.inputMethod) === "keyboard";
+    return (react_1.default.createElement(stack_1.HStack, { gap: "space-8", align: "center", wrap: false, asChild: true },
+        react_1.default.createElement("div", Object.assign({ ref: mergedRef }, rest, { className: (0, helpers_1.cl)("aksel-data-table__drag-and-drop-item", className), "data-dragging": isDragging, "data-mouse-dragging": mouseDragging, "data-keyboard-dragging": keyboardDragging, "data-drop-target": mouseDropTarget, tabIndex: -1 }),
+            react_1.default.createElement("div", { className: "aksel-data-table__drag-and-drop-item-drag-handler", ref: handleRef },
+                keyboardDragging && (react_1.default.createElement("span", { className: "aksel-data-table__drag-and-drop-item-keyboard-drag-icon", "data-direction": "up" },
+                    react_1.default.createElement(aksel_icons_1.CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+                react_1.default.createElement(aksel_icons_1.DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" }),
+                keyboardDragging && (react_1.default.createElement("span", { className: "aksel-data-table__drag-and-drop-item-keyboard-drag-icon", "data-direction": "down" },
+                    react_1.default.createElement(aksel_icons_1.CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))),
+            react_1.default.createElement("div", null, children))));
+});
+exports.DataDragAndDropItem = DataDragAndDropItem;
+exports.default = DataDragAndDropItem;
+//# sourceMappingURL=DataDragAndDropItem.js.map

package/cjs/data/drag-and-drop/item/DataDragAndDropItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDropItem.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/item/DataDragAndDropItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,sDAAsD;AACtD,+CAAsC;AACtC,qDAI6B;AAC7B,qDAAmD;AACnD,oDAA4C;AAC5C,gDAAoD;AACpD,6EAAyE;AAczE;;;;;;;;;;GAUG;AACH,MAAM,mBAAmB,GAAG,eAAK,CAAC,UAAU,CAG1C,CAAC,EAA2C,EAAE,YAAY,EAAE,EAAE;QAA7D,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,OAAW,EAAN,IAAI,cAAzC,wCAA2C,CAAF;IAC1C,MAAM,SAAS,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,IAAA,sBAAW,EAAC;QACpD,EAAE;QACF,KAAK;QACL,MAAM,EAAE,SAAS;KAClB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,IAAA,oBAAY,EAAC,GAAG,EAAE,YAAY,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,eAAK,CAAC,UAAU,CAAC,gDAAsB,CAAC,CAAC;IACzD,MAAM,aAAa,GAAG,UAAU,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,MAAK,OAAO,CAAC;IACrE,MAAM,eAAe,GAAG,YAAY,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,MAAK,OAAO,CAAC;IACzE,MAAM,gBAAgB,GAAG,UAAU,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,MAAK,UAAU,CAAC;IAE3E,OAAO,CACL,8BAAC,cAAM,IAAC,GAAG,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,EAAE,OAAO;QAEvD,qDACE,GAAG,EAAE,SAAS,IACV,IAAI,IACR,SAAS,EAAE,IAAA,YAAE,EAAC,sCAAsC,EAAE,SAAS,CAAC,mBACjD,UAAU,yBACJ,aAAa,4BACV,gBAAgB,sBACtB,eAAe,EACjC,QAAQ,EAAE,CAAC,CAAC;YAEZ,uCACE,SAAS,EAAC,mDAAmD,EAC7D,GAAG,EAAE,SAAS;gBAIb,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,yDAAyD,oBACpD,IAAI;oBAEnB,8BAAC,mCAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;gBACD,8BAAC,8BAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB;gBACD,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,yDAAyD,oBACpD,MAAM;oBAErB,8BAAC,qCAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG;YACN,2CAAM,QAAQ,CAAO,CACjB,CACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC;AAGM,kDAAmB;AAD5B,kBAAe,mBAAmB,CAAC"}

package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.d.ts

@@ -0,0 +1,5 @@
+interface DataDragAndDropContextType {
+    inputMethod: "mouse" | "keyboard" | null;
+}
+export declare const DataDragAndDropContext: import("react").Context<DataDragAndDropContextType | undefined>;
+export {};

package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataDragAndDropContext = void 0;
+const react_1 = require("react");
+exports.DataDragAndDropContext = (0, react_1.createContext)(undefined);
+//# sourceMappingURL=DataDragAndDrop.context.js.map

package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDrop.context.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDrop.context.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAMzB,QAAA,sBAAsB,GAAG,IAAA,qBAAa,EAEjD,SAAS,CAAC,CAAC"}

package/cjs/data/drag-and-drop/root/DataDragAndDropRoot.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import DataDragAndDropItem, { DataDragAndDropItemProps } from "../item/DataDragAndDropItem";
+interface DataDragAndDropProps extends React.HTMLAttributes<HTMLTableElement> {
+    children: any[];
+    setItems: React.Dispatch<React.SetStateAction<any[]>>;
+}
+interface DataDragAndDropRootComponent extends React.ForwardRefExoticComponent<DataDragAndDropProps & React.RefAttributes<HTMLTableElement>> {
+    /**
+     * @see 🏷️ {@link DataDragAndDropItemProps}
+     * * @example
+     * ```jsx
+     * <DragAndDrop>
+     *   <DragAndDrop.Item id="1" index={0}>
+     *     ...
+     *   </DragAndDrop.Item>
+     * </DragAndDrop>
+     * ```
+     */
+    Item: typeof DataDragAndDropItem;
+}
+declare const DataDragAndDrop: DataDragAndDropRootComponent;
+export { DataDragAndDrop, DataDragAndDropItem };
+export default DataDragAndDrop;
+export type { DataDragAndDropItemProps, DataDragAndDropProps };

package/cjs/data/drag-and-drop/root/DataDragAndDropRoot.js

@@ -0,0 +1,111 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataDragAndDropItem = exports.DataDragAndDrop = void 0;
+const react_1 = require("@dnd-kit/react");
+const sortable_1 = require("@dnd-kit/react/sortable");
+const react_2 = __importStar(require("react"));
+const stack_1 = require("../../../primitives/stack");
+const DataDragAndDropItem_1 = __importDefault(require("../item/DataDragAndDropItem"));
+exports.DataDragAndDropItem = DataDragAndDropItem_1.default;
+const DataDragAndDrop_context_1 = require("./DataDragAndDrop.context");
+const DataDragAndDrop = (0, react_2.forwardRef)((_a, forwardedRef) => {
+    var { setItems, children } = _a, rest = __rest(_a, ["setItems", "children"]);
+    const [inputMethod, setInputMethod] = react_2.default.useState(null);
+    const setItemOrder = (initalIndex, targetIndex) => {
+        setItems((items) => {
+            const newItems = [...items];
+            const [movedItem] = newItems.splice(initalIndex, 1);
+            newItems.splice(targetIndex, 0, movedItem);
+            return newItems;
+        });
+    };
+    return (react_2.default.createElement(DataDragAndDrop_context_1.DataDragAndDropContext.Provider, { value: { inputMethod } },
+        react_2.default.createElement(react_1.DragDropProvider
+        // TODO Look into overriding default keybinds, might eliminate context need
+        , { 
+            // TODO Look into overriding default keybinds, might eliminate context need
+            onBeforeDragStart: (event) => {
+                var _a;
+                return setInputMethod(((_a = event.operation.activatorEvent) === null || _a === void 0 ? void 0 : _a.type) === "pointerdown"
+                    ? "mouse"
+                    : "keyboard");
+            }, onDragOver: (event) => {
+                var _a;
+                if (((_a = event.operation.activatorEvent) === null || _a === void 0 ? void 0 : _a.type) === "pointerdown") {
+                    // Prevents items to rearrange while dragging with mouse, but allows keyboard dragging to work as intended
+                    event.preventDefault();
+                }
+            }, onDragEnd: (event) => {
+                var _a;
+                if (((_a = event.operation.activatorEvent) === null || _a === void 0 ? void 0 : _a.type) === "pointerdown") {
+                    const { source, target } = event.operation;
+                    if (!(0, sortable_1.isSortable)(source) || !(0, sortable_1.isSortable)(target))
+                        return;
+                    setItemOrder(source.initialIndex, target.index);
+                }
+            } },
+            react_2.default.createElement(stack_1.VStack, { asChild: true, gap: "space-12" },
+                react_2.default.createElement("div", Object.assign({}, rest, { ref: forwardedRef }), children)),
+            react_2.default.createElement(react_1.DragOverlay, null, (source) => {
+                // Overlay not needed and causes glitching when using keyboard
+                if (inputMethod === "keyboard")
+                    return null;
+                if (!(0, sortable_1.isSortable)(source))
+                    return null;
+                if ((0, react_2.isValidElement)(children[source.initialIndex])) {
+                    return children[source.initialIndex];
+                }
+                return null;
+            }))));
+});
+exports.DataDragAndDrop = DataDragAndDrop;
+DataDragAndDrop.Item = DataDragAndDropItem_1.default;
+exports.default = DataDragAndDrop;
+//# sourceMappingURL=DataDragAndDropRoot.js.map

package/cjs/data/drag-and-drop/root/DataDragAndDropRoot.js.map

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

package/cjs/data/table/helpers/table-keyboard.d.ts

@@ -30,6 +30,7 @@ declare function getNavigationAction(event: KeyboardEvent): NavigationAction | n
  * - Select arrow down/up for opening popup
  * - User is navigating inside multiline textarea
  * - contenteditable attrb is in use
+ * - element has attribute data-block-keyboard-nav="true"
  */
 declare function shouldBlockNavigation(event: KeyboardEvent): boolean;
 export { getNavigationAction, shouldBlockNavigation };

package/cjs/data/table/helpers/table-keyboard.js

@@ -41,6 +41,7 @@ function getNavigationAction(event) {
  * - Select arrow down/up for opening popup
  * - User is navigating inside multiline textarea
  * - contenteditable attrb is in use
+ * - element has attribute data-block-keyboard-nav="true"
  */
 function shouldBlockNavigation(event) {
     const key = event.key;
@@ -54,8 +55,8 @@ function shouldBlockNavigation(event) {
     if (el.isContentEditable) {
         return true;
     }
-    /* If not any of these elements, assueme "safe" to navigate */
-    const editable = el.closest('input, textarea, select, [contenteditable="true"]');
+    /* If not any of these elements, assume "safe" to navigate */
+    const editable = el.closest('input, textarea, select, [contenteditable="true"], [data-block-keyboard-nav="true"]');
     if (!editable) {
         return false;
     }
@@ -71,7 +72,8 @@ function shouldBlockNavigation(event) {
         }
         return false;
     }
-    return editable.hasAttribute("contenteditable");
+    return (editable.hasAttribute("contenteditable") ||
+        editable.hasAttribute("data-block-keyboard-nav"));
 }
 function shouldBlockInputArrow(input, key) {
     if (input.type === "checkbox" || input.type === "radio") {

package/cjs/data/table/helpers/table-keyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-keyboard.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-keyboard.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"table-keyboard.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-keyboard.ts"],"names":[],"mappings":";;AA8JS,kDAAmB;AAAE,sDAAqB;AA9JnD,MAAM,UAAU,GAAG;IACjB,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;IACxB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IACzB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,UAAU,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;CAClB,CAAC;AAWX;;;;GAIG;AACH,SAAS,mBAAmB,CAAC,KAAoB;IAC/C,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;IAEtB,0CAA0C;IAC1C,IAAI,GAAG,IAAI,UAAU,EAAE,CAAC;QACtB,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,GAAkB,CAAC,EAAE,CAAC;IAClE,CAAC;IAED,IAAI,GAAG,KAAK,MAAM,EAAE,CAAC;QACnB,OAAO,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO;YACnC,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE;YACxB,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;IACvB,CAAC;IAED,IAAI,GAAG,KAAK,KAAK,EAAE,CAAC;QAClB,OAAO,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO;YACnC,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE;YACtB,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;IACtB,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC;AAED;;;;;;;;;;;GAWG;AACH,SAAS,qBAAqB,CAAC,KAAoB;IACjD,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;IACtB,IAAI,CAAC,CAAC,GAAG,IAAI,UAAU,CAAC,EAAE,CAAC;QACzB,OAAO,KAAK,CAAC;IACf,CAAC;IAED,MAAM,EAAE,GAAG,KAAK,CAAC,MAA4B,CAAC;IAC9C,IAAI,CAAC,EAAE,EAAE,CAAC;QACR,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAI,EAAE,CAAC,iBAAiB,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,6DAA6D;IAC7D,MAAM,QAAQ,GAAG,EAAE,CAAC,OAAO,CACzB,qFAAqF,CACtF,CAAC;IAEF,IAAI,CAAC,QAAQ,EAAE,CAAC;QACd,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAI,QAAQ,YAAY,gBAAgB,EAAE,CAAC;QACzC,OAAO,qBAAqB,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IAC9C,CAAC;IAED,IAAI,QAAQ,YAAY,mBAAmB,EAAE,CAAC;QAC5C,OAAO,wBAAwB,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACjD,CAAC;IAED,IAAI,QAAQ,YAAY,iBAAiB,EAAE,CAAC;QAC1C,IAAI,GAAG,KAAK,WAAW,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAO,CACL,QAAQ,CAAC,YAAY,CAAC,iBAAiB,CAAC;QACxC,QAAQ,CAAC,YAAY,CAAC,yBAAyB,CAAC,CACjD,CAAC;AACJ,CAAC;AAED,SAAS,qBAAqB,CAAC,KAAuB,EAAE,GAAW;IACjE,IAAI,KAAK,CAAC,IAAI,KAAK,UAAU,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QACxD,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC;QACjC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC;IACnC,MAAM,GAAG,GAAG,KAAK,CAAC,YAAY,CAAC;IAC/B,IAAI,KAAK,KAAK,IAAI,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QACnC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,sBAAsB,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;AACrE,CAAC;AAED,SAAS,wBAAwB,CAC/B,QAA6B,EAC7B,GAAW;IAEX,MAAM,KAAK,GAAG,QAAQ,CAAC,cAAc,CAAC;IACtC,MAAM,GAAG,GAAG,QAAQ,CAAC,YAAY,CAAC;IAClC,OAAO,sBAAsB,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;AACxE,CAAC;AAED,SAAS,sBAAsB,CAC7B,GAAW,EACX,KAAa,EACb,GAAW,EACX,WAAmB;IAEnB,IAAI,GAAG,KAAK,WAAW,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;QAC7C,OAAO,KAAK,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,CAAC;IAC9B,CAAC;IACD,IAAI,GAAG,KAAK,YAAY,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;QAChD,OAAO,GAAG,GAAG,WAAW,CAAC;IAC3B,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,eAAe,CAAC,IAAY;IACnC,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,MAAM,CAAC;QACZ,KAAK,QAAQ,CAAC;QACd,KAAK,KAAK,CAAC;QACX,KAAK,KAAK,CAAC;QACX,KAAK,UAAU,CAAC;QAChB,KAAK,OAAO,CAAC;QACb,KAAK,QAAQ;YACX,OAAO,IAAI,CAAC;QACd;YACE,OAAO,KAAK,CAAC;IACjB,CAAC;AACH,CAAC"}

package/cjs/data/table/root/DataTableRoot.context.d.ts

@@ -0,0 +1,8 @@
+interface DataTableContextProps {
+    layout: "fixed" | "auto";
+}
+declare const DataTableContextProvider: import("react").FC<DataTableContextProps & {
+    children: React.ReactNode;
+    ref?: never;
+}>, useDataTableContext: <S extends boolean = true>(strict?: S | undefined) => S extends true ? DataTableContextProps : DataTableContextProps | undefined;
+export { DataTableContextProvider, useDataTableContext };

package/cjs/data/table/root/DataTableRoot.context.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDataTableContext = exports.DataTableContextProvider = void 0;
+const helpers_1 = require("../../../utils/helpers");
+const { Provider: DataTableContextProvider, useContext: useDataTableContext } = (0, helpers_1.createStrictContext)({
+    name: "DataTableContext",
+    errorMessage: "useDataTableContext must be used within DataTable",
+});
+exports.DataTableContextProvider = DataTableContextProvider;
+exports.useDataTableContext = useDataTableContext;
+//# sourceMappingURL=DataTableRoot.context.js.map

package/cjs/data/table/root/DataTableRoot.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableRoot.context.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableRoot.context.ts"],"names":[],"mappings":";;;AAAA,oDAA6D;AAM7D,MAAM,EAAE,QAAQ,EAAE,wBAAwB,EAAE,UAAU,EAAE,mBAAmB,EAAE,GAC3E,IAAA,6BAAmB,EAAwB;IACzC,IAAI,EAAE,kBAAkB;IACxB,YAAY,EAAE,mDAAmD;CAClE,CAAC,CAAC;AAEI,4DAAwB;AAAE,kDAAmB"}

package/cjs/data/table/root/DataTableRoot.js

@@ -62,6 +62,7 @@ const DataTableThead_1 = require("../thead/DataTableThead");
 Object.defineProperty(exports, "DataTableThead", { enumerable: true, get: function () { return DataTableThead_1.DataTableThead; } });
 const DataTableTr_1 = require("../tr/DataTableTr");
 Object.defineProperty(exports, "DataTableTr", { enumerable: true, get: function () { return DataTableTr_1.DataTableTr; } });
+const DataTableRoot_context_1 = require("./DataTableRoot.context");
 const useTableKeyboardNav_1 = require("./useTableKeyboardNav");
 /**
  * TODO Component description etc.
@@ -77,9 +78,10 @@ const DataTable = (0, react_1.forwardRef)((_a, forwardedRef) => {
         enabled: withKeyboardNav,
         shouldBlockNavigation,
     });
-    return (react_1.default.createElement("div", { className: "aksel-data-table__border-wrapper" },
-        react_1.default.createElement("div", { className: "aksel-data-table__scroll-wrapper" },
-            react_1.default.createElement("table", Object.assign({}, rest, { ref: mergedRef, className: (0, helpers_1.cl)("aksel-data-table", className), "data-zebra-stripes": zebraStripes, "data-truncate-content": truncateContent, "data-density": rowDensity, "data-layout": layout, tabIndex: tabIndex })))));
+    return (react_1.default.createElement(DataTableRoot_context_1.DataTableContextProvider, { layout: layout },
+        react_1.default.createElement("div", { className: "aksel-data-table__border-wrapper" },
+            react_1.default.createElement("div", { className: "aksel-data-table__scroll-wrapper" },
+                react_1.default.createElement("table", Object.assign({}, rest, { ref: mergedRef, className: (0, helpers_1.cl)("aksel-data-table", className), "data-zebra-stripes": zebraStripes, "data-truncate-content": truncateContent, "data-density": rowDensity, "data-layout": layout, tabIndex: tabIndex }))))));
 });
 exports.DataTable = DataTable;
 DataTable.Caption = DataTableCaption_1.DataTableCaption;

package/cjs/data/table/root/DataTableRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableRoot.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAoD;AACpD,oDAA4C;AAC5C,gDAAoD;AACpD,kEAGqC;AAyNnC,iGA3NA,mCAAgB,OA2NA;AAxNlB,4DAGiC;AAsN/B,+FAxNA,+BAAc,OAwNA;AArNhB,mDAAuE;AAsNrE,4FAtNO,yBAAW,OAsNP;AArNb,4DAGiC;AAmN/B,+FArNA,+BAAc,OAqNA;AAlNhB,mDAAuE;AAmNrE,4FAnNO,yBAAW,OAmNP;AAlNb,4DAGiC;AAgN/B,+FAlNA,+BAAc,OAkNA;AA/MhB,mDAAuE;AAgNrE,4FAhNO,yBAAW,OAgNP;AA/Mb,+DAA4D;AAgJ5D;;;;;GAKG;AACH,MAAM,SAAS,GAAG,IAAA,kBAAU,EAC1B,CACE,EASC,EACD,YAAY,EACZ,EAAE;QAXF,EACE,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,eAAe,GAAG,KAAK,EACvB,YAAY,GAAG,KAAK,EACpB,eAAe,GAAG,IAAI,EACtB,qBAAqB,EACrB,MAAM,GAAG,OAAO,OAEjB,EADI,IAAI,cART,oHASC,CADQ;IAIT,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAA0B,IAAI,CAAC,CAAC;IACxE,MAAM,SAAS,GAAG,IAAA,oBAAY,EAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAE1D,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,yCAAmB,EAAC,QAAQ,EAAE;QACjD,OAAO,EAAE,eAAe;QACxB,qBAAqB;KACtB,CAAC,CAAC;IAEH,OAAO,CACL,uCAAK,SAAS,EAAC,kCAAkC;QAC/C,uCAAK,SAAS,EAAC,kCAAkC;YAC/C,yDACM,IAAI,IACR,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,IAAA,YAAE,EAAC,kBAAkB,EAAE,SAAS,CAAC,wBACxB,YAAY,2BACT,eAAe,kBACxB,UAAU,iBACX,MAAM,EACnB,QAAQ,EAAE,QAAQ,IAClB,CACE,CACF,CACP,CAAC;AACJ,CAAC,CACwB,CAAC;AAW1B,8BAAS;AATX,SAAS,CAAC,OAAO,GAAG,mCAAgB,CAAC;AACrC,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AACjC,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AACjC,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AAYjC,kBAAe,SAAS,CAAC"}
+{"version":3,"file":"DataTableRoot.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAoD;AACpD,oDAA4C;AAC5C,gDAAoD;AACpD,kEAGqC;AA4NnC,iGA9NA,mCAAgB,OA8NA;AA3NlB,4DAGiC;AAyN/B,+FA3NA,+BAAc,OA2NA;AAxNhB,mDAAuE;AAyNrE,4FAzNO,yBAAW,OAyNP;AAxNb,4DAGiC;AAsN/B,+FAxNA,+BAAc,OAwNA;AArNhB,mDAAuE;AAsNrE,4FAtNO,yBAAW,OAsNP;AArNb,4DAGiC;AAmN/B,+FArNA,+BAAc,OAqNA;AAlNhB,mDAAuE;AAmNrE,4FAnNO,yBAAW,OAmNP;AAlNb,mEAAmE;AACnE,+DAA4D;AAgJ5D;;;;;GAKG;AACH,MAAM,SAAS,GAAG,IAAA,kBAAU,EAC1B,CACE,EASC,EACD,YAAY,EACZ,EAAE;QAXF,EACE,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,eAAe,GAAG,KAAK,EACvB,YAAY,GAAG,KAAK,EACpB,eAAe,GAAG,IAAI,EACtB,qBAAqB,EACrB,MAAM,GAAG,OAAO,OAEjB,EADI,IAAI,cART,oHASC,CADQ;IAIT,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAA0B,IAAI,CAAC,CAAC;IACxE,MAAM,SAAS,GAAG,IAAA,oBAAY,EAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAE1D,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,yCAAmB,EAAC,QAAQ,EAAE;QACjD,OAAO,EAAE,eAAe;QACxB,qBAAqB;KACtB,CAAC,CAAC;IAEH,OAAO,CACL,8BAAC,gDAAwB,IAAC,MAAM,EAAE,MAAM;QACtC,uCAAK,SAAS,EAAC,kCAAkC;YAC/C,uCAAK,SAAS,EAAC,kCAAkC;gBAC/C,yDACM,IAAI,IACR,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,IAAA,YAAE,EAAC,kBAAkB,EAAE,SAAS,CAAC,wBACxB,YAAY,2BACT,eAAe,kBACxB,UAAU,iBACX,MAAM,EACnB,QAAQ,EAAE,QAAQ,IAClB,CACE,CACF,CACmB,CAC5B,CAAC;AACJ,CAAC,CACwB,CAAC;AAW1B,8BAAS;AATX,SAAS,CAAC,OAAO,GAAG,mCAAgB,CAAC;AACrC,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AACjC,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AACjC,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,yBAAW,CAAC;AAC3B,SAAS,CAAC,KAAK,GAAG,+BAAc,CAAC;AAYjC,kBAAe,SAAS,CAAC"}

package/cjs/data/table/th/DataTableTh.d.ts

@@ -1,9 +1,24 @@
 import React from "react";
+type SortDirection = "asc" | "desc" | "none";
 interface DataTableThProps extends React.HTMLAttributes<HTMLTableCellElement> {
     resizeHandler?: (event: React.MouseEvent<HTMLButtonElement> | React.TouchEvent<HTMLButtonElement>) => void;
     size?: number;
-    sortDirection?: "asc" | "desc" | "none" | false;
-    onSortChange?: (direction: "asc" | "desc" | "none", event: Event) => 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;
     render?: {
         filterMenu?: {
             title: string;
@@ -15,6 +30,7 @@ interface DataTableThProps extends React.HTMLAttributes<HTMLTableCellElement> {
      */
     colSpan?: number;
     rowSpan?: number;
+    keyboardResizingHandler?: (size: number) => void;
 }
 /**
  * TODO:

package/cjs/data/table/th/DataTableTh.js

@@ -47,34 +47,59 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataTableTh = void 0;
 const react_1 = __importStar(require("react"));
 const aksel_icons_1 = require("@navikt/aksel-icons");
-const action_menu_1 = require("../../../action-menu");
-const stack_1 = require("../../../primitives/stack");
 const helpers_1 = require("../../../utils/helpers");
-const DataTableThActions_1 = require("./DataTableThActions");
-const DataTableThSortHandle_1 = require("./DataTableThSortHandle");
+const SORT_ICON = {
+    asc: aksel_icons_1.SortUpIcon,
+    desc: aksel_icons_1.SortDownIcon,
+    none: aksel_icons_1.ArrowsUpDownIcon,
+};
 /**
  * TODO:
  * - Plan for pinning: Move it into "settings" dialog like here: https://cloudscape.design/examples/react/table.html
  */
 const DataTableTh = (0, react_1.forwardRef)((_a, forwardedRef) => {
-    var { className, children, resizeHandler, size, sortDirection, onSortChange, style, render } = _a, rest = __rest(_a, ["className", "children", "resizeHandler", "size", "sortDirection", "onSortChange", "style", "render"]);
-    const { filterMenu } = render || {};
-    return (react_1.default.createElement("th", Object.assign({}, rest, { ref: forwardedRef, className: (0, helpers_1.cl)("aksel-data-table__th", className), style: Object.assign({ width: size }, style) }),
-        react_1.default.createElement(stack_1.HStack, { align: "center", gap: "space-8", wrap: false },
-            react_1.default.createElement("div", { className: "aksel-data-table__th-content" }, children),
-            react_1.default.createElement(DataTableThSortHandle_1.DataTableThSortHandle, { sortDirection: sortDirection, onSortChange: onSortChange }),
-            react_1.default.createElement(stack_1.Spacer, null),
-            react_1.default.createElement(DataTableThActions_1.DataTableThActions, null,
-                sortDirection && (react_1.default.createElement(action_menu_1.ActionMenu.Group, { label: "Sortering" },
-                    react_1.default.createElement(action_menu_1.ActionMenu.Item, { onSelect: (event) => onSortChange === null || onSortChange === void 0 ? void 0 : onSortChange("desc", event), icon: react_1.default.createElement(aksel_icons_1.SortUpIcon, { "aria-hidden": true }) }, sortDirection === "desc" ? "Fjern sortering" : "A-Z"),
-                    react_1.default.createElement(action_menu_1.ActionMenu.Item, { onSelect: (event) => onSortChange === null || onSortChange === void 0 ? void 0 : onSortChange("asc", event), icon: react_1.default.createElement(aksel_icons_1.SortDownIcon, { "aria-hidden": true }) }, sortDirection === "asc" ? "Fjern sortering" : "Z-A"))),
-                filterMenu && (react_1.default.createElement(action_menu_1.ActionMenu.Group, { label: "Filter" },
-                    react_1.default.createElement(action_menu_1.ActionMenu.Sub, null,
-                        react_1.default.createElement(action_menu_1.ActionMenu.SubTrigger, { icon: react_1.default.createElement(aksel_icons_1.FunnelIcon, { "aria-hidden": true }) }, filterMenu.title),
-                        react_1.default.createElement(action_menu_1.ActionMenu.SubContent, null, filterMenu.content)))))),
+    var { className, children, resizeHandler, size, sortable = false, sortDirection = "none", onSortClick, style, keyboardResizingHandler } = _a, rest = __rest(_a, ["className", "children", "resizeHandler", "size", "sortable", "sortDirection", "onSortClick", "style", "keyboardResizingHandler"]);
+    const [resizeHandlerActive, setResizeHandlerActive] = react_1.default.useState(false);
+    const [isOverflowing, setIsOverflowing] = react_1.default.useState(false);
+    const contentRef = react_1.default.useRef(null);
+    const keyDownHandler = (event) => {
+        if (keyboardResizingHandler) {
+            if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                setResizeHandlerActive((active) => !active);
+            }
+            else if (resizeHandlerActive &&
+                (event.key === "ArrowLeft" || event.key === "ArrowRight")) {
+                event.preventDefault();
+                keyboardResizingHandler(event.key === "ArrowRight" ? 10 : -10);
+            }
+        }
+    };
+    const SortIcon = sortable ? SORT_ICON[sortDirection] : null;
+    return (react_1.default.createElement("th", Object.assign({}, rest, { ref: forwardedRef, className: (0, helpers_1.cl)("aksel-data-table__th", className), "data-sortable": sortable, style: Object.assign({ width: size }, 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) }),
+        sortable ? (react_1.default.createElement("button", { className: "aksel-data-table__th-sort-button", onClick: sortable ? onSortClick : undefined },
+            SortIcon && (react_1.default.createElement(SortIcon, { "aria-hidden": true, "data-sort-direction": sortDirection, className: "aksel-data-table__th-sort-icon" })),
+            react_1.default.createElement("div", { ref: contentRef, className: "aksel-data-table__th-content" }, children))) : (react_1.default.createElement("div", { ref: contentRef, className: "aksel-data-table__th-content" }, children)),
         resizeHandler && (react_1.default.createElement("button", { 
             // TODO: Should probably not be a button since it doesn't have onClick
-            onMouseDown: resizeHandler, onTouchStart: resizeHandler, className: "aksel-data-table__th-resize-handle" }))));
+            onMouseDown: resizeHandler, onTouchStart: resizeHandler, onBlur: () => setResizeHandlerActive(false), className: "aksel-data-table__th-resize-handle", "data-active": resizeHandlerActive, "data-block-keyboard-nav": true, onKeyDown: keyDownHandler }, resizeHandlerActive && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("span", { className: "aksel-data-table__th-resize-handle-indicator aksel-data-table__th-resize-handle-indicator--start" },
+                react_1.default.createElement(aksel_icons_1.CaretLeftCircleFillIcon, { "aria-hidden": true, fontSize: "1.5rem" })),
+            react_1.default.createElement("span", { className: "aksel-data-table__th-resize-handle-indicator aksel-data-table__th-resize-handle-indicator--end" },
+                react_1.default.createElement(aksel_icons_1.CaretRightCircleFillIcon, { "aria-hidden": true, fontSize: "1.5rem" }))))))));
 });
 exports.DataTableTh = DataTableTh;
+function getAriaSort(sortDirection) {
+    if (sortDirection === "asc")
+        return "ascending";
+    if (sortDirection === "desc")
+        return "descending";
+    if (sortDirection === "none")
+        return "none";
+    return undefined;
+}
 //# sourceMappingURL=DataTableTh.js.map

package/cjs/data/table/th/DataTableTh.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableTh.js","sourceRoot":"","sources":["../../../../src/data/table/th/DataTableTh.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,qDAA2E;AAC3E,sDAAkD;AAClD,qDAA2D;AAC3D,oDAA4C;AAC5C,6DAA0D;AAC1D,mEAAgE;AAwBhE;;;GAGG;AACH,MAAM,WAAW,GAAG,IAAA,kBAAU,EAC5B,CACE,EAUC,EACD,YAAY,EACZ,EAAE;QAZF,EACE,SAAS,EACT,QAAQ,EACR,aAAa,EACb,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,KAAK,EACL,MAAM,OAEP,EADI,IAAI,cATT,sGAUC,CADQ;IAIT,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,IAAI,EAAE,CAAC;IAEpC,OAAO,CACL,sDACM,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,YAAE,EAAC,sBAAsB,EAAE,SAAS,CAAC,EAChD,KAAK,kBAAI,KAAK,EAAE,IAAI,IAAK,KAAK;QAE9B,8BAAC,cAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAC,SAAS,EAAC,IAAI,EAAE,KAAK;YAC9C,uCAAK,SAAS,EAAC,8BAA8B,IAAE,QAAQ,CAAO;YAE9D,8BAAC,6CAAqB,IACpB,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,GAC1B;YACF,8BAAC,cAAM,OAAG;YAEV,8BAAC,uCAAkB;gBAGhB,aAAa,IAAI,CAChB,8BAAC,wBAAU,CAAC,KAAK,IAAC,KAAK,EAAC,WAAW;oBACjC,8BAAC,wBAAU,CAAC,IAAI,IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,MAAM,EAAE,KAAK,CAAC,EAClD,IAAI,EAAE,8BAAC,wBAAU,0BAAe,IAE/B,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CACrC;oBAClB,8BAAC,wBAAU,CAAC,IAAI,IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,KAAK,EAAE,KAAK,CAAC,EACjD,IAAI,EAAE,8BAAC,0BAAY,0BAAe,IAEjC,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CACpC,CACD,CACpB;gBACA,UAAU,IAAI,CACb,8BAAC,wBAAU,CAAC,KAAK,IAAC,KAAK,EAAC,QAAQ;oBAC9B,8BAAC,wBAAU,CAAC,GAAG;wBACb,8BAAC,wBAAU,CAAC,UAAU,IAAC,IAAI,EAAE,8BAAC,wBAAU,0BAAe,IACpD,UAAU,CAAC,KAAK,CACK;wBACxB,8BAAC,wBAAU,CAAC,UAAU,QAEnB,UAAU,CAAC,OAAO,CACG,CACT,CACA,CACpB,CACkB,CACd;QAER,aAAa,IAAI,CAChB;YACE,sEAAsE;YACtE,WAAW,EAAE,aAAa,EAC1B,YAAY,EAAE,aAAa,EAC3B,SAAS,EAAC,oCAAoC,GAC9C,CACH,CACE,CACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,kCAAW"}
+{"version":3,"file":"DataTableTh.js","sourceRoot":"","sources":["../../../../src/data/table/th/DataTableTh.tsx"],"names":[],"mappings":"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"}

package/cjs/data/table/tr/DataTableTr.js

@@ -47,11 +47,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataTableTr = void 0;
 const react_1 = __importStar(require("react"));
 const helpers_1 = require("../../../utils/helpers");
+const DataTableRoot_context_1 = require("../root/DataTableRoot.context");
 const DataTableTr = (0, react_1.forwardRef)((_a, forwardedRef) => {
-    var { className, selected = false } = _a, rest = __rest(_a, ["className", "selected"]);
+    var { className, children, selected = false } = _a, rest = __rest(_a, ["className", "children", "selected"]);
+    const rootContext = (0, DataTableRoot_context_1.useDataTableContext)();
+    const renderFillerCell = rootContext.layout === "fixed" && children;
     return (react_1.default.createElement("tr", Object.assign({}, rest, { ref: forwardedRef, className: (0, helpers_1.cl)("aksel-data-table__tr", className, {
             "aksel-data-table__tr--selected": selected,
-        }) })));
+        }) }),
+        children,
+        renderFillerCell && (
+        /* TODO: Consider chaning between th and td based on context */
+        react_1.default.createElement("div", { className: "aksel-data-table__th aksel-data-table__filler-cell" }))));
 });
 exports.DataTableTr = DataTableTr;
 //# sourceMappingURL=DataTableTr.js.map

package/cjs/data/table/tr/DataTableTr.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableTr.js","sourceRoot":"","sources":["../../../../src/data/table/tr/DataTableTr.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,oDAA4C;AAM5C,MAAM,WAAW,GAAG,IAAA,kBAAU,EAC5B,CAAC,EAAwC,EAAE,YAAY,EAAE,EAAE;QAA1D,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,OAAW,EAAN,IAAI,cAAtC,yBAAwC,CAAF;IACrC,OAAO,CACL,sDACM,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,YAAE,EAAC,sBAAsB,EAAE,SAAS,EAAE;YAC/C,gCAAgC,EAAE,QAAQ;SAC3C,CAAC,IACF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,kCAAW"}
+{"version":3,"file":"DataTableTr.js","sourceRoot":"","sources":["../../../../src/data/table/tr/DataTableTr.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,oDAA4C;AAC5C,yEAAoE;AAMpE,MAAM,WAAW,GAAG,IAAA,kBAAU,EAC5B,CAAC,EAAkD,EAAE,YAAY,EAAE,EAAE;QAApE,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,GAAG,KAAK,OAAW,EAAN,IAAI,cAAhD,qCAAkD,CAAF;IAC/C,MAAM,WAAW,GAAG,IAAA,2CAAmB,GAAE,CAAC;IAE1C,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAM,KAAK,OAAO,IAAI,QAAQ,CAAC;IAEpE,OAAO,CACL,sDACM,IAAI,IACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,YAAE,EAAC,sBAAsB,EAAE,SAAS,EAAE;YAC/C,gCAAgC,EAAE,QAAQ;SAC3C,CAAC;QAED,QAAQ;QACR,gBAAgB,IAAI;QACnB,+DAA+D;QAC/D,uCAAK,SAAS,EAAC,oDAAoD,GAAG,CACvE,CACE,CACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,kCAAW"}

package/cjs/data/token-filter/AutoSuggest.d.ts

@@ -2,8 +2,12 @@ import React from "react";
 import type { AutoCompleteOption, OptionGroup } from "./AutoSuggest.types";
 interface AutoSuggestProps {
     options: OptionGroup<AutoCompleteOption>[];
-    onSelect: (value: string) => void;
+    onSelect: (option: AutoCompleteOption) => boolean;
     className?: string;
+    value: string;
+    onChange: (newValue: string) => void;
+    open: boolean;
+    setOpen: (open: boolean) => void;
 }
-declare const AutoSuggest: React.ForwardRefExoticComponent<AutoSuggestProps & React.RefAttributes<HTMLDivElement>>;
+declare const AutoSuggest: React.ForwardRefExoticComponent<AutoSuggestProps & React.RefAttributes<HTMLInputElement>>;
 export { AutoSuggest };