mce 0.13.5 → 0.13.7

package/dist/components/EditorLayout.vue.d.ts

@@ -1,15 +1,17 @@
 import type { OrientedBoundingBox } from '../types';
 import { Editor } from '../editor';
 type __VLS_Slots = {
-    selector?: (props: {
+    'selector'?: (props: {
         box: OrientedBoundingBox;
     }) => void;
-    transformer?: (props: {
+    'transformer'?: (props: {
         box: Partial<OrientedBoundingBox>;
     }) => void;
-    floatbar?: () => void;
-    drawboard?: () => void;
-    default?: () => void;
+    'floatbar'?: () => void;
+    'floatbar-top'?: () => void;
+    'floatbar-bottom'?: () => void;
+    'drawboard'?: () => void;
+    'default'?: () => void;
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     editor: typeof Editor;

package/dist/components/Floatbar.vue.d.ts

@@ -4,10 +4,7 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_7) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    location: {
-        type: import("vue").PropType<import("@floating-ui/vue").Side | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start" | "bottom-end" | "bottom-start">;
-        default: NonNullable<import("@floating-ui/vue").Side | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start" | "bottom-end" | "bottom-start">;
-    };
+    location: import("vue").PropType<import("@floating-ui/vue").Side | import("@floating-ui/vue").AlignedPlacement>;
     offset: {
         type: import("vue").PropType<number>;
         default: number;
@@ -30,10 +27,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }>, {
     updateLocation: typeof updateLocation;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    location: {
-        type: import("vue").PropType<import("@floating-ui/vue").Side | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start" | "bottom-end" | "bottom-start">;
-        default: NonNullable<import("@floating-ui/vue").Side | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start" | "bottom-end" | "bottom-start">;
-    };
+    location: import("vue").PropType<import("@floating-ui/vue").Side | import("@floating-ui/vue").AlignedPlacement>;
     offset: {
         type: import("vue").PropType<number>;
         default: number;
@@ -55,7 +49,6 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     };
 }>> & Readonly<{}>, {
     offset: number;
-    location: import("@floating-ui/vue").Side | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start" | "bottom-end" | "bottom-start";
     attach: string | boolean | Element | null | undefined;
     middlewares: any[] | ("shift" | "flip" | "offset")[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/components/MadeWith.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1,89 @@
+import type { ImageFillCropRect } from 'modern-idoc';
+/**
+ * TODO 撤回无法重渲
+ */
+type __VLS_Props = {
+    image: string;
+    minScale?: number;
+    maxScale?: number;
+};
+declare function ok(): void;
+declare function cancel(): void;
+declare function applySourceTransformToStyle(): void;
+type __VLS_ModelProps = {
+    /**
+     * CropRect (value are based on CropRect !!!)
+     *
+     * @example
+     *
+     * cropRect: { left: 0.3, top: 0.3, right: 0.3, bottom: 0.3 }
+     *
+     * Before:
+     *
+     *       View (Source)
+     *     |---0---|
+     *     |       |
+     *     0       0
+     *     |       |
+     *     |---0---|
+     *
+     * After:
+     *
+     *  Source
+     *  |----- 0 -----|
+     *  |    View     |
+     *  |  |--0.3--|  |
+     *  |  |       |  |
+     *  0 0.3     0.3 0
+     *  |  |       |  |
+     *  |  |--0.3--|  |
+     *  |             |
+     *  |----- 0 -----|
+     */
+    modelValue?: ImageFillCropRect;
+    'style'?: Record<string, any>;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_5: {
+    scale: number;
+    ok: typeof ok;
+    cancel: typeof cancel;
+    applySourceTransformToStyle: typeof applySourceTransformToStyle;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    end: () => any;
+    start: () => any;
+    "update:modelValue": (value: ImageFillCropRect) => any;
+    "update:transform": (args_0: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    }) => any;
+    "update:style": (value: Record<string, any>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onEnd?: (() => any) | undefined;
+    onStart?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: ImageFillCropRect) => any) | undefined;
+    "onUpdate:transform"?: ((args_0: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    }) => any) | undefined;
+    "onUpdate:style"?: ((value: Record<string, any>) => any) | undefined;
+}>, {
+    minScale: number;
+    maxScale: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/composables/editor.d.ts

@@ -1,3 +1,2 @@
 import { Editor } from '../editor';
 export declare function useEditor(): Editor;
-export declare function provideEditor(editor?: Editor): Editor;

package/dist/editor.d.ts

@@ -4,6 +4,7 @@ import type { App, InjectionKey } from 'vue';
 import { Observable } from 'modern-idoc';
 export interface Options extends Mce.Options {
     debug?: boolean;
+    showMadeWith?: boolean;
     plugins?: Plugin[];
     configCacheInLocal?: boolean;
 }
@@ -14,6 +15,7 @@ export interface Events extends Mce.Events, ObservableEvents {
 export declare class Editor extends Observable<Events> {
     static injectionKey: InjectionKey<Editor>;
     debug: import("vue").Ref<boolean, boolean>;
+    showMadeWith: import("vue").Ref<boolean, boolean>;
     config: RemovableRef<Mce.Config>;
     onEmit?: <K extends keyof Events & string>(event: K, ...args: Events[K]) => void;
     plugins: Map<string, PluginObject>;

package/dist/index.css

@@ -150,12 +150,117 @@
   overflow: hidden;
   text-overflow: ellipsis;
   background-color: rgba(var(--mce-theme-surface), 1);
+}.mce-floatbar {
+  overflow: visible;
+}.mce-transformable {
+  left: 0;
+  top: 0;
+}
+.mce-transformable__svg {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+  pointer-events: none;
+  color: rgb(var(--mce-theme-primary));
+  stroke: currentColor;
+}
+.mce-transformable__diagonal {
+  stroke-width: 1px;
+  stroke-dasharray: 2px;
+  visibility: hidden;
+}
+.mce-transformable__rect {
+  stroke-width: 1px;
+}
+.mce-transformable__handle {
+  fill: white;
+  stroke-width: 1px;
+  pointer-events: none;
+}
+.mce-transformable__handle-rect {
+  stroke-width: 1px;
+  fill: transparent;
+  stroke: transparent;
+}
+.mce-transformable__tip {
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translate(-50%, calc(100% + 8px));
+  background-color: rgb(var(--mce-theme-primary));
+  color: rgb(var(--mce-theme-on-primary));
+  font-size: 12px;
+  padding: 2px 4px;
+  border-radius: 3px;
+  text-wrap: nowrap;
+}
+.mce-transformable--dashed .mce-transformable__rect {
+  stroke-dasharray: 4px;
+}
+.mce-transformable--resizing .mce-transformable__diagonal {
+  visibility: visible;
+}
+.mce-transformable--moving .mce-transformable__handle {
+  visibility: hidden;
+}
+.mce-transformable--moving .mce-transformable__handle-rect {
+  visibility: hidden;
+}
+.mce-transformable--moving .mce-transformable__rect {
+  opacity: 0.4;
+  stroke-width: 0.5px;
+}
+.mce-transformable--moving .mce-transformable__svg-slot {
+  opacity: 0.4;
+  stroke-width: 0.5px;
+}
+.mce-transformable--hide-ui .mce-transformable__handle {
+  visibility: hidden;
+}
+.mce-transformable--hide-ui .mce-transformable__handle-rect {
+  visibility: hidden;
+}
+.mce-transformable--hide-ui .mce-transformable__rect {
+  visibility: hidden;
+}.mce-cropper {
+  pointer-events: auto;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+}
+.mce-cropper__source {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  transform-origin: top left;
+}
+.mce-cropper__source canvas {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.mce-cropper__transformable {
+  position: absolute;
+  color: rgba(var(--mce-theme-primary), 1);
+  opacity: 0.5;
+}
+.mce-cropper__transformable_rect {
+  width: 100%;
+  height: 100%;
 }.mce-frame {
   position: absolute;
 }
 .mce-frame--outline {
   outline: 1px solid rgba(0, 0, 0, 0.168627451);
 }
+.mce-frame--hover .mce-frame__name > div, .mce-frame--selected .mce-frame__name > div {
+  opacity: 1;
+}
 .mce-frame__name {
   position: absolute;
   top: 0;
@@ -172,18 +277,22 @@
   position: relative;
   min-width: 28px;
   box-sizing: content-box;
-  color: rgba(var(--mce-theme-on-surface), 0.8);
+  color: rgb(var(--mce-theme-on-surface));
+  opacity: 0.5;
 }
 .mce-frame__name > input {
   position: absolute;
   left: 0;
   top: 0;
-  outline: none;
+  padding: 0;
   width: 100%;
   height: 100%;
-  border: 1px solid rgba(0, 0, 0, 0.168627451);
-  border-radius: 4px;
+  border: none;
+  outline: 1px solid rgb(var(--mce-theme-primary));
   cursor: default;
+  font-size: inherit;
+  font-weight: inherit;
+  border-radius: 2px;
 }.mce-back-selected-aera {
   pointer-events: auto !important;
   position: absolute;
@@ -355,6 +464,26 @@
 }
 .mce-layers:hover .mce-layer:not(.mce-layer--root) .mce-layer__expand {
   opacity: 1;
+}.mce-made-with {
+  pointer-events: auto !important;
+  position: absolute;
+  right: 18px;
+  bottom: 18px;
+  opacity: 0.38;
+  color: #000;
+  text-align: center;
+  font-size: 12px;
+  line-height: 1;
+  border: 2px solid currentColor;
+  padding: 2px 4px;
+  border-radius: 4px;
+  box-sizing: border-box;
+  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
+  text-decoration: none;
+}
+.mce-made-with div:last-child {
+  font-weight: bold;
+  letter-spacing: 1px;
 }.mce-tooltip {
   background: rgb(var(--mce-theme-surface-variant));
   color: rgb(var(--mce-theme-on-surface-variant));
@@ -450,80 +579,10 @@
 }
 .mce-scrollbar__thumb--active, .mce-scrollbar__thumb:hover {
   background-color: rgba(var(--mce-theme-on-background), var(--mce-medium-emphasis-opacity));
-}.mce-transformable {
-  left: 0;
-  top: 0;
-}
-.mce-transformable__svg {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  overflow: visible;
-  pointer-events: none;
-  color: rgb(var(--mce-theme-primary));
-  stroke: currentColor;
-}
-.mce-transformable__diagonal {
-  stroke-width: 1px;
-  stroke-dasharray: 2px;
-  visibility: hidden;
-}
-.mce-transformable__rect {
-  stroke-width: 1px;
-}
-.mce-transformable__handle {
-  fill: white;
-  stroke-width: 1px;
-  pointer-events: none;
-}
-.mce-transformable__handle-rect {
-  stroke-width: 1px;
-  fill: transparent;
-  stroke: transparent;
-}
-.mce-transformable__tip {
+}.mce-selector__slot {
   position: absolute;
-  bottom: 0;
-  left: 50%;
-  transform: translate(-50%, calc(100% + 8px));
-  background-color: rgb(var(--mce-theme-primary));
-  color: rgb(var(--mce-theme-on-primary));
-  font-size: 12px;
-  padding: 2px 4px;
-  border-radius: 3px;
-  text-wrap: nowrap;
-}
-.mce-transformable--dashed .mce-transformable__rect {
-  stroke-dasharray: 4px;
 }
-.mce-transformable--resizing .mce-transformable__diagonal {
-  visibility: visible;
-}
-.mce-transformable--moving .mce-transformable__handle {
-  visibility: hidden;
-}
-.mce-transformable--moving .mce-transformable__handle-rect {
-  visibility: hidden;
-}
-.mce-transformable--moving .mce-transformable__rect {
-  opacity: 0.4;
-  stroke-width: 0.5px;
-}
-.mce-transformable--moving .mce-transformable__svg-slot {
-  opacity: 0.4;
-  stroke-width: 0.5px;
-}
-.mce-transformable--hide-ui .mce-transformable__handle {
-  visibility: hidden;
-}
-.mce-transformable--hide-ui .mce-transformable__handle-rect {
-  visibility: hidden;
-}
-.mce-transformable--hide-ui .mce-transformable__rect {
-  visibility: hidden;
-}.mce-parent-element-obb {
+.mce-selector__parent-element {
   position: absolute;
   pointer-events: none;
   border-width: 1px;
@@ -531,18 +590,18 @@
   color: rgba(var(--mce-theme-primary), 1);
   opacity: 0.5;
 }
-.mce-selected-area {
+.mce-selector__selected-area {
   position: absolute;
   border-width: 1px;
   border-style: solid;
   color: rgba(var(--mce-theme-primary), 1);
   background-color: rgba(var(--mce-theme-primary), 0.1);
 }
-.mce-selection-obb {
+.mce-selector__transform {
   position: absolute;
   color: rgba(var(--mce-theme-primary), 1);
 }
-.mce-element-obb {
+.mce-selector__element {
   position: absolute;
   border-width: 1px;
   border-style: solid;

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import './typed-global.d.ts';
 import './typed-plugins.d.ts';
 export { default as EditorLayout } from './components/EditorLayout.vue';
 export { default as EditorLayers } from './components/Layers.vue';
+export { default as Cropper } from './components/shared/Cropper.vue';
 export { default as Dialog } from './components/shared/Dialog.vue';
 export { default as EditorLayoutItem } from './components/shared/LayoutItem.vue';
 export { default as Menu } from './components/shared/Menu.vue';