@1771technologies/lytenyte-pro 1.0.0-beta.15 → 1.0.0-beta.17

package/dist/cell-selection/update-additive-cell-selection.js

@@ -7,7 +7,6 @@ export function updateAdditiveCellSelection(grid, rect) {
     const ds = grid.state.rowDataStore;
     const rowTopCount = ds.rowTopCount.get();
     const adjustedRect = adjustRectForRowAndCellSpan(grid, rect);
-    console.log(adjustedRect);
     const rects = splitCellSelectionRect({
         rect: boundSelectionRect(grid, adjustedRect),
         colCenterCount: s.columnVisibleCenterCount,
@@ -15,7 +14,6 @@ export function updateAdditiveCellSelection(grid, rect) {
         rowCenterCount: ds.rowCenterCount.get(),
         rowTopCount: rowTopCount,
     });
-    console.log(rects);
     const current = grid.internal.cellSelectionAdditiveRects.get();
     if (current && current.length === rects.length) {
         if (current.every((c, i) => areRectsEqual(c, rects[i])))

package/dist/grid-box/item.js

@@ -4,7 +4,7 @@ import { Item } from "../listbox/item";
 import { dragState, DropWrap, useDraggable } from "@1771technologies/lytenyte-dragon";
 import { useCombinedRefs, useSlot, } from "@1771technologies/lytenyte-react-hooks";
 import { useGridBoxContext } from "./context";
-export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName, itemStyle, ...props }, forwarded) {
+export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName, itemStyle, children, ...props }, forwarded) {
     const { accepted } = useGridBoxContext();
     const { dragProps } = useDraggable({
         getItems: () => {
@@ -26,7 +26,7 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
                         }
                         if (ev.key === "Backspace" || ev.key === "Delete")
                             item.onDelete?.(ev.currentTarget);
-                    }, onClick: (ev) => item.onAction(ev.currentTarget), className: itemClassName, style: itemStyle, "data-ln-source": item.source })),
+                    }, onClick: (ev) => item.onAction(ev.currentTarget), className: itemClassName, style: itemStyle, "data-ln-source": item.source, "data-ln-index": item.index, children: children })),
             },
         ],
         slot: itemAs ?? _jsx("div", {}),
@@ -41,11 +41,11 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
                 e.setAttribute("data-ln-is-after", "true");
                 return;
             }
-            const thisIndex = Number.parseInt(e.getAttribute("data-ln-index"));
-            const dragIndex = Number.parseInt(e.getAttribute("data-ln-index"));
-            if (Number.isNaN(dragIndex) || Number.isNaN(thisIndex))
+            const overIndex = Number.parseInt(e.getAttribute("data-ln-index"));
+            const dragIndex = Number.parseInt(data.getAttribute("data-ln-index"));
+            if (Number.isNaN(dragIndex) || Number.isNaN(overIndex) || overIndex === dragIndex)
                 return;
-            if (thisIndex < dragIndex) {
+            if (overIndex < dragIndex) {
                 e.setAttribute("data-ln-is-before", "true");
             }
             else {
@@ -54,5 +54,10 @@ export const BoxItem = forwardRef(function BoxItem({ item, itemAs, itemClassName
         }, onLeave: (el) => {
             el.removeAttribute("data-ln-is-before");
             el.removeAttribute("data-ln-is-after");
-        }, "data-ln-source": item.source, "data-ln-index": item.index, accepted: accepted, onDrop: item.onDrop, as: renderer }));
+        }, "data-ln-source": item.source, "data-ln-index": item.index, accepted: accepted, onDrop: (e) => {
+            const el = e.dropElement;
+            el.removeAttribute("data-ln-is-before");
+            el.removeAttribute("data-ln-is-after");
+            item.onDrop(e);
+        }, as: renderer }));
 });

package/dist/grid-box/use-column-box-items.js

