@1771technologies/lytenyte-pro 1.0.0-beta.14 → 1.0.0-beta.16
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/cell-selection/update-additive-cell-selection.js +0 -2
- package/dist/column-manager/branch.js +5 -2
- package/dist/column-manager/leaf.js +3 -1
- package/dist/grid-box/item.js +17 -10
- package/dist/grid-box/use-column-box-items.js +6 -11
- package/dist/grid-box/use-row-group-box-items.js +5 -10
- package/dist/listbox/item.js +1 -1
- package/dist/tree-view/leaf.js +1 -0
- package/package.json +7 -7
|
@@ -7,7 +7,6 @@ export function updateAdditiveCellSelection(grid, rect) {
|
|
|
7
7
|
const ds = grid.state.rowDataStore;
|
|
8
8
|
const rowTopCount = ds.rowTopCount.get();
|
|
9
9
|
const adjustedRect = adjustRectForRowAndCellSpan(grid, rect);
|
|
10
|
-
console.log(adjustedRect);
|
|
11
10
|
const rects = splitCellSelectionRect({
|
|
12
11
|
rect: boundSelectionRect(grid, adjustedRect),
|
|
13
12
|
colCenterCount: s.columnVisibleCenterCount,
|
|
@@ -15,7 +14,6 @@ export function updateAdditiveCellSelection(grid, rect) {
|
|
|
15
14
|
rowCenterCount: ds.rowCenterCount.get(),
|
|
16
15
|
rowTopCount: rowTopCount,
|
|
17
16
|
});
|
|
18
|
-
console.log(rects);
|
|
19
17
|
const current = grid.internal.cellSelectionAdditiveRects.get();
|
|
20
18
|
if (current && current.length === rects.length) {
|
|
21
19
|
if (current.every((c, i) => areRectsEqual(c, rects[i])))
|
|
@@ -21,8 +21,10 @@ export const Branch = forwardRef(function Branch({ item, label, ...props }, forw
|
|
|
21
21
|
}, [columns, grid.api, isVisible]);
|
|
22
22
|
return (_jsx(ColumnItemContext, { value: useMemo(() => ({ item }), [item]), children: _jsx(TreeBranch, { ...props, itemId: item.branch.data.idOccurrence, ref: forwarded, ...item.attrs, onKeyDown: (ev) => {
|
|
23
23
|
props.onKeyDown?.(ev);
|
|
24
|
-
if (ev.key === " ")
|
|
24
|
+
if (ev.key === " ") {
|
|
25
25
|
toggle();
|
|
26
|
+
ev.preventDefault();
|
|
27
|
+
}
|
|
26
28
|
}, labelWrap: _jsx(DropWrap, { "data-ln-column-manager-branch": true, "data-ln-column-id": item.branch.data.idOccurrence, accepted: [accepted], onEnter: (el) => {
|
|
27
29
|
const data = dragState.data
|
|
28
30
|
.get()
|
|
@@ -38,7 +40,8 @@ export const Branch = forwardRef(function Branch({ item, label, ...props }, forw
|
|
|
38
40
|
return;
|
|
39
41
|
const thisIndex = allColumns.findIndex((c) => c.id === columns[0].id);
|
|
40
42
|
const isBefore = thisIndex > moveIndex;
|
|
41
|
-
|
|
43
|
+
// Flipped since our source is the one moving
|
|
44
|
+
if (!isBefore) {
|
|
42
45
|
el.setAttribute("data-ln-is-before", "true");
|
|
43
46
|
}
|
|
44
47
|
else {
|
|
@@ -38,7 +38,8 @@ export const Leaf = forwardRef(function ColumnManagerLeaf({ item, ...props }, fo
|
|
|
38
38
|
return;
|
|
39
39
|
const thisIndex = allColumns.findIndex((c) => c.id === columns[0].id);
|
|
40
40
|
const isBefore = thisIndex > moveIndex;
|
|
41
|
-
|
|
41
|
+
// Flipped since our source is the one moving
|
|
42
|
+
if (!isBefore) {
|
|
42
43
|
el.setAttribute("data-ln-is-before", "true");
|
|
43
44
|
}
|
|
44
45
|
else {
|
|
@@ -51,6 +52,7 @@ export const Leaf = forwardRef(function ColumnManagerLeaf({ item, ...props }, fo
|
|
|
51
52
|
props.onKeyDown?.(ev);
|
|
52
53
|
if (ev.key === " ") {
|
|
53
54
|
toggle();
|
|
55
|
+
ev.preventDefault();
|
|
54
56
|
}
|
|
55
57
|
}, "data-ln-column-manager-leaf": true, "data-ln-column-id": item.leaf.data.id }) }) }));
|
|
56
58
|
});
|
package/dist/grid-box/item.js
CHANGED
|
@@ -4,7 +4,7 @@ import { Item } from "../listbox/item";
|
|
|
4
4
|
import { dragState, DropWrap, useDraggable } from "@1771technologies/lytenyte-dragon";
|
|
5
5
|
import { useCombinedRefs, useSlot, } from "@1771technologies/lytenyte-react-hooks";
|
|
6
6
|
import { useGridBoxContext } from "./context";
|
|
7
|
-
export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName, itemStyle, ...props }, forwarded) {
|
|
7
|
+
export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName, itemStyle, children, ...props }, forwarded) {
|
|
8
8
|
const { accepted } = useGridBoxContext();
|
|
9
9
|
const { dragProps } = useDraggable({
|
|
10
10
|
getItems: () => {
|
|
@@ -19,17 +19,19 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
|
|
|
19
19
|
const renderer = useSlot({
|
|
20
20
|
props: [
|
|
21
21
|
{
|
|
22
|
-
children: (_jsx(Item, { ...
|
|
23
|
-
if (ev.key === " ")
|
|
22
|
+
children: (_jsx(Item, { ...extraProps, onKeyDown: (ev) => {
|
|
23
|
+
if (ev.key === " ") {
|
|
24
24
|
item.onAction?.(ev.currentTarget);
|
|
25
|
+
ev.preventDefault();
|
|
26
|
+
}
|
|
25
27
|
if (ev.key === "Backspace" || ev.key === "Delete")
|
|
26
28
|
item.onDelete?.(ev.currentTarget);
|
|
27
|
-
}, onClick: (ev) => item.onAction(ev.currentTarget), className: itemClassName, style: itemStyle })),
|
|
29
|
+
}, onClick: (ev) => item.onAction(ev.currentTarget), className: itemClassName, style: itemStyle, "data-ln-source": item.source, "data-ln-index": item.index, children: children })),
|
|
28
30
|
},
|
|
29
31
|
],
|
|
30
32
|
slot: itemAs ?? _jsx("div", {}),
|
|
31
33
|
});
|
|
32
|
-
return (_jsx(DropWrap, { onEnter: (e) => {
|
|
34
|
+
return (_jsx(DropWrap, { ...props, onEnter: (e) => {
|
|
33
35
|
const data = dragState.active.get();
|
|
34
36
|
const thisSource = e.getAttribute("data-ln-source");
|
|
35
37
|
const dragSource = data?.getAttribute("data-ln-source");
|
|
@@ -39,11 +41,11 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
|
|
|
39
41
|
e.setAttribute("data-ln-is-after", "true");
|
|
40
42
|
return;
|
|
41
43
|
}
|
|
42
|
-
const
|
|
43
|
-
const dragIndex = Number.parseInt(
|
|
44
|
-
if (Number.isNaN(dragIndex) || Number.isNaN(
|
|
44
|
+
const overIndex = Number.parseInt(e.getAttribute("data-ln-index"));
|
|
45
|
+
const dragIndex = Number.parseInt(data.getAttribute("data-ln-index"));
|
|
46
|
+
if (Number.isNaN(dragIndex) || Number.isNaN(overIndex) || overIndex === dragIndex)
|
|
45
47
|
return;
|
|
46
|
-
if (
|
|
48
|
+
if (overIndex < dragIndex) {
|
|
47
49
|
e.setAttribute("data-ln-is-before", "true");
|
|
48
50
|
}
|
|
49
51
|
else {
|
|
@@ -52,5 +54,10 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
|
|
|
52
54
|
}, onLeave: (el) => {
|
|
53
55
|
el.removeAttribute("data-ln-is-before");
|
|
54
56
|
el.removeAttribute("data-ln-is-after");
|
|
55
|
-
}, "data-ln-source": item.source, "data-ln-index": item.index, accepted: accepted, onDrop:
|
|
57
|
+
}, "data-ln-source": item.source, "data-ln-index": item.index, accepted: accepted, onDrop: (e) => {
|
|
58
|
+
const el = e.dropElement;
|
|
59
|
+
el.removeAttribute("data-ln-is-before");
|
|
60
|
+
el.removeAttribute("data-ln-is-after");
|
|
61
|
+
item.onDrop(e);
|
|
62
|
+
}, as: renderer }));
|
|
56
63
|
});
|
|
@@ -37,16 +37,13 @@ export function useColumnBoxItems({ grid, onRootDrop, onDrop, onDelete, onAction
|
|
|
37
37
|
onAction: (el) => onAction?.({ column: c, el }),
|
|
38
38
|
onDelete: (el) => onDelete?.({ column: c, el }),
|
|
39
39
|
onDrop: (p) => {
|
|
40
|
-
const target = c;
|
|
41
40
|
const src = p.state.siteLocalData?.[columnId];
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
isBefore = p.moveState.topHalf;
|
|
49
|
-
}
|
|
41
|
+
const target = c;
|
|
42
|
+
const dragIndex = columns.findIndex((x) => x.id === src.id);
|
|
43
|
+
const overIndex = columns.findIndex((x) => x.id === c.id);
|
|
44
|
+
const isBefore = overIndex < dragIndex;
|
|
45
|
+
if (overIndex === dragIndex)
|
|
46
|
+
return;
|
|
50
47
|
onDrop?.({ src, target, isBefore });
|
|
51
48
|
},
|
|
52
49
|
};
|
|
@@ -58,13 +55,11 @@ export function useColumnBoxItems({ grid, onRootDrop, onDrop, onDelete, onAction
|
|
|
58
55
|
columns,
|
|
59
56
|
dragPlaceholder,
|
|
60
57
|
draggable,
|
|
61
|
-
grid.state.rtl,
|
|
62
58
|
gridId,
|
|
63
59
|
itemFilter,
|
|
64
60
|
onAction,
|
|
65
61
|
onDelete,
|
|
66
62
|
onDrop,
|
|
67
|
-
orientation,
|
|
68
63
|
]);
|
|
69
64
|
const onRootDropEv = useEvent((p) => {
|
|
70
65
|
const columnId = `${gridId}-column`;
|
|
@@ -13,14 +13,11 @@ export function useRowGroupBoxItems({ grid, orientation, dragPlaceholder, hideCo
|
|
|
13
13
|
const onDrop = (p) => {
|
|
14
14
|
const target = c;
|
|
15
15
|
const src = p.state.siteLocalData?.[groupId];
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
else {
|
|
22
|
-
isBefore = p.moveState.topHalf;
|
|
23
|
-
}
|
|
16
|
+
const overIndex = rowGroupModel.findIndex((x) => x === c);
|
|
17
|
+
const dragIndex = rowGroupModel.findIndex((x) => x === src);
|
|
18
|
+
const isBefore = overIndex < dragIndex;
|
|
19
|
+
if (overIndex === dragIndex)
|
|
20
|
+
return;
|
|
24
21
|
const srcIndex = rowGroupModel.findIndex((x) => {
|
|
25
22
|
if (typeof src !== typeof x)
|
|
26
23
|
return;
|
|
@@ -88,10 +85,8 @@ export function useRowGroupBoxItems({ grid, orientation, dragPlaceholder, hideCo
|
|
|
88
85
|
}, [
|
|
89
86
|
grid.api,
|
|
90
87
|
grid.state.rowGroupModel,
|
|
91
|
-
grid.state.rtl,
|
|
92
88
|
gridId,
|
|
93
89
|
hideColumnOnGroup,
|
|
94
|
-
orientation,
|
|
95
90
|
dragPlaceholder,
|
|
96
91
|
rowGroupModel,
|
|
97
92
|
]);
|
package/dist/listbox/item.js
CHANGED
|
@@ -9,6 +9,7 @@ export const Item = forwardRef(function Item(props, forwarded) {
|
|
|
9
9
|
const prev = ctx.rtl ? "ArrowRight" : "ArrowLeft";
|
|
10
10
|
if (ev.key !== next && ev.key !== prev)
|
|
11
11
|
return;
|
|
12
|
+
ev.preventDefault();
|
|
12
13
|
const items = getTabbables(ev.currentTarget);
|
|
13
14
|
if (!items.length)
|
|
14
15
|
return;
|
|
@@ -18,7 +19,6 @@ export const Item = forwardRef(function Item(props, forwarded) {
|
|
|
18
19
|
const itemToFocus = items[nextIndex];
|
|
19
20
|
if (!itemToFocus)
|
|
20
21
|
return;
|
|
21
|
-
ev.preventDefault();
|
|
22
22
|
ev.stopPropagation();
|
|
23
23
|
itemToFocus.focus();
|
|
24
24
|
}, ref: forwarded, tabIndex: 0, "data-ln-listbox-item": true }));
|
package/dist/tree-view/leaf.js
CHANGED
|
@@ -13,6 +13,7 @@ export const TreeLeaf = forwardRef(function TreeLeaf({ itemId, ...props }, forwa
|
|
|
13
13
|
e.ctrlKey ||
|
|
14
14
|
e.shiftKey)
|
|
15
15
|
return;
|
|
16
|
+
e.preventDefault();
|
|
16
17
|
const nodes = getFocusables(e.currentTarget);
|
|
17
18
|
const index = nodes.indexOf(document.activeElement);
|
|
18
19
|
if (index === -1) {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@1771technologies/lytenyte-pro",
|
|
3
3
|
"description": "Blazingly fast headless React data grid with 100s of features.",
|
|
4
|
-
"version": "1.0.0-beta.
|
|
4
|
+
"version": "1.0.0-beta.16",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "COMMERCIAL",
|
|
7
7
|
"files": [
|
|
@@ -49,12 +49,12 @@
|
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@1771technologies/atom": "^1.0.2",
|
|
52
|
-
"@1771technologies/lytenyte-
|
|
53
|
-
"@1771technologies/lytenyte-
|
|
54
|
-
"@1771technologies/lytenyte-
|
|
55
|
-
"@1771technologies/lytenyte-
|
|
56
|
-
"@1771technologies/lytenyte-
|
|
57
|
-
"@1771technologies/lytenyte-
|
|
52
|
+
"@1771technologies/lytenyte-js-utils": "1.0.0-beta.16",
|
|
53
|
+
"@1771technologies/lytenyte-dom-utils": "1.0.0-beta.16",
|
|
54
|
+
"@1771technologies/lytenyte-core": "1.0.0-beta.16",
|
|
55
|
+
"@1771technologies/lytenyte-dragon": "1.0.0-beta.16",
|
|
56
|
+
"@1771technologies/lytenyte-shared": "1.0.0-beta.16",
|
|
57
|
+
"@1771technologies/lytenyte-react-hooks": "1.0.0-beta.16"
|
|
58
58
|
},
|
|
59
59
|
"peerDependencies": {
|
|
60
60
|
"react": "^18.0.0 || ^19.0.0",
|