@altinn/altinn-components 0.8.3 → 0.9.1

package/dist/components/Dialog/DialogStatus.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ loading, size, value, label }: import('./DialogStatus').DialogStatusProps) => import("react/jsx-runtime").JSX.Element | null;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        value: {
+            options: string[];
+        };
+    };
+    args: {};
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Draft: Story;
+export declare const Sent: Story;
+export declare const RequiresAttention: Story;
+export declare const InProgress: Story;
+export declare const Completed: Story;

package/dist/components/Dropdown/DrawerButton.js

@@ -2,10 +2,10 @@ import { jsx as t } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
+import "../Autocomplete/AutocompleteBase.js";
+import "../RootProvider/RootProvider.js";
 import { ButtonBase as m } from "../Button/ButtonBase.js";
 import { ButtonLabel as n } from "../Button/ButtonLabel.js";
-import "../RootProvider/RootProvider.js";
-import "../Searchbar/AutocompleteBase.js";
 import '../../assets/DrawerButton.css';const s = "_button_19v2d_1", e = {
   button: s
 }, f = ({ label: o, children: r, onClick: i }) => /* @__PURE__ */ t(m, { variant: "solid", size: "md", className: e.button, onClick: i, children: /* @__PURE__ */ t(n, { size: "md", children: r || o }) });

package/dist/components/Dropdown/DrawerOrDropdown.js

@@ -2,6 +2,7 @@ import { jsxs as e, Fragment as a, jsx as o } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
+import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
 import { DropdownBase as l } from "./DropdownBase.js";
 import { Backdrop as d } from "./Backdrop.js";
@@ -10,7 +11,6 @@ import { DrawerHeader as f } from "./DrawerHeader.js";
 import { DrawerFooter as n } from "./DrawerFooter.js";
 import { DrawerButton as D } from "./DrawerButton.js";
 import { DrawerBody as w } from "./DrawerBody.js";
