@yorab/react-paint 0.10.0 → 0.11.0

package/dist/{utils → canvas/utils}/selection/rectSelection.d.ts

@@ -1,11 +1,11 @@
-import type { GridFormatType } from '../../constants/app';
-import type { SelectionModeResize } from '../../types/Mode';
-import type { DrawableShape, Point, SelectionDefaultType } from '../../types/Shapes';
-export declare const createRecSelectionPath: (path: Path2D | undefined, rect: DrawableShape, currentScale: number, selectionPadding: number) => SelectionDefaultType;
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Point, SelectionDefaultType } from './../../../common/types/Shapes';
+export declare const createRecSelectionPath: (path: Path2D | undefined, rect: DrawableShape, settings: UtilsSettings) => SelectionDefaultType;
 export declare const drawSelectionRect: (ctx: CanvasRenderingContext2D, shape: DrawableShape & {
     selection?: SelectionDefaultType;
-}, selectionColor: string, selectionWidth: number, currentScale: number, withAnchors: boolean) => void;
-export declare const resizeRectSelection: (cursorPosition: Point, originalShape: DrawableShape, selectionMode: SelectionModeResize, gridFormat: GridFormatType, selectionPadding: number, keepRatio?: boolean) => {
+}, selectionColor: string, selectionWidth: number, settings: UtilsSettings, withAnchors: boolean) => void;
+export declare const resizeRectSelection: (cursorPosition: Point, originalShape: DrawableShape, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean) => {
     borderX: number;
     borderHeight: number;
     borderY: number;

package/dist/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/canvas/utils/selection.d.ts

@@ -0,0 +1,8 @@
+import type { UtilsSettings } from './../../canvas/constants/app';
+import type { HoverModeData, SelectionModeData } from './../../common/types/Mode';
+import type { Point, ShapeEntity } from './../../common/types/Shapes';
+export declare const getNewSelectionData: (hoverMode: HoverModeData, selectedShape: ShapeEntity, cursorPosition: Point, settings: UtilsSettings) => SelectionModeData<Point | number> | undefined;
+export declare const selectShape: (ctx: CanvasRenderingContext2D, shapes: ShapeEntity[], cursorPosition: Point, settings: UtilsSettings, selectedShape: ShapeEntity | undefined, isTouchGesture: boolean, withFrameSelection: boolean) => {
+    mode: SelectionModeData<Point | number>;
+    shape: ShapeEntity | undefined;
+};

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

@@ -0,0 +1,20 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+export declare const refreshBrush: <T extends DrawableShape<"brush">>(brush: T, settings: UtilsSettings) => T;
+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: DrawableShape<'brush'>) => void;
+export declare const getBrushBorder: (brush: DrawableShape<'brush'>, { selectionPadding }: UtilsSettings) => Rect;
+export declare const translateBrush: <U extends DrawableShape<"brush">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    points: Point[][];
+};
+export declare const resizeBrush: (cursorPosition: Point, originalShape: DrawableShape<'brush'>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean) => DrawableShape<'brush'>;
+export declare const addNewPointToShape: <T extends DrawableShape<"brush">>(shape: T, cursorPosition: Point, settings: UtilsSettings) => T & {
+    points: Point[][];
+};
+export declare const addNewPointGroupToShape: <T extends DrawableShape<"brush">>(shape: T, cursorPosition: Point, settings: UtilsSettings) => T;

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

@@ -0,0 +1,17 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { Circle, DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+export declare const refreshCircle: <T extends DrawableShape<"circle">>(shape: T, settings: UtilsSettings) => T;
+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: DrawableShape<'circle'>) => void;
+export declare const getCircleBorder: (circle: Circle, settings: UtilsSettings) => Rect;
+export declare const translateCircle: <U extends DrawableShape<"circle">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    x: number;
+    y: number;
+};
+export declare const resizeCircle: (cursorPosition: Point, originalShape: DrawableShape<'circle'>, selectionMode: SelectionModeResize, settings: UtilsSettings) => DrawableShape<'circle'>;

