@gp-grid/vue 0.10.2 → 0.11.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as vue from "vue";
 import { Component as Component$1, ComputedRef, Ref, ShallowRef, VNode } from "vue";
-import { CellDataType, CellPosition, CellPosition as CellPosition$1, CellRange, CellRange as CellRange$1, CellRendererParams, CellRendererParams as CellRendererParams$1, CellValue, CellValue as CellValue$1, CellValueChangedEvent, CellValueChangedEvent as CellValueChangedEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnDefinition as ColumnDefinition$2, ColumnFilterModel, ColumnFilterModel as ColumnFilterModel$1, ContainerBounds, DataSource, DataSource as DataSource$1, DataSourceRequest, DataSourceResponse, DateFilterCondition, DragState, DragState as DragState$1, EditRendererParams, EditRendererParams as EditRendererParams$1, FillHandlePosition, FilterCondition, FilterModel, FilterPopupState, GridCore, GridCore as GridCore$1, GridInstruction, GridInstruction as GridInstruction$1, GridState, GridState as GridState$1, HeaderData, HeaderRendererParams, HeaderRendererParams as HeaderRendererParams$1, HighlightingOptions, KeyEventData, MutableDataSource, MutableDataSource as MutableDataSource$1, NumberFilterCondition, ParallelSortOptions, PointerEventData, Row, RowId, RowId as RowId$1, SelectionState, SlotData, SlotData as SlotData$1, SortDirection, SortDirection as SortDirection$1, SortModel, TextFilterCondition, VisibleColumnInfo, buildCellClasses, buildCellClasses as buildCellClasses$1, calculateColumnPositions, createClientDataSource, createDataSourceFromArray, createInitialState, createMutableClientDataSource, createServerDataSource, findColumnAtX, getFieldValue as getCellValue, getTotalWidth, gridStyles, injectStyles, 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";
+import { CellDataType, CellPosition, CellPosition as CellPosition$1, CellRange, CellRange as CellRange$1, CellRendererParams, CellRendererParams as CellRendererParams$1, CellValue, CellValue as CellValue$1, CellValueChangedEvent, CellValueChangedEvent as CellValueChangedEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnDefinition as ColumnDefinition$2, ColumnFilterModel, ColumnFilterModel as ColumnFilterModel$1, ContainerBounds, DataSource, DataSource as DataSource$1, DataSourceRequest, DataSourceResponse, DateFilterCondition, DragState, DragState as DragState$1, EditRendererParams, EditRendererParams as EditRendererParams$1, FillHandlePosition, FilterCondition, FilterModel, FilterPopupState, GridCore, GridCore as GridCore$1, GridInstruction, GridInstruction as GridInstruction$1, GridState, GridState as GridState$1, HeaderData, HeaderRendererParams, HeaderRendererParams as HeaderRendererParams$1, HighlightingOptions, KeyEventData, MutableDataSource, MutableDataSource as MutableDataSource$1, NumberFilterCondition, ParallelSortOptions, PointerEventData, Row, RowId, RowId as RowId$1, SelectionState, SlotData, SlotData as SlotData$1, SortDirection, SortDirection as SortDirection$1, SortModel, TextFilterCondition, VisibleColumnInfo, buildCellClasses, buildCellClasses as buildCellClasses$1, calculateColumnPositions, createClientDataSource, createDataSourceFromArray, createInitialState, createMutableClientDataSource, createServerDataSource, findColumnAtX, getFieldValue as getCellValue, getTotalWidth, gridStyles, 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/types.d.ts
 /**
@@ -373,4 +373,4 @@ interface RenderHeaderOptions {
  */
 declare function renderHeader(options: RenderHeaderOptions): VNode;
 //#endregion
-export { type CellDataType, type CellPosition, type CellRange, type CellRendererParams, type CellValue, type CellValueChangedEvent, type ColumnDefinition$1 as 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 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 };
+export { type CellDataType, type CellPosition, type CellRange, type CellRendererParams, type CellValue, type CellValueChangedEvent, type ColumnDefinition$1 as 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 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, isCellActive, isCellEditing, isCellInFillPreview, isCellSelected, isRowVisible, renderCell, renderEditCell, renderHeader, useAutoScroll, useFillHandle, useFilterConditions, useFilterPopup, useGpGrid, useGridData, useGridState, useInputHandler };

package/dist/index.js

@@ -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,ref as h,renderList as g,resolveDynamicComponent as _,shallowRef as v,toDisplayString as y,unref as b,vModelText as x,watch as S,withDirectives as C,withModifiers as w}from"vue";import{GridCore as T,GridCore as E,applyInstruction as D,buildCellClasses as O,buildCellClasses as k,calculateColumnPositions as A,calculateFillHandlePosition as j,calculateFilterPopupPosition as M,calculateScaledColumnPositions as N,createClientDataSource as P,createClientDataSource as F,createDataSourceFromArray as I,createDataSourceFromArray as L,createInitialState as R,createInitialState as z,createMutableClientDataSource as B,createMutableClientDataSource as V,createServerDataSource as ee,findColumnAtX as te,formatCellValue as ne,getFieldValue as re,getFieldValue as ie,getTotalWidth as ae,getTotalWidth as oe,gridStyles as se,injectStyles as H,injectStyles as ce,isCellActive as le,isCellActive as U,isCellEditing as ue,isCellEditing as W,isCellInFillPreview as de,isCellInFillPreview as G,isCellSelected as fe,isCellSelected as K,isRowVisible as pe,scrollCellIntoView as q}from"@gp-grid/core";function J(e){let t=v(z(e));return{state:t,applyInstructions:e=>{let n=t.value,r=new Map(n.slots),i=new Map(n.headers),a={pendingScrollTop:null};for(let t of e){let e=D(t,r,i);e&&Object.assign(a,e)}a.slots=r,a.headers=i,t.value={...n,...a}},reset:()=>{t.value=z()}}}function Y(e,t){let n=h(null);function r(r,i){n.value&&clearInterval(n.value),n.value=setInterval(()=>{let n=e.value;n&&(n.scrollTop+=i,n.scrollLeft+=r,t?.())},16)}function i(){n.value&&=(clearInterval(n.value),null)}return p(()=>{i()}),{startAutoScroll:r,stopAutoScroll:i}}function X(e,t,n,r){let{activeCell:i,selectionRange:a,editingCell:o,filterPopupOpen:s,rowHeight:c,headerHeight:l,columnPositions:u,visibleColumnsWithIndices:d,slots:f,rowsWrapperOffset:m}=r,g=h({isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null,columnResize:null,columnMove:null,rowDrag:null}),_=null,v=null,y=null,b=null,x=null,C=e=>{e.preventDefault()},{startAutoScroll:w,stopAutoScroll:T}=Y(t,()=>{let t=e.value;if(_&&t?.input){let e=E();e&&(t.input.handleDragMove(_,e),g.value=t.input.getDragState())}});S([()=>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 E(){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 D(e){return{clientX:e.clientX,clientY:e.clientY,button:e.button,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,pointerId:e.pointerId,pointerType:e.pointerType}}function O(){v?.();let n=t=>{t.preventDefault();let n=e.value,r=E();if(!n?.input||!r)return;let i=D(t);_=i;let a=n.input.handleDragMove(i,r);a&&(a.autoScroll?w(a.autoScroll.dx,a.autoScroll.dy):T(),g.value=n.input.getDragState())},r=()=>{try{let t=e.value;t?.input&&t.input.handleDragEnd()}finally{let i=e.value;g.value=i?.input?i.input.getDragState():{isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null,columnResize:null,columnMove:null,rowDrag:null},_=null,T(),document.removeEventListener(`touchmove`,C),x!==null&&t.value&&(t.value.style.overflow=x,x=null),document.removeEventListener(`pointermove`,n),document.removeEventListener(`pointerup`,r),document.removeEventListener(`pointercancel`,r),v=null}};document.addEventListener(`pointermove`,n,{passive:!1}),document.addEventListener(`pointerup`,r),document.addEventListener(`pointercancel`,r),v=()=>{document.removeEventListener(`pointermove`,n),document.removeEventListener(`pointerup`,r),document.removeEventListener(`pointercancel`,r)}}function k(){y!==null&&(clearTimeout(y),y=null,e.value?.input?.cancelPendingRowDrag()),b=null}function A(n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleCellMouseDown(n,r,D(i));if(o.focusContainer&&t.value?.focus(),o.startDrag===`selection`)a.input.startSelectionDrag(),g.value=a.input.getDragState(),O();else if(o.startDrag===`row-drag`)g.value=a.input.getDragState(),O();else if(o.startDrag===`row-drag-pending`){k(),b={pointerId:i.pointerId,target:i.currentTarget??i.target};let e=()=>{k(),document.removeEventListener(`pointermove`,e),document.removeEventListener(`pointerup`,n),document.removeEventListener(`pointercancel`,n)},n=()=>{k(),document.removeEventListener(`pointermove`,e),document.removeEventListener(`pointerup`,n),document.removeEventListener(`pointercancel`,n)};document.addEventListener(`pointermove`,e,{once:!0}),document.addEventListener(`pointerup`,n,{once:!0}),document.addEventListener(`pointercancel`,n,{once:!0}),y=setTimeout(()=>{y=null,document.removeEventListener(`pointermove`,e),document.removeEventListener(`pointerup`,n),document.removeEventListener(`pointercancel`,n);let r=b;if(b=null,a.input.confirmPendingRowDrag()){if(t.value&&(x=t.value.style.overflow,t.value.style.overflow=`hidden`),document.addEventListener(`touchmove`,C,{passive:!1}),r)try{r.target.setPointerCapture(r.pointerId)}catch{}g.value=a.input.getDragState(),O()}},300)}}function j(t,n){let r=e.value;r?.input&&r.input.handleCellDoubleClick(t,n)}function M(t){let n=e.value;if(!n?.input)return;let r=n.input.handleFillHandleMouseDown(i.value,a.value,D(t));r.preventDefault&&t.preventDefault(),r.stopPropagation&&t.stopPropagation(),r.startDrag===`fill`&&(g.value=n.input.getDragState(),O())}function N(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 P(t,n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleHeaderMouseDown(t,n,r,D(i));o.preventDefault&&i.preventDefault(),o.stopPropagation&&i.stopPropagation(),o.startDrag===`column-move`&&(g.value=a.input.getDragState(),O())}function F(t,n,r){let i=e.value;if(!i?.input)return;let a=i.input.handleHeaderResizeMouseDown(t,n,D(r));a.preventDefault&&r.preventDefault(),a.stopPropagation&&r.stopPropagation(),a.startDrag===`column-resize`&&(g.value=i.input.getDragState(),O())}function I(n){let r=e.value,a=t.value;if(!r?.input)return;let l=r.input.handleKeyDown({key:n.key,shiftKey:n.shiftKey,ctrlKey:n.ctrlKey,metaKey:n.metaKey},i.value,o.value,s.value);l.preventDefault&&n.preventDefault(),l.scrollToCell&&a&&q(r,a,l.scrollToCell.row,c,f.value,m.value)}function L(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(()=>{v?.(),v=null,k(),T(),document.removeEventListener(`touchmove`,C),x!==null&&t.value&&(t.value.style.overflow=x,x=null)}),{handleCellMouseDown:A,handleCellDoubleClick:j,handleFillHandleMouseDown:M,handleHeaderClick:N,handleHeaderMouseDown:P,handleHeaderResizeMouseDown:F,handleKeyDown:I,handleWheel:L,dragState:g}}const Z=e=>{let{activeCell:n,selectionRange:r,slots:i,columns:a,visibleColumnsWithIndices:o,columnPositions:s,columnWidths:c,rowHeight:l}=e;return{fillHandlePosition:t(()=>j({activeCell:n.value,selectionRange:r.value,slots:i.value,columns:a.value,visibleColumnsWithIndices:o.value,columnPositions:s.value,columnWidths:c.value,rowHeight:l}))}};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(`pointerdown`,i),a&&document.addEventListener(`keydown`,a)})}),p(()=>{i&&document.removeEventListener(`pointerdown`,i),a&&document.removeEventListener(`keydown`,a)})}function Q(e,t=`and`){let n=h([...e]);return{conditions:n,combination:h(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`],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(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),S=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),w=h(``),T=h(new Set(v.value)),E=h(S.value),{conditions:D,combination:O,updateCondition:k,addCondition:A,removeCondition:j}=Q(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`),M=t(()=>{if(!w.value)return f.value;let e=w.value.toLowerCase();return f.value.filter(t=>t.toLowerCase().includes(e))}),N=t(()=>c.distinctValues.some(e=>e==null||e===``)),P=t(()=>M.value.every(e=>T.value.has(e))&&(!N.value||E.value));function F(){T.value=new Set(M.value),N.value&&(E.value=!0)}function I(){T.value=new Set,E.value=!1}function L(e){let t=new Set(T.value);t.has(e)?t.delete(e):t.add(e),T.value=t}function R(){if(_.value===`values`){if(f.value.every(e=>T.value.has(e))&&(!N.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 z(){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:_.value===`values`}),onClick:n[0]||=e=>_.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:_.value===`condition`}),onClick:n[1]||=e=>_.value=`condition`},` Condition `,2)])),r(` Too many values message `),p.value&&_.value===`condition`?(m(),i(`div`,_e,` Too many unique values (`+y(f.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),_.value===`values`?(m(),i(e,{key:2},[r(` Search input `),C(a(`input`,{"onUpdate:modelValue":n[2]||=e=>w.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[x,w.value]]),r(` Select all / Deselect all `),a(`div`,ve,[a(`button`,{type:`button`,disabled:P.value,onClick:F},` Select All `,8,ye),a(`button`,{type:`button`,onClick:I},` Deselect All `)]),r(` Checkbox list `),a(`div`,be,[r(` Blanks option `),N.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,g(M.value,e=>(m(),i(`label`,{key:e,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:T.value.has(e),onChange:t=>L(e)},null,40,Ce),a(`span`,null,y(e),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),_.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,g(b(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:b(D)[n-1]?.nextOperator===`and`}),onClick:e=>b(k)(n-1,{nextOperator:`and`})},` AND `,10,Te),a(`button`,{type:`button`,class:u({active:b(D)[n-1]?.nextOperator===`or`}),onClick:e=>b(k)(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=>b(k)(n,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(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=>b(k)(n,{value:e.target.value})},null,40,Ae)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(D).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(j)(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=>b(A)(`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:z},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:R},` Apply `)])]))}}),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`],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:_}=Q(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 x(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,Ne,[(m(!0),i(e,null,g(b(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:b(d)[o-1]?.nextOperator===`and`}),onClick:e=>b(p)(o-1,{nextOperator:`and`})},` AND `,10,Fe),a(`button`,{type:`button`,class:u({active:b(d)[o-1]?.nextOperator===`or`}),onClick:e=>b(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=>b(p)(o,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(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=>b(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=>b(p)(o,{valueTo:e.target.value})},null,40,Ve)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(d).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(_)(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=>b(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:x},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:v},` Apply `)])]))}}),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`],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:_,removeCondition:v}=Q(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 x(){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,g(b(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:b(f)[o-1]?.nextOperator===`and`}),onClick:e=>b(h)(o-1,{nextOperator:`and`})},` AND `,10,Ke),a(`button`,{type:`button`,class:u({active:b(f)[o-1]?.nextOperator===`or`}),onClick:e=>b(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=>b(h)(o,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(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=>b(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=>b(h)(o,{valueTo:e.target.value})},null,40,Qe)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(f).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(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=>b(_)(`=`)},` + 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:x},` Apply `)])]))}}),tt={class:`gp-grid-filter-header`},nt=c({__name:`FilterPopup`,props:{column:{},colIndex:{},containerRef:{},distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(o,{emit:c}){let l=o,u=c,g=h(null),_=h(0),v=h(0),b=h(200),x=h(!1);me(g,{onClose:()=>u(`close`),ignoreSelector:`.gp-grid-filter-icon`});let S=t(()=>l.column.colId??l.column.field);function C(e){u(`apply`,S.value,e),u(`close`)}function w(){u(`close`)}let T=t(()=>l.column.cellDataType);t(()=>T.value===`text`||T.value===`object`);let E=t(()=>T.value===`number`),D=t(()=>T.value===`date`||T.value===`dateString`||T.value===`dateTime`||T.value===`dateTimeString`),O=null,k=()=>{let e=l.containerRef,t=g.value;if(!e||!t)return;let n=e.querySelector(`[data-col-index="${l.colIndex}"]`);if(!n)return;let r=M(n,t);_.value=r.top,v.value=r.left,b.value=r.minWidth,x.value=!0},A=()=>{O===null&&(O=requestAnimationFrame(()=>{O=null,k()}))};f(()=>{requestAnimationFrame(k);let e=l.containerRef;e&&e.addEventListener(`scroll`,A,{passive:!0}),window.addEventListener(`resize`,A)}),p(()=>{let e=l.containerRef;e&&e.removeEventListener(`scroll`,A),window.removeEventListener(`resize`,A),O!==null&&cancelAnimationFrame(O)});let j=t(()=>({position:`fixed`,top:`${_.value}px`,left:`${v.value}px`,minWidth:`${b.value}px`,zIndex:1e4,visibility:x.value?`visible`:`hidden`}));return(t,c)=>(m(),i(`div`,{ref_key:`popupRef`,ref:g,class:`gp-grid-filter-popup`,style:d(j.value)},[a(`div`,tt,` Filter: `+y(o.column.headerName??o.column.field),1),r(` Number filter `),E.value?(m(),n(Ue,{key:0,"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`current-filter`])):D.value?(m(),i(e,{key:1},[r(` Date filter `),s(et,{"current-filter":o.currentFilter,onApply:C,onClose:w},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:C,onClose:w},null,8,[`distinct-values`,`current-filter`])],2112))],4))}}),$=e=>e==null||e===``?o(``):typeof e==`string`?o(e):e;function rt(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){if(typeof n.headerRenderer==`function`)return $(n.headerRenderer(m));let e=f[n.headerRenderer];if(e)return $(e(m))}if(p)return $(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`:``}`,onPointerdown: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)}const it=[`data-col-index`,`onPointerdown`],at=[`onPointerdown`],ot=c({__name:`GridHeader`,props:{headerHeight:{},scrollLeft:{},contentWidth:{},totalWidth:{},isLoading:{type:Boolean},visibleColumnsWithIndices:{},columnPositions:{},columnWidths:{},headers:{},sortingEnabled:{type:Boolean},onHeaderMouseDown:{type:Function},onHeaderResizeMouseDown:{type:Function},coreRef:{},outerContainerRef:{},headerRenderers:{},globalHeaderRenderer:{type:Function}},setup(t){let o=t;return(t,s)=>(m(),i(`div`,{class:u([`gp-grid-header`,{"gp-grid-header--loading":o.isLoading}]),style:d({height:`${o.headerHeight}px`})},[a(`div`,{style:d({position:`absolute`,top:0,left:0,transform:`translateX(${-o.scrollLeft}px)`,width:`${Math.max(o.contentWidth,o.totalWidth)}px`,height:`${o.headerHeight}px`})},[(m(!0),i(e,null,g(o.visibleColumnsWithIndices,({column:e,originalIndex:t},a)=>(m(),i(`div`,{key:e.colId??e.field,class:`gp-grid-header-cell`,"data-col-index":t,style:d({left:`${o.columnPositions[a]}px`,width:`${o.columnWidths[a]}px`,height:`${o.headerHeight}px`}),onPointerdown:e=>o.onHeaderMouseDown(t,o.columnWidths[a]??0,o.headerHeight,e)},[(m(),n(_(b(rt)({column:e,colIndex:t,sortDirection:o.headers.get(t)?.sortDirection,sortIndex:o.headers.get(t)?.sortIndex,sortable:e.sortable!==!1&&o.sortingEnabled,filterable:e.filterable!==!1,hasFilter:o.headers.get(t)?.hasFilter??!1,core:o.coreRef,container:o.outerContainerRef,headerRenderers:o.headerRenderers,globalHeaderRenderer:o.globalHeaderRenderer})))),e.resizable===!1?r(`v-if`,!0):(m(),i(`div`,{key:0,class:`gp-grid-header-resize-handle`,onPointerdown:w(e=>o.onHeaderResizeMouseDown(t,o.columnWidths[a]??0,e),[`stop`])},null,40,at))],44,it))),128))],4)],6))}});function st(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c,cellRenderers:l,globalCellRenderer:u}=e,d=re(n,t.field),f={value:d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer){if(typeof t.cellRenderer==`function`)return $(t.cellRenderer(f));let e=l[t.cellRenderer];if(e)return $(e(f))}return u?$(u(f)):o(ne(d,t.valueFormatter))}function ct(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:ie(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){if(typeof t.editRenderer==`function`)return $(t.editRenderer(d));let e=c[t.editRenderer];if(e)return $(e(d))}return u?$(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()})}const lt=[`onPointerdown`,`onDblclick`,`onMouseenter`],ut={key:0,class:`gp-grid-error`},dt={key:1,class:`gp-grid-empty`},ft=c({__name:`GridBody`,props:{rowHeight:{},totalHeaderHeight:{},contentWidth:{},contentHeight:{},totalWidth:{},rowsWrapperOffset:{},activeCell:{},selectionRange:{},editingCell:{},hoverPosition:{},error:{},isLoading:{type:Boolean},totalRows:{},slotsArray:{},visibleColumnsWithIndices:{},columnPositions:{},columnWidths:{},fillHandlePosition:{},dragState:{},onScroll:{type:Function},onWheel:{type:Function},wheelDampening:{},onCellMouseDown:{type:Function},onCellDoubleClick:{type:Function},onCellMouseEnter:{type:Function},onCellMouseLeave:{type:Function},onFillHandleMouseDown:{type:Function},coreRef:{},cellRenderers:{},editRenderers:{},globalCellRenderer:{type:Function},globalEditRenderer:{type:Function}},setup(t,{expose:o}){let s=t,c=h(null),l=e=>[`gp-grid-row`,...s.coreRef?.highlight?.computeRowClasses(e.rowIndex,e.rowData)??[]].filter(Boolean).join(` `),f=(e,t,n,r,i)=>{let a=W(e,t,s.editingCell),o=k(U(e,t,s.activeCell),K(e,t,s.selectionRange),a,G(e,t,s.dragState.dragType===`fill`,s.dragState.fillSourceRange,s.dragState.fillTarget)),c=s.coreRef?.highlight?.computeCombinedCellClasses(e,t,n,r)??[],l=n.rowDrag===!0;return[o,...c,l?`gp-grid-cell--row-drag-handle`:``].filter(Boolean).join(` `)};return o({bodyRef:c}),(t,o)=>(m(),i(`div`,{ref_key:`bodyRef`,ref:c,style:{flex:`1`,overflow:`auto`,position:`relative`},onScroll:o[2]||=(...e)=>s.onScroll&&s.onScroll(...e),onWheel:o[3]||=e=>s.onWheel(e,s.wheelDampening)},[r(` Content sizer - provides scroll range `),a(`div`,{style:d({width:`${Math.max(s.contentWidth,s.totalWidth)}px`,height:`${Math.max(s.contentHeight-s.totalHeaderHeight,0)}px`,position:`relative`,minWidth:`100%`})},[r(` Rows wrapper `),a(`div`,{class:`gp-grid-rows-wrapper`,style:d({width:`${Math.max(s.contentWidth,s.totalWidth)}px`,transform:`translateY(${s.rowsWrapperOffset}px)`})},[r(` Row slots `),(m(!0),i(e,null,g(s.slotsArray.filter(e=>e.rowIndex>=0),t=>(m(),i(`div`,{key:t.slotId,class:u(l(t)),style:d({position:`absolute`,top:0,left:0,transform:`translateY(${t.translateY}px)`,width:`${Math.max(s.contentWidth,s.totalWidth)}px`,height:`${s.rowHeight}px`})},[(m(!0),i(e,null,g(s.visibleColumnsWithIndices,({column:a,originalIndex:c},l)=>(m(),i(`div`,{key:`${t.slotId}-${a.colId??a.field}`,class:u(f(t.rowIndex,c,a,t.rowData,s.hoverPosition)),style:d({position:`absolute`,left:`${s.columnPositions[l]}px`,top:0,width:`${s.columnWidths[l]}px`,height:`${s.rowHeight}px`}),onPointerdown:e=>s.onCellMouseDown(t.rowIndex,c,e),onDblclick:()=>s.onCellDoubleClick(t.rowIndex,c),onMouseenter:()=>s.onCellMouseEnter(t.rowIndex,c),onMouseleave:o[0]||=(...e)=>s.onCellMouseLeave&&s.onCellMouseLeave(...e)},[r(` Edit mode `),b(W)(t.rowIndex,c,s.editingCell)&&s.editingCell?(m(),n(_(b(ct)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:c,initialValue:s.editingCell.initialValue,core:s.coreRef,editRenderers:s.editRenderers,globalEditRenderer:s.globalEditRenderer})),{key:0})):(m(),i(e,{key:1},[r(` View mode `),(m(),n(_(b(st)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:c,isActive:b(U)(t.rowIndex,c,s.activeCell),isSelected:b(K)(t.rowIndex,c,s.selectionRange),isEditing:!1,cellRenderers:s.cellRenderers,globalCellRenderer:s.globalCellRenderer}))))],64))],46,lt))),128))],6))),128)),r(` Fill handle `),s.fillHandlePosition&&!s.editingCell?(m(),i(`div`,{key:0,class:`gp-grid-fill-handle`,style:d({top:`${s.fillHandlePosition.top}px`,left:`${s.fillHandlePosition.left}px`}),onPointerdown:o[1]||=(...e)=>s.onFillHandleMouseDown&&s.onFillHandleMouseDown(...e)},null,36)):r(`v-if`,!0),r(` Row drop indicator `),s.dragState.dragType===`row-drag`&&s.dragState.rowDrag?.dropTargetIndex!==null?(m(),i(`div`,{key:1,class:`gp-grid-row-drop-indicator`,style:d({transform:`translateY(${s.dragState.rowDrag.dropIndicatorY}px)`,width:`${Math.max(s.contentWidth,s.totalWidth)}px`})},null,4)):r(`v-if`,!0)],4)],4),r(` Error message `),s.error?(m(),i(`div`,ut,` Error: `+y(s.error),1)):r(`v-if`,!0),r(` Empty state `),!s.isLoading&&!s.error&&s.totalRows===0?(m(),i(`div`,dt,` No data to display `)):r(`v-if`,!0)],544))}}),pt={key:1,class:`gp-grid-loading`},mt=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:{},rowDragEntireRow:{type:Boolean},onRowDragEnd:{},onColumnResized:{},onColumnMoved:{}},setup(o,{expose:c}){ce();let l=o,g=h(null),x=h(null),C=t(()=>x.value?.bodyRef??null),w=v(null),T=v(null),D=v(null),O=h(0),{state:k,applyInstructions:A,reset:j}=J({initialWidth:l.initialWidth,initialHeight:l.initialHeight}),M=t(()=>l.headerHeight??l.rowHeight),P=t(()=>k.value.columns??l.columns),I=t(()=>P.value.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),R=t(()=>N(I.value.map(e=>e.column),k.value.viewportWidth)),z=t(()=>R.value.positions),B=t(()=>R.value.widths),V=t(()=>oe(z.value)),ee=t(()=>Array.from(k.value.slots.values())),{handleCellMouseDown:te,handleCellDoubleClick:ne,handleFillHandleMouseDown:re,handleHeaderClick:ie,handleHeaderMouseDown:ae,handleHeaderResizeMouseDown:se,handleKeyDown:H,handleWheel:le,dragState:U}=X(w,C,P,{activeCell:t(()=>k.value.activeCell),selectionRange:t(()=>k.value.selectionRange),editingCell:t(()=>k.value.editingCell),filterPopupOpen:t(()=>k.value.filterPopup?.isOpen??!1),rowHeight:l.rowHeight,headerHeight:M.value,columnPositions:z,visibleColumnsWithIndices:I,slots:t(()=>k.value.slots),rowsWrapperOffset:t(()=>k.value.rowsWrapperOffset)}),{fillHandlePosition:ue}=Z({activeCell:t(()=>k.value.activeCell),selectionRange:t(()=>k.value.selectionRange),slots:t(()=>k.value.slots),columns:P,visibleColumnsWithIndices:I,columnPositions:z,columnWidths:B,rowHeight:l.rowHeight});function W(){let e=C.value,t=w.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function de(){let e=C.value;e&&(O.value=e.scrollLeft),W()}function G(e,t){let n=w.value;n&&n.setFilter(e,t)}function fe(){let e=w.value;e&&e.closeFilterPopup()}function K(e,t){w.value?.input.handleCellMouseEnter(e,t)}function pe(){w.value?.input.handleCellMouseLeave()}function q(){return l.dataSource??(l.rowData?L(l.rowData):F([]))}function Y(e){D.value&&=(D.value(),null),w.value&&w.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,getRowId:l.getRowId,onCellValueChanged:l.onCellValueChanged?e=>l.onCellValueChanged?.(e):void 0,rowDragEntireRow:l.rowDragEntireRow??!1,onRowDragEnd:(e,t)=>l.onRowDragEnd?.(e,t),onColumnResized:(e,t)=>l.onColumnResized?.(e,t),onColumnMoved:(e,t)=>l.onColumnMoved?.(e,t)});w.value=t,D.value=t.onBatchInstruction(e=>{A(e)}),t.initialize();let n=C.value;n&&t.setViewport(n.scrollTop,n.scrollLeft,n.clientWidth,n.clientHeight)}return f(()=>{let e=q();T.value=e,Y(e);let t=C.value;if(t&&typeof ResizeObserver<`u`){let e=new ResizeObserver(()=>{w.value?.setViewport(t.scrollTop,t.scrollLeft,t.clientWidth,t.clientHeight)});e.observe(t),p(()=>{e.disconnect()})}p(()=>{D.value&&=(D.value(),null),w.value&&=(w.value.destroy(),null),T.value&&=(T.value.destroy?.(),null)})}),S([()=>l.dataSource,()=>l.rowData],()=>{l.rowData&&l.rowData.length>1e4&&T.value&&console.warn(`[gp-grid] rowData prop changed with ${l.rowData.length} rows — this triggers a full rebuild. Use useGridData() for efficient updates.`);let e=q(),t=T.value;t&&t!==e?(t.destroy?.(),T.value=e,w.value?.setDataSource(e)):t||(T.value=e)}),S(()=>l.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{w.value?.refreshFromTransaction()});p(()=>e())}}},{immediate:!0}),S(()=>k.value.pendingScrollTop,e=>{if(e!==null){let t=C.value;t&&(t.scrollTop=e)}},{flush:`post`}),S(()=>l.highlighting,e=>{w.value?.highlight&&e&&w.value.highlight.updateOptions(e)}),c({core:w}),(t,c)=>(m(),i(`div`,{ref_key:`outerContainerRef`,ref:g,class:u([`gp-grid-container`,{"gp-grid-container--dark":o.darkMode}]),style:{width:`100%`,height:`100%`,position:`relative`,display:`flex`,"flex-direction":`column`},tabindex:`0`,onKeydown:c[0]||=(...e)=>b(H)&&b(H)(...e)},[s(ot,{"header-height":M.value,"scroll-left":O.value,"content-width":b(k).contentWidth,"total-width":V.value,"is-loading":b(k).isLoading,"visible-columns-with-indices":I.value,"column-positions":z.value,"column-widths":B.value,headers:b(k).headers,"sorting-enabled":o.sortingEnabled,"on-header-mouse-down":b(ae),"on-header-resize-mouse-down":b(se),"core-ref":w.value,"outer-container-ref":g.value,"header-renderers":o.headerRenderers??{},"global-header-renderer":o.headerRenderer},null,8,[`header-height`,`scroll-left`,`content-width`,`total-width`,`is-loading`,`visible-columns-with-indices`,`column-positions`,`column-widths`,`headers`,`sorting-enabled`,`on-header-mouse-down`,`on-header-resize-mouse-down`,`core-ref`,`outer-container-ref`,`header-renderers`,`global-header-renderer`]),s(ft,{ref_key:`gridBodyComp`,ref:x,"row-height":o.rowHeight,"total-header-height":M.value,"content-width":b(k).contentWidth,"content-height":b(k).contentHeight,"total-width":V.value,"rows-wrapper-offset":b(k).rowsWrapperOffset,"active-cell":b(k).activeCell,"selection-range":b(k).selectionRange,"editing-cell":b(k).editingCell,"hover-position":b(k).hoverPosition,error:b(k).error,"is-loading":b(k).isLoading,"total-rows":b(k).totalRows,"slots-array":ee.value,"visible-columns-with-indices":I.value,"column-positions":z.value,"column-widths":B.value,"fill-handle-position":b(ue),"drag-state":b(U),"on-scroll":de,"on-wheel":b(le),"wheel-dampening":o.wheelDampening,"on-cell-mouse-down":b(te),"on-cell-double-click":b(ne),"on-cell-mouse-enter":K,"on-cell-mouse-leave":pe,"on-fill-handle-mouse-down":b(re),"core-ref":w.value,"cell-renderers":o.cellRenderers??{},"edit-renderers":o.editRenderers??{},"global-cell-renderer":o.cellRenderer,"global-edit-renderer":o.editRenderer},null,8,`row-height.total-header-height.content-width.content-height.total-width.rows-wrapper-offset.active-cell.selection-range.editing-cell.hover-position.error.is-loading.total-rows.slots-array.visible-columns-with-indices.column-positions.column-widths.fill-handle-position.drag-state.on-wheel.wheel-dampening.on-cell-mouse-down.on-cell-double-click.on-fill-handle-mouse-down.core-ref.cell-renderers.edit-renderers.global-cell-renderer.global-edit-renderer`.split(`.`)),r(` Loading overlay - positioned outside scrollable area to avoid Firefox sticky issues `),b(k).isLoading?(m(),i(`div`,{key:0,style:d({position:`absolute`,top:`${M.value}px`,left:0,right:0,bottom:0,zIndex:50,pointerEvents:`none`})},[c[2]||=a(`div`,{class:`gp-grid-loading-overlay`},null,-1),l.loadingComponent?(m(),n(_(l.loadingComponent),{key:0,"is-loading":!0})):(m(),i(`div`,pt,[...c[1]||=[a(`div`,{class:`gp-grid-loading-spinner`},null,-1)]]))],4)):r(`v-if`,!0),r(` Filter Popup `),b(k).filterPopup?.isOpen&&b(k).filterPopup.column?(m(),n(nt,{key:1,column:b(k).filterPopup.column,"col-index":b(k).filterPopup.colIndex,"container-ref":g.value,"distinct-values":b(k).filterPopup.distinctValues,"current-filter":b(k).filterPopup.currentFilter,onApply:G,onClose:fe},null,8,[`column`,`col-index`,`container-ref`,`distinct-values`,`current-filter`])):r(`v-if`,!0),r(` Column resize line `),b(U).dragType===`column-resize`&&b(U).columnResize?(m(),i(`div`,{key:2,class:`gp-grid-column-resize-line`,style:d({left:`${(z.value[I.value.findIndex(e=>e.originalIndex===b(U).columnResize.colIndex)]??0)+b(U).columnResize.currentWidth-O.value}px`})},null,4)):r(`v-if`,!0),r(` Column move ghost `),b(U).dragType===`column-move`&&b(U).columnMove?(m(),i(e,{key:3},[a(`div`,{class:`gp-grid-column-move-ghost`,style:d({left:`${b(U).columnMove.currentX-b(U).columnMove.ghostWidth/2}px`,top:`${b(U).columnMove.currentY-b(U).columnMove.ghostHeight/2}px`,width:`${b(U).columnMove.ghostWidth}px`,height:`${b(U).columnMove.ghostHeight}px`})},y(P.value[b(U).columnMove.sourceColIndex]?.headerName??P.value[b(U).columnMove.sourceColIndex]?.field??``),5),b(U).columnMove.dropTargetIndex===null?r(`v-if`,!0):(m(),i(`div`,{key:0,class:`gp-grid-column-drop-indicator`,style:d({left:`${(z.value[b(U).columnMove.dropTargetIndex]??0)-O.value}px`,height:`${M.value}px`})},null,4))],64)):r(`v-if`,!0),r(` Row drag ghost (fixed position, follows cursor) `),b(U).dragType===`row-drag`&&b(U).rowDrag?(m(),i(`div`,{key:4,class:`gp-grid-row-drag-ghost`,style:d({left:`${b(U).rowDrag.currentX+12}px`,top:`${b(U).rowDrag.currentY-o.rowHeight/2}px`,width:`${Math.min(300,V.value)}px`,height:`${o.rowHeight}px`})},null,4)):r(`v-if`,!0)],34))}});function ht(e){ce();let n=h(null),r=h(null),{state:i,applyInstructions:a}=J(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>N(s.value.map(e=>e.column),i.value.viewportWidth)),l=t(()=>c.value.positions),u=t(()=>c.value.widths),d=t(()=>oe(l.value)),m=t(()=>Array.from(i.value.slots.values())),{handleCellMouseDown:g,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,dragState:C}=X(r,n,t(()=>e.columns),{activeCell:t(()=>i.value.activeCell),selectionRange:t(()=>i.value.selectionRange),editingCell:t(()=>i.value.editingCell),filterPopupOpen:t(()=>i.value.filterPopup?.isOpen??!1),rowHeight:e.rowHeight,headerHeight:o.value,columnPositions:l,visibleColumnsWithIndices:s,slots:t(()=>i.value.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?L(e.rowData):F([])),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})}}),S(()=>i.value.pendingScrollTop,e=>{if(e!==null){let t=n.value;t&&(t.scrollTop=e)}},{flush:`post`}),S(()=>e.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{r.value?.refresh()});p(()=>e())}}},{immediate:!0}),S(()=>e.highlighting,e=>{r.value?.highlight&&e&&r.value.highlight.updateOptions(e)});let{fillHandlePosition:j}=Z({activeCell:t(()=>i.value.activeCell),selectionRange:t(()=>i.value.selectionRange),slots:t(()=>i.value.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:j,handleScroll:w,handleCellMouseDown:g,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,handleFilterApply:T,handleFilterPopupClose:D,handleCellMouseEnter:O,handleCellMouseLeave:A,dragState:C,isCellSelected:K,isCellActive:U,isCellEditing:W,isCellInFillPreview:G,buildCellClasses:k}}const gt=(e,t)=>{let n=V(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{mt as GpGrid,mt as default,T as GridCore,O as buildCellClasses,A as calculateColumnPositions,P as createClientDataSource,I as createDataSourceFromArray,R as createInitialState,B as createMutableClientDataSource,ee as createServerDataSource,te as findColumnAtX,ie as getCellValue,ae as getTotalWidth,se as gridStyles,H as injectStyles,le as isCellActive,ue as isCellEditing,de as isCellInFillPreview,fe as isCellSelected,pe as isRowVisible,st as renderCell,ct as renderEditCell,rt as renderHeader,Y as useAutoScroll,Z as useFillHandle,Q as useFilterConditions,me as useFilterPopup,ht as useGpGrid,gt as useGridData,J as useGridState,X as useInputHandler};
+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,ref as h,renderList as g,resolveDynamicComponent as _,shallowRef as v,toDisplayString as y,unref as b,vModelText as x,watch as S,withDirectives as C,withModifiers as w}from"vue";import{GridCore as T,GridCore as E,applyInstruction as D,buildCellClasses as O,buildCellClasses as k,calculateColumnPositions as A,calculateFillHandlePosition as j,calculateFilterPopupPosition as M,calculateScaledColumnPositions as N,createClientDataSource as P,createClientDataSource as F,createDataSourceFromArray as I,createDataSourceFromArray as L,createInitialState as R,createInitialState as z,createMutableClientDataSource as B,createMutableClientDataSource as V,createServerDataSource as ee,findColumnAtX as te,formatCellValue as ne,getFieldValue as re,getFieldValue as ie,getTotalWidth as ae,getTotalWidth as oe,gridStyles as se,isCellActive as H,isCellActive as U,isCellEditing as W,isCellEditing as G,isCellInFillPreview as ce,isCellInFillPreview as K,isCellSelected as le,isCellSelected as q,isRowVisible as ue,scrollCellIntoView as de}from"@gp-grid/core";function J(e){let t=v(z(e));return{state:t,applyInstructions:e=>{let n=t.value,r=new Map(n.slots),i=new Map(n.headers),a={pendingScrollTop:null};for(let t of e){let e=D(t,r,i);e&&Object.assign(a,e)}a.slots=r,a.headers=i,t.value={...n,...a}},reset:()=>{t.value=z()}}}function Y(e,t){let n=h(null);function r(r,i){n.value&&clearInterval(n.value),n.value=setInterval(()=>{let n=e.value;n&&(n.scrollTop+=i,n.scrollLeft+=r,t?.())},16)}function i(){n.value&&=(clearInterval(n.value),null)}return p(()=>{i()}),{startAutoScroll:r,stopAutoScroll:i}}function X(e,t,n,r){let{activeCell:i,selectionRange:a,editingCell:o,filterPopupOpen:s,rowHeight:c,headerHeight:l,columnPositions:u,visibleColumnsWithIndices:d,slots:f,rowsWrapperOffset:m}=r,g=h({isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null,columnResize:null,columnMove:null,rowDrag:null}),_=null,v=null,y=null,b=null,x=null,C=e=>{e.preventDefault()},{startAutoScroll:w,stopAutoScroll:T}=Y(t,()=>{let t=e.value;if(_&&t?.input){let e=E();e&&(t.input.handleDragMove(_,e),g.value=t.input.getDragState())}});S([()=>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 E(){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 D(e){return{clientX:e.clientX,clientY:e.clientY,button:e.button,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,pointerId:e.pointerId,pointerType:e.pointerType}}function O(){v?.();let n=t=>{t.preventDefault();let n=e.value,r=E();if(!n?.input||!r)return;let i=D(t);_=i;let a=n.input.handleDragMove(i,r);a&&(a.autoScroll?w(a.autoScroll.dx,a.autoScroll.dy):T(),g.value=n.input.getDragState())},r=()=>{try{let t=e.value;t?.input&&t.input.handleDragEnd()}finally{let i=e.value;g.value=i?.input?i.input.getDragState():{isDragging:!1,dragType:null,fillSourceRange:null,fillTarget:null,columnResize:null,columnMove:null,rowDrag:null},_=null,T(),document.removeEventListener(`touchmove`,C),x!==null&&t.value&&(t.value.style.overflow=x,x=null),document.removeEventListener(`pointermove`,n),document.removeEventListener(`pointerup`,r),document.removeEventListener(`pointercancel`,r),v=null}};document.addEventListener(`pointermove`,n,{passive:!1}),document.addEventListener(`pointerup`,r),document.addEventListener(`pointercancel`,r),v=()=>{document.removeEventListener(`pointermove`,n),document.removeEventListener(`pointerup`,r),document.removeEventListener(`pointercancel`,r)}}function k(){y!==null&&(clearTimeout(y),y=null,e.value?.input?.cancelPendingRowDrag()),b=null}function A(n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleCellMouseDown(n,r,D(i));if(o.focusContainer&&t.value?.focus(),o.startDrag===`selection`)a.input.startSelectionDrag(),g.value=a.input.getDragState(),O();else if(o.startDrag===`row-drag`)g.value=a.input.getDragState(),O();else if(o.startDrag===`row-drag-pending`){k(),b={pointerId:i.pointerId,target:i.currentTarget??i.target};let e=i.clientX,n=i.clientY,r=t=>{let r=t.clientX-e,i=t.clientY-n;(Math.abs(r)>10||Math.abs(i)>10)&&(k(),s())},o=()=>{k(),s()},s=()=>{document.removeEventListener(`pointermove`,r),document.removeEventListener(`pointerup`,o),document.removeEventListener(`pointercancel`,o)};document.addEventListener(`pointermove`,r),document.addEventListener(`pointerup`,o,{once:!0}),document.addEventListener(`pointercancel`,o,{once:!0}),y=setTimeout(()=>{y=null,s();let e=b;if(b=null,a.input.confirmPendingRowDrag()){if(t.value&&(x=t.value.style.overflow,t.value.style.overflow=`hidden`),document.addEventListener(`touchmove`,C,{passive:!1}),e)try{e.target.setPointerCapture(e.pointerId)}catch{}g.value=a.input.getDragState(),O()}},300)}}function j(t,n){let r=e.value;r?.input&&r.input.handleCellDoubleClick(t,n)}function M(t){let n=e.value;if(!n?.input)return;let r=n.input.handleFillHandleMouseDown(i.value,a.value,D(t));if(r.preventDefault&&t.preventDefault(),r.stopPropagation&&t.stopPropagation(),r.startDrag===`fill`){try{t.target.setPointerCapture(t.pointerId)}catch{}g.value=n.input.getDragState(),O()}}function N(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 P(t,n,r,i){let a=e.value;if(!a?.input)return;let o=a.input.handleHeaderMouseDown(t,n,r,D(i));if(o.preventDefault&&i.preventDefault(),o.stopPropagation&&i.stopPropagation(),o.startDrag===`column-move`){try{i.target.setPointerCapture(i.pointerId)}catch{}g.value=a.input.getDragState(),O()}}function F(t,n,r){let i=e.value;if(!i?.input)return;let a=i.input.handleHeaderResizeMouseDown(t,n,D(r));a.preventDefault&&r.preventDefault(),a.stopPropagation&&r.stopPropagation(),a.startDrag===`column-resize`&&(g.value=i.input.getDragState(),O())}function I(n){let r=e.value,a=t.value;if(!r?.input)return;let l=r.input.handleKeyDown({key:n.key,shiftKey:n.shiftKey,ctrlKey:n.ctrlKey,metaKey:n.metaKey},i.value,o.value,s.value);l.preventDefault&&n.preventDefault(),l.scrollToCell&&a&&de(r,a,l.scrollToCell.row,c,f.value,m.value)}function L(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(()=>{v?.(),v=null,k(),T(),document.removeEventListener(`touchmove`,C),x!==null&&t.value&&(t.value.style.overflow=x,x=null)}),{handleCellMouseDown:A,handleCellDoubleClick:j,handleFillHandleMouseDown:M,handleHeaderClick:N,handleHeaderMouseDown:P,handleHeaderResizeMouseDown:F,handleKeyDown:I,handleWheel:L,dragState:g}}const fe=e=>{let{activeCell:n,selectionRange:r,slots:i,columns:a,visibleColumnsWithIndices:o,columnPositions:s,columnWidths:c,rowHeight:l}=e;return{fillHandlePosition:t(()=>j({activeCell:n.value,selectionRange:r.value,slots:i.value,columns:a.value,visibleColumnsWithIndices:o.value,columnPositions:s.value,columnWidths:c.value,rowHeight:l}))}};function Z(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(`pointerdown`,i),a&&document.addEventListener(`keydown`,a)})}),p(()=>{i&&document.removeEventListener(`pointerdown`,i),a&&document.removeEventListener(`keydown`,a)})}function Q(e,t=`and`){let n=h([...e]);return{conditions:n,combination:h(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 pe={class:`gp-grid-filter-content gp-grid-filter-text`},me={key:0,class:`gp-grid-filter-mode-toggle`},he={key:1,class:`gp-grid-filter-info`},ge={class:`gp-grid-filter-actions`},_e=[`disabled`],ve={class:`gp-grid-filter-list`},ye={key:0,class:`gp-grid-filter-option`},be=[`checked`],xe=[`checked`,`onChange`],Se={key:0,class:`gp-grid-filter-combination`},Ce=[`onClick`],we=[`onClick`],Te={class:`gp-grid-filter-row`},Ee=[`value`,`autofocus`,`onChange`],De=[`value`],Oe=[`value`,`onInput`],ke=[`onClick`],Ae=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(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),S=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),w=h(``),T=h(new Set(v.value)),E=h(S.value),{conditions:D,combination:O,updateCondition:k,addCondition:A,removeCondition:j}=Q(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`),M=t(()=>{if(!w.value)return f.value;let e=w.value.toLowerCase();return f.value.filter(t=>t.toLowerCase().includes(e))}),N=t(()=>c.distinctValues.some(e=>e==null||e===``)),P=t(()=>M.value.every(e=>T.value.has(e))&&(!N.value||E.value));function F(){T.value=new Set(M.value),N.value&&(E.value=!0)}function I(){T.value=new Set,E.value=!1}function L(e){let t=new Set(T.value);t.has(e)?t.delete(e):t.add(e),T.value=t}function R(){if(_.value===`values`){if(f.value.every(e=>T.value.has(e))&&(!N.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 z(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,pe,[r(` Mode toggle - only show if not too many values `),p.value?r(`v-if`,!0):(m(),i(`div`,me,[a(`button`,{type:`button`,class:u({active:_.value===`values`}),onClick:n[0]||=e=>_.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:_.value===`condition`}),onClick:n[1]||=e=>_.value=`condition`},` Condition `,2)])),r(` Too many values message `),p.value&&_.value===`condition`?(m(),i(`div`,he,` Too many unique values (`+y(f.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),_.value===`values`?(m(),i(e,{key:2},[r(` Search input `),C(a(`input`,{"onUpdate:modelValue":n[2]||=e=>w.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[x,w.value]]),r(` Select all / Deselect all `),a(`div`,ge,[a(`button`,{type:`button`,disabled:P.value,onClick:F},` Select All `,8,_e),a(`button`,{type:`button`,onClick:I},` Deselect All `)]),r(` Checkbox list `),a(`div`,ve,[r(` Blanks option `),N.value?(m(),i(`label`,ye,[a(`input`,{type:`checkbox`,checked:E.value,onChange:n[3]||=e=>E.value=!E.value},null,40,be),n[5]||=a(`span`,{class:`gp-grid-filter-blank`},`(Blanks)`,-1)])):r(`v-if`,!0),r(` Values `),(m(!0),i(e,null,g(M.value,e=>(m(),i(`label`,{key:e,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:T.value.has(e),onChange:t=>L(e)},null,40,xe),a(`span`,null,y(e),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),_.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,g(b(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`,Se,[a(`button`,{type:`button`,class:u({active:b(D)[n-1]?.nextOperator===`and`}),onClick:e=>b(k)(n-1,{nextOperator:`and`})},` AND `,10,Ce),a(`button`,{type:`button`,class:u({active:b(D)[n-1]?.nextOperator===`or`}),onClick:e=>b(k)(n-1,{nextOperator:`or`})},` OR `,10,we)])):r(`v-if`,!0),a(`div`,Te,[r(` Operator select `),a(`select`,{value:t.operator,autofocus:n===0,onChange:e=>b(k)(n,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(e.label),9,De)),64))],40,Ee),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=>b(k)(n,{value:e.target.value})},null,40,Oe)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(D).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(j)(n)},` × `,8,ke)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[4]||=e=>b(A)(`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:z},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:R},` Apply `)])]))}}),je={class:`gp-grid-filter-content gp-grid-filter-number`},Me={key:0,class:`gp-grid-filter-combination`},Ne=[`onClick`],Pe=[`onClick`],Fe={class:`gp-grid-filter-row`},Ie=[`value`,`onChange`],Le=[`value`],Re=[`value`,`onInput`],ze=[`value`,`onInput`],Be=[`onClick`],Ve=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:_}=Q(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 x(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,je,[(m(!0),i(e,null,g(b(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`,Me,[a(`button`,{type:`button`,class:u({active:b(d)[o-1]?.nextOperator===`and`}),onClick:e=>b(p)(o-1,{nextOperator:`and`})},` AND `,10,Ne),a(`button`,{type:`button`,class:u({active:b(d)[o-1]?.nextOperator===`or`}),onClick:e=>b(p)(o-1,{nextOperator:`or`})},` OR `,10,Pe)])):r(`v-if`,!0),a(`div`,Fe,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>b(p)(o,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(e.label),9,Le)),64))],40,Ie),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=>b(p)(o,{value:e.target.value})},null,40,Re)):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=>b(p)(o,{valueTo:e.target.value})},null,40,ze)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(d).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(_)(o)},` × `,8,Be)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>b(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:x},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:v},` Apply `)])]))}}),He={class:`gp-grid-filter-content gp-grid-filter-date`},Ue={key:0,class:`gp-grid-filter-combination`},We=[`onClick`],Ge=[`onClick`],Ke={class:`gp-grid-filter-row`},qe=[`value`,`onChange`],Je=[`value`],Ye=[`value`,`onInput`],Xe=[`value`,`onInput`],Ze=[`onClick`],Qe=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:_,removeCondition:v}=Q(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 x(){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`,He,[(m(!0),i(e,null,g(b(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`,Ue,[a(`button`,{type:`button`,class:u({active:b(f)[o-1]?.nextOperator===`and`}),onClick:e=>b(h)(o-1,{nextOperator:`and`})},` AND `,10,We),a(`button`,{type:`button`,class:u({active:b(f)[o-1]?.nextOperator===`or`}),onClick:e=>b(h)(o-1,{nextOperator:`or`})},` OR `,10,Ge)])):r(`v-if`,!0),a(`div`,Ke,[r(` Operator select `),a(`select`,{value:t.operator,onChange:e=>b(h)(o,{operator:e.target.value})},[(m(),i(e,null,g(s,e=>a(`option`,{key:e.value,value:e.value},y(e.label),9,Je)),64))],40,qe),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=>b(h)(o,{value:e.target.value})},null,40,Ye)):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=>b(h)(o,{valueTo:e.target.value})},null,40,Xe)],64)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(f).length>1?(m(),i(`button`,{key:2,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(v)(o)},` × `,8,Ze)):r(`v-if`,!0)])]))),128)),r(` Add condition button `),a(`button`,{type:`button`,class:`gp-grid-filter-add`,onClick:n[0]||=e=>b(_)(`=`)},` + 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:x},` Apply `)])]))}}),$e={class:`gp-grid-filter-header`},et=c({__name:`FilterPopup`,props:{column:{},colIndex:{},containerRef:{},distinctValues:{},currentFilter:{}},emits:[`apply`,`close`],setup(o,{emit:c}){let l=o,u=c,g=h(null),_=h(0),v=h(0),b=h(200),x=h(!1);Z(g,{onClose:()=>u(`close`),ignoreSelector:`.gp-grid-filter-icon`});let S=t(()=>l.column.colId??l.column.field);function C(e){u(`apply`,S.value,e),u(`close`)}function w(){u(`close`)}let T=t(()=>l.column.cellDataType);t(()=>T.value===`text`||T.value===`object`);let E=t(()=>T.value===`number`),D=t(()=>T.value===`date`||T.value===`dateString`||T.value===`dateTime`||T.value===`dateTimeString`),O=null,k=()=>{let e=l.containerRef,t=g.value;if(!e||!t)return;let n=e.querySelector(`[data-col-index="${l.colIndex}"]`);if(!n)return;let r=M(n,t);_.value=r.top,v.value=r.left,b.value=r.minWidth,x.value=!0},A=()=>{O===null&&(O=requestAnimationFrame(()=>{O=null,k()}))};f(()=>{requestAnimationFrame(k);let e=l.containerRef;e&&e.addEventListener(`scroll`,A,{passive:!0}),window.addEventListener(`resize`,A)}),p(()=>{let e=l.containerRef;e&&e.removeEventListener(`scroll`,A),window.removeEventListener(`resize`,A),O!==null&&cancelAnimationFrame(O)});let j=t(()=>({position:`fixed`,top:`${_.value}px`,left:`${v.value}px`,minWidth:`${b.value}px`,zIndex:1e4,visibility:x.value?`visible`:`hidden`}));return(t,c)=>(m(),i(`div`,{ref_key:`popupRef`,ref:g,class:`gp-grid-filter-popup`,style:d(j.value)},[a(`div`,$e,` Filter: `+y(o.column.headerName??o.column.field),1),r(` Number filter `),E.value?(m(),n(Ve,{key:0,"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`current-filter`])):D.value?(m(),i(e,{key:1},[r(` Date filter `),s(Qe,{"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`current-filter`])],2112)):(m(),i(e,{key:2},[r(` Text filter (default) `),s(Ae,{"distinct-values":o.distinctValues,"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`distinct-values`,`current-filter`])],2112))],4))}}),$=e=>e==null||e===``?o(``):typeof e==`string`?o(e):e;function tt(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){if(typeof n.headerRenderer==`function`)return $(n.headerRenderer(m));let e=f[n.headerRenderer];if(e)return $(e(m))}if(p)return $(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`:``}`,onPointerdown: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)}const nt=[`data-col-index`,`onPointerdown`],rt=[`onPointerdown`],it=c({__name:`GridHeader`,props:{headerHeight:{},scrollLeft:{},contentWidth:{},totalWidth:{},isLoading:{type:Boolean},visibleColumnsWithIndices:{},columnPositions:{},columnWidths:{},headers:{},sortingEnabled:{type:Boolean},onHeaderMouseDown:{type:Function},onHeaderResizeMouseDown:{type:Function},coreRef:{},outerContainerRef:{},headerRenderers:{},globalHeaderRenderer:{type:Function}},setup(t){let o=t;return(t,s)=>(m(),i(`div`,{class:u([`gp-grid-header`,{"gp-grid-header--loading":o.isLoading}]),style:d({height:`${o.headerHeight}px`})},[a(`div`,{style:d({position:`absolute`,top:0,left:0,transform:`translateX(${-o.scrollLeft}px)`,width:`${Math.max(o.contentWidth,o.totalWidth)}px`,height:`${o.headerHeight}px`})},[(m(!0),i(e,null,g(o.visibleColumnsWithIndices,({column:e,originalIndex:t},a)=>(m(),i(`div`,{key:e.colId??e.field,class:`gp-grid-header-cell`,"data-col-index":t,style:d({left:`${o.columnPositions[a]}px`,width:`${o.columnWidths[a]}px`,height:`${o.headerHeight}px`}),onPointerdown:e=>o.onHeaderMouseDown(t,o.columnWidths[a]??0,o.headerHeight,e)},[(m(),n(_(b(tt)({column:e,colIndex:t,sortDirection:o.headers.get(t)?.sortDirection,sortIndex:o.headers.get(t)?.sortIndex,sortable:e.sortable!==!1&&o.sortingEnabled,filterable:e.filterable!==!1,hasFilter:o.headers.get(t)?.hasFilter??!1,core:o.coreRef,container:o.outerContainerRef,headerRenderers:o.headerRenderers,globalHeaderRenderer:o.globalHeaderRenderer})))),e.resizable===!1?r(`v-if`,!0):(m(),i(`div`,{key:0,class:`gp-grid-header-resize-handle`,onPointerdown:w(e=>o.onHeaderResizeMouseDown(t,o.columnWidths[a]??0,e),[`stop`])},null,40,rt))],44,nt))),128))],4)],6))}});function at(e){let{column:t,rowData:n,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c,cellRenderers:l,globalCellRenderer:u}=e,d=re(n,t.field),f={value:d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer){if(typeof t.cellRenderer==`function`)return $(t.cellRenderer(f));let e=l[t.cellRenderer];if(e)return $(e(f))}return u?$(u(f)):o(ne(d,t.valueFormatter))}function ot(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:ie(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){if(typeof t.editRenderer==`function`)return $(t.editRenderer(d));let e=c[t.editRenderer];if(e)return $(e(d))}return u?$(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()})}const st=[`onPointerdown`,`onDblclick`,`onMouseenter`],ct={key:0,class:`gp-grid-error`},lt={key:1,class:`gp-grid-empty`},ut=c({__name:`GridBody`,props:{rowHeight:{},totalHeaderHeight:{},contentWidth:{},contentHeight:{},totalWidth:{},rowsWrapperOffset:{},activeCell:{},selectionRange:{},editingCell:{},hoverPosition:{},error:{},isLoading:{type:Boolean},totalRows:{},slotsArray:{},visibleColumnsWithIndices:{},columnPositions:{},columnWidths:{},fillHandlePosition:{},dragState:{},onScroll:{type:Function},onWheel:{type:Function},wheelDampening:{},onCellMouseDown:{type:Function},onCellDoubleClick:{type:Function},onCellMouseEnter:{type:Function},onCellMouseLeave:{type:Function},onFillHandleMouseDown:{type:Function},coreRef:{},cellRenderers:{},editRenderers:{},globalCellRenderer:{type:Function},globalEditRenderer:{type:Function}},setup(t,{expose:o}){let s=t,c=h(null),l=e=>[`gp-grid-row`,...s.coreRef?.highlight?.computeRowClasses(e.rowIndex,e.rowData)??[]].filter(Boolean).join(` `),f=(e,t,n,r,i)=>{let a=G(e,t,s.editingCell),o=k(U(e,t,s.activeCell),q(e,t,s.selectionRange),a,K(e,t,s.dragState.dragType===`fill`,s.dragState.fillSourceRange,s.dragState.fillTarget)),c=s.coreRef?.highlight?.computeCombinedCellClasses(e,t,n,r)??[],l=n.rowDrag===!0;return[o,...c,l?`gp-grid-cell--row-drag-handle`:``].filter(Boolean).join(` `)};return o({bodyRef:c}),(t,o)=>(m(),i(`div`,{ref_key:`bodyRef`,ref:c,style:{flex:`1`,overflow:`auto`,position:`relative`},onScroll:o[2]||=(...e)=>s.onScroll&&s.onScroll(...e),onWheel:o[3]||=e=>s.onWheel(e,s.wheelDampening)},[r(` Content sizer - provides scroll range `),a(`div`,{style:d({width:`${Math.max(s.contentWidth,s.totalWidth)}px`,height:`${Math.max(s.contentHeight-s.totalHeaderHeight,0)}px`,position:`relative`,minWidth:`100%`})},[r(` Rows wrapper `),a(`div`,{class:`gp-grid-rows-wrapper`,style:d({width:`${Math.max(s.contentWidth,s.totalWidth)}px`,transform:`translateY(${s.rowsWrapperOffset}px)`})},[r(` Row slots `),(m(!0),i(e,null,g(s.slotsArray.filter(e=>e.rowIndex>=0),t=>(m(),i(`div`,{key:t.slotId,class:u(l(t)),style:d({position:`absolute`,top:0,left:0,transform:`translateY(${t.translateY}px)`,width:`${Math.max(s.contentWidth,s.totalWidth)}px`,height:`${s.rowHeight}px`})},[(m(!0),i(e,null,g(s.visibleColumnsWithIndices,({column:a,originalIndex:c},l)=>(m(),i(`div`,{key:`${t.slotId}-${a.colId??a.field}`,class:u(f(t.rowIndex,c,a,t.rowData,s.hoverPosition)),style:d({position:`absolute`,left:`${s.columnPositions[l]}px`,top:0,width:`${s.columnWidths[l]}px`,height:`${s.rowHeight}px`}),onPointerdown:e=>s.onCellMouseDown(t.rowIndex,c,e),onDblclick:()=>s.onCellDoubleClick(t.rowIndex,c),onMouseenter:()=>s.onCellMouseEnter(t.rowIndex,c),onMouseleave:o[0]||=(...e)=>s.onCellMouseLeave&&s.onCellMouseLeave(...e)},[r(` Edit mode `),b(G)(t.rowIndex,c,s.editingCell)&&s.editingCell?(m(),n(_(b(ot)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:c,initialValue:s.editingCell.initialValue,core:s.coreRef,editRenderers:s.editRenderers,globalEditRenderer:s.globalEditRenderer})),{key:0})):(m(),i(e,{key:1},[r(` View mode `),(m(),n(_(b(at)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:c,isActive:b(U)(t.rowIndex,c,s.activeCell),isSelected:b(q)(t.rowIndex,c,s.selectionRange),isEditing:!1,cellRenderers:s.cellRenderers,globalCellRenderer:s.globalCellRenderer}))))],64))],46,st))),128))],6))),128)),r(` Fill handle `),s.fillHandlePosition&&!s.editingCell?(m(),i(`div`,{key:0,class:`gp-grid-fill-handle`,style:d({top:`${s.fillHandlePosition.top}px`,left:`${s.fillHandlePosition.left}px`}),onPointerdown:o[1]||=(...e)=>s.onFillHandleMouseDown&&s.onFillHandleMouseDown(...e)},null,36)):r(`v-if`,!0),r(` Row drop indicator `),s.dragState.dragType===`row-drag`&&s.dragState.rowDrag?.dropTargetIndex!==null?(m(),i(`div`,{key:1,class:`gp-grid-row-drop-indicator`,style:d({transform:`translateY(${s.dragState.rowDrag.dropIndicatorY}px)`,width:`${Math.max(s.contentWidth,s.totalWidth)}px`})},null,4)):r(`v-if`,!0)],4)],4),r(` Error message `),s.error?(m(),i(`div`,ct,` Error: `+y(s.error),1)):r(`v-if`,!0),r(` Empty state `),!s.isLoading&&!s.error&&s.totalRows===0?(m(),i(`div`,lt,` No data to display `)):r(`v-if`,!0)],544))}}),dt={key:1,class:`gp-grid-loading`},ft=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:{},rowDragEntireRow:{type:Boolean},onRowDragEnd:{},onColumnResized:{},onColumnMoved:{}},setup(o,{expose:c}){let l=o,g=h(null),x=h(null),C=t(()=>x.value?.bodyRef??null),w=v(null),T=v(null),D=v(null),O=h(0),{state:k,applyInstructions:A,reset:j}=J({initialWidth:l.initialWidth,initialHeight:l.initialHeight}),M=t(()=>l.headerHeight??l.rowHeight),P=t(()=>k.value.columns??l.columns),I=t(()=>P.value.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),R=t(()=>N(I.value.map(e=>e.column),k.value.viewportWidth)),z=t(()=>R.value.positions),B=t(()=>R.value.widths),V=t(()=>oe(z.value)),ee=t(()=>Array.from(k.value.slots.values())),{handleCellMouseDown:te,handleCellDoubleClick:ne,handleFillHandleMouseDown:re,handleHeaderClick:ie,handleHeaderMouseDown:ae,handleHeaderResizeMouseDown:se,handleKeyDown:H,handleWheel:U,dragState:W}=X(w,C,P,{activeCell:t(()=>k.value.activeCell),selectionRange:t(()=>k.value.selectionRange),editingCell:t(()=>k.value.editingCell),filterPopupOpen:t(()=>k.value.filterPopup?.isOpen??!1),rowHeight:l.rowHeight,headerHeight:M.value,columnPositions:z,visibleColumnsWithIndices:I,slots:t(()=>k.value.slots),rowsWrapperOffset:t(()=>k.value.rowsWrapperOffset)}),{fillHandlePosition:G}=fe({activeCell:t(()=>k.value.activeCell),selectionRange:t(()=>k.value.selectionRange),slots:t(()=>k.value.slots),columns:P,visibleColumnsWithIndices:I,columnPositions:z,columnWidths:B,rowHeight:l.rowHeight});function ce(){let e=C.value,t=w.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function K(){let e=C.value;e&&(O.value=e.scrollLeft),ce()}function le(e,t){let n=w.value;n&&n.setFilter(e,t)}function q(){let e=w.value;e&&e.closeFilterPopup()}function ue(e,t){w.value?.input.handleCellMouseEnter(e,t)}function de(){w.value?.input.handleCellMouseLeave()}function Y(){return l.dataSource??(l.rowData?L(l.rowData):F([]))}function Z(e){D.value&&=(D.value(),null),w.value&&w.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,getRowId:l.getRowId,onCellValueChanged:l.onCellValueChanged?e=>l.onCellValueChanged?.(e):void 0,rowDragEntireRow:l.rowDragEntireRow??!1,onRowDragEnd:(e,t)=>l.onRowDragEnd?.(e,t),onColumnResized:(e,t)=>l.onColumnResized?.(e,t),onColumnMoved:(e,t)=>l.onColumnMoved?.(e,t)});w.value=t,D.value=t.onBatchInstruction(e=>{A(e)}),t.initialize();let n=C.value;n&&t.setViewport(n.scrollTop,n.scrollLeft,n.clientWidth,n.clientHeight)}return f(()=>{let e=Y();T.value=e,Z(e);let t=C.value;if(t&&typeof ResizeObserver<`u`){let e=new ResizeObserver(()=>{w.value?.setViewport(t.scrollTop,t.scrollLeft,t.clientWidth,t.clientHeight)});e.observe(t),p(()=>{e.disconnect()})}p(()=>{D.value&&=(D.value(),null),w.value&&=(w.value.destroy(),null),T.value&&=(T.value.destroy?.(),null)})}),S([()=>l.dataSource,()=>l.rowData],()=>{l.rowData&&l.rowData.length>1e4&&T.value&&console.warn(`[gp-grid] rowData prop changed with ${l.rowData.length} rows — this triggers a full rebuild. Use useGridData() for efficient updates.`);let e=Y(),t=T.value;t&&t!==e?(t.destroy?.(),T.value=e,w.value?.setDataSource(e)):t||(T.value=e)}),S(()=>l.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{w.value?.refreshFromTransaction()});p(()=>e())}}},{immediate:!0}),S(()=>k.value.pendingScrollTop,e=>{if(e!==null){let t=C.value;t&&(t.scrollTop=e)}},{flush:`post`}),S(()=>l.highlighting,e=>{w.value?.highlight&&e&&w.value.highlight.updateOptions(e)}),c({core:w}),(t,c)=>(m(),i(`div`,{ref_key:`outerContainerRef`,ref:g,class:u([`gp-grid-container`,{"gp-grid-container--dark":o.darkMode}]),style:{width:`100%`,height:`100%`,position:`relative`,display:`flex`,"flex-direction":`column`},tabindex:`0`,onKeydown:c[0]||=(...e)=>b(H)&&b(H)(...e)},[s(it,{"header-height":M.value,"scroll-left":O.value,"content-width":b(k).contentWidth,"total-width":V.value,"is-loading":b(k).isLoading,"visible-columns-with-indices":I.value,"column-positions":z.value,"column-widths":B.value,headers:b(k).headers,"sorting-enabled":o.sortingEnabled,"on-header-mouse-down":b(ae),"on-header-resize-mouse-down":b(se),"core-ref":w.value,"outer-container-ref":g.value,"header-renderers":o.headerRenderers??{},"global-header-renderer":o.headerRenderer},null,8,[`header-height`,`scroll-left`,`content-width`,`total-width`,`is-loading`,`visible-columns-with-indices`,`column-positions`,`column-widths`,`headers`,`sorting-enabled`,`on-header-mouse-down`,`on-header-resize-mouse-down`,`core-ref`,`outer-container-ref`,`header-renderers`,`global-header-renderer`]),s(ut,{ref_key:`gridBodyComp`,ref:x,"row-height":o.rowHeight,"total-header-height":M.value,"content-width":b(k).contentWidth,"content-height":b(k).contentHeight,"total-width":V.value,"rows-wrapper-offset":b(k).rowsWrapperOffset,"active-cell":b(k).activeCell,"selection-range":b(k).selectionRange,"editing-cell":b(k).editingCell,"hover-position":b(k).hoverPosition,error:b(k).error,"is-loading":b(k).isLoading,"total-rows":b(k).totalRows,"slots-array":ee.value,"visible-columns-with-indices":I.value,"column-positions":z.value,"column-widths":B.value,"fill-handle-position":b(G),"drag-state":b(W),"on-scroll":K,"on-wheel":b(U),"wheel-dampening":o.wheelDampening,"on-cell-mouse-down":b(te),"on-cell-double-click":b(ne),"on-cell-mouse-enter":ue,"on-cell-mouse-leave":de,"on-fill-handle-mouse-down":b(re),"core-ref":w.value,"cell-renderers":o.cellRenderers??{},"edit-renderers":o.editRenderers??{},"global-cell-renderer":o.cellRenderer,"global-edit-renderer":o.editRenderer},null,8,`row-height.total-header-height.content-width.content-height.total-width.rows-wrapper-offset.active-cell.selection-range.editing-cell.hover-position.error.is-loading.total-rows.slots-array.visible-columns-with-indices.column-positions.column-widths.fill-handle-position.drag-state.on-wheel.wheel-dampening.on-cell-mouse-down.on-cell-double-click.on-fill-handle-mouse-down.core-ref.cell-renderers.edit-renderers.global-cell-renderer.global-edit-renderer`.split(`.`)),r(` Loading overlay - positioned outside scrollable area to avoid Firefox sticky issues `),b(k).isLoading?(m(),i(`div`,{key:0,style:d({position:`absolute`,top:`${M.value}px`,left:0,right:0,bottom:0,zIndex:50,pointerEvents:`none`})},[c[2]||=a(`div`,{class:`gp-grid-loading-overlay`},null,-1),l.loadingComponent?(m(),n(_(l.loadingComponent),{key:0,"is-loading":!0})):(m(),i(`div`,dt,[...c[1]||=[a(`div`,{class:`gp-grid-loading-spinner`},null,-1)]]))],4)):r(`v-if`,!0),r(` Filter Popup `),b(k).filterPopup?.isOpen&&b(k).filterPopup.column?(m(),n(et,{key:1,column:b(k).filterPopup.column,"col-index":b(k).filterPopup.colIndex,"container-ref":g.value,"distinct-values":b(k).filterPopup.distinctValues,"current-filter":b(k).filterPopup.currentFilter,onApply:le,onClose:q},null,8,[`column`,`col-index`,`container-ref`,`distinct-values`,`current-filter`])):r(`v-if`,!0),r(` Column resize line `),b(W).dragType===`column-resize`&&b(W).columnResize?(m(),i(`div`,{key:2,class:`gp-grid-column-resize-line`,style:d({left:`${(z.value[I.value.findIndex(e=>e.originalIndex===b(W).columnResize.colIndex)]??0)+b(W).columnResize.currentWidth-O.value}px`})},null,4)):r(`v-if`,!0),r(` Column move ghost `),b(W).dragType===`column-move`&&b(W).columnMove?(m(),i(e,{key:3},[a(`div`,{class:`gp-grid-column-move-ghost`,style:d({left:`${b(W).columnMove.currentX-b(W).columnMove.ghostWidth/2}px`,top:`${b(W).columnMove.currentY-b(W).columnMove.ghostHeight/2}px`,width:`${b(W).columnMove.ghostWidth}px`,height:`${b(W).columnMove.ghostHeight}px`})},y(P.value[b(W).columnMove.sourceColIndex]?.headerName??P.value[b(W).columnMove.sourceColIndex]?.field??``),5),b(W).columnMove.dropTargetIndex===null?r(`v-if`,!0):(m(),i(`div`,{key:0,class:`gp-grid-column-drop-indicator`,style:d({left:`${(z.value[b(W).columnMove.dropTargetIndex]??0)-O.value}px`,height:`${M.value}px`})},null,4))],64)):r(`v-if`,!0),r(` Row drag ghost (fixed position, follows cursor) `),b(W).dragType===`row-drag`&&b(W).rowDrag?(m(),i(`div`,{key:4,class:`gp-grid-row-drag-ghost`,style:d({left:`${b(W).rowDrag.currentX+12}px`,top:`${b(W).rowDrag.currentY-o.rowHeight/2}px`,width:`${Math.min(300,V.value)}px`,height:`${o.rowHeight}px`})},null,4)):r(`v-if`,!0)],34))}});function pt(e){let n=h(null),r=h(null),{state:i,applyInstructions:a}=J(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>N(s.value.map(e=>e.column),i.value.viewportWidth)),l=t(()=>c.value.positions),u=t(()=>c.value.widths),d=t(()=>oe(l.value)),m=t(()=>Array.from(i.value.slots.values())),{handleCellMouseDown:g,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,dragState:C}=X(r,n,t(()=>e.columns),{activeCell:t(()=>i.value.activeCell),selectionRange:t(()=>i.value.selectionRange),editingCell:t(()=>i.value.editingCell),filterPopupOpen:t(()=>i.value.filterPopup?.isOpen??!1),rowHeight:e.rowHeight,headerHeight:o.value,columnPositions:l,visibleColumnsWithIndices:s,slots:t(()=>i.value.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?L(e.rowData):F([])),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})}}),S(()=>i.value.pendingScrollTop,e=>{if(e!==null){let t=n.value;t&&(t.scrollTop=e)}},{flush:`post`}),S(()=>e.dataSource,e=>{if(e){let t=e;if(t.subscribe){let e=t.subscribe(()=>{r.value?.refresh()});p(()=>e())}}},{immediate:!0}),S(()=>e.highlighting,e=>{r.value?.highlight&&e&&r.value.highlight.updateOptions(e)});let{fillHandlePosition:j}=fe({activeCell:t(()=>i.value.activeCell),selectionRange:t(()=>i.value.selectionRange),slots:t(()=>i.value.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:j,handleScroll:w,handleCellMouseDown:g,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handleWheel:x,handleFilterApply:T,handleFilterPopupClose:D,handleCellMouseEnter:O,handleCellMouseLeave:A,dragState:C,isCellSelected:q,isCellActive:U,isCellEditing:G,isCellInFillPreview:K,buildCellClasses:k}}const mt=(e,t)=>{let n=V(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{ft as GpGrid,ft as default,T as GridCore,O as buildCellClasses,A as calculateColumnPositions,P as createClientDataSource,I as createDataSourceFromArray,R as createInitialState,B as createMutableClientDataSource,ee as createServerDataSource,te as findColumnAtX,ie as getCellValue,ae as getTotalWidth,se as gridStyles,H as isCellActive,W as isCellEditing,ce as isCellInFillPreview,le as isCellSelected,ue as isRowVisible,at as renderCell,ot as renderEditCell,tt as renderHeader,Y as useAutoScroll,fe as useFillHandle,Q as useFilterConditions,Z as useFilterPopup,pt as useGpGrid,mt as useGridData,J as useGridState,X as useInputHandler};

package/dist/styles.css

@@ -0,0 +1,950 @@
+
+/* =============================================================================
+   GP Grid - CSS Variables for Theming
+   ============================================================================= */
+
+.gp-grid-container {
+  /* Colors - Light Mode (default) */
+  --gp-grid-bg: #ffffff;
+  --gp-grid-bg-alt: #f8f9fa;
+  --gp-grid-text: #212529;
+  --gp-grid-text-secondary: #6c757d;
+  --gp-grid-text-muted: #adb5bd;
+  --gp-grid-border: #dee2e6;
+  --gp-grid-border-light: #e9ecef;
+
+  /* Header */
+  --gp-grid-header-bg: #f1f3f5;
+  --gp-grid-header-text: #212529;
+  --gp-grid-header-z-index: 10;
+
+  /* Selection */
+  --gp-grid-primary: #228be6;
+  --gp-grid-primary-light: #e7f5ff;
+  --gp-grid-primary-border: #74c0fc;
+  --gp-grid-hover: #f1f3f5;
+
+  /* Filter */
+  --gp-grid-filter-bg: #f8f9fa;
+  --gp-grid-input-bg: #ffffff;
+  --gp-grid-input-border: #ced4da;
+
+  /* Error */
+  --gp-grid-error-bg: #fff5f5;
+  --gp-grid-error-text: #c92a2a;
+
+  /* Loading */
+  --gp-grid-loading-bg: rgba(255, 255, 255, 0.95);
+  --gp-grid-loading-text: #495057;
+
+  /* Scrollbar */
+  --gp-grid-scrollbar-track: #f1f3f5;
+  --gp-grid-scrollbar-thumb: #ced4da;
+  --gp-grid-scrollbar-thumb-hover: #adb5bd;
+}
+
+/* Dark Mode */
+.gp-grid-container--dark {
+  --gp-grid-bg: #1a1b1e;
+  --gp-grid-bg-alt: #25262b;
+  --gp-grid-text: #c1c2c5;
+  --gp-grid-text-secondary: #909296;
+  --gp-grid-text-muted: #5c5f66;
+  --gp-grid-border: #373a40;
+  --gp-grid-border-light: #2c2e33;
+
+  /* Header */
+  --gp-grid-header-bg: #25262b;
+  --gp-grid-header-text: #c1c2c5;
+  --gp-grid-header-z-index: 10;
+
+  /* Selection */
+  --gp-grid-primary: #339af0;
+  --gp-grid-primary-light: #1c3d5a;
+  --gp-grid-primary-border: #1c7ed6;
+  --gp-grid-hover: #2c2e33;
+
+  /* Filter */
+  --gp-grid-filter-bg: #25262b;
+  --gp-grid-input-bg: #1a1b1e;
+  --gp-grid-input-border: #373a40;
+
+  /* Error */
+  --gp-grid-error-bg: #2c1a1a;
+  --gp-grid-error-text: #ff6b6b;
+
+  /* Loading */
+  --gp-grid-loading-bg: rgba(26, 27, 30, 0.95);
+  --gp-grid-loading-text: #c1c2c5;
+
+  /* Scrollbar */
+  --gp-grid-scrollbar-track: #25262b;
+  --gp-grid-scrollbar-thumb: #373a40;
+  --gp-grid-scrollbar-thumb-hover: #4a4d52;
+}
+
+
+/* =============================================================================
+   GP Grid - Clean Flat Design
+   ============================================================================= */
+
+/* Grid Container */
+.gp-grid-container {
+  outline: none;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  font-size: 13px;
+  line-height: 1.5;
+  color: var(--gp-grid-text);
+  background-color: var(--gp-grid-bg);
+  border: 1px solid var(--gp-grid-border);
+  border-radius: 6px;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+.gp-grid-container:focus {
+  outline: none;
+  border-color: var(--gp-grid-primary);
+}
+
+
+/* =============================================================================
+   Header
+   ============================================================================= */
+
+.gp-grid-header {
+  position: sticky;
+  top: 0;
+  left: 0;
+  /* z-index set inline (100) to ensure header stays above rows wrapper */
+  background-color: var(--gp-grid-header-bg);
+  border-bottom: 1px solid var(--gp-grid-border);
+  flex-shrink: 0;
+  z-index: 11;
+  overflow: hidden;
+}
+
+.gp-grid-container .gp-grid-header-cell {
+  position: absolute;
+  box-sizing: border-box;
+  border-right: 1px solid var(--gp-grid-border);
+  font-weight: 600;
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--gp-grid-header-text);
+  cursor: pointer;
+  user-select: none;
+  display: flex;
+  align-items: center;
+  padding: 0 12px;
+  background-color: transparent;
+  transition: background-color 0.1s ease;
+  top: 0;
+  background: transparent;
+  touch-action: none;
+}
+
+.gp-grid-container .gp-grid-header-cell:hover {
+  background-color: var(--gp-grid-hover);
+}
+
+.gp-grid-container .gp-grid-header-cell:active {
+  background-color: var(--gp-grid-border-light);
+}
+
+.gp-grid-container .gp-grid-header-text {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--gp-grid-header-text);
+}
+
+/* Header icons container */
+.gp-grid-header-icons {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-left: auto;
+}
+
+/* Stacked sort arrows */
+.gp-grid-sort-arrows {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 2px;
+  margin-left: 6px;
+}
+
+.gp-grid-sort-arrows-stack {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+}
+
+.gp-grid-sort-arrow-up,
+.gp-grid-sort-arrow-down {
+  opacity: 0.35;
+  transition: opacity 0.15s ease, color 0.15s ease;
+  color: var(--gp-grid-text);
+}
+
+.gp-grid-sort-arrow-up.active,
+.gp-grid-sort-arrow-down.active {
+  opacity: 1;
+  color: var(--gp-grid-primary);
+}
+
+.gp-grid-sort-index {
+  font-size: 9px;
+  color: var(--gp-grid-primary);
+  font-weight: 600;
+}
+
+/* Filter icon */
+.gp-grid-filter-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  border-radius: 4px;
+  cursor: pointer;
+  color: var(--gp-grid-text-secondary);
+  transition: background-color 0.15s ease, color 0.15s ease;
+  margin-left: 2px;
+}
+
+.gp-grid-filter-icon:hover {
+  background-color: var(--gp-grid-hover);
+  color: var(--gp-grid-primary);
+}
+
+.gp-grid-filter-icon.active {
+  color: var(--gp-grid-primary);
+  background-color: var(--gp-grid-primary-light);
+}
+
+/* Touch device: larger tap target for filter icon */
+@media (pointer: coarse) and (hover: none) and (max-width: 768px) {
+  .gp-grid-filter-icon {
+    min-width: 44px;
+    min-height: 44px;
+    width: 44px;
+    height: 44px;
+    margin-left: 0;
+  }
+
+  .gp-grid-filter-icon svg {
+    width: 20px;
+    height: 20px;
+  }
+}
+
+/* Disabled header state during data loading */
+.gp-grid-header--loading .gp-grid-header-cell {
+  pointer-events: none;
+  opacity: 0.6;
+  cursor: default;
+}
+
+/* =============================================================================
+   Column Resize
+   ============================================================================= */
+
+.gp-grid-header-resize-handle {
+  position: absolute;
+  right: -3px;
+  top: 0;
+  width: 6px;
+  height: 100%;
+  cursor: col-resize;
+  z-index: 10;
+  touch-action: none;
+}
+
+.gp-grid-header-resize-handle:hover,
+.gp-grid-header-resize-handle--active {
+  background-color: var(--gp-grid-primary);
+  opacity: 0.4;
+}
+
+/* Touch device: wider resize handle hit area */
+@media (pointer: coarse) and (hover: none) and (max-width: 768px) {
+  .gp-grid-header-resize-handle {
+    width: 24px;
+    right: -12px;
+  }
+}
+
+.gp-grid-column-resize-line {
+  position: absolute;
+  top: 0;
+  width: 2px;
+  height: 100%;
+  background-color: var(--gp-grid-primary);
+  z-index: 1000;
+  pointer-events: none;
+}
+
+/* =============================================================================
+   Column Move
+   ============================================================================= */
+
+.gp-grid-column-move-ghost {
+  position: fixed;
+  pointer-events: none;
+  opacity: 0.7;
+  z-index: 2000;
+  background-color: var(--gp-grid-header-bg);
+  border: 2px solid var(--gp-grid-primary);
+  border-radius: 4px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  display: flex;
+  align-items: center;
+  padding: 0 12px;
+  font-weight: 600;
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--gp-grid-header-text);
+  box-sizing: border-box;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.gp-grid-column-drop-indicator {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 3px;
+  height: 100%;
+  background-color: var(--gp-grid-primary);
+  z-index: 1000;
+  pointer-events: none;
+  border-radius: 2px;
+}
+
+
+/* =============================================================================
+   Data Cells
+   ============================================================================= */
+
+/* Rows wrapper - positions rows with small translateY values for large datasets */
+.gp-grid-rows-wrapper {
+  position: absolute;
+  top: 0;
+  left: 0;
+  /* Keep wrapper below the sticky header (z-index: 10) */
+  z-index: 1;
+  will-change: transform; 
+}
+
+.gp-grid-row {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+/* Row background - :where() for zero specificity, so user highlight classes always win */
+:where(.gp-grid-row) {
+  background-color: var(--gp-grid-bg);
+}
+
+/* Structural properties - required for grid layout */
+.gp-grid-cell {
+  position: absolute;
+  top: 0;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+/* Visual properties - :where() for zero specificity, so user highlight classes always win */
+:where(.gp-grid-cell) {
+  padding: 0 12px;
+  cursor: cell;
+  color: var(--gp-grid-text);
+  border-right: 1px solid var(--gp-grid-border-light);
+  border-bottom: 1px solid var(--gp-grid-border-light);
+  background-color: transparent;
+}
+
+/* Active cell (focused) - structural properties stay, visual use :where() */
+.gp-grid-cell--active {
+  outline: none;
+  z-index: 5;
+}
+:where(.gp-grid-cell--active) {
+  background-color: var(--gp-grid-primary-light);
+  border: 2px solid var(--gp-grid-primary);
+  padding: 0 11px;
+}
+
+/* Selected cells (range selection) */
+:where(.gp-grid-cell--selected) {
+  background-color: var(--gp-grid-primary-light);
+}
+
+/* Editing cell - structural properties stay, visual use :where() */
+.gp-grid-cell--editing {
+  z-index: 10;
+}
+:where(.gp-grid-cell--editing) {
+  background-color: var(--gp-grid-bg);
+  border: 2px solid var(--gp-grid-primary);
+  padding: 0;
+}
+
+/* =============================================================================
+   Fill Handle (drag to fill)
+   ============================================================================= */
+
+.gp-grid-fill-handle {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  background-color: var(--gp-grid-primary);
+  border: 2px solid var(--gp-grid-bg);
+  cursor: crosshair;
+  z-index: 11;
+  pointer-events: auto;
+  box-sizing: border-box;
+  border-radius: 1px;
+  touch-action: none;
+}
+
+.gp-grid-fill-handle:hover {
+  transform: scale(1.2);
+}
+
+@media (pointer: coarse) and (hover: none) and (max-width: 768px) {
+  .gp-grid-fill-handle {
+    width: 24px;
+    height: 24px;
+    border-width: 3px;
+    border-radius: 3px;
+  }
+}
+
+/* Fill preview (cells being filled) */
+.gp-grid-cell.gp-grid-cell--fill-preview {
+  background-color: var(--gp-grid-primary-light);
+  border: 1px dashed var(--gp-grid-primary);
+}
+
+/* =============================================================================
+   Edit Input
+   ============================================================================= */
+
+.gp-grid-edit-input {
+  width: 100%;
+  height: 100%;
+  padding: 0 11px;
+  font-family: inherit;
+  font-size: inherit;
+  color: var(--gp-grid-text);
+  border: none;
+  background-color: transparent;
+}
+
+.gp-grid-edit-input:focus {
+  outline: none;
+}
+
+
+/* =============================================================================
+   Loading & Error States
+   ============================================================================= */
+
+/* Sticky wrapper: stays pinned at viewport top, takes no layout space */
+.gp-grid-loading-anchor {
+  position: sticky;
+  top: 0;
+  left: 0;
+  height: 0;
+  z-index: 900;
+  overflow: visible;
+  pointer-events: none;
+}
+
+/* Semi-transparent overlay covering the visible viewport area */
+.gp-grid-loading-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%; 
+  pointer-events: none;
+  background-color: var(--gp-grid-loading-overlay-bg, rgba(255, 255, 255, 0.4));
+}
+
+.gp-grid-container--dark .gp-grid-loading-overlay {
+  background-color: var(--gp-grid-loading-overlay-bg, rgba(0, 0, 0, 0.3));
+}
+
+/* Loading indicator centered in the visible viewport */
+.gp-grid-loading {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  padding: 12px 20px;
+  background-color: var(--gp-grid-loading-bg);
+  color: var(--gp-grid-loading-text);
+  border-radius: 6px;
+  border: 1px solid var(--gp-grid-border);
+  font-weight: 500;
+  font-size: 13px;
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  pointer-events: auto;
+}
+
+.gp-grid-loading-spinner {
+  width: 16px;
+  height: 16px;
+  border: 2px solid var(--gp-grid-border);
+  border-top-color: var(--gp-grid-primary);
+  border-radius: 50%;
+  animation: gp-grid-spin 0.7s linear infinite;
+}
+
+@keyframes gp-grid-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.gp-grid-error {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  padding: 12px 20px;
+  background-color: var(--gp-grid-error-bg);
+  color: var(--gp-grid-error-text);
+  border-radius: 6px;
+  border: 1px solid var(--gp-grid-error-text);
+  font-weight: 500;
+  font-size: 13px;
+  z-index: 1000;
+  max-width: 80%;
+  text-align: center;
+}
+
+/* =============================================================================
+   Empty State
+   ============================================================================= */
+
+.gp-grid-empty {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  color: var(--gp-grid-text-muted);
+  font-size: 14px;
+  text-align: center;
+}
+
+
+/* =============================================================================
+   Scrollbar Styling
+   ============================================================================= */
+
+.gp-grid-container::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+.gp-grid-container::-webkit-scrollbar-track {
+  background-color: var(--gp-grid-scrollbar-track);
+}
+
+.gp-grid-container::-webkit-scrollbar-thumb {
+  background-color: var(--gp-grid-scrollbar-thumb);
+  border-radius: 4px;
+}
+
+.gp-grid-container::-webkit-scrollbar-thumb:hover {
+  background-color: var(--gp-grid-scrollbar-thumb-hover);
+}
+
+.gp-grid-container::-webkit-scrollbar-corner {
+  background-color: var(--gp-grid-scrollbar-track);
+}
+
+
+/* =============================================================================
+   Filter Popup
+   ============================================================================= */
+
+.gp-grid-filter-popup {
+  background-color: var(--gp-grid-bg);
+  border: 1px solid var(--gp-grid-border);
+  border-radius: 6px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  max-height: 400px;
+  display: flex;
+  flex-direction: column;
+  font-size: 13px;
+}
+
+.gp-grid-filter-header {
+  padding: 10px 12px;
+  font-weight: 600;
+  border-bottom: 1px solid var(--gp-grid-border-light);
+  color: var(--gp-grid-header-text);
+}
+
+.gp-grid-filter-content {
+  padding: 10px 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  overflow: hidden;
+}
+
+/* Mode toggle (Values / Condition) */
+.gp-grid-filter-mode-toggle {
+  display: flex;
+  gap: 4px;
+  background-color: var(--gp-grid-bg-alt);
+  border-radius: 4px;
+  padding: 2px;
+}
+
+.gp-grid-filter-mode-toggle button {
+  flex: 1;
+  padding: 6px 10px;
+  font-size: 11px;
+  font-family: inherit;
+  border: none;
+  border-radius: 3px;
+  background-color: transparent;
+  color: var(--gp-grid-text-secondary);
+  cursor: pointer;
+  transition: background-color 0.15s ease, color 0.15s ease;
+}
+
+.gp-grid-filter-mode-toggle button:hover {
+  color: var(--gp-grid-text);
+}
+
+.gp-grid-filter-mode-toggle button.active {
+  background-color: var(--gp-grid-bg);
+  color: var(--gp-grid-text);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+/* Info message for too many values */
+.gp-grid-filter-info {
+  font-size: 11px;
+  color: var(--gp-grid-text-secondary);
+  padding: 6px 8px;
+  background-color: var(--gp-grid-bg-alt);
+  border-radius: 4px;
+}
+
+/* Search input in filter */
+.gp-grid-filter-search {
+  width: 100%;
+  height: 30px;
+  padding: 0 10px;
+  font-family: inherit;
+  font-size: 12px;
+  border: 1px solid var(--gp-grid-input-border);
+  border-radius: 4px;
+  background-color: var(--gp-grid-input-bg);
+  color: var(--gp-grid-text);
+  box-sizing: border-box;
+}
+
+.gp-grid-filter-search:focus {
+  outline: none;
+  border-color: var(--gp-grid-primary);
+}
+
+/* Select All / Deselect All actions */
+.gp-grid-filter-actions {
+  display: flex;
+  gap: 8px;
+}
+
+.gp-grid-filter-actions button {
+  flex: 1;
+  padding: 4px 8px;
+  font-size: 11px;
+  font-family: inherit;
+  border: 1px solid var(--gp-grid-input-border);
+  border-radius: 3px;
+  background-color: var(--gp-grid-bg);
+  color: var(--gp-grid-text);
+  cursor: pointer;
+}
+
+.gp-grid-filter-actions button:hover:not(:disabled) {
+  background-color: var(--gp-grid-hover);
+}
+
+.gp-grid-filter-actions button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* Checkbox list */
+.gp-grid-filter-list {
+  max-height: 200px;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  border: 1px solid var(--gp-grid-border-light);
+  border-radius: 4px;
+  padding: 6px;
+}
+
+.gp-grid-filter-option {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 4px 6px;
+  border-radius: 3px;
+  cursor: pointer;
+}
+
+.gp-grid-filter-option:hover {
+  background-color: var(--gp-grid-hover);
+}
+
+.gp-grid-filter-option input[type="checkbox"] {
+  margin: 0;
+  cursor: pointer;
+}
+
+.gp-grid-filter-option span {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.gp-grid-filter-blank {
+  font-style: italic;
+  color: var(--gp-grid-text-muted);
+}
+
+/* Filter condition row (for number/date filters) */
+.gp-grid-filter-condition {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.gp-grid-filter-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.gp-grid-filter-row select {
+  height: 30px;
+  padding: 0 6px;
+  font-family: inherit;
+  font-size: 12px;
+  border: 1px solid var(--gp-grid-input-border);
+  border-radius: 4px;
+  background-color: var(--gp-grid-input-bg);
+  color: var(--gp-grid-text);
+  cursor: pointer;
+}
+
+.gp-grid-filter-row input[type="number"],
+.gp-grid-filter-row input[type="date"],
+.gp-grid-filter-row input[type="text"],
+.gp-grid-filter-text-input {
+  flex: 1;
+  height: 30px;
+  padding: 0 8px;
+  font-family: inherit;
+  font-size: 12px;
+  border: 1px solid var(--gp-grid-input-border);
+  border-radius: 4px;
+  background-color: var(--gp-grid-input-bg);
+  color: var(--gp-grid-text);
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.gp-grid-filter-row input:focus {
+  outline: none;
+  border-color: var(--gp-grid-primary);
+}
+
+.gp-grid-filter-to {
+  font-size: 11px;
+  color: var(--gp-grid-text-secondary);
+}
+
+.gp-grid-filter-remove {
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  font-size: 16px;
+  line-height: 1;
+  border: none;
+  border-radius: 3px;
+  background-color: transparent;
+  color: var(--gp-grid-text-muted);
+  cursor: pointer;
+}
+
+.gp-grid-filter-remove:hover {
+  background-color: var(--gp-grid-error-bg);
+  color: var(--gp-grid-error-text);
+}
+
+/* AND/OR combination toggle */
+.gp-grid-filter-combination {
+  display: flex;
+  gap: 4px;
+  margin-bottom: 4px;
+}
+
+.gp-grid-filter-combination button {
+  flex: 1;
+  padding: 4px 8px;
+  font-size: 10px;
+  font-family: inherit;
+  border: 1px solid var(--gp-grid-input-border);
+  border-radius: 3px;
+  background-color: var(--gp-grid-bg);
+  color: var(--gp-grid-text-secondary);
+  cursor: pointer;
+}
+
+.gp-grid-filter-combination button.active {
+  background-color: var(--gp-grid-primary);
+  border-color: var(--gp-grid-primary);
+  color: #fff;
+}
+
+/* Add condition button */
+.gp-grid-filter-add {
+  width: 100%;
+  padding: 6px;
+  font-size: 11px;
+  font-family: inherit;
+  border: 1px dashed var(--gp-grid-border);
+  border-radius: 4px;
+  background-color: transparent;
+  color: var(--gp-grid-text-secondary);
+  cursor: pointer;
+}
+
+.gp-grid-filter-add:hover {
+  background-color: var(--gp-grid-hover);
+  border-color: var(--gp-grid-primary);
+  color: var(--gp-grid-primary);
+}
+
+/* Apply / Clear buttons */
+.gp-grid-filter-buttons {
+  display: flex;
+  gap: 8px;
+  padding-top: 8px;
+  border-top: 1px solid var(--gp-grid-border-light);
+}
+
+.gp-grid-filter-btn-clear,
+.gp-grid-filter-btn-apply {
+  flex: 1;
+  padding: 8px 12px;
+  font-size: 12px;
+  font-family: inherit;
+  border-radius: 4px;
+  cursor: pointer;
+}
+
+.gp-grid-filter-btn-clear {
+  border: 1px solid var(--gp-grid-input-border);
+  background-color: var(--gp-grid-bg);
+  color: var(--gp-grid-text);
+}
+
+.gp-grid-filter-btn-clear:hover {
+  background-color: var(--gp-grid-hover);
+}
+
+.gp-grid-filter-btn-apply {
+  border: 1px solid var(--gp-grid-primary);
+  background-color: var(--gp-grid-primary);
+  color: #fff;
+}
+
+.gp-grid-filter-btn-apply:hover {
+  opacity: 0.9;
+}
+
+
+/* =============================================================================
+   Row Drag
+   ============================================================================= */
+
+.gp-grid-cell--row-drag-handle {
+  cursor: grab;
+  touch-action: none;
+}
+
+.gp-grid-cell--row-drag-handle:active {
+  cursor: grabbing;
+}
+
+.gp-grid-row-drag-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  color: var(--gp-grid-text-secondary);
+}
+
+.gp-grid-row-drag-icon svg {
+  width: 16px;
+  height: 16px;
+}
+
+.gp-grid-row-drag-ghost {
+  position: fixed;
+  pointer-events: none;
+  opacity: 0.8;
+  z-index: 2000;
+  background-color: var(--gp-grid-bg, #fff);
+  border: 2px solid var(--gp-grid-primary);
+  border-radius: 4px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  overflow: hidden;
+  box-sizing: border-box;
+}
+
+.gp-grid-row-drop-indicator {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  height: 3px;
+  background-color: var(--gp-grid-primary);
+  z-index: 1000;
+  pointer-events: none;
+  border-radius: 2px;
+}

package/package.json

@@ -1,11 +1,18 @@
 {
   "name": "@gp-grid/vue",
   "description": "A high-performance Vue 3 data grid component with virtual scrolling, cell selection, sorting, filtering, and Excel-like editing",
-  "version": "0.10.2",
+  "version": "0.11.0",
   "license": "Apache-2.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./dist/styles.css": "./dist/styles.css"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/GioPat/gp-grid.git",
@@ -43,14 +50,14 @@
     "nuxt3"
   ],
   "dependencies": {
-    "@gp-grid/core": "0.10.2"
+    "@gp-grid/core": "0.11.0"
   },
   "peerDependencies": {
     "vue": "^3.4.0"
   },
   "devDependencies": {
     "tsdown": "^0.20.3",
-    "typescript": "^5.9.3",
+    "typescript": "~5.9.0",
     "unplugin-vue": "^7.1.0",
     "vue": "^3.5.13",
     "vue-tsc": "~3.2.2"