@mittwald/flow-react-components 0.1.0-alpha.196 → 0.1.0-alpha.198

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.
@@ -2,37 +2,44 @@
2
2
  /* */
3
3
  import o from "react";
4
4
  import "./propsContext-DzAKlmhS.js";
5
- import { P as y } from "./PropsContextProvider-C6Z4XGp6.js";
5
+ import { P as d } from "./PropsContextProvider-C6Z4XGp6.js";
6
6
  import "@react-aria/utils";
7
7
  import "remeda";
8
- import { d as e } from "./dynamic-ClpUSmEt.js";
9
- import i from "clsx";
10
- import { f as g } from "./flowComponent-COVzhVCB.js";
11
- import { TunnelProvider as E, TunnelExit as n } from "@mittwald/react-tunnel";
12
- import { A as C, g as a } from "./getActionGroupSlot-BHzMGEA7.js";
13
- const G = "flow--action-group--action-group-container", v = "flow--action-group", x = "flow--action-group--primary", N = "flow--action-group--secondary", P = "flow--action-group--abort", r = {
14
- actionGroupContainer: G,
15
- actionGroup: v,
16
- primary: x,
17
- secondary: N,
18
- abort: P
19
- }, k = g("ActionGroup", (s) => {
20
- const { children: m, className: l, refProp: p, ...u } = s, d = i(r.actionGroupContainer, l), f = {
8
+ import { d as n } from "./dynamic-ClpUSmEt.js";
9
+ import e from "clsx";
10
+ import { f as C } from "./flowComponent-COVzhVCB.js";
11
+ import { TunnelProvider as G } from "@mittwald/react-tunnel";
12
+ import { A as y, g as a } from "./getActionGroupSlot-BHzMGEA7.js";
13
+ const w = "flow--action-group", P = "flow--action-group--primary", x = "flow--action-group--secondary", N = "flow--action-group--abort", k = "flow--action-group--action-group-container", v = "flow--action-group--ignore-breakpoint", t = {
14
+ actionGroup: w,
15
+ primary: P,
16
+ secondary: x,
17
+ abort: N,
18
+ actionGroupContainer: k,
19
+ ignoreBreakpoint: v
20
+ }, q = C("ActionGroup", (i) => {
21
+ const {
22
+ children: c,
23
+ className: p,
24
+ refProp: s,
25
+ ignoreBreakpoint: m,
26
+ ...l
27
+ } = i, u = e(
28
+ t.actionGroupContainer,
29
+ p,
30
+ m && t.ignoreBreakpoint
31
+ ), f = {
21
32
  Button: {
22
- tunnelId: e((t) => a(t)),
23
- slot: e((t) => a(t)),
24
- className: e((t) => {
25
- const c = a(t);
26
- return i(
27
- t.className,
28
- c !== "secondary" ? r[c] : void 0
29
- );
33
+ slot: n((r) => a(r)),
34
+ className: n((r) => {
35
+ const g = a(r);
36
+ return e(r.className, t[g]);
30
37
  })
31
38
  }
32
39
  };
33
- return /* @__PURE__ */ o.createElement(C, null, /* @__PURE__ */ o.createElement(y, { props: f, mergeInParentContext: !0 }, /* @__PURE__ */ o.createElement(E, null, /* @__PURE__ */ o.createElement("div", { ...u, className: d, ref: p }, /* @__PURE__ */ o.createElement("div", { className: r.actionGroup, role: "group" }, m, /* @__PURE__ */ o.createElement(n, { id: "primary" }), /* @__PURE__ */ o.createElement("div", { className: r.secondary }, /* @__PURE__ */ o.createElement(n, { id: "secondary" })), /* @__PURE__ */ o.createElement(n, { id: "abort" }))))));
40
+ return /* @__PURE__ */ o.createElement(y, null, /* @__PURE__ */ o.createElement(d, { props: f, mergeInParentContext: !0 }, /* @__PURE__ */ o.createElement(G, null, /* @__PURE__ */ o.createElement("div", { ...l, className: u, ref: s }, /* @__PURE__ */ o.createElement("div", { className: t.actionGroup, role: "group" }, c)))));
34
41
  });
35
42
  export {
36
- k as ActionGroup,
37
- k as default
43
+ q as ActionGroup,
44
+ q as default
38
45
  };
package/dist/List.js CHANGED
@@ -30,7 +30,7 @@ import { u as xt } from "./useOnChange-C1Quwyuz.js";
30
30
  import { S as Bt } from "./SearchField-Dbr_5Zy4.js";
31
31
  import { getProperty as Pt } from "dot-prop";
32
32
  import { hash as Dt } from "object-code";
33
- import { useReactTable as Vt, getCoreRowModel as Nt, getSortedRowModel as Rt, getFilteredRowModel as Mt, getPaginationRowModel as zt, getFacetedUniqueValues as $t } from "@tanstack/react-table";
33
+ import { useReactTable as Nt, getCoreRowModel as Vt, getSortedRowModel as Rt, getFilteredRowModel as Mt, getPaginationRowModel as zt, getFacetedUniqueValues as $t } from "@tanstack/react-table";
34
34
  import tt from "invariant";
35
35
  import { getAsyncResource as q } from "@mittwald/react-use-promise";
36
36
  import { u as H } from "./useSelector-DpU7_HMO.js";
@@ -93,6 +93,10 @@ const Gt = "flow--list--items--item--view", jt = "flow--list--items--item--view-
93
93
  Button: {
94
94
  className: m.action
95
95
  },
96
+ ActionGroup: {
97
+ className: m.action,
98
+ ignoreBreakpoint: !0
99
+ },
96
100
  Content: {
97
101
  className: Et((l) => te(l.slot)),
98
102
  tunnelId: "topContent"
@@ -468,7 +472,7 @@ class x {
468
472
  }
469
473
  useReactTable(t = {}) {
470
474
  const e = this.list.loader.useData();
471
- return Vt({
475
+ return Nt({
472
476
  data: e,
473
477
  state: {
474
478
  sorting: this.sortingState
@@ -479,7 +483,7 @@ class x {
479
483
  }
480
484
  },
481
485
  columns: this.getTableColumnDefs(),
482
- getCoreRowModel: Nt(),
486
+ getCoreRowModel: Vt(),
483
487
  getSortedRowModel: Rt(),
484
488
  getFilteredRowModel: Mt(),
485
489
  getPaginationRowModel: zt(),
@@ -773,11 +777,11 @@ const ke = "flow--list--items", Ae = "flow--list--items--is-loading", W = {
773
777
  },
774
778
  e ?? i.render(t)
775
779
  );
776
- }, De = (a) => /* @__PURE__ */ n.createElement(A.GridListItem, { textValue: "-", className: I.item }, a.children), Ve = () => {
780
+ }, De = (a) => /* @__PURE__ */ n.createElement(A.GridListItem, { textValue: "-", className: I.item }, a.children), Ne = () => {
777
781
  const a = S(g);
778
782
  return /* @__PURE__ */ n.createElement(Ut, null, /* @__PURE__ */ n.createElement(Ot, null), /* @__PURE__ */ n.createElement(et, null, a.format("list.noResult.heading")), /* @__PURE__ */ n.createElement(f, null, a.format("list.noResult.text")));
779
- }, Ne = "flow--skeleton-text", Re = "flow--skeleton-text--shimmer", Me = {
780
- skeletonText: Ne,
783
+ }, Ve = "flow--skeleton-text", Re = "flow--skeleton-text--shimmer", Me = {
784
+ skeletonText: Ve,
781
785
  shimmer: Re
782
786
  }, J = (a) => {
783
787
  const { width: t, style: e = {}, ...s } = a;
@@ -791,7 +795,7 @@ const ke = "flow--list--items", Ae = "flow--list--items--is-loading", W = {
791
795
  t,
792
796
  i && W.isLoading
793
797
  );
794
- return l ? /* @__PURE__ */ n.createElement(Ve, null) : /* @__PURE__ */ n.createElement("div", { "aria-hidden": o, "aria-busy": i }, /* @__PURE__ */ n.createElement(A.GridList, { className: c, ...e }, o ? /* @__PURE__ */ n.createElement($e, null) : u));
798
+ return l ? /* @__PURE__ */ n.createElement(Ne, null) : /* @__PURE__ */ n.createElement("div", { "aria-hidden": o, "aria-busy": i }, /* @__PURE__ */ n.createElement(A.GridList, { className: c, ...e }, o ? /* @__PURE__ */ n.createElement($e, null) : u));
795
799
  }, rt = (a) => null, Oe = () => rt, ot = (a) => null, qe = () => ot, lt = (a) => null, He = () => lt, ct = (a) => null, Ke = () => ct, ut = (a) => null, Ge = () => ut, je = "flow--list--footer", We = {
796
800
  footer: je
797
801
  }, Je = (a) => {
@@ -822,14 +826,14 @@ function dt(a) {
822
826
  return null;
823
827
  }
824
828
  const Xe = () => dt, Ze = Tt("List", (a) => {
825
- var D, V, N, R, M;
829
+ var D, N, V, R, M;
826
830
  const { children: t, batchSize: e, ...s } = a, i = (D = b(
827
831
  t,
828
832
  rt
829
- )) == null ? void 0 : D.props, o = (V = b(
833
+ )) == null ? void 0 : D.props, o = (N = b(
830
834
  t,
831
835
  qt
832
- )) == null ? void 0 : V.props, l = (N = b(t, ut)) == null ? void 0 : N.props, u = {
836
+ )) == null ? void 0 : N.props, l = (V = b(t, ut)) == null ? void 0 : V.props, u = {
833
837
  source: i ? {
834
838
  ...i,
835
839
  asyncLoader: i.children
package/dist/Slider.js CHANGED
@@ -13,18 +13,18 @@ import "@tabler/icons-react";
13
13
  import "./Icon-CUhvR1IT.js";
14
14
  import { I as w, a as N } from "./IconPlus-BWI6sp0-.js";
15
15
  import { useLocalizedStringFormatter as k } from "react-aria";
16
- const x = "flow--slider", P = "flow--slider--text", S = "flow--slider--value", g = "flow--slider--track", y = "flow--slider--fill", I = "flow--slider--initial-marker", M = "flow--slider--thumb", T = "flow--slider--increment", C = "flow--slider--decrement", z = "flow--slider--disabled", t = {
16
+ 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 = {
17
17
  slider: x,
18
18
  text: P,
19
19
  value: S,
20
- track: g,
21
- fill: y,
22
- initialMarker: I,
23
- thumb: M,
24
- increment: T,
25
- decrement: C,
26
- disabled: z
27
- }, D = { "de-DE": {
20
+ track: T,
21
+ fill: g,
22
+ initialMarker: y,
23
+ thumb: F,
24
+ increment: I,
25
+ decrement: M,
26
+ disabled: C
27
+ }, z = { "de-DE": {
28
28
  "slider.decrement": "Wert verkleinern",
29
29
  "slider.increment": "Wert erhöhen"
30
30
  }, "en-EN": {
@@ -35,15 +35,15 @@ const x = "flow--slider", P = "flow--slider--text", S = "flow--slider--value", g
35
35
  className: c,
36
36
  children: o,
37
37
  name: d,
38
- isDisabled: r,
38
+ isDisabled: t,
39
39
  defaultValue: l,
40
40
  showInitialMarker: u,
41
41
  ...f
42
42
  } = m, p = h(
43
- t.slider,
44
- r && t.disabled,
43
+ r.slider,
44
+ t && r.disabled,
45
45
  c
46
- ), s = k(D), b = {
46
+ ), s = k(z), b = {
47
47
  Label: {
48
48
  unstyled: !0
49
49
  }
@@ -52,20 +52,21 @@ const x = "flow--slider", P = "flow--slider--text", S = "flow--slider--value", g
52
52
  n.Slider,
53
53
  {
54
54
  className: p,
55
- isDisabled: r,
55
+ isDisabled: t,
56
56
  defaultValue: l,
57
57
  ...f
58
58
  },
59
- /* @__PURE__ */ e.createElement("div", { className: t.text }, /* @__PURE__ */ e.createElement(n.SliderOutput, { className: t.value }), /* @__PURE__ */ e.createElement(v, { props: b }, o)),
60
- /* @__PURE__ */ e.createElement(n.SliderTrack, { className: t.track }, ({ state: a }) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
59
+ /* @__PURE__ */ e.createElement("div", { className: r.text }, /* @__PURE__ */ e.createElement(n.SliderOutput, { className: r.value }), /* @__PURE__ */ e.createElement(v, { props: b }, o)),
60
+ /* @__PURE__ */ e.createElement(n.SliderTrack, { className: r.track }, ({ state: a }) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
61
61
  i,
62
62
  {
63
63
  onPress: () => a.decrementThumb(0),
64
64
  "aria-label": s.format("slider.decrement"),
65
65
  size: "s",
66
66
  variant: "plain",
67
- className: t.decrement,
68
- isDisabled: r
67
+ className: r.decrement,
68
+ isDisabled: t,
69
+ excludeFromTabOrder: !0
69
70
  },
70
71
  /* @__PURE__ */ e.createElement(w, null)
71
72
  ), /* @__PURE__ */ e.createElement(
@@ -75,25 +76,26 @@ const x = "flow--slider", P = "flow--slider--text", S = "flow--slider--value", g
75
76
  "aria-label": s.format("slider.increment"),
76
77
  size: "s",
77
78
  variant: "plain",
78
- className: t.increment,
79
- isDisabled: r
79
+ className: r.increment,
80
+ isDisabled: t,
81
+ excludeFromTabOrder: !0
80
82
  },
81
83
  /* @__PURE__ */ e.createElement(N, null)
82
84
  ), /* @__PURE__ */ e.createElement(
83
85
  "div",
84
86
  {
85
- className: t.fill,
87
+ className: r.fill,
86
88
  style: { width: a.getThumbPercent(0) * 100 + "%" }
87
89
  }
88
90
  ), u && l && typeof l == "number" && /* @__PURE__ */ e.createElement(
89
91
  "div",
90
92
  {
91
- className: t.initialMarker,
93
+ className: r.initialMarker,
92
94
  style: {
93
95
  left: `calc(${a.getValuePercent(l) * 100}% - 2px)`
94
96
  }
95
97
  }
96
- ), /* @__PURE__ */ e.createElement(n.SliderThumb, { name: d, className: t.thumb })))
98
+ ), /* @__PURE__ */ e.createElement(n.SliderThumb, { name: d, className: r.thumb })))
97
99
  );
98
100
  });
99
101
  export {