@dineug/erd-editor 3.4.0 → 3.5.0

package/dist/components/visualization/table/column/Column.d.ts

@@ -2,7 +2,6 @@ import { FC } from '@dineug/r-html';
 import { Column } from '../../../../internal-types';
 export type ColumnProps = {
     column: Column;
-    selected: boolean;
     widthName: number;
     widthDataType: number;
     widthDefault: number;

package/dist/components/visualization/visualizationView.d.ts

@@ -0,0 +1,90 @@
+import { Point } from '../../internal-types';
+import { Group, VisualizationLink, VisualizationNode } from './createVisualization';
+/** The most of a table name a label shows before it is cut. */
+export declare const NAME_MAX_LENGTH = 15;
+/**
+ * A name as its label shows it. The cut counts code points rather than UTF-16
+ * units, so a name ending in an emoji or a CJK glyph is never split inside one.
+ *
+ * @example
+ * truncateName('a_very_long_table_name'); // 'a_very_long_tab…'
+ */
+export declare function truncateName(name: string): string;
+/** The text a table's label draws: its name cut to length, or a placeholder. */
+export declare function labelOf(node: Pick<VisualizationNode, 'name'>): string;
+/** Whether a table has a name of its own, which is what its label is painted by. */
+export declare const hasName: (node: Pick<VisualizationNode, "name">) => boolean;
+export declare const TABLE_RADIUS = 8;
+export declare const COLUMN_RADIUS = 4;
+/** A table draws larger than the columns that hang off it. */
+export declare const nodeRadius: (group: Group) => number;
+/**
+ * What a dot, a line or a name fades to while it sits outside the lit
+ * neighbourhood of a hovered table, so that neighbourhood reads on its own.
+ */
+export declare const DIM_OPACITY = 0.2;
+/** The ids a hovered table lights up: nodes on one side, links on the other. */
+export type Highlight = {
+    nodeIds: Set<string>;
+    linkIds: Set<string>;
+};
+/**
+ * What a hovered table lights: itself, every link at it and whatever sits at
+ * the other end of each, which is its own columns and the tables its
+ * relationships join either way round. The rest is what the scene fades.
+ *
+ * @example
+ * const { nodeIds, linkIds } = highlightOf(graph.links, 't1');
+ */
+export declare function highlightOf(links: VisualizationLink[], tableId: string): Highlight;
+/**
+ * The scale a table name is fully gone below and the one it is whole from,
+ * fading between the two: the graph reads as shapes from afar and as names at
+ * rest, as Obsidian's graph does. A column carries no name at any scale.
+ */
+export declare const LABEL_FADE_START = 0.5;
+export declare const LABEL_FADE_END = 1;
+export declare function labelOpacity(scale: number): number;
+export declare const ZOOM_MIN = 0.1;
+export declare const ZOOM_MAX = 4;
+/** Where the scene's origin sits on the stage, and how large a scene unit is. */
+export type VisualizationView = {
+    x: number;
+    y: number;
+    scale: number;
+};
+/** The origin at the middle of the stage, where the forces gather the graph. */
+export declare function createView(width: number, height: number): VisualizationView;
+/**
+ * The view after a zoom about a stage point. The scene point under that point
+ * is held still, so whatever the pointer is over grows or shrinks around it.
+ *
+ * @example
+ * const next = zoomAt(view, { x: event.offsetX, y: event.offsetY }, 1.2);
+ */
+export declare function zoomAt(view: VisualizationView, point: Point, factor: number): VisualizationView;
+/**
+ * How much a wheel event scales the view, above one for a wheel rolled away
+ * from the user. Exponential in the travel, so a notch each way cancels out.
+ */
+export declare function wheelZoomFactor(deltaY: number, deltaMode?: number): number;
+/**
+ * Everything the panel keeps between renders, and none of it in the store: the
+ * view is this client's alone and a force layout is not part of the document.
+ */
+export type VisualizationState = VisualizationView & {
+    /** Bumped by every simulation step, which is what redraws the moved graph. */
+    tick: number;
+    /** A node or the view is being dragged, which is when no preview opens. */
+    drag: boolean;
+    /** The dot under the pointer, table or column, the one that wears the ring. */
+    hoveredId: string | null;
+    /**
+     * The hovered dot when it is a table, and null over a column: the preview
+     * opens for it, and the graph fades around its neighbourhood.
+     */
+    hoveredTableId: string | null;
+    previewX: number;
+    previewY: number;
+};
+export declare function createVisualizationState(width: number, height: number): VisualizationState;

package/dist/constants/language.d.ts

@@ -1,6 +1,6 @@
 /**
- * Shiki grammar names. Spelled out rather than left as `string`, which is what
- * the annotation used to widen them to — `CodeBlock`'s `lang` is a union, and
+ * Shiki grammar names. Spelled out rather than left as string, which is what
+ * the annotation used to widen them to — CodeBlock's lang is a union, and
  * widening here meant nothing checked that these were members of it.
  */
 export type Lang = 'csharp' | 'go' | 'graphql' | 'java' | 'kotlin' | 'python' | 'scala' | 'sql' | 'typescript';

package/dist/constants/layout.d.ts

@@ -33,21 +33,14 @@ export declare const MINIMAP_MARGIN = 20;
 export declare const TOOLBAR_HEIGHT = 30;
 export declare const DIFF_TREE_WIDTH = 200;
 /**
- * How thick a relationship connector is drawn.
- *
- * Down from 3: the thick line ate the gap between neighbouring tables and made a
- * busy diagram read as a mass of strokes rather than as connections. A whole
- * number rather than 1.5, so the stroke lands on pixel boundaries instead of
- * being spread across two rows at partial alpha on a 1x display.
+ * How thick a relationship connector is drawn. A whole number rather than a
+ * fraction, so the stroke lands on pixel boundaries instead of spreading across
+ * two rows at partial alpha on a 1x display.
  */
 export declare const RELATIONSHIP_STROKE_WIDTH = 2;
 /**
- * The width of the invisible band that catches the pointer for a connector.
- *
- * Hit-testing an SVG path follows its painted stroke, so halving the stroke
- * would otherwise halve the target the user has to hit to hover a relationship
- * or open its context menu. `NUDGE_GAP` is 10, so a band this wide stays clear
- * of the neighbouring corridor except where the router had to fall back to a
- * narrower gap.
+ * The invisible band that catches the pointer for a connector, because
+ * hit-testing follows the painted stroke. Narrower than NUDGE_GAP, so it stays
+ * clear of the neighbouring corridor at the router's usual separation.
  */
 export declare const RELATIONSHIP_HIT_STROKE_WIDTH = 8;

package/dist/constants/schema.d.ts

@@ -109,7 +109,7 @@ export declare const SaveSettingType: {
 };
 export declare const CANVAS_SIZE_MAX: 20000;
 export declare const CANVAS_SIZE_MIN: 2000;
-export declare const CANVAS_ZOOM_MAX: 1;
+export declare const CANVAS_ZOOM_MAX: 1.5;
 export declare const CANVAS_ZOOM_MIN: 0.1;
 export declare const BracketTypeMap: Record<number, string>;
 export declare const ColumnTypeToName: Record<number, string>;

package/dist/engine/modules/editor/actions.d.ts

@@ -20,6 +20,9 @@ export declare const ActionType: {
     readonly focusMoveTable: "editor.focusMoveTable";
     readonly editTable: "editor.editTable";
     readonly editTableEnd: "editor.editTableEnd";
+    readonly editMemo: "editor.editMemo";
+    readonly editMemoEnd: "editor.editMemoEnd";
+    readonly scrollMemo: "editor.scrollMemo";
     readonly selectAllColumn: "editor.selectAllColumn";
     readonly drawStartRelationship: "editor.drawStartRelationship";
     readonly drawStartAddRelationship: "editor.drawStartAddRelationship";
@@ -78,6 +81,15 @@ export type ActionMap = {
     };
     [ActionType.editTable]: void;
     [ActionType.editTableEnd]: void;
+    [ActionType.editMemo]: {
+        id: string;
+    };
+    [ActionType.editMemoEnd]: void;
+    [ActionType.scrollMemo]: {
+        id: string;
+        /** How far down its body the memo is shown from, in body px. */
+        scrollTop: number;
+    };
     [ActionType.selectAllColumn]: void;
     [ActionType.drawStartRelationship]: {
         relationshipType: number;

package/dist/engine/modules/editor/atom.actions.d.ts

@@ -121,6 +121,31 @@ export declare const editTableEndAction: {
     toString(): string;
     type: string;
 };
+export declare const editMemoAction: {
+    (payload: {
+        id: string;
+    }): import('@dineug/r-html').AnyAction<{
+        id: string;
+    }>;
+    toString(): string;
+    type: string;
+};
+export declare const editMemoEndAction: {
+    (payload: void): import('@dineug/r-html').AnyAction<void>;
+    toString(): string;
+    type: string;
+};
+export declare const scrollMemoAction: {
+    (payload: {
+        id: string;
+        scrollTop: number;
+    }): import('@dineug/r-html').AnyAction<{
+        id: string;
+        scrollTop: number;
+    }>;
+    toString(): string;
+    type: string;
+};
 export declare const selectAllColumnAction: {
     (payload: void): import('@dineug/r-html').AnyAction<void>;
     toString(): string;
@@ -281,6 +306,9 @@ export declare const editorReducers: {
     "editor.focusMoveTable": ReducerType<"editor.focusMoveTable">;
     "editor.editTable": ReducerType<"editor.editTable">;
     "editor.editTableEnd": ReducerType<"editor.editTableEnd">;
+    "editor.editMemo": ReducerType<"editor.editMemo">;
+    "editor.editMemoEnd": ReducerType<"editor.editMemoEnd">;
+    "editor.scrollMemo": ReducerType<"editor.scrollMemo">;
     "editor.selectAllColumn": ReducerType<"editor.selectAllColumn">;
     "editor.drawStartRelationship": ReducerType<"editor.drawStartRelationship">;
     "editor.drawStartAddRelationship": ReducerType<"editor.drawStartAddRelationship">;
@@ -420,6 +448,31 @@ export declare const actions: {
         toString(): string;
         type: string;
     };
+    editMemoAction: {
+        (payload: {
+            id: string;
+        }): import('@dineug/r-html').AnyAction<{
+            id: string;
+        }>;
+        toString(): string;
+        type: string;
+    };
+    editMemoEndAction: {
+        (payload: void): import('@dineug/r-html').AnyAction<void>;
+        toString(): string;
+        type: string;
+    };
+    scrollMemoAction: {
+        (payload: {
+            id: string;
+            scrollTop: number;
+        }): import('@dineug/r-html').AnyAction<{
+            id: string;
+            scrollTop: number;
+        }>;
+        toString(): string;
+        type: string;
+    };
     selectAllColumnAction: {
         (payload: void): import('@dineug/r-html').AnyAction<void>;
         toString(): string;

package/dist/engine/modules/editor/state.d.ts

@@ -7,6 +7,14 @@ export type Editor = {
     hasRedo: boolean;
     viewport: Viewport;
     focusTable: FocusTable | null;
+    /** The memo whose body an overlay editor is open on, and null while none is. */
+    editMemoId: string | null;
+    /**
+     * How far down its body each memo is shown from, by memo id. The scene and
+     * the overlay editor both read it, so the lines a body shows survive the
+     * editor opening and closing over it. Local to this client, never the file.
+     */
+    memoScrollTopMap: Record<string, number>;
     drawRelationship: DrawRelationship | null;
     hoverColumnMap: Record<string, boolean>;
     hoverRelationshipMap: Record<string, boolean>;
@@ -93,4 +101,16 @@ export declare const MoveKey: {
 };
 export type MoveKey = ValuesType<typeof MoveKey>;
 export declare const hasMoveKeys: (value: string) => boolean;
+/**
+ * Whether the memo body editor owns the keyboard. Its textarea covers no grid,
+ * so the traversal and edit keys a focused table would otherwise answer belong
+ * to the caret for as long as it is open.
+ */
+export declare const isEditingMemo: ({ editMemoId }: Editor) => boolean;
+/**
+ * Whether a live text editor owns the keyboard. A memo body and a table cell
+ * both open a real input over the scene, so a canvas shortcut stands down for
+ * either of them rather than for the cell alone.
+ */
+export declare const isEditingText: (editor: Editor) => boolean;
 export declare const createEditor: () => Editor;

package/dist/engine/modules/settings/atom.actions.d.ts

@@ -1,3 +1,5 @@
+import { Viewport } from '../editor/state';
+import { Settings } from '../../../internal-types';
 import { ReducerType } from './actions';
 export declare const changeDatabaseNameAction: {
     (payload: {
@@ -37,6 +39,28 @@ export declare const streamZoomLevelAction: {
     toString(): string;
     type: string;
 };
+/** How far the scroll may travel on one axis, measured in screen pixels. */
+export type ScrollRange = {
+    min: number;
+    max: number;
+};
+export type ScrollRanges = {
+    left: ScrollRange;
+    top: ScrollRange;
+};
+/** The canvas box and the zoom that draws it, which is all a range needs. */
+export type ScrollTransform = Pick<Settings, 'width' | 'height' | 'zoomLevel'>;
+/**
+ * How far the scroll may travel on each axis. A scene layer sits at the scroll
+ * plus the zoom viewport offset, so magnifying reaches further both ways, while
+ * shrinking closes the travel in by the zoom instead of leaving the box's own.
+ */
+export declare function getScrollRanges(settings: ScrollTransform, viewport: Viewport): ScrollRanges;
+/** The clamps every reducer that writes a scroll offset shares. */
+export declare function createScrollInRange(settings: ScrollTransform, viewport: Viewport): {
+    scrollLeftInRange: (num: number) => number;
+    scrollTopInRange: (num: number) => number;
+};
 export declare const scrollToAction: {
     (payload: {
         scrollTop: number;

package/dist/engine.js

@@ -1,36 +1,36 @@
 /*!
 * @dineug/erd-editor
-* @version 3.4.0 | Sat Aug 29 2026
+* @version 3.5.0 | Sat Sep 05 2026
 * @author SeungHwan-Lee <dineug2@gmail.com>
 * @license MIT
 */
-import { $ as e, C as t, Di as n, E as r, Fr as i, Jn as a, Rr as o, Vr as s, g as c, i as l, ii as u, n as d, pi as f, sr as p, t as m, ti as h, vi as g, x as _, xi as v } from "./schemaGCService-DAGNq0wk.js";
+import { Ai as e, Fi as t, Kn as n, Qr as r, Ri as i, Wi as a, _ as o, b as s, h as c, i as l, ii as u, n as d, t as f, ti as p, u as m, ut as h, vi as g, wr as _, xi as v } from "./schemaGCService-DrlqIen8.js";
 //#region src/engine/replication-store.ts
 var y = { change: "change" };
 function b(b) {
-	let x = /* @__PURE__ */ new Set(), S = t(b), C = c(S, !1), w = l(C), T = new h(), E = new u((e) => C.subscribe((t) => e.next(t))).pipe(_(r), o(200)), D = /* @__PURE__ */ new Set(), O = new m(), k = (e) => (D.has(e) || D.add(e), () => {
+	let x = /* @__PURE__ */ new Set(), S = o(b), C = m(S, !1), w = l(C), T = new g(), E = new v((e) => C.subscribe((t) => e.next(t))).pipe(c(s), p(200)), D = /* @__PURE__ */ new Set(), O = new f(), k = (e) => (D.has(e) || D.add(e), () => {
 		D.delete(e);
 	}), A = (e, t) => {
 		D.forEach((n) => {
 			let r = Reflect.get(n, e);
-			v(r, t);
+			i(r, t);
 		});
 	}, j = (t) => {
-		let n = p(t);
-		C.dispatchSync(e(i(n) ? "{}" : n)), O.run(f(C.state)).then((e) => {
-			(e.tableIds.length || e.tableColumnIds.length || e.relationshipIds.length || e.indexIds.length || e.indexColumnIds.length || e.memoIds.length) && (d(C.state, e), C.dispatchSync(a()));
+		let i = _(t);
+		C.dispatchSync(h(r(i) ? "{}" : i)), O.run(e(C.state)).then((e) => {
+			(e.tableIds.length || e.tableColumnIds.length || e.relationshipIds.length || e.indexIds.length || e.indexColumnIds.length || e.memoIds.length) && (d(C.state, e), C.dispatchSync(n()));
 		});
 	}, M = (e) => {
 		T.next([e].flat());
 	};
-	return x.add(E.subscribe(() => A(y.change, void 0))).add(T.pipe(_(r), s((e) => e.map((e) => n(e, ["tags"])))).subscribe(C.dispatchSync)), Object.freeze({
+	return x.add(E.subscribe(() => A(y.change, void 0))).add(T.pipe(c(s), u((e) => e.map((e) => a(e, ["tags"])))).subscribe(C.dispatchSync)), Object.freeze({
 		get value() {
-			return f(C.state);
+			return e(C.state);
 		},
 		on: k,
 		setInitialValue: j,
 		dispatch: (e) => {
-			g(() => M(e));
+			t(() => M(e));
 		},
 		dispatchSync: M,
 		destroy: () => {