@navikt/ds-react 2.4.3 → 2.5.1

package/cjs/list/List.js

@@ -45,21 +45,22 @@ const useId_1 = require("../util/useId");
 const ListItem_1 = require("./ListItem");
 exports.ListContext = (0, react_1.createContext)({
     listType: "ul",
+    isNested: null,
 });
 exports.List = (0, react_1.forwardRef)((_a, ref) => {
     var { children, className, as: ListTag = "ul", title, description, headingTag = "h3" } = _a, rest = __rest(_a, ["children", "className", "as", "title", "description", "headingTag"]);
     const ariaId = (0, useId_1.useId)();
-    const { isNested } = (0, react_1.useContext)(ListItem_1.ListItemContext);
+    const { isNested } = (0, react_1.useContext)(exports.ListContext);
     return (react_1.default.createElement(exports.ListContext.Provider, { value: {
             listType: ListTag,
+            isNested: isNested === null ? false : true,
         } },
         react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-list", className, {
-                "navds-list--nested": isNested,
+                "navds-list--nested": isNested === null ? false : true,
             }) }),
             title && (react_1.default.createElement(typography_1.Heading, { id: `tittel-${ariaId}`, size: "small", as: headingTag }, title)),
             description && (react_1.default.createElement(typography_1.BodyShort, { id: `description-${ariaId}` }, description)),
             react_1.default.createElement(ListTag, { "aria-labelledby": title && `tittel-${ariaId}`, "aria-describedby": description && `description-${ariaId}` }, children))));
 });
 exports.List.Item = ListItem_1.ListItem;
-exports.List.componentType = "list";
 exports.default = exports.List;

package/cjs/list/ListItem.js

@@ -37,33 +37,27 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ListItem = exports.ListItemContext = void 0;
+exports.ListItem = void 0;
 const clsx_1 = __importDefault(require("clsx"));
 const react_1 = __importStar(require("react"));
 const typography_1 = require("../typography");
 const List_1 = require("./List");
-exports.ListItemContext = (0, react_1.createContext)({
-    isNested: false,
-});
 exports.ListItem = (0, react_1.forwardRef)((_a, ref) => {
-    var _b;
     var { className, children, title, icon } = _a, rest = __rest(_a, ["className", "children", "title", "icon"]);
-    const { listType } = (0, react_1.useContext)(List_1.ListContext);
+    const { listType, isNested } = (0, react_1.useContext)(List_1.ListContext);
     if (listType === "ol" && icon) {
         console.warn("<List />: Icon prop is not supported for ordered lists. Please remove the icon prop.");
     }
-    const hasNestedList = (_b = react_1.default.Children.toArray(children)) === null || _b === void 0 ? void 0 : _b.some((child) => { var _a; return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.componentType) === "list"; });
-    return (react_1.default.createElement(exports.ListItemContext.Provider, { value: { isNested: hasNestedList } },
-        react_1.default.createElement("li", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-list__item", className, {
-                "navds-list__item--noMargin": hasNestedList,
-            }) }),
-            listType === "ul" && (react_1.default.createElement("div", { className: (0, clsx_1.default)({
-                    "navds-list__item-marker--icon": icon,
-                    "navds-list__item-marker--bullet": !icon,
-                }) }, icon ? (icon) : (react_1.default.createElement("svg", { width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, focusable: false, role: "img" },
-                react_1.default.createElement("rect", { width: "6", height: "6", rx: "3", fill: "currentColor" }))))),
-            react_1.default.createElement(typography_1.BodyShort, { as: "div", size: "small", className: "navds-list__item-content" },
-                title && (react_1.default.createElement(typography_1.Label, { as: "p", size: "small" }, title)),
-                children))));
+    return (react_1.default.createElement("li", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-list__item", className, {
+            "navds-list__item--noMargin": isNested,
+        }) }),
+        listType === "ul" && (react_1.default.createElement("div", { className: (0, clsx_1.default)({
+                "navds-list__item-marker--icon": icon,
+                "navds-list__item-marker--bullet": !icon,
+            }) }, icon ? (icon) : (react_1.default.createElement("svg", { width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, focusable: false, role: "img" },
+            react_1.default.createElement("rect", { width: "6", height: "6", rx: "3", fill: "currentColor" }))))),
+        react_1.default.createElement(typography_1.BodyShort, { as: "div", size: "small", className: "navds-list__item-content" },
+            title && (react_1.default.createElement(typography_1.Label, { as: "p", size: "small" }, title)),
+            children)));
 });
 exports.default = exports.ListItem;

package/esm/list/List.d.ts

