@ngenux/ngage-whiteboarding/dist/src/context/WhiteboardContext.d.ts

A collaborative whiteboard React component with real-time synchronization

import React from 'react';
import { ShapeProps, WhiteboardState, ToolType, DrawingAction, StrokeStyle, WhiteboardSyncState } from '../types';
type WhiteboardAction = {
    type: 'SET_TOOL';
    payload: ToolType;
} | {
    type: 'SET_COLOR';
    payload: string;
} | {
    type: 'SET_BACKGROUND_COLOR';
    payload: string;
} | {
    type: 'SET_STROKE_WIDTH';
    payload: number;
} | {
    type: 'SET_STROKE_STYLE';
    payload: StrokeStyle;
} | {
    type: 'SET_OPACITY';
    payload: number;
} | {
    type: 'SET_USER_ID';
    payload: string;
} | {
    type: 'ADD_SHAPE';
    payload: ShapeProps;
} | {
    type: 'UPDATE_SHAPE';
    payload: ShapeProps;
} | {
    type: 'UPDATE_TEMP_SHAPE';
    payload: ShapeProps;
} | {
    type: 'SET_ACTIVE_DRAWING';
    payload: ShapeProps;
} | {
    type: 'REMOVE_ACTIVE_DRAWING';
    payload: string;
} | {
    type: 'CLEAR_ACTIVE_DRAWINGS';
} | {
    type: 'SET_CLEAR_TIMESTAMP';
    payload: number;
} | {
    type: 'DELETE_SHAPE';
    payload: string;
} | {
    type: 'SELECT_SHAPE';
    payload: string;
} | {
    type: 'DESELECT_ALL';
} | {
    type: 'SET_DRAWING';
    payload: boolean;
} | {
    type: 'SET_CAPTURE_ENABLED';
    payload: boolean;
} | {
    type: 'SET_CANVAS_SIZE';
    payload: {
        width: number;
        height: number;
    };
} | {
    type: 'SET_CURRENT_DRAWING_SHAPE';
    payload: ShapeProps | undefined;
} | {
    type: 'CLEAR_CANVAS';
} | {
    type: 'UNDO';
} | {
    type: 'REDO';
} | {
    type: 'SET_SHAPES';
    payload: ShapeProps[];
} | {
    type: 'USER_UNDO';
    payload: string;
} | {
    type: 'USER_REDO';
    payload: string;
} | {
    type: 'USER_CLEAR';
    payload: string;
} | {
    type: 'ERASE';
    payload: {
        shapeId: string;
        erasePath: {
            x: number;
            y: number;
        }[];
        normalizedErasePath?: {
            x: number;
            y: number;
        }[];
    };
};
type WhiteboardContextType = {
    state: WhiteboardState;
    dispatch: React.Dispatch<WhiteboardAction>;
    applyDrawingAction: (action: DrawingAction) => void;
    getCurrentSyncState: () => WhiteboardSyncState;
    requestStateFromPeers: () => void;
    setQueueAction: (queueAction: (action: DrawingAction) => void) => void;
    normalizePoint: (point: {
        x: number;
        y: number;
    }) => {
        x: number;
        y: number;
    };
    denormalizePoint: (normalizedPoint: {
        x: number;
        y: number;
    }) => {
        x: number;
        y: number;
    };
    webSocketUrl?: string;
};
export declare const WhiteboardProvider: React.FC<{
    children: React.ReactNode;
    webSocketUrl?: string;
}>;
export declare const useWhiteboard: () => WhiteboardContextType;
export {};
//# sourceMappingURL=WhiteboardContext.d.ts.map