@mittwald/flow-react-components 0.1.0-alpha.37 → 0.1.0-alpha.370

package/dist/js/ContextMenuTrigger-hgBQbWcZ.js

@@ -0,0 +1,96 @@
+"use client"
+/* */
+import e from "react";
+import * as i from "react-aria-components";
+import { s as y } from "./ContextMenu.module-_LC3xtX0.js";
+import { f as s } from "./flowComponent-Bs2i5Rrn.js";
+import { P } from "./Popover-DO6LcoKP.js";
+import { C as E } from "./ClearPropsContext-CUvsbMn8.js";
+import { PropsContextProvider as A } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "./propsContext-DzAKlmhS.js";
+import "remeda";
+import "mobx";
+import { u as O } from "./useOverlayController-BwSJj4Ly.js";
+import { O as T, a as S } from "./OverlayTrigger-j2zD8W4S.js";
+import { A as h } from "./Action-CoAr9soG.js";
+const B = s("ContextMenu", (t) => {
+  const {
+    children: r,
+    onAction: n,
+    selectionMode: o,
+    selectedKeys: c,
+    defaultSelectedKeys: m,
+    disabledKeys: p,
+    onSelectionChange: C,
+    refProp: u,
+    controller: v,
+    ...g
+  } = t, x = O("ContextMenu", {
+    reuseControllerFromContext: !0
+  }), l = v ?? x, M = o === "navigation" ? "none" : o, a = o === "navigation" ? "navigation" : "control", d = {
+    MenuItem: {
+      selectionVariant: a,
+      Avatar: {
+        size: "l"
+      }
+    },
+    Section: {
+      MenuItem: {
+        selectionVariant: a,
+        Avatar: {
+          size: "l"
+        }
+      },
+      renderContextMenuSection: !0
+    }
+  }, f = o === "single" || o === "navigation" ? "ContextMenu" : void 0;
+  return /* @__PURE__ */ e.createElement(E, null, /* @__PURE__ */ e.createElement(
+    P,
+    {
+      ...g,
+      controller: l,
+      isDialogContent: !1,
+      padding: "s"
+    },
+    /* @__PURE__ */ e.createElement(
+      T,
+      {
+        type: "ContextMenu",
+        controller: l
+      },
+      /* @__PURE__ */ e.createElement(
+        i.Menu,
+        {
+          className: y.contextMenu,
+          onAction: n,
+          selectionMode: M,
+          selectedKeys: c,
+          defaultSelectedKeys: m,
+          disabledKeys: p,
+          onSelectionChange: C,
+          ref: u
+        },
+        /* @__PURE__ */ e.createElement(A, { props: d }, /* @__PURE__ */ e.createElement(h, { closeOverlay: f }, r))
+      )
+    )
+  ));
+}), G = s(
+  "ContextMenuTrigger",
+  (t) => {
+    const { children: r, ...n } = t;
+    return /* @__PURE__ */ e.createElement(
+      S,
+      {
+        overlayType: "ContextMenu",
+        ...n,
+        component: i.MenuTrigger
+      },
+      r
+    );
+  }
+);
+export {
+  B as C,
+  G as a
+};

package/dist/js/ContextualHelp.js