@@ -23,10 +23,10 @@ export interface ListProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 export interface ListComponent extends React.ForwardRefExoticComponent<ListProps> {
     Item: ListItemType;
-    componentType: string;
 }
 interface ListContextProps {
     listType: "ul" | "ol";
+    isNested: boolean | null;
 }
 export declare const ListContext: React.Context<ListContextProps>;
 export declare const List: ListComponent;

package/esm/list/List.js

@@ -13,25 +13,26 @@ import cl from "clsx";
 import React, { createContext, forwardRef, useContext } from "react";
 import { BodyShort, Heading } from "../typography";
 import { useId } from "../util/useId";
-import { ListItem, ListItemContext } from "./ListItem";
+import { ListItem } from "./ListItem";
 export const ListContext = createContext({
     listType: "ul",
+    isNested: null,
 });
 export const List = forwardRef((_a, ref) => {
     var { children, className, as: ListTag = "ul", title, description, headingTag = "h3" } = _a, rest = __rest(_a, ["children", "className", "as", "title", "description", "headingTag"]);
     const ariaId = useId();
-    const { isNested } = useContext(ListItemContext);
+    const { isNested } = useContext(ListContext);
     return (React.createElement(ListContext.Provider, { value: {
             listType: ListTag,
+            isNested: isNested === null ? false : true,
         } },
         React.createElement("div", Object.assign({}, rest, { ref: ref, className: cl("navds-list", className, {
-                "navds-list--nested": isNested,
+                "navds-list--nested": isNested === null ? false : true,
             }) }),
             title && (React.createElement(Heading, { id: `tittel-${ariaId}`, size: "small", as: headingTag }, title)),
             description && (React.createElement(BodyShort, { id: `description-${ariaId}` }, description)),
             React.createElement(ListTag, { "aria-labelledby": title && `tittel-${ariaId}`, "aria-describedby": description && `description-${ariaId}` }, children))));
 });
 List.Item = ListItem;
-List.componentType = "list";
 export default List;
 //# sourceMappingURL=List.js.map

package/esm/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/list/List.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAgB,MAAM,YAAY,CAAC;AAkCrE,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAmB;IACzD,QAAQ,EAAE,IAAI;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,QAAQ,EACR,SAAS,EACT,EAAE,EAAE,OAAO,GAAG,IAAI,EAClB,KAAK,EACL,WAAW,EACX,UAAU,GAAG,IAAI,OAElB,EADI,IAAI,cAPT,qEAQC,CADQ;IAIT,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IAEvB,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAGjD,OAAO,CACL,oBAAC,WAAW,CAAC,QAAQ,IACnB,KAAK,EAAE;YACL,QAAQ,EAAE,OAAO;SAClB;QAED,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE;gBACrC,oBAAoB,EAAE,QAAQ;aAC/B,CAAC;YAED,KAAK,IAAI,CACR,oBAAC,OAAO,IAAC,EAAE,EAAE,UAAU,MAAM,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,UAAU,IACzD,KAAK,CACE,CACX;YACA,WAAW,IAAI,CACd,oBAAC,SAAS,IAAC,EAAE,EAAE,eAAe,MAAM,EAAE,IAAG,WAAW,CAAa,CAClE;YACD,oBAAC,OAAO,uBACW,KAAK,IAAI,UAAU,MAAM,EAAE,sBAC1B,WAAW,IAAI,eAAe,MAAM,EAAE,IAEvD,QAAQ,CACD,CACN,CACe,CACxB,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;AACrB,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;AAE5B,eAAe,IAAI,CAAC"}
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/list/List.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAgB,MAAM,YAAY,CAAC;AAkCpD,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAmB;IACzD,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,QAAQ,EACR,SAAS,EACT,EAAE,EAAE,OAAO,GAAG,IAAI,EAClB,KAAK,EACL,WAAW,EACX,UAAU,GAAG,IAAI,OAElB,EADI,IAAI,cAPT,qEAQC,CADQ;IAIT,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IAEvB,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAE7C,OAAO,CACL,oBAAC,WAAW,CAAC,QAAQ,IACnB,KAAK,EAAE;YACL,QAAQ,EAAE,OAAO;YACjB,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI;SAC3C;QAED,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE;gBACrC,oBAAoB,EAAE,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI;aACvD,CAAC;YAED,KAAK,IAAI,CACR,oBAAC,OAAO,IAAC,EAAE,EAAE,UAAU,MAAM,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,UAAU,IACzD,KAAK,CACE,CACX;YACA,WAAW,IAAI,CACd,oBAAC,SAAS,IAAC,EAAE,EAAE,eAAe,MAAM,EAAE,IAAG,WAAW,CAAa,CAClE;YACD,oBAAC,OAAO,uBACW,KAAK,IAAI,UAAU,MAAM,EAAE,sBAC1B,WAAW,IAAI,eAAe,MAAM,EAAE,IAEvD,QAAQ,CACD,CACN,CACe,CACxB,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;AAErB,eAAe,IAAI,CAAC"}

