@mittwald/flow-react-components 0.1.0-alpha.8 → 0.1.0-alpha.80

package/dist/LoadingSpinner-BOBbSYun.js

@@ -0,0 +1,17 @@
+"use client"
+/* */
+import r from "react";
+import "@tabler/icons-react";
+import "./Icon-DwHDa4pA.js";
+import { I as e } from "./IconPending-CyQhZCfI.js";
+import t from "clsx";
+const a = "flow--loading-spinner", p = "flow--loading-spinner--spin", l = {
+  loadingSpinner: a,
+  spin: p
+}, S = (n) => {
+  const { className: o, ...s } = n, i = t(l.loadingSpinner, o);
+  return /* @__PURE__ */ r.createElement(e, { className: i, ...s });
+};
+export {
+  S as L
+};

package/dist/LoadingSpinner.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { L as o } from "./LoadingSpinner-BOBbSYun.js";
+export {
+  o as LoadingSpinner,
+  o as default
+};

package/dist/MenuItem-Bi8sYht4.js

@@ -0,0 +1,49 @@
+"use client"
+/* */
+import e from "react";
+import * as I from "react-aria-components";
+import p from "clsx";
+import "./propsContext-CauylOgH.js";
+import { P as a } from "./PropsContextProvider-DZvwqHLP.js";
+import "@react-aria/utils";
+import "remeda";
+import "@tabler/icons-react";
+import "./Icon-DwHDa4pA.js";
+import { I as x, a as d } from "./IconCheckboxEmpty-BlU9hQOh.js";
+import { I as E, a as C } from "./IconRadioOn-ghpksMxd.js";
+import { T as i } from "./Text-CKd46eHq.js";
+import { d as h } from "./deepFindOfType-6pG0fH7S.js";
+import { W as M } from "./Wrap-DGT1h1o3.js";
+import { f as N } from "./flowComponent-dvQga3NG.js";
+const w = "flow--menu-item", T = "flow--menu-item--icon", g = "flow--menu-item--text", P = "flow--menu-item--control-icon", c = {
+  menuItem: w,
+  icon: T,
+  text: g,
+  controlIcon: P
+}, k = (o, t) => !!h(o, t), y = (o) => {
+  const {
+    selectionMode: t,
+    isSelected: n,
+    selectionVariant: r = "control",
+    children: m
+  } = o, s = {
+    Icon: {
+      className: c.icon
+    },
+    Text: {
+      className: c.text
+    }
+  }, l = {
+    Icon: {
+      className: p(c.controlIcon, c.icon)
+    }
+  }, u = t === "none" || r === "navigation" ? null : t === "single" && n ? /* @__PURE__ */ e.createElement(E, null) : t === "single" && !n ? /* @__PURE__ */ e.createElement(C, null) : t === "multiple" && n ? /* @__PURE__ */ e.createElement(x, null) : /* @__PURE__ */ e.createElement(d, null), f = k(m, i);
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(a, { props: l }, u), /* @__PURE__ */ e.createElement(a, { props: s }, /* @__PURE__ */ e.createElement(M, { if: !f }, /* @__PURE__ */ e.createElement(i, null, m))));
+}, D = N("MenuItem", (o) => {
+  const { children: t, className: n, selectionVariant: r, ...m } = o, s = p(c.menuItem, n);
+  return /* @__PURE__ */ e.createElement(I.MenuItem, { ...m, className: s }, (l) => /* @__PURE__ */ e.createElement(y, { ...l, selectionVariant: r }, t));
+});
+export {
+  D as M,
+  k as d
+};

package/dist/MenuItem.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { M as t } from "./MenuItem-Bi8sYht4.js";
+export {
+  t as MenuItem,
+  t as default
+};

package/dist/Modal.js

