@yorab/react-paint 0.17.1 → 0.18.1

package/dist/src/canvas/utils/file.d.ts

@@ -0,0 +1,274 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { DrawableShape, ExportedDrawableShape, Point, ShapeEntity } from './../../../common/types/Shapes';
+export declare const addSizeAndConvertSvgToObjectUrl: (svgFileContent: string) => string;
+export declare const isSvg: (fileOrUrl: File | string) => boolean;
+export declare const fetchAndStringify: (url: string) => Promise<string>;
+export declare const downloadFile: (content: string, fileName: string) => void;
+export declare const getBase64Image: (img: HTMLImageElement) => string;
+export declare const getStringifiedImage: (shape: DrawableShape<"picture">) => string;
+export declare const getCanvasImage: ({ shapes, settings, view }: {
+    shapes: ShapeEntity[];
+    settings: UtilsSettings;
+    view: "fitToShapes" | "defaultView" | "currentZoom";
+}) => string;
+export declare const encodeShapesInString: (shapes: ShapeEntity[], width: number, height: number) => string;
+export declare const decodeJson: (file: File) => Promise<unknown>;
+export declare const decodeImportedData: (shapesForJson: ExportedDrawableShape[], settings: UtilsSettings) => Promise<(({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Line & {
+    type: "line";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "line";
+    selection?: import("./../../../common/types/Shapes").SelectionLinesType | undefined;
+    arrows?: import("./../../../common/types/Shapes").TriangleEntity[];
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Rect & {
+    src: string;
+} & {
+    type: "picture";
+    img: HTMLImageElement;
+    flipX?: boolean;
+    flipY?: boolean;
+    ratio?: number;
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Rect & {
+    value: string[];
+    fontSize: number;
+} & {
+    type: "text";
+    flipX?: boolean;
+    flipY?: boolean;
+    ratio?: number;
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Rect & {
+    type: "rect";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Rect & {
+    type: "square";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Circle & {
+    type: "circle";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Ellipse & {
+    type: "ellipse";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Polygon & {
+    type: "polygon";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "polygon" | "curve";
+    selection?: import("./../../../common/types/Shapes").SelectionLinesType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Curve & {
+    type: "curve";
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "polygon" | "curve";
+    selection?: import("./../../../common/types/Shapes").SelectionLinesType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Brush & {
+    type: "brush";
+    scaleX?: number;
+    scaleY?: number;
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../../common/types/Shapes").Rect;
+        outerBorders: import("./../../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../../common/types/Shapes").Rect;
+    };
+    path: Path2D;
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../../common/types/Shapes").Rect & {
+    type: "group";
+    shapes: ShapeEntity[];
+} & {
+    type: "brush" | "rect" | "square" | "line" | "polygon" | "circle" | "curve" | "ellipse" | "picture" | "text" | "group";
+} & {
+    type: "text" | "picture" | "rect" | "square" | "circle" | "ellipse" | "group" | "brush";
+    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
+}))[]>;

package/dist/src/canvas/utils/grid.d.ts

@@ -0,0 +1,2 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+export declare const drawGrid: (ctx: CanvasRenderingContext2D, settings: UtilsSettings) => void;

package/dist/src/canvas/utils/intersect.d.ts

@@ -0,0 +1,27 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { CanvasSize } from './../../../common/types/Canvas';
+import type { HoverModeData } from './../../../common/types/Mode';
+import type { Point, Rect, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
+export declare const getCursorPosition: (e: MouseEvent | TouchEvent) => {
+    clientX: number;
+    clientY: number;
+};
+export declare const getCursorPositionInElement: (e: MouseEvent | TouchEvent, element: HTMLElement, canvasSize: CanvasSize) => Point;
+export declare const getCursorPositionInTransformedCanvas: (e: MouseEvent | TouchEvent, canvas: HTMLElement | null, settings: UtilsSettings) => Point;
+export declare const isTouchGesture: (e: MouseEvent | TouchEvent) => e is TouchEvent;
+export declare const getPointPositionAfterCanvasTransformation: (point: Point, shapeRotation: number, [originX, originY]: Point) => Point;
+export declare const getPointPositionBeforeCanvasTransformation: (point: Point, shapeRotation: number, [originX, originY]: Point) => Point;
+export declare const checkSelectionIntersection: (ctx: CanvasRenderingContext2D, selection: SelectionType, position: Point, settings: UtilsSettings, checkAnchors?: boolean, radius?: number) => false | HoverModeData;
+export declare const checkPolygonLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"polygon" | "curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
+    lineIndex: number;
+};
+export declare const checkCurveLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
+    lineIndex: number;
+};
+export declare const checkPositionIntersection: (ctx: CanvasRenderingContext2D, shape: SelectionType, position: Point, settings: UtilsSettings) => false | HoverModeData;
+export declare function getRectIntersection(rect1: Rect, rect2: Rect): Rect | undefined;
+export declare const checkSelectionFrameCollision: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, selectionFrame: [Point, Point]) => boolean;
+export declare const shouldCancelLongPress: (e: MouseEvent | TouchEvent, startPosition: {
+    clientX: number;
+    clientY: number;
+}) => boolean;

package/dist/src/canvas/utils/selection/groupSelection.d.ts

@@ -0,0 +1,4 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeData } from './../../../../common/types/Mode';
+import type { Point, ShapeEntity } from './../../../../common/types/Shapes';
+export declare const drawSelectionGroup: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"group">, selectionColor: string, selectionWidth: number, selectionMode: SelectionModeData<number | Point>, settings: UtilsSettings, withAnchors: boolean) => void;

package/dist/src/canvas/utils/selection/lineSelection.d.ts

@@ -0,0 +1,19 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { HoverModeData } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, SelectionLinesType, ShapeEntity } from './../../../../common/types/Shapes';
+export declare const createLineSelectionPath: (path: Path2D | undefined, shape: DrawableShape<"line" | "polygon" | "curve"> & {
+    points: readonly Point[];
+}, computed: {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+}, settings: UtilsSettings) => SelectionLinesType;
+export declare const drawLineSelection: ({ ctx, shape, withAnchors, selectionWidth, selectionColor, hoverMode, settings }: {
+    ctx: CanvasRenderingContext2D;
+    shape: ShapeEntity<"line"> | ShapeEntity<"polygon"> | ShapeEntity<"curve">;
+    withAnchors: boolean;
+    selectionWidth: number;
+    selectionColor: string;
+    hoverMode: HoverModeData;
+    settings: UtilsSettings;
+}) => void;

package/dist/src/canvas/utils/selection/rectSelection.d.ts

@@ -0,0 +1,20 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { Point, Rect, SelectionDefaultType, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+export declare const createRecSelectionPath: (path: Path2D | undefined, computed: {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+}, settings: UtilsSettings) => SelectionDefaultType;
+export declare const drawBoundingBox: (ctx: CanvasRenderingContext2D, shape: SelectionType, selectionWidth: number, settings: UtilsSettings) => void;
+export declare const drawSelectionRect: (ctx: CanvasRenderingContext2D, shape: ShapeEntity & {
+    selection?: SelectionDefaultType | undefined;
+}, selectionColor: string, selectionWidth: number, settings: UtilsSettings, withAnchors: boolean) => void;
+export declare const resizeRectSelection: (cursorPosition: Point, originalShape: ShapeEntity, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => {
+    borderX: number;
+    borderHeight: number;
+    borderY: number;
+    borderWidth: number;
+    isXinverted: boolean;
+    isYinverted: boolean;
+};

package/dist/src/canvas/utils/selection/selectionFrame.d.ts

@@ -0,0 +1,3 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { Point } from './../../../../common/types/Shapes';
+export declare const drawFrame: (ctx: CanvasRenderingContext2D, selectionFrame: [Point, Point], settings: UtilsSettings) => void;

package/dist/src/canvas/utils/selection.d.ts

@@ -0,0 +1,12 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { HoverModeData, SelectionModeData } from './../../../common/types/Mode';
+import type { Point, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
+export declare const getNewSelectionData: (hoverMode: HoverModeData, selectedShape: SelectionType, cursorPosition: Point) => SelectionModeData<Point | number> | undefined;
+export declare const selectShape: (ctx: CanvasRenderingContext2D, shapes: ShapeEntity[], cursorPosition: Point, settings: UtilsSettings, selectedShape: SelectionType | undefined, isTouchGesture: boolean, withFrameSelection: boolean, behavior?: "add" | "remove" | "replace") => {
+    mode: SelectionModeData<Point | number>;
+    shape: SelectionType | undefined;
+};
+export declare const buildShapesGroup: (shapes: ShapeEntity[], settings: UtilsSettings) => SelectionType | undefined;
+export declare const applyToSelectedShape: (applyToShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity, settings: UtilsSettings) => (selection: SelectionType | undefined) => SelectionType | undefined;
+export declare const addToSelectedShapes: (selection: SelectionType | undefined, shapes: ShapeEntity[]) => ShapeEntity[];
+export declare const omitFromSelectedShapes: (selection: SelectionType | undefined, shape: ShapeEntity) => ShapeEntity[];

package/dist/src/canvas/utils/shapes/brush.d.ts

@@ -0,0 +1,21 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+import { type GroupResizeContext } from './group';
+export declare const getBrushBorder: (brush: DrawableShape<"brush">, { selectionPadding }: Pick<UtilsSettings, "selectionPadding">) => Rect;
+export declare const refreshBrush: <T extends DrawableShape<"brush">>(brush: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"brush">;
+export declare const createBrush: (shape: {
+    id: string;
+    type: "brush";
+    settings: ToolsSettingsType<"brush">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;
+export declare const drawBrush: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"brush">) => void;
+export declare const resizeBrush: (cursorPosition: Point, originalShape: ShapeEntity<"brush">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean, resizeFromCenter: boolean) => ShapeEntity<"brush">;
+export declare const resizeBrushInGroup: (shape: ShapeEntity<"brush">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"brush">;
+export declare const addNewPointToShape: (shape: ShapeEntity<"brush">, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;
+export declare const addNewPointGroupToShape: (shape: ShapeEntity<"brush">, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;

package/dist/src/canvas/utils/shapes/circle.d.ts

@@ -0,0 +1,18 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+import { type GroupResizeContext } from './group';
+export declare const refreshCircle: <T extends DrawableShape<"circle">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"circle">;
+export declare const createCircle: (shape: {
+    id: string;
+    type: "circle";
+    settings: ToolsSettingsType<"circle">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"circle">;
+export declare const drawCircle: (ctx: CanvasRenderingContext2D, circle: ShapeEntity<"circle">) => void;
+export declare const resizeCircle: (cursorPosition: Point, originalShape: ShapeEntity<"circle">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => ShapeEntity<"circle">;
+export declare const resizeCircleInGroup: (shape: ShapeEntity<"circle">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"circle">;

package/dist/src/canvas/utils/shapes/curve.d.ts

@@ -0,0 +1,17 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, ShapeEntity } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+export declare const refreshCurve: <T extends DrawableShape<"curve">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"curve">;
+export declare const createCurve: (shape: {
+    id: string;
+    type: "curve";
+    settings: ToolsSettingsType<"curve">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"curve">;
+export declare const resizeCurve: (cursorPosition: Point, originalShape: ShapeEntity<"curve">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"curve">;
+export declare const drawCurve: (ctx: CanvasRenderingContext2D, curve: ShapeEntity<"curve">) => void;
+export declare const addCurveLine: (shape: ShapeEntity<"curve">, lineIndex: number, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"curve">;
+export declare const addCurvePoint: (shape: ShapeEntity<"curve">, cursorPosition: Point, settings: UtilsSettings, temporary?: boolean) => ShapeEntity<"curve">;
+export declare const removeCurvePoint: (shape: ShapeEntity<"curve">, pointIndex: number, settings: UtilsSettings) => ShapeEntity<"curve">;

package/dist/src/canvas/utils/shapes/ellipse.d.ts

@@ -0,0 +1,18 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+import { type GroupResizeContext } from './group';
+export declare const refreshEllipse: <T extends DrawableShape<"ellipse">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"ellipse">;
+export declare const createEllipse: (shape: {
+    id: string;
+    type: "ellipse";
+    settings: ToolsSettingsType<"ellipse">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"ellipse">;
+export declare const drawEllipse: (ctx: CanvasRenderingContext2D, ellipse: ShapeEntity<"ellipse">) => void;
+export declare const resizeEllipse: (cursorPosition: Point, originalShape: ShapeEntity<"ellipse">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => ShapeEntity<"ellipse">;
+export declare const resizeEllipseInGroup: (shape: ShapeEntity<"ellipse">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"ellipse">;

package/dist/src/canvas/utils/shapes/group.d.ts

@@ -0,0 +1,33 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { Point, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+/** Shared context when resizing shapes inside a group */
+export type GroupResizeContext = {
+    newBorderX: number;
+    newBorderY: number;
+    newBorderWidth: number;
+    newBorderHeight: number;
+    widthMultiplier: number;
+    heightMultiplier: number;
+    isXinverted: boolean;
+    isYinverted: boolean;
+    groupCenter: Point;
+    rotation: number;
+    settings: UtilsSettings;
+    originalBorders: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+};
+export declare const getGroupResizeContext: (cursorPosition: Point, group: SelectionType & {
+    type: "group";
+}, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean, isAltPressed: boolean) => GroupResizeContext;
+export declare const getShapePositionInNewBorder: (shape: ShapeEntity, group: SelectionType & {
+    type: "group";
+}, ctx: GroupResizeContext) => {
+    x: number;
+    y: number;
+};
+export declare const getPositionWithoutGroupRotation: (ctx: GroupResizeContext, positionInBorderX: number, positionInBorderY: number, sizeInBorderW: number, sizeInBorderH: number) => Point;

package/dist/src/canvas/utils/shapes/index.d.ts

@@ -0,0 +1,35 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { HoverModeData, SelectionModeData, SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+import type { CustomTool } from './../../../../common/types/tools';
+export declare const createShape: (ctx: CanvasRenderingContext2D, shape: Exclude<CustomTool, {
+    type: "picture";
+}>, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity | undefined;
+export declare const drawShape: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, settings: UtilsSettings, currentView?: Rect) => void;
+export declare const rotateShape: <T extends ShapeEntity>(shape: T, rotationToApply: number, selectionCenter: Point) => T;
+export declare const resizeShape: <T extends ShapeEntity>(ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: T, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => T;
+export declare const resizeShapes: (ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: SelectionType, selectionMode: SelectionModeResize<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => ShapeEntity[];
+export declare const flipShapes: (ctx: CanvasRenderingContext2D, shapes: ShapeEntity[], selectedShapes: ShapeEntity[], center: Point, action: "flipHorizontally" | "flipVertically", settings: UtilsSettings) => ShapeEntity[];
+export declare const translateShapes: (cursorPosition: Point, originalShape: SelectionType, originalCursorPosition: Point, settings: UtilsSettings, isShiftPressed: boolean) => ShapeEntity[];
+export declare const refreshShape: (shape: DrawableShape & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity;
+export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, hoverMode, selectionMode, withAnchors }: {
+    ctx: CanvasRenderingContext2D;
+    shape: SelectionType;
+    settings: UtilsSettings;
+    selectionWidth: number;
+    selectionColor: string;
+    hoverMode: HoverModeData;
+    selectionMode: SelectionModeData<number | Point>;
+    withAnchors?: boolean;
+}) => void;
+export declare const drawSelectionFrame: ({ ctx, selectionFrame, settings }: {
+    ctx: CanvasRenderingContext2D;
+    selectionFrame: {
+        oldSelection: SelectionType | undefined;
+        frame: [Point, Point];
+    };
+    settings: UtilsSettings;
+}) => void;
+export declare const copyShapes: (groupShape: SelectionType, settings: UtilsSettings) => ShapeEntity[];

package/dist/src/canvas/utils/shapes/line.d.ts

@@ -0,0 +1,19 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, SelectionType, ShapeEntity, StyleShape, Triangle } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+import { type GroupResizeContext } from './group';
+export declare const refreshLine: <T extends DrawableShape<"line">>(line: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"line">;
+export declare const createLine: (shape: {
+    id: string;
+    type: "line";
+    settings: ToolsSettingsType<"line">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"line">;
+export declare const buildTriangleOnLine: (center: Point, rotation: number, lineStyle: StyleShape) => Triangle;
+export declare const drawLine: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"line">) => void;
+export declare const resizeLine: (cursorPosition: Point, originalShape: ShapeEntity<"line">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"line">;
+export declare const resizeLinePolygonCurveInGroup: <T extends ShapeEntity<"line" | "polygon" | "curve">>(shape: T, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => T;

package/dist/src/canvas/utils/shapes/path.d.ts

@@ -0,0 +1,29 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { Circle, DrawableShape, Line, Point, Rect } from './../../../../common/types/Shapes';
+export declare const createRecPath: (rect: Rect) => Path2D;
+export declare const createCirclePath: (shape: Circle) => Path2D;
+export declare const createEllipsePath: (ellipse: DrawableShape<"ellipse">) => Path2D;
+export declare const createLinePath: (line: Line) => Path2D;
+export declare const createBrushPath: (brush: DrawableShape<"brush">, { brushAlgo }: UtilsSettings) => Path2D;
+/** Bounding box of a cubic Bezier segment B(t) = (1-t)³P0 + 3(1-t)²t P1 + 3(1-t)t² P2 + t³ P3 */
+export declare const getCubicBezierBounds: (p0: Point, p1: Point, p2: Point, p3: Point) => {
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+};
+export declare const getCatmullRomPoints: (curve: DrawableShape<"curve">, points: Point[]) => Point[];
+export declare const catmullRomToBezier: (p0: Point, p1: Point, p2: Point, p3: Point) => {
+    cp1: Point;
+    cp2: Point;
+};
+export declare const createCurvePath: (curve: DrawableShape<"curve">) => Path2D;
+export declare const createPolygonPath: (polygon: DrawableShape<"polygon"> | DrawableShape<"curve">) => Path2D;
+export declare const createTrianglePath: (triangle: DrawableShape<"triangle">) => Path2D;
+export declare const expandRect: (rect: Rect, selectionPadding: number) => Rect;
+export declare const getComputedShapeInfos: <T extends DrawableShape, U extends Pick<UtilsSettings, "selectionPadding">>(shape: T, getBorder: (shape: T, settings: U) => Rect, settings: U, getOuterBorder?: (shape: T, borders: Rect, settings: U) => Rect) => {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+    boundingBox: Rect;
+};

package/dist/src/canvas/utils/shapes/picture.d.ts

@@ -0,0 +1,13 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
+import { type GroupResizeContext } from './group';
+export declare const refreshPicture: <T extends DrawableShape<"picture">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"picture">;
+export declare const createPicture: (fileOrUrl: File | string, maxPictureWidth: number, maxPictureHeight: number, settings: UtilsSettings) => Promise<ShapeEntity<"picture">>;
+export declare const drawPicture: (ctx: CanvasRenderingContext2D, picture: ShapeEntity<"picture">) => void;
+export declare const resizePicture: (cursorPosition: Point, originalShape: ShapeEntity<"picture">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => ShapeEntity<"picture">;
+export declare const resizePictureInGroup: (shape: ShapeEntity<"picture">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"picture">;

package/dist/src/canvas/utils/shapes/polygon.d.ts

@@ -0,0 +1,18 @@
+import type { UtilsSettings } from './../../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../../common/types/Mode';
+import type { DrawableShape, Point, Polygon, Rect, ShapeEntity } from './../../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../../common/types/tools';
+export declare const refreshPolygon: <T extends DrawableShape<"polygon">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"polygon">;
+export declare const createPolygon: (shape: {
+    id: string;
+    type: "polygon";
+    settings: ToolsSettingsType<"polygon">;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"polygon">;
+export declare const drawPolygon: (ctx: CanvasRenderingContext2D, polygon: ShapeEntity<"polygon">) => void;
+export declare const getPolygonBorder: (polygon: Polygon, settings: Pick<UtilsSettings, "selectionPadding">) => Rect;
+export declare const resizePolygon: (cursorPosition: Point, originalShape: ShapeEntity<"polygon">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"polygon">;
+export declare const addPolygonLine: (shape: ShapeEntity<"polygon">, lineIndex: number, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"polygon">;
+export declare const addPolygonPoint: (shape: ShapeEntity<"polygon">, cursorPosition: Point, settings: UtilsSettings, temporary?: boolean) => ShapeEntity<"polygon">;
+export declare const removePolygonPoint: (shape: ShapeEntity<"polygon">, pointIndex: number, settings: UtilsSettings) => ShapeEntity<"polygon">;