argus-table 0.0.0-stage → 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Joessst-Dev and Argus Table contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,67 @@
-# Temporary Holding Version
+# argus-table
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+`<argus-table>` is a data table web component built with Lit and TanStack. It works in any framework, or none.
+
+- **Virtualized rows:** 100,000 rows scroll smoothly, and the DOM stays the same size.
+- **Pinned columns** at the start or end, which mirror in right-to-left layouts.
+- **Sorting and resizing:** by mouse or keyboard, controlled or uncontrolled.
+- **Accessible:** the WAI-ARIA grid pattern, with one tab stop and arrow-key navigation.
+- **Plain CSS styling:** `--argus-*` tokens and `::part()` names. Cell content is light DOM, so your own CSS and components work inside cells.
+
+**[Docs and live examples](https://joessst-dev.github.io/argus-table/)** · [GitHub](https://github.com/Joessst-Dev/argus-table)
+
+## Install
+
+```bash
+npm i argus-table @argus-table/themes
+```
+
+## A first table
+
+```html
+<argus-table id="orders" aria-label="Orders" style="height: 400px"></argus-table>
+
+<script type="module">
+  import 'argus-table';
+  import '@argus-table/themes/default.css';
+
+  const table = document.querySelector('#orders');
+  table.columns = [
+    { id: 'id', header: 'Order', accessor: 'id', width: 90, pin: 'start' },
+    {
+      id: 'customer',
+      header: 'Customer',
+      accessor: 'customer.name',
+      width: { flex: 1 },
+      sortable: true,
+    },
+    { id: 'total', header: 'Total', accessor: 'total', width: 110, align: 'end', sortable: true },
+  ];
+  table.data = await (await fetch('/api/orders')).json();
+  table.getRowId = (order) => order.id;
+  table.addEventListener('argus-row-click', (e) => console.log(e.detail.row));
+</script>
+```
+
+- **Height:** the table virtualizes its rows, so it needs a bounded height. Its default is 400 px.
+- **Label:** give it a name with `aria-label` or `aria-labelledby`.
+- **Columns and data** are JavaScript properties, because they hold objects and functions.
+- **Cells:** a column's `cell` function can return a string, a number, a DOM node or a Lit template.
+
+## Without a bundler
+
+The CDN build has every dependency bundled:
+
+```html
+<script
+  type="module"
+  src="https://cdn.jsdelivr.net/npm/argus-table/dist/cdn/argus-table.js"
+></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@argus-table/themes/dist/default.css" />
+```
+
+## Status
+
+This is v0.1, an early release. Names can still change before 1.0. Infinite loading, pinned rows, auto column widths, column reordering and framework wrappers come in v0.2. See the [roadmap](https://github.com/Joessst-Dev/argus-table/blob/main/docs/plan/plan/12-roadmap.md).
+
+MIT licensed.

package/dist/_virtual/_@oxc-project_runtime@0.156.0/helpers/esm/decorate.js

@@ -0,0 +1,8 @@
+// \0@oxc-project+runtime@0.156.0/helpers/esm/decorate.js
+function __decorate(decorators, target, key, desc) {
+	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+	return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+export { __decorate as default };

package/dist/argus-table.js

@@ -0,0 +1,492 @@
+import { controllable } from "./core/src/state/controllable.js";
+import { startResizeDrag } from "./controllers/resize-drag.js";
+import { TableController } from "./controllers/table-controller.js";
+import { VirtualController } from "./controllers/virtual-controller.js";
+import { CELL_CLICK, COLUMN_RESIZE, RANGE_CHANGE, ROW_CLICK, SORT_CHANGE, fire } from "./events.js";
+import { renderBody } from "./render/body.js";
+import { renderLightDom } from "./render/cells.js";
+import { renderHeader } from "./render/header.js";
+import { baseStyles } from "./styles/base.js";
+import __decorate from "./_virtual/_@oxc-project_runtime@0.156.0/helpers/esm/decorate.js";
+import { LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { styleMap } from "lit/directives/style-map.js";
+// src/argus-table.ts
+/**
+* The host carries the grid role, so rows rendered in the shadow root become
+* its children in the accessibility tree. ElementInternals sets the default;
+* `connectedCallback` also adds a `role` attribute, because tools such as
+* axe-core can't see the ElementInternals role. A `role` the page sets wins.
+*/
+function attachGridInternals(host) {
+	const internals = host.attachInternals();
+	internals.role = "grid";
+	return internals;
+}
+/**
+* The sortable column a header click came from, if any. Works for slotted content
+* too. Clicks on a resize handle never sort, so a click that ends a drag doesn't.
+*/
+function sortColumnOf(event) {
+	for (const target of event.composedPath()) {
+		if (!(target instanceof HTMLElement)) continue;
+		if (target.dataset.resizeCol !== void 0) return void 0;
+		if (target.dataset.sortCol !== void 0) return target.dataset.sortCol;
+		if (target.getAttribute("part") === "header-row") return void 0;
+	}
+}
+var RESIZE_STEP = 10;
+/** The grid cell or column header an element is, if any. */
+function gridCell(target) {
+	if (!(target instanceof HTMLElement) || target.dataset.col === void 0) return void 0;
+	const role = target.getAttribute("role");
+	return role === "gridcell" || role === "columnheader" ? target : void 0;
+}
+/** Row index of a rendered row element (`aria-rowindex` minus the header); `-1` for the header. */
+function rowIndexOf(row) {
+	return Number(row?.getAttribute("aria-rowindex") ?? 1) - 2;
+}
+/** CSS grid track for a column: fixed px, or a flex share with the min width as floor. */
+function track(column) {
+	return column.flex === void 0 ? `${String(column.width)}px` : `minmax(${String(column.minWidth)}px, ${String(column.flex)}fr)`;
+}
+var ArgusTable = class ArgusTable extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.columns = [];
+		this.data = [];
+		this.density = "comfortable";
+		this.overscan = 6;
+		this.#sorting = controllable([]);
+		this.#sizing = controllable({});
+		this.#internals = attachGridInternals(this);
+		this.#table = new TableController();
+		this.#virtual = new VirtualController(this, () => this.renderRoot.querySelector("[part~=\"table\"]"));
+		this.#rowPx = 40;
+		this.#window = {
+			rows: [],
+			totalSize: 0,
+			range: null
+		};
+		this.#focusPending = false;
+		this.#lastRange = "";
+		this.#headerHandlers = {
+			click: (event) => {
+				const id = sortColumnOf(event);
+				if (id !== void 0) this.#requestSort(id);
+			},
+			pointerdown: (event) => {
+				if (event.button !== 0) return;
+				const handle = event.composedPath()[0];
+				if (!(handle instanceof HTMLElement)) return;
+				const id = handle.dataset.resizeCol;
+				const cell = handle.parentElement;
+				if (id === void 0 || !cell) return;
+				startResizeDrag(handle, event, cell.getBoundingClientRect().width, this.#direction(), (w) => {
+					this.#requestResize(id, w);
+				});
+			}
+		};
+		this.#onKeydown = (event) => {
+			const cell = gridCell(event.composedPath()[0] ?? event.target ?? this);
+			const id = cell?.dataset.col;
+			if (!cell || id === void 0) return;
+			if (event.key === "Tab" && event.shiftKey) {
+				const scroller = event.currentTarget;
+				scroller.tabIndex = -1;
+				cell.addEventListener("focusout", () => {
+					scroller.removeAttribute("tabindex");
+				}, { once: true });
+				return;
+			}
+			const inHeader = cell.getAttribute("role") === "columnheader";
+			const { key } = event;
+			if (inHeader && event.altKey && (key === "ArrowLeft" || key === "ArrowRight")) {
+				event.preventDefault();
+				const towardEnd = key === "ArrowRight" === (this.#direction() === 1);
+				this.#requestResize(id, this.#currentWidth(id, cell) + (towardEnd ? RESIZE_STEP : -10));
+				return;
+			}
+			if (inHeader && (key === "Enter" || key === " ") && cell.dataset.sortCol !== void 0) {
+				event.preventDefault();
+				this.#requestSort(id);
+				return;
+			}
+			if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return;
+			if (!inHeader && key === "Enter") {
+				event.preventDefault();
+				this.#activate(event.composedPath());
+				return;
+			}
+			const model = this.#table.model;
+			const columns = model.columns;
+			let row = inHeader ? -1 : rowIndexOf(cell.parentElement);
+			let col = columns.findIndex((c) => c.id === id);
+			switch (key) {
+				case "ArrowDown":
+					row = Math.min(row + 1, model.rowCount - 1);
+					break;
+				case "ArrowUp":
+					row = Math.max(row - 1, -1);
+					break;
+				case "ArrowRight":
+					col += this.#direction();
+					break;
+				case "ArrowLeft":
+					col -= this.#direction();
+					break;
+				case "Home":
+					col = 0;
+					break;
+				case "End":
+					col = columns.length - 1;
+					break;
+				default: return;
+			}
+			event.preventDefault();
+			const target = columns[Math.min(Math.max(col, 0), columns.length - 1)];
+			if (target) this.#moveTo(row, target.id, model);
+		};
+		this.#onFocusin = (event) => {
+			const scroller = event.currentTarget;
+			if (event.composedPath()[0] === scroller) {
+				const from = event.relatedTarget;
+				if (!(from instanceof Node && scroller.contains(from))) {
+					this.#focusPending = true;
+					this.requestUpdate();
+				}
+				return;
+			}
+			for (const target of event.composedPath()) {
+				const cell = gridCell(target);
+				if (cell?.dataset.col !== void 0) {
+					const index = cell.getAttribute("role") === "columnheader" ? -1 : rowIndexOf(cell.parentElement);
+					const { col } = cell.dataset;
+					if (index !== this.#active?.index || col !== this.#active.col) {
+						this.#active = {
+							index,
+							rowId: this.#table.model.rowAt(index)?.id,
+							col
+						};
+						this.requestUpdate();
+					}
+					return;
+				}
+				if (target === event.currentTarget) return;
+			}
+		};
+		this.#onClick = (event) => {
+			this.#activate(event.composedPath());
+		};
+	}
+	static {
+		this.styles = baseStyles;
+	}
+	/**
+	* The sort order, e.g. `[{ id: 'total', desc: true }]`; `[]` when unsorted. Unset,
+	* the table keeps it itself and header clicks change it. Once set, it is
+	* controlled: a click only fires `argus-sort-change` with the proposed order,
+	* and nothing changes until you set the property. Set `undefined` to hand it back.
+	*/
+	get sorting() {
+		return this.#sorting.value;
+	}
+	set sorting(value) {
+		this.#sorting.set(value);
+	}
+	/**
+	* Resized widths in px by column id, e.g. `{ name: 240 }`. A resized flex column
+	* becomes fixed. Uncontrolled until set, like `sorting`: once set, a resize only
+	* fires `argus-column-resize` with the proposed widths. `undefined` hands it back.
+	*/
+	get columnSizing() {
+		return this.#sizing.value;
+	}
+	set columnSizing(value) {
+		this.#sizing.set(value);
+	}
+	#sorting;
+	#sizing;
+	/** A resize the table applied itself; its event fires once the update is done. */
+	#appliedResize;
+	/** A sort the table applied itself; its event fires once the update is done. */
+	#appliedSort;
+	#internals;
+	#table;
+	#virtual;
+	#rowPx;
+	#probeObserver;
+	#window;
+	#active;
+	/** Move focus to the active cell after the next update (keyboard navigation). */
+	#focusPending;
+	#lastRange;
+	connectedCallback() {
+		super.connectedCallback();
+		if (!this.hasAttribute("role")) this.setAttribute("role", "grid");
+		if (this.hasUpdated) this.#observeProbe();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.#probeObserver?.disconnect();
+	}
+	/** Scrolls so that the row at `index` (in the current row order) is at the top. */
+	async scrollToRow(index) {
+		await this.updateComplete;
+		this.#virtual.scrollToIndex(index);
+		await this.updateComplete;
+	}
+	willUpdate(changed) {
+		if (changed.has("columns") || changed.has("data") || changed.has("getRowId") || changed.has("sorting") || changed.has("columnSizing")) this.#table.update({
+			columns: this.columns,
+			data: this.data,
+			getRowId: this.getRowId,
+			sorting: this.#sorting.value,
+			columnSizing: this.#sizing.value
+		});
+		const model = this.#table.model;
+		this.#reconcileActive(model);
+		const active = this.#active;
+		this.#internals.ariaRowCount = String(model.rowCount + 1);
+		this.#internals.ariaColCount = String(model.columns.length);
+		this.#virtual.configure({
+			count: model.rowCount,
+			rowHeight: this.#rowPx,
+			overscan: Math.max(0, this.overscan),
+			rowIdAt: (index) => model.rowAt(index)?.id ?? String(index),
+			keep: active?.rowId === void 0 ? void 0 : {
+				id: active.rowId,
+				index: active.index
+			}
+		});
+	}
+	render() {
+		const model = this.#table.model;
+		const columns = model.columns;
+		this.#window = this.#virtual.computeWindow();
+		const pinned = (side) => `${String(columns.reduce((sum, c) => c.pin === side ? sum + c.width : sum, 0))}px`;
+		const style = {
+			"--_cols": columns.map(track).join(" "),
+			"--_width": `${String(model.totalWidth)}px`,
+			"--_pin-start": pinned("start"),
+			"--_pin-end": pinned("end")
+		};
+		const active = this.#active;
+		const bodyActive = active && active.index >= 0 ? {
+			index: active.index,
+			col: active.col
+		} : void 0;
+		if (this.rowHeight !== void 0 && this.rowHeight > 0) style["--_row-height"] = `${String(this.rowHeight)}px`;
+		return html`<div
+      part="table"
+      role="presentation"
+      style=${styleMap(style)}
+      @keydown=${this.#onKeydown}
+      @focusin=${this.#onFocusin}
+      @click=${this.#onClick}
+    >
+      ${renderHeader(columns, this.#headerHandlers, active?.index === -1 ? active.col : void 0)}
+      ${model.rowCount === 0 ? html`<div part="empty"><slot name="empty">No rows</slot></div>` : renderBody(this.#window.rows, columns, this.#window.totalSize, bodyActive)}
+      <div class="probe" aria-hidden="true"></div>
+    </div>`;
+	}
+	firstUpdated() {
+		this.#observeProbe();
+		this.#measureRowHeight();
+	}
+	updated(changed) {
+		renderLightDom(this, this.#table.model, this.#window.rows);
+		if (this.#focusPending) {
+			this.#focusPending = false;
+			this.#focusActive();
+		}
+		if (changed.has("density") || changed.has("rowHeight")) this.#measureRowHeight();
+		if (this.#appliedResize) {
+			const detail = this.#appliedResize;
+			this.#appliedResize = void 0;
+			fire(this, COLUMN_RESIZE, detail);
+		}
+		if (this.#appliedSort) {
+			const sorting = this.#appliedSort;
+			this.#appliedSort = void 0;
+			fire(this, SORT_CHANGE, { sorting });
+		}
+		const { range } = this.#window;
+		const key = range ? `${String(range.start)}:${String(range.end)}` : "";
+		if (range && key !== this.#lastRange) {
+			this.#lastRange = key;
+			fire(this, RANGE_CHANGE, {
+				start: range.start,
+				end: range.end
+			});
+		}
+	}
+	#headerHandlers;
+	/**
+	* Keys on a focused cell or header. Keys from content inside a cell (an input,
+	* a button) are left to that content.
+	*/
+	#onKeydown;
+	/** Focus that lands in a cell (a click, or content inside it) makes that cell active. */
+	#onFocusin;
+	/** `argus-cell-click`, then `argus-row-click`, for clicks in the body. */
+	#onClick;
+	/**
+	* Fires `argus-cell-click` (when a cell is on the path), then `argus-row-click`,
+	* for the body row on an event path. Clicks and Enter on a body cell use it.
+	*/
+	#activate(path) {
+		let columnId;
+		for (const target of path) {
+			if (!(target instanceof HTMLElement)) continue;
+			const role = target.getAttribute("role");
+			if (role === "gridcell") columnId = target.dataset.col;
+			if (role !== "row") continue;
+			const model = this.#table.model;
+			const index = rowIndexOf(target);
+			const row = index >= 0 ? model.rowAt(index) : void 0;
+			if (!row) return;
+			if (columnId !== void 0) fire(this, CELL_CLICK, {
+				row: row.original,
+				columnId,
+				value: model.valueAt(index, columnId)
+			});
+			fire(this, ROW_CLICK, {
+				row: row.original,
+				rowId: row.id,
+				index
+			});
+			return;
+		}
+	}
+	/** Makes a cell active and focuses it after the update. The keep-rendered rule renders its row. */
+	#moveTo(index, col, model) {
+		this.#active = {
+			index,
+			rowId: index >= 0 ? model.rowAt(index)?.id : void 0,
+			col
+		};
+		this.#focusPending = true;
+		this.requestUpdate();
+	}
+	#focusActive() {
+		const active = this.#active;
+		if (!active) return;
+		const col = CSS.escape(active.col);
+		const selector = active.index === -1 ? `[part~='header-row'] > [data-col="${col}"]` : `[part~='body'] > [aria-rowindex="${String(active.index + 2)}"] > [data-col="${col}"]`;
+		const cell = this.renderRoot.querySelector(selector);
+		if (!cell) return;
+		cell.scrollIntoView({
+			block: "nearest",
+			inline: "nearest"
+		});
+		cell.focus({ preventScroll: true });
+	}
+	/**
+	* Keeps the active cell valid after columns or rows change: on the same row id
+	* when it still exists (it may have moved), else at the same index, clamped.
+	* Defaults to the first header. If its row went away while the grid had focus,
+	* focus follows to the replacement.
+	*/
+	#reconcileActive(model) {
+		const columns = model.columns;
+		const first = columns[0];
+		if (!first) {
+			this.#active = void 0;
+			return;
+		}
+		const prev = this.#active ?? {
+			index: -1,
+			rowId: void 0,
+			col: first.id
+		};
+		const col = columns.some((c) => c.id === prev.col) ? prev.col : first.id;
+		let { index, rowId } = prev;
+		if (rowId !== void 0) {
+			const found = model.indexOf(rowId);
+			if (found === void 0) {
+				index = Math.min(index, model.rowCount - 1);
+				rowId = model.rowAt(index)?.id;
+				if (this.matches(":focus-within")) this.#focusPending = true;
+			} else index = found;
+		}
+		if (index !== prev.index || rowId !== prev.rowId || col !== prev.col || !this.#active) this.#active = {
+			index,
+			rowId,
+			col
+		};
+	}
+	/**
+	* The width a resize starts from: the latest requested width (key presses can
+	* come faster than renders), else the model's fixed width, else the rendered
+	* width of a flex column.
+	*/
+	#currentWidth(columnId, cell) {
+		const sized = this.#sizing.value[columnId];
+		if (sized !== void 0) return sized;
+		const view = this.#table.model.columns.find((c) => c.id === columnId);
+		return view && view.flex === void 0 ? view.width : cell.getBoundingClientRect().width;
+	}
+	#direction() {
+		return getComputedStyle(this).direction === "rtl" ? -1 : 1;
+	}
+	/** Sets one column's width (clamped by core), through the controlled/uncontrolled rules. */
+	#requestResize(columnId, width) {
+		const next = this.#table.model.nextSizing(columnId, width);
+		const target = next?.[columnId];
+		if (!next || target === void 0 || target === this.#sizing.value[columnId]) return;
+		const old = this.#sizing.value;
+		const { value, applied } = this.#sizing.request(next);
+		const detail = {
+			columnId,
+			width: target,
+			sizing: value
+		};
+		if (applied) {
+			this.#appliedResize = detail;
+			this.requestUpdate("columnSizing", old);
+		} else fire(this, COLUMN_RESIZE, detail);
+	}
+	/** asc → desc → unsorted, through the controlled/uncontrolled rules. */
+	#requestSort(columnId) {
+		const next = this.#table.model.nextSorting(columnId);
+		if (!next) return;
+		const old = this.#sorting.value;
+		const { value, applied } = this.#sorting.request(next);
+		if (applied) {
+			this.#appliedSort = value;
+			this.requestUpdate("sorting", old);
+		} else fire(this, SORT_CHANGE, { sorting: value });
+	}
+	#observeProbe() {
+		const probe = this.renderRoot.querySelector(".probe");
+		if (!probe) return;
+		this.#probeObserver ??= new ResizeObserver(() => {
+			this.#measureRowHeight();
+		});
+		this.#probeObserver.observe(probe);
+	}
+	/** Reads the resolved row height, so themes and density change the virtualizer too. */
+	#measureRowHeight() {
+		const px = this.renderRoot.querySelector(".probe")?.getBoundingClientRect().height ?? 0;
+		if (px > 0 && Math.abs(px - this.#rowPx) > .01) {
+			this.#rowPx = px;
+			this.requestUpdate();
+		}
+	}
+};
+__decorate([property({ attribute: false })], ArgusTable.prototype, "columns", void 0);
+__decorate([property({ attribute: false })], ArgusTable.prototype, "data", void 0);
+__decorate([property({ attribute: false })], ArgusTable.prototype, "getRowId", void 0);
+__decorate([property({
+	attribute: "row-height",
+	type: Number
+})], ArgusTable.prototype, "rowHeight", void 0);
+__decorate([property({ reflect: true })], ArgusTable.prototype, "density", void 0);
+__decorate([property({ type: Number })], ArgusTable.prototype, "overscan", void 0);
+__decorate([property({ attribute: false })], ArgusTable.prototype, "sorting", null);
+__decorate([property({ attribute: false })], ArgusTable.prototype, "columnSizing", null);
+ArgusTable = __decorate([customElement("argus-table")], ArgusTable);
+export { ArgusTable };
+
+//# sourceMappingURL=argus-table.js.map

