@perspective-dev/viewer-datagrid 4.1.1 → 4.2.0

package/dist/esm/style_handlers/body.d.ts

@@ -1,5 +1,5 @@
 import { RegularTableElement } from "regular-table";
-import type { DatagridModel, PerspectiveViewerElement, ColumnsConfig } from "../types.js";
+import { type DatagridModel, type PerspectiveViewerElement, type ColumnsConfig } from "../types.js";
 import { CollectedCell, LocalSelectedPositionMap, LocalSelectedRowsMap } from "./types.js";
 /**
  * Apply styles to all body cells in a single pass.

package/dist/esm/style_handlers/column_header.d.ts

@@ -1,5 +1,5 @@
 import { RegularTableElement } from "regular-table";
-import type { DatagridModel, PerspectiveViewerElement } from "../types.js";
+import { type DatagridModel, type PerspectiveViewerElement } from "../types.js";
 import { CollectedHeaderRow } from "./types.js";
 /**
  * Apply selected column styling in response to column settings toggle events.

package/dist/esm/style_handlers/consolidated.d.ts

@@ -1,12 +1,9 @@
 import { RegularTableElement } from "regular-table";
-import { CellMetadata } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, PerspectiveViewerElement, ColumnsConfig, DatagridPluginElement, SelectedPosition } from "../types.js";
-interface CellMetaExtended extends CellMetadata {
-    _is_hidden_by_aggregate_depth?: boolean;
-}
+import { CellMetadata } from "regular-table/dist/esm/types.js";
 interface CollectedCell {
     element: HTMLElement;
-    metadata: CellMetaExtended;
+    metadata: CellMetadata;
     isHeader: boolean;
 }
 interface CollectedHeaderRow {

package/dist/esm/style_handlers/table_cell/boolean.d.ts

@@ -1,7 +1,3 @@
 import { CellMetadata } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, ColumnConfig } from "../../types.js";
-interface CellMetaWithFlags extends CellMetadata {
-    _is_hidden_by_aggregate_depth?: boolean;
-}
-export declare function cell_style_boolean(this: DatagridModel, _plugin: ColumnConfig | undefined, td: HTMLElement, metadata: CellMetaWithFlags): void;
-export {};
+export declare function cell_style_boolean(this: DatagridModel, _plugin: ColumnConfig | undefined, td: HTMLElement, metadata: CellMetadata): void;

package/dist/esm/style_handlers/table_cell/cell_flash.d.ts

@@ -1,3 +1,3 @@
-import { CellMetadata } from "regular-table/dist/esm/types.js";
+import { CellMetadataBody } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, ColorRecord } from "../../types.js";
-export declare function style_cell_flash(this: DatagridModel, metadata: CellMetadata, td: HTMLElement, [, , , , , pos_s, pos_e]: ColorRecord, [, , , , , neg_s, neg_e]: ColorRecord, is_settings_open: boolean): void;
+export declare function style_cell_flash(this: DatagridModel, metadata: CellMetadataBody, td: HTMLElement, [, , , , , pos_s, pos_e]: ColorRecord, [, , , , , neg_s, neg_e]: ColorRecord, is_settings_open: boolean): void;

package/dist/esm/style_handlers/table_cell/datetime.d.ts

@@ -1,7 +1,3 @@
 import { CellMetadata } from "regular-table/dist/esm/types.js";
 import type { DatagridModel, ColumnConfig } from "../../types.js";
-interface CellMetaWithFlags extends CellMetadata {
-    _is_hidden_by_aggregate_depth?: boolean;
-}
-export declare function cell_style_datetime(this: DatagridModel, plugin: ColumnConfig, td: HTMLElement, metadata: CellMetaWithFlags): void;
-export {};
+export declare function cell_style_datetime(this: DatagridModel, plugin: ColumnConfig, td: HTMLElement, metadata: CellMetadata): void;

package/dist/esm/style_handlers/table_cell/row_header.d.ts

@@ -1,4 +1,4 @@
-import { CellMetadata } from "regular-table/dist/esm/types.js";
+import { CellMetadataRowHeader } from "regular-table/dist/esm/types.js";
 import type { DatagridModel } from "../../types.js";
 import { RegularTableElement } from "regular-table";
-export declare function cell_style_row_header(this: DatagridModel, regularTable: RegularTableElement, td: HTMLElement, metadata: CellMetadata): void;
+export declare function cell_style_row_header(this: DatagridModel, regularTable: RegularTableElement, td: HTMLElement, metadata: CellMetadataRowHeader): void;

package/dist/esm/style_handlers/types.d.ts

@@ -1,12 +1,9 @@
 import { RegularTableElement } from "regular-table";
-import { CellMetadata } from "regular-table/dist/esm/types.js";
+import { CellMetadata, CellMetadataBody, CellMetadataRowHeader } from "regular-table/dist/esm/types.js";
 import type { SelectedPosition } from "../types.js";
-export interface CellMetaExtended extends CellMetadata {
-    _is_hidden_by_aggregate_depth?: boolean;
-}
 export interface CollectedCell {
     element: HTMLElement;
-    metadata: CellMetaExtended;
+    metadata: CellMetadataRowHeader | CellMetadataBody;
     isHeader: boolean;
 }
 export interface CollectedHeaderRow {

package/dist/esm/types.d.ts

@@ -2,7 +2,7 @@ import type { View, Table, ViewConfig, ColumnType, SortDir, ViewWindow } from "@
 import { RegularTableElement } from "regular-table";
 import { CellMetadata, DataResponse } from "regular-table/dist/esm/types";
 export type { RegularTableElement as RegularTable };
-export type { CellMetadata as CellMeta };
+export declare function get_psp_type(model: DatagridModel, metadata: CellMetadata): ColumnType;
 export type EditMode = "READ_ONLY" | "EDIT" | "SELECT_COLUMN" | "SELECT_ROW" | "SELECT_REGION";
 export type ColorRecord = [
     string,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perspective-dev/viewer-datagrid",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "Perspective datagrid plugin based on `regular-table`",
   "unpkg": "dist/cdn/perspective-viewer-datagrid.js",
   "jsdelivr": "dist/cdn/perspective-viewer-datagrid.js",
@@ -32,10 +32,10 @@
     "@perspective-dev/client": "",
     "@perspective-dev/viewer": "",
     "chroma-js": ">=3 <4",
-    "regular-table": "=0.8.0"
+    "regular-table": "=0.8.1"
   },
   "devDependencies": {
-    "@prospective.co/procss": "0.1.17",
+    "@prospective.co/procss": "0.1.18",
     "@perspective-dev/esbuild-plugin": "",
     "@perspective-dev/test": "",
     "@types/chroma-js": "^3.1.2",

package/src/ts/color_utils.ts

@@ -57,7 +57,6 @@ export function make_color_record(color: string): ColorRecord {
     const chroma_neg = chroma(color);
     const _neg_grad = make_gradient(chroma_neg);
     const rgb = chroma_neg.rgb();
-
     return [
         color,
         rgb[0],

package/src/ts/event_handlers/click/edit_click.ts

@@ -10,10 +10,12 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-import type {
-    RegularTable,
-    DatagridModel,
-    PerspectiveViewerElement,
+import { CellMetadataBody } from "regular-table/dist/esm/types.js";
+import {
+    type RegularTable,
+    type DatagridModel,
+    type PerspectiveViewerElement,
+    get_psp_type,
 } from "../../types.js";
 
 export function write_cell(
@@ -21,13 +23,13 @@ export function write_cell(
     model: DatagridModel,
     active_cell: HTMLElement,
 ): boolean {
-    const meta = table.getMeta(active_cell);
+    const meta = table.getMeta(active_cell) as CellMetadataBody;
     if (!meta) {
         return false;
     }
-    const type = model._schema[model._column_paths[meta.x]];
+    const type = model._schema[model._column_paths[meta.x!]];
     let text: string | number | boolean | null = active_cell.textContent || "";
-    const id = model._ids[meta.y - meta.y0][0];
+    const id = model._ids[meta.y! - meta.y0][0];
     if (type === "float" || type === "integer") {
         const parsed = parseFloat(text.replace(/,/g, ""));
         if (isNaN(parsed)) {
@@ -59,13 +61,14 @@ export function clickListener(
     _viewer: PerspectiveViewerElement,
     event: MouseEvent,
 ): void {
-    const meta = table.getMeta(event.target as Element);
-    if (typeof meta?.x !== "undefined") {
+    const meta = table.getMeta(event.target as HTMLElement);
+    if (meta?.type === "body" || meta?.type === "column_header") {
         const is_editable2 = this._is_editable[meta.x];
-        const is_bool = this.get_psp_type(meta) === "boolean";
+        const is_bool = get_psp_type(this, meta) === "boolean";
         const is_null = (event.target as Element).classList.contains(
             "psp-null",
         );
+
         if (is_editable2 && is_bool && !is_null) {
             write_cell(table, this, event.target as HTMLElement);
         }

package/src/ts/event_handlers/dispatch_click.ts

@@ -24,12 +24,10 @@ export async function dispatch_click_listener(
     viewer: PerspectiveViewerElement,
     event: MouseEvent,
 ): Promise<void> {
-    const meta = table.getMeta(event.target as Element);
-    if (!meta) return;
+    const meta = table.getMeta(event.target as HTMLElement);
+    if (!meta || meta.type !== "body") return;
     const { x, y } = meta;
-
     const { row, column_names, config } = await getCellConfig(this, y, x);
-
     viewer.dispatchEvent(
         new CustomEvent<PerspectiveClickDetail>("perspective-click", {
             bubbles: true,

package/src/ts/event_handlers/expand_collapse.ts

@@ -17,12 +17,12 @@ export async function expandCollapseHandler(
     regularTable: RegularTable,
     event: MouseEvent,
 ): Promise<void> {
-    const meta = regularTable.getMeta(event.target as Element);
-    if (!meta?.row_header) return;
-
+    const meta = regularTable.getMeta(event.target as HTMLElement);
+    if (!meta || meta.type !== "row_header") return;
     const is_collapse = (event.target as Element).classList.contains(
         "psp-tree-label-collapse",
     );
+
     if (event.shiftKey && is_collapse) {
         this._view.set_depth(
             (meta.row_header as unknown[]).filter((x) => x !== undefined)
@@ -38,6 +38,7 @@ export async function expandCollapseHandler(
     } else {
         this._view.expand(meta.y);
     }
+
     this._num_rows = await this._view.num_rows();
     this._num_columns = await this._view.num_columns();
     regularTable.draw();

package/src/ts/event_handlers/focus.ts

@@ -52,7 +52,7 @@ export function focusinListener(
 ): void {
     const target = event.target as HTMLElement;
     const meta = table.getMeta(target);
-    if (meta) {
+    if (meta?.type === "body") {
         const new_state: SelectedPosition = {
             x: meta.x,
             y: meta.y,

package/src/ts/event_handlers/header_click.ts

@@ -50,7 +50,7 @@ export async function mousedown_listener(
     if (target.classList.contains("psp-menu-enabled")) {
         const meta = regularTable.getMeta(target);
         const column_name = meta?.column_header?.[this._config.split_by.length];
-        await viewer.toggleColumnSettings(column_name);
+        await viewer.toggleColumnSettings(`${column_name}`);
     } else if (target.classList.contains("psp-sort-enabled")) {
         sortHandler.call(this, regularTable, viewer, event, target);
     }

package/src/ts/event_handlers/keydown/edit_keydown.ts

@@ -76,7 +76,7 @@ const moveSelection = lock(async function (
     dy: number,
 ): Promise<void> {
     const meta = table.getMeta(active_cell);
-    if (!meta) return;
+    if (!meta || meta.type !== "body") return;
     const num_columns = this._column_paths.length;
     const num_rows = this._num_rows;
     const selected_position = selected_position_map.get(table);
@@ -118,7 +118,7 @@ function isLastCell(
     target: HTMLElement,
 ): boolean {
     const meta = table.getMeta(target);
-    return meta !== undefined && meta.y === model._num_rows - 1;
+    return meta?.type === "body" && meta.y === model._num_rows - 1;
 }
 
 export function keydownListener(

package/src/ts/event_handlers/row_select_click.ts

@@ -28,21 +28,22 @@ export async function selectionListener(
     selected_rows_map: SelectedRowsMap,
     event: HandledMouseEvent,
 ): Promise<void> {
-    const meta = regularTable.getMeta(event.target as Element);
+    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;
     }
 
-    const id = this._ids?.[meta.y - meta.y0];
-    if (meta && meta.y >= 0) {
+    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 &&
@@ -56,10 +57,11 @@ export async function selectionListener(
             row: {},
             config: { filter: [] },
         };
+
         const { row, column_names, config } = await getCellConfig(
             this,
             meta.y,
-            meta.x,
+            meta.type === "body" ? meta.x : 0,
         );
 
         if (is_deselect) {

package/src/ts/event_handlers/select_region.ts

@@ -75,8 +75,12 @@ const getMousedownListener =
                 datagrid.model!._edit_mode === "SELECT_COLUMN")
         ) {
             datagrid.model!._selection_state.CURRENT_MOUSEDOWN_COORDINATES = {};
-            const meta = table.getMeta(mouseEvent.target as Element);
-            if (meta && meta.x !== undefined && meta.y !== undefined) {
+            const meta = table.getMeta(mouseEvent.target as HTMLElement);
+            if (
+                meta?.type === "body" &&
+                meta.x !== undefined &&
+                meta.y !== undefined
+            ) {
                 datagrid.model!._selection_state.CURRENT_MOUSEDOWN_COORDINATES =
                     {
                         x: meta.x,
@@ -129,8 +133,12 @@ const getMouseoverListener =
                 datagrid.model!._selection_state.CURRENT_MOUSEDOWN_COORDINATES
                     .x !== undefined
             ) {
-                const meta = table.getMeta(mouseEvent.target as Element);
-                if (meta && meta.x !== undefined && meta.y !== undefined) {
+                const meta = table.getMeta(mouseEvent.target as HTMLElement);
+                if (
+                    meta?.type === "body" &&
+                    meta.x !== undefined &&
+                    meta.y !== undefined
+                ) {
                     const potentialSelection: SelectionArea = {
                         x0: Math.min(
                             meta.x,
@@ -183,7 +191,7 @@ const getMouseupListener =
             datagrid.model!._edit_mode === "SELECT_ROW" ||
             datagrid.model!._edit_mode === "SELECT_COLUMN"
         ) {
-            const meta = table.getMeta(mouseEvent.target as Element);
+            const meta = table.getMeta(mouseEvent.target as HTMLElement);
             if (!meta) return;
 
             if (
@@ -195,6 +203,7 @@ const getMouseupListener =
                 if (
                     selected.x0 === selected.x1 &&
                     selected.y0 === selected.y1 &&
+                    meta?.type === "body" &&
                     selected.x0 === meta.x &&
                     selected.y0 === meta.y
                 ) {
@@ -216,6 +225,7 @@ const getMouseupListener =
                     .CURRENT_MOUSEDOWN_COORDINATES &&
                 datagrid.model!._selection_state.CURRENT_MOUSEDOWN_COORDINATES
                     .x !== undefined &&
+                meta?.type === "body" &&
                 meta.x !== undefined &&
                 meta.y !== undefined
             ) {
@@ -338,8 +348,8 @@ const applyMouseAreaSelection = (
         const tds = table.querySelectorAll("tbody td");
 
         for (const td of tds) {
-            const meta = table.getMeta(td);
-            if (!meta) continue;
+            const meta = table.getMeta(td as HTMLElement);
+            if (!meta || meta.type !== "body") continue;
             let rendered = false;
             for (const { x0, x1, y0, y1 } of selected) {
                 if (
@@ -372,7 +382,7 @@ const applyMouseAreaSelection = (
         const tds = table.querySelectorAll("tbody td");
 
         for (const td of tds) {
-            const meta = table.getMeta(td);
+            const meta = table.getMeta(td as HTMLElement);
             if (!meta) continue;
             let rendered = false;
             for (const { x0, x1, y0, y1 } of selected) {
@@ -380,7 +390,8 @@ const applyMouseAreaSelection = (
                     x0 !== undefined &&
                     y0 !== undefined &&
                     x1 !== undefined &&
-                    y1 !== undefined
+                    y1 !== undefined &&
+                    meta?.type === "body"
                 ) {
                     if (y0 <= meta.y && meta.y <= y1) {
                         datagrid.model!._selection_state.dirty = true;
@@ -401,7 +412,7 @@ const applyMouseAreaSelection = (
         const tds = table.querySelectorAll("tbody td");
 
         for (const td of tds) {
-            const meta = table.getMeta(td);
+            const meta = table.getMeta(td as HTMLElement);
             if (!meta) continue;
             let rendered = false;
             for (const { x0, x1, y0, y1 } of selected) {
@@ -409,7 +420,8 @@ const applyMouseAreaSelection = (
                     x0 !== undefined &&
                     y0 !== undefined &&
                     x1 !== undefined &&
-                    y1 !== undefined
+                    y1 !== undefined &&
+                    meta?.type === "body"
                 ) {
                     if (x0 <= meta.x && meta.x <= x1) {
                         datagrid.model!._selection_state.dirty = true;

package/src/ts/event_handlers/sort.ts

@@ -55,7 +55,7 @@ export async function sortHandler(
             : override_sort;
 
     const abs = event.shiftKey;
-    const sort = sort_method.call(this, column_name, abs);
+    const sort = sort_method.call(this, `${column_name}`, abs);
     await viewer.restore({ sort });
 }
 

package/src/ts/get_cell_config.ts

@@ -49,6 +49,7 @@ export default async function getCellConfig(
         column_names: [],
         config: { filter: [] },
     };
+
     let column_filters: Filter[] = [];
     if (column_paths) {
         const split_by_values = column_paths.split("|");

package/src/ts/model/create.ts

@@ -19,16 +19,17 @@ import type {
     View,
     ViewConfig,
 } from "@perspective-dev/client";
-import type {
-    DatagridModel,
-    DatagridPluginElement,
-    RegularTable,
-    Schema,
-    CellMeta,
-    ElemFactory,
-    EditMode,
-    PerspectiveViewerElement,
+import {
+    type DatagridModel,
+    type DatagridPluginElement,
+    type RegularTable,
+    type Schema,
+    type ElemFactory,
+    type EditMode,
+    type PerspectiveViewerElement,
+    get_psp_type,
 } from "../types.js";
+import { CellMetadata } from "regular-table/dist/esm/types.js";
 
 function get_rule(regular: HTMLElement, tag: string, def: string): string {
     const color = window.getComputedStyle(regular).getPropertyValue(tag).trim();
@@ -64,14 +65,6 @@ class ElemFactoryImpl implements ElemFactory {
     }
 }
 
-function get_psp_type(this: DatagridModel, metadata: CellMeta): ColumnType {
-    if (metadata.x !== undefined && metadata.x >= 0) {
-        return this._column_types[metadata.x];
-    } else {
-        return this._row_header_types[metadata.row_header_x! - 1];
-    }
-}
-
 export async function createModel(
     this: DatagridPluginElement,
     regular: RegularTable,
@@ -222,7 +215,7 @@ export async function createModel(
         }),
         _series_color_map: new Map<string, string>(),
         _series_color_seed: new Map<string, number>(),
-        get_psp_type,
+        // get_psp_type,
         _div_factory: extend._div_factory || new ElemFactoryImpl("div"),
     }) as DatagridModel;
 

package/src/ts/style_handlers/body.ts

@@ -12,11 +12,12 @@
 
 import { RegularTableElement } from "regular-table";
 
-import type {
-    DatagridModel,
-    PerspectiveViewerElement,
-    ColumnsConfig,
-    DatagridPluginElement,
+import {
+    type DatagridModel,
+    type PerspectiveViewerElement,
+    type ColumnsConfig,
+    type DatagridPluginElement,
+    get_psp_type,
 } from "../types.js";
 
 import { cell_style_numeric } from "./table_cell/numeric.js";
@@ -28,20 +29,7 @@ import {
     CollectedCell,
     LocalSelectedPositionMap,
     LocalSelectedRowsMap,
-    CellMetaExtended,
 } from "./types.js";
-import { ColumnType } from "@perspective-dev/client";
-
-function get_psp_type(
-    model: DatagridModel,
-    metadata: CellMetaExtended,
-): ColumnType {
-    if (metadata.x !== undefined && metadata.x >= 0) {
-        return model._column_types[metadata.x];
-    } else {
-        return model._row_header_types[(metadata.row_header_x ?? 0) - 1];
-    }
-}
 
 /**
  * Apply styles to all body cells in a single pass.
@@ -71,6 +59,7 @@ export function applyBodyCellStyles(
         const is_numeric = type === "integer" || type === "float";
 
         // Calculate aggregate depth visibility
+        // @ts-ignore
         metadata._is_hidden_by_aggregate_depth = ((x?: number) =>
             x === 0 || x === undefined
                 ? false
@@ -109,6 +98,7 @@ export function applyBodyCellStyles(
             "psp-bool-type",
             type === "boolean" && metadata.user !== null,
         );
+
         td.classList.toggle("psp-null", metadata.value === null);
         td.classList.toggle("psp-align-right", !isHeader && is_numeric);
         td.classList.toggle("psp-align-left", isHeader || !is_numeric);
@@ -138,14 +128,18 @@ export function applyBodyCellStyles(
         }
 
         if (
-            metadata.row_header_x === undefined ||
+            metadata.type !== "row_header" ||
             metadata.row_header_x ===
                 (metadata.row_header as unknown[]).length - 1 ||
             (metadata.row_header as unknown[])[metadata.row_header_x + 1] ===
                 undefined
         ) {
             td.dataset.y = String(metadata.y);
-            td.dataset.x = String(metadata.x);
+            if (metadata.type !== "row_header") {
+                td.dataset.x = String(metadata.x);
+            } else {
+                delete td.dataset.x;
+            }
         } else {
             delete td.dataset.y;
             delete td.dataset.x;
@@ -166,6 +160,7 @@ export function applyBodyCellStyles(
                 const selectedArr = selected as unknown[];
                 if (isHeader) {
                     if (
+                        metadata.type === "row_header" &&
                         metadata.row_header_x !== undefined &&
                         !!id[metadata.row_header_x]
                     ) {
@@ -195,7 +190,7 @@ export function applyBodyCellStyles(
         }
 
         // Apply editable styling (if editable)
-        if (!isHeader && metadata.x !== undefined) {
+        if (!isHeader && metadata.type === "body") {
             if (isEditable && this._is_editable[metadata.x]) {
                 const col_name =
                     metadata.column_header?.[this._config.split_by.length];

package/src/ts/style_handlers/column_header.ts

@@ -11,7 +11,11 @@
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
 import { RegularTableElement } from "regular-table";
-import type { DatagridModel, PerspectiveViewerElement } from "../types.js";
+import {
+    get_psp_type,
+    type DatagridModel,
+    type PerspectiveViewerElement,
+} from "../types.js";
 import { CollectedHeaderRow } from "./types.js";
 
 /**
@@ -97,12 +101,19 @@ export function styleColumnHeaderRow(
     const selectedColumn = this._column_settings_selected_column;
 
     for (const { element: td, metadata } of headerRow.cells) {
-        if (!metadata) continue;
+        if (
+            !metadata ||
+            metadata.type === "body" ||
+            metadata.type === "row_header"
+        )
+            continue;
 
         const column_name =
             metadata.column_header?.[this._config.split_by.length];
         const sort = this._config.sort.find((x) => x[0] === column_name);
-        let needs_border = metadata.row_header_x === header_depth;
+        let needs_border =
+            metadata.type === "corner" &&
+            metadata.row_header_x === header_depth;
         const is_corner = typeof metadata.x === "undefined";
         needs_border =
             needs_border ||
@@ -147,7 +158,7 @@ export function styleColumnHeaderRow(
             !is_menu_row && !!sort && sort[1] === "col desc abs",
         );
 
-        const type = this.get_psp_type(metadata);
+        const type = get_psp_type(this, metadata);
         const is_numeric = type === "integer" || type === "float";
         const is_string = type === "string";
         const is_date = type === "date";

package/src/ts/style_handlers/consolidated.ts

@@ -11,8 +11,6 @@
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
 import { RegularTableElement } from "regular-table";
-import { CellMetadata } from "regular-table/dist/esm/types.js";
-import { ColumnType } from "@perspective-dev/client";
 import { PRIVATE_PLUGIN_SYMBOL } from "../model/index.js";
 import type {
     DatagridModel,
@@ -27,14 +25,11 @@ import { styleColumnHeaderRow } from "./column_header.js";
 import { applyColumnHeaderStyles } from "./editable.js";
 import { applyGroupHeaderStyles } from "./group_header.js";
 import { applyBodyCellStyles } from "./body.js";
-
-interface CellMetaExtended extends CellMetadata {
-    _is_hidden_by_aggregate_depth?: boolean;
-}
+import { CellMetadata } from "regular-table/dist/esm/types.js";
 
 interface CollectedCell {
     element: HTMLElement;
-    metadata: CellMetaExtended;
+    metadata: CellMetadata;
     isHeader: boolean;
 }
 
@@ -118,9 +113,9 @@ export function createConsolidatedStyleListener(
         if (tbody) {
             for (const tr of tbody.children) {
                 for (const cell of tr.children) {
-                    const metadata = regularTable.getMeta(cell) as
-                        | CellMetaExtended
-                        | undefined;
+                    const metadata = regularTable.getMeta(
+                        cell as HTMLElement,
+                    ) as CellMetadata | undefined;
 
                     if (metadata) {
                         const isHeader = cell.tagName === "TH";
@@ -144,9 +139,9 @@ export function createConsolidatedStyleListener(
                 };
 
                 for (const cell of tr.children) {
-                    const metadata = regularTable.getMeta(cell) as
-                        | CellMetadata
-                        | undefined;
+                    const metadata = regularTable.getMeta(
+                        cell as HTMLElement,
+                    ) as CellMetadata | undefined;
 
                     rowData.cells.push({
                         element: cell as HTMLTableCellElement,