@@ -0,0 +1,66 @@
+"use client"
+/* */
+import t from "react";
+import { P as c } from "./Popover-DO6LcoKP.js";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as l } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+import { f as a } from "./flowComponent-Bs2i5Rrn.js";
+import "mobx";
+import { u } from "./useOverlayController-BwSJj4Ly.js";
+import * as f from "react-aria-components";
+import { a as x } from "./OverlayTrigger-j2zD8W4S.js";
+import { useLocalizedStringFormatter as g } from "react-aria";
+import "@tabler/icons-react";
+import "./Icon-Czc5vOtx.js";
+import { I as C } from "./IconInfo-HXrweZ3Z.js";
+const H = "flow--contextual-help", d = {
+  contextualHelp: H
+}, b = a("ContextualHelp", (e) => {
+  const {
+    children: o,
+    controller: r,
+    refProp: m,
+    ...n
+  } = e, p = u("ContextualHelp", {
+    reuseControllerFromContext: !0
+  }), i = r ?? p, s = {
+    Heading: {
+      level: 5
+    }
+  };
+  return /* @__PURE__ */ t.createElement(c, { withTip: !0, ...n, controller: i }, /* @__PURE__ */ t.createElement(l, { props: s }, /* @__PURE__ */ t.createElement("div", { className: d.contextualHelp }, o)));
+}), v = { "de-DE": {
+  "contextualHelpButton.moreInformation": "Weitere Informationen"
+}, "en-EN": {
+  "contextualHelpButton.moreInformation": "More information"
+} }, A = a(
+  "ContextualHelpTrigger",
+  (e) => {
+    const { children: o, ...r } = e, n = {
+      Button: {
+        "aria-label": g(v).format(
+          "contextualHelpButton.moreInformation"
+        ),
+        children: /* @__PURE__ */ t.createElement(C, null),
+        size: "s",
+        variant: "plain"
+      }
+    };
+    return /* @__PURE__ */ t.createElement(
+      x,
+      {
+        overlayType: "ContextualHelp",
+        ...r,
+        component: f.DialogTrigger
+      },
+      /* @__PURE__ */ t.createElement(l, { props: n, mergeInParentContext: !0 }, o)
+    );
+  }
+);
+export {
+  b as ContextualHelp,
+  A as ContextualHelpTrigger,
+  b as default
+};

package/dist/js/CopyButton-DGh9PSAb.js

@@ -0,0 +1,40 @@
+"use client"
+/* */
+import o from "react";
+import i from "copy-to-clipboard";
+import { B as c } from "./Button-BWusarCg.js";
+import "@tabler/icons-react";
+import "./Icon-Czc5vOtx.js";
+import { I as l } from "./IconCopy-DfWYL8oQ.js";
+import { useLocalizedStringFormatter as s } from "react-aria";
+import { a as f, T as u } from "./Tooltip-D5QM-BbC.js";
+import { onlyText as y } from "react-children-utilities";
+import { C } from "./ClearPropsContext-CUvsbMn8.js";
+import "./propsContext-DzAKlmhS.js";
+import "@react-aria/utils";
+import "remeda";
+import "dot-prop";
+import { f as E } from "./flowComponent-Bs2i5Rrn.js";
+import { A as B } from "./Action-CoAr9soG.js";
+const g = { "de-DE": {
+  "copyButton.copy": "Kopieren"
+}, "en-EN": {
+  "copyButton.copy": "Copy"
+} }, R = E("CopyButton", (r) => {
+  const { text: e, refProp: n, variant: p = "plain", ...m } = r, t = s(g).format("copyButton.copy"), a = () => {
+    i(y(e));
+  };
+  return /* @__PURE__ */ o.createElement(C, null, /* @__PURE__ */ o.createElement(f, null, /* @__PURE__ */ o.createElement(B, { action: a, showFeedback: !0 }, /* @__PURE__ */ o.createElement(
+    c,
+    {
+      "aria-label": t,
+      ...m,
+      ref: n,
+      variant: p
+    },
+    /* @__PURE__ */ o.createElement(l, null)
+  )), /* @__PURE__ */ o.createElement(u, null, t)));
+});
+export {
+  R as C
+};

package/dist/js/CopyButton.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { C as t } from "./CopyButton-DGh9PSAb.js";
+export {
+  t as CopyButton,
+  t as default
+};

package/dist/js/CounterBadge.js

@@ -0,0 +1,15 @@
+"use client"
+/* */
+import s from "react";
+import c from "clsx";
+import { f as m } from "./flowComponent-Bs2i5Rrn.js";
+const u = "flow--counter-badge", d = {
+  counterBadge: u
+}, g = m("CounterBadge", (o) => {
+  const { className: t, count: e, refProp: r, ...a } = o, n = c(d.counterBadge, t);
+  return /* @__PURE__ */ s.createElement("span", { className: n, ...a, "aria-hidden": !0, ref: r }, e && e > 99 ? "99+" : e);
+});
+export {
+  g as CounterBadge,
+  g as default
+};

package/dist/js/DatePicker.js

