@mittwald/flow-react-components 0.1.0-alpha.64 → 0.1.0-alpha.66

package/dist/{Action-CeKzQsag.js → Action-DZzRGFBL.js}

@@ -8,7 +8,7 @@ import "./propsContext-CauylOgH.js";
 import { P as x } from "./PropsContextProvider-BcOGMJkn.js";
 import "@react-aria/utils";
 import "remeda";
-import { u as A } from "./useProps-DqP5wneE.js";
+import { u as A } from "./useProps-DoKnPAup.js";
 import { u as y } from "./useOverlayState-BnPe_CrX.js";
 import { makeObservable as C, observable as r, action as l } from "mobx";
 import { u as v } from "./useSelector-DpU7_HMO.js";

package/dist/Action.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { A as t } from "./Action-CeKzQsag.js";
+import { A as t } from "./Action-DZzRGFBL.js";
 export {
   t as Action,
   t as default

package/dist/Avatar.js

@@ -4,7 +4,7 @@ import i, { isValidElement as v } from "react";
 import m from "clsx";
 import { C as p } from "./ClearPropsContext-CeCMjUK9.js";
 import { P as c } from "./PropsContextProvider-BcOGMJkn.js";
-import { u as f } from "./useProps-DqP5wneE.js";
+import { u as f } from "./useProps-DoKnPAup.js";
 import { hash as w } from "object-code";
 import { deepForEach as z } from "react-children-utilities";
 const d = "flow--avatar", h = "flow--avatar--icon", u = "flow--avatar--initials", r = {

package/dist/Breadcrumb.js

@@ -4,33 +4,32 @@ import r from "react";
 import * as s from "react-aria-components";
 import a from "clsx";
 import "@tabler/icons-react";
-import "html-react-parser";
+import "./Icon-DVRBNZZe.js";
+import { I as u } from "./IconChevronRight-D2iaxujY.js";
 import "./propsContext-CauylOgH.js";
+import { P as d } from "./PropsContextProvider-BcOGMJkn.js";
 import "@react-aria/utils";
 import "remeda";
-import "@mittwald/react-tunnel";
-import { I as u } from "./IconChevronRight-ngvPFPMg.js";
-import { P as d } from "./PropsContextProvider-BcOGMJkn.js";
-const p = "flow--breadcrumb", f = "flow--breadcrumb--link", m = {
+const p = "flow--breadcrumb", f = "flow--breadcrumb--link", c = {
   breadcrumb: p,
   link: f
-}, N = "flow--breadcrumb--breadcrumb-item", I = "flow--breadcrumb--breadcrumb-item--icon", c = {
+}, N = "flow--breadcrumb--breadcrumb-item", I = "flow--breadcrumb--breadcrumb-item--icon", m = {
   breadcrumbItem: N,
   icon: I
 }, h = (e) => {
-  const { children: t } = e, o = a(c.breadcrumbItem);
-  return /* @__PURE__ */ r.createElement(s.Breadcrumb, { className: o }, t, /* @__PURE__ */ r.createElement(u, { size: "s", className: c.icon }));
-}, g = (e) => {
-  const { children: t, className: o, ...n } = e, l = a(m.breadcrumb, o), b = {
+  const { children: t } = e, o = a(m.breadcrumbItem);
+  return /* @__PURE__ */ r.createElement(s.Breadcrumb, { className: o }, t, /* @__PURE__ */ r.createElement(u, { size: "s", className: m.icon }));
+}, R = (e) => {
+  const { children: t, className: o, ...n } = e, l = a(c.breadcrumb, o), b = {
     Link: {
       unstyled: !0,
-      className: m.link,
+      className: c.link,
       hoc: (i) => /* @__PURE__ */ r.createElement(h, null, i)
     }
   };
   return /* @__PURE__ */ r.createElement(s.Breadcrumbs, { ...n, className: l }, /* @__PURE__ */ r.createElement(d, { props: b }, t));
 };
 export {
-  g as Breadcrumb,
-  g as default
+  R as Breadcrumb,
+  R as default
 };

package/dist/Button-CdGfSPx-.js

@@ -0,0 +1,101 @@
+"use client"
+/* */
+import n from "react";
+import * as p from "react-aria-components";
+import x from "clsx";
+import { C } from "./ClearPropsContext-CeCMjUK9.js";
+import { P as I } from "./PropsContextProvider-BcOGMJkn.js";
+import "@react-aria/utils";
+import "./propsContext-CauylOgH.js";
+import "remeda";
+import "@tabler/icons-react";
+import "./Icon-DVRBNZZe.js";
+import { I as N, a as h, b as z } from "./IconSucceeded-d5GrQkmO.js";
+import { W as d } from "./Wrap-DGT1h1o3.js";
+import { T as B } from "./Text-D7C_T7CE.js";
+import { f as A } from "./flowComponent-CEo3pjEA.js";
+import { useLocalizedStringFormatter as D } from "react-aria";
+const L = "flow--button", T = "flow--button--avatar", K = "flow--button--icon", U = "flow--button--text", W = "flow--button--content", $ = "flow--button--state-icon", R = "flow--button--is-succeeded", j = "flow--button--is-failed", k = "flow--button--is-pending", q = "flow--button--plain", G = "flow--button--primary", H = "flow--button--solid", J = "flow--button--accent", M = "flow--button--danger", O = "flow--button--secondary", Q = "flow--button--soft", e = {
+  button: L,
+  avatar: T,
+  icon: K,
+  text: U,
+  content: W,
+  stateIcon: $,
+  "size-s": "flow--button--size-s",
+  isSucceeded: R,
+  isFailed: j,
+  isPending: k,
+  plain: q,
+  primary: G,
+  solid: H,
+  accent: J,
+  danger: M,
+  secondary: O,
+  soft: Q
+}, V = {
+  "de-DE": {
+    "button.isFailed": "Fehlgeschlagen",
+    "button.isPending": "Ausstehend",
+    "button.isSucceeded": "Erfolgreich"
+  },
+  "en-EN": {
+    "button.isFailed": "Failed",
+    "button.isPending": "Pending",
+    "button.isSucceeded": "Succeeded"
+  }
+}, X = (t) => ((t.isPending || t.isSucceeded || t.isFailed) && (t = { ...t }, t.onPress = void 0, t.onPressStart = void 0, t.onPressEnd = void 0, t.onPressChange = void 0, t.onPressUp = void 0, t.onKeyDown = void 0, t.onKeyUp = void 0), t), mt = A("Button", (t) => {
+  t = X(t);
+  const {
+    variant: m = "primary",
+    style: u = "solid",
+    children: c,
+    className: f,
+    size: i = "m",
+    isPending: a,
+    isDisabled: b,
+    isSucceeded: o,
+    isFailed: s,
+    "aria-label": g,
+    ref: P,
+    ...w
+  } = t, v = x(
+    e.button,
+    a && e.isPending,
+    o && e.isSucceeded,
+    s && e.isFailed,
+    e[`size-${i}`],
+    e[m],
+    e[u],
+    f
+  ), S = {
+    Icon: {
+      className: e.icon,
+      "aria-hidden": !0,
+      size: i
+    },
+    Text: {
+      className: e.text
+    },
+    Avatar: {
+      className: e.avatar
+    }
+  }, F = D(V), y = o || s || a ? F.format(
+    `button.${o ? "isSucceeded" : s ? "isFailed" : "isPending"}`
+  ) : void 0, r = o ? N : s ? h : a ? z : void 0, l = r && /* @__PURE__ */ n.createElement(r, { size: i, className: e.stateIcon }), E = typeof c == "string";
+  return /* @__PURE__ */ n.createElement(C, null, /* @__PURE__ */ n.createElement(
+    p.Button,
+    {
+      className: v,
+      isDisabled: b,
+      "aria-label": y ?? g,
+      ref: P,
+      ...w
+    },
+    /* @__PURE__ */ n.createElement(d, { if: l }, /* @__PURE__ */ n.createElement("span", { className: e.content }, /* @__PURE__ */ n.createElement(d, { if: E }, /* @__PURE__ */ n.createElement(B, null, /* @__PURE__ */ n.createElement(I, { props: S }, c))))),
+    l
+  ));
+});
+export {
+  mt as B
+};

package/dist/Button.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { B as o } from "./Button-CUr754ra.js";
+import { B as o } from "./Button-CdGfSPx-.js";
 export {
   o as Button,
   o as default

package/dist/ButtonGroup.js

@@ -3,7 +3,7 @@
 import o from "react";
 import { C as u } from "./ClearPropsContext-CeCMjUK9.js";
 import { P as m } from "./PropsContextProvider-BcOGMJkn.js";
-import { u as l } from "./useProps-DqP5wneE.js";
+import { u as l } from "./useProps-DoKnPAup.js";
 import { d } from "./dynamic-ClpUSmEt.js";
 import i from "clsx";
 const f = "flow--button-group", y = "flow--button-group--secondary", t = {

package/dist/Checkbox-Bc-Yp2Li.js

@@ -0,0 +1,24 @@
+"use client"
+/* */
+import e from "react";
+import * as i from "react-aria-components";
+import p from "clsx";
+import "@tabler/icons-react";
+import "./Icon-DVRBNZZe.js";
+import { I as x, a as h } from "./IconCheckboxEmpty-BneZ_izo.js";
+import { I as C } from "./IconCheckboxIndeterminate-DZM-0gVy.js";
+import { C as f } from "./ClearPropsContext-CeCMjUK9.js";
+import "./propsContext-CauylOgH.js";
+import "@react-aria/utils";
+import "remeda";
+import { f as k } from "./flowComponent-CEo3pjEA.js";
+const b = "flow--checkbox", E = "flow--checkbox--icon", o = {
+  checkbox: b,
+  icon: E
+}, j = k("Checkbox", (c) => {
+  const { children: t, className: r, ref: m, ...a } = c, n = p(o.checkbox, r);
+  return /* @__PURE__ */ e.createElement(f, null, /* @__PURE__ */ e.createElement(i.Checkbox, { ...a, className: n, ref: m }, ({ isSelected: s, isIndeterminate: l }) => /* @__PURE__ */ e.createElement(e.Fragment, null, s ? /* @__PURE__ */ e.createElement(x, { className: o.icon }) : l ? /* @__PURE__ */ e.createElement(C, { className: o.icon }) : /* @__PURE__ */ e.createElement(h, { className: o.icon }), t)));
+});
+export {
+  j as C
+};

package/dist/Checkbox.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { C as a } from "./Checkbox-CBAAtfxq.js";
+import { C as a } from "./Checkbox-Bc-Yp2Li.js";
 export {
   a as Checkbox,
   a as default

package/dist/CheckboxButton-D5G0rxZz.js

@@ -0,0 +1,29 @@
+"use client"
+/* */
+import t from "react";
+import a from "clsx";
+import { C as m } from "./ClearPropsContext-CeCMjUK9.js";
+import { P as p } from "./PropsContextProvider-BcOGMJkn.js";
+import "@react-aria/utils";
+import "./propsContext-CauylOgH.js";
+import "remeda";
+import { C as b } from "./Checkbox-Bc-Yp2Li.js";
+import { f as x } from "./flowComponent-CEo3pjEA.js";
+const C = "flow--checkbox-button", f = "flow--checkbox-button--content", i = "flow--checkbox-button--label", o = {
+  checkboxButton: C,
+  content: f,
+  label: i
+}, v = x("CheckboxButton", (e) => {
+  const { children: c, className: n, ...r } = e, s = a(o.checkboxButton, n), l = {
+    Text: {
+      className: o.label
+    },
+    Content: {
+      className: o.content
+    }
+  };
+  return /* @__PURE__ */ t.createElement(m, null, /* @__PURE__ */ t.createElement(b, { ...r, className: s }, /* @__PURE__ */ t.createElement(p, { props: l }, c)));
+});
+export {
+  v as C
+};

package/dist/CheckboxButton.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { C as t } from "./CheckboxButton-BYp2HCfN.js";
+import { C as t } from "./CheckboxButton-D5G0rxZz.js";
 export {
   t as CheckboxButton,
   t as default

package/dist/CheckboxGroup.js

@@ -2,37 +2,43 @@
 /* */
 import e from "react";
 import * as u from "react-aria-components";
-import E from "clsx";
+import x from "clsx";
 import "./propsContext-CauylOgH.js";
-import { P as x } from "./PropsContextProvider-BcOGMJkn.js";
+import { P as b } from "./PropsContextProvider-BcOGMJkn.js";
 import "@react-aria/utils";
 import "remeda";
-import { F as b } from "./FieldError-D9ZaMqoL.js";
-import { C as h } from "./CheckboxButton-BYp2HCfN.js";
-import { TunnelProvider as C, TunnelExit as t } from "@mittwald/react-tunnel";
-import { s as r } from "./FormField.module-DHK6nIcD.js";
-import { C as k } from "./ColumnLayout-FMONjI17.js";
+import { F as h } from "./FieldError-CBxCl2nS.js";
+import { C as E } from "./CheckboxButton-D5G0rxZz.js";
+import { TunnelProvider as k, TunnelExit as r } from "@mittwald/react-tunnel";
+import { s as o } from "./FormField.module-DHK6nIcD.js";
+import { C } from "./ColumnLayout-FMONjI17.js";
 import { d as N } from "./deepFindOfType-6pG0fH7S.js";
-const F = "flow--checkbox-group", l = {
-  checkboxGroup: F
-}, O = (s) => {
-  const { children: o, className: c, s: m, m: a, l: i, ...n } = s, p = E(r.formField, c), d = {
+import { f as F } from "./flowComponent-CEo3pjEA.js";
+const G = "flow--checkbox-group", s = {
+  checkboxGroup: G
+}, j = F("CheckboxGroup", (l) => {
+  const { children: t, className: m, s: n, m: i, l: a, ref: y, ...p } = l, d = x(o.formField, m), f = {
     Label: {
-      className: r.label,
-      tunnelId: "label"
+      className: o.label
     },
     FieldDescription: {
-      className: r.fieldDescription,
+      className: o.fieldDescription,
       tunnelId: "fieldDescription"
     },
     FieldError: {
-      className: r.customFieldError,
+      className: o.customFieldError,
       tunnelId: "fieldError"
+    },
+    Checkbox: {
+      tunnelId: "checkboxes"
+    },
+    CheckboxButton: {
+      tunnelId: "checkboxes"
     }
-  }, f = !!N(o, h);
-  return /* @__PURE__ */ e.createElement(u.CheckboxGroup, { ...n, className: p }, /* @__PURE__ */ e.createElement(x, { props: d }, /* @__PURE__ */ e.createElement(C, null, /* @__PURE__ */ e.createElement(t, { id: "label" }), f ? /* @__PURE__ */ e.createElement(k, { s: m, m: a, l: i, className: l.checkboxGroup }, o) : /* @__PURE__ */ e.createElement("div", { className: l.checkboxGroup }, o), /* @__PURE__ */ e.createElement(t, { id: "fieldDescription" }), /* @__PURE__ */ e.createElement(t, { id: "fieldError" }))), /* @__PURE__ */ e.createElement(b, { className: r.fieldError }));
-};
+  }, c = !!N(t, E);
+  return /* @__PURE__ */ e.createElement(u.CheckboxGroup, { ...p, className: d }, /* @__PURE__ */ e.createElement(b, { props: f }, /* @__PURE__ */ e.createElement(k, null, t, c && /* @__PURE__ */ e.createElement(C, { s: n, m: i, l: a, className: s.checkboxGroup }, /* @__PURE__ */ e.createElement(r, { id: "checkboxes" })), !c && /* @__PURE__ */ e.createElement("div", { className: s.checkboxGroup }, /* @__PURE__ */ e.createElement(r, { id: "checkboxes" })), /* @__PURE__ */ e.createElement(r, { id: "fieldDescription" }), /* @__PURE__ */ e.createElement(r, { id: "fieldError" }))), /* @__PURE__ */ e.createElement(h, { className: o.fieldError }));
+});
 export {
-  O as CheckboxGroup,
-  O as default
+  j as CheckboxGroup,
+  j as default
 };

package/dist/Content.js

@@ -1,16 +1,16 @@
 "use client"
 /* */
 import t from "react";
-import { C as l } from "./ClearPropsContext-CeCMjUK9.js";
+import { C as p } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
-import { f as p } from "./flowComponent-Dfn_Z9Yx.js";
-const d = p("Content", (e) => {
-  const { children: o, elementType: r = "div", ...n } = e, m = r;
-  return /* @__PURE__ */ t.createElement(l, null, /* @__PURE__ */ t.createElement(m, { ...n }, o));
+import { f as a } from "./flowComponent-CEo3pjEA.js";
+const u = a("Content", (e) => {
+  const { children: o, elementType: r = "div", ref: n, ...m } = e, l = r;
+  return /* @__PURE__ */ t.createElement(p, null, /* @__PURE__ */ t.createElement(l, { ref: n, ...m }, o));
 });
 export {
-  d as Content,
-  d as default
+  u as Content,
+  u as default
 };

package/dist/ContextMenu.js

@@ -1,7 +1,7 @@
 "use client"
 /* */
-import { C as t } from "./ContextMenuItem-7xGNJkkK.js";
-import { a as n } from "./ContextMenuItem-7xGNJkkK.js";
+import { C as t } from "./ContextMenuItem-k4nwztKS.js";
+import { a as n } from "./ContextMenuItem-k4nwztKS.js";
 import { MenuTrigger as x } from "react-aria-components";
 export {
   t as ContextMenu,

package/dist/ContextMenuItem-k4nwztKS.js

@@ -0,0 +1,67 @@
+"use client"
+/* */
+import e from "react";
+import * as i from "react-aria-components";
+import { f as x } from "./flowComponent-CEo3pjEA.js";
+import { P as f } from "./Popover-MmxZkKu3.js";
+import d from "clsx";
+import "./propsContext-CauylOgH.js";
+import { P as C } from "./PropsContextProvider-BcOGMJkn.js";
+import "@react-aria/utils";
+import "remeda";
+import "@tabler/icons-react";
+import "./Icon-DVRBNZZe.js";
+import { I, a as M } from "./IconCheckboxEmpty-BneZ_izo.js";
+import { I as E, a as h } from "./IconRadioOn-DNpq9Xk7.js";
+import { T as a } from "./Text-D7C_T7CE.js";
+import { d as y } from "./deepFindOfType-6pG0fH7S.js";
+import { W as N } from "./Wrap-DGT1h1o3.js";
+const w = "flow--context-menu", P = {
+  contextMenu: w
+}, J = x("ContextMenu", (n) => {
+  const {
+    children: t,
+    onAction: o,
+    selectionMode: c,
+    selectedKeys: s,
+    defaultSelectedKeys: m,
+    onSelectionChange: r,
+    ref: p,
+    ...u
+  } = n;
+  return /* @__PURE__ */ e.createElement(f, { ...u }, /* @__PURE__ */ e.createElement(
+    i.Menu,
+    {
+      className: P.contextMenu,
+      onAction: o,
+      selectionMode: c,
+      selectedKeys: s,
+      defaultSelectedKeys: m,
+      onSelectionChange: r,
+      ref: p
+    },
+    t
+  ));
+}), T = "flow--context-menu--context-menu-item", g = "flow--context-menu--context-menu-item--icon", k = "flow--context-menu--context-menu-item--text", l = {
+  contextMenuItem: T,
+  icon: g,
+  text: k
+}, O = (n, t) => !!y(n, t), R = (n) => {
+  const { selectionMode: t, isSelected: o, children: c } = n, s = {
+    Icon: {
+      className: l.icon
+    },
+    Text: {
+      className: l.text
+    }
+  }, m = t === "none" ? null : t === "single" && o ? /* @__PURE__ */ e.createElement(E, null) : t === "single" && !o ? /* @__PURE__ */ e.createElement(h, null) : t === "multiple" && o ? /* @__PURE__ */ e.createElement(I, null) : /* @__PURE__ */ e.createElement(M, null), r = O(c, a);
+  return /* @__PURE__ */ e.createElement(C, { props: s }, m, /* @__PURE__ */ e.createElement(N, { if: !r }, /* @__PURE__ */ e.createElement(a, null, c)));
+}, L = (n) => {
+  const { children: t, className: o, ...c } = n, s = d(l.contextMenuItem, o);
+  return /* @__PURE__ */ e.createElement(i.MenuItem, { ...c, className: s }, (m) => /* @__PURE__ */ e.createElement(R, { ...m }, t));
+};
+export {
+  J as C,
+  L as a,
+  O as d
+};

package/dist/CopyButton.js

@@ -1,33 +1,32 @@
 "use client"
 /* */
 import o from "react";
-import p from "copy-to-clipboard";
-import { B as a } from "./Button-CUr754ra.js";
+import a from "copy-to-clipboard";
+import { B as c } from "./Button-CdGfSPx-.js";
 import "@tabler/icons-react";
-import "clsx";
-import "html-react-parser";
-import { C as i } from "./ClearPropsContext-CeCMjUK9.js";
+import "./Icon-DVRBNZZe.js";
+import { I as i } from "./IconCopy-Dg12Fbk9.js";
+import { useLocalizedStringFormatter as l } from "react-aria";
+import { a as s, T as f } from "./TooltipTrigger-TslkLN5s.js";
+import { onlyText as u } from "react-children-utilities";
+import { C as y } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
-import { f as c } from "./flowComponent-Dfn_Z9Yx.js";
-import { I as l } from "./IconCopy-BmKbdWWX.js";
-import { useLocalizedStringFormatter as s } from "react-aria";
-import { a as u, T as f } from "./TooltipTrigger-TslkLN5s.js";
-import { onlyText as y } from "react-children-utilities";
-import { A as C } from "./Action-CeKzQsag.js";
-const E = {
+import { f as C } from "./flowComponent-CEo3pjEA.js";
+import { A as E } from "./Action-DZzRGFBL.js";
+const B = {
   "de-DE": {
     "copyButton.copy": "Kopieren"
   },
   "en-EN": {
     "copyButton.copy": "Copy"
   }
-}, R = c("CopyButton", (r) => {
-  const { text: e, ...m } = r, t = s(E).format("copyButton.copy"), n = () => {
-    p(y(e));
+}, R = C("CopyButton", (r) => {
+  const { text: e, ref: m, ...n } = r, t = l(B).format("copyButton.copy"), p = () => {
+    a(u(e));
   };
-  return /* @__PURE__ */ o.createElement(i, null, /* @__PURE__ */ o.createElement(u, null, /* @__PURE__ */ o.createElement(C, { action: n, feedback: !0 }, /* @__PURE__ */ o.createElement(a, { "aria-label": t, ...m }, /* @__PURE__ */ o.createElement(l, null))), /* @__PURE__ */ o.createElement(f, null, t)));
+  return /* @__PURE__ */ o.createElement(y, null, /* @__PURE__ */ o.createElement(s, null, /* @__PURE__ */ o.createElement(E, { action: p, feedback: !0 }, /* @__PURE__ */ o.createElement(c, { "aria-label": t, ...n, ref: m }, /* @__PURE__ */ o.createElement(i, null))), /* @__PURE__ */ o.createElement(f, null, t)));
 });
 export {
   R as CopyButton,

package/dist/FieldDescription.js

@@ -1,20 +1,20 @@
 "use client"
 /* */
-import t from "react";
-import l from "clsx";
-import { C as n } from "./ClearPropsContext-CeCMjUK9.js";
+import e from "react";
+import n from "clsx";
+import { C as c } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
-import { T as c } from "./Text-2sThcKor.js";
-import { f as m } from "./flowComponent-Dfn_Z9Yx.js";
-const p = "flow--field-description", a = {
-  fieldDescription: p
-}, E = m("FieldDescription", (e) => {
-  const { children: o, className: r, ...i } = e, s = l(a.fieldDescription, r);
-  return /* @__PURE__ */ t.createElement(n, null, /* @__PURE__ */ t.createElement(c, { slot: "description", ...i, className: s }, o));
+import { T as m } from "./Text-D7C_T7CE.js";
+import { f as p } from "./flowComponent-CEo3pjEA.js";
+const a = "flow--field-description", f = {
+  fieldDescription: a
+}, F = p("FieldDescription", (t) => {
+  const { children: o, className: r, ref: i, ...s } = t, l = n(f.fieldDescription, r);
+  return /* @__PURE__ */ e.createElement(c, null, /* @__PURE__ */ e.createElement(m, { slot: "description", ...s, className: l, ref: i }, o));
 });
 export {
-  E as FieldDescription,
-  E as default
+  F as FieldDescription,
+  F as default
 };

package/dist/FieldError-CBxCl2nS.js

@@ -0,0 +1,22 @@
+"use client"
+/* */
+import r from "react";
+import * as a from "react-aria-components";
+import i from "clsx";
+import { C as c } from "./ClearPropsContext-CeCMjUK9.js";
+import "./propsContext-CauylOgH.js";
+import "@react-aria/utils";
+import "remeda";
+import "@tabler/icons-react";
+import "./Icon-DVRBNZZe.js";
+import { I as p } from "./IconDanger-BKH4QbJ1.js";
+import { f } from "./flowComponent-CEo3pjEA.js";
+const E = "flow--field-error", d = {
+  fieldError: E
+}, y = f("FieldError", (o) => {
+  const { children: e, className: t, ref: l, ...m } = o, s = i(d.fieldError, t);
+  return /* @__PURE__ */ r.createElement(c, null, /* @__PURE__ */ r.createElement(a.FieldError, { ...m, className: s, ref: l }, ({ validationErrors: n }) => /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(p, { size: "s" }), /* @__PURE__ */ r.createElement("span", null, e || n.join(" ")))));
+});
+export {
+  y as F
+};

package/dist/FieldError.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { F as o } from "./FieldError-D9ZaMqoL.js";
+import { F as o } from "./FieldError-CBxCl2nS.js";
 export {
   o as FieldError,
   o as default

package/dist/Header.js

@@ -1,10 +1,10 @@
 "use client"
 /* */
-import a from "react";
-import { f as m } from "./flowComponent-Dfn_Z9Yx.js";
-const s = m("Header", (e) => {
-  const { children: t, elementType: r = "header", ...o } = e, n = r;
-  return /* @__PURE__ */ a.createElement(n, { ...o }, t);
+import m from "react";
+import { f as c } from "./flowComponent-CEo3pjEA.js";
+const s = c("Header", (e) => {
+  const { children: t, ref: r, elementType: o = "header", ...n } = e, a = o;
+  return /* @__PURE__ */ m.createElement(a, { ...n, ref: r }, t);
 });
 export {
   s as Header,

package/dist/Heading.js

@@ -1,28 +1,28 @@
 "use client"
 /* */
-import o from "react";
-import c from "clsx";
-import { C as l } from "./ClearPropsContext-CeCMjUK9.js";
-import { P as p } from "./PropsContextProvider-BcOGMJkn.js";
+import e from "react";
+import l from "clsx";
+import { C as p } from "./ClearPropsContext-CeCMjUK9.js";
+import { P as d } from "./PropsContextProvider-BcOGMJkn.js";
 import "@react-aria/utils";
 import "./propsContext-CauylOgH.js";
 import "remeda";
-import { f as d } from "./flowComponent-Dfn_Z9Yx.js";
-import * as f from "react-aria-components";
-const g = "flow--heading", h = "flow--heading--icon", e = {
-  heading: g,
-  icon: h
-}, v = d("Heading", (t) => {
-  const { children: r, className: n, level: a = 2, ...s } = t, i = c(e.heading, n), m = {
+import { f } from "./flowComponent-CEo3pjEA.js";
+import * as g from "react-aria-components";
+const h = "flow--heading", C = "flow--heading--icon", o = {
+  heading: h,
+  icon: C
+}, y = f("Heading", (t) => {
+  const { children: r, className: n, level: a = 2, ref: s, ...i } = t, m = l(o.heading, n), c = {
     Icon: {
       "aria-hidden": !0,
       size: "s",
-      className: e.icon
+      className: o.icon
     }
   };
-  return /* @__PURE__ */ o.createElement(l, null, /* @__PURE__ */ o.createElement(f.Heading, { level: a, className: i, ...s }, /* @__PURE__ */ o.createElement(p, { props: m }, r)));
+  return /* @__PURE__ */ e.createElement(p, null, /* @__PURE__ */ e.createElement(g.Heading, { level: a, className: m, ...i, ref: s }, /* @__PURE__ */ e.createElement(d, { props: c }, r)));
 });
 export {
-  v as Heading,
-  v as default
+  y as Heading,
+  y as default
 };

package/dist/{Icon-DnhU6oCr.js → Icon-DVRBNZZe.js}

@@ -7,7 +7,7 @@ import { C as w } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
-import { f as z } from "./flowComponent-Dfn_Z9Yx.js";
+import { f as z } from "./flowComponent-CEo3pjEA.js";
 const b = "flow--icon", c = {
   icon: b,
   "size-m": "flow--icon--size-m",

package/dist/Icon.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { I as a } from "./Icon-DnhU6oCr.js";
+import { I as a } from "./Icon-DVRBNZZe.js";
 export {
   a as Icon,
   a as default