@perspective-dev/viewer-datagrid 4.4.0 → 4.5.0

package/src/ts/style_handlers/group_header.ts

@@ -19,21 +19,23 @@ import { CollectedHeaderRow } from "./types.js";
  * Apply styles to group header rows.
  */
 export function applyGroupHeaderStyles(
-    this: DatagridModel,
+    model: DatagridModel,
     headerRows: CollectedHeaderRow[],
     regularTable: RegularTableElement,
 ): void {
-    const header_depth = this._config.group_by.length;
+    const header_depth = model._config.group_by.length;
     const m: boolean[][] = [];
     let marked = new Set<number>();
 
     for (let y = 0; y < headerRows.length; y++) {
-        const { row, cells } = headerRows[y];
+        const { cells } = headerRows[y];
         const tops = new Set<number>();
 
         for (let x = 0; x < cells.length; x++) {
             const { element: td, metadata } = cells[x];
-            if (!metadata) continue;
+            if (!metadata) {
+                continue;
+            }
 
             td.style.backgroundColor = "";
 
@@ -54,6 +56,7 @@ export function applyGroupHeaderStyles(
             );
 
             td.classList.toggle("psp-color-mode-bar", false);
+            td.classList.toggle("psp-color-mode-label-bar", false);
             td.classList.toggle("psp-header-sort-asc", false);
             td.classList.toggle("psp-header-sort-desc", false);
             td.classList.toggle("psp-header-sort-col-asc", false);
@@ -62,13 +65,17 @@ export function applyGroupHeaderStyles(
 
             // Calculate spanning for psp-is-top
             let xx = x;
-            for (; m[y] && m[y][xx]; ++xx);
+            for (; m[y] && m[y][xx]; ++xx) {}
+
             tops.add(xx);
 
             const cell = td;
             for (let tx = xx; tx < xx + cell.colSpan; ++tx) {
                 for (let ty = y; ty < y + cell.rowSpan; ++ty) {
-                    if (!m[ty]) m[ty] = [];
+                    if (!m[ty]) {
+                        m[ty] = [];
+                    }
+
                     m[ty][tx] = true;
                 }
             }

package/src/ts/style_handlers/table_cell/boolean.ts

@@ -14,7 +14,7 @@ import { CellMetadata } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, ColumnConfig, ColorRecord } from "../../types.js";
 
 export function cell_style_boolean(
-    this: DatagridModel,
+    model: DatagridModel,
     _plugin: ColumnConfig | undefined,
     td: HTMLElement,
     metadata: CellMetadata,
@@ -26,9 +26,9 @@ export function cell_style_boolean(
     } else {
         const [hex]: ColorRecord | [string, number, number, number, string] =
             metadata.user === true
-                ? this._pos_fg_color
+                ? model._pos_fg_color
                 : metadata.user === false
-                  ? this._neg_fg_color
+                  ? model._neg_fg_color
                   : ["", 0, 0, 0, ""];
         td.style.backgroundColor = "";
         td.style.color = hex;

package/src/ts/style_handlers/table_cell/cell_flash.ts

@@ -14,14 +14,14 @@ import { CellMetadataBody } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, ColorRecord } from "../../types.js";
 
 export function style_cell_flash(
-    this: DatagridModel,
+    model: DatagridModel,
     metadata: CellMetadataBody,
     td: HTMLElement,
     [, , , , , pos_s, pos_e]: ColorRecord,
     [, , , , , neg_s, neg_e]: ColorRecord,
     is_settings_open: boolean,
 ): void {
-    const id = this._ids?.[metadata.dy ?? 0]?.join("|");
+    const id = model._ids?.[metadata.dy ?? 0]?.join("|");
     const metadata_path = (
         is_settings_open
             ? (metadata.column_header ?? []).slice(0, -1)
@@ -29,19 +29,19 @@ export function style_cell_flash(
     ).join("|");
 
     if (
-        this.last_reverse_columns?.has(metadata_path) &&
-        this.last_reverse_ids?.has(id)
+        model.last_reverse_columns?.has(metadata_path) &&
+        model.last_reverse_ids?.has(id)
     ) {
-        const row_idx = this.last_reverse_ids?.get(id);
-        const col_idx = this.last_reverse_columns.get(metadata_path);
-        if (!this._is_old_viewport) {
+        const row_idx = model.last_reverse_ids?.get(id);
+        const col_idx = model.last_reverse_columns.get(metadata_path);
+        if (!model._is_old_viewport) {
             td.style.animation = "";
         } else if (
             col_idx !== undefined &&
             row_idx !== undefined &&
-            (this.last_meta?.[col_idx]?.[row_idx] as number | undefined) !==
+            (model.last_meta?.[col_idx]?.[row_idx] as number | undefined) !==
                 undefined &&
-            (this.last_meta![col_idx]![row_idx] as number) >
+            (model.last_meta![col_idx]![row_idx] as number) >
                 ((metadata.user ?? 0) as number)
         ) {
             td.style.setProperty("--pulse--background-color-start", neg_s);
@@ -54,9 +54,9 @@ export function style_cell_flash(
         } else if (
             col_idx !== undefined &&
             row_idx !== undefined &&
-            (this.last_meta?.[col_idx]?.[row_idx] as number | undefined) !==
+            (model.last_meta?.[col_idx]?.[row_idx] as number | undefined) !==
                 undefined &&
-            (this.last_meta![col_idx]![row_idx] as number) <
+            (model.last_meta![col_idx]![row_idx] as number) <
                 ((metadata.user ?? 0) as number)
         ) {
             td.style.setProperty("--pulse--background-color-start", pos_s);

package/src/ts/style_handlers/table_cell/datetime.ts

@@ -22,7 +22,7 @@ interface PluginWithColor extends Omit<ColumnConfig, "color"> {
 }
 
 export function cell_style_datetime(
-    this: DatagridModel,
+    model: DatagridModel,
     plugin: PluginWithColor,
     td: HTMLElement,
     metadata: CellMetadata,
@@ -31,7 +31,7 @@ export function cell_style_datetime(
         if (plugin?.color !== undefined) {
             return plugin.color;
         } else {
-            return this._color;
+            return model._color;
         }
     })();
 
@@ -51,7 +51,7 @@ export function cell_style_datetime(
         plugin?.datetime_color_mode === "background" &&
         metadata.user !== null
     ) {
-        const source = this._plugin_background as [number, number, number];
+        const source = model._plugin_background as [number, number, number];
         const foreground = infer_foreground_from_background(
             rgbaToRgb([r, g, b, 1], source),
         );

package/src/ts/style_handlers/table_cell/numeric.ts

@@ -36,7 +36,7 @@ interface PluginWithColors
 }
 
 export function cell_style_numeric(
-    this: DatagridModel,
+    model: DatagridModel,
     plugin: PluginWithColors | undefined,
     td: HTMLElement,
     metadata: CellMetaWithExtras,
@@ -49,14 +49,14 @@ export function cell_style_numeric(
     if (plugin?.pos_bg_color !== undefined) {
         pos_bg_color = plugin.pos_bg_color;
     } else {
-        pos_bg_color = this._pos_bg_color;
+        pos_bg_color = model._pos_bg_color;
     }
 
     let neg_bg_color: ColorRecord;
     if (plugin?.neg_bg_color !== undefined) {
         neg_bg_color = plugin.neg_bg_color;
     } else {
-        neg_bg_color = this._neg_bg_color;
+        neg_bg_color = model._neg_bg_color;
     }
 
     const bg_tuple: ColorRecord = is_positive
@@ -65,9 +65,9 @@ export function cell_style_numeric(
           ? neg_bg_color
           : [
                 "",
-                this._plugin_background[0],
-                this._plugin_background[1],
-                this._plugin_background[2],
+                model._plugin_background[0],
+                model._plugin_background[1],
+                model._plugin_background[2],
                 "",
                 "",
                 "",
@@ -91,7 +91,7 @@ export function cell_style_numeric(
                     Math.abs((metadata.user ?? 0) / (plugin.bg_gradient ?? 1)),
                 ),
             );
-            const source = this._plugin_background as [number, number, number];
+            const source = model._plugin_background as [number, number, number];
             const foreground = infer_foreground_from_background(
                 rgbaToRgb([r, g, b, a], source),
             );
@@ -100,8 +100,8 @@ export function cell_style_numeric(
             td.style.color = foreground;
             td.style.backgroundColor = `rgba(${r},${g},${b},${a})`;
         } else if (plugin?.number_bg_mode === "pulse") {
-            style_cell_flash.call(
-                this,
+            style_cell_flash(
+                model,
                 metadata as any,
                 td,
                 pos_bg_color,
@@ -129,23 +129,23 @@ export function cell_style_numeric(
                   ? plugin.neg_fg_color!
                   : [
                         "",
-                        this._plugin_background[0],
-                        this._plugin_background[1],
-                        this._plugin_background[2],
+                        model._plugin_background[0],
+                        model._plugin_background[1],
+                        model._plugin_background[2],
                         "",
                         "",
                         "",
                     ];
         } else {
             return is_positive
-                ? this._pos_fg_color
+                ? model._pos_fg_color
                 : is_negative
-                  ? this._neg_fg_color
+                  ? model._neg_fg_color
                   : [
                         "",
-                        this._plugin_background[0],
-                        this._plugin_background[1],
-                        this._plugin_background[2],
+                        model._plugin_background[0],
+                        model._plugin_background[1],
+                        model._plugin_background[2],
                         "",
                         "",
                         "",
@@ -160,7 +160,7 @@ export function cell_style_numeric(
         td.style.color = "";
     } else if (plugin?.number_fg_mode === "disabled") {
         if (plugin?.number_bg_mode === "color") {
-            const source = this._plugin_background as [number, number, number];
+            const source = model._plugin_background as [number, number, number];
             const foreground = infer_foreground_from_background(
                 rgbaToRgb([bg_tuple[1], bg_tuple[2], bg_tuple[3], 1], source),
             );
@@ -173,13 +173,12 @@ export function cell_style_numeric(
     } else if (plugin?.number_fg_mode === "bar") {
         td.style.color = "";
         td.style.position = "relative";
-        if (
-            gradhex !== "" &&
-            td.children.length > 0 &&
-            td.children[0].nodeType === Node.ELEMENT_NODE
-        ) {
-            (td.children[0] as HTMLElement).style.background = gradhex;
-        }
+        td.style.setProperty("--psp-label-bar-color", gradhex);
+        td.style.setProperty("--psp-label-bar-bg", hex);
+    } else if (plugin?.number_fg_mode === "label-bar") {
+        td.style.color = "";
+        td.style.setProperty("--psp-label-bar-color", gradhex);
+        td.style.setProperty("--psp-label-bar-bg", hex);
     } else if (plugin?.number_fg_mode === "color" || !plugin?.number_fg_mode) {
         td.style.color = hex;
     }

package/src/ts/style_handlers/table_cell/row_header.ts

@@ -18,7 +18,7 @@ import type { DatagridModel } from "../../types.js";
 import { RegularTableElement } from "regular-table";
 
 export function cell_style_row_header(
-    this: DatagridModel,
+    model: DatagridModel,
     regularTable: RegularTableElement,
     td: HTMLElement,
     metadata: CellMetadataRowHeader,
@@ -28,7 +28,7 @@ export function cell_style_row_header(
         metadata.value !== null &&
         metadata.value?.toString()?.trim().length > 0;
     const is_leaf =
-        (metadata.row_header_x ?? 0) >= this._config.group_by.length;
+        (metadata.row_header_x ?? 0) >= model._config.group_by.length;
     const next = regularTable.getMeta({
         dx: 0,
         dy: (metadata.y ?? 0) - (metadata.y0 ?? 0) + 1,

package/src/ts/style_handlers/table_cell/string.ts

@@ -10,10 +10,13 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-import chroma from "chroma-js";
 import {
-    rgbaToRgb,
+    hslToRgb,
     infer_foreground_from_background,
+    parseColor,
+    rgbaToRgb,
+    rgbToHex,
+    rgbToHsl,
 } from "../../color_utils.js";
 import type { DatagridModel, ColumnConfig, ColorRecord } from "../../types.js";
 
@@ -28,17 +31,17 @@ interface PluginWithColor extends Omit<ColumnConfig, "color"> {
 }
 
 export function cell_style_string(
-    this: DatagridModel,
+    model: DatagridModel,
     plugin: PluginWithColor | undefined,
     td: HTMLElement,
     metadata: CellMetaWithExtras,
 ): void {
-    const column_name = metadata.column_header?.[this._config.split_by.length];
+    const column_name = metadata.column_header?.[model._config.split_by.length];
     const colorRecord: ColorRecord = (() => {
         if (plugin?.color !== undefined) {
             return plugin.color;
         } else {
-            return this._color;
+            return model._color;
         }
     })();
 
@@ -60,7 +63,7 @@ export function cell_style_string(
         plugin?.string_color_mode === "background" &&
         metadata.user !== null
     ) {
-        const source = this._plugin_background as [number, number, number];
+        const source = model._plugin_background as [number, number, number];
         const foreground = infer_foreground_from_background(
             rgbaToRgb([r, g, b, 1], source),
         );
@@ -71,25 +74,24 @@ export function cell_style_string(
         metadata.user !== null &&
         column_name
     ) {
-        if (!this._series_color_map.has(column_name)) {
-            this._series_color_map.set(column_name, new Map());
-            this._series_color_seed.set(column_name, 0);
+        if (!model._series_color_map.has(column_name)) {
+            model._series_color_map.set(column_name, new Map());
+            model._series_color_seed.set(column_name, 0);
         }
 
-        const series_map = this._series_color_map.get(column_name)!;
+        const series_map = model._series_color_map.get(column_name)!;
         if (metadata.user && !series_map.has(metadata.user)) {
-            const seed = this._series_color_seed.get(column_name) ?? 0;
+            const seed = model._series_color_seed.get(column_name) ?? 0;
             series_map.set(metadata.user, seed);
-            this._series_color_seed.set(column_name, seed + 1);
+            model._series_color_seed.set(column_name, seed + 1);
         }
 
         const color_seed = series_map.get(metadata.user!) ?? 0;
-        let [h, s, l] = chroma(hex).hsl();
-        h = h + ((color_seed * 150) % 360);
-        const color2 = chroma(h, s, l, "hsl");
-        const [r2, g2, b2] = color2.rgb();
-        const hex2 = color2.hex();
-        const source = this._plugin_background as [number, number, number];
+        const [h, s, l] = rgbToHsl(parseColor(hex));
+        const rotated = hslToRgb([h + ((color_seed * 150) % 360), s, l]);
+        const [r2, g2, b2] = rotated;
+        const hex2 = rgbToHex(rotated);
+        const source = model._plugin_background as [number, number, number];
         const foreground = infer_foreground_from_background(
             rgbaToRgb([r2, g2, b2, 1], source),
         );

package/src/ts/style_handlers/types.ts

@@ -10,13 +10,11 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-import { RegularTableElement } from "regular-table";
 import {
     CellMetadata,
     CellMetadataBody,
     CellMetadataRowHeader,
 } from "regular-table/dist/esm/types.js";
-import type { SelectedPosition } from "../types.js";
 
 export interface CollectedCell {
     element: HTMLElement;
@@ -31,11 +29,3 @@ export interface CollectedHeaderRow {
         metadata: CellMetadata | undefined;
     }>;
 }
-
-// Local types for selection maps - match the actual runtime usage
-// (activate.ts uses `as any` casts when passing these)
-export type LocalSelectedRowsMap = WeakMap<RegularTableElement, unknown[]>;
-export type LocalSelectedPositionMap = WeakMap<
-    RegularTableElement,
-    SelectedPosition
->;

package/src/ts/types.ts

@@ -19,8 +19,12 @@ import type {
     ViewWindow,
     ViewConfigUpdate,
 } from "@perspective-dev/client";
-import { RegularTableElement } from "regular-table";
-import { CellMetadata, DataResponse } from "regular-table/dist/esm/types";
+import type {
+    HTMLPerspectiveViewerElement,
+    ViewerConfig,
+} from "@perspective-dev/viewer";
+import type { RegularTableElement } from "regular-table";
+import type { CellMetadata, DataResponse } from "regular-table/dist/esm/types";
 
 // Re-export types from regular-table for use throughout the codebase
 export type { RegularTableElement as RegularTable };
@@ -46,7 +50,8 @@ export type EditMode =
     | "EDIT"
     | "SELECT_COLUMN"
     | "SELECT_ROW"
-    | "SELECT_REGION";
+    | "SELECT_REGION"
+    | "SELECT_ROW_TREE";
 
 // Color record for styling - tuple returned by make_color_record
 export type ColorRecord = [
@@ -162,10 +167,11 @@ export interface DatagridModel {
     _view: View;
     _table: Table;
     _table_schema: Schema;
-    _config: ViewConfig;
+    _config: ViewerConfig;
     _num_rows: number;
     _num_columns?: number;
     _schema: Schema;
+    _theme: string;
     _ids: unknown[][];
     _plugin_background: number[];
     _color: ColorRecord;
@@ -177,6 +183,8 @@ export interface DatagridModel {
     _column_types: ColumnType[];
     _is_editable: boolean[];
     _edit_mode: EditMode;
+    _tree_selection_id?: unknown[];
+    _last_insert_configs?: ViewConfigUpdate[];
     _selection_state: SelectionState;
     _row_header_types: ColumnType[];
     _series_color_map: Map<string, Map<string, number>>;
@@ -212,19 +220,6 @@ export type DataListener = (
 // Style listener function type
 export type StyleListener = () => void;
 
-// Perspective viewer element interface (subset)
-export interface PerspectiveViewerElement extends HTMLElement {
-    getView(): Promise<View>;
-    getTable(): Promise<Table>;
-    getEditPort(): Promise<number>;
-    restore(config: Partial<ViewConfig>): Promise<void>;
-    toggleColumnSettings(columnName?: string): Promise<void>;
-    hasAttribute(name: string): boolean;
-    setSelection(viewport?: ViewWindow): void;
-    dispatchEvent(event: Event): boolean;
-    children: HTMLCollectionOf<HTMLElement>;
-}
-
 // Toolbar element interface
 export interface DatagridToolbarElement extends HTMLElement {
     setEditButton(button: HTMLElement): void;
@@ -255,7 +250,7 @@ export interface PerspectiveClickDetail {
     config: Partial<ViewConfig>;
 }
 
-export { PerspectiveSelectDetail } from "@perspective-dev/viewer";
+export { PerspectiveSelectDetail } from "@perspective-dev/viewer/src/ts/extensions.js";
 
 // Mouse event with handled flag
 export interface HandledMouseEvent extends MouseEvent {
@@ -281,9 +276,22 @@ export interface DatagridPluginElement extends HTMLElement {
     _reset_column_size?: boolean;
 }
 
-// Map types for selected rows and positions
-export type SelectedRowsMap = WeakMap<RegularTableElement, Set<number>>;
+// Map types for selected positions
 export type SelectedPositionMap = WeakMap<
     RegularTableElement,
     SelectedPosition
 >;
+
+// Centralized editable mode check - used by style handlers and event handlers
+export function isEditableMode(
+    model: DatagridModel,
+    viewer: HTMLPerspectiveViewerElement,
+    allowed: boolean = false,
+): boolean {
+    const has_pivots =
+        model._config.group_by.length === 0 &&
+        model._config.split_by.length === 0;
+    const plugin = viewer.children[0] as DatagridPluginElement | undefined;
+    const editable = allowed || plugin?._edit_mode === "EDIT";
+    return has_pivots && editable;
+}

package/dist/esm/event_handlers/deselect_all.d.ts

@@ -1,5 +0,0 @@
-import { RegularTableElement } from "regular-table";
-import type { PerspectiveViewerElement } from "../types.js";
-type SelectedRowsMap = Map<RegularTableElement, unknown[]>;
-export declare function deselect_all_listener(regularTable: RegularTableElement, _viewer: PerspectiveViewerElement, selected_rows_map: SelectedRowsMap): Promise<void>;
-export {};

package/dist/esm/event_handlers/row_select_click.d.ts

@@ -1,4 +0,0 @@
-import { type RegularTable, type DatagridModel, type PerspectiveViewerElement, type HandledMouseEvent } from "../types.js";
-type SelectedRowsMap = Map<RegularTable, unknown[]>;
-export declare function selectionListener(this: DatagridModel, regularTable: RegularTable, viewer: PerspectiveViewerElement, selected_rows_map: SelectedRowsMap, event: HandledMouseEvent): Promise<void>;
-export {};

package/dist/esm/plugin/column_style_controls.d.ts

@@ -1,28 +0,0 @@
-import { ColumnType } from "@perspective-dev/client";
-import type { DatagridPluginElement } from "../types.js";
-interface NumberStyleOpts {
-    datagrid_number_style: {
-        fg_gradient: number;
-        pos_fg_color: string;
-        neg_fg_color: string;
-        number_fg_mode: string;
-        bg_gradient: number;
-        pos_bg_color: string;
-        neg_bg_color: string;
-        number_bg_mode: string;
-    };
-    number_string_format: boolean;
-}
-interface DatetimeStyleOpts {
-    datagrid_datetime_style?: {
-        color: string;
-        bg_color: string;
-    };
-    datagrid_string_style?: {
-        color: string;
-        bg_color: string;
-    };
-}
-export type ColumnStyleOpts = NumberStyleOpts | DatetimeStyleOpts | null;
-export default function column_style_opts(this: DatagridPluginElement, type: ColumnType, _group: string): ColumnStyleOpts;
-export {};

package/src/ts/event_handlers/row_select_click.ts

@@ -1,92 +0,0 @@
-// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
-// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
-// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
-// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
-// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
-// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
-// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
-// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
-// ┃ This file is part of the Perspective library, distributed under the terms ┃
-// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
-// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
-
-import getCellConfig from "../get_cell_config.js";
-import {
-    type RegularTable,
-    type DatagridModel,
-    type PerspectiveViewerElement,
-    type HandledMouseEvent,
-    PerspectiveSelectDetail,
-} from "../types.js";
-
-type SelectedRowsMap = Map<RegularTable, unknown[]>;
-
-export async function selectionListener(
-    this: DatagridModel,
-    regularTable: RegularTable,
-    viewer: PerspectiveViewerElement,
-    selected_rows_map: SelectedRowsMap,
-    event: HandledMouseEvent,
-): Promise<void> {
-    const meta = regularTable.getMeta(event.target as HTMLElement);
-    if (!viewer.hasAttribute("selectable")) return;
-    if (event.handled) return;
-    if (event.shiftKey) return;
-    if (event.button !== 0) {
-        return;
-    }
-
-    event.stopImmediatePropagation();
-
-    if (!meta) {
-        return;
-    }
-
-    if ((meta.type === "body" || meta.type === "row_header") && meta.y >= 0) {
-        const id = this._ids?.[meta.y - meta.y0];
-        const selected = selected_rows_map.get(regularTable);
-        const key_match =
-            !!selected &&
-            selected.reduce<boolean>((agg, x, i) => agg && x === id[i], true);
-
-        const is_deselect =
-            !!selected && id.length === selected.length && key_match;
-
-        const { row, column_names, config } = await getCellConfig(
-            this,
-            meta.y,
-            meta.type === "body" ? meta.x : 0,
-        );
-
-        let detail: PerspectiveSelectDetail;
-        if (is_deselect) {
-            selected_rows_map.delete(regularTable);
-            detail = new PerspectiveSelectDetail(
-                false,
-                row,
-                [],
-                [],
-                [{ filter: structuredClone(this._config.filter) }],
-            );
-        } else {
-            selected_rows_map.set(regularTable, id);
-            detail = new PerspectiveSelectDetail(
-                true,
-                row,
-                column_names,
-                [],
-                [config],
-            );
-        }
-
-        await regularTable.draw({ preserve_width: true });
-        event.handled = true;
-        viewer.dispatchEvent(
-            new CustomEvent<PerspectiveSelectDetail>("perspective-select", {
-                bubbles: true,
-                composed: true,
-                detail,
-            }),
-        );
-    }
-}