@toolbox-web/grid 1.21.0 → 1.21.2

package/lib/plugins/column-virtualization/index.js

@@ -1,561 +1,2 @@
-const c = '<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>', p = {
-  expand: "▶",
-  collapse: "▼",
-  sortAsc: "▲",
-  sortDesc: "▼",
-  sortNone: "⇅",
-  submenuArrow: "▶",
-  dragHandle: "⋮⋮",
-  toolPanel: "☰",
-  filter: c,
-  filterActive: c,
-  print: "🖨️"
-};
-class b {
-  /**
-   * 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.
-   */
-  #t;
-  /**
-   * 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(t = {}) {
-    this.userConfig = t;
-  }
-  /**
-   * 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(t) {
-    this.#t?.abort(), this.#t = new AbortController(), this.grid = t, 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.#t?.abort(), this.#t = 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(t) {
-    return this.grid?.getPlugin(t);
-  }
-  /**
-   * Emit a custom event from the grid.
-   */
-  emit(t, e) {
-    this.grid?.dispatchEvent?.(new CustomEvent(t, { detail: e, bubbles: !0 }));
-  }
-  /**
-   * Emit a cancelable custom event from the grid.
-   * @returns `true` if the event was cancelled (preventDefault called), `false` otherwise
-   */
-  emitCancelable(t, e) {
-    const i = new CustomEvent(t, { detail: e, 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(t, e) {
-    this.grid?._pluginManager?.subscribe(this, t, e);
-  }
-  /**
-   * Unsubscribe from a plugin event.
-   *
-   * @category Plugin Development
-   * @param eventType - The event type to stop listening for
-   *
-   * @example
-   * ```typescript
-   * this.off('filter-change');
-   * ```
-   */
-  off(t) {
-    this.grid?._pluginManager?.unsubscribe(this, t);
-  }
-  /**
-   * 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(t, e) {
-    this.grid?._pluginManager?.emitPluginEvent(t, e);
-  }
-  /**
-   * 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.#t?.signal ?? this.grid?.disconnectSignal;
-  }
-  /**
-   * Get the grid-level icons configuration.
-   * Returns merged icons (user config + defaults).
-   */
-  get gridIcons() {
-    const t = this.grid?.gridConfig?.icons ?? {};
-    return { ...p, ...t };
-  }
-  // #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 t = this.grid?.effectiveConfig?.animation?.mode ?? "reduced-motion";
-    if (t === !1 || t === "off") return !1;
-    if (t === !0 || t === "on") return !0;
-    const e = this.gridElement;
-    return e ? getComputedStyle(e).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 t = this.gridElement;
-    if (t) {
-      const e = getComputedStyle(t).getPropertyValue("--tbw-animation-duration").trim(), i = parseInt(e, 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(t, e) {
-    return e !== void 0 ? e : this.gridIcons[t];
-  }
-  /**
-   * 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(t, e) {
-    typeof e == "string" ? t.innerHTML = e : e instanceof HTMLElement && (t.innerHTML = "", t.appendChild(e.cloneNode(!0)));
-  }
-  /**
-   * Log a warning message.
-   */
-  warn(t) {
-    console.warn(`[tbw-grid:${this.name}] ${t}`);
-  }
-  // #endregion
-}
-const g = 100;
-function h(s) {
-  if (s == null)
-    return g;
-  if (typeof s == "number")
-    return s;
-  const t = parseFloat(s);
-  return isNaN(t) ? g : t;
-}
-function f(s) {
-  return s.map((t) => h(t.width));
-}
-function m(s) {
-  const t = [];
-  let e = 0;
-  for (const i of s)
-    t.push(e), e += h(i.width);
-  return t;
-}
-function C(s) {
-  return s.reduce((t, e) => t + h(e.width), 0);
-}
-function w(s, t, e, i, o) {
-  const r = e.length;
-  if (r === 0)
-    return { startCol: 0, endCol: 0, visibleColumns: [] };
-  let n = y(s, e, i);
-  n = Math.max(0, n - o);
-  const a = s + t;
-  let u = n;
-  for (let l = n; l < r; l++) {
-    if (e[l] >= a) {
-      u = l - 1;
-      break;
-    }
-    u = l;
-  }
-  u = Math.min(r - 1, u + o);
-  const d = [];
-  for (let l = n; l <= u; l++)
-    d.push(l);
-  return { startCol: n, endCol: u, visibleColumns: d };
-}
-function y(s, t, e) {
-  let i = 0, o = t.length - 1;
-  for (; i < o; ) {
-    const r = Math.floor((i + o) / 2);
-    t[r] + e[r] <= s ? i = r + 1 : o = r;
-  }
-  return i;
-}
-function R(s, t, e) {
-  return e ? s > t : !1;
-}
-class E extends b {
-  /** @internal */
-  name = "columnVirtualization";
-  /** @internal */
-  get defaultConfig() {
-    return {
-      autoEnable: !0,
-      threshold: 30,
-      overscan: 3
-    };
-  }
-  // #region Internal State
-  isVirtualized = !1;
-  startCol = 0;
-  endCol = 0;
-  scrollLeft = 0;
-  totalWidth = 0;
-  columnWidths = [];
-  columnOffsets = [];
-  /** Store the original full column set for virtualization calculations */
-  originalColumns = [];
-  // #endregion
-  // #region Lifecycle
-  /** @internal */
-  attach(t) {
-    super.attach(t);
-    const e = this.columns;
-    this.columnWidths = f(e), this.columnOffsets = m(e), this.totalWidth = C(e), this.endCol = e.length - 1;
-  }
-  /** @internal */
-  detach() {
-    this.#t(), this.columnWidths = [], this.columnOffsets = [], this.originalColumns = [], this.isVirtualized = !1, this.startCol = 0, this.endCol = 0, this.scrollLeft = 0, this.totalWidth = 0;
-  }
-  /**
-   * Remove inline styles set by this plugin for proper cleanup.
-   */
-  #t() {
-    const t = this.gridElement;
-    if (!t) return;
-    const e = t.querySelector(".header-row");
-    e && (e.style.paddingLeft = "", e.style.minWidth = ""), t.querySelectorAll(".data-grid-row").forEach((n) => {
-      n.style.paddingLeft = "";
-    });
-    const o = t.querySelector(".rows-viewport .rows");
-    o && (o.style.width = "");
-    const r = t.querySelector(".rows-body");
-    r && (r.style.minWidth = "");
-  }
-  // #endregion
-  // #region Hooks
-  /** @internal */
-  processColumns(t) {
-    (this.originalColumns.length === 0 || t.length >= this.originalColumns.length) && (this.originalColumns = t, this.columnWidths = f(t), this.columnOffsets = m(t), this.totalWidth = C(t));
-    const i = this.originalColumns, o = R(
-      i.length,
-      this.config.threshold ?? 30,
-      this.config.autoEnable ?? !0
-    );
-    if (this.isVirtualized = o ?? !1, !o)
-      return this.startCol = 0, this.endCol = i.length - 1, [...i];
-    const r = this.grid.clientWidth || 800, n = w(
-      this.scrollLeft,
-      r,
-      this.columnOffsets,
-      this.columnWidths,
-      this.config.overscan ?? 3
-    );
-    return this.startCol = n.startCol, this.endCol = n.endCol, n.visibleColumns.map((a) => i[a]);
-  }
-  /** @internal */
-  afterRender() {
-    if (!this.isVirtualized) return;
-    const t = this.gridElement;
-    if (!t) return;
-    const e = this.columnOffsets[this.startCol] ?? 0, i = t.querySelector(".header-row"), o = t.querySelectorAll(".data-grid-row");
-    i && (i.style.paddingLeft = `${e}px`, i.style.minWidth = `${this.totalWidth}px`), o.forEach((a) => {
-      a.style.paddingLeft = `${e}px`;
-    });
-    const r = t.querySelector(".rows-viewport .rows");
-    r && (r.style.width = `${this.totalWidth}px`);
-    const n = t.querySelector(".rows-body");
-    n && (n.style.minWidth = `${this.totalWidth}px`);
-  }
-  /** @internal */
-  onScroll(t) {
-    !this.isVirtualized || Math.abs(t.scrollLeft - this.scrollLeft) < 1 || (this.scrollLeft = t.scrollLeft, this.requestColumnsRender());
-  }
-  // #endregion
-  // #region Public API
-  /**
-   * Check if column virtualization is currently active.
-   */
-  getIsVirtualized() {
-    return this.isVirtualized;
-  }
-  /**
-   * Get the current visible column range.
-   */
-  getVisibleColumnRange() {
-    return { start: this.startCol, end: this.endCol };
-  }
-  /**
-   * Scroll the grid to bring a specific column into view.
-   * @param columnIndex - Index of the column to scroll to
-   */
-  scrollToColumn(t) {
-    const e = this.columnOffsets[t] ?? 0, i = this.grid;
-    i.scrollLeft = e;
-  }
-  /**
-   * Get the left offset for a specific column.
-   * @param columnIndex - Index of the column
-   */
-  getColumnOffset(t) {
-    return this.columnOffsets[t] ?? 0;
-  }
-  /**
-   * Get the total width of all columns.
-   */
-  getTotalWidth() {
-    return this.totalWidth;
-  }
-  // #endregion
-}
-export {
-  E as ColumnVirtualizationPlugin
-};
+const t='<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>',e={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:t,filterActive:t,print:"🖨️"};class i{static dependencies;static manifest;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#t;get defaultConfig(){return{}}constructor(t={}){this.userConfig=t}attach(t){this.#t?.abort(),this.#t=new AbortController,this.grid=t,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#t?.abort(),this.#t=void 0}getPlugin(t){return this.grid?.getPlugin(t)}emit(t,e){this.grid?.dispatchEvent?.(new CustomEvent(t,{detail:e,bubbles:!0}))}emitCancelable(t,e){const i=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(i),i.defaultPrevented}on(t,e){this.grid?._pluginManager?.subscribe(this,t,e)}off(t){this.grid?._pluginManager?.unsubscribe(this,t)}emitPluginEvent(t,e){this.grid?._pluginManager?.emitPluginEvent(t,e)}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.#t?.signal??this.grid?.disconnectSignal}get gridIcons(){const t=this.grid?.gridConfig?.icons??{};return{...e,...t}}get isAnimationEnabled(){const t=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===t||"off"===t)return!1;if(!0===t||"on"===t)return!0;const e=this.gridElement;if(e){return"0"!==getComputedStyle(e).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const t=this.gridElement;if(t){const e=getComputedStyle(t).getPropertyValue("--tbw-animation-duration").trim(),i=parseInt(e,10);if(!isNaN(i))return i}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e){"string"==typeof e?t.innerHTML=e:e instanceof HTMLElement&&(t.innerHTML="",t.appendChild(e.cloneNode(!0)))}warn(t){console.warn(`[tbw-grid:${this.name}] ${t}`)}}function r(t){if(null==t)return 100;if("number"==typeof t)return t;const e=parseFloat(t);return isNaN(e)?100:e}function s(t){return t.map(t=>r(t.width))}function n(t){const e=[];let i=0;for(const s of t)e.push(i),i+=r(s.width);return e}function o(t){return t.reduce((t,e)=>t+r(e.width),0)}function l(t,e,i,r,s){const n=i.length;if(0===n)return{startCol:0,endCol:0,visibleColumns:[]};let o=function(t,e,i){let r=0,s=e.length-1;for(;r<s;){const n=Math.floor((r+s)/2);e[n]+i[n]<=t?r=n+1:s=n}return r}(t,i,r);o=Math.max(0,o-s);const l=t+e;let h=o;for(let u=o;u<n;u++){if(i[u]>=l){h=u-1;break}h=u}h=Math.min(n-1,h+s);const a=[];for(let u=o;u<=h;u++)a.push(u);return{startCol:o,endCol:h,visibleColumns:a}}class h extends i{name="columnVirtualization";get defaultConfig(){return{autoEnable:!0,threshold:30,overscan:3}}isVirtualized=!1;startCol=0;endCol=0;scrollLeft=0;totalWidth=0;columnWidths=[];columnOffsets=[];originalColumns=[];attach(t){super.attach(t);const e=this.columns;this.columnWidths=s(e),this.columnOffsets=n(e),this.totalWidth=o(e),this.endCol=e.length-1}detach(){this.#e(),this.columnWidths=[],this.columnOffsets=[],this.originalColumns=[],this.isVirtualized=!1,this.startCol=0,this.endCol=0,this.scrollLeft=0,this.totalWidth=0}#e(){const t=this.gridElement;if(!t)return;const e=t.querySelector(".header-row");e&&(e.style.paddingLeft="",e.style.minWidth="");t.querySelectorAll(".data-grid-row").forEach(t=>{t.style.paddingLeft=""});const i=t.querySelector(".rows-viewport .rows");i&&(i.style.width="");const r=t.querySelector(".rows-body");r&&(r.style.minWidth="")}processColumns(t){(0===this.originalColumns.length||t.length>=this.originalColumns.length)&&(this.originalColumns=t,this.columnWidths=s(t),this.columnOffsets=n(t),this.totalWidth=o(t));const e=this.originalColumns,i=(r=e.length,h=this.config.threshold??30,!!(this.config.autoEnable??!0)&&r>h);var r,h;if(this.isVirtualized=i??!1,!i)return this.startCol=0,this.endCol=e.length-1,[...e];const a=this.grid.clientWidth||800,u=l(this.scrollLeft,a,this.columnOffsets,this.columnWidths,this.config.overscan??3);return this.startCol=u.startCol,this.endCol=u.endCol,u.visibleColumns.map(t=>e[t])}afterRender(){if(!this.isVirtualized)return;const t=this.gridElement;if(!t)return;const e=this.columnOffsets[this.startCol]??0,i=t.querySelector(".header-row"),r=t.querySelectorAll(".data-grid-row");i&&(i.style.paddingLeft=`${e}px`,i.style.minWidth=`${this.totalWidth}px`),r.forEach(t=>{t.style.paddingLeft=`${e}px`});const s=t.querySelector(".rows-viewport .rows");s&&(s.style.width=`${this.totalWidth}px`);const n=t.querySelector(".rows-body");n&&(n.style.minWidth=`${this.totalWidth}px`)}onScroll(t){if(!this.isVirtualized)return;Math.abs(t.scrollLeft-this.scrollLeft)<1||(this.scrollLeft=t.scrollLeft,this.requestColumnsRender())}getIsVirtualized(){return this.isVirtualized}getVisibleColumnRange(){return{start:this.startCol,end:this.endCol}}scrollToColumn(t){const e=this.columnOffsets[t]??0;this.grid.scrollLeft=e}getColumnOffset(t){return this.columnOffsets[t]??0}getTotalWidth(){return this.totalWidth}}export{h as ColumnVirtualizationPlugin};
 //# sourceMappingURL=index.js.map