@draftably/editor 0.2.0 → 0.4.0

package/dist/types/src/cli/raster-fonts.d.ts

@@ -0,0 +1,3 @@
+import type { FaceId } from '../model/fonts';
+/** Each face's TrueType file, written once to a folder named by the fonts' content. */
+export declare function fontFiles(): Record<FaceId, string>;

package/dist/types/src/components/canvas/Canvas.d.ts

@@ -7,6 +7,10 @@ export interface CanvasProps {
     onDropFiles?: (files: File[]) => Promise<void> | void;
     /** Shown under the hint on an empty canvas, such as a button that builds from a list. */
     emptyAction?: JSX.Element;
+    /** The host's slot targets, above the drawing and below the chrome layer. */
+    anchorLayer?: HTMLElement;
+    /** Nodes a host body covers: their titles hide, and their ports and handles draw on top. */
+    bodies?: () => ReadonlySet<string>;
 }
 /**
  * The canvas for the session in context: drawing, selection, dragging, inline editing, layout

package/dist/types/src/components/scene/NodeView.d.ts

@@ -14,5 +14,12 @@ export interface NodeViewProps {
     /** Comparison candidates: focusable so a keyboard user can choose the anchor. */
     focusable?: boolean;
     idPrefix?: string;
+    /** A host body covers this node: its ports and handles draw in the chrome layer above it. */
+    body?: boolean;
 }
+/**
+ * The ports and resize handles of a node with a host body, drawn in the editor's top layer so the
+ * body never hides them. Pointer input on them reaches the canvas's own handlers.
+ */
+export declare function NodeChrome(props: NodeViewProps): import("solid-js").JSX.Element;
 export declare function NodeView(props: NodeViewProps): import("solid-js").JSX.Element;

package/dist/types/src/components/scene/parts.d.ts

@@ -1,17 +1,13 @@
-import type { TypeProfile } from '../../model/fonts';
+import type { ResolvedAppearance } from '../../model/appearance';
+import type { NodeLabel } from '../../model/labels';
 import type { Rect } from '../../model/types';