package/esm/list/ListItem.d.ts

@@ -12,9 +12,5 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLLIElement> {
 }
 export interface ListItemType extends React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<HTMLLIElement>> {
 }
-interface ListItemContextProps {
-    isNested: boolean;
-}
-export declare const ListItemContext: React.Context<ListItemContextProps>;
 export declare const ListItem: ListItemType;
 export default ListItem;

package/esm/list/ListItem.js

@@ -10,32 +10,26 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import cl from "clsx";
-import React, { createContext, forwardRef, useContext } from "react";
+import React, { forwardRef, useContext } from "react";
 import { BodyShort, Label } from "../typography";
 import { ListContext } from "./List";
-export const ListItemContext = createContext({
-    isNested: false,
-});
 export const ListItem = forwardRef((_a, ref) => {
-    var _b;
     var { className, children, title, icon } = _a, rest = __rest(_a, ["className", "children", "title", "icon"]);
-    const { listType } = useContext(ListContext);
+    const { listType, isNested } = useContext(ListContext);
     if (listType === "ol" && icon) {
         console.warn("<List />: Icon prop is not supported for ordered lists. Please remove the icon prop.");
     }
-    const hasNestedList = (_b = React.Children.toArray(children)) === null || _b === void 0 ? void 0 : _b.some((child) => { var _a; return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.componentType) === "list"; });
-    return (React.createElement(ListItemContext.Provider, { value: { isNested: hasNestedList } },
-        React.createElement("li", Object.assign({}, rest, { ref: ref, className: cl("navds-list__item", className, {
-                "navds-list__item--noMargin": hasNestedList,
-            }) }),
-            listType === "ul" && (React.createElement("div", { className: cl({
-                    "navds-list__item-marker--icon": icon,
-                    "navds-list__item-marker--bullet": !icon,
-                }) }, icon ? (icon) : (React.createElement("svg", { width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, focusable: false, role: "img" },
-                React.createElement("rect", { width: "6", height: "6", rx: "3", fill: "currentColor" }))))),
-            React.createElement(BodyShort, { as: "div", size: "small", className: "navds-list__item-content" },
-                title && (React.createElement(Label, { as: "p", size: "small" }, title)),
-                children))));
+    return (React.createElement("li", Object.assign({}, rest, { ref: ref, className: cl("navds-list__item", className, {
+            "navds-list__item--noMargin": isNested,
+        }) }),
+        listType === "ul" && (React.createElement("div", { className: cl({
+                "navds-list__item-marker--icon": icon,
+                "navds-list__item-marker--bullet": !icon,
+            }) }, icon ? (icon) : (React.createElement("svg", { width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, focusable: false, role: "img" },
+            React.createElement("rect", { width: "6", height: "6", rx: "3", fill: "currentColor" }))))),
+        React.createElement(BodyShort, { as: "div", size: "small", className: "navds-list__item-content" },
+            title && (React.createElement(Label, { as: "p", size: "small" }, title)),
+            children)));
 });
 export default ListItem;
 //# sourceMappingURL=ListItem.js.map

