@navikt/ds-react 8.7.0 → 8.8.0

package/cjs/alert/base-alert/root/BaseAlertRoot.js

@@ -57,8 +57,7 @@ const BaseAlert = (0, react_1.forwardRef)((_a, forwardedRef) => {
     const translate = (0, i18n_hooks_1.useI18n)("global");
     const alertColor = status ? (0, BaseAlertRoot_utils_1.baseAlertStatusToDataColor)(status) : dataColor;
     return (react_1.default.createElement(BaseAlertRoot_context_1.BaseAlertProvider, { size: size, status: status, color: alertColor, statusId: type === "strong" ? statusId : undefined },
-        react_1.default.createElement(Component, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : (!status || Component === "div" ? undefined : translate(status)), ref: forwardedRef }, restProps, { className: (0, helpers_1.cl)(className, "aksel-base-alert"), "data-size": size, "data-color": alertColor, "data-variant": type, "data-global": global }),
-            react_1.default.createElement("div", { role: role }, children))));
+        react_1.default.createElement(Component, Object.assign({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : (!status || Component === "div" ? undefined : translate(status)), ref: forwardedRef }, restProps, { className: (0, helpers_1.cl)(className, "aksel-base-alert"), "data-size": size, "data-color": alertColor, "data-variant": type, "data-global": global }), role ? react_1.default.createElement("div", { role: role }, children) : children)));
 });
 exports.BaseAlert = BaseAlert;
 //# sourceMappingURL=BaseAlertRoot.js.map

package/cjs/alert/base-alert/root/BaseAlertRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/base-alert/root/BaseAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,4DAAgD;AAChD,oDAA4C;AAC5C,+DAAyD;AACzD,mEAGiC;AACjC,+DAAmE;AA0CnE,MAAM,SAAS,GAAG,IAAA,kBAAU,EAC1B,CACE,EAYiB,EACjB,YAAY,EACZ,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,YAAY,EAAE,SAAS,EACvB,IAAI,EACJ,MAAM,GAAG,KAAK,EACd,MAAM,EACN,EAAE,EAAE,SAAS,GAAG,SAAS,EACzB,YAAY,EAAE,SAAS,EACvB,IAAI,OAEW,EADZ,SAAS,cAXd,uGAYC,CADa;IAId,MAAM,QAAQ,GAAG,IAAA,sBAAK,GAAE,CAAC;IACzB,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,QAAQ,CAAC,CAAC;IAEpC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,IAAA,gDAA0B,EAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE3E,OAAO,CACL,8BAAC,yCAAiB,IAChB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;QAElD,8BAAC,SAAS,gCAEN,SAAS,aAAT,SAAS,cAAT,SAAS,GACT,CAAC,CAAC,MAAM,IAAI,SAAS,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,EAElE,GAAG,EAAE,YAAY,IACb,SAAS,IACb,SAAS,EAAE,IAAA,YAAE,EAAC,SAAS,EAAE,kBAAkB,CAAC,eACjC,IAAI,gBACH,UAAU,kBACR,IAAI,iBACL,MAAM;YAEnB,uCAAK,IAAI,EAAE,IAAI,IAAG,QAAQ,CAAO,CACvB,CACM,CACrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,8BAAS"}
+{"version":3,"file":"BaseAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/base-alert/root/BaseAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,4DAAgD;AAChD,oDAA4C;AAC5C,+DAAyD;AACzD,mEAGiC;AACjC,+DAAmE;AA0CnE,MAAM,SAAS,GAAG,IAAA,kBAAU,EAC1B,CACE,EAYiB,EACjB,YAAY,EACZ,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,YAAY,EAAE,SAAS,EACvB,IAAI,EACJ,MAAM,GAAG,KAAK,EACd,MAAM,EACN,EAAE,EAAE,SAAS,GAAG,SAAS,EACzB,YAAY,EAAE,SAAS,EACvB,IAAI,OAEW,EADZ,SAAS,cAXd,uGAYC,CADa;IAId,MAAM,QAAQ,GAAG,IAAA,sBAAK,GAAE,CAAC;IACzB,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,QAAQ,CAAC,CAAC;IAEpC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,IAAA,gDAA0B,EAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE3E,OAAO,CACL,8BAAC,yCAAiB,IAChB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;QAElD,8BAAC,SAAS,gCAEN,SAAS,aAAT,SAAS,cAAT,SAAS,GACT,CAAC,CAAC,MAAM,IAAI,SAAS,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,EAElE,GAAG,EAAE,YAAY,IACb,SAAS,IACb,SAAS,EAAE,IAAA,YAAE,EAAC,SAAS,EAAE,kBAAkB,CAAC,eACjC,IAAI,gBACH,UAAU,kBACR,IAAI,iBACL,MAAM,KAElB,IAAI,CAAC,CAAC,CAAC,uCAAK,IAAI,EAAE,IAAI,IAAG,QAAQ,CAAO,CAAC,CAAC,CAAC,QAAQ,CAC1C,CACM,CACrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,8BAAS"}

