Skip to content

Commit f5e67bf

Browse files
authored
Fix: Vite issues (#3)
1 parent b17ecaa commit f5e67bf

18 files changed

+186
-198
lines changed

package-lock.json

Lines changed: 26 additions & 10 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,8 @@
1919
"@tanstack/react-query": "^5.86.0",
2020
"class-variance-authority": "^0.7.1",
2121
"clsx": "^2.1.1",
22-
"html2pdf.js": "^0.12.0",
22+
"html2canvas-pro": "^1.5.11",
23+
"jspdf": "^3.0.3",
2324
"lucide-react": "^0.542.0",
2425
"next": "15.5.2",
2526
"react": "19.1.0",

public/r/payment-widget.json

Lines changed: 26 additions & 19 deletions
Large diffs are not rendered by default.

public/r/registry.json

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@
2121
"@tanstack/react-query@^5.86.0",
2222
"react-hook-form@^7.62.0",
2323
"lucide-react@^0.542.0",
24-
"html2pdf.js@^0.12.0"
24+
"html2canvas-pro@^1.5.11",
25+
"jspdf@^3.0.3"
2526
],
2627
"files": [
2728
{
@@ -30,9 +31,19 @@
3031
"target": "components/payment-widget/payment-widget.tsx"
3132
},
3233
{
33-
"path": "registry/default/payment-widget/context/payment-widget-context.tsx",
34+
"path": "registry/default/payment-widget/context/payment-widget-context/index.ts",
3435
"type": "registry:component",
35-
"target": "components/payment-widget/context/payment-widget-context.tsx"
36+
"target": "components/payment-widget/context/payment-widget-context/index.ts"
37+
},
38+
{
39+
"path": "registry/default/payment-widget/context/payment-widget-context/payment-widget-provider.tsx",
40+
"type": "registry:component",
41+
"target": "components/payment-widget/context/payment-widget-context/payment-widget-provider.tsx"
42+
},
43+
{
44+
"path": "registry/default/payment-widget/context/payment-widget-context/use-payment-widget-context.ts",
45+
"type": "registry:component",
46+
"target": "components/payment-widget/context/payment-widget-context/use-payment-widget-context.ts"
3647
},
3748
{
3849
"path": "registry/default/payment-widget/components/connection-handler.tsx",
@@ -119,11 +130,6 @@
119130
"type": "registry:lib",
120131
"target": "components/payment-widget/types/index.ts"
121132
},
122-
{
123-
"path": "registry/default/payment-widget/types/html2pdf.d.ts",
124-
"type": "registry:lib",
125-
"target": "components/payment-widget/types/html2pdf.d.ts"
126-
},
127133
{
128134
"path": "registry/default/payment-widget/context/web3-context.tsx",
129135
"type": "registry:component",

registry.json

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@
2121
"@tanstack/react-query@^5.86.0",
2222
"react-hook-form@^7.62.0",
2323
"lucide-react@^0.542.0",
24-
"html2pdf.js@^0.12.0"
24+
"html2canvas-pro@^1.5.11",
25+
"jspdf@^3.0.3"
2526
],
2627
"files": [
2728
{
@@ -30,9 +31,19 @@
3031
"target": "components/payment-widget/payment-widget.tsx"
3132
},
3233
{
33-
"path": "registry/default/payment-widget/context/payment-widget-context.tsx",
34+
"path": "registry/default/payment-widget/context/payment-widget-context/index.ts",
3435
"type": "registry:component",
35-
"target": "components/payment-widget/context/payment-widget-context.tsx"
36+
"target": "components/payment-widget/context/payment-widget-context/index.ts"
37+
},
38+
{
39+
"path": "registry/default/payment-widget/context/payment-widget-context/payment-widget-provider.tsx",
40+
"type": "registry:component",
41+
"target": "components/payment-widget/context/payment-widget-context/payment-widget-provider.tsx"
42+
},
43+
{
44+
"path": "registry/default/payment-widget/context/payment-widget-context/use-payment-widget-context.ts",
45+
"type": "registry:component",
46+
"target": "components/payment-widget/context/payment-widget-context/use-payment-widget-context.ts"
3647
},
3748
{
3849
"path": "registry/default/payment-widget/components/connection-handler.tsx",
@@ -119,11 +130,6 @@
119130
"type": "registry:lib",
120131
"target": "components/payment-widget/types/index.ts"
121132
},
122-
{
123-
"path": "registry/default/payment-widget/types/html2pdf.d.ts",
124-
"type": "registry:lib",
125-
"target": "components/payment-widget/types/html2pdf.d.ts"
126-
},
127133
{
128134
"path": "registry/default/payment-widget/context/web3-context.tsx",
129135
"type": "registry:component",

registry/default/payment-widget/components/currency-select.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {
1010
type ConversionCurrency,
1111
} from "../utils/currencies";
1212
import { Check } from "lucide-react";
13-
import { usePaymentWidgetContext } from "../context/payment-widget-context";
13+
import { usePaymentWidgetContext } from "../context/payment-widget-context/use-payment-widget-context";
1414

1515
interface CurrencySelectProps {
1616
onSubmit: (currency: ConversionCurrency) => void;

registry/default/payment-widget/components/payment-confirmation.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,10 @@ import {
77
getSymbolOverride,
88
type ConversionCurrency,
99
} from "../utils/currencies";
10-
import { usePaymentWidgetContext } from "../context/payment-widget-context";
1110
import type { BuyerInfo, PaymentError } from "../types/index";
1211
import { useState } from "react";
1312
import type { TransactionReceipt } from "viem";
13+
import { usePaymentWidgetContext } from "../context/payment-widget-context/use-payment-widget-context";
1414

1515
interface PaymentConfirmationProps {
1616
selectedCurrency: ConversionCurrency;

registry/default/payment-widget/components/payment-modal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@ import { BuyerInfoForm } from "./buyer-info-form";
1313
import { PaymentConfirmation } from "./payment-confirmation";
1414
import { PaymentSuccess } from "./payment-success";
1515
import { DisconnectWallet } from "./disconnect-wallet";
16-
import { usePaymentWidgetContext } from "../context/payment-widget-context";
1716
import type { BuyerInfo } from "../types/index";
1817
import type { ConversionCurrency } from "../utils/currencies";
1918
import type { TransactionReceipt } from "viem";
19+
import { usePaymentWidgetContext } from "../context/payment-widget-context/use-payment-widget-context";
2020

2121
interface PaymentModalProps {
2222
isOpen: boolean;

registry/default/payment-widget/components/payment-success.tsx

Lines changed: 34 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@ import {
99
} from "../utils/receipt";
1010
import { useRef } from "react";
1111
import { ReceiptPDFTemplate } from "../components/receipt/receipt-template";
12-
import { usePaymentWidgetContext } from "../context/payment-widget-context";
1312
import type { BuyerInfo } from "../types/index";
1413
import type { ConversionCurrency } from "../utils/currencies";
14+
import { usePaymentWidgetContext } from "../context/payment-widget-context/use-payment-widget-context";
1515

1616
interface PaymentSuccessProps {
1717
requestId: string;
@@ -45,7 +45,7 @@ export function PaymentSuccess({
4545
walletAddress: connectedWalletAddress || "",
4646
},
4747
payment: {
48-
amount: amountInUsd, // TODO connect to actual payout and exchange rate
48+
amount: amountInUsd,
4949
chain: selectedCurrency.network,
5050
currency: selectedCurrency.symbol,
5151
exchangeRate: "1",
@@ -69,18 +69,37 @@ export function PaymentSuccess({
6969
return;
7070
}
7171

72-
const html2pdf = (await import("html2pdf.js")).default;
72+
const html2canvas = (await import("html2canvas-pro")).default;
73+
const jsPDF = (await import("jspdf")).default;
7374

74-
html2pdf()
75-
.set({
76-
margin: 1,
77-
filename: `receipt-${receiptParams.metadata?.receiptNumber || "payment"}.pdf`,
78-
image: { type: "jpeg", quality: 0.98 },
79-
html2canvas: { scale: 2 },
80-
jsPDF: { unit: "in", format: "a4", orientation: "portrait" },
81-
})
82-
.from(element)
83-
.save();
75+
const canvas = await html2canvas(element, {
76+
scale: 2,
77+
useCORS: true,
78+
backgroundColor: "#ffffff",
79+
width: element.scrollWidth,
80+
height: element.scrollHeight,
81+
windowWidth: element.scrollWidth,
82+
windowHeight: element.scrollHeight,
83+
});
84+
85+
const pdf = new jsPDF("p", "mm", "a4");
86+
const imgData = canvas.toDataURL("image/png");
87+
88+
const pageWidth = 210;
89+
const pageHeight = 297;
90+
const margin = 10;
91+
let imgWidth = pageWidth - margin * 2;
92+
let imgHeight = (canvas.height * imgWidth) / canvas.width;
93+
const maxHeight = pageHeight - margin * 2;
94+
if (imgHeight > maxHeight) {
95+
const ratio = maxHeight / imgHeight;
96+
imgWidth = imgWidth * ratio;
97+
imgHeight = imgHeight * ratio;
98+
}
99+
pdf.addImage(imgData, "PNG", margin, margin, imgWidth, imgHeight);
100+
pdf.save(
101+
`receipt-${receiptParams.metadata?.receiptNumber || "payment"}.pdf`,
102+
);
84103
} catch (error) {
85104
console.error("Failed to download receipt:", error);
86105
alert("Failed to download receipt. Please try again.");
@@ -118,6 +137,8 @@ export function PaymentSuccess({
118137
top: 0,
119138
opacity: 0,
120139
pointerEvents: "none",
140+
width: "800px",
141+
backgroundColor: "white",
121142
}}
122143
>
123144
<div ref={receiptRef}>

registry/default/payment-widget/components/receipt/styles.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
.receipt-container {
22
background-color: #ffffff;
3-
padding: 20px;
3+
padding: 32px;
44
max-width: 800px;
55
margin: 0 auto;
66
font-family:

0 commit comments

Comments
 (0)