@progress/kendo-react-data-tools
Version:
Includes React Pager & React Filter component, an intuitive interface to create complex filter descriptions. KendoReact Data Tools package
89 lines (88 loc) • 4.65 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 { getIndex as o } from "../header/utils/index.mjs";
class m {
constructor(r, i, u) {
this.columns = [], this.reorderable = !1, this.groupable = !1, this.startColumn = -1, this.startGroup = -1, this.currentColumn = -1, this.currentGroup = -1, this.dropElementClue = null, this.dragElementClue = null, this.groupPanelDivElement = null, this.refGroupPanelDiv = (t) => {
this.groupPanelDivElement = t;
}, this.refDropElementClue = (t) => {
this.dropElementClue = t;
}, this.refDragElementClue = (t) => {
this.dragElementClue = t;
}, this.pressHandler = (t, e) => {
const s = this.getColumnIndex(t, e);
if (this.startGroup = this.getGroupIndex(t), s >= 0) {
const n = this.columns[s];
(n.reorderable && this.reorderable || n.groupable && this.groupable) && (this.startColumn = s);
}
}, this.dragHandler = (t, e) => {
if (t.isTouch || t.originalEvent.preventDefault(), t.originalEvent.stopPropagation(), this.startColumn === -1 && this.startGroup === -1)
return;
this.currentColumn = this.getColumnIndex(t, e), this.currentGroup = this.getGroupIndex(t), this.groupPanelDivElement && this.startGroup >= 0 && (this.currentGroup = Math.min(this.currentGroup, this.groupPanelDivElement.children.length - 2));
const s = !this.isValid();
s && (this.currentColumn = -1, this.currentGroup = -1);
const n = this.currentColumn >= 0 ? e.children[this.columns[this.currentColumn].index] : this.groupPanelDivElement && this.groupPanelDivElement.children[this.currentGroup];
this.updateDragElementClue(t, e, n, s), this.updateDropElementClue(t, e, n, s);
}, this.releaseHandler = (t) => {
const e = this.startColumn, s = this.currentColumn, n = this.startGroup, l = this.currentGroup;
this.dropElementClue && this.dropElementClue.setState({ visible: !1 }), this.dragElementClue && this.dragElementClue.setState({ visible: !1 });
const h = this.isValid();
this.startColumn = this.startGroup = this.currentColumn = this.currentGroup = -1, h && (e >= 0 && s >= 0 ? this.columnReorder(e, s, t.originalEvent) : n >= 0 && l >= 0 ? this.groupReorder(n, l, t.originalEvent) : e >= 0 && l >= 0 && this.columnToGroup(e, l, t.originalEvent));
}, this.columnReorder = r, this.groupReorder = i, this.columnToGroup = u;
}
getColumnIndex(r, i) {
if (!i || i.parentElement === this.groupPanelDivElement)
return -1;
const u = o(r, i);
if (u === -1)
return -1;
for (let t = 0; t < i.parentNode.children.length; t++)
if (i.parentNode.children[t] === i)
return this.columns.findIndex((e) => e.index === u && e.depth === t);
return -1;
}
getGroupIndex(r) {
return o(r, this.groupPanelDivElement);
}
isValid() {
return this.startGroup >= 0 ? this.currentGroup >= 0 && this.currentGroup !== this.startGroup : this.startColumn === -1 ? !1 : this.currentGroup >= 0 ? this.columns[this.startColumn].groupable === !0 && this.groupable === !0 : this.reorderable === !0 && this.currentColumn >= 0 && this.currentColumn !== this.startColumn && this.columns[this.startColumn].reorderable === !0 && this.columns[this.currentColumn].parentIndex === this.columns[this.startColumn].parentIndex;
}
updateDragElementClue(r, i, u, t) {
if (!this.dragElementClue)
return;
const e = this.startColumn >= 0 ? i.children[this.columns[this.startColumn].index].innerText : i.innerText;
this.dragElementClue.setState({
visible: !0,
top: r.pageY + 10,
left: r.pageX,
innerText: e,
status: t || !u ? "k-i-cancel" : "k-i-plus"
});
}
updateDropElementClue(r, i, u, t) {
if (!this.dropElementClue)
return;
if (t || !u) {
this.dropElementClue.setState({ visible: !1 });
return;
}
const e = u.getBoundingClientRect();
let s = e.left + r.pageX - r.clientX - 6;
(this.currentColumn > this.startColumn || this.currentGroup > this.startGroup && this.startGroup !== -1) && (s += e.width);
const n = e.top + r.pageY - r.clientY;
this.dropElementClue.setState({
visible: !0,
top: n,
left: s,
height: this.currentColumn >= 0 ? i.clientHeight : e.height
});
}
}
export {
m as CommonDragLogic
};