@draftably/editor 0.0.0-stage → 0.2.0

package/dist/types/src/components/session-context.d.ts

@@ -0,0 +1,486 @@
+/** The diagram session a canvas and its panels edit, provided once per editor. */
+import { type JSX } from 'solid-js';
+import type { DiagramSession } from '../state/session';
+export declare function DiagramSessionProvider(props: {
+    session: DiagramSession;
+    children: JSX.Element;
+}): JSX.Element;
+/** The session drawn here, or undefined where scene views draw without one (Compare, tests). */
+export declare const useSessionIfAny: () => ({
+    dispose: () => void;
+} & {
+    selectedText: import("solid-js").Accessor<string | null>;
+    setSelectedText: import("solid-js").Setter<string | null>;
+} & {
+    options: import("../state/session").SessionOptions;
+    doc: import("../model/types").Diagram;
+    setDoc: import("solid-js/store").SetStoreFunction<import("../model/types").Diagram>;
+    saveStatus: import("solid-js").Accessor<"saved" | "saving" | "preview" | "failed">;
+    undoStack: import("solid-js").Accessor<import("../state/session/document").HistoryEntry[]>;
+    redoStack: import("solid-js").Accessor<import("../state/session/document").HistoryEntry[]>;
+    revision: import("solid-js").Accessor<number>;
+    snapshotDoc: () => import("../model/types").Diagram;
+    snapshot: () => string;
+    selection: import("solid-js").Accessor<ReadonlySet<string>>;
+    selectedIds: () => string[];
+    isSelected: (id: string) => boolean;
+    singleSelection: () => string | undefined;
+    setSelection: (ids: Iterable<string>) => void;
+    selectItems: (ids: string[], { add, toggle }?: {
+        add?: boolean | undefined;
+        toggle?: boolean | undefined;
+    }) => void;
+    clearSelection: () => void;
+    selectText: (id: string) => void;
+    onBeforeEdit: (handler: () => void) => void;
+    prepareForEdit: () => void;
+    onSourceIdMap: (handler: (mapId: (id: string) => string) => void) => void;
+    mapSourceIds: (mapId: (id: string) => string) => void;
+    setCommitHandler: (handler: ((before: string, label: string, kind: import("../state/session/document").EditKind) => boolean) | null) => ((before: string, label: string, kind: import("../state/session/document").EditKind) => boolean) | null;
+    editsGoToFile: () => boolean;
+    commit: (before: string, label?: string, kind?: import("../state/session/document").EditKind) => boolean;
+    pushUndo: (entry: import("../state/session/document").HistoryEntry) => void;
+    annotateLastUndo: (holds: import("../state/session/document").HistoryEntry["holds"]) => void;
+    transact: (label: string, fn: (draft: import("../model/types").Diagram) => void, kind?: import("../state/session/document").EditKind) => boolean;
+    mutate: (fn: (draft: import("../model/types").Diagram) => void) => void;
+    restoreDocument: (next: import("../model/types").Diagram, { keepCamera }?: {
+        keepCamera?: boolean | undefined;
+    }) => void;
+    onHistoryStep: (handler: (entry: import("../state/session/document").HistoryEntry, direction: "undo" | "redo") => void) => void;
+    setHistoryHandler: (handler: import("../state/session/document").HistoryHandler | null) => import("../state/session/document").HistoryHandler | null;
+    undo: () => void;
+    redo: () => void;
+    canUndo: () => boolean;
+    canRedo: () => boolean;
+    setCamera: (camera: import("../model/types").Camera) => void;
+    disableBrowserStorage: () => boolean;
+    setPersistenceBlocked: (blocked: boolean) => void;
+    persist: () => void;
+    persistNow: () => void;
+    restoreSavedDocument: () => {
+        restored: boolean;
+        notice?: string;
+    };
+    watchOtherTabs: () => () => void;
+} & {
+    openSource: (source: string, onChange?: (source: string) => void) => Promise<void>;
+    receiveSource: (source: string) => Promise<void>;
+    liveSource: import("solid-js").Accessor<string>;
+    sourceDraft: import("solid-js").Accessor<string | null>;
+    fileSession: import("solid-js").Accessor<import("../state/session/file-session").FileSessionInfo | null>;
+    fileMode: () => boolean;
+    exampleMode: () => boolean;
+    scratchName: () => "Draft" | "Example";
+    exampleEdited: () => boolean;
+    leaveAgreed: () => boolean;
+    agreeToLeave: () => undefined;
+    fileStatus: import("solid-js").Accessor<import("../state/session/file-session").FileStatus>;
+    sourceError: import("solid-js").Accessor<{
+        message: string;
+        line: number;
+    } | null>;
+    fileScene: import("solid-js").Accessor<import("../dsl/compile").Scene | null>;
+    fileDiagnostics: () => import("../dsl/compile").Diagnostic[];
+    conflictProposal: import("solid-js").Accessor<string | null>;
+    movedByChange: import("solid-js").Accessor<string[]>;
+    fileCompiling: import("solid-js").Accessor<boolean>;
+    exampleRestored: () => boolean;
+    currentSource: () => string;
+    setRouteSink: (sink: {
+        adopt: (routes: {
+            fingerprint: string;
+            result: import("../engines/routing-engine").RoutingResult;
+        }) => void;
+        quick: (on: boolean) => void;
+        awaiting: (on: boolean) => void;
+    }) => {
+        adopt: (routes: {
+            fingerprint: string;
+            result: import("../engines/routing-engine").RoutingResult;
+        }) => void;
+        quick: (on: boolean) => void;
+        awaiting: (on: boolean) => void;
+    };
+    showSource: (source: string, selection?: string[] | (() => string[]), mapId?: (id: string) => string) => Promise<import("../dsl/compile").Scene | null>;
+    keepDiskVersion: () => void;
+    saveProposalOverDisk: () => void;
+    retrySave: () => undefined;
+    typeSource: (next: string, burst: number) => Promise<null | undefined>;
+    commitSource: (next: string, label: string, message: string) => Promise<boolean>;
+    fileBlocked: () => string | null;
+    sourceWithRecipe: (scope: string, settings: import("../model/types").LayoutSettings, direction?: "right" | "down") => {
+        source: string;
+        removed: number;
+    };
+    sourceWithShape: (scope: string, change: import("../dsl/layout-edits").ShapeChange) => {
+        source: string;
+        removed: number;
+    };
+    changedLines: (source: string) => string[];
+    changedLine: (source: string) => string;
+    sourceWithRouting: (routing: import("../model/types").RoutingSettings, base?: string) => string;
+    projectSource: (source: string) => Promise<import("../model/types").Diagram>;
+    reflowSelectedGroup: (id: string) => void;
+    openFileSession: (file: string) => Promise<boolean>;
+    prefetchFile: (file: string) => Promise<void>;
+    settleSave: () => Promise<void>;
+    closeFileSession: () => void;
+    openExampleSession: (id: string, title: string, source: string, key?: string) => Promise<void>;
+    resetExample: () => void;
+    markExampleSaved: () => void;
+    fileStatusText: () => string;
+} & {
+    sculptGeometry: import("solid-js").Accessor<import("../model/types").NodeGeometry | null>;
+    setSculptGeometry: import("solid-js").Setter<import("../model/types").NodeGeometry | null>;
+    animationGeometry: import("solid-js").Accessor<import("../model/types").NodeGeometry | null>;
+    setAnimationGeometry: import("solid-js").Setter<import("../model/types").NodeGeometry | null>;
+    setQuickRouting: import("solid-js").Setter<boolean>;
+    routePrior: import("solid-js").Accessor<import("../engines/routing-engine").PriorRoute[] | null>;
+    setRoutePrior: import("solid-js").Setter<import("../engines/routing-engine").PriorRoute[] | null>;
+    setAdoptedRoutes: import("solid-js").Setter<{
+        fingerprint: string;
+        result: import("../engines/routing-engine").RoutingResult;
+    } | null>;
+    geometry: (id: string) => import("../model/types").NodeLayout;
+    visibleScene: import("solid-js").Accessor<import("../model/graph").VisibleGraph>;
+    nodeIds: import("solid-js").Accessor<string[]>;
+    groupIds: import("solid-js").Accessor<string[]>;
+    edgeIds: import("solid-js").Accessor<string[]>;
+    sceneRects: import("solid-js").Accessor<Map<string, import("../model/types").Rect>>;
+    routing: import("solid-js").Accessor<import("../model/routes").SceneRoutes>;
+    routesById: import("solid-js").Accessor<Map<string, import("../model/routes").DrawnRoute>>;
+    routeIds: import("solid-js").Accessor<string[]>;
+    routesPending: () => boolean;
+    resetRoutes: () => void;
+    routeInputFor: () => {
+        nodes: ({
+            shape: import("../model/types").ShapeKind;
+            x: number;
+            y: number;
+            w: number;
+            h: number;
+            id: string;
+            title: string;
+            was?: string;
+            wasShape?: import("../model/types").ShapeKind;
+            wasCount?: number | string;
+            href?: string;
+            count?: number | string;
+            span?: number | "var";
+            parentId?: string;
+            image?: string;
+            lifeline?: number;
+        } | {
+            parentId?: string | undefined;
+            frame?: boolean | undefined;
+            shape: import("../model/types").ShapeKind;
+            x: number;
+            y: number;
+            w: number;
+            h: number;
+            id: string;
+            title: string;
+        })[];
+        groups: {
+            titleHeight?: number | undefined;
+            collapsed: boolean;
+            titleWidth: number;
+            x: number;
+            y: number;
+            w: number;
+            h: number;
+            id: string;
+            title: string;
+            was?: string;
+            href?: string;
+            parentId?: string;
+            frame?: "soft" | "none";
+            titleLines?: number;
+            hull?: import("../model/types").Rect[];
+        }[];
+        edges: {
+            from: string;
+            to: string;
+            cfg: import("../model/types").EdgeLayout;
+            a: string;
+            b: string;
+            id: string;
+            label: string;
+            was?: string;
+            directed: boolean;
+            head?: import("../model/markers").EndMarker;
+            tail?: import("../model/markers").EndMarker;
+            emphasis: boolean;
+            dashed: boolean;
+            status?: import("../model/status").Status;
+            spot?: import("../model/status").Spot;
+        }[];
+    };
+    routes: () => import("../model/routes").DrawnRoute[];
+    routingReport: () => import("../engines/routing-engine").RoutingReport;
+    blockedRouteIds: () => string[];
+    sceneBounds: () => import("../model/types").Rect;
+    viewerFrame: () => {
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+        natural: number;
+        head: {
+            w: number;
+            h: number;
+        };
+        key: {
+            w: number;
+            h: number;
+            row: number;
+            items: {
+                x: number;
+                y: number;
+                legend?: import("../model/appearance").LegendEntry;
+                status?: import("../model/status").StatusCount;
+                label: string;
+            }[];
+        };
+        heading: {
+            x: number;
+            y: number;
+            wrap: number;
+        };
+        legend: {
+            x: number;
+            y: number;
+        };
+        foot: {
+            x: number;
+            y: number;
+            type: import("../model/fonts").TypeProfile;
+            gutter: number;
+            items: {
+                note: import("../model/footnote").Footnote;
+                lines: import("../model/rich-text").Run[][];
+                y: number;
+            }[];
+            h: number;
+        };
+        notes: import("../model/note").PlacedNote[];
+    };
+} & {
+    states: () => import("../model/appearance").EmphasisState[];
+    activeState: () => string | null;
+    gridOpen: import("solid-js").Accessor<boolean>;
+    setGridOpen: import("solid-js").Setter<boolean>;
+    showState: (id: string | null) => void;
+    stepState: (by: 1 | -1) => boolean;
+    drawnDoc: () => import("../model/types").Diagram;
+} & {
+    tool: import("solid-js").Accessor<import("../state/session/editor").Tool>;
+    setToolSignal: import("solid-js").Setter<import("../state/session/editor").Tool>;
+    connectFrom: import("solid-js").Accessor<{
+        id: string;
+        side: import("../model/types").PortSide;
+    } | null>;
+    setConnectFrom: import("solid-js").Setter<{
+        id: string;
+        side: import("../model/types").PortSide;
+    } | null>;
+    pointer: import("solid-js").Accessor<import("../model/types").Point | null>;
+    setPointer: import("solid-js").Setter<import("../model/types").Point | null>;
+    drag: import("solid-js").Accessor<import("../state/session/editor").DragFeedback | null>;
+    setDrag: import("solid-js").Setter<import("../state/session/editor").DragFeedback | null>;
+    inlineEditId: import("solid-js").Accessor<string | null>;
+    setInlineEditId: import("solid-js").Setter<string | null>;
+    spaceHeld: import("solid-js").Accessor<boolean>;
+    setSpaceHeld: import("solid-js").Setter<boolean>;
+    measuredStageSize: import("solid-js").Accessor<{
+        width: number;
+        height: number;
+    }>;
+    setMeasuredStageSize: import("solid-js").Setter<{
+        width: number;
+        height: number;
+    }>;
+    reducedMotion: import("solid-js").Accessor<boolean>;
+    setReducedMotion: import("solid-js").Setter<boolean>;
+    registerCanvas: (el: SVGSVGElement) => SVGSVGElement;
+    canvasElement: () => SVGSVGElement | undefined;
+    focusCanvas: () => void | undefined;
+    stageSize: () => {
+        width: number;
+        height: number;
+    };
+    screenToWorld: (clientX: number, clientY: number) => import("../model/types").Point;
+    canvasCenter: () => import("../model/types").Point;
+    zoomAt: (factor: number, clientX?: number, clientY?: number) => void;
+    panBy: (dx: number, dy: number) => void;
+    setStageSize: (size: {
+        width: number;
+        height: number;
+    }) => void;
+    fitView: () => void;
+    diagramClipped: () => boolean;
+    fitRects: (rects: import("../model/types").Rect[], reservedBottom?: number) => void;
+    revealObject: (id: string) => void;
+    centerSelection: () => void;
+} & {
+    layoutBusy: import("solid-js").Accessor<boolean>;
+    layoutReport: import("solid-js").Accessor<import("../engines/layout-engine").LayoutReport | null>;
+    setLayoutReport: import("solid-js").Setter<import("../engines/layout-engine").LayoutReport | null>;
+    layoutPreview: import("solid-js").Accessor<import("../state/session/layout").LayoutPreview | null>;
+    labScope: import("solid-js").Accessor<import("../state/session/layout").LabScope>;
+    setLabScope: import("solid-js").Setter<import("../state/session/layout").LabScope>;
+    labEngine: import("solid-js").Accessor<import("../model/types").LayoutAlgorithmId | null>;
+    setLabEngine: import("solid-js").Setter<import("../model/types").LayoutAlgorithmId | null>;
+    layoutCheckpoint: import("solid-js").Accessor<import("../model/types").Diagram | null>;
+    currentScope: () => {
+        scope: import("../engines/layout-engine").LayoutScope;
+        containerId?: string;
+    };
+    layoutTarget: () => "the whole diagram" | "the selection and its neighbours" | "this group" | "the selection";
+    setFixedIdsProvider: (provider: () => string[]) => () => string[];
+    fixedIds: () => string[];
+    cancelLayout: () => void;
+    runLayout: (options?: import("../state/session/layout").RunLayoutOptions) => Promise<import("../state/session/layout").LayoutOutcome>;
+    runLabLayout: (mode?: "pass" | "rebuild", preview?: boolean, settings?: import("../engines/layout-engine").LayoutOptions) => Promise<import("../state/session/layout").LayoutOutcome>;
+    previewSettings: (patch: Partial<Pick<import("../engines/layout-engine").LayoutOptions, "direction" | "aspect">>) => Promise<void>;
+    arrangeScope: () => string | null;
+    movesBlocked: () => string | null;
+    rebuildBlocked: () => string | null;
+    routesBlocked: () => string | null;
+    previewShape: (change: import("../dsl/layout-edits").ShapeChange) => Promise<import("../state/session/layout").LayoutOutcome>;
+    previewRouting: (routing: import("../model/types").RoutingSettings) => Promise<import("../state/session/layout").LayoutOutcome>;
+    acceptPreview: () => void;
+    discardPreview: () => void;
+    holdPreviewBefore: (held: boolean) => void;
+    updateLayoutSettings: (patch: Partial<import("../model/types").Diagram["settings"]>) => void;
+    captureCheckpoint: () => void;
+    setDocumentOpener: (open: (doc: import("../model/types").Diagram, label: string) => void) => (doc: import("../model/types").Diagram, label: string) => void;
+    restoreCheckpoint: () => void;
+} & {
+    inlineDraft: import("solid-js").Accessor<string>;
+    setInlineDraft: import("solid-js").Setter<string>;
+    setToolInterceptor: (fn: (tool: import("../state/session/editor").Tool) => boolean) => (tool: import("../state/session/editor").Tool) => boolean;
+    setTool: (next: import("../state/session/editor").Tool) => void;
+    startInlineEdit: (id: string) => void;
+    finishInlineEdit: (save?: boolean) => void;
+    addNode: (partial?: import("../model/edits").NewNode, at?: import("../model/types").Point, edit?: boolean) => string;
+    addEdge: (partial: import("../model/edits").NewEdge) => string;
+    completeConnection: (targetId: string, side?: import("../model/types").Side | "auto") => void;
+    quickExtend: ({ side, sibling, at, from, }?: {
+        side?: import("../model/types").Side | null;
+        sibling?: boolean;
+        at?: import("../model/types").Point | null;
+        from?: string | null;
+    }) => string | undefined;
+    insertStep: (edgeId: string, at?: import("../model/types").Point | null) => string | undefined;
+    buildFromList: (lines: string[], options?: {
+        mode?: import("../model/edits").BuildMode;
+        title?: string;
+        source?: string | null;
+        parentId?: string | null;
+    }) => string[];
+    wrapSelection: () => string;
+    drawContainer: (rect: {
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    }) => void;
+    deleteSelection: (deep?: boolean) => void;
+    ungroupSelection: () => void;
+    togglePin: () => void;
+    clearManualMarkers: () => void;
+    alignSelection: (kind: import("../model/edits").AlignKind) => void;
+    nudgeSelection: (dx: number, dy: number) => boolean;
+    setColor: (color: import("../model/types").Diagram["styles"][string]["color"]) => void;
+    chooseTheme: (theme: import("../model/appearance").ThemeId) => void;
+    setAppearanceOverrides: (patch: Partial<import("../model/appearance").AppearanceOverrides>, label?: string) => void;
+    setShade: (shade: import("../model/appearance").Shade | undefined) => void;
+    fitSelectedContainer: () => void;
+    toggleCollapse: (id?: string | undefined) => void;
+    reverseSelectedEdge: () => void;
+    resetSelectedBends: () => void;
+    setLayoutIntent: (role: import("../model/types").IntentRole, id: string | null, placement?: import("../model/types").IntentPlacement) => void;
+    markSelectedAs: (role: import("../model/types").IntentRole) => void;
+    addWaypointAt: (edgeId: string, point?: import("../model/types").Point) => void;
+    removeWaypoint: (edgeId: string, index: number) => void;
+    reroute: ({ auto }?: {
+        auto?: boolean | undefined;
+    }) => void;
+    toggleTheme: () => void;
+    copySelection: () => import("../model/edits").ClipboardFragment | null;
+    hasClipboard: () => boolean;
+    pasteFragment: (part?: import("../model/edits").ClipboardFragment | null) => void;
+    duplicateSelection: () => void;
+    openDocument: (input: unknown, { fit, label }?: {
+        fit?: boolean | undefined;
+        label?: string | undefined;
+    }) => import("../model/types").Diagram;
+    newDocument: () => void;
+    openSample: (id: string) => import("../model/types").Diagram | undefined;
+} & {
+    setRouting: (patch: Partial<import("../model/types").RoutingSettings>, label: string) => void;
+    applyRoutePreset: (preset: import("../state/session/routing").RoutePreset) => void;
+    activeRoutePreset: () => "Balanced" | "Fewer crossings" | null;
+} & {
+    importTimeline: (input: unknown) => void;
+    timeline: import("solid-js").Accessor<import("../state/session/sculpt").TimelineState | null>;
+    playing: import("solid-js").Accessor<boolean>;
+    brushActive: import("solid-js").Accessor<boolean>;
+    brushSettings: import("solid-js").Accessor<import("../engines/sculpt-engine").BrushSettings>;
+    brushPoint: import("solid-js").Accessor<import("../model/types").Point | null>;
+    brushHover: import("solid-js").Accessor<import("../engines/sculpt-engine").DabResult | null>;
+    stroking: import("solid-js").Accessor<boolean>;
+    restoreKey: import("solid-js").Accessor<boolean>;
+    referenceLabel: import("solid-js").Accessor<string>;
+    timelineOpen: () => boolean;
+    sculptInteracting: () => boolean;
+    heldIds: () => string[];
+    restoreArchive: () => void;
+    openTimeline: (options?: Record<string, unknown>) => Promise<void>;
+    closeTimeline: () => void;
+    scrub: (index: number, { peek }?: {
+        peek?: boolean | undefined;
+    }) => number | undefined;
+    endPeek: () => void;
+    setGhost: (ghost: import("../state/session/sculpt").GhostMode) => void;
+    bookmarkStep: () => void;
+    keepStep: ({ brush }?: {
+        brush?: boolean | undefined;
+    }) => boolean;
+    stopPlayback: () => void;
+    togglePlayback: () => void;
+    fitTimelinePath: (reservedBottom: number) => void;
+    reopenTimeline: () => void;
+    saveTimelineFile: () => void;
+    activateBrush: (options?: Partial<import("../engines/sculpt-engine").BrushSettings>) => void;
+    deactivateBrush: () => void;
+    toggleBrush: () => void;
+    updateBrushSettings: (patch: Partial<import("../engines/sculpt-engine").BrushSettings>) => void;
+    useCurrentAsReference: () => void;
+    brushPointerDown: (e: PointerEvent, target: Element) => boolean;
+    brushPointerMove: (e: PointerEvent) => boolean;
+    brushPointerUp: (e?: PointerEvent) => boolean;
+    brushPointerLeave: () => void;
+    cancelStroke: () => boolean;
+    brushDab: (point?: import("../model/types").Point) => import("../engines/sculpt-engine").DabResult;
+    clearHolds: () => void;
+    sculptUndo: () => boolean;
+    sculptKey: (e: KeyboardEvent) => boolean;
+    sculptBlur: () => void;
+    sculptBeforeUnload: () => void;
+    hasArchivedTimeline: import("solid-js").Accessor<boolean>;
+    setComparisonCloser: (fn: () => void) => () => void;
+} & {
+    isDragging: () => boolean;
+    cancelGesture: () => void;
+    resetModifiers: () => void;
+    onWheel: (e: WheelEvent) => void;
+    onPointerDown: (e: PointerEvent) => void;
+    onPointerMove: (e: PointerEvent) => void;
+    onPointerUp: (e: PointerEvent | null) => void;
+    onDoubleClick: (e: MouseEvent) => void;
+    selectForContextMenu: (e: MouseEvent) => void;
+    dragKind: () => string | undefined;
+}) | undefined;
+export declare function useDiagramSession(): DiagramSession;

