@gp-grid/vue 0.7.2

package/dist/index.js

@@ -0,0 +1,1934 @@
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, h, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, reactive, ref, renderList, resolveDynamicComponent, shallowRef, toDisplayString, unref, vModelText, watch, withDirectives } from "vue";
+import { GridCore, GridCore as GridCore$1, buildCellClasses, buildCellClasses as buildCellClasses$1, calculateColumnPositions, calculateScaledColumnPositions, createClientDataSource, createClientDataSource as createClientDataSource$1, createDataSourceFromArray, createDataSourceFromArray as createDataSourceFromArray$1, createMutableClientDataSource, createServerDataSource, findColumnAtX, getTotalWidth, getTotalWidth as getTotalWidth$1, gridStyles, injectStyles, injectStyles as injectStyles$1, isCellActive, isCellActive as isCellActive$1, isCellEditing, isCellEditing as isCellEditing$1, isCellInFillPreview, isCellInFillPreview as isCellInFillPreview$1, isCellSelected, isCellSelected as isCellSelected$1, isRowVisible } from "gp-grid-core";
+
+//#region src/gridState/useGridState.ts
+function createInitialState(args) {
+	return {
+		slots: /* @__PURE__ */ new Map(),
+		activeCell: null,
+		selectionRange: null,
+		editingCell: null,
+		contentWidth: 0,
+		contentHeight: args?.initialHeight ?? 0,
+		viewportWidth: args?.initialWidth ?? 0,
+		headers: /* @__PURE__ */ new Map(),
+		filterPopup: null,
+		isLoading: false,
+		error: null,
+		totalRows: 0,
+		visibleRowRange: null,
+		hoverPosition: null
+	};
+}
+/**
+* Apply a single instruction to mutable state
+*/
+function applyInstruction(instruction, state) {
+	switch (instruction.type) {
+		case "CREATE_SLOT":
+			state.slots.set(instruction.slotId, {
+				slotId: instruction.slotId,
+				rowIndex: -1,
+				rowData: {},
+				translateY: 0
+			});
+			break;
+		case "DESTROY_SLOT":
+			state.slots.delete(instruction.slotId);
+			break;
+		case "ASSIGN_SLOT": {
+			const existing = state.slots.get(instruction.slotId);
+			if (existing) state.slots.set(instruction.slotId, {
+				...existing,
+				rowIndex: instruction.rowIndex,
+				rowData: instruction.rowData
+			});
+			break;
+		}
+		case "MOVE_SLOT": {
+			const existing = state.slots.get(instruction.slotId);
+			if (existing) state.slots.set(instruction.slotId, {
+				...existing,
+				translateY: instruction.translateY
+			});
+			break;
+		}
+		case "SET_ACTIVE_CELL":
+			state.activeCell = instruction.position;
+			break;
+		case "SET_SELECTION_RANGE":
+			state.selectionRange = instruction.range;
+			break;
+		case "UPDATE_VISIBLE_RANGE":
+			state.visibleRowRange = {
+				start: instruction.start,
+				end: instruction.end
+			};
+			break;
+		case "SET_HOVER_POSITION":
+			state.hoverPosition = instruction.position;
+			break;
+		case "START_EDIT":
+			state.editingCell = {
+				row: instruction.row,
+				col: instruction.col,
+				initialValue: instruction.initialValue
+			};
+			break;
+		case "STOP_EDIT":
+			state.editingCell = null;
+			break;
+		case "SET_CONTENT_SIZE":
+			state.contentWidth = instruction.width;
+			state.contentHeight = instruction.height;
+			state.viewportWidth = instruction.viewportWidth;
+			break;
+		case "UPDATE_HEADER":
+			state.headers.set(instruction.colIndex, {
+				column: instruction.column,
+				sortDirection: instruction.sortDirection,
+				sortIndex: instruction.sortIndex,
+				sortable: instruction.sortable,
+				filterable: instruction.filterable,
+				hasFilter: instruction.hasFilter
+			});
+			break;
+		case "OPEN_FILTER_POPUP":
+			state.filterPopup = {
+				isOpen: true,
+				colIndex: instruction.colIndex,
+				column: instruction.column,
+				anchorRect: instruction.anchorRect,
+				distinctValues: instruction.distinctValues,
+				currentFilter: instruction.currentFilter
+			};
+			break;
+		case "CLOSE_FILTER_POPUP":
+			state.filterPopup = null;
+			break;
+		case "DATA_LOADING":
+			state.isLoading = true;
+			state.error = null;
+			break;
+		case "DATA_LOADED":
+			state.isLoading = false;
+			state.totalRows = instruction.totalRows;
+			break;
+		case "DATA_ERROR":
+			state.isLoading = false;
+			state.error = instruction.error;
+			break;
+		case "ROWS_ADDED":
+		case "ROWS_REMOVED":
+			state.totalRows = instruction.totalRows;
+			break;
+		case "ROWS_UPDATED":
+		case "TRANSACTION_PROCESSED": break;
+	}
+}
+/**
+* Vue composable for managing grid state
+*/
+function useGridState(args) {
+	const state = reactive(createInitialState(args));
+	/**
+	* Apply a batch of instructions to the state
+	*/
+	function applyInstructions(instructions) {
+		for (const instruction of instructions) applyInstruction(instruction, state);
+	}
+	/**
+	* Reset state to initial values
+	*/
+	function reset() {
+		const initial = createInitialState();
+		state.slots = initial.slots;
+		state.activeCell = initial.activeCell;
+		state.selectionRange = initial.selectionRange;
+		state.editingCell = initial.editingCell;
+		state.contentWidth = initial.contentWidth;
+		state.contentHeight = initial.contentHeight;
+		state.viewportWidth = initial.viewportWidth;
+		state.headers = initial.headers;
+		state.filterPopup = initial.filterPopup;
+		state.isLoading = initial.isLoading;
+		state.error = initial.error;
+		state.totalRows = initial.totalRows;
+		state.visibleRowRange = initial.visibleRowRange;
+		state.hoverPosition = initial.hoverPosition;
+	}
+	return {
+		state,
+		applyInstructions,
+		reset
+	};
+}
+
+//#endregion
+//#region src/composables/useAutoScroll.ts
+const AUTO_SCROLL_INTERVAL = 16;
+/**
+* Vue composable for auto-scrolling during drag operations
+*/
+function useAutoScroll(containerRef) {
+	const autoScrollInterval = ref(null);
+	/**
+	* Start auto-scrolling in the given direction
+	*/
+	function startAutoScroll(dx, dy) {
+		if (autoScrollInterval.value) clearInterval(autoScrollInterval.value);
+		autoScrollInterval.value = setInterval(() => {
+			const container = containerRef.value;
+			if (container) {
+				container.scrollTop += dy;
+				container.scrollLeft += dx;
+			}
+		}, AUTO_SCROLL_INTERVAL);
+	}
+	/**
+	* Stop auto-scrolling
+	*/
+	function stopAutoScroll() {
+		if (autoScrollInterval.value) {
+			clearInterval(autoScrollInterval.value);
+			autoScrollInterval.value = null;
+		}
+	}
+	onUnmounted(() => {
+		stopAutoScroll();
+	});
+	return {
+		startAutoScroll,
+		stopAutoScroll
+	};
+}
+
+//#endregion
+//#region src/composables/useInputHandler.ts
+/**
+* Find the slot for a given row index
+*/
+function findSlotForRow(slots, rowIndex) {
+	for (const slot of slots.values()) if (slot.rowIndex === rowIndex) return slot;
+	return null;
+}
+/**
+* Scroll a cell into view if needed
+*/
+function scrollCellIntoView(core, container, row, rowHeight, headerHeight, slots) {
+	const slot = findSlotForRow(slots, row);
+	const cellViewportTop = (slot ? slot.translateY : headerHeight + row * rowHeight) - container.scrollTop;
+	const cellViewportBottom = cellViewportTop + rowHeight;
+	const visibleTop = headerHeight;
+	const visibleBottom = container.clientHeight;
+	if (cellViewportTop < visibleTop) container.scrollTop = core.getScrollTopForRow(row);
+	else if (cellViewportBottom > visibleBottom) {
+		const visibleDataHeight = container.clientHeight - headerHeight;
+		const rowsInView = Math.floor(visibleDataHeight / rowHeight);
+		const targetRow = Math.max(0, row - rowsInView + 1);
+		container.scrollTop = core.getScrollTopForRow(targetRow);
+	}
+}
+/**
+* Vue composable for handling all input interactions
+*/
+function useInputHandler(coreRef, containerRef, columns, options) {
+	const { activeCell, selectionRange, editingCell, filterPopupOpen, rowHeight, headerHeight, columnPositions, visibleColumnsWithIndices, slots } = options;
+	const { startAutoScroll, stopAutoScroll } = useAutoScroll(containerRef);
+	const dragState = ref({
+		isDragging: false,
+		dragType: null,
+		fillSourceRange: null,
+		fillTarget: null
+	});
+	watch([
+		() => headerHeight,
+		() => rowHeight,
+		columnPositions,
+		visibleColumnsWithIndices
+	], () => {
+		const core = coreRef.value;
+		if (core?.input) {
+			const visible = visibleColumnsWithIndices.value;
+			core.input.updateDeps({
+				getHeaderHeight: () => headerHeight,
+				getRowHeight: () => rowHeight,
+				getColumnPositions: () => columnPositions.value,
+				getColumnCount: () => visible.length,
+				getOriginalColumnIndex: (visibleIndex) => {
+					const info = visible[visibleIndex];
+					return info ? info.originalIndex : visibleIndex;
+				}
+			});
+		}
+	}, { immediate: true });
+	function getContainerBounds() {
+		const container = containerRef.value;
+		if (!container) return null;
+		const rect = container.getBoundingClientRect();
+		return {
+			top: rect.top,
+			left: rect.left,
+			width: rect.width,
+			height: rect.height,
+			scrollTop: container.scrollTop,
+			scrollLeft: container.scrollLeft
+		};
+	}
+	function toPointerEventData(e) {
+		return {
+			clientX: e.clientX,
+			clientY: e.clientY,
+			button: e.button,
+			shiftKey: e.shiftKey,
+			ctrlKey: e.ctrlKey,
+			metaKey: e.metaKey
+		};
+	}
+	function startGlobalDragListeners() {
+		const handleMouseMove = (e) => {
+			const core = coreRef.value;
+			const bounds = getContainerBounds();
+			if (!core?.input || !bounds) return;
+			const result = core.input.handleDragMove(toPointerEventData(e), bounds);
+			if (result) {
+				if (result.autoScroll) startAutoScroll(result.autoScroll.dx, result.autoScroll.dy);
+				else stopAutoScroll();
+				dragState.value = core.input.getDragState();
+			}
+		};
+		const handleMouseUp = () => {
+			const core = coreRef.value;
+			if (core?.input) {
+				core.input.handleDragEnd();
+				dragState.value = core.input.getDragState();
+			}
+			stopAutoScroll();
+			document.removeEventListener("mousemove", handleMouseMove);
+			document.removeEventListener("mouseup", handleMouseUp);
+		};
+		document.addEventListener("mousemove", handleMouseMove);
+		document.addEventListener("mouseup", handleMouseUp);
+	}
+	function handleCellMouseDown(rowIndex, colIndex, e) {
+		const core = coreRef.value;
+		if (!core?.input) return;
+		const result = core.input.handleCellMouseDown(rowIndex, colIndex, toPointerEventData(e));
+		if (result.focusContainer) containerRef.value?.focus();
+		if (result.startDrag === "selection") {
+			core.input.startSelectionDrag();
+			dragState.value = core.input.getDragState();
+			startGlobalDragListeners();
+		}
+	}
+	function handleCellDoubleClick(rowIndex, colIndex) {
+		const core = coreRef.value;
+		if (!core?.input) return;
+		core.input.handleCellDoubleClick(rowIndex, colIndex);
+	}
+	function handleFillHandleMouseDown(e) {
+		const core = coreRef.value;
+		if (!core?.input) return;
+		const result = core.input.handleFillHandleMouseDown(activeCell.value, selectionRange.value, toPointerEventData(e));
+		if (result.preventDefault) e.preventDefault();
+		if (result.stopPropagation) e.stopPropagation();
+		if (result.startDrag === "fill") {
+			dragState.value = core.input.getDragState();
+			startGlobalDragListeners();
+		}
+	}
+	function handleHeaderClick(colIndex, e) {
+		const core = coreRef.value;
+		if (!core?.input) return;
+		const column = columns.value[colIndex];
+		if (!column) return;
+		const colId = column.colId ?? column.field;
+		core.input.handleHeaderClick(colId, e.shiftKey);
+	}
+	function handleKeyDown(e) {
+		const core = coreRef.value;
+		const container = containerRef.value;
+		if (!core?.input) return;
+		const result = core.input.handleKeyDown({
+			key: e.key,
+			shiftKey: e.shiftKey,
+			ctrlKey: e.ctrlKey,
+			metaKey: e.metaKey
+		}, activeCell.value, editingCell.value, filterPopupOpen.value);
+		if (result.preventDefault) e.preventDefault();
+		if (result.scrollToCell && container) scrollCellIntoView(core, container, result.scrollToCell.row, rowHeight, headerHeight, slots.value);
+	}
+	function handleWheel(e, wheelDampening) {
+		const core = coreRef.value;
+		const container = containerRef.value;
+		if (!core?.input || !container) return;
+		const dampened = core.input.handleWheel(e.deltaY, e.deltaX, wheelDampening);
+		if (dampened) {
+			e.preventDefault();
+			container.scrollTop += dampened.dy;
+			container.scrollLeft += dampened.dx;
+		}
+	}
+	onUnmounted(() => {
+		stopAutoScroll();
+	});
+	return {
+		handleCellMouseDown,
+		handleCellDoubleClick,
+		handleFillHandleMouseDown,
+		handleHeaderClick,
+		handleKeyDown,
+		handleWheel,
+		dragState
+	};
+}
+
+//#endregion
+//#region src/composables/useFillHandle.ts
+/**
+* Composable for calculating the fill handle position.
+* The fill handle appears at the bottom-right corner of the selection
+* when all selected columns are editable.
+*/
+function useFillHandle(options) {
+	const { activeCell, selectionRange, slots, columns, visibleColumnsWithIndices, columnPositions, columnWidths, rowHeight } = options;
+	return { fillHandlePosition: computed(() => {
+		const active = activeCell.value;
+		const selection = selectionRange.value;
+		const slotsMap = slots.value;
+		if (!active && !selection) return null;
+		let row, col;
+		let minCol, maxCol;
+		if (selection) {
+			row = Math.max(selection.startRow, selection.endRow);
+			col = Math.max(selection.startCol, selection.endCol);
+			minCol = Math.min(selection.startCol, selection.endCol);
+			maxCol = Math.max(selection.startCol, selection.endCol);
+		} else if (active) {
+			row = active.row;
+			col = active.col;
+			minCol = col;
+			maxCol = col;
+		} else return null;
+		const cols = columns.value;
+		for (let c = minCol; c <= maxCol; c++) {
+			const column = cols[c];
+			if (!column || column.hidden) continue;
+			if (column.editable !== true) return null;
+		}
+		const visibleIndex = visibleColumnsWithIndices.value.findIndex((v) => v.originalIndex === col);
+		if (visibleIndex === -1) return null;
+		let cellTop = null;
+		for (const slot of slotsMap.values()) if (slot.rowIndex === row) {
+			cellTop = slot.translateY;
+			break;
+		}
+		if (cellTop === null) return null;
+		const cellLeft = columnPositions.value[visibleIndex] ?? 0;
+		const cellWidth = columnWidths.value[visibleIndex] ?? 0;
+		return {
+			top: cellTop + rowHeight - 5,
+			left: cellLeft + cellWidth - 20
+		};
+	}) };
+}
+
+//#endregion
+//#region src/renderers/cellRenderer.ts
+/**
+* Ensure we always return a VNode, never a plain string
+*/
+function toVNode$2(value) {
+	if (value == null || value === "") return createTextVNode("");
+	if (typeof value === "string") return createTextVNode(value);
+	return value;
+}
+/**
+* Get cell value from row data, supporting dot-notation for nested fields
+*/
+function getCellValue(rowData, field) {
+	const parts = field.split(".");
+	let value = rowData;
+	for (const part of parts) {
+		if (value == null || typeof value !== "object") return null;
+		value = value[part];
+	}
+	return value ?? null;
+}
+/**
+* Render cell content based on column configuration and renderer registries
+*/
+function renderCell(options) {
+	const { column, rowData, rowIndex, colIndex, isActive, isSelected, isEditing, cellRenderers, globalCellRenderer } = options;
+	const value = getCellValue(rowData, column.field);
+	const params = {
+		value,
+		rowData,
+		column,
+		rowIndex,
+		colIndex,
+		isActive,
+		isSelected,
+		isEditing
+	};
+	if (column.cellRenderer && typeof column.cellRenderer === "string") {
+		const renderer = cellRenderers[column.cellRenderer];
+		if (renderer) return toVNode$2(renderer(params));
+	}
+	if (globalCellRenderer) return toVNode$2(globalCellRenderer(params));
+	return createTextVNode(value == null ? "" : String(value));
+}
+
+//#endregion
+//#region src/renderers/editRenderer.ts
+/**
+* Ensure we always return a VNode, never a plain string
+*/
+function toVNode$1(value) {
+	if (value == null || value === "") return createTextVNode("");
+	if (typeof value === "string") return createTextVNode(value);
+	return value;
+}
+/**
+* Render edit cell content based on column configuration and renderer registries
+*/
+function renderEditCell(options) {
+	const { column, rowData, rowIndex, colIndex, initialValue, core, editRenderers, globalEditRenderer } = options;
+	if (!core) return createTextVNode("");
+	const params = {
+		value: getCellValue(rowData, column.field),
+		rowData,
+		column,
+		rowIndex,
+		colIndex,
+		isActive: true,
+		isSelected: true,
+		isEditing: true,
+		initialValue,
+		onValueChange: (newValue) => core.updateEditValue(newValue),
+		onCommit: () => core.commitEdit(),
+		onCancel: () => core.cancelEdit()
+	};
+	if (column.editRenderer && typeof column.editRenderer === "string") {
+		const renderer = editRenderers[column.editRenderer];
+		if (renderer) return toVNode$1(renderer(params));
+	}
+	if (globalEditRenderer) return toVNode$1(globalEditRenderer(params));
+	return h("input", {
+		class: "gp-grid-edit-input",
+		type: "text",
+		value: initialValue == null ? "" : String(initialValue),
+		autofocus: true,
+		onFocus: (e) => e.target.select(),
+		onInput: (e) => core.updateEditValue(e.target.value),
+		onKeydown: (e) => {
+			e.stopPropagation();
+			if (e.key === "Enter") core.commitEdit();
+			else if (e.key === "Escape") core.cancelEdit();
+			else if (e.key === "Tab") {
+				e.preventDefault();
+				core.commitEdit();
+				core.selection.moveFocus(e.shiftKey ? "left" : "right", false);
+			}
+		},
+		onBlur: () => core.commitEdit()
+	});
+}
+
+//#endregion
+//#region src/renderers/headerRenderer.ts
+/**
+* Ensure we always return a VNode, never a plain string
+*/
+function toVNode(value) {
+	if (value == null || value === "") return createTextVNode("");
+	if (typeof value === "string") return createTextVNode(value);
+	return value;
+}
+/**
+* Render header content based on column configuration and renderer registries
+*/
+function renderHeader(options) {
+	const { column, colIndex, sortDirection, sortIndex, sortable, filterable, hasFilter, core, container, headerRenderers, globalHeaderRenderer } = options;
+	const params = {
+		column,
+		colIndex,
+		sortDirection,
+		sortIndex,
+		sortable,
+		filterable,
+		hasFilter,
+		onSort: (direction, addToExisting) => {
+			if (core && sortable) core.setSort(column.colId ?? column.field, direction, addToExisting);
+		},
+		onFilterClick: () => {
+			if (core && filterable) {
+				const headerCell = container?.querySelector(`[data-col-index="${colIndex}"]`);
+				if (headerCell) {
+					const rect = headerCell.getBoundingClientRect();
+					core.openFilterPopup(colIndex, {
+						top: rect.top,
+						left: rect.left,
+						width: rect.width,
+						height: rect.height
+					});
+				}
+			}
+		}
+	};
+	if (column.headerRenderer && typeof column.headerRenderer === "string") {
+		const renderer = headerRenderers[column.headerRenderer];
+		if (renderer) return toVNode(renderer(params));
+	}
+	if (globalHeaderRenderer) return toVNode(globalHeaderRenderer(params));
+	const children = [h("span", { class: "gp-grid-header-text" }, column.headerName ?? column.field)];
+	const iconsChildren = [];
+	if (sortable) {
+		const arrowsChildren = [h("span", { class: "gp-grid-sort-arrows-stack" }, [h("svg", {
+			class: `gp-grid-sort-arrow-up${sortDirection === "asc" ? " active" : ""}`,
+			width: "8",
+			height: "6",
+			viewBox: "0 0 8 6"
+		}, [h("path", {
+			d: "M4 0L8 6H0L4 0Z",
+			fill: "currentColor"
+		})]), h("svg", {
+			class: `gp-grid-sort-arrow-down${sortDirection === "desc" ? " active" : ""}`,
+			width: "8",
+			height: "6",
+			viewBox: "0 0 8 6"
+		}, [h("path", {
+			d: "M4 6L0 0H8L4 6Z",
+			fill: "currentColor"
+		})])])];
+		if (sortIndex !== void 0 && sortIndex > 0) arrowsChildren.push(h("span", { class: "gp-grid-sort-index" }, String(sortIndex)));
+		iconsChildren.push(h("span", { class: "gp-grid-sort-arrows" }, arrowsChildren));
+	}
+	if (filterable) iconsChildren.push(h("span", {
+		class: `gp-grid-filter-icon${hasFilter ? " active" : ""}`,
+		onMousedown: (e) => {
+			e.stopPropagation();
+			e.preventDefault();
+			params.onFilterClick();
+		},
+		onClick: (e) => {
+			e.stopPropagation();
+		}
+	}, [h("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 24 24",
+		fill: "currentColor"
+	}, [h("path", { d: "M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z" })])]));
+	if (iconsChildren.length > 0) children.push(h("span", { class: "gp-grid-header-icons" }, iconsChildren));
+	return h(Fragment, children);
+}
+
+//#endregion
+//#region src/composables/useFilterPopup.ts
+/**
+* Composable for filter popup behavior.
+* Handles click-outside detection and escape key to close the popup.
+*/
+function useFilterPopup(popupRef, options) {
+	const { onClose, ignoreSelector = ".gp-grid-filter-icon" } = options;
+	let handleClickOutside = null;
+	let handleKeyDown = null;
+	onMounted(() => {
+		handleClickOutside = (e) => {
+			const target = e.target;
+			if (ignoreSelector && target.closest(ignoreSelector)) return;
+			if (popupRef.value && !popupRef.value.contains(target)) onClose();
+		};
+		handleKeyDown = (e) => {
+			if (e.key === "Escape") onClose();
+		};
+		requestAnimationFrame(() => {
+			if (handleClickOutside) document.addEventListener("mousedown", handleClickOutside);
+			if (handleKeyDown) document.addEventListener("keydown", handleKeyDown);
+		});
+	});
+	onUnmounted(() => {
+		if (handleClickOutside) document.removeEventListener("mousedown", handleClickOutside);
+		if (handleKeyDown) document.removeEventListener("keydown", handleKeyDown);
+	});
+}
+
+//#endregion
+//#region src/composables/useFilterConditions.ts
+/**
+* Composable for managing filter conditions.
+* Used by NumberFilterContent, DateFilterContent, and TextFilterContent (condition mode).
+*/
+function useFilterConditions(initialConditions, initialCombination = "and") {
+	const conditions = ref([...initialConditions]);
+	const combination = ref(initialCombination);
+	const updateCondition = (index, updates) => {
+		const next = [...conditions.value];
+		next[index] = {
+			...next[index],
+			...updates
+		};
+		conditions.value = next;
+	};
+	const addCondition = (defaultOperator) => {
+		conditions.value = [...conditions.value, {
+			operator: defaultOperator,
+			value: "",
+			valueTo: "",
+			nextOperator: "and"
+		}];
+	};
+	const removeCondition = (index) => {
+		conditions.value = conditions.value.filter((_, i) => i !== index);
+	};
+	return {
+		conditions,
+		combination,
+		updateCondition,
+		addCondition,
+		removeCondition
+	};
+}
+
+//#endregion
+//#region src/components/TextFilterContent.vue
+const _hoisted_1$4 = { class: "gp-grid-filter-content gp-grid-filter-text" };
+const _hoisted_2$3 = {
+	key: 0,
+	class: "gp-grid-filter-mode-toggle"
+};
+const _hoisted_3$3 = {
+	key: 1,
+	class: "gp-grid-filter-info"
+};
+const _hoisted_4$3 = { class: "gp-grid-filter-actions" };
+const _hoisted_5$3 = ["disabled"];
+const _hoisted_6$2 = { class: "gp-grid-filter-list" };
+const _hoisted_7$2 = {
+	key: 0,
+	class: "gp-grid-filter-option"
+};
+const _hoisted_8$2 = ["checked"];
+const _hoisted_9$2 = ["checked", "onChange"];
+const _hoisted_10$2 = {
+	key: 0,
+	class: "gp-grid-filter-combination"
+};
+const _hoisted_11 = ["onClick"];
+const _hoisted_12 = ["onClick"];
+const _hoisted_13 = { class: "gp-grid-filter-row" };
+const _hoisted_14 = [
+	"value",
+	"autofocus",
+	"onChange"
+];
+const _hoisted_15 = ["value"];
+const _hoisted_16 = ["value", "onInput"];
+const _hoisted_17 = ["onClick"];
+const MAX_VALUES_FOR_LIST = 100;
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+	__name: "TextFilterContent",
+	props: {
+		distinctValues: {},
+		currentFilter: {}
+	},
+	emits: ["apply", "close"],
+	setup(__props, { emit: __emit }) {
+		const OPERATORS = [
+			{
+				value: "contains",
+				label: "Contains"
+			},
+			{
+				value: "notContains",
+				label: "Does not contain"
+			},
+			{
+				value: "equals",
+				label: "Equals"
+			},
+			{
+				value: "notEquals",
+				label: "Does not equal"
+			},
+			{
+				value: "startsWith",
+				label: "Starts with"
+			},
+			{
+				value: "endsWith",
+				label: "Ends with"
+			},
+			{
+				value: "blank",
+				label: "Is blank"
+			},
+			{
+				value: "notBlank",
+				label: "Is not blank"
+			}
+		];
+		const props = __props;
+		const emit = __emit;
+		function valueToString(v) {
+			if (Array.isArray(v)) return v.join(", ");
+			return String(v ?? "");
+		}
+		const uniqueValues = computed(() => {
+			const values = props.distinctValues.filter((v) => v != null && v !== "" && !(Array.isArray(v) && v.length === 0)).map((v) => valueToString(v));
+			return Array.from(new Set(values)).sort((a, b) => {
+				const numA = parseFloat(a);
+				const numB = parseFloat(b);
+				if (!isNaN(numA) && !isNaN(numB)) return numA - numB;
+				return a.localeCompare(b, void 0, {
+					numeric: true,
+					sensitivity: "base"
+				});
+			});
+		});
+		const hasTooManyValues = computed(() => uniqueValues.value.length > MAX_VALUES_FOR_LIST);
+		const mode = ref(computed(() => {
+			if (!props.currentFilter?.conditions[0]) return hasTooManyValues.value ? "condition" : "values";
+			const cond = props.currentFilter.conditions[0];
+			if (cond.selectedValues && cond.selectedValues.size > 0) return "values";
+			return "condition";
+		}).value);
+		const initialSelected = computed(() => {
+			if (!props.currentFilter?.conditions[0]) return /* @__PURE__ */ new Set();
+			return props.currentFilter.conditions[0].selectedValues ?? /* @__PURE__ */ new Set();
+		});
+		const initialIncludeBlanks = computed(() => {
+			if (!props.currentFilter?.conditions[0]) return true;
+			return props.currentFilter.conditions[0].includeBlank ?? true;
+		});
+		const searchText = ref("");
+		const selectedValues = ref(new Set(initialSelected.value));
+		const includeBlanks = ref(initialIncludeBlanks.value);
+		const { conditions, combination, updateCondition, addCondition, removeCondition } = useFilterConditions(computed(() => {
+			if (!props.currentFilter?.conditions.length) return [{
+				operator: "contains",
+				value: "",
+				valueTo: "",
+				nextOperator: "and"
+			}];
+			const cond = props.currentFilter.conditions[0];
+			if (cond.selectedValues && cond.selectedValues.size > 0) return [{
+				operator: "contains",
+				value: "",
+				valueTo: "",
+				nextOperator: "and"
+			}];
+			const defaultCombination = props.currentFilter.combination ?? "and";
+			return props.currentFilter.conditions.map((c) => {
+				const tc = c;
+				return {
+					operator: tc.operator,
+					value: tc.value ?? "",
+					valueTo: "",
+					nextOperator: tc.nextOperator ?? defaultCombination
+				};
+			});
+		}).value, props.currentFilter?.combination ?? "and");
+		const displayValues = computed(() => {
+			if (!searchText.value) return uniqueValues.value;
+			const lower = searchText.value.toLowerCase();
+			return uniqueValues.value.filter((v) => v.toLowerCase().includes(lower));
+		});
+		const hasBlanks = computed(() => {
+			return props.distinctValues.some((v) => v == null || v === "");
+		});
+		const allSelected = computed(() => {
+			return displayValues.value.every((v) => selectedValues.value.has(v)) && (!hasBlanks.value || includeBlanks.value);
+		});
+		function handleSelectAll() {
+			selectedValues.value = new Set(displayValues.value);
+			if (hasBlanks.value) includeBlanks.value = true;
+		}
+		function handleDeselectAll() {
+			selectedValues.value = /* @__PURE__ */ new Set();
+			includeBlanks.value = false;
+		}
+		function handleValueToggle(value) {
+			const next = new Set(selectedValues.value);
+			if (next.has(value)) next.delete(value);
+			else next.add(value);
+			selectedValues.value = next;
+		}
+		function handleApply() {
+			if (mode.value === "values") {
+				if (uniqueValues.value.every((v) => selectedValues.value.has(v)) && (!hasBlanks.value || includeBlanks.value)) {
+					emit("apply", null);
+					return;
+				}
+				emit("apply", {
+					conditions: [{
+						type: "text",
+						operator: "equals",
+						selectedValues: selectedValues.value,
+						includeBlank: includeBlanks.value
+					}],
+					combination: "and"
+				});
+			} else {
+				const validConditions = conditions.value.filter((c) => {
+					if (c.operator === "blank" || c.operator === "notBlank") return true;
+					return c.value.trim() !== "";
+				});
+				if (validConditions.length === 0) {
+					emit("apply", null);
+					return;
+				}
+				emit("apply", {
+					conditions: validConditions.map((c) => ({
+						type: "text",
+						operator: c.operator,
+						value: c.value,
+						nextOperator: c.nextOperator
+					})),
+					combination: "and"
+				});
+			}
+		}
+		function handleClear() {
+			emit("apply", null);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1$4, [
+				createCommentVNode(" Mode toggle - only show if not too many values "),
+				!hasTooManyValues.value ? (openBlock(), createElementBlock("div", _hoisted_2$3, [createElementVNode("button", {
+					type: "button",
+					class: normalizeClass({ active: mode.value === "values" }),
+					onClick: _cache[0] || (_cache[0] = ($event) => mode.value = "values")
+				}, " Values ", 2), createElementVNode("button", {
+					type: "button",
+					class: normalizeClass({ active: mode.value === "condition" }),
+					onClick: _cache[1] || (_cache[1] = ($event) => mode.value = "condition")
+				}, " Condition ", 2)])) : createCommentVNode("v-if", true),
+				createCommentVNode(" Too many values message "),
+				hasTooManyValues.value && mode.value === "condition" ? (openBlock(), createElementBlock("div", _hoisted_3$3, " Too many unique values (" + toDisplayString(uniqueValues.value.length) + "). Use conditions to filter. ", 1)) : createCommentVNode("v-if", true),
+				createCommentVNode(" VALUES MODE "),
+				mode.value === "values" ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+					createCommentVNode(" Search input "),
+					withDirectives(createElementVNode("input", {
+						"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchText.value = $event),
+						class: "gp-grid-filter-search",
+						type: "text",
+						placeholder: "Search...",
+						autofocus: ""
+					}, null, 512), [[vModelText, searchText.value]]),
+					createCommentVNode(" Select all / Deselect all "),
+					createElementVNode("div", _hoisted_4$3, [createElementVNode("button", {
+						type: "button",
+						disabled: allSelected.value,
+						onClick: handleSelectAll
+					}, " Select All ", 8, _hoisted_5$3), createElementVNode("button", {
+						type: "button",
+						onClick: handleDeselectAll
+					}, " Deselect All ")]),
+					createCommentVNode(" Checkbox list "),
+					createElementVNode("div", _hoisted_6$2, [
+						createCommentVNode(" Blanks option "),
+						hasBlanks.value ? (openBlock(), createElementBlock("label", _hoisted_7$2, [createElementVNode("input", {
+							type: "checkbox",
+							checked: includeBlanks.value,
+							onChange: _cache[3] || (_cache[3] = ($event) => includeBlanks.value = !includeBlanks.value)
+						}, null, 40, _hoisted_8$2), _cache[5] || (_cache[5] = createElementVNode("span", { class: "gp-grid-filter-blank" }, "(Blanks)", -1))])) : createCommentVNode("v-if", true),
+						createCommentVNode(" Values "),
+						(openBlock(true), createElementBlock(Fragment, null, renderList(displayValues.value, (value) => {
+							return openBlock(), createElementBlock("label", {
+								key: value,
+								class: "gp-grid-filter-option"
+							}, [createElementVNode("input", {
+								type: "checkbox",
+								checked: selectedValues.value.has(value),
+								onChange: ($event) => handleValueToggle(value)
+							}, null, 40, _hoisted_9$2), createElementVNode("span", null, toDisplayString(value), 1)]);
+						}), 128))
+					])
+				], 64)) : createCommentVNode("v-if", true),
+				createCommentVNode(" CONDITION MODE "),
+				mode.value === "condition" ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
+					(openBlock(true), createElementBlock(Fragment, null, renderList(unref(conditions), (cond, index) => {
+						return openBlock(), createElementBlock("div", {
+							key: index,
+							class: "gp-grid-filter-condition"
+						}, [
+							createCommentVNode(" Combination toggle (AND/OR) for conditions after the first "),
+							index > 0 ? (openBlock(), createElementBlock("div", _hoisted_10$2, [createElementVNode("button", {
+								type: "button",
+								class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "and" }),
+								onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "and" })
+							}, " AND ", 10, _hoisted_11), createElementVNode("button", {
+								type: "button",
+								class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "or" }),
+								onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "or" })
+							}, " OR ", 10, _hoisted_12)])) : createCommentVNode("v-if", true),
+							createElementVNode("div", _hoisted_13, [
+								createCommentVNode(" Operator select "),
+								createElementVNode("select", {
+									value: cond.operator,
+									autofocus: index === 0,
+									onChange: ($event) => unref(updateCondition)(index, { operator: $event.target.value })
+								}, [(openBlock(), createElementBlock(Fragment, null, renderList(OPERATORS, (op) => {
+									return createElementVNode("option", {
+										key: op.value,
+										value: op.value
+									}, toDisplayString(op.label), 9, _hoisted_15);
+								}), 64))], 40, _hoisted_14),
+								createCommentVNode(" Text input (hidden for blank/notBlank) "),
+								cond.operator !== "blank" && cond.operator !== "notBlank" ? (openBlock(), createElementBlock("input", {
+									key: 0,
+									type: "text",
+									value: cond.value,
+									placeholder: "Value",
+									class: "gp-grid-filter-text-input",
+									onInput: ($event) => unref(updateCondition)(index, { value: $event.target.value })
+								}, null, 40, _hoisted_16)) : createCommentVNode("v-if", true),
+								createCommentVNode(" Remove button (only if more than one condition) "),
+								unref(conditions).length > 1 ? (openBlock(), createElementBlock("button", {
+									key: 1,
+									type: "button",
+									class: "gp-grid-filter-remove",
+									onClick: ($event) => unref(removeCondition)(index)
+								}, " × ", 8, _hoisted_17)) : createCommentVNode("v-if", true)
+							])
+						]);
+					}), 128)),
+					createCommentVNode(" Add condition button "),
+					createElementVNode("button", {
+						type: "button",
+						class: "gp-grid-filter-add",
+						onClick: _cache[4] || (_cache[4] = ($event) => unref(addCondition)("contains"))
+					}, " + Add condition ")
+				], 64)) : createCommentVNode("v-if", true),
+				createCommentVNode(" Apply/Clear buttons "),
+				createElementVNode("div", { class: "gp-grid-filter-buttons" }, [createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-clear",
+					onClick: handleClear
+				}, " Clear "), createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-apply",
+					onClick: handleApply
+				}, " Apply ")])
+			]);
+		};
+	}
+});
+var TextFilterContent_default = _sfc_main$4;
+
+//#endregion
+//#region src/components/NumberFilterContent.vue
+const _hoisted_1$3 = { class: "gp-grid-filter-content gp-grid-filter-number" };
+const _hoisted_2$2 = {
+	key: 0,
+	class: "gp-grid-filter-combination"
+};
+const _hoisted_3$2 = ["onClick"];
+const _hoisted_4$2 = ["onClick"];
+const _hoisted_5$2 = { class: "gp-grid-filter-row" };
+const _hoisted_6$1 = ["value", "onChange"];
+const _hoisted_7$1 = ["value"];
+const _hoisted_8$1 = ["value", "onInput"];
+const _hoisted_9$1 = ["value", "onInput"];
+const _hoisted_10$1 = ["onClick"];
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+	__name: "NumberFilterContent",
+	props: { currentFilter: {} },
+	emits: ["apply", "close"],
+	setup(__props, { emit: __emit }) {
+		const OPERATORS = [
+			{
+				value: "=",
+				label: "="
+			},
+			{
+				value: "!=",
+				label: "≠"
+			},
+			{
+				value: ">",
+				label: ">"
+			},
+			{
+				value: "<",
+				label: "<"
+			},
+			{
+				value: ">=",
+				label: "≥"
+			},
+			{
+				value: "<=",
+				label: "≤"
+			},
+			{
+				value: "between",
+				label: "↔"
+			},
+			{
+				value: "blank",
+				label: "Is blank"
+			},
+			{
+				value: "notBlank",
+				label: "Not blank"
+			}
+		];
+		const props = __props;
+		const emit = __emit;
+		const { conditions, combination, updateCondition, addCondition, removeCondition } = useFilterConditions(computed(() => {
+			if (!props.currentFilter?.conditions.length) return [{
+				operator: "=",
+				value: "",
+				valueTo: "",
+				nextOperator: "and"
+			}];
+			const defaultCombination = props.currentFilter.combination ?? "and";
+			return props.currentFilter.conditions.map((c) => {
+				const cond = c;
+				return {
+					operator: cond.operator,
+					value: cond.value != null ? String(cond.value) : "",
+					valueTo: cond.valueTo != null ? String(cond.valueTo) : "",
+					nextOperator: cond.nextOperator ?? defaultCombination
+				};
+			});
+		}).value, props.currentFilter?.combination ?? "and");
+		function handleApply() {
+			const validConditions = conditions.value.filter((c) => {
+				if (c.operator === "blank" || c.operator === "notBlank") return true;
+				if (c.operator === "between") return c.value !== "" && c.valueTo !== "";
+				return c.value !== "";
+			});
+			if (validConditions.length === 0) {
+				emit("apply", null);
+				return;
+			}
+			emit("apply", {
+				conditions: validConditions.map((c) => ({
+					type: "number",
+					operator: c.operator,
+					value: c.value ? parseFloat(c.value) : void 0,
+					valueTo: c.valueTo ? parseFloat(c.valueTo) : void 0,
+					nextOperator: c.nextOperator
+				})),
+				combination: "and"
+			});
+		}
+		function handleClear() {
+			emit("apply", null);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1$3, [
+				(openBlock(true), createElementBlock(Fragment, null, renderList(unref(conditions), (cond, index) => {
+					return openBlock(), createElementBlock("div", {
+						key: index,
+						class: "gp-grid-filter-condition"
+					}, [
+						createCommentVNode(" Combination toggle (AND/OR) for conditions after the first "),
+						index > 0 ? (openBlock(), createElementBlock("div", _hoisted_2$2, [createElementVNode("button", {
+							type: "button",
+							class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "and" }),
+							onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "and" })
+						}, " AND ", 10, _hoisted_3$2), createElementVNode("button", {
+							type: "button",
+							class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "or" }),
+							onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "or" })
+						}, " OR ", 10, _hoisted_4$2)])) : createCommentVNode("v-if", true),
+						createElementVNode("div", _hoisted_5$2, [
+							createCommentVNode(" Operator select "),
+							createElementVNode("select", {
+								value: cond.operator,
+								onChange: ($event) => unref(updateCondition)(index, { operator: $event.target.value })
+							}, [(openBlock(), createElementBlock(Fragment, null, renderList(OPERATORS, (op) => {
+								return createElementVNode("option", {
+									key: op.value,
+									value: op.value
+								}, toDisplayString(op.label), 9, _hoisted_7$1);
+							}), 64))], 40, _hoisted_6$1),
+							createCommentVNode(" Number input (hidden for blank/notBlank) "),
+							cond.operator !== "blank" && cond.operator !== "notBlank" ? (openBlock(), createElementBlock("input", {
+								key: 0,
+								type: "number",
+								value: cond.value,
+								placeholder: "Value",
+								onInput: ($event) => unref(updateCondition)(index, { value: $event.target.value })
+							}, null, 40, _hoisted_8$1)) : createCommentVNode("v-if", true),
+							createCommentVNode(" Second number input for \"between\" "),
+							cond.operator === "between" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [_cache[1] || (_cache[1] = createElementVNode("span", { class: "gp-grid-filter-to" }, "to", -1)), createElementVNode("input", {
+								type: "number",
+								value: cond.valueTo,
+								placeholder: "Value",
+								onInput: ($event) => unref(updateCondition)(index, { valueTo: $event.target.value })
+							}, null, 40, _hoisted_9$1)], 64)) : createCommentVNode("v-if", true),
+							createCommentVNode(" Remove button (only if more than one condition) "),
+							unref(conditions).length > 1 ? (openBlock(), createElementBlock("button", {
+								key: 2,
+								type: "button",
+								class: "gp-grid-filter-remove",
+								onClick: ($event) => unref(removeCondition)(index)
+							}, " × ", 8, _hoisted_10$1)) : createCommentVNode("v-if", true)
+						])
+					]);
+				}), 128)),
+				createCommentVNode(" Add condition button "),
+				createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-add",
+					onClick: _cache[0] || (_cache[0] = ($event) => unref(addCondition)("="))
+				}, " + Add condition "),
+				createCommentVNode(" Apply/Clear buttons "),
+				createElementVNode("div", { class: "gp-grid-filter-buttons" }, [createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-clear",
+					onClick: handleClear
+				}, " Clear "), createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-apply",
+					onClick: handleApply
+				}, " Apply ")])
+			]);
+		};
+	}
+});
+var NumberFilterContent_default = _sfc_main$3;
+
+//#endregion
+//#region src/components/DateFilterContent.vue
+const _hoisted_1$2 = { class: "gp-grid-filter-content gp-grid-filter-date" };
+const _hoisted_2$1 = {
+	key: 0,
+	class: "gp-grid-filter-combination"
+};
+const _hoisted_3$1 = ["onClick"];
+const _hoisted_4$1 = ["onClick"];
+const _hoisted_5$1 = { class: "gp-grid-filter-row" };
+const _hoisted_6 = ["value", "onChange"];
+const _hoisted_7 = ["value"];
+const _hoisted_8 = ["value", "onInput"];
+const _hoisted_9 = ["value", "onInput"];
+const _hoisted_10 = ["onClick"];
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+	__name: "DateFilterContent",
+	props: { currentFilter: {} },
+	emits: ["apply", "close"],
+	setup(__props, { emit: __emit }) {
+		const OPERATORS = [
+			{
+				value: "=",
+				label: "="
+			},
+			{
+				value: "!=",
+				label: "≠"
+			},
+			{
+				value: ">",
+				label: ">"
+			},
+			{
+				value: "<",
+				label: "<"
+			},
+			{
+				value: "between",
+				label: "↔"
+			},
+			{
+				value: "blank",
+				label: "Is blank"
+			},
+			{
+				value: "notBlank",
+				label: "Not blank"
+			}
+		];
+		const props = __props;
+		const emit = __emit;
+		function formatDateForInput(date) {
+			if (!date) return "";
+			const d = typeof date === "string" ? new Date(date) : date;
+			if (isNaN(d.getTime())) return "";
+			return d.toISOString().split("T")[0];
+		}
+		const { conditions, combination, updateCondition, addCondition, removeCondition } = useFilterConditions(computed(() => {
+			if (!props.currentFilter?.conditions.length) return [{
+				operator: "=",
+				value: "",
+				valueTo: "",
+				nextOperator: "and"
+			}];
+			const defaultCombination = props.currentFilter.combination ?? "and";
+			return props.currentFilter.conditions.map((c) => {
+				const cond = c;
+				return {
+					operator: cond.operator,
+					value: formatDateForInput(cond.value),
+					valueTo: formatDateForInput(cond.valueTo),
+					nextOperator: cond.nextOperator ?? defaultCombination
+				};
+			});
+		}).value, props.currentFilter?.combination ?? "and");
+		function handleApply() {
+			const validConditions = conditions.value.filter((c) => {
+				if (c.operator === "blank" || c.operator === "notBlank") return true;
+				if (c.operator === "between") return c.value !== "" && c.valueTo !== "";
+				return c.value !== "";
+			});
+			if (validConditions.length === 0) {
+				emit("apply", null);
+				return;
+			}
+			emit("apply", {
+				conditions: validConditions.map((c) => ({
+					type: "date",
+					operator: c.operator,
+					value: c.value || void 0,
+					valueTo: c.valueTo || void 0,
+					nextOperator: c.nextOperator
+				})),
+				combination: "and"
+			});
+		}
+		function handleClear() {
+			emit("apply", null);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1$2, [
+				(openBlock(true), createElementBlock(Fragment, null, renderList(unref(conditions), (cond, index) => {
+					return openBlock(), createElementBlock("div", {
+						key: index,
+						class: "gp-grid-filter-condition"
+					}, [
+						createCommentVNode(" Combination toggle (AND/OR) for conditions after the first "),
+						index > 0 ? (openBlock(), createElementBlock("div", _hoisted_2$1, [createElementVNode("button", {
+							type: "button",
+							class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "and" }),
+							onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "and" })
+						}, " AND ", 10, _hoisted_3$1), createElementVNode("button", {
+							type: "button",
+							class: normalizeClass({ active: unref(conditions)[index - 1]?.nextOperator === "or" }),
+							onClick: ($event) => unref(updateCondition)(index - 1, { nextOperator: "or" })
+						}, " OR ", 10, _hoisted_4$1)])) : createCommentVNode("v-if", true),
+						createElementVNode("div", _hoisted_5$1, [
+							createCommentVNode(" Operator select "),
+							createElementVNode("select", {
+								value: cond.operator,
+								onChange: ($event) => unref(updateCondition)(index, { operator: $event.target.value })
+							}, [(openBlock(), createElementBlock(Fragment, null, renderList(OPERATORS, (op) => {
+								return createElementVNode("option", {
+									key: op.value,
+									value: op.value
+								}, toDisplayString(op.label), 9, _hoisted_7);
+							}), 64))], 40, _hoisted_6),
+							createCommentVNode(" Date input (hidden for blank/notBlank) "),
+							cond.operator !== "blank" && cond.operator !== "notBlank" ? (openBlock(), createElementBlock("input", {
+								key: 0,
+								type: "date",
+								value: cond.value,
+								onInput: ($event) => unref(updateCondition)(index, { value: $event.target.value })
+							}, null, 40, _hoisted_8)) : createCommentVNode("v-if", true),
+							createCommentVNode(" Second date input for \"between\" "),
+							cond.operator === "between" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [_cache[1] || (_cache[1] = createElementVNode("span", { class: "gp-grid-filter-to" }, "to", -1)), createElementVNode("input", {
+								type: "date",
+								value: cond.valueTo,
+								onInput: ($event) => unref(updateCondition)(index, { valueTo: $event.target.value })
+							}, null, 40, _hoisted_9)], 64)) : createCommentVNode("v-if", true),
+							createCommentVNode(" Remove button (only if more than one condition) "),
+							unref(conditions).length > 1 ? (openBlock(), createElementBlock("button", {
+								key: 2,
+								type: "button",
+								class: "gp-grid-filter-remove",
+								onClick: ($event) => unref(removeCondition)(index)
+							}, " × ", 8, _hoisted_10)) : createCommentVNode("v-if", true)
+						])
+					]);
+				}), 128)),
+				createCommentVNode(" Add condition button "),
+				createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-add",
+					onClick: _cache[0] || (_cache[0] = ($event) => unref(addCondition)("="))
+				}, " + Add condition "),
+				createCommentVNode(" Apply/Clear buttons "),
+				createElementVNode("div", { class: "gp-grid-filter-buttons" }, [createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-clear",
+					onClick: handleClear
+				}, " Clear "), createElementVNode("button", {
+					type: "button",
+					class: "gp-grid-filter-btn-apply",
+					onClick: handleApply
+				}, " Apply ")])
+			]);
+		};
+	}
+});
+var DateFilterContent_default = _sfc_main$2;
+
+//#endregion
+//#region src/components/FilterPopup.vue
+const _hoisted_1$1 = { class: "gp-grid-filter-header" };
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+	__name: "FilterPopup",
+	props: {
+		column: {},
+		colIndex: {},
+		anchorRect: {},
+		distinctValues: {},
+		currentFilter: {}
+	},
+	emits: ["apply", "close"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const popupRef = ref(null);
+		useFilterPopup(popupRef, {
+			onClose: () => emit("close"),
+			ignoreSelector: ".gp-grid-filter-icon"
+		});
+		const colId = computed(() => props.column.colId ?? props.column.field);
+		function handleApply(filter) {
+			emit("apply", colId.value, filter);
+			emit("close");
+		}
+		function handleClose() {
+			emit("close");
+		}
+		const dataType = computed(() => props.column.cellDataType);
+		computed(() => dataType.value === "text" || dataType.value === "object");
+		const isNumberType = computed(() => dataType.value === "number");
+		const isDateType = computed(() => dataType.value === "date" || dataType.value === "dateString" || dataType.value === "dateTime" || dataType.value === "dateTimeString");
+		const popupStyle = computed(() => ({
+			position: "fixed",
+			top: `${props.anchorRect.top + props.anchorRect.height + 4}px`,
+			left: `${props.anchorRect.left}px`,
+			minWidth: `${Math.max(200, props.anchorRect.width)}px`,
+			zIndex: 1e4
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "popupRef",
+				ref: popupRef,
+				class: "gp-grid-filter-popup",
+				style: normalizeStyle(popupStyle.value)
+			}, [
+				createElementVNode("div", _hoisted_1$1, " Filter: " + toDisplayString(__props.column.headerName ?? __props.column.field), 1),
+				createCommentVNode(" Number filter "),
+				isNumberType.value ? (openBlock(), createBlock(NumberFilterContent_default, {
+					key: 0,
+					"current-filter": __props.currentFilter,
+					onApply: handleApply,
+					onClose: handleClose
+				}, null, 8, ["current-filter"])) : isDateType.value ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [createCommentVNode(" Date filter "), createVNode(DateFilterContent_default, {
+					"current-filter": __props.currentFilter,
+					onApply: handleApply,
+					onClose: handleClose
+				}, null, 8, ["current-filter"])], 2112)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [createCommentVNode(" Text filter (default) "), createVNode(TextFilterContent_default, {
+					"distinct-values": __props.distinctValues,
+					"current-filter": __props.currentFilter,
+					onApply: handleApply,
+					onClose: handleClose
+				}, null, 8, ["distinct-values", "current-filter"])], 2112))
+			], 4);
+		};
+	}
+});
+var FilterPopup_default = _sfc_main$1;
+
+//#endregion
+//#region src/GpGrid.vue
+const _hoisted_1 = ["data-col-index", "onClick"];
+const _hoisted_2 = [
+	"onMousedown",
+	"onDblclick",
+	"onMouseenter"
+];
+const _hoisted_3 = {
+	key: 1,
+	class: "gp-grid-loading"
+};
+const _hoisted_4 = {
+	key: 2,
+	class: "gp-grid-error"
+};
+const _hoisted_5 = {
+	key: 3,
+	class: "gp-grid-empty"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	__name: "GpGrid",
+	props: {
+		columns: {},
+		dataSource: {},
+		rowData: {},
+		rowHeight: {},
+		headerHeight: {},
+		overscan: { default: 3 },
+		sortingEnabled: {
+			type: Boolean,
+			default: true
+		},
+		darkMode: {
+			type: Boolean,
+			default: false
+		},
+		wheelDampening: { default: .1 },
+		cellRenderers: { default: () => ({}) },
+		editRenderers: { default: () => ({}) },
+		headerRenderers: { default: () => ({}) },
+		cellRenderer: {},
+		editRenderer: {},
+		headerRenderer: {},
+		initialWidth: {},
+		initialHeight: {},
+		highlighting: {}
+	},
+	setup(__props, { expose: __expose }) {
+		injectStyles$1();
+		const props = __props;
+		const containerRef = ref(null);
+		const coreRef = shallowRef(null);
+		const currentDataSourceRef = shallowRef(null);
+		const coreUnsubscribeRef = shallowRef(null);
+		const { state, applyInstructions, reset: resetState } = useGridState({
+			initialWidth: props.initialWidth,
+			initialHeight: props.initialHeight
+		});
+		const totalHeaderHeight = computed(() => props.headerHeight ?? props.rowHeight);
+		const visibleColumnsWithIndices = computed(() => props.columns.map((col, index) => ({
+			column: col,
+			originalIndex: index
+		})).filter(({ column }) => !column.hidden));
+		const scaledColumns = computed(() => calculateScaledColumnPositions(visibleColumnsWithIndices.value.map((v) => v.column), state.viewportWidth));
+		const columnPositions = computed(() => scaledColumns.value.positions);
+		const columnWidths = computed(() => scaledColumns.value.widths);
+		const totalWidth = computed(() => getTotalWidth$1(columnPositions.value));
+		const slotsArray = computed(() => Array.from(state.slots.values()));
+		const { handleCellMouseDown, handleCellDoubleClick, handleFillHandleMouseDown, handleHeaderClick, handleKeyDown, handleWheel, dragState } = useInputHandler(coreRef, containerRef, computed(() => props.columns), {
+			activeCell: computed(() => state.activeCell),
+			selectionRange: computed(() => state.selectionRange),
+			editingCell: computed(() => state.editingCell),
+			filterPopupOpen: computed(() => state.filterPopup?.isOpen ?? false),
+			rowHeight: props.rowHeight,
+			headerHeight: totalHeaderHeight.value,
+			columnPositions,
+			visibleColumnsWithIndices,
+			slots: computed(() => state.slots)
+		});
+		const { fillHandlePosition } = useFillHandle({
+			activeCell: computed(() => state.activeCell),
+			selectionRange: computed(() => state.selectionRange),
+			slots: computed(() => state.slots),
+			columns: computed(() => props.columns),
+			visibleColumnsWithIndices,
+			columnPositions,
+			columnWidths,
+			rowHeight: props.rowHeight
+		});
+		function handleScroll() {
+			const container = containerRef.value;
+			const core = coreRef.value;
+			if (!container || !core) return;
+			core.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+		}
+		function handleFilterApply(colId, filter) {
+			const core = coreRef.value;
+			if (core) core.setFilter(colId, filter);
+		}
+		function handleFilterPopupClose() {
+			const core = coreRef.value;
+			if (core) core.closeFilterPopup();
+		}
+		function handleCellMouseEnter(rowIndex, colIndex) {
+			coreRef.value?.input.handleCellMouseEnter(rowIndex, colIndex);
+		}
+		function handleCellMouseLeave() {
+			coreRef.value?.input.handleCellMouseLeave();
+		}
+		function getRowClasses(slot) {
+			return ["gp-grid-row", ...coreRef.value?.highlight?.computeRowClasses(slot.rowIndex, slot.rowData) ?? []].filter(Boolean).join(" ");
+		}
+		function getCellClasses(rowIndex, colIndex, column, rowData, _hoverPosition) {
+			const isEditing = isCellEditing$1(rowIndex, colIndex, state.editingCell);
+			return [buildCellClasses$1(isCellActive$1(rowIndex, colIndex, state.activeCell), isCellSelected$1(rowIndex, colIndex, state.selectionRange), isEditing, isCellInFillPreview$1(rowIndex, colIndex, dragState.value.dragType === "fill", dragState.value.fillSourceRange, dragState.value.fillTarget)), ...coreRef.value?.highlight?.computeCombinedCellClasses(rowIndex, colIndex, column, rowData) ?? []].filter(Boolean).join(" ");
+		}
+		function getOrCreateDataSource() {
+			return props.dataSource ?? (props.rowData ? createDataSourceFromArray$1(props.rowData) : createClientDataSource$1([]));
+		}
+		/**
+		* Initialize or reinitialize the GridCore with a data source.
+		* Handles cleanup of old core and subscription before creating new ones.
+		*/
+		function initializeCore(dataSource) {
+			if (coreUnsubscribeRef.value) {
+				coreUnsubscribeRef.value();
+				coreUnsubscribeRef.value = null;
+			}
+			if (coreRef.value) coreRef.value.destroy();
+			const core = new GridCore$1({
+				columns: props.columns,
+				dataSource,
+				rowHeight: props.rowHeight,
+				headerHeight: totalHeaderHeight.value,
+				overscan: props.overscan,
+				sortingEnabled: props.sortingEnabled,
+				highlighting: props.highlighting
+			});
+			coreRef.value = core;
+			coreUnsubscribeRef.value = core.onBatchInstruction((instructions) => {
+				applyInstructions(instructions);
+			});
+			core.initialize();
+			const container = containerRef.value;
+			if (container) core.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+		}
+		onMounted(() => {
+			const dataSource = getOrCreateDataSource();
+			currentDataSourceRef.value = dataSource;
+			initializeCore(dataSource);
+			const container = containerRef.value;
+			if (container && typeof ResizeObserver !== "undefined") {
+				const resizeObserver = new ResizeObserver(() => {
+					coreRef.value?.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+				});
+				resizeObserver.observe(container);
+				onUnmounted(() => {
+					resizeObserver.disconnect();
+				});
+			}
+			onUnmounted(() => {
+				if (coreUnsubscribeRef.value) {
+					coreUnsubscribeRef.value();
+					coreUnsubscribeRef.value = null;
+				}
+				if (coreRef.value) {
+					coreRef.value.destroy();
+					coreRef.value = null;
+				}
+				if (currentDataSourceRef.value) {
+					currentDataSourceRef.value.destroy?.();
+					currentDataSourceRef.value = null;
+				}
+			});
+		});
+		watch([() => props.dataSource, () => props.rowData], () => {
+			const newDataSource = getOrCreateDataSource();
+			const oldDataSource = currentDataSourceRef.value;
+			if (oldDataSource && oldDataSource !== newDataSource) {
+				oldDataSource.destroy?.();
+				resetState();
+				currentDataSourceRef.value = newDataSource;
+				initializeCore(newDataSource);
+			} else if (!oldDataSource) currentDataSourceRef.value = newDataSource;
+		});
+		watch(() => props.dataSource, (dataSource) => {
+			if (dataSource) {
+				const mutableDataSource = dataSource;
+				if (mutableDataSource.subscribe) {
+					const unsubscribe = mutableDataSource.subscribe(() => {
+						coreRef.value?.refresh();
+					});
+					onUnmounted(() => unsubscribe());
+				}
+			}
+		}, { immediate: true });
+		watch(() => props.highlighting, (highlighting) => {
+			if (coreRef.value?.highlight && highlighting) coreRef.value.highlight.updateOptions(highlighting);
+		});
+		__expose({ core: coreRef });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "containerRef",
+				ref: containerRef,
+				class: normalizeClass(["gp-grid-container", { "gp-grid-container--dark": __props.darkMode }]),
+				style: {
+					"width": "100%",
+					"height": "100%",
+					"overflow": "auto",
+					"position": "relative"
+				},
+				tabindex: "0",
+				onScroll: handleScroll,
+				onWheel: _cache[1] || (_cache[1] = (e) => unref(handleWheel)(e, __props.wheelDampening)),
+				onKeydown: _cache[2] || (_cache[2] = (...args) => unref(handleKeyDown) && unref(handleKeyDown)(...args))
+			}, [
+				createCommentVNode(" Content sizer "),
+				createElementVNode("div", { style: normalizeStyle({
+					width: `${Math.max(unref(state).contentWidth, totalWidth.value)}px`,
+					height: `${Math.max(unref(state).contentHeight, totalHeaderHeight.value)}px`,
+					position: "relative",
+					minWidth: "100%"
+				}) }, [
+					createCommentVNode(" Headers "),
+					createElementVNode("div", {
+						class: "gp-grid-header",
+						style: normalizeStyle({
+							position: "sticky",
+							top: 0,
+							left: 0,
+							height: `${totalHeaderHeight.value}px`,
+							width: `${Math.max(unref(state).contentWidth, totalWidth.value)}px`,
+							minWidth: "100%"
+						})
+					}, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumnsWithIndices.value, ({ column, originalIndex }, visibleIndex) => {
+						return openBlock(), createElementBlock("div", {
+							key: column.colId ?? column.field,
+							class: "gp-grid-header-cell",
+							"data-col-index": originalIndex,
+							style: normalizeStyle({
+								position: "absolute",
+								left: `${columnPositions.value[visibleIndex]}px`,
+								top: 0,
+								width: `${columnWidths.value[visibleIndex]}px`,
+								height: `${totalHeaderHeight.value}px`,
+								background: "transparent"
+							}),
+							onClick: (e) => unref(handleHeaderClick)(originalIndex, e)
+						}, [(openBlock(), createBlock(resolveDynamicComponent(unref(renderHeader)({
+							column,
+							colIndex: originalIndex,
+							sortDirection: unref(state).headers.get(originalIndex)?.sortDirection,
+							sortIndex: unref(state).headers.get(originalIndex)?.sortIndex,
+							sortable: unref(state).headers.get(originalIndex)?.sortable ?? true,
+							filterable: unref(state).headers.get(originalIndex)?.filterable ?? true,
+							hasFilter: unref(state).headers.get(originalIndex)?.hasFilter ?? false,
+							core: coreRef.value,
+							container: containerRef.value,
+							headerRenderers: __props.headerRenderers ?? {},
+							globalHeaderRenderer: __props.headerRenderer
+						}))))], 12, _hoisted_1);
+					}), 128))], 4),
+					createCommentVNode(" Row slots "),
+					(openBlock(true), createElementBlock(Fragment, null, renderList(slotsArray.value.filter((s) => s.rowIndex >= 0), (slot) => {
+						return openBlock(), createElementBlock("div", {
+							key: slot.slotId,
+							class: normalizeClass(getRowClasses(slot)),
+							style: normalizeStyle({
+								position: "absolute",
+								top: 0,
+								left: 0,
+								transform: `translateY(${slot.translateY}px)`,
+								width: `${Math.max(unref(state).contentWidth, totalWidth.value)}px`,
+								height: `${__props.rowHeight}px`
+							})
+						}, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumnsWithIndices.value, ({ column, originalIndex }, visibleIndex) => {
+							return openBlock(), createElementBlock("div", {
+								key: `${slot.slotId}-${originalIndex}`,
+								class: normalizeClass(getCellClasses(slot.rowIndex, originalIndex, column, slot.rowData, unref(state).hoverPosition)),
+								style: normalizeStyle({
+									position: "absolute",
+									left: `${columnPositions.value[visibleIndex]}px`,
+									top: 0,
+									width: `${columnWidths.value[visibleIndex]}px`,
+									height: `${__props.rowHeight}px`
+								}),
+								onMousedown: (e) => unref(handleCellMouseDown)(slot.rowIndex, originalIndex, e),
+								onDblclick: () => unref(handleCellDoubleClick)(slot.rowIndex, originalIndex),
+								onMouseenter: () => handleCellMouseEnter(slot.rowIndex, originalIndex),
+								onMouseleave: handleCellMouseLeave
+							}, [createCommentVNode(" Edit mode "), unref(isCellEditing$1)(slot.rowIndex, originalIndex, unref(state).editingCell) && unref(state).editingCell ? (openBlock(), createBlock(resolveDynamicComponent(unref(renderEditCell)({
+								column,
+								rowData: slot.rowData,
+								rowIndex: slot.rowIndex,
+								colIndex: originalIndex,
+								initialValue: unref(state).editingCell.initialValue,
+								core: coreRef.value,
+								editRenderers: __props.editRenderers ?? {},
+								globalEditRenderer: __props.editRenderer
+							})), { key: 0 })) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createCommentVNode(" View mode "), (openBlock(), createBlock(resolveDynamicComponent(unref(renderCell)({
+								column,
+								rowData: slot.rowData,
+								rowIndex: slot.rowIndex,
+								colIndex: originalIndex,
+								isActive: unref(isCellActive$1)(slot.rowIndex, originalIndex, unref(state).activeCell),
+								isSelected: unref(isCellSelected$1)(slot.rowIndex, originalIndex, unref(state).selectionRange),
+								isEditing: false,
+								cellRenderers: __props.cellRenderers ?? {},
+								globalCellRenderer: __props.cellRenderer
+							}))))], 64))], 46, _hoisted_2);
+						}), 128))], 6);
+					}), 128)),
+					createCommentVNode(" Fill handle "),
+					unref(fillHandlePosition) && !unref(state).editingCell ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: "gp-grid-fill-handle",
+						style: normalizeStyle({
+							position: "absolute",
+							top: `${unref(fillHandlePosition).top}px`,
+							left: `${unref(fillHandlePosition).left}px`,
+							zIndex: 200
+						}),
+						onMousedown: _cache[0] || (_cache[0] = (...args) => unref(handleFillHandleMouseDown) && unref(handleFillHandleMouseDown)(...args))
+					}, null, 36)) : createCommentVNode("v-if", true),
+					createCommentVNode(" Loading indicator "),
+					unref(state).isLoading ? (openBlock(), createElementBlock("div", _hoisted_3, [..._cache[3] || (_cache[3] = [createElementVNode("div", { class: "gp-grid-loading-spinner" }, null, -1), createTextVNode(" Loading... ", -1)])])) : createCommentVNode("v-if", true),
+					createCommentVNode(" Error message "),
+					unref(state).error ? (openBlock(), createElementBlock("div", _hoisted_4, " Error: " + toDisplayString(unref(state).error), 1)) : createCommentVNode("v-if", true),
+					createCommentVNode(" Empty state "),
+					!unref(state).isLoading && !unref(state).error && unref(state).totalRows === 0 ? (openBlock(), createElementBlock("div", _hoisted_5, " No data to display ")) : createCommentVNode("v-if", true)
+				], 4),
+				createCommentVNode(" Filter Popup "),
+				unref(state).filterPopup?.isOpen && unref(state).filterPopup.column && unref(state).filterPopup.anchorRect ? (openBlock(), createBlock(FilterPopup_default, {
+					key: 0,
+					column: unref(state).filterPopup.column,
+					"col-index": unref(state).filterPopup.colIndex,
+					"anchor-rect": unref(state).filterPopup.anchorRect,
+					"distinct-values": unref(state).filterPopup.distinctValues,
+					"current-filter": unref(state).filterPopup.currentFilter,
+					onApply: handleFilterApply,
+					onClose: handleFilterPopupClose
+				}, null, 8, [
+					"column",
+					"col-index",
+					"anchor-rect",
+					"distinct-values",
+					"current-filter"
+				])) : createCommentVNode("v-if", true)
+			], 34);
+		};
+	}
+});
+var GpGrid_default = _sfc_main;
+
+//#endregion
+//#region src/composables/useGpGrid.ts
+/**
+* Nuxt-friendly composable for using gp-grid.
+* Returns all the pieces needed to build a custom grid component.
+*/
+function useGpGrid(options) {
+	injectStyles$1();
+	const containerRef = ref(null);
+	const coreRef = ref(null);
+	const { state, applyInstructions } = useGridState();
+	const totalHeaderHeight = computed(() => options.headerHeight ?? options.rowHeight);
+	const visibleColumnsWithIndices = computed(() => options.columns.map((col, index) => ({
+		column: col,
+		originalIndex: index
+	})).filter(({ column }) => !column.hidden));
+	const scaledColumns = computed(() => calculateScaledColumnPositions(visibleColumnsWithIndices.value.map((v) => v.column), state.viewportWidth));
+	const columnPositions = computed(() => scaledColumns.value.positions);
+	const columnWidths = computed(() => scaledColumns.value.widths);
+	const totalWidth = computed(() => getTotalWidth$1(columnPositions.value));
+	const slotsArray = computed(() => Array.from(state.slots.values()));
+	const { handleCellMouseDown, handleCellDoubleClick, handleFillHandleMouseDown, handleHeaderClick, handleKeyDown, handleWheel, dragState } = useInputHandler(coreRef, containerRef, computed(() => options.columns), {
+		activeCell: computed(() => state.activeCell),
+		selectionRange: computed(() => state.selectionRange),
+		editingCell: computed(() => state.editingCell),
+		filterPopupOpen: computed(() => state.filterPopup?.isOpen ?? false),
+		rowHeight: options.rowHeight,
+		headerHeight: totalHeaderHeight.value,
+		columnPositions,
+		visibleColumnsWithIndices,
+		slots: computed(() => state.slots)
+	});
+	const handleScroll = () => {
+		const container = containerRef.value;
+		const core = coreRef.value;
+		if (!container || !core) return;
+		core.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+	};
+	const handleFilterApply = (colId, filter) => {
+		const core = coreRef.value;
+		if (core) core.setFilter(colId, filter);
+	};
+	const handleFilterPopupClose = () => {
+		const core = coreRef.value;
+		if (core) core.closeFilterPopup();
+	};
+	const handleCellMouseEnter = (rowIndex, colIndex) => {
+		coreRef.value?.input.handleCellMouseEnter(rowIndex, colIndex);
+	};
+	const handleCellMouseLeave = () => {
+		coreRef.value?.input.handleCellMouseLeave();
+	};
+	onMounted(() => {
+		const dataSource = options.dataSource ?? (options.rowData ? createDataSourceFromArray$1(options.rowData) : createClientDataSource$1([]));
+		const core = new GridCore$1({
+			columns: options.columns,
+			dataSource,
+			rowHeight: options.rowHeight,
+			headerHeight: totalHeaderHeight.value,
+			overscan: options.overscan ?? 3,
+			sortingEnabled: options.sortingEnabled ?? true,
+			highlighting: options.highlighting
+		});
+		coreRef.value = core;
+		const unsubscribe = core.onBatchInstruction((instructions) => {
+			applyInstructions(instructions);
+		});
+		core.initialize();
+		const container = containerRef.value;
+		if (container) {
+			core.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+			const resizeObserver = new ResizeObserver(() => {
+				core.setViewport(container.scrollTop, container.scrollLeft, container.clientWidth, container.clientHeight);
+			});
+			resizeObserver.observe(container);
+			onUnmounted(() => {
+				resizeObserver.disconnect();
+				unsubscribe();
+				coreRef.value = null;
+			});
+		}
+	});
+	watch(() => options.dataSource, (dataSource) => {
+		if (dataSource) {
+			const mutableDataSource = dataSource;
+			if (mutableDataSource.subscribe) {
+				const unsubscribe = mutableDataSource.subscribe(() => {
+					coreRef.value?.refresh();
+				});
+				onUnmounted(() => unsubscribe());
+			}
+		}
+	}, { immediate: true });
+	watch(() => options.highlighting, (highlighting) => {
+		if (coreRef.value?.highlight && highlighting) coreRef.value.highlight.updateOptions(highlighting);
+	});
+	const { fillHandlePosition } = useFillHandle({
+		activeCell: computed(() => state.activeCell),
+		selectionRange: computed(() => state.selectionRange),
+		slots: computed(() => state.slots),
+		columns: computed(() => options.columns),
+		visibleColumnsWithIndices,
+		columnPositions,
+		columnWidths,
+		rowHeight: options.rowHeight
+	});
+	return {
+		containerRef,
+		coreRef,
+		state,
+		slotsArray,
+		totalHeaderHeight,
+		columnPositions,
+		columnWidths,
+		totalWidth,
+		fillHandlePosition,
+		handleScroll,
+		handleCellMouseDown,
+		handleCellDoubleClick,
+		handleFillHandleMouseDown,
+		handleHeaderClick,
+		handleKeyDown,
+		handleWheel,
+		handleFilterApply,
+		handleFilterPopupClose,
+		handleCellMouseEnter,
+		handleCellMouseLeave,
+		dragState,
+		isCellSelected: isCellSelected$1,
+		isCellActive: isCellActive$1,
+		isCellEditing: isCellEditing$1,
+		isCellInFillPreview: isCellInFillPreview$1,
+		buildCellClasses: buildCellClasses$1
+	};
+}
+
+//#endregion
+export { GpGrid_default as GpGrid, GpGrid_default as default, GridCore, buildCellClasses, calculateColumnPositions, createClientDataSource, createDataSourceFromArray, createInitialState, createMutableClientDataSource, createServerDataSource, findColumnAtX, getCellValue, getTotalWidth, gridStyles, injectStyles, isCellActive, isCellEditing, isCellInFillPreview, isCellSelected, isRowVisible, renderCell, renderEditCell, renderHeader, useAutoScroll, useFillHandle, useFilterConditions, useFilterPopup, useGpGrid, useGridState, useInputHandler };
+//# sourceMappingURL=index.js.map