@@ -0,0 +1,67 @@
+"use client"
+/* */
+import e from "react";
+import f from "clsx";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as u } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+import * as r from "react-aria-components";
+import { B as E } from "./Button-BWusarCg.js";
+import "@tabler/icons-react";
+import "./Icon-Czc5vOtx.js";
+import { a as C } from "./IconCalendar-CacKT2Kt.js";
+import { F as D } from "./FieldError-1vrCcwXu.js";
+import { f as a } from "./FormField.module-CqWpTQKP.js";
+import { P as N } from "./Popover-DO6LcoKP.js";
+import "mobx";
+import { u as P } from "./useOverlayController-BwSJj4Ly.js";
+import { f as y } from "./flowComponent-Bs2i5Rrn.js";
+import { s as F, C as b } from "./CalendarHeader-BUz0ekXP.js";
+const g = "flow--date-picker--date-input", v = {
+  dateInput: g
+}, I = (t) => {
+  const { isDisabled: l } = t;
+  return /* @__PURE__ */ e.createElement(r.Group, { className: v.dateInput }, /* @__PURE__ */ e.createElement(r.DateInput, null, (n) => /* @__PURE__ */ e.createElement(r.DateSegment, { segment: n })), /* @__PURE__ */ e.createElement(E, { variant: "plain", color: "secondary", isDisabled: l }, /* @__PURE__ */ e.createElement(C, null)));
+}, h = () => /* @__PURE__ */ e.createElement(r.Calendar, { className: F.calendar }, /* @__PURE__ */ e.createElement(b, null), /* @__PURE__ */ e.createElement(r.CalendarGrid, { weekdayStyle: "short" }, (t) => /* @__PURE__ */ e.createElement(r.CalendarCell, { date: t }))), K = y("DatePicker", (t) => {
+  const { children: l, className: n, errorMessage: i, onChange: m, ...c } = t, p = f(a.formField, n), d = {
+    Label: {
+      className: a.label,
+      optional: !t.isRequired
+    },
+    FieldDescription: {
+      className: a.fieldDescription
+    },
+    FieldError: {
+      className: a.customFieldError
+    }
+  }, o = P("Popover");
+  return /* @__PURE__ */ e.createElement(
+    r.DatePicker,
+    {
+      ...c,
+      className: p,
+      onOpenChange: (s) => o.setOpen(s),
+      isOpen: o.isOpen,
+      onChange: (s) => {
+        m && m(s), o.close();
+      }
+    },
+    /* @__PURE__ */ e.createElement(I, { isDisabled: t.isDisabled }),
+    /* @__PURE__ */ e.createElement(u, { props: d }, l),
+    /* @__PURE__ */ e.createElement(D, { className: a.fieldError }, i),
+    /* @__PURE__ */ e.createElement(
+      N,
+      {
+        placement: "bottom end",
+        isDialogContent: !0,
+        controller: o
+      },
+      /* @__PURE__ */ e.createElement(h, null)
+    )
+  );
+});
+export {
+  K as DatePicker,
+  K as default
+};

package/dist/js/DateRangePicker.js

