react-board-drawing-hook 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,254 @@
+import * as react from 'react';
+
+/**
+ * КОНСТАНТЫ ХОЛСТА
+ */
+declare const CANVAS_WIDTH = 1600;
+declare const CANVAS_HEIGHT = 900;
+/**
+ * ТИПЫ ОБЪЕКТОВ
+ */
+type ObjectType = 'text' | 'image' | 'rectangle' | 'circle' | 'line' | 'pencil';
+/**
+ * ИНСТРУМЕНТЫ РИСОВАНИЯ
+ */
+type DrawingTool = 'select' | 'pencil' | 'line' | 'rectangle' | 'circle' | 'text' | 'eraser';
+/**
+ * РЕЖИМЫ ВЗАИМОДЕЙСТВИЯ
+ */
+type InteractionMode = 'none' | 'move' | 'rotate' | 'resize' | 'draw';
+/**
+ * МАРКЕРЫ ИЗМЕНЕНИЯ РАЗМЕРА
+ */
+type ResizeHandle = 'nw' | 'ne' | 'sw' | 'se' | 'n' | 's' | 'e' | 'w' | 'rotate';
+/**
+ * ТОЧКА НА ХОЛСТЕ
+ */
+interface Point {
+    x: number;
+    y: number;
+}
+/**
+ * ОБЪЕКТ НА ДОСКЕ (BoardObject)
+ */
+interface BoardObject {
+    id: string;
+    type: ObjectType;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    rotation: number;
+    locked_by: number | null;
+    locked_by_name: string | null;
+    content?: string;
+    fontSize?: number;
+    color?: string;
+    imageUrl?: string;
+    aspectRatio?: number;
+    fillColor?: string;
+    strokeColor?: string;
+    strokeWidth?: number;
+    x2?: number;
+    y2?: number;
+    points?: Point[];
+    userId?: number;
+    timestamp?: number;
+}
+/**
+ * Ограничивает координаты объекта границами холста.
+ */
+declare function clampObjectToCanvas(obj: BoardObject): BoardObject;
+/**
+ * Проверяет, может ли пользователь редактировать объект.
+ */
+declare function canEditObject(obj: BoardObject, userId: number): boolean;
+/**
+ * Генерирует уникальный ID для нового объекта.
+ */
+declare function generateObjectId(): string;
+/**
+ * Вращает точку вокруг центра на заданный угол.
+ */
+declare function rotatePoint(x: number, y: number, cx: number, cy: number, angle: number): {
+    x: number;
+    y: number;
+};
+/**
+ * Изменяет размер изображения С СОХРАНЕНИЕМ ПРОПОРЦИЙ.
+ */
+declare function resizeImageWithAspectRatio(obj: BoardObject, handle: ResizeHandle, deltaX: number, deltaY: number, original: BoardObject): BoardObject;
+/**
+ * СВОБОДНЫЙ РЕСАЙЗ С ПОДДЕРЖКОЙ ПЕРЕВОРОТА
+ */
+declare function resizeObjectFree(obj: BoardObject, handle: ResizeHandle, deltaX: number, deltaY: number, original: BoardObject): BoardObject;
+/**
+ * РЕСАЙЗ ЛИНИИ
+ */
+declare function resizeLineObject(obj: BoardObject, handle: ResizeHandle, deltaX: number, deltaY: number, original: BoardObject): BoardObject;
+/**
+ * Вычисляет границы объекта (Bounding Box).
+ */
+declare function getObjectBoundingBox(obj: BoardObject): {
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+};
+/**
+ * Проверка попадания точки в повернутый прямоугольник
+ */
+declare function isPointInRotatedRectangle(x: number, y: number, obj: BoardObject): boolean;
+/**
+ * Расстояние от точки до отрезка
+ */
+declare function distanceToLine(px: number, py: number, x1: number, y1: number, x2: number, y2: number): number;
+/**
+ * Проверка попадания точки в объект
+ */
+declare function isPointInObject(x: number, y: number, obj: BoardObject, userId: number): boolean;
+
+interface BoardEventHandlers {
+    onConnectionChange?: (connected: boolean) => void;
+    onObjectLocked?: (objectId: string, userId: number, userName: string) => void;
+    onObjectUnlocked?: (objectId: string) => void;
+    onObjectCreated?: (object: BoardObject) => void;
+    onObjectUpdated?: (object: BoardObject) => void;
+    onObjectDeleted?: (objectId: string) => void;
+    onUserJoined?: (userId: number, userName: string) => void;
+    onUserLeft?: (userId: number, userName: string) => void;
+    onError?: (error: Error, context?: any) => void;
+}
+interface BoardWebSocketService {
+    connect(boardId: string | number, userId: number, userName: string): void;
+    disconnect(): void;
+    isConnected(): boolean;
+    createObject(object: BoardObject): void;
+    updateObject(object: BoardObject): void;
+    deleteObject(objectId: string): void;
+    lockObject(objectId: string): void;
+    unlockObject(objectId: string): void;
+    setEventHandlers(handlers: BoardEventHandlers): void;
+}
+declare abstract class BaseWebSocketAdapter implements BoardWebSocketService {
+    protected handlers: BoardEventHandlers;
+    protected connected: boolean;
+    abstract connect(boardId: string | number, userId: number, userName: string): void;
+    abstract disconnect(): void;
+    abstract createObject(object: BoardObject): void;
+    abstract updateObject(object: BoardObject): void;
+    abstract deleteObject(objectId: string): void;
+    abstract lockObject(objectId: string): void;
+    abstract unlockObject(objectId: string): void;
+    isConnected(): boolean;
+    setEventHandlers(handlers: BoardEventHandlers): void;
+    protected handleError(error: Error, context?: any): void;
+}
+
+interface UseBoardDrawingProps {
+    boardId: string | number;
+    userId: number;
+    userName: string;
+    canvasRef: React.RefObject<HTMLCanvasElement | null>;
+    webSocketService: BoardWebSocketService;
+    onObjectsUpdated?: (objects: BoardObject[]) => void;
+    onObjectLocked?: (objectId: string, userId: number, userName: string) => void;
+    onObjectUnlocked?: (objectId: string) => void;
+    onUserJoined?: (userId: number, userName: string) => void;
+    onUserLeft?: (userId: number, userName: string) => void;
+    config?: {
+        enableKeyboardShortcuts?: boolean;
+        enableGlobalListeners?: boolean;
+        maxImageSize?: number;
+        defaultColors?: {
+            stroke?: string;
+            fill?: string;
+            lineWidth?: number;
+            fontSize?: number;
+        };
+    };
+}
+declare const useBoardDrawing: ({ boardId, userId, userName, canvasRef, webSocketService, onObjectLocked, onObjectUnlocked, onUserJoined, onUserLeft, config, }: UseBoardDrawingProps) => {
+    tool: DrawingTool;
+    color: string;
+    fillColor: string;
+    lineWidth: number;
+    fontSize: number;
+    isDrawing: boolean;
+    selectedObjectId: string | null;
+    interactionMode: InteractionMode;
+    objects: BoardObject[];
+    usersOnline: {
+        id: number;
+        name: string;
+    }[];
+    isConnected: boolean;
+    editingTextId: string | null;
+    setTool: react.Dispatch<react.SetStateAction<DrawingTool>>;
+    setColor: react.Dispatch<react.SetStateAction<string>>;
+    setFillColor: react.Dispatch<react.SetStateAction<string>>;
+    setLineWidth: react.Dispatch<react.SetStateAction<number>>;
+    setFontSize: react.Dispatch<react.SetStateAction<number>>;
+    setSelectedObjectId: react.Dispatch<react.SetStateAction<string | null>>;
+    setEditingTextId: react.Dispatch<react.SetStateAction<string | null>>;
+    handleMouseDown: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    handleMouseMove: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    handleMouseUp: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    handleDoubleClick: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    deleteSelectedObject: () => void;
+    addImage: (imageUrl: string) => void;
+    updateObjectContent: (objectId: string, content: string) => void;
+    clearCanvas: () => void;
+    exportAsJSON: () => string;
+    importFromJSON: (json: string) => void;
+    redrawCanvas: () => void;
+};
+declare global {
+    interface CanvasRenderingContext2D {
+        roundRect(x: number, y: number, w: number, h: number, r: number): CanvasRenderingContext2D;
+    }
+}
+
+declare class NativeWebSocketAdapter extends BaseWebSocketAdapter {
+    private ws;
+    private url;
+    private reconnectAttempts;
+    private maxReconnectAttempts;
+    private reconnectTimeout;
+    constructor(url: string);
+    connect(boardId: string | number, userId: number, userName: string): void;
+    private attemptReconnect;
+    private handleMessage;
+    disconnect(): void;
+    private send;
+    createObject(object: BoardObject): void;
+    updateObject(object: BoardObject): void;
+    deleteObject(objectId: string): void;
+    lockObject(objectId: string): void;
+    unlockObject(objectId: string): void;
+}
+
+interface SocketIOAdapterConfig {
+    url: string;
+    path?: string;
+    transports?: string[];
+    reconnection?: boolean;
+    reconnectionAttempts?: number;
+    reconnectionDelay?: number;
+}
+declare class SocketIOBoardAdapter extends BaseWebSocketAdapter {
+    private socket;
+    private config;
+    constructor(config: SocketIOAdapterConfig);
+    connect(boardId: string | number, userId: number, userName: string): void;
+    disconnect(): void;
+    createObject(object: BoardObject): void;
+    updateObject(object: BoardObject): void;
+    deleteObject(objectId: string): void;
+    lockObject(objectId: string): void;
+    unlockObject(objectId: string): void;
+}
+
+declare const VERSION = "1.0.0";
+
+export { BaseWebSocketAdapter, BoardEventHandlers, BoardObject, BoardWebSocketService, CANVAS_HEIGHT, CANVAS_WIDTH, DrawingTool, InteractionMode, NativeWebSocketAdapter, ObjectType, Point, ResizeHandle, SocketIOAdapterConfig, SocketIOBoardAdapter, UseBoardDrawingProps, VERSION, canEditObject, clampObjectToCanvas, distanceToLine, generateObjectId, getObjectBoundingBox, isPointInObject, isPointInRotatedRectangle, resizeImageWithAspectRatio, resizeLineObject, resizeObjectFree, rotatePoint, useBoardDrawing };