@turnix-co/konva-editor 2.0.25 → 2.0.28

package/dist/index.d.ts

@@ -1,18 +1,110 @@
-import Konva from 'konva';
-export { default as Konva } from 'konva';
-export { Stage as KonvaStage } from 'konva/lib/Stage';
 import React$1 from 'react';
+import Konva from 'konva';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _reduxjs_toolkit from '@reduxjs/toolkit';
 import * as redux_thunk from 'redux-thunk';
 import * as redux from 'redux';
 export { Provider as ReduxProvider } from 'react-redux';
 
+/**
+ * Tool identifiers for the main toolbar
+ */
+type ToolType = 'select' | 'pen' | 'eraser' | 'text' | 'shapes' | 'activities' | 'media';
+/**
+ * Shape identifiers available in shapes submenu
+ */
+type ShapeType = 'rectangle' | 'circle' | 'ellipse' | 'triangle' | 'polygon' | 'star' | 'ring' | 'wedge' | 'arrow' | 'line' | 'arc';
+/**
+ * Activity identifiers available in activities submenu
+ */
+type ActivityType = 'flashcard' | 'multiple-choice' | 'true-false' | 'short-answer' | 'fill-in-the-blank';
+/**
+ * Media identifiers available in media submenu
+ */
+type MediaType = 'photo-frame' | 'image' | 'video';
+/**
+ * Action identifiers for the toolbar action buttons
+ */
+type ActionType = 'undo' | 'redo' | 'screen-record' | 'camera-record' | 'clear';
+/**
+ * Configuration for which tools to show in the toolbar
+ */
+interface ToolbarToolsConfig {
+    /** Show select/cursor tool */
+    select?: boolean;
+    /** Show pen drawing tool */
+    pen?: boolean;
+    /** Show eraser tool */
+    eraser?: boolean;
+    /** Show text tool */
+    text?: boolean;
+    /** Show shapes menu (or provide specific shapes) */
+    shapes?: boolean | ShapeType[];
+    /** Show activities menu (or provide specific activities) */
+    activities?: boolean | ActivityType[];
+    /** Show media menu (or provide specific media types) */
+    media?: boolean | MediaType[];
+}
+/**
+ * Configuration for which action buttons to show
+ */
+interface ToolbarActionsConfig {
+    /** Show undo button */
+    undo?: boolean;
+    /** Show redo button */
+    redo?: boolean;
+    /** Show screen recording button */
+    screenRecord?: boolean;
+    /** Show camera recording button */
+    cameraRecord?: boolean;
+    /** Show clear canvas button */
+    clear?: boolean;
+}
+/**
+ * Complete toolbar configuration
+ */
+interface ToolbarConfig {
+    /** Configure which tools to show */
+    tools?: ToolbarToolsConfig;
+    /** Configure which action buttons to show */
+    actions?: ToolbarActionsConfig;
+}
+/**
+ * Default toolbar configuration - all tools and actions enabled
+ */
+declare const DEFAULT_TOOLBAR_CONFIG: Required<ToolbarConfig>;
+/**
+ * Context menu configuration
+ * Simple boolean to enable/disable context menu on right-click of canvas elements
+ */
+interface ContextMenuConfig {
+    /** Enable/disable context menu entirely (default: true) */
+    enabled: boolean;
+}
+/**
+ * Default context menu configuration - enabled by default
+ */
+declare const DEFAULT_CONTEXT_MENU_CONFIG: ContextMenuConfig;
+/**
+ * Merge user's toolbar config with defaults
+ */
+declare function mergeToolbarConfig(userConfig?: ToolbarConfig): Required<ToolbarConfig>;
+/**
+ * Preset: Viewer-only mode (no editing capabilities)
+ */
+declare const VIEWER_TOOLBAR_CONFIG: ToolbarConfig;
+/**
+ * Preset: Basic editor (no activities)
+ */
+declare const BASIC_EDITOR_TOOLBAR_CONFIG: ToolbarConfig;
+
 type CanvasProps = {
     onStageReady?: (stageRef: React$1.RefObject<Konva.Stage | null>) => void;
     onSelectionChange?: (selectedId: string | null) => void;
     onTextEditingReady?: (startEditingFn: (textId: string) => void) => void;
     onDirectDrawingCanvasReady?: (canvasRef: React$1.RefObject<HTMLCanvasElement | null>) => void;
+    /** Configuration for context menu permissions and visibility */
+    contextMenuConfig?: ContextMenuConfig;
 };
 declare const Canvas: React$1.FC<CanvasProps>;
 
@@ -23,18 +115,10 @@ type ToolbarProps = {
     stageRef?: React.RefObject<Konva.Stage | null>;
     onTextAdded?: (textId: string) => void;
     showToggleButton?: boolean;
+    /** Configuration for which tools and actions to show */
+    config?: ToolbarConfig;
 };