@@ -0,0 +1,80 @@
+"use client"
+/* */
+import * as n from "react-aria-components";
+import { DialogTrigger as q } from "react-aria-components";
+import o, { useContext as O, useEffect as r } from "react";
+import w from "clsx";
+import "./propsContext-CauylOgH.js";
+import { P as C } from "./PropsContextProvider-DZvwqHLP.js";
+import "@react-aria/utils";
+import "remeda";
+import { TunnelProvider as y, TunnelExit as x } from "@mittwald/react-tunnel";
+import { u as z, a as E } from "./index-ViVxK7d1.js";
+const b = "flow--modal--overlay", T = "flow--modal", N = "flow--modal--dialog", P = "flow--modal--button-group", G = "flow--modal--content", I = "flow--modal--off-canvas", t = {
+  overlay: b,
+  "modal-fade": "flow--modal--modal-fade",
+  modal: T,
+  "modal-zoom": "flow--modal--modal-zoom",
+  dialog: N,
+  buttonGroup: P,
+  content: G,
+  "size-s": "flow--modal--size-s",
+  "size-m": "flow--modal--size-m",
+  "size-l": "flow--modal--size-l",
+  offCanvas: I,
+  "modal-slide-in": "flow--modal--modal-slide-in",
+  "modal-slide-up": "flow--modal--modal-slide-up"
+}, M = (a) => {
+  const e = O(n.OverlayTriggerStateContext), l = a.useIsOpen();
+  r(() => {
+    e && a.setOpen(e.isOpen);
+  }, [e == null ? void 0 : e.isOpen]), r(() => {
+    e && e.setOpen(l);
+  }, [l]);
+}, $ = (a) => {
+  const {
+    size: e = "s",
+    offCanvas: l,
+    state: m,
+    defaultOpen: i,
+    children: d,
+    ...c
+  } = a, f = z({
+    reuseControllerFromContext: !1,
+    defaultOpen: i
+  }), s = m ?? f, p = s.useIsOpen();
+  M(s);
+  const u = w(
+    t.modal,
+    t[`size-${e}`],
+    l && t.offCanvas
+  ), v = {
+    Content: {
+      elementType: o.Fragment
+    },
+    Heading: {
+      level: 2,
+      slot: "title"
+    },
+    ButtonGroup: {
+      className: t.buttonGroup,
+      tunnelId: "buttons"
+    }
+  };
+  return /* @__PURE__ */ o.createElement(
+    n.ModalOverlay,
+    {
+      className: t.overlay,
+      ...c,
+      isDismissable: !0,
+      isOpen: p,
+      onOpenChange: (g) => s.setOpen(g)
+    },
+    /* @__PURE__ */ o.createElement(n.Modal, { className: u }, /* @__PURE__ */ o.createElement(n.Dialog, { className: t.dialog }, /* @__PURE__ */ o.createElement(E, { value: s }, /* @__PURE__ */ o.createElement(C, { props: v }, /* @__PURE__ */ o.createElement(y, null, /* @__PURE__ */ o.createElement("div", { className: t.content }, d), /* @__PURE__ */ o.createElement(x, { id: "buttons" }))))))
+  );
+};
+export {
+  $ as Modal,
+  q as ModalTrigger,
+  $ as default
+};

package/dist/Navigation.js

@@ -1,53 +1,51 @@
 "use client"
 /* */