-import "../Searchbar/AutocompleteBase.js";
 import '../../assets/DrawerOrDropdown.css';const _ = "_dropdown_1mzzo_1", k = "_drawer_1mzzo_5", s = {
   dropdown: _,
   drawer: k

package/dist/components/Dropdown/DropdownBase.js

@@ -1,32 +1,32 @@
 import { jsx as s } from "react/jsx-runtime";
 import { c as p } from "../../index-L8X2o7IH.js";
-import { useRef as c } from "react";
-import { useClickOutside as m } from "../../hooks/useClickOutside.js";
-import '../../assets/DropdownBase.css';const i = "_dropdown_tp90e_1", u = "_drawer_tp90e_33", _ = "_button_tp90e_33", f = {
-  dropdown: i,
-  drawer: u,
-  button: _
-}, g = ({
-  placement: t = "left",
-  padding: r = !0,
-  open: e = !1,
-  className: d,
+import { useRef as i } from "react";
+import { useClickOutside as c } from "../../hooks/useClickOutside.js";
+import '../../assets/DropdownBase.css';const w = "_dropdown_1igwp_1", m = "_drawer_1igwp_33", u = "_button_1igwp_33", _ = {
+  dropdown: w,
+  drawer: m,
+  button: u
+}, b = ({
+  placement: r = "left",
+  padding: t = !0,
+  open: d = !1,
+  className: e,
   children: n,
   onClose: a
 }) => {
-  const o = c(null);
-  return m(o, a), /* @__PURE__ */ s(
+  const o = i(null);
+  return c(o, a), /* @__PURE__ */ s(
     "div",
     {
       ref: o,
-      className: p(f.dropdown, d),
-      "data-placement": t,
-      "data-padding": r,
-      "aria-expanded": e,
+      className: p(_.dropdown, e),
+      "data-placement": r,
+      "data-padding": t,
+      "aria-expanded": d,
       children: n
     }
   );
 };
 export {
-  g as DropdownBase
+  b as DropdownBase
 };

package/dist/components/Footer/Footer.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ address, address2, menu }: import('./Footer').FooterProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        address: string;
+        address2: string;
+        menu: {
+            items: {
+                id: string;
+                title: string;
+            }[];
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/components/GlobalMenu/AccountButton.js

@@ -5,8 +5,8 @@ import { MenuItemMedia as s } from "../Menu/MenuItemMedia.js";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
+import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
-import "../Searchbar/AutocompleteBase.js";
 const b = ({ account: e, linkText: t, onClick: l, multipleAccounts: d }) => d ? /* @__PURE__ */ r(m, { size: "lg", onClick: l, linkText: t, linkIcon: "chevron-right", as: "button", children: [
   /* @__PURE__ */ i(
     s,

package/dist/components/GlobalMenu/AccountMenu.js

@@ -3,8 +3,8 @@ import { jsx as v } from "react/jsx-runtime";
 import { useState as y } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
+import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
-import "../Searchbar/AutocompleteBase.js";
 import { Menu as L } from "../Menu/Menu.js";
 const M = (p) => `${p} hits`, k = ({
   accounts: p = [],

package/dist/components/GlobalMenu/AccountMenu.stories.js

@@ -1,84 +1,21 @@
-import { AccountMenu as e } from "./AccountMenu.js";
-const r = {
+import { accountMenu as t } from "../../examples/accountMenu.js";
+import "../../examples/globalMenu.js";
+import "../../examples/inboxFilters.js";
+import "react/jsx-runtime";
+import "react";
+import { AccountMenu as o } from "./AccountMenu.js";
+const u = {
   title: "GlobalMenu/AccountMenu",
-  component: e,
+  component: o,
   tags: ["autodocs"],
   parameters: {},
   args: {
-    accountGroups: {
-      primary: {
-        title: "Deg selv og favoritter"
-      },
-      secondary: {
-        title: "Andre kontoer"
-      }
-    },
-    accounts: [
-      {
-        id: "aurora",
-        groupId: "primary",
-        type: "person",
-        name: "Aurora Mikalsen",
-        selected: !0,
-        badge: {
-          label: "2"
-        }
-      },
-      {
-        id: "bergen-bar",
-        groupId: "favourites",
-        type: "company",
-        name: "Bergen Bar",
-        selected: !1,
-        badge: {
-          label: "19"
-        }
-      },
-      {
-        id: "allAccounts",
-        groupId: "groups",
-        type: "company",
-        name: "Alle virksomheter",
-        accountNames: ["Keeperhansker AS", "Stadion drift AS", "Landslaget"],
-        selected: !1,
-        badge: {
-          label: "19"
-        }
-      },
-      {
-        id: "keeper",
-        groupId: "secondary",
-        type: "company",
-        name: "Keeperhansker AS",
-        selected: !1
-      },
-      {
-        id: "stadion-drift",
-        groupId: "secondary",
-        type: "company",
-        name: "Stadion drift AS",
-        selected: !1
-      },
-      {
-        id: "sk-brann",
-        groupId: "favourites",
-        type: "company",
-        name: "Sportsklubben Brann",
-        selected: !1
-      },
-      {
-        id: "norge",
-        groupId: "secondary",
-        type: "company",
-        name: "Landslaget",
-        selected: !1
-      }
-    ]
+    ...t
   }
-}, t = {
+}, p = {
   args: {}
 };
 export {
-  t as Default,
-  r as default
+  p as Default,
+  u as default
 };

package/dist/components/GlobalMenu/BackButton.js

@@ -3,9 +3,9 @@ import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
 import { MenuItem as i } from "../Menu/MenuItem.js";
+import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
-import "../Searchbar/AutocompleteBase.js";
-const u = ({ label: t, onClick: o }) => /* @__PURE__ */ r(i, { id: "back", icon: "arrow-left", title: t, onClick: o });
+const a = ({ label: o, onClick: t }) => /* @__PURE__ */ r(i, { size: "xs", id: "back", icon: "arrow-undo", title: o, onClick: t });
 export {
-  u as BackButton
+  a as BackButton
 };

package/dist/components/GlobalMenu/GlobalMenu.js

@@ -3,26 +3,26 @@ import { jsxs as n, jsx as o, Fragment as x } from "react/jsx-runtime";
 import { useState as G } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
+import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
 import { AccountMenu as v } from "./AccountMenu.js";
 import { AccountButton as C } from "./AccountButton.js";
 import { BackButton as j } from "./BackButton.js";
 import { LogoutButton as A } from "./LogoutButton.js";
-import "../Searchbar/AutocompleteBase.js";
 import { MenuListItem as l } from "../Menu/MenuBase.js";
-import { Menu as d } from "../Menu/Menu.js";
-import { GlobalMenuBase as m, GlobalMenuHeader as f, GlobalMenuFooter as F } from "./GlobalMenuBase.js";
+import { Menu as u } from "../Menu/Menu.js";
+import { GlobalMenuBase as m, GlobalMenuHeader as d, GlobalMenuFooter as F } from "./GlobalMenuBase.js";
 const O = ({
   accounts: a = [],
-  accountGroups: h = {},
-  accountSearch: s,
-  items: p = [],
+  accountGroups: f = {},
+  accountSearch: h,
+  items: s = [],
   groups: c,
   changeLabel: M = "Change",
   backLabel: g = "Back",
   currentAccount: r,
   onSelectAccount: e,
-  logoutButton: u
+  logoutButton: p
 }) => {
   const [b, k] = G(!1), t = () => {
     k((i) => !i);
@@ -30,20 +30,20 @@ const O = ({
     t(), e == null || e(i);
   };
   return b ? /* @__PURE__ */ n(m, { children: [
-    /* @__PURE__ */ o(f, { children: /* @__PURE__ */ o(j, { onClick: t, label: g }) }),
-    !s && /* @__PURE__ */ o(l, { as: "div", role: "separator" }),
+    /* @__PURE__ */ o(d, { children: /* @__PURE__ */ o(j, { onClick: t, label: g }) }),
+    /* @__PURE__ */ o(l, { as: "div", role: "separator" }),
     /* @__PURE__ */ o(
       v,
       {
         currentAccount: r,
         accounts: a,
-        accountGroups: h,
-        accountSearch: s,
+        accountGroups: f,
+        accountSearch: h,
         onSelectAccount: B
       }
     )
   ] }) : r ? /* @__PURE__ */ n(m, { children: [
-    /* @__PURE__ */ o(f, { children: /* @__PURE__ */ o(
+    /* @__PURE__ */ o(d, { children: /* @__PURE__ */ o(
       C,
       {
         account: r,
@@ -53,12 +53,12 @@ const O = ({
       }
     ) }),
     /* @__PURE__ */ o(l, { as: "div", role: "separator" }),
-    /* @__PURE__ */ o(d, { groups: c, items: p }),
-    u && /* @__PURE__ */ n(x, { children: [
+    /* @__PURE__ */ o(u, { groups: c, items: s }),
+    p && /* @__PURE__ */ n(x, { children: [
       /* @__PURE__ */ o(l, { as: "div", role: "separator" }),
-      /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o(A, { ...u }) })
+      /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o(A, { ...p }) })
     ] })
-  ] }) : /* @__PURE__ */ o(m, { children: /* @__PURE__ */ o(d, { groups: c, items: p }) });
+  ] }) : /* @__PURE__ */ o(m, { children: /* @__PURE__ */ o(u, { groups: c, items: s }) });
 };
 export {
   O as GlobalMenu

package/dist/components/GlobalMenu/GlobalMenu.stories.js

@@ -1,174 +1,40 @@
-import { GlobalMenu as a } from "./GlobalMenu.js";
-const t = {
+import { jsx as l } from "react/jsx-runtime";
+import { useState as m } from "react";
+import { globalMenu as i } from "../../examples/globalMenu.js";
+import { loginMenu as p } from "../../examples/loginMenu.js";
+import "../../examples/inboxFilters.js";
+import { GlobalMenu as r } from "./GlobalMenu.js";
+const b = {
   title: "GlobalMenu/GlobalMenu",
-  component: a,
+  component: r,
   tags: ["autodocs"],
   parameters: {},
   args: {
-    accountGroups: {
-      primary: {
-        title: "Deg selv og favoritter"
-      },
-      secondary: {
-        title: "Andre kontoer"
-      }
-    },
-    currentAccount: {
-      id: "party:mathias",
-      type: "person",
-      name: "Mathias Dyngeland",
-      description: "Fødselsnr. 07101995 XXXXXX"
-    },
-    logoutButton: {
-      label: "Logg ut"
-    },
-    accounts: [
-      {
-        id: "party:mathias",
-        groupId: "primary",
-        type: "person",
-        name: "Mathias Dyngeland"
-      },
-      {
-        id: "party:bergerbar",
-        groupId: "favourites",
-        type: "company",
-        name: "Bergen bar"
-      },
-      {
-        id: "party:keeperhansker",
-        groupId: "secondary",
-        type: "company",
-        name: "Keeperhansker AS"
-      },
-      {
-        id: "party:stadiondrift",
-        groupId: "secondary",
-        type: "company",
-        name: "Stadion drift AS"
-      },
-      {
-        id: "party:brann",
-        groupId: "favourites",
-        type: "company",
-        name: "Sportsklubben Brann"
-      },
-      {
-        id: "party:landslaget",
-        groupId: "secondary",
-        type: "company",
-        name: "Landslaget"
-      }
-    ],
-    groups: {
-      apps: {
-        divider: !0
-      }
-    },
-    items: [
-      {
-        id: "inbox",
-        groupId: "apps",
-        size: "lg",
-        icon: "inbox",
-        title: "Innboks",
-        badge: {
-          color: "alert",
-          label: "4"
-        }
-      },
-      {
-        id: "access",
-        groupId: "apps",
-        size: "lg",
-        icon: "bookmark",
-        title: "Tilganger",
-        badge: {
-          color: "alert",
-          label: "2"
-        }
-      },
-      {
-        id: "access",
-        groupId: "apps",
-        size: "lg",
-        icon: "menu-grid",
-        title: "Alle skjema"
-      },
-      {
-        id: "startup",
-        groupId: "help",
-        color: "neutral",
-        size: "sm",
-        icon: "buildings2",
-        title: "Starte og drive bedrift"
-      },
-      {
-        id: "help",
-        groupId: "help",
-        size: "sm",
-        color: "neutral",
-        icon: "chat-exclamationmark",
-        title: "Trenger du hjelp?"
-      }
-    ]
-  }
-}, o = {}, n = {
-  args: {
-    currentAccount: void 0,
-    items: [
-      {
-        id: "login",
-        groupId: "login",
-        size: "lg",
-        color: "strong",
-        icon: "padlock-locked",
-        title: "Logg inn"
-      },
-      {
-        id: "startup",
-        groupId: "help",
-        color: "neutral",
-        size: "sm",
-        icon: "buildings2",
-        title: "Starte og drive bedrift"
-      },
-      {
-        id: "help",
-        groupId: "help",
-        color: "neutral",
-        size: "sm",
-        icon: "chat-exclamationmark",
-        title: "Trenger du hjelp?"
-      }
-    ]
+    ...i
   }
-}, i = {
-  args: {
-    currentAccount: {
-      type: "company",
-      name: "Sportsklubben Brann",
-      description: "Org. nr. 934908988"
+}, A = (o) => {
+  const t = o.accounts, [n, e] = m(t[0]), c = (s) => {
+    const u = t == null ? void 0 : t.find((a) => a.id === s);
+    e(u);
+  };
+  return /* @__PURE__ */ l(
+    r,
+    {
+      ...o,
+      currentAccount: {
+        ...n,
+        description: n.type === "person" ? "Fødselsnr. XXXXXX YYYYY" : "Org. nr"
+      },
+      onSelectAccount: c
     }
-  }
-}, l = {
+  );
+}, G = {
   args: {
-    logoutLabel: "Logg ut",
-    menuLabel: "Meny",
-    backLabel: "Tilbake",
-    changeLabel: "Endre konto",
-    accountSearch: {
-      placeholder: "Finn konto",
-      name: "search-account",
-      getResultsLabel: (e = 0) => e ? e + " treff" : "Ingen treff",
-      hidden: !1
-    }
+    ...p
   }
 };
 export {
-  l as AccountSearch,
-  i as Company,
-  o as Default,
-  n as Login,
-  t as default
+  A as Default,
+  G as Login,
+  b as default
 };

package/dist/components/Header/Header.js

@@ -1,10 +1,11 @@
 "use client";
-import { jsxs as t, jsx as o } from "react/jsx-runtime";
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import { DropdownBase as g } from "../Dropdown/DropdownBase.js";
 import "../../index-L8X2o7IH.js";
 import { DrawerBase as x } from "../Dropdown/DrawerBase.js";
 import "../Icon/SvgIcon.js";
 import "react";
+import "../Autocomplete/AutocompleteBase.js";
 import { useRootContext as H } from "../RootProvider/RootProvider.js";
 import { GlobalMenu as m } from "../GlobalMenu/GlobalMenu.js";
 import { HeaderBase as _ } from "./HeaderBase.js";
@@ -16,18 +17,18 @@ import { HeaderSearch as S } from "./HeaderSearch.js";
 import '../../assets/Header.css';const v = "_drawer_ft5v3_1", y = "_dropdown_ft5v3_5", s = {
   drawer: v,
   dropdown: y
-}, J = ({ search: d, menu: r, currentAccount: a, logo: p = {}, badge: l }) => {
-  const { currentId: e, toggleId: n, openId: i, closeAll: c } = H(), h = () => {
+}, K = ({ search: d, menu: r, currentAccount: a, logo: p = {}, badge: l }) => {
+  const { currentId: o, toggleId: n, openId: i, closeAll: c } = H(), h = () => {
     i("search");
   }, f = () => {
     n("search");
   }, w = () => {
     n("menu");
   };
-  return /* @__PURE__ */ t(_, { currentId: e, open: e === "search" || e === "menu", onClose: c, children: [
-    /* @__PURE__ */ o(C, { ...p, className: s.logo }),
+  return /* @__PURE__ */ t(_, { currentId: o, open: o === "search" || o === "menu", onClose: c, children: [
+    /* @__PURE__ */ e(C, { ...p, className: s.logo }),
     /* @__PURE__ */ t(N, { className: s.menu, children: [
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ e(
         b,
         {
           badge: l,
@@ -36,16 +37,16 @@ import '../../assets/Header.css';const v = "_drawer_ft5v3_1", y = "_dropdown_ft5
             name: a.name
           },
           onClick: w,
-          expanded: e === "menu",
+          expanded: o === "menu",
           label: r == null ? void 0 : r.menuLabel
         }
       ),
-      r && /* @__PURE__ */ o(g, { padding: !0, placement: "right", open: e === "menu", className: s.dropdown, children: /* @__PURE__ */ o(m, { ...r, currentAccount: a }) })
+      r && /* @__PURE__ */ e(g, { padding: !0, placement: "right", open: o === "menu", className: s.dropdown, children: /* @__PURE__ */ e(m, { ...r, currentAccount: a }) })
     ] }),
-    d && /* @__PURE__ */ o(S, { expanded: e === "search", children: /* @__PURE__ */ o(B, { ...d, expanded: e === "search", onClose: f, onFocus: h }) }),
-    r && /* @__PURE__ */ o(x, { open: e === "menu", className: s.drawer, children: /* @__PURE__ */ o(m, { ...r, currentAccount: a }) })
+    d && /* @__PURE__ */ e(S, { expanded: o === "search", children: /* @__PURE__ */ e(B, { ...d, expanded: o === "search", onClose: f, onFocus: h }) }),
+    r && /* @__PURE__ */ e(x, { open: o === "menu", className: s.drawer, children: /* @__PURE__ */ e(m, { ...r, currentAccount: a }) })
   ] });
 };
 export {
-  J as Header
+  K as Header
 };