fix(vue): remove column definition defineModel type (#1815)

ghiscoding · Jan 23, 2025 · 475baf7 · 475baf7
1 parent 6bd8b58
commit 475baf7
Show file tree

Hide file tree

Showing 46 changed files with 84 additions and 65 deletions.
diff --git a/demos/vue/src/components/Example01.vue b/demos/vue/src/components/Example01.vue
@@ -18,8 +18,8 @@ let _darkModeGrid1 = false;
 let vueGrid1!: SlickgridVueInstance;
 const gridOptions1 = ref<GridOption>();
 const gridOptions2 = ref<GridOption>();
-const columnDefinitions1 = ref<Column[]>();
-const columnDefinitions2 = ref<Column[]>();
+const columnDefinitions1 = ref<Column[]>([]);
+const columnDefinitions2 = ref<Column[]>([]);
 const dataset1 = ref<any[]>([]);
 const dataset2 = ref<any[]>([]);
 
@@ -149,7 +149,7 @@ function toggleDarkModeGrid1() {
   <div class="grid-container1">
     <SlickgridVue
       v-model:options="gridOptions1!"
-      v-model:columns="columnDefinitions1 as Column[]"
+      v-model:columns="columnDefinitions1"
       v-model:data="dataset1"
       grid-id="grid1-1"
       @onVueGridCreated="vueGrid1Ready($event.detail)"
@@ -163,7 +163,7 @@ function toggleDarkModeGrid1() {
 
   <slickgrid-vue
     v-model:options="gridOptions2!"
-    v-model:columns="columnDefinitions2 as Column[]"
+    v-model:columns="columnDefinitions2"
     v-model:data="dataset2"
     grid-id="grid1-2"
     @on-pagination-changed="paginationChanged($event.detail)"

diff --git a/demos/vue/src/components/Example02.vue b/demos/vue/src/components/Example02.vue
@@ -282,7 +282,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid2"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example03.vue b/demos/vue/src/components/Example03.vue
@@ -757,7 +757,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions as GridOption"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid3"
     @on-cell-change="onCellChanged($event.detail.eventData, $event.detail.args)"

diff --git a/demos/vue/src/components/Example04.vue b/demos/vue/src/components/Example04.vue
@@ -436,7 +436,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid4"
     @onGridStateChanged="gridStateChanged($event.detail)"

diff --git a/demos/vue/src/components/Example05.vue b/demos/vue/src/components/Example05.vue
@@ -643,7 +643,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     v-model:pagination="paginationOptions"
     grid-id="grid5"

diff --git a/demos/vue/src/components/Example06.vue b/demos/vue/src/components/Example06.vue
@@ -608,7 +608,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid6"
     @onGridStateChanged="gridStateChanged($event.detail)"

diff --git a/demos/vue/src/components/Example07.vue b/demos/vue/src/components/Example07.vue
@@ -277,7 +277,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions1!"
-    v-model:columns="columnDefinitions1 as Column[]"
+    v-model:columns="columnDefinitions1"
     v-model:data="dataset1"
     grid-id="grid7-1"
     @onVueGridCreated="vueGrid1Ready($event.detail)"
@@ -290,7 +290,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions2!"
-    v-model:columns="columnDefinitions2 as Column[]"
+    v-model:columns="columnDefinitions2"
     v-model:data="dataset2"
     grid-id="grid7-2"
     @onVueGridCreated="vueGrid2Ready($event.detail)"

diff --git a/demos/vue/src/components/Example08.vue b/demos/vue/src/components/Example08.vue
@@ -250,7 +250,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid8"
       @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example09.vue b/demos/vue/src/components/Example09.vue
@@ -359,7 +359,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid9"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example10.vue b/demos/vue/src/components/Example10.vue
@@ -376,7 +376,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions1!"
-    v-model:columns="columnDefinitions1 as Column[]"
+    v-model:columns="columnDefinitions1"
     v-model:data="dataset1"
     grid-id="grid1"
     @onGridStateChanged="grid1StateChanged($event.detail)"
@@ -421,7 +421,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions2!"
-    v-model:columns="columnDefinitions2 as Column[]"
+    v-model:columns="columnDefinitions2"
     v-model:data="dataset2"
     grid-id="grid2"
     @onGridStateChanged="grid2StateChanged($event.detail)"

diff --git a/demos/vue/src/components/Example11.vue b/demos/vue/src/components/Example11.vue
@@ -341,7 +341,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid11"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example12.vue b/demos/vue/src/components/Example12.vue
@@ -402,7 +402,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid12"
     @onGridStateChanged="gridStateChanged($event.detail)"

diff --git a/demos/vue/src/components/Example13.vue b/demos/vue/src/components/Example13.vue
@@ -459,7 +459,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid13"
     @onBeforeExportToExcel="processing = true"

diff --git a/demos/vue/src/components/Example14.vue b/demos/vue/src/components/Example14.vue
@@ -196,7 +196,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions1!"
-    v-model:columns="columnDefinitions1 as Column[]"
+    v-model:columns="columnDefinitions1"
     v-model:data="dataset1"
     grid-id="grid1"
     @onVueGridCreated="vueGrid1Ready($event.detail)"
@@ -218,7 +218,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions2!"
-    v-model:columns="columnDefinitions2 as Column[]"
+    v-model:columns="columnDefinitions2"
     v-model:data="dataset2"
     grid-id="grid2"
     @onVueGridCreated="vueGrid2Ready($event.detail)"

diff --git a/demos/vue/src/components/Example15.vue b/demos/vue/src/components/Example15.vue
@@ -328,7 +328,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid15"
     @onGridStateChanged="gridStateChanged($event.detail)"

diff --git a/demos/vue/src/components/Example16.vue b/demos/vue/src/components/Example16.vue
@@ -357,7 +357,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid16"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example17.vue b/demos/vue/src/components/Example17.vue
@@ -143,7 +143,7 @@ function toggleSubTitle() {
   <slickgrid-vue
     v-if="gridCreated"
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid17"
   >

diff --git a/demos/vue/src/components/Example18.vue b/demos/vue/src/components/Example18.vue
@@ -536,7 +536,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid18"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example19.vue b/demos/vue/src/components/Example19.vue
@@ -382,7 +382,7 @@ defineExpose({
 
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid19"
       @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example20.vue b/demos/vue/src/components/Example20.vue
@@ -412,7 +412,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid20"
     @onValidationError="onCellValidationError($event.detail.eventData, $event.detail.args)"

diff --git a/demos/vue/src/components/Example21.vue b/demos/vue/src/components/Example21.vue
@@ -237,7 +237,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid21"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example22.vue b/demos/vue/src/components/Example22.vue
@@ -193,7 +193,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
 
         <slickgrid-vue
           v-model:options="gridOptions1!"
-          v-model:columns="columnDefinitions1 as Column[]"
+          v-model:columns="columnDefinitions1"
           v-model:data="dataset1"
           grid-id="grid1"
           @onVueGridCreated="vueGrid1Ready($event.detail)"
@@ -204,7 +204,7 @@ function vueGrid2Ready(grid: SlickgridVueInstance) {
         <h4>Grid 2 - Load a JSON dataset through Fetch-Client</h4>
         <slickgrid-vue
           v-model:options="gridOptions2!"
-          v-model:columns="columnDefinitions2 as Column[]"
+          v-model:columns="columnDefinitions2"
           v-model:data="dataset2"
           grid-id="grid2"
           @onVueGridCreated="vueGrid2Ready($event.detail)"

diff --git a/demos/vue/src/components/Example23.vue b/demos/vue/src/components/Example23.vue
@@ -406,7 +406,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid23"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example24.vue b/demos/vue/src/components/Example24.vue
@@ -752,7 +752,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid24"
       @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example25.vue b/demos/vue/src/components/Example25.vue
@@ -357,7 +357,7 @@ function getLanguages(): Promise<GraphqlResult<{ code: string; name: string; nat
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid25"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example26.vue b/demos/vue/src/components/Example26.vue
@@ -454,7 +454,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
   <slickgrid-vue
     grid-id="grid26"
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     @onCellChange.trigger="onCellChanged($event.detail.eventData, $event.detail.args)"
     @on@click="onCellClicked($event.detail.eventData, $event.detail.args)"

diff --git a/demos/vue/src/components/Example27.vue b/demos/vue/src/components/Example27.vue
@@ -494,7 +494,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
   <div id="grid-container" class="col-sm-12">
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid27"
       @onBeforeFilterChange="showSpinner()"

diff --git a/demos/vue/src/components/Example28.vue b/demos/vue/src/components/Example28.vue
@@ -581,7 +581,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
   <div id="grid-container" class="col-sm-12">
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:hierarchical="datasetHierarchical"
       grid-id="grid28"
       @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example29.vue b/demos/vue/src/components/Example29.vue
@@ -87,7 +87,7 @@ function toggleSubTitle() {
 
   <hr />
 
-  <slickgrid-vue v-model:options="gridOptions" v-model:columns="columnDefinitions as Column[]" v-model:data="dataset" grid-id="grid2">
+  <slickgrid-vue v-model:options="gridOptions" v-model:columns="columnDefinitions" v-model:data="dataset" grid-id="grid2">
     <template #header>
       <div class="custom-header-slot">
         <h3>Grid with header and footer slot</h3>

diff --git a/demos/vue/src/components/Example30.vue b/demos/vue/src/components/Example30.vue
@@ -1149,7 +1149,7 @@ function renderItemCallbackWith4Corners(item: any): string {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid30"
     @onBeforeEditCell="handleOnBeforeEditCell($event.detail.eventData, $event.detail.args)"

diff --git a/demos/vue/src/components/Example31.vue b/demos/vue/src/components/Example31.vue
@@ -545,7 +545,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:pagination="paginationOptions"
     v-model:data="dataset"
     grid-id="grid31"

diff --git a/demos/vue/src/components/Example32.vue b/demos/vue/src/components/Example32.vue
@@ -893,7 +893,7 @@ function renderItemCallbackWith4Corners(item: any): string {
   <div id="smaller-container" style="width: 950px">
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid32"
       @onSelectedRowIdsChanged="handleOnSelectedRowIdsChanged($event.detail.args)"

diff --git a/demos/vue/src/components/Example33.vue b/demos/vue/src/components/Example33.vue
@@ -594,7 +594,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid33"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example34.vue b/demos/vue/src/components/Example34.vue
@@ -513,7 +513,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid34"
       @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example35.vue b/demos/vue/src/components/Example35.vue
@@ -329,7 +329,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid35"
     @onVueGridCreated="vueGridReady($event.detail)"

diff --git a/demos/vue/src/components/Example36.vue b/demos/vue/src/components/Example36.vue
@@ -575,7 +575,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid36"
     @onCellChange="invalidateAll()"

diff --git a/demos/vue/src/components/Example37.vue b/demos/vue/src/components/Example37.vue
@@ -160,7 +160,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
   <slickgrid-vue
     v-model:options="gridOptions"
-    v-model:columns="columnDefinitions as Column[]"
+    v-model:columns="columnDefinitions"
     v-model:data="dataset"
     grid-id="grid37"
     @onCellChange="handleOnCellChange($event.detail.eventData, $event.detail.args)"

diff --git a/demos/vue/src/components/Example38.vue b/demos/vue/src/components/Example38.vue
@@ -531,7 +531,7 @@ function vueGridReady(grid: SlickgridVueInstance) {
 
     <slickgrid-vue
       v-model:options="gridOptions"
-      v-model:columns="columnDefinitions as Column[]"
+      v-model:columns="columnDefinitions"
       v-model:data="dataset"
       grid-id="grid38"
       @onRowCountChanged="refreshMetrics($event.detail.args)"