@altinn/altinn-components 0.10.1 → 0.10.2

package/dist/components/AccessAreaList/AccessAreaListItem.stories.js

@@ -1,9 +1,13 @@
-import { jsxs as o, Fragment as p, jsx as i } from "react/jsx-runtime";
+import { jsxs as d, Fragment as p, jsx as i } from "react/jsx-runtime";
 import x from "react";
-import { AccessAreaListItem as c } from "./AccessAreaListItem.js";
-import { a } from "../../accesspackages-BI13BnDa.js";
+import { a as c } from "../../accesspackages-BI13BnDa.js";
+import "../../index-L8X2o7IH.js";
+import "../Icon/SvgIcon.js";
+import "../Autocomplete/AutocompleteBase.js";
+import "../RootProvider/RootProvider.js";
+import { AccessAreaListItem as a } from "./AccessAreaListItem.js";
 import { AccessPackageList as m } from "../AccessPackageList/AccessPackageList.js";
-const t = a[1].areas[1], g = /* @__PURE__ */ o(p, { children: [
+const t = c[1].areas[1], g = /* @__PURE__ */ d(p, { children: [
   t.description && /* @__PURE__ */ i("p", { children: t.description }),
   /* @__PURE__ */ i(
     m,
@@ -14,9 +18,9 @@ const t = a[1].areas[1], g = /* @__PURE__ */ o(p, { children: [
       }))
     }
   )
-] }), y = {
+] }), z = {
   title: "List/AccessAreaListItem",
-  component: c,
+  component: a,
   tags: ["autodocs"],
   args: {
     id: t.id,
@@ -43,28 +47,28 @@ const t = a[1].areas[1], g = /* @__PURE__ */ o(p, { children: [
       }
     }
   }
-}, L = {}, k = (s) => {
-  const [l, r] = x.useState(null);
-  return /* @__PURE__ */ i("div", { children: a.map((n) => /* @__PURE__ */ o("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
+}, I = {}, j = (s) => {
+  const [r, l] = x.useState(null);
+  return /* @__PURE__ */ i("div", { children: c.map((n) => /* @__PURE__ */ d("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
     /* @__PURE__ */ i("h2", { children: n.name }),
     /* @__PURE__ */ i("p", { children: n.description }),
-    n.areas.map((e) => /* @__PURE__ */ o(
-      c,
+    n.areas.map((e) => /* @__PURE__ */ d(
+      a,
       {
         id: e.id,
         name: e.name,
         icon: `data:image/svg+xml;base64,${btoa(e.icon)}`,
         size: s.size,
-        expanded: l === e.id,
-        onClick: () => r((d) => d === e.id ? null : e.id),
+        expanded: r === e.id,
+        onClick: () => l((o) => o === e.id ? null : e.id),
         children: [
           e.description && /* @__PURE__ */ i("p", { children: e.description }),
           /* @__PURE__ */ i(
             m,
             {
-              items: e.packages.map((d) => ({
-                id: d.id,
-                title: d.name
+              items: e.packages.map((o) => ({
+                id: o.id,
+                title: o.name
               }))
             }
           )
@@ -75,7 +79,7 @@ const t = a[1].areas[1], g = /* @__PURE__ */ o(p, { children: [
   ] }, n.id)) });
 };
 export {
-  k as AllAreas,
-  L as AreaListItemStory,
-  y as default
+  j as AllAreas,
+  I as AreaListItemStory,
+  z as default
 };

package/dist/components/Autocomplete/Autocomplete.stories.js

@@ -1,8 +1,8 @@
 import { jsxs as e, jsx as t } from "react/jsx-runtime";
-import { Autocomplete as l } from "./Autocomplete.js";
+import { Autocomplete as i } from "./Autocomplete.js";
 const o = {
   title: "Header/Autocomplete",
-  component: l,
+  component: i,
   tags: ["autodocs"],
   parameters: {},
   args: {}
@@ -79,7 +79,6 @@ const o = {
         ] })
       },
       {
-        id: "2a",
         groupId: "3",
         type: "dialog",
         href: "#",
@@ -87,7 +86,6 @@ const o = {
         description: "Skattemeldingen er klar for innsending."
       },
       {
-        id: "2b",
         groupId: "3",
         type: "dialog",
         href: "#",
@@ -95,7 +93,6 @@ const o = {
         description: "Skatteoppgjøret ditt er klart."
       },
       {
-        id: "2c",
         groupId: "3",
         type: "dialog",
         href: "#",
@@ -153,7 +150,6 @@ const o = {
       },
       {
         groupId: "noHits",
-        id: "2a",
         type: "information",
         label: () => /* @__PURE__ */ e("span", { children: [
           "Søk etter ",
@@ -163,7 +159,7 @@ const o = {
       }
     ]
   }
-}, i = {
+}, l = {
   args: {
     ...r.args,
     items: [
@@ -260,7 +256,7 @@ const o = {
   }
 }, f = {
   args: {
-    ...i.args,
+    ...l.args,
     groups: {
       2: {
         title: "Søkeforslag"
@@ -270,7 +266,7 @@ const o = {
       }
     },
     items: [
-      ...i.args.items,
+      ...l.args.items,
       {
         id: "2a",
         groupId: "2",
@@ -317,7 +313,7 @@ export {
   g as LoadingResults,
   k as NoHits,
   p as Scopes,
-  i as ScopesAndMixedResults,
+  l as ScopesAndMixedResults,
   r as ScopesAndResults,
   c as ScopesAndSuggestions,
   f as ScopesResultsAndSuggestions,

package/dist/components/Bookmarks/BookmarksList.js

@@ -3,10 +3,10 @@ import { createElement as t } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "../Autocomplete/AutocompleteBase.js";
-import { BookmarksListItem as p } from "./BookmarksListItem.js";
+import { BookmarksListItem as i } from "./BookmarksListItem.js";
 import "../RootProvider/RootProvider.js";
-import { ListBase as i } from "../List/ListBase.js";
-const B = ({ items: r }) => /* @__PURE__ */ m(i, { spacing: "xs", children: r == null ? void 0 : r.map((o) => /* @__PURE__ */ t(p, { ...o, key: o.id })) });
+import { ListBase as p } from "../List/ListBase.js";
+const B = ({ items: o = [] }) => /* @__PURE__ */ m(p, { spacing: "xs", children: o.map((r) => /* @__PURE__ */ t(i, { ...r, key: r.id })) });
 export {
   B as BookmarksList
 };

package/dist/components/Bookmarks/BookmarksList.stories.js

@@ -30,9 +30,9 @@ const a = {
       }
     ]
   }
-}, s = {
-  args: {}
 }, i = {
+  args: {}
+}, s = {
   args: {
     items: a.args.items.map((e) => ({
       ...e,
@@ -40,10 +40,12 @@ const a = {
         id: [e.id, "menu"].join("-"),
         items: [
           {
+            id: [e.id, "edit"].join("-"),
             icon: "pencil",
             title: "Rediger søk"
           },
           {
+            id: [e.id, "trash"].join("-"),
             icon: "trash",
             title: "Slett søk"
           }
@@ -53,7 +55,7 @@ const a = {
   }
 };
 export {
-  s as Default,
-  i as WithContextMenu,
+  i as Default,
+  s as WithContextMenu,
   a as default
 };

package/dist/components/Bookmarks/BookmarksListItem.stories.js

@@ -1,15 +1,15 @@
-import { jsx as r, jsxs as o } from "react/jsx-runtime";
-import { Fragment as s } from "react";
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { Fragment as o } from "react";
 import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "../Autocomplete/AutocompleteBase.js";
-import { BookmarksListItem as m } from "./BookmarksListItem.js";
+import { BookmarksListItem as a } from "./BookmarksListItem.js";
 import { MetaItem as l } from "../Meta/MetaItem.js";
 import "../RootProvider/RootProvider.js";
 import { ListBase as i } from "../List/ListBase.js";
-const a = ["lg", "md", "sm", "xs"], x = {
+const e = ["lg", "md", "sm", "xs"], h = {
   title: "Bookmarks/BookmarksListItem",
-  component: m,
+  component: a,
   tags: ["autodocs"],
   parameters: {},
   args: {
@@ -26,13 +26,13 @@ const a = ["lg", "md", "sm", "xs"], x = {
     ],
     href: "#"
   }
-}, y = {
+}, x = {
   args: {}
-}, B = {
+}, y = {
   args: {
     title: "Mitt lagrede søk"
   }
-}, L = {
+}, B = {
   args: {
     params: [
       {
@@ -51,14 +51,14 @@ const a = ["lg", "md", "sm", "xs"], x = {
       }
     ]
   }
-}, g = (t) => /* @__PURE__ */ r(i, { children: a == null ? void 0 : a.map((e) => /* @__PURE__ */ o(s, { children: [
-  /* @__PURE__ */ r(m, { ...t, size: e, selected: e === (t == null ? void 0 : t.size) }),
-  /* @__PURE__ */ r(l, { children: e })
-] }, e)) });
+}, L = (s) => /* @__PURE__ */ t(i, { children: e == null ? void 0 : e.map((r) => /* @__PURE__ */ m(o, { children: [
+  /* @__PURE__ */ t(a, { ...s }),
+  /* @__PURE__ */ t(l, { children: r })
+] }, r)) });
 export {
-  B as CustomTitle,
-  y as Default,
-  L as LotsOfParams,
-  g as Sizes,
-  x as default
+  y as CustomTitle,
+  x as Default,
+  B as LotsOfParams,
+  L as Sizes,
+  h as default
 };

package/dist/components/Bookmarks/BookmarksSection.stories.js

@@ -42,10 +42,12 @@ const a = {
         id: [e.id, "menu"].join("-"),
         items: [
           {
+            id: [e.id, "edit"].join("-"),
             icon: "pencil",
             title: "Rediger søk"
           },
           {
+            id: [e.id, "trash"].join("-"),
             icon: "trash",
             title: "Slett søk"
           }

package/dist/components/Button/Buttons.stories.js

@@ -3,10 +3,10 @@ import "../../index-L8X2o7IH.js";
 import "../Icon/SvgIcon.js";
 import "react";
 import "../Autocomplete/AutocompleteBase.js";
-import { Button as l } from "./Button.js";
-import { ComboButton as d } from "./ComboButton.js";
-import { IconButton as p } from "./IconButton.js";
-import { MetaItem as c } from "../Meta/MetaItem.js";
+import { Button as m } from "./Button.js";
+import { ComboButton as c } from "./ComboButton.js";
+import { IconButton as s } from "./IconButton.js";
+import { MetaItem as l } from "../Meta/MetaItem.js";
 import "../RootProvider/RootProvider.js";
 const I = {
   title: "Atoms/Button/Buttons",
@@ -21,7 +21,7 @@ const I = {
       options: ["primary", "secondary"]
     }
   }
-}, n = ["sm", "md", "lg"], m = ["solid", "outline", "dotted", "text"], b = (e) => /* @__PURE__ */ o("div", { style: { display: "flex", flexDirection: "column", rowGap: "1rem" }, children: m == null ? void 0 : m.map((t) => /* @__PURE__ */ i(
+}, d = ["sm", "md", "lg"], n = ["solid", "outline", "dotted", "text"], b = (e) => /* @__PURE__ */ o("div", { style: { display: "flex", flexDirection: "column", rowGap: "1rem" }, children: n == null ? void 0 : n.map((t) => /* @__PURE__ */ i(
   "div",
   {
     style: {
@@ -33,13 +33,13 @@ const I = {
       width: "100%"
     },
     children: [
-      /* @__PURE__ */ o(c, { children: t }),
-      n == null ? void 0 : n.map((r) => /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center", columnGap: "1rem" }, children: [
-        /* @__PURE__ */ o(p, { ...e, icon: "x-mark", variant: t, size: r }),
-        /* @__PURE__ */ o(l, { ...e, variant: t, icon: "arrow-left", size: r, children: "Button" }),
-        /* @__PURE__ */ o(l, { ...e, reverse: !0, variant: t, icon: "arrow-right", size: r, children: "Button" }),
-        /* @__PURE__ */ o(d, { ...e, variant: t, icon: "chevron-down", size: r, children: "ComboButton" }),
-        /* @__PURE__ */ o(c, { children: r })
+      /* @__PURE__ */ o(l, { children: t }),
+      d.map((r) => /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center", columnGap: "1rem" }, children: [
+        /* @__PURE__ */ o(s, { ...e, icon: "x-mark", variant: t, size: r }),
+        /* @__PURE__ */ o(m, { ...e, variant: t, icon: "arrow-left", size: r, children: "Button" }),
+        /* @__PURE__ */ o(m, { ...e, reverse: !0, variant: t, icon: "arrow-right", size: r, children: "Button" }),
+        /* @__PURE__ */ o(c, { ...e, variant: t, icon: "chevron-down", size: r, children: "ComboButton" }),
+        /* @__PURE__ */ o(l, { children: r })
       ] }, r))
     ]
   },

package/dist/components/Button/IconButton.stories.js

@@ -1,27 +1,26 @@
-import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import { MetaItem as c } from "../Meta/MetaItem.js";
+import { MetaItem as r } from "../Meta/MetaItem.js";
 import "../Icon/SvgIcon.js";
-import { IconButton as l } from "./IconButton.js";
+import { IconButton as s } from "./IconButton.js";
 const f = {
   title: "Atoms/Button/IconButton",
-  component: l,
+  component: s,
   tags: ["autodocs"],
   parameters: {},
   args: {
-    children: "IconButton",
     icon: "x-mark",
     size: "sm"
   }
 }, x = {
   args: {}
-}, n = ["sm", "md", "lg"], r = ["outline", "solid", "dotted", "text"], h = (s) => /* @__PURE__ */ t("div", { style: { display: "flex", columnGap: "1rem", justifyContent: "space-between", width: "100%" }, children: r == null ? void 0 : r.map((o) => /* @__PURE__ */ m("div", { style: { display: "flex", flexDirection: "column", columnGap: "1rem" }, children: [
-  /* @__PURE__ */ t(c, { children: o }),
-  n == null ? void 0 : n.map((e) => /* @__PURE__ */ m("div", { children: [
-    /* @__PURE__ */ t(l, { ...s, variant: o, size: e }),
-    /* @__PURE__ */ t(c, { children: e })
-  ] }, e))
-] }, o)) });
+}, i = ["sm", "md", "lg"], l = ["outline", "solid", "dotted", "text"], h = (m) => /* @__PURE__ */ t("div", { style: { display: "flex", columnGap: "1rem", justifyContent: "space-between", width: "100%" }, children: l.map((e) => /* @__PURE__ */ n("div", { style: { display: "flex", flexDirection: "column", columnGap: "1rem" }, children: [
+  /* @__PURE__ */ t(r, { children: e }),
+  i.map((o) => /* @__PURE__ */ n("div", { children: [
+    /* @__PURE__ */ t(s, { ...m, variant: e, size: o }),
+    /* @__PURE__ */ t(r, { children: o })
+  ] }, o))
+] }, e)) });
 export {
   x as Default,
   h as Sizes,

package/dist/components/ContextMenu/ContextMenu.js

@@ -1,46 +1,52 @@
 "use client";
-import { jsxs as g, jsx as o } from "react/jsx-runtime";
-import { c as _ } from "../../index-L8X2o7IH.js";
-import { useRef as f } from "react";
+import { jsxs as y, jsx as n } from "react/jsx-runtime";
+import { c as x } from "../../index-L8X2o7IH.js";
+import { useRef as h, useMemo as j } from "react";
 import "../Icon/SvgIcon.js";
-import { useClickOutside as y } from "../../hooks/useClickOutside.js";
+import { useClickOutside as C } from "../../hooks/useClickOutside.js";
 import "../Autocomplete/AutocompleteBase.js";
-import { IconButton as x } from "../Button/IconButton.js";
-import { MenuItems as j } from "../Menu/MenuItems.js";
-import { useRootContext as h } from "../RootProvider/RootProvider.js";
-import { DropdownBase as w } from "../Dropdown/DropdownBase.js";
-import '../../assets/ContextMenu.css';const b = "_toggle_ya7jy_1", C = "_button_ya7jy_5", I = "_icon_ya7jy_14", N = "_dropdown_ya7jy_18", t = {
-  toggle: b,
-  button: C,
-  icon: I,
-  dropdown: N
-}, T = ({
-  id: n = "context-menu",
-  placement: r = "right",
-  size: s,
-  groups: c = {},
-  className: i,
-  items: m
+import { IconButton as w } from "../Button/IconButton.js";
+import { MenuItems as b } from "../Menu/MenuItems.js";
+import { useRootContext as k } from "../RootProvider/RootProvider.js";
+import { DropdownBase as I } from "../Dropdown/DropdownBase.js";
+import '../../assets/ContextMenu.css';const M = "_toggle_ya7jy_1", N = "_button_ya7jy_5", v = "_icon_ya7jy_14", z = "_dropdown_ya7jy_18", e = {
+  toggle: M,
+  button: N,
+  icon: v,
+  dropdown: z
+}, F = ({
+  id: r = "context-menu",
+  placement: i = "right",
+  size: m,
+  groups: a = {},
+  className: u,
+  items: s
 }) => {
-  const { currentId: l, toggleId: a, closeAll: d } = h(), e = f(null);
-  y(e, () => d());
-  const p = () => a(n), u = l === n;
-  return /* @__PURE__ */ g("div", { className: _(t.toggle, i), "data-theme": "neutral", ref: e, children: [
-    /* @__PURE__ */ o(
-      x,
+  const { currentId: p, toggleId: d, closeAll: t } = k(), c = h(null);
+  C(c, () => t());
+  const g = () => d(r), _ = p === r, f = j(() => s.map((o) => ({
+    ...o,
+    onClick: () => {
+      var l;
+      (l = o.onClick) == null || l.call(o), t();
+    }
+  })), [s, t]);
+  return /* @__PURE__ */ y("div", { className: x(e.toggle, u), "data-theme": "neutral", ref: c, children: [
+    /* @__PURE__ */ n(
+      w,
       {
-        className: t.button,
-        size: s,
+        className: e.button,
+        size: m,
         icon: "menu-elipsis-horizontal",
         iconSize: "md",
         variant: "text",
         color: "secondary",
-        onClick: p
+        onClick: g
       }
     ),
-    /* @__PURE__ */ o(w, { className: t.dropdown, placement: r, open: u, children: /* @__PURE__ */ o(j, { groups: c, items: m }) })
+    /* @__PURE__ */ n(I, { className: e.dropdown, placement: i, open: _, children: /* @__PURE__ */ n(b, { groups: a, items: f }) })
   ] });
 };
 export {
-  T as ContextMenu
+  F as ContextMenu
 };