@navikt/ds-react 7.6.0 → 7.7.0

package/esm/layout/page/Page.d.ts

@@ -12,6 +12,7 @@ export interface PageProps extends React.HTMLAttributes<HTMLElement> {
      * Background color.
      * Accepts a [background color token](https://aksel.nav.no/grunnleggende/styling/design-tokens#753d1cf4d1d6).
      * @default "bg-default"
+     * @deprecated 'background'-prop will be removed in future major-versions. Use `<Box asChild background="...">` wrapped around `<Page>`.
      */
     background?: BackgroundColorToken;
     /**

package/esm/layout/page/Page.js

@@ -11,9 +11,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import cl from "clsx";
 import React, { forwardRef } from "react";
+import { UNSAFE_useAkselTheme } from "../../provider/index.js";
 import { PageBlock } from "./parts/PageBlock.js";
 export const PageComponent = forwardRef((_a, ref) => {
     var { as: Component = "div", className, style: _style, footer, children, footerPosition, background = "bg-default", contentBlockPadding = "end" } = _a, rest = __rest(_a, ["as", "className", "style", "footer", "children", "footerPosition", "background", "contentBlockPadding"]);
+    const themeContext = UNSAFE_useAkselTheme(false);
+    if (process.env.NODE_ENV !== "production" && themeContext && background) {
+        console.warn(`Prop \`background\` is deprecated and cannot be used with theme-support. Instead wrap component with \`<Box asChild background>\``);
+    }
     const style = Object.assign(Object.assign({}, _style), { "--__ac-page-background": `var(--a-${background})` });
     const belowFold = footerPosition === "belowFold";
     return (React.createElement(Component, Object.assign({}, rest, { className: cl("navds-page", className), ref: ref, style: style }),

package/esm/layout/page/Page.js.map

@@ -1 +1 @@
-{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../src/layout/page/Page.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAkC9C,MAAM,CAAC,MAAM,aAAa,GACxB,UAAU,CACR,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,SAAS,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EACN,QAAQ,EACR,cAAc,EACd,UAAU,GAAG,YAAY,EACzB,mBAAmB,GAAG,KAAK,OAE5B,EADI,IAAI,cATT,yGAUC,CADQ;IAIT,MAAM,KAAK,mCACN,MAAM,KACT,wBAAwB,EAAE,WAAW,UAAU,GAAG,GACnD,CAAC;IAEF,MAAM,SAAS,GAAG,cAAc,KAAK,WAAW,CAAC;IAEjD,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,EACtC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK;QAEZ,6BACE,SAAS,EAAE,EAAE,CAAC;gBACZ,iCAAiC,EAAE,SAAS;gBAC5C,2BAA2B,EAAE,CAAC,SAAS;gBACvC,8BAA8B,EAAE,mBAAmB,KAAK,KAAK;aAC9D,CAAC,IAED,QAAQ,CACL;QACL,MAAM,CACG,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,IAAI,GAAG,aAAkC,CAAC;AAEhD,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;AAEvB,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../src/layout/page/Page.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAGtD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAmC9C,MAAM,CAAC,MAAM,aAAa,GACxB,UAAU,CACR,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,SAAS,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EACN,QAAQ,EACR,cAAc,EACd,UAAU,GAAG,YAAY,EACzB,mBAAmB,GAAG,KAAK,OAE5B,EADI,IAAI,cATT,yGAUC,CADQ;IAIT,MAAM,YAAY,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAEjD,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,IAAI,YAAY,IAAI,UAAU,EAAE,CAAC;QACxE,OAAO,CAAC,IAAI,CACV,mIAAmI,CACpI,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,mCACN,MAAM,KACT,wBAAwB,EAAE,WAAW,UAAU,GAAG,GACnD,CAAC;IAEF,MAAM,SAAS,GAAG,cAAc,KAAK,WAAW,CAAC;IAEjD,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,EACtC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK;QAEZ,6BACE,SAAS,EAAE,EAAE,CAAC;gBACZ,iCAAiC,EAAE,SAAS;gBAC5C,2BAA2B,EAAE,CAAC,SAAS;gBACvC,8BAA8B,EAAE,mBAAmB,KAAK,KAAK;aAC9D,CAAC,IAED,QAAQ,CACL;QACL,MAAM,CACG,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,IAAI,GAAG,aAAkC,CAAC;AAEhD,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;AAEvB,eAAe,IAAI,CAAC"}

package/esm/layout/stack/Stack.js

@@ -11,13 +11,16 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import cl from "clsx";
 import React, { forwardRef } from "react";
+import { UNSAFE_useAkselTheme } from "../../provider/index.js";
 import { Slot } from "../../slot/Slot.js";
 import { omit } from "../../util/index.js";
 import BasePrimitive, { PRIMITIVE_PROPS, } from "../base/BasePrimitive.js";
 import { getResponsiveProps, getResponsiveValue } from "../utilities/css.js";
 export const Stack = forwardRef((_a, ref) => {
     var { children, className, as: Component = "div", align, justify, wrap = true, gap, style: _style, direction = "row", asChild } = _a, rest = __rest(_a, ["children", "className", "as", "align", "justify", "wrap", "gap", "style", "direction", "asChild"]);
-    const style = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, _style), getResponsiveProps(`stack`, "gap", "spacing", gap)), getResponsiveValue(`stack`, "direction", direction)), getResponsiveValue(`stack`, "align", align)), getResponsiveValue(`stack`, "justify", justify));
+    const themeContext = UNSAFE_useAkselTheme(false);
+    const prefix = themeContext ? "ax" : "a";
+    const style = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, _style), getResponsiveProps(prefix, `stack`, "gap", "spacing", gap)), getResponsiveValue(prefix, `stack`, "direction", direction)), getResponsiveValue(prefix, `stack`, "align", align)), getResponsiveValue(prefix, `stack`, "justify", justify));
     const Comp = asChild ? Slot : Component;
     return (React.createElement(BasePrimitive, Object.assign({}, rest),
         React.createElement(Comp, Object.assign({}, omit(rest, PRIMITIVE_PROPS), { ref: ref, style: style, className: cl("navds-stack", className, {

package/esm/layout/stack/Stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.js","sourceRoot":"","sources":["../../../src/layout/stack/Stack.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,OAAO,aAAa,EAAE,EACpB,eAAe,GAEhB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAyD1E,MAAM,CAAC,MAAM,KAAK,GAChB,UAAU,CACR,CACE,EAYC,EACD,GAAG,EACH,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,KAAK,EACL,OAAO,EACP,IAAI,GAAG,IAAI,EACX,GAAG,EACH,KAAK,EAAE,MAAM,EACb,SAAS,GAAG,KAAK,EACjB,OAAO,OAER,EADI,IAAI,cAXT,mGAYC,CADQ;IAIT,MAAM,KAAK,6EACN,MAAM,GACN,kBAAkB,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,GAClD,kBAAkB,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,CAAC,GACnD,kBAAkB,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,GAC3C,kBAAkB,CAAC,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,CACnD,CAAC;IAEF,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;IAExC,OAAO,CACL,oBAAC,aAAa,oBAAK,IAAI;QACrB,oBAAC,IAAI,oBACC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,IAC/B,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE;gBACtC,cAAc,EAAE,SAAS,KAAK,QAAQ;gBACtC,cAAc,EAAE,SAAS,KAAK,KAAK;gBACnC,iBAAiB,EAAE,GAAG;gBACtB,mBAAmB,EAAE,KAAK;gBAC1B,qBAAqB,EAAE,OAAO;gBAC9B,uBAAuB,EAAE,SAAS;gBAClC,kBAAkB,EAAE,IAAI;aACzB,CAAC,KAED,QAAQ,CACJ,CACO,CACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Stack.js","sourceRoot":"","sources":["../../../src/layout/stack/Stack.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,OAAO,aAAa,EAAE,EACpB,eAAe,GAEhB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAyD1E,MAAM,CAAC,MAAM,KAAK,GAChB,UAAU,CACR,CACE,EAYC,EACD,GAAG,EACH,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,KAAK,EACL,OAAO,EACP,IAAI,GAAG,IAAI,EACX,GAAG,EACH,KAAK,EAAE,MAAM,EACb,SAAS,GAAG,KAAK,EACjB,OAAO,OAER,EADI,IAAI,cAXT,mGAYC,CADQ;IAIT,MAAM,YAAY,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACjD,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAEzC,MAAM,KAAK,6EACN,MAAM,GACN,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,GAC1D,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,CAAC,GAC3D,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,GACnD,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,CAC3D,CAAC;IAEF,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;IAExC,OAAO,CACL,oBAAC,aAAa,oBAAK,IAAI;QACrB,oBAAC,IAAI,oBACC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,IAC/B,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE;gBACtC,cAAc,EAAE,SAAS,KAAK,QAAQ;gBACtC,cAAc,EAAE,SAAS,KAAK,KAAK;gBACnC,iBAAiB,EAAE,GAAG;gBACtB,mBAAmB,EAAE,KAAK;gBAC1B,qBAAqB,EAAE,OAAO;gBAC9B,uBAAuB,EAAE,SAAS;gBAClC,kBAAkB,EAAE,IAAI;aACzB,CAAC,KAED,QAAQ,CACJ,CACO,CACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ,eAAe,KAAK,CAAC"}

package/esm/layout/utilities/css.d.ts

@@ -1,7 +1,7 @@
 import { ResponsiveProp } from "./types.js";
-export declare function getResponsiveValue<T = string>(componentName: string, componentProp: string, responsiveProp?: ResponsiveProp<T>): {
+export declare function getResponsiveValue<T = string>(prefix: string, componentName: string, componentProp: string, responsiveProp?: ResponsiveProp<T>): {
     [k: string]: T;
 };
-export declare function getResponsiveProps<T extends string>(componentName: string, componentProp: string, tokenSubgroup: string, responsiveProp?: ResponsiveProp<T>, invert?: boolean, tokenExceptions?: string[]): {
+export declare function getResponsiveProps<T extends string>(prefix: string, componentName: string, componentProp: string, tokenSubgroup: string, responsiveProp?: ResponsiveProp<T>, invert?: boolean, tokenExceptions?: string[]): {
     [x: string]: string;
 };

package/esm/layout/utilities/css.js

@@ -1,14 +1,14 @@
-export function getResponsiveValue(componentName, componentProp, responsiveProp) {
+export function getResponsiveValue(prefix, componentName, componentProp, responsiveProp) {
     if (!responsiveProp) {
         return {};
     }
     if (typeof responsiveProp === "string") {
         return {
-            [`--__ac-${componentName}-${componentProp}-xs`]: responsiveProp,
+            [`--__${prefix}c-${componentName}-${componentProp}-xs`]: responsiveProp,
         };
     }
     return Object.fromEntries(Object.entries(responsiveProp).map(([breakpointAlias, responsiveValue]) => [
-        `--__ac-${componentName}-${componentProp}-${breakpointAlias}`,
+        `--__${prefix}c-${componentName}-${componentProp}-${breakpointAlias}`,
         responsiveValue,
     ]));
 }
@@ -19,7 +19,7 @@ const translateExceptionToCSS = (exception) => {
     }
     return exception;
 };
-const translateTokenStringToCSS = (componentProp, tokenString, tokenSubgroup, tokenExceptions, invert) => {
+const translateTokenStringToCSS = (componentProp, tokenString, tokenSubgroup, tokenExceptions, invert, prefix) => {
     return tokenString
         .split(" ")
         .map((x, _, arr) => {
@@ -34,7 +34,7 @@ const translateTokenStringToCSS = (componentProp, tokenString, tokenSubgroup, to
         if (["mi", "mb"].includes(componentProp) && x === "auto") {
             return "auto";
         }
-        let output = `var(--a-${tokenSubgroup}-${x})`;
+        let output = `var(--${prefix}-${tokenSubgroup}-${x})`;
         if (tokenExceptions.includes(x)) {
             output = translateExceptionToCSS(x);
         }
@@ -48,19 +48,18 @@ const translateTokenStringToCSS = (componentProp, tokenString, tokenSubgroup, to
     })
         .join(" ");
 };
-export function getResponsiveProps(componentName, componentProp, tokenSubgroup, responsiveProp, invert = false, tokenExceptions = []) {
+export function getResponsiveProps(prefix, componentName, componentProp, tokenSubgroup, responsiveProp, invert = false, tokenExceptions = []) {
     if (!responsiveProp) {
         return {};
     }
     if (typeof responsiveProp === "string") {
         return {
-            [`--__ac-${componentName}-${componentProp}-xs`]: translateTokenStringToCSS(componentProp, responsiveProp, tokenSubgroup, tokenExceptions, invert),
+            [`--__${prefix}c-${componentName}-${componentProp}-xs`]: translateTokenStringToCSS(componentProp, responsiveProp, tokenSubgroup, tokenExceptions, invert, prefix),
         };
     }
     const styleProps = {};
     Object.entries(responsiveProp).forEach(([breakpointAlias, aliasOrScale]) => {
-        styleProps[`--__ac-${componentName}-${componentProp}-${breakpointAlias}`] =
-            translateTokenStringToCSS(componentProp, aliasOrScale, tokenSubgroup, tokenExceptions, invert);
+        styleProps[`--__${prefix}c-${componentName}-${componentProp}-${breakpointAlias}`] = translateTokenStringToCSS(componentProp, aliasOrScale, tokenSubgroup, tokenExceptions, invert, prefix);
     });
     return styleProps;
 }

package/esm/layout/utilities/css.js.map

@@ -1 +1 @@
-{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../src/layout/utilities/css.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../src/layout/utilities/css.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,kBAAkB,CAChC,MAAc,EACd,aAAqB,EACrB,aAAqB,EACrB,cAAkC;IAElC,IAAI,CAAC,cAAc,EAAE,CAAC;QACpB,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,IAAI,OAAO,cAAc,KAAK,QAAQ,EAAE,CAAC;QACvC,OAAO;YACL,CAAC,OAAO,MAAM,KAAK,aAAa,IAAI,aAAa,KAAK,CAAC,EAAE,cAAc;SACxE,CAAC;IACJ,CAAC;IAED,OAAO,MAAM,CAAC,WAAW,CACvB,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,eAAe,EAAE,eAAe,CAAC,EAAE,EAAE,CAAC;QACzE,OAAO,MAAM,KAAK,aAAa,IAAI,aAAa,IAAI,eAAe,EAAE;QACrE,eAAe;KAChB,CAAC,CACH,CAAC;AACJ,CAAC;AAED,MAAM,uBAAuB,GAAG,CAAC,SAAiB,EAAE,EAAE;IACpD,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,IAAI;YACP,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,MAAM,yBAAyB,GAAG,CAChC,aAAqB,EACrB,WAAmB,EACnB,aAAqB,EACrB,eAAyB,EACzB,MAAe,EACf,MAAc,EACd,EAAE;IACF,OAAO,WAAW;SACf,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE;QACjB,IAAI,aAAa,KAAK,eAAe,IAAI,CAAC,KAAK,MAAM,EAAE,CAAC;YACtD,MAAM,KAAK,GAAG,GAAG,GAAG,GAAG,CAAC,MAAM,CAAC;YAC/B,OAAO,iBAAiB,KAAK,QAAQ,CAAC;QACxC,CAAC;QAED,IAAI,aAAa,KAAK,gBAAgB,IAAI,CAAC,KAAK,MAAM,EAAE,CAAC;YACvD,MAAM,KAAK,GAAG,GAAG,GAAG,GAAG,CAAC,MAAM,CAAC;YAC/B,OAAO,iBAAiB,KAAK,OAAO,CAAC;QACvC,CAAC;QACD,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,MAAM,EAAE,CAAC;YACzD,OAAO,MAAM,CAAC;QAChB,CAAC;QAED,IAAI,MAAM,GAAG,SAAS,MAAM,IAAI,aAAa,IAAI,CAAC,GAAG,CAAC;QACtD,IAAI,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;YAChC,MAAM,GAAG,uBAAuB,CAAC,CAAC,CAAC,CAAC;QACtC,CAAC;QACD,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;gBACd,OAAO,GAAG,CAAC;YACb,CAAC;YACD,OAAO,aAAa,MAAM,GAAG,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC,CAAC;SACD,IAAI,CAAC,GAAG,CAAC,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,UAAU,kBAAkB,CAChC,MAAc,EACd,aAAqB,EACrB,aAAqB,EACrB,aAAqB,EACrB,cAAkC,EAClC,MAAM,GAAG,KAAK,EACd,kBAA4B,EAAE;IAE9B,IAAI,CAAC,cAAc,EAAE,CAAC;QACpB,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,IAAI,OAAO,cAAc,KAAK,QAAQ,EAAE,CAAC;QACvC,OAAO;YACL,CAAC,OAAO,MAAM,KAAK,aAAa,IAAI,aAAa,KAAK,CAAC,EACrD,yBAAyB,CACvB,aAAa,EACb,cAAc,EACd,aAAa,EACb,eAAe,EACf,MAAM,EACN,MAAM,CACP;SACJ,CAAC;IACJ,CAAC;IAED,MAAM,UAAU,GAAG,EAAE,CAAC;IACtB,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,EAAE,YAAY,CAAC,EAAE,EAAE;QACzE,UAAU,CACR,OAAO,MAAM,KAAK,aAAa,IAAI,aAAa,IAAI,eAAe,EAAE,CACtE,GAAG,yBAAyB,CAC3B,aAAa,EACb,YAAY,EACZ,aAAa,EACb,eAAe,EACf,MAAM,EACN,MAAM,CACP,CAAC;IACJ,CAAC,CAAC,CAAC;IACH,OAAO,UAAU,CAAC;AACpB,CAAC"}

package/esm/layout/utilities/types.d.ts

@@ -1,3 +1,6 @@
+import { semanticTokenConfig } from "@navikt/ds-tokens/darkside/tokens/semantic";
+import { SemanticTokensForAllRolesConfigT } from "@navikt/ds-tokens/darkside/tokens/semantic-roles";
+import { shadowTokenConfig } from "@navikt/ds-tokens/darkside/tokens/shadow";
 import borderRadii from "@navikt/ds-tokens/src/border.json";
 import bgColors from "@navikt/ds-tokens/src/colors-bg.json";
 import borderColors from "@navikt/ds-tokens/src/colors-border.json";
@@ -16,4 +19,11 @@ type FixedResponsiveT<T> = {
     [Breakpoint in BreakpointsAlias]?: T;
 };
 export type ResponsiveProp<T> = T | FixedResponsiveT<T>;
+/**
+ * Darkside tokens
+ */
+export type SemanticShadowTokens = keyof ReturnType<typeof shadowTokenConfig>["shadow"];
+export type SemanticStaticBgDarkside = keyof ReturnType<typeof semanticTokenConfig>["bg"];
+export type SemanticRoleBgDarkside = keyof SemanticTokensForAllRolesConfigT<"color">["bg"];
+export type SemanticStaticBorderDarkside = keyof ReturnType<typeof semanticTokenConfig>["border"];
 export {};

package/esm/util/i18n/locales/en.d.ts

@@ -41,9 +41,16 @@ declare const _default: {
             labelSuffix: string;
         };
     };
+    CopyButton: {
+        title: string;
+        activeText: string;
+    };
     ErrorSummary: {
         heading: string;
     };
+    FormSummary: {
+        editAnswer: string;
+    };
     Loader: {
         title: string;
     };
@@ -112,5 +119,17 @@ declare const _default: {
         closeDatePicker: string;
         closeMonthPicker: string;
     };
+    Combobox: {
+        addOption: string;
+        loading: string;
+        maxSelected: string;
+        clear: string;
+    };
+    GuidePanel: {
+        illustrationLabel: string;
+    };
+    HelpText: {
+        title: string;
+    };
 };
 export default _default;

