@navikt/ds-react 7.40.0 → 8.0.1

package/cjs/inline-message/root/InlineMessage.js

@@ -43,16 +43,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InlineMessage = void 0;
-const clsx_1 = __importDefault(require("clsx"));
 const react_1 = __importStar(require("react"));
 const Theme_1 = require("../../theme/Theme");
 const typography_1 = require("../../typography");
 const util_1 = require("../../util");
+const className_1 = require("../../util/className");
 const i18n_hooks_1 = require("../../util/i18n/i18n.hooks");
 const InlineMessageIcon_1 = require("../icon/InlineMessageIcon");
 /**
@@ -77,15 +74,14 @@ const InlineMessageIcon_1 = require("../icon/InlineMessageIcon");
  */
 exports.InlineMessage = (0, react_1.forwardRef)((_a, forwardedRef) => {
     var { as: Component = "div", children, className, status, size = "medium" } = _a, restProps = __rest(_a, ["as", "children", "className", "status", "size"]);
-    const { cn } = (0, Theme_1.useRenameCSS)();
     const themeContext = (0, Theme_1.useThemeInternal)();
     const translate = (0, i18n_hooks_1.useI18n)("global");
     const statusId = (0, util_1.useId)();
     const contentId = (0, util_1.useId)();
-    return (react_1.default.createElement(typography_1.BodyShort, Object.assign({ ref: forwardedRef, className: cn("navds-inline-message", className), "data-color": status === "error" ? "danger" : status }, restProps, { size: size, as: Component, "data-size": size }),
+    return (react_1.default.createElement(typography_1.BodyShort, Object.assign({ ref: forwardedRef, className: (0, className_1.cl)("aksel-inline-message", className), "data-color": status === "error" ? "danger" : status }, restProps, { size: size, as: Component, "data-size": size }),
         react_1.default.createElement(InlineMessageIcon_1.InlineMessageIcon, { status: status }),
         status && (react_1.default.createElement(typography_1.BodyShort, { id: statusId, "aria-hidden": true, visuallyHidden: true }, `${translate(status)}: `)),
-        react_1.default.createElement("span", { "data-color": themeContext === null || themeContext === void 0 ? void 0 : themeContext.color, id: contentId, "aria-labelledby": (0, clsx_1.default)(statusId, contentId) }, children)));
+        react_1.default.createElement("span", { "data-color": themeContext === null || themeContext === void 0 ? void 0 : themeContext.color, id: contentId, "aria-labelledby": (0, className_1.cl)(statusId, contentId) }, children)));
 });
 exports.default = exports.InlineMessage;
 //# sourceMappingURL=InlineMessage.js.map

