@crispy-seed/data-table 0.1.1 → 0.1.2
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/index.cjs +4563 -2
- package/dist/index.js +4547 -1
- package/package.json +1 -1
- package/dist/DataTable-12s-D02v6Qj5.js +0 -1523
- package/dist/DataTable-12s-Gpv6I4J8.cjs +0 -1574
- package/dist/DataTable-12s-Zml1x9Kr-12s-B-mwMBhn.cjs +0 -161
- package/dist/DataTable-12s-Zml1x9Kr-12s-BR-yHfob.js +0 -153
- package/dist/Menu-12s-A4lEc__n.cjs +0 -103
- package/dist/Menu-12s-v9vnaq8F.js +0 -77
- package/dist/Select-12s-CE3SMzFp.js +0 -218
- package/dist/Select-12s-CNQC9z8t.cjs +0 -249
- package/dist/body-cells-12s-2sTwdliH.cjs +0 -461
- package/dist/body-cells-12s-Ba2uF4T-.js +0 -452
- package/dist/column-calc-12s-C1-I2KdV.js +0 -129
- package/dist/column-calc-12s-CJ26VuDJ.cjs +0 -149
- package/dist/column-layout-12s-BhQmNTJG.js +0 -99
- package/dist/column-layout-12s-k2fZYeKl.cjs +0 -120
- package/dist/column-menu-12s-6Yvu4SZ0.js +0 -406
- package/dist/column-menu-12s-BnknuXGh.cjs +0 -426
- package/dist/editors-12s-C0RxmTcI.cjs +0 -554
- package/dist/editors-12s-COixUnI2.js +0 -524
- package/dist/resize-12s-CajyNXFB.js +0 -58
- package/dist/resize-12s-ChLpxb4i.cjs +0 -58
- package/dist/states-12s-BB0PT_bq.cjs +0 -125
- package/dist/states-12s-m5mBR90e.js +0 -122
- package/dist/toolbar-12s-B1xiS-Zu.js +0 -68
- package/dist/toolbar-12s-DzLbghpK.cjs +0 -70
- package/dist/useDataTable-12s-BHiDUubw-12s-CBeCwTe7.js +0 -61
- package/dist/useDataTable-12s-BHiDUubw-12s-Dgvt7XDk.cjs +0 -61
- package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs +0 -207
- package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js +0 -183
- package/dist/useDataTableColumns-12s-Cn2ZAzFL-12s-CD6goR59.js +0 -289
- package/dist/useDataTableColumns-12s-Cn2ZAzFL-12s-CUk_CpYT.cjs +0 -292
- package/dist/useDataTableEdit-12s-9Wb_UCrN-12s-BoOHq3GB.js +0 -98
- package/dist/useDataTableEdit-12s-9Wb_UCrN-12s-De6YHBba.cjs +0 -98
- package/dist/useDataTableFilter-12s-ZzbmWMin-12s-CWyBeFna.js +0 -74
- package/dist/useDataTableFilter-12s-ZzbmWMin-12s-lpjzZY3_.cjs +0 -74
- package/dist/useDataTableInfiniteScroll-12s-8ZG31URd-12s-BexjP6iO.js +0 -104
- package/dist/useDataTableInfiniteScroll-12s-8ZG31URd-12s-Bt8gojr9.cjs +0 -104
- package/dist/useDataTableRow-12s-CPYaDa1p-12s-4qkGoz-j.js +0 -30
- package/dist/useDataTableRow-12s-CPYaDa1p-12s-DG64uYjn.cjs +0 -30
- package/dist/useDataTableScroll-12s-BKDCr0en-12s-C7f2vHeG.js +0 -61
- package/dist/useDataTableScroll-12s-BKDCr0en-12s-CUvUYMtt.cjs +0 -61
- package/dist/useDataTableSearch-12s-Ck3iWcpX-12s-B-65V6gH.js +0 -37
- package/dist/useDataTableSearch-12s-Ck3iWcpX-12s-DhVfN2Hq.cjs +0 -37
- package/dist/useDataTableSelection-12s-BIDtiRQq-12s-IS__VAnU.cjs +0 -71
- package/dist/useDataTableSelection-12s-BIDtiRQq-12s-O6M_BhrH.js +0 -71
- package/dist/useDataTableSort-12s-DvJYtmeS-12s-C5VGnsq4.cjs +0 -78
- package/dist/useDataTableSort-12s-DvJYtmeS-12s-DABSNt6U.js +0 -78
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
function __insertCSS(code) {
|
|
3
|
-
if (!code || typeof document == 'undefined') return
|
|
4
|
-
let head = document.head || document.getElementsByTagName('head')[0]
|
|
5
|
-
let style = document.createElement('style')
|
|
6
|
-
style.type = 'text/css'
|
|
7
|
-
head.appendChild(style)
|
|
8
|
-
;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
var useDataTableColumnCalc12sDTQQTtEJ12s = require('./useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs');
|
|
12
|
-
var domUtils = require('@seed-design/dom-utils');
|
|
13
|
-
var React = require('react');
|
|
14
|
-
|
|
15
|
-
// Owns the single active sort column/direction and the click/keyboard toggle that
|
|
16
|
-
// cycles it -- the way useSelectHighlight owns the single active index. A header
|
|
17
|
-
// cell's full prop set (aria-sort, data-sortable/data-sorted, the click and
|
|
18
|
-
// Enter/Space handlers) is built here too, beside the state it reads, rather than
|
|
19
|
-
// re-derived in the styled layer or the root primitive.
|
|
20
|
-
function useDataTableSort(props) {
|
|
21
|
-
const { sort: sortProp, defaultSort, onSortChange } = props;
|
|
22
|
-
const [sort, setSort] = useDataTableColumnCalc12sDTQQTtEJ12s.useControllableState({
|
|
23
|
-
prop: sortProp,
|
|
24
|
-
defaultProp: defaultSort,
|
|
25
|
-
onChange: (nextSort)=>{
|
|
26
|
-
// `toggleSort` never sets `sort` back to `undefined`, but the underlying state is
|
|
27
|
-
// typed as possibly-undefined so an uncontrolled table can start with no sort at all.
|
|
28
|
-
if (nextSort) onSortChange?.(nextSort);
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
const toggleSort = React.useCallback((key)=>{
|
|
32
|
-
setSort((current)=>{
|
|
33
|
-
if (!current || current.key !== key) return {
|
|
34
|
-
key,
|
|
35
|
-
dir: "asc"
|
|
36
|
-
};
|
|
37
|
-
return {
|
|
38
|
-
key,
|
|
39
|
-
dir: current.dir === "asc" ? "desc" : "asc"
|
|
40
|
-
};
|
|
41
|
-
});
|
|
42
|
-
}, [
|
|
43
|
-
setSort
|
|
44
|
-
]);
|
|
45
|
-
const getHeaderCellProps = React.useCallback((columnKey, sortable)=>{
|
|
46
|
-
const isSorted = Boolean(columnKey) && sort?.key === columnKey;
|
|
47
|
-
const canSort = Boolean(sortable && columnKey);
|
|
48
|
-
return domUtils.elementProps({
|
|
49
|
-
role: "columnheader",
|
|
50
|
-
"aria-sort": canSort ? isSorted ? sort?.dir === "asc" ? "ascending" : "descending" : "none" : undefined,
|
|
51
|
-
tabIndex: canSort ? 0 : undefined,
|
|
52
|
-
"data-sortable": domUtils.dataAttr(canSort),
|
|
53
|
-
"data-sorted": domUtils.dataAttr(isSorted),
|
|
54
|
-
"data-sort-direction": isSorted ? sort?.dir : undefined,
|
|
55
|
-
onClick (event) {
|
|
56
|
-
if (event.defaultPrevented || !canSort || !columnKey) return;
|
|
57
|
-
toggleSort(columnKey);
|
|
58
|
-
},
|
|
59
|
-
onKeyDown (event) {
|
|
60
|
-
if (event.defaultPrevented || !canSort || !columnKey) return;
|
|
61
|
-
if (event.key === "Enter" || event.key === " ") {
|
|
62
|
-
event.preventDefault();
|
|
63
|
-
toggleSort(columnKey);
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
}, [
|
|
68
|
-
sort,
|
|
69
|
-
toggleSort
|
|
70
|
-
]);
|
|
71
|
-
return {
|
|
72
|
-
sort,
|
|
73
|
-
toggleSort,
|
|
74
|
-
getHeaderCellProps
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
exports.useDataTableSort = useDataTableSort;
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
function __insertCSS(code) {
|
|
3
|
-
if (!code || typeof document == 'undefined') return
|
|
4
|
-
let head = document.head || document.getElementsByTagName('head')[0]
|
|
5
|
-
let style = document.createElement('style')
|
|
6
|
-
style.type = 'text/css'
|
|
7
|
-
head.appendChild(style)
|
|
8
|
-
;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
import { d as useControllableState } from './useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js';
|
|
12
|
-
import { elementProps, dataAttr } from '@seed-design/dom-utils';
|
|
13
|
-
import { useCallback } from 'react';
|
|
14
|
-
|
|
15
|
-
// Owns the single active sort column/direction and the click/keyboard toggle that
|
|
16
|
-
// cycles it -- the way useSelectHighlight owns the single active index. A header
|
|
17
|
-
// cell's full prop set (aria-sort, data-sortable/data-sorted, the click and
|
|
18
|
-
// Enter/Space handlers) is built here too, beside the state it reads, rather than
|
|
19
|
-
// re-derived in the styled layer or the root primitive.
|
|
20
|
-
function useDataTableSort(props) {
|
|
21
|
-
const { sort: sortProp, defaultSort, onSortChange } = props;
|
|
22
|
-
const [sort, setSort] = useControllableState({
|
|
23
|
-
prop: sortProp,
|
|
24
|
-
defaultProp: defaultSort,
|
|
25
|
-
onChange: (nextSort)=>{
|
|
26
|
-
// `toggleSort` never sets `sort` back to `undefined`, but the underlying state is
|
|
27
|
-
// typed as possibly-undefined so an uncontrolled table can start with no sort at all.
|
|
28
|
-
if (nextSort) onSortChange?.(nextSort);
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
const toggleSort = useCallback((key)=>{
|
|
32
|
-
setSort((current)=>{
|
|
33
|
-
if (!current || current.key !== key) return {
|
|
34
|
-
key,
|
|
35
|
-
dir: "asc"
|
|
36
|
-
};
|
|
37
|
-
return {
|
|
38
|
-
key,
|
|
39
|
-
dir: current.dir === "asc" ? "desc" : "asc"
|
|
40
|
-
};
|
|
41
|
-
});
|
|
42
|
-
}, [
|
|
43
|
-
setSort
|
|
44
|
-
]);
|
|
45
|
-
const getHeaderCellProps = useCallback((columnKey, sortable)=>{
|
|
46
|
-
const isSorted = Boolean(columnKey) && sort?.key === columnKey;
|
|
47
|
-
const canSort = Boolean(sortable && columnKey);
|
|
48
|
-
return elementProps({
|
|
49
|
-
role: "columnheader",
|
|
50
|
-
"aria-sort": canSort ? isSorted ? sort?.dir === "asc" ? "ascending" : "descending" : "none" : undefined,
|
|
51
|
-
tabIndex: canSort ? 0 : undefined,
|
|
52
|
-
"data-sortable": dataAttr(canSort),
|
|
53
|
-
"data-sorted": dataAttr(isSorted),
|
|
54
|
-
"data-sort-direction": isSorted ? sort?.dir : undefined,
|
|
55
|
-
onClick (event) {
|
|
56
|
-
if (event.defaultPrevented || !canSort || !columnKey) return;
|
|
57
|
-
toggleSort(columnKey);
|
|
58
|
-
},
|
|
59
|
-
onKeyDown (event) {
|
|
60
|
-
if (event.defaultPrevented || !canSort || !columnKey) return;
|
|
61
|
-
if (event.key === "Enter" || event.key === " ") {
|
|
62
|
-
event.preventDefault();
|
|
63
|
-
toggleSort(columnKey);
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
}, [
|
|
68
|
-
sort,
|
|
69
|
-
toggleSort
|
|
70
|
-
]);
|
|
71
|
-
return {
|
|
72
|
-
sort,
|
|
73
|
-
toggleSort,
|
|
74
|
-
getHeaderCellProps
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
export { useDataTableSort as u };
|