package/esm/util/i18n/locales/en.js

@@ -42,9 +42,16 @@ export default {
             labelSuffix: "delete",
         },
     },
+    CopyButton: {
+        title: "Copy",
+        activeText: "Copied!",
+    },
     ErrorSummary: {
         heading: "You must correct the following errors before you can continue:",
     },
+    FormSummary: {
+        editAnswer: "Edit answer",
+    },
     Loader: {
         title: "Waiting…",
     },
@@ -113,5 +120,17 @@ export default {
         closeDatePicker: "Close date picker",
         closeMonthPicker: "Close month picker",
     },
+    Combobox: {
+        addOption: "Add",
+        loading: "Searching…",
+        maxSelected: "{selected} of max {limit} are selected.",
+        clear: "Clear",
+    },
+    GuidePanel: {
+        illustrationLabel: "Illustration of advisor",
+    },
+    HelpText: {
+        title: "More information",
+    },
 };
 //# sourceMappingURL=en.js.map

package/esm/util/i18n/locales/en.js.map

@@ -1 +1 @@
-{"version":3,"file":"en.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/en.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"en.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/en.ts"],"names":[],"mappings":"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"}

package/esm/util/i18n/locales/nb.d.ts

@@ -43,9 +43,16 @@ declare const _default: {
             labelSuffix: string;
         };
     };