package/esm/list/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../src/list/ListItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AA0BrC,MAAM,CAAC,MAAM,eAAe,GAAG,aAAa,CAAuB;IACjE,QAAQ,EAAE,KAAK;CAChB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAiB,UAAU,CAC9C,CAAC,EAA6C,EAAE,GAAG,EAAE,EAAE;;QAAtD,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,OAAW,EAAN,IAAI,cAA3C,0CAA6C,CAAF;IAC1C,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAE7C,IAAI,QAAQ,KAAK,IAAI,IAAI,IAAI,EAAE;QAC7B,OAAO,CAAC,IAAI,CACV,sFAAsF,CACvF,CAAC;KACH;IAED,MAAM,aAAa,GAAG,MAAA,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,0CAAE,IAAI,CAC1D,CAAC,KAAU,EAAE,EAAE,WAAC,OAAA,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,0CAAE,aAAa,MAAK,MAAM,CAAA,EAAA,CACtD,CAAC;IAEF,OAAO,CACL,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE;QAC1D,4CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,kBAAkB,EAAE,SAAS,EAAE;gBAC3C,4BAA4B,EAAE,aAAa;aAC5C,CAAC;YAED,QAAQ,KAAK,IAAI,IAAI,CACpB,6BACE,SAAS,EAAE,EAAE,CAAC;oBACZ,+BAA+B,EAAE,IAAI;oBACrC,iCAAiC,EAAE,CAAC,IAAI;iBACzC,CAAC,IAED,IAAI,CAAC,CAAC,CAAC,CACN,IAAI,CACL,CAAC,CAAC,CAAC,CACF,6BACE,KAAK,EAAC,GAAG,EACT,MAAM,EAAC,GAAG,EACV,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,uBAElC,SAAS,EAAE,KAAK,EAChB,IAAI,EAAC,KAAK;gBAEV,8BAAM,KAAK,EAAC,GAAG,EAAC,MAAM,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,cAAc,GAAG,CACpD,CACP,CACG,CACP;YAED,oBAAC,SAAS,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,0BAA0B;gBAClE,KAAK,IAAI,CACR,oBAAC,KAAK,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,OAAO,IACvB,KAAK,CACA,CACT;gBACA,QAAQ,CACC,CACT,CACoB,CAC5B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../src/list/ListItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAsBrC,MAAM,CAAC,MAAM,QAAQ,GAAiB,UAAU,CAC9C,CAAC,EAA6C,EAAE,GAAG,EAAE,EAAE;QAAtD,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,OAAW,EAAN,IAAI,cAA3C,0CAA6C,CAAF;IAC1C,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAEvD,IAAI,QAAQ,KAAK,IAAI,IAAI,IAAI,EAAE;QAC7B,OAAO,CAAC,IAAI,CACV,sFAAsF,CACvF,CAAC;KACH;IAED,OAAO,CACL,4CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,kBAAkB,EAAE,SAAS,EAAE;YAC3C,4BAA4B,EAAE,QAAQ;SACvC,CAAC;QAED,QAAQ,KAAK,IAAI,IAAI,CACpB,6BACE,SAAS,EAAE,EAAE,CAAC;gBACZ,+BAA+B,EAAE,IAAI;gBACrC,iCAAiC,EAAE,CAAC,IAAI;aACzC,CAAC,IAED,IAAI,CAAC,CAAC,CAAC,CACN,IAAI,CACL,CAAC,CAAC,CAAC,CACF,6BACE,KAAK,EAAC,GAAG,EACT,MAAM,EAAC,GAAG,EACV,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,uBAElC,SAAS,EAAE,KAAK,EAChB,IAAI,EAAC,KAAK;YAEV,8BAAM,KAAK,EAAC,GAAG,EAAC,MAAM,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,cAAc,GAAG,CACpD,CACP,CACG,CACP;QAED,oBAAC,SAAS,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,0BAA0B;YAClE,KAAK,IAAI,CACR,oBAAC,KAAK,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,OAAO,IACvB,KAAK,CACA,CACT;YACA,QAAQ,CACC,CACT,CACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "2.4.3",
+  "version": "2.5.1",
   "description": "Aksel react-components for NAV designsystem",
   "author": "Aksel | NAV designsystem team",
   "license": "MIT",
@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@floating-ui/react": "0.17.0",
-    "@navikt/ds-icons": "^2.4.3",
+    "@navikt/ds-icons": "^2.5.1",
     "@radix-ui/react-tabs": "1.0.0",
     "@radix-ui/react-toggle-group": "1.0.0",
     "clsx": "^1.2.1",

package/src/button/button.stories.tsx

@@ -148,7 +148,8 @@ export const Loading = {
     </div>
   ),
 
-  args: { chromatic: { delay: 300 } },
+  args: { chromatic: { disableSnapshot: true } },
+  chromatic: { disableSnapshot: true },
 };
 
 export const Icon = () => (
@@ -274,5 +275,6 @@ export const LoadingWithAs = {
     </div>
   ),
 
-  args: { chromatic: { delay: 300 } },
+  args: { chromatic: { disableSnapshot: true } },
+  chromatic: { disableSnapshot: true },
 };

package/src/list/List.tsx

@@ -2,7 +2,7 @@ import cl from "clsx";
 import React, { createContext, forwardRef, useContext } from "react";
 import { BodyShort, Heading } from "../typography";
 import { useId } from "../util/useId";
-import { ListItem, ListItemContext, ListItemType } from "./ListItem";
+import { ListItem, ListItemType } from "./ListItem";
 
 export interface ListProps extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode;
