@duxweb/dvha-pro 1.0.24 → 1.0.26

package/dist/types/components/posterEditor/hooks/usePosterEditor.d.ts

@@ -0,0 +1,48 @@
+import type { FabricObject } from 'fabric';
+import type { ComputedRef, Ref } from 'vue';
+import type { AlignType, CanvasData, ElementConfig, ElementData } from '../elements/types';
+interface PosterEditorOptions {
+    width?: number;
+    height?: number;
+    backgroundColor?: string;
+    backgroundImage?: string;
+}
+export interface PosterEditorReturn {
+    initCanvas: (element: HTMLCanvasElement, container?: HTMLElement) => void;
+    destroy: () => void;
+    setCallbacks: (callbacks: {
+        onDataChange?: (data?: string) => void;
+    }) => void;
+    addElement: (type: string, customProps?: Record<string, any>) => Promise<string | undefined>;
+    deleteSelectedElements: () => void;
+    updateElementProperty: (elementId: string, key: string, value: any) => void;
+    alignElements: (alignType: AlignType) => void;
+    canMoveUp: ComputedRef<boolean>;
+    canMoveDown: ComputedRef<boolean>;
+    canMoveToFront: ComputedRef<boolean>;
+    canMoveToBack: ComputedRef<boolean>;
+    clearCanvas: () => void;
+    loadData: (data?: string) => void;
+    updateData: () => void;
+    canvas: Ref<any>;
+    canvasData: Ref<CanvasData>;
+    selectedElements: Ref<FabricObject[]>;
+    canvasScale: Ref<number>;
+    currentElement: ComputedRef<FabricObject | null>;
+    currentElementData: ComputedRef<ElementData | null>;
+    currentElementConfig: ComputedRef<ElementConfig | null>;
+    hasMultipleSelection: ComputedRef<boolean>;
+    clearSelection: () => void;
+    updateCanvasSize: () => void;
+    setupAutoResize: (container: HTMLElement) => () => void;
+    getSelectedElementProperty: (key: string) => any;
+    selectedElementsData: ComputedRef<ElementData[]>;
+    syncAllFabricObjectsToData: () => void;
+    updateCanvasSettings: (width: number, height: number) => void;
+    updateCanvasBackground: (color: string) => void;
+    updateCanvasBackgroundImage: (imageUrl: string) => void;
+    saveData: () => void;
+    exportJson: () => void;
+}
+export declare function usePosterEditor(options?: PosterEditorOptions): PosterEditorReturn;
+export {};

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

@@ -0,0 +1,4 @@
+export * from './elements';
+export * from './hooks';
+export * from './posterEditor';
+export * from './types/editor';

package/dist/types/components/posterEditor/pages/LeftToolbar.d.ts

