@gp-grid/vue 0.7.4 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as vue0 from "vue";
2
- import { Component, ComputedRef, Ref, ShallowRef, VNode } from "vue";
2
+ import { Component as Component$1, ComputedRef, Ref, ShallowRef, VNode } from "vue";
3
3
 
4
4
  //#region ../core/src/types/basic.d.ts
5
5
  /** Cell data type primitive types */
@@ -60,6 +60,21 @@ interface FillHandleState {
60
60
  /** Target column */
61
61
  targetCol: number;
62
62
  }
63
+ /** Event emitted when a cell value is changed via editing or fill drag */
64
+ interface CellValueChangedEvent<TData = Row> {
65
+ /** Stable row ID (from getRowId) */
66
+ rowId: RowId;
67
+ /** Column index */
68
+ colIndex: number;
69
+ /** Column field name */
70
+ field: string;
71
+ /** Previous cell value */
72
+ oldValue: CellValue;
73
+ /** New cell value */
74
+ newValue: CellValue;
75
+ /** The full row data object */
76
+ rowData: TData;
77
+ }
63
78
  //#endregion
64
79
  //#region ../core/src/types/highlighting.d.ts
65
80
  /**
@@ -504,6 +519,8 @@ interface GridCoreOptions<TData = Row> {
504
519
  getRowId?: (row: TData) => RowId;
505
520
  /** Row/column/cell highlighting configuration */
506
521
  highlighting?: HighlightingOptions<TData>;
522
+ /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
523
+ onCellValueChanged?: (event: CellValueChangedEvent<TData>) => void;
507
524
  }
508
525
  //#endregion
509
526
  //#region ../core/src/types/input.d.ts
