@navikt/ds-react 0.7.4 → 0.8.0

package/cjs/typography/index.js

@@ -1,14 +1,18 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-var Title_1 = require("./Title");
-Object.defineProperty(exports, "Title", { enumerable: true, get: function () { return Title_1.default; } });
+exports.Label = exports.Detail = exports.BodyShort = exports.BodyLong = exports.Ingress = exports.Heading = void 0;
+var Heading_1 = require("./Heading");
+Object.defineProperty(exports, "Heading", { enumerable: true, get: function () { return __importDefault(Heading_1).default; } });
 var Ingress_1 = require("./Ingress");
-Object.defineProperty(exports, "Ingress", { enumerable: true, get: function () { return Ingress_1.default; } });
+Object.defineProperty(exports, "Ingress", { enumerable: true, get: function () { return __importDefault(Ingress_1).default; } });
 var BodyLong_1 = require("./BodyLong");
-Object.defineProperty(exports, "BodyLong", { enumerable: true, get: function () { return BodyLong_1.default; } });
+Object.defineProperty(exports, "BodyLong", { enumerable: true, get: function () { return __importDefault(BodyLong_1).default; } });
 var BodyShort_1 = require("./BodyShort");
-Object.defineProperty(exports, "BodyShort", { enumerable: true, get: function () { return BodyShort_1.default; } });
+Object.defineProperty(exports, "BodyShort", { enumerable: true, get: function () { return __importDefault(BodyShort_1).default; } });
 var Detail_1 = require("./Detail");
-Object.defineProperty(exports, "Detail", { enumerable: true, get: function () { return Detail_1.default; } });
+Object.defineProperty(exports, "Detail", { enumerable: true, get: function () { return __importDefault(Detail_1).default; } });
 var Label_1 = require("./Label");
-Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return Label_1.default; } });
+Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return __importDefault(Label_1).default; } });

package/cjs/util/index.js

@@ -7,12 +7,13 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    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.omit = void 0;
 __exportStar(require("./OverridableComponent"), exports);
 __exportStar(require("./useId"), exports);
-exports.omit = (obj, props) => Object.entries(obj)
+const omit = (obj, props) => Object.entries(obj)
     .filter(([key]) => !props.includes(key))
     .reduce((obj, [key, value]) => (Object.assign(Object.assign({}, obj), { [key]: value })), {});
+exports.omit = omit;

package/cjs/util/useId.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useId = void 0;
+exports.useId = exports.useClientLayoutEffect = void 0;
 const react_1 = require("react");
 const short_uuid_1 = __importDefault(require("short-uuid"));
 const canUseDOM = () => {
@@ -11,12 +11,13 @@ const canUseDOM = () => {
         typeof window.document !== "undefined" &&
         typeof window.document.createElement !== "undefined");
 };
