@toolbox-web/grid 3.9.2 → 3.10.0

package/lib/plugins/visibility/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../../libs/grid/src/lib/core/constants.ts","../../../../../../libs/grid/src/lib/plugins/shared/drag-alternative-menu.ts","../../../../../../libs/grid/src/lib/plugins/visibility/visibility.css?inline","../../../../../../libs/grid/src/lib/plugins/visibility/visibility-plugin.ts"],"sourcesContent":["/**\n * Grid DOM Constants\n *\n * Centralized constants for CSS classes, data attributes, and selectors\n * used throughout the grid. Use these instead of magic strings.\n *\n * Note: Some constants here are used by plugins but defined in core because:\n * 1. The core CSS needs to style these elements (e.g., sticky positioning)\n * 2. Multiple plugins may share the same class names\n *\n * Plugins can define their own additional constants and export them.\n * See each plugin's index.ts for plugin-specific exports.\n */\n\n/**\n * CSS selector for focusable editor elements within a cell.\n * Used by EditingPlugin, UndoRedoPlugin, and keyboard navigation. Defined here\n * (a leaf module) rather than in `rows.ts` so `keyboard.ts` can consume it\n * without creating a rows ↔ keyboard import cycle.\n */\nexport const FOCUSABLE_EDITOR_SELECTOR =\n  'input,select,textarea,[contenteditable=\"true\"],[contenteditable=\"\"],[tabindex]:not([tabindex=\"-1\"])';\n\n// #region CSS Classes\n\n/**\n * CSS class names used in the grid's DOM.\n * Use these when adding/removing classes or querying elements.\n *\n * Classes are organized by:\n * - Core: Used by the grid core for structure and basic functionality\n * - Shared: Used by multiple features/plugins, styled by core CSS\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridClasses = {\n  // ─── Core Structure ───────────────────────────────────────────────\n  ROOT: 'tbw-grid-root',\n  HEADER: 'header',\n  HEADER_ROW: 'header-row',\n  HEADER_CELL: 'header-cell',\n\n  // Body structure\n  ROWS_VIEWPORT: 'rows-viewport',\n  ROWS_SPACER: 'rows-spacer',\n  ROWS_CONTAINER: 'rows',\n\n  // Row elements\n  DATA_ROW: 'data-grid-row',\n  GROUP_ROW: 'group-row',\n\n  // Cell elements\n  DATA_CELL: 'cell',\n\n  // ─── Core States ──────────────────────────────────────────────────\n  SELECTED: 'selected',\n  FOCUSED: 'focused',\n  EDITING: 'editing',\n  EXPANDED: 'expanded',\n  COLLAPSED: 'collapsed',\n  DRAGGING: 'dragging',\n  RESIZING: 'resizing',\n\n  // Sorting (core feature)\n  SORTABLE: 'sortable',\n  SORTED_ASC: 'sorted-asc',\n  SORTED_DESC: 'sorted-desc',\n\n  // Visibility\n  HIDDEN: 'hidden',\n\n  // ─── Shared Classes (used by plugins, styled by core CSS) ────────\n  // These are defined here because core CSS provides the base styling.\n  // Plugins apply these classes; core CSS defines how they look.\n\n  // Sticky positioning (PinnedColumnsPlugin applies, core CSS styles)\n  STICKY_LEFT: 'sticky-left',\n  STICKY_RIGHT: 'sticky-right',\n\n  // Pinned rows (PinnedRowsPlugin applies, core CSS styles)\n  PINNED_TOP: 'pinned-top',\n  PINNED_BOTTOM: 'pinned-bottom',\n\n  // Tree structure (TreePlugin applies, core CSS styles)\n  TREE_TOGGLE: 'tree-toggle',\n  TREE_INDENT: 'tree-indent',\n\n  // Grouping (GroupingRowsPlugin applies, core CSS styles)\n  GROUP_TOGGLE: 'group-toggle',\n  GROUP_LABEL: 'group-label',\n  GROUP_COUNT: 'group-count',\n\n  // Selection (SelectionPlugin applies, core CSS styles)\n  RANGE_SELECTION: 'range-selection',\n  SELECTION_OVERLAY: 'selection-overlay',\n} as const;\n\n// #endregion\n\n// #region Data Attributes\n\n/**\n * Data attribute names used on grid elements.\n * Use these when getting/setting data attributes.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridDataAttrs = {\n  // ─── Core Attributes ──────────────────────────────────────────────\n  FIELD: 'data-field',\n\n  /**\n   * Marks a `title` the grid itself put on a cell to reveal ellipsised text\n   * (WCAG SC 1.4.12). Anything that sets its own `title` on a cell must clear\n   * this, or the grid will later mistake that title for its own and replace it.\n   *\n   * @since 3.6.0\n   */\n  TRUNCATED: 'data-tbw-truncated',\n\n  // ─── Shared Attributes (used by plugins) ──────────────────────────\n  GROUP_KEY: 'data-group-key', // GroupingRowsPlugin\n} as const;\n\n// #endregion\n\n// #region Selectors\n\n/**\n * Common CSS selectors for querying grid elements.\n * Built from the class constants for consistency.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridSelectors = {\n  ROOT: `.${GridClasses.ROOT}`,\n  HEADER: `.${GridClasses.HEADER}`,\n  HEADER_ROW: `.${GridClasses.HEADER_ROW}`,\n  HEADER_CELL: `.${GridClasses.HEADER_CELL}`,\n  ROWS_VIEWPORT: `.${GridClasses.ROWS_VIEWPORT}`,\n  ROWS_CONTAINER: `.${GridClasses.ROWS_CONTAINER}`,\n  DATA_ROW: `.${GridClasses.DATA_ROW}`,\n  DATA_CELL: `.${GridClasses.DATA_CELL}`,\n  GROUP_ROW: `.${GridClasses.GROUP_ROW}`,\n\n  // By data attribute\n  CELL_BY_FIELD: (field: string) => `.${GridClasses.DATA_CELL}[${GridDataAttrs.FIELD}=\"${field}\"]`,\n\n  // State selectors\n  SELECTED_ROWS: `.${GridClasses.DATA_ROW}.${GridClasses.SELECTED}`,\n  EDITING_CELL: `.${GridClasses.DATA_CELL}.${GridClasses.EDITING}`,\n} as const;\n\n// #endregion\n\n// #region CSS Custom Properties\n\n/**\n * CSS custom property names for theming.\n * Use these when programmatically setting styles.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridCSSVars = {\n  // Colors\n  COLOR_BG: '--tbw-color-bg',\n  COLOR_FG: '--tbw-color-fg',\n  COLOR_FG_MUTED: '--tbw-color-fg-muted',\n  COLOR_BORDER: '--tbw-color-border',\n  COLOR_ACCENT: '--tbw-color-accent',\n  COLOR_HEADER_BG: '--tbw-color-header-bg',\n  COLOR_HEADER_FG: '--tbw-color-header-fg',\n  COLOR_SELECTION: '--tbw-color-selection',\n  COLOR_ROW_HOVER: '--tbw-color-row-hover',\n  COLOR_ROW_ALT: '--tbw-color-row-alt',\n\n  // Sizing\n  ROW_HEIGHT: '--tbw-row-height',\n  HEADER_HEIGHT: '--tbw-header-height',\n  CELL_PADDING: '--tbw-cell-padding',\n\n  // Typography\n  FONT_FAMILY: '--tbw-font-family',\n  FONT_SIZE: '--tbw-font-size',\n\n  // Borders\n  BORDER_RADIUS: '--tbw-border-radius',\n  FOCUS_OUTLINE: '--tbw-focus-outline',\n} as const;\n\n// #endregion\n\n// Type helpers\n\n/**\n * Union of all CSS class names used in the grid's DOM.\n * Use `GridClasses` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridClassName = (typeof GridClasses)[keyof typeof GridClasses];\n\n/**\n * Union of all `data-*` attribute names used on grid elements.\n * Use `GridDataAttrs` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridDataAttr = (typeof GridDataAttrs)[keyof typeof GridDataAttrs];\n\n/**\n * Union of all CSS custom property names (`--tbw-*`) available for theming.\n * Use `GridCSSVars` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridCSSVar = (typeof GridCSSVars)[keyof typeof GridCSSVars];\n","/**\n * Generic click-only action menu — the shared building block for WCAG 2.2\n * SC 2.5.7 \"Dragging Movements\" alternatives in plugins.\n *\n * Every drag affordance in the grid needs a path that works with plain clicks\n * or taps. A keyboard equivalent is **not** enough: SC 2.5.7 is specifically\n * about pointer input, and the W3C Understanding text calls out \"a pop-up menu\n * after tap\" as a conforming alternative. This module is that pop-up.\n *\n * Lives under `plugins/shared/` on purpose: each plugin bundle is built\n * self-contained, so this code is duplicated into the plugins that use it and\n * never lands in the core `index.js` budget.\n *\n * @since 3.6.0\n * @internal\n */\n\n/** Gap between the anchor element and the menu, in px. */\nconst ANCHOR_GAP_PX = 6;\n\n/** Runtime check — happy-dom and older browsers may lack the Popover API. */\nfunction supportsPopover(): boolean {\n  return typeof HTMLElement.prototype?.showPopover === 'function';\n}\n\nlet hoverlessQuery: MediaQueryList | null | undefined;\n\n/** Whether the primary pointer cannot hover (touch, most switch devices). */\nfunction isHoverless(): boolean {\n  if (hoverlessQuery === undefined) hoverlessQuery = globalThis.matchMedia?.('(hover: none)') ?? null;\n  return hoverlessQuery?.matches ?? false;\n}\n\n/**\n * Whether a plugin should also expose its drag alternative as a dedicated\n * inline control, on top of the menu that is always available.\n *\n * Hover-less pointers get one unconditionally — a control revealed on hover is\n * unreachable when nothing can hover, and long-press is the wrong fallback for\n * the tremor and low-dexterity users SC 2.5.7 exists for.\n *\n * Driven by `a11y.dragAlternatives` on the grid config.\n */\nexport function prefersInlineDragAlternative(grid: {\n  effectiveConfig?: { a11y?: { dragAlternatives?: 'menu' | 'inline' } };\n}): boolean {\n  return grid.effectiveConfig?.a11y?.dragAlternatives === 'inline' || isHoverless();\n}\n\n/** One clickable entry in the menu. */\nexport interface DragAlternativeAction {\n  /** Visible text, also the accessible name. */\n  label: string;\n  /** Render the entry but refuse the click (e.g. \"Move up\" on the first row). */\n  disabled?: boolean;\n  /** Invoked on click; the menu closes first so focus handling is predictable. */\n  run(): void;\n}\n\nexport interface DragAlternativeMenu {\n  /**\n   * Show `actions` anchored to `anchor`, with `label` as the group's accessible\n   * name. Mounted inside the anchor's grid host so it inherits theme tokens.\n   */\n  open(anchor: HTMLElement, label: string, actions: readonly DragAlternativeAction[]): void;\n  /** Hide the menu. Safe to call when already closed. */\n  close(): void;\n  /** Remove the element and every document-level listener. */\n  dispose(): void;\n  /** The menu element, or `null` before the first {@link DragAlternativeMenu.open}. */\n  readonly element: HTMLElement | null;\n}\n\n/**\n * Create a menu instance.\n *\n * @param id - DOM id for the menu element, unique per owning plugin.\n * @param className - Root class name, so each plugin can style its own menu.\n */\nexport function createDragAlternativeMenu(id: string, className: string): DragAlternativeMenu {\n  let root: HTMLDivElement | null = null;\n  let opened = false;\n  let disposed = false;\n  const abort = new AbortController();\n\n  function close(): void {\n    if (!opened || !root) return;\n    opened = false;\n    if (supportsPopover()) root.hidePopover();\n    root.hidden = true;\n  }\n\n  function build(): HTMLDivElement {\n    const el = document.createElement('div');\n    el.id = id;\n    el.className = className;\n    el.setAttribute('popover', 'manual');\n    el.setAttribute('role', 'group');\n    // Without the Popover API there is no UA `display: none`, so hide it here.\n    el.hidden = true;\n    // Tabbing past either end dismisses instead of stranding the user — the\n    // menu has no visible trigger to tab back to. A null `relatedTarget` (click\n    // focus in Firefox/Safari, focus leaving the document) is ignored.\n    el.addEventListener(\n      'focusout',\n      (e) => {\n        const next = (e as FocusEvent).relatedTarget;\n        if (next instanceof Node && !el.contains(next)) close();\n      },\n      { signal: abort.signal },\n    );\n    return el;\n  }\n\n  /**\n   * Position against the anchor in viewport coordinates. The menu lives in the\n   * top layer, so its containing block is the viewport regardless of where the\n   * anchor sits in the DOM.\n   */\n  function place(anchor: HTMLElement): void {\n    if (!root) return;\n    const a = anchor.getBoundingClientRect();\n    const box = root.getBoundingClientRect();\n    const left = Math.max(4, Math.min(a.left, window.innerWidth - box.width - 4));\n    const below = a.bottom + ANCHOR_GAP_PX;\n    const top = below + box.height <= window.innerHeight ? below : Math.max(4, a.top - ANCHOR_GAP_PX - box.height);\n    root.style.left = `${Math.round(left)}px`;\n    root.style.top = `${Math.round(top)}px`;\n  }\n\n  // Any pointer press outside the menu dismisses it. Capture phase so the press\n  // that lands on a grid cell still reaches its own handler afterwards.\n  document.addEventListener(\n    'pointerdown',\n    (e) => {\n      if (opened && root && !e.composedPath().includes(root)) close();\n    },\n    { capture: true, signal: abort.signal },\n  );\n  document.addEventListener(\n    'keydown',\n    (e) => {\n      if ((e as KeyboardEvent).key === 'Escape') close();\n    },\n    { capture: true, signal: abort.signal },\n  );\n\n  return {\n    get element() {\n      return root;\n    },\n    open(anchor, label, actions) {\n      if (disposed || actions.length === 0) return;\n      if (!root) root = build();\n      // Mount inside the grid host (light DOM) so theme custom properties and\n      // `color-scheme` cascade in; the top layer keeps it out of overflow.\n      const host = anchor.closest<HTMLElement>('tbw-grid, [data-tbw-grid]') ?? document.body;\n      if (root.parentNode !== host) host.appendChild(root);\n      root.setAttribute('aria-label', label);\n      root.replaceChildren();\n      for (const action of actions) {\n        const btn = document.createElement('button');\n        btn.type = 'button';\n        btn.className = `${className}-item`;\n        btn.textContent = action.label;\n        btn.disabled = action.disabled === true;\n        btn.addEventListener('click', () => {\n          close();\n          action.run();\n        });\n        root.appendChild(btn);\n      }\n      root.hidden = false;\n      if (!opened && supportsPopover()) root.showPopover();\n      opened = true;\n      place(anchor);\n      root.querySelector<HTMLButtonElement>('button:not([disabled])')?.focus();\n    },\n    close,\n    dispose() {\n      disposed = true;\n      close();\n      abort.abort();\n      root?.remove();\n      root = null;\n    },\n  };\n}\n","@layer tbw-plugins {\n  .tbw-visibility-content {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n\n  .tbw-visibility-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem));\n  }\n\n  .tbw-visibility-row {\n    display: flex;\n    align-items: center;\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n    padding: var(--tbw-menu-item-padding, 0.375rem 0.25rem);\n    cursor: pointer;\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    position: relative;\n  }\n  .tbw-visibility-row:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n  .tbw-visibility-row input[type='checkbox'] {\n    cursor: pointer;\n  }\n  .tbw-visibility-row.locked span {\n    color: var(--tbw-color-fg-muted);\n  }\n\n  /* Drag handle */\n  .tbw-visibility-handle {\n    cursor: grab;\n    color: var(--tbw-color-fg-muted);\n    font-size: var(--tbw-font-size-2xs, 0.625rem);\n    letter-spacing: -2px;\n    user-select: none;\n    flex-shrink: 0;\n  }\n  .tbw-visibility-row.reorderable:hover .tbw-visibility-handle {\n    color: var(--tbw-color-fg);\n  }\n  /* Label wrapper for checkbox and text */\n  .tbw-visibility-label {\n    display: flex;\n    align-items: center;\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n    flex: 1;\n    cursor: pointer;\n  }\n\n  /* Drag states */\n  .tbw-visibility-row.dragging {\n    opacity: 0.5;\n    cursor: grabbing;\n  }\n  .tbw-visibility-row.drop-before::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n  .tbw-visibility-row.drop-after::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n\n  .tbw-visibility-show-all {\n    margin: var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem));\n    padding: var(--tbw-button-padding, 0.5rem 0.75rem);\n    border: 1px solid var(--tbw-visibility-border, var(--tbw-color-border));\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    background: var(--tbw-visibility-btn-bg, var(--tbw-color-header-bg));\n    color: var(--tbw-color-fg);\n    cursor: pointer;\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n  }\n  .tbw-visibility-show-all:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n\n  /* Group header */\n  .tbw-visibility-group-header {\n    display: flex;\n    align-items: center;\n    padding: var(--tbw-menu-item-padding, 0.375rem 0.25rem);\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n    font-weight: 600;\n    color: var(--tbw-color-fg);\n    border-bottom: 1px solid var(--tbw-color-border);\n    margin-top: var(--tbw-spacing-sm, 0.25rem);\n    position: relative;\n  }\n  .tbw-visibility-group-header:first-child {\n    margin-top: 0;\n  }\n  .tbw-visibility-group-header .tbw-visibility-label {\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n  }\n\n  /* Reorderable group header */\n  .tbw-visibility-group-header.reorderable {\n    cursor: grab;\n  }\n  .tbw-visibility-group-header.reorderable:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n  .tbw-visibility-group-header .tbw-visibility-handle {\n    cursor: grab;\n    color: var(--tbw-color-fg-muted);\n    font-size: var(--tbw-font-size-2xs, 0.625rem);\n    letter-spacing: -2px;\n    user-select: none;\n    flex-shrink: 0;\n  }\n  .tbw-visibility-group-header.reorderable:hover .tbw-visibility-handle {\n    color: var(--tbw-color-fg);\n  }\n\n  /* Coarse pointer (touch): handles always in active colour and large enough to tap */\n  @media (hover: none) {\n    .tbw-visibility-row.reorderable .tbw-visibility-handle,\n    .tbw-visibility-group-header.reorderable .tbw-visibility-handle {\n      color: var(--tbw-color-fg);\n    }\n  }\n\n  @media (pointer: coarse) {\n    .tbw-visibility-handle {\n      min-width: var(--tbw-touch-target-min, 24px);\n      min-height: var(--tbw-touch-target-min, 24px);\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  /* Group drag states */\n  .tbw-visibility-group-header.dragging {\n    opacity: 0.5;\n    cursor: grabbing;\n  }\n  .tbw-visibility-group-header.drop-before::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n  .tbw-visibility-group-header.drop-after::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n\n  /* Indented column rows within a group */\n  .tbw-visibility-row--grouped {\n    padding-left: calc(var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem)) + 0.75rem);\n  }\n\n  /* ===== Handle move menu (WCAG 2.2 SC 2.5.7) ===== */\n\n  .tbw-visibility-move-menu {\n    position: fixed;\n    margin: 0;\n    padding: 4px;\n    display: flex;\n    flex-direction: column;\n    min-width: 10rem;\n    background: var(--tbw-color-panel-bg, light-dark(#fff, #1e1e1e));\n    color: var(--tbw-color-panel-fg, light-dark(#1a1a1a, #eaeaea));\n    border: 1px solid var(--tbw-color-border, light-dark(#d0d0d0, #3a3a3a));\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    box-shadow: var(--tbw-shadow-panel, 0 4px 12px light-dark(rgb(0 0 0 / 20%), rgb(0 0 0 / 50%)));\n    font: inherit;\n    z-index: 10001;\n\n    &[hidden] {\n      display: none;\n    }\n  }\n\n  .tbw-visibility-move-menu-item {\n    min-height: var(--tbw-touch-target-min, 24px);\n    padding: 4px 8px;\n    text-align: start;\n    background: none;\n    color: inherit;\n    font: inherit;\n    border: 0;\n    /* Themes set radii for much larger surfaces (Material uses 12px), which\n       turns a 24px row into a lozenge. */\n    border-radius: min(var(--tbw-border-radius, 0.25rem), 6px);\n    cursor: pointer;\n\n    &:hover:not(:disabled) {\n      background: var(--tbw-color-row-hover, light-dark(#00000010, #ffffff14));\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: default;\n    }\n  }\n} /* End @layer tbw-plugins */\n","/**\n * Column Visibility Plugin (Class-based)\n *\n * Provides a UI for column visibility control via the shell's tool panel system.\n * Column visibility is a core grid feature - this plugin provides:\n * - A tool panel for column visibility management (registered with the shell)\n * - Backward-compatible API methods that delegate to grid.setColumnVisible(), etc.\n *\n * The grid emits 'column-visibility' events when columns are shown/hidden,\n * allowing consumers to save user preferences.\n *\n * When a reorder plugin is present, column rows become draggable for reordering.\n * Drag-drop emits 'column-reorder-request' events that the ReorderPlugin can listen for.\n */\n\nimport { GridClasses } from '../../core/constants';\nimport {\n  BaseGridPlugin,\n  type PluginDependency,\n  type PluginManifest,\n  type PluginQuery,\n} from '../../core/plugin/base-plugin';\nimport type { ColumnConfig, ColumnInternal } from '../../core/types';\nimport type { ContextMenuParams, HeaderContextMenuItem } from '../context-menu/types';\nimport {\n  createDragAlternativeMenu,\n  type DragAlternativeAction,\n  type DragAlternativeMenu,\n} from '../shared/drag-alternative-menu';\nimport type { ToolPanelDefinition } from '../shell/types';\nimport type { ColumnGroupInfo, ColumnReorderRequestDetail, VisibilityConfig } from './types';\nimport styles from './visibility.css?inline';\n\n/** Column metadata shape returned by `grid.getAllColumns()`. */\ntype ColumnEntry = {\n  field: string;\n  header: string;\n  visible: boolean;\n  lockVisible?: boolean;\n  utility?: boolean;\n};\n\n/** A contiguous run of same-group columns, or a single ungrouped column. */\ntype PanelFragment = { group: ColumnGroupInfo | null; columns: ColumnEntry[] };\n\n/**\n * Column Visibility Plugin for tbw-grid\n *\n * Gives users control over which columns are displayed. Hide less important columns\n * by default, let users toggle them via a column chooser UI, or programmatically\n * show/hide columns based on user preferences or screen size.\n *\n * > **Optional Enhancement:** When ReorderPlugin is also loaded, columns in the\n * > visibility panel become draggable for reordering.\n *\n * ## Installation\n *\n * ```ts\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n * ```\n *\n * ## Column Configuration\n *\n * | Property | Type | Default | Description |\n * |----------|------|---------|-------------|\n * | `visible` | `boolean` | `true` | Initial visibility state |\n * | `lockVisible` | `boolean` | `false` | Prevent user from toggling (legacy `meta.lockVisibility` is honored) |\n *\n * ## CSS Custom Properties\n *\n * | Property | Default | Description |\n * |----------|---------|-------------|\n * | `--tbw-visibility-hover` | `var(--tbw-color-row-hover)` | Row hover background |\n * | `--tbw-panel-padding` | `0.75em` | Panel content padding |\n * | `--tbw-panel-gap` | `0.5em` | Gap between items |\n *\n * @example Columns Hidden by Default\n * ```ts\n * import { queryGrid } from '@toolbox-web/grid';\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n *\n * const grid = queryGrid('tbw-grid');\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'id', header: 'ID' },\n *     { field: 'name', header: 'Name' },\n *     { field: 'phone', header: 'Phone', visible: false }, // Hidden by default\n *     { field: 'address', header: 'Address', visible: false },\n *   ],\n *   plugins: [new VisibilityPlugin()],\n * };\n *\n * // Toggle programmatically\n * const plugin = grid.getPluginByName('visibility');\n * plugin.showColumn('phone');\n * ```\n *\n * @example With Drag-to-Reorder\n * ```ts\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n * import { ReorderPlugin } from '@toolbox-web/grid/plugins/reorder-columns';\n *\n * grid.gridConfig = {\n *   plugins: [\n *     new ReorderPlugin(),      // Enables drag-drop in visibility panel\n *     new VisibilityPlugin(),\n *   ],\n * };\n * ```\n *\n * @see {@link VisibilityConfig} for configuration options\n * @see ReorderPlugin for drag-to-reorder integration\n *\n * @internal Extends BaseGridPlugin\n * @since 0.1.1\n */\nexport class VisibilityPlugin extends BaseGridPlugin<VisibilityConfig> {\n  /**\n   * Plugin dependencies.\n   *\n   * - `shell` (required): VisibilityPlugin renders its column list inside a\n   *   shell tool panel. Without the shell plugin there is no host for the\n   *   panel. The shell auto-registers today, so this only bites once the\n   *   auto-register is removed at v3 (#370).\n   * - `reorder` (optional): when present, columns in the visibility panel\n   *   become draggable.\n   * @internal\n   */\n  static override readonly dependencies: PluginDependency[] = [\n    { name: 'shell', required: true, reason: 'VisibilityPlugin renders its column list in a shell tool panel' },\n    { name: 'reorder', required: false, reason: 'Enables drag-to-reorder columns in visibility panel' },\n  ];\n\n  /**\n   * Plugin manifest - declares handled queries.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest = {\n    queries: [\n      {\n        type: 'getContextMenuItems',\n        description: 'Contributes \"Hide column\" item to the header context menu',\n      },\n    ],\n  };\n\n  /** @internal */\n  readonly name = 'visibility';\n\n  /** Tool panel ID for shell integration */\n  static readonly PANEL_ID = 'columns';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<VisibilityConfig> {\n    return {};\n  }\n\n  // #region Internal State\n  private columnListElement: HTMLElement | null = null;\n\n  // Drag state for reorder integration\n  private isDragging = false;\n  private draggedField: string | null = null;\n  private draggedIndex: number | null = null;\n  private dropIndex: number | null = null;\n  /** When dragging a group, holds the group ID; null for individual column drags. */\n  private draggedGroupId: string | null = null;\n  /** Fields belonging to the group currently being dragged. */\n  private draggedGroupFields: string[] = [];\n  /** Click-only move menu (SC 2.5.7). One instance shared by every drag handle. */\n  private moveMenu: DragAlternativeMenu | null = null;\n\n  /** Clear drag-related classes from all rows and group headers in a list. */\n  private clearDragClasses(container: HTMLElement): void {\n    container.querySelectorAll('.tbw-visibility-row, .tbw-visibility-group-header').forEach((r) => {\n      r.classList.remove(GridClasses.DRAGGING, 'drop-target', 'drop-before', 'drop-after');\n    });\n  }\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: import('../../core/plugin/base-plugin').GridElement): void {\n    super.attach(grid);\n\n    // Listen for column-move events (emitted by ReorderPlugin after any reorder,\n    // including header drag-drop and visibility panel drag-drop) to keep the\n    // panel list in sync with the grid's column order.\n    this.gridElement.addEventListener(\n      'column-move',\n      () => {\n        if (this.columnListElement) {\n          // column-move fires BEFORE setColumnOrder runs. Defer the rebuild\n          // to allow the full reorder cycle (setColumnOrder + renderHeader +\n          // refreshVirtualWindow) to complete before reading the new order.\n          // Use RAF to run after the current synchronous work and any\n          // animation frames queued by the animation system.\n          requestAnimationFrame(() => {\n            if (this.columnListElement) {\n              this.rebuildToggles(this.columnListElement);\n            }\n          });\n        }\n      },\n      { signal: this.disconnectSignal },\n    );\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.columnListElement = null;\n    this.isDragging = false;\n    this.draggedField = null;\n    this.draggedIndex = null;\n    this.dropIndex = null;\n    this.moveMenu?.dispose();\n    this.moveMenu = null;\n  }\n  // #endregion\n\n  // #region Render Hooks\n\n  /**\n   * Read declarative visibility attributes from the originating\n   * `<tbw-grid-column>` element (issue #272). `hidden` and `lock-visible`\n   * only seed the initial state — the `=== undefined` guards ensure a runtime\n   * toggle (`setColumnVisible`, which writes `col.hidden = false`) or an\n   * explicit config value always wins over the attribute.\n   * @internal\n   */\n  override processColumns(columns: ColumnConfig[]): ColumnConfig[] {\n    for (const col of columns) {\n      const el = (col as ColumnInternal).__element;\n      if (!el) continue;\n      if (col.hidden === undefined && el.hasAttribute('hidden') && el.getAttribute('hidden') !== 'false') {\n        col.hidden = true;\n      }\n      if (\n        col.lockVisible === undefined &&\n        el.hasAttribute('lock-visible') &&\n        el.getAttribute('lock-visible') !== 'false'\n      ) {\n        col.lockVisible = true;\n      }\n    }\n    return columns;\n  }\n  // #endregion\n\n  // #region Query Handlers\n\n  /**\n   * Handle inter-plugin queries.\n   * Contributes a \"Hide column\" item to the header context menu.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getContextMenuItems') {\n      const params = query.context as ContextMenuParams;\n      if (!params.isHeader) return undefined;\n\n      const column = params.column as ColumnConfig;\n      if (!column?.field) return undefined;\n\n      // Don't offer \"Hide\" for locked-visibility columns\n      // (top-level `lockVisible` preferred; legacy `meta.lockVisibility` honored for back-compat)\n      if (column.lockVisible || column.meta?.lockVisibility) return undefined;\n\n      const items: HeaderContextMenuItem[] = [\n        {\n          id: 'visibility/hide-column',\n          label: this.t('columns.hideColumn', 'Hide Column'),\n          icon: '👁',\n          order: 30,\n          action: () => this.hideColumn(column.field),\n        },\n      ];\n\n      return items;\n    }\n    return undefined;\n  }\n  // #endregion\n\n  // #region Shell Integration\n\n  /**\n   * Register the column visibility tool panel with the shell.\n   * @internal\n   */\n  override getToolPanel(): ToolPanelDefinition | undefined {\n    return {\n      id: VisibilityPlugin.PANEL_ID,\n      title: this.t('columns.panelTitle', 'Columns'),\n      icon: '☰',\n      tooltip: 'Column visibility',\n      order: 100, // High order so it appears last\n      render: (container) => this.renderPanelContent(container),\n    };\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Resolve the shell plugin (#370). The visibility tool panel lives in the\n   * shell, so panel open/close/toggle is delegated to the ShellPlugin instance\n   * rather than the deprecated core `grid.*` shell delegates.\n   */\n  #shell() {\n    return this.grid.getPluginByName('shell');\n  }\n\n  /**\n   * Show the visibility sidebar panel.\n   * Opens the tool panel and ensures this section is expanded.\n   */\n  show(): void {\n    this.#shell()?.openToolPanel(VisibilityPlugin.PANEL_ID);\n  }\n\n  /**\n   * Hide the visibility sidebar panel.\n   */\n  hide(): void {\n    this.#shell()?.closeToolPanel();\n  }\n\n  /**\n   * Toggle the visibility sidebar panel section.\n   */\n  toggle(): void {\n    const shell = this.#shell();\n    // If tool panel is closed, open it first\n    if (!shell?.isToolPanelOpen) {\n      shell?.openToolPanel();\n    }\n    shell?.toggleToolPanelSection(VisibilityPlugin.PANEL_ID);\n  }\n\n  /**\n   * Check if a specific column is visible.\n   * Delegates to grid.isColumnVisible().\n   * @param field - The field name to check\n   * @returns True if the column is visible\n   */\n  isColumnVisible(field: string): boolean {\n    return this.grid.isColumnVisible(field);\n  }\n\n  /**\n   * Set visibility for a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column\n   * @param visible - Whether the column should be visible\n   */\n  setColumnVisible(field: string, visible: boolean): void {\n    this.grid.setColumnVisible(field, visible);\n  }\n\n  /**\n   * Get list of all visible column fields.\n   * @returns Array of visible field names\n   */\n  getVisibleColumns(): string[] {\n    return this.grid\n      .getAllColumns()\n      .filter((c) => c.visible)\n      .map((c) => c.field);\n  }\n\n  /**\n   * Get list of all hidden column fields.\n   * @returns Array of hidden field names\n   */\n  getHiddenColumns(): string[] {\n    return this.grid\n      .getAllColumns()\n      .filter((c) => !c.visible)\n      .map((c) => c.field);\n  }\n\n  /**\n   * Show all columns.\n   * Delegates to grid.showAllColumns().\n   */\n  showAll(): void {\n    this.grid.showAllColumns();\n  }\n\n  /**\n   * Toggle visibility for a specific column.\n   * Delegates to grid.toggleColumnVisibility().\n   * @param field - The field name of the column\n   */\n  toggleColumn(field: string): void {\n    this.grid.toggleColumnVisibility(field);\n  }\n\n  /**\n   * Show a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column to show\n   */\n  showColumn(field: string): void {\n    this.setColumnVisible(field, true);\n  }\n\n  /**\n   * Hide a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column to hide\n   */\n  hideColumn(field: string): void {\n    this.setColumnVisible(field, false);\n  }\n\n  /**\n   * Get all columns with their visibility status.\n   * Useful for building visibility UI.\n   * @returns Array of column info with visibility status\n   */\n  getAllColumns(): Array<{\n    field: string;\n    header: string;\n    visible: boolean;\n    lockVisible?: boolean;\n    utility?: boolean;\n  }> {\n    return this.grid.getAllColumns();\n  }\n\n  /**\n   * Check if the sidebar panel is currently open.\n   * @returns True if the panel section is expanded\n   */\n  isPanelVisible(): boolean {\n    const shell = this.#shell();\n    return !!shell?.isToolPanelOpen && shell.expandedToolPanelSections.includes(VisibilityPlugin.PANEL_ID);\n  }\n  // #endregion\n\n  // #region Private Methods\n\n  /**\n   * Render the panel content into the shell's tool panel container.\n   * Returns a cleanup function.\n   */\n  private renderPanelContent(container: HTMLElement): (() => void) | void {\n    // Create content wrapper\n    const wrapper = document.createElement('div');\n    wrapper.className = 'tbw-visibility-content';\n\n    // Column list container\n    const columnList = document.createElement('div');\n    columnList.className = 'tbw-visibility-list';\n    wrapper.appendChild(columnList);\n\n    // Show all button\n    const showAllBtn = document.createElement('button');\n    showAllBtn.type = 'button';\n    showAllBtn.className = 'tbw-visibility-show-all';\n    showAllBtn.textContent = this.t('columns.showAll', 'Show All');\n    showAllBtn.addEventListener('click', () => {\n      this.grid.showAllColumns();\n      this.rebuildToggles(columnList);\n    });\n    wrapper.appendChild(showAllBtn);\n\n    // Store reference\n    this.columnListElement = columnList;\n\n    // Build initial toggles\n    this.rebuildToggles(columnList);\n\n    // Append to container\n    container.appendChild(wrapper);\n\n    // Return cleanup function\n    return () => {\n      this.columnListElement = null;\n      this.moveMenu?.close();\n      wrapper.remove();\n    };\n  }\n\n  /**\n   * Check if a reorder plugin is present (by name to avoid static import).\n   */\n  private hasReorderPlugin(): boolean {\n    const plugin = this.grid?.getPluginByName?.('reorder');\n    // Duck-type check - just verify the plugin exists and has a moveColumn method\n    return !!(plugin && typeof (plugin as { moveColumn?: unknown }).moveColumn === 'function');\n  }\n\n  /**\n   * Ask the plugin system whether a column may be reordered.\n   *\n   * Looks up the real `ColumnConfig` by field (the projection from `getAllColumns()`\n   * intentionally omits plugin-owned flags like `lockPosition`) and forwards it to\n   * the `canMoveColumn` query handled by ReorderPlugin and vetoed by other plugins\n   * (e.g. PinnedColumnsPlugin blocking sticky columns). Returns `false` when no\n   * plugin answers, which keeps the panel non-draggable when reorder is absent.\n   */\n  private canMoveColumn(column: ColumnEntry): boolean {\n    const config = this.grid.columns.find((c) => c.field === column.field);\n    if (!config) return false;\n    const responses = this.grid.query<boolean>('canMoveColumn', config);\n    return responses.length > 0 && !responses.includes(false);\n  }\n\n  /**\n   * Build the column toggle checkboxes.\n   * When GroupingColumnsPlugin is present, renders columns under collapsible group headers.\n   * Groups that are fragmented (same group split across non-contiguous positions) are\n   * shown as separate sections to match the grid's visual layout.\n   * When a reorder plugin is present, adds drag handles for reordering.\n   */\n  private rebuildToggles(columnList: HTMLElement): void {\n    const reorderEnabled = this.hasReorderPlugin();\n\n    columnList.innerHTML = '';\n\n    // getAllColumns() returns columns in their effective display order\n    // Filter out utility columns (e.g., expander column) as they're internal\n    const allColumns = this.grid.getAllColumns().filter((c) => !c.utility);\n    const fragments = this.currentFragments();\n\n    if (fragments.every((f) => !f.group)) {\n      // No grouping — render flat list (original behavior)\n      this.renderFlatColumnList(allColumns, reorderEnabled, columnList);\n      return;\n    }\n\n    for (const fragment of fragments) {\n      if (fragment.group) {\n        this.renderGroupSection(fragment.group, fragment.columns, reorderEnabled, columnList);\n      } else {\n        // Ungrouped column — render as individual row\n        const fullIndex = allColumns.indexOf(fragment.columns[0]);\n        columnList.appendChild(this.createColumnRow(fragment.columns[0], fullIndex, reorderEnabled, columnList));\n      }\n    }\n  }\n\n  /**\n   * The panel's current top-level rows, in display order: one entry per group\n   * fragment plus one per ungrouped column. Recomputed from live grid state on\n   * every call so the move menu can never act on a stale panel.\n   *\n   * Walks columns in display order and detects contiguous fragments. A fragment\n   * is a run of consecutive columns belonging to the same group. Fragmented\n   * groups (same group ID at non-contiguous positions) produce separate sections\n   * so the panel matches the grid's visual layout.\n   */\n  private currentFragments(): PanelFragment[] {\n    const allColumns = this.grid.getAllColumns().filter((c) => !c.utility);\n\n    // Query for column grouping info from GroupingColumnsPlugin (or any responder)\n    const groupResults = this.grid.query<ColumnGroupInfo[]>('getColumnGrouping');\n    const groups: ColumnGroupInfo[] = groupResults?.flat().filter((g) => g && g.fields.length > 0) ?? [];\n    if (groups.length === 0) return allColumns.map((c) => ({ group: null, columns: [c] }));\n\n    const fieldToGroup = new Map<string, ColumnGroupInfo>();\n    for (const group of groups) {\n      for (const field of group.fields) fieldToGroup.set(field, group);\n    }\n    return this.computeFragments(allColumns, fieldToGroup);\n  }\n\n  /**\n   * Compute contiguous column fragments from display-order columns.\n   * Each fragment is either a group section (contiguous run of same-group columns)\n   * or a single ungrouped column.\n   */\n  private computeFragments(\n    allColumns: ColumnEntry[],\n    fieldToGroup: Map<string, ColumnGroupInfo>,\n  ): PanelFragment[] {\n    const fragments: PanelFragment[] = [];\n    let currentGroup: ColumnGroupInfo | null = null;\n    let currentCols: ColumnEntry[] = [];\n\n    for (const col of allColumns) {\n      const group = fieldToGroup.get(col.field) ?? null;\n\n      if (group && currentGroup && group.id === currentGroup.id) {\n        // Same group continues — extend fragment\n        currentCols.push(col);\n      } else {\n        // Flush previous fragment\n        if (currentCols.length > 0) {\n          fragments.push({ group: currentGroup, columns: currentCols });\n        }\n        currentGroup = group;\n        currentCols = [col];\n      }\n    }\n    // Flush last fragment\n    if (currentCols.length > 0) {\n      fragments.push({ group: currentGroup, columns: currentCols });\n    }\n\n    return fragments;\n  }\n\n  /**\n   * Render a group fragment section with header checkbox and indented column rows.\n   * A fragment is a contiguous run of columns from the same group. When a group is\n   * fragmented (split across non-contiguous positions), each fragment gets its own section.\n   */\n  private renderGroupSection(\n    group: ColumnGroupInfo,\n    columns: ColumnEntry[],\n    reorderEnabled: boolean,\n    container: HTMLElement,\n  ): void {\n    // The fragment's fields — only the columns in this contiguous section\n    const fragmentFields = columns.map((c) => c.field);\n\n    // Group header row\n    const header = document.createElement('div');\n    header.className = 'tbw-visibility-group-header';\n    header.setAttribute('data-group-id', group.id);\n\n    // Make group header draggable when reorder is enabled.\n    // Pass only this fragment's fields so dragging moves just this\n    // contiguous block, not all columns of the (possibly fragmented) group.\n    if (reorderEnabled) {\n      header.draggable = true;\n      header.classList.add('reorderable');\n      this.setupGroupDragListeners(header, group, fragmentFields, container);\n    }\n\n    const headerLabel = document.createElement('label');\n    headerLabel.className = 'tbw-visibility-label';\n\n    const groupCheckbox = document.createElement('input');\n    groupCheckbox.type = 'checkbox';\n\n    // Calculate tri-state: all visible, all hidden, or mixed\n    const visibleCount = columns.filter((c) => c.visible).length;\n    const allLocked = columns.every((c) => c.lockVisible);\n    if (visibleCount === columns.length) {\n      groupCheckbox.checked = true;\n      groupCheckbox.indeterminate = false;\n    } else if (visibleCount === 0) {\n      groupCheckbox.checked = false;\n      groupCheckbox.indeterminate = false;\n    } else {\n      groupCheckbox.checked = false;\n      groupCheckbox.indeterminate = true;\n    }\n    groupCheckbox.disabled = allLocked;\n\n    // Toggle all columns in group\n    groupCheckbox.addEventListener('change', () => {\n      const newVisible = groupCheckbox.checked;\n      for (const col of columns) {\n        if (col.lockVisible) continue;\n        this.grid.setColumnVisible(col.field, newVisible);\n      }\n      setTimeout(() => this.rebuildToggles(container), 0);\n    });\n\n    const headerText = document.createElement('span');\n    headerText.textContent = group.label;\n\n    headerLabel.appendChild(groupCheckbox);\n    headerLabel.appendChild(headerText);\n    header.appendChild(headerLabel);\n\n    // Add drag handle icon for group if reorderable\n    if (reorderEnabled) {\n      const handle = document.createElement('span');\n      handle.className = 'tbw-visibility-handle';\n      this.setIcon(handle, 'dragHandle');\n      handle.title = this.t('columns.dragGroupHandle', 'Drag to reorder group, or click for move options');\n      this.wireMoveHandle(handle, group.label, () => this.groupMoveActions(fragmentFields));\n      // Insert handle before the label\n      header.insertBefore(handle, headerLabel);\n    }\n\n    container.appendChild(header);\n\n    // Render indented column rows\n    const allColumnsFullList = this.grid.getAllColumns().filter((c) => !c.utility);\n    for (const col of columns) {\n      const fullIndex = allColumnsFullList.findIndex((c) => c.field === col.field);\n      const row = this.createColumnRow(col, fullIndex, reorderEnabled, container);\n      row.classList.add('tbw-visibility-row--grouped');\n      container.appendChild(row);\n    }\n  }\n\n  /**\n   * Render a flat (ungrouped) list of column rows.\n   */\n  private renderFlatColumnList(columns: ColumnEntry[], reorderEnabled: boolean, container: HTMLElement): void {\n    const allColumnsFullList = this.grid.getAllColumns().filter((c) => !c.utility);\n    for (const col of columns) {\n      const fullIndex = allColumnsFullList.findIndex((c) => c.field === col.field);\n      container.appendChild(this.createColumnRow(col, fullIndex, reorderEnabled, container));\n    }\n  }\n\n  /**\n   * Create a single column visibility row element.\n   */\n  private createColumnRow(\n    col: ColumnEntry,\n    index: number,\n    reorderEnabled: boolean,\n    columnList: HTMLElement,\n  ): HTMLElement {\n    const label = col.header || col.field;\n\n    const row = document.createElement('div');\n    row.className = col.lockVisible ? 'tbw-visibility-row locked' : 'tbw-visibility-row';\n    row.setAttribute('data-field', col.field);\n    row.setAttribute('data-index', String(index));\n\n    // Add drag handle if reorder is enabled\n    if (reorderEnabled && this.canMoveColumn(col)) {\n      row.draggable = true;\n      row.classList.add('reorderable');\n      this.setupDragListeners(row, col.field, index, columnList);\n    }\n\n    const labelWrapper = document.createElement('label');\n    labelWrapper.className = 'tbw-visibility-label';\n\n    const checkbox = document.createElement('input');\n    checkbox.type = 'checkbox';\n    checkbox.checked = col.visible;\n    checkbox.disabled = col.lockVisible ?? false;\n    checkbox.addEventListener('change', () => {\n      this.grid.toggleColumnVisibility(col.field);\n      // Refresh after toggle (grid may re-render)\n      setTimeout(() => this.rebuildToggles(columnList), 0);\n    });\n\n    const text = document.createElement('span');\n    text.textContent = label;\n\n    labelWrapper.appendChild(checkbox);\n    labelWrapper.appendChild(text);\n\n    // Add drag handle icon if reorderable\n    if (reorderEnabled && this.canMoveColumn(col)) {\n      const handle = document.createElement('span');\n      handle.className = 'tbw-visibility-handle';\n      this.setIcon(handle, 'dragHandle');\n      handle.title = this.t('columns.dragHandle', 'Drag to reorder, or click for move options');\n      this.wireMoveHandle(handle, label, () => this.columnMoveActions(col.field));\n      row.appendChild(handle);\n    }\n\n    row.appendChild(labelWrapper);\n    return row;\n  }\n\n  /**\n   * Turn a drag handle into the pointer alternative required by WCAG 2.2\n   * SC 2.5.7: a press-and-release without movement never fires `dragstart`, so\n   * a plain click on the handle is the tap the criterion asks us to honour.\n   *\n   * The handle stays part of the row's drag surface — it is deliberately not\n   * marked `draggable=\"false\"` — so dragging by the handle keeps working.\n   * Actions are resolved on click, never at render time, so a stale panel can\n   * never move the wrong column.\n   */\n  private wireMoveHandle(handle: HTMLElement, name: string, actions: () => DragAlternativeAction[]): void {\n    handle.setAttribute('role', 'button');\n    handle.tabIndex = -1;\n    handle.setAttribute('aria-label', `${name} — ${this.t('columns.moveHandleHint', 'drag, or activate for move options')}`);\n    handle.addEventListener('click', () => {\n      this.moveMenu ??= createDragAlternativeMenu('tbw-visibility-move-menu', 'tbw-visibility-move-menu');\n      this.moveMenu.open(handle, name, actions());\n    });\n  }\n\n  /**\n   * Emit the reorder request a drop at `dropIndex` would have produced.\n   * `fromIndex`/`dropIndex` are positions in the panel's non-utility list;\n   * `toIndex` is converted to the full column order the way the drop handler\n   * does it, so the click path and the drag path can never diverge.\n   */\n  private requestColumnMove(field: string, fromIndex: number, dropIndex: number): void {\n    const effectiveToIndex = dropIndex > fromIndex ? dropIndex - 1 : dropIndex;\n    if (effectiveToIndex === fromIndex) return;\n\n    const allColumns = this.grid.getAllColumns();\n    const nonUtilityColumns = allColumns.filter((c) => !c.utility);\n    const targetField = nonUtilityColumns[effectiveToIndex]?.field;\n    const toIndex = targetField ? allColumns.findIndex((c) => c.field === targetField) : allColumns.length;\n\n    this.emit<ColumnReorderRequestDetail>('column-reorder-request', { field, fromIndex, toIndex });\n  }\n\n  /** Click-only move actions for a single column row. */\n  private columnMoveActions(field: string): DragAlternativeAction[] {\n    const columns = this.grid.getAllColumns().filter((c) => !c.utility);\n    const from = columns.findIndex((c) => c.field === field);\n    const landable = (i: number) => i >= 0 && i < columns.length && this.canMoveColumn(columns[i]);\n\n    return [\n      {\n        label: this.t('columns.moveUp', 'Move up'),\n        disabled: !landable(from - 1),\n        run: () => this.requestColumnMove(field, from, from - 1),\n      },\n      {\n        label: this.t('columns.moveDown', 'Move down'),\n        // The drop path takes an insert-before index, so stepping down one\n        // place means aiming past the row that follows.\n        disabled: !landable(from + 1),\n        run: () => this.requestColumnMove(field, from, from + 2),\n      },\n      {\n        label: this.t('columns.moveToTop', 'Move to top'),\n        disabled: from <= 0 || !landable(0),\n        run: () => this.requestColumnMove(field, from, 0),\n      },\n      {\n        label: this.t('columns.moveToBottom', 'Move to bottom'),\n        disabled: from < 0 || from >= columns.length - 1 || !landable(columns.length - 1),\n        run: () => this.requestColumnMove(field, from, columns.length),\n      },\n    ];\n  }\n\n  /** Click-only move actions for a group fragment header. */\n  private groupMoveActions(fragmentFields: string[]): DragAlternativeAction[] {\n    const fragments = this.currentFragments();\n    const at = fragments.findIndex((f) => f.columns[0]?.field === fragmentFields[0]);\n    const fieldsAt = (i: number) => fragments[i].columns.map((c) => c.field);\n    const first = at <= 0;\n    const last = at < 0 || at >= fragments.length - 1;\n\n    return [\n      {\n        label: this.t('columns.moveUp', 'Move up'),\n        disabled: first,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(at - 1), true),\n      },\n      {\n        label: this.t('columns.moveDown', 'Move down'),\n        disabled: last,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(at + 1), false),\n      },\n      {\n        label: this.t('columns.moveToTop', 'Move to top'),\n        disabled: first,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(0), true),\n      },\n      {\n        label: this.t('columns.moveToBottom', 'Move to bottom'),\n        disabled: last,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(fragments.length - 1), false),\n      },\n    ];\n  }\n\n  /**\n   * Set up drag-and-drop listeners for a group header row.\n   * Dragging a group fragment moves only the columns in that fragment as a block.\n   * When a group is fragmented, each fragment header drags independently.\n   */\n  private setupGroupDragListeners(\n    header: HTMLElement,\n    group: ColumnGroupInfo,\n    fragmentFields: string[],\n    columnList: HTMLElement,\n  ): void {\n    header.addEventListener('dragstart', (e: DragEvent) => {\n      this.isDragging = true;\n      this.draggedGroupId = group.id;\n      this.draggedGroupFields = [...fragmentFields];\n      // Use first field as representative for dataTransfer\n      this.draggedField = null;\n      this.draggedIndex = null;\n\n      if (e.dataTransfer) {\n        e.dataTransfer.effectAllowed = 'move';\n        e.dataTransfer.setData('text/plain', `group:${group.id}`);\n      }\n\n      // Mark entire group (header + children) as dragging\n      header.classList.add(GridClasses.DRAGGING);\n      columnList.querySelectorAll(`.tbw-visibility-row--grouped`).forEach((row) => {\n        const field = row.getAttribute('data-field');\n        if (field && this.draggedGroupFields.includes(field)) {\n          row.classList.add(GridClasses.DRAGGING);\n        }\n      });\n    });\n\n    header.addEventListener('dragend', () => {\n      this.isDragging = false;\n      this.draggedGroupId = null;\n      this.draggedGroupFields = [];\n      this.draggedField = null;\n      this.draggedIndex = null;\n      this.dropIndex = null;\n      this.clearDragClasses(columnList);\n    });\n\n    // Group headers are also drop targets for other groups (or other fragments of the same group)\n    header.addEventListener('dragover', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging) return;\n      // Can't drop onto the same fragment (same exact fields)\n      if (\n        this.draggedGroupFields.length === fragmentFields.length &&\n        this.draggedGroupFields.every((f) => fragmentFields.includes(f))\n      )\n        return;\n      // Can't drop individual columns onto group headers\n      if (!this.draggedGroupId) return;\n\n      const rect = header.getBoundingClientRect();\n      const midY = rect.top + rect.height / 2;\n      const before = e.clientY < midY;\n\n      this.clearDragClasses(columnList);\n      header.classList.add('drop-target');\n      header.classList.toggle('drop-before', before);\n      header.classList.toggle('drop-after', !before);\n    });\n\n    header.addEventListener('dragleave', () => {\n      header.classList.remove('drop-target', 'drop-before', 'drop-after');\n    });\n\n    header.addEventListener('drop', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging || !this.draggedGroupId) return;\n      // Can't drop onto the same fragment\n      if (\n        this.draggedGroupFields.length === fragmentFields.length &&\n        this.draggedGroupFields.every((f) => fragmentFields.includes(f))\n      )\n        return;\n\n      const rect = header.getBoundingClientRect();\n      const before = e.clientY < rect.top + rect.height / 2;\n\n      this.executeGroupDrop(this.draggedGroupFields, fragmentFields, before);\n    });\n  }\n\n  /**\n   * Execute a group drop — move the dragged fragment's fields as a block\n   * to the position relative to the target group/column.\n   * Routes through the ReorderPlugin when available for proper animation and\n   * full render cycle, otherwise falls back to direct grid.setColumnOrder().\n   */\n  private executeGroupDrop(draggedFields: string[], targetFields: string[], before: boolean): void {\n    const allColumns = this.grid.getAllColumns();\n    const currentOrder = allColumns.map((c) => c.field);\n\n    // Remove dragged fields from current order\n    const remaining = currentOrder.filter((f) => !draggedFields.includes(f));\n\n    // Find insertion point relative to target\n    // Use the first field of target group if inserting before, last if after\n    const anchorField = before ? targetFields[0] : targetFields[targetFields.length - 1];\n    const insertAt = remaining.indexOf(anchorField);\n    if (insertAt === -1) return;\n\n    // Insert the dragged group block at the correct position\n    const insertIndex = before ? insertAt : insertAt + 1;\n\n    // Preserve the dragged fields' original relative order\n    const draggedInOrder = currentOrder.filter((f) => draggedFields.includes(f));\n    remaining.splice(insertIndex, 0, ...draggedInOrder);\n\n    // Route through ReorderPlugin.setColumnOrder when available and attached —\n    // this calls updateColumnOrder which handles animation and forceLayout for\n    // proper body cell rebuilds. Fall back to direct grid.setColumnOrder otherwise.\n    const reorderPlugin = this.grid.getPluginByName?.('reorder') as\n      { setColumnOrder?: (o: string[]) => void; gridElement?: unknown } | undefined;\n    if (reorderPlugin?.setColumnOrder && reorderPlugin.gridElement) {\n      reorderPlugin.setColumnOrder(remaining);\n    } else {\n      this.grid.setColumnOrder(remaining);\n    }\n\n    // Panel rebuild is handled by the column-move listener when ReorderPlugin\n    // emits the event. For the direct fallback path, trigger manually.\n    requestAnimationFrame(() => {\n      if (this.columnListElement) {\n        this.rebuildToggles(this.columnListElement);\n      }\n    });\n  }\n\n  /**\n   * Set up drag-and-drop event listeners for a row.\n   * On drop, emits a 'column-reorder-request' event for other plugins to handle.\n   */\n  private setupDragListeners(row: HTMLElement, field: string, index: number, columnList: HTMLElement): void {\n    row.addEventListener('dragstart', (e: DragEvent) => {\n      this.isDragging = true;\n      this.draggedField = field;\n      this.draggedIndex = index;\n      // Clear any stale group drag state\n      this.draggedGroupId = null;\n      this.draggedGroupFields = [];\n\n      if (e.dataTransfer) {\n        e.dataTransfer.effectAllowed = 'move';\n        e.dataTransfer.setData('text/plain', field);\n      }\n\n      row.classList.add(GridClasses.DRAGGING);\n    });\n\n    row.addEventListener('dragend', () => {\n      this.isDragging = false;\n      this.draggedField = null;\n      this.draggedIndex = null;\n      this.dropIndex = null;\n      this.clearDragClasses(columnList);\n    });\n\n    row.addEventListener('dragover', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging) return;\n\n      // If dragging a group, only allow drop on ungrouped rows\n      if (this.draggedGroupId) {\n        if (row.classList.contains('tbw-visibility-row--grouped')) return;\n      } else if (this.draggedField === field) {\n        return;\n      }\n\n      const rect = row.getBoundingClientRect();\n      const midY = rect.top + rect.height / 2;\n\n      this.dropIndex = e.clientY < midY ? index : index + 1;\n\n      // Clear other highlights\n      this.clearDragClasses(columnList);\n      // Re-mark dragged elements\n      if (this.draggedGroupId) {\n        columnList\n          .querySelector(`.tbw-visibility-group-header[data-group-id=\"${this.draggedGroupId}\"]`)\n          ?.classList.add(GridClasses.DRAGGING);\n        columnList.querySelectorAll('.tbw-visibility-row--grouped').forEach((r) => {\n          const f = r.getAttribute('data-field');\n          if (f && this.draggedGroupFields.includes(f)) r.classList.add(GridClasses.DRAGGING);\n        });\n      } else if (this.draggedField) {\n        columnList\n          .querySelector(`.tbw-visibility-row[data-field=\"${this.draggedField}\"]`)\n          ?.classList.add(GridClasses.DRAGGING);\n      }\n\n      row.classList.add('drop-target');\n      row.classList.toggle('drop-before', e.clientY < midY);\n      row.classList.toggle('drop-after', e.clientY >= midY);\n    });\n\n    row.addEventListener('dragleave', () => {\n      row.classList.remove('drop-target', 'drop-before', 'drop-after');\n    });\n\n    row.addEventListener('drop', (e: DragEvent) => {\n      e.preventDefault();\n\n      if (!this.isDragging) return;\n\n      // Group drop onto an ungrouped row\n      if (this.draggedGroupId && this.draggedGroupFields.length > 0) {\n        if (row.classList.contains('tbw-visibility-row--grouped')) return;\n        const rect = row.getBoundingClientRect();\n        const before = e.clientY < rect.top + rect.height / 2;\n        this.executeGroupDrop(this.draggedGroupFields, [field], before);\n        return;\n      }\n\n      // Individual column drop\n      const draggedField = this.draggedField;\n      const draggedIndex = this.draggedIndex;\n      const dropIndex = this.dropIndex;\n\n      if (draggedField === null || draggedIndex === null || dropIndex === null) {\n        return;\n      }\n\n      // Calculate the effective target index (in the filtered non-utility list)\n      const effectiveToIndex = dropIndex > draggedIndex ? dropIndex - 1 : dropIndex;\n\n      if (effectiveToIndex !== draggedIndex) {\n        // Convert from non-utility index to full column order index\n        // by counting how many utility columns come before the target position\n        const allColumns = this.grid.getAllColumns();\n        const nonUtilityColumns = allColumns.filter((c) => !c.utility);\n\n        // Find the target field at effectiveToIndex in non-utility list\n        const targetField = nonUtilityColumns[effectiveToIndex]?.field;\n        // Find its actual index in the full column order\n        const fullOrderToIndex = targetField ? allColumns.findIndex((c) => c.field === targetField) : allColumns.length;\n\n        // Emit a request event - other plugins (like ReorderPlugin) can listen and handle\n        const detail: ColumnReorderRequestDetail = {\n          field: draggedField,\n          fromIndex: draggedIndex, // Not used by ReorderPlugin, just for info\n          toIndex: fullOrderToIndex,\n        };\n        this.emit<ColumnReorderRequestDetail>('column-reorder-request', detail);\n        // Panel rebuild is handled by the column-move listener in attach()\n      }\n    });\n  }\n  // #endregion\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["styles","BaseGridPlugin","GridClasses","supportsPopover","HTMLElement","prototype","showPopover","createDragAlternativeMenu","id","className","root","opened","disposed","abort","AbortController","close","hidePopover","hidden","document","addEventListener","e","composedPath","includes","capture","signal","key","element","open","anchor","label","actions","length","el","createElement","setAttribute","next","relatedTarget","Node","contains","build","host","closest","body","parentNode","appendChild","replaceChildren","action","btn","type","textContent","disabled","run","a","getBoundingClientRect","box","left","Math","max","min","window","innerWidth","width","below","bottom","top","height","innerHeight","style","round","place","querySelector","focus","dispose","remove","VisibilityPlugin","static","name","required","reason","queries","description","styles","defaultConfig","columnListElement","isDragging","draggedField","draggedIndex","dropIndex","draggedGroupId","draggedGroupFields","moveMenu","clearDragClasses","container","querySelectorAll","forEach","r","classList","attach","grid","super","this","gridElement","requestAnimationFrame","rebuildToggles","disconnectSignal","detach","processColumns","columns","col","__element","hasAttribute","getAttribute","lockVisible","handleQuery","query","params","context","isHeader","column","field","meta","lockVisibility","t","icon","order","hideColumn","getToolPanel","PANEL_ID","title","tooltip","render","renderPanelContent","shell","getPluginByName","show","openToolPanel","hide","closeToolPanel","toggle","isToolPanelOpen","toggleToolPanelSection","isColumnVisible","setColumnVisible","visible","getVisibleColumns","getAllColumns","filter","c","map","getHiddenColumns","showAll","showAllColumns","toggleColumn","toggleColumnVisibility","showColumn","isPanelVisible","expandedToolPanelSections","wrapper","columnList","showAllBtn","hasReorderPlugin","plugin","moveColumn","canMoveColumn","config","find","responses","reorderEnabled","innerHTML","allColumns","utility","fragments","currentFragments","every","f","group","renderFlatColumnList","fragment","renderGroupSection","fullIndex","indexOf","createColumnRow","groups","flat","g","fields","fieldToGroup","Map","set","computeFragments","currentGroup","currentCols","get","push","fragmentFields","header","draggable","add","setupGroupDragListeners","headerLabel","groupCheckbox","visibleCount","allLocked","checked","indeterminate","newVisible","setTimeout","headerText","handle","setIcon","wireMoveHandle","groupMoveActions","insertBefore","allColumnsFullList","findIndex","row","index","String","setupDragListeners","labelWrapper","checkbox","text","columnMoveActions","tabIndex","requestColumnMove","fromIndex","effectiveToIndex","targetField","toIndex","emit","from","landable","i","at","fieldsAt","first","last","executeGroupDrop","dataTransfer","effectAllowed","setData","preventDefault","rect","midY","before","clientY","draggedFields","targetFields","currentOrder","remaining","anchorField","insertAt","insertIndex","draggedInOrder","splice","reorderPlugin","setColumnOrder","detail"],"sources":["../../../../../../libs/grid/src/lib/core/constants.ts","../../../../../../libs/grid/src/lib/plugins/shared/drag-alternative-menu.ts","../../../../../../libs/grid/src/lib/plugins/visibility/visibility.css?inline","../../../../../../libs/grid/src/lib/plugins/visibility/visibility-plugin.ts"],"sourcesContent":["/**\n * Grid DOM Constants\n *\n * Centralized constants for CSS classes, data attributes, and selectors\n * used throughout the grid. Use these instead of magic strings.\n *\n * Note: Some constants here are used by plugins but defined in core because:\n * 1. The core CSS needs to style these elements (e.g., sticky positioning)\n * 2. Multiple plugins may share the same class names\n *\n * Plugins can define their own additional constants and export them.\n * See each plugin's index.ts for plugin-specific exports.\n */\n\n/**\n * CSS selector for focusable editor elements within a cell.\n * Used by EditingPlugin, UndoRedoPlugin, and keyboard navigation. Defined here\n * (a leaf module) rather than in `rows.ts` so `keyboard.ts` can consume it\n * without creating a rows ↔ keyboard import cycle.\n */\nexport const FOCUSABLE_EDITOR_SELECTOR =\n  'input,select,textarea,[contenteditable=\"true\"],[contenteditable=\"\"],[tabindex]:not([tabindex=\"-1\"])';\n\n// #region CSS Classes\n\n/**\n * CSS class names used in the grid's DOM.\n * Use these when adding/removing classes or querying elements.\n *\n * Classes are organized by:\n * - Core: Used by the grid core for structure and basic functionality\n * - Shared: Used by multiple features/plugins, styled by core CSS\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridClasses = {\n  // ─── Core Structure ───────────────────────────────────────────────\n  ROOT: 'tbw-grid-root',\n  HEADER: 'header',\n  HEADER_ROW: 'header-row',\n  HEADER_CELL: 'header-cell',\n\n  // Body structure\n  ROWS_VIEWPORT: 'rows-viewport',\n  ROWS_SPACER: 'rows-spacer',\n  ROWS_CONTAINER: 'rows',\n\n  // Row elements\n  DATA_ROW: 'data-grid-row',\n  GROUP_ROW: 'group-row',\n\n  // Cell elements\n  DATA_CELL: 'cell',\n\n  // ─── Core States ──────────────────────────────────────────────────\n  SELECTED: 'selected',\n  FOCUSED: 'focused',\n  EDITING: 'editing',\n  EXPANDED: 'expanded',\n  COLLAPSED: 'collapsed',\n  DRAGGING: 'dragging',\n  RESIZING: 'resizing',\n\n  // Sorting (core feature)\n  SORTABLE: 'sortable',\n  SORTED_ASC: 'sorted-asc',\n  SORTED_DESC: 'sorted-desc',\n\n  // Visibility\n  HIDDEN: 'hidden',\n\n  // ─── Shared Classes (used by plugins, styled by core CSS) ────────\n  // These are defined here because core CSS provides the base styling.\n  // Plugins apply these classes; core CSS defines how they look.\n\n  // Sticky positioning (PinnedColumnsPlugin applies, core CSS styles)\n  STICKY_LEFT: 'sticky-left',\n  STICKY_RIGHT: 'sticky-right',\n\n  // Pinned rows (PinnedRowsPlugin applies, core CSS styles)\n  PINNED_TOP: 'pinned-top',\n  PINNED_BOTTOM: 'pinned-bottom',\n\n  // Tree structure (TreePlugin applies, core CSS styles)\n  TREE_TOGGLE: 'tree-toggle',\n  TREE_INDENT: 'tree-indent',\n\n  // Grouping (GroupingRowsPlugin applies, core CSS styles)\n  GROUP_TOGGLE: 'group-toggle',\n  GROUP_LABEL: 'group-label',\n  GROUP_COUNT: 'group-count',\n\n  // Selection (SelectionPlugin applies, core CSS styles)\n  RANGE_SELECTION: 'range-selection',\n  SELECTION_OVERLAY: 'selection-overlay',\n} as const;\n\n// #endregion\n\n// #region Data Attributes\n\n/**\n * Data attribute names used on grid elements.\n * Use these when getting/setting data attributes.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridDataAttrs = {\n  // ─── Core Attributes ──────────────────────────────────────────────\n  FIELD: 'data-field',\n\n  /**\n   * Marks a `title` the grid itself put on a cell to reveal ellipsised text\n   * (WCAG SC 1.4.12). Anything that sets its own `title` on a cell must clear\n   * this, or the grid will later mistake that title for its own and replace it.\n   *\n   * @since 3.6.0\n   */\n  TRUNCATED: 'data-tbw-truncated',\n\n  // ─── Shared Attributes (used by plugins) ──────────────────────────\n  GROUP_KEY: 'data-group-key', // GroupingRowsPlugin\n} as const;\n\n// #endregion\n\n// #region Selectors\n\n/**\n * Common CSS selectors for querying grid elements.\n * Built from the class constants for consistency.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridSelectors = {\n  ROOT: `.${GridClasses.ROOT}`,\n  HEADER: `.${GridClasses.HEADER}`,\n  HEADER_ROW: `.${GridClasses.HEADER_ROW}`,\n  HEADER_CELL: `.${GridClasses.HEADER_CELL}`,\n  ROWS_VIEWPORT: `.${GridClasses.ROWS_VIEWPORT}`,\n  ROWS_CONTAINER: `.${GridClasses.ROWS_CONTAINER}`,\n  DATA_ROW: `.${GridClasses.DATA_ROW}`,\n  DATA_CELL: `.${GridClasses.DATA_CELL}`,\n  GROUP_ROW: `.${GridClasses.GROUP_ROW}`,\n\n  // By data attribute\n  CELL_BY_FIELD: (field: string) => `.${GridClasses.DATA_CELL}[${GridDataAttrs.FIELD}=\"${field}\"]`,\n\n  // State selectors\n  SELECTED_ROWS: `.${GridClasses.DATA_ROW}.${GridClasses.SELECTED}`,\n  EDITING_CELL: `.${GridClasses.DATA_CELL}.${GridClasses.EDITING}`,\n} as const;\n\n// #endregion\n\n// #region CSS Custom Properties\n\n/**\n * CSS custom property names for theming.\n * Use these when programmatically setting styles.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport const GridCSSVars = {\n  // Colors\n  COLOR_BG: '--tbw-color-bg',\n  COLOR_FG: '--tbw-color-fg',\n  COLOR_FG_MUTED: '--tbw-color-fg-muted',\n  COLOR_BORDER: '--tbw-color-border',\n  COLOR_ACCENT: '--tbw-color-accent',\n  COLOR_HEADER_BG: '--tbw-color-header-bg',\n  COLOR_HEADER_FG: '--tbw-color-header-fg',\n  COLOR_SELECTION: '--tbw-color-selection',\n  COLOR_ROW_HOVER: '--tbw-color-row-hover',\n  COLOR_ROW_ALT: '--tbw-color-row-alt',\n\n  // Sizing\n  ROW_HEIGHT: '--tbw-row-height',\n  HEADER_HEIGHT: '--tbw-header-height',\n  CELL_PADDING: '--tbw-cell-padding',\n\n  // Typography\n  FONT_FAMILY: '--tbw-font-family',\n  FONT_SIZE: '--tbw-font-size',\n\n  // Borders\n  BORDER_RADIUS: '--tbw-border-radius',\n  FOCUS_OUTLINE: '--tbw-focus-outline',\n} as const;\n\n// #endregion\n\n// Type helpers\n\n/**\n * Union of all CSS class names used in the grid's DOM.\n * Use `GridClasses` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridClassName = (typeof GridClasses)[keyof typeof GridClasses];\n\n/**\n * Union of all `data-*` attribute names used on grid elements.\n * Use `GridDataAttrs` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridDataAttr = (typeof GridDataAttrs)[keyof typeof GridDataAttrs];\n\n/**\n * Union of all CSS custom property names (`--tbw-*`) available for theming.\n * Use `GridCSSVars` to access individual values by key.\n *\n * @category Plugin Development\n * @since 0.1.1\n */\nexport type GridCSSVar = (typeof GridCSSVars)[keyof typeof GridCSSVars];\n","/**\n * Generic click-only action menu — the shared building block for WCAG 2.2\n * SC 2.5.7 \"Dragging Movements\" alternatives in plugins.\n *\n * Every drag affordance in the grid needs a path that works with plain clicks\n * or taps. A keyboard equivalent is **not** enough: SC 2.5.7 is specifically\n * about pointer input, and the W3C Understanding text calls out \"a pop-up menu\n * after tap\" as a conforming alternative. This module is that pop-up.\n *\n * Lives under `plugins/shared/` on purpose: each plugin bundle is built\n * self-contained, so this code is duplicated into the plugins that use it and\n * never lands in the core `index.js` budget.\n *\n * @since 3.6.0\n * @internal\n */\n\n/** Gap between the anchor element and the menu, in px. */\nconst ANCHOR_GAP_PX = 6;\n\n/** Runtime check — happy-dom and older browsers may lack the Popover API. */\nfunction supportsPopover(): boolean {\n  return typeof HTMLElement.prototype?.showPopover === 'function';\n}\n\nlet hoverlessQuery: MediaQueryList | null | undefined;\n\n/** Whether the primary pointer cannot hover (touch, most switch devices). */\nfunction isHoverless(): boolean {\n  if (hoverlessQuery === undefined) hoverlessQuery = globalThis.matchMedia?.('(hover: none)') ?? null;\n  return hoverlessQuery?.matches ?? false;\n}\n\n/**\n * Whether a plugin should also expose its drag alternative as a dedicated\n * inline control, on top of the menu that is always available.\n *\n * Hover-less pointers get one unconditionally — a control revealed on hover is\n * unreachable when nothing can hover, and long-press is the wrong fallback for\n * the tremor and low-dexterity users SC 2.5.7 exists for.\n *\n * Driven by `a11y.dragAlternatives` on the grid config.\n */\nexport function prefersInlineDragAlternative(grid: {\n  effectiveConfig?: { a11y?: { dragAlternatives?: 'menu' | 'inline' } };\n}): boolean {\n  return grid.effectiveConfig?.a11y?.dragAlternatives === 'inline' || isHoverless();\n}\n\n/** One clickable entry in the menu. */\nexport interface DragAlternativeAction {\n  /** Visible text, also the accessible name. */\n  label: string;\n  /** Render the entry but refuse the click (e.g. \"Move up\" on the first row). */\n  disabled?: boolean;\n  /** Invoked on click; the menu closes first so focus handling is predictable. */\n  run(): void;\n}\n\nexport interface DragAlternativeMenu {\n  /**\n   * Show `actions` anchored to `anchor`, with `label` as the group's accessible\n   * name. Mounted inside the anchor's grid host so it inherits theme tokens.\n   */\n  open(anchor: HTMLElement, label: string, actions: readonly DragAlternativeAction[]): void;\n  /** Hide the menu. Safe to call when already closed. */\n  close(): void;\n  /** Remove the element and every document-level listener. */\n  dispose(): void;\n  /** The menu element, or `null` before the first {@link DragAlternativeMenu.open}. */\n  readonly element: HTMLElement | null;\n}\n\n/**\n * Create a menu instance.\n *\n * @param id - DOM id for the menu element, unique per owning plugin.\n * @param className - Root class name, so each plugin can style its own menu.\n */\nexport function createDragAlternativeMenu(id: string, className: string): DragAlternativeMenu {\n  let root: HTMLDivElement | null = null;\n  let opened = false;\n  let disposed = false;\n  const abort = new AbortController();\n\n  function close(): void {\n    if (!opened || !root) return;\n    opened = false;\n    if (supportsPopover()) root.hidePopover();\n    root.hidden = true;\n  }\n\n  function build(): HTMLDivElement {\n    const el = document.createElement('div');\n    el.id = id;\n    el.className = className;\n    el.setAttribute('popover', 'manual');\n    el.setAttribute('role', 'group');\n    // Without the Popover API there is no UA `display: none`, so hide it here.\n    el.hidden = true;\n    // Tabbing past either end dismisses instead of stranding the user — the\n    // menu has no visible trigger to tab back to. A null `relatedTarget` (click\n    // focus in Firefox/Safari, focus leaving the document) is ignored.\n    el.addEventListener(\n      'focusout',\n      (e) => {\n        const next = (e as FocusEvent).relatedTarget;\n        if (next instanceof Node && !el.contains(next)) close();\n      },\n      { signal: abort.signal },\n    );\n    return el;\n  }\n\n  /**\n   * Position against the anchor in viewport coordinates. The menu lives in the\n   * top layer, so its containing block is the viewport regardless of where the\n   * anchor sits in the DOM.\n   */\n  function place(anchor: HTMLElement): void {\n    if (!root) return;\n    const a = anchor.getBoundingClientRect();\n    const box = root.getBoundingClientRect();\n    const left = Math.max(4, Math.min(a.left, window.innerWidth - box.width - 4));\n    const below = a.bottom + ANCHOR_GAP_PX;\n    const top = below + box.height <= window.innerHeight ? below : Math.max(4, a.top - ANCHOR_GAP_PX - box.height);\n    root.style.left = `${Math.round(left)}px`;\n    root.style.top = `${Math.round(top)}px`;\n  }\n\n  // Any pointer press outside the menu dismisses it. Capture phase so the press\n  // that lands on a grid cell still reaches its own handler afterwards.\n  document.addEventListener(\n    'pointerdown',\n    (e) => {\n      if (opened && root && !e.composedPath().includes(root)) close();\n    },\n    { capture: true, signal: abort.signal },\n  );\n  document.addEventListener(\n    'keydown',\n    (e) => {\n      if ((e as KeyboardEvent).key === 'Escape') close();\n    },\n    { capture: true, signal: abort.signal },\n  );\n\n  return {\n    get element() {\n      return root;\n    },\n    open(anchor, label, actions) {\n      if (disposed || actions.length === 0) return;\n      if (!root) root = build();\n      // Mount inside the grid host (light DOM) so theme custom properties and\n      // `color-scheme` cascade in; the top layer keeps it out of overflow.\n      const host = anchor.closest<HTMLElement>('tbw-grid, [data-tbw-grid]') ?? document.body;\n      if (root.parentNode !== host) host.appendChild(root);\n      root.setAttribute('aria-label', label);\n      root.replaceChildren();\n      for (const action of actions) {\n        const btn = document.createElement('button');\n        btn.type = 'button';\n        btn.className = `${className}-item`;\n        btn.textContent = action.label;\n        btn.disabled = action.disabled === true;\n        btn.addEventListener('click', () => {\n          close();\n          action.run();\n        });\n        root.appendChild(btn);\n      }\n      root.hidden = false;\n      if (!opened && supportsPopover()) root.showPopover();\n      opened = true;\n      place(anchor);\n      root.querySelector<HTMLButtonElement>('button:not([disabled])')?.focus();\n    },\n    close,\n    dispose() {\n      disposed = true;\n      close();\n      abort.abort();\n      root?.remove();\n      root = null;\n    },\n  };\n}\n","@layer tbw-plugins {\n  .tbw-visibility-content {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n\n  .tbw-visibility-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem));\n  }\n\n  .tbw-visibility-row {\n    display: flex;\n    align-items: center;\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n    padding: var(--tbw-menu-item-padding, 0.375rem 0.25rem);\n    cursor: pointer;\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    position: relative;\n  }\n  .tbw-visibility-row:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n  .tbw-visibility-row input[type='checkbox'] {\n    cursor: pointer;\n  }\n  .tbw-visibility-row.locked span {\n    color: var(--tbw-color-fg-muted);\n  }\n\n  /* Drag handle */\n  .tbw-visibility-handle {\n    cursor: grab;\n    color: var(--tbw-color-fg-muted);\n    font-size: var(--tbw-font-size-2xs, 0.625rem);\n    letter-spacing: -2px;\n    user-select: none;\n    flex-shrink: 0;\n  }\n  .tbw-visibility-row.reorderable:hover .tbw-visibility-handle {\n    color: var(--tbw-color-fg);\n  }\n  /* Label wrapper for checkbox and text */\n  .tbw-visibility-label {\n    display: flex;\n    align-items: center;\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n    flex: 1;\n    cursor: pointer;\n  }\n\n  /* Drag states */\n  .tbw-visibility-row.dragging {\n    opacity: 0.5;\n    cursor: grabbing;\n  }\n  .tbw-visibility-row.drop-before::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n  .tbw-visibility-row.drop-after::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n\n  .tbw-visibility-show-all {\n    margin: var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem));\n    padding: var(--tbw-button-padding, 0.5rem 0.75rem);\n    border: 1px solid var(--tbw-visibility-border, var(--tbw-color-border));\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    background: var(--tbw-visibility-btn-bg, var(--tbw-color-header-bg));\n    color: var(--tbw-color-fg);\n    cursor: pointer;\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n  }\n  .tbw-visibility-show-all:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n\n  /* Group header */\n  .tbw-visibility-group-header {\n    display: flex;\n    align-items: center;\n    padding: var(--tbw-menu-item-padding, 0.375rem 0.25rem);\n    font-size: var(--tbw-font-size-sm, 0.8125rem);\n    font-weight: 600;\n    color: var(--tbw-color-fg);\n    border-bottom: 1px solid var(--tbw-color-border);\n    margin-top: var(--tbw-spacing-sm, 0.25rem);\n    position: relative;\n  }\n  .tbw-visibility-group-header:first-child {\n    margin-top: 0;\n  }\n  .tbw-visibility-group-header .tbw-visibility-label {\n    gap: var(--tbw-panel-gap, var(--tbw-spacing-md, 0.5rem));\n  }\n\n  /* Reorderable group header */\n  .tbw-visibility-group-header.reorderable {\n    cursor: grab;\n  }\n  .tbw-visibility-group-header.reorderable:hover {\n    background: var(--tbw-visibility-hover, var(--tbw-color-row-hover));\n  }\n  .tbw-visibility-group-header .tbw-visibility-handle {\n    cursor: grab;\n    color: var(--tbw-color-fg-muted);\n    font-size: var(--tbw-font-size-2xs, 0.625rem);\n    letter-spacing: -2px;\n    user-select: none;\n    flex-shrink: 0;\n  }\n  .tbw-visibility-group-header.reorderable:hover .tbw-visibility-handle {\n    color: var(--tbw-color-fg);\n  }\n\n  /* Coarse pointer (touch): handles always in active colour and large enough to tap */\n  @media (hover: none) {\n    .tbw-visibility-row.reorderable .tbw-visibility-handle,\n    .tbw-visibility-group-header.reorderable .tbw-visibility-handle {\n      color: var(--tbw-color-fg);\n    }\n  }\n\n  @media (pointer: coarse) {\n    .tbw-visibility-handle {\n      min-width: var(--tbw-touch-target-min, 24px);\n      min-height: var(--tbw-touch-target-min, 24px);\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  /* Group drag states */\n  .tbw-visibility-group-header.dragging {\n    opacity: 0.5;\n    cursor: grabbing;\n  }\n  .tbw-visibility-group-header.drop-before::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n  .tbw-visibility-group-header.drop-after::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    height: 2px;\n    background: var(--tbw-visibility-indicator, var(--tbw-color-accent));\n  }\n\n  /* Indented column rows within a group */\n  .tbw-visibility-row--grouped {\n    padding-left: calc(var(--tbw-panel-padding, var(--tbw-spacing-md, 0.5rem)) + 0.75rem);\n  }\n\n  /* ===== Handle move menu (WCAG 2.2 SC 2.5.7) ===== */\n\n  .tbw-visibility-move-menu {\n    position: fixed;\n    margin: 0;\n    padding: 4px;\n    display: flex;\n    flex-direction: column;\n    min-width: 10rem;\n    background: var(--tbw-color-panel-bg, light-dark(#fff, #1e1e1e));\n    color: var(--tbw-color-panel-fg, light-dark(#1a1a1a, #eaeaea));\n    border: 1px solid var(--tbw-color-border, light-dark(#d0d0d0, #3a3a3a));\n    border-radius: var(--tbw-border-radius, 0.25rem);\n    box-shadow: var(--tbw-shadow-panel, 0 4px 12px light-dark(rgb(0 0 0 / 20%), rgb(0 0 0 / 50%)));\n    font: inherit;\n    z-index: 10001;\n\n    &[hidden] {\n      display: none;\n    }\n  }\n\n  .tbw-visibility-move-menu-item {\n    min-height: var(--tbw-touch-target-min, 24px);\n    padding: 4px 8px;\n    text-align: start;\n    background: none;\n    color: inherit;\n    font: inherit;\n    border: 0;\n    /* Themes set radii for much larger surfaces (Material uses 12px), which\n       turns a 24px row into a lozenge. */\n    border-radius: min(var(--tbw-border-radius, 0.25rem), 6px);\n    cursor: pointer;\n\n    &:hover:not(:disabled) {\n      background: var(--tbw-color-row-hover, light-dark(#00000010, #ffffff14));\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: default;\n    }\n  }\n} /* End @layer tbw-plugins */\n","/**\n * Column Visibility Plugin (Class-based)\n *\n * Provides a UI for column visibility control via the shell's tool panel system.\n * Column visibility is a core grid feature - this plugin provides:\n * - A tool panel for column visibility management (registered with the shell)\n * - Backward-compatible API methods that delegate to grid.setColumnVisible(), etc.\n *\n * The grid emits 'column-visibility' events when columns are shown/hidden,\n * allowing consumers to save user preferences.\n *\n * When a reorder plugin is present, column rows become draggable for reordering.\n * Drag-drop emits 'column-reorder-request' events that the ReorderPlugin can listen for.\n */\n\nimport { GridClasses } from '../../core/constants';\nimport {\n  BaseGridPlugin,\n  type PluginDependency,\n  type PluginManifest,\n  type PluginQuery,\n} from '../../core/plugin/base-plugin';\nimport type { ColumnConfig, ColumnInternal } from '../../core/types';\nimport type { ContextMenuParams, HeaderContextMenuItem } from '../context-menu/types';\nimport {\n  createDragAlternativeMenu,\n  type DragAlternativeAction,\n  type DragAlternativeMenu,\n} from '../shared/drag-alternative-menu';\nimport type { ToolPanelDefinition } from '../shell/types';\nimport type { ColumnGroupInfo, ColumnReorderRequestDetail, VisibilityConfig } from './types';\nimport styles from './visibility.css?inline';\n\n/** Column metadata shape returned by `grid.getAllColumns()`. */\ntype ColumnEntry = {\n  field: string;\n  header: string;\n  visible: boolean;\n  lockVisible?: boolean;\n  utility?: boolean;\n};\n\n/** A contiguous run of same-group columns, or a single ungrouped column. */\ntype PanelFragment = { group: ColumnGroupInfo | null; columns: ColumnEntry[] };\n\n/**\n * Column Visibility Plugin for tbw-grid\n *\n * Gives users control over which columns are displayed. Hide less important columns\n * by default, let users toggle them via a column chooser UI, or programmatically\n * show/hide columns based on user preferences or screen size.\n *\n * > **Optional Enhancement:** When ReorderPlugin is also loaded, columns in the\n * > visibility panel become draggable for reordering.\n *\n * ## Installation\n *\n * ```ts\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n * ```\n *\n * ## Column Configuration\n *\n * | Property | Type | Default | Description |\n * |----------|------|---------|-------------|\n * | `visible` | `boolean` | `true` | Initial visibility state |\n * | `lockVisible` | `boolean` | `false` | Prevent user from toggling (legacy `meta.lockVisibility` is honored) |\n *\n * ## CSS Custom Properties\n *\n * | Property | Default | Description |\n * |----------|---------|-------------|\n * | `--tbw-visibility-hover` | `var(--tbw-color-row-hover)` | Row hover background |\n * | `--tbw-panel-padding` | `0.75em` | Panel content padding |\n * | `--tbw-panel-gap` | `0.5em` | Gap between items |\n *\n * @example Columns Hidden by Default\n * ```ts\n * import { queryGrid } from '@toolbox-web/grid';\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n *\n * const grid = queryGrid('tbw-grid');\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'id', header: 'ID' },\n *     { field: 'name', header: 'Name' },\n *     { field: 'phone', header: 'Phone', visible: false }, // Hidden by default\n *     { field: 'address', header: 'Address', visible: false },\n *   ],\n *   plugins: [new VisibilityPlugin()],\n * };\n *\n * // Toggle programmatically\n * const plugin = grid.getPluginByName('visibility');\n * plugin.showColumn('phone');\n * ```\n *\n * @example With Drag-to-Reorder\n * ```ts\n * import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';\n * import { ReorderPlugin } from '@toolbox-web/grid/plugins/reorder-columns';\n *\n * grid.gridConfig = {\n *   plugins: [\n *     new ReorderPlugin(),      // Enables drag-drop in visibility panel\n *     new VisibilityPlugin(),\n *   ],\n * };\n * ```\n *\n * @see {@link VisibilityConfig} for configuration options\n * @see ReorderPlugin for drag-to-reorder integration\n *\n * @internal Extends BaseGridPlugin\n * @since 0.1.1\n */\nexport class VisibilityPlugin extends BaseGridPlugin<VisibilityConfig> {\n  /**\n   * Plugin dependencies.\n   *\n   * - `shell` (required): VisibilityPlugin renders its column list inside a\n   *   shell tool panel. Without the shell plugin there is no host for the\n   *   panel. The shell auto-registers today, so this only bites once the\n   *   auto-register is removed at v3 (#370).\n   * - `reorder` (optional): when present, columns in the visibility panel\n   *   become draggable.\n   * @internal\n   */\n  static override readonly dependencies: PluginDependency[] = [\n    { name: 'shell', required: true, reason: 'VisibilityPlugin renders its column list in a shell tool panel' },\n    { name: 'reorder', required: false, reason: 'Enables drag-to-reorder columns in visibility panel' },\n  ];\n\n  /**\n   * Plugin manifest - declares handled queries.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest = {\n    queries: [\n      {\n        type: 'getContextMenuItems',\n        description: 'Contributes \"Hide column\" item to the header context menu',\n      },\n    ],\n  };\n\n  /** @internal */\n  readonly name = 'visibility';\n\n  /** Tool panel ID for shell integration */\n  static readonly PANEL_ID = 'columns';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<VisibilityConfig> {\n    return {};\n  }\n\n  // #region Internal State\n  private columnListElement: HTMLElement | null = null;\n\n  // Drag state for reorder integration\n  private isDragging = false;\n  private draggedField: string | null = null;\n  private draggedIndex: number | null = null;\n  private dropIndex: number | null = null;\n  /** When dragging a group, holds the group ID; null for individual column drags. */\n  private draggedGroupId: string | null = null;\n  /** Fields belonging to the group currently being dragged. */\n  private draggedGroupFields: string[] = [];\n  /** Click-only move menu (SC 2.5.7). One instance shared by every drag handle. */\n  private moveMenu: DragAlternativeMenu | null = null;\n\n  /** Clear drag-related classes from all rows and group headers in a list. */\n  private clearDragClasses(container: HTMLElement): void {\n    container.querySelectorAll('.tbw-visibility-row, .tbw-visibility-group-header').forEach((r) => {\n      r.classList.remove(GridClasses.DRAGGING, 'drop-target', 'drop-before', 'drop-after');\n    });\n  }\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: import('../../core/plugin/base-plugin').GridElement): void {\n    super.attach(grid);\n\n    // Listen for column-move events (emitted by ReorderPlugin after any reorder,\n    // including header drag-drop and visibility panel drag-drop) to keep the\n    // panel list in sync with the grid's column order.\n    this.gridElement.addEventListener(\n      'column-move',\n      () => {\n        if (this.columnListElement) {\n          // column-move fires BEFORE setColumnOrder runs. Defer the rebuild\n          // to allow the full reorder cycle (setColumnOrder + renderHeader +\n          // refreshVirtualWindow) to complete before reading the new order.\n          // Use RAF to run after the current synchronous work and any\n          // animation frames queued by the animation system.\n          requestAnimationFrame(() => {\n            if (this.columnListElement) {\n              this.rebuildToggles(this.columnListElement);\n            }\n          });\n        }\n      },\n      { signal: this.disconnectSignal },\n    );\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.columnListElement = null;\n    this.isDragging = false;\n    this.draggedField = null;\n    this.draggedIndex = null;\n    this.dropIndex = null;\n    this.moveMenu?.dispose();\n    this.moveMenu = null;\n  }\n  // #endregion\n\n  // #region Render Hooks\n\n  /**\n   * Read declarative visibility attributes from the originating\n   * `<tbw-grid-column>` element (issue #272). `hidden` and `lock-visible`\n   * only seed the initial state — the `=== undefined` guards ensure a runtime\n   * toggle (`setColumnVisible`, which writes `col.hidden = false`) or an\n   * explicit config value always wins over the attribute.\n   * @internal\n   */\n  override processColumns(columns: ColumnConfig[]): ColumnConfig[] {\n    for (const col of columns) {\n      const el = (col as ColumnInternal).__element;\n      if (!el) continue;\n      if (col.hidden === undefined && el.hasAttribute('hidden') && el.getAttribute('hidden') !== 'false') {\n        col.hidden = true;\n      }\n      if (\n        col.lockVisible === undefined &&\n        el.hasAttribute('lock-visible') &&\n        el.getAttribute('lock-visible') !== 'false'\n      ) {\n        col.lockVisible = true;\n      }\n    }\n    return columns;\n  }\n  // #endregion\n\n  // #region Query Handlers\n\n  /**\n   * Handle inter-plugin queries.\n   * Contributes a \"Hide column\" item to the header context menu.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getContextMenuItems') {\n      const params = query.context as ContextMenuParams;\n      if (!params.isHeader) return undefined;\n\n      const column = params.column as ColumnConfig;\n      if (!column?.field) return undefined;\n\n      // Don't offer \"Hide\" for locked-visibility columns\n      // (top-level `lockVisible` preferred; legacy `meta.lockVisibility` honored for back-compat)\n      if (column.lockVisible || column.meta?.lockVisibility) return undefined;\n\n      const items: HeaderContextMenuItem[] = [\n        {\n          id: 'visibility/hide-column',\n          label: this.t('columns.hideColumn', 'Hide Column'),\n          icon: '👁',\n          order: 30,\n          action: () => this.hideColumn(column.field),\n        },\n      ];\n\n      return items;\n    }\n    return undefined;\n  }\n  // #endregion\n\n  // #region Shell Integration\n\n  /**\n   * Register the column visibility tool panel with the shell.\n   * @internal\n   */\n  override getToolPanel(): ToolPanelDefinition | undefined {\n    return {\n      id: VisibilityPlugin.PANEL_ID,\n      title: this.t('columns.panelTitle', 'Columns'),\n      icon: '☰',\n      tooltip: 'Column visibility',\n      order: 100, // High order so it appears last\n      render: (container) => this.renderPanelContent(container),\n    };\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Resolve the shell plugin (#370). The visibility tool panel lives in the\n   * shell, so panel open/close/toggle is delegated to the ShellPlugin instance\n   * rather than the deprecated core `grid.*` shell delegates.\n   */\n  #shell() {\n    return this.grid.getPluginByName('shell');\n  }\n\n  /**\n   * Show the visibility sidebar panel.\n   * Opens the tool panel and ensures this section is expanded.\n   */\n  show(): void {\n    this.#shell()?.openToolPanel(VisibilityPlugin.PANEL_ID);\n  }\n\n  /**\n   * Hide the visibility sidebar panel.\n   */\n  hide(): void {\n    this.#shell()?.closeToolPanel();\n  }\n\n  /**\n   * Toggle the visibility sidebar panel section.\n   */\n  toggle(): void {\n    const shell = this.#shell();\n    // If tool panel is closed, open it first\n    if (!shell?.isToolPanelOpen) {\n      shell?.openToolPanel();\n    }\n    shell?.toggleToolPanelSection(VisibilityPlugin.PANEL_ID);\n  }\n\n  /**\n   * Check if a specific column is visible.\n   * Delegates to grid.isColumnVisible().\n   * @param field - The field name to check\n   * @returns True if the column is visible\n   */\n  isColumnVisible(field: string): boolean {\n    return this.grid.isColumnVisible(field);\n  }\n\n  /**\n   * Set visibility for a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column\n   * @param visible - Whether the column should be visible\n   */\n  setColumnVisible(field: string, visible: boolean): void {\n    this.grid.setColumnVisible(field, visible);\n  }\n\n  /**\n   * Get list of all visible column fields.\n   * @returns Array of visible field names\n   */\n  getVisibleColumns(): string[] {\n    return this.grid\n      .getAllColumns()\n      .filter((c) => c.visible)\n      .map((c) => c.field);\n  }\n\n  /**\n   * Get list of all hidden column fields.\n   * @returns Array of hidden field names\n   */\n  getHiddenColumns(): string[] {\n    return this.grid\n      .getAllColumns()\n      .filter((c) => !c.visible)\n      .map((c) => c.field);\n  }\n\n  /**\n   * Show all columns.\n   * Delegates to grid.showAllColumns().\n   */\n  showAll(): void {\n    this.grid.showAllColumns();\n  }\n\n  /**\n   * Toggle visibility for a specific column.\n   * Delegates to grid.toggleColumnVisibility().\n   * @param field - The field name of the column\n   */\n  toggleColumn(field: string): void {\n    this.grid.toggleColumnVisibility(field);\n  }\n\n  /**\n   * Show a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column to show\n   */\n  showColumn(field: string): void {\n    this.setColumnVisible(field, true);\n  }\n\n  /**\n   * Hide a specific column.\n   * Delegates to grid.setColumnVisible().\n   * @param field - The field name of the column to hide\n   */\n  hideColumn(field: string): void {\n    this.setColumnVisible(field, false);\n  }\n\n  /**\n   * Get all columns with their visibility status.\n   * Useful for building visibility UI.\n   * @returns Array of column info with visibility status\n   */\n  getAllColumns(): Array<{\n    field: string;\n    header: string;\n    visible: boolean;\n    lockVisible?: boolean;\n    utility?: boolean;\n  }> {\n    return this.grid.getAllColumns();\n  }\n\n  /**\n   * Check if the sidebar panel is currently open.\n   * @returns True if the panel section is expanded\n   */\n  isPanelVisible(): boolean {\n    const shell = this.#shell();\n    return !!shell?.isToolPanelOpen && shell.expandedToolPanelSections.includes(VisibilityPlugin.PANEL_ID);\n  }\n  // #endregion\n\n  // #region Private Methods\n\n  /**\n   * Render the panel content into the shell's tool panel container.\n   * Returns a cleanup function.\n   */\n  private renderPanelContent(container: HTMLElement): (() => void) | void {\n    // Create content wrapper\n    const wrapper = document.createElement('div');\n    wrapper.className = 'tbw-visibility-content';\n\n    // Column list container\n    const columnList = document.createElement('div');\n    columnList.className = 'tbw-visibility-list';\n    wrapper.appendChild(columnList);\n\n    // Show all button\n    const showAllBtn = document.createElement('button');\n    showAllBtn.type = 'button';\n    showAllBtn.className = 'tbw-visibility-show-all';\n    showAllBtn.textContent = this.t('columns.showAll', 'Show All');\n    showAllBtn.addEventListener('click', () => {\n      this.grid.showAllColumns();\n      this.rebuildToggles(columnList);\n    });\n    wrapper.appendChild(showAllBtn);\n\n    // Store reference\n    this.columnListElement = columnList;\n\n    // Build initial toggles\n    this.rebuildToggles(columnList);\n\n    // Append to container\n    container.appendChild(wrapper);\n\n    // Return cleanup function\n    return () => {\n      this.columnListElement = null;\n      this.moveMenu?.close();\n      wrapper.remove();\n    };\n  }\n\n  /**\n   * Check if a reorder plugin is present (by name to avoid static import).\n   */\n  private hasReorderPlugin(): boolean {\n    const plugin = this.grid?.getPluginByName?.('reorder');\n    // Duck-type check - just verify the plugin exists and has a moveColumn method\n    return !!(plugin && typeof (plugin as { moveColumn?: unknown }).moveColumn === 'function');\n  }\n\n  /**\n   * Ask the plugin system whether a column may be reordered.\n   *\n   * Looks up the real `ColumnConfig` by field (the projection from `getAllColumns()`\n   * intentionally omits plugin-owned flags like `lockPosition`) and forwards it to\n   * the `canMoveColumn` query handled by ReorderPlugin and vetoed by other plugins\n   * (e.g. PinnedColumnsPlugin blocking sticky columns). Returns `false` when no\n   * plugin answers, which keeps the panel non-draggable when reorder is absent.\n   */\n  private canMoveColumn(column: ColumnEntry): boolean {\n    const config = this.grid.columns.find((c) => c.field === column.field);\n    if (!config) return false;\n    const responses = this.grid.query<boolean>('canMoveColumn', config);\n    return responses.length > 0 && !responses.includes(false);\n  }\n\n  /**\n   * Build the column toggle checkboxes.\n   * When GroupingColumnsPlugin is present, renders columns under collapsible group headers.\n   * Groups that are fragmented (same group split across non-contiguous positions) are\n   * shown as separate sections to match the grid's visual layout.\n   * When a reorder plugin is present, adds drag handles for reordering.\n   */\n  private rebuildToggles(columnList: HTMLElement): void {\n    const reorderEnabled = this.hasReorderPlugin();\n\n    columnList.innerHTML = '';\n\n    // getAllColumns() returns columns in their effective display order\n    // Filter out utility columns (e.g., expander column) as they're internal\n    const allColumns = this.grid.getAllColumns().filter((c) => !c.utility);\n    const fragments = this.currentFragments();\n\n    if (fragments.every((f) => !f.group)) {\n      // No grouping — render flat list (original behavior)\n      this.renderFlatColumnList(allColumns, reorderEnabled, columnList);\n      return;\n    }\n\n    for (const fragment of fragments) {\n      if (fragment.group) {\n        this.renderGroupSection(fragment.group, fragment.columns, reorderEnabled, columnList);\n      } else {\n        // Ungrouped column — render as individual row\n        const fullIndex = allColumns.indexOf(fragment.columns[0]);\n        columnList.appendChild(this.createColumnRow(fragment.columns[0], fullIndex, reorderEnabled, columnList));\n      }\n    }\n  }\n\n  /**\n   * The panel's current top-level rows, in display order: one entry per group\n   * fragment plus one per ungrouped column. Recomputed from live grid state on\n   * every call so the move menu can never act on a stale panel.\n   *\n   * Walks columns in display order and detects contiguous fragments. A fragment\n   * is a run of consecutive columns belonging to the same group. Fragmented\n   * groups (same group ID at non-contiguous positions) produce separate sections\n   * so the panel matches the grid's visual layout.\n   */\n  private currentFragments(): PanelFragment[] {\n    const allColumns = this.grid.getAllColumns().filter((c) => !c.utility);\n\n    // Query for column grouping info from GroupingColumnsPlugin (or any responder)\n    const groupResults = this.grid.query<ColumnGroupInfo[]>('getColumnGrouping');\n    const groups: ColumnGroupInfo[] = groupResults?.flat().filter((g) => g && g.fields.length > 0) ?? [];\n    if (groups.length === 0) return allColumns.map((c) => ({ group: null, columns: [c] }));\n\n    const fieldToGroup = new Map<string, ColumnGroupInfo>();\n    for (const group of groups) {\n      for (const field of group.fields) fieldToGroup.set(field, group);\n    }\n    return this.computeFragments(allColumns, fieldToGroup);\n  }\n\n  /**\n   * Compute contiguous column fragments from display-order columns.\n   * Each fragment is either a group section (contiguous run of same-group columns)\n   * or a single ungrouped column.\n   */\n  private computeFragments(\n    allColumns: ColumnEntry[],\n    fieldToGroup: Map<string, ColumnGroupInfo>,\n  ): PanelFragment[] {\n    const fragments: PanelFragment[] = [];\n    let currentGroup: ColumnGroupInfo | null = null;\n    let currentCols: ColumnEntry[] = [];\n\n    for (const col of allColumns) {\n      const group = fieldToGroup.get(col.field) ?? null;\n\n      if (group && currentGroup && group.id === currentGroup.id) {\n        // Same group continues — extend fragment\n        currentCols.push(col);\n      } else {\n        // Flush previous fragment\n        if (currentCols.length > 0) {\n          fragments.push({ group: currentGroup, columns: currentCols });\n        }\n        currentGroup = group;\n        currentCols = [col];\n      }\n    }\n    // Flush last fragment\n    if (currentCols.length > 0) {\n      fragments.push({ group: currentGroup, columns: currentCols });\n    }\n\n    return fragments;\n  }\n\n  /**\n   * Render a group fragment section with header checkbox and indented column rows.\n   * A fragment is a contiguous run of columns from the same group. When a group is\n   * fragmented (split across non-contiguous positions), each fragment gets its own section.\n   */\n  private renderGroupSection(\n    group: ColumnGroupInfo,\n    columns: ColumnEntry[],\n    reorderEnabled: boolean,\n    container: HTMLElement,\n  ): void {\n    // The fragment's fields — only the columns in this contiguous section\n    const fragmentFields = columns.map((c) => c.field);\n\n    // Group header row\n    const header = document.createElement('div');\n    header.className = 'tbw-visibility-group-header';\n    header.setAttribute('data-group-id', group.id);\n\n    // Make group header draggable when reorder is enabled.\n    // Pass only this fragment's fields so dragging moves just this\n    // contiguous block, not all columns of the (possibly fragmented) group.\n    if (reorderEnabled) {\n      header.draggable = true;\n      header.classList.add('reorderable');\n      this.setupGroupDragListeners(header, group, fragmentFields, container);\n    }\n\n    const headerLabel = document.createElement('label');\n    headerLabel.className = 'tbw-visibility-label';\n\n    const groupCheckbox = document.createElement('input');\n    groupCheckbox.type = 'checkbox';\n\n    // Calculate tri-state: all visible, all hidden, or mixed\n    const visibleCount = columns.filter((c) => c.visible).length;\n    const allLocked = columns.every((c) => c.lockVisible);\n    if (visibleCount === columns.length) {\n      groupCheckbox.checked = true;\n      groupCheckbox.indeterminate = false;\n    } else if (visibleCount === 0) {\n      groupCheckbox.checked = false;\n      groupCheckbox.indeterminate = false;\n    } else {\n      groupCheckbox.checked = false;\n      groupCheckbox.indeterminate = true;\n    }\n    groupCheckbox.disabled = allLocked;\n\n    // Toggle all columns in group\n    groupCheckbox.addEventListener('change', () => {\n      const newVisible = groupCheckbox.checked;\n      for (const col of columns) {\n        if (col.lockVisible) continue;\n        this.grid.setColumnVisible(col.field, newVisible);\n      }\n      setTimeout(() => this.rebuildToggles(container), 0);\n    });\n\n    const headerText = document.createElement('span');\n    headerText.textContent = group.label;\n\n    headerLabel.appendChild(groupCheckbox);\n    headerLabel.appendChild(headerText);\n    header.appendChild(headerLabel);\n\n    // Add drag handle icon for group if reorderable\n    if (reorderEnabled) {\n      const handle = document.createElement('span');\n      handle.className = 'tbw-visibility-handle';\n      this.setIcon(handle, 'dragHandle');\n      handle.title = this.t('columns.dragGroupHandle', 'Drag to reorder group, or click for move options');\n      this.wireMoveHandle(handle, group.label, () => this.groupMoveActions(fragmentFields));\n      // Insert handle before the label\n      header.insertBefore(handle, headerLabel);\n    }\n\n    container.appendChild(header);\n\n    // Render indented column rows\n    const allColumnsFullList = this.grid.getAllColumns().filter((c) => !c.utility);\n    for (const col of columns) {\n      const fullIndex = allColumnsFullList.findIndex((c) => c.field === col.field);\n      const row = this.createColumnRow(col, fullIndex, reorderEnabled, container);\n      row.classList.add('tbw-visibility-row--grouped');\n      container.appendChild(row);\n    }\n  }\n\n  /**\n   * Render a flat (ungrouped) list of column rows.\n   */\n  private renderFlatColumnList(columns: ColumnEntry[], reorderEnabled: boolean, container: HTMLElement): void {\n    const allColumnsFullList = this.grid.getAllColumns().filter((c) => !c.utility);\n    for (const col of columns) {\n      const fullIndex = allColumnsFullList.findIndex((c) => c.field === col.field);\n      container.appendChild(this.createColumnRow(col, fullIndex, reorderEnabled, container));\n    }\n  }\n\n  /**\n   * Create a single column visibility row element.\n   */\n  private createColumnRow(\n    col: ColumnEntry,\n    index: number,\n    reorderEnabled: boolean,\n    columnList: HTMLElement,\n  ): HTMLElement {\n    const label = col.header || col.field;\n\n    const row = document.createElement('div');\n    row.className = col.lockVisible ? 'tbw-visibility-row locked' : 'tbw-visibility-row';\n    row.setAttribute('data-field', col.field);\n    row.setAttribute('data-index', String(index));\n\n    // Add drag handle if reorder is enabled\n    if (reorderEnabled && this.canMoveColumn(col)) {\n      row.draggable = true;\n      row.classList.add('reorderable');\n      this.setupDragListeners(row, col.field, index, columnList);\n    }\n\n    const labelWrapper = document.createElement('label');\n    labelWrapper.className = 'tbw-visibility-label';\n\n    const checkbox = document.createElement('input');\n    checkbox.type = 'checkbox';\n    checkbox.checked = col.visible;\n    checkbox.disabled = col.lockVisible ?? false;\n    checkbox.addEventListener('change', () => {\n      this.grid.toggleColumnVisibility(col.field);\n      // Refresh after toggle (grid may re-render)\n      setTimeout(() => this.rebuildToggles(columnList), 0);\n    });\n\n    const text = document.createElement('span');\n    text.textContent = label;\n\n    labelWrapper.appendChild(checkbox);\n    labelWrapper.appendChild(text);\n\n    // Add drag handle icon if reorderable\n    if (reorderEnabled && this.canMoveColumn(col)) {\n      const handle = document.createElement('span');\n      handle.className = 'tbw-visibility-handle';\n      this.setIcon(handle, 'dragHandle');\n      handle.title = this.t('columns.dragHandle', 'Drag to reorder, or click for move options');\n      this.wireMoveHandle(handle, label, () => this.columnMoveActions(col.field));\n      row.appendChild(handle);\n    }\n\n    row.appendChild(labelWrapper);\n    return row;\n  }\n\n  /**\n   * Turn a drag handle into the pointer alternative required by WCAG 2.2\n   * SC 2.5.7: a press-and-release without movement never fires `dragstart`, so\n   * a plain click on the handle is the tap the criterion asks us to honour.\n   *\n   * The handle stays part of the row's drag surface — it is deliberately not\n   * marked `draggable=\"false\"` — so dragging by the handle keeps working.\n   * Actions are resolved on click, never at render time, so a stale panel can\n   * never move the wrong column.\n   */\n  private wireMoveHandle(handle: HTMLElement, name: string, actions: () => DragAlternativeAction[]): void {\n    handle.setAttribute('role', 'button');\n    handle.tabIndex = -1;\n    handle.setAttribute('aria-label', `${name} — ${this.t('columns.moveHandleHint', 'drag, or activate for move options')}`);\n    handle.addEventListener('click', () => {\n      this.moveMenu ??= createDragAlternativeMenu('tbw-visibility-move-menu', 'tbw-visibility-move-menu');\n      this.moveMenu.open(handle, name, actions());\n    });\n  }\n\n  /**\n   * Emit the reorder request a drop at `dropIndex` would have produced.\n   * `fromIndex`/`dropIndex` are positions in the panel's non-utility list;\n   * `toIndex` is converted to the full column order the way the drop handler\n   * does it, so the click path and the drag path can never diverge.\n   */\n  private requestColumnMove(field: string, fromIndex: number, dropIndex: number): void {\n    const effectiveToIndex = dropIndex > fromIndex ? dropIndex - 1 : dropIndex;\n    if (effectiveToIndex === fromIndex) return;\n\n    const allColumns = this.grid.getAllColumns();\n    const nonUtilityColumns = allColumns.filter((c) => !c.utility);\n    const targetField = nonUtilityColumns[effectiveToIndex]?.field;\n    const toIndex = targetField ? allColumns.findIndex((c) => c.field === targetField) : allColumns.length;\n\n    this.emit<ColumnReorderRequestDetail>('column-reorder-request', { field, fromIndex, toIndex });\n  }\n\n  /** Click-only move actions for a single column row. */\n  private columnMoveActions(field: string): DragAlternativeAction[] {\n    const columns = this.grid.getAllColumns().filter((c) => !c.utility);\n    const from = columns.findIndex((c) => c.field === field);\n    const landable = (i: number) => i >= 0 && i < columns.length && this.canMoveColumn(columns[i]);\n\n    return [\n      {\n        label: this.t('columns.moveUp', 'Move up'),\n        disabled: !landable(from - 1),\n        run: () => this.requestColumnMove(field, from, from - 1),\n      },\n      {\n        label: this.t('columns.moveDown', 'Move down'),\n        // The drop path takes an insert-before index, so stepping down one\n        // place means aiming past the row that follows.\n        disabled: !landable(from + 1),\n        run: () => this.requestColumnMove(field, from, from + 2),\n      },\n      {\n        label: this.t('columns.moveToTop', 'Move to top'),\n        disabled: from <= 0 || !landable(0),\n        run: () => this.requestColumnMove(field, from, 0),\n      },\n      {\n        label: this.t('columns.moveToBottom', 'Move to bottom'),\n        disabled: from < 0 || from >= columns.length - 1 || !landable(columns.length - 1),\n        run: () => this.requestColumnMove(field, from, columns.length),\n      },\n    ];\n  }\n\n  /** Click-only move actions for a group fragment header. */\n  private groupMoveActions(fragmentFields: string[]): DragAlternativeAction[] {\n    const fragments = this.currentFragments();\n    const at = fragments.findIndex((f) => f.columns[0]?.field === fragmentFields[0]);\n    const fieldsAt = (i: number) => fragments[i].columns.map((c) => c.field);\n    const first = at <= 0;\n    const last = at < 0 || at >= fragments.length - 1;\n\n    return [\n      {\n        label: this.t('columns.moveUp', 'Move up'),\n        disabled: first,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(at - 1), true),\n      },\n      {\n        label: this.t('columns.moveDown', 'Move down'),\n        disabled: last,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(at + 1), false),\n      },\n      {\n        label: this.t('columns.moveToTop', 'Move to top'),\n        disabled: first,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(0), true),\n      },\n      {\n        label: this.t('columns.moveToBottom', 'Move to bottom'),\n        disabled: last,\n        run: () => this.executeGroupDrop(fragmentFields, fieldsAt(fragments.length - 1), false),\n      },\n    ];\n  }\n\n  /**\n   * Set up drag-and-drop listeners for a group header row.\n   * Dragging a group fragment moves only the columns in that fragment as a block.\n   * When a group is fragmented, each fragment header drags independently.\n   */\n  private setupGroupDragListeners(\n    header: HTMLElement,\n    group: ColumnGroupInfo,\n    fragmentFields: string[],\n    columnList: HTMLElement,\n  ): void {\n    header.addEventListener('dragstart', (e: DragEvent) => {\n      this.isDragging = true;\n      this.draggedGroupId = group.id;\n      this.draggedGroupFields = [...fragmentFields];\n      // Use first field as representative for dataTransfer\n      this.draggedField = null;\n      this.draggedIndex = null;\n\n      if (e.dataTransfer) {\n        e.dataTransfer.effectAllowed = 'move';\n        e.dataTransfer.setData('text/plain', `group:${group.id}`);\n      }\n\n      // Mark entire group (header + children) as dragging\n      header.classList.add(GridClasses.DRAGGING);\n      columnList.querySelectorAll(`.tbw-visibility-row--grouped`).forEach((row) => {\n        const field = row.getAttribute('data-field');\n        if (field && this.draggedGroupFields.includes(field)) {\n          row.classList.add(GridClasses.DRAGGING);\n        }\n      });\n    });\n\n    header.addEventListener('dragend', () => {\n      this.isDragging = false;\n      this.draggedGroupId = null;\n      this.draggedGroupFields = [];\n      this.draggedField = null;\n      this.draggedIndex = null;\n      this.dropIndex = null;\n      this.clearDragClasses(columnList);\n    });\n\n    // Group headers are also drop targets for other groups (or other fragments of the same group)\n    header.addEventListener('dragover', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging) return;\n      // Can't drop onto the same fragment (same exact fields)\n      if (\n        this.draggedGroupFields.length === fragmentFields.length &&\n        this.draggedGroupFields.every((f) => fragmentFields.includes(f))\n      )\n        return;\n      // Can't drop individual columns onto group headers\n      if (!this.draggedGroupId) return;\n\n      const rect = header.getBoundingClientRect();\n      const midY = rect.top + rect.height / 2;\n      const before = e.clientY < midY;\n\n      this.clearDragClasses(columnList);\n      header.classList.add('drop-target');\n      header.classList.toggle('drop-before', before);\n      header.classList.toggle('drop-after', !before);\n    });\n\n    header.addEventListener('dragleave', () => {\n      header.classList.remove('drop-target', 'drop-before', 'drop-after');\n    });\n\n    header.addEventListener('drop', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging || !this.draggedGroupId) return;\n      // Can't drop onto the same fragment\n      if (\n        this.draggedGroupFields.length === fragmentFields.length &&\n        this.draggedGroupFields.every((f) => fragmentFields.includes(f))\n      )\n        return;\n\n      const rect = header.getBoundingClientRect();\n      const before = e.clientY < rect.top + rect.height / 2;\n\n      this.executeGroupDrop(this.draggedGroupFields, fragmentFields, before);\n    });\n  }\n\n  /**\n   * Execute a group drop — move the dragged fragment's fields as a block\n   * to the position relative to the target group/column.\n   * Routes through the ReorderPlugin when available for proper animation and\n   * full render cycle, otherwise falls back to direct grid.setColumnOrder().\n   */\n  private executeGroupDrop(draggedFields: string[], targetFields: string[], before: boolean): void {\n    const allColumns = this.grid.getAllColumns();\n    const currentOrder = allColumns.map((c) => c.field);\n\n    // Remove dragged fields from current order\n    const remaining = currentOrder.filter((f) => !draggedFields.includes(f));\n\n    // Find insertion point relative to target\n    // Use the first field of target group if inserting before, last if after\n    const anchorField = before ? targetFields[0] : targetFields[targetFields.length - 1];\n    const insertAt = remaining.indexOf(anchorField);\n    if (insertAt === -1) return;\n\n    // Insert the dragged group block at the correct position\n    const insertIndex = before ? insertAt : insertAt + 1;\n\n    // Preserve the dragged fields' original relative order\n    const draggedInOrder = currentOrder.filter((f) => draggedFields.includes(f));\n    remaining.splice(insertIndex, 0, ...draggedInOrder);\n\n    // Route through ReorderPlugin.setColumnOrder when available and attached —\n    // this calls updateColumnOrder which handles animation and forceLayout for\n    // proper body cell rebuilds. Fall back to direct grid.setColumnOrder otherwise.\n    const reorderPlugin = this.grid.getPluginByName?.('reorder') as\n      { setColumnOrder?: (o: string[]) => void; gridElement?: unknown } | undefined;\n    if (reorderPlugin?.setColumnOrder && reorderPlugin.gridElement) {\n      reorderPlugin.setColumnOrder(remaining);\n    } else {\n      this.grid.setColumnOrder(remaining);\n    }\n\n    // Panel rebuild is handled by the column-move listener when ReorderPlugin\n    // emits the event. For the direct fallback path, trigger manually.\n    requestAnimationFrame(() => {\n      if (this.columnListElement) {\n        this.rebuildToggles(this.columnListElement);\n      }\n    });\n  }\n\n  /**\n   * Set up drag-and-drop event listeners for a row.\n   * On drop, emits a 'column-reorder-request' event for other plugins to handle.\n   */\n  private setupDragListeners(row: HTMLElement, field: string, index: number, columnList: HTMLElement): void {\n    row.addEventListener('dragstart', (e: DragEvent) => {\n      this.isDragging = true;\n      this.draggedField = field;\n      this.draggedIndex = index;\n      // Clear any stale group drag state\n      this.draggedGroupId = null;\n      this.draggedGroupFields = [];\n\n      if (e.dataTransfer) {\n        e.dataTransfer.effectAllowed = 'move';\n        e.dataTransfer.setData('text/plain', field);\n      }\n\n      row.classList.add(GridClasses.DRAGGING);\n    });\n\n    row.addEventListener('dragend', () => {\n      this.isDragging = false;\n      this.draggedField = null;\n      this.draggedIndex = null;\n      this.dropIndex = null;\n      this.clearDragClasses(columnList);\n    });\n\n    row.addEventListener('dragover', (e: DragEvent) => {\n      e.preventDefault();\n      if (!this.isDragging) return;\n\n      // If dragging a group, only allow drop on ungrouped rows\n      if (this.draggedGroupId) {\n        if (row.classList.contains('tbw-visibility-row--grouped')) return;\n      } else if (this.draggedField === field) {\n        return;\n      }\n\n      const rect = row.getBoundingClientRect();\n      const midY = rect.top + rect.height / 2;\n\n      this.dropIndex = e.clientY < midY ? index : index + 1;\n\n      // Clear other highlights\n      this.clearDragClasses(columnList);\n      // Re-mark dragged elements\n      if (this.draggedGroupId) {\n        columnList\n          .querySelector(`.tbw-visibility-group-header[data-group-id=\"${this.draggedGroupId}\"]`)\n          ?.classList.add(GridClasses.DRAGGING);\n        columnList.querySelectorAll('.tbw-visibility-row--grouped').forEach((r) => {\n          const f = r.getAttribute('data-field');\n          if (f && this.draggedGroupFields.includes(f)) r.classList.add(GridClasses.DRAGGING);\n        });\n      } else if (this.draggedField) {\n        columnList\n          .querySelector(`.tbw-visibility-row[data-field=\"${this.draggedField}\"]`)\n          ?.classList.add(GridClasses.DRAGGING);\n      }\n\n      row.classList.add('drop-target');\n      row.classList.toggle('drop-before', e.clientY < midY);\n      row.classList.toggle('drop-after', e.clientY >= midY);\n    });\n\n    row.addEventListener('dragleave', () => {\n      row.classList.remove('drop-target', 'drop-before', 'drop-after');\n    });\n\n    row.addEventListener('drop', (e: DragEvent) => {\n      e.preventDefault();\n\n      if (!this.isDragging) return;\n\n      // Group drop onto an ungrouped row\n      if (this.draggedGroupId && this.draggedGroupFields.length > 0) {\n        if (row.classList.contains('tbw-visibility-row--grouped')) return;\n        const rect = row.getBoundingClientRect();\n        const before = e.clientY < rect.top + rect.height / 2;\n        this.executeGroupDrop(this.draggedGroupFields, [field], before);\n        return;\n      }\n\n      // Individual column drop\n      const draggedField = this.draggedField;\n      const draggedIndex = this.draggedIndex;\n      const dropIndex = this.dropIndex;\n\n      if (draggedField === null || draggedIndex === null || dropIndex === null) {\n        return;\n      }\n\n      // Calculate the effective target index (in the filtered non-utility list)\n      const effectiveToIndex = dropIndex > draggedIndex ? dropIndex - 1 : dropIndex;\n\n      if (effectiveToIndex !== draggedIndex) {\n        // Convert from non-utility index to full column order index\n        // by counting how many utility columns come before the target position\n        const allColumns = this.grid.getAllColumns();\n        const nonUtilityColumns = allColumns.filter((c) => !c.utility);\n\n        // Find the target field at effectiveToIndex in non-utility list\n        const targetField = nonUtilityColumns[effectiveToIndex]?.field;\n        // Find its actual index in the full column order\n        const fullOrderToIndex = targetField ? allColumns.findIndex((c) => c.field === targetField) : allColumns.length;\n\n        // Emit a request event - other plugins (like ReorderPlugin) can listen and handle\n        const detail: ColumnReorderRequestDetail = {\n          field: draggedField,\n          fromIndex: draggedIndex, // Not used by ReorderPlugin, just for info\n          toIndex: fullOrderToIndex,\n        };\n        this.emit<ColumnReorderRequestDetail>('column-reorder-request', detail);\n        // Panel rebuild is handled by the column-move listener in attach()\n      }\n    });\n  }\n  // #endregion\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toolbox-web/grid",
-  "version": "3.9.2",
+  "version": "3.10.0",
   "description": "Zero-dependency, framework-agnostic data grid web component with virtualization, sorting, filtering, editing, and 20+ plugins. Works in vanilla JS, React, Vue, Angular, and any framework.",
   "type": "module",
   "main": "./index.js",