@mittwald/flow-react-components 0.1.0-alpha.400 → 0.1.0-alpha.402

package/dist/js/MenuItem-B6P8yo9s.js

@@ -0,0 +1,59 @@
+"use client"
+/* */
+import e from "react";
+import * as I from "react-aria-components";
+import i from "clsx";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as p } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+import "@tabler/icons-react";
+import "./Icon--OEo4TjW.js";
+import { I as f, a as w } from "./IconCheckboxEmpty-CZrD3f3O.js";
+import { I as h, a as E } from "./IconRadioOn-D7w6KLWm.js";
+import { S as u } from "./Switch-BhDMHWjv.js";
+import { f as d } from "./flowComponent-BQs9wMX_.js";
+const x = "flow--menu-item", C = "flow--menu-item--icon", N = "flow--menu-item--control-icon", v = "flow--menu-item--avatar", t = {
+  menuItem: x,
+  switch: "flow--menu-item--switch",
+  icon: C,
+  controlIcon: N,
+  avatar: v
+}, M = (r) => {
+  const {
+    selectionMode: n,
+    isSelected: o,
+    selectionVariant: c = "control",
+    children: a
+  } = r, m = {
+    Icon: {
+      className: t.icon
+    },
+    Text: {
+      className: t.text
+    },
+    Avatar: {
+      className: t.avatar
+    }
+  }, s = {
+    Icon: {
+      className: i(t.controlIcon, t.icon)
+    },
+    Switch: {
+      className: i(t.controlIcon, t.switch)
+    }
+  }, l = n === "none" || c === "navigation" ? null : c === "switch" && o ? /* @__PURE__ */ e.createElement(u, { isReadOnly: !0, isSelected: !0 }) : c === "switch" && !o ? /* @__PURE__ */ e.createElement(u, { isReadOnly: !0 }) : n === "single" && o ? /* @__PURE__ */ e.createElement(h, null) : n === "single" && !o ? /* @__PURE__ */ e.createElement(E, null) : n === "multiple" && o ? /* @__PURE__ */ e.createElement(f, null) : /* @__PURE__ */ e.createElement(w, null);
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(p, { props: s }, l), /* @__PURE__ */ e.createElement(p, { props: m }, a));
+}, j = d("MenuItem", (r) => {
+  const {
+    children: n,
+    className: o,
+    selectionVariant: c,
+    refProp: a,
+    ...m
+  } = r, s = i(t.menuItem, o);
+  return /* @__PURE__ */ e.createElement(I.MenuItem, { ...m, className: s, ref: a }, (l) => /* @__PURE__ */ e.createElement(M, { ...l, selectionVariant: c }, n));
+});
+export {
+  j as M
+};

package/dist/js/MenuItem.js

@@ -1,6 +1,6 @@
 "use client"
 /* */
