@mittwald/flow-react-components 0.1.0-alpha.86 → 0.1.0-alpha.87

package/dist/Modal.js

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

package/dist/Navigation.js

@@ -3,24 +3,22 @@
 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 { W as f } from "./Wrap-DGT1h1o3.js";
 import "./propsContext-CauylOgH.js";
 import { P as u } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
 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 = {
+import { TunnelExit as x } from "@mittwald/react-tunnel";
+const N = "flow--navigation", E = "flow--navigation--item", I = "flow--navigation--icon", b = "flow--navigation--text", w = "flow--navigation--control-icon", a = {
+  navigation: N,
+  item: E,
+  icon: I,
+  text: b,
+  controlIcon: w
+}, $ = (i) => {
+  const { className: r, children: e, ...l } = i, s = g(a.navigation, r), n = !!v(e, G), o = {
     Link: {
-      hoc: (c) => /* @__PURE__ */ t.createElement("li", null, c),
-      className: a.item,
-      unstyled: !0,
+      render: (c, d) => /* @__PURE__ */ t.createElement("li", null, /* @__PURE__ */ t.createElement(c, { ...d, className: a.item, unstyled: !0 })),
       Text: {
         className: a.text
       },
@@ -29,11 +27,11 @@ const x = "flow--navigation", N = "flow--navigation--item", E = "flow--navigatio
       }
     }
   };
-  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) => {
+  return /* @__PURE__ */ t.createElement("nav", { className: s, role: "navigation", ...l }, /* @__PURE__ */ t.createElement(u, { props: o }, /* @__PURE__ */ t.createElement(f, { if: !n }, /* @__PURE__ */ t.createElement("ul", null, e))));
+}, C = "flow--navigation--navigation-group", y = "flow--navigation--navigation-group--label", p = {
+  navigationGroup: C,
+  label: y
+}, G = (i) => {
   const { children: r, className: e, ...l } = i, s = g(p.navigationGroup, e), n = m(), o = m(), c = {
     Label: {
       tunnelId: o,
@@ -42,10 +40,10 @@ const x = "flow--navigation", N = "flow--navigation--item", E = "flow--navigatio
       "aria-hidden": !0
     }
   };
-  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)));
+  return /* @__PURE__ */ t.createElement("section", { "aria-labelledby": n, className: s, ...l }, /* @__PURE__ */ t.createElement(u, { mergeInParentContext: !0, props: c }, /* @__PURE__ */ t.createElement(x, { id: o }), /* @__PURE__ */ t.createElement("ul", null, r)));
 };
 export {
-  R as Navigation,
-  h as NavigationGroup,
-  R as default
+  $ as Navigation,
+  G as NavigationGroup,
+  $ as default
 };

package/dist/NumberField.js

@@ -9,13 +9,13 @@ 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 { F as I } from "./FieldError-CDPZJvma.js";
+import { B as a } from "./Button-DJcL25jy.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";
+import "./Icon-DpcNiaNb.js";
+import { I as C } from "./IconChevronDown-CbK0gKMB.js";
+import { I as h, a as F, b as P } from "./IconPlus-DS099is1.js";
+import { f as w } from "./flowComponent-C4FfRbD8.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,

package/dist/RadioGroup.js

@@ -8,18 +8,18 @@ import { P as C, m as b } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
 import "remeda";
 import { d as k } from "./dynamic-ClpUSmEt.js";
-import { F as x } from "./FieldError-b6CAH0ya.js";
+import { F as x } from "./FieldError-CDPZJvma.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 "./Icon-DpcNiaNb.js";
+import { I as B, a as v } from "./IconRadioOn-D5xbBFYA.js";
+import { f as N } from "./flowComponent-C4FfRbD8.js";
 import "dot-prop";
-import { I as P } from "./IconCheck-CubzEVji.js";
+import { I as P } from "./IconCheck-DDbrMURX.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,

package/dist/Select.js

@@ -7,12 +7,12 @@ import { P as C } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
 import "remeda";
 import { s as r } from "./FormField.module-DHK6nIcD.js";
-import { F as w } from "./FieldError-b6CAH0ya.js";
+import { F as w } from "./FieldError-CDPZJvma.js";
 import m from "clsx";
 import "@tabler/icons-react";
-import "./Icon-DwHDa4pA.js";
-import { I as x } from "./IconChevronDown-C205topB.js";
-import { f as E } from "./flowComponent-dvQga3NG.js";
+import "./Icon-DpcNiaNb.js";
+import { I as x } from "./IconChevronDown-CbK0gKMB.js";
+import { f as E } from "./flowComponent-C4FfRbD8.js";
 import { P as h } from "./Popover-MmxZkKu3.js";
 import { TunnelProvider as v, TunnelExit as S } from "@mittwald/react-tunnel";
 const F = "flow--select", I = "flow--select--toggle", f = {

package/dist/StatusBadge.js

@@ -2,14 +2,14 @@
 /* */
 import t from "react";
 import l from "clsx";
-import { S as f } from "./StatusIcon-BMyHmLNg.js";
-import { T as i } from "./Text-CKd46eHq.js";
+import { S as f } from "./StatusIcon-BRm5TIe9.js";
+import { T as i } from "./Text-DlBpZns-.js";
 import { C as u } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as d } from "./flowComponent-dvQga3NG.js";
