edytor 1.0.0-rc.3 → 2.0.0

package/dist/plugins/table/TablePlugin.svelte

@@ -4,9 +4,12 @@
 	import type { Block } from '../../block/block.svelte.js';
 	import type { Edytor } from '../../edytor.svelte.js';
 	import { tableKinds } from '../../crdt/semantics.js';
-	import { tableBlock, unlistedOrder } from '../../crdt/tables.js';
+	import { listedColumns, tableBlock, unlistedOrder } from '../../crdt/tables.js';
 	import { onPress } from '../../events/onFocus.js';
-	import { keywordsOf, labelsWith, viewLabels } from '../../labels.js';
+	import { all } from '../../utils/listen.js';
+	import type { HotKey } from '../../session/keymap.js';
+	import { tableEnglish, keywordsOf, labelsOf, type TableLabels } from '../../labels.js';
+	import { hoverChrome } from '../bands.svelte.js';
 	import TableChromeLayer from './TableChrome.svelte';
 	import { TableChrome } from './chrome.svelte.js';
 	import {
@@ -17,6 +20,7 @@
 		gridOf,
 		insertColumn,
 		insertRow,
+		kebab,
 		positionOf,
 		tableOf,
 		tabFrom,
@@ -28,21 +32,8 @@
 
 	export type { TablePluginOptions };
 
-	const tablePlugins = new WeakSet<Plugin>();
 	/** Each view's chrome (the first table plugin listed in it claims the view). */
 	const chromes = new WeakMap<Edytor, TableChrome>();
-	const labelsOf = viewLabels('table');
-
-	/** Recognize any table plugin instance. */
-	export const isTablePlugin = (plugin: Plugin) => tablePlugins.has(plugin);
-
-	/** The ids of a row's cell, its row and its table, from the handle (stable while it shows). */
-	const parentsOf = (edytor: Edytor, id: string | undefined) => {
-		const cell = id ? edytor.idToBlock.get(id) : undefined;
-		const row = cell?.parent;
-		const table = row?.parent;
-		return { cell, row, table };
-	};
 
 	/**
 	 * The column ids `table`'s rows show, read from the cells (reactive), as
@@ -52,14 +43,9 @@
 	 */
 	const columnsOfTable = (edytor: Edytor, table: string): string[] => {
 		const cell = edytor.cells?.get(table);
-		const listed = cell?.data?.columns;
-		if (Array.isArray(listed)) {
-			const ids = new Set(
-				listed.flatMap((c) => {
-					const id = (c as { id?: unknown } | null)?.id;
-					return typeof id === 'string' ? [id] : [];
-				})
-			);
+		const listed = listedColumns(cell?.data);
+		if (listed !== null) {
+			const ids = new Set(listed);
 			const unlisted = (cell?.childIds ?? []).flatMap((row) =>
 				(edytor.cells?.get(row)?.childIds ?? []).flatMap((id) => {
 					const column = edytor.cells?.get(id)?.data?.column;
@@ -84,15 +70,10 @@
 	 * listed ones.
 	 */
 	const columnIndex = (edytor: Edytor, table: string, row: string, id: string): number => {
-		const listed = edytor.cells?.get(table)?.data?.columns;
-		if (!Array.isArray(listed)) return edytor.cells?.get(row)?.childIds.indexOf(id) ?? -1;
+		const ids = listedColumns(edytor.cells?.get(table)?.data);
+		if (ids === null) return edytor.cells?.get(row)?.childIds.indexOf(id) ?? -1;
 		const column = edytor.cells?.get(id)?.data?.column;
 		if (typeof column !== 'string') return -1;
-		const ids: string[] = [];
-		for (const c of listed) {
-			const at = (c as { id?: unknown } | null)?.id;
-			if (typeof at === 'string' && !ids.includes(at)) ids.push(at);
-		}
 		const index = ids.indexOf(column);
 		return index !== -1 ? index : columnsOfTable(edytor, table).indexOf(column);
 	};
@@ -118,23 +99,20 @@
 		const minColumnWidth = options.minColumnWidth ?? 48;
 		const fresh = tableBlock({ rows: options.rows ?? 3, columns: options.columns ?? 3 });
 		const plugin: Plugin = (edytor) => {
-			const labels = labelsWith('table', options.labels);
-			labelsOf.claim(edytor, labels);
-			const chrome =
-				chromes.get(edytor) ?? new TableChrome(edytor, labels, columnWidth, minColumnWidth);
+			const labels = labelsOf(edytor, 'table', tableEnglish);
+			const chrome = chromes.get(edytor) ?? new TableChrome(edytor, columnWidth, minColumnWidth);
 			chromes.set(edytor, chrome);
 			/** A cell's element: its role, its column, and whether a header row or column holds it. */
-			const cellElement = (data: Record<string, unknown>, id?: string) => {
-				const { row, table } = parentsOf(edytor, id);
-				const tableId = table?.id;
-				if (!id || !row?.id || !tableId)
+			const cellElement = (_: unknown, id?: string) => {
+				// The ids of its row and its table, from the handle (stable while it shows).
+				const row = id ? edytor.idToBlock.get(id)?.parent : undefined;
+				const table = row?.parent?.id;
+				if (!id || !row?.id || !table)
 					return { tag: 'div', attributes: { 'data-edytor-table-cell': '' } };
-				const tableData = edytor.cells?.get(tableId)?.data;
-				const rowIndex = edytor.cells?.get(tableId)?.childIds.indexOf(row.id) ?? -1;
-				const column = columnIndex(edytor, tableId, row.id, id);
-				const headerRow = tableData?.headerRow === true && rowIndex === 0;
-				const headerColumn = tableData?.headerColumn === true && column === 0;
-				void data;
+				const cell = edytor.cells?.get(table);
+				const column = columnIndex(edytor, table, row.id, id);
+				const headerRow = cell?.data?.headerRow === true && cell.childIds.indexOf(row.id) === 0;
+				const headerColumn = cell?.data?.headerColumn === true && column === 0;
 				return {
 					tag: 'div',
 					attributes: {
@@ -148,55 +126,55 @@
 			/**
 			 * The block menu's row and column actions on `table`: at the row and
 			 * column of the cell the caret was last in (`chrome.cell`), else the
-			 * last row and column. An insert puts the caret in the new cells.
+			 * last row and column (an insert puts the caret in the new cells);
+			 * then its Header row and Header column switches.
 			 */
-			const rowsOf = (table: Block): KindMenuAction[] => {
+			const menuOf = (table: Block): KindMenuAction[] => {
+				const action = (key: keyof TableLabels, icon: string, run: () => unknown) => ({
+					id: `table.${kebab(key)}`,
+					label: labels[key] as string,
+					icon,
+					run
+				});
+				const switches = (['headerRow', 'headerColumn'] as const).map((flag) => ({
+					...action(flag, `table.${kebab(flag)}`, () => toggleHeader(table, flag)),
+					checked: table.data[flag] === true
+				}));
 				const grid = gridOf(table);
-				if (!grid || grid.rows.length === 0) return [];
+				if (!grid || grid.rows.length === 0) return switches;
 				const cell = chrome.cell ? edytor.idToBlock.get(chrome.cell) : undefined;
 				const at = cell && tableOf(cell)?.id === table.id ? positionOf(cell) : null;
 				const row = at?.row ?? grid.rows.length - 1;
 				const column = at?.column ?? grid.columns.length - 1;
 				const rowBlock = edytor.idToBlock.get(grid.rows[row]!.id);
 				return [
-					{
-						id: 'table.insert-row-above',
-						label: labels.insertRowAbove,
-						icon: 'action.up',
-						run: () => insertRow(table, row, true)
-					},
-					{
-						id: 'table.insert-row-below',
-						label: labels.insertRowBelow,
-						icon: 'action.down',
-						run: () => insertRow(table, row + 1, true)
-					},
-					{
-						id: 'table.insert-column-left',
-						label: labels.insertColumnLeft,
-						icon: 'table.left',
-						run: () => insertColumn(table, column, undefined, row)
-					},
-					{
-						id: 'table.insert-column-right',
-						label: labels.insertColumnRight,
-						icon: 'table.right',
-						run: () => insertColumn(table, column + 1, undefined, row)
-					},
-					{
-						id: 'table.delete-row',
-						label: labels.deleteRow,
-						icon: 'action.delete',
-						run: () => rowBlock && deleteRows(table, [rowBlock])
-					},
-					{
-						id: 'table.delete-column',
-						label: labels.deleteColumn,
-						icon: 'action.delete',
-						run: () => deleteColumn(table, column)
-					}
+					action('insertRowAbove', 'action.up', () => insertRow(table, row, true)),
+					action('insertRowBelow', 'action.down', () => insertRow(table, row + 1, true)),
+					action('insertColumnLeft', 'table.left', () =>
+						insertColumn(table, column, undefined, row)
+					),
+					action('insertColumnRight', 'table.right', () =>
+						insertColumn(table, column + 1, undefined, row)
+					),
+					action('deleteRow', 'action.delete', () => rowBlock && deleteRows(table, [rowBlock])),
+					action('deleteColumn', 'action.delete', () => deleteColumn(table, column)),
+					...switches
 				];
 			};
+			/** Tab and Shift+Tab (`step`) walk the cells, unless blocks are selected. */
+			const tab =
+				(step: 1 | -1): HotKey =>
+				({ prevent }) => {
+					const cell = caretCell(edytor);
+					if (cell && !edytor.selection.selectedBlocks.size) prevent(() => tabFrom(cell, step));
+				};
+			/** ArrowUp and ArrowDown (`step`) go to the cell above and below. */
+			const vertical =
+				(step: 1 | -1): HotKey =>
+				({ prevent }) => {
+					const cell = caretCell(edytor);
+					if (cell && verticalFrom(cell, step)) prevent();
+				};
 			return {
 				onSelectionChange: () => {
 					if (chromes.get(edytor) === chrome) chrome.track();
@@ -220,31 +198,17 @@
 							{
 								label: labels.table,
 								data: fresh.data,
-								keywords: keywordsOf(
-									'block.table',
-									['table', 'grid', 'simple table', 'rows', 'columns'],
-									options.keywords
-								),
+								keywords: keywordsOf(edytor, 'block.table', [
+									'table',
+									'grid',
+									'simple table',
+									'rows',
+									'columns'
+								]),
 								group: 'Advanced blocks'
 							}
 						],
-						menu: (block) => [
-							...rowsOf(block),
-							{
-								id: 'table.header-row',
-								label: labels.headerRow,
-								icon: 'table.header-row',
-								checked: block.data.headerRow === true,
-								run: () => toggleHeader(block, 'headerRow')
-							},
-							{
-								id: 'table.header-column',
-								label: labels.headerColumn,
-								icon: 'table.header-column',
-								checked: block.data.headerColumn === true,
-								run: () => toggleHeader(block, 'headerColumn')
-							}
-						],
+						menu: menuOf,
 						html: (block, _, children) => tableHtml(block.data ?? {}, children),
 						plain: (_, __, children) => children,
 						parse: (element) => (element.localName === 'table' ? parseTable(element) : undefined)
@@ -267,79 +231,53 @@
 					}
 				},
 				hotkeys: {
-					tab: ({ prevent }) => {
-						const cell = caretCell(edytor);
-						if (cell && !edytor.selection.selectedBlocks.size) prevent(() => tabFrom(cell, 1));
-					},
-					'shift+tab': ({ prevent }) => {
-						const cell = caretCell(edytor);
-						if (cell && !edytor.selection.selectedBlocks.size) prevent(() => tabFrom(cell, -1));
-					},
-					arrowup: ({ prevent }) => {
-						const cell = caretCell(edytor);
-						if (cell && verticalFrom(cell, -1)) prevent();
-					},
-					arrowdown: ({ prevent }) => {
-						const cell = caretCell(edytor);
-						if (cell && verticalFrom(cell, 1)) prevent();
-					}
+					tab: tab(1),
+					'shift+tab': tab(-1),
+					arrowup: vertical(-1),
+					arrowdown: vertical(1)
 				},
 				onEdytorAttached: ({ node }) => {
 					if (chromes.get(edytor) !== chrome) return;
-					const over = (event: PointerEvent) => chrome.hover(event.target);
-					const leave = (event: PointerEvent) => chrome.leave(event.relatedTarget);
 					const layer = edytor.overlay.layer;
-					const document = node.ownerDocument;
-					// Another drag (a block's) hides the chrome; a grip's own drag keeps it (`table.drag`).
-					const drag = (event: Event) =>
-						(chrome.dragging =
-							event.type === 'dragstart' &&
-							!(event.target instanceof Node && layer?.contains(event.target)));
-					node.addEventListener('pointerover', over);
-					node.addEventListener('pointerleave', leave);
-					layer?.addEventListener('pointerleave', leave);
-					document.addEventListener('dragstart', drag, true);
-					document.addEventListener('dragend', drag, true);
-					document.addEventListener('drop', drag, true);
-					// A press outside an open grip menu closes it.
-					const outside = onPress(
-						edytor,
-						document,
-						(event) => {
-							const target = event.target as Node | null;
-							if (!chrome.menu || (target && layer?.contains(target))) return;
-							chrome.menu = null;
-							edytor.overlay.invalidate();
-						},
-						true
-					);
-					const unmount = edytor.overlay.mount(
-						TableChromeLayer,
-						{ chrome, grip: options.grip, menu: options.menu, add: options.add },
-						'edytor-table-chrome',
-						6,
-						chrome.measure
+					const off = all(
+						hoverChrome(
+							edytor,
+							node,
+							chrome.hover,
+							chrome.leave,
+							// Another drag (a block's) hides the chrome; a grip's own drag keeps it (`table.drag`).
+							(event) =>
+								(chrome.dragging =
+									event.type === 'dragstart' &&
+									!(event.target instanceof Node && layer?.contains(event.target)))
+						),
+						// A press outside an open grip menu closes it.
+						onPress(
+							edytor,
+							node.ownerDocument,
+							(event) => {
+								const target = event.target as Node | null;
+								if (!chrome.menu || (target && layer?.contains(target))) return;
+								chrome.menu = null;
+								edytor.overlay.invalidate();
+							},
+							true
+						),
+						edytor.overlay.mount(
+							TableChromeLayer,
+							{ chrome, grip: options.grip, menu: options.menu, add: options.add },
+							'edytor-table-chrome',
+							6,
+							chrome.measure
+						)
 					);
-					return () => {
-						node.removeEventListener('pointerover', over);
-						node.removeEventListener('pointerleave', leave);
-						layer?.removeEventListener('pointerleave', leave);
-						document.removeEventListener('dragstart', drag, true);
-						document.removeEventListener('dragend', drag, true);
-						document.removeEventListener('drop', drag, true);
-						outside();
-						unmount();
-					};
+					return off;
 				}
 			};
 		};
-		tablePlugins.add(plugin);
 		return plugin;
 	};
 
-	/** The table with the default options. */
-	export const tablePlugin = createTablePlugin();
-
 	/** `table`'s grid template: each column's width (the resize preview while a band drags it). */
 	const templateOf = (view: BlockView) => {
 		const edytor = view.handle?.edytor;
@@ -440,7 +378,7 @@
 
 <!-- A row: its cells, then a placeholder in each column it shows none of (`table.pad`). -->
 {#snippet row({ block, children }: BlockSnippetPayload)}
-	{@const labels = labelsOf.of(block.handle?.edytor)}
+	{@const labels = labelsOf(block.handle?.edytor, 'table', tableEnglish)}
 	<div data-edytor-children data-edytor-table-cells>
 		{@render children?.()}<!--
 		-->{#each padsOf(block) as column (column)}

package/dist/plugins/table/TablePlugin.svelte.d.ts

@@ -2,8 +2,6 @@ import './table.css';
 import type { Plugin } from '../../plugins.js';
 import { type TablePluginOptions } from './table.js';
 export type { TablePluginOptions };
-/** Recognize any table plugin instance. */
-export declare const isTablePlugin: (plugin: Plugin) => boolean;
 /**
  * Notion's simple table (`table.*` in the delete contract): a `table` of
  * `tableRow`s of `tableCell`s, each cell a text island whose lines are line
@@ -21,8 +19,6 @@ export declare const isTablePlugin: (plugin: Plugin) => boolean;
  * Not a default plugin; its roles are in `defaultSemantics`.
  */
 export declare const createTablePlugin: (options?: TablePluginOptions) => Plugin;
-/** The table with the default options. */
-export declare const tablePlugin: Plugin;
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/plugins/table/chrome.svelte.d.ts

@@ -1,46 +1,32 @@
 import type { Attachment } from 'svelte/attachments';
 import type { Edytor } from '../../edytor.svelte.js';
-import type { TableLabels } from '../../labels.js';
-import { type MenuItemPayload, type OptionAttributes } from '../chrome.js';
-/** What a grip's menu acts on: a row of a table (its block id), or a column (its position). */
+import { type MenuItemPayload } from '../chrome.js';
+import { ChromeList } from '../list.svelte.js';
+type Kind = 'row' | 'column';
+/** What a grip's menu acts on: a row (its block id) or a column (its id) of a table. */
 export type TableMenu = {
-    kind: 'row';
+    kind: Kind;
     table: string;
-    row: string;
-} | {
-    kind: 'column';
-    table: string;
-    column: number;
+    id: string;
 };
-/** A row of a grip's menu (insert, move, delete). */
+/**
+ * A row of a grip's menu: `insert-above`, `insert-below`, `move-up`,
+ * `move-down`, `delete-row`; `insert-left`, `insert-right`, `move-left`,
+ * `move-right`, `delete-column`.
+ */
 export type TableMenuRow = {
-    /**
-     * `insert-above`, `insert-below`, `move-up`, `move-down`, `delete-row`;
-     * `insert-left`, `insert-right`, `move-left`, `move-right`, `delete-column`.
-     */
     id: string;
-    /** Its words, in the plugin's labels. */
-    label: string;
-    /** Its built-in icon's name. */
-    icon: string;
-    /** It deletes. */
-    danger?: boolean;
-    /** Whether it can run now (Move up on the first row cannot). */
-    isEnabled: () => boolean;
-    run: () => unknown;
 };
 /**
- * One row of a grip's menu, for a custom `menu`: the row shape every menu
+ * One row of a grip's menu, for your `menu`: the row shape every menu
  * shares (`item` is the row, `run` runs it and closes the menu), with
- * whether it can run now, whether it deletes, and its built-in icon.
+ * whether it can run now and whether it deletes.
  */
 export type TableMenuItem = MenuItemPayload<TableMenuRow> & {
     /** It cannot run now (`aria-disabled`): the keys skip it, a click does nothing. */
     disabled: boolean;
     /** It deletes. */
     danger: boolean;
-    /** The built-in line icon as a CSS `mask-image` value, when the row has one. */
-    icon: string | undefined;
 };
 /**
  * What a `grip` snippet receives: the grip of the hovered row (left of the
@@ -48,11 +34,10 @@ export type TableMenuItem = MenuItemPayload<TableMenuRow> & {
  * `button`): it drags the row or the column, a click opens its menu,
  * ArrowDown opens it too and Escape closes it, and it carries the ARIA
  * (`aria-haspopup`, `aria-expanded`, `aria-controls` while its menu is
- * open, its name unless you set one). The plugin centers it where the
- * grip stands.
+ * open; name it). The plugin centers it where the grip stands.
  */
 export type TableGripPayload = {
-    kind: 'row' | 'column';
+    kind: Kind;
     /** The row's block id, or the column's id. */
     id: string;
     /** Its position among the table's rows (columns). */
@@ -61,14 +46,10 @@ export type TableGripPayload = {
     expanded: boolean;
     /** It is being dragged. */
     dragging: boolean;
-    /** Its accessible name (`labels.rowMenu`, `labels.columnMenu`). */
-    label: string;
     /** Open its menu, or close it when it is open (what a click does). */
     toggle: () => void;
     /** The grip's behavior and ARIA: `{@attach grip}`. */
     grip: Attachment<HTMLElement>;
-    /** The plugin's words. */
-    labels: TableLabels;
     /** The table's chrome (its menu, its actions). */
     chrome: TableChrome;
 };
@@ -79,13 +60,9 @@ export type TableGripPayload = {
  * the editor's selection.
  */
 export type TableAddPayload = {
-    kind: 'row' | 'column';
-    /** Its accessible name (`labels.addRow`, `labels.addColumn`). */
-    label: string;
+    kind: Kind;
     /** Add the row or the column. */
     add: () => void;
-    /** The plugin's words. */
-    labels: TableLabels;
 };
 /**
  * The table's chrome (`table.*`), in the overlay: while the pointer is over
@@ -99,25 +76,17 @@ export type TableAddPayload = {
  * drops the preview. Every action is a table command (`table.ts`): refused
  * when the view is readonly.
  *
- * What a custom `menu` snippet receives: the open menu (`menu`), its rows
+ * What a `menu` snippet receives: the open menu (`menu`), its rows
  * (`items`, each a `MenuItemPayload`), the keyboard's row (`index`), the
- * attachments that keep the built-in keys and ARIA (`popup` and `keys` on
- * the menu's element, `option(index)` spread on each row), `close()` and
- * the plugin's `labels`. A grip's own attachment is its payload's `grip`.
+ * attachments that give it the keys and the ARIA (`popup` and `keys` on
+ * the menu's element, `option(index)` on each row) and `close()`.
+ * A grip's own attachment is its payload's `grip`.
  */
-export declare class TableChrome {
+export declare class TableChrome extends ChromeList {
     #private;
-    /** The words the chrome shows and says (the plugin's `labels`). */
-    readonly labels: TableLabels;
     /** What the open grip menu acts on (`null`: none is open). */
     menu: TableMenu | null;
-    /** The keyboard's row of the open menu, in `rows` (never a disabled one). */
-    index: number;
-    constructor(
-    /** @internal */
-    edytor: Edytor, 
-    /** The words the chrome shows and says (the plugin's `labels`). */
-    labels: TableLabels, 
+    constructor(edytor: Edytor, 
     /**
      * A column's width when it sets none, and the narrowest a resize leaves.
      * @internal
@@ -125,67 +94,34 @@ export declare class TableChrome {
     columnWidth: number, 
     /** @internal */
     minColumnWidth: number);
+    protected get count(): number;
     /** The view is readonly (reactive): the chrome shows nothing. */
     get readonly(): boolean;
-    /** The resize's width: the pointer's, between the minimum and the room's (`table.width.fit`). */
-    private dragWidth;
     /**
-     * The right neighbour's width while column `drag.column` is `dragWidth`
-     * (`table.width.neighbour`): the column grows into the free room first,
-     * then what it gains past it comes off its neighbour, down to the
-     * minimum; a narrowing gives nothing back.
+     * Open the `kind` grip's menu on the row or column it stands for, its
+     * first row that can run the keyboard's, or close it when it is open
+     * there (a grip's click).
      */
-    private nextWidth;
-    /**
-     * The widths `table`'s grid shows, by position (its columns' stored
-     * widths, else the default one): what its template reads, the model's.
-     */
-    private widthsOf;
-    /**
-     * A resize of column `column` of `table`, pressed at `from` (`table.width.fit`,
-     * `table.width.neighbour`): the column may grow by the room the table
-     * leaves free and by what its right neighbour can give (down to the
-     * minimum), so the table never gets wider; it may always narrow.
-     */
-    private resize;
-    private read;
-    /**
-     * Open the menu of a row's or a column's grip (a second press on it
-     * closes it), its first row that can run the keyboard's.
-     */
-    open: (menu: TableMenu) => void;
-    /** Open the `kind` grip's menu on the row or column it stands for, or close it (a grip's click). */
-    toggle: (kind: TableMenu["kind"]) => void;
+    toggle: (kind: Kind) => void;
     /** Whether a menu is open (reactive). */
     get isOpen(): boolean;
     /** Close the menu; the editor takes the keys back. */
     close: () => void;
-    /** The menu element's id (page-unique), for `aria-controls`. */
-    get menuId(): string;
-    /** A row's element id (page-unique), for `aria-activedescendant`. */
-    rowId: (row: TableMenuRow) => string;
     /**
-     * The open menu's rows for a custom `menu`: each the row shape every menu
+     * The open menu's rows for your `menu`: each the row shape every menu
      * shares (`run` runs it and closes the menu, `select` makes it the
      * keyboard's, `option` its attributes), whether it can run now
-     * (`disabled`), whether it deletes (`danger`), and its icon.
+     * (`disabled`) and whether it deletes (`danger`).
      */
     get items(): TableMenuItem[];
     /**
-     * The attributes of the open menu's row at `index`: spread them on its
-     * element (`{...chrome.option(index)}`). Its id, `menuitem` role,
-     * `aria-disabled` when it cannot run now, `data-selected` for the
-     * keyboard's row, which scrolls into view.
+     * The attachment of the open menu's row at `index`
+     * (`{@attach chrome.option(index)}`). Its id, `menuitem` role,
+     * `aria-disabled` when it cannot run now; the keyboard's row scrolls into
+     * view. The menu's element takes
+     * `data-edytor-table-menu` (the kind it is open on) from `popup`.
      */
-    option: (index: number) => OptionAttributes;
-    /**
-     * The menu's element (`{@attach chrome.popup}`): its id, `menu` role and
-     * name (Row options, Column options) unless it has its own, presses that
-     * keep the focus, and its publication to the view's root
-     * (`edytor.popups`: `aria-controls`, `aria-haspopup`) while it is in
-     * the page; `data-edytor-table-menu` names the kind it is open on.
-     */
-    popup: Attachment<HTMLElement>;
+    option(index: number): Attachment<HTMLElement>;
     /**
      * The element that holds the menu's keyboard (`{@attach chrome.keys}`,
      * the menu's own): it takes the focus when it mounts and names the
@@ -200,50 +136,11 @@ export declare class TableChrome {
      * `grip` snippet's payload carries it): in an editable view, dragging it
      * moves its row or column within its table (`table.drag`); a click with
      * no drag opens or closes its menu; ArrowDown opens the menu, Escape
-     * closes it and gives the keys back to the editor. It names the element (its own name wins) and carries
+     * closes it and gives the keys back to the editor. It carries
      * `aria-haspopup`, `aria-expanded`, `aria-controls` while its menu is
      * open, and `data-dragging` during its drag. A press on it is never
      * prevented: that would stop the native drag.
      */
-    gripOf: (kind: TableMenu["kind"]) => Attachment<HTMLElement>;
-    /** The rows of the open menu. */
-    get rows(): TableMenuRow[];
-    /** Run a menu row, then close the menu. */
-    runRow: (row: TableMenuRow) => void;
-    /** The `+` under the table: a row at its end, the caret in its first cell. */
-    addRow: () => void;
-    /** The `+` beside the table: a column at its end. */
-    addColumn: () => void;
-    /**
-     * The release: column `drag.column`'s width, and its right neighbour's
-     * when the column took from it (`table.width.neighbour`), one command;
-     * nothing when neither changed, or when the table does not list the
-     * column. A width is written on its column's entry by its item id (the
-     * first entry naming it), never by position: the stored array may hold
-     * an entry the grid does not show.
-     */
-    private release;
-    /** What the row grip or the column grip stands for now: its table, the row's or column's id, its position. */
-    private source;
-    /** The drag starts: what it moves, its ghost, the page as its drop target, auto-scroll. */
-    private begin;
-    /** The ghost: the row's cells side by side, or the column's cells one under the other. */
-    private preview;
-    /**
-     * Where the moving row or column would land at `input` (`table.drag`):
-     * its gap, by the rows' (columns') middles, and its position once moved;
-     * `null` outside the table (past its box and the gutter) and at its own
-     * place (the gap before or after it).
-     */
-    private landing;
-    /** The pointer moved during the drag: the drop line follows it. */
-    private aim;
-    /**
-     * The drop: the row or column moves to the gap at the pointer (`moveRows`,
-     * `moveColumn`: one command, one undo step), the keys go to the editor;
-     * nothing where no line shows.
-     */
-    private drop;
-    /** The drag ended, dropped or cancelled: no line, no target; the chrome follows the pointer again. */
-    private finish;
+    gripOf: (kind: Kind) => Attachment<HTMLElement>;
 }
+export {};