package/cjs/alert/info-card/index.d.ts

@@ -1,2 +1,2 @@
-export { InfoCard, InfoCardHeader, InfoCardTitle, InfoCardContent, } from "./root/InfoCardRoot";
-export type { InfoCardProps, InfoCardHeaderProps, InfoCardTitleProps, InfoCardContentProps, } from "./root/InfoCardRoot";
+export { InfoCard, InfoCardHeader, InfoCardTitle, InfoCardContent, InfoCardMessage, } from "./root/InfoCardRoot";
+export type { InfoCardProps, InfoCardHeaderProps, InfoCardTitleProps, InfoCardContentProps, InfoCardMessageProps, } from "./root/InfoCardRoot";

package/cjs/alert/info-card/index.js

@@ -1,10 +1,11 @@
 "use strict";
 "use client";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InfoCardContent = exports.InfoCardTitle = exports.InfoCardHeader = exports.InfoCard = void 0;
+exports.InfoCardMessage = exports.InfoCardContent = exports.InfoCardTitle = exports.InfoCardHeader = exports.InfoCard = void 0;
 var InfoCardRoot_1 = require("./root/InfoCardRoot");
 Object.defineProperty(exports, "InfoCard", { enumerable: true, get: function () { return InfoCardRoot_1.InfoCard; } });
 Object.defineProperty(exports, "InfoCardHeader", { enumerable: true, get: function () { return InfoCardRoot_1.InfoCardHeader; } });
 Object.defineProperty(exports, "InfoCardTitle", { enumerable: true, get: function () { return InfoCardRoot_1.InfoCardTitle; } });
 Object.defineProperty(exports, "InfoCardContent", { enumerable: true, get: function () { return InfoCardRoot_1.InfoCardContent; } });
+Object.defineProperty(exports, "InfoCardMessage", { enumerable: true, get: function () { return InfoCardRoot_1.InfoCardMessage; } });
 //# sourceMappingURL=index.js.map

package/cjs/alert/info-card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/alert/info-card/index.ts"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AACb,oDAK6B;AAJ3B,wGAAA,QAAQ,OAAA;AACR,8GAAA,cAAc,OAAA;AACd,6GAAA,aAAa,OAAA;AACb,+GAAA,eAAe,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/alert/info-card/index.ts"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AACb,oDAM6B;AAL3B,wGAAA,QAAQ,OAAA;AACR,8GAAA,cAAc,OAAA;AACd,6GAAA,aAAa,OAAA;AACb,+GAAA,eAAe,OAAA;AACf,+GAAA,eAAe,OAAA"}

