yui-image-editor 1.0.0 → 1.0.3

package/dist/types/components/ImageEditor/editor.types.d.ts

@@ -0,0 +1,74 @@
+import { TuiImageEditor } from '../../types/index';
+import { Ref } from 'vue';
+/**
+ * 编辑器操作状态类型
+ */
+export interface EditorOperationStatus {
+    message: string;
+    type: 'success' | 'error' | 'info';
+}
+/**
+ * 编辑器响应式数据类型
+ */
+export interface EditorReactiveData {
+    canvasSize: {
+        width: number;
+        height: number;
+    };
+    mousePosition: {
+        x: number;
+        y: number;
+    };
+    elementCount: Ref<number>;
+    operationStatus: Ref<EditorOperationStatus | null>;
+}
+/**
+ * 编辑器实例方法类型（供外部调用）
+ */
+export interface ImageEditorInstance {
+    /** 显示操作状态提示 */
+    showStatus: (message: string, type?: 'success' | 'error' | 'info') => void;
+    /** 更新画布尺寸 */
+    updateCanvasSize: () => void;
+    /** 添加标题 */
+    addTitle: () => Promise<void>;
+    /** 添加时间戳 */
+    addTimestamp: () => Promise<void>;
+    /** 添加附图标签 */
+    addFigureLabel: () => Promise<void>;
+    /** 添加对比拉框 */
+    addComparisonBox: () => Promise<void>;
+    /** 添加标定目标 */
+    addCalibrationTarget: () => Promise<void>;
+    /** 获取编辑器核心实例 */
+    getCoreEditor: () => TuiImageEditor | null;
+    /** 销毁编辑器 */
+    destroy: () => void;
+}
+/**
+ * 编辑器组件 Props 类型（若后续扩展Props用）
+ */
+export interface ImageEditorProps {
+    /** 初始图片URL */
+    initialImageUrl?: string;
+    /** 编辑器宽度 */
+    width?: string | number;
+    /** 编辑器高度 */
+    height?: string | number;
+    /** 是否开启A4默认尺寸 */
+    defaultA4Size?: boolean;
+}
+/**
+ * 编辑器组件 Emits 类型
+ */
+export interface ImageEditorEmits {
+    /** 编辑器初始化完成事件 */
+    init: [editor: TuiImageEditor];
+    /** 操作状态变更事件 */
+    statusChange: [status: EditorOperationStatus | null];
+    /** 画布尺寸变更事件 */
+    canvasSizeChange: [size: {
+        width: number;
+        height: number;
+    }];
+}

package/dist/types/components/ImageEditor/index.d.ts