@@ -29,15 +29,16 @@ export interface ListProps extends React.HTMLAttributes<HTMLDivElement> {
 export interface ListComponent
   extends React.ForwardRefExoticComponent<ListProps> {
   Item: ListItemType;
-  componentType: string;
 }
 
 interface ListContextProps {
   listType: "ul" | "ol";
+  isNested: boolean | null;
 }
 
 export const ListContext = createContext<ListContextProps>({
   listType: "ul",
+  isNested: null,
 });
 
 export const List = forwardRef<HTMLDivElement, ListProps>(
@@ -55,20 +56,20 @@ export const List = forwardRef<HTMLDivElement, ListProps>(
   ) => {
     const ariaId = useId();
 
-    const { isNested } = useContext(ListItemContext);
-
+    const { isNested } = useContext(ListContext);
 
     return (
       <ListContext.Provider
         value={{
           listType: ListTag,
+          isNested: isNested === null ? false : true,
         }}
       >
         <div
           {...rest}
           ref={ref}
           className={cl("navds-list", className, {
-            "navds-list--nested": isNested,
+            "navds-list--nested": isNested === null ? false : true,
           })}
         >
           {title && (
@@ -92,6 +93,5 @@ export const List = forwardRef<HTMLDivElement, ListProps>(
 ) as ListComponent;
 
 List.Item = ListItem;
-List.componentType = "list";
 
 export default List;

package/src/list/ListItem.tsx

@@ -1,5 +1,5 @@
 import cl from "clsx";
-import React, { createContext, forwardRef, useContext } from "react";
+import React, { forwardRef, useContext } from "react";
 import { BodyShort, Label } from "../typography";
 import { ListContext } from "./List";
 
@@ -23,17 +23,9 @@ export interface ListItemType
     ListItemProps & React.RefAttributes<HTMLLIElement>
   > {}
 
-interface ListItemContextProps {
-  isNested: boolean;
-}
-
-export const ListItemContext = createContext<ListItemContextProps>({
-  isNested: false,
-});
-
 export const ListItem: ListItemType = forwardRef(
   ({ className, children, title, icon, ...rest }, ref) => {
-    const { listType } = useContext(ListContext);
+    const { listType, isNested } = useContext(ListContext);
 
     if (listType === "ol" && icon) {
       console.warn(
@@ -41,55 +33,49 @@ export const ListItem: ListItemType = forwardRef(
       );
     }
 
-    const hasNestedList = React.Children.toArray(children)?.some(
-      (child: any) => child?.type?.componentType === "list"
-    );
-
     return (
-      <ListItemContext.Provider value={{ isNested: hasNestedList }}>
-        <li
-          {...rest}
-          ref={ref}
-          className={cl("navds-list__item", className, {
-            "navds-list__item--noMargin": hasNestedList,
-          })}
-        >
-          {listType === "ul" && (
-            <div
-              className={cl({
-                "navds-list__item-marker--icon": icon,
-                "navds-list__item-marker--bullet": !icon,
-              })}
-            >
-              {icon ? (
-                icon
-              ) : (
-                <svg
-                  width="6"
-                  height="6"
-                  viewBox="0 0 6 6"
-                  fill="none"
-                  xmlns="http://www.w3.org/2000/svg"
-                  aria-hidden
-                  focusable={false}
-                  role="img"
-                >
-                  <rect width="6" height="6" rx="3" fill="currentColor" />
-                </svg>
-              )}
-            </div>
-          )}
-
-          <BodyShort as="div" size="small" className="navds-list__item-content">
-            {title && (
-              <Label as="p" size="small">
-                {title}
-              </Label>
+      <li
+        {...rest}
+        ref={ref}
+        className={cl("navds-list__item", className, {
+          "navds-list__item--noMargin": isNested,
+        })}
+      >
+        {listType === "ul" && (
+          <div
+            className={cl({
+              "navds-list__item-marker--icon": icon,
+              "navds-list__item-marker--bullet": !icon,
+            })}
+          >
+            {icon ? (
+              icon
+            ) : (
+              <svg
+                width="6"
+                height="6"
+                viewBox="0 0 6 6"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+                aria-hidden
+                focusable={false}
+                role="img"
+              >
+                <rect width="6" height="6" rx="3" fill="currentColor" />
+              </svg>
             )}
-            {children}
-          </BodyShort>
-        </li>
-      </ListItemContext.Provider>
+          </div>
+        )}
+
+        <BodyShort as="div" size="small" className="navds-list__item-content">
+          {title && (
+            <Label as="p" size="small">
+              {title}
+            </Label>
+          )}
+          {children}
+        </BodyShort>
+      </li>
     );
   }
 );