-import a from "react";
-import { useTreeState as p, Item as v } from "react-stately";
-import "./propsContext-1HT-3SRC.js";
-import { P as g } from "./PropsContextProvider-1ZntTV8J.js";
+import t, { useId as m } from "react";
+import g from "clsx";
+import { d as v } from "./deepFindOfType-6pG0fH7S.js";
+import { W as d } from "./Wrap-DGT1h1o3.js";
+import "./propsContext-CauylOgH.js";
+import { P as u } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
-import * as l from "remeda";
-import { useMenuItem as f, useMenu as I } from "react-aria";
-import { c as N } from "./clsx-F0OAuoLf.js";
-const x = "flow--navigation", c = {
-  navigation: x
-}, P = "flow--navigation--navigation-item", y = "flow--navigation--navigation-item--icon", k = "flow--navigation--navigation-item--text", r = {
-  navigationItem: P,
-  icon: y,
-  text: k
-}, C = (e, n, o) => {
-  const t = f(e, n, o);
-  return t.menuItemProps = l.omit(t.menuItemProps, ["role"]), t;
-};
-function E(e) {
-  const { item: n, state: o } = e, { isCurrent: t, linkComponent: m = "a" } = n.props, i = a.useRef(null), { menuItemProps: s } = C({ key: n.key }, o, i), u = {
-    Text: {
-      className: r.text
-    },
-    Icon: {
-      className: r.icon
+import "remeda";
+import { TunnelExit as f } from "@mittwald/react-tunnel";
+const x = "flow--navigation", N = "flow--navigation--item", E = "flow--navigation--icon", I = "flow--navigation--text", b = "flow--navigation--control-icon", a = {
+  navigation: x,
+  item: N,
+  icon: E,
+  text: I,
+  controlIcon: b
+}, R = (i) => {
+  const { className: r, children: e, ...l } = i, s = g(a.navigation, r), n = !!v(e, h), o = {
+    Link: {
+      hoc: (c) => /* @__PURE__ */ t.createElement("li", null, c),
+      className: a.item,
+      unstyled: !0,
+      Text: {
+        className: a.text
+      },
+      Icon: {
+        className: a.icon
+      }
+    }
+  };
+  return /* @__PURE__ */ t.createElement("nav", { className: s, role: "navigation", ...l }, /* @__PURE__ */ t.createElement(u, { props: o }, /* @__PURE__ */ t.createElement(d, { if: !n }, /* @__PURE__ */ t.createElement("ul", null, e))));
+}, w = "flow--navigation--navigation-group", C = "flow--navigation--navigation-group--label", p = {
+  navigationGroup: w,
+  label: C
+}, h = (i) => {
+  const { children: r, className: e, ...l } = i, s = g(p.navigationGroup, e), n = m(), o = m(), c = {
+    Label: {
+      tunnelId: o,
+      id: n,
+      className: p.label,
+      "aria-hidden": !0
     }
   };
-  return /* @__PURE__ */ a.createElement("li", { className: r.navigationItem }, /* @__PURE__ */ a.createElement(
-    m,
-    {
-      ...s,
-      ref: i,
-      "aria-current": t ? "page" : !1
-    },
-    /* @__PURE__ */ a.createElement(g, { props: u }, n.rendered)
-  ));
-}
-const d = (e, n, o) => {
-  const t = I(e, n, o);
-  return t.menuProps = l.omit(t.menuProps, ["role"]), t;
+  return /* @__PURE__ */ t.createElement("section", { "aria-labelledby": n, className: s, ...l }, /* @__PURE__ */ t.createElement(u, { mergeInParentContext: !0, props: c }, /* @__PURE__ */ t.createElement(f, { id: o }), /* @__PURE__ */ t.createElement("ul", null, r)));
 };
-function $(e) {
-  const { className: n } = e, o = p(e), t = a.useRef(null), { menuProps: m } = d(e, o, t), i = N(c.navigation, n);
-  return /* @__PURE__ */ a.createElement("nav", { ...m, className: i, ref: t }, /* @__PURE__ */ a.createElement("ul", { className: c.list }, Array.from(o.collection).map((s) => /* @__PURE__ */ a.createElement(E, { state: o, item: s, key: s.key }))));
-}
-const b = v;
 export {
-  $ as Navigation,
-  b as NavigationItem,
-  $ as default
+  R as Navigation,
+  h as NavigationGroup,
+  R as default
 };

package/dist/NumberField.js

@@ -0,0 +1,80 @@
+"use client"
+/* */
+import e from "react";
+import * as r from "react-aria-components";
+import { s as o } from "./FormField.module-DHK6nIcD.js";
+import E from "clsx";
+import { C as N } from "./ClearPropsContext-CeCMjUK9.js";
+import { P as b } from "./PropsContextProvider-DZvwqHLP.js";
+import "@react-aria/utils";
+import "./propsContext-CauylOgH.js";
+import "remeda";
+import { F as I } from "./FieldError-b6CAH0ya.js";
+import { B as a } from "./Button-CZjBV5AM.js";
+import "@tabler/icons-react";
+import "./Icon-DwHDa4pA.js";
+import { I as C } from "./IconChevronDown-C205topB.js";
+import { I as h, a as F, b as P } from "./IconPlus-Bz-UoRuD.js";
+import { f as w } from "./flowComponent-dvQga3NG.js";
+const B = "flow--number-field--group", g = "flow--number-field--input", y = "flow--number-field--decrement-button", v = "flow--number-field--increment-button", x = "flow--number-field--coarse-pointer-icon", D = "flow--number-field--touch-icon", t = {
+  group: B,
+  input: g,
+  decrementButton: y,
+  incrementButton: v,
+  coarsePointerIcon: x,
+  touchIcon: D
+}, K = w("NumberField", (n) => {
+  const { children: m, className: c, ref: l, onChange: s, ...i } = n, u = E(o.formField, c), p = {
+    Label: {
+      className: o.label,
+      optional: !n.isRequired
+    },
+    FieldDescription: {
+      className: o.fieldDescription
+    },
+    FieldError: {
+      className: o.customFieldError
+    }
+  }, f = (d) => {
+    setTimeout(() => {
+      s && s(d);
+    }, 150);
+  };
+  return /* @__PURE__ */ e.createElement(N, null, /* @__PURE__ */ e.createElement(
+    r.NumberField,
+    {
+      ...i,
+      className: u,
+      onChange: f
+    },
+    /* @__PURE__ */ e.createElement(r.Group, { className: t.group }, /* @__PURE__ */ e.createElement(
+      a,
+      {
+        slot: "decrement",
+        className: t.decrementButton,
+        size: "s",
+        style: "plain",
+        variant: "secondary"
+      },
+      /* @__PURE__ */ e.createElement(C, null),
+      /* @__PURE__ */ e.createElement(h, { className: t.coarsePointerIcon })
+    ), /* @__PURE__ */ e.createElement(r.Input, { className: t.input, ref: l }), /* @__PURE__ */ e.createElement(
+      a,
+      {
+        slot: "increment",
+        className: t.incrementButton,
+        size: "s",
+        style: "plain",
+        variant: "secondary"
+      },
+      /* @__PURE__ */ e.createElement(F, null),
+      /* @__PURE__ */ e.createElement(P, { className: t.coarsePointerIcon })
+    )),
+    /* @__PURE__ */ e.createElement(b, { props: p }, m),
+    /* @__PURE__ */ e.createElement(I, { className: o.fieldError })
+  ));
+});
+export {
+  K as NumberField,
+  K as default
+};

package/dist/Popover-MmxZkKu3.js

@@ -0,0 +1,15 @@
+"use client"
+/* */
+import t from "react";
+import * as a from "react-aria-components";
+import c from "clsx";
+const l = "flow--popover", m = {
+  popover: l,
+  "popover-slide": "flow--popover--popover-slide"
+}, i = (o) => {
+  const { children: e, className: r, ...p } = o, s = c(m.popover, r);
+  return /* @__PURE__ */ t.createElement(a.Popover, { ...p, className: s }, e);
+};
+export {
+  i as P
+};

package/dist/Popover.js

@@ -0,0 +1,7 @@
+"use client"
+/* */
+import { P as r } from "./Popover-MmxZkKu3.js";
+export {
+  r as Popover,
+  r as default
+};

package/dist/ProgressBar.js

@@ -0,0 +1,46 @@
+"use client"
+/* */
+import * as u from "react-aria-components";
+import s from "react";
+import w from "clsx";
+import { useNumberFormatter as d } from "react-aria";
+import "./propsContext-CauylOgH.js";
+import { P as x } from "./PropsContextProvider-DZvwqHLP.js";
+import "@react-aria/utils";
+import "remeda";
+const N = "flow--progress-bar", v = "flow--progress-bar--label", B = "flow--progress-bar--value", E = "flow--progress-bar--bar", P = "flow--progress-bar--fill", z = "flow--progress-bar--info", V = "flow--progress-bar--success", h = "flow--progress-bar--danger", y = "flow--progress-bar--warning", r = {
+  progressBar: N,
+  label: v,
+  value: B,
+  bar: E,
+  fill: P,
+  "size-s": "flow--progress-bar--size-s",
+  info: z,
+  success: V,
+  danger: h,
+  warning: y
+}, R = (e) => {
+  const {
+    children: t,
+    className: l,
+    status: n = "info",
+    showMaxValue: c,
+    size: m = "m",
+    ...i
+  } = e, f = w(
+    l,
+    r.progressBar,
+    r[`size-${m}`],
+    r[n]
+  ), p = d(e.formatOptions), a = c && e.maxValue ? p.format(e.maxValue) : void 0, g = {
+    Label: {
+      className: r.label,
+      unstyled: !0
+    }
+  };
+  return /* @__PURE__ */ s.createElement(u.ProgressBar, { className: f, ...i }, ({ percentage: b, valueText: o }) => /* @__PURE__ */ s.createElement(x, { props: g }, t, /* @__PURE__ */ s.createElement("span", { className: r.value }, a ? `${o} of ${a}` : o), /* @__PURE__ */ s.createElement("div", { className: r.bar }, /* @__PURE__ */ s.createElement("div", { className: r.fill, style: { width: b + "%" } }))));
+};
+export {
+  R as ProgressBar,
+  R as default
+};

package/dist/PropsContextProvider-DZvwqHLP.js

@@ -0,0 +1,64 @@
+"use client"
+/* */
+import u, { useMemo as m, isValidElement as f, cloneElement as C } from "react";
+import { u as v, p as E } from "./propsContext-CauylOgH.js";
+import { mergeProps as h } from "@react-aria/utils";
+import { isObjectType as c } from "remeda";
+import { setProperty as x } from "dot-prop";
+const N = (t = {}) => (...r) => {
+  const { mergeClassNames: n = !0, mergeEventHandler: s = !0 } = t, e = h(...r);
+  if (c(e)) {
+    if (!n)
+      for (const o of r)
+        c(o) && "className" in e && "className" in o && (e.className = o.className);
+    if (!s) {
+      for (const o of r)
+        if (c(o))
+          for (const [p, a] of Object.entries(o))
+            /^on[A-Z]/.test(p) && x(e, p, a);
+    }
+  }
+  return e;
+}, b = N({
+  mergeClassNames: !1,
+  mergeEventHandler: !1
+}), j = (t = {}, r = {}) => {
+  const n = Object.keys({
+    ...t,
+    ...r
+  });
+  return Object.fromEntries(
+    n.map((s) => [
+      s,
+      b(
+        t[s],
+        r[s]
+      )
+    ])
+  );
+}, V = (t) => {
+  const {
+    props: r,
+    dependencies: n = [],
+    mergeInParentContext: s = !1,
+    children: e,
+    ...o
+  } = t, p = v(), a = m(() => r, n), i = m(
+    () => s ? j(p, r) : r,
+    [a, p, s]
+  ), l = f(e) ? {
+    ...o,
+    ...e.props
+  } : o, d = [
+    e,
+    ...Object.entries(l).flatMap((g) => g)
+  ], P = m(
+    () => f(e) ? C(e, l) : e,
+    d
+  );
+  return /* @__PURE__ */ u.createElement(E.Provider, { value: i }, P);
+};
+export {
+  V as P,
+  j as m
+};

package/dist/RadioGroup.js

@@ -1,91 +1,87 @@
 "use client"
 /* */
-import t from "react";
-import * as m from "react-aria-components";
-import { c as f } from "./clsx-F0OAuoLf.js";
-import "./propsContext-1HT-3SRC.js";
-import { P as u } from "./PropsContextProvider-1ZntTV8J.js";
+import e from "react";
+import * as R from "react-aria-components";
+import E from "clsx";
+import "./propsContext-CauylOgH.js";
+import { P as C, m as b } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
-import { F as g } from "./FieldError-O1TRrMMj.js";
-import { I as N } from "./Icon-ZFuEzyOR.js";
-import "./useProps-5ZdbXCrH.js";
-import "@fortawesome/react-fontawesome";
-import "html-react-parser";
-const v = "flow--radio-group", w = "flow--radio-group--content", C = "flow--radio-group--icon", k = "flow--radio-group--label", E = "flow--radio-group--field-error", b = "flow--radio-group--custom-field-error", P = "flow--radio-group--field-description", n = {
-  radioGroup: v,
-  content: w,
-  icon: C,
-  label: k,
-  fieldError: E,
-  customFieldError: b,
-  fieldDescription: P
-}, q = (o) => {
-  const { children: e, className: i, ...r } = o, c = f(n.radioGroup, i), a = {
+import "remeda";
+import { d as k } from "./dynamic-ClpUSmEt.js";
+import { F as x } from "./FieldError-b6CAH0ya.js";
+import { C as y } from "./ColumnLayout-FMONjI17.js";
+import { TunnelProvider as F, TunnelExit as m } from "@mittwald/react-tunnel";
+import { s as c } from "./FormField.module-DHK6nIcD.js";
+import { d as I } from "./deepFindOfType-6pG0fH7S.js";
+import { C as w } from "./ClearPropsContext-CeCMjUK9.js";
+import "@tabler/icons-react";
+import "./Icon-DwHDa4pA.js";
+import { I as B, a as v } from "./IconRadioOn-ghpksMxd.js";
+import { f as N } from "./flowComponent-dvQga3NG.js";
+import "dot-prop";
+import { I as P } from "./IconCheck-CubzEVji.js";
+const D = "flow--radio-group", T = "flow--radio-group--segmented-group", O = "flow--radio-group--segments", $ = "flow--radio-group--segment", L = "flow--radio-group--checkmark", a = {
+  radioGroup: D,
+  segmentedGroup: T,
+  segments: O,
+  segment: $,
+  checkmark: L
+}, A = "flow--radio-group--radio-button", j = "flow--radio-group--radio-button--content", q = "flow--radio-group--radio-button--label", f = {
+  radioButton: A,
+  content: j,
+  label: q
+}, z = N("RadioButton", (n) => {
+  const { children: t, className: r, ref: o, ...s } = n, l = E(f.radioButton, r), i = {
+    Text: {
+      className: f.label
+    },
+    Content: {
+      className: f.content
+    }
+  };
+  return /* @__PURE__ */ e.createElement(w, null, /* @__PURE__ */ e.createElement(K, { ...s, className: l, ref: o }, /* @__PURE__ */ e.createElement(C, { props: i }, t)));
+}), me = N("RadioGroup", (n) => {
+  const { children: t, className: r, variant: o = "default", s, m: l, l: i, ...d } = n, h = E(c.formField, r);
+  let p = {
     Label: {
-      className: n.label
+      className: c.label
     },
     FieldDescription: {
-      className: n.fieldDescription
+      className: c.fieldDescription,
+      tunnelId: "fieldDescription"
     },
     FieldError: {
-      className: n.customFieldError
-    }
-  };
-  return /* @__PURE__ */ t.createElement(m.RadioGroup, { ...r, className: c }, /* @__PURE__ */ t.createElement(u, { props: a }, e), /* @__PURE__ */ t.createElement(g, { className: n.fieldError }));
-}, D = "flow--radio-group--radio", F = "flow--radio-group--radio--content", G = "flow--radio-group--radio--icon", R = "flow--radio-group--radio--checkmark", y = "flow--radio-group--radio--label", l = {
-  radio: D,
-  content: F,
-  icon: G,
-  checkmark: R,
-  label: y
-};
-var h = {}, p = {};
-(function(o) {
-  Object.defineProperty(o, "__esModule", { value: !0 });
-  var e = "far", i = "circle-check", r = 512, c = 512, a = [61533, "check-circle"], s = "f058", d = "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-111 111-47-47c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l64 64c9.4 9.4 24.6 9.4 33.9 0L369 209z";
-  o.definition = {
-    prefix: e,
-    iconName: i,
-    icon: [
-      r,
-      c,
-      a,
-      s,
-      d
-    ]
-  }, o.faCircleCheck = o.definition, o.prefix = e, o.iconName = i, o.width = r, o.height = c, o.ligatures = a, o.unicode = s, o.svgPathData = d, o.aliases = a;
-})(p);
-(function(o) {
-  Object.defineProperty(o, "__esModule", { value: !0 });
-  var e = p;
-  o.definition = {
-    prefix: e.prefix,
-    iconName: e.iconName,
-    icon: [
-      e.width,
-      e.height,
-      e.aliases,
-      e.unicode,
-      e.svgPathData
-    ]
-  }, o.faCheckCircle = o.definition, o.prefix = e.prefix, o.iconName = e.iconName, o.width = e.width, o.height = e.height, o.ligatures = e.aliases, o.unicode = e.unicode, o.svgPathData = e.svgPathData, o.aliases = e.aliases;
-})(h);
-const B = (o) => {
-  const { children: e, className: i, ...r } = o, c = f(l.radio, i), a = {
-    Icon: {
-      className: l.icon
+      className: c.customFieldError,
+      tunnelId: "fieldError"
     },
-    Text: {
-      className: l.label
+    RadioButton: {
+      tunnelId: "radios"
     },
-    Content: {
-      className: l.content
+    Radio: {
+      tunnelId: "radios"
     }
   };
-  return /* @__PURE__ */ t.createElement(m.Radio, { ...r, className: c }, /* @__PURE__ */ t.createElement(u, { props: a }, e), /* @__PURE__ */ t.createElement(N, { className: l.checkmark, faIcon: h.faCheckCircle }));
-};
+  o === "segmented" && (p = b(p, {
+    Radio: {
+      className: a.segment,
+      unstyled: !0,
+      children: k((G) => /* @__PURE__ */ e.createElement(e.Fragment, null, G.children, /* @__PURE__ */ e.createElement(P, { className: a.checkmark })))
+    }
+  }));
+  const u = !!I(t, z);
+  return o === "segmented" && u && console.warn(
+    "<RadioButton/> is not supported in 'segmented' variant of <RadioGroup />"
+  ), /* @__PURE__ */ e.createElement(R.RadioGroup, { ...d, className: h }, /* @__PURE__ */ e.createElement(F, null, /* @__PURE__ */ e.createElement(C, { props: p, dependencies: [o] }, t, o === "segmented" && /* @__PURE__ */ e.createElement("div", { className: a.segmentedGroup }, /* @__PURE__ */ e.createElement("div", { className: a.segments }, /* @__PURE__ */ e.createElement(m, { id: "radios" }))), o === "default" && u && /* @__PURE__ */ e.createElement(y, { s, m: l, l: i, className: a.radioGroup }, /* @__PURE__ */ e.createElement(m, { id: "radios" })), o === "default" && !u && /* @__PURE__ */ e.createElement("div", { className: a.radioGroup }, /* @__PURE__ */ e.createElement(m, { id: "radios" })), /* @__PURE__ */ e.createElement(m, { id: "fieldDescription" }), /* @__PURE__ */ e.createElement(m, { id: "fieldError" }))), /* @__PURE__ */ e.createElement(x, { className: c.fieldError }));
+}), H = "flow--radio-group--radio", J = "flow--radio-group--radio--icon", g = {
+  radio: H,
+  icon: J
+}, K = N("Radio", (n) => {
+  const { children: t, className: r, unstyled: o = !1, ref: s, ...l } = n, i = o ? r : E(g.radio, r);
+  return /* @__PURE__ */ e.createElement(w, null, /* @__PURE__ */ e.createElement(R.Radio, { ...l, className: i, ref: s }, ({ isSelected: d }) => /* @__PURE__ */ e.createElement(e.Fragment, null, d ? !o && /* @__PURE__ */ e.createElement(B, { className: g.icon }) : !o && /* @__PURE__ */ e.createElement(v, { className: g.icon }), t)));
+});
 export {
-  B as Radio,
-  q as RadioGroup,
-  q as default
+  K as Radio,
+  z as RadioButton,
+  me as RadioGroup,
+  me as default
 };