@altinn/altinn-components 0.52.7 → 0.53.1

package/dist/components/Byline/Byline.js

@@ -4,6 +4,7 @@ import "react";
 import { Avatar as f } from "../Avatar/Avatar.js";
 import { AvatarGroup as d } from "../Avatar/AvatarGroup.js";
 import { Skeleton as n } from "../Skeleton/Skeleton.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import '../../assets/Byline.css';const y = "_byline_fzp7k_1", k = "_avatar_fzp7k_7", u = "_avatarGroup_fzp7k_12", N = "_label_fzp7k_26", t = {
@@ -11,23 +12,23 @@ import '../../assets/Byline.css';const y = "_byline_fzp7k_1", k = "_avatar_fzp7k
   avatar: k,
   avatarGroup: u,
   label: N
-}, L = ({
+}, S = ({
   loading: l,
-  color: c = "neutral",
+  color: m = "neutral",
   size: r = "xs",
   avatar: o,
   avatarGroup: e,
   datetime: s,
-  children: m,
+  children: c,
   as: i,
   ...p
 }) => {
   const _ = i || "div", b = s ? "time" : "span";
-  return /* @__PURE__ */ v(_, { ...p, className: t.byline, "data-color": c, "data-size": r, children: [
+  return /* @__PURE__ */ v(_, { ...p, className: t.byline, "data-color": m, "data-size": r, children: [
     (e || o) && /* @__PURE__ */ a(n, { variant: "circle", className: t.avatar, loading: l, children: e ? /* @__PURE__ */ a(d, { ...e, size: r, className: t.avatarGroup }) : o && /* @__PURE__ */ a(f, { ...o, size: r, className: t.avatar }) }),
-    /* @__PURE__ */ a(b, { "data-size": r, dateTime: s, className: t.label, children: /* @__PURE__ */ a(n, { loading: l, children: m }) })
+    /* @__PURE__ */ a(b, { "data-size": r, dateTime: s, className: t.label, children: /* @__PURE__ */ a(n, { loading: l, children: c }) })
   ] });
 };
 export {
-  L as Byline
+  S as Byline
 };

package/dist/components/ContextMenu/ContextMenu.js

@@ -1,77 +1,77 @@
 "use client";
-import { jsxs as h, jsx as d } from "react/jsx-runtime";
+import { jsxs as h, jsx as u } from "react/jsx-runtime";
 import { c as y } from "../../index-p1eeF8LQ.js";
-import f, { forwardRef as I, useRef as w, useMemo as O } from "react";
+import f, { forwardRef as w, useRef as I, useMemo as O } from "react";
 import { useClickOutside as k } from "../../hooks/useClickOutside.js";
 import { useEnterKey as E } from "../../hooks/useEnterKey.js";
-import { IconButton as _ } from "../Button/IconButton.js";
+import { Button as _ } from "../Button/Button.js";
 import { DropdownBase as C } from "../Dropdown/DropdownBase.js";
 import { useRootContext as M } from "../RootProvider/RootProvider.js";
 import { MenuItems as j } from "../Menu/MenuItems.js";
 import "../Snackbar/useSnackbar.js";
 import { u as R } from "../../useId-BVFxCjkq.js";
 import '../../assets/ContextMenu.css';var P = function(e, l) {
-  var n = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && l.indexOf(t) < 0 && (n[t] = e[t]);
+  var r = {};
+  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && l.indexOf(t) < 0 && (r[t] = e[t]);
   if (e != null && typeof Object.getOwnPropertySymbols == "function")
     for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-      l.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (n[t[o]] = e[t[o]]);
-  return n;
+      l.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (r[t[o]] = e[t[o]]);
+  return r;
 };
-const T = I((e, l) => {
-  var { title: n, titleId: t } = e, o = P(e, ["title", "titleId"]);
-  let r = R();
-  return r = n ? t || "title-" + r : void 0, f.createElement(
+const S = w((e, l) => {
+  var { title: r, titleId: t } = e, o = P(e, ["title", "titleId"]);
+  let n = R();
+  return n = r ? t || "title-" + n : void 0, f.createElement(
     "svg",
-    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: l, "aria-labelledby": r }, o),
-    n ? f.createElement("title", { id: r }, n) : null,
+    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: l, "aria-labelledby": n }, o),
+    r ? f.createElement("title", { id: n }, r) : null,
     f.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M6 10.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3m4.5 1.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0m6 0a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0", clipRule: "evenodd" })
   );
-}), A = "_toggle_nol5i_1", B = {
-  toggle: A
+}), B = "_toggle_nol5i_1", T = {
+  toggle: B
 }, J = ({
   id: e = "context-menu",
   ariaLabel: l,
-  placement: n = "right",
+  placement: r = "right",
   groups: t = {},
   className: o,
-  items: r
+  items: n
 }) => {
-  const { currentId: g, toggleId: m, closeAll: c } = M(), u = w(null), p = "context-menu-" + e, v = () => m(e), a = g === e;
-  k(u, () => {
-    a && m(e);
+  const { currentId: g, toggleId: m, closeAll: a } = M(), d = I(null), p = "context-menu-" + e, v = () => m(e), c = g === e;
+  k(d, () => {
+    c && m(e);
   });
-  const x = O(() => r.map((i) => ({
+  const b = O(() => n.map((i) => ({
     ...i,
     tabIndex: -1,
     onClick: () => {
-      i.onClick?.(), c();
+      i.onClick?.(), a();
     }
-  })), [r, c]);
+  })), [n, a]);
   E((i) => {
-    if (a) {
+    if (c) {
       i.preventDefault();
-      const s = u.current?.querySelector('[data-active="true"]');
-      s && (s.tagName === "A" && s.hasAttribute("href") ? s.click() : s.dispatchEvent(new MouseEvent("click", { bubbles: !0 }))), c();
+      const s = d.current?.querySelector('[data-active="true"]');
+      s && (s.tagName === "A" && s.hasAttribute("href") ? s.click() : s.dispatchEvent(new MouseEvent("click", { bubbles: !0 }))), a();
     }
   });
-  const b = (i) => {
-    i?.relatedTarget?.closest(`[data-testid="${p}"]`) || c();
+  const x = (i) => {
+    i?.relatedTarget?.closest(`[data-testid="${p}"]`) || a();
   };
-  return /* @__PURE__ */ h("div", { className: y(B.toggle, o), ref: u, "data-testid": p, children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ h("div", { className: y(T.toggle, o), ref: d, "data-testid": p, children: [
+    /* @__PURE__ */ u(
       _,
       {
         size: "xs",
         rounded: !0,
-        icon: T,
-        variant: "text",
+        variant: "ghost",
         onClick: v,
-        iconAltText: l || `Open ${e}`,
-        onBlurCapture: b
+        "aria-label": l || `Open ${e}`,
+        onBlurCapture: x,
+        children: /* @__PURE__ */ u(S, { style: { fontSize: "1.5em" } })
       }
     ),
-    a && /* @__PURE__ */ d(C, { placement: n, open: a, children: /* @__PURE__ */ d(j, { groups: t, items: x, keyboardEvents: !0 }) })
+    c && /* @__PURE__ */ u(C, { placement: r, open: c, children: /* @__PURE__ */ u(j, { groups: t, items: b, keyboardEvents: !0 }) })
   ] });
 };
 export {

package/dist/components/Dashboard/DashboardCard.js

@@ -4,6 +4,7 @@ import "../../index-p1eeF8LQ.js";
 import { forwardRef as p, useRef as g, useEffect as B } from "react";
 import { Typography as R } from "../Typography/Typography.js";
 import { Heading as b } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { DashboardIcon as w } from "./DashboardIcon.js";
@@ -25,7 +26,7 @@ const D = p(function({ asChild: n = !1, variant: r = "default", className: e, ..
   Block: E
 });
 C.Block.displayName = "Card.Block";
-function T({
+function A({
   color: l,
   theme: n = "tinted",
   icon: r,
@@ -55,5 +56,5 @@ function T({
   ] });
 }
 export {
-  T as DashboardCard
+  A as DashboardCard
 };

package/dist/components/Dashboard/DashboardHeader.js

@@ -1,24 +1,25 @@
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { jsxs as e, jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Skeleton as a } from "../Skeleton/Skeleton.js";
 import { Typography as n } from "../Typography/Typography.js";
 import { Heading as c } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Flex as t } from "../Page/Flex.js";
 import { Section as d } from "../Page/Section.js";
 import { DashboardIcon as h } from "./DashboardIcon.js";
-const H = ({ icon: i, title: m, description: p, loading: r, children: s }) => /* @__PURE__ */ o(d, { as: "header", theme: "default", padding: "page", spacing: 6, shadow: "xs", children: [
-  /* @__PURE__ */ o(t, { direction: "row", align: "center", spacing: 3, children: [
-    i && /* @__PURE__ */ e(h, { loading: r, icon: i }),
-    /* @__PURE__ */ o(t, { direction: "col", spacing: 0, children: [
-      /* @__PURE__ */ e(c, { size: "lg", loading: r, children: m }),
-      /* @__PURE__ */ e(n, { as: "section", variant: "subtle", size: "xs", loading: r, children: p })
+const S = ({ icon: i, title: m, description: p, loading: r, children: s }) => /* @__PURE__ */ e(d, { as: "header", theme: "default", padding: "page", spacing: 6, shadow: "xs", children: [
+  /* @__PURE__ */ e(t, { direction: "row", align: "center", spacing: 3, children: [
+    i && /* @__PURE__ */ o(h, { loading: r, icon: i }),
+    /* @__PURE__ */ e(t, { direction: "col", spacing: 0, children: [
+      /* @__PURE__ */ o(c, { size: "lg", loading: r, children: m }),
+      /* @__PURE__ */ o(n, { as: "section", variant: "subtle", size: "xs", loading: r, children: p })
     ] })
   ] }),
-  /* @__PURE__ */ e(a, { loading: r, children: s })
+  /* @__PURE__ */ o(a, { loading: r, children: s })
 ] });
 export {
-  H as DashboardHeader
+  S as DashboardHeader
 };

package/dist/components/Dashboard/DashboardIcon.js

@@ -1,10 +1,11 @@
 import { jsx as m } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { MenuItemIcon as i } from "../Menu/MenuItemIcon.js";
 import "../Snackbar/useSnackbar.js";
-const a = ({ loading: o, icon: r, theme: t }) => /* @__PURE__ */ m(i, { icon: r, size: "lg", theme: t, loading: o });
+const f = ({ loading: o, icon: r, theme: t }) => /* @__PURE__ */ m(i, { icon: r, size: "lg", theme: t, loading: o });
 export {
-  a as DashboardIcon
+  f as DashboardIcon
 };

package/dist/components/Datepicker/DatepickerHeader.js

@@ -1,38 +1,38 @@
 "use client";
-import { jsxs as s, jsx as i } from "react/jsx-runtime";
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { Button as d } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
-import a, { forwardRef as f } from "react";
+import o, { forwardRef as f } from "react";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { IconButton as d } from "../Button/IconButton.js";
 import { u as m } from "../../useId-BVFxCjkq.js";
 import { S as p } from "../../ChevronRight-ANFWmIs1.js";
-import '../../assets/DatepickerHeader.css';var v = function(t, l) {
+import '../../assets/DatepickerHeader.css';var h = function(t, n) {
   var r = {};
-  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && l.indexOf(e) < 0 && (r[e] = t[e]);
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && n.indexOf(e) < 0 && (r[e] = t[e]);
   if (t != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var n = 0, e = Object.getOwnPropertySymbols(t); n < e.length; n++)
-      l.indexOf(e[n]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[n]) && (r[e[n]] = t[e[n]]);
+    for (var l = 0, e = Object.getOwnPropertySymbols(t); l < e.length; l++)
+      n.indexOf(e[l]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[l]) && (r[e[l]] = t[e[l]]);
   return r;
 };
-const u = f((t, l) => {
-  var { title: r, titleId: e } = t, n = v(t, ["title", "titleId"]);
-  let o = m();
-  return o = r ? e || "title-" + o : void 0, a.createElement(
+const v = f((t, n) => {
+  var { title: r, titleId: e } = t, l = h(t, ["title", "titleId"]);
+  let i = m();
+  return i = r ? e || "title-" + i : void 0, o.createElement(
     "svg",
-    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: l, "aria-labelledby": o }, n),
-    r ? a.createElement("title", { id: o }, r) : null,
-    a.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M14.53 5.97a.75.75 0 0 1 0 1.06L9.56 12l4.97 4.97a.75.75 0 1 1-1.06 1.06l-5.5-5.5a.75.75 0 0 1 0-1.06l5.5-5.5a.75.75 0 0 1 1.06 0", clipRule: "evenodd" })
+    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: n, "aria-labelledby": i }, l),
+    r ? o.createElement("title", { id: i }, r) : null,
+    o.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M14.53 5.97a.75.75 0 0 1 0 1.06L9.56 12l4.97 4.97a.75.75 0 1 1-1.06 1.06l-5.5-5.5a.75.75 0 0 1 0-1.06l5.5-5.5a.75.75 0 0 1 1.06 0", clipRule: "evenodd" })
   );
-}), h = "_header_xt893_1", x = "_title_xt893_8", _ = "_nav_xt893_14", c = {
-  header: h,
-  title: x,
-  nav: _
-}, R = ({ title: t, onNext: l, onPrev: r }) => /* @__PURE__ */ s("header", { className: c.header, children: [
-  /* @__PURE__ */ i("h2", { className: c.title, children: t }),
+}), u = "_header_xt893_1", _ = "_title_xt893_8", g = "_nav_xt893_14", c = {
+  header: u,
+  title: _,
+  nav: g
+}, R = ({ title: t, onNext: n, onPrev: r }) => /* @__PURE__ */ s("header", { className: c.header, children: [
+  /* @__PURE__ */ a("h2", { className: c.title, children: t }),
   /* @__PURE__ */ s("nav", { className: c.nav, children: [
-    /* @__PURE__ */ i(d, { icon: u, size: "sm", variant: "text", onClick: r, iconAltText: "prev icon" }),
-    /* @__PURE__ */ i(d, { icon: p, size: "sm", variant: "text", onClick: l, iconAltText: "next icon" })
+    /* @__PURE__ */ a(d, { size: "xs", variant: "ghost", onClick: r, "aria-label": "prev icon", children: /* @__PURE__ */ a(v, {}) }),
+    /* @__PURE__ */ a(d, { size: "xs", variant: "ghost", onClick: n, "aria-label": "next icon", children: /* @__PURE__ */ a(p, {}) })
   ] })
 ] });
 export {

package/dist/components/Datepicker/DatepickerTable.js

@@ -1,34 +1,34 @@
-import { jsxs as u, jsx as t } from "react/jsx-runtime";
-import { ButtonBase as h } from "../Button/ButtonBase.js";
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { Button as h } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DatepickerTable.css';const y = "_table_fmil8_1", b = "_weekday_fmil8_7", _ = "_date_fmil8_13", p = "_button_fmil8_23", a = {
-  table: y,
-  weekday: b,
+import '../../assets/DatepickerTable.css';const u = "_table_ex6ab_1", y = "_weekday_ex6ab_7", _ = "_date_ex6ab_13", p = "_button_ex6ab_23", a = {
+  table: u,
+  weekday: y,
   date: _,
   button: p
-}, j = ({
+}, g = ({
   weekdays: n = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
   rows: d = [],
   onSelect: s
-}) => /* @__PURE__ */ u("table", { className: a.table, children: [
+}) => /* @__PURE__ */ m("table", { className: a.table, children: [
   /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ t("tr", { children: n.map((e) => /* @__PURE__ */ t("th", { className: a.weekday, children: e.substring(0, 2) }, e)) }) }),
-  /* @__PURE__ */ t("tbody", { children: d.map((e, o) => /* @__PURE__ */ t("tr", { children: e.map((l) => {
-    const { day: i, date: r, selected: c, isCurrentMonth: m } = l;
-    return /* @__PURE__ */ t("td", { className: a.date, "data-current-month": m, children: /* @__PURE__ */ t(
+  /* @__PURE__ */ t("tbody", { children: d.map((e, o) => /* @__PURE__ */ t("tr", { children: e.map((c) => {
+    const { day: l, date: r, selected: i, isCurrentMonth: b } = c;
+    return /* @__PURE__ */ t("td", { className: a.date, "data-current-month": b, children: /* @__PURE__ */ t(
       h,
       {
-        variant: "text",
-        selected: c,
+        variant: "ghost",
+        "aria-selected": i,
         className: a.button,
         onClick: () => s(r),
-        children: i
+        children: l
       }
     ) }, r);
   }) }, o)) })
 ] });
 export {
-  j as DatepickerTable
+  g as DatepickerTable
 };

package/dist/components/Dialog/Dialog.js

@@ -1,6 +1,7 @@
 import { jsxs as r, jsx as o, Fragment as f } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { DialogLayout as d } from "./DialogLayout.js";
 import { DialogHeader as j } from "./DialogHeader.js";
@@ -10,7 +11,7 @@ import { DialogContact as H } from "./DialogContact.js";
 import { DialogHistory as h } from "./DialogHistory.js";
 import { Divider as g } from "../Divider/Divider.js";
 import "../Snackbar/useSnackbar.js";
-const E = ({
+const G = ({
   loading: m,
   backButton: l,
   contextMenu: c,
@@ -37,5 +38,5 @@ const E = ({
   ] })
 ] });
 export {
-  E as Dialog
+  G as Dialog
 };

package/dist/components/Dialog/DialogActions.js

@@ -1,55 +1,47 @@
 "use client";
-import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import { useMemo as a } from "react";
+import { jsxs as a, jsx as n } from "react/jsx-runtime";
+import { useMemo as p } from "react";
 import "../../index-p1eeF8LQ.js";
-import { Button as g } from "../Button/Button.js";
-import { ComboButton as C } from "../Button/ComboButton.js";
-import { useRootContext as v } from "../RootProvider/RootProvider.js";
-import { DropdownBase as x } from "../Dropdown/DropdownBase.js";
-import { Menu as B } from "../Menu/Menu.js";
+import { Button as l } from "../Button/Button.js";
+import { ButtonGroup as C } from "../Button/ButtonGroup.js";
+import { ButtonGroupDivider as B } from "../Button/ButtonGroupDivider.js";
+import { useRootContext as _ } from "../RootProvider/RootProvider.js";
+import { DropdownBase as v } from "../Dropdown/DropdownBase.js";
+import { Menu as x } from "../Menu/Menu.js";
 import "../Snackbar/useSnackbar.js";
-import { S as _, a as k } from "../../ChevronUp-_BBfEirx.js";
-import '../../assets/DialogActions.css';const D = "_action_1n930_1", I = "_comboButton_1n930_8", d = {
-  action: D,
-  comboButton: I
-}, U = ({ items: i, maxItems: s = 2, id: l = "dialog-actions", expandAltLabel: p }) => {
-  const { currentId: m, closeAll: u, toggleId: b } = v(), e = m === l, r = a(() => (i || []).filter((o) => !o.hidden).sort((o, n) => {
-    const c = ["primary", "secondary", "tertiary"];
-    return c.indexOf(o?.priority) - c.indexOf(n?.priority);
-  }), [i]), f = a(() => i.find((o) => o.priority === "primary")?.disabled, [i]);
-  if (!r.length || s <= 0)
+import { S as k, a as D } from "../../ChevronUp-_BBfEirx.js";
+import '../../assets/DialogActions.css';const I = "_action_1n930_1", O = "_comboButton_1n930_8", m = {
+  action: I,
+  comboButton: O
+}, F = ({ items: i, maxItems: s = 2, id: d = "dialog-actions", expandAltLabel: u }) => {
+  const { currentId: f, closeAll: h, toggleId: b } = _(), c = f === d, t = p(() => (i || []).filter((o) => !o.hidden).sort((o, r) => {
+    const e = ["primary", "secondary", "tertiary"];
+    return e.indexOf(o?.priority) - e.indexOf(r?.priority);
+  }), [i]), y = p(() => i.find((o) => o.priority === "primary")?.disabled, [i]);
+  if (!t.length || s <= 0)
     return null;
-  if (r.length > s) {
-    const o = r.slice(1).map((n) => ({
-      id: n.id,
-      title: n.label,
-      onClick: n.onClick,
-      group: n.priority,
-      hidden: n.hidden
+  if (t.length > s) {
+    const o = t.slice(1).map((r) => ({
+      id: r.id,
+      title: r.label,
+      onClick: r.onClick,
+      group: r.priority,
+      hidden: r.hidden
     }));
-    return /* @__PURE__ */ y("section", { className: d.comboButton, children: [
-      /* @__PURE__ */ t(
-        C,
-        {
-          variant: "solid",
-          icon: e ? _ : k,
-          size: "md",
-          onIconClick: () => b(l),
-          onLabelClick: r[0].onClick,
-          ariaLabel: e ? "chevron up icon" : "chevron down icon",
-          iconAltText: p,
-          disabled: f,
-          children: r[0].label
-        }
-      ),
-      e && /* @__PURE__ */ t(x, { open: e, onClose: u, children: /* @__PURE__ */ t(B, { items: o }) })
+    return /* @__PURE__ */ a("section", { className: m.comboButton, children: [
+      /* @__PURE__ */ a(C, { connected: !0, size: "md", children: [
+        /* @__PURE__ */ n(l, { disabled: y, onClick: t[0].onClick, children: t[0].label }),
+        /* @__PURE__ */ n(B, {}),
+        /* @__PURE__ */ n(l, { "aria-label": u, onClick: () => b(d), children: c ? /* @__PURE__ */ n(k, {}) : /* @__PURE__ */ n(D, {}) })
+      ] }),
+      c && /* @__PURE__ */ n(v, { open: c, onClose: h, children: /* @__PURE__ */ n(x, { items: o }) })
     ] });
   }
-  return /* @__PURE__ */ t("section", { className: d.action, children: r.map((o, n) => {
-    const { priority: c, id: w, ...h } = o;
-    return /* @__PURE__ */ t(g, { variant: c === "primary" ? "solid" : "outline", size: "md", ...h, children: o.label }, "button-" + n);
+  return /* @__PURE__ */ n("section", { className: m.action, children: t.map((o, r) => {
+    const { priority: e, id: S, ...g } = o;
+    return /* @__PURE__ */ n(l, { variant: e === "primary" ? "solid" : "outline", size: "md", ...g, children: o.label }, "button-" + r);
   }) });
 };
 export {
-  U as DialogActions
+  F as DialogActions
 };

package/dist/components/Dialog/DialogActivityLog.js

@@ -1,16 +1,17 @@
 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 "../Snackbar/useSnackbar.js";
 import { ActivityLog as a } from "../ActivityLog/ActivityLog.js";
 import { ModalBase as d } from "../Modal/ModalBase.js";
 import { ModalHeader as e } from "../Modal/ModalHeader.js";
 import { ModalBody as c } from "../Modal/ModalBody.js";
-const h = ({ title: t, items: i, open: m, onClose: r }) => /* @__PURE__ */ p(d, { open: m, onClose: r, variant: "content", children: [
+const j = ({ title: t, items: i, open: m, onClose: r }) => /* @__PURE__ */ p(d, { open: m, onClose: r, variant: "content", children: [
   /* @__PURE__ */ o(e, { title: t, onClose: r }),
   /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o(a, { items: i }) })
 ] });
 export {
-  h as DialogActivityLog
+  j as DialogActivityLog
 };

package/dist/components/Dialog/DialogAttachments.js

@@ -3,13 +3,14 @@ import "../../index-p1eeF8LQ.js";
 import "react";
 import { AttachmentList as m } from "../Attachment/AttachmentList.js";
 import { Heading as n } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as e } from "../Page/Section.js";
-const u = ({ title: i = "Attachments", items: t }) => t?.length ? /* @__PURE__ */ o(e, { spacing: 1, children: [
+const x = ({ title: i = "Attachments", items: t }) => t?.length ? /* @__PURE__ */ o(e, { spacing: 1, children: [
   /* @__PURE__ */ r(n, { as: "h2", size: "xs", weight: "normal", variant: "subtle", children: i }),
   /* @__PURE__ */ r(m, { items: t })
 ] }) : null;
 export {
-  u as DialogAttachments
+  x as DialogAttachments
 };

package/dist/components/Dialog/DialogBody.js

@@ -2,13 +2,14 @@ import { jsxs as i, jsx as o, Fragment as c } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Typography as a } from "../Typography/Typography.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { Timeline as h } from "../Timeline/Timeline.js";
 import { TimelineSection as f } from "../Timeline/TimelineSection.js";
 import { TimelineHeader as s } from "../Timeline/TimelineHeader.js";
 import { SeenByLog as d } from "./SeenByLog.js";
 import "../Snackbar/useSnackbar.js";
-const D = ({
+const F = ({
   loading: r = !1,
   unread: t,
   sender: m,
@@ -27,5 +28,5 @@ const D = ({
   ] }) })
 ] });
 export {
-  D as DialogBody
+  F as DialogBody
 };

package/dist/components/Dialog/DialogByline.js

@@ -1,10 +1,11 @@
 import { jsxs as i, jsx as p } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import { Byline as s } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-const y = ({
+const B = ({
   sender: o,
   recipient: r,
   recipientLabel: a = "to",
@@ -19,5 +20,5 @@ const y = ({
   r && a + " " + r?.name
 ] });
 export {
-  y as DialogByline
+  B as DialogByline
 };

package/dist/components/Dialog/DialogContact.js

@@ -3,15 +3,16 @@ import "../../index-p1eeF8LQ.js";
 import "react";
 import { Typography as n } from "../Typography/Typography.js";
 import { Heading as c } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as a } from "../Page/Section.js";
 import { ContactButtons as s } from "../Page/ContactButtons.js";
-const y = ({ id: t = "dialog-contact", title: r, children: i, items: m = [] }) => /* @__PURE__ */ p(a, { spacing: 4, id: t, children: [
+const C = ({ id: t = "dialog-contact", title: r, children: i, items: m = [] }) => /* @__PURE__ */ p(a, { spacing: 4, id: t, children: [
   r && /* @__PURE__ */ o(c, { size: "lg", children: r }),
   /* @__PURE__ */ o(n, { children: i }),
   /* @__PURE__ */ o(s, { items: m })
 ] });
 export {
-  y as DialogContact
+  C as DialogContact
 };

package/dist/components/Dialog/DialogHeader.js

@@ -4,18 +4,19 @@ import "../../index-p1eeF8LQ.js";
 import "react";
 import { Skeleton as j } from "../Skeleton/Skeleton.js";
 import { Heading as D } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { DialogMetadata as H } from "./DialogMetadata.js";
 import "../Snackbar/useSnackbar.js";
 import { Flex as S } from "../Page/Flex.js";
 import { Section as k } from "../Page/Section.js";
-const E = ({
+const G = ({
   loading: i,
   title: e,
   badge: o,
   status: m,
-  extendedStatusLabel: n,
-  draftsLabel: p,
+  extendedStatusLabel: p,
+  draftsLabel: n,
   sentCount: a,
   receivedCount: l,
   updatedAt: c,
@@ -34,8 +35,8 @@ const E = ({
     {
       loading: i,
       status: m,
-      extendedStatusLabel: n,
-      draftsLabel: p,
+      extendedStatusLabel: p,
+      draftsLabel: n,
       sentCount: a,
       receivedCount: l,
       updatedAt: c,
@@ -48,5 +49,5 @@ const E = ({
   )
 ] });
 export {
-  E as DialogHeader
+  G as DialogHeader
 };

package/dist/components/Dialog/DialogHistoryItem.js

@@ -2,10 +2,11 @@ import { jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Typography as f } from "../Typography/Typography.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { TimelineActivity as p } from "../Timeline/TimelineActivity.js";
-const u = ({ byline: o, datetime: i, children: t, summary: e, ...m }) => t ? /* @__PURE__ */ r(p, { byline: o, datetime: i, ...m, children: t }) : /* @__PURE__ */ r(p, { byline: o, datetime: i, ...m, children: /* @__PURE__ */ r(f, { children: e }) });
+const x = ({ byline: o, datetime: i, children: t, summary: e, ...m }) => t ? /* @__PURE__ */ r(p, { byline: o, datetime: i, ...m, children: t }) : /* @__PURE__ */ r(p, { byline: o, datetime: i, ...m, children: /* @__PURE__ */ r(f, { children: e }) });
 export {
-  u as DialogHistoryItem
+  x as DialogHistoryItem
 };