-const useClientLayoutEffect = canUseDOM() ? react_1.useLayoutEffect : () => { };
-exports.useId = (id) => {
+exports.useClientLayoutEffect = canUseDOM() ? react_1.useLayoutEffect : () => { };
+const useId = (id) => {
     var _a;
     const [newId, setNewId] = react_1.useState(undefined);
-    useClientLayoutEffect(() => {
+    exports.useClientLayoutEffect(() => {
         setNewId(short_uuid_1.default.generate());
     }, []);
     return (_a = id !== null && id !== void 0 ? id : newId) !== null && _a !== void 0 ? _a : "";
 };
+exports.useId = useId;

package/esm/accordion/Accordion.d.ts

@@ -1,28 +1,17 @@
 import React from "react";
-export interface AccordionProps extends React.HTMLAttributes<HTMLButtonElement> {
+import { AccordionItemType } from "./AccordionItem";
+import { AccordionContentType } from "./AccordionContent";
+import { AccordionHeaderType } from "./AccordionHeader";
+interface AccordionComponent extends React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>> {
+    Item: AccordionItemType;
+    Header: AccordionHeaderType;
+    Content: AccordionContentType;
+}
+export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
-     * Component content
+     * Content inside accordion
      */
     children: React.ReactNode;
-    /**
-     * Content on interactive surface of component
-     */
-    heading: React.ReactNode;
-    /**
-     * Opens component if 'true', closes if 'false'
-     * Using this props removes automatic control of open-state
-     * @default false
-     */
-    open?: boolean;
-    /**
-     * Callback for when user interacts with component
-     */
-    onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
-    /**
-     * Removes content-element from dom when closed
-     * @default false
-     */
-    renderContentWhenClosed?: boolean;
 }
-declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Accordion: AccordionComponent;
 export default Accordion;

package/esm/accordion/Accordion.js

@@ -9,33 +9,17 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { forwardRef, useEffect, useState } from "react";
 import cl from "classnames";
-import { UnmountClosed, Collapse } from "react-collapse";
-import { Expand, ExpandFilled } from "@navikt/ds-icons";
-import { useId } from "..";
+import React, { forwardRef } from "react";
+import AccordionItem from "./AccordionItem";
+import AccordionContent from "./AccordionContent";
+import AccordionHeader from "./AccordionHeader";
 const Accordion = forwardRef((_a, ref) => {
-    var { children, heading, open = false, className, renderContentWhenClosed = false, onClick, id } = _a, rest = __rest(_a, ["children", "heading", "open", "className", "renderContentWhenClosed", "onClick", "id"]);
-    const [internalOpen, setInternalOpen] = useState(open);
-    const buttonId = useId(id);
-    const contentId = useId();
-    useEffect(() => {
-        setInternalOpen(open);
-    }, [open]);
-    const CollapseComponent = renderContentWhenClosed
-        ? Collapse
-        : UnmountClosed;
-    return (React.createElement("div", { className: cl("navds-accordion", className, {
-            "navds-accordion--open": internalOpen,
-            "navds-accordion--closed": !internalOpen,
-        }) },
-        React.createElement("button", Object.assign({ ref: ref, id: buttonId, className: "navds-accordion__button", "aria-expanded": open, "aria-controls": contentId, onClick: onClick ? onClick : () => setInternalOpen((open) => !open) }, rest),
-            React.createElement("span", { className: "navds-accordion__heading navds-title navds-title--s" }, heading),
-            React.createElement(Expand, { focusable: "false", role: "img", className: cl("navds-accordion__chevron", `navds-accordion__chevron--${internalOpen ? "up" : "down"}`) }),
-            React.createElement(ExpandFilled, { focusable: "false", role: "img", className: cl("navds-accordion__chevron", "navds-accordion__chevron--filled", `navds-accordion__chevron--${internalOpen ? "up" : "down"}`) })),
-        React.createElement("div", { id: contentId, role: "region", "aria-labelledby": buttonId },
-            React.createElement(CollapseComponent, { isOpened: internalOpen },
-                React.createElement("div", { className: "navds-accordion__content" }, children)))));
+    var { className } = _a, rest = __rest(_a, ["className"]);
+    return (React.createElement("div", Object.assign({}, rest, { className: cl("navds-accordion", className), ref: ref })));
 });
+Accordion.Header = AccordionHeader;
+Accordion.Content = AccordionContent;
+Accordion.Item = AccordionItem;
 export default Accordion;
 //# sourceMappingURL=Accordion.js.map

package/esm/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AA6B3B,MAAM,SAAS,GAAG,UAAU,CAC1B,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,KAAK,EACZ,SAAS,EACT,uBAAuB,GAAG,KAAK,EAC/B,OAAO,EACP,EAAE,OAEH,EADI,IAAI,cART,wFASC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,IAAI,CAAC,CAAC;IAEhE,MAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;IAC3B,MAAM,SAAS,GAAG,KAAK,EAAE,CAAC;IAE1B,SAAS,CAAC,GAAG,EAAE;QACb,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,iBAAiB,GAAG,uBAAuB;QAC/C,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,EAAE;YAC1C,uBAAuB,EAAE,YAAY;YACrC,yBAAyB,EAAE,CAAC,YAAY;SACzC,CAAC;QAEF,8CACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,QAAQ,EACZ,SAAS,EAAC,yBAAyB,mBACpB,IAAI,mBACJ,SAAS,EACxB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAC/D,IAAI;YAER,8BAAM,SAAS,EAAC,qDAAqD,IAClE,OAAO,CACH;YACP,oBAAC,MAAM,IACL,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,EAAE,CACX,0BAA0B,EAC1B,6BAA6B,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,CAC5D,GACD;YACF,oBAAC,YAAY,IACX,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,EAAE,CACX,0BAA0B,EAC1B,kCAAkC,EAClC,6BAA6B,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,CAC5D,GACD,CACK;QACT,6BAAK,EAAE,EAAE,SAAS,EAAE,IAAI,EAAC,QAAQ,qBAAkB,QAAQ;YACzD,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,YAAY;gBACvC,6BAAK,SAAS,EAAC,0BAA0B,IAAE,QAAQ,CAAO,CACxC,CAChB,CACF,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,aAAoC,MAAM,iBAAiB,CAAC;AACnE,OAAO,gBAA0C,MAAM,oBAAoB,CAAC;AAC5E,OAAO,eAAwC,MAAM,mBAAmB,CAAC;AAkBzE,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,EAAsB,EAAE,GAAG,EAAE,EAAE;QAA/B,EAAE,SAAS,OAAW,EAAN,IAAI,cAApB,aAAsB,CAAF;IAAY,OAAA,CAC/B,6CAAS,IAAI,IAAE,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,GAAG,IAAI,CACzE,CAAA;CAAA,CACoB,CAAC;AAExB,SAAS,CAAC,MAAM,GAAG,eAAe,CAAC;AACnC,SAAS,CAAC,OAAO,GAAG,gBAAgB,CAAC;AACrC,SAAS,CAAC,IAAI,GAAG,aAAa,CAAC;AAE/B,eAAe,SAAS,CAAC"}

package/esm/accordion/AccordionContent.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface AccordionContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Accordion panel content
+     */
+    children: React.ReactNode;
+}
+export declare type AccordionContentType = React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionContent: AccordionContentType;
+export default AccordionContent;

package/esm/accordion/AccordionContent.js

@@ -0,0 +1,37 @@
+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 cl from "classnames";
+import React, { forwardRef, useContext } from "react";
+import { Collapse, UnmountClosed } from "react-collapse";
+import { useClientLayoutEffect, useId } from "../util";
+import { AccordionItemContext } from "./AccordionItem";
+const AccordionContent = forwardRef((_a, ref) => {
+    var { children, className, id } = _a, rest = __rest(_a, ["children", "className", "id"]);
+    const context = useContext(AccordionItemContext);
+    const newId = useId(id);
+    const setContentId = context && context.setContentId;
+    useClientLayoutEffect(() => {
+        setContentId && setContentId(id ? newId : `accordionContent-${newId}`);
+    }, [setContentId, newId]);
+    if (context === null) {
+        console.error("<Accordion.Content> has to be used within an <Accordion.Item>");
+        return null;
+    }
+    const CollapseComponent = context.renderContentWhenClosed
+        ? Collapse
+        : UnmountClosed;
+    return (React.createElement("div", Object.assign({ ref: ref, id: context.contentId, role: "region", "aria-labelledby": context.buttonId }, rest),
+        React.createElement(CollapseComponent, { isOpened: context.open },
+            React.createElement("div", { className: cl("navds-accordion__content", className) }, children))));
+});
+export default AccordionContent;
+//# sourceMappingURL=AccordionContent.js.map

package/esm/accordion/AccordionContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionContent.js","sourceRoot":"","sources":["../../src/accordion/AccordionContent.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAcvD,MAAM,gBAAgB,GAAyB,UAAU,CACvD,CAAC,EAAoC,EAAE,GAAG,EAAE,EAAE;QAA7C,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,OAAW,EAAN,IAAI,cAAlC,+BAAoC,CAAF;IACjC,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEjD,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;IACxB,MAAM,YAAY,GAAG,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC;IAErD,qBAAqB,CAAC,GAAG,EAAE;QACzB,YAAY,IAAI,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,oBAAoB,KAAK,EAAE,CAAC,CAAC;IACzE,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC;IAE1B,IAAI,OAAO,KAAK,IAAI,EAAE;QACpB,OAAO,CAAC,KAAK,CACX,+DAA+D,CAChE,CAAC;QACF,OAAO,IAAI,CAAC;KACb;IAED,MAAM,iBAAiB,GAAG,OAAO,CAAC,uBAAuB;QACvD,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,OAAO,CAAC,SAAS,EACrB,IAAI,EAAC,QAAQ,qBACI,OAAO,CAAC,QAAQ,IAC7B,IAAI;QAER,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,OAAO,CAAC,IAAI;YACvC,6BAAK,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,IACtD,QAAQ,CACL,CACY,CAChB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/esm/accordion/AccordionHeader.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface AccordionHeaderProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Button content
+     */
+    children: React.ReactNode;
+}
+export declare type AccordionHeaderType = React.ForwardRefExoticComponent<AccordionHeaderProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AccordionHeader: AccordionHeaderType;
+export default AccordionHeader;

package/esm/accordion/AccordionHeader.js

@@ -0,0 +1,43 @@
+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 { Expand, ExpandFilled } from "@navikt/ds-icons";
+import cl from "classnames";
+import React, { forwardRef, useContext } from "react";
+import { AccordionItemContext } from "./AccordionItem";
+import { useClientLayoutEffect, useId } from "..";
+const AccordionHeader = forwardRef((_a, ref) => {
+    var { children, className, id, onClick } = _a, rest = __rest(_a, ["children", "className", "id", "onClick"]);
+    const context = useContext(AccordionItemContext);
+    const newId = useId(id);
+    const setButtonId = context && context.setButtonId;
+    useClientLayoutEffect(() => {
+        setButtonId && setButtonId(id ? newId : `accordionContent-${newId}`);
+    }, [setButtonId, newId]);
+    if (context === null) {
+        console.error("<Accordion.Header> has to be used within an <Accordion.Item>");
+        return null;
+    }
+    const handleClick = (e) => {
+        context.toggleOpen();
+        onClick && onClick(e);
+    };
+    return (React.createElement("button", Object.assign({ ref: ref, id: context.buttonId, className: cl("navds-accordion__header", className, "navds-heading", "navds-heading--small"), onClick: handleClick, "aria-controls": context.contentId }, rest),
+        children,
+        React.createElement(Expand, { focusable: "false", role: "img", "aria-label": context.open ? "Lukk panel ikon" : "Åpne panel ikon", className: cl("navds-accordion__expand-icon", {
+                "navds-accordion__expand-icon--flip": context.open,
+            }) }),
+        React.createElement(ExpandFilled, { focusable: "false", role: "img", "aria-label": context.open ? "Lukk panel ikon" : "Åpne panel ikon", className: cl("navds-accordion__expand-icon", "navds-accordion__expand-icon--filled", {
+                "navds-accordion__expand-icon--flip": context.open,
+            }) })));
+});
+export default AccordionHeader;
+//# sourceMappingURL=AccordionHeader.js.map

package/esm/accordion/AccordionHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.js","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AAclD,MAAM,eAAe,GAAwB,UAAU,CACrD,CAAC,EAA6C,EAAE,GAAG,EAAE,EAAE;QAAtD,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAE,OAAO,OAAW,EAAN,IAAI,cAA3C,0CAA6C,CAAF;IAC1C,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjD,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;IAExB,MAAM,WAAW,GAAG,OAAO,IAAI,OAAO,CAAC,WAAW,CAAC;IAEnD,qBAAqB,CAAC,GAAG,EAAE;QACzB,WAAW,IAAI,WAAW,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,oBAAoB,KAAK,EAAE,CAAC,CAAC;IACvE,CAAC,EAAE,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;IAEzB,IAAI,OAAO,KAAK,IAAI,EAAE;QACpB,OAAO,CAAC,KAAK,CACX,8DAA8D,CAC/D,CAAC;QACF,OAAO,IAAI,CAAC;KACb;IAED,MAAM,WAAW,GAAG,CAClB,CAAkD,EAClD,EAAE;QACF,OAAO,CAAC,UAAU,EAAE,CAAC;QACrB,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,8CACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,OAAO,CAAC,QAAQ,EACpB,SAAS,EAAE,EAAE,CACX,yBAAyB,EACzB,SAAS,EACT,eAAe,EACf,sBAAsB,CACvB,EACD,OAAO,EAAE,WAAW,mBACL,OAAO,CAAC,SAAS,IAC5B,IAAI;QAEP,QAAQ;QACT,oBAAC,MAAM,IACL,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,KAAK,gBACE,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,EAChE,SAAS,EAAE,EAAE,CAAC,8BAA8B,EAAE;gBAC5C,oCAAoC,EAAE,OAAO,CAAC,IAAI;aACnD,CAAC,GACF;QACF,oBAAC,YAAY,IACX,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,KAAK,gBACE,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,EAChE,SAAS,EAAE,EAAE,CACX,8BAA8B,EAC9B,sCAAsC,EACtC;gBACE,oCAAoC,EAAE,OAAO,CAAC,IAAI;aACnD,CACF,GACD,CACK,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/esm/accordion/AccordionItem.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Content inside accordion item
+     */
+    children: React.ReactNode;
+    /**
+     * Opens component if 'true', closes if 'false'
+     * Using this props removes automatic control of open-state
+     */
+    open?: boolean;
+    /**
+     * Defaults the accordion to opened state
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * Removes content-element from dom when closed
+     * @default false
+     */
+    renderContentWhenClosed?: boolean;
+}
+export declare type AccordionItemType = React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
+export interface AccordionItemContextProps {
+    open: boolean;
+    toggleOpen: () => void;
+    setButtonId: (id: string) => void;
+    setContentId: (id: string) => void;
+    buttonId: string;
+    contentId: string;
+    renderContentWhenClosed: boolean;
+}
+export declare const AccordionItemContext: React.Context<AccordionItemContextProps | null>;
+declare const AccordionItem: AccordionItemType;
+export default AccordionItem;

