feat: add core package

package.json

@@ -9,7 +9,7 @@
     "packages/*"
   ],
   "scripts": {
-    "dev": "run-p \"watch common\" \"watch icons\" \"watch components\" \"watch geo\" app:dev",
+    "dev": "run-p \"watch common\" \"watch icons\" \"watch components\" \"watch geo\" \"watch core\" app:dev",
     "watch": "node scripts/dev.js",
     "app:dev": "pnpm --filter @suika/suika dev",
     "app:build": "pnpm --filter @suika/suika build",

packages/common/package.json

@@ -11,6 +11,20 @@
     "build": "tsc && vite build"
   },
   "devDependencies": {
+    "@types/uuid": "^9.0.2",
+    "lodash.clonedeep": "^4.5.0",
+    "lodash.debounce": "^4.0.8",
+    "lodash.isequal": "^4.5.0",
+    "lodash.omit": "^4.5.0",
+    "lodash.throttle": "^4.1.1",
     "vite": "^4.2.0"
+  },
+  "dependencies": {
+    "@types/lodash.clonedeep": "^4.5.7",
+    "@types/lodash.debounce": "^4.0.7",
+    "@types/lodash.isequal": "^4.5.6",
+    "@types/lodash.omit": "^4.5.7",
+    "@types/lodash.throttle": "^4.1.7",
+    "uuid": "^9.0.0"
   }
 }

packages/common/src/index.ts

@@ -1 +1,5 @@
 export * from './event_emitter';
+export * from './common';
+export * from './lodash';
+export * from './array_util';
+export * from './color';

packages/common/src/lodash.ts

@@ -0,0 +1,7 @@
+import cloneDeep from 'lodash.clonedeep';
+import debounce from 'lodash.debounce';
+import isEqual from 'lodash.isequal';
+import omit from 'lodash.omit';
+import throttle from 'lodash.throttle';
+
+export { cloneDeep, debounce, isEqual, omit, throttle };

packages/common/tsconfig.json

@@ -15,7 +15,9 @@
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true
+    "noFallthroughCasesInSwitch": true,
+
+    "allowSyntheticDefaultImports": true
   },
   "include": ["src"]
 }

packages/core/README.md

@@ -0,0 +1 @@
+editor core

packages/core/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@suika/core",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "main": "dist/core.es.js",
+  "module": "dist/core.es.js",
+  "types": "dist/core.d.ts",
+  "scripts": {
+    "build": "tsc && vite build"
+  },
+  "devDependencies": {
+    "@suika/common": "workspace:^",
+    "@suika/geo": "workspace:^",
+    "@types/stats.js": "^0.17.3",
+    "vite": "^4.2.0"
+  },
+  "dependencies": {
+    "stats.js": "^0.17.0"
+  }
+}

packages/suika/src/editor/clipboard.ts → packages/core/src/clipboard.ts

@@ -1,9 +1,8 @@
 import { Editor } from './editor';
-import { noop } from '../utils/common';
-import { arrMap } from '../utils/array_util';
-import omit from 'lodash.omit';
+import { noop, arrMap } from '@suika/common';
+import { omit } from '@suika/common';
 import { AddShapeCommand } from './commands/add_shape';
