@altinn/altinn-components 0.15.4 → 0.16.0

package/dist/components/Dialog/DialogHeading.js

@@ -1,19 +1,18 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import { Skeleton as l } from "../Skeleton/Skeleton.js";
 import { DialogLabel as d } from "./DialogLabel.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DialogHeading.css';const p = "_heading_rx9gi_1", c = "_title_rx9gi_7", o = {
+import '../../assets/DialogHeading.css';const p = "_heading_rx9gi_1", c = "_title_rx9gi_7", s = {
   heading: p,
   title: c
-}, N = ({ loading: i, size: s = "sm", seen: a = !1, state: e, label: r, children: m }) => /* @__PURE__ */ n("div", { className: o.heading, children: [
-  /* @__PURE__ */ t(l, { loading: i, children: /* @__PURE__ */ t("h2", { className: o.title, "data-seen": a, "data-size": s, "data-state": e, children: m }) }),
+}, D = ({ loading: i, size: o = "sm", seen: a = !1, state: e, label: r, children: m }) => /* @__PURE__ */ n("div", { className: s.heading, children: [
+  /* @__PURE__ */ t(l, { loading: i, children: /* @__PURE__ */ t("h2", { className: s.title, "data-seen": a, "data-size": o, "data-state": e, children: m }) }),
   !i && r && /* @__PURE__ */ t(d, { type: e, size: "xs", children: r })
 ] });
 export {
-  N as DialogHeading
+  D as DialogHeading
 };

package/dist/components/Dialog/DialogHistory.js

@@ -1,44 +1,80 @@
 "use client";
-import { jsxs as m, jsx as e } from "react/jsx-runtime";
-import { useState as g, createElement as u } from "react";
-import { Icon as f } from "../Icon/Icon.js";
-import "../Icon/SvgIcon.js";
+import { jsxs as d, jsx as a } from "react/jsx-runtime";
+import * as i from "react";
+import { forwardRef as p, useState as y, createElement as h } from "react";
+import { Icon as w } from "../Icon/Icon.js";
 import "../../index-L8X2o7IH.js";
-import { ButtonBase as h } from "../Button/ButtonBase.js";
+import { ButtonBase as b } from "../Button/ButtonBase.js";
 import "../RootProvider/RootProvider.js";
-import { ActivityItem as x } from "./ActivityItem.js";
+import { ActivityItem as v } from "./ActivityItem.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import { TimelineBase as l } from "../Timeline/TimelineBase.js";
-import { TimelineSection as y } from "../Timeline/TimelineSection.js";
-import '../../assets/DialogHistory.css';const B = "_toggle_1it16_1", T = {
-  toggle: B
-}, s = ({ expanded: t, children: o, onClick: r }) => /* @__PURE__ */ m(
-  h,
+import { TimelineBase as m } from "../Timeline/TimelineBase.js";
+import { TimelineSection as O } from "../Timeline/TimelineSection.js";
+import { u } from "../../useId-CsCRkvK3.js";
+import '../../assets/DialogHistory.css';var x = function(t, n) {
+  var r = {};
+  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 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 I = p((t, n) => {
+  var { title: r, titleId: e } = t, l = x(t, ["title", "titleId"]);
+  let o = u();
+  return o = r ? e || "title-" + o : void 0, i.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: n, "aria-labelledby": o }, l),
+    r ? i.createElement("title", { id: o }, r) : null,
+    i.createElement("path", { fill: "currentColor", d: "M12.75 5a.75.75 0 0 0-1.5 0v12.19l-3.22-3.22a.75.75 0 0 0-1.06 1.06l4.5 4.5a.75.75 0 0 0 1.06 0l4.5-4.5a.75.75 0 1 0-1.06-1.06l-3.22 3.22z" })
+  );
+});
+var j = function(t, n) {
+  var r = {};
+  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 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 E = p((t, n) => {
+  var { title: r, titleId: e } = t, l = j(t, ["title", "titleId"]);
+  let o = u();
+  return o = r ? e || "title-" + o : void 0, i.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: n, "aria-labelledby": o }, l),
+    r ? i.createElement("title", { id: o }, r) : null,
+    i.createElement("path", { fill: "currentColor", d: "M12.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22V19a.75.75 0 0 0 1.5 0V6.81l3.22 3.22a.75.75 0 1 0 1.06-1.06z" })
+  );
+}), _ = "_toggle_1it16_1", S = {
+  toggle: _
+}, s = ({ expanded: t, children: n, onClick: r }) => /* @__PURE__ */ d(
+  b,
   {
-    className: T.toggle,
+    className: S.toggle,
     size: "sm",
     onClick: r,
     style: { display: "inline-flex", alignItems: "center" },
     children: [
-      o,
-      /* @__PURE__ */ e(f, { name: t ? "arrow-up" : "arrow-down", size: "sm" })
+      n,
+      /* @__PURE__ */ a(w, { svgElement: t ? E : I, size: "sm" })
     ]
   }
-), H = ({
+), N = ({
   items: t,
-  collapsible: o = !1,
+  collapsible: n = !1,
   expandLabel: r = "Expand history",
-  collapseLabel: c = "Collapse history"
+  collapseLabel: e = "Collapse history"
 }) => {
-  const [a, p] = g(!1), i = () => {
-    p((n) => !n);
+  const [l, o] = y(!1), f = () => {
+    o((c) => !c);
   };
-  return t ? a || !o ? /* @__PURE__ */ m(l, { children: [
-    t.map((n, d) => /* @__PURE__ */ u(x, { ...n, key: d })),
-    o && /* @__PURE__ */ e(s, { expanded: !0, onClick: i, children: c })
-  ] }) : /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(y, { color: "neutral", children: /* @__PURE__ */ e(s, { onClick: i, children: r }) }) }) : null;
+  return t ? l || !n ? /* @__PURE__ */ d(m, { children: [
+    t.map((c, g) => /* @__PURE__ */ h(v, { ...c, key: g })),
+    n && /* @__PURE__ */ a(s, { expanded: !0, onClick: f, children: e })
+  ] }) : /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(O, { color: "neutral", children: /* @__PURE__ */ a(s, { onClick: f, children: r }) }) }) : null;
 };
 export {
-  H as DialogHistory
+  N as DialogHistory
 };