@@ -0,0 +1,117 @@
+export declare const zhLocale: {
+    Crop: string;
+    Rotate: string;
+    Flip: string;
+    Draw: string;
+    Shape: string;
+    Icon: string;
+    Text: string;
+    Mask: string;
+    Filter: string;
+    Resize: string;
+    Undo: string;
+    Redo: string;
+    Delete: string;
+    Save: string;
+    Load: string;
+    Download: string;
+    Reset: string;
+    Cancel: string;
+    OK: string;
+    Apply: string;
+    Close: string;
+    Free: string;
+    Original: string;
+    Square: string;
+    '4:3': string;
+    '3:4': string;
+    '16:9': string;
+    '9:16': string;
+    Custom: string;
+    Width: string;
+    Height: string;
+    Ratio: string;
+    'Lock ratio': string;
+    'Unlock ratio': string;
+    'Rotate CW': string;
+    'Rotate CCW': string;
+    'Flip X': string;
+    'Flip Y': string;
+    Rectangle: string;
+    Circle: string;
+    Triangle: string;
+    Line: string;
+    Pen: string;
+    Eraser: string;
+    Color: string;
+    Opacity: string;
+    Fill: string;
+    Stroke: string;
+    Font: string;
+    Size: string;
+    Align: string;
+    Left: string;
+    Center: string;
+    Right: string;
+    Bold: string;
+    Italic: string;
+    Underline: string;
+    'Text color': string;
+    Grayscale: string;
+    Sepia: string;
+    Sepia2: string;
+    Invert: string;
+    Brightness: string;
+    Contrast: string;
+    Saturation: string;
+    Hue: string;
+    Blur: string;
+    Sharpen: string;
+    'Remove White': string;
+    Distance: string;
+    Pixelate: string;
+    'Color Filter': string;
+    Threshold: string;
+    Noise: string;
+    'Image Loaded': string;
+    'Save image as': string;
+    'Are you sure you want to reset?': string;
+    'Failed to load image': string;
+    'Please select an image': string;
+    'Image size is too large': string;
+    'Minimum size is': string;
+    'Maximum size is': string;
+    Zoom: string;
+    'Zoom In': string;
+    'Zoom Out': string;
+    Hand: string;
+    History: string;
+    'Delete All': string;
+    'Fit to canvas': string;
+    'Actual size': string;
+    'Custom size': string;
+    'Background color': string;
+    'File type': string;
+    JPEG: string;
+    PNG: string;
+    Quality: string;
+    Duplicate: string;
+    'Bring to front': string;
+    'Send to back': string;
+    'Blend mode': string;
+    Arrow: string;
+    'Arrow-2': string;
+    'Arrow-3': string;
+    'Star-1': string;
+    'Star-2': string;
+    Polygon: string;
+    Location: string;
+    Heart: string;
+    Bubble: string;
+    DeleteAll: string;
+    ZoomIn: string;
+    ZoomOut: string;
+    'Text size': string;
+    'Lock Aspect Ratio': string;
+};
+export declare const customTheme: {};

package/dist/types/index.d.ts

@@ -1 +1,85 @@
-export {}
+import { default as YuiImageEditor } from './components/ImageEditor/index';
+import { YuiImageEditorProps } from './types/component';
+import { App } from 'vue';
+import type * as TuiEditorTypes from '@/types/index';
+declare const ImageEditorComponent: {
+    new (): {
+        $props: YuiImageEditorProps;
+    } & typeof YuiImageEditor;
+};
+export { ImageEditorComponent as ImageEditor, YuiImageEditor };
+export type { TuiEditorTypes, YuiImageEditorProps };
+declare const _default: {
+    install: (app: App) => void;
+    YuiImageEditor: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        initialImageUrl: {
+            type: StringConstructor;
+            default: string;
+        };
+        width: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+        };
+        height: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: number;
+        };
+        defaultA4Size: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>, {
+        showStatus: (message: string, type?: "success" | "error" | "info") => void;
+        updateCanvasSize: () => void;
+        addTitle: () => Promise<void>;
+        addTimestamp: () => Promise<void>;
+        addFigureLabel: () => Promise<void>;
+        addComparisonBox: () => Promise<void>;
+        addCalibrationTarget: () => Promise<void>;
+        getCoreEditor: () => TuiEditorTypes.TuiImageEditor | null;
+        destroy: () => void;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        init: (editor: TuiEditorTypes.TuiImageEditor) => any;
+        statusChange: (status: import('./components/ImageEditor/editor.types').EditorOperationStatus | null) => any;
+        canvasSizeChange: (size: {
+            width: number;
+            height: number;
+        }) => any;
+    }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        initialImageUrl: {
+            type: StringConstructor;
+            default: string;
+        };
+        width: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+        };
+        height: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: number;
+        };
+        defaultA4Size: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        onInit?: ((editor: TuiEditorTypes.TuiImageEditor) => any) | undefined;
+        onStatusChange?: ((status: import('./components/ImageEditor/editor.types').EditorOperationStatus | null) => any) | undefined;
+        onCanvasSizeChange?: ((size: {
+            width: number;
+            height: number;
+        }) => any) | undefined;
+    }>, {
+        width: string | number;
+        height: string | number;
+        initialImageUrl: string;
+        defaultA4Size: boolean;
+    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+        editorContainer: HTMLDivElement;
+        editorRef: HTMLDivElement;
+    }, HTMLDivElement>;
+    ImageEditor: new () => {
+        $props: YuiImageEditorProps;
+    } & typeof YuiImageEditor;
+};
+export default _default;