+import { f as d } from "./flowComponent-C4FfRbD8.js";
 const g = "flow--status-badge", p = "flow--status-badge--text", w = "flow--status-badge--info", x = "flow--status-badge--success", b = "flow--status-badge--warning", B = "flow--status-badge--danger", s = {
   statusBadge: g,
   text: p,

package/dist/{StatusIcon-BMyHmLNg.js → StatusIcon-BRm5TIe9.js}

@@ -2,9 +2,9 @@
 /* */
 import t from "react";
 import "@tabler/icons-react";
-import "./Icon-DwHDa4pA.js";
-import { I as m } from "./IconDanger-MdCt1mDP.js";
-import { I as f, a as l, b as I } from "./IconWarning-Dbq3oj5j.js";
+import "./Icon-DpcNiaNb.js";
+import { I as m } from "./IconDanger-BCQl3s0h.js";
+import { I as f, a as l, b as I } from "./IconWarning-3thkYnBz.js";
 import { useLocalizedStringFormatter as g } from "react-aria";
 import { C as p } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";

package/dist/StatusIcon.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { S as a } from "./StatusIcon-BMyHmLNg.js";
+import { S as a } from "./StatusIcon-BRm5TIe9.js";
 export {
   a as StatusIcon,
   a as default

package/dist/Switch.js

@@ -4,16 +4,16 @@ import e from "react";
 import * as n from "react-aria-components";
 import f from "clsx";
 import "@tabler/icons-react";
-import "./Icon-DwHDa4pA.js";
-import { I as p } from "./IconCheck-CubzEVji.js";
-import { I as h } from "./IconClose-7gyfEXz1.js";
-import { L as w } from "./Label-DlBFElQ_.js";
+import "./Icon-DpcNiaNb.js";
+import { I as p } from "./IconCheck-DDbrMURX.js";
+import { I as h } from "./IconClose-CwV3QUi2.js";
+import { L as w } from "./Label-Dq1cgQyP.js";
 import { C as d } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as b } from "./flowComponent-dvQga3NG.js";
+import { f as b } from "./flowComponent-C4FfRbD8.js";
 const E = "flow--switch--track", C = "flow--switch--handle", N = "flow--switch--label", t = {
   switch: "flow--switch",
   "label-leading": "flow--switch--label-leading",

package/dist/Tabs.js

@@ -5,15 +5,15 @@ import * as E from "react-aria-components";
 import { MenuTrigger as O } from "react-aria-components";
 import m from "clsx";
 import { TunnelExit as f, TunnelProvider as P, TunnelEntry as u } from "@mittwald/react-tunnel";
-import { f as S } from "./flowComponent-dvQga3NG.js";
+import { f as S } from "./flowComponent-C4FfRbD8.js";
 import { useCallbackRef as B } from "use-callback-ref";
-import { C as K } from "./ContextMenu-BeySGa4K.js";
-import { M as L } from "./MenuItem-Bi8sYht4.js";
-import { B as F } from "./Button-CZjBV5AM.js";
+import { C as K } from "./ContextMenu-B3m9vxOe.js";
+import { M as L } from "./MenuItem-B5kgO_0u.js";
+import { B as F } from "./Button-DJcL25jy.js";
 import "@tabler/icons-react";
-import "./Icon-DwHDa4pA.js";
-import { I as A } from "./IconContextMenu-DYOFg7qU.js";
-import { T as R } from "./Text-CKd46eHq.js";
+import "./Icon-DpcNiaNb.js";
+import { I as A } from "./IconContextMenu-DD5RGOEW.js";
+import { T as R } from "./Text-DlBpZns-.js";
 const W = "flow--tabs", $ = "flow--tabs--list", k = {
   tabs: W,
   list: $

package/dist/{Text-CKd46eHq.js → Text-DlBpZns-.js}

@@ -8,7 +8,7 @@ import "@react-aria/utils";
 import "./propsContext-CauylOgH.js";
 import "remeda";
 import u from "invariant";
-import { f as T } from "./flowComponent-dvQga3NG.js";
+import { f as T } from "./flowComponent-C4FfRbD8.js";
 import { E as d } from "./EmulatedBoldText-Dtox8Wd1.js";
 import { W as C } from "./Wrap-DGT1h1o3.js";
 const A = T("Text", (r) => {

package/dist/Text.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { T as a } from "./Text-CKd46eHq.js";
+import { T as a } from "./Text-DlBpZns-.js";
 export {
   a as Text,
   a as default

package/dist/TextArea.js

@@ -2,13 +2,13 @@
 /* */
 import e from "react";
 import * as n from "react-aria-components";
-import { T as p } from "./TextFieldBase-BGZpjGL8.js";
+import { T as p } from "./TextFieldBase-Dk8UVEZz.js";
 import { C as i } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as c } from "./flowComponent-dvQga3NG.js";
+import { f as c } from "./flowComponent-C4FfRbD8.js";
 const f = "flow--text-area", x = {
   textArea: f
 }, y = c("TextArea", (t) => {

package/dist/TextField.js

@@ -2,13 +2,13 @@
 /* */
 import t from "react";
 import * as s from "react-aria-components";
-import { T as a } from "./TextFieldBase-BGZpjGL8.js";
+import { T as a } from "./TextFieldBase-Dk8UVEZz.js";
 import { C as n } from "./ClearPropsContext-CeCMjUK9.js";
 import "./propsContext-CauylOgH.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as p } from "./flowComponent-dvQga3NG.js";
+import { f as p } from "./flowComponent-C4FfRbD8.js";
 const c = "flow--text-field", f = {
   textField: c
 }, w = p("TextField", (e) => {

package/dist/{TextFieldBase-BGZpjGL8.js → TextFieldBase-Dk8UVEZz.js}

@@ -9,7 +9,7 @@ import { P as f } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
 import "./propsContext-CauylOgH.js";
 import "remeda";
-import { F as E } from "./FieldError-b6CAH0ya.js";
+import { F as E } from "./FieldError-CDPZJvma.js";
 const g = c(
   (o, F) => {
     const { children: t, className: s, input: a, ...i } = o, l = p(e.formField, s), m = {

package/dist/controller.js

@@ -1,7 +1,7 @@
 "use client"
 /* */
-import { O as t, u as r } from "./index-ViVxK7d1.js";
+import { O as l, u as o } from "./index-Cb88QILt.js";
 export {
-  t as OverlayState,
-  r as useOverlayState
+  l as OverlayController,
+  o as useOverlayController
 };

package/dist/flowComponent-C4FfRbD8.js

@@ -0,0 +1,36 @@
+"use client"
+/* */
+import r, { forwardRef as a } from "react";
+import { C as c } from "./ClearPropsContext-CeCMjUK9.js";
+import "./propsContext-CauylOgH.js";
+import "@react-aria/utils";
+import "remeda";
+import "dot-prop";
+import { u } from "./useProps-CIrrudrV.js";
+import { TunnelEntry as C } from "@mittwald/react-tunnel";
+function d(e, o) {
+  return a((i, s) => {
+    const { render: n, tunnelId: p, ...l } = u(
+      e,
+      i
+    ), m = {
+      ...l,
+      ref: s
+    };
+    let t = /* @__PURE__ */ r.createElement(o, { ...m });
+    if (n) {
+      const f = d(
+        e,
+        o
+      );
+      t = /* @__PURE__ */ r.createElement(c, null, n(
+        f,
+        m
+      ));
+    }
+    return p && (t = /* @__PURE__ */ r.createElement(C, { id: p }, t)), t;
+  });
+}
+export {
+  d as f
+};

package/dist/hooks.js

@@ -2,7 +2,7 @@
 /* */
 import "mobx";
 import "react";
-import { u as a } from "./index-ViVxK7d1.js";
+import { u as l } from "./index-Cb88QILt.js";
 export {
-  a as useOverlayState
+  l as useOverlayController
 };

package/dist/{index-ViVxK7d1.js → index-Cb88QILt.js}

@@ -1,15 +1,15 @@
 "use client"
 /* */
 var p = Object.defineProperty;
-var O = (t, e, s) => e in t ? p(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
-var i = (t, e, s) => (O(t, typeof e != "symbol" ? e + "" : e, s), s);
-import { makeObservable as l, observable as c, action as o } from "mobx";
+var l = (t, e, s) => e in t ? p(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
+var i = (t, e, s) => (l(t, typeof e != "symbol" ? e + "" : e, s), s);
+import { makeObservable as O, observable as c, action as o } from "mobx";
 import { useState as m, createContext as b, useContext as h } from "react";
-import { u as d } from "./useSelector-DpU7_HMO.js";
+import { u as C } from "./useSelector-DpU7_HMO.js";
 class n {
   constructor(e = !1) {
     i(this, "isOpen");
-    l(this, {
+    O(this, {
       isOpen: c,
       open: o.bound,
       close: o.bound,
@@ -33,10 +33,12 @@ class n {
     this.isOpen = e;
   }
   useIsOpen() {
-    return d(() => this.isOpen);
+    return C(() => this.isOpen);
   }
 }
-const a = b(new n()), w = a.Provider, g = (t = {}) => {
+const a = b(
+  new n()
+), w = a.Provider, g = (t = {}) => {
   const { reuseControllerFromContext: e = !0, defaultOpen: s } = t, u = n.useNew(s), r = h(a);
   return e && r ? r : u;
 };

package/dist/react-hook-form.js

@@ -7,7 +7,7 @@ import { P as v } from "./PropsContextProvider-DZvwqHLP.js";
 import "@react-aria/utils";
 import "remeda";
 import { d as E } from "./dynamic-ClpUSmEt.js";
-import { F as P } from "./FieldError-b6CAH0ya.js";
+import { F as P } from "./FieldError-CDPZJvma.js";
 const d = x({}), b = d.Provider, g = () => F(d);
 function k(o) {
   var l;