package/dist/types/src/dsl/cells.d.ts

@@ -0,0 +1,91 @@
+import type { ResolvedAppearance } from '../model/appearance';
+/** Width of a marker's bar, centred on the seam it marks. */
+export declare const MARKER_WIDTH = 8;
+/** How far a marker's bar runs past the cells, so a line meets it clear of their corners. */
+export declare const MARKER_TAIL = 16;
+/** Height of a cells group's title band for a title type of this line height. */
+export declare const cellsBandFor: (lineHeight: number) => number;
+export interface CellInput {
+    id: string;
+    label: string;
+    marker: boolean;
+    /** Columns the cell covers in a grid. */
+    span?: number;
+    /** From a `size` line. */
+    size?: {
+        width: number;
+        height?: number;
+    };
+}
+export interface CellBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+/** A cell's own size: one line of title when it fits in `MAX_CELL`, wrapped when it does not. */
+export declare function cellSize(c: CellInput, look: ResolvedAppearance): {
+    w: number;
+    h: number;
+};
+/**
+ * Cells edge to edge, in rows of `columns` columns filled in order; a cell's `span` covers that
+ * many columns, and a cell that does not fit the rest of a row starts the next one. Without
+ * `columns`, the cells form one row (`right`) or one column (`down`). Each column is as wide as
+ * its widest single cell, widened at its last column for a wider spanning cell, and each row is
+ * as tall as its tallest cell. Cells narrower than `minWidth` in all, the title band's width,
+ * widen the last column.
+ *
+ * A marker takes no room: in one row or column, its bar sits on the seam before the next cell
+ * and spans the band above as well, so it cuts the whole object, and runs a short tail past the
+ * cells where lines meet it.
+ */
+export declare function layoutCells(cells: CellInput[], shape: {
+    direction: 'right' | 'down';
+    columns?: number;
+}, look: ResolvedAppearance, minWidth?: number): {
+    boxes: Map<string, CellBox>;
+    w: number;
+    h: number;
+};
+/** Width of one unit of a byte or bit layout, and the units in each row, unless the file says. */
+export declare const UNIT_WIDTH: {
+    readonly bit: 24;
+    readonly byte: 48;
+};
+export declare const UNIT_COLUMNS: {
+    readonly bit: 32;
+    readonly byte: 16;
+};
+export interface UnitCells {
+    /** Each field's main box: the longest piece, which holds its title. */
+    boxes: Map<string, CellBox>;
+    /** The other pieces of a field that runs on past a row's end. */
+    pieces: Map<string, CellBox[]>;
+    /** Fields of variable length, drawn with broken ends. */
+    open: string[];
+    /** Unit numbers above the first row: their centres, and the room they take above the cells. */
+    ruler?: {
+        h: number;
+        ticks: Array<{
+            x: number;
+            label: string;
+        }>;
+    };
+    w: number;
+    h: number;
+}
+/**
+ * A byte or bit layout: every unit has one width, so a field's width is its size. Rows hold
+ * `columns` units. A field longer than the rest of its row runs on into the next rows; a field of
+ * variable length (`span: 'var'`) fills the rest of its row, or a whole row, with broken ends.
+ * Every row has the height of the tallest title.
+ */
+export declare function layoutUnits(cells: Array<CellInput & {
+    open?: boolean;
+}>, shape: {
+    unit: 'bit' | 'byte';
+    columns?: number;
+    unitWidth?: number;
+    ruler: boolean;
+}, look: ResolvedAppearance): UnitCells;

