@altinn/altinn-components 0.66.1 → 0.67.1

package/dist/components/Transmission/TransmissionList.js

@@ -2,7 +2,7 @@ import { jsx as i, jsxs as s } from "react/jsx-runtime";
 import { createElement as l } from "react";
 import "../../index-p1eeF8LQ.js";
 import "../../tooltip-Ct39-719.js";
-import { a } from "../../ToolbarSearch-DFYx6gIb.js";
+import { a } from "../../ToolbarSearch-bv2opbAj.js";
 import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";

package/dist/components/Transmission/TransmissionType.js

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import { B as o } from "../../ToolbarSearch-DFYx6gIb.js";
+import { B as o } from "../../ToolbarSearch-bv2opbAj.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import "../../tooltip-Ct39-719.js";

package/dist/components/Typography/Heading.js

@@ -3,7 +3,7 @@ import "../../index-p1eeF8LQ.js";
 import "react";
 import "../Skeleton/Skeleton.js";
 import "../../tooltip-Ct39-719.js";
-import { H as s } from "../../ToolbarSearch-DFYx6gIb.js";
+import { H as s } from "../../ToolbarSearch-bv2opbAj.js";
 import "./useHighlightedText.js";
 import "./Link.js";
 import "../Button/Button.js";

package/dist/components/Typography/index.js

@@ -1,5 +1,5 @@
 import { Typography as p } from "./Typography.js";
