@toolbox-web/grid 1.6.2 → 1.8.0

package/lib/plugins/tree/TreePlugin.d.ts

@@ -1,4 +1,4 @@
-import { BaseGridPlugin, CellClickEvent, HeaderClickEvent } from '../../core/plugin/base-plugin';
+import { BaseGridPlugin, CellClickEvent, HeaderClickEvent, PluginManifest, PluginQuery } from '../../core/plugin/base-plugin';
 import { ColumnConfig } from '../../core/types';
 import { FlattenedTreeRow, TreeConfig, TreeRow } from './types';
 /**
@@ -87,6 +87,7 @@ import { FlattenedTreeRow, TreeConfig, TreeRow } from './types';
  * @internal Extends BaseGridPlugin
  */
 export declare class TreePlugin extends BaseGridPlugin<TreeConfig> {
+    static readonly manifest: PluginManifest;
     /** @internal */
     readonly name = "tree";
     /** @internal */
@@ -102,6 +103,11 @@ export declare class TreePlugin extends BaseGridPlugin<TreeConfig> {
     private sortState;
     /** @internal */
     detach(): void;
+    /**
+     * Handle plugin queries.
+     * @internal
+     */
+    handleQuery(query: PluginQuery): unknown;
     /**
      * Get expand/collapse animation style from plugin config.
      * Uses base class isAnimationEnabled to respect grid-level settings.

package/lib/plugins/tree/TreePlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TreePlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/tree/TreePlugin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjG,OAAO,KAAK,EAAE,YAAY,EAAsB,MAAM,kBAAkB,CAAC;AAIzE,OAAO,KAAK,EAA2B,gBAAgB,EAAE,UAAU,EAAoB,OAAO,EAAE,MAAM,SAAS,CAAC;AAMhH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,qBAAa,UAAW,SAAQ,cAAc,CAAC,UAAU,CAAC;IACxD,gBAAgB;IAChB,QAAQ,CAAC,IAAI,UAAU;IACvB,gBAAgB;IAChB,SAAkB,MAAM,SAAU;IAElC,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,UAAU,CAAC,CAS1D;IAID,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,oBAAoB,CAAS;IACrC,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,SAAS,CAAuC;IACxD,OAAO,CAAC,mBAAmB,CAAqB;IAChD,OAAO,CAAC,aAAa,CAAqB;IAC1C,OAAO,CAAC,SAAS,CAAqD;IAEtE,gBAAgB;IACP,MAAM,IAAI,IAAI;IAcvB;;;OAGG;IACH,OAAO,KAAK,cAAc,GAGzB;IAMD,MAAM,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,GAAG,OAAO;IAWzC,gBAAgB;IACP,WAAW,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,GAAG,OAAO,EAAE;IA+CzD,wEAAwE;IACxE,OAAO,CAAC,cAAc;IAetB,qCAAqC;IACrC,OAAO,CAAC,WAAW;IA2BnB,2DAA2D;IAC3D,OAAO,CAAC,QAAQ;IAkBhB,gBAAgB;IACP,cAAc,CAAC,OAAO,EAAE,SAAS,YAAY,EAAE,GAAG,YAAY,EAAE;IAwEzE,gBAAgB;IACP,WAAW,CAAC,KAAK,EAAE,cAAc,GAAG,OAAO;IAqBpD,gBAAgB;IACP,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,GAAG,IAAI;IAoBxD,gBAAgB;IACP,aAAa,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO;IAuBxD,gBAAgB;IACP,WAAW,IAAI,IAAI;IAyB5B,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAK3B,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,SAAS,IAAI,IAAI;IAKjB,WAAW,IAAI,IAAI;IAKnB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIhC,eAAe,IAAI,MAAM,EAAE;IAI3B,gBAAgB,IAAI,gBAAgB,EAAE;IAItC,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS;IAI7C,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;CAM/B"}
+{"version":3,"file":"TreePlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/tree/TreePlugin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EACL,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,KAAK,cAAc,EACnB,KAAK,WAAW,EACjB,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,YAAY,EAAsB,MAAM,kBAAkB,CAAC;AAIzE,OAAO,KAAK,EAA2B,gBAAgB,EAAE,UAAU,EAAoB,OAAO,EAAE,MAAM,SAAS,CAAC;AAMhH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,qBAAa,UAAW,SAAQ,cAAc,CAAC,UAAU,CAAC;IACxD,gBAAyB,QAAQ,EAAE,cAAc,CAa/C;IAEF,gBAAgB;IAChB,QAAQ,CAAC,IAAI,UAAU;IACvB,gBAAgB;IAChB,SAAkB,MAAM,SAAU;IAElC,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,UAAU,CAAC,CAS1D;IAID,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,oBAAoB,CAAS;IACrC,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,SAAS,CAAuC;IACxD,OAAO,CAAC,mBAAmB,CAAqB;IAChD,OAAO,CAAC,aAAa,CAAqB;IAC1C,OAAO,CAAC,SAAS,CAAqD;IAEtE,gBAAgB;IACP,MAAM,IAAI,IAAI;IAUvB;;;OAGG;IACM,WAAW,CAAC,KAAK,EAAE,WAAW,GAAG,OAAO;IAejD;;;OAGG;IACH,OAAO,KAAK,cAAc,GAGzB;IAMD,MAAM,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,GAAG,OAAO;IAWzC,gBAAgB;IACP,WAAW,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,GAAG,OAAO,EAAE;IA+CzD,wEAAwE;IACxE,OAAO,CAAC,cAAc;IAetB,qCAAqC;IACrC,OAAO,CAAC,WAAW;IA2BnB,2DAA2D;IAC3D,OAAO,CAAC,QAAQ;IAkBhB,gBAAgB;IACP,cAAc,CAAC,OAAO,EAAE,SAAS,YAAY,EAAE,GAAG,YAAY,EAAE;IAwEzE,gBAAgB;IACP,WAAW,CAAC,KAAK,EAAE,cAAc,GAAG,OAAO;IAqBpD,gBAAgB;IACP,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,GAAG,IAAI;IAoBxD,gBAAgB;IACP,aAAa,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO;IAuBxD,gBAAgB;IACP,WAAW,IAAI,IAAI;IAyB5B,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAK3B,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAMzB,SAAS,IAAI,IAAI;IAMjB,WAAW,IAAI,IAAI;IAMnB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIhC,eAAe,IAAI,MAAM,EAAE;IAI3B,gBAAgB,IAAI,gBAAgB,EAAE;IAItC,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS;IAI7C,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;CAM/B"}

package/lib/plugins/tree/index.js

@@ -1,4 +1,4 @@
-const m = '<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>', v = {
+const m = '<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>', S = {
   expand: "▶",
   collapse: "▼",
   sortAsc: "▲",
@@ -11,7 +11,7 @@ const m = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentCo
   filterActive: m,
   print: "🖨️"
 };
-class A {
+class E {
   /**
    * Plugin dependencies - declare other plugins this one requires.
    *
@@ -149,6 +149,63 @@ class A {
     const n = new CustomEvent(e, { detail: t, bubbles: !0, cancelable: !0 });
     return this.grid?.dispatchEvent?.(n), n.defaultPrevented;
   }
+  // =========================================================================
+  // Event Bus - Plugin-to-Plugin Communication
+  // =========================================================================
+  /**
+   * Subscribe to an event from another plugin.
+   * The subscription is automatically cleaned up when this plugin is detached.
+   *
+   * @category Plugin Development
+   * @param eventType - The event type to listen for (e.g., 'filter-change')
+   * @param callback - The callback to invoke when the event is emitted
+   *
+   * @example
+   * ```typescript
+   * // In attach() or other initialization
+   * this.on('filter-change', (detail) => {
+   *   console.log('Filter changed:', detail);
+   * });
+   * ```
+   */
+  on(e, t) {
+    this.grid?._pluginManager?.subscribe(this, e, t);
+  }
+  /**
+   * Unsubscribe from a plugin event.
+   *
+   * @category Plugin Development
+   * @param eventType - The event type to stop listening for
+   *
+   * @example
+   * ```typescript
+   * this.off('filter-change');
+   * ```
+   */
+  off(e) {
+    this.grid?._pluginManager?.unsubscribe(this, e);
+  }
+  /**
+   * Emit an event to other plugins via the Event Bus.
+   * This is for inter-plugin communication only; it does NOT dispatch DOM events.
+   * Use `emit()` to dispatch DOM events that external consumers can listen to.
+   *
+   * @category Plugin Development
+   * @param eventType - The event type to emit (should be declared in manifest.events)
+   * @param detail - The event payload
+   *
+   * @example
+   * ```typescript
+   * // Emit to other plugins (not DOM)
+   * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });
+   *
+   * // For DOM events that consumers can addEventListener to:
+   * this.emit('filter-change', { field: 'name', value: 'Alice' });
+   * ```
+   */
+  emitPluginEvent(e, t) {
+    this.grid?._pluginManager?.emitPluginEvent(e, t);
+  }
   /**
    * Request a re-render of the grid.
    */
@@ -235,7 +292,7 @@ class A {
    */
   get gridIcons() {
     const e = this.grid?.gridConfig?.icons ?? {};
-    return { ...v, ...e };
+    return { ...S, ...e };
   }
   // #region Animation Helpers
   /**
@@ -311,7 +368,7 @@ class A {
   }
   // #endregion
 }
-function R(o, e, t) {
+function v(o, e, t) {
   return o.id !== void 0 ? String(o.id) : t ? `${t}-${e}` : String(e);
 }
 function y(o, e) {
@@ -319,9 +376,9 @@ function y(o, e) {
   return t.has(e) ? t.delete(e) : t.add(e), t;
 }
 function w(o, e, t = null, n = 0) {
-  const i = e.childrenField ?? "children", s = /* @__PURE__ */ new Set();
-  for (let r = 0; r < o.length; r++) {
-    const l = o[r], a = R(l, r, t), d = l[i];
+  const r = e.childrenField ?? "children", s = /* @__PURE__ */ new Set();
+  for (let i = 0; i < o.length; i++) {
+    const l = o[i], a = v(l, i, t), d = l[r];
     if (Array.isArray(d) && d.length > 0) {
       s.add(a);
       const h = w(d, e, a, n + 1);
@@ -330,18 +387,18 @@ function w(o, e, t = null, n = 0) {
   }
   return s;
 }
-function E() {
+function A() {
   return /* @__PURE__ */ new Set();
 }
-function _(o, e, t, n = null, i = 0) {
+function K(o, e, t, n = null, r = 0) {
   const s = t.childrenField ?? "children";
-  for (let r = 0; r < o.length; r++) {
-    const l = o[r], a = R(l, r, n);
+  for (let i = 0; i < o.length; i++) {
+    const l = o[i], a = v(l, i, n);
     if (a === e)
       return [a];
     const d = l[s];
     if (Array.isArray(d) && d.length > 0) {
-      const h = _(d, e, t, a, i + 1);
+      const h = K(d, e, t, a, r + 1);
       if (h)
         return [a, ...h];
     }
@@ -349,11 +406,11 @@ function _(o, e, t, n = null, i = 0) {
   return null;
 }
 function C(o, e, t, n) {
-  const i = _(o, e, t);
-  if (!i) return n;
+  const r = K(o, e, t);
+  if (!r) return n;
   const s = new Set(n);
-  for (let r = 0; r < i.length - 1; r++)
-    s.add(i[r]);
+  for (let i = 0; i < r.length - 1; i++)
+    s.add(r[i]);
   return s;
 }
 function x(o, e = "children") {
@@ -372,14 +429,28 @@ function k(o) {
   for (const t of o)
     if (!(!t || typeof t != "object"))
       for (const n of e) {
-        const i = t[n];
-        if (Array.isArray(i) && i.length > 0)
+        const r = t[n];
+        if (Array.isArray(r) && r.length > 0)
           return n;
       }
   return null;
 }
 const T = "@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{border-right:none!important;padding:0;display:flex;align-items:center;justify-content:flex-start}tbw-grid .header-row .cell[data-field=__tbw_expander]{display:none}tbw-grid .header-row .cell[data-field=__tbw_expander]+.cell{grid-column:1 / 3}tbw-grid .tree-cell-wrapper{display:inline-flex;align-items:center;padding-left:calc(var(--tbw-tree-depth, 0) * var(--tbw-tree-indent-width, var(--tbw-tree-toggle-size, 1.25em)))}tbw-grid .tree-expander{display:flex;align-items:center;justify-content:flex-start;width:100%;height:100%;box-sizing:border-box}tbw-grid .tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-tree-toggle-size, 1.25em);height:var(--tbw-tree-toggle-size, 1.25em);flex-shrink:0}tbw-grid .tree-toggle:hover{color:var(--tbw-tree-accent, var(--tbw-color-accent))}tbw-grid .tree-spacer{width:var(--tbw-tree-toggle-size, 1.25em);display:inline-block;flex-shrink:0}tbw-grid .data-grid-row.tbw-tree-slide-in{animation:tbw-tree-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}tbw-grid .data-grid-row.tbw-tree-fade-in{animation:tbw-tree-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-tree-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}@keyframes tbw-tree-fade-in{0%{opacity:0}to{opacity:1}}}";
-class F extends A {
+class F extends E {
+  static manifest = {
+    events: [
+      {
+        type: "tree-state-change",
+        description: "Emitted when tree expansion state changes (toggle, expand all, collapse all)"
+      }
+    ],
+    queries: [
+      {
+        type: "canMoveRow",
+        description: "Returns false for rows with children (parent nodes cannot be reordered)"
+      }
+    ]
+  };
   /** @internal */
   name = "tree";
   /** @internal */
@@ -407,6 +478,17 @@ class F extends A {
   detach() {
     this.expandedKeys.clear(), this.initialExpansionDone = !1, this.flattenedRows = [], this.rowKeyMap.clear(), this.previousVisibleKeys.clear(), this.keysToAnimate.clear(), this.sortState = null;
   }
+  /**
+   * Handle plugin queries.
+   * @internal
+   */
+  handleQuery(e) {
+    if (e.type === "canMoveRow") {
+      const t = e.context;
+      if (t && t[this.config.childrenField ?? "children"]?.length > 0)
+        return !1;
+    }
+  }
   // #endregion
   // #region Animation
   /**
@@ -430,26 +512,26 @@ class F extends A {
     const t = this.config.childrenField ?? "children", n = e;
     if (!x(n, t))
       return this.flattenedRows = [], this.rowKeyMap.clear(), this.previousVisibleKeys.clear(), [...e];
-    let i = this.withStableKeys(n);
-    this.sortState && (i = this.sortTree(i, this.sortState.field, this.sortState.direction)), this.config.defaultExpanded && !this.initialExpansionDone && (this.expandedKeys = w(i, this.config), this.initialExpansionDone = !0), this.flattenedRows = this.flattenTree(i, this.expandedKeys), this.rowKeyMap.clear(), this.keysToAnimate.clear();
+    let r = this.withStableKeys(n);
+    this.sortState && (r = this.sortTree(r, this.sortState.field, this.sortState.direction)), this.config.defaultExpanded && !this.initialExpansionDone && (this.expandedKeys = w(r, this.config), this.initialExpansionDone = !0), this.flattenedRows = this.flattenTree(r, this.expandedKeys), this.rowKeyMap.clear(), this.keysToAnimate.clear();
     const s = /* @__PURE__ */ new Set();
-    for (const r of this.flattenedRows)
-      this.rowKeyMap.set(r.key, r), s.add(r.key), !this.previousVisibleKeys.has(r.key) && r.depth > 0 && this.keysToAnimate.add(r.key);
-    return this.previousVisibleKeys = s, this.flattenedRows.map((r) => ({
-      ...r.data,
-      __treeKey: r.key,
-      __treeDepth: r.depth,
-      __treeHasChildren: r.hasChildren,
-      __treeExpanded: r.isExpanded
+    for (const i of this.flattenedRows)
+      this.rowKeyMap.set(i.key, i), s.add(i.key), !this.previousVisibleKeys.has(i.key) && i.depth > 0 && this.keysToAnimate.add(i.key);
+    return this.previousVisibleKeys = s, this.flattenedRows.map((i) => ({
+      ...i.data,
+      __treeKey: i.key,
+      __treeDepth: i.depth,
+      __treeHasChildren: i.hasChildren,
+      __treeExpanded: i.isExpanded
     }));
   }
   /** Assign stable keys to rows (preserves key across sort operations) */
   withStableKeys(e, t = null) {
     const n = this.config.childrenField ?? "children";
-    return e.map((i, s) => {
-      const r = i.__stableKey, l = i.id !== void 0 ? String(i.id) : r ?? (t ? `${t}-${s}` : String(s)), a = i[n], d = Array.isArray(a) && a.length > 0;
+    return e.map((r, s) => {
+      const i = r.__stableKey, l = r.id !== void 0 ? String(r.id) : i ?? (t ? `${t}-${s}` : String(s)), a = r[n], d = Array.isArray(a) && a.length > 0;
       return {
-        ...i,
+        ...r,
         __stableKey: l,
         ...d ? { [n]: this.withStableKeys(a, l) } : {}
       };
@@ -457,12 +539,12 @@ class F extends A {
   }
   /** Flatten tree using stable keys */
   flattenTree(e, t, n = 0) {
-    const i = this.config.childrenField ?? "children", s = [];
-    for (const r of e) {
-      const a = r.__stableKey ?? String(r.id ?? "?"), d = r[i], h = Array.isArray(d) && d.length > 0, u = t.has(a);
+    const r = this.config.childrenField ?? "children", s = [];
+    for (const i of e) {
+      const a = i.__stableKey ?? String(i.id ?? "?"), d = i[r], h = Array.isArray(d) && d.length > 0, u = t.has(a);
       s.push({
         key: a,
-        data: r,
+        data: i,
         depth: n,
         hasChildren: h,
         isExpanded: u,
@@ -473,13 +555,13 @@ class F extends A {
   }
   /** Sort tree recursively, keeping children with parents */
   sortTree(e, t, n) {
-    const i = this.config.childrenField ?? "children";
-    return [...e].sort((r, l) => {
-      const a = r[t], d = l[t];
+    const r = this.config.childrenField ?? "children";
+    return [...e].sort((i, l) => {
+      const a = i[t], d = l[t];
       return a == null && d == null ? 0 : a == null ? -1 : d == null ? 1 : a > d ? n : a < d ? -n : 0;
-    }).map((r) => {
-      const l = r[i];
-      return Array.isArray(l) && l.length > 0 ? { ...r, [i]: this.sortTree(l, t, n) } : r;
+    }).map((i) => {
+      const l = i[r];
+      return Array.isArray(l) && l.length > 0 ? { ...i, [r]: this.sortTree(l, t, n) } : i;
     });
   }
   /** @internal */
@@ -487,19 +569,19 @@ class F extends A {
     if (this.flattenedRows.length === 0) return [...e];
     const t = [...e];
     if (t.length === 0) return t;
-    const n = t[0], i = n.viewRenderer, s = () => this.config, r = this.setIcon.bind(this), l = this.resolveIcon.bind(this), a = (d) => {
-      const { row: h, value: u } = d, { showExpandIcons: K = !0, indentWidth: b } = s(), g = h, S = g.__treeDepth ?? 0, f = document.createElement("span");
-      if (f.className = "tree-cell-wrapper", f.style.setProperty("--tbw-tree-depth", String(S)), b !== void 0 && f.style.setProperty("--tbw-tree-indent-width", `${b}px`), K)
+    const n = t[0], r = n.viewRenderer, s = () => this.config, i = this.setIcon.bind(this), l = this.resolveIcon.bind(this), a = (d) => {
+      const { row: h, value: u } = d, { showExpandIcons: R = !0, indentWidth: b } = s(), g = h, _ = g.__treeDepth ?? 0, f = document.createElement("span");
+      if (f.className = "tree-cell-wrapper", f.style.setProperty("--tbw-tree-depth", String(_)), b !== void 0 && f.style.setProperty("--tbw-tree-indent-width", `${b}px`), R)
         if (g.__treeHasChildren) {
           const c = document.createElement("span");
-          c.className = `tree-toggle${g.__treeExpanded ? " expanded" : ""}`, r(c, l(g.__treeExpanded ? "collapse" : "expand")), c.setAttribute("data-tree-key", String(g.__treeKey ?? "")), f.appendChild(c);
+          c.className = `tree-toggle${g.__treeExpanded ? " expanded" : ""}`, i(c, l(g.__treeExpanded ? "collapse" : "expand")), c.setAttribute("data-tree-key", String(g.__treeKey ?? "")), f.appendChild(c);
         } else {
           const c = document.createElement("span");
           c.className = "tree-spacer", f.appendChild(c);
         }
       const p = document.createElement("span");
-      if (p.className = "tree-content", i) {
-        const c = i(d);
+      if (p.className = "tree-content", r) {
+        const c = r(d);
         c instanceof Node ? p.appendChild(c) : typeof c == "string" && (p.innerHTML = c);
       } else
         p.textContent = u != null ? String(u) : "";
@@ -515,12 +597,12 @@ class F extends A {
     if (!t?.classList.contains("tree-toggle")) return !1;
     const n = t.getAttribute("data-tree-key");
     if (!n) return !1;
-    const i = this.rowKeyMap.get(n);
-    return i ? (this.expandedKeys = y(this.expandedKeys, n), this.emit("tree-expand", {
+    const r = this.rowKeyMap.get(n);
+    return r ? (this.expandedKeys = y(this.expandedKeys, n), this.emit("tree-expand", {
       key: n,
-      row: i.data,
+      row: r.data,
       expanded: this.expandedKeys.has(n),
-      depth: i.depth
+      depth: r.depth
     }), this.requestRender(), !0) : !1;
   }
   /** @internal */
@@ -550,9 +632,9 @@ class F extends A {
     const t = this.gridElement?.querySelector(".rows");
     if (!t) return;
     const n = e === "fade" ? "tbw-tree-fade-in" : "tbw-tree-slide-in";
-    for (const i of t.querySelectorAll(".data-grid-row")) {
-      const s = i.querySelector(".cell[data-row]"), r = s ? parseInt(s.getAttribute("data-row") ?? "-1", 10) : -1, l = this.flattenedRows[r]?.key;
-      l && this.keysToAnimate.has(l) && (i.classList.add(n), i.addEventListener("animationend", () => i.classList.remove(n), { once: !0 }));
+    for (const r of t.querySelectorAll(".data-grid-row")) {
+      const s = r.querySelector(".cell[data-row]"), i = s ? parseInt(s.getAttribute("data-row") ?? "-1", 10) : -1, l = this.flattenedRows[i]?.key;
+      l && this.keysToAnimate.has(l) && (r.classList.add(n), r.addEventListener("animationend", () => r.classList.remove(n), { once: !0 }));
     }
     this.keysToAnimate.clear();
   }
@@ -565,13 +647,13 @@ class F extends A {
     this.expandedKeys.delete(e), this.requestRender();
   }
   toggle(e) {
-    this.expandedKeys = y(this.expandedKeys, e), this.requestRender();
+    this.expandedKeys = y(this.expandedKeys, e), this.emitPluginEvent("tree-state-change", { expandedKeys: [...this.expandedKeys] }), this.requestRender();
   }
   expandAll() {
-    this.expandedKeys = w(this.rows, this.config), this.requestRender();
+    this.expandedKeys = w(this.rows, this.config), this.emitPluginEvent("tree-state-change", { expandedKeys: [...this.expandedKeys] }), this.requestRender();
   }
   collapseAll() {
-    this.expandedKeys = E(), this.requestRender();
+    this.expandedKeys = A(), this.emitPluginEvent("tree-state-change", { expandedKeys: [...this.expandedKeys] }), this.requestRender();
   }
   isExpanded(e) {
     return this.expandedKeys.has(e);