package/dist/argus-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"argus-table.js","names":["_decorate"],"sources":["../src/argus-table.ts"],"sourcesContent":["import {\n  LitElement,\n  html,\n  type CSSResultGroup,\n  type PropertyValues,\n  type TemplateResult,\n} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport {\n  controllable,\n  type ColumnResizeDetail,\n  type ColumnView,\n  type TableModel,\n} from '@argus-table/core';\nimport { startResizeDrag } from './controllers/resize-drag.js';\nimport { TableController } from './controllers/table-controller.js';\nimport { VirtualController, type VirtualWindow } from './controllers/virtual-controller.js';\nimport { CELL_CLICK, COLUMN_RESIZE, fire, RANGE_CHANGE, ROW_CLICK, SORT_CHANGE } from './events.js';\nimport { renderBody, type ActiveCell } from './render/body.js';\nimport { renderLightDom } from './render/cells.js';\nimport { renderHeader } from './render/header.js';\nimport { baseStyles } from './styles/base.js';\nimport type { CellContent, ColumnDef, ColumnSizingState, Density, SortState } from './types.js';\n\n/**\n * The host carries the grid role, so rows rendered in the shadow root become\n * its children in the accessibility tree. ElementInternals sets the default;\n * `connectedCallback` also adds a `role` attribute, because tools such as\n * axe-core can't see the ElementInternals role. A `role` the page sets wins.\n */\nfunction attachGridInternals(host: HTMLElement): ElementInternals {\n  const internals = host.attachInternals();\n  internals.role = 'grid';\n  return internals;\n}\n\n/**\n * The sortable column a header click came from, if any. Works for slotted content\n * too. Clicks on a resize handle never sort, so a click that ends a drag doesn't.\n */\nfunction sortColumnOf(event: Event): string | undefined {\n  for (const target of event.composedPath()) {\n    if (!(target instanceof HTMLElement)) continue;\n    if (target.dataset.resizeCol !== undefined) return undefined;\n    if (target.dataset.sortCol !== undefined) return target.dataset.sortCol;\n    if (target.getAttribute('part') === 'header-row') return undefined;\n  }\n  return undefined;\n}\n\nconst RESIZE_STEP = 10;\n\n/**\n * The cell holding the grid's single tab stop. `index` is the row's index in the\n * row model, `-1` for the header row; `rowId` keeps it on the same row when the\n * order changes.\n */\ninterface Active {\n  index: number;\n  rowId: string | undefined;\n  col: string;\n}\n\n/** The grid cell or column header an element is, if any. */\nfunction gridCell(target: EventTarget): HTMLElement | undefined {\n  if (!(target instanceof HTMLElement) || target.dataset.col === undefined) return undefined;\n  const role = target.getAttribute('role');\n  return role === 'gridcell' || role === 'columnheader' ? target : undefined;\n}\n\n/** Row index of a rendered row element (`aria-rowindex` minus the header); `-1` for the header. */\nfunction rowIndexOf(row: Element | null): number {\n  return Number(row?.getAttribute('aria-rowindex') ?? 1) - 2;\n}\n\n/** CSS grid track for a column: fixed px, or a flex share with the min width as floor. */\nfunction track<T>(column: ColumnView<T, CellContent>): string {\n  return column.flex === undefined\n    ? `${String(column.width)}px`\n    : `minmax(${String(column.minWidth)}px, ${String(column.flex)}fr)`;\n}\n\n/**\n * A virtualized data table.\n *\n * Set `columns` and `data` as properties. Header and cell content is rendered\n * into the element's light DOM and slotted into the cells, so page CSS and the\n * page's own components work inside cells.\n *\n * @summary Data table with pinned rows and columns and infinite loading.\n *\n * @fires argus-sort-change - A sortable header was clicked, or activated with Enter or Space. `detail: { sorting }`: the new order, or the proposed one when `sorting` is controlled.\n * @fires argus-column-resize - A column was resized by dragging its handle or with Alt+Arrow on its header. `detail: { columnId, width, sizing }`: the new widths, or the proposed ones when `columnSizing` is controlled. Fires on every frame of a drag.\n * @fires argus-cell-click - A body cell was clicked, or Enter was pressed on it. `detail: { row, columnId, value }`. Fires before `argus-row-click`.\n * @fires argus-row-click - A body row was clicked, or Enter was pressed on one of its cells. `detail: { row, rowId, index }`.\n * @fires argus-range-change - The visible rows changed. `detail: { start, end }` (row indices, inclusive).\n *\n * @slot empty - Shown instead of the body when there are no rows. Default: \"No rows\".\n *\n * @csspart table - The scroll container that holds header and body.\n * @csspart header - The sticky header row group.\n * @csspart header-row - The header row.\n * @csspart header-cell - Every header cell.\n * @csspart header-cell-sorted - The header of the sorted column. The direction is in `aria-sort`.\n * @csspart resize-handle - The drag handle on the inline-end edge of a resizable column's header.\n * @csspart body - The row group holding the rendered body rows.\n * @csspart row - Every body row.\n * @csspart row-even - Body rows with an even index (0-based).\n * @csspart row-odd - Body rows with an odd index.\n * @csspart cell - Every body cell.\n * @csspart cell-sorted - Body cells in the sorted column.\n * @csspart cell-pinned - Body cells in a pinned column, on either side.\n * @csspart cell-pinned-edge - The pinned body cell next to the scrolling columns (one per pinned side).\n * @csspart empty - The empty-state container.\n *\n * @cssprop [--argus-bg=Canvas] - Background of the table and rows.\n * @cssprop [--argus-fg=CanvasText] - Text colour.\n * @cssprop [--argus-font=inherit] - Font shorthand for the table.\n * @cssprop [--argus-header-bg] - Header background.\n * @cssprop [--argus-header-fg=inherit] - Header text colour.\n * @cssprop [--argus-border-color] - Colour of the row borders.\n * @cssprop [--argus-border-width=1px] - Width of the row borders.\n * @cssprop [--argus-row-height] - Height of a row. Default per density: 32px, 40px, 52px.\n * @cssprop [--argus-cell-padding-inline] - Inline padding of cells. Default per density: 8px, 12px, 16px.\n * @cssprop [--argus-row-stripe-bg] - Background of odd rows. Default: no stripes.\n * @cssprop [--argus-pinned-shadow] - Shadow on the pinned edge, as a `box-shadow` falling toward the end side (`4px 0 6px -4px …`). Mirrored for the end edge and in RTL; `none` removes it.\n * @cssprop [--argus-resize-handle-color] - Colour of the resize handle's line, shown on hover, focus and drag.\n * @cssprop [--argus-focus-ring=2px solid Highlight] - Outline of the focused header or cell.\n * @cssprop [--argus-row-hover-bg] - Background of the hovered row. Default: no change.\n * @cssprop [--argus-row-selected-bg] - Reserved for row selection, which comes after v0.1. The table doesn't read it yet.\n */\n@customElement('argus-table')\nexport class ArgusTable<T = unknown> extends LitElement {\n  static override styles: CSSResultGroup = baseStyles;\n\n  /** Column definitions. Property only: functions can't be attributes. */\n  @property({ attribute: false })\n  columns: readonly ColumnDef<T>[] = [];\n\n  /** The rows to show. Replace the array to update; changes inside it aren't detected. */\n  @property({ attribute: false })\n  data: readonly T[] = [];\n\n  /** Returns a stable id for a row. Default: the row's index in `data`. */\n  @property({ attribute: false })\n  getRowId?: (row: T, index: number) => string;\n\n  /** Row height in px. Unset: the density (or the `--argus-row-height` token) decides. */\n  @property({ attribute: 'row-height', type: Number })\n  rowHeight?: number;\n\n  /** Row density: `compact`, `comfortable` or `spacious`. */\n  @property({ reflect: true })\n  density: Density = 'comfortable';\n\n  /** Rows rendered above and below the visible ones. */\n  @property({ type: Number })\n  overscan = 6;\n\n  /**\n   * The sort order, e.g. `[{ id: 'total', desc: true }]`; `[]` when unsorted. Unset,\n   * the table keeps it itself and header clicks change it. Once set, it is\n   * controlled: a click only fires `argus-sort-change` with the proposed order,\n   * and nothing changes until you set the property. Set `undefined` to hand it back.\n   */\n  @property({ attribute: false })\n  get sorting(): SortState {\n    return this.#sorting.value;\n  }\n  set sorting(value: SortState | undefined) {\n    // Lit wraps this accessor and requests the update with the old value.\n    this.#sorting.set(value);\n  }\n\n  /**\n   * Resized widths in px by column id, e.g. `{ name: 240 }`. A resized flex column\n   * becomes fixed. Uncontrolled until set, like `sorting`: once set, a resize only\n   * fires `argus-column-resize` with the proposed widths. `undefined` hands it back.\n   */\n  @property({ attribute: false })\n  get columnSizing(): ColumnSizingState {\n    return this.#sizing.value;\n  }\n  set columnSizing(value: ColumnSizingState | undefined) {\n    this.#sizing.set(value);\n  }\n\n  readonly #sorting = controllable<SortState>([]);\n  readonly #sizing = controllable<ColumnSizingState>({});\n  /** A resize the table applied itself; its event fires once the update is done. */\n  #appliedResize: ColumnResizeDetail | undefined;\n  /** A sort the table applied itself; its event fires once the update is done. */\n  #appliedSort: SortState | undefined;\n  readonly #internals = attachGridInternals(this);\n  readonly #table = new TableController<T>();\n  // Looked up lazily: the virtualizer's hostUpdated runs before firstUpdated.\n  readonly #virtual = new VirtualController(this, () =>\n    this.renderRoot.querySelector<HTMLElement>('[part~=\"table\"]'),\n  );\n  #rowPx = 40;\n  #probeObserver?: ResizeObserver;\n  #window: VirtualWindow = { rows: [], totalSize: 0, range: null };\n  #active: Active | undefined;\n  /** Move focus to the active cell after the next update (keyboard navigation). */\n  #focusPending = false;\n  #lastRange = '';\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (!this.hasAttribute('role')) this.setAttribute('role', 'grid');\n    if (this.hasUpdated) this.#observeProbe();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#probeObserver?.disconnect();\n  }\n\n  /** Scrolls so that the row at `index` (in the current row order) is at the top. */\n  async scrollToRow(index: number): Promise<void> {\n    await this.updateComplete;\n    this.#virtual.scrollToIndex(index);\n    await this.updateComplete;\n  }\n\n  protected override willUpdate(changed: PropertyValues<this>): void {\n    if (\n      changed.has('columns') ||\n      changed.has('data') ||\n      changed.has('getRowId') ||\n      changed.has('sorting') ||\n      changed.has('columnSizing')\n    ) {\n      this.#table.update({\n        columns: this.columns,\n        data: this.data,\n        getRowId: this.getRowId,\n        sorting: this.#sorting.value,\n        columnSizing: this.#sizing.value,\n      });\n    }\n    const model = this.#table.model;\n    this.#reconcileActive(model);\n    const active = this.#active;\n    this.#internals.ariaRowCount = String(model.rowCount + 1);\n    this.#internals.ariaColCount = String(model.columns.length);\n    this.#virtual.configure({\n      count: model.rowCount,\n      rowHeight: this.#rowPx,\n      overscan: Math.max(0, this.overscan),\n      rowIdAt: (index) => model.rowAt(index)?.id ?? String(index),\n      // The active row stays rendered, so the tab stop and focus survive scrolling.\n      keep: active?.rowId === undefined ? undefined : { id: active.rowId, index: active.index },\n    });\n  }\n\n  protected override render(): TemplateResult {\n    const model = this.#table.model;\n    const columns = model.columns;\n    this.#window = this.#virtual.computeWindow();\n    const pinned = (side: 'start' | 'end') =>\n      `${String(columns.reduce((sum, c) => (c.pin === side ? sum + c.width : sum), 0))}px`;\n    const style: Record<string, string> = {\n      '--_cols': columns.map(track).join(' '),\n      '--_width': `${String(model.totalWidth)}px`,\n      '--_pin-start': pinned('start'),\n      '--_pin-end': pinned('end'),\n    };\n    const active = this.#active;\n    const bodyActive: ActiveCell | undefined =\n      active && active.index >= 0 ? { index: active.index, col: active.col } : undefined;\n    if (this.rowHeight !== undefined && this.rowHeight > 0) {\n      style['--_row-height'] = `${String(this.rowHeight)}px`;\n    }\n    return html`<div\n      part=\"table\"\n      role=\"presentation\"\n      style=${styleMap(style)}\n      @keydown=${this.#onKeydown}\n      @focusin=${this.#onFocusin}\n      @click=${this.#onClick}\n    >\n      ${renderHeader(columns, this.#headerHandlers, active?.index === -1 ? active.col : undefined)}\n      ${\n        model.rowCount === 0\n          ? html`<div part=\"empty\"><slot name=\"empty\">No rows</slot></div>`\n          : renderBody(this.#window.rows, columns, this.#window.totalSize, bodyActive)\n      }\n      <div class=\"probe\" aria-hidden=\"true\"></div>\n    </div>`;\n  }\n\n  protected override firstUpdated(): void {\n    this.#observeProbe();\n    this.#measureRowHeight();\n  }\n\n  protected override updated(changed: PropertyValues<this>): void {\n    renderLightDom(this, this.#table.model, this.#window.rows);\n    if (this.#focusPending) {\n      this.#focusPending = false;\n      this.#focusActive();\n    }\n    if (changed.has('density') || changed.has('rowHeight')) this.#measureRowHeight();\n    if (this.#appliedResize) {\n      const detail = this.#appliedResize;\n      this.#appliedResize = undefined;\n      fire(this, COLUMN_RESIZE, detail);\n    }\n    if (this.#appliedSort) {\n      const sorting = this.#appliedSort;\n      this.#appliedSort = undefined;\n      fire(this, SORT_CHANGE, { sorting });\n    }\n    const { range } = this.#window;\n    const key = range ? `${String(range.start)}:${String(range.end)}` : '';\n    if (range && key !== this.#lastRange) {\n      this.#lastRange = key;\n      fire(this, RANGE_CHANGE, { start: range.start, end: range.end });\n    }\n  }\n\n  readonly #headerHandlers = {\n    click: (event: MouseEvent) => {\n      const id = sortColumnOf(event);\n      if (id !== undefined) this.#requestSort(id);\n    },\n    pointerdown: (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      const handle = event.composedPath()[0];\n      if (!(handle instanceof HTMLElement)) return;\n      const id = handle.dataset.resizeCol;\n      const cell = handle.parentElement;\n      if (id === undefined || !cell) return;\n      startResizeDrag(handle, event, cell.getBoundingClientRect().width, this.#direction(), (w) => {\n        this.#requestResize(id, w);\n      });\n    },\n  };\n\n  /**\n   * Keys on a focused cell or header. Keys from content inside a cell (an input,\n   * a button) are left to that content.\n   */\n  readonly #onKeydown = (event: KeyboardEvent) => {\n    const cell = gridCell(event.composedPath()[0] ?? event.target ?? this);\n    const id = cell?.dataset.col;\n    if (!cell || id === undefined) return;\n    if (event.key === 'Tab' && event.shiftKey) {\n      // Firefox makes the scroll container a tab stop, so Shift+Tab would stop\n      // on it before leaving the grid. Take it out of the tab order for this\n      // one move only: a tabindex there for good would expose it as a node of\n      // its own between the grid and its rows.\n      const scroller = event.currentTarget as HTMLElement;\n      scroller.tabIndex = -1;\n      // Put it back once focus has actually moved (a timer can run first).\n      cell.addEventListener(\n        'focusout',\n        () => {\n          scroller.removeAttribute('tabindex');\n        },\n        { once: true },\n      );\n      return;\n    }\n    const inHeader = cell.getAttribute('role') === 'columnheader';\n    const { key } = event;\n    if (inHeader && event.altKey && (key === 'ArrowLeft' || key === 'ArrowRight')) {\n      event.preventDefault();\n      // Logical: the arrow pointing toward the inline end grows the column.\n      const towardEnd = (key === 'ArrowRight') === (this.#direction() === 1);\n      this.#requestResize(\n        id,\n        this.#currentWidth(id, cell) + (towardEnd ? RESIZE_STEP : -RESIZE_STEP),\n      );\n      return;\n    }\n    if (inHeader && (key === 'Enter' || key === ' ') && cell.dataset.sortCol !== undefined) {\n      event.preventDefault();\n      this.#requestSort(id);\n      return;\n    }\n    if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return;\n    if (!inHeader && key === 'Enter') {\n      // Enter on a body cell does what a click does.\n      event.preventDefault();\n      this.#activate(event.composedPath());\n      return;\n    }\n    const model = this.#table.model;\n    const columns = model.columns;\n    let row = inHeader ? -1 : rowIndexOf(cell.parentElement);\n    let col = columns.findIndex((c) => c.id === id);\n    switch (key) {\n      case 'ArrowDown':\n        row = Math.min(row + 1, model.rowCount - 1);\n        break;\n      case 'ArrowUp':\n        row = Math.max(row - 1, -1);\n        break;\n      case 'ArrowRight':\n        col += this.#direction();\n        break;\n      case 'ArrowLeft':\n        col -= this.#direction();\n        break;\n      case 'Home':\n        col = 0;\n        break;\n      case 'End':\n        col = columns.length - 1;\n        break;\n      default:\n        return;\n    }\n    event.preventDefault();\n    const target = columns[Math.min(Math.max(col, 0), columns.length - 1)];\n    if (target) this.#moveTo(row, target.id, model);\n  };\n\n  /** Focus that lands in a cell (a click, or content inside it) makes that cell active. */\n  readonly #onFocusin = (event: FocusEvent) => {\n    // Tab into the grid landed on the scroll container (Firefox makes it a tab\n    // stop): move on to the grid's one tab stop, the active cell. Only when focus\n    // came from outside the grid: coming from inside means the user is leaving,\n    // and sending them back would trap the keyboard.\n    const scroller = event.currentTarget as HTMLElement;\n    if (event.composedPath()[0] === scroller) {\n      const from = event.relatedTarget;\n      if (!(from instanceof Node && scroller.contains(from))) {\n        this.#focusPending = true;\n        this.requestUpdate();\n      }\n      return;\n    }\n    for (const target of event.composedPath()) {\n      const cell = gridCell(target);\n      if (cell?.dataset.col !== undefined) {\n        const index =\n          cell.getAttribute('role') === 'columnheader' ? -1 : rowIndexOf(cell.parentElement);\n        const { col } = cell.dataset;\n        if (index !== this.#active?.index || col !== this.#active.col) {\n          this.#active = { index, rowId: this.#table.model.rowAt(index)?.id, col };\n          this.requestUpdate();\n        }\n        return;\n      }\n      if (target === event.currentTarget) return;\n    }\n  };\n\n  /** `argus-cell-click`, then `argus-row-click`, for clicks in the body. */\n  readonly #onClick = (event: MouseEvent) => {\n    this.#activate(event.composedPath());\n  };\n\n  /**\n   * Fires `argus-cell-click` (when a cell is on the path), then `argus-row-click`,\n   * for the body row on an event path. Clicks and Enter on a body cell use it.\n   */\n  #activate(path: EventTarget[]): void {\n    let columnId: string | undefined;\n    for (const target of path) {\n      if (!(target instanceof HTMLElement)) continue;\n      const role = target.getAttribute('role');\n      if (role === 'gridcell') columnId = target.dataset.col;\n      if (role !== 'row') continue;\n      const model = this.#table.model;\n      const index = rowIndexOf(target);\n      const row = index >= 0 ? model.rowAt(index) : undefined;\n      if (!row) return;\n      if (columnId !== undefined) {\n        fire(this, CELL_CLICK, {\n          row: row.original,\n          columnId,\n          value: model.valueAt(index, columnId),\n        });\n      }\n      fire(this, ROW_CLICK, { row: row.original, rowId: row.id, index });\n      return;\n    }\n  }\n\n  /** Makes a cell active and focuses it after the update. The keep-rendered rule renders its row. */\n  #moveTo(index: number, col: string, model: TableModel<T, CellContent>): void {\n    this.#active = { index, rowId: index >= 0 ? model.rowAt(index)?.id : undefined, col };\n    this.#focusPending = true;\n    this.requestUpdate();\n  }\n\n  #focusActive(): void {\n    const active = this.#active;\n    if (!active) return;\n    const col = CSS.escape(active.col);\n    const selector =\n      active.index === -1\n        ? `[part~='header-row'] > [data-col=\"${col}\"]`\n        : `[part~='body'] > [aria-rowindex=\"${String(active.index + 2)}\"] > [data-col=\"${col}\"]`;\n    const cell = this.renderRoot.querySelector<HTMLElement>(selector);\n    if (!cell) return;\n    cell.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n    cell.focus({ preventScroll: true });\n  }\n\n  /**\n   * Keeps the active cell valid after columns or rows change: on the same row id\n   * when it still exists (it may have moved), else at the same index, clamped.\n   * Defaults to the first header. If its row went away while the grid had focus,\n   * focus follows to the replacement.\n   */\n  #reconcileActive(model: TableModel<T, CellContent>): void {\n    const columns = model.columns;\n    const first = columns[0];\n    if (!first) {\n      this.#active = undefined;\n      return;\n    }\n    const prev = this.#active ?? { index: -1, rowId: undefined, col: first.id };\n    const col = columns.some((c) => c.id === prev.col) ? prev.col : first.id;\n    let { index, rowId } = prev;\n    if (rowId !== undefined) {\n      const found = model.indexOf(rowId);\n      if (found === undefined) {\n        index = Math.min(index, model.rowCount - 1);\n        rowId = model.rowAt(index)?.id;\n        if (this.matches(':focus-within')) this.#focusPending = true;\n      } else {\n        index = found;\n      }\n    }\n    if (index !== prev.index || rowId !== prev.rowId || col !== prev.col || !this.#active) {\n      this.#active = { index, rowId, col };\n    }\n  }\n\n  /**\n   * The width a resize starts from: the latest requested width (key presses can\n   * come faster than renders), else the model's fixed width, else the rendered\n   * width of a flex column.\n   */\n  #currentWidth(columnId: string, cell: HTMLElement): number {\n    const sized = this.#sizing.value[columnId];\n    if (sized !== undefined) return sized;\n    const view = this.#table.model.columns.find((c) => c.id === columnId);\n    return view && view.flex === undefined ? view.width : cell.getBoundingClientRect().width;\n  }\n\n  #direction(): 1 | -1 {\n    return getComputedStyle(this).direction === 'rtl' ? -1 : 1;\n  }\n\n  /** Sets one column's width (clamped by core), through the controlled/uncontrolled rules. */\n  #requestResize(columnId: string, width: number): void {\n    const next = this.#table.model.nextSizing(columnId, width);\n    const target = next?.[columnId];\n    if (!next || target === undefined || target === this.#sizing.value[columnId]) return;\n    const old = this.#sizing.value;\n    const { value, applied } = this.#sizing.request(next);\n    const detail = { columnId, width: target, sizing: value };\n    if (applied) {\n      this.#appliedResize = detail;\n      this.requestUpdate('columnSizing', old);\n    } else {\n      fire(this, COLUMN_RESIZE, detail);\n    }\n  }\n\n  /** asc → desc → unsorted, through the controlled/uncontrolled rules. */\n  #requestSort(columnId: string): void {\n    const next = this.#table.model.nextSorting(columnId);\n    if (!next) return;\n    const old = this.#sorting.value;\n    const { value, applied } = this.#sorting.request(next);\n    if (applied) {\n      this.#appliedSort = value;\n      this.requestUpdate('sorting', old);\n    } else {\n      fire(this, SORT_CHANGE, { sorting: value });\n    }\n  }\n\n  #observeProbe(): void {\n    const probe = this.renderRoot.querySelector('.probe');\n    if (!probe) return;\n    this.#probeObserver ??= new ResizeObserver(() => {\n      this.#measureRowHeight();\n    });\n    this.#probeObserver.observe(probe);\n  }\n\n  /** Reads the resolved row height, so themes and density change the virtualizer too. */\n  #measureRowHeight(): void {\n    const probe = this.renderRoot.querySelector('.probe');\n    const px = probe?.getBoundingClientRect().height ?? 0;\n    if (px > 0 && Math.abs(px - this.#rowPx) > 0.01) {\n      this.#rowPx = px;\n      this.requestUpdate();\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'argus-table': ArgusTable;\n  }\n}\n"],"mappings":"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"}