@@ -0,0 +1,67 @@
+"use client"
+/* */
+import e from "react";
+import { f as n } from "./FormField.module-CqWpTQKP.js";
+import c from "clsx";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as f } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+import * as t from "react-aria-components";
+import { P as g } from "./Popover-DO6LcoKP.js";
+import { s as i, C } from "./CalendarHeader-BUz0ekXP.js";
+import { B as D } from "./Button-BWusarCg.js";
+import "@tabler/icons-react";
+import "./Icon-Czc5vOtx.js";
+import { a as R } from "./IconCalendar-CacKT2Kt.js";
+import { F as N } from "./FieldError-1vrCcwXu.js";
+import "mobx";
+import { u as P } from "./useOverlayController-BwSJj4Ly.js";
+import { f as v } from "./flowComponent-Bs2i5Rrn.js";
+const F = () => /* @__PURE__ */ e.createElement(t.RangeCalendar, { className: c(i.calendar, i.range) }, /* @__PURE__ */ e.createElement(C, null), /* @__PURE__ */ e.createElement(t.CalendarGrid, null, (r) => /* @__PURE__ */ e.createElement(t.CalendarCell, { date: r }))), I = "flow--date-range-picker--date-range-input", b = {
+  dateRangeInput: I
+}, h = (r) => {
+  const { isDisabled: l } = r;
+  return /* @__PURE__ */ e.createElement(t.Group, { className: b.dateRangeInput }, /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(t.DateInput, { slot: "start" }, (a) => /* @__PURE__ */ e.createElement(t.DateSegment, { segment: a })), /* @__PURE__ */ e.createElement("span", { "aria-hidden": "true" }, "–"), /* @__PURE__ */ e.createElement(t.DateInput, { slot: "end" }, (a) => /* @__PURE__ */ e.createElement(t.DateSegment, { segment: a }))), /* @__PURE__ */ e.createElement(D, { variant: "plain", color: "secondary", isDisabled: l }, /* @__PURE__ */ e.createElement(R, null)));
+}, K = v("DateRangePicker", (r) => {
+  const { children: l, className: a, errorMessage: p, onChange: m, ...d } = r, u = c(n.formField, a), E = {
+    Label: {
+      className: n.label,
+      optional: !r.isRequired
+    },
+    FieldDescription: {
+      className: n.fieldDescription
+    },
+    FieldError: {
+      className: n.customFieldError
+    }
+  }, o = P("Popover");
+  return /* @__PURE__ */ e.createElement(
+    t.DateRangePicker,
+    {
+      ...d,
+      className: u,
+      onOpenChange: (s) => o.setOpen(s),
+      isOpen: o.isOpen,
+      onChange: (s) => {
+        m && m(s), o.close();
+      }
+    },
+    /* @__PURE__ */ e.createElement(h, { isDisabled: r.isDisabled }),
+    /* @__PURE__ */ e.createElement(f, { props: E }, l),
+    /* @__PURE__ */ e.createElement(N, { className: n.fieldError }, p),
+    /* @__PURE__ */ e.createElement(
+      g,
+      {
+        placement: "bottom end",
+        isDialogContent: !0,
+        controller: o
+      },
+      /* @__PURE__ */ e.createElement(F, null)
+    )
+  );
+});
+export {
+  K as DateRangePicker,
+  K as default
+};

package/dist/js/EmulatedBoldText-Dtox8Wd1.js

@@ -0,0 +1,14 @@
+"use client"
+/* */
+import t from "react";
+import m from "clsx";
+const c = "flow--emulated-bold-text", r = "flow--emulated-bold-text--bold-text", l = {
+  emulatedBoldText: c,
+  boldText: r
+}, u = (o) => {
+  const { children: e, className: a, ...s } = o, d = m(l.emulatedBoldText, a);
+  return /* @__PURE__ */ t.createElement("span", { className: d, ...s }, e, /* @__PURE__ */ t.createElement("span", { "aria-hidden": "true", className: l.boldText }, e));
+};
+export {
+  u as E
+};

package/dist/js/EmulatedBoldText.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { E as a } from "./EmulatedBoldText-Dtox8Wd1.js";
+export {
+  a as EmulatedBoldText,
+  a as default
+};

package/dist/js/FieldDescription-Cd3lRw7h.js

@@ -0,0 +1,20 @@
+"use client"
+/* */
+import o from "react";
+import m from "clsx";
+import { C as n } from "./ClearPropsContext-CUvsbMn8.js";
+import "./propsContext-DzAKlmhS.js";
+import "@react-aria/utils";
+import "remeda";
+import "dot-prop";
+import { T as p } from "./Text-B2VXg-aU.js";
+import { f as c } from "./flowComponent-Bs2i5Rrn.js";
+const a = "flow--field-description", f = {
+  fieldDescription: a
+}, P = c("FieldDescription", (e) => {
+  const { children: t, className: r, refProp: i, ...s } = e, l = m(f.fieldDescription, r);
+  return /* @__PURE__ */ o.createElement(n, null, /* @__PURE__ */ o.createElement(p, { slot: "description", ...s, className: l, ref: i }, t));
+});
+export {
+  P as F
+};