package/dist/types/src/dsl/channels.d.ts

@@ -0,0 +1,53 @@
+/**
+ * Routing channels inside groups.
+ *
+ * A group leaves `GROUP_INSET` between its members and its border. That is padding, not room for
+ * a line: a line routed through it runs beside a member and along the border at once. When a
+ * connection has to travel inside a group (a member boxed in by its neighbours, or a link between
+ * two of the group's children that can't go straight across), the group grows a channel on one
+ * side, wide enough for each such line to run a full standoff from the members,
+ * the border and each other. A link between children takes the side of them both ends lean
+ * toward, and a return (up or left) takes the left or top when they lean neither way, so a
+ * forward line and its return don't cross. The compiler lays the scene out once, plans channels
+ * from that geometry, and lays it out again with them.
+ */
+import type { ModelEdge } from './syntax';
+/**
+ * Room a group leaves round its content: the inset on the left, right and bottom (at least
+ * `GROUP_INSET`), and extra room under the title band on top (0 without a channel there).
+ */
+export interface Channel {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+    /** How many lines each side's channel was planned for. */
+    lines: Record<Side, number>;
+}
+/** Channels may grow the drawing's area by this much at most. */
+export declare const CHANNEL_BUDGET = 1.1;
+/**
+ * Drop the channels that carry fewest lines until the drawing laid out with the rest (`measure`)
+ * is within `CHANNEL_BUDGET` of its area without any (`plain`).
+ */
+export declare function trimChannels(plan: Map<string, Channel>, plain: number, measure: (channels: Map<string, Channel>) => number): Map<string, Channel>;
+interface Box {
+    id: string;
+    type: string;
+    parent: string;
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export type Side = 'left' | 'right' | 'top' | 'bottom';
+/**
+ * Channels for the scene laid out as `objects`. A group is keyed by id; groups with no traffic
+ * are left out.
+ */
+export declare function planChannels(objects: Box[], edges: ModelEdge[], routing?: {
+    edgeGap?: number;
+    portGap?: number;
+    standoff?: number;
+}): Map<string, Channel>;
+export {};