@revolist/vue3-datagrid 4.28.4 → 4.29.1

package/README.md

@@ -558,3 +558,9 @@ MIT
 
 ---
 
+
+### Component templates across products
+
+See [component templates](./component-templates.md) for `useTemplates`,
+typed content integration with cells, master details,
+Kanban cards, and Gantt bars. Existing `VGridVueTemplate` remains supported.

package/component-templates.md

@@ -0,0 +1,22 @@
+# Framework content templates
+
+`useTemplates()` is a thin wrapper around the existing framework `Template` factory. It returns ordinary template callbacks for cells, master rows, Kanban cards, and Gantt labels. There is no outlet or separate mounting protocol.
+
+```ts
+import { useTemplates } from '@revolist/vue3-datagrid';
+import type { CellTemplateProp } from '@revolist/revogrid';
+
+const templates = useTemplates();
+const content = templates.template<CellTemplateProp>(MyCell, {
+  props: context => ({ item: context.model }),
+  key: context => context.model.id,
+});
+```
+
+Without `props`, the component receives a `context` prop/input. The optional `key` selects record identity when hosts are reused. Supply a stable key for cells whose records may reorder. Mapped props are recomputed when the product invokes the callback. To clear a prop, explicitly pass `undefined`; Vue retains the legacy renderer’s behavior for omitted keys.
+
+Use the returned callback directly as `column.cellTemplate`, `masterRow.template`, `customization.cardContent`, or `gantt.visuals.taskBarContent`. Product progress, resize, dependency, selection and drag controls remain outside the custom content. The legacy Gantt content hook takes precedence. Exports retain the default product representation.
+
+Vue templates retain the existing renderer’s app-level provide/inject behavior. Nearby component providers do not automatically cross the separate render root.
+
+Normal ref teardown releases components when hosts leave the viewport or the grid is removed. Existing `Template` and editor signatures remain available; their default cell prop shape is unchanged.

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import { ColumnDataSchemaModel } from '@revolist/revogrid';
 import { ColumnTemplateProp } from '@revolist/revogrid';
+import { Component } from 'vue';
 import { ComponentInternalInstance } from 'vue';
 import { ComponentPublicInstance } from 'vue';
 import { createVNode } from 'vue';
@@ -26,6 +27,11 @@ declare interface InputProps<T> {
     modelValue?: T;
 }
 
+/** Bind the existing template factory for use on any content surface. */
+export declare function useTemplates(): {
+    template<C>(component: Component, options?: Parameters<typeof VGridVueTemplate<C>>[2]): (h: HyperFunc<VNode>, p: C, addition?: any) => VNode;
+};
+
 declare const VGrid: DefineSetupFnComponent<JSX.RevoGrid & InputProps<string | number | boolean>, {}, {}, JSX.RevoGrid & InputProps<string | number | boolean> & {}, PublicProps>;
 export { VGrid }
 export default VGrid;
@@ -40,7 +46,10 @@ export declare const VGridVueEditor: (vueConstructor: any) => EditorCtr;
 /**
  * Render Vue component in Grid column template.
  */
