@progress/kendo-vue-grid
Version:
91 lines (90 loc) • 2.58 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { defineComponent as d, ref as a, createVNode as s } from "vue";
import { isRtl as h } from "../utils/main.mjs";
import { kendoThemeMaps as n, getRef as l, setRef as o } from "@progress/kendo-vue-common";
import { BrowserSupportService as c } from "../utils/browser-support.service.mjs";
const g = /* @__PURE__ */ d({
props: {
staticHeaders: Boolean,
headerRow: Object,
columnResize: Object,
cols: Array,
size: String,
draggable: Boolean
},
data() {
return {
divStyle: {},
element: null,
headerWrap: null,
table: null
};
},
computed: {
wrapperClass() {
return {
"k-grid-header": !0,
"k-grid-draggable-header": this.$props.draggable
};
},
tableClass() {
const {
size: e
} = this.$props;
return {
"k-table": !0,
"k-grid-header-table": !0,
[`k-table-${n.sizeMap[e] || e}`]: e
};
}
},
mounted() {
this.headerWrap = l(this, "headerWrap"), this.table = l(this, "table"), this.$props.columnResize.colGroupHeader = l(this, "colGroupHeader");
const e = new c().scrollbarWidth, r = h(this.$el);
this.$props.columnResize && this.$props.columnResize.setIsRtl(r);
const t = Math.max(0, e) + "px", i = r ? 0 : t, p = r ? t : 0;
this.divStyle = {
padding: `0 ${i} 0 ${p}`
};
},
methods: {
setScrollLeft(e) {
this.headerWrap && (this.headerWrap.scrollLeft = e);
},
setWidth(e) {
this.table && (this.table.style.width = e + "px");
}
},
setup() {
const e = a(null), r = a(null), t = a(null);
return {
headerWrapRef: e,
tableRef: r,
colGroupHeaderRef: t
};
},
render() {
return this.$props.staticHeaders ? s("div", {
class: this.wrapperClass,
style: this.divStyle
}, [s("div", {
ref: o(this, "headerWrap"),
class: "k-grid-header-wrap"
}, [s("table", {
class: this.tableClass,
ref: o(this, "table"),
role: "none"
}, [s("colgroup", {
ref: o(this, "colGroupHeader")
}, [this.$props.cols]), this.$props.headerRow])])]) : this.$props.headerRow;
}
});
export {
g as Header
};