@navikt/ds-react 7.40.0 → 8.0.0

package/cjs/accordion/Accordion.d.ts

@@ -1,4 +1,6 @@
 import React from "react";
+import type { AkselStatusColorRole } from "@navikt/ds-tokens/types";
+import type { AkselColor } from "../types";
 import { AccordionContentProps } from "./AccordionContent";
 import { AccordionHeaderProps } from "./AccordionHeader";
 import { AccordionItemProps } from "./AccordionItem";
@@ -18,15 +20,9 @@ interface AccordionComponent extends React.ForwardRefExoticComponent<AccordionPr
 }
 export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
-     * @deprecated "default" will be the only variant.
-     * @default "default"
+     * @deprecated Will be removed in a future major version. Use `data-color` instead.
      */
     variant?: "default" | "neutral";
-    /**
-     * @default "small"
-     * @deprecated `size`-prop will be the only prop to control the size of the accordion.
-     */
-    headingSize?: "large" | "medium" | "small" | "xsmall";
     /**
      * @default "medium"
      */
@@ -40,6 +36,18 @@ export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
      * Instances of `Accordion.Item`.
      */
     children: React.ReactNode;
+    /**
+     * @deprecated No longer has any effect.
+     */
+    headingSize?: "large" | "medium" | "small" | "xsmall";
+    /**
+     * Overrides inherited color.
+     *
+     * We recommend only using `accent` and `neutral`. We have disallowed status-colors.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
+     */
+    "data-color"?: Exclude<AkselColor, AkselStatusColorRole>;
 }
 /**
  * A component that displays collapsible content sections.

package/cjs/accordion/Accordion.js

@@ -50,6 +50,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Accordion = void 0;
 const react_1 = __importStar(require("react"));
 const Theme_1 = require("../theme/Theme");
+const util_1 = require("../util");
 const AccordionContent_1 = __importDefault(require("./AccordionContent"));
 const AccordionContext_1 = require("./AccordionContext");
 const AccordionHeader_1 = __importDefault(require("./AccordionHeader"));
@@ -75,15 +76,14 @@ const AccordionItem_1 = __importDefault(require("./AccordionItem"));
  * ```
  */
 exports.Accordion = (0, react_1.forwardRef)((_a, ref) => {
-    var { className, variant = "default", headingSize = "small", size = "medium", indent = true } = _a, rest = __rest(_a, ["className", "variant", "headingSize", "size", "indent"]);
+    var { className, variant = "default", size = "medium", indent = true } = _a, rest = __rest(_a, ["className", "variant", "size", "indent"]);
     const { cn } = (0, Theme_1.useRenameCSS)();
     return (react_1.default.createElement(AccordionContext_1.AccordionContext.Provider, { value: {
-            variant,
-            headingSize,
             size,
             mounted: true,
+            variant,
         } },
-        react_1.default.createElement("div", Object.assign({}, rest, { className: cn("navds-accordion", className, `navds-accordion--${size}`, { "navds-accordion--indent": indent }), ref: ref }))));
+        react_1.default.createElement("div", Object.assign({}, (0, util_1.omit)(rest, ["headingSize"]), { className: cn("navds-accordion", className, `navds-accordion--${size}`, { "navds-accordion--indent": indent }), ref: ref }))));
 });
 exports.Accordion.Header = AccordionHeader_1.default;
 exports.Accordion.Content = AccordionContent_1.default;