-/** Multi-line, vertically centered text in one of the diagram's type profiles. */
-export declare function SceneText(props: {
-    lines: string[];
-    x: number;
-    y: number;
-    lineHeight: number;
-    type: TypeProfile;
+/** A shape's title: its name lines, then its detail lines a step smaller in `detailFill`. */
+export declare function NodeTitle(props: {
+    label: NodeLabel;
+    look: ResolvedAppearance;
     fill: string;
-    class?: string;
-    /** Strike the text through, as for a removed object. */
+    detailFill: string;
     strike?: boolean;
-    /** Fade of the text alone, as for a removed object. */
     fade?: number;
 }): import("solid-js").JSX.Element;
 /** The removed marker, a minus in a disc, centred at (x, y). */

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

@@ -52,7 +52,8 @@ export declare const useSessionIfAny: () => ({
     redo: () => void;
     canUndo: () => boolean;
     canRedo: () => boolean;
-    setCamera: (camera: import("../model/types").Camera) => void;
+    setCamera: (camera: import("../model/types").Camera, reason?: import("../runtime/camera").CameraReason) => void;
+    onCamera: (listener: (reason: import("../runtime/camera").CameraReason) => void) => () => boolean;
     disableBrowserStorage: () => boolean;
     setPersistenceBlocked: (blocked: boolean) => void;
     persist: () => void;
@@ -482,5 +483,7 @@ export declare const useSessionIfAny: () => ({
     onDoubleClick: (e: MouseEvent) => void;
     selectForContextMenu: (e: MouseEvent) => void;
     dragKind: () => string | undefined;
+} & {
+    describeLink: (href: string) => string;
 }) | undefined;
 export declare function useDiagramSession(): DiagramSession;

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

@@ -15,6 +15,7 @@ export interface CellInput {
     size?: {
         width: number;
         height?: number;
+        minHeight?: number;
     };
 }
 export interface CellBox {

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

@@ -1,5 +1,6 @@
 import { type ResolvedAppearance } from '../model/appearance';
 import type { CellsChrome, Lane, SequenceLayout } from '../model/types';
+import { type Planned } from './corridors';
 import { GROUP_HEADER, GROUP_INSET, contentOrigin } from './frame';
 import { type Model, type ModelEdge, type ModelLayout, type ModelObject } from './syntax';
 /** The single render context. Browser window size changes the camera, never the layout. */
@@ -44,6 +45,8 @@ export interface Diagnostic {
 /** A connection as the file declares it, plus the lane a fold's wrap edge returns along. */
 export interface SceneEdge extends ModelEdge {
     lane?: Lane;
+    /** A forward line's route, planned from its scope's ranks and corridors (`planRoutes`). */
+    plan?: Planned;
     /** A sequence message: the height of its row; it is drawn straight between lifelines there. */
     row?: number;
 }
@@ -96,11 +99,12 @@ export declare function layoutFor(m: Model, scope: string): ModelLayout;
 /**
  * Size of a node: its requested size, or the default width with a height that fits the title in
  * the theme's type and padding. A requested size is kept exactly; `overflow` reports a title that
- * no longer fits in it.
+ * no longer fits in it. With `height=auto`, `min-height` is a floor under the title's height.
  */
 export declare function leafSize(o: ModelObject, size: {
     width: number;
     height?: number;
+    minHeight?: number;
 } | undefined, look: ResolvedAppearance): {
     w: number;
     h: number;
@@ -149,6 +153,16 @@ export declare function crossings(paths: Array<Array<{
 }>>): number;
 /** The order of up to six items that scores fewest crossings; the first such, from `items`. */
 export declare function fewestCrossings<T>(items: T[], score: (order: T[]) => number): T[];
+/**
+ * The corridors a `flow` scope keeps for lines that skip ranks: the ranks with their stand-ins,
+ * each line's stand-ins by its index in the scope's pairs, and each stand-in's place across the
+ * run, in the scope's coordinates.
+ */
+export interface Corridors {
+    order: string[][];
+    chains: Map<number, string[]>;
+    across: Map<string, number>;
+}
 /**
  * Lay out a model. `arranged` holds world positions from layout engines; scopes that an engine
  * governs take their children's relative placement from it instead of their built-in recipe.

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

@@ -0,0 +1,38 @@
+/**
+ * Routes for a `flow` scope's forward lines, planned from its ranks as a layered layout routes its
+ * edges: out of the source's trailing side, along a track in each gap the line turns in, down a
+ * corridor through each rank it skips, and into the target's leading side. The ranks' order already
+ * keeps crossings few, so the plan only has to place ports and order each gap's tracks. The router
+ * takes a planned route as it is when it clears every box.
+ */
+import type { Point, Rect } from '../model/types';
+export interface PlanLine {
+    id: string;
+    /** Source, the stand-ins of the ranks it skips, target. */
+    chain: string[];
+}
+export interface Planned {
+    points: Point[];
+    fromOffset: number;
+    toOffset: number;
+}
+/**
+ * Space between ports on one side and between neighbouring tracks in a gap, as the router keeps
+ * them: ports `max(portGap, edgeGap)` apart and tracks `edgeGap` apart.
+ */
+export interface Spacing {
+    port: number;
+    track: number;
+}
+/**
+ * Plans each line of `lines`. `order` is the ranks with stand-ins, `box` each real member's drawn
+ * box and `across` each stand-in's place across the run, all in drawing coordinates. Lines that
+ * cannot be planned (a member without a box) are left out.
+ */
+export declare function planRoutes(axis: 'down' | 'right', order: string[][], lines: PlanLine[], box: (id: string) => Rect | undefined, across: (id: string) => number | undefined, spacing?: Spacing): Map<string, Planned>;
+/**
+ * The room each gap between ranks needs for the tracks `planRoutes` lays in it: a standoff from
+ * the boxes either side and a pitch between tracks, by gap index; a gap with no track is absent.
+ * `box` may be a member's slot: only its place across the run counts.
+ */
+export declare function trackRoom(axis: 'down' | 'right', order: string[][], lines: PlanLine[], box: (id: string) => Rect | undefined, across: (id: string) => number | undefined, spacing?: Spacing): number[];

package/dist/types/src/dsl/legend-notes.d.ts

@@ -1,3 +1,17 @@
+/**
+ * `check` advice on the key and the prose round a drawing: a key that leaves a color or a line
+ * style unexplained, a `legend` swatch drawn in a shade that no node of its family uses, and
+ * heading prose that the drawing should say instead.
+ */
+import { type Shade } from '../model/appearance';
 import type { Diagnostic } from './compile';
 import type { Model } from './syntax';
 export declare function legendNotes(m: Model): Diagnostic[];
+/**
+ * The shade a `legend family` swatch draws when its line sets none: what the family's nodes draw.
+ * When no node names the family and its nodes are all member cards (they inherit it from a group
+ * on a quiet surface shade), that is the member card's shade; otherwise it is a colored node's.
+ */
+export declare function legendShade(m: Model, family: string): Shade;
+/** Give each `legend family` line with no `shade=` the shade its family's nodes draw. */
+export declare function settleLegendShades(m: Model): void;

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

@@ -210,11 +210,13 @@ export type Hint = {
     line: number;
 }
 /** `height` is unset for `height=auto`: the title's height at that width, as without a size. */
+/** `minHeight` is a floor under `height=auto`, for a host that draws more than the title. */
  | {
     type: 'size';
     id: string;
     width: number;
     height?: number;
+    minHeight?: number;
     line: number;
 };
 export type Strength = 'prefer' | 'required';
@@ -306,7 +308,7 @@ export declare const isIdentifier: (s: string) => boolean;
 export declare const COLORS: DslColor[];
 export declare const DSL_SHAPES: DslShape[];
 /** Shapes a node's box can draw as it was: a marker's box is a thin cut, so it has no other shape. */
-export declare const PAST_SHAPES: ("text" | "diamond" | "circle" | "box" | "pill")[];
+export declare const PAST_SHAPES: ("text" | "box" | "pill" | "circle" | "diamond")[];
 /** Parse and validate source. Throws `DslError` with a line number for the first problem. */
 export declare function parseModel(source: string | SourceDoc): Model;
 /**

package/dist/types/src/editor/css.d.ts

@@ -0,0 +1,3 @@
+export declare function registerEditorCss(key: string, css: string): void;
+/** Add the editor's styles to `root`, once. One constructable sheet per page, shared. */
+export declare function adoptEditorCss(root: Document | ShadowRoot): void;

package/dist/types/src/editor/element.d.ts

@@ -1,11 +1,13 @@
-/**
- * `<draft-editor>`: the editor as a custom element, for any framework or plain HTML. Its `source`
- * attribute or property sets the text; every kept edit fires `draft-change` with the new text.
- * It mounts when added to the page and stops its session when removed.
- */
-import { type MountedEditor } from './mount';
+import { type EditorOptions, type MountedEditor } from './mount';
+export type { DraftEventMap, HostEventName, HostEvents } from '../runtime/host';
+export type { EditorOptions };
 export interface DraftEditorElement extends HTMLElement {
     source: string;
+    /**
+     * Every `mountEditor` option except `source` and `onChange`. Callbacks apply live; a new
+     * `storageKey` mounts a new editor. A new object with the same values does nothing.
+     */
+    options: EditorOptions;
     readonly editor?: MountedEditor;
 }
 declare global {