package/dist/js/FieldDescription.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { F as i } from "./FieldDescription-Cd3lRw7h.js";
+export {
+  i as FieldDescription,
+  i as default
+};

package/dist/js/FieldError-1vrCcwXu.js

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

package/dist/js/FieldError.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { F as o } from "./FieldError-1vrCcwXu.js";
+export {
+  o as FieldError,
+  o as default
+};

package/dist/js/FileCard.js

@@ -0,0 +1,84 @@
+"use client"
+/* */
+import e from "react";
+import { I as b, a as w } from "./IconImage-KRg2_926.js";
+import "@tabler/icons-react";
+import "./Icon-Czc5vOtx.js";
+import { A as m } from "./Avatar-qAB7Of-8.js";
+import { I as N } from "./Image-7Aa5OZPs.js";
+import { T as i } from "./Text-B2VXg-aU.js";
+import y from "clsx";
+import { f as g } from "./flowComponent-Bs2i5Rrn.js";
+import { L as x } from "./Link-B-ss8Inh.js";
+import { W as B } from "./Wrap-DGT1h1o3.js";
+import { B as F } from "./Button-BWusarCg.js";
+import { I as T } from "./IconClose-Cczxm95W.js";
+import { useLocalizedStringFormatter as k } from "react-aria";
+const v = (l) => {
+  const { type: t, imageSrc: r } = l;
+  return r ? /* @__PURE__ */ e.createElement(m, null, /* @__PURE__ */ e.createElement(N, { src: r })) : /* @__PURE__ */ e.createElement(m, { color: "blue" }, t != null && t.startsWith("image") ? /* @__PURE__ */ e.createElement(b, null) : /* @__PURE__ */ e.createElement(w, null));
+}, z = "flow--file-card", D = "flow--file-card--link", S = "flow--file-card--text", A = "flow--file-card--title", L = "flow--file-card--sub-title", W = "flow--file-card--delete-button", a = {
+  fileCard: z,
+  link: D,
+  text: S,
+  title: A,
+  subTitle: L,
+  deleteButton: W
+}, h = (l) => {
+  const { sizeInBytes: t } = l;
+  return /* @__PURE__ */ e.createElement(i, { className: a.subTitle }, new Intl.NumberFormat(void 0, {
+    notation: "compact",
+    style: "unit",
+    unit: "byte",
+    unitDisplay: "narrow"
+  }).format(t));
+}, P = { "de-DE": {
+  "fileCard.delete": "Entfernen"
+}, "en-EN": {
+  "fileCard.delete": "delete"
+} }, R = (l) => {
+  const { onDelete: t } = l, r = k(P);
+  return /* @__PURE__ */ e.createElement(
+    F,
+    {
+      className: a.deleteButton,
+      "aria-label": r.format("fileCard.delete"),
+      size: "s",
+      variant: "plain",
+      color: "secondary",
+      onPress: t
+    },
+    /* @__PURE__ */ e.createElement(T, null)
+  );
+}, Z = g("FileCard", (l) => {
+  const {
+    onDelete: t,
+    type: r,
+    sizeInBytes: n,
+    name: c,
+    className: f,
+    elementType: d = "div",
+    onPress: o,
+    href: s,
+    target: u,
+    download: p,
+    imageSrc: E
+  } = l, C = y(a.fileCard, f), I = d;
+  return /* @__PURE__ */ e.createElement(I, { className: C }, /* @__PURE__ */ e.createElement(B, { if: s || o }, /* @__PURE__ */ e.createElement(
+    x,
+    {
+      className: a.link,
+      unstyled: !0,
+      href: s,
+      onPress: o,
+      target: u,
+      download: p
+    },
+    /* @__PURE__ */ e.createElement(v, { type: r, imageSrc: E }),
+    /* @__PURE__ */ e.createElement("span", { className: a.text }, /* @__PURE__ */ e.createElement(i, { className: a.title }, /* @__PURE__ */ e.createElement("b", null, c)), n && /* @__PURE__ */ e.createElement(h, { sizeInBytes: n }))
+  )), t && /* @__PURE__ */ e.createElement(R, { onDelete: t }));
+});
+export {
+  Z as FileCard,
+  Z as default
+};

