@progress/kendo-react-grid
Version:
React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package
157 lines (156 loc) • 7.59 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 { getFlatColumnsState as u } from "../utils/index.mjs";
const w = 1, W = 20;
class F {
constructor(a) {
this.columns = [], this.columnsState = [], this.resizable = !1, this.isRtl = !1, this.setIsRtl = (h) => {
this.isRtl = h;
}, this.initWidths = () => {
var c;
const h = ((c = this.colGroupMain) == null ? void 0 : c.children) || [], l = u(this.columnsState), r = this.columns.filter((e) => {
var o;
return !((o = e.children) != null && o.length);
});
for (let e = 0; e < h.length; e++) {
const o = h[e], t = r[e];
let i = "";
const n = l.find((s) => s.id === r[e].id);
n && (i = this.applyWidthConstraints(n, t)), o.width = i, this.colGroupHeader && (this.colGroupHeader.children[e].width = i), this.colGroupFooter && (this.colGroupFooter.children[e].width = i);
}
}, this.dragHandler = (h, l, r, c) => {
const e = h.originalEvent;
c || (e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation());
const o = r.closest("th");
if (!o || !o)
return;
const t = o.clientWidth;
let i = t;
if (this.isRtl ? i += r.getBoundingClientRect().right - r.offsetWidth / 2 - h.clientX : i += h.clientX - r.getBoundingClientRect().left - r.offsetWidth / 2, !c && Math.abs(i - t) < 1)
return;
this.fixateInitialWidths(o.parentElement.clientWidth), this.setWidths(l, Math.floor(i) / t);
const n = this.columns.filter((s) => !s.children.length).findIndex((s) => s.id === l.id);
this.onResize(n, t, i, e, c, this.columnsState, l.id);
}, this.dblClickHandler = (h, l) => {
const r = this.columns.filter((d) => l.indexOf(d.id) > -1), c = u(this.columnsState);
if (!this.colGroupMain || !r.length)
return;
const e = {}, o = r;
for (; o.length > 0; ) {
const d = o.pop();
if (!d)
break;
d.children.length ? o.push(...d.children) : e[d.id] = d;
}
const t = this.columns.filter((d) => !d.children.length), i = [];
t.forEach((d, p) => {
e[d.id] && i.push(p);
});
const n = [this.colGroupMain.parentElement], s = [this.colGroupMain];
this.colGroupHeader && (n.push(this.colGroupHeader.parentElement), s.push(this.colGroupHeader)), this.colGroupFooter && (n.push(this.colGroupFooter.parentElement), s.push(this.colGroupFooter)), n.forEach((d) => d.classList.add("k-autofitting"));
const f = [];
s.forEach((d) => {
i.forEach((p) => {
d.children[p] && (d.children[p].width = "", f[p] = Math.max(
f[p] || 0,
d.children[p].offsetWidth + w
));
});
}), s.forEach((d) => {
i.forEach((p) => {
if (d.children[p]) {
d.children[p].width = f[p] + "px";
const g = c.find((G) => G.id === t[p].id);
g && (g.width = f[p]);
}
});
}), n.forEach((d) => d.classList.remove("k-autofitting")), this.onResize(i[0], 0, 0, h, !0, this.columnsState, l[0]);
}, this.updateColElements = (h) => {
const l = this.columns.filter((c) => !c.hidden && !c.children.length);
let r = 1e-10;
for (let c = 0; c < h.length; c++) {
const e = h[c], o = l.findIndex((f) => f.id === e.id), t = parseFloat((e.width || 0).toString()), i = Math.floor(t);
r += t - i;
const n = i + Math.floor(r);
r -= Math.floor(r);
const s = l.find((f) => f.id === e.id);
if (!s)
return;
if (this.colGroupMain && this.colGroupMain.children[o]) {
const f = parseInt(this.colGroupMain.children[o].width, 10);
this.colGroupMain.children[o].width = n + "px", this.updateNextLockedCol(this.colGroupMain.parentElement, s, f - n);
}
if (this.colGroupHeader && this.colGroupHeader.children[o]) {
const f = parseInt(this.colGroupHeader.children[o].width, 10);
this.colGroupHeader.children[o].width = n + "px", this.updateNextLockedCol(this.colGroupHeader.parentElement, s, f - n);
}
if (this.colGroupFooter && this.colGroupFooter.children[o]) {
const f = parseInt(this.colGroupFooter.children[o].width, 10);
this.colGroupFooter.children[o].width = n + "px", this.updateNextLockedCol(this.colGroupFooter.parentElement, s, f - n);
}
}
}, this.onResize = a;
}
applyWidthConstraints(a, h, l = 1) {
if (!a.width)
return a.width || "";
const r = a.width.toString();
if (r.includes("%")) {
const f = parseFloat(r) * l, d = Math.max(0, Math.min(100, f));
return a.width = d + "%", a.width;
}
let e = parseFloat(r) * l;
const o = h.minResizableWidth === void 0 ? 10 : h.minResizableWidth, t = h == null ? void 0 : h.minWidth, i = t !== void 0 ? Math.max(o, t) : o, n = h == null ? void 0 : h.maxWidth;
return e < i && (e = i), n !== void 0 && e > n && (e = n), a.width = e, e;
}
fixateInitialWidths(a) {
var o;
let h = 0;
const l = ((o = this.colGroupMain) == null ? void 0 : o.children) || [];
for (let t = 0; t < l.length; t++)
l[t].width ? a -= l[t].clientWidth : h++;
if (h === 0)
return;
const r = Math.floor(a / h), c = u(this.columnsState), e = this.columns.filter((t) => !t.children.length);
for (let t = 0; t < l.length; t++) {
const i = l[t], n = i.width ? i.clientWidth : r;
i.width = n;
const s = c.find((f) => f.id === e[t].id);
s && (s.width = n.toString()), this.colGroupHeader && (this.colGroupHeader.children[t].width = n), this.colGroupFooter && (this.colGroupFooter.children[t].width = n);
}
}
setWidths(a, h) {
const l = u(this.columnsState), r = this.columns.findIndex((t) => t.id === a.id), c = [];
let e = a.children.filter((t) => !t.hidden).length;
for (let t = r + 1; t < this.columns.length && !(e <= 0); t++) {
const i = this.columns[t];
i.children.length ? e += i.children.filter((n) => !n.hidden).length : c.push(i), e--;
}
c.length === 0 && c.push(a);
const o = [];
c.forEach((t) => {
const i = l.find((n) => n.id === t.id);
i && (this.applyWidthConstraints(i, t, h), o.push(i));
}), this.updateColElements(o);
}
updateNextLockedCol(a, h, l) {
const r = h.index, c = this.colGroupMain.parentElement.closest(".k-grid"), e = c == null ? void 0 : c.clientWidth, o = this.columns.filter((t) => t.locked).map((t) => parseInt(t.width + "", 10)).reduce((t, i) => t + i, 0);
!h.locked || e <= o + W || this.columns.forEach((t) => {
if (t != null && t.locked && l) {
const i = a == null ? void 0 : a.querySelectorAll('[aria-colindex="' + t.ariaColumnIndex + '"]');
i == null || i.forEach((n) => {
const s = n.style;
this.isRtl ? (t.index > r && s && s.right && (s.right = parseInt(s.right, 10) - l + "px"), t.index < r && s && s.left && (s.left = parseInt(s.left, 10) - l + "px")) : (t.index > r && s && s.left && (s.left = parseInt(s.left, 10) - l + "px"), t.index < r && s && s.right && (s.right = parseInt(s.right, 10) - l + "px"));
});
}
});
}
}
export {
F as ColumnResize
};