@unofficialbox/box-open-elements 0.25.0 → 0.26.0

package/dist/patterns/process-modeler/model.d.ts

@@ -5,11 +5,17 @@ export interface ProcessBox<N = unknown> {
     kind: string;
     title: string;
     description?: string;
+    /** Description used in Technical view; absent values fall back to description. */
+    technicalDescription?: string;
+    /** Visual anatomy, independent of the host's kind identifier. */
+    shape?: "task" | "gateway" | "event" | "frame";
     path?: NodePath;
     /** Host identity at this path, used to reject stale saved positions. */
     fingerprint?: string;
     /** A frame draws behind its children and connects as one box. */
     frame?: boolean;
+    /** Show the loop mark in a repeating frame without inferring host semantics from its kind name. */
+    loopMark?: boolean;
     parentId?: string;
 }
 export interface ProcessLine {
@@ -25,17 +31,47 @@ export interface ProcessLine {
         x: number;
         y: number;
     }[];
+    /** Optional last-run traffic share, between 0 and 1. */
+    share?: number;
 }
 export type ProcessSide = "north" | "east" | "south" | "west";
 export interface ProcessConnection {
     name: string;
     kind: string;
     id?: string;
+    signIn?: string;
 }
 export interface ProcessVariable {
     name: string;
     value?: unknown;
     description?: string;
+    scope?: string;
+    startingValue?: string;
+    problem?: string;
+}
+/** Host-authored, readable outline; boxId links a row to a projected step. */
+export interface ProcessOutlineItem {
+    title: string;
+    description?: string;
+    boxId?: string;
+    children?: readonly ProcessOutlineItem[];
+}
+/** Host-supplied field values; the modeler draws controls and requests edits. */
+export interface ProcessField {
+    key: string;
+    label: string;
+    kind: "text" | "multiline" | "number" | "choice" | "boolean" | "expression" | "search" | "action";
+    value: string | number | boolean;
+    description?: string;
+    options?: readonly {
+        value: string;
+        label: string;
+        group?: string;
+    }[];
+    placeholder?: string;
+    required?: boolean;
+    disabled?: boolean;
+    problem?: string;
 }
 export interface ProcessPositionSnapshot {
     path?: NodePath;
@@ -56,11 +92,35 @@ export interface ProcessProjection<N = unknown> {
     boxes: readonly ProcessBox<N>[];
     lines: readonly ProcessLine[];
 }
+export interface ProcessKind extends FlowKind {
+    /** Alternative terms included in palette search. */
+    aliases?: readonly string[];
+    /** Host kind names never dictate the reusable visual anatomy. */
+    shape?: ProcessBox["shape"];
+    /** Notes and sections live in layout rather than the host workflow graph. */
+    placement?: "note" | "section";
+}
+export interface ProcessStepMetrics {
+    callsPerSecond?: number;
+    p95Ms?: number;
+    failedShare?: number;
+    /** True when the step was not measured in this run. */
+    notInRun?: boolean;
+}
+export interface ProcessLastRun {
+    label: string;
+    /** Keys are projected box IDs, supplied by the host. */
+    steps: Readonly<Record<string, ProcessStepMetrics>>;
+}
 export interface ProcessModel<D = unknown, N = unknown> {
     project(document: D): ProcessProjection<N>;
     /** Optional host arrangement, used by Tidy up and for missing positions. */
     arrange?(projection: ProcessProjection<N>): ProcessLayout;
-    /** Host-specific semantics supplement the generic free-graph checks. */
+    /**
+     * The host's workflow read-back/validation. When supplied it is authoritative:
+     * generic vocabulary-based graph checks are not added on top. A host may call
+     * graphChecks itself with its own kind names if it wants those checks too.
+     */
     validate?(document: D, projection: ProcessProjection<N>): readonly ProcessCheck[];
 }
 export interface BoxPosition {
@@ -80,6 +140,7 @@ export interface ProcessLayout {
     sections?: {
         id: string;
         title: string;
+        description?: string;
         x: number;
         y: number;
         width: number;
@@ -96,8 +157,9 @@ export interface ProcessCheck {
     path?: NodePath;
 }
 export interface ProcessEdit {
-    type: "add" | "delete" | "connect" | "disconnect" | "insert" | "reparent";
+    type: "add" | "delete" | "duplicate" | "connect" | "disconnect" | "reattach" | "insert" | "reparent";
     boxId?: string;
+    sourceId?: string;
     from?: string;
     to?: string;
     lineId?: string;
@@ -106,6 +168,9 @@ export interface ProcessEdit {
     parentId?: string;
     fromSide?: ProcessSide;
     toSide?: ProcessSide;
+    /** Optional branch presentation requested by a directional add. */
+    routeLabel?: string;
+    dashed?: boolean;
 }
 export interface ReversibleProcessEdit {
     undo(): void;

package/dist/patterns/process-modeler/model.js

@@ -35,10 +35,10 @@ export function completeLayout(projection, layout) {
             .filter((child) => child.parentId === box.id)
             .map(measure);
         const size = {
-            width: Math.max(box.frame ? 320 : 220, ...children.map((child) => child.width + 40)),
+            width: Math.max(box.frame || box.shape === "frame" ? 320 : box.shape === "gateway" || box.shape === "event" ? 56 : 224, ...children.map((child) => child.width + 40)),
             height: box.frame
                 ? Math.max(180, 64 + children.reduce((sum, child) => sum + child.height + 24, 0))
-                : 96,
+                : box.shape === "gateway" || box.shape === "event" ? 56 : 64,
         };
         sizes.set(box.id, size);
         return size;

package/dist/patterns/process-modeler/process-modeler.d.ts

@@ -1,6 +1,6 @@
 import { BaseElement } from "../../core/index.js";
-import type { FlowKind, NodePath } from "../flow-builder/model.js";
-import type { ProcessConnection, ProcessVariable, ProcessLoadOptions } from "./model.js";
+import type { NodePath } from "../flow-builder/model.js";
+import type { ProcessConnection, ProcessVariable, ProcessLoadOptions, ProcessKind, ProcessLastRun, ProcessOutlineItem, ProcessField } from "./model.js";
 import { ProcessHistory, type ProcessBox, type ProcessCheck, type ProcessEdit, type ProcessLayout, type ProcessModel, type ProcessProjection } from "./model.js";
 /** Projects host documents without owning workflow schemas or persistence. */
 export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends BaseElement {
@@ -11,13 +11,18 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     private projection;
     private layoutValue;
     private catalogValue;
+    private detailValue;
+    private lastRunValue?;
+    private showLastRunValue;
     private selectedId;
+    private selectedLineId;
     private connecting;
     private checks;
     private renderer?;
     private cleanupInspector?;
     private inspected?;
     private inspectedId?;
+    private inspectedControls;
     private historyValue;
     private viewport;
     private pointers;
@@ -26,37 +31,80 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     private gestureZoom;
     private insertion?;
     private selectedIds;
+    private clipboardIds;
+    private selectionToolbarKey;
+    private sectionSequence;
     private versionValue;
     private lastProjection;
+    private lastReadableProjection;
+    private readableValue;
     private lastDocument?;
     private connectionsValue;
     private variablesValue;
+    private outlineValue;
+    private fieldsValue;
+    private processTitleValue;
+    private processSummaryValue;
     private activePane;
     private portDrag?;
+    private endDrag?;
+    private pendingReattach?;
     private marquee?;
     private segmentDrag?;
+    private frameResize?;
+    private spacePressed;
     private dropLine?;
+    private paletteDragKind;
     private narrowValue;
     private suppressClick;
     private resizeObserver?;
     private routedLines;
     private computedChecks;
     get selectedBoxes(): readonly ProcessBox<N>[];
+    get selectedLine(): import("./model.js").ProcessLine | null;
     get selectedPath(): NodePath | null;
     set selectedPath(path: NodePath | null);
     get connections(): readonly ProcessConnection[];
     set connections(value: readonly ProcessConnection[]);
     get variables(): readonly ProcessVariable[];
     set variables(value: readonly ProcessVariable[]);
+    get outline(): readonly ProcessOutlineItem[];
+    set outline(value: readonly ProcessOutlineItem[]);
+    get fields(): Readonly<Record<string, readonly ProcessField[]>>;
+    set fields(value: Readonly<Record<string, readonly ProcessField[]>>);
+    get processTitle(): string;
+    set processTitle(value: string);
+    get processSummary(): string;
+    set processSummary(value: string);
+    get view(): Readonly<{
+        x: number;
+        y: number;
+        zoom: number;
+    }>;
+    setView(view: {
+        x: number;
+        y: number;
+        zoom: number;
+    }): void;
     get version(): string | number;
     get narrow(): boolean;
     get positions(): readonly import("./model.js").ProcessPositionSnapshot[];
+    /** Current drawing and last valid drawing; hosts own conversion and persistence. */
+    get readback(): Readonly<{
+        current: ProcessProjection<N> | null;
+        lastReadable: ProcessProjection<N> | null;
+        checks: readonly ProcessCheck[];
+        version: string | number;
+    }>;
     load(document: D, options?: ProcessLoadOptions): void;
     selectMany(ids: readonly string[]): void;
     get headingLevel(): number;
     set headingLevel(value: number);
     get disableConnections(): boolean;
     set disableConnections(value: boolean);
+    /** Hide duplicate process heading/view controls when the host supplies them. */
+    get embedMode(): boolean;
+    set embedMode(value: boolean);
     private arrangedLayout;
     get document(): D | undefined;
     get history(): ProcessHistory;
@@ -66,8 +114,14 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     set model(value: ProcessModel<D, N>);
     get layout(): ProcessLayout;
     set layout(value: ProcessLayout);
-    get catalog(): readonly FlowKind[];
-    set catalog(value: readonly FlowKind[]);
+    get catalog(): readonly ProcessKind[];
+    set catalog(value: readonly ProcessKind[]);
+    get detail(): "business" | "technical";
+    set detail(value: "business" | "technical");
+    get lastRun(): ProcessLastRun | undefined;
+    set lastRun(value: ProcessLastRun | undefined);
+    get showLastRun(): boolean;
+    set showLastRun(value: boolean);
     get locked(): boolean;
     set locked(value: boolean);
     get snapToGrid(): boolean;
@@ -79,6 +133,7 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     connectedCallback(): void;
     refresh(): void;
     select(id: string | null): void;
+    selectLine(id: string | null): void;
     setValidation(checks: readonly ProcessCheck[]): void;
     setValidationAtPath(message: string, path: NodePath): void;
     requestEdit(edit: ProcessEdit): void;
@@ -94,6 +149,7 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
         x: number;
         y: number;
     }[]): void;
+    resetLine(id: string): void;
     setNote(note: NonNullable<ProcessLayout["notes"]>[number] | null, id?: string | undefined): void;
     setSection(section: NonNullable<ProcessLayout["sections"]>[number] | null, id?: string | undefined): void;
     zoomBy(factor: number): void;
@@ -103,6 +159,8 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     private setupPanes;
     private renderPane;
     private selectionCommand;
+    arrangeSelection(action: 'left' | 'center' | 'right' | 'top' | 'middle' | 'bottom' | 'distribute-horizontal' | 'distribute-vertical'): void;
+    makeSection(title?: string): void;
     protected setupListeners(): void;
     private onKey;
     private pointerDown;
@@ -111,10 +169,13 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     private pointerEnd;
     private canvasPoint;
     private boxAt;
+    private sideAt;
     private lineAt;
     private markDropLine;
     private alignedPoint;
     private openChooser;
+    private addLayoutKind;
+    private showConnectTooltip;
     protected update(): void;
     private get allChecks();
     private collectChecks;
@@ -122,9 +183,12 @@ export declare class ProcessModeler<D = ProcessProjection, N = unknown> extends
     private place;
     private renderPalette;
     private renderChecks;
+    private renderField;
     private renderSelection;
+    private renderSelectionToolbar;
     private updateToolbar;
     private paintViewport;
+    private positionSelectionToolbar;
     private focusBox;
     private setStatus;
 }