package/dist/types/router/index.d.ts

@@ -0,0 +1,2 @@
+declare const router: import('vue-router').Router;
+export default router;

package/dist/types/stores/counter.d.ts

@@ -0,0 +1,13 @@
+export declare const useCounterStore: import('pinia').StoreDefinition<"counter", Pick<{
+    count: import('vue').Ref<number, number>;
+    doubleCount: import('vue').ComputedRef<number>;
+    increment: () => void;
+}, "count">, Pick<{
+    count: import('vue').Ref<number, number>;
+    doubleCount: import('vue').ComputedRef<number>;
+    increment: () => void;
+}, "doubleCount">, Pick<{
+    count: import('vue').Ref<number, number>;
+    doubleCount: import('vue').ComputedRef<number>;
+    increment: () => void;
+}, "increment">>;

package/dist/types/types/component.d.ts

@@ -0,0 +1,53 @@
+import { CSSProperties, ExtractPropTypes, PropType } from 'vue';
+export declare const YuiImageEditorProps: {
+    /** 图片源地址（必传） */
+    readonly src: {
+        readonly type: StringConstructor;
+        readonly required: true;
+        readonly description: "图片的URL地址";
+    };
+    /** 图片宽度（默认800px） */
+    readonly width: {
+        readonly type: NumberConstructor;
+        readonly default: 800;
+        readonly description: "图片编辑器宽度（px）";
+    };
+    /** 图片高度（默认600px） */
+    readonly height: {
+        readonly type: NumberConstructor;
+        readonly default: 600;
+        readonly description: "图片编辑器高度（px）";
+    };
+    /** 自定义样式 */
+    readonly customStyle: {
+        readonly type: PropType<CSSProperties>;
+        readonly default: () => {};
+        readonly description: "自定义组件样式";
+    };
+    /** 显示/隐藏元数据面板 */
+    readonly showMetadata: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+        readonly description: "是否显示图片元数据面板";
+    };
+};
+export type YuiImageEditorProps = ExtractPropTypes<typeof YuiImageEditorProps>;
+export type YuiImageEditorEmits = {
+    /** 图片加载完成事件 */
+    load: [imgInfo: {
+        width: number;
+        height: number;
+    }];
+    /** 图片点击事件 */
+    click: [e: MouseEvent];
+};
+export type YuiImageEditorInstance = {
+    /** 重置图片编辑器 */
+    reset: () => void;
+    /** 获取当前图片信息 */
+    getImageInfo: () => {
+        src: string;
+        width: number;
+        height: number;
+    };
+};

package/dist/types/types/index.d.ts

