@toolbox-web/grid 1.6.2 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/all.js +9 -8
- package/all.js.map +1 -1
- package/index.js +668 -583
- package/index.js.map +1 -1
- package/lib/core/grid.d.ts +46 -0
- package/lib/core/grid.d.ts.map +1 -1
- package/lib/core/types.d.ts +114 -0
- package/lib/core/types.d.ts.map +1 -1
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/ContextMenuPlugin.d.ts.map +1 -1
- package/lib/plugins/context-menu/index.js +72 -71
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/print/PrintPlugin.d.ts.map +1 -1
- package/lib/plugins/print/index.js +1 -1
- package/lib/plugins/print/index.js.map +1 -1
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/responsive/index.js.map +1 -1
- package/lib/plugins/row-reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/public.d.ts +1 -1
- package/public.d.ts.map +1 -1
- package/umd/grid.all.umd.js +13 -13
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +11 -11
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/context-menu.umd.js +1 -1
- package/umd/plugins/context-menu.umd.js.map +1 -1
- package/umd/plugins/print.umd.js +1 -1
- package/umd/plugins/print.umd.js.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuPlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/ContextMenuPlugin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAG/D,OAAO,KAAK,EAAE,iBAAiB,EAAmB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAkCrF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,qBAAa,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IACtE,gBAAgB;IAChB,QAAQ,CAAC,IAAI,iBAAiB;IAE9B,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,iBAAiB,CAAC,CAIjE;IAGD,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAkC;IAChD,OAAO,CAAC,WAAW,CAA4B;IAK/C,gBAAgB;IACP,MAAM,CAAC,IAAI,EAAE,OAAO,+BAA+B,EAAE,WAAW,GAAG,IAAI;IAMhF,gBAAgB;IACP,MAAM,IAAI,IAAI;IAavB;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAoCtC;IAEF;;;;OAIG;IACH,OAAO,CAAC,cAAc;
|
|
1
|
+
{"version":3,"file":"ContextMenuPlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/ContextMenuPlugin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAG/D,OAAO,KAAK,EAAE,iBAAiB,EAAmB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAkCrF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,qBAAa,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IACtE,gBAAgB;IAChB,QAAQ,CAAC,IAAI,iBAAiB;IAE9B,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,iBAAiB,CAAC,CAIjE;IAGD,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAkC;IAChD,OAAO,CAAC,WAAW,CAA4B;IAK/C,gBAAgB;IACP,MAAM,CAAC,IAAI,EAAE,OAAO,+BAA+B,EAAE,WAAW,GAAG,IAAI;IAMhF,gBAAgB;IACP,MAAM,IAAI,IAAI;IAavB;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAoCtC;IAEF;;;;OAIG;IACH,OAAO,CAAC,cAAc;IA2BtB,OAAO,CAAC,qBAAqB;IAqC7B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAsB/B,gBAAgB;IACP,WAAW,IAAI,IAAI;IA2F5B;;;;;OAKG;IACH,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAAG,IAAI;IAoCxE;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;;OAGG;IACH,UAAU,IAAI,OAAO;CAMtB"}
|
|
@@ -311,56 +311,56 @@ class M {
|
|
|
311
311
|
}
|
|
312
312
|
// #endregion
|
|
313
313
|
}
|
|
314
|
-
const w = "@layer tbw-plugins{.tbw-context-menu{position:fixed;background:var(--tbw-context-menu-bg, var(--tbw-color-panel-bg));color:var(--tbw-context-menu-fg, var(--tbw-color-fg));border:1px solid var(--tbw-context-menu-border, var(--tbw-color-border));border-radius:var(--tbw-context-menu-radius, var(--tbw-border-radius));box-shadow:
|
|
315
|
-
function x(
|
|
316
|
-
return (typeof
|
|
314
|
+
const w = "@layer tbw-plugins{.tbw-context-menu{position:fixed;background:var(--tbw-context-menu-bg, var(--tbw-color-panel-bg));color:var(--tbw-context-menu-fg, var(--tbw-color-fg));border:1px solid var(--tbw-context-menu-border, var(--tbw-color-border));border-radius:var(--tbw-context-menu-radius, var(--tbw-border-radius));box-shadow:var(--tbw-context-menu-shadow, 0 2px 10px var(--tbw-color-shadow));min-width:var(--tbw-context-menu-min-width, var(--tbw-menu-min-width));padding:var(--tbw-spacing-xs) 0;z-index:10000;font-size:var(--tbw-context-menu-font-size, var(--tbw-font-size-sm));font-family:var(--tbw-context-menu-font-family, var(--tbw-font-family))}.tbw-context-menu-item{display:flex;align-items:center;padding:var(--tbw-context-menu-item-padding, var(--tbw-menu-item-padding));cursor:pointer;gap:var(--tbw-context-menu-item-gap, var(--tbw-menu-item-gap))}.tbw-context-menu-item:hover:not(.disabled){background:var(--tbw-context-menu-hover, var(--tbw-color-row-hover))}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:var(--tbw-context-menu-danger, var(--tbw-color-danger))}.tbw-context-menu-icon{width:var(--tbw-context-menu-icon-size, var(--tbw-icon-size));text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted));font-size:var(--tbw-context-menu-shortcut-size, var(--tbw-font-size-xs))}.tbw-context-menu-arrow{font-size:var(--tbw-context-menu-arrow-size, var(--tbw-font-size-2xs));color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted))}.tbw-context-menu-separator{height:1px;background:var(--tbw-context-menu-border, var(--tbw-color-border));margin:var(--tbw-spacing-xs) 0}}";
|
|
315
|
+
function x(s, e) {
|
|
316
|
+
return (typeof s == "function" ? s(e) : s).filter((n) => !(n.hidden === !0 || typeof n.hidden == "function" && n.hidden(e)));
|
|
317
317
|
}
|
|
318
|
-
function z(
|
|
319
|
-
return
|
|
318
|
+
function z(s, e) {
|
|
319
|
+
return s.disabled === !0 ? !0 : typeof s.disabled == "function" ? s.disabled(e) : !1;
|
|
320
320
|
}
|
|
321
|
-
function v(
|
|
322
|
-
const
|
|
323
|
-
|
|
324
|
-
for (const
|
|
325
|
-
if (
|
|
321
|
+
function v(s, e, t, n = I.submenuArrow) {
|
|
322
|
+
const r = document.createElement("div");
|
|
323
|
+
r.className = "tbw-context-menu", r.setAttribute("role", "menu");
|
|
324
|
+
for (const i of s) {
|
|
325
|
+
if (i.separator) {
|
|
326
326
|
const l = document.createElement("div");
|
|
327
|
-
l.className = "tbw-context-menu-separator", l.setAttribute("role", "separator"),
|
|
327
|
+
l.className = "tbw-context-menu-separator", l.setAttribute("role", "separator"), r.appendChild(l);
|
|
328
328
|
continue;
|
|
329
329
|
}
|
|
330
|
-
const
|
|
331
|
-
|
|
332
|
-
const
|
|
333
|
-
if (
|
|
330
|
+
const o = document.createElement("div");
|
|
331
|
+
o.className = "tbw-context-menu-item", i.cssClass && o.classList.add(i.cssClass), o.setAttribute("role", "menuitem"), o.setAttribute("data-id", i.id);
|
|
332
|
+
const u = z(i, e);
|
|
333
|
+
if (u && (o.classList.add("disabled"), o.setAttribute("aria-disabled", "true")), i.icon) {
|
|
334
334
|
const l = document.createElement("span");
|
|
335
|
-
l.className = "tbw-context-menu-icon", l.innerHTML =
|
|
335
|
+
l.className = "tbw-context-menu-icon", l.innerHTML = i.icon, o.appendChild(l);
|
|
336
336
|
}
|
|
337
|
-
const
|
|
338
|
-
if (
|
|
337
|
+
const c = document.createElement("span");
|
|
338
|
+
if (c.className = "tbw-context-menu-label", c.textContent = i.name, o.appendChild(c), i.shortcut) {
|
|
339
339
|
const l = document.createElement("span");
|
|
340
|
-
l.className = "tbw-context-menu-shortcut", l.textContent =
|
|
340
|
+
l.className = "tbw-context-menu-shortcut", l.textContent = i.shortcut, o.appendChild(l);
|
|
341
341
|
}
|
|
342
|
-
if (
|
|
342
|
+
if (i.subMenu?.length) {
|
|
343
343
|
const l = document.createElement("span");
|
|
344
|
-
l.className = "tbw-context-menu-arrow", typeof n == "string" ? l.innerHTML = n : n instanceof HTMLElement && l.appendChild(n.cloneNode(!0)),
|
|
345
|
-
if (
|
|
346
|
-
const b = x(
|
|
347
|
-
d.classList.add("tbw-context-submenu"), d.style.position = "absolute", d.style.left = "100%", d.style.top = "0",
|
|
348
|
-
}),
|
|
349
|
-
const
|
|
350
|
-
|
|
344
|
+
l.className = "tbw-context-menu-arrow", typeof n == "string" ? l.innerHTML = n : n instanceof HTMLElement && l.appendChild(n.cloneNode(!0)), o.appendChild(l), o.addEventListener("mouseenter", () => {
|
|
345
|
+
if (o.querySelector(".tbw-context-menu") || !i.subMenu) return;
|
|
346
|
+
const b = x(i.subMenu, e), d = v(b, e, t, n);
|
|
347
|
+
d.classList.add("tbw-context-submenu"), d.style.position = "absolute", d.style.left = "100%", d.style.top = "0", o.style.position = "relative", o.appendChild(d);
|
|
348
|
+
}), o.addEventListener("mouseleave", () => {
|
|
349
|
+
const a = o.querySelector(".tbw-context-menu");
|
|
350
|
+
a && a.remove();
|
|
351
351
|
});
|
|
352
352
|
}
|
|
353
|
-
!
|
|
354
|
-
l.stopPropagation(), t(
|
|
355
|
-
}),
|
|
353
|
+
!u && i.action && !i.subMenu && o.addEventListener("click", (l) => {
|
|
354
|
+
l.stopPropagation(), t(i);
|
|
355
|
+
}), r.appendChild(o);
|
|
356
356
|
}
|
|
357
|
-
return
|
|
357
|
+
return r;
|
|
358
358
|
}
|
|
359
|
-
function C(
|
|
360
|
-
|
|
361
|
-
const n =
|
|
362
|
-
let
|
|
363
|
-
e + n.width >
|
|
359
|
+
function C(s, e, t) {
|
|
360
|
+
s.style.position = "fixed", s.style.left = `${e}px`, s.style.top = `${t}px`, s.style.visibility = "hidden", s.style.zIndex = "10000";
|
|
361
|
+
const n = s.getBoundingClientRect(), r = window.innerWidth, i = window.innerHeight;
|
|
362
|
+
let o = e, u = t;
|
|
363
|
+
e + n.width > r && (o = e - n.width), t + n.height > i && (u = t - n.height), o = Math.max(0, o), u = Math.max(0, u), s.style.left = `${o}px`, s.style.top = `${u}px`, s.style.visibility = "visible";
|
|
364
364
|
}
|
|
365
365
|
let h = null, f = null, m = null, g = 0;
|
|
366
366
|
const p = [
|
|
@@ -368,16 +368,16 @@ const p = [
|
|
|
368
368
|
id: "copy",
|
|
369
369
|
name: "Copy",
|
|
370
370
|
shortcut: "Ctrl+C",
|
|
371
|
-
action: (
|
|
372
|
-
|
|
371
|
+
action: (s) => {
|
|
372
|
+
s.grid?.plugins?.clipboard?.copy?.();
|
|
373
373
|
}
|
|
374
374
|
},
|
|
375
375
|
{ separator: !0, id: "sep1", name: "" },
|
|
376
376
|
{
|
|
377
377
|
id: "export-csv",
|
|
378
378
|
name: "Export CSV",
|
|
379
|
-
action: (
|
|
380
|
-
|
|
379
|
+
action: (s) => {
|
|
380
|
+
s.grid?.plugins?.export?.exportCsv?.();
|
|
381
381
|
}
|
|
382
382
|
}
|
|
383
383
|
];
|
|
@@ -456,14 +456,15 @@ class S extends M {
|
|
|
456
456
|
copyGridStyles(e) {
|
|
457
457
|
const t = this.gridElement;
|
|
458
458
|
if (!t) return;
|
|
459
|
-
const n = getComputedStyle(t),
|
|
459
|
+
const n = getComputedStyle(t), r = [], i = n.getPropertyValue("color-scheme").trim();
|
|
460
|
+
i && r.push(`color-scheme: ${i}`);
|
|
460
461
|
for (const o of S.CSS_VARS_TO_COPY) {
|
|
461
|
-
const
|
|
462
|
-
|
|
462
|
+
const u = n.getPropertyValue(o).trim();
|
|
463
|
+
u && r.push(`${o}: ${u}`);
|
|
463
464
|
}
|
|
464
|
-
if (
|
|
465
|
+
if (r.length > 0) {
|
|
465
466
|
const o = e.getAttribute("style") || "";
|
|
466
|
-
e.setAttribute("style", o +
|
|
467
|
+
e.setAttribute("style", o + r.join("; ") + ";");
|
|
467
468
|
}
|
|
468
469
|
}
|
|
469
470
|
installGlobalHandlers() {
|
|
@@ -488,46 +489,46 @@ class S extends M {
|
|
|
488
489
|
if (!e) return;
|
|
489
490
|
const t = e.children[0];
|
|
490
491
|
t && t.getAttribute("data-context-menu-bound") !== "true" && (t.setAttribute("data-context-menu-bound", "true"), t.addEventListener("contextmenu", (n) => {
|
|
491
|
-
const
|
|
492
|
-
|
|
493
|
-
const
|
|
494
|
-
let
|
|
495
|
-
if (
|
|
496
|
-
const
|
|
497
|
-
|
|
492
|
+
const r = n;
|
|
493
|
+
r.preventDefault();
|
|
494
|
+
const i = r.target, o = i.closest("[data-row][data-col]"), u = i.closest(".header-cell");
|
|
495
|
+
let c;
|
|
496
|
+
if (o) {
|
|
497
|
+
const a = parseInt(o.getAttribute("data-row") ?? "-1", 10), b = parseInt(o.getAttribute("data-col") ?? "-1", 10), d = this.columns[b], E = this.rows[a];
|
|
498
|
+
c = {
|
|
498
499
|
row: E,
|
|
499
|
-
rowIndex:
|
|
500
|
+
rowIndex: a,
|
|
500
501
|
column: d,
|
|
501
502
|
columnIndex: b,
|
|
502
503
|
field: d?.field ?? "",
|
|
503
504
|
value: E?.[d?.field] ?? null,
|
|
504
505
|
isHeader: !1,
|
|
505
|
-
event:
|
|
506
|
+
event: r
|
|
506
507
|
};
|
|
507
|
-
} else if (
|
|
508
|
-
const
|
|
509
|
-
|
|
508
|
+
} else if (u) {
|
|
509
|
+
const a = parseInt(u.getAttribute("data-col") ?? "-1", 10), b = this.columns[a];
|
|
510
|
+
c = {
|
|
510
511
|
row: null,
|
|
511
512
|
rowIndex: -1,
|
|
512
513
|
column: b,
|
|
513
|
-
columnIndex:
|
|
514
|
+
columnIndex: a,
|
|
514
515
|
field: b?.field ?? "",
|
|
515
516
|
value: null,
|
|
516
517
|
isHeader: !0,
|
|
517
|
-
event:
|
|
518
|
+
event: r
|
|
518
519
|
};
|
|
519
520
|
} else
|
|
520
521
|
return;
|
|
521
|
-
this.params =
|
|
522
|
-
const l = x(this.config.items ?? p,
|
|
522
|
+
this.params = c, this.position = { x: r.clientX, y: r.clientY };
|
|
523
|
+
const l = x(this.config.items ?? p, c);
|
|
523
524
|
l.length && (this.menuElement && this.menuElement.remove(), this.menuElement = v(
|
|
524
525
|
l,
|
|
525
|
-
|
|
526
|
-
(
|
|
527
|
-
|
|
526
|
+
c,
|
|
527
|
+
(a) => {
|
|
528
|
+
a.action && a.action(c), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
|
|
528
529
|
},
|
|
529
530
|
this.gridIcons.submenuArrow
|
|
530
|
-
), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), C(this.menuElement,
|
|
531
|
+
), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), C(this.menuElement, r.clientX, r.clientY), this.isOpen = !0, this.emit("context-menu-open", { params: c, items: l }));
|
|
531
532
|
}));
|
|
532
533
|
}
|
|
533
534
|
// #endregion
|
|
@@ -539,7 +540,7 @@ class S extends M {
|
|
|
539
540
|
* @param params - Partial context menu parameters
|
|
540
541
|
*/
|
|
541
542
|
showMenu(e, t, n) {
|
|
542
|
-
const
|
|
543
|
+
const r = {
|
|
543
544
|
row: n.row ?? null,
|
|
544
545
|
rowIndex: n.rowIndex ?? -1,
|
|
545
546
|
column: n.column ?? null,
|
|
@@ -548,12 +549,12 @@ class S extends M {
|
|
|
548
549
|
value: n.value ?? null,
|
|
549
550
|
isHeader: n.isHeader ?? !1,
|
|
550
551
|
event: n.event ?? new MouseEvent("contextmenu")
|
|
551
|
-
},
|
|
552
|
+
}, i = x(this.config.items ?? p, r);
|
|
552
553
|
this.menuElement && this.menuElement.remove(), this.menuElement = v(
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
(
|
|
556
|
-
|
|
554
|
+
i,
|
|
555
|
+
r,
|
|
556
|
+
(o) => {
|
|
557
|
+
o.action && o.action(r), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
|
|
557
558
|
},
|
|
558
559
|
this.gridIcons.submenuArrow
|
|
559
560
|
), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), C(this.menuElement, e, t), this.isOpen = !0;
|