-declare const Toolbar: ({ isOpen: isOpenProp, onClose, onScreenRecord, stageRef, onTextAdded, showToggleButton, }?: ToolbarProps) => react_jsx_runtime.JSX.Element;
-
-declare const SlideNavigation: React$1.FC;
-
-type ScreenRecorderProps = {
-    onClose: () => void;
-    stageRef?: React$1.RefObject<Konva.Stage | null>;
-    onRecordingComplete?: (videoBlob: Blob, thumbnailDataUrl: string) => void;
-    directDrawingCanvasRef?: React$1.RefObject<HTMLCanvasElement | null>;
-};
-declare const ScreenRecorder: React$1.FC<ScreenRecorderProps>;
+declare const Toolbar: ({ isOpen: isOpenProp, onClose, onScreenRecord, stageRef, onTextAdded, showToggleButton, config, }?: ToolbarProps) => react_jsx_runtime.JSX.Element;
 
 type Line$1 = {
     id?: string;
@@ -546,22 +630,6 @@ interface PublishButtonProps {
 }
 declare const PublishButton: React$1.FC<PublishButtonProps>;
 
-interface EditorRootProps {
-    children: React$1.ReactNode;
-    className?: string;
-    style?: React$1.CSSProperties;
-}
-/**
- * EditorRoot wraps the konva editor components and scopes all Tailwind styles
- * to prevent conflicts with host application styles.
- *
- * All konva-editor Tailwind utilities are scoped to the .konva-editor-root class
- * via the `important` setting in tailwind.config.js
- *
- * Default styles are applied for full-screen layout. Override with the style prop if needed.
- */
-declare function EditorRoot({ children, className, style }: EditorRootProps): react_jsx_runtime.JSX.Element;
-
 type TopNavBarProps = {
     /** Title displayed in the header */
     title?: string;
@@ -609,18 +677,15 @@ type BottomToolbarProps = {
 };
 declare const BottomToolbar: React$1.FC<BottomToolbarProps>;
 
-type LayerItem = {
-    id: string;
-    type: 'image' | 'video' | 'shape' | 'text' | 'flashcard' | 'photoFrame' | 'mcq' | 'trueFalse' | 'shortAnswer' | 'longAnswer' | 'fillInTheBlanks' | 'line';
-    name: string;
-    timestamp: number;
-};
-type LayersPanelProps = {
-    selectedElementId?: string;
+declare const SlideNavigation: React$1.FC;
+
+type ScreenRecorderProps = {
     onClose: () => void;
-    onSelectElement: (id: string, type: LayerItem['type']) => void;
+    stageRef?: React$1.RefObject<Konva.Stage | null>;
+    onRecordingComplete?: (videoBlob: Blob, thumbnailDataUrl: string) => void;
+    directDrawingCanvasRef?: React$1.RefObject<HTMLCanvasElement | null>;
 };
-declare const LayersPanel: React$1.FC<LayersPanelProps>;
+declare const ScreenRecorder: React$1.FC<ScreenRecorderProps>;
 
 type ToolbarState = {
     selectedTool: string;
@@ -748,4 +813,4 @@ declare const useSelector: <T>(selector: (state: RootState) => T) => T;
 
 declare const useSlidesPersistence: () => void;
 
-export { type AppDispatch, BottomToolbar, type BottomToolbarProps, Canvas, type CanvasProps, EditorRoot, type EditorRootProps, type ExportOptions, type FillInTheBlanks, type FlashcardElement, type ImageElement, LayersPanel, type Line$1 as Line, type LongAnswer, type MultipleChoice, type PhotoFrameElement, PublishButton, type PublishButtonProps, type PublishProgress, type PublishResponse, type RootState, ScreenRecorder, type Shape, type ShortAnswer, type Slide, SlideNavigation, type TextElement, Toolbar, type ToolbarProps, TopNavBar, type TopNavBarProps, type TrueFalse, type VideoElement, addFillInTheBlanks, addFlashcard, addImage, addImageAnnotation, addLine, addLongAnswer, addMultipleChoice, addPhotoFrame, addPhotoFrameAnnotation, addShape, addShortAnswer, addSlide, addText, addTrueFalse, addVideo, bringToFront, clearCanvas, clearImageAnnotations, clearPhotoFrameAnnotations, deleteFillInTheBlanks, deleteFlashcard, deleteImage, deleteLineById, deleteLongAnswer, deleteMultipleChoice, deletePhotoFrame, deleteShape, deleteShortAnswer, deleteSlide, deleteText, deleteTrueFalse, deleteVideo, duplicateFillInTheBlanks, duplicateFlashcard, duplicateImage, duplicateLine, duplicateLongAnswer, duplicateMultipleChoice, duplicatePhotoFrame, duplicateShape, duplicateShortAnswer, duplicateSlide, duplicateText, duplicateTrueFalse, duplicateVideo, editFlashcard, editMultipleChoice, exportSlideAsBlob, exportSlideAsImage, finalizeDrawing, getCompressionStats, getSlideDataURL, loadSlides, nextFlashcard, previousFlashcard, redo, removeLine, reorderSlides, saveToHistory, selectAllSlides, selectCanAddSlide, selectCurrentSlide, selectCurrentSlideId, selectSlideById, sendToBack, setActivityType, setAltText, setAudioData, setBackgroundColor, setCurrentSlide, setEditingActivity, setEditingTextId, setLines, setLink, setPenColor, setShowFlashcardForm, setShowMcqForm, setSketchMode, setStrokeWidth, setTool, simplifyFlatPoints, simplifyLine, simplifyLines, store, toggleImageDrawingMode, toggleLock, togglePhotoFrameDrawingMode, toggleSketchMode, toggleVideoPlaying, undo, updateElementOrder, updateFillInTheBlanks, updateFlashcard, updateImage, updateImageAnnotation, updateLastLine, updateLinePosition, updateLineTransform, updateLongAnswer, updateMultipleChoice, updatePhotoFrame, updatePhotoFrameAnnotation, updateShape, updateShortAnswer, updateSlideThumbnail, updateText, updateTrueFalse, updateVideo, useDispatch, useSelector, useSlidesPersistence };
+export { type ActionType, type ActivityType, type AppDispatch, BASIC_EDITOR_TOOLBAR_CONFIG, BottomToolbar, type BottomToolbarProps, Canvas, type CanvasProps, type ContextMenuConfig, DEFAULT_CONTEXT_MENU_CONFIG, DEFAULT_TOOLBAR_CONFIG, type ExportOptions, type FillInTheBlanks, type FlashcardElement, type ImageElement, type Line$1 as Line, type LongAnswer, type MediaType, type MultipleChoice, type PhotoFrameElement, PublishButton, type PublishButtonProps, type PublishProgress, type PublishResponse, type RootState, ScreenRecorder, type Shape, type ShapeType, type ShortAnswer, type Slide, SlideNavigation, type TextElement, type ToolType, Toolbar, type ToolbarActionsConfig, type ToolbarConfig, type ToolbarProps, type ToolbarToolsConfig, TopNavBar, type TopNavBarProps, type TrueFalse, VIEWER_TOOLBAR_CONFIG, type VideoElement, addFillInTheBlanks, addFlashcard, addImage, addImageAnnotation, addLine, addLongAnswer, addMultipleChoice, addPhotoFrame, addPhotoFrameAnnotation, addShape, addShortAnswer, addSlide, addText, addTrueFalse, addVideo, bringToFront, clearCanvas, clearImageAnnotations, clearPhotoFrameAnnotations, deleteFillInTheBlanks, deleteFlashcard, deleteImage, deleteLineById, deleteLongAnswer, deleteMultipleChoice, deletePhotoFrame, deleteShape, deleteShortAnswer, deleteSlide, deleteText, deleteTrueFalse, deleteVideo, duplicateFillInTheBlanks, duplicateFlashcard, duplicateImage, duplicateLine, duplicateLongAnswer, duplicateMultipleChoice, duplicatePhotoFrame, duplicateShape, duplicateShortAnswer, duplicateSlide, duplicateText, duplicateTrueFalse, duplicateVideo, editFlashcard, editMultipleChoice, exportSlideAsBlob, exportSlideAsImage, finalizeDrawing, getCompressionStats, getSlideDataURL, loadSlides, mergeToolbarConfig, nextFlashcard, previousFlashcard, redo, removeLine, reorderSlides, saveToHistory, selectAllSlides, selectCanAddSlide, selectCurrentSlide, selectCurrentSlideId, selectSlideById, sendToBack, setActivityType, setAltText, setAudioData, setBackgroundColor, setCurrentSlide, setEditingActivity, setEditingTextId, setLines, setLink, setPenColor, setShowFlashcardForm, setShowMcqForm, setSketchMode, setStrokeWidth, setTool, simplifyFlatPoints, simplifyLine, simplifyLines, store, toggleImageDrawingMode, toggleLock, togglePhotoFrameDrawingMode, toggleSketchMode, toggleVideoPlaying, undo, updateElementOrder, updateFillInTheBlanks, updateFlashcard, updateImage, updateImageAnnotation, updateLastLine, updateLinePosition, updateLineTransform, updateLongAnswer, updateMultipleChoice, updatePhotoFrame, updatePhotoFrameAnnotation, updateShape, updateShortAnswer, updateSlideThumbnail, updateText, updateTrueFalse, updateVideo, useDispatch, useSelector, useSlidesPersistence };