@progress/kendo-vue-grid/header/HeaderRow.js

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * 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;