ll-plus 2.6.17 → 2.6.19

package/lib/components/textarea/src/textarea.vue.d.ts

@@ -44,8 +44,8 @@ declare const _default: import("vue").DefineComponent<{}, {
         };
         name: StringConstructor;
         type: {
-            type: import("vue").PropType<"number" | "month" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "submit" | "button" | "reset" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel">;
-            default: "number" | "month" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "submit" | "button" | "reset" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
+            type: import("vue").PropType<"number" | "month" | "reset" | "submit" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "button" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel">;
+            default: "number" | "month" | "reset" | "submit" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "button" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
         };
         onFocus: import("vue").PropType<import("ant-design-vue/es/_util/EventInterface").FocusEventHandler>;
         onBlur: import("vue").PropType<import("ant-design-vue/es/_util/EventInterface").FocusEventHandler>;
@@ -143,8 +143,8 @@ declare const _default: import("vue").DefineComponent<{}, {
         };
         name: StringConstructor;
         type: {
-            type: import("vue").PropType<"number" | "month" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "submit" | "button" | "reset" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel">;
-            default: "number" | "month" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "submit" | "button" | "reset" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
+            type: import("vue").PropType<"number" | "month" | "reset" | "submit" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "button" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel">;
+            default: "number" | "month" | "reset" | "submit" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "button" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
         };
         onFocus: import("vue").PropType<import("ant-design-vue/es/_util/EventInterface").FocusEventHandler>;
         onBlur: import("vue").PropType<import("ant-design-vue/es/_util/EventInterface").FocusEventHandler>;
