@mittwald/flow-react-components 0.1.0-alpha.144 → 0.1.0-alpha.145

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -15,7 +15,7 @@ import "@react-aria/utils";
15
15
  import "remeda";
16
16
  import { d as l } from "./dynamic-ClpUSmEt.js";
17
17
  import { u as q } from "./slotContext-DoCFkzCA.js";
18
- const y = O(void 0), z = y.Provider, v = (n) => new Promise((t) => setTimeout(t, n)), C = {
18
+ const A = O(void 0), z = A.Provider, v = (n) => new Promise((t) => setTimeout(t, n)), C = {
19
19
  pending: 1e3,
20
20
  succeeded: 1500,
21
21
  failed: 2e3
@@ -201,7 +201,7 @@ class u {
201
201
  this.actionProps = e, this.parentAction = s, this.confirmationModalController = c, this.needsConfirmation = o, this.overlayContext = a, this.state = i;
202
202
  }
203
203
  static useNew(t, e = {}) {
204
- const o = w(y), s = E(), a = D.useNew(), c = x.useNew();
204
+ const o = w(A), s = E(), a = D.useNew(), c = x.useNew();
205
205
  return new u({
206
206
  parentAction: o,
207
207
  overlayContext: s,
@@ -213,7 +213,7 @@ class u {
213
213
  });
214
214
  }
215
215
  static use() {
216
- const t = w(y);
216
+ const t = w(A);
217
217
  return T(!!t, "Action context is not defined"), G.useRegisterState(t.state), t;
218
218
  }
219
219
  static useConfirmationAction() {
@@ -239,13 +239,13 @@ class u {
239
239
  return e(this.actionProps.openOverlay) ?? e(this.actionProps.closeOverlay) ?? e(this.actionProps.toggleOverlay);
240
240
  }
241
241
  }
242
- const Q = (n) => q()[n], A = (n) => Q("Modal") === "actionConfirm" ? L(n) : void 0, m = (n) => {
243
- const t = u.use(), e = t.state.useValue(), o = A(n) === "primary", s = t.confirmationModalController.useIsOpen();
242
+ const Q = (n) => q()[n], y = (n) => Q("Modal") === "actionConfirm" ? L(n) : void 0, m = (n) => {
243
+ const t = u.use(), e = t.state.useValue(), o = y(n) === "primary", s = t.confirmationModalController.useIsOpen();
244
244
  return t.needsConfirmation && s && !o ? "isIdle" : e;
245
245
  }, F = {
246
246
  onPress: l((n) => {
247
- const t = u.use(), e = u.useConfirmationAction(), o = A(n) === "primary";
248
- return A(n) === "abort" ? t.confirmationModalController.close : o ? e.execute : t.execute;
247
+ const t = u.use(), e = u.useConfirmationAction(), o = y(n) === "primary";
248
+ return y(n) === "abort" ? t.confirmationModalController.close : o ? e.execute : t.execute;
249
249
  }),
250
250
  isPending: l((n) => m(n) === "isPending"),
251
251
  isSucceeded: l(
@@ -262,6 +262,9 @@ const Q = (n) => q()[n], A = (n) => Q("Modal") === "actionConfirm" ? L(n) : void
262
262
  Link: {
263
263
  onPress: l(() => u.use().execute)
264
264
  },
265
+ MenuItem: {
266
+ onAction: l(() => u.use().execute)
267
+ },
265
268
  Modal: {
266
269
  slot: l((i) => {
267
270
  const { slot: h } = i, d = u.use();
package/dist/Action.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use client"
2
2
  /* */
3
- import { A as t } from "./Action-SzQtjRB5.js";
3
+ import { A as t } from "./Action-BW80BkOP.js";
4
4
  export {
5
5
  t as Action,
6
6
  t as default
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  /* */
3
- import { C as t } from "./ContextMenuTrigger-CeyI6LLR.js";
4
- import { a } from "./ContextMenuTrigger-CeyI6LLR.js";
3
+ import { C as t } from "./ContextMenuTrigger-Cm0Tlmv1.js";
4
+ import { a } from "./ContextMenuTrigger-Cm0Tlmv1.js";
5
5
  import { M as n } from "./MenuItem-CCEquV9i.js";
6
6
  export {
7
7
  t as ContextMenu,
@@ -0,0 +1,83 @@
1
+ "use client"
2
+ /* */
3
+ import e from "react";
4
+ import * as a from "react-aria-components";
5
+ import { f as g } from "./flowComponent-CWmvUeHT.js";
6
+ import { P as d } from "./Popover-DrXvRfAg.js";
7
+ import "mobx";
8
+ import { u as P } from "./useOverlayController-C88Gnnhi.js";
9
+ import { C as E } from "./ClearPropsContext-CUvsbMn8.js";
10
+ import { P as O } from "./PropsContextProvider-C6Z4XGp6.js";
11
+ import "@react-aria/utils";
12
+ import "./propsContext-DzAKlmhS.js";
13
+ import "remeda";
14
+ import { O as T } from "./OverlayContextProvider-BBz2Hde8.js";
15
+ import { A } from "./Action-BW80BkOP.js";
16
+ import { O as h } from "./OverlayTrigger-CZdXqASS.js";
17
+ const w = "flow--context-menu", F = "flow--context-menu--popover", s = {
18
+ contextMenu: w,
19
+ popover: F
20
+ }, G = g("ContextMenu", (t) => {
21
+ const {
22
+ children: r,
23
+ onAction: n,
24
+ selectionMode: o,
25
+ selectedKeys: c,
26
+ defaultSelectedKeys: i,
27
+ disabledKeys: m,
28
+ onSelectionChange: p,
29
+ refProp: u,
30
+ controller: C,
31
+ ...v
32
+ } = t, x = P("ContextMenu", {
33
+ reuseControllerFromContext: !0
34
+ }), l = C ?? x, f = o === "navigation" ? "single" : o, y = {
35
+ MenuItem: {
36
+ selectionVariant: o === "navigation" ? "navigation" : "control"
37
+ }
38
+ }, M = o === "single" ? "ContextMenu" : void 0;
39
+ return /* @__PURE__ */ e.createElement(E, null, /* @__PURE__ */ e.createElement(
40
+ d,
41
+ {
42
+ ...v,
43
+ className: s.popover,
44
+ controller: l
45
+ },
46
+ /* @__PURE__ */ e.createElement(
47
+ T,
48
+ {
49
+ type: "ContextMenu",
50
+ controller: l
51
+ },
52
+ /* @__PURE__ */ e.createElement(
53
+ a.Menu,
54
+ {
55
+ className: s.contextMenu,
56
+ onAction: n,
57
+ selectionMode: f,
58
+ selectedKeys: c,
59
+ defaultSelectedKeys: i,
60
+ disabledKeys: m,
61
+ onSelectionChange: p,
62
+ ref: u
63
+ },
64
+ /* @__PURE__ */ e.createElement(O, { props: y }, /* @__PURE__ */ e.createElement(A, { closeOverlay: M }, r))
65
+ )
66
+ )
67
+ ));
68
+ }), H = (t) => {
69
+ const { children: r, ...n } = t;
70
+ return /* @__PURE__ */ e.createElement(
71
+ h,
72
+ {
73
+ overlayType: "ContextMenu",
74
+ ...n,
75
+ component: a.MenuTrigger
76
+ },
77
+ r
78
+ );
79
+ };
80
+ export {
81
+ G as C,
82
+ H as a
83
+ };
@@ -11,35 +11,35 @@ import "@react-aria/utils";
11
11
  import "remeda";
12
12
  import "./context-Bdh6m_8S.js";
13
13
  import { f } from "./flowComponent-CWmvUeHT.js";
14
- import { O as x } from "./OverlayTrigger-DpALSyS8.js";
14
+ import { O as x } from "./OverlayTrigger-CZdXqASS.js";
15
15
  import { useLocalizedStringFormatter as g } from "react-aria";
16
16
  import "@tabler/icons-react";
17
17
  import "./Icon-CvhSELPq.js";
18
18
  import { I as C } from "./IconInfo-DDhh409U.js";
19
19
  const H = "flow--contextual-help", d = {
20
20
  contextualHelp: H
21
- }, A = f("ContextualHelp", (e) => {
21
+ }, A = f("ContextualHelp", (o) => {
22
22
  const {
23
- children: o,
23
+ children: e,
24
24
  controller: r,
25
25
  refProp: a,
26
26
  ...n
27
- } = e, m = u("ContextualHelp", {
27
+ } = o, m = u("ContextualHelp", {
28
28
  reuseControllerFromContext: !0
29
- }), i = r ?? m, p = {
29
+ }), p = r ?? m, i = {
30
30
  Heading: {
31
31
  level: 5
32
32
  }
33
33
  };
34
- return /* @__PURE__ */ t.createElement(s, { withTip: !0, ...n, controller: i }, /* @__PURE__ */ t.createElement(l, { props: p }, /* @__PURE__ */ t.createElement("div", { className: d.contextualHelp }, o)));
35
- }), E = { "de-DE": {
34
+ return /* @__PURE__ */ t.createElement(s, { withTip: !0, ...n, controller: p }, /* @__PURE__ */ t.createElement(l, { props: i }, /* @__PURE__ */ t.createElement("div", { className: d.contextualHelp }, e)));
35
+ }), P = { "de-DE": {
36
36
  "contextualHelpButton.moreInformation": "Weitere Informationen"
37
37
  }, "en-EN": {
38
38
  "contextualHelpButton.moreInformation": "More information"
39
- } }, L = (e) => {
40
- const { children: o, ...r } = e, n = {
39
+ } }, L = (o) => {
40
+ const { children: e, ...r } = o, n = {
41
41
  Button: {
42
- "aria-label": g(E).format(
42
+ "aria-label": g(P).format(
43
43
  "contextualHelpButton.moreInformation"
44
44
  ),
45
45
  children: /* @__PURE__ */ t.createElement(C, null),
@@ -47,7 +47,15 @@ const H = "flow--contextual-help", d = {
47
47
  variant: "plain"
48
48
  }
49
49
  };
50
- return /* @__PURE__ */ t.createElement(x, { overlayType: "ContextualHelp", ...r }, /* @__PURE__ */ t.createElement(c.DialogTrigger, null, /* @__PURE__ */ t.createElement(l, { props: n, mergeInParentContext: !0 }, o)));
50
+ return /* @__PURE__ */ t.createElement(
51
+ x,
52
+ {
53
+ overlayType: "ContextualHelp",
54
+ ...r,
55
+ component: c.DialogTrigger
56
+ },
57
+ /* @__PURE__ */ t.createElement(l, { props: n, mergeInParentContext: !0 }, e)
58
+ );
51
59
  };
52
60
  export {
53
61
  A as ContextualHelp,
@@ -15,7 +15,7 @@ import "@react-aria/utils";
15
15
  import "remeda";
16
16
  import "dot-prop";
17
17
  import { f as C } from "./flowComponent-CWmvUeHT.js";
18
- import { A as E } from "./Action-SzQtjRB5.js";
18
+ import { A as E } from "./Action-BW80BkOP.js";
19
19
  const B = { "de-DE": {
20
20
  "copyButton.copy": "Kopieren"
21
21
  }, "en-EN": {
package/dist/List.js CHANGED
@@ -5,15 +5,15 @@ var tt = (s, t, e) => t in s ? _(s, t, { enumerable: !0, configurable: !0, writa
5
5
  var o = (s, t, e) => (tt(s, typeof t != "symbol" ? t + "" : t, e), e);
6
6
  import n, { createContext as et, useContext as at, createElement as st, useEffect as F, useRef as nt, Suspense as it } from "react";
7
7
  import { R as rt } from "./Render-BdlTa7Qb.js";
8
- import { C as q, a as ot } from "./ContextMenuTrigger-CeyI6LLR.js";
9
- import { M as K } from "./MenuItem-CCEquV9i.js";
10
- import * as j from "react-aria-components";
11
- import { autorun as lt, runInAction as ct, makeObservable as ut, observable as N, computed as R, action as I } from "mobx";
8
+ import { a as w, C as K } from "./ContextMenuTrigger-Cm0Tlmv1.js";
9
+ import { M as j } from "./MenuItem-CCEquV9i.js";
10
+ import "react-aria-components";
11
+ import { autorun as ot, runInAction as lt, makeObservable as ct, observable as M, computed as V, action as I } from "mobx";
12
12
  import "./context-Bdh6m_8S.js";
13
13
  import "./propsContext-DzAKlmhS.js";
14
14
  import "@react-aria/utils";
15
- import { times as mt } from "remeda";
16
- import { getProperty as dt } from "dot-prop";
15
+ import { times as ut } from "remeda";
16
+ import { getProperty as mt } from "dot-prop";
17
17
  import { T as y } from "./Text-BgxTAtk1.js";
18
18
  import "@tabler/icons-react";
19
19
  import "./Icon-CvhSELPq.js";
@@ -21,30 +21,30 @@ import { I as J } from "./IconChevronDown-BjpRbARt.js";
21
21
  import { B as g } from "./Button-Bs4J6es6.js";
22
22
  import { useLocalizedStringFormatter as v } from "react-aria";
23
23
  import W from "clsx";
24
- import { I as ht } from "./IconClose-DVwhXp3R.js";
25
- import { useReactTable as gt, getCoreRowModel as pt, getSortedRowModel as ft, getFilteredRowModel as bt, getPaginationRowModel as St, getFacetedUniqueValues as yt } from "@tanstack/react-table";
24
+ import { I as dt } from "./IconClose-DVwhXp3R.js";
25
+ import { useReactTable as ht, getCoreRowModel as gt, getSortedRowModel as pt, getFilteredRowModel as ft, getPaginationRowModel as bt, getFacetedUniqueValues as St } from "@tanstack/react-table";
26
26
  import Y from "invariant";
27
- import { useLocalObservable as vt } from "mobx-react-lite";
28
- import { getAsyncResource as V } from "@mittwald/react-use-promise";
29
- import { u as x } from "./useSelector-DpU7_HMO.js";
30
- import { I as Et } from "./IllustratedMessage-DadLfPs9.js";
31
- import { I as Ct } from "./IconSearch-DAPXXri4.js";
32
- import { H as It } from "./Heading-ob3LPLN8.js";
27
+ import { useLocalObservable as yt } from "mobx-react-lite";
28
+ import { getAsyncResource as x } from "@mittwald/react-use-promise";
29
+ import { u as z } from "./useSelector-DpU7_HMO.js";
30
+ import { I as vt } from "./IllustratedMessage-DadLfPs9.js";
31
+ import { I as Et } from "./IconSearch-DAPXXri4.js";
32
+ import { H as Ct } from "./Heading-ob3LPLN8.js";
33
33
  import { S as G } from "./Skeleton-CKLaTmDR.js";
34
- import { P as Ft } from "./PropsContextProvider-C6Z4XGp6.js";
35
- import { d as Tt } from "./dynamic-ClpUSmEt.js";
34
+ import { P as It } from "./PropsContextProvider-C6Z4XGp6.js";
35
+ import { d as Ft } from "./dynamic-ClpUSmEt.js";
36
36
  import { I as Lt } from "./IconContextMenu-B7agrmqo.js";
37
- import { TunnelProvider as wt, TunnelExit as z } from "@mittwald/react-tunnel";
38
- import { L as Bt } from "./Link-Bal042NI.js";
39
- import { d as C, a as $ } from "./deepFindOfType-6pG0fH7S.js";
40
- import { ListLoaderAsyncResource as At } from "./List/ListLoaderAsyncResource.js";
41
- import { I as kt } from "./InlineCode-BT-PKxVv.js";
37
+ import { TunnelProvider as Tt, TunnelExit as $ } from "@mittwald/react-tunnel";
38
+ import { L as wt } from "./Link-Bal042NI.js";
39
+ import { d as C, a as O } from "./deepFindOfType-6pG0fH7S.js";
40
+ import { ListLoaderAsyncResource as Bt } from "./List/ListLoaderAsyncResource.js";
41
+ import { I as At } from "./InlineCode-BT-PKxVv.js";
42
42
  import "react-children-utilities";
43
- const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocationHooks().map((t, e) => /* @__PURE__ */ n.createElement(rt, { key: e }, () => {
43
+ const Q = et({}), h = () => at(Q).list, kt = () => h().loader.getLoaderInvocationHooks().map((t, e) => /* @__PURE__ */ n.createElement(rt, { key: e }, () => {
44
44
  t();
45
- })), Pt = (s) => {
45
+ })), Dt = (s) => {
46
46
  const { sorting: t } = s;
47
- return /* @__PURE__ */ n.createElement(K, { id: t.getTableColumn().id }, t.name);
47
+ return /* @__PURE__ */ n.createElement(j, { id: t.getTableColumn().id }, t.name);
48
48
  }, d = { "de-DE": {
49
49
  "list.noResult.heading": "Keine Suchergebnisse gefunden",
50
50
  "list.noResult.text": "Deine Suche ergab keine Ergebnisse. Bitte passe die Suchanfrage oder deine Filter an.",
@@ -65,15 +65,15 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
65
65
  "list.setSorting": (s) => `Sorting: ${s.property}`,
66
66
  "list.showMore": "Show more",
67
67
  "list.sorting": "Sorting"
68
- } }, T = (s) => {
68
+ } }, L = (s) => {
69
69
  const { children: t, locales: e, variables: a } = s;
70
70
  return v(e).format(t, a);
71
- }, Mt = () => {
72
- const s = h(), t = s.sorting.map((i) => /* @__PURE__ */ n.createElement(Pt, { sorting: i, key: i.getTableColumn().id }));
71
+ }, Pt = () => {
72
+ const s = h(), t = s.sorting.map((i) => /* @__PURE__ */ n.createElement(Dt, { sorting: i, key: i.getTableColumn().id }));
73
73
  if (s.sorting.length === 0)
74
74
  return null;
75
75
  const e = s.sorting.find((i) => i.isSorted()), a = /* @__PURE__ */ n.createElement(y, null, e ? /* @__PURE__ */ n.createElement(
76
- T,
76
+ L,
77
77
  {
78
78
  locales: d,
79
79
  variables: {
@@ -81,9 +81,9 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
81
81
  }
82
82
  },
83
83
  "list.setSorting"
84
- ) : /* @__PURE__ */ n.createElement(T, { locales: d }, "list.sorting"));
85
- return /* @__PURE__ */ n.createElement(j.MenuTrigger, null, /* @__PURE__ */ n.createElement(g, { variant: "soft", size: "s", color: "secondary" }, a, /* @__PURE__ */ n.createElement(J, null)), /* @__PURE__ */ n.createElement(
86
- q,
84
+ ) : /* @__PURE__ */ n.createElement(L, { locales: d }, "list.sorting"));
85
+ return /* @__PURE__ */ n.createElement(w, null, /* @__PURE__ */ n.createElement(g, { variant: "soft", size: "s", color: "secondary" }, a, /* @__PURE__ */ n.createElement(J, null)), /* @__PURE__ */ n.createElement(
86
+ K,
87
87
  {
88
88
  selectionMode: "single",
89
89
  selectedKeys: e ? [e.property] : [],
@@ -94,11 +94,11 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
94
94
  t
95
95
  ));
96
96
  }, Nt = (s) => {
97
- const { filter: t } = s, e = t.values.map((r) => /* @__PURE__ */ n.createElement(K, { key: t.getValueId(r), id: String(r) }, String(r))), a = t.values.filter((r) => t.isValueActive(r)).map((r) => String(r)), i = (r) => {
97
+ const { filter: t } = s, e = t.values.map((r) => /* @__PURE__ */ n.createElement(j, { key: t.getValueId(r), id: String(r) }, String(r))), a = t.values.filter((r) => t.isValueActive(r)).map((r) => String(r)), i = (r) => {
98
98
  t.toggleValue(r);
99
99
  };
100
- return /* @__PURE__ */ n.createElement(j.MenuTrigger, null, /* @__PURE__ */ n.createElement(g, { variant: "soft", size: "s", color: "secondary" }, /* @__PURE__ */ n.createElement(y, null, t.name ?? t.property), /* @__PURE__ */ n.createElement(J, null)), /* @__PURE__ */ n.createElement(
101
- q,
100
+ return /* @__PURE__ */ n.createElement(w, null, /* @__PURE__ */ n.createElement(g, { variant: "soft", size: "s", color: "secondary" }, /* @__PURE__ */ n.createElement(y, null, t.name ?? t.property), /* @__PURE__ */ n.createElement(J, null)), /* @__PURE__ */ n.createElement(
101
+ K,
102
102
  {
103
103
  onAction: i,
104
104
  selectionMode: "multiple",
@@ -106,13 +106,13 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
106
106
  },
107
107
  e
108
108
  ));
109
- }, Rt = "flow--list--header", Vt = "flow--list--header--picker-list", O = {
109
+ }, Rt = "flow--list--header", Mt = "flow--list--header--picker-list", U = {
110
110
  header: Rt,
111
- pickerList: Vt
112
- }, xt = "flow--list--header--active-filters", zt = "flow--list--header--clear-button", U = {
113
- activeFilters: xt,
114
- clearButton: zt
115
- }, $t = () => {
111
+ pickerList: Mt
112
+ }, Vt = "flow--list--header--active-filters", xt = "flow--list--header--clear-button", H = {
113
+ activeFilters: Vt,
114
+ clearButton: xt
115
+ }, zt = () => {
116
116
  const s = h(), t = s.filters.flatMap(
117
117
  (e) => e.values.filter((a) => e.isValueActive(a)).map((a) => /* @__PURE__ */ n.createElement(
118
118
  g,
@@ -123,24 +123,24 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
123
123
  onPress: () => e.deactivateValue(a)
124
124
  },
125
125
  /* @__PURE__ */ n.createElement(y, null, String(a)),
126
- /* @__PURE__ */ n.createElement(ht, null)
126
+ /* @__PURE__ */ n.createElement(dt, null)
127
127
  ))
128
128
  );
129
- return t.length <= 0 ? null : /* @__PURE__ */ n.createElement("div", { className: U.activeFilters }, t, /* @__PURE__ */ n.createElement(
129
+ return t.length <= 0 ? null : /* @__PURE__ */ n.createElement("div", { className: H.activeFilters }, t, /* @__PURE__ */ n.createElement(
130
130
  g,
131
131
  {
132
- className: U.clearButton,
132
+ className: H.clearButton,
133
133
  size: "s",
134
134
  variant: "plain",
135
135
  onPress: () => s.clearFilters()
136
136
  },
137
- /* @__PURE__ */ n.createElement(T, { locales: d }, "list.resetAll")
137
+ /* @__PURE__ */ n.createElement(L, { locales: d }, "list.resetAll")
138
138
  ));
139
- }, Ot = (s) => {
139
+ }, $t = (s) => {
140
140
  const { className: t } = s, a = h().filters.map((i) => /* @__PURE__ */ n.createElement(Nt, { key: i.property, filter: i }));
141
- return /* @__PURE__ */ n.createElement("div", { className: W(t, O.header) }, /* @__PURE__ */ n.createElement("div", { className: O.pickerList }, /* @__PURE__ */ n.createElement(Mt, null), a), /* @__PURE__ */ n.createElement($t, null));
142
- }, Ut = "flow--list", Ht = {
143
- list: Ut
141
+ return /* @__PURE__ */ n.createElement("div", { className: W(t, U.header) }, /* @__PURE__ */ n.createElement("div", { className: U.pickerList }, /* @__PURE__ */ n.createElement(Pt, null), a), /* @__PURE__ */ n.createElement(zt, null));
142
+ }, Ot = "flow--list", Ut = {
143
+ list: Ot
144
144
  }, S = class S {
145
145
  constructor(t, e, a) {
146
146
  o(this, "id");
@@ -156,20 +156,20 @@ const Q = et({}), h = () => at(Q).list, Dt = () => h().loader.getLoaderInvocatio
156
156
  }
157
157
  };
158
158
  o(S, "fallbackRenderItemFn", (t) => st("pre", void 0, JSON.stringify(t)));
159
- let L = S;
160
- class w {
159
+ let T = S;
160
+ class B {
161
161
  constructor(t) {
162
162
  o(this, "list");
163
163
  this.list = t;
164
164
  }
165
165
  static useNew(t) {
166
- return new w(t);
166
+ return new B(t);
167
167
  }
168
168
  get entries() {
169
- return this.list.reactTable.table.getRowModel().rows.map((t) => L.fromRow(this, t));
169
+ return this.list.reactTable.table.getRowModel().rows.map((t) => T.fromRow(this, t));
170
170
  }
171
171
  }
172
- class qt {
172
+ class Ht {
173
173
  constructor(t, e = {}) {
174
174
  o(this, "batchSize");
175
175
  o(this, "list");
@@ -218,8 +218,8 @@ class qt {
218
218
  }
219
219
  }
220
220
  }
221
- const Kt = (s, t) => s === t;
222
- class jt {
221
+ const qt = (s, t) => s === t;
222
+ class Kt {
223
223
  constructor(t, e) {
224
224
  o(this, "_values");
225
225
  o(this, "list");
@@ -228,14 +228,14 @@ class jt {
228
228
  o(this, "matcher");
229
229
  o(this, "name");
230
230
  o(this, "onFilterUpdateCallbacks", /* @__PURE__ */ new Set());
231
- this.list = t, this.property = e.property, this.mode = e.mode ?? "one", this._values = e.values, this.matcher = e.matcher ?? Kt, this.name = e.name;
231
+ this.list = t, this.property = e.property, this.mode = e.mode ?? "one", this._values = e.values, this.matcher = e.matcher ?? qt, this.name = e.name;
232
232
  }
233
233
  updateTableColumnDef(t) {
234
234
  t.enableColumnFilter = !0, t.filterFn = this.getReactTableFilterFn();
235
235
  }
236
236
  getReactTableFilterFn() {
237
237
  return (t, e, a) => this.checkFilterMatches(
238
- dt(t.original, this.property),
238
+ mt(t.original, this.property),
239
239
  a
240
240
  );
241
241
  }
@@ -301,7 +301,7 @@ class jt {
301
301
  this.onFilterUpdateCallbacks.add(t);
302
302
  }
303
303
  }
304
- class Jt {
304
+ class jt {
305
305
  constructor(t, e) {
306
306
  o(this, "list");
307
307
  o(this, "property");
@@ -326,8 +326,8 @@ class Jt {
326
326
  this.list.reactTable.getTableColumn(this.property).clearSorting();
327
327
  }
328
328
  }
329
- const Wt = (s) => F(lt(s));
330
- class B {
329
+ const Jt = (s) => F(ot(s));
330
+ class A {
331
331
  constructor(t, e = {}) {
332
332
  o(this, "list");
333
333
  o(this, "table");
@@ -337,17 +337,17 @@ class B {
337
337
  if (!e)
338
338
  return;
339
339
  const a = typeof t == "function" ? t(e) : t;
340
- ct(() => {
340
+ lt(() => {
341
341
  this.tableState.value = this.getUpdatedTableState(e, a);
342
342
  });
343
343
  });
344
- this.list = t, this.tableState = vt(() => ({ value: void 0 })), this.table = this.useReactTable(e);
344
+ this.list = t, this.tableState = yt(() => ({ value: void 0 })), this.table = this.useReactTable(e);
345
345
  }
346
346
  static useNew(t, e = {}) {
347
- return new B(t, e);
347
+ return new A(t, e);
348
348
  }
349
349
  useReactTable(t = {}) {
350
- const e = this.list.loader.useData(), a = this.list.sorting.filter((r) => r.defaultEnabled), i = gt({
350
+ const e = this.list.loader.useData(), a = this.list.sorting.filter((r) => r.defaultEnabled), i = ht({
351
351
  data: e,
352
352
  initialState: {
353
353
  pagination: {
@@ -359,18 +359,18 @@ class B {
359
359
  }))
360
360
  },
361
361
  columns: this.getTableColumnDefs(),
362
- getCoreRowModel: pt(),
363
- getSortedRowModel: ft(),
364
- getFilteredRowModel: bt(),
365
- getPaginationRowModel: St(),
366
- getFacetedUniqueValues: yt(),
362
+ getCoreRowModel: gt(),
363
+ getSortedRowModel: pt(),
364
+ getFilteredRowModel: ft(),
365
+ getPaginationRowModel: bt(),
366
+ getFacetedUniqueValues: St(),
367
367
  onStateChange: this.onTableStateChange,
368
368
  ...t
369
369
  });
370
370
  return this.useUpdateTableState(i), i;
371
371
  }
372
372
  useUpdateTableState(t) {
373
- Wt(() => {
373
+ Jt(() => {
374
374
  const e = this.tableState.value;
375
375
  e ? t.setOptions((a) => ({
376
376
  ...a,
@@ -405,23 +405,23 @@ class B {
405
405
  ), Array.from(t.values());
406
406
  }
407
407
  }
408
- class A {
408
+ class k {
409
409
  constructor() {
410
410
  o(this, "dataBatches", []);
411
411
  o(this, "prevDataBatches", []);
412
412
  o(this, "batchLoadingStates", ["void"]);
413
- ut(this, {
414
- dataBatches: N.shallow,
415
- batchLoadingStates: N.shallow,
416
- mergedData: R,
417
- isLoading: R,
413
+ ct(this, {
414
+ dataBatches: M.shallow,
415
+ batchLoadingStates: M.shallow,
416
+ mergedData: V,
417
+ isLoading: V,
418
418
  reset: I.bound,
419
419
  setDataBatch: I.bound,
420
420
  setBatchLoadingState: I.bound
421
421
  });
422
422
  }
423
423
  static useNew() {
424
- return nt(new A()).current;
424
+ return nt(new k()).current;
425
425
  }
426
426
  reset() {
427
427
  this.batchLoadingStates = [], this.dataBatches = [];
@@ -436,17 +436,17 @@ class A {
436
436
  return (this.dataBatches.length === 0 ? this.prevDataBatches : this.dataBatches).flatMap((e) => e);
437
437
  }
438
438
  useMergedData() {
439
- return x(() => this.mergedData);
439
+ return z(() => this.mergedData);
440
440
  }
441
441
  get isLoading() {
442
442
  return this.batchLoadingStates.some((t) => t === "loading" || t === "void");
443
443
  }
444
444
  useIsLoading() {
445
- return x(() => this.isLoading);
445
+ return z(() => this.isLoading);
446
446
  }
447
447
  }
448
- const Yt = [];
449
- class k {
448
+ const Wt = [];
449
+ class D {
450
450
  constructor(t, e = {}) {
451
451
  o(this, "list");
452
452
  o(this, "dataSource");
@@ -455,12 +455,12 @@ class k {
455
455
  o(this, "manualPagination");
456
456
  o(this, "loaderState");
457
457
  const { source: a } = e;
458
- this.dataSource = a ?? { staticData: Yt };
458
+ this.dataSource = a ?? { staticData: Wt };
459
459
  const i = "manualPagination" in this.dataSource ? this.dataSource.manualPagination : void 0, r = "manualFiltering" in this.dataSource ? this.dataSource.manualFiltering : void 0, l = "manualSorting" in this.dataSource ? this.dataSource.manualSorting : void 0;
460
- this.list = t, this.loaderState = A.useNew(), this.manualPagination = i ?? !1, this.manualFiltering = r ?? this.manualPagination, this.manualSorting = l ?? this.manualPagination, this.list.filters.forEach((u) => u.onFilterUpdated(() => this.reset()));
460
+ this.list = t, this.loaderState = k.useNew(), this.manualPagination = i ?? !1, this.manualFiltering = r ?? this.manualPagination, this.manualSorting = l ?? this.manualPagination, this.list.filters.forEach((u) => u.onFilterUpdated(() => this.reset()));
461
461
  }
462
462
  static useNew(t, e = {}) {
463
- return new k(t, e);
463
+ return new D(t, e);
464
464
  }
465
465
  reset() {
466
466
  this.loaderState.reset();
@@ -475,7 +475,7 @@ class k {
475
475
  return this.loaderState.useMergedData();
476
476
  }
477
477
  getLoaderInvocationHooks() {
478
- return mt(this.list.batches.getBatchIndex() + 1, (e) => e).map((e) => () => {
478
+ return ut(this.list.batches.getBatchIndex() + 1, (e) => e).map((e) => () => {
479
479
  this.useLoadBatch(e);
480
480
  });
481
481
  }
@@ -522,7 +522,7 @@ class k {
522
522
  getBatchDataAsyncResource(t) {
523
523
  const e = this.dataSource, a = this.getDataLoaderOptions(t);
524
524
  if ("staticData" in e)
525
- return V(
525
+ return x(
526
526
  async (i) => ({
527
527
  data: i,
528
528
  itemTotalCount: i.length
@@ -531,7 +531,7 @@ class k {
531
531
  );
532
532
  if ("asyncLoader" in e) {
533
533
  const i = e.asyncLoader;
534
- return V(i, [a]);
534
+ return x(i, [a]);
535
535
  }
536
536
  if ("asyncResourceFactory" in e) {
537
537
  const i = e.asyncResourceFactory;
@@ -540,7 +540,7 @@ class k {
540
540
  throw new Error("Unknown data source");
541
541
  }
542
542
  }
543
- let Gt = class X {
543
+ let Yt = class X {
544
544
  constructor(t) {
545
545
  o(this, "filters");
546
546
  o(this, "sorting");
@@ -550,7 +550,7 @@ let Gt = class X {
550
550
  o(this, "batches");
551
551
  o(this, "loader");
552
552
  const { render: e, filters: a = [], sorting: i = [], batchesController: r } = t;
553
- this.render = e, this.items = w.useNew(this), this.filters = a.map((l) => new jt(this, l)), this.sorting = i.map((l) => new Jt(this, l)), this.batches = new qt(this, r), this.loader = k.useNew(this, t.loader), this.reactTable = B.useNew(this, {
553
+ this.render = e, this.items = B.useNew(this), this.filters = a.map((l) => new Kt(this, l)), this.sorting = i.map((l) => new jt(this, l)), this.batches = new Ht(this, r), this.loader = D.useNew(this, t.loader), this.reactTable = A.useNew(this, {
554
554
  manualFiltering: this.loader.manualFiltering,
555
555
  manualPagination: this.loader.manualPagination,
556
556
  manualSorting: this.loader.manualSorting
@@ -576,22 +576,22 @@ let Gt = class X {
576
576
  return !this.loader.useIsLoading() && this.items.entries.length === 0;
577
577
  }
578
578
  };
579
- const Qt = "flow--list--items--item-list", Xt = "flow--list--items--is-loading", H = {
580
- itemList: Qt,
581
- isLoading: Xt
582
- }, Zt = "flow--list--items--item", _t = "flow--list--items--title", te = "flow--list--items--top-content", ee = "flow--list--items--content", ae = "flow--list--items--action", se = "flow--list--items--avatar", ne = "flow--list--items--text", ie = "flow--list--items--status-badge", re = "flow--list--items--heading", c = {
583
- item: Zt,
584
- title: _t,
585
- topContent: te,
586
- content: ee,
587
- action: ae,
588
- avatar: se,
589
- text: ne,
590
- statusBadge: ie,
591
- heading: re
592
- }, oe = (s) => {
579
+ const Gt = "flow--list--items--item-list", Qt = "flow--list--items--is-loading", q = {
580
+ itemList: Gt,
581
+ isLoading: Qt
582
+ }, Xt = "flow--list--items--item", Zt = "flow--list--items--title", _t = "flow--list--items--top-content", te = "flow--list--items--content", ee = "flow--list--items--action", ae = "flow--list--items--avatar", se = "flow--list--items--text", ne = "flow--list--items--status-badge", ie = "flow--list--items--heading", c = {
583
+ item: Xt,
584
+ title: Zt,
585
+ topContent: _t,
586
+ content: te,
587
+ action: ee,
588
+ avatar: ae,
589
+ text: se,
590
+ statusBadge: ne,
591
+ heading: ie
592
+ }, re = (s) => {
593
593
  const { className: t, children: e } = s, a = v(d);
594
- return /* @__PURE__ */ n.createElement(ot, null, /* @__PURE__ */ n.createElement(
594
+ return /* @__PURE__ */ n.createElement(w, null, /* @__PURE__ */ n.createElement(
595
595
  g,
596
596
  {
597
597
  variant: "plain",
@@ -600,17 +600,17 @@ const Qt = "flow--list--items--item-list", Xt = "flow--list--items--is-loading",
600
600
  },
601
601
  /* @__PURE__ */ n.createElement(Lt, null)
602
602
  ), e);
603
- }, le = (s) => s === "top" ? c.topContent : s === "bottom" ? c.content : c.topContent, Z = (s) => {
603
+ }, oe = (s) => s === "top" ? c.topContent : s === "bottom" ? c.content : c.topContent, Z = (s) => {
604
604
  const { children: t, href: e, ...a } = s, i = {
605
605
  ContextMenu: {
606
- wrapWith: /* @__PURE__ */ n.createElement(oe, { className: c.action }),
606
+ wrapWith: /* @__PURE__ */ n.createElement(re, { className: c.action }),
607
607
  placement: "bottom end"
608
608
  },
609
609
  Button: {
610
610
  className: c.action
611
611
  },
612
612
  Content: {
613
- className: Tt((l) => le(l.slot)),
613
+ className: Ft((l) => oe(l.slot)),
614
614
  tunnelId: "topContent"
615
615
  },
616
616
  Avatar: {
@@ -633,16 +633,19 @@ const Qt = "flow--list--items--item-list", Xt = "flow--list--items--is-loading",
633
633
  Link: {
634
634
  unstyled: !0
635
635
  }
636
- }, r = (l) => e ? /* @__PURE__ */ n.createElement(Bt, { unstyled: !0, ...a, className: c.item, href: e }, l.children) : /* @__PURE__ */ n.createElement("div", { className: c.item }, l.children);
637
- return /* @__PURE__ */ n.createElement(r, null, /* @__PURE__ */ n.createElement(Ft, { props: i }, /* @__PURE__ */ n.createElement(wt, null, t, /* @__PURE__ */ n.createElement("div", { className: c.title }, /* @__PURE__ */ n.createElement(z, { id: "title" })), /* @__PURE__ */ n.createElement(z, { id: "topContent" }))));
638
- }, b = () => /* @__PURE__ */ n.createElement(Z, null, /* @__PURE__ */ n.createElement(G, { height: "3rem" })), ce = (s) => {
636
+ }, r = (l) => e ? /* @__PURE__ */ n.createElement(wt, { unstyled: !0, ...a, className: c.item, href: e }, l.children) : /* @__PURE__ */ n.createElement("div", { className: c.item }, l.children);
637
+ return /* @__PURE__ */ n.createElement(r, null, /* @__PURE__ */ n.createElement(It, { props: i }, /* @__PURE__ */ n.createElement(Tt, null, t, /* @__PURE__ */ n.createElement("div", { className: c.title }, /* @__PURE__ */ n.createElement($, { id: "title" })), /* @__PURE__ */ n.createElement($, { id: "topContent" }))));
638
+ }, b = () => /* @__PURE__ */ n.createElement(Z, null, /* @__PURE__ */ n.createElement(G, { height: "3rem" })), le = (s) => {
639
639
  const { className: t } = s, e = h(), a = e.loader.useIsLoading(), i = e.loader.useIsInitiallyLoading(), r = e.useIsEmpty(), l = v(d), u = e.items.entries.map((m) => /* @__PURE__ */ n.createElement(it, { key: m.id }, m.render())), p = W(
640
- H.itemList,
640
+ q.itemList,
641
641
  t,
642
- a && H.isLoading
642
+ a && q.isLoading
643
643
  );
644
- return r ? /* @__PURE__ */ n.createElement(Et, null, /* @__PURE__ */ n.createElement(Ct, null), /* @__PURE__ */ n.createElement(It, null, l.format("list.noResult.heading")), /* @__PURE__ */ n.createElement(y, null, l.format("list.noResult.text"))) : /* @__PURE__ */ n.createElement("div", { className: p }, i ? ue : u);
645
- }, ue = /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null));
644
+ return r ? /* @__PURE__ */ n.createElement(vt, null, /* @__PURE__ */ n.createElement(Et, null), /* @__PURE__ */ n.createElement(Ct, null, l.format("list.noResult.heading")), /* @__PURE__ */ n.createElement(y, null, l.format("list.noResult.text"))) : /* @__PURE__ */ n.createElement("div", { className: p }, i ? ce : u);
645
+ }, ce = /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null), /* @__PURE__ */ n.createElement(b, null));
646
+ function ue(s) {
647
+ return null;
648
+ }
646
649
  function me(s) {
647
650
  return null;
648
651
  }
@@ -655,12 +658,9 @@ function he(s) {
655
658
  function ge(s) {
656
659
  return null;
657
660
  }
658
- function pe(s) {
659
- return null;
660
- }
661
- const fe = "flow--list--footer", be = {
662
- footer: fe
663
- }, Se = (s) => {
661
+ const pe = "flow--list--footer", fe = {
662
+ footer: pe
663
+ }, be = (s) => {
664
664
  const t = v(d), e = h(), a = e.batches, i = e.isFiltered() && !e.loader.manualFiltering, r = e.loader.useIsInitiallyLoading(), l = e.useIsEmpty(), u = a.getTotalItemsCount() ?? 0, p = a.getFilteredItemsCount() ?? 0, m = a.getVisibleItemsCount() ?? 0;
665
665
  if (l)
666
666
  return null;
@@ -673,7 +673,7 @@ const fe = "flow--list--footer", be = {
673
673
  totalItemsCount: u
674
674
  });
675
675
  return /* @__PURE__ */ n.createElement(y, { ...s }, E);
676
- }, ye = (s) => {
676
+ }, Se = (s) => {
677
677
  const t = v(d), e = h(), a = e.loader.useIsLoading(), i = e.loader.useIsInitiallyLoading();
678
678
  return !e.batches.hasNextBatch() && !a ? null : /* @__PURE__ */ n.createElement(
679
679
  g,
@@ -687,13 +687,13 @@ const fe = "flow--list--footer", be = {
687
687
  },
688
688
  t.format("list.showMore")
689
689
  );
690
- }, ve = () => /* @__PURE__ */ n.createElement("div", { className: be.footer }, /* @__PURE__ */ n.createElement(Se, null), /* @__PURE__ */ n.createElement(ye, null)), Ee = (s) => /* @__PURE__ */ n.createElement(Z, null, /* @__PURE__ */ n.createElement(kt, null, JSON.stringify(s.data)));
690
+ }, ye = () => /* @__PURE__ */ n.createElement("div", { className: fe.footer }, /* @__PURE__ */ n.createElement(be, null), /* @__PURE__ */ n.createElement(Se, null)), ve = (s) => /* @__PURE__ */ n.createElement(Z, null, /* @__PURE__ */ n.createElement(At, null, JSON.stringify(s.data)));
691
691
  function ia(s) {
692
- var E, D, P, M;
693
- const { children: t, batchSize: e, ...a } = s, i = (E = C(t, me)) == null ? void 0 : E.props, r = (D = C(
692
+ var E, P, N, R;
693
+ const { children: t, batchSize: e, ...a } = s, i = (E = C(t, ue)) == null ? void 0 : E.props, r = (P = C(
694
694
  t,
695
- At
696
- )) == null ? void 0 : D.props, l = (P = C(t, pe)) == null ? void 0 : P.props, u = {
695
+ Bt
696
+ )) == null ? void 0 : P.props, l = (N = C(t, ge)) == null ? void 0 : N.props, u = {
697
697
  source: i ? {
698
698
  ...i,
699
699
  asyncLoader: i.children
@@ -703,11 +703,11 @@ function ia(s) {
703
703
  } : l ? {
704
704
  staticData: l.data
705
705
  } : void 0
706
- }, p = (f) => /* @__PURE__ */ n.createElement(Ee, { data: f }), m = Gt.useNew({
706
+ }, p = (f) => /* @__PURE__ */ n.createElement(ve, { data: f }), m = Yt.useNew({
707
707
  loader: u,
708
- filters: $(t, de).map((f) => f.props),
709
- sorting: $(t, he).map((f) => f.props),
710
- render: ((M = C(t, ge)) == null ? void 0 : M.props.children) ?? p,
708
+ filters: O(t, me).map((f) => f.props),
709
+ sorting: O(t, de).map((f) => f.props),
710
+ render: ((R = C(t, he)) == null ? void 0 : R.props.children) ?? p,
711
711
  ...a,
712
712
  batchesController: {
713
713
  batchSize: e
@@ -720,17 +720,17 @@ function ia(s) {
720
720
  list: m
721
721
  }
722
722
  },
723
- /* @__PURE__ */ n.createElement(Dt, null),
724
- /* @__PURE__ */ n.createElement("div", { className: Ht.list }, /* @__PURE__ */ n.createElement(Ot, null), /* @__PURE__ */ n.createElement(ce, null), /* @__PURE__ */ n.createElement(ve, null))
723
+ /* @__PURE__ */ n.createElement(kt, null),
724
+ /* @__PURE__ */ n.createElement("div", { className: Ut.list }, /* @__PURE__ */ n.createElement($t, null), /* @__PURE__ */ n.createElement(le, null), /* @__PURE__ */ n.createElement(ye, null))
725
725
  );
726
726
  }
727
727
  export {
728
728
  ia as List,
729
- de as ListFilter,
729
+ me as ListFilter,
730
730
  Z as ListItem,
731
- ge as ListItemView,
732
- me as ListLoaderAsync,
733
- he as ListSorting,
734
- pe as ListStaticData,
731
+ he as ListItemView,
732
+ ue as ListLoaderAsync,
733
+ de as ListSorting,
734
+ ge as ListStaticData,
735
735
  ia as default
736
736
  };
package/dist/Modal.js CHANGED
@@ -10,7 +10,7 @@ import { TunnelProvider as f, TunnelExit as p } from "@mittwald/react-tunnel";
10
10
  import { f as u } from "./flowComponent-CWmvUeHT.js";
11
11
  import { M as g } from "./ModalOverlay-TJdwgPq0.js";
12
12
  import * as v from "react-aria-components";
13
- import { O as w } from "./OverlayTrigger-DpALSyS8.js";
13
+ import { O as w } from "./OverlayTrigger-CZdXqASS.js";
14
14
  const z = "flow--modal", C = "flow--modal--action-group", E = "flow--modal--content", T = "flow--modal--off-canvas", e = {
15
15
  modal: z,
16
16
  "modal-zoom": "flow--modal--modal-zoom",
@@ -50,7 +50,15 @@ const z = "flow--modal", C = "flow--modal--action-group", E = "flow--modal--cont
50
50
  return /* @__PURE__ */ o.createElement(g, { className: s, controller: r, ...m }, /* @__PURE__ */ o.createElement(c, { props: i }, /* @__PURE__ */ o.createElement(f, null, /* @__PURE__ */ o.createElement("div", { className: e.content }, n), /* @__PURE__ */ o.createElement(p, { id: "buttons" }))));
51
51
  }), F = (t) => {
52
52
  const { children: l, ...a } = t;
53
- return /* @__PURE__ */ o.createElement(w, { overlayType: "Modal", ...a }, /* @__PURE__ */ o.createElement(v.DialogTrigger, null, l));
53
+ return /* @__PURE__ */ o.createElement(
54
+ w,
55
+ {
56
+ overlayType: "Modal",
57
+ ...a,
58
+ component: v.DialogTrigger
59
+ },
60
+ l
61
+ );
54
62
  };
55
63
  export {
56
64
  D as Modal,
package/dist/OffCanvas.js CHANGED
@@ -1,14 +1,14 @@
1
1
  "use client"
2
2
  /* */
3
- import e from "react";
3
+ import o from "react";
4
4
  import i from "clsx";
5
5
  import "mobx";
6
- import { u as v } from "./useOverlayController-C88Gnnhi.js";
7
- import { B as p } from "./Button-Bs4J6es6.js";
6
+ import { u as p } from "./useOverlayController-C88Gnnhi.js";
7
+ import { B as v } from "./Button-Bs4J6es6.js";
8
8
  import "@tabler/icons-react";
9
9
  import "./Icon-CvhSELPq.js";
10
10
  import { I as d } from "./IconClose-DVwhXp3R.js";
11
- import { A as C } from "./Action-SzQtjRB5.js";
11
+ import { A as C } from "./Action-BW80BkOP.js";
12
12
  import { M as u } from "./ModalOverlay-TJdwgPq0.js";
13
13
  import "./propsContext-DzAKlmhS.js";
14
14
  import { P as O } from "./PropsContextProvider-C6Z4XGp6.js";
@@ -19,20 +19,20 @@ import { H as E } from "./Header-DAaa854y.js";
19
19
  import { f as h } from "./flowComponent-CWmvUeHT.js";
20
20
  import { O as x } from "./OverlayContextProvider-BBz2Hde8.js";
21
21
  import * as P from "react-aria-components";
22
- import { O as w } from "./OverlayTrigger-DpALSyS8.js";
22
+ import { O as w } from "./OverlayTrigger-CZdXqASS.js";
23
23
  const T = "flow--off-canvas", B = "flow--off-canvas--header", N = "flow--off-canvas--close-button", t = {
24
24
  offCanvas: T,
25
25
  "off-canvas-slide-in": "flow--off-canvas--off-canvas-slide-in",
26
26
  "off-canvas-slide-out": "flow--off-canvas--off-canvas-slide-out",
27
27
  header: B,
28
28
  closeButton: N
29
- }, U = h("OffCanvas", (o) => {
29
+ }, U = h("OffCanvas", (e) => {
30
30
  const {
31
31
  controller: r,
32
32
  refProp: a,
33
33
  children: l,
34
34
  className: s
35
- } = o, f = i(t.offCanvas, s), m = v("OffCanvas", {
35
+ } = e, f = i(t.offCanvas, s), m = p("OffCanvas", {
36
36
  reuseControllerFromContext: !0
37
37
  }), n = r ?? m, c = {
38
38
  Heading: {
@@ -42,18 +42,26 @@ const T = "flow--off-canvas", B = "flow--off-canvas--header", N = "flow--off-can
42
42
  level: 2
43
43
  }
44
44
  };
45
- return /* @__PURE__ */ e.createElement(u, { controller: n, className: f }, /* @__PURE__ */ e.createElement(x, { type: "OffCanvas", controller: n }, /* @__PURE__ */ e.createElement(O, { props: c }, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(E, { className: t.header }, /* @__PURE__ */ e.createElement(y, { id: "heading" }), /* @__PURE__ */ e.createElement(C, { closeOverlay: "OffCanvas" }, /* @__PURE__ */ e.createElement(
46
- p,
45
+ return /* @__PURE__ */ o.createElement(u, { controller: n, className: f }, /* @__PURE__ */ o.createElement(x, { type: "OffCanvas", controller: n }, /* @__PURE__ */ o.createElement(O, { props: c }, /* @__PURE__ */ o.createElement(g, null, /* @__PURE__ */ o.createElement(E, { className: t.header }, /* @__PURE__ */ o.createElement(y, { id: "heading" }), /* @__PURE__ */ o.createElement(C, { closeOverlay: "OffCanvas" }, /* @__PURE__ */ o.createElement(
46
+ v,
47
47
  {
48
48
  variant: "plain",
49
49
  color: "secondary",
50
50
  className: t.closeButton
51
51
  },
52
- /* @__PURE__ */ e.createElement(d, null)
52
+ /* @__PURE__ */ o.createElement(d, null)
53
53
  ))), l))));
54
- }), W = (o) => {
55
- const { children: r, ...a } = o;
56
- return /* @__PURE__ */ e.createElement(w, { overlayType: "OffCanvas", ...a }, /* @__PURE__ */ e.createElement(P.DialogTrigger, null, r));
54
+ }), W = (e) => {
55
+ const { children: r, ...a } = e;
56
+ return /* @__PURE__ */ o.createElement(
57
+ w,
58
+ {
59
+ overlayType: "OffCanvas",
60
+ ...a,
61
+ component: P.DialogTrigger
62
+ },
63
+ r
64
+ );
57
65
  };
58
66
  export {
59
67
  U as OffCanvas,
@@ -0,0 +1,25 @@
1
+ "use client"
2
+ /* */
3
+ import r from "react";
4
+ import { O as m } from "./context-Bdh6m_8S.js";
5
+ import "./propsContext-DzAKlmhS.js";
6
+ import { P as i } from "./PropsContextProvider-C6Z4XGp6.js";
7
+ import "@react-aria/utils";
8
+ import "remeda";
9
+ import { O as c } from "./OverlayContextProvider-BBz2Hde8.js";
10
+ const g = (o) => {
11
+ const {
12
+ overlayType: t,
13
+ isDefaultOpen: n = !1,
14
+ component: p,
15
+ children: s
16
+ } = o, e = m.useNew(n), a = e.useIsOpen(), l = {
17
+ Button: {
18
+ onPress: e.open
19
+ }
20
+ };
21
+ return /* @__PURE__ */ r.createElement(c, { type: t, controller: e }, /* @__PURE__ */ r.createElement(i, { props: l, mergeInParentContext: !0 }, /* @__PURE__ */ r.createElement(p, { isOpen: a }, s)));
22
+ };
23
+ export {
24
+ g as O
25
+ };
package/dist/Tabs.js CHANGED
@@ -6,7 +6,7 @@ import u from "clsx";
6
6
  import { TunnelExit as C, TunnelProvider as y, TunnelEntry as f } from "@mittwald/react-tunnel";
7
7
  import { f as S } from "./flowComponent-CWmvUeHT.js";
8
8
  import { useCallbackRef as O } from "use-callback-ref";
9
- import { a as B, C as K } from "./ContextMenuTrigger-CeyI6LLR.js";
9
+ import { a as B, C as K } from "./ContextMenuTrigger-Cm0Tlmv1.js";
10
10
  import { M as A } from "./MenuItem-CCEquV9i.js";
11
11
  import { B as L } from "./Button-Bs4J6es6.js";
12
12
  import "@tabler/icons-react";
@@ -8,7 +8,7 @@ import "@react-aria/utils";
8
8
  import "remeda";
9
9
  import { d as V } from "./dynamic-ClpUSmEt.js";
10
10
  import { F as y } from "./FieldError-eiEmcuuK.js";
11
- import { a as I, A as D } from "./Action-SzQtjRB5.js";
11
+ import { a as I, A as D } from "./Action-BW80BkOP.js";
12
12
  const F = C({}), R = F.Provider, w = () => k(F);
13
13
  function T(c) {
14
14
  var r;
@@ -1,6 +1,4 @@
1
1
  import { FC } from 'react';
2
2
  import { OverlayTriggerProps } from '../../../OverlayTrigger';
3
3
 
4
- type Props = Omit<OverlayTriggerProps, "overlayType">;
5
- export declare const ContextMenuTrigger: FC<Props>;
6
- export {};
4
+ export declare const ContextMenuTrigger: FC<OverlayTriggerProps>;
@@ -1,6 +1,4 @@
1
1
  import { FC } from 'react';
2
2
  import { OverlayTriggerProps } from '../../../OverlayTrigger';
3
3
 
4
- type Props = Omit<OverlayTriggerProps, "overlayType">;
5
- export declare const ContextualHelpTrigger: FC<Props>;
6
- export {};
4
+ export declare const ContextualHelpTrigger: FC<OverlayTriggerProps>;
@@ -1,6 +1,4 @@
1
1
  import { FC } from 'react';
2
2
  import { OverlayTriggerProps } from '../../../OverlayTrigger';
3
3
 
4
- type Props = Omit<OverlayTriggerProps, "overlayType">;
5
- export declare const ModalTrigger: FC<Props>;
6
- export {};
4
+ export declare const ModalTrigger: FC<OverlayTriggerProps>;
@@ -1,8 +1,17 @@
1
- import { FC, PropsWithChildren } from 'react';
1
+ import { ComponentType, FC, ReactNode } from 'react';
2
2
  import { FlowComponentName } from '../propTypes';
3
3
 
4
- export interface OverlayTriggerProps extends PropsWithChildren {
5
- overlayType: FlowComponentName;
4
+ type AriaComponentType = ComponentType<{
5
+ isOpen?: boolean;
6
+ children: ReactNode;
7
+ }>;
8
+ export interface OverlayTriggerProps {
6
9
  isDefaultOpen?: boolean;
10
+ children: ReactNode;
11
+ }
12
+ interface Props extends OverlayTriggerProps {
13
+ overlayType: FlowComponentName;
14
+ component: AriaComponentType;
7
15
  }
8
- export declare const OverlayTrigger: FC<OverlayTriggerProps>;
16
+ export declare const OverlayTrigger: FC<Props>;
17
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mittwald/flow-react-components",
3
- "version": "0.1.0-alpha.144",
3
+ "version": "0.1.0-alpha.145",
4
4
  "type": "module",
5
5
  "description": "A React implementation of Flow, mittwald’s design system",
6
6
  "homepage": "https://mittwald.github.io/flow",
@@ -276,7 +276,7 @@
276
276
  "dependencies": {
277
277
  "@chakra-ui/live-region": "^2.1.0",
278
278
  "@internationalized/string-compiler": "^3.2.4",
279
- "@mittwald/react-tunnel": "^0.1.0-alpha.144",
279
+ "@mittwald/react-tunnel": "^0.1.0-alpha.145",
280
280
  "@mittwald/react-use-promise": "^2.3.13",
281
281
  "@react-aria/utils": "^3.24.1",
282
282
  "@react-types/shared": "^3.23.1",
@@ -303,7 +303,7 @@
303
303
  },
304
304
  "devDependencies": {
305
305
  "@faker-js/faker": "^8.4.1",
306
- "@mittwald/flow-design-tokens": "^0.1.0-alpha.144",
306
+ "@mittwald/flow-design-tokens": "^0.1.0-alpha.145",
307
307
  "@mittwald/react-use-promise": "^2.3.13",
308
308
  "@nx/storybook": "^19.2.3",
309
309
  "@storybook/addon-a11y": "^8.1.6",
@@ -379,5 +379,5 @@
379
379
  "optional": true
380
380
  }
381
381
  },
382
- "gitHead": "061d609704ce5d70cbd852839379a4eb3a331ada"
382
+ "gitHead": "120a56bdbb4ddc119e9e718f8562e6dd89574dd3"
383
383
  }
@@ -1,55 +0,0 @@
1
- "use client"
2
- /* */
3
- import e from "react";
4
- import * as a from "react-aria-components";
5
- import { f as v } from "./flowComponent-CWmvUeHT.js";
6
- import { P as x } from "./Popover-DrXvRfAg.js";
7
- import "mobx";
8
- import "./context-Bdh6m_8S.js";
9
- import { C as M } from "./ClearPropsContext-CUvsbMn8.js";
10
- import { P as d } from "./PropsContextProvider-C6Z4XGp6.js";
11
- import "@react-aria/utils";
12
- import "./propsContext-DzAKlmhS.js";
13
- import "remeda";
14
- import { O as C } from "./OverlayTrigger-DpALSyS8.js";
15
- const P = "flow--context-menu", y = "flow--context-menu--popover", s = {
16
- contextMenu: P,
17
- popover: y
18
- }, R = v("ContextMenu", (o) => {
19
- const {
20
- children: t,
21
- onAction: r,
22
- selectionMode: n,
23
- selectedKeys: i,
24
- defaultSelectedKeys: c,
25
- disabledKeys: p,
26
- onSelectionChange: l,
27
- refProp: m,
28
- ...u
29
- } = o, f = n === "navigation" ? "single" : n, g = {
30
- MenuItem: {
31
- selectionVariant: n === "navigation" ? "navigation" : "control"
32
- }
33
- };
34
- return /* @__PURE__ */ e.createElement(M, null, /* @__PURE__ */ e.createElement(x, { ...u, className: s.popover }, /* @__PURE__ */ e.createElement(
35
- a.Menu,
36
- {
37
- className: s.contextMenu,
38
- onAction: r,
39
- selectionMode: f,
40
- selectedKeys: i,
41
- defaultSelectedKeys: c,
42
- disabledKeys: p,
43
- onSelectionChange: l,
44
- ref: m
45
- },
46
- /* @__PURE__ */ e.createElement(d, { props: g }, t)
47
- )));
48
- }), V = (o) => {
49
- const { children: t, ...r } = o;
50
- return /* @__PURE__ */ e.createElement(C, { overlayType: "Popover", ...r }, /* @__PURE__ */ e.createElement(a.MenuTrigger, null, t));
51
- };
52
- export {
53
- R as C,
54
- V as a
55
- };
@@ -1,20 +0,0 @@
1
- "use client"
2
- /* */
3
- import e from "react";
4
- import { O as s } from "./context-Bdh6m_8S.js";
5
- import "./propsContext-DzAKlmhS.js";
6
- import { P as a } from "./PropsContextProvider-C6Z4XGp6.js";
7
- import "@react-aria/utils";
8
- import "remeda";
9
- import { O as m } from "./OverlayContextProvider-BBz2Hde8.js";
10
- const P = (o) => {
11
- const { overlayType: t, isDefaultOpen: n = !1, children: p } = o, r = s.useNew(n), l = {
12
- Button: {
13
- onPress: r.open
14
- }
15
- };
16
- return /* @__PURE__ */ e.createElement(m, { type: t, controller: r }, /* @__PURE__ */ e.createElement(a, { props: l, mergeInParentContext: !0 }, p));
17
- };
18
- export {
19
- P as O
20
- };