@mittwald/flow-react-components 0.1.0-alpha.307 → 0.1.0-alpha.309

package/dist/js/SegmentedControl.js

@@ -0,0 +1,82 @@
+"use client"
+/* */
+import { f as d } from "./flowComponent-E-Gp2Toe.js";
+import e from "react";
+import * as p from "react-aria-components";
+import { f as t } from "./FormField.module-CqWpTQKP.js";
+import { g as k } from "./getContainerBreakpointSizeClassName-BrcFDcCY.js";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as E } from "./PropsContextProvider.js";
+import "@react-aria/utils";
+import "remeda";
+import { TunnelProvider as N, TunnelExit as i } from "@mittwald/react-tunnel";
+import { F as u } from "./FieldError-BZ6oyvAN.js";
+import g from "clsx";
+import "@tabler/icons-react";
+import "./Icon-C3JkDOTi.js";
+import { I as b } from "./IconCheck-B49auJJP.js";
+import { C as w } from "./ClearPropsContext-CUvsbMn8.js";
+import "dot-prop";
+const z = "flow--segmented-control", x = "flow--segmented-control--segments", S = "flow--segmented-control--segmented-control-container", h = "flow--segmented-control--segment", n = {
+  segmentedControl: z,
+  segments: x,
+  segmentedControlContainer: S,
+  "container-breakpoint-size-xs": "flow--segmented-control--container-breakpoint-size-xs",
+  segment: h,
+  "container-breakpoint-size-s": "flow--segmented-control--container-breakpoint-size-s",
+  "container-breakpoint-size-m": "flow--segmented-control--container-breakpoint-size-m",
+  "container-breakpoint-size-l": "flow--segmented-control--container-breakpoint-size-l",
+  "container-breakpoint-size-xl": "flow--segmented-control--container-breakpoint-size-xl"
+}, M = d("SegmentedControl", (o) => {
+  const {
+    children: r,
+    className: s,
+    containerBreakpointSize: m = "m",
+    refProp: l,
+    ...a
+  } = o, f = g(
+    t.formField,
+    n.segmentedControlContainer,
+    s,
+    n[k(m)]
+  ), C = {
+    Label: {
+      className: t.label
+    },
+    FieldDescription: {
+      className: t.fieldDescription,
+      tunnelId: "fieldDescription"
+    },
+    FieldError: {
+      className: t.customFieldError,
+      tunnelId: "fieldError"
+    },
+    Segment: {
+      tunnelId: "segments",
+      className: n.segment
+    }
+  };
+  return /* @__PURE__ */ e.createElement(p.RadioGroup, { ...a, className: f, ref: l }, /* @__PURE__ */ e.createElement(N, null, /* @__PURE__ */ e.createElement(
+    E,
+    {
+      dependencies: ["segment"],
+      props: C,
+      mergeInParentContext: !0
+    },
+    r,
+    /* @__PURE__ */ e.createElement("div", { className: n.segmentedControl }, /* @__PURE__ */ e.createElement("div", { className: n.segments }, /* @__PURE__ */ e.createElement(i, { id: "segments" }))),
+    /* @__PURE__ */ e.createElement(i, { id: "fieldDescription" }),
+    /* @__PURE__ */ e.createElement(i, { id: "fieldError" })
+  )), /* @__PURE__ */ e.createElement(u, { className: t.fieldError }));
+}), F = "flow--segmented-control--segment", P = "flow--segmented-control--segment--checkmark", c = {
+  segment: F,
+  checkmark: P
+}, O = d("Segment", (o) => {
+  const { children: r, className: s, refProp: m, ...l } = o, a = g(c.segment, s);
+  return /* @__PURE__ */ e.createElement(w, null, /* @__PURE__ */ e.createElement(p.Radio, { ...l, className: a, ref: m }, r, /* @__PURE__ */ e.createElement(b, { className: c.checkmark })));
+});
+export {
+  O as Segment,
+  M as SegmentedControl,
+  M as default
+};

package/dist/js/Select.js

@@ -3,21 +3,21 @@
 import e from "react";
 import * as i from "react-aria-components";
 import "./propsContext-DzAKlmhS.js";
-import { P as h } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as h } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
 import { f as c } from "./FormField.module-CqWpTQKP.js";
-import { F as w } from "./FieldError-CHLQJ4Gj.js";
+import { F as w } from "./FieldError-BZ6oyvAN.js";
 import f from "clsx";
 import "@tabler/icons-react";
