@mptw/skylens-ui 1.4.83 → 1.4.85

package/components/SLDownloadButton.vue

@@ -223,6 +223,10 @@ export default defineComponent({
       }
 
       const dataURL = await domToPngDataUrl(imageTarget.value, customFilter.value, customStyle.value, padding.value, dateRanges.value, watermark.value, WatermarkImage);
+      if (!dataURL) {
+        console.log("Can not generate data URL!");
+        return;
+      }
       downloadURL(dataURL, `${fileName.value}.png`);
 
       if (evCategory.value !== "") {
@@ -239,6 +243,15 @@ export default defineComponent({
       }
     }
 
+    async function copyImage() {
+      const dataURL = await domToPngDataUrl(imageTarget.value, customFilter.value, customStyle.value, padding.value, dateRanges.value, watermark.value, WatermarkImage);
+      if (!dataURL) {
+        console.log("Can not generate data URL!");
+        return;
+      }
+      return dataURL;
+    }
+
     onMounted(() => {
       nextTick(() => {
         if (buttonEl.value && popupEl.value) {
@@ -262,6 +275,7 @@ export default defineComponent({
       popupEl,
       onClickedToggle,
       onClickedOption,
+      copyImage,
     };
   },
 });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mptw/skylens-ui",
   "type": "module",
-  "version": "1.4.83",
+  "version": "1.4.85",
   "main": "./nuxt.config.ts",
   "scripts": {
     "dev": "nuxi dev .playground",

package/utils/index.ts

@@ -664,7 +664,7 @@ async function addWatermark(dataURL: string, watermarkImg: string) {
 export const domToPngDataUrl = async (
   imageTarget: HTMLElement | null,
   customFilter: Function | null,
-  customStyle: CSSStyleDeclaration | null,
+  customStyle: Partial<CSSStyleDeclaration> | null,
   padding: number = 0,
   dateRanges: (IDateRange | null)[] = [],
   watermark: boolean = true,