@mittwald/flow-react-components 0.2.0-alpha.24 → 0.2.0-alpha.26

package/dist/js/MenuItem-BGGLM0sj.js

@@ -0,0 +1,61 @@
+"use client"
+/* */
+import { jsxs as I, Fragment as u, jsx as o } from "react/jsx-runtime";
+import "react";
+import * as h from "react-aria-components";
+import l from "clsx";
+import "./propsContext-DzAKlmhS.js";
+import { PropsContextProvider as p } from "./PropsContextProvider.js";
+import "@tabler/icons-react";
+import "@mittwald/react-tunnel";
+import { f as d } from "./flowComponent-B8dC8eRj.js";
+import "@react-aria/utils";
+import "remeda";
+import "./viewComponentContext-HXEKmx_D.js";
+import { I as x, a as w } from "./IconCheckboxEmpty-CJsL0HKI.js";
+import { I as C, a as N } from "./IconRadioOn-CbW3RjJ2.js";
+import { S as f } from "./Switch-Bg5jHbFG.js";
+import { W as v } from "./Wrap-DGT1h1o3.js";
+import { T as M } from "./Text-CW_CzcoD.js";
+const S = "flow--menu-item", g = "flow--menu-item--icon", y = "flow--menu-item--text", O = "flow--menu-item--control-icon", R = "flow--menu-item--avatar", t = {
+  menuItem: S,
+  switch: "flow--menu-item--switch",
+  icon: g,
+  text: y,
+  controlIcon: O,
+  avatar: R
+}, k = (s) => {
+  const {
+    selectionMode: n,
+    isSelected: e,
+    selectionVariant: c = "control",
+    children: i
+  } = s, m = {
+    Icon: {
+      className: t.icon
+    },
+    Text: {
+      className: t.text
+    },
+    Avatar: {
+      className: t.avatar
+    }
+  }, a = {
+    Icon: {
+      className: l(t.controlIcon, t.icon)
+    },
+    Switch: {
+      className: l(t.controlIcon, t.switch)
+    }
+  }, r = n === "none" || c === "navigation" ? null : c === "switch" && e ? /* @__PURE__ */ o(f, { isReadOnly: !0, isSelected: !0 }) : c === "switch" && !e ? /* @__PURE__ */ o(f, { isReadOnly: !0 }) : n === "single" && e ? /* @__PURE__ */ o(C, {}) : n === "single" && !e ? /* @__PURE__ */ o(N, {}) : n === "multiple" && e ? /* @__PURE__ */ o(x, {}) : /* @__PURE__ */ o(w, {});
+  return /* @__PURE__ */ I(u, { children: [
+    /* @__PURE__ */ o(p, { props: a, children: r }),
+    /* @__PURE__ */ o(p, { props: m, children: /* @__PURE__ */ o(v, { if: !!r, children: /* @__PURE__ */ o(M, { children: i }) }) })
+  ] });
+}, K = d("MenuItem", (s) => {
+  const { children: n, className: e, selectionVariant: c, ref: i, ...m } = s, a = l(t.menuItem, e);
+  return /* @__PURE__ */ o(h.MenuItem, { ...m, className: a, ref: i, children: (r) => /* @__PURE__ */ o(k, { ...r, selectionVariant: c, children: n }) });
+});
+export {
+  K as M
+};

package/dist/js/MenuItem.js

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

package/dist/js/MenuTrigger-B6S1um5d.js

@@ -0,0 +1,8 @@
+"use client"
+/* */
+import { jsx as e } from "react/jsx-runtime";
+import * as o from "react-aria-components";
+const t = (r) => /* @__PURE__ */ e(o.MenuTrigger, { ...r });
+export {
+  t as M
+};

package/dist/js/Modal.js

@@ -16,7 +16,7 @@ import { I as N } from "./IconClose-B4zJVugN.js";
 import { H } from "./Header-6rzaR_ZQ.js";
 import { B as O } from "./ButtonView-inzXKZFE.js";
 import { O as T } from "./OverlayTrigger-lqEEBZnu.js";
