@yorab/react-paint 0.18.1 → 1.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (247) hide show
  1. package/README.md +266 -22
  2. package/dist/_chunks/canvas-CDYlr833.js +1 -0
  3. package/dist/_chunks/editor-BARYd5Od.js +1 -0
  4. package/dist/canvas/components/Canvas.d.ts +15 -3
  5. package/dist/canvas/components/EditTextBox.d.ts +4 -4
  6. package/dist/canvas/constants/app.d.ts +32 -17
  7. package/dist/canvas/constants/grid.d.ts +7 -0
  8. package/dist/canvas/constants/picture.d.ts +8 -0
  9. package/dist/canvas/constants/shapes.d.ts +2 -2
  10. package/dist/canvas/constants/tools.d.ts +12 -2
  11. package/dist/canvas/constants/zoom.d.ts +4 -2
  12. package/dist/canvas/context/PaintContext.d.ts +9 -0
  13. package/dist/canvas/hooks/useAnnotationsStyle.d.ts +5 -0
  14. package/dist/canvas/hooks/useAutoScroll.d.ts +4 -0
  15. package/dist/canvas/hooks/useCanvasRenderer.d.ts +17 -0
  16. package/dist/canvas/hooks/useDrawableCanvas.d.ts +8 -5
  17. package/dist/canvas/hooks/useDropPicture.d.ts +7 -0
  18. package/dist/canvas/hooks/useKeyboard.d.ts +6 -32
  19. package/dist/canvas/hooks/usePaintState.d.ts +9 -0
  20. package/dist/canvas/hooks/usePinchZoomAndMove.d.ts +3 -13
  21. package/dist/canvas/hooks/useReactPaint.d.ts +11 -163
  22. package/dist/canvas/hooks/useResizeObserver.d.ts +1 -0
  23. package/dist/canvas/hooks/useShapeEvents.d.ts +7 -0
  24. package/dist/canvas/hooks/useZoom.d.ts +4 -17
  25. package/dist/canvas/index.d.ts +24 -17
  26. package/dist/canvas/index.js +1 -1
  27. package/dist/canvas/store/createStore.d.ts +14 -0
  28. package/dist/canvas/store/eventEmitter.d.ts +11 -0
  29. package/dist/canvas/store/internal.d.ts +5 -0
  30. package/dist/canvas/store/paintStore.d.ts +898 -0
  31. package/dist/canvas/store/selectors.d.ts +855 -0
  32. package/dist/canvas/store/shapesReducer.d.ts +66 -0
  33. package/dist/canvas/store/types.d.ts +72 -0
  34. package/dist/canvas/types/Canvas.d.ts +19 -0
  35. package/dist/{src/common → canvas}/types/Mode.d.ts +8 -15
  36. package/dist/{common → canvas}/types/Settings.d.ts +6 -1
  37. package/dist/{common → canvas}/types/Shapes.d.ts +27 -21
  38. package/dist/canvas/types/editor.d.ts +388 -0
  39. package/dist/{common → canvas}/types/tools.d.ts +10 -6
  40. package/dist/{common → canvas}/utils/array.d.ts +2 -0
  41. package/dist/canvas/utils/canvas.d.ts +18 -2
  42. package/dist/canvas/utils/click.d.ts +17 -0
  43. package/dist/canvas/utils/data.d.ts +6 -5
  44. package/dist/canvas/utils/equality.d.ts +5 -0
  45. package/dist/canvas/utils/file.d.ts +36 -266
  46. package/dist/canvas/utils/grid.d.ts +1 -1
  47. package/dist/canvas/utils/intersect.d.ts +24 -14
  48. package/dist/canvas/utils/object.d.ts +11 -0
  49. package/dist/{src/common/utils/selection.d.ts → canvas/utils/selectedShapes.d.ts} +2 -2
  50. package/dist/canvas/utils/selection/anchors.d.ts +16 -0
  51. package/dist/canvas/utils/selection/groupSelection.d.ts +3 -3
  52. package/dist/canvas/utils/selection/lineSelection.d.ts +3 -10
  53. package/dist/canvas/utils/selection/rectSelection.d.ts +6 -11
  54. package/dist/canvas/utils/selection/selectionFrame.d.ts +2 -2
  55. package/dist/canvas/utils/selection.d.ts +7 -5
  56. package/dist/canvas/utils/shapeInput.d.ts +45 -0
  57. package/dist/canvas/utils/shapePatch.d.ts +10 -0
  58. package/dist/canvas/utils/shapes/brush.d.ts +6 -6
  59. package/dist/canvas/utils/shapes/circle.d.ts +5 -5
  60. package/dist/canvas/utils/shapes/curve.d.ts +4 -4
  61. package/dist/canvas/utils/shapes/ellipse.d.ts +5 -5
  62. package/dist/canvas/utils/shapes/group.d.ts +9 -3
  63. package/dist/canvas/utils/shapes/index.d.ts +31 -5
  64. package/dist/canvas/utils/shapes/line.d.ts +5 -5
  65. package/dist/canvas/utils/shapes/path.d.ts +16 -8
  66. package/dist/canvas/utils/shapes/picture.d.ts +7 -5
  67. package/dist/canvas/utils/shapes/polygon.d.ts +4 -4
  68. package/dist/canvas/utils/shapes/rectangle.d.ts +5 -5
  69. package/dist/canvas/utils/shapes/text.d.ts +12 -6
  70. package/dist/canvas/utils/shapes/triangle.d.ts +2 -2
  71. package/dist/canvas/utils/tools.d.ts +12 -3
  72. package/dist/canvas/utils/transform.d.ts +5 -4
  73. package/dist/canvas/utils/trigo.d.ts +17 -1
  74. package/dist/canvas/utils/util.d.ts +14 -0
  75. package/dist/canvas/utils/zoom.d.ts +29 -15
  76. package/dist/editor/components/common/Button.d.ts +0 -1
  77. package/dist/editor/components/common/FileInput.d.ts +0 -1
  78. package/dist/editor/components/common/Loading.d.ts +1 -2
  79. package/dist/editor/components/common/Menu.d.ts +3 -2
  80. package/dist/editor/components/common/Modal.d.ts +1 -2
  81. package/dist/editor/components/common/Panel.d.ts +1 -2
  82. package/dist/editor/components/common/Snackbar.d.ts +2 -3
  83. package/dist/editor/components/settings/ClosedPointsField.d.ts +1 -1
  84. package/dist/editor/components/settings/ColorField.d.ts +1 -2
  85. package/dist/editor/components/settings/DeleteButton.d.ts +3 -4
  86. package/dist/editor/components/settings/FontFamilyField.d.ts +1 -2
  87. package/dist/editor/components/settings/LayoutButton.d.ts +1 -2
  88. package/dist/editor/components/settings/Layouts.d.ts +4 -15
  89. package/dist/editor/components/settings/LineArrowField.d.ts +1 -2
  90. package/dist/editor/components/settings/LineTypeField.d.ts +2 -3
  91. package/dist/editor/components/settings/RangeField.d.ts +1 -2
  92. package/dist/editor/components/settings/SelectField.d.ts +1 -2
  93. package/dist/editor/components/settings/SettingsBar.d.ts +3 -18
  94. package/dist/editor/components/settings/ToggleField.d.ts +2 -1
  95. package/dist/editor/components/settings/ZoomButton.d.ts +1 -2
  96. package/dist/editor/components/settings/ZoomPanel.d.ts +4 -0
  97. package/dist/editor/components/toolbox/ActionButton.d.ts +9 -0
  98. package/dist/editor/components/toolbox/ContextMenu.d.ts +5 -24
  99. package/dist/editor/components/toolbox/ExportModal.d.ts +1 -2
  100. package/dist/editor/components/toolbox/LoadFileTool.d.ts +4 -4
  101. package/dist/editor/components/toolbox/MenuGroup.d.ts +1 -7
  102. package/dist/editor/components/toolbox/PictureUrlInput.d.ts +2 -2
  103. package/dist/editor/components/toolbox/Tool.d.ts +3 -3
  104. package/dist/editor/components/toolbox/Toolbar.d.ts +5 -16
  105. package/dist/editor/components/toolbox/ToolbarGroup.d.ts +2 -3
  106. package/dist/editor/constants/options.d.ts +11 -1
  107. package/dist/editor/constants/snackbar.d.ts +1 -1
  108. package/dist/editor/constants/style.d.ts +0 -9
  109. package/dist/editor/constants/tools.d.ts +12 -32
  110. package/dist/editor/editor.css +1 -0
  111. package/dist/editor/hooks/useDrag.d.ts +3 -3
  112. package/dist/editor/hooks/useMenu.d.ts +3 -2
  113. package/dist/editor/hooks/usePressOutside.d.ts +7 -0
  114. package/dist/editor/hooks/useSnackbar.d.ts +1 -1
  115. package/dist/editor/index.d.ts +12 -22
  116. package/dist/editor/index.js +1 -1
  117. package/dist/editor/types/tools.d.ts +7 -0
  118. package/dist/editor/utils/dom.d.ts +1 -0
  119. package/dist/editor/utils/style.d.ts +7 -1
  120. package/dist/editor/utils/toolbar.d.ts +1 -2
  121. package/dist/editor/utils/util.d.ts +5 -0
  122. package/dist/index.d.ts +2 -5
  123. package/dist/react-paint.css +1 -1
  124. package/dist/react-paint.js +1 -1
  125. package/dist/react-paint.umd.cjs +1 -1
  126. package/package.json +37 -26
  127. package/dist/_chunks/array-DuJem3vg.js +0 -1
  128. package/dist/_chunks/canvas-DF1RWuxW.js +0 -1
  129. package/dist/_chunks/editor-DuVskl0R.js +0 -1
  130. package/dist/canvas/context/CanvasContext.d.ts +0 -55
  131. package/dist/canvas/hooks/useComponent.d.ts +0 -12
  132. package/dist/canvas/hooks/useDoubleClick.d.ts +0 -5
  133. package/dist/canvas/hooks/useEventListener.d.ts +0 -2
  134. package/dist/canvas/hooks/useShapes.d.ts +0 -44
  135. package/dist/common/hooks/useDebounce.d.ts +0 -2
  136. package/dist/common/types/Canvas.d.ts +0 -8
  137. package/dist/common/types/Mode.d.ts +0 -64
  138. package/dist/common/types/react.d.ts +0 -6
  139. package/dist/common/utils/dom.d.ts +0 -1
  140. package/dist/common/utils/object.d.ts +0 -4
  141. package/dist/common/utils/selection.d.ts +0 -4
  142. package/dist/common/utils/util.d.ts +0 -3
  143. package/dist/editor/constants/grid.d.ts +0 -7
  144. package/dist/src/canvas/components/Canvas.d.ts +0 -4
  145. package/dist/src/canvas/components/EditTextBox.d.ts +0 -13
  146. package/dist/src/canvas/constants/app.d.ts +0 -37
  147. package/dist/src/canvas/constants/grid.d.ts +0 -1
  148. package/dist/src/canvas/constants/keyboard.d.ts +0 -27
  149. package/dist/src/canvas/constants/picture.d.ts +0 -1
  150. package/dist/src/canvas/constants/rendering.d.ts +0 -3
  151. package/dist/src/canvas/constants/shapes.d.ts +0 -10
  152. package/dist/src/canvas/constants/tools.d.ts +0 -4
  153. package/dist/src/canvas/constants/zoom.d.ts +0 -5
  154. package/dist/src/canvas/context/CanvasContext.d.ts +0 -55
  155. package/dist/src/canvas/hooks/useComponent.d.ts +0 -12
  156. package/dist/src/canvas/hooks/useDoubleClick.d.ts +0 -5
  157. package/dist/src/canvas/hooks/useDrawableCanvas.d.ts +0 -6
  158. package/dist/src/canvas/hooks/useEventListener.d.ts +0 -2
  159. package/dist/src/canvas/hooks/useKeyboard.d.ts +0 -33
  160. package/dist/src/canvas/hooks/usePinchZoomAndMove.d.ts +0 -17
  161. package/dist/src/canvas/hooks/useReactPaint.d.ts +0 -164
  162. package/dist/src/canvas/hooks/useResizeObserver.d.ts +0 -6
  163. package/dist/src/canvas/hooks/useShapes.d.ts +0 -44
  164. package/dist/src/canvas/hooks/useZoom.d.ts +0 -22
  165. package/dist/src/canvas/index.d.ts +0 -19
  166. package/dist/src/canvas/utils/canvas.d.ts +0 -15
  167. package/dist/src/canvas/utils/data.d.ts +0 -5
  168. package/dist/src/canvas/utils/file.d.ts +0 -274
  169. package/dist/src/canvas/utils/grid.d.ts +0 -2
  170. package/dist/src/canvas/utils/intersect.d.ts +0 -27
  171. package/dist/src/canvas/utils/selection/groupSelection.d.ts +0 -4
  172. package/dist/src/canvas/utils/selection/lineSelection.d.ts +0 -19
  173. package/dist/src/canvas/utils/selection/rectSelection.d.ts +0 -20
  174. package/dist/src/canvas/utils/selection/selectionFrame.d.ts +0 -3
  175. package/dist/src/canvas/utils/selection.d.ts +0 -12
  176. package/dist/src/canvas/utils/shapes/brush.d.ts +0 -21
  177. package/dist/src/canvas/utils/shapes/circle.d.ts +0 -18
  178. package/dist/src/canvas/utils/shapes/curve.d.ts +0 -17
  179. package/dist/src/canvas/utils/shapes/ellipse.d.ts +0 -18
  180. package/dist/src/canvas/utils/shapes/group.d.ts +0 -33
  181. package/dist/src/canvas/utils/shapes/index.d.ts +0 -35
  182. package/dist/src/canvas/utils/shapes/line.d.ts +0 -19
  183. package/dist/src/canvas/utils/shapes/path.d.ts +0 -29
  184. package/dist/src/canvas/utils/shapes/picture.d.ts +0 -13
  185. package/dist/src/canvas/utils/shapes/polygon.d.ts +0 -18
  186. package/dist/src/canvas/utils/shapes/rectangle.d.ts +0 -22
  187. package/dist/src/canvas/utils/shapes/text.d.ts +0 -27
  188. package/dist/src/canvas/utils/shapes/triangle.d.ts +0 -4
  189. package/dist/src/canvas/utils/transform.d.ts +0 -15
  190. package/dist/src/canvas/utils/trigo.d.ts +0 -19
  191. package/dist/src/canvas/utils/zoom.d.ts +0 -58
  192. package/dist/src/common/hooks/useDebounce.d.ts +0 -2
  193. package/dist/src/common/types/Canvas.d.ts +0 -8
  194. package/dist/src/common/types/Settings.d.ts +0 -24
  195. package/dist/src/common/types/Shapes.d.ts +0 -153
  196. package/dist/src/common/types/react.d.ts +0 -6
  197. package/dist/src/common/types/tools.d.ts +0 -164
  198. package/dist/src/common/types/utils.d.ts +0 -4
  199. package/dist/src/common/utils/array.d.ts +0 -2
  200. package/dist/src/common/utils/dom.d.ts +0 -1
  201. package/dist/src/common/utils/object.d.ts +0 -4
  202. package/dist/src/common/utils/util.d.ts +0 -3
  203. package/dist/src/editor/components/common/Button.d.ts +0 -16
  204. package/dist/src/editor/components/common/FileInput.d.ts +0 -13
  205. package/dist/src/editor/components/common/Loading.d.ts +0 -6
  206. package/dist/src/editor/components/common/Menu.d.ts +0 -10
  207. package/dist/src/editor/components/common/Modal.d.ts +0 -11
  208. package/dist/src/editor/components/common/Panel.d.ts +0 -15
  209. package/dist/src/editor/components/common/Snackbar.d.ts +0 -7
  210. package/dist/src/editor/components/settings/ClosedPointsField.d.ts +0 -10
  211. package/dist/src/editor/components/settings/ColorField.d.ts +0 -15
  212. package/dist/src/editor/components/settings/DeleteButton.d.ts +0 -8
  213. package/dist/src/editor/components/settings/FontFamilyField.d.ts +0 -12
  214. package/dist/src/editor/components/settings/LayoutButton.d.ts +0 -7
  215. package/dist/src/editor/components/settings/Layouts.d.ts +0 -19
  216. package/dist/src/editor/components/settings/LineArrowField.d.ts +0 -12
  217. package/dist/src/editor/components/settings/LineTypeField.d.ts +0 -16
  218. package/dist/src/editor/components/settings/RangeField.d.ts +0 -19
  219. package/dist/src/editor/components/settings/SelectField.d.ts +0 -18
  220. package/dist/src/editor/components/settings/SettingsBar.d.ts +0 -26
  221. package/dist/src/editor/components/settings/ToggleField.d.ts +0 -13
  222. package/dist/src/editor/components/settings/ZoomButton.d.ts +0 -8
  223. package/dist/src/editor/components/toolbox/ContextMenu.d.ts +0 -25
  224. package/dist/src/editor/components/toolbox/ExportModal.d.ts +0 -7
  225. package/dist/src/editor/components/toolbox/LoadFileTool.d.ts +0 -11
  226. package/dist/src/editor/components/toolbox/MenuGroup.d.ts +0 -27
  227. package/dist/src/editor/components/toolbox/PictureUrlInput.d.ts +0 -7
  228. package/dist/src/editor/components/toolbox/Tool.d.ts +0 -11
  229. package/dist/src/editor/components/toolbox/Toolbar.d.ts +0 -26
  230. package/dist/src/editor/components/toolbox/ToolbarGroup.d.ts +0 -14
  231. package/dist/src/editor/constants/grid.d.ts +0 -7
  232. package/dist/src/editor/constants/icons.d.ts +0 -43
  233. package/dist/src/editor/constants/loading.d.ts +0 -1
  234. package/dist/src/editor/constants/options.d.ts +0 -13
  235. package/dist/src/editor/constants/snackbar.d.ts +0 -7
  236. package/dist/src/editor/constants/style.d.ts +0 -14
  237. package/dist/src/editor/constants/tools.d.ts +0 -32
  238. package/dist/src/editor/hooks/useDrag.d.ts +0 -15
  239. package/dist/src/editor/hooks/useMenu.d.ts +0 -11
  240. package/dist/src/editor/hooks/useSnackbar.d.ts +0 -10
  241. package/dist/src/editor/index.d.ts +0 -25
  242. package/dist/src/editor/types/snackbar.d.ts +0 -7
  243. package/dist/src/editor/utils/style.d.ts +0 -2
  244. package/dist/src/editor/utils/toolbar.d.ts +0 -11
  245. package/dist/src/index.d.ts +0 -5
  246. /package/dist/{common → canvas}/types/utils.d.ts +0 -0
  247. /package/dist/{canvas → editor}/hooks/useDebounce.d.ts +0 -0