@@ -37,16 +37,13 @@ export function useColumnBoxItems({ grid, onRootDrop, onDrop, onDelete, onAction
                 onAction: (el) => onAction?.({ column: c, el }),
                 onDelete: (el) => onDelete?.({ column: c, el }),
                 onDrop: (p) => {
-                    const target = c;
                     const src = p.state.siteLocalData?.[columnId];
-                    const isRtl = grid.state.rtl.get();
-                    let isBefore;
-                    if (orientation === "horizontal") {
-                        isBefore = isRtl ? !p.moveState.leftHalf : p.moveState.leftHalf;
-                    }
-                    else {
-                        isBefore = p.moveState.topHalf;
-                    }
+                    const target = c;
+                    const dragIndex = columns.findIndex((x) => x.id === src.id);
+                    const overIndex = columns.findIndex((x) => x.id === c.id);
+                    const isBefore = overIndex < dragIndex;
+                    if (overIndex === dragIndex)
+                        return;
                     onDrop?.({ src, target, isBefore });
                 },
             };
@@ -58,13 +55,11 @@ export function useColumnBoxItems({ grid, onRootDrop, onDrop, onDelete, onAction
         columns,
         dragPlaceholder,
         draggable,
-        grid.state.rtl,
         gridId,
         itemFilter,
         onAction,
         onDelete,
         onDrop,
-        orientation,
     ]);
     const onRootDropEv = useEvent((p) => {
         const columnId = `${gridId}-column`;

package/dist/grid-box/use-row-group-box-items.js

@@ -13,14 +13,11 @@ export function useRowGroupBoxItems({ grid, orientation, dragPlaceholder, hideCo
             const onDrop = (p) => {
                 const target = c;
                 const src = p.state.siteLocalData?.[groupId];
-                const isRtl = grid.state.rtl.get();
-                let isBefore;
-                if (orientation === "horizontal") {
-                    isBefore = isRtl ? !p.moveState.leftHalf : p.moveState.leftHalf;
-                }
-                else {
-                    isBefore = p.moveState.topHalf;
-                }
+                const overIndex = rowGroupModel.findIndex((x) => x === c);
+                const dragIndex = rowGroupModel.findIndex((x) => x === src);
+                const isBefore = overIndex < dragIndex;
+                if (overIndex === dragIndex)
+                    return;
                 const srcIndex = rowGroupModel.findIndex((x) => {
                     if (typeof src !== typeof x)
                         return;
@@ -88,10 +85,8 @@ export function useRowGroupBoxItems({ grid, orientation, dragPlaceholder, hideCo
     }, [
         grid.api,
         grid.state.rowGroupModel,
-        grid.state.rtl,
         gridId,
         hideColumnOnGroup,
-        orientation,
         dragPlaceholder,
         rowGroupModel,
     ]);

package/dist/header/use-drag-move.js

@@ -1,4 +1,4 @@
-import { getHoveredColumnIndex, getNearestFocusable, useDraggable, } from "@1771technologies/lytenyte-shared";
+import { COLUMN_MARKER_ID, getHoveredColumnIndex, getNearestFocusable, useDraggable, } from "@1771technologies/lytenyte-shared";
 import { useMemo, useRef } from "react";
 export function useDragMove(grid, cell, onDragStart) {
     const ctx = grid.state;
@@ -53,6 +53,8 @@ export function useDragMove(grid, cell, onDragStart) {
             });
             if (index == null)
                 return;
+            if (grid.api.columnFromIndex(index)?.id === COLUMN_MARKER_ID)
+                return;
             const first = columns[0];
             const currentIndex = grid.api.columnIndex(first);
             const columnIndices = columns.map((c) => grid.api.columnIndex(c));

package/dist/state/api/column-autosize.js

@@ -6,7 +6,7 @@ export const makeColumnAutosize = (grid) => {
         const meta = grid.state.columnMeta.get();
         const columns = params.columns
             ?.map((c) => resolveColumn(c, errorRef, meta))
-            .map((c) => c && grid.api.columnById(c))
+            .map((c) => c && (typeof c === "string" ? grid.api.columnById(c) : c))
             .filter(Boolean) ?? grid.state.columnMeta.get().columnsVisible;
         if (errorRef.current) {
             console.error("Invalid column autosize column params");

package/dist/state/helpers/column-add-row-group.js

@@ -62,11 +62,12 @@ export function columnAddRowGroup({ columns, rowGroupModel, rowGroupDisplayMode,
     }
     if (!hasGroupColumn)
         columns = columns.filter((c) => !c.id.startsWith(GROUP_COLUMN_PREFIX));
+    // TODO: this can be improved - what if the columns are really large?
     const keys = Object.keys(rowGroupColumnState);
     for (let i = 0; i < keys.length; i++) {
-        if (!lookup.has(keys[i]))
+        const column = columns.find((c) => c.id === keys[i]);
+        if (!column)
             continue;
-        const column = lookup.get(keys[i]);
         Object.assign(column, rowGroupColumnState[keys[i]]);
     }
     return columns;

package/dist/state/helpers/resolve-column.d.ts

@@ -1,4 +1,4 @@
 import type { Column, ColumnMeta } from "../../+types";
 export declare function resolveColumn(c: string | number | Column<any>, errorRef: {
     current: boolean;
-}, meta: ColumnMeta<any>): string | undefined;
+}, meta: ColumnMeta<any>): string | Column<any> | undefined;

package/dist/state/helpers/resolve-column.js

@@ -1,5 +1,9 @@
+import { GROUP_COLUMN_PREFIX } from "@1771technologies/lytenyte-shared";
 export function resolveColumn(c, errorRef, meta) {
     if (typeof c === "string") {
+        if (c.startsWith(GROUP_COLUMN_PREFIX)) {
+            return meta.columnsVisible.find((x) => x.id === c);
+        }
         if (!meta.columnLookup.has(c)) {
             errorRef.current = true;
             console.error(`Invalid column ${c}`);
@@ -14,6 +18,9 @@ export function resolveColumn(c, errorRef, meta) {
         }
         return col?.id;
     }
+    if (c.id.startsWith(GROUP_COLUMN_PREFIX)) {
+        return meta.columnsVisible.find((x) => x.id === c.id);
+    }
     if (!meta.columnLookup.has(c.id)) {
         errorRef.current = true;
         console.error(`Invalid column ${c.id}`);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@1771technologies/lytenyte-pro",
   "description": "Blazingly fast headless React data grid with 100s of features.",
-  "version": "1.0.0-beta.15",
+  "version": "1.0.0-beta.17",
   "type": "module",
   "license": "COMMERCIAL",
   "files": [
@@ -49,12 +49,12 @@
   },
   "dependencies": {
     "@1771technologies/atom": "^1.0.2",
-    "@1771technologies/lytenyte-core": "1.0.0-beta.15",
-    "@1771technologies/lytenyte-dragon": "1.0.0-beta.15",
-    "@1771technologies/lytenyte-dom-utils": "1.0.0-beta.15",
-    "@1771technologies/lytenyte-js-utils": "1.0.0-beta.15",
-    "@1771technologies/lytenyte-shared": "1.0.0-beta.15",
-    "@1771technologies/lytenyte-react-hooks": "1.0.0-beta.15"
+    "@1771technologies/lytenyte-core": "1.0.0-beta.17",
+    "@1771technologies/lytenyte-dragon": "1.0.0-beta.17",
+    "@1771technologies/lytenyte-shared": "1.0.0-beta.17",
+    "@1771technologies/lytenyte-dom-utils": "1.0.0-beta.17",
+    "@1771technologies/lytenyte-js-utils": "1.0.0-beta.17",
+    "@1771technologies/lytenyte-react-hooks": "1.0.0-beta.17"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",