package/cjs/inline-message/root/InlineMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineMessage.js","sourceRoot":"","sources":["../../../src/inline-message/root/InlineMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAsB;AACtB,+CAA0C;AAC1C,6CAAmE;AACnE,iDAA6C;AAC7C,qCAA8D;AAC9D,2DAAqD;AACrD,iEAA8D;AAc9D;;;;;;;;;;;;;;;;;;;GAmBG;AACU,QAAA,aAAa,GAGtB,IAAA,kBAAU,EACZ,CACE,EAOkD,EAClD,YAAY,EACZ,EAAE;QATF,EACE,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,QAAQ,EACR,SAAS,EACT,MAAM,EACN,IAAI,GAAG,QAAQ,OAEiC,EAD7C,SAAS,cANd,iDAOC,CADa;IAId,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAC9B,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IAExC,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,QAAQ,CAAC,CAAC;IACpC,MAAM,QAAQ,GAAG,IAAA,YAAK,GAAE,CAAC;IACzB,MAAM,SAAS,GAAG,IAAA,YAAK,GAAE,CAAC;IAE1B,OAAO,CACL,8BAAC,sBAAS,kBACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,gBACpC,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,IAC9C,SAAS,IACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,SAAS,eACF,IAAI;QAEf,8BAAC,qCAAiB,IAAC,MAAM,EAAE,MAAM,GAAI;QACpC,MAAM,IAAI,CACT,8BAAC,sBAAS,IAAC,EAAE,EAAE,QAAQ,uBAAc,cAAc,UAChD,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CACf,CACb;QAED,sDACc,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,KAAK,EAC/B,EAAE,EAAE,SAAS,qBACI,IAAA,cAAE,EAAC,QAAQ,EAAE,SAAS,CAAC,IAEvC,QAAQ,CACJ,CACG,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,qBAAa,CAAC"}
+{"version":3,"file":"InlineMessage.js","sourceRoot":"","sources":["../../../src/inline-message/root/InlineMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,6CAAqD;AACrD,iDAA6C;AAC7C,qCAA8D;AAC9D,oDAA0C;AAC1C,2DAAqD;AACrD,iEAA8D;AAkB9D;;;;;;;;;;;;;;;;;;;GAmBG;AACU,QAAA,aAAa,GAGtB,IAAA,kBAAU,EACZ,CACE,EAOkD,EAClD,YAAY,EACZ,EAAE;QATF,EACE,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,QAAQ,EACR,SAAS,EACT,MAAM,EACN,IAAI,GAAG,QAAQ,OAEiC,EAD7C,SAAS,cANd,iDAOC,CADa;IAId,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IAExC,MAAM,SAAS,GAAG,IAAA,oBAAO,EAAC,QAAQ,CAAC,CAAC;IACpC,MAAM,QAAQ,GAAG,IAAA,YAAK,GAAE,CAAC;IACzB,MAAM,SAAS,GAAG,IAAA,YAAK,GAAE,CAAC;IAE1B,OAAO,CACL,8BAAC,sBAAS,kBACR,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,cAAE,EAAC,sBAAsB,EAAE,SAAS,CAAC,gBACpC,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,IAC9C,SAAS,IACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,SAAS,eACF,IAAI;QAEf,8BAAC,qCAAiB,IAAC,MAAM,EAAE,MAAM,GAAI;QACpC,MAAM,IAAI,CACT,8BAAC,sBAAS,IAAC,EAAE,EAAE,QAAQ,uBAAc,cAAc,UAChD,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CACf,CACb;QAED,sDACc,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,KAAK,EAC/B,EAAE,EAAE,SAAS,qBACI,IAAA,cAAE,EAAC,QAAQ,EAAE,SAAS,CAAC,IAEvC,QAAQ,CACJ,CACG,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,qBAAa,CAAC"}

package/cjs/internal-header/InternalHeader.js

@@ -50,6 +50,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InternalHeader = void 0;
 const react_1 = __importStar(require("react"));
 const Theme_1 = require("../theme/Theme");
+const className_1 = require("../util/className");
 const InternalHeaderButton_1 = __importDefault(require("./InternalHeaderButton"));
 const InternalHeaderTitle_1 = __importDefault(require("./InternalHeaderTitle"));
 const InternalHeaderUser_1 = __importDefault(require("./InternalHeaderUser"));
@@ -85,16 +86,11 @@ const InternalHeaderUserButton_1 = __importDefault(require("./InternalHeaderUser
  */
 exports.InternalHeader = (0, react_1.forwardRef)((_a, ref) => {
     var { className } = _a, rest = __rest(_a, ["className"]);
-    const themeContext = (0, Theme_1.useThemeInternal)();
-    const { cn } = (0, Theme_1.useRenameCSS)();
     /*
      * Component is always in "dark" mode, so we manually override global theme.
      */
-    if (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) {
-        return (react_1.default.createElement(Theme_1.Theme, { theme: "dark", asChild: true, hasBackground: false },
-            react_1.default.createElement("header", Object.assign({}, rest, { ref: ref, className: cn("navds-internalheader", className) }))));
-    }
-    return (react_1.default.createElement("header", Object.assign({ "data-theme": "dark" }, rest, { ref: ref, className: cn("navds-internalheader", className) })));
+    return (react_1.default.createElement(Theme_1.Theme, { theme: "dark", asChild: true, hasBackground: false },
+        react_1.default.createElement("header", Object.assign({}, rest, { ref: ref, className: (0, className_1.cl)("aksel-internalheader", className) }))));
 });
 exports.InternalHeader.Title = InternalHeaderTitle_1.default;
 exports.InternalHeader.User = InternalHeaderUser_1.default;

package/cjs/internal-header/InternalHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalHeader.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAAuE;AAEvE,kFAEgC;AAChC,gFAE+B;AAC/B,8EAE8B;AAC9B,0FAEoC;AAoCpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACU,QAAA,cAAc,GAAG,IAAA,kBAAU,EAAC,CAAC,EAAsB,EAAE,GAAG,EAAE,EAAE;QAA/B,EAAE,SAAS,OAAW,EAAN,IAAI,cAApB,aAAsB,CAAF;IAC5D,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B;;OAEG;IACH,IAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAE,CAAC;QAC7B,OAAO,CACL,8BAAC,aAAK,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,QAAC,aAAa,EAAE,KAAK;YAC9C,0DACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,IAChD,CACI,CACT,CAAC;IACJ,CAAC;IAED,OAAO,CACL,sEACa,MAAM,IACb,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,IAChD,CACH,CAAC;AACJ,CAAC,CAA4B,CAAC;AAE9B,sBAAc,CAAC,KAAK,GAAG,6BAAmB,CAAC;AAC3C,sBAAc,CAAC,IAAI,GAAG,4BAAkB,CAAC;AACzC,sBAAc,CAAC,MAAM,GAAG,8BAAoB,CAAC;AAC7C,sBAAc,CAAC,UAAU,GAAG,kCAAwB,CAAC;AAErD,kBAAe,sBAAc,CAAC"}
+{"version":3,"file":"InternalHeader.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAAuC;AACvC,iDAAuC;AAEvC,kFAEgC;AAChC,gFAE+B;AAC/B,8EAE8B;AAC9B,0FAEoC;AAoCpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACU,QAAA,cAAc,GAAG,IAAA,kBAAU,EAAC,CAAC,EAAsB,EAAE,GAAG,EAAE,EAAE;QAA/B,EAAE,SAAS,OAAW,EAAN,IAAI,cAApB,aAAsB,CAAF;IAC5D;;OAEG;IACH,OAAO,CACL,8BAAC,aAAK,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,QAAC,aAAa,EAAE,KAAK;QAC9C,0DACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAE,EAAC,sBAAsB,EAAE,SAAS,CAAC,IAChD,CACI,CACT,CAAC;AACJ,CAAC,CAA4B,CAAC;AAE9B,sBAAc,CAAC,KAAK,GAAG,6BAAmB,CAAC;AAC3C,sBAAc,CAAC,IAAI,GAAG,4BAAkB,CAAC;AACzC,sBAAc,CAAC,MAAM,GAAG,8BAAoB,CAAC;AAC7C,sBAAc,CAAC,UAAU,GAAG,kCAAwB,CAAC;AAErD,kBAAe,sBAAc,CAAC"}

package/cjs/internal-header/InternalHeaderButton.js

@@ -46,11 +46,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InternalHeaderButton = void 0;
 const react_1 = __importStar(require("react"));
-const Theme_1 = require("../theme/Theme");
+const className_1 = require("../util/className");
 exports.InternalHeaderButton = (0, react_1.forwardRef)((_a, ref) => {
     var { as: Component = "button", className } = _a, rest = __rest(_a, ["as", "className"]);
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: cn("navds-internalheader__button", className) })));
+    return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: (0, className_1.cl)("aksel-internalheader__button", className) })));
 });
 exports.default = exports.InternalHeaderButton;
 //# sourceMappingURL=InternalHeaderButton.js.map

