@altinn/altinn-components 0.9.1 → 0.10.1

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

@@ -1,40 +1,46 @@
-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 { jsx as p } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { globalMenu as a } from "../../examples/globalMenu.js";
+import { loginMenu as l } from "../../examples/loginMenu.js";
 import "../../examples/inboxFilters.js";
-import { GlobalMenu as r } from "./GlobalMenu.js";
-const b = {
+import "../../examples/dialog/reportingDraftDialog.js";
+import "../../examples/dialog/reportingInProgressDialog.js";
+import "../../examples/dialog/reportingCompletedDialog.js";
+import "../../examples/dialog/transmissionsTimeline.js";
+import "../../examples/dialog/transmissionsInProgressDialog.js";
+import "../../examples/dialog/transmissionsCompletedDialog.js";
+import { GlobalMenu as n } from "./GlobalMenu.js";
+const y = {
   title: "GlobalMenu/GlobalMenu",
-  component: r,
+  component: n,
   tags: ["autodocs"],
   parameters: {},
   args: {
-    ...i
+    ...a
   }
-}, 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);
+}, C = (o) => {
+  const t = o.accounts, [r, e] = u(t[0]), c = (m) => {
+    const i = t == null ? void 0 : t.find((s) => s.id === m);
+    e(i);
   };
-  return /* @__PURE__ */ l(
-    r,
+  return /* @__PURE__ */ p(
+    n,
     {
       ...o,
       currentAccount: {
-        ...n,
-        description: n.type === "person" ? "Fødselsnr. XXXXXX YYYYY" : "Org. nr"
+        ...r,
+        description: r.type === "person" ? "Fødselsnr. XXXXXX YYYYY" : "Org. nr"
       },
       onSelectAccount: c
     }
   );
-}, G = {
+}, D = {
   args: {
-    ...p
+    ...l
   }
 };
 export {
-  A as Default,
-  G as Login,
-  b as default
+  C as Default,
+  D as Login,
+  y as default
 };

package/dist/components/Header/Header.stories.js

@@ -1,29 +1,35 @@
-import { jsx as c } from "react/jsx-runtime";
+import { jsx as m } from "react/jsx-runtime";
 import "../../examples/globalMenu.js";
 import "../../examples/inboxFilters.js";
-import { header as n } from "../../examples/header.js";
-import { useInboxSearch as a } from "../../examples/useInboxSearch.js";
-import { useAccountMenu as m } from "../../examples/useAccountMenu.js";
-import { Header as t } from "./Header.js";
-const h = {
-  title: "Header/Header",
-  component: t,
+import { header as c } from "../../examples/header.js";
+import { useInboxSearch as n } from "../../examples/useInboxSearch.js";
+import { useAccountMenu as a } from "../../examples/useAccountMenu.js";
+import "../../examples/dialog/reportingDraftDialog.js";
+import "../../examples/dialog/reportingInProgressDialog.js";
+import "../../examples/dialog/reportingCompletedDialog.js";
+import "../../examples/dialog/transmissionsTimeline.js";
+import "../../examples/dialog/transmissionsInProgressDialog.js";
+import "../../examples/dialog/transmissionsCompletedDialog.js";
+import { Header as o } from "./Header.js";
+const S = {
+  title: "Layout/Header",
+  component: o,
   tags: ["autodocs"],
   parameters: {
     layout: "fullscreen"
   },
   args: {
-    ...n,
+    ...c,
     search: {
       name: "inbox-search",
       placeholder: "Søk i Altinn"
     }
   }
-}, x = (e) => {
-  const o = a(e.search), r = m(e.menu);
-  return /* @__PURE__ */ c(t, { ...e, currentAccount: r.currentAccount, menu: r, search: o });
+}, j = (r) => {
+  const e = n(r.search), t = a(r.menu);
+  return /* @__PURE__ */ m(o, { ...r, currentAccount: t.currentAccount, menu: t, search: e });
 };
 export {
-  x as Default,
-  h as default
+  j as Default,
+  S as default
 };

package/dist/components/Header/HeaderButton.stories.js

@@ -1,6 +1,6 @@
 import { HeaderButton as a } from "./HeaderButton.js";
-const r = {
-  title: "Header/HeaderButton",
+const t = {
+  title: "Layout/HeaderButton",
   component: a,
   tags: ["autodocs"],
   parameters: {
@@ -9,7 +9,7 @@ const r = {
   args: {}
 }, n = {
   args: {}
-}, t = {
+}, r = {
   args: {
     icon: "inbox"
   }
@@ -59,7 +59,7 @@ export {
   p as CompanyGroup,
   n as Default,
   c as Expanded,
-  t as Icon,
+  r as Icon,
   o as Person,
-  r as default
+  t as default
 };

package/dist/components/Header/HeaderLogo.stories.js

@@ -1,14 +1,14 @@
-import { HeaderLogo as e } from "./HeaderLogo.js";
-const o = {
-  title: "Header/HeaderLogo",
-  component: e,
+import { HeaderLogo as o } from "./HeaderLogo.js";
+const a = {
+  title: "Layout/HeaderLogo",
+  component: o,
   tags: ["autodocs"],
   parameters: {},
   args: {}
-}, t = {
+}, e = {
   args: {}
 };
 export {
-  t as Default,
-  o as default
+  e as Default,
+  a as default
 };

package/dist/components/Layout/Layout.js

@@ -10,15 +10,15 @@ import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
 import "../Autocomplete/AutocompleteBase.js";
-import { useRootContext as B } from "../RootProvider/RootProvider.js";
-import { Menu as C } from "../Menu/Menu.js";
+import { Menu as B } from "../Menu/Menu.js";
+import { useRootContext as C } from "../RootProvider/RootProvider.js";
 const A = ({ theme: e = "global", header: p, footer: u, sidebar: o = {}, content: t = {}, children: f }) => {
-  const { currentId: h } = B(), { menu: n, ...l } = o;
+  const { currentId: h } = C(), { menu: n, ...l } = o;
   return /* @__PURE__ */ r(i, { theme: e, currentId: h, children: [
     p && /* @__PURE__ */ m(j, { ...p }),
     /* @__PURE__ */ r(y, { currentId: h, children: [
       o && /* @__PURE__ */ r(L, { hidden: o == null ? void 0 : o.hidden, theme: o == null ? void 0 : o.theme, ...l, children: [
-        n && /* @__PURE__ */ m(C, { ...n }),
+        n && /* @__PURE__ */ m(B, { ...n }),
         o == null ? void 0 : o.children
       ] }),
       /* @__PURE__ */ m(c, { theme: t == null ? void 0 : t.theme, children: f })

package/dist/components/Layout/Layout.stories.js

@@ -1,11 +1,11 @@
-import { jsx as n, jsxs as m, Fragment as v } from "react/jsx-runtime";
+import { jsx as n, jsxs as u, Fragment as v } from "react/jsx-runtime";
 import { useState as h, createElement as x } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "../Autocomplete/AutocompleteBase.js";
+import { DialogListItem as L } from "../Dialog/DialogListItem.js";
 import "../RootProvider/RootProvider.js";
-import { ListBase as L } from "../List/ListBase.js";
-import { DialogListItem as B } from "../Dialog/DialogListItem.js";
+import { ListBase as B } from "../List/ListBase.js";
 import { Layout as d } from "./Layout.js";
 import { ActionHeader as C } from "../LayoutAction/ActionHeader.js";
 import { ActionFooter as F } from "../LayoutAction/ActionFooter.js";
@@ -18,7 +18,13 @@ import { header as f } from "../../examples/header.js";
 import { footer as w } from "../../examples/footer.js";
 import { useInboxSearch as b } from "../../examples/useInboxSearch.js";
 import { useAccountMenu as k } from "../../examples/useAccountMenu.js";
-const _ = {
+import "../../examples/dialog/reportingDraftDialog.js";
+import "../../examples/dialog/reportingInProgressDialog.js";
+import "../../examples/dialog/reportingCompletedDialog.js";
+import "../../examples/dialog/transmissionsTimeline.js";
+import "../../examples/dialog/transmissionsInProgressDialog.js";
+import "../../examples/dialog/transmissionsCompletedDialog.js";
+const ne = {
   title: "Layout/Layout",
   component: d,
   tags: ["autodocs"],
@@ -34,22 +40,22 @@ const _ = {
     },
     children: /* @__PURE__ */ n("p", { children: "Content (should be hidden on mobile when menu is open)." })
   }
-}, $ = (o) => {
-  const s = b(o.header.search), a = k(o.header.menu);
+}, ce = (o) => {
+  const s = b(o.header.search), i = k(o.header.menu);
   return /* @__PURE__ */ n(
     d,
     {
       ...o,
       header: {
         ...o.header,
-        currentAccount: a.currentAccount,
-        menu: a,
+        currentAccount: i.currentAccount,
+        menu: i,
         search: s
       }
     }
   );
-}, ee = (o) => {
-  const s = b(o.header.search), a = k(o.header.menu), [i, g] = h([]), [y, I] = h({
+}, le = (o) => {
+  const s = b(o.header.search), i = k(o.header.menu), [a, g] = h([]), [y, I] = h({
     1: {
       id: "1",
       title: "Item 1",
@@ -95,7 +101,7 @@ const _ = {
         message: "Snack me"
       }
     ])
-  })), u = ({ id: e }) => {
+  })), m = ({ id: e }) => {
     I((r) => ({
       ...r,
       [e]: {
@@ -104,36 +110,36 @@ const _ = {
       }
     }));
   }, t = Object.values(y), c = t == null ? void 0 : t.filter((e) => e.selected), l = (c == null ? void 0 : c.length) > 0, M = (c == null ? void 0 : c.length) + " av " + (t == null ? void 0 : t.length) + " valgt";
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     d,
     {
       theme: l ? "neutral" : "company",
-      header: { ...f, menu: a, currentAccount: a.currentAccount, search: l ? void 0 : s },
+      header: { ...f, menu: i, currentAccount: i.currentAccount, search: l ? void 0 : s },
       sidebar: { hidden: l, menu: p },
       content: { theme: "neutral" },
       children: [
         /* @__PURE__ */ n(C, { title: M, hidden: !l }),
-        /* @__PURE__ */ n(L, { children: t == null ? void 0 : t.map((e) => /* @__PURE__ */ x(
-          B,
+        /* @__PURE__ */ n(B, { children: t == null ? void 0 : t.map((e) => /* @__PURE__ */ x(
+          L,
           {
             ...e,
             key: e == null ? void 0 : e.id,
             title: e.title,
-            onClick: l ? () => u(e) : void 0,
+            onClick: l ? () => m(e) : void 0,
             selected: e.selected,
-            select: { checked: e == null ? void 0 : e.selected, onChange: () => u(e) }
+            select: { checked: e == null ? void 0 : e.selected, onChange: () => m(e) }
           }
         )) }),
-        /* @__PURE__ */ n(F, { hidden: !1, children: /* @__PURE__ */ m(v, { children: [
+        /* @__PURE__ */ n(F, { hidden: !1, children: /* @__PURE__ */ u(v, { children: [
           l && /* @__PURE__ */ n(j, { items: A, theme: "global-dark" }),
-          i.length > 0 && (i == null ? void 0 : i.map((e, r) => /* @__PURE__ */ n(D, { ...e }, r)))
+          a.length > 0 && (a == null ? void 0 : a.map((e, r) => /* @__PURE__ */ n(D, { ...e }, r)))
         ] }) })
       ]
     }
   );
 };
 export {
-  $ as Default,
-  ee as InboxBulkMode,
-  _ as default
+  ce as Default,
+  le as InboxBulkMode,
+  ne as default
 };

package/dist/components/List/List.d.ts

@@ -1,10 +1,11 @@
 import { ListSpacing, ListTheme } from '../List';
 import { ListItemProps } from './ListItem';
-import { ListItemSize } from './ListItemBase';
+import { ListItemColor, ListItemSize } from './ListItemBase';
 export interface ListProps {
-    size?: ListItemSize;
     spacing?: ListSpacing;
     theme?: ListTheme;
     items?: ListItemProps[];
+    defaultItemColor?: ListItemColor;
+    defaultItemSize?: ListItemSize;
 }
-export declare const List: ({ theme, size, spacing, items }: ListProps) => import("react/jsx-runtime").JSX.Element;
+export declare const List: ({ theme, defaultItemSize, defaultItemColor, spacing, items }: ListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/List/List.js

@@ -1,12 +1,20 @@
-import { jsx as p } from "react/jsx-runtime";
-import { createElement as s } from "react";
+import { jsx as i } from "react/jsx-runtime";
+import { createElement as n } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
-import { ListItem as n } from "./ListItem.js";
+import { ListItem as e } from "./ListItem.js";
 import { ListBase as f } from "./ListBase.js";
-const j = ({ theme: r, size: t = "md", spacing: m = "md", items: o = [] }) => /* @__PURE__ */ p(f, { theme: r, spacing: m, children: o.map((i, e) => /* @__PURE__ */ s(n, { ...i, size: t, key: "item" + e })) });
+const j = ({ theme: o, defaultItemSize: p, defaultItemColor: t, spacing: s = "md", items: m = [] }) => /* @__PURE__ */ i(f, { theme: o, spacing: s, children: m.map((r, c) => /* @__PURE__ */ n(
+  e,
+  {
+    ...r,
+    size: (r == null ? void 0 : r.size) || p,
+    color: (r == null ? void 0 : r.color) || t,
+    key: "item" + c
+  }
+)) });
 export {
   j as List
 };

package/dist/components/List/List.stories.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import "react";
+import "../Icon/SvgIcon.js";
 import "../Autocomplete/AutocompleteBase.js";
 import "../RootProvider/RootProvider.js";
 import { List as t } from "./List.js";

package/dist/components/List/ListItem.d.ts

@@ -3,8 +3,11 @@ import { AvatarGroupProps, AvatarProps } from '../Avatar';
 import { BadgeProps } from '../Badge';
 import { ContextMenuProps } from '../ContextMenu';
 import { IconName } from '../Icon';
+import { ListItemBaseProps } from './ListItemBase';
 import { ListItemHeaderProps } from './ListItemHeader';
-export interface ListItemProps extends ListItemHeaderProps {
+export interface ListItemProps extends ListItemBaseProps, ListItemHeaderProps {
+    /** List item id */
+    id?: string;
     /** Custom className */
     className?: string;
     /** Element is loading, display a placeholder */