@@ -0,0 +1,130 @@
+/**
+ * tui-image-editor 核心接口定义
+ * 根据实际使用的方法进行扩展
+ */
+export interface TuiImageEditor {
+    destroy(): void;
+    getCanvasSize(): {
+        width: number;
+        height: number;
+    };
+    resizeCanvasDimension(dimensions: {
+        width: number;
+        height: number;
+    }): Promise<void>;
+    setCanvasBackgroundColor(color: string): void;
+    addText(text: string, options: TextOptions): Promise<ObjectProps>;
+    addShape(type: string, options: ShapeOptions): Promise<ObjectProps>;
+    addImageObject(url: string, options?: ImageObjectOptions): Promise<ObjectProps>;
+    resetZoom(): void;
+    resize(dimensions: {
+        width: number;
+        height: number;
+    }): Promise<void>;
+    ui: {
+        resizeEditor(): void;
+    };
+}
+/**
+ * 对象属性接口
+ */
+export interface ObjectProps {
+    id: string;
+    [key: string]: unknown;
+}
+/**
+ * 文字选项接口
+ */
+export interface TextOptions {
+    styles?: {
+        fill: string;
+        fontSize: number;
+        fontFamily: string;
+        fontWeight?: string;
+        textAlign?: string;
+    };
+    position: {
+        x: number;
+        y: number;
+    };
+    isSilent?: boolean;
+    left?: number;
+    top?: number;
+    fontSize?: number;
+    fontFamily?: string;
+    fill?: string;
+    stroke?: string;
+    strokeWidth?: number;
+    [key: string]: any;
+}
+/**
+ * 形状选项接口
+ */
+export interface ShapeOptions {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    fill: string;
+    stroke: string;
+    strokeWidth: number;
+    strokeDashArray?: [number, number];
+    [key: string]: any;
+}
+/**
+ * 图片对象选项接口
+ */
+export interface ImageObjectOptions {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    [key: string]: any;
+}
+/**
+ * 编辑器配置接口
+ */
+export interface EditorConfig {
+    includeUI?: {
+        loadImage?: {
+            path: string;
+            name: string;
+        };
+        theme?: any;
+        initMenu?: string;
+        menuBarPosition?: 'top' | 'bottom' | 'left' | 'right';
+        menu?: string[];
+        locale?: any;
+    };
+    cssMaxWidth?: number;
+    cssMaxHeight?: number;
+    selectionStyle?: {
+        cornerSize?: number;
+        rotatingPointOffset?: number;
+    };
+    usageStatistics?: boolean;
+    [key: string]: any;
+}
+/**
+ * 坐标点接口
+ */
+export interface Point {
+    x: number;
+    y: number;
+}
+/**
+ * 尺寸接口
+ */
+export interface Size {
+    width: number;
+    height: number;
+}
+/**
+ * 矩形区域接口
+ */
+export interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}

package/dist/types/types/shims-svg.d.ts

@@ -0,0 +1,24 @@
+// src/types/shims-svg.d.ts
+declare module '*.svg' {
+  // 导出 SVG 的默认值（适配 Vue 项目的 SVG 导入）
+  const content: string;
+  export default content;
+}
+
+// 顺便把其他静态资源也声明了，避免后续爆红
+declare module '*.png' {
+  const content: string;
+  export default content;
+}
+declare module '*.jpg' {
+  const content: string;
+  export default content;
+}
+declare module '*.jpeg' {
+  const content: string;
+  export default content;
+}
+declare module '*.gif' {
+  const content: string;
+  export default content;
+}

package/dist/types/utils/specialMapTool.d.ts

@@ -0,0 +1,33 @@
+import { ObjectProps, TuiImageEditor } from '../types';
+export declare class SpecialMapTool {
+    private editor;
+    private colors;
+    private fonts;
+    private addedElements;
+    constructor(editorInstance: TuiImageEditor);
+    setA4Landscape(): Promise<{
+        width: number;
+        height: number;
+    }>;
+    addTitle(text?: string): Promise<ObjectProps>;
+    addFigureLabel(text?: string): Promise<ObjectProps>;
+    addTimestamp(): Promise<ObjectProps>;
+    addYellowLabel(text: string, x: number, y: number): Promise<ObjectProps>;
+    addBlueLabel(text: string, x: number, y: number): Promise<ObjectProps>;
+    addComparisonBox(x: number, y: number, width: number, height: number, label?: string): Promise<ObjectProps>;
+    addCalibrationTarget(x: number, y: number, width: number, height: number): Promise<ObjectProps>;
+    addCompass(x: number, y: number, size?: number): Promise<ObjectProps>;
+    createFullSpecialMap(title?: string, figureLabel?: string): Promise<{
+        canvasSize: {
+            width: number;
+            height: number;
+        };
+        message: string;
+    }>;
+    getAllElements(): Array<{
+        id: string;
+        type: string;
+        properties: any;
+    }>;
+    clearAllElements(): Promise<void>;
+}

package/dist/types/views/HomeView.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/dist/types/views/MapPluginView.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/dist/types/views/TestView.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;