package/cjs/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAA8C;AAC9C,0EAA6E;AAC7E,yDAAsD;AACtD,wEAA0E;AAC1E,oEAAoE;AAoDpE;;;;;;;;;;;;;;;;;;;GAmBG;AACU,QAAA,SAAS,GAAG,IAAA,kBAAU,EACjC,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,OAAO,EACrB,IAAI,GAAG,QAAQ,EACf,MAAM,GAAG,IAAI,OAEd,EADI,IAAI,cANT,yDAOC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,mCAAgB,CAAC,QAAQ,IACxB,KAAK,EAAE;YACL,OAAO;YACP,WAAW;YACX,IAAI;YACJ,OAAO,EAAE,IAAI;SACd;QAED,uDACM,IAAI,IACR,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,SAAS,EACT,oBAAoB,IAAI,EAAE,EAC1B,EAAE,yBAAyB,EAAE,MAAM,EAAE,CACtC,EACD,GAAG,EAAE,GAAG,IACR,CACwB,CAC7B,CAAC;AACJ,CAAC,CACoB,CAAC;AAExB,iBAAS,CAAC,MAAM,GAAG,yBAAe,CAAC;AACnC,iBAAS,CAAC,OAAO,GAAG,0BAAgB,CAAC;AACrC,iBAAS,CAAC,IAAI,GAAG,uBAAa,CAAC;AAE/B,kBAAe,iBAAS,CAAC"}
+{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,0CAA8C;AAE9C,kCAA+B;AAC/B,0EAA6E;AAC7E,yDAAsD;AACtD,wEAA0E;AAC1E,oEAAoE;AA0DpE;;;;;;;;;;;;;;;;;;;GAmBG;AACU,QAAA,SAAS,GAAG,IAAA,kBAAU,EACjC,CACE,EAA2E,EAC3E,GAAG,EACH,EAAE;QAFF,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,IAAI,GAAG,QAAQ,EAAE,MAAM,GAAG,IAAI,OAAW,EAAN,IAAI,cAAzE,0CAA2E,CAAF;IAGzE,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,mCAAgB,CAAC,QAAQ,IACxB,KAAK,EAAE;YACL,IAAI;YACJ,OAAO,EAAE,IAAI;YACb,OAAO;SACR;QAED,uDACM,IAAA,WAAI,EAAC,IAAI,EAAE,CAAC,aAAa,CAAC,CAAC,IAC/B,SAAS,EAAE,EAAE,CACX,iBAAiB,EACjB,SAAS,EACT,oBAAoB,IAAI,EAAE,EAC1B,EAAE,yBAAyB,EAAE,MAAM,EAAE,CACtC,EACD,GAAG,EAAE,GAAG,IACR,CACwB,CAC7B,CAAC;AACJ,CAAC,CACoB,CAAC;AAExB,iBAAS,CAAC,MAAM,GAAG,yBAAe,CAAC;AACnC,iBAAS,CAAC,OAAO,GAAG,0BAAgB,CAAC;AACrC,iBAAS,CAAC,IAAI,GAAG,uBAAa,CAAC;AAE/B,kBAAe,iBAAS,CAAC"}

package/cjs/accordion/AccordionContent.js

@@ -51,13 +51,14 @@ const AccordionItem_1 = require("./AccordionItem");
 const AccordionContent = (0, react_1.forwardRef)((_a, ref) => {
     var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
     const context = (0, react_1.useContext)(AccordionItem_1.AccordionItemContext);
-    const themeContext = (0, Theme_1.useThemeInternal)();
     const { cn } = (0, Theme_1.useRenameCSS)();
+    const themeContext = (0, Theme_1.useThemeInternal)();
     if (context === null) {
         console.error("<Accordion.Content> has to be used within an <Accordion.Item>");
         return null;
     }
-    return (react_1.default.createElement(typography_1.BodyLong, Object.assign({}, rest, { as: "div", ref: ref, className: cn("navds-accordion__content", { "navds-accordion__content--closed": !context.open }, className) }), (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) ? (react_1.default.createElement("div", { className: cn("navds-accordion__content-inner") }, children)) : (children)));
+    return (react_1.default.createElement(typography_1.BodyLong, Object.assign({ "data-color": themeContext.color }, rest, { as: "div", ref: ref, className: cn("navds-accordion__content", { "navds-accordion__content--closed": !context.open }, className) }),
+        react_1.default.createElement("div", { className: cn("navds-accordion__content-inner") }, children)));
 });
 exports.default = AccordionContent;
 //# sourceMappingURL=AccordionContent.js.map

package/cjs/accordion/AccordionContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContent.js","sourceRoot":"","sources":["../../src/accordion/AccordionContent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAsD;AACtD,0CAAgE;AAChE,8CAAyC;AACzC,mDAAuD;AAUvD,MAAM,gBAAgB,GAAG,IAAA,kBAAU,EACjC,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAC7B,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,oCAAoB,CAAC,CAAC;IAEjD,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;QACrB,OAAO,CAAC,KAAK,CACX,+DAA+D,CAChE,CAAC;QACF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,8BAAC,qBAAQ,oBACH,IAAI,IACR,EAAE,EAAC,KAAK,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,0BAA0B,EAC1B,EAAE,kCAAkC,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EACrD,SAAS,CACV,KAEA,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAC,CAAC,CAAC,CAC1B,uCAAK,SAAS,EAAE,EAAE,CAAC,gCAAgC,CAAC,IAAG,QAAQ,CAAO,CACvE,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACQ,CACZ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,gBAAgB,CAAC"}
+{"version":3,"file":"AccordionContent.js","sourceRoot":"","sources":["../../src/accordion/AccordionContent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAsD;AACtD,0CAAgE;AAChE,8CAAyC;AACzC,mDAAuD;AAUvD,MAAM,gBAAgB,GAAG,IAAA,kBAAU,EACjC,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAC7B,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,oCAAoB,CAAC,CAAC;IAEjD,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAC9B,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IAExC,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;QACrB,OAAO,CAAC,KAAK,CACX,+DAA+D,CAChE,CAAC;QACF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,8BAAC,qBAAQ,gCACK,YAAY,CAAC,KAAK,IAC1B,IAAI,IACR,EAAE,EAAC,KAAK,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,0BAA0B,EAC1B,EAAE,kCAAkC,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EACrD,SAAS,CACV;QAED,uCAAK,SAAS,EAAE,EAAE,CAAC,gCAAgC,CAAC,IAAG,QAAQ,CAAO,CAC7D,CACZ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,gBAAgB,CAAC"}

package/cjs/accordion/AccordionContext.d.ts

@@ -1,8 +1,7 @@
 export type AccordionContextProps = {
-    variant?: "default" | "neutral";
-    headingSize?: "large" | "medium" | "small" | "xsmall";
     size?: "large" | "medium" | "small";
     openItems?: number[];
     mounted: boolean;
+    variant?: "default" | "neutral";
 };
 export declare const AccordionContext: import("react").Context<AccordionContextProps | null>;

package/cjs/accordion/AccordionContext.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AccordionContext = void 0;
 const react_1 = require("react");
 exports.AccordionContext = (0, react_1.createContext)({
-    headingSize: "small",
     size: "medium",
     openItems: [],
     mounted: false,

package/cjs/accordion/AccordionContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContext.js","sourceRoot":"","sources":["../../src/accordion/AccordionContext.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAUzB,QAAA,gBAAgB,GAAG,IAAA,qBAAa,EAA+B;IAC1E,WAAW,EAAE,OAAO;IACpB,IAAI,EAAE,QAAQ;IACd,SAAS,EAAE,EAAE;IACb,OAAO,EAAE,KAAK;CACf,CAAC,CAAC"}
+{"version":3,"file":"AccordionContext.js","sourceRoot":"","sources":["../../src/accordion/AccordionContext.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AASzB,QAAA,gBAAgB,GAAG,IAAA,qBAAa,EAA+B;IAC1E,IAAI,EAAE,QAAQ;IACd,SAAS,EAAE,EAAE;IACb,OAAO,EAAE,KAAK;CACf,CAAC,CAAC"}

package/cjs/accordion/AccordionHeader.js

@@ -52,25 +52,18 @@ const composeEventHandlers_1 = require("../util/composeEventHandlers");
 const AccordionContext_1 = require("./AccordionContext");
 const AccordionItem_1 = require("./AccordionItem");
 const AccordionHeader = (0, react_1.forwardRef)((_a, ref) => {
-    var _b;
     var { children, className, onClick } = _a, rest = __rest(_a, ["children", "className", "onClick"]);
     const itemContext = (0, react_1.useContext)(AccordionItem_1.AccordionItemContext);
     const accordionContext = (0, react_1.useContext)(AccordionContext_1.AccordionContext);
-    const themeContext = (0, Theme_1.useThemeInternal)();
     const { cn } = (0, Theme_1.useRenameCSS)();
     if (itemContext === null) {
         console.error("<Accordion.Header> has to be used within an <Accordion.Item>, which in turn must be within an <Accordion>");
         return null;
     }
-    let headingSize = (_b = accordionContext === null || accordionContext === void 0 ? void 0 : accordionContext.headingSize) !== null && _b !== void 0 ? _b : "small";
-    if (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) {
-        /* Fallback to "medium" Accordion-size if any other sizes are used */
-        headingSize = (accordionContext === null || accordionContext === void 0 ? void 0 : accordionContext.size) === "large" ? "small" : "xsmall";
-    }
-    return (react_1.default.createElement("button", Object.assign({ ref: ref }, rest, { className: cn("navds-accordion__header", className), onClick: (0, composeEventHandlers_1.composeEventHandlers)(onClick, itemContext.toggleOpen), "aria-expanded": itemContext.open, type: "button" }),
+    return (react_1.default.createElement("button", Object.assign({ ref: ref, "data-color": (accordionContext === null || accordionContext === void 0 ? void 0 : accordionContext.variant) === "neutral" ? "neutral" : undefined }, rest, { className: cn("navds-accordion__header", className), onClick: (0, composeEventHandlers_1.composeEventHandlers)(onClick, itemContext.toggleOpen), "aria-expanded": itemContext.open, type: "button" }),
         react_1.default.createElement("span", { className: cn("navds-accordion__icon-wrapper") },
             react_1.default.createElement(aksel_icons_1.ChevronDownIcon, { className: cn("navds-accordion__header-chevron"), "aria-hidden": true })),
-        react_1.default.createElement(typography_1.Heading, { size: headingSize, as: "span", className: cn("navds-accordion__header-content") }, children)));
+        react_1.default.createElement(typography_1.Heading, { size: (accordionContext === null || accordionContext === void 0 ? void 0 : accordionContext.size) === "large" ? "small" : "xsmall", as: "span" }, children)));
 });
 exports.default = AccordionHeader;
 //# sourceMappingURL=AccordionHeader.js.map

package/cjs/accordion/AccordionHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHeader.js","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAsD;AACtD,qDAAsD;AACtD,0CAAgE;AAChE,8CAAwC;AACxC,uEAAoE;AACpE,yDAAsD;AACtD,mDAAuD;AAUvD,MAAM,eAAe,GAAG,IAAA,kBAAU,EAChC,CAAC,EAAyC,EAAE,GAAG,EAAE,EAAE;;QAAlD,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,OAAW,EAAN,IAAI,cAAvC,oCAAyC,CAAF;IACtC,MAAM,WAAW,GAAG,IAAA,kBAAU,EAAC,oCAAoB,CAAC,CAAC;IACrD,MAAM,gBAAgB,GAAG,IAAA,kBAAU,EAAC,mCAAgB,CAAC,CAAC;IAEtD,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC;QACzB,OAAO,CAAC,KAAK,CACX,2GAA2G,CAC5G,CAAC;QACF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,WAAW,GAAG,MAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,WAAW,mCAAI,OAAO,CAAC;IAE3D,IAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAE,CAAC;QAC7B,qEAAqE;QACrE,WAAW,GAAG,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,IAAI,MAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC;IACxE,CAAC;IAED,OAAO,CACL,wDACE,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,EACnD,OAAO,EAAE,IAAA,2CAAoB,EAAC,OAAO,EAAE,WAAW,CAAC,UAAU,CAAC,mBAC/C,WAAW,CAAC,IAAI,EAC/B,IAAI,EAAC,QAAQ;QAEb,wCAAM,SAAS,EAAE,EAAE,CAAC,+BAA+B,CAAC;YAClD,8BAAC,6BAAe,IACd,SAAS,EAAE,EAAE,CAAC,iCAAiC,CAAC,wBAEhD,CACG;QACP,8BAAC,oBAAO,IACN,IAAI,EAAE,WAAW,EACjB,EAAE,EAAC,MAAM,EACT,SAAS,EAAE,EAAE,CAAC,iCAAiC,CAAC,IAE/C,QAAQ,CACD,CACH,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,eAAe,CAAC"}
+{"version":3,"file":"AccordionHeader.js","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAsD;AACtD,qDAAsD;AACtD,0CAA8C;AAC9C,8CAAwC;AACxC,uEAAoE;AACpE,yDAAsD;AACtD,mDAAuD;AAUvD,MAAM,eAAe,GAAG,IAAA,kBAAU,EAChC,CAAC,EAAyC,EAAE,GAAG,EAAE,EAAE;QAAlD,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,OAAW,EAAN,IAAI,cAAvC,oCAAyC,CAAF;IACtC,MAAM,WAAW,GAAG,IAAA,kBAAU,EAAC,oCAAoB,CAAC,CAAC;IACrD,MAAM,gBAAgB,GAAG,IAAA,kBAAU,EAAC,mCAAgB,CAAC,CAAC;IAEtD,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC;QACzB,OAAO,CAAC,KAAK,CACX,2GAA2G,CAC5G,CAAC;QACF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,wDACE,GAAG,EAAE,GAAG,gBAEN,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,OAAO,MAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,IAE7D,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,EACnD,OAAO,EAAE,IAAA,2CAAoB,EAAC,OAAO,EAAE,WAAW,CAAC,UAAU,CAAC,mBAC/C,WAAW,CAAC,IAAI,EAC/B,IAAI,EAAC,QAAQ;QAEb,wCAAM,SAAS,EAAE,EAAE,CAAC,+BAA+B,CAAC;YAClD,8BAAC,6BAAe,IACd,SAAS,EAAE,EAAE,CAAC,iCAAiC,CAAC,wBAEhD,CACG;QACP,8BAAC,oBAAO,IACN,IAAI,EAAE,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,IAAI,MAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAC7D,EAAE,EAAC,MAAM,IAER,QAAQ,CACD,CACH,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,eAAe,CAAC"}

package/cjs/accordion/AccordionItem.js

@@ -70,7 +70,6 @@ const AccordionItem = (0, react_1.forwardRef)((_a, ref) => {
     }
     return (react_1.default.createElement("div", Object.assign({ className: cn("navds-accordion__item", className, {
             "navds-accordion__item--open": _open,
-            "navds-accordion__item--neutral": (context === null || context === void 0 ? void 0 : context.variant) === "neutral",
             "navds-accordion__item--no-animation": !shouldAnimate.current,
         }), "data-expanded": _open, ref: ref }, (0, util_1.omit)(rest, ["onClick"])),
         react_1.default.createElement(exports.AccordionItemContext.Provider, { value: {

package/cjs/accordion/AccordionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6E;AAC7E,0CAA8C;AAC9C,kCAA+B;AAC/B,6EAA0E;AAC1E,yDAAsD;AA8BzC,QAAA,oBAAoB,GAC/B,IAAA,qBAAa,EAAmC,IAAI,CAAC,CAAC;AAExD,MAAM,aAAa,GAAG,IAAA,kBAAU,EAC9B,CACE,EAAyE,EACzE,GAAG,EACH,EAAE;QAFF,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,GAAG,KAAK,EAAE,YAAY,OAAW,EAAN,IAAI,cAAvE,gEAAyE,CAAF;IAGvE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,2CAAoB,EAAC;QAC7C,YAAY,EAAE,WAAW;QACzB,KAAK,EAAE,IAAI;QACX,QAAQ,EAAE,YAAY;KACvB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,mCAAgB,CAAC,CAAC;IAC7C,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,MAAM,aAAa,GAAG,IAAA,cAAM,EAAU,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC;IAEvE,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACpB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;IAC/B,CAAC,CAAC;IAEF,IAAI,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAA,EAAE,CAAC;QACtB,OAAO,CAAC,KAAK,CAAC,uDAAuD,CAAC,CAAC;IACzE,CAAC;IAED,OAAO,CACL,qDACE,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE;YAChD,6BAA6B,EAAE,KAAK;YACpC,gCAAgC,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,MAAK,SAAS;YAChE,qCAAqC,EAAE,CAAC,aAAa,CAAC,OAAO;SAC9D,CAAC,mBACa,KAAK,EACpB,GAAG,EAAE,GAAG,IACJ,IAAA,WAAI,EAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC;QAE3B,8BAAC,4BAAoB,CAAC,QAAQ,IAC5B,KAAK,EAAE;gBACL,IAAI,EAAE,KAAK;gBACX,UAAU,EAAE,UAAU;aACvB,IAEA,QAAQ,CACqB,CAC5B,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,aAAa,CAAC"}
+{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6E;AAC7E,0CAA8C;AAC9C,kCAA+B;AAC/B,6EAA0E;AAC1E,yDAAsD;AA8BzC,QAAA,oBAAoB,GAC/B,IAAA,qBAAa,EAAmC,IAAI,CAAC,CAAC;AAExD,MAAM,aAAa,GAAG,IAAA,kBAAU,EAC9B,CACE,EAAyE,EACzE,GAAG,EACH,EAAE;QAFF,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,GAAG,KAAK,EAAE,YAAY,OAAW,EAAN,IAAI,cAAvE,gEAAyE,CAAF;IAGvE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,2CAAoB,EAAC;QAC7C,YAAY,EAAE,WAAW;QACzB,KAAK,EAAE,IAAI;QACX,QAAQ,EAAE,YAAY;KACvB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,mCAAgB,CAAC,CAAC;IAC7C,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,MAAM,aAAa,GAAG,IAAA,cAAM,EAAU,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC;IAEvE,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACpB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;IAC/B,CAAC,CAAC;IAEF,IAAI,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAA,EAAE,CAAC;QACtB,OAAO,CAAC,KAAK,CAAC,uDAAuD,CAAC,CAAC;IACzE,CAAC;IAED,OAAO,CACL,qDACE,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE;YAChD,6BAA6B,EAAE,KAAK;YACpC,qCAAqC,EAAE,CAAC,aAAa,CAAC,OAAO;SAC9D,CAAC,mBACa,KAAK,EACpB,GAAG,EAAE,GAAG,IACJ,IAAA,WAAI,EAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC;QAE3B,8BAAC,4BAAoB,CAAC,QAAQ,IAC5B,KAAK,EAAE;gBACL,IAAI,EAAE,KAAK;gBACX,UAAU,EAAE,UAAU;aACvB,IAEA,QAAQ,CACqB,CAC5B,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,aAAa,CAAC"}

package/cjs/alert/base-alert/root/BaseAlertRoot.d.ts

@@ -12,7 +12,9 @@ interface BaseAlertProps extends React.HTMLAttributes<HTMLDivElement> {
      */
     size?: BaseAlertContextProps["size"];
     /**
-     * Overrides color
+     * Overrides inherited color.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
      */
     "data-color"?: AkselColor;
     /**

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

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

package/cjs/alert/global-alert/root/GlobalAlertRoot.d.ts

@@ -6,6 +6,10 @@ import { GlobalAlertHeader, type GlobalAlertHeaderProps } from "../header/Global
 import { GlobalAlertTitle, type GlobalAlertTitleProps } from "../title/GlobalAlertTitle";
 interface GlobalAlertProps extends Omit<BaseAlert.RootProps, "type" | "global" | "data-color"> {
     status: Exclude<BaseAlert.RootProps["status"], undefined>;
+    /**
+     * data-color has no effect on GlobalAlert.
+     */
+    "data-color"?: never;
     /**
      *  Whether title and content are centered or not.
      * @default true

package/cjs/alert/global-alert/root/GlobalAlertRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/global-alert/root/GlobalAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAA6C;AAC7C,mFAGgD;AAyH9C,uGA3HA,+CAAsB,OA2HA;AAxHxB,sEAGuC;AAsHrC,mGAxHA,uCAAkB,OAwHA;AArHpB,mEAGqC;AAmHnC,kGArHA,qCAAiB,OAqHA;AAlHnB,gEAGmC;AAgHjC,iGAlHA,mCAAgB,OAkHA;AAvClB;;;;;;;;;;;;;GAaG;AACU,QAAA,WAAW,GAAG,IAAA,kBAAU,EACnC,CAAC,EAA8C,EAAE,YAAY,EAAE,EAAE;QAAhE,EAAE,QAAQ,GAAG,IAAI,OAA6B,EAAxB,IAAI,cAA1B,YAA4B,CAAF;IACzB,OAAO,CACL,8BAAC,sBAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,OAAO,IACR,IAAI,IACR,IAAI,EAAC,QAAQ,EACb,MAAM,yBACS,QAAQ,IACvB,CACH,CAAC;AACJ,CAAC,CACsB,CAAC;AAE1B,mBAAW,CAAC,MAAM,GAAG,qCAAiB,CAAC;AACvC,mBAAW,CAAC,KAAK,GAAG,mCAAgB,CAAC;AACrC,mBAAW,CAAC,OAAO,GAAG,uCAAkB,CAAC;AACzC,mBAAW,CAAC,WAAW,GAAG,+CAAsB,CAAC;AAEjD,kBAAe,mBAAW,CAAC"}
+{"version":3,"file":"GlobalAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/global-alert/root/GlobalAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAA6C;AAC7C,mFAGgD;AA6H9C,uGA/HA,+CAAsB,OA+HA;AA5HxB,sEAGuC;AA0HrC,mGA5HA,uCAAkB,OA4HA;AAzHpB,mEAGqC;AAuHnC,kGAzHA,qCAAiB,OAyHA;AAtHnB,gEAGmC;AAoHjC,iGAtHA,mCAAgB,OAsHA;AAvClB;;;;;;;;;;;;;GAaG;AACU,QAAA,WAAW,GAAG,IAAA,kBAAU,EACnC,CAAC,EAA8C,EAAE,YAAY,EAAE,EAAE;QAAhE,EAAE,QAAQ,GAAG,IAAI,OAA6B,EAAxB,IAAI,cAA1B,YAA4B,CAAF;IACzB,OAAO,CACL,8BAAC,sBAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,OAAO,IACR,IAAI,IACR,IAAI,EAAC,QAAQ,EACb,MAAM,yBACS,QAAQ,IACvB,CACH,CAAC;AACJ,CAAC,CACsB,CAAC;AAE1B,mBAAW,CAAC,MAAM,GAAG,qCAAiB,CAAC;AACvC,mBAAW,CAAC,KAAK,GAAG,mCAAgB,CAAC;AACrC,mBAAW,CAAC,OAAO,GAAG,uCAAkB,CAAC;AACzC,mBAAW,CAAC,WAAW,GAAG,+CAAsB,CAAC;AAEjD,kBAAe,mBAAW,CAAC"}

package/cjs/alert/local-alert/root/LocalAlertRoot.d.ts

@@ -6,6 +6,10 @@ import { LocalAlertHeader, type LocalAlertHeaderProps } from "../header/LocalAle
 import { LocalAlertTitle, type LocalAlertTitleProps } from "../title/LocalAlertTitle";
 interface LocalAlertProps extends Omit<BaseAlert.RootProps, "type" | "global" | "data-color"> {
     status: Exclude<BaseAlert.RootProps["status"], undefined>;
+    /**
+     * data-color has no effect on LocalAlert.
+     */
+    "data-color"?: never;
 }
 interface LocalAlertComponent extends React.ForwardRefExoticComponent<LocalAlertProps & React.RefAttributes<HTMLDivElement>> {
     /**

package/cjs/alert/local-alert/root/LocalAlertRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"LocalAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/local-alert/root/LocalAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAA6C;AAC7C,iFAG+C;AAuH7C,sGAzHA,6CAAqB,OAyHA;AAtHvB,oEAGsC;AAgHpC,kGAlHA,qCAAiB,OAkHA;AA/GnB,iEAGoC;AA6GlC,iGA/GA,mCAAgB,OA+GA;AA5GlB,8DAGkC;AA0GhC,gGA5GA,iCAAe,OA4GA;AAtCjB;;;;;;;;;;;;;GAaG;AACU,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CAAC,EAAyC,EAAE,YAAY,EAAE,EAAE;QAA3D,EAAE,MAAM,OAAiC,EAA5B,SAAS,cAAtB,UAAwB,CAAF;IACrB,OAAO,CACL,8BAAC,sBAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,OAAO,IACR,SAAS,IACb,IAAI,EAAC,QAAQ,EACb,MAAM,EAAE,KAAK,EACb,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CACqB,CAAC;AAEzB,kBAAU,CAAC,MAAM,GAAG,mCAAgB,CAAC;AACrC,kBAAU,CAAC,KAAK,GAAG,iCAAe,CAAC;AACnC,kBAAU,CAAC,OAAO,GAAG,qCAAiB,CAAC;AACvC,kBAAU,CAAC,WAAW,GAAG,6CAAqB,CAAC;AAE/C,kBAAe,kBAAU,CAAC"}
+{"version":3,"file":"LocalAlertRoot.js","sourceRoot":"","sources":["../../../../src/alert/local-alert/root/LocalAlertRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAA6C;AAC7C,iFAG+C;AA2H7C,sGA7HA,6CAAqB,OA6HA;AA1HvB,oEAGsC;AAoHpC,kGAtHA,qCAAiB,OAsHA;AAnHnB,iEAGoC;AAiHlC,iGAnHA,mCAAgB,OAmHA;AAhHlB,8DAGkC;AA8GhC,gGAhHA,iCAAe,OAgHA;AAtCjB;;;;;;;;;;;;;GAaG;AACU,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CAAC,EAAyC,EAAE,YAAY,EAAE,EAAE;QAA3D,EAAE,MAAM,OAAiC,EAA5B,SAAS,cAAtB,UAAwB,CAAF;IACrB,OAAO,CACL,8BAAC,sBAAS,CAAC,IAAI,kBACb,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,OAAO,IACR,SAAS,IACb,IAAI,EAAC,QAAQ,EACb,MAAM,EAAE,KAAK,EACb,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CACqB,CAAC;AAEzB,kBAAU,CAAC,MAAM,GAAG,mCAAgB,CAAC;AACrC,kBAAU,CAAC,KAAK,GAAG,iCAAe,CAAC;AACnC,kBAAU,CAAC,OAAO,GAAG,qCAAiB,CAAC;AACvC,kBAAU,CAAC,WAAW,GAAG,6CAAqB,CAAC;AAE/C,kBAAe,kBAAU,CAAC"}

package/cjs/button/Button.d.ts

@@ -1,5 +1,10 @@
 import React from "react";
+import { AkselColor } from "../types";
 import { OverridableComponent } from "../util/types";
+type legacyVariants = "primary-neutral" | "secondary-neutral" | "tertiary-neutral" | "danger";
+type HiddenVariant = legacyVariants & {
+    __brand?: never;
+};
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     /**
      * Button content.
@@ -9,7 +14,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
      * Changes design and interaction-visuals.
      * @default "primary"
      */
-    variant?: "primary" | "primary-neutral" | "secondary" | "secondary-neutral" | "tertiary" | "tertiary-neutral" | "danger";
+    variant?: "primary" | "secondary" | "tertiary" | HiddenVariant;
     /**
      * Changes padding, height, and font-size.
      * @default "medium"
@@ -35,6 +40,14 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
      * @default "left"
      */
     iconPosition?: "left" | "right";
+    /**
+     * Overrides inherited color.
+     *
+     * We recommend only using `accent`, `neutral` and `danger`.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
+     */
+    "data-color"?: AkselColor;
 }
 /**
  * A button component

package/cjs/button/Button.js

@@ -70,7 +70,7 @@ exports.Button = (0, react_1.forwardRef)((_a, ref) => {
             e.currentTarget.click();
         }
     };
-    return (react_1.default.createElement(Component, Object.assign({}, (Component !== "button" ? { role: "button" } : {}), { "data-color": color !== null && color !== void 0 ? color : variantToColor(variant), "data-variant": variantToSimplifiedVariant(variant) }, filterProps, { ref: ref, onKeyUp: (0, composeEventHandlers_1.composeEventHandlers)(onKeyUp, handleKeyUp), className: cn(className, "navds-button", `navds-button--${variant}`, `navds-button--${size}`, {
+    return (react_1.default.createElement(Component, Object.assign({}, (Component !== "button" ? { role: "button" } : {}), { "data-color": color !== null && color !== void 0 ? color : variantToColor(variant), "data-variant": variantToSimplifiedVariant(variant) }, filterProps, { ref: ref, onKeyUp: (0, composeEventHandlers_1.composeEventHandlers)(onKeyUp, handleKeyUp), className: cn(className, "navds-button", `navds-button--${size}`, {
             "navds-button--loading": loading,
             "navds-button--icon-only": !!icon && !children,
             "navds-button--disabled": disabled !== null && disabled !== void 0 ? disabled : loading,

package/cjs/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/button/Button.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/button/Button.tsx"],"names":[],"mappings":"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"}

package/cjs/chat/Chat.d.ts

@@ -1,4 +1,6 @@
 import React, { HTMLAttributes } from "react";
+import type { AkselStatusColorRole } from "@navikt/ds-tokens/types";
+import { AkselColor } from "../types";
 import { HeadingProps } from "../typography";
 import Bubble from "./Bubble";
 export declare const VARIANTS: readonly ["subtle", "info", "neutral"];
@@ -24,9 +26,7 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
      */
     avatar?: React.ReactNode;
     /**
-     * Changes background color on avatar and bubbles.
-     * Avoid using the same background as the surface behind Chat.
-     * @default "neutral"
+     * @deprecated Use `data-color` prop instead.
      */
     variant?: (typeof VARIANTS)[number];
     /**
@@ -49,6 +49,14 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
      * @default "3"
      */
     toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
+    /**
+     * Overrides inherited color.
+     *
+     * We have disallowed status-colors.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
+     */
+    "data-color"?: Exclude<AkselColor, AkselStatusColorRole>;
 }
 interface ChatComponent extends React.ForwardRefExoticComponent<ChatProps & React.RefAttributes<HTMLDivElement>> {
     /**

package/cjs/chat/Chat.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAE9C,8CAAuD;AACvD,sDAAwD;AAE3C,QAAA,QAAQ,GAAG,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAU,CAAC;AAClD,QAAA,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC;AACvC,QAAA,KAAK,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU,CAAC;AA2DlD;;;;;;;;;;;;;;;;GAgBG;AACU,QAAA,IAAI,GAAG,IAAA,kBAAU,EAC5B,CACE,EAaY,EACZ,GAAG,EACH,EAAE;QAfF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,OAAO,GAAG,SAAS,EACnB,eAAe,EACf,IAAI,GAAG,QAAQ,EACf,mBAAmB,GAAG,GAAG,EACzB,YAAY,EAAE,KAAK,OAET,EADP,IAAI,cAZT,+IAaC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,qDACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,EACZ,SAAS,EACT,eAAe,QAAQ,EAAE,EACzB,wBAAwB,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,QAAQ,EAAE,EACrD,eAAe,IAAI,EAAE,EACrB,eAAe,OAAO,EAAE,CACzB,gBACW,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,OAAO,CAAC,IACxC,IAAI,oBACM,OAAO;QAEpB,MAAM,IAAI,CACT,uCAAK,SAAS,EAAE,EAAE,CAAC,oBAAoB,CAAC,yBACrC,MAAM,CACH,CACP;QACD,8BAAC,qBAAQ,IACP,EAAE,EAAC,KAAK,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,IAE1C,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YACzC,IAAI,CAAC,eAAK,CAAC,cAAc,CAAkB,KAAK,CAAC,EAAE,CAAC;gBAClD,OAAO,IAAI,CAAC;YACd,CAAC;YAED,OAAO,eAAK,CAAC,YAAY,CAAC,KAAK,kBAC7B,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACxC,SAAS,EAAE,SAAS,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACvD,mBAAmB,IAChB,KAAK,CAAC,KAAK,EACd,CAAC;QACL,CAAC,CAAC,CACO,CACP,CACP,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,SAAS,cAAc,CAAC,OAA6B;IACnD,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB,KAAK,QAAQ;YACX,OAAO,SAAS,CAAC;QACnB,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;QAChB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,YAAI,CAAC,MAAM,GAAG,gBAAM,CAAC;AAErB,kBAAe,YAAI,CAAC"}
+{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAE1D,0CAA8C;AAE9C,8CAAuD;AACvD,sDAAwD;AAE3C,QAAA,QAAQ,GAAG,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAU,CAAC;AAClD,QAAA,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC;AACvC,QAAA,KAAK,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU,CAAC;AAiElD;;;;;;;;;;;;;;;;GAgBG;AACU,QAAA,IAAI,GAAG,IAAA,kBAAU,EAC5B,CACE,EAaY,EACZ,GAAG,EACH,EAAE;QAfF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,OAAO,GAAG,SAAS,EACnB,eAAe,EACf,IAAI,GAAG,QAAQ,EACf,mBAAmB,GAAG,GAAG,EACzB,YAAY,EAAE,KAAK,OAET,EADP,IAAI,cAZT,+IAaC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,qDACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,EACZ,SAAS,EACT,eAAe,QAAQ,EAAE,EACzB,wBAAwB,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,QAAQ,EAAE,EACrD,eAAe,IAAI,EAAE,EACrB,eAAe,OAAO,EAAE,CACzB,gBACW,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,OAAO,CAAC,IACxC,IAAI,oBACM,OAAO;QAEpB,MAAM,IAAI,CACT,uCAAK,SAAS,EAAE,EAAE,CAAC,oBAAoB,CAAC,yBACrC,MAAM,CACH,CACP;QACD,8BAAC,qBAAQ,IACP,EAAE,EAAC,KAAK,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,IAE1C,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YACzC,IAAI,CAAC,eAAK,CAAC,cAAc,CAAkB,KAAK,CAAC,EAAE,CAAC;gBAClD,OAAO,IAAI,CAAC;YACd,CAAC;YAED,OAAO,eAAK,CAAC,YAAY,CAAC,KAAK,kBAC7B,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACxC,SAAS,EAAE,SAAS,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACvD,mBAAmB,IAChB,KAAK,CAAC,KAAK,EACd,CAAC;QACL,CAAC,CAAC,CACO,CACP,CACP,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,SAAS,cAAc,CAAC,OAA6B;IACnD,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB,KAAK,QAAQ;YACX,OAAO,SAAS,CAAC;QACnB,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;QAChB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,YAAI,CAAC,MAAM,GAAG,gBAAM,CAAC;AAErB,kBAAe,YAAI,CAAC"}

package/cjs/chips/Chips.d.ts

@@ -32,23 +32,23 @@ interface ChipsComponent extends React.ForwardRefExoticComponent<ChipsProps & Re
  *
  * @example
  * ```jsx
-      <Chips size="small">
-        {options.map((c) => (
-          <Chips.Toggle
-            selected={selected.includes(c)}
-            key={c}
-            onClick={() =>
-              setSelected(
-                selected.includes(c)
-                  ? selected.filter((x) => x !== c)
-                  : [...selected, c]
-              )
-            }
-          >
-            {c}
-          </Chips.Toggle>
-        ))}
-      </Chips>
+ *    <Chips size="small">
+ *      {options.map((c) => (
+ *        <Chips.Toggle
+ *          selected={selected.includes(c)}
+ *          key={c}
+ *          onClick={() =>
+ *            setSelected(
+ *              selected.includes(c)
+ *                ? selected.filter((x) => x !== c)
+ *                : [...selected, c]
+ *            )
+ *          }
+ *        >
+ *          {c}
+ *        </Chips.Toggle>
+ *      ))}
+ *    </Chips>
  * ```
  */
 export declare const Chips: ChipsComponent;

package/cjs/chips/Chips.js

@@ -60,23 +60,23 @@ const Toggle_1 = __importDefault(require("./Toggle"));
  *
  * @example
  * ```jsx
-      <Chips size="small">
-        {options.map((c) => (
-          <Chips.Toggle
-            selected={selected.includes(c)}
-            key={c}
-            onClick={() =>
-              setSelected(
-                selected.includes(c)
-                  ? selected.filter((x) => x !== c)
-                  : [...selected, c]
-              )
-            }
-          >
-            {c}
-          </Chips.Toggle>
-        ))}
-      </Chips>
+ *    <Chips size="small">
+ *      {options.map((c) => (
+ *        <Chips.Toggle
+ *          selected={selected.includes(c)}
+ *          key={c}
+ *          onClick={() =>
+ *            setSelected(
+ *              selected.includes(c)
+ *                ? selected.filter((x) => x !== c)
+ *                : [...selected, c]
+ *            )
+ *          }
+ *        >
+ *          {c}
+ *        </Chips.Toggle>
+ *      ))}
+ *    </Chips>
  * ```
  */
 exports.Chips = (0, react_1.forwardRef)((_a, ref) => {

package/cjs/chips/Removable.d.ts

@@ -1,15 +1,21 @@
 import React from "react";
+import { AkselColor } from "../types";
 export interface ChipsRemovableProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     children: string;
     /**
-     * Chip-variants
-     * @default "action"
+     * @deprecated Use `data-color` prop instead.
      */
     variant?: "action" | "neutral";
     /**
      * Click callback
      */
     onDelete?: () => void;
+    /**
+     * Overrides inherited color.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
+     */
+    "data-color"?: AkselColor;
 }
 export declare const RemovableChips: React.ForwardRefExoticComponent<ChipsRemovableProps & React.RefAttributes<HTMLButtonElement>>;
 export default RemovableChips;

package/cjs/chips/Removable.js

@@ -53,18 +53,8 @@ const i18n_hooks_1 = require("../util/i18n/i18n.hooks");
 exports.RemovableChips = (0, react_1.forwardRef)((_a, ref) => {
     var { children, variant, onDelete, className, onClick, type = "button", "data-color": color } = _a, rest = __rest(_a, ["children", "variant", "onDelete", "className", "onClick", "type", "data-color"]);
     const translate = (0, i18n_hooks_1.useI18n)("Chips");
-    const themeContext = (0, Theme_1.useThemeInternal)();
     const { cn } = (0, Theme_1.useRenameCSS)();
-    let localVariant;
-    if (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) {
-        localVariant = variant;
-    }
-    else {
-        localVariant = variant !== null && variant !== void 0 ? variant : "action";
-    }
-    return (react_1.default.createElement("button", Object.assign({ "data-color": color !== null && color !== void 0 ? color : variantToColor(localVariant) }, rest, { ref: ref, type: type, className: cn("navds-chips__chip navds-chips__removable navds-chips--icon-right", className, {
-            [`navds-chips__removable--${localVariant}`]: localVariant,
-        }), "aria-label": `${children} ${translate("Removable.labelSuffix")}`, onClick: (0, composeEventHandlers_1.composeEventHandlers)(onClick, onDelete) }),
+    return (react_1.default.createElement("button", Object.assign({ "data-color": color !== null && color !== void 0 ? color : variantToColor(variant) }, rest, { ref: ref, type: type, className: cn("navds-chips__chip navds-chips__removable navds-chips--icon-right", className), "aria-label": `${children} ${translate("Removable.labelSuffix")}`, onClick: (0, composeEventHandlers_1.composeEventHandlers)(onClick, onDelete) }),
         react_1.default.createElement("span", { className: cn("navds-chips__chip-text") }, children),
         react_1.default.createElement("span", { className: cn("navds-chips__removable-icon") },
             react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true }))));

package/cjs/chips/Removable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Removable.js","sourceRoot":"","sources":["../../src/chips/Removable.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,qDAAgD;AAChD,0CAAgE;AAEhE,uEAAoE;AACpE,wDAAkD;AAgBrC,QAAA,cAAc,GAAG,IAAA,kBAAU,EAItC,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,YAAY,EAAE,KAAK,OAEpB,EADI,IAAI,cART,iFASC,CADQ;IAIT,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,OAAO,CAAC,CAAC;IACnC,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,IAAI,YAAwD,CAAC;IAE7D,IAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAE,CAAC;QAC7B,YAAY,GAAG,OAAO,CAAC;IACzB,CAAC;SAAM,CAAC;QACN,YAAY,GAAG,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,QAAQ,CAAC;IACrC,CAAC;IAED,OAAO,CACL,sEACc,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,YAAY,CAAC,IAC7C,IAAI,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,kEAAkE,EAClE,SAAS,EACT;YACE,CAAC,2BAA2B,YAAY,EAAE,CAAC,EAAE,YAAY;SAC1D,CACF,gBACW,GAAG,QAAQ,IAAI,SAAS,CAAC,uBAAuB,CAAC,EAAE,EAC/D,OAAO,EAAE,IAAA,2CAAoB,EAAC,OAAO,EAAE,QAAQ,CAAC;QAEhD,wCAAM,SAAS,EAAE,EAAE,CAAC,wBAAwB,CAAC,IAAG,QAAQ,CAAQ;QAChE,wCAAM,SAAS,EAAE,EAAE,CAAC,6BAA6B,CAAC;YAChD,8BAAC,uBAAS,0BAAe,CACpB,CACA,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,cAAc,CACrB,OAAwC;IAExC,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAC;QAClB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,kBAAe,sBAAc,CAAC"}
+{"version":3,"file":"Removable.js","sourceRoot":"","sources":["../../src/chips/Removable.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,qDAAgD;AAChD,0CAA8C;AAE9C,uEAAoE;AACpE,wDAAkD;AAqBrC,QAAA,cAAc,GAAG,IAAA,kBAAU,EAItC,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,YAAY,EAAE,KAAK,OAEpB,EADI,IAAI,cART,iFASC,CADQ;IAIT,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,OAAO,CAAC,CAAC;IACnC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,sEACc,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,OAAO,CAAC,IACxC,IAAI,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,kEAAkE,EAClE,SAAS,CACV,gBACW,GAAG,QAAQ,IAAI,SAAS,CAAC,uBAAuB,CAAC,EAAE,EAC/D,OAAO,EAAE,IAAA,2CAAoB,EAAC,OAAO,EAAE,QAAQ,CAAC;QAEhD,wCAAM,SAAS,EAAE,EAAE,CAAC,wBAAwB,CAAC,IAAG,QAAQ,CAAQ;QAChE,wCAAM,SAAS,EAAE,EAAE,CAAC,6BAA6B,CAAC;YAChD,8BAAC,uBAAS,0BAAe,CACpB,CACA,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,cAAc,CACrB,OAAwC;IAExC,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAC;QAClB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,kBAAe,sBAAc,CAAC"}

package/cjs/chips/Toggle.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { AkselColor } from "../types";
 import { OverridableComponent } from "../util/types";
 export interface ChipsToggleProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     children: string;
@@ -7,10 +8,15 @@ export interface ChipsToggleProps extends React.ButtonHTMLAttributes<HTMLButtonE
      */
     selected?: boolean;
     /**
-     * Chip-variants
-     * @default "action"
+     * @deprecated Use `data-color` prop instead.
      */
     variant?: "action" | "neutral";
+    /**
+     * Overrides inherited color.
+     * @see 🏷️ {@link AkselColor}
+     * @see [📝 Documentation](https://aksel.nav.no/grunnleggende/styling/farger-tokens)
+     */
+    "data-color"?: AkselColor;
     /**
      * Toggles display of checkmark on selected
      * @default true

package/cjs/chips/Toggle.js

@@ -50,21 +50,12 @@ const Theme_1 = require("../theme/Theme");
 exports.ToggleChips = (0, react_1.forwardRef)((_a, ref) => {
     var { className, children, selected, variant, checkmark = true, as: Component = "button", "data-color": color } = _a, rest = __rest(_a, ["className", "children", "selected", "variant", "checkmark", "as", "data-color"]);
     const { cn } = (0, Theme_1.useRenameCSS)();
-    const themeContext = (0, Theme_1.useThemeInternal)();
-    let localVariant;
-    if (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) {
-        localVariant = variant;
-    }
-    else {
-        localVariant = variant !== null && variant !== void 0 ? variant : "action";
-    }
-    return (react_1.default.createElement(Component, Object.assign({ "data-color": color !== null && color !== void 0 ? color : variantToColor(localVariant) }, rest, { ref: ref, className: cn("navds-chips__chip navds-chips__toggle", className, {
+    return (react_1.default.createElement(Component, Object.assign({ "data-color": color !== null && color !== void 0 ? color : variantToColor(variant) }, rest, { ref: ref, className: cn("navds-chips__chip navds-chips__toggle", className, {
             "navds-chips__toggle--with-checkmark": checkmark,
-            [`navds-chips__toggle--${localVariant}`]: localVariant,
         }), "aria-pressed": selected, "data-pressed": selected }),
         checkmark && (react_1.default.createElement("svg", { "aria-hidden": true, className: cn("navds-chips__toggle-icon"), width: "1.25em", height: "1.25em", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", focusable: false, role: "img" }, selected ? (react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10 18.125C14.4873 18.125 18.125 14.4873 18.125 10C18.125 5.51269 14.4873 1.875 10 1.875C5.51269 1.875 1.875 5.51269 1.875 10C1.875 14.4873 5.51269 18.125 10 18.125ZM14.128 7.72904C14.3695 7.44357 14.3339 7.01635 14.0485 6.7748C13.763 6.53326 13.3358 6.56886 13.0942 6.85432L8.60428 12.1606L6.41627 9.97263C6.15185 9.70822 5.72315 9.70822 5.45873 9.97263C5.19431 10.2371 5.19431 10.6658 5.45873 10.9302L8.16706 13.6385C8.30095 13.7724 8.48479 13.8441 8.67397 13.8362C8.86316 13.8284 9.0404 13.7416 9.16271 13.5971L14.128 7.72904Z", fill: "currentColor" })) : (react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10Z", 
             /* After removing old fallbacks, change to currentColor */
-            fill: "var(--ax-text-default, var(--ac-chip-toggle-circle-border, var(--a-border-default)))" })))),
+            fill: "var(--ax-text-default)" })))),
         react_1.default.createElement("span", { className: cn("navds-chips__chip-text") }, children)));
 });
 function variantToColor(variant) {

package/cjs/chips/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","sourceRoot":"","sources":["../../src/chips/Toggle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAAgE;AAuBnD,QAAA,WAAW,GAGpB,IAAA,kBAAU,EACZ,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,SAAS,GAAG,IAAI,EAChB,EAAE,EAAE,SAAS,GAAG,QAAQ,EACxB,YAAY,EAAE,KAAK,OAEpB,EADI,IAAI,cART,iFASC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAC9B,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,IAAI,YAAqD,CAAC;IAE1D,IAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAE,CAAC;QAC7B,YAAY,GAAG,OAAO,CAAC;IACzB,CAAC;SAAM,CAAC;QACN,YAAY,GAAG,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,QAAQ,CAAC;IACrC,CAAC;IAED,OAAO,CACL,8BAAC,SAAS,gCACI,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,YAAY,CAAC,IAC7C,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,uCAAuC,EAAE,SAAS,EAAE;YAChE,qCAAqC,EAAE,SAAS;YAChD,CAAC,wBAAwB,YAAY,EAAE,CAAC,EAAE,YAAY;SACvD,CAAC,kBACY,QAAQ,kBACR,QAAQ;QAErB,SAAS,IAAI,CACZ,4DAEE,SAAS,EAAE,EAAE,CAAC,0BAA0B,CAAC,EACzC,KAAK,EAAC,QAAQ,EACd,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,KAAK,EAChB,IAAI,EAAC,KAAK,IAET,QAAQ,CAAC,CAAC,CAAC,CACV,wCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,mhBAAmhB,EACrhB,IAAI,EAAC,cAAc,GACnB,CACH,CAAC,CAAC,CAAC,CACF,wCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,sUAAsU;YACxU,0DAA0D;YAC1D,IAAI,EAAC,sFAAsF,GAC3F,CACH,CACG,CACP;QACD,wCAAM,SAAS,EAAE,EAAE,CAAC,wBAAwB,CAAC,IAAG,QAAQ,CAAQ,CACtD,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,cAAc,CACrB,OAAqC;IAErC,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAC;QAClB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,kBAAe,mBAAW,CAAC"}
+{"version":3,"file":"Toggle.js","sourceRoot":"","sources":["../../src/chips/Toggle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAA8C;AA4BjC,QAAA,WAAW,GAGpB,IAAA,kBAAU,EACZ,CACE,EASC,EACD,GAAG,EACH,EAAE;QAXF,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,SAAS,GAAG,IAAI,EAChB,EAAE,EAAE,SAAS,GAAG,QAAQ,EACxB,YAAY,EAAE,KAAK,OAEpB,EADI,IAAI,cART,iFASC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,SAAS,gCACI,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,cAAc,CAAC,OAAO,CAAC,IACxC,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,uCAAuC,EAAE,SAAS,EAAE;YAChE,qCAAqC,EAAE,SAAS;SACjD,CAAC,kBACY,QAAQ,kBACR,QAAQ;QAErB,SAAS,IAAI,CACZ,4DAEE,SAAS,EAAE,EAAE,CAAC,0BAA0B,CAAC,EACzC,KAAK,EAAC,QAAQ,EACd,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,KAAK,EAChB,IAAI,EAAC,KAAK,IAET,QAAQ,CAAC,CAAC,CAAC,CACV,wCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,mhBAAmhB,EACrhB,IAAI,EAAC,cAAc,GACnB,CACH,CAAC,CAAC,CAAC,CACF,wCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,sUAAsU;YACxU,0DAA0D;YAC1D,IAAI,EAAC,wBAAwB,GAC7B,CACH,CACG,CACP;QACD,wCAAM,SAAS,EAAE,EAAE,CAAC,wBAAwB,CAAC,IAAG,QAAQ,CAAQ,CACtD,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,cAAc,CACrB,OAAqC;IAErC,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAC;QAClB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB;YACE,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,kBAAe,mBAAW,CAAC"}

package/cjs/collapsible/Collapsible.d.ts

@@ -37,7 +37,7 @@ interface CollapsibleComponent extends React.ForwardRefExoticComponent<Collapsib
  *     <Button>Button</Button>
  *   </Collapsible.Trigger>
  *   <Collapsible.Content asChild>
- *     <Box padding="4" background="surface-alt-3-subtle">
+ *     <Box padding="4" background="info-soft">
  *       <div>lorem ipsum</div>
  *     </Box>
  *   </Collapsible.Content>

package/cjs/collapsible/Collapsible.js

@@ -76,7 +76,7 @@ const Collapsible_Trigger_1 = __importDefault(require("./parts/Collapsible.Trigg
  *     <Button>Button</Button>
  *   </Collapsible.Trigger>
  *   <Collapsible.Content asChild>
- *     <Box padding="4" background="surface-alt-3-subtle">
+ *     <Box padding="4" background="info-soft">
  *       <div>lorem ipsum</div>
  *     </Box>
  *   </Collapsible.Content>