@dou-ui/flow 0.0.0-stage → 0.1.0-alpha.1

package/dist/types/export/context.d.ts

@@ -0,0 +1,90 @@
+import { type Component } from 'vue';
+import type { PortAnchor } from '../context';
+import type { Rect } from '../core/model';
+import type { FlowMessages } from '../locale';
+export interface FlowDrawTextOptions {
+    /** In px; the editor's font size by default. */
+    size?: number;
+    /** A CSS font weight, e.g. `500`. */
+    weight?: string | number;
+    /** Line height in px; 1.5 times the size by default. */
+    lineHeight?: number;
+    color?: string;
+    align?: 'start' | 'center' | 'end';
+    /** Where the lines sit in the box when they take less than its height. */
+    valign?: 'top' | 'middle';
+    /** Keeps it to one line, cut with an ellipsis. */
+    nowrap?: boolean;
+}
+/**
+ * What a node type's `draw` gets to draw a node as SVG, for `exportSVG` and
+ * `exportPNG`. Coordinates are the node's own: `0, 0` is its top left.
+ */
+export interface FlowDrawContext {
+    /** The node's size. */
+    width: number;
+    height: number;
+    /** Its ports where they are on screen, relative to its top left. */
+    ports: ReadonlyMap<string, PortAnchor>;
+    /**
+     * A port as the editor draws it, where it is on screen: its ring or shape
+     * in its type's color, filled once connected. Empty for a port not shown.
+     */
+    port: (id: string) => string;
+    /** The editor's current strings. */
+    messages: FlowMessages;
+    /**
+     * The computed style of an element made with these classes, outermost
+     * first, inside the editor so its theme and variables apply. Pass colors
+     * read from it through `color`.
+     */
+    style: (...classes: string[]) => CSSStyleDeclaration;
+    /**
+     * A CSS color, also one with variables such as `var(--dou-color-text)`,
+     * as `rgb(…)`, `rgba(…)` or `#rrggbb`, which every SVG reader understands.
+     */
+    color: (value: string) => string;
+    /** Text in a box, wrapped as on screen and cut where the box ends. */
+    text: (value: string, box: Rect, options?: FlowDrawTextOptions) => string;
+    /** An icon component, e.g. from `@dou-ui/icons`, as SVG. */
+    icon: (icon: Component, box: Rect, color: string) => string;
+    /** An image; in a PNG it is embedded when its address can be read. */
+    image: (src: string, box: Rect, options?: {
+        radius?: number;
+    }) => string;
+    /** Escapes text for SVG markup. */
+    escape: (text: string) => string;
+}
+export declare const escapeXml: (text: string) => string;
+export declare const round: (value: number) => number;
+/**
+ * Lines of text that fit `max`: breaks between words and between wide
+ * characters, inside a word only when it alone is too long, and at new lines.
+ */
+export declare function wrapText(text: string, max: number, measure: (text: string) => number): string[];
+/** Cuts text to fit `max`, with an ellipsis. */
+export declare function cutText(text: string, max: number, measure: (text: string) => number, 
+/** Ends it with an ellipsis even when it fits: more text follows. */
+more?: boolean): string;
+export interface DrawTools {
+    /** Makes the context for one node. */
+    forNode: (size: {
+        width: number;
+        height: number;
+    }, ports: ReadonlyMap<string, PortAnchor>, port: (id: string) => string) => FlowDrawContext;
+    style: FlowDrawContext['style'];
+    color: FlowDrawContext['color'];
+    text: FlowDrawContext['text'];
+    measure: (text: string, size: number, weight?: string | number) => number;
+    fontFamily: string;
+    fontSize: number;
+    /** Image addresses the drawing used. */
+    images: Set<string>;
+    dispose: () => void;
+}
+/**
+ * The tools a drawing needs, reading the page inside `root`: styles from
+ * elements made in a hidden box there, text measured with the editor's font.
+ * `imageHref` turns an image address into the one written out.
+ */
+export declare function drawTools(root: HTMLElement, messages: FlowMessages, imageHref?: (src: string) => string | null): DrawTools;

package/dist/types/export/draw.d.ts

