szld-libs 0.2.25 → 0.2.26

package/es/utils/image-compression/image.d.ts

@@ -0,0 +1,8 @@
+export declare const fileToDataURL: (file: Blob | File) => Promise<any>;
+export declare const dataURLToImage: (dataURL: string) => Promise<HTMLImageElement>;
+export declare const canvastoFile: (canvas: HTMLCanvasElement, type: string, quality: number) => Promise<Blob | null>;
+export declare const scaleWidthHeight: (img: HTMLImageElement) => {
+    width: number;
+    height: number;
+};
+export declare const convertQualityToBit: (quality: number) => number;

package/es/utils/{compression-file.js → image-compression/image.js}

@@ -1,14 +1,16 @@
 const fileToDataURL = (file) => {
-  return new Promise((resolve) => {
+  return new Promise((resolve, reject) => {
     const reader = new FileReader();
     reader.onloadend = (e) => resolve(e.target.result);
+    reader.onerror = (e) => reject(e);
     reader.readAsDataURL(file);
   });
 };
 const dataURLToImage = (dataURL) => {
-  return new Promise((resolve) => {
+  return new Promise((resolve, reject) => {
     const img = new Image();
     img.onload = () => resolve(img);
+    img.onerror = (e) => reject(e);
     img.src = dataURL;
   });
 };
@@ -18,8 +20,8 @@ const canvastoFile = (canvas, type, quality) => {
   );
 };
 const scaleWidthHeight = (img) => {
-  const maxWidth = 1400;
-  const maxHeight = 1400;
+  const maxWidth = 2e3;
+  const maxHeight = 2e3;
   const originWidth = img.width;
   const originHeight = img.height;
   let targetWidth = img.width;
@@ -38,28 +40,19 @@ const scaleWidthHeight = (img) => {
     height: targetHeight
   };
 };
-const compressionFile = async (file, type = "image/jpeg", quality = 0.5, limit = 300) => {
-  const fileName = file.name;
-  if (file.size / 1024 < limit) {
-    return file;
+const convertQualityToBit = (quality) => {
+  let bit = 0;
+  if (quality > 1 || quality < 0) {
+    bit = 0;
+  } else {
+    bit = !quality ? 0 : quality * 256;
   }
-  const canvas = document.createElement("canvas");
-  const context = canvas.getContext("2d");
-  const base64 = await fileToDataURL(file);
-  const img = await dataURLToImage(base64);
-  const target = scaleWidthHeight(img);
-  canvas.width = target.width;
-  canvas.height = target.height;
-  context.clearRect(0, 0, target.width, target.height);
-  context.drawImage(img, 0, 0, target.width, target.height);
-  const blob = await canvastoFile(canvas, type, quality);
-  const newFile = new File([blob], fileName, {
-    type
-  });
-  return newFile;
+  return bit;
 };
 export {
-  compressionFile,
+  canvastoFile,
+  convertQualityToBit,
   dataURLToImage,
-  fileToDataURL
+  fileToDataURL,
+  scaleWidthHeight
 };

package/es/utils/image-compression/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 图片压缩方法
+ * @param {Object}  file 图片文件
+ * @param {Nubmber} quality 压缩质量参数 0-1
+ * @param {limit} limit 最小限制大小，小于该值时不进行压缩
+ * @returns 压缩后的新图片
+ */
+declare const compressionImage: (file: File, quality?: number, limit?: number) => Promise<File>;
+export default compressionImage;

package/es/utils/image-compression/index.js

@@ -0,0 +1,39 @@
+import UPNG from "./UPNG";
+import { fileToDataURL, dataURLToImage, scaleWidthHeight, canvastoFile, convertQualityToBit } from "./image";
+const compressionImage = async (file, quality = 0.5, limit = 300) => {
+  const fileName = file.name;
+  if (file.size / 1024 < limit) {
+    return file;
+  }
+  try {
+    const canvas = document.createElement("canvas");
+    const context = canvas.getContext("2d");
+    const base64 = await fileToDataURL(file);
+    const img = await dataURLToImage(base64);
+    const target = scaleWidthHeight(img);
+    canvas.width = target.width;
+    canvas.height = target.height;
+    context.clearRect(0, 0, target.width, target.height);
+    context.drawImage(img, 0, 0, target.width, target.height);
+    if (["image/jpeg", "image/jpg"].includes(file.type)) {
+      const blob = await canvastoFile(canvas, file.type, quality);
+      const newFile = new File([blob], fileName, {
+        type: file.type
+      });
+      return newFile;
+    } else {
+      const imageData = context.getImageData(0, 0, target.width, target.height).data;
+      const bit = convertQualityToBit(quality);
+      const png = UPNG.encode([imageData.buffer], target.width, target.height, bit);
+      const newFile = new File([png], file.name, {
+        type: file.type
+      });
+      return newFile;
+    }
+  } catch (error) {
+    return file;
+  }
+};
+export {
+  compressionImage as default
+};

package/es/utils/image-compression/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/lib/components/Upload/index.js

@@ -1,12 +1,12 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
-const antd = require("antd");
 const icons = require("@ant-design/icons");
-const filetype = require("../../utils/filetype");
+const antd = require("antd");
 const react = require("react");
-const utils = require("../../utils");
 require("react-dom");
-const compressionFile = require("../../utils/compression-file");
+const utils = require("../../utils");
+const filetype = require("../../utils/filetype");
+const compressionImage = require("../../utils/image-compression");
 const defaultFileType = [filetype.FileSuffix.jpeg, filetype.FileSuffix.jpg, filetype.FileSuffix.png];
 const UploadFile = (props) => {
   const {
@@ -51,9 +51,8 @@ const UploadFile = (props) => {
       }
       if (compression) {
         resolve(
-          compressionFile.compressionFile(
+          compressionImage(
             file,
-            compression.type,
             compression.quality,
             compression.limit
           )

package/lib/index.js

@@ -22,7 +22,10 @@ const Demo = () => {
       Salt: "HnSzldjt#2557013#"
     }));
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "100vh" }, children: "测试页面" });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { height: "100vh" }, children: [
+    "测试页面",
+    /* @__PURE__ */ jsxRuntime.jsx(main.UploadFile, { compression: { quality: 0.8, limit: 5 * 1024 }, accept: ".heic,.jpg,.png,.jpeg", maxSize: 100 })
+  ] });
 };
 ReactDOM.createRoot(document.getElementById("root")).render(
   /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.BrowserRouter, { children: /* @__PURE__ */ jsxRuntime.jsx(Demo, {}) })

package/lib/main.d.ts

@@ -9,6 +9,7 @@ import showWorkFlow, { WorkFlowNode } from "./components/WorkFlowNode";
 import * as download from "./utils/download";
 import * as fileType from "./utils/filetype";
 import * as FormRules from './utils/formRules';
+import compressionImage from './utils/image-compression';
 import * as utils from "./utils/index";
 import * as verfyCode from "./utils/verify-code";
 import useCaptcha from "./hooks/useCaptcha";
@@ -18,4 +19,4 @@ import useRemember from "./hooks/useRemember";
 import useRowSelection from "./hooks/useRowSelection";
 import AES from "./utils/aes";
 import HmacSHA512 from './utils/hmacSHA512';
-export { AES, AuthButton, BackHeader, CoralButton, CreateForm, EditTable, FormRules, HmacSHA512, SearchTable, UploadFile, WorkFlowNode, download, fileType, showWorkFlow, useCaptcha, useChangePwd, useConfig, useRemember, useRowSelection, utils, verfyCode };
+export { AES, AuthButton, BackHeader, CoralButton, CreateForm, EditTable, FormRules, HmacSHA512, SearchTable, UploadFile, WorkFlowNode, compressionImage, download, fileType, showWorkFlow, useCaptcha, useChangePwd, useConfig, useRemember, useRowSelection, utils, verfyCode };

package/lib/main.js

@@ -11,6 +11,7 @@ const WorkFlowNode = require("./components/WorkFlowNode");
 const download = require("./utils/download");
 const filetype = require("./utils/filetype");
 const formRules = require("./utils/formRules");
+const imageCompression = require("./utils/image-compression");
 const index = require("./utils/index");
 const verifyCode = require("./utils/verify-code");
 const useCaptcha = require("./hooks/useCaptcha");
@@ -56,6 +57,7 @@ exports.showWorkFlow = WorkFlowNode;
 exports.download = download__namespace;
 exports.fileType = filetype__namespace;
 exports.FormRules = formRules__namespace;
+exports.compressionImage = imageCompression;
 exports.utils = index__namespace;
 exports.verfyCode = verifyCode__namespace;
 exports.useCaptcha = useCaptcha;

package/lib/utils/image-compression/UPNG.d.ts

@@ -0,0 +1,142 @@
+export default UPNG;
+declare namespace UPNG {
+    function toRGBA8(out: any): ArrayBufferLike[];
+    namespace toRGBA8 {
+        function decodeImage(data: any, w: any, h: any, out: any): Uint8Array;
+    }
+    function decode(buff: any): {
+        tabs: {};
+        frames: never[];
+    };
+    namespace decode {
+        function _decompress(out: any, dd: any, w: any, h: any): any;
+        function _inflate(data: any, buff: any): any;
+        function _readInterlace(data: any, out: any): Uint8Array;
+        function _getBPP(out: any): number;
+        function _filterZero(data: any, out: any, off: any, w: any, h: any): any;
+        function _paeth(a: any, b: any, c: any): any;
+        function _IHDR(data: any, offset: any, out: any): void;
+    }
+    function inflateRaw(N: any, W: any): any;
+    namespace _bin {
+        function nextZero(data: any, p: any): any;
+        function readUshort(buff: any, p: any): number;
+        function writeUshort(buff: any, p: any, n: any): void;
+        function readUint(buff: any, p: any): number;
+        function writeUint(buff: any, p: any, n: any): void;
+        function readASCII(buff: any, p: any, l: any): string;
+        function writeASCII(data: any, p: any, s: any): void;
+        function readBytes(buff: any, p: any, l: any): any[];
+        function pad(n: any): any;
+        function readUTF8(buff: any, p: any, l: any): string;
+    }
+    function _copyTile(sb: any, sw: any, sh: any, tb: any, tw: any, th: any, xoff: any, yoff: any, mode: any): boolean;
+    function encode(bufs: any, w: any, h: any, ps: any, dels: any, tabs: any, forbidPlte: any): ArrayBufferLike;
+    namespace encode {
+        function _main(nimg: any, w: any, h: any, dels: any, tabs: any): ArrayBufferLike;
+        function compressPNG(out: any, filter: any, levelZero: any): void;
+        function compress(bufs: any, w: any, h: any, ps: any, prms: any): {
+            ctype: number;
+            depth: number;
+            plte: any[];
+            frames: {
+                rect: {
+                    x: number;
+                    y: number;
+                    width: any;
+                    height: any;
+                };
+                img: Uint8Array;
+                blend: number;
+                dispose: number;
+            }[];
+        };
+        function framize(bufs: any, w: any, h: any, alwaysBlend: any, evenCrd: any, forbidPrev: any): {
+            rect: {
+                x: number;
+                y: number;
+                width: any;
+                height: any;
+            };
+            img: Uint8Array;
+            blend: number;
+            dispose: number;
+        }[];
+        function _updateFrame(bufs: any, w: any, h: any, frms: any, i: any, r: any, evenCrd: any): void;
+        function _prepareDiff(cimg: any, w: any, h: any, nimg: any, rec: any): void;
+        function _filterZero(img: any, h: any, bpp: any, bpl: any, data: any, filter: any, levelZero: any): any;
+        function _filterLine(data: any, img: any, y: any, bpl: any, bpp: any, type: any): void;
+        function concatRGBA(bufs: any): ArrayBufferLike;
+    }
+    function encodeLL(bufs: any, w: any, h: any, cc: any, ac: any, depth: any, dels: any, tabs: any): ArrayBufferLike;
+    namespace crc {
+        export const table: Uint32Array;
+        export function update(c: any, buf: any, off: any, len: any): any;
+        export function crc_1(b: any, o: any, l: any): number;
+        export { crc_1 as crc };
+    }
+    function quantize(abuf: any, ps: any): {
+        abuf: ArrayBufferLike;
+        inds: Uint8Array;
+        plte: {
+            i0: number;
+            i1: any;
+            bst: null;
+            est: null;
+            tdst: number;
+            left: null;
+            right: null;
+        } | {
+            i0: number;
+            i1: any;
+            bst: null;
+            est: null;
+            tdst: number;
+            left: null;
+            right: null;
+        }[];
+    };
+    namespace quantize {
+        function getKDtree(nimg: any, ps: any, err: any): ({
+            i0: number;
+            i1: any;
+            bst: null;
+            est: null;
+            tdst: number;
+            left: null;
+            right: null;
+        } | {
+            i0: number;
+            i1: any;
+            bst: null;
+            est: null;
+            tdst: number;
+            left: null;
+            right: null;
+        }[])[];
+        function getNearest(nd: any, r: any, g: any, b: any, a: any): any;
+        function planeDst(est: any, r: any, g: any, b: any, a: any): number;
+        function dist(q: any, r: any, g: any, b: any, a: any): number;
+        function splitPixels(nimg: any, nimg32: any, i0: any, i1: any, e: any, eMq: any): any;
+        function vecDot(nimg: any, i: any, e: any): number;
+        function stats(nimg: any, i0: any, i1: any): {
+            R: number[];
+            m: number[];
+            N: number;
+        };
+        function estats(stats: any): {
+            Cov: number[];
+            q: number[];
+            e: number[];
+            L: number;
+            eMq255: number;
+            eMq: number;
+            rgba: number;
+        };
+    }
+    namespace M4 {
+        function multVec(m: any, v: any): number[];
+        function dot(x: any, y: any): number;
+        function sml(a: any, y: any): number[];
+    }
+}