@dineug/erd-editor 3.7.0 → 3.9.0

package/dist/services/elk-layout/elkGraph.d.ts

@@ -1,9 +1,29 @@
 import { RootState } from '../../engine/state';
+import { GeometrySource } from '../../utils/draw-relationship/geometrySource';
 import { ElkPlacement } from './elkLayoutOptions';
 export type ElkLayoutNode = {
     id: string;
     width: number;
     height: number;
+    /**
+     * Where the source already draws this table, normalized into node widths.
+     * Only a placement whose strategies read a hint is sent one, and a view that
+     * has not placed the table yet hints from where the document draws it.
+     */
+    x?: number;
+    y?: number;
+    /** What is laid out inside this node, which is what makes it a group rather than a table. */
+    children?: ElkLayoutNode[];
+};
+/**
+ * Which tables a request covers and what it measures them by. The source picks
+ * both the sizes and the hints, and grouping packs the tables no relationship
+ * reaches into one box instead of scattering them through the layers.
+ */
+export type ElkLayoutRequestOptions = {
+    tableIds?: string[];
+    source?: GeometrySource;
+    groupUnrelated?: boolean;
 };
 export type ElkLayoutEdge = {
     source: string;
@@ -31,7 +51,17 @@ export type ElkLayoutPoint = {
     x: number;
     y: number;
 };
-export declare function createElkLayoutRequest(state: RootState, placement: ElkPlacement): ElkLayoutRequest;
+/**
+ * What ELK is asked to place, at the sizes the source draws. Nodes carry a
+ * hint of where they already stand where the placement reads one, and grouping
+ * folds the tables no relationship reaches into one packed box.
+ *
+ * @example
+ * createElkLayoutRequest(state, TablePlacement.viewLayered, { source: 'flow' });
+ */
+export declare function createElkLayoutRequest(state: RootState, placement: ElkPlacement, { tableIds, source, groupUnrelated, }?: ElkLayoutRequestOptions): ElkLayoutRequest;
+/** Every table in a node list, which is every node the group nodes do not hold. */
+export declare function flattenElkNodes(nodes: ElkLayoutNode[]): ElkLayoutNode[];
 /**
  * Where each table lands, over the middle of what the document already draws.
  * ELK lays every graph out from its own origin, so a document placed twice
@@ -41,4 +71,13 @@ export declare function createElkLayoutRequest(state: RootState, placement: ElkP
  * onChange(toTablePoints(store.state, request, await createElkLayout(request)));
  */
 export declare function toTablePoints(state: RootState, { nodes }: ElkLayoutRequest, points: ElkLayoutPoint[]): ElkLayoutPoint[];
+/**
+ * Where each table lands in a view, whose coordinates start at its own corner.
+ * A view shares nothing with the document, so unlike a placement of the
+ * document this reads no content rect and centres the layout on nothing.
+ *
+ * @example
+ * dispatch(viewSetLayout({ positions: toViewPoints(request, points) }));
+ */
+export declare function toViewPoints({ nodes }: ElkLayoutRequest, points: ElkLayoutPoint[]): ElkLayoutPoint[];
 //# sourceMappingURL=elkGraph.d.ts.map

package/dist/services/elk-layout/elkLayoutOptions.d.ts

@@ -10,12 +10,33 @@ export declare function isElkPlacement(placement: TablePlacement): placement is
  */
 export declare function usesPorts(placement: ElkPlacement): boolean;
 /**
- * What ELK is told, for the placement the author picked.
+ * Whether the placement reads the coordinate hint a node can carry. Only the
+ * views' preset layers and places interactively; the rest derive both from the
+ * edges alone, and a hint sent with one of those would be paid for and ignored.
+ */
+export declare function usesCoordinateHints(placement: ElkPlacement): boolean;
+/**
+ * The box the tables joined to nothing are gathered in, told what the
+ * reference tells its own and nothing besides: the ratio, under the layered
+ * algorithm around it, which stands them in one column. ELK places the box like any node.
+ */
+export declare const GROUP_NODE_OPTIONS: LayoutOptions;
+/**
+ * What ELK is told, for the placement it was asked for.
  *
  * @example
  * const graph = { id: 'root', layoutOptions: elkLayoutOptions(placement) };
  */
 export declare function elkLayoutOptions(placement: ElkPlacement): LayoutOptions;
+/**
+ * What every node in a layout is told, before the ports a placement may add.
+ * Only the views' preset says anything at this level, so the rest hand ELK a
+ * bare box and let the algorithm's own defaults decide.
+ *
+ * @example
+ * const layoutOptions = elkNodeLayoutOptions(placement);
+ */
+export declare function elkNodeLayoutOptions(placement: ElkPlacement): LayoutOptions | null;
 /**
  * Every algorithm the placements name. ELK registers the metadata of these and
  * no others, so it is read off the options rather than listed: a placement

package/dist/services/elk-layout/elkLayoutService.d.ts

@@ -2,7 +2,11 @@ import { ElkNode, ElkPort } from 'elkjs/lib/elk-api';
 import { ElkLayoutEdge, ElkLayoutPoint, ElkLayoutRequest } from './elkGraph';
 /** One port per relationship endpoint, grouped by the table it sits on. */
 export declare function portsByNode(edges: ElkLayoutEdge[]): Map<string, ElkPort[]>;
-/** The graph ELK is handed, which is flat: an ERD nests no table in another. */
+/**
+ * The graph ELK is handed. An ERD nests no table in another, so the one node
+ * that ever holds children is the group a request packs its unrelated tables
+ * into, and every edge stays at the root whatever level its ends sit on.
+ */
 export declare function toElkGraph({ placement, nodes, edges, }: ElkLayoutRequest): ElkNode;
 /**
  * Places tables by an ELK algorithm, off the thread that asked for it. What

package/dist/services/elk-layout/index.d.ts

@@ -1,13 +1,19 @@
 import { ElkLayoutPoint, ElkLayoutRequest } from './elkGraph';
-export { createElkLayoutRequest, type ElkLayoutPoint, type ElkLayoutRequest, toTablePoints, } from './elkGraph';
+export { createElkLayoutRequest, type ElkLayoutPoint, type ElkLayoutRequest, toTablePoints, toViewPoints, } from './elkGraph';
 export { type ElkPlacement, isElkPlacement } from './elkLayoutOptions';
 /**
- * Where every table goes under the placement the author picked. ELK runs on a
+ * How long a placement runs, the worker's own start included, before the wait
+ * is worth saying out loud. Under it the answer reads as immediate and a
+ * message that appears and goes is worse than none; over it the editor looks stuck.
+ */
+export declare const SLOW_LAYOUT_MS = 6000;
+/**
+ * Where every table goes under the placement it was asked for. ELK runs on a
  * worker and only there, because laying a large schema out holds a thread for
  * long enough to stop the editor drawing.
  *
  * @example
- * const points = await createElkLayout(createElkLayoutRequest(state, placement));
+ * const points = await createElkLayout(request, () => emitter.emit(toast));
  */
-export declare function createElkLayout(request: ElkLayoutRequest): Promise<ElkLayoutPoint[]>;
+export declare function createElkLayout(request: ElkLayoutRequest, onSlow?: () => void): Promise<ElkLayoutPoint[]>;
 //# sourceMappingURL=index.d.ts.map

package/dist/styles/elevation.styles.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The shadow a panel floating over the canvas casts, the pair radix gives its
+ * dropdowns and dialogs. A light panel reads pasted on without it, its border
+ * sitting only a few luminance points off the ground behind.
+ */
+export declare const floatingShadow: import('@dineug/r-html').CSSTemplateLiterals;
+//# sourceMappingURL=elevation.styles.d.ts.map

package/dist/themes/radix-ui-theme.config.d.ts

@@ -1,3 +1,15 @@
 import { Theme } from './tokens';
 export declare const ThemeConfig: Theme;
+/**
+ * What the gray, gold and bronze accents take instead: their low steps sit on
+ * the gray-4 hover, so a selected row stays on gray-6 and a hovered one eases
+ * back to gray-5, as gray-7 would take gray-11 text in light down to 3.76:1.
+ */
+export declare const NeutralAccentThemeConfig: Partial<Theme>;
+/**
+ * What the light appearance takes instead: its gray 1 to 3 sit too close to lift
+ * a table off the canvas, and a step 9 key or line reads under 3:1 on them, so
+ * the boxes go white with a gray-8 edge and the keys drop to step 11.
+ */
+export declare const LightThemeConfig: Partial<Theme>;
 //# sourceMappingURL=radix-ui-theme.config.d.ts.map

package/dist/themes/tokens.d.ts

@@ -26,14 +26,21 @@ export type Theme = {
     canvasBackground: string;
     canvasBoundaryBackground: string;
     tableBackground: string;
+    tableHeaderBackground: string;
     tableSelect: string;
     tableBorder: string;
+    tableShadow: string;
     memoBackground: string;
     memoSelect: string;
     memoBorder: string;
+    memoShadow: string;
     columnSelect: string;
+    columnSelectHover: string;
     columnHover: string;
     relationshipHover: string;
+    visualizationLink: string;
+    visualizationColumn: string;
+    visualizationRelationship: string;
     toolbarBackground: string;
     contextMenuBackground: string;
     contextMenuSelect: string;

package/dist/utils/calcTable.d.ts

@@ -1,6 +1,7 @@
 import { EngineContext } from '../engine/context';
 import { RootState } from '../engine/state';
 import { Table } from '../internal-types';
+import { GeometrySource } from './draw-relationship/geometrySource';
 export declare function getWidthGeneration(): number;
 /**
  * Invalidates every cached table size. Called from recalculateTableWidth,
@@ -19,6 +20,27 @@ export type ColumnWidth = {
     autoIncrement: number;
     unique: number;
 };
-export declare function calcTableHeight(table: Table): number;
+/**
+ * The width a view draws a table at: the header name, or the key badge with
+ * the widest name and type among the rows given, whichever is wider. The rows
+ * are the caller's to name, and the show bits and the column order are the document's, read by no view.
+ */
+export declare function calcViewTableWidths(table: Table, state: RootState, columnIds: string[]): ColumnWidth;
+/**
+ * The width a view header's name takes. Every ui width was measured at the size
+ * and weight the rows are drawn in, and a header is drawn larger and heavier,
+ * so the measured width is scaled by both rather than measured a second time.
+ */
+export declare function viewHeaderNameWidth(widthName: number): number;
+/** The header band a source draws above its rows, each at its own line height. */
+export declare function tableHeaderHeight(source?: GeometrySource): number;
+/**
+ * The height of one row a source draws. The document row is sized around the
+ * input box an editor opens in it and the view row around a line of read only
+ * text, so the two are independent numbers.
+ */
+export declare function tableRowHeight(source?: GeometrySource): number;
+/** The box height for the rows given, every row of the table unless a view shows fewer. */
+export declare function calcTableHeight(table: Table, rowCount?: number, source?: GeometrySource): number;
 export declare function recalculateTableWidth({ doc: { tableIds }, collections }: RootState, { toWidth }: EngineContext): void;
 //# sourceMappingURL=calcTable.d.ts.map

package/dist/utils/clickGesture.d.ts

@@ -0,0 +1,19 @@
+import { Point } from '../internal-types';
+/** How far a press may travel before its release reads as a drag rather than a click, in screen pixels. */
+export declare const CLICK_SLOP = 4;
+/** Where a pointer event landed: the mouse, or the touch it began with or lifted. */
+export declare function pointOf(evt: Event): Point | null;
+/** Whether a release landed near enough to the press to read as a click rather than a drag. */
+export declare function isClick(from: Point, to: Point): boolean;
+/** A press with the main button and no modifier, the only one a view reads as a click. */
+export declare function isPlainPress(evt: MouseEvent | TouchEvent): boolean;
+/**
+ * Calls back once the press given is released as a click. The release is read
+ * off the window rather than off the node pressed, since the scene rebuilds
+ * that node before the lift, and a press with no point to measure reads as nothing.
+ *
+ * @example
+ * onClickRelease(event.evt, () => setViewPinnedTable(store.state, id, kind));
+ */
+export declare function onClickRelease(evt: Event, done: () => void): void;
+//# sourceMappingURL=clickGesture.d.ts.map

package/dist/utils/domEvent.d.ts

@@ -4,6 +4,14 @@ export declare function onStop(event: Event): void;
 export declare function onStopImmediate(event: Event): void;
 export declare function isMouseEvent(event: Event): event is MouseEvent;
 export declare function isTouchEvent(event: Event): event is TouchEvent;
+/** A touch that puts a finger down beside another: a pinch, never a press of its own. */
+export declare function isMultiTouch(event: Event): boolean;
+/**
+ * The editor root, which is where a pan has to take the selection off: the top
+ * toolbar is a sibling of the scene that pans, so suppressing it any lower
+ * leaves a drag that reaches the toolbar free to select its text.
+ */
+export declare function editorRootOf(el: HTMLElement): HTMLElement;
 /**
  * Takes selection off an element for the length of a gesture and hands back the
  * undo. A press allowed to start one lets the browser promote the drag to a

package/dist/utils/draw-relationship/bezier.d.ts

@@ -0,0 +1,32 @@
+import { Point } from '../../internal-types';
+/**
+ * How far a control point is pushed out, relative to the gap it spans. The
+ * reference draws every edge with xyflow's default curvature, and these two
+ * numbers are what put its control points where they sit.
+ */
+export declare const VIEW_CURVATURE = 0.25;
+/**
+ * How many straight chords one view connector's curve is flattened into. Over
+ * the run a view lays out, the widest gap between a chord and the true curve
+ * stays under the half pixel every geometry reader here works to.
+ */
+export declare const VIEW_BEZIER_SEGMENTS = 24;
+/**
+ * How far a control point reaches past its own end where the other end lies
+ * behind it. The only branch that leaves the box the two ends make, so a
+ * culling test carrying this much covers the whole curve.
+ */
+export declare function curveReach(gap: number): number;
+/**
+ * The two control points of the curve between a connector's turning points.
+ * Each leaves straight out of its own end, so the stub run meets the curve
+ * without a corner and the whole turn is carried between them.
+ */
+export declare function bezierControls(from: Point, fromOutward: Point, to: Point, toOutward: Point): [Point, Point];
+/**
+ * That curve as a polyline. Flattening it here is what keeps every reader
+ * downstream working on straight segments: the path serialiser, the hit path,
+ * the particle measurement and the route box all stay as they were.
+ */
+export declare function bezierPolyline(from: Point, fromOutward: Point, to: Point, toOutward: Point, segments?: number): Point[];
+//# sourceMappingURL=bezier.d.ts.map

package/dist/utils/draw-relationship/calc.d.ts

@@ -1,7 +1,12 @@
 import { RootState } from '../../engine/state';
 import { Point, Table } from '../../internal-types';
 import { ObjectPoint } from '.';
-export declare function tableToObjectPoint(state: RootState, table: Table): ObjectPoint;
+import { GeometrySource } from './geometrySource';
+/**
+ * The box and the four edge midpoints the sort anchors against, at the point
+ * and the size the source given draws the table at.
+ */
+export declare function tableToObjectPoint(state: RootState, table: Table, source?: GeometrySource): ObjectPoint;
 export declare function euclideanDistance(a: Point, b: Point): number;
 export declare function manhattanDistance(a: Point, b: Point): number;
 //# sourceMappingURL=calc.d.ts.map

package/dist/utils/draw-relationship/geometrySource.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Which coordinate system a geometry reader works in: the document, or the
+ * view named by its kind. One mode that picks the coordinates, the shown set
+ * and the sort channel at once, so a view never redraws the document under it.
+ */
+export type GeometrySource = 'document' | 'flow';
+/** The sources that are views, which is also the kind of the view slot each reads. */
+export type ViewSource = Exclude<GeometrySource, 'document'>;
+//# sourceMappingURL=geometrySource.d.ts.map

package/dist/utils/draw-relationship/incremental.d.ts

@@ -1,5 +1,6 @@
 import { RootState } from '../../engine/state';
 import { Point } from '../../internal-types';
+import { GeometrySource } from './geometrySource';
 import { Obstacles } from './route';
 export type DirtyBox = {
     left: number;
@@ -31,7 +32,12 @@ export type SortCache = {
     boxes: Map<string, DirtyBox>;
     entries: Map<string, RouteEntry>;
 };
-export declare function getSortCache(state: RootState): SortCache;
+/**
+ * What the last sort of one source over one store left for the next, a cache
+ * per source because the document's boxes and a view's are different layouts
+ * of the same tables, and a diff across them would re-route everything each turn.
+ */
+export declare function getSortCache(state: RootState, source?: GeometrySource): SortCache;
 export declare function boundsOfPoints(points: Point[]): DirtyBox;
 /**
  * Whether a moved table can change a route. The bounding box rather than the

package/dist/utils/draw-relationship/index.d.ts

@@ -1,4 +1,5 @@
-import { Point, Relationship, ValuesType } from '../../internal-types';
+import { Point, Relationship, RelationshipPoint, ValuesType } from '../../internal-types';
+import { GeometrySource } from './geometrySource';
 export declare const DirectionName: {
     readonly left: "left";
     readonly right: "right";
@@ -135,11 +136,26 @@ export declare const ANCHOR_EDGE_INSET = 12;
  * shorter run it touches, so a short run keeps its right angle.
  */
 export declare const ROUTE_CHAMFER = 8;
-export declare function setStubSlots(relationship: Relationship, slots: readonly [number, number]): void;
+/** One end of a connector as the geometry reads it: which table, where on it, and which way out. */
+export type Anchor = Pick<RelationshipPoint, 'x' | 'y' | 'direction'> & {
+    tableId: string;
+};
+export type Anchors = {
+    start: Anchor;
+    end: Anchor;
+};
+export declare function copyAnchor({ tableId, x, y, direction }: Anchor): Anchor;
+/**
+ * Forgets what a source's sorts wrote for these connectors, so a reader sees a
+ * source that never sorted them. Per connector, never the whole channel: the
+ * channels and their epochs are module-wide, and a page may host two stores.
+ */
+export declare function clearSortChannel(relationships: Iterable<Relationship>, source?: GeometrySource): void;
+export declare function setStubSlots(relationship: Relationship, slots: readonly [number, number], source?: GeometrySource): void;
 /** Falls back to slot zero, which reproduces the pre-stagger geometry. */
-export declare function getStubSlots(relationship: Relationship): readonly [number, number];
-export declare function setRoute(relationship: Relationship, points: Point[]): void;
-export declare function getRoute(relationship: Relationship): Point[] | undefined;
+export declare function getStubSlots(relationship: Relationship, source?: GeometrySource): readonly [number, number];
+export declare function setRoute(relationship: Relationship, points: Point[], source?: GeometrySource): void;
+export declare function getRoute(relationship: Relationship, source?: GeometrySource): Point[] | undefined;
 /**
  * How far a connector reaches past its anchor, whichever decoration is furthest
  * out. The ring shares a centre with the second tick, so its outer edge and the
@@ -158,16 +174,26 @@ export type BBox = {
     width: number;
     height: number;
 };
+/** Opens a sort on one source, retiring every route box that source's previous sort wrote. */
+export declare function nextSortEpoch(source?: GeometrySource): void;
+/**
+ * Where a connector's two ends sit, for a reader outside the sort. The
+ * document keeps them on the entity, where its sort wrote them; a view keeps
+ * its own in its channel, and one it has not sorted yet reads the document's.
+ */
+export declare function getAnchors(relationship: Relationship, source?: GeometrySource): Anchors;
 /**
- * Opens a sort, retiring every route box the previous one wrote. Identity
- * outlives a sort, so the stamp a route carries is what separates a box for the
- * current routes from one the next sort has already replaced.
+ * Where a sort leaves a connector's two ends: on the entity for the document,
+ * the one derived geometry written to it, and in the channel for a view, which
+ * writes nothing to the document. Copied, so the channel never aliases a caller's object.
  */
-export declare function nextSortEpoch(): void;
+export declare function setAnchors(relationship: Relationship, { start, end }: Anchors, source?: GeometrySource): void;
+/** How thick a connector is drawn in the source given, markers and all. */
+export declare function relationshipStrokeWidth(source?: GeometrySource): number;
 /**
  * Everywhere a relationship can be drawn, for a culling test that must not lose
- * a connector whose anchors are on screen and whose route is not. Without a
+ * a connector whose anchors are on screen and whose drawn run is not. Without a
  * route from this sort the stub ends are unknown, so the padding carries them.
  */
-export declare function getRouteBBox(relationship: Relationship, strokeWidth?: number): BBox;
+export declare function getRouteBBox(relationship: Relationship, strokeWidth?: number, source?: GeometrySource): BBox;
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/draw-relationship/pathFinding.d.ts

@@ -1,6 +1,7 @@
 import { Point, Relationship } from '../../internal-types';
 import { RelationshipPath } from '.';
-export declare function getRelationshipPath(relationship: Relationship): RelationshipPath;
+import { GeometrySource } from './geometrySource';
+export declare function getRelationshipPath(relationship: Relationship, source?: GeometrySource): RelationshipPath;
 /**
  * The routing polyline as one d, so a connector is a single element whatever the
  * router and the corner cuts made of it. The segments are contiguous by

package/dist/utils/draw-relationship/route.d.ts

@@ -1,5 +1,6 @@
 import { RootState } from '../../engine/state';
 import { Point } from '../../internal-types';
+import { GeometrySource } from './geometrySource';
 export type Obstacles = {
     ids: string[];
     left: Float64Array;
@@ -8,10 +9,11 @@ export type Obstacles = {
     bottom: Float64Array;
 };
 /**
- * Every table in the document, not only those carrying a relationship: a table
- * with no relationships at all still blocks the view.
+ * Every table the source shows, not only those carrying a relationship: a
+ * table with no relationships at all still blocks the view. For a view that is
+ * the tables it places, at the points it places them.
  */
-export declare function collectObstacles(state: RootState): Obstacles;
+export declare function collectObstacles(state: RootState, source?: GeometrySource): Obstacles;
 /** Liang–Barsky, with no divisions until a slab actually clips. */
 export declare function segmentHitsBox(ax: number, ay: number, bx: number, by: number, left: number, top: number, right: number, bottom: number): boolean;
 /**

package/dist/utils/draw-relationship/sort.d.ts

@@ -1,3 +1,4 @@
 import { RootState } from '../../engine/state';
-export declare function relationshipSort(state: RootState): void;
+import { GeometrySource } from './geometrySource';
+export declare function relationshipSort(state: RootState, source?: GeometrySource): void;
 //# sourceMappingURL=sort.d.ts.map

package/dist/utils/draw-relationship/stub.d.ts

@@ -1,4 +1,5 @@
-import { Point, Relationship } from '../../internal-types';
+import { Point } from '../../internal-types';
+import { Anchor, Anchors } from '.';
 /**
  * Slot zero keeps the historical PATH_END_HEIGHT, so a relationship that never
  * went through relationshipSort draws exactly as it did before.
@@ -9,7 +10,7 @@ export declare function stubFor(slot: number): number;
  * null when they do not. Only this arrangement can collapse: a gap of twice the
  * stub puts both turning points on one spot, and a smaller gap inverts the path.
  */
-export declare function facingGap(start: Relationship['start'], end: Relationship['end']): number | null;
+export declare function facingGap(start: Anchor, end: Anchor): number | null;
 /**
  * Below roughly 2 * MIN_STUB the two cardinality decorations already overlap
  * each other, which no stub length can fix; the clamp stops short of making it
@@ -27,8 +28,12 @@ export type StubEnds = {
 export declare function isHorizontal(direction: number): direction is 1 | 2;
 /** +1 when the anchor's outward normal points right or down. */
 export declare function outwardSign(direction: number): 1 | -1;
-/** The two points a route has to join, given the anchors and their slots. */
-export declare function stubEnds(relationship: Relationship): StubEnds;
+/**
+ * The two points a route has to join, given the anchors and the slot each end
+ * took. Both come from the sort in hand rather than a channel, so the document
+ * and a view route from what they just placed and never from each other.
+ */
+export declare function stubEnds({ start, end }: Anchors, [startSlot, endSlot]: readonly [number, number]): StubEnds;
 /**
  * Where the guide line begins — the short run between the cardinality
  * decorations and the routed polyline.

package/dist/utils/emitter.d.ts

@@ -2,6 +2,7 @@ import { Action, AnyAction, DOMTemplateLiterals } from '@dineug/r-html';
 import { TablePlacement } from '../constants/tablePlacement';
 import { ValuesType } from '../internal-types';
 import { ThemeOptions } from '../themes/radix-ui-theme';
+import { GeometrySource } from './draw-relationship/geometrySource';
 declare const InternalActionType: {
     readonly openColorPicker: "openColorPicker";
     readonly closeColorPicker: "closeColorPicker";
@@ -62,6 +63,7 @@ type InternalActionMap = {
     [InternalActionType.dragSelectStart]: {
         x: number;
         y: number;
+        source: GeometrySource;
     };
 };
 type ListenerRecord = {
@@ -197,9 +199,11 @@ export declare const dragSelectStartAction: {
     (payload: {
         x: number;
         y: number;
+        source: GeometrySource;
     }): AnyAction<{
         x: number;
         y: number;
+        source: GeometrySource;
     }>;
     toString(): string;
     type: string;

package/dist/utils/keyboard-shortcut/index.d.ts

@@ -24,6 +24,7 @@ export declare const KeyBindingName: {
     readonly relationshipOneOnly: "relationshipOneOnly";
     readonly relationshipOneN: "relationshipOneN";
     readonly tableProperties: "tableProperties";
+    readonly focusView: "focusView";
     readonly zoomIn: "zoomIn";
     readonly zoomOut: "zoomOut";
     readonly zoomReset: "zoomReset";
@@ -31,7 +32,7 @@ export declare const KeyBindingName: {
     readonly zenMode: "zenMode";
 };
 export type KeyBindingName = ValuesType<typeof KeyBindingName>;
-export declare const KeyBindingNameList: ("undo" | "redo" | "selectAllColumn" | "search" | "stop" | "edit" | "addMemo" | "addTable" | "removeTable" | "addColumn" | "removeColumn" | "primaryKey" | "selectAllTable" | "relationshipZeroOne" | "relationshipZeroN" | "relationshipOneOnly" | "relationshipOneN" | "tableProperties" | "zoomIn" | "zoomOut" | "zoomReset" | "handTool" | "zenMode")[];
+export declare const KeyBindingNameList: ("undo" | "redo" | "selectAllColumn" | "search" | "stop" | "edit" | "addMemo" | "addTable" | "removeTable" | "addColumn" | "removeColumn" | "primaryKey" | "selectAllTable" | "relationshipZeroOne" | "relationshipZeroN" | "relationshipOneOnly" | "relationshipOneN" | "tableProperties" | "focusView" | "zoomIn" | "zoomOut" | "zoomReset" | "handTool" | "zenMode")[];
 export type KeyBindingMap = Record<KeyBindingName, ShortcutOption[]>;
 export declare const createKeyBindingMap: () => KeyBindingMap;
 export declare function shortcutToTuple(shortcut?: string): KeyBindingPress[];

package/dist/utils/pinch.d.ts

@@ -0,0 +1,34 @@
+import { Subscription } from 'rxjs';
+import { Point } from '../internal-types';
+/**
+ * Whether a wheel is a trackpad pinch, which a browser sends as a ctrl wheel.
+ * On Apple devices the zoom chord is the command key, so every ctrl wheel is
+ * one; elsewhere ctrl is the chord too, and only a wheel short of a notch is.
+ */
+export declare function isPinchWheel(event: WheelEvent): boolean;
+/** How much a pinch wheel scales the zoom: the scale the browser encoded in it. */
+export declare function pinchWheelScale({ deltaY }: WheelEvent): number;
+/** Where a pinch stands: how far it has scaled since it began, and its centre now. */
+export type Pinch = {
+    scale: number;
+    center: Point;
+};
+/**
+ * What a scene makes of a pinch beginning at the point given, in its own box:
+ * the step to take on every move after, or null to let the pinch go by.
+ */
+export type PinchStart = (center: Point) => ((pinch: Pinch) => void) | null;
+/**
+ * The pinches a scene box takes besides the wheel: two fingers on a touch
+ * screen, and Safari's trackpad pinch, which reaches a page as gesture events.
+ * iOS sends both for one pinch, so the fingers win and the gestures stand down.
+ *
+ * @example
+ * const pinch = createPinch(() => root.value, center => step);
+ * onMounted(() => addUnsubscribe(pinch.listen()));
+ */
+export declare function createPinch(box: () => HTMLElement, start: PinchStart): {
+    handleTouchstart: (event: MouseEvent | TouchEvent) => boolean;
+    listen: () => Subscription;
+};
+//# sourceMappingURL=pinch.d.ts.map

package/dist/utils/validation.d.ts

@@ -1,4 +1,5 @@
 export declare const toNumString: (value: string) => string;
+export declare const zoomInRange: (value: number) => number;
 export declare const maxWidthCommentInRange: (value: number) => number;
 export declare function canvasSizeInRange(size: number | string): number;
 export declare function zoomLevelInRange(zoom: number): number;

package/dist/workers/elkLayout.shared-worker.js

@@ -1 +1 @@
-import*as e from"comlink";typeof document>`u`&&Reflect.set(globalThis,`document`,{});const t={force:`force`,layeredHorizontal:`layeredHorizontal`,layeredVertical:`layeredVertical`,flow:`flow`};t.force;function n(e){return e!==t.force}function r(e){return e===t.flow}const i={"elk.spacing.nodeNode":`80`,"elk.separateConnectedComponents":`true`,"elk.spacing.componentComponent":`160`},a=e=>({...i,"elk.algorithm":`layered`,"elk.direction":e,"elk.layered.spacing.nodeNodeBetweenLayers":`160`,"elk.layered.cycleBreaking.strategy":`DEPTH_FIRST`});function o(e){switch(e){case t.layeredHorizontal:return a(`RIGHT`);case t.layeredVertical:return a(`DOWN`);case t.flow:return{...a(`RIGHT`),"elk.layered.nodePlacement.strategy":`SIMPLE`,"elk.layered.spacing.edgeNodeBetweenLayers":`80`}}}const s=[...new Set(Object.values(t).filter(n).map(e=>o(e)[`elk.algorithm`]))],c=`EAST`,l=e=>`edge-${e}-source`,u=e=>`edge-${e}-target`;function d(e,t){return e.side===t.side?e.side===c?e.row-t.row:t.row-e.row:e.side===c?-1:1}function f(e){let t=new Map,n=(e,n)=>{let r=t.get(e);r?r.push(n):t.set(e,[n])};return e.forEach((e,t)=>{n(e.source,{id:l(t),row:e.sourceRow,side:c}),n(e.target,{id:u(t),row:e.targetRow,side:`WEST`})}),new Map([...t].map(([e,t])=>[e,t.sort(d).map(({id:e,side:t})=>({id:e,width:8,height:8,layoutOptions:{"elk.port.side":t}}))]))}function p({placement:e,nodes:t,edges:n}){let i=r(e)?f(n):null;return{id:`root`,layoutOptions:o(e),children:t.map(({id:e,width:t,height:n})=>({id:e,width:t,height:n,...i?{layoutOptions:{"elk.portConstraints":`FIXED_ORDER`},ports:i.get(e)??[]}:{}})),edges:n.map(({source:e,target:t},n)=>({id:`edge-${n}`,sources:[i?l(n):e],targets:[i?u(n):t]}))}}let m=null;function h(){return m??=import(`elkjs/lib/elk.bundled.js`).then(({default:e})=>new e({algorithms:s})),m}const g=new class{async ready(){return await h(),!0}async layout(e){return((await(await h()).layout(p(e))).children??[]).map(({id:e,x:t,y:n})=>({id:e,x:t??0,y:n??0}))}};self.onconnect=t=>{let n=t.ports[0];e.expose(g,n)};
+import*as e from"comlink";typeof document>`u`&&Reflect.set(globalThis,`document`,{});const t={force:`force`,layeredHorizontal:`layeredHorizontal`,layeredVertical:`layeredVertical`,flow:`flow`,viewLayered:`viewLayered`};t.force;function n(e){return e!==t.force}function r(e){return e===t.flow}const i={"elk.algorithm":`layered`,"elk.layered.spacing.baseValue":`40`,"elk.spacing.componentComponent":`80`,"elk.layered.spacing.edgeNodeBetweenLayers":`120`,"elk.layered.considerModelOrder.strategy":`PREFER_EDGES`,"elk.layered.crossingMinimization.forceNodeModelOrder":`true`,"elk.layered.mergeEdges":`true`,"elk.layered.nodePlacement.strategy":`INTERACTIVE`,"elk.layered.layering.strategy":`INTERACTIVE`},a={"elk.alignment":`LEFT`},o={"elk.aspectRatio":`0.5625`},s={"elk.spacing.nodeNode":`80`,"elk.separateConnectedComponents":`true`,"elk.spacing.componentComponent":`160`},c=e=>({...s,"elk.algorithm":`layered`,"elk.direction":e,"elk.layered.spacing.nodeNodeBetweenLayers":`160`,"elk.layered.cycleBreaking.strategy":`DEPTH_FIRST`});function l(e){switch(e){case t.layeredHorizontal:return c(`RIGHT`);case t.layeredVertical:return c(`DOWN`);case t.flow:return{...c(`RIGHT`),"elk.layered.nodePlacement.strategy":`SIMPLE`,"elk.layered.spacing.edgeNodeBetweenLayers":`80`};case t.viewLayered:return{...i}}}function u(e){return e===t.viewLayered?{...a}:null}const d=[...new Set(Object.values(t).filter(n).map(e=>l(e)[`elk.algorithm`]))],f=`EAST`,p=e=>`edge-${e}-source`,m=e=>`edge-${e}-target`;function h(e,t){return e.side===t.side?e.side===f?e.row-t.row:t.row-e.row:e.side===f?-1:1}function g(e){let t=new Map,n=(e,n)=>{let r=t.get(e);r?r.push(n):t.set(e,[n])};return e.forEach((e,t)=>{n(e.source,{id:p(t),row:e.sourceRow,side:f}),n(e.target,{id:m(t),row:e.targetRow,side:`WEST`})}),new Map([...t].map(([e,t])=>[e,t.sort(h).map(({id:e,side:t})=>({id:e,width:8,height:8,layoutOptions:{"elk.port.side":t}}))]))}function _({placement:e,nodes:t,edges:n}){let i=r(e)?g(n):null;return{id:`root`,layoutOptions:l(e),children:t.map(t=>v(t,e,i)),edges:n.map(({source:e,target:t},n)=>({id:`edge-${n}`,sources:[i?p(n):e],targets:[i?m(n):t]}))}}function v({id:e,width:t,height:n,x:r,y:i,children:a},s,c){if(a?.length)return{id:e,width:t,height:n,layoutOptions:{...o},children:a.map(e=>v(e,s,c))};let l={...u(s),...c?{"elk.portConstraints":`FIXED_ORDER`}:{}};return{id:e,width:t,height:n,...r===void 0?{}:{x:r},...i===void 0?{}:{y:i},...Object.keys(l).length?{layoutOptions:l}:{},...c?{ports:c.get(e)??[]}:{}}}function y(e,t,n){return e.flatMap(({id:e,x:r,y:i,children:a})=>{let o=t+(r??0),s=n+(i??0);return a?.length?y(a,o,s):[{id:e,x:o,y:s}]})}let b=null;function x(){return b??=import(`elkjs/lib/elk.bundled.js`).then(({default:e})=>new e({algorithms:d})),b}const S=new class{async ready(){return await x(),!0}async layout(e){return y((await(await x()).layout(_(e))).children??[],0,0)}};self.onconnect=t=>{let n=t.ports[0];e.expose(S,n)};