package/esm/accordion/AccordionItem.js

@@ -0,0 +1,38 @@
+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 cl from "classnames";
+import React, { createContext, forwardRef, useState } from "react";
+export const AccordionItemContext = createContext(null);
+const AccordionItem = forwardRef((_a, ref) => {
+    var { children, className, open, defaultOpen = false, renderContentWhenClosed = false, onClick, id } = _a, rest = __rest(_a, ["children", "className", "open", "defaultOpen", "renderContentWhenClosed", "onClick", "id"]);
+    const [internalOpen, setInternalOpen] = useState(defaultOpen);
+    const [buttonId, setButtonId] = useState("");
+    const [contentId, setContentId] = useState("");
+    return (React.createElement("div", Object.assign({ className: cl("navds-accordion__item", className, {
+            "navds-accordion__item--open": open !== null && open !== void 0 ? open : internalOpen,
+        }), ref: ref }, rest),
+        React.createElement(AccordionItemContext.Provider, { value: {
+                open: open !== null && open !== void 0 ? open : internalOpen,
+                toggleOpen: () => {
+                    if (open === undefined) {
+                        setInternalOpen((iOpen) => !iOpen);
+                    }
+                },
+                renderContentWhenClosed,
+                setButtonId,
+                buttonId,
+                setContentId,
+                contentId,
+            } }, children)));
+});
+export default AccordionItem;
+//# sourceMappingURL=AccordionItem.js.map

