@altinn/altinn-components 0.52.6 → 0.53.0

package/dist/{textfield-B_OMMEbF.js → textfield-C_c2H05R.js}

@@ -4,18 +4,17 @@ import xe, { forwardRef as w, useState as A, useRef as F, useEffect as D, create
 import { jsx as c, jsxs as _, Fragment as Se } from "react/jsx-runtime";
 import { c as E } from "./lite-1fxw3LjI.js";
 import { S as M, a as _t } from "./index-D7FJjvrv.js";
-import { C as q, u as ke, a as qe, o as ce, p as P, r as Ee, b as _e, i as Nt, c as Mt, d as zt, e as Tt, f as Rt, g as Pt, h as Dt, s as Ft, j as At, k as Ue, l as Lt, m as ae, F as Bt, n as Vt, q as $t, t as jt, v as Wt, w as Kt, x as Ht } from "./index-Dg71_7ad.js";
+import { C as q, u as ke, a as qe, o as ce, p as P, r as Ee, b as _e, i as Nt, c as Mt, d as zt, e as Tt, f as Rt, g as Pt, h as Dt, s as Ft, j as At, k as Ue, l as Lt, m as ae, F as Bt, n as Vt, q as $t, t as jt, v as Wt, w as Kt, x as Ht } from "./index-DttADHE1.js";
 import { flushSync as Xe } from "react-dom";
-import { S as qt, u as Ut } from "./spinner-0Qe_jRGB.js";
+import { S as qt, B as ue, u as Ut } from "./button-BB5sYVKY.js";
 import { V as Ne, u as Me, F as de, a as Xt, b as Yt, c as Ve } from "./index-z82sbSVU.js";
 import { P as Ie } from "./paragraph-BRiIBpbY.js";
-import { I as ue } from "./input-wBv_FkEV.js";
+import { I as he } from "./input-wBv_FkEV.js";
 import { S as Gt } from "./XMark-tKk6aExO.js";
 import { S as Jt, a as Qt } from "./ChevronUp-_BBfEirx.js";
 import { L as K } from "./label-xTmTyPhk.js";
 import { u as Zt } from "./useId-BVFxCjkq.js";
 import { S as en } from "./Checkmark-Byz_C9x4.js";
-import { B as he } from "./button-MzZgmHyA.js";
 import { u as U } from "./use-merge-refs-Cj4kTYVj.js";
 import { T as tn } from "./textarea-BBstVlPT.js";
 var nn = function(o, s) {
@@ -126,7 +125,7 @@ const an = w(({ value: o, asChild: s, ...e }, t) => {
 }), ln = (o, s, e) => {
   const t = (e - 1) / 2, n = Math.max(1, Math.min(Math.max(o - Math.floor(t), 1), s - e + 1)), i = Math.min(Math.max(o + Math.ceil(t), e), s), r = Array.from({ length: i + 1 - n }, (a, l) => l + n);
   return e > 4 && n > 1 && r.splice(0, 2, 1, 0), e > 3 && i < s && r.splice(-2, 2, 0, s), r;
-}, po = ({ currentPage: o = 1, setCurrentPage: s, onChange: e, totalPages: t = 1, showPages: n = 7 }) => J(() => {
+}, mo = ({ currentPage: o = 1, setCurrentPage: s, onChange: e, totalPages: t = 1, showPages: n = 7 }) => J(() => {
   const i = o < t, r = o !== 1, a = (l) => (d) => {
     if (l < 1 || l > t)
       return d.preventDefault();
@@ -776,7 +775,7 @@ const Qe = w(function({ asChild: s, className: e, ...t }, n) {
   return c(Qe, { "data-removable": !0, ref: e, ...s });
 }), et = w(function({ asChild: s, children: e, className: t, "data-size": n, "data-color": i, ...r }, a) {
   const l = r.type ?? "checkbox";
-  return _(s ? M : "label", { className: E("ds-chip", t), "data-size": n, "data-color": i, ref: a, children: [c(ue, { ...r, type: l }), c(_t, { children: e })] });
+  return _(s ? M : "label", { className: E("ds-chip", t), "data-size": n, "data-color": i, ref: a, children: [c(he, { ...r, type: l }), c(_t, { children: e })] });
 }), In = w(function(s, e) {
   return c(et, { ref: e, type: "radio", ...s });
 }), fe = {
@@ -1223,8 +1222,8 @@ me.Option = ze;
 me.Empty = ct;
 me.Option.displayName = "Combobox.Option";
 me.Empty.displayName = "Combobox.Empty";
-const bo = w(function({ "data-size": s, className: e, style: t, children: n, label: i, description: r, error: a, ...l }, d) {
-  return _(de, { "data-size": s, className: e, style: t, children: [c(ue, { type: "checkbox", ref: d, ...l }), !!i && c(K, { weight: "regular", children: i }), !!r && c("div", { "data-field": "description", children: r }), !!a && c(Ne, { children: a })] });
+const po = w(function({ "data-size": s, className: e, style: t, children: n, label: i, description: r, error: a, ...l }, d) {
+  return _(de, { "data-size": s, className: e, style: t, children: [c(he, { type: "checkbox", ref: d, ...l }), !!i && c(K, { weight: "regular", children: i }), !!r && c("div", { "data-field": "description", children: r }), !!a && c(Ne, { children: a })] });
 }), Te = se({
   current: null
 }), dt = ({ children: o }) => {
@@ -1259,12 +1258,12 @@ const Dn = w(function({ asChild: s, children: e, className: t, placement: n = "c
   }, [r]), D(() => {
     const b = (v) => l?.(v), m = f.current;
     return m?.addEventListener("close", b), () => m?.removeEventListener("close", b);
-  }, [l]), _(g, { className: E("ds-dialog", t), ref: y, "data-placement": n, "data-modal": a, closedby: r, ...h, children: [i !== !1 && c(he, { "aria-label": i, "data-color": "neutral", icon: !0, variant: "tertiary", "data-command": "close" }), e] });
+  }, [l]), _(g, { className: E("ds-dialog", t), ref: y, "data-placement": n, "data-modal": a, closedby: r, ...h, children: [i !== !1 && c(ue, { "aria-label": i, "data-color": "neutral", icon: !0, variant: "tertiary", "data-command": "close" }), e] });
 }), Fn = w(function({ asChild: s, className: e, ...t }, n) {
   return c(s ? M : "div", { className: E("ds-dialog__block", e), ref: n, ...t });
 }), An = w(function({ asChild: s, ...e }, t) {
   const n = R(Te);
-  return c(s ? M : he, { "aria-haspopup": "dialog", onClick: () => {
+  return c(s ? M : ue, { "aria-haspopup": "dialog", onClick: () => {
     n.current?.getAttribute("data-modal") === "true" ? n.current?.showModal() : n.current?.show();
   }, ref: t, ...e });
 }), Re = Object.assign(Dn, {
@@ -1336,16 +1335,16 @@ const Pe = se({}), Ln = w(function({ id: s, className: e, onClose: t, onOpen: n,
     return s.floating.setAttribute("data-placement", t.split("-")[0]), s.floating.style.setProperty("--ds-popover-arrow-x", n), s.floating.style.setProperty("--ds-popover-arrow-y", i), o;
   }
 }, Vn = w(function({ id: s, inline: e, asChild: t, ...n }, i) {
-  const { popoverId: r } = R(Pe), a = t ? M : e ? "button" : he, l = Object.assign({
+  const { popoverId: r } = R(Pe), a = t ? M : e ? "button" : ue, l = Object.assign({
     [kt.startsWith("19") ? "popoverTarget" : "popovertarget"]: r,
     ...e ? {
       "data-popover": "inline"
     } : {}
   }, n);
   return c(a, { ref: i, ...l });
-}), go = w(function({ asChild: s, ...e }, t) {
+}), bo = w(function({ asChild: s, ...e }, t) {
   return c(s ? M : "li", { ...e, ref: t });
-}), ht = (o, { asChild: s, className: e, ...t }, n) => c(s ? M : o, { className: E("ds-list", e), ref: n, ...t }), vo = w(function(s, e) {
+}), ht = (o, { asChild: s, className: e, ...t }, n) => c(s ? M : o, { className: E("ds-list", e), ref: n, ...t }), go = w(function(s, e) {
   return ht("ul", s, e);
 });
 w(function(s, e) {
@@ -1354,7 +1353,7 @@ w(function(s, e) {
 const $n = w(function({ "aria-label": s = "Sidenavigering", asChild: e, className: t, ...n }, i) {
   return c(e ? M : "nav", { "aria-label": s, className: E("ds-pagination", t), ref: i, ...n });
 }), jn = w(function(s, e) {
-  return c(he, { ref: e, ...s });
+  return c(ue, { ref: e, ...s });
 }), Wn = w(function({ asChild: s, className: e, ...t }, n) {
   return c(s ? M : "li", { ref: n, ...t });
 }), Kn = w(function({ asChild: s, ...e }, t) {
@@ -1373,11 +1372,11 @@ const ft = Object.assign(Ln, {
 });
 ft.TriggerContext.displayName = "Popover.TriggerContext";
 ft.Trigger.displayName = "Popover.Trigger";
-const yo = w(function({ asChild: s, className: e, height: t, style: n, variant: i = "rectangle", width: r, ...a }, l) {
+const vo = w(function({ asChild: s, className: e, height: t, style: n, variant: i = "rectangle", width: r, ...a }, l) {
   const d = s ? M : "span", h = i === "text", p = Ut("ds-skeleton-opacity-fade"), u = U([p, l]);
   return c(d, { "aria-hidden": "true", className: E("ds-skeleton", e), "data-text": h ? "-".repeat(Number(r) || 1) : void 0, "data-variant": i, ref: u, style: h ? n : { width: r, height: t, ...n }, ...a });
-}), Co = w(function({ "data-size": s, children: e, className: t, description: n, label: i, position: r, style: a, ...l }, d) {
-  return _(de, { className: t, "data-position": r, "data-size": s, style: a, children: [c(ue, { type: "checkbox", role: "switch", ref: d, ...l }), !!i && c(K, { weight: "regular", children: i }), !!n && c("div", { "data-field": "description", children: n })] });
+}), yo = w(function({ "data-size": s, children: e, className: t, description: n, label: i, position: r, style: a, ...l }, d) {
+  return _(de, { className: t, "data-position": r, "data-size": s, style: a, children: [c(he, { type: "checkbox", role: "switch", ref: d, ...l }), !!i && c(K, { weight: "regular", children: i }), !!n && c("div", { "data-field": "description", children: n })] });
 }), pe = se({}), Hn = w(function({ value: s, defaultValue: e, className: t, onChange: n, ...i }, r) {
   const a = F(null), l = s !== void 0, [d, h] = A(e), [p, u] = A(/* @__PURE__ */ new Map());
   let f = n;
@@ -1420,23 +1419,23 @@ const yo = w(function({ asChild: s, className: e, height: t, style: n, variant:
 Fe.Tab.displayName = "Tabs.Tab";
 Fe.List.displayName = "Tabs.List";
 Fe.Panel.displayName = "Tabs.Panel";
-const xo = w(function({ label: s, description: e, error: t, multiline: n, prefix: i, suffix: r, "data-size": a, counter: l, style: d, className: h, ...p }, u) {
-  return _(de, { className: h, "data-size": a, style: d, children: [!!s && c(K, { children: s }), !!e && c(Xt, { children: e }), _(Yt, { children: [i === void 0 || c(Ve, { children: i }), n === !0 ? c(tn, { ref: u, "aria-invalid": !!t || void 0, ...p }) : c(ue, { ref: u, "aria-invalid": !!t || void 0, ...p }), r === void 0 || c(Ve, { children: r })] }), !!l && c(de.Counter, { ...typeof l == "number" ? { limit: l } : l }), !!t && c(Ne, { children: t })] });
+const Co = w(function({ label: s, description: e, error: t, multiline: n, prefix: i, suffix: r, "data-size": a, counter: l, style: d, className: h, ...p }, u) {
+  return _(de, { className: h, "data-size": a, style: d, children: [!!s && c(K, { children: s }), !!e && c(Xt, { children: e }), _(Yt, { children: [i === void 0 || c(Ve, { children: i }), n === !0 ? c(tn, { ref: u, "aria-invalid": !!t || void 0, ...p }) : c(he, { ref: u, "aria-invalid": !!t || void 0, ...p }), r === void 0 || c(Ve, { children: r })] }), !!l && c(de.Counter, { ...typeof l == "number" ? { limit: l } : l }), !!t && c(Ne, { children: t })] });
 });
 export {
   un as B,
-  bo as C,
+  po as C,
   Re as D,
   hn as L,
   De as P,
-  Co as S,
-  xo as T,
+  yo as S,
+  Co as T,
   fe as a,
   me as b,
-  go as c,
-  vo as d,
+  bo as c,
+  go as d,
   ft as e,
-  yo as f,
+  vo as f,
   Fe as g,
-  po as u
+  mo as u
 };

package/dist/types/lib/components/Account/AccountListItemDetails.d.ts

@@ -1,12 +1,16 @@
 import { ReactNode } from 'react';
 import { AccountOrganizationProps, ButtonProps, SectionProps, SettingsItemProps } from '..';
+interface AccountListItemButtonProps extends ButtonProps {
+    label: string;
+}
 export interface AccountListItemDetailsProps {
     color?: SectionProps['color'];
     loading?: boolean;
     loadingText?: string;
-    buttons?: ButtonProps[];
+    buttons?: AccountListItemButtonProps[];
     settings?: SettingsItemProps[];
     organization?: AccountOrganizationProps['items'];
     children?: ReactNode;
 }
 export declare const AccountListItemDetails: ({ color, loading, loadingText, buttons, settings, organization, children, }: AccountListItemDetailsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/lib/components/Button/Button.d.ts

@@ -1,11 +1,22 @@
-import { ButtonBaseProps, ButtonIconProps, ButtonSize } from '..';
-export interface ButtonProps extends Partial<ButtonBaseProps> {
+import { ButtonProps as DsButtonProps } from '@digdir/designsystemet-react';
+import { ButtonIconProps } from './ButtonIcon';
+import * as React from 'react';
+export type ButtonColor = DsButtonProps['data-color'] | undefined;
+export type ButtonVariant = 'solid' | 'outline' | 'tinted' | 'ghost' | DsButtonProps['variant'];
+export type ButtonSize = 'xs' | DsButtonProps['data-size'];
+export type ButtonProps = {
+    as?: React.ElementType;
+    size?: ButtonSize;
+    variant?: ButtonVariant;
+    rounded?: boolean;
     icon?: ButtonIconProps['icon'];
-    iconSize?: ButtonSize;
-    ariaLabel?: string;
-    loading?: boolean;
-    label?: string;
-    labelSize?: ButtonSize;
-    autoFocus?: boolean;
-}
-export declare const Button: ({ variant, color, size, selected, icon, iconSize, href, label, labelSize, children, className, loading, ariaLabel, ...rest }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+    href?: string;
+} & Omit<DsButtonProps, 'icon' | 'variant' | 'asChild' | 'data-size' | 'data-color' | 'data-variant' | 'data-rounded'>;
+export declare const Button: React.ForwardRefExoticComponent<{
+    as?: React.ElementType;
+    size?: ButtonSize;
+    variant?: ButtonVariant;
+    rounded?: boolean;
+    icon?: ButtonIconProps["icon"];
+    href?: string;
+} & Omit<DsButtonProps, "variant" | "data-color" | "data-variant" | "data-size" | "icon" | "asChild" | "data-rounded"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/types/lib/components/Button/Button.stories.d.ts

@@ -1,7 +1,15 @@
 import { StoryObj } from '@storybook/react-vite';
+import { ButtonSize, ButtonVariant } from './Button';
 declare const meta: {
     title: string;
-    component: ({ variant, color, size, selected, icon, iconSize, href, label, labelSize, children, className, loading, ariaLabel, ...rest }: import('./Button').ButtonProps) => import("react/jsx-runtime").JSX.Element;
+    component: React.ForwardRefExoticComponent<{
+        as?: React.ElementType;
+        size?: ButtonSize;
+        variant?: ButtonVariant;
+        rounded?: boolean;
+        icon?: import('./ButtonIcon').ButtonIconProps["icon"];
+        href?: string;
+    } & Omit<import('@digdir/designsystemet-react').ButtonProps, "variant" | "data-color" | "data-variant" | "data-size" | "icon" | "asChild" | "data-rounded"> & React.RefAttributes<HTMLButtonElement>>;
     parameters: {};
     args: {
         children: string;
@@ -9,14 +17,9 @@ declare const meta: {
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const Solid: Story;
-export declare const Outline: Story;
-export declare const Text: Story;
-export declare const Loading: Story;
-export declare const Disabled: Story;
-export declare const Sizes: (args: Story) => import("react/jsx-runtime").JSX.Element;
-export declare const LabelSize: (args: Story) => import("react/jsx-runtime").JSX.Element;
+export declare const Default: (args: Story) => import("react/jsx-runtime").JSX.Element;
 export declare const Variants: (args: Story) => import("react/jsx-runtime").JSX.Element;
-export declare const ToolbarButtons: (args: Story) => import("react/jsx-runtime").JSX.Element;
+export declare const Colors: (args: Story) => import("react/jsx-runtime").JSX.Element;
+export declare const Sizes: (args: Story) => import("react/jsx-runtime").JSX.Element;
+export declare const Icons: (args: Story) => import("react/jsx-runtime").JSX.Element;
 export declare const Specimens: (args: Story) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/ButtonGroup.d.ts

@@ -1,10 +1,10 @@
-import { ButtonBaseProps } from './ButtonBase';
-export interface ButtonGroupProps extends ButtonBaseProps {
+import { ButtonProps } from './Button';
+export interface ButtonGroupProps extends ButtonProps {
     children?: React.ReactNode;
-    variant?: ButtonBaseProps['variant'];
-    color?: ButtonBaseProps['color'];
-    size?: ButtonBaseProps['size'];
+    variant?: ButtonProps['variant'];
+    color?: ButtonProps['color'];
+    size?: ButtonProps['size'];
     disabled?: boolean;
     connected?: boolean;
 }
-export declare const ButtonGroup: ({ children, variant, color, size, disabled, connected }: ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ButtonGroup: ({ children, variant, size, disabled, connected, color }: ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/ButtonGroup.stories.d.ts

@@ -1,6 +1,6 @@
 declare const meta: {
     title: string;
-    component: ({ children, variant, color, size, disabled, connected }: import('./ButtonGroup').ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ children, variant, size, disabled, connected, color }: import('./ButtonGroup').ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {};
     args: {
         children: string;
@@ -10,3 +10,5 @@ export default meta;
 export declare const Default: () => import("react/jsx-runtime").JSX.Element;
 export declare const Connected: () => import("react/jsx-runtime").JSX.Element;
 export declare const WithDivider: () => import("react/jsx-runtime").JSX.Element;
+export declare const ComboButton: () => import("react/jsx-runtime").JSX.Element;
+export declare const Toolbar: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/ButtonGroupDivider.d.ts

@@ -1 +1,5 @@
-export declare const ButtonGroupDivider: () => import("react/jsx-runtime").JSX.Element;
+import { ButtonProps } from './Button';
+export interface ButtonGroupDividerProps {
+    variant?: ButtonProps['variant'];
+}
+export declare const ButtonGroupDivider: ({ variant }: ButtonGroupDividerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/ButtonIcon.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
-import { AvatarGroupProps, AvatarProps, ButtonSize, IconProps, SvgElement } from '..';
+import { ButtonSize } from '.';
+import { AvatarGroupProps, AvatarProps, IconProps, SvgElement } from '..';
 export interface ButtonIconProps {
     icon?: IconProps | SvgElement | AvatarProps | AvatarGroupProps | ReactNode;
     iconAltText?: string;

package/dist/types/lib/components/Button/ButtonLabel.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ButtonSize } from './ButtonBase';
+import { ButtonSize } from './Button';
 export interface ButtonLabelProps {
     size?: ButtonSize;
     className?: string;

package/dist/types/lib/components/Button/ComboButton.d.ts

@@ -1,16 +1,7 @@
-import { MouseEventHandler } from 'react';
-import { ButtonBaseProps, ButtonIconProps, ButtonSize } from '..';
-export interface ComboButtonProps extends Omit<ButtonBaseProps, 'onClick'> {
-    icon: ButtonIconProps['icon'];
-    iconSize?: ButtonSize;
-    iconAltText?: string;
-    ariaLabel?: string;
-    onIconClick?: MouseEventHandler<HTMLButtonElement>;
-    onLabelClick?: MouseEventHandler<HTMLButtonElement>;
-    disabled?: boolean;
-    label?: string;
-    labelSize?: ButtonSize;
-    dataTestId?: string;
-    tabIndex?: number;
+import { ButtonProps } from '.';
+type SecondaryButtonProps = ButtonProps & Omit<ButtonProps, 'size' | 'variant' | 'color'>;
+export interface ComboButtonProps extends ButtonProps {
+    secondaryButton: SecondaryButtonProps;
 }
-export declare const ComboButton: ({ variant, color, size, selected, icon, iconSize, iconAltText, label, labelSize, children, className, ariaLabel, onLabelClick, onIconClick, dataTestId, tabIndex, disabled, }: ComboButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ComboButton: ({ secondaryButton, size, variant, color, disabled, ...props }: ComboButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/lib/components/Button/ComboButton.stories.d.ts

@@ -4,7 +4,4 @@ declare const meta: Meta<typeof ComboButton>;
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
-export declare const Solid: Story;
-export declare const Outline: Story;
-export declare const Text: Story;
 export declare const Disabled: Story;

package/dist/types/lib/components/Button/FloatingActionButton.d.ts

@@ -1,14 +1,7 @@
-import { MouseEventHandler } from 'react';
-import { ButtonColor, ButtonIconProps, ButtonSize, ButtonVariant } from '..';
-export interface FloatingActionButtonProps {
-    icon: ButtonIconProps['icon'];
-    iconSize?: ButtonSize;
+import { ButtonProps } from '.';
+export interface FloatingActionButtonProps extends ButtonProps {
+    icon: ButtonProps['icon'];
+    iconSize?: ButtonProps['size'];
     iconAltText: string;
-    color?: ButtonColor;
-    size?: ButtonSize;
-    variant?: ButtonVariant;
-    onClick?: MouseEventHandler;
-    dataTestId?: string;
-    onBlurCapture?: React.FocusEventHandler<HTMLButtonElement>;
 }
-export declare const FloatingActionButton: ({ variant, size, icon, iconSize, iconAltText, color, onClick, dataTestId, onBlurCapture, }: FloatingActionButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FloatingActionButton: ({ variant, size, icon, iconSize, iconAltText, color, onClick, onBlurCapture, }: FloatingActionButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/IconButton.d.ts

@@ -1,18 +1,5 @@
-import { MouseEventHandler } from 'react';
-import { ButtonColor, ButtonIconProps, ButtonSize, ButtonVariant } from '..';
-export interface IconButtonProps {
-    icon: ButtonIconProps['icon'];
-    iconAltText: string;
-    color?: ButtonColor;
-    size?: ButtonSize;
-    iconSize?: ButtonSize;
-    variant?: ButtonVariant;
-    rounded?: boolean;
-    selected?: boolean;
-    className?: string;
-    onClick?: MouseEventHandler;
-    dataTestId?: string;
-    onBlurCapture?: React.FocusEventHandler<HTMLButtonElement>;
-    type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];
+import { ButtonProps } from '.';
+export interface IconButtonProps extends ButtonProps {
+    label: string;
 }
-export declare const IconButton: ({ variant, rounded, size, icon, iconSize, iconAltText, color, className, selected, onClick, dataTestId, onBlurCapture, }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const IconButton: ({ children, label, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Button/index.d.ts

@@ -1,8 +1,8 @@
-export * from './ButtonBase';
-export * from './ButtonLabel';
-export * from './ButtonIcon';
 export * from './Button';
+export * from './ButtonIcon';
+export * from './ButtonLabel';
+export * from './ButtonGroup';
+export * from './ButtonGroupDivider';
 export * from './ComboButton';
 export * from './IconButton';
 export * from './FloatingActionButton';
-export * from './ButtonGroup';

package/dist/types/lib/components/Datepicker/Datepicker.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { Datepicker } from './Datepicker';
+declare const meta: Meta<typeof Datepicker>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/types/lib/components/Dialog/DialogActions.d.ts

@@ -3,6 +3,7 @@ export type DialogButtonPriority = 'primary' | 'secondary' | 'tertiary';
 export interface DialogActionButtonProps extends ButtonProps {
     id: string;
     priority: DialogButtonPriority;
+    label: string;
     onClick?: () => void;
 }
 export interface DialogActionsProps {

package/dist/types/lib/components/Dropdown/FloatingDropdown.d.ts

@@ -15,7 +15,7 @@ export interface FloatingDropdownProps {
     color?: ButtonColor;
     size?: ButtonSize;
     variant?: ButtonVariant;
-    dataTestId?: string;
+    'data-testid'?: string;
     id?: string;
 }
-export declare const FloatingDropdown: ({ variant, size, icon, iconOpen, iconSize, iconAltText, id, color, items, dataTestId, }: FloatingDropdownProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FloatingDropdown: ({ variant, size, icon, iconOpen, iconSize, iconAltText, id, color, items, "data-testid": dataTestId, }: FloatingDropdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/GlobalHeader/HeaderLogo.d.ts

@@ -1,10 +1,9 @@
-import { ElementType, MouseEventHandler } from 'react';
+import { ElementType } from 'react';
 import { BadgeProps } from '../Badge';
 export interface HeaderLogoProps {
     className?: string;
     as?: ElementType;
     href?: string;
-    onClick?: MouseEventHandler<HTMLButtonElement>;
     badge?: BadgeProps;
 }
 export declare const HeaderLogo: ({ className, as, href, badge }: HeaderLogoProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Header/HeaderButton.d.ts

@@ -2,7 +2,6 @@ import { ElementType } from 'react';
 import { AvatarProps, AvatarGroupProps } from '../Avatar';
 import { BadgeProps } from '../Badge';
 import { ButtonProps } from '../Button';
-import { SvgElement } from '../Icon';
 export interface HeaderButtonProps extends ButtonProps {
     label?: string;
     avatar?: AvatarProps;
@@ -10,7 +9,6 @@ export interface HeaderButtonProps extends ButtonProps {
     as?: ElementType;
     className?: string;
     expanded?: boolean;
-    icon?: SvgElement;
     badge?: BadgeProps | undefined;
     tabIndex?: number;
 }

package/dist/types/lib/components/Header/HeaderLogo.d.ts

@@ -8,4 +8,4 @@ export interface HeaderLogoProps {
     title?: string;
     badge?: BadgeProps;
 }
-export declare const HeaderLogo: ({ className, as, title, href, badge }: HeaderLogoProps) => import("react/jsx-runtime").JSX.Element;
+export declare const HeaderLogo: ({ className, as, title, href, onClick, badge }: HeaderLogoProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/MenuItem.d.ts

@@ -22,6 +22,6 @@ export interface MenuItemProps extends MenuItemBaseProps {
     className?: string;
     label?: ReactNode | (() => ReactElement);
     items?: MenuItemProps[];
-    dataTestId?: string;
+    'data-testid'?: string;
 }
 export declare const MenuItem: ({ as, size, color, variant, collapsible, expanded, icon, iconTheme, iconBadge, title, description, highlightWords, badge, controls, loading, linkIcon, label, ariaLabel, ...rest }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/MenuItemBase.d.ts

@@ -23,6 +23,6 @@ export type MenuItemBaseProps = {
     expanded?: boolean;
     children?: ReactNode;
     onMouseEnter?: MouseEventHandler;
-    dataTestId?: string;
+    'data-testid'?: string;
 };
-export declare const MenuItemBase: ({ interactive, ariaLabel, role, as, color, variant, size, className, href, onClick, onKeyPress, tabIndex, hidden, selected, disabled, children, active, onMouseEnter, dataTestId, }: MenuItemBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuItemBase: ({ interactive, ariaLabel, role, as, color, variant, size, className, href, onClick, onKeyPress, tabIndex, hidden, selected, disabled, children, active, onMouseEnter, "data-testid": dataTestId, }: MenuItemBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Modal/ModalBody.d.ts

@@ -1,6 +1,5 @@
 import { ReactNode } from 'react';
-import { SectionProps } from '../';
-export interface ModalBodyProps extends SectionProps {
+export interface ModalBodyProps {
     children?: ReactNode;
 }
-export declare const ModalBody: ({ children, ...props }: ModalBodyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ModalBody: ({ children }: ModalBodyProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Page/ContactButtons.d.ts

@@ -1,5 +1,6 @@
 import { ButtonProps } from '..';
 export interface ContactButtonProps extends ButtonProps {
+    label: string;
 }
 export interface ContactButtonsProps {
     items: ContactButtonProps[];

package/dist/types/lib/components/Page/Section.d.ts

@@ -6,4 +6,4 @@ export interface SectionProps extends FlexProps {
     variant?: 'default' | 'subtle' | 'tinted';
     bleed?: boolean;
 }
-export declare const Section: ({ as, direction, variant, className, children, ...rest }: SectionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Section: ({ as, direction, align, variant, className, children, ...rest }: SectionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Settings/SettingsModal.d.ts

@@ -1,5 +1,6 @@
 import { ButtonProps, ModalBaseProps, ModalHeaderProps } from '..';
 export interface SettingsModalButtonProps extends ButtonProps {
+    label: string;
     close?: boolean;
 }
 export interface SettingsModalProps extends ModalBaseProps {

package/dist/types/lib/components/Settings/VerifySettingsModal.stories.d.ts

@@ -0,0 +1,14 @@
+declare const meta: {
+    title: string;
+    component: ({ icon, title, description, open, onClose, buttons, children, ...args }: import('./SettingsModal').SettingsModalProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        open: true;
+        onClose: () => void;
+    };
+};
+export default meta;
+export declare const Verified: () => import("react/jsx-runtime").JSX.Element;
+export declare const Unverified: () => import("react/jsx-runtime").JSX.Element;
+export declare const VerificationCodeSent: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Timeline/index.d.ts

@@ -6,4 +6,3 @@ export * from './TimelineSection';
 export * from './TimelineHeader';
 export * from './TimelineFooter';
 export * from './TimelineIcon';
-export * from './TimelineLink';

package/dist/types/lib/components/Toolbar/ToolbarButton.d.ts

@@ -6,12 +6,11 @@ export type ToolbarButtonProps = {
     ariaLabel?: string;
     iconAltText?: string;
     removable?: boolean;
-    selected?: boolean;
     active?: boolean;
     children?: ReactNode;
     onToggle?: MouseEventHandler;
     onRemove?: MouseEventHandler;
-    dataTestId?: string;
+    'data-testid'?: string;
     tabIndex?: number;
 } & AriaAttributes;
-export declare const ToolbarButton: ({ type, selected, removable, ariaLabel, active, children, onToggle, onRemove, iconAltText, dataTestId, tabIndex, "aria-expanded": ariaExpanded, }: ToolbarButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarButton: ({ type, removable, ariaLabel, active, children, onToggle, onRemove, iconAltText, "data-testid": dataTestId, tabIndex, "aria-expanded": ariaExpanded, }: ToolbarButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Toolbar/ToolbarButton.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: ({ type, selected, removable, ariaLabel, active, children, onToggle, onRemove, iconAltText, dataTestId, tabIndex, "aria-expanded": ariaExpanded, }: import('./ToolbarButton').ToolbarButtonProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ type, removable, ariaLabel, active, children, onToggle, onRemove, iconAltText, "data-testid": dataTestId, tabIndex, "aria-expanded": ariaExpanded, }: import('./ToolbarButton').ToolbarButtonProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {

package/dist/types/lib/components/Toolbar/ToolbarFilterBase.d.ts

@@ -3,6 +3,6 @@ export interface ToolbarFilterBaseProps {
     children?: ReactNode;
     expanded?: boolean;
     onBlurCapture?: React.FocusEventHandler<HTMLDivElement>;
-    dataTestId?: string;
+    'data-testid'?: string;
 }
-export declare const ToolbarFilterBase: ({ expanded, children, onBlurCapture, dataTestId, }: ToolbarFilterBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarFilterBase: ({ expanded, children, onBlurCapture, "data-testid": dataTestId, }: ToolbarFilterBaseProps) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.52.6",
+  "version": "0.53.0",
   "main": "dist/index.js",
   "files": [
     "dist/",
@@ -75,6 +75,7 @@
   },
   "scripts": {
     "test": "vitest run",
+    "test:unit": "vitest run --project=unit",
     "storybook": "storybook dev -p 6006",
     "typecheck": "tsc --noEmit",
     "build": "tsc && vite build",

package/dist/assets/ButtonBase.css

@@ -1 +0,0 @@
-._button_129q3_1{--dsc-button-background--active: transparent;--dsc-button-background--hover: transparent;--dsc-button-background: transparent;--dsc-button-color: inherit;--dsc-button-color--hover: inherit;--dsc-button-border-width: var(--ds-border-width-default);--dsc-button-border-style: solid;--dsc-button-border-color: transparent;--dsc-button-border-radius: var(--ds-border-radius-default);--dsc-button-gap: var(--ds-size-2);--dsc-button-padding: var(--ds-size-2) var(--ds-size-4);--dsc-button-size: var(--ds-size-12);border-style:var(--dsc-button-border-style);border-width:var(--dsc-button-border-width);border-color:var(--dsc-button-border-color);border-radius:var(--dsc-button-border-radius);background:var(--dsc-button-background);color:var(--dsc-button-color);margin:0;padding:0;min-width:var(--dsc-button-size);min-height:var(--dsc-button-size);height:fit-content;align-items:center;justify-content:center;overflow:visible;text-decoration:none;text-align:inherit;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer;display:inline-flex}._button_129q3_1:not([data-size]){font-size:inherit}._button_129q3_1:is(:disabled,[aria-disabled=true]){cursor:not-allowed;opacity:.75;pointer-events:none}._button_129q3_1:is(:disabled,[aria-disabled=true])[aria-busy=true]{opacity:1;cursor:progress}@media(hover:hover)and (pointer:fine){._button_129q3_1:where(:not(:disabled,[aria-disabled=true],[aria-busy=true])):hover{background:var(--dsc-button-background--hover);color:var(--dsc-button-color--hover)}}._button_129q3_1:where(:not(:disabled,[aria-disabled=true],[aria-busy=true])):active{background:var(--dsc-button-background--active)}._button_129q3_1[data-variant=solid]{--dsc-button-background--active: var(--ds-color-base-active);--dsc-button-background--hover: var(--ds-color-base-hover);--dsc-button-background: var(--ds-color-base-default);--dsc-button-color: var(--ds-color-base-contrast-default);--dsc-button-color--hover: var(--ds-color-base-contrast-default);--dsc-button-border-color: var(--ds-color-base-default)}._button_129q3_1[data-variant=outline],._button_129q3_1[data-variant=dotted],._button_129q3_1[data-variant=text]{--dsc-button-background: transparent;--dsc-button-background--active: var(--ds-color-surface-active);--dsc-button-background--hover: var(--ds-color-surface-hover);--dsc-button-color: var(--ds-color-text-subtle);--dsc-button-color--hover: var(--ds-color-text-default)}._button_129q3_1[data-variant=outline],._button_129q3_1[data-variant=dotted]{--dsc-button-border-color: var(--ds-color-border-strong)}._button_129q3_1[data-variant=dotted]{--dsc-button-border-style: dotted}._button_129q3_1[data-variant=tinted]{background-color:var(--ds-color-surface-tinted);border-color:var(--ds-color-surface-tinted);border-color:var(--ds-color-base-default);color:var(--ds-color-base-surface-tinted)}._button_129q3_1[data-variant=tinted]:hover{background-color:var(--ds-color-surface-hover)}._button_129q3_1[data-variant=tinted]:active{background-color:var(--ds-color-surface-active)}._button_129q3_1[data-rounded=true]{border-radius:50%}._button_129q3_1:focus-visible{box-shadow:var(--_ds--focus, var(--dsc-focus-boxShadow));outline:var(--_ds--focus, var(--dsc-focus-outline));outline-offset:var(--_ds--focus, var(--ds-border-width-focus))}._button_129q3_1:focus-visible *{--_ds--focus: }

package/dist/assets/ComboButton.css

@@ -1 +0,0 @@
-._button_hbn70_1{display:inline-flex;flex-direction:row;align-items:center;max-width:100%;min-width:0}._divider_hbn70_9{align-self:stretch;border-left:1px solid currentColor;width:1px;margin:.375rem 0}._primary_hbn70_16,._secondary_hbn70_17{display:inline-flex;align-items:center;border-width:0;margin:-1px;padding:0 .5em}

package/dist/assets/TimelineLink.css

@@ -1 +0,0 @@
-._button_87kyt_1{display:inline-flex;column-gap:.25em;align-items:center;justify-content:flex-start;font-size:.875rem;min-height:auto}._label_87kyt_10{flex-shrink:1;font-weight:400;white-space:inherit;padding:.3125rem}._button_87kyt_1 a{color:inherit}