-export declare const VGridVueTemplate: (vueConstructor: CreateVNodeParameters, customProps?: any) => (h: HyperFunc<VNode>, p: ColumnDataSchemaModel | ColumnTemplateProp, addition?: any) => VNode;
+export declare const VGridVueTemplate: <C = ColumnDataSchemaModel | ColumnTemplateProp>(vueConstructor: CreateVNodeParameters, customProps?: any, options?: {
+    props?: (context: C) => Record<string, any>;
+    key?: (context: C) => string | number;
+}, current?: ComponentInternalInstance) => (h: HyperFunc<VNode>, p: C, addition?: any) => VNode;
 
 /**
  * Convert Vue component to VNode and render it into HTMLElement.
@@ -64,6 +73,8 @@ declare interface VueElement extends Element {
     _vnode?: ComponentPublicInstance<any>;
 }
 
+export declare type VueTemplateOwner = ReturnType<typeof useTemplates>;
+
 
 export * from "@revolist/revogrid";
 export * from "@revolist/revogrid/loader";

package/dist/vue3-datagrid.js

@@ -1,54 +1,54 @@
-import { defineComponent as A, ref as I, getCurrentInstance as g, inject as _, h as O, createVNode as z, render as E, defineAsyncComponent as S } from "vue";
-import { defineCustomElements as D } from "@revolist/revogrid/loader";
+import { defineComponent as I, ref as _, getCurrentInstance as p, inject as O, h as z, createVNode as S, render as R, defineAsyncComponent as D } from "vue";
+import { defineCustomElements as L } from "@revolist/revogrid/loader";
 export * from "@revolist/revogrid/loader";
 export * from "@revolist/revogrid";
-const p = "routerLink", R = "navManager", L = "router", M = "aria", f = /* @__PURE__ */ Symbol(), w = { default: f }, V = (e) => e?.split(" ") || [], G = (e, t, s = []) => [...Array.from(e.value?.classList || []), ...s].filter(
-  (r, i, n) => !t.has(r) && n.indexOf(r) === i
-), N = (e, t, s = [], r, i) => {
-  const n = A((o, { attrs: c, slots: m, emit: $ }) => {
-    o[r];
-    const v = I(), y = new Set(V(c.class)), C = g()?.appContext?.provides[R] ? _(R) : void 0, x = (d) => {
-      const { routerLink: h } = o;
-      if (h !== f)
-        if (C !== void 0) {
+const g = "routerLink", w = "navManager", M = "router", G = "aria", m = /* @__PURE__ */ Symbol(), V = { default: m }, k = (t) => t?.split(" ") || [], N = (t, r, n = []) => [...Array.from(t.value?.classList || []), ...n].filter(
+  (o, a, e) => !r.has(o) && e.indexOf(o) === a
+), U = (t, r, n = [], o, a) => {
+  const e = I((s, { attrs: c, slots: u, emit: v }) => {
+    s[o];
+    const y = _(), C = new Set(k(c.class)), b = p()?.appContext?.provides[w] ? O(w) : void 0, A = (d) => {
+      const { routerLink: h } = s;
+      if (h !== m)
+        if (b !== void 0) {
           d.preventDefault();
           let l = { event: d };
-          for (const u in o) {
-            const a = o[u];
-            o.hasOwnProperty(u) && u.startsWith(L) && a !== f && (l[u] = a);
+          for (const f in s) {
+            const i = s[f];
+            s.hasOwnProperty(f) && f.startsWith(M) && i !== m && (l[f] = i);
           }
-          C.navigate(l);
+          b.navigate(l);
         } else
           console.warn("Tried to navigate, but no router was found. Make sure you have mounted Vue Router.");
     };
     return () => {
-      o[r], V(c.class).forEach((a) => {
-        y.add(a);
+      s[o], k(c.class).forEach((i) => {
+        C.add(i);
       });
-      const d = o.onClick, h = (a) => {
-        d !== void 0 && d(a), a.defaultPrevented || x(a);
+      const d = s.onClick, h = (i) => {
+        d !== void 0 && d(i), i.defaultPrevented || A(i);
       };
       let l = {
-        ref: v,
-        class: G(v, y),
+        ref: y,
+        class: N(y, C),
         onClick: h
       };
-      for (const a in o) {
-        const b = o[a];
-        (o.hasOwnProperty(a) && b !== f || a.startsWith(M)) && (l[a] = b);
+      for (const i in s) {
+        const E = s[i];
+        (s.hasOwnProperty(i) && E !== m || i.startsWith(G)) && (l[i] = E);
       }
-      return o[p] !== f && (l = {
+      return s[g] !== m && (l = {
         ...l,
-        href: o[p]
-      }), O(e, l, m.default && m.default());
+        href: s[g]
+      }), z(t, l, u.default && u.default());
     };
   });
-  return typeof n != "function" && (n.name = e, n.props = {
-    [p]: w
-  }, s.forEach((o) => {
-    n.props[o] = w;
-  })), n;
-}, U = /* @__PURE__ */ N("revo-grid", void 0, [
+  return typeof e != "function" && (e.name = t, e.props = {
+    [g]: V
+  }, n.forEach((s) => {
+    e.props[s] = V;
+  })), e;
+}, F = /* @__PURE__ */ U("revo-grid", void 0, [
   "rowHeaders",
   "frameSize",
   "rowSize",
@@ -135,37 +135,33 @@ const p = "routerLink", R = "navManager", L = "router", M = "aria", f = /* @__PU
   "afterthemechanged",
   "created"
 ]);
-function k(e, t) {
-  t?.appContext && (e.appContext = t.appContext);
+function P(t, r) {
+  r?.appContext && (t.appContext = r.appContext);
 }
-const T = (e, t, s, r, i = null) => {
-  if (!t)
-    return i?.destroy?.(), { vueInstance: null, destroy: () => null, el: null };
-  let n = t._vnode;
-  if (n) {
-    k(n, r);
-    for (const c in s)
-      n.component.props[c] = s[c];
+const x = (t, r, n, o, a = null) => {
+  if (!r)
+    return a?.destroy?.(), { vueInstance: null, destroy: () => null, el: null };
+  let e = r._vnode;
+  if (e) {
+    P(e, o);
+    for (const c in n)
+      e.component.props[c] = n[c];
   } else
-    n = z(e, s), k(n, r), E(n, t);
-  return { vueInstance: n, destroy: () => E(null, t), el: t };
-}, K = (e, t) => {
-  const s = g();
-  return (r, i, n) => {
-    const o = t ? { ...t, ...i } : i;
-    o.addition = n;
-    let c = null;
-    return r("span", {
-      key: `${i.prop}-${i.rowIndex || 0}`,
-      ref: (m) => {
-        c = T(e, m, o, s, c);
-      }
-    });
-  };
+    e = S(t, n), P(e, o), R(e, r);
+  return { vueInstance: e, destroy: () => R(null, r), el: r };
+}, X = (t, r, n, o = p()) => (a, e, s) => {
+  const c = n?.props ? n.props(e) : { ...r, ...e, addition: s };
+  let u = null;
+  return a("span", {
+    key: n?.key?.(e) ?? `${e.prop}-${e.rowIndex || 0}`,
+    ref: (v) => {
+      u = x(t, v, c, o, u);
+    }
+  });
 };
-class F {
-  constructor(t, s, r, i, n) {
-    this.VueEditorConstructor = t, this.column = s, this.save = r, this.close = i, this.vInstance = n, this.element = null;
+class $ {
+  constructor(r, n, o, a, e) {
+    this.VueEditorConstructor = r, this.column = n, this.save = o, this.close = a, this.vInstance = e, this.element = null;
   }
   // optional, called after editor rendered
   componentDidRender() {
@@ -174,46 +170,56 @@ class F {
   disconnectedCallback() {
     this.vueEl?.destroy(), this.vueEl = void 0;
   }
-  render(t) {
-    return t("span", {
+  render(r) {
+    return r("span", {
       key: `${this.column.prop}-${this.editCell?.rowIndex || 0}`,
-      ref: (s) => {
-        const r = {
+      ref: (n) => {
+        const o = {
           ...this.editCell,
           column: this.column,
           save: this.save,
           close: this.close
         };
-        this.vueEl = T(
+        this.vueEl = x(
           this.VueEditorConstructor,
-          s,
-          r,
+          n,
+          o,
           this.vInstance
         );
       }
     });
   }
 }
-const j = (e) => {
-  const t = g();
-  return function(s, r, i) {
-    return new F(
-      e,
-      s,
-      r,
-      i,
-      t
+const j = (t) => {
+  const r = p();
+  return function(n, o, a) {
+    return new $(
+      t,
+      n,
+      o,
+      a,
+      r
     );
   };
 };
-function X(e) {
-  return !!e && (typeof e == "object" || typeof e == "function") && typeof e.then == "function";
+function q() {
+  const t = p();
+  return {
+    template(r, n) {
+      const o = { ...n, props: n?.props ?? ((a) => ({ context: a })) };
+      return X(r, void 0, o, t);
+    }
+  };
+}
+function W(t) {
+  return !!t && (typeof t == "object" || typeof t == "function") && typeof t.then == "function";
 }
-const P = D?.(), q = S(async () => (X(P) && await P, U));
+const T = L?.(), J = D(async () => (W(T) && await T, F));
 export {
-  q as VGrid,
+  J as VGrid,
   j as VGridVueEditor,
-  K as VGridVueTemplate,
-  T as VGridVueTemplateConstructor,
-  q as default
+  X as VGridVueTemplate,
+  x as VGridVueTemplateConstructor,
+  J as default,
+  q as useTemplates
 };

package/dist/vue3-datagrid.umd.cjs

@@ -1 +1 @@
-(function(o,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vue"),require("@revolist/revogrid/loader"),require("@revolist/revogrid")):typeof define=="function"&&define.amd?define(["exports","vue","@revolist/revogrid/loader","@revolist/revogrid"],s):(o=typeof globalThis<"u"?globalThis:o||self,s(o.Vue3Datagrid={},o.Vue,o.RevogridLoader,o.Revogrid))})(this,(function(o,s,g,C){"use strict";const y="routerLink",E="navManager",k="router",S="aria",f=Symbol(),R={default:f},w=e=>e?.split(" ")||[],z=(e,t,a=[])=>[...Array.from(e.value?.classList||[]),...a].filter((i,c,n)=>!t.has(i)&&n.indexOf(i)===c),D=((e,t,a=[],i,c)=>{const n=s.defineComponent((r,{attrs:l,slots:p,emit:x})=>{r[i];const T=s.ref(),I=new Set(w(l.class)),A=s.getCurrentInstance()?.appContext?.provides[E]?s.inject(E):void 0,N=h=>{const{routerLink:v}=r;if(v!==f)if(A!==void 0){h.preventDefault();let u={event:h};for(const m in r){const d=r[m];r.hasOwnProperty(m)&&m.startsWith(k)&&d!==f&&(u[m]=d)}A.navigate(u)}else console.warn("Tried to navigate, but no router was found. Make sure you have mounted Vue Router.")};return()=>{r[i],w(l.class).forEach(d=>{I.add(d)});const h=r.onClick,v=d=>{h!==void 0&&h(d),d.defaultPrevented||N(d)};let u={ref:T,class:z(T,I),onClick:v};for(const d in r){const _=r[d];(r.hasOwnProperty(d)&&_!==f||d.startsWith(S))&&(u[d]=_)}return r[y]!==f&&(u={...u,href:r[y]}),s.h(e,u,p.default&&p.default())}});return typeof n!="function"&&(n.name=e,n.props={[y]:R},a.forEach(r=>{n.props[r]=R})),n})("revo-grid",void 0,["rowHeaders","frameSize","rowSize","colSize","range","readonly","resize","resizeRow","noHorizontalScrollTransfer","canFocus","useClipboard","columns","source","pinnedTopSource","pinnedBottomSource","rowDefinitions","editors","applyOnClose","plugins","columnTypes","theme","themeDefinitions","rowClass","autoSizeColumn","filter","sorting","focusTemplate","canMoveColumns","trimmedRows","exporting","grouping","stretch","additionalData","disableVirtualX","virtualX","disableVirtualY","hideAttribution","jobsBeforeRender","registerVNode","accessible","rtl","canDrag","contentsizechanged","beforeedit","beforerangeedit","afteredit","beforeautofill","beforerange","afterfocus","roworderchanged","beforesorting","beforesourcesortingapply","beforesortingapply","aftersortingapply","rowdragstart","headerclick","beforecellfocus","beforefocuslost","beforesourceset","beforeanysource","aftersourceset","afteranysource","beforecolumnsgather","beforecolumnsset","beforecolumnapplied","aftercolumnsset","beforefilterapply","beforefiltertrimmed","afterfilterapply","beforetrimmed","aftertrimmed","viewportscroll","beforeexport","beforeeditstart","aftercolumnresize","beforerowdefinition","filterconfigchanged","sortingconfigchanged","rowheaderschanged","beforegridrender","aftergridrender","aftergridinit","additionaldatachanged","afterthemechanged","created"]);function V(e,t){t?.appContext&&(e.appContext=t.appContext)}const b=(e,t,a,i,c=null)=>{if(!t)return c?.destroy?.(),{vueInstance:null,destroy:()=>null,el:null};let n=t._vnode;if(n){V(n,i);for(const l in a)n.component.props[l]=a[l]}else n=s.createVNode(e,a),V(n,i),s.render(n,t);return{vueInstance:n,destroy:()=>s.render(null,t),el:t}},M=(e,t)=>{const a=s.getCurrentInstance();return(i,c,n)=>{const r=t?{...t,...c}:c;r.addition=n;let l=null;return i("span",{key:`${c.prop}-${c.rowIndex||0}`,ref:p=>{l=b(e,p,r,a,l)}})}};class j{constructor(t,a,i,c,n){this.VueEditorConstructor=t,this.column=a,this.save=i,this.close=c,this.vInstance=n,this.element=null}componentDidRender(){}disconnectedCallback(){this.vueEl?.destroy(),this.vueEl=void 0}render(t){return t("span",{key:`${this.column.prop}-${this.editCell?.rowIndex||0}`,ref:a=>{const i={...this.editCell,column:this.column,save:this.save,close:this.close};this.vueEl=b(this.VueEditorConstructor,a,i,this.vInstance)}})}}const L=e=>{const t=s.getCurrentInstance();return function(a,i,c){return new j(e,a,i,c,t)}};function G(e){return!!e&&(typeof e=="object"||typeof e=="function")&&typeof e.then=="function"}const P=g.defineCustomElements?.(),O=s.defineAsyncComponent(async()=>(G(P)&&await P,D));o.VGrid=O,o.VGridVueEditor=L,o.VGridVueTemplate=M,o.VGridVueTemplateConstructor=b,o.default=O,Object.keys(g).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(o,e)&&Object.defineProperty(o,e,{enumerable:!0,get:()=>g[e]})}),Object.keys(C).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(o,e)&&Object.defineProperty(o,e,{enumerable:!0,get:()=>C[e]})}),Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(o,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue"),require("@revolist/revogrid/loader"),require("@revolist/revogrid")):typeof define=="function"&&define.amd?define(["exports","vue","@revolist/revogrid/loader","@revolist/revogrid"],a):(o=typeof globalThis<"u"?globalThis:o||self,a(o.Vue3Datagrid={},o.Vue,o.RevogridLoader,o.Revogrid))})(this,(function(o,a,g,C){"use strict";const y="routerLink",E="navManager",z="router",D="aria",f=Symbol(),R={default:f},w=e=>e?.split(" ")||[],M=(e,r,n=[])=>[...Array.from(e.value?.classList||[]),...n].filter((i,d,t)=>!r.has(i)&&t.indexOf(i)===d),j=((e,r,n=[],i,d)=>{const t=a.defineComponent((s,{attrs:l,slots:p,emit:I})=>{s[i];const k=a.ref(),A=new Set(w(l.class)),_=a.getCurrentInstance()?.appContext?.provides[E]?a.inject(E):void 0,F=m=>{const{routerLink:v}=s;if(v!==f)if(_!==void 0){m.preventDefault();let u={event:m};for(const h in s){const c=s[h];s.hasOwnProperty(h)&&h.startsWith(z)&&c!==f&&(u[h]=c)}_.navigate(u)}else console.warn("Tried to navigate, but no router was found. Make sure you have mounted Vue Router.")};return()=>{s[i],w(l.class).forEach(c=>{A.add(c)});const m=s.onClick,v=c=>{m!==void 0&&m(c),c.defaultPrevented||F(c)};let u={ref:k,class:M(k,A),onClick:v};for(const c in s){const S=s[c];(s.hasOwnProperty(c)&&S!==f||c.startsWith(D))&&(u[c]=S)}return s[y]!==f&&(u={...u,href:s[y]}),a.h(e,u,p.default&&p.default())}});return typeof t!="function"&&(t.name=e,t.props={[y]:R},n.forEach(s=>{t.props[s]=R})),t})("revo-grid",void 0,["rowHeaders","frameSize","rowSize","colSize","range","readonly","resize","resizeRow","noHorizontalScrollTransfer","canFocus","useClipboard","columns","source","pinnedTopSource","pinnedBottomSource","rowDefinitions","editors","applyOnClose","plugins","columnTypes","theme","themeDefinitions","rowClass","autoSizeColumn","filter","sorting","focusTemplate","canMoveColumns","trimmedRows","exporting","grouping","stretch","additionalData","disableVirtualX","virtualX","disableVirtualY","hideAttribution","jobsBeforeRender","registerVNode","accessible","rtl","canDrag","contentsizechanged","beforeedit","beforerangeedit","afteredit","beforeautofill","beforerange","afterfocus","roworderchanged","beforesorting","beforesourcesortingapply","beforesortingapply","aftersortingapply","rowdragstart","headerclick","beforecellfocus","beforefocuslost","beforesourceset","beforeanysource","aftersourceset","afteranysource","beforecolumnsgather","beforecolumnsset","beforecolumnapplied","aftercolumnsset","beforefilterapply","beforefiltertrimmed","afterfilterapply","beforetrimmed","aftertrimmed","viewportscroll","beforeexport","beforeeditstart","aftercolumnresize","beforerowdefinition","filterconfigchanged","sortingconfigchanged","rowheaderschanged","beforegridrender","aftergridrender","aftergridinit","additionaldatachanged","afterthemechanged","created"]);function P(e,r){r?.appContext&&(e.appContext=r.appContext)}const b=(e,r,n,i,d=null)=>{if(!r)return d?.destroy?.(),{vueInstance:null,destroy:()=>null,el:null};let t=r._vnode;if(t){P(t,i);for(const l in n)t.component.props[l]=n[l]}else t=a.createVNode(e,n),P(t,i),a.render(t,r);return{vueInstance:t,destroy:()=>a.render(null,r),el:r}},V=(e,r,n,i=a.getCurrentInstance())=>(d,t,s)=>{const l=n?.props?n.props(t):{...r,...t,addition:s};let p=null;return d("span",{key:n?.key?.(t)??`${t.prop}-${t.rowIndex||0}`,ref:I=>{p=b(e,I,l,i,p)}})};class L{constructor(r,n,i,d,t){this.VueEditorConstructor=r,this.column=n,this.save=i,this.close=d,this.vInstance=t,this.element=null}componentDidRender(){}disconnectedCallback(){this.vueEl?.destroy(),this.vueEl=void 0}render(r){return r("span",{key:`${this.column.prop}-${this.editCell?.rowIndex||0}`,ref:n=>{const i={...this.editCell,column:this.column,save:this.save,close:this.close};this.vueEl=b(this.VueEditorConstructor,n,i,this.vInstance)}})}}const G=e=>{const r=a.getCurrentInstance();return function(n,i,d){return new L(e,n,i,d,r)}};function N(){const e=a.getCurrentInstance();return{template(r,n){const i={...n,props:n?.props??(d=>({context:d}))};return V(r,void 0,i,e)}}}function U(e){return!!e&&(typeof e=="object"||typeof e=="function")&&typeof e.then=="function"}const T=g.defineCustomElements?.(),O=a.defineAsyncComponent(async()=>(U(T)&&await T,j));o.VGrid=O,o.VGridVueEditor=G,o.VGridVueTemplate=V,o.VGridVueTemplateConstructor=b,o.default=O,o.useTemplates=N,Object.keys(g).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(o,e)&&Object.defineProperty(o,e,{enumerable:!0,get:()=>g[e]})}),Object.keys(C).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(o,e)&&Object.defineProperty(o,e,{enumerable:!0,get:()=>C[e]})}),Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revolist/vue3-datagrid",
-  "version": "4.28.4",
+  "version": "4.29.1",
   "description": "Vue 3 DataGrid Spreadsheet component with native Vue 3 cell render support",
   "main": "./dist/vue3-datagrid.umd.cjs",
   "module": "./dist/vue3-datagrid.js",
@@ -14,13 +14,15 @@
   },
   "type": "module",
   "files": [
-    "dist"
+    "dist",
+    "component-templates.md"
   ],
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc && vite build",
     "preview": "vite preview",
-    "release": "npm run build && npm publish --public --tag pre-release"
+    "release": "npm run build && npm publish --public --tag pre-release",
+    "test": "vitest run"
   },
   "keywords": [
     "revo-grid",
@@ -65,14 +67,16 @@
   "homepage": "https://github.com/revolist/revogrid#readme",
   "license": "MIT",
   "dependencies": {
-    "@revolist/revogrid": "4.28.4"
+    "@revolist/revogrid": "4.29.1"
   },
   "devDependencies": {
     "@stencil/core": "^4.43.2",
     "@vitejs/plugin-vue": "^6.0.4",
+    "happy-dom": "^20.14.6",
     "typescript": "^5.2.2",
     "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
+    "vitest": "^5.0.5",
     "vue": "^3.4.29",
     "vue-tsc": "^2.0.14"
   },