@altinn/altinn-components 0.58.0 → 0.58.2

package/dist/components/ContextMenu/ContextMenu.js

@@ -1,9 +1,10 @@
 "use client";
 import { jsx as a } from "react/jsx-runtime";
-import u, { forwardRef as m, useMemo as f } from "react";
+import u, { forwardRef as c, useMemo as f } from "react";
 import { Button as g } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
-import { x as h, g as x, M as b } from "../../Section-DPj8jAL1.js";
+import { x as h, g as x, M as b } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import { Tooltip as v } from "../Tooltip/Tooltip.js";
 import "../Snackbar/useSnackbar.js";
 import { useDropdownMenuController as y } from "../Menu/useDropdownMenuController.js";
@@ -16,7 +17,7 @@ var w = function(t, l) {
       l.indexOf(e[o]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[o]) && (r[e[o]] = t[e[o]]);
   return r;
 };
-const C = m((t, l) => {
+const C = c((t, l) => {
   var { title: r, titleId: e } = t, o = w(t, ["title", "titleId"]);
   let i = O();
   return i = r ? e || "title-" + i : void 0, u.createElement(
@@ -25,16 +26,16 @@ const C = m((t, l) => {
     r ? u.createElement("title", { id: i }, r) : null,
     u.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" })
   );
-}), z = ({
+}), A = ({
   groups: t = {},
   items: l,
   title: r,
   color: e,
   id: o = "context-menu",
   placement: i = "right",
-  "aria-label": d
+  "aria-label": p
 }) => {
-  const n = y({ id: o, returnFocusOnClose: !0 }), { languageCode: p } = h(), c = f(() => l.map((s) => ({
+  const n = y({ id: o, returnFocusOnClose: !0 }), { languageCode: d } = h(), m = f(() => l.map((s) => ({
     ...s,
     onClick: () => {
       n.setOpen(!1), s.onClick?.();
@@ -45,7 +46,7 @@ const C = m((t, l) => {
     {
       backdrop: !1,
       color: e,
-      trigger: /* @__PURE__ */ a(() => /* @__PURE__ */ a(v, { content: r || M(p).title, hidden: n.open, children: /* @__PURE__ */ a(
+      trigger: /* @__PURE__ */ a(() => /* @__PURE__ */ a(v, { content: r || M(d).title, hidden: n.open, children: /* @__PURE__ */ a(
         g,
         {
           ref: n.triggerRef,
@@ -53,7 +54,7 @@ const C = m((t, l) => {
           variant: "ghost",
           rounded: !0,
           size: "xs",
-          "aria-label": d,
+          "aria-label": p,
           onClick: () => n.toggleMenu(),
           "aria-haspopup": "menu",
           "aria-expanded": n.open,
@@ -68,7 +69,7 @@ const C = m((t, l) => {
       placement: i,
       useFixedPosition: !0,
       ...n.dropdownA11yProps,
-      children: /* @__PURE__ */ a(b, { groups: t, items: c, maxLevels: 1, keyboardEvents: n.open, ...n.menuA11yProps })
+      children: /* @__PURE__ */ a(b, { groups: t, items: m, maxLevels: 1, keyboardEvents: n.open, ...n.menuA11yProps })
     }
   );
 }, M = (t) => {
@@ -88,5 +89,5 @@ const C = m((t, l) => {
   }
 };
 export {
-  z as ContextMenu
+  A as ContextMenu
 };

package/dist/components/Dashboard/DashboardCard.js

@@ -2,8 +2,9 @@
 import { jsx as t, jsxs as f } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import { forwardRef as p, useRef as g, useEffect as B } from "react";
-import { h as R, H as _ } from "../../Section-DPj8jAL1.js";
+import { h as R, H as _ } from "../../Section-DvBigBR1.js";
 import { Typography as w } from "../Typography/Typography.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
@@ -13,11 +14,11 @@ import { u as N } from "../../use-merge-refs-Cj4kTYVj.js";
 import '../../assets/DashboardCard.css';const b = p(function({ asChild: n = !1, variant: e = "default", className: r, ...o }, c) {
   const s = n ? u : "div", a = g(null), k = N([a, c]);
   return B(() => {
-    const d = a.current, m = ({ ctrlKey: v, metaKey: x, target: y }) => {
-      const i = d?.querySelector(":is(h1,h2,h3,h4,h5,h6) a");
+    const m = a.current, d = ({ ctrlKey: v, metaKey: x, target: y }) => {
+      const i = m?.querySelector(":is(h1,h2,h3,h4,h5,h6) a");
       !i || i?.contains(y) || (v || x ? window.open(i.href, "", "noreferrer") : i.click());
     };
-    return d?.addEventListener("click", m), () => d?.removeEventListener("click", m);
+    return m?.addEventListener("click", d), () => m?.removeEventListener("click", d);
   }, []), t(s, { className: h("ds-card", r), "data-variant": e, ref: k, ...o });
 }), j = p(function({ asChild: n, className: e, ...r }, o) {
   return t(n ? u : "div", { className: h("ds-card__block", e), ref: o, ...r });
@@ -28,7 +29,7 @@ C.Block.displayName = "Card.Block";
 const E = "_icon_112og_1", S = {
   icon: E
 };
-function F({
+function J({
   color: l,
   theme: n = "tinted",
   icon: e,
@@ -58,5 +59,5 @@ function F({
   ] });
 }
 export {
-  F as DashboardCard
+  J as DashboardCard
 };

package/dist/components/Dashboard/DashboardHeader.js

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

package/dist/components/Datepicker/Datepicker.js

@@ -2,7 +2,7 @@
 import { jsxs as h, jsx as a } from "react/jsx-runtime";
 import { c as f } from "../../index-p1eeF8LQ.js";
 import { useState as x } from "react";
-import { x as J } from "../../Section-DPj8jAL1.js";
+import { x as J } from "../../Section-DvBigBR1.js";
 import { DatepickerHeader as v } from "./DatepickerHeader.js";
 import { DatepickerTable as D } from "./DatepickerTable.js";
 import { useDatepicker as M } from "./useDatepicker.js";

package/dist/components/Datepicker/DatepickerHeader.js

@@ -3,7 +3,8 @@ import { jsxs as s, jsx as i } from "react/jsx-runtime";
 import { Button as d } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
 import a, { forwardRef as f } from "react";
-import { N as m } from "../../Section-DPj8jAL1.js";
+import { N as m } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
 import { u as p } from "../../useId-BVFxCjkq.js";
@@ -28,7 +29,7 @@ const u = f((t, n) => {
   header: v,
   title: _,
   nav: g
-}, R = ({ title: t, onNext: n, onPrev: r }) => /* @__PURE__ */ s("header", { className: c.header, children: [
+}, E = ({ title: t, onNext: n, onPrev: r }) => /* @__PURE__ */ s("header", { className: c.header, children: [
   /* @__PURE__ */ i("h2", { className: c.title, children: t }),
   /* @__PURE__ */ s("nav", { className: c.nav, children: [
     /* @__PURE__ */ i(d, { icon: !0, size: "xs", variant: "ghost", onClick: r, "aria-label": "prev icon", children: /* @__PURE__ */ i(u, {}) }),
@@ -36,5 +37,5 @@ const u = f((t, n) => {
   ] })
 ] });
 export {
-  R as DatepickerHeader
+  E as DatepickerHeader
 };

package/dist/components/Datepicker/DatepickerTable.js

@@ -2,21 +2,22 @@ import { jsxs as b, jsx as t } from "react/jsx-runtime";
 import { Button as h } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import "../../Section-DPj8jAL1.js";
+import "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DatepickerTable.css';const u = "_table_1k8nb_1", y = "_weekday_1k8nb_7", p = "_date_1k8nb_13", _ = "_button_1k8nb_23", a = {
+import '../../assets/DatepickerTable.css';const u = "_table_1k8nb_1", p = "_weekday_1k8nb_7", y = "_date_1k8nb_13", _ = "_button_1k8nb_23", a = {
   table: u,
-  weekday: y,
-  date: p,
+  weekday: p,
+  date: y,
   button: _
-}, j = ({
+}, C = ({
   weekdays: r = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
   rows: d = [],
-  onSelect: s
+  onSelect: o
 }) => /* @__PURE__ */ b("table", { className: a.table, children: [
   /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ t("tr", { children: r.map((e) => /* @__PURE__ */ t("th", { className: a.weekday, children: e.substring(0, 3) }, e)) }) }),
-  /* @__PURE__ */ t("tbody", { children: d.map((e, o) => /* @__PURE__ */ t("tr", { children: e.map((c) => {
+  /* @__PURE__ */ t("tbody", { children: d.map((e, s) => /* @__PURE__ */ t("tr", { children: e.map((c) => {
     const { day: i, date: n, selected: l, isCurrentMonth: m } = c;
     return /* @__PURE__ */ t("td", { className: a.date, "data-current-month": m, children: /* @__PURE__ */ t(
       h,
@@ -24,12 +25,12 @@ import '../../assets/DatepickerTable.css';const u = "_table_1k8nb_1", y = "_week
         variant: "ghost",
         "aria-selected": l,
         className: a.button,
-        onClick: () => s(n),
+        onClick: () => o(n),
         children: i
       }
     ) }, n);
-  }) }, o)) })
+  }) }, s)) })
 ] });
 export {
-  j as DatepickerTable
+  C as DatepickerTable
 };

package/dist/components/Dialog/Dialog.js

@@ -1,42 +1,36 @@
-import { jsxs as r, jsx as o, Fragment as f } from "react/jsx-runtime";
+import { jsxs as x, jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import "../../Section-DPj8jAL1.js";
+import "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
-import { DialogLayout as d } from "./DialogLayout.js";
-import { DialogHeader as j } from "./DialogHeader.js";
-import { DialogBody as u } from "./DialogBody.js";
-import { DialogSection as y } from "./DialogSection.js";
-import { DialogContact as H } from "./DialogContact.js";
-import { DialogHistory as h } from "./DialogHistory.js";
-import { Divider as g } from "../Divider/Divider.js";
+import { DialogLayout as j } from "./DialogLayout.js";
+import { DialogHeader as u } from "./DialogHeader.js";
+import { DialogBody as y } from "./DialogBody.js";
+import { DialogSection as H } from "./DialogSection.js";
+import { DialogContact as c } from "./DialogContact.js";
+import { DialogHistory as B } from "./DialogHistory.js";
 import "../Snackbar/useSnackbar.js";
 const J = ({
-  loading: m,
-  backButton: l,
-  contextMenu: c,
-  pageMenu: n,
-  sender: s,
-  title: i,
-  history: t,
-  additionalInfo: p,
-  seenByLog: x,
-  contact: e,
+  loading: r,
+  backButton: f,
+  contextMenu: g,
+  pageMenu: e,
+  sender: l,
+  title: m,
+  history: i,
+  additionalInfo: t,
+  seenByLog: s,
+  contact: p,
   children: D,
   ...a
-}) => /* @__PURE__ */ r(d, { backButton: l, contextMenu: c, pageMenu: n, children: [
-  i && /* @__PURE__ */ o(j, { loading: m, ...a, title: i }),
-  D && /* @__PURE__ */ o(u, { loading: m, sender: s, seenByLog: x, ...a, children: D }),
-  t && /* @__PURE__ */ o(h, { ...t }),
-  p && /* @__PURE__ */ r(f, { children: [
-    /* @__PURE__ */ o(g, {}),
-    /* @__PURE__ */ o(y, { ...p })
-  ] }),
-  e && /* @__PURE__ */ r(f, { children: [
-    /* @__PURE__ */ o(g, {}),
-    /* @__PURE__ */ o(H, { ...e })
-  ] })
+}) => /* @__PURE__ */ x(j, { backButton: f, contextMenu: g, pageMenu: e, children: [
+  m && /* @__PURE__ */ o(u, { loading: r, ...a, title: m }),
+  D && /* @__PURE__ */ o(y, { loading: r, sender: l, seenByLog: s, ...a, children: D }),
+  i && /* @__PURE__ */ o(B, { ...i }),
+  t && /* @__PURE__ */ o(H, { ...t }),
+  p && /* @__PURE__ */ o(c, { ...p })
 ] });
 export {
   J as Dialog

package/dist/components/Dialog/DialogActions.js

@@ -2,7 +2,8 @@
 import { jsxs as p, jsx as n } from "react/jsx-runtime";
 import { useMemo as u } from "react";
 import "../../index-p1eeF8LQ.js";
-import { x as g, J as x, K as B, M as k } from "../../Section-DPj8jAL1.js";
+import { x as g, J as x, K as B, M as k } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import { DropdownBase as _ } from "../Dropdown/DropdownBase.js";
 import { Button as s } from "../Button/Button.js";
 import { ButtonGroup as v } from "../Button/ButtonGroup.js";
@@ -12,7 +13,7 @@ import "../Snackbar/useSnackbar.js";
 import '../../assets/DialogActions.css';const I = "_action_1n930_1", M = "_comboButton_1n930_8", m = {
   action: I,
   comboButton: M
-}, U = ({ items: i, maxItems: a = 2, id: l = "dialog-actions", expandAltLabel: f }) => {
+}, q = ({ items: i, maxItems: a = 2, id: l = "dialog-actions", expandAltLabel: f }) => {
   const { currentId: h, closeAll: b, toggleId: d } = g(), e = h === l, t = u(() => (i || []).filter((o) => !o.hidden).sort((o, r) => {
     const c = ["primary", "secondary", "tertiary"];
     return c.indexOf(o?.priority) - c.indexOf(r?.priority);
@@ -47,5 +48,5 @@ import '../../assets/DialogActions.css';const I = "_action_1n930_1", M = "_combo
   }) });
 };
 export {
-  U as DialogActions
+  q as DialogActions
 };

package/dist/components/Dialog/DialogActivityLog.js

@@ -1,7 +1,8 @@
 import { jsxs as p, jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import "../../Section-DPj8jAL1.js";
+import "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
@@ -9,10 +10,10 @@ 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 A = ({ title: t, items: i, open: m, onClose: r }) => /* @__PURE__ */ p(d, { open: m, onClose: r, variant: "content", children: [
+const B = ({ 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 {
-  A as DialogActivityLog
+  B as DialogActivityLog
 };

package/dist/components/Dialog/DialogAttachments.js

@@ -1,15 +1,16 @@
 import { jsxs as o, jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
-import { AttachmentList as n } from "../Attachment/AttachmentList.js";
+import { AttachmentList as m } from "../Attachment/AttachmentList.js";
 import "react";
-import { S as m, H as e } from "../../Section-DPj8jAL1.js";
+import { S as n, H as e } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-const u = ({ title: i = "Attachments", items: t }) => t?.length ? /* @__PURE__ */ o(m, { spacing: 1, children: [
+const x = ({ title: i = "Attachments", items: t }) => t?.length ? /* @__PURE__ */ o(n, { spacing: 1, children: [
   /* @__PURE__ */ r(e, { as: "h2", size: "xs", weight: "normal", variant: "subtle", children: i }),
-  /* @__PURE__ */ r(n, { items: t })
+  /* @__PURE__ */ r(m, { items: t })
 ] }) : null;
 export {
-  u as DialogAttachments
+  x as DialogAttachments
 };

package/dist/components/Dialog/DialogBody.js

@@ -1,8 +1,9 @@
 import { jsxs as i, jsx as o, Fragment as c } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import "../../Section-DPj8jAL1.js";
+import "../../Section-DvBigBR1.js";
 import { Typography as a } from "../Typography/Typography.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import { Timeline as h } from "../Timeline/Timeline.js";
@@ -10,24 +11,24 @@ 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 H = ({
+const W = ({
   loading: r = !1,
-  unread: t,
+  unread: e,
   sender: m,
   recipient: p,
   recipientLabel: n = "to",
   children: l,
-  seenByLog: e
+  seenByLog: t
 }) => /* @__PURE__ */ i(h, { children: [
   /* @__PURE__ */ i(s, { loading: r, icon: m, children: [
     /* @__PURE__ */ o("strong", { children: m?.name }),
     n + " " + p?.name
   ] }),
-  /* @__PURE__ */ o(f, { unread: t, loading: r, spacing: 4, color: r ? "neutral" : void 0, children: !r && /* @__PURE__ */ i(c, { children: [
+  /* @__PURE__ */ o(f, { unread: e, loading: r, spacing: 4, color: r ? "neutral" : void 0, children: !r && /* @__PURE__ */ i(c, { children: [
     /* @__PURE__ */ o(a, { maxWidth: "60ch", style: { marginTop: "0.5em" }, children: l }),
-    e && /* @__PURE__ */ o(d, { ...e, collapsible: !0 })
+    t && /* @__PURE__ */ o(d, { ...t, collapsible: !0 })
   ] }) })
 ] });
 export {
-  H as DialogBody
+  W as DialogBody
 };

package/dist/components/Dialog/DialogByline.js

@@ -1,10 +1,11 @@
 import "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { d as l } from "../../Section-DPj8jAL1.js";
+import { d } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
 export {
-  l as DialogByline
+  d as DialogByline
 };

package/dist/components/Dialog/DialogContact.js

@@ -1,17 +1,53 @@
-import { jsxs as p, jsx as o } from "react/jsx-runtime";
+"use client";
+import { jsxs as a, jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
-import "react";
-import { S as n, H as a } from "../../Section-DPj8jAL1.js";
-import { Typography as c } from "../Typography/Typography.js";
-import "../Button/Button.js";
+import c, { forwardRef as g } from "react";
+import { H as y } from "../../Section-DvBigBR1.js";
+import { Typography as s } from "../Typography/Typography.js";
+import { Link as v } from "../Typography/Link.js";
+import { Button as _ } from "../Button/Button.js";
+import { ButtonGroup as b } from "../Button/ButtonGroup.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-import { ContactButtons as s } from "../Page/ContactButtons.js";
-const y = ({ id: t = "dialog-contact", title: r, children: i, items: m = [] }) => /* @__PURE__ */ p(n, { spacing: 4, id: t, children: [
-  r && /* @__PURE__ */ o(a, { size: "lg", children: r }),
-  /* @__PURE__ */ o(c, { children: i }),
-  /* @__PURE__ */ o(s, { items: m })
+import { u as w } from "../../useId-BVFxCjkq.js";
+import '../../assets/DialogContact.css';var I = function(r, l) {
+  var o = {};
+  for (var e in r) Object.prototype.hasOwnProperty.call(r, e) && l.indexOf(e) < 0 && (o[e] = r[e]);
+  if (r != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var t = 0, e = Object.getOwnPropertySymbols(r); t < e.length; t++)
+      l.indexOf(e[t]) < 0 && Object.prototype.propertyIsEnumerable.call(r, e[t]) && (o[e[t]] = r[e[t]]);
+  return o;
+};
+const O = g((r, l) => {
+  var { title: o, titleId: e } = r, t = I(r, ["title", "titleId"]);
+  let n = w();
+  return n = o ? e || "title-" + n : void 0, c.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": n }, t),
+    o ? c.createElement("title", { id: n }, o) : null,
+    c.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12 21.75c5.385 0 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25 2.25 6.615 2.25 12s4.365 9.75 9.75 9.75m0-14a1.75 1.75 0 0 0-1.75 1.75.75.75 0 0 1-1.5 0A3.25 3.25 0 0 1 12 6.25h.136a3.114 3.114 0 0 1 1.945 5.545l-.441.354A2.37 2.37 0 0 0 12.75 14a.75.75 0 0 1-1.5 0 3.87 3.87 0 0 1 1.453-3.023l.441-.353a1.614 1.614 0 0 0-1.008-2.874zm-.95 9.15a.95.95 0 1 1 1.9 0 .95.95 0 0 1-1.9 0", clipRule: "evenodd" })
+  );
+}), j = "_section_ln3o5_1", x = "_helpIcon_ln3o5_7", m = {
+  section: j,
+  helpIcon: x
+}, D = ({
+  id: r = "dialog-contact",
+  title: l,
+  children: o,
+  buttons: e = [],
+  helpLink: t
+}) => /* @__PURE__ */ a("section", { className: m.section, id: r, children: [
+  l && /* @__PURE__ */ i(y, { size: "lg", children: l }),
+  /* @__PURE__ */ i(s, { size: "sm", children: o }),
+  e && /* @__PURE__ */ i(b, { children: e.map((n, f) => {
+    const { as: d, href: p, onClick: u, label: h } = n;
+    return /* @__PURE__ */ i(_, { as: d, href: p, onClick: u, variant: "outline", children: h }, f);
+  }) }),
+  t && /* @__PURE__ */ i(s, { size: "sm", children: /* @__PURE__ */ a(v, { as: t.as, href: t.href, onClick: t.onClick, children: [
+    /* @__PURE__ */ i(O, { className: m.helpIcon }),
+    t.children
+  ] }) })
 ] });
 export {
-  y as DialogContact
+  D as DialogContact
 };

package/dist/components/Dialog/DialogHeader.js

@@ -1,52 +1,55 @@
-import { jsxs as t, jsx as o } from "react/jsx-runtime";
-import { Badge as H } from "../Badge/Badge.js";
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { Badge as _ } from "../Badge/Badge.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { S as j, H as D, c as S } from "../../Section-DPj8jAL1.js";
+import { H as j, c as D } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
-const y = ({
-  loading: i,
+import '../../assets/DialogHeader.css';const g = "_header_14m6v_1", u = {
+  header: g
+}, A = ({
+  loading: e,
   title: a,
   badge: r,
-  status: e,
+  status: i,
   extendedStatusLabel: m,
   draftsLabel: s,
   sentCount: p,
-  receivedCount: n,
+  receivedCount: d,
   updatedAt: c,
-  updatedAtLabel: l,
-  attachmentsCount: d,
-  dueAt: x,
-  dueAtLabel: f,
-  activityLog: g,
-  tooltips: h = {}
-}) => /* @__PURE__ */ t(j, { as: "header", spacing: 3, align: "start", children: [
-  /* @__PURE__ */ t(D, { loading: i, size: "xl", children: [
+  updatedAtLabel: h,
+  attachmentsCount: l,
+  dueAt: n,
+  dueAtLabel: x,
+  activityLog: f,
+  tooltips: H = {}
+}) => /* @__PURE__ */ o("header", { className: u.header, children: [
+  /* @__PURE__ */ o(j, { loading: e, size: "xl", children: [
     a,
     r && " ",
-    r && /* @__PURE__ */ o(H, { ...r })
+    r && /* @__PURE__ */ t(_, { ...r })
   ] }),
-  /* @__PURE__ */ o(
-    S,
+  /* @__PURE__ */ t(
+    D,
     {
-      loading: i,
-      status: e,
+      loading: e,
+      status: i,
       extendedStatusLabel: m,
       draftsLabel: s,
       sentCount: p,
-      receivedCount: n,
+      receivedCount: d,
       updatedAt: c,
-      updatedAtLabel: l,
-      dueAt: x,
-      dueAtLabel: f,
-      attachmentsCount: d,
-      activityLog: g,
-      tooltips: h
+      updatedAtLabel: h,
+      dueAt: n,
+      dueAtLabel: x,
+      attachmentsCount: l,
+      activityLog: f,
+      tooltips: H
     }
   )
 ] });
 export {
-  y as DialogHeader
+  A as DialogHeader
 };

package/dist/components/Dialog/DialogHistory.js

@@ -2,13 +2,14 @@
 import { jsxs as g, jsx as n } from "react/jsx-runtime";
 import { useState as f, createElement as u } from "react";
 import "../../index-p1eeF8LQ.js";
-import { S as h } from "../../Section-DPj8jAL1.js";
+import { S as h } from "../../Section-DvBigBR1.js";
+import "../Typography/Link.js";
 import { Button as y } from "../Button/Button.js";
 import "react-dom";
 import { DialogHistorySegment as S } from "./DialogHistorySegment.js";
 import { Timeline as x } from "../Timeline/Timeline.js";
 import "../Snackbar/useSnackbar.js";
-const b = ({
+const q = ({
   items: o,
   maxItems: t,
   expandLabel: i = "Expand history",
@@ -18,12 +19,12 @@ const b = ({
     return null;
   const [e, p] = f(!1), s = () => {
     p((r) => !r);
-  }, c = t ? o.slice(0, t) : o, a = e ? o : c, d = t && o.length > t;
+  }, c = t ? o.slice(0, t) : o, a = e ? o : c, m = t && o.length > t;
   return /* @__PURE__ */ g(h, { spacing: 4, children: [
-    /* @__PURE__ */ n(x, { children: a.map((r, m) => /* @__PURE__ */ u(S, { ...r, key: m })) }),
-    d && /* @__PURE__ */ n(y, { variant: "outline", onClick: s, children: e ? l : i })
+    /* @__PURE__ */ n(x, { children: a.map((r, d) => /* @__PURE__ */ u(S, { ...r, key: d })) }),
+    m && /* @__PURE__ */ n(y, { variant: "outline", onClick: s, children: e ? l : i })
   ] });
 };
 export {
-  b as DialogHistory
+  q as DialogHistory
 };

package/dist/components/Dialog/DialogHistoryItem.js

@@ -1,13 +1,14 @@
 import { jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import "../../Section-DPj8jAL1.js";
+import "../../Section-DvBigBR1.js";
 import { Typography as f } from "../Typography/Typography.js";
+import "../Typography/Link.js";
 import "../Button/Button.js";
 import "react-dom";
 import "../Snackbar/useSnackbar.js";
 import { TimelineActivity as p } from "../Timeline/TimelineActivity.js";
-const T = ({ 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 a = ({ 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 {
-  T as DialogHistoryItem
+  a as DialogHistoryItem
 };