-import "./Icon-C4X3yGm5.js";
-import { I as F } from "./IconChevronDown-CZczuUPE.js";
-import { f as E } from "./flowComponent-C_3mQGhG.js";
-import { P } from "./Popover-BzuJdYCR.js";
+import "./Icon-C3JkDOTi.js";
+import { I as F } from "./IconChevronDown-Cr-rCT6d.js";
+import { f as E } from "./flowComponent-E-Gp2Toe.js";
+import { P } from "./Popover-C4jNPNSb.js";
 import "mobx";
 import { u as C } from "./useOverlayController-D8pgx8nV.js";
 import { TunnelProvider as y, TunnelExit as I } from "@mittwald/react-tunnel";
-import { O as B } from "./OverlayTrigger-bD8_mPel.js";
+import { O as B } from "./OverlayTrigger-BmB63e4e.js";
 const D = "flow--select", L = "flow--select--toggle", u = {
   select: D,
   toggle: L

package/dist/js/Slider.js

@@ -1,17 +1,17 @@
 "use client"
 /* */
 import e from "react";
-import { f as E } from "./flowComponent-C_3mQGhG.js";
+import { f as E } from "./flowComponent-E-Gp2Toe.js";
 import * as n from "react-aria-components";
 import h from "clsx";
 import "./propsContext-DzAKlmhS.js";
-import { P as v } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as v } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
-import { B as i } from "./Button-2HD10hUM.js";
+import { B as i } from "./Button-a4Hq_zmE.js";
 import "@tabler/icons-react";
-import "./Icon-C4X3yGm5.js";
-import { I as w, a as N } from "./IconPlus-DwSox2Ic.js";
+import "./Icon-C3JkDOTi.js";
+import { I as w, a as N } from "./IconPlus-CYExXr8n.js";
 import { useLocalizedStringFormatter as k } from "react-aria";
 const x = "flow--slider", P = "flow--slider--text", S = "flow--slider--value", T = "flow--slider--track", g = "flow--slider--fill", y = "flow--slider--initial-marker", F = "flow--slider--thumb", I = "flow--slider--increment", M = "flow--slider--decrement", C = "flow--slider--disabled", r = {
   slider: x,

package/dist/js/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-C4X3yGm5.js";
-import { I as p } from "./IconCheck-DekklS7k.js";
-import { I as h } from "./IconClose-e8kUonqZ.js";
-import { L as w } from "./Label-CR5X8sAG.js";
+import "./Icon-C3JkDOTi.js";
+import { I as p } from "./IconCheck-B49auJJP.js";
+import { I as h } from "./IconClose-GXU9h7Kw.js";
+import { L as w } from "./Label-BvdZBeD-.js";
 import { C as d } from "./ClearPropsContext-CUvsbMn8.js";
 import "./propsContext-DzAKlmhS.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as b } from "./flowComponent-C_3mQGhG.js";
+import { f as b } from "./flowComponent-E-Gp2Toe.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/js/Tabs.js

@@ -1,20 +1,20 @@
 "use client"
 /* */
-import e, { useRef as h, useState as w, useEffect as M, useId as N, createContext as I, useContext as P } from "react";
+import e, { useRef as h, useState as w, useEffect as M, useId as N, createContext as I, useContext as y } from "react";
 import * as C from "react-aria-components";
 import u from "clsx";
-import { TunnelExit as E, TunnelProvider as y, TunnelEntry as f } from "@mittwald/react-tunnel";
-import { f as O } from "./flowComponent-C_3mQGhG.js";
+import { TunnelExit as E, TunnelProvider as P, TunnelEntry as f } from "@mittwald/react-tunnel";
+import { f as O } from "./flowComponent-E-Gp2Toe.js";
 import { useCallbackRef as S } from "use-callback-ref";
-import { a as A, C as B } from "./ContextMenuTrigger-CoquhvdC.js";
-import { M as K } from "./MenuItem-Dx4r1r63.js";
-import { B as L } from "./Button-2HD10hUM.js";
+import { a as A, C as B } from "./ContextMenuTrigger-Ciwiz8WT.js";
+import { M as K } from "./MenuItem-DljCXugV.js";
+import { B as L } from "./Button-a4Hq_zmE.js";
 import "@tabler/icons-react";
-import "./Icon-C4X3yGm5.js";
-import { I as W } from "./IconContextMenu-CJrHGK7Z.js";
-import { T as F } from "./Text-CZaLuq4c.js";
+import "./Icon-C3JkDOTi.js";
+import { I as W } from "./IconContextMenu-BpfOb36j.js";
+import { T as F } from "./Text-CtABaZjp.js";
 import "./propsContext-DzAKlmhS.js";
-import { P as R } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as R } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
 import { A as x } from "./Activity-CmfZpgOM.js";
@@ -91,7 +91,7 @@ const $ = "flow--tabs", k = "flow--tabs--list", j = {
   } = s, t = u(j.tabs, r), [i, m] = w(
     o
   );