package/dist/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, settings: UtilsSettings) => T;
+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: DrawableShape<'curve'>, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => DrawableShape<'curve'>;
+export declare const drawCurve: (ctx: CanvasRenderingContext2D, curve: DrawableShape<'curve'>) => void;
+export declare const getCurveBorder: (polygon: import("./../../../common/types/Shapes").Polygon, settings: UtilsSettings) => import("./../../../common/types/Shapes").Rect;
+export declare const translateCurve: <U extends DrawableShape<"curve">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    points: [number, number][];
+};
+export declare const updateCurveLinesCount: <T extends DrawableShape<"curve">>(shape: T, newPointsCount: number, settings: UtilsSettings) => T;

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

@@ -0,0 +1,17 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Ellipse, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+export declare const refreshEllipse: <T extends DrawableShape<"ellipse">>(shape: T, settings: UtilsSettings) => T;
+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: DrawableShape<'ellipse'>) => void;
+export declare const getEllipseBorder: (ellipse: Ellipse, settings: UtilsSettings) => Rect;
+export declare const translateEllipse: <U extends DrawableShape<"ellipse">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    x: number;
+    y: number;
+};
+export declare const resizeEllipse: (cursorPosition: Point, originalShape: DrawableShape<'ellipse'>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean) => DrawableShape<'ellipse'>;

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

@@ -0,0 +1,32 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeData } from './../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, 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;
+export declare const drawShape: (ctx: CanvasRenderingContext2D, shape: DrawableShape, settings: UtilsSettings) => void;
+export declare const getShapeInfos: (shape: DrawableShape, settings: UtilsSettings) => {
+    borders: Rect;
+    center: Point;
+};
+export declare const rotateShape: <T extends DrawableShape>(shape: T, cursorPosition: Point, originalShape: T, originalCursorPosition: Point, shapeCenter: Point, settings: UtilsSettings) => T & {
+    rotation: number;
+};
+export declare const resizeShape: <T extends DrawableShape>(ctx: CanvasRenderingContext2D, shape: T, cursorPosition: Point, originalShape: T, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean) => T;
+export declare const translateShape: (cursorPosition: Point, originalShape: ShapeEntity, originalCursorPosition: Point, settings: UtilsSettings) => ShapeEntity;
+export declare const refreshShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity;
+export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, withAnchors }: {
+    ctx: CanvasRenderingContext2D;
+    shape: DrawableShape;
+    settings: UtilsSettings;
+    selectionWidth: number;
+    selectionColor: string;
+    withAnchors?: boolean;
+}) => void;
+export declare const drawSelectionFrame: ({ ctx, selectionFrame, settings }: {
+    ctx: CanvasRenderingContext2D;
+    selectionFrame: [Point, Point];
+    settings: UtilsSettings;
+}) => void;
+export declare const copyShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity;

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