@@ -0,0 +1,72 @@
+import type { CSSProperties } from 'vue';
+import type { PortAnchor } from '../context';
+import type { EdgeRoute } from '../core/edge-types';
+import type { FlowEdge, FlowNode, Rect } from '../core/model';
+import { type NodeTypeSpec } from '../core/node-types';
+import { type DrawTools, type FlowDrawContext } from './context';
+export interface FlowExportOptions {
+    /**
+     * `all` (the default): every node and edge. `view`: what is in view now,
+     * at the canvas's size, cut at its edges. `selection`: the selected nodes,
+     * what is inside selected groups, and the edges between them; it throws
+     * when nothing is selected.
+     */
+    range?: 'all' | 'view' | 'selection';
+    /** Room around the drawing, in px. Defaults to `24`; not used by `view`. */
+    padding?: number;
+    /** Fills the canvas color behind it. Defaults to `true`; `false` leaves it see-through. */
+    background?: boolean;
+}
+export interface FlowImageOptions extends FlowExportOptions {
+    /** Pixels per CSS pixel. Defaults to `2`, sharp on most screens and in print. */
+    pixelRatio?: number;
+}
+export interface DrawNode {
+    node: FlowNode;
+    spec: NodeTypeSpec;
+    rect: Rect;
+    ports: ReadonlyMap<string, PortAnchor>;
+    container: boolean;
+    label: string;
+    /** Draws one of its ports, as `FlowDrawContext.port`. */
+    port: (id: string) => string;
+}
+export interface DrawEdge {
+    edge: FlowEdge;
+    type: string;
+    route: EdgeRoute;
+    style?: CSSProperties;
+    stale: boolean;
+}
+export interface DrawInput {
+    /** Containers outer first, then the other nodes lowest first. */
+    nodes: DrawNode[];
+    edges: DrawEdge[];
+    padding: number;
+    background: boolean;
+    /** The area to draw, in place of what the drawing covers plus `padding`. */
+    frame?: Rect;
+    /** Extensions' layers over the nodes, as `FlowExtension.drawLayer`. */
+    layers?: ((draw: FlowDrawContext) => string)[];
+}
+/** The points a path passes through or bends towards; the curve stays inside them. */
+export declare function pathPoints(path: string): {
+    x: number;
+    y: number;
+}[];
+/** A card like the editor's frame: border, background and radius. */
+export declare function drawCard(draw: FlowDrawContext, classes?: string[]): string;
+/** What a node type without `draw` is drawn as: its card, its name and its ports. */
+export declare function drawFallback(draw: FlowDrawContext, label: string, framed: boolean): string;
+/**
+ * The flow as an SVG document: containers, edges, edge labels, then the
+ * other nodes, as the editor stacks them.
+ */
+export declare function drawFlow(input: DrawInput, tools: DrawTools, root: HTMLElement): {
+    svg: string;
+    width: number;
+    height: number;
+};
+/** Reads an image into a data URL, or `null` when it can't be read from this page. */
+export declare function readImage(src: string): Promise<string | null>;
+export type { FlowDrawContext };

package/dist/types/flow-editor.vue.d.ts