package/cjs/alert/info-card/message/InfoCardMessage.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+interface InfoCardMessageProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Icon to display in message.
+     */
+    icon: React.ReactNode;
+}
+/**
+ * A component for displaying informational messages.
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/infocard)
+ * @see 🏷️ {@link InfoCardMessageProps}
+ * @example
+ * ```jsx
+ * <InfoCard data-color="info">
+ *   <InfoCard.Message icon={<InformationSquareIcon aria-hidden />}>
+ *     Message contents
+ *   </InfoCard.Message>
+ * </InfoCard>
+ * ```
+ */
+declare const InfoCardMessage: React.ForwardRefExoticComponent<InfoCardMessageProps & React.RefAttributes<HTMLDivElement>>;
+export { InfoCardMessage };
+export type { InfoCardMessageProps };

package/cjs/alert/info-card/message/InfoCardMessage.js

@@ -0,0 +1,73 @@
+"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.InfoCardMessage = void 0;
+const react_1 = __importStar(require("react"));
+const typography_1 = require("../../../typography");
+const helpers_1 = require("../../../utils/helpers");
+const BaseAlertRoot_context_1 = require("../../base-alert/root/BaseAlertRoot.context");
+/**
+ * A component for displaying informational messages.
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/infocard)
+ * @see 🏷️ {@link InfoCardMessageProps}
+ * @example
+ * ```jsx
+ * <InfoCard data-color="info">
+ *   <InfoCard.Message icon={<InformationSquareIcon aria-hidden />}>
+ *     Message contents
+ *   </InfoCard.Message>
+ * </InfoCard>
+ * ```
+ */
+const InfoCardMessage = (0, react_1.forwardRef)((_a, forwardedRef) => {
+    var { children, className, icon } = _a, restProps = __rest(_a, ["children", "className", "icon"]);
+    const context = (0, BaseAlertRoot_context_1.useBaseAlert)();
+    return (react_1.default.createElement("div", Object.assign({ ref: forwardedRef, className: (0, helpers_1.cl)(className, "aksel-base-alert__message") }, restProps),
+        react_1.default.createElement("div", { className: "aksel-base-alert__icon" }, icon),
+        react_1.default.createElement(typography_1.BodyLong, { size: context.size, as: "div", textColor: "default" }, children)));
+});
+exports.InfoCardMessage = InfoCardMessage;
+//# sourceMappingURL=InfoCardMessage.js.map

package/cjs/alert/info-card/message/InfoCardMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoCardMessage.js","sourceRoot":"","sources":["../../../../src/alert/info-card/message/InfoCardMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,oDAA+C;AAC/C,oDAA4C;AAC5C,uFAA2E;AAS3E;;;;;;;;;;;;GAYG;AACH,MAAM,eAAe,GAAG,IAAA,kBAAU,EAChC,CACE,EAAiE,EACjE,YAAY,EACZ,EAAE;QAFF,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,OAAsC,EAAjC,SAAS,cAAzC,iCAA2C,CAAF;IAGzC,MAAM,OAAO,GAAG,IAAA,oCAAY,GAAE,CAAC;IAC/B,OAAO,CACL,qDACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,YAAE,EAAC,SAAS,EAAE,2BAA2B,CAAC,IACjD,SAAS;QAEb,uCAAK,SAAS,EAAC,wBAAwB,IAAE,IAAI,CAAO;QACpD,8BAAC,qBAAQ,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,SAAS,IACvD,QAAQ,CACA,CACP,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEO,0CAAe"}

package/cjs/alert/info-card/root/InfoCardRoot.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 import { BaseAlert } from "../../base-alert";
 import { InfoCardContent, type InfoCardContentProps } from "../content/InfoCardContent";
 import { InfoCardHeader, type InfoCardHeaderProps } from "../header/InfoCardHeader";
