@navikt/ds-react 8.7.0 → 8.8.0

package/esm/alert/info-card/root/InfoCardRoot.js

@@ -13,6 +13,7 @@ import React, { forwardRef } from "react";
 import { BaseAlert } from "../../base-alert/index.js";
 import { InfoCardContent, } from "../content/InfoCardContent.js";
 import { InfoCardHeader, } from "../header/InfoCardHeader.js";
+import { InfoCardMessage, } from "../message/InfoCardMessage.js";
 import { InfoCardTitle } from "../title/InfoCardTitle.js";
 /**
  * A component for displaying informational content in a card format.
@@ -35,6 +36,7 @@ export const InfoCard = forwardRef((_a, forwardedRef) => {
 InfoCard.Header = InfoCardHeader;
 InfoCard.Title = InfoCardTitle;
 InfoCard.Content = InfoCardContent;
+InfoCard.Message = InfoCardMessage;
 export default InfoCard;
-export { InfoCardContent, InfoCardHeader, InfoCardTitle };
+export { InfoCardContent, InfoCardHeader, InfoCardTitle, InfoCardMessage };
 //# sourceMappingURL=InfoCardRoot.js.map

package/esm/alert/info-card/root/InfoCardRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfoCardRoot.js","sourceRoot":"","sources":["../../../../src/alert/info-card/root/InfoCardRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EACL,eAAe,GAEhB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,cAAc,GAEf,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,aAAa,EAA2B,MAAM,wBAAwB,CAAC;AAgEhF;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EAIgB,EAChB,YAAY,EACZ,EAAE;QANF,EACE,YAAY,EAAE,SAAS,GAAG,MAAM,EAChC,EAAE,GAAG,KAAK,OAEI,EADX,SAAS,cAHd,oBAIC,CADa;IAId,OAAO,CACL,oBAAC,SAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,gBACL,SAAS,IACjB,SAAS,IACb,IAAI,EAAC,UAAU,EACf,MAAM,EAAE,KAAK,EACb,EAAE,EAAE,EAAE,IACN,CACH,CAAC;AACJ,CAAC,CACmB,CAAC;AAEvB,QAAQ,CAAC,MAAM,GAAG,cAAc,CAAC;AACjC,QAAQ,CAAC,KAAK,GAAG,aAAa,CAAC;AAC/B,QAAQ,CAAC,OAAO,GAAG,eAAe,CAAC;AAEnC,eAAe,QAAQ,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"InfoCardRoot.js","sourceRoot":"","sources":["../../../../src/alert/info-card/root/InfoCardRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EACL,eAAe,GAEhB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,cAAc,GAEf,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,eAAe,GAEhB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,aAAa,EAA2B,MAAM,wBAAwB,CAAC;AA6EhF;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EAIgB,EAChB,YAAY,EACZ,EAAE;QANF,EACE,YAAY,EAAE,SAAS,GAAG,MAAM,EAChC,EAAE,GAAG,KAAK,OAEI,EADX,SAAS,cAHd,oBAIC,CADa;IAId,OAAO,CACL,oBAAC,SAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,gBACL,SAAS,IACjB,SAAS,IACb,IAAI,EAAC,UAAU,EACf,MAAM,EAAE,KAAK,EACb,EAAE,EAAE,EAAE,IACN,CACH,CAAC;AACJ,CAAC,CACmB,CAAC;AAEvB,QAAQ,CAAC,MAAM,GAAG,cAAc,CAAC;AACjC,QAAQ,CAAC,KAAK,GAAG,aAAa,CAAC;AAC/B,QAAQ,CAAC,OAAO,GAAG,eAAe,CAAC;AACnC,QAAQ,CAAC,OAAO,GAAG,eAAe,CAAC;AAEnC,eAAe,QAAQ,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,eAAe,EAAE,CAAC"}

package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+export interface DataDragAndDropDragHandlerProps {
+    /**
+     * Whether the drag handler is disabled
+     */
+    /**
+     * Wether dragging is done by keyboard. Used to conditionally render drag indicators.
+     */
+    keyboardDragging?: boolean;
+    /**
+     * Handle ref is forwarded to the button element serving as drag handle.
+     */
+    handleRef: React.Ref<HTMLDivElement>;
+}
+/**
+ * DataDragAndDropDragHandler
+ *
+ * A button component that serves as a drag handle for drag and drop operations.
+ * Can be used to initiate dragging of elements in a data table or list.
+ */
+export declare const DataDragAndDropDragHandler: React.ForwardRefExoticComponent<DataDragAndDropDragHandlerProps & React.RefAttributes<HTMLButtonElement>>;

