@toolbox-web/grid 1.2.0 → 1.3.1

package/lib/plugins/multi-sort/index.js

@@ -1,4 +1,4 @@
-const b = {
+const h = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', b = {
   expand: "▶",
   collapse: "▼",
   sortAsc: "▲",
@@ -6,9 +6,11 @@ const b = {
   sortNone: "⇅",
   submenuArrow: "▶",
   dragHandle: "⋮⋮",
-  toolPanel: "☰"
+  toolPanel: "☰",
+  filter: h,
+  filterActive: h
 };
-class x {
+class C {
   /**
    * Plugin dependencies - declare other plugins this one requires.
    *
@@ -321,23 +323,23 @@ function S(r, t, e) {
 function y(r, t) {
   return r == null && t == null ? 0 : r == null ? 1 : t == null ? -1 : typeof r == "number" && typeof t == "number" ? r - t : r instanceof Date && t instanceof Date ? r.getTime() - t.getTime() : typeof r == "boolean" && typeof t == "boolean" ? r === t ? 0 : r ? -1 : 1 : String(r).localeCompare(String(t));
 }
-function C(r, t, e, o) {
+function M(r, t, e, o) {
   const i = r.find((n) => n.field === t);
   return e ? i ? i.direction === "asc" ? r.map((n) => n.field === t ? { ...n, direction: "desc" } : n) : r.filter((n) => n.field !== t) : r.length < o ? [...r, { field: t, direction: "asc" }] : r : i?.direction === "asc" ? [{ field: t, direction: "desc" }] : i?.direction === "desc" ? [] : [{ field: t, direction: "asc" }];
 }
-function h(r, t) {
+function m(r, t) {
   const e = r.findIndex((o) => o.field === t);
   return e >= 0 ? e + 1 : void 0;
 }
-function m(r, t) {
+function p(r, t) {
   return r.find((e) => e.field === t)?.direction;
 }
-const M = '@layer tbw-plugins{.header-cell[data-sort=asc]:after{content:"↑";margin-left:4px;opacity:.8}.header-cell[data-sort=desc]:after{content:"↓";margin-left:4px;opacity:.8}.sort-indicator{margin-left:4px;opacity:.8}.sort-index{font-size:10px;background:var(--tbw-multi-sort-badge-bg, var(--tbw-color-panel-bg));color:var(--tbw-multi-sort-badge-color, var(--tbw-color-fg));border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;margin-left:2px;font-weight:600}}';
-class I extends x {
+const I = '@layer tbw-plugins{.header-cell[data-sort=asc]:after{content:"↑";margin-left:4px;opacity:.8}.header-cell[data-sort=desc]:after{content:"↓";margin-left:4px;opacity:.8}.sort-indicator{margin-left:4px;opacity:.8}.sort-index{font-size:10px;background:var(--tbw-multi-sort-badge-bg, var(--tbw-color-panel-bg));color:var(--tbw-multi-sort-badge-color, var(--tbw-color-fg));border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;margin-left:2px;font-weight:600}}';
+class v extends C {
   /** @internal */
   name = "multiSort";
   /** @internal */
-  styles = M;
+  styles = I;
   /** @internal */
   get defaultConfig() {
     return {
@@ -363,7 +365,7 @@ class I extends x {
   onHeaderClick(t) {
     if (!this.columns.find((n) => n.field === t.field)?.sortable) return !1;
     const o = t.originalEvent.shiftKey, i = this.config.maxSortColumns ?? 3;
-    return this.sortModel = C(this.sortModel, t.field, o, i), this.emit("sort-change", { sortModel: [...this.sortModel] }), this.requestRender(), !0;
+    return this.sortModel = M(this.sortModel, t.field, o, i), this.emit("sort-change", { sortModel: [...this.sortModel] }), this.requestRender(), !0;
   }
   /** @internal */
   afterRender() {
@@ -373,12 +375,12 @@ class I extends x {
     t.querySelectorAll(".header-row .cell[data-field]").forEach((i) => {
       const n = i.getAttribute("data-field");
       if (!n) return;
-      const a = h(this.sortModel, n), d = m(this.sortModel, n);
+      const a = m(this.sortModel, n), d = p(this.sortModel, n);
       if (i.querySelector(".sort-index")?.remove(), d) {
         i.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove(), i.setAttribute("data-sort", d);
         const s = document.createElement("span");
         s.className = "sort-indicator", this.setIcon(s, this.resolveIcon(d === "asc" ? "sortAsc" : "sortDesc"));
-        const c = i.querySelector(".tbw-filter-btn"), p = i.querySelector(".resize-handle"), g = c ?? p;
+        const c = i.querySelector(".tbw-filter-btn"), x = i.querySelector(".resize-handle"), g = c ?? x;
         if (g ? i.insertBefore(s, g) : i.appendChild(s), e && this.sortModel.length > 1 && a !== void 0) {
           const l = document.createElement("span");
           l.className = "sort-index", l.textContent = String(a), s.nextSibling ? i.insertBefore(l, s.nextSibling) : i.appendChild(l);
@@ -415,7 +417,7 @@ class I extends x {
    * @returns 1-based index or undefined if not sorted
    */
   getSortIndex(t) {
-    return h(this.sortModel, t);
+    return m(this.sortModel, t);
   }
   /**
    * Get the sort direction for a specific field.
@@ -423,7 +425,7 @@ class I extends x {
    * @returns Sort direction or undefined if not sorted
    */
   getSortDirection(t) {
-    return m(this.sortModel, t);
+    return p(this.sortModel, t);
   }
   // #endregion
   // #region Column State Hooks
@@ -459,6 +461,6 @@ class I extends x {
   // #endregion
 }
 export {
-  I as MultiSortPlugin
+  v as MultiSortPlugin
 };
 //# sourceMappingURL=index.js.map