-import { H as a } from "../../ToolbarSearch-DFYx6gIb.js";
+import { H as a } from "../../ToolbarSearch-bv2opbAj.js";
 import { Link as m } from "./Link.js";
 export {
   a as Heading,

package/dist/components/UserListItem/UserListItem.js

@@ -1,5 +1,5 @@
 import { jsx as s, jsxs as _ } from "react/jsx-runtime";
-import { B as h } from "../../ToolbarSearch-DFYx6gIb.js";
+import { B as h } from "../../ToolbarSearch-bv2opbAj.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import "../../tooltip-Ct39-719.js";

package/dist/components/index.js

@@ -11,7 +11,7 @@ import { AccountNotificationSettings as A } from "./Account/AccountNotificationS
 import { AccountOrganization as y } from "./Account/AccountOrganization.js";
 import { AccountSelector as k } from "./AccountSelector/AccountSelector.js";
 import { Alert as v } from "./Alert/Alert.js";
-import { B as P, a as C, D as H, b as w, c as E, d as G, e as O, f as R, g as N, F as V, H as U, I as z, h as j, i as Q, M as q, j as J, k as K, l as W, m as X, n as Y, R as Z, S as _, T as $, t as oo, V as ro, u as eo, w as to } from "../ToolbarSearch-DFYx6gIb.js";
+import { B as P, a as C, D as H, b as w, c as E, d as G, e as O, f as R, g as N, F as V, H as U, I as z, h as j, i as Q, M as q, j as J, k as K, l as W, m as X, n as Y, R as Z, S as _, T as $, t as oo, V as ro, u as eo, w as to } from "../ToolbarSearch-bv2opbAj.js";
 import { Banner as ao, BannerColorEnum as po, BannerVariantEnum as io } from "./Banner/Banner.js";
 import { BookmarkSettingsItem as fo } from "./Bookmarks/BookmarkSettingsItem.js";
 import { BookmarkSettingsList as no } from "./Bookmarks/BookmarkSettingsList.js";

package/dist/hooks/useAccountSelector.js

@@ -1,112 +1,118 @@
-import { jsx as S } from "react/jsx-runtime";
-import { useRef as x, useMemo as z } from "react";
+import { jsx as F } from "react/jsx-runtime";
+import { useRef as R, useMemo as h } from "react";
 import "../index-p1eeF8LQ.js";
 import "../tooltip-Ct39-719.js";
-import "../ToolbarSearch-DFYx6gIb.js";
+import "../ToolbarSearch-bv2opbAj.js";
 import "../components/Typography/Link.js";
-import { Button as G } from "../components/Button/Button.js";
+import { Button as q } from "../components/Button/Button.js";
 import "react-dom";
-import { useIsDesktop as Y } from "./useIsDesktop.js";
+import { useIsDesktop as J } from "./useIsDesktop.js";
 import "../components/GlobalMenu/GlobalMenuBase.js";
 import "../components/Snackbar/useSnackbar.js";
-import { formatDisplayName as R } from "../functions/name/name.js";
-import { formatDate as q } from "../functions/date/date.js";
-import { formatOrgNo as j } from "../functions/orgno/orgno.js";
-import { a as J, S as K } from "../HeartFill-CbQmSZr5.js";
-const H = (o) => o === "Organization" ? "company" : "person", dt = ({
-  partyListDTO: o = [],
-  favoriteAccountUuids: e,
+import { formatDisplayName as j } from "../functions/name/name.js";
+import { formatDate as K } from "../functions/date/date.js";
+import { formatOrgNo as w } from "../functions/orgno/orgno.js";
+import { a as Q, S as X } from "../HeartFill-CbQmSZr5.js";
+const H = (e) => e === "Organization" ? "company" : "person", pt = ({
+  partyListDTO: e = [],
+  favoriteAccountUuids: o,
   currentAccountUuid: f,
-  selfAccountUuid: m,
-  isLoading: d = !1,
+  selfAccountUuid: d,
+  isLoading: m = !1,
   onSelectAccount: N,
   virtualized: p = !1,
-  onToggleFavorite: h,
-  languageCode: n,
-  showDeletedUnits: i,
-  onShowDeletedUnitsChange: _
+  onToggleFavorite: I,
+  languageCode: s,
+  showDeletedUnits: c,
+  onShowDeletedUnitsChange: g
 }) => {
-  const v = Y(), c = x(h);
-  c.current = h;
-  const g = x(f);
-  g.current = f;
-  const y = z(() => {
-    if (!o || o.length === 0) return [];
-    const a = n || "nb", s = (r, l) => r.name.localeCompare(l.name, a, {
+  const v = J(), u = R(I);
+  u.current = I;
+  const _ = R(f);
+  _.current = f;
+  const y = h(() => {
+    if (!e || e.length === 0) return [];
+    const i = s || "nb", r = (n, l) => n.name.localeCompare(l.name, i, {
       sensitivity: "base",
       ignorePunctuation: !0
     });
-    return [...o].sort(s);
-  }, [o, n]), [O, V] = z(() => {
-    if (d || !y.length || !m)
+    return [...e].sort(r);
+  }, [e, s]), $ = h(
+    () => e.some((i) => i.isDeleted || i.subunits?.some((r) => r.isDeleted)),
+    [e]
+  ), V = h(
+    () => e.reduce((i, r) => i + 1 + (r.subunits?.length ?? 0), 0),
+    [e]
+  ), [D, W] = h(() => {
+    if (m || !y.length || !d)
       return [
         { selfAccountItem: void 0, peopleAccountItems: [], organizationAccountItems: [], favoriteAccountItems: [] },
         {}
       ];
-    const a = new Set(e), s = (t) => a.has(t), r = (t) => !t.isDeleted || i !== !1 || t.partyUuid === g.current, l = M(n), I = n || "nb", w = (t, u) => t.name.localeCompare(u.name, I, {
+    const i = new Set(o), r = (t) => i.has(t), n = (t) => !t.isDeleted || c !== !1 || t.partyUuid === _.current, l = M(s), A = s || "nb", G = (t, a) => t.name.localeCompare(a.name, A, {
       sensitivity: "base",
       ignorePunctuation: !0
     });
-    let B;
-    const k = [], A = [], U = [];
+    let x;
+    const k = [], U = [], S = [];
     for (const t of y)
-      if (X(t.type)) {
-        if (t.partyUuid === m)
-          B = F(
-            n,
+      if (T(t.type)) {
+        if (t.partyUuid === d)
+          x = z(
+            s,
             t,
             "favorites",
             !1,
-            c,
+            u,
             v,
             void 0,
             !0
           );
-        else if (r(t) || s(t.partyUuid)) {
-          const u = F(
-            n,
+        else if (n(t) || r(t.partyUuid)) {
+          const a = z(
+            s,
             t,
             t.partyUuid,
-            s(t.partyUuid),
-            c,
+            r(t.partyUuid),
+            u,
             v
           );
-          k.push(u), s(t.partyUuid) && U.push({ ...u, groupId: "favorites" });
+          k.push(a), r(t.partyUuid) && S.push({ ...a, groupId: "favorites" });
         }
-      } else if (T(t.type)) {
-        if (r(t) || s(t.partyUuid)) {
-          const u = F(
-            n,
+      } else if (C(t.type)) {
+        if (n(t) || r(t.partyUuid)) {
+          const a = z(
+            s,
             t,
             t.partyUuid,
-            s(t.partyUuid),
-            c,
+            r(t.partyUuid),
+            u,
             v
           );
-          r(t) && A.push(u), s(t.partyUuid) && U.push({ ...u, groupId: "favorites" });
+          n(t) && U.push(a), r(t.partyUuid) && S.push({ ...a, groupId: "favorites" });
         }
         if (t.subunits && t.subunits.length > 0) {
-          const u = [...t.subunits].sort(w);
-          for (const b of u)
-            if (r(b) || s(b.partyUuid)) {
-              const D = F(
-                n,
+          const a = [...t.subunits].sort(G);
+          for (const b of a)
+            if (n(b) || r(b.partyUuid)) {
+              const O = z(
+                s,
                 b,
                 t.partyUuid,
-                s(b.partyUuid),
-                c,
+                r(b.partyUuid),
+                u,
                 v,
                 t
               );
-              r(b) && A.push(D), s(b.partyUuid) && U.push({
-                ...D,
+              n(b) && U.push(O), r(b.partyUuid) && S.push({
+                ...O,
                 groupId: "favorites"
               });
             }
         }
       }
-    const E = {
-      [A[0]?.groupId || "company"]: {
+    const Y = {
+      [U[0]?.groupId || "company"]: {
         title: l.account_orgs,
         divider: !0
       },
@@ -119,23 +125,23 @@ const H = (o) => o === "Organization" ? "company" : "person", dt = ({
         divider: !0
       }
     };
-    return [{ selfAccountItem: B, peopleAccountItems: k, organizationAccountItems: A, favoriteAccountItems: U }, E];
-  }, [y, m, e, d, n, v, i]), P = z(() => {
-    const { selfAccountItem: a, peopleAccountItems: s, organizationAccountItems: r, favoriteAccountItems: l } = O;
-    return a ? [a, ...l, ...s, ...r] : [];
-  }, [O]), [W, $] = z(() => {
+    return [{ selfAccountItem: x, peopleAccountItems: k, organizationAccountItems: U, favoriteAccountItems: S }, Y];
+  }, [y, d, o, m, s, v, c]), P = h(() => {
+    const { selfAccountItem: i, peopleAccountItems: r, organizationAccountItems: n, favoriteAccountItems: l } = D;
+    return i ? [i, ...l, ...r, ...n] : [];
+  }, [D]), [E, B] = h(() => {
     if (P.length === 0)
       return [[], void 0];
-    let a;
-    return [P.map((r) => {
-      if (f === r.id) {
-        const I = { ...r, selected: !0 };
-        return a = I, I;
+    let i;
+    return [P.map((n) => {
+      if (f === n.id) {
+        const A = { ...n, selected: !0 };
+        return i = A, A;
       }
-      return r.selected ? { ...r, selected: !1 } : r;
-    }), a];
+      return n.selected ? { ...n, selected: !1 } : n;
+    }), i];
   }, [P, f]);
-  return d || !o || !$ ? {
+  return m || !e || !B ? {
     accountMenu: {
       items: [],
       groups: {},
@@ -144,89 +150,90 @@ const H = (o) => o === "Organization" ? "company" : "person", dt = ({
       },
       currentAccount: void 0
     },
-    loading: d
+    loading: m
   } : {
     accountMenu: {
-      items: W,
-      groups: V,
+      items: E,
+      groups: W,
       virtualized: p,
       onSelectAccount: N,
-      currentAccount: $
+      currentAccount: B
     },
     loading: !1,
-    showDeletedUnits: i,
-    onShowDeletedUnitsChange: _
+    showDeletedUnits: $ ? c : void 0,
+    onShowDeletedUnitsChange: $ ? g : void 0,
+    accountCount: V
   };
-}, Q = ({
-  partyUuid: o,
-  isFavorite: e,
+}, Z = ({
+  partyUuid: e,
+  isFavorite: o,
   toggleFavoriteRef: f,
-  texts: m
-}) => /* @__PURE__ */ S(
-  G,
+  texts: d
+}) => /* @__PURE__ */ F(
+  q,
   {
     rounded: !0,
     variant: "ghost",
-    "aria-label": e ? m.remove_from_favorites : m.add_to_favorites,
-    onClick: (d) => {
-      d.stopPropagation(), f?.current?.(o);
+    "aria-label": o ? d.remove_from_favorites : d.add_to_favorites,
+    onClick: (m) => {
+      m.stopPropagation(), f?.current?.(e);
     },
     size: "xs",
-    children: e ? /* @__PURE__ */ S(J, {}) : /* @__PURE__ */ S(K, {})
+    children: o ? /* @__PURE__ */ F(Q, {}) : /* @__PURE__ */ F(X, {})
   }
-), F = (o, e, f, m, d, N, p, h) => {
-  const n = H(e?.type ?? ""), i = M(o), _ = R({
-    fullName: e?.name,
-    type: n
-  }), v = p ? R({
+), z = (e, o, f, d, m, N, p, I) => {
+  const s = H(o?.type ?? ""), c = M(e), g = j({
+    fullName: o?.name,
+    type: s
+  }), v = p ? j({
     fullName: p?.name,
     type: H(p?.type ?? ""),
     reverseNameOrder: !1
   }) : void 0;
-  let c = "";
-  const g = n === "company" && p ? "subunit" : n;
-  switch (g) {
+  let u = "";
+  const _ = s === "company" && p ? "subunit" : s;
+  switch (_) {
     case "company":
-      c = `${i.org_no}. ${j(e.organizationNumber)}`;
+      u = `${c.org_no}. ${w(o.organizationNumber)}`;
       break;
     case "person":
-      c = e?.dateOfBirth ? `${i.birthdate}: ${q(e?.dateOfBirth)}` : "";
+      u = o?.dateOfBirth ? `${c.birthdate}: ${K(o?.dateOfBirth)}` : "";
       break;
     case "subunit":
-      c = `↳ ${i.org_no}. ${j(e?.organizationNumber)}, ${i.subunit_of} ${v}`;
+      u = `↳ ${c.org_no}. ${w(o?.organizationNumber)}, ${c.subunit_of} ${v}`;
       break;
     default:
-      c = "";
+      u = "";
   }
-  const y = h ? void 0 : /* @__PURE__ */ S(
-    Q,
+  const y = I ? void 0 : /* @__PURE__ */ F(
+    Z,
     {
-      partyUuid: e?.partyUuid,
-      isFavorite: m,
-      toggleFavoriteRef: d,
-      texts: i
+      partyUuid: o?.partyUuid,
+      isFavorite: d,
+      toggleFavoriteRef: m,
+      texts: c
     }
   );
   return {
-    id: e?.partyUuid,
+    id: o?.partyUuid,
     icon: {
-      name: _,
-      type: n,
+      name: g,
+      type: s,
       isParent: !p,
-      isDeleted: e?.isDeleted
+      isDeleted: o?.isDeleted
     },
-    name: _,
-    description: c,
-    searchWords: g === "person" ? [_, e?.dateOfBirth ?? ""] : [_, e?.organizationNumber ?? ""],
+    name: g,
+    description: u,
+    searchWords: _ === "person" ? [g, o?.dateOfBirth ?? ""] : [g, o?.organizationNumber ?? ""],
     groupId: f,
-    type: g,
+    type: _,
     selected: !1,
-    disabled: !!e?.onlyHierarchyElementWithNoAccess,
-    badge: h ? { label: i.you, color: "person" } : e.isDeleted && N ? { label: i.deleted, color: "neutral" } : void 0,
+    disabled: !!o?.onlyHierarchyElementWithNoAccess,
+    badge: I ? { label: c.you, color: "person" } : o.isDeleted && N ? { label: c.deleted, color: "neutral" } : void 0,
     controls: y
   };
-}, T = (o) => o === "Organization", X = (o) => o === "Person" || o === "SelfIdentified", M = (o) => {
-  switch (o) {
+}, C = (e) => e === "Organization", T = (e) => e === "Person" || e === "SelfIdentified", M = (e) => {
+  switch (e) {
     case "nn":
       return {
         account_orgs: "Virksemder",
@@ -269,5 +276,5 @@ const H = (o) => o === "Organization" ? "company" : "person", dt = ({
   }
 };
 export {
-  dt as useAccountSelector
+  pt as useAccountSelector
 };

package/dist/index.js

@@ -11,7 +11,7 @@ import { AccountNotificationSettings as b } from "./components/Account/AccountNo
 import { AccountOrganization as y } from "./components/Account/AccountOrganization.js";
 import { AccountSelector as k } from "./components/AccountSelector/AccountSelector.js";
 import { Alert as v } from "./components/Alert/Alert.js";
-import { B as C, a as P, D as H, b as w, c as E, d as G, e as O, f as N, g as R, F as V, H as U, I as z, h as j, i as Q, M as K, j as q, k as J, l as W, m as X, n as Y, R as Z, S as _, T as $, t as oo, V as ro, u as eo, w as to } from "./ToolbarSearch-DFYx6gIb.js";
+import { B as C, a as P, D as H, b as w, c as E, d as G, e as O, f as N, g as R, F as V, H as U, I as z, h as j, i as Q, M as K, j as q, k as J, l as W, m as X, n as Y, R as Z, S as _, T as $, t as oo, V as ro, u as eo, w as to } from "./ToolbarSearch-bv2opbAj.js";
 import { Banner as ao, BannerColorEnum as po, BannerVariantEnum as xo } from "./components/Banner/Banner.js";
 import { BookmarkSettingsItem as fo } from "./components/Bookmarks/BookmarkSettingsItem.js";
 import { BookmarkSettingsList as no } from "./components/Bookmarks/BookmarkSettingsList.js";

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

@@ -13,5 +13,13 @@ export interface AccountSelectorProps {
     onShowDeletedUnitsChange?: (newValue: boolean) => void;
     /** Show in fullscreen*/
     isFullScreen?: boolean;
+    /**
+     * Total number of accounts the user has, including deleted ones. Used to
+     * decide whether to show the search field, so the decision stays stable when
+     * the user toggles deleted accounts on/off (toggling only changes how many
+     * accounts are currently listed, not how many the user actually has).
+     * Falls back to the number of currently listed accounts when not provided.
+     */
+    accountCount?: number;
 }
-export declare const AccountSelector: ({ accountMenu, forceOpenFullScreen, className, loading, showDeletedUnits, onShowDeletedUnitsChange, isFullScreen, }: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AccountSelector: ({ accountMenu, forceOpenFullScreen, className, loading, showDeletedUnits, onShowDeletedUnitsChange, isFullScreen, accountCount, }: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import { AccountSelectorProps } from './AccountSelector';
 declare const meta: {
     title: string;
-    component: ({ accountMenu, forceOpenFullScreen, className, loading, showDeletedUnits, onShowDeletedUnitsChange, isFullScreen, }: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ accountMenu, forceOpenFullScreen, className, loading, showDeletedUnits, onShowDeletedUnitsChange, isFullScreen, accountCount, }: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {
         layout: string;
@@ -27,3 +27,8 @@ export default meta;
 export declare const WithAccounts: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
 export declare const NoAccounts: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Loading: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const UsingUseAccountHook: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ThreeAccounts: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FourAccountsOneDeleted: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SixAccountsThreeDeleted: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TenAccountsNoneDeleted: (args: AccountSelectorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Layout/AccountSelectorInLayout.stories.d.ts

@@ -0,0 +1,49 @@
+import { LayoutProps } from '../';
+interface LayoutStoryArgs extends LayoutProps {
+    forceOpenFullScreen?: boolean | undefined;
+}
+/**
+ * AccountSelector demos rendered inside a full Layout, so you can see how the
+ * selector behaves alongside the header, sidebar and global menu. The same
+ * cases are available as standalone-component stories under Layout/AccountSelector.
+ */
+declare const meta: {
+    title: string;
+    component: ({ banner, color, theme, header, footer, sidebar, content, children, skipLink, breadcrumbs, }: LayoutProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    args: {
+        theme: "subtle";
+        skipLink: {
+            href: string;
+            color: import('..').Color;
+            size: import('..').Size;
+            children: string;
+        };
+        header: import('..').GlobalHeaderProps;
+        footer: import('..').FooterProps;
+        sidebar: {
+            menu: import('..').MenuProps;
+        };
+        children: import("react/jsx-runtime").JSX.Element;
+        color: "company";
+        forceOpenFullScreen: undefined;
+    };
+    argTypes: {
+        color: {
+            control: "select";
+            options: string[];
+        };
+        forceOpenFullScreen: {
+            control: "select";
+            options: (boolean | undefined)[];
+        };
+    };
+};
+export default meta;
+export declare const UsingUseAccountHook: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const ThreeAccounts: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const FourAccountsOneDeleted: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const SixAccountsThreeDeleted: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const TenAccountsNoneDeleted: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;

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

@@ -38,7 +38,6 @@ declare const meta: {
 };
 export default meta;
 export declare const Preview: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
-export declare const UsingUseAccountHook: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
 export declare const LogInView: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
 export declare const WithEnglishLanguage: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;
 export declare const StickySidebar: (args: LayoutStoryArgs) => import("react/jsx-runtime").JSX.Element;

package/package.json

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