package/esm/accordion/AccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAuCnE,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAC/C,IAAI,CACL,CAAC;AAEF,MAAM,aAAa,GAAsB,UAAU,CACjD,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,uBAAuB,GAAG,KAAK,EAC/B,OAAO,EACP,EAAE,OAEH,EADI,IAAI,cART,4FASC,CADQ;IAIT,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,WAAW,CAAC,CAAC;IACvE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC7C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE/C,OAAO,CACL,2CACE,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE;YAChD,6BAA6B,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY;SACpD,CAAC,EACF,GAAG,EAAE,GAAG,IACJ,IAAI;QAER,oBAAC,oBAAoB,CAAC,QAAQ,IAC5B,KAAK,EAAE;gBACL,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,YAAY;gBAC1B,UAAU,EAAE,GAAG,EAAE;oBACf,IAAI,IAAI,KAAK,SAAS,EAAE;wBACtB,eAAe,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;qBACpC;gBACH,CAAC;gBACD,uBAAuB;gBACvB,WAAW;gBACX,QAAQ;gBACR,YAAY;gBACZ,SAAS;aACV,IAEA,QAAQ,CACqB,CAC5B,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/esm/accordion-menu/AccordionMenu.d.ts

@@ -1,6 +1,12 @@
-import React, { HTMLAttributes } from "react";
-export interface AccordionMenuProps extends HTMLAttributes<HTMLElement> {
+import React from "react";
+import { AccordionMenuCollapsableType } from "./AccordionMenuCollapsable";
+import { AccordionMenuItemType } from "./AccordionMenuItem";
+export interface AccordionMenuProps extends React.HTMLAttributes<HTMLElement> {
     children: React.ReactNode;
 }
-declare const AccordionMenu: React.ForwardRefExoticComponent<AccordionMenuProps & React.RefAttributes<HTMLElement>>;
+interface AccordionMenuComponent extends React.ForwardRefExoticComponent<AccordionMenuProps & React.RefAttributes<HTMLElement>> {
+    Collapsable: AccordionMenuCollapsableType;
+    Item: AccordionMenuItemType;
+}
+declare const AccordionMenu: AccordionMenuComponent;
 export default AccordionMenu;

package/esm/accordion-menu/AccordionMenu.js

@@ -12,10 +12,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React, { forwardRef } from "react";
 import cl from "classnames";
 import MenuItems from "./MenuItems";
+import Collapsable from "./AccordionMenuCollapsable";
+import Item from "./AccordionMenuItem";
 const AccordionMenu = forwardRef((_a, ref) => {
     var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
     return (React.createElement("nav", Object.assign({ role: "navigation", ref: ref, className: cl("navds-accordion-menu", className) }, rest),
         React.createElement(MenuItems, null, children)));
 });
+AccordionMenu.Collapsable = Collapsable;
+AccordionMenu.Item = Item;
 export default AccordionMenu;
 //# sourceMappingURL=AccordionMenu.js.map

package/esm/accordion-menu/AccordionMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionMenu.js","sourceRoot":"","sources":["../../src/accordion-menu/AccordionMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,SAAS,MAAM,aAAa,CAAC;AAMpC,MAAM,aAAa,GAAG,UAAU,CAC9B,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAC7B,OAAO,CACL,2CACE,IAAI,EAAC,YAAY,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,IAC5C,IAAI;QAER,oBAAC,SAAS,QAAE,QAAQ,CAAa,CAC7B,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"AccordionMenu.js","sourceRoot":"","sources":["../../src/accordion-menu/AccordionMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,WAEN,MAAM,4BAA4B,CAAC;AACpC,OAAO,IAA+B,MAAM,qBAAqB,CAAC;AAclE,MAAM,aAAa,GAAG,UAAU,CAC9B,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAC7B,OAAO,CACL,2CACE,IAAI,EAAC,YAAY,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,IAC5C,IAAI;QAER,oBAAC,SAAS,QAAE,QAAQ,CAAa,CAC7B,CACP,CAAC;AACJ,CAAC,CACwB,CAAC;AAE5B,aAAa,CAAC,WAAW,GAAG,WAAW,CAAC;AACxC,aAAa,CAAC,IAAI,GAAG,IAAI,CAAC;AAE1B,eAAe,aAAa,CAAC"}

package/esm/accordion-menu/AccordionMenuCollapsable.d.ts

@@ -4,5 +4,6 @@ export interface AccordionMenuCollapsableProps extends HTMLAttributes<HTMLDivEle
     defaultOpen?: boolean;
     children: React.ReactNode;
 }
