@deot/vc 1.0.54 → 1.0.55

package/dist/index.d.ts

@@ -4110,10 +4110,18 @@ export declare const Components: {
     crossOrigin: {
     type: StringConstructor;
     default: string;
-    validator: (v: any) => boolean;
+    validator: (v: string) => boolean;
     };
     source: FunctionConstructor;
     download: FunctionConstructor;
+    lazy: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
+    showLoading: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
     options: {
     type: ObjectConstructor;
     default: () => {};
@@ -4126,10 +4134,18 @@ export declare const Components: {
     crossOrigin: {
     type: StringConstructor;
     default: string;
-    validator: (v: any) => boolean;
+    validator: (v: string) => boolean;
     };
     source: FunctionConstructor;
     download: FunctionConstructor;
+    lazy: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
+    showLoading: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
     options: {
     type: ObjectConstructor;
     default: () => {};
@@ -4139,7 +4155,9 @@ export declare const Components: {
     }>, {
     tag: string;
     options: Record<string, any>;
+    showLoading: boolean;
     crossOrigin: string;
+    lazy: boolean;
     }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
     MSnapshot: DefineComponent<ExtractPropTypes<    {
     tag: {
@@ -4149,10 +4167,18 @@ export declare const Components: {
     crossOrigin: {
     type: StringConstructor;
     default: string;
-    validator: (v: any) => boolean;
+    validator: (v: string) => boolean;
     };
     source: FunctionConstructor;
     download: FunctionConstructor;
+    lazy: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
+    showLoading: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
     options: {
     type: ObjectConstructor;
     default: () => {};
@@ -4165,10 +4191,18 @@ export declare const Components: {
     crossOrigin: {
     type: StringConstructor;
     default: string;
-    validator: (v: any) => boolean;
+    validator: (v: string) => boolean;
     };
     source: FunctionConstructor;
     download: FunctionConstructor;
+    lazy: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
+    showLoading: {
+    type: BooleanConstructor;
+    default: boolean;
+    };
     options: {
     type: ObjectConstructor;
     default: () => {};
@@ -4178,7 +4212,9 @@ export declare const Components: {
     }>, {
     tag: string;
     options: Record<string, any>;
+    showLoading: boolean;
     crossOrigin: string;
+    lazy: boolean;
     }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
     Icon: DefineComponent<ExtractPropTypes<    {
     type: StringConstructor;

package/dist/index.iife.js

@@ -9104,6 +9104,7 @@ var Vc = (function (exports, vue) {
       line: nil
     },
     Snapshot: {
+      options: nil,
       source: nil,
       download: nil
     }
@@ -20557,6 +20558,14 @@ var Vc = (function (exports, vue) {
     },
     source: Function,
     download: Function,
+    lazy: {
+      type: Boolean,
+      default: true
+    },
+    showLoading: {
+      type: Boolean,
+      default: true
+    },
     // 传递给snap-dom的配置项
     options: {
       type: Object,
@@ -20576,34 +20585,59 @@ var Vc = (function (exports, vue) {
       let snapDOM;
       const instance = vue.getCurrentInstance();
       const current = vue.ref();
-      const snapdom = vue.ref();
+      const snapshot = vue.ref();
       const refresh = async () => {
         await vue.nextTick();
-        snapdom.value = await snapDOM(current.value, props2.options);
-        return snapdom.value;
+        snapshot.value = await snapDOM(current.value, {
+          fast: false,
+          // dom太大时会卡死一会儿
+          ...VcInstance.options.Snapshot?.options,
+          ...props2.options
+        });
+        return snapshot.value;
+      };
+      const onLoad = () => {
+        return props2.showLoading && Message.loading("正在生成...");
+      };
+      const onLoaded = (ctx) => {
+        ctx?.destroy?.();
       };
       const toDataURL = async () => {
+        const loadContext = onLoad();
+        try {
+          await refresh();
+          return snapshot.value.toRaw();
+        } finally {
+          onLoaded(loadContext);
+        }
+      };
+      const downloadByDefault = async (options) => {
         await refresh();
-        return snapdom.value.toRaw();
+        return snapshot.value.download(options);
       };
       const download = async (options) => {
-        await refresh();
-        const _download = props2.download || VcInstance.options.Snapshot?.download || (() => false);
-        const skip = _download(instance, options);
+        const loadContext = onLoad();
+        const downloadByUser = props2.download || VcInstance.options.Snapshot?.download || (() => false);
+        const skip = downloadByUser(instance, options);
+        const done = async (v) => {
+          try {
+            v || await downloadByDefault(options);
+          } finally {
+            onLoaded(loadContext);
+          }
+        };
         if (skip && skip.then) {
           let skip$ = false;
           skip.then((v) => {
             skip$ = typeof v === "undefined" ? true : !!v;
             return v;
-          }).finally(() => {
-            skip$ || snapdom.value.download(options);
-          });
+          }).finally(() => done(skip$));
           return;
         }
-        skip || snapdom.value.download(options);
+        done(skip);
       };
       expose({
-        snapdom,
+        snapshot,
         refresh,
         toDataURL,
         download
@@ -20612,7 +20646,7 @@ var Vc = (function (exports, vue) {
         try {
           snapDOM = window.snapdom || await Promise.resolve().then(() => snapdom$1);
           snapDOM = snapDOM.snapdom || snapDOM;
-          await refresh();
+          !props2.lazy && await refresh();
           emit("ready", {
             instance,
             dependencies: {

package/dist/index.umd.cjs

@@ -9107,6 +9107,7 @@
       line: nil
     },
     Snapshot: {
+      options: nil,
       source: nil,
       download: nil
     }
@@ -20560,6 +20561,14 @@
     },
     source: Function,
     download: Function,
+    lazy: {
+      type: Boolean,
+      default: true
+    },
+    showLoading: {
+      type: Boolean,
+      default: true
+    },
     // 传递给snap-dom的配置项
     options: {
       type: Object,
@@ -20579,34 +20588,59 @@
       let snapDOM;
       const instance = vue.getCurrentInstance();
       const current = vue.ref();
-      const snapdom = vue.ref();
+      const snapshot = vue.ref();
       const refresh = async () => {
         await vue.nextTick();
-        snapdom.value = await snapDOM(current.value, props2.options);
-        return snapdom.value;
+        snapshot.value = await snapDOM(current.value, {
+          fast: false,
+          // dom太大时会卡死一会儿
+          ...VcInstance.options.Snapshot?.options,
+          ...props2.options
+        });
+        return snapshot.value;
+      };
+      const onLoad = () => {
+        return props2.showLoading && Message.loading("正在生成...");
+      };
+      const onLoaded = (ctx) => {
+        ctx?.destroy?.();
       };
       const toDataURL = async () => {
+        const loadContext = onLoad();
+        try {
+          await refresh();
+          return snapshot.value.toRaw();
+        } finally {
+          onLoaded(loadContext);
+        }
+      };
+      const downloadByDefault = async (options) => {
         await refresh();
-        return snapdom.value.toRaw();
+        return snapshot.value.download(options);
       };
       const download = async (options) => {
-        await refresh();
-        const _download = props2.download || VcInstance.options.Snapshot?.download || (() => false);
-        const skip = _download(instance, options);
+        const loadContext = onLoad();
+        const downloadByUser = props2.download || VcInstance.options.Snapshot?.download || (() => false);
+        const skip = downloadByUser(instance, options);
+        const done = async (v) => {
+          try {
+            v || await downloadByDefault(options);
+          } finally {
+            onLoaded(loadContext);
+          }
+        };
         if (skip && skip.then) {
           let skip$ = false;
           skip.then((v) => {
             skip$ = typeof v === "undefined" ? true : !!v;
             return v;
-          }).finally(() => {
-            skip$ || snapdom.value.download(options);
-          });
+          }).finally(() => done(skip$));
           return;
         }
-        skip || snapdom.value.download(options);
+        done(skip);
       };
       expose({
-        snapdom,
+        snapshot,
         refresh,
         toDataURL,
         download
@@ -20615,7 +20649,7 @@
         try {
           snapDOM = window.snapdom || await Promise.resolve().then(() => snapdom$1);
           snapDOM = snapDOM.snapdom || snapDOM;
-          await refresh();
+          !props2.lazy && await refresh();
           emit("ready", {
             instance,
             dependencies: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deot/vc",
-  "version": "1.0.54",
+  "version": "1.0.55",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,9 +19,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@deot/vc-components": "^1.0.54",
-    "@deot/vc-hooks": "^1.0.54",
-    "@deot/vc-shared": "^1.0.54"
+    "@deot/vc-components": "^1.0.55",
+    "@deot/vc-hooks": "^1.0.55",
+    "@deot/vc-shared": "^1.0.55"
   },
   "peerDependencies": {
     "vue": "*"