@revolist/vue3-datagrid 3.2.17 → 3.6.16

package/.webpack/webpack.dev.js

@@ -33,7 +33,7 @@ module.exports = {
     extensions: [ '.tsx', '.ts', '.js', '.vue' ],
     alias: {
       'vue$': 'vue/dist/vue.esm-bundler.js',
-      '@revolist/vue-datagrid': path.resolve(__dirname, '../dist/vgrid')
+      '@revolist/vue-datagrid': path.resolve(__dirname, '../src/vgrid')
     }
   },
   module: {

package/dist/revogrid.d.ts

@@ -1,50 +1,14 @@
 import type { JSX } from '@revolist/revogrid';
-import { RevoGrid as RevoGridComponent } from '@revolist/revogrid/custom-element/';
-export { RevoGridComponent };
-export declare const RevoGrid: import("vue").DefineComponent<JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
-export declare const RevogrClipboard: import("vue").DefineComponent<JSX.RevogrClipboard & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrClipboard & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
-export declare const RevogrData: import("vue").DefineComponent<JSX.RevogrData & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrData & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    rowSelectionStore?: any;
-    viewportRow?: any;
-    viewportCol?: any;
-    dimensionRow?: any;
-    colData?: any;
-    dataStore?: any;
-}>;
-export declare const RevogrEdit: import("vue").DefineComponent<JSX.RevogrEdit & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrEdit & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
-export declare const RevogrFilterPanel: import("vue").DefineComponent<JSX.RevogrFilterPanel & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrFilterPanel & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
-export declare const RevogrFocus: import("vue").DefineComponent<JSX.RevogrFocus & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrFocus & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    dimensionRow: any;
-    colData: any;
-    dataStore: any;
-    selectionStore: any;
-    dimensionCol: any;
-}>;
-export declare const RevogrHeader: import("vue").DefineComponent<JSX.RevogrHeader & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrHeader & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    viewportCol?: any;
-    selectionStore?: any;
-    dimensionCol?: any;
-}>;
-export declare const RevogrOrderEditor: import("vue").DefineComponent<JSX.RevogrOrderEditor & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrOrderEditor & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    dimensionRow?: any;
-    dataStore?: any;
-    dimensionCol?: any;
-}>;
-export declare const RevogrOverlaySelection: import("vue").DefineComponent<JSX.RevogrOverlaySelection & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrOverlaySelection & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    dimensionRow?: any;
-    colData?: any;
-    dataStore?: any;
-    selectionStore?: any;
-    dimensionCol?: any;
-}>;
-export declare const RevogrRowHeaders: import("vue").DefineComponent<JSX.RevogrRowHeaders & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrRowHeaders & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
-export declare const RevogrScrollVirtual: import("vue").DefineComponent<JSX.RevogrScrollVirtual & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrScrollVirtual & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    viewportStore?: any;
-    dimensionStore?: any;
-}>;
-export declare const RevogrTempRange: import("vue").DefineComponent<JSX.RevogrTempRange & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrTempRange & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
-    dimensionRow?: any;
-    selectionStore?: any;
-    dimensionCol?: any;
-}>;
-export declare const RevogrViewportScroll: import("vue").DefineComponent<JSX.RevogrViewportScroll & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.RevogrViewportScroll & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
+export declare const RevoGrid: (props: JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrClipboard: (props: JSX.RevogrClipboard & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrData: (props: JSX.RevogrData & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrEdit: (props: JSX.RevogrEdit & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrFilterPanel: (props: JSX.RevogrFilterPanel & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrFocus: (props: JSX.RevogrFocus & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrHeader: (props: JSX.RevogrHeader & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrOrderEditor: (props: JSX.RevogrOrderEditor & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrOverlaySelection: (props: JSX.RevogrOverlaySelection & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrRowHeaders: (props: JSX.RevogrRowHeaders & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrScrollVirtual: (props: JSX.RevogrScrollVirtual & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrTempRange: (props: JSX.RevogrTempRange & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
+export declare const RevogrViewportScroll: (props: JSX.RevogrViewportScroll & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;

package/dist/vgrid.d.ts

@@ -1,10 +1,10 @@
 import { App } from "vue";
-export declare const VGrid: import("vue").DefineComponent<import("@revolist/revogrid/dist/types/components").JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("@revolist/revogrid/dist/types/components").JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
+export declare const VGrid: (props: import("@revolist/revogrid/dist/types/components").JSX.RevoGrid & import("./vue-component-lib/utils").InputProps<string | number | boolean> & {}) => any;
 export declare const VGridPlugin: {
     install(app: App): void;
 };
 export declare const VGridVueTemplate: (vueConstructor: any) => (h: import("@revolist/revogrid/dist/types/interfaces").RevoGrid.HyperFunc<import("@revolist/revogrid/dist/types/stencil-public-runtime").VNode>, p: import("@revolist/revogrid/dist/types/interfaces").RevoGrid.ColumnDataSchemaModel) => JSX.Element;
-export declare const VGridVueTemplateConstructor: (vueConstructor: import("vue").DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>, el: import("./vue-template").VueElement, p: Record<string, any>, appContext: any) => {
+export declare const VGridVueTemplateConstructor: (vueConstructor: import("vue").DefineComponent, el: import("./vue-template").VueElement, p: Record<string, any>, appContext: any) => {
     vueInstance: any;
     destroy: () => void;
     el: import("./vue-template").VueElement;

package/dist/vgrid.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("vue"),require("@revolist/revogrid/custom-element/")):"function"==typeof define&&define.amd?define("VGrid",["vue","@revolist/revogrid/custom-element/"],t):"object"==typeof exports?exports.VGrid=t(require("vue"),require("@revolist/revogrid/custom-element/")):e.VGrid=t(e.vue,e["@revolist/revogrid/custom-element/"])}(self,((e,t)=>(()=>{"use strict";var r={863:e=>{e.exports=t},748:t=>{t.exports=e}},o={};function n(e){var t=o[e];if(void 0!==t)return t.exports;var s=o[e]={exports:{}};return r[e](s,s.exports,n),s.exports}n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{n.r(s),n.d(s,{VGrid:()=>f,VGridPlugin:()=>v,VGridVueEditor:()=>g,VGridVueTemplate:()=>m,VGridVueTemplateConstructor:()=>b,default:()=>h});var e=n(748);const t="update:modelValue",r=Symbol(),o={default:r},i=e=>(null==e?void 0:e.split(" "))||[],l=(e,t,r=[])=>{var o;return[...Array.from((null===(o=e.value)||void 0===o?void 0:o.classList)||[]),...r].filter(((e,r,o)=>!t.has(e)&&o.indexOf(e)===r))},a=(n,s,a=[],u,d,c)=>{void 0!==s&&s();const f=(0,e.defineComponent)(((o,{attrs:s,slots:a,emit:f})=>{var p;let v=o[u];const m=(0,e.ref)(),b=new Set(i(s.class)),g=e=>{e.el&&(Array.isArray(d)?d:[d]).forEach((r=>{e.el.addEventListener(r.toLowerCase(),(e=>{v=(null==e?void 0:e.target)[u],f(t,v),c&&f(c,e)}))}))},h=(0,e.getCurrentInstance)(),y=(null===(p=null==h?void 0:h.appContext)||void 0===p?void 0:p.provides.navManager)?(0,e.inject)("navManager"):void 0;return()=>{v=o[u],i(s.class).forEach((e=>{b.add(e)}));const t=o.onClick;let c={ref:m,class:l(m,b),onClick:e=>{void 0!==t&&t(e),e.defaultPrevented||(e=>{const{routerLink:t}=o;if(t!==r)if(void 0!==y){let t={event:e};for(const e in o){const n=o[e];o.hasOwnProperty(e)&&e.startsWith("router")&&n!==r&&(t[e]=n)}y.navigate(t)}else console.warn("Tried to navigate, but no router was found. Make sure you have mounted Vue Router.")})(e)},onVnodeBeforeMount:d?g:void 0};for(const e in o){const t=o[e];o.hasOwnProperty(e)&&t!==r&&(c[e]=t)}return u&&(o.modelValue!==r?c=Object.assign(Object.assign({},c),{[u]:o.modelValue}):v!==r&&(c=Object.assign(Object.assign({},c),{[u]:v}))),(0,e.h)(n,c,a.default&&a.default())}}));return f.displayName=n,f.props={routerLink:o},a.forEach((e=>{f.props[e]=o})),u&&(f.props.modelValue=o,f.emits=[t,c]),f};n(863);const u=a("revo-grid",void 0,["rowHeaders","frameSize","rowSize","colSize","range","readonly","resize","canFocus","useClipboard","columns","source","pinnedTopSource","pinnedBottomSource","rowDefinitions","editors","plugins","columnTypes","theme","rowClass","autoSizeColumn","filter","canMoveColumns","trimmedRows","exporting","grouping","stretch","beforeedit","beforerangeedit","afteredit","beforeautofill","beforeaange","afterfocus","roworderchanged","beforesourcesortingapply","beforesortingapply","beforesorting","rowdragstart","headerclick","beforecellfocus","beforefocuslost","beforesourceset","aftersourceset","beforecolumnsset","beforecolumnapplied","aftercolumnsset","beforefilterapply","beforefiltertrimmed","beforetrimmed","aftertrimmed","viewportscroll","beforeexport","beforeeditstart","aftercolumnresize"]),d=(t,r,o,n)=>{if(!r)return null;let s=r._vnode;if(s){n&&(s.appContext=n);for(const e in o)s.component.props[e]=o[e]}else s=(0,e.createVNode)(t,o),n&&(s.appContext=n),(0,e.render)(s,r);return{vueInstance:s,destroy:()=>(0,e.render)(null,r),el:r}};class c{constructor(e,t,r,o,n){this.VueEditorConstructor=e,this.column=t,this.save=r,this.close=o,this.appContext=n,this.element=null,this.editCell=null}componentDidRender(){}disconnectedCallback(){this.vueEl&&(this.vueEl.destroy(),this.vueEl=void 0)}render(e){return e("span",{ref:e=>{this.vueEl=d(this.VueEditorConstructor,e,Object.assign(Object.assign({},this.editCell),{column:this.column,save:this.save,close:this.close}),this.appContext)}})}}const f=u;let p=!1;const v={install(e){p||(p=!0,e.component("vue-data-grid",f))}},m=t=>{const r=(0,e.getCurrentInstance)(),o=null==r?void 0:r.appContext;return(e,r)=>e("span",{ref:e=>d(t,e,r,o)})},b=d,g=t=>{const r=(0,e.getCurrentInstance)(),o=null==r?void 0:r.appContext;return function(e,r,n){return new c(t,e,r,n,o)}},h=u})(),s})()));
+!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r(require("vue"),require("@revolist/revogrid/loader")):"function"==typeof define&&define.amd?define("VGrid",["vue","@revolist/revogrid/loader"],r):"object"==typeof exports?exports.VGrid=r(require("vue"),require("@revolist/revogrid/loader")):e.VGrid=r(e.vue,e["@revolist/revogrid/loader"])}(self,((e,r)=>(()=>{"use strict";var t,o,n,s,a={941:(e,r,t)=>{t.a(e,(async(e,o)=>{try{t.d(r,{d_:()=>e});var n=t(638),s=t(829);await(0,s.defineCustomElements)();const e=(0,n.j)("revo-grid",void 0,["rowHeaders","frameSize","rowSize","colSize","range","readonly","resize","canFocus","useClipboard","columns","source","pinnedTopSource","pinnedBottomSource","rowDefinitions","editors","plugins","columnTypes","theme","rowClass","autoSizeColumn","filter","canMoveColumns","trimmedRows","exporting","grouping","stretch","beforeedit","beforerangeedit","afteredit","beforeautofill","beforeaange","afterfocus","roworderchanged","beforesourcesortingapply","beforesortingapply","beforesorting","rowdragstart","headerclick","beforecellfocus","beforefocuslost","beforesourceset","aftersourceset","beforecolumnsset","beforecolumnapplied","aftercolumnsset","beforefilterapply","beforefiltertrimmed","beforetrimmed","aftertrimmed","viewportscroll","beforeexport","beforeeditstart","aftercolumnresize"]);o()}catch(e){o(e)}}),1)},846:(e,r,t)=>{t.a(e,(async(e,o)=>{try{t.r(r),t.d(r,{VGrid:()=>l,VGridPlugin:()=>d,VGridVueEditor:()=>p,VGridVueTemplate:()=>c,VGridVueTemplateConstructor:()=>f,default:()=>v});var n=t(941),s=t(258),a=t(210),i=e([n]);const l=(n=(i.then?(await i)():i)[0]).d_;let u=!1;const d={install(e){u||(u=!0,e.component("vue-data-grid",l))}},c=s.Z,f=s.k,p=a.Z,v=l;o()}catch(e){o(e)}}))},638:(e,r,t)=>{t.d(r,{j:()=>c});var o=t(748);const n="update:modelValue",s="modelValue",a="navManager",i=Symbol(),l={default:i},u=e=>(null==e?void 0:e.split(" "))||[],d=(e,r,t=[])=>{var o;return[...Array.from((null===(o=e.value)||void 0===o?void 0:o.classList)||[]),...t].filter(((e,t,o)=>!r.has(e)&&o.indexOf(e)===t))},c=(e,r,t=[],c,f,p)=>{void 0!==r&&r();const v=(0,o.defineComponent)(((r,{attrs:t,slots:l,emit:v})=>{var m;let b=r[c];const h=(0,o.ref)(),y=new Set(u(t.class)),g=e=>{e.el&&(Array.isArray(f)?f:[f]).forEach((r=>{e.el.addEventListener(r.toLowerCase(),(e=>{b=(null==e?void 0:e.target)[c],v(n,b),p&&v(p,e)}))}))},w=(0,o.getCurrentInstance)(),C=(null===(m=null==w?void 0:w.appContext)||void 0===m?void 0:m.provides[a])?(0,o.inject)(a):void 0;return()=>{b=r[c],u(t.class).forEach((e=>{y.add(e)}));const n=r.onClick;let a={ref:h,class:d(h,y),onClick:e=>{void 0!==n&&n(e),e.defaultPrevented||(e=>{const{routerLink:t}=r;if(t!==i)if(void 0!==C){let t={event:e};for(const e in r){const o=r[e];r.hasOwnProperty(e)&&e.startsWith("router")&&o!==i&&(t[e]=o)}C.navigate(t)}else console.warn("Tried to navigate, but no router was found. Make sure you have mounted Vue Router.")})(e)},onVnodeBeforeMount:f?g:void 0};for(const e in r){const t=r[e];(r.hasOwnProperty(e)&&t!==i||e.startsWith("aria"))&&(a[e]=t)}return c&&(r[s]!==i?a=Object.assign(Object.assign({},a),{[c]:r[s]}):b!==i&&(a=Object.assign(Object.assign({},a),{[c]:b}))),(0,o.h)(e,a,l.default&&l.default())}}));return"function"!=typeof v&&(v.name=e,v.props={routerLink:l},t.forEach((e=>{v.props[e]=l})),c&&(v.props[s]=l,v.emits=[n,p])),v}},210:(e,r,t)=>{t.d(r,{Z:()=>a});var o=t(748),n=t(258);class s{constructor(e,r,t,o,n){this.VueEditorConstructor=e,this.column=r,this.save=t,this.close=o,this.appContext=n,this.element=null,this.editCell=null}componentDidRender(){}disconnectedCallback(){this.vueEl&&(this.vueEl.destroy(),this.vueEl=void 0)}render(e){return e("span",{ref:e=>{this.vueEl=(0,n.k)(this.VueEditorConstructor,e,Object.assign(Object.assign({},this.editCell),{column:this.column,save:this.save,close:this.close}),this.appContext)}})}}const a=e=>{const r=(0,o.getCurrentInstance)(),t=null==r?void 0:r.appContext;return function(r,o,n){return new s(e,r,o,n,t)}}},258:(e,r,t)=>{t.d(r,{Z:()=>s,k:()=>n});var o=t(748);const n=(e,r,t,n)=>{if(!r)return null;let s=r._vnode;if(s){n&&(s.appContext=n);for(const e in t)s.component.props[e]=t[e]}else s=(0,o.createVNode)(e,t),n&&(s.appContext=n),(0,o.render)(s,r);return{vueInstance:s,destroy:()=>(0,o.render)(null,r),el:r}},s=e=>{const r=(0,o.getCurrentInstance)(),t=null==r?void 0:r.appContext;return(r,o)=>r("span",{ref:r=>n(e,r,o,t)})}},829:e=>{e.exports=r},748:r=>{r.exports=e}},i={};function l(e){var r=i[e];if(void 0!==r)return r.exports;var t=i[e]={exports:{}};return a[e](t,t.exports,l),t.exports}return t="function"==typeof Symbol?Symbol("webpack queues"):"__webpack_queues__",o="function"==typeof Symbol?Symbol("webpack exports"):"__webpack_exports__",n="function"==typeof Symbol?Symbol("webpack error"):"__webpack_error__",s=e=>{e&&e.d<1&&(e.d=1,e.forEach((e=>e.r--)),e.forEach((e=>e.r--?e.r++:e())))},l.a=(e,r,a)=>{var i;a&&((i=[]).d=-1);var l,u,d,c=new Set,f=e.exports,p=new Promise(((e,r)=>{d=r,u=e}));p[o]=f,p[t]=e=>(i&&e(i),c.forEach(e),p.catch((e=>{}))),e.exports=p,r((e=>{var r;l=(e=>e.map((e=>{if(null!==e&&"object"==typeof e){if(e[t])return e;if(e.then){var r=[];r.d=0,e.then((e=>{a[o]=e,s(r)}),(e=>{a[n]=e,s(r)}));var a={};return a[t]=e=>e(r),a}}var i={};return i[t]=e=>{},i[o]=e,i})))(e);var a=()=>l.map((e=>{if(e[n])throw e[n];return e[o]})),u=new Promise((e=>{(r=()=>e(a)).r=0;var o=e=>e!==i&&!c.has(e)&&(c.add(e),e&&!e.d&&(r.r++,e.push(r)));l.map((e=>e[t](o)))}));return r.r?u:a()}),(e=>(e?d(p[n]=e):u(f),s(i)))),i&&i.d<0&&(i.d=0)},l.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return l.d(r,{a:r}),r},l.d=(e,r)=>{for(var t in r)l.o(r,t)&&!l.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},l.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),l.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l(846)})()));

package/dist/vue-component-lib/utils.d.ts

@@ -15,6 +15,4 @@ export interface InputProps<T> {
 * @prop externalModelUpdateEvent - The external event to fire from your Vue component when modelUpdateEvent fires. This is used for ensuring that v-model references have been
 * correctly updated when a user's event callback fires.
 */
-export declare const defineContainer: <Props, VModelType = string | number | boolean>(name: string, defineCustomElement: any, componentProps?: string[], modelProp?: string, modelUpdateEvent?: string, externalModelUpdateEvent?: string) => import("vue").DefineComponent<Props & InputProps<VModelType>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<Props & InputProps<VModelType> extends infer T ? T extends Props & InputProps<VModelType> ? T extends import("vue").ComponentPropsOptions<{
-    [x: string]: unknown;
-}> ? import("vue").ExtractPropTypes<T> : T : never : never>, import("vue").ExtractDefaultPropTypes<Props & InputProps<VModelType>>>;
+export declare const defineContainer: <Props, VModelType = string | number | boolean>(name: string, defineCustomElement: any, componentProps?: string[], modelProp?: string, modelUpdateEvent?: string, externalModelUpdateEvent?: string) => (props: Props & InputProps<VModelType> & {}) => any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revolist/vue3-datagrid",
-  "version": "3.2.17",
+  "version": "3.6.16",
   "description": "Vue 3 DataGrid Spreadsheet",
   "main": "dist/vgrid.js",
   "types": "dist/vgrid.d.ts",
@@ -34,24 +34,24 @@
   "homepage": "https://github.com/revolist/vue3-datagrid#readme",
   "license": "MIT",
   "dependencies": {
-    "@revolist/revogrid": "^3.2.16",
+    "@revolist/revogrid": "^3.6.16",
     "@stencil/core": "^2.17.3"
   },
   "devDependencies": {
-    "@vue/compiler-sfc": "^3.2.37",
+    "@vue/compiler-sfc": "^3.3.4",
     "clean-webpack-plugin": "^4.0.0",
     "css-loader": "^6.7.1",
-    "html-webpack-plugin": "^5.5.0",
-    "sass": "^1.54.4",
-    "sass-loader": "^13.0.2",
-    "style-loader": "^3.3.1",
-    "ts-loader": "^9.3.1",
-    "typescript": "^4.7.4",
-    "vue": "^3.2.37",
-    "vue-loader": "^17.0.0",
+    "html-webpack-plugin": "^5.5.3",
+    "sass": "^1.64.2",
+    "sass-loader": "^13.3.2",
+    "style-loader": "^3.3.3",
+    "ts-loader": "^9.4.4",
+    "typescript": "^5.1.6",
+    "vue": "^3.3.4",
+    "vue-loader": "^17.2.2",
     "vue-style-loader": "^4.1.3",
-    "webpack": "^5.74.0",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.10.0"
+    "webpack": "^5.88.2",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^4.15.1"
   }
 }

package/public/App.vue

@@ -1,10 +1,9 @@
 <template>
     <div class="tile large">
       <v-grid
-        ref="grid"
-        readonly="false"
+        :readonly="false"
         :source="source"
-        resize="false"
+        :resize="false"
         :columns="headers"
         :editors="gridEditors"
         theme="material"
@@ -16,8 +15,7 @@
 <script lang="ts">
 // beforeCellFocus
 import {defineComponent, ref} from 'vue';
-import {Components} from '@revolist/revogrid';
-import VGrid, { VGridVueEditor, VGridVueTemplate } from '@revolist/vue-datagrid';
+import VGrid, { VGridVueEditor, VGridVueTemplate } from '../src/vgrid';
 import Editor from './Editor.vue';
 import Cell from './Cell.vue';
 import {generateFakeDataObject} from './dataService';
@@ -34,8 +32,7 @@ export default defineComponent({
   setup() {
     const button = VGridVueEditor(Editor);
     const gridEditors = { button };
-    const grid = ref<Components.RevoGrid|null>(null);
-    return { grid, gridEditors };
+    return { gridEditors };
   },
   methods: {
     test(e: CustomEvent) {

package/public/dataService.ts

@@ -18,7 +18,7 @@ function naturalSort(prop,a,b) {
 }
 
 export function generateFakeDataObject(rowsNumber: number, colsNumber: number, cellTemplate: any) {
-    const result: Record<any, any> = [];
+    const result: any[] = [];
     const columns: Record<number, any> = {};
     const all = colsNumber * rowsNumber;
     for (let j = 0; j < all; j++) {

package/src/revogrid.ts

@@ -5,9 +5,9 @@ import { defineContainer } from './vue-component-lib/utils';
 
 import type { JSX } from '@revolist/revogrid';
 
-import { RevoGrid as RevoGridComponent } from '@revolist/revogrid/custom-element/';
+import { defineCustomElements } from '@revolist/revogrid/loader';
 
-export {RevoGridComponent};
+await defineCustomElements();
 
 export const RevoGrid = /*@__PURE__*/ defineContainer<JSX.RevoGrid>('revo-grid', undefined, [
   'rowHeaders',
@@ -164,6 +164,7 @@ export const RevogrOverlaySelection = /*@__PURE__*/ defineContainer<JSX.RevogrOv
   'internalCellEdit',
   'internalFocusCell',
   'setEdit',
+  'cancelEdit',
   'setRange',
   'setTempRange',
   'focusCell',

package/src/vue-component-lib/utils.ts

@@ -1,3 +1,5 @@
+// @ts-nocheck
+// It's easier and safer for Volar to disable typechecking and let the return type inference do its job.
 import { VNode, defineComponent, getCurrentInstance, h, inject, ref, Ref } from 'vue';
 
 export interface InputProps<T> {
@@ -9,7 +11,7 @@ const MODEL_VALUE = 'modelValue';
 const ROUTER_LINK_VALUE = 'routerLink';
 const NAV_MANAGER = 'navManager';
 const ROUTER_PROP_PREFIX = 'router';
-
+const ARIA_PROP_PREFIX = 'aria';
 /**
  * Starting in Vue 3.1.0, all properties are
  * added as keys to the props object, even if
@@ -30,26 +32,31 @@ const getComponentClasses = (classes: unknown) => {
   return (classes as string)?.split(' ') || [];
 };
 
-const getElementClasses = (ref: Ref<HTMLElement | undefined>, componentClasses: Set<string>, defaultClasses: string[] = []) => {
-  return [ ...Array.from(ref.value?.classList || []), ...defaultClasses ]
-    .filter((c: string, i, self) => !componentClasses.has(c) && self.indexOf(c) === i);
+const getElementClasses = (
+  ref: Ref<HTMLElement | undefined>,
+  componentClasses: Set<string>,
+  defaultClasses: string[] = []
+) => {
+  return [...Array.from(ref.value?.classList || []), ...defaultClasses].filter(
+    (c: string, i, self) => !componentClasses.has(c) && self.indexOf(c) === i
+  );
 };
 
 /**
-* Create a callback to define a Vue component wrapper around a Web Component.
-*
-* @prop name - The component tag name (i.e. `ion-button`)
-* @prop componentProps - An array of properties on the
-* component. These usually match up with the @Prop definitions
-* in each component's TSX file.
-* @prop customElement - An option custom element instance to pass
-* to customElements.define. Only set if `includeImportCustomElements: true` in your config.
-* @prop modelProp - The prop that v-model binds to (i.e. value)
-* @prop modelUpdateEvent - The event that is fired from your Web Component when the value changes (i.e. ionChange)
-* @prop externalModelUpdateEvent - The external event to fire from your Vue component when modelUpdateEvent fires. This is used for ensuring that v-model references have been
-* correctly updated when a user's event callback fires.
-*/
-export const defineContainer = <Props, VModelType=string|number|boolean>(
+ * Create a callback to define a Vue component wrapper around a Web Component.
+ *
+ * @prop name - The component tag name (i.e. `ion-button`)
+ * @prop componentProps - An array of properties on the
+ * component. These usually match up with the @Prop definitions
+ * in each component's TSX file.
+ * @prop customElement - An option custom element instance to pass
+ * to customElements.define. Only set if `includeImportCustomElements: true` in your config.
+ * @prop modelProp - The prop that v-model binds to (i.e. value)
+ * @prop modelUpdateEvent - The event that is fired from your Web Component when the value changes (i.e. ionChange)
+ * @prop externalModelUpdateEvent - The external event to fire from your Vue component when modelUpdateEvent fires. This is used for ensuring that v-model references have been
+ * correctly updated when a user's event callback fires.
+ */
+export const defineContainer = <Props, VModelType = string | number | boolean>(
   name: string,
   defineCustomElement: any,
   componentProps: string[] = [],
@@ -58,16 +65,16 @@ export const defineContainer = <Props, VModelType=string|number|boolean>(
   externalModelUpdateEvent?: string
 ) => {
   /**
-  * Create a Vue component wrapper around a Web Component.
-  * Note: The `props` here are not all properties on a component.
-  * They refer to whatever properties are set on an instance of a component.
-  */
+   * Create a Vue component wrapper around a Web Component.
+   * Note: The `props` here are not all properties on a component.
+   * They refer to whatever properties are set on an instance of a component.
+   */
 
   if (defineCustomElement !== undefined) {
     defineCustomElement();
   }
 
-  const Container = defineComponent<Props & InputProps<VModelType>>((props: any, { attrs, slots, emit }) => {
+  const Container = defineComponent<Props & InputProps<VModelType>>((props, { attrs, slots, emit }) => {
     let modelPropValue = props[modelProp];
     const containerRef = ref<HTMLElement>();
     const classes = new Set(getComponentClasses(attrs.class));
@@ -116,12 +123,12 @@ export const defineContainer = <Props, VModelType=string|number|boolean>(
       } else {
         console.warn('Tried to navigate, but no router was found. Make sure you have mounted Vue Router.');
       }
-    }
+    };
 
     return () => {
       modelPropValue = props[modelProp];
 
-      getComponentClasses(attrs.class).forEach(value => {
+      getComponentClasses(attrs.class).forEach((value) => {
         classes.add(value);
       });
 
@@ -133,13 +140,13 @@ export const defineContainer = <Props, VModelType=string|number|boolean>(
         if (!ev.defaultPrevented) {
           handleRouterLink(ev);
         }
-      }
+      };
 
       let propsToAdd: any = {
         ref: containerRef,
         class: getElementClasses(containerRef, classes),
         onClick: handleClick,
-        onVnodeBeforeMount: (modelUpdateEvent) ? onVnodeBeforeMount : undefined
+        onVnodeBeforeMount: modelUpdateEvent ? onVnodeBeforeMount : undefined,
       };
 
       /**
@@ -150,7 +157,7 @@ export const defineContainer = <Props, VModelType=string|number|boolean>(
        */
       for (const key in props) {
         const value = props[key];
-        if (props.hasOwnProperty(key) && value !== EMPTY_PROP) {
+        if ((props.hasOwnProperty(key) && value !== EMPTY_PROP) || key.startsWith(ARIA_PROP_PREFIX)) {
           propsToAdd[key] = value;
         }
       }
@@ -165,33 +172,35 @@ export const defineContainer = <Props, VModelType=string|number|boolean>(
         if (props[MODEL_VALUE] !== EMPTY_PROP) {
           propsToAdd = {
             ...propsToAdd,
-            [modelProp]: props[MODEL_VALUE]
-          }
+            [modelProp]: props[MODEL_VALUE],
+          };
         } else if (modelPropValue !== EMPTY_PROP) {
           propsToAdd = {
             ...propsToAdd,
-            [modelProp]: modelPropValue
-          }
+            [modelProp]: modelPropValue,
+          };
         }
       }
 
       return h(name, propsToAdd, slots.default && slots.default());
-    }
+    };
   });
 
-  Container.displayName = name;
+  if (typeof Container !== 'function') {
+    Container.name = name;
 
-  Container.props = {
-    [ROUTER_LINK_VALUE]: DEFAULT_EMPTY_PROP
-  };
+    Container.props = {
+      [ROUTER_LINK_VALUE]: DEFAULT_EMPTY_PROP,
+    };
 
-  componentProps.forEach(componentProp => {
-    Container.props[componentProp] = DEFAULT_EMPTY_PROP;
-  });
+    componentProps.forEach((componentProp) => {
+      Container.props[componentProp] = DEFAULT_EMPTY_PROP;
+    });
 
-  if (modelProp) {
-    Container.props[MODEL_VALUE] = DEFAULT_EMPTY_PROP;
-    Container.emits = [UPDATE_VALUE_EVENT, externalModelUpdateEvent];
+    if (modelProp) {
+      Container.props[MODEL_VALUE] = DEFAULT_EMPTY_PROP;
+      Container.emits = [UPDATE_VALUE_EVENT, externalModelUpdateEvent];
+    }
   }
 
   return Container;

package/src/vue-editor.tsx

@@ -1,14 +1,14 @@
-import {RevoGrid} from "@revolist/revogrid/dist/types/interfaces";
+import {RevoGrid, Edition} from "@revolist/revogrid/dist/types/interfaces";
 import { getCurrentInstance } from "vue";
 import VueEditorAdapter from './vue-editor-adapter';
 
   
-const vueEditor = (vueConstructor: any) => {
+const vueEditor = (vueConstructor: any): Edition.EditorCtr => {
     const current = getCurrentInstance();
     const appContext = current?.appContext;
     return function(column: RevoGrid.ColumnDataSchemaModel, save: Function, close: Function) {
         return new VueEditorAdapter(vueConstructor, column, save, close, appContext);
-    }
+    } as unknown as Edition.EditorCtr;
 };
 
 export default vueEditor;

package/tsconfig.json

@@ -3,7 +3,6 @@
     "outDir": "./dist/",
     "baseUrl": "./",
     "allowSyntheticDefaultImports": true,
-    "declaration": true,
     "experimentalDecorators": true,
     "lib": ["dom", "es2017"],
     "moduleResolution": "node",