@1771technologies/lytenyte-pro 0.0.39

package/dist/index.js

@@ -0,0 +1,3730 @@
+import { C as Checkbox, e as COLUMN_MARKER_ID, H as HEADER_CELL_POSITION, g as getTransform, f as COLUMN_EMPTY_PREFIX, h as HEADER_GROUP_CELL_POSITION, i as CollapseButton, F as FLOATING_CELL_POSITION, j as FULL_ENCODING, k as CellFullWidth, E as END_ENCODING, l as Cell, I as Input, u as useGrid$1, m as GRID_CELL_POSITION, n as GridButton, G as GridProvider } from "./use-grid-DKvzGZWc.js";
+import { y, q, z, A, L, M, O, N, Q, v, t, w, x, P, r, J, o, B, R, s, p, K } from "./use-grid-DKvzGZWc.js";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { Sizer } from "@1771technologies/react-sizer";
+import { useEvent, useIsoEffect } from "@1771technologies/react-utils";
+import { context } from "@1771technologies/grid-provider";
+import * as React from "react";
+import { useContext, useMemo, useEffect, useRef, useState, useCallback, memo } from "react";
+import { sizeFromCoord, clsx, getClientX, IsoResizeObserver, getPreciseElementDimensions, getClientY, getFocusableElements, clamp, getRelativeXPosition, getRelativeYPosition } from "@1771technologies/js-utils";
+import { useDraggable, useDroppable, dragState } from "@1771technologies/react-dragon";
+import { getHoveredRowIndex, getHoveredColumnIndex, getRootCell } from "@1771technologies/grid-core";
+import * as ReactDOM from "react-dom";
+import { createPortal } from "react-dom";
+import { cascada, signal } from "@1771technologies/react-cascada";
+import { M as MenuRoot, a as MenuPortal, b as MenuPositioner, t as translateOpenChangeReason, P as PATIENT_CLICK_THRESHOLD } from "./MenuRoot-9n64jNWP.js";
+import { SplitPane, splitPaneAxe } from "@1771technologies/react-split-pane";
+import { F as FloatingPortal, P as PropTypes, H as HTMLElementType, r as refType, j as useEventCallback, y as useOpenChangeComplete, z as useFloatingRootContext, E as useRole, C as useClick, D as useDismiss, S as getTarget, K as useInteractions, m as mergeProps, A as useHover, B as safePolygon } from "./InternalBackdrop-Dm9czgoC.js";
+import { u as useDialogRootContext, D as DialogPortalContext, b as useOptionalDialogRootContext, c as DialogContext, d as DialogRootContext } from "./DialogPortalContext-C2WZTqJ3.js";
+import { a as useControlled, b as useTransitionStatus, c as useScrollLock } from "./useScrollLock-D6h5lZYs.js";
+import { P as PopoverRootContext, u as usePopoverRootContext, c as PopoverPortalContext, A as AnchorProvider } from "./anchor-context-B9sGQdR5.js";
+import { makeGridPro } from "@1771technologies/grid-store-pro";
+import { createClientDataSource } from "@1771technologies/grid-client-data-source-pro";
+import { createTreeDataSource } from "@1771technologies/grid-tree-data-source";
+function useGrid() {
+  return useContext(context);
+}
+function useHeaderDisplayGridTemplate(levelsCount, headerHeight, groupHeaderHeight, floatingRowEnabled, floatingRowHeight) {
+  const gridTemplateRows = useMemo(() => {
+    const groupHeight = typeof groupHeaderHeight === "number" ? `${groupHeaderHeight}px` : "auto";
+    const height = typeof headerHeight === "number" ? `${headerHeight}px` : "auto";
+    const template = Array.from({ length: levelsCount }, () => groupHeight);
+    template.push(height);
+    if (floatingRowEnabled) {
+      const floatingHeight = typeof floatingRowHeight === "number" ? `${floatingRowHeight}px` : "auto";
+      template.push(floatingHeight);
+    }
+    return template.join(" ");
+  }, [floatingRowEnabled, floatingRowHeight, groupHeaderHeight, headerHeight, levelsCount]);
+  return gridTemplateRows;
+}
+function HeaderCellDefault({ column }) {
+  const label = column.headerName ?? column.id;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        boxSizing: "border-box",
+        width: "100%",
+        height: "100%",
+        paddingInline: 12
+      },
+      children: label
+    }
+  );
+}
+function HeaderCellMarker({ api }) {
+  const supportsSelectedAll = api.rowSelectionSelectAllSupported();
+  const allSelected = api.rowSelectionAllRowsSelected();
+  const selected = api.getState().rowSelectionSelectedIds.use();
+  const someSelected = useMemo(() => {
+    for (const c of selected) {
+      if (api.rowById(c)) return true;
+    }
+    return false;
+  }, [api, selected]);
+  if (!supportsSelectedAll) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "100%",
+        height: "100%"
+      },
+      children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          tabIndex: -1,
+          isChecked: allSelected || someSelected,
+          isDeterminate: !allSelected && someSelected,
+          onClick: () => {
+            if (allSelected) api.rowSelectionClear();
+            else api.rowSelectionSelectAll();
+          }
+        }
+      )
+    }
+  );
+}
+function useHeaderCellRenderer(api, column) {
+  const sx = api.getState();
+  const renderers = sx.columnHeaderRenderers.use();
+  const base = sx.columnBase.use();
+  const Renderer = useMemo(() => {
+    if (column.id === COLUMN_MARKER_ID) return HeaderCellMarker;
+    const fn = column.headerRenderer ?? base.headerRenderer;
+    if (!fn) return HeaderCellDefault;
+    if (typeof fn === "string") {
+      const cell = renderers[fn];
+      if (!cell) throw new Error(`Header cell renderer with name ${fn} does not exist.`);
+      return cell;
+    }
+    return fn;
+  }, [base.headerRenderer, column.headerRenderer, column.id, renderers]);
+  return Renderer;
+}
+function useHeaderMove(api, column, columnIndex) {
+  const gridId = api.getState().gridId.use();
+  const dragProps = useDraggable({
+    dragData: () => ({ columns: [column], columnIndex }),
+    dragTags: () => [`${gridId}:grid:${column.pin ?? "none"}`],
+    placeholder: () => /* @__PURE__ */ jsx(DragPlaceholder$1, { column })
+  });
+  const { canDrop, isOver, ...dropProps } = useDroppable({
+    tags: [`${gridId}:grid:${column.pin ?? "none"}`],
+    onDrop: (p2) => {
+      const data2 = p2.getData();
+      const dragIndex2 = data2.columnIndex;
+      const isBefore2 = columnIndex < dragIndex2;
+      const src = data2.columns.map((c) => c.id);
+      const target = column.id;
+      if (src.includes(target)) return;
+      if (isBefore2) api.columnMoveBefore(src, target);
+      else api.columnMoveAfter(src, target);
+    }
+  });
+  const dragData = dragState.dragData.use();
+  const data = dragData?.();
+  const dragIndex = data?.columnIndex ?? -1;
+  const isBefore = columnIndex < dragIndex;
+  const moveProps = api.columnIsMovable(column) ? dragProps : {};
+  return { moveProps, dropProps, isBefore, canDrop, isOver, dragIndex };
+}
+function DragPlaceholder$1(c) {
+  return /* @__PURE__ */ jsx("div", { className: "lng1771-drag-placeholder", children: c.column.headerName ?? c.column.id });
+}
+function useHeaderFocus(api, ref, columnIndex) {
+  useEffect(() => {
+    const sx = api.getState();
+    const unsub = sx.internal.navigatePosition.watch(() => {
+      const position = sx.internal.navigatePosition.peek();
+      if (!ref.current || !position || position.kind !== HEADER_CELL_POSITION) return;
+      if (position.columnIndex === columnIndex && !ref.current.contains(document.activeElement)) {
+        api.navigateScrollIntoView(null, columnIndex);
+        ref.current.focus();
+      }
+    });
+    return () => unsub();
+  }, [api, columnIndex, ref]);
+  const onFocus = useEvent(() => {
+    api.getState().internal.navigatePosition.set({ kind: HEADER_CELL_POSITION, columnIndex });
+  });
+  return { onFocus };
+}
+function HeaderCell({
+  api,
+  column,
+  columnIndex,
+  viewportWidth,
+  rowStart,
+  rowEnd,
+  xPositions
+}) {
+  const isStart = column.pin === "start";
+  const isEnd = column.pin === "end";
+  const rtl = api.getState().rtl.use();
+  const style = useMemo(() => {
+    const x2 = isEnd ? xPositions[columnIndex] - xPositions.at(-1) + viewportWidth : xPositions[columnIndex];
+    const width = sizeFromCoord(columnIndex, xPositions);
+    const style2 = {
+      transform: getTransform(x2 * (rtl ? -1 : 1), 0),
+      gridRowStart: rowStart,
+      gridRowEnd: rowEnd,
+      width
+    };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 2;
+    }
+    return style2;
+  }, [columnIndex, isEnd, isStart, rowEnd, rowStart, rtl, viewportWidth, xPositions]);
+  const Renderer = useHeaderCellRenderer(api, column);
+  const { moveProps, dropProps, isBefore, isOver, canDrop, dragIndex } = useHeaderMove(
+    api,
+    column,
+    columnIndex
+  );
+  const sx = api.getState();
+  sx.sortModel.use();
+  const ref = useRef(null);
+  const events = useHeaderFocus(api, ref, columnIndex);
+  if (api.columnIsEmpty(column)) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ...events,
+        ref,
+        onClick: () => {
+          const id = column.id.replace(COLUMN_EMPTY_PREFIX, "").split("|>").slice(0, -1);
+          api.columnGroupToggle(id.join(api.getState().columnGroupIdDelimiter.peek()));
+        },
+        style,
+        className: "lng1771-header__cell-expand",
+        children: "+"
+      }
+    );
+  }
+  const sortDir = api.columnSortDirection(column);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style,
+      ref,
+      role: "columnheader",
+      "data-lng1771-column-id": column.id,
+      "data-lng1771-kind": "header",
+      "aria-colindex": columnIndex + 1,
+      "aria-colspan": 1,
+      "aria-sort": sortDir === "asc" ? "ascending" : sortDir === "desc" ? "descending" : "none",
+      tabIndex: -1,
+      ...moveProps,
+      ...dropProps,
+      ...events,
+      className: clsx(
+        "lng1771-header__cell",
+        isOver && columnIndex !== dragIndex && "lng1771-header__cell--over",
+        isOver && isBefore && "lng1771-header__cell--over-before",
+        isOver && !isBefore && "lng1771-header__cell--over-after",
+        isOver && !canDrop && "lng1771-header__cell--over-not-allowed"
+      ),
+      children: /* @__PURE__ */ jsx(Renderer, { api, column })
+    }
+  );
+}
+function useHeaderCells(api) {
+  const sx = api.getState();
+  const visibleColumns = sx.columnsVisible.use();
+  const xPositions = sx.columnPositions.use();
+  const bounds = sx.internal.virtBounds.use();
+  const hierarchy = sx.columnGroupLevels.use();
+  const startCount = sx.columnVisibleStartCount.use();
+  const centerCount = sx.columnVisibleCenterCount.use();
+  const endCount = sx.columnVisibleEndCount.use();
+  const viewportWidth = sx.internal.viewportInnerWidth.use();
+  return useMemo(() => {
+    const cells = [];
+    const columnRowCount = hierarchy.length + 1;
+    function handleCell(i) {
+      const column = visibleColumns[i];
+      let rowStart = columnRowCount;
+      let level = columnRowCount - 2;
+      while (hierarchy[level]?.[i] === null) {
+        rowStart--;
+        level--;
+      }
+      cells.push(
+        /* @__PURE__ */ jsx(
+          HeaderCell,
+          {
+            api,
+            column,
+            columnIndex: i,
+            viewportWidth,
+            xPositions,
+            rowStart,
+            rowEnd: columnRowCount + 1,
+            startCount,
+            centerCount,
+            endCount
+          },
+          column.id
+        )
+      );
+    }
+    for (let i = 0; i < startCount; i++) {
+      handleCell(i);
+    }
+    for (let i = bounds.columnStart; i < bounds.columnEnd; i++) {
+      handleCell(i);
+    }
+    const first = startCount + centerCount;
+    for (let i = first; i < visibleColumns.length; i++) {
+      handleCell(i);
+    }
+    return cells;
+  }, [
+    api,
+    bounds.columnEnd,
+    bounds.columnStart,
+    centerCount,
+    endCount,
+    hierarchy,
+    startCount,
+    viewportWidth,
+    visibleColumns,
+    xPositions
+  ]);
+}
+function useResizeDivider(api, column) {
+  const isResizable = api.columnIsResizable(column);
+  const timeOutRef = useRef(null);
+  const dragStarted = useRef(false);
+  const resizeProps = useMemo(() => {
+    if (!isResizable) return {};
+    const onPointerDown = (e) => {
+      e.preventDefault();
+      const startWidth = api.columnVisualWidth(column);
+      const isRtl = api.getState().rtl.peek();
+      let startX = null;
+      let anim = null;
+      let delta = 0;
+      if (timeOutRef.current) clearTimeout(timeOutRef.current);
+      timeOutRef.current = setTimeout(() => {
+        dragStarted.current = true;
+        timeOutRef.current = null;
+      }, 100);
+      const controller = new AbortController();
+      document.addEventListener(
+        "pointermove",
+        (ev) => {
+          if (dragStarted.current === false) return;
+          if (startX === null) {
+            startX = getClientX(ev);
+            return;
+          }
+          const endAdjust = column.pin === "end" ? -1 : 1;
+          const rtlAdjust = isRtl ? -1 : 1;
+          delta = (getClientX(ev) - startX) * endAdjust * rtlAdjust;
+          if (anim) cancelAnimationFrame(anim);
+          anim = requestAnimationFrame(() => {
+            api.getState().internal.columnWidthDeltas.set({ [column.id]: delta });
+          });
+        },
+        { signal: controller.signal }
+      );
+      window.addEventListener(
+        "pointerup",
+        () => {
+          if (timeOutRef.current) clearTimeout(timeOutRef.current);
+          if (anim) cancelAnimationFrame(anim);
+          dragStarted.current = false;
+          const newWidth = startWidth + delta;
+          api.columnResize(column, newWidth);
+          api.getState().internal.columnWidthDeltas.set(null);
+          controller.abort();
+        },
+        { signal: controller.signal }
+      );
+    };
+    return { onPointerDown };
+  }, [api, column, isResizable]);
+  return resizeProps;
+}
+function HeaderDivider({
+  api,
+  columnIndex,
+  xPositions,
+  viewportWidth,
+  rowStart,
+  rowEnd,
+  column,
+  startCount,
+  centerCount,
+  endCount
+}) {
+  const isResizable = api.columnIsResizable(column);
+  const isLastStart = startCount > 0 && columnIndex === startCount - 1;
+  const isFirstEnd = endCount > 0 && startCount + centerCount === columnIndex;
+  const isLast = startCount + centerCount + endCount - 1 === columnIndex;
+  const resizeProps = useResizeDivider(api, column);
+  const rtl = api.getState().rtl.use();
+  const style = useMemo(() => {
+    const isStart = column.pin === "start";
+    const isEnd = column.pin == "end";
+    const endAdjustment = centerCount + startCount - 1 === columnIndex && endCount > 0 ? 2 : 0;
+    const x2 = isEnd ? xPositions[columnIndex] - xPositions.at(-1) + viewportWidth - 2 : xPositions[columnIndex] + sizeFromCoord(columnIndex, xPositions) - 3 - endAdjustment;
+    const xAdjustment = isLastStart ? 1 : isFirstEnd ? 0 : isLast ? 1 : 0;
+    const style2 = {
+      transform: getTransform((x2 - xAdjustment) * (rtl ? -1 : 1), 0),
+      gridRowStart: rowStart,
+      gridRowEnd: rowEnd
+    };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 2;
+    }
+    if (isLast && !isResizable) style2.opacity = 0;
+    return style2;
+  }, [
+    centerCount,
+    column.pin,
+    columnIndex,
+    endCount,
+    isFirstEnd,
+    isLast,
+    isLastStart,
+    isResizable,
+    rowEnd,
+    rowStart,
+    rtl,
+    startCount,
+    viewportWidth,
+    xPositions
+  ]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...resizeProps,
+      onDoubleClick: () => {
+        const autosize = api.getState().autosizeDoubleClickHeader.peek();
+        if (autosize) api.autosizeColumn(column, { includeHeader: true });
+      },
+      className: clsx(
+        "lng1771-header__cell-divider",
+        isResizable && "lng1771-header__cell-divider--resizable"
+      ),
+      style,
+      children: /* @__PURE__ */ jsx("div", {})
+    }
+  );
+}
+function useHeaderDividers(api) {
+  const sx = api.getState();
+  const xPositions = sx.columnPositions.use();
+  const hierarchy = sx.columnGroupLevels.use();
+  const viewportWidth = sx.internal.viewportInnerWidth.use();
+  const bounds = sx.internal.virtBounds.use();
+  const startCount = sx.columnVisibleStartCount.use();
+  const centerCount = sx.columnVisibleCenterCount.use();
+  const endCount = sx.columnVisibleEndCount.use();
+  const columns = sx.columnsVisible.use();
+  return useMemo(() => {
+    const firstEndIndex = xPositions.length - 1 - endCount;
+    const columnRowCount = hierarchy.length + 1;
+    const dividers = [];
+    const indices = Array.from(
+      { length: bounds.columnEnd - bounds.columnStart },
+      (_, i) => i + bounds.columnStart
+    );
+    for (let i = startCount - 1; i >= 0; i--) indices.unshift(i);
+    const first = startCount + centerCount;
+    for (let j = first; j < centerCount + startCount + endCount; j++) indices.push(j);
+    for (let i = 0; i < indices.length - endCount; i++) {
+      const columnIndex = indices[i];
+      const rowStart = getRowStart(hierarchy, startCount, firstEndIndex, columnIndex);
+      const column = columns[columnIndex];
+      dividers.push(
+        /* @__PURE__ */ jsx(
+          HeaderDivider,
+          {
+            api,
+            column,
+            xPositions,
+            viewportWidth,
+            rowStart,
+            rowEnd: columnRowCount + 1,
+            columnIndex,
+            startCount,
+            centerCount,
+            endCount
+          },
+          column.id
+        )
+      );
+    }
+    for (let i = indices.length - endCount; i < indices.length; i++) {
+      const columnIndex = indices[i];
+      const rowStart = getRowStart(hierarchy, startCount, firstEndIndex, columnIndex);
+      const column = columns[columnIndex];
+      dividers.push(
+        /* @__PURE__ */ jsx(
+          HeaderDivider,
+          {
+            api,
+            column,
+            xPositions,
+            viewportWidth,
+            rowStart,
+            rowEnd: columnRowCount + 1,
+            columnIndex,
+            startCount,
+            centerCount,
+            endCount
+          },
+          column.id
+        )
+      );
+    }
+    return dividers;
+  }, [
+    api,
+    bounds.columnEnd,
+    bounds.columnStart,
+    centerCount,
+    columns,
+    endCount,
+    hierarchy,
+    startCount,
+    viewportWidth,
+    xPositions
+  ]);
+}
+function isPartOfGroup(columnIndex, hierarchy) {
+  if (!hierarchy.length) return false;
+  return hierarchy.length > 0 && hierarchy[0][columnIndex] != null;
+}
+function getRowStart(hierarchy, startCount, firstEndIndex, columnIndex) {
+  const isFirstEndIndex = columnIndex === firstEndIndex;
+  const isLastStartIndex = columnIndex === startCount - 1 && startCount > 0;
+  const hasGroup = isPartOfGroup(columnIndex, hierarchy);
+  if (isFirstEndIndex || isLastStartIndex || !hasGroup) return 1;
+  let level = 0;
+  while (level < hierarchy.length && hierarchy[level][columnIndex] != null) {
+    level++;
+  }
+  while (hierarchy[level - 1]?.[columnIndex] && hierarchy[level - 1][columnIndex].end - 1 === columnIndex) {
+    level--;
+  }
+  return level + 1;
+}
+function useHeaderGroupMove(api, item, pin) {
+  const sx = api.getState();
+  const gridId = sx.gridId.use();
+  const visible = sx.columnsVisible.use();
+  const columns = useMemo(() => {
+    return visible.slice(item.start, item.end);
+  }, [item.end, item.start, visible]);
+  const move = useDraggable({
+    dragTags: () => [`${gridId}:grid:${pin ?? "none"}`],
+    dragData: () => ({ columns, columnIndex: item.start }),
+    placeholder: () => /* @__PURE__ */ jsx(
+      DragPlaceholder,
+      {
+        cnt: item.end - item.start,
+        label: item.id.split(sx.columnGroupIdDelimiter.peek()).at(-1)
+      }
+    )
+  });
+  const isMovable = columns.every((c) => api.columnIsMovable(c));
+  return { moveProps: isMovable ? move : {} };
+}
+function DragPlaceholder(c) {
+  return /* @__PURE__ */ jsxs("div", { className: "lng1771-drag-placeholder", children: [
+    c.label,
+    " | moving ",
+    c.cnt,
+    " columns"
+  ] });
+}
+function HeaderGroupCell({
+  api,
+  groupItem,
+  pin,
+  viewportWidth,
+  rowStart,
+  xPositions
+}) {
+  const rtl = api.getState().rtl.use();
+  const style = useMemo(() => {
+    const isStart = pin === "start";
+    const isEnd = pin == "end";
+    const width = sizeFromCoord(groupItem.start, xPositions, groupItem.end - groupItem.start);
+    const columnIndex = groupItem.start;
+    const x2 = isEnd ? xPositions[columnIndex] - xPositions.at(-1) + viewportWidth : xPositions[columnIndex];
+    const style2 = {
+      transform: getTransform(x2 * (rtl ? -1 : 1), 0),
+      gridRowStart: rowStart,
+      gridRowEnd: rowStart + 1,
+      width
+    };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 2;
+    }
+    return style2;
+  }, [groupItem.end, groupItem.start, pin, rowStart, rtl, viewportWidth, xPositions]);
+  const headerMove = useHeaderGroupMove(api, groupItem, pin);
+  const ref = useRef(null);
+  const skipRef = useRef(false);
+  useEffect(() => {
+    const sx = api.getState();
+    const position = sx.internal.navigatePosition;
+    const unsub = position.watch(() => {
+      const pos = position.peek();
+      if (!pos || !ref.current || pos.kind !== HEADER_GROUP_CELL_POSITION) return;
+      if (groupItem.start === pos.columnStartIndex && groupItem.end === pos.columnEndIndex && pos.hierarchyRowIndex === rowStart - 1 && !ref.current.contains(document.activeElement) && ref.current !== document.activeElement) {
+        api.navigateScrollIntoView(null, pos.columnIndex);
+        skipRef.current = true;
+        ref.current.focus();
+      }
+    });
+    return () => unsub();
+  }, [api, groupItem.end, groupItem.start, rowStart]);
+  const onFocus = useEvent(() => {
+    if (skipRef.current) {
+      skipRef.current = false;
+      return;
+    }
+    api.getState().internal.navigatePosition.set({
+      kind: HEADER_GROUP_CELL_POSITION,
+      columnStartIndex: groupItem.start,
+      columnEndIndex: groupItem.end,
+      columnIndex: groupItem.start,
+      hierarchyRowIndex: rowStart - 1
+    });
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      onFocus,
+      style,
+      "data-lng1771-group-id": groupItem.id,
+      "data-lng1771-kind": "header-group",
+      "aria-colindex": groupItem.start + 1,
+      "aria-colspan": groupItem.end - groupItem.start,
+      role: "columnheader",
+      tabIndex: -1,
+      ...headerMove.moveProps,
+      className: "lng1771-header__group",
+      children: /* @__PURE__ */ jsx(HeaderGroupDefault, { group: groupItem, api })
+    }
+  );
+}
+function HeaderGroupDefault({ group, api }) {
+  const label = useMemo(() => {
+    const delimiter = api.getState().columnGroupIdDelimiter.peek();
+    return group.id.split(delimiter).at(-1);
+  }, [api, group.id]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        alignItems: "center",
+        boxSizing: "border-box",
+        justifyContent: "space-between",
+        paddingInline: 12
+      },
+      children: [
+        label,
+        group.isCollapsible && /* @__PURE__ */ jsx(CollapseButton, { onClick: () => api.columnGroupToggle(group.id), children: "-" })
+      ]
+    }
+  );
+}
+function useHeaderGroupCells(api) {
+  const sx = api.getState();
+  const bounds = sx.internal.virtBounds.use();
+  const hierarchy = sx.columnGroupLevels.use();
+  const xPositions = sx.columnPositions.use();
+  const startCount = sx.columnVisibleStartCount.use();
+  const centerCount = sx.columnVisibleCenterCount.use();
+  const endCount = sx.columnVisibleEndCount.use();
+  const viewportWidth = sx.internal.viewportInnerWidth.use();
+  return useMemo(() => {
+    const cells = [];
+    function handleCell(groupItem, levelIndex, pin) {
+      cells.push(
+        /* @__PURE__ */ jsx(
+          HeaderGroupCell,
+          {
+            api,
+            groupItem,
+            pin,
+            rowStart: levelIndex + 1,
+            viewportWidth,
+            centerCount,
+            startCount,
+            endCount,
+            xPositions
+          },
+          groupItem.occurrenceKey
+        )
+      );
+    }
+    for (let level = 0; level < hierarchy.length; level++) {
+      const processedIndices = /* @__PURE__ */ new Set();
+      const row = hierarchy[level];
+      for (let i = 0; i < startCount; i++) {
+        const groupItem = row[i];
+        if (!groupItem) continue;
+        if (!processedIndices.has(i)) handleCell(groupItem, level, "start");
+        for (let j = groupItem.start; j < groupItem.end; j++) processedIndices.add(j);
+      }
+      for (let i = bounds.columnStart; i < bounds.columnEnd; i++) {
+        const groupItem = row[i];
+        if (!groupItem) continue;
+        if (!processedIndices.has(i)) handleCell(groupItem, level, null);
+        for (let j = groupItem.start; j < groupItem.end; j++) processedIndices.add(j);
+      }
+      const first = startCount + centerCount;
+      for (let i = first; i < row.length; i++) {
+        const groupItem = row[i];
+        if (!groupItem) continue;
+        if (!processedIndices.has(i)) handleCell(groupItem, level, "end");
+        for (let j = groupItem.start; j < groupItem.end; j++) processedIndices.add(j);
+      }
+    }
+    return cells;
+  }, [
+    api,
+    bounds.columnEnd,
+    bounds.columnStart,
+    centerCount,
+    endCount,
+    hierarchy,
+    startCount,
+    viewportWidth,
+    xPositions
+  ]);
+}
+function useFloatingFocus(api, ref, columnIndex) {
+  useEffect(() => {
+    const sx = api.getState();
+    const unsub = sx.internal.navigatePosition.watch(() => {
+      const position = sx.internal.navigatePosition.peek();
+      if (!ref.current || !position || position.kind !== FLOATING_CELL_POSITION) return;
+      if (position.columnIndex === columnIndex && !ref.current.contains(document.activeElement)) {
+        api.navigateScrollIntoView(null, columnIndex);
+        ref.current.focus();
+      }
+    });
+    return () => unsub();
+  }, [api, columnIndex, ref]);
+  const onFocus = useEvent(() => {
+    api.getState().internal.navigatePosition.set({ kind: FLOATING_CELL_POSITION, columnIndex });
+  });
+  return { onFocus };
+}
+function FloatingCell({
+  api,
+  viewportWidth,
+  column,
+  xPositions,
+  columnIndex,
+  rowStart,
+  startCount
+}) {
+  const isStart = column.pin === "start";
+  const isEnd = column.pin === "end";
+  const isLastStart = columnIndex === startCount - 1;
+  const rtl = api.getState().rtl.use();
+  const style = useMemo(() => {
+    const x2 = isEnd ? xPositions[columnIndex] - xPositions.at(-1) + viewportWidth : xPositions[columnIndex];
+    const width = sizeFromCoord(columnIndex, xPositions);
+    const style2 = {
+      transform: getTransform(x2 * (rtl ? -1 : 1), 0),
+      gridRowStart: rowStart,
+      gridRowEnd: rowStart + 1,
+      width
+    };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 2;
+    }
+    return style2;
+  }, [columnIndex, isEnd, isStart, rowStart, rtl, viewportWidth, xPositions]);
+  const sx = api.getState();
+  const base = sx.columnBase.use();
+  const rendererKey = column.floatingCellRenderer ?? base.floatingCellRenderer;
+  const renderers = sx.floatingCellRenderers.use();
+  const Component = useMemo(() => {
+    if (typeof rendererKey === "string") {
+      if (renderers[rendererKey])
+        throw new Error(`Failed to find floating renderer: ${rendererKey}`);
+      return renderers[rendererKey];
+    }
+    if (!rendererKey) return () => /* @__PURE__ */ jsx(Fragment, {});
+    return rendererKey;
+  }, [rendererKey, renderers]);
+  const ref = useRef(null);
+  const events = useFloatingFocus(api, ref, columnIndex);
+  const hide = api.columnIsGridGenerated(column) && !api.columnIsGroupAutoColumn(column);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      style,
+      ...events,
+      role: "columnheader",
+      "data-lng1771-kind": "floating",
+      "data-lng1771-pin": column.pin ?? "center",
+      "data-lng1771-last-start": isLastStart ? true : void 0,
+      "data-lng1771-column-id": column.id,
+      "aria-colindex": columnIndex,
+      "aria-colspan": 1,
+      tabIndex: -1,
+      className: "lng1771-header__cell-floating",
+      children: !hide && /* @__PURE__ */ jsx(Component, { api, column })
+    }
+  );
+}
+function useFloatingCells(api, enabled) {
+  const sx = api.getState();
+  const visibleColumns = sx.columnsVisible.use();
+  const xPositions = sx.columnPositions.use();
+  const bounds = sx.internal.virtBounds.use();
+  const hierarchy = sx.columnGroupLevels.use();
+  const startCount = sx.columnVisibleStartCount.use();
+  const centerCount = sx.columnVisibleCenterCount.use();
+  const endCount = sx.columnVisibleEndCount.use();
+  const viewportWidth = sx.internal.viewportInnerWidth.use();
+  return useMemo(() => {
+    if (!enabled) return [];
+    const cells = [];
+    const columnRowCount = hierarchy.length + 1;
+    function handleCell(i) {
+      const column = visibleColumns[i];
+      const rowStart = columnRowCount + 1;
+      cells.push(
+        /* @__PURE__ */ jsx(
+          FloatingCell,
+          {
+            api,
+            column,
+            columnIndex: i,
+            viewportWidth,
+            xPositions,
+            rowStart,
+            startCount,
+            centerCount,
+            endCount
+          },
+          column.id
+        )
+      );
+    }
+    for (let i = 0; i < startCount; i++) {
+      handleCell(i);
+    }
+    for (let i = bounds.columnStart; i < bounds.columnEnd; i++) {
+      handleCell(i);
+    }
+    const first = startCount + centerCount;
+    for (let i = first; i < visibleColumns.length; i++) {
+      handleCell(i);
+    }
+    return cells;
+  }, [
+    api,
+    bounds.columnEnd,
+    bounds.columnStart,
+    centerCount,
+    enabled,
+    endCount,
+    hierarchy.length,
+    startCount,
+    viewportWidth,
+    visibleColumns,
+    xPositions
+  ]);
+}
+function Header() {
+  const { state, api } = useGrid();
+  const columnHeaderHeight = state.columnHeaderHeight.use();
+  const columnGroupHeaderHeight = state.columnGroupHeaderHeight.use();
+  const floatingRowHeight = state.floatingRowHeight.use();
+  const floatingRowEnabled = state.floatingRowEnabled.use();
+  const hierarchy = state.columnGroupLevels.use();
+  const headerGroupCells = useHeaderGroupCells(api);
+  const headerCells = useHeaderCells(api);
+  const headerDividers = useHeaderDividers(api);
+  const floatingCells = useFloatingCells(api, floatingRowEnabled);
+  const gridTemplateRows = useHeaderDisplayGridTemplate(
+    hierarchy.length,
+    columnHeaderHeight,
+    columnGroupHeaderHeight,
+    floatingRowEnabled,
+    floatingRowHeight
+  );
+  const headerHeightSetting = state.internal.viewportHeaderHeight.use();
+  const headerHeight = useMemo(() => {
+    return `${headerHeightSetting - (floatingRowEnabled ? floatingRowHeight : 0)}px`;
+  }, [floatingRowEnabled, floatingRowHeight, headerHeightSetting]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "row",
+      className: "lng1771-header",
+      style: { gridTemplateRows, "--lng1771-header-height": headerHeight },
+      children: [
+        headerGroupCells,
+        headerCells,
+        headerDividers,
+        floatingCells
+      ]
+    }
+  );
+}
+function HeaderContainer({ style }) {
+  const { state } = useGrid();
+  const [header, setHeader] = useState(null);
+  useIsoEffect(() => {
+    if (!header) return;
+    const resize = new IsoResizeObserver(() => {
+      if (!header) return;
+      const prec = getPreciseElementDimensions(header);
+      state.internal.viewportHeaderHeight.set(prec.outerHeight);
+    });
+    resize.observe(header);
+    return () => resize.disconnect();
+  }, [header]);
+  return /* @__PURE__ */ jsx("div", { ref: setHeader, className: "lng1771-header-container", style, children: /* @__PURE__ */ jsx(Header, {}) });
+}
+function RowDetail({ api, row, rowPin, yPositions, rowIndex, height }) {
+  const sx = api.getState();
+  const width = sx.internal.viewportInnerWidth.use();
+  const Renderer = sx.rowDetailRenderer.use() ?? RowDetailDefault;
+  const style = useMemo(() => {
+    const isTop = rowPin === "top";
+    const isBot = rowPin === "bottom";
+    const rowCount = sx.internal.rowCount.peek();
+    const rowTopCount = sx.internal.rowTopCount.peek();
+    const rowBotCount = sx.internal.rowBottomCount.peek();
+    const firstBotIndex = rowCount - rowBotCount;
+    const offset = sizeFromCoord(rowIndex, yPositions) - height;
+    const y2 = isBot ? yPositions[rowIndex] - yPositions[firstBotIndex] : isTop ? yPositions[rowIndex] : yPositions[rowIndex] - yPositions[rowTopCount];
+    const transform = getTransform(0, y2 + offset);
+    return { width, height, transform };
+  }, [
+    height,
+    rowIndex,
+    rowPin,
+    sx.internal.rowBottomCount,
+    sx.internal.rowCount,
+    sx.internal.rowTopCount,
+    width,
+    yPositions
+  ]);
+  return /* @__PURE__ */ jsx("div", { style, className: "lng1771-row-detail", children: /* @__PURE__ */ jsx(Renderer, { api, row }) });
+}
+function RowDetailDefault() {
+  return /* @__PURE__ */ jsx("div", { children: "Not Implemented" });
+}
+function RowDragIndicator({ section }) {
+  const { state } = useGrid();
+  const rowIndex = state.internal.rowDragOverIndex.use();
+  const dragIndex = state.internal.rowDragStartIndex.use();
+  const yPositions = state.internal.rowPositions.use();
+  const width = state.internal.viewportInnerWidth.use();
+  const topCount = state.internal.rowTopCount.use();
+  const bottomCount = state.internal.rowBottomCount.use();
+  const rowCount = state.internal.rowCount.use();
+  const isBefore = rowIndex < dragIndex;
+  if (rowIndex === -1 || rowIndex == null) return null;
+  if (section === "top" && rowIndex > topCount) return null;
+  if (section === "center" && rowIndex < topCount || rowIndex >= rowCount - bottomCount)
+    return null;
+  if (section === "bottom" && rowIndex < rowCount - bottomCount) return null;
+  const firstBotIndex = rowCount - bottomCount;
+  const height = sizeFromCoord(rowIndex, yPositions);
+  const y2 = section === "bottom" ? yPositions[rowIndex] - yPositions[firstBotIndex] : section === "top" ? yPositions[rowIndex] : yPositions[rowIndex] - yPositions[topCount];
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: { transform: getTransform(0, y2 + (isBefore ? 0 : height)), width },
+      className: "lng1771-row-drag-indicator"
+    }
+  );
+}
+function Rows({
+  width,
+  ...els
+}) {
+  const { state, api } = useGrid();
+  const layout = state.internal.virtLayout.use();
+  const xPositions = state.columnPositions.use();
+  const yPositions = state.internal.rowPositions.use();
+  const columns = state.columnsVisible.use();
+  const refreshKey = state.internal.rowRefreshCount.use();
+  const headerHeight = state.internal.viewportHeaderHeight.use();
+  const rowCount = state.internal.rowCount.use();
+  const topCount = state.internal.rowTopCount.use();
+  const botCount = state.internal.rowBottomCount.use();
+  const topHeight = yPositions[topCount];
+  const botHeight = yPositions.at(-1) - yPositions[rowCount - botCount];
+  const detailHeight = state.internal.rowDetailHeight.use();
+  const [fullWidthCache, cellCache] = useMemo(() => {
+    return [{}, {}];
+  }, [botCount, columns, headerHeight, refreshKey, rowCount, topCount, xPositions, yPositions]);
+  const firstBotIndex = rowCount - botCount;
+  const paginate = state.paginate.use();
+  const currentPage = state.paginateCurrentPage.use();
+  const [top, center, bottom] = useMemo(() => {
+    const top2 = [];
+    const center2 = [];
+    const bottom2 = [];
+    let paginateOffset = 0;
+    if (paginate) {
+      const [rowStart] = api.paginateRowStartAndEndForPage(currentPage);
+      paginateOffset = yPositions[rowStart];
+    }
+    for (const [rowIndex, cells] of layout) {
+      if (rowIndex >= rowCount) continue;
+      const isTop = rowIndex < topCount;
+      const isBot = rowIndex >= firstBotIndex;
+      const isCenter = !isTop && !isBot;
+      const place = isCenter ? center2 : isTop ? top2 : bottom2;
+      const row = api.rowByIndex(rowIndex);
+      if (!row) continue;
+      let i = 0;
+      while (i < cells.length) {
+        const encoding = cells[i];
+        if (encoding === FULL_ENCODING) {
+          fullWidthCache[rowIndex] ??= /* @__PURE__ */ jsx(
+            CellFullWidth,
+            {
+              api,
+              row,
+              colCount: columns.length,
+              rowPin: rowIndex < topCount ? "top" : rowIndex >= firstBotIndex ? "bottom" : null,
+              rowIndex,
+              yPositions,
+              paginateOffset
+            },
+            `${rowIndex}-full`
+          );
+          place.push(fullWidthCache[rowIndex]);
+          i++;
+        } else if (encoding === END_ENCODING) {
+          break;
+        } else {
+          const rowIndex2 = cells[i++];
+          const rowSpan = cells[i++];
+          const colIndex = cells[i++];
+          const colSpan = cells[i++];
+          cellCache[rowIndex2] ??= {};
+          cellCache[rowIndex2][colIndex] = /* @__PURE__ */ jsx(
+            Cell,
+            {
+              api,
+              column: columns[colIndex],
+              rowIndex: rowIndex2,
+              rowSpan,
+              colSpan,
+              rowPin: rowIndex2 < topCount ? "top" : rowIndex2 >= firstBotIndex ? "bottom" : null,
+              rowNode: row,
+              columnIndex: colIndex,
+              yPositions,
+              xPositions,
+              paginateOffset
+            },
+            `r${rowIndex2}-c${colIndex}`
+          );
+          place.push(cellCache[rowIndex2][colIndex]);
+        }
+      }
+      const rowDetailHeight = detailHeight(rowIndex);
+      if (rowDetailHeight > 0) {
+        place.push(
+          /* @__PURE__ */ jsx(
+            RowDetail,
+            {
+              api,
+              height: rowDetailHeight,
+              row,
+              rowPin: rowIndex < topCount ? "top" : rowIndex >= firstBotIndex ? "bottom" : null,
+              rowIndex,
+              yPositions
+            }
+          )
+        );
+      }
+    }
+    return [top2, center2, bottom2];
+  }, [
+    api,
+    cellCache,
+    columns,
+    currentPage,
+    detailHeight,
+    firstBotIndex,
+    fullWidthCache,
+    layout,
+    paginate,
+    rowCount,
+    topCount,
+    xPositions,
+    yPositions
+  ]);
+  const viewportWidth = state.internal.viewportInnerWidth.use();
+  const endCount = state.columnVisibleEndCount.use();
+  const minWidth = Math.max(endCount > 0 ? viewportWidth : 0, width);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    topHeight > 0 && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: {
+          width,
+          minWidth,
+          top: headerHeight,
+          height: topHeight,
+          minHeight: topHeight,
+          maxHeight: topHeight
+        },
+        className: "lng1771-rows__top-section",
+        children: [
+          top,
+          /* @__PURE__ */ jsx(RowDragIndicator, { section: "top" }),
+          /* @__PURE__ */ jsx(els.top, {})
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: {
+          width,
+          minWidth
+        },
+        className: "lng1771-rows__center-section",
+        children: [
+          center,
+          /* @__PURE__ */ jsx(RowDragIndicator, { section: "center" }),
+          /* @__PURE__ */ jsx(els.center, {})
+        ]
+      }
+    ),
+    botHeight > 0 && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: {
+          bottom: 0,
+          width,
+          minWidth,
+          height: botHeight,
+          minHeight: botHeight,
+          maxHeight: botHeight
+        },
+        className: "lng1771-rows__bottom-section",
+        children: [
+          bottom,
+          /* @__PURE__ */ jsx(RowDragIndicator, { section: "bottom" }),
+          /* @__PURE__ */ jsx(els.bottom, {})
+        ]
+      }
+    )
+  ] });
+}
+function RowContainer({
+  totalHeight,
+  totalWidth,
+  children
+}) {
+  const { api, state } = useGrid();
+  const gridId = state.gridId.use();
+  const { onDragOver, onDrop } = useDroppable({
+    tags: [`${gridId}:row-drag`],
+    onDrop: (p2) => {
+      const overIndex = state.internal.rowDragOverIndex.peek();
+      const data = p2.getData();
+      if (!data?.rows || !data?.api) return;
+      const isExternal = data.api !== api;
+      const additional = isExternal ? { externalGridApi: data.api, isExternal: true } : {};
+      api.eventFire("onRowDragDrop", {
+        api,
+        event: p2.event,
+        overIndex,
+        rows: data.rows,
+        ...additional
+      });
+    }
+  });
+  const columns = state.columnsVisible.use();
+  if (columns.length === 0) return /* @__PURE__ */ jsx(Fragment, {});
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: { width: totalWidth, minHeight: totalHeight },
+      onDrop,
+      onDragOver,
+      className: "lng1771-row-container",
+      children
+    }
+  );
+}
+function NavigationDriver() {
+  const { state, api } = useGrid();
+  const viewport = state.internal.viewport.use();
+  const rtl = state.rtl.use();
+  useEffect(() => {
+    if (!viewport) return;
+    const controller = new AbortController();
+    viewport.addEventListener(
+      "keydown",
+      (ev) => {
+        const key = ev.key;
+        const startDir = rtl ? "ArrowRight" : "ArrowLeft";
+        const endDir = rtl ? "ArrowLeft" : "ArrowRight";
+        const position = state.internal.navigatePosition.peek();
+        const activeEdit = state.internal.cellEditActiveLocation.peek();
+        if (activeEdit || ev.shiftKey) return;
+        if (document.activeElement === viewport && (key === "ArrowDown" || key === endDir)) {
+          if (state.columnsVisible.peek().length) {
+            state.internal.navigatePosition.set({ kind: HEADER_CELL_POSITION, columnIndex: 0 });
+          }
+          ev.preventDefault();
+          ev.stopPropagation();
+        }
+        if (!position) return;
+        let handled = false;
+        const meta = ev.ctrlKey || ev.metaKey;
+        if (key === "PageUp") {
+          api.navigatePageUp();
+          handled = true;
+        } else if (key === "PageDown") {
+          api.navigatePageDown();
+          handled = true;
+        } else if (key === "Home") {
+          api.navigateToTop();
+          handled = true;
+        } else if (key === "End") {
+          api.navigateToBottom();
+          handled = true;
+        } else if (key === "ArrowUp") {
+          if (meta) {
+            api.navigateToTop();
+          } else {
+            api.navigateUp();
+          }
+          handled = true;
+        } else if (key === "ArrowDown") {
+          if (meta) {
+            api.navigateToBottom();
+          } else {
+            api.navigateDown();
+          }
+          handled = true;
+        } else if (key === startDir) {
+          if (meta) {
+            api.navigateToStart();
+          } else {
+            api.navigatePrev();
+          }
+          handled = true;
+        } else if (key === endDir) {
+          if (meta) {
+            api.navigateToEnd();
+          } else {
+            api.navigateNext();
+          }
+          handled = true;
+        }
+        if (handled) {
+          ev.preventDefault();
+          ev.stopPropagation();
+        }
+      },
+      { signal: controller.signal }
+    );
+    const unsub = state.internal.navigatePosition.watch(() => {
+      const position = state.internal.navigatePosition.peek();
+      if (!position) return;
+      const rowIndex = "rowIndex" in position ? position.rowIndex : null;
+      const columnIndex = position.columnIndex;
+      api.navigateScrollIntoView(rowIndex, columnIndex);
+    });
+    viewport.addEventListener(
+      "focusout",
+      () => {
+        setTimeout(() => {
+          if (viewport.contains(document.activeElement)) {
+            return;
+          }
+          api.getState().internal.navigatePosition.set(null);
+        }, 100);
+      },
+      { signal: controller.signal }
+    );
+    return () => {
+      controller.abort();
+      unsub();
+    };
+  }, [
+    api,
+    rtl,
+    state.columnsVisible,
+    state.internal.cellEditActiveLocation,
+    state.internal.navigatePosition,
+    viewport
+  ]);
+  return /* @__PURE__ */ jsx(Fragment, {});
+}
+function cellEditLocation(c) {
+  return `r${c.rowIndex}-c${c.columnIndex}`;
+}
+function handleBeginCellEditFromEvent(api, event) {
+  if (event.button !== 0) return;
+  const clientY = getClientY(event);
+  const clientX = getClientX(event);
+  const rowIndex = getHoveredRowIndex(api, clientY);
+  const columnIndex = getHoveredColumnIndex(api, clientX);
+  if (rowIndex == null || columnIndex == null) return;
+  const sx = api.getState();
+  const active = sx.internal.cellEditActiveEdits.peek();
+  const l = { rowIndex, columnIndex };
+  const key = cellEditLocation(l);
+  if (active.has(key)) return;
+  api.cellEditBegin(l, true);
+}
+function CellEditDriver() {
+  const { state, api } = useGrid();
+  const viewport = state.internal.viewport.use();
+  const cellEditActivator = state.cellEditPointerActivator.use();
+  useEffect(() => {
+    if (!viewport) return;
+    const controller = new AbortController();
+    const signal2 = controller.signal;
+    if (cellEditActivator === "single-click") {
+      viewport.addEventListener("pointerdown", (ev) => handleBeginCellEditFromEvent(api, ev), {
+        signal: signal2
+      });
+    }
+    if (cellEditActivator === "double-click") {
+      viewport.addEventListener(
+        "dblclick",
+        (ev) => {
+          if (state.internal.cellEditActiveEdits.peek().size > 0) return;
+          handleBeginCellEditFromEvent(api, ev);
+        },
+        { signal: signal2 }
+      );
+    }
+    return () => controller.abort();
+  }, [
+    api,
+    cellEditActivator,
+    state.columnsVisible,
+    state.internal.cellEditActiveEdits,
+    state.internal.cellEditActiveLocation,
+    viewport
+  ]);
+  return /* @__PURE__ */ jsx(Fragment, {});
+}
+function RowHoverDriver() {
+  const s3 = useGrid();
+  const gridId = s3.state.gridId.use();
+  const hoveredRow = s3.state.internal.hoveredRow.use();
+  if (hoveredRow == null) return;
+  return /* @__PURE__ */ jsx("style", { children: `
+      #${gridId} > div > div > [aria-rowindex="${hoveredRow + 1}"] {
+        background-color: var(--lng1771-gray-10);
+      }
+  ` });
+}
+function Viewport({
+  children,
+  ...els
+}) {
+  const { state } = useGrid();
+  const onSizeChange = useEvent((size) => {
+    state.internal.viewportInnerHeight.set(size.innerHeight);
+    state.internal.viewportInnerWidth.set(size.innerWidth);
+    state.internal.viewportOuterWidth.set(size.outerWidth);
+    state.internal.viewportOuterHeight.set(size.outerHeight);
+    const el = state.internal.viewport.peek();
+    if (el) {
+      state.internal.viewportXScroll.set(Math.abs(el.scrollLeft));
+      state.internal.viewportYScroll.set(Math.abs(el.scrollTop));
+      state.internal.viewportInnerWidth.set(el.clientWidth);
+      state.internal.viewportInnerHeight.set(el.clientHeight);
+    }
+  });
+  const onInit = useEvent((_, size) => {
+    onSizeChange(size);
+  });
+  const onScroll = useEvent(() => {
+    const viewport = state.internal.viewport.peek();
+    if (!viewport) return;
+    state.internal.viewportXScroll.set(Math.abs(viewport.scrollLeft));
+    state.internal.viewportYScroll.set(Math.abs(viewport.scrollTop));
+  });
+  const ref = useEvent((el) => {
+    state.internal.viewport.set(el);
+  });
+  const paginate = state.paginate.use();
+  const totalHeight = paginate ? void 0 : state.internal.rowPositions.use().at(-1);
+  const totalWidth = state.columnPositions.use().at(-1);
+  const rtl = state.rtl.use();
+  const grid = state.gridId.use();
+  return /* @__PURE__ */ jsxs(
+    Sizer,
+    {
+      onInit,
+      onSizeChange,
+      onScroll,
+      elRef: ref,
+      style: { direction: rtl ? "rtl" : void 0 },
+      id: grid,
+      className: "lng1771-viewport",
+      children: [
+        /* @__PURE__ */ jsx(HeaderContainer, { style: { width: totalWidth } }),
+        /* @__PURE__ */ jsx(RowContainer, { totalHeight, totalWidth, children: /* @__PURE__ */ jsx(Rows, { width: totalWidth, ...els }) }),
+        /* @__PURE__ */ jsx(NavigationDriver, {}),
+        /* @__PURE__ */ jsx(CellEditDriver, {}),
+        /* @__PURE__ */ jsx(RowHoverDriver, {}),
+        children
+      ]
+    }
+  );
+}
+function getEditRows(locations, predicate) {
+  const validLocations = Object.groupBy(
+    [...locations].filter(([_, l]) => predicate(l)).map(([_, l]) => l),
+    (l) => l.rowIndex
+  );
+  return Object.entries(validLocations);
+}
+function TextEditor({
+  value,
+  setValue,
+  isValid,
+  column
+}) {
+  const opts = column.cellEditParams ?? {};
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      error: !isValid,
+      maxLength: opts.maxLength,
+      className: "lng1771-cell__edit-input",
+      value: `${value}`,
+      onChange: (event) => setValue(event.target.value)
+    }
+  );
+}
+function NumberEditor({
+  value,
+  setValue,
+  isValid,
+  column
+}) {
+  const opts = column.cellEditParams ?? {};
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      type: "number",
+      min: opts.min,
+      max: opts.max,
+      step: opts.step,
+      error: !isValid,
+      className: "lng1771-cell__edit-input",
+      value: `${value ?? ""}`,
+      onChange: (event) => setValue(Number.parseFloat(event.target.value))
+    }
+  );
+}
+function DateEditor({
+  value,
+  setValue,
+  isValid,
+  column
+}) {
+  const opts = column.cellEditParams ?? {};
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      type: "date",
+      className: "lng1771-cell__edit-input",
+      error: !isValid,
+      min: opts.min,
+      max: opts.max,
+      value: String(value),
+      onChange: (event) => setValue(event.target.value)
+    }
+  );
+}
+function getBuiltInEditorForType(c) {
+  if (c.type === "number") return "number";
+  if (c.type === "date") return "date";
+  return "text";
+}
+function getCellEditor(api, c, base) {
+  const editor = c.cellEditProvider ?? base.cellEditProvider ?? getBuiltInEditorForType(c);
+  if (typeof editor === "string") {
+    if (editor === "text") return TextEditor;
+    if (editor === "date") return DateEditor;
+    if (editor === "number") return NumberEditor;
+    const cell = api.getState().cellEditProviders.peek()[editor];
+    if (!cell) throw new Error(`No cell editor with id: ${editor} found.`);
+    return cell;
+  }
+  return editor;
+}
+function useCellEditStyle(column, xPositions, yPositions, location) {
+  const { state, api } = useGrid();
+  const vpWidth = state.internal.viewportInnerWidth.use();
+  const rtl = state.rtl.use();
+  const style = useMemo(() => {
+    const isStart = column.pin === "start";
+    const isEnd = column.pin === "end";
+    const root = getRootCell(api, location.rowIndex, location.columnIndex);
+    const rowIndex = root?.rowIndex ?? location.rowIndex;
+    const colIndex = root?.columnIndex ?? location.columnIndex;
+    const rowSpan = root?.rowSpan ?? 1;
+    const colSpan = root?.columnSpan ?? 1;
+    const x2 = isEnd ? xPositions[colIndex] - xPositions.at(-1) + vpWidth : xPositions[colIndex];
+    const height = sizeFromCoord(rowIndex, yPositions, rowSpan);
+    const width = sizeFromCoord(colIndex, xPositions, colSpan);
+    const rowCount = state.internal.rowCount.peek();
+    const rowTopCount = state.internal.rowTopCount.peek();
+    const rowBotCount = state.internal.rowBottomCount.peek();
+    const firstBotIndex = rowCount - rowBotCount;
+    const isTop = rowIndex < rowTopCount;
+    const isBot = rowIndex >= rowCount - rowBotCount;
+    let paginateOffset = 0;
+    if (state.paginate.peek()) {
+      const [rowStart] = api.paginateRowStartAndEndForPage(state.paginateCurrentPage.peek());
+      paginateOffset = yPositions[rowStart];
+    }
+    const y2 = isBot ? yPositions[rowIndex] - yPositions[firstBotIndex] : isTop ? yPositions[rowIndex] : yPositions[rowIndex] - yPositions[rowTopCount] - paginateOffset;
+    const transform = getTransform(x2 * (rtl ? -1 : 1), y2);
+    const style2 = { width, height, transform, zIndex: 3 };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 5;
+    }
+    return style2;
+  }, [
+    api,
+    column.pin,
+    location.columnIndex,
+    location.rowIndex,
+    rtl,
+    state.internal.rowBottomCount,
+    state.internal.rowCount,
+    state.internal.rowTopCount,
+    state.paginate,
+    state.paginateCurrentPage,
+    vpWidth,
+    xPositions,
+    yPositions
+  ]);
+  return style;
+}
+function useCellEditNavigation(api, location) {
+  const onKeyDown = useEvent((ev) => {
+    const sx = api.getState();
+    let handled = false;
+    if (ev.key === "Escape") {
+      api.cellEditEnd(location);
+      handled = true;
+      sx.internal.cellFocusQueue.set({
+        kind: "cell",
+        columnIndex: location.columnIndex,
+        rowIndex: location.rowIndex
+      });
+    }
+    const meta = ev.ctrlKey || ev.metaKey;
+    if (ev.key === "Enter" && !meta) {
+      const visible = sx.columnsVisible.peek();
+      const columnIndex = location.columnIndex;
+      const rowCount = sx.internal.rowCount.peek();
+      let nextLocal = null;
+      let currentRow = location.rowIndex;
+      do {
+        if (currentRow >= rowCount) break;
+        const root = getRootCell(api, currentRow, columnIndex);
+        currentRow = root ? root.rowIndex + root.rowSpan : currentRow + 1;
+        const row = api.rowByIndex(currentRow);
+        const isFull = sx.internal.rowIsFullWidthInternal.peek()(currentRow);
+        if (!row) break;
+        if (api.cellEditPredicate(row, visible[columnIndex]) && !isFull) {
+          nextLocal = { rowIndex: currentRow, columnIndex };
+          break;
+        }
+      } while (true);
+      if (!nextLocal) {
+        api.cellEditEnd(location);
+        sx.internal.cellFocusQueue.set({
+          kind: "cell",
+          columnIndex: location.columnIndex,
+          rowIndex: location.rowIndex
+        });
+        handled = true;
+      } else {
+        api.navigateScrollIntoView(nextLocal.rowIndex, nextLocal.columnIndex);
+        api.cellEditBegin(nextLocal, true);
+        handled = true;
+      }
+    }
+    if (ev.key === "Enter" && meta) {
+      api.cellEditEnd(location);
+      sx.internal.cellFocusQueue.set({
+        kind: "cell",
+        columnIndex: location.columnIndex,
+        rowIndex: location.rowIndex
+      });
+    }
+    if (ev.key === "Tab") {
+      const visible = sx.columnsVisible.peek();
+      const row = api.rowByIndex(location.rowIndex);
+      if (!row) return;
+      const indices = visible.map((c, i) => api.cellEditPredicate(row, c) ? i : null).filter((c) => c !== null);
+      const check = ev.shiftKey ? Math.min(...indices) : Math.max(...indices);
+      if (check === location.columnIndex) {
+        handled = true;
+      } else {
+        const currentIndex = indices.findIndex((c) => c === location.columnIndex);
+        const next = ev.shiftKey ? indices[currentIndex - 1] : indices[currentIndex + 1];
+        const nextLocation = { rowIndex: location.rowIndex, columnIndex: next };
+        api.navigateScrollIntoView(nextLocation.rowIndex, nextLocation.columnIndex);
+        api.cellEditBegin(nextLocation, true);
+      }
+    }
+    if (handled) {
+      ev.preventDefault();
+      ev.stopPropagation();
+    }
+  });
+  return onKeyDown;
+}
+function CellEditorCell({
+  column,
+  row,
+  xPositions,
+  yPositions,
+  location,
+  isActive
+}) {
+  const { state, api } = useGrid();
+  const style = useCellEditStyle(column, xPositions, yPositions, location);
+  const Renderer = getCellEditor(api, column, state.columnBase.use());
+  const values = state.internal.cellEditActiveEditValues.use();
+  const value = values.get(cellEditLocation(location));
+  const autoFocus = useCallback(
+    (el) => {
+      if (!isActive || !el) return;
+      const focusable = getFocusableElements(el)[0];
+      if (!focusable) return;
+      setTimeout(() => {
+        if (el.contains(document.activeElement)) return;
+        focusable.focus();
+      }, 20);
+    },
+    [isActive]
+  );
+  const setValue = useCallback(
+    (v2) => {
+      api.cellEditSetValue(location, v2);
+    },
+    [api, location]
+  );
+  const onKeyDown = useCellEditNavigation(api, location);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: autoFocus,
+      style,
+      className: "lng1771-cell__edit",
+      onFocus: () => {
+        state.internal.cellEditActiveLocation.set(location);
+      },
+      onBlur: () => {
+        if (state.internal.cellEditActiveEdits.peek().has(cellEditLocation(location)))
+          api.cellEditEnd(location);
+        state.internal.cellEditActiveLocation.set(null);
+      },
+      onKeyDown,
+      children: /* @__PURE__ */ jsx(
+        Renderer,
+        {
+          api,
+          column,
+          row,
+          value,
+          setValue,
+          isValid: api.cellEditIsValueValid(location)
+        }
+      )
+    }
+  );
+}
+function CellEditorRow({ locations }) {
+  const rowIndex = locations[0].rowIndex;
+  const { state: s3, api } = useGrid();
+  const xPositions = s3.columnPositions.use();
+  const yPositions = s3.internal.rowPositions.use();
+  const active = s3.internal.cellEditActiveLocation.use();
+  const row = api.rowByIndex(rowIndex);
+  const columns = s3.columnsVisible.use();
+  if (!row) return null;
+  return /* @__PURE__ */ jsx(Fragment, { children: locations.map((l) => {
+    const columnIndex = l.columnIndex;
+    const column = columns[columnIndex];
+    return /* @__PURE__ */ jsx(
+      CellEditorCell,
+      {
+        location: l,
+        isActive: l.rowIndex === active?.rowIndex && l.columnIndex === active.columnIndex,
+        column,
+        row,
+        xPositions,
+        yPositions
+      },
+      column.id
+    );
+  }) });
+}
+function CellEditorTop() {
+  const { state } = useGrid();
+  const p2 = state.internal.cellEditActiveEdits.use();
+  const topCount = state.internal.rowTopCount.use();
+  const locations = useMemo(() => {
+    return getEditRows(p2, (l) => l.rowIndex < topCount);
+  }, [p2, topCount]);
+  return /* @__PURE__ */ jsx(Fragment, { children: locations.map(([key, locations2]) => {
+    return /* @__PURE__ */ jsx(CellEditorRow, { locations: locations2 }, key);
+  }) });
+}
+function CellEditorCenter() {
+  const { state } = useGrid();
+  const yPositions = state.internal.rowPositions.use();
+  const topCount = state.internal.rowTopCount.use();
+  const p2 = state.internal.cellEditActiveEdits.use();
+  const botCount = state.internal.rowBottomCount.use();
+  const firstBotIndex = yPositions.length - 1 - botCount;
+  const locations = useMemo(() => {
+    return getEditRows(p2, (l) => l.rowIndex >= topCount && l.rowIndex < firstBotIndex);
+  }, [firstBotIndex, p2, topCount]);
+  return /* @__PURE__ */ jsx(Fragment, { children: locations.map(([key, locations2]) => {
+    return /* @__PURE__ */ jsx(CellEditorRow, { locations: locations2 }, key);
+  }) });
+}
+function CellEditorBottom() {
+  const { state } = useGrid();
+  const yPositions = state.internal.rowPositions.use();
+  const p2 = state.internal.cellEditActiveEdits.use();
+  const botCount = state.internal.rowBottomCount.use();
+  const firstBotIndex = yPositions.length - 1 - botCount;
+  const locations = useMemo(() => {
+    return getEditRows(p2, (l) => l.rowIndex >= firstBotIndex);
+  }, [firstBotIndex, p2]);
+  return /* @__PURE__ */ jsx(Fragment, { children: locations.map(([key, locations2]) => {
+    return /* @__PURE__ */ jsx(CellEditorRow, { locations: locations2 }, key);
+  }) });
+}
+function useEdgeScroll(api) {
+  const intervalIdX = useRef(null);
+  const intervalIdY = useRef(null);
+  const cancelX = useCallback(() => {
+    if (intervalIdX.current) {
+      clearInterval(intervalIdX.current);
+      intervalIdX.current = null;
+    }
+  }, []);
+  const cancelY = useCallback(() => {
+    if (intervalIdY.current) {
+      clearInterval(intervalIdY.current);
+      intervalIdY.current = null;
+    }
+  }, []);
+  const edgeScrollY = useCallback(
+    (visualPositionY) => {
+      const s3 = api.getState();
+      const viewportClientHeight = s3.internal.viewportInnerHeight.peek();
+      const viewport = s3.internal.viewport.peek();
+      const viewportHeight = Math.min(viewportClientHeight * 0.1, 100);
+      const buffer = viewportHeight;
+      const topBound = buffer + s3.internal.viewportHeaderHeight.peek();
+      const botBound = viewportClientHeight - buffer;
+      const speed = 3;
+      if (visualPositionY < topBound && !intervalIdY.current) {
+        intervalIdY.current = setInterval(() => {
+          viewport.scrollBy({ top: -speed });
+        }, 6);
+      } else if (visualPositionY > botBound && !intervalIdY.current) {
+        intervalIdY.current = setInterval(() => {
+          viewport.scrollBy({ top: speed });
+        }, 6);
+      }
+      if (intervalIdY.current && visualPositionY > topBound && visualPositionY < botBound) {
+        cancelY();
+      }
+    },
+    [api, cancelY]
+  );
+  const edgeScrollX = useCallback(
+    (visualPositionX, isRtl) => {
+      const s3 = api.getState();
+      const viewportClientWidth = s3.internal.viewportInnerWidth.peek();
+      const viewport = s3.internal.viewport.peek();
+      const viewportWidth = Math.min(viewportClientWidth * 0.1, 100);
+      const buffer = viewportWidth;
+      const leftBound = buffer;
+      const rightBound = viewportClientWidth - buffer;
+      const speed = 3;
+      if (visualPositionX < leftBound && !intervalIdX.current) {
+        intervalIdX.current = setInterval(() => {
+          viewport.scrollBy({ left: isRtl ? speed : -speed });
+        }, 6);
+      } else if (visualPositionX > rightBound && !intervalIdX.current) {
+        intervalIdX.current = setInterval(() => {
+          viewport.scrollBy({ left: isRtl ? -speed : speed });
+        }, 6);
+      }
+      if (intervalIdX.current && visualPositionX > leftBound && visualPositionX < rightBound) {
+        cancelX();
+      }
+    },
+    [api, cancelX]
+  );
+  return { cancelX, edgeScrollX, cancelY, edgeScrollY };
+}
+function splitCellSelectionRect({
+  rect,
+  colStartCount,
+  colCenterCount,
+  rowTopCount,
+  rowCenterCount
+}) {
+  const colStartBound = colStartCount;
+  const colEndBound = colStartCount + colCenterCount;
+  const colSplits = [];
+  if (rect.columnStart < colStartBound && rect.columnEnd > colStartBound) {
+    const startSplit = {
+      ...rect,
+      columnEnd: colStartBound
+    };
+    colSplits.push(startSplit);
+    rect = { ...rect, columnStart: colStartBound };
+  }
+  if (rect.columnStart < colEndBound && rect.columnEnd > colEndBound) {
+    const endSplit = {
+      ...rect,
+      columnStart: colEndBound
+    };
+    rect = { ...rect, columnEnd: colEndBound };
+    colSplits.push(endSplit);
+  }
+  colSplits.push(rect);
+  const topBound = rowTopCount;
+  const bottomBound = rowTopCount + rowCenterCount;
+  const rowSplits = [];
+  for (let split of colSplits) {
+    if (split.rowStart < topBound && split.rowEnd > topBound) {
+      const topSplit = { ...split, rowEnd: topBound };
+      split = { ...split, rowStart: topBound };
+      rowSplits.push(topSplit);
+    }
+    if (split.rowStart < bottomBound && split.rowEnd > bottomBound) {
+      const bottomSplit = { ...split, rowStart: bottomBound };
+      split = { ...split, rowEnd: bottomBound };
+      rowSplits.push(bottomSplit);
+    }
+    rowSplits.push(split);
+  }
+  return rowSplits.sort((l, r2) => {
+    return l.rowStart - r2.rowStart || l.columnStart - r2.columnStart;
+  });
+}
+function boundSelectionRect(api, rect) {
+  const s3 = api.getState();
+  const rowCount = s3.internal.rowCount.peek();
+  const maxRow = rowCount;
+  const minRow = 0;
+  const maxColumn = s3.columnsVisible.peek().length;
+  const minColumn = 0;
+  const rowStartMaybe = clamp(minRow, rect.rowStart, maxRow);
+  const rowEndMaybe = clamp(minRow, rect.rowEnd, maxRow);
+  const colStartMaybe = clamp(minColumn, rect.columnStart, maxColumn);
+  const colEndMaybe = clamp(minColumn, rect.columnEnd, maxColumn);
+  const rowStart = Math.min(rowStartMaybe, rowEndMaybe);
+  const rowEnd = Math.max(rowStartMaybe, rowEndMaybe);
+  const columnStart = Math.min(colStartMaybe, colEndMaybe);
+  const columnEnd = Math.max(colStartMaybe, colEndMaybe);
+  return { rowStart, rowEnd, columnStart, columnEnd };
+}
+function areRectsEqual(left, right) {
+  return left.rowStart === right.rowStart && left.rowEnd === right.rowEnd && left.columnStart === right.columnStart && left.columnEnd === right.columnEnd;
+}
+function isOverlappingRect(rect1, rect2) {
+  return !(rect1.rowEnd < rect2.rowStart || rect1.rowStart > rect2.rowEnd || rect1.columnEnd < rect2.columnStart || rect1.columnStart > rect2.columnEnd);
+}
+function deselectRectRange(rect, deselectRect) {
+  if (!isOverlappingRect(rect, deselectRect)) return [rect];
+  const result = [];
+  if (deselectRect.rowStart > rect.rowStart) {
+    result.push({
+      rowStart: rect.rowStart,
+      rowEnd: deselectRect.rowStart,
+      columnStart: rect.columnStart,
+      columnEnd: rect.columnEnd
+    });
+  }
+  if (deselectRect.rowEnd < rect.rowEnd) {
+    result.push({
+      rowStart: deselectRect.rowEnd,
+      rowEnd: rect.rowEnd,
+      columnStart: rect.columnStart,
+      columnEnd: rect.columnEnd
+    });
+  }
+  if (deselectRect.columnStart > rect.columnStart) {
+    result.push({
+      rowStart: Math.max(deselectRect.rowStart, rect.rowStart),
+      rowEnd: Math.min(deselectRect.rowEnd, rect.rowEnd),
+      columnStart: rect.columnStart,
+      columnEnd: deselectRect.columnStart
+    });
+  }
+  if (deselectRect.columnEnd < rect.columnEnd) {
+    result.push({
+      rowStart: Math.max(deselectRect.rowStart, rect.rowStart),
+      rowEnd: Math.min(deselectRect.rowEnd, rect.rowEnd),
+      columnStart: deselectRect.columnEnd,
+      columnEnd: rect.columnEnd
+    });
+  }
+  return result.filter(
+    (rect2) => !(rect2.rowStart >= rect2.rowEnd || rect2.columnStart >= rect2.columnEnd)
+  );
+}
+function adjustRectForRowAndCellSpan(api, rect) {
+  let { rowStart, rowEnd, columnStart, columnEnd } = rect;
+  for (let i = columnStart; i < columnEnd; i++) {
+    let cell = getRootCell(api, rowStart, i);
+    if (cell) {
+      columnStart = Math.min(columnStart, cell.columnIndex);
+      columnEnd = Math.max(columnEnd, cell.columnIndex + cell.columnSpan);
+      rowStart = Math.min(rowStart, cell.rowIndex);
+      rowEnd = Math.max(rowEnd, cell.rowIndex + cell.rowSpan);
+    }
+    cell = getRootCell(api, rowEnd - 1, i);
+    if (cell) {
+      columnStart = Math.min(columnStart, cell.columnIndex);
+      columnEnd = Math.max(columnEnd, cell.columnIndex + cell.columnSpan);
+      rowStart = Math.min(rowStart, cell.rowIndex);
+      rowEnd = Math.max(rowEnd, cell.rowIndex + cell.rowSpan);
+    }
+  }
+  for (let i = rowStart; i < rowEnd; i++) {
+    let cell = getRootCell(api, i, columnStart);
+    if (cell) {
+      columnStart = Math.min(columnStart, cell.columnIndex);
+      columnEnd = Math.max(columnEnd, cell.columnIndex + cell.columnSpan);
+      rowStart = Math.min(rowStart, cell.rowIndex);
+      rowEnd = Math.max(rowEnd, cell.rowIndex + cell.rowSpan);
+    }
+    cell = getRootCell(api, i, columnEnd - 1);
+    if (cell) {
+      columnStart = Math.min(columnStart, cell.columnIndex);
+      columnEnd = Math.max(columnEnd, cell.columnIndex + cell.columnSpan);
+      rowStart = Math.min(rowStart, cell.rowIndex);
+      rowEnd = Math.max(rowEnd, cell.rowIndex + cell.rowSpan);
+    }
+  }
+  return {
+    rowStart,
+    rowEnd,
+    columnStart,
+    columnEnd
+  };
+}
+function updateAdditiveCellSelection(api, rect) {
+  const s3 = api.getState();
+  const rects = splitCellSelectionRect({
+    rect: boundSelectionRect(api, adjustRectForRowAndCellSpan(api, rect)),
+    colCenterCount: s3.columnVisibleCenterCount.peek(),
+    colStartCount: s3.columnVisibleStartCount.peek(),
+    rowCenterCount: s3.internal.rowCount.peek() - s3.internal.rowTopCount.peek() - s3.internal.rowBottomCount.peek(),
+    rowTopCount: s3.internal.rowTopCount.peek()
+  });
+  const current = s3.internal.cellSelectionAdditiveRects.peek();
+  if (current && current.length === rects.length) {
+    if (current.every((c, i) => areRectsEqual(c, rects[i]))) return;
+  }
+  s3.internal.cellSelectionAdditiveRects.set(rects);
+}
+function isBottomRect(api, rect) {
+  const s3 = api.getState();
+  const bottomStart = s3.internal.rowCount.peek() - s3.internal.rowBottomCount.peek();
+  return rect.rowStart >= bottomStart;
+}
+function isCenterRect(api, rect) {
+  const s3 = api.getState();
+  const bottomStart = s3.internal.rowCount.peek() - s3.internal.rowBottomCount.peek();
+  return rect.rowStart < bottomStart && rect.rowStart >= s3.internal.rowTopCount.peek();
+}
+function isTopRect(api, rect) {
+  const topCount = api.getState().internal.rowTopCount.peek();
+  return rect.rowStart < topCount;
+}
+function isNormalClick(event) {
+  return event.button === 0 && !event.ctrlKey && !event.altKey && !event.metaKey;
+}
+function CellSelectionDriver() {
+  const { state, api } = useGrid$1();
+  const viewport = state.internal.viewport.use();
+  const mode = state.cellSelectionMode.use();
+  const { cancelX, cancelY, edgeScrollX, edgeScrollY } = useEdgeScroll(api);
+  useEffect(() => {
+    if (!viewport || mode === "none" || mode === "single") {
+      return;
+    }
+    const isMultiRange = mode === "multi-range";
+    let isAdditive = false;
+    let startSelection = null;
+    let pointerStartX = 0;
+    let pointerStartY = 0;
+    let lastRect = null;
+    let animFrame = null;
+    const pointerMove = (event) => {
+      if (animFrame) cancelAnimationFrame(animFrame);
+      animFrame = requestAnimationFrame(() => {
+        animFrame = null;
+        const s3 = api.getState();
+        const clientX = getClientX(event);
+        const clientY = getClientY(event);
+        const columnIndex = getHoveredColumnIndex(api, clientX);
+        const rowIndex = getHoveredRowIndex(api, clientY);
+        if (rowIndex == null || columnIndex == null) return;
+        if (pointerStartX != null && pointerStartY != null) {
+          const moveDeltaX = Math.abs(pointerStartX - clientX);
+          const moveDeltaY = Math.abs(pointerStartY - clientY);
+          if (moveDeltaX < 20 && moveDeltaY < 20) return;
+          pointerStartX = null;
+          pointerStartY = null;
+        }
+        if (!startSelection) return;
+        const relativeX = getRelativeXPosition(viewport, clientX);
+        const isRtl = s3.rtl.peek();
+        const visualX = isRtl ? relativeX.right : relativeX.left;
+        edgeScrollX(visualX, isRtl);
+        const relativeY = getRelativeYPosition(viewport, clientY);
+        edgeScrollY(relativeY.top);
+        const topCount = s3.internal.rowTopCount.peek();
+        const centerCount = s3.internal.rowCount.peek() - topCount - s3.internal.rowBottomCount.peek();
+        const scrollY = s3.internal.viewport.peek().scrollTop;
+        if (rowIndex < topCount && scrollY > 0) return;
+        const maxScroll = viewport.scrollHeight - viewport.clientHeight - 4;
+        if (rowIndex > topCount + centerCount - 1 && scrollY < maxScroll) return;
+        const startCount = s3.columnVisibleStartCount.peek();
+        const firstEnd = s3.columnVisibleCenterCount.peek() + startCount;
+        const scrollX = Math.abs(s3.internal.viewport.peek().scrollLeft);
+        if (columnIndex < startCount && scrollX > 0) return;
+        const maxScrollX = viewport.scrollWidth - viewport.clientWidth - 4;
+        if (columnIndex >= firstEnd && scrollX < maxScrollX) return;
+        const startRow = rowIndex < startSelection.rowStart ? rowIndex : startSelection.rowStart;
+        const endRow = rowIndex < startSelection.rowStart ? startSelection.rowEnd : rowIndex + 1;
+        const startCol = columnIndex < startSelection.columnStart ? columnIndex : startSelection.columnStart;
+        const endCol = columnIndex < startSelection.columnStart ? startSelection.columnEnd : columnIndex + 1;
+        const active = [
+          { rowStart: startRow, rowEnd: endRow, columnStart: startCol, columnEnd: endCol }
+        ];
+        if (isAdditive) {
+          updateAdditiveCellSelection(api, active[0]);
+        } else {
+          s3.cellSelections.set(active);
+        }
+        lastRect = active[0];
+      });
+    };
+    const pointerDown = (event) => {
+      if (!isMultiRange && !isNormalClick(event)) {
+        document.removeEventListener("pointermove", pointerMove);
+        event.preventDefault();
+        return;
+      }
+      const s3 = api.getState();
+      const contextMenuOpen = !!s3.internal.contextMenuTarget.peek();
+      const columnMenuOpen = !!s3.internal.columnMenuColumn.peek();
+      const panelFrameOpen = !!s3.internal.panelFrameOpen.peek();
+      const floatingFrameOpen = !!s3.internal.floatingFrameOpen.peek();
+      if (contextMenuOpen || columnMenuOpen || panelFrameOpen || floatingFrameOpen) {
+        document.removeEventListener("pointermove", pointerMove);
+        return;
+      }
+      isAdditive = isMultiRange && (event.ctrlKey || event.metaKey);
+      const clientX = getClientX(event);
+      const clientY = getClientY(event);
+      const columnIndex = getHoveredColumnIndex(api, clientX);
+      const rowIndex = getHoveredRowIndex(api, clientY);
+      if (columnIndex == null || rowIndex == null) {
+        s3.cellSelections.set([]);
+        s3.internal.cellSelectionPivot.set(null);
+        return;
+      }
+      const isDeselect = isAdditive && api.cellSelectionIsSelected(rowIndex, columnIndex);
+      pointerStartX = event.clientX;
+      pointerStartY = event.clientY;
+      startSelection = {
+        columnStart: columnIndex,
+        columnEnd: columnIndex + 1,
+        rowStart: rowIndex,
+        rowEnd: rowIndex + 1
+      };
+      const pivot = s3.internal.cellSelectionPivot.peek();
+      if (event.shiftKey && pivot) {
+        const active = { ...pivot };
+        active.columnStart = Math.min(columnIndex, active.columnStart);
+        active.columnEnd = Math.max(columnIndex + 1, active.columnEnd);
+        active.rowStart = Math.min(rowIndex, active.rowStart);
+        active.rowEnd = Math.max(rowIndex + 1, active.rowEnd);
+        s3.cellSelections.set([active]);
+        event.preventDefault();
+        return;
+      }
+      if (mode === "multi-range" && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+      }
+      s3.internal.cellSelectionPivot.set(startSelection);
+      s3.internal.cellSelectionIsDeselect.set(isDeselect);
+      if (isAdditive) {
+        updateAdditiveCellSelection(api, startSelection);
+      } else {
+        s3.cellSelections.set([startSelection]);
+      }
+      lastRect = startSelection;
+      document.addEventListener("pointermove", pointerMove);
+      document.addEventListener("contextmenu", pointerUp);
+      document.addEventListener("pointerup", pointerUp);
+    };
+    const pointerUp = () => {
+      startSelection = null;
+      if (isAdditive) {
+        const s3 = api.getState();
+        const isDeselect = s3.internal.cellSelectionIsDeselect.peek();
+        const rects = isDeselect ? s3.cellSelections.peek().flatMap((r2) => deselectRectRange(r2, lastRect)) : [...s3.cellSelections.peek(), lastRect];
+        s3.cellSelections.set(rects);
+        s3.internal.cellSelectionAdditiveRects.set(null);
+        s3.internal.cellSelectionIsDeselect.set(false);
+        isAdditive = false;
+      }
+      cancelX();
+      cancelY();
+      document.removeEventListener("pointerup", pointerUp);
+      document.removeEventListener("contextmenu", pointerUp);
+      document.removeEventListener("pointermove", pointerMove);
+    };
+    viewport.addEventListener("pointerdown", pointerDown);
+    const handleKey = (ev) => {
+      const rtl = state.rtl.peek();
+      const start = rtl ? "ArrowRight" : "ArrowLeft";
+      const end = rtl ? "ArrowLeft" : "ArrowRight";
+      if (!ev.shiftKey) return;
+      let handled = false;
+      if (ev.key === start) {
+        api.cellSelectionExpandStart();
+        handled = true;
+      } else if (ev.key === end) {
+        api.cellSelectionExpandEnd();
+        handled = true;
+      } else if (ev.key === "ArrowDown") {
+        api.cellSelectionExpandDown();
+        handled = true;
+      } else if (ev.key === "ArrowUp") {
+        api.cellSelectionExpandUp();
+        handled = true;
+      }
+      if (handled) {
+        ev.preventDefault();
+        ev.stopPropagation();
+      }
+    };
+    viewport.addEventListener("keydown", handleKey);
+    return () => {
+      viewport.removeEventListener("pointerdown", pointerDown);
+      viewport.removeEventListener("keydown", handleKey);
+    };
+  }, [
+    api,
+    cancelX,
+    cancelY,
+    edgeScrollX,
+    edgeScrollY,
+    mode,
+    state.cellSelections,
+    state.internal.cellSelectionPivot,
+    state.internal.navigatePosition,
+    state.rtl,
+    viewport
+  ]);
+  useEffect(() => {
+    if (mode === "none" || !viewport) return;
+    const controller = new AbortController();
+    viewport.addEventListener(
+      "keydown",
+      (ev) => {
+        const meta = ev.ctrlKey || ev.metaKey;
+        if (ev.key === "c" && meta) {
+          api.clipboardCopyCells();
+        } else if (ev.key === "x" && meta) {
+          api.clipboardCutCells();
+        } else if (ev.key === "v" && meta) {
+          api.clipboardPasteCells();
+        }
+      },
+      { signal: controller.signal }
+    );
+    const unsub = state.internal.navigatePosition.watch(() => {
+      const pos = state.internal.navigatePosition.peek();
+      if (!pos) return;
+      if (pos.kind !== GRID_CELL_POSITION) return state.cellSelections.set([]);
+      else {
+        const rect = adjustRectForRowAndCellSpan(api, {
+          rowStart: pos.rowIndex,
+          rowEnd: pos.rowIndex + 1,
+          columnStart: pos.columnIndex,
+          columnEnd: pos.columnIndex + 1
+        });
+        state.internal.cellSelectionPivot.set(rect);
+        state.cellSelections.set([rect]);
+      }
+    });
+    return () => {
+      unsub();
+      controller.abort();
+    };
+  }, [
+    api,
+    mode,
+    state.cellSelections,
+    state.internal.cellSelectionPivot,
+    state.internal.navigatePosition,
+    viewport
+  ]);
+  return /* @__PURE__ */ jsx(Fragment, {});
+}
+function CellStyleRow({
+  rect,
+  isRowPinnedTop,
+  isDeselect,
+  isRowPinnedBottom,
+  isPivot
+}) {
+  const { state, api } = useGrid$1();
+  const xPositions = state.columnPositions.use();
+  const yPositions = state.internal.rowPositions.use();
+  const rtl = state.rtl.use();
+  const flash = state.internal.cellSelectionFlashOn.use();
+  const startCount = state.columnVisibleStartCount.use();
+  const centerCount = state.columnVisibleCenterCount.use();
+  const paginate = state.paginate.use();
+  const currentPage = state.paginateCurrentPage.use();
+  const rowCount = state.internal.rowCount.use();
+  const rowTopCount = state.internal.rowTopCount.use();
+  const rowBotCount = state.internal.rowBottomCount.use();
+  const vpWidth = state.internal.viewportInnerWidth.use();
+  const style = useMemo(() => {
+    const isStart = rect.columnStart < startCount;
+    const isEnd = rect.columnStart >= startCount + centerCount;
+    const isTop = isRowPinnedTop;
+    const isBot = isRowPinnedBottom;
+    const columnIndex = rect.columnStart;
+    const rowIndex = rect.rowStart;
+    const width = sizeFromCoord(rect.columnStart, xPositions, rect.columnEnd - rect.columnStart);
+    const height = sizeFromCoord(rect.rowStart, yPositions, rect.rowEnd - rect.rowStart);
+    const firstBotIndex = rowCount - rowBotCount;
+    let paginateOffset = 0;
+    if (paginate) {
+      const [rowStart] = api.paginateRowStartAndEndForPage(currentPage);
+      paginateOffset = yPositions[rowStart];
+    }
+    const x2 = isEnd ? xPositions[columnIndex] - xPositions.at(-1) + vpWidth : xPositions[columnIndex];
+    const y2 = isBot ? yPositions[rowIndex] - yPositions[firstBotIndex] : isTop ? yPositions[rowIndex] : yPositions[rowIndex] - yPositions[rowTopCount] - paginateOffset;
+    const transform = getTransform(x2 * (rtl ? -1 : 1), y2);
+    const style2 = { height, width, transform };
+    if (isStart || isEnd) {
+      style2.insetInlineStart = "0px";
+      style2.position = "sticky";
+      style2.zIndex = 2;
+    }
+    if (isTop || isBot) {
+      style2.position = "sticky";
+      style2.top = "0px";
+      style2.zIndex = isStart ? 4 : 3;
+    }
+    return style2;
+  }, [
+    api,
+    centerCount,
+    currentPage,
+    isRowPinnedBottom,
+    isRowPinnedTop,
+    paginate,
+    rect.columnEnd,
+    rect.columnStart,
+    rect.rowEnd,
+    rect.rowStart,
+    rowBotCount,
+    rowCount,
+    rowTopCount,
+    rtl,
+    startCount,
+    vpWidth,
+    xPositions,
+    yPositions
+  ]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style,
+      className: clsx(
+        "lng1771-cell-selection",
+        isDeselect && "lng1771-cell-selection--deselect",
+        isPivot && "lng1771-cell-selection--pivot",
+        flash && "lng1771-cell-selection--flash"
+      )
+    }
+  );
+}
+const CellSelectionTop = memo(function CellSelectionTop2() {
+  const { state, api } = useGrid$1();
+  const allRects = state.internal.cellSelectionSplits.use();
+  const topRects = useMemo(() => {
+    return allRects.filter((rect) => isTopRect(api, rect));
+  }, [allRects, api]);
+  const mode = state.cellSelectionMode.use();
+  const showPivot = mode === "multi-range" || mode === "range";
+  const additive = state.internal.cellSelectionAdditiveRects.use();
+  const isDeselect = state.internal.cellSelectionIsDeselect.use();
+  const pivot = state.internal.cellSelectionPivot.use();
+  const additiveRects = useMemo(() => {
+    if (!additive) return [];
+    return additive.filter((rect) => isTopRect(api, rect));
+  }, [additive, api]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    topRects.map((rect, i) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect, isRowPinnedTop: true }, i);
+    }),
+    additiveRects.map((rect) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect, isDeselect }, rect.columnStart);
+    }),
+    showPivot && pivot && isTopRect(api, pivot) && /* @__PURE__ */ jsx(CellStyleRow, { rect: pivot, isPivot: true, isRowPinnedTop: true })
+  ] });
+});
+const CellSelectionCenter = memo(function CellSelectionCenter2() {
+  const { state, api } = useGrid$1();
+  const allRects = state.internal.cellSelectionSplits.use();
+  const pivot = state.internal.cellSelectionPivot.use();
+  const centerRects = useMemo(() => {
+    return allRects.filter((rect) => isCenterRect(api, rect));
+  }, [allRects, api]);
+  const additive = state.internal.cellSelectionAdditiveRects.use();
+  const isDeselect = state.internal.cellSelectionIsDeselect.use();
+  const additiveRects = useMemo(() => {
+    if (!additive) return [];
+    return additive.filter((rect) => isCenterRect(api, rect));
+  }, [additive, api]);
+  const mode = state.cellSelectionMode.use();
+  const showPivot = mode === "multi-range" || mode === "range";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    centerRects.map((rect, i) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect }, i);
+    }),
+    additiveRects.map((rect) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect, isDeselect }, rect.columnStart);
+    }),
+    showPivot && pivot && isCenterRect(api, pivot) && /* @__PURE__ */ jsx(CellStyleRow, { rect: pivot, isPivot: true })
+  ] });
+});
+const CellSelectionBottom = memo(function CellSelectionBottom2() {
+  const { state, api } = useGrid$1();
+  const allRects = state.internal.cellSelectionSplits.use();
+  const pivot = state.internal.cellSelectionPivot.use();
+  const bottomRects = useMemo(() => {
+    return allRects.filter((rect) => isBottomRect(api, rect));
+  }, [allRects, api]);
+  const additive = state.internal.cellSelectionAdditiveRects.use();
+  const isDeselect = state.internal.cellSelectionIsDeselect.use();
+  const additiveRects = useMemo(() => {
+    if (!additive) return [];
+    return additive.filter((rect) => isBottomRect(api, rect));
+  }, [additive, api]);
+  const mode = state.cellSelectionMode.use();
+  const showPivot = mode === "multi-range" || mode === "range";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    bottomRects.map((rect, i) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect, isRowPinnedBottom: true }, i);
+    }),
+    additiveRects.map((rect) => {
+      return /* @__PURE__ */ jsx(CellStyleRow, { rect, isDeselect }, rect.columnStart);
+    }),
+    showPivot && pivot && isBottomRect(api, pivot) && /* @__PURE__ */ jsx(CellStyleRow, { rect: pivot, isPivot: true, isRowPinnedBottom: true })
+  ] });
+});
+const hashSalt = "faec0f3c45281b1fe12d87e64a6c3271";
+const issueDate = /* @__PURE__ */ new Date("2025-01-26");
+function getHostname() {
+  const win = globalThis?.document?.defaultView || (typeof window !== "undefined" ? window : null);
+  const loc = win?.location;
+  const { hostname = "" } = loc ?? {};
+  return hostname;
+}
+function isWebsiteUrl() {
+  const hostname = getHostname();
+  return hostname.match(/^((?:\w+\.)?1771technologies\.com)$/) !== null;
+}
+function isLocalhost() {
+  const hostname = getHostname();
+  return hostname.match(/^(?:127\.0\.0\.1|localhost)$/) !== null;
+}
+let hasAValidLicense = isWebsiteUrl() || isLocalhost();
+function activateLicense(license) {
+  const parts = license.split("|");
+  const details = parts[0];
+  const hash = parts[1];
+  const detailHash = new MD5().md5(details + hashSalt);
+  if (detailHash !== hash) {
+    console.error(
+      `
+********************************************************************************
+  INVALID LICENSE KEY SUPPLIED
+
+  The license key you provided is not a valid LyteNyte Grid license key. If you
+  purchased a valid license from 1771 Technologies, please reach out to
+  our dedicated support email support@1771technologies.com.
+
+  If you are interested in purchasing a valid license, please 
+  visit https://1771technolgies.com
+********************************************************************************
+`
+    );
+    return false;
+  }
+  const detailParts = details.split(" ");
+  const endDate = new Date(detailParts[1]);
+  if (issueDate > endDate) {
+    console.error(`
+********************************************************************************
+    LICENSE EXPIRED
+
+    The license provided is a valid LyteNyte license, however it is not valid for the
+    current version of LyteNyte Grid being used. Please renew your license or use
+    the fallback version valid under your license.
+
+    To purchase a new license or learn more about which versions your license is valid
+    for please visit https://1771technologies.com.
+********************************************************************************
+`);
+    return false;
+  }
+  hasAValidLicense = true;
+  return true;
+}
+class MD5 {
+  md5cycle(x2, k) {
+    let a = x2[0];
+    let b = x2[1];
+    let c = x2[2];
+    let d = x2[3];
+    a = this.ff(a, b, c, d, k[0], 7, -680876936);
+    d = this.ff(d, a, b, c, k[1], 12, -389564586);
+    c = this.ff(c, d, a, b, k[2], 17, 606105819);
+    b = this.ff(b, c, d, a, k[3], 22, -1044525330);
+    a = this.ff(a, b, c, d, k[4], 7, -176418897);
+    d = this.ff(d, a, b, c, k[5], 12, 1200080426);
+    c = this.ff(c, d, a, b, k[6], 17, -1473231341);
+    b = this.ff(b, c, d, a, k[7], 22, -45705983);
+    a = this.ff(a, b, c, d, k[8], 7, 1770035416);
+    d = this.ff(d, a, b, c, k[9], 12, -1958414417);
+    c = this.ff(c, d, a, b, k[10], 17, -42063);
+    b = this.ff(b, c, d, a, k[11], 22, -1990404162);
+    a = this.ff(a, b, c, d, k[12], 7, 1804603682);
+    d = this.ff(d, a, b, c, k[13], 12, -40341101);
+    c = this.ff(c, d, a, b, k[14], 17, -1502002290);
+    b = this.ff(b, c, d, a, k[15], 22, 1236535329);
+    a = this.gg(a, b, c, d, k[1], 5, -165796510);
+    d = this.gg(d, a, b, c, k[6], 9, -1069501632);
+    c = this.gg(c, d, a, b, k[11], 14, 643717713);
+    b = this.gg(b, c, d, a, k[0], 20, -373897302);
+    a = this.gg(a, b, c, d, k[5], 5, -701558691);
+    d = this.gg(d, a, b, c, k[10], 9, 38016083);
+    c = this.gg(c, d, a, b, k[15], 14, -660478335);
+    b = this.gg(b, c, d, a, k[4], 20, -405537848);
+    a = this.gg(a, b, c, d, k[9], 5, 568446438);
+    d = this.gg(d, a, b, c, k[14], 9, -1019803690);
+    c = this.gg(c, d, a, b, k[3], 14, -187363961);
+    b = this.gg(b, c, d, a, k[8], 20, 1163531501);
+    a = this.gg(a, b, c, d, k[13], 5, -1444681467);
+    d = this.gg(d, a, b, c, k[2], 9, -51403784);
+    c = this.gg(c, d, a, b, k[7], 14, 1735328473);
+    b = this.gg(b, c, d, a, k[12], 20, -1926607734);
+    a = this.hh(a, b, c, d, k[5], 4, -378558);
+    d = this.hh(d, a, b, c, k[8], 11, -2022574463);
+    c = this.hh(c, d, a, b, k[11], 16, 1839030562);
+    b = this.hh(b, c, d, a, k[14], 23, -35309556);
+    a = this.hh(a, b, c, d, k[1], 4, -1530992060);
+    d = this.hh(d, a, b, c, k[4], 11, 1272893353);
+    c = this.hh(c, d, a, b, k[7], 16, -155497632);
+    b = this.hh(b, c, d, a, k[10], 23, -1094730640);
+    a = this.hh(a, b, c, d, k[13], 4, 681279174);
+    d = this.hh(d, a, b, c, k[0], 11, -358537222);
+    c = this.hh(c, d, a, b, k[3], 16, -722521979);
+    b = this.hh(b, c, d, a, k[6], 23, 76029189);
+    a = this.hh(a, b, c, d, k[9], 4, -640364487);
+    d = this.hh(d, a, b, c, k[12], 11, -421815835);
+    c = this.hh(c, d, a, b, k[15], 16, 530742520);
+    b = this.hh(b, c, d, a, k[2], 23, -995338651);
+    a = this.ii(a, b, c, d, k[0], 6, -198630844);
+    d = this.ii(d, a, b, c, k[7], 10, 1126891415);
+    c = this.ii(c, d, a, b, k[14], 15, -1416354905);
+    b = this.ii(b, c, d, a, k[5], 21, -57434055);
+    a = this.ii(a, b, c, d, k[12], 6, 1700485571);
+    d = this.ii(d, a, b, c, k[3], 10, -1894986606);
+    c = this.ii(c, d, a, b, k[10], 15, -1051523);
+    b = this.ii(b, c, d, a, k[1], 21, -2054922799);
+    a = this.ii(a, b, c, d, k[8], 6, 1873313359);
+    d = this.ii(d, a, b, c, k[15], 10, -30611744);
+    c = this.ii(c, d, a, b, k[6], 15, -1560198380);
+    b = this.ii(b, c, d, a, k[13], 21, 1309151649);
+    a = this.ii(a, b, c, d, k[4], 6, -145523070);
+    d = this.ii(d, a, b, c, k[11], 10, -1120210379);
+    c = this.ii(c, d, a, b, k[2], 15, 718787259);
+    b = this.ii(b, c, d, a, k[9], 21, -343485551);
+    x2[0] = this.add32(a, x2[0]);
+    x2[1] = this.add32(b, x2[1]);
+    x2[2] = this.add32(c, x2[2]);
+    x2[3] = this.add32(d, x2[3]);
+  }
+  cmn(q2, a, b, x2, s3, t2) {
+    a = this.add32(this.add32(a, q2), this.add32(x2, t2));
+    return this.add32(a << s3 | a >>> 32 - s3, b);
+  }
+  ff(a, b, c, d, x2, s3, t2) {
+    return this.cmn(b & c | ~b & d, a, b, x2, s3, t2);
+  }
+  gg(a, b, c, d, x2, s3, t2) {
+    return this.cmn(b & d | c & ~d, a, b, x2, s3, t2);
+  }
+  hh(a, b, c, d, x2, s3, t2) {
+    return this.cmn(b ^ c ^ d, a, b, x2, s3, t2);
+  }
+  ii(a, b, c, d, x2, s3, t2) {
+    return this.cmn(c ^ (b | ~d), a, b, x2, s3, t2);
+  }
+  md51(s3) {
+    const n = s3.length;
+    const state = [1732584193, -271733879, -1732584194, 271733878];
+    let i;
+    for (i = 64; i <= s3.length; i += 64) {
+      this.md5cycle(state, this.md5blk(s3.substring(i - 64, i)));
+    }
+    s3 = s3.substring(i - 64);
+    const tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
+    for (i = 0; i < s3.length; i++) {
+      tail[i >> 2] |= s3.charCodeAt(i) << (i % 4 << 3);
+    }
+    tail[i >> 2] |= 128 << (i % 4 << 3);
+    if (i > 55) {
+      this.md5cycle(state, tail);
+      for (i = 0; i < 16; i++) {
+        tail[i] = 0;
+      }
+    }
+    tail[14] = n * 8;
+    this.md5cycle(state, tail);
+    return state;
+  }
+  /* there needs to be support for Unicode here, * unless we pretend that we can redefine the MD-5
+   * algorithm for multi-byte characters (perhaps by adding every four 16-bit characters and
+   * shortening the sum to 32 bits). Otherwise I suthis.ggest performing MD-5 as if every character
+   * was two bytes--e.g., 0040 0025 = @%--but then how will an ordinary MD-5 sum be matched?
+   * There is no way to standardize text to something like UTF-8 before transformation; speed cost is
+   * utterly prohibitive. The JavaScript standard itself needs to look at this: it should start
+   * providing access to strings as preformed UTF-8 8-bit unsigned value arrays.
+   */
+  md5blk(s3) {
+    const md5blks = [];
+    for (let i = 0; i < 64; i += 4) {
+      md5blks[i >> 2] = s3.charCodeAt(i) + (s3.charCodeAt(i + 1) << 8) + (s3.charCodeAt(i + 2) << 16) + (s3.charCodeAt(i + 3) << 24);
+    }
+    return md5blks;
+  }
+  rhex(n) {
+    const hex_chr = "0123456789abcdef".split("");
+    let s3 = "";
+    let j = 0;
+    for (; j < 4; j++) {
+      s3 += hex_chr[n >> j * 8 + 4 & 15] + hex_chr[n >> j * 8 & 15];
+    }
+    return s3;
+  }
+  hex(x2) {
+    for (let i = 0; i < x2.length; i++) {
+      x2[i] = this.rhex(x2[i]);
+    }
+    return x2.join("");
+  }
+  md5(s3) {
+    return this.hex(this.md51(s3));
+  }
+  add32(a, b) {
+    return this.add32Std(a, b);
+  }
+  add32Std(a, b) {
+    return a + b & 4294967295;
+  }
+}
+const s2 = cascada(() => {
+  return {
+    showing: signal(null)
+  };
+});
+function Watermark({
+  id
+}) {
+  const showing = s2.showing.use();
+  const [mountable, setMountable] = useState(false);
+  useEffect(() => {
+    setMountable(true);
+  }, []);
+  useEffect(() => {
+    if (showing && showing === id) s2.showing.set(id);
+    return () => s2.showing.set(null);
+  });
+  useEffect(() => {
+    if (hasAValidLicense) return;
+    console.log(`
+********************************************************************************
+    No valid license was detected for the version of LyteNyte Grid being used.
+
+    If you are only evaluating LyteNyte Grid you do not need to purchase license.
+
+    For commercial use a license for developers must be purchased.
+
+    Please visit https://1771technologies.com to learn more.
+********************************************************************************
+    `);
+  }, []);
+  if (!mountable) return null;
+  if (hasAValidLicense) return null;
+  if (showing && showing !== id) return null;
+  if (typeof document === "undefined") return null;
+  setTimeout(() => {
+    s2.showing.set(id);
+  });
+  return createPortal(/* @__PURE__ */ jsx("div", {
+    className: "c7kkngm",
+    children: /* @__PURE__ */ jsx("div", {
+      children: /* @__PURE__ */ jsxs("div", {
+        style: {
+          fontWeight: "bolder",
+          fontSize: "1.25rem"
+        },
+        children: ["LyteNyte Grid for evaluation only.", /* @__PURE__ */ jsx("a", {
+          style: {
+            color: "blue"
+          },
+          href: "https://1771Technologies.com/pricing",
+          children: "Click here"
+        }), " ", "to secure your license."]
+      })
+    })
+  }), document.body);
+}
+function LoadingOverlay() {
+  return /* @__PURE__ */ jsx("div", { className: "lng1771-loading-overlay", children: /* @__PURE__ */ jsx("div", { className: "lng1771-loading-overlay__container", children: "Loading..." }) });
+}
+function NoDataOverlay() {
+  return /* @__PURE__ */ jsx("div", { className: "lng1771-no-data-overlay", children: /* @__PURE__ */ jsx("div", { className: "lng1771-no-data-overlay__container", children: "No Data" }) });
+}
+function LoadErrorOverlay() {
+  const { state, api } = useGrid$1();
+  return /* @__PURE__ */ jsx("div", { className: "lng1771-loading-error-overlay", children: /* @__PURE__ */ jsxs("div", { className: "lng1771-loading-error-overlay__container", children: [
+    /* @__PURE__ */ jsx("div", { children: "Loading data from external source failed." }),
+    /* @__PURE__ */ jsx(
+      GridButton,
+      {
+        onClick: () => {
+          state.overlayToShow.set(null);
+          api.rowReload();
+        },
+        style: { marginInlineStart: 4 },
+        children: "Retry?"
+      }
+    )
+  ] }) });
+}
+function OverlayDriver() {
+  const { state, api } = useGrid$1();
+  const headerHeight = state.internal.viewportHeaderHeight.use();
+  const overlayId = state.overlayToShow.use();
+  const overlays = state.overlays.use();
+  const width = state.internal.viewportInnerWidth.use();
+  const height = state.internal.viewportInnerHeight.use();
+  if (!overlayId) return;
+  let overlay = overlays[overlayId];
+  if (!overlay && overlayId === "lng1771-loading-overlay") overlay = { renderer: LoadingOverlay };
+  if (!overlay && overlayId === "lng1771-load-error-overlay")
+    overlay = { renderer: LoadErrorOverlay, overRows: true };
+  if (!overlay && overlayId === "lng1771-no-data-overlay")
+    overlay = { renderer: NoDataOverlay, overRows: true };
+  const rowsOnly = !!overlay.overRows;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: { position: "sticky", width: 0, height: 0, insetInlineStart: 0, top: 0, zIndex: 20 },
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          onPointerDown: (e) => {
+            e.stopPropagation();
+          },
+          onKeyDown: (e) => {
+            e.stopPropagation();
+          },
+          className: "lng1771-overlay",
+          style: {
+            height: rowsOnly ? height - headerHeight : height,
+            width,
+            top: rowsOnly ? headerHeight : void 0
+          },
+          children: /* @__PURE__ */ jsx(overlay.renderer, { api })
+        }
+      )
+    }
+  );
+}
+const emptyBB = {
+  getBoundingClientRect: () => ({
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    toJSON: () => ""
+  })
+};
+function ColumnMenuDriver() {
+  const grid = useGrid$1();
+  const menuColumn = grid.state.internal.columnMenuColumn.use();
+  const target = grid.state.internal.columnMenuTarget.use();
+  const MenuRenderer = grid.state.columnMenuRenderer.use();
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    if (menuColumn == null || target == null) {
+      setOpen(false);
+      return;
+    }
+    setOpen(true);
+  }, [menuColumn, target]);
+  return /* @__PURE__ */ jsx(
+    MenuRoot,
+    {
+      open,
+      onOpenChange: (c) => {
+        setOpen(c);
+      },
+      onOpenChangeComplete: (c) => {
+        if (!c) grid.api.columnMenuClose();
+      },
+      children: /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsx(
+        MenuPositioner,
+        {
+          anchor: target ? "getBoundingClientRect" in target ? target : {
+            getBoundingClientRect: () => ({
+              x: target.x,
+              y: target.y,
+              width: target.width,
+              height: target.height,
+              top: target.y,
+              left: target.x,
+              bottom: target.y,
+              right: target.x,
+              toJSON: () => ""
+            })
+          } : emptyBB,
+          children: MenuRenderer && menuColumn && /* @__PURE__ */ jsx(MenuRenderer, { api: grid.api, column: menuColumn })
+        }
+      ) })
+    }
+  );
+}
+function GridFrame({
+  grid: { api, state },
+  children,
+  axe
+}) {
+  const buttons = state.panelFrameButtons.use();
+  const frames = state.panelFrames.use();
+  const openId = state.internal.panelFrameOpen.use();
+  const frame = openId ? frames[openId] : null;
+  const [frameSplit, setFrameSplit] = useState(70);
+  const template = useMemo(() => {
+    const f = ["1fr"];
+    if (buttons.length) f.push("32px");
+    return f.join(" ");
+  }, [buttons.length]);
+  const cellSelectionEnabled = state.cellSelectionMode.use() !== "none";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-lng1771-cell-selection-enabled": cellSelectionEnabled ? true : void 0,
+      className: "lng1771-grid-frame",
+      style: { gridTemplateColumns: template },
+      children: [
+        frame ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+          SplitPane,
+          {
+            axe: axe ?? splitPaneAxe,
+            orientation: "vertical",
+            primary: /* @__PURE__ */ jsx("div", { className: "lng1771-grid-frame__grid-area", children }),
+            secondary: /* @__PURE__ */ jsx(Sizer, { className: "lng1771-grid-frame__open-panel", children: /* @__PURE__ */ jsx(frame.component, { api, frame }) }),
+            split: frame ? frameSplit : 100,
+            onSplitChange: (n) => setFrameSplit(n),
+            min: 20,
+            max: 80,
+            splitterClassName: "lng1771-grid-frame__open-panel--splitter"
+          }
+        ) }) : /* @__PURE__ */ jsx("div", { children }),
+        buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "lng1771-grid-frame__controls", children: buttons.map((c) => {
+          const isActive = c.id === openId;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => {
+                if (isActive) api.panelFrameClose();
+                else api.panelFrameOpen(c.id);
+              },
+              className: clsx(
+                "lng1771-grid-frame__control-button",
+                c.id === openId && "lng1771-grid-frame__control-button--open"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "lng1771-grid-frame__control-button-icon", children: c.icon && /* @__PURE__ */ jsx(c.icon, {}) }),
+                /* @__PURE__ */ jsx("span", { children: c.label })
+              ]
+            },
+            c.id
+          );
+        }) })
+      ]
+    }
+  );
+}
+function useContextMenuListener(setMenu) {
+  const grid = useGrid$1();
+  const viewport = grid.state.internal.viewport.use();
+  const menuRenderer = grid.state.contextMenuRenderer.use();
+  const target = grid.state.internal.contextMenuTarget.use();
+  useEffect(() => {
+    if (!viewport || !menuRenderer) return;
+    const controller = new AbortController();
+    viewport.addEventListener(
+      "contextmenu",
+      (e) => {
+        if (e.ctrlKey || e.metaKey) return;
+        if (target) {
+          e.preventDefault();
+          e.stopPropagation();
+          return;
+        }
+        const x2 = getClientX(e);
+        const hoveredCell = getHoveredColumnIndex(grid.api, x2);
+        const y2 = getClientY(e);
+        const hoveredRow = getHoveredRowIndex(grid.api, y2);
+        let menuTarget = hoveredRow != null ? "cell" : null;
+        if (hoveredRow == null) {
+          let current = e.target;
+          while (current && current.getAttribute("data-lng1771-kind") == null && current !== viewport) {
+            current = current.parentElement;
+          }
+          if (current && current !== viewport) {
+            const kind = current.getAttribute("data-lng1771-kind");
+            if (kind === "floating") menuTarget = "header-floating";
+            if (kind === "header") menuTarget = "header";
+            if (kind === "header-group") menuTarget = "header-group";
+          }
+        }
+        if (!menuTarget || hoveredCell == null) {
+          setMenu(null);
+          return;
+        }
+        setMenu({
+          menuTarget,
+          hoveredRow,
+          hoveredColumn: hoveredCell
+        });
+        e.stopPropagation();
+        e.preventDefault();
+        const cellSelectionMode = grid.state.cellSelectionMode.peek();
+        if (menuTarget === "cell" && cellSelectionMode !== "none" && !grid.api.cellSelectionIsSelected(hoveredRow, hoveredCell)) {
+          grid.state.cellSelections.set([
+            {
+              rowStart: hoveredRow,
+              rowEnd: hoveredRow + 1,
+              columnStart: hoveredCell,
+              columnEnd: hoveredCell + 1
+            }
+          ]);
+        }
+        grid.state.internal.contextMenuTarget.set({ x: x2, y: y2, width: 1, height: 1 });
+      },
+      { signal: controller.signal }
+    );
+    return () => controller.abort();
+  }, [
+    target,
+    grid.api,
+    grid.state.cellSelectionMode,
+    grid.state.cellSelections,
+    grid.state.internal.contextMenuTarget,
+    menuRenderer,
+    viewport,
+    setMenu
+  ]);
+}
+function ContextMenuDriver() {
+  const grid = useGrid$1();
+  const [menu, setMenu] = useState(null);
+  const MenuRenderer = grid.state.contextMenuRenderer.use();
+  const target = grid.state.internal.contextMenuTarget.use();
+  useContextMenuListener(setMenu);
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    if (menu !== null) {
+      setOpen(true);
+    }
+  }, [menu]);
+  return /* @__PURE__ */ jsx(
+    MenuRoot,
+    {
+      open,
+      onOpenChange: (c) => {
+        setOpen(c);
+      },
+      onOpenChangeComplete: (c) => {
+        if (!c) {
+          grid.api.contextMenuClose();
+          setMenu(null);
+        }
+      },
+      children: /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsx(
+        MenuPositioner,
+        {
+          side: "bottom",
+          align: "start",
+          anchor: target ? "getBoundingClientRect" in target ? target : {
+            getBoundingClientRect: () => ({
+              x: target.x,
+              y: target.y,
+              width: target.width,
+              height: target.height,
+              top: target.y,
+              left: target.x,
+              bottom: target.y,
+              right: target.x,
+              toJSON: () => ""
+            })
+          } : emptyBB,
+          children: menu && MenuRenderer && /* @__PURE__ */ jsx(
+            MenuRenderer,
+            {
+              api: grid.api,
+              menuTarget: menu.menuTarget,
+              columnIndex: menu.hoveredColumn,
+              rowIndex: menu.hoveredRow
+            }
+          )
+        }
+      ) })
+    }
+  );
+}
+function DialogPortal(props) {
+  const {
+    children,
+    keepMounted = false,
+    container
+  } = props;
+  const {
+    mounted
+  } = useDialogRootContext();
+  const shouldRender = mounted || keepMounted;
+  if (!shouldRender) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(DialogPortalContext.Provider, {
+    value: keepMounted,
+    children: /* @__PURE__ */ jsx(FloatingPortal, {
+      root: container,
+      children
+    })
+  });
+}
+process.env.NODE_ENV !== "production" ? DialogPortal.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * A parent element to render the portal element into.
+   */
+  container: PropTypes.oneOfType([HTMLElementType, refType]),
+  /**
+   * Whether to keep the portal mounted in the DOM while the popup is hidden.
+   * @default false
+   */
+  keepMounted: PropTypes.bool
+} : void 0;
+function useEnhancedClickHandler(handler) {
+  const lastClickInteractionTypeRef = React.useRef("");
+  const handlePointerDown = React.useCallback((event) => {
+    if (event.defaultPrevented) {
+      return;
+    }
+    lastClickInteractionTypeRef.current = event.pointerType;
+  }, []);
+  const handleClick = React.useCallback((event) => {
+    if (event.detail === 0) {
+      handler(event, "keyboard");
+      return;
+    }
+    if ("pointerType" in event) {
+      handler(event, event.pointerType);
+    }
+    handler(event, lastClickInteractionTypeRef.current);
+    lastClickInteractionTypeRef.current = "";
+  }, [handler]);
+  return {
+    onClick: handleClick,
+    onPointerDown: handlePointerDown
+  };
+}
+function useOpenInteractionType(open) {
+  const [openMethod, setOpenMethod] = React.useState(null);
+  if (!open && openMethod !== null) {
+    setOpenMethod(null);
+  }
+  const handleTriggerClick = React.useCallback((_, interactionType) => {
+    if (!open) {
+      setOpenMethod(interactionType);
+    }
+  }, [open, setOpenMethod]);
+  const {
+    onClick,
+    onPointerDown
+  } = useEnhancedClickHandler(handleTriggerClick);
+  return React.useMemo(() => ({
+    openMethod,
+    triggerProps: {
+      onClick,
+      onPointerDown
+    }
+  }), [openMethod, onClick, onPointerDown]);
+}
+function useDialogRoot(params) {
+  const {
+    defaultOpen,
+    dismissible,
+    modal,
+    onNestedDialogClose,
+    onNestedDialogOpen,
+    onOpenChange: onOpenChangeParameter,
+    open: openParam,
+    onOpenChangeComplete
+  } = params;
+  const [open, setOpenUnwrapped] = useControlled({
+    controlled: openParam,
+    default: defaultOpen,
+    name: "DialogRoot",
+    state: "open"
+  });
+  const popupRef = React.useRef(null);
+  const backdropRef = React.useRef(null);
+  const internalBackdropRef = React.useRef(null);
+  const [titleElementId, setTitleElementId] = React.useState(void 0);
+  const [descriptionElementId, setDescriptionElementId] = React.useState(void 0);
+  const [triggerElement, setTriggerElement] = React.useState(null);
+  const [popupElement, setPopupElement] = React.useState(null);
+  const {
+    mounted,
+    setMounted,
+    transitionStatus
+  } = useTransitionStatus(open);
+  const setOpen = useEventCallback((nextOpen, event, reason) => {
+    onOpenChangeParameter?.(nextOpen, event, reason);
+    setOpenUnwrapped(nextOpen);
+  });
+  const handleUnmount = useEventCallback(() => {
+    setMounted(false);
+    onOpenChangeComplete?.(false);
+  });
+  useOpenChangeComplete({
+    enabled: !params.actionsRef,
+    open,
+    ref: popupRef,
+    onComplete() {
+      if (!open) {
+        handleUnmount();
+      }
+    }
+  });
+  React.useImperativeHandle(params.actionsRef, () => ({
+    unmount: handleUnmount
+  }), [handleUnmount]);
+  useScrollLock(open && modal, popupElement);
+  const handleFloatingUIOpenChange = (nextOpen, event, reason) => {
+    setOpen(nextOpen, event, translateOpenChangeReason(reason));
+  };
+  const context2 = useFloatingRootContext({
+    elements: {
+      reference: triggerElement,
+      floating: popupElement
+    },
+    open,
+    onOpenChange: handleFloatingUIOpenChange
+  });
+  const [ownNestedOpenDialogs, setOwnNestedOpenDialogs] = React.useState(0);
+  const isTopmost = ownNestedOpenDialogs === 0;
+  const role = useRole(context2);
+  const click = useClick(context2);
+  const dismiss = useDismiss(context2, {
+    outsidePressEvent: "mousedown",
+    outsidePress(event) {
+      const target = getTarget(event);
+      if (isTopmost && dismissible) {
+        const backdrop = target;
+        if (modal) {
+          return backdrop ? [internalBackdropRef.current, backdropRef.current].includes(backdrop) : false;
+        }
+        return true;
+      }
+      return false;
+    },
+    escapeKey: isTopmost
+  });
+  const {
+    getReferenceProps,
+    getFloatingProps
+  } = useInteractions([role, click, dismiss]);
+  React.useEffect(() => {
+    if (onNestedDialogOpen && open) {
+      onNestedDialogOpen(ownNestedOpenDialogs);
+    }
+    if (onNestedDialogClose && !open) {
+      onNestedDialogClose();
+    }
+    return () => {
+      if (onNestedDialogClose && open) {
+        onNestedDialogClose();
+      }
+    };
+  }, [open, onNestedDialogClose, onNestedDialogOpen, ownNestedOpenDialogs]);
+  const handleNestedDialogOpen = React.useCallback((ownChildrenCount) => {
+    setOwnNestedOpenDialogs(ownChildrenCount + 1);
+  }, []);
+  const handleNestedDialogClose = React.useCallback(() => {
+    setOwnNestedOpenDialogs(0);
+  }, []);
+  const {
+    openMethod,
+    triggerProps
+  } = useOpenInteractionType(open);
+  const getTriggerProps = React.useCallback((externalProps = {}) => getReferenceProps(mergeProps(triggerProps, externalProps)), [getReferenceProps, triggerProps]);
+  return React.useMemo(() => {
+    return {
+      modal,
+      setOpen,
+      open,
+      titleElementId,
+      setTitleElementId,
+      descriptionElementId,
+      setDescriptionElementId,
+      onNestedDialogOpen: handleNestedDialogOpen,
+      onNestedDialogClose: handleNestedDialogClose,
+      nestedOpenDialogCount: ownNestedOpenDialogs,
+      openMethod,
+      mounted,
+      transitionStatus,
+      getTriggerProps,
+      getPopupProps: getFloatingProps,
+      setTriggerElement,
+      setPopupElement,
+      popupRef,
+      backdropRef,
+      internalBackdropRef,
+      floatingRootContext: context2
+    };
+  }, [modal, setOpen, open, titleElementId, descriptionElementId, handleNestedDialogOpen, handleNestedDialogClose, ownNestedOpenDialogs, openMethod, mounted, transitionStatus, getTriggerProps, getFloatingProps, context2]);
+}
+const DialogRoot = function DialogRoot2(props) {
+  const {
+    children,
+    defaultOpen = false,
+    dismissible = true,
+    modal = true,
+    onOpenChange,
+    open,
+    actionsRef,
+    onOpenChangeComplete
+  } = props;
+  const parentDialogRootContext = useOptionalDialogRootContext();
+  const dialogRoot = useDialogRoot({
+    open,
+    defaultOpen,
+    onOpenChange,
+    modal,
+    dismissible,
+    actionsRef,
+    onOpenChangeComplete,
+    onNestedDialogClose: parentDialogRootContext?.onNestedDialogClose,
+    onNestedDialogOpen: parentDialogRootContext?.onNestedDialogOpen
+  });
+  const nested = Boolean(parentDialogRootContext);
+  const dialogContextValue = React.useMemo(() => ({
+    ...dialogRoot,
+    nested,
+    onOpenChangeComplete
+  }), [dialogRoot, nested, onOpenChangeComplete]);
+  const dialogRootContextValue = React.useMemo(() => ({
+    dismissible
+  }), [dismissible]);
+  return /* @__PURE__ */ jsx(DialogContext.Provider, {
+    value: dialogContextValue,
+    children: /* @__PURE__ */ jsx(DialogRootContext.Provider, {
+      value: dialogRootContextValue,
+      children
+    })
+  });
+};
+process.env.NODE_ENV !== "production" ? DialogRoot.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A ref to imperative actions.
+   */
+  actionsRef: PropTypes.shape({
+    current: PropTypes.shape({
+      unmount: PropTypes.func.isRequired
+    }).isRequired
+  }),
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * Whether the dialog is initially open.
+   *
+   * To render a controlled dialog, use the `open` prop instead.
+   * @default false
+   */
+  defaultOpen: PropTypes.bool,
+  /**
+   * Determines whether the dialog should close on outside clicks.
+   * @default true
+   */
+  dismissible: PropTypes.bool,
+  /**
+   * Whether the dialog should prevent outside clicks and lock page scroll when open.
+   * @default true
+   */
+  modal: PropTypes.bool,
+  /**
+   * Event handler called when the dialog is opened or closed.
+   */
+  onOpenChange: PropTypes.func,
+  /**
+   * Event handler called after any animations complete when the dialog is opened or closed.
+   */
+  onOpenChangeComplete: PropTypes.func,
+  /**
+   * Whether the dialog is currently open.
+   */
+  open: PropTypes.bool
+} : void 0;
+function DialogDriver() {
+  const grid = useGrid$1();
+  const frames = grid.state.dialogFrames.use();
+  const frameId = grid.state.internal.dialogFrameOpen.use();
+  const frame = frameId ? frames[frameId] : null;
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    if (!frame) {
+      setOpen(false);
+      return;
+    }
+    setOpen(true);
+  }, [frame]);
+  return /* @__PURE__ */ jsx(
+    DialogRoot,
+    {
+      open,
+      onOpenChange: (c) => setOpen(c),
+      onOpenChangeComplete: (c) => {
+        if (!c) grid.api.dialogFrameClose();
+      },
+      children: /* @__PURE__ */ jsx(DialogPortal, { children: frame && /* @__PURE__ */ jsx(frame.component, { api: grid.api, frame }) })
+    }
+  );
+}
+const OPEN_DELAY = 300;
+function usePopoverRoot(params) {
+  const {
+    open: externalOpen,
+    onOpenChange: onOpenChangeProp,
+    defaultOpen = false,
+    delay,
+    closeDelay,
+    openOnHover = false,
+    onOpenChangeComplete,
+    modal
+  } = params;
+  const delayWithDefault = delay ?? OPEN_DELAY;
+  const closeDelayWithDefault = closeDelay ?? 0;
+  const [instantType, setInstantType] = React.useState();
+  const [titleId, setTitleId] = React.useState();
+  const [descriptionId, setDescriptionId] = React.useState();
+  const [triggerElement, setTriggerElement] = React.useState(null);
+  const [positionerElement, setPositionerElement] = React.useState(null);
+  const [openReason, setOpenReason] = React.useState(null);
+  const [stickIfOpen, setStickIfOpen] = React.useState(true);
+  const popupRef = React.useRef(null);
+  const stickIfOpenTimeoutRef = React.useRef(-1);
+  const [open, setOpenUnwrapped] = useControlled({
+    controlled: externalOpen,
+    default: defaultOpen,
+    name: "Popover",
+    state: "open"
+  });
+  const onOpenChange = useEventCallback(onOpenChangeProp);
+  const {
+    mounted,
+    setMounted,
+    transitionStatus
+  } = useTransitionStatus(open);
+  useScrollLock(open && modal && openReason !== "hover", triggerElement);
+  const setOpen = useEventCallback((nextOpen, event, reason) => {
+    onOpenChange(nextOpen, event, reason);
+    setOpenUnwrapped(nextOpen);
+    if (nextOpen) {
+      setOpenReason(reason ?? null);
+    }
+  });
+  const handleUnmount = useEventCallback(() => {
+    setMounted(false);
+    setStickIfOpen(true);
+    setOpenReason(null);
+    onOpenChangeComplete?.(false);
+  });
+  useOpenChangeComplete({
+    enabled: !params.actionsRef,
+    open,
+    ref: popupRef,
+    onComplete() {
+      if (!open) {
+        handleUnmount();
+      }
+    }
+  });
+  React.useImperativeHandle(params.actionsRef, () => ({
+    unmount: handleUnmount
+  }), [handleUnmount]);
+  const clearStickIfOpenTimeout = useEventCallback(() => {
+    clearTimeout(stickIfOpenTimeoutRef.current);
+  });
+  React.useEffect(() => {
+    if (!open) {
+      clearStickIfOpenTimeout();
+    }
+  }, [clearStickIfOpenTimeout, open]);
+  React.useEffect(() => {
+    return clearStickIfOpenTimeout;
+  }, [clearStickIfOpenTimeout]);
+  const context2 = useFloatingRootContext({
+    elements: {
+      reference: triggerElement,
+      floating: positionerElement
+    },
+    open,
+    onOpenChange(openValue, eventValue, reasonValue) {
+      const isHover = reasonValue === "hover" || reasonValue === "safe-polygon";
+      const isKeyboardClick = reasonValue === "click" && eventValue.detail === 0;
+      const isDismissClose = !openValue && (reasonValue === "escape-key" || reasonValue == null);
+      function changeState() {
+        setOpen(openValue, eventValue, translateOpenChangeReason(reasonValue));
+      }
+      if (isHover) {
+        setStickIfOpen(true);
+        clearStickIfOpenTimeout();
+        stickIfOpenTimeoutRef.current = window.setTimeout(() => {
+          setStickIfOpen(false);
+        }, PATIENT_CLICK_THRESHOLD);
+        ReactDOM.flushSync(changeState);
+      } else {
+        changeState();
+      }
+      if (isKeyboardClick || isDismissClose) {
+        setInstantType(isKeyboardClick ? "click" : "dismiss");
+      } else {
+        setInstantType(void 0);
+      }
+    }
+  });
+  const {
+    openMethod,
+    triggerProps
+  } = useOpenInteractionType(open);
+  const computedRestMs = delayWithDefault;
+  const hover = useHover(context2, {
+    enabled: openOnHover && (openMethod !== "touch" || openReason !== "click"),
+    mouseOnly: true,
+    move: false,
+    handleClose: safePolygon({
+      blockPointerEvents: true
+    }),
+    restMs: computedRestMs,
+    delay: {
+      close: closeDelayWithDefault
+    }
+  });
+  const click = useClick(context2, {
+    stickIfOpen
+  });
+  const dismiss = useDismiss(context2);
+  const role = useRole(context2);
+  const {
+    getReferenceProps,
+    getFloatingProps
+  } = useInteractions([hover, click, dismiss, role]);
+  const getRootTriggerProps = React.useCallback((externalProps = {}) => getReferenceProps(mergeProps(triggerProps, externalProps)), [getReferenceProps, triggerProps]);
+  return React.useMemo(() => ({
+    open,
+    setOpen,
+    mounted,
+    setMounted,
+    transitionStatus,
+    setTriggerElement,
+    positionerElement,
+    setPositionerElement,
+    popupRef,
+    titleId,
+    setTitleId,
+    descriptionId,
+    setDescriptionId,
+    getRootTriggerProps,
+    getRootPopupProps: getFloatingProps,
+    floatingRootContext: context2,
+    instantType,
+    openMethod,
+    openReason,
+    onOpenChangeComplete
+  }), [open, setOpen, mounted, setMounted, transitionStatus, positionerElement, titleId, descriptionId, getRootTriggerProps, getFloatingProps, context2, instantType, openMethod, openReason, onOpenChangeComplete]);
+}
+const PopoverRoot = function PopoverRoot2(props) {
+  const {
+    defaultOpen = false,
+    onOpenChange,
+    open,
+    openOnHover = false,
+    delay,
+    closeDelay = 0,
+    actionsRef,
+    onOpenChangeComplete,
+    modal = false
+  } = props;
+  const delayWithDefault = delay ?? OPEN_DELAY;
+  const popoverRoot = usePopoverRoot({
+    ...props,
+    defaultOpen,
+    onOpenChange,
+    open,
+    openOnHover,
+    onOpenChangeComplete,
+    delay: delayWithDefault,
+    closeDelay,
+    actionsRef,
+    modal
+  });
+  const contextValue = React.useMemo(() => ({
+    ...popoverRoot,
+    openOnHover,
+    delay: delayWithDefault,
+    closeDelay,
+    modal
+  }), [popoverRoot, openOnHover, delayWithDefault, closeDelay, modal]);
+  return /* @__PURE__ */ jsx(PopoverRootContext.Provider, {
+    value: contextValue,
+    children: props.children
+  });
+};
+process.env.NODE_ENV !== "production" ? PopoverRoot.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A ref to imperative actions.
+   */
+  actionsRef: PropTypes.shape({
+    current: PropTypes.shape({
+      unmount: PropTypes.func.isRequired
+    }).isRequired
+  }),
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * How long to wait before closing the popover that was opened on hover.
+   * Specified in milliseconds.
+   *
+   * Requires the `openOnHover` prop.
+   * @default 0
+   */
+  closeDelay: PropTypes.number,
+  /**
+   * Whether the popover is initially open.
+   *
+   * To render a controlled popover, use the `open` prop instead.
+   * @default false
+   */
+  defaultOpen: PropTypes.bool,
+  /**
+   * How long to wait before the popover may be opened on hover. Specified in milliseconds.
+   *
+   * Requires the `openOnHover` prop.
+   * @default 300
+   */
+  delay: PropTypes.number,
+  /**
+   * Whether the popover should prevent outside clicks and lock page scroll when open.
+   * @default false
+   */
+  modal: PropTypes.bool,
+  /**
+   * Event handler called when the popover is opened or closed.
+   */
+  onOpenChange: PropTypes.func,
+  /**
+   * Event handler called after any animations complete when the popover is opened or closed.
+   */
+  onOpenChangeComplete: PropTypes.func,
+  /**
+   * Whether the popover is currently open.
+   */
+  open: PropTypes.bool,
+  /**
+   * Whether the popover should also open when the trigger is hovered.
+   * @default false
+   */
+  openOnHover: PropTypes.bool
+} : void 0;
+function PopoverPortal(props) {
+  const {
+    children,
+    keepMounted = false,
+    container
+  } = props;
+  const {
+    mounted
+  } = usePopoverRootContext();
+  const shouldRender = mounted || keepMounted;
+  if (!shouldRender) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(PopoverPortalContext.Provider, {
+    value: keepMounted,
+    children: /* @__PURE__ */ jsx(FloatingPortal, {
+      root: container,
+      children
+    })
+  });
+}
+process.env.NODE_ENV !== "production" ? PopoverPortal.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * A parent element to render the portal element into.
+   */
+  container: PropTypes.oneOfType([HTMLElementType, refType]),
+  /**
+   * Whether to keep the portal mounted in the DOM while the popup is hidden.
+   * @default false
+   */
+  keepMounted: PropTypes.bool
+} : void 0;
+function PopoverDriver() {
+  const grid = useGrid$1();
+  const frames = grid.state.popoverFrames.use();
+  const frameId = grid.state.internal.popoverFrameOpen.use();
+  const frameBB = grid.state.internal.popoverFrameBB.use();
+  const frame = frameId ? frames[frameId] : null;
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    if (!frame || !frameBB) {
+      setOpen(false);
+      return;
+    }
+    setOpen(true);
+  }, [frame, frameBB]);
+  return /* @__PURE__ */ jsx(
+    PopoverRoot,
+    {
+      open,
+      onOpenChange: (c) => setOpen(c),
+      onOpenChangeComplete: (c) => {
+        if (!c) grid.api.popoverFrameClose();
+      },
+      children: /* @__PURE__ */ jsx(AnchorProvider, { anchor: frameBB, children: /* @__PURE__ */ jsx(PopoverPortal, { children: frame && frameBB && /* @__PURE__ */ jsx(frame.component, { api: grid.api, frame }) }) })
+    }
+  );
+}
+function LyteNyteGrid({ grid, frameAxe }) {
+  return /* @__PURE__ */ jsx(GridProvider, { value: grid, children: /* @__PURE__ */ jsxs(GridFrame, { grid, axe: frameAxe, children: [
+    /* @__PURE__ */ jsx(LyteNyteProImpl, {}),
+    /* @__PURE__ */ jsx(ColumnMenuDriver, {}),
+    /* @__PURE__ */ jsx(ContextMenuDriver, {}),
+    /* @__PURE__ */ jsx(DialogDriver, {}),
+    /* @__PURE__ */ jsx(PopoverDriver, {})
+  ] }) });
+}
+function LyteNyteProImpl() {
+  const { state } = useGrid$1();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(OverlayDriver, {}),
+    /* @__PURE__ */ jsxs(Viewport, { top: Top, center: Center, bottom: Bottom, children: [
+      /* @__PURE__ */ jsx(CellSelectionDriver, {}),
+      /* @__PURE__ */ jsx(Watermark, { id: state.gridId.use() })
+    ] })
+  ] });
+}
+function Center() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(CellEditorCenter, {}),
+    /* @__PURE__ */ jsx(CellSelectionCenter, {})
+  ] });
+}
+function Top() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(CellEditorTop, {}),
+    /* @__PURE__ */ jsx(CellSelectionTop, {})
+  ] });
+}
+function Bottom() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(CellEditorBottom, {}),
+    /* @__PURE__ */ jsx(CellSelectionBottom, {})
+  ] });
+}
+const useLyteNytePro = (p2) => {
+  const [grid] = useState(() => {
+    const s3 = makeGridPro(p2);
+    const useSignalWatcher = (c, fn) => {
+      const signal2 = s3.state[c];
+      useEffect(() => {
+        const unsub = signal2.watch(fn);
+        return () => unsub();
+      }, [fn, signal2]);
+    };
+    const useEvent2 = (ev, fn) => {
+      useEffect(() => {
+        const unsub = s3.api.eventAddListener(ev, fn);
+        return () => unsub();
+      }, [ev, fn]);
+    };
+    return { ...s3, useSignalWatcher, useEvent: useEvent2 };
+  });
+  return grid;
+};
+const createClientDataSourceReact = (init) => {
+  return createClientDataSource(init);
+};
+function useClientDataSource(init) {
+  return useState(() => createClientDataSource(init))[0];
+}
+function useTreeDataSource(init) {
+  const [ds] = useState(() => {
+    return createTreeDataSource(init);
+  });
+  return ds;
+}
+export {
+  COLUMN_EMPTY_PREFIX,
+  y as COLUMN_GROUP_HEADER_HEIGHT,
+  q as COLUMN_GROUP_ID_DELIMITER,
+  z as COLUMN_HEADER_HEIGHT,
+  COLUMN_MARKER_ID,
+  A as COLUMN_SCAN_DISTANCE,
+  L as DEFAULT_MAX_WIDTH,
+  M as DEFAULT_MIN_WIDTH,
+  O as DEFAULT_SORT_CYCLE,
+  N as DEFAULT_WIDTH,
+  END_ENCODING,
+  FLOATING_CELL_POSITION,
+  FULL_ENCODING,
+  Q as FULL_WIDTH_POSITION,
+  GRID_CELL_POSITION,
+  v as GROUP_COLUMN_MULTI_PREFIX,
+  t as GROUP_COLUMN_PREFIX,
+  w as GROUP_COLUMN_SINGLE_ID,
+  x as GROUP_COLUMN_TREE_DATA,
+  HEADER_CELL_POSITION,
+  HEADER_GROUP_CELL_POSITION,
+  LyteNyteGrid,
+  P as PAGINATE_PAGE_SIZE,
+  r as ROW_DEFAULT_PATH_SEPARATOR,
+  J as ROW_DETAIL_HEIGHT,
+  o as ROW_GROUP_KIND,
+  B as ROW_HEIGHT,
+  R as ROW_LEAF_KIND,
+  s as ROW_TOTAL_ID,
+  p as ROW_TOTAL_KIND,
+  K as ROW_UPDATE_STACK_SIZE,
+  activateLicense,
+  createClientDataSourceReact,
+  hasAValidLicense,
+  useClientDataSource,
+  useLyteNytePro,
+  useTreeDataSource
+};