@altinn/altinn-components 0.18.2 → 0.18.4

package/dist/components/Search/Autocomplete.js

@@ -1,44 +1,46 @@
 import { jsx as m } from "react/jsx-runtime";
-import { useRef as v, createElement as x } from "react";
+import { useRef as v, createElement as A } from "react";
 import "../../index-L8X2o7IH.js";
-import { useMenu as A } from "../../hooks/useMenu.js";
+import { useMenu as I } from "../../hooks/useMenu.js";
 import "../RootProvider/RootProvider.js";
-import { AutocompleteBase as I } from "./AutocompleteBase.js";
-import { AutocompleteGroup as l } from "./AutocompleteGroup.js";
+import { AutocompleteBase as l } from "./AutocompleteBase.js";
+import { AutocompleteGroup as x } from "./AutocompleteGroup.js";
 import { AutocompleteItem as h } from "./AutocompleteItem.js";
 import "../Snackbar/useSnackbar.js";
 import { useEnterKey as k } from "../../hooks/useEnterKey.js";
-const C = ({ className: u, items: s, groups: i = {}, expanded: n, onSelect: r }) => {
+const C = ({ className: s, items: i, groups: n = {}, expanded: u, onSelect: r }) => {
   const p = v(null);
   k(() => {
-    var e;
-    const t = (e = p.current) == null ? void 0 : e.querySelector('[data-active="true"]');
-    t == null || t.dispatchEvent(new MouseEvent("click", { bubbles: !0 })), r == null || r();
+    var t;
+    if (u) {
+      const e = (t = p.current) == null ? void 0 : t.querySelector('[data-active="true"]');
+      e == null || e.dispatchEvent(new MouseEvent("click", { bubbles: !0 })), r == null || r();
+    }
   });
-  const { menu: a, setActiveIndex: c } = A({
-    items: s,
-    groups: i,
+  const { menu: c, setActiveIndex: f } = I({
+    items: i,
+    groups: n,
     groupByKey: "groupId",
     keyboardEvents: !0
   });
-  return /* @__PURE__ */ m(I, { className: u, expanded: n, ref: p, children: a.map((t, e) => /* @__PURE__ */ x(l, { ...t.props, key: e }, /* @__PURE__ */ m("ul", { children: t.items.map((d, f) => {
+  return /* @__PURE__ */ m(l, { className: s, expanded: u, ref: p, children: c.map((t, e) => /* @__PURE__ */ A(x, { ...t.props, key: e }, /* @__PURE__ */ m("ul", { children: t.items.map((a, d) => {
     const {
       active: y,
       menuIndex: E,
       props: { groupId: M, onClick: o, ...b }
-    } = d;
+    } = a;
     return /* @__PURE__ */ m(
       h,
       {
         tabIndex: -1,
-        onMouseEnter: () => c(E),
+        onMouseEnter: () => f(E),
         ...b,
         onClick: () => {
           o == null || o(), r == null || r();
         },
         active: y
       },
-      f
+      d
     );
   }) }))) });
 };

package/dist/components/Toolbar/Toolbar.js

@@ -1,13 +1,13 @@
 "use client";
-import { jsxs as v, jsx as i } from "react/jsx-runtime";
+import { jsxs as B, jsx as i } from "react/jsx-runtime";
 import { useState as F, useMemo as T } from "react";
-import { useRootContext as B } from "../RootProvider/RootProvider.js";
-import { ToolbarAccountMenu as M } from "./ToolbarAccountMenu.js";
-import { ToolbarAdd as V } from "./ToolbarAdd.js";
-import { ToolbarBase as $ } from "./ToolbarBase.js";
-import { ToolbarFilter as q } from "./ToolbarFilter.js";
-import { ToolbarSearch as w } from "./ToolbarSearch.js";
-const g = (n, l) => l || `toolbar-filter-${n}`, P = ({
+import { useRootContext as M } from "../RootProvider/RootProvider.js";
+import { ToolbarAccountMenu as V } from "./ToolbarAccountMenu.js";
+import { ToolbarAdd as $ } from "./ToolbarAdd.js";
+import { ToolbarBase as q } from "./ToolbarBase.js";
+import { ToolbarFilter as w } from "./ToolbarFilter.js";
+import { ToolbarSearch as z } from "./ToolbarSearch.js";
+const g = (n, l) => l || `toolbar-filter-${n}`, Q = ({
   filters: n = [],
   filterState: l,
   onFilterStateChange: s,
@@ -16,47 +16,48 @@ const g = (n, l) => l || `toolbar-filter-${n}`, P = ({
   getFilterLabel: y,
   children: x,
   showResultsLabel: A,
-  removeButtonAltText: S
+  removeButtonAltText: S,
+  addFilterButtonLabel: h
 }) => {
-  const { openId: h, closeAll: C } = B(), [I, N] = F(
+  const { openId: C, closeAll: I } = M(), [N, R] = F(
     l ?? {}
-  ), c = typeof s == "function" ? s : N, t = l || I, [d, f] = F(
+  ), c = typeof s == "function" ? s : R, t = l || N, [d, f] = F(
     (n == null ? void 0 : n.filter((o) => !(o.removable && typeof t[o.name] > "u")).map((o) => o.name)) ?? []
-  ), u = n == null ? void 0 : n.filter((o) => !d.includes(o.name)), R = T(
+  ), u = n == null ? void 0 : n.filter((o) => !d.includes(o.name)), j = T(
     () => d.map((o) => n.find((e) => e.name === o)).filter((o) => typeof o < "u"),
     [n, d]
   ), a = T(
     () => n.filter((o) => u.includes(o)),
     [n, u]
-  ), j = (o, e, r) => {
-    r === "radio" ? (C(), c({
+  ), L = (o, e, r) => {
+    r === "radio" ? (I(), c({
       ...t,
       [o]: e
     })) : c({
       ...t,
       [o]: t[o] ? t[o].some((p) => e == null ? void 0 : e.includes(p)) ? t[o].filter((p) => !e.includes(p)) : [...t[o], ...e] : e
     });
-  }, L = (o) => {
+  }, k = (o) => {
     f((e) => e.filter((r) => r !== o)), c({
       ...t,
       [o]: void 0
     });
-  }, k = (o, e) => {
-    f((r) => [...r, o]), h(e);
+  }, v = (o, e) => {
+    f((r) => [...r, o]), C(e);
   };
-  return /* @__PURE__ */ v($, { children: [
-    b && /* @__PURE__ */ i(M, { ...b }),
-    m && /* @__PURE__ */ i(w, { ...m }),
-    R.map((o) => /* @__PURE__ */ i(
-      q,
+  return /* @__PURE__ */ B(q, { children: [
+    b && /* @__PURE__ */ i(V, { ...b }),
+    m && /* @__PURE__ */ i(z, { ...m }),
+    j.map((o) => /* @__PURE__ */ i(
+      w,
       {
         id: g(o.name, o.id),
         showResultsLabel: A,
         onRemove: () => {
-          L(o.name);
+          k(o.name);
         },
         onChange: (e) => {
-          j(o.name, [e.target.value], o.optionType);
+          L(o.name, [e.target.value], o.optionType);
         },
         name: o.name,
         options: o.options,
@@ -70,9 +71,10 @@ const g = (n, l) => l || `toolbar-filter-${n}`, P = ({
       o.name
     )),
     (a == null ? void 0 : a.length) > 0 && /* @__PURE__ */ i(
-      V,
+      $,
       {
         id: "toolbar-filter-add",
+        label: h,
         items: a.map((o) => {
           const e = g(o.name, o.id);
           return {
@@ -80,7 +82,7 @@ const g = (n, l) => l || `toolbar-filter-${n}`, P = ({
             title: o.label,
             name: o.name,
             onClick: () => {
-              k(o.name, e);
+              v(o.name, e);
             }
           };
         })
@@ -90,5 +92,5 @@ const g = (n, l) => l || `toolbar-filter-${n}`, P = ({
   ] });
 };
 export {
-  P as Toolbar
+  Q as Toolbar
 };

package/dist/components/Toolbar/ToolbarAccountMenu.js

@@ -1,20 +1,34 @@
-import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { jsxs as f, jsx as m } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
-import { useRootContext as a } from "../RootProvider/RootProvider.js";
-import { ToolbarButton as d } from "./ToolbarButton.js";
-import { ToolbarFilterBase as f } from "./ToolbarFilterBase.js";
-import { DrawerOrDropdown as x } from "../Dropdown/DrawerOrDropdown.js";
-import { AccountMenu as T } from "../GlobalMenu/AccountMenu.js";
+import { useRootContext as n } from "../RootProvider/RootProvider.js";
+import { ToolbarButton as x } from "./ToolbarButton.js";
+import { ToolbarFilterBase as T } from "./ToolbarFilterBase.js";
+import { DrawerOrDropdown as b } from "../Dropdown/DrawerOrDropdown.js";
+import { AccountMenu as g } from "../GlobalMenu/AccountMenu.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-const k = ({ currentAccount: o, id: t = "toolbar-accounts", ...m }) => {
-  const { currentId: i, toggleId: l, closeAll: p } = a(), s = () => l(t), e = i === t;
-  return /* @__PURE__ */ n(f, { expanded: e, children: [
-    /* @__PURE__ */ r(d, { type: "switch", onToggle: s, active: !!o, children: o == null ? void 0 : o.name }),
-    /* @__PURE__ */ r(x, { open: e, drawerTitle: "Endre konto", onClose: p, children: /* @__PURE__ */ r(T, { ...m, currentAccount: o }) })
+const y = ({
+  currentAccount: o,
+  id: i = "toolbar-accounts",
+  onSelectAccount: r,
+  ...e
+}) => {
+  const { currentId: s, toggleId: l, closeAll: p } = n(), a = () => l(i), t = s === i;
+  return /* @__PURE__ */ f(T, { expanded: t, children: [
+    /* @__PURE__ */ m(x, { type: "switch", onToggle: a, active: !!o, children: o == null ? void 0 : o.name }),
+    /* @__PURE__ */ m(b, { open: t, drawerTitle: "Endre konto", onClose: p, children: /* @__PURE__ */ m(
+      g,
+      {
+        ...e,
+        onSelectAccount: (d) => {
+          r == null || r(d), p();
+        },
+        currentAccount: o
+      }
+    ) })
   ] });
 };
 export {
-  k as ToolbarAccountMenu
+  y as ToolbarAccountMenu
 };

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

@@ -11,7 +11,8 @@ export interface ToolbarProps {
     getFilterLabel?: (name: string, value: ToolbarFilterProps['value']) => string;
     onFilterStateChange?: (state: FilterState) => void;
     showResultsLabel?: string;
+    addFilterButtonLabel?: string;
     removeButtonAltText?: string;
     children?: ReactNode;
 }
-export declare const Toolbar: ({ filters, filterState, onFilterStateChange, search, accountMenu, getFilterLabel, children, showResultsLabel, removeButtonAltText, }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Toolbar: ({ filters, filterState, onFilterStateChange, search, accountMenu, getFilterLabel, children, showResultsLabel, removeButtonAltText, addFilterButtonLabel, }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -2,7 +2,7 @@ import { StoryObj } from '@storybook/react';
 import { Toolbar } from './Toolbar';
 declare const meta: {
     title: string;
-    component: ({ filters, filterState, onFilterStateChange, search, accountMenu, getFilterLabel, children, showResultsLabel, removeButtonAltText, }: import('./Toolbar').ToolbarProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ filters, filterState, onFilterStateChange, search, accountMenu, getFilterLabel, children, showResultsLabel, removeButtonAltText, addFilterButtonLabel, }: import('./Toolbar').ToolbarProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
@@ -19,3 +19,4 @@ export declare const HiddenFilters: Story;
 export declare const WithAccountMenu: Story;
 export declare const WithSearch: Story;
 export declare const ControlledStateFilters: (args: typeof Toolbar) => import("react/jsx-runtime").JSX.Element;
+export declare const ControlledStateAccount: () => import("react/jsx-runtime").JSX.Element;

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

@@ -2,4 +2,4 @@ import { AccountMenuProps } from '../';
 export interface ToolbarAccountMenuProps extends AccountMenuProps {
     id?: string;
 }
-export declare const ToolbarAccountMenu: ({ currentAccount, id, ...rest }: ToolbarAccountMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarAccountMenu: ({ currentAccount, id, onSelectAccount, ...rest }: ToolbarAccountMenuProps) => import("react/jsx-runtime").JSX.Element;

package/package.json

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