mce 0.16.7 → 0.17.0

package/dist/locale/en.d.ts

@@ -1,7 +1,7 @@
 declare const _default: {
     cancel: string;
     create: string;
-    constrainToAxis: string;
+    constrainMovement: string;
     loading: string;
     drawing: string;
     exporting: string;
@@ -21,6 +21,7 @@ declare const _default: {
     slice: string;
     group: string;
     text: string;
+    shape: string;
     doubleClickEditText: string;
     rectangle: string;
     line: string;
@@ -68,20 +69,17 @@ declare const _default: {
     selectPreviousSibling: string;
     selectNextSibling: string;
     view: string;
-    'view:checkerboard': string;
-    'view:pixelGrid': string;
-    'view:ruler': string;
-    'view:scrollbar': string;
-    'view:frameOutline': string;
-    'checkerboardStyle:grid': string;
-    'checkerboardStyle:dot': string;
+    checkerboard: string;
+    pixelGrid: string;
+    ruler: string;
+    scrollbar: string;
+    frameOutline: string;
+    'checkerboard:grid': string;
+    'checkerboard:dot': string;
     panels: string;
-    'panels:layers': string;
-    'panels:timeline': string;
-    'panels:statusbar': string;
-    'panels:nodeCreator': string;
-    'panels:memoryManager': string;
-    nodeCreator: string;
+    timeline: string;
+    statusbar: string;
+    creator: string;
     memoryManager: string;
     toolbelt: string;
     msaa: string;

package/dist/locale/zh-Hans.d.ts

@@ -1,7 +1,7 @@
 declare const _default: {
     cancel: string;
     create: string;
-    constrainToAxis: string;
+    constrainMovement: string;
     loading: string;
     drawing: string;
     exporting: string;
@@ -21,6 +21,7 @@ declare const _default: {
     slice: string;
     group: string;
     text: string;
+    shape: string;
     doubleClickEditText: string;
     rectangle: string;
     line: string;
@@ -68,20 +69,17 @@ declare const _default: {
     selectPreviousSibling: string;
     selectNextSibling: string;
     view: string;
-    'view:checkerboard': string;
-    'view:pixelGrid': string;
-    'view:ruler': string;
-    'view:scrollbar': string;
-    'view:frameOutline': string;
-    'checkerboardStyle:grid': string;
-    'checkerboardStyle:dot': string;
+    checkerboard: string;
+    pixelGrid: string;
+    ruler: string;
+    scrollbar: string;
+    frameOutline: string;
+    'checkerboard:grid': string;
+    'checkerboard:dot': string;
     panels: string;
-    'panels:layers': string;
-    'panels:statusbar': string;
-    'panels:timeline': string;
-    'panels:nodeCreator': string;
-    'panels:memoryManager': string;
-    nodeCreator: string;
+    statusbar: string;
+    timeline: string;
+    creator: string;
     memoryManager: string;
     toolbelt: string;
     msaa: string;

package/dist/mixins/0.config/base.d.ts

@@ -1,36 +1,51 @@
 import type { CheckerboardStyle } from 'modern-canvas';
 declare global {
     namespace Mce {
-        interface Options extends Partial<Config> {
+        interface CameraConfig {
+            enabled: boolean;
         }
-        type Theme = 'system' | 'light' | 'dark';
-        type TypographyStrategy = 'autoHeight' | 'autoWidth' | 'fixedWidthHeight' | 'autoFontSize';
-        interface ScreenOffset {
-            left?: number;
-            top?: number;
-            right?: number;
-            bottom?: number;
+        interface CheckerboardConfig {
+            enabled: boolean;
+            style: CheckerboardStyle;
         }
-        interface TransformControlsConfig {
-            handleShape?: 'rect' | 'circle';
-            handleStrategy?: 'point';
-            rotator?: boolean;
+        interface PixelGridConfig {
+            enabled: boolean;
+        }
+        interface PixelateConfig {
+            enabled: boolean;
+        }
+        interface MsaaConfig {
+            enabled: boolean;
+        }
+        interface WatermarkConfig {
+            url?: string;
+            width: number;
+            alpha: number;
+            rotation: number;
+        }
+        interface ViewportConfig {
+            camera: CameraConfig;
+        }
+        interface CanvasConfig {
+            checkerboard: CheckerboardConfig;
+            pixelGrid: PixelGridConfig;
+            pixelate: PixelateConfig;
+            msaa: MsaaConfig;
+            watermark: WatermarkConfig;
+        }
+        interface UIConfig {
+        }
+        interface InteractionConfig {
+        }
+        interface DBConfig {
+            local: boolean;
         }
         interface Config {
-            theme: Theme;
-            watermark?: string;
-            msaa: boolean;
-            checkerboard: boolean;
-            checkerboardStyle: CheckerboardStyle;
-            pixelGrid: boolean;
-            pixelate: boolean;
-            camera: boolean;
-            frameOutline: boolean;
-            frameGap: number;
-            typographyStrategy: TypographyStrategy;
-            transformControls: TransformControlsConfig;
-            localDb: boolean;
-            screenCenterOffset: ScreenOffset;
+            db: DBConfig;
+            ui: UIConfig;
+            canvas: CanvasConfig;
+            viewport: ViewportConfig;
+            interaction: InteractionConfig;
         }
     }
 }

package/dist/mixins/0.config.d.ts

@@ -7,9 +7,9 @@ declare global {
             setter?: (val: any) => any;
         }
         interface Editor {
-            getConfigValue: (path: keyof Config | string, defaultValue?: any) => any;
-            setConfigValue: (path: keyof Config | string, value: any) => void;
-            getConfig: <T = any>(path: string) => WritableComputedRef<T>;
+            getConfig: (path: keyof Config | string, defaultValue?: any) => any;
+            setConfig: (path: keyof Config | string, value: any) => void;
+            getConfigRef: <T = any>(path: string) => WritableComputedRef<T>;
             registerConfig: <T>(path: keyof Config | string, declaration?: ConfigDeclaration<T>) => WritableComputedRef<T>;
             importConfig: () => Promise<void>;
             exportConfig: () => Blob;

package/dist/mixins/0.context.d.ts

@@ -1,7 +1,7 @@
-import type { Assets, Cursor, Vector2, Vector2Like } from 'modern-canvas';
+import type { Assets, Cursor, Vector2Like } from 'modern-canvas';
 import type { IndexCharacter as _IndexCharacter } from 'modern-text/web-components';
 import type { Ref } from 'vue';
-import { Aabb2D, Camera2D, DrawboardEffect, Element2D, Engine, Node, Timeline } from 'modern-canvas';
+import { Aabb2D, Camera2D, DrawboardEffect, Element2D, Engine, Node, Timeline, Vector2 } from 'modern-canvas';
 import { Fonts } from 'modern-font';
 import { Doc } from '../nodes';
 declare global {

package/dist/mixins/0.font.d.ts

@@ -6,9 +6,6 @@ declare global {
             setDefaultFont: (source: FontSource, options?: FontLoadOptions) => Promise<void>;
             waitUntilFontLoad: () => Promise<void>;
         }
-        interface Options {
-            defaultFont?: FontSource;
-        }
         interface Events {
             loadFont: [font: FontLoadedResult];
         }

package/dist/mixins/1.screen.d.ts

@@ -1,9 +1,18 @@
 import type { ComputedRef } from 'vue';
 declare global {
     namespace Mce {
+        interface ViewportConfig {
+            screenPadding: ScreenPadding;
+        }
+        interface ScreenPadding {
+            left: number;
+            top: number;
+            right: number;
+            bottom: number;
+        }
         interface Editor {
-            screenControlsOffset: ComputedRef<Required<ScreenOffset>>;
-            screenCenterOffset: ComputedRef<Required<ScreenOffset>>;
+            screenControlsOffset: ComputedRef<Required<ScreenPadding>>;
+            screenCenterOffset: ComputedRef<Required<ScreenPadding>>;
             screenCenter: ComputedRef<{
                 x: number;
                 y: number;

package/dist/mixins/snap.d.ts

@@ -0,0 +1,27 @@
+import type { Vector2Like } from 'modern-canvas';
+import type { Reactive } from 'vue';
+declare global {
+    namespace Mce {
+        interface SnapperData {
+            xLines?: number[];
+            yLines?: number[];
+            points?: Vector2Like[];
+        }
+        interface Snapper {
+            get: () => SnapperData;
+        }
+        interface Editor {
+            snappers: Reactive<Map<string, Snapper>>;
+            registerSnapper: (key: string, snapper: Snapper) => void;
+            unregisterSnapper: (key: string) => void;
+            snap: (box: {
+                left: number;
+                top: number;
+                width: number;
+                height: number;
+            }) => void;
+        }
+    }
+}
+declare const _default: import("..").Mixin;
+export default _default;

package/dist/mixins/snapshot.d.ts

@@ -2,9 +2,6 @@ import type { Element2D } from 'modern-canvas';
 import type { Element } from 'modern-idoc';
 declare global {
     namespace Mce {
-        interface Config {
-            frameScreenshot: boolean;
-        }
         interface Editor {
             snapshot: () => void;
             captureElementScreenshot: (element: Element | Element2D) => Promise<HTMLCanvasElement>;

package/dist/mixins/tool.d.ts

@@ -0,0 +1,25 @@
+import type { Vector2Like } from 'modern-canvas';
+import type { Reactive, Ref } from 'vue';
+declare global {
+    namespace Mce {
+        interface Tools {
+        }
+        type ToolHandle = (position: Vector2Like) => {
+            move?: (position: Vector2Like) => void;
+            end?: (position: Vector2Like) => void;
+        } | void;
+        interface Tool {
+            name: string;
+            handle?: ToolHandle;
+        }
+        interface Editor {
+            tools: Reactive<Map<string, Tool>>;
+            activeTool: Ref<Tool>;
+            registerTool: (tool: Tool | Tool[]) => void;
+            unregisterTool: (tool: string) => void;
+            activateTool: (tool: string | keyof Tools | undefined) => void;
+        }
+    }
+}
+declare const _default: import("..").Mixin;
+export default _default;

package/dist/nodes/Doc.d.ts

@@ -14,10 +14,10 @@ export interface Doc {
     emit: <K extends keyof DocEvents & string>(event: K, ...args: DocEvents[K]) => this;
 }
 export declare class Doc extends Node {
-    protected readonly _localDb: boolean;
+    protected readonly _local: boolean;
     _yDoc: YDoc;
     protected _source: any;
-    constructor(source?: Mce.DocumentSource, _localDb?: boolean);
+    constructor(source?: Mce.DocumentSource, _local?: boolean);
     transact: <T>(fn: () => T, should?: boolean) => T;
     undo: () => void;
     redo: () => void;

package/dist/plugin.d.ts

@@ -1,8 +1,8 @@
-import type { Component } from 'vue';
+import type { Component, Ref } from 'vue';
 import type { Editor, Events, Options } from './editor';
 export interface PluginBaseComponent {
     component: Component;
-    ignore?: () => boolean;
+    visible?: Ref<boolean>;
     order?: 'before' | number | 'after';
     slot?: string;
 }
@@ -29,7 +29,7 @@ export interface PluginObject {
     hotkeys?: Mce.Hotkey[];
     loaders?: Mce.Loader[];
     exporters?: Mce.Exporter[];
-    drawingTools?: Mce.DrawingTool[];
+    tools?: Mce.Tool[];
     components?: PluginComponent[];
     setup?: () => void | Promise<void>;
 }

package/dist/plugins/frame.d.ts

@@ -1,2 +1,14 @@
-declare const _default: import("../plugin").Plugin;
+declare global {
+    namespace Mce {
+        interface CanvasConfig {
+            frame: FrameConfig;
+        }
+        interface FrameConfig {
+            gap: number;
+            outline: boolean;
+            thumbnail: boolean;
+        }
+    }
+}
+declare const _default: import("..").Plugin;
 export default _default;

package/dist/plugins/image.d.ts

@@ -11,7 +11,7 @@ declare global {
             jpeg: Promise<Blob>;
             webp: Promise<Blob>;
         }
-        interface DrawingTools {
+        interface Tools {
             image: [];
         }
     }

package/dist/plugins/layers.d.ts

@@ -1,7 +1,7 @@
 declare global {
     namespace Mce {
-        interface Panels {
-            layers: [];
+        interface Commands {
+            layerScrollIntoView: () => boolean;
         }
     }
 }

package/dist/plugins/madeWith.d.ts

@@ -1,7 +1,10 @@
 declare global {
     namespace Mce {
-        interface Config {
-            madeWith: boolean;
+        interface UIConfig {
+            madeWith: MadeWithConfig;
+        }
+        interface MadeWithConfig {
+            visible: boolean;
         }
     }
 }

package/dist/plugins/menu.d.ts

@@ -12,6 +12,9 @@ declare global {
             mainMenu: ComputedRef<MenuItem[]>;
             contextMenu: ComputedRef<MenuItem[]>;
         }
+        interface Commands {
+            openContextMenu: (event?: MouseEvent) => boolean;
+        }
         interface Options {
             customContextMenu?: (defaultMenu: MenuItem[], editor: Editor) => MenuItem[];
         }

package/dist/plugins/node.d.ts

@@ -1,11 +1,14 @@
 declare global {
     namespace Mce {
+        interface UIConfig {
+            creator: CreatorConfig;
+        }
+        interface CreatorConfig {
+            visible: boolean;
+        }
         interface Commands {
             addSubNode: () => void;
         }
-        interface Config {
-            nodeCreator: boolean;
-        }
     }
 }
 declare const _default: import("../plugin").Plugin;

package/dist/plugins/pen.d.ts

@@ -1,6 +1,6 @@
 declare global {
     namespace Mce {
-        interface DrawingTools {
+        interface Tools {
             pen: [];
             pencil: [];
         }

package/dist/plugins/ruler.d.ts

@@ -1,16 +1,13 @@
 declare global {
     namespace Mce {
-        interface RulerConfig {
-            visible?: boolean;
-            adsorbed?: boolean;
-            lineColor?: string;
-            locked?: boolean;
-        }
-        interface Config {
+        interface UIConfig {
             ruler: RulerConfig;
         }
-        interface Options {
-            ruler?: boolean & RulerConfig;
+        interface RulerConfig {
+            visible: boolean;
+            adsorbed: boolean;
+            lineColor?: string;
+            locked: boolean;
         }
         interface Commands {
             clearRulerLines: () => void;

package/dist/plugins/scroll.d.ts

@@ -1,6 +1,12 @@
 import type { Element2D } from 'modern-canvas';
 declare global {
     namespace Mce {
+        interface UIConfig {
+            scrollbar: ScrollbarConfig;
+        }
+        interface ScrollbarConfig {
+            visible: boolean;
+        }
         type ScrollTarget = 'root' | 'selection' | {
             x: number;
         } | {
@@ -18,9 +24,6 @@ declare global {
             scrollTo: (target: ScrollTarget, options?: ScrollToOptions) => Promise<void>;
             scrollToSelection: (options?: ScrollToOptions) => void;
         }
-        interface Config {
-            scrollbar: boolean;
-        }
     }
 }
 declare const _default: import("../plugin").Plugin;

package/dist/plugins/selection.d.ts

@@ -3,6 +3,7 @@ declare global {
     namespace Mce {
         type SelectTarget = 'none' | 'all' | 'inverse' | 'children' | 'parent' | 'previousSibling' | 'nextSibling' | Node[];
         interface Commands {
+            startTransform: (event?: MouseEvent) => boolean;
             select: (target: SelectTarget) => void;
             marqueeSelect: (marquee?: Aabb2D) => void;
             selectAll: () => void;
@@ -43,17 +44,10 @@ declare global {
                 cancel: () => void;
             }) => void;
         }
-        interface BaseSelectionTransformContext {
-            startEvent: MouseEvent | PointerEvent;
-            handle: TransformHandle;
-        }
-        interface SelectionTransformContext extends BaseSelectionTransformContext {
-            value: TransformValue;
-        }
         interface Events {
-            selectionTransformStart: [context: BaseSelectionTransformContext];
-            selectionTransform: [context: SelectionTransformContext];
-            selectionTransformEnd: [context: BaseSelectionTransformContext];
+            selectionTransformStart: [context: TransformContext];
+            selectionTransform: [context: TransformContext];
+            selectionTransformEnd: [context: TransformContext];
         }
     }
 }

package/dist/plugins/shape.d.ts

@@ -1,6 +1,6 @@
 declare global {
     namespace Mce {
-        interface DrawingTools {
+        interface Tools {
             rectangle: [];
             line: [];
             arrow: [];

package/dist/plugins/smartGuides.d.ts

@@ -1,9 +1,2 @@
-declare global {
-    namespace Mce {
-        interface Commands {
-            snap: (axis: 'x' | 'y', position: number) => number;
-        }
-    }
-}
 declare const _default: import("../plugin").Plugin;
 export default _default;

package/dist/plugins/state.d.ts

@@ -2,7 +2,7 @@ declare global {
     namespace Mce {
         interface Commands {
             getState: () => State;
-            setState: (val: State) => void;
+            setState: (value: State) => void;
         }
     }
 }

package/dist/plugins/statusbar.d.ts

@@ -1,10 +1,10 @@
 declare global {
     namespace Mce {
-        interface Config {
-            statusbar: boolean;
+        interface UIConfig {
+            statusbar: StatusbarConfig;
         }
-        interface Panels {
-            statusbar: [];
+        interface StatusbarConfig {
+            visible: boolean;
         }
     }
 }

package/dist/plugins/timeline.d.ts

@@ -1,10 +1,10 @@
 declare global {
     namespace Mce {
-        interface Config {
-            timeline: boolean;
+        interface UIConfig {
+            timeline: TimelineConfig;
         }
-        interface Panels {
-            timeline: [];
+        interface TimelineConfig {
+            visible: boolean;
         }
     }
 }

package/dist/plugins/{drawingTool.d.ts → tool.d.ts}

@@ -1,7 +1,7 @@
 declare global {
     namespace Mce {
         interface Commands {
-            setActiveDrawingTool: (tool: string | keyof DrawingTools | undefined) => void;
+            activateTool: (tool: string | keyof Tools | undefined) => void;
         }
     }
 }

package/dist/plugins/toolbelt.d.ts

@@ -1,7 +1,10 @@
 declare global {
     namespace Mce {
-        interface Config {
-            toolbelt: boolean;
+        interface UIConfig {
+            toolbelt: ToolbeltConfig;
+        }
+        interface ToolbeltConfig {
+            visible: boolean;
         }
     }
 }

package/dist/plugins/transform.d.ts

@@ -1,5 +1,15 @@
+import type { DragContext } from '../utils';
 declare global {
     namespace Mce {
+        interface InteractionConfig {
+            transform: TransformConfig;
+        }
+        interface TransformConfig {
+            handleShape: 'rect' | 'circle';
+            handleStyle: '8-points' | '4-points';
+            lockAspectRatioStrategy: 'all' | 'diagonal';
+            rotator: boolean;
+        }
         interface TransformValue {
             left: number;
             top: number;
@@ -11,17 +21,39 @@ declare global {
         type TransformHandleDirection = 't' | 'l' | 'r' | 'b';
         type TransformHandleCorner = 'tl' | 'tr' | 'bl' | 'br';
         type TransformHandle = 'move' | `resize-${TransformHandleDirection | TransformHandleCorner}` | `rotate-${TransformHandleCorner}` | `round-${TransformHandleCorner}`;
-        type FlipType = 'horizontal' | 'vertical';
+        interface TransformContext extends DragContext {
+            handle: TransformHandle;
+            value: TransformValue;
+            oldValue: TransformValue;
+        }
+        type MoveDirection = 'left' | 'top' | 'right' | 'bottom';
+        type FlipDirection = 'horizontal' | 'vertical';
+        type TransformType = 'move' | 'resize' | 'rotate' | 'round';
+        interface TransformOptions {
+            event?: MouseEvent;
+            isCorner?: boolean;
+        }
         interface Commands {
             enter: () => void;
-            getTransformValue: () => TransformValue;
-            transform: (handle: Mce.TransformHandle, value: Partial<TransformValue>) => void;
-            flip: (type: Mce.FlipType) => void;
+            getTransform: () => TransformValue;
+            setTransform: (type: TransformType, value: Partial<TransformValue>, options?: TransformOptions) => void;
+            move: (direction: MoveDirection, distance?: number) => void;
+            moveLeft: (distance?: number) => void;
+            moveTop: (distance?: number) => void;
+            moveRight: (distance?: number) => void;
+            moveBottom: (distance?: number) => void;
+            rotate: (deg: number) => void;
+            rotate90: () => void;
+            flip: (direction: FlipDirection) => void;
             flipHorizontal: () => void;
             flipVertical: () => void;
         }
         interface Hotkeys {
             enter: [event: KeyboardEvent];
+            moveLeft: [event: KeyboardEvent];
+            moveTop: [event: KeyboardEvent];
+            moveRight: [event: KeyboardEvent];
+            moveBottom: [event: KeyboardEvent];
             flipHorizontal: [event: KeyboardEvent];
             flipVertical: [event: KeyboardEvent];
         }