@@ -0,0 +1,17 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Line, Point, Rect, ShapeEntity, StyleShape, Triangle } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+export declare const refreshLine: <T extends DrawableShape<"line">>(line: T, settings: UtilsSettings) => T;
+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: DrawableShape<'line'>) => void;
+export declare const getLineBorder: (line: Line, settings: UtilsSettings) => Rect;
+export declare const translateLine: <U extends DrawableShape<"line">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    points: [Point, Point];
+};
+export declare const resizeLine: <U extends DrawableShape<"line">>(cursorPosition: Point, originalShape: U, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => U;

package/dist/{utils → canvas/utils}/shapes/path.d.ts

@@ -1,9 +1,10 @@
-import { Circle, DrawableShape, Line, Rect } from '../../types/Shapes';
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { Circle, DrawableShape, Line, 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'>, selectionPadding: number) => Path2D | undefined;
+export declare const createBrushPath: (brush: DrawableShape<'brush'>, settings: UtilsSettings) => Path2D | undefined;
 export declare const createCurvePath: (curve: DrawableShape<'curve'>) => Path2D | undefined;
 export declare const createPolygonPath: (polygon: DrawableShape<'polygon'>) => Path2D | undefined;
 export declare const createTrianglePath: (triangle: DrawableShape<'triangle'>) => Path2D;

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

@@ -0,0 +1,12 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Picture, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+export declare const refreshPicture: <T extends DrawableShape<"picture">>(shape: T, settings: UtilsSettings) => T;
+export declare const createPicture: (fileOrUrl: File | string, maxPictureWidth: number, maxPictureHeight: number, settings: UtilsSettings) => Promise<ShapeEntity<"picture">>;
+export declare const drawPicture: (ctx: CanvasRenderingContext2D, picture: DrawableShape<'picture'>) => void;
+export declare const getPictureBorder: (picture: Picture, settings: UtilsSettings) => Rect;
+export declare const translatePicture: <U extends DrawableShape<"picture">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    x: number;
+    y: number;
+};
+export declare const resizePicture: (cursorPosition: Point, originalShape: DrawableShape<'picture'>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean) => DrawableShape<'picture'>;

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

@@ -0,0 +1,17 @@
+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, settings: UtilsSettings) => T;
+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: DrawableShape<'polygon'>) => void;
+export declare const getPolygonBorder: (polygon: Polygon, settings: UtilsSettings) => Rect;
+export declare const translatePolygon: <U extends DrawableShape<"polygon">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    points: [number, number][];
+};
+export declare const resizePolygon: (cursorPosition: Point, originalShape: DrawableShape<'polygon'>, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => DrawableShape<'polygon'>;
+export declare const updatePolygonLinesCount: <T extends DrawableShape<"polygon">>(shape: T, newPointsCount: number, settings: UtilsSettings) => T;

package/dist/canvas/utils/shapes/rectangle.d.ts

@@ -0,0 +1,20 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+type rectish = 'text' | 'rect' | 'square' | 'picture';
+export declare const refreshRect: <T extends DrawableShape<rectish>>(rect: T, settings: UtilsSettings) => T;
+export declare const createRectangle: <T extends "rect" | "square">(shape: {
+    id: string;
+    type: T;
+    settings: ToolsSettingsType<T>;
+}, cursorPosition: Point, settings: UtilsSettings, width?: number, height?: number) => ShapeEntity<T>;
+export declare const drawRect: (ctx: CanvasRenderingContext2D, shape: DrawableShape<'rect' | 'square'>) => void;
+export declare const getRectBorder: (rect: Rect, settings: UtilsSettings) => Rect;
+export declare const getRectOppositeAnchorAbsolutePosition: <T extends DrawableShape & Rect>(anchor: Point, center: Point, shape: T, settings: UtilsSettings, [negW, negH]?: [boolean, boolean]) => Point;
+export declare const translateRect: <T extends "rect" | "square", U extends DrawableShape<T>>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
+    x: number;
+    y: number;
+};
+export declare const resizeRect: <T extends rectish>(cursorPosition: Point, originalShape: DrawableShape<T>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean) => DrawableShape<T>;
+export {};

package/dist/{utils → canvas/utils}/shapes/text.d.ts

