@flowscape-ui/core-sdk 1.0.6 → 1.0.8

package/dist/index.d.ts

@@ -346,6 +346,7 @@ interface BaseNodeOptions {
     y?: number;
     width?: number;
     height?: number;
+    rotation?: number;
 }
 declare abstract class BaseNode<T extends Konva.Node = Konva.Node> implements NodeHandle<T> {
     protected konvaNode: T;
@@ -432,6 +433,10 @@ interface CoreEvents {
     'camera:panStep': [{
         panStep: number;
     }];
+    /** Camera pan gesture started (mouse down) */
+    'camera:panStart': [{
+        button: number;
+    }];
     /** Camera was moved (panning) */
     'camera:pan': [{
         dx: number;
@@ -441,10 +446,18 @@ interface CoreEvents {
             y: number;
         };
     }];
+    /** Camera pan gesture ended (mouse up / leave) */
+    'camera:panEnd': [];
     /** Plugin was added */
     'plugin:added': [pluginName: string];
     /** Plugin was removed */
     'plugin:removed': [pluginName: string];
+    /** Persistence restore failed */
+    'persistence:restore:error': [{
+        error: string;
+    }];
+    /** Persistence restore completed */
+    'persistence:restore:done': [];
     /** Stage was resized */
     'stage:resized': [{
         width: number;
@@ -1307,6 +1320,10 @@ declare class CoreEngine {
      * Enable or disable auto-resize
      */
     setAutoResize(enabled: boolean): void;
+    /**
+     * Show the canvas container after persistence restore completes
+     */
+    showContainer(): void;
 }
 
 /**
@@ -1472,15 +1489,21 @@ declare class CameraHotkeysPlugin extends Plugin {
     private _last;
     private _prevCursor;
     private _prevStageDraggable?;
+    private _onMouseDownDOM;
+    private _onMouseMoveDOM;
+    private _onMouseUpDOM;
+    private _onMouseLeaveDOM;
+    private _panningCursorRafId;
+    private _onCameraPanEvent;
     constructor(options?: CameraHotkeysOptions);
     setOptions(patch: Partial<CameraHotkeysOptions>): void;
     protected onAttach(core: CoreEngine): void;
     protected onDetach(core: CoreEngine): void;
     private _onWheelDOM;
-    private _onMouseDownKonva;
-    private _onMouseMoveKonva;
-    private _onMouseUpKonva;
-    private _onMouseLeaveKonva;
+    private _applyPanningCursor;
+    private _startPanningCursorLoop;
+    private _stopPanningCursorLoop;
+    private _restoreCursor;
     private _onContextMenuDOM;
     private _handleKeyDown;
     private _isEditableTarget;
@@ -1498,12 +1521,17 @@ declare class ContentFromClipboardPlugin extends Plugin {
     private _core?;
     private _options;
     private _dragDropAddon;
+    private _middlePressed;
+    private _onContainerMouseDown;
+    private _onContainerMouseUp;
     constructor(options?: ContentFromClipboardPluginOptions);
     protected onAttach(core: CoreEngine): void;
     protected onDetach(_core: CoreEngine): void;
     private _onPaste;
+    private _onPasteAsync;
     private _handlePaste;
     handleDrop(e: DragEvent): Promise<void>;
+    private _resetAltKeyStuck;
     private _handleDataTransfer;
     private _pasteSvgText;
     private _pasteSvgFile;
@@ -1744,15 +1772,45 @@ declare class NodeHotkeysPlugin extends Plugin {
     private _options;
     private _clipboard;
     private _selectionPlugin?;
+    private _isAltPressed;
+    private _isMouseDown;
+    private _isCameraPanning;
+    private _cloneStartPos;
+    private _clonedNodes;
+    private _cloneOriginals;
+    private _cloneDragEventsStarted;
+    private _clonePrevDraggable;
+    private _prevCursor;
+    private _isCloneCursorActive;
+    private _doubleCursorCss;
+    private _cloneOriginalsHidden;
+    private _cloneAutoPanRafId;
+    private _cloneAutoPanActive;
+    private _cloneAutoPanEdgePx;
+    private _cloneAutoPanMaxSpeedPx;
     constructor(options?: NodeHotkeysOptions);
+    private _startCloneAutoPanLoop;
+    private _stopCloneAutoPanLoop;
+    private _getHoveredNodeUnderPointer;
     protected onAttach(core: CoreEngine): void;
     protected onDetach(_core: CoreEngine): void;
+    private _onCameraPanStart;
+    private _onCameraPanEnd;
     private _onPaste;
     private _onKeyDown;
+    private _onKeyUp;
+    private _onMouseDown;
+    private _onMouseUp;
+    private _onMouseMove;
+    private _updateCloneCursor;
+    private _isOverCornerRadiusHandle;
+    private _getDoubleCursorCss;
+    private _restoreCursor;
     private _isEditableTarget;
     private _handleCopy;
     private _handleCut;
     private _handlePaste;
+    private _detachClonesFromFrame;
     private _handleDelete;
     private _getSelectedNodes;
     private _deleteNodes;
@@ -1765,6 +1823,7 @@ declare class NodeHotkeysPlugin extends Plugin {
     private _getScreenCenter;
     private _getClipboardCenter;
     private _computeSelectionWorldCenter;
+    private _centerOnSelection;
     private _handleMoveUp;
     private _handleMoveDown;
     private _handleMoveToTop;
@@ -1779,6 +1838,201 @@ declare class NodeHotkeysPlugin extends Plugin {
      * - For node inside group — FORBIDDEN to change z-index
      */
     private _syncGroupZIndex;
+    private _handleCloneStart;
+    private _handleCloneMove;
+    private _handleCloneEnd;
+}
+
+/**
+ * IndexedDB storage service for canvas persistence.
+ * Handles storage of canvas state and blob files (images, videos, etc.)
+ */
+interface StoredCanvasState {
+    id: string;
+    state: string;
+    updatedAt: number;
+}
+interface StoredBlob {
+    id: string;
+    blob: Blob;
+    mimeType: string;
+    originalUrl?: string | undefined;
+}
+declare class PersistenceStorage {
+    private _dbName;
+    private _db;
+    private _dbPromise;
+    constructor(_dbName?: string);
+    /**
+     * Initialize IndexedDB connection
+     */
+    init(): Promise<void>;
+    private _openDatabase;
+    private _getDb;
+    /**
+     * Save canvas state to IndexedDB
+     */
+    saveCanvasState(id: string, state: string): Promise<void>;
+    /**
+     * Load canvas state from IndexedDB
+     */
+    loadCanvasState(id: string): Promise<StoredCanvasState | null>;
+    /**
+     * Delete canvas state from IndexedDB
+     */
+    deleteCanvasState(id: string): Promise<void>;
+    /**
+     * List all canvas states
+     */
+    listCanvasStates(): Promise<StoredCanvasState[]>;
+    /**
+     * Save blob to IndexedDB
+     */
+    saveBlob(id: string, blob: Blob, originalUrl?: string): Promise<void>;
+    /**
+     * Load blob from IndexedDB
+     */
+    loadBlob(id: string): Promise<StoredBlob | null>;
+    /**
+     * Delete blob from IndexedDB
+     */
+    deleteBlob(id: string): Promise<void>;
+    /**
+     * Load multiple blobs by IDs
+     */
+    loadBlobs(ids: string[]): Promise<Map<string, StoredBlob>>;
+    /**
+     * Save multiple blobs
+     */
+    saveBlobs(blobs: Map<string, {
+        blob: Blob;
+        originalUrl?: string;
+    }>): Promise<void>;
+    /**
+     * List all blob IDs
+     */
+    listBlobIds(): Promise<string[]>;
+    /**
+     * Clear all blobs not referenced in the given set
+     */
+    cleanupUnusedBlobs(usedBlobIds: Set<string>): Promise<number>;
+    /**
+     * Clear all data (canvas states and blobs)
+     */
+    clearAll(): Promise<void>;
+    /**
+     * Close database connection
+     */
+    close(): void;
+    /**
+     * Delete the entire database
+     */
+    deleteDatabase(): Promise<void>;
+}
+
+/**
+ * PersistencePlugin - Auto-saves canvas state to IndexedDB on any change.
+ * Restores state on page reload. Supports export/import to JSON with embedded blobs.
+ */
+
+interface PersistencePluginOptions {
+    /** Unique ID for this canvas (default: 'default') */
+    canvasId?: string;
+    /** Debounce delay in ms before saving (default: 300) */
+    debounceMs?: number;
+    /** Auto-restore on attach (default: true) */
+    autoRestore?: boolean;
+    /** Custom IndexedDB database name */
+    dbName?: string;
+    /** Enable debug logging */
+    debug?: boolean;
+}
+declare class PersistencePlugin extends Plugin {
+    private _core;
+    private _storage;
+    private _canvasId;
+    private _debounceMs;
+    private _autoRestore;
+    private _debug;
+    private _saveTimer;
+    private _isRestoring;
+    private _blobUrls;
+    private _initialized;
+    /** Maps original blob URLs to stored blob IDs */
+    private _blobUrlToId;
+    constructor(options?: PersistencePluginOptions);
+    protected onAttach(core: CoreEngine): void;
+    protected onDetach(core: CoreEngine): void;
+    private _initialize;
+    private _subscribeToEvents;
+    private _unsubscribeFromEvents;
+    private _onNodeCreated;
+    private _onNodeChange;
+    private _onClipboardPaste;
+    /**
+     * Capture blob data from a media node if it has a blob URL
+     */
+    private _captureBlobFromNode;
+    private _onNodeTransformed;
+    private _onCameraChange;
+    private _onKonvaDragEnd;
+    private _onKonvaTransformEnd;
+    private _onTextChange;
+    /**
+     * Subscribe to textChange events for all existing TextNodes
+     */
+    private _subscribeToTextNodes;
+    private _scheduleSave;
+    private _cancelPendingSave;
+    /**
+     * Save current canvas state to IndexedDB
+     */
+    save(): Promise<void>;
+    /**
+     * Restore canvas state from IndexedDB
+     */
+    restore(): Promise<boolean>;
+    /**
+     * Clear saved state from IndexedDB
+     */
+    clear(): Promise<void>;
+    /**
+     * Export canvas to JSON string with embedded blobs
+     */
+    exportToJSON(): Promise<string>;
+    /**
+     * Import canvas from JSON string with embedded blobs
+     */
+    importFromJSON(json: string): void;
+    /**
+     * Download canvas as JSON file
+     */
+    downloadJSON(filename?: string): Promise<void>;
+    /**
+     * Upload and import canvas from JSON file
+     */
+    uploadJSON(): Promise<void>;
+    /**
+     * Check if there is saved state
+     */
+    hasSavedState(): Promise<boolean>;
+    /**
+     * Get storage instance for advanced usage
+     */
+    getStorage(): PersistenceStorage;
+    /**
+     * Get canvas ID
+     */
+    getCanvasId(): string;
+    /**
+     * Set canvas ID (will trigger restore if autoRestore is enabled)
+     */
+    setCanvasId(id: string): Promise<void>;
+    private _log;
+    /**
+     * Capture blob URLs from all nodes that haven't been captured yet
+     */
+    private _captureAllBlobUrls;
 }
 
 interface RulerGuidesPluginOptions {
@@ -2465,6 +2719,53 @@ declare class TextAutoTrimAddon extends NodeAddon<TextNode> {
     private normalize;
 }
 
+/**
+ * Canvas serialization/deserialization utility.
+ * Handles conversion of canvas state to/from JSON format with blob extraction.
+ */
+
+interface SerializedNode {
+    id: string;
+    type: string;
+    attrs: Record<string, unknown>;
+    zIndex: number;
+    blobId?: string;
+    children?: SerializedNode[];
+    parentFrameId?: string;
+}
+interface SerializedCamera {
+    x: number;
+    y: number;
+    scale: number;
+}
+interface SerializedCanvas {
+    version: number;
+    timestamp: number;
+    nodes: SerializedNode[];
+    camera: SerializedCamera;
+    blobIds: string[];
+}
+interface ExtractedBlob {
+    id: string;
+    blob: Blob;
+    originalUrl: string;
+}
+interface DeserializeOptions {
+    blobUrls?: Map<string, string>;
+    clearExisting?: boolean;
+}
+interface SerializeOptions {
+    /** Pre-existing mapping of blob URLs to blob IDs (from captured blobs) */
+    blobUrlToId?: Map<string, string>;
+}
+declare function serializeCanvas(core: CoreEngine, options?: SerializeOptions): SerializedCanvas;
+declare function extractBlobs(core: CoreEngine): Promise<Map<string, ExtractedBlob>>;
+declare function deserializeCanvas(core: CoreEngine, state: SerializedCanvas, options?: DeserializeOptions): void;
+declare function exportCanvasToJSON(core: CoreEngine): Promise<string>;
+declare function importCanvasFromJSON(core: CoreEngine, json: string, options?: Omit<DeserializeOptions, 'blobUrls'>): void;
+declare function createBlobUrlMap(state: SerializedCanvas, storedBlobs: Map<string, Blob>): Map<string, string>;
+declare function revokeBlobUrls(blobUrls: Map<string, string>): void;
+
 /**
  * DebounceHelper - utility for debouncing (delayed execution)
  *
@@ -2555,4 +2856,4 @@ declare const frameTemplates: {
     };
 };
 
-export { type ArcNodeHandle, type ArcNodeOptions, AreaSelectionPlugin, type AreaSelectionPluginOptions, type ArrowNodeHandle, type ArrowNodeOptions, type BaseNodeOptions, type CameraHotkeysOptions, CameraHotkeysPlugin, CameraManager, type CircleNodeHandle, type CircleNodeOptions, ContentFromClipboardPlugin, type ContentFromClipboardPluginOptions, CoreEngine, type CoreEngineOptions, type CoreEvents, DebounceHelper, type EllipseNodeHandle, type EllipseNodeOptions, EventBus, FrameNode, type FrameNodeOptions, type FrameOptions, type GifNodeHandle, type GifNodeOptions, GridPlugin, type GridPluginOptions, type GroupNodeHandle, type GroupNodeOptions, type HistoryAction, HistoryManager, HistoryPlugin, type HistoryPluginOptions, ImageHoverFilterAddon, type ImageNodeHandle, type ImageNodeOptions, type ImageSource, type KonvaArc, type KonvaArrow, type KonvaCircle, type KonvaEllipse, type KonvaGroup, type KonvaGroupConfig, type KonvaImage, type KonvaLayer, type KonvaNode, type KonvaNodeConfig, type KonvaRegularPolygon, type KonvaRing, type KonvaShape, type KonvaStage, type KonvaStar, type KonvaText, type LogoOptions, LogoPlugin, MediaPlaceholder, type MediaPlaceholderOptions, NodeAddon, NodeAddons, type NodeAddonsHandle, type NodeHandle, type NodeHotkeysOptions, NodeHotkeysPlugin, NodeManager, PluginAddon, Plugins, type RegularPolygonNodeHandle, type RegularPolygonNodeOptions, type RingNodeHandle, type RingNodeOptions, RulerGuidesAddon, RulerGuidesPlugin, type RulerGuidesPluginOptions, RulerHighlightAddon, RulerHighlightPlugin, type RulerHighlightPluginOptions, RulerManagerAddon, RulerManagerPlugin, type RulerManagerPluginOptions, RulerPlugin, type RulerPluginOptions, SelectionPlugin, type SelectionPluginOptions, ShapeHoverHighlightAddon, type ShapeNodeHandle, type ShapeNodeOptions, type StarNodeHandle, type StarNodeOptions, type SvgNodeHandle, type SvgNodeOptions, TextAutoTrimAddon, type TextNodeHandle, type TextNodeOptions, ThrottleHelper, type VideoNodeHandle, type VideoNodeOptions, VideoOverlayAddon, type VideoOverlayAddonOptions, VisualGuidesPlugin, type VisualGuidesPluginOptions, frameTemplates };
+export { type ArcNodeHandle, type ArcNodeOptions, AreaSelectionPlugin, type AreaSelectionPluginOptions, type ArrowNodeHandle, type ArrowNodeOptions, type BaseNodeOptions, type CameraHotkeysOptions, CameraHotkeysPlugin, CameraManager, type CircleNodeHandle, type CircleNodeOptions, ContentFromClipboardPlugin, type ContentFromClipboardPluginOptions, CoreEngine, type CoreEngineOptions, type CoreEvents, DebounceHelper, type DeserializeOptions, type EllipseNodeHandle, type EllipseNodeOptions, EventBus, type ExtractedBlob, FrameNode, type FrameNodeOptions, type FrameOptions, type GifNodeHandle, type GifNodeOptions, GridPlugin, type GridPluginOptions, type GroupNodeHandle, type GroupNodeOptions, type HistoryAction, HistoryManager, HistoryPlugin, type HistoryPluginOptions, ImageHoverFilterAddon, type ImageNodeHandle, type ImageNodeOptions, type ImageSource, type KonvaArc, type KonvaArrow, type KonvaCircle, type KonvaEllipse, type KonvaGroup, type KonvaGroupConfig, type KonvaImage, type KonvaLayer, type KonvaNode, type KonvaNodeConfig, type KonvaRegularPolygon, type KonvaRing, type KonvaShape, type KonvaStage, type KonvaStar, type KonvaText, type LogoOptions, LogoPlugin, MediaPlaceholder, type MediaPlaceholderOptions, NodeAddon, NodeAddons, type NodeAddonsHandle, type NodeHandle, type NodeHotkeysOptions, NodeHotkeysPlugin, NodeManager, PersistencePlugin, type PersistencePluginOptions, PersistenceStorage, PluginAddon, Plugins, type RegularPolygonNodeHandle, type RegularPolygonNodeOptions, type RingNodeHandle, type RingNodeOptions, RulerGuidesAddon, RulerGuidesPlugin, type RulerGuidesPluginOptions, RulerHighlightAddon, RulerHighlightPlugin, type RulerHighlightPluginOptions, RulerManagerAddon, RulerManagerPlugin, type RulerManagerPluginOptions, RulerPlugin, type RulerPluginOptions, SelectionPlugin, type SelectionPluginOptions, type SerializeOptions, type SerializedCamera, type SerializedCanvas, type SerializedNode, ShapeHoverHighlightAddon, type ShapeNodeHandle, type ShapeNodeOptions, type StarNodeHandle, type StarNodeOptions, type StoredBlob, type StoredCanvasState, type SvgNodeHandle, type SvgNodeOptions, TextAutoTrimAddon, type TextNodeHandle, type TextNodeOptions, ThrottleHelper, type VideoNodeHandle, type VideoNodeOptions, VideoOverlayAddon, type VideoOverlayAddonOptions, VisualGuidesPlugin, type VisualGuidesPluginOptions, createBlobUrlMap, deserializeCanvas, exportCanvasToJSON, extractBlobs, frameTemplates, importCanvasFromJSON, revokeBlobUrls, serializeCanvas };