@progress/kendo-vue-grid 7.0.3-develop.1 → 7.1.0-develop.2

package/drag/ColumnResize.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class d{constructor(n){this.resizable=!1,this.isRtl=!1,this.setIsRtl=h=>{this.isRtl=h},this.onResize=n,this.dragHandler=this.dragHandler.bind(this)}dragHandler(n,h,o,i){const l=n.originalEvent;i||(l.preventDefault(),l.stopPropagation(),l.stopImmediatePropagation());const t=o.parentElement;if(!t||!t.parentElement)return;const e=t.clientWidth;let s;if(this.isRtl?(s=o.getBoundingClientRect().right-o.offsetWidth/2-n.clientX,s+=e):s=e+n.clientX-o.getBoundingClientRect().left-o.offsetWidth/2,!i&&Math.abs(s-e)<1)return;this.fixateInitialWidths(t.parentElement.clientWidth),this.setWidths(h,Math.floor(s)/e);const r=this.columns.filter(c=>!c.children.length).indexOf(h);this.onResize(r,e,s,l,i)}fixateInitialWidths(n){const h=this.columns.filter(t=>!t.children.length);let o=0;const i=this.colGroupMain?this.colGroupMain.children:[];for(let t=0;t<i.length;t++)i[t].width?n-=parseFloat(i[t].width):o++;if(o===0)return;const l=Math.floor(n/o);for(let t=0;t<i.length;t++){const e=i[t];e.width||(e.width=l,h[t].width=l.toString(),this.colGroupHeader&&(this.colGroupHeader.children[t].width=l),this.colGroupFooter&&(this.colGroupFooter.children[t].width=l))}}setWidths(n,h){const o=this.columns.indexOf(n),i=[];let l=n.children.length;for(let t=o+1;l>0&&t<this.columns.length;t++){const e=this.columns[t];e.children.length?l+=e.children.length:i.push(e),l--}i.length===0&&i.push(n),i.forEach(t=>{let e=t.width?parseFloat(t.width.toString())*h:0;const s=t.minResizableWidth===void 0?10:t.minResizableWidth;e<s&&(e=s),t.width=e}),this.updateColElements(i)}updateColElements(n){const h=this.columns.filter(i=>!i.children.length);let o=1e-10;for(let i=0;i<n.length;i++){const l=h.indexOf(n[i]),t=parseFloat((n[i].width||0).toString());o+=t-Math.floor(t);const e=Math.floor(t)+Math.floor(o);o-=Math.floor(o),this.colGroupMain&&(this.colGroupMain.children[l].width=e+"px"),this.colGroupHeader&&(this.colGroupHeader.children[l].width=e+"px"),this.colGroupFooter&&this.colGroupFooter.children[l]&&(this.colGroupFooter.children[l].width=e+"px")}}}exports.ColumnResize=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("../utils/main.js"),G=1,w=20;class x{constructor(f){this.columns=[],this.columnsState=[],this.resizable=!1,this.isRtl=!1,this.setIsRtl=c=>{this.isRtl=c},this.initWidths=()=>{var d;const c=((d=this.colGroupMain)==null?void 0:d.children)||[],n=g.getFlatColumnsState(this.columnsState),l=this.columns.filter(h=>{var r;return!((r=h.children)!=null&&r.length)});for(let h=0;h<c.length;h++){const r=c[h];let t="";const e=n.find(o=>o.id===l[h].id);e&&(t=e.width||""),r.width=t,this.colGroupHeader&&(this.colGroupHeader.children[h].width=t),this.colGroupFooter&&(this.colGroupFooter.children[h].width=t)}},this.dragHandler=(c,n,l,d)=>{const h=c.originalEvent;d||(h.preventDefault(),h.stopPropagation(),h.stopImmediatePropagation());const r=l.closest("th");if(!r)return;const t=r.clientWidth;let e=t;if(this.isRtl?e+=l.getBoundingClientRect().right-l.offsetWidth/2-c.clientX:e+=c.clientX-l.getBoundingClientRect().left-l.offsetWidth/2,!d&&Math.abs(e-t)<1)return;this.fixateInitialWidths(r.parentElement.clientWidth),this.setWidths(n,Math.floor(e)/t);const o=this.columns.filter(i=>!i.children.length).findIndex(i=>i.id===n.id);this.onResize(o,t,e,h,d,this.columnsState,n.id)},this.dblClickHandler=(c,n)=>{const l=this.columns.filter(s=>n.indexOf(s.id)>-1),d=g.getFlatColumnsState(this.columnsState);if(!this.colGroupMain||!l.length)return;const h={},r=l;for(;r.length>0;){const s=r.pop();if(!s)break;s.children.length?r.push(...s.children):h[s.id]=s}const t=this.columns.filter(s=>!s.children.length),e=[];t.forEach((s,a)=>{h[s.id]&&e.push(a)});const o=[this.colGroupMain.parentElement],i=[this.colGroupMain];this.colGroupHeader&&(o.push(this.colGroupHeader.parentElement),i.push(this.colGroupHeader)),this.colGroupFooter&&(o.push(this.colGroupFooter.parentElement),i.push(this.colGroupFooter)),o.forEach(s=>s.classList.add("k-autofitting"));const u=[];i.forEach(s=>{e.forEach(a=>{s.children[a]&&(s.children[a].width="",u[a]=Math.max(u[a]||0,s.children[a].offsetWidth+G))})}),i.forEach(s=>{e.forEach(a=>{if(s.children[a]){s.children[a].width=u[a]+"px";const p=d.find(m=>m.id===t[a].id);p&&(p.width=u[a])}})}),o.forEach(s=>s.classList.remove("k-autofitting")),this.onResize(e[0],0,0,c,!0,this.columnsState,n[0])},this.updateColElements=c=>{var d,h,r;const n=this.columns.filter(t=>!t.hidden&&!t.children.length);let l=1e-10;for(let t=0;t<c.length;t++){const e=c[t],o=n.findIndex(p=>p.id===e.id),i=parseFloat((e.width||0).toString()),u=Math.floor(i);l+=i-u;const s=u+Math.floor(l);l-=Math.floor(l);const a=n.find(p=>p.id===e.id);if(!a)return;if((d=this.colGroupMain)!=null&&d.children[o]){const p=parseInt(this.colGroupMain.children[o].width,10);this.colGroupMain.children[o].width=s+"px",this.updateNextLockedCol(this.colGroupMain.parentElement,a,p-s)}if((h=this.colGroupHeader)!=null&&h.children[o]){const p=parseInt(this.colGroupHeader.children[o].width,10);this.colGroupHeader.children[o].width=s+"px",this.updateNextLockedCol(this.colGroupHeader.parentElement,a,p-s)}if((r=this.colGroupFooter)!=null&&r.children[o]){const p=parseInt(this.colGroupFooter.children[o].width,10);this.colGroupFooter.children[o].width=s+"px",this.updateNextLockedCol(this.colGroupFooter.parentElement,a,p-s)}}},this.onResize=f}fixateInitialWidths(f){var r;let c=0;const n=((r=this.colGroupMain)==null?void 0:r.children)||[];for(let t=0;t<n.length;t++)n[t].width?f-=n[t].clientWidth:c++;if(c===0)return;const l=Math.floor(f/c),d=g.getFlatColumnsState(this.columnsState),h=this.columns.filter(t=>!t.children.length);for(let t=0;t<n.length;t++){const e=n[t],o=e.width?e.clientWidth:l;e.width=o;const i=d.find(u=>u.id===h[t].id);i&&(i.width=o.toString()),this.colGroupHeader&&(this.colGroupHeader.children[t].width=o),this.colGroupFooter&&(this.colGroupFooter.children[t].width=o)}}setWidths(f,c){const n=g.getFlatColumnsState(this.columnsState),l=this.columns.findIndex(t=>t.id===f.id),d=[];let h=f.children.filter(t=>!t.hidden).length;for(let t=l+1;t<this.columns.length&&!(h<=0);t++){const e=this.columns[t];e.children.length?h+=e.children.filter(o=>!o.hidden).length:d.push(e),h--}d.length===0&&d.push(f);const r=[];d.forEach(t=>{const e=n.find(o=>o.id===t.id);if(e){let o=e.width?parseFloat(e.width.toString())*c:0;const i=t.minResizableWidth===void 0?10:t.minResizableWidth;o<i&&(o=i),e.width=o,r.push(e)}}),this.updateColElements(r)}updateNextLockedCol(f,c,n){const l=c.index,d=this.colGroupMain.parentElement.closest(".k-grid"),h=d==null?void 0:d.clientWidth,r=this.columns.filter(t=>t.locked).map(t=>parseInt(t.width+"",10)).reduce((t,e)=>t+e,0);!c.locked||h<=r+w||this.columns.forEach(t=>{if(t!=null&&t.locked&&n){const e=f==null?void 0:f.querySelectorAll('[aria-colindex="'+t.ariaColumnIndex+'"]');e==null||e.forEach(o=>{const i=o.style;this.isRtl?(t.index>l&&(i!=null&&i.right)&&(i.right=parseInt(i.right,10)-n+"px"),t.index<l&&(i!=null&&i.left)&&(i.left=parseInt(i.left,10)-n+"px")):(t.index>l&&(i!=null&&i.left)&&(i.left=parseInt(i.left,10)-n+"px"),t.index<l&&(i!=null&&i.right)&&(i.right=parseInt(i.right,10)-n+"px"))})}})}}exports.ColumnResize=x;