@@ -1,19 +1,19 @@
-import { GridFormatType } from '../../constants/app';
-import { SelectionModeResize } from '../../types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity, Text } from '../../types/Shapes';
-import type { ToolsSettingsType } from '../../types/tools';
-export declare const refreshText: <T extends DrawableShape<"text">>(shape: T, currentScale: number, selectionPadding: number) => T;
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, ShapeEntity, Text } from './../../../common/types/Shapes';
+import type { ToolsSettingsType } from './../../../common/types/tools';
+export declare const refreshText: <T extends DrawableShape<"text">>(shape: T, settings: UtilsSettings) => T;
 export declare const calculateTextFontSize: (ctx: CanvasRenderingContext2D, text: string[], maxWidth: number, fontBold: boolean, fontItalic: boolean, fontFamily?: string | undefined) => number;
 export declare const createText: (ctx: CanvasRenderingContext2D, shape: {
     id: string;
     type: 'text';
     settings: ToolsSettingsType<'text'>;
-}, cursorPosition: Point, currentScale: number, selectionPadding: number) => ShapeEntity<'text'>;
+}, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<'text'>;
 export declare const drawText: (ctx: CanvasRenderingContext2D, text: DrawableShape<'text'>) => void;
-export declare const getTextBorder: (text: Text, selectionPadding: number) => Rect;
-export declare const translateText: <U extends DrawableShape<"text">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, gridFormat: GridFormatType, currentScale: number, selectionPadding: number) => U & {
+export declare const getTextBorder: (text: Text, settings: UtilsSettings) => Rect;
+export declare const translateText: <U extends DrawableShape<"text">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings) => U & {
     x: number;
     y: number;
 };
-export declare const resizeText: (ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: DrawableShape<'text'>, selectionMode: SelectionModeResize, gridFormat: GridFormatType, selectionPadding: number, currentScale: number) => DrawableShape<'text'>;
-export declare const resizeTextShapeWithNewContent: <U extends DrawableShape<"text">>(ctx: CanvasRenderingContext2D, shape: U, newValue: string[], selectionPadding: number, canvasOffset: Point) => U;
+export declare const resizeText: (ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: DrawableShape<'text'>, selectionMode: SelectionModeResize, settings: UtilsSettings) => DrawableShape<'text'>;
+export declare const resizeTextShapeWithNewContent: <U extends DrawableShape<"text">>(ctx: CanvasRenderingContext2D, shape: U, newValue: string[], settings: UtilsSettings) => U;

package/dist/{utils → canvas/utils}/shapes/triangle.d.ts

@@ -1,3 +1,3 @@
-import { DrawableShape, Triangle } from '../../types/Shapes';
+import type { DrawableShape, Triangle } from './../../../common/types/Shapes';
 export declare const createTriangle: (triangle: Triangle) => DrawableShape<'triangle'>;
 export declare const drawTriangle: (ctx: CanvasRenderingContext2D, triangle: DrawableShape<'triangle'>) => void;

package/dist/{utils → canvas/utils}/string.d.ts

@@ -1,3 +1,2 @@
 export declare const convertStringArrayToDivContent: (toConvert: string[]) => string;
-export declare const decodeHtmlEntities: (html: string) => string;
 export declare const convertDivContentToStringArray: (toConvert: string) => string[];

package/dist/canvas/utils/tools.d.ts

@@ -0,0 +1,3 @@
+import type { CustomTool, CustomToolInput } from './../../common/types/tools';
+import type { RecursivePartial } from './../../common/types/utils';
+export declare const sanitizeTools: (tools: RecursivePartial<CustomToolInput>[], withPicture?: boolean) => CustomTool[];

package/dist/{utils → canvas/utils}/transform.d.ts

@@ -1,12 +1,12 @@
-import type { GridFormatType } from '../constants/app';
-import type { SelectionModeData } from '../types/Mode';
-import type { DrawableShape, Line, Point, ShapeEntity } from '../types/Shapes';
+import type { UtilsSettings } from './../../canvas/constants/app';
+import type { SelectionModeData } from './../../common/types/Mode';
+import type { DrawableShape, Line, Point, ShapeEntity } from './../../common/types/Shapes';
 export declare const getNormalizedSize: (originalWidth: number, originalHeight: number, width: number, height: number) => number[];
 export declare const roundValues: (prop: number, precision?: number) => number;
 export declare const scalePoint: (point: Point, minX: number, minY: number, scaleX?: number, scaleY?: number) => Point;