package/dist/js/FileCardList.js

@@ -0,0 +1,18 @@
+"use client"
+/* */
+import e from "react";
+import { C as p } from "./ColumnLayout-BhsG7J-Z.js";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as s } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+const u = (t) => {
+  const { className: r, ...o } = t, m = {
+    FileCard: { elementType: "li" }
+  };
+  return /* @__PURE__ */ e.createElement(s, { props: m }, /* @__PURE__ */ e.createElement(p, { elementType: "ul", className: r, ...o }));
+};
+export {
+  u as FileCardList,
+  u as default
+};

package/dist/js/FileField.js

@@ -0,0 +1,89 @@
+"use client"
+/* */
+import { f as d } from "./FormField.module-CqWpTQKP.js";
+import { useFormValidation as F } from "@react-aria/form";
+import { useFormValidationState as g } from "@react-stately/form";
+import i, { forwardRef as E, useRef as P, useMemo as y } from "react";
+import * as I from "react-aria-components";
+import { InputContext as R, FieldErrorContext as x } from "react-aria-components";
+import { useObjectRef as C } from "@react-aria/utils";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as f } from "./PropsContextProvider.js";
+import "remeda";
+import { f as b } from "./flowComponent-Bs2i5Rrn.js";
+const V = "flow--file-field--trigger", h = {
+  trigger: V
+}, N = E(
+  (a, m) => {
+    const { children: c, isDisabled: l, onChange: e } = a, o = C(m), n = () => {
+      var r, t;
+      (r = o.current) != null && r.value && (o.current.value = "", e == null || e(null)), (t = o.current) == null || t.click();
+    }, p = (r) => {
+      e == null || e(r.target.files);
+    }, s = {
+      Button: {
+        onPress: n,
+        className: h.trigger,
+        isDisabled: l
+      }
+    };
+    return /* @__PURE__ */ i.createElement(f, { props: s, mergeInParentContext: !0 }, c, /* @__PURE__ */ i.createElement(
+      I.Input,
+      {
+        style: { display: "none" },
+        type: "file",
+        ref: o,
+        onChange: p
+      }
+    ));
+  }
+), M = b("FileField", (a) => {
+  const {
+    children: m,
+    refProp: c,
+    isRequired: l,
+    isInvalid: e,
+    isDisabled: o,
+    validationBehavior: n,
+    onChange: p,
+    ...s
+  } = a, r = P(null), t = g({
+    value: void 0,
+    validationBehavior: n,
+    isInvalid: e
+  });
+  F({ validationBehavior: n }, t, r);
+  const u = y(
+    () => ({
+      ...s,
+      ref: r,
+      "aria-invalid": t.displayValidation.isInvalid,
+      value: void 0
+    }),
+    [t, l, ...Object.values(s)]
+  ), v = {
+    Label: {
+      className: d.label,
+      optional: !a.isRequired
+    },
+    FieldDescription: {
+      className: d.fieldDescription
+    },
+    FieldError: {
+      className: d.customFieldError
+    }
+  };
+  return /* @__PURE__ */ i.createElement(R.Provider, { value: u }, /* @__PURE__ */ i.createElement(x.Provider, { value: t.displayValidation }, /* @__PURE__ */ i.createElement(f, { props: v }, /* @__PURE__ */ i.createElement(
+    "div",
+    {
+      "data-required": !!l || void 0,
+      "data-invalid": t.displayValidation.isInvalid || void 0,
+      className: d.formField
+    },
+    /* @__PURE__ */ i.createElement(N, { ref: c, onChange: p, isDisabled: o }, m)
+  ))));
+});
+export {
+  M as FileField,
+  M as default
+};

package/dist/js/FormField.module-CqWpTQKP.js

@@ -0,0 +1,12 @@
+"use client"
+/* */
+const o = "flow--form-field", r = "flow--form-field--label", l = "flow--form-field--field-error", e = "flow--form-field--custom-field-error", f = "flow--form-field--field-description", i = {
+  formField: o,
+  label: r,
+  fieldError: l,
+  customFieldError: e,
+  fieldDescription: f
+};
+export {
+  i as f
+};