@navikt/ds-react 0.17.14 → 0.17.17

package/cjs/index.js

@@ -37,6 +37,7 @@ __exportStar(require("./tag"), exports);
 __exportStar(require("./toggle-group"), exports);
 __exportStar(require("./table"), exports);
 __exportStar(require("./tabs"), exports);
+__exportStar(require("./tooltip"), exports);
 __exportStar(require("./typography"), exports);
 __exportStar(require("./util"), exports);
 /* Navno spesific packages */

package/cjs/read-more/ReadMore.js

@@ -50,7 +50,7 @@ const ReadMore = (0, react_1.forwardRef)((_a, ref) => {
         : react_collapse_1.UnmountClosed;
     const isOpened = open !== null && open !== void 0 ? open : internalOpen;
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("button", Object.assign({}, rest, { className: (0, classnames_1.default)("navds-read-more", "navds-body-short", "navds-body-short--small", className, {
+        react_1.default.createElement("button", Object.assign({ type: "button" }, rest, { className: (0, classnames_1.default)("navds-read-more", "navds-body-short", "navds-body-short--small", className, {
                 "navds-read-more--open": isOpened,
             }), onClick: (e) => {
                 if (open === undefined) {

package/cjs/table/ExpandableRow.js

@@ -0,0 +1,76 @@
+"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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __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 });
+const react_1 = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Row_1 = __importDefault(require("./Row"));
+const DataCell_1 = __importDefault(require("./DataCell"));
+const react_collapse_1 = require("react-collapse");
+const ds_icons_1 = require("@navikt/ds-icons");
+const __1 = require("..");
+const ExpandableRow = (0, react_1.forwardRef)((_a, ref) => {
+    var { className, children, content, togglePlacement = "left", defaultOpen = false, open, onOpenChange } = _a, rest = __rest(_a, ["className", "children", "content", "togglePlacement", "defaultOpen", "open", "onOpenChange"]);
+    const [internalOpen, setInternalOpen] = (0, react_1.useState)(defaultOpen);
+    const id = `expandable-${(0, __1.useId)()}`;
+    const isOpen = open !== null && open !== void 0 ? open : internalOpen;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Row_1.default, Object.assign({}, rest, { ref: ref, className: (0, classnames_1.default)("navds-table__expandable-row", className, {
+                "navds-table__expandable-row--open": isOpen,
+            }) }),
+            togglePlacement === "right" && children,
+            react_1.default.createElement(DataCell_1.default, { className: (0, classnames_1.default)("navds-table__toggle-expand-cell", {
+                    "navds-table__toggle-expand-cell--open": isOpen,
+                }) },
+                react_1.default.createElement("button", { className: "navds-table__toggle-expand-button", "aria-controls": id, "aria-expanded": isOpen, onClick: () => {
+                        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(!isOpen);
+                        if (open === undefined) {
+                            setInternalOpen((open) => !open);
+                        }
+                    } },
+                    react_1.default.createElement(ds_icons_1.Expand, { className: "navds-table__expandable-icon", title: isOpen ? "Vis mindre" : "Vis mer" }),
+                    react_1.default.createElement(ds_icons_1.ExpandFilled, { className: "navds-table__expandable-icon navds-table__expandable-icon--filled", title: isOpen ? "Vis mindre" : "Vis mer" }))),
+            togglePlacement === "left" && children),
+        react_1.default.createElement("tr", { className: "navds-table__expanded-row", "aria-hidden": !isOpen, id: id },
+            react_1.default.createElement("td", { colSpan: 999, className: "navds-table__expanded-row-cell" },
+                react_1.default.createElement(react_collapse_1.UnmountClosed, { isOpened: isOpen, theme: {
+                        collapse: "navds-table__expanded-row-collapse",
+                        content: "navds-table__expanded-row-content",
+                    } }, content)))));
+});
+exports.default = ExpandableRow;

package/cjs/table/Table.js

@@ -46,6 +46,7 @@ const Row_1 = __importDefault(require("./Row"));
 const ColumnHeader_1 = __importDefault(require("./ColumnHeader"));
 const HeaderCell_1 = __importDefault(require("./HeaderCell"));
 const DataCell_1 = __importDefault(require("./DataCell"));
+const ExpandableRow_1 = __importDefault(require("./ExpandableRow"));
 exports.TableContext = (0, react_1.createContext)(null);
 const Table = (0, react_1.forwardRef)((_a, ref) => {
     var { className, zebraStripes = false, size = "medium", onSortChange, sort } = _a, rest = __rest(_a, ["className", "zebraStripes", "size", "onSortChange", "sort"]);
@@ -60,4 +61,5 @@ Table.Row = Row_1.default;
 Table.ColumnHeader = ColumnHeader_1.default;
 Table.HeaderCell = HeaderCell_1.default;
 Table.DataCell = DataCell_1.default;
+Table.ExpandableRow = ExpandableRow_1.default;
 exports.default = Table;

package/cjs/tooltip/Tooltip.js

@@ -0,0 +1,153 @@
+"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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __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 });
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = __importStar(require("react"));
+const __1 = require("..");
+const react_dom_1 = require("@floating-ui/react-dom");
+const react_merge_refs_1 = __importDefault(require("react-merge-refs"));
+const portal_1 = __importDefault(require("./portal"));
+const util_1 = require("../util");
+const Tooltip = (0, react_1.forwardRef)((_a, ref) => {
+    var { children, className, arrow: _arrow = true, placement: _placement = "top", open, defaultOpen = false, offset: _offset, content, delay = 150, id, keys, maxChar = 80 } = _a, rest = __rest(_a, ["children", "className", "arrow", "placement", "open", "defaultOpen", "offset", "content", "delay", "id", "keys", "maxChar"]);
+    const arrowRef = (0, react_1.useRef)(null);
+    const [isOpen, setIsOpen] = (0, react_1.useState)(defaultOpen);
+    const openTimerRef = (0, react_1.useRef)(0);
+    const leaveTimerRef = (0, react_1.useRef)(0);
+    const isMouseDownRef = (0, react_1.useRef)(false);
+    const ariaId = (0, util_1.useId)(id);
+    const { x, y, update, placement, refs, middlewareData: { arrow: { x: arrowX, y: arrowY } = {}, hide: { referenceHidden } = {}, }, } = (0, react_dom_1.useFloating)({
+        placement: _placement,
+        middleware: [
+            (0, react_dom_1.shift)(),
+            (0, react_dom_1.flip)({ padding: 5, fallbackPlacements: ["bottom", "top"] }),
+            (0, react_dom_1.arrow)({ element: arrowRef, padding: 5 }),
+            (0, react_dom_1.hide)(),
+        ],
+    });
+    /* https://floating-ui.com/docs/react-dom#updating */
+    (0, react_1.useEffect)(() => {
+        if (!refs.reference.current || !refs.floating.current) {
+            return;
+        }
+        // Only call this when the floating element is rendered
+        return (0, react_dom_1.autoUpdate)(refs.reference.current, refs.floating.current, update);
+    }, [refs.reference, refs.floating, update, open, isOpen]);
+    const handleOpen = (0, react_1.useCallback)(() => {
+        window.clearTimeout(openTimerRef.current);
+        window.clearTimeout(leaveTimerRef.current);
+        setIsOpen(true);
+    }, [setIsOpen]);
+    const handleDelayedOpen = (0, react_1.useCallback)(() => {
+        window.clearTimeout(openTimerRef.current);
+        window.clearTimeout(leaveTimerRef.current);
+        openTimerRef.current = window.setTimeout(() => {
+            setIsOpen(true);
+        }, delay);
+    }, [delay, setIsOpen]);
+    const handleClose = (0, react_1.useCallback)(() => {
+        window.clearTimeout(openTimerRef.current);
+        leaveTimerRef.current = window.setTimeout(() => {
+            setIsOpen(false);
+        }, 50);
+    }, [setIsOpen]);
+    const handleMouseUp = (0, react_1.useCallback)(() => (isMouseDownRef.current = false), []);
+    (0, react_1.useEffect)(() => {
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+        return () => window.clearTimeout(openTimerRef.current);
+    }, []);
+    (0, react_1.useEffect)(() => {
+        return () => document.removeEventListener("mouseup", handleMouseUp);
+    }, [handleMouseUp]);
+    (0, __1.useEventListener)("keydown", (0, react_1.useCallback)((e) => e.key === "Escape" && handleClose(), [handleClose]), document);
+    /* https://floating-ui.com/docs/react-dom#stable-ref-prop */
+    const stableRef = (0, react_1.useMemo)(() => (0, react_merge_refs_1.default)([ref, refs.floating]), [
+        ref,
+        refs.floating,
+    ]);
+    if (!children ||
+        (children === null || children === void 0 ? void 0 : children.type) === react_1.default.Fragment ||
+        children === react_1.default.Fragment) {
+        console.error("<Tooltip> children needs to be a single ReactElement and not <React.Fragment/>/<></>");
+        return null;
+    }
+    if ((content === null || content === void 0 ? void 0 : content.length) > maxChar) {
+        console.error(`Because of strict accessibility concers we encourage all Tooltips to have less than 80 characters. Can be overwritten with the maxChar-prop`);
+        return null;
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        (0, react_1.cloneElement)(children, Object.assign(Object.assign({}, children.props), { "aria-describedby": open || isOpen
+                ? (0, classnames_1.default)(ariaId, children === null || children === void 0 ? void 0 : children.props["aria-describedby"])
+                : children === null || children === void 0 ? void 0 : children.props["aria-describedby"], ref: (0, react_merge_refs_1.default)([children.ref, refs.reference]), onMouseEnter: (0, __1.composeEventHandlers)(children.props.onMouseEnter, handleDelayedOpen), onMouseLeave: (0, __1.composeEventHandlers)(children.props.onMouseLeave, handleClose), onMouseDown: (0, __1.composeEventHandlers)(children.props.onMouseDown, () => {
+                isMouseDownRef.current = true;
+                document.addEventListener("mouseup", handleMouseUp, { once: true });
+            }), onFocus: (0, __1.composeEventHandlers)(children.props.onFocus, () => !isMouseDownRef.current && handleOpen()), onBlur: (0, __1.composeEventHandlers)(children.props.onBlur, handleClose) })),
+        (open !== null && open !== void 0 ? open : isOpen) && (react_1.default.createElement(portal_1.default, null,
+            react_1.default.createElement("div", Object.assign({ ref: stableRef }, rest, { onMouseEnter: handleOpen, onMouseLeave: handleClose, role: "tooltip", id: ariaId, style: {
+                    position: "absolute",
+                    top: y !== null && y !== void 0 ? y : "",
+                    left: x !== null && x !== void 0 ? x : "",
+                    visibility: referenceHidden ? "hidden" : "visible",
+                }, "data-side": placement, className: (0, classnames_1.default)("navds-tooltip", "navds-detail navds-detail--small", className) }),
+                react_1.default.createElement("div", { className: "navds-tooltip__inner", style: {
+                        [{
+                            top: "marginBottom",
+                            right: "marginLeft",
+                            bottom: "marginTop",
+                            left: "marginRight",
+                        }[placement]]: _offset ? _offset : _arrow ? 10 : 2,
+                    } },
+                    content,
+                    keys && (react_1.default.createElement("span", { className: "navds-tooltip__keys" }, keys.map((key) => (react_1.default.createElement(__1.Detail, { size: "small", as: "kbd", key: key, className: "navds-tooltip__key" }, key))))),
+                    _arrow && (react_1.default.createElement("div", { ref: (node) => {
+                            arrowRef.current = node;
+                        }, className: "navds-tooltip__arrow", style: {
+                            left: arrowX != null ? `${arrowX}px` : "",
+                            top: arrowY != null ? `${arrowY}px` : "",
+                            right: "",
+                            bottom: "",
+                            [{
+                                top: "bottom",
+                                right: "left",
+                                bottom: "top",
+                                left: "right",
+                            }[placement]]: "-3.5px",
+                        } }))))))));
+});
+exports.default = Tooltip;

package/cjs/tooltip/index.js

@@ -0,0 +1,23 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tooltip = void 0;
+var Tooltip_1 = require("./Tooltip");
+Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } });
+__exportStar(require("./Tooltip"), exports);

package/cjs/tooltip/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "main": "./index.js",
+  "module": "../../esm/tooltip/index.js",
+  "types": "../../esm/tooltip/index.d.ts"
+}

package/cjs/tooltip/portal.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/* https://github.com/radix-ui/primitives/blob/main/packages/react/portal/src/Portal.tsx */
+const react_dom_1 = __importDefault(require("react-dom"));
+const Portal = ({ children }) => {
+    var _a;
+    const hostElement = (_a = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) === null || _a === void 0 ? void 0 : _a.body;
+    if (hostElement) {
+        return react_dom_1.default.createPortal(children, hostElement);
+    }
+    // bail out of ssr
+    return null;
+};
+exports.default = Portal;

package/cjs/util/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useEventListener = exports.omit = void 0;
+exports.composeEventHandlers = exports.useEventListener = exports.omit = void 0;
 const react_1 = require("react");
 __exportStar(require("./OverridableComponent"), exports);
 __exportStar(require("./useId"), exports);
@@ -35,3 +35,13 @@ const useEventListener = (name, handler, target = window) => {
     }, [name, handler, target]);
 };
 exports.useEventListener = useEventListener;
+/* https://github.com/radix-ui/primitives/blob/main/packages/core/primitive/src/primitive.tsx */
+const composeEventHandlers = (originalEventHandler, ourEventHandler) => {
+    return function handleEvent(event) {
+        originalEventHandler === null || originalEventHandler === void 0 ? void 0 : originalEventHandler(event);
+        if (!event.defaultPrevented) {
+            return ourEventHandler === null || ourEventHandler === void 0 ? void 0 : ourEventHandler(event);
+        }
+    };
+};
+exports.composeEventHandlers = composeEventHandlers;

package/esm/index.d.ts

@@ -21,6 +21,7 @@ export * from "./tag";
 export * from "./toggle-group";
 export * from "./table";
 export * from "./tabs";
+export * from "./tooltip";
 export * from "./typography";
 export * from "./util";
 export * from "./card";

package/esm/index.js

@@ -21,6 +21,7 @@ export * from "./tag";
 export * from "./toggle-group";
 export * from "./table";
 export * from "./tabs";
+export * from "./tooltip";
 export * from "./typography";
 export * from "./util";
 /* Navno spesific packages */

package/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AAEvB,6BAA6B;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AAEvB,6BAA6B;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC"}

package/esm/read-more/ReadMore.js

@@ -22,7 +22,7 @@ const ReadMore = forwardRef((_a, ref) => {
         : UnmountClosed;
     const isOpened = open !== null && open !== void 0 ? open : internalOpen;
     return (React.createElement(React.Fragment, null,
-        React.createElement("button", Object.assign({}, rest, { className: cl("navds-read-more", "navds-body-short", "navds-body-short--small", className, {
+        React.createElement("button", Object.assign({ type: "button" }, rest, { className: cl("navds-read-more", "navds-body-short", "navds-body-short--small", className, {
                 "navds-read-more--open": isOpened,
             }), onClick: (e) => {
                 if (open === undefined) {

package/esm/read-more/ReadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReadMore.js","sourceRoot":"","sources":["../../src/read-more/ReadMore.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AA6BzC,MAAM,QAAQ,GAAG,UAAU,CACzB,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,SAAS,EACT,MAAM,EACN,uBAAuB,GAAG,KAAK,EAC/B,QAAQ,EACR,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,OAER,EADI,IAAI,cART,gGASC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,iBAAiB,GAAG,uBAAuB;QAC/C,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY,CAAC;IAEtC,OAAO,CACL;QACE,gDACM,IAAI,IACR,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,kBAAkB,EAClB,yBAAyB,EACzB,SAAS,EACT;gBACE,uBAAuB,EAAE,QAAQ;aAClC,CACF,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,IAAI,KAAK,SAAS,EAAE;oBACtB,eAAe,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;iBACtC;gBACD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;YACf,CAAC,mBACc,QAAQ,EACvB,GAAG,EAAE,GAAG;YAER,oBAAC,MAAM,IAAC,SAAS,EAAC,8BAA8B,wBAAe;YAC/D,kCAAO,MAAM,CAAQ,CACd;QACT,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ;YACnC,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,oBAAC,QAAQ,IAAC,IAAI,EAAC,OAAO,IAAE,QAAQ,CAAY,CACxC,CACY,CACnB,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ReadMore.js","sourceRoot":"","sources":["../../src/read-more/ReadMore.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AA6BzC,MAAM,QAAQ,GAAG,UAAU,CACzB,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,SAAS,EACT,MAAM,EACN,uBAAuB,GAAG,KAAK,EAC/B,QAAQ,EACR,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,OAER,EADI,IAAI,cART,gGASC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,iBAAiB,GAAG,uBAAuB;QAC/C,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY,CAAC;IAEtC,OAAO,CACL;QACE,8CACE,IAAI,EAAC,QAAQ,IACT,IAAI,IACR,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,kBAAkB,EAClB,yBAAyB,EACzB,SAAS,EACT;gBACE,uBAAuB,EAAE,QAAQ;aAClC,CACF,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,IAAI,IAAI,KAAK,SAAS,EAAE;oBACtB,eAAe,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;iBACtC;gBACD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;YACf,CAAC,mBACc,QAAQ,EACvB,GAAG,EAAE,GAAG;YAER,oBAAC,MAAM,IAAC,SAAS,EAAC,8BAA8B,wBAAe;YAC/D,kCAAO,MAAM,CAAQ,CACd;QACT,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ;YACnC,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,oBAAC,QAAQ,IAAC,IAAI,EAAC,OAAO,IAAE,QAAQ,CAAY,CACxC,CACY,CACnB,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/esm/table/ExpandableRow.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import { RowProps } from "./Row";
+interface ExpandableRowProps extends RowProps {
+    /**
+     * Content of the expanded row
+     */
+    content: React.ReactNode;
+    /**
+     * Placement of toggle button
+     * @default "left"
+     */
+    togglePlacement?: "left" | "right";
+    /**
+     * Opens component if 'true', closes if 'false'
+     * Using this props removes automatic control of open-state
+     */
+    open?: boolean;
+    /**
+     * Opened state default
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * Change handler for open
+     */
+    onOpenChange?: (open: boolean) => void;
+}
+export interface ExpandableRowType extends React.ForwardRefExoticComponent<ExpandableRowProps & React.RefAttributes<HTMLTableRowElement>> {
+}
+declare const ExpandableRow: ExpandableRowType;
+export default ExpandableRow;

package/esm/table/ExpandableRow.js

@@ -0,0 +1,49 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { forwardRef, useState } from "react";
+import cl from "classnames";
+import Row from "./Row";
+import DataCell from "./DataCell";
+import { UnmountClosed } from "react-collapse";
+import { Expand, ExpandFilled } from "@navikt/ds-icons";
+import { useId } from "..";
+const ExpandableRow = forwardRef((_a, ref) => {
+    var { className, children, content, togglePlacement = "left", defaultOpen = false, open, onOpenChange } = _a, rest = __rest(_a, ["className", "children", "content", "togglePlacement", "defaultOpen", "open", "onOpenChange"]);
+    const [internalOpen, setInternalOpen] = useState(defaultOpen);
+    const id = `expandable-${useId()}`;
+    const isOpen = open !== null && open !== void 0 ? open : internalOpen;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Row, Object.assign({}, rest, { ref: ref, className: cl("navds-table__expandable-row", className, {
+                "navds-table__expandable-row--open": isOpen,
+            }) }),
+            togglePlacement === "right" && children,
+            React.createElement(DataCell, { className: cl("navds-table__toggle-expand-cell", {
+                    "navds-table__toggle-expand-cell--open": isOpen,
+                }) },
+                React.createElement("button", { className: "navds-table__toggle-expand-button", "aria-controls": id, "aria-expanded": isOpen, onClick: () => {
+                        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(!isOpen);
+                        if (open === undefined) {
+                            setInternalOpen((open) => !open);
+                        }
+                    } },
+                    React.createElement(Expand, { className: "navds-table__expandable-icon", title: isOpen ? "Vis mindre" : "Vis mer" }),
+                    React.createElement(ExpandFilled, { className: "navds-table__expandable-icon navds-table__expandable-icon--filled", title: isOpen ? "Vis mindre" : "Vis mer" }))),
+            togglePlacement === "left" && children),
+        React.createElement("tr", { className: "navds-table__expanded-row", "aria-hidden": !isOpen, id: id },
+            React.createElement("td", { colSpan: 999, className: "navds-table__expanded-row-cell" },
+                React.createElement(UnmountClosed, { isOpened: isOpen, theme: {
+                        collapse: "navds-table__expanded-row-collapse",
+                        content: "navds-table__expanded-row-content",
+                    } }, content)))));
+});
+export default ExpandableRow;
+//# sourceMappingURL=ExpandableRow.js.map

package/esm/table/ExpandableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandableRow.js","sourceRoot":"","sources":["../../src/table/ExpandableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,GAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AAiC3B,MAAM,aAAa,GAAsB,UAAU,CACjD,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,SAAS,EACT,QAAQ,EACR,OAAO,EACP,eAAe,GAAG,MAAM,EACxB,WAAW,GAAG,KAAK,EACnB,IAAI,EACJ,YAAY,OAEb,EADI,IAAI,cART,8FASC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,EAAE,GAAG,cAAc,KAAK,EAAE,EAAE,CAAC;IAEnC,MAAM,MAAM,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY,CAAC;IAEpC,OAAO,CACL;QACE,oBAAC,GAAG,oBACE,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE,SAAS,EAAE;gBACtD,mCAAmC,EAAE,MAAM;aAC5C,CAAC;YAED,eAAe,KAAK,OAAO,IAAI,QAAQ;YACxC,oBAAC,QAAQ,IACP,SAAS,EAAE,EAAE,CAAC,iCAAiC,EAAE;oBAC/C,uCAAuC,EAAE,MAAM;iBAChD,CAAC;gBAEF,gCACE,SAAS,EAAC,mCAAmC,mBAC9B,EAAE,mBACF,MAAM,EACrB,OAAO,EAAE,GAAG,EAAE;wBACZ,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,CAAC,MAAM,CAAC,CAAC;wBACxB,IAAI,IAAI,KAAK,SAAS,EAAE;4BACtB,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;yBAClC;oBACH,CAAC;oBAED,oBAAC,MAAM,IACL,SAAS,EAAC,8BAA8B,EACxC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,GACxC;oBACF,oBAAC,YAAY,IACX,SAAS,EAAC,mEAAmE,EAC7E,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,GACxC,CACK,CACA;YACV,eAAe,KAAK,MAAM,IAAI,QAAQ,CACnC;QACN,4BAAI,SAAS,EAAC,2BAA2B,iBAAc,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE;YACpE,4BAAI,OAAO,EAAE,GAAG,EAAE,SAAS,EAAC,gCAAgC;gBAC1D,oBAAC,aAAa,IACZ,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE;wBACL,QAAQ,EAAE,oCAAoC;wBAC9C,OAAO,EAAE,mCAAmC;qBAC7C,IAEA,OAAO,CACM,CACb,CACF,CACJ,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/esm/table/Row.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
+export interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
     /**
      * Row is selected
      * @default false

package/esm/table/Table.d.ts

@@ -5,6 +5,7 @@ import { RowType } from "./Row";
 import { ColumnHeaderType } from "./ColumnHeader";
 import { HeaderCellType } from "./HeaderCell";
 import { DataCellType } from "./DataCell";
+import { ExpandableRowType } from "./ExpandableRow";
 export interface SortState {
     orderBy: string;
     direction: "ascending" | "descending";
@@ -36,6 +37,7 @@ export interface TableType extends React.ForwardRefExoticComponent<TableProps &
     DataCell: DataCellType;
     HeaderCell: HeaderCellType;
     ColumnHeader: ColumnHeaderType;
+    ExpandableRow: ExpandableRowType;
 }
 export interface TableContextProps {
     size: "medium" | "small";

package/esm/table/Table.js

@@ -17,6 +17,7 @@ import Row from "./Row";
 import ColumnHeader from "./ColumnHeader";
 import HeaderCell from "./HeaderCell";
 import DataCell from "./DataCell";
+import ExpandableRow from "./ExpandableRow";
 export const TableContext = createContext(null);
 const Table = forwardRef((_a, ref) => {
     var { className, zebraStripes = false, size = "medium", onSortChange, sort } = _a, rest = __rest(_a, ["className", "zebraStripes", "size", "onSortChange", "sort"]);
@@ -31,5 +32,6 @@ Table.Row = Row;
 Table.ColumnHeader = ColumnHeader;
 Table.HeaderCell = HeaderCell;
 Table.DataCell = DataCell;
+Table.ExpandableRow = ExpandableRow;
 export default Table;
 //# sourceMappingURL=Table.js.map

package/esm/table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../src/table/Table.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,MAAsB,MAAM,UAAU,CAAC;AAC9C,OAAO,IAAkB,MAAM,QAAQ,CAAC;AACxC,OAAO,GAAgB,MAAM,OAAO,CAAC;AACrC,OAAO,YAAkC,MAAM,gBAAgB,CAAC;AAChE,OAAO,UAA8B,MAAM,cAAc,CAAC;AAC1D,OAAO,QAA0B,MAAM,YAAY,CAAC;AA+CpD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAA2B,IAAI,CAAC,CAAC;AAE1E,MAAM,KAAK,GAAG,UAAU,CACtB,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,SAAS,EACT,YAAY,GAAG,KAAK,EACpB,IAAI,GAAG,QAAQ,EACf,YAAY,EACZ,IAAI,OAEL,EADI,IAAI,cANT,6DAOC,CADQ;IAGN,OAAA,CACH,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE;QACxD,+CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,gBAAgB,IAAI,EAAE,EAAE,SAAS,EAAE;gBAC9D,4BAA4B,EAAE,YAAY;aAC3C,CAAC,IACF,CACoB,CACzB,CAAA;CAAA,CACW,CAAC;AAEf,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;AACtB,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;AAClB,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;AAChB,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;AAClC,KAAK,CAAC,UAAU,GAAG,UAAU,CAAC;AAC9B,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAE1B,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../src/table/Table.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,MAAsB,MAAM,UAAU,CAAC;AAC9C,OAAO,IAAkB,MAAM,QAAQ,CAAC;AACxC,OAAO,GAAgB,MAAM,OAAO,CAAC;AACrC,OAAO,YAAkC,MAAM,gBAAgB,CAAC;AAChE,OAAO,UAA8B,MAAM,cAAc,CAAC;AAC1D,OAAO,QAA0B,MAAM,YAAY,CAAC;AACpD,OAAO,aAAoC,MAAM,iBAAiB,CAAC;AAgDnE,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAA2B,IAAI,CAAC,CAAC;AAE1E,MAAM,KAAK,GAAG,UAAU,CACtB,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,SAAS,EACT,YAAY,GAAG,KAAK,EACpB,IAAI,GAAG,QAAQ,EACf,YAAY,EACZ,IAAI,OAEL,EADI,IAAI,cANT,6DAOC,CADQ;IAGN,OAAA,CACH,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE;QACxD,+CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,gBAAgB,IAAI,EAAE,EAAE,SAAS,EAAE;gBAC9D,4BAA4B,EAAE,YAAY;aAC3C,CAAC,IACF,CACoB,CACzB,CAAA;CAAA,CACW,CAAC;AAEf,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;AACtB,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;AAClB,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;AAChB,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;AAClC,KAAK,CAAC,UAAU,GAAG,UAAU,CAAC;AAC9B,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAC1B,KAAK,CAAC,aAAa,GAAG,aAAa,CAAC;AAEpC,eAAe,KAAK,CAAC"}

package/esm/tooltip/Tooltip.d.ts

@@ -0,0 +1,51 @@
+import React, { HTMLAttributes } from "react";
+export interface TooltipProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Element tooltip anchors to
+     */
+    children: React.ReactElement & React.RefAttributes<HTMLElement>;
+    /**
+     * Open state for contolled tooltip
+     */
+    open?: boolean;
+    /**
+     * Tells tooltip to start in open state
+     * @note "open"-prop overwrites this
+     */
+    defaultOpen?: boolean;
+    /**
+     * Orientation for tooltip
+     * @default "top"
+     */
+    placement?: "top" | "right" | "bottom" | "left";
+    /**
+     *  Toggles rendering of arrow
+     *  @default true
+     */
+    arrow?: boolean;
+    /**
+     * Distance from anchor to tooltip
+     * @default 10px with arrow, 2px without arrow
+     */
+    offset?: number;
+    /**
+     * Content shown in tooltip
+     */
+    content: string;
+    /**
+     * Sets max allowed character length
+     * @default 80
+     */
+    maxChar?: number;
+    /**
+     * Adds a delay in milliseconds before opening tooltip
+     * @default 300
+     */
+    delay?: number;
+    /**
+     * List of Keyboard-keys for shortcuts
+     */
+    keys?: string[];
+}
+declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
+export default Tooltip;