-export declare const roundForGrid: (value: number, gridFormat: GridFormatType, gridOffset?: number) => number;
-export declare const roundRotationForGrid: (rotation: number, gridFormat: GridFormatType, gridOffset?: number) => number;
-export declare const transformShape: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, cursorPosition: Point, gridFormat: GridFormatType, canvasOffset: Point, selectionMode: SelectionModeData<Point | number>, selectionPadding: number, isShiftPressed: boolean, currentScale: number) => ShapeEntity;
+export declare const roundForGrid: (value: number, settings: UtilsSettings, gridOffset?: number) => number;
+export declare const roundRotationForGrid: (rotation: number, settings: UtilsSettings, gridOffset?: number) => number;
+export declare const transformShape: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, cursorPosition: Point, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean) => ShapeEntity;
 export declare const fitContentInsideContainer: (contentWidth: number, contentHeight: number, containerWidth: number, containerHeight: number, shouldFillContainer?: boolean) => number[];
 export declare const shortenLine: ({ line, size, direction }: {
     line: DrawableShape<'line'>;

package/dist/{utils → canvas/utils}/trigo.d.ts

@@ -1,17 +1,17 @@
-import { Circle, Point, Rect } from '../types/Shapes';
+import type { Circle, Point, Rect } from './../../common/types/Shapes';
 type Vector = [Point, Point];
 export declare const degreesToRadians: (degrees: number) => number;
 export declare const radiansToDegrees: (radians: number) => number;
 export declare const isPointInsideRect: (rect: Rect, point: Point) => boolean;
 export declare const isCircleIntersectRect: (rect: Rect, circle: Circle) => boolean;
 export declare const rotatePoint: ({ origin, point, rotation }: {
-    origin?: Point | undefined;
+    origin?: Point;
     point: Point;
     rotation: number;
 }) => Point;
 export declare const getAngleFromVector: ({ targetVector: [point1, point2], radian, originVector }: {
     targetVector: Vector;
-    radian?: boolean | undefined;
-    originVector?: Vector | undefined;
+    radian?: boolean;
+    originVector?: Vector;
 }) => number;
 export {};

package/dist/{types → common/types}/Shapes.d.ts

@@ -1,4 +1,4 @@
-import { ShapeTypeArray } from '../constants/shapes';
+import type { ShapeTypeArray } from '../../canvas/constants/shapes';
 export type ShapeType = (typeof ShapeTypeArray)[number];
 export type Point = [number, number];
 export type Rect = {
@@ -64,6 +64,7 @@ export type SelectionLinesType = {
     anchors: Path2D[];
 };
 export type DrawableShape<T extends ShapeType = ShapeType> = {
+    toolId?: string;
     visible?: boolean;
     locked?: boolean;
     rotation: number;
@@ -114,15 +115,12 @@ export type DrawableShape<T extends ShapeType = ShapeType> = {
     scaleX?: number;
     scaleY?: number;
 } : never);
-export type DrawableShapeJson<T extends ShapeType = ShapeType> = DrawableShape<T> & {
-    translation?: Point;
-};
 export type ShapeEntity<T extends Exclude<ShapeType, 'triangle'> = Exclude<ShapeType, 'triangle'>> = {
     id: string;
     toolId?: string;
 } & DrawableShape<T>;
-export type ExportDataType = {
-    shapes?: DrawableShapeJson[];
+export type StateData = {
+    shapes?: DrawableShape[];
     config?: {
         width: number;
         height: number;

package/dist/common/utils/array.d.ts

@@ -0,0 +1 @@
+export declare const compact: <T>(array: (T | undefined | null)[]) => T[];

package/dist/editor/components/common/Loading.d.ts

@@ -0,0 +1,6 @@
+import './Loading.css';
+export type LoadingType = {
+    isLoading: boolean;
+};
+declare const Loading: ({ isLoading }: LoadingType) => import("react/jsx-runtime").JSX.Element | null;
+export default Loading;

package/dist/{components → editor/components}/common/Modal.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import './Modal.css';
 type ModalType = {
     children: ReactNode;
@@ -6,5 +6,5 @@ type ModalType = {
     position?: 'center' | 'bottom';
     className?: string;
 };
-declare const Modal: ({ children, onClose, position, className }: ModalType) => React.JSX.Element;
+declare const Modal: ({ children, onClose, position, className }: ModalType) => import("react/jsx-runtime").JSX.Element;
 export default Modal;

package/dist/{components → editor/components}/common/Panel.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './Panel.css';
 type PanelType = {
     vertical?: boolean;
@@ -9,5 +9,5 @@ type PanelType = {
     position?: 'bottom' | 'top';
     alignment?: 'left' | 'right' | 'center';
 };
-declare const Panel: ({ children, title, className, position, fitContainer, alignment }: PanelType) => React.JSX.Element;
+declare const Panel: ({ children, title, className, position, fitContainer, alignment }: PanelType) => import("react/jsx-runtime").JSX.Element;
 export default Panel;

package/dist/{components → editor/components}/common/Snackbar.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
-import type { SnackBarType } from '../../types/snackbar';
+import type { SnackBarType } from './../../../editor/types/snackbar';
 import './Snackbar.css';
 type SnackbarContainerType = {
     snackbarList: SnackBarType[];
 };
-declare const SnackbarContainer: ({ snackbarList }: SnackbarContainerType) => React.JSX.Element;
+declare const SnackbarContainer: ({ snackbarList }: SnackbarContainerType) => import("react/jsx-runtime").JSX.Element;
 export default SnackbarContainer;

package/dist/{components → editor/components}/settings/ColorField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './ColorField.css';
 type ShapeStyleColorType = {
     selectedSettings: string | undefined;
@@ -11,5 +11,5 @@ type ShapeStyleColorType = {
     values: string[];
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const ColorField: ({ selectedSettings, setSelectedSettings, title, mode, disabled, values, field, value, valueChanged }: ShapeStyleColorType) => React.JSX.Element | null;
+declare const ColorField: ({ selectedSettings, setSelectedSettings, title, mode, disabled, values, field, value, valueChanged }: ShapeStyleColorType) => import("react/jsx-runtime").JSX.Element | null;
 export default ColorField;

package/dist/{components → editor/components}/settings/DeleteButton.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
-import type { ShapeEntity } from '../../types/Shapes';
+import type { ShapeEntity } from './../../../common/types/Shapes';
 type DeleteShapeButtonType = {
     disabled?: boolean;
     selectedShape: ShapeEntity;
     removeShape: (shape: ShapeEntity) => void;
 };
-declare const DeleteButton: ({ disabled, selectedShape, removeShape }: DeleteShapeButtonType) => React.JSX.Element;
+declare const DeleteButton: ({ disabled, selectedShape, removeShape }: DeleteShapeButtonType) => import("react/jsx-runtime").JSX.Element;
 export default DeleteButton;

package/dist/{components → editor/components}/settings/FontFamilyField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './FontFamilyField.css';
 type FontFamilyFieldType = {
     selectedSettings: string | undefined;
@@ -8,5 +8,5 @@ type FontFamilyFieldType = {
     defaultValue?: number | string | undefined;
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const FontFamilyField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: FontFamilyFieldType) => React.JSX.Element | null;
+declare const FontFamilyField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: FontFamilyFieldType) => import("react/jsx-runtime").JSX.Element | null;
 export default FontFamilyField;

package/dist/{components → editor/components}/settings/LayoutButton.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import './LayoutButton.css';
 type LayoutButtonType = {
     disabled: boolean;
     toggleLayoutPanel: () => void;
 };
-declare const LayoutButton: ({ disabled, toggleLayoutPanel }: LayoutButtonType) => React.JSX.Element;
+declare const LayoutButton: ({ disabled, toggleLayoutPanel }: LayoutButtonType) => import("react/jsx-runtime").JSX.Element;
 export default LayoutButton;

package/dist/{components → editor/components}/settings/Layouts.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
-import type { ShapeEntity } from '../../types/Shapes';
-import type { GridFormatType } from '../../constants/app';
+import type { ShapeEntity } from './../../../common/types/Shapes';
+import type { GridLabelType } from './../../../editor/constants/grid';
 import './Layouts.css';
 type LayoutsType = {
-    gridFormat: GridFormatType;
-    setGridFormat: React.Dispatch<React.SetStateAction<GridFormatType>>;
+    gridFormat: GridLabelType;
+    setGridFormat: (value: GridLabelType) => void;
     disabled?: boolean;
     shapes: ShapeEntity[];
     removeShape: (shape: ShapeEntity) => void;
@@ -15,5 +14,5 @@ type LayoutsType = {
     moveShapes: (firstShapeId: string, lastShapeId: string) => void;
     isLayoutPanelShown: boolean;
 };
-declare const Layouts: ({ gridFormat, setGridFormat, disabled, shapes, removeShape, toggleShapeVisibility, toggleShapeLock, selectedShape, moveShapes, selectShape, isLayoutPanelShown }: LayoutsType) => React.JSX.Element | null;
+declare const Layouts: ({ gridFormat, setGridFormat, disabled, shapes, removeShape, toggleShapeVisibility, toggleShapeLock, selectedShape, moveShapes, selectShape, isLayoutPanelShown }: LayoutsType) => import("react/jsx-runtime").JSX.Element | null;
 export default Layouts;

package/dist/{components → editor/components}/settings/LineArrowField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './LineArrowField.css';
 type LineArrowType = {
     selectedSettings: string | undefined;
@@ -8,5 +8,5 @@ type LineArrowType = {
     defaultValue?: number | string | undefined;
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const LineArrowField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: LineArrowType) => React.JSX.Element | null;
+declare const LineArrowField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: LineArrowType) => import("react/jsx-runtime").JSX.Element | null;
 export default LineArrowField;

package/dist/{components → editor/components}/settings/LineTypeField.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+import type React from 'react';
 import './LineTypeField.css';
 type LineTypeOptionType = {
     children: string;
 };
-export declare const LineTypeOption: ({ children }: LineTypeOptionType) => React.JSX.Element;
+export declare const LineTypeOption: ({ children }: LineTypeOptionType) => import("react/jsx-runtime").JSX.Element;
 type LineTypeType = {
     selectedSettings: string | undefined;
     setSelectedSettings: React.Dispatch<React.SetStateAction<string | undefined>>;
@@ -12,5 +12,5 @@ type LineTypeType = {
     defaultValue?: number | string | undefined;
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const LineTypeField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: LineTypeType) => React.JSX.Element | null;
+declare const LineTypeField: ({ selectedSettings, setSelectedSettings, disabled, values, defaultValue, valueChanged }: LineTypeType) => import("react/jsx-runtime").JSX.Element | null;
 export default LineTypeField;

package/dist/{components → editor/components}/settings/PointsNumberField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 type PointsNumberFieldType = {
     selectedSettings: string | undefined;
     setSelectedSettings: React.Dispatch<React.SetStateAction<string | undefined>>;
@@ -9,5 +9,5 @@ type PointsNumberFieldType = {
     value?: number | undefined;
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const PointsNumberField: ({ selectedSettings, setSelectedSettings, disabled, min, max, step, value, valueChanged }: PointsNumberFieldType) => React.JSX.Element | null;
+declare const PointsNumberField: ({ selectedSettings, setSelectedSettings, disabled, min, max, step, value, valueChanged }: PointsNumberFieldType) => import("react/jsx-runtime").JSX.Element | null;
 export default PointsNumberField;

package/dist/{components → editor/components}/settings/RangeField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './RangeField.css';
 type ShapeStyleColorType = {
     selectedSettings: string | undefined;
@@ -14,5 +14,5 @@ type ShapeStyleColorType = {
     value?: number | undefined;
     valueChanged: (field: string, value: string | number, needHistorySave?: boolean) => void;
 };
-declare const RangeField: ({ selectedSettings, setSelectedSettings, title, icon, disabled, field, value, min, max, step, unity, valueChanged }: ShapeStyleColorType) => React.JSX.Element | null;
+declare const RangeField: ({ selectedSettings, setSelectedSettings, title, icon, disabled, field, value, min, max, step, unity, valueChanged }: ShapeStyleColorType) => import("react/jsx-runtime").JSX.Element | null;
 export default RangeField;

package/dist/{components → editor/components}/settings/SelectField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import './SelectField.css';
 type SelectFieldType = {
     CustomOption: React.FC<{
@@ -14,5 +14,5 @@ type SelectFieldType = {
     defaultValue?: number | string | undefined;
     valueChanged: (field: string, value: string | number) => void;
 };
-declare const SelectField: ({ CustomOption, selectedSettings, setSelectedSettings, title, disabled, field, icon, values, defaultValue, valueChanged }: SelectFieldType) => React.JSX.Element | null;
+declare const SelectField: ({ CustomOption, selectedSettings, setSelectedSettings, title, disabled, field, icon, values, defaultValue, valueChanged }: SelectFieldType) => import("react/jsx-runtime").JSX.Element | null;
 export default SelectField;

package/dist/{components → editor/components}/settings/SettingsBar.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import type { ShapeEntity } from '../../types/Shapes';
-import type { CustomTool, ToolsType } from '../../types/tools';
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { ShapeEntity } from './../../../common/types/Shapes';
+import type { CustomTool, ToolsType } from './../../../common/types/tools';
 import './SettingsBar.css';
 type SettingsBoxType = {
     width: number;
@@ -11,11 +11,10 @@ type SettingsBoxType = {
     activeTool: ToolsType;
     selectedShape: ShapeEntity | undefined;
     canvas: HTMLCanvasElement | null;
-    currentScale: number;
-    selectionPadding: number;
+    settings: UtilsSettings;
     updateShape: (shape: ShapeEntity, withSave?: boolean) => void;
     removeShape: (shape: ShapeEntity) => void;
     toggleLayoutPanel: () => void;
 };
-declare const SettingsBar: ({ width, disabled, availableTools, updateToolSettings, layersManipulation, toggleLayoutPanel, activeTool, selectedShape, canvas, currentScale, selectionPadding, updateShape, removeShape }: SettingsBoxType) => React.JSX.Element;
+declare const SettingsBar: ({ width, disabled, availableTools, updateToolSettings, layersManipulation, toggleLayoutPanel, activeTool, selectedShape, canvas, settings, updateShape, removeShape }: SettingsBoxType) => import("react/jsx-runtime").JSX.Element;
 export default SettingsBar;

package/dist/{components → editor/components}/settings/ToggleField.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 type ShapeStyleSelectType = {
     setSelectedSettings: React.Dispatch<React.SetStateAction<string | undefined>>;
     disabled?: boolean;
@@ -8,5 +8,5 @@ type ShapeStyleSelectType = {
     value?: boolean;
     valueChanged: (field: string, value: boolean) => void;
 };
-declare const ToggleField: ({ setSelectedSettings, disabled, field, icon, values, value, valueChanged }: ShapeStyleSelectType) => React.JSX.Element | null;
+declare const ToggleField: ({ setSelectedSettings, disabled, field, icon, values, value, valueChanged }: ShapeStyleSelectType) => import("react/jsx-runtime").JSX.Element | null;
 export default ToggleField;