@altinn/altinn-components 0.43.2 → 0.43.3

package/dist/assets/MenuOption.css

@@ -1 +1 @@
-._label_e5maf_1{flex-grow:1;display:flex;flex-direction:row;align-items:center;justify-content:center;padding:0 .125rem;font-size:1rem;column-gap:.5em;pointer-events:none}._title_e5maf_13{color:var(--ds-color-text-default);display:inline;vertical-align:text-top}._count_e5maf_19{display:inline;vertical-align:super;font-size:smaller}._radio_e5maf_25,._checkbox_e5maf_26{flex-shrink:0;flex-grow:0;position:relative;width:1.25em;height:1.25em;display:flex;align-items:center;justify-content:center;color:transparent}._radio_e5maf_25{border:1px solid;border-color:var(--ds-color-border-subtle);outline:var(--ds-color-border-subtle) solid 1px;border-radius:50%}._checkbox_e5maf_26{border:2px solid;border-color:var(--ds-color-border-subtle);border-radius:2px}._radio_e5maf_25[data-checked=true],._checkbox_e5maf_26[data-checked=true]{background-color:var(--ds-color-base-default);border:none;outline-color:var(--ds-color-base-default);color:var(--ds-color-base-contrast-default)}._icon_e5maf_59{font-size:1.25em}@supports (-webkit-hyphens: none){._icon_e5maf_59{font-size:unset;width:1.25em;height:1.25em}._icon_e5maf_59 svg,._icon_e5maf_59 img{width:100%;height:100%}}
+._label_ggqvo_1{flex-grow:1;display:flex;flex-direction:row;align-items:center;justify-content:center;padding:0 .125rem;font-size:1rem;column-gap:.5em;pointer-events:none}._title_ggqvo_13{color:var(--ds-color-text-default);display:inline;vertical-align:text-top}._titleWrapper_ggqvo_19{display:inline;line-height:1.25}._count_ggqvo_24{margin-left:.5rem;display:inline;font-size:smaller;white-space:nowrap}._radio_ggqvo_31,._checkbox_ggqvo_32{flex-shrink:0;flex-grow:0;position:relative;width:1.25em;height:1.25em;display:flex;align-items:center;justify-content:center;color:transparent}._radio_ggqvo_31{border:1px solid;border-color:var(--ds-color-border-subtle);outline:var(--ds-color-border-subtle) solid 1px;border-radius:50%}._checkbox_ggqvo_32{border:2px solid;border-color:var(--ds-color-border-subtle);border-radius:2px}._radio_ggqvo_31[data-checked=true],._checkbox_ggqvo_32[data-checked=true]{background-color:var(--ds-color-base-default);border:none;outline-color:var(--ds-color-base-default);color:var(--ds-color-base-contrast-default)}._icon_ggqvo_65{font-size:1.25em}@supports (-webkit-hyphens: none){._icon_ggqvo_65{font-size:unset;width:1.25em;height:1.25em}._icon_ggqvo_65 svg,._icon_ggqvo_65 img{width:100%;height:100%}}

package/dist/components/Header/Header.js

@@ -5,16 +5,16 @@ import "react";
 import { useRootContext as S } from "../RootProvider/RootProvider.js";
 import { DropdownBase as k } from "../Dropdown/DropdownBase.js";
 import { DrawerBase as B } from "../Dropdown/DrawerBase.js";
+import { useIsDesktop as D } from "../../hooks/useIsDesktop.js";
 import { GlobalMenu as f } from "../GlobalMenu/GlobalMenu.js";
-import { GlobalMenuButton as D } from "../GlobalMenu/GlobalMenuButton.js";
-import { HeaderBase as I } from "./HeaderBase.js";
-import { HeaderLogo as l } from "./HeaderLogo.js";
-import { HeaderGroup as F } from "./HeaderGroup.js";
+import { GlobalMenuButton as I } from "../GlobalMenu/GlobalMenuButton.js";
+import { HeaderBase as l } from "./HeaderBase.js";
+import { HeaderLogo as F } from "./HeaderLogo.js";
+import { HeaderGroup as G } from "./HeaderGroup.js";
 import { HeaderSearch as w } from "./HeaderSearch.js";
-import { LocaleSwitcher as G } from "./LocaleSwitcher.js";
+import { LocaleSwitcher as L } from "./LocaleSwitcher.js";
 import { Searchbar as x } from "../Searchbar/Searchbar.js";
 import "../Snackbar/useSnackbar.js";
