vue2-excel-grid 1.1.19 → 1.1.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-excel-grid",
-  "version": "1.1.19",
+  "version": "1.1.21",
   "description": "Excel-style grid component for Vue 2.6.14 with virtual scrolling",
   "main": "dist/vue2-excel-grid.umd.js",
   "module": "dist/vue2-excel-grid.esm.js",

package/src/components/ExcelGrid.vue

@@ -233,7 +233,7 @@
                               </template>
                               <template v-else>
                                 <slot :name="'cell-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" :isEditing="false" :done="null" :cancel="null">
-                                  {{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}
+                                  <slot v-if="hasPrefixSlot(col)" :name="'prefix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" /><span v-if="hasPrefixSlot(col) || hasSuffixSlot(col)" class="eg-cell-value">{{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}</span><template v-else>{{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}</template><slot v-if="hasSuffixSlot(col)" :name="'suffix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" />
                                 </slot>
                               </template>
                             </div>
@@ -294,7 +294,7 @@
                               </template>
                               <template v-else>
                                 <slot :name="'cell-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" :isEditing="false" :done="null" :cancel="null">
-                                  {{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}
+                                  <slot v-if="hasPrefixSlot(col)" :name="'prefix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" /><span v-if="hasPrefixSlot(col) || hasSuffixSlot(col)" class="eg-cell-value">{{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}</span><template v-else>{{ isSelectLikeCol(col) ? getSelectLabel(ci, getCellValue(ri, ci)) : getCellValue(ri, ci) }}</template><slot v-if="hasSuffixSlot(col)" :name="'suffix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, ci)" />
                                 </slot>
                               </template>
                             </div>
@@ -341,7 +341,7 @@
                             </template>
                             <template v-else>
                               <slot :name="'cell-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, col._flatIndex)" :isEditing="false" :done="null" :cancel="null">
-                                {{ isSelectLikeCol(col) ? getSelectLabel(col._flatIndex, getCellValue(ri, col._flatIndex)) : getCellValue(ri, col._flatIndex) }}
+                                <slot v-if="hasPrefixSlot(col)" :name="'prefix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, col._flatIndex)" /><span v-if="hasPrefixSlot(col) || hasSuffixSlot(col)" class="eg-cell-value">{{ isSelectLikeCol(col) ? getSelectLabel(col._flatIndex, getCellValue(ri, col._flatIndex)) : getCellValue(ri, col._flatIndex) }}</span><template v-else>{{ isSelectLikeCol(col) ? getSelectLabel(col._flatIndex, getCellValue(ri, col._flatIndex)) : getCellValue(ri, col._flatIndex) }}</template><slot v-if="hasSuffixSlot(col)" :name="'suffix-' + col.key" :row="_dataRaw[ri]" :rowIndex="ri" :column="col" :value="getCellValue(ri, col._flatIndex)" />
                               </slot>
                             </template>
                           </div>
@@ -2186,6 +2186,12 @@ export default {
     hasLegacyEditSlot(col) {
       return !!(col && col.key && this.$scopedSlots && this.$scopedSlots['edit-' + col.key])
     },
+    hasPrefixSlot(col) {
+      return !!(col && col.key && this.$scopedSlots && this.$scopedSlots['prefix-' + col.key])
+    },
+    hasSuffixSlot(col) {
+      return !!(col && col.key && this.$scopedSlots && this.$scopedSlots['suffix-' + col.key])
+    },
     _hasCustomEdit(col) {
       // For select/treeSelect: cell-{key} slot only customizes display; dropdown still opens normally
       if (col.type === 'select' || col.type === 'treeSelect') {
@@ -3491,6 +3497,13 @@ export default {
   align-items: center;
 }
 
+.eg-cell-value {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
 .eg-cell-active {
   outline: 2px solid #1a73e8 !important;
   outline-offset: -2px;