@vanstack/solid-ark 0.0.14 → 0.0.15
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/data-table/index.mjs +90 -81
- package/dist/data-table/type.d.ts +2 -0
- package/package.json +4 -4
|
@@ -3,48 +3,48 @@ import { t as e } from "../button-Br_upy12.js";
|
|
|
3
3
|
import { t } from "../form-IwL17HZI.js";
|
|
4
4
|
import { t as n } from "../table-D3DgojFM.js";
|
|
5
5
|
import { className as r, createComponent as i, effect as a, insert as o, memo as s, setAttribute as c, setStyleProperty as l, template as u, use as d } from "solid-js/web";
|
|
6
|
-
import { For as f, Show as p, createEffect as m, createMemo as h, createSignal as g, mergeProps as _, on as v, onCleanup as
|
|
7
|
-
import { formatDate as
|
|
8
|
-
import { Pagination as
|
|
6
|
+
import { For as f, Show as p, createEffect as m, createMemo as h, createSignal as g, mergeProps as _, on as v, onCleanup as y, onMount as b } from "solid-js";
|
|
7
|
+
import { formatDate as ee, formatDateTime as x, formatShortDateTime as te } from "@vanstack/shared";
|
|
8
|
+
import { Pagination as S } from "@ark-ui/solid/pagination";
|
|
9
9
|
//#region src/data-table/EllipsisCell.tsx
|
|
10
|
-
var
|
|
11
|
-
function
|
|
10
|
+
var C = /*#__PURE__*/ u("<span class=van-data-table-ellipsis>");
|
|
11
|
+
function w(e) {
|
|
12
12
|
let t;
|
|
13
|
-
return
|
|
13
|
+
return b(() => {
|
|
14
14
|
t && t.scrollWidth > t.clientWidth && (t.dataset.ellipsis = "true", t.dataset.text = e.text);
|
|
15
15
|
}), (() => {
|
|
16
|
-
var n =
|
|
16
|
+
var n = C(), r = t;
|
|
17
17
|
return typeof r == "function" ? d(r, n) : t = n, o(n, () => e.children), n;
|
|
18
18
|
})();
|
|
19
19
|
}
|
|
20
20
|
//#endregion
|
|
21
21
|
//#region src/data-table/Pagination.tsx
|
|
22
|
-
var
|
|
23
|
-
function
|
|
22
|
+
var T = /*#__PURE__*/ u("<svg class=van-data-table-pagination-icon fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox=\"0 0 24 24\"><path>"), E = /*#__PURE__*/ u("<svg class=van-data-table-pagination-icon fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox=\"0 0 24 24\">"), D = /*#__PURE__*/ u("<svg><path d=\"M11 6l-6 6 6 6\"></svg>", !1, !0, !1), O = /*#__PURE__*/ u("<svg><path d=\"M18 6l-6 6 6 6\"></svg>", !1, !0, !1), k = /*#__PURE__*/ u("<svg><path d=\"M13 6l6 6-6 6\"></svg>", !1, !0, !1), A = /*#__PURE__*/ u("<svg><path d=\"M6 6l6 6-6 6\"></svg>", !1, !0, !1), j = /*#__PURE__*/ u("<div class=van-data-table-pagination-buttons>"), M = /*#__PURE__*/ u("<div class=van-data-table-pagination><span class=van-data-table-pagination-info>共 <!> 条");
|
|
23
|
+
function N(e) {
|
|
24
24
|
return (() => {
|
|
25
|
-
var t =
|
|
25
|
+
var t = T(), n = t.firstChild;
|
|
26
26
|
return a(() => c(n, "d", e.direction === "left" ? "M15 6l-6 6 6 6" : "M9 6l6 6-6 6")), t;
|
|
27
27
|
})();
|
|
28
28
|
}
|
|
29
|
-
function
|
|
29
|
+
function P(e) {
|
|
30
30
|
return (() => {
|
|
31
|
-
var t =
|
|
31
|
+
var t = E();
|
|
32
32
|
return o(t, (() => {
|
|
33
33
|
var t = s(() => e.direction === "left");
|
|
34
|
-
return () => t() ? [
|
|
34
|
+
return () => t() ? [D(), O()] : [k(), A()];
|
|
35
35
|
})()), t;
|
|
36
36
|
})();
|
|
37
37
|
}
|
|
38
|
-
function
|
|
38
|
+
function ne(e) {
|
|
39
39
|
let t = () => Math.max(1, Math.ceil(e.count / e.pageSize));
|
|
40
40
|
return (() => {
|
|
41
|
-
var n =
|
|
41
|
+
var n = M(), r = n.firstChild, a = r.firstChild.nextSibling;
|
|
42
42
|
return a.nextSibling, o(r, () => e.count, a), o(n, i(p, {
|
|
43
43
|
get when() {
|
|
44
44
|
return t() > 1;
|
|
45
45
|
},
|
|
46
46
|
get children() {
|
|
47
|
-
return i(
|
|
47
|
+
return i(S.Root, {
|
|
48
48
|
get count() {
|
|
49
49
|
return e.count;
|
|
50
50
|
},
|
|
@@ -58,22 +58,22 @@ function re(e) {
|
|
|
58
58
|
},
|
|
59
59
|
translations: { rootLabel: "分页" },
|
|
60
60
|
get children() {
|
|
61
|
-
var e =
|
|
62
|
-
return o(e, i(
|
|
61
|
+
var e = j();
|
|
62
|
+
return o(e, i(S.FirstTrigger, {
|
|
63
63
|
class: "van-data-table-pagination-btn",
|
|
64
64
|
get children() {
|
|
65
|
-
return i(
|
|
65
|
+
return i(P, { direction: "left" });
|
|
66
66
|
}
|
|
67
|
-
}), null), o(e, i(
|
|
67
|
+
}), null), o(e, i(S.PrevTrigger, {
|
|
68
68
|
class: "van-data-table-pagination-btn",
|
|
69
69
|
get children() {
|
|
70
|
-
return i(
|
|
70
|
+
return i(N, { direction: "left" });
|
|
71
71
|
}
|
|
72
|
-
}), null), o(e, i(
|
|
72
|
+
}), null), o(e, i(S.Context, { children: (e) => i(f, {
|
|
73
73
|
get each() {
|
|
74
74
|
return e().pages;
|
|
75
75
|
},
|
|
76
|
-
children: (e, t) => e.type === "page" ? i(
|
|
76
|
+
children: (e, t) => e.type === "page" ? i(S.Item, {
|
|
77
77
|
class: "van-data-table-pagination-btn",
|
|
78
78
|
type: "page",
|
|
79
79
|
get value() {
|
|
@@ -82,22 +82,22 @@ function re(e) {
|
|
|
82
82
|
get children() {
|
|
83
83
|
return e.value;
|
|
84
84
|
}
|
|
85
|
-
}) : i(
|
|
85
|
+
}) : i(S.Ellipsis, {
|
|
86
86
|
class: "van-data-table-pagination-ellipsis",
|
|
87
87
|
get index() {
|
|
88
88
|
return t();
|
|
89
89
|
},
|
|
90
90
|
children: "…"
|
|
91
91
|
})
|
|
92
|
-
}) }), null), o(e, i(
|
|
92
|
+
}) }), null), o(e, i(S.NextTrigger, {
|
|
93
93
|
class: "van-data-table-pagination-btn",
|
|
94
94
|
get children() {
|
|
95
|
-
return i(
|
|
95
|
+
return i(N, { direction: "right" });
|
|
96
96
|
}
|
|
97
|
-
}), null), o(e, i(
|
|
97
|
+
}), null), o(e, i(S.LastTrigger, {
|
|
98
98
|
class: "van-data-table-pagination-btn",
|
|
99
99
|
get children() {
|
|
100
|
-
return i(
|
|
100
|
+
return i(P, { direction: "right" });
|
|
101
101
|
}
|
|
102
102
|
}), null), e;
|
|
103
103
|
}
|
|
@@ -108,9 +108,9 @@ function re(e) {
|
|
|
108
108
|
}
|
|
109
109
|
//#endregion
|
|
110
110
|
//#region src/data-table/DataTable.tsx
|
|
111
|
-
var
|
|
111
|
+
var F = /*#__PURE__*/ u("<svg fill=none height=16 stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox=\"0 0 24 24\"width=16 xmlns=http://www.w3.org/2000/svg><path d=\"M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8\"></path><path d=\"M3 3v5h5\">"), re = /*#__PURE__*/ u("<div class=van-data-table-actions>"), ie = /*#__PURE__*/ u("<div class=van-data-table-search>"), ae = /*#__PURE__*/ u("<div class=van-data-table-toolbar>"), I = /*#__PURE__*/ u("<div>"), L = /*#__PURE__*/ u("<div class=van-data-table-search-actions>"), R = /*#__PURE__*/ u("<div class=van-data-table-tooltip>");
|
|
112
112
|
function z() {
|
|
113
|
-
return
|
|
113
|
+
return F();
|
|
114
114
|
}
|
|
115
115
|
function B(s) {
|
|
116
116
|
let c = _({
|
|
@@ -118,14 +118,14 @@ function B(s) {
|
|
|
118
118
|
defaultPageSize: 10,
|
|
119
119
|
emptyText: "暂无数据",
|
|
120
120
|
showSearchActions: !0
|
|
121
|
-
}, s), u = h(() => c.searchFields ?? []),
|
|
121
|
+
}, s), u = h(() => c.searchFields ?? []), S = h(() => u().map((e) => ({
|
|
122
122
|
...e,
|
|
123
123
|
label: void 0
|
|
124
|
-
}))),
|
|
124
|
+
}))), C = h(() => c.data !== void 0), T = h(() => s.selectable ?? !!s.onSelectionChange), E = (e, t) => typeof e.show == "function" ? e.show(t) : e.show !== !1, [D, O] = g(c.searchValues ?? {}), [k, A] = g(c.searchValues ?? {});
|
|
125
125
|
m(v(() => c.searchValues, (e) => {
|
|
126
|
-
e &&
|
|
126
|
+
e && O(() => e);
|
|
127
127
|
}));
|
|
128
|
-
let [
|
|
128
|
+
let [j, M] = g(c.defaultPage), [N, P] = g(c.defaultPageSize), [F, B] = g([]), V = h(() => {
|
|
129
129
|
let t = 0, n = [];
|
|
130
130
|
for (let r of c.columns) {
|
|
131
131
|
let a = r.type;
|
|
@@ -140,7 +140,7 @@ function B(s) {
|
|
|
140
140
|
enableColumnFilter: !1,
|
|
141
141
|
enableHiding: !1,
|
|
142
142
|
...r,
|
|
143
|
-
cell: ({ row: e }) => (
|
|
143
|
+
cell: ({ row: e }) => (j() - 1) * N() + e.index + 1
|
|
144
144
|
};
|
|
145
145
|
n.push(e);
|
|
146
146
|
continue;
|
|
@@ -148,7 +148,7 @@ function B(s) {
|
|
|
148
148
|
if (a === "date" || a === "dateTime" || a === "shortDateTime") {
|
|
149
149
|
let e = r;
|
|
150
150
|
if (!e.accessorKey) throw Error("[solid-ark] 时间戳列(type=\"date/dateTime/shortDateTime\")必须提供 accessorKey");
|
|
151
|
-
let t = e.accessorKey, i = e.type === "date" ?
|
|
151
|
+
let t = e.accessorKey, i = e.type === "date" ? ee : e.type === "dateTime" ? x : te;
|
|
152
152
|
n.push({
|
|
153
153
|
id: t,
|
|
154
154
|
accessorKey: t,
|
|
@@ -161,21 +161,30 @@ function B(s) {
|
|
|
161
161
|
if (a === "action") {
|
|
162
162
|
let t = r, a = t.actions ?? [];
|
|
163
163
|
if (a.length === 0) continue;
|
|
164
|
+
let s = a.some((e) => typeof e.show == "function") ? a : a.filter((e) => e.show !== !1);
|
|
165
|
+
if (s.length === 0) continue;
|
|
164
166
|
n.push({
|
|
165
167
|
id: "__actions__",
|
|
166
168
|
header: t.header ?? "操作",
|
|
167
169
|
enableSorting: !1,
|
|
168
170
|
cell: ({ row: t }) => (() => {
|
|
169
|
-
var n =
|
|
171
|
+
var n = re();
|
|
170
172
|
return o(n, i(f, {
|
|
171
|
-
each:
|
|
172
|
-
children: (n) => i(
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
return n.variant ?? "outline";
|
|
173
|
+
each: s,
|
|
174
|
+
children: (n) => i(p, {
|
|
175
|
+
get when() {
|
|
176
|
+
return E(n, t.original);
|
|
176
177
|
},
|
|
177
178
|
get children() {
|
|
178
|
-
return
|
|
179
|
+
return i(e, {
|
|
180
|
+
onClick: () => n.onClick(t.original),
|
|
181
|
+
get variant() {
|
|
182
|
+
return n.variant ?? "outline";
|
|
183
|
+
},
|
|
184
|
+
get children() {
|
|
185
|
+
return n.label;
|
|
186
|
+
}
|
|
187
|
+
});
|
|
179
188
|
}
|
|
180
189
|
})
|
|
181
190
|
})), n;
|
|
@@ -188,7 +197,7 @@ function B(s) {
|
|
|
188
197
|
let e = r.cell;
|
|
189
198
|
n.push({
|
|
190
199
|
...r,
|
|
191
|
-
cell: (t) => i(
|
|
200
|
+
cell: (t) => i(w, {
|
|
192
201
|
get text() {
|
|
193
202
|
return String(t.getValue() ?? "");
|
|
194
203
|
},
|
|
@@ -200,32 +209,32 @@ function B(s) {
|
|
|
200
209
|
n.push(r);
|
|
201
210
|
}
|
|
202
211
|
return n;
|
|
203
|
-
}),
|
|
204
|
-
|
|
205
|
-
let e =
|
|
212
|
+
}), H, [U, W] = g(null);
|
|
213
|
+
b(() => {
|
|
214
|
+
let e = H;
|
|
206
215
|
if (!e) return;
|
|
207
216
|
let t = (e) => {
|
|
208
217
|
let t = e.target.closest(".van-data-table-ellipsis[data-ellipsis]");
|
|
209
218
|
if (!t) return;
|
|
210
219
|
let n = t.getBoundingClientRect();
|
|
211
|
-
|
|
220
|
+
W({
|
|
212
221
|
left: n.left,
|
|
213
222
|
text: t.dataset.text ?? "",
|
|
214
223
|
top: n.bottom + 6
|
|
215
224
|
});
|
|
216
225
|
}, n = (e) => {
|
|
217
|
-
e.relatedTarget?.closest?.(".van-data-table-ellipsis[data-ellipsis]") ||
|
|
226
|
+
e.relatedTarget?.closest?.(".van-data-table-ellipsis[data-ellipsis]") || W(null);
|
|
218
227
|
};
|
|
219
|
-
e.addEventListener("mouseover", t), e.addEventListener("mouseout", n),
|
|
228
|
+
e.addEventListener("mouseover", t), e.addEventListener("mouseout", n), y(() => {
|
|
220
229
|
e.removeEventListener("mouseover", t), e.removeEventListener("mouseout", n);
|
|
221
230
|
});
|
|
222
231
|
});
|
|
223
|
-
let [
|
|
232
|
+
let [G, K] = g([]), [q, oe] = g(0), [se, J] = g(!1), Y = h(() => C() ? c.data : G()), ce = h(() => C() ? c.total ?? Y().length : q()), X = h(() => C() ? c.loading ?? !1 : se()), Z = (e, t, n) => ({
|
|
224
233
|
page: e,
|
|
225
234
|
pageSize: t,
|
|
226
235
|
sorting: n
|
|
227
236
|
}), Q = 0, $ = async (e, t) => {
|
|
228
|
-
if (
|
|
237
|
+
if (C()) {
|
|
229
238
|
s.onSearch(e, t);
|
|
230
239
|
return;
|
|
231
240
|
}
|
|
@@ -234,7 +243,7 @@ function B(s) {
|
|
|
234
243
|
try {
|
|
235
244
|
let r = await s.onSearch(e, t);
|
|
236
245
|
if (n !== Q) return;
|
|
237
|
-
|
|
246
|
+
K(r.data), oe(r.total);
|
|
238
247
|
} catch (e) {
|
|
239
248
|
if (n !== Q) return;
|
|
240
249
|
s.onError?.(e);
|
|
@@ -242,39 +251,39 @@ function B(s) {
|
|
|
242
251
|
n === Q && J(!1);
|
|
243
252
|
}
|
|
244
253
|
};
|
|
245
|
-
|
|
246
|
-
|
|
254
|
+
b(() => {
|
|
255
|
+
C() || $(k(), Z(j(), N(), F()));
|
|
247
256
|
});
|
|
248
|
-
let
|
|
249
|
-
|
|
250
|
-
},
|
|
257
|
+
let le = (e) => {
|
|
258
|
+
A(() => e), M(1), $(e, Z(1, N(), F()));
|
|
259
|
+
}, ue = () => {
|
|
251
260
|
let e = Object.fromEntries(u().map((e) => [e.name, void 0]));
|
|
252
|
-
|
|
253
|
-
}, ue = (e) => {
|
|
254
|
-
e !== k() && (A(e), c.onPageChange?.(e), $(D(), Z(e, j(), N())));
|
|
261
|
+
O(() => e), A(() => e), M(1), $(e, Z(1, N(), F()));
|
|
255
262
|
}, de = (e) => {
|
|
256
|
-
e !== j() && (M(e),
|
|
263
|
+
e !== j() && (M(e), c.onPageChange?.(e), $(k(), Z(e, N(), F())));
|
|
257
264
|
}, fe = (e) => {
|
|
258
|
-
P(e), c.
|
|
265
|
+
e !== N() && (P(e), M(1), c.onPageSizeChange?.(e), $(k(), Z(1, e, F())));
|
|
266
|
+
}, pe = (e) => {
|
|
267
|
+
B(e), c.onSortingChange?.(e), M(1), $(k(), Z(1, N(), e));
|
|
259
268
|
};
|
|
260
269
|
return (() => {
|
|
261
|
-
var f = I(), m =
|
|
262
|
-
return typeof m == "function" ? d(m, f) :
|
|
270
|
+
var f = I(), m = H;
|
|
271
|
+
return typeof m == "function" ? d(m, f) : H = f, o(f, i(p, {
|
|
263
272
|
get when() {
|
|
264
273
|
return u().length > 0;
|
|
265
274
|
},
|
|
266
275
|
get children() {
|
|
267
|
-
var n =
|
|
276
|
+
var n = ie();
|
|
268
277
|
return o(n, i(t, {
|
|
269
278
|
get fields() {
|
|
270
|
-
return
|
|
279
|
+
return S();
|
|
271
280
|
},
|
|
272
|
-
onSubmit: ({ value: e }) =>
|
|
281
|
+
onSubmit: ({ value: e }) => le(e),
|
|
273
282
|
get onValuesChange() {
|
|
274
283
|
return c.onSearchValuesChange;
|
|
275
284
|
},
|
|
276
285
|
get values() {
|
|
277
|
-
return
|
|
286
|
+
return D();
|
|
278
287
|
},
|
|
279
288
|
children: () => i(p, {
|
|
280
289
|
get when() {
|
|
@@ -288,7 +297,7 @@ function B(s) {
|
|
|
288
297
|
get disabled() {
|
|
289
298
|
return X();
|
|
290
299
|
},
|
|
291
|
-
onClick:
|
|
300
|
+
onClick: ue,
|
|
292
301
|
variant: "outline",
|
|
293
302
|
get children() {
|
|
294
303
|
return i(z, {});
|
|
@@ -309,12 +318,12 @@ function B(s) {
|
|
|
309
318
|
return c.children;
|
|
310
319
|
},
|
|
311
320
|
get children() {
|
|
312
|
-
var e =
|
|
321
|
+
var e = ae();
|
|
313
322
|
return o(e, () => c.children), e;
|
|
314
323
|
}
|
|
315
324
|
}), null), o(f, i(n, {
|
|
316
325
|
get columns() {
|
|
317
|
-
return
|
|
326
|
+
return V();
|
|
318
327
|
},
|
|
319
328
|
get data() {
|
|
320
329
|
return Y();
|
|
@@ -331,31 +340,31 @@ function B(s) {
|
|
|
331
340
|
get onSelectionChange() {
|
|
332
341
|
return c.onSelectionChange;
|
|
333
342
|
},
|
|
334
|
-
onSortingChange:
|
|
343
|
+
onSortingChange: pe,
|
|
335
344
|
get rowId() {
|
|
336
345
|
return c.rowId;
|
|
337
346
|
},
|
|
338
347
|
get selectable() {
|
|
339
|
-
return
|
|
348
|
+
return T();
|
|
340
349
|
},
|
|
341
350
|
get selectedRowIds() {
|
|
342
351
|
return c.selectedRowIds;
|
|
343
352
|
}
|
|
344
|
-
}), null), o(f, i(
|
|
353
|
+
}), null), o(f, i(ne, {
|
|
345
354
|
get count() {
|
|
346
|
-
return
|
|
355
|
+
return ce();
|
|
347
356
|
},
|
|
348
|
-
onPageChange:
|
|
349
|
-
onPageSizeChange:
|
|
357
|
+
onPageChange: de,
|
|
358
|
+
onPageSizeChange: fe,
|
|
350
359
|
get page() {
|
|
351
|
-
return
|
|
360
|
+
return j();
|
|
352
361
|
},
|
|
353
362
|
get pageSize() {
|
|
354
|
-
return
|
|
363
|
+
return N();
|
|
355
364
|
}
|
|
356
365
|
}), null), o(f, i(p, {
|
|
357
366
|
get when() {
|
|
358
|
-
return
|
|
367
|
+
return U();
|
|
359
368
|
},
|
|
360
369
|
children: (e) => (() => {
|
|
361
370
|
var t = R();
|
|
@@ -21,6 +21,8 @@ export interface DataTableAction<TData> {
|
|
|
21
21
|
onClick: (row: TData) => void;
|
|
22
22
|
/** 按钮变体,默认 "outline" */
|
|
23
23
|
variant?: ButtonVariant;
|
|
24
|
+
/** 是否显示该按钮,默认 true;可为函数(按行判断,读取信号时响应式更新) */
|
|
25
|
+
show?: ((row: TData) => boolean) | boolean;
|
|
24
26
|
}
|
|
25
27
|
type UnionToIntersection<T> = (T extends unknown ? (arg: T) => void : never) extends (arg: infer I) => void ? I : never;
|
|
26
28
|
/** DataTable 扩展的列类型:包含 ColumnDef 全部属性,另加 type / actions 扩展 */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vanstack/solid-ark",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.15",
|
|
4
4
|
"private": false,
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -71,10 +71,10 @@
|
|
|
71
71
|
"vite-plugin-solid": "^2.11.0",
|
|
72
72
|
"vitest": "^4.1.10",
|
|
73
73
|
"zod": "^4.4.0",
|
|
74
|
-
"@vanstack/prettier-config": "0.0.1",
|
|
75
|
-
"@vanstack/eslint-config": "0.0.1",
|
|
76
74
|
"@vanstack/vite-config": "0.0.2",
|
|
77
|
-
"@vanstack/
|
|
75
|
+
"@vanstack/eslint-config": "0.0.1",
|
|
76
|
+
"@vanstack/tsconfig": "0.0.1",
|
|
77
|
+
"@vanstack/prettier-config": "0.0.1"
|
|
78
78
|
},
|
|
79
79
|
"scripts": {
|
|
80
80
|
"build": "tsc --noEmit && vite build",
|