@lostgradient/cinder 0.4.0 → 0.4.1

package/dist/server/index.server-68hbjs6n.js

@@ -0,0 +1,1642 @@
+import {
+  Virtualizer
+} from "./index.server-ny1hfypg.js";
+import {
+  copyToClipboard
+} from "./index.server-vmsmaztb.js";
+import {
+  classNames
+} from "./index.server-z7nvkz8v.js";
+
+// src/components/data-grid/data-grid.svelte
+import * as $4 from "svelte/internal/server";
+import { tick } from "svelte";
+
+// src/components/data-grid/_internal/column-model.svelte.ts
+import * as $ from "svelte/internal/server";
+var DEFAULT_DATA_GRID_COLUMN_WIDTH = 150;
+var DEFAULT_DATA_GRID_COLUMN_MIN_WIDTH = 60;
+
+class DataGridColumnModel {
+  columns;
+  columnOrder;
+  columnSizing;
+  columnPinning;
+  constructor(options) {
+    this.columns = options.columns;
+    this.columnOrder = options.columnOrder;
+    this.columnSizing = options.columnSizing;
+    this.columnPinning = options.columnPinning;
+  }
+  #orderedColumns = $.derived(() => orderColumns(this.columns(), this.columnOrder()).map((column, index) => resolveColumn(column, index, this.columnSizing(), this.columnPinning())));
+  get orderedColumns() {
+    return this.#orderedColumns();
+  }
+  set orderedColumns($$value) {
+    return this.#orderedColumns($$value);
+  }
+  #leftPinnedColumns = $.derived(() => withPinOffsets(this.orderedColumns.filter((column) => column.pin === "left"), "left"));
+  get leftPinnedColumns() {
+    return this.#leftPinnedColumns();
+  }
+  set leftPinnedColumns($$value) {
+    return this.#leftPinnedColumns($$value);
+  }
+  #rightPinnedColumns = $.derived(() => withPinOffsets(this.orderedColumns.filter((column) => column.pin === "right"), "right"));
+  get rightPinnedColumns() {
+    return this.#rightPinnedColumns();
+  }
+  set rightPinnedColumns($$value) {
+    return this.#rightPinnedColumns($$value);
+  }
+  #leftPinnedWidth = $.derived(() => totalColumnWidth(this.leftPinnedColumns));
+  get leftPinnedWidth() {
+    return this.#leftPinnedWidth();
+  }
+  set leftPinnedWidth($$value) {
+    return this.#leftPinnedWidth($$value);
+  }
+  #rightPinnedWidth = $.derived(() => totalColumnWidth(this.rightPinnedColumns));
+  get rightPinnedWidth() {
+    return this.#rightPinnedWidth();
+  }
+  set rightPinnedWidth($$value) {
+    return this.#rightPinnedWidth($$value);
+  }
+  #unpinnedColumns = $.derived(() => this.orderedColumns.filter((column) => column.pin === undefined));
+  get unpinnedColumns() {
+    return this.#unpinnedColumns();
+  }
+  set unpinnedColumns($$value) {
+    return this.#unpinnedColumns($$value);
+  }
+  #renderColumns = $.derived(() => {
+    return withRenderColIndexes([
+      ...this.leftPinnedColumns,
+      ...this.unpinnedColumns,
+      ...this.rightPinnedColumns
+    ]);
+  });
+  get renderColumns() {
+    return this.#renderColumns();
+  }
+  set renderColumns($$value) {
+    return this.#renderColumns($$value);
+  }
+}
+function orderColumns(columns, columnOrder) {
+  assertUniqueColumnKeys(columns);
+  if (!columnOrder || columnOrder.length === 0)
+    return columns;
+  const byKey = new Map(columns.map((column) => [column.key, column]));
+  const ordered = columnOrder.flatMap((key) => {
+    const column = byKey.get(key);
+    if (!column)
+      return [];
+    byKey.delete(key);
+    return [column];
+  });
+  return [...ordered, ...byKey.values()];
+}
+function assertUniqueColumnKeys(columns) {
+  const seenColumnKeys = new Set;
+  for (const column of columns) {
+    if (seenColumnKeys.has(column.key)) {
+      throw new Error(`[cinder-data-grid] DataGrid column keys must be unique. Duplicate column key: ${JSON.stringify(column.key)}.`);
+    }
+    seenColumnKeys.add(column.key);
+  }
+}
+function resolveColumn(column, index, columnSizing, columnPinning) {
+  const minWidth = Math.max(0, finiteNumberOrFallback(column.minWidth, DEFAULT_DATA_GRID_COLUMN_MIN_WIDTH));
+  const baseWidth = finiteNumberOrFallback(columnSizing?.[column.key] ?? column.width, DEFAULT_DATA_GRID_COLUMN_WIDTH);
+  const maxWidth = Math.max(minWidth, finiteNumberOrFallback(column.maxWidth, Number.POSITIVE_INFINITY));
+  const pin = resolveColumnPin(column, columnPinning);
+  const resolvedColumn = {
+    key: column.key,
+    header: column.header,
+    minWidth,
+    width: Math.min(Math.max(baseWidth, minWidth), maxWidth),
+    colIndex: index + 1,
+    renderIndex: index + 1,
+    pinOffset: 0
+  };
+  if (column.cell !== undefined)
+    resolvedColumn.cell = column.cell;
+  if (column.maxWidth !== undefined)
+    resolvedColumn.maxWidth = column.maxWidth;
+  if (column.rowHeader !== undefined)
+    resolvedColumn.rowHeader = column.rowHeader;
+  if (column.sortable !== undefined)
+    resolvedColumn.sortable = column.sortable;
+  if (column.sortComparator !== undefined)
+    resolvedColumn.sortComparator = column.sortComparator;
+  if (column.getValue !== undefined)
+    resolvedColumn.getValue = column.getValue;
+  if (pin !== undefined)
+    return { ...resolvedColumn, pin };
+  const { pin: _pin, ...unpinnedColumn } = resolvedColumn;
+  return unpinnedColumn;
+}
+function finiteNumberOrFallback(value, fallback) {
+  return typeof value === "number" && Number.isFinite(value) ? value : fallback;
+}
+function resolveColumnPin(column, columnPinning) {
+  if (columnPinning?.left?.includes(column.key))
+    return "left";
+  if (columnPinning?.right?.includes(column.key))
+    return "right";
+  return column.pin;
+}
+function withPinOffsets(columns, pin) {
+  if (pin === "left") {
+    let offset2 = 0;
+    return columns.map((column) => {
+      const nextColumn = { ...column, pinOffset: offset2 };
+      offset2 += column.width;
+      return nextColumn;
+    });
+  }
+  let offset = 0;
+  const columnsWithOffsets = [];
+  for (let index = columns.length - 1;index >= 0; index -= 1) {
+    const column = columns[index];
+    if (!column)
+      continue;
+    columnsWithOffsets.unshift({ ...column, pinOffset: offset });
+    offset += column.width;
+  }
+  return columnsWithOffsets;
+}
+function withRenderColIndexes(columns) {
+  return columns.map((column, index) => ({ ...column, renderIndex: index + 1 }));
+}
+function totalColumnWidth(columns) {
+  return columns.reduce((totalWidth, column) => totalWidth + column.width, 0);
+}
+function getDataGridColumnValue(row, column) {
+  if (column.getValue)
+    return column.getValue(row);
+  if (row !== null && typeof row === "object" && Object.hasOwn(row, column.key)) {
+    const value = Reflect.get(row, column.key);
+    return value;
+  }
+  return;
+}
+
+// src/components/data-grid/_internal/keyboard-model.ts
+function dataGridKeyToAction(event, context) {
+  const { activeRowIndex, activeColumnIndex, rowCount, columnCount, pageSize = 10 } = context;
+  if (rowCount === 0 || columnCount === 0)
+    return;
+  const extend = event.shiftKey;
+  const isCommand = event.ctrlKey || event.metaKey;
+  if (isCommand && event.key.toLowerCase() === "a")
+    return { type: "select-all" };
+  if (isCommand && event.key.toLowerCase() === "c")
+    return { type: "copy-selection" };
+  if (event.key === "Escape")
+    return { type: "collapse-selection" };
+  if (event.key === "Enter" || event.key === " ")
+    return { type: "select-active-cell" };
+  if (event.key === "ArrowRight") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex,
+      columnIndex: activeColumnIndex + 1,
+      extend
+    };
+  }
+  if (event.key === "ArrowLeft") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex,
+      columnIndex: activeColumnIndex - 1,
+      extend
+    };
+  }
+  if (event.key === "ArrowDown") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex + 1,
+      columnIndex: activeColumnIndex,
+      extend
+    };
+  }
+  if (event.key === "ArrowUp") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex - 1,
+      columnIndex: activeColumnIndex,
+      extend
+    };
+  }
+  if (event.key === "Home") {
+    return {
+      type: "move-cell",
+      rowIndex: isCommand ? 0 : activeRowIndex,
+      columnIndex: 0,
+      extend
+    };
+  }
+  if (event.key === "End") {
+    return {
+      type: "move-cell",
+      rowIndex: isCommand ? rowCount - 1 : activeRowIndex,
+      columnIndex: columnCount - 1,
+      extend
+    };
+  }
+  if (event.key === "PageDown") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex + pageSize,
+      columnIndex: activeColumnIndex,
+      extend
+    };
+  }
+  if (event.key === "PageUp") {
+    return {
+      type: "move-cell",
+      rowIndex: activeRowIndex - pageSize,
+      columnIndex: activeColumnIndex,
+      extend
+    };
+  }
+  if (event.key === "Tab") {
+    const direction = event.shiftKey ? -1 : 1;
+    const nextCellIndex = activeRowIndex * columnCount + activeColumnIndex + direction;
+    const lastCellIndex = rowCount * columnCount - 1;
+    if (nextCellIndex < 0 || nextCellIndex > lastCellIndex)
+      return;
+    return {
+      type: "move-cell",
+      rowIndex: Math.floor(nextCellIndex / columnCount),
+      columnIndex: nextCellIndex % columnCount,
+      extend: false
+    };
+  }
+  return;
+}
+
+// src/components/data-grid/_internal/selection-model.svelte.ts
+import * as $2 from "svelte/internal/server";
+
+// src/components/data-grid/_internal/geometry.ts
+function getCellCoordinateKey(cell) {
+  return `${cell.rowId}\x00${cell.columnKey}`;
+}
+function computeCellRange(anchor, focus, rowIds, columnKeys) {
+  const anchorRowIndex = rowIds.indexOf(anchor.rowId);
+  const focusRowIndex = rowIds.indexOf(focus.rowId);
+  const anchorColumnIndex = columnKeys.indexOf(anchor.columnKey);
+  const focusColumnIndex = columnKeys.indexOf(focus.columnKey);
+  if (anchorRowIndex < 0 || focusRowIndex < 0 || anchorColumnIndex < 0 || focusColumnIndex < 0) {
+    return;
+  }
+  const startRowIndex = Math.min(anchorRowIndex, focusRowIndex);
+  const endRowIndex = Math.max(anchorRowIndex, focusRowIndex);
+  const startColumnIndex = Math.min(anchorColumnIndex, focusColumnIndex);
+  const endColumnIndex = Math.max(anchorColumnIndex, focusColumnIndex);
+  return {
+    anchor,
+    focus,
+    rowIds: rowIds.slice(startRowIndex, endRowIndex + 1),
+    columnKeys: columnKeys.slice(startColumnIndex, endColumnIndex + 1),
+    startRowIndex,
+    endRowIndex,
+    startColumnIndex,
+    endColumnIndex
+  };
+}
+function getCellsInRange(range) {
+  if (!range)
+    return [];
+  return range.rowIds.flatMap((rowId) => range.columnKeys.map((columnKey) => ({
+    rowId,
+    columnKey
+  })));
+}
+function clampCellCoordinate(cell, rowIds, columnKeys) {
+  if (rowIds.length === 0 || columnKeys.length === 0)
+    return;
+  const rowIndex = rowIds.indexOf(cell.rowId);
+  const columnIndex = columnKeys.indexOf(cell.columnKey);
+  if (rowIndex < 0 || columnIndex < 0)
+    return;
+  return {
+    rowId: rowIds[Math.min(Math.max(rowIndex, 0), rowIds.length - 1)] ?? rowIds[0],
+    columnKey: columnKeys[Math.min(Math.max(columnIndex, 0), columnKeys.length - 1)] ?? columnKeys[0]
+  };
+}
+
+// src/components/data-grid/_internal/selection-model.svelte.ts
+class DataGridSelectionModel {
+  rowIds;
+  columnKeys;
+  activeCell;
+  anchorCell;
+  toggledCells = [];
+  constructor(options) {
+    this.rowIds = options.rowIds;
+    this.columnKeys = options.columnKeys;
+  }
+  #range = $2.derived(() => {
+    if (!this.anchorCell || !this.activeCell)
+      return;
+    return computeCellRange(this.anchorCell, this.activeCell, this.rowIds(), this.columnKeys());
+  });
+  get range() {
+    return this.#range();
+  }
+  set range($$value) {
+    return this.#range($$value);
+  }
+  #selectedCellCoordinates = $2.derived(() => {
+    const cellsByKey = new Map;
+    for (const cell of getCellsInRange(this.range))
+      cellsByKey.set(getCellCoordinateKey(cell), cell);
+    for (const cell of this.toggledCells) {
+      if (clampCellCoordinate(cell, this.rowIds(), this.columnKeys())) {
+        cellsByKey.set(getCellCoordinateKey(cell), cell);
+      }
+    }
+    return [...cellsByKey.values()];
+  });
+  get selectedCellCoordinates() {
+    return this.#selectedCellCoordinates();
+  }
+  set selectedCellCoordinates($$value) {
+    return this.#selectedCellCoordinates($$value);
+  }
+  #selectedCells = $2.derived(() => {
+    const keys = new Set;
+    for (const cell of this.selectedCellCoordinates)
+      keys.add(getCellCoordinateKey(cell));
+    return keys;
+  });
+  get selectedCells() {
+    return this.#selectedCells();
+  }
+  set selectedCells($$value) {
+    return this.#selectedCells($$value);
+  }
+  setActiveCell(cell, options = {}) {
+    if (options.toggle) {
+      this.materializeRangeSelection();
+      this.toggleCell(cell);
+      this.activeCell = cell;
+      this.anchorCell = undefined;
+      return;
+    }
+    if (options.extend) {
+      if (!this.anchorCell)
+        this.anchorCell = this.activeCell ?? cell;
+      this.activeCell = cell;
+      return;
+    }
+    this.anchorCell = cell;
+    this.toggledCells = [];
+    this.activeCell = cell;
+  }
+  selectAll() {
+    const firstRowId = this.rowIds()[0];
+    const lastRowId = this.rowIds().at(-1);
+    const firstColumnKey = this.columnKeys()[0];
+    const lastColumnKey = this.columnKeys().at(-1);
+    if (firstRowId === undefined || lastRowId === undefined || firstColumnKey === undefined || lastColumnKey === undefined) {
+      return;
+    }
+    this.anchorCell = { rowId: firstRowId, columnKey: firstColumnKey };
+    this.activeCell = { rowId: lastRowId, columnKey: lastColumnKey };
+    this.toggledCells = [];
+  }
+  collapseToActiveCell() {
+    if (!this.activeCell)
+      return;
+    this.anchorCell = this.activeCell;
+    this.toggledCells = [];
+  }
+  isCellSelected(cell) {
+    return this.selectedCells.has(getCellCoordinateKey(cell));
+  }
+  isAnchorCell(cell) {
+    if (!this.anchorCell)
+      return false;
+    return getCellCoordinateKey(this.anchorCell) === getCellCoordinateKey(cell);
+  }
+  reconcile(fallbackCell) {
+    const rowIds = this.rowIds();
+    const columnKeys = this.columnKeys();
+    if (rowIds.length === 0 || columnKeys.length === 0) {
+      this.activeCell = undefined;
+      this.anchorCell = undefined;
+      this.toggledCells = [];
+      return;
+    }
+    const hadActiveCell = this.activeCell !== undefined;
+    const hadAnchorCell = this.anchorCell !== undefined;
+    const reconciledActiveCell = this.activeCell && clampCellCoordinate(this.activeCell, rowIds, columnKeys);
+    const nextActiveCell = reconciledActiveCell ?? fallbackCell;
+    if (!areCellsEqual(this.activeCell, nextActiveCell))
+      this.activeCell = nextActiveCell;
+    const nextAnchorCell = (this.anchorCell && clampCellCoordinate(this.anchorCell, rowIds, columnKeys)) ?? (hadAnchorCell || !hadActiveCell ? nextActiveCell : undefined);
+    if (!areCellsEqual(this.anchorCell, nextAnchorCell))
+      this.anchorCell = nextAnchorCell;
+    const nextToggledCells = this.toggledCells.filter((cell) => clampCellCoordinate(cell, rowIds, columnKeys));
+    if (nextToggledCells.length !== this.toggledCells.length) {
+      this.toggledCells = nextToggledCells;
+    }
+  }
+  materializeRangeSelection() {
+    const rangeCells = getCellsInRange(this.range);
+    if (rangeCells.length <= 1)
+      return;
+    const cellsByKey = new Map(this.toggledCells.map((toggledCell) => [getCellCoordinateKey(toggledCell), toggledCell]));
+    for (const cell of rangeCells)
+      cellsByKey.set(getCellCoordinateKey(cell), cell);
+    this.toggledCells = [...cellsByKey.values()];
+  }
+  toggleCell(cell) {
+    const key = getCellCoordinateKey(cell);
+    const cellsByKey = new Map(this.toggledCells.map((toggledCell) => [getCellCoordinateKey(toggledCell), toggledCell]));
+    if (cellsByKey.has(key))
+      cellsByKey.delete(key);
+    else
+      cellsByKey.set(key, cell);
+    this.toggledCells = [...cellsByKey.values()];
+  }
+}
+function areCellsEqual(left, right) {
+  if (left === undefined && right === undefined)
+    return true;
+  if (!left || !right)
+    return false;
+  return left.rowId === right.rowId && left.columnKey === right.columnKey;
+}
+
+// src/components/data-grid/_internal/sort-model.ts
+var sortCollator = new Intl.Collator(undefined, { numeric: true, sensitivity: "base" });
+function getNextDataGridSortModel(currentSortModel, columnKey, multiSort) {
+  const currentIndex = currentSortModel.findIndex((item) => item.key === columnKey);
+  const currentItem = currentIndex >= 0 ? currentSortModel[currentIndex] : undefined;
+  const nextDirection = getNextSortDirection(currentItem?.direction);
+  if (!multiSort) {
+    return nextDirection === undefined ? [] : [{ key: columnKey, direction: nextDirection }];
+  }
+  if (currentIndex < 0)
+    return [...currentSortModel, { key: columnKey, direction: "ascending" }];
+  if (nextDirection === undefined)
+    return currentSortModel.filter((item) => item.key !== columnKey);
+  return currentSortModel.map((item, index) => index === currentIndex ? { key: columnKey, direction: nextDirection } : item);
+}
+function getActiveDataGridSortModel(columns, sortModel) {
+  return sortModel.filter((item) => columns.some((column) => column.sortable && column.key === item.key));
+}
+function getSortedDataGridRowIndices(rows, columns, sortModel) {
+  const rowIndices = rows.map((_, index) => index);
+  const activeSortItems = getActiveDataGridSortModel(columns, sortModel).flatMap((item) => {
+    const column = columns.find((candidate) => candidate.key === item.key);
+    return column === undefined ? [] : [{ column, direction: item.direction }];
+  });
+  if (activeSortItems.length === 0)
+    return rowIndices;
+  const sortedRowIndices = rowIndices.slice();
+  sortedRowIndices.sort((leftIndex, rightIndex) => {
+    const leftRow = rows[leftIndex];
+    const rightRow = rows[rightIndex];
+    if (leftRow === undefined || rightRow === undefined)
+      return leftIndex - rightIndex;
+    for (const { column, direction } of activeSortItems) {
+      const leftValue = getDataGridColumnValue(leftRow, column);
+      const rightValue = getDataGridColumnValue(rightRow, column);
+      if (isNullishSortValue(leftValue) || isNullishSortValue(rightValue)) {
+        const comparison2 = compareDataGridValues(leftValue, rightValue, direction);
+        if (comparison2 !== 0)
+          return comparison2;
+        continue;
+      }
+      const comparison = column.sortComparator ? column.sortComparator(leftValue, rightValue, leftRow, rightRow) : compareDataGridValues(leftValue, rightValue, direction);
+      if (comparison !== 0) {
+        return column.sortComparator && direction === "descending" ? -comparison : comparison;
+      }
+    }
+    return leftIndex - rightIndex;
+  });
+  return sortedRowIndices;
+}
+function compareDataGridValues(leftValue, rightValue, direction = "ascending") {
+  if (Object.is(leftValue, rightValue))
+    return 0;
+  const leftValueIsNullish = isNullishSortValue(leftValue);
+  const rightValueIsNullish = isNullishSortValue(rightValue);
+  if (leftValueIsNullish && rightValueIsNullish)
+    return 0;
+  if (leftValueIsNullish)
+    return 1;
+  if (rightValueIsNullish)
+    return -1;
+  const leftNumber = getComparableNumber(leftValue);
+  const rightNumber = getComparableNumber(rightValue);
+  if (leftNumber !== undefined && rightNumber !== undefined) {
+    return direction === "ascending" ? leftNumber - rightNumber : rightNumber - leftNumber;
+  }
+  const comparison = sortCollator.compare(getComparableLabel(leftValue), getComparableLabel(rightValue));
+  return direction === "ascending" ? comparison : -comparison;
+}
+function getNextSortDirection(currentDirection) {
+  if (currentDirection === undefined)
+    return "ascending";
+  if (currentDirection === "ascending")
+    return "descending";
+  return;
+}
+function getComparableNumber(value) {
+  if (typeof value === "number" && Number.isFinite(value))
+    return value;
+  if (value instanceof Date) {
+    const time = value.getTime();
+    return Number.isFinite(time) ? time : undefined;
+  }
+  return;
+}
+function getComparableLabel(value) {
+  if (typeof value === "string")
+    return value;
+  if (typeof value === "number" || typeof value === "boolean" || typeof value === "bigint") {
+    return value.toString();
+  }
+  if (typeof value === "symbol")
+    return value.description ?? "";
+  if (value instanceof Date)
+    return value.toISOString();
+  return Object.prototype.toString.call(value);
+}
+function isNullishSortValue(value) {
+  return value === null || value === undefined || value instanceof Date && !Number.isFinite(value.getTime());
+}
+
+// src/components/data-grid/_internal/virtualization-adapter.svelte.ts
+import * as $3 from "svelte/internal/server";
+import { createSubscriber } from "svelte/reactivity";
+var defaultDataGridVirtualRowHeight = 44;
+
+class DataGridVirtualizationAdapter {
+  options;
+  #rowVirtualizer = null;
+  #columnVirtualizer = null;
+  #scrollElement = null;
+  #update = () => {};
+  #subscribe;
+  constructor(options) {
+    this.options = options;
+    this.#subscribe = createSubscriber((update) => {
+      if (typeof window === "undefined")
+        return;
+      this.#update = update;
+      this.#rowVirtualizer = new Virtualizer(this.#buildRowOptions());
+      this.#columnVirtualizer = new Virtualizer(this.#buildColumnOptions());
+      const cleanup = this.#rowVirtualizer._didMount();
+      const cleanupColumns = this.#columnVirtualizer._didMount();
+      this.#rowVirtualizer._willUpdate();
+      this.#columnVirtualizer._willUpdate();
+      update();
+      return () => {
+        cleanup();
+        cleanupColumns();
+        this.#rowVirtualizer = null;
+        this.#columnVirtualizer = null;
+      };
+    });
+  }
+  get virtualRows() {
+    if (typeof window === "undefined")
+      return [];
+    this.#subscribe();
+    this.#syncOptions();
+    const fallbackRows = this.#fallbackRows();
+    const virtualRows = this.#rowVirtualizer?.getVirtualItems();
+    const rows = this.#shouldUseFallbackRows(virtualRows, fallbackRows) ? fallbackRows : virtualRows ?? fallbackRows;
+    return rows.map(toDataGridVirtualItem);
+  }
+  get virtualColumns() {
+    if (typeof window === "undefined")
+      return [];
+    this.#subscribe();
+    this.#syncOptions();
+    const fallbackColumns = this.#fallbackColumns();
+    const virtualColumns = this.#columnVirtualizer?.getVirtualItems();
+    const columns = this.#shouldUseFallbackColumns(virtualColumns, fallbackColumns) ? fallbackColumns : virtualColumns ?? fallbackColumns;
+    return columns.map(toDataGridVirtualItem);
+  }
+  get totalHeight() {
+    if (typeof window === "undefined")
+      return this.options.getRowCount() * this.#rowHeight();
+    this.#subscribe();
+    this.#syncOptions();
+    return this.#rowVirtualizer?.getTotalSize() ?? this.options.getRowCount() * this.#rowHeight();
+  }
+  get totalWidth() {
+    if (typeof window === "undefined")
+      return this.#totalColumnWidth();
+    this.#subscribe();
+    this.#syncOptions();
+    return this.#columnVirtualizer?.getTotalSize() ?? this.#totalColumnWidth();
+  }
+  mountScrollContainer = (node) => {
+    this.#setScrollElement(node);
+    return () => {
+      if (this.#scrollElement === node) {
+        this.#setScrollElement(null);
+      }
+    };
+  };
+  measureElement = (node) => {
+    this.#syncOptions();
+    this.#rowVirtualizer?.measureElement(node);
+    return () => this.#rowVirtualizer?.measureElement(null);
+  };
+  refreshMeasurements() {
+    this.#subscribe();
+    this.#syncOptions();
+    this.#update();
+  }
+  scrollToRow(index, options = { align: "auto" }) {
+    this.#subscribe();
+    this.#syncOptions();
+    const element = this.#getScrollElement();
+    const shouldUseFallbackScroll = Boolean(element && (!this.#rowVirtualizer || element.clientHeight === 0));
+    this.#rowVirtualizer?.scrollToIndex(index, options);
+    if (!element || !shouldUseFallbackScroll)
+      return;
+    element.scrollTop = this.#scrollPaddingStart() + Math.max(0, index * this.#rowHeight());
+    element.dispatchEvent(new Event("scroll"));
+  }
+  scrollToColumn(index, options = { align: "auto" }) {
+    this.#subscribe();
+    this.#syncOptions();
+    const element = this.#getScrollElement();
+    const shouldUseFallbackScroll = Boolean(element && (!this.#columnVirtualizer || element.clientWidth === 0));
+    this.#columnVirtualizer?.scrollToIndex(index, options);
+    if (!element || !shouldUseFallbackScroll)
+      return;
+    element.scrollLeft = this.#columnStart(index);
+    element.dispatchEvent(new Event("scroll"));
+  }
+  #setScrollElement(element) {
+    if (this.#scrollElement === element)
+      return;
+    this.#scrollElement = element;
+    this.#syncOptions();
+    this.#update();
+  }
+  #syncOptions() {
+    if (this.#rowVirtualizer) {
+      this.#rowVirtualizer.setOptions(this.#buildRowOptions());
+      this.#rowVirtualizer._willUpdate();
+    }
+    if (this.#columnVirtualizer) {
+      this.#columnVirtualizer.setOptions(this.#buildColumnOptions());
+      this.#columnVirtualizer._willUpdate();
+    }
+  }
+  #buildRowOptions() {
+    return {
+      count: this.options.getRowCount(),
+      getScrollElement: this.#getScrollElement,
+      getItemKey: this.options.getRowKey,
+      estimateSize: () => this.#rowHeight(),
+      overscan: this.#overscan(),
+      initialRect: { width: 0, height: this.options.getInitialHeight() },
+      observeElementRect: this.#observeElementRect,
+      observeElementOffset: this.#observeElementOffset,
+      scrollToFn: this.#scrollToOffset,
+      measureElement: this.#measureElement,
+      onChange: () => this.#update(),
+      indexAttribute: "data-cinder-virtual-index",
+      scrollPaddingStart: this.#scrollPaddingStart()
+    };
+  }
+  #buildColumnOptions() {
+    return {
+      count: this.options.getColumnCount(),
+      getScrollElement: this.#getScrollElement,
+      getItemKey: this.options.getColumnKey,
+      estimateSize: (index) => this.#columnWidth(index),
+      overscan: this.#overscan(),
+      horizontal: true,
+      initialRect: { width: this.options.getInitialWidth(), height: 0 },
+      observeElementRect: this.#observeElementRect,
+      observeElementOffset: this.#observeElementHorizontalOffset,
+      scrollToFn: this.#scrollToHorizontalOffset,
+      onChange: () => this.#update(),
+      scrollPaddingStart: 0
+    };
+  }
+  #getScrollElement = () => this.#scrollElement ?? this.options.getScrollElement();
+  #scrollToOffset = (offset, { adjustments = 0, behavior }, instance) => {
+    const element = instance.scrollElement;
+    if (!element)
+      return;
+    const top = this.#scrollPaddingStart() + offset + adjustments;
+    if (typeof element.scrollTo === "function") {
+      element.scrollTo(behavior ? { top, behavior } : { top });
+      return;
+    }
+    element.scrollTop = top;
+  };
+  #scrollToHorizontalOffset = (offset, { adjustments = 0, behavior }, instance) => {
+    const element = instance.scrollElement;
+    if (!element)
+      return;
+    const left = offset + adjustments;
+    if (typeof element.scrollTo === "function") {
+      element.scrollTo(behavior ? { left, behavior } : { left });
+      return;
+    }
+    element.scrollLeft = left;
+  };
+  #observeElementRect = (instance, callback) => {
+    const element = instance.scrollElement;
+    if (!element)
+      return () => {};
+    const notify = () => {
+      const rect = element.getBoundingClientRect();
+      const scrollPaddingStart = this.#scrollPaddingStart();
+      const height = rect.height || element.clientHeight || this.options.getInitialHeight();
+      const width = rect.width || element.clientWidth || this.options.getInitialWidth();
+      callback({
+        width: Math.max(0, width - this.#scrollPaddingInlineStart() - this.#scrollPaddingInlineEnd()) || this.options.getInitialWidth(),
+        height: Math.max(0, height - scrollPaddingStart) || this.options.getInitialHeight()
+      });
+    };
+    notify();
+    if (typeof ResizeObserver === "undefined")
+      return () => {};
+    const observer = new ResizeObserver(notify);
+    observer.observe(element);
+    return () => observer.disconnect();
+  };
+  #observeElementOffset = (instance, callback) => {
+    const element = instance.scrollElement;
+    if (!element)
+      return () => {};
+    const notify = () => {
+      callback(this.#scrollOffset(element), true);
+      this.#update();
+    };
+    callback(this.#scrollOffset(element), false);
+    element.addEventListener("scroll", notify, { passive: true });
+    return () => element.removeEventListener("scroll", notify);
+  };
+  #observeElementHorizontalOffset = (instance, callback) => {
+    const element = instance.scrollElement;
+    if (!element)
+      return () => {};
+    const notify = () => {
+      callback(this.#horizontalScrollOffset(element), true);
+      this.#update();
+    };
+    callback(this.#horizontalScrollOffset(element), false);
+    element.addEventListener("scroll", notify, { passive: true });
+    return () => element.removeEventListener("scroll", notify);
+  };
+  #measureElement = (element) => {
+    const rect = element.getBoundingClientRect();
+    return rect.height || this.#rowHeight();
+  };
+  #fallbackRows() {
+    const count = this.options.getRowCount();
+    if (count === 0)
+      return [];
+    const rowHeight = this.#rowHeight();
+    const overscan = this.#overscan();
+    const scrollTop = this.#scrollOffset(this.#getScrollElement());
+    const visibleCount = Math.ceil(this.#viewportHeight() / rowHeight);
+    const startIndex = Math.max(0, Math.floor(scrollTop / rowHeight) - overscan);
+    const itemCount = Math.min(count - startIndex, visibleCount + overscan * 2);
+    return Array.from({ length: itemCount }, (_, offset) => {
+      const index = startIndex + offset;
+      return {
+        key: this.options.getRowKey(index),
+        index,
+        start: index * rowHeight,
+        end: (index + 1) * rowHeight,
+        size: rowHeight,
+        lane: 0
+      };
+    });
+  }
+  #fallbackColumns() {
+    const count = this.options.getColumnCount();
+    if (count === 0)
+      return [];
+    const overscan = this.#overscan();
+    const scrollLeft = this.#horizontalScrollOffset(this.#getScrollElement());
+    const viewportWidth = this.#viewportWidth();
+    const startIndex = Math.max(0, this.#columnIndexAtOffset(scrollLeft) - overscan);
+    const items = [];
+    let index = startIndex;
+    let start = this.#columnStart(index);
+    let end = start;
+    const maxEnd = scrollLeft + viewportWidth;
+    while (index < count && (items.length < overscan * 2 || end <= maxEnd + this.#columnWidth(index))) {
+      const size = this.#columnWidth(index);
+      end = start + size;
+      items.push({
+        key: this.options.getColumnKey(index),
+        index,
+        start,
+        end,
+        size,
+        lane: 0
+      });
+      index += 1;
+      start = end;
+    }
+    return items;
+  }
+  #shouldUseFallbackRows(virtualizerRows, fallbackRows) {
+    if (!virtualizerRows || fallbackRows.length === 0)
+      return false;
+    if (virtualizerRows.length === 0)
+      return true;
+    const scrollTop = this.#scrollOffset(this.#getScrollElement());
+    if (scrollTop <= 0)
+      return false;
+    const firstVirtualizerIndex = virtualizerRows[0]?.index ?? 0;
+    const firstFallbackIndex = fallbackRows[0]?.index ?? 0;
+    return Math.abs(firstVirtualizerIndex - firstFallbackIndex) > 1;
+  }
+  #shouldUseFallbackColumns(virtualizerColumns, fallbackColumns) {
+    if (!virtualizerColumns || fallbackColumns.length === 0)
+      return false;
+    if (virtualizerColumns.length === 0)
+      return true;
+    const scrollLeft = this.#horizontalScrollOffset(this.#getScrollElement());
+    if (scrollLeft <= 0)
+      return false;
+    const firstVirtualizerIndex = virtualizerColumns[0]?.index ?? 0;
+    const firstFallbackIndex = fallbackColumns[0]?.index ?? 0;
+    return Math.abs(firstVirtualizerIndex - firstFallbackIndex) > 1;
+  }
+  #rowHeight() {
+    const rowHeight = this.options.getRowHeight();
+    return Number.isFinite(rowHeight) && rowHeight > 0 ? rowHeight : defaultDataGridVirtualRowHeight;
+  }
+  #viewportHeight() {
+    const element = this.#getScrollElement();
+    if (!element)
+      return this.options.getInitialHeight();
+    const rect = element.getBoundingClientRect();
+    const height = rect.height || element.clientHeight || this.options.getInitialHeight();
+    return Math.max(0, height - this.#scrollPaddingStart()) || this.options.getInitialHeight();
+  }
+  #viewportWidth() {
+    const element = this.#getScrollElement();
+    if (!element)
+      return this.options.getInitialWidth();
+    const rect = element.getBoundingClientRect();
+    const width = rect.width || element.clientWidth || this.options.getInitialWidth();
+    return Math.max(0, width - this.#scrollPaddingInlineStart() - this.#scrollPaddingInlineEnd()) || this.options.getInitialWidth();
+  }
+  #scrollOffset(element) {
+    if (!element)
+      return 0;
+    return Math.max(0, element.scrollTop - this.#scrollPaddingStart());
+  }
+  #horizontalScrollOffset(element) {
+    if (!element)
+      return 0;
+    return Math.max(0, element.scrollLeft);
+  }
+  #scrollPaddingStart() {
+    const value = this.options.getScrollPaddingStart();
+    return Number.isFinite(value) && value > 0 ? value : 0;
+  }
+  #scrollPaddingInlineStart() {
+    const value = this.options.getScrollPaddingInlineStart();
+    return Number.isFinite(value) && value > 0 ? value : 0;
+  }
+  #scrollPaddingInlineEnd() {
+    const value = this.options.getScrollPaddingInlineEnd();
+    return Number.isFinite(value) && value > 0 ? value : 0;
+  }
+  #overscan() {
+    return Math.max(0, this.options.getOverscan());
+  }
+  #columnWidth(index) {
+    const width = this.options.getColumnWidth(index);
+    return Number.isFinite(width) && width > 0 ? width : 1;
+  }
+  #totalColumnWidth() {
+    let totalWidth = 0;
+    for (let index = 0;index < this.options.getColumnCount(); index += 1) {
+      totalWidth += this.#columnWidth(index);
+    }
+    return totalWidth;
+  }
+  #columnStart(targetIndex) {
+    let start = 0;
+    for (let index = 0;index < targetIndex; index += 1) {
+      start += this.#columnWidth(index);
+    }
+    return start;
+  }
+  #columnIndexAtOffset(offset) {
+    let start = 0;
+    for (let index = 0;index < this.options.getColumnCount(); index += 1) {
+      const end = start + this.#columnWidth(index);
+      if (end > offset)
+        return index;
+      start = end;
+    }
+    return Math.max(0, this.options.getColumnCount() - 1);
+  }
+}
+function toDataGridVirtualItem(item) {
+  return {
+    index: item.index,
+    start: item.start,
+    size: item.size,
+    key: typeof item.key === "number" || typeof item.key === "string" ? item.key : String(item.key)
+  };
+}
+
+// src/components/data-grid/data-grid.svelte
+function Data_grid($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const gridId = $4.props_id($$renderer2);
+    const interactiveDescendantSelector = [
+      "a[href]",
+      "button",
+      "input",
+      "select",
+      "textarea",
+      '[contenteditable=""]',
+      '[contenteditable="true"]',
+      '[tabindex]:not([tabindex="-1"])'
+    ].join(",");
+    const defaultVirtualRowHeight = 44;
+    let {
+      rows,
+      columns,
+      getRowId,
+      density = "comfortable",
+      stickyHeader = true,
+      virtualizeRows = false,
+      virtualizeColumns = false,
+      rowHeight,
+      columnOrder,
+      columnSizing,
+      columnPinning,
+      selectionMode = "none",
+      selectionModel = undefined,
+      onselectionmodelchange,
+      sortModel = [],
+      onsortmodelchange,
+      rowClass,
+      getRowAriaLabel,
+      class: className,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      onkeydown: consumerOnKeydown,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const columnModel = new DataGridColumnModel({
+      columns: () => columns,
+      columnOrder: () => columnOrder,
+      columnSizing: () => columnSizing,
+      columnPinning: () => columnPinning
+    });
+    let liveRegionMessage = "";
+    let renderedLiveRegionMessage = "";
+    let liveRegionAnnouncementSequence = 0;
+    let measuredGridWidth = undefined;
+    let isRightToLeft = false;
+    const activeSortModel = $4.derived(() => getActiveDataGridSortModel(columnModel.orderedColumns, sortModel));
+    const sortedRowIndices = $4.derived(() => getSortedDataGridRowIndices(rows, columnModel.orderedColumns, activeSortModel()));
+    const keyedRows = $4.derived(() => {
+      const records = rows.map((row, rowIndex) => ({ row, rowId: getRowId(row), rowIndex }));
+      const rowIdCounts = new Map;
+      for (const { rowId } of records) {
+        rowIdCounts.set(rowId, (rowIdCounts.get(rowId) ?? 0) + 1);
+      }
+      const rowIdOccurrences = new Map;
+      return records.map((record) => {
+        const occurrence = rowIdOccurrences.get(record.rowId) ?? 0;
+        rowIdOccurrences.set(record.rowId, occurrence + 1);
+        const hasDuplicateRowId = (rowIdCounts.get(record.rowId) ?? 0) > 1;
+        const uniqueRowId = hasDuplicateRowId ? `${record.rowId}\x00${occurrence}` : record.rowId;
+        return { ...record, rowDomId: uniqueRowId, rowKey: uniqueRowId };
+      });
+    });
+    const sortedKeyedRows = $4.derived(() => sortedRowIndices().flatMap((rowIndex) => keyedRows()[rowIndex] ?? []));
+    const resolvedRowHeight = $4.derived(() => resolveVirtualRowHeight(rowHeight));
+    const shouldWarnVirtualRowHeightFallback = $4.derived(() => virtualizeRows && !isValidVirtualRowHeight(rowHeight));
+    const shouldVirtualizeRows = $4.derived(() => virtualizeRows && sortedKeyedRows().length > 0);
+    const shouldVirtualizeColumns = $4.derived(() => virtualizeColumns && columnModel.unpinnedColumns.length > 0 && measuredGridWidth !== undefined && measuredGridWidth > 0 && !isRightToLeft && typeof window !== "undefined");
+    const rowVirtualizer = new DataGridVirtualizationAdapter({
+      getScrollElement: () => gridElement ?? null,
+      getRowCount: () => sortedKeyedRows().length,
+      getRowKey: (index) => sortedKeyedRows()[index]?.rowKey ?? index,
+      getRowHeight: () => resolvedRowHeight(),
+      getColumnCount: () => columnModel.unpinnedColumns.length,
+      getColumnKey: (index) => columnModel.unpinnedColumns[index]?.key ?? index,
+      getColumnWidth: (index) => columnModel.unpinnedColumns[index]?.width ?? 150,
+      getOverscan: () => 5,
+      getInitialHeight: () => resolvedRowHeight() * 10,
+      getInitialWidth: () => measuredGridWidth ?? 1000,
+      getScrollPaddingStart: () => getHeaderHeight(),
+      getScrollPaddingInlineStart: () => columnModel.leftPinnedWidth,
+      getScrollPaddingInlineEnd: () => columnModel.rightPinnedWidth
+    });
+    const observeHeaderSize = (node) => {
+      if (typeof ResizeObserver === "undefined")
+        return;
+      let previousHeight = getElementHeight(node);
+      const observer = new ResizeObserver(() => {
+        const nextHeight = getElementHeight(node);
+        if (nextHeight === previousHeight)
+          return;
+        previousHeight = nextHeight;
+        rowVirtualizer.refreshMeasurements();
+      });
+      observer.observe(node);
+      return () => observer.disconnect();
+    };
+    const observeGridSize = (node) => {
+      const updateGridMeasurement = () => {
+        const rect = node.getBoundingClientRect();
+        measuredGridWidth = rect.width || node.clientWidth || undefined;
+        isRightToLeft = getComputedStyle(node).direction === "rtl";
+      };
+      updateGridMeasurement();
+      if (typeof ResizeObserver === "undefined")
+        return;
+      const observer = new ResizeObserver(updateGridMeasurement);
+      observer.observe(node);
+      return () => observer.disconnect();
+    };
+    const delegateBodyEvents = (node) => {
+      node.addEventListener("click", handleBodyClick);
+      node.addEventListener("keydown", handleBodyKeydown);
+      return () => {
+        node.removeEventListener("click", handleBodyClick);
+        node.removeEventListener("keydown", handleBodyKeydown);
+      };
+    };
+    const virtualRows = $4.derived(() => rowVirtualizer.virtualRows);
+    const virtualColumns = $4.derived(() => rowVirtualizer.virtualColumns);
+    const virtualColumnLeadingSpacer = $4.derived(() => virtualColumns()[0]?.start ?? 0);
+    const virtualColumnTrailingSpacer = $4.derived(() => {
+      const lastColumn = virtualColumns().at(-1);
+      if (!lastColumn)
+        return 0;
+      return Math.max(0, rowVirtualizer.totalWidth - (lastColumn.start + lastColumn.size));
+    });
+    const gridContentWidth = $4.derived(() => shouldVirtualizeColumns() ? columnModel.leftPinnedWidth + rowVirtualizer.totalWidth + columnModel.rightPinnedWidth : undefined);
+    const gridTemplateColumns = $4.derived(() => {
+      if (!shouldVirtualizeColumns()) {
+        return columnModel.renderColumns.map((column) => `${column.width}px`).join(" ");
+      }
+      return [
+        ...columnModel.leftPinnedColumns.map((column) => `${column.width}px`),
+        `${virtualColumnLeadingSpacer()}px`,
+        ...virtualColumns().map((item) => `${item.size}px`),
+        `${virtualColumnTrailingSpacer()}px`,
+        ...columnModel.rightPinnedColumns.map((column) => `${column.width}px`)
+      ].join(" ");
+    });
+    const renderedColumns = $4.derived(() => {
+      if (!shouldVirtualizeColumns())
+        return columnModel.renderColumns;
+      const virtualUnpinnedColumns = virtualColumns().flatMap((item) => {
+        const column = columnModel.unpinnedColumns[item.index];
+        return column ? [column] : [];
+      });
+      return [
+        ...columnModel.leftPinnedColumns,
+        ...virtualUnpinnedColumns,
+        ...columnModel.rightPinnedColumns
+      ];
+    });
+    const renderedRows = $4.derived(() => {
+      if (!shouldVirtualizeRows()) {
+        return sortedKeyedRows().map((keyedRow, visualRowIndex) => ({
+          keyedRow,
+          visualRowIndex,
+          start: 0,
+          size: resolvedRowHeight(),
+          virtualized: false
+        }));
+      }
+      return virtualRows().flatMap((item) => {
+        const keyedRow = sortedKeyedRows()[item.index];
+        return keyedRow ? [
+          {
+            keyedRow,
+            visualRowIndex: item.index,
+            start: item.start,
+            size: item.size,
+            virtualized: true
+          }
+        ] : [];
+      });
+    });
+    const bodyHeight = $4.derived(() => shouldVirtualizeRows() ? `${rowVirtualizer.totalHeight}px` : undefined);
+    const duplicateRowIds = $4.derived(() => {
+      const seen = new Set;
+      const duplicates = new Set;
+      for (const { rowId } of keyedRows()) {
+        if (seen.has(rowId))
+          duplicates.add(rowId);
+        else
+          seen.add(rowId);
+      }
+      return [...duplicates];
+    });
+    const firstRowDomId = $4.derived(() => sortedKeyedRows()[0]?.rowDomId);
+    const firstColumnKey = $4.derived(() => columnModel.renderColumns[0]?.key);
+    const rowDomIds = $4.derived(() => sortedKeyedRows().map((row) => row.rowDomId));
+    const columnKeys = $4.derived(() => columnModel.renderColumns.map((column) => column.key));
+    let requestedActiveRowIndex = 0;
+    let requestedActiveColumnKey = undefined;
+    const selectionState = new DataGridSelectionModel({ rowIds: () => rowDomIds(), columnKeys: () => columnKeys() });
+    const activeRowIndex = $4.derived(() => sortedKeyedRows().length > 0 ? Math.min(requestedActiveRowIndex, sortedKeyedRows().length - 1) : 0);
+    const activeColumnIndex = $4.derived(() => {
+      const index = columnModel.renderColumns.findIndex((column) => column.key === requestedActiveColumnKey);
+      return index >= 0 ? index : 0;
+    });
+    const activeRowDomId = $4.derived(() => sortedKeyedRows().length > 0 ? sortedKeyedRows()[Math.min(activeRowIndex(), sortedKeyedRows().length - 1)]?.rowDomId : firstRowDomId());
+    const activeColumnKey = $4.derived(() => columnModel.renderColumns[activeColumnIndex()]?.key);
+    const canExposeActiveCell = $4.derived(() => !(shouldVirtualizeRows() && typeof window === "undefined"));
+    const activeCellId = $4.derived(() => canExposeActiveCell() && activeRowDomId() !== undefined && firstColumnKey() !== undefined ? getCellId(activeRowDomId(), activeColumnKey() ?? firstColumnKey()) : undefined);
+    const activeCellCoordinates = $4.derived(() => activeRowDomId() !== undefined && activeColumnKey() !== undefined ? { rowId: activeRowDomId(), columnKey: activeColumnKey() } : undefined);
+    const resolvedSelectionModel = $4.derived(() => selectionModel ?? []);
+    const selectedRowIds = $4.derived(() => selectionMode === "none" ? new Set : new Set(resolvedSelectionModel()));
+    const resolvedAriaLabel = $4.derived(() => typeof ariaLabel === "string" && ariaLabel.trim().length > 0 ? ariaLabel : undefined);
+    const resolvedAriaLabelledBy = $4.derived(() => typeof ariaLabelledBy === "string" && ariaLabelledBy.trim().length > 0 ? ariaLabelledBy : undefined);
+    let hasWarnedNoLabel = false;
+    let warnedDuplicateRowIdsSignature;
+    let previousActiveCellId;
+    let previousActiveVirtualRowIndex;
+    let previousActiveVirtualColumnIndex;
+    let previousSelectionRowIds;
+    let previousSelectionColumnKeys;
+    let gridElement;
+    let headerElement;
+    let liveRegionTimeoutId;
+    let liveRegionVersion = 0;
+    let warnedVirtualRowHeightFallback = false;
+    function syncRequestedActiveCell() {
+      const activeCell = selectionState.activeCell;
+      if (!activeCell)
+        return;
+      const nextActiveRowIndex = rowDomIds().indexOf(activeCell.rowId);
+      if (nextActiveRowIndex >= 0 && requestedActiveRowIndex !== nextActiveRowIndex) {
+        requestedActiveRowIndex = nextActiveRowIndex;
+      }
+      if (requestedActiveColumnKey !== activeCell.columnKey) {
+        requestedActiveColumnKey = activeCell.columnKey;
+      }
+    }
+    function didStringArrayChange(previousValues, nextValues) {
+      if (previousValues.length !== nextValues.length)
+        return true;
+      return previousValues.some((value, index) => value !== nextValues[index]);
+    }
+    function getCellId(rowId, columnKey) {
+      return `${gridId}-cell-r-${toDomIdSegment(rowId)}-c-${toDomIdSegment(columnKey)}`;
+    }
+    function toDomIdSegment(value) {
+      const segment = Array.from(value, (character) => character.codePointAt(0)?.toString(16) ?? "0");
+      return segment.length > 0 ? segment.join("_") : "empty";
+    }
+    function isValidVirtualRowHeight(value) {
+      return typeof value === "number" && Number.isFinite(value) && value > 0;
+    }
+    function resolveVirtualRowHeight(value) {
+      return isValidVirtualRowHeight(value) ? value : defaultVirtualRowHeight;
+    }
+    function formatDataGridValue(value) {
+      if (value === null || value === undefined)
+        return "";
+      if (value instanceof Date)
+        return value.toISOString();
+      return String(value);
+    }
+    function getRowClass(row, rowIndex) {
+      if (typeof rowClass === "function")
+        return rowClass(row, rowIndex);
+      return rowClass;
+    }
+    function getResolvedRowAriaLabel(row, rowIndex) {
+      const label = getRowAriaLabel?.(row, rowIndex);
+      return typeof label === "string" && label.trim().length > 0 ? label : undefined;
+    }
+    function getCellStyle(column) {
+      const customProperties = [
+        `--_cinder-data-grid-column-width: ${column.width}px`,
+        `grid-column: ${getCellGridColumn(column)}`
+      ];
+      if (column.pin === "left") {
+        customProperties.push(`--_cinder-data-grid-pin-left-offset: ${column.pinOffset}px`);
+      }
+      if (column.pin === "right") {
+        customProperties.push(`--_cinder-data-grid-pin-right-offset: ${column.pinOffset}px`);
+      }
+      return customProperties.join("; ");
+    }
+    function getRowStyle(row) {
+      if (!row.virtualized)
+        return;
+      return [
+        `--_cinder-data-grid-row-translate-y: ${row.start}px`,
+        `--_cinder-data-grid-row-height: ${row.size}px`
+      ].join("; ");
+    }
+    function getHeaderHeight() {
+      return headerElement ? getElementHeight(headerElement) : 0;
+    }
+    function getElementHeight(element) {
+      const offsetHeight = element.offsetHeight;
+      if (offsetHeight > 0)
+        return offsetHeight;
+      return element.getBoundingClientRect().height || 0;
+    }
+    function getColumnSortModelItem(columnKey) {
+      return activeSortModel().find((item) => item.key === columnKey);
+    }
+    function getColumnSortPriority(columnKey) {
+      const index = activeSortModel().findIndex((item) => item.key === columnKey);
+      return index >= 0 && activeSortModel().length > 1 ? index + 1 : undefined;
+    }
+    function getHeaderAriaSort(column, sortItem) {
+      return activeSortModel()[0]?.key === column.key ? sortItem?.direction : undefined;
+    }
+    function getSortStateDescription(sortItem, sortPriority) {
+      if (!sortItem)
+        return "not sorted";
+      if (sortPriority === undefined)
+        return `sorted ${sortItem.direction}`;
+      return `sorted ${sortItem.direction}, priority ${sortPriority}`;
+    }
+    function handleColumnHeaderClick(column, event) {
+      if (!column.sortable)
+        return;
+      const nextSortModel = getNextDataGridSortModel(activeSortModel(), column.key, event.shiftKey);
+      sortModel = nextSortModel;
+      onsortmodelchange?.(nextSortModel);
+    }
+    function getCellCoordinate(rowIndex, columnIndex) {
+      const rowId = rowDomIds()[Math.min(Math.max(rowIndex, 0), rowDomIds().length - 1)];
+      const columnKey = columnKeys()[Math.min(Math.max(columnIndex, 0), columnKeys().length - 1)];
+      if (rowId === undefined || columnKey === undefined)
+        return;
+      return { rowId, columnKey };
+    }
+    function getUnpinnedColumnIndex(columnKey) {
+      if (columnKey === undefined)
+        return;
+      const index = columnModel.unpinnedColumns.findIndex((column) => column.key === columnKey);
+      return index >= 0 ? index : undefined;
+    }
+    function getCellGridColumn(column) {
+      if (!shouldVirtualizeColumns())
+        return column.renderIndex;
+      const leftPinnedCount = columnModel.leftPinnedColumns.length;
+      if (column.pin === "left") {
+        const leftPinnedIndex = columnModel.leftPinnedColumns.findIndex((item) => item.key === column.key);
+        return Math.max(0, leftPinnedIndex) + 1;
+      }
+      const visibleUnpinnedIndex = virtualColumns().findIndex((item) => item.key === column.key);
+      if (visibleUnpinnedIndex >= 0)
+        return leftPinnedCount + 2 + visibleUnpinnedIndex;
+      const rightPinnedIndex = columnModel.rightPinnedColumns.findIndex((item) => item.key === column.key);
+      return leftPinnedCount + 2 + virtualColumns().length + 1 + Math.max(0, rightPinnedIndex);
+    }
+    async function scrollActiveCellIntoView(cellId) {
+      await tick();
+      document.getElementById(cellId)?.scrollIntoView({ block: "nearest", inline: "nearest" });
+    }
+    function moveActiveCell(rowIndex, columnIndex, extend = false) {
+      if (sortedKeyedRows().length === 0 || columnModel.renderColumns.length === 0)
+        return;
+      requestedActiveRowIndex = Math.min(Math.max(rowIndex, 0), sortedKeyedRows().length - 1);
+      requestedActiveColumnKey = columnModel.renderColumns[Math.min(Math.max(columnIndex, 0), columnModel.renderColumns.length - 1)]?.key;
+      const cell = getCellCoordinate(rowIndex, columnIndex);
+      if (cell)
+        selectionState.setActiveCell(cell, { extend });
+    }
+    function setSelectionModel(nextSelectionModel) {
+      selectionModel = nextSelectionModel;
+      onselectionmodelchange?.(nextSelectionModel);
+    }
+    function updateRowSelection(rowId, event) {
+      if (selectionMode === "none")
+        return;
+      if (selectionMode === "single") {
+        setSelectionModel([rowId]);
+        return;
+      }
+      const isToggle = event.ctrlKey || event.metaKey;
+      if (event.shiftKey)
+        return;
+      if (!isToggle) {
+        setSelectionModel([rowId]);
+        return;
+      }
+      const nextSelection = new Set(resolvedSelectionModel());
+      if (nextSelection.has(rowId))
+        nextSelection.delete(rowId);
+      else
+        nextSelection.add(rowId);
+      setSelectionModel([...nextSelection]);
+    }
+    function selectActiveCell(event) {
+      const row = sortedKeyedRows()[activeRowIndex()];
+      if (!row || activeColumnKey() === undefined || activeRowDomId() === undefined)
+        return;
+      selectionState.setActiveCell({ rowId: activeRowDomId(), columnKey: activeColumnKey() }, {
+        extend: event.shiftKey,
+        toggle: event.ctrlKey || event.metaKey
+      });
+      updateRowSelection(row.rowId, event);
+    }
+    function collapseSelectionToActiveCell() {
+      selectionState.collapseToActiveCell();
+      if (selectionMode === "none")
+        return;
+      const row = sortedKeyedRows()[activeRowIndex()];
+      setSelectionModel(row ? [row.rowId] : []);
+    }
+    async function copySelectedCells() {
+      const cells = selectionState.selectedCellCoordinates.length > 0 ? sortCellsByGridOrder(selectionState.selectedCellCoordinates) : activeCellCoordinates() ? [activeCellCoordinates()] : [];
+      if (cells.length === 0)
+        return;
+      const rowsByDomId = new Map(keyedRows().map((row) => [row.rowDomId, row.row]));
+      const columnsByKey = new Map(columnModel.renderColumns.map((column) => [column.key, column]));
+      const cellsByRow = new Map;
+      for (const cell of cells) {
+        const rowCells = cellsByRow.get(cell.rowId);
+        if (rowCells)
+          rowCells.push(cell);
+        else
+          cellsByRow.set(cell.rowId, [cell]);
+      }
+      const text = [...cellsByRow.entries()].map(([rowId, rowCells]) => {
+        const row = rowsByDomId.get(rowId);
+        if (!row)
+          return "";
+        return rowCells.map((cell) => {
+          const column = columnsByKey.get(cell.columnKey);
+          if (!column)
+            return "";
+          return formatDataGridValue(getDataGridColumnValue(row, column));
+        }).join("\t");
+      }).join(`
+`);
+      const copied = await copyToClipboard(text);
+      if (copied) {
+        announceCopiedCells(`Copied ${cells.length} ${cells.length === 1 ? "cell" : "cells"}`);
+        return;
+      }
+      announceCopiedCells("Copy failed");
+    }
+    function announceCopiedCells(message) {
+      liveRegionMessage = message;
+      liveRegionAnnouncementSequence += 1;
+    }
+    function sortCellsByGridOrder(cells) {
+      const rowIndexes = new Map(rowDomIds().map((rowId, index) => [rowId, index]));
+      const columnIndexes = new Map(columnKeys().map((columnKey, index) => [columnKey, index]));
+      return [...cells].sort((left, right) => {
+        const leftRowIndex = rowIndexes.get(left.rowId) ?? Number.POSITIVE_INFINITY;
+        const rightRowIndex = rowIndexes.get(right.rowId) ?? Number.POSITIVE_INFINITY;
+        if (leftRowIndex !== rightRowIndex)
+          return leftRowIndex - rightRowIndex;
+        const leftColumnIndex = columnIndexes.get(left.columnKey) ?? Number.POSITIVE_INFINITY;
+        const rightColumnIndex = columnIndexes.get(right.columnKey) ?? Number.POSITIVE_INFINITY;
+        return leftColumnIndex - rightColumnIndex;
+      });
+    }
+    function handleCellClick(event, rowId, rowDomId, columnKey, rowIndex) {
+      requestedActiveRowIndex = rowIndex;
+      requestedActiveColumnKey = columnKey;
+      selectionState.setActiveCell({ rowId: rowDomId, columnKey }, {
+        extend: event.shiftKey,
+        toggle: event.ctrlKey || event.metaKey
+      });
+      updateRowSelection(rowId, event);
+      if (!isInteractiveEventTarget(event))
+        gridElement?.focus({ preventScroll: true });
+    }
+    function handleBodyClick(event) {
+      const cell = getCellEventDetail(event);
+      if (!cell)
+        return;
+      handleCellClick(event, cell.rowId, cell.rowDomId, cell.columnKey, cell.rowIndex);
+    }
+    function handleCellKeydown(event, rowId, rowDomId, columnKey, rowIndex) {
+      if (isInteractiveEventTarget(event))
+        return;
+      if (event.key !== "Enter" && event.key !== " ")
+        return;
+      event.preventDefault();
+      event.stopPropagation();
+      requestedActiveRowIndex = rowIndex;
+      requestedActiveColumnKey = columnKey;
+      selectionState.setActiveCell({ rowId: rowDomId, columnKey }, {
+        extend: event.shiftKey,
+        toggle: event.ctrlKey || event.metaKey
+      });
+      updateRowSelection(rowId, event);
+      gridElement?.focus({ preventScroll: true });
+    }
+    function handleBodyKeydown(event) {
+      const cell = getCellEventDetail(event);
+      if (!cell)
+        return;
+      handleCellKeydown(event, cell.rowId, cell.rowDomId, cell.columnKey, cell.rowIndex);
+    }
+    function getCellEventDetail(event) {
+      if (!(event.target instanceof Element))
+        return;
+      const cell = event.target.closest(".cinder-data-grid__cell");
+      if (!cell)
+        return;
+      const { cinderRowId, cinderRowDomId, cinderColumnKey, cinderRowIndex } = cell.dataset;
+      const rowIndex = Number(cinderRowIndex);
+      if (cinderRowId === undefined || cinderRowDomId === undefined || cinderColumnKey === undefined || !Number.isInteger(rowIndex)) {
+        return;
+      }
+      return {
+        rowId: cinderRowId,
+        rowDomId: cinderRowDomId,
+        columnKey: cinderColumnKey,
+        rowIndex
+      };
+    }
+    function handleKeydown(event) {
+      if (consumerOnKeydown) {
+        consumerOnKeydown(event);
+      }
+      if (event.defaultPrevented)
+        return;
+      if (event.target instanceof Element && event.target.closest(".cinder-data-grid__sort-button")) {
+        return;
+      }
+      if (isInteractiveEventTarget(event))
+        return;
+      if (sortedKeyedRows().length === 0 || columnModel.renderColumns.length === 0)
+        return;
+      const action = dataGridKeyToAction(event, {
+        activeRowIndex: activeRowIndex(),
+        activeColumnIndex: activeColumnIndex(),
+        rowCount: sortedKeyedRows().length,
+        columnCount: columnModel.renderColumns.length
+      });
+      if (!action)
+        return;
+      event.preventDefault();
+      if (action.type === "move-cell") {
+        moveActiveCell(action.rowIndex, action.columnIndex, action.extend);
+        return;
+      }
+      if (action.type === "select-all") {
+        selectionState.selectAll();
+        syncRequestedActiveCell();
+        if (selectionMode === "multiple") {
+          setSelectionModel(sortedKeyedRows().map((row) => row.rowId));
+        } else if (selectionMode === "single") {
+          const row = sortedKeyedRows()[activeRowIndex()];
+          setSelectionModel(row ? [row.rowId] : []);
+        }
+        return;
+      }
+      if (action.type === "collapse-selection") {
+        collapseSelectionToActiveCell();
+        return;
+      }
+      if (action.type === "select-active-cell") {
+        selectActiveCell(event);
+        return;
+      }
+      if (action.type === "copy-selection") {
+        copySelectedCells();
+      }
+    }
+    function isInteractiveEventTarget(event) {
+      if (!(event.target instanceof Element))
+        return false;
+      const interactiveElement = event.target.closest(interactiveDescendantSelector);
+      return interactiveElement !== null && interactiveElement !== gridElement;
+    }
+    $$renderer2.push(`<div${$4.attributes({
+      ...rest,
+      class: $4.clsx(classNames("cinder-data-grid", className)),
+      role: "grid",
+      "aria-rowcount": rows.length + 1,
+      "aria-colcount": columnModel.orderedColumns.length,
+      "aria-label": resolvedAriaLabel(),
+      "aria-labelledby": resolvedAriaLabelledBy(),
+      "aria-activedescendant": activeCellId(),
+      "aria-multiselectable": "true",
+      tabindex: "0",
+      "data-cinder-density": density,
+      "data-cinder-sticky-header": stickyHeader ? "true" : undefined,
+      "data-cinder-virtualized-rows": shouldVirtualizeRows() ? "true" : undefined,
+      "data-cinder-virtualized-columns": shouldVirtualizeColumns() ? "true" : undefined
+    }, undefined, undefined, {
+      "--_cinder-data-grid-template-columns": gridTemplateColumns(),
+      "--_cinder-data-grid-content-width": gridContentWidth() === undefined ? undefined : `${gridContentWidth()}px`
+    })}><div class="cinder-data-grid__header-row" role="row" aria-rowindex="1"><!--[-->`);
+    const each_array = $4.ensure_array_like(renderedColumns());
+    for (let $$index = 0, $$length = each_array.length;$$index < $$length; $$index++) {
+      let column = each_array[$$index];
+      const sortItem = getColumnSortModelItem(column.key);
+      const sortPriority = getColumnSortPriority(column.key);
+      $$renderer2.push(`<div class="cinder-data-grid__header-cell" role="columnheader"${$4.attr("aria-colindex", column.colIndex)}${$4.attr("aria-sort", column.sortable ? getHeaderAriaSort(column, sortItem) : undefined)}${$4.attr("data-cinder-pin", column.pin)}${$4.attr("data-cinder-sortable", column.sortable ? "true" : undefined)}${$4.attr("data-cinder-sort-direction", sortItem?.direction)}${$4.attr_style(getCellStyle(column))}>`);
+      if (column.sortable) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<button class="cinder-data-grid__sort-button" type="button"><span class="cinder-data-grid__header-content">`);
+        if (typeof column.header === "function") {
+          $$renderer2.push("<!--[0-->");
+          column.header($$renderer2);
+          $$renderer2.push(`<!---->`);
+        } else {
+          $$renderer2.push("<!--[-1-->");
+          $$renderer2.push(`${$4.escape(column.header)}`);
+        }
+        $$renderer2.push(`<!--]--></span> <span class="cinder-data-grid__sort-indicator" aria-hidden="true">`);
+        if (sortItem?.direction === "ascending") {
+          $$renderer2.push("<!--[0-->");
+          $$renderer2.push(`Asc`);
+        } else if (sortItem?.direction === "descending") {
+          $$renderer2.push("<!--[1-->");
+          $$renderer2.push(`Desc`);
+        } else {
+          $$renderer2.push("<!--[-1-->");
+        }
+        $$renderer2.push(`<!--]--></span> `);
+        if (sortPriority !== undefined) {
+          $$renderer2.push("<!--[0-->");
+          $$renderer2.push(`<span class="cinder-data-grid__sort-priority" aria-hidden="true">${$4.escape(sortPriority)}</span>`);
+        } else {
+          $$renderer2.push("<!--[-1-->");
+        }
+        $$renderer2.push(`<!--]--> <span class="cinder-sr-only">${$4.escape(getSortStateDescription(sortItem, sortPriority))}</span></button>`);
+      } else if (typeof column.header === "function") {
+        $$renderer2.push("<!--[1-->");
+        column.header($$renderer2);
+        $$renderer2.push(`<!---->`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+        $$renderer2.push(`${$4.escape(column.header)}`);
+      }
+      $$renderer2.push(`<!--]--></div>`);
+    }
+    $$renderer2.push(`<!--]--></div> <div class="cinder-data-grid__body" role="rowgroup"${$4.attr("data-cinder-virtualized", shouldVirtualizeRows() ? "true" : undefined)}${$4.attr_style("", { height: bodyHeight() })}><!--[-->`);
+    const each_array_1 = $4.ensure_array_like(renderedRows());
+    for (let $$index_2 = 0, $$length = each_array_1.length;$$index_2 < $$length; $$index_2++) {
+      let renderedRow = each_array_1[$$index_2];
+      const keyedRow = renderedRow.keyedRow;
+      const row = keyedRow.row;
+      const rowId = keyedRow.rowId;
+      const rowDomId = keyedRow.rowDomId;
+      const rowIndex = renderedRow.visualRowIndex;
+      $$renderer2.push(`<div${$4.attr_class($4.clsx(classNames("cinder-data-grid__row", getRowClass(row, rowIndex))))} role="row"${$4.attr("aria-rowindex", rowIndex + 2)}${$4.attr("aria-label", getResolvedRowAriaLabel(row, rowIndex))}${$4.attr("aria-selected", selectedRowIds().has(rowId) ? "true" : undefined)}${$4.attr("data-cinder-selected", selectedRowIds().has(rowId) ? "" : undefined)}${$4.attr("data-cinder-virtual-index", rowIndex)}${$4.attr_style(getRowStyle(renderedRow))}><!--[-->`);
+      const each_array_2 = $4.ensure_array_like(renderedColumns());
+      for (let $$index_1 = 0, $$length2 = each_array_2.length;$$index_1 < $$length2; $$index_1++) {
+        let column = each_array_2[$$index_1];
+        const value = getDataGridColumnValue(row, column);
+        const cellId = getCellId(rowDomId, column.key);
+        const cellCoordinates = { rowId: rowDomId, columnKey: column.key };
+        const isSelectedCell = selectionState.isCellSelected(cellCoordinates);
+        const isAnchorCell = selectionState.isAnchorCell(cellCoordinates);
+        $$renderer2.push(`<div${$4.attr("id", cellId)} class="cinder-data-grid__cell"${$4.attr("role", column.rowHeader ? "rowheader" : "gridcell")}${$4.attr("aria-colindex", column.colIndex)}${$4.attr("aria-selected", isSelectedCell ? "true" : undefined)} tabindex="-1"${$4.attr("data-cinder-pin", column.pin)}${$4.attr("data-cinder-active", activeCellId() === cellId ? "true" : undefined)}${$4.attr("data-cinder-selected", isSelectedCell ? "" : undefined)}${$4.attr("data-cinder-anchor", isAnchorCell ? "true" : undefined)}${$4.attr("data-cinder-row-id", rowId)}${$4.attr("data-cinder-row-dom-id", rowDomId)}${$4.attr("data-cinder-column-key", column.key)}${$4.attr("data-cinder-row-index", rowIndex)}${$4.attr_style(getCellStyle(column))}>`);
+        if (column.cell) {
+          $$renderer2.push("<!--[0-->");
+          column.cell($$renderer2, { row, value, editing: false });
+          $$renderer2.push(`<!---->`);
+        } else {
+          $$renderer2.push("<!--[-1-->");
+          $$renderer2.push(`${$4.escape(formatDataGridValue(value))}`);
+        }
+        $$renderer2.push(`<!--]--></div>`);
+      }
+      $$renderer2.push(`<!--]--></div>`);
+    }
+    $$renderer2.push(`<!--]--></div></div> <div class="cinder-sr-only cinder-data-grid__live-region" role="status" aria-live="polite" aria-atomic="true">${$4.escape(renderedLiveRegionMessage)}</div>`);
+    $4.bind_props($$props, { selectionModel, sortModel });
+  });
+}
+
+// src/components/data-grid/index.ts
+var data_grid_default = Data_grid;
+export { Data_grid, data_grid_default };
+
+//# debugId=E9B8718085A80BAA64756E2164756E21