@gp-grid/vue 0.13.2 → 0.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -35,7 +35,7 @@ A high-performance, feature lean Vue 3 data grid component built to manage grids
35
35
  - **Column Filtering**: Built-in filter row with debounced input
36
36
  - **Cell Editing**: Double-click or press Enter to edit, with custom editor support
37
37
  - **Fill Handle**: Excel-like drag-to-fill for editable cells
38
- - **Keyboard Navigation**: Arrow keys, Tab, Enter, Escape, Ctrl+A, Ctrl+C
38
+ - **Keyboard Navigation**: Arrow keys, Tab, Enter, Escape, Ctrl+A, Ctrl+C, Ctrl+V
39
39
  - **Custom Renderers**: Registry-based cell, edit, and header renderers
40
40
  - **Dark Mode**: Built-in dark theme support
41
41
  - **TypeScript**: Full type safety with exported types
@@ -574,6 +574,7 @@ type VueHeaderRenderer = (
574
574
  | Delete / Backspace | Start editing with empty value |
575
575
  | Ctrl + A | Select all |
576
576
  | Ctrl + C | Copy selection to clipboard |
577
+ | Ctrl + V | Paste clipboard values into selection |
577
578
  | Any character | Start editing with that character |
578
579
 
579
580
  ## Styling
package/dist/index.d.ts CHANGED
@@ -48,7 +48,7 @@ interface GpGridProps<TData = unknown> {
48
48
  headerRenderer?: VueHeaderRenderer;
49
49
  /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
50
50
  getRowId?: (row: TData) => RowId$1;
51
- /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
51
+ /** Called when a cell value is changed via editing, fill drag, or paste. Requires getRowId. */
52
52
  onCellValueChanged?: (event: CellValueChangedEvent$1<TData>) => void;
53
53
  /** Custom loading component to render instead of default spinner */
54
54
  loadingComponent?: Component<{
@@ -76,7 +76,7 @@ type __VLS_Props = {
76
76
  initialWidth?: number; /** Initial viewport height for SSR (pixels). ResizeObserver takes over on client. */
77
77
  initialHeight?: number; /** Row/column/cell highlighting configuration */
78
78
  highlighting?: HighlightingOptions<Row>; /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
79
- getRowId?: (row: Row) => RowId$1; /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
79
+ getRowId?: (row: Row) => RowId$1; /** Called when a cell value is changed via editing, fill drag, or paste. Requires getRowId. */
80
80
  onCellValueChanged?: (event: CellValueChangedEvent$1<Row>) => void; /** Custom loading component to render instead of default spinner */
81
81
  loadingComponent?: Component<{
82
82
  isLoading: boolean;
@@ -113,7 +113,7 @@ interface UseGpGridOptions<TData = unknown> {
113
113
  highlighting?: HighlightingOptions<TData>;
114
114
  /** Function to extract unique ID from row. Required when onCellValueChanged is provided. */
115
115
  getRowId?: (row: TData) => RowId$1;
116
- /** Called when a cell value is changed via editing or fill drag. Requires getRowId. */
116
+ /** Called when a cell value is changed via editing, fill drag, or paste. Requires getRowId. */
117
117
  onCellValueChanged?: (event: CellValueChangedEvent$1<TData>) => void;
118
118
  cellRenderers?: Record<string, VueCellRenderer<TData>>;
119
119
  editRenderers?: Record<string, VueEditRenderer<TData>>;
@@ -141,6 +141,7 @@ interface UseGpGridResult<TData = unknown> {
141
141
  handleFillHandleMouseDown: (e: PointerEvent) => void;
142
142
  handleHeaderClick: (colIndex: number, e: MouseEvent) => void;
143
143
  handleKeyDown: (e: KeyboardEvent) => void;
144
+ handlePaste: (e: ClipboardEvent) => void;
144
145
  handleWheel: (e: WheelEvent, wheelDampening: number) => void;
145
146
  handleFilterApply: (colId: string, filter: ColumnFilterModel$1 | null) => void;
146
147
  handleFilterPopupClose: () => void;
@@ -236,6 +237,7 @@ interface UseInputHandlerResult {
236
237
  handleHeaderMouseDown: (colIndex: number, colWidth: number, colHeight: number, e: PointerEvent) => void;
237
238
  handleHeaderResizeMouseDown: (colIndex: number, colWidth: number, e: PointerEvent) => void;
238
239
  handleKeyDown: (e: KeyboardEvent) => void;
240
+ handlePaste: (e: ClipboardEvent) => void;
239
241
  handleWheel: (e: WheelEvent, wheelDampening: number) => void;
240
242
  dragState: Ref<DragState$1>;
241
243
  }
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,normalizeClass as u,normalizeStyle as d,onMounted as f,onUnmounted as p,openBlock as m,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 ce,isCellActive as H,isCellEditing as U,isCellEditing as W,isCellInFillPreview as le,isCellInFillPreview as G,isCellSelected as ue,isCellSelected as K,isRowVisible as de,scrollCellIntoView as fe}from"@gp-grid/core";function q(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 J(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 Y(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}=J(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&&fe(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 X=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:{},valueFormatter:{type:Function},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 c.valueFormatter?c.valueFormatter(e):Array.isArray(e)?e.join(`, `):String(e??``)}function f(e){return d(e)}let p=t(()=>{let e=new Set,t=[];for(let n of c.distinctValues){if(n==null||n===``||Array.isArray(n)&&n.length===0)continue;let r=d(n);e.has(r)||(e.add(r),t.push({key:r,label:f(n)}))}return t.sort((e,t)=>{let n=parseFloat(e.label),r=parseFloat(t.label);return!isNaN(n)&&!isNaN(r)?n-r:e.label.localeCompare(t.label,void 0,{numeric:!0,sensitivity:`base`})}),t}),_=t(()=>p.value.length>100),v=h(t(()=>{if(!c.currentFilter?.conditions[0])return _.value?`condition`:`values`;let e=c.currentFilter.conditions[0];return e.selectedValues&&e.selectedValues.size>0?`values`:`condition`}).value),S=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].selectedValues??new Set:new Set),w=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),T=h(``),E=h(new Set(S.value)),D=h(w.value),{conditions:O,combination:k,updateCondition:A,addCondition:j,removeCondition:M}=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`),N=t(()=>{if(!T.value)return p.value;let e=T.value.toLowerCase();return p.value.filter(t=>t.label.toLowerCase().includes(e))}),P=t(()=>c.distinctValues.some(e=>e==null||e===``)),F=t(()=>N.value.every(e=>E.value.has(e.key))&&(!P.value||D.value));function I(){E.value=new Set(N.value.map(e=>e.key)),P.value&&(D.value=!0)}function L(){E.value=new Set,D.value=!1}function R(e){let t=new Set(E.value);t.has(e)?t.delete(e):t.add(e),E.value=t}function z(){if(v.value===`values`){if(p.value.every(e=>E.value.has(e.key))&&(!P.value||D.value)){l(`apply`,null);return}l(`apply`,{conditions:[{type:`text`,operator:`equals`,selectedValues:E.value,includeBlank:D.value}],combination:`and`})}else{let e=O.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 B(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,pe,[r(` Mode toggle - only show if not too many values `),_.value?r(`v-if`,!0):(m(),i(`div`,me,[a(`button`,{type:`button`,class:u({active:v.value===`values`}),onClick:n[0]||=e=>v.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:v.value===`condition`}),onClick:n[1]||=e=>v.value=`condition`},` Condition `,2)])),r(` Too many values message `),_.value&&v.value===`condition`?(m(),i(`div`,he,` Too many unique values (`+y(p.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),v.value===`values`?(m(),i(e,{key:2},[r(` Search input `),C(a(`input`,{"onUpdate:modelValue":n[2]||=e=>T.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[x,T.value]]),r(` Select all / Deselect all `),a(`div`,ge,[a(`button`,{type:`button`,disabled:F.value,onClick:I},` Select All `,8,_e),a(`button`,{type:`button`,onClick:L},` Deselect All `)]),r(` Checkbox list `),a(`div`,ve,[r(` Blanks option `),P.value?(m(),i(`label`,ye,[a(`input`,{type:`checkbox`,checked:D.value,onChange:n[3]||=e=>D.value=!D.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(N.value,e=>(m(),i(`label`,{key:e.key,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:E.value.has(e.key),onChange:t=>R(e.key)},null,40,xe),a(`span`,null,y(e.label),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),v.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,g(b(O),(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(O)[n-1]?.nextOperator===`and`}),onClick:e=>b(A)(n-1,{nextOperator:`and`})},` AND `,10,Ce),a(`button`,{type:`button`,class:u({active:b(O)[n-1]?.nextOperator===`or`}),onClick:e=>b(A)(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(A)(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(A)(n,{value:e.target.value})},null,40,Oe)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(O).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(M)(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(j)(`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:B},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:z},` 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,"value-formatter":o.column.valueFormatter,"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`distinct-values`,`value-formatter`,`current-filter`])],2112))],4))}}),tt=e=>e==null||e===``?o(``):typeof e==`string`?o(e):e,$=(e,t)=>typeof e==`function`?tt(e(t)):l(e,t);function nt(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!=null)if(typeof n.headerRenderer==`string`){let e=f[n.headerRenderer];if(e)return $(e,m)}else return $(n.headerRenderer,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 rt=[`data-col-index`,`onPointerdown`],it=[`onPointerdown`],at=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(nt)({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,it))],44,rt))),128))],4)],6))}});function ot(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:t.valueFormatter?t.valueFormatter(d):d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer!=null)if(typeof t.cellRenderer==`string`){let e=l[t.cellRenderer];if(e)return $(e,f)}else return $(t.cellRenderer,f);return u?$(u,f):o(ne(d,t.valueFormatter))}function st(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=ie(n,t.field),f={value:t.valueFormatter?t.valueFormatter(d):d,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!=null)if(typeof t.editRenderer==`string`){let e=c[t.editRenderer];if(e)return $(e,f)}else return $(t.editRenderer,f);return u?$(u,f):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 ct=[`onPointerdown`,`onDblclick`,`onMouseenter`],lt={key:0,class:`gp-grid-error`},ut={key:1,class:`gp-grid-empty`},dt=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:{},globalEditRenderer:{}},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(H(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(st)({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(ot)({column:a,rowData:t.rowData,rowIndex:t.rowIndex,colIndex:c,isActive:b(H)(t.rowIndex,c,s.activeCell),isSelected:b(K)(t.rowIndex,c,s.selectionRange),isEditing:!1,cellRenderers:s.cellRenderers,globalCellRenderer:s.globalCellRenderer}))))],64))],46,ct))),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`,lt,` Error: `+y(s.error),1)):r(`v-if`,!0),r(` Empty state `),!s.isLoading&&!s.error&&s.totalRows===0?(m(),i(`div`,ut,` No data to display `)):r(`v-if`,!0)],544))}}),ft={key:1,class:`gp-grid-loading`},pt=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}=q({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:ce,handleWheel:H,dragState:U}=Y(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:W}=X({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 le(){let e=C.value,t=w.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function G(){let e=C.value;e&&(O.value=e.scrollLeft),le()}function ue(e,t){let n=w.value;n&&n.setFilter(e,t)}function K(){let e=w.value;e&&e.closeFilterPopup()}function de(e,t){w.value?.input.handleCellMouseEnter(e,t)}function fe(){w.value?.input.handleCellMouseLeave()}function J(){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=J();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=J(),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(ce)&&b(ce)(...e)},[s(at,{"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(dt,{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(W),"drag-state":b(U),"on-scroll":G,"on-wheel":b(H),"wheel-dampening":o.wheelDampening,"on-cell-mouse-down":b(te),"on-cell-double-click":b(ne),"on-cell-mouse-enter":de,"on-cell-mouse-leave":fe,"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`,ft,[...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:ue,onClose:K},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 mt(e){let n=h(null),r=h(null),{state:i,applyInstructions:a}=q(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>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}=Y(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),rowsWrapperOffset:t(()=>i.value.rowsWrapperOffset)}),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}=X({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:H,isCellEditing:W,isCellInFillPreview:G,buildCellClasses:k}}const ht=(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{pt as GpGrid,pt 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,ce as isCellActive,U as isCellEditing,le as isCellInFillPreview,ue as isCellSelected,de as isRowVisible,ot as renderCell,st as renderEditCell,nt as renderHeader,J as useAutoScroll,X as useFillHandle,Q as useFilterConditions,Z as useFilterPopup,mt as useGpGrid,ht as useGridData,q as useGridState,Y as useInputHandler};
1
+ import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,normalizeClass as u,normalizeStyle as d,onMounted as f,onUnmounted as p,openBlock as m,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 ce,isCellEditing as W,isCellInFillPreview as le,isCellInFillPreview as G,isCellSelected as ue,isCellSelected as K,isRowVisible as de,scrollCellIntoView as fe}from"@gp-grid/core";function q(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 J(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 Y(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}=J(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&&fe(r,a,l.scrollToCell.row,c,f.value,m.value)}function L(t){let n=e.value;if(n===null||o.value!==null||s.value)return;let r=t.clipboardData?.getData(`text/plain`)??``;n.pasteClipboardText(r)&&t.preventDefault()}function R(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,handlePaste:L,handleWheel:R,dragState:g}}const X=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:{},valueFormatter:{type:Function},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 c.valueFormatter?c.valueFormatter(e):Array.isArray(e)?e.join(`, `):String(e??``)}function f(e){return d(e)}let p=t(()=>{let e=new Set,t=[];for(let n of c.distinctValues){if(n==null||n===``||Array.isArray(n)&&n.length===0)continue;let r=d(n);e.has(r)||(e.add(r),t.push({key:r,label:f(n)}))}return t.sort((e,t)=>{let n=parseFloat(e.label),r=parseFloat(t.label);return!isNaN(n)&&!isNaN(r)?n-r:e.label.localeCompare(t.label,void 0,{numeric:!0,sensitivity:`base`})}),t}),_=t(()=>p.value.length>100),v=h(t(()=>{if(!c.currentFilter?.conditions[0])return _.value?`condition`:`values`;let e=c.currentFilter.conditions[0];return e.selectedValues&&e.selectedValues.size>0?`values`:`condition`}).value),S=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].selectedValues??new Set:new Set),w=t(()=>c.currentFilter?.conditions[0]?c.currentFilter.conditions[0].includeBlank??!0:!0),T=h(``),E=h(new Set(S.value)),D=h(w.value),{conditions:O,combination:k,updateCondition:A,addCondition:j,removeCondition:M}=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`),N=t(()=>{if(!T.value)return p.value;let e=T.value.toLowerCase();return p.value.filter(t=>t.label.toLowerCase().includes(e))}),P=t(()=>c.distinctValues.some(e=>e==null||e===``)),F=t(()=>N.value.every(e=>E.value.has(e.key))&&(!P.value||D.value));function I(){E.value=new Set(N.value.map(e=>e.key)),P.value&&(D.value=!0)}function L(){E.value=new Set,D.value=!1}function R(e){let t=new Set(E.value);t.has(e)?t.delete(e):t.add(e),E.value=t}function z(){if(v.value===`values`){if(p.value.every(e=>E.value.has(e.key))&&(!P.value||D.value)){l(`apply`,null);return}l(`apply`,{conditions:[{type:`text`,operator:`equals`,selectedValues:E.value,includeBlank:D.value}],combination:`and`})}else{let e=O.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 B(){l(`apply`,null)}return(t,n)=>(m(),i(`div`,pe,[r(` Mode toggle - only show if not too many values `),_.value?r(`v-if`,!0):(m(),i(`div`,me,[a(`button`,{type:`button`,class:u({active:v.value===`values`}),onClick:n[0]||=e=>v.value=`values`},` Values `,2),a(`button`,{type:`button`,class:u({active:v.value===`condition`}),onClick:n[1]||=e=>v.value=`condition`},` Condition `,2)])),r(` Too many values message `),_.value&&v.value===`condition`?(m(),i(`div`,he,` Too many unique values (`+y(p.value.length)+`). Use conditions to filter. `,1)):r(`v-if`,!0),r(` VALUES MODE `),v.value===`values`?(m(),i(e,{key:2},[r(` Search input `),C(a(`input`,{"onUpdate:modelValue":n[2]||=e=>T.value=e,class:`gp-grid-filter-search`,type:`text`,placeholder:`Search...`,autofocus:``},null,512),[[x,T.value]]),r(` Select all / Deselect all `),a(`div`,ge,[a(`button`,{type:`button`,disabled:F.value,onClick:I},` Select All `,8,_e),a(`button`,{type:`button`,onClick:L},` Deselect All `)]),r(` Checkbox list `),a(`div`,ve,[r(` Blanks option `),P.value?(m(),i(`label`,ye,[a(`input`,{type:`checkbox`,checked:D.value,onChange:n[3]||=e=>D.value=!D.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(N.value,e=>(m(),i(`label`,{key:e.key,class:`gp-grid-filter-option`},[a(`input`,{type:`checkbox`,checked:E.value.has(e.key),onChange:t=>R(e.key)},null,40,xe),a(`span`,null,y(e.label),1)]))),128))])],64)):r(`v-if`,!0),r(` CONDITION MODE `),v.value===`condition`?(m(),i(e,{key:3},[(m(!0),i(e,null,g(b(O),(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(O)[n-1]?.nextOperator===`and`}),onClick:e=>b(A)(n-1,{nextOperator:`and`})},` AND `,10,Ce),a(`button`,{type:`button`,class:u({active:b(O)[n-1]?.nextOperator===`or`}),onClick:e=>b(A)(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(A)(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(A)(n,{value:e.target.value})},null,40,Oe)):r(`v-if`,!0),r(` Remove button (only if more than one condition) `),b(O).length>1?(m(),i(`button`,{key:1,type:`button`,class:`gp-grid-filter-remove`,onClick:e=>b(M)(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(j)(`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:B},` Clear `),a(`button`,{type:`button`,class:`gp-grid-filter-btn-apply`,onClick:z},` 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,"value-formatter":o.column.valueFormatter,"current-filter":o.currentFilter,onApply:C,onClose:w},null,8,[`distinct-values`,`value-formatter`,`current-filter`])],2112))],4))}}),tt=e=>e==null||e===``?o(``):typeof e==`string`?o(e):e,$=(e,t)=>typeof e==`function`?tt(e(t)):l(e,t);function nt(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!=null)if(typeof n.headerRenderer==`string`){let e=f[n.headerRenderer];if(e)return $(e,m)}else return $(n.headerRenderer,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 rt=[`data-col-index`,`onPointerdown`],it=[`onPointerdown`],at=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(nt)({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,it))],44,rt))),128))],4)],6))}});function ot(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:t.valueFormatter?t.valueFormatter(d):d,rowData:n,column:t,rowIndex:r,colIndex:i,isActive:a,isSelected:s,isEditing:c};if(t.cellRenderer!=null)if(typeof t.cellRenderer==`string`){let e=l[t.cellRenderer];if(e)return $(e,f)}else return $(t.cellRenderer,f);return u?$(u,f):o(ne(d,t.valueFormatter))}function st(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=ie(n,t.field),f={value:t.valueFormatter?t.valueFormatter(d):d,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!=null)if(typeof t.editRenderer==`string`){let e=c[t.editRenderer];if(e)return $(e,f)}else return $(t.editRenderer,f);return u?$(u,f):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 ct=[`onPointerdown`,`onDblclick`,`onMouseenter`],lt={key:0,class:`gp-grid-error`},ut={key:1,class:`gp-grid-empty`},dt=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:{},globalEditRenderer:{}},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(st)({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(ot)({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,ct))),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`,lt,` Error: `+y(s.error),1)):r(`v-if`,!0),r(` Empty state `),!s.isLoading&&!s.error&&s.totalRows===0?(m(),i(`div`,ut,` No data to display `)):r(`v-if`,!0)],544))}}),ft={key:1,class:`gp-grid-loading`},pt=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}=q({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,handlePaste:U,handleWheel:ce,dragState:W}=Y(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:le}=X({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 G(){let e=C.value,t=w.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)}function ue(){let e=C.value;e&&(O.value=e.scrollLeft),G()}function K(e,t){let n=w.value;n&&n.setFilter(e,t)}function de(){let e=w.value;e&&e.closeFilterPopup()}function fe(e,t){w.value?.input.handleCellMouseEnter(e,t)}function J(){w.value?.input.handleCellMouseLeave()}function Z(){return l.dataSource??(l.rowData?L(l.rowData):F([]))}function Q(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=Z();T.value=e,Q(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=Z(),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),onPaste:c[1]||=(...e)=>b(U)&&b(U)(...e)},[s(at,{"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(dt,{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(le),"drag-state":b(W),"on-scroll":ue,"on-wheel":b(ce),"wheel-dampening":o.wheelDampening,"on-cell-mouse-down":b(te),"on-cell-double-click":b(ne),"on-cell-mouse-enter":fe,"on-cell-mouse-leave":J,"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[3]||=a(`div`,{class:`gp-grid-loading-overlay`},null,-1),l.loadingComponent?(m(),n(_(l.loadingComponent),{key:0,"is-loading":!0})):(m(),i(`div`,ft,[...c[2]||=[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:K,onClose:de},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 mt(e){let n=h(null),r=h(null),{state:i,applyInstructions:a}=q(),o=t(()=>e.headerHeight??e.rowHeight),s=t(()=>e.columns.map((e,t)=>({column:e,originalIndex:t})).filter(({column:e})=>!e.hidden)),c=t(()=>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,handlePaste:x,handleWheel:C,dragState:w}=Y(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),rowsWrapperOffset:t(()=>i.value.rowsWrapperOffset)}),T=()=>{let e=n.value,t=r.value;!e||!t||t.setViewport(e.scrollTop,e.scrollLeft,e.clientWidth,e.clientHeight)},D=(e,t)=>{let n=r.value;n&&n.setFilter(e,t)},O=()=>{let e=r.value;e&&e.closeFilterPopup()},A=(e,t)=>{r.value?.input.handleCellMouseEnter(e,t)},j=()=>{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:M}=X({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:M,handleScroll:T,handleCellMouseDown:g,handleCellDoubleClick:_,handleFillHandleMouseDown:v,handleHeaderClick:y,handleKeyDown:b,handlePaste:x,handleWheel:C,handleFilterApply:D,handleFilterPopupClose:O,handleCellMouseEnter:A,handleCellMouseLeave:j,dragState:w,isCellSelected:K,isCellActive:U,isCellEditing:W,isCellInFillPreview:G,buildCellClasses:k}}const ht=(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{pt as GpGrid,pt 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,ce as isCellEditing,le as isCellInFillPreview,ue as isCellSelected,de as isRowVisible,ot as renderCell,st as renderEditCell,nt as renderHeader,J as useAutoScroll,X as useFillHandle,Q as useFilterConditions,Z as useFilterPopup,mt as useGpGrid,ht as useGridData,q as useGridState,Y as useInputHandler};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@gp-grid/vue",
3
3
  "description": "A high-performance Vue 3 data grid component with virtual scrolling, cell selection, sorting, filtering, and Excel-like editing",
4
- "version": "0.13.2",
4
+ "version": "0.14.0",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
@@ -50,7 +50,7 @@
50
50
  "nuxt3"
51
51
  ],
52
52
  "dependencies": {
53
- "@gp-grid/core": "0.13.2"
53
+ "@gp-grid/core": "0.14.0"
54
54
  },
55
55
  "peerDependencies": {
56
56
  "vue": "^3.4.0"