@altinn/altinn-components 0.52.6 → 0.53.0

package/dist/components/Menu/MenuItemsVirtual.js

@@ -4,6 +4,7 @@ import { u as _ } from "../../index-De5bF0Gf.js";
 import { useRef as L, useState as k, useEffect as f, useMemo as A } from "react";
 import "../../index-p1eeF8LQ.js";
 import { useMenu as W } from "../../hooks/useMenu.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MenuItem as D } from "./MenuItem.js";
 import { MenuSearch as K } from "./MenuSearch.js";
@@ -13,7 +14,7 @@ import "../Snackbar/useSnackbar.js";
 import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1", O = "_virtualMenuListItem_nmoqo_8", R = {
   virtualScrollRef: F,
   virtualMenuListItem: O
-}, ie = ({
+}, se = ({
   level: M = 0,
   search: y,
   items: E,
@@ -22,7 +23,7 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
   defaultItemColor: b,
   defaultItemVariant: P,
   defaultIconTheme: q,
-  keyboardEvents: d,
+  keyboardEvents: p,
   scrollRefStyles: $
 }) => {
   const i = L(null), v = i.current?.getBoundingClientRect().top, [x, H] = k(window.innerHeight);
@@ -43,23 +44,23 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
     items: E,
     groups: z,
     groupByKey: "groupId",
-    keyboardEvents: d,
+    keyboardEvents: p,
     ref: i
-  }), p = C.flatMap((t, e) => {
-    const r = t?.props || {}, { title: s } = r, m = t?.items?.filter((n) => !n.props?.hidden) || [];
+  }), d = C.flatMap((t, e) => {
+    const r = t?.props || {}, { title: s } = r, m = t?.items?.filter((o) => !o.props?.hidden) || [];
     return [
       ...e > 0 || M > 0 ? [{ type: "separator" }] : [],
       ...s ? [{ type: "title", title: s }] : [],
-      ...m.map((n, c) => ({
+      ...m.map((o, c) => ({
         type: "item",
-        itemProps: n.props || {},
-        active: n.active,
-        hasChildren: n.props?.expanded && n.props?.items,
+        itemProps: o.props || {},
+        active: o.active,
+        hasChildren: o.props?.expanded && o.props?.items,
         isLastItem: c === m.length - 1
       }))
     ];
   }), a = _({
-    count: p.length,
+    count: d.length,
     useAnimationFrameWithResizeObserver: !0,
     gap: 8,
     estimateSize: () => 44,
@@ -84,33 +85,33 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
       document.removeEventListener("keydown", t, !0), r?.removeEventListener("wheel", e), r?.removeEventListener("mousedown", e), r?.removeEventListener("mousemove", e), r?.removeEventListener("touchstart", e);
     };
   }, []), f(() => {
-    if (!d || !l.current) return;
+    if (!p || !l.current) return;
     const t = i.current;
     if (!t) return;
-    const e = 6, r = p.findIndex((o) => o.type === "item" && o.active);
+    const e = 6, r = d.findIndex((n) => n.type === "item" && n.active);
     if (r < 0) return;
-    const s = (o) => (t.querySelector(`[data-index="${o}"]`) || t.querySelector(`[dataindex="${o}"]`) || t.querySelector(`[dataIndex="${o}"]`)) ?? null, m = s(r);
+    const s = (n) => (t.querySelector(`[data-index="${n}"]`) || t.querySelector(`[dataindex="${n}"]`) || t.querySelector(`[dataIndex="${n}"]`)) ?? null, m = s(r);
     if (!m) {
       a.scrollToIndex(r, { align: "auto" }), l.current = !1;
       return;
     }
-    const n = t.getBoundingClientRect(), c = m.getBoundingClientRect(), S = s(r - 1), I = s(r + 1);
+    const o = t.getBoundingClientRect(), c = m.getBoundingClientRect(), S = s(r - 1), I = s(r + 1);
     if (I) {
-      const o = I.getBoundingClientRect();
-      if (o.bottom > n.bottom) {
-        t.scrollTop += o.bottom - n.bottom + e, l.current = !1;
+      const n = I.getBoundingClientRect();
+      if (n.bottom > o.bottom) {
+        t.scrollTop += n.bottom - o.bottom + e, l.current = !1;
         return;
       }
     }
     if (S) {
-      const o = S.getBoundingClientRect();
-      if (o.top < n.top) {
-        t.scrollTop -= n.top - o.top + e, l.current = !1;
+      const n = S.getBoundingClientRect();
+      if (n.top < o.top) {
+        t.scrollTop -= o.top - n.top + e, l.current = !1;
         return;
       }
     }
-    c.top < n.top + e ? t.scrollTop -= n.top + e - c.top : c.bottom > n.bottom - e && (t.scrollTop += c.bottom - (n.bottom - e)), l.current = !1;
-  }, [p, d, a]), /* @__PURE__ */ u(j, { children: /* @__PURE__ */ w("div", { ref: i, className: R.virtualScrollRef, style: B, children: [
+    c.top < o.top + e ? t.scrollTop -= o.top + e - c.top : c.bottom > o.bottom - e && (t.scrollTop += c.bottom - (o.bottom - e)), l.current = !1;
+  }, [d, p, a]), /* @__PURE__ */ u(j, { children: /* @__PURE__ */ w("div", { ref: i, className: R.virtualScrollRef, style: B, children: [
     y && /* @__PURE__ */ u(
       "div",
       {
@@ -131,7 +132,7 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
           height: `${a.getTotalSize()}px`
         },
         children: g.map((t) => {
-          const e = p[t.index];
+          const e = d[t.index];
           return e ? /* @__PURE__ */ w(
             N,
             {
@@ -150,7 +151,7 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
                     variant: e.itemProps.variant || P,
                     iconTheme: e.itemProps.iconTheme || q,
                     active: e.active,
-                    tabIndex: e.itemProps.disabled || d ? -1 : 0
+                    tabIndex: e.itemProps.disabled || p ? -1 : 0
                   }
                 )
               ]
@@ -163,5 +164,5 @@ import '../../assets/MenuItemsVirtual.css';const F = "_virtualScrollRef_nmoqo_1"
   ] }) });
 };
 export {
-  ie as MenuItemsVirtual
+  se as MenuItemsVirtual
 };

package/dist/components/Menu/MenuOption.js

@@ -1,8 +1,9 @@
 import { jsx as a, jsxs as s } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
-import { MenuItem as p } from "./MenuItem.js";
+import { MenuItem as h } from "./MenuItem.js";
 import "../Snackbar/useSnackbar.js";
 import { S as m } from "../../Checkmark-Byz_C9x4.js";
 import '../../assets/MenuOption.css';const j = "_label_xjlhn_1", f = "_title_xjlhn_16", k = "_titleWrapper_xjlhn_22", v = "_count_xjlhn_27", W = "_radio_xjlhn_34", I = "_checkbox_xjlhn_35", M = "_icon_xjlhn_68", e = {
@@ -13,7 +14,7 @@ import '../../assets/MenuOption.css';const j = "_label_xjlhn_1", f = "_title_xjl
   radio: W,
   checkbox: I,
   icon: M
-}, C = ({
+}, D = ({
   size: c = "md",
   type: _,
   name: S,
@@ -23,39 +24,39 @@ import '../../assets/MenuOption.css';const j = "_label_xjlhn_1", f = "_title_xjl
   title: x,
   description: u,
   icon: N,
-  count: n = 0,
-  checked: t = !1,
+  count: t = 0,
+  checked: n = !1,
   disabled: i,
   onMouseEnter: w,
   onClick: o,
   role: d,
-  ...h
+  ...p
 }) => {
   const b = () => {
     switch (_) {
       case "checkbox":
         return /* @__PURE__ */ s("span", { className: e.label, children: [
-          /* @__PURE__ */ a("span", { className: e.checkbox, "data-checked": t, children: /* @__PURE__ */ a(m, { className: e.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ a("span", { className: e.checkbox, "data-checked": n, children: /* @__PURE__ */ a(m, { className: e.icon, "aria-hidden": !0 }) }),
           /* @__PURE__ */ s("div", { className: e.titleWrapper, children: [
             /* @__PURE__ */ a("span", { className: e.title, children: r }),
-            n > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: n })
+            t > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: t })
           ] })
         ] });
       case "radio":
         return /* @__PURE__ */ s("span", { className: e.label, children: [
-          /* @__PURE__ */ a("span", { className: e.radio, "data-checked": t, children: /* @__PURE__ */ a(m, { className: e.icon, "aria-hidden": !0 }) }),
+          /* @__PURE__ */ a("span", { className: e.radio, "data-checked": n, children: /* @__PURE__ */ a(m, { className: e.icon, "aria-hidden": !0 }) }),
           /* @__PURE__ */ s("div", { className: e.titleWrapper, children: [
             /* @__PURE__ */ a("span", { className: e.title, children: r }),
-            n > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: n })
+            t > 0 && /* @__PURE__ */ a("span", { className: e.count, "aria-hidden": "true", children: t })
           ] })
         ] });
     }
   };
   return r ? /* @__PURE__ */ a(
-    p,
+    h,
     {
       disabled: i,
-      selected: t,
+      selected: n,
       size: c,
       as: "div",
       active: l,
@@ -63,13 +64,13 @@ import '../../assets/MenuOption.css';const j = "_label_xjlhn_1", f = "_title_xjl
       onClick: o,
       role: d,
       label: /* @__PURE__ */ a(b, {}),
-      ...h
+      ...p
     }
   ) : /* @__PURE__ */ a(
-    p,
+    h,
     {
       disabled: i,
-      selected: t,
+      selected: n,
       size: c,
       as: "div",
       active: l,
@@ -79,10 +80,10 @@ import '../../assets/MenuOption.css';const j = "_label_xjlhn_1", f = "_title_xjl
       icon: N,
       title: x,
       description: u,
-      ...h
+      ...p
     }
   );
 };
 export {
-  C as MenuOption
+  D as MenuOption
 };

package/dist/components/Menu/MenuSearch.js

@@ -2,12 +2,13 @@ import { jsx as f } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { useIsDesktop as a } from "../../hooks/useIsDesktop.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { SearchField as c } from "../Forms/SearchField.js";
 import "../Snackbar/useSnackbar.js";
 import '../../assets/MenuSearch.css';const l = "_field_1w1s0_1", n = {
   field: l
-}, x = ({
+}, S = ({
   name: e,
   value: r,
   placeholder: t = "Search",
@@ -36,5 +37,5 @@ import '../../assets/MenuSearch.css';const l = "_field_1w1s0_1", n = {
   );
 };
 export {
-  x as MenuSearch
+  S as MenuSearch
 };

package/dist/components/Metadata/MetaItem.js

@@ -1,23 +1,24 @@
-import { jsxs as x, jsx as o } from "react/jsx-runtime";
+import { jsxs as x, jsx as e } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MetaItemBase as I } from "./MetaItemBase.js";
 import { MetaItemIcon as f } from "./MetaItemIcon.js";
 import { MetaItemLabel as M } from "./MetaItemLabel.js";
 import "../Snackbar/useSnackbar.js";
-const B = ({
+const L = ({
   loading: t,
   reverse: p,
   size: m = "xs",
   variant: r = "text",
-  icon: e,
+  icon: o,
   children: i,
   ...s
 }) => /* @__PURE__ */ x(I, { loading: t, reverse: p, variant: r, size: m, ...s, children: [
-  !t && e && /* @__PURE__ */ o(f, { icon: e }),
-  /* @__PURE__ */ o(M, { variant: r, size: m, children: i })
+  !t && o && /* @__PURE__ */ e(f, { icon: o }),
+  /* @__PURE__ */ e(M, { variant: r, size: m, children: i })
 ] });
 export {
-  B as MetaItem
+  L as MetaItem
 };

package/dist/components/Metadata/MetaItemIcon.js

@@ -5,6 +5,7 @@ import { isIconProps as i, Icon as m } from "../Icon/Icon.js";
 import { ProgressIcon as n } from "../Icon/ProgressIcon.js";
 import { isAvatarProps as c, Avatar as f } from "../Avatar/Avatar.js";
 import { isAvatarGroupProps as l, AvatarGroup as u } from "../Avatar/AvatarGroup.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import '../../assets/MetaItemIcon.css';const _ = "_media_1pqyq_1", d = "_icon_1pqyq_7", y = "_avatarGroup_1pqyq_11", t = {
@@ -15,10 +16,10 @@ import '../../assets/MetaItemIcon.css';const _ = "_media_1pqyq_1", d = "_icon_1p
 function v(r) {
   return typeof r == "string" || typeof r == "number" || typeof r == "boolean" || r === null || p(r);
 }
-const E = ({ size: r = "xs", icon: a, progress: s }) => !a && typeof s != "number" ? !1 : /* @__PURE__ */ e("span", { className: t.media, "data-size": r, children: [
+const g = ({ size: r = "xs", icon: a, progress: s }) => !a && typeof s != "number" ? !1 : /* @__PURE__ */ e("span", { className: t.media, "data-size": r, children: [
   c(a) && /* @__PURE__ */ o(f, { ...a, className: t.avatar }) || l(a) && /* @__PURE__ */ o(u, { ...a, className: t.avatarGroup }) || i(a) && /* @__PURE__ */ o(m, { ...a, className: t.icon }) || v(a) && a || /* @__PURE__ */ o(m, { svgElement: a, className: t.icon }),
   s && /* @__PURE__ */ o(n, { value: s, className: t.icon })
 ] });
 export {
-  E as MetaItemIcon
+  g as MetaItemIcon
 };

package/dist/components/Metadata/MetaProgress.js

@@ -1,15 +1,16 @@
 import { jsxs as p, jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MetaItemBase as i } from "./MetaItemBase.js";
 import { MetaItemIcon as s } from "./MetaItemIcon.js";
 import { MetaItemLabel as x } from "./MetaItemLabel.js";
 import "../Snackbar/useSnackbar.js";
-const b = ({ size: t = "xs", variant: r = "text", progress: m = 0, children: e }) => /* @__PURE__ */ p(i, { variant: r, size: t, children: [
+const d = ({ size: t = "xs", variant: r = "text", progress: m = 0, children: e }) => /* @__PURE__ */ p(i, { variant: r, size: t, children: [
   /* @__PURE__ */ o(s, { size: t, progress: m }),
   /* @__PURE__ */ o(x, { variant: r, size: t, children: e })
 ] });
 export {
-  b as MetaProgress
+  d as MetaProgress
 };

package/dist/components/Metadata/MetaTimestamp.js

@@ -1,22 +1,23 @@
-import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MetaItemBase as a } from "./MetaItemBase.js";
 import { MetaItemIcon as x } from "./MetaItemIcon.js";
 import { MetaItemLabel as f } from "./MetaItemLabel.js";
 import "../Snackbar/useSnackbar.js";
-const u = ({
+const B = ({
   loading: m,
   size: t = "xs",
   variant: r = "text",
   datetime: p,
-  icon: e,
+  icon: o,
   children: i
 }) => /* @__PURE__ */ s(a, { loading: m, as: "time", variant: r, datetime: p, size: t, children: [
-  !m && e && /* @__PURE__ */ o(x, { size: t, icon: e }),
-  /* @__PURE__ */ o(f, { variant: r, size: t, children: i })
+  !m && o && /* @__PURE__ */ e(x, { size: t, icon: o }),
+  /* @__PURE__ */ e(f, { variant: r, size: t, children: i })
 ] });
 export {
-  u as MetaTimestamp
+  B as MetaTimestamp
 };

package/dist/components/Metadata/Metadata.js

@@ -1,23 +1,24 @@
 import { jsx as t } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MetaItem as n } from "./MetaItem.js";
-import { MetaProgress as a } from "./MetaProgress.js";
-import { MetaTimestamp as c } from "./MetaTimestamp.js";
+import { MetaProgress as p } from "./MetaProgress.js";
+import { MetaTimestamp as a } from "./MetaTimestamp.js";
 import "../Snackbar/useSnackbar.js";
-import { Flex as p } from "../Page/Flex.js";
+import { Flex as c } from "../Page/Flex.js";
 const s = ({ type: e = "default", label: r, ...i }) => {
   switch (e) {
     case "progress":
-      return /* @__PURE__ */ t(a, { ...i, children: r });
+      return /* @__PURE__ */ t(p, { ...i, children: r });
     case "timestamp":
-      return /* @__PURE__ */ t(c, { ...i, children: r });
+      return /* @__PURE__ */ t(a, { ...i, children: r });
     default:
       return /* @__PURE__ */ t(n, { ...i, children: r });
   }
-}, j = ({ variant: e = "inline", size: r, items: i = [] }) => /* @__PURE__ */ t(p, { as: "ul", direction: e === "list" ? "col" : "row", spacing: 2, children: i.map((o, m) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(s, { ...o, size: r }) }, "meta-" + m)) });
+}, F = ({ variant: e = "inline", size: r, items: i = [] }) => /* @__PURE__ */ t(c, { as: "ul", direction: e === "list" ? "col" : "row", spacing: 2, children: i.map((o, m) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(s, { ...o, size: r }) }, "meta-" + m)) });
 export {
   s as MetaListItem,
-  j as Metadata
+  F as Metadata
 };

package/dist/components/Modal/Modal.js

@@ -1,27 +1,27 @@
-import { jsxs as n, jsx as p } from "react/jsx-runtime";
+import { jsxs as p, jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { IconButton as a } from "../Button/IconButton.js";
+import { Button as e } from "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { ModalBase as c } from "./ModalBase.js";
+import { ModalBase as n } from "./ModalBase.js";
 import { S as d } from "../../XMark-tKk6aExO.js";
-import '../../assets/Modal.css';const e = "_dismiss_ps82p_1", l = {
-  dismiss: e
-}, v = ({ open: i, onClose: s, dismissable: o, closeTitle: t, children: m, ...r }) => /* @__PURE__ */ n(c, { padding: 6, spacing: 6, ...r, open: i, onClose: s, children: [
-  typeof s == "function" && o && /* @__PURE__ */ p(
-    a,
+import '../../assets/Modal.css';const l = "_dismiss_ps82p_1", c = {
+  dismiss: l
+}, h = ({ open: t, onClose: s, dismissable: o, closeTitle: r, children: m, ...a }) => /* @__PURE__ */ p(n, { padding: 6, spacing: 6, ...a, open: t, onClose: s, children: [
+  typeof s == "function" && o && /* @__PURE__ */ i(
+    e,
     {
-      className: l.dismiss,
-      icon: d,
+      className: c.dismiss,
       variant: "outline",
       onClick: s,
-      iconAltText: t ?? "Close",
-      size: "sm"
+      "aria-label": r ?? "Close",
+      size: "sm",
+      children: /* @__PURE__ */ i(d, { style: { fontSize: "1.5em" } })
     }
   ),
   m
 ] });
 export {
-  v as Modal
+  h as Modal
 };

package/dist/components/Modal/ModalBase.js

@@ -2,19 +2,20 @@
 import { jsx as d } from "react/jsx-runtime";
 import { useRef as D, useEffect as f } from "react";
 import "../../index-p1eeF8LQ.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as S } from "../Page/Section.js";
 import '../../assets/ModalBase.css';const x = "_modal_4vfmr_1", C = "_content_4vfmr_35", m = {
   modal: x,
   content: C
-}, K = ({
+}, X = ({
   open: r,
   onClose: o,
   closedBy: n = "any",
   children: u,
-  backdropColor: v = "inherit",
-  size: p,
+  backdropColor: p = "inherit",
+  size: v,
   color: g,
   padding: E = 0,
   spacing: h = 0,
@@ -55,7 +56,7 @@ import '../../assets/ModalBase.css';const x = "_modal_4vfmr_1", C = "_content_4v
       onCancel: (e) => {
         e.preventDefault(), n === "any" && o();
       },
-      "data-backdrop-color": v,
+      "data-backdrop-color": p,
       className: m.modal,
       "data-variant": y,
       onClose: n !== "none" ? o : void 0,
@@ -64,7 +65,7 @@ import '../../assets/ModalBase.css';const x = "_modal_4vfmr_1", C = "_content_4v
         {
           className: m.content,
           "aria-label": "modal content",
-          size: p,
+          size: v,
           color: g,
           padding: E,
           spacing: h,
@@ -75,5 +76,5 @@ import '../../assets/ModalBase.css';const x = "_modal_4vfmr_1", C = "_content_4v
   );
 };
 export {
-  K as ModalBase
+  X as ModalBase
 };

package/dist/components/Modal/ModalBody.js

@@ -1,12 +1,7 @@
-import { jsx as r } from "react/jsx-runtime";
-import "../../index-p1eeF8LQ.js";
-import "react";
-import "../RootProvider/RootProvider.js";
-import "../Snackbar/useSnackbar.js";
-import { Section as i } from "../Page/Section.js";
-import '../../assets/ModalBody.css';const m = "_body_1cilr_1", p = {
-  body: m
-}, e = ({ children: o, ...t }) => /* @__PURE__ */ r(i, { spacing: 6, padding: 6, ...t, className: p.body, children: o });
+import { jsx as s } from "react/jsx-runtime";
+import '../../assets/ModalBody.css';const d = "_body_p3jqc_1", t = {
+  body: d
+}, c = ({ children: o }) => /* @__PURE__ */ s("div", { className: t.body, children: o });
 export {
-  e as ModalBody
+  c as ModalBody
 };

package/dist/components/Modal/ModalFooter.js

@@ -1,10 +1,11 @@
 import { jsx as t } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Flex as p } from "../Page/Flex.js";
-const d = ({ children: o, ...r }) => /* @__PURE__ */ t(p, { as: "footer", spacing: 2, padding: 4, ...r, children: o });
+const f = ({ children: o, ...r }) => /* @__PURE__ */ t(p, { as: "footer", spacing: 2, padding: 4, ...r, children: o });
 export {
-  d as ModalFooter
+  f as ModalFooter
 };

package/dist/components/Modal/ModalHeader.js

@@ -1,53 +1,43 @@
-import { jsx as r, jsxs as e } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 import { c as h } from "../../index-p1eeF8LQ.js";
 import "react";
-import { Heading as s } from "../Typography/Heading.js";
-import { IconButton as p } from "../Button/IconButton.js";
+import { Heading as m } from "../Typography/Heading.js";
+import { Button as f } from "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { Flex as o } from "../Page/Flex.js";
-import { Section as g } from "../Page/Section.js";
-import { ModalIcon as f } from "./ModalIcon.js";
-import { S as y } from "../../XMark-tKk6aExO.js";
-import '../../assets/ModalHeader.css';const u = "_header_7ty99_1", x = "_sticky_7ty99_6", m = {
-  header: u,
-  sticky: x
-}, A = ({
-  title: t,
-  description: i,
+import { Flex as t } from "../Page/Flex.js";
+import { ModalIcon as p } from "./ModalIcon.js";
+import { S as g } from "../../XMark-tKk6aExO.js";
+import '../../assets/ModalHeader.css';const y = "_header_nhvlf_1", u = "_sticky_nhvlf_11", c = {
+  header: y,
+  sticky: u
+}, H = ({
+  title: o,
+  description: e,
   icon: n,
-  onClose: c,
-  closeTitle: a,
-  children: d,
-  sticky: l = !0
-}) => /* @__PURE__ */ r(g, { as: "header", spacing: 2, padding: 4, className: h(m.header, l && m.sticky), children: /* @__PURE__ */ e(o, { direction: "row", justify: "between", align: "center", spacing: 8, children: [
-  d || /* @__PURE__ */ e(o, { direction: "row", align: "center", spacing: 3, children: [
-    n && /* @__PURE__ */ r(f, { icon: n }),
-    /* @__PURE__ */ e(o, { direction: "col", spacing: 0, children: [
-      t && /* @__PURE__ */ r(s, { as: "h2", size: i ? "md" : "lg", children: t }),
-      i && /* @__PURE__ */ r(s, { as: "h3", size: "xs", weight: "normal", children: i })
+  onClose: a,
+  closeTitle: s,
+  children: l,
+  sticky: d = !0
+}) => /* @__PURE__ */ r("header", { className: h(c.header, d && c.sticky), children: /* @__PURE__ */ i(t, { direction: "row", justify: "between", align: "center", spacing: 8, style: { flexGrow: 1 }, children: [
+  l || /* @__PURE__ */ i(t, { direction: "row", align: "center", spacing: 3, children: [
+    n && /* @__PURE__ */ r(p, { icon: n }),
+    /* @__PURE__ */ i(t, { direction: "col", spacing: 0, children: [
+      o && /* @__PURE__ */ r(m, { as: "h2", size: e ? "md" : "lg", children: o }),
+      e && /* @__PURE__ */ r(m, { as: "h3", size: "xs", weight: "normal", children: e })
     ] })
   ] }),
-  (c || a) && /* @__PURE__ */ r(
+  (a || s) && /* @__PURE__ */ r(
     "form",
     {
       method: "dialog",
       onSubmit: () => {
-        c?.();
+        a?.();
       },
-      children: /* @__PURE__ */ r(
-        p,
-        {
-          type: "submit",
-          icon: y,
-          variant: "outline",
-          iconAltText: a ?? "Close",
-          size: "sm"
-        }
-      )
+      children: /* @__PURE__ */ r(f, { type: "submit", variant: "outline", "aria-label": s ?? "Close", size: "sm", children: /* @__PURE__ */ r(g, { style: { fontSize: "1.5em" } }) })
     }
   )
 ] }) });
 export {
-  A as ModalHeader
+  H as ModalHeader
 };

package/dist/components/Modal/ModalIcon.js

@@ -1,9 +1,10 @@
 import { jsx as t } from "react/jsx-runtime";
-import { isValidElement as p } from "react";
+import { isValidElement as s } from "react";
 import "../../index-p1eeF8LQ.js";
 import { Icon as e, isIconProps as m } from "../Icon/Icon.js";
-import { isAvatarProps as n, Avatar as c } from "../Avatar/Avatar.js";
-import { isAvatarGroupProps as i, AvatarGroup as v } from "../Avatar/AvatarGroup.js";
+import { isAvatarProps as n, Avatar as i } from "../Avatar/Avatar.js";
+import { isAvatarGroupProps as c, AvatarGroup as v } from "../Avatar/AvatarGroup.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { S as l } from "../../XMark-tKk6aExO.js";
@@ -14,9 +15,9 @@ import '../../assets/ListItemIcon.css';const f = "_wrapper_rcjve_1", _ = "_icon_
   avatarGroup: N
 };
 function d(a) {
-  return typeof a == "string" || typeof a == "number" || typeof a == "boolean" || a === null || p(a);
+  return typeof a == "string" || typeof a == "number" || typeof a == "boolean" || a === null || s(a);
 }
-const b = ({ loading: a, icon: r, theme: s }) => r ? a ? /* @__PURE__ */ t(e, { className: o.wrapper, svgElement: l, loading: !0 }) : /* @__PURE__ */ t("div", { className: o.wrapper, children: n(r) && /* @__PURE__ */ t(c, { ...r, className: o.avatar }) || i(r) && /* @__PURE__ */ t(v, { ...r, className: o.avatarGroup }) || m(r) && /* @__PURE__ */ t(e, { ...r, theme: r.theme || s, className: o.icon }) || d(r) && r || /* @__PURE__ */ t(e, { theme: s, svgElement: r, className: o.icon }) }) : null;
+const h = ({ loading: a, icon: r, theme: p }) => r ? a ? /* @__PURE__ */ t(e, { className: o.wrapper, svgElement: l, loading: !0 }) : /* @__PURE__ */ t("div", { className: o.wrapper, children: n(r) && /* @__PURE__ */ t(i, { ...r, className: o.avatar }) || c(r) && /* @__PURE__ */ t(v, { ...r, className: o.avatarGroup }) || m(r) && /* @__PURE__ */ t(e, { ...r, theme: r.theme || p, className: o.icon }) || d(r) && r || /* @__PURE__ */ t(e, { theme: p, svgElement: r, className: o.icon }) }) : null;
 export {
-  b as ModalIcon
+  h as ModalIcon
 };

package/dist/components/Notifications/NotificationItem.js

@@ -1,17 +1,18 @@
 import { jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { NotificationItemBase as r } from "./NotificationItemBase.js";
 import "../Snackbar/useSnackbar.js";
-const x = ({
+const I = ({
   loading: m,
   id: e = "notification",
   icon: t,
   title: i,
-  description: n,
-  ...p
-}) => m ? /* @__PURE__ */ o(r, { icon: t, title: i, loading: !0 }) : /* @__PURE__ */ o(r, { ...p, icon: t, title: i, description: n });
+  description: p,
+  ...n
+}) => m ? /* @__PURE__ */ o(r, { icon: t, title: i, loading: !0 }) : /* @__PURE__ */ o(r, { ...n, icon: t, title: i, description: p });
 export {
-  x as NotificationItem
+  I as NotificationItem
 };