@altinn/altinn-components 0.41.4 → 0.41.6

package/dist/components/Menu/MenuItemLabel.js

@@ -1,81 +1,75 @@
-import { jsx as t, jsxs as p, Fragment as h } from "react/jsx-runtime";
-import { c as b } from "../../index-L8X2o7IH.js";
+import { jsx as s, jsxs as g, Fragment as b } from "react/jsx-runtime";
+import { c as d } from "../../index-L8X2o7IH.js";
 import { isValidElement as x } from "react";
-import { Heading as u } from "../Typography/Heading.js";
-import { Badge as _ } from "../Badge/Badge.js";
+import { Heading as c } from "../Typography/Heading.js";
 import "../RootProvider/RootProvider.js";
-import { isHeadingProps as s } from "../List/ListItemLabel.js";
+import { isHeadingProps as o } from "../List/ListItemLabel.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/MenuItemLabel.css';const y = "_label_1gf5h_1", P = "_title_1gf5h_22", g = {
-  label: y,
-  title: P
+import '../../assets/MenuItemLabel.css';const h = "_label_1gf5h_1", _ = "_title_1gf5h_22", p = {
+  label: h,
+  title: _
 };
-function d(r) {
+function u(r) {
   return typeof r == "string" || typeof r == "number" || typeof r == "boolean" || r === null || x(r);
 }
-const w = (r) => {
+const y = (r) => {
   const n = {
     as: "span"
   };
-  return s(r) ? { ...n, ...r } : d(r) ? {
+  return o(r) ? { ...n, ...r } : u(r) ? {
     ...n,
     children: r
   } : null;
-}, N = (r) => {
+}, P = (r) => {
   const n = {
     as: "span",
     weight: "normal",
     variant: "subtle"
   };
-  return s(r) ? { ...n, ...r } : d(r) ? {
+  return o(r) ? { ...n, ...r } : u(r) ? {
     ...n,
     children: r
   } : null;
 };
-function D(r) {
+function z(r) {
   if (typeof r == "string")
     return r;
-  if (s(r))
+  if (o(r))
     return r.children;
 }
-const E = ({
+const A = ({
   className: r,
   size: n = "sm",
-  title: i,
-  badge: l,
-  description: a,
-  highlightWords: m,
-  loading: c,
+  title: a,
+  description: i,
+  highlightWords: l,
+  loading: m,
   children: f
 }) => {
-  const e = i && w(i), o = a && N(a);
-  return /* @__PURE__ */ t("span", { className: b(g.label, r), "data-size": n, children: f || /* @__PURE__ */ p(h, { children: [
-    e && /* @__PURE__ */ p(
-      u,
+  const t = a && y(a), e = i && P(i);
+  return /* @__PURE__ */ s("span", { className: d(p.label, r), "data-size": n, children: f || /* @__PURE__ */ g(b, { children: [
+    t && /* @__PURE__ */ s(
+      c,
       {
-        ...e,
-        loading: c,
-        highlightWords: m,
-        className: g.title,
-        weight: e != null && e.weight || n === "lg" ? "medium" : "normal",
-        children: [
-          /* @__PURE__ */ t("span", { children: e.children }),
-          l && /* @__PURE__ */ t(_, { ...l })
-        ]
+        ...t,
+        loading: m,
+        highlightWords: l,
+        className: p.title,
+        weight: t != null && t.weight || n === "lg" ? "medium" : "normal"
       }
     ),
-    o && /* @__PURE__ */ t(
-      u,
+    e && /* @__PURE__ */ s(
+      c,
       {
-        ...o,
-        loading: c,
-        highlightWords: m,
-        size: o.size || n === "lg" ? "xs" : "xxs"
+        ...e,
+        loading: m,
+        highlightWords: l,
+        size: e.size || n === "lg" ? "xs" : "xxs"
       }
     )
   ] }) });
 };
 export {
-  E as MenuItemLabel,
-  D as getAriaLabelFromTitle
+  A as MenuItemLabel,
+  z as getAriaLabelFromTitle
 };

package/dist/components/Menu/MenuOption.js

@@ -1,83 +1,83 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
+import { jsx as s, jsxs as d } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
-import { Badge as p } from "../Badge/Badge.js";
 import "../RootProvider/RootProvider.js";
-import { MenuItem as u } from "./MenuItem.js";
+import { MenuItem as _ } from "./MenuItem.js";
 import "../Snackbar/useSnackbar.js";
-import { S as x } from "../../Checkmark-Byz_C9x4.js";
-import '../../assets/MenuOption.css';const y = "_label_16xuy_1", k = "_title_16xuy_13", v = "_radio_16xuy_19", I = "_checkbox_16xuy_20", M = "_icon_16xuy_53", a = {
-  label: y,
-  title: k,
+import { S as p } from "../../Checkmark-Byz_C9x4.js";
+import '../../assets/MenuOption.css';const N = "_label_sfsij_1", j = "_title_sfsij_13", k = "_count_sfsij_20", v = "_radio_sfsij_25", I = "_checkbox_sfsij_26", M = "_icon_sfsij_59", a = {
+  label: N,
+  title: j,
+  count: k,
   radio: v,
   checkbox: I,
   icon: M
-}, F = ({
-  size: o = "md",
-  type: _,
-  name: j,
-  active: n,
-  value: S,
-  label: c,
-  title: h,
+}, C = ({
+  size: t = "md",
+  type: h,
+  name: S,
+  active: i,
+  value: g,
+  label: n,
+  title: u,
   description: b,
-  icon: N,
-  badge: s,
-  checked: t = !1,
-  disabled: r,
+  icon: f,
+  count: e = 0,
+  checked: c = !1,
+  disabled: o,
   onMouseEnter: w,
-  onClick: i,
+  onClick: r,
   role: l,
   ...m
 }) => {
-  const f = () => {
-    switch (_) {
+  const x = () => {
+    switch (h) {
       case "checkbox":
         return /* @__PURE__ */ d("span", { className: a.label, children: [
-          /* @__PURE__ */ e("span", { className: a.checkbox, "data-checked": t, children: /* @__PURE__ */ e(x, { className: a.icon, "aria-hidden": !0 }) }),
-          /* @__PURE__ */ e("span", { className: a.title, children: c })
+          /* @__PURE__ */ s("span", { className: a.checkbox, "data-checked": c, children: /* @__PURE__ */ s(p, { className: a.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ s("span", { className: a.title, children: n }),
+          e > 0 && /* @__PURE__ */ s("span", { className: a.count, children: e })
         ] });
       case "radio":
         return /* @__PURE__ */ d("span", { className: a.label, children: [
-          /* @__PURE__ */ e("span", { className: a.radio, "data-checked": t, children: /* @__PURE__ */ e(x, { className: a.icon, "aria-hidden": !0 }) }),
-          /* @__PURE__ */ e("span", { className: a.title, children: c })
+          /* @__PURE__ */ s("span", { className: a.radio, "data-checked": c, children: /* @__PURE__ */ s(p, { className: a.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ s("span", { className: a.title, children: n }),
+          e > 0 && /* @__PURE__ */ s("span", { className: a.count, children: e })
         ] });
     }
   };
-  return c ? /* @__PURE__ */ e(
-    u,
+  return n ? /* @__PURE__ */ s(
+    _,
     {
-      disabled: r,
-      selected: t,
-      size: o,
+      disabled: o,
+      selected: c,
+      size: t,
       as: "div",
-      active: n,
+      active: i,
       tabIndex: -1,
-      onClick: i,
+      onClick: r,
       role: l,
-      label: /* @__PURE__ */ e(f, {}),
-      controls: s && /* @__PURE__ */ e(p, { ...s }),
+      label: /* @__PURE__ */ s(x, {}),
       ...m
     }
-  ) : /* @__PURE__ */ e(
-    u,
+  ) : /* @__PURE__ */ s(
+    _,
     {
-      disabled: r,
-      selected: t,
-      size: o,
+      disabled: o,
+      selected: c,
+      size: t,
       as: "div",
-      active: n,
+      active: i,
       tabIndex: -1,
-      onClick: i,
+      onClick: r,
       role: l,
-      icon: N,
-      title: h,
+      icon: f,
+      title: u,
       description: b,
-      controls: s && /* @__PURE__ */ e(p, { ...s }),
       ...m
     }
   );
 };
 export {
-  F as MenuOption
+  C as MenuOption
 };

package/dist/components/Settings/SettingsItem.js

@@ -1,54 +1,69 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import { useState as h } from "react";
+import { useState as b } from "react";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { Input as v } from "../Forms/Input.js";
-import { SettingsItemBase as i } from "./SettingsItemBase.js";
-import { SettingsModal as b } from "./SettingsModal.js";
-const B = ({
+import { Input as x } from "../Forms/Input.js";
+import { SettingsItemBase as n } from "./SettingsItemBase.js";
+import { SettingsModal as I } from "./SettingsModal.js";
+const O = ({
   loading: a,
-  variant: c = "default",
-  id: m = "settings",
-  name: u,
-  checked: f,
-  onChange: d,
-  children: g,
+  variant: f = "default",
+  id: c = "settings",
+  name: m,
+  checked: g,
+  onChange: h,
+  modalProps: e,
+  children: v,
   ...t
 }) => {
-  const [n, l] = h(!1);
+  const [l, u] = b(!1);
   if (a)
-    return /* @__PURE__ */ e(i, { icon: t == null ? void 0 : t.icon, title: t == null ? void 0 : t.title, loading: !0 });
-  switch (c) {
+    return /* @__PURE__ */ i(n, { icon: t == null ? void 0 : t.icon, title: t == null ? void 0 : t.title, loading: !0 });
+  switch (f) {
     case "switch":
-      return /* @__PURE__ */ e(
-        i,
+      return /* @__PURE__ */ i(
+        n,
         {
           ...t,
-          title: [t == null ? void 0 : t.title, t == null ? void 0 : t.value].join(": "),
+          title: {
+            id: c,
+            as: "label",
+            children: [t == null ? void 0 : t.title, t == null ? void 0 : t.value].join(": ")
+          },
           value: void 0,
           interactive: !1,
-          controls: /* @__PURE__ */ e(
-            v,
+          controls: /* @__PURE__ */ i(
+            x,
             {
               type: "checkbox",
               role: "switch",
-              "aria-labelledby": m,
-              name: u,
+              "aria-labelledby": c,
+              name: m,
               value: t == null ? void 0 : t.value,
-              checked: f,
-              onChange: d,
+              checked: g,
+              onChange: h,
               style: { marginRight: "0.5em" }
             }
           )
         }
       );
     case "modal":
-      return /* @__PURE__ */ e(i, { ...t, as: "button", linkIcon: !0, onClick: () => l(!0), expanded: n, children: n && /* @__PURE__ */ e(b, { icon: t == null ? void 0 : t.icon, title: t == null ? void 0 : t.title, open: n, onClose: () => l(!1), children: g }) });
+      return /* @__PURE__ */ i(n, { ...t, as: "button", linkIcon: !0, onClick: () => u(!0), expanded: l, children: l && /* @__PURE__ */ i(
+        I,
+        {
+          ...e,
+          icon: (e == null ? void 0 : e.icon) || (t == null ? void 0 : t.icon),
+          title: (e == null ? void 0 : e.title) || (t == null ? void 0 : t.title),
+          open: l,
+          onClose: () => u(!1),
+          children: v
+        }
+      ) });
     default:
-      return /* @__PURE__ */ e(i, { ...t });
+      return /* @__PURE__ */ i(n, { ...t });
   }
 };
 export {
-  B as SettingsItem
+  O as SettingsItem
 };

package/dist/components/Settings/SettingsItemBase.js

@@ -1,47 +1,48 @@
-import { jsxs as L, jsx as i } from "react/jsx-runtime";
+import { jsxs as d, jsx as i } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
-import { getAriaLabelFromTitle as d } from "../Menu/MenuItemLabel.js";
-import { ListItemBase as f } from "../List/ListItemBase.js";
-import { ListItemHeader as g } from "../List/ListItemHeader.js";
-import { ListItemLabel as I } from "../List/ListItemLabel.js";
+import { getAriaLabelFromTitle as f } from "../Menu/MenuItemLabel.js";
+import { ListItemBase as g } from "../List/ListItemBase.js";
+import { ListItemHeader as I } from "../List/ListItemHeader.js";
+import { ListItemLabel as k } from "../List/ListItemLabel.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/SettingsItemBase.css';const k = "_item_lk1g7_1", N = "_label_lk1g7_20", j = "_header_lk1g7_24", e = {
-  item: k,
-  label: N,
-  header: j
-}, q = ({
+import '../../assets/SettingsItemBase.css';const N = "_item_lk1g7_1", j = "_label_lk1g7_20", x = "_header_lk1g7_24", e = {
+  item: N,
+  label: j,
+  header: x
+}, v = ({
+  ref: s,
   loading: t,
-  color: s,
-  size: l,
+  color: l,
+  size: o,
   expanded: r,
-  icon: o,
-  label: c,
+  icon: c,
+  label: n,
   title: m,
-  value: n,
-  description: _,
-  children: b,
-  highlightWords: h,
+  value: _,
+  description: b,
+  children: h,
+  highlightWords: p,
   ...a
 }) => {
-  const p = a.ariaLabel || d(m);
-  return /* @__PURE__ */ L(f, { className: e.item, color: s, size: l, expanded: r, children: [
-    /* @__PURE__ */ i(g, { ...a, loading: t, ariaLabel: p, className: e.header, icon: o, children: /* @__PURE__ */ i(
-      I,
+  const L = a.ariaLabel || f(m);
+  return /* @__PURE__ */ d(g, { ref: s, className: e.item, color: l, size: o, expanded: r, children: [
+    /* @__PURE__ */ i(I, { ...a, loading: t, ariaLabel: L, className: e.header, icon: c, children: /* @__PURE__ */ i(
+      k,
       {
         loading: t,
-        highlightWords: h,
+        highlightWords: p,
         className: e.label,
         title: m,
-        value: n,
-        description: _,
-        children: c
+        value: _,
+        description: b,
+        children: n
       }
     ) }),
-    r && b
+    r && h
   ] });
 };
 export {
-  q as SettingsItemBase
+  v as SettingsItemBase
 };

package/dist/components/Settings/SettingsModal.js

@@ -1,15 +1,39 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import { jsxs as e, jsx as d } from "react/jsx-runtime";
+import { createElement as x } from "react";
 import "../../index-L8X2o7IH.js";
-import "react";
+import { Button as g } from "../Button/Button.js";
+import { ButtonGroup as j } from "../Button/ButtonGroup.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { ModalBase as s } from "../Modal/ModalBase.js";
-import { ModalHeader as f } from "../Modal/ModalHeader.js";
-import { ModalBody as l } from "../Modal/ModalBody.js";
-const u = ({ icon: t, title: m, description: i, open: p, onClose: o, children: d, ...a }) => /* @__PURE__ */ e(s, { ...a, open: p, onClose: o, children: [
-  /* @__PURE__ */ r(f, { icon: t, title: m, description: i, onClose: o }),
-  /* @__PURE__ */ r(l, { children: d })
+import { ModalBase as y } from "../Modal/ModalBase.js";
+import { ModalHeader as E } from "../Modal/ModalHeader.js";
+import { ModalBody as G } from "../Modal/ModalBody.js";
+const J = ({
+  icon: a,
+  title: c,
+  description: f,
+  open: l,
+  onClose: i,
+  buttons: m,
+  children: h,
+  ...B
+}) => /* @__PURE__ */ e(y, { ...B, open: l, onClose: i, children: [
+  /* @__PURE__ */ d(E, { icon: a, title: c, description: f, onClose: i }),
+  /* @__PURE__ */ e(G, { children: [
+    h,
+    (m == null ? void 0 : m.length) && /* @__PURE__ */ d(j, { children: m == null ? void 0 : m.map((r, M) => /* @__PURE__ */ x(
+      g,
+      {
+        ...r,
+        key: M,
+        onClick: (k) => {
+          var p;
+          (p = r == null ? void 0 : r.onClick) == null || p.call(r, k), r != null && r.close && (i == null || i());
+        }
+      }
+    )) })
+  ] })
 ] });
 export {
-  u as SettingsModal
+  J as SettingsModal
 };

package/dist/components/Toolbar/ToolbarOptions.js

@@ -10,23 +10,23 @@ import { MenuHeader as w } from "../Menu/MenuHeader.js";
 import { MenuBase as z, MenuList as D, MenuListItem as m } from "../Menu/MenuBase.js";
 const G = ({
   name: k,
-  search: s,
-  optionGroups: a = {},
+  search: c,
+  optionGroups: s = {},
   options: I,
   onChange: n,
   optionType: L,
   keyboardEvents: p,
   onBlurCapture: T
 }) => {
-  const c = K(null), { menu: j, setActiveIndex: B } = R({
+  const a = K(null), { menu: j, setActiveIndex: B } = R({
     items: I,
-    groups: a,
+    groups: s,
     groupByKey: "groupId",
     keyboardEvents: p,
-    ref: c
+    ref: a
   });
-  return /* @__PURE__ */ v(z, { variant: "default", ref: c, children: [
-    s && /* @__PURE__ */ e(q, { ...s }),
+  return /* @__PURE__ */ v(z, { variant: "default", ref: a, children: [
+    c && /* @__PURE__ */ e(q, { ...c }),
     /* @__PURE__ */ e(D, { role: "menu", onBlurCapture: T, children: j.map((t, l) => {
       const O = (t == null ? void 0 : t.props) || {}, { title: d, divider: P = !0 } = O;
       return /* @__PURE__ */ v(N, { children: [
@@ -37,7 +37,7 @@ const G = ({
           return !((i = o.props) != null && i.hidden);
         }).map((o, i) => {
           var h;
-          const { active: A, onMouseEnter: F } = o, { groupId: u, onClick: E, value: f, checked: M, type: b, ...r } = o.props || {}, { expanded: H } = r, x = r.name || k, y = b || u && ((h = a[u]) == null ? void 0 : h.optionType) || L;
+          const { active: A, onMouseEnter: F } = o, { groupId: u, onClick: E, value: f, checked: M, type: b, ...r } = o.props || {}, { expanded: H } = r, x = r.name || k, y = b || u && ((h = s[u]) == null ? void 0 : h.optionType) || L;
           return /* @__PURE__ */ e(
             m,
             {
@@ -53,7 +53,7 @@ const G = ({
                   active: A,
                   tabIndex: p ? -1 : 0,
                   label: r.label,
-                  badge: r.badge,
+                  count: r.count,
                   name: x,
                   type: y,
                   value: f,

package/dist/components/Typography/Heading.js

@@ -1,43 +1,45 @@
 "use client";
 import { jsx as a } from "react/jsx-runtime";
-import { c as x } from "../../index-L8X2o7IH.js";
+import { c as f } from "../../index-L8X2o7IH.js";
 import "react";
-import { Skeleton as f } from "../Skeleton/Skeleton.js";
-import { useHighlightedText as u } from "./useHighlightedText.js";
+import { Skeleton as u } from "../Skeleton/Skeleton.js";
+import { useHighlightedText as H } from "./useHighlightedText.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/Heading.css';const H = "_heading_1dyne_1", _ = {
-  heading: H
-}, T = ({
-  loading: e,
-  highlightWords: i = [],
-  as: o = "h2",
+import '../../assets/Heading.css';const _ = "_heading_1dyne_1", w = {
+  heading: _
+}, b = ({
+  id: e,
+  loading: i,
+  highlightWords: o = [],
+  as: n = "h2",
   size: t,
-  leading: n = "tight",
-  weight: r = "medium",
-  color: d,
-  variant: m,
-  maxRows: s,
-  className: c,
-  style: h,
-  children: g
+  leading: r = "tight",
+  weight: d = "medium",
+  color: m,
+  variant: s,
+  maxRows: c,
+  className: h,
+  style: g,
+  children: l
 }) => {
-  const l = o, p = u(g, i || []);
+  const p = n, x = H(l, o || []);
   return /* @__PURE__ */ a(
-    l,
+    p,
     {
-      className: x(_.heading, c),
-      style: h,
+      id: e,
+      className: f(w.heading, h),
+      style: g,
       "data-size": t,
-      "data-leading": n,
-      "data-weight": r,
-      "data-color": d,
-      "data-variant": t === "xxs" && "default" || m,
-      "data-max-rows": s,
-      children: /* @__PURE__ */ a(f, { loading: e, children: p })
+      "data-leading": r,
+      "data-weight": d,
+      "data-color": m,
+      "data-variant": t === "xxs" && "default" || s,
+      "data-max-rows": c,
+      children: /* @__PURE__ */ a(u, { loading: i, children: x })
     }
   );
 };
 export {
-  T as Heading
+  b as Heading
 };