-  return /* @__PURE__ */ e.createElement(y, null, n, /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement(P, null, n, /* @__PURE__ */ e.createElement(
     C.Tabs,
     {
       slot: null,
@@ -114,7 +114,7 @@ const $ = "flow--tabs", k = "flow--tabs--list", j = {
   ));
 }), g = I({
   id: "undefined"
-}), Y = () => P(g), Z = g.Provider, ve = (s) => {
+}), Y = () => y(g), Z = g.Provider, ve = (s) => {
   const { children: n, className: r, ...o } = s, { id: a } = Y(), c = u(p.tabTitle, r);
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(f, { id: "Titles" }, /* @__PURE__ */ e.createElement(C.Tab, { ...o, id: a, className: c }, (l) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(F, { emulateBoldWidth: !0 }, /* @__PURE__ */ e.createElement("span", { className: p.text }, n)), /* @__PURE__ */ e.createElement(f, { id: "ActiveTitle" }, l.isSelected && n)))), /* @__PURE__ */ e.createElement(f, { id: "ContextMenuItems" }, /* @__PURE__ */ e.createElement(K, { className: p.menuItem, id: a }, n)));
 }, _ = "flow--tabs--tab--tab-panel", ee = {

package/dist/js/{Text-CZaLuq4c.js → Text-CtABaZjp.js}

@@ -3,16 +3,16 @@
 import t from "react";
 import * as E from "react-aria-components";
 import { C as u } from "./ClearPropsContext-CUvsbMn8.js";
-import { P as T } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as T } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "./propsContext-DzAKlmhS.js";
 import "remeda";
 import C from "invariant";
