@sdkrouter/payments 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs ADDED
@@ -0,0 +1,993 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ require('./chunk-RSPZZ5K2.cjs');
5
+ var chunk3W2GRACB_cjs = require('./chunk-3W2GRACB.cjs');
6
+ var chunkP3RGFDH4_cjs = require('./chunk-P3RGFDH4.cjs');
7
+ var react = require('react');
8
+ var jsxRuntime = require('react/jsx-runtime');
9
+
10
+ // src/styles/theme.ts
11
+ var lightVars = `
12
+ --sdkr-pay-bg: #ffffff;
13
+ --sdkr-pay-bg-subtle: #f8fafc;
14
+ --sdkr-pay-fg: #1e293b;
15
+ --sdkr-pay-fg-muted: #64748b;
16
+ --sdkr-pay-border: #e2e8f0;
17
+ --sdkr-pay-primary: #3b82f6;
18
+ --sdkr-pay-primary-hover: #2563eb;
19
+ --sdkr-pay-primary-fg: #ffffff;
20
+ --sdkr-pay-error: #ef4444;
21
+ --sdkr-pay-error-bg: #fef2f2;
22
+ --sdkr-pay-success: #22c55e;
23
+ --sdkr-pay-success-bg: #f0fdf4;
24
+ --sdkr-pay-input-bg: #ffffff;
25
+ --sdkr-pay-input-border: #d1d5db;
26
+ --sdkr-pay-input-focus: #3b82f6;
27
+ --sdkr-pay-badge-bg: #eff6ff;
28
+ --sdkr-pay-badge-fg: #1d4ed8;
29
+ --sdkr-pay-card-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06);
30
+ --sdkr-pay-qr-bg: #ffffff;
31
+ --sdkr-pay-qr-fg: #1e293b;
32
+ `;
33
+ var darkVars = `
34
+ --sdkr-pay-bg: #141414;
35
+ --sdkr-pay-bg-subtle: #0a0a0a;
36
+ --sdkr-pay-fg: #fafafa;
37
+ --sdkr-pay-fg-muted: #a1a1aa;
38
+ --sdkr-pay-border: #262626;
39
+ --sdkr-pay-primary: #3b82f6;
40
+ --sdkr-pay-primary-hover: #60a5fa;
41
+ --sdkr-pay-primary-fg: #ffffff;
42
+ --sdkr-pay-error: #f87171;
43
+ --sdkr-pay-error-bg: #1c1917;
44
+ --sdkr-pay-success: #4ade80;
45
+ --sdkr-pay-success-bg: #0a1a0f;
46
+ --sdkr-pay-input-bg: #1a1a1a;
47
+ --sdkr-pay-input-border: #333333;
48
+ --sdkr-pay-input-focus: #3b82f6;
49
+ --sdkr-pay-badge-bg: #1e293b;
50
+ --sdkr-pay-badge-fg: #60a5fa;
51
+ --sdkr-pay-card-shadow: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
52
+ --sdkr-pay-qr-bg: #1a1a1a;
53
+ --sdkr-pay-qr-fg: #fafafa;
54
+ `;
55
+ var sel = ".sdkr-pay";
56
+ var darkSel = `.dark ${sel}`;
57
+ var darkAttrSel = `[data-theme="dark"] ${sel}`;
58
+ var lightSel = `.light ${sel}`;
59
+ var lightAttrSel = `[data-theme="light"] ${sel}`;
60
+ var darkMediaSel = `:root:not([data-theme="light"]):not(.light) ${sel}`;
61
+ var theme = `
62
+ /* Light (default) */
63
+ ${sel} { ${lightVars} }
64
+
65
+ /* Dark: system (only when no explicit theme) */
66
+ @media (prefers-color-scheme: dark) {
67
+ ${darkMediaSel} { ${darkVars} }
68
+ }
69
+
70
+ /* Dark: explicit */
71
+ ${darkSel},
72
+ ${darkAttrSel} { ${darkVars} }
73
+
74
+ /* Light: explicit (overrides system dark) */
75
+ ${lightSel},
76
+ ${lightAttrSel} { ${lightVars} }
77
+ `;
78
+
79
+ // src/styles/base.ts
80
+ var base = `
81
+ /* Base */
82
+ .sdkr-pay {
83
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
84
+ color: var(--sdkr-pay-fg);
85
+ background: var(--sdkr-pay-bg);
86
+ line-height: 1.5;
87
+ box-sizing: border-box;
88
+ -webkit-font-smoothing: antialiased;
89
+ }
90
+
91
+ .sdkr-pay *, .sdkr-pay *::before, .sdkr-pay *::after {
92
+ box-sizing: border-box;
93
+ }
94
+
95
+ /* Page layout */
96
+ .sdkr-pay-page {
97
+ min-height: 100vh;
98
+ display: flex;
99
+ align-items: center;
100
+ justify-content: center;
101
+ padding: 24px;
102
+ background: var(--sdkr-pay-bg-subtle);
103
+ }
104
+
105
+ .sdkr-pay-card {
106
+ width: 100%;
107
+ max-width: 440px;
108
+ background: var(--sdkr-pay-bg);
109
+ border: 1px solid var(--sdkr-pay-border);
110
+ border-radius: 12px;
111
+ box-shadow: var(--sdkr-pay-card-shadow);
112
+ overflow: hidden;
113
+ }
114
+
115
+ .sdkr-pay-widget {
116
+ width: 100%;
117
+ max-width: 440px;
118
+ }
119
+
120
+ .sdkr-pay-content {
121
+ animation: sdkr-pay-fade-in 0.2s ease-out;
122
+ }
123
+
124
+ .sdkr-pay-separator {
125
+ height: 1px;
126
+ background: var(--sdkr-pay-border);
127
+ margin: 0;
128
+ border: none;
129
+ }
130
+
131
+ /* Loading */
132
+ .sdkr-pay-loading {
133
+ display: flex;
134
+ align-items: center;
135
+ justify-content: center;
136
+ padding: 48px;
137
+ color: var(--sdkr-pay-fg-muted);
138
+ }
139
+
140
+ .sdkr-pay-spinner {
141
+ width: 20px;
142
+ height: 20px;
143
+ border: 2px solid var(--sdkr-pay-border);
144
+ border-top-color: var(--sdkr-pay-primary);
145
+ border-radius: 50%;
146
+ animation: sdkr-pay-spin 0.6s linear infinite;
147
+ }
148
+
149
+ /* Error page */
150
+ .sdkr-pay-error-page {
151
+ display: flex;
152
+ flex-direction: column;
153
+ align-items: center;
154
+ gap: 12px;
155
+ padding: 48px 24px;
156
+ text-align: center;
157
+ }
158
+
159
+ .sdkr-pay-error-text {
160
+ font-size: 14px;
161
+ color: var(--sdkr-pay-fg-muted);
162
+ margin: 0;
163
+ }
164
+
165
+ /* Powered by */
166
+ .sdkr-pay-powered {
167
+ text-align: center;
168
+ padding: 12px;
169
+ font-size: 11px;
170
+ color: var(--sdkr-pay-fg-muted);
171
+ }
172
+
173
+ .sdkr-pay-powered a {
174
+ color: var(--sdkr-pay-fg-muted);
175
+ text-decoration: none;
176
+ }
177
+
178
+ .sdkr-pay-powered a:hover {
179
+ text-decoration: underline;
180
+ }
181
+
182
+ /* Keyframes */
183
+ @keyframes sdkr-pay-spin {
184
+ to { transform: rotate(360deg); }
185
+ }
186
+
187
+ @keyframes sdkr-pay-fade-in {
188
+ from { opacity: 0; }
189
+ to { opacity: 1; }
190
+ }
191
+
192
+ @keyframes sdkr-pay-slide-up {
193
+ from { opacity: 0; transform: translateY(8px); }
194
+ to { opacity: 1; transform: translateY(0); }
195
+ }
196
+
197
+ @keyframes sdkr-blink {
198
+ 0%, 100% { opacity: 1; }
199
+ 50% { opacity: 0.5; }
200
+ }
201
+
202
+ @keyframes sdkr-pulse {
203
+ 0%, 100% { opacity: 0.3; transform: scale(0.8); }
204
+ 50% { opacity: 1; transform: scale(1.2); }
205
+ }
206
+ `;
207
+
208
+ // src/styles/form.ts
209
+ var form = `
210
+ /* Info section */
211
+ .sdkr-pay-info {
212
+ padding: 24px 24px 0;
213
+ }
214
+
215
+ .sdkr-pay-info-icon {
216
+ width: 40px;
217
+ height: 40px;
218
+ border-radius: 10px;
219
+ background: var(--sdkr-pay-badge-bg);
220
+ color: var(--sdkr-pay-badge-fg);
221
+ display: flex;
222
+ align-items: center;
223
+ justify-content: center;
224
+ margin-bottom: 12px;
225
+ }
226
+
227
+ .sdkr-pay-title {
228
+ font-size: 20px;
229
+ font-weight: 600;
230
+ margin: 0 0 4px;
231
+ color: var(--sdkr-pay-fg);
232
+ letter-spacing: -0.01em;
233
+ }
234
+
235
+ .sdkr-pay-description {
236
+ font-size: 14px;
237
+ color: var(--sdkr-pay-fg-muted);
238
+ margin: 0 0 16px;
239
+ white-space: pre-wrap;
240
+ line-height: 1.5;
241
+ }
242
+
243
+ .sdkr-pay-amount-badge {
244
+ display: inline-flex;
245
+ align-items: baseline;
246
+ gap: 6px;
247
+ padding: 8px 14px;
248
+ background: var(--sdkr-pay-badge-bg);
249
+ border-radius: 10px;
250
+ margin-bottom: 16px;
251
+ }
252
+
253
+ .sdkr-pay-amount-value {
254
+ font-size: 20px;
255
+ font-weight: 700;
256
+ color: var(--sdkr-pay-badge-fg);
257
+ letter-spacing: -0.02em;
258
+ }
259
+
260
+ .sdkr-pay-amount-currency {
261
+ font-size: 13px;
262
+ font-weight: 500;
263
+ color: var(--sdkr-pay-fg-muted);
264
+ }
265
+
266
+ /* Form */
267
+ .sdkr-pay-form {
268
+ padding: 20px 24px 24px;
269
+ }
270
+
271
+ .sdkr-pay-field {
272
+ margin-bottom: 16px;
273
+ }
274
+
275
+ .sdkr-pay-label {
276
+ display: block;
277
+ font-size: 13px;
278
+ font-weight: 500;
279
+ color: var(--sdkr-pay-fg);
280
+ margin-bottom: 6px;
281
+ }
282
+
283
+ .sdkr-pay-label-optional {
284
+ color: var(--sdkr-pay-fg-muted);
285
+ font-weight: 400;
286
+ }
287
+
288
+ .sdkr-pay-input {
289
+ width: 100%;
290
+ padding: 10px 12px;
291
+ font-size: 16px;
292
+ line-height: 1.5;
293
+ color: var(--sdkr-pay-fg);
294
+ background: var(--sdkr-pay-input-bg);
295
+ border: 1px solid var(--sdkr-pay-input-border);
296
+ border-radius: 8px;
297
+ outline: none;
298
+ transition: border-color 0.15s, box-shadow 0.15s;
299
+ -webkit-appearance: none;
300
+ }
301
+
302
+ .sdkr-pay-input:focus {
303
+ border-color: var(--sdkr-pay-input-focus);
304
+ box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
305
+ }
306
+
307
+ .sdkr-pay-input::placeholder {
308
+ color: var(--sdkr-pay-fg-muted);
309
+ }
310
+
311
+ .sdkr-pay-input-error {
312
+ border-color: var(--sdkr-pay-error);
313
+ }
314
+
315
+ .sdkr-pay-input-error:focus {
316
+ box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
317
+ }
318
+
319
+ .sdkr-pay-amount-prefix {
320
+ position: relative;
321
+ }
322
+
323
+ .sdkr-pay-amount-prefix .sdkr-pay-input {
324
+ padding-left: 28px;
325
+ }
326
+
327
+ .sdkr-pay-amount-prefix::before {
328
+ content: '$';
329
+ position: absolute;
330
+ left: 12px;
331
+ top: 50%;
332
+ transform: translateY(-50%);
333
+ color: var(--sdkr-pay-fg-muted);
334
+ font-size: 14px;
335
+ pointer-events: none;
336
+ }
337
+
338
+ .sdkr-pay-field-error {
339
+ display: flex;
340
+ align-items: center;
341
+ gap: 4px;
342
+ color: var(--sdkr-pay-error);
343
+ font-size: 12px;
344
+ margin-top: 4px;
345
+ }
346
+
347
+ .sdkr-pay-error {
348
+ display: flex;
349
+ align-items: center;
350
+ gap: 8px;
351
+ padding: 12px 16px;
352
+ background: var(--sdkr-pay-error-bg);
353
+ color: var(--sdkr-pay-error);
354
+ border-radius: 8px;
355
+ font-size: 14px;
356
+ margin-bottom: 16px;
357
+ }
358
+
359
+ /* Button */
360
+ .sdkr-pay-btn {
361
+ width: 100%;
362
+ padding: 12px 20px;
363
+ font-size: 15px;
364
+ font-weight: 600;
365
+ color: var(--sdkr-pay-primary-fg);
366
+ background: var(--sdkr-pay-primary);
367
+ border: none;
368
+ border-radius: 10px;
369
+ cursor: pointer;
370
+ transition: background 0.15s, opacity 0.15s, transform 0.1s;
371
+ }
372
+
373
+ .sdkr-pay-btn:hover:not(:disabled) {
374
+ background: var(--sdkr-pay-primary-hover);
375
+ }
376
+
377
+ .sdkr-pay-btn:active:not(:disabled) {
378
+ transform: scale(0.98);
379
+ }
380
+
381
+ .sdkr-pay-btn:disabled {
382
+ opacity: 0.5;
383
+ cursor: not-allowed;
384
+ }
385
+
386
+ .sdkr-pay-btn-content {
387
+ display: inline-flex;
388
+ align-items: center;
389
+ gap: 8px;
390
+ }
391
+
392
+ .sdkr-pay-btn-spinner {
393
+ animation: sdkr-pay-spin 0.8s linear infinite;
394
+ }
395
+
396
+ .sdkr-pay-btn--ghost {
397
+ display: inline-flex;
398
+ align-items: center;
399
+ justify-content: center;
400
+ gap: 6px;
401
+ background: transparent;
402
+ color: var(--sdkr-pay-fg-muted);
403
+ border: none;
404
+ font-size: 14px;
405
+ font-weight: 500;
406
+ cursor: pointer;
407
+ padding: 8px 16px;
408
+ border-radius: 8px;
409
+ transition: color 0.15s, background 0.15s;
410
+ width: auto;
411
+ }
412
+
413
+ .sdkr-pay-btn--ghost:hover {
414
+ color: var(--sdkr-pay-fg);
415
+ background: var(--sdkr-pay-bg-subtle);
416
+ }
417
+ `;
418
+
419
+ // src/styles/status.ts
420
+ var status = `
421
+ /* Status */
422
+ .sdkr-pay-status {
423
+ padding: 24px;
424
+ }
425
+
426
+ .sdkr-pay-status-header {
427
+ text-align: center;
428
+ margin-bottom: 20px;
429
+ }
430
+
431
+ .sdkr-pay-status-icon {
432
+ width: 48px;
433
+ height: 48px;
434
+ border-radius: 50%;
435
+ display: inline-flex;
436
+ align-items: center;
437
+ justify-content: center;
438
+ margin-bottom: 12px;
439
+ }
440
+
441
+ .sdkr-pay-status-icon--waiting {
442
+ background: var(--sdkr-pay-badge-bg);
443
+ color: var(--sdkr-pay-badge-fg);
444
+ }
445
+
446
+ .sdkr-pay-status-icon--success {
447
+ background: var(--sdkr-pay-success-bg);
448
+ color: var(--sdkr-pay-success);
449
+ }
450
+
451
+ .sdkr-pay-status-icon--error {
452
+ background: var(--sdkr-pay-error-bg);
453
+ color: var(--sdkr-pay-error);
454
+ }
455
+
456
+ .sdkr-pay-status-icon--paid {
457
+ background: #22c55e;
458
+ color: white;
459
+ }
460
+
461
+ .sdkr-pay-status-title {
462
+ font-size: 18px;
463
+ font-weight: 600;
464
+ margin: 0 0 4px;
465
+ letter-spacing: -0.01em;
466
+ }
467
+
468
+ .sdkr-pay-status-subtitle {
469
+ font-size: 13px;
470
+ color: var(--sdkr-pay-fg-muted);
471
+ margin: 0;
472
+ }
473
+
474
+ .sdkr-pay-status-actions {
475
+ padding: 8px 24px 16px;
476
+ text-align: center;
477
+ }
478
+
479
+ /* Hero amount */
480
+ .sdkr-pay-hero-amount {
481
+ display: flex;
482
+ align-items: center;
483
+ justify-content: center;
484
+ gap: 8px;
485
+ padding: 16px;
486
+ margin: 0 24px 16px;
487
+ background: var(--sdkr-pay-badge-bg);
488
+ border-radius: 12px;
489
+ }
490
+
491
+ .sdkr-pay-hero-amount-icon {
492
+ color: var(--sdkr-pay-badge-fg);
493
+ }
494
+
495
+ .sdkr-pay-hero-amount-value {
496
+ font-size: 24px;
497
+ font-weight: 700;
498
+ letter-spacing: -0.02em;
499
+ font-variant-numeric: tabular-nums;
500
+ color: var(--sdkr-pay-fg);
501
+ }
502
+
503
+ .sdkr-pay-hero-amount-coin {
504
+ font-size: 14px;
505
+ font-weight: 500;
506
+ color: var(--sdkr-pay-fg-muted);
507
+ }
508
+
509
+ /* QR */
510
+ .sdkr-pay-qr {
511
+ display: flex;
512
+ justify-content: center;
513
+ padding: 16px;
514
+ }
515
+
516
+ .sdkr-pay-qr svg {
517
+ border-radius: 12px;
518
+ padding: 12px;
519
+ background: var(--sdkr-pay-qr-bg);
520
+ }
521
+
522
+ /* Payment details */
523
+ .sdkr-pay-detail {
524
+ padding: 12px 16px;
525
+ background: var(--sdkr-pay-bg-subtle);
526
+ border: 1px solid var(--sdkr-pay-border);
527
+ border-radius: 8px;
528
+ margin-bottom: 12px;
529
+ }
530
+
531
+ .sdkr-pay-detail-label {
532
+ font-size: 11px;
533
+ font-weight: 500;
534
+ text-transform: uppercase;
535
+ letter-spacing: 0.5px;
536
+ color: var(--sdkr-pay-fg-muted);
537
+ margin-bottom: 4px;
538
+ }
539
+
540
+ .sdkr-pay-detail-value {
541
+ font-size: 14px;
542
+ font-weight: 500;
543
+ word-break: break-all;
544
+ color: var(--sdkr-pay-fg);
545
+ }
546
+
547
+ .sdkr-pay-detail-mono {
548
+ font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', 'Consolas', monospace;
549
+ font-size: 13px;
550
+ }
551
+
552
+ .sdkr-pay-detail-copyable {
553
+ display: flex;
554
+ align-items: center;
555
+ gap: 8px;
556
+ }
557
+
558
+ .sdkr-pay-detail-copyable span {
559
+ flex: 1;
560
+ min-width: 0;
561
+ word-break: break-all;
562
+ }
563
+
564
+ .sdkr-pay-copy-btn {
565
+ flex-shrink: 0;
566
+ width: 32px;
567
+ height: 32px;
568
+ border: 1px solid var(--sdkr-pay-border);
569
+ border-radius: 8px;
570
+ background: var(--sdkr-pay-bg);
571
+ color: var(--sdkr-pay-fg-muted);
572
+ cursor: pointer;
573
+ display: flex;
574
+ align-items: center;
575
+ justify-content: center;
576
+ transition: all 0.15s;
577
+ }
578
+
579
+ .sdkr-pay-copy-btn:hover {
580
+ background: var(--sdkr-pay-primary);
581
+ color: white;
582
+ border-color: var(--sdkr-pay-primary);
583
+ }
584
+
585
+ .sdkr-pay-copy-btn:active {
586
+ transform: scale(0.92);
587
+ }
588
+
589
+ .sdkr-pay-network-badge {
590
+ display: inline-block;
591
+ font-size: 11px;
592
+ font-weight: 500;
593
+ padding: 1px 6px;
594
+ border-radius: 4px;
595
+ background: var(--sdkr-pay-bg-subtle);
596
+ color: var(--sdkr-pay-fg-muted);
597
+ margin-left: 4px;
598
+ }
599
+
600
+ /* Countdown */
601
+ .sdkr-pay-countdown {
602
+ display: flex;
603
+ align-items: center;
604
+ justify-content: center;
605
+ gap: 8px;
606
+ padding: 10px 16px;
607
+ margin: 8px 0;
608
+ border-radius: 8px;
609
+ background: var(--sdkr-pay-bg-subtle);
610
+ }
611
+
612
+ .sdkr-pay-countdown-icon {
613
+ color: var(--sdkr-pay-fg-muted);
614
+ }
615
+
616
+ .sdkr-pay-countdown-value {
617
+ font-size: 20px;
618
+ font-weight: 700;
619
+ font-variant-numeric: tabular-nums;
620
+ color: var(--sdkr-pay-fg);
621
+ }
622
+
623
+ .sdkr-pay-countdown--urgent .sdkr-pay-countdown-value {
624
+ color: var(--sdkr-pay-error);
625
+ animation: sdkr-blink 1s ease-in-out infinite;
626
+ }
627
+
628
+ /* Confirmations */
629
+ .sdkr-pay-confirmations {
630
+ display: flex;
631
+ align-items: center;
632
+ justify-content: center;
633
+ gap: 6px;
634
+ font-size: 13px;
635
+ color: var(--sdkr-pay-primary);
636
+ padding: 8px;
637
+ font-variant-numeric: tabular-nums;
638
+ }
639
+
640
+ .sdkr-pay-confirmations-icon {
641
+ animation: sdkr-pay-spin 1.5s linear infinite;
642
+ }
643
+
644
+ /* Polling */
645
+ .sdkr-pay-polling {
646
+ text-align: center;
647
+ font-size: 13px;
648
+ color: var(--sdkr-pay-primary);
649
+ padding: 8px;
650
+ display: flex;
651
+ align-items: center;
652
+ justify-content: center;
653
+ gap: 6px;
654
+ }
655
+
656
+ .sdkr-pay-polling-dot {
657
+ width: 8px;
658
+ height: 8px;
659
+ border-radius: 50%;
660
+ background: var(--sdkr-pay-primary);
661
+ animation: sdkr-pulse 1.5s ease-in-out infinite;
662
+ }
663
+
664
+ /* Warning */
665
+ .sdkr-pay-warning {
666
+ display: flex;
667
+ align-items: center;
668
+ justify-content: center;
669
+ gap: 6px;
670
+ font-size: 12px;
671
+ color: var(--sdkr-pay-fg-muted);
672
+ padding: 8px 16px;
673
+ margin: 8px 0;
674
+ border-radius: 8px;
675
+ background: var(--sdkr-pay-bg-subtle);
676
+ }
677
+
678
+ /* History */
679
+ .sdkr-pay-history {
680
+ padding: 24px;
681
+ }
682
+
683
+ .sdkr-pay-history-title {
684
+ font-size: 13px;
685
+ font-weight: 600;
686
+ text-transform: uppercase;
687
+ letter-spacing: 0.5px;
688
+ color: var(--sdkr-pay-fg-muted);
689
+ margin: 0 0 12px;
690
+ }
691
+
692
+ .sdkr-pay-history-item {
693
+ display: flex;
694
+ align-items: center;
695
+ justify-content: space-between;
696
+ padding: 12px 0;
697
+ border-bottom: 1px solid var(--sdkr-pay-border);
698
+ }
699
+
700
+ .sdkr-pay-history-item:last-child {
701
+ border-bottom: none;
702
+ }
703
+
704
+ .sdkr-pay-history-amount {
705
+ font-size: 14px;
706
+ font-weight: 600;
707
+ color: var(--sdkr-pay-fg);
708
+ }
709
+
710
+ .sdkr-pay-history-status {
711
+ display: inline-flex;
712
+ align-items: center;
713
+ padding: 2px 8px;
714
+ font-size: 12px;
715
+ font-weight: 500;
716
+ border-radius: 6px;
717
+ }
718
+
719
+ .sdkr-pay-history-status--completed {
720
+ background: var(--sdkr-pay-success-bg);
721
+ color: var(--sdkr-pay-success);
722
+ }
723
+
724
+ .sdkr-pay-history-status--pending {
725
+ background: var(--sdkr-pay-badge-bg);
726
+ color: var(--sdkr-pay-badge-fg);
727
+ }
728
+
729
+ .sdkr-pay-history-status--failed {
730
+ background: var(--sdkr-pay-error-bg);
731
+ color: var(--sdkr-pay-error);
732
+ }
733
+
734
+ .sdkr-pay-history-date {
735
+ font-size: 13px;
736
+ color: var(--sdkr-pay-fg-muted);
737
+ }
738
+ `;
739
+
740
+ // src/styles/modal.ts
741
+ var modal = `
742
+ /* Modal overlay */
743
+ .sdkr-pay-overlay {
744
+ position: fixed;
745
+ inset: 0;
746
+ background: rgba(0, 0, 0, 0.5);
747
+ display: flex;
748
+ align-items: center;
749
+ justify-content: center;
750
+ z-index: 9999;
751
+ padding: 24px;
752
+ animation: sdkr-pay-fade-in 0.15s ease-out;
753
+ }
754
+
755
+ .sdkr-pay-overlay .sdkr-pay-card {
756
+ animation: sdkr-pay-slide-up 0.2s ease-out;
757
+ }
758
+
759
+ /* Modal close */
760
+ .sdkr-pay-close {
761
+ position: absolute;
762
+ top: 12px;
763
+ right: 12px;
764
+ width: 28px;
765
+ height: 28px;
766
+ display: flex;
767
+ align-items: center;
768
+ justify-content: center;
769
+ background: none;
770
+ border: none;
771
+ color: var(--sdkr-pay-fg-muted);
772
+ cursor: pointer;
773
+ border-radius: 6px;
774
+ font-size: 18px;
775
+ line-height: 1;
776
+ transition: background 0.15s;
777
+ }
778
+
779
+ .sdkr-pay-close:hover {
780
+ background: var(--sdkr-pay-bg-subtle);
781
+ }
782
+ `;
783
+
784
+ // src/styles/mobile.ts
785
+ var mobile = `
786
+ /* \u2500\u2500 Mobile \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
787
+
788
+ .sdkr-pay--mobile .sdkr-pay-page {
789
+ padding: 0;
790
+ align-items: stretch;
791
+ min-height: 100dvh;
792
+ }
793
+
794
+ .sdkr-pay--mobile .sdkr-pay-card {
795
+ max-width: none;
796
+ border: none;
797
+ border-radius: 0;
798
+ box-shadow: none;
799
+ min-height: 100dvh;
800
+ display: flex;
801
+ flex-direction: column;
802
+ }
803
+
804
+ .sdkr-pay--mobile .sdkr-pay-content {
805
+ flex: 1;
806
+ display: flex;
807
+ flex-direction: column;
808
+ }
809
+
810
+ .sdkr-pay--mobile .sdkr-pay-status {
811
+ flex: 1;
812
+ display: flex;
813
+ flex-direction: column;
814
+ }
815
+
816
+ .sdkr-pay--mobile .sdkr-pay-status-actions {
817
+ margin-top: auto;
818
+ padding-bottom: env(safe-area-inset-bottom, 16px);
819
+ }
820
+
821
+ .sdkr-pay--mobile .sdkr-pay-form {
822
+ flex: 1;
823
+ display: flex;
824
+ flex-direction: column;
825
+ }
826
+
827
+ .sdkr-pay--mobile .sdkr-pay-form .sdkr-pay-btn {
828
+ margin-top: auto;
829
+ }
830
+
831
+ .sdkr-pay--mobile .sdkr-pay-powered {
832
+ padding-bottom: env(safe-area-inset-bottom, 12px);
833
+ }
834
+
835
+ .sdkr-pay--mobile .sdkr-pay-qr svg {
836
+ width: 180px;
837
+ height: 180px;
838
+ }
839
+
840
+ .sdkr-pay--mobile .sdkr-pay-detail-value {
841
+ font-size: 13px;
842
+ }
843
+
844
+ .sdkr-pay--mobile .sdkr-pay-input {
845
+ font-size: 16px;
846
+ }
847
+
848
+ /* CSS-only fallback for no-JS mobile */
849
+ @media (max-width: 767px) {
850
+ .sdkr-pay-page {
851
+ padding: 0;
852
+ align-items: stretch;
853
+ }
854
+ .sdkr-pay-card {
855
+ max-width: none;
856
+ border: none;
857
+ border-radius: 0;
858
+ box-shadow: none;
859
+ min-height: 100dvh;
860
+ }
861
+ }
862
+ `;
863
+
864
+ // src/styles/index.ts
865
+ var styles = [theme, base, form, status, modal, mobile].join("\n");
866
+
867
+ // src/hooks/useInjectStyles.ts
868
+ var refCount = 0;
869
+ function useInjectStyles() {
870
+ react.useEffect(() => {
871
+ refCount++;
872
+ if (!document.getElementById(chunk3W2GRACB_cjs.STYLE_ID)) {
873
+ const style = document.createElement("style");
874
+ style.id = chunk3W2GRACB_cjs.STYLE_ID;
875
+ style.textContent = styles;
876
+ document.head.appendChild(style);
877
+ }
878
+ return () => {
879
+ refCount--;
880
+ if (refCount === 0) {
881
+ document.getElementById(chunk3W2GRACB_cjs.STYLE_ID)?.remove();
882
+ }
883
+ };
884
+ }, []);
885
+ }
886
+ var MOBILE_BREAKPOINT = 768;
887
+ function useMobile() {
888
+ const [isMobile, setIsMobile] = react.useState(false);
889
+ react.useEffect(() => {
890
+ const mq = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
891
+ setIsMobile(mq.matches);
892
+ const handler = (e) => setIsMobile(e.matches);
893
+ mq.addEventListener("change", handler);
894
+ return () => mq.removeEventListener("change", handler);
895
+ }, []);
896
+ return isMobile;
897
+ }
898
+ var PaymentContent2 = react.lazy(
899
+ () => import('./PaymentContent-BRE2P6SS.cjs').then((m) => ({ default: m.PaymentContent }))
900
+ );
901
+ function PaymentLoader() {
902
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sdkr-pay-loading", style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: 48, gap: 12 }, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sdkr-pay-spinner" }) });
903
+ }
904
+ function PaymentPage(props) {
905
+ useInjectStyles();
906
+ const isMobile = useMobile();
907
+ const rootClass = isMobile ? "sdkr-pay sdkr-pay--mobile" : "sdkr-pay";
908
+ return /* @__PURE__ */ jsxRuntime.jsx(chunk3W2GRACB_cjs.PaymentProvider, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: rootClass, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sdkr-pay-page", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sdkr-pay-card", children: [
909
+ /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(PaymentLoader, {}), children: /* @__PURE__ */ jsxRuntime.jsx(PaymentContent2, {}) }),
910
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sdkr-pay-powered", children: [
911
+ "Powered by ",
912
+ /* @__PURE__ */ jsxRuntime.jsx("a", { href: "https://sdkrouter.com", target: "_blank", rel: "noopener noreferrer", children: "SDKRouter" })
913
+ ] })
914
+ ] }) }) }) });
915
+ }
916
+ function PaymentWidget(props) {
917
+ const { mode = "inline", buttonText = "Pay Now", ...config } = props;
918
+ useInjectStyles();
919
+ const [isOpen, setIsOpen] = react.useState(false);
920
+ const card = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sdkr-pay-card", style: { position: "relative" }, children: [
921
+ mode === "button" && /* @__PURE__ */ jsxRuntime.jsx("button", { className: "sdkr-pay-close", onClick: () => setIsOpen(false), children: "\xD7" }),
922
+ /* @__PURE__ */ jsxRuntime.jsx(chunk3W2GRACB_cjs.PaymentContent, {})
923
+ ] });
924
+ return /* @__PURE__ */ jsxRuntime.jsx(chunk3W2GRACB_cjs.PaymentProvider, { ...config, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sdkr-pay", children: mode === "button" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
925
+ /* @__PURE__ */ jsxRuntime.jsx("button", { className: "sdkr-pay-btn", onClick: () => setIsOpen(true), children: buttonText }),
926
+ isOpen && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sdkr-pay-overlay", onClick: (e) => {
927
+ if (e.target === e.currentTarget) setIsOpen(false);
928
+ }, children: card })
929
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sdkr-pay-widget", children: card }) }) });
930
+ }
931
+
932
+ Object.defineProperty(exports, "CustomerPaymentHistory", {
933
+ enumerable: true,
934
+ get: function () { return chunk3W2GRACB_cjs.CustomerPaymentHistory; }
935
+ });
936
+ Object.defineProperty(exports, "MAX_AMOUNT_USD", {
937
+ enumerable: true,
938
+ get: function () { return chunk3W2GRACB_cjs.MAX_AMOUNT_USD; }
939
+ });
940
+ Object.defineProperty(exports, "MIN_AMOUNT_USD", {
941
+ enumerable: true,
942
+ get: function () { return chunk3W2GRACB_cjs.MIN_AMOUNT_USD; }
943
+ });
944
+ Object.defineProperty(exports, "PaymentContent", {
945
+ enumerable: true,
946
+ get: function () { return chunk3W2GRACB_cjs.PaymentContent; }
947
+ });
948
+ Object.defineProperty(exports, "PaymentForm", {
949
+ enumerable: true,
950
+ get: function () { return chunk3W2GRACB_cjs.PaymentForm; }
951
+ });
952
+ Object.defineProperty(exports, "PaymentInfo", {
953
+ enumerable: true,
954
+ get: function () { return chunk3W2GRACB_cjs.PaymentInfo; }
955
+ });
956
+ Object.defineProperty(exports, "PaymentProvider", {
957
+ enumerable: true,
958
+ get: function () { return chunk3W2GRACB_cjs.PaymentProvider; }
959
+ });
960
+ Object.defineProperty(exports, "PaymentStatus", {
961
+ enumerable: true,
962
+ get: function () { return chunk3W2GRACB_cjs.PaymentStatus; }
963
+ });
964
+ Object.defineProperty(exports, "useCustomerPayments", {
965
+ enumerable: true,
966
+ get: function () { return chunk3W2GRACB_cjs.useCustomerPayments; }
967
+ });
968
+ Object.defineProperty(exports, "usePayment", {
969
+ enumerable: true,
970
+ get: function () { return chunk3W2GRACB_cjs.usePayment; }
971
+ });
972
+ Object.defineProperty(exports, "usePaymentIdentity", {
973
+ enumerable: true,
974
+ get: function () { return chunk3W2GRACB_cjs.usePaymentIdentity; }
975
+ });
976
+ Object.defineProperty(exports, "usePaymentLink", {
977
+ enumerable: true,
978
+ get: function () { return chunk3W2GRACB_cjs.usePaymentLink; }
979
+ });
980
+ Object.defineProperty(exports, "PaymentsAPI", {
981
+ enumerable: true,
982
+ get: function () { return chunkP3RGFDH4_cjs.API; }
983
+ });
984
+ Object.defineProperty(exports, "createPaymentsApi", {
985
+ enumerable: true,
986
+ get: function () { return chunkP3RGFDH4_cjs.createPaymentsApi; }
987
+ });
988
+ exports.PaymentPage = PaymentPage;
989
+ exports.PaymentWidget = PaymentWidget;
990
+ exports.styles = styles;
991
+ exports.useMobile = useMobile;
992
+ //# sourceMappingURL=index.cjs.map
993
+ //# sourceMappingURL=index.cjs.map