-import { D as M } from "./DialogTriggerView-NI0s4hWl.js";
+import { D as M } from "./DialogTriggerView-L7WD5ojU.js";
 const P = "flow--modal", G = "flow--modal--off-canvas", V = "flow--modal--header", A = "flow--modal--content", B = "flow--modal--action-group", I = "flow--modal--left", o = {
   modal: P,
   offCanvas: G,

package/dist/js/OverlayTrigger.js

@@ -1,9 +1,11 @@
 "use client"
 /* */
-import { O as a } from "./OverlayTrigger-lqEEBZnu.js";
+import { O as e } from "./OverlayTrigger-lqEEBZnu.js";
 import { D as g } from "./DialogTrigger-BQe3ovfI.js";
+import { M as t } from "./MenuTrigger-B6S1um5d.js";
 export {
   g as DialogTrigger,
-  a as OverlayTrigger,
-  a as default
+  t as MenuTrigger,
+  e as OverlayTrigger,
+  e as default
 };

package/dist/js/Popover.js

@@ -5,7 +5,7 @@ import "react";
 import { O as t } from "./OverlayTrigger-lqEEBZnu.js";
 import "react-aria-components";
 import { f as i } from "./flowComponent-B8dC8eRj.js";
-import { D as m } from "./DialogTriggerView-NI0s4hWl.js";
+import { D as m } from "./DialogTriggerView-L7WD5ojU.js";
 import { P as l } from "./Popover-Ck5nKNR3.js";
 import { a as y } from "./Popover-Ck5nKNR3.js";
 const T = i("PopoverTrigger", (o) => {

package/dist/js/Tabs.js

@@ -7,7 +7,7 @@ import u from "clsx";
 import { TunnelExit as C, TunnelProvider as A, TunnelEntry as f } from "@mittwald/react-tunnel";
 import { f as B } from "./flowComponent-B8dC8eRj.js";
 import { useCallbackRef as E } from "use-callback-ref";
-import { a as K, C as L } from "./ContextMenuTrigger-kUBBSyaN.js";
+import { a as K, C as L } from "./ContextMenuContent-D2RjW6il.js";
 import "./propsContext-DzAKlmhS.js";
 import "@react-aria/utils";
 import "remeda";
@@ -15,17 +15,15 @@ import "dot-prop";
 import "@tabler/icons-react";
 import "./viewComponentContext-HXEKmx_D.js";
 import { I as W } from "./IconContextMenu-DnwSrGtk.js";
-import "invariant";
-import "react-children-utilities";
-import "object-code";
 import "react-aria";
+import "invariant";
 import "mobx";
 import "./context-BaYmTa0I.js";
 import "./Action-C1Tw5pqL.js";
 import "./getActionGroupSlot-CekBnXeM.js";
 import { B as F } from "./Button-WawPguWq.js";
 import { T as R } from "./Text-CW_CzcoD.js";
-import { M as $ } from "./MenuItem-D0A7OXWd.js";
+import { M as $ } from "./MenuItem-BGGLM0sj.js";
 import { PropsContextProvider as j } from "./PropsContextProvider.js";
 import { A as N } from "./Activity-BekrxIf7.js";
 const k = "flow--tabs", q = "flow--tabs--list", z = {
@@ -37,26 +35,26 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
   titles: H,
   collapsed: J
 }, Q = () => {
-  const n = y(null), [s, i] = g(!1), o = E(null, (e) => {
-    l(), a(e);
-  }), r = ([
+  const n = y(null), [s, a] = g(!1), o = E(null, (e) => {
+    r(), i(e);
+  }), l = ([
     e
   ]) => {
-    e && i(!e.isIntersecting);
-  }, a = (e = o.current) => {
+    e && a(!e.isIntersecting);
+  }, i = (e = o.current) => {
     if (e && e instanceof Element) {
-      const c = new IntersectionObserver(r, {
+      const c = new IntersectionObserver(l, {
         root: e.parentElement,
         // 1 = invoke callback when the element is 100% visible within the parent element
         threshold: 1
       });
       n.current = c, c.observe(e);
     }
-  }, l = () => {
+  }, r = () => {
     var e;
     (e = n.current) == null || e.disconnect();
   };
-  return P(() => (a(), l), [n.current]), {
+  return P(() => (i(), r), [n.current]), {
     ref: o,
     isOverflowing: s
   };
@@ -65,26 +63,26 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
   text: V,
   menuItem: X
 }, Y = (n) => {
-  const { className: s, ...i } = n, o = u(s, h.tabTitle);
-  return /* @__PURE__ */ t("div", { ...i, className: o, "data-selected": !0, children: /* @__PURE__ */ t(C, { id: "ActiveTitle" }) });
+  const { className: s, ...a } = n, o = u(s, h.tabTitle);
+  return /* @__PURE__ */ t("div", { ...a, className: o, "data-selected": !0, children: /* @__PURE__ */ t(C, { id: "ActiveTitle" }) });
 }, Z = (n) => {
-  const { selection: s, disabledKeys: i, onContextMenuSelectionChange: o } = n, r = M(), a = Q(), l = a.isOverflowing, e = u(p.tabList, l && p.collapsed), c = (x) => {
+  const { selection: s, disabledKeys: a, onContextMenuSelectionChange: o } = n, l = M(), i = Q(), r = i.isOverflowing, e = u(p.tabList, r && p.collapsed), c = (x) => {
     o(x);
-  }, d = /* @__PURE__ */ t(T.TabList, { className: p.titles, ref: a.ref, children: /* @__PURE__ */ t(C, { id: "Titles" }) }), b = l && /* @__PURE__ */ t(Y, { id: r }), v = l && /* @__PURE__ */ m(K, { children: [
+  }, d = /* @__PURE__ */ t(T.TabList, { className: p.titles, ref: i.ref, children: /* @__PURE__ */ t(C, { id: "Titles" }) }), b = r && /* @__PURE__ */ t(Y, { id: l }), v = r && /* @__PURE__ */ m(K, { children: [
     /* @__PURE__ */ t(
       F,
       {
         variant: "soft",
         className: p.contextMenuButton,
         color: "secondary",
-        "aria-labelledby": r,
+        "aria-labelledby": l,
         children: /* @__PURE__ */ t(W, {})
       }
     ),
     /* @__PURE__ */ t(
       L,
       {
-        disabledKeys: i,
+        disabledKeys: a,
         selectedKeys: s ? [s] : void 0,
         selectionMode: "navigation",
         onAction: (x) => c(x),
@@ -97,15 +95,15 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
     b,
     v
   ] });
-}, At = B("Tabs", (n) => {
+}, Ot = B("Tabs", (n) => {
   const {
     children: s,
-    className: i,
+    className: a,
     defaultSelectedKey: o,
-    disabledKeys: r,
-    ref: a,
-    ...l
-  } = n, e = u(z.tabs, i), [c, d] = g(
+    disabledKeys: l,
+    ref: i,
+    ...r
+  } = n, e = u(z.tabs, a), [c, d] = g(
     o
   );
   return /* @__PURE__ */ m(A, { children: [
@@ -115,18 +113,18 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
       {
         slot: null,
         className: e,
-        ...l,
+        ...r,
         selectedKey: c,
         onSelectionChange: d,
-        disabledKeys: r,
-        ref: a,
+        disabledKeys: l,
+        ref: i,
         children: [
           /* @__PURE__ */ t(
             Z,
             {
               selection: c,
               onContextMenuSelectionChange: d,
-              disabledKeys: r
+              disabledKeys: l
             }
           ),
           /* @__PURE__ */ t(C, { id: "Panels" })
@@ -136,19 +134,19 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
   ] });
 }), I = O({
   id: "undefined"
-}), _ = () => S(I), tt = I.Provider, Bt = (n) => {
-  const { children: s, className: i, ...o } = n, { id: r } = _(), a = u(h.tabTitle, i);
+}), _ = () => S(I), tt = I.Provider, St = (n) => {
+  const { children: s, className: a, ...o } = n, { id: l } = _(), i = u(h.tabTitle, a);
   return /* @__PURE__ */ m(w, { children: [
-    /* @__PURE__ */ t(f, { id: "Titles", children: /* @__PURE__ */ t(T.Tab, { ...o, id: r, className: a, children: (l) => /* @__PURE__ */ m(w, { children: [
+    /* @__PURE__ */ t(f, { id: "Titles", children: /* @__PURE__ */ t(T.Tab, { ...o, id: l, className: i, children: (r) => /* @__PURE__ */ m(w, { children: [
       /* @__PURE__ */ t(R, { emulateBoldWidth: !0, children: /* @__PURE__ */ t("span", { className: h.text, children: s }) }),
-      /* @__PURE__ */ t(f, { id: "ActiveTitle", children: l.isSelected && s })
+      /* @__PURE__ */ t(f, { id: "ActiveTitle", children: r.isSelected && s })
     ] }) }) }),
-    /* @__PURE__ */ t(f, { id: "ContextMenuItems", children: /* @__PURE__ */ t($, { className: h.menuItem, id: r, children: s }) })
+    /* @__PURE__ */ t(f, { id: "ContextMenuItems", children: /* @__PURE__ */ t($, { className: h.menuItem, id: l, children: s }) })
   ] });
 }, et = "flow--tabs--tab--tab-panel", st = {
   tabPanel: et
-}, Et = (n) => {
-  const { children: s, className: i, id: o, ...r } = n, a = u(st.tabPanel, i), l = M(), e = o ?? l, c = (d) => {
+}, At = (n) => {
+  const { children: s, className: a, id: o, ...l } = n, i = u(st.tabPanel, a), r = M(), e = o ?? r, c = (d) => {
     const b = d.state.selectedKey === e;
     return /* @__PURE__ */ t(
       j,
@@ -169,17 +167,17 @@ const k = "flow--tabs", q = "flow--tabs--list", z = {
   return /* @__PURE__ */ t(f, { id: "Panels", children: /* @__PURE__ */ t(tt, { value: { id: e }, children: /* @__PURE__ */ t(
     T.TabPanel,
     {
-      className: a,
+      className: i,
       shouldForceMount: !0,
       id: e,
-      ...r,
+      ...l,
       children: c
     }
   ) }) });
 };
 export {
-  Et as Tab,
-  Bt as TabTitle,
-  At as Tabs,
-  At as default
+  At as Tab,
+  St as TabTitle,
+  Ot as Tabs,
+  Ot as default
 };