@dineug/erd-editor 3.6.0 → 3.7.0

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

@@ -0,0 +1,44 @@
+import { RootState } from '../../engine/state';
+import { ElkPlacement } from './elkLayoutOptions';
+export type ElkLayoutNode = {
+    id: string;
+    width: number;
+    height: number;
+};
+export type ElkLayoutEdge = {
+    source: string;
+    target: string;
+    /**
+     * Which row of each table the relationship meets, counted from the top, or
+     * -1 where the column it names is gone. A placement that hands ELK ports
+     * orders them by this, so a layout reads the connectors the editor draws.
+     */
+    sourceRow: number;
+    targetRow: number;
+};
+/**
+ * A layout as it crosses a realm boundary. Only the boxes and what joins them
+ * travel, so the answering realm measures no text and reads no document.
+ */
+export type ElkLayoutRequest = {
+    placement: ElkPlacement;
+    nodes: ElkLayoutNode[];
+    edges: ElkLayoutEdge[];
+};
+/** Where one table's top left corner ended up, in scene units. */
+export type ElkLayoutPoint = {
+    id: string;
+    x: number;
+    y: number;
+};
+export declare function createElkLayoutRequest(state: RootState, placement: ElkPlacement): ElkLayoutRequest;
+/**
+ * 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
+ * would otherwise walk away from where it was read.
+ *
+ * @example
+ * onChange(toTablePoints(store.state, request, await createElkLayout(request)));
+ */
+export declare function toTablePoints(state: RootState, { nodes }: ElkLayoutRequest, points: ElkLayoutPoint[]): ElkLayoutPoint[];
+//# sourceMappingURL=elkGraph.d.ts.map

package/dist/services/elk-layout/elkLayout.shared-worker.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=elkLayout.shared-worker.d.ts.map

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

@@ -0,0 +1,25 @@
+import { LayoutOptions } from 'elkjs/lib/elk-api';
+import { TablePlacement } from '../../constants/tablePlacement';
+/** The placements ELK answers, which is every one but the force simulation. */
+export type ElkPlacement = Exclude<TablePlacement, typeof TablePlacement.force>;
+export declare function isElkPlacement(placement: TablePlacement): placement is ElkPlacement;
+/**
+ * Whether ELK is handed a port per relationship endpoint rather than a bare
+ * box. The layered placements ask only where a table goes; flow also says
+ * where each connector meets it, which is what pulls the crossings out.
+ */
+export declare function usesPorts(placement: ElkPlacement): boolean;
+/**
+ * What ELK is told, for the placement the author picked.
+ *
+ * @example
+ * const graph = { id: 'root', layoutOptions: elkLayoutOptions(placement) };
+ */
+export declare function elkLayoutOptions(placement: ElkPlacement): LayoutOptions;
+/**
+ * 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
+ * naming an algorithm left out here would be answered with an error.
+ */
+export declare const ELK_ALGORITHMS: string[];
+//# sourceMappingURL=elkLayoutOptions.d.ts.map

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

@@ -0,0 +1,21 @@
+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. */
+export declare function toElkGraph({ placement, nodes, edges, }: ElkLayoutRequest): ElkNode;
+/**
+ * Places tables by an ELK algorithm, off the thread that asked for it. What
+ * comes back is a corner per table and nothing else, because the editor routes
+ * its own relationship lines and drops the sections ELK computed for them.
+ */
+export declare class ElkLayoutService {
+    /**
+     * Loading ELK at all is what proves this realm can run it. A shared worker
+     * that throws while evaluating reports it to the console and to nobody else:
+     * its port stays open and every call after it hangs.
+     */
+    ready(): Promise<boolean>;
+    layout(request: ElkLayoutRequest): Promise<ElkLayoutPoint[]>;
+}
+//# sourceMappingURL=elkLayoutService.d.ts.map

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=elkWorkerRealm.d.ts.map

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

@@ -0,0 +1,13 @@
+import { ElkLayoutPoint, ElkLayoutRequest } from './elkGraph';
+export { createElkLayoutRequest, type ElkLayoutPoint, type ElkLayoutRequest, toTablePoints, } from './elkGraph';
+export { type ElkPlacement, isElkPlacement } from './elkLayoutOptions';
+/**
+ * Where every table goes under the placement the author picked. 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));
+ */
+export declare function createElkLayout(request: ElkLayoutRequest): Promise<ElkLayoutPoint[]>;
+//# sourceMappingURL=index.d.ts.map

package/dist/services/shiki/index.d.ts

@@ -0,0 +1,10 @@
+import { ShikiService } from './shikiService';
+import * as Comlink from 'comlink';
+export type { ShikiService } from './shikiService';
+/**
+ * The highlighter the code panels read, built on the first panel that asks for
+ * one and kept for the session. Shiki and its grammars live behind the worker
+ * boundary, so a host that builds none is answered with null and plain text.
+ */
+export declare function getShikiService(): Comlink.Remote<ShikiService> | null;
+//# sourceMappingURL=index.d.ts.map

