mce 0.13.14 → 0.13.16

package/dist/components/shared/Dialog.vue.d.ts

@@ -3,7 +3,7 @@ declare var __VLS_8: {
     props: {
         ref: (el: any) => any;
     };
-    isActive: boolean | undefined;
+    isActive: boolean;
 }, __VLS_10: {};
 type __VLS_Slots = {} & {
     activator?: (props: typeof __VLS_8) => any;

package/dist/components/shared/Overlay.vue.d.ts

@@ -2,7 +2,7 @@ declare var __VLS_1: {
     props: {
         ref: (el: any) => any;
     };
-    isActive: boolean | undefined;
+    isActive: boolean;
 }, __VLS_8: {};
 type __VLS_Slots = {} & {
     activator?: (props: typeof __VLS_1) => any;
@@ -10,6 +10,7 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: BooleanConstructor;
     location: import("vue").PropType<import("@floating-ui/vue").Side | import("@floating-ui/vue").AlignedPlacement>;
     offset: NumberConstructor;
     middlewares: {
@@ -24,18 +25,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         type: import("vue").PropType<string | boolean | Element | null | undefined>;
         default: undefined;
     };
-    modelValue: {
-        type: import("vue").PropType<boolean>;
-    };
 }>, {
     activatorEl: import("vue").Ref<any, any>;
     target: import("vue").ComputedRef<any>;
     contentEl: Readonly<import("vue").ShallowRef<HTMLDivElement | null>>;
     updateLocation: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: boolean | undefined) => any;
+    "update:modelValue": (val: boolean) => any;
     "click:outside": (event: MouseEvent) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: BooleanConstructor;
     location: import("vue").PropType<import("@floating-ui/vue").Side | import("@floating-ui/vue").AlignedPlacement>;
     offset: NumberConstructor;
     middlewares: {
@@ -50,15 +49,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         type: import("vue").PropType<string | boolean | Element | null | undefined>;
         default: undefined;
     };
-    modelValue: {
-        type: import("vue").PropType<boolean>;
-    };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((val: boolean) => any) | undefined;
     "onClick:outside"?: ((event: MouseEvent) => any) | undefined;
 }>, {
     attach: string | boolean | Element | null | undefined;
     middlewares: ("shift" | "flip" | "offset")[];
+    modelValue: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/shared/Tooltip.vue.d.ts

@@ -5,7 +5,7 @@ declare var __VLS_8: {
         onMouseleave: () => boolean;
         ref: (el: any) => any;
     };
-    isActive: boolean | undefined;
+    isActive: boolean;
 }, __VLS_10: {};
 type __VLS_Slots = {} & {
     activator?: (props: typeof __VLS_8) => any;

package/dist/index.js

@@ -1,5 +1,5 @@
 import { Node as Node$1, Element2D, Timeline, Engine, Camera2D, DrawboardEffect, IN_BROWSER, clamp, assets, TimelineNode, Transform2D, DEG_TO_RAD, render, Animation, IN_MAC_OS } from "modern-canvas";
-import { ref, computed, watch, markRaw, reactive, warn, shallowRef, onBeforeUnmount, defineComponent, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, toDisplayString, createVNode, useAttrs, createBlock, resolveDynamicComponent, normalizeClass, mergeProps, createElementVNode, inject, toValue, getCurrentInstance, provide, readonly, toRef, onMounted, useId, onDeactivated, onActivated, onScopeDispose, useModel, useTemplateRef, withDirectives, vShow, vModelText, nextTick, Fragment, renderList, renderSlot, mergeModels, resolveComponent, withCtx, withModifiers, Teleport, createTextVNode, createSlots, normalizeProps, guardReactiveProps, onBeforeMount, isRef, h } from "vue";
+import { ref, computed, watch, markRaw, reactive, warn, shallowRef, onBeforeUnmount, defineComponent, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, toDisplayString, createVNode, useAttrs, createBlock, resolveDynamicComponent, normalizeClass, mergeProps, createElementVNode, inject, toValue, getCurrentInstance, provide, readonly, toRef, onMounted, useId, onDeactivated, onActivated, onScopeDispose, useModel, useTemplateRef, withDirectives, vShow, vModelText, nextTick, Fragment, renderList, renderSlot, mergeModels, resolveComponent, withCtx, withModifiers, Teleport, createTextVNode, createSlots, normalizeProps, guardReactiveProps, onBeforeMount, isRef, h, useSlots } from "vue";
 import { useFileDialog, useEventListener, isClient, onClickOutside, useDebounceFn, useResizeObserver as useResizeObserver$1, useLocalStorage, useImage } from "@vueuse/core";
 import { getObjectValueByPath, setObjectValueByPath, Observable, Reactivable, idGenerator, property, normalizeElement, normalizeTextContent, normalizeCRLF, isEqualObject } from "modern-idoc";
 import { saveAs } from "file-saver";
@@ -915,10 +915,7 @@ const _0_context = defineMixin((editor) => {
   }
   function getGlobalPointer() {
     const { x = 0, y = 0 } = drawboardPointer.value ?? {};
-    return camera.value.toGlobal({
-      x: x - drawboardAabb.value.left,
-      y: y - drawboardAabb.value.top
-    }, { x: 0, y: 0 });
+    return camera.value.toGlobal({ x, y }, { x: 0, y: 0 });
   }
   const block = ["top", "bottom"];
   const inline = ["start", "end", "left", "right"];
@@ -4394,8 +4391,8 @@ const _frame = definePlugin((editor) => {
           el.style.backgroundColor = "#ffffff";
           return {
             move: (move) => {
-              el.style.width = move.x - start.x;
-              el.style.height = move.y - start.y;
+              el.style.width = Math.abs(move.x - start.x);
+              el.style.height = Math.abs(move.y - start.y);
             },
             end: () => {
               setActiveDrawingTool(void 0);
@@ -4741,11 +4738,15 @@ const _import = definePlugin((editor) => {
       const {
         drawboardPointer,
         drawboardDom,
+        drawboardAabb,
         exec
       } = editor;
       function onDragover(e) {
         e.preventDefault();
-        drawboardPointer.value = { x: e.clientX, y: e.clientY };
+        drawboardPointer.value = {
+          x: e.clientX - drawboardAabb.value.left,
+          y: e.clientY - drawboardAabb.value.top
+        };
         if (e.dataTransfer) {
           e.dataTransfer.dropEffect = "copy";
         }
@@ -5435,18 +5436,19 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     inheritAttrs: false
   },
   __name: "Overlay",
-  props: /* @__PURE__ */ mergeModels({
-    ...makeMceOverlayProps()
-  }, {
-    "modelValue": { type: Boolean },
-    "modelModifiers": {}
-  }),
-  emits: /* @__PURE__ */ mergeModels(["click:outside"], ["update:modelValue"]),
+  props: {
+    ...makeMceOverlayProps(),
+    modelValue: Boolean
+  },
+  emits: ["update:modelValue", "click:outside"],
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emit = __emit;
     const overlayItem = useOverlay();
-    const isActive = useModel(__props, "modelValue");
+    const isActive = computed({
+      get: () => props.modelValue,
+      set: (val) => emit("update:modelValue", val)
+    });
     const activatorEl = ref();
     const virtualElement = {
       getBoundingClientRect() {
@@ -5502,7 +5504,13 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
             emit("click:outside", e);
           }
         },
-        { controls: true, ignore: computed(() => [activatorEl.value]) }
+        {
+          controls: true,
+          ignore: computed(() => [
+            contentEl.value,
+            activatorEl.value
+          ])
+        }
       );
       clearup = [
         stop,
@@ -10858,8 +10866,8 @@ const _shape = definePlugin((editor) => {
       });
       return {
         move: (move) => {
-          el.style.width = move.x - start.x;
-          el.style.height = move.y - start.y;
+          el.style.width = Math.abs(move.x - start.x);
+          el.style.height = Math.abs(move.y - start.y);
         },
         end: () => {
           setActiveDrawingTool(void 0);
@@ -14209,7 +14217,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       snapThreshold,
       getSnapPoints
     } = useEditor();
-    const transformable = useTemplateRef("transformableRef");
+    const transformable = useTemplateRef("transformableTpl");
     onBeforeMount(() => {
       registerCommand({ command: "startTransform", handle: (e) => Boolean(transformable.value?.start(e)) });
     });
@@ -14377,7 +14385,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
         }), 128)),
         selectionTransform.value.width && selectionTransform.value.height ? (openBlock(), createBlock(_sfc_main$a, {
           key: 1,
-          ref: "transformableRef",
+          ref: "transformableTpl",
           modelValue: selectionTransform.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectionTransform.value = $event),
           movable: movable.value,
@@ -14699,6 +14707,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
+    const slots = useSlots();
     let editor;
     if (props.editor) {
       editor = props.editor;
@@ -14981,7 +14990,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       if (event.srcElement !== drawboardDom.value) {
         return;
       }
-      drawboardPointer.value = { x: event.clientX, y: event.clientY };
+      drawboardPointer.value = {
+        x: event.clientX - drawboardAabb.value.left,
+        y: event.clientY - drawboardAabb.value.top
+      };
       if (camera.value.grabbing || event.button === 1 || state.value && state.value !== "typing") {
         return;
       }
@@ -15052,7 +15064,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   ]),
                   _: 3
                 }, 8, ["selected-area", "resize-strategy"]),
-                _ctx.$slots.floatbar || _ctx.$slots["floatbar-top"] ? (openBlock(), createBlock(_sfc_main$b, {
+                slots.floatbar || slots["floatbar-top"] ? (openBlock(), createBlock(_sfc_main$b, {
                   key: 0,
                   location: "top-start",
                   target: unref(state) === "typing" ? textEditor.value?.textEditor : selector.value?.transformable?.$el
@@ -15063,7 +15075,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   ]),
                   _: 3
                 }, 8, ["target"])) : createCommentVNode("", true),
-                _ctx.$slots["floatbar-bottom"] ? (openBlock(), createBlock(_sfc_main$b, {
+                slots["floatbar-bottom"] ? (openBlock(), createBlock(_sfc_main$b, {
                   key: 1,
                   location: "bottom-start",
                   target: selector.value?.transformable?.$el

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mce",
   "type": "module",
-  "version": "0.13.14",
+  "version": "0.13.16",
   "description": "The headless canvas editor framework. only the ESM.",
   "author": "wxm",
   "license": "MIT",