@filekit-studio/sketch 1.1.0 → 1.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/export.d.mts +1 -1
- package/dist/export.d.ts +1 -1
- package/dist/export.js +26 -26
- package/dist/export.mjs +26 -26
- package/dist/{index-DNRZSQHn.d.mts → index-BBEbI15I.d.mts} +1 -0
- package/dist/{index-DNRZSQHn.d.ts → index-BBEbI15I.d.ts} +1 -0
- package/dist/index.d.mts +111 -39
- package/dist/index.d.ts +111 -39
- package/dist/index.js +92 -92
- package/dist/index.mjs +92 -92
- package/dist/styles.css +12 -18
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
-
import { S as SketchBoardElement, G as GridStyle, C as Camera, P as Point, T as ToolType, L as LaserMode, a as LaserStroke } from './index-
|
|
4
|
-
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-
|
|
3
|
+
import { S as SketchBoardElement, G as GridStyle, C as Camera, P as Point, T as ToolType, L as LaserMode, a as LaserStroke } from './index-BBEbI15I.mjs';
|
|
4
|
+
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-BBEbI15I.mjs';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* Document schema, initialization, serialization, and validation.
|
|
@@ -62,7 +62,7 @@ interface SketchController {
|
|
|
62
62
|
getCamera: () => Camera;
|
|
63
63
|
setZoom: (scale: number) => void;
|
|
64
64
|
panTo: (x: number, y: number) => void;
|
|
65
|
-
zoomToFit: () => void;
|
|
65
|
+
zoomToFit: (padding?: number) => void;
|
|
66
66
|
resetZoom: () => void;
|
|
67
67
|
on: <T = unknown>(event: SketchEventType, handler: SketchEventHandler<T>) => () => void;
|
|
68
68
|
destroy: () => void;
|
|
@@ -100,67 +100,133 @@ declare function useSketchTheme(themeProp?: ThemeMode): {
|
|
|
100
100
|
|
|
101
101
|
/** Default starter elements provided when no document is supplied */
|
|
102
102
|
declare const DEFAULT_STARTER_ELEMENTS: SketchBoardElement[];
|
|
103
|
+
/**
|
|
104
|
+
* Comprehensive UI visibility configuration for @filekit-studio/sketch.
|
|
105
|
+
* Controls every macro panel and granular micro-tool across the application.
|
|
106
|
+
*/
|
|
103
107
|
interface SketchUIConfig {
|
|
104
|
-
/** Display the top toolbar header
|
|
108
|
+
/** Display the top toolbar header container. Default: true */
|
|
105
109
|
showTopBar?: boolean;
|
|
106
|
-
/** Display
|
|
107
|
-
showExitButton?: boolean;
|
|
108
|
-
/** Display top bar board name title editor (default: true) */
|
|
110
|
+
/** Display the whiteboard title editor badge in the top bar. Default: true */
|
|
109
111
|
showBoardName?: boolean;
|
|
110
|
-
/** Display top bar
|
|
112
|
+
/** Display the Exit / Back arrow button in the top bar. Default: true (if onExit provided) */
|
|
113
|
+
showExitButton?: boolean;
|
|
114
|
+
/** Display the auto-save indicator badge ("Saved" / "Saving") in the top bar. Default: true */
|
|
111
115
|
showSaveIndicator?: boolean;
|
|
112
|
-
/** Display
|
|
116
|
+
/** Display undo/redo history buttons (Ctrl+Z / Ctrl+Y) in the top bar. Default: true */
|
|
113
117
|
showHistoryControls?: boolean;
|
|
114
|
-
/** Display
|
|
118
|
+
/** Display the Undo history button. Default: true (when showHistoryControls is true) */
|
|
119
|
+
showUndoButton?: boolean;
|
|
120
|
+
/** Display the Redo history button. Default: true (when showHistoryControls is true) */
|
|
121
|
+
showRedoButton?: boolean;
|
|
122
|
+
/** Display zoom percentage and zoom in/out/reset controls in the top bar. Default: true */
|
|
115
123
|
showZoomControls?: boolean;
|
|
116
|
-
/** Display
|
|
124
|
+
/** Display Zoom Out button. Default: true (when showZoomControls is true) */
|
|
125
|
+
showZoomOutButton?: boolean;
|
|
126
|
+
/** Display Zoom In button. Default: true (when showZoomControls is true) */
|
|
127
|
+
showZoomInButton?: boolean;
|
|
128
|
+
/** Display Zoom Reset (100%) pill button. Default: true (when showZoomControls is true) */
|
|
129
|
+
showZoomResetButton?: boolean;
|
|
130
|
+
/** Display canvas grid pattern selector (Grid, Dots, Cross, None) in the top bar. Default: true */
|
|
131
|
+
showGridSelector?: boolean;
|
|
132
|
+
/** Display presentation frames outline drawer toggle in the top bar. Default: true */
|
|
117
133
|
showFramesOutline?: boolean;
|
|
118
|
-
/** Display presentation slideshow trigger
|
|
134
|
+
/** Display fullscreen presentation slideshow trigger in the top bar. Default: true */
|
|
119
135
|
showPresentation?: boolean;
|
|
120
|
-
/** Display
|
|
136
|
+
/** Display laser pointer tool button in the top bar. Default: true */
|
|
121
137
|
showLaserPointer?: boolean;
|
|
122
|
-
/** Display
|
|
138
|
+
/** Display spotlight focus overlay button (Alt+S) in the top bar. Default: true */
|
|
139
|
+
showSpotlight?: boolean;
|
|
140
|
+
/** Display 1-click clipboard PNG image copy button in the top bar. Default: true */
|
|
123
141
|
showCopyImage?: boolean;
|
|
124
|
-
/** Display
|
|
142
|
+
/** Display clear canvas trash button in the top bar. Default: true */
|
|
125
143
|
showClearButton?: boolean;
|
|
126
|
-
/** Display
|
|
144
|
+
/** Display export menu dropdown modal (PNG, SVG, PDF, JSON) in the top bar. Default: true */
|
|
127
145
|
showExportMenu?: boolean;
|
|
128
|
-
/** Display
|
|
146
|
+
/** Display PDF (A4) document export tab in the export modal. Default: true */
|
|
147
|
+
showExportPdf?: boolean;
|
|
148
|
+
/** Display PNG raster image export button in the export modal. Default: true */
|
|
149
|
+
showExportPng?: boolean;
|
|
150
|
+
/** Display SVG scalable vector export button in the export modal. Default: true */
|
|
151
|
+
showExportSvg?: boolean;
|
|
152
|
+
/** Display JSON project file export button in the export modal. Default: true */
|
|
153
|
+
showExportJson?: boolean;
|
|
154
|
+
/** Display JSON project file import button in the export modal. Default: true */
|
|
155
|
+
showImportJson?: boolean;
|
|
156
|
+
/** Display the left creation tool palette container. Default: true */
|
|
129
157
|
showToolBar?: boolean;
|
|
130
|
-
/**
|
|
158
|
+
/** Display the pointer selection tool (V). Default: true */
|
|
131
159
|
showSelectTool?: boolean;
|
|
132
|
-
/**
|
|
160
|
+
/** Display the hand pan canvas tool (H). Default: true */
|
|
161
|
+
showHandTool?: boolean;
|
|
162
|
+
/** Display geometric shapes flyout (Rectangle, Ellipse, Diamond, Triangle, Star, etc.). Default: true */
|
|
133
163
|
showShapeTools?: boolean;
|
|
134
|
-
/**
|
|
164
|
+
/** Display freehand drawing pen tool (P). Default: true */
|
|
135
165
|
showDrawTool?: boolean;
|
|
136
|
-
/**
|
|
166
|
+
/** Display magnetic connector arrows tool (A). Default: true */
|
|
137
167
|
showArrowTool?: boolean;
|
|
138
|
-
/**
|
|
168
|
+
/** Display straight lines connector tool (L). Default: true */
|
|
169
|
+
showLineTool?: boolean;
|
|
170
|
+
/** Display typography text block tool (T). Default: true */
|
|
139
171
|
showTextTool?: boolean;
|
|
140
|
-
/**
|
|
172
|
+
/** Display sticky notes idea cards tool (S). Default: true */
|
|
141
173
|
showStickyNoteTool?: boolean;
|
|
142
|
-
/**
|
|
174
|
+
/** Display matrix, SWOT, Kanban, and grid table generator tool. Default: true */
|
|
143
175
|
showTableTool?: boolean;
|
|
144
|
-
/**
|
|
176
|
+
/** Display insert image file upload tool (PNG, JPG, SVG, WebP). Default: true */
|
|
145
177
|
showImageUpload?: boolean;
|
|
146
|
-
/**
|
|
178
|
+
/** Display tech and cloud architecture stencils flyout (AWS, GCP, Azure, K8s). Default: true */
|
|
147
179
|
showTechStencils?: boolean;
|
|
148
|
-
/**
|
|
180
|
+
/** Display architecture starter diagram templates flyout. Default: true */
|
|
149
181
|
showTemplates?: boolean;
|
|
150
|
-
/**
|
|
182
|
+
/** Display element eraser tool (E). Default: true */
|
|
151
183
|
showEraserTool?: boolean;
|
|
152
|
-
/**
|
|
184
|
+
/** Display laser pointer tool in the left toolbar (K). Default: true */
|
|
185
|
+
showLaserTool?: boolean;
|
|
186
|
+
/** Display lock active tool toggle button. Default: true */
|
|
153
187
|
showLockTool?: boolean;
|
|
154
|
-
/** Display the right element styling and properties panel
|
|
188
|
+
/** Display the right element styling and properties panel container. Default: true */
|
|
155
189
|
showPropertiesPanel?: boolean;
|
|
156
|
-
/** Display
|
|
190
|
+
/** Display stroke color picker and palette in properties panel. Default: true */
|
|
191
|
+
showStrokeColor?: boolean;
|
|
192
|
+
/** Display fill color picker and palette in properties panel. Default: true */
|
|
193
|
+
showFillColor?: boolean;
|
|
194
|
+
/** Display fill pattern texture selector (Solid, Hachure, Cross-hatch, Transparent). Default: true */
|
|
195
|
+
showFillStyle?: boolean;
|
|
196
|
+
/** Display stroke thickness width selector (Thin, Medium, Thick). Default: true */
|
|
197
|
+
showStrokeWidth?: boolean;
|
|
198
|
+
/** Display stroke line pattern selector (Solid, Dashed, Dotted). Default: true */
|
|
199
|
+
showStrokeStyle?: boolean;
|
|
200
|
+
/** Display hand-drawn roughness selector (Clean, Rough, Subtle, Sloppy). Default: true */
|
|
201
|
+
showRoughness?: boolean;
|
|
202
|
+
/** Display corner edge style selector (Sharp vs Rounded). Default: true */
|
|
203
|
+
showEdgeStyle?: boolean;
|
|
204
|
+
/** Display connector start/end arrowhead selector. Default: true */
|
|
205
|
+
showArrowheads?: boolean;
|
|
206
|
+
/** Display typography font family, font size, and text alignment options. Default: true */
|
|
207
|
+
showTypography?: boolean;
|
|
208
|
+
/** Display element opacity slider. Default: true */
|
|
209
|
+
showOpacity?: boolean;
|
|
210
|
+
/** Display canvas background color preset swatches in properties panel. Default: true */
|
|
211
|
+
showCanvasBackgroundPicker?: boolean;
|
|
212
|
+
/** Display multi-element alignment & distribution buttons (Align left/center/right). Default: true */
|
|
213
|
+
showAlignment?: boolean;
|
|
214
|
+
/** Display z-index layer ordering buttons (Bring to front, Send to back). Default: true */
|
|
215
|
+
showLayerOrdering?: boolean;
|
|
216
|
+
/** Display group and ungroup buttons in properties panel. Default: true */
|
|
217
|
+
showGrouping?: boolean;
|
|
218
|
+
/** Display duplicate and delete quick action buttons in properties panel header. Default: true */
|
|
219
|
+
showDuplicateDelete?: boolean;
|
|
220
|
+
/** Display the bottom-right workspace overview minimap. Default: true */
|
|
157
221
|
showMinimap?: boolean;
|
|
158
|
-
/** Display the bottom-left keyboard shortcuts
|
|
222
|
+
/** Display the bottom-left keyboard shortcuts modal trigger pill. Default: true */
|
|
159
223
|
showShortcutsButton?: boolean;
|
|
160
|
-
/** Display the bottom-left documentation guide button
|
|
224
|
+
/** Display the bottom-left documentation guide button pill. Default: true (if guideHref or onOpenGuide provided) */
|
|
161
225
|
showGuideButton?: boolean;
|
|
162
|
-
/** Enable right-click
|
|
226
|
+
/** Enable right-click contextual menu on canvas and elements. Default: true */
|
|
163
227
|
showContextMenu?: boolean;
|
|
228
|
+
/** Display contextual floating dock toolbar above selected elements. Default: true */
|
|
229
|
+
showFloatingDock?: boolean;
|
|
164
230
|
}
|
|
165
231
|
interface SketchEditorProps {
|
|
166
232
|
/**
|
|
@@ -343,6 +409,8 @@ interface SketchBoardCanvasProps {
|
|
|
343
409
|
worldToScreen: (pt: Point) => Point;
|
|
344
410
|
panBy: (dx: number, dy: number) => void;
|
|
345
411
|
zoomAtPoint: (factor: number, pivot: Point) => void;
|
|
412
|
+
readOnly?: boolean;
|
|
413
|
+
onDoubleClick?: () => void;
|
|
346
414
|
tool: ToolType;
|
|
347
415
|
setTool: (tool: ToolType) => void;
|
|
348
416
|
gridStyle: GridStyle;
|
|
@@ -360,9 +428,10 @@ interface SketchBoardCanvasProps {
|
|
|
360
428
|
laserPointerPos?: Point | null;
|
|
361
429
|
setLaserPointerPos?: (pt: Point | null) => void;
|
|
362
430
|
}
|
|
363
|
-
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;
|
|
431
|
+
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, readOnly, onDoubleClick, }: SketchBoardCanvasProps): React__default.JSX.Element;
|
|
364
432
|
|
|
365
433
|
interface SketchBoardToolBarProps {
|
|
434
|
+
uiConfig?: SketchUIConfig;
|
|
366
435
|
tool: ToolType;
|
|
367
436
|
setTool: (tool: ToolType) => void;
|
|
368
437
|
isToolLocked?: boolean;
|
|
@@ -374,9 +443,10 @@ interface SketchBoardToolBarProps {
|
|
|
374
443
|
isTechStencilsOpen?: boolean;
|
|
375
444
|
onInsertTablePreset?: (preset: 'blank' | 'matrix' | 'swot' | 'kanban', rows?: number, cols?: number) => void;
|
|
376
445
|
}
|
|
377
|
-
declare function SketchBoardToolBar({ tool, setTool, isToolLocked, setIsToolLocked, onInsertImage, onOpenTemplates, isTemplatesOpen, onOpenTechStencils, isTechStencilsOpen, onInsertTablePreset, }: SketchBoardToolBarProps): React__default.JSX.Element;
|
|
446
|
+
declare function SketchBoardToolBar({ uiConfig, tool, setTool, isToolLocked, setIsToolLocked, onInsertImage, onOpenTemplates, isTemplatesOpen, onOpenTechStencils, isTechStencilsOpen, onInsertTablePreset, }: SketchBoardToolBarProps): React__default.JSX.Element;
|
|
378
447
|
|
|
379
448
|
interface SketchBoardPropertiesPanelProps {
|
|
449
|
+
uiConfig?: SketchUIConfig;
|
|
380
450
|
selectedElements: SketchBoardElement[];
|
|
381
451
|
updateSelectedElements: (updates: Partial<SketchBoardElement>) => void;
|
|
382
452
|
deleteSelectedElements: () => void;
|
|
@@ -394,9 +464,10 @@ interface SketchBoardPropertiesPanelProps {
|
|
|
394
464
|
canvasBackground?: string;
|
|
395
465
|
setCanvasBackground?: (color: string) => void;
|
|
396
466
|
}
|
|
397
|
-
declare function SketchBoardPropertiesPanel({ selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, bringToFront, sendToBack, bringForward, sendBackward, defaultStyles, setDefaultStyles, canvasBackground, setCanvasBackground, }: SketchBoardPropertiesPanelProps): React__default.JSX.Element;
|
|
467
|
+
declare function SketchBoardPropertiesPanel({ uiConfig, selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, bringToFront, sendToBack, bringForward, sendBackward, defaultStyles, setDefaultStyles, canvasBackground, setCanvasBackground, }: SketchBoardPropertiesPanelProps): React__default.JSX.Element;
|
|
398
468
|
|
|
399
469
|
interface SketchBoardTopBarProps {
|
|
470
|
+
uiConfig?: SketchUIConfig;
|
|
400
471
|
boardName: string;
|
|
401
472
|
setBoardName: (name: string) => void;
|
|
402
473
|
onOpenExport: () => void;
|
|
@@ -429,7 +500,7 @@ interface SketchBoardTopBarProps {
|
|
|
429
500
|
isSpotlightActive?: boolean;
|
|
430
501
|
onToggleSpotlight?: () => void;
|
|
431
502
|
}
|
|
432
|
-
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;
|
|
503
|
+
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, uiConfig, }: SketchBoardTopBarProps): React__default.JSX.Element;
|
|
433
504
|
|
|
434
505
|
interface SketchBoardMinimapProps {
|
|
435
506
|
elements: SketchBoardElement[];
|
|
@@ -479,8 +550,9 @@ interface SketchBoardExportModalProps {
|
|
|
479
550
|
boardName: string;
|
|
480
551
|
canvasBackground?: string;
|
|
481
552
|
gridStyle?: GridStyle;
|
|
553
|
+
uiConfig?: SketchUIConfig;
|
|
482
554
|
}
|
|
483
|
-
declare function SketchBoardExportModal({ isOpen, onClose, elements, selectedIds, onImportElements, boardName, canvasBackground, gridStyle, }: SketchBoardExportModalProps): React__default.JSX.Element | null;
|
|
555
|
+
declare function SketchBoardExportModal({ isOpen, onClose, elements, selectedIds, onImportElements, boardName, canvasBackground, gridStyle, uiConfig, }: SketchBoardExportModalProps): React__default.JSX.Element | null;
|
|
484
556
|
|
|
485
557
|
interface SketchBoardPresentationModeProps {
|
|
486
558
|
isOpen: boolean;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
-
import { S as SketchBoardElement, G as GridStyle, C as Camera, P as Point, T as ToolType, L as LaserMode, a as LaserStroke } from './index-
|
|
4
|
-
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-
|
|
3
|
+
import { S as SketchBoardElement, G as GridStyle, C as Camera, P as Point, T as ToolType, L as LaserMode, a as LaserStroke } from './index-BBEbI15I.js';
|
|
4
|
+
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-BBEbI15I.js';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* Document schema, initialization, serialization, and validation.
|
|
@@ -62,7 +62,7 @@ interface SketchController {
|
|
|
62
62
|
getCamera: () => Camera;
|
|
63
63
|
setZoom: (scale: number) => void;
|
|
64
64
|
panTo: (x: number, y: number) => void;
|
|
65
|
-
zoomToFit: () => void;
|
|
65
|
+
zoomToFit: (padding?: number) => void;
|
|
66
66
|
resetZoom: () => void;
|
|
67
67
|
on: <T = unknown>(event: SketchEventType, handler: SketchEventHandler<T>) => () => void;
|
|
68
68
|
destroy: () => void;
|
|
@@ -100,67 +100,133 @@ declare function useSketchTheme(themeProp?: ThemeMode): {
|
|
|
100
100
|
|
|
101
101
|
/** Default starter elements provided when no document is supplied */
|
|
102
102
|
declare const DEFAULT_STARTER_ELEMENTS: SketchBoardElement[];
|
|
103
|
+
/**
|
|
104
|
+
* Comprehensive UI visibility configuration for @filekit-studio/sketch.
|
|
105
|
+
* Controls every macro panel and granular micro-tool across the application.
|
|
106
|
+
*/
|
|
103
107
|
interface SketchUIConfig {
|
|
104
|
-
/** Display the top toolbar header
|
|
108
|
+
/** Display the top toolbar header container. Default: true */
|
|
105
109
|
showTopBar?: boolean;
|
|
106
|
-
/** Display
|
|
107
|
-
showExitButton?: boolean;
|
|
108
|
-
/** Display top bar board name title editor (default: true) */
|
|
110
|
+
/** Display the whiteboard title editor badge in the top bar. Default: true */
|
|
109
111
|
showBoardName?: boolean;
|
|
110
|
-
/** Display top bar
|
|
112
|
+
/** Display the Exit / Back arrow button in the top bar. Default: true (if onExit provided) */
|
|
113
|
+
showExitButton?: boolean;
|
|
114
|
+
/** Display the auto-save indicator badge ("Saved" / "Saving") in the top bar. Default: true */
|
|
111
115
|
showSaveIndicator?: boolean;
|
|
112
|
-
/** Display
|
|
116
|
+
/** Display undo/redo history buttons (Ctrl+Z / Ctrl+Y) in the top bar. Default: true */
|
|
113
117
|
showHistoryControls?: boolean;
|
|
114
|
-
/** Display
|
|
118
|
+
/** Display the Undo history button. Default: true (when showHistoryControls is true) */
|
|
119
|
+
showUndoButton?: boolean;
|
|
120
|
+
/** Display the Redo history button. Default: true (when showHistoryControls is true) */
|
|
121
|
+
showRedoButton?: boolean;
|
|
122
|
+
/** Display zoom percentage and zoom in/out/reset controls in the top bar. Default: true */
|
|
115
123
|
showZoomControls?: boolean;
|
|
116
|
-
/** Display
|
|
124
|
+
/** Display Zoom Out button. Default: true (when showZoomControls is true) */
|
|
125
|
+
showZoomOutButton?: boolean;
|
|
126
|
+
/** Display Zoom In button. Default: true (when showZoomControls is true) */
|
|
127
|
+
showZoomInButton?: boolean;
|
|
128
|
+
/** Display Zoom Reset (100%) pill button. Default: true (when showZoomControls is true) */
|
|
129
|
+
showZoomResetButton?: boolean;
|
|
130
|
+
/** Display canvas grid pattern selector (Grid, Dots, Cross, None) in the top bar. Default: true */
|
|
131
|
+
showGridSelector?: boolean;
|
|
132
|
+
/** Display presentation frames outline drawer toggle in the top bar. Default: true */
|
|
117
133
|
showFramesOutline?: boolean;
|
|
118
|
-
/** Display presentation slideshow trigger
|
|
134
|
+
/** Display fullscreen presentation slideshow trigger in the top bar. Default: true */
|
|
119
135
|
showPresentation?: boolean;
|
|
120
|
-
/** Display
|
|
136
|
+
/** Display laser pointer tool button in the top bar. Default: true */
|
|
121
137
|
showLaserPointer?: boolean;
|
|
122
|
-
/** Display
|
|
138
|
+
/** Display spotlight focus overlay button (Alt+S) in the top bar. Default: true */
|
|
139
|
+
showSpotlight?: boolean;
|
|
140
|
+
/** Display 1-click clipboard PNG image copy button in the top bar. Default: true */
|
|
123
141
|
showCopyImage?: boolean;
|
|
124
|
-
/** Display
|
|
142
|
+
/** Display clear canvas trash button in the top bar. Default: true */
|
|
125
143
|
showClearButton?: boolean;
|
|
126
|
-
/** Display
|
|
144
|
+
/** Display export menu dropdown modal (PNG, SVG, PDF, JSON) in the top bar. Default: true */
|
|
127
145
|
showExportMenu?: boolean;
|
|
128
|
-
/** Display
|
|
146
|
+
/** Display PDF (A4) document export tab in the export modal. Default: true */
|
|
147
|
+
showExportPdf?: boolean;
|
|
148
|
+
/** Display PNG raster image export button in the export modal. Default: true */
|
|
149
|
+
showExportPng?: boolean;
|
|
150
|
+
/** Display SVG scalable vector export button in the export modal. Default: true */
|
|
151
|
+
showExportSvg?: boolean;
|
|
152
|
+
/** Display JSON project file export button in the export modal. Default: true */
|
|
153
|
+
showExportJson?: boolean;
|
|
154
|
+
/** Display JSON project file import button in the export modal. Default: true */
|
|
155
|
+
showImportJson?: boolean;
|
|
156
|
+
/** Display the left creation tool palette container. Default: true */
|
|
129
157
|
showToolBar?: boolean;
|
|
130
|
-
/**
|
|
158
|
+
/** Display the pointer selection tool (V). Default: true */
|
|
131
159
|
showSelectTool?: boolean;
|
|
132
|
-
/**
|
|
160
|
+
/** Display the hand pan canvas tool (H). Default: true */
|
|
161
|
+
showHandTool?: boolean;
|
|
162
|
+
/** Display geometric shapes flyout (Rectangle, Ellipse, Diamond, Triangle, Star, etc.). Default: true */
|
|
133
163
|
showShapeTools?: boolean;
|
|
134
|
-
/**
|
|
164
|
+
/** Display freehand drawing pen tool (P). Default: true */
|
|
135
165
|
showDrawTool?: boolean;
|
|
136
|
-
/**
|
|
166
|
+
/** Display magnetic connector arrows tool (A). Default: true */
|
|
137
167
|
showArrowTool?: boolean;
|
|
138
|
-
/**
|
|
168
|
+
/** Display straight lines connector tool (L). Default: true */
|
|
169
|
+
showLineTool?: boolean;
|
|
170
|
+
/** Display typography text block tool (T). Default: true */
|
|
139
171
|
showTextTool?: boolean;
|
|
140
|
-
/**
|
|
172
|
+
/** Display sticky notes idea cards tool (S). Default: true */
|
|
141
173
|
showStickyNoteTool?: boolean;
|
|
142
|
-
/**
|
|
174
|
+
/** Display matrix, SWOT, Kanban, and grid table generator tool. Default: true */
|
|
143
175
|
showTableTool?: boolean;
|
|
144
|
-
/**
|
|
176
|
+
/** Display insert image file upload tool (PNG, JPG, SVG, WebP). Default: true */
|
|
145
177
|
showImageUpload?: boolean;
|
|
146
|
-
/**
|
|
178
|
+
/** Display tech and cloud architecture stencils flyout (AWS, GCP, Azure, K8s). Default: true */
|
|
147
179
|
showTechStencils?: boolean;
|
|
148
|
-
/**
|
|
180
|
+
/** Display architecture starter diagram templates flyout. Default: true */
|
|
149
181
|
showTemplates?: boolean;
|
|
150
|
-
/**
|
|
182
|
+
/** Display element eraser tool (E). Default: true */
|
|
151
183
|
showEraserTool?: boolean;
|
|
152
|
-
/**
|
|
184
|
+
/** Display laser pointer tool in the left toolbar (K). Default: true */
|
|
185
|
+
showLaserTool?: boolean;
|
|
186
|
+
/** Display lock active tool toggle button. Default: true */
|
|
153
187
|
showLockTool?: boolean;
|
|
154
|
-
/** Display the right element styling and properties panel
|
|
188
|
+
/** Display the right element styling and properties panel container. Default: true */
|
|
155
189
|
showPropertiesPanel?: boolean;
|
|
156
|
-
/** Display
|
|
190
|
+
/** Display stroke color picker and palette in properties panel. Default: true */
|
|
191
|
+
showStrokeColor?: boolean;
|
|
192
|
+
/** Display fill color picker and palette in properties panel. Default: true */
|
|
193
|
+
showFillColor?: boolean;
|
|
194
|
+
/** Display fill pattern texture selector (Solid, Hachure, Cross-hatch, Transparent). Default: true */
|
|
195
|
+
showFillStyle?: boolean;
|
|
196
|
+
/** Display stroke thickness width selector (Thin, Medium, Thick). Default: true */
|
|
197
|
+
showStrokeWidth?: boolean;
|
|
198
|
+
/** Display stroke line pattern selector (Solid, Dashed, Dotted). Default: true */
|
|
199
|
+
showStrokeStyle?: boolean;
|
|
200
|
+
/** Display hand-drawn roughness selector (Clean, Rough, Subtle, Sloppy). Default: true */
|
|
201
|
+
showRoughness?: boolean;
|
|
202
|
+
/** Display corner edge style selector (Sharp vs Rounded). Default: true */
|
|
203
|
+
showEdgeStyle?: boolean;
|
|
204
|
+
/** Display connector start/end arrowhead selector. Default: true */
|
|
205
|
+
showArrowheads?: boolean;
|
|
206
|
+
/** Display typography font family, font size, and text alignment options. Default: true */
|
|
207
|
+
showTypography?: boolean;
|
|
208
|
+
/** Display element opacity slider. Default: true */
|
|
209
|
+
showOpacity?: boolean;
|
|
210
|
+
/** Display canvas background color preset swatches in properties panel. Default: true */
|
|
211
|
+
showCanvasBackgroundPicker?: boolean;
|
|
212
|
+
/** Display multi-element alignment & distribution buttons (Align left/center/right). Default: true */
|
|
213
|
+
showAlignment?: boolean;
|
|
214
|
+
/** Display z-index layer ordering buttons (Bring to front, Send to back). Default: true */
|
|
215
|
+
showLayerOrdering?: boolean;
|
|
216
|
+
/** Display group and ungroup buttons in properties panel. Default: true */
|
|
217
|
+
showGrouping?: boolean;
|
|
218
|
+
/** Display duplicate and delete quick action buttons in properties panel header. Default: true */
|
|
219
|
+
showDuplicateDelete?: boolean;
|
|
220
|
+
/** Display the bottom-right workspace overview minimap. Default: true */
|
|
157
221
|
showMinimap?: boolean;
|
|
158
|
-
/** Display the bottom-left keyboard shortcuts
|
|
222
|
+
/** Display the bottom-left keyboard shortcuts modal trigger pill. Default: true */
|
|
159
223
|
showShortcutsButton?: boolean;
|
|
160
|
-
/** Display the bottom-left documentation guide button
|
|
224
|
+
/** Display the bottom-left documentation guide button pill. Default: true (if guideHref or onOpenGuide provided) */
|
|
161
225
|
showGuideButton?: boolean;
|
|
162
|
-
/** Enable right-click
|
|
226
|
+
/** Enable right-click contextual menu on canvas and elements. Default: true */
|
|
163
227
|
showContextMenu?: boolean;
|
|
228
|
+
/** Display contextual floating dock toolbar above selected elements. Default: true */
|
|
229
|
+
showFloatingDock?: boolean;
|
|
164
230
|
}
|
|
165
231
|
interface SketchEditorProps {
|
|
166
232
|
/**
|
|
@@ -343,6 +409,8 @@ interface SketchBoardCanvasProps {
|
|
|
343
409
|
worldToScreen: (pt: Point) => Point;
|
|
344
410
|
panBy: (dx: number, dy: number) => void;
|
|
345
411
|
zoomAtPoint: (factor: number, pivot: Point) => void;
|
|
412
|
+
readOnly?: boolean;
|
|
413
|
+
onDoubleClick?: () => void;
|
|
346
414
|
tool: ToolType;
|
|
347
415
|
setTool: (tool: ToolType) => void;
|
|
348
416
|
gridStyle: GridStyle;
|
|
@@ -360,9 +428,10 @@ interface SketchBoardCanvasProps {
|
|
|
360
428
|
laserPointerPos?: Point | null;
|
|
361
429
|
setLaserPointerPos?: (pt: Point | null) => void;
|
|
362
430
|
}
|
|
363
|
-
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;
|
|
431
|
+
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, readOnly, onDoubleClick, }: SketchBoardCanvasProps): React__default.JSX.Element;
|
|
364
432
|
|
|
365
433
|
interface SketchBoardToolBarProps {
|
|
434
|
+
uiConfig?: SketchUIConfig;
|
|
366
435
|
tool: ToolType;
|
|
367
436
|
setTool: (tool: ToolType) => void;
|
|
368
437
|
isToolLocked?: boolean;
|
|
@@ -374,9 +443,10 @@ interface SketchBoardToolBarProps {
|
|
|
374
443
|
isTechStencilsOpen?: boolean;
|
|
375
444
|
onInsertTablePreset?: (preset: 'blank' | 'matrix' | 'swot' | 'kanban', rows?: number, cols?: number) => void;
|
|
376
445
|
}
|
|
377
|
-
declare function SketchBoardToolBar({ tool, setTool, isToolLocked, setIsToolLocked, onInsertImage, onOpenTemplates, isTemplatesOpen, onOpenTechStencils, isTechStencilsOpen, onInsertTablePreset, }: SketchBoardToolBarProps): React__default.JSX.Element;
|
|
446
|
+
declare function SketchBoardToolBar({ uiConfig, tool, setTool, isToolLocked, setIsToolLocked, onInsertImage, onOpenTemplates, isTemplatesOpen, onOpenTechStencils, isTechStencilsOpen, onInsertTablePreset, }: SketchBoardToolBarProps): React__default.JSX.Element;
|
|
378
447
|
|
|
379
448
|
interface SketchBoardPropertiesPanelProps {
|
|
449
|
+
uiConfig?: SketchUIConfig;
|
|
380
450
|
selectedElements: SketchBoardElement[];
|
|
381
451
|
updateSelectedElements: (updates: Partial<SketchBoardElement>) => void;
|
|
382
452
|
deleteSelectedElements: () => void;
|
|
@@ -394,9 +464,10 @@ interface SketchBoardPropertiesPanelProps {
|
|
|
394
464
|
canvasBackground?: string;
|
|
395
465
|
setCanvasBackground?: (color: string) => void;
|
|
396
466
|
}
|
|
397
|
-
declare function SketchBoardPropertiesPanel({ selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, bringToFront, sendToBack, bringForward, sendBackward, defaultStyles, setDefaultStyles, canvasBackground, setCanvasBackground, }: SketchBoardPropertiesPanelProps): React__default.JSX.Element;
|
|
467
|
+
declare function SketchBoardPropertiesPanel({ uiConfig, selectedElements, updateSelectedElements, deleteSelectedElements, duplicateSelectedElements, groupSelectedElements, ungroupSelectedElements, alignSelectedElements, distributeSelectedElements, bringToFront, sendToBack, bringForward, sendBackward, defaultStyles, setDefaultStyles, canvasBackground, setCanvasBackground, }: SketchBoardPropertiesPanelProps): React__default.JSX.Element;
|
|
398
468
|
|
|
399
469
|
interface SketchBoardTopBarProps {
|
|
470
|
+
uiConfig?: SketchUIConfig;
|
|
400
471
|
boardName: string;
|
|
401
472
|
setBoardName: (name: string) => void;
|
|
402
473
|
onOpenExport: () => void;
|
|
@@ -429,7 +500,7 @@ interface SketchBoardTopBarProps {
|
|
|
429
500
|
isSpotlightActive?: boolean;
|
|
430
501
|
onToggleSpotlight?: () => void;
|
|
431
502
|
}
|
|
432
|
-
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;
|
|
503
|
+
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, uiConfig, }: SketchBoardTopBarProps): React__default.JSX.Element;
|
|
433
504
|
|
|
434
505
|
interface SketchBoardMinimapProps {
|
|
435
506
|
elements: SketchBoardElement[];
|
|
@@ -479,8 +550,9 @@ interface SketchBoardExportModalProps {
|
|
|
479
550
|
boardName: string;
|
|
480
551
|
canvasBackground?: string;
|
|
481
552
|
gridStyle?: GridStyle;
|
|
553
|
+
uiConfig?: SketchUIConfig;
|
|
482
554
|
}
|
|
483
|
-
declare function SketchBoardExportModal({ isOpen, onClose, elements, selectedIds, onImportElements, boardName, canvasBackground, gridStyle, }: SketchBoardExportModalProps): React__default.JSX.Element | null;
|
|
555
|
+
declare function SketchBoardExportModal({ isOpen, onClose, elements, selectedIds, onImportElements, boardName, canvasBackground, gridStyle, uiConfig, }: SketchBoardExportModalProps): React__default.JSX.Element | null;
|
|
484
556
|
|
|
485
557
|
interface SketchBoardPresentationModeProps {
|
|
486
558
|
isOpen: boolean;
|