package/dist/components/Dialog/DialogLabel.js

@@ -1,21 +1,21 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import { MetaItem as a } from "../Meta/MetaItem.js";
+import { MetaItem as i } from "../Meta/MetaItem.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import "../Icon/SvgIcon.js";
-const v = ({ size: r = "xs", type: e, label: t, children: o }) => {
+import { S as n, a as m } from "../../Trash-DMlYh49i.js";
+const g = ({ size: r = "xs", type: e, label: t, children: o }) => {
   switch (e) {
     case "trashed":
-      return /* @__PURE__ */ i(a, { size: r, icon: "trash", variant: "rounded", children: o || t });
+      return /* @__PURE__ */ a(i, { size: r, icon: m, variant: "rounded", children: o || t });
     case "archived":
-      return /* @__PURE__ */ i(a, { size: r, icon: "archive", variant: "rounded", children: o || t });
+      return /* @__PURE__ */ a(i, { size: r, icon: n, variant: "rounded", children: o || t });
     default:
-      return /* @__PURE__ */ i(a, { size: r, variant: "rounded", children: o || t });
+      return /* @__PURE__ */ a(i, { size: r, variant: "rounded", children: o || t });
   }
 };
 export {
-  v as DialogLabel
+  g as DialogLabel
 };

package/dist/components/Dialog/DialogList.js

@@ -1,7 +1,6 @@
 import { jsx as c } from "react/jsx-runtime";
 import { createElement as t } from "react";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import { useMenu as f } from "../../hooks/useMenu.js";
 import "../RootProvider/RootProvider.js";
 import { DialogListGroup as l } from "./DialogListGroup.js";
@@ -9,7 +8,7 @@ import { DialogListItem as y } from "./DialogListItem.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as d } from "../Page/Section.js";
-const j = ({ items: i, groups: m = {} }) => {
+const h = ({ items: i, groups: m = {} }) => {
   const { menu: r } = f({
     items: i,
     groups: m,
@@ -25,5 +24,5 @@ const j = ({ items: i, groups: m = {} }) => {
   }) });
 };
 export {
-  j as DialogList
+  h as DialogList
 };

package/dist/components/Dialog/DialogListGroup.js

@@ -1,22 +1,41 @@
-import { jsxs as o, jsx as r } from "react/jsx-runtime";
+"use client";
+import { jsxs as m, jsx as n } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
-import "react";
-import { Button as e } from "../Button/Button.js";
+import * as a from "react";
+import { forwardRef as f } from "react";
+import { Button as c } from "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
-import { ListBase as m } from "../List/ListBase.js";
-import { Heading as n } from "../Typography/Heading.js";
+import { ListBase as p } from "../List/ListBase.js";
+import { Heading as d } from "../Typography/Heading.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import { Flex as p } from "../Page/Flex.js";
-import { Section as c } from "../Page/Section.js";
-const z = ({ title: i, children: t }) => /* @__PURE__ */ o(c, { spacing: 3, children: [
-  i && /* @__PURE__ */ o(p, { direction: "row", align: "center", justify: "between", children: [
-    /* @__PURE__ */ r(n, { size: "lg", children: i }),
-    /* @__PURE__ */ r(e, { variant: "text", icon: "checkmark", size: "sm", children: "Velg alle" })
+import { Flex as s } from "../Page/Flex.js";
+import { Section as u } from "../Page/Section.js";
+import { u as g } from "../../useId-CsCRkvK3.js";
+var b = function(e, i) {
+  var o = {};
+  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && i.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var r = 0, t = Object.getOwnPropertySymbols(e); r < t.length; r++)
+      i.indexOf(t[r]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[r]) && (o[t[r]] = e[t[r]]);
+  return o;
+};
+const h = f((e, i) => {
+  var { title: o, titleId: t } = e, r = b(e, ["title", "titleId"]);
+  let l = g();
+  return l = o ? t || "title-" + l : void 0, a.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: i, "aria-labelledby": l }, r),
+    o ? a.createElement("title", { id: l }, o) : null,
+    a.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M18.998 6.94a.75.75 0 0 1 .063 1.058l-8 9a.75.75 0 0 1-1.091.032l-5-5a.75.75 0 1 1 1.06-1.06l4.438 4.437 7.471-8.405A.75.75 0 0 1 19 6.939", clipRule: "evenodd" })
+  );
+}), P = ({ title: e, children: i }) => /* @__PURE__ */ m(u, { spacing: 3, children: [
+  e && /* @__PURE__ */ m(s, { direction: "row", align: "center", justify: "between", children: [
+    /* @__PURE__ */ n(d, { size: "lg", children: e }),
+    /* @__PURE__ */ n(c, { variant: "text", icon: h, size: "sm", children: "Velg alle" })
   ] }),
-  /* @__PURE__ */ r(m, { spacing: 3, children: t })
+  /* @__PURE__ */ n(p, { spacing: 3, children: i })
 ] });
 export {
-  z as DialogListGroup
+  P as DialogListGroup
 };

package/dist/components/Dialog/DialogListItem.js

@@ -1,6 +1,5 @@
-import { jsx as e, jsxs as b } from "react/jsx-runtime";
+import { jsx as t, jsxs as b } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import { DialogMetadata as u } from "./DialogMetadata.js";
@@ -22,8 +21,8 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
   touchedBy: V,
   heading: W,
   title: X
-}, lt = ({
-  size: t = "lg",
+}, he = ({
+  size: e = "lg",
   state: x = "normal",
   loading: o,
   select: s,
@@ -53,31 +52,31 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
   ...p
 }) => {
   const w = d ? "trashed" : n ? "archived" : x, f = c ? "subtle" : q;
-  return t === "xs" || t === "sm" || t === "md" ? /* @__PURE__ */ e(
+  return e === "xs" || e === "sm" || e === "md" ? /* @__PURE__ */ t(
     N,
     {
       ...p,
-      size: t,
+      size: e,
       selected: c,
       theme: f,
-      label: /* @__PURE__ */ e("div", { className: a.border, "data-size": t, "data-seen": m, "data-loading": o, children: /* @__PURE__ */ e(G, { loading: o, size: t, title: r, description: y || _ }) }),
-      badge: /* @__PURE__ */ e(u, { loading: o, sender: h, updatedAt: l, updatedAtLabel: i }),
+      label: /* @__PURE__ */ t("div", { className: a.border, "data-size": e, "data-seen": m, "data-loading": o, children: /* @__PURE__ */ t(G, { loading: o, size: e, title: r, description: y || _ }) }),
+      badge: /* @__PURE__ */ t(u, { loading: o, sender: h, updatedAt: l, updatedAtLabel: i }),
       title: r
     }
-  ) : /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ t(
     N,
     {
       ...p,
-      size: t,
+      size: e,
       selected: c,
       theme: f,
       linkIcon: null,
-      controls: s && /* @__PURE__ */ e(J, { className: a.select, ...s, size: "xl" }),
+      controls: s && /* @__PURE__ */ t(J, { className: a.select, ...s, size: "xl" }),
       title: r,
-      label: /* @__PURE__ */ b("div", { className: a.border, "data-size": t, "data-seen": m, "data-loading": o, children: [
-        /* @__PURE__ */ b("header", { className: a.header, "data-size": t, children: [
-          /* @__PURE__ */ e(F, { loading: o, size: t, state: w, label: S, seen: m, children: r }),
-          /* @__PURE__ */ e(
+      label: /* @__PURE__ */ b("div", { className: a.border, "data-size": e, "data-seen": m, "data-loading": o, children: [
+        /* @__PURE__ */ b("header", { className: a.header, "data-size": e, children: [
+          /* @__PURE__ */ t(F, { loading: o, size: e, state: w, label: S, seen: m, children: r }),
+          /* @__PURE__ */ t(
             C,
             {
               size: "xs",
@@ -88,9 +87,9 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
               grouped: I
             }
           ),
-          /* @__PURE__ */ e(E, { loading: o, children: /* @__PURE__ */ e("p", { "data-size": t, className: a.summary, children: y || _ }) })
+          /* @__PURE__ */ t(E, { loading: o, children: /* @__PURE__ */ t("p", { "data-size": e, className: a.summary, children: y || _ }) })
         ] }),
-        /* @__PURE__ */ e(
+        /* @__PURE__ */ t(
           u,
           {
             className: a.footer,
@@ -117,5 +116,5 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
   );
 };
 export {
-  lt as DialogListItem
+  he as DialogListItem
 };

package/dist/components/Dialog/DialogMetadata.js

@@ -1,49 +1,88 @@
-import { jsxs as S, jsx as r } from "react/jsx-runtime";
+"use client";
+import { jsxs as w, jsx as n } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
-import "react";
+import * as c from "react";
+import { forwardRef as z } from "react";
 import "../RootProvider/RootProvider.js";
-import { DialogActivityLog as I } from "./DialogActivityLog.js";
-import { DialogSeenBy as q } from "./DialogSeenBy.js";
-import { DialogStatus as w } from "./DialogStatus.js";
-import { DialogTouchedBy as y } from "./DialogTouchedBy.js";
-import { MetaBase as E } from "../Meta/MetaBase.js";
-import { MetaItem as T } from "../Meta/MetaItem.js";
+import { DialogActivityLog as j } from "./DialogActivityLog.js";
+import { DialogSeenBy as I } from "./DialogSeenBy.js";
+import { DialogStatus as E } from "./DialogStatus.js";
+import { DialogTouchedBy as _ } from "./DialogTouchedBy.js";
+import { MetaBase as M } from "../Meta/MetaBase.js";
+import { MetaItem as b } from "../Meta/MetaItem.js";
 import { MetaTimestamp as m } from "../Meta/MetaTimestamp.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-const Y = ({
-  className: k,
-  loading: i,
-  status: e,
-  sender: o,
-  updatedAt: s,
-  updatedAtLabel: B,
-  dueAt: p,
-  dueAtLabel: t,
-  trashedAt: c,
-  trashedAtLabel: x,
-  archivedAt: z,
-  archivedAtLabel: f,
-  seenBy: h,
-  touchedBy: D,
-  attachmentsCount: M = 0,
-  attachmentsLabel: j,
-  transmissionsLabel: l,
-  activityLog: n
-}) => /* @__PURE__ */ S(E, { className: k, size: "xs", children: [
-  e && /* @__PURE__ */ r(w, { loading: i, size: "xs", ...e }),
-  s && /* @__PURE__ */ S(m, { loading: i, datetime: s, size: "xs", children: [
-    /* @__PURE__ */ r("strong", { children: o && o.name + ", " }),
-    B
+import { S as P } from "../../ClockDashed-PQgzLSPC.js";
+import { u as S } from "../../useId-CsCRkvK3.js";
+import { a as D, S as R } from "../../Trash-DMlYh49i.js";
+var B = function(t, r) {
+  var i = {};
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && r.indexOf(e) < 0 && (i[e] = t[e]);
+  if (t != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var l = 0, e = Object.getOwnPropertySymbols(t); l < e.length; l++)
+      r.indexOf(e[l]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[l]) && (i[e[l]] = t[e[l]]);
+  return i;
+};
+const T = z((t, r) => {
+  var { title: i, titleId: e } = t, l = B(t, ["title", "titleId"]);
+  let o = S();
+  return o = i ? e || "title-" + o : 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: r, "aria-labelledby": o }, l),
+    i ? c.createElement("title", { id: o }, i) : null,
+    c.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M8.25 3.5c0-.69.56-1.25 1.25-1.25H14a.75.75 0 0 1 .53.22l5 5c.141.14.22.331.22.53v8.5c0 .69-.56 1.25-1.25 1.25h-9c-.69 0-1.25-.56-1.25-1.25zm6.25 5.25c-.69 0-1.25-.56-1.25-1.25V3.75h-3.5v12.5h8.5v-7.5zm.25-3.94 2.44 2.44h-2.44zM6.502 7.75H5.75v12.5h8.5v-.748a.75.75 0 0 1 1.5 0v.998c0 .69-.56 1.25-1.25 1.25h-9c-.69 0-1.25-.56-1.25-1.25v-13c0-.69.56-1.25 1.25-1.25h1.002a.75.75 0 1 1 0 1.5", clipRule: "evenodd" })
+  );
+});
+var C = function(t, r) {
+  var i = {};
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && r.indexOf(e) < 0 && (i[e] = t[e]);
+  if (t != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var l = 0, e = Object.getOwnPropertySymbols(t); l < e.length; l++)
+      r.indexOf(e[l]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[l]) && (i[e[l]] = t[e[l]]);
+  return i;
+};
+const H = z((t, r) => {
+  var { title: i, titleId: e } = t, l = C(t, ["title", "titleId"]);
+  let o = S();
+  return o = i ? e || "title-" + o : 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: r, "aria-labelledby": o }, l),
+    i ? c.createElement("title", { id: o }, i) : null,
+    c.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M15.912 4.382c-.546.032-1.086.292-1.503.71l-8.132 8.131c-1.2 1.201-1.754 3.549 0 5.304 1.755 1.754 4.103 1.2 5.304 0l7.424-7.425a.75.75 0 0 1 1.06 1.06l-7.424 7.425c-1.627 1.628-4.936 2.488-7.424 0s-1.628-5.797 0-7.424l8.131-8.132c.644-.643 1.518-1.09 2.475-1.146.976-.058 1.978.295 2.829 1.146.85.851 1.203 1.853 1.146 2.828-.056.957-.503 1.832-1.146 2.475l-7.425 7.425c-.316.316-.838.553-1.376.613-.568.063-1.255-.062-1.806-.613-.55-.55-.676-1.238-.613-1.806.06-.538.297-1.06.613-1.376l6.718-6.718a.75.75 0 0 1 1.06 1.061l-6.717 6.718a.95.95 0 0 0-.183.48c-.025.227.026.424.183.58.156.157.353.208.58.183a.95.95 0 0 0 .48-.183l7.425-7.424c.417-.418.678-.957.71-1.503.03-.527-.147-1.116-.71-1.68s-1.152-.74-1.68-.71", clipRule: "evenodd" })
+  );
+}), L = ({
+  className: t,
+  loading: r,
+  status: i,
+  sender: e,
+  updatedAt: l,
+  updatedAtLabel: o,
+  dueAt: f,
+  dueAtLabel: s,
+  trashedAt: a,
+  trashedAtLabel: p,
+  archivedAt: d,
+  archivedAtLabel: v,
+  seenBy: u,
+  touchedBy: h,
+  attachmentsCount: x = 0,
+  attachmentsLabel: g,
+  transmissionsLabel: y,
+  activityLog: O
+}) => /* @__PURE__ */ w(M, { className: t, size: "xs", children: [
+  i && /* @__PURE__ */ n(E, { loading: r, size: "xs", ...i }),
+  l && /* @__PURE__ */ w(m, { loading: r, datetime: l, size: "xs", children: [
+    /* @__PURE__ */ n("strong", { children: e && e.name + ", " }),
+    o
   ] }),
-  p && t && /* @__PURE__ */ r(m, { loading: i, datetime: p, size: "xs", icon: "clock-dashed", children: t }),
-  (j || M > 0) && /* @__PURE__ */ r(T, { loading: i, size: "xs", icon: "paperclip", children: j || M }),
-  l && /* @__PURE__ */ r(T, { loading: i, size: "xs", icon: "files", children: l }),
-  c && x && /* @__PURE__ */ r(m, { loading: i, datetime: c, size: "xs", icon: "trash", children: x }) || z && f && /* @__PURE__ */ r(m, { loading: i, datetime: z, size: "xs", icon: "archive", children: f }) || !i && h && /* @__PURE__ */ r(q, { size: "xs", ...h }),
-  n && /* @__PURE__ */ r(I, { ...n, loading: i, size: "xs" }),
-  D && /* @__PURE__ */ r(y, { ...D, loading: i, size: "xs" })
+  f && s && /* @__PURE__ */ n(m, { loading: r, datetime: f, size: "xs", icon: P, children: s }),
+  (g || x > 0) && /* @__PURE__ */ n(b, { loading: r, size: "xs", icon: H, children: g || x }),
+  y && /* @__PURE__ */ n(b, { loading: r, size: "xs", icon: T, children: y }),
+  a && p && /* @__PURE__ */ n(m, { loading: r, datetime: a, size: "xs", icon: D, children: p }) || d && v && /* @__PURE__ */ n(m, { loading: r, datetime: d, size: "xs", icon: R, children: v }) || !r && u && /* @__PURE__ */ n(I, { size: "xs", ...u }),
+  O && /* @__PURE__ */ n(j, { ...O, loading: r, size: "xs" }),
+  h && /* @__PURE__ */ n(_, { ...h, loading: r, size: "xs" })
 ] });
 export {
-  Y as DialogMetadata
+  L as DialogMetadata
 };

package/dist/components/Dialog/DialogSection.js

@@ -1,6 +1,5 @@
 import { jsxs as m, jsx as i } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import { Typography as t } from "../Typography/Typography.js";
@@ -8,10 +7,10 @@ import { Heading as p } from "../Typography/Heading.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as n } from "../Page/Section.js";
-const h = ({ title: r, children: o }) => o ? /* @__PURE__ */ m(n, { spacing: 3, margin: "section", children: [
+const d = ({ title: r, children: o }) => o ? /* @__PURE__ */ m(n, { spacing: 3, margin: "section", children: [
   r && /* @__PURE__ */ i(p, { size: "lg", children: r }),
   /* @__PURE__ */ i(t, { children: o })
 ] }) : null;
 export {
-  h as DialogSection
+  d as DialogSection
 };

package/dist/components/Dialog/DialogSeenBy.js

@@ -1,22 +1,42 @@
-import { jsx as n } from "react/jsx-runtime";
+"use client";
+import { jsx as c } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
-import { MetaItem as p } from "../Meta/MetaItem.js";
-import "react";
+import { MetaItem as f } from "../Meta/MetaItem.js";
+import * as a from "react";
+import { forwardRef as m } from "react";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import "../Icon/SvgIcon.js";
-const g = ({
-  size: e = "xs",
+import { S as s } from "../../Eye-CMPIjkcy.js";
+import { u as p } from "../../useId-CsCRkvK3.js";
+var d = function(t, o) {
+  var r = {};
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && o.indexOf(e) < 0 && (r[e] = t[e]);
+  if (t != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var l = 0, e = Object.getOwnPropertySymbols(t); l < e.length; l++)
+      o.indexOf(e[l]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[l]) && (r[e[l]] = t[e[l]]);
+  return r;
+};
+const u = m((t, o) => {
+  var { title: r, titleId: e } = t, l = d(t, ["title", "titleId"]);
+  let n = p();
+  return n = r ? e || "title-" + n : void 0, a.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: o, "aria-labelledby": n }, l),
+    r ? a.createElement("title", { id: n }, r) : null,
+    a.createElement("path", { fill: "currentColor", d: "M2.614 9.357a.75.75 0 0 1 1.029.257l.003.005.02.033.093.139c.085.123.214.303.39.522.35.438.877 1.024 1.581 1.61C7.137 13.097 9.223 14.25 12 14.25s4.863-1.154 6.27-2.326a11.4 11.4 0 0 0 1.582-1.611 9 9 0 0 0 .481-.661q.015-.023.02-.033l.004-.005a.75.75 0 0 1 1.286.772L21 10c.643.386.642.387.642.387v.002l-.004.005-.01.015-.032.051-.118.179c-.103.15-.255.36-.455.61-.304.38-.722.856-1.256 1.353l.841 1.002a.75.75 0 1 1-1.149.965l-.847-1.01c-.577.423-1.24.83-1.987 1.176l.497 1.17a.75.75 0 1 1-1.38.587l-.518-1.22c-.758.233-1.582.394-2.474.453V17a.75.75 0 0 1-1.5 0v-1.275a11 11 0 0 1-2.475-.453l-.516 1.215a.75.75 0 1 1-1.38-.586l.494-1.166a11.7 11.7 0 0 1-1.987-1.178l-.845 1.007a.75.75 0 1 1-1.15-.964l.84-1c-.533-.496-.95-.97-1.254-1.35a11 11 0 0 1-.574-.79l-.032-.05-.01-.016-.002-.005-.001-.002-.001-.001a.75.75 0 0 1 .257-1.03" })
+  );
+}), j = ({
+  size: t = "xs",
   label: o = "Seen by label",
-  seenByEndUser: t = !1,
-  seenByOthersCount: r = 0,
-  onClick: s,
-  ...i
+  seenByEndUser: r = !1,
+  seenByOthersCount: e = 0,
+  onClick: l,
+  ...n
 }) => {
-  const m = t || r > 0 ? "eye" : "eye-closed";
-  return /* @__PURE__ */ n(p, { size: e, icon: m, ...i, children: o });
+  const i = r || e > 0 ? s : u;
+  return /* @__PURE__ */ c(f, { size: t, icon: i, ...n, children: o });
 };
 export {
-  g as DialogSeenBy
+  j as DialogSeenBy
 };

package/dist/components/Dialog/DialogSelect.js

@@ -1,19 +1,18 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import { jsxs as i, jsx as r } from "react/jsx-runtime";
 import { c as l } from "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import "../Icon/SvgIcon.js";
 import { CheckboxIcon as s } from "../Icon/CheckboxIcon.js";
 import '../../assets/DialogSelect.css';const a = "_label_19rag_1", n = "_input_19rag_15", p = "_icon_19rag_19", o = {
   label: a,
   input: n,
   icon: p
-}, N = ({ checked: t = !1, onChange: i, className: c }) => /* @__PURE__ */ e("label", { className: l(o.label, c), children: [
-  /* @__PURE__ */ r("input", { type: "checkbox", checked: t, onChange: i, className: o.input }),
+}, h = ({ checked: t = !1, onChange: c, className: e }) => /* @__PURE__ */ i("label", { className: l(o.label, e), children: [
+  /* @__PURE__ */ r("input", { type: "checkbox", checked: t, onChange: c, className: o.input }),
   /* @__PURE__ */ r(s, { hover: !0, checked: t, className: o.icon })
 ] });
 export {
-  N as DialogSelect
+  h as DialogSelect
 };

package/dist/components/Dialog/DialogStatus.js

@@ -1,14 +1,13 @@
 import { jsx as n } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import { MetaItem as o } from "../Meta/MetaItem.js";
-import { MetaProgress as p } from "../Meta/MetaProgress.js";
+import { MetaProgress as s } from "../Meta/MetaProgress.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import "../Icon/SvgIcon.js";
-var s = /* @__PURE__ */ ((r) => (r.draft = "DRAFT", r.sent = "SENT", r.new = "NEW", r.completed = "COMPLETED", r["in-progress"] = "IN_PROGRESS", r["requires-attention"] = "REQUIRES_ATTENTION", r))(s || {});
-const w = ({ loading: r, size: i = "xs", value: t = "new", label: e }) => {
+var p = /* @__PURE__ */ ((r) => (r.draft = "DRAFT", r.sent = "SENT", r.new = "NEW", r.completed = "COMPLETED", r["in-progress"] = "IN_PROGRESS", r["requires-attention"] = "REQUIRES_ATTENTION", r))(p || {});
+const R = ({ loading: r, size: i = "xs", value: t = "new", label: e }) => {
   if (r)
     return null;
   switch (t) {
@@ -19,14 +18,14 @@ const w = ({ loading: r, size: i = "xs", value: t = "new", label: e }) => {
     case "requires-attention":
       return /* @__PURE__ */ n(o, { variant: "solid", children: e || t });
     case "in-progress":
-      return /* @__PURE__ */ n(p, { size: i, variant: "outline", progress: 75, children: e || t });
+      return /* @__PURE__ */ n(s, { size: i, variant: "outline", progress: 75, children: e || t });
     case "completed":
-      return /* @__PURE__ */ n(p, { size: i, variant: "outline", progress: 100, children: e || t });
+      return /* @__PURE__ */ n(s, { size: i, variant: "outline", progress: 100, children: e || t });
     default:
       return /* @__PURE__ */ n(o, { size: i, variant: "outline", children: e || t });
   }
 };
 export {
-  w as DialogStatus,
-  s as DialogStatusEnum
+  R as DialogStatus,
+  p as DialogStatusEnum
 };

package/dist/components/Dialog/DialogTimeline.js

@@ -1,18 +1,17 @@
 "use client";
 import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import { createElement as p } from "react";
+import { createElement as n } from "react";
 import "../../index-L8X2o7IH.js";
-import "../Icon/SvgIcon.js";
 import "../RootProvider/RootProvider.js";
-import { Heading as n } from "../Typography/Heading.js";
+import { Heading as p } from "../Typography/Heading.js";
 import { DialogTimelineItem as l } from "./DialogTimelineItem.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { TimelineBase as s } from "../Timeline/TimelineBase.js";
-const D = ({ title: i, items: r = [] }) => /* @__PURE__ */ o(s, { children: [
-  /* @__PURE__ */ t(n, { size: "xs", children: i }),
-  r.map((e, m) => /* @__PURE__ */ p(l, { ...e, key: m }))
+const j = ({ title: e, items: i = [] }) => /* @__PURE__ */ o(s, { children: [
+  /* @__PURE__ */ t(p, { size: "xs", children: e }),
+  i.map((r, m) => /* @__PURE__ */ n(l, { ...r, key: m }))
 ] });
 export {
-  D as DialogTimeline
+  j as DialogTimeline
 };