package/dist/services/shiki/shiki.shared-worker.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=shiki.shared-worker.d.ts.map

package/dist/services/shiki/shikiService.d.ts

@@ -0,0 +1,18 @@
+import { Lang } from '../../constants/language';
+/**
+ * Shiki behind the one method the code panels call, instantiated in the shared
+ * worker and nowhere else. The grammars are exactly what constants/language.ts
+ * maps a Language onto, imported one by one so the worker carries no others.
+ *
+ * @example
+ * const html = await new ShikiService().codeToHtml('select 1', { lang: 'sql' });
+ */
+export declare class ShikiService {
+    private highlighter;
+    constructor();
+    codeToHtml(code: string, { lang, theme }: {
+        lang: Lang;
+        theme?: 'dark' | 'light';
+    }): Promise<string>;
+}
+//# sourceMappingURL=shikiService.d.ts.map

package/dist/utils/domEvent.d.ts

@@ -4,4 +4,10 @@ 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;
+/**
+ * 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
+ * native one, which swallows the mouseup the gesture was waiting for.
+ */
+export declare function suppressSelection(el: HTMLElement): () => void;
 //# sourceMappingURL=domEvent.d.ts.map

package/dist/utils/emitter.d.ts

@@ -1,11 +1,11 @@
 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';
 declare const InternalActionType: {
     readonly openColorPicker: "openColorPicker";
     readonly closeColorPicker: "closeColorPicker";
     readonly openToast: "openToast";
-    readonly loadShikiService: "loadShikiService";
     readonly openTableProperties: "openTableProperties";
     readonly dragendColumnAll: "dragendColumnAll";
     readonly copy: "copy";
@@ -17,6 +17,7 @@ declare const InternalActionType: {
     readonly mouseTrackerStart: "mouseTrackerStart";
     readonly mouseTrackerEnd: "mouseTrackerEnd";
     readonly openDiffViewer: "openDiffViewer";
+    readonly openAutomaticTablePlacement: "openAutomaticTablePlacement";
     readonly duplicateDragStart: "duplicateDragStart";
     readonly dragSelectStart: "dragSelectStart";
 };
@@ -32,7 +33,6 @@ type InternalActionMap = {
         message: DOMTemplateLiterals;
         close?: Promise<void>;
     };
-    [InternalActionType.loadShikiService]: void;
     [InternalActionType.openTableProperties]: {
         tableId: string;
     };
@@ -52,6 +52,9 @@ type InternalActionMap = {
     [InternalActionType.openDiffViewer]: {
         value: string;
     };
+    [InternalActionType.openAutomaticTablePlacement]: {
+        placement: TablePlacement;
+    };
     [InternalActionType.duplicateDragStart]: {
         tableIds: string[];
         memoIds: string[];
@@ -99,11 +102,6 @@ export declare const openToastAction: {
     toString(): string;
     type: string;
 };
-export declare const loadShikiServiceAction: {
-    (payload: void): AnyAction<void>;
-    toString(): string;
-    type: string;
-};
 export declare const openTablePropertiesAction: {
     (payload: {
         tableId: string;
@@ -175,6 +173,15 @@ export declare const openDiffViewerAction: {
     toString(): string;
     type: string;
 };
+export declare const openAutomaticTablePlacementAction: {
+    (payload: {
+        placement: TablePlacement;
+    }): AnyAction<{
+        placement: TablePlacement;
+    }>;
+    toString(): string;
+    type: string;
+};
 export declare const duplicateDragStartAction: {
     (payload: void | {
         tableIds: string[];

package/dist/utils/globalEventObservable.d.ts

@@ -11,7 +11,12 @@ export declare const animationFrames$: Observable<{
     elapsed: number;
 }>;
 export declare const moveStart$: Observable<MouseEvent | TouchEvent>;
-export declare const moveEnd$: Observable<MouseEvent | TouchEvent>;
+/**
+ * A gesture also ends wherever the browser takes the pointer away: a native
+ * drag swallows the rest of the stream, a cancelled pointer never lifts, and a
+ * blurred window never sees the mouseup, each leaving drag$ subscribed.
+ */
+export declare const moveEnd$: Observable<MouseEvent | TouchEvent | DragEvent | PointerEvent | FocusEvent>;
 export type DragMove = {
     movementX: number;
     movementY: number;

package/dist/utils/promise.d.ts

@@ -1,3 +1,9 @@
 export declare const delay: (ms: number) => Promise<void>;
 export declare function closePromise(): [Promise<void>, () => void];
+/**
+ * Rejects a promise that has not settled in time. A shared worker that throws
+ * while evaluating leaves its port open and its first call pending for ever,
+ * which is a wait only a clock ends.
+ */
+export declare function withTimeout<T>(promise: Promise<T>, ms: number, message: string): Promise<T>;
 //# sourceMappingURL=promise.d.ts.map

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

@@ -0,0 +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)};