react-drawable-overlay
Version:
A package for wrapping elements with a drawable canvas.
47 lines (43 loc) • 1.43 kB
TypeScript
interface DrawableStateContext {
drawMode: DrawModeTypes
brushSize: number
eraserSize: number
brushColor: string
inDrawMode: boolean
}
interface DrawableUtilsContext {
reset: () => void
setDrawMode: (drawMode: DrawModeTypes) => void
setBrushSize: (size: number) => void
setEraserSize: (size: number) => void
setBrushColor: (hexadecimal: string) => void
setInitialDrawing: (drawing: string) => void
setInDrawMode: (inDrawMode: boolean) => void
}
interface DrawableHistoryContext {
undo: () => void
redo: () => void
history: string[]
currentHistoryIndex: number
}
interface DrawableOverlayProps {
widthOffset?: number
heightOffset?: number
defaultBrushColor?: string
initialInDrawMode?: boolean
children?: JSX.Element | JSX.Element[]
onAddToHistory?: (drawing: string) => void
}
type DrawModeTypes = "brush" | "eraser"
enum DrawMode {
Brush = "brush",
Eraser = "eraser",
}
declare function useDrawableState(): DrawableStateContext
declare function useDrawableUtils(): DrawableUtilsContext
declare function useDrawableHistory(): DrawableHistoryContext
declare function useStage(): JSX.Element
declare const DrawableOverlay: (
props: DrawableOverlayProps
) => JSX.Element
export { DrawableStateContext, DrawableUtilsContext, DrawableHistoryContext, DrawableOverlayProps, DrawModeTypes, DrawMode, useDrawableState, useDrawableUtils, useDrawableHistory, useStage, DrawableOverlay };