@@ -0,0 +1,63 @@
+import { type FlowEditorExpose, type FlowEditorProps, type FlowEditorSlots } from './context';
+import { type FlowDocument, type FlowEdge, type FlowEndpoint, type FlowNode, type FlowSelection, type FlowViewport, type Point } from './core/model';
+import { FlowTransaction } from './core/transaction';
+type __VLS_Props = FlowEditorProps;
+type __VLS_Slots = FlowEditorSlots;
+type __VLS_ModelProps = {
+    modelValue?: FlowDocument;
+    'selection'?: FlowSelection;
+    'viewport'?: FlowViewport;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, FlowEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    transaction: (tr: FlowTransaction) => any;
+    transactionCancel: (tr: FlowTransaction) => any;
+    nodeClick: (node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    nodeDblclick: (node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    nodeContextmenu: (node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    edgeClick: (edge: FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+    edgeContextmenu: (edge: FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+    canvasClick: (point: Point, event: MouseEvent) => any;
+    canvasContextmenu: (point: Point, event: MouseEvent) => any;
+    connect: (edge: FlowEdge<import("./index.js").FlowData>) => any;
+    connectToCanvas: (from: Required<FlowEndpoint>, point: Point, event: MouseEvent) => any;
+    "update:modelValue": (value: FlowDocument) => any;
+    "update:selection": (value: FlowSelection) => any;
+    "update:viewport": (value: FlowViewport) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onTransaction?: ((tr: FlowTransaction) => any) | undefined;
+    onTransactionCancel?: ((tr: FlowTransaction) => any) | undefined;
+    onNodeClick?: ((node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onNodeDblclick?: ((node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onNodeContextmenu?: ((node: FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onEdgeClick?: ((edge: FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onEdgeContextmenu?: ((edge: FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onCanvasClick?: ((point: Point, event: MouseEvent) => any) | undefined;
+    onCanvasContextmenu?: ((point: Point, event: MouseEvent) => any) | undefined;
+    onConnect?: ((edge: FlowEdge<import("./index.js").FlowData>) => any) | undefined;
+    onConnectToCanvas?: ((from: Required<FlowEndpoint>, point: Point, event: MouseEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: FlowDocument) => any) | undefined;
+    "onUpdate:selection"?: ((value: FlowSelection) => any) | undefined;
+    "onUpdate:viewport"?: ((value: FlowViewport) => any) | undefined;
+}>, {
+    direction: "horizontal" | "vertical";
+    grid: number;
+    edgeType: string;
+    readonly: boolean;
+    simpleZoom: number;
+    guides: boolean;
+    minZoom: number;
+    maxZoom: number;
+    fitView: boolean;
+    fitMinZoom: number;
+    searchable: boolean;
+    panOnScroll: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/index.d.ts

@@ -0,0 +1,202 @@
+export declare const DouFlowEditor: import("dou-ui").WithInstall<{
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./context").FlowEditorProps & {
+        modelValue?: import("./index.js").FlowDocument;
+        selection?: import("./index.js").FlowSelection;
+        viewport?: import("./index.js").FlowViewport;
+    }> & Readonly<{
+        onTransaction?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+        onTransactionCancel?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+        onNodeClick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onNodeDblclick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onNodeContextmenu?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onEdgeClick?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onEdgeContextmenu?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onCanvasClick?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        onCanvasContextmenu?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        onConnect?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>) => any) | undefined;
+        onConnectToCanvas?: ((from: Required<import("./index.js").FlowEndpoint>, point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: import("./index.js").FlowDocument) => any) | undefined;
+        "onUpdate:selection"?: ((value: import("./index.js").FlowSelection) => any) | undefined;
+        "onUpdate:viewport"?: ((value: import("./index.js").FlowViewport) => any) | undefined;
+    }>, import("./context").FlowEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        transaction: (tr: import("./index.js").FlowTransaction) => any;
+        transactionCancel: (tr: import("./index.js").FlowTransaction) => any;
+        nodeClick: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+        nodeDblclick: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+        nodeContextmenu: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+        edgeClick: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+        edgeContextmenu: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+        canvasClick: (point: import("./index.js").Point, event: MouseEvent) => any;
+        canvasContextmenu: (point: import("./index.js").Point, event: MouseEvent) => any;
+        connect: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>) => any;
+        connectToCanvas: (from: Required<import("./index.js").FlowEndpoint>, point: import("./index.js").Point, event: MouseEvent) => any;
+        "update:modelValue": (value: import("./index.js").FlowDocument) => any;
+        "update:selection": (value: import("./index.js").FlowSelection) => any;
+        "update:viewport": (value: import("./index.js").FlowViewport) => any;
+    }, import("vue").PublicProps, {
+        direction: "horizontal" | "vertical";
+        grid: number;
+        edgeType: string;
+        readonly: boolean;
+        simpleZoom: number;
+        guides: boolean;
+        minZoom: number;
+        maxZoom: number;
+        fitView: boolean;
+        fitMinZoom: number;
+        searchable: boolean;
+        panOnScroll: boolean;
+    }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("./context").FlowEditorProps & {
+        modelValue?: import("./index.js").FlowDocument;
+        selection?: import("./index.js").FlowSelection;
+        viewport?: import("./index.js").FlowViewport;
+    }> & Readonly<{
+        onTransaction?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+        onTransactionCancel?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+        onNodeClick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onNodeDblclick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onNodeContextmenu?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onEdgeClick?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onEdgeContextmenu?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+        onCanvasClick?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        onCanvasContextmenu?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        onConnect?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>) => any) | undefined;
+        onConnectToCanvas?: ((from: Required<import("./index.js").FlowEndpoint>, point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: import("./index.js").FlowDocument) => any) | undefined;
+        "onUpdate:selection"?: ((value: import("./index.js").FlowSelection) => any) | undefined;
+        "onUpdate:viewport"?: ((value: import("./index.js").FlowViewport) => any) | undefined;
+    }>, import("./context").FlowEditorExpose, {}, {}, {}, {
+        direction: "horizontal" | "vertical";
+        grid: number;
+        edgeType: string;
+        readonly: boolean;
+        simpleZoom: number;
+        guides: boolean;
+        minZoom: number;
+        maxZoom: number;
+        fitView: boolean;
+        fitMinZoom: number;
+        searchable: boolean;
+        panOnScroll: boolean;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("./context").FlowEditorProps & {
+    modelValue?: import("./index.js").FlowDocument;
+    selection?: import("./index.js").FlowSelection;
+    viewport?: import("./index.js").FlowViewport;
+}> & Readonly<{
+    onTransaction?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+    onTransactionCancel?: ((tr: import("./index.js").FlowTransaction) => any) | undefined;
+    onNodeClick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onNodeDblclick?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onNodeContextmenu?: ((node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onEdgeClick?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onEdgeContextmenu?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any) | undefined;
+    onCanvasClick?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+    onCanvasContextmenu?: ((point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+    onConnect?: ((edge: import("./index.js").FlowEdge<import("./index.js").FlowData>) => any) | undefined;
+    onConnectToCanvas?: ((from: Required<import("./index.js").FlowEndpoint>, point: import("./index.js").Point, event: MouseEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: import("./index.js").FlowDocument) => any) | undefined;
+    "onUpdate:selection"?: ((value: import("./index.js").FlowSelection) => any) | undefined;
+    "onUpdate:viewport"?: ((value: import("./index.js").FlowViewport) => any) | undefined;
+}>, import("./context").FlowEditorExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    transaction: (tr: import("./index.js").FlowTransaction) => any;
+    transactionCancel: (tr: import("./index.js").FlowTransaction) => any;
+    nodeClick: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    nodeDblclick: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    nodeContextmenu: (node: import("./index.js").FlowNode<import("./index.js").FlowData>, event: MouseEvent) => any;
+    edgeClick: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+    edgeContextmenu: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>, event: MouseEvent) => any;
+    canvasClick: (point: import("./index.js").Point, event: MouseEvent) => any;
+    canvasContextmenu: (point: import("./index.js").Point, event: MouseEvent) => any;
+    connect: (edge: import("./index.js").FlowEdge<import("./index.js").FlowData>) => any;
+    connectToCanvas: (from: Required<import("./index.js").FlowEndpoint>, point: import("./index.js").Point, event: MouseEvent) => any;
+    "update:modelValue": (value: import("./index.js").FlowDocument) => any;
+    "update:selection": (value: import("./index.js").FlowSelection) => any;
+    "update:viewport": (value: import("./index.js").FlowViewport) => any;
+}, string, {
+    direction: "horizontal" | "vertical";
+    grid: number;
+    edgeType: string;
+    readonly: boolean;
+    simpleZoom: number;
+    guides: boolean;
+    minZoom: number;
+    maxZoom: number;
+    fitView: boolean;
+    fitMinZoom: number;
+    searchable: boolean;
+    panOnScroll: boolean;
+}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: import("./context").FlowEditorSlots;
+}), import("vue").HTMLAttributes>;
+export declare const DouFlowControls: import("dou-ui").WithInstall<import("vue").DefineComponent<import("./context").FlowControlsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("./context").FlowControlsProps> & Readonly<{}>, {
+    tidy: boolean;
+    history: boolean;
+    placement: import("./context").FlowPanelPlacement;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, import("vue").HTMLAttributes>;
+export declare const DouFlowMinimap: import("dou-ui").WithInstall<import("vue").DefineComponent<import("./context").FlowMinimapProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("./context").FlowMinimapProps> & Readonly<{}>, {
+    width: number;
+    height: number;
+    placement: import("./context").FlowPanelPlacement;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, import("vue").HTMLAttributes>;
+export declare const DouFlowPort: import("dou-ui").WithInstall<import("vue").DefineComponent<{
+    id: string;
+    auto?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    id: string;
+    auto?: boolean;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, import("vue").HTMLAttributes>;
+export default DouFlowEditor;
+export { useFlowEditor } from './context';
+export type { FlowControlsProps, FlowEditorContext, FlowEditorEmits, FlowEditorExpose, FlowEditorProps, FlowInsertOptions, FlowMinimapProps, FlowNodePreview, FlowEditorSlots, FlowPanelPlacement, FlowSearchQuery, NodeMetrics, PortAnchor, PortState, } from './context';
+export { flowLocales, useFlowMessages } from './locale';
+export type { FlowMessages, FlowMessagesOverride } from './locale';
+export { defaultNode } from './components/default-node';
+export type { DefaultNodeData } from './components/default-node';
+export { groupNode } from './components/group-node';
+export type { GroupNodeData } from './components/group-node';
+export { containerAt, FlowTree } from './core/groups';
+export { defineNodeType, labelOf, portSide, portsOf, resizeOf } from './core/node-types';
+export type { NodePaletteSpec, NodeResize, NodeTypeSpec, NodeViewProps } from './core/node-types';
+export type { FlowMenuTarget, FlowToolbarItem } from './core/menu';
+export { createId, emptyDocument, emptySelection } from './core/model';
+export type { FlowData, FlowDocument, FlowEdge, FlowEndpoint, FlowNode, FlowPortSpec, FlowSelection, FlowViewport, Point, PortSide, Rect, } from './core/model';
+export { checkDocument, migrateDocument } from './document';
+export type { CheckDocumentOptions, DocumentProblem } from './document';
+export { applyFlowSteps, compactFlowSteps, FlowTransaction } from './core/transaction';
+export type { FlowStep, FlowTransactionMeta } from './core/transaction';
+export { FlowHistory } from './core/history';
+export { defineFlowExtension } from './core/extension';
+export type { FlowExtension, FlowExtensionContext, FlowHistoryHandler, FlowKeyHandler, FlowPress, FlowPressHandler, } from './core/extension';
+export { flowKit } from './kit';
+export type { FlowKitOptions } from './kit';
+export { moveLayer } from './layers';
+export { drawCard } from './export/draw';
+export type { FlowExportOptions, FlowImageOptions } from './export/draw';
+export type { FlowDrawContext, FlowDrawTextOptions } from './export/context';
+export type { LayerMove } from './layers';
+export { flowOrder } from './core/order';
+export { canJoin, displacedEdges, joinRefusal, primaryType, reaches, typesMatch, } from './core/connect';
+export type { ConnectOptions, FlowConnection, JoinRefusal, PortShape, PortTypes, PortTypeSpec, } from './core/connect';
+export { boundsOf, intersects, rectFrom, snapBox, snapTo } from './core/geometry';
+export { bezierEdge, bezierPath, defineEdgeType, stepEdge, straightEdge } from './core/edge-types';
+export type { EdgeAnchor, EdgeRoute, EdgeTypeSpec } from './core/edge-types';
+export type { Guide, SnapResult } from './core/geometry';
+declare module 'vue' {
+    interface GlobalComponents {
+        DouFlowEditor: typeof DouFlowEditor;
+        DouFlowControls: typeof DouFlowControls;
+        DouFlowMinimap: typeof DouFlowMinimap;
+        DouFlowPort: typeof DouFlowPort;
+    }
+}

package/dist/types/kit.d.ts

@@ -0,0 +1,22 @@
+import { type FlowExtension } from './core/extension';
+export interface FlowKitOptions {
+    /** The built-in context menu items: copy, paste, delete and so on. */
+    menu?: boolean;
+    /** The toolbar over the selected nodes: duplicate, delete and more. */
+    toolbar?: boolean;
+    /** The `group` node type, with its menu items and `mod+g` / `mod+shift+g`. */
+    group?: boolean;
+    /**
+     * Moving nodes up and down the stack: menu items and `mod+]` / `mod+[`,
+     * with Shift for the very top or bottom.
+     */
+    layers?: boolean;
+}
+/**
+ * The editor's built-in parts as extensions: the default node type, the
+ * `bezier`, `step` and `straight` edge types, group nodes, stacking order,
+ * the context menu and the toolbar over selected nodes. Pass it along with
+ * your own extensions, e.g. `[flowKit(), aiNodes]`; without `extensions`
+ * the editor uses it alone.
+ */
+export declare function flowKit(options?: FlowKitOptions): FlowExtension[];

package/dist/types/layers.d.ts

@@ -0,0 +1,24 @@
+import type { FlowEditorContext } from './context';
+export type LayerMove = 'front' | 'forward' | 'backward' | 'back';
+/**
+ * The selected nodes moved in the stack: to the top or bottom of everything,
+ * or one step past the nearest node each overlaps, so the step can be seen.
+ * Returns the `z` of every node whose place changed, numbering the stack
+ * from 0 at the bottom; nothing when nothing would change.
+ */
+export declare function layerChanges(ctx: FlowEditorContext, move: LayerMove): Map<string, number>;
+/**
+ * Moves the selected nodes in the stack, as one undo step, and says so to
+ * screen readers. Returns `false` when nothing moved, e.g. when they already
+ * are at the top; that is said too, unless `announce` is `false`.
+ */
+export declare function moveLayer(ctx: FlowEditorContext, move: LayerMove, options?: {
+    announce?: boolean;
+}): boolean;
+/**
+ * Stacking order: what is added lands on top, also once nodes have been
+ * moved in the stack.
+ */
+export declare const stacking: import(".").FlowExtension;
+/** Moving nodes up and down the stack from the node menu and with Ctrl / ⌘ + [ and ]. */
+export declare const layers: import(".").FlowExtension;

package/dist/types/locale.d.ts

@@ -0,0 +1,172 @@
+import type { WhiteboardArrow, WhiteboardDash, WhiteboardRoute } from './whiteboard/model';
+import { type MaybeRefOrGetter } from 'vue';
+export interface FlowMessages {
+    /** The canvas's accessible description. */
+    canvas: string;
+    /** What a node is called to screen readers. */
+    node: string;
+    /** Describes a node's ports; `{inputs}`, `{outputs}` and `{connected}` are counts. */
+    ports: string;
+    input: string;
+    output: string;
+    zoomIn: string;
+    zoomOut: string;
+    /** `{value}` is the zoom in percent. */
+    zoomLevel: string;
+    /** The tip on the zoom level, which resets it. */
+    zoomReset: string;
+    fit: string;
+    tidy: string;
+    minimap: string;
+    undo: string;
+    redo: string;
+    controls: string;
+    /** The context menu and the floating toolbar. */
+    menu: string;
+    toolbar: string;
+    copy: string;
+    cut: string;
+    paste: string;
+    duplicate: string;
+    delete: string;
+    selectAll: string;
+    more: string;
+    /** Editing an edge's text. */
+    editLabel: string;
+    label: string;
+    /** The list offered when an edge is dropped on the canvas. */
+    search: string;
+    noTypes: string;
+    /** Announcements; `{count}` is a number. */
+    deleted: string;
+    tidied: string;
+    undone: string;
+    /** Said when an extension cancels a change without saying why. */
+    changeCancelled: string;
+    redone: string;
+    connected: string;
+    /** An edge selected from the keyboard; `{from}` and `{to}` are node names. */
+    edge: string;
+    /** Follows `edge` when it has a label. */
+    edgeLabel: string;
+    noEdges: string;
+    labelSaved: string;
+    /** Groups. */
+    group: string;
+    groupName: string;
+    makeGroup: string;
+    ungroup: string;
+    /** Takes a node out of the group it is in. */
+    leaveGroup: string;
+    /**
+     * Moving nodes up and down the stack. `top` and `bottom` say nothing moved
+     * because the nodes already are there; `noneAbove` and `noneBelow`, that
+     * no other node overlaps them that way.
+     */
+    layers: {
+        front: string;
+        forward: string;
+        backward: string;
+        back: string;
+        top: string;
+        bottom: string;
+        noneAbove: string;
+        noneBelow: string;
+    };
+    expand: string;
+    collapse: string;
+    /** Between parts of a node's description. */
+    separator: string;
+    /** `{group}` is the group's name. */
+    inGroup: string;
+    /** `{count}` nodes inside a group. */
+    groupSize: string;
+    /** Announced; `{group}` is the group's name. */
+    joinedGroup: string;
+    leftGroup: string;
+    ungrouped: string;
+    expanded: string;
+    collapsed: string;
+    /** After resizing from the keyboard; `{node}`, `{width}` and `{height}`. */
+    resized: string;
+    /** Why the selection can't be grouped. */
+    groupMixed: string;
+    /** `{node}` is the new node's name. */
+    added: string;
+    /** While connecting from the keyboard; `{node}` and `{port}` are names. */
+    connectTo: string;
+    noTarget: string;
+    /** `{count}` edges no longer fit their ports. */
+    stale: string;
+    /** Why an edge was refused, announced when it is dropped. */
+    refused: {
+        direction: string;
+        self: string;
+        type: string;
+        duplicate: string;
+        cycle: string;
+        custom: string;
+    };
+    status: {
+        wait: string;
+        process: string;
+        finish: string;
+        error: string;
+    };
+    /** The whiteboard's toolbar and nodes. */
+    board: {
+        tools: string;
+        select: string;
+        hand: string;
+        rect: string;
+        ellipse: string;
+        diamond: string;
+        sticky: string;
+        text: string;
+        /** The field for a node's text. */
+        editText: string;
+        /** Announced when a tool is picked; `{tool}` is its name. */
+        picked: string;
+        /** A node's name when it has text; `{kind}` is what it is, as `rect` or `sticky`. */
+        named: string;
+        pen: string;
+        eraser: string;
+        /** The toolbar button that inserts an image. */
+        image: string;
+        /** A pen stroke. */
+        ink: string;
+        /** `{name}` is the file's name. */
+        imageFailed: string;
+        /** `{count}` strokes were erased. */
+        erased: string;
+        rotate: string;
+        unrotate: string;
+        /** `{degrees}` is the node's new turn. */
+        turned: string;
+        /** The connector buttons' names; `{value}` is the current choice. */
+        routeOf: string;
+        dashOf: string;
+        arrowOf: string;
+        routes: Record<WhiteboardRoute, string>;
+        dashes: Record<WhiteboardDash, string>;
+        arrows: Record<WhiteboardArrow, string>;
+        /** The connector buttons' `{value}` when the selected connectors differ. */
+        mixed: string;
+        /** Announced after a choice; `{value}` is the new one. */
+        routeSet: string;
+        dashSet: string;
+        arrowSet: string;
+    };
+}
+export declare const flowLocales: Record<string, FlowMessages>;
+/** Texts to change; nested groups are merged, so only the ones given are replaced. */
+export type FlowMessagesOverride = {
+    [K in keyof FlowMessages]?: FlowMessages[K] extends string ? string : Partial<FlowMessages[K]>;
+};
+/**
+ * The flow editor's texts, picked by the name of DouUI's current locale.
+ * Pass `messages` to override any of them.
+ */
+export declare function useFlowMessages(override?: MaybeRefOrGetter<FlowMessagesOverride | undefined>): import("vue").ComputedRef<FlowMessages>;
+/** Fills `{name}` placeholders. */
+export declare const format: (text: string, params: Record<string, string | number>) => string;

package/dist/types/whiteboard/board-draft.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;