-import { useIsDesktop as L } from "../../hooks/useIsDesktop.js";
 import '../../assets/Header.css';const N = "_drawer_afyu3_1", j = "_dropdown_afyu3_6", z = "_relative_afyu3_19", n = {
   drawer: N,
   dropdown: j,
@@ -35,21 +35,21 @@ import '../../assets/Header.css';const N = "_drawer_afyu3_1", j = "_dropdown_afy
     i("search");
   }, H = () => {
     i("menu");
-  }, h = L();
+  }, h = D();
   return /* @__PURE__ */ d(
-    I,
+    l,
     {
       currentId: r,
       open: r === "search" || r === "menu" || r === "locale",
       onClose: m,
       children: [
-        /* @__PURE__ */ o(l, { ...u, badge: v }),
+        /* @__PURE__ */ o(F, { ...u, badge: v }),
         s && h && /* @__PURE__ */ o(w, { expanded: r === "search", children: /* @__PURE__ */ o(x, { ...s, expanded: r === "search", onClose: a, onFocus: c }) }),
-        /* @__PURE__ */ d(F, { children: [
-          p && /* @__PURE__ */ o(G, { ...p }),
+        /* @__PURE__ */ d(G, { children: [
+          p && /* @__PURE__ */ o(L, { ...p }),
           /* @__PURE__ */ d("div", { className: n.relative, children: [
             /* @__PURE__ */ o(
-              D,
+              I,
               {
                 currentAccount: t,
                 onClick: H,

package/dist/components/Menu/MenuOption.js

@@ -1,80 +1,85 @@
-import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { jsx as a, jsxs as r } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
-import { MenuItem as _ } from "./MenuItem.js";
+import { MenuItem as m } from "./MenuItem.js";
 import "../Snackbar/useSnackbar.js";
-import { S as p } from "../../Checkmark-Byz_C9x4.js";
-import '../../assets/MenuOption.css';const N = "_label_e5maf_1", k = "_title_e5maf_13", v = "_count_e5maf_19", I = "_radio_e5maf_25", M = "_checkbox_e5maf_26", j = "_icon_e5maf_59", e = {
-  label: N,
-  title: k,
-  count: v,
-  radio: I,
-  checkbox: M,
-  icon: j
+import { S as _ } from "../../Checkmark-Byz_C9x4.js";
+import '../../assets/MenuOption.css';const b = "_label_ggqvo_1", x = "_title_ggqvo_13", q = "_titleWrapper_ggqvo_19", f = "_count_ggqvo_24", k = "_radio_ggqvo_31", W = "_checkbox_ggqvo_32", I = "_icon_ggqvo_65", e = {
+  label: b,
+  title: x,
+  titleWrapper: q,
+  count: f,
+  radio: k,
+  checkbox: W,
+  icon: I
 }, C = ({
-  size: t = "md",
+  size: n = "md",
   type: h,
-  name: S,
-  active: o,
-  value: g,
-  label: n,
-  title: u,
-  description: b,
-  icon: f,
-  count: s = 0,
-  checked: c = !1,
-  disabled: r,
-  onMouseEnter: w,
-  onClick: i,
-  role: l,
-  ...m
+  name: M,
+  active: i,
+  value: j,
+  label: c,
+  title: g,
+  description: u,
+  icon: v,
+  count: t = 0,
+  checked: s = !1,
+  disabled: o,
+  onMouseEnter: S,
+  onClick: l,
+  role: d,
+  ...p
 }) => {
-  const x = () => {
+  const N = () => {
     switch (h) {
       case "checkbox":
-        return /* @__PURE__ */ d("span", { className: e.label, children: [
-          /* @__PURE__ */ a("span", { className: e.checkbox, "data-checked": c, children: /* @__PURE__ */ a(p, { className: e.icon, "aria-hidden": !0 }) }),
-          /* @__PURE__ */ a("span", { className: e.title, children: n }),
-          s > 0 && /* @__PURE__ */ a("span", { className: e.count, children: s })
+        return /* @__PURE__ */ r("span", { className: e.label, children: [
+          /* @__PURE__ */ a("span", { className: e.checkbox, "data-checked": s, children: /* @__PURE__ */ a(_, { className: e.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ r("div", { className: e.titleWrapper, children: [
+            /* @__PURE__ */ a("span", { className: e.title, children: c }),
+            t > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: t })
+          ] })
         ] });
       case "radio":
-        return /* @__PURE__ */ d("span", { className: e.label, children: [
-          /* @__PURE__ */ a("span", { className: e.radio, "data-checked": c, children: /* @__PURE__ */ a(p, { className: e.icon, "aria-hidden": !0 }) }),
-          /* @__PURE__ */ a("span", { className: e.title, children: n }),
-          s > 0 && /* @__PURE__ */ a("span", { className: e.count, children: s })
+        return /* @__PURE__ */ r("span", { className: e.label, children: [
+          /* @__PURE__ */ a("span", { className: e.radio, "data-checked": s, children: /* @__PURE__ */ a(_, { className: e.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ r("div", { className: e.titleWrapper, children: [
+            /* @__PURE__ */ a("span", { className: e.title, children: c }),
+            t > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: t })
+          ] })
         ] });
     }
   };
-  return n ? /* @__PURE__ */ a(
-    _,
+  return c ? /* @__PURE__ */ a(
+    m,
     {
-      disabled: r,
-      selected: c,
-      size: t,
+      disabled: o,
+      selected: s,
+      size: n,
       as: "div",
-      active: o,
+      active: i,
       tabIndex: -1,
-      onClick: i,
-      role: l,
-      label: /* @__PURE__ */ a(x, {}),
-      ...m
+      onClick: l,
+      role: d,
+      label: /* @__PURE__ */ a(N, {}),
+      ...p
     }
   ) : /* @__PURE__ */ a(
-    _,
+    m,
     {
-      disabled: r,
-      selected: c,
-      size: t,
+      disabled: o,
+      selected: s,
+      size: n,
       as: "div",
-      active: o,
+      active: i,
       tabIndex: -1,
-      onClick: i,
-      role: l,
-      icon: f,
-      title: u,
-      description: b,
-      ...m
+      onClick: l,
+      role: d,
+      icon: v,
+      title: g,
+      description: u,
+      ...p
     }
   );
 };

package/dist/components/Menu/MenuSearch.js

@@ -2,35 +2,39 @@ import { jsx as f } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
+import { useIsDesktop as a } from "../../hooks/useIsDesktop.js";
 import "../Snackbar/useSnackbar.js";
-import { SearchField as l } from "../Forms/SearchField.js";
-import '../../assets/MenuSearch.css';const m = "_field_1w1s0_1", p = {
-  field: m
-}, y = ({
-  name: o,
+import { SearchField as c } from "../Forms/SearchField.js";
+import '../../assets/MenuSearch.css';const l = "_field_1w1s0_1", n = {
+  field: l
+}, x = ({
+  name: e,
   value: r,
   placeholder: t = "Search",
-  clearButtonAltText: i = "Clear search",
-  onChange: s,
-  onClear: a
-}) => /* @__PURE__ */ f(
-  l,
-  {
-    size: "xs",
-    name: o,
-    value: r,
-    placeholder: t,
-    onChange: s,
-    onClear: a,
-    clearButtonAltText: i,
-    className: p.field,
-    autoComplete: "off",
-    autoFocus: !0,
-    onKeyDown: (e) => {
-      (e.key === "ArrowUp" || e.key === "ArrowDown") && e.preventDefault();
+  clearButtonAltText: s = "Clear search",
+  onChange: i,
+  onClear: p
+}) => {
+  const m = a();
+  return /* @__PURE__ */ f(
+    c,
+    {
+      size: "xs",
+      name: e,
+      value: r,
+      placeholder: t,
+      onChange: i,
+      onClear: p,
+      clearButtonAltText: s,
+      className: n.field,
+      autoComplete: "off",
+      autoFocus: m,
+      onKeyDown: (o) => {
+        (o.key === "ArrowUp" || o.key === "ArrowDown") && o.preventDefault();
+      }
     }
-  }
-);
+  );
+};
 export {
-  y as MenuSearch
+  x as MenuSearch
 };

package/dist/components/Toolbar/ToolbarAdd.js

@@ -3,19 +3,19 @@ import "../../index-L8X2o7IH.js";
 import "react";
 import { useRootContext as u } from "../RootProvider/RootProvider.js";
 import { DrawerOrDropdown as f } from "../Dropdown/DrawerOrDropdown.js";
-import { Menu as g } from "../Menu/Menu.js";
-import { useIsDesktop as x } from "../../hooks/useIsDesktop.js";
+import { useIsDesktop as g } from "../../hooks/useIsDesktop.js";
+import { Menu as x } from "../Menu/Menu.js";
 import "../Snackbar/useSnackbar.js";
 import { ToolbarButton as T } from "./ToolbarButton.js";
 import { ToolbarFilterBase as B } from "./ToolbarFilterBase.js";
 const v = ({ label: t = "Legg til", items: p, id: e }) => {
-  const { currentId: i, closeAll: a, toggleId: d } = u(), o = i === e, l = () => d(e), m = x();
+  const { currentId: i, closeAll: a, toggleId: d } = u(), o = i === e, l = () => d(e), m = g();
   return /* @__PURE__ */ c(B, { expanded: o, onBlurCapture: (n) => {
     const s = n.relatedTarget;
     (!s || !n.currentTarget.contains(s)) && a();
   }, children: [
     /* @__PURE__ */ r(T, { type: "add", onToggle: l, "aria-expanded": o, children: t }),
-    /* @__PURE__ */ r(f, { drawerTitle: t, open: o, children: /* @__PURE__ */ r(g, { color: "neutral", items: p, keyboardEvents: o && m }) })
+    /* @__PURE__ */ r(f, { drawerTitle: t, open: o, children: /* @__PURE__ */ r(x, { color: "neutral", items: p, keyboardEvents: o && m }) })
   ] });
 };
 export {

package/dist/components/Toolbar/ToolbarMenu.js

@@ -1,19 +1,27 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import { jsxs as u, jsx as o } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
-import { useRootContext as u } from "../RootProvider/RootProvider.js";
-import { DrawerOrDropdown as f } from "../Dropdown/DrawerOrDropdown.js";
-import { Menu as x } from "../Menu/Menu.js";
+import { useRootContext as f } from "../RootProvider/RootProvider.js";
+import { DrawerOrDropdown as x } from "../Dropdown/DrawerOrDropdown.js";
+import { Menu as T } from "../Menu/Menu.js";
 import "../Snackbar/useSnackbar.js";
-import { ToolbarButton as T } from "./ToolbarButton.js";
-import { ToolbarFilterBase as b } from "./ToolbarFilterBase.js";
-const k = ({ label: e, value: n, groups: m, search: i, items: l, id: r = "toolbar-menu" }) => {
-  const { currentId: p, toggleId: s, closeAll: c } = u(), a = () => s(r), t = p === r;
-  return /* @__PURE__ */ d(b, { expanded: t, children: [
-    /* @__PURE__ */ o(T, { type: "switch", onToggle: a, active: !!n, children: e }),
-    /* @__PURE__ */ o(f, { open: t, drawerTitle: "Endre konto", onClose: c, children: /* @__PURE__ */ o(x, { groups: m, search: i, items: l }) })
+import { ToolbarButton as b } from "./ToolbarButton.js";
+import { ToolbarFilterBase as g } from "./ToolbarFilterBase.js";
+const v = ({
+  label: e,
+  value: n,
+  groups: m,
+  search: i,
+  items: l,
+  id: r = "toolbar-menu",
+  title: p = "Endre aktør"
+}) => {
+  const { currentId: s, toggleId: c, closeAll: a } = f(), d = () => c(r), t = s === r;
+  return /* @__PURE__ */ u(g, { expanded: t, children: [
+    /* @__PURE__ */ o(b, { type: "switch", onToggle: d, active: !!n, children: e }),
+    /* @__PURE__ */ o(x, { open: t, drawerTitle: p, onClose: a, children: /* @__PURE__ */ o(T, { groups: m, search: i, items: l }) })
   ] });
 };
 export {
-  k as ToolbarMenu
+  v as ToolbarMenu
 };

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

@@ -2,10 +2,11 @@ import { MenuItemGroups, MenuItemProps, MenuSearchProps } from '../Menu';
 export interface ToolbarMenuProps {
     label: string;
     value: string | number;
+    title?: string;
     items: MenuItemProps[];
     groups?: MenuItemGroups;
     search?: MenuSearchProps;
     id?: string;
     className?: string;
 }
-export declare const ToolbarMenu: ({ label, value, groups, search, items, id }: ToolbarMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarMenu: ({ label, value, groups, search, items, id, title, }: ToolbarMenuProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: ({ label, value, groups, search, items, id }: import('./ToolbarMenu').ToolbarMenuProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ label, value, groups, search, items, id, title, }: import('./ToolbarMenu').ToolbarMenuProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.43.2",
+  "version": "0.43.3",
   "main": "dist/index.js",
   "files": [
     "dist/",