Examples

1import { 
2  PyHardProvider, 
3  WalletConnect, 
4  SubscriptionQRGenerator 
5} from 'pyhard-vendor-sdk';
6
7function MyApp() {
8  return (
9    <PyHardProvider>
10      <div className="max-w-md mx-auto p-6 space-y-6">
11        <WalletConnect />
12        <SubscriptionQRGenerator 
13          onQRGenerated={(qrData) => {
14            console.log('QR Generated:', qrData);
15          }}
16        />
17      </div>
18    </PyHardProvider>
19  );
20}

1import { 
2  PyHardProvider, 
3  WalletConnect, 
4  SubscriptionQRGenerator,
5  PaymentQRGenerator,
6  SubscriptionList,
7  PaymentHistory,
8  useWallet,
9  useSubscriptions 
10} from 'pyhard-vendor-sdk';
11
12function VendorDashboard() {
13  const { address } = useWallet();
14  const { subscriptions } = useSubscriptions(address);
15
16  return (
17    <PyHardProvider>
18      <div className="max-w-6xl mx-auto p-6">
19        <WalletConnect />
20        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
21          <SubscriptionQRGenerator />
22          <PaymentQRGenerator subscriptionId="123" />
23        </div>
24        <SubscriptionList vendorAddress={address} />
25        <PaymentHistory subscriptionId="123" smartWalletAddress="0x..." />
26      </div>
27    </PyHardProvider>
28  );
29}

1import { HeadlessSubscriptionQRGenerator } from 'pyhard-vendor-sdk';
2
3function CustomSubscriptionForm() {
4  return (
5    <HeadlessSubscriptionQRGenerator>
6      {({ 
7        amount, 
8        setAmount, 
9        interval, 
10        setInterval, 
11        generateQR, 
12        qrData 
13      }) => (
14        <div className="bg-white p-6 rounded-lg shadow-lg">
15          <h2 className="text-2xl font-bold mb-4">Create Subscription</h2>
16          <div className="space-y-4">
17            <div>
18              <label className="block text-sm font-medium mb-2">
19                Amount (PYUSD)
20              </label>
21              <input
22                type="number"
23                value={amount}
24                onChange={(e) => setAmount(e.target.value)}
25                className="w-full p-2 border rounded"
26              />
27            </div>
28            <div>
29              <label className="block text-sm font-medium mb-2">
30                Interval
31              </label>
32              <select
33                value={interval}
34                onChange={(e) => setInterval(e.target.value)}
35                className="w-full p-2 border rounded"
36              >
37                <option value="daily">Daily</option>
38                <option value="weekly">Weekly</option>
39                <option value="monthly">Monthly</option>
40              </select>
41            </div>
42            <button
43              onClick={generateQR}
44              className="w-full bg-blue-600 text-white py-2 px-4 rounded hover:bg-blue-700"
45            >
46              Generate QR Code
47            </button>
48            {qrData && (
49              <div className="text-center">
50                <img src={qrData.qrCode} alt="Subscription QR" />
51                <p className="text-sm text-gray-600 mt-2">
52                  Scan with PyHard mobile app
53                </p>
54              </div>
55            )}
56          </div>
57        </div>
58      )}
59    </HeadlessSubscriptionQRGenerator>
60  );
61}