+import { InfoCardMessage, type InfoCardMessageProps } from "../message/InfoCardMessage";
 import { InfoCardTitle, type InfoCardTitleProps } from "../title/InfoCardTitle";
 type InfoCardProps = Omit<BaseAlert.RootProps, "type" | "global" | "status" | "as"> & {
     /**
@@ -55,6 +56,18 @@ interface InfoCardComponent extends React.ForwardRefExoticComponent<InfoCardProp
      * ```
      */
     Content: typeof InfoCardContent;
+    /**
+     * @see 🏷️ {@link InfoCardMessageProps}
+     * @example
+     * ```jsx
+     * <InfoCard data-color="info">
+     *   <InfoCard.Message icon={<InformationSquareIcon aria-hidden />}>
+     *     Message contents
+     *   </InfoCard.Message>
+     * </InfoCard>
+     * ```
+     */
+    Message: typeof InfoCardMessage;
 }
 /**
  * A component for displaying informational content in a card format.
@@ -72,5 +85,5 @@ interface InfoCardComponent extends React.ForwardRefExoticComponent<InfoCardProp
  */
 export declare const InfoCard: InfoCardComponent;
 export default InfoCard;
-export { InfoCardContent, InfoCardHeader, InfoCardTitle };
-export type { InfoCardProps, InfoCardHeaderProps, InfoCardTitleProps, InfoCardContentProps, };
+export { InfoCardContent, InfoCardHeader, InfoCardTitle, InfoCardMessage };
+export type { InfoCardProps, InfoCardHeaderProps, InfoCardTitleProps, InfoCardContentProps, InfoCardMessageProps, };

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

@@ -44,13 +44,15 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InfoCardTitle = exports.InfoCardHeader = exports.InfoCardContent = exports.InfoCard = void 0;
+exports.InfoCardMessage = exports.InfoCardTitle = exports.InfoCardHeader = exports.InfoCardContent = exports.InfoCard = void 0;
 const react_1 = __importStar(require("react"));
 const base_alert_1 = require("../../base-alert");
 const InfoCardContent_1 = require("../content/InfoCardContent");
 Object.defineProperty(exports, "InfoCardContent", { enumerable: true, get: function () { return InfoCardContent_1.InfoCardContent; } });
 const InfoCardHeader_1 = require("../header/InfoCardHeader");
 Object.defineProperty(exports, "InfoCardHeader", { enumerable: true, get: function () { return InfoCardHeader_1.InfoCardHeader; } });