-import { M as t } from "./MenuItem-D5BsewlU.js";
+import { M as t } from "./MenuItem-B6P8yo9s.js";
 export {
   t as MenuItem,
   t as default

package/dist/js/Navigation.js

@@ -2,69 +2,67 @@
 /* */
 import e, { useId as d } from "react";
 import v from "clsx";
-import { W as f } from "./Wrap-DGT1h1o3.js";
 import "./propsContext-DzAKlmhS.js";
-import { PropsContextProvider as i } from "./PropsContextProvider.js";
+import { PropsContextProvider as l } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
-import { d as E } from "./deepHas-KHS5X1F_.js";
-import { TunnelProvider as g, TunnelExit as p } from "@mittwald/react-tunnel";
-import { A as x } from "./Accordion-Btnh1ek-.js";
-import { C as b } from "./Content-BHs6Idqq.js";
-const w = "flow--navigation", N = "flow--navigation--item", C = "flow--navigation--icon", I = "flow--navigation--text", P = "flow--navigation--control-icon", h = "flow--navigation--avatar", r = {
-  navigation: w,
-  item: N,
+import { TunnelExit as r, TunnelProvider as g } from "@mittwald/react-tunnel";
+import { A as E } from "./Accordion-Btnh1ek-.js";
+import { C as f } from "./Content-BHs6Idqq.js";
+const x = "flow--navigation", b = "flow--navigation--item", N = "flow--navigation--icon", w = "flow--navigation--control-icon", C = "flow--navigation--avatar", o = {
+  navigation: x,
+  item: b,
   switch: "flow--navigation--switch",
-  icon: C,
-  text: I,
-  controlIcon: P,
-  avatar: h
-}, F = (s) => {
-  const { className: t, children: n, ...a } = s, c = v(r.navigation, t), o = E(n, L), l = {
+  icon: N,
+  controlIcon: w,
+  avatar: C
+}, j = (i) => {
+  const { className: t, children: s, ...n } = i, c = v(o.navigation, t), a = {
     Link: {
       wrapWith: /* @__PURE__ */ e.createElement("li", null),
-      className: r.item,
+      className: o.item,
       unstyled: !0,
       Text: {
-        className: r.text
+        className: o.text
       },
       Icon: {
-        className: r.icon
-      }
+        className: o.icon
+      },
+      tunnelId: "links"
     }
   };
-  return /* @__PURE__ */ e.createElement("nav", { className: c, role: "navigation", ...a }, /* @__PURE__ */ e.createElement(i, { props: l, mergeInParentContext: !0 }, /* @__PURE__ */ e.createElement(f, { if: !o }, /* @__PURE__ */ e.createElement("ul", null, n))));
-}, k = "flow--navigation--navigation-group", G = "flow--navigation--navigation-group--collapsable", y = "flow--navigation--navigation-group--label", u = {
-  navigationGroup: k,
-  collapsable: G,
-  label: y
-}, L = (s) => {
-  const { children: t, className: n, collapsable: a, ...c } = s, o = v(
-    u.navigationGroup,
-    a && u.collapsable,
-    n
-  ), l = d(), m = {
+  return /* @__PURE__ */ e.createElement("nav", { className: c, role: "navigation", ...n }, /* @__PURE__ */ e.createElement(l, { props: a, mergeInParentContext: !0 }, /* @__PURE__ */ e.createElement("ul", null, /* @__PURE__ */ e.createElement(r, { id: "links" })), s));
+}, I = "flow--navigation--navigation-group", P = "flow--navigation--navigation-group--collapsable", k = "flow--navigation--navigation-group--label", p = {
+  navigationGroup: I,
+  collapsable: P,
+  label: k
+}, q = (i) => {
+  const { children: t, className: s, collapsable: n, ...c } = i, a = v(
+    p.navigationGroup,
+    n && p.collapsable,
+    s
+  ), u = d(), m = {
     Label: {
-      id: l,
-      className: u.label,
+      id: u,
+      className: p.label,
       "aria-hidden": !0
     },
     Link: {
-      tunnelId: "links"
+      tunnelId: "groupLinks"
     }
   };
-  return a ? /* @__PURE__ */ e.createElement(i, { mergeInParentContext: !0, props: m }, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(x, { defaultExpanded: !0, className: o }, t, /* @__PURE__ */ e.createElement(b, { clearPropsContext: !1 }, /* @__PURE__ */ e.createElement("ul", null, /* @__PURE__ */ e.createElement(p, { id: "links" })))))) : /* @__PURE__ */ e.createElement(i, { mergeInParentContext: !0, props: m }, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(
+  return n ? /* @__PURE__ */ e.createElement(l, { mergeInParentContext: !0, props: m }, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(E, { defaultExpanded: !0, className: a }, t, /* @__PURE__ */ e.createElement(f, { clearPropsContext: !1 }, /* @__PURE__ */ e.createElement("ul", null, /* @__PURE__ */ e.createElement(r, { id: "groupLinks" })))))) : /* @__PURE__ */ e.createElement(l, { mergeInParentContext: !0, props: m }, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(
     "section",
     {
-      "aria-labelledby": l,
-      className: o,
+      "aria-labelledby": u,
+      className: a,
       ...c
     },
-    /* @__PURE__ */ e.createElement(i, { mergeInParentContext: !0, props: m }, t, /* @__PURE__ */ e.createElement(p, { id: "Label" }), /* @__PURE__ */ e.createElement("ul", null, /* @__PURE__ */ e.createElement(p, { id: "links" })))
+    /* @__PURE__ */ e.createElement(l, { mergeInParentContext: !0, props: m }, t, /* @__PURE__ */ e.createElement(r, { id: "Label" }), /* @__PURE__ */ e.createElement("ul", null, /* @__PURE__ */ e.createElement(r, { id: "groupLinks" })))
   )));
 };
 export {
-  F as Navigation,
-  L as NavigationGroup,
-  F as default
+  j as Navigation,
+  q as NavigationGroup,
+  j as default
 };

package/dist/js/RadioGroup.js

@@ -1,45 +1,30 @@
 "use client"
 /* */
 import o from "react";
-import * as N from "react-aria-components";
+import * as E from "react-aria-components";
 import u from "clsx";
 import "./propsContext-DzAKlmhS.js";
-import { PropsContextProvider as C } from "./PropsContextProvider.js";
+import { PropsContextProvider as N } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
-import { F } from "./FieldError-B_3nLHFz.js";
-import { C as G } from "./ColumnLayout-BhsG7J-Z.js";
-import { TunnelProvider as I, TunnelExit as c } from "@mittwald/react-tunnel";
+import { F as g } from "./FieldError-B_3nLHFz.js";
+import { C as B } from "./ColumnLayout-BhsG7J-Z.js";
+import { TunnelProvider as F, TunnelExit as c } from "@mittwald/react-tunnel";
 import { f as l } from "./FormField.module-CqWpTQKP.js";
-import { C as R } from "./ClearPropsContext-CUvsbMn8.js";
+import { f } from "./flowComponent-BQs9wMX_.js";
 import "@tabler/icons-react";
 import "./Icon--OEo4TjW.js";
-import { I as P, a as w } from "./IconRadioOn-D7w6KLWm.js";
-import { f } from "./flowComponent-BQs9wMX_.js";
+import { I as G, a as I } from "./IconRadioOn-D7w6KLWm.js";
+import { C } from "./ClearPropsContext-CUvsbMn8.js";
 import "dot-prop";
-import { d as B } from "./deepHas-KHS5X1F_.js";
-const y = "flow--radio-group", m = {
-  radioGroup: y
-}, h = "flow--radio-group--radio-button", D = "flow--radio-group--radio-button--content", v = "flow--radio-group--radio-button--label", d = {
-  radioButton: h,
-  content: D,
-  label: v
-}, T = f("RadioButton", (r) => {
-  const { children: e, className: t, refProp: a, ...n } = r, s = u(d.radioButton, t), i = {
-    Text: {
-      className: d.label
-    },
-    Content: {
-      className: d.content
-    }
-  };
-  return /* @__PURE__ */ o.createElement(R, null, /* @__PURE__ */ o.createElement($, { ...n, className: s, ref: a }, /* @__PURE__ */ o.createElement(C, { props: i }, e)));
-}), _ = f("RadioGroup", (r) => {
-  const { children: e, className: t, s: a, m: n, l: s, refProp: i, ...b } = r, x = u(
+const P = "flow--radio-group", m = {
+  radioGroup: P
+}, W = f("RadioGroup", (e) => {
+  const { children: r, className: t, s: a, m: n, l: i, refProp: s, ...R } = e, b = u(
     l.formField,
     m.radioGroupContainer,
     t
-  ), g = {
+  ), x = {
     Label: {
       className: l.label
     },
@@ -52,35 +37,49 @@ const y = "flow--radio-group", m = {
       tunnelId: "fieldError"
     },
     RadioButton: {
-      tunnelId: "radios"
+      tunnelId: "radioButtons"
     },
     Radio: {
       tunnelId: "radios"
     }
-  }, E = B(e, T);
-  return /* @__PURE__ */ o.createElement(N.RadioGroup, { ...b, className: x, ref: i }, /* @__PURE__ */ o.createElement(I, null, /* @__PURE__ */ o.createElement(
-    C,
+  };
+  return /* @__PURE__ */ o.createElement(E.RadioGroup, { ...R, className: b, ref: s }, /* @__PURE__ */ o.createElement(F, null, /* @__PURE__ */ o.createElement(
+    N,
     {
       dependencies: ["radio"],
-      props: g,
+      props: x,
       mergeInParentContext: !0
     },
-    e,
-    E && /* @__PURE__ */ o.createElement(G, { s: a, m: n, l: s, className: m.radioGroup }, /* @__PURE__ */ o.createElement(c, { id: "radios" })),
-    !E && /* @__PURE__ */ o.createElement("div", { className: m.radioGroup }, /* @__PURE__ */ o.createElement(c, { id: "radios" })),
+    r,
+    /* @__PURE__ */ o.createElement(B, { s: a, m: n, l: i, className: m.radioGroup }, /* @__PURE__ */ o.createElement(c, { id: "radioButtons" })),
+    /* @__PURE__ */ o.createElement("div", { className: m.radioGroup }, /* @__PURE__ */ o.createElement(c, { id: "radios" })),
     /* @__PURE__ */ o.createElement(c, { id: "fieldDescription" }),
     /* @__PURE__ */ o.createElement(c, { id: "fieldError" })
-  )), /* @__PURE__ */ o.createElement(F, { className: l.fieldError }));
-}), L = "flow--radio-group--radio", O = "flow--radio-group--radio--icon", p = {
-  radio: L,
-  icon: O
-}, $ = f("Radio", (r) => {
-  const { children: e, className: t, refProp: a, ...n } = r, s = u(p.radio, t);
-  return /* @__PURE__ */ o.createElement(R, null, /* @__PURE__ */ o.createElement(N.Radio, { ...n, className: s, ref: a }, ({ isSelected: i }) => /* @__PURE__ */ o.createElement(o.Fragment, null, i ? /* @__PURE__ */ o.createElement(P, { className: p.icon }) : /* @__PURE__ */ o.createElement(w, { className: p.icon }), e)));
+  )), /* @__PURE__ */ o.createElement(g, { className: l.fieldError }));
+}), w = "flow--radio-group--radio", y = "flow--radio-group--radio--icon", d = {
+  radio: w,
+  icon: y
+}, D = f("Radio", (e) => {
+  const { children: r, className: t, refProp: a, ...n } = e, i = u(d.radio, t);
+  return /* @__PURE__ */ o.createElement(C, null, /* @__PURE__ */ o.createElement(E.Radio, { ...n, className: i, ref: a }, ({ isSelected: s }) => /* @__PURE__ */ o.createElement(o.Fragment, null, s ? /* @__PURE__ */ o.createElement(G, { className: d.icon }) : /* @__PURE__ */ o.createElement(I, { className: d.icon }), r)));
+}), h = "flow--radio-group--radio-button", v = "flow--radio-group--radio-button--content", T = "flow--radio-group--radio-button--label", p = {
+  radioButton: h,
+  content: v,
+  label: T
+}, X = f("RadioButton", (e) => {
+  const { children: r, className: t, refProp: a, ...n } = e, i = u(p.radioButton, t), s = {
+    Text: {
+      className: p.label
+    },
+    Content: {
+      className: p.content
+    }
+  };
+  return /* @__PURE__ */ o.createElement(C, null, /* @__PURE__ */ o.createElement(D, { ...n, className: i, ref: a }, /* @__PURE__ */ o.createElement(N, { props: s }, r)));
 });
 export {
-  $ as Radio,
-  T as RadioButton,
-  _ as RadioGroup,
-  _ as default
+  D as Radio,
+  X as RadioButton,
+  W as RadioGroup,
+  W as default
 };

package/dist/js/Select.js

@@ -28,7 +28,7 @@ const f = "flow--select", D = "flow--select--toggle", M = {
 }, U = (e) => {
   const { className: i, children: r, ...t } = e, o = m(C.options, i), s = p("Select");
   return /* @__PURE__ */ n.createElement(L, { className: C.popover, controller: s }, /* @__PURE__ */ n.createElement(u.ListBox, { className: o, ...t }, r));
-}, Me = S("Select", (e) => {
+}, Se = S("Select", (e) => {
   const {
     children: i,
     className: r,
@@ -74,15 +74,14 @@ const f = "flow--select", D = "flow--select--toggle", M = {
     },
     /* @__PURE__ */ n.createElement(k, { type: "Select", controller: d }, /* @__PURE__ */ n.createElement(P, { props: A }, /* @__PURE__ */ n.createElement(F, null, /* @__PURE__ */ n.createElement(u.Button, { className: M.toggle }, /* @__PURE__ */ n.createElement(u.SelectValue, null), /* @__PURE__ */ n.createElement(b, null)), i, /* @__PURE__ */ n.createElement(U, null, /* @__PURE__ */ n.createElement(R, { id: "options" })), /* @__PURE__ */ n.createElement(K, { className: a.fieldError }))))
   );
-}), V = "flow--select--option", w = "flow--select--option--icon", v = "flow--select--option--text", J = "flow--select--option--control-icon", Z = "flow--select--option--avatar", W = {
+}), V = "flow--select--option", w = "flow--select--option--icon", v = "flow--select--option--control-icon", J = "flow--select--option--avatar", Z = {
   option: V,
   switch: "flow--select--option--switch",
   icon: w,
-  text: v,
-  controlIcon: J,
-  avatar: Z
-}, z = S("Option", (e) => {
-  const { className: i, children: r, value: t, refProp: o, ...s } = e, l = m(W.option, i);
+  controlIcon: v,
+  avatar: J
+}, W = S("Option", (e) => {
+  const { className: i, children: r, value: t, refProp: o, ...s } = e, l = m(Z.option, i);
   return /* @__PURE__ */ n.createElement(u.ListBoxItem, { className: l, ref: o, ...s, id: t }, r);
 }), B = { "de-DE": {
   "countries.AD": "Andorra",
@@ -586,26 +585,26 @@ const f = "flow--select", D = "flow--select--toggle", M = {
   "countries.ZA": "South Africa",
   "countries.ZM": "Zambia",
   "countries.ZW": "Zimbabwe"
-} }, Y = Object.keys(B["de-DE"]).filter((e) => e.startsWith("countries.")).map((e) => e.replace("countries.", "")), x = (e, i) => e.name.localeCompare(i.name), Q = () => 0, X = () => !0, Ce = S(
+} }, z = Object.keys(B["de-DE"]).filter((e) => e.startsWith("countries.")).map((e) => e.replace("countries.", "")), Y = (e, i) => e.name.localeCompare(i.name), x = () => 0, Q = () => !0, Me = S(
   "CountryOptions",
   ({
-    filterBy: e = X,
-    sortBy: i = Q
+    filterBy: e = Q,
+    sortBy: i = x
   }) => {
     const r = y(B), t = E(
-      () => Y.map((o) => ({
+      () => z.map((o) => ({
         code: o,
         name: r.format(`countries.${o}`)
-      })).filter(e).sort(x).sort(i),
+      })).filter(e).sort(Y).sort(i),
       [r, e, i]
     );
-    return /* @__PURE__ */ n.createElement(n.Fragment, null, t.map((o) => /* @__PURE__ */ n.createElement(z, { key: o.code, value: o.code }, o.name)));
+    return /* @__PURE__ */ n.createElement(n.Fragment, null, t.map((o) => /* @__PURE__ */ n.createElement(W, { key: o.code, value: o.code }, o.name)));
   }
-), h = ["DE", "AT", "CH"], he = (e, i) => h.includes(i.code) ? 1 : 0 - (h.includes(e.code) ? 1 : 0);
+), h = ["DE", "AT", "CH"], Ce = (e, i) => h.includes(i.code) ? 1 : 0 - (h.includes(e.code) ? 1 : 0);
 export {
-  Ce as CountryOptions,
-  z as Option,
-  Me as Select,
-  Me as default,
-  he as sortByDachFirst
+  Me as CountryOptions,
+  W as Option,
+  Se as Select,
+  Se as default,
+  Ce as sortByDachFirst
 };

package/dist/js/Tabs.js

@@ -7,7 +7,7 @@ import { TunnelExit as E, TunnelProvider as P, TunnelEntry as f } from "@mittwal
 import { f as O } from "./flowComponent-BQs9wMX_.js";
 import { useCallbackRef as S } from "use-callback-ref";
 import { a as A, C as B } from "./ContextMenuTrigger-C6ZCPTHC.js";
-import { M as K } from "./MenuItem-D5BsewlU.js";
+import { M as K } from "./MenuItem-B6P8yo9s.js";
 import "./ContextMenuSection-kLzjPKqH.js";
 import { B as L } from "./Button-BTc_iJae.js";
 import "@tabler/icons-react";