@vkzstudio/muza-ui 1.0.26 → 1.0.28
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.
- package/dist/components/Accordion/Accordion.d.ts +3 -1
- package/dist/components/Accordion/Accordion.d.ts.map +1 -1
- package/dist/components/Accordion/Accordion.js +99 -67
- package/dist/components/Accordion/Accordion.stories.d.ts +1 -0
- package/dist/components/Accordion/Accordion.stories.d.ts.map +1 -1
- package/dist/components/MuzaUIProvider/index.d.ts +1 -1
- package/dist/components/MuzaUIProvider/index.d.ts.map +1 -1
- package/dist/components/MuzaUIProvider/theme/ThemeProvider.d.ts +12 -2
- package/dist/components/MuzaUIProvider/theme/ThemeProvider.d.ts.map +1 -1
- package/dist/components/MuzaUIProvider/theme/ThemeProvider.js +29 -29
- package/dist/components/MuzaUIProvider/theme/index.d.ts +1 -1
- package/dist/components/MuzaUIProvider/theme/index.d.ts.map +1 -1
- package/dist/components/Reorderable/Reorderable.d.ts +48 -5
- package/dist/components/Reorderable/Reorderable.d.ts.map +1 -1
- package/dist/components/Reorderable/Reorderable.js +197 -153
- package/dist/components/Reorderable/Reorderable.stories.d.ts +2 -0
- package/dist/components/Reorderable/Reorderable.stories.d.ts.map +1 -1
- package/dist/components/ReorderableTable/ReorderableTable.d.ts +27 -2
- package/dist/components/ReorderableTable/ReorderableTable.d.ts.map +1 -1
- package/dist/components/ReorderableTable/ReorderableTable.js +52 -40
- package/dist/components/ReorderableTable/ReorderableTable.stories.d.ts +1 -0
- package/dist/components/ReorderableTable/ReorderableTable.stories.d.ts.map +1 -1
- package/dist/muza-ui.css +1 -1
- package/package.json +2 -1
|
@@ -1,220 +1,264 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { useMuzaTranslations as
|
|
4
|
-
import { AnimatePresence as
|
|
5
|
-
import { useDragControls as
|
|
6
|
-
import { motion as
|
|
7
|
-
import { cn as
|
|
8
|
-
import { ReorderGroup as
|
|
9
|
-
import { ReorderItem as
|
|
10
|
-
const
|
|
1
|
+
import { jsx as D } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as k, useContext as S, useRef as A, useCallback as N, createContext as F, useState as $, useEffect as j } from "react";
|
|
3
|
+
import { useMuzaTranslations as Z } from "../../translations/TranslationContext.js";
|
|
4
|
+
import { AnimatePresence as P } from "../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js";
|
|
5
|
+
import { useDragControls as ee } from "../../node_modules/framer-motion/dist/es/gestures/drag/use-drag-controls.js";
|
|
6
|
+
import { motion as te } from "../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";
|
|
7
|
+
import { cn as _ } from "../../utils/cn.js";
|
|
8
|
+
import { ReorderGroup as re } from "../../node_modules/framer-motion/dist/es/components/Reorder/Group.js";
|
|
9
|
+
import { ReorderItem as ne } from "../../node_modules/framer-motion/dist/es/components/Reorder/Item.js";
|
|
10
|
+
const K = {
|
|
11
11
|
initial: { opacity: 0, scale: 0.96 },
|
|
12
12
|
animate: { opacity: 1, scale: 1 },
|
|
13
13
|
exit: { opacity: 0, scale: 0.96 },
|
|
14
14
|
transition: { duration: 0.2, ease: "easeOut" }
|
|
15
|
-
},
|
|
16
|
-
const r =
|
|
15
|
+
}, q = F({}), oe = 50, z = 3, B = () => S(q), J = F(null), se = () => {
|
|
16
|
+
const r = S(J);
|
|
17
17
|
if (!r)
|
|
18
18
|
throw new Error("useReorderableItem must be used within a ReorderableItem");
|
|
19
19
|
return r;
|
|
20
|
-
},
|
|
20
|
+
}, ie = ({
|
|
21
21
|
values: r,
|
|
22
22
|
onReorder: s,
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
23
|
+
onSync: b,
|
|
24
|
+
syncDelay: m = 300,
|
|
25
|
+
onSyncPendingChange: d,
|
|
26
|
+
onDragStart: n,
|
|
27
|
+
onDragEnd: R,
|
|
28
|
+
axis: G = "y",
|
|
29
|
+
as: C = "ol",
|
|
30
|
+
disabled: p = !1,
|
|
31
|
+
layoutScroll: g = !1,
|
|
32
|
+
animatePresence: v,
|
|
33
|
+
style: y,
|
|
34
|
+
className: h,
|
|
35
|
+
children: u
|
|
36
|
+
}, i) => {
|
|
37
|
+
const x = Z(), f = !!b, [L, E] = $(r), t = A(null), e = A(!1), l = A(!1), I = A(L), a = A(b);
|
|
38
|
+
a.current = b;
|
|
39
|
+
const o = A(d);
|
|
40
|
+
o.current = d, j(() => {
|
|
41
|
+
f && !e.current && (E(r), I.current = r);
|
|
42
|
+
}, [r, f]), j(() => () => {
|
|
43
|
+
t.current && clearTimeout(t.current);
|
|
44
|
+
}, []);
|
|
45
|
+
const c = N(
|
|
46
|
+
(T) => {
|
|
47
|
+
t.current && clearTimeout(t.current), t.current = setTimeout(() => {
|
|
48
|
+
var M, Y;
|
|
49
|
+
t.current = null, e.current = !1, (M = o.current) == null || M.call(o, !1), (Y = a.current) == null || Y.call(a, T);
|
|
50
|
+
}, m);
|
|
51
|
+
},
|
|
52
|
+
[m]
|
|
53
|
+
), w = N(
|
|
54
|
+
(T) => {
|
|
55
|
+
var M;
|
|
56
|
+
f ? (E(T), I.current = T, s == null || s(T), e.current || (e.current = !0, (M = o.current) == null || M.call(o, !0)), l.current || c(T)) : s == null || s(T);
|
|
57
|
+
},
|
|
58
|
+
[f, s, c]
|
|
59
|
+
), H = N(() => {
|
|
60
|
+
l.current = !0, t.current && clearTimeout(t.current), n == null || n();
|
|
61
|
+
}, [n]), O = N(() => {
|
|
62
|
+
l.current = !1, e.current && c(I.current), R == null || R();
|
|
63
|
+
}, [c, R]), V = f ? L : r, Q = {
|
|
64
|
+
disabled: p,
|
|
65
|
+
values: V,
|
|
66
|
+
onReorder: p ? void 0 : w,
|
|
67
|
+
axis: G,
|
|
68
|
+
animatePresence: !!v,
|
|
69
|
+
onPointerDragStart: f ? H : void 0,
|
|
70
|
+
onPointerDragEnd: f ? O : void 0
|
|
71
|
+
}, X = typeof u == "function" ? u(V) : u, U = v === !0 ? { mode: "popLayout", initial: !1 } : v || null, W = U ? /* @__PURE__ */ D(P, { ...U, children: X }) : X;
|
|
72
|
+
return /* @__PURE__ */ D(
|
|
73
|
+
q.Provider,
|
|
41
74
|
{
|
|
42
|
-
value:
|
|
43
|
-
children: /* @__PURE__ */
|
|
44
|
-
|
|
75
|
+
value: Q,
|
|
76
|
+
children: /* @__PURE__ */ D(
|
|
77
|
+
re,
|
|
45
78
|
{
|
|
46
|
-
ref:
|
|
47
|
-
axis:
|
|
48
|
-
values:
|
|
49
|
-
onReorder:
|
|
50
|
-
} :
|
|
51
|
-
as:
|
|
52
|
-
layoutScroll:
|
|
53
|
-
style:
|
|
54
|
-
...
|
|
79
|
+
ref: i,
|
|
80
|
+
axis: G,
|
|
81
|
+
values: V,
|
|
82
|
+
onReorder: p ? () => {
|
|
83
|
+
} : w,
|
|
84
|
+
as: C,
|
|
85
|
+
layoutScroll: g,
|
|
86
|
+
style: y,
|
|
87
|
+
...C !== "tbody" && {
|
|
55
88
|
role: "list",
|
|
56
|
-
"aria-label":
|
|
89
|
+
"aria-label": x.reorderableTable.listAriaLabel
|
|
57
90
|
},
|
|
58
|
-
className:
|
|
59
|
-
children:
|
|
91
|
+
className: _(h),
|
|
92
|
+
children: W
|
|
60
93
|
}
|
|
61
94
|
)
|
|
62
95
|
}
|
|
63
96
|
);
|
|
64
|
-
},
|
|
65
|
-
|
|
66
|
-
const
|
|
97
|
+
}, ae = k(ie);
|
|
98
|
+
ae.displayName = "ReorderableGroup";
|
|
99
|
+
const ce = ({
|
|
67
100
|
value: r,
|
|
68
101
|
as: s = "li",
|
|
69
102
|
disabled: b = !1,
|
|
70
|
-
dragListenerDisabled:
|
|
71
|
-
whileDrag:
|
|
103
|
+
dragListenerDisabled: m = !1,
|
|
104
|
+
whileDrag: d,
|
|
72
105
|
animation: n,
|
|
73
|
-
className:
|
|
74
|
-
children:
|
|
75
|
-
style:
|
|
76
|
-
|
|
106
|
+
className: R,
|
|
107
|
+
children: G,
|
|
108
|
+
style: C,
|
|
109
|
+
layout: p
|
|
110
|
+
}, g) => {
|
|
77
111
|
const {
|
|
78
112
|
disabled: v,
|
|
79
|
-
values:
|
|
80
|
-
onReorder:
|
|
81
|
-
axis:
|
|
82
|
-
animatePresence:
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
if (y
|
|
93
|
-
const
|
|
94
|
-
if (
|
|
95
|
-
const
|
|
96
|
-
|
|
113
|
+
values: y,
|
|
114
|
+
onReorder: h,
|
|
115
|
+
axis: u,
|
|
116
|
+
animatePresence: i,
|
|
117
|
+
onPointerDragStart: x,
|
|
118
|
+
onPointerDragEnd: f
|
|
119
|
+
} = B(), L = ee(), E = b || v, t = !E && !m, e = n === !1 ? null : n === !0 ? K : typeof n == "object" ? {
|
|
120
|
+
initial: n.initial ?? K.initial,
|
|
121
|
+
animate: n.animate ?? K.animate,
|
|
122
|
+
exit: n.exit ?? K.exit,
|
|
123
|
+
transition: n.transition ?? K.transition
|
|
124
|
+
} : i ? K : null, l = N(
|
|
125
|
+
(a) => {
|
|
126
|
+
if (!y || !h) return;
|
|
127
|
+
const o = y.indexOf(r);
|
|
128
|
+
if (o === -1) return;
|
|
129
|
+
const c = o + a;
|
|
130
|
+
if (c < 0 || c >= y.length) return;
|
|
131
|
+
const w = [...y];
|
|
132
|
+
w.splice(o, 1), w.splice(c, 0, r), h(w);
|
|
97
133
|
},
|
|
98
|
-
[
|
|
99
|
-
),
|
|
100
|
-
(
|
|
101
|
-
if (!
|
|
102
|
-
const
|
|
103
|
-
|
|
134
|
+
[y, h, r]
|
|
135
|
+
), I = N(
|
|
136
|
+
(a) => {
|
|
137
|
+
if (!t) return;
|
|
138
|
+
const o = u === "y" ? "ArrowUp" : "ArrowLeft", c = u === "y" ? "ArrowDown" : "ArrowRight";
|
|
139
|
+
a.key === o ? (a.preventDefault(), l(-1)) : a.key === c && (a.preventDefault(), l(1));
|
|
104
140
|
},
|
|
105
|
-
[
|
|
141
|
+
[t, u, l]
|
|
106
142
|
);
|
|
107
|
-
return /* @__PURE__ */
|
|
108
|
-
|
|
143
|
+
return /* @__PURE__ */ D(
|
|
144
|
+
J.Provider,
|
|
109
145
|
{
|
|
110
|
-
value: { dragControls:
|
|
111
|
-
children: /* @__PURE__ */
|
|
112
|
-
|
|
146
|
+
value: { dragControls: L, dragListenerDisabled: m, moveItem: l },
|
|
147
|
+
children: /* @__PURE__ */ D(
|
|
148
|
+
ne,
|
|
113
149
|
{
|
|
114
|
-
ref:
|
|
150
|
+
ref: g,
|
|
115
151
|
value: r,
|
|
116
152
|
as: s,
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
153
|
+
layout: p,
|
|
154
|
+
dragControls: L,
|
|
155
|
+
dragListener: t,
|
|
156
|
+
onDragStart: t ? x : void 0,
|
|
157
|
+
onDragEnd: t ? f : void 0,
|
|
158
|
+
initial: e == null ? void 0 : e.initial,
|
|
159
|
+
animate: e == null ? void 0 : e.animate,
|
|
160
|
+
exit: e == null ? void 0 : e.exit,
|
|
161
|
+
transition: e == null ? void 0 : e.transition,
|
|
162
|
+
tabIndex: t ? 0 : void 0,
|
|
124
163
|
role: "listitem",
|
|
125
|
-
"aria-disabled":
|
|
126
|
-
onKeyDown:
|
|
127
|
-
className:
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
164
|
+
"aria-disabled": E,
|
|
165
|
+
onKeyDown: I,
|
|
166
|
+
className: _(
|
|
167
|
+
t && "cursor-grab active:cursor-grabbing",
|
|
168
|
+
t && "focus-visible-default",
|
|
169
|
+
R
|
|
131
170
|
),
|
|
132
|
-
style:
|
|
171
|
+
style: C,
|
|
133
172
|
whileDrag: {
|
|
134
|
-
zIndex:
|
|
173
|
+
zIndex: oe,
|
|
135
174
|
position: "relative",
|
|
136
|
-
...
|
|
175
|
+
...d
|
|
137
176
|
},
|
|
138
|
-
children:
|
|
177
|
+
children: G
|
|
139
178
|
}
|
|
140
179
|
)
|
|
141
180
|
}
|
|
142
181
|
);
|
|
143
|
-
},
|
|
144
|
-
|
|
145
|
-
const
|
|
182
|
+
}, le = k(ce);
|
|
183
|
+
le.displayName = "ReorderableItem";
|
|
184
|
+
const ue = k(
|
|
146
185
|
({
|
|
147
186
|
as: r = "button",
|
|
148
187
|
disabled: s = !1,
|
|
149
188
|
"aria-label": b,
|
|
150
|
-
className:
|
|
151
|
-
children:
|
|
189
|
+
className: m,
|
|
190
|
+
children: d
|
|
152
191
|
}, n) => {
|
|
153
|
-
const
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
192
|
+
const R = Z(), G = b ?? R.reorderableTable.dragHandleAriaLabel, {
|
|
193
|
+
disabled: C,
|
|
194
|
+
axis: p,
|
|
195
|
+
onPointerDragStart: g,
|
|
196
|
+
onPointerDragEnd: v
|
|
197
|
+
} = B(), { dragControls: y, dragListenerDisabled: h, moveItem: u } = se(), i = h && !C && !s, x = A(!1), f = (e) => {
|
|
198
|
+
if (!i) return;
|
|
199
|
+
x.current = !1;
|
|
200
|
+
const l = e.clientX, I = e.clientY, a = (c) => {
|
|
201
|
+
const w = Math.abs(c.clientX - l), H = Math.abs(c.clientY - I);
|
|
202
|
+
(w > z || H > z) && (x.current = !0);
|
|
203
|
+
}, o = () => {
|
|
204
|
+
document.removeEventListener("pointermove", a), document.removeEventListener("pointerup", o), x.current && (v == null || v());
|
|
161
205
|
};
|
|
162
|
-
document.addEventListener("pointermove",
|
|
163
|
-
}, L = (
|
|
164
|
-
|
|
165
|
-
},
|
|
166
|
-
(
|
|
167
|
-
if (!
|
|
168
|
-
const
|
|
169
|
-
|
|
206
|
+
document.addEventListener("pointermove", a), document.addEventListener("pointerup", o), g == null || g(), y.start(e);
|
|
207
|
+
}, L = (e) => {
|
|
208
|
+
x.current && (e.stopPropagation(), x.current = !1);
|
|
209
|
+
}, E = N(
|
|
210
|
+
(e) => {
|
|
211
|
+
if (!i) return;
|
|
212
|
+
const l = p === "y" ? "ArrowUp" : "ArrowLeft", I = p === "y" ? "ArrowDown" : "ArrowRight";
|
|
213
|
+
e.key === l ? (e.preventDefault(), u(-1)) : e.key === I && (e.preventDefault(), u(1));
|
|
170
214
|
},
|
|
171
|
-
[
|
|
215
|
+
[i, p, u]
|
|
172
216
|
), t = {
|
|
173
|
-
"aria-label":
|
|
217
|
+
"aria-label": G,
|
|
174
218
|
"aria-roledescription": "sortable",
|
|
175
|
-
onPointerDown:
|
|
176
|
-
onKeyDown:
|
|
219
|
+
onPointerDown: f,
|
|
220
|
+
onKeyDown: E,
|
|
177
221
|
onClick: L,
|
|
178
|
-
className:
|
|
222
|
+
className: _(
|
|
179
223
|
"touch-none select-none",
|
|
180
|
-
|
|
181
|
-
!
|
|
182
|
-
|
|
183
|
-
|
|
224
|
+
i && "cursor-grab active:cursor-grabbing",
|
|
225
|
+
!i && "cursor-default",
|
|
226
|
+
i && "focus-visible-default",
|
|
227
|
+
m
|
|
184
228
|
)
|
|
185
229
|
};
|
|
186
|
-
return r === "button" ? /* @__PURE__ */
|
|
230
|
+
return r === "button" ? /* @__PURE__ */ D("button", { ref: n, type: "button", disabled: s, ...t, children: d }) : r === "div" ? /* @__PURE__ */ D(
|
|
187
231
|
"div",
|
|
188
232
|
{
|
|
189
233
|
ref: n,
|
|
190
|
-
tabIndex:
|
|
191
|
-
role:
|
|
234
|
+
tabIndex: i ? 0 : void 0,
|
|
235
|
+
role: i ? "button" : void 0,
|
|
192
236
|
...t,
|
|
193
|
-
children:
|
|
237
|
+
children: d
|
|
194
238
|
}
|
|
195
|
-
) : /* @__PURE__ */
|
|
239
|
+
) : /* @__PURE__ */ D(
|
|
196
240
|
"span",
|
|
197
241
|
{
|
|
198
242
|
ref: n,
|
|
199
|
-
tabIndex:
|
|
200
|
-
role:
|
|
243
|
+
tabIndex: i ? 0 : void 0,
|
|
244
|
+
role: i ? "button" : void 0,
|
|
201
245
|
...t,
|
|
202
|
-
children:
|
|
246
|
+
children: d
|
|
203
247
|
}
|
|
204
248
|
);
|
|
205
249
|
}
|
|
206
250
|
);
|
|
207
|
-
|
|
208
|
-
const
|
|
209
|
-
const
|
|
210
|
-
return /* @__PURE__ */ d
|
|
211
|
-
},
|
|
212
|
-
|
|
251
|
+
ue.displayName = "ReorderableHandle";
|
|
252
|
+
const fe = ({ as: r = "li", className: s, children: b }, m) => {
|
|
253
|
+
const d = te[r];
|
|
254
|
+
return /* @__PURE__ */ D(d, { ref: m, layout: !0, role: "listitem", className: _(s), children: b });
|
|
255
|
+
}, de = k(fe);
|
|
256
|
+
de.displayName = "ReorderableStaticItem";
|
|
213
257
|
export {
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
258
|
+
ae as ReorderableGroup,
|
|
259
|
+
ue as ReorderableHandle,
|
|
260
|
+
le as ReorderableItem,
|
|
261
|
+
de as ReorderableStaticItem,
|
|
262
|
+
B as useReorderableGroup,
|
|
263
|
+
se as useReorderableItem
|
|
220
264
|
};
|
|
@@ -12,4 +12,6 @@ export declare const ScrollableList: Story;
|
|
|
12
12
|
export declare const ContentBlocks: Story;
|
|
13
13
|
export declare const AnimatedItems: Story;
|
|
14
14
|
export declare const StaticItem: Story;
|
|
15
|
+
export declare const SyncMode: Story;
|
|
16
|
+
export declare const DynamicHeight: Story;
|
|
15
17
|
//# sourceMappingURL=Reorderable.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Reorderable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Reorderable/Reorderable.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;
|
|
1
|
+
{"version":3,"file":"Reorderable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Reorderable/Reorderable.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAY3D,OAAO,EACL,gBAAgB,EAIjB,MAAM,eAAe,CAAA;AAwFtB,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAsFvC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAU9C,eAAO,MAAM,OAAO,EAAE,KAiCrB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAsCxB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAuCtB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAmC5B,CAAA;AASD,eAAO,MAAM,SAAS,EAAE,KA2FvB,CAAA;AAgBD,eAAO,MAAM,cAAc,EAAE,KAsC5B,CAAA;AAmBD,eAAO,MAAM,aAAa,EAAE,KAgD3B,CAAA;AAGD,eAAO,MAAM,aAAa,EAAE,KA+E3B,CAAA;AA4BD,eAAO,MAAM,UAAU,EAAE,KAkDxB,CAAA;AA8GD,eAAO,MAAM,QAAQ,EAAE,KAsFtB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAsC3B,CAAA"}
|
|
@@ -42,8 +42,28 @@ export interface ReorderableTableProps<T extends {
|
|
|
42
42
|
}> extends Omit<React.HTMLAttributes<HTMLTableElement>, 'children'> {
|
|
43
43
|
/** Array of row data objects. Each must include an `id` field used as the React key. */
|
|
44
44
|
data: T[];
|
|
45
|
-
/**
|
|
46
|
-
|
|
45
|
+
/**
|
|
46
|
+
* Fires when rows are reordered. Receives the full array in its new order.
|
|
47
|
+
* Optional when `onSync` is provided.
|
|
48
|
+
*/
|
|
49
|
+
onReorder?: (newOrder: T[]) => void;
|
|
50
|
+
/**
|
|
51
|
+
* Debounced sync callback. Fires once after the user finishes reordering
|
|
52
|
+
* (`syncDelay` ms after the last reorder event). When provided, the component
|
|
53
|
+
* manages internal state and blocks external `data` updates while sync is pending.
|
|
54
|
+
*/
|
|
55
|
+
onSync?: (newOrder: T[]) => void;
|
|
56
|
+
/** Milliseconds to wait after the last reorder event before calling `onSync`. @default 300 */
|
|
57
|
+
syncDelay?: number;
|
|
58
|
+
/**
|
|
59
|
+
* Called when the internal sync pending state changes.
|
|
60
|
+
* Useful for showing loading indicators or disabling other interactions during sync.
|
|
61
|
+
*/
|
|
62
|
+
onSyncPendingChange?: (isPending: boolean) => void;
|
|
63
|
+
/** Fires when a pointer drag interaction starts. */
|
|
64
|
+
onDragStart?: () => void;
|
|
65
|
+
/** Fires when a pointer drag interaction ends. */
|
|
66
|
+
onDragEnd?: () => void;
|
|
47
67
|
/** Column definitions describing headers and cell rendering. @see ReorderableTableColumn */
|
|
48
68
|
columns: ReorderableTableColumn<T>[];
|
|
49
69
|
/** Displays the table header row. @default false */
|
|
@@ -64,6 +84,11 @@ export interface ReorderableTableProps<T extends {
|
|
|
64
84
|
isMovable?: boolean;
|
|
65
85
|
/** Enables enter/exit animations when rows are added or removed. @default false */
|
|
66
86
|
animateItems?: boolean;
|
|
87
|
+
/**
|
|
88
|
+
* Controls Motion's layout animation mode on rows.
|
|
89
|
+
* Use `"position"` to animate only position and prevent scale distortion when row height changes.
|
|
90
|
+
*/
|
|
91
|
+
layout?: true | 'position';
|
|
67
92
|
}
|
|
68
93
|
declare const ReorderableTable: <T extends {
|
|
69
94
|
id: string | number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReorderableTable.d.ts","sourceRoot":"","sources":["../../../src/components/ReorderableTable/ReorderableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAc,MAAM,OAAO,CAAA;AAWrE;;;;;;;;;;GAUG;AACH,MAAM,WAAW,sBAAsB,CAAC,CAAC;IACvC,uEAAuE;IACvE,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,6BAA6B;IAC7B,KAAK,EAAE,SAAS,CAAA;IAChB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,CAAA;CACxE;AAED;;;;;;GAMG;AACH,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CACtE,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAChE,wFAAwF;IACxF,IAAI,EAAE,CAAC,EAAE,CAAA;IACT
|
|
1
|
+
{"version":3,"file":"ReorderableTable.d.ts","sourceRoot":"","sources":["../../../src/components/ReorderableTable/ReorderableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAc,MAAM,OAAO,CAAA;AAWrE;;;;;;;;;;GAUG;AACH,MAAM,WAAW,sBAAsB,CAAC,CAAC;IACvC,uEAAuE;IACvE,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,6BAA6B;IAC7B,KAAK,EAAE,SAAS,CAAA;IAChB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,CAAA;CACxE;AAED;;;;;;GAMG;AACH,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CACtE,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAChE,wFAAwF;IACxF,IAAI,EAAE,CAAC,EAAE,CAAA;IACT;;;OAGG;IACH,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,IAAI,CAAA;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,IAAI,CAAA;IAChC,8FAA8F;IAC9F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;IAClD,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,4FAA4F;IAC5F,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,EAAE,CAAA;IACpC,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAA;IACzD,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,uFAAuF;IACvF,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,mFAAmF;IACnF,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,IAAI,GAAG,UAAU,CAAA;CAC3B;AAgPD,QAAA,MAAM,gBAAgB,EAAwC,CAC5D,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,EAEjC,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,gBAAgB,CAAC,CAAA;CAAE,KACvE,KAAK,CAAC,YAAY,CACtB;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAA"}
|