@@ -0,0 +1,33 @@
+import type { PropType } from 'vue';
+export interface LeftToolbarProps {
+    onAddElement: (type: string) => void;
+    canvasWidth: number;
+    canvasHeight: number;
+}
+export declare const LeftToolbar: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    onAddElement: {
+        type: PropType<(type: string) => void>;
+        required: true;
+    };
+    canvasWidth: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasHeight: {
+        type: NumberConstructor;
+        required: true;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    onAddElement: {
+        type: PropType<(type: string) => void>;
+        required: true;
+    };
+    canvasWidth: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasHeight: {
+        type: NumberConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/types/components/posterEditor/pages/Panel.d.ts

@@ -0,0 +1,11 @@
+export declare const Panel: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/types/components/posterEditor/pages/PanelItem.d.ts

@@ -0,0 +1,11 @@
+export declare const PanelItem: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/types/components/posterEditor/pages/RightPanel.d.ts

@@ -0,0 +1,208 @@
+import type { PropType } from 'vue';
+import type { ElementData, ToolbarControl } from '../elements/types';
+export interface RightPanelProps {
+    hasMultipleSelection: boolean;
+    selectedElementsCount: number;
+    currentElementData?: ElementData;
+    currentElementConfig?: any;
+    canMoveUp: boolean;
+    canMoveDown: boolean;
+    canMoveToFront: boolean;
+    canMoveToBack: boolean;
+    canvasWidth: number;
+    canvasHeight: number;
+    canvasBackgroundColor: string;
+    canvasBackgroundImage?: string;
+    onDeleteSelectedElements: () => void;
+    onAlignElements: (type: string) => void;
+    onUpdateElementProperty: (id: string, key: string, value: any) => void;
+    onUpdateCanvasSize: (width: number, height: number) => void;
+    onUpdateCanvasBackground: (color: string) => void;
+    onUpdateCanvasBackgroundImage: (imageUrl: string) => void;
+    onSaveData: () => void;
+    onExportJson: () => void;
+    onRenderToolbarControl: (control: ToolbarControl) => any;
+    onClearCanvas: () => void;
+    canvasScale: number;
+}
+export declare const RightPanel: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    hasMultipleSelection: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    selectedElementsCount: {
+        type: NumberConstructor;
+        required: true;
+    };
+    currentElementData: {
+        type: PropType<ElementData>;
+    };
+    currentElementConfig: {
+        type: ObjectConstructor;
+    };
+    canMoveUp: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveDown: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveToFront: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveToBack: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canvasWidth: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasHeight: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasBackgroundColor: {
+        type: StringConstructor;
+        required: true;
+    };
+    canvasBackgroundImage: {
+        type: StringConstructor;
+    };
+    onDeleteSelectedElements: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onAlignElements: {
+        type: PropType<(type: string) => void>;
+        required: true;
+    };
+    onUpdateElementProperty: {
+        type: PropType<(id: string, key: string, value: any) => void>;
+        required: true;
+    };
+    onUpdateCanvasSize: {
+        type: PropType<(width: number, height: number) => void>;
+        required: true;
+    };
+    onUpdateCanvasBackground: {
+        type: PropType<(color: string) => void>;
+        required: true;
+    };
+    onUpdateCanvasBackgroundImage: {
+        type: PropType<(imageUrl: string) => void>;
+        required: true;
+    };
+    onSaveData: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onExportJson: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onRenderToolbarControl: {
+        type: PropType<(control: ToolbarControl) => any>;
+        required: true;
+    };
+    onClearCanvas: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    canvasScale: {
+        type: NumberConstructor;
+        required: true;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    hasMultipleSelection: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    selectedElementsCount: {
+        type: NumberConstructor;
+        required: true;
+    };
+    currentElementData: {
+        type: PropType<ElementData>;
+    };
+    currentElementConfig: {
+        type: ObjectConstructor;
+    };
+    canMoveUp: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveDown: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveToFront: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canMoveToBack: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    canvasWidth: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasHeight: {
+        type: NumberConstructor;
+        required: true;
+    };
+    canvasBackgroundColor: {
+        type: StringConstructor;
+        required: true;
+    };
+    canvasBackgroundImage: {
+        type: StringConstructor;
+    };
+    onDeleteSelectedElements: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onAlignElements: {
+        type: PropType<(type: string) => void>;
+        required: true;
+    };
+    onUpdateElementProperty: {
+        type: PropType<(id: string, key: string, value: any) => void>;
+        required: true;
+    };
+    onUpdateCanvasSize: {
+        type: PropType<(width: number, height: number) => void>;
+        required: true;
+    };
+    onUpdateCanvasBackground: {
+        type: PropType<(color: string) => void>;
+        required: true;
+    };
+    onUpdateCanvasBackgroundImage: {
+        type: PropType<(imageUrl: string) => void>;
+        required: true;
+    };
+    onSaveData: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onExportJson: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    onRenderToolbarControl: {
+        type: PropType<(control: ToolbarControl) => any>;
+        required: true;
+    };
+    onClearCanvas: {
+        type: PropType<() => void>;
+        required: true;
+    };
+    canvasScale: {
+        type: NumberConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/types/components/posterEditor/pages/index.d.ts

@@ -0,0 +1,4 @@
+export { LeftToolbar } from './LeftToolbar';
+export type { LeftToolbarProps } from './LeftToolbar';
+export { RightPanel } from './RightPanel';
+export type { RightPanelProps } from './RightPanel';

package/dist/types/components/posterEditor/posterEditor.d.ts

@@ -0,0 +1,61 @@
+import type { PropType } from 'vue';
+export interface PosterEditorProps {
+    data?: string;
+    width?: number;
+    height?: number;
+    backgroundColor?: string;
+    backgroundImage?: string;
+}
+export declare const DuxPosterEditor: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    data: {
+        type: PropType<string>;
+        default: string;
+    };
+    width: {
+        type: PropType<number>;
+        default: number;
+    };
+    height: {
+        type: PropType<number>;
+        default: number;
+    };
+    backgroundColor: {
+        type: PropType<string>;
+        default: string;
+    };
+    backgroundImage: {
+        type: PropType<string>;
+        default: string;
+    };
+    onDataUpdate: PropType<(data?: string) => void>;
+    onSave: PropType<(data?: string) => void>;
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: PropType<string>;
+        default: string;
+    };
+    width: {
+        type: PropType<number>;
+        default: number;
+    };
+    height: {
+        type: PropType<number>;
+        default: number;
+    };
+    backgroundColor: {
+        type: PropType<string>;
+        default: string;
+    };
+    backgroundImage: {
+        type: PropType<string>;
+        default: string;
+    };
+    onDataUpdate: PropType<(data?: string) => void>;
+    onSave: PropType<(data?: string) => void>;
+}>> & Readonly<{}>, {
+    data: string;
+    height: number;
+    width: number;
+    backgroundColor: string;
+    backgroundImage: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

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

@@ -0,0 +1,47 @@
+import type { Canvas, FabricObject } from 'fabric';
+export interface PropertyControl {
+    key: string;
+    label: string;
+    type: 'input' | 'number' | 'color' | 'select' | 'button' | 'textarea' | 'slider';
+    value: any;
+    min?: number;
+    max?: number;
+    options?: Array<{
+        label: string;
+        value: any;
+    }>;
+    action?: () => void;
+    disabled?: boolean;
+}
+export interface ElementPlugin {
+    id: string;
+    name: string;
+    icon: string;
+    category: string;
+    elementTypes: string[];
+    create: (options?: any) => {
+        type: string;
+        config: any;
+    };
+    getToolbarControls: (object: FabricObject, context: {
+        updateProperty: (key: string, value: any) => void;
+        canvas: Canvas | null;
+    }) => PropertyControl[];
+}
+export interface CanvasSettings {
+    width: number;
+    height: number;
+    backgroundColor: string;
+    backgroundImage: string | null;
+}
+export interface FabricElement {
+    id: string;
+    type: string;
+    config: any;
+    elementType?: string;
+}
+export interface AlignmentControl {
+    key: string;
+    label: string;
+    action: () => void;
+}

package/dist/types/components/stats/number.d.ts

@@ -46,5 +46,5 @@ export declare const DuxStatsNumber: import("vue").DefineComponent<import("vue")
     value: string | number;
     change: number;
     subtitle: string;
-    changeType: "up" | "down";
+    changeType: "down" | "up";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/types/components/upload/file.d.ts

@@ -1,13 +1,15 @@
 import type { IDataProviderResponse, IS3SignData } from '@duxweb/dvha-core';
 import type { IUploadParams } from './manager';
+type IUploadValue = Record<string, any>[] | Record<string, any>;
 export interface IUploadProps extends IUploadParams {
     driver?: 'local' | 's3';
     signPath?: string;
     signCallback?: (response: IDataProviderResponse) => IS3SignData;
     managePath?: string;
-    value?: string | string[];
-    defaultValue?: string | string[];
-    onUpdateValue?: (value?: string | string[]) => void;
+    value?: IUploadValue;
+    defaultValue?: IUploadValue;
+    onUpdateValue?: (value?: IUploadValue) => void;
     manager?: boolean;
 }
 export declare const DuxFileUpload: import("vue").DefineComponent<IUploadProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IUploadProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export {};

package/dist/types/index.d.ts

@@ -8,3 +8,4 @@ export * from './main';
 export * from './pages';
 export * from './stores';
 export * from './theme';
+export { default as VueKonva } from 'vue-konva';

package/dist/types/pages/layout/global.d.ts

@@ -1,2 +1 @@
-import 'echarts';
 export declare const DuxGlobalLayout: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@duxweb/dvha-pro",
   "type": "module",
-  "version": "1.0.24",
+  "version": "1.0.26",
   "author": "DuxWeb",
   "license": "MIT",
   "repository": {
@@ -33,8 +33,8 @@
   ],
   "dependencies": {
     "@ant-design/colors": "^7.2.1",
-    "@duxweb/dvha-core": "^1.0.24",
-    "@duxweb/dvha-naiveui": "^1.0.24",
+    "@duxweb/dvha-core": "^1.0.26",
+    "@duxweb/dvha-naiveui": "^1.0.26",
     "@iconify-json/tabler": "^1.2.18",
     "@overlastic/vue": "^0.8.1",
     "@tanstack/vue-query": "^5.80.7",
@@ -51,14 +51,17 @@
     "colorizr": "^3.0.8",
     "dayjs": "^1.11.13",
     "echarts": "^5.6.0",
+    "fabric": "^6.7.0",
     "jinrishici": "^1.0.6",
     "jsep": "^1.4.0",
+    "konva": "^9.3.20",
     "lodash-es": "^4.17.21",
     "mathjs": "^14.5.2",
     "mime": "^4.0.7",
     "naive-ui": "^2.42.0",
     "pinia": "^3.0.3",
     "pinia-plugin-persistedstate": "^4.3.0",
+    "short-unique-id": "^5.3.2",
     "unocss": "^66.2.1",
     "vee-validate": "^4.15.1",
     "vue": "^3.5.0",
@@ -66,6 +69,7 @@
     "vue-cropper": "^1.1.4",
     "vue-draggable-plus": "^0.6.0",
     "vue-echarts": "^7.0.3",
+    "vue-konva": "^3.2.1",
     "vue-router": "^4.5.1",
     "vue3-ace-editor": "^2.2.4"
   },