package/drag/ColumnResize.mjs

@@ -5,64 +5,145 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-class a {
-  constructor(l) {
-    this.resizable = !1, this.isRtl = !1, this.setIsRtl = (h) => {
-      this.isRtl = h;
-    }, this.onResize = l, this.dragHandler = this.dragHandler.bind(this);
+import { getFlatColumnsState as g } from "../utils/main.mjs";
+const G = 1, w = 20;
+class F {
+  constructor(f) {
+    this.columns = [], this.columnsState = [], this.resizable = !1, this.isRtl = !1, this.setIsRtl = (c) => {
+      this.isRtl = c;
+    }, this.initWidths = () => {
+      var d;
+      const c = ((d = this.colGroupMain) == null ? void 0 : d.children) || [], n = g(this.columnsState), l = this.columns.filter((h) => {
+        var r;
+        return !((r = h.children) != null && r.length);
+      });
+      for (let h = 0; h < c.length; h++) {
+        const r = c[h];
+        let t = "";
+        const e = n.find((o) => o.id === l[h].id);
+        e && (t = e.width || ""), r.width = t, this.colGroupHeader && (this.colGroupHeader.children[h].width = t), this.colGroupFooter && (this.colGroupFooter.children[h].width = t);
+      }
+    }, this.dragHandler = (c, n, l, d) => {
+      const h = c.originalEvent;
+      d || (h.preventDefault(), h.stopPropagation(), h.stopImmediatePropagation());
+      const r = l.closest("th");
+      if (!r)
+        return;
+      const t = r.clientWidth;
+      let e = t;
+      if (this.isRtl ? e += l.getBoundingClientRect().right - l.offsetWidth / 2 - c.clientX : e += c.clientX - l.getBoundingClientRect().left - l.offsetWidth / 2, !d && Math.abs(e - t) < 1)
+        return;
+      this.fixateInitialWidths(r.parentElement.clientWidth), this.setWidths(n, Math.floor(e) / t);
+      const o = this.columns.filter((i) => !i.children.length).findIndex((i) => i.id === n.id);
+      this.onResize(o, t, e, h, d, this.columnsState, n.id);
+    }, this.dblClickHandler = (c, n) => {
+      const l = this.columns.filter((s) => n.indexOf(s.id) > -1), d = g(this.columnsState);
+      if (!this.colGroupMain || !l.length)
+        return;
+      const h = {}, r = l;
+      for (; r.length > 0; ) {
+        const s = r.pop();
+        if (!s)
+          break;
+        s.children.length ? r.push(...s.children) : h[s.id] = s;
+      }
+      const t = this.columns.filter((s) => !s.children.length), e = [];
+      t.forEach((s, a) => {
+        h[s.id] && e.push(a);
+      });
+      const o = [this.colGroupMain.parentElement], i = [this.colGroupMain];
+      this.colGroupHeader && (o.push(this.colGroupHeader.parentElement), i.push(this.colGroupHeader)), this.colGroupFooter && (o.push(this.colGroupFooter.parentElement), i.push(this.colGroupFooter)), o.forEach((s) => s.classList.add("k-autofitting"));
+      const u = [];
+      i.forEach((s) => {
+        e.forEach((a) => {
+          s.children[a] && (s.children[a].width = "", u[a] = Math.max(
+            u[a] || 0,
+            s.children[a].offsetWidth + G
+          ));
+        });
+      }), i.forEach((s) => {
+        e.forEach((a) => {
+          if (s.children[a]) {
+            s.children[a].width = u[a] + "px";
+            const p = d.find((m) => m.id === t[a].id);
+            p && (p.width = u[a]);
+          }
+        });
+      }), o.forEach((s) => s.classList.remove("k-autofitting")), this.onResize(e[0], 0, 0, c, !0, this.columnsState, n[0]);
+    }, this.updateColElements = (c) => {
+      var d, h, r;
+      const n = this.columns.filter((t) => !t.hidden && !t.children.length);
+      let l = 1e-10;
+      for (let t = 0; t < c.length; t++) {
+        const e = c[t], o = n.findIndex((p) => p.id === e.id), i = parseFloat((e.width || 0).toString()), u = Math.floor(i);
+        l += i - u;
+        const s = u + Math.floor(l);
+        l -= Math.floor(l);
+        const a = n.find((p) => p.id === e.id);
+        if (!a)
+          return;
+        if ((d = this.colGroupMain) != null && d.children[o]) {
+          const p = parseInt(this.colGroupMain.children[o].width, 10);
+          this.colGroupMain.children[o].width = s + "px", this.updateNextLockedCol(this.colGroupMain.parentElement, a, p - s);
+        }
+        if ((h = this.colGroupHeader) != null && h.children[o]) {
+          const p = parseInt(this.colGroupHeader.children[o].width, 10);
+          this.colGroupHeader.children[o].width = s + "px", this.updateNextLockedCol(this.colGroupHeader.parentElement, a, p - s);
+        }
+        if ((r = this.colGroupFooter) != null && r.children[o]) {
+          const p = parseInt(this.colGroupFooter.children[o].width, 10);
+          this.colGroupFooter.children[o].width = s + "px", this.updateNextLockedCol(this.colGroupFooter.parentElement, a, p - s);
+        }
+      }
+    }, this.onResize = f;
   }
-  dragHandler(l, h, o, i) {
-    const n = l.originalEvent;
-    i || (n.preventDefault(), n.stopPropagation(), n.stopImmediatePropagation());
-    const t = o.parentElement;
-    if (!t || !t.parentElement)
+  fixateInitialWidths(f) {
+    var r;
+    let c = 0;
+    const n = ((r = this.colGroupMain) == null ? void 0 : r.children) || [];
+    for (let t = 0; t < n.length; t++)
+      n[t].width ? f -= n[t].clientWidth : c++;
+    if (c === 0)
       return;
-    const e = t.clientWidth;
-    let s;
-    if (this.isRtl ? (s = o.getBoundingClientRect().right - o.offsetWidth / 2 - l.clientX, s += e) : s = e + l.clientX - o.getBoundingClientRect().left - o.offsetWidth / 2, !i && Math.abs(s - e) < 1)
-      return;
-    this.fixateInitialWidths(t.parentElement.clientWidth), this.setWidths(h, Math.floor(s) / e);
-    const r = this.columns.filter((c) => !c.children.length).indexOf(h);
-    this.onResize(r, e, s, n, i);
-  }
-  fixateInitialWidths(l) {
-    const h = this.columns.filter((t) => !t.children.length);
-    let o = 0;
-    const i = this.colGroupMain ? this.colGroupMain.children : [];
-    for (let t = 0; t < i.length; t++)
-      i[t].width ? l -= parseFloat(i[t].width) : o++;
-    if (o === 0)
-      return;
-    const n = Math.floor(l / o);
-    for (let t = 0; t < i.length; t++) {
-      const e = i[t];
-      e.width || (e.width = n, h[t].width = n.toString(), this.colGroupHeader && (this.colGroupHeader.children[t].width = n), this.colGroupFooter && (this.colGroupFooter.children[t].width = n));
+    const l = Math.floor(f / c), d = g(this.columnsState), h = this.columns.filter((t) => !t.children.length);
+    for (let t = 0; t < n.length; t++) {
+      const e = n[t], o = e.width ? e.clientWidth : l;
+      e.width = o;
+      const i = d.find((u) => u.id === h[t].id);
+      i && (i.width = o.toString()), this.colGroupHeader && (this.colGroupHeader.children[t].width = o), this.colGroupFooter && (this.colGroupFooter.children[t].width = o);
     }
   }
-  setWidths(l, h) {
-    const o = this.columns.indexOf(l), i = [];
-    let n = l.children.length;
-    for (let t = o + 1; n > 0 && t < this.columns.length; t++) {
+  setWidths(f, c) {
+    const n = g(this.columnsState), l = this.columns.findIndex((t) => t.id === f.id), d = [];
+    let h = f.children.filter((t) => !t.hidden).length;
+    for (let t = l + 1; t < this.columns.length && !(h <= 0); t++) {
       const e = this.columns[t];
-      e.children.length ? n += e.children.length : i.push(e), n--;
+      e.children.length ? h += e.children.filter((o) => !o.hidden).length : d.push(e), h--;
     }
-    i.length === 0 && i.push(l), i.forEach((t) => {
-      let e = t.width ? parseFloat(t.width.toString()) * h : 0;
-      const s = t.minResizableWidth === void 0 ? 10 : t.minResizableWidth;
-      e < s && (e = s), t.width = e;
-    }), this.updateColElements(i);
+    d.length === 0 && d.push(f);
+    const r = [];
+    d.forEach((t) => {
+      const e = n.find((o) => o.id === t.id);
+      if (e) {
+        let o = e.width ? parseFloat(e.width.toString()) * c : 0;
+        const i = t.minResizableWidth === void 0 ? 10 : t.minResizableWidth;
+        o < i && (o = i), e.width = o, r.push(e);
+      }
+    }), this.updateColElements(r);
   }
-  updateColElements(l) {
-    const h = this.columns.filter((i) => !i.children.length);
-    let o = 1e-10;
-    for (let i = 0; i < l.length; i++) {
-      const n = h.indexOf(l[i]), t = parseFloat((l[i].width || 0).toString());
-      o += t - Math.floor(t);
-      const e = Math.floor(t) + Math.floor(o);
-      o -= Math.floor(o), this.colGroupMain && (this.colGroupMain.children[n].width = e + "px"), this.colGroupHeader && (this.colGroupHeader.children[n].width = e + "px"), this.colGroupFooter && this.colGroupFooter.children[n] && (this.colGroupFooter.children[n].width = e + "px");
-    }
+  updateNextLockedCol(f, c, n) {
+    const l = c.index, d = this.colGroupMain.parentElement.closest(".k-grid"), h = d == null ? void 0 : d.clientWidth, r = this.columns.filter((t) => t.locked).map((t) => parseInt(t.width + "", 10)).reduce((t, e) => t + e, 0);
+    !c.locked || h <= r + w || this.columns.forEach((t) => {
+      if (t != null && t.locked && n) {
+        const e = f == null ? void 0 : f.querySelectorAll('[aria-colindex="' + t.ariaColumnIndex + '"]');
+        e == null || e.forEach((o) => {
+          const i = o.style;
+          this.isRtl ? (t.index > l && (i != null && i.right) && (i.right = parseInt(i.right, 10) - n + "px"), t.index < l && (i != null && i.left) && (i.left = parseInt(i.left, 10) - n + "px")) : (t.index > l && (i != null && i.left) && (i.left = parseInt(i.left, 10) - n + "px"), t.index < l && (i != null && i.right) && (i.right = parseInt(i.right, 10) - n + "px"));
+        });
+      }
+    });
   }
 }
 export {
-  a as ColumnResize
+  F as ColumnResize
 };

package/header/HeaderRow.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),D=require("../interfaces/GridSortSettings.js"),N=require("../drag/ColumnResizer.js"),j=require("../drag/ColumnDraggable.js"),w=require("./GridHeaderCell.js"),v=require("../columnMenu/ColumnMenu.js"),u=require("@progress/kendo-vue-common"),x=require("@progress/kendo-vue-data-tools"),o=require("../messages/main.js"),z=require("@progress/kendo-vue-intl"),S=require("@progress/kendo-svg-icons");function k(t){return typeof t=="function"||Object.prototype.toString.call(t)==="[object Object]"&&!l.isVNode(t)}const H={none:"none",asc:"ascending",desc:"descending"},F={true:{asc:"desc",desc:"","":"asc"},false:{asc:"desc",desc:"asc","":"asc"}},q=l.defineComponent({name:"KendoHeaderRow",props:{grid:Object,cellRender:[String,Function,Object],groupable:[Boolean,Object],reorderable:Boolean,sortable:[Boolean,Object],sort:{type:Array},filter:Object,filterable:Boolean,filterOperators:Object,filterChange:Function,filterRow:Object,columns:Array,columnsMap:Array,columnResize:Object,columnMenu:[Boolean,String,Function,Object],columnMenuAnimate:{type:[Boolean,Object],default:function(){return!0}},columnMenuIcon:Object,isRtl:Boolean,isColCountDefined:Boolean,columnsInitial:Array,onSortChange:Function,onFilterChange:Function,onSelectionchange:Function,onPressHandler:Function,onDragHandler:Function,onReleaseHandler:Function},inject:{onNavFocus:{default:u.noop},kendoLocalizationService:{default:null}},data(){return{columnMenuOpened:{}}},created(){this.serviceIndex=0,this.index=-1,this._element=null,this.cellClick=this.cellClick.bind(this)},methods:{pressHandler(t,n){this.$emit("pressHandler",t,n)},dragHandler(t,n){this.$emit("dragHandler",t,n)},releaseHandler(t){this.$emit("releaseHandler",t)},selectionChangeHandler(t){this.$emit("selectionchange",t)},cellClick(t,n){if(t.preventDefault(),!u.hasListener.call(this,"sortChange"))return;const{allowUnsort:f,mode:m}=D.normalize(this.$props.sortable||!1,n.sortable||!1),s=(this.$props.sort||[]).filter(c=>c.field===n.field)[0],i=F[f][s&&s.dir||""],a=m==="single"?[]:(this.$props.sort||[]).filter(c=>c.field!==n.field);i!==""&&n.field&&a.push({field:n.field,dir:i}),this.sortChangeHandler(a,{event:t,field:n.field})},sortChangeHandler(t,n){this.$emit("sortChange",t,n)},filterChangeHandler(t,n){this.$emit("filterChange",t,n)},cellClass(t,n,f){const m=n?" "+n:"";let s="k-header"+(f?" k-grid-header-sticky":"")+m;return this.$props.sort&&this.$props.sort.filter(i=>i.field===t).length>0&&(s+=" k-sorted"),s},cellKeyDown(t,n){t.defaultPrevented||(t.keyCode===u.Keys.enter&&this.cellClick(t,n),t.altKey&&t.keyCode===u.Keys.down&&n.field&&(t.preventDefault(),this.columnMenuOpened={[n.field]:!0}))},getTemplate(t){return u.templateRendering.call(this.$props.grid,t,u.getListeners.call(this.$props.grid))},columnMenuClose(){this.onNavFocus({}),this.columnMenuOpened={}}},computed:{element(){return this._element},theadClasses(){return{"k-table-thead":!0}}},render(t){const n=z.provideLocalizationService(this),f=n.toLanguageString(o.sortableColumnAriaLabel,o.messages[o.sortableColumnAriaLabel]),m=n.toLanguageString(o.sortableColumnAscendingAriaLabel,o.messages[o.sortableColumnAscendingAriaLabel]),s=n.toLanguageString(o.sortableColumnDescendingAriaLabel,o.messages[o.sortableColumnDescendingAriaLabel]);this.serviceIndex=0,this.index=-1;const i=function(a){return a.map(function(c){const e=this.$props.columns[c],g=this.$props.sortable&&e.sortable,C=this.$props.sort?this.$props.sort.findIndex(r=>r.field===e.field):-1,$=C>=0&&this.$props.sort[C].dir||"none",p=function(r){if(!this.$props.sort)return null;const b=r>=0?this.$props.sort[r].dir:"";return r>=0&&[l.createVNode("span",{key:1,class:"k-sort-icon"},[l.createVNode(u.Icon,{name:"sort-"+b+"-small",icon:b==="asc"?S.sortAscSmallIcon:S.sortDescSmallIcon},null)]),this.$props.sort.length>1&&l.createVNode("span",{key:2,class:"k-sort-icon"},[l.createVNode("span",{class:"k-sort-order"},[r+1])])]}.call(this,C),d=e.columnMenu||e.columnMenu===!1?e.columnMenu:this.$props.columnMenu,y=e.menuIcon||this.$props.columnMenuIcon,M=(e.kFirst?"k-first ":"")+this.cellClass(e.field,e.headerClassName,e.locked)+(d?" k-filterable":""),R=!d||typeof d=="boolean"?!!d:this.getTemplate(d),O=e.left!==void 0?this.$props.isRtl?{left:e.right+"px",right:e.left+"px"}:{left:e.left+"px",right:e.right+"px"}:{},I=H[$]==="none"?f:H[$]==="ascending"?m:s;let h=e.isAccessible?{ariaSort:H[$],ariaLabel:I,role:"columnheader",ariaColumnIndex:this.$props.isColCountDefined?this.$props.columnsInitial.findIndex(r=>r.field===e.field)+1:void 0,ariaSelected:!1,ariaHaspopup:d?"menu":this.$props.filterable&&e.filterable?"dialog":void 0}:{role:"columnheader"};const V=e.declarationIndex>=0?++this.index:--this.serviceIndex,L=e.columnMenuOpened!==void 0?e.columnMenuOpened:this.columnMenuOpened[e.field];return l.createVNode(x.HeaderThElement,{ariaSort:g?h.ariaSort:void 0,ariaLabel:g?h.ariaLabel:void 0,role:h.role,ariaColumnIndex:h.ariaColumnIndex,ariaSelected:h.ariaSelected,ariaHaspopup:h.ariaHaspopup,key:V,colSpan:e.colSpan,rowSpan:e.rowSpan,class:M,style:O,columnId:e.id,navigatable:e.navigatable,onKeydown:r=>this.cellKeyDown(r,e)},{default:()=>[[e.children.length===0&&d&&l.createVNode(v.ColumnMenu,{key:0,column:{field:e.field,filter:e.filter},opened:L,animate:this.$props.columnMenuAnimate,sortable:g,sort:this.$props.sort,onClose:this.columnMenuClose,onSortchange:this.sortChangeHandler,filter:this.$props.filter,filterable:this.$props.filterable&&e.filterable,filterOperators:this.$props.filterOperators,onFilterchange:this.filterChangeHandler,render:R,columnMenuIcon:y},null),e.internalHeaderCell&&l.createVNode("span",{class:"k-cell-inner"},[l.createVNode(e.internalHeaderCell,{key:1,field:e.field,sortable:g,onHeadercellclick:r=>this.cellClick(r,e),onSelectionchange:this.selectionChangeHandler,selectionValue:e.headerSelectionValue,title:e.title,render:(e.headerCell||this.$props.cellRender)&&this.getTemplate(e.headerCell||this.$props.cellRender)},k(p)?p:{default:()=>[p]})])||l.createVNode("span",{class:"k-cell-inner"},[l.createVNode(w.GridHeaderCell,{key:1,field:e.field,sortable:g,onHeadercellclick:r=>this.cellClick(r,e),selectionValue:e.headerSelectionValue,title:e.title,render:(e.headerCell||this.$props.cellRender)&&this.getTemplate(e.headerCell||this.$props.cellRender)},k(p)?p:{default:()=>[p]})]),this.$props.columnResize&&this.$props.columnResize.resizable&&e.resizable&&l.createVNode(N.ColumnResizer,{key:2,onResize:(r,b,A)=>this.$props.columnResize&&this.$props.columnResize.dragHandler(r,e,b,A)},null)]]})},this)};return l.createVNode("thead",{role:"rowgroup",class:this.theadClasses,"data-keyboardnavheader":!0},[this.$props.columnsMap.map(function(a,c){let e;return(this.$props.groupable||this.$props.reorderable)&&l.createVNode(j.ColumnDraggable,{key:c,onPressHandler:this.pressHandler,onDragHandler:this.dragHandler,onReleaseHandler:this.releaseHandler},k(e=i.call(this,a))?e:{default:()=>[e]})||l.createVNode("tr",{class:"k-table-row",role:"row","aria-rowindex":this.columnsMap.length},[i.call(this,a)])},this),this.$props.filterRow])}});exports.HeaderRow=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),D=require("../interfaces/GridSortSettings.js"),N=require("../drag/ColumnResizer.js"),j=require("../drag/ColumnDraggable.js"),w=require("./GridHeaderCell.js"),v=require("../columnMenu/ColumnMenu.js"),u=require("@progress/kendo-vue-common"),x=require("@progress/kendo-vue-data-tools"),o=require("../messages/main.js"),z=require("@progress/kendo-vue-intl"),S=require("@progress/kendo-svg-icons");function k(t){return typeof t=="function"||Object.prototype.toString.call(t)==="[object Object]"&&!l.isVNode(t)}const H={none:"none",asc:"ascending",desc:"descending"},F={true:{asc:"desc",desc:"","":"asc"},false:{asc:"desc",desc:"asc","":"asc"}},q=l.defineComponent({name:"KendoHeaderRow",props:{grid:Object,cellRender:[String,Function,Object],groupable:[Boolean,Object],reorderable:Boolean,sortable:[Boolean,Object],sort:{type:Array},filter:Object,filterable:Boolean,filterOperators:Object,filterChange:Function,filterRow:Object,columns:Array,columnsMap:Array,columnResize:Object,columnMenu:[Boolean,String,Function,Object],columnMenuAnimate:{type:[Boolean,Object],default:function(){return!0}},columnMenuIcon:Object,isRtl:Boolean,isColCountDefined:Boolean,columnsInitial:Array,onSortChange:Function,onFilterChange:Function,onSelectionchange:Function,onPressHandler:Function,onDragHandler:Function,onReleaseHandler:Function},inject:{onNavFocus:{default:u.noop},kendoLocalizationService:{default:null}},data(){return{columnMenuOpened:{}}},created(){this.serviceIndex=0,this.index=-1,this._element=null,this.cellClick=this.cellClick.bind(this)},methods:{pressHandler(t,n){this.$emit("pressHandler",t,n)},dragHandler(t,n){this.$emit("dragHandler",t,n)},releaseHandler(t){this.$emit("releaseHandler",t)},selectionChangeHandler(t){this.$emit("selectionchange",t)},cellClick(t,n){if(t.preventDefault(),!u.hasListener.call(this,"sortChange"))return;const{allowUnsort:f,mode:m}=D.normalize(this.$props.sortable||!1,n.sortable||!1),s=(this.$props.sort||[]).filter(c=>c.field===n.field)[0],i=F[f][s&&s.dir||""],a=m==="single"?[]:(this.$props.sort||[]).filter(c=>c.field!==n.field);i!==""&&n.field&&a.push({field:n.field,dir:i}),this.sortChangeHandler(a,{event:t,field:n.field})},sortChangeHandler(t,n){this.$emit("sortChange",t,n)},filterChangeHandler(t,n){this.$emit("filterChange",t,n)},cellClass(t,n,f){const m=n?" "+n:"";let s="k-header"+(f?" k-grid-header-sticky":"")+m;return this.$props.sort&&this.$props.sort.filter(i=>i.field===t).length>0&&(s+=" k-sorted"),s},cellKeyDown(t,n){t.defaultPrevented||(t.keyCode===u.Keys.enter&&this.cellClick(t,n),t.altKey&&t.keyCode===u.Keys.down&&n.field&&(t.preventDefault(),this.columnMenuOpened={[n.field]:!0}))},getTemplate(t){return u.templateRendering.call(this.$props.grid,t,u.getListeners.call(this.$props.grid))},columnMenuClose(){this.onNavFocus({}),this.columnMenuOpened={}}},computed:{element(){return this._element},theadClasses(){return{"k-table-thead":!0}}},render(t){const n=z.provideLocalizationService(this),f=n.toLanguageString(o.sortableColumnAriaLabel,o.messages[o.sortableColumnAriaLabel]),m=n.toLanguageString(o.sortableColumnAscendingAriaLabel,o.messages[o.sortableColumnAscendingAriaLabel]),s=n.toLanguageString(o.sortableColumnDescendingAriaLabel,o.messages[o.sortableColumnDescendingAriaLabel]);this.serviceIndex=0,this.index=-1;const i=function(a){return a.map(function(c){const e=this.$props.columns[c],g=this.$props.sortable&&e.sortable,C=this.$props.sort?this.$props.sort.findIndex(r=>r.field===e.field):-1,$=C>=0&&this.$props.sort[C].dir||"none",p=function(r){if(!this.$props.sort)return null;const b=r>=0?this.$props.sort[r].dir:"";return r>=0&&[l.createVNode("span",{key:1,class:"k-sort-icon"},[l.createVNode(u.Icon,{name:"sort-"+b+"-small",icon:b==="asc"?S.sortAscSmallIcon:S.sortDescSmallIcon},null)]),this.$props.sort.length>1&&l.createVNode("span",{key:2,class:"k-sort-icon"},[l.createVNode("span",{class:"k-sort-order"},[r+1])])]}.call(this,C),d=e.columnMenu||e.columnMenu===!1?e.columnMenu:this.$props.columnMenu,y=e.menuIcon||this.$props.columnMenuIcon,M=(e.kFirst?"k-first ":"")+this.cellClass(e.field,e.headerClassName,e.locked)+(d?" k-filterable":""),R=!d||typeof d=="boolean"?!!d:this.getTemplate(d),O=e.left!==void 0?this.$props.isRtl?{left:e.right+"px",right:e.left+"px"}:{left:e.left+"px",right:e.right+"px"}:{},I=H[$]==="none"?f:H[$]==="ascending"?m:s;let h=e.isAccessible?{ariaSort:H[$],ariaLabel:I,role:"columnheader",ariaColumnIndex:this.$props.isColCountDefined?this.$props.columnsInitial.findIndex(r=>r.field===e.field)+1:void 0,ariaSelected:!1,ariaHaspopup:d?"menu":this.$props.filterable&&e.filterable?"dialog":void 0}:{role:"columnheader"};const V=e.declarationIndex>=0?++this.index:--this.serviceIndex,L=e.columnMenuOpened!==void 0?e.columnMenuOpened:this.columnMenuOpened[e.field];return l.createVNode(x.HeaderThElement,{ariaSort:g?h.ariaSort:void 0,ariaLabel:g?h.ariaLabel:void 0,role:h.role,ariaColumnIndex:h.ariaColumnIndex,ariaSelected:h.ariaSelected,ariaHaspopup:h.ariaHaspopup,key:V,colSpan:e.headerColSpan,rowSpan:e.rowSpan,class:M,style:O,columnId:e.id,navigatable:e.navigatable,onKeydown:r=>this.cellKeyDown(r,e)},{default:()=>[[e.children.length===0&&d&&l.createVNode(v.ColumnMenu,{key:0,column:{field:e.field,filter:e.filter},opened:L,animate:this.$props.columnMenuAnimate,sortable:g,sort:this.$props.sort,onClose:this.columnMenuClose,onSortchange:this.sortChangeHandler,filter:this.$props.filter,filterable:this.$props.filterable&&e.filterable,filterOperators:this.$props.filterOperators,onFilterchange:this.filterChangeHandler,render:R,columnMenuIcon:y},null),e.internalHeaderCell&&l.createVNode("span",{class:"k-cell-inner"},[l.createVNode(e.internalHeaderCell,{key:1,field:e.field,sortable:g,onHeadercellclick:r=>this.cellClick(r,e),onSelectionchange:this.selectionChangeHandler,selectionValue:e.headerSelectionValue,title:e.title,render:(e.headerCell||this.$props.cellRender)&&this.getTemplate(e.headerCell||this.$props.cellRender)},k(p)?p:{default:()=>[p]})])||l.createVNode("span",{class:"k-cell-inner"},[l.createVNode(w.GridHeaderCell,{key:1,field:e.field,sortable:g,onHeadercellclick:r=>this.cellClick(r,e),selectionValue:e.headerSelectionValue,title:e.title,render:(e.headerCell||this.$props.cellRender)&&this.getTemplate(e.headerCell||this.$props.cellRender)},k(p)?p:{default:()=>[p]})]),this.$props.columnResize&&this.$props.columnResize.resizable&&e.resizable&&l.createVNode(N.ColumnResizer,{key:2,onResize:(r,b,A)=>this.$props.columnResize&&this.$props.columnResize.dragHandler(r,e,b,A)},null)]]})},this)};return l.createVNode("thead",{role:"rowgroup",class:this.theadClasses,"data-keyboardnavheader":!0},[this.$props.columnsMap.map(function(a,c){let e;return(this.$props.groupable||this.$props.reorderable)&&l.createVNode(j.ColumnDraggable,{key:c,onPressHandler:this.pressHandler,onDragHandler:this.dragHandler,onReleaseHandler:this.releaseHandler},k(e=i.call(this,a))?e:{default:()=>[e]})||l.createVNode("tr",{class:"k-table-row",role:"row","aria-rowindex":this.columnsMap.length},[i.call(this,a)])},this),this.$props.filterRow])}});exports.HeaderRow=q;

package/header/HeaderRow.mjs

@@ -197,7 +197,7 @@ const k = {
           ariaSelected: p.ariaSelected,
           ariaHaspopup: p.ariaHaspopup,
           key: j,
-          colSpan: e.colSpan,
+          colSpan: e.headerColSpan,
           rowSpan: e.rowSpan,
           class: O,
           style: L,