+    CopyButton: {
+        title: string;
+        activeText: string;
+    };
     ErrorSummary: {
         heading: string;
     };
+    FormSummary: {
+        editAnswer: string;
+    };
     Loader: {
         title: string;
     };
@@ -115,5 +122,19 @@ declare const _default: {
         closeDatePicker: string;
         closeMonthPicker: string;
     };
+    Combobox: {
+        /** The input value will be appended to the end of this text, e.g. `Legg til "input value"`. */
+        addOption: string;
+        /** Loader title */
+        loading: string;
+        maxSelected: string;
+        clear: string;
+    };
+    GuidePanel: {
+        illustrationLabel: string;
+    };
+    HelpText: {
+        title: string;
+    };
 };
 export default _default;

package/esm/util/i18n/locales/nb.js

@@ -43,9 +43,16 @@ export default {
             labelSuffix: "slett",
         },
     },
+    CopyButton: {
+        title: "Kopier",
+        activeText: "Kopiert!",
+    },
     ErrorSummary: {
         heading: "Du må rette disse feilene før du kan fortsette:",
     },
+    FormSummary: {
+        editAnswer: "Endre svar",
+    },
     Loader: {
         title: "Venter…",
     },
@@ -115,5 +122,19 @@ export default {
         closeDatePicker: "Lukk datovelger",
         closeMonthPicker: "Lukk månedsvelger",
     },
