@altinn/altinn-components 0.9.0 → 0.10.0

package/dist/components/Dialog/index.js

@@ -1,51 +1,49 @@
-import { Dialog as e } from "./Dialog.js";
-import { DialogList as a } from "./DialogList.js";
-import { DialogMetadata as l } from "./DialogMetadata.js";
-import { DialogListItem as m } from "./DialogListItem.js";
-import { DialogActions as f } from "./DialogActions.js";
-import { DialogActivityLog as x } from "./DialogActivityLog.js";
-import { DialogArticleBase as B } from "./DialogArticleBase.js";
-import { DialogBase as n } from "./DialogBase.js";
-import { DialogBodyBase as y } from "./DialogBodyBase.js";
-import { DialogBorder as u } from "./DialogBorder.js";
-import { DialogContent as L } from "./DialogContent.js";
-import { DialogFooter as v } from "./DialogFooter.js";
-import { DialogHeader as b } from "./DialogHeader.js";
-import { DialogHeaderBase as C } from "./DialogHeaderBase.js";
-import { DialogHeadings as F } from "./DialogHeadings.js";
-import { DialogHistory as M } from "./DialogHistory.js";
-import { DialogNav as j } from "./DialogNav.js";
-import { DialogSectionBase as q } from "./DialogSectionBase.js";
-import { DialogSeenBy as z } from "./DialogSeenBy.js";
-import { DialogSelect as J } from "./DialogSelect.js";
-import { DialogStatus as O, DialogStatusEnum as P } from "./DialogStatus.js";
-import { DialogTitle as R } from "./DialogTitle.js";
-import { DialogTouchedBy as V } from "./DialogTouchedBy.js";
-import { DialogLabel as X } from "./DialogLabel.js";
+import { Dialog as t } from "./Dialog.js";
+import { DialogList as i } from "./DialogList.js";
+import { DialogListGroup as m } from "./DialogListGroup.js";
+import { DialogListItem as g } from "./DialogListItem.js";
+import { DialogMetadata as D } from "./DialogMetadata.js";
+import { DialogByline as x } from "./DialogByline.js";
+import { DialogActions as s } from "./DialogActions.js";
+import { DialogActivityLog as y } from "./DialogActivityLog.js";
+import { DialogBorder as L } from "./DialogBorder.js";
+import { DialogContent as d } from "./DialogContent.js";
+import { DialogSection as T } from "./DialogSection.js";
+import { DialogSeenBy as H } from "./DialogSeenBy.js";
+import { DialogSelect as h } from "./DialogSelect.js";
+import { DialogStatus as v, DialogStatusEnum as C } from "./DialogStatus.js";
+import { DialogHeading as G } from "./DialogHeading.js";
+import { DialogTouchedBy as j } from "./DialogTouchedBy.js";
+import { DialogLabel as q } from "./DialogLabel.js";
+import { DialogAttachments as z } from "./DialogAttachments.js";
+import { DialogTransmissions as J } from "./DialogTransmissions.js";
+import { DialogTimeline as N } from "./DialogTimeline.js";
+import { DialogTimelineItem as P } from "./DialogTimelineItem.js";
+import { DialogHistory as R } from "./DialogHistory.js";
+import { DialogHistoryItem as V } from "./DialogHistoryItem.js";
 export {
-  e as Dialog,
-  f as DialogActions,
-  x as DialogActivityLog,
-  B as DialogArticleBase,
-  n as DialogBase,
-  y as DialogBodyBase,
-  u as DialogBorder,
-  L as DialogContent,
-  v as DialogFooter,
-  b as DialogHeader,
-  C as DialogHeaderBase,
-  F as DialogHeadings,
-  M as DialogHistory,
-  X as DialogLabel,
-  a as DialogList,
-  m as DialogListItem,
-  l as DialogMetadata,
-  j as DialogNav,
-  q as DialogSectionBase,
-  z as DialogSeenBy,
-  J as DialogSelect,
-  O as DialogStatus,
-  P as DialogStatusEnum,
-  R as DialogTitle,
-  V as DialogTouchedBy
+  t as Dialog,
+  s as DialogActions,
+  y as DialogActivityLog,
+  z as DialogAttachments,
+  L as DialogBorder,
+  x as DialogByline,
+  d as DialogContent,
+  G as DialogHeading,
+  R as DialogHistory,
+  V as DialogHistoryItem,
+  q as DialogLabel,
+  i as DialogList,
+  m as DialogListGroup,
+  g as DialogListItem,
+  D as DialogMetadata,
+  T as DialogSection,
+  H as DialogSeenBy,
+  h as DialogSelect,
+  v as DialogStatus,
+  C as DialogStatusEnum,
+  N as DialogTimeline,
+  P as DialogTimelineItem,
+  j as DialogTouchedBy,
+  J as DialogTransmissions
 };

package/dist/components/Dropdown/Backdrop.d.ts

@@ -1,6 +1,8 @@
 import { MouseEventHandler } from 'react';
+export type BackdropColor = 'transparent' | 'theme';
 export interface BackdropProps {
     className?: string;
+    color?: BackdropColor;
     onClick?: MouseEventHandler;
 }
-export declare const Backdrop: ({ className, onClick }: BackdropProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Backdrop: ({ className, color, onClick }: BackdropProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Dropdown/Backdrop.js

@@ -1,8 +1,8 @@
-import { jsx as c } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { c as s } from "../../index-L8X2o7IH.js";
-import '../../assets/Backdrop.css';const a = "_backdrop_zeho3_1", p = {
-  backdrop: a
-}, e = ({ className: o, onClick: r }) => /* @__PURE__ */ c("div", { className: s(p.backdrop, o), onMouseDown: r });
+import '../../assets/Backdrop.css';const t = "_backdrop_1ea7j_1", p = {
+  backdrop: t
+}, n = ({ className: o, color: r, onClick: c }) => /* @__PURE__ */ a("div", { className: s(p.backdrop, o), "data-color": r, onMouseDown: c });
 export {
-  e as Backdrop
+  n as Backdrop
 };

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 { 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/Footer/Footer.stories.js

@@ -1,6 +1,6 @@
 import { Footer as t } from "./Footer.js";
 const o = {
-  title: "Footer/Footer",
+  title: "Layout/Footer",
   component: t,
   tags: ["autodocs"],
   parameters: {
@@ -30,8 +30,8 @@ const o = {
       ]
     }
   }
-}, r = {};
+}, s = {};
 export {
-  r as Default,
+  s as Default,
   o as default
 };

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,27 @@
-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 "../../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 { AccountMenu as o } from "./AccountMenu.js";
+const M = {
   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 = {
+}, g = {
   args: {}
 };
 export {
-  t as Default,
-  r as default
+  g as Default,
+  M as default
 };

package/dist/components/GlobalMenu/BackButton.d.ts

@@ -1,5 +1,7 @@
+import { ElementType } from 'react';
 export interface BackButtonProps {
     label: string;
     onClick?: () => void;
+    as?: ElementType;
 }
-export declare const BackButton: ({ label, onClick }: BackButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BackButton: ({ label, onClick, as }: BackButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/GlobalMenu/BackButton.js

@@ -1,11 +1,11 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
-import { MenuItem as i } from "../Menu/MenuItem.js";
+import { MenuItem as m } 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 x = ({ label: o, onClick: t, as: r }) => /* @__PURE__ */ i(m, { size: "xs", id: "back", icon: "arrow-undo", title: o, onClick: t, as: r });
 export {
-  u as BackButton
+  x 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