@jingx/lottery-components-react-jsx 1.0.24 → 1.0.26

package/dist/index.esm.js

@@ -31931,13 +31931,6 @@ const THLabel = {
 };
 const isVNType = (lotteryType) => [lType.MC, lType.TN, lType.KH].includes(lotteryType);
 const s3hostPrint = "https://vnonemedia.s3.ap-southeast-1.amazonaws.com/print-logo/";
-const proxifyS3AssetOnLocalhost = (url) => {
-  if (typeof window === "undefined") return url;
-  const hostname = window.location.hostname;
-  const isLocalhost = hostname === "localhost" || hostname === "127.0.0.1";
-  if (!isLocalhost) return url;
-  return `/__spx_asset_proxy?url=${encodeURIComponent(url)}`;
-};
 const getDomain = (platform) => {
   if (platform) return platform;
   let url = window.location.hostname;
@@ -31946,7 +31939,7 @@ const getDomain = (platform) => {
   let dm = items.reverse()[1];
   return dm;
 };
-const getS3ImgPrint = (platform) => proxifyS3AssetOnLocalhost(s3hostPrint.concat(getDomain(platform)).concat(".png"));
+const getS3ImgPrint = (platform) => s3hostPrint.concat(getDomain(platform)).concat(".png");
 
 const TicketPrintBody = (props) => {
   const { item, bodyClass, is58, showItemCheckbox = false, selectedIds = [], onToggleItem } = props;
@@ -38108,7 +38101,7 @@ const RenderTitle = ({ lotteryType, className = "", logo, isVN, drawAt }) => {
 const RenderHead$1 = ({ logo, platform }) => /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
   logo && /* @__PURE__ */ jsxRuntimeExports.jsx("img", { className: "mr-2", style: {
     width: "50px"
-  }, src: getS3ImgPrint(platform), alt: "__log__" }),
+  }, crossOrigin: "anonymous", src: getS3ImgPrint(platform), alt: "__log__" }),
   logo ? "\u1786\u17D2\u1793\u17C4\u178F\u1782\u17D2\u179A\u1794\u17CB\u1794\u17D2\u179A\u1797\u17C1\u1791" : "\u1786\u17D2\u1793\u17C4\u178F\u1795\u17D2\u179F\u1784\u179F\u17C6\u178E\u17B6\u1784"
 ] });
 
@@ -38121,7 +38114,7 @@ function ScopeHost({ className, children, style }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style, ref, className: `spacx bg-transparent ${className}`, children: typeof children === "function" ? children(container) : children });
 }
 
-const totalStyle = { lineHeight: "15px", fontWeight: 600, fontSize: 25 };
+const totalStyle = { lineHeight: "25px", fontWeight: 600, fontSize: 25 };
 const dotStyle = { lineHeight: "13px", fontWeight: 800, fontSize: 25, color: "black" };
 const RenderRow = ({ children, label, isShow = true }) => {
   if (!isShow) return null;
@@ -46256,17 +46249,31 @@ var parseBackgroundColor = function (context, element, backgroundColorOverride)
         : defaultBackgroundColor;
 };
 
+const getCanvasScale = () => {
+  const deviceScale = typeof window !== "undefined" ? window.devicePixelRatio || 1 : 1;
+  return Math.max(deviceScale, 5);
+};
+const getCanvasOptions = (node, useCORS = true) => ({
+  scale: getCanvasScale(),
+  useCORS,
+  backgroundColor: "#ffffff",
+  logging: false,
+  removeContainer: true,
+  width: node.scrollWidth,
+  height: node.scrollHeight,
+  windowWidth: node.scrollWidth,
+  windowHeight: node.scrollHeight
+});
 const exportToImage = async (reportRef, actionButtonsRef, lotteryType, ticketNumber) => {
   if (!reportRef.current || !actionButtonsRef.current) return;
   const originalVisibility = actionButtonsRef.current.style.visibility;
   try {
     actionButtonsRef.current.style.visibility = "hidden";
-    const scale = window.devicePixelRatio || 2;
-    const canvas = await html2canvas(reportRef.current, {
-      scale,
-      useCORS: false,
-      backgroundColor: "#ffffff"
-    });
+    await waitForFontsAndImages(reportRef.current);
+    const canvas = await html2canvas(
+      reportRef.current,
+      getCanvasOptions(reportRef.current, true)
+    );
     const image = canvas.toDataURL(`image/png`, 1);
     const link = document.createElement("a");
     link.href = image;
@@ -46287,14 +46294,7 @@ const copyImageToClipboard = async (reportRef, actionButtonsRef, lotteryType, ti
   try {
     if (btn) btn.style.visibility = "hidden";
     await waitForFontsAndImages(node);
-    const scale = window.devicePixelRatio || 2;
-    const canvas = await html2canvas(node, {
-      scale,
-      useCORS: true,
-      backgroundColor: "#ffffff",
-      logging: false,
-      removeContainer: true
-    });
+    const canvas = await html2canvas(node, getCanvasOptions(node));
     const blob = await canvasToBlob(canvas);
     if (!blob) throw new Error("Clipboard blob unavailable");
     if (!((_a = navigator.clipboard) == null ? void 0 : _a.write)) {
@@ -46340,15 +46340,7 @@ const exportToImageShare = async (reportRef, actionButtonsRef, lotteryType, tick
   try {
     if (btn) btn.style.visibility = "hidden";
     await waitForFontsAndImages(node);
-    const scale = window.devicePixelRatio || 2;
-    const canvas = await html2canvas(node, {
-      scale,
-      useCORS: true,
-      // enable if your images have CORS headers
-      backgroundColor: "#ffffff",
-      logging: false,
-      removeContainer: true
-    });
+    const canvas = await html2canvas(node, getCanvasOptions(node));
     const blob = await canvasToBlob(canvas);
     if (!blob) return;
     const fileName = `${lotteryType}-#${ticketNumber}.png`;