-import { IEditorPaperData } from '../type';
+import { IEditorPaperData } from './type';
 import { Graph } from './scene/graph';
 
 /**

packages/suika/src/editor/commands/align.ts → packages/core/src/commands/align.ts

@@ -1,5 +1,4 @@
 import { Graph } from '../scene/graph';
-import { Editor } from '../editor';
 import { ICommand } from './type';
 
 export enum AlignType {
@@ -19,12 +18,7 @@ export enum AlignType {
 export class AlignCmd implements ICommand {
   dx: number[] = [];
   dy: number[] = [];
-  constructor(
-    public desc: string,
-    private editor: Editor,
-    private elements: Graph[],
-    type: AlignType,
-  ) {
+  constructor(public desc: string, private elements: Graph[], type: AlignType) {
     if (elements.length < 2) {
       throw new Error('you can not algin zero or one element');
     }

packages/core/src/commands/index.ts

@@ -0,0 +1,8 @@
+export * from './add_shape';
+export * from './align';
+export * from './command_manager';
+export * from './group';
+export * from './move_elements';
+export * from './remove_element';
+export * from './set_elements_attrs';
+export * from './type';

packages/core/src/constant.ts

@@ -0,0 +1,3 @@
+export const DOUBLE_PI = Math.PI * 2;
+
+export const HALF_PI = Math.PI / 2;

packages/suika/src/editor/cursor_manager/cursor_manager.ts → packages/core/src/cursor_manager/cursor_manager.ts

@@ -1,7 +1,7 @@
 import { normalizeDegree } from '@suika/geo';
 import { Editor } from '../editor';
-import './cursor.scss';
-import isEqual from 'lodash.isequal';
+import './cursor.css';
+import { isEqual } from '@suika/common';
 import { getIconSvgDataUrl } from './util';
 
 export interface ICursorRotation {

packages/suika/src/editor/editor.ts → packages/core/src/editor.ts

@@ -3,7 +3,7 @@ import {
   genId,
   sceneCoordsToViewportUtil,
   viewportCoordsToSceneUtil,
-} from '../utils/common';
+} from '@suika/common';
 import { CommandManager } from './commands/command_manager';
 import { HostEventManager } from './host_event_manager';
 import Ruler from './ruler';
@@ -25,7 +25,7 @@ import { GroupManager } from './group_manager';
 import { ControlHandleManager } from './scene/control_handle_manager';
 import { SelectedBox } from './selected_box';
 import { CanvasDragger } from './canvas_dragger';
-import { IEditorPaperData } from '../type';
+import { IEditorPaperData } from './type';
 
 interface IEditorOptions {
   containerElement: HTMLDivElement;

packages/suika/src/editor/grid.ts → packages/core/src/grid.ts

@@ -1,4 +1,4 @@
-import { getClosestTimesVal, nearestPixelVal } from '../utils/common';
+import { getClosestTimesVal, nearestPixelVal } from '@suika/common';
 import { Editor } from './editor';
 
 /**

packages/suika/src/editor/group_manager/group.ts → packages/core/src/group_manager/group.ts

@@ -1,5 +1,5 @@
-import { IObject } from '../../type';
-import { genId, objectNameGenerator } from '../../utils/common';
+import { IObject } from '../type';
+import { genId, objectNameGenerator } from '@suika/common';
 import { IGroupAttrs } from './type';
 
 export class Group implements IGroupAttrs {

packages/suika/src/editor/host_event_manager/host_event_manager.ts → packages/core/src/host_event_manager/host_event_manager.ts

@@ -1,9 +1,8 @@
-import { IPoint } from '../../type';
+import { IPoint } from '../type';
 import { EventEmitter } from '@suika/common';
 import { Editor } from '../editor';
 import { MoveGraphsKeyBinding } from './move_graphs_key_binding';
 import { CommandKeyBinding } from './command_key_binding';
-import { ICursor } from '../cursor_manager';
 
 interface Events {
   shiftToggle(press: boolean): void;
@@ -32,7 +31,6 @@ export class HostEventManager {
   private moveGraphsKeyBinding: MoveGraphsKeyBinding;
   private commandKeyBinding: CommandKeyBinding;
 
-  private prevCursor: ICursor = 'default';
   private eventEmitter = new EventEmitter<Events>();
   private unbindHandlers: Array<() => void> = [];
 

packages/suika/src/editor/host_event_manager/move_graphs_key_binding.ts → packages/core/src/host_event_manager/move_graphs_key_binding.ts

@@ -1,10 +1,9 @@
-import debounce from 'lodash.debounce';
+import { debounce } from '@suika/common';
 import { SetElementsAttrs } from '../commands/set_elements_attrs';
-import { arrMap } from '../../utils/array_util';
 import { Editor } from '../editor';
 import { Graph } from '../scene/graph';
-import { IPoint } from '../../type';
-import { noop } from '../../utils/common';
+import { IPoint } from '../type';
+import { noop, arrMap } from '@suika/common';
 
 /**
  * move graphs by arrow key binding

packages/core/src/index.ts

@@ -0,0 +1,12 @@
+export type { SettingValue } from './setting';
+
+export { ArrangeType } from './commands/arrange';
+
+export * from './editor';
+export * from './service';
+export * from './service';
+export * from './texture';
+export { Graph, type GraphAttrs } from './scene/graph';
+export * from './commands';
+
+export type { IGroupsData } from './group_manager';

packages/suika/src/editor/key_binding_manager.ts → packages/core/src/key_binding_manager.ts

@@ -1,4 +1,4 @@
-import { isWindows } from '../utils/common';
+import { isWindows } from '@suika/common';
 import { Editor } from './editor';
 
 interface IKey {

packages/suika/src/editor/ref_line.ts → packages/core/src/ref_line.ts

@@ -1,15 +1,14 @@
 import { Editor } from './editor';
-import { IPoint, IVerticalLine, IHorizontalLine } from '../type';
+import { IPoint, IVerticalLine, IHorizontalLine } from './type';
 import {
   bboxToBbox2,
   bboxToBboxWithMid,
   isRectIntersect2,
   pointsToHLines,
   pointsToVLines,
-} from '../utils/geo';
-import { getClosestValInSortedArr } from '../utils/common';
-import { drawLine, drawXShape } from '../utils/canvas';
-import { arrMap, forEach } from '../utils/array_util';
+} from './utils';
+import { arrMap, forEach, getClosestValInSortedArr } from '@suika/common';
+import { drawLine, drawXShape } from './utils';
 
 /**
  * reference line
@@ -110,9 +109,9 @@ export class RefLine {
   ) {
     const line = m.get(xOrY);
     if (line) {
-      forEach(xsOrYs, (xOrY) => {
+      for (const xOrY of xsOrYs) {
         line.add(xOrY);
-      });
+      }
     } else {
       m.set(xOrY, new Set(xsOrYs));
     }

packages/suika/src/editor/ruler.ts → packages/core/src/ruler.ts

@@ -1,6 +1,6 @@
-import { HALF_PI } from '../constant';
-import { rotateInCanvas } from '../utils/canvas';
-import { getClosestTimesVal, nearestPixelVal } from '../utils/common';
+import { HALF_PI } from './constant';
+import { rotateInCanvas } from './utils';
+import { getClosestTimesVal, nearestPixelVal } from '@suika/common';
 import { Editor } from './editor';
 
 const getStepByZoom = (zoom: number) => {

packages/suika/src/editor/scene/control_handle_manager/util.ts → packages/core/src/scene/control_handle_manager/util.ts

@@ -1,4 +1,4 @@
-import { parseHexToRGBA } from '../../../utils/color';
+import { parseHexToRGBA } from '@suika/common';
 import { ITexture, TextureType } from '../../texture';
 import { Rect } from '../rect';
 import { ControlHandle } from './control_handle';

packages/suika/src/editor/scene/ellipse.ts → packages/core/src/scene/ellipse.ts

@@ -1,11 +1,11 @@
-import { DOUBLE_PI } from '../../constant';
-import { GraphType } from '../../type';
-import { rotateInCanvas } from '../../utils/canvas';
-import { parseRGBAStr } from '../../utils/color';
+import { DOUBLE_PI } from '../constant';
+import { GraphType } from '../type';
+import { rotateInCanvas } from '../utils';
 import { transformRotate } from '@suika/geo';
 import { ImgManager } from '../Img_manager';
 import { TextureType } from '../texture';
 import { Graph, GraphAttrs } from './graph';
+import { parseRGBAStr } from '@suika/common';
 
 export type EllipseAttrs = GraphAttrs;
 

packages/suika/src/editor/scene/graph.ts → packages/core/src/scene/graph.ts

@@ -1,18 +1,18 @@
-import { IBox, IBox2, GraphType, IPoint, IBox2WithRotation } from '../../type';
-import { IRect, getResizedRect } from '@suika/geo';
-import { calcCoverScale, genId, objectNameGenerator } from '../../utils/common';
+import { IBox, IBox2, GraphType, IPoint, IBox2WithRotation } from '../type';
+import { IRect, getRectRotatedXY, getResizedRect } from '@suika/geo';
+import { calcCoverScale, genId, objectNameGenerator } from '@suika/common';
 import { IRectWithRotation, isPointInRect, isRectIntersect } from '@suika/geo';
 import {
   getAbsoluteCoords,
-  getRectRotatedXY,
   getRectCenterPoint,
-} from '../../utils/geo';
+  drawRoundRectPath,
+  rotateInCanvas,
+} from '../utils';
 import { normalizeRadian, isRectContain } from '@suika/geo';
 import { transformRotate } from '@suika/geo';
 import { DEFAULT_IMAGE, ITexture, TextureImage } from '../texture';
 import { ImgManager } from '../Img_manager';
-import { HALF_PI } from '../../constant';
-import { drawRoundRectPath, rotateInCanvas } from '../../utils/canvas';
+import { HALF_PI } from '../constant';
 import { ControlHandle } from './control_handle_manager';
 import { getResizedLine } from './utils';
 
@@ -334,11 +334,11 @@ export class Graph {
   }
   draw(
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    ctx: CanvasRenderingContext2D,
+    _ctx: CanvasRenderingContext2D,
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    imgManager?: ImgManager,
+    _imgManager?: ImgManager,
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    smooth?: boolean,
+    _smooth?: boolean,
   ) {
     throw new Error('draw Method not implemented.');
   }
@@ -362,7 +362,7 @@ export class Graph {
   }
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  strokeTexture(ctx: CanvasRenderingContext2D) {
+  strokeTexture(_ctx: CanvasRenderingContext2D) {
     throw new Error('Method not implemented.');
   }
   /**
@@ -500,7 +500,7 @@ export class Graph {
   }
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  getControlHandles(zoom: number, initial?: boolean): ControlHandle[] {
+  getControlHandles(_zoom: number, _initial?: boolean): ControlHandle[] {
     return [];
   }
 }

packages/suika/src/editor/scene/line.ts → packages/core/src/scene/line.ts

@@ -1,6 +1,6 @@
-import { GraphType } from '../../type';
-import { rotateInCanvas } from '../../utils/canvas';
-import { parseRGBAStr } from '../../utils/color';
+import { GraphType } from '../type';
+import { rotateInCanvas } from '../utils';
+import { parseRGBAStr } from '@suika/common';
 import { TextureType } from '../texture';
 import { Graph, GraphAttrs } from './graph';
 

packages/suika/src/editor/scene/rect.ts → packages/core/src/scene/rect.ts

@@ -1,6 +1,6 @@
-import { GraphType, IBox2WithRotation, IPoint } from '../../type';
-import { rotateInCanvas } from '../../utils/canvas';
-import { parseHexToRGBA, parseRGBAStr } from '../../utils/color';
+import { GraphType, IBox2WithRotation, IPoint } from '../type';
+import { rotateInCanvas } from '../utils';
+import { parseHexToRGBA, parseRGBAStr } from '@suika/common';
 import { ImgManager } from '../Img_manager';
 import { TextureType } from '../texture';
 import { Graph, GraphAttrs } from './graph';

packages/suika/src/editor/scene/scene_graph.ts → packages/core/src/scene/scene_graph.ts

@@ -1,15 +1,15 @@
 import { Editor } from '../editor';
-import { GraphType, IEditorPaperData, IObject } from '../../type';
+import { GraphType, IEditorPaperData, IObject } from '../type';
 import { IRect } from '@suika/geo';
 import { EventEmitter } from '@suika/common';
 import { isRectIntersect } from '@suika/geo';
-import rafThrottle from '../../utils/raf_throttle';
+import { rafThrottle } from '../utils';
+import { arrMap, forEach } from '@suika/common';
 import { Ellipse } from './ellipse';
 import { Graph, GraphAttrs } from './graph';
 import { Rect } from './rect';
-import { arrMap, forEach } from '../../utils/array_util';
 import Grid from '../grid';
-import { getDevicePixelRatio } from '../../utils/common';
+import { getDevicePixelRatio } from '@suika/common';
 import { TextGraph } from './text';
 import { Line } from './line';