-import { f as h } from "./flowComponent-C_3mQGhG.js";
-import { E as P } from "./EmulatedBoldText-Dtox8Wd1.js";
-import { W as g } from "./Wrap-DGT1h1o3.js";
-import y from "clsx";
-const k = "flow--text", w = "flow--text--light", N = "flow--text--dark", l = {
+import { f as h } from "./flowComponent-E-Gp2Toe.js";
+import { E as g } from "./EmulatedBoldText-Dtox8Wd1.js";
+import { W as y } from "./Wrap-DGT1h1o3.js";
+import P from "clsx";
+const k = "flow--text", w = "flow--text--light", N = "flow--text--dark", s = {
   text: k,
   light: w,
   dark: N
@@ -25,19 +25,19 @@ const k = "flow--text", w = "flow--text--light", N = "flow--text--dark", l = {
     refProp: r,
     color: n,
     ...c
-  } = o, f = y(l.text, n && l[n], i), m = { ...c, className: f }, x = {
+  } = o, f = P(s.text, n && s[n], i), m = { ...c, className: f }, x = {
     Link: {
       inline: !0
     }
-  }, s = /* @__PURE__ */ t.createElement(T, { props: x }, /* @__PURE__ */ t.createElement(g, { if: p }, /* @__PURE__ */ t.createElement(P, null, a)));
+  }, l = /* @__PURE__ */ t.createElement(T, { props: x }, /* @__PURE__ */ t.createElement(y, { if: p }, /* @__PURE__ */ t.createElement(g, null, a)));
   if (!o.slot) {
     const d = e;
-    return /* @__PURE__ */ t.createElement(d, { ...m, ref: r }, s);
+    return /* @__PURE__ */ t.createElement(d, { ...m, ref: r }, l);
   }
   return C(
     typeof e == "string",
     "'elementType' in Text component must be of type string"
-  ), /* @__PURE__ */ t.createElement(u, null, /* @__PURE__ */ t.createElement(E.Text, { ...m, elementType: e, ref: r }, s));
+  ), /* @__PURE__ */ t.createElement(u, null, /* @__PURE__ */ t.createElement(E.Text, { ...m, elementType: e, ref: r }, l));
 });
 export {
   F as T

package/dist/js/Text.js

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

package/dist/js/TextArea.js

@@ -2,13 +2,13 @@
 /* */
 import o, { useRef as h } from "react";
 import * as x from "react-aria-components";
-import { T as g } from "./TextFieldBase-DGpU7liT.js";
+import { T as g } from "./TextFieldBase-CjA7G_xB.js";
 import { C as u } from "./ClearPropsContext-CUvsbMn8.js";
 import "./propsContext-DzAKlmhS.js";
 import { mergeRefs as d } from "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as A } from "./flowComponent-C_3mQGhG.js";
+import { f as A } from "./flowComponent-E-Gp2Toe.js";
 const H = "flow--text-area", R = {
   textArea: H
 }, B = A("TextArea", (n) => {

package/dist/js/TextField.js

@@ -2,13 +2,13 @@
 /* */
 import e from "react";
 import * as s from "react-aria-components";
-import { T as a } from "./TextFieldBase-DGpU7liT.js";
+import { T as a } from "./TextFieldBase-CjA7G_xB.js";
 import { C as n } from "./ClearPropsContext-CUvsbMn8.js";
 import "./propsContext-DzAKlmhS.js";
 import "@react-aria/utils";
 import "remeda";
 import "dot-prop";
-import { f as p } from "./flowComponent-C_3mQGhG.js";
+import { f as p } from "./flowComponent-E-Gp2Toe.js";
 const c = "flow--text-field", f = {
   textField: c
 }, w = p("TextField", (t) => {

package/dist/js/{TextFieldBase-DGpU7liT.js → TextFieldBase-CjA7G_xB.js}

@@ -5,14 +5,14 @@ import * as N from "react-aria-components";
 import { f as t } from "./FormField.module-CqWpTQKP.js";
 import $ from "clsx";
 import { C as D } from "./ClearPropsContext-CUvsbMn8.js";
-import { P as B } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as B } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "./propsContext-DzAKlmhS.js";
 import "remeda";
-import { F as P } from "./FieldError-CHLQJ4Gj.js";
-import { F as R } from "./FieldDescription-DHpNcxEx.js";
-import { useLocalizedStringFormatter as g } from "react-aria";
-const L = { "de-DE": {
+import { F as R } from "./FieldError-BZ6oyvAN.js";
+import { F as g } from "./FieldDescription-Cj-qCYxv.js";
+import { useLocalizedStringFormatter as L } from "react-aria";
+const P = { "de-DE": {
   "textFieldBase.characters": (e, r) => `${r.select({ 0: () => `${e.count}`, other: () => `${e.count}/${e.maxCount}` }, e.maxCount)} Zeichen`
 }, "en-EN": {
   "textFieldBase.characters": (e, r) => `${r.select({ 0: () => `${e.count}`, other: () => `${e.count}/${e.maxCount}` }, e.maxCount)} characters`
@@ -21,7 +21,7 @@ const L = { "de-DE": {
     var n;
     const { children: s, className: i, input: l, showCharacterCount: a, ...m } = e, [d, u] = E(
       ((n = e.value) == null ? void 0 : n.length) ?? 0
-    ), f = $(t.formField, i), h = g(L), C = {
+    ), f = $(t.formField, i), h = L(P), C = {
       Label: {
         className: t.label,
         optional: !e.isRequired
@@ -50,8 +50,8 @@ const L = { "de-DE": {
       },
       l,
       /* @__PURE__ */ o.createElement(B, { props: C }, s),
-      a && /* @__PURE__ */ o.createElement(R, { className: t.fieldDescription }, x),
-      /* @__PURE__ */ o.createElement(P, { className: t.fieldError })
+      a && /* @__PURE__ */ o.createElement(g, { className: t.fieldDescription }, x),
+      /* @__PURE__ */ o.createElement(R, { className: t.fieldError })
     ));
   }
 );

package/dist/js/TimeField.js

@@ -2,17 +2,17 @@
 /* */
 import e from "react";
 import * as r from "react-aria-components";
-import { f as p } from "./flowComponent-C_3mQGhG.js";
+import { f as p } from "./flowComponent-E-Gp2Toe.js";
 import "./propsContext-DzAKlmhS.js";
-import { P as d } from "./PropsContextProvider-C6Z4XGp6.js";
+import { PropsContextProvider as d } from "./PropsContextProvider.js";
 import "@react-aria/utils";
 import "remeda";
 import { f as t } from "./FormField.module-CqWpTQKP.js";
-import { F as f } from "./FieldError-CHLQJ4Gj.js";
+import { F as f } from "./FieldError-BZ6oyvAN.js";
 import u from "clsx";
 const F = "flow--time-field--date-input", E = {
   dateInput: F
-}, g = p("TimeField", (o) => {
+}, h = p("TimeField", (o) => {
   const { children: a, errorMessage: i, className: l, ...s } = o, m = u(t.formField, l), n = {
     Label: {
       className: t.label,
@@ -29,6 +29,6 @@ const F = "flow--time-field--date-input", E = {
   return /* @__PURE__ */ e.createElement(r.TimeField, { hourCycle: 24, className: m, ...s }, /* @__PURE__ */ e.createElement(d, { props: n }, a), /* @__PURE__ */ e.createElement(f, { className: t.fieldError }, i), /* @__PURE__ */ e.createElement(r.DateInput, { className: E.dateInput }, (c) => /* @__PURE__ */ e.createElement(r.DateSegment, { segment: c })));
 });
 export {
-  g as TimeField,
-  g as default
+  h as TimeField,
+  h as default
 };