+    Combobox: {
+        /** The input value will be appended to the end of this text, e.g. `Legg til "input value"`. */
+        addOption: "Legg til",
+        /** Loader title */
+        loading: "Søker…",
+        maxSelected: "{selected} av maks {limit} er valgt.",
+        clear: "Tøm",
+    },
+    GuidePanel: {
+        illustrationLabel: "Illustrasjon av veileder",
+    },
+    HelpText: {
+        title: "Mer informasjon",
+    },
 };
 //# sourceMappingURL=nb.js.map

package/esm/util/i18n/locales/nb.js.map

@@ -1 +1 @@
-{"version":3,"file":"nb.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/nb.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"nb.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/nb.ts"],"names":[],"mappings":"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"}

package/esm/util/i18n/locales/nn.d.ts

@@ -41,9 +41,16 @@ declare const _default: {
             labelSuffix: string;
         };
     };
+    CopyButton: {
+        title: string;
+        activeText: string;
+    };
     ErrorSummary: {
         heading: string;
     };
+    FormSummary: {
+        editAnswer: string;
+    };
     Loader: {
         title: string;
     };
@@ -112,5 +119,17 @@ declare const _default: {
         closeDatePicker: string;
         closeMonthPicker: string;
     };
+    Combobox: {
+        addOption: string;
+        loading: string;
+        maxSelected: string;
+        clear: string;
+    };
+    GuidePanel: {
+        illustrationLabel: string;
+    };
+    HelpText: {
+        title: string;
+    };
 };
 export default _default;