package/cjs/internal-header/InternalHeaderButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalHeaderButton.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAA8C;AAUjC,QAAA,oBAAoB,GAG7B,IAAA,kBAAU,EAAC,CAAC,EAAgD,EAAE,GAAG,EAAE,EAAE;QAAzD,EAAE,EAAE,EAAE,SAAS,GAAG,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9C,mBAAgD,CAAF;IAC5D,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,8BAA8B,EAAE,SAAS,CAAC,IACxD,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,4BAAoB,CAAC"}
+{"version":3,"file":"InternalHeaderButton.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAAuC;AAU1B,QAAA,oBAAoB,GAG7B,IAAA,kBAAU,EAAC,CAAC,EAAgD,EAAE,GAAG,EAAE,EAAE;QAAzD,EAAE,EAAE,EAAE,SAAS,GAAG,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9C,mBAAgD,CAAF;IAC5D,OAAO,CACL,8BAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAE,EAAC,8BAA8B,EAAE,SAAS,CAAC,IACxD,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,4BAAoB,CAAC"}

package/cjs/internal-header/InternalHeaderTitle.js

@@ -46,11 +46,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InternalHeaderTitle = void 0;
 const react_1 = __importStar(require("react"));
-const Theme_1 = require("../theme/Theme");
+const className_1 = require("../util/className");
 exports.InternalHeaderTitle = (0, react_1.forwardRef)((_a, ref) => {
     var { as: Component = "a", children, className } = _a, rest = __rest(_a, ["as", "children", "className"]);
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, size: "xsmall", className: cn("navds-internalheader__title", "navds-body-short", className) }),
+    return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, size: "xsmall", className: (0, className_1.cl)("aksel-internalheader__title", "aksel-body-short", className) }),
         react_1.default.createElement("span", null, children)));
 });
 exports.default = exports.InternalHeaderTitle;

package/cjs/internal-header/InternalHeaderTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalHeaderTitle.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderTitle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAA8C;AAWjC,QAAA,mBAAmB,GAG5B,IAAA,kBAAU,EAAC,CAAC,EAAqD,EAAE,GAAG,EAAE,EAAE;QAA9D,EAAE,EAAE,EAAE,SAAS,GAAG,GAAG,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAAnD,+BAAqD,CAAF;IACjE,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CACX,6BAA6B,EAC7B,kBAAkB,EAClB,SAAS,CACV;QAED,4CAAO,QAAQ,CAAQ,CACb,CACb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,2BAAmB,CAAC"}
+{"version":3,"file":"InternalHeaderTitle.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderTitle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,iDAAuC;AAW1B,QAAA,mBAAmB,GAG5B,IAAA,kBAAU,EAAC,CAAC,EAAqD,EAAE,GAAG,EAAE,EAAE;QAA9D,EAAE,EAAE,EAAE,SAAS,GAAG,GAAG,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAAnD,+BAAqD,CAAF;IACjE,OAAO,CACL,8BAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAA,cAAE,EACX,6BAA6B,EAC7B,kBAAkB,EAClB,SAAS,CACV;QAED,4CAAO,QAAQ,CAAQ,CACb,CACb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,2BAAmB,CAAC"}

package/cjs/internal-header/InternalHeaderUser.js

@@ -46,12 +46,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InternalHeaderUser = void 0;
 const react_1 = __importStar(require("react"));
-const Theme_1 = require("../theme/Theme");
 const typography_1 = require("../typography");
+const className_1 = require("../util/className");
 exports.InternalHeaderUser = (0, react_1.forwardRef)((_a, ref) => {
     var { className, name, description } = _a, rest = __rest(_a, ["className", "name", "description"]);
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: cn("navds-internalheader__user", className) }),
+    return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: (0, className_1.cl)("aksel-internalheader__user", className) }),
         react_1.default.createElement("div", null,
             react_1.default.createElement(typography_1.BodyShort, { size: "small", as: "div" }, name),
             description && react_1.default.createElement(typography_1.Detail, { as: "div" }, description))));

package/cjs/internal-header/InternalHeaderUser.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalHeaderUser.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderUser.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAC9C,8CAAkD;AAcrC,QAAA,kBAAkB,GAAG,IAAA,kBAAU,EAG1C,CAAC,EAAyC,EAAE,GAAG,EAAE,EAAE;QAAlD,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,OAAW,EAAN,IAAI,cAAvC,oCAAyC,CAAF;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,uDACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC;QAEtD;YACE,8BAAC,sBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAC,KAAK,IAC7B,IAAI,CACK;YACX,WAAW,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,KAAK,IAAE,WAAW,CAAU,CACnD,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,0BAAkB,CAAC"}
+{"version":3,"file":"InternalHeaderUser.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderUser.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,8CAAkD;AAClD,iDAAuC;AAc1B,QAAA,kBAAkB,GAAG,IAAA,kBAAU,EAG1C,CAAC,EAAyC,EAAE,GAAG,EAAE,EAAE;QAAlD,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,OAAW,EAAN,IAAI,cAAvC,oCAAyC,CAAF;IACxC,OAAO,CACL,uDACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAE,EAAC,4BAA4B,EAAE,SAAS,CAAC;QAEtD;YACE,8BAAC,sBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAC,KAAK,IAC7B,IAAI,CACK;YACX,WAAW,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,KAAK,IAAE,WAAW,CAAU,CACnD,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,0BAAkB,CAAC"}