@@ -1,22 +0,0 @@
1
- import type { UtilsSettings } from './../../../../canvas/constants/app';
2
- import type { SelectionModeResize } from './../../../../common/types/Mode';
3
- import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../../common/types/Shapes';
4
- import type { ToolsSettingsType } from './../../../../common/types/tools';
5
- import { type GroupResizeContext } from './group';
6
- type rectish = 'rect' | 'square';
7
- export declare const refreshRect: <T extends rectish>(rect: DrawableShape<rectish> & {
8
- id: string;
9
- }, settings: UtilsSettings) => ShapeEntity<T>;
10
- export declare const createRectangle: <T extends rectish>(shape: {
11
- id: string;
12
- type: T;
13
- settings: ToolsSettingsType<T>;
14
- }, cursorPosition: Point, settings: UtilsSettings, width?: number, height?: number) => ShapeEntity<T>;
15
- export declare const drawRect: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<rectish>) => void;
16
- export declare const getRectBorder: (rect: Rect, settings: Pick<UtilsSettings, "selectionPadding">) => Rect;
17
- export declare const getRectOppositeAnchorAbsolutePosition: <T extends DrawableShape & Rect>(anchor: Point, center: Point, shape: T, [negW, negH]?: [boolean, boolean]) => Point;
18
- export declare const resizeRect: <T extends rectish>(cursorPosition: Point, originalShape: ShapeEntity<T>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => ShapeEntity<T>;
19
- export declare const resizeRectInGroup: (shape: ShapeEntity<rectish>, group: SelectionType & {
20
- type: "group";
21
- }, groupCtx: GroupResizeContext) => ShapeEntity<rectish>;
22
- export {};
@@ -1,27 +0,0 @@
1
- import type { UtilsSettings } from './../../../../canvas/constants/app';
2
- import type { SelectionModeResize } from './../../../../common/types/Mode';
3
- import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity, Text } from './../../../../common/types/Shapes';
4
- import type { ToolsSettingsType } from './../../../../common/types/tools';
5
- import { type GroupResizeContext } from './group';
6
- export declare const getComputedText: (text: DrawableShape<"text">, settings: UtilsSettings) => {
7
- borders: Rect;
8
- outerBorders: Rect;
9
- center: Point;
10
- boundingBox: Rect;
11
- };
12
- export declare const refreshText: <T extends DrawableShape<"text">>(shape: T & {
13
- id: string;
14
- }, settings: UtilsSettings) => ShapeEntity<"text">;
15
- export declare const calculateTextFontSize: (ctx: CanvasRenderingContext2D, text: string[], maxWidth: number, fontBold: boolean, fontItalic: boolean, fontFamily?: string | undefined) => number;
16
- export declare const createText: (ctx: CanvasRenderingContext2D, shape: {
17
- id: string;
18
- type: "text";
19
- settings: ToolsSettingsType<"text">;
20
- }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"text">;
21
- export declare const drawText: (ctx: CanvasRenderingContext2D, text: DrawableShape<"text">) => void;
22
- export declare const getTextBorder: (text: Text, settings: Pick<UtilsSettings, "selectionPadding">) => Rect;
23
- export declare const resizeText: (ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: ShapeEntity<"text">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => ShapeEntity<"text">;
24
- export declare const resizeTextInGroup: (canvasCtx: CanvasRenderingContext2D, shape: ShapeEntity<"text">, group: SelectionType & {
25
- type: "group";
26
- }, groupCtx: GroupResizeContext) => ShapeEntity<"text">;
27
- export declare const resizeTextShapeWithNewContent: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"text">, newValue: string[], settings: UtilsSettings) => ShapeEntity<"text">;
@@ -1,4 +0,0 @@
1
- import type { UtilsSettings } from './../../../../canvas/constants/app';
2
- import type { Triangle, TriangleEntity } from './../../../../common/types/Shapes';
3
- export declare const createTriangle: (triangle: Triangle, settings: UtilsSettings) => TriangleEntity;
4
- export declare const drawTriangle: (ctx: CanvasRenderingContext2D, triangle: TriangleEntity) => void;
@@ -1,15 +0,0 @@
1
- import type { UtilsSettings } from './../../../canvas/constants/app';
2
- import type { SelectionModeData } from './../../../common/types/Mode';
3
- import type { DrawableShape, Line, Point, SelectionType } from './../../../common/types/Shapes';
4
- export declare const roundValues: (prop: number, precision?: number) => number;
5
- export declare const scalePoint: (point: Point, minX: number, minY: number, scaleX?: number, scaleY?: number) => Point;
6
- export declare const roundForGrid: (value: number, settings: UtilsSettings, gridOffset?: number) => number;
7
- export declare const roundRotationForGrid: (rotation: number, settings: UtilsSettings, isShiftPressed: boolean) => number;
8
- export declare const boundVectorToSingleAxis: (vector: Point, isShiftPressed: boolean) => Point;
9
- export declare const transformShape: (ctx: CanvasRenderingContext2D, selectedShape: SelectionType, cursorPosition: Point, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => SelectionType;
10
- export declare const fitContentInsideContainer: (contentWidth: number, contentHeight: number, containerWidth: number, containerHeight: number, shouldFillContainer?: boolean) => Point;
11
- export declare const shortenLine: ({ line, size, direction }: {
12
- line: DrawableShape<"line">;
13
- size: number;
14
- direction: "start" | "end" | "both";
15
- }) => Line;
@@ -1,19 +0,0 @@
1
- import type { Circle, Point, Rect } from './../../../common/types/Shapes';
2
- type Vector = [Point, Point];
3
- export declare const degreesToRadians: (degrees: number) => number;
4
- export declare const radiansToDegrees: (radians: number) => number;
5
- export declare const isPointInsideRect: (rect: Rect, point: Point) => boolean;
6
- export declare const isCircleIntersectRect: (rect: Rect, circle: Circle) => boolean;
7
- export declare const rotatePoint: ({ origin, point, rotation }: {
8
- origin?: Point;
9
- point: Point;
10
- rotation?: number | undefined;
11
- }) => Point;
12
- export declare const getAngleFromVector: ({ targetVector: [point1, point2], radian, originVector }: {
13
- targetVector: Vector;
14
- radian?: boolean;
15
- originVector?: Vector;
16
- }) => number;
17
- export declare const getDistanceBetweenPoints: (p1: Point, p2: Point) => number;
18
- export declare const getCenter: (e1: Point, e2: Point) => Point;
19
- export {};
@@ -1,58 +0,0 @@
1
- import type { UtilsSettings } from './../../../canvas/constants/app';
2
- import type { CanvasSize, Size } from './../../../common/types/Canvas';
3
- import type { Point, Rect } from './../../../common/types/Shapes';
4
- export declare const getNewOffset: ({ size, zoom, newOffset: [x, y], canvasSize }: {
5
- zoom: number;
6
- size: Size;
7
- newOffset: Point;
8
- canvasSize: CanvasSize;
9
- }) => {
10
- zoom: number;
11
- offset: Point;
12
- };
13
- export declare const calculateNewZoomAndOffset: ({ size, canvasSize, currentOffset, currentZoom, zoom, centerPoint: iCenterPoint }: {
14
- size: Size;
15
- canvasSize: CanvasSize;
16
- currentOffset: Point;
17
- currentZoom: number;
18
- zoom: number;
19
- centerPoint: Point;
20
- }) => {
21
- offset: Point;
22
- zoom: number;
23
- };
24
- export declare const getNewZoomAndOffset: ({ size, canvasSize, currentOffset, currentZoom, action }: {
25
- size: Size;
26
- canvasSize: CanvasSize;
27
- currentOffset: Point;
28
- currentZoom: number;
29
- action: "unzoom" | "zoom" | "default";
30
- }) => {
31
- offset: Point;
32
- zoom: number;
33
- };
34
- export declare const getNewZoomAndOffsetFromDelta: ({ size, canvasSize, currentOffset, currentZoom, delta, centerPoint }: {
35
- size: Size;
36
- canvasSize: CanvasSize;
37
- currentOffset: Point;
38
- currentZoom: number;
39
- delta: number;
40
- centerPoint: Point;
41
- }) => {
42
- offset: Point;
43
- zoom: number;
44
- };
45
- export declare const getCurrentView: (settings: UtilsSettings) => Rect;
46
- export declare const getMaskRect: (settings: UtilsSettings) => {
47
- x: number;
48
- y: number;
49
- width: number;
50
- height: number;
51
- };
52
- export declare const clipMask: (ctx: CanvasRenderingContext2D, settings: UtilsSettings) => void;
53
- export declare const drawMask: (ctx: CanvasRenderingContext2D, settings: UtilsSettings) => void;
54
- export declare const isCursorInsideMask: (cursorPosition: Point, settings: UtilsSettings) => boolean;
55
- export declare const normalizeWheel: (event: WheelEvent, lastTimeEvent: number) => {
56
- deltaX: number;
57
- deltaY: number;
58
- };
@@ -1,2 +0,0 @@
1
- declare const useDebounce: <T extends (...args: any[]) => void>(callback: T, delay?: number) => (...args: Parameters<T>) => void;
2
- export default useDebounce;
@@ -1,8 +0,0 @@
1
- export type CanvasSize = {
2
- realWidth: number;
3
- realHeight: number;
4
- width: number;
5
- height: number;
6
- scaleRatio: number;
7
- };
8
- export type Size = 'infinite' | 'fixed';
@@ -1,24 +0,0 @@
1
- import type { Point } from './../../../common/types/Shapes';
2
- export type BrushAlgo = 'simple' | 'quadratic';
3
- export type UtilsSettings = {
4
- brushAlgo: BrushAlgo;
5
- isBrushShapeDoneOnMouseUp: boolean;
6
- gridGap: number;
7
- canvasOffset: Point;
8
- canvasZoom: number;
9
- canvasSize: {
10
- realWidth: number;
11
- realHeight: number;
12
- width: number;
13
- height: number;
14
- scaleRatio: number;
15
- scaleRatioWithNoZoom: number;
16
- };
17
- selectionPadding: number;
18
- size: 'infinite' | 'fixed';
19
- features: {
20
- zoom: boolean;
21
- edition: boolean;
22
- };
23
- debug: boolean;
24
- };
@@ -1,153 +0,0 @@
1
- import type { ShapeTypeArray } from '../../canvas/constants/shapes';
2
- export type ShapeType = (typeof ShapeTypeArray)[number];
3
- export type Point = [number, number];
4
- export type Rect = {
5
- x: number;
6
- y: number;
7
- width: number;
8
- height: number;
9
- };
10
- export type Picture = Rect & {
11
- src: string;
12
- };
13
- export type Text = Rect & {
14
- value: string[];
15
- fontSize: number;
16
- };
17
- export type Line = {
18
- points: readonly [Point, Point];
19
- };
20
- export type Triangle = {
21
- points: [Point, Point, Point];
22
- };
23
- export type Polygon = {
24
- points: Point[];
25
- tempPoint?: Point | undefined;
26
- };
27
- export type Curve = {
28
- points: Point[];
29
- tempPoint?: Point | undefined;
30
- };
31
- export type Brush = {
32
- points: Point[][];
33
- };
34
- export type Circle = {
35
- x: number;
36
- y: number;
37
- radius: number;
38
- };
39
- export type Ellipse = {
40
- x: number;
41
- y: number;
42
- radiusX: number;
43
- radiusY: number;
44
- };
45
- export type StyleShape = {
46
- fillColor?: string;
47
- opacity?: number;
48
- strokeColor?: string;
49
- lineWidth?: number;
50
- lineDash?: number;
51
- lineArrow?: number;
52
- lineCap?: CanvasLineCap;
53
- closedPoints?: number;
54
- fontFamily?: string;
55
- fontItalic?: boolean;
56
- fontBold?: boolean;
57
- };
58
- export type SelectionDefaultType = {
59
- type: 'rect';
60
- border: Path2D;
61
- line: Path2D | undefined;
62
- shapePath: Path2D | undefined;
63
- anchors: Path2D[];
64
- };
65
- export type SelectionLinesType = {
66
- type: 'line';
67
- border: Path2D;
68
- shapePath: Path2D | undefined;
69
- anchors: Path2D[];
70
- };
71
- type GenericDrawableShape = {
72
- rotation?: number;
73
- toolId?: string;
74
- visible?: boolean;
75
- locked?: boolean;
76
- style?: StyleShape | undefined;
77
- } & ((Line & {
78
- type: 'line';
79
- }) | (Picture & {
80
- type: 'picture';
81
- img: HTMLImageElement;
82
- flipX?: boolean;
83
- flipY?: boolean;
84
- ratio?: number;
85
- }) | (Text & {
86
- type: 'text';
87
- flipX?: boolean;
88
- flipY?: boolean;
89
- ratio?: number;
90
- }) | (Rect & {
91
- type: 'rect';
92
- }) | (Rect & {
93
- type: 'square';
94
- }) | (Circle & {
95
- type: 'circle';
96
- }) | (Ellipse & {
97
- type: 'ellipse';
98
- }) | (Triangle & {
99
- type: 'triangle';
100
- }) | (Polygon & {
101
- type: 'polygon';
102
- }) | (Curve & {
103
- type: 'curve';
104
- }) | (Brush & {
105
- type: 'brush';
106
- scaleX?: number;
107
- scaleY?: number;
108
- }) | (Rect & {
109
- type: 'group';
110
- shapes: ShapeEntity[];
111
- }));
112
- export type DrawableShape<T extends ShapeType = ShapeType> = GenericDrawableShape & {
113
- type: T;
114
- };
115
- export type ExportedDrawableShape<T extends ShapeType = ShapeType> = T extends 'picture' ? Omit<DrawableShape<'picture'>, 'img'> : DrawableShape<T>;
116
- export type TriangleEntity = DrawableShape<'triangle'> & {
117
- path: Path2D;
118
- computed: {
119
- borders: Rect;
120
- outerBorders: Rect;
121
- center: Point;
122
- boundingBox: Rect;
123
- };
124
- };
125
- export type ShapeEntity<T extends Exclude<ShapeType, 'triangle'> = Exclude<ShapeType, 'triangle'>> = {
126
- id: string;
127
- computed: {
128
- borders: Rect;
129
- outerBorders: Rect;
130
- center: Point;
131
- boundingBox: Rect;
132
- };
133
- path: Path2D;
134
- } & DrawableShape<T> & ({
135
- type: 'line';
136
- selection?: SelectionLinesType | undefined;
137
- arrows?: TriangleEntity[];
138
- } | {
139
- type: 'polygon' | 'curve';
140
- selection?: SelectionLinesType | undefined;
141
- } | {
142
- type: 'text' | 'picture' | 'rect' | 'square' | 'circle' | 'ellipse' | 'group' | 'brush';
143
- selection?: SelectionDefaultType | undefined;
144
- });
145
- export type StateData = {
146
- shapes?: DrawableShape[];
147
- config?: {
148
- width: number;
149
- height: number;
150
- };
151
- };
152
- export type SelectionType = ShapeEntity;
153
- export {};
@@ -1,6 +0,0 @@
1
- import 'react';
2
- declare module 'react' {
3
- interface CSSProperties {
4
- [key: `--${string}`]: string | number;
5
- }
6
- }
@@ -1,164 +0,0 @@
1
- import type { ShapeType } from './Shapes';
2
- export type CustomToolInput = {
3
- id: string;
4
- icon?: string;
5
- label?: string;
6
- } & ({
7
- type: 'brush';
8
- settings: ToolsSettingsType<'brush'>;
9
- } | {
10
- type: 'circle';
11
- settings: ToolsSettingsType<'circle'>;
12
- } | {
13
- type: 'ellipse';
14
- settings: ToolsSettingsType<'ellipse'>;
15
- } | {
16
- type: 'rect';
17
- settings: ToolsSettingsType<'rect'>;
18
- } | {
19
- type: 'square';
20
- settings: ToolsSettingsType<'square'>;
21
- } | {
22
- type: 'line';
23
- settings: ToolsSettingsType<'line'>;
24
- } | {
25
- type: 'polygon';
26
- settings: ToolsSettingsType<'polygon'>;
27
- } | {
28
- type: 'curve';
29
- settings: ToolsSettingsType<'curve'>;
30
- } | {
31
- type: 'text';
32
- settings: ToolsSettingsType<'text'>;
33
- } | {
34
- type: 'picture';
35
- settings: ToolsSettingsType<'picture'>;
36
- });
37
- export type CustomTool = {
38
- id: string;
39
- icon: string;
40
- label: string;
41
- } & ({
42
- type: 'brush';
43
- settings: ToolsSettingsType<'brush'>;
44
- } | {
45
- type: 'circle';
46
- settings: ToolsSettingsType<'circle'>;
47
- } | {
48
- type: 'ellipse';
49
- settings: ToolsSettingsType<'ellipse'>;
50
- } | {
51
- type: 'rect';
52
- settings: ToolsSettingsType<'rect'>;
53
- } | {
54
- type: 'square';
55
- settings: ToolsSettingsType<'square'>;
56
- } | {
57
- type: 'line';
58
- settings: ToolsSettingsType<'line'>;
59
- } | {
60
- type: 'polygon';
61
- settings: ToolsSettingsType<'polygon'>;
62
- } | {
63
- type: 'curve';
64
- settings: ToolsSettingsType<'curve'>;
65
- } | {
66
- type: 'text';
67
- settings: ToolsSettingsType<'text'>;
68
- } | {
69
- type: 'picture';
70
- settings: ToolsSettingsType<'picture'>;
71
- } | {
72
- type: 'group';
73
- settings: ToolsSettingsType<'group'>;
74
- });
75
- export type SettingsOpacity = {
76
- opacity: {
77
- min: number;
78
- max: number;
79
- step: number;
80
- default: number;
81
- hidden?: boolean;
82
- };
83
- };
84
- export type SettingsStrokeColor = {
85
- strokeColor: {
86
- values: string[];
87
- default: string;
88
- hidden?: boolean;
89
- };
90
- };
91
- export type SettingsFillColor = {
92
- fillColor: {
93
- values: string[];
94
- default: string;
95
- hidden?: boolean;
96
- };
97
- };
98
- export type SettingsLineWidth = {
99
- lineWidth: {
100
- min: number;
101
- max: number;
102
- step: number;
103
- default: number;
104
- hidden?: boolean;
105
- };
106
- };
107
- export type SettingsLineDash = {
108
- lineDash: {
109
- values: number[];
110
- default: number;
111
- hidden?: boolean;
112
- };
113
- };
114
- export type SettingsLineArrow = {
115
- lineArrow: {
116
- values: number[];
117
- default: number;
118
- hidden?: boolean;
119
- };
120
- };
121
- export type SettingsFont = {
122
- fontFamily: {
123
- values: string[];
124
- default: string;
125
- hidden?: boolean;
126
- };
127
- fontBold: {
128
- values: boolean[];
129
- default: boolean;
130
- hidden?: boolean;
131
- };
132
- fontItalic: {
133
- values: boolean[];
134
- default: boolean;
135
- hidden?: boolean;
136
- };
137
- };
138
- export type SettingsClosedPoints = {
139
- closedPoints: {
140
- default: number;
141
- hidden?: boolean;
142
- };
143
- };
144
- export type ToolsRectSettings = SettingsStrokeColor & SettingsFillColor & SettingsOpacity & SettingsLineWidth & SettingsLineDash;
145
- export type ToolsSquareSettings = SettingsStrokeColor & SettingsFillColor & SettingsOpacity & SettingsLineWidth & SettingsLineDash;
146
- export type ToolsCircleSettings = SettingsStrokeColor & SettingsFillColor & SettingsOpacity & SettingsLineWidth & SettingsLineDash;
147
- export type ToolsEllipseSettings = SettingsStrokeColor & SettingsFillColor & SettingsOpacity & SettingsLineWidth & SettingsLineDash;
148
- export type ToolsTextSettings = SettingsOpacity & SettingsStrokeColor & SettingsFont;
149
- export type ToolsLineSettings = SettingsOpacity & SettingsStrokeColor & SettingsLineWidth & SettingsLineDash & SettingsLineArrow;
150
- export type ToolsBrushSettings = SettingsOpacity & SettingsStrokeColor & SettingsLineWidth & SettingsLineDash;
151
- export type ToolsPolygonSettings = SettingsOpacity & SettingsStrokeColor & SettingsFillColor & SettingsLineWidth & SettingsLineDash & SettingsClosedPoints;
152
- export type ToolsCurveSettings = SettingsOpacity & SettingsStrokeColor & SettingsFillColor & SettingsLineWidth & SettingsLineDash & SettingsClosedPoints;
153
- export type ToolsTriangleSettings = SettingsStrokeColor & SettingsFillColor & SettingsOpacity & SettingsLineWidth & SettingsLineDash;
154
- export type ToolsPictureSettings = SettingsOpacity;
155
- export type ToolsGroupSettings = Partial<SettingsOpacity & SettingsStrokeColor & SettingsFillColor & SettingsLineWidth & SettingsLineDash & SettingsLineArrow>;
156
- export type ToolsSettingsType<T extends ShapeType> = T extends 'rect' ? ToolsRectSettings : T extends 'square' ? ToolsSquareSettings : T extends 'circle' ? ToolsCircleSettings : T extends 'ellipse' ? ToolsEllipseSettings : T extends 'text' ? ToolsTextSettings : T extends 'line' ? ToolsLineSettings : T extends 'brush' ? ToolsBrushSettings : T extends 'polygon' ? ToolsPolygonSettings : T extends 'curve' ? ToolsCurveSettings : T extends 'triangle' ? ToolsTriangleSettings : T extends 'picture' ? ToolsPictureSettings : T extends 'group' ? ToolsGroupSettings : never;
157
- export type ActionsType = 'selection' | 'undo' | 'redo' | 'clear' | 'export' | 'loadfile' | 'savefile' | 'move' | 'uploadpicture' | 'addurlpicture';
158
- export type ActionsTool = {
159
- id: string;
160
- type: ActionsType;
161
- icon: string;
162
- label: string;
163
- };
164
- export type ToolsType = CustomTool | ActionsTool;
@@ -1,4 +0,0 @@
1
- export type RecursivePartial<T> = {
2
- [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial<U>[] : T[P] extends object ? RecursivePartial<T[P]> : T[P] | undefined;
3
- };
4
- export type ValueOf<T> = T[keyof T];
@@ -1,2 +0,0 @@
1
- export declare const compact: <T>(array: (T | undefined | null)[]) => T[];
2
- export declare const moveItemPosition: <T>(array: T[], positionToMove: number, positionToEnd: number) => T[];
@@ -1 +0,0 @@
1
- export declare const isEventInsideNode: (event: MouseEvent | TouchEvent, node: HTMLElement | null) => boolean;
@@ -1,4 +0,0 @@
1
- export declare const omit: <T extends Record<string, unknown>>(keys: (string | [string, unknown[]])[], obj: T) => T;
2
- export declare const set: <T extends Record<string, any> | unknown[]>(path: string | number | (string | number)[], value: unknown, obj: T) => T;
3
- export declare const mergeWith: (customMergeFn: (objValue: unknown, srcValue: unknown, key: string) => unknown, target: unknown, source: unknown) => unknown;
4
- export declare const isEqual: (a: unknown, b: unknown) => boolean;
@@ -1,3 +0,0 @@
1
- export declare const uniqueId: (prefix?: string) => string;
2
- export declare const clamp: (value: number, min: number, max: number) => number;
3
- export declare const isMacOs: () => boolean;
@@ -1,16 +0,0 @@
1
- import React from 'react';
2
- import './Button.css';
3
- type CommonType = {
4
- hidden?: boolean | undefined;
5
- disabled?: boolean | undefined;
6
- selected?: boolean | undefined;
7
- icon?: string | undefined;
8
- };
9
- type ButtonType = CommonType & React.ButtonHTMLAttributes<HTMLButtonElement>;
10
- export type FileInputType = CommonType & {
11
- type: 'file' | 'color';
12
- accept?: string;
13
- onClick?: React.MouseEventHandler<HTMLElement>;
14
- } & React.InputHTMLAttributes<HTMLInputElement | HTMLButtonElement>;
15
- declare const Button: React.ForwardRefExoticComponent<(FileInputType | ButtonType) & React.RefAttributes<HTMLButtonElement | HTMLInputElement>>;
16
- export default Button;
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- import './Button.css';
3
- declare const FileInput: React.ForwardRefExoticComponent<{
4
- hidden?: boolean | undefined;
5
- disabled?: boolean | undefined;
6
- selected?: boolean | undefined;
7
- icon?: string | undefined;
8
- } & {
9
- type: "file" | "color";
10
- accept?: string;
11
- onClick?: React.MouseEventHandler<HTMLElement>;
12
- } & React.InputHTMLAttributes<HTMLButtonElement | HTMLInputElement> & React.RefAttributes<HTMLButtonElement | HTMLInputElement>>;
13
- export default FileInput;
@@ -1,6 +0,0 @@
1
- import './Loading.css';
2
- export type LoadingType = {
3
- isLoading: boolean;
4
- };
5
- declare const Loading: ({ isLoading }: LoadingType) => import("react/jsx-runtime").JSX.Element | null;
6
- export default Loading;
@@ -1,10 +0,0 @@
1
- import './Menu.css';
2
- type MenuType = {
3
- alignment?: 'left' | 'center' | 'right' | undefined;
4
- children: React.ReactNode;
5
- className?: string;
6
- style?: React.CSSProperties;
7
- position?: 'top' | 'bottom' | 'left' | 'right' | undefined;
8
- };
9
- declare const Menu: ({ alignment, children, className, style, position }: MenuType) => import("react/jsx-runtime").JSX.Element;
10
- export default Menu;
@@ -1,11 +0,0 @@
1
- import type { ReactNode } from 'react';
2
- import './Modal.css';
3
- type ModalType = {
4
- children: ReactNode;
5
- title: string;
6
- onClose: () => void;
7
- position?: 'center' | 'bottom';
8
- className?: string;
9
- };
10
- declare const Modal: ({ children, onClose, position, title, className }: ModalType) => import("react/jsx-runtime").JSX.Element;
11
- export default Modal;
@@ -1,15 +0,0 @@
1
- import type React from 'react';
2
- import './Panel.css';
3
- import type { CSSProperties } from 'react';
4
- type PanelType = {
5
- vertical?: boolean;
6
- children: React.ReactNode;
7
- style?: CSSProperties | undefined;
8
- title?: string;
9
- className?: string | undefined;
10
- fitContainer?: boolean;
11
- position?: 'bottom' | 'top' | 'left' | 'right' | undefined;
12
- alignment?: 'left' | 'right' | 'center' | undefined;
13
- };
14
- declare const Panel: ({ children, title, className, position, fitContainer, alignment, style, ...props }: PanelType) => import("react/jsx-runtime").JSX.Element;
15
- export default Panel;
@@ -1,7 +0,0 @@
1
- import type { SnackBarType } from './../../../../editor/types/snackbar';
2
- import './Snackbar.css';
3
- type SnackbarContainerType = {
4
- snackbarList: SnackBarType[];
5
- };
6
- declare const SnackbarContainer: ({ snackbarList }: SnackbarContainerType) => import("react/jsx-runtime").JSX.Element;
7
- export default SnackbarContainer;
@@ -1,10 +0,0 @@
1
- import type React from 'react';
2
- type ClosedPointsType = {
3
- selectedSettings: string | undefined;
4
- setSelectedSettings: React.Dispatch<React.SetStateAction<string | undefined>>;
5
- disabled?: boolean | undefined;
6
- defaultValue?: number | undefined;
7
- valueChanged: (field: string, value: string | number) => void;
8
- };
9
- declare const ClosedPointsField: ({ selectedSettings, setSelectedSettings, disabled, defaultValue, valueChanged }: ClosedPointsType) => import("react/jsx-runtime").JSX.Element;
10
- export default ClosedPointsField;
@@ -1,15 +0,0 @@
1
- import type React from 'react';
2
- import './ColorField.css';
3
- type ShapeStyleColorType = {
4
- selectedSettings: string | undefined;
5
- setSelectedSettings: React.Dispatch<React.SetStateAction<string | undefined>>;
6
- title?: string;
7
- disabled?: boolean | undefined;
8
- field: string;
9
- mode?: 'fill' | 'stroke';
10
- value?: string | undefined;
11
- values: string[];
12
- valueChanged: (field: string, value: string | number) => void;
13
- };
14
- declare const ColorField: ({ selectedSettings, setSelectedSettings, title, mode, disabled, values, field, value, valueChanged }: ShapeStyleColorType) => import("react/jsx-runtime").JSX.Element | null;
15
- export default ColorField;