@@ -212,7 +212,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         };
     }>>, {
         value: string | number;
-        type: "number" | "month" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "submit" | "button" | "reset" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
+        type: "number" | "month" | "reset" | "submit" | "color" | "hidden" | "search" | "date" | "url" | "email" | "time" | "week" | "text" | "button" | "checkbox" | "radio" | "image" | "range" | "datetime-local" | "file" | "password" | "tel";
         focused: boolean;
         hidden: boolean;
         disabled: boolean;

package/lib/components/tooltip/index.d.ts

@@ -1,7 +1,7 @@
 import Tooltip from './src/tooltip.vue';
 export declare const LlTooltip: import("ll-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
     readonly tip: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "提示", boolean>;
-    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
+    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
     readonly tipEllipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly tipEllipsisLine: import("ll-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1, boolean>;
@@ -21,7 +21,7 @@ export declare const LlTooltip: import("ll-plus/es/utils").SFCWithInstall<import
     readonly width: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
 }, {
     props: import("@vue/shared").LooseRequired<{
-        readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
+        readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
         readonly maxWidth: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
         readonly width: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
         readonly tip: string;
@@ -65,7 +65,7 @@ export declare const LlTooltip: import("ll-plus/es/utils").SFCWithInstall<import
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     readonly tip: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "提示", boolean>;
-    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
+    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
     readonly tipEllipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly tipEllipsisLine: import("ll-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1, boolean>;
@@ -84,7 +84,7 @@ export declare const LlTooltip: import("ll-plus/es/utils").SFCWithInstall<import
     readonly ellipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly width: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
 }>>, {
-    readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
+    readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
     readonly width: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
     readonly tip: string;

package/lib/components/tooltip/src/tooltip.d.ts

@@ -3,7 +3,7 @@ import type Tooltip from './tooltip.vue';
 export declare const placement: readonly ["top", "left", "right", "bottom", "topLeft", "topRight", "bottomLeft", "bottomRight", "leftTop", "leftBottom", "rightTop", "rightBottom"];
 export declare const tooltipProps: {
     readonly tip: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "提示", boolean>;
-    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
+    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
     readonly tipEllipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly tipEllipsisLine: import("ll-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1, boolean>;

package/lib/components/tooltip/src/tooltip.vue.d.ts

@@ -1,6 +1,6 @@
 declare const _default: import("vue").DefineComponent<{
     readonly tip: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "提示", boolean>;
-    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
+    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
     readonly tipEllipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly tipEllipsisLine: import("ll-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1, boolean>;
@@ -20,7 +20,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly width: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
 }, {
     props: import("@vue/shared").LooseRequired<{
-        readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
+        readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
         readonly maxWidth: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
         readonly width: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
         readonly tip: string;
@@ -64,7 +64,7 @@ declare const _default: import("vue").DefineComponent<{
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     readonly tip: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "提示", boolean>;
-    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
+    readonly placement: import("ll-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown, "top", boolean>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
     readonly tipEllipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly tipEllipsisLine: import("ll-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1, boolean>;
@@ -83,7 +83,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly ellipsis: import("ll-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     readonly width: import("ll-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown, "", boolean>;
 }>>, {
-    readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
+    readonly placement: import("ll-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "left" | "right" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom", unknown>;
     readonly maxWidth: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
     readonly width: import("ll-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | ((new (...args: any[]) => string | number) | (() => string | number))[], unknown, unknown>;
     readonly tip: string;

package/lib/components/tree-search/index.d.ts

@@ -105,7 +105,7 @@ export declare const LlTreeSearch: import("ll-plus/es/utils").SFCWithInstall<imp
         readonly onCancel?: (() => any) | undefined;
         readonly onClickAdd?: (() => any) | undefined;
     } & {}>;
-    emits: ((event: "close") => void) & ((event: "select", selectedKeys: string[], e: Event) => void) & ((event: "ok") => void) & ((event: "cancel") => void) & ((event: "expand", expandedKeys: string[], data: any) => void) & ((event: "clickAdd") => void);
+    emits: ((event: "cancel") => void) & ((event: "close") => void) & ((event: "select", selectedKeys: string[], e: Event) => void) & ((event: "ok") => void) & ((event: "expand", expandedKeys: string[], data: any) => void) & ((event: "clickAdd") => void);
     isCollapseMenu: import("vue").Ref<boolean>;
     newExpandedKeys: import("vue").Ref<string[]>;
     bem: {

package/lib/components/tree-search/src/tree-search.vue.d.ts

@@ -104,7 +104,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly onCancel?: (() => any) | undefined;
         readonly onClickAdd?: (() => any) | undefined;
     } & {}>;
-    emits: ((event: "close") => void) & ((event: "select", selectedKeys: string[], e: Event) => void) & ((event: "ok") => void) & ((event: "cancel") => void) & ((event: "expand", expandedKeys: string[], data: any) => void) & ((event: "clickAdd") => void);
+    emits: ((event: "cancel") => void) & ((event: "close") => void) & ((event: "select", selectedKeys: string[], e: Event) => void) & ((event: "ok") => void) & ((event: "expand", expandedKeys: string[], data: any) => void) & ((event: "clickAdd") => void);
     isCollapseMenu: import("vue").Ref<boolean>;
     newExpandedKeys: import("vue").Ref<string[]>;
     bem: {

package/lib/components/upload-drag/index.d.ts

@@ -39,7 +39,7 @@ export declare const LlUploadDrag: import("ll-plus/es/utils").SFCWithInstall<imp
         readonly onCancel?: ((...args: any[]) => any) | undefined;
         readonly onCustomRequest?: ((...args: any[]) => any) | undefined;
     } & {}>;
-    emits: (event: "update:value" | "confirm" | "customRequest" | "cancel", ...args: any[]) => void;
+    emits: (event: "cancel" | "update:value" | "confirm" | "customRequest", ...args: any[]) => void;
     bem: {
         b: (blockSuffix?: string) => string;
         e: (element?: string) => string;
@@ -61,7 +61,7 @@ export declare const LlUploadDrag: import("ll-plus/es/utils").SFCWithInstall<imp
     handleDragReject: () => void;
     handleClickCancelBtn: () => void;
     handleClickOkBtn: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:value" | "confirm" | "customRequest" | "cancel")[], "update:value" | "confirm" | "customRequest" | "cancel", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "update:value" | "confirm" | "customRequest")[], "cancel" | "update:value" | "confirm" | "customRequest", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     value: {
         type: ArrayConstructor;
         default: () => never[];

package/lib/components/upload-drag/src/upload-drag.vue.d.ts

@@ -39,7 +39,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly onCancel?: ((...args: any[]) => any) | undefined;
         readonly onCustomRequest?: ((...args: any[]) => any) | undefined;
     } & {}>;
-    emits: (event: "update:value" | "confirm" | "customRequest" | "cancel", ...args: any[]) => void;
+    emits: (event: "cancel" | "update:value" | "confirm" | "customRequest", ...args: any[]) => void;
     bem: {
         b: (blockSuffix?: string) => string;
         e: (element?: string) => string;
@@ -61,7 +61,7 @@ declare const _default: import("vue").DefineComponent<{
     handleDragReject: () => void;
     handleClickCancelBtn: () => void;
     handleClickOkBtn: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:value" | "confirm" | "customRequest" | "cancel")[], "update:value" | "confirm" | "customRequest" | "cancel", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "update:value" | "confirm" | "customRequest")[], "cancel" | "update:value" | "confirm" | "customRequest", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     value: {
         type: ArrayConstructor;
         default: () => never[];

package/lib/packages/components/cropper/src/cropper-image.js

@@ -38,6 +38,10 @@ const cropperImageProps = runtime.buildProps({
     type: Boolean,
     default: false
   },
+  loading: {
+    type: Boolean,
+    default: false
+  },
   realTimePreview: {
     type: Boolean,
     default: true
@@ -75,6 +79,10 @@ const cropperModalProps = runtime.buildProps({
     type: Boolean,
     default: false
   },
+  loading: {
+    type: Boolean,
+    default: false
+  },
   avatar: {
     type: String,
     default: ""

package/lib/packages/components/cropper/src/cropper-image.js.map

@@ -1 +1 @@
-{"version":3,"file":"cropper-image.js","sources":["../../../../../../packages/components/cropper/src/cropper-image.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\nimport type Cropper from 'cropperjs'\nimport type CropperImage from './cropper-image.vue'\nimport type CropperModal from './cropper-modal.vue'\n\nexport interface CropendResult {\n  imgBase64: string\n  imgInfo: Cropper.Data\n}\n\nexport const defaultCropperOptions: Cropper.Options = {\n  aspectRatio: 1,\n  zoomable: true,\n  zoomOnTouch: true,\n  zoomOnWheel: true,\n  cropBoxMovable: true,\n  cropBoxResizable: true,\n  toggleDragModeOnDblclick: true,\n  autoCrop: true,\n  background: true,\n  highlight: true,\n  center: true,\n  responsive: true,\n  restore: true,\n  checkCrossOrigin: true,\n  checkOrientation: true,\n  scalable: true,\n  modal: true,\n  guides: true,\n  movable: true,\n  rotatable: true\n}\n\nexport const cropperImageProps = buildProps({\n  src: {\n    type: String,\n    required: true\n  },\n  alt: {\n    type: String\n  },\n  circled: {\n    type: Boolean,\n    default: false\n  },\n  realTimePreview: {\n    type: Boolean,\n    default: true\n  },\n  height: {\n    type: [String, Number],\n    default: '360px'\n  },\n  crossorigin: {\n    type: definePropType<'' | 'anonymous' | 'use-credentials' | undefined>(\n      String\n    ),\n    default: undefined\n  },\n  imageStyle: {\n    type: definePropType<CSSProperties>(Object),\n    default: () => ({})\n  },\n  options: {\n    type: definePropType<Cropper.Options>(Object),\n    default: () => ({})\n  }\n} as const)\n\nexport const cropperImageEmits = {\n  cropend: (params: CropendResult) => !!params,\n  onReady: (cropper: Cropper) => !!cropper,\n  cropendError: () => true\n} as const\n\nexport const cropperModalProps = buildProps({\n  circled: {\n    type: Boolean,\n    default: true\n  },\n  disabled: {\n    type: Boolean,\n    default: false\n  },\n  avatar: {\n    type: String,\n    default: ''\n  },\n  avatarSize: {\n    type: [String, Number],\n    default: 64\n  },\n  avatarType: {\n    type: definePropType<'square' | 'circle'>(String),\n    default: () => 'circle'\n  },\n  title: {\n    type: String,\n    default: '图片裁剪'\n  },\n  width: {\n    type: [String, Number],\n    default: '800px'\n  }\n} as const)\n\nexport const cropperModalEmits = {\n  confirm: (params: { blob: Blob; previewSource: string }) => !!params\n} as const\n\n// props\nexport type CropperImageProps = ExtractPropTypes<typeof cropperImageProps>\nexport type CropperModalProps = ExtractPropTypes<typeof cropperModalProps>\n\n// emits\nexport type CropperImageEmits = typeof cropperImageEmits\nexport type CropperModalEmits = typeof cropperModalEmits\n\n// instance\nexport type CropperImageInstance = InstanceType<typeof CropperImage>\nexport type CropperModalInstance = InstanceType<typeof CropperModal>\n"],"names":["buildProps","definePropType"],"mappings":"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"}
+{"version":3,"file":"cropper-image.js","sources":["../../../../../../packages/components/cropper/src/cropper-image.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\nimport type Cropper from 'cropperjs'\nimport type CropperImage from './cropper-image.vue'\nimport type CropperModal from './cropper-modal.vue'\n\nexport interface CropendResult {\n  imgBase64: string\n  imgInfo: Cropper.Data\n}\n\nexport const defaultCropperOptions: Cropper.Options = {\n  aspectRatio: 1,\n  zoomable: true,\n  zoomOnTouch: true,\n  zoomOnWheel: true,\n  cropBoxMovable: true,\n  cropBoxResizable: true,\n  toggleDragModeOnDblclick: true,\n  autoCrop: true,\n  background: true,\n  highlight: true,\n  center: true,\n  responsive: true,\n  restore: true,\n  checkCrossOrigin: true,\n  checkOrientation: true,\n  scalable: true,\n  modal: true,\n  guides: true,\n  movable: true,\n  rotatable: true\n}\n\nexport const cropperImageProps = buildProps({\n  src: {\n    type: String,\n    required: true\n  },\n  alt: {\n    type: String\n  },\n  circled: {\n    type: Boolean,\n    default: false\n  },\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  realTimePreview: {\n    type: Boolean,\n    default: true\n  },\n  height: {\n    type: [String, Number],\n    default: '360px'\n  },\n  crossorigin: {\n    type: definePropType<'' | 'anonymous' | 'use-credentials' | undefined>(\n      String\n    ),\n    default: undefined\n  },\n  imageStyle: {\n    type: definePropType<CSSProperties>(Object),\n    default: () => ({})\n  },\n  options: {\n    type: definePropType<Cropper.Options>(Object),\n    default: () => ({})\n  }\n} as const)\n\nexport const cropperImageEmits = {\n  cropend: (params: CropendResult) => !!params,\n  onReady: (cropper: Cropper) => !!cropper,\n  cropendError: () => true\n} as const\n\nexport const cropperModalProps = buildProps({\n  circled: {\n    type: Boolean,\n    default: true\n  },\n  disabled: {\n    type: Boolean,\n    default: false\n  },\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  avatar: {\n    type: String,\n    default: ''\n  },\n  avatarSize: {\n    type: [String, Number],\n    default: 64\n  },\n  avatarType: {\n    type: definePropType<'square' | 'circle'>(String),\n    default: () => 'circle'\n  },\n  title: {\n    type: String,\n    default: '图片裁剪'\n  },\n  width: {\n    type: [String, Number],\n    default: '800px'\n  }\n} as const)\n\nexport const cropperModalEmits = {\n  confirm: (params: { blob: Blob; previewSource: string }) => !!params\n} as const\n\n// props\nexport type CropperImageProps = ExtractPropTypes<typeof cropperImageProps>\nexport type CropperModalProps = ExtractPropTypes<typeof cropperModalProps>\n\n// emits\nexport type CropperImageEmits = typeof cropperImageEmits\nexport type CropperModalEmits = typeof cropperModalEmits\n\n// instance\nexport type CropperImageInstance = InstanceType<typeof CropperImage>\nexport type CropperModalInstance = InstanceType<typeof CropperModal>\n"],"names":["buildProps","definePropType"],"mappings":"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"}

package/lib/packages/components/cropper/src/cropper-image.vue2.js

@@ -23,6 +23,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const imgElRef = vue.ref();
     const cropper = vue.ref();
     const isReady = vue.ref(false);
+    const loading = vue.ref(props.loading);
     const getImageStyle = vue.computed(() => {
       return {
         height: props.height,
@@ -38,10 +39,12 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       if (!imgEl) {
         return;
       }
+      loading.value = true;
       cropper.value = new Cropper(imgEl, {
         ...cropperImage.defaultCropperOptions,
         ready() {
           isReady.value = true;
+          loading.value = false;
           realTimeCroppered();
           emits("onReady", cropper.value);
         },
@@ -107,32 +110,50 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       context.fill();
       return canvas;
     };
+    const handleLoading = () => {
+      loading.value = true;
+      console.log("loading");
+    };
     vue.onMounted(init);
     vue.onUnmounted(() => {
       cropper.value?.destroy();
     });
+    vue.watch(
+      () => props.loading,
+      (val) => {
+        loading.value = val;
+      }
+    );
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock(
-        "div",
-        {
-          class: vue.normalizeClass([vue.unref(bem).b(), props.circled ? vue.unref(bem).is("circled") : ""]),
-          style: vue.normalizeStyle(getWrapperStyle.value)
-        },
-        [
-          vue.withDirectives(vue.createElementVNode("img", {
-            ref_key: "imgElRef",
-            ref: imgElRef,
-            src: _ctx.src,
-            alt: _ctx.alt,
-            crossorigin: _ctx.crossorigin,
-            style: vue.normalizeStyle(getImageStyle.value)
-          }, null, 12, _hoisted_1), [
-            [vue.vShow, isReady.value]
-          ])
-        ],
-        6
-        /* CLASS, STYLE */
-      );
+      const _component_a_spin = vue.resolveComponent("a-spin");
+      return vue.openBlock(), vue.createBlock(_component_a_spin, { spinning: loading.value }, {
+        default: vue.withCtx(() => [
+          vue.createElementVNode(
+            "div",
+            {
+              class: vue.normalizeClass([vue.unref(bem).b(), props.circled ? vue.unref(bem).is("circled") : ""]),
+              style: vue.normalizeStyle(getWrapperStyle.value)
+            },
+            [
+              vue.withDirectives(vue.createElementVNode("img", {
+                ref_key: "imgElRef",
+                ref: imgElRef,
+                src: _ctx.src,
+                alt: _ctx.alt,
+                crossorigin: _ctx.crossorigin,
+                style: vue.normalizeStyle(getImageStyle.value),
+                onLoad: handleLoading
+              }, null, 44, _hoisted_1), [
+                [vue.vShow, isReady.value]
+              ])
+            ],
+            6
+            /* CLASS, STYLE */
+          )
+        ]),
+        _: 1
+        /* STABLE */
+      }, 8, ["spinning"]);
     };
   }
 });

package/lib/packages/components/cropper/src/cropper-image.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"cropper-image.vue2.js","sources":["../../../../../../packages/components/cropper/src/cropper-image.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[bem.b(), props.circled ? bem.is('circled') : '']\"\n    :style=\"getWrapperStyle\"\n  >\n    <img\n      v-show=\"isReady\"\n      ref=\"imgElRef\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :crossorigin=\"crossorigin\"\n      :style=\"getImageStyle\"\n    />\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { onMounted, ref, computed, onUnmounted, type CSSProperties } from 'vue'\nimport { createNamespace } from '@ll-plus/utils'\n//@ts-ignore\nimport Cropper from 'cropperjs'\n// import 'cropperjs/dist/cropper.css'\nimport { useDebounceFn } from '@vueuse/shared'\nimport {\n  cropperImageProps,\n  cropperImageEmits,\n  defaultCropperOptions,\n  type CropendResult\n} from './cropper-image'\n\ndefineOptions({ name: 'CropperImage' })\nconst props = defineProps(cropperImageProps)\nconst emits = defineEmits(cropperImageEmits)\n\nconst bem = createNamespace('cropper-image')\n\nconst imgElRef = ref<HTMLImageElement>()\nconst cropper = ref<Cropper>()\nconst isReady = ref(false)\nconst getImageStyle = computed((): CSSProperties => {\n  return {\n    height: props.height,\n    maxWidth: '100%',\n    ...props.imageStyle\n  }\n})\nconst getWrapperStyle = computed((): CSSProperties => {\n  return { height: `${props.height}`.replace(/px/, '') + 'px' }\n})\n\nconst init = async () => {\n  const imgEl = imgElRef.value\n  if (!imgEl) {\n    return\n  }\n  cropper.value = new Cropper(imgEl, {\n    ...defaultCropperOptions,\n    ready() {\n      isReady.value = true\n      realTimeCroppered()\n      //@ts-ignore\n      emits('onReady', cropper.value)\n    },\n    crop() {\n      debounceRealTimeCroppered()\n    },\n    zoom() {\n      debounceRealTimeCroppered()\n    },\n    cropmove() {\n      debounceRealTimeCroppered()\n    },\n    ...props.options\n  })\n}\n\n// Real-time display preview\nconst realTimeCroppered = () => {\n  props.realTimePreview && croppered()\n}\n\nconst debounceRealTimeCroppered = useDebounceFn(realTimeCroppered, 80)\n\n// event: return base64 and width and height information after cropping\nconst croppered = () => {\n  if (!cropper.value) {\n    return\n  }\n  const imgInfo = cropper.value.getData()\n  const canvas = props.circled\n    ? getRoundedCanvas()\n    : cropper.value.getCroppedCanvas()\n  canvas.toBlob(blob => {\n    if (!blob) {\n      return\n    }\n    const fileReader: FileReader = new FileReader()\n    fileReader.readAsDataURL(blob)\n    fileReader.onloadend = e => {\n      emits('cropend', {\n        imgBase64: e.target?.result ?? '',\n        imgInfo\n      } as CropendResult)\n    }\n    fileReader.onerror = () => {\n      emits('cropendError')\n    }\n  }, 'image/png')\n}\n\n// Get a circular picture canvas\nconst getRoundedCanvas = () => {\n  const sourceCanvas = cropper.value!.getCroppedCanvas()\n  const canvas = document.createElement('canvas')\n  const context = canvas.getContext('2d')!\n  const width = sourceCanvas.width\n  const height = sourceCanvas.height\n  canvas.width = width\n  canvas.height = height\n  context.imageSmoothingEnabled = true\n  context.drawImage(sourceCanvas, 0, 0, width, height)\n  context.globalCompositeOperation = 'destination-in'\n  context.beginPath()\n  context.arc(\n    width / 2,\n    height / 2,\n    Math.min(width, height) / 2,\n    0,\n    2 * Math.PI,\n    true\n  )\n  context.fill()\n  return canvas\n}\n\nonMounted(init)\n\nonUnmounted(() => {\n  cropper.value?.destroy()\n})\n</script>\n"],"names":["createNamespace","ref","computed","defaultCropperOptions","useDebounceFn","onMounted","onUnmounted"],"mappings":"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"}
+{"version":3,"file":"cropper-image.vue2.js","sources":["../../../../../../packages/components/cropper/src/cropper-image.vue"],"sourcesContent":["<template>\n  <a-spin :spinning=\"loading\">\n    <div\n      :class=\"[bem.b(), props.circled ? bem.is('circled') : '']\"\n      :style=\"getWrapperStyle\"\n    >\n      <img\n        v-show=\"isReady\"\n        ref=\"imgElRef\"\n        :src=\"src\"\n        :alt=\"alt\"\n        :crossorigin=\"crossorigin\"\n        :style=\"getImageStyle\"\n        @load=\"handleLoading\"\n      />\n    </div>\n  </a-spin>\n</template>\n<script lang=\"ts\" setup>\nimport {\n  onMounted,\n  ref,\n  computed,\n  onUnmounted,\n  type CSSProperties,\n  watch\n} from 'vue'\nimport { createNamespace } from '@ll-plus/utils'\n//@ts-ignore\nimport Cropper from 'cropperjs'\n// import 'cropperjs/dist/cropper.css'\nimport { useDebounceFn } from '@vueuse/shared'\nimport {\n  cropperImageProps,\n  cropperImageEmits,\n  defaultCropperOptions,\n  type CropendResult\n} from './cropper-image'\n\ndefineOptions({ name: 'CropperImage' })\nconst props = defineProps(cropperImageProps)\nconst emits = defineEmits(cropperImageEmits)\n\nconst bem = createNamespace('cropper-image')\n\nconst imgElRef = ref<HTMLImageElement>()\nconst cropper = ref<Cropper>()\nconst isReady = ref(false)\nconst loading = ref(props.loading)\nconst getImageStyle = computed((): CSSProperties => {\n  return {\n    height: props.height,\n    maxWidth: '100%',\n    ...props.imageStyle\n  }\n})\nconst getWrapperStyle = computed((): CSSProperties => {\n  return { height: `${props.height}`.replace(/px/, '') + 'px' }\n})\n\nconst init = async () => {\n  const imgEl = imgElRef.value\n  if (!imgEl) {\n    return\n  }\n  loading.value = true\n  cropper.value = new Cropper(imgEl, {\n    ...defaultCropperOptions,\n    ready() {\n      isReady.value = true\n      loading.value = false\n      realTimeCroppered()\n      //@ts-ignore\n      emits('onReady', cropper.value)\n    },\n    crop() {\n      debounceRealTimeCroppered()\n    },\n    zoom() {\n      debounceRealTimeCroppered()\n    },\n    cropmove() {\n      debounceRealTimeCroppered()\n    },\n    ...props.options\n  })\n}\n\n// Real-time display preview\nconst realTimeCroppered = () => {\n  props.realTimePreview && croppered()\n}\n\nconst debounceRealTimeCroppered = useDebounceFn(realTimeCroppered, 80)\n\n// event: return base64 and width and height information after cropping\nconst croppered = () => {\n  if (!cropper.value) {\n    return\n  }\n  const imgInfo = cropper.value.getData()\n  const canvas = props.circled\n    ? getRoundedCanvas()\n    : cropper.value.getCroppedCanvas()\n  canvas.toBlob(blob => {\n    if (!blob) {\n      return\n    }\n    const fileReader: FileReader = new FileReader()\n    fileReader.readAsDataURL(blob)\n    fileReader.onloadend = e => {\n      emits('cropend', {\n        imgBase64: e.target?.result ?? '',\n        imgInfo\n      } as CropendResult)\n    }\n    fileReader.onerror = () => {\n      emits('cropendError')\n    }\n  }, 'image/png')\n}\n\n// Get a circular picture canvas\nconst getRoundedCanvas = () => {\n  const sourceCanvas = cropper.value!.getCroppedCanvas()\n  const canvas = document.createElement('canvas')\n  const context = canvas.getContext('2d')!\n  const width = sourceCanvas.width\n  const height = sourceCanvas.height\n  canvas.width = width\n  canvas.height = height\n  context.imageSmoothingEnabled = true\n  context.drawImage(sourceCanvas, 0, 0, width, height)\n  context.globalCompositeOperation = 'destination-in'\n  context.beginPath()\n  context.arc(\n    width / 2,\n    height / 2,\n    Math.min(width, height) / 2,\n    0,\n    2 * Math.PI,\n    true\n  )\n  context.fill()\n  return canvas\n}\n//获取图片加载中\nconst handleLoading = () => {\n  loading.value = true\n  console.log('loading')\n}\n\nonMounted(init)\n\nonUnmounted(() => {\n  cropper.value?.destroy()\n})\n\nwatch(\n  () => props.loading,\n  val => {\n    loading.value = val\n  }\n)\n</script>\n"],"names":["createNamespace","ref","computed","defaultCropperOptions","useDebounceFn","onMounted","onUnmounted","watch"],"mappings":"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"}