package/esm/util/i18n/locales/nn.js

@@ -42,9 +42,16 @@ export default {
             labelSuffix: "slett",
         },
     },
+    CopyButton: {
+        title: "Kopier",
+        activeText: "Kopiert!",
+    },
     ErrorSummary: {
         heading: "Du må rette desse feila før du kan halde fram:",
     },
+    FormSummary: {
+        editAnswer: "Endre svar",
+    },
     Loader: {
         title: "Ventar…",
     },
@@ -113,5 +120,17 @@ export default {
         closeDatePicker: "Lukk datoveljar",
         closeMonthPicker: "Lukk månadsveljar",
     },
+    Combobox: {
+        addOption: "Legg til",
+        loading: "Søker…",
+        maxSelected: "{selected} av maks {limit} er valt.",
+        clear: "Tøm",
+    },
+    GuidePanel: {
+        illustrationLabel: "Illustrasjon av rettleiar",
+    },
+    HelpText: {
+        title: "Meir informasjon",
+    },
 };
 //# sourceMappingURL=nn.js.map

package/esm/util/i18n/locales/nn.js.map

@@ -1 +1 @@
-{"version":3,"file":"nn.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/nn.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"nn.js","sourceRoot":"","sources":["../../../../src/util/i18n/locales/nn.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "7.6.0",
+  "version": "7.7.0",
   "description": "React components from the Norwegian Labour and Welfare Administration.",
   "author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
   "license": "MIT",
@@ -604,8 +604,8 @@
   "dependencies": {
     "@floating-ui/react": "0.25.4",
     "@floating-ui/react-dom": "^2.0.9",
-    "@navikt/aksel-icons": "^7.6.0",
-    "@navikt/ds-tokens": "^7.6.0",
+    "@navikt/aksel-icons": "^7.7.0",
+    "@navikt/ds-tokens": "^7.7.0",
     "clsx": "^2.1.0",
     "date-fns": "^3.0.0",
     "react-day-picker": "8.10.1"

package/src/copybutton/CopyButton.tsx

@@ -10,6 +10,7 @@ import { CheckmarkIcon, FilesIcon } from "@navikt/aksel-icons";
 import { Label } from "../typography";
 import { composeEventHandlers } from "../util/composeEventHandlers";
 import copy from "../util/copy";
+import { useI18n } from "../util/i18n/i18n.context";
 
 export interface CopyButtonProps
   extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
@@ -32,7 +33,7 @@ export interface CopyButtonProps
   text?: string;
   /**
    * Text shown when button is clicked.
-   * Only set if used with `text`-prop.
+   * Will be used as accessible label (title) if `text`-prop is not set.
    * @default "Kopiert!"
    */
   activeText?: string;
@@ -62,11 +63,6 @@ export interface CopyButtonProps
    * @default "Kopier"
    */
   title?: string;
-  /**
-   * Accessible label for icon in active-state (ignored if text is set).
-   * @default "Kopiert"
-   */
-  activeTitle?: string;
   /**
    * Icon position in button.
    * @default "left"
@@ -91,15 +87,14 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
       className,
       copyText,
       text,
-      activeText = "Kopiert!",
+      activeText,
       variant = "neutral",
       size = "medium",
       onActiveChange,
       icon,
       activeIcon,
       activeDuration = 2000,
-      title = "Kopier",
-      activeTitle = "Kopiert",
+      title,
       iconPosition = "left",
       onClick,
       ...rest
@@ -108,6 +103,7 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
   ) => {
     const [active, setActive] = useState(false);
     const timeoutRef = useRef<number>();
+    const translate = useI18n("CopyButton");
 
     useEffect(() => {
       return () => {
@@ -127,19 +123,21 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
       }, activeDuration);
     };
 
+    const activeString = activeText || translate("activeText");
+
     const copyIcon = (
       <span className="navds-copybutton__icon">
         {active
           ? activeIcon ?? (
               <CheckmarkIcon
                 aria-hidden={!!text}
-                title={text ? undefined : activeTitle}
+                title={text ? undefined : activeString}
               />
             )
           : icon ?? (
               <FilesIcon
                 aria-hidden={!!text}
-                title={text ? undefined : title}
+                title={text ? undefined : title || translate("title")}
               />
             )}
       </span>
@@ -150,7 +148,6 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
         ref={ref}
         type="button"
         {...rest}
-        aria-live="polite"
         className={cl(
           "navds-copybutton",
           className,
@@ -166,24 +163,11 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
       >
         <span className="navds-copybutton__content">
           {iconPosition === "left" && copyIcon}
-          {text &&
-            (active ? (
-              <Label
-                as="span"
-                size={size === "medium" ? "medium" : "small"}
-                aria-live="polite"
-              >
-                {activeText}
-              </Label>
-            ) : (
-              <Label
-                as="span"
-                size={size === "medium" ? "medium" : "small"}
-                aria-live="polite"
-              >
-                {text}
-              </Label>
-            ))}
+          {text && (
+            <Label as="span" size={size === "medium" ? "medium" : "small"}>
+              {active ? activeString : text}
+            </Label>
+          )}
           {iconPosition === "right" && copyIcon}
         </span>
       </button>

package/src/date/datepicker/parts/WeekNumber.tsx

@@ -1,6 +1,9 @@
 /* https://github.com/gpbl/react-day-picker/blob/7f78cd5/src/components/WeekNumber/WeekNumber.tsx#L21 */
 import React from "react";
-import { Button, useDayPicker } from "react-day-picker";
+import { Button as RDPButton, useDayPicker } from "react-day-picker";
+import { Button } from "../../../button";
+import { UNSAFE_useAkselTheme } from "../../../provider";
+import { Detail } from "../../../typography";
 import { useI18n } from "../../../util/i18n/i18n.context";
 import { getTranslations } from "../../utils";
 
@@ -24,32 +27,54 @@ function WeekNumber({
     classNames,
     locale: { code },
   } = useDayPicker();
+  const themeContext = UNSAFE_useAkselTheme(false);
   const translate = useI18n("DatePicker", getTranslations(code));
 
   if (!onWeekNumberClick) {
     return (
-      <span
+      <Detail
+        as="span"
+        textColor="subtle"
         className={classNames.weeknumber}
         style={styles.weeknumber}
         aria-label={translate("weekNumber", { week: weekNumber })}
       >
         {weekNumber}
-      </span>
+      </Detail>
+    );
+  }
+
+  if (themeContext) {
+    return (
+      <Button
+        variant="secondary-neutral"
+        size="small"
+        name="week-number"
+        aria-label={translate("selectWeekNumber", { week: weekNumber })}
+        style={styles.weeknumber}
+        className="navds-date__weeknumber"
+        onClick={(event) => {
+          onWeekNumberClick(weekNumber, dates, event);
+        }}
+        icon={
+          <span className="navds-date__weeknumber-number">{weekNumber}</span>
+        }
+      />
     );
   }
 
   return (
-    <Button
+    <RDPButton
       name="week-number"
       aria-label={translate("selectWeekNumber", { week: weekNumber })}
-      className={classNames.weeknumber}
       style={styles.weeknumber}
+      className={classNames.weeknumber}
       onClick={(event) => {
         onWeekNumberClick(weekNumber, dates, event);
       }}
     >
       {weekNumber}
-    </Button>
+    </RDPButton>
   );
 }