@filekit-studio/sketch 0.0.0-stage → 1.1.0

package/dist/index.d.mts

@@ -0,0 +1,690 @@
+import * as React from 'react';
+import React__default from 'react';
+import { S as SketchBoardElement, G as GridStyle, C as Camera, P as Point, T as ToolType, L as LaserMode, a as LaserStroke } from './index-DNRZSQHn.mjs';
+export { A as AnchorPosition, b as ArrowType, c as Arrowhead, d as CanvasDimensions, E as EdgeStyle, e as ElementType, f as ExportPdfOptions, g as ExportPdfResult, F as FillStyle, h as FontFamily, i as LaserPoint, M as MarqueeBox, j as PointBinding, R as ResizeHandle, k as StrokeStyle, l as TableCell, m as TablePresetStyle, n as TextAlign, o as copyImageToClipboard, p as downloadFile, q as exportFrameToPng, r as exportToPng, s as exportToSvg, t as exportWhiteboardToPdf, u as getElementsBoundingBox } from './index-DNRZSQHn.mjs';
+
+/**
+ * Document schema, initialization, serialization, and validation.
+ * Represents a local-first, standalone Sketch whiteboard document.
+ */
+
+declare const SKETCH_DOCUMENT_VERSION = 1;
+interface SketchDocument {
+    version: number;
+    id?: string;
+    name: string;
+    elements: SketchBoardElement[];
+    canvasBackground: string;
+    gridStyle: GridStyle;
+    createdAt: number;
+    updatedAt: number;
+}
+/**
+ * Creates a brand new default SketchDocument.
+ */
+declare function createEmptyDocument(initial?: Partial<SketchDocument>): SketchDocument;
+/**
+ * Serializes a SketchDocument to a formatted JSON string.
+ */
+declare function serializeDocument(doc: SketchDocument): string;
+/**
+ * Safely parses and validates a JSON string into a SketchDocument.
+ * Throws a descriptive error if the document structure is invalid.
+ */
+declare function parseDocument(json: string): SketchDocument;
+/**
+ * Validates whether an unknown object adheres to the SketchDocument schema.
+ */
+declare function isValidSketchDocument(doc: unknown): doc is SketchDocument;
+
+/**
+ * Imperative programmatic controller for Sketch.
+ * Can be accessed via editorRef on <SketchEditor /> or instantiated headlessly.
+ */
+
+type SketchEventType = 'change' | 'select' | 'undo' | 'redo' | 'camera' | 'clear';
+type SketchEventHandler<T = unknown> = (payload: T) => void;
+interface SketchController {
+    loadDocument: (doc: SketchDocument) => void;
+    getDocument: () => SketchDocument;
+    clear: () => void;
+    addElement: (element: Partial<SketchBoardElement>) => SketchBoardElement;
+    updateElement: (id: string, patch: Partial<SketchBoardElement>) => void;
+    deleteElements: (ids: string[]) => void;
+    getElements: () => SketchBoardElement[];
+    getSelectedElements: () => SketchBoardElement[];
+    setSelection: (ids: string[]) => void;
+    clearSelection: () => void;
+    undo: () => void;
+    redo: () => void;
+    canUndo: () => boolean;
+    canRedo: () => boolean;
+    getCamera: () => Camera;
+    setZoom: (scale: number) => void;
+    panTo: (x: number, y: number) => void;
+    zoomToFit: () => void;
+    resetZoom: () => void;
+    on: <T = unknown>(event: SketchEventType, handler: SketchEventHandler<T>) => () => void;
+    destroy: () => void;
+}
+/**
+ * Creates an event bus for controller communication.
+ */
+declare class SketchEventEmitter {
+    private listeners;
+    on<T = unknown>(event: SketchEventType, handler: SketchEventHandler<T>): () => void;
+    emit<T = unknown>(event: SketchEventType, payload: T): void;
+    clear(): void;
+}
+
+type ThemeMode = 'light' | 'dark' | 'system';
+type PanelVariant = 'classic' | 'neumorphic';
+interface SketchThemeContextValue {
+    theme: ThemeMode;
+    resolvedTheme: 'light' | 'dark';
+    isDark: boolean;
+    panelVariant: PanelVariant;
+}
+declare function useSketchThemeContext(): SketchThemeContextValue;
+/**
+ * Robust theme hook for @filekit-studio/sketch.
+ * Supports explicit controlled prop ('dark' | 'light') or automatic inheritance
+ * from the host application's DOM classes via MutationObserver.
+ */
+declare function useSketchTheme(themeProp?: ThemeMode): {
+    theme: ThemeMode;
+    resolvedTheme: "light" | "dark";
+    isDark: boolean;
+    panelVariant: PanelVariant;
+};
+
+/** Default starter elements provided when no document is supplied */
+declare const DEFAULT_STARTER_ELEMENTS: SketchBoardElement[];
+interface SketchUIConfig {
+    /** Display the top toolbar header (default: true) */
+    showTopBar?: boolean;
+    /** Display top bar Exit button (default: true if onExit provided) */
+    showExitButton?: boolean;
+    /** Display top bar board name title editor (default: true) */
+    showBoardName?: boolean;
+    /** Display top bar save status badge (default: true) */
+    showSaveIndicator?: boolean;
+    /** Display top bar undo/redo history buttons (default: true) */
+    showHistoryControls?: boolean;
+    /** Display top bar zoom percentage & reset controls (default: true) */
+    showZoomControls?: boolean;
+    /** Display top bar frames & artboards outline drawer toggle (default: true) */
+    showFramesOutline?: boolean;
+    /** Display presentation slideshow trigger and mode (default: true) */
+    showPresentation?: boolean;
+    /** Display top bar laser pointer toggle (default: true) */
+    showLaserPointer?: boolean;
+    /** Display top bar 1-click clipboard PNG copy button (default: true) */
+    showCopyImage?: boolean;
+    /** Display top bar clear canvas button (default: true) */
+    showClearButton?: boolean;
+    /** Display top bar export modal dropdown (default: true) */
+    showExportMenu?: boolean;
+    /** Display the left creation tool palette (default: true) */
+    showToolBar?: boolean;
+    /** Show select & hand pan tools (default: true) */
+    showSelectTool?: boolean;
+    /** Show geometric shapes flyout (default: true) */
+    showShapeTools?: boolean;
+    /** Show freehand draw tool (default: true) */
+    showDrawTool?: boolean;
+    /** Show magnetic connector arrows and lines (default: true) */
+    showArrowTool?: boolean;
+    /** Show text typography tool (default: true) */
+    showTextTool?: boolean;
+    /** Show sticky notes tool (default: true) */
+    showStickyNoteTool?: boolean;
+    /** Show matrix and grid table generator (default: true) */
+    showTableTool?: boolean;
+    /** Show insert image upload tool (default: true) */
+    showImageUpload?: boolean;
+    /** Enable tech and cloud architecture stencils (default: true) */
+    showTechStencils?: boolean;
+    /** Enable diagram templates flyout (default: true) */
+    showTemplates?: boolean;
+    /** Show eraser tool (default: true) */
+    showEraserTool?: boolean;
+    /** Show lock active tool toggle (default: true) */
+    showLockTool?: boolean;
+    /** Display the right element styling and properties panel (default: true) */
+    showPropertiesPanel?: boolean;
+    /** Display the bottom-right workspace overview minimap (default: true) */
+    showMinimap?: boolean;
+    /** Display the bottom-left keyboard shortcuts button (default: true) */
+    showShortcutsButton?: boolean;
+    /** Display the bottom-left documentation guide button (default: true if guideHref/onOpenGuide provided) */
+    showGuideButton?: boolean;
+    /** Enable right-click context menu on canvas & elements (default: true) */
+    showContextMenu?: boolean;
+}
+interface SketchEditorProps {
+    /**
+     * Controlled document or elements array.
+     * If provided, updates whenever value changes.
+     */
+    value?: SketchDocument | SketchBoardElement[];
+    /**
+     * Initial uncontrolled document or elements array.
+     */
+    defaultValue?: SketchDocument | SketchBoardElement[];
+    /**
+     * Callback fired whenever the document elements or title change.
+     */
+    onChange?: (document: SketchDocument) => void;
+    /**
+     * Callback fired when manual save is triggered (Ctrl+S or Save button).
+     */
+    onSave?: (document: SketchDocument) => void;
+    /**
+     * Local storage key used for auto-saving.
+     * Pass null or empty string to disable localStorage persistence.
+     * Default: 'filekit_sketch_document_v1'
+     */
+    storageKey?: string | null;
+    /**
+     * Initial whiteboard board title. Default: 'My Whiteboard'.
+     */
+    boardName?: string;
+    /**
+     * Callback fired when user renames the whiteboard.
+     */
+    onBoardNameChange?: (name: string) => void;
+    /**
+     * Read-only mode prevents canvas mutations and hides drawing tools.
+     */
+    readOnly?: boolean;
+    /**
+     * Panel aesthetic styling variant.
+     * - 'classic': Clean modern borders and subtle drop shadows (default).
+     * - 'neumorphic': Rich soft 3D neumorphic bevels and dual drop shadows.
+     */
+    panelVariant?: PanelVariant;
+    /**
+     * Theme mode: 'light', 'dark', or 'system'. Default: 'system'.
+     * When 'system' or omitted, automatically inherits dark/light mode from the host application.
+     */
+    theme?: ThemeMode;
+    /**
+     * Canvas background color hex. Default: '#f0f4f8'.
+     */
+    canvasBackground?: string;
+    /**
+     * Canvas grid pattern style: 'grid' | 'dots' | 'cross' | 'none'. Default: 'grid'.
+     */
+    gridStyle?: GridStyle;
+    /**
+     * Optional callback when user clicks the Exit button.
+     */
+    onExit?: () => void;
+    /**
+     * Link target for the Guide button in shortcuts modal.
+     */
+    guideHref?: string;
+    /**
+     * Callback when clicking the Guide button in shortcuts modal.
+     */
+    onOpenGuide?: () => void;
+    /**
+     * UI components visibility configuration.
+     */
+    uiConfig?: SketchUIConfig;
+    /**
+     * Ref or callback to receive the imperative SketchController instance.
+     */
+    controllerRef?: React__default.Ref<SketchController>;
+    /**
+     * Custom CSS class name for the outer container.
+     */
+    className?: string;
+    /**
+     * Custom inline styles for the outer container.
+     */
+    style?: React__default.CSSProperties;
+}
+/**
+ * <SketchEditor />
+ *
+ * Standalone, local-first interactive whiteboard and diagramming component for React & Next.js.
+ * Built with HTML5 Canvas, responsive controls, neumorphic styling, and zero external backend requirements.
+ */
+declare const SketchEditor: React__default.ForwardRefExoticComponent<SketchEditorProps & React__default.RefAttributes<SketchController>>;
+
+interface SketchViewerProps {
+    /**
+     * The document or elements array to render.
+     */
+    value?: SketchDocument | SketchBoardElement[];
+    /**
+     * Initial document or elements array.
+     */
+    defaultValue?: SketchDocument | SketchBoardElement[];
+    /**
+     * Color theme: 'light', 'dark', or 'system'. Default: 'system'.
+     */
+    theme?: ThemeMode;
+    /**
+     * Canvas background color hex. Defaults to theme standard.
+     */
+    canvasBackground?: string;
+    /**
+     * Grid pattern style: 'grid' | 'dots' | 'cross' | 'none'. Default: 'dots'.
+     */
+    gridStyle?: GridStyle;
+    /**
+     * Allow mouse/touch pan and zoom interaction. Default: true.
+     * When false, the diagram behaves as a completely static vector illustration.
+     */
+    interactive?: boolean;
+    /**
+     * Automatically centers and fits all elements into view on mount. Default: true.
+     */
+    autoFit?: boolean;
+    /**
+     * Show a subtle 1-click 'Copy Image' button in the top-right corner. Default: true.
+     */
+    showCopyButton?: boolean;
+    /**
+     * Show minimal zoom pill (- 100% + Fit) in the bottom corner. Default: false.
+     */
+    showZoomControls?: boolean;
+    /**
+     * Optional custom title badge shown in the top-left corner.
+     */
+    title?: string;
+    /**
+     * Granular UI visibility overrides.
+     */
+    uiConfig?: SketchUIConfig;
+    /**
+     * Imperative controller ref for programmatic interaction.
+     */
+    controllerRef?: React__default.Ref<SketchController>;
+    /**
+     * Custom CSS class name for the root container.
+     */
+    className?: string;
+    /**
+     * Custom inline styles for the root container.
+     */
+    style?: React__default.CSSProperties;
+}
+/**
+ * <SketchViewer />
+ *
+ * Lightweight, zero-chrome presentation viewer for documentation, MDX, and blog posts.
+ * Pre-configured with all editing controls hidden, read-only mode, and auto-fit viewport.
+ */
+declare const SketchViewer: React__default.ForwardRefExoticComponent<SketchViewerProps & React__default.RefAttributes<SketchController>>;
+
+interface SketchBoardCanvasProps {
+    elements: SketchBoardElement[];
+    setElements: React__default.Dispatch<React__default.SetStateAction<SketchBoardElement[]>>;
+    selectedIds: string[];
+    selectElement: (id: string, multi?: boolean) => void;
+    selectElements: (ids: string[]) => void;
+    clearSelection: () => void;
+    addElement: (el: SketchBoardElement) => void;
+    updateElement: (id: string, updates: Partial<SketchBoardElement>) => void;
+    deleteSelectedElements: () => void;
+    duplicateSelectedElements: () => void;
+    groupSelectedElements?: () => void;
+    ungroupSelectedElements?: () => void;
+    pushHistory: (elements: SketchBoardElement[]) => void;
+    undo: () => void;
+    redo: () => void;
+    camera: Camera;
+    setCamera: React__default.Dispatch<React__default.SetStateAction<Camera>>;
+    screenToWorld: (pt: Point) => Point;
+    worldToScreen: (pt: Point) => Point;
+    panBy: (dx: number, dy: number) => void;
+    zoomAtPoint: (factor: number, pivot: Point) => void;
+    tool: ToolType;
+    setTool: (tool: ToolType) => void;
+    gridStyle: GridStyle;
+    defaultStyles: Omit<SketchBoardElement, 'id' | 'x' | 'y' | 'width' | 'height'>;
+    editingElementId?: string | null;
+    setEditingElementId?: (id: string | null) => void;
+    isToolLocked?: boolean;
+    setIsToolLocked?: (locked: boolean | ((prev: boolean) => boolean)) => void;
+    canvasBackground?: string;
+    isPresentationOpen?: boolean;
+    laserColor?: string;
+    laserMode?: LaserMode;
+    laserStrokes?: LaserStroke[];
+    setLaserStrokes?: React__default.Dispatch<React__default.SetStateAction<LaserStroke[]>>;
+    laserPointerPos?: Point | null;
+    setLaserPointerPos?: (pt: Point | null) => void;
+}
+declare function SketchBoardCanvas({ elements, setElements, selectedIds, selectElement, selectElements, clearSelection, addElement, updateElement, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, pushHistory, undo, redo, camera, screenToWorld, worldToScreen, panBy, zoomAtPoint, tool, setTool, isToolLocked, setIsToolLocked, gridStyle, defaultStyles, editingElementId: externalEditingId, setEditingElementId: setExternalEditingId, canvasBackground, isPresentationOpen, laserColor, laserMode, laserStrokes, setLaserStrokes, laserPointerPos, setLaserPointerPos, }: SketchBoardCanvasProps): React__default.JSX.Element;
+
+interface SketchBoardToolBarProps {
+    tool: ToolType;
+    setTool: (tool: ToolType) => void;
+    isToolLocked?: boolean;
+    setIsToolLocked?: (locked: boolean | ((prev: boolean) => boolean)) => void;
+    onInsertImage?: (dataUrl: string) => void;
+    onOpenTemplates?: () => void;
+    isTemplatesOpen?: boolean;
+    onOpenTechStencils?: () => void;
+    isTechStencilsOpen?: boolean;
+    onInsertTablePreset?: (preset: 'blank' | 'matrix' | 'swot' | 'kanban', rows?: number, cols?: number) => void;
+}
+declare function SketchBoardToolBar({ tool, setTool, isToolLocked, setIsToolLocked, onInsertImage, onOpenTemplates, isTemplatesOpen, onOpenTechStencils, isTechStencilsOpen, onInsertTablePreset, }: SketchBoardToolBarProps): React__default.JSX.Element;
+
+interface SketchBoardPropertiesPanelProps {
+    selectedElements: SketchBoardElement[];
+    updateSelectedElements: (updates: Partial<SketchBoardElement>) => void;
+    deleteSelectedElements: () => void;
+    duplicateSelectedElements: () => void;
+    groupSelectedElements?: () => void;
+    ungroupSelectedElements?: () => void;
+    alignSelectedElements?: (type: 'left' | 'center' | 'right' | 'top' | 'middle' | 'bottom') => void;
+    distributeSelectedElements?: (type: 'horizontal' | 'vertical') => void;
+    bringToFront: () => void;
+    sendToBack: () => void;
+    bringForward?: () => void;
+    sendBackward?: () => void;
+    defaultStyles: Omit<SketchBoardElement, 'id' | 'x' | 'y' | 'width' | 'height'>;
+    setDefaultStyles: React__default.Dispatch<React__default.SetStateAction<Omit<SketchBoardElement, 'id' | 'x' | 'y' | 'width' | 'height'>>>;
+    canvasBackground?: string;
+    setCanvasBackground?: (color: string) => void;
+}
+declare function SketchBoardPropertiesPanel({ selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, bringToFront, sendToBack, bringForward, sendBackward, defaultStyles, setDefaultStyles, canvasBackground, setCanvasBackground, }: SketchBoardPropertiesPanelProps): React__default.JSX.Element;
+
+interface SketchBoardTopBarProps {
+    boardName: string;
+    setBoardName: (name: string) => void;
+    onOpenExport: () => void;
+    onOpenTemplates?: () => void;
+    onCopyImage?: () => void;
+    onClearBoard: () => void;
+    elementCount: number;
+    zoom: number;
+    zoomIn: () => void;
+    zoomOut: () => void;
+    resetCamera: () => void;
+    canUndo: boolean;
+    canRedo: boolean;
+    undo: () => void;
+    redo: () => void;
+    tool: ToolType;
+    setTool: (tool: ToolType) => void;
+    gridStyle: GridStyle;
+    setGridStyle: (style: GridStyle) => void;
+    onExit?: () => void;
+    saveStatus?: 'saved' | 'saving' | 'unsaved';
+    onManualSave?: () => void;
+    onStartPresentation?: () => void;
+    hasFrames?: boolean;
+    frameCount?: number;
+    isFramesOutlineOpen?: boolean;
+    onToggleFramesOutline?: () => void;
+    onOpenTechStencils?: () => void;
+    isTechStencilsOpen?: boolean;
+    isSpotlightActive?: boolean;
+    onToggleSpotlight?: () => void;
+}
+declare function SketchBoardTopBar({ boardName, setBoardName, onOpenExport, onOpenTemplates, onCopyImage, onClearBoard, elementCount, zoom, zoomIn, zoomOut, resetCamera, canUndo, canRedo, undo, redo, tool, setTool, gridStyle, setGridStyle, onExit, saveStatus, onManualSave, onStartPresentation, hasFrames, frameCount, isFramesOutlineOpen, onToggleFramesOutline, onOpenTechStencils, isTechStencilsOpen, isSpotlightActive, onToggleSpotlight, }: SketchBoardTopBarProps): React__default.JSX.Element;
+
+interface SketchBoardMinimapProps {
+    elements: SketchBoardElement[];
+    camera: Camera;
+    setCamera: React__default.Dispatch<React__default.SetStateAction<Camera>>;
+}
+declare function SketchBoardMinimap({ elements, camera, setCamera }: SketchBoardMinimapProps): React__default.JSX.Element;
+
+interface SketchBoardFloatingDockProps {
+    selectedElements: SketchBoardElement[];
+    updateSelectedElements: (updates: Partial<SketchBoardElement>) => void;
+    deleteSelectedElements: () => void;
+    duplicateSelectedElements: () => void;
+    groupSelectedElements?: () => void;
+    ungroupSelectedElements?: () => void;
+    alignSelectedElements?: (type: 'left' | 'center' | 'right' | 'top' | 'middle' | 'bottom') => void;
+    distributeSelectedElements?: (type: 'horizontal' | 'vertical') => void;
+    copySelectedImage?: () => void;
+    bringToFront: () => void;
+    sendToBack: () => void;
+    camera: Camera;
+    worldToScreen: (pt: Point) => Point;
+    onEditText?: (element: SketchBoardElement) => void;
+    onToggleSpotlight?: () => void;
+}
+declare function SketchBoardFloatingDock({ selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, copySelectedImage, bringToFront, sendToBack, camera, worldToScreen, onEditText, onToggleSpotlight, }: SketchBoardFloatingDockProps): React__default.JSX.Element | null;
+
+interface SketchBoardContextMenuProps {
+    elements: SketchBoardElement[];
+    selectedIds?: string[];
+    boardName: string;
+    onManualSave: () => void;
+    onClearBoard: () => void;
+    gridStyle: GridStyle;
+    setGridStyle: (style: GridStyle) => void;
+    resetCamera: () => void;
+    canvasBackground?: string;
+}
+declare function SketchBoardContextMenu({ elements, selectedIds, boardName, onManualSave, onClearBoard, gridStyle, setGridStyle, resetCamera, canvasBackground, }: SketchBoardContextMenuProps): React__default.JSX.Element | null;
+
+interface SketchBoardExportModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    elements: SketchBoardElement[];
+    selectedIds?: string[];
+    onImportElements: (elements: SketchBoardElement[]) => void;
+    boardName: string;
+    canvasBackground?: string;
+    gridStyle?: GridStyle;
+}
+declare function SketchBoardExportModal({ isOpen, onClose, elements, selectedIds, onImportElements, boardName, canvasBackground, gridStyle, }: SketchBoardExportModalProps): React__default.JSX.Element | null;
+
+interface SketchBoardPresentationModeProps {
+    isOpen: boolean;
+    onClose: () => void;
+    elements: SketchBoardElement[];
+    selectedIds?: string[];
+    camera: Camera;
+    setCamera: React__default.Dispatch<React__default.SetStateAction<Camera>>;
+    isSpotlightActive?: boolean;
+    onToggleSpotlight?: () => void;
+}
+declare function SketchBoardPresentationMode({ isOpen, onClose, elements, selectedIds, camera, setCamera, isSpotlightActive, onToggleSpotlight, }: SketchBoardPresentationModeProps): React__default.JSX.Element | null;
+
+interface SketchBoardFramesOutlineProps {
+    isOpen: boolean;
+    onClose: () => void;
+    elements: SketchBoardElement[];
+    setElements: React__default.Dispatch<React__default.SetStateAction<SketchBoardElement[]>>;
+    selectedIds: string[];
+    selectElements: (ids: string[]) => void;
+    updateElement: (id: string, updates: Partial<SketchBoardElement>) => void;
+    pushHistory: (newElements: SketchBoardElement[]) => void;
+    camera: Camera;
+    setCamera: React__default.Dispatch<React__default.SetStateAction<Camera>>;
+    onStartPresentation?: () => void;
+}
+declare function SketchBoardFramesOutline({ isOpen, onClose, elements, setElements, selectedIds, selectElements, updateElement, pushHistory, camera, setCamera, onStartPresentation, }: SketchBoardFramesOutlineProps): React__default.JSX.Element | null;
+
+interface SketchBoardShortcutsModalProps {
+    guideHref?: string;
+    onOpenGuide?: () => void;
+    showShortcutsButton?: boolean;
+    showGuideButton?: boolean;
+}
+declare function SketchBoardShortcutsModal({ guideHref, onOpenGuide, showShortcutsButton, showGuideButton, }?: SketchBoardShortcutsModalProps): React__default.JSX.Element;
+
+interface SketchBoardTechStencilsModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onInsertTechStencil: (dataUrl: string, title: string, mode: 'badge' | 'standalone') => void;
+}
+declare function SketchBoardTechStencilsModal({ isOpen, onClose, onInsertTechStencil, }: SketchBoardTechStencilsModalProps): React__default.JSX.Element | null;
+
+interface TemplateDefinition {
+    id: 'mindmap' | 'flowchart' | 'erd' | 'kanban' | 'user_journey';
+    title: string;
+    category: 'Brainstorming' | 'Diagrams' | 'Engineering' | 'Agile & Planning';
+    description: string;
+    tag: string;
+    tagColor: string;
+    elementsCount: number;
+    previewType: 'mindmap' | 'flowchart' | 'erd' | 'kanban' | 'journey';
+}
+declare const DIAGRAM_TEMPLATES: TemplateDefinition[];
+
+interface SketchBoardTemplatesFlyoutProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSelectTemplate: (templateId: TemplateDefinition['id'], mode: 'append' | 'replace') => void;
+    hasExistingElements?: boolean;
+}
+declare function SketchBoardTemplatesFlyout({ isOpen, onClose, onSelectTemplate, hasExistingElements, }: SketchBoardTemplatesFlyoutProps): React__default.JSX.Element | null;
+
+interface SketchBoardLaserDockProps {
+    laserColor: string;
+    setLaserColor: (color: string) => void;
+    laserMode: LaserMode;
+    setLaserMode: (mode: LaserMode) => void;
+    onClearLaser: () => void;
+    laserStrokeCount: number;
+    onExitLaser: () => void;
+}
+declare function SketchBoardLaserDock({ laserColor, setLaserColor, laserMode, setLaserMode, onClearLaser, laserStrokeCount, onExitLaser, }: SketchBoardLaserDockProps): React__default.JSX.Element;
+
+interface SketchBoardSpotlightOverlayProps {
+    isActive: boolean;
+    onClose: () => void;
+    selectedElements: SketchBoardElement[];
+    allElements: SketchBoardElement[];
+    camera: Camera;
+    worldToScreen: (pt: Point) => Point;
+    screenToWorld: (pt: Point) => Point;
+    onSelectElement?: (id: string) => void;
+    isDark: boolean;
+}
+declare function SketchBoardSpotlightOverlay({ isActive, onClose, selectedElements, allElements, camera, worldToScreen, screenToWorld, onSelectElement, isDark, }: SketchBoardSpotlightOverlayProps): React__default.JSX.Element | null;
+
+declare function useSketchBoardCamera(initialCamera?: Camera): {
+    camera: Camera;
+    setCamera: React.Dispatch<React.SetStateAction<Camera>>;
+    screenToWorld: (screenPt: Point) => Point;
+    worldToScreen: (worldPt: Point) => Point;
+    panBy: (deltaX: number, deltaY: number) => void;
+    zoomAtPoint: (newZoomFactor: number, screenPivot: Point) => void;
+    zoomIn: (screenPivot?: Point) => void;
+    zoomOut: (screenPivot?: Point) => void;
+    resetCamera: () => void;
+};
+
+type AlignmentType = 'left' | 'center' | 'right' | 'top' | 'middle' | 'bottom';
+type DistributionType = 'horizontal' | 'vertical';
+/**
+ * Aligns selected elements along a target edge or center axis
+ */
+declare function alignElements(elements: SketchBoardElement[], selectedIds: string[], type: AlignmentType): SketchBoardElement[];
+/**
+ * Distributes elements evenly along horizontal or vertical space
+ */
+declare function distributeElements(elements: SketchBoardElement[], selectedIds: string[], type: DistributionType): SketchBoardElement[];
+
+declare function useSketchBoardElements(initialElements?: SketchBoardElement[]): {
+    elements: SketchBoardElement[];
+    setElements: React.Dispatch<React.SetStateAction<SketchBoardElement[]>>;
+    setAllElements: (newElements: SketchBoardElement[]) => void;
+    selectedIds: string[];
+    setSelectedIds: React.Dispatch<React.SetStateAction<string[]>>;
+    selectedElements: SketchBoardElement[];
+    singleSelectedElement: SketchBoardElement | null;
+    addElement: (element: SketchBoardElement) => void;
+    updateElement: (id: string, updates: Partial<SketchBoardElement>) => void;
+    updateSelectedElements: (updates: Partial<SketchBoardElement>) => void;
+    deleteSelectedElements: () => void;
+    duplicateSelectedElements: () => void;
+    groupSelectedElements: () => void;
+    ungroupSelectedElements: () => void;
+    alignSelectedElements: (type: AlignmentType) => void;
+    distributeSelectedElements: (type: DistributionType) => void;
+    bringToFront: () => void;
+    sendToBack: () => void;
+    bringForward: () => void;
+    sendBackward: () => void;
+    selectElement: (id: string, multi?: boolean) => void;
+    selectElements: (ids: string[]) => void;
+    clearSelection: () => void;
+};
+
+declare function useSketchBoardHistory(initialElements?: SketchBoardElement[]): {
+    pushState: (newElements: SketchBoardElement[]) => void;
+    undo: () => SketchBoardElement[] | null;
+    redo: () => SketchBoardElement[] | null;
+    resetHistory: (initial?: SketchBoardElement[]) => void;
+    canUndo: boolean;
+    canRedo: boolean;
+};
+
+declare function useHydrated(): boolean;
+
+declare const DEFAULT_ELEMENT_STYLES: Omit<SketchBoardElement, 'id' | 'x' | 'y' | 'width' | 'height'>;
+
+interface TechIcon {
+    id: string;
+    name: string;
+    category: 'frontend' | 'backend' | 'database' | 'cloud' | 'tools';
+    color: string;
+    keywords: string[];
+    svg: string;
+}
+declare const TECH_CATEGORIES: readonly [{
+    readonly id: "all";
+    readonly label: "All Stencils";
+}, {
+    readonly id: "frontend";
+    readonly label: "Frontend & UI";
+}, {
+    readonly id: "backend";
+    readonly label: "Backend & Runtimes";
+}, {
+    readonly id: "database";
+    readonly label: "Databases & Storage";
+}, {
+    readonly id: "cloud";
+    readonly label: "Cloud & DevOps";
+}, {
+    readonly id: "tools";
+    readonly label: "AI, Tools & APIs";
+}];
+declare const TECH_ICONS: TechIcon[];
+
+/**
+ * Updates all arrow positions in real time based on their bound start & end elements
+ */
+declare function updateBoundArrows(elements: SketchBoardElement[]): SketchBoardElement[];
+/**
+ * Deep clones elements while properly remapping internal arrow start/end bindings
+ * and group IDs so cloned groups and arrows remain independent and attached to cloned shapes.
+ */
+declare function cloneSketchBoardElements(elementsToClone: SketchBoardElement[], options?: {
+    deltaX?: number;
+    deltaY?: number;
+    highestZ?: number;
+}): {
+    clonedElements: SketchBoardElement[];
+    newSelectedIds: string[];
+};
+
+/**
+ * Client-side file saving utility.
+ * Triggers a native browser download without server interaction.
+ */
+interface FileSaverOptions {
+    mimeType?: string;
+    filters?: unknown;
+    [key: string]: unknown;
+}
+declare function saveOrDownloadFile(data: Blob | Uint8Array | string, filename: string, mimeTypeOrOptions?: string | FileSaverOptions): Promise<void>;
+
+export { Camera, DEFAULT_ELEMENT_STYLES, DEFAULT_STARTER_ELEMENTS, DIAGRAM_TEMPLATES, GridStyle, LaserMode, LaserStroke, type PanelVariant, Point, SKETCH_DOCUMENT_VERSION, SketchBoardCanvas, SketchBoardContextMenu, SketchBoardElement, SketchBoardExportModal, SketchBoardFloatingDock, SketchBoardFramesOutline, SketchBoardLaserDock, SketchBoardMinimap, SketchBoardPresentationMode, SketchBoardPropertiesPanel, SketchBoardShortcutsModal, SketchBoardSpotlightOverlay, SketchBoardTechStencilsModal, SketchBoardTemplatesFlyout, SketchBoardToolBar, SketchBoardTopBar, type SketchController, type SketchDocument, SketchEditor, type SketchEditorProps, SketchEventEmitter, type SketchEventHandler, type SketchEventType, type SketchThemeContextValue, type SketchUIConfig, SketchViewer, type SketchViewerProps, TECH_CATEGORIES, TECH_ICONS, type TechIcon, type TemplateDefinition, type ThemeMode, ToolType, alignElements, cloneSketchBoardElements, createEmptyDocument, distributeElements, isValidSketchDocument, parseDocument, saveOrDownloadFile, serializeDocument, updateBoundArrows, useHydrated, useSketchBoardCamera, useSketchBoardElements, useSketchBoardHistory, useSketchTheme, useSketchThemeContext };