-declare const AccordionMenuCollapsable: React.ForwardRefExoticComponent<AccordionMenuCollapsableProps & React.RefAttributes<HTMLDivElement>>;
-export default AccordionMenuCollapsable;
+export declare type AccordionMenuCollapsableType = React.ForwardRefExoticComponent<AccordionMenuCollapsableProps & React.RefAttributes<HTMLDivElement>>;
+declare const Collapsable: AccordionMenuCollapsableType;
+export default Collapsable;

package/esm/accordion-menu/AccordionMenuCollapsable.js

@@ -13,7 +13,7 @@ import React, { forwardRef, useState } from "react";
 import cl from "classnames";
 import { Expand } from "@navikt/ds-icons";
 import MenuItems from "./MenuItems";
-const AccordionMenuCollapsable = forwardRef((_a, ref) => {
+const Collapsable = forwardRef((_a, ref) => {
     var { children, defaultOpen = false, title, className } = _a, rest = __rest(_a, ["children", "defaultOpen", "title", "className"]);
     const [isOpen, setIsOpen] = useState(defaultOpen);
     return (React.createElement("div", Object.assign({ ref: ref, className: cl("navds-accordion-menu-collapsable", className, {
@@ -24,5 +24,5 @@ const AccordionMenuCollapsable = forwardRef((_a, ref) => {
             React.createElement(Expand, { role: "img", focusable: "false", "aria-label": isOpen ? "Pil peker opp" : "Pil peker ned", className: "navds-accordion-menu-collapsable__expand-icon" })),
         isOpen && React.createElement(MenuItems, null, children)));
 });
-export default AccordionMenuCollapsable;
+export default Collapsable;
 //# sourceMappingURL=AccordionMenuCollapsable.js.map

package/esm/accordion-menu/AccordionMenuCollapsable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionMenuCollapsable.js","sourceRoot":"","sources":["../../src/accordion-menu/AccordionMenuCollapsable.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAC;AASpC,MAAM,wBAAwB,GAAG,UAAU,CAGzC,CAAC,EAA4D,EAAE,GAAG,EAAE,EAAE;QAArE,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,SAAS,OAAW,EAAN,IAAI,cAA1D,iDAA4D,CAAF;IAC3D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,CAAC;IAElD,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,kCAAkC,EAAE,SAAS,EAAE;YAC3D,wCAAwC,EAAE,MAAM;SACjD,CAAC,IACE,IAAI;QAER,gCACE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,SAAS,EAAC,0CAA0C;YAEnD,KAAK;YACN,oBAAC,MAAM,IACL,IAAI,EAAC,KAAK,EACV,SAAS,EAAC,OAAO,gBACL,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,EACtD,SAAS,EAAC,+CAA+C,GACzD,CACK;QACR,MAAM,IAAI,oBAAC,SAAS,QAAE,QAAQ,CAAa,CACxC,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"AccordionMenuCollapsable.js","sourceRoot":"","sources":["../../src/accordion-menu/AccordionMenuCollapsable.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAC;AAapC,MAAM,WAAW,GAAiC,UAAU,CAC1D,CAAC,EAA4D,EAAE,GAAG,EAAE,EAAE;QAArE,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,SAAS,OAAW,EAAN,IAAI,cAA1D,iDAA4D,CAAF;IACzD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,CAAC;IAElD,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,kCAAkC,EAAE,SAAS,EAAE;YAC3D,wCAAwC,EAAE,MAAM;SACjD,CAAC,IACE,IAAI;QAER,gCACE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,SAAS,EAAC,0CAA0C;YAEnD,KAAK;YACN,oBAAC,MAAM,IACL,IAAI,EAAC,KAAK,EACV,SAAS,EAAC,OAAO,gBACL,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,EACtD,SAAS,EAAC,+CAA+C,GACzD,CACK;QACR,MAAM,IAAI,oBAAC,SAAS,QAAE,QAAQ,CAAa,CACxC,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/esm/accordion-menu/AccordionMenuItem.d.ts

@@ -1,12 +1,13 @@
 import React from "react";
-import { OverridableComponent } from "../util";
-export declare type AccordionMenuItemType = OverridableComponent<AccordionMenuItemProps>;
-export interface AccordionMenuItemProps {
-    props: {
-        children: React.ReactNode;
-        active?: boolean;
-    } & React.HTMLAttributes<HTMLAnchorElement>;
-    defaultComponent: "a";
+import { OverridableComponent } from "..";
+export interface AccordionMenuItemProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    children: React.ReactNode;
+    /**
+     * Sets active styling if true
+     * @default false
+     */
+    active?: boolean;
 }
-declare const AccordionMenuItem: AccordionMenuItemType;
-export default AccordionMenuItem;
+export declare type AccordionMenuItemType = OverridableComponent<AccordionMenuItemProps, HTMLAnchorElement>;
+declare const Item: AccordionMenuItemType;
+export default Item;