+const InfoCardMessage_1 = require("../message/InfoCardMessage");
+Object.defineProperty(exports, "InfoCardMessage", { enumerable: true, get: function () { return InfoCardMessage_1.InfoCardMessage; } });
 const InfoCardTitle_1 = require("../title/InfoCardTitle");
 Object.defineProperty(exports, "InfoCardTitle", { enumerable: true, get: function () { return InfoCardTitle_1.InfoCardTitle; } });
 /**
@@ -74,5 +76,6 @@ exports.InfoCard = (0, react_1.forwardRef)((_a, forwardedRef) => {
 exports.InfoCard.Header = InfoCardHeader_1.InfoCardHeader;
 exports.InfoCard.Title = InfoCardTitle_1.InfoCardTitle;
 exports.InfoCard.Content = InfoCardContent_1.InfoCardContent;
+exports.InfoCard.Message = InfoCardMessage_1.InfoCardMessage;
 exports.default = exports.InfoCard;
 //# sourceMappingURL=InfoCardRoot.js.map

package/cjs/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,+CAA0C;AAC1C,iDAA6C;AAC7C,gEAGoC;AA8G3B,gGAhHP,iCAAe,OAgHO;AA7GxB,6DAGkC;AA0GR,+FA5GxB,+BAAc,OA4GwB;AAzGxC,0DAAgF;AAyGtC,8FAzGjC,6BAAa,OAyGiC;AAzCvD;;;;;;;;;;;;;GAaG;AACU,QAAA,QAAQ,GAAG,IAAA,kBAAU,EAChC,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,8BAAC,sBAAS,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,gBAAQ,CAAC,MAAM,GAAG,+BAAc,CAAC;AACjC,gBAAQ,CAAC,KAAK,GAAG,6BAAa,CAAC;AAC/B,gBAAQ,CAAC,OAAO,GAAG,iCAAe,CAAC;AAEnC,kBAAe,gBAAQ,CAAC"}
+{"version":3,"file":"InfoCardRoot.js","sourceRoot":"","sources":["../../../../src/alert/info-card/root/InfoCardRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAA6C;AAC7C,gEAGoC;AAgI3B,gGAlIP,iCAAe,OAkIO;AA/HxB,6DAGkC;AA4HR,+FA9HxB,+BAAc,OA8HwB;AA3HxC,gEAGoC;AAwHqB,gGA1HvD,iCAAe,OA0HuD;AAvHxE,0DAAgF;AAuHtC,8FAvHjC,6BAAa,OAuHiC;AA1CvD;;;;;;;;;;;;;GAaG;AACU,QAAA,QAAQ,GAAG,IAAA,kBAAU,EAChC,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,8BAAC,sBAAS,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,gBAAQ,CAAC,MAAM,GAAG,+BAAc,CAAC;AACjC,gBAAQ,CAAC,KAAK,GAAG,6BAAa,CAAC;AAC/B,gBAAQ,CAAC,OAAO,GAAG,iCAAe,CAAC;AACnC,gBAAQ,CAAC,OAAO,GAAG,iCAAe,CAAC;AAEnC,kBAAe,gBAAQ,CAAC"}

package/cjs/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/cjs/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataDragAndDropDragHandler = void 0;
+const react_1 = __importDefault(require("react"));
+const aksel_icons_1 = require("@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.
+ */
+exports.DataDragAndDropDragHandler = react_1.default.forwardRef(({ keyboardDragging, handleRef }) => {
+    return (react_1.default.createElement("div", { className: "aksel-data-drag-and-drop__drag-handler__alt" },
+        keyboardDragging && (react_1.default.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "up" },
+            react_1.default.createElement(aksel_icons_1.CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+        react_1.default.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+            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-drag-and-drop__drag-handler__arrow", "data-direction": "down" },
+            react_1.default.createElement(aksel_icons_1.CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+});
+//# sourceMappingURL=DataDragAndDropDragHandler.js.map

package/cjs/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,kDAA0B;AAC1B,qDAI6B;AAiB7B;;;;;GAKG;AACU,QAAA,0BAA0B,GAAG,eAAK,CAAC,UAAU,CAGxD,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,EAAE,EAAE;IACpC,OAAO,CACL,uCAAK,SAAS,EAAC,6CAA6C;QACzD,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,+CAA+C,oBAC1C,IAAI;YAEnB,8BAAC,mCAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;QACD,uCACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;YAE1D,8BAAC,8BAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE;QACL,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,+CAA+C,oBAC1C,MAAM;YAErB,8BAAC,qCAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

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

@@ -1,37 +1,4 @@
 "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)
@@ -43,15 +10,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 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 react_1 = __importDefault(require("react"));
 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
  *
@@ -64,26 +30,10 @@ const DataDragAndDrop_context_1 = require("../root/DataDragAndDrop.context");
  * ```
  */
 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";
+    // const context = useDataDragAndDropContext();
+    var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
     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", Object.assign({ ref: forwardedRef }, rest, { className: (0, helpers_1.cl)("aksel-data-table__drag-and-drop-item", className) }),
             react_1.default.createElement("div", null, children))));
 });
 exports.DataDragAndDropItem = DataDragAndDropItem;

package/cjs/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,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"}
+{"version":3,"file":"DataDragAndDropItem.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/item/DataDragAndDropItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,qDAAmD;AACnD,oDAA4C;AAc5C;;;;;;;;;;GAUG;AACH,MAAM,mBAAmB,GAAG,eAAK,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,8BAAC,cAAM,IAAC,GAAG,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,EAAE,OAAO;QAEvD,qDACE,GAAG,EAAE,YAAY,IACb,IAAI,IACR,SAAS,EAAE,IAAA,YAAE,EAAC,sCAAsC,EAAE,SAAS,CAAC;YAMhE,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

@@ -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/cjs/data/drag-and-drop/root/DataDragAndDrop.context.js

@@ -1,6 +1,10 @@
 "use strict";
+var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataDragAndDropContext = void 0;
-const react_1 = require("react");
-exports.DataDragAndDropContext = (0, react_1.createContext)(undefined);
+exports.useDataDragAndDropContext = exports.DataDragAndDropProvider = void 0;
+const helpers_1 = require("../../../utils/helpers");
+_a = (0, helpers_1.createStrictContext)({
+    errorMessage: "useDataDragAndDropContext must be used within a DataDragAndDropProvider",
+    name: "DataDragAndDropContext",
+}), exports.DataDragAndDropProvider = _a.Provider, exports.useDataDragAndDropContext = _a.useContext;
 //# sourceMappingURL=DataDragAndDrop.context.js.map

package/cjs/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,iCAAsC;AAMzB,QAAA,sBAAsB,GAAG,IAAA,qBAAa,EAEjD,SAAS,CAAC,CAAC"}
+{"version":3,"file":"DataDragAndDrop.context.js","sourceRoot":"","sources":["../../../../src/data/drag-and-drop/root/DataDragAndDrop.context.tsx"],"names":[],"mappings":";;;;AAAA,oDAA6D;AAMhD,KAGT,IAAA,6BAAmB,EAAyC;IAC9D,YAAY,EACV,yEAAyE;IAC3E,IAAI,EAAE,wBAAwB;CAC/B,CAAC,EANU,+BAAuB,gBACrB,iCAAyB,iBAKpC"}

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

@@ -1,10 +1,10 @@
 import React from "react";
 import DataDragAndDropItem, { DataDragAndDropItemProps } from "../item/DataDragAndDropItem";
-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/cjs/data/drag-and-drop/root/DataDragAndDropRoot.js

@@ -32,78 +32,28 @@ var __importStar = (this && this.__importStar) || (function () {
         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 react_1 = __importStar(require("react"));
 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;
-            }))));
+/**
+ * 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 = (0, react_1.forwardRef)(({ children }, forwardedRef) => {
+    return (react_1.default.createElement(DataDragAndDrop_context_1.DataDragAndDropProvider, { inputMethod: null },
+        react_1.default.createElement("div", { ref: forwardedRef }, children)));
 });
 exports.DataDragAndDrop = DataDragAndDrop;
 DataDragAndDrop.Item = DataDragAndDropItem_1.default;

package/cjs/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,+CAA0C;AAC1C,sFAEqC;AAgDX,8BAlDnB,6BAAmB,CAkDmB;AA/C7C,uEAAoE;AAwBpE;;;;;;;;;GASG;AAEH,MAAM,eAAe,GAAG,IAAA,kBAAU,EAChC,CAAC,EAAE,QAAQ,EAAE,EAAE,YAAY,EAAE,EAAE;IAC7B,OAAO,CACL,8BAAC,iDAAuB,IAAC,WAAW,EAAE,IAAI;QACxC,uCAAK,GAAG,EAAE,YAAY,IAAG,QAAQ,CAAO,CAChB,CAC3B,CAAC;AACJ,CAAC,CAC8B,CAAC;AAIzB,0CAAe;AAFxB,eAAe,CAAC,IAAI,GAAG,6BAAmB,CAAC;AAG3C,kBAAe,eAAe,CAAC"}

package/cjs/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/cjs/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataDragAndDropDragHandler = void 0;
+const react_1 = __importDefault(require("react"));
+const aksel_icons_1 = require("@navikt/aksel-icons");
+const Floating_1 = require("../../../utils/components/floating/Floating");
+/**
+ * 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.
+ */
+exports.DataDragAndDropDragHandler = react_1.default.forwardRef(({ keyboardDragging, handleRef, alt }) => {
+    if (alt) {
+        return (react_1.default.createElement("div", { className: "aksel-data-drag-and-drop__drag-handler__alt" },
+            keyboardDragging && (react_1.default.createElement("span", { className: "aksel-data-drag-and-drop__drag-handler__arrow", "data-direction": "up" },
+                react_1.default.createElement(aksel_icons_1.CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+            react_1.default.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+                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-drag-and-drop__drag-handler__arrow", "data-direction": "down" },
+                react_1.default.createElement(aksel_icons_1.CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+    }
+    return (react_1.default.createElement(Floating_1.Floating, null,
+        keyboardDragging && (react_1.default.createElement(Floating_1.Floating.Content, { side: "top", avoidCollisions: false, updatePositionStrategy: "always", className: "aksel-data-drag-and-drop__drag-handler__arrow" },
+            react_1.default.createElement(aksel_icons_1.CaretUpCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" }))),
+        react_1.default.createElement(Floating_1.Floating.Anchor, { asChild: true },
+            react_1.default.createElement("div", { ref: handleRef, className: "aksel-data-drag-and-drop__drag-handler__button" },
+                react_1.default.createElement(aksel_icons_1.DragVerticalIcon, { "aria-hidden": true, title: "Dra for \u00E5 flytte", fontSize: "1.5rem" }))),
+        keyboardDragging && (react_1.default.createElement(Floating_1.Floating.Content, { avoidCollisions: false, updatePositionStrategy: "always", className: "aksel-data-drag-and-drop__drag-handler__arrow" },
+            react_1.default.createElement(aksel_icons_1.CaretDownCircleFillIcon, { "aria-hidden": true, fontSize: "1.2rem" })))));
+});
+//# sourceMappingURL=DataDragAndDropDragHandler.js.map

package/cjs/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,kDAA0B;AAC1B,qDAI6B;AAC7B,0EAAuE;AAmBvE;;;;;GAKG;AACU,QAAA,0BAA0B,GAAG,eAAK,CAAC,UAAU,CAGxD,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,EAAE;IACzC,IAAI,GAAG,EAAE,CAAC;QACR,OAAO,CACL,uCAAK,SAAS,EAAC,6CAA6C;YACzD,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,+CAA+C,oBAC1C,IAAI;gBAEnB,8BAAC,mCAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CAClD,CACR;YACD,uCACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;gBAE1D,8BAAC,8BAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE;YACL,gBAAgB,IAAI,CACnB,wCACE,SAAS,EAAC,+CAA+C,oBAC1C,MAAM;gBAErB,8BAAC,qCAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACpD,CACR,CACG,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,8BAAC,mBAAQ;QACN,gBAAgB,IAAI,CACnB,8BAAC,mBAAQ,CAAC,OAAO,IACf,IAAI,EAAC,KAAK,EACV,eAAe,EAAE,KAAK,EACtB,sBAAsB,EAAC,QAAQ,EAC/B,SAAS,EAAC,+CAA+C;YAEzD,8BAAC,mCAAqB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACtC,CACpB;QACD,8BAAC,mBAAQ,CAAC,MAAM,IAAC,OAAO;YACtB,uCACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAC,gDAAgD;gBAE1D,8BAAC,8BAAgB,yBAEf,KAAK,EAAC,uBAAkB,EACxB,QAAQ,EAAC,QAAQ,GACjB,CACE,CACU;QACjB,gBAAgB,IAAI,CACnB,8BAAC,mBAAQ,CAAC,OAAO,IACf,eAAe,EAAE,KAAK,EACtB,sBAAsB,EAAC,QAAQ,EAC/B,SAAS,EAAC,+CAA+C;YAEzD,8BAAC,qCAAuB,yBAAa,QAAQ,EAAC,QAAQ,GAAG,CACxC,CACpB,CACQ,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC"}