package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js

@@ -0,0 +1,18 @@
+import React from "react";
+import { CaretDownCircleFillIcon, CaretUpCircleFillIcon, DragVerticalIcon, } from "@navikt/aksel-icons";
+/**
+ * DataDragAndDropDragHandler
+ *
+ * A button component that serves as a drag handle for drag and drop operations.
+ * Can be used to initiate dragging of elements in a data table or list.
+ */
+export const DataDragAndDropDragHandler = React.forwardRef(({ keyboardDragging, handleRef }) => {
+    return (React.createElement("div", { className: "aksel-data-drag-and-drop__drag-handler__alt" },
+        keyboardDragging && (React.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "up" },
+            React.createElement(CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+        React.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+            React.createElement(DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" })),
+        keyboardDragging && (React.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "down" },
+            React.createElement(CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+});
+//# sourceMappingURL=DataDragAndDropDragHandler.js.map

package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDropDragHandler.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,qBAAqB,CAAC;AAiB7B;;;;;GAKG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CAGxD,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,EAAE,EAAE;IACpC,OAAO,CACL,6BAAK,SAAS,EAAC,6CAA6C;QACzD,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,+CAA+C,oBAC1C,IAAI;YAEnB,oBAAC,qBAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;QACD,6BACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;YAE1D,oBAAC,gBAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE;QACL,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,+CAA+C,oBAC1C,MAAM;YAErB,oBAAC,uBAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

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

@@ -9,13 +9,9 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { useSortable } from "@dnd-kit/react/sortable";
-import React, { useRef } from "react";
-import { CaretDownCircleFillIcon, CaretUpCircleFillIcon, DragVerticalIcon, } from "@navikt/aksel-icons";
+import React from "react";
 import { HStack } from "../../../primitives/stack/index.js";
 import { cl } from "../../../utils/helpers/index.js";
-import { useMergeRefs } from "../../../utils/hooks/index.js";
-import { DataDragAndDropContext } from "../root/DataDragAndDrop.context.js";
 /**
  * TODO
  *
@@ -28,26 +24,10 @@ import { DataDragAndDropContext } from "../root/DataDragAndDrop.context.js";
  * ```
  */
 const DataDragAndDropItem = React.forwardRef((_a, forwardedRef) => {
-    var { children, id, index, className } = _a, rest = __rest(_a, ["children", "id", "index", "className"]);
-    const handleRef = useRef(null);
-    const { ref, isDragging, isDropTarget } = useSortable({
-        id,
-        index,
-        handle: handleRef,
-    });
-    const mergedRef = useMergeRefs(ref, forwardedRef);
-    const context = React.useContext(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";
+    // const context = useDataDragAndDropContext();
+    var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
     return (React.createElement(HStack, { gap: "space-8", align: "center", wrap: false, asChild: true },
-        React.createElement("div", Object.assign({ ref: mergedRef }, rest, { className: 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.createElement("div", { className: "aksel-data-table__drag-and-drop-item-drag-handler", ref: handleRef },
-                keyboardDragging && (React.createElement("span", { className: "aksel-data-table__drag-and-drop-item-keyboard-drag-icon", "data-direction": "up" },
-                    React.createElement(CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
-                React.createElement(DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" }),
-                keyboardDragging && (React.createElement("span", { className: "aksel-data-table__drag-and-drop-item-keyboard-drag-icon", "data-direction": "down" },
-                    React.createElement(CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))),
+        React.createElement("div", Object.assign({ ref: forwardedRef }, rest, { className: cl("aksel-data-table__drag-and-drop-item", className) }),
             React.createElement("div", null, children))));
 });
 export default DataDragAndDropItem;

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

@@ -1 +1 @@
-{"version":3,"file":"DataDragAndDropItem.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/item/DataDragAndDropItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AAczE;;;;;;;;;;GAUG;AACH,MAAM,mBAAmB,GAAG,KAAK,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,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,WAAW,CAAC;QACpD,EAAE;QACF,KAAK;QACL,MAAM,EAAE,SAAS;KAClB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,sBAAsB,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,oBAAC,MAAM,IAAC,GAAG,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,EAAE,OAAO;QAEvD,2CACE,GAAG,EAAE,SAAS,IACV,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,sCAAsC,EAAE,SAAS,CAAC,mBACjD,UAAU,yBACJ,aAAa,4BACV,gBAAgB,sBACtB,eAAe,EACjC,QAAQ,EAAE,CAAC,CAAC;YAEZ,6BACE,SAAS,EAAC,mDAAmD,EAC7D,GAAG,EAAE,SAAS;gBAIb,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,yDAAyD,oBACpD,IAAI;oBAEnB,oBAAC,qBAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;gBACD,oBAAC,gBAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB;gBACD,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,yDAAyD,oBACpD,MAAM;oBAErB,oBAAC,uBAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG;YACN,iCAAM,QAAQ,CAAO,CACjB,CACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
+{"version":3,"file":"DataDragAndDropItem.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/item/DataDragAndDropItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAc5C;;;;;;;;;;GAUG;AACH,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAG1C,CAAC,EAAgC,EAAE,YAAY,EAAE,EAAE;IACnD,+CAA+C;QAD9C,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAG/B,OAAO,CACL,oBAAC,MAAM,IAAC,GAAG,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,EAAE,OAAO;QAEvD,2CACE,GAAG,EAAE,YAAY,IACb,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,sCAAsC,EAAE,SAAS,CAAC;YAMhE,iCAAM,QAAQ,CAAO,CACjB,CACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

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

@@ -1,5 +1,8 @@
 interface DataDragAndDropContextType {
     inputMethod: "mouse" | "keyboard" | null;
 }
-export declare const DataDragAndDropContext: import("react").Context<DataDragAndDropContextType | undefined>;
+export declare const DataDragAndDropProvider: import("react").FC<DataDragAndDropContextType & {
+    children: React.ReactNode;
+    ref?: never;
+}>, useDataDragAndDropContext: <S extends boolean = true>(strict?: S | undefined) => S extends true ? DataDragAndDropContextType | undefined : DataDragAndDropContextType | undefined;
 export {};

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

@@ -1,3 +1,6 @@
-import { createContext } from "react";
-export const DataDragAndDropContext = createContext(undefined);
+import { createStrictContext } from "../../../utils/helpers/index.js";
+export const { Provider: DataDragAndDropProvider, useContext: useDataDragAndDropContext, } = createStrictContext({
+    errorMessage: "useDataDragAndDropContext must be used within a DataDragAndDropProvider",
+    name: "DataDragAndDropContext",
+});
 //# sourceMappingURL=DataDragAndDrop.context.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataDragAndDrop.context.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDrop.context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAMtC,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAEjD,SAAS,CAAC,CAAC"}
+{"version":3,"file":"DataDragAndDrop.context.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDrop.context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAM7D,MAAM,CAAC,MAAM,EACX,QAAQ,EAAE,uBAAuB,EACjC,UAAU,EAAE,yBAAyB,GACtC,GAAG,mBAAmB,CAAyC;IAC9D,YAAY,EACV,yEAAyE;IAC3E,IAAI,EAAE,wBAAwB;CAC/B,CAAC,CAAC"}

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

@@ -1,10 +1,10 @@
 import React from "react";
 import DataDragAndDropItem, { DataDragAndDropItemProps } from "../item/DataDragAndDropItem.js";
-interface DataDragAndDropProps extends React.HTMLAttributes<HTMLTableElement> {
+interface DataDragAndDropProps extends React.HTMLAttributes<HTMLDivElement> {
     children: any[];
     setItems: React.Dispatch<React.SetStateAction<any[]>>;
 }
-interface DataDragAndDropRootComponent extends React.ForwardRefExoticComponent<DataDragAndDropProps & React.RefAttributes<HTMLTableElement>> {
+interface DataDragAndDropRootComponent extends React.ForwardRefExoticComponent<DataDragAndDropProps & React.RefAttributes<HTMLDivElement>> {
     /**
      * @see 🏷️ {@link DataDragAndDropItemProps}
      * * @example
@@ -18,6 +18,16 @@ interface DataDragAndDropRootComponent extends React.ForwardRefExoticComponent<D
      */
     Item: typeof DataDragAndDropItem;
 }
+/**
+ * TODO
+ * setItems on root
+ * state : active element
+ * pointer over listener / state, onPointerEnter, onPointerLeave
+ * Overlay - Use floating component
+ * Keyboard navigation
+ * Handle - button, arrows also button
+ * UU - announce on drag start, item moved, drag end
+ */
 declare const DataDragAndDrop: DataDragAndDropRootComponent;
 export { DataDragAndDrop, DataDragAndDropItem };
 export default DataDragAndDrop;

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

@@ -1,69 +1,19 @@
-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 { DragDropProvider, DragOverlay } from "@dnd-kit/react";
-import { isSortable } from "@dnd-kit/react/sortable";
-import React, { forwardRef, isValidElement } from "react";
-import { VStack } from "../../../primitives/stack/index.js";
+import React, { forwardRef } from "react";
 import DataDragAndDropItem from "../item/DataDragAndDropItem.js";
-import { DataDragAndDropContext } from "./DataDragAndDrop.context.js";
-const DataDragAndDrop = forwardRef((_a, forwardedRef) => {
-    var { setItems, children } = _a, rest = __rest(_a, ["setItems", "children"]);
-    const [inputMethod, setInputMethod] = React.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.createElement(DataDragAndDropContext.Provider, { value: { inputMethod } },
-        React.createElement(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 (!isSortable(source) || !isSortable(target))
-                        return;
-                    setItemOrder(source.initialIndex, target.index);
-                }
-            } },
-            React.createElement(VStack, { asChild: true, gap: "space-12" },
-                React.createElement("div", Object.assign({}, rest, { ref: forwardedRef }), children)),
-            React.createElement(DragOverlay, null, (source) => {
-                // Overlay not needed and causes glitching when using keyboard
-                if (inputMethod === "keyboard")
-                    return null;
-                if (!isSortable(source))
-                    return null;
-                if (isValidElement(children[source.initialIndex])) {
-                    return children[source.initialIndex];
-                }
-                return null;
-            }))));
+import { DataDragAndDropProvider } from "./DataDragAndDrop.context.js";
+/**
+ * TODO
+ * setItems on root
+ * state : active element
+ * pointer over listener / state, onPointerEnter, onPointerLeave
+ * Overlay - Use floating component
+ * Keyboard navigation
+ * Handle - button, arrows also button
+ * UU - announce on drag start, item moved, drag end
+ */
+const DataDragAndDrop = forwardRef(({ children }, forwardedRef) => {
+    return (React.createElement(DataDragAndDropProvider, { inputMethod: null },
+        React.createElement("div", { ref: forwardedRef }, children)));
 });
 DataDragAndDrop.Item = DataDragAndDropItem;
 export { DataDragAndDrop, DataDragAndDropItem };

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

@@ -1 +1 @@
-{"version":3,"file":"DataDragAndDropRoot.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDropRoot.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataDragAndDropRoot.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDropRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,mBAEN,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAwBpE;;;;;;;;;GASG;AAEH,MAAM,eAAe,GAAG,UAAU,CAChC,CAAC,EAAE,QAAQ,EAAE,EAAE,YAAY,EAAE,EAAE;IAC7B,OAAO,CACL,oBAAC,uBAAuB,IAAC,WAAW,EAAE,IAAI;QACxC,6BAAK,GAAG,EAAE,YAAY,IAAG,QAAQ,CAAO,CAChB,CAC3B,CAAC;AACJ,CAAC,CAC8B,CAAC;AAElC,eAAe,CAAC,IAAI,GAAG,mBAAmB,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,CAAC;AAChD,eAAe,eAAe,CAAC"}

package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+export interface DataDragAndDropDragHandlerProps {
+    /**
+     * Whether the drag handler is disabled
+     */
+    /**
+     * Wether dragging is done by keyboard. Used to conditionally render drag indicators.
+     */
+    keyboardDragging?: boolean;
+    /**
+     * Handle ref is forwarded to the button element serving as drag handle.
+     */
+    handleRef: React.Ref<HTMLDivElement>;
+    alt?: boolean;
+}
+/**
+ * DataDragAndDropDragHandler
+ *
+ * A button component that serves as a drag handle for drag and drop operations.
+ * Can be used to initiate dragging of elements in a data table or list.
+ */
+export declare const DataDragAndDropDragHandler: React.ForwardRefExoticComponent<DataDragAndDropDragHandlerProps & React.RefAttributes<HTMLButtonElement>>;

package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js

@@ -0,0 +1,29 @@
+import React from "react";
+import { CaretDownCircleFillIcon, CaretUpCircleFillIcon, DragVerticalIcon, } from "@navikt/aksel-icons";
+import { Floating } from "../../../utils/components/floating/Floating.js";
+/**
+ * DataDragAndDropDragHandler
+ *
+ * A button component that serves as a drag handle for drag and drop operations.
+ * Can be used to initiate dragging of elements in a data table or list.
+ */
+export const DataDragAndDropDragHandler = React.forwardRef(({ keyboardDragging, handleRef, alt }) => {
+    if (alt) {
+        return (React.createElement("div", { className: "aksel-data-drag-and-drop__drag-handler__alt" },
+            keyboardDragging && (React.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "up" },
+                React.createElement(CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+            React.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+                React.createElement(DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" })),
+            keyboardDragging && (React.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "down" },
+                React.createElement(CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+    }
+    return (React.createElement(Floating, null,
+        keyboardDragging && (React.createElement(Floating.Content, { side: "top", avoidCollisions: false, updatePositionStrategy: "always", className: "aksel-data-drag-and-drop__drag-handler__arrow" },
+            React.createElement(CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+        React.createElement(Floating.Anchor, { asChild: true },
+            React.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+                React.createElement(DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" }))),
+        keyboardDragging && (React.createElement(Floating.Content, { avoidCollisions: false, updatePositionStrategy: "always", className: "aksel-data-drag-and-drop__drag-handler__arrow" },
+            React.createElement(CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+});
+//# sourceMappingURL=DataDragAndDropDragHandler.js.map

package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDropDragHandler.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAC;AAmBvE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,KAAK,CAAC,UAAU,CAGxD,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,EAAE;IACzC,IAAI,GAAG,EAAE,CAAC;QACR,OAAO,CACL,6BAAK,SAAS,EAAC,6CAA6C;YACzD,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,+CAA+C,oBAC1C,IAAI;gBAEnB,oBAAC,qBAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;YACD,6BACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;gBAE1D,oBAAC,gBAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE;YACL,gBAAgB,IAAI,CACnB,8BACE,SAAS,EAAC,+CAA+C,oBAC1C,MAAM;gBAErB,oBAAC,uBAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,oBAAC,QAAQ;QACN,gBAAgB,IAAI,CACnB,oBAAC,QAAQ,CAAC,OAAO,IACf,IAAI,EAAC,KAAK,EACV,eAAe,EAAE,KAAK,EACtB,sBAAsB,EAAC,QAAQ,EAC/B,SAAS,EAAC,+CAA+C;YAEzD,oBAAC,qBAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACtC,CACpB;QACD,oBAAC,QAAQ,CAAC,MAAM,IAAC,OAAO;YACtB,6BACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;gBAE1D,oBAAC,gBAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE,CACU;QACjB,gBAAgB,IAAI,CACnB,oBAAC,QAAQ,CAAC,OAAO,IACf,eAAe,EAAE,KAAK,EACtB,sBAAsB,EAAC,QAAQ,EAC/B,SAAS,EAAC,+CAA+C;YAEzD,oBAAC,uBAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACxC,CACpB,CACQ,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/esm/data/drag-and-drop-old/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/esm/data/drag-and-drop-old/item/DataDragAndDropItem.js

@@ -0,0 +1,50 @@
+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 { useSortable } from "@dnd-kit/react/sortable";
+import React, { useRef } from "react";
+import { HStack } from "../../../primitives/stack/index.js";
+import { cl } from "../../../utils/helpers/index.js";
+import { useMergeRefs } from "../../../utils/hooks/index.js";
+import { DataDragAndDropDragHandler } from "../drag-handler/DataDragAndDropDragHandler.js";
+import { DataDragAndDropContext } from "../root/DataDragAndDrop.context.js";
+/**
+ * TODO
+ *
+ * @see 🏷️ {@link DataDragAndDropItemProps}
+ * @example
+ * ```tsx
+ * <DragAndDrop.Item numOfSelectedRows={selectedRows.length} onClear={handleClear}>
+ *   TODO
+ * </DragAndDrop.Item>
+ * ```
+ */
+const DataDragAndDropItem = React.forwardRef((_a, forwardedRef) => {
+    var { children, id, index, className } = _a, rest = __rest(_a, ["children", "id", "index", "className"]);
+    const handleRef = useRef(null);
+    const { ref, isDragging, isDropTarget } = useSortable({
+        id,
+        index,
+        handle: handleRef,
+    });
+    const mergedRef = useMergeRefs(ref, forwardedRef);
+    const context = React.useContext(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.createElement(HStack, { gap: "space-8", align: "center", wrap: false, asChild: true },
+        React.createElement("div", Object.assign({ ref: mergedRef }, rest, { className: 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.createElement(DataDragAndDropDragHandler, { handleRef: handleRef, keyboardDragging: keyboardDragging, alt: true }),
+            React.createElement("div", null, children))));
+});
+export default DataDragAndDropItem;
+export { DataDragAndDropItem };
+//# sourceMappingURL=DataDragAndDropItem.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDropItem.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop-old/item/DataDragAndDropItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,0BAA0B,EAAE,MAAM,4CAA4C,CAAC;AACxF,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AAczE;;;;;;;;;;GAUG;AACH,MAAM,mBAAmB,GAAG,KAAK,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,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,WAAW,CAAC;QACpD,EAAE;QACF,KAAK;QACL,MAAM,EAAE,SAAS;KAClB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,sBAAsB,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,oBAAC,MAAM,IAAC,GAAG,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,EAAE,OAAO;QAEvD,2CACE,GAAG,EAAE,SAAS,IACV,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,sCAAsC,EAAE,SAAS,CAAC,mBACjD,UAAU,yBACJ,aAAa,4BACV,gBAAgB,sBACtB,eAAe,EACjC,QAAQ,EAAE,CAAC,CAAC;YAEZ,oBAAC,0BAA0B,IACzB,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,EAClC,GAAG,SACH;YACF,iCAAM,QAAQ,CAAO,CACjB,CACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/esm/data/drag-and-drop-old/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/esm/data/drag-and-drop-old/root/DataDragAndDrop.context.js

@@ -0,0 +1,3 @@
+import { createContext } from "react";
+export const DataDragAndDropContext = createContext(undefined);
+//# sourceMappingURL=DataDragAndDrop.context.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataDragAndDrop.context.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop-old/root/DataDragAndDrop.context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAQtC,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAEjD,SAAS,CAAC,CAAC"}

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

@@ -0,0 +1,24 @@
+import React from "react";
+import DataDragAndDropItem, { DataDragAndDropItemProps } from "../item/DataDragAndDropItem.js";
+interface DataDragAndDropProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: any[];
+    setItems: React.Dispatch<React.SetStateAction<any[]>>;
+}
+interface DataDragAndDropRootComponent extends React.ForwardRefExoticComponent<DataDragAndDropProps & React.RefAttributes<HTMLDivElement>> {
+    /**
+     * @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/esm/data/drag-and-drop-old/root/DataDragAndDropRoot.js

@@ -0,0 +1,68 @@
+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 { DragDropProvider, DragOverlay } from "@dnd-kit/react";
+import { isSortable } from "@dnd-kit/react/sortable";
+import React, { forwardRef, isValidElement } from "react";
+import { VStack } from "../../../primitives/stack/index.js";
+import DataDragAndDropItem from "../item/DataDragAndDropItem.js";
+import { DataDragAndDropContext } from "./DataDragAndDrop.context.js";
+const DataDragAndDrop = forwardRef((_a, forwardedRef) => {
+    var { setItems, children } = _a, rest = __rest(_a, ["setItems", "children"]);
+    const [inputMethod, setInputMethod] = React.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.createElement(DataDragAndDropContext.Provider, { value: { inputMethod } },
+        React.createElement(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) => {
+                const { source, target } = event.operation;
+                if (!isSortable(source) || !isSortable(target))
+                    return;
+                setItemOrder(source.initialIndex, target.index);
+            } },
+            React.createElement(VStack, { asChild: true, gap: "space-12" },
+                React.createElement("div", Object.assign({}, rest, { ref: forwardedRef }), children)),
+            React.createElement(DragOverlay, { dropAnimation: null }, (source) => {
+                // Overlay not needed and causes glitching when using keyboard
+                if (inputMethod === "keyboard")
+                    return null;
+                if (!isSortable(source))
+                    return null;
+                if (isValidElement(children[source.initialIndex])) {
+                    return children[source.initialIndex];
+                }
+                return null;
+            }))));
+});
+DataDragAndDrop.Item = DataDragAndDropItem;
+export { DataDragAndDrop, DataDragAndDropItem };
+export default DataDragAndDrop;
+//# sourceMappingURL=DataDragAndDropRoot.js.map

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

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

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

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

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

@@ -0,0 +1,21 @@
+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";
+const DataTableEmptyState = forwardRef((_a, forwardedRef) => {
+    var { className, children } = _a, rest = __rest(_a, ["className", "children"]);
+    return (React.createElement("tr", null,
+        React.createElement("td", { colSpan: 999 },
+            React.createElement("div", Object.assign({}, rest, { ref: forwardedRef, className: cl("aksel-data-table__empty-state", className) }), children))));
+});
+export { DataTableEmptyState };
+//# sourceMappingURL=DataTableEmptyState.js.map

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

@@ -0,0 +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"}

package/esm/data/table/helpers/table-focus.js

@@ -31,7 +31,9 @@ function restoreTabIndex(cell) {
  */
 function findFocusableElementInCell(cell) {
     const el = cell;
-    if (!el || isHiddenElement(el)) {
+    if (!el ||
+        isHiddenElement(el) ||
+        el.hasAttribute("data-block-keyboard-nav")) {
         return null;
     }
     const focusables = el.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]');
@@ -40,6 +42,10 @@ function findFocusableElementInCell(cell) {
     }
     for (let i = 0; i < focusables.length; i += 1) {
         const focusable = focusables[i];
+        /* Ignore element if it has [data-block-keyboard-nav="true"] */
+        if (focusable.hasAttribute("data-block-keyboard-nav")) {
+            continue;
+        }
         if (!isHiddenElement(focusable) && !isDisabledElement(focusable)) {
             return focusable;
         }