package/cjs/internal-header/InternalHeaderUserButton.js

@@ -50,13 +50,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InternalHeaderUserButton = void 0;
 const react_1 = __importStar(require("react"));
 const aksel_icons_1 = require("@navikt/aksel-icons");
-const Theme_1 = require("../theme/Theme");
 const typography_1 = require("../typography");
+const className_1 = require("../util/className");
 const InternalHeaderButton_1 = __importDefault(require("./InternalHeaderButton"));
 exports.InternalHeaderUserButton = (0, react_1.forwardRef)((_a, ref) => {
     var { as, name, description, className } = _a, rest = __rest(_a, ["as", "name", "description", "className"]);
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    return (react_1.default.createElement(InternalHeaderButton_1.default, Object.assign({}, rest, { as: as, ref: ref, className: cn("navds-internalheader__user-button", className) }),
+    return (react_1.default.createElement(InternalHeaderButton_1.default, Object.assign({}, rest, { as: as, ref: ref, className: (0, className_1.cl)("aksel-internalheader__user-button", className) }),
         react_1.default.createElement("div", null,
             react_1.default.createElement(typography_1.BodyShort, { size: "small", as: "div" }, name),
             description && react_1.default.createElement(typography_1.Detail, { as: "div" }, description)),

package/cjs/internal-header/InternalHeaderUserButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalHeaderUserButton.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderUserButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,qDAAsD;AACtD,0CAA8C;AAC9C,8CAAkD;AAElD,kFAA0D;AAc7C,QAAA,wBAAwB,GAGjC,IAAA,kBAAU,EAAC,CAAC,EAA6C,EAAE,GAAG,EAAE,EAAE;QAAtD,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,OAAW,EAAN,IAAI,cAA3C,0CAA6C,CAAF;IACzD,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,8BAAC,8BAAoB,oBACf,IAAI,IACR,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,mCAAmC,EAAE,SAAS,CAAC;QAE7D;YACE,8BAAC,sBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAC,KAAK,IAC7B,IAAI,CACK;YACX,WAAW,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,KAAK,IAAE,WAAW,CAAU,CACnD;QACN,8BAAC,6BAAe,0BAAe,CACV,CACxB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,gCAAwB,CAAC"}
+{"version":3,"file":"InternalHeaderUserButton.js","sourceRoot":"","sources":["../../src/internal-header/InternalHeaderUserButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,qDAAsD;AACtD,8CAAkD;AAClD,iDAAuC;AAEvC,kFAA0D;AAc7C,QAAA,wBAAwB,GAGjC,IAAA,kBAAU,EAAC,CAAC,EAA6C,EAAE,GAAG,EAAE,EAAE;QAAtD,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,OAAW,EAAN,IAAI,cAA3C,0CAA6C,CAAF;IACzD,OAAO,CACL,8BAAC,8BAAoB,oBACf,IAAI,IACR,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAE,EAAC,mCAAmC,EAAE,SAAS,CAAC;QAE7D;YACE,8BAAC,sBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAC,KAAK,IAC7B,IAAI,CACK;YACX,WAAW,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,KAAK,IAAE,WAAW,CAAU,CACnD;QACN,8BAAC,6BAAe,0BAAe,CACV,CACxB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAe,gCAAwB,CAAC"}

package/cjs/layout/base/BasePrimitive.d.ts

@@ -3,7 +3,7 @@ import { ResponsiveProp, SpacingScale } from "../utilities/types";
 export type PrimitiveProps = {
     /**
      * Padding around children.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * padding='space-16'
@@ -12,7 +12,7 @@ export type PrimitiveProps = {
     padding?: ResponsiveProp<SpacingScale>;
     /**
      * Horizontal padding around children.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * paddingInline='space-16'
@@ -22,7 +22,7 @@ export type PrimitiveProps = {
     paddingInline?: ResponsiveProp<SpacingScale | `${SpacingScale} ${SpacingScale}`>;
     /**
      * Vertical padding around children.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * paddingBlock='space-16'
@@ -32,7 +32,7 @@ export type PrimitiveProps = {
     paddingBlock?: ResponsiveProp<SpacingScale | `${SpacingScale} ${SpacingScale}`>;
     /**
      * Margin around element.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * margin='space-16'
@@ -41,7 +41,7 @@ export type PrimitiveProps = {
     margin?: ResponsiveProp<SpacingScale>;
     /**
      * Horizontal margin around element.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * marginInline='space-16'
@@ -51,7 +51,7 @@ export type PrimitiveProps = {
     marginInline?: ResponsiveProp<SpacingScale | `${SpacingScale} ${SpacingScale}` | "auto" | `auto ${SpacingScale}` | `${SpacingScale} auto`>;
     /**
      * Vertical margin around element.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * marginBlock='space-16'
@@ -89,7 +89,7 @@ export type PrimitiveProps = {
     position?: ResponsiveProp<"static" | "relative" | "absolute" | "fixed" | "sticky">;
     /**
      * CSS `inset`.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * inset='space-16'
@@ -99,7 +99,7 @@ export type PrimitiveProps = {
     inset?: ResponsiveProp<SpacingScale | `${SpacingScale} ${SpacingScale}`>;
     /**
      * CSS `top`
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * top='space-16'
@@ -108,7 +108,7 @@ export type PrimitiveProps = {
     top?: ResponsiveProp<SpacingScale>;
     /**
      * CSS `right`
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * right='space-16'
@@ -117,7 +117,7 @@ export type PrimitiveProps = {
     right?: ResponsiveProp<SpacingScale>;
     /**
      * CSS `bottom`
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * bottom='space-16'
@@ -126,7 +126,7 @@ export type PrimitiveProps = {
     bottom?: ResponsiveProp<SpacingScale>;
     /**
      * CSS `left`
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      * @example
      * left='space-16'

package/cjs/layout/base/BasePrimitive.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.BasePrimitive = exports.PRIMITIVE_PROPS = void 0;
 const react_1 = __importDefault(require("react"));
 const Slot_1 = require("../../slot/Slot");
-const Theme_1 = require("../../theme/Theme");
+const className_1 = require("../../util/className");
 const css_1 = require("../utilities/css");
 exports.PRIMITIVE_PROPS = [
     "padding",
@@ -36,37 +36,34 @@ exports.PRIMITIVE_PROPS = [
     "gridColumn",
 ];
 const BasePrimitive = ({ children, className, padding, paddingInline, paddingBlock, margin, marginInline, marginBlock, width, minWidth, maxWidth, height, minHeight, maxHeight, position, inset, top, right, left, bottom, overflow, overflowX, overflowY, flexBasis, flexGrow, flexShrink, gridColumn, }) => {
-    const themeContext = (0, Theme_1.useThemeInternal)();
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    const prefix = (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) ? "ax" : "a";
-    const style = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, css_1.getResponsiveProps)(prefix, "r", "p", "spacing", padding)), (0, css_1.getResponsiveProps)(prefix, "r", "pi", "spacing", paddingInline)), (0, css_1.getResponsiveProps)(prefix, "r", "pb", "spacing", paddingBlock)), (0, css_1.getResponsiveProps)(prefix, "r", "m", "spacing", margin)), (0, css_1.getResponsiveProps)(prefix, "r", "mi", "spacing", marginInline)), (0, css_1.getResponsiveProps)(prefix, "r", "mb", "spacing", marginBlock)), (0, css_1.getResponsiveValue)(prefix, "r", "w", width)), (0, css_1.getResponsiveValue)(prefix, "r", "minw", minWidth)), (0, css_1.getResponsiveValue)(prefix, "r", "maxw", maxWidth)), (0, css_1.getResponsiveValue)(prefix, "r", "h", height)), (0, css_1.getResponsiveValue)(prefix, "r", "minh", minHeight)), (0, css_1.getResponsiveValue)(prefix, "r", "maxh", maxHeight)), (0, css_1.getResponsiveValue)(prefix, "r", "position", position)), (0, css_1.getResponsiveProps)(prefix, "r", "inset", "spacing", inset)), (0, css_1.getResponsiveProps)(prefix, "r", "top", "spacing", top)), (0, css_1.getResponsiveProps)(prefix, "r", "right", "spacing", right)), (0, css_1.getResponsiveProps)(prefix, "r", "bottom", "spacing", bottom)), (0, css_1.getResponsiveProps)(prefix, "r", "left", "spacing", left)), (0, css_1.getResponsiveValue)(prefix, "r", "overflow", overflow)), (0, css_1.getResponsiveValue)(prefix, "r", "overflowx", overflowX)), (0, css_1.getResponsiveValue)(prefix, "r", "overflowy", overflowY)), (0, css_1.getResponsiveValue)(prefix, "r", "flex-basis", flexBasis)), (0, css_1.getResponsiveValue)(prefix, "r", "flex-grow", flexGrow)), (0, css_1.getResponsiveValue)(prefix, "r", "flex-shrink", flexShrink)), (0, css_1.getResponsiveValue)(prefix, "r", "grid-column", gridColumn));
-    return (react_1.default.createElement(Slot_1.Slot, { className: cn({
+    const style = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, css_1.getResponsiveProps)("r", "p", "space", padding)), (0, css_1.getResponsiveProps)("r", "pi", "space", paddingInline)), (0, css_1.getResponsiveProps)("r", "pb", "space", paddingBlock)), (0, css_1.getResponsiveProps)("r", "m", "space", margin)), (0, css_1.getResponsiveProps)("r", "mi", "space", marginInline)), (0, css_1.getResponsiveProps)("r", "mb", "space", marginBlock)), (0, css_1.getResponsiveValue)("r", "w", width)), (0, css_1.getResponsiveValue)("r", "minw", minWidth)), (0, css_1.getResponsiveValue)("r", "maxw", maxWidth)), (0, css_1.getResponsiveValue)("r", "h", height)), (0, css_1.getResponsiveValue)("r", "minh", minHeight)), (0, css_1.getResponsiveValue)("r", "maxh", maxHeight)), (0, css_1.getResponsiveValue)("r", "position", position)), (0, css_1.getResponsiveProps)("r", "inset", "space", inset)), (0, css_1.getResponsiveProps)("r", "top", "space", top)), (0, css_1.getResponsiveProps)("r", "right", "space", right)), (0, css_1.getResponsiveProps)("r", "bottom", "space", bottom)), (0, css_1.getResponsiveProps)("r", "left", "space", left)), (0, css_1.getResponsiveValue)("r", "overflow", overflow)), (0, css_1.getResponsiveValue)("r", "overflowx", overflowX)), (0, css_1.getResponsiveValue)("r", "overflowy", overflowY)), (0, css_1.getResponsiveValue)("r", "flex-basis", flexBasis)), (0, css_1.getResponsiveValue)("r", "flex-grow", flexGrow)), (0, css_1.getResponsiveValue)("r", "flex-shrink", flexShrink)), (0, css_1.getResponsiveValue)("r", "grid-column", gridColumn));
+    return (react_1.default.createElement(Slot_1.Slot, { className: (0, className_1.cl)({
             className,
-            "navds-r-p": padding,
-            "navds-r-pi": paddingInline,
-            "navds-r-pb": paddingBlock,
-            "navds-r-m": margin,
-            "navds-r-mi": marginInline,
-            "navds-r-mb": marginBlock,
-            "navds-r-w": width,
-            "navds-r-minw": minWidth,
-            "navds-r-maxw": maxWidth,
-            "navds-r-h": height,
-            "navds-r-minh": minHeight,
-            "navds-r-maxh": maxHeight,
-            "navds-r-position": position,
-            "navds-r-inset": inset,
-            "navds-r-top": top,
-            "navds-r-right": right,
-            "navds-r-bottom": bottom,
-            "navds-r-left": left,
-            "navds-r-overflow": overflow,
-            "navds-r-overflowx": overflowX,
-            "navds-r-overflowy": overflowY,
-            "navds-r-flex-basis": flexBasis,
-            "navds-r-flex-grow": flexGrow,
-            "navds-r-flex-shrink": flexShrink,
-            "navds-r-grid-column": gridColumn,
+            "aksel-r-p": padding,
+            "aksel-r-pi": paddingInline,
+            "aksel-r-pb": paddingBlock,
+            "aksel-r-m": margin,
+            "aksel-r-mi": marginInline,
+            "aksel-r-mb": marginBlock,
+            "aksel-r-w": width,
+            "aksel-r-minw": minWidth,
+            "aksel-r-maxw": maxWidth,
+            "aksel-r-h": height,
+            "aksel-r-minh": minHeight,
+            "aksel-r-maxh": maxHeight,
+            "aksel-r-position": position,
+            "aksel-r-inset": inset,
+            "aksel-r-top": top,
+            "aksel-r-right": right,
+            "aksel-r-bottom": bottom,
+            "aksel-r-left": left,
+            "aksel-r-overflow": overflow,
+            "aksel-r-overflowx": overflowX,
+            "aksel-r-overflowy": overflowY,
+            "aksel-r-flex-basis": flexBasis,
+            "aksel-r-flex-grow": flexGrow,
+            "aksel-r-flex-shrink": flexShrink,
+            "aksel-r-grid-column": gridColumn,
         }), style: style }, children));
 };
 exports.BasePrimitive = BasePrimitive;

package/cjs/layout/base/BasePrimitive.js.map

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

package/cjs/layout/bleed/Bleed.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
 import { ResponsiveProp, SpacingScale } from "../utilities/types";
-export type BleedSpacingInline = "0" | "full" | "px" | SpacingScale;
-export type BleedSpacingBlock = "0" | "px" | SpacingScale;
+export type BleedSpacingInline = "full" | SpacingScale;
+export type BleedSpacingBlock = SpacingScale;
 export interface BleedProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * **Negative** horizontal margin around children.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      *
      * The `px` value is useful to nudge by just 1px.
@@ -14,12 +14,12 @@ export interface BleedProps extends React.HTMLAttributes<HTMLDivElement> {
      * @example
      * marginInline='space-16'
      * marginInline='space-16 space-20'
-     * marginInline={{xs: '0 space-8', sm: 'space-12', md: 'space-16 space-20', lg: 'space-20', xl: 'space-24', "2xl": 'space-32'}}
+     * marginInline={{xs: 'space-0 space-8', sm: 'space-12', md: 'space-16 space-20', lg: 'space-20', xl: 'space-24', "2xl": 'space-32'}}
      */
     marginInline?: ResponsiveProp<BleedSpacingInline | `${BleedSpacingInline} ${BleedSpacingInline}`>;
     /**
      * **Negative** vertical margin around children.
-     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#0cc9fb32f213)
+     * Accepts a [spacing token](https://aksel.nav.no/grunnleggende/styling/design-tokens#space)
      * or an object of spacing tokens for different breakpoints.
      *
      * The `px` value is useful to nudge by just 1px.
@@ -28,7 +28,7 @@ export interface BleedProps extends React.HTMLAttributes<HTMLDivElement> {
      * @example
      * marginBlock='space-16'
      * marginBlock='space-16 space-20'
-     * marginBlock={{xs: '0 space-8', sm: 'space-12', md: 'space-16 space-20', lg: 'space-20', xl: 'space-24', "2xl": 'space-32'}}
+     * marginBlock={{xs: 'space-0 space-8', sm: 'space-12', md: 'space-16 space-20', lg: 'space-20', xl: 'space-24', "2xl": 'space-32'}}
      */
     marginBlock?: ResponsiveProp<BleedSpacingBlock | `${BleedSpacingBlock} ${BleedSpacingBlock}`>;
     /**
@@ -51,7 +51,7 @@ export interface BleedProps extends React.HTMLAttributes<HTMLDivElement> {
  *
  * @example
  * <Box padding="4">
- *   <Bleed marginInline="4" marginBlock="4">
+ *   <Bleed marginInline="space-16" marginBlock="space-16">
  *     <BodyLong>Some content</BodyLong>
  *   </Bleed>
  * </Box>

package/cjs/layout/bleed/Bleed.js

@@ -47,7 +47,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Bleed = void 0;
 const react_1 = __importStar(require("react"));
 const Slot_1 = require("../../slot/Slot");
-const Theme_1 = require("../../theme/Theme");
+const className_1 = require("../../util/className");
 const css_1 = require("../utilities/css");
 /**
  * Foundational Layout-primitive for generic encapsulation & styling.
@@ -58,23 +58,20 @@ const css_1 = require("../utilities/css");
  *
  * @example
  * <Box padding="4">
- *   <Bleed marginInline="4" marginBlock="4">
+ *   <Bleed marginInline="space-16" marginBlock="space-16">
  *     <BodyLong>Some content</BodyLong>
  *   </Bleed>
  * </Box>
  */
 exports.Bleed = (0, react_1.forwardRef)((_a, ref) => {
     var { className, marginInline, marginBlock, reflectivePadding, style: _style, asChild } = _a, rest = __rest(_a, ["className", "marginInline", "marginBlock", "reflectivePadding", "style", "asChild"]);
-    const themeContext = (0, Theme_1.useThemeInternal)();
-    const { cn } = (0, Theme_1.useRenameCSS)();
-    const prefix = (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isDarkside) ? "ax" : "a";
-    let style = Object.assign(Object.assign(Object.assign({}, _style), (0, css_1.getResponsiveProps)(prefix, "bleed", "margin-inline", "spacing", marginInline, true, ["0", "full", "px"])), (0, css_1.getResponsiveProps)(prefix, "bleed", "margin-block", "spacing", marginBlock, true, ["0", "px"]));
+    let style = Object.assign(Object.assign(Object.assign({}, _style), (0, css_1.getResponsiveProps)("bleed", "margin-inline", "space", marginInline, true)), (0, css_1.getResponsiveProps)("bleed", "margin-block", "space", marginBlock, true));
     if (reflectivePadding) {
-        style = Object.assign(Object.assign(Object.assign({}, style), (0, css_1.getResponsiveProps)(prefix, "bleed", "padding-inline", "spacing", marginInline, false, ["0", "full", "px"])), (0, css_1.getResponsiveProps)(prefix, "bleed", "padding-block", "spacing", marginBlock, false, ["0", "px"]));
+        style = Object.assign(Object.assign(Object.assign({}, style), (0, css_1.getResponsiveProps)("bleed", "padding-inline", "space", marginInline, false)), (0, css_1.getResponsiveProps)("bleed", "padding-block", "space", marginBlock, false));
     }
     const Comp = asChild ? Slot_1.Slot : "div";
-    return (react_1.default.createElement(Comp, Object.assign({}, rest, { className: cn("navds-bleed", className, {
-            "navds-bleed--padding": reflectivePadding,
+    return (react_1.default.createElement(Comp, Object.assign({}, rest, { className: (0, className_1.cl)("aksel-bleed", className, {
+            "aksel-bleed--padding": reflectivePadding,
         }), ref: ref, style: style })));
 });
 exports.default = exports.Bleed;

package/cjs/layout/bleed/Bleed.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bleed.js","sourceRoot":"","sources":["../../../src/layout/bleed/Bleed.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAAuC;AACvC,6CAAmE;AACnE,0CAAsD;AAoDtD;;;;;;;;;;;;;GAaG;AACU,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,SAAS,EACT,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,KAAK,EAAE,MAAM,EACb,OAAO,OAER,EADI,IAAI,cAPT,qFAQC,CADQ;IAIT,MAAM,YAAY,GAAG,IAAA,wBAAgB,GAAE,CAAC;IACxC,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAC9B,MAAM,MAAM,GAAG,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAErD,IAAI,KAAK,iDACJ,MAAM,GACN,IAAA,wBAAkB,EACnB,MAAM,EACN,OAAO,EACP,eAAe,EACf,SAAS,EACT,YAAY,EACZ,IAAI,EACJ,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,CACpB,GAEE,IAAA,wBAAkB,EACnB,MAAM,EACN,OAAO,EACP,cAAc,EACd,SAAS,EACT,WAAW,EACX,IAAI,EACJ,CAAC,GAAG,EAAE,IAAI,CAAC,CACZ,CACF,CAAC;IAEF,IAAI,iBAAiB,EAAE,CAAC;QACtB,KAAK,iDACA,KAAK,GACL,IAAA,wBAAkB,EACnB,MAAM,EACN,OAAO,EACP,gBAAgB,EAChB,SAAS,EACT,YAAY,EACZ,KAAK,EACL,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,CACpB,GACE,IAAA,wBAAkB,EACnB,MAAM,EACN,OAAO,EACP,eAAe,EACf,SAAS,EACT,WAAW,EACX,KAAK,EACL,CAAC,GAAG,EAAE,IAAI,CAAC,CACZ,CACF,CAAC;IACJ,CAAC;IAED,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,WAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpC,OAAO,CACL,8BAAC,IAAI,oBACC,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE;YACtC,sBAAsB,EAAE,iBAAiB;SAC1C,CAAC,EACF,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACZ,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,aAAK,CAAC"}
+{"version":3,"file":"Bleed.js","sourceRoot":"","sources":["../../../src/layout/bleed/Bleed.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,0CAAuC;AACvC,oDAA0C;AAC1C,0CAAsD;AAoDtD;;;;;;;;;;;;;GAaG;AACU,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,SAAS,EACT,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,KAAK,EAAE,MAAM,EACb,OAAO,OAER,EADI,IAAI,cAPT,qFAQC,CADQ;IAIT,IAAI,KAAK,iDACJ,MAAM,GACN,IAAA,wBAAkB,EACnB,OAAO,EACP,eAAe,EACf,OAAO,EACP,YAAY,EACZ,IAAI,CACL,GAEE,IAAA,wBAAkB,EACnB,OAAO,EACP,cAAc,EACd,OAAO,EACP,WAAW,EACX,IAAI,CACL,CACF,CAAC;IAEF,IAAI,iBAAiB,EAAE,CAAC;QACtB,KAAK,iDACA,KAAK,GACL,IAAA,wBAAkB,EACnB,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,YAAY,EACZ,KAAK,CACN,GACE,IAAA,wBAAkB,EACnB,OAAO,EACP,eAAe,EACf,OAAO,EACP,WAAW,EACX,KAAK,CACN,CACF,CAAC;IACJ,CAAC;IAED,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,WAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpC,OAAO,CACL,8BAAC,IAAI,oBACC,IAAI,IACR,SAAS,EAAE,IAAA,cAAE,EAAC,aAAa,EAAE,SAAS,EAAE;YACtC,sBAAsB,EAAE,iBAAiB;SAC1C,CAAC,EACF,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACZ,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,aAAK,CAAC"}

package/cjs/layout/box/Box.d.ts

@@ -1,28 +1,32 @@
 import React from "react";
+import type { AkselColoredBorderToken, AkselColoredStatelessBackgroundToken, AkselDynamicStatelessBackgroundToken, AkselRootBackgroundToken, AkselRootBorderToken, AkselShadowToken } from "@navikt/ds-tokens/types";
 import { OverridableComponent } from "../../util/types";
 import { PrimitiveProps } from "../base/BasePrimitive";
 import { PrimitiveAsChildProps } from "../base/PrimitiveAsChildProps";
-import { BackgroundColorToken, BorderColorToken, BorderRadiusScale, ResponsiveProp, ShadowToken, SpaceDelimitedAttribute, SurfaceColorToken } from "../utilities/types";
+import { BorderRadiusScale, ResponsiveProp, SpaceDelimitedAttribute } from "../utilities/types";
 import BoxNew from "./Box.darkside";
 export type BoxProps = React.HTMLAttributes<HTMLDivElement> & {
     /**
      * CSS `background-color` property.
-     * Accepts a [background/surface color token](https://aksel.nav.no/grunnleggende/styling/design-tokens#afff774dad80).
+     * Accepts a [background color token](https://aksel.nav.no/grunnleggende/styling/design-tokens#backgroundColor).
+     * @see {@link AkselRootBackgroundToken}, {@link AkselColoredStatelessBackgroundToken} and {@link AkselDynamicStatelessBackgroundToken}
      */
-    background?: BackgroundColorToken | SurfaceColorToken;
+    background?: AkselRootBackgroundToken | AkselColoredStatelessBackgroundToken | AkselDynamicStatelessBackgroundToken;
     /**
      * CSS `border-color` property.
-     * Accepts a [border color token](https://aksel.nav.no/grunnleggende/styling/design-tokens#adb1767e2f87).
+     * Accepts a [border color token](https://aksel.nav.no/grunnleggende/styling/design-tokens#borderColor).
+     * @see {@link AkselColoredBorderToken}
      */
-    borderColor?: BorderColorToken;
+    borderColor?: Exclude<AkselRootBorderToken, "focus"> | AkselColoredBorderToken;
     /**
      * CSS `border-radius` property.
-     * Accepts a [radius token](https://aksel.nav.no/grunnleggende/styling/design-tokens#6d79c5605d31)
+     * Accepts a [radius token](https://aksel.nav.no/grunnleggende/styling/design-tokens#radius)
      * or an object of radius tokens for different breakpoints.
      * @example
      * borderRadius='full'
      * borderRadius='0 full 12 2'
      * borderRadius={{xs: '2 12', sm: '0', md: '12', lg: 'full'}}
+     * @see {@link BorderRadiusScale}
      */
     borderRadius?: ResponsiveProp<SpaceDelimitedAttribute<BorderRadiusScale | "0">>;
     /**
@@ -35,10 +39,16 @@ export type BoxProps = React.HTMLAttributes<HTMLDivElement> & {
     /** Shadow on box. Accepts a shadow token.
      * @example
      * shadow='small'
+     * @see {@link ShadowKeys}
      */
-    shadow?: ShadowToken;
+    shadow?: AkselShadowToken;
 } & PrimitiveProps & PrimitiveAsChildProps;
 interface BoxComponentType extends OverridableComponent<BoxProps, HTMLDivElement> {
+    /**
+     * @deprecated Deprecated in v8. Use `Box` from '@navikt/ds-react/Box' instead (with same props).
+     *
+     * **Run `npx @navikt/aksel@latest codemod v8-box-new`> to migrate.**
+     */
     New: typeof BoxNew;
 }
 /**
@@ -49,21 +59,21 @@ interface BoxComponentType extends OverridableComponent<BoxProps, HTMLDivElement
  * @see [🤖 OverridableComponent](https://aksel.nav.no/grunnleggende/kode/overridablecomponent) support
  *
  * @example
- * <Box padding="4">
+ * <Box padding="space-16">
  *   <BodyShort>Hei</BodyShort>
  * </Box>
  *
  * @example
- * <Box padding={{xs: '2', sm: '3', md: '4', lg: '5', xl: '6'}}>
+ * <Box padding={{xs: 'space-8', sm: 'space-12', md: 'space-16', lg: 'space-20', xl: 'space-24'}}>
  *   <BodyShort>Hei</BodyShort>
  * </Box>
  *
  * @example
- * <VStack gap="8">
- *  <Box padding="4">
+ * <VStack gap="space-32">
+ *  <Box padding="space-16">
  *   <BodyShort>Hei</BodyShort>
  *  </Box>
- *  <Box padding="4">
+ *  <Box padding="space-16">
  *    <BodyShort>Hei</BodyShort>
  *  </Box>
  * </VStack>