@@ -1081,6 +1098,8 @@ declare class GridCore<TData extends Row = Row> {
1081
1098
  private headerHeight;
1082
1099
  private overscan;
1083
1100
  private sortingEnabled;
1101
+ private getRowId?;
1102
+ private onCellValueChanged?;
1084
1103
  private scrollTop;
1085
1104
  private scrollLeft;
1086
1105
  private viewportWidth;
@@ -1107,6 +1126,7 @@ declare class GridCore<TData extends Row = Row> {
1107
1126
  private virtualContentHeight;
1108
1127
  private scrollRatio;
1109
1128
  private isDestroyed;
1129
+ private _isDataLoading;
1110
1130
  constructor(options: GridCoreOptions<TData>);
1111
1131
  /**
1112
1132
  * Initialize the grid and load initial data.
@@ -1141,6 +1161,7 @@ declare class GridCore<TData extends Row = Row> {
1141
1161
  getEditState(): EditState | null;
1142
1162
  getCellValue(row: number, col: number): CellValue;
1143
1163
  setCellValue(row: number, col: number, value: CellValue): void;
1164
+ private clearSelectionIfInvalid;
1144
1165
  private computeColumnPositions;
1145
1166
  private emitContentSize;
1146
1167
  private emitHeaders;
@@ -1192,6 +1213,12 @@ declare class GridCore<TData extends Row = Row> {
1192
1213
  * Refresh data from the data source.
1193
1214
  */
1194
1215
  refresh(): Promise<void>;
1216
+ /**
1217
+ * Fast-path refresh for transaction-based mutations.
1218
+ * Only re-fetches the visible window instead of all rows.
1219
+ * Use this when data was mutated via MutableDataSource transactions.
1220
+ */
1221
+ refreshFromTransaction(): Promise<void>;
1195
1222
  /**
1196
1223
  * Refresh slot display without refetching data.
1197
1224
  * Useful after in-place data modifications like fill operations.
@@ -1224,6 +1251,8 @@ declare class GridCore<TData extends Row = Row> {
1224
1251
  setRow(index: number, data: TData): void;
1225
1252
  /**
1226
1253
  * Update the data source and refresh.
1254
+ * Preserves grid state (sort, filter, scroll position).
1255
+ * Cancels any active edit and clamps selection to valid range.
1227
1256
  */
1228
1257
  setDataSource(dataSource: DataSource<TData>): Promise<void>;
1229
1258
  /**
@@ -1324,10 +1353,15 @@ interface MutableClientDataSourceOptions<TData> {
1324
1353
  debounceMs?: number;
1325
1354
  /** Callback when transactions are processed. */
1326
1355
  onTransactionProcessed?: (result: TransactionResult) => void;
1356
+ /** Use Web Worker for sorting large datasets (default: true) */
1357
+ useWorker?: boolean;
1358
+ /** Options for parallel sorting (only used when useWorker is true) */
1359
+ parallelSort?: ParallelSortOptions | false;
1327
1360
  }
1328
1361
  /**
1329
1362
  * Creates a mutable client-side data source with transaction support.
1330
1363
  * Uses IndexedDataStore for efficient incremental operations.
1364
+ * For large datasets, sorting is automatically offloaded to a Web Worker.
1331
1365
  */
1332
1366
  declare function createMutableClientDataSource<TData extends Row = Row>(data: TData[], options: MutableClientDataSourceOptions<TData>): MutableDataSource<TData>;
1333
1367
  //#endregion
@@ -1421,12 +1455,20 @@ interface GpGridProps<TData extends Row = Row> {
1421
1455
  sortingEnabled?: boolean;
1422
1456
  darkMode?: boolean;
1423
1457
  wheelDampening?: number;
1424
- cellRenderers?: Record<string, VueCellRenderer<TData> | Component>;
1425
- editRenderers?: Record<string, VueEditRenderer<TData> | Component>;
1426
- headerRenderers?: Record<string, VueHeaderRenderer | Component>;
1427
- cellRenderer?: VueCellRenderer<TData> | Component;
1428
- editRenderer?: VueEditRenderer<TData> | Component;
1429
- headerRenderer?: VueHeaderRenderer | Component;
1458
+ cellRenderers?: Record<string, VueCellRenderer<TData> | Component$1>;
1459
+ editRenderers?: Record<string, VueEditRenderer<TData> | Component$1>;
1460
+ headerRenderers?: Record<string, VueHeaderRenderer | Component$1>;
1461
+ cellRenderer?: VueCellRenderer<TData> | Component$1;
1462
+ editRenderer?: VueEditRenderer<TData> | Component$1;
1463
+ headerRenderer?: VueHeaderRenderer | Component$1;
1464
+ /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
1465
+ getRowId?: (row: TData) => RowId;
1466
+ /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
1467
+ onCellValueChanged?: (event: CellValueChangedEvent<TData>) => void;
1468
+ /** Custom loading component to render instead of default spinner */
1469
+ loadingComponent?: Component$1<{
1470
+ isLoading: boolean;
1471
+ }>;
1430
1472
  }
1431
1473
  //#endregion
1432
1474
  //#region src/GpGrid.vue.d.ts
@@ -1452,6 +1494,14 @@ type __VLS_Props = {
1452
1494
  initialHeight?: number;
1453
1495
  /** Row/column/cell highlighting configuration */
1454
1496
  highlighting?: HighlightingOptions<Row>;
1497
+ /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
1498
+ getRowId?: (row: Row) => RowId;
1499
+ /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
1500
+ onCellValueChanged?: (event: CellValueChangedEvent<Row>) => void;
1501
+ /** Custom loading component to render instead of default spinner */
1502
+ loadingComponent?: Component<{
1503
+ isLoading: boolean;
1504
+ }>;
1455
1505
  };
1456
1506
  declare const __VLS_export: vue0.DefineComponent<__VLS_Props, {
1457
1507
  core: vue0.ShallowRef<GridCore<unknown> | null, GridCore<unknown> | null>;
@@ -1478,6 +1528,10 @@ interface UseGpGridOptions<TData extends Row = Row> {
1478
1528
  darkMode?: boolean;
1479
1529
  wheelDampening?: number;
1480
1530
  highlighting?: HighlightingOptions<TData>;
1531
+ /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
1532
+ getRowId?: (row: TData) => RowId;
1533
+ /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
1534
+ onCellValueChanged?: (event: CellValueChangedEvent<TData>) => void;
1481
1535
  cellRenderers?: Record<string, VueCellRenderer<TData>>;
1482
1536
  editRenderers?: Record<string, VueEditRenderer<TData>>;
1483
1537
  headerRenderers?: Record<string, VueHeaderRenderer>;
@@ -1535,6 +1589,58 @@ interface UseGpGridResult<TData extends Row = Row> {
1535
1589
  */
1536
1590
  declare function useGpGrid<TData extends Row = Row>(options: UseGpGridOptions<TData>): UseGpGridResult<TData>;
1537
1591
  //#endregion
1592
+ //#region src/composables/useGridData.d.ts
1593
+ interface UseGridDataOptions<TData> {
1594
+ /** Function to extract a unique ID from each row. Required. */
1595
+ getRowId: (row: TData) => RowId;
1596
+ /** Debounce time for batching transactions in ms. Default 50. */
1597
+ debounceMs?: number;
1598
+ /** Use Web Worker for sorting large datasets (default: true) */
1599
+ useWorker?: boolean;
1600
+ /** Options for parallel sorting (only used when useWorker is true) */
1601
+ parallelSort?: ParallelSortOptions | false;
1602
+ }
1603
+ interface UseGridDataResult<TData> {
1604
+ /** The data source to pass to <GpGrid :data-source="dataSource" />. */
1605
+ dataSource: MutableDataSource<TData>;
1606
+ /** Update a single row by ID with partial data. */
1607
+ updateRow: (id: RowId, data: Partial<TData>) => void;
1608
+ /** Add rows to the data source. */
1609
+ addRows: (rows: TData[]) => void;
1610
+ /** Remove rows by ID. */
1611
+ removeRows: (ids: RowId[]) => void;
1612
+ /** Update a single cell value. */
1613
+ updateCell: (id: RowId, field: string, value: CellValue) => void;
1614
+ /** Clear all data from the data source. */
1615
+ clear: () => void;
1616
+ /** Get a row by its ID. */
1617
+ getRowById: (id: RowId) => TData | undefined;
1618
+ /** Get the current total row count. */
1619
+ getTotalRowCount: () => number;
1620
+ /** Force immediate processing of queued transactions. */
1621
+ flushTransactions: () => Promise<void>;
1622
+ }
1623
+ /**
1624
+ * Vue composable for efficient grid data mutations.
1625
+ *
1626
+ * Wraps `createMutableClientDataSource` to provide a simple API for
1627
+ * updating grid data without triggering full pipeline rebuilds.
1628
+ *
1629
+ * @example
1630
+ * ```vue
1631
+ * <script setup>
1632
+ * const { dataSource, updateRow, addRows } = useGridData(initialData, {
1633
+ * getRowId: (row) => row.id,
1634
+ * });
1635
+ * </script>
1636
+ *
1637
+ * <template>
1638
+ * <GpGrid :data-source="dataSource" :columns="columns" :row-height="36" />
1639
+ * </template>
1640
+ * ```
1641
+ */
1642
+ declare const useGridData: <TData extends Row = Row>(initialData: TData[], options: UseGridDataOptions<TData>) => UseGridDataResult<TData>;
1643
+ //#endregion
1538
1644
  //#region src/composables/useInputHandler.d.ts
1539
1645
  interface VisibleColumnInfo$1 {
1540
1646
  column: ColumnDefinition;
@@ -1817,4 +1923,4 @@ interface RenderHeaderOptions {
1817
1923
  */
1818
1924
  declare function renderHeader(options: RenderHeaderOptions): VNode;
1819
1925
  //#endregion
1820
- export { type CellDataType, type CellPosition, type CellRange, type CellRendererParams, type CellValue, type ColumnDefinition, type ColumnFilterModel, type ContainerBounds, type DataSource, type DataSourceRequest, type DataSourceResponse, type DateFilterCondition, type DragState, type EditRendererParams, type FilterCondition, type FilterModel, type FilterPopupState, _default as GpGrid, _default as default, type GpGridProps, GridCore, type GridInstruction, type GridState, type HeaderData, type HeaderRendererParams, type KeyEventData, type LocalFilterCondition, type MutableDataSource, type NumberFilterCondition, type PointerEventData, type Row, type RowId, type SelectionState, type SlotData, type SortDirection, type SortModel, type TextFilterCondition, type UseFillHandleOptions, type UseFillHandleResult, type UseFilterConditionsResult, type UseFilterPopupOptions, type UseGpGridOptions, type UseGpGridResult, type UseInputHandlerOptions, type UseInputHandlerResult, type VueCellRenderer, type VueEditRenderer, type VueHeaderRenderer, 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 };
1926
+ export { type CellDataType, type CellPosition, type CellRange, type CellRendererParams, type CellValue, type CellValueChangedEvent, type ColumnDefinition, type ColumnFilterModel, type ContainerBounds, type DataSource, type DataSourceRequest, type DataSourceResponse, type DateFilterCondition, type DragState, type EditRendererParams, type FilterCondition, type FilterModel, type FilterPopupState, _default as GpGrid, _default as default, type GpGridProps, GridCore, type GridInstruction, type GridState, type HeaderData, type HeaderRendererParams, type KeyEventData, type LocalFilterCondition, type MutableDataSource, type NumberFilterCondition, type PointerEventData, type Row, type RowId, type SelectionState, type SlotData, type SortDirection, type SortModel, type TextFilterCondition, type UseFillHandleOptions, type UseFillHandleResult, type UseFilterConditionsResult, type UseFilterPopupOptions, type UseGpGridOptions, type UseGpGridResult, type UseGridDataOptions, type UseGridDataResult, type UseInputHandlerOptions, type UseInputHandlerResult, type VueCellRenderer, type VueEditRenderer, type VueHeaderRenderer, 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, useGridData, useGridState, useInputHandler };
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,normalizeClass as u,normalizeStyle as d,onMounted as f,onUnmounted as p,openBlock as m,reactive as h,ref as g,renderList as _,resolveDynamicComponent as v,shallowRef as y,toDisplayString as b,unref as x,vModelText as S,watch as C,withDirectives as w}from"vue";import{GridCore as T,GridCore as E,buildCellClasses as D,buildCellClasses as ee,calculateColumnPositions as O,calculateScaledColumnPositions as k,createClientDataSource as A,createClientDataSource as j,createDataSourceFromArray as M,createDataSourceFromArray as N,createMutableClientDataSource as P,createServerDataSource as F,findColumnAtX as I,getTotalWidth as L,getTotalWidth as R,gridStyles as z,injectStyles as te,injectStyles as ne,isCellActive as re,isCellActive as B,isCellEditing as ie,isCellEditing as V,isCellInFillPreview as H,isCellInFillPreview as ae,isCellSelected as oe,isCellSelected as U,isRowVisible as W}from"@gp-grid/core";function G(e){return{slots:new Map,activeCell:null,selectionRange:null,editingCell:null,contentWidth:0,contentHeight:e?.initialHeight??0,viewportWidth:e?.initialWidth??0,headers:new Map,filterPopup:null,isLoading:!1,error:null,totalRows:0,visibleRowRange:null,hoverPosition:null}}function K(e,t){switch(e.type){case`CREATE_SLOT`:t.slots.set(e.slotId,{slotId:e.slotId,rowIndex:-1,rowData:{},translateY:0});break;case`DESTROY_SLOT`:t.slots.delete(e.slotId);break;case`ASSIGN_SLOT`:{let n=t.slots.get(e.slotId);n&&t.slots.set(e.slotId,{...n,rowIndex:e.rowIndex,rowData:e.rowData});break}case`MOVE_SLOT`:{let n=t.slots.get(e.slotId);n&&t.slots.set(e.slotId,{...n,translateY:e.translateY});break}case`SET_ACTIVE_CELL`:t.activeCell=e.position;break;case`SET_SELECTION_RANGE`:t.selectionRange=e.range;break;case`UPDATE_VISIBLE_RANGE`:t.visibleRowRange={start:e.start,end:e.end};break;case`SET_HOVER_POSITION`:t.hoverPosition=e.position;break;case`START_EDIT`:t.editingCell={row:e.row,col:e.col,initialValue:e.initialValue};break;case`STOP_EDIT`:t.editingCell=null;break;case`SET_CONTENT_SIZE`:t.contentWidth=e.width,t.contentHeight=e.height,t.viewportWidth=e.viewportWidth;break;case`UPDATE_HEADER`:t.headers.set(e.colIndex,{column:e.column,sortDirection:e.sortDirection,sortIndex:e.sortIndex,sortable:e.sortable,filterable:e.filterable,hasFilter:e.hasFilter});break;case`OPEN_FILTER_POPUP`:t.filterPopup={isOpen:!0,colIndex:e.colIndex,column:e.column,anchorRect:e.anchorRect,distinctValues:e.distinctValues,currentFilter:e.currentFilter};break;case`CLOSE_FILTER_POPUP`:t.filterPopup=null;break;case`DATA_LOADING`:t.isLoading=!0,t.error=null;break;case`DATA_LOADED`:t.isLoading=!1,t.totalRows=e.totalRows;break;case`DATA_ERROR`:t.isLoading=!1,t.error=e.error;break;case`ROWS_ADDED`:case`ROWS_REMOVED`:t.totalRows=e.totalRows;break;case`ROWS_UPDATED`:case`TRANSACTION_PROCESSED`:break}}function q(e){let t=h(G(e));function n(e){for(let n of e)K(n,t)}function r(){let e=G();t.slots=e.slots,t.activeCell=e.activeCell,t.selectionRange=e.selectionRange,t.editingCell=e.editingCell,t.contentWidth=e.contentWidth,t.contentHeight=e.contentHeight,t.viewportWidth=e.viewportWidth,t.headers=e.headers,t.filterPopup=e.filterPopup,t.isLoading=e.isLoading,t.error=e.error,t.totalRows=e.totalRows,t.visibleRowRange=e.visibleRowRange,t.hoverPosition=e.hoverPosition}return{state:t,applyInstructions:n,reset:r}}function J(e){let t=g(null);function n(n,r){t.value&&clearInterval(t.value),t.value=setInterval(()=>{let t=e.value;t&&(t.scrollTop+=r,t.scrollLeft+=n)},16)}function r(){t.value&&=(clearInterval(t.value),null)}return p(()=>{r()}),{startAutoScroll:n,stopAutoScroll:r}}function se(e,t){for(let n of e.values())if(n.rowIndex===t)return n;return null}function ce(e,t,n,r,i,a){let o=se(a,n),s=(o?o.translateY:i+n*r)-t.scrollTop,c=s+r,l=i,u=t.clientHeight;if(s<l)t.scrollTop=e.getScrollTopForRow(n);else if(c>u){let a=t.clientHeight-i,o=Math.floor(a/r),s=Math.max(0,n-o+1);t.scrollTop=e.getScrollTopForRow(s)}}function Y(e,t,n,r){let{activeCell:i,selectionRange:a,editingCell:o,filterPopupOpen:s,rowHeight:c,headerHeight:l,columnPositions:u,visibleColumnsWithIndices:d,slots:f}=r,{startAutoScroll:m,stopAutoScroll:h}=J(t),_=g({isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null});C([()=>l,()=>c,u,d],()=>{let t=e.value;if(t?.input){let e=d.value;t.input.updateDeps({getHeaderHeight:()=>l,getRowHeight:()=>c,getColumnPositions:()=>u.value,getColumnCount:()=>e.length,getOriginalColumnIndex:t=>{let n=e[t];return n?n.originalIndex:t}})}},{immediate:!0});function v(){let e=t.value;if(!e)return null;let n=e.getBoundingClientRect();return{top:n.top,left:n.left,width:n.width,height:n.height,scrollTop:e.scrollTop,scrollLeft:e.scrollLeft}}function y(e){return{clientX:e.clientX,clientY:e.clientY,button:e.button,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey}}function b(){let t=t=>{let n=e.value,r=v();if(!n?.input||!r)return;let i=n.input.handleDragMove(y(t),r);i&&(i.autoScroll?m(i.autoScroll.dx,i.autoScroll.dy):h(),_.value=n.input.getDragState())},n=()=>{let r=e.value;r?.input&&(r.input.handleDragEnd(),_.value=r.input.getDragState()),h(),document.removeEventListener(`mousemove`,t),document.removeEventListener(`mouseup`,n)};document.addEventListener(`mousemove`,t),document.addEventListener(`mouseup`,n)}function x(n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleCellMouseDown(n,r,y(i));o.focusContainer&&t.value?.focus(),o.startDrag===`selection`&&(a.input.startSelectionDrag(),_.value=a.input.getDragState(),b())}function S(t,n){let r=e.value;r?.input&&r.input.handleCellDoubleClick(t,n)}function w(t){let n=e.value;if(!n?.input)return;let r=n.input.handleFillHandleMouseDown(i.value,a.value,y(t));r.preventDefault&&t.preventDefault(),r.stopPropagation&&t.stopPropagation(),r.startDrag===`fill`&&(_.value=n.input.getDragState(),b())}function T(t,r){let i=e.value;if(!i?.input)return;let a=n.value[t];if(!a)return;let o=a.colId??a.field;i.input.handleHeaderClick(o,r.shiftKey)}function E(n){let r=e.value,a=t.value;if(!r?.input)return;let u=r.input.handleKeyDown({key:n.key,shiftKey:n.shiftKey,ctrlKey:n.ctrlKey,metaKey:n.metaKey},i.value,o.value,s.value);u.preventDefault&&n.preventDefault(),u.scrollToCell&&a&&ce(r,a,u.scrollToCell.row,c,l,f.value)}function D(n,r){let i=e.value,a=t.value;if(!i?.input||!a)return;let o=i.input.handleWheel(n.deltaY,n.deltaX,r);o&&(n.preventDefault(),a.scrollTop+=o.dy,a.scrollLeft+=o.dx)}return p(()=>{h()}),{handleCellMouseDown:x,handleCellDoubleClick:S,handleFillHandleMouseDown:w,handleHeaderClick:T,handleKeyDown:E,handleWheel:D,dragState:_}}function X(e){let{activeCell:n,selectionRange:r,slots:i,columns:a,visibleColumnsWithIndices:o,columnPositions:s,columnWidths:c,rowHeight:l}=e;return{fillHandlePosition:t(()=>{let e=n.value,t=r.value,u=i.value;if(!e&&!t)return null;let d,f,p,m;if(t)d=Math.max(t.startRow,t.endRow),f=Math.max(t.startCol,t.endCol),p=Math.min(t.startCol,t.endCol),m=Math.max(t.startCol,t.endCol);else if(e)d=e.row,f=e.col,p=f,m=f;else return null;let h=a.value;for(let e=p;e<=m;e++){let t=h[e];if(!(!t||t.hidden)&&t.editable!==!0)return null}let g=o.value.findIndex(e=>e.originalIndex===f);if(g===-1)return null;let _=null;for(let e of u.values())if(e.rowIndex===d){_=e.translateY;break}if(_===null)return null;let v=s.value[g]??0,y=c.value[g]??0;return{top:_+l-5,left:v+y-20}})}}function Z(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function Q(e,t){let n=t.split(`.`),r=e;for(let e of n){if(typeof r!=`object`||!r)return null;r=r[e]}return r??null}function le(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c,cellRenderers:l,globalCellRenderer:u}=e,d=Q(n,t.field),f={value:d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer&&typeof t.cellRenderer==`string`){let e=l[t.cellRenderer];if(e)return Z(e(f))}return u?Z(u(f)):o(d==null?``:String(d))}function ue(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function de(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,initialValue:a,core:s,editRenderers:c,globalEditRenderer:u}=e;if(!s)return o(``);let d={value:Q(n,t.field),rowData:n,column:t,rowIndex:r,colIndex:i,isActive:!0,isSelected:!0,isEditing:!0,initialValue:a,onValueChange:e=>s.updateEditValue(e),onCommit:()=>s.commitEdit(),onCancel:()=>s.cancelEdit()};if(t.editRenderer&&typeof t.editRenderer==`string`){let e=c[t.editRenderer];if(e)return ue(e(d))}return u?ue(u(d)):l(`input`,{class:`gp-grid-edit-input`,type:`text`,value:a==null?``:String(a),autofocus:!0,onFocus:e=>e.target.select(),onInput:e=>s.updateEditValue(e.target.value),onKeydown:e=>{e.stopPropagation(),e.key===`Enter`?s.commitEdit():e.key===`Escape`?s.cancelEdit():e.key===`Tab`&&(e.preventDefault(),s.commitEdit(),s.selection.moveFocus(e.shiftKey?`left`:`right`,!1))},onBlur:()=>s.commitEdit()})}function fe(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function pe(t){let{column:n,colIndex:r,sortDirection:i,sortIndex:a,sortable:o,filterable:s,hasFilter:c,core:u,container:d,headerRenderers:f,globalHeaderRenderer:p}=t,m={column:n,colIndex:r,sortDirection:i,sortIndex:a,sortable:o,filterable:s,hasFilter:c,onSort:(e,t)=>{u&&o&&u.setSort(n.colId??n.field,e,t)},onFilterClick:()=>{if(u&&s){let e=d?.querySelector(`[data-col-index="${r}"]`);if(e){let t=e.getBoundingClientRect();u.openFilterPopup(r,{top:t.top,left:t.left,width:t.width,height:t.height})}}}};if(n.headerRenderer&&typeof n.headerRenderer==`string`){let e=f[n.headerRenderer];if(e)return fe(e(m))}if(p)return fe(p(m));let h=[l(`span`,{class:`gp-grid-header-text`},n.headerName??n.field)],g=[];if(o){let e=[l(`span`,{class:`gp-grid-sort-arrows-stack`},[l(`svg`,{class:`gp-grid-sort-arrow-up${i===`asc`?` active`:``}`,width:`8`,height:`6`,viewBox:`0 0 8 6`},[l(`path`,{d:`M4 0L8 6H0L4 0Z`,fill:`currentColor`})]),l(`svg`,{class:`gp-grid-sort-arrow-down${i===`desc`?` active`:``}`,width:`8`,height:`6`,viewBox:`0 0 8 6`},[l(`path`,{d:`M4 6L0 0H8L4 6Z`,fill:`currentColor`})])])];a!==void 0&&a>0&&e.push(l(`span`,{class:`gp-grid-sort-index`},String(a))),g.push(l(`span`,{class:`gp-grid-sort-arrows`},e))}return s&&g.push(l(`span`,{class:`gp-grid-filter-icon${c?` active`:``}`,onMousedown:e=>{e.stopPropagation(),e.preventDefault(),m.onFilterClick()},onClick:e=>{e.stopPropagation()}},[l(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`currentColor`},[l(`path`,{d:`M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z`})])])),g.length>0&&h.push(l(`span`,{class:`gp-grid-header-icons`},g)),l(e,h)}function me(e,t){let{onClose:n,ignoreSelector:r=`.gp-grid-filter-icon`}=t,i=null,a=null;f(()=>{i=t=>{let i=t.target;r&&i.closest(r)||e.value&&!e.value.contains(i)&&n()},a=e=>{e.key===`Escape`&&n()},requestAnimationFrame(()=>{i&&document.addEventListener(`mousedown`,i),a&&document.addEventListener(`keydown`,a)})}),p(()=>{i&&document.removeEventListener(`mousedown`,i),a&&document.removeEventListener(`keydown`,a)})}function $(e,t=`and`){let n=g([...e]);return{conditions:n,combination:g(t),updateCondition:(e,t)=>{let r=[...n.value];r[e]={...r[e],...t},n.value=r},addCondition:e=>{n.value=[...n.value,{operator:e,value:``,valueTo:``,nextOperator:`and`}]},removeCondition:e=>{n.value=n.value.filter((t,n)=>n!==e)}}}const he={class:`gp-grid-filter-content gp-grid-filter-text`},ge={key:0,class:`gp-grid-filter-mode-toggle`},_e={key:1,class:`gp-grid-filter-info`},ve={class:`gp-grid-filter-actions`},ye=[`disabled`],be={class:`gp-grid-filter-list`},xe={key:0,class:`gp-grid-filter-option`},Se=[`checked`],Ce=[`checked`,`onChange`],we={key:0,class:`gp-grid-filter-combination`},Te=[`onClick`],Ee=[`onClick`],De={class:`gp-grid-filter-row`},Oe=[`value`,`autofocus`,`onChange`],ke=[`value`],Ae=[`value`,`onInput`],je=[`onClick`];var Me=c({__name:`TextFilterContent`,props:{distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{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`}],c=n,l=o;function d(e){return Array.isArray(e)?e.join(`, `):String(e??``)}let f=t(()=>{let e=c.distinctValues.filter(e=>e!=null&&e!==``&&!(Array.isArray(e)&&e.length===0)).map(e=>d(e));return Array.from(new Set(e)).sort((e,t)=>{let n=parseFloat(e),r=parseFloat(t);return!isNaN(n)&&!isNaN(r)?n-r:e.localeCompare(t,void 0,{numeric:!0,sensitivity:`base`})})}),p=t(()=>f.value.length>100),h=g(t(()=>{if(!c.currentFilter?.conditions[0])return p.value?`condition`:`values`;let e=c.currentFilter.conditions[0];return e.selectedValues&&e.selectedValues.size>0?`values`:`condition`}).value),v=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].selectedValues??new Set:new Set),y=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),C=g(``),T=g(new Set(v.value)),E=g(y.value),{conditions:D,combination:ee,updateCondition:O,addCondition:k,removeCondition:A}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`contains`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.conditions[0];if(e.selectedValues&&e.selectedValues.size>0)return[{operator:`contains`,value:``,valueTo:``,nextOperator:`and`}];let t=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(e=>{let n=e;return{operator:n.operator,value:n.value??``,valueTo:``,nextOperator:n.nextOperator??t}})}).value,c.currentFilter?.combination??`and`),j=t(()=>{if(!C.value)return f.value;let e=C.value.toLowerCase();return f.value.filter(t=>t.toLowerCase().includes(e))}),M=t(()=>c.distinctValues.some(e=>e==null||e===``)),N=t(()=>j.value.every(e=>T.value.has(e))&&(!M.value||E.value));function P(){T.value=new Set(j.value),M.value&&(E.value=!0)}function F(){T.value=new Set,E.value=!1}function I(e){let t=new Set(T.value);t.has(e)?t.delete(e):t.add(e),T.value=t}function L(){if(h.value===`values`){if(f.value.every(e=>T.value.has(e))&&(!M.value||E.value)){l(`apply`,null);return}l(`apply`,{conditions:[{type:`text`,operator:`equals`,selectedValues:T.value,includeBlank:E.value}],combination:`and`})}else{let e=D.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.value.trim()!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`text`,operator:e.operator,value:e.value,nextOperator:e.nextOperator})),combination:`and`})}}function R(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,he,[r(` Mode toggle - only show if not too many values `),p.value?r(`v-if`,!0):(m(),i(`div`,ge,[a(`button`,{type:`button`,class:u({active:h.value===`values`}),onClick:n[0]||=e=>h.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:h.value===`condition`}),onClick:n[1]||=e=>h.value=`condition`},` Condition `,2)])),r(` Too many values message `),p.value&&h.value===`condition`?(m(),i(`div`,_e,` Too many unique values (`+b(f.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),h.value===`values`?(m(),i(e,{key:2},[r(` Search input `),w(a(`input`,{"onUpdate:modelValue":n[2]||=e=>C.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[S,C.value]]),r(` Select all / Deselect all `),a(`div`,ve,[a(`button`,{type:`button`,disabled:N.value,onClick:P},` Select All `,8,ye),a(`button`,{type:`button`,onClick:F},` Deselect All `)]),r(` Checkbox list `),a(`div`,be,[r(` Blanks option `),M.value?(m(),i(`label`,xe,[a(`input`,{type:`checkbox`,checked:E.value,onChange:n[3]||=e=>E.value=!E.value},null,40,Se),n[5]||=a(`span`,{class:`gp-grid-filter-blank`},`(Blanks)`,-1)])):r(`v-if`,!0),r(` Values `),(m(!0),i(e,null,_(j.value,e=>(m(),i(`label`,{key:e,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:T.value.has(e),onChange:t=>I(e)},null,40,Ce),a(`span`,null,b(e),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),h.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,_(x(D),(t,n)=>(m(),i(`div`,{key:n,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),n>0?(m(),i(`div`,we,[a(`button`,{type:`button`,class:u({active:x(D)[n-1]?.nextOperator===`and`}),onClick:e=>x(O)(n-1,{nextOperator:`and`})},` AND `,10,Te),a(`button`,{type:`button`,class:u({active:x(D)[n-1]?.nextOperator===`or`}),onClick:e=>x(O)(n-1,{nextOperator:`or`})},` OR `,10,Ee)])):r(`v-if`,!0),a(`div`,De,[r(` Operator select `),a(`select`,{value:t.operator,autofocus:n===0,onChange:e=>x(O)(n,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,ke)),64))],40,Oe),r(` Text input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`text`,value:t.value,placeholder:`Value`,class:`gp-grid-filter-text-input`,onInput:e=>x(O)(n,{value:e.target.value})},null,40,Ae)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(D).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(A)(n)},` × `,8,je)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[4]||=e=>x(k)(`contains`)},` + Add condition `)],64)):r(`v-if`,!0),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:R},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:L},` Apply `)])]))}});const Ne={class:`gp-grid-filter-content gp-grid-filter-number`},Pe={key:0,class:`gp-grid-filter-combination`},Fe=[`onClick`],Ie=[`onClick`],Le={class:`gp-grid-filter-row`},Re=[`value`,`onChange`],ze=[`value`],Be=[`value`,`onInput`],Ve=[`value`,`onInput`],He=[`onClick`];var Ue=c({__name:`NumberFilterContent`,props:{currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{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`}],c=n,l=o,{conditions:d,combination:f,updateCondition:p,addCondition:h,removeCondition:g}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`=`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(t=>{let n=t;return{operator:n.operator,value:n.value==null?``:String(n.value),valueTo:n.valueTo==null?``:String(n.valueTo),nextOperator:n.nextOperator??e}})}).value,c.currentFilter?.combination??`and`);function v(){let e=d.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.operator===`between`?e.value!==``&&e.valueTo!==``:e.value!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`number`,operator:e.operator,value:e.value?parseFloat(e.value):void 0,valueTo:e.valueTo?parseFloat(e.valueTo):void 0,nextOperator:e.nextOperator})),combination:`and`})}function y(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,Ne,[(m(!0),i(e,null,_(x(d),(t,o)=>(m(),i(`div`,{key:o,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),o>0?(m(),i(`div`,Pe,[a(`button`,{type:`button`,class:u({active:x(d)[o-1]?.nextOperator===`and`}),onClick:e=>x(p)(o-1,{nextOperator:`and`})},` AND `,10,Fe),a(`button`,{type:`button`,class:u({active:x(d)[o-1]?.nextOperator===`or`}),onClick:e=>x(p)(o-1,{nextOperator:`or`})},` OR `,10,Ie)])):r(`v-if`,!0),a(`div`,Le,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>x(p)(o,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,ze)),64))],40,Re),r(` Number input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`number`,value:t.value,placeholder:`Value`,onInput:e=>x(p)(o,{value:e.target.value})},null,40,Be)):r(`v-if`,!0),r(` Second number input for "between" `),t.operator===`between`?(m(),i(e,{key:1},[n[1]||=a(`span`,{class:`gp-grid-filter-to`},`to`,-1),a(`input`,{type:`number`,value:t.valueTo,placeholder:`Value`,onInput:e=>x(p)(o,{valueTo:e.target.value})},null,40,Ve)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(d).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(g)(o)},` × `,8,He)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>x(h)(`=`)},` + Add condition `),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:y},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:v},` Apply `)])]))}});const We={class:`gp-grid-filter-content gp-grid-filter-date`},Ge={key:0,class:`gp-grid-filter-combination`},Ke=[`onClick`],qe=[`onClick`],Je={class:`gp-grid-filter-row`},Ye=[`value`,`onChange`],Xe=[`value`],Ze=[`value`,`onInput`],Qe=[`value`,`onInput`],$e=[`onClick`];var et=c({__name:`DateFilterContent`,props:{currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{value:`=`,label:`=`},{value:`!=`,label:`≠`},{value:`>`,label:`>`},{value:`<`,label:`<`},{value:`between`,label:`↔`},{value:`blank`,label:`Is blank`},{value:`notBlank`,label:`Not blank`}],c=n,l=o;function d(e){if(!e)return``;let t=typeof e==`string`?new Date(e):e;return isNaN(t.getTime())?``:t.toISOString().split(`T`)[0]}let{conditions:f,combination:p,updateCondition:h,addCondition:g,removeCondition:v}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`=`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(t=>{let n=t;return{operator:n.operator,value:d(n.value),valueTo:d(n.valueTo),nextOperator:n.nextOperator??e}})}).value,c.currentFilter?.combination??`and`);function y(){let e=f.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.operator===`between`?e.value!==``&&e.valueTo!==``:e.value!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`date`,operator:e.operator,value:e.value||void 0,valueTo:e.valueTo||void 0,nextOperator:e.nextOperator})),combination:`and`})}function S(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,We,[(m(!0),i(e,null,_(x(f),(t,o)=>(m(),i(`div`,{key:o,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),o>0?(m(),i(`div`,Ge,[a(`button`,{type:`button`,class:u({active:x(f)[o-1]?.nextOperator===`and`}),onClick:e=>x(h)(o-1,{nextOperator:`and`})},` AND `,10,Ke),a(`button`,{type:`button`,class:u({active:x(f)[o-1]?.nextOperator===`or`}),onClick:e=>x(h)(o-1,{nextOperator:`or`})},` OR `,10,qe)])):r(`v-if`,!0),a(`div`,Je,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>x(h)(o,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,Xe)),64))],40,Ye),r(` Date input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`date`,value:t.value,onInput:e=>x(h)(o,{value:e.target.value})},null,40,Ze)):r(`v-if`,!0),r(` Second date input for "between" `),t.operator===`between`?(m(),i(e,{key:1},[n[1]||=a(`span`,{class:`gp-grid-filter-to`},`to`,-1),a(`input`,{type:`date`,value:t.valueTo,onInput:e=>x(h)(o,{valueTo:e.target.value})},null,40,Qe)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(f).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(v)(o)},` × `,8,$e)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>x(g)(`=`)},` + Add condition `),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:S},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:y},` Apply `)])]))}});const tt={class:`gp-grid-filter-header`};var nt=c({__name:`FilterPopup`,props:{column:{},colIndex:{},anchorRect:{},distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(o,{emit:c}){let l=o,u=c,f=g(null);me(f,{onClose:()=>u(`close`),ignoreSelector:`.gp-grid-filter-icon`});let p=t(()=>l.column.colId??l.column.field);function h(e){u(`apply`,p.value,e),u(`close`)}function _(){u(`close`)}let v=t(()=>l.column.cellDataType);t(()=>v.value===`text`||v.value===`object`);let y=t(()=>v.value===`number`),x=t(()=>v.value===`date`||v.value===`dateString`||v.value===`dateTime`||v.value===`dateTimeString`),S=t(()=>({position:`fixed`,top:`${l.anchorRect.top+l.anchorRect.height+4}px`,left:`${l.anchorRect.left}px`,minWidth:`${Math.max(200,l.anchorRect.width)}px`,zIndex:1e4}));return(t,c)=>(m(),i(`div`,{ref_key:`popupRef`,ref:f,class:`gp-grid-filter-popup`,style:d(S.value)},[a(`div`,tt,` Filter: `+b(o.column.headerName??o.column.field),1),r(` Number filter `),y.value?(m(),n(Ue,{key:0,"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`current-filter`])):x.value?(m(),i(e,{key:1},[r(` Date filter `),s(et,{"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`current-filter`])],2112)):(m(),i(e,{key:2},[r(` Text filter (default) `),s(Me,{"distinct-values":o.distinctValues,"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`distinct-values`,`current-filter`])],2112))],4))}});const rt=[`data-col-index`,`onClick`],it=[`onMousedown`,`onDblclick`,`onMouseenter`],at={key:1,class:`gp-grid-loading`},ot={key:2,class:`gp-grid-error`},st={key:3,class:`gp-grid-empty`};var ct=c({__name:`GpGrid`,props:{columns:{},dataSource:{},rowData:{},rowHeight:{},headerHeight:{},overscan:{default:3},sortingEnabled:{type:Boolean,default:!0},darkMode:{type:Boolean,default:!1},wheelDampening:{default:.1},cellRenderers:{default:()=>({})},editRenderers:{default:()=>({})},headerRenderers:{default:()=>({})},cellRenderer:{},editRenderer:{},headerRenderer:{},initialWidth:{},initialHeight:{},highlighting:{}},setup(s,{expose:c}){ne();let l=s,h=g(null),S=y(null),w=y(null),T=y(null),{state:D,applyInstructions:O,reset:A}=q({initialWidth:l.initialWidth,initialHeight:l.initialHeight}),M=t(()=>l.headerHeight??l.rowHeight),P=t(()=>l.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),F=t(()=>k(P.value.map(e=>e.column),D.viewportWidth)),I=t(()=>F.value.positions),L=t(()=>F.value.widths),z=t(()=>R(I.value)),te=t(()=>Array.from(D.slots.values())),{handleCellMouseDown:re,handleCellDoubleClick:ie,handleFillHandleMouseDown:H,handleHeaderClick:oe,handleKeyDown:W,handleWheel:G,dragState:K}=Y(S,h,t(()=>l.columns),{activeCell:t(()=>D.activeCell),selectionRange:t(()=>D.selectionRange),editingCell:t(()=>D.editingCell),filterPopupOpen:t(()=>D.filterPopup?.isOpen??!1),rowHeight:l.rowHeight,headerHeight:M.value,columnPositions:I,visibleColumnsWithIndices:P,slots:t(()=>D.slots)}),{fillHandlePosition:J}=X({activeCell:t(()=>D.activeCell),selectionRange:t(()=>D.selectionRange),slots:t(()=>D.slots),columns:t(()=>l.columns),visibleColumnsWithIndices:P,columnPositions:I,columnWidths:L,rowHeight:l.rowHeight});function se(){let e=h.value,t=S.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function ce(e,t){let n=S.value;n&&n.setFilter(e,t)}function Z(){let e=S.value;e&&e.closeFilterPopup()}function Q(e,t){S.value?.input.handleCellMouseEnter(e,t)}function ue(){S.value?.input.handleCellMouseLeave()}function fe(e){return[`gp-grid-row`,...S.value?.highlight?.computeRowClasses(e.rowIndex,e.rowData)??[]].filter(Boolean).join(` `)}function me(e,t,n,r,i){let a=V(e,t,D.editingCell);return[ee(B(e,t,D.activeCell),U(e,t,D.selectionRange),a,ae(e,t,K.value.dragType===`fill`,K.value.fillSourceRange,K.value.fillTarget)),...S.value?.highlight?.computeCombinedCellClasses(e,t,n,r)??[]].filter(Boolean).join(` `)}function $(){return l.dataSource??(l.rowData?N(l.rowData):j([]))}function he(e){T.value&&=(T.value(),null),S.value&&S.value.destroy();let t=new E({columns:l.columns,dataSource:e,rowHeight:l.rowHeight,headerHeight:M.value,overscan:l.overscan,sortingEnabled:l.sortingEnabled,highlighting:l.highlighting});S.value=t,T.value=t.onBatchInstruction(e=>{O(e)}),t.initialize();let n=h.value;n&&t.setViewport(n.scrollTop,n.scrollLeft,n.clientWidth,n.clientHeight)}return f(()=>{let e=$();w.value=e,he(e);let t=h.value;if(t&&typeof ResizeObserver<`u`){let e=new ResizeObserver(()=>{S.value?.setViewport(t.scrollTop,t.scrollLeft,t.clientWidth,t.clientHeight)});e.observe(t),p(()=>{e.disconnect()})}p(()=>{T.value&&=(T.value(),null),S.value&&=(S.value.destroy(),null),w.value&&=(w.value.destroy?.(),null)})}),C([()=>l.dataSource,()=>l.rowData],()=>{let e=$(),t=w.value;t&&t!==e?(t.destroy?.(),A(),w.value=e,he(e)):t||(w.value=e)}),C(()=>l.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{S.value?.refresh()});p(()=>e())}}},{immediate:!0}),C(()=>l.highlighting,e=>{S.value?.highlight&&e&&S.value.highlight.updateOptions(e)}),c({core:S}),(t,c)=>(m(),i(`div`,{ref_key:`containerRef`,ref:h,class:u([`gp-grid-container`,{"gp-grid-container--dark":s.darkMode}]),style:{width:`100%`,height:`100%`,overflow:`auto`,position:`relative`},tabindex:`0`,onScroll:se,onWheel:c[1]||=e=>x(G)(e,s.wheelDampening),onKeydown:c[2]||=(...e)=>x(W)&&x(W)(...e)},[r(` Content sizer `),a(`div`,{style:d({width:`${Math.max(x(D).contentWidth,z.value)}px`,height:`${Math.max(x(D).contentHeight,M.value)}px`,position:`relative`,minWidth:`100%`})},[r(` Headers `),a(`div`,{class:`gp-grid-header`,style:d({position:`sticky`,top:0,left:0,height:`${M.value}px`,width:`${Math.max(x(D).contentWidth,z.value)}px`,minWidth:`100%`})},[(m(!0),i(e,null,_(P.value,({column:e,originalIndex:t},r)=>(m(),i(`div`,{key:e.colId??e.field,class:`gp-grid-header-cell`,"data-col-index":t,style:d({position:`absolute`,left:`${I.value[r]}px`,top:0,width:`${L.value[r]}px`,height:`${M.value}px`,background:`transparent`}),onClick:e=>x(oe)(t,e)},[(m(),n(v(x(pe)({column:e,colIndex:t,sortDirection:x(D).headers.get(t)?.sortDirection,sortIndex:x(D).headers.get(t)?.sortIndex,sortable:x(D).headers.get(t)?.sortable??!0,filterable:x(D).headers.get(t)?.filterable??!0,hasFilter:x(D).headers.get(t)?.hasFilter??!1,core:S.value,container:h.value,headerRenderers:s.headerRenderers??{},globalHeaderRenderer:s.headerRenderer}))))],12,rt))),128))],4),r(` Row slots `),(m(!0),i(e,null,_(te.value.filter(e=>e.rowIndex>=0),t=>(m(),i(`div`,{key:t.slotId,class:u(fe(t)),style:d({position:`absolute`,top:0,left:0,transform:`translateY(${t.translateY}px)`,width:`${Math.max(x(D).contentWidth,z.value)}px`,height:`${s.rowHeight}px`})},[(m(!0),i(e,null,_(P.value,({column:a,originalIndex:o},c)=>(m(),i(`div`,{key:`${t.slotId}-${o}`,class:u(me(t.rowIndex,o,a,t.rowData,x(D).hoverPosition)),style:d({position:`absolute`,left:`${I.value[c]}px`,top:0,width:`${L.value[c]}px`,height:`${s.rowHeight}px`}),onMousedown:e=>x(re)(t.rowIndex,o,e),onDblclick:()=>x(ie)(t.rowIndex,o),onMouseenter:()=>Q(t.rowIndex,o),onMouseleave:ue},[r(` Edit mode `),x(V)(t.rowIndex,o,x(D).editingCell)&&x(D).editingCell?(m(),n(v(x(de)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:o,initialValue:x(D).editingCell.initialValue,core:S.value,editRenderers:s.editRenderers??{},globalEditRenderer:s.editRenderer})),{key:0})):(m(),i(e,{key:1},[r(` View mode `),(m(),n(v(x(le)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:o,isActive:x(B)(t.rowIndex,o,x(D).activeCell),isSelected:x(U)(t.rowIndex,o,x(D).selectionRange),isEditing:!1,cellRenderers:s.cellRenderers??{},globalCellRenderer:s.cellRenderer}))))],64))],46,it))),128))],6))),128)),r(` Fill handle `),x(J)&&!x(D).editingCell?(m(),i(`div`,{key:0,class:`gp-grid-fill-handle`,style:d({position:`absolute`,top:`${x(J).top}px`,left:`${x(J).left}px`,zIndex:200}),onMousedown:c[0]||=(...e)=>x(H)&&x(H)(...e)},null,36)):r(`v-if`,!0),r(` Loading indicator `),x(D).isLoading?(m(),i(`div`,at,[...c[3]||=[a(`div`,{class:`gp-grid-loading-spinner`},null,-1),o(` Loading... `,-1)]])):r(`v-if`,!0),r(` Error message `),x(D).error?(m(),i(`div`,ot,` Error: `+b(x(D).error),1)):r(`v-if`,!0),r(` Empty state `),!x(D).isLoading&&!x(D).error&&x(D).totalRows===0?(m(),i(`div`,st,` No data to display `)):r(`v-if`,!0)],4),r(` Filter Popup `),x(D).filterPopup?.isOpen&&x(D).filterPopup.column&&x(D).filterPopup.anchorRect?(m(),n(nt,{key:0,column:x(D).filterPopup.column,"col-index":x(D).filterPopup.colIndex,"anchor-rect":x(D).filterPopup.anchorRect,"distinct-values":x(D).filterPopup.distinctValues,"current-filter":x(D).filterPopup.currentFilter,onApply:ce,onClose:Z},null,8,[`column`,`col-index`,`anchor-rect`,`distinct-values`,`current-filter`])):r(`v-if`,!0)],34))}});function lt(e){ne();let n=g(null),r=g(null),{state:i,applyInstructions:a}=q(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>k(s.value.map(e=>e.column),i.viewportWidth)),l=t(()=>c.value.positions),u=t(()=>c.value.widths),d=t(()=>R(l.value)),m=t(()=>Array.from(i.slots.values())),{handleCellMouseDown:h,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,dragState:S}=Y(r,n,t(()=>e.columns),{activeCell:t(()=>i.activeCell),selectionRange:t(()=>i.selectionRange),editingCell:t(()=>i.editingCell),filterPopupOpen:t(()=>i.filterPopup?.isOpen??!1),rowHeight:e.rowHeight,headerHeight:o.value,columnPositions:l,visibleColumnsWithIndices:s,slots:t(()=>i.slots)}),w=()=>{let e=n.value,t=r.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)},T=(e,t)=>{let n=r.value;n&&n.setFilter(e,t)},D=()=>{let e=r.value;e&&e.closeFilterPopup()},O=(e,t)=>{r.value?.input.handleCellMouseEnter(e,t)},A=()=>{r.value?.input.handleCellMouseLeave()};f(()=>{let t=e.dataSource??(e.rowData?N(e.rowData):j([])),i=new E({columns:e.columns,dataSource:t,rowHeight:e.rowHeight,headerHeight:o.value,overscan:e.overscan??3,sortingEnabled:e.sortingEnabled??!0,highlighting:e.highlighting});r.value=i;let s=i.onBatchInstruction(e=>{a(e)});i.initialize();let c=n.value;if(c){i.setViewport(c.scrollTop,c.scrollLeft,c.clientWidth,c.clientHeight);let e=new ResizeObserver(()=>{i.setViewport(c.scrollTop,c.scrollLeft,c.clientWidth,c.clientHeight)});e.observe(c),p(()=>{e.disconnect(),s(),r.value=null})}}),C(()=>e.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{r.value?.refresh()});p(()=>e())}}},{immediate:!0}),C(()=>e.highlighting,e=>{r.value?.highlight&&e&&r.value.highlight.updateOptions(e)});let{fillHandlePosition:M}=X({activeCell:t(()=>i.activeCell),selectionRange:t(()=>i.selectionRange),slots:t(()=>i.slots),columns:t(()=>e.columns),visibleColumnsWithIndices:s,columnPositions:l,columnWidths:u,rowHeight:e.rowHeight});return{containerRef:n,coreRef:r,state:i,slotsArray:m,totalHeaderHeight:o,columnPositions:l,columnWidths:u,totalWidth:d,fillHandlePosition:M,handleScroll:w,handleCellMouseDown:h,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,handleFilterApply:T,handleFilterPopupClose:D,handleCellMouseEnter:O,handleCellMouseLeave:A,dragState:S,isCellSelected:U,isCellActive:B,isCellEditing:V,isCellInFillPreview:ae,buildCellClasses:ee}}export{ct as GpGrid,ct as default,T as GridCore,D as buildCellClasses,O as calculateColumnPositions,A as createClientDataSource,M as createDataSourceFromArray,G as createInitialState,P as createMutableClientDataSource,F as createServerDataSource,I as findColumnAtX,Q as getCellValue,L as getTotalWidth,z as gridStyles,te as injectStyles,re as isCellActive,ie as isCellEditing,H as isCellInFillPreview,oe as isCellSelected,W as isRowVisible,le as renderCell,de as renderEditCell,pe as renderHeader,J as useAutoScroll,X as useFillHandle,$ as useFilterConditions,me as useFilterPopup,lt as useGpGrid,q as useGridState,Y as useInputHandler};
1
+ import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,normalizeClass as u,normalizeStyle as d,onMounted as f,onUnmounted as p,openBlock as m,reactive as h,ref as g,renderList as _,resolveDynamicComponent as v,shallowRef as y,toDisplayString as b,unref as x,vModelText as S,watch as C,withDirectives as w}from"vue";import{GridCore as T,GridCore as E,buildCellClasses as D,buildCellClasses as ee,calculateColumnPositions as O,calculateScaledColumnPositions as k,createClientDataSource as A,createClientDataSource as j,createDataSourceFromArray as M,createDataSourceFromArray as N,createMutableClientDataSource as P,createMutableClientDataSource as F,createServerDataSource as I,findColumnAtX as L,getTotalWidth as R,getTotalWidth as te,gridStyles as ne,injectStyles as re,injectStyles as ie,isCellActive as z,isCellActive as B,isCellEditing as ae,isCellEditing as V,isCellInFillPreview as H,isCellInFillPreview as oe,isCellSelected as se,isCellSelected as U,isRowVisible as W}from"@gp-grid/core";function G(e){return{slots:new Map,activeCell:null,selectionRange:null,editingCell:null,contentWidth:0,contentHeight:e?.initialHeight??0,viewportWidth:e?.initialWidth??0,headers:new Map,filterPopup:null,isLoading:!1,error:null,totalRows:0,visibleRowRange:null,hoverPosition:null}}function ce(e,t){switch(e.type){case`CREATE_SLOT`:t.slots.set(e.slotId,{slotId:e.slotId,rowIndex:-1,rowData:{},translateY:0});break;case`DESTROY_SLOT`:t.slots.delete(e.slotId);break;case`ASSIGN_SLOT`:{let n=t.slots.get(e.slotId);n&&t.slots.set(e.slotId,{...n,rowIndex:e.rowIndex,rowData:e.rowData});break}case`MOVE_SLOT`:{let n=t.slots.get(e.slotId);n&&t.slots.set(e.slotId,{...n,translateY:e.translateY});break}case`SET_ACTIVE_CELL`:t.activeCell=e.position;break;case`SET_SELECTION_RANGE`:t.selectionRange=e.range;break;case`UPDATE_VISIBLE_RANGE`:t.visibleRowRange={start:e.start,end:e.end};break;case`SET_HOVER_POSITION`:t.hoverPosition=e.position;break;case`START_EDIT`:t.editingCell={row:e.row,col:e.col,initialValue:e.initialValue};break;case`STOP_EDIT`:t.editingCell=null;break;case`SET_CONTENT_SIZE`:t.contentWidth=e.width,t.contentHeight=e.height,t.viewportWidth=e.viewportWidth;break;case`UPDATE_HEADER`:t.headers.set(e.colIndex,{column:e.column,sortDirection:e.sortDirection,sortIndex:e.sortIndex,sortable:e.sortable,filterable:e.filterable,hasFilter:e.hasFilter});break;case`OPEN_FILTER_POPUP`:t.filterPopup={isOpen:!0,colIndex:e.colIndex,column:e.column,anchorRect:e.anchorRect,distinctValues:e.distinctValues,currentFilter:e.currentFilter};break;case`CLOSE_FILTER_POPUP`:t.filterPopup=null;break;case`DATA_LOADING`:t.isLoading=!0,t.error=null;break;case`DATA_LOADED`:t.isLoading=!1,t.totalRows=e.totalRows;break;case`DATA_ERROR`:t.isLoading=!1,t.error=e.error;break;case`ROWS_ADDED`:case`ROWS_REMOVED`:t.totalRows=e.totalRows;break;case`ROWS_UPDATED`:case`TRANSACTION_PROCESSED`:break}}function K(e){let t=h(G(e));function n(e){for(let n of e)ce(n,t)}function r(){let e=G();t.slots=e.slots,t.activeCell=e.activeCell,t.selectionRange=e.selectionRange,t.editingCell=e.editingCell,t.contentWidth=e.contentWidth,t.contentHeight=e.contentHeight,t.viewportWidth=e.viewportWidth,t.headers=e.headers,t.filterPopup=e.filterPopup,t.isLoading=e.isLoading,t.error=e.error,t.totalRows=e.totalRows,t.visibleRowRange=e.visibleRowRange,t.hoverPosition=e.hoverPosition}return{state:t,applyInstructions:n,reset:r}}function q(e){let t=g(null);function n(n,r){t.value&&clearInterval(t.value),t.value=setInterval(()=>{let t=e.value;t&&(t.scrollTop+=r,t.scrollLeft+=n)},16)}function r(){t.value&&=(clearInterval(t.value),null)}return p(()=>{r()}),{startAutoScroll:n,stopAutoScroll:r}}function le(e,t){for(let n of e.values())if(n.rowIndex===t)return n;return null}function ue(e,t,n,r,i,a){let o=le(a,n),s=(o?o.translateY:i+n*r)-t.scrollTop,c=s+r,l=i,u=t.clientHeight;if(s<l)t.scrollTop=e.getScrollTopForRow(n);else if(c>u){let a=t.clientHeight-i,o=Math.floor(a/r),s=Math.max(0,n-o+1);t.scrollTop=e.getScrollTopForRow(s)}}function J(e,t,n,r){let{activeCell:i,selectionRange:a,editingCell:o,filterPopupOpen:s,rowHeight:c,headerHeight:l,columnPositions:u,visibleColumnsWithIndices:d,slots:f}=r,{startAutoScroll:m,stopAutoScroll:h}=q(t),_=g({isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null});C([()=>l,()=>c,u,d],()=>{let t=e.value;if(t?.input){let e=d.value;t.input.updateDeps({getHeaderHeight:()=>l,getRowHeight:()=>c,getColumnPositions:()=>u.value,getColumnCount:()=>e.length,getOriginalColumnIndex:t=>{let n=e[t];return n?n.originalIndex:t}})}},{immediate:!0});function v(){let e=t.value;if(!e)return null;let n=e.getBoundingClientRect();return{top:n.top,left:n.left,width:n.width,height:n.height,scrollTop:e.scrollTop,scrollLeft:e.scrollLeft}}function y(e){return{clientX:e.clientX,clientY:e.clientY,button:e.button,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey}}function b(){let t=t=>{let n=e.value,r=v();if(!n?.input||!r)return;let i=n.input.handleDragMove(y(t),r);i&&(i.autoScroll?m(i.autoScroll.dx,i.autoScroll.dy):h(),_.value=n.input.getDragState())},n=()=>{let r=e.value;r?.input&&(r.input.handleDragEnd(),_.value=r.input.getDragState()),h(),document.removeEventListener(`mousemove`,t),document.removeEventListener(`mouseup`,n)};document.addEventListener(`mousemove`,t),document.addEventListener(`mouseup`,n)}function x(n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleCellMouseDown(n,r,y(i));o.focusContainer&&t.value?.focus(),o.startDrag===`selection`&&(a.input.startSelectionDrag(),_.value=a.input.getDragState(),b())}function S(t,n){let r=e.value;r?.input&&r.input.handleCellDoubleClick(t,n)}function w(t){let n=e.value;if(!n?.input)return;let r=n.input.handleFillHandleMouseDown(i.value,a.value,y(t));r.preventDefault&&t.preventDefault(),r.stopPropagation&&t.stopPropagation(),r.startDrag===`fill`&&(_.value=n.input.getDragState(),b())}function T(t,r){let i=e.value;if(!i?.input)return;let a=n.value[t];if(!a)return;let o=a.colId??a.field;i.input.handleHeaderClick(o,r.shiftKey)}function E(n){let r=e.value,a=t.value;if(!r?.input)return;let u=r.input.handleKeyDown({key:n.key,shiftKey:n.shiftKey,ctrlKey:n.ctrlKey,metaKey:n.metaKey},i.value,o.value,s.value);u.preventDefault&&n.preventDefault(),u.scrollToCell&&a&&ue(r,a,u.scrollToCell.row,c,l,f.value)}function D(n,r){let i=e.value,a=t.value;if(!i?.input||!a)return;let o=i.input.handleWheel(n.deltaY,n.deltaX,r);o&&(n.preventDefault(),a.scrollTop+=o.dy,a.scrollLeft+=o.dx)}return p(()=>{h()}),{handleCellMouseDown:x,handleCellDoubleClick:S,handleFillHandleMouseDown:w,handleHeaderClick:T,handleKeyDown:E,handleWheel:D,dragState:_}}function Y(e){let{activeCell:n,selectionRange:r,slots:i,columns:a,visibleColumnsWithIndices:o,columnPositions:s,columnWidths:c,rowHeight:l}=e;return{fillHandlePosition:t(()=>{let e=n.value,t=r.value,u=i.value;if(!e&&!t)return null;let d,f,p,m;if(t)d=Math.max(t.startRow,t.endRow),f=Math.max(t.startCol,t.endCol),p=Math.min(t.startCol,t.endCol),m=Math.max(t.startCol,t.endCol);else if(e)d=e.row,f=e.col,p=f,m=f;else return null;let h=a.value;for(let e=p;e<=m;e++){let t=h[e];if(!(!t||t.hidden)&&t.editable!==!0)return null}let g=o.value.findIndex(e=>e.originalIndex===f);if(g===-1)return null;let _=null;for(let e of u.values())if(e.rowIndex===d){_=e.translateY;break}if(_===null)return null;let v=s.value[g]??0,y=c.value[g]??0;return{top:_+l-5,left:v+y-20}})}}function X(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function Z(e,t){let n=t.split(`.`),r=e;for(let e of n){if(typeof r!=`object`||!r)return null;r=r[e]}return r??null}function de(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c,cellRenderers:l,globalCellRenderer:u}=e,d=Z(n,t.field),f={value:d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer&&typeof t.cellRenderer==`string`){let e=l[t.cellRenderer];if(e)return X(e(f))}return u?X(u(f)):o(d==null?``:String(d))}function fe(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function pe(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,initialValue:a,core:s,editRenderers:c,globalEditRenderer:u}=e;if(!s)return o(``);let d={value:Z(n,t.field),rowData:n,column:t,rowIndex:r,colIndex:i,isActive:!0,isSelected:!0,isEditing:!0,initialValue:a,onValueChange:e=>s.updateEditValue(e),onCommit:()=>s.commitEdit(),onCancel:()=>s.cancelEdit()};if(t.editRenderer&&typeof t.editRenderer==`string`){let e=c[t.editRenderer];if(e)return fe(e(d))}return u?fe(u(d)):l(`input`,{class:`gp-grid-edit-input`,type:`text`,value:a==null?``:String(a),autofocus:!0,onFocus:e=>e.target.select(),onInput:e=>s.updateEditValue(e.target.value),onKeydown:e=>{e.stopPropagation(),e.key===`Enter`?s.commitEdit():e.key===`Escape`?s.cancelEdit():e.key===`Tab`&&(e.preventDefault(),s.commitEdit(),s.selection.moveFocus(e.shiftKey?`left`:`right`,!1))},onBlur:()=>s.commitEdit()})}function Q(e){return e==null||e===``?o(``):typeof e==`string`?o(e):e}function me(t){let{column:n,colIndex:r,sortDirection:i,sortIndex:a,sortable:o,filterable:s,hasFilter:c,core:u,container:d,headerRenderers:f,globalHeaderRenderer:p}=t,m={column:n,colIndex:r,sortDirection:i,sortIndex:a,sortable:o,filterable:s,hasFilter:c,onSort:(e,t)=>{u&&o&&u.setSort(n.colId??n.field,e,t)},onFilterClick:()=>{if(u&&s){let e=d?.querySelector(`[data-col-index="${r}"]`);if(e){let t=e.getBoundingClientRect();u.openFilterPopup(r,{top:t.top,left:t.left,width:t.width,height:t.height})}}}};if(n.headerRenderer&&typeof n.headerRenderer==`string`){let e=f[n.headerRenderer];if(e)return Q(e(m))}if(p)return Q(p(m));let h=[l(`span`,{class:`gp-grid-header-text`},n.headerName??n.field)],g=[];if(o){let e=[l(`span`,{class:`gp-grid-sort-arrows-stack`},[l(`svg`,{class:`gp-grid-sort-arrow-up${i===`asc`?` active`:``}`,width:`8`,height:`6`,viewBox:`0 0 8 6`},[l(`path`,{d:`M4 0L8 6H0L4 0Z`,fill:`currentColor`})]),l(`svg`,{class:`gp-grid-sort-arrow-down${i===`desc`?` active`:``}`,width:`8`,height:`6`,viewBox:`0 0 8 6`},[l(`path`,{d:`M4 6L0 0H8L4 6Z`,fill:`currentColor`})])])];a!==void 0&&a>0&&e.push(l(`span`,{class:`gp-grid-sort-index`},String(a))),g.push(l(`span`,{class:`gp-grid-sort-arrows`},e))}return s&&g.push(l(`span`,{class:`gp-grid-filter-icon${c?` active`:``}`,onMousedown:e=>{e.stopPropagation(),e.preventDefault(),m.onFilterClick()},onClick:e=>{e.stopPropagation()}},[l(`svg`,{width:`16`,height:`16`,viewBox:`0 0 24 24`,fill:`currentColor`},[l(`path`,{d:`M4 4h16l-6 8v5l-4 2v-7L4 4z`})])])),g.length>0&&h.push(l(`span`,{class:`gp-grid-header-icons`},g)),l(e,h)}function he(e,t){let{onClose:n,ignoreSelector:r=`.gp-grid-filter-icon`}=t,i=null,a=null;f(()=>{i=t=>{let i=t.target;r&&i.closest(r)||e.value&&!e.value.contains(i)&&n()},a=e=>{e.key===`Escape`&&n()},requestAnimationFrame(()=>{i&&document.addEventListener(`mousedown`,i),a&&document.addEventListener(`keydown`,a)})}),p(()=>{i&&document.removeEventListener(`mousedown`,i),a&&document.removeEventListener(`keydown`,a)})}function $(e,t=`and`){let n=g([...e]);return{conditions:n,combination:g(t),updateCondition:(e,t)=>{let r=[...n.value];r[e]={...r[e],...t},n.value=r},addCondition:e=>{n.value=[...n.value,{operator:e,value:``,valueTo:``,nextOperator:`and`}]},removeCondition:e=>{n.value=n.value.filter((t,n)=>n!==e)}}}const ge={class:`gp-grid-filter-content gp-grid-filter-text`},_e={key:0,class:`gp-grid-filter-mode-toggle`},ve={key:1,class:`gp-grid-filter-info`},ye={class:`gp-grid-filter-actions`},be=[`disabled`],xe={class:`gp-grid-filter-list`},Se={key:0,class:`gp-grid-filter-option`},Ce=[`checked`],we=[`checked`,`onChange`],Te={key:0,class:`gp-grid-filter-combination`},Ee=[`onClick`],De=[`onClick`],Oe={class:`gp-grid-filter-row`},ke=[`value`,`autofocus`,`onChange`],Ae=[`value`],je=[`value`,`onInput`],Me=[`onClick`];var Ne=c({__name:`TextFilterContent`,props:{distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{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`}],c=n,l=o;function d(e){return Array.isArray(e)?e.join(`, `):String(e??``)}let f=t(()=>{let e=c.distinctValues.filter(e=>e!=null&&e!==``&&!(Array.isArray(e)&&e.length===0)).map(e=>d(e));return Array.from(new Set(e)).sort((e,t)=>{let n=parseFloat(e),r=parseFloat(t);return!isNaN(n)&&!isNaN(r)?n-r:e.localeCompare(t,void 0,{numeric:!0,sensitivity:`base`})})}),p=t(()=>f.value.length>100),h=g(t(()=>{if(!c.currentFilter?.conditions[0])return p.value?`condition`:`values`;let e=c.currentFilter.conditions[0];return e.selectedValues&&e.selectedValues.size>0?`values`:`condition`}).value),v=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].selectedValues??new Set:new Set),y=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),C=g(``),T=g(new Set(v.value)),E=g(y.value),{conditions:D,combination:ee,updateCondition:O,addCondition:k,removeCondition:A}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`contains`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.conditions[0];if(e.selectedValues&&e.selectedValues.size>0)return[{operator:`contains`,value:``,valueTo:``,nextOperator:`and`}];let t=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(e=>{let n=e;return{operator:n.operator,value:n.value??``,valueTo:``,nextOperator:n.nextOperator??t}})}).value,c.currentFilter?.combination??`and`),j=t(()=>{if(!C.value)return f.value;let e=C.value.toLowerCase();return f.value.filter(t=>t.toLowerCase().includes(e))}),M=t(()=>c.distinctValues.some(e=>e==null||e===``)),N=t(()=>j.value.every(e=>T.value.has(e))&&(!M.value||E.value));function P(){T.value=new Set(j.value),M.value&&(E.value=!0)}function F(){T.value=new Set,E.value=!1}function I(e){let t=new Set(T.value);t.has(e)?t.delete(e):t.add(e),T.value=t}function L(){if(h.value===`values`){if(f.value.every(e=>T.value.has(e))&&(!M.value||E.value)){l(`apply`,null);return}l(`apply`,{conditions:[{type:`text`,operator:`equals`,selectedValues:T.value,includeBlank:E.value}],combination:`and`})}else{let e=D.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.value.trim()!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`text`,operator:e.operator,value:e.value,nextOperator:e.nextOperator})),combination:`and`})}}function R(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,ge,[r(` Mode toggle - only show if not too many values `),p.value?r(`v-if`,!0):(m(),i(`div`,_e,[a(`button`,{type:`button`,class:u({active:h.value===`values`}),onClick:n[0]||=e=>h.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:h.value===`condition`}),onClick:n[1]||=e=>h.value=`condition`},` Condition `,2)])),r(` Too many values message `),p.value&&h.value===`condition`?(m(),i(`div`,ve,` Too many unique values (`+b(f.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),h.value===`values`?(m(),i(e,{key:2},[r(` Search input `),w(a(`input`,{"onUpdate:modelValue":n[2]||=e=>C.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[S,C.value]]),r(` Select all / Deselect all `),a(`div`,ye,[a(`button`,{type:`button`,disabled:N.value,onClick:P},` Select All `,8,be),a(`button`,{type:`button`,onClick:F},` Deselect All `)]),r(` Checkbox list `),a(`div`,xe,[r(` Blanks option `),M.value?(m(),i(`label`,Se,[a(`input`,{type:`checkbox`,checked:E.value,onChange:n[3]||=e=>E.value=!E.value},null,40,Ce),n[5]||=a(`span`,{class:`gp-grid-filter-blank`},`(Blanks)`,-1)])):r(`v-if`,!0),r(` Values `),(m(!0),i(e,null,_(j.value,e=>(m(),i(`label`,{key:e,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:T.value.has(e),onChange:t=>I(e)},null,40,we),a(`span`,null,b(e),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),h.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,_(x(D),(t,n)=>(m(),i(`div`,{key:n,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),n>0?(m(),i(`div`,Te,[a(`button`,{type:`button`,class:u({active:x(D)[n-1]?.nextOperator===`and`}),onClick:e=>x(O)(n-1,{nextOperator:`and`})},` AND `,10,Ee),a(`button`,{type:`button`,class:u({active:x(D)[n-1]?.nextOperator===`or`}),onClick:e=>x(O)(n-1,{nextOperator:`or`})},` OR `,10,De)])):r(`v-if`,!0),a(`div`,Oe,[r(` Operator select `),a(`select`,{value:t.operator,autofocus:n===0,onChange:e=>x(O)(n,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,Ae)),64))],40,ke),r(` Text input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`text`,value:t.value,placeholder:`Value`,class:`gp-grid-filter-text-input`,onInput:e=>x(O)(n,{value:e.target.value})},null,40,je)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(D).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(A)(n)},` × `,8,Me)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[4]||=e=>x(k)(`contains`)},` + Add condition `)],64)):r(`v-if`,!0),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:R},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:L},` Apply `)])]))}});const Pe={class:`gp-grid-filter-content gp-grid-filter-number`},Fe={key:0,class:`gp-grid-filter-combination`},Ie=[`onClick`],Le=[`onClick`],Re={class:`gp-grid-filter-row`},ze=[`value`,`onChange`],Be=[`value`],Ve=[`value`,`onInput`],He=[`value`,`onInput`],Ue=[`onClick`];var We=c({__name:`NumberFilterContent`,props:{currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{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`}],c=n,l=o,{conditions:d,combination:f,updateCondition:p,addCondition:h,removeCondition:g}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`=`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(t=>{let n=t;return{operator:n.operator,value:n.value==null?``:String(n.value),valueTo:n.valueTo==null?``:String(n.valueTo),nextOperator:n.nextOperator??e}})}).value,c.currentFilter?.combination??`and`);function v(){let e=d.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.operator===`between`?e.value!==``&&e.valueTo!==``:e.value!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`number`,operator:e.operator,value:e.value?parseFloat(e.value):void 0,valueTo:e.valueTo?parseFloat(e.valueTo):void 0,nextOperator:e.nextOperator})),combination:`and`})}function y(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,Pe,[(m(!0),i(e,null,_(x(d),(t,o)=>(m(),i(`div`,{key:o,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),o>0?(m(),i(`div`,Fe,[a(`button`,{type:`button`,class:u({active:x(d)[o-1]?.nextOperator===`and`}),onClick:e=>x(p)(o-1,{nextOperator:`and`})},` AND `,10,Ie),a(`button`,{type:`button`,class:u({active:x(d)[o-1]?.nextOperator===`or`}),onClick:e=>x(p)(o-1,{nextOperator:`or`})},` OR `,10,Le)])):r(`v-if`,!0),a(`div`,Re,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>x(p)(o,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,Be)),64))],40,ze),r(` Number input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`number`,value:t.value,placeholder:`Value`,onInput:e=>x(p)(o,{value:e.target.value})},null,40,Ve)):r(`v-if`,!0),r(` Second number input for "between" `),t.operator===`between`?(m(),i(e,{key:1},[n[1]||=a(`span`,{class:`gp-grid-filter-to`},`to`,-1),a(`input`,{type:`number`,value:t.valueTo,placeholder:`Value`,onInput:e=>x(p)(o,{valueTo:e.target.value})},null,40,He)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(d).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(g)(o)},` × `,8,Ue)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>x(h)(`=`)},` + Add condition `),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:y},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:v},` Apply `)])]))}});const Ge={class:`gp-grid-filter-content gp-grid-filter-date`},Ke={key:0,class:`gp-grid-filter-combination`},qe=[`onClick`],Je=[`onClick`],Ye={class:`gp-grid-filter-row`},Xe=[`value`,`onChange`],Ze=[`value`],Qe=[`value`,`onInput`],$e=[`value`,`onInput`],et=[`onClick`];var tt=c({__name:`DateFilterContent`,props:{currentFilter:{}},emits:[`apply`,`close`],setup(n,{emit:o}){let s=[{value:`=`,label:`=`},{value:`!=`,label:`≠`},{value:`>`,label:`>`},{value:`<`,label:`<`},{value:`between`,label:`↔`},{value:`blank`,label:`Is blank`},{value:`notBlank`,label:`Not blank`}],c=n,l=o;function d(e){if(!e)return``;let t=typeof e==`string`?new Date(e):e;return isNaN(t.getTime())?``:t.toISOString().split(`T`)[0]}let{conditions:f,combination:p,updateCondition:h,addCondition:g,removeCondition:v}=$(t(()=>{if(!c.currentFilter?.conditions.length)return[{operator:`=`,value:``,valueTo:``,nextOperator:`and`}];let e=c.currentFilter.combination??`and`;return c.currentFilter.conditions.map(t=>{let n=t;return{operator:n.operator,value:d(n.value),valueTo:d(n.valueTo),nextOperator:n.nextOperator??e}})}).value,c.currentFilter?.combination??`and`);function y(){let e=f.value.filter(e=>e.operator===`blank`||e.operator===`notBlank`?!0:e.operator===`between`?e.value!==``&&e.valueTo!==``:e.value!==``);if(e.length===0){l(`apply`,null);return}l(`apply`,{conditions:e.map(e=>({type:`date`,operator:e.operator,value:e.value||void 0,valueTo:e.valueTo||void 0,nextOperator:e.nextOperator})),combination:`and`})}function S(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,Ge,[(m(!0),i(e,null,_(x(f),(t,o)=>(m(),i(`div`,{key:o,class:`gp-grid-filter-condition`},[r(` Combination toggle (AND/OR) for conditions after the first `),o>0?(m(),i(`div`,Ke,[a(`button`,{type:`button`,class:u({active:x(f)[o-1]?.nextOperator===`and`}),onClick:e=>x(h)(o-1,{nextOperator:`and`})},` AND `,10,qe),a(`button`,{type:`button`,class:u({active:x(f)[o-1]?.nextOperator===`or`}),onClick:e=>x(h)(o-1,{nextOperator:`or`})},` OR `,10,Je)])):r(`v-if`,!0),a(`div`,Ye,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>x(h)(o,{operator:e.target.value})},[(m(),i(e,null,_(s,e=>a(`option`,{key:e.value,value:e.value},b(e.label),9,Ze)),64))],40,Xe),r(` Date input (hidden for blank/notBlank) `),t.operator!==`blank`&&t.operator!==`notBlank`?(m(),i(`input`,{key:0,type:`date`,value:t.value,onInput:e=>x(h)(o,{value:e.target.value})},null,40,Qe)):r(`v-if`,!0),r(` Second date input for "between" `),t.operator===`between`?(m(),i(e,{key:1},[n[1]||=a(`span`,{class:`gp-grid-filter-to`},`to`,-1),a(`input`,{type:`date`,value:t.valueTo,onInput:e=>x(h)(o,{valueTo:e.target.value})},null,40,$e)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),x(f).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>x(v)(o)},` × `,8,et)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>x(g)(`=`)},` + Add condition `),r(` Apply/Clear buttons `),a(`div`,{class:`gp-grid-filter-buttons`},[a(`button`,{type:`button`,class:`gp-grid-filter-btn-clear`,onClick:S},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:y},` Apply `)])]))}});const nt={class:`gp-grid-filter-header`};var rt=c({__name:`FilterPopup`,props:{column:{},colIndex:{},anchorRect:{},distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(o,{emit:c}){let l=o,u=c,f=g(null);he(f,{onClose:()=>u(`close`),ignoreSelector:`.gp-grid-filter-icon`});let p=t(()=>l.column.colId??l.column.field);function h(e){u(`apply`,p.value,e),u(`close`)}function _(){u(`close`)}let v=t(()=>l.column.cellDataType);t(()=>v.value===`text`||v.value===`object`);let y=t(()=>v.value===`number`),x=t(()=>v.value===`date`||v.value===`dateString`||v.value===`dateTime`||v.value===`dateTimeString`),S=t(()=>({position:`fixed`,top:`${l.anchorRect.top+l.anchorRect.height+4}px`,left:`${l.anchorRect.left}px`,minWidth:`${Math.max(200,l.anchorRect.width)}px`,zIndex:1e4}));return(t,c)=>(m(),i(`div`,{ref_key:`popupRef`,ref:f,class:`gp-grid-filter-popup`,style:d(S.value)},[a(`div`,nt,` Filter: `+b(o.column.headerName??o.column.field),1),r(` Number filter `),y.value?(m(),n(We,{key:0,"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`current-filter`])):x.value?(m(),i(e,{key:1},[r(` Date filter `),s(tt,{"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`current-filter`])],2112)):(m(),i(e,{key:2},[r(` Text filter (default) `),s(Ne,{"distinct-values":o.distinctValues,"current-filter":o.currentFilter,onApply:h,onClose:_},null,8,[`distinct-values`,`current-filter`])],2112))],4))}});const it=[`data-col-index`,`onClick`],at=[`onMousedown`,`onDblclick`,`onMouseenter`],ot={key:1,class:`gp-grid-loading`},st={key:2,class:`gp-grid-error`},ct={key:3,class:`gp-grid-empty`};var lt=c({__name:`GpGrid`,props:{columns:{},dataSource:{},rowData:{},rowHeight:{},headerHeight:{},overscan:{default:3},sortingEnabled:{type:Boolean,default:!0},darkMode:{type:Boolean,default:!1},wheelDampening:{default:.1},cellRenderers:{default:()=>({})},editRenderers:{default:()=>({})},headerRenderers:{default:()=>({})},cellRenderer:{},editRenderer:{},headerRenderer:{},initialWidth:{},initialHeight:{},highlighting:{},getRowId:{},onCellValueChanged:{},loadingComponent:{}},setup(o,{expose:s}){ie();let c=o,l=g(null),h=y(null),S=y(null),w=y(null),{state:T,applyInstructions:D,reset:O}=K({initialWidth:c.initialWidth,initialHeight:c.initialHeight}),A=t(()=>c.headerHeight??c.rowHeight),M=t(()=>c.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),P=t(()=>k(M.value.map(e=>e.column),T.viewportWidth)),F=t(()=>P.value.positions),I=t(()=>P.value.widths),L=t(()=>te(F.value)),R=t(()=>Array.from(T.slots.values())),{handleCellMouseDown:ne,handleCellDoubleClick:re,handleFillHandleMouseDown:z,handleHeaderClick:ae,handleKeyDown:H,handleWheel:se,dragState:W}=J(h,l,t(()=>c.columns),{activeCell:t(()=>T.activeCell),selectionRange:t(()=>T.selectionRange),editingCell:t(()=>T.editingCell),filterPopupOpen:t(()=>T.filterPopup?.isOpen??!1),rowHeight:c.rowHeight,headerHeight:A.value,columnPositions:F,visibleColumnsWithIndices:M,slots:t(()=>T.slots)}),{fillHandlePosition:G}=Y({activeCell:t(()=>T.activeCell),selectionRange:t(()=>T.selectionRange),slots:t(()=>T.slots),columns:t(()=>c.columns),visibleColumnsWithIndices:M,columnPositions:F,columnWidths:I,rowHeight:c.rowHeight});function ce(){let e=l.value,t=h.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function q(e,t){let n=h.value;n&&n.setFilter(e,t)}function le(){let e=h.value;e&&e.closeFilterPopup()}function ue(e,t){h.value?.input.handleCellMouseEnter(e,t)}function X(){h.value?.input.handleCellMouseLeave()}function Z(e){return[`gp-grid-row`,...h.value?.highlight?.computeRowClasses(e.rowIndex,e.rowData)??[]].filter(Boolean).join(` `)}function fe(e,t,n,r,i){let a=V(e,t,T.editingCell);return[ee(B(e,t,T.activeCell),U(e,t,T.selectionRange),a,oe(e,t,W.value.dragType===`fill`,W.value.fillSourceRange,W.value.fillTarget)),...h.value?.highlight?.computeCombinedCellClasses(e,t,n,r)??[]].filter(Boolean).join(` `)}function Q(){return c.dataSource??(c.rowData?N(c.rowData):j([]))}function he(e){w.value&&=(w.value(),null),h.value&&h.value.destroy();let t=new E({columns:c.columns,dataSource:e,rowHeight:c.rowHeight,headerHeight:A.value,overscan:c.overscan,sortingEnabled:c.sortingEnabled,highlighting:c.highlighting,getRowId:c.getRowId,onCellValueChanged:c.onCellValueChanged?e=>c.onCellValueChanged?.(e):void 0});h.value=t,w.value=t.onBatchInstruction(e=>{D(e)}),t.initialize();let n=l.value;n&&t.setViewport(n.scrollTop,n.scrollLeft,n.clientWidth,n.clientHeight)}return f(()=>{let e=Q();S.value=e,he(e);let t=l.value;if(t&&typeof ResizeObserver<`u`){let e=new ResizeObserver(()=>{h.value?.setViewport(t.scrollTop,t.scrollLeft,t.clientWidth,t.clientHeight)});e.observe(t),p(()=>{e.disconnect()})}p(()=>{w.value&&=(w.value(),null),h.value&&=(h.value.destroy(),null),S.value&&=(S.value.destroy?.(),null)})}),C([()=>c.dataSource,()=>c.rowData],()=>{c.rowData&&c.rowData.length>1e4&&S.value&&console.warn(`[gp-grid] rowData prop changed with ${c.rowData.length} rows — this triggers a full rebuild. Use useGridData() for efficient updates.`);let e=Q(),t=S.value;t&&t!==e?(t.destroy?.(),S.value=e,h.value?.setDataSource(e)):t||(S.value=e)}),C(()=>c.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{h.value?.refreshFromTransaction()});p(()=>e())}}},{immediate:!0}),C(()=>c.highlighting,e=>{h.value?.highlight&&e&&h.value.highlight.updateOptions(e)}),s({core:h}),(t,s)=>(m(),i(`div`,{ref_key:`containerRef`,ref:l,class:u([`gp-grid-container`,{"gp-grid-container--dark":o.darkMode}]),style:{width:`100%`,height:`100%`,overflow:`auto`,position:`relative`},tabindex:`0`,onScroll:ce,onWheel:s[1]||=e=>x(se)(e,o.wheelDampening),onKeydown:s[2]||=(...e)=>x(H)&&x(H)(...e)},[r(` Content sizer `),a(`div`,{style:d({width:`${Math.max(x(T).contentWidth,L.value)}px`,height:`${Math.max(x(T).contentHeight,A.value)}px`,position:`relative`,minWidth:`100%`})},[r(` Headers `),a(`div`,{class:u([`gp-grid-header`,{"gp-grid-header--loading":x(T).isLoading}]),style:d({position:`sticky`,top:0,left:0,height:`${A.value}px`,width:`${Math.max(x(T).contentWidth,L.value)}px`,minWidth:`100%`})},[(m(!0),i(e,null,_(M.value,({column:e,originalIndex:t},r)=>(m(),i(`div`,{key:e.colId??e.field,class:`gp-grid-header-cell`,"data-col-index":t,style:d({position:`absolute`,left:`${F.value[r]}px`,top:0,width:`${I.value[r]}px`,height:`${A.value}px`,background:`transparent`}),onClick:e=>x(ae)(t,e)},[(m(),n(v(x(me)({column:e,colIndex:t,sortDirection:x(T).headers.get(t)?.sortDirection,sortIndex:x(T).headers.get(t)?.sortIndex,sortable:x(T).headers.get(t)?.sortable??!0,filterable:x(T).headers.get(t)?.filterable??!0,hasFilter:x(T).headers.get(t)?.hasFilter??!1,core:h.value,container:l.value,headerRenderers:o.headerRenderers??{},globalHeaderRenderer:o.headerRenderer}))))],12,it))),128))],6),r(` Row slots `),(m(!0),i(e,null,_(R.value.filter(e=>e.rowIndex>=0),t=>(m(),i(`div`,{key:t.slotId,class:u(Z(t)),style:d({position:`absolute`,top:0,left:0,transform:`translateY(${t.translateY}px)`,width:`${Math.max(x(T).contentWidth,L.value)}px`,height:`${o.rowHeight}px`})},[(m(!0),i(e,null,_(M.value,({column:a,originalIndex:s},c)=>(m(),i(`div`,{key:`${t.slotId}-${s}`,class:u(fe(t.rowIndex,s,a,t.rowData,x(T).hoverPosition)),style:d({position:`absolute`,left:`${F.value[c]}px`,top:0,width:`${I.value[c]}px`,height:`${o.rowHeight}px`}),onMousedown:e=>x(ne)(t.rowIndex,s,e),onDblclick:()=>x(re)(t.rowIndex,s),onMouseenter:()=>ue(t.rowIndex,s),onMouseleave:X},[r(` Edit mode `),x(V)(t.rowIndex,s,x(T).editingCell)&&x(T).editingCell?(m(),n(v(x(pe)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:s,initialValue:x(T).editingCell.initialValue,core:h.value,editRenderers:o.editRenderers??{},globalEditRenderer:o.editRenderer})),{key:0})):(m(),i(e,{key:1},[r(` View mode `),(m(),n(v(x(de)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:s,isActive:x(B)(t.rowIndex,s,x(T).activeCell),isSelected:x(U)(t.rowIndex,s,x(T).selectionRange),isEditing:!1,cellRenderers:o.cellRenderers??{},globalCellRenderer:o.cellRenderer}))))],64))],46,at))),128))],6))),128)),r(` Fill handle `),x(G)&&!x(T).editingCell?(m(),i(`div`,{key:0,class:`gp-grid-fill-handle`,style:d({position:`absolute`,top:`${x(G).top}px`,left:`${x(G).left}px`,zIndex:200}),onMousedown:s[0]||=(...e)=>x(z)&&x(z)(...e)},null,36)):r(`v-if`,!0),r(` Loading overlay with indicator `),x(T).isLoading?(m(),i(e,{key:1},[s[4]||=a(`div`,{class:`gp-grid-loading-overlay`},null,-1),c.loadingComponent?(m(),n(v(c.loadingComponent),{key:0,"is-loading":!0})):(m(),i(`div`,ot,[...s[3]||=[a(`div`,{class:`gp-grid-loading-spinner`},null,-1)]]))],64)):r(`v-if`,!0),r(` Error message `),x(T).error?(m(),i(`div`,st,` Error: `+b(x(T).error),1)):r(`v-if`,!0),r(` Empty state `),!x(T).isLoading&&!x(T).error&&x(T).totalRows===0?(m(),i(`div`,ct,` No data to display `)):r(`v-if`,!0)],4),r(` Filter Popup `),x(T).filterPopup?.isOpen&&x(T).filterPopup.column&&x(T).filterPopup.anchorRect?(m(),n(rt,{key:0,column:x(T).filterPopup.column,"col-index":x(T).filterPopup.colIndex,"anchor-rect":x(T).filterPopup.anchorRect,"distinct-values":x(T).filterPopup.distinctValues,"current-filter":x(T).filterPopup.currentFilter,onApply:q,onClose:le},null,8,[`column`,`col-index`,`anchor-rect`,`distinct-values`,`current-filter`])):r(`v-if`,!0)],34))}});function ut(e){ie();let n=g(null),r=g(null),{state:i,applyInstructions:a}=K(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>k(s.value.map(e=>e.column),i.viewportWidth)),l=t(()=>c.value.positions),u=t(()=>c.value.widths),d=t(()=>te(l.value)),m=t(()=>Array.from(i.slots.values())),{handleCellMouseDown:h,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,dragState:S}=J(r,n,t(()=>e.columns),{activeCell:t(()=>i.activeCell),selectionRange:t(()=>i.selectionRange),editingCell:t(()=>i.editingCell),filterPopupOpen:t(()=>i.filterPopup?.isOpen??!1),rowHeight:e.rowHeight,headerHeight:o.value,columnPositions:l,visibleColumnsWithIndices:s,slots:t(()=>i.slots)}),w=()=>{let e=n.value,t=r.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)},T=(e,t)=>{let n=r.value;n&&n.setFilter(e,t)},D=()=>{let e=r.value;e&&e.closeFilterPopup()},O=(e,t)=>{r.value?.input.handleCellMouseEnter(e,t)},A=()=>{r.value?.input.handleCellMouseLeave()};f(()=>{let t=e.dataSource??(e.rowData?N(e.rowData):j([])),i=new E({columns:e.columns,dataSource:t,rowHeight:e.rowHeight,headerHeight:o.value,overscan:e.overscan??3,sortingEnabled:e.sortingEnabled??!0,highlighting:e.highlighting,getRowId:e.getRowId,onCellValueChanged:e.onCellValueChanged?t=>e.onCellValueChanged?.(t):void 0});r.value=i;let s=i.onBatchInstruction(e=>{a(e)});i.initialize();let c=n.value;if(c){i.setViewport(c.scrollTop,c.scrollLeft,c.clientWidth,c.clientHeight);let e=new ResizeObserver(()=>{i.setViewport(c.scrollTop,c.scrollLeft,c.clientWidth,c.clientHeight)});e.observe(c),p(()=>{e.disconnect(),s(),r.value=null})}}),C(()=>e.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{r.value?.refresh()});p(()=>e())}}},{immediate:!0}),C(()=>e.highlighting,e=>{r.value?.highlight&&e&&r.value.highlight.updateOptions(e)});let{fillHandlePosition:M}=Y({activeCell:t(()=>i.activeCell),selectionRange:t(()=>i.selectionRange),slots:t(()=>i.slots),columns:t(()=>e.columns),visibleColumnsWithIndices:s,columnPositions:l,columnWidths:u,rowHeight:e.rowHeight});return{containerRef:n,coreRef:r,state:i,slotsArray:m,totalHeaderHeight:o,columnPositions:l,columnWidths:u,totalWidth:d,fillHandlePosition:M,handleScroll:w,handleCellMouseDown:h,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,handleFilterApply:T,handleFilterPopupClose:D,handleCellMouseEnter:O,handleCellMouseLeave:A,dragState:S,isCellSelected:U,isCellActive:B,isCellEditing:V,isCellInFillPreview:oe,buildCellClasses:ee}}const dt=(e,t)=>{let n=F(e,{getRowId:t.getRowId,debounceMs:t.debounceMs,useWorker:t.useWorker,parallelSort:t.parallelSort});return p(()=>{n.clear()}),{dataSource:n,updateRow:n.updateRow,addRows:n.addRows,removeRows:n.removeRows,updateCell:n.updateCell,clear:n.clear,getRowById:n.getRowById,getTotalRowCount:n.getTotalRowCount,flushTransactions:n.flushTransactions}};export{lt as GpGrid,lt as default,T as GridCore,D as buildCellClasses,O as calculateColumnPositions,A as createClientDataSource,M as createDataSourceFromArray,G as createInitialState,P as createMutableClientDataSource,I as createServerDataSource,L as findColumnAtX,Z as getCellValue,R as getTotalWidth,ne as gridStyles,re as injectStyles,z as isCellActive,ae as isCellEditing,H as isCellInFillPreview,se as isCellSelected,W as isRowVisible,de as renderCell,pe as renderEditCell,me as renderHeader,q as useAutoScroll,Y as useFillHandle,$ as useFilterConditions,he as useFilterPopup,ut as useGpGrid,dt as useGridData,K as useGridState,J as useInputHandler};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@gp-grid/vue",
3
3
  "description": "A high-performance Vue 3 data grid component with virtual scrolling, cell selection, sorting, filtering, and Excel-like editing",
4
- "version": "0.7.4",
4
+ "version": "0.8.0",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
@@ -43,7 +43,7 @@
43
43
  "nuxt3"
44
44
  ],
45
45
  "dependencies": {
46
- "@gp-grid/core": "0.7.4"
46
+ "@gp-grid/core": "0.8.0"
47
47
  },
48
48
  "peerDependencies": {
49
49
  "vue": "^3.4.0"