@toolbox-web/grid 1.21.1 → 1.22.0

package/lib/plugins/master-detail/index.js

@@ -1,951 +1,2 @@
-const y = /{{\s*([^}]+)\s*}}/g, g = "__DG_EMPTY__", D = /^[\w$. '?+\-*/%:()!<>=,&|]+$/, S = /__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/, H = /* @__PURE__ */ new Set([
-  "script",
-  "iframe",
-  "object",
-  "embed",
-  "form",
-  "input",
-  "button",
-  "textarea",
-  "select",
-  "link",
-  "meta",
-  "base",
-  "style",
-  "template",
-  "slot",
-  "portal",
-  "frame",
-  "frameset",
-  "applet",
-  "noscript",
-  "noembed",
-  "plaintext",
-  "xmp",
-  "listing"
-]), x = /^on\w+$/i, T = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "data", "srcdoc", "xlink:href", "poster", "srcset"]), L = /^\s*(javascript|vbscript|data|blob):/i;
-function I(n) {
-  if (!n || typeof n != "string") return "";
-  if (n.indexOf("<") === -1) return n;
-  const e = document.createElement("template");
-  return e.innerHTML = n, k(e.content), e.innerHTML;
-}
-function k(n) {
-  const e = [], t = n.querySelectorAll("*");
-  for (const i of t) {
-    const s = i.tagName.toLowerCase();
-    if (H.has(s)) {
-      e.push(i);
-      continue;
-    }
-    if ((s === "svg" || i.namespaceURI === "http://www.w3.org/2000/svg") && Array.from(i.attributes).some(
-      (o) => x.test(o.name) || o.name === "href" || o.name === "xlink:href"
-    )) {
-      e.push(i);
-      continue;
-    }
-    const r = [];
-    for (const a of i.attributes) {
-      const o = a.name.toLowerCase();
-      if (x.test(o)) {
-        r.push(a.name);
-        continue;
-      }
-      if (T.has(o) && L.test(a.value)) {
-        r.push(a.name);
-        continue;
-      }
-      if (o === "style" && /expression\s*\(|javascript:|behavior\s*:/i.test(a.value)) {
-        r.push(a.name);
-        continue;
-      }
-    }
-    r.forEach((a) => i.removeAttribute(a));
-  }
-  e.forEach((i) => i.remove());
-}
-function O(n, e) {
-  if (!n || n.indexOf("{{") === -1) return n;
-  const t = [], i = n.replace(y, (o, c) => {
-    const d = N(c, e);
-    return t.push({ expr: c.trim(), result: d }), d;
-  }), s = q(i), r = t.length && t.every((o) => o.result === "" || o.result === g);
-  return w.test(n) || r ? "" : s;
-}
-function N(n, e) {
-  if (n = (n || "").trim(), !n || w.test(n)) return g;
-  if (n === "value") return e.value == null ? g : String(e.value);
-  if (n.startsWith("row.") && !/[()?]/.test(n) && !n.includes(":")) {
-    const i = n.slice(4), s = e.row ? e.row[i] : void 0;
-    return s == null ? g : String(s);
-  }
-  if (n.length > 80 || !D.test(n) || S.test(n)) return g;
-  const t = n.match(/\./g);
-  if (t && t.length > 1) return g;
-  try {
-    const s = new Function("value", "row", `return (${n});`)(e.value, e.row), r = s == null ? "" : String(s);
-    return w.test(r) ? g : r || g;
-  } catch {
-    return g;
-  }
-}
-const w = /Reflect|Proxy|ownKeys/;
-function q(n) {
-  return n && n.replace(new RegExp(g, "g"), "").replace(/Reflect\.[^<>{}\s]+|\bProxy\b|ownKeys\([^)]*\)/g, "");
-}
-const R = '<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>', M = {
-  expand: "▶",
-  collapse: "▼",
-  sortAsc: "▲",
-  sortDesc: "▼",
-  sortNone: "⇅",
-  submenuArrow: "▶",
-  dragHandle: "⋮⋮",
-  toolPanel: "☰",
-  filter: R,
-  filterActive: R,
-  print: "🖨️"
-};
-class P {
-  /**
-   * Plugin dependencies - declare other plugins this one requires.
-   *
-   * Dependencies are validated when the plugin is attached.
-   * Required dependencies throw an error if missing.
-   * Optional dependencies log an info message if missing.
-   *
-   * @example
-   * ```typescript
-   * static readonly dependencies: PluginDependency[] = [
-   *   { name: 'editing', required: true, reason: 'Tracks cell edits for undo/redo' },
-   *   { name: 'selection', required: false, reason: 'Enables selection-based undo' },
-   * ];
-   * ```
-   */
-  static dependencies;
-  /**
-   * Plugin manifest - declares owned properties, config rules, and hook priorities.
-   *
-   * This is read by the configuration validator to:
-   * - Validate that required plugins are loaded when their properties are used
-   * - Execute configRules to detect invalid/conflicting settings
-   * - Order hook execution based on priority
-   *
-   * @example
-   * ```typescript
-   * static override readonly manifest: PluginManifest<MyConfig> = {
-   *   ownedProperties: [
-   *     { property: 'myProp', level: 'column', description: 'the "myProp" column property' },
-   *   ],
-   *   configRules: [
-   *     { id: 'myPlugin/conflict', severity: 'warn', message: '...', check: (c) => c.a && c.b },
-   *   ],
-   * };
-   * ```
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  static manifest;
-  /**
-   * Plugin version - defaults to grid version for built-in plugins.
-   * Third-party plugins can override with their own semver.
-   */
-  version = typeof __GRID_VERSION__ < "u" ? __GRID_VERSION__ : "dev";
-  /** CSS styles to inject into the grid's shadow DOM */
-  styles;
-  /** Custom cell renderers keyed by type name */
-  cellRenderers;
-  /** Custom header renderers keyed by type name */
-  headerRenderers;
-  /** Custom cell editors keyed by type name */
-  cellEditors;
-  /** The grid instance this plugin is attached to */
-  grid;
-  /** Plugin configuration - merged with defaults in attach() */
-  config;
-  /** User-provided configuration from constructor */
-  userConfig;
-  /**
-   * Plugin-level AbortController for event listener cleanup.
-   * Created fresh in attach(), aborted in detach().
-   * This ensures event listeners are properly cleaned up when plugins are re-attached.
-   */
-  #e;
-  /**
-   * Default configuration - subclasses should override this getter.
-   * Note: This must be a getter (not property initializer) for proper inheritance
-   * since property initializers run after parent constructor.
-   */
-  get defaultConfig() {
-    return {};
-  }
-  constructor(e = {}) {
-    this.userConfig = e;
-  }
-  /**
-   * Called when the plugin is attached to a grid.
-   * Override to set up event listeners, initialize state, etc.
-   *
-   * @example
-   * ```ts
-   * attach(grid: GridElement): void {
-   *   super.attach(grid);
-   *   // Set up document-level listeners with auto-cleanup
-   *   document.addEventListener('keydown', this.handleEscape, {
-   *     signal: this.disconnectSignal
-   *   });
-   * }
-   * ```
-   */
-  attach(e) {
-    this.#e?.abort(), this.#e = new AbortController(), this.grid = e, this.config = { ...this.defaultConfig, ...this.userConfig };
-  }
-  /**
-   * Called when the plugin is detached from a grid.
-   * Override to clean up event listeners, timers, etc.
-   *
-   * @example
-   * ```ts
-   * detach(): void {
-   *   // Clean up any state not handled by disconnectSignal
-   *   this.selectedRows.clear();
-   *   this.cache = null;
-   * }
-   * ```
-   */
-  detach() {
-    this.#e?.abort(), this.#e = void 0;
-  }
-  /**
-   * Get another plugin instance from the same grid.
-   * Use for inter-plugin communication.
-   *
-   * @example
-   * ```ts
-   * const selection = this.getPlugin(SelectionPlugin);
-   * if (selection) {
-   *   const selectedRows = selection.getSelectedRows();
-   * }
-   * ```
-   */
-  getPlugin(e) {
-    return this.grid?.getPlugin(e);
-  }
-  /**
-   * Emit a custom event from the grid.
-   */
-  emit(e, t) {
-    this.grid?.dispatchEvent?.(new CustomEvent(e, { detail: t, bubbles: !0 }));
-  }
-  /**
-   * Emit a cancelable custom event from the grid.
-   * @returns `true` if the event was cancelled (preventDefault called), `false` otherwise
-   */
-  emitCancelable(e, t) {
-    const i = new CustomEvent(e, { detail: t, bubbles: !0, cancelable: !0 });
-    return this.grid?.dispatchEvent?.(i), i.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.
-   * Uses ROWS phase - does NOT trigger processColumns hooks.
-   */
-  requestRender() {
-    this.grid?.requestRender?.();
-  }
-  /**
-   * Request a columns re-render of the grid.
-   * Uses COLUMNS phase - triggers processColumns hooks.
-   * Use this when your plugin needs to reprocess column configuration.
-   */
-  requestColumnsRender() {
-    this.grid?.requestColumnsRender?.();
-  }
-  /**
-   * Request a re-render and restore focus styling afterward.
-   * Use this when a plugin action (like expand/collapse) triggers a render
-   * but needs to maintain keyboard navigation focus.
-   */
-  requestRenderWithFocus() {
-    this.grid?.requestRenderWithFocus?.();
-  }
-  /**
-   * Request a lightweight style update without rebuilding DOM.
-   * Use this instead of requestRender() when only CSS classes need updating.
-   */
-  requestAfterRender() {
-    this.grid?.requestAfterRender?.();
-  }
-  /**
-   * Get the current rows from the grid.
-   */
-  get rows() {
-    return this.grid?.rows ?? [];
-  }
-  /**
-   * Get the original unfiltered/unprocessed rows from the grid.
-   * Use this when you need all source data regardless of active filters.
-   */
-  get sourceRows() {
-    return this.grid?.sourceRows ?? [];
-  }
-  /**
-   * Get the current columns from the grid.
-   */
-  get columns() {
-    return this.grid?.columns ?? [];
-  }
-  /**
-   * Get only visible columns from the grid (excludes hidden).
-   * Use this for rendering that needs to match the grid template.
-   */
-  get visibleColumns() {
-    return this.grid?._visibleColumns ?? [];
-  }
-  /**
-   * Get the grid as an HTMLElement for direct DOM operations.
-   * Use sparingly - prefer the typed GridElementRef API when possible.
-   *
-   * @example
-   * ```ts
-   * const width = this.gridElement.clientWidth;
-   * this.gridElement.classList.add('my-plugin-active');
-   * ```
-   */
-  get gridElement() {
-    return this.grid;
-  }
-  /**
-   * Get the disconnect signal for event listener cleanup.
-   * This signal is aborted when the grid disconnects from the DOM.
-   * Use this when adding event listeners that should be cleaned up automatically.
-   *
-   * Best for:
-   * - Document/window-level listeners added in attach()
-   * - Listeners on the grid element itself
-   * - Any listener that should persist across renders
-   *
-   * Not needed for:
-   * - Listeners on elements created in afterRender() (removed with element)
-   *
-   * @example
-   * element.addEventListener('click', handler, { signal: this.disconnectSignal });
-   * document.addEventListener('keydown', handler, { signal: this.disconnectSignal });
-   */
-  get disconnectSignal() {
-    return this.#e?.signal ?? this.grid?.disconnectSignal;
-  }
-  /**
-   * Get the grid-level icons configuration.
-   * Returns merged icons (user config + defaults).
-   */
-  get gridIcons() {
-    const e = this.grid?.gridConfig?.icons ?? {};
-    return { ...M, ...e };
-  }
-  // #region Animation Helpers
-  /**
-   * Check if animations are enabled at the grid level.
-   * Respects gridConfig.animation.mode and the CSS variable set by the grid.
-   *
-   * Plugins should use this to skip animations when:
-   * - Animation mode is 'off' or `false`
-   * - User prefers reduced motion and mode is 'reduced-motion' (default)
-   *
-   * @example
-   * ```ts
-   * private get animationStyle(): 'slide' | 'fade' | false {
-   *   if (!this.isAnimationEnabled) return false;
-   *   return this.config.animation ?? 'slide';
-   * }
-   * ```
-   */
-  get isAnimationEnabled() {
-    const e = this.grid?.effectiveConfig?.animation?.mode ?? "reduced-motion";
-    if (e === !1 || e === "off") return !1;
-    if (e === !0 || e === "on") return !0;
-    const t = this.gridElement;
-    return t ? getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim() !== "0" : !0;
-  }
-  /**
-   * Get the animation duration in milliseconds from CSS variable.
-   * Falls back to 200ms if not set.
-   *
-   * Plugins can use this for their animation timing to stay consistent
-   * with the grid-level animation.duration setting.
-   *
-   * @example
-   * ```ts
-   * element.animate(keyframes, { duration: this.animationDuration });
-   * ```
-   */
-  get animationDuration() {
-    const e = this.gridElement;
-    if (e) {
-      const t = getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(), i = parseInt(t, 10);
-      if (!isNaN(i)) return i;
-    }
-    return 200;
-  }
-  // #endregion
-  /**
-   * Resolve an icon value to string or HTMLElement.
-   * Checks plugin config first, then grid-level icons, then defaults.
-   *
-   * @param iconKey - The icon key in GridIcons (e.g., 'expand', 'collapse')
-   * @param pluginOverride - Optional plugin-level override
-   * @returns The resolved icon value
-   */
-  resolveIcon(e, t) {
-    return t !== void 0 ? t : this.gridIcons[e];
-  }
-  /**
-   * Set an icon value on an element.
-   * Handles both string (text/HTML) and HTMLElement values.
-   *
-   * @param element - The element to set the icon on
-   * @param icon - The icon value (string or HTMLElement)
-   */
-  setIcon(e, t) {
-    typeof t == "string" ? e.innerHTML = t : t instanceof HTMLElement && (e.innerHTML = "", e.appendChild(t.cloneNode(!0)));
-  }
-  /**
-   * Log a warning message.
-   */
-  warn(e) {
-    console.warn(`[tbw-grid:${this.name}] ${e}`);
-  }
-  // #endregion
-}
-const v = "__tbw_expander", F = 32;
-function C(n) {
-  return n.field === v;
-}
-function U(n) {
-  return n.find(C);
-}
-function z(n) {
-  return {
-    field: v,
-    header: "",
-    // No header text - visually merges with next column
-    width: F,
-    resizable: !1,
-    sortable: !1,
-    filterable: !1,
-    // No filter button for expander column
-    meta: {
-      lockPosition: !0,
-      suppressMovable: !0,
-      expanderColumn: !0,
-      expanderPlugin: n,
-      utility: !0
-      // Marks this as a utility column (excluded from selection, clipboard, etc.)
-    }
-  };
-}
-function E(n, e) {
-  const t = new Set(n);
-  return t.has(e) ? t.delete(e) : t.add(e), t;
-}
-function G(n, e) {
-  const t = new Set(n);
-  return t.add(e), t;
-}
-function W(n, e) {
-  const t = new Set(n);
-  return t.delete(e), t;
-}
-function $(n, e) {
-  return n.has(e);
-}
-function j(n, e, t, i) {
-  const s = document.createElement("div");
-  s.className = "master-detail-row", s.setAttribute("data-detail-for", String(e)), s.setAttribute("role", "row");
-  const r = document.createElement("div");
-  r.className = "master-detail-cell", r.setAttribute("role", "cell"), r.style.gridColumn = `1 / ${i + 1}`;
-  const a = t(n, e);
-  return typeof a == "string" ? r.innerHTML = a : a instanceof HTMLElement && r.appendChild(a), s.appendChild(r), s;
-}
-const B = "@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{border-right:none!important;padding:0;display:flex;align-items:center;justify-content:center}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 .master-detail-expander{display:flex;align-items:center;justify-content:center;width:100%;height:100%}tbw-grid .master-detail-toggle{cursor:pointer;opacity:.7;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center}tbw-grid .master-detail-toggle:hover{opacity:1}tbw-grid .master-detail-row{grid-column:1 / -1;display:grid;background:var(--tbw-master-detail-bg, var(--tbw-color-row-alt));border-bottom:1px solid var(--tbw-master-detail-border, var(--tbw-color-border));overflow:hidden}tbw-grid .master-detail-cell{padding:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));overflow:auto}tbw-grid .master-detail-row.tbw-expanding{animation:tbw-detail-expand var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}tbw-grid .master-detail-row.tbw-collapsing{animation:tbw-detail-collapse var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-detail-expand{0%{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem);padding-top:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));padding-bottom:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem))}}@keyframes tbw-detail-collapse{0%{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem)}to{opacity:0;max-height:0}}}";
-class A extends P {
-  /** @internal */
-  name = "masterDetail";
-  /** @internal */
-  styles = B;
-  /** @internal */
-  get defaultConfig() {
-    return {
-      detailHeight: "auto",
-      expandOnRowClick: !1,
-      collapseOnClickOutside: !1,
-      // Note: showExpandColumn is intentionally NOT defaulted here.
-      // If undefined, processColumns() adds expander only when detailRenderer is provided.
-      // Set to true for framework adapters that register renderers asynchronously.
-      animation: "slide"
-      // Plugin's own default
-    };
-  }
-  // #region Light DOM Parsing
-  /**
-   * Called when plugin is attached to the grid.
-   * Parses light DOM for `<tbw-grid-detail>` elements to configure detail templates.
-   * @internal
-   */
-  attach(e) {
-    super.attach(e), this.parseLightDomDetail();
-  }
-  /**
-   * Parse `<tbw-grid-detail>` elements from the grid's light DOM.
-   *
-   * Allows declarative configuration:
-   * ```html
-   * <tbw-grid [rows]="data">
-   *   <tbw-grid-detail>
-   *     <div class="detail-content">
-   *       <p>Name: {{ row.name }}</p>
-   *       <p>Email: {{ row.email }}</p>
-   *     </div>
-   *   </tbw-grid-detail>
-   * </tbw-grid>
-   * ```
-   *
-   * Attributes:
-   * - `animation`: 'slide' | 'fade' | 'false' (default: 'slide')
-   * - `show-expand-column`: 'true' | 'false' (default: 'true')
-   * - `expand-on-row-click`: 'true' | 'false' (default: 'false')
-   * - `collapse-on-click-outside`: 'true' | 'false' (default: 'false')
-   * - `height`: number (pixels) or 'auto' (default: 'auto')
-   */
-  parseLightDomDetail() {
-    const e = this.grid;
-    if (!e || typeof e.querySelector != "function") return;
-    const t = e.querySelector("tbw-grid-detail");
-    if (!t) return;
-    const i = e;
-    if (i.__frameworkAdapter?.parseDetailElement) {
-      const u = i.__frameworkAdapter.parseDetailElement(t);
-      if (u) {
-        this.config = { ...this.config, detailRenderer: u };
-        return;
-      }
-    }
-    const s = t.getAttribute("animation"), r = t.getAttribute("show-expand-column"), a = t.getAttribute("expand-on-row-click"), o = t.getAttribute("collapse-on-click-outside"), c = t.getAttribute("height"), d = {};
-    s !== null && (d.animation = s === "false" ? !1 : s), r !== null && (d.showExpandColumn = r !== "false"), a !== null && (d.expandOnRowClick = a === "true"), o !== null && (d.collapseOnClickOutside = o === "true"), c !== null && (d.detailHeight = c === "auto" ? "auto" : parseInt(c, 10));
-    const l = t.innerHTML.trim();
-    l && !this.config.detailRenderer && (d.detailRenderer = (u, h) => {
-      const f = O(l, { value: u, row: u });
-      return I(f);
-    }), Object.keys(d).length > 0 && (this.config = { ...this.config, ...d });
-  }
-  // #endregion
-  // #region Animation Helpers
-  /**
-   * Get expand/collapse animation style from plugin config.
-   * Uses base class isAnimationEnabled to respect grid-level settings.
-   */
-  get animationStyle() {
-    return this.isAnimationEnabled ? this.config.animation ?? "slide" : !1;
-  }
-  /**
-   * Apply expand animation to a detail element.
-   * Returns true if animation was applied, false if skipped.
-   * When animated, height measurement is deferred to animationend to avoid
-   * measuring during the max-height: 0 CSS animation constraint.
-   */
-  animateExpand(e, t, i) {
-    if (!this.isAnimationEnabled || this.animationStyle === !1) return !1;
-    e.classList.add("tbw-expanding");
-    let s = !1;
-    const r = () => {
-      s || (s = !0, e.classList.remove("tbw-expanding"), t !== void 0 && i !== void 0 && this.#e(e, t, i));
-    };
-    return e.addEventListener("animationend", r, { once: !0 }), setTimeout(r, this.animationDuration + 50), !0;
-  }
-  /**
-   * Apply collapse animation to a detail element and remove after animation.
-   */
-  animateCollapse(e, t) {
-    if (!this.isAnimationEnabled || this.animationStyle === !1) {
-      t();
-      return;
-    }
-    e.classList.add("tbw-collapsing");
-    const i = () => {
-      e.classList.remove("tbw-collapsing"), t();
-    };
-    e.addEventListener("animationend", i, { once: !0 }), setTimeout(i, this.animationDuration + 50);
-  }
-  /**
-   * Measure a detail element's height and update the position cache if it changed.
-   * Used after layout settles (RAF) or after animation completes (animationend).
-   */
-  #e(e, t, i) {
-    if (!e.isConnected) return;
-    const s = e.offsetHeight;
-    if (s > 0) {
-      const r = this.measuredDetailHeights.get(t);
-      this.measuredDetailHeights.set(t, s), r !== s && this.grid.invalidateRowHeight(i);
-    }
-  }
-  // #endregion
-  // #region Internal State
-  expandedRows = /* @__PURE__ */ new Set();
-  detailElements = /* @__PURE__ */ new Map();
-  /** Cached measured heights - persists even when elements are virtualized out */
-  measuredDetailHeights = /* @__PURE__ */ new Map();
-  /** Rows that were just expanded by user action and should animate.
-   * Prevents re-animation when rows scroll back into the virtual window. */
-  rowsToAnimate = /* @__PURE__ */ new Set();
-  /** Default height for detail rows when not configured */
-  static DEFAULT_DETAIL_HEIGHT = 150;
-  /**
-   * Get the estimated height for a detail row.
-   * Uses cached measured height when available (survives virtualization).
-   * Avoids reading offsetHeight during CSS animations to prevent poisoning the cache.
-   */
-  getDetailHeight(e) {
-    const t = this.detailElements.get(e);
-    if (t && !(t.classList.contains("tbw-expanding") || t.classList.contains("tbw-collapsing"))) {
-      const r = t.offsetHeight;
-      if (r > 0)
-        return this.measuredDetailHeights.set(e, r), r;
-    }
-    const i = this.measuredDetailHeights.get(e);
-    return i && i > 0 ? i : typeof this.config?.detailHeight == "number" ? this.config.detailHeight : A.DEFAULT_DETAIL_HEIGHT;
-  }
-  /**
-   * Toggle a row's detail and emit event.
-   */
-  toggleAndEmit(e, t) {
-    this.expandedRows = E(this.expandedRows, e);
-    const i = this.expandedRows.has(e);
-    i && this.rowsToAnimate.add(e), this.emit("detail-expand", {
-      rowIndex: t,
-      row: e,
-      expanded: i
-    }), this.requestRender();
-  }
-  // #endregion
-  // #region Lifecycle
-  /** @internal */
-  detach() {
-    this.expandedRows.clear(), this.detailElements.clear(), this.measuredDetailHeights.clear(), this.rowsToAnimate.clear();
-  }
-  // #endregion
-  // #region Hooks
-  /** @internal */
-  processColumns(e) {
-    if (!(this.config.showExpandColumn === !0 || this.config.showExpandColumn !== !1 && !!this.config.detailRenderer))
-      return [...e];
-    const i = [...e];
-    if (U(i))
-      return i;
-    const r = z(this.name);
-    return r.viewRenderer = (a) => {
-      const { row: o } = a, c = this.expandedRows.has(o), d = document.createElement("span");
-      d.className = "master-detail-expander expander-cell";
-      const l = document.createElement("span");
-      return l.className = `master-detail-toggle${c ? " expanded" : ""}`, this.setIcon(l, this.resolveIcon(c ? "collapse" : "expand")), l.setAttribute("role", "button"), l.setAttribute("tabindex", "0"), l.setAttribute("aria-expanded", String(c)), l.setAttribute("aria-label", c ? "Collapse details" : "Expand details"), d.appendChild(l), d;
-    }, [r, ...i];
-  }
-  /** @internal */
-  onRowClick(e) {
-    if (!(!this.config.expandOnRowClick || !this.config.detailRenderer))
-      return this.toggleAndEmit(e.row, e.rowIndex), !1;
-  }
-  /** @internal */
-  onCellClick(e) {
-    if (e.originalEvent?.target?.classList.contains("master-detail-toggle"))
-      return this.toggleAndEmit(e.row, e.rowIndex), !0;
-    this.expandedRows.size > 0 && queueMicrotask(() => this.#t());
-  }
-  /** @internal */
-  onKeyDown(e) {
-    if (e.key !== " ") return;
-    const t = this.grid._focusCol, i = this.grid._focusRow, s = this.visibleColumns[t];
-    if (!s || !C(s)) return;
-    const r = this.rows[i];
-    if (r)
-      return e.preventDefault(), this.toggleAndEmit(r, i), this.requestRenderWithFocus(), !0;
-  }
-  /** @internal */
-  afterRender() {
-    this.#t();
-  }
-  /**
-   * Called on scroll to sync detail elements with visible rows.
-   * Removes details for rows that scrolled out of view and reattaches for visible rows.
-   * @internal
-   */
-  onScrollRender() {
-    !this.config.detailRenderer || this.expandedRows.size === 0 || this.#t();
-  }
-  /**
-   * Full sync of detail rows - cleans up stale elements and creates new ones.
-   * Detail rows are inserted as siblings AFTER their master row to survive row rebuilds.
-   *
-   * PERF: Uses the grid's row pool (_rowPool) and virtual window (_virtualization.start/end)
-   * to avoid querySelectorAll on every scroll frame. The pool is index-aligned with the
-   * virtual window, so pool[i] corresponds to row index (start + i).
-   */
-  #t() {
-    if (!this.config.detailRenderer) return;
-    const e = this.gridElement?.querySelector(".rows");
-    if (!e) return;
-    const t = this.grid, i = t._rowPool, s = t._virtualization?.start ?? 0, r = t._virtualization?.end ?? 0, a = this.columns.length, o = s, c = r, d = /* @__PURE__ */ new Map();
-    if (i) {
-      const l = Math.min(i.length, c - o);
-      for (let u = 0; u < l; u++) {
-        const h = i[u];
-        h.parentNode === e && d.set(o + u, h);
-      }
-    } else {
-      const l = e.querySelectorAll(".data-grid-row");
-      for (const u of l) {
-        const h = u.querySelector(".cell[data-row]"), f = h ? parseInt(h.getAttribute("data-row") ?? "-1", 10) : -1;
-        f >= 0 && d.set(f, u);
-      }
-    }
-    for (const [l, u] of this.detailElements) {
-      const h = this.rows.indexOf(l), f = this.expandedRows.has(l), m = h >= 0 && d.has(h);
-      if (!f || !m) {
-        const p = this.grid.__frameworkAdapter;
-        if (p?.unmount) {
-          const b = u.querySelector(".master-detail-cell")?.firstElementChild;
-          b && p.unmount(b);
-        }
-        u.parentNode && u.remove(), this.detailElements.delete(l);
-      }
-    }
-    for (const [l, u] of d) {
-      const h = this.rows[l];
-      if (!h || !this.expandedRows.has(h)) continue;
-      const f = this.detailElements.get(h);
-      if (f) {
-        f.previousElementSibling !== u && u.after(f);
-        continue;
-      }
-      const m = j(h, l, this.config.detailRenderer, a);
-      typeof this.config.detailHeight == "number" && (m.style.height = `${this.config.detailHeight}px`), u.after(m), this.detailElements.set(h, m);
-      const p = this.rowsToAnimate.has(h);
-      p && this.rowsToAnimate.delete(h), p && this.animateExpand(m, h, l) || requestAnimationFrame(() => {
-        this.#e(m, h, l);
-      });
-    }
-  }
-  /**
-   * Return total extra height from all expanded detail rows.
-   * Used by grid virtualization to adjust scrollbar height.
-   *
-   * @deprecated Use getRowHeight() instead. This hook will be removed in v3.0.
-   */
-  getExtraHeight() {
-    let e = 0;
-    for (const t of this.expandedRows)
-      e += this.getDetailHeight(t);
-    return e;
-  }
-  /**
-   * Return extra height that appears before a given row index.
-   * This is the sum of heights of all expanded details whose parent row is before the given index.
-   *
-   * @deprecated Use getRowHeight() instead. This hook will be removed in v3.0.
-   */
-  getExtraHeightBefore(e) {
-    let t = 0;
-    for (const i of this.expandedRows) {
-      const s = this.rows.indexOf(i);
-      s >= 0 && s < e && (t += this.getDetailHeight(i));
-    }
-    return t;
-  }
-  /**
-   * Get the height of a specific row, including any expanded detail content.
-   * Always returns a height to ensure the position cache uses plugin-controlled values
-   * rather than stale DOM measurements.
-   *
-   * @param row - The row data
-   * @param _index - The row index (unused, but part of the interface)
-   * @returns The row height in pixels (base height for collapsed, base + detail for expanded)
-   */
-  getRowHeight(e, t) {
-    if (!this.expandedRows.has(e))
-      return;
-    const s = this.grid.defaultRowHeight ?? 28, r = this.getDetailHeight(e);
-    return s + r;
-  }
-  /**
-   * Adjust the virtualization start index to keep expanded row visible while its detail is visible.
-   * This ensures the detail scrolls smoothly out of view instead of disappearing abruptly.
-   */
-  adjustVirtualStart(e, t, i) {
-    if (this.expandedRows.size === 0) return e;
-    const s = this.grid?._virtualization?.positionCache;
-    let r = e;
-    if (s && s.length > 0)
-      for (const a of this.expandedRows) {
-        const o = this.rows.indexOf(a);
-        if (o < 0 || o >= e) continue;
-        s[o].offset + s[o].height > t && o < r && (r = o);
-      }
-    else {
-      const a = [];
-      for (const c of this.expandedRows) {
-        const d = this.rows.indexOf(c);
-        d >= 0 && a.push({ index: d, row: c });
-      }
-      a.sort((c, d) => c.index - d.index);
-      let o = 0;
-      for (const { index: c, row: d } of a) {
-        const l = c * i + o, u = this.getDetailHeight(d), h = l + i + u;
-        o += u, !(c >= e) && h > t && c < r && (r = c);
-      }
-    }
-    return r;
-  }
-  // #endregion
-  // #region Public API
-  /**
-   * Expand the detail row at the given index.
-   * @param rowIndex - Index of the row to expand
-   */
-  expand(e) {
-    const t = this.rows[e];
-    t && (this.rowsToAnimate.add(t), this.expandedRows = G(this.expandedRows, t), this.requestRender());
-  }
-  /**
-   * Collapse the detail row at the given index.
-   * @param rowIndex - Index of the row to collapse
-   */
-  collapse(e) {
-    const t = this.rows[e];
-    t && (this.expandedRows = W(this.expandedRows, t), this.requestRender());
-  }
-  /**
-   * Toggle the detail row at the given index.
-   * @param rowIndex - Index of the row to toggle
-   */
-  toggle(e) {
-    const t = this.rows[e];
-    t && (this.expandedRows = E(this.expandedRows, t), this.expandedRows.has(t) && this.rowsToAnimate.add(t), this.requestRender());
-  }
-  /**
-   * Check if the detail row at the given index is expanded.
-   * @param rowIndex - Index of the row to check
-   * @returns Whether the detail row is expanded
-   */
-  isExpanded(e) {
-    const t = this.rows[e];
-    return t ? $(this.expandedRows, t) : !1;
-  }
-  /**
-   * Expand all detail rows.
-   */
-  expandAll() {
-    for (const e of this.rows)
-      this.rowsToAnimate.add(e), this.expandedRows.add(e);
-    this.requestRender();
-  }
-  /**
-   * Collapse all detail rows.
-   */
-  collapseAll() {
-    this.expandedRows.clear(), this.requestRender();
-  }
-  /**
-   * Get the indices of all expanded rows.
-   * @returns Array of row indices that are expanded
-   */
-  getExpandedRows() {
-    const e = [];
-    for (const t of this.expandedRows) {
-      const i = this.rows.indexOf(t);
-      i >= 0 && e.push(i);
-    }
-    return e;
-  }
-  /**
-   * Get the detail element for a specific row.
-   * @param rowIndex - Index of the row
-   * @returns The detail HTMLElement or undefined
-   */
-  getDetailElement(e) {
-    const t = this.rows[e];
-    return t ? this.detailElements.get(t) : void 0;
-  }
-  /**
-   * Re-parse light DOM to refresh the detail renderer.
-   * Call this after framework templates are registered (e.g., Angular ngAfterContentInit).
-   *
-   * This allows frameworks to register templates asynchronously and then
-   * update the plugin's detailRenderer.
-   */
-  refreshDetailRenderer() {
-    const e = this.config.detailRenderer;
-    if (this.config = { ...this.config, detailRenderer: void 0 }, this.parseLightDomDetail(), !this.config.detailRenderer && e && (this.config = { ...this.config, detailRenderer: e }), this.config.detailRenderer) {
-      const t = this.grid;
-      typeof t.refreshColumns == "function" ? t.refreshColumns() : this.requestRender();
-    }
-  }
-  // #endregion
-}
-export {
-  A as MasterDetailPlugin
-};
+const e=/{{\s*([^}]+)\s*}}/g,t="__DG_EMPTY__",i=/^[\w$. '?+\-*/%:()!<>=,&|]+$/,n=/__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/,r=/* @__PURE__ */new Set(["script","iframe","object","embed","form","input","button","textarea","select","link","meta","base","style","template","slot","portal","frame","frameset","applet","noscript","noembed","plaintext","xmp","listing"]),s=/^on\w+$/i,o=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),a=/^\s*(javascript|vbscript|data|blob):/i;function l(e){if(!e||"string"!=typeof e)return"";if(-1===e.indexOf("<"))return e;const t=document.createElement("template");return t.innerHTML=e,function(e){const t=[],i=e.querySelectorAll("*");for(const n of i){const e=n.tagName.toLowerCase();if(r.has(e)){t.push(n);continue}if("svg"===e||"http://www.w3.org/2000/svg"===n.namespaceURI){if(Array.from(n.attributes).some(e=>s.test(e.name)||"href"===e.name||"xlink:href"===e.name)){t.push(n);continue}}const i=[];for(const t of n.attributes){const e=t.name.toLowerCase();s.test(e)?i.push(t.name):(o.has(e)&&a.test(t.value)||"style"===e&&/expression\s*\(|javascript:|behavior\s*:/i.test(t.value))&&i.push(t.name)}i.forEach(e=>n.removeAttribute(e))}t.forEach(e=>e.remove())}(t.content),t.innerHTML}function d(r,s){if(!r||-1===r.indexOf("{{"))return r;const o=[],a=r.replace(e,(e,r)=>{const a=function(e,r){if(e=(e||"").trim(),!e)return t;if(c.test(e))return t;if("value"===e)return null==r.value?t:String(r.value);if(e.startsWith("row.")&&!/[()?]/.test(e)&&!e.includes(":")){const i=e.slice(4),n=r.row?r.row[i]:void 0;return null==n?t:String(n)}if(e.length>80)return t;if(!i.test(e)||n.test(e))return t;const s=e.match(/\./g);if(s&&s.length>1)return t;try{const i=new Function("value","row",`return (${e});`)(r.value,r.row),n=null==i?"":String(i);return c.test(n)?t:n||t}catch{return t}}(r,s);return o.push({expr:r.trim(),result:a}),a}),l=(d=a)?d.replace(new RegExp(t,"g"),"").replace(/Reflect\.[^<>{}\s]+|\bProxy\b|ownKeys\([^)]*\)/g,""):d;var d;const h=o.length&&o.every(e=>""===e.result||e.result===t);return c.test(r)||h?"":l}const c=/Reflect|Proxy|ownKeys/;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>',u={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:h,filterActive:h,print:"🖨️"};class g{static dependencies;static manifest;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,t){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:t,bubbles:!0}))}emitCancelable(e,t){const i=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(i),i.defaultPrevented}on(e,t){this.grid?._pluginManager?.subscribe(this,e,t)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,t){this.grid?._pluginManager?.emitPluginEvent(e,t)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...u,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const t=this.gridElement;if(t){return"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const t=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),i=parseInt(t,10);if(!isNaN(i))return i}return 200}resolveIcon(e,t){return void 0!==t?t:this.gridIcons[e]}setIcon(e,t){"string"==typeof t?e.innerHTML=t:t instanceof HTMLElement&&(e.innerHTML="",e.appendChild(t.cloneNode(!0)))}warn(e){console.warn(`[tbw-grid:${this.name}] ${e}`)}}const f="__tbw_expander";function m(e){return e.field===f}function p(e,t){const i=new Set(e);return i.has(t)?i.delete(t):i.add(t),i}function w(e,t,i,n){const r=document.createElement("div");r.className="master-detail-row",r.setAttribute("data-detail-for",String(t)),r.setAttribute("role","row");const s=document.createElement("div");s.className="master-detail-cell",s.setAttribute("role","cell"),s.style.gridColumn=`1 / ${n+1}`;const o=i(e,t);return"string"==typeof o?s.innerHTML=o:o instanceof HTMLElement&&s.appendChild(o),r.appendChild(s),r}class b extends g{name="masterDetail";styles="@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{border-right:none!important;padding:0;display:flex;align-items:center;justify-content:center}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 .master-detail-expander{display:flex;align-items:center;justify-content:center;width:100%;height:100%}tbw-grid .master-detail-toggle{cursor:pointer;opacity:.7;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center}tbw-grid .master-detail-toggle:hover{opacity:1}tbw-grid .master-detail-row{grid-column:1 / -1;display:grid;background:var(--tbw-master-detail-bg, var(--tbw-color-row-alt));border-bottom:1px solid var(--tbw-master-detail-border, var(--tbw-color-border));overflow:hidden}tbw-grid .master-detail-cell{padding:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));overflow:auto}tbw-grid .master-detail-row.tbw-expanding{animation:tbw-detail-expand var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}tbw-grid .master-detail-row.tbw-collapsing{animation:tbw-detail-collapse var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-detail-expand{0%{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem);padding-top:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));padding-bottom:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem))}}@keyframes tbw-detail-collapse{0%{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem)}to{opacity:0;max-height:0}}}";get defaultConfig(){return{detailHeight:"auto",expandOnRowClick:!1,collapseOnClickOutside:!1,animation:"slide"}}attach(e){super.attach(e),this.parseLightDomDetail()}parseLightDomDetail(){const e=this.grid;if(!e||"function"!=typeof e.querySelector)return;const t=e.querySelector("tbw-grid-detail");if(!t)return;const i=e;if(i.__frameworkAdapter?.parseDetailElement){const e=i.__frameworkAdapter.parseDetailElement(t);if(e)return void(this.config={...this.config,detailRenderer:e})}const n=t.getAttribute("animation"),r=t.getAttribute("show-expand-column"),s=t.getAttribute("expand-on-row-click"),o=t.getAttribute("collapse-on-click-outside"),a=t.getAttribute("height"),c={};null!==n&&(c.animation="false"!==n&&n),null!==r&&(c.showExpandColumn="false"!==r),null!==s&&(c.expandOnRowClick="true"===s),null!==o&&(c.collapseOnClickOutside="true"===o),null!==a&&(c.detailHeight="auto"===a?"auto":parseInt(a,10));const h=t.innerHTML.trim();h&&!this.config.detailRenderer&&(c.detailRenderer=(e,t)=>l(d(h,{value:e,row:e}))),Object.keys(c).length>0&&(this.config={...this.config,...c})}get animationStyle(){return!!this.isAnimationEnabled&&(this.config.animation??"slide")}animateExpand(e,t,i){if(!this.isAnimationEnabled||!1===this.animationStyle)return!1;e.classList.add("tbw-expanding");let n=!1;const r=()=>{n||(n=!0,e.classList.remove("tbw-expanding"),void 0!==t&&void 0!==i&&this.#t(e,t,i))};return e.addEventListener("animationend",r,{once:!0}),setTimeout(r,this.animationDuration+50),!0}animateCollapse(e,t){if(!this.isAnimationEnabled||!1===this.animationStyle)return void t();e.classList.add("tbw-collapsing");const i=()=>{e.classList.remove("tbw-collapsing"),t()};e.addEventListener("animationend",i,{once:!0}),setTimeout(i,this.animationDuration+50)}#t(e,t,i){if(!e.isConnected)return;const n=e.offsetHeight;if(n>0){const e=this.measuredDetailHeights.get(t);this.measuredDetailHeights.set(t,n),e!==n&&this.grid.invalidateRowHeight(i)}}expandedRows=/* @__PURE__ */new Set;detailElements=/* @__PURE__ */new Map;measuredDetailHeights=/* @__PURE__ */new Map;rowsToAnimate=/* @__PURE__ */new Set;static DEFAULT_DETAIL_HEIGHT=150;getDetailHeight(e){const t=this.detailElements.get(e);if(t){if(!(t.classList.contains("tbw-expanding")||t.classList.contains("tbw-collapsing"))){const i=t.offsetHeight;if(i>0)return this.measuredDetailHeights.set(e,i),i}}const i=this.measuredDetailHeights.get(e);return i&&i>0?i:"number"==typeof this.config?.detailHeight?this.config.detailHeight:b.DEFAULT_DETAIL_HEIGHT}toggleAndEmit(e,t){this.expandedRows=p(this.expandedRows,e);const i=this.expandedRows.has(e);i&&this.rowsToAnimate.add(e),this.emit("detail-expand",{rowIndex:t,row:e,expanded:i}),this.requestRender()}detach(){this.expandedRows.clear(),this.detailElements.clear(),this.measuredDetailHeights.clear(),this.rowsToAnimate.clear()}processColumns(e){if(!(!0===this.config.showExpandColumn||!1!==this.config.showExpandColumn&&!!this.config.detailRenderer))return[...e];const t=[...e],i=function(e){return e.find(m)}(t);if(i)return t;const n=(r=this.name,{field:f,header:"",width:32,resizable:!1,sortable:!1,filterable:!1,meta:{lockPosition:!0,suppressMovable:!0,expanderColumn:!0,expanderPlugin:r,utility:!0}});var r;return n.viewRenderer=e=>{const{row:t}=e,i=this.expandedRows.has(t),n=document.createElement("span");n.className="master-detail-expander expander-cell";const r=document.createElement("span");return r.className="master-detail-toggle"+(i?" expanded":""),this.setIcon(r,this.resolveIcon(i?"collapse":"expand")),r.setAttribute("role","button"),r.setAttribute("tabindex","0"),r.setAttribute("aria-expanded",String(i)),r.setAttribute("aria-label",i?"Collapse details":"Expand details"),n.appendChild(r),n},[n,...t]}onRowClick(e){if(this.config.expandOnRowClick&&this.config.detailRenderer)return this.toggleAndEmit(e.row,e.rowIndex),!1}onCellClick(e){const t=e.originalEvent?.target;if(t?.classList.contains("master-detail-toggle"))return this.toggleAndEmit(e.row,e.rowIndex),!0;this.expandedRows.size>0&&queueMicrotask(()=>this.#i())}onKeyDown(e){if(" "!==e.key)return;const t=this.grid._focusCol,i=this.grid._focusRow,n=this.visibleColumns[t];if(!n||!m(n))return;const r=this.rows[i];return r?(e.preventDefault(),this.toggleAndEmit(r,i),this.requestRenderWithFocus(),!0):void 0}afterRender(){this.#i()}onScrollRender(){this.config.detailRenderer&&0!==this.expandedRows.size&&this.#i()}#i(){if(!this.config.detailRenderer)return;const e=this.gridElement?.querySelector(".rows");if(!e)return;const t=this.grid,i=t._rowPool,n=t._virtualization?.start??0,r=t._virtualization?.end??0,s=this.columns.length,o=n,a=r,l=/* @__PURE__ */new Map;if(i){const t=Math.min(i.length,a-o);for(let n=0;n<t;n++){const t=i[n];t.parentNode===e&&l.set(o+n,t)}}else{const t=e.querySelectorAll(".data-grid-row");for(const e of t){const t=e.querySelector(".cell[data-row]"),i=t?parseInt(t.getAttribute("data-row")??"-1",10):-1;i>=0&&l.set(i,e)}}for(const[d,c]of this.detailElements){const e=this.rows.indexOf(d),t=this.expandedRows.has(d),i=e>=0&&l.has(e);if(!t||!i){const e=this.grid.__frameworkAdapter;if(e?.unmount){const t=c.querySelector(".master-detail-cell"),i=t?.firstElementChild;i&&e.unmount(i)}c.parentNode&&c.remove(),this.detailElements.delete(d)}}for(const[d,c]of l){const e=this.rows[d];if(!e||!this.expandedRows.has(e))continue;const t=this.detailElements.get(e);if(t){t.previousElementSibling!==c&&c.after(t);continue}const i=w(e,d,this.config.detailRenderer,s);"number"==typeof this.config.detailHeight&&(i.style.height=`${this.config.detailHeight}px`),c.after(i),this.detailElements.set(e,i);const n=this.rowsToAnimate.has(e);n&&this.rowsToAnimate.delete(e);n&&this.animateExpand(i,e,d)||requestAnimationFrame(()=>{this.#t(i,e,d)})}}getExtraHeight(){let e=0;for(const t of this.expandedRows)e+=this.getDetailHeight(t);return e}getExtraHeightBefore(e){let t=0;for(const i of this.expandedRows){const n=this.rows.indexOf(i);n>=0&&n<e&&(t+=this.getDetailHeight(i))}return t}getRowHeight(e,t){if(!this.expandedRows.has(e))return;return(this.grid.defaultRowHeight??28)+this.getDetailHeight(e)}adjustVirtualStart(e,t,i){if(0===this.expandedRows.size)return e;const n=this.grid?._virtualization?.positionCache;let r=e;if(n&&n.length>0)for(const s of this.expandedRows){const i=this.rows.indexOf(s);if(i<0||i>=e)continue;n[i].offset+n[i].height>t&&i<r&&(r=i)}else{const n=[];for(const e of this.expandedRows){const t=this.rows.indexOf(e);t>=0&&n.push({index:t,row:e})}n.sort((e,t)=>e.index-t.index);let s=0;for(const{index:o,row:a}of n){const n=o*i+s,l=this.getDetailHeight(a);s+=l,o>=e||n+i+l>t&&o<r&&(r=o)}}return r}expand(e){const t=this.rows[e];t&&(this.rowsToAnimate.add(t),this.expandedRows=function(e,t){const i=new Set(e);return i.add(t),i}(this.expandedRows,t),this.requestRender())}collapse(e){const t=this.rows[e];t&&(this.expandedRows=function(e,t){const i=new Set(e);return i.delete(t),i}(this.expandedRows,t),this.requestRender())}toggle(e){const t=this.rows[e];t&&(this.expandedRows=p(this.expandedRows,t),this.expandedRows.has(t)&&this.rowsToAnimate.add(t),this.requestRender())}isExpanded(e){const t=this.rows[e];return!!t&&function(e,t){return e.has(t)}(this.expandedRows,t)}expandAll(){for(const e of this.rows)this.rowsToAnimate.add(e),this.expandedRows.add(e);this.requestRender()}collapseAll(){this.expandedRows.clear(),this.requestRender()}getExpandedRows(){const e=[];for(const t of this.expandedRows){const i=this.rows.indexOf(t);i>=0&&e.push(i)}return e}getDetailElement(e){const t=this.rows[e];return t?this.detailElements.get(t):void 0}refreshDetailRenderer(){const e=this.config.detailRenderer;if(this.config={...this.config,detailRenderer:void 0},this.parseLightDomDetail(),!this.config.detailRenderer&&e&&(this.config={...this.config,detailRenderer:e}),this.config.detailRenderer){const e=this.grid;"function"==typeof e.refreshColumns?e.refreshColumns():this.requestRender()}}}export{b as MasterDetailPlugin};
 //# sourceMappingURL=index.js.map