From 5dcc42ba4b0b643af2004e97fe14e329f8ac2f47 Mon Sep 17 00:00:00 2001 From: graphieros Date: Wed, 30 Apr 2025 17:48:47 +0200 Subject: [PATCH 001/343] Bump vite to 6.3.4 --- package-lock.json | 261 ++++++++++++++++++++++++++++++---------------- package.json | 4 +- 2 files changed, 175 insertions(+), 90 deletions(-) diff --git a/package-lock.json b/package-lock.json index d39e972b..d234e399 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "remove-attr": "^0.0.13", "sass": "^1.57.1", "simple-git": "^3.24.0", - "vite": "^6.2.6", + "vite": "^6.3.4", "vitest": "^3.1.1", "vue": "^3.5.13" }, @@ -570,9 +570,9 @@ "dev": true }, "node_modules/@rollup/rollup-android-arm-eabi": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.34.4.tgz", - "integrity": "sha512-gGi5adZWvjtJU7Axs//CWaQbQd/vGy8KGcnEaCWiyCqxWYDxwIlAHFuSe6Guoxtd0SRvSfVTDMPd5H+4KE2kKA==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.40.1.tgz", + "integrity": "sha512-kxz0YeeCrRUHz3zyqvd7n+TVRlNyTifBsmnmNPtk3hQURUyG9eAB+usz6DAwagMusjx/zb3AjvDUvhFGDAexGw==", "cpu": [ "arm" ], @@ -583,9 +583,9 @@ ] }, "node_modules/@rollup/rollup-android-arm64": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.34.4.tgz", - "integrity": "sha512-1aRlh1gqtF7vNPMnlf1vJKk72Yshw5zknR/ZAVh7zycRAGF2XBMVDAHmFQz/Zws5k++nux3LOq/Ejj1WrDR6xg==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.40.1.tgz", + "integrity": "sha512-PPkxTOisoNC6TpnDKatjKkjRMsdaWIhyuMkA4UsBXT9WEZY4uHezBTjs6Vl4PbqQQeu6oION1w2voYZv9yquCw==", "cpu": [ "arm64" ], @@ -596,9 +596,9 @@ ] }, "node_modules/@rollup/rollup-darwin-arm64": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.34.4.tgz", - "integrity": "sha512-drHl+4qhFj+PV/jrQ78p9ch6A0MfNVZScl/nBps5a7u01aGf/GuBRrHnRegA9bP222CBDfjYbFdjkIJ/FurvSQ==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.40.1.tgz", + "integrity": "sha512-VWXGISWFY18v/0JyNUy4A46KCFCb9NVsH+1100XP31lud+TzlezBbz24CYzbnA4x6w4hx+NYCXDfnvDVO6lcAA==", "cpu": [ "arm64" ], @@ -609,9 +609,9 @@ ] }, "node_modules/@rollup/rollup-darwin-x64": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.34.4.tgz", - "integrity": "sha512-hQqq/8QALU6t1+fbNmm6dwYsa0PDD4L5r3TpHx9dNl+aSEMnIksHZkSO3AVH+hBMvZhpumIGrTFj8XCOGuIXjw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.40.1.tgz", + "integrity": "sha512-nIwkXafAI1/QCS7pxSpv/ZtFW6TXcNUEHAIA9EIyw5OzxJZQ1YDrX+CL6JAIQgZ33CInl1R6mHet9Y/UZTg2Bw==", "cpu": [ "x64" ], @@ -622,9 +622,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-arm64": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.34.4.tgz", - "integrity": "sha512-/L0LixBmbefkec1JTeAQJP0ETzGjFtNml2gpQXA8rpLo7Md+iXQzo9kwEgzyat5Q+OG/C//2B9Fx52UxsOXbzw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.40.1.tgz", + "integrity": "sha512-BdrLJ2mHTrIYdaS2I99mriyJfGGenSaP+UwGi1kB9BLOCu9SR8ZpbkmmalKIALnRw24kM7qCN0IOm6L0S44iWw==", "cpu": [ "arm64" ], @@ -635,9 +635,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-x64": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.34.4.tgz", - "integrity": "sha512-6Rk3PLRK+b8L/M6m/x6Mfj60LhAUcLJ34oPaxufA+CfqkUrDoUPQYFdRrhqyOvtOKXLJZJwxlOLbQjNYQcRQfw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.40.1.tgz", + "integrity": "sha512-VXeo/puqvCG8JBPNZXZf5Dqq7BzElNJzHRRw3vjBE27WujdzuOPecDPc/+1DcdcTptNBep3861jNq0mYkT8Z6Q==", "cpu": [ "x64" ], @@ -648,9 +648,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-gnueabihf": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.34.4.tgz", - "integrity": "sha512-kmT3x0IPRuXY/tNoABp2nDvI9EvdiS2JZsd4I9yOcLCCViKsP0gB38mVHOhluzx+SSVnM1KNn9k6osyXZhLoCA==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.40.1.tgz", + "integrity": "sha512-ehSKrewwsESPt1TgSE/na9nIhWCosfGSFqv7vwEtjyAqZcvbGIg4JAcV7ZEh2tfj/IlfBeZjgOXm35iOOjadcg==", "cpu": [ "arm" ], @@ -661,9 +661,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-musleabihf": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.34.4.tgz", - "integrity": "sha512-3iSA9tx+4PZcJH/Wnwsvx/BY4qHpit/u2YoZoXugWVfc36/4mRkgGEoRbRV7nzNBSCOgbWMeuQ27IQWgJ7tRzw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.40.1.tgz", + "integrity": "sha512-m39iO/aaurh5FVIu/F4/Zsl8xppd76S4qoID8E+dSRQvTyZTOI2gVk3T4oqzfq1PtcvOfAVlwLMK3KRQMaR8lg==", "cpu": [ "arm" ], @@ -674,9 +674,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.34.4.tgz", - "integrity": "sha512-7CwSJW+sEhM9sESEk+pEREF2JL0BmyCro8UyTq0Kyh0nu1v0QPNY3yfLPFKChzVoUmaKj8zbdgBxUhBRR+xGxg==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.40.1.tgz", + "integrity": "sha512-Y+GHnGaku4aVLSgrT0uWe2o2Rq8te9hi+MwqGF9r9ORgXhmHK5Q71N757u0F8yU1OIwUIFy6YiJtKjtyktk5hg==", "cpu": [ "arm64" ], @@ -687,9 +687,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-musl": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.34.4.tgz", - "integrity": "sha512-GZdafB41/4s12j8Ss2izofjeFXRAAM7sHCb+S4JsI9vaONX/zQ8cXd87B9MRU/igGAJkKvmFmJJBeeT9jJ5Cbw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.40.1.tgz", + "integrity": "sha512-jEwjn3jCA+tQGswK3aEWcD09/7M5wGwc6+flhva7dsQNRZZTe30vkalgIzV4tjkopsTS9Jd7Y1Bsj6a4lzz8gQ==", "cpu": [ "arm64" ], @@ -700,9 +700,9 @@ ] }, "node_modules/@rollup/rollup-linux-loongarch64-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.34.4.tgz", - "integrity": "sha512-uuphLuw1X6ur11675c2twC6YxbzyLSpWggvdawTUamlsoUv81aAXRMPBC1uvQllnBGls0Qt5Siw8reSIBnbdqQ==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.40.1.tgz", + "integrity": "sha512-ySyWikVhNzv+BV/IDCsrraOAZ3UaC8SZB67FZlqVwXwnFhPihOso9rPOxzZbjp81suB1O2Topw+6Ug3JNegejQ==", "cpu": [ "loong64" ], @@ -713,9 +713,9 @@ ] }, "node_modules/@rollup/rollup-linux-powerpc64le-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.34.4.tgz", - "integrity": "sha512-KvLEw1os2gSmD6k6QPCQMm2T9P2GYvsMZMRpMz78QpSoEevHbV/KOUbI/46/JRalhtSAYZBYLAnT9YE4i/l4vg==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.40.1.tgz", + "integrity": "sha512-BvvA64QxZlh7WZWqDPPdt0GH4bznuL6uOO1pmgPnnv86rpUpc8ZxgZwcEgXvo02GRIZX1hQ0j0pAnhwkhwPqWg==", "cpu": [ "ppc64" ], @@ -726,9 +726,22 @@ ] }, "node_modules/@rollup/rollup-linux-riscv64-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.34.4.tgz", - "integrity": "sha512-wcpCLHGM9yv+3Dql/CI4zrY2mpQ4WFergD3c9cpRowltEh5I84pRT/EuHZsG0In4eBPPYthXnuR++HrFkeqwkA==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.40.1.tgz", + "integrity": "sha512-EQSP+8+1VuSulm9RKSMKitTav89fKbHymTf25n5+Yr6gAPZxYWpj3DzAsQqoaHAk9YX2lwEyAf9S4W8F4l3VBQ==", + "cpu": [ + "riscv64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-riscv64-musl": { + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.40.1.tgz", + "integrity": "sha512-n/vQ4xRZXKuIpqukkMXZt9RWdl+2zgGNx7Uda8NtmLJ06NL8jiHxUawbwC+hdSq1rrw/9CghCpEONor+l1e2gA==", "cpu": [ "riscv64" ], @@ -739,9 +752,9 @@ ] }, "node_modules/@rollup/rollup-linux-s390x-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.34.4.tgz", - "integrity": "sha512-nLbfQp2lbJYU8obhRQusXKbuiqm4jSJteLwfjnunDT5ugBKdxqw1X9KWwk8xp1OMC6P5d0WbzxzhWoznuVK6XA==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.40.1.tgz", + "integrity": "sha512-h8d28xzYb98fMQKUz0w2fMc1XuGzLLjdyxVIbhbil4ELfk5/orZlSTpF/xdI9C8K0I8lCkq+1En2RJsawZekkg==", "cpu": [ "s390x" ], @@ -752,9 +765,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-gnu": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.34.4.tgz", - "integrity": "sha512-JGejzEfVzqc/XNiCKZj14eb6s5w8DdWlnQ5tWUbs99kkdvfq9btxxVX97AaxiUX7xJTKFA0LwoS0KU8C2faZRg==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.40.1.tgz", + "integrity": "sha512-XiK5z70PEFEFqcNj3/zRSz/qX4bp4QIraTy9QjwJAb/Z8GM7kVUsD0Uk8maIPeTyPCP03ChdI+VVmJriKYbRHQ==", "cpu": [ "x64" ], @@ -765,9 +778,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-musl": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.34.4.tgz", - "integrity": "sha512-/iFIbhzeyZZy49ozAWJ1ZR2KW6ZdYUbQXLT4O5n1cRZRoTpwExnHLjlurDXXPKEGxiAg0ujaR9JDYKljpr2fDg==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.40.1.tgz", + "integrity": "sha512-2BRORitq5rQ4Da9blVovzNCMaUlyKrzMSvkVR0D4qPuOy/+pMCrh1d7o01RATwVy+6Fa1WBw+da7QPeLWU/1mQ==", "cpu": [ "x64" ], @@ -778,9 +791,9 @@ ] }, "node_modules/@rollup/rollup-win32-arm64-msvc": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.34.4.tgz", - "integrity": "sha512-qORc3UzoD5UUTneiP2Afg5n5Ti1GAW9Gp5vHPxzvAFFA3FBaum9WqGvYXGf+c7beFdOKNos31/41PRMUwh1tpA==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.40.1.tgz", + "integrity": "sha512-b2bcNm9Kbde03H+q+Jjw9tSfhYkzrDUf2d5MAd1bOJuVplXvFhWz7tRtWvD8/ORZi7qSCy0idW6tf2HgxSXQSg==", "cpu": [ "arm64" ], @@ -791,9 +804,9 @@ ] }, "node_modules/@rollup/rollup-win32-ia32-msvc": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.34.4.tgz", - "integrity": "sha512-5g7E2PHNK2uvoD5bASBD9aelm44nf1w4I5FEI7MPHLWcCSrR8JragXZWgKPXk5i2FU3JFfa6CGZLw2RrGBHs2Q==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.40.1.tgz", + "integrity": "sha512-DfcogW8N7Zg7llVEfpqWMZcaErKfsj9VvmfSyRjCyo4BI3wPEfrzTtJkZG6gKP/Z92wFm6rz2aDO7/JfiR/whA==", "cpu": [ "ia32" ], @@ -804,9 +817,9 @@ ] }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.34.4.tgz", - "integrity": "sha512-p0scwGkR4kZ242xLPBuhSckrJ734frz6v9xZzD+kHVYRAkSUmdSLCIJRfql6H5//aF8Q10K+i7q8DiPfZp0b7A==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.40.1.tgz", + "integrity": "sha512-ECyOuDeH3C1I8jH2MK1RtBJW+YPMvSfT0a5NN0nHfQYnDSJ6tUiZH3gzwVP5/Kfh/+Tt7tpWVF9LXNTnhTJ3kA==", "cpu": [ "x64" ], @@ -817,9 +830,9 @@ ] }, "node_modules/@types/estree": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz", - "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==", + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.7.tgz", + "integrity": "sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==", "dev": true }, "node_modules/@types/node": { @@ -3179,12 +3192,12 @@ } }, "node_modules/rollup": { - "version": "4.34.4", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.34.4.tgz", - "integrity": "sha512-spF66xoyD7rz3o08sHP7wogp1gZ6itSq22SGa/IZTcUDXDlOyrShwMwkVSB+BUxFRZZCUYqdb3KWDEOMVQZxuw==", + "version": "4.40.1", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.40.1.tgz", + "integrity": "sha512-C5VvvgCCyfyotVITIAv+4efVytl5F7wt+/I2i9q9GZcEXW9BP52YYOXC58igUi+LFZVHukErIIqQSWwv/M3WRw==", "dev": true, "dependencies": { - "@types/estree": "1.0.6" + "@types/estree": "1.0.7" }, "bin": { "rollup": "dist/bin/rollup" @@ -3194,25 +3207,26 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.34.4", - "@rollup/rollup-android-arm64": "4.34.4", - "@rollup/rollup-darwin-arm64": "4.34.4", - "@rollup/rollup-darwin-x64": "4.34.4", - "@rollup/rollup-freebsd-arm64": "4.34.4", - "@rollup/rollup-freebsd-x64": "4.34.4", - "@rollup/rollup-linux-arm-gnueabihf": "4.34.4", - "@rollup/rollup-linux-arm-musleabihf": "4.34.4", - "@rollup/rollup-linux-arm64-gnu": "4.34.4", - "@rollup/rollup-linux-arm64-musl": "4.34.4", - "@rollup/rollup-linux-loongarch64-gnu": "4.34.4", - "@rollup/rollup-linux-powerpc64le-gnu": "4.34.4", - "@rollup/rollup-linux-riscv64-gnu": "4.34.4", - "@rollup/rollup-linux-s390x-gnu": "4.34.4", - "@rollup/rollup-linux-x64-gnu": "4.34.4", - "@rollup/rollup-linux-x64-musl": "4.34.4", - "@rollup/rollup-win32-arm64-msvc": "4.34.4", - "@rollup/rollup-win32-ia32-msvc": "4.34.4", - "@rollup/rollup-win32-x64-msvc": "4.34.4", + "@rollup/rollup-android-arm-eabi": "4.40.1", + "@rollup/rollup-android-arm64": "4.40.1", + "@rollup/rollup-darwin-arm64": "4.40.1", + "@rollup/rollup-darwin-x64": "4.40.1", + "@rollup/rollup-freebsd-arm64": "4.40.1", + "@rollup/rollup-freebsd-x64": "4.40.1", + "@rollup/rollup-linux-arm-gnueabihf": "4.40.1", + "@rollup/rollup-linux-arm-musleabihf": "4.40.1", + "@rollup/rollup-linux-arm64-gnu": "4.40.1", + "@rollup/rollup-linux-arm64-musl": "4.40.1", + "@rollup/rollup-linux-loongarch64-gnu": "4.40.1", + "@rollup/rollup-linux-powerpc64le-gnu": "4.40.1", + "@rollup/rollup-linux-riscv64-gnu": "4.40.1", + "@rollup/rollup-linux-riscv64-musl": "4.40.1", + "@rollup/rollup-linux-s390x-gnu": "4.40.1", + "@rollup/rollup-linux-x64-gnu": "4.40.1", + "@rollup/rollup-linux-x64-musl": "4.40.1", + "@rollup/rollup-win32-arm64-msvc": "4.40.1", + "@rollup/rollup-win32-ia32-msvc": "4.40.1", + "@rollup/rollup-win32-x64-msvc": "4.40.1", "fsevents": "~2.3.2" } }, @@ -3580,6 +3594,48 @@ "dev": true, "license": "MIT" }, + "node_modules/tinyglobby": { + "version": "0.2.13", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz", + "integrity": "sha512-mEwzpUgrLySlveBwEVDMKk5B57bhLPYovRfPAXD5gA/98Opn0rCDj3GtLwFvCvH5RK9uPCExUROW5NjDwvqkxw==", + "dev": true, + "dependencies": { + "fdir": "^6.4.4", + "picomatch": "^4.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/SuperchupuDev" + } + }, + "node_modules/tinyglobby/node_modules/fdir": { + "version": "6.4.4", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz", + "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==", + "dev": true, + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, + "node_modules/tinyglobby/node_modules/picomatch": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, "node_modules/tinypool": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-1.0.2.tgz", @@ -3754,14 +3810,17 @@ } }, "node_modules/vite": { - "version": "6.2.6", - "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.6.tgz", - "integrity": "sha512-9xpjNl3kR4rVDZgPNdTL0/c6ao4km69a/2ihNQbcANz8RuCOK3hQBmLSJf3bRKVQjVMda+YvizNE8AwvogcPbw==", + "version": "6.3.4", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.4.tgz", + "integrity": "sha512-BiReIiMS2fyFqbqNT/Qqt4CVITDU9M9vE+DKcVAsB+ZV0wvTKd+3hMbkpxz1b+NmEDMegpVbisKiAZOnvO92Sw==", "dev": true, "dependencies": { "esbuild": "^0.25.0", + "fdir": "^6.4.4", + "picomatch": "^4.0.2", "postcss": "^8.5.3", - "rollup": "^4.30.1" + "rollup": "^4.34.9", + "tinyglobby": "^0.2.13" }, "bin": { "vite": "bin/vite.js" @@ -3846,6 +3905,32 @@ "url": "https://opencollective.com/vitest" } }, + "node_modules/vite/node_modules/fdir": { + "version": "6.4.4", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz", + "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==", + "dev": true, + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, + "node_modules/vite/node_modules/picomatch": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, "node_modules/vitest": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/vitest/-/vitest-3.1.1.tgz", diff --git a/package.json b/package.json index 49183de6..efbaa870 100644 --- a/package.json +++ b/package.json @@ -103,8 +103,8 @@ "remove-attr": "^0.0.13", "sass": "^1.57.1", "simple-git": "^3.24.0", - "vite": "^6.2.6", + "vite": "^6.3.4", "vitest": "^3.1.1", "vue": "^3.5.13" } -} +} \ No newline at end of file From e22bb2a2de8515d4b1b1ef75bbabd5e216ea539e Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:14:09 +0200 Subject: [PATCH 002/343] Improvement - Add html2canvas options to composables and config --- src/img.js | 4 ++-- src/pdf.js | 4 ++-- src/useConfig.js | 17 ++++++++++++++++- src/usePrinter.js | 5 ++++- 4 files changed, 24 insertions(+), 6 deletions(-) diff --git a/src/img.js b/src/img.js index 5fed5e93..36d7bdcc 100644 --- a/src/img.js +++ b/src/img.js @@ -1,10 +1,10 @@ import html2canvas from 'html2canvas'; -export default function saveAsImage({ domElement, fileName, format = 'png' }) { +export default function saveAsImage({ domElement, fileName, format = 'png', options = {} }) { if (domElement) { return new Promise((resolve, reject) => { const downloadLink = document.createElement('a'); - html2canvas(domElement, { scale: 2 }) + html2canvas(domElement, { ...options }) .then((canvas) => { downloadLink.href = canvas.toDataURL(`image/${format}`); downloadLink.download = `${fileName}.${format}`; diff --git a/src/pdf.js b/src/pdf.js index bfc016de..b9726c2d 100644 --- a/src/pdf.js +++ b/src/pdf.js @@ -1,7 +1,7 @@ import html2canvas from 'html2canvas'; import JsPDF from "jspdf"; -export default function pdf({domElement, fileName}) { +export default function pdf({domElement, fileName, options = {} }) { if(domElement) { const a4 = { height: 851.89, @@ -9,7 +9,7 @@ export default function pdf({domElement, fileName}) { }; const pdf = new JsPDF("", "pt", "a4"); let contentWidth, contentHeight, imgWidth, imgHeight, pageData; - return html2canvas(domElement) + return html2canvas(domElement, { ...options }) .then((canvasChart) => { contentWidth = canvasChart.width; contentHeight = canvasChart.height; diff --git a/src/useConfig.js b/src/useConfig.js index 22647d80..66c71b8f 100755 --- a/src/useConfig.js +++ b/src/useConfig.js @@ -171,7 +171,15 @@ export function useConfig() { animation, annotator }, - buttonTitles + buttonTitles, + // html2canvas options + print: { + allowTaint: false, + backgroundColor: '#FFFFFF', + useCORS: false, + onclone: null, + scale: 2 + } } } @@ -2491,6 +2499,13 @@ export function useConfig() { fullscreen: 'Toggle fullscreen', annotator: 'Toggle annotator' }, + userOptionsPrint: { + allowTaint: false, + backgroundColor: '#FFFFFF', + useCORS: false, + onclone: null, + scale: 2 + }, title: '', titleBold: true, titleFontSize: FONT._16, diff --git a/src/usePrinter.js b/src/usePrinter.js index 95d2763a..fa5b7567 100644 --- a/src/usePrinter.js +++ b/src/usePrinter.js @@ -3,7 +3,8 @@ import { ref } from "vue"; export function usePrinter({ elementId, fileName, - canPrint = true + canPrint = true, + options }) { const isPrinting = ref(false); const isImaging = ref(false); @@ -20,6 +21,7 @@ export function usePrinter({ await pdf({ domElement: document.getElementById(elementId), fileName, + options }); } catch (error) { console.error("Error generating PDF:", error); @@ -42,6 +44,7 @@ export function usePrinter({ domElement: document.getElementById(elementId), fileName, format: "png", + options }); } catch (error) { console.error("Error generating image:", error); From 4a1554d34758a7b53a508c9340d11e7ead9dcb3e Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:14:58 +0200 Subject: [PATCH 003/343] Improvement - Update types with html2canvas options --- types/vue-data-ui.d.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/types/vue-data-ui.d.ts b/types/vue-data-ui.d.ts index 05e37a24..37a659d9 100644 --- a/types/vue-data-ui.d.ts +++ b/types/vue-data-ui.d.ts @@ -211,6 +211,14 @@ declare module "vue-data-ui" { table?: string; tooltip?: string; }; + // html2canvas options + print?: { + allowTaint?: boolean; + backgroundColor?: string; + useCORS?: boolean; + onclone?: null | ((doc: Document) => void); + scale?: number; + }; }; export type ChartTableCell = { @@ -5116,6 +5124,13 @@ declare module "vue-data-ui" { fullscreen?: string; annotator?: string; }; + userOptionsPrint?: { + allowTaint?: boolean; + backgroundColor?: string; + useCORS?: boolean; + onclone?: null | ((doc: Document) => void), + scale?: number; + }; showUserOptionsOnChartHover?: boolean; keepUserOptionsStateOnChartLeave?: boolean; }; From 61640291188f4388b62f56136c2c7003cd938c84 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:17:30 +0200 Subject: [PATCH 004/343] Improvement - Add html2canvas options params to usePrinter calls --- src/components/vue-ui-3d-bar.vue | 3 ++- src/components/vue-ui-age-pyramid.vue | 3 ++- src/components/vue-ui-bullet.vue | 3 ++- src/components/vue-ui-candlestick.vue | 3 ++- src/components/vue-ui-carousel-table.vue | 3 ++- src/components/vue-ui-chestnut.vue | 3 ++- src/components/vue-ui-circle-pack.vue | 3 ++- src/components/vue-ui-donut-evolution.vue | 3 ++- src/components/vue-ui-donut.vue | 3 ++- src/components/vue-ui-dumbbell.vue | 3 ++- src/components/vue-ui-flow.vue | 3 ++- src/components/vue-ui-funnel.vue | 3 ++- src/components/vue-ui-galaxy.vue | 3 ++- src/components/vue-ui-gauge.vue | 3 ++- src/components/vue-ui-heatmap.vue | 3 ++- src/components/vue-ui-history-plot.vue | 3 ++- src/components/vue-ui-molecule.vue | 3 ++- src/components/vue-ui-mood-radar.vue | 3 ++- src/components/vue-ui-nested-donuts.vue | 3 ++- src/components/vue-ui-onion.vue | 3 ++- src/components/vue-ui-parallel-coordinate-plot.vue | 3 ++- src/components/vue-ui-quadrant.vue | 3 ++- src/components/vue-ui-quick-chart.vue | 3 ++- src/components/vue-ui-radar.vue | 3 ++- src/components/vue-ui-relation-circle.vue | 3 ++- src/components/vue-ui-rings.vue | 3 ++- src/components/vue-ui-scatter.vue | 1 + src/components/vue-ui-stackbar.vue | 3 ++- src/components/vue-ui-strip-plot.vue | 3 ++- src/components/vue-ui-table-heatmap.vue | 3 ++- src/components/vue-ui-table-sparkline.vue | 3 ++- src/components/vue-ui-thermometer.vue | 3 ++- src/components/vue-ui-tiremarks.vue | 3 ++- src/components/vue-ui-treemap.vue | 3 ++- src/components/vue-ui-vertical-bar.vue | 3 ++- src/components/vue-ui-waffle.vue | 3 ++- src/components/vue-ui-wheel.vue | 3 ++- src/components/vue-ui-word-cloud.vue | 3 ++- src/components/vue-ui-xy-canvas.vue | 4 ++-- src/components/vue-ui-xy.vue | 8 +++++--- 40 files changed, 82 insertions(+), 42 deletions(-) diff --git a/src/components/vue-ui-3d-bar.vue b/src/components/vue-ui-3d-bar.vue index 3581f8bd..b2674c3e 100644 --- a/src/components/vue-ui-3d-bar.vue +++ b/src/components/vue-ui-3d-bar.vue @@ -109,7 +109,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `3d_bar_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-3d-bar' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-3d-bar', + options: FINAL_CONFIG.value.userOptions.print }); const customPalette = computed(() => { diff --git a/src/components/vue-ui-age-pyramid.vue b/src/components/vue-ui-age-pyramid.vue index 117eb0fb..afbe5077 100644 --- a/src/components/vue-ui-age-pyramid.vue +++ b/src/components/vue-ui-age-pyramid.vue @@ -143,7 +143,8 @@ function prepareChart() { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-age-pyramid_${uid.value}`, - fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-age-pyramid' + fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-age-pyramid', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-bullet.vue b/src/components/vue-ui-bullet.vue index 090ab95b..be450591 100644 --- a/src/components/vue-ui-bullet.vue +++ b/src/components/vue-ui-bullet.vue @@ -332,7 +332,8 @@ const legendConfig = computed(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `bullet_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-bullet' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-bullet', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-candlestick.vue b/src/components/vue-ui-candlestick.vue index 56ac30ee..23916d1b 100644 --- a/src/components/vue-ui-candlestick.vue +++ b/src/components/vue-ui-candlestick.vue @@ -205,7 +205,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-candlestick_${uid.value}`, - fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-candlestick' + fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-candlestick', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-carousel-table.vue b/src/components/vue-ui-carousel-table.vue index 836ba738..c47e070c 100644 --- a/src/components/vue-ui-carousel-table.vue +++ b/src/components/vue-ui-carousel-table.vue @@ -103,7 +103,8 @@ watch(() => props.dataset, (_) => { const { isPrinting, isImaging, generatePdf: makePdf, generateImage } = usePrinter({ elementId: `carousel-table_${uid.value}`, - fileName: FINAL_CONFIG.value.caption.text || 'vue-ui-carousel-table' + fileName: FINAL_CONFIG.value.caption.text || 'vue-ui-carousel-table', + options: FINAL_CONFIG.value.userOptions.print }); const mutableConfig = ref({ diff --git a/src/components/vue-ui-chestnut.vue b/src/components/vue-ui-chestnut.vue index 2184b031..1a635373 100644 --- a/src/components/vue-ui-chestnut.vue +++ b/src/components/vue-ui-chestnut.vue @@ -103,7 +103,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-chestnut_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.layout.title.text || 'vue-ui-chestnut' + fileName: FINAL_CONFIG.value.style.chart.layout.title.text || 'vue-ui-chestnut', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-circle-pack.vue b/src/components/vue-ui-circle-pack.vue index 35995b96..1e3efeca 100644 --- a/src/components/vue-ui-circle-pack.vue +++ b/src/components/vue-ui-circle-pack.vue @@ -116,7 +116,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-circle-pack_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-circle-pack' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-circle-pack', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-donut-evolution.vue b/src/components/vue-ui-donut-evolution.vue index c60c79ff..03395c5f 100644 --- a/src/components/vue-ui-donut-evolution.vue +++ b/src/components/vue-ui-donut-evolution.vue @@ -225,7 +225,8 @@ watch(() => props.dataset, (_) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: uid.value, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-donut-evolution' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-donut-evolution', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-donut.vue b/src/components/vue-ui-donut.vue index f4fd2425..4020c41f 100644 --- a/src/components/vue-ui-donut.vue +++ b/src/components/vue-ui-donut.vue @@ -186,7 +186,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `donut__${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-donut' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-donut', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-dumbbell.vue b/src/components/vue-ui-dumbbell.vue index 6097aa17..1db16046 100644 --- a/src/components/vue-ui-dumbbell.vue +++ b/src/components/vue-ui-dumbbell.vue @@ -175,7 +175,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `dumbbell_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-dumbbell' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-dumbbell', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-flow.vue b/src/components/vue-ui-flow.vue index 6b8d2187..757bd434 100644 --- a/src/components/vue-ui-flow.vue +++ b/src/components/vue-ui-flow.vue @@ -117,7 +117,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `flow_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-flow' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-flow', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-funnel.vue b/src/components/vue-ui-funnel.vue index c5641c68..7eb783a6 100644 --- a/src/components/vue-ui-funnel.vue +++ b/src/components/vue-ui-funnel.vue @@ -178,7 +178,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `funnel_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-funnel' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-funnel', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-galaxy.vue b/src/components/vue-ui-galaxy.vue index 89624bb8..d2eb43f4 100644 --- a/src/components/vue-ui-galaxy.vue +++ b/src/components/vue-ui-galaxy.vue @@ -140,7 +140,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `galaxy_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-galaxy' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-galaxy', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-gauge.vue b/src/components/vue-ui-gauge.vue index a32e569f..e9ddc3d9 100644 --- a/src/components/vue-ui-gauge.vue +++ b/src/components/vue-ui-gauge.vue @@ -103,7 +103,8 @@ function prepareConfig() { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-gauge_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-gauge' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-gauge', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-heatmap.vue b/src/components/vue-ui-heatmap.vue index aa30d119..039c9ad3 100644 --- a/src/components/vue-ui-heatmap.vue +++ b/src/components/vue-ui-heatmap.vue @@ -134,7 +134,8 @@ watch(() => props.dataset, () => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `heatmap__${uid.value}`, - fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-heatmap' + fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-heatmap', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-history-plot.vue b/src/components/vue-ui-history-plot.vue index 0e5baa78..ee37364b 100644 --- a/src/components/vue-ui-history-plot.vue +++ b/src/components/vue-ui-history-plot.vue @@ -276,7 +276,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `history_plot_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-history-plot' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-history-plot', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-molecule.vue b/src/components/vue-ui-molecule.vue index c28f5d24..cdf93c96 100644 --- a/src/components/vue-ui-molecule.vue +++ b/src/components/vue-ui-molecule.vue @@ -125,7 +125,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `cluster_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-molecule' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-molecule', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-mood-radar.vue b/src/components/vue-ui-mood-radar.vue index c9447a1a..6c5d3d62 100644 --- a/src/components/vue-ui-mood-radar.vue +++ b/src/components/vue-ui-mood-radar.vue @@ -116,7 +116,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: uid.value, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-mood-radar' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-mood-radar', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-nested-donuts.vue b/src/components/vue-ui-nested-donuts.vue index 67b477a4..abe483d3 100644 --- a/src/components/vue-ui-nested-donuts.vue +++ b/src/components/vue-ui-nested-donuts.vue @@ -166,7 +166,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `nested_donuts_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-nested-donuts' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-nested-donuts', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-onion.vue b/src/components/vue-ui-onion.vue index 35b87e47..481db98c 100644 --- a/src/components/vue-ui-onion.vue +++ b/src/components/vue-ui-onion.vue @@ -115,7 +115,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-onion_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-onion' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-onion', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-parallel-coordinate-plot.vue b/src/components/vue-ui-parallel-coordinate-plot.vue index d943b8c4..85c4fbd5 100644 --- a/src/components/vue-ui-parallel-coordinate-plot.vue +++ b/src/components/vue-ui-parallel-coordinate-plot.vue @@ -212,7 +212,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `pcp_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-parallel-coordinate-plot' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-parallel-coordinate-plot', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-quadrant.vue b/src/components/vue-ui-quadrant.vue index a2e593b5..0ef5253e 100644 --- a/src/components/vue-ui-quadrant.vue +++ b/src/components/vue-ui-quadrant.vue @@ -204,7 +204,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-quadrant_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-quadrant' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-quadrant', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-quick-chart.vue b/src/components/vue-ui-quick-chart.vue index a7e3c86e..286f533b 100644 --- a/src/components/vue-ui-quick-chart.vue +++ b/src/components/vue-ui-quick-chart.vue @@ -189,7 +189,8 @@ watch(() => chartType.value, (v) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `${chartType.value}_${uid.value}`, - fileName: FINAL_CONFIG.value.title || chartType.value + fileName: FINAL_CONFIG.value.title || chartType.value, + options: FINAL_CONFIG.value.userOptionsPrint }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-radar.vue b/src/components/vue-ui-radar.vue index 6bbff58a..42ede0d8 100644 --- a/src/components/vue-ui-radar.vue +++ b/src/components/vue-ui-radar.vue @@ -161,7 +161,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-radar_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-radar' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-radar', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-relation-circle.vue b/src/components/vue-ui-relation-circle.vue index 9e5d4ac6..8b703d93 100644 --- a/src/components/vue-ui-relation-circle.vue +++ b/src/components/vue-ui-relation-circle.vue @@ -96,7 +96,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `relation_circle_${uid.value}`, - fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-relation-circle' + fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-relation-circle', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-rings.vue b/src/components/vue-ui-rings.vue index 65003dec..dd17519b 100644 --- a/src/components/vue-ui-rings.vue +++ b/src/components/vue-ui-rings.vue @@ -186,7 +186,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `rings_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-rings' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-rings', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-scatter.vue b/src/components/vue-ui-scatter.vue index f90ea04b..b54de76f 100644 --- a/src/components/vue-ui-scatter.vue +++ b/src/components/vue-ui-scatter.vue @@ -161,6 +161,7 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-scatter_${uid.value}`, fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-scatter', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-stackbar.vue b/src/components/vue-ui-stackbar.vue index 8f36e607..8835131a 100755 --- a/src/components/vue-ui-stackbar.vue +++ b/src/components/vue-ui-stackbar.vue @@ -186,7 +186,8 @@ const mutableConfig = ref({ const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `stackbar_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-stackbar' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-stackbar', + options: FINAL_CONFIG.value.userOptions.print }); const defaultSizes = ref({ diff --git a/src/components/vue-ui-strip-plot.vue b/src/components/vue-ui-strip-plot.vue index 635cb369..a1a3c346 100644 --- a/src/components/vue-ui-strip-plot.vue +++ b/src/components/vue-ui-strip-plot.vue @@ -210,7 +210,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `strip-plot_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-strip-plot' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-strip-plot', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-table-heatmap.vue b/src/components/vue-ui-table-heatmap.vue index bd5a82d6..b52b7539 100644 --- a/src/components/vue-ui-table-heatmap.vue +++ b/src/components/vue-ui-table-heatmap.vue @@ -84,7 +84,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `table_heatmap_${uid.value}`, - fileName: 'vue-ui-table-heatmap' + fileName: 'vue-ui-table-heatmap', + options: FINAL_CONFIG.value.userOptions.print }); const breakpoint = computed(() => { diff --git a/src/components/vue-ui-table-sparkline.vue b/src/components/vue-ui-table-sparkline.vue index e8ee2574..353ad8b1 100644 --- a/src/components/vue-ui-table-sparkline.vue +++ b/src/components/vue-ui-table-sparkline.vue @@ -97,7 +97,8 @@ watch(() => props.dataset, (_) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `table_${uid.value}`, - fileName: FINAL_CONFIG.value.title.text || 'vue-ui-table-sparkline' + fileName: FINAL_CONFIG.value.title.text || 'vue-ui-table-sparkline', + options: FINAL_CONFIG.value.userOptions.print }); const customPalette = computed(() => { diff --git a/src/components/vue-ui-thermometer.vue b/src/components/vue-ui-thermometer.vue index fcf5e330..1aa6f5d0 100644 --- a/src/components/vue-ui-thermometer.vue +++ b/src/components/vue-ui-thermometer.vue @@ -116,7 +116,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `thermometer__${uid.value}`, - fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-thermometer' + fileName: FINAL_CONFIG.value.style.title.text || 'vue-ui-thermometer', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-tiremarks.vue b/src/components/vue-ui-tiremarks.vue index e5e42998..8265a05b 100644 --- a/src/components/vue-ui-tiremarks.vue +++ b/src/components/vue-ui-tiremarks.vue @@ -87,7 +87,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: uid.value, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-tiremarks' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-tiremarks', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-treemap.vue b/src/components/vue-ui-treemap.vue index edce238e..a2e88c9d 100644 --- a/src/components/vue-ui-treemap.vue +++ b/src/components/vue-ui-treemap.vue @@ -132,7 +132,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `treemap_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-treemap' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-treemap', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-vertical-bar.vue b/src/components/vue-ui-vertical-bar.vue index 9a748732..e9b876cb 100644 --- a/src/components/vue-ui-vertical-bar.vue +++ b/src/components/vue-ui-vertical-bar.vue @@ -126,7 +126,8 @@ watch(() => props.dataset, recalculateHeight, { deep: true }); const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-vertical-bar_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-vertical-bar' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-vertical-bar', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-waffle.vue b/src/components/vue-ui-waffle.vue index 46144b3f..41200cf0 100644 --- a/src/components/vue-ui-waffle.vue +++ b/src/components/vue-ui-waffle.vue @@ -180,7 +180,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `vue-ui-waffle_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-waffle' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-waffle', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-wheel.vue b/src/components/vue-ui-wheel.vue index 55fe43c9..22d7eb68 100644 --- a/src/components/vue-ui-wheel.vue +++ b/src/components/vue-ui-wheel.vue @@ -93,7 +93,8 @@ watch(() => props.config, (_newCfg) => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: uid.value, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-wheel' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-wheel', + options: FINAL_CONFIG.value.userOptions.print }); const hasOptionsNoTitle = computed(() => { diff --git a/src/components/vue-ui-word-cloud.vue b/src/components/vue-ui-word-cloud.vue index 643f4675..9c6b561d 100644 --- a/src/components/vue-ui-word-cloud.vue +++ b/src/components/vue-ui-word-cloud.vue @@ -202,7 +202,8 @@ onBeforeUnmount(() => { const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `wordCloud_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-word-cloud' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-word-cloud', + options: FINAL_CONFIG.value.userOptions.print }); const mutableConfig = ref({ diff --git a/src/components/vue-ui-xy-canvas.vue b/src/components/vue-ui-xy-canvas.vue index f7dd7998..7474288e 100644 --- a/src/components/vue-ui-xy-canvas.vue +++ b/src/components/vue-ui-xy-canvas.vue @@ -53,7 +53,6 @@ import { useNestedProp } from "../useNestedProp"; import { usePrinter } from "../usePrinter"; import { useResponsive } from "../useResponsive"; import { useConfig } from "../useConfig"; -import PenAndPaper from "../atoms/PenAndPaper.vue"; import { useUserOptionState } from "../useUserOptionState"; import { useChartAccessibility } from "../useChartAccessibility"; import NonSvgPenAndPaper from "../atoms/NonSvgPenAndPaper.vue"; @@ -204,7 +203,8 @@ const aspectRatio = ref(FINAL_CONFIG.value.style.chart.aspectRatio); const { isPrinting, isImaging, generatePdf, generateImage } = usePrinter({ elementId: `xy_canvas_${uid.value}`, - fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-xy-canvas' + fileName: FINAL_CONFIG.value.style.chart.title.text || 'vue-ui-xy-canvas', + options: FINAL_CONFIG.value.userOptions.print }); const mutableConfig = ref({ diff --git a/src/components/vue-ui-xy.vue b/src/components/vue-ui-xy.vue index a8e5167f..b50f57d1 100644 --- a/src/components/vue-ui-xy.vue +++ b/src/components/vue-ui-xy.vue @@ -3287,6 +3287,7 @@ export default { await pdf({ domElement: document.getElementById(`vue-ui-xy_${this.uniqueId}`), fileName: this.FINAL_CONFIG.chart.title.text || 'vue-ui-xy', + options: this.FINAL_CONFIG.chart.userOptions.print }); } catch (error) { console.error('Error generating PDF:', error); @@ -3314,9 +3315,10 @@ export default { try { const { default: img } = await import('../img.js'); await img({ - domElement: document.getElementById(`vue-ui-xy_${this.uniqueId}`), - fileName: this.FINAL_CONFIG.chart.title.text || 'vue-ui-xy', - format: 'png', + domElement: document.getElementById(`vue-ui-xy_${this.uniqueId}`), + fileName: this.FINAL_CONFIG.chart.title.text || 'vue-ui-xy', + format: 'png', + options: this.FINAL_CONFIG.chart.userOptions.print }); } catch (error) { console.error('Error generating image:', error); From 715e9bc2afffcfeab742a6b195ded652580672e6 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:17:52 +0200 Subject: [PATCH 005/343] Dev environment - Update testing arena --- TestingArena/ArenaVueUi3dBar.vue | 5 +++++ TestingArena/ArenaVueUiAgePyramid.vue | 5 +++++ TestingArena/ArenaVueUiBullet.vue | 5 +++++ TestingArena/ArenaVueUiCandlestick.vue | 5 +++++ TestingArena/ArenaVueUiCarouselTable.vue | 5 +++++ TestingArena/ArenaVueUiChestnut.vue | 5 +++++ TestingArena/ArenaVueUiCirclePack.vue | 5 +++++ TestingArena/ArenaVueUiDonut.vue | 5 +++++ TestingArena/ArenaVueUiDonutEvolution.vue | 5 +++++ TestingArena/ArenaVueUiDumbbell.vue | 5 +++++ TestingArena/ArenaVueUiFlow.vue | 5 +++++ TestingArena/ArenaVueUiFunnel.vue | 5 +++++ TestingArena/ArenaVueUiGalaxy.vue | 5 +++++ TestingArena/ArenaVueUiGauge.vue | 5 +++++ TestingArena/ArenaVueUiHeatmap.vue | 5 +++++ TestingArena/ArenaVueUiHistoryPlot.vue | 5 +++++ TestingArena/ArenaVueUiMolecule.vue | 5 +++++ TestingArena/ArenaVueUiMoodRadar.vue | 5 +++++ TestingArena/ArenaVueUiNestedDonuts.vue | 5 +++++ TestingArena/ArenaVueUiOnion.vue | 5 +++++ .../ArenaVueUiParallelCoordinatePlot.vue | 5 +++++ TestingArena/ArenaVueUiQuadrant.vue | 7 ++++++- TestingArena/ArenaVueUiQuickChart.vue | 5 +++++ TestingArena/ArenaVueUiRadar.vue | 5 +++++ TestingArena/ArenaVueUiRelationCircle.vue | 5 +++++ TestingArena/ArenaVueUiRings.vue | 5 +++++ TestingArena/ArenaVueUiScatter.vue | 5 +++++ TestingArena/ArenaVueUiStackbar.vue | 5 +++++ TestingArena/ArenaVueUiStripPlot.vue | 5 +++++ TestingArena/ArenaVueUiTableHeatmap.vue | 5 +++++ TestingArena/ArenaVueUiTableSparkline.vue | 5 +++++ TestingArena/ArenaVueUiThermometer.vue | 5 +++++ TestingArena/ArenaVueUiTiremarks.vue | 5 +++++ TestingArena/ArenaVueUiTreemap.vue | 5 +++++ TestingArena/ArenaVueUiVerticalBar.vue | 5 +++++ TestingArena/ArenaVueUiWaffle.vue | 5 +++++ TestingArena/ArenaVueUiWheel.vue | 5 +++++ TestingArena/ArenaVueUiWordCloud.vue | 5 +++++ TestingArena/ArenaVueUiXy.vue | 18 ++++++++++++++++-- TestingArena/ArenaVueUiXyCanvas.vue | 5 +++++ 40 files changed, 212 insertions(+), 3 deletions(-) diff --git a/TestingArena/ArenaVueUi3dBar.vue b/TestingArena/ArenaVueUi3dBar.vue index 3bd38a9f..92afa53c 100644 --- a/TestingArena/ArenaVueUi3dBar.vue +++ b/TestingArena/ArenaVueUi3dBar.vue @@ -90,6 +90,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.shape', def: 'bar', type: 'select', options: ['bar', 'tube']}, diff --git a/TestingArena/ArenaVueUiAgePyramid.vue b/TestingArena/ArenaVueUiAgePyramid.vue index 7b558bff..f0bed411 100644 --- a/TestingArena/ArenaVueUiAgePyramid.vue +++ b/TestingArena/ArenaVueUiAgePyramid.vue @@ -54,6 +54,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.backgroundColor', def: '#FFFFFF20', type: 'color'}, { key: 'style.color', def: '#1A1A1A', type: 'color'}, diff --git a/TestingArena/ArenaVueUiBullet.vue b/TestingArena/ArenaVueUiBullet.vue index 84f30157..ac1789ce 100644 --- a/TestingArena/ArenaVueUiBullet.vue +++ b/TestingArena/ArenaVueUiBullet.vue @@ -48,6 +48,11 @@ const model = ref([ { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, + { key: 'style.chart.backgroundColor', def: '#FFFFFF', type: 'color' }, { key: 'style.chart.color', def: '#1A1A1A', type: 'color'}, { key: 'style.chart.height', def: 96, type: 'range', min: 64, max: 120 }, diff --git a/TestingArena/ArenaVueUiCandlestick.vue b/TestingArena/ArenaVueUiCandlestick.vue index 9e5f8daa..a68f4569 100644 --- a/TestingArena/ArenaVueUiCandlestick.vue +++ b/TestingArena/ArenaVueUiCandlestick.vue @@ -69,6 +69,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'style.fontFamily', def: "inherit", type: 'text'}, diff --git a/TestingArena/ArenaVueUiCarouselTable.vue b/TestingArena/ArenaVueUiCarouselTable.vue index 7fe07c6e..60afce0f 100644 --- a/TestingArena/ArenaVueUiCarouselTable.vue +++ b/TestingArena/ArenaVueUiCarouselTable.vue @@ -91,6 +91,11 @@ const model = ref([ { key: 'userOptions.buttonTitles.fullscreen', def: 'TOGGLE FULLSCREEN', type: 'text'}, { key: 'userOptions.buttonTitles.open', def: 'OPEN OPTIONS', type: 'text'}, { key: 'userOptions.buttonTitles.close', def: 'CLOSE OPTIONS', type: 'text'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, ]) const config = computed(() => { diff --git a/TestingArena/ArenaVueUiChestnut.vue b/TestingArena/ArenaVueUiChestnut.vue index f29704e2..2161bc99 100644 --- a/TestingArena/ArenaVueUiChestnut.vue +++ b/TestingArena/ArenaVueUiChestnut.vue @@ -285,6 +285,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiCirclePack.vue b/TestingArena/ArenaVueUiCirclePack.vue index 59bb8e5b..be624173 100644 --- a/TestingArena/ArenaVueUiCirclePack.vue +++ b/TestingArena/ArenaVueUiCirclePack.vue @@ -213,6 +213,11 @@ const model = ref([ def: "auto", type: "text", }, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, ]); const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiDonut.vue b/TestingArena/ArenaVueUiDonut.vue index d93a8dfb..ba0d7046 100644 --- a/TestingArena/ArenaVueUiDonut.vue +++ b/TestingArena/ArenaVueUiDonut.vue @@ -193,6 +193,11 @@ const model = ref([ { key: 'userOptions.buttonTitles.open', def: 'OPEN OPTIONS', type: 'text'}, { key: 'userOptions.buttonTitles.close', def: 'CLOSE OPTIONS', type: 'text'}, { key: 'userOptions.buttonTitles.annotator', def: 'TOGGLE ANNOTATOR', type: 'text'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const testCustomTooltip = ref(false); diff --git a/TestingArena/ArenaVueUiDonutEvolution.vue b/TestingArena/ArenaVueUiDonutEvolution.vue index dc3f0d6f..e2e04de1 100644 --- a/TestingArena/ArenaVueUiDonutEvolution.vue +++ b/TestingArena/ArenaVueUiDonutEvolution.vue @@ -37,6 +37,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiDumbbell.vue b/TestingArena/ArenaVueUiDumbbell.vue index 5fd54c84..72b0763a 100644 --- a/TestingArena/ArenaVueUiDumbbell.vue +++ b/TestingArena/ArenaVueUiDumbbell.vue @@ -38,6 +38,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useAnimation', def: true, type: 'checkbox'}, { key: 'animationSpeed', def: 2, type: 'number', min: 1, max: 10}, diff --git a/TestingArena/ArenaVueUiFlow.vue b/TestingArena/ArenaVueUiFlow.vue index 48f195a4..4e95766b 100644 --- a/TestingArena/ArenaVueUiFlow.vue +++ b/TestingArena/ArenaVueUiFlow.vue @@ -34,6 +34,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text' }, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color' }, diff --git a/TestingArena/ArenaVueUiFunnel.vue b/TestingArena/ArenaVueUiFunnel.vue index 5408d4e7..216cd09f 100644 --- a/TestingArena/ArenaVueUiFunnel.vue +++ b/TestingArena/ArenaVueUiFunnel.vue @@ -98,6 +98,11 @@ const model = ref([ { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, ]) const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiGalaxy.vue b/TestingArena/ArenaVueUiGalaxy.vue index b4eb3bdf..40c92b0d 100644 --- a/TestingArena/ArenaVueUiGalaxy.vue +++ b/TestingArena/ArenaVueUiGalaxy.vue @@ -33,6 +33,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'useBlurOnHover', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiGauge.vue b/TestingArena/ArenaVueUiGauge.vue index f8db0910..173456a6 100644 --- a/TestingArena/ArenaVueUiGauge.vue +++ b/TestingArena/ArenaVueUiGauge.vue @@ -142,6 +142,11 @@ const model = ref([ { key: 'style.chart.layout.indicatorArc.show', def: true, type: 'checkbox'}, { key: 'style.chart.layout.indicatorArc.fill', def: '#E1E5E890', type: 'color'}, { key: 'style.chart.layout.indicatorArc.radius', def: 123, type: 'number', min: 0, max: 200 }, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiHeatmap.vue b/TestingArena/ArenaVueUiHeatmap.vue index d69831aa..e6b56b31 100644 --- a/TestingArena/ArenaVueUiHeatmap.vue +++ b/TestingArena/ArenaVueUiHeatmap.vue @@ -83,6 +83,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: "inherit", type: 'text'}, { key: 'style.backgroundColor', def: '#FFFFFF', type: 'color'}, diff --git a/TestingArena/ArenaVueUiHistoryPlot.vue b/TestingArena/ArenaVueUiHistoryPlot.vue index 488ee663..5902bbe8 100644 --- a/TestingArena/ArenaVueUiHistoryPlot.vue +++ b/TestingArena/ArenaVueUiHistoryPlot.vue @@ -118,6 +118,11 @@ const model = ref([ { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, + ]); const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiMolecule.vue b/TestingArena/ArenaVueUiMolecule.vue index 43f77c93..0b557729 100644 --- a/TestingArena/ArenaVueUiMolecule.vue +++ b/TestingArena/ArenaVueUiMolecule.vue @@ -157,6 +157,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiMoodRadar.vue b/TestingArena/ArenaVueUiMoodRadar.vue index 7448815b..fe31e497 100644 --- a/TestingArena/ArenaVueUiMoodRadar.vue +++ b/TestingArena/ArenaVueUiMoodRadar.vue @@ -26,6 +26,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiNestedDonuts.vue b/TestingArena/ArenaVueUiNestedDonuts.vue index 456481f2..2a2754ea 100644 --- a/TestingArena/ArenaVueUiNestedDonuts.vue +++ b/TestingArena/ArenaVueUiNestedDonuts.vue @@ -64,6 +64,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'useBlurOnHover', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiOnion.vue b/TestingArena/ArenaVueUiOnion.vue index 6550bd2b..a13ba75d 100644 --- a/TestingArena/ArenaVueUiOnion.vue +++ b/TestingArena/ArenaVueUiOnion.vue @@ -70,6 +70,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox' }, { key: 'useStartAnimation', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiParallelCoordinatePlot.vue b/TestingArena/ArenaVueUiParallelCoordinatePlot.vue index 11da6406..db419305 100644 --- a/TestingArena/ArenaVueUiParallelCoordinatePlot.vue +++ b/TestingArena/ArenaVueUiParallelCoordinatePlot.vue @@ -54,6 +54,11 @@ const model = ref([ { key: 'style.chart.comments.offsetX', def: 0, type: 'number', min: -100, max: 100}, { key: 'style.chart.comments.offsetY', def: 0, type: 'number', min: -100, max: 100}, { key: 'responsive', def: false, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'userOptions.show', def: true, type: 'checkbox'}, { key: 'userOptions.buttons.pdf', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiQuadrant.vue b/TestingArena/ArenaVueUiQuadrant.vue index 21f90134..d4206d19 100644 --- a/TestingArena/ArenaVueUiQuadrant.vue +++ b/TestingArena/ArenaVueUiQuadrant.vue @@ -236,7 +236,12 @@ const model = ref([ { key: 'style.chart.tooltip.backgroundColor', def: '#FFFFFF', type: 'color' }, { key: 'style.chart.tooltip.backgroundOpacity', def: 100, type: 'range', min: 0, max: 100 }, { key: 'style.chart.tooltip.position', def: 'center', type:'select', options: ['left', 'center', 'right']}, - { key: 'style.chart.tooltip.offsetY', def: 24, type: 'number', min: 0, max: 48} + { key: 'style.chart.tooltip.offsetY', def: 24, type: 'number', min: 0, max: 48}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const testCustomTooltip = ref(false); diff --git a/TestingArena/ArenaVueUiQuickChart.vue b/TestingArena/ArenaVueUiQuickChart.vue index a3f3a95b..666ad8ce 100644 --- a/TestingArena/ArenaVueUiQuickChart.vue +++ b/TestingArena/ArenaVueUiQuickChart.vue @@ -132,6 +132,11 @@ const model = ref([ { key: 'showUserOptionsOnChartHover', def: true, type: 'checkbox'}, { key: 'keepUserOptionsStateOnChartLeave', def: true, type: 'checkbox'}, + { key: 'userOptionsPrint.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptionsPrint.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptionsPrint.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptionsPrint.backgroundColor', def: '#FFFFFF' }, + { key: 'axisLabelsFontSize', def: 12, type: 'number', min: 8, max: 24}, { key: 'barGap', def: 12, type: 'range', min: 0, max: 48}, { key: 'barAnimated', def: true, type: 'checkbox' }, diff --git a/TestingArena/ArenaVueUiRadar.vue b/TestingArena/ArenaVueUiRadar.vue index e5eb3c6c..6f4d7fda 100644 --- a/TestingArena/ArenaVueUiRadar.vue +++ b/TestingArena/ArenaVueUiRadar.vue @@ -170,6 +170,11 @@ const model = ref([ { key: 'table.td.outline', def: 'none', type: 'text'}, { key: 'table.td.roundingValue', def: 2, type: 'range', min: 0, max: 12}, { key: 'table.td.roundingPercentage', def: 2, type: 'range', min: 0, max: 12}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const testCustomTooltip = ref(false); diff --git a/TestingArena/ArenaVueUiRelationCircle.vue b/TestingArena/ArenaVueUiRelationCircle.vue index d5410f70..679985d7 100644 --- a/TestingArena/ArenaVueUiRelationCircle.vue +++ b/TestingArena/ArenaVueUiRelationCircle.vue @@ -89,6 +89,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.color', def: '#1A1A1A', type: 'color'}, { key: 'style.backgroundColor', def: '#FFFFFF', type: 'color'}, diff --git a/TestingArena/ArenaVueUiRings.vue b/TestingArena/ArenaVueUiRings.vue index 60392764..3181fdb6 100644 --- a/TestingArena/ArenaVueUiRings.vue +++ b/TestingArena/ArenaVueUiRings.vue @@ -74,6 +74,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'useBlurOnHover', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiScatter.vue b/TestingArena/ArenaVueUiScatter.vue index 810cfc74..d57c43ee 100644 --- a/TestingArena/ArenaVueUiScatter.vue +++ b/TestingArena/ArenaVueUiScatter.vue @@ -109,6 +109,11 @@ const model = ref([ { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, + { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'style.fontFamily', def: "inherit", type: 'text'}, { key: 'style.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiStackbar.vue b/TestingArena/ArenaVueUiStackbar.vue index c3b9da77..cccb8387 100644 --- a/TestingArena/ArenaVueUiStackbar.vue +++ b/TestingArena/ArenaVueUiStackbar.vue @@ -198,6 +198,11 @@ const model = ref([ { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, + ]) const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiStripPlot.vue b/TestingArena/ArenaVueUiStripPlot.vue index 68fecd51..a068a50a 100644 --- a/TestingArena/ArenaVueUiStripPlot.vue +++ b/TestingArena/ArenaVueUiStripPlot.vue @@ -100,6 +100,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiTableHeatmap.vue b/TestingArena/ArenaVueUiTableHeatmap.vue index 93efc317..9666920b 100644 --- a/TestingArena/ArenaVueUiTableHeatmap.vue +++ b/TestingArena/ArenaVueUiTableHeatmap.vue @@ -53,6 +53,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.backgroundColor', def: '#FFFFFF', type: 'color'}, { key: 'style.color', def: '#1A1A1A', type: 'color'}, diff --git a/TestingArena/ArenaVueUiTableSparkline.vue b/TestingArena/ArenaVueUiTableSparkline.vue index a6448170..16b81a7b 100644 --- a/TestingArena/ArenaVueUiTableSparkline.vue +++ b/TestingArena/ArenaVueUiTableSparkline.vue @@ -46,6 +46,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'responsiveBreakpoint', def: 500, type: 'number', min: 300, max: 800}, { key: 'showAverage', def: true, type: 'checkbox'}, diff --git a/TestingArena/ArenaVueUiThermometer.vue b/TestingArena/ArenaVueUiThermometer.vue index 464d590d..6850e103 100644 --- a/TestingArena/ArenaVueUiThermometer.vue +++ b/TestingArena/ArenaVueUiThermometer.vue @@ -47,6 +47,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color'}, diff --git a/TestingArena/ArenaVueUiTiremarks.vue b/TestingArena/ArenaVueUiTiremarks.vue index e685eb63..f52c691e 100644 --- a/TestingArena/ArenaVueUiTiremarks.vue +++ b/TestingArena/ArenaVueUiTiremarks.vue @@ -77,6 +77,11 @@ const model = ref([ { key: 'style.chart.title.subtitle.fontSize', def: 16, type: 'range', min: 8, max: 48}, { key: 'style.chart.title.subtitle.bold', def: false, type: 'checkbox'}, + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } + ]) const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiTreemap.vue b/TestingArena/ArenaVueUiTreemap.vue index 08c0797c..e92a1477 100644 --- a/TestingArena/ArenaVueUiTreemap.vue +++ b/TestingArena/ArenaVueUiTreemap.vue @@ -208,6 +208,11 @@ const model = ref([ { key: 'table.td.color', def: '#1A1A1A', type: 'color'}, { key: 'table.td.roundingValue', def: 2, type: 'number', min: 0, max: 12}, { key: 'table.td.roundingPercentage', def: 2, type: 'number', min: 0, max: 12}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]); const testCustomTooltip = ref(false); diff --git a/TestingArena/ArenaVueUiVerticalBar.vue b/TestingArena/ArenaVueUiVerticalBar.vue index b6dbaa3d..f9658fe5 100644 --- a/TestingArena/ArenaVueUiVerticalBar.vue +++ b/TestingArena/ArenaVueUiVerticalBar.vue @@ -112,6 +112,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'style.fontFamily', def: 'inherit', type: 'text'}, diff --git a/TestingArena/ArenaVueUiWaffle.vue b/TestingArena/ArenaVueUiWaffle.vue index 25c0bbde..99340c3e 100644 --- a/TestingArena/ArenaVueUiWaffle.vue +++ b/TestingArena/ArenaVueUiWaffle.vue @@ -131,6 +131,11 @@ const model = ref([ { key: 'table.td.outline', def: 'none', type: 'text'}, { key: 'table.td.roundingValue', def: 0, type: 'range', min: 0, max: 12}, { key: 'table.td.roundingPercentage', def: 0, type: 'range', min: 0, max: 12}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const testCustomTooltip = ref(false); diff --git a/TestingArena/ArenaVueUiWheel.vue b/TestingArena/ArenaVueUiWheel.vue index 27bc5018..f6bced9c 100644 --- a/TestingArena/ArenaVueUiWheel.vue +++ b/TestingArena/ArenaVueUiWheel.vue @@ -78,6 +78,11 @@ const model = ref([ { key: 'style.chart.title.subtitle.color', def: '#CCCCCC', type: 'color'}, { key: 'style.chart.title.subtitle.fontSize', def: 16, type: 'range', min: 8, max: 48}, { key: 'style.chart.title.subtitle.bold', def: false, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' } ]) const themeOptions = ref([ diff --git a/TestingArena/ArenaVueUiWordCloud.vue b/TestingArena/ArenaVueUiWordCloud.vue index d38e9d76..4abbf0b2 100644 --- a/TestingArena/ArenaVueUiWordCloud.vue +++ b/TestingArena/ArenaVueUiWordCloud.vue @@ -27,6 +27,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'useCssAnimation', def: true, type: 'checkbox'}, { key: 'animationDelayMs', def: 20, type: 'number', min: 0, max: 100}, diff --git a/TestingArena/ArenaVueUiXy.vue b/TestingArena/ArenaVueUiXy.vue index 8996c7b5..1d29dcbd 100644 --- a/TestingArena/ArenaVueUiXy.vue +++ b/TestingArena/ArenaVueUiXy.vue @@ -259,8 +259,8 @@ const model = ref([ { key: 'useCanvas', def: false, type: 'checkbox'}, // DEPRECATED (removed) { key: 'useCssAnimation', def: true, type: 'checkbox', label: 'useCssAnimation', category: 'general' }, { key: 'chart.fontFamily', def: 'inherit', type: 'text', label: 'fontFamily', category: 'general' }, - { key: 'chart.backgroundColor', def: '#FFFFFF', type: 'color', label: 'backgroundColor', category: 'general' }, - { key: 'chart.color', def: '#1A1A1A', type: 'color', label: 'textColor', category: 'general' }, + { key: 'chart.backgroundColor', def: 'transparent', type: 'color', label: 'backgroundColor', category: 'general' }, + { key: 'chart.color', def: '#FFFFFF', type: 'color', label: 'textColor', category: 'general' }, { key: 'chart.height', def: 600, type: 'range', min: 300, max: 1000, label: 'height', category: 'general' }, { key: 'chart.width', def: 1000, type: 'range', min: 300, max: 2000, label: 'width', category: 'general' }, { key: 'chart.zoom.show', def: true, type: 'checkbox', label: 'zoom', category: 'general' }, @@ -454,6 +454,11 @@ const model = ref([ { key: 'chart.comments.showInTooltip', def: true, type: 'checkbox'}, { key: 'chart.comments.width', def: 200, type: 'number', min: 50, max: 400}, { key: 'chart.comments.offsetY', def: 0, type: 'number', min: -100, max: 100}, + + { key: 'chart.userOptions.print.allowTaint', def: true, type: 'checkbox' }, + { key: 'chart.userOptions.print.backgroundColor', def: '#FFFFFF', type: 'color'}, + { key: 'chart.userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'chart.userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5 } ]); const testCustomTooltip = ref(false); @@ -553,6 +558,15 @@ const config = computed(() => { { name: 'total', scaleMin: null, scaleMax: null } ] }, + userOptions: { + ...c.chart.userOptions, + print: { + ...c.chart.userOptions.print, + // onclone: (doc) => { + // doc.body.style.backgroundColor = '#FF0000' + // } + } + }, highlightArea: [{ show: true, from: 2, diff --git a/TestingArena/ArenaVueUiXyCanvas.vue b/TestingArena/ArenaVueUiXyCanvas.vue index d415a89d..9a6d30f2 100644 --- a/TestingArena/ArenaVueUiXyCanvas.vue +++ b/TestingArena/ArenaVueUiXyCanvas.vue @@ -85,6 +85,11 @@ const model = ref([ { key: 'userOptions.position', def: 'right', type: 'select', options: ['left', 'right']}, { key: 'userOptions.showOnChartHover', def: true, type: 'checkbox'}, { key: 'userOptions.keepStateOnChartLeave', def: true, type: 'checkbox'}, + + { key: 'userOptions.print.scale', def: 2, type: 'number', min: 1, max: 5}, + { key: 'userOptions.print.allowTaint', def: true, type: 'checkbox'}, + { key: 'userOptions.print.useCORS', def: true, type: 'checkbox'}, + { key: 'userOptions.print.backgroundColor', def: '#FFFFFF' }, { key: 'style.fontFamily', def: 'Arial', type: 'text' }, { key: 'style.chart.backgroundColor', def: '#FFFFFF20', type: 'color' }, From dca5f3591fb837541e801e955fac163675514574 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:18:46 +0200 Subject: [PATCH 006/343] 2.6.42 --- package-lock.json | 4 ++-- package.json | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index d234e399..3d293dfa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,13 @@ { "name": "vue-data-ui", - "version": "2.6.41", + "version": "2.6.42", "lockfileVersion": 3, "requires": true, "dev": true, "packages": { "": { "name": "vue-data-ui", - "version": "2.6.41", + "version": "2.6.42", "license": "MIT", "devDependencies": { "@vitejs/plugin-vue": "^5.2.3", diff --git a/package.json b/package.json index efbaa870..adcd14ef 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "vue-data-ui", "private": false, - "version": "2.6.41", + "version": "2.6.42", "type": "module", "description": "A user-empowering data visualization Vue 3 components library for eloquent data storytelling", "keywords": [ @@ -107,4 +107,4 @@ "vitest": "^3.1.1", "vue": "^3.5.13" } -} \ No newline at end of file +} From 3ec0be1b84987c87ede0929068a000f7629d820b Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:48:40 +0200 Subject: [PATCH 007/343] Improvement - Add the logging html2canvas option --- src/useConfig.js | 6 ++++-- types/vue-data-ui.d.ts | 2 ++ 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/useConfig.js b/src/useConfig.js index 66c71b8f..49367e03 100755 --- a/src/useConfig.js +++ b/src/useConfig.js @@ -178,7 +178,8 @@ export function useConfig() { backgroundColor: '#FFFFFF', useCORS: false, onclone: null, - scale: 2 + scale: 2, + logging: false } } } @@ -2504,7 +2505,8 @@ export function useConfig() { backgroundColor: '#FFFFFF', useCORS: false, onclone: null, - scale: 2 + scale: 2, + logging: false, }, title: '', titleBold: true, diff --git a/types/vue-data-ui.d.ts b/types/vue-data-ui.d.ts index 37a659d9..6c6022ef 100644 --- a/types/vue-data-ui.d.ts +++ b/types/vue-data-ui.d.ts @@ -218,6 +218,7 @@ declare module "vue-data-ui" { useCORS?: boolean; onclone?: null | ((doc: Document) => void); scale?: number; + logging?: boolean; }; }; @@ -5130,6 +5131,7 @@ declare module "vue-data-ui" { useCORS?: boolean; onclone?: null | ((doc: Document) => void), scale?: number; + logging?: boolean; }; showUserOptionsOnChartHover?: boolean; keepUserOptionsStateOnChartLeave?: boolean; From 9d7925bec38a038efad126e5c02e99711fca0079 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 3 May 2025 01:48:52 +0200 Subject: [PATCH 008/343] 2.6.43 --- package-lock.json | 4 ++-- package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 3d293dfa..1748b944 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,13 @@ { "name": "vue-data-ui", - "version": "2.6.42", + "version": "2.6.43", "lockfileVersion": 3, "requires": true, "dev": true, "packages": { "": { "name": "vue-data-ui", - "version": "2.6.42", + "version": "2.6.43", "license": "MIT", "devDependencies": { "@vitejs/plugin-vue": "^5.2.3", diff --git a/package.json b/package.json index adcd14ef..c43d9081 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "vue-data-ui", "private": false, - "version": "2.6.42", + "version": "2.6.43", "type": "module", "description": "A user-empowering data visualization Vue 3 components library for eloquent data storytelling", "keywords": [ From 5cec9bd0c2b3f3c7cf8aac32b503cc8d9626d55a Mon Sep 17 00:00:00 2001 From: graphieros Date: Mon, 5 May 2025 07:44:14 +0200 Subject: [PATCH 009/343] Improvement - VueUiTreemap - Add breadcrumbs --- README.md | 2 +- TestingArena/ArenaVueUiTreemap.vue | 30 ++++-- documentation/installation.md | 4 +- package.json | 2 +- src/App.vue | 2 +- src/components/vue-ui-treemap.vue | 155 ++++++++++++++++++++++++++--- 6 files changed, 169 insertions(+), 26 deletions(-) diff --git a/README.md b/README.md index 6a008d46..f32966b9 100755 --- a/README.md +++ b/README.md @@ -447,7 +447,7 @@ From the dataset you pass into the props, this component will produce the most a | `VueUiStripPlot` | `VueUiStripPlotDataset[]` | `VueUiStripPlotConfig` | `@selectDatapoint`, `getData`, `generatePdf`, `generateCsv`, `generateImage`, `toggleTable`, `toggleLabels`, `toggleTooltip` | `#svg`, `#legend`, `#tooltip-before`, `#tooltip-after`, `#watermark`, `#chart-background` | ✅ | ✅ | | `VueUiThermometer` | `VueUiThermometerDataset` | `VueUiThermometerConfig` | `generatePdf`, `generateImage` | `#svg`, `#watermark`, `#chart-background` | ❌ | ✅ | | `VueUiTiremarks` | `VueUiTiremarksDataset` | `VueUiTiremarksConfig` | `generatePdf`, `generateImage` | `#svg`, `#legend`, `#watermark`, `#chart-background` | ❌ | ✅ | -| `VueUiTreemap` | `VueUiTreemapDatasetItem[]` | `VueUiTreemapConfig` | `@selectLegend`, `@selectDatapoint`, `getData`, `generatePdf`, `generateCsv`, `generateImage`, `toggleTable`, `toggleTooltip` | `#svg`, `#rect`, `#legend`, `#tooltip-before`, `#tooltip-after`, `#watermark` | ✅ | ✅ | +| `VueUiTreemap` | `VueUiTreemapDatasetItem[]` | `VueUiTreemapConfig` | `@selectLegend`, `@selectDatapoint`, `getData`, `generatePdf`, `generateCsv`, `generateImage`, `toggleTable`, `toggleTooltip` | `#svg`, `#rect`, `#legend`, `#tooltip-before`, `#tooltip-after`, `#watermark`, `#breadcrumb-label`, `#breadcrumb-arrow` | ✅ | ✅ | | `VueUiVerticalBar` | `VueUiVerticalBarDatasetItem[]` | `VueUiWheelConfig` | `@selectLegend`, `getData`, `generatePdf`, `generateCsv`, `generateImage`, `toggleTable`, `toggleSort`, `toggleTooltip` | `#svg`, `#legend`, `#tooltip-before`, `#tooltip-after`, `#watermark`, `#chart-background`, `#pattern` | ✅ | ✅ | | `VueUiWaffle` | `VueUiWaffleDatasetItem[]` | `VueUiWaffleConfig` | `@selectLegend`, `getData`, `generatePdf`, `generateCsv`, `generateImage`, `toggleTable`, `toggleTooltip` | `#svg`, `#legend`, `#tooltip-before`, `#tooltip-after`, `#watermark`, `#pattern` | ✅ | ✅ | | `VueUiWheel` | `VueUiWheelDataset` | `VueUiWheelConfig` | `generatePdf`, `generateImage` | `#svg`, `#watermark`, `#chart-background` | ❌ | ✅ | diff --git a/TestingArena/ArenaVueUiTreemap.vue b/TestingArena/ArenaVueUiTreemap.vue index e92a1477..d6d1e08e 100644 --- a/TestingArena/ArenaVueUiTreemap.vue +++ b/TestingArena/ArenaVueUiTreemap.vue @@ -10,28 +10,38 @@ const { local, build, vduiLocal, vduiBuild, toggleTable } = useArena() const dataset = ref([ { - name: 'S1', + name: 'Some datapoint', value: 100, children: [ { - name: 'S1 - C1', + name: 'Some kind of child', value: 50 }, { - name: 'S1 -C2', + name: 'Some other child', value: 25 }, { - name: 'S1 - C3', + name: 'Yet another child with a long name', value: 12.5, children: [ { - name: 'S1 - C3 - CC1', + name: 'Some nested child', value: 6 }, { - name: 'S1 - C3 - CC2', - value: 6.5 + name: 'Some other nested child with a very long name', + value: 6.5, + children: [ + { + name: 'kiddo1', + value: 6 + }, + { + name: 'kiddo2', + value: 6.5 + }, + ] }, ] } @@ -355,6 +365,12 @@ function selectDatapoint(datapoint) { \ No newline at end of file diff --git a/package.json b/package.json index 2297d03c..5a0b8aa8 100644 --- a/package.json +++ b/package.json @@ -107,4 +107,4 @@ "vitest": "^3.1.1", "vue": "^3.5.13" } -} +} \ No newline at end of file diff --git a/src/atoms/BaseIcon.vue b/src/atoms/BaseIcon.vue index 111f65f8..5886683a 100755 --- a/src/atoms/BaseIcon.vue +++ b/src/atoms/BaseIcon.vue @@ -182,7 +182,12 @@ const icons = computed(() => { home: ``, homeFilled: ``, icons: ``, - robot: `` + robot: ``, + hourglass: ``, + computer: ``, + htmlTag: ``, + curlyBrackets: ``, + curlySpread: ``, } }); diff --git a/src/index.js b/src/index.js index f6fd3644..9fd9bc3c 100755 --- a/src/index.js +++ b/src/index.js @@ -1,7 +1,7 @@ import { defineAsyncComponent } from "vue"; import getVueDataUiConfig from "./getVueDataUiConfig"; import getThemeConfig from "./getThemeConfig"; -import { getPalette, createWordCloudDatasetFromPlainText, abbreviate, createTSpans } from "./lib"; +import { getPalette, createWordCloudDatasetFromPlainText, abbreviate, createTSpans, createStraightPath, createSmoothPath } from "./lib"; import { lightenColor, darkenColor, shiftColorHue } from "./exposedLib"; export const Arrow = defineAsyncComponent(() => import("./atoms/Arrow.vue")) @@ -77,5 +77,7 @@ export { getVueDataUiConfig, lightenColor, shiftColorHue, - createTSpans + createTSpans, + createStraightPath, + createSmoothPath } \ No newline at end of file diff --git a/types/vue-data-ui.d.ts b/types/vue-data-ui.d.ts index db051773..503a037d 100644 --- a/types/vue-data-ui.d.ts +++ b/types/vue-data-ui.d.ts @@ -1155,7 +1155,12 @@ declare module "vue-data-ui" { | "home" | "homeFilled" | "icons" - | "robot"; + | "robot" + | "hourglass" + | "computer" + | "htmlTag" + | "curlyBrackets" + | "curlySpread"; export const VueUiIcon: DefineComponent<{ name: VueUiIconName; @@ -6878,6 +6883,38 @@ declare module "vue-data-ui" { | ((word: string) => string) | null; + + export type Point = { + [key: string]: any + x: number + y: number + } + + /** + * Vue Data UI utility + * --- + * Generate a straight line path to include in the d attribute of a svg path element + * ___ + * @example + * const path = createStraightPath([{x: 1, y: 1}, { x: 2, y: 1.2}]) + * + * @param points - An array of point objects + */ + export const createStraightPath: (points: Point[]) => string + + /** + * Vue Data UI utility + * --- + * Generate a spline path to include in the d attribute of a svg path element + * ___ + * @example + * const path = createSmoothPath([{x: 1, y: 1}, { x: 2, y: 1.2}, { x: 3, y: 0.2 }]) + * + * @param points - An array of point objects + */ + export const createSmoothPath: (points: Point[]) => string + + /** * Vue Data UI utility * --- From 019cbd9316f3d6fcb9b85460c00fc91705ec1e64 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sun, 11 May 2025 10:50:06 +0200 Subject: [PATCH 022/343] 2.6.48 --- package-lock.json | 4 ++-- package.json | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4a768eb4..43f035f2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,13 @@ { "name": "vue-data-ui", - "version": "2.6.47", + "version": "2.6.48", "lockfileVersion": 3, "requires": true, "dev": true, "packages": { "": { "name": "vue-data-ui", - "version": "2.6.47", + "version": "2.6.48", "license": "MIT", "devDependencies": { "@vitejs/plugin-vue": "^5.2.3", diff --git a/package.json b/package.json index 5a0b8aa8..2a383e40 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "vue-data-ui", "private": false, - "version": "2.6.47", + "version": "2.6.48", "type": "module", "description": "A user-empowering data visualization Vue 3 components library for eloquent data storytelling", "keywords": [ @@ -107,4 +107,4 @@ "vitest": "^3.1.1", "vue": "^3.5.13" } -} \ No newline at end of file +} From e708cb4cb43cb9aee13b26769bd695fa6a5df9fa Mon Sep 17 00:00:00 2001 From: graphieros Date: Fri, 16 May 2025 07:42:12 +0200 Subject: [PATCH 023/343] Improvement - VueUiWordCloud - Use better algorithm to pack words --- TestingArena/ArenaVueUiWordCloud.vue | 14 +- package-lock.json | 8 +- package.json | 4 +- src/App.vue | 2 +- src/components/vue-ui-word-cloud.vue | 235 +++++++++++++++++---------- src/useConfig.js | 8 +- 6 files changed, 172 insertions(+), 99 deletions(-) diff --git a/TestingArena/ArenaVueUiWordCloud.vue b/TestingArena/ArenaVueUiWordCloud.vue index 4abbf0b2..7e0e185d 100644 --- a/TestingArena/ArenaVueUiWordCloud.vue +++ b/TestingArena/ArenaVueUiWordCloud.vue @@ -9,7 +9,7 @@ import { useArena } from "../src/useArena"; const { local, build, vduiLocal, vduiBuild, toggleTable } = useArena() -const plainTextDataset = ref(`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus pulvinar pretium venenatis. Donec imperdiet elit id porttitor tristique. Aenean ac commodo justo. Vestibulum placerat molestie nisl, sit amet lacinia nulla posuere quis. Aenean ullamcorper eu ex vitae facilisis. Aliquam erat volutpat. Proin nunc felis, porttitor quis commodo lacinia, gravida sed orci. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus mattis vitae tellus ac luctus. Vestibulum faucibus sem nec varius eleifend. In gravida venenatis ipsum sit amet ultricies. Nam efficitur, dui ac imperdiet vestibulum, justo metus consectetur libero, posuere tempor neque magna vitae augue. Etiam gravida massa quis turpis vulputate, ac tempus nisi imperdiet. Donec at laoreet ligula. Nulla id ex sagittis, tincidunt lectus ut, gravida mauris. Nulla consectetur semper sem. Maecenas lacinia facilisis ex, lobortis lacinia orci ornare tristique. Nam quis erat a nunc vehicula finibus. Quisque vitae nibh condimentum, condimentum erat eu, finibus risus. Duis sodales orci vel ullamcorper ullamcorper. In hac habitasse platea dictumst. Vivamus tempus ut nulla id commodo. Cras lectus sem, porttitor id sem eu, posuere fringilla turpis. Integer pretium erat sed ipsum gravida ullamcorper. Nam facilisis metus non lorem congue imperdiet. Sed quis cursus eros. Pellentesque venenatis pellentesque turpis suscipit accumsan. Nam arcu quam, faucibus et arcu pretium, eleifend consequat lacus. Aliquam nec risus nec justo maximus ultricies at et velit. Nam at lacinia massa. Sed elit dolor, consequat in massa at, egestas accumsan ex. Aenean quis suscipit ipsum, ac condimentum eros. Sed eleifend nisi arcu, et iaculis mi semper quis. Mauris vel dui nisi. Fusce finibus lacus a tempus tristique. Sed molestie orci a velit facilisis ornare. Pellentesque ullamcorper sed velit ut iaculis. Fusce urna dolor, rutrum sit amet consequat et, vulputate a risus. Sed faucibus sem nec urna lobortis dapibus. Nam in nisl a dui euismod gravida non in erat. Cras lobortis vitae diam sed elementum. Sed cursus tempor enim, nec ornare sem facilisis non. Pellentesque euismod sit amet magna eget tempor. Proin tincidunt dignissim nulla vitae molestie. Proin gravida ac urna ut facilisis. Vestibulum sit amet ex non quam ornare scelerisque. Etiam pharetra magna neque. Cras maximus, ipsum at imperdiet interdum, nibh orci vulputate erat, vitae varius elit lectus sed nibh. Maecenas eget nulla ultricies, pharetra ante non, cursus risus. Mauris nec felis tincidunt, viverra lectus quis, feugiat tortor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas vitae pharetra leo. Vestibulum at accumsan ipsum, id pharetra dui. Pellentesque nibh purus, tincidunt a egestas in, dapibus quis nunc. Integer posuere tellus id mi tincidunt aliquet. Donec vel justo et eros eleifend tempor in in purus. Aenean id pellentesque nisl, eget vestibulum neque.Nulla ante mauris, posuere vel consequat vitae, suscipit id magna. In ipsum nisi, luctus quis interdum sagittis, condimentum at felis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aenean interdum massa quis ullamcorper luctus. Duis efficitur mauris a eros porta ornare vitae nec urna. Fusce tincidunt purus sit amet urna convallis, ac molestie felis suscipit. Sed scelerisque orci vel velit suscipit, non posuere dui fermentum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum velit libero, commodo at fringilla at, congue ut felis. Nulla vestibulum a ligula vel luctus. Nam at nunc erat. Nam tincidunt porta lectus eget molestie. Cras quis placerat est. Donec tellus magna, sollicitudin ac efficitur sed, auctor eget dui. Fusce eget sem magna. Donec fermentum velit lorem, quis suscipit odio posuere eu. Proin nunc arcu, pretium id gravida ut, mattis non erat. Aenean eu nisl et ligula pulvinar hendrerit. Pellentesque pharetra hendrerit sodales. Nam in justo dictum, egestas mauris nec, venenatis nisl. Mauris vehicula dolor metus, sed aliquam enim consequat vel. Suspendisse semper orci in leo rutrum volutpat. Aenean varius mauris diam. Sed ornare lacus turpis, eu tempor quam porta nec. Etiam suscipit quam enim, a consequat libero lacinia sed. Quisque eu justo eu orci sagittis pulvinar.Aenean augue tortor, porta nec augue ut, mollis ultricies nisi. Vestibulum iaculis pellentesque risus non efficitur. Proin eu sapien vel lectus blandit eleifend vel ac est. Maecenas quis massa sodales, pretium leo sed, fringilla elit. Sed a pellentesque felis. Phasellus quam sapien, vulputate ut sapien id, maximus tincidunt tellus. Nullam rhoncus mauris id pretium tincidunt. Nulla orci orci, molestie sollicitudin mollis in, ultricies sit amet ligula. Phasellus est nisi, condimentum eu lobortis a, posuere non lacus. Suspendisse vitae aliquam libero. Nunc sollicitudin neque at odio vulputate pulvinar quis nec nunc. Nullam vehicula nulla massa, vitae sodales nibh porttitor ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc rhoncus non erat quis blandit. +const plainTextDataset = ref(`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus pulvinar pretium venenatis. Donec imperdiet elit id porttitor tristique. Aenean ac commodo justo. Vestibulum placerat molestie nisl, sit amet lacinia nulla posuere quis. Aenean ullamcorper eu ex vitae facilisis. Aliquam erat volutpat. Proin nunc felis, porttitor quis commodo lacinia, gravida sed orci. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus mattis vitae tellus ac luctus. Vestibulum faucibus sem nec varius eleifend. In gravida venenatis ipsum sit amet ultricies. Nam efficitur, dui ac imperdiet vestibulum, justo metus consectetur libero, posuere tempor neque magna vitae augue. Etiam gravida massa quis turpis vulputate, ac tempus nisi imperdiet. Donec at laoreet ligula. Nulla id ex sagittis, tincidunt lectus ut, gravida mauris. Nulla consectetur semper sem. Maecenas lacinia facilisis ex, lobortis lacinia orci ornare tristique. Nam quis erat a nunc vehicula finibus. Quisque vitae nibh condimentum, condimentum erat eu, finibus risus. Duis sodales orci vel ullamcorper ullamcorper. In hac habitasse platea dictumst. Vivamus tempus ut nulla id commodo. Cras lectus sem, porttitor id sem eu, posuere fringilla turpis. Integer pretium erat sed ipsum gravida ullamcorper. Nam facilisis metus non lorem congue imperdiet. Sed quis cursus eros. Pellentesque venenatis pellentesque turpis suscipit accumsan. Nam arcu quam, faucibus et arcu pretium, eleifend consequat lacus. Aliquam nec risus nec justo maximus ultricies at et velit. Nam at lacinia massa. Sed elit dolor, consequat in massa at, egestas accumsan ex. Aenean quis suscipit ipsum, ac condimentum eros. Sed eleifend nisi arcu, et iaculis mi semper quis. Mauris vel dui nisi. Fusce finibus lacus a tempus tristique. Sed molestie orci a velit facilisis ornare. Pellentesque ullamcorper sed velit ut iaculis. Fusce urna dolor, rutrum sit amet consequat et, vulputate a risus. Sed faucibus sem nec urna lobortis dapibus. Nam in nisl a dui euismod gravida non in erat. Cras lobortis vitae diam sed elementum. Sed cursus tempor enim, nec ornare sem facilisis non. Pellentesque euismod sit amet magna eget tempor. Proin tincidunt dignissim nulla vitae molestie. Proin gravida ac urna ut facilisis. Vestibulum sit amet ex non quam ornare scelerisque. Etiam pharetra magna neque. Cras maximus, ipsum at imperdiet interdum, nibh orci vulputate erat, vitae varius elit lectus sed nibh. Maecenas eget nulla ultricies, pharetra ante non, cursus risus. Mauris nec felis tincidunt, viverra lectus quis, feugiat tortor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas vitae pharetra leo. Vestibulum at accumsan ipsum, id pharetra dui. Pellentesque nibh purus, tincidunt a egestas in, dapibus quis nunc. Integer posuere tellus id mi tincidunt aliquet. Donec vel justo et eros eleifend tempor in in purus. Aenean id pellentesque nisl, eget vestibulum neque.Nulla ante mauris, posuere vel consequat vitae, suscipit id magna. In ipsum nisi, luctus quis interdum sagittis, condimentum at felis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aenean interdum massa quis ullamcorper luctus. Duis efficitur mauris a eros porta ornare vitae nec urna. Fusce tincidunt purus sit amet urna convallis, ac molestie felis suscipit. Sed scelerisque orci vel velit suscipit, non posuere dui fermentum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum velit libero, commodo at fringilla at, congue ut felis. Nulla vestibulum a ligula vel luctus. Nam at nunc erat. Nam tincidunt porta lectus eget molestie. Cras quis placerat est. Donec tellus magna, sollicitudin ac efficitur sed, auctor eget dui. Fusce eget sem magna. Donec fermentum velit lorem, quis suscipit odio posuere eu. Proin nunc arcu, pretium id gravida ut, mattis non erat. Aenean eu nisl et ligula pulvinar hendrerit. Pellentesque pharetra hendrerit sodales. Nam in justo dictum, egestas mauris nec, venenatis nisl. Mauris vehicula dolor metus, sed aliquam enim consequat vel. Suspendisse semper orci in leo rutrum volutpat. Aenean varius mauris diam. Sed ornare lacus turpis, eu tempor quam porta nec. Etiam suscipit quam enim, a consequat libero lacinia sed. Quisque eu justo eu orci sagittis pulvinar.Aenean augue tortor, porta nec augue ut, mollis ultricies nisi. Vestibulum iaculis pellentesque risus non efficitur. Proin eu sapien vel lectus blandit eleifend vel ac est. Maecenas quis massa sodales, pretium leo sed, fringilla elit. Sed a pellentesque felis. Phasellus quam sapien, quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis quis vulputate ut sapien id, maximus tincidunt tellus. Nullam rhoncus mauris id pretium tincidunt. Nulla orci orci, molestie sollicitudin mollis in, ultricies sit amet ligula. Phasellus est nisi, condimentum eu lobortis a, posuere non lacus. Suspendisse vitae aliquam libero. Nunc sollicitudin neque at odio vulputate pulvinar quis nec nunc. Nullam vehicula nulla massa, vitae sodales nibh porttitor ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc rhoncus non erat quis blandit. Maecenas convallis libero at nisl lacinia facilisis. Nulla facilisi. Sed bibendum imperdiet massa. In nunc ipsum, maximus ac viverra non, pellentesque eget diam. Donec lobortis erat in nibh rhoncus, sit amet tincidunt urna vehicula. Cras iaculis, sapien quis convallis tristique, libero eros fermentum lorem, tristique luctus ante nulla at libero. Nulla fringilla eget ligula aliquet vulputate. Donec enim ex, hendrerit at lacinia quis, ultrices eget quam. Curabitur condimentum leo neque, ac rhoncus sapien euismod eu. Suspendisse tristique ullamcorper sapien, sed tincidunt enim commodo a. Aliquam risus sapien, interdum et temporvel, placerat ut quam. Ut turpis orci, pellentesque non eros at, suscipit placerat augue. Donec eget nisi lacus. Morbi id enim metus. Mauris ut sem malesuada, convallis lectus sit amet, dapibus arcu. Nulla tempor justo eu orci egestas vehicula. Donec bibendum erat libero, placerat lacinia elit luctus at. Pellentesque semper erat metus, sed volutpat nunc imperdiet a. Fusce vitae orci libero. Curabitur laoreet felis eget odio pulvinar pulvinar. Morbi elementum purus ut nibh tristique, id efficitur neque condimentum. Vestibulum porttitor bibendum pharetra. Nulla dapibus quam vel elit tincidunt, vestibulum pretium elit efficitur. Vestibulum nec ligula nec purus suscipit dictum laoreet quis risus. Maecenas non nibh ac eros ultrices maximus. Nullam pulvinar neque nec ipsum porta malesuada. Phasellus vestibulum faucibus vehicula. Vestibulum risus lectus, efficitur eu luctus ac, pellentesque in nisi. Fusce vitae ullamcorper purus, at molestie leo. Proin sed diam sollicitudin, ullamcorper eros sit amet, egestas sapien. Phasellus rutrum.`); const dataset = ref(createWordCloudDatasetFromPlainText(plainTextDataset.value)) @@ -68,9 +68,11 @@ const model = ref([ { key: 'table.td.suffix', def: 'S', type: 'text'}, { key: 'style.chart.zoom.show', def: true, type: 'checkbox'}, - { key: 'style.chart.zoom.color', def: '#CCCCCC', type: 'color'}, - { key: 'style.chart.zoom.highlightColor', def: '#4A4A4A', type: 'color'}, - { key: 'style.chart.zoom.useResetSlot', def: false, type: 'checkbox'}, + + // DEPRECATED: + // { key: 'style.chart.zoom.color', def: '#CCCCCC', type: 'color'}, + // { key: 'style.chart.zoom.highlightColor', def: '#4A4A4A', type: 'color'}, + // { key: 'style.chart.zoom.useResetSlot', def: false, type: 'checkbox'}, { key: 'style.chart.tooltip.show', def: true, type: 'checkbox', label: 'show', category: 'tooltip' }, { key: 'style.chart.tooltip.backgroundColor', def: '#FFFFFF', type: 'color', label: 'backgroundColor', category: 'tooltip' }, @@ -145,10 +147,10 @@ const step = ref(0) - - diff --git a/src/components/vue-ui-molecule.vue b/src/components/vue-ui-molecule.vue index cdf93c96..f816df08 100644 --- a/src/components/vue-ui-molecule.vue +++ b/src/components/vue-ui-molecule.vue @@ -35,6 +35,7 @@ import PenAndPaper from "../atoms/PenAndPaper.vue"; import { useUserOptionState } from "../useUserOptionState"; import { useChartAccessibility } from "../useChartAccessibility"; import usePanZoom from "../usePanZoom"; +import BaseIcon from "../atoms/BaseIcon.vue"; const { vue_ui_molecule: DEFAULT_CONFIG } = useConfig(); @@ -445,7 +446,7 @@ function toggleAnnotator() { const active = computed(() => !isAnnotator.value) -const { viewBox } = usePanZoom(svgRef, { +const { viewBox, resetZoom, isZoom } = usePanZoom(svgRef, { x: 0, y: 0, width: svg.value.width <= 0 ? 10 : svg.value.width, @@ -638,6 +639,22 @@ defineExpose({ +
+ + + +
+ + +
+ + + +
+ - \ No newline at end of file diff --git a/src/usePanZoom.js b/src/usePanZoom.js index 50fe1afc..4f73dbcb 100644 --- a/src/usePanZoom.js +++ b/src/usePanZoom.js @@ -1,4 +1,4 @@ -import { ref, onMounted, onUnmounted, watch, nextTick, watchEffect } from 'vue'; +import { ref, onMounted, onUnmounted, watch, nextTick, watchEffect, computed } from 'vue'; export default function usePanZoom(svgRef, initialViewBox = { x: 0, y: 0, width: 100, height: 100 }, speed = 1, activeRef) { const viewBox = ref({ ...initialViewBox }); @@ -10,6 +10,13 @@ export default function usePanZoom(svgRef, initialViewBox = { x: 0, y: 0, width: const pinchStartViewBox = ref(null); const isPinching = ref(false); + const isZoom = computed(() => { + return viewBox.value.x !== initialViewBox.x || + viewBox.value.y !== initialViewBox.y || + viewBox.value.width !== initialViewBox.width || + viewBox.value.height !== initialViewBox.height + }) + let velocity = { x: 0, y: 0 }; let animationFrame = null; let zoomAnimationFrame = null; @@ -70,6 +77,40 @@ export default function usePanZoom(svgRef, initialViewBox = { x: 0, y: 0, width: isPanning.value = false; }; + function resetZoom(animated = false) { + if (!animated) { + viewBox.value = { ...initialViewBox }; + scale.value = 1; + return; + } + + const startViewBox = { ...viewBox.value }; + const startScale = scale.value; + const duration = 300; + let start = null; + + function animate(ts) { + if (!start) start = ts; + const progress = Math.min((ts - start) / duration, 1); + + viewBox.value = { + x: startViewBox.x + (initialViewBox.x - startViewBox.x) * progress, + y: startViewBox.y + (initialViewBox.y - startViewBox.y) * progress, + width: startViewBox.width + (initialViewBox.width - startViewBox.width) * progress, + height: startViewBox.height + (initialViewBox.height - startViewBox.height) * progress, + }; + scale.value = startScale + (1 - startScale) * progress; + + if (progress < 1) { + requestAnimationFrame(animate); + } else { + viewBox.value = { ...initialViewBox }; + scale.value = 1; + } + } + requestAnimationFrame(animate); + } + function zoom(event) { event.preventDefault(); const zoomFactor = event.deltaY > 0 ? 0.9 : 1.1; @@ -213,5 +254,5 @@ export default function usePanZoom(svgRef, initialViewBox = { x: 0, y: 0, width: }; }); - return { viewBox }; + return { viewBox, resetZoom, isZoom }; } From ee54e9fb3c494e565dee0813f34d9ea0a99802b2 Mon Sep 17 00:00:00 2001 From: graphieros Date: Sat, 17 May 2025 07:46:15 +0200 Subject: [PATCH 030/343] 2.6.51 --- package-lock.json | 4 ++-- package.json | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 88cd4b36..ca78450e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,13 @@ { "name": "vue-data-ui", - "version": "2.6.50", + "version": "2.6.51", "lockfileVersion": 3, "requires": true, "dev": true, "packages": { "": { "name": "vue-data-ui", - "version": "2.6.50", + "version": "2.6.51", "license": "MIT", "devDependencies": { "@vitejs/plugin-vue": "^5.2.3", diff --git a/package.json b/package.json index 6f39a7af..a9cf7f10 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "vue-data-ui", "private": false, - "version": "2.6.50", + "version": "2.6.51", "type": "module", "description": "A user-empowering data visualization Vue 3 components library for eloquent data storytelling", "keywords": [ @@ -107,4 +107,4 @@ "vitest": "^3.1.1", "vue": "^3.5.13" } -} \ No newline at end of file +} From 707cb5a4694c3be1a3f76615fa1e6f59a16ab59f Mon Sep 17 00:00:00 2001 From: graphieros Date: Sun, 18 May 2025 08:01:12 +0200 Subject: [PATCH 031/343] Remove html2canvas --- README.md | 4 +- documentation/installation.md | 1 - package.json | 3 +- src/App.vue | 3 +- src/TestingArena.vue | 19 - src/atoms/BaseDirectionPad.vue | 2 +- src/atoms/DataTable.vue | 2 +- src/atoms/MonoSlicer.vue | 2 +- src/atoms/NonSvgPenAndPaper.vue | 2 +- src/atoms/PenAndPaper.vue | 2 +- src/atoms/Slicer.vue | 2 +- src/atoms/UserOptions.vue | 2 +- src/components/vue-data-ui.vue | 2 - src/components/vue-ui-3d-bar.vue | 2 +- src/components/vue-ui-annotator.vue | 83 ++-- src/components/vue-ui-cursor.vue | 2 +- src/components/vue-ui-dashboard.vue | 2 +- src/components/vue-ui-donut-evolution.vue | 4 +- src/components/vue-ui-molecule.vue | 2 +- src/components/vue-ui-screenshot.cy.js | 55 --- src/components/vue-ui-screenshot.vue | 436 ---------------------- src/components/vue-ui-stackbar.vue | 2 +- src/components/vue-ui-treemap.vue | 2 +- src/components/vue-ui-word-cloud.vue | 2 +- src/components/vue-ui-xy-canvas.vue | 2 +- src/components/vue-ui-xy.vue | 2 +- src/dom-to-png.js | 310 +++++++++++++++ src/img.js | 47 ++- src/index.js | 1 - src/main.js | 2 - src/pdf.js | 89 +++-- src/useConfig.js | 59 --- tests/getVueDataUiConfig.test.js | 1 - types/vue-data-ui.d.ts | 64 ---- 34 files changed, 450 insertions(+), 765 deletions(-) delete mode 100644 src/components/vue-ui-screenshot.cy.js delete mode 100644 src/components/vue-ui-screenshot.vue create mode 100644 src/dom-to-png.js diff --git a/README.md b/README.md index f32966b9..6a917b61 100755 --- a/README.md +++ b/README.md @@ -7,7 +7,7 @@ # vue-data-ui [![npm](https://img.shields.io/npm/v/vue-data-ui)](https://github.com/graphieros/vue-data-ui) -[![Static Badge](https://img.shields.io/badge/components-61-blue)](https://github.com/graphieros/vue-data-ui) +[![Static Badge](https://img.shields.io/badge/components-60-blue)](https://github.com/graphieros/vue-data-ui) [![GitHub issues](https://img.shields.io/github/issues/graphieros/vue-data-ui)](https://github.com/graphieros/vue-data-ui/issues) [![License](https://img.shields.io/badge/license-MIT-green)](https://github.com/graphieros/vue-data-ui?tab=MIT-1-ov-file#readme) [![MadeWithVueJs.com shield](https://madewithvuejs.com/storage/repo-shields/4526-shield.svg)](https://madewithvuejs.com/p/vue-data-ui/shield-link) @@ -94,7 +94,6 @@ Available components - [VueUiIcon](https://vue-data-ui.graphieros.com/docs#vue-ui-icon) - [VueUiKpi](https://vue-data-ui.graphieros.com/docs#vue-ui-kpi) - [VueUiMiniLoader](https://vue-data-ui.graphieros.com/docs#vue-ui-mini-loader) -- [VueUiScreenshot](https://vue-data-ui.graphieros.com/docs#vue-ui-screenshot) - [VueUiSkeleton](https://vue-data-ui.graphieros.com/docs#vue-ui-skeleton) - [VueUiTimer](https://vue-data-ui.graphieros.com/docs#vue-ui-timer) @@ -488,7 +487,6 @@ From the dataset you pass into the props, this component will produce the most a | `VueUiDigits` | `number` | `VueUiDigitsConfig` | ❌ | ❌ | | `VueUiKpi` | `number` | `VueUiKpiConfig` | ❌ | `#title`, `#value`, `#comment-before`, `#comment-after` | | `VueUiMiniLoader` | ❌ | `VueUiMiniLoaderConfig` | ❌ | ❌ | -| `VueUiScreenshot` | ❌ | `VueUiScreenshotConfig` | `@postImage`, `shoot`, `close` | ❌ | | `VueUiSkeleton` | ❌ | `VueUiSkeletonConfig` | ❌ | ❌ | | `VueUiTimer` | ❌ | `VueUiTimerConfig` | `@start`, `@pause`, `@reset`, `@restart`, `@lap` | `#time`, `#controls`, `#laps`, `#chart-background` | | `VueUiIcon` | see below | diff --git a/documentation/installation.md b/documentation/installation.md index 498acbc0..a3ca03eb 100755 --- a/documentation/installation.md +++ b/documentation/installation.md @@ -211,7 +211,6 @@ From the dataset you pass into the props, this component will produce the most a | `VueUiDigits` | `number` | `VueUiDigitsConfig` | ❌ | ❌ | | `VueUiKpi` | `number` | `VueUiKpiConfig` | ❌ | `#title`, `#value`, `#comment-before`, `#comment-after` | | `VueUiMiniLoader` | ❌ | `VueUiMiniLoaderConfig` | ❌ | ❌ | -| `VueUiScreenshot` | ❌ | `VueUiScreenshotConfig` | `@postImage`, `shoot`, `close` | ❌ | | `VueUiSkeleton` | ❌ | `VueUiSkeletonConfig` | ❌ | ❌ | | `VueUiTimer` | ❌ | `VueUiTimerConfig` | `@start`, `@pause`, `@reset`, `@restart`, `@lap` | `#time`, `#controls`, `#laps`, `#chart-background` | | `VueUiIcon` | see below | diff --git a/package.json b/package.json index a9cf7f10..8e7ee34a 100644 --- a/package.json +++ b/package.json @@ -98,7 +98,6 @@ "@vitejs/plugin-vue": "^5.2.3", "canvg": "^4.0.3", "cypress": "^14.0.3", - "html2canvas": "^1.4.1", "jspdf": "^3.0.1", "remove-attr": "^0.0.13", "sass": "^1.57.1", @@ -107,4 +106,4 @@ "vitest": "^3.1.1", "vue": "^3.5.13" } -} +} \ No newline at end of file diff --git a/src/App.vue b/src/App.vue index cdc08309..781079e0 100755 --- a/src/App.vue +++ b/src/App.vue @@ -110,7 +110,6 @@ const components = ref([ //------| /** * TODO: migrate manual testing for the following: - * - VueUiScreenshot * - VueUiDashboard * - VueUiCursor */ @@ -120,7 +119,7 @@ const components = ref([ //------| * Modify the index to display a component * [0] = VueUiXy */ - const selectedComponent = ref(components.value[37]); + const selectedComponent = ref(components.value[1]); /** * Legacy testing arena where some non chart components can be tested diff --git a/src/TestingArena.vue b/src/TestingArena.vue index 8678f206..a5b1378e 100644 --- a/src/TestingArena.vue +++ b/src/TestingArena.vue @@ -23,7 +23,6 @@ import GaugeTest from "./components/vue-ui-gauge.vue"; import ChestnutTest from "./components/vue-ui-chestnut.vue"; import OnionTest from "./components/vue-ui-onion.vue"; import VerticalTest from "./components/vue-ui-vertical-bar.vue"; -import ScreenshotTest from "./components/vue-ui-screenshot.vue"; import RatingTest from "./components/vue-ui-rating.vue"; import SkeletonTest from "./components/vue-ui-skeleton.vue"; import SparklineTest from "./components/vue-ui-sparkline.vue"; @@ -4329,24 +4328,6 @@ function testGetData() { - - - - - - -