@inflow_pay/sdk 0.6.0 → 0.8.0
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/CHANGELOG.md +17 -0
- package/README.md +139 -29
- package/dist/{payment-sdk-CvXfOxY6.js → payment-sdk-CtCxS64i.js} +8 -8
- package/dist/payment-sdk-CtCxS64i.js.map +1 -0
- package/dist/{payment-sdk-DK3VOIGL.mjs → payment-sdk-WqMhTy7u.mjs} +35 -21
- package/dist/payment-sdk-WqMhTy7u.mjs.map +1 -0
- package/dist/react/index.d.ts +10 -5
- package/dist/react.cjs +1 -1
- package/dist/react.cjs.map +1 -1
- package/dist/react.esm.js +35 -33
- package/dist/react.esm.js.map +1 -1
- package/dist/react.umd.js +12 -12
- package/dist/react.umd.js.map +1 -1
- package/dist/sdk.cjs +1 -1
- package/dist/sdk.cjs.map +1 -1
- package/dist/sdk.d.ts +12 -6
- package/dist/sdk.esm.js +23 -22
- package/dist/sdk.esm.js.map +1 -1
- package/dist/sdk.umd.js +2 -2
- package/dist/sdk.umd.js.map +1 -1
- package/package.json +1 -1
- package/dist/payment-sdk-CvXfOxY6.js.map +0 -1
- package/dist/payment-sdk-DK3VOIGL.mjs.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,23 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.8.0] - 2026-01-30
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
- **Locale support** – UI (disclaimer) can be shown in 8 languages
|
|
14
|
+
- Supported locales: `en`, `de`, `es`, `fr`, `it`, `nl`, `pl`, `pt`
|
|
15
|
+
- Optional `locale` in config; defaults to browser language detection, fallback to English
|
|
16
|
+
|
|
17
|
+
## [0.7.0] - 2026-01-26
|
|
18
|
+
|
|
19
|
+
### Removed
|
|
20
|
+
- Removed `light` theme property completely from `CSSProperties` interface
|
|
21
|
+
|
|
22
|
+
### Changed
|
|
23
|
+
- Updated documentation to remove all light theme references
|
|
24
|
+
- Simplified dark mode documentation to only mention `dark` property usage
|
|
25
|
+
- Updated styling examples to show all available properties
|
|
26
|
+
|
|
10
27
|
## [0.6.0] - 2026-01-26
|
|
11
28
|
|
|
12
29
|
### Changed
|
package/README.md
CHANGED
|
@@ -12,7 +12,7 @@ Or use via CDN (jsDelivr) - **for vanilla HTML pages only**:
|
|
|
12
12
|
|
|
13
13
|
```html
|
|
14
14
|
<!-- Main SDK (vanilla JavaScript) -->
|
|
15
|
-
<script src="https://cdn.jsdelivr.net/npm/@inflow_pay/sdk@0.
|
|
15
|
+
<script src="https://cdn.jsdelivr.net/npm/@inflow_pay/sdk@0.8.0/dist/sdk.umd.js"></script>
|
|
16
16
|
<script>
|
|
17
17
|
// SDK is available as window.InflowPaySDK
|
|
18
18
|
const provider = new InflowPaySDK.InflowPayProvider({
|
|
@@ -22,8 +22,8 @@ Or use via CDN (jsDelivr) - **for vanilla HTML pages only**:
|
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
**Note:**
|
|
25
|
-
- The example uses exact version `@0.
|
|
26
|
-
- You can update to newer versions manually when ready (e.g., `@0.
|
|
25
|
+
- The example uses exact version `@0.8.0` for production safety (prevents unexpected changes)
|
|
26
|
+
- You can update to newer versions manually when ready (e.g., `@0.8.0`)
|
|
27
27
|
- If you're building a React app (create-react-app, Next.js, etc.), use `npm install` instead of CDN. See [Migration from React SDK](#migration-from-react-sdk) section.
|
|
28
28
|
|
|
29
29
|
## Quick Start
|
|
@@ -35,7 +35,7 @@ import { InflowPayProvider } from '@inflow_pay/sdk';
|
|
|
35
35
|
|
|
36
36
|
// Step 1: Create InflowPayProvider (same as React's <InflowPayProvider>)
|
|
37
37
|
const provider = new InflowPayProvider({
|
|
38
|
-
config: { apiKey: 'inflow_pub_xxx' }
|
|
38
|
+
config: { apiKey: 'inflow_pub_xxx', locale: 'en' } // locale optional, defaults to browser language
|
|
39
39
|
});
|
|
40
40
|
|
|
41
41
|
// Step 2: Create CardElement (same as React's <CardElement>)
|
|
@@ -92,12 +92,15 @@ const provider = new InflowPayProvider({
|
|
|
92
92
|
config: {
|
|
93
93
|
apiKey: 'inflow_pub_xxx', // Required
|
|
94
94
|
iframeUrl: 'https://...', // Optional, auto-detected from API key
|
|
95
|
+
locale: 'en', // Optional, UI language (default: auto-detected from browser). Supported: en, de, es, fr, it, nl, pl, pt
|
|
95
96
|
timeout: 30000, // Optional, default: 30000
|
|
96
97
|
debug: false // Optional, default: false
|
|
97
98
|
}
|
|
98
99
|
});
|
|
99
100
|
```
|
|
100
101
|
|
|
102
|
+
**Locale:** Use `locale` in config to set UI language (e.g. `'fr'`); omit to use the browser language. Supported: en, de, es, fr, it, nl, pl, pt.
|
|
103
|
+
|
|
101
104
|
### CardElement
|
|
102
105
|
|
|
103
106
|
```javascript
|
|
@@ -184,7 +187,7 @@ cardElement.destroy();
|
|
|
184
187
|
<body>
|
|
185
188
|
<div id="card-container"></div>
|
|
186
189
|
|
|
187
|
-
<script src="https://cdn.jsdelivr.net/npm/@inflow_pay/sdk@0.
|
|
190
|
+
<script src="https://cdn.jsdelivr.net/npm/@inflow_pay/sdk@0.8.0/dist/sdk.umd.js"></script>
|
|
188
191
|
<script>
|
|
189
192
|
// SDK is available as window.InflowPaySDK
|
|
190
193
|
const provider = new InflowPaySDK.InflowPayProvider({
|
|
@@ -285,7 +288,7 @@ import { InflowPayProvider, CardElement } from '@inflow_pay/sdk/react';
|
|
|
285
288
|
|
|
286
289
|
function App() {
|
|
287
290
|
return (
|
|
288
|
-
<InflowPayProvider config={{ apiKey: 'inflow_pub_xxx' }}>
|
|
291
|
+
<InflowPayProvider config={{ apiKey: 'inflow_pub_xxx', locale: 'en' }}>
|
|
289
292
|
<CardElement
|
|
290
293
|
paymentId={paymentId}
|
|
291
294
|
style={{
|
|
@@ -402,18 +405,22 @@ const cardElement = provider.createCardElement({
|
|
|
402
405
|
disabled: {
|
|
403
406
|
opacity: 0.5
|
|
404
407
|
}
|
|
408
|
+
},
|
|
409
|
+
dark: {
|
|
410
|
+
button: {
|
|
411
|
+
backgroundColor: '#0066CC'
|
|
412
|
+
}
|
|
405
413
|
}
|
|
406
414
|
}
|
|
407
415
|
});
|
|
408
416
|
```
|
|
409
417
|
|
|
410
|
-
###
|
|
418
|
+
### Dark Mode
|
|
411
419
|
|
|
412
|
-
|
|
420
|
+
Use the `dark` property to customize dark mode styles:
|
|
413
421
|
|
|
414
|
-
```
|
|
422
|
+
```tsx
|
|
415
423
|
style: {
|
|
416
|
-
// Base styles (apply to light theme by default)
|
|
417
424
|
fontFamily: 'Inter',
|
|
418
425
|
button: {
|
|
419
426
|
backgroundColor: '#0070F3',
|
|
@@ -423,7 +430,6 @@ style: {
|
|
|
423
430
|
backgroundColor: '#FFFFFF',
|
|
424
431
|
borderColor: '#E0E0E0'
|
|
425
432
|
},
|
|
426
|
-
// Dark mode overrides (only needed if you want to customize dark theme)
|
|
427
433
|
dark: {
|
|
428
434
|
inputContainer: {
|
|
429
435
|
backgroundColor: '#1A1A1A',
|
|
@@ -460,12 +466,15 @@ type FontFamily =
|
|
|
460
466
|
|
|
461
467
|
### Complete Styling API
|
|
462
468
|
|
|
463
|
-
|
|
469
|
+
All available styling properties:
|
|
470
|
+
|
|
471
|
+
```tsx
|
|
464
472
|
interface CSSProperties {
|
|
465
|
-
|
|
466
|
-
|
|
473
|
+
// Global
|
|
474
|
+
fontFamily?: FontFamily; // 'DM Sans' | 'Inter' | 'Poppins' | etc.
|
|
475
|
+
fillParent?: boolean; // Make element fill parent container
|
|
467
476
|
|
|
468
|
-
// Input container (wrapper around all inputs)
|
|
477
|
+
// Input container (wrapper around all card inputs)
|
|
469
478
|
inputContainer?: {
|
|
470
479
|
backgroundColor?: string;
|
|
471
480
|
borderColor?: string;
|
|
@@ -491,14 +500,32 @@ interface CSSProperties {
|
|
|
491
500
|
borderColor?: string;
|
|
492
501
|
borderEnabled?: boolean; // Must be true to show border
|
|
493
502
|
fontSize?: string;
|
|
494
|
-
fontWeight?: FontWeight;
|
|
495
|
-
opacity?: Opacity;
|
|
496
|
-
hover?:
|
|
497
|
-
|
|
498
|
-
|
|
503
|
+
fontWeight?: FontWeight; // 100-900 | 'normal' | 'bold' | 'lighter' | 'bolder'
|
|
504
|
+
opacity?: Opacity; // number (0-1) | string ('0.5' | '50%')
|
|
505
|
+
hover?: { // Hover state
|
|
506
|
+
backgroundColor?: string;
|
|
507
|
+
textColor?: string;
|
|
508
|
+
borderRadius?: string;
|
|
509
|
+
borderColor?: string;
|
|
510
|
+
borderEnabled?: boolean;
|
|
511
|
+
fontSize?: string;
|
|
512
|
+
fontWeight?: FontWeight;
|
|
513
|
+
opacity?: Opacity;
|
|
514
|
+
};
|
|
515
|
+
disabled?: { // Disabled state
|
|
516
|
+
backgroundColor?: string;
|
|
517
|
+
textColor?: string;
|
|
518
|
+
borderRadius?: string;
|
|
519
|
+
borderColor?: string;
|
|
520
|
+
borderEnabled?: boolean;
|
|
521
|
+
fontSize?: string;
|
|
522
|
+
fontWeight?: FontWeight;
|
|
523
|
+
opacity?: Opacity;
|
|
524
|
+
};
|
|
525
|
+
loaderColor?: string; // Loading spinner color
|
|
499
526
|
};
|
|
500
527
|
|
|
501
|
-
// General
|
|
528
|
+
// General error message
|
|
502
529
|
generalError?: {
|
|
503
530
|
textColor?: string;
|
|
504
531
|
backgroundColor?: string;
|
|
@@ -507,6 +534,7 @@ interface CSSProperties {
|
|
|
507
534
|
borderColor?: string;
|
|
508
535
|
};
|
|
509
536
|
|
|
537
|
+
// General success message
|
|
510
538
|
generalSuccess?: {
|
|
511
539
|
textColor?: string;
|
|
512
540
|
backgroundColor?: string;
|
|
@@ -516,12 +544,19 @@ interface CSSProperties {
|
|
|
516
544
|
};
|
|
517
545
|
|
|
518
546
|
// Other colors
|
|
519
|
-
disclaimerColor?: string;
|
|
520
|
-
fieldErrorColor?: string;
|
|
547
|
+
disclaimerColor?: string; // Disclaimer text and icon color
|
|
548
|
+
fieldErrorColor?: string; // Field validation error text color
|
|
521
549
|
|
|
522
|
-
//
|
|
523
|
-
|
|
524
|
-
|
|
550
|
+
// Dark mode overrides
|
|
551
|
+
dark?: {
|
|
552
|
+
inputContainer?: InputContainerStyles;
|
|
553
|
+
input?: InputStyles;
|
|
554
|
+
button?: ButtonStyles;
|
|
555
|
+
disclaimerColor?: string;
|
|
556
|
+
fieldErrorColor?: string;
|
|
557
|
+
generalError?: GeneralMessageStyles;
|
|
558
|
+
generalSuccess?: GeneralMessageStyles;
|
|
559
|
+
};
|
|
525
560
|
}
|
|
526
561
|
```
|
|
527
562
|
|
|
@@ -541,7 +576,7 @@ placeholders: {
|
|
|
541
576
|
buttonText: 'Pay Now'
|
|
542
577
|
```
|
|
543
578
|
|
|
544
|
-
### React Example with Styling
|
|
579
|
+
### React Example with All Styling Properties
|
|
545
580
|
|
|
546
581
|
```tsx
|
|
547
582
|
import { InflowPayProvider, CardElement } from '@inflow_pay/sdk/react';
|
|
@@ -554,16 +589,91 @@ function App() {
|
|
|
554
589
|
style={{
|
|
555
590
|
fontFamily: 'Inter',
|
|
556
591
|
fillParent: true,
|
|
592
|
+
|
|
593
|
+
// Input container
|
|
594
|
+
inputContainer: {
|
|
595
|
+
backgroundColor: '#F5F5F5',
|
|
596
|
+
borderRadius: '8px',
|
|
597
|
+
borderEnabled: true,
|
|
598
|
+
borderColor: '#E0E0E0'
|
|
599
|
+
},
|
|
600
|
+
|
|
601
|
+
// Input fields
|
|
602
|
+
input: {
|
|
603
|
+
textColor: '#1A1A1A',
|
|
604
|
+
placeholderColor: '#999999',
|
|
605
|
+
backgroundColor: 'transparent',
|
|
606
|
+
borderColor: '#CECECE',
|
|
607
|
+
borderEnabled: true,
|
|
608
|
+
borderRadius: '6px'
|
|
609
|
+
},
|
|
610
|
+
|
|
611
|
+
// Button
|
|
557
612
|
button: {
|
|
558
613
|
backgroundColor: '#0070F3',
|
|
559
614
|
textColor: '#FFFFFF',
|
|
560
615
|
borderRadius: '8px',
|
|
561
|
-
|
|
616
|
+
fontSize: '16px',
|
|
617
|
+
fontWeight: 600,
|
|
618
|
+
opacity: 1,
|
|
619
|
+
borderEnabled: false,
|
|
620
|
+
hover: {
|
|
621
|
+
backgroundColor: '#0051CC',
|
|
622
|
+
opacity: 1
|
|
623
|
+
},
|
|
624
|
+
disabled: {
|
|
625
|
+
opacity: 0.5
|
|
626
|
+
},
|
|
627
|
+
loaderColor: '#FFFFFF'
|
|
628
|
+
},
|
|
629
|
+
|
|
630
|
+
// General messages
|
|
631
|
+
generalError: {
|
|
632
|
+
textColor: '#FF443F',
|
|
633
|
+
backgroundColor: '#ffd6cc',
|
|
634
|
+
borderColor: '#FF443F',
|
|
635
|
+
borderEnabled: true,
|
|
636
|
+
borderRadius: '6px'
|
|
637
|
+
},
|
|
638
|
+
|
|
639
|
+
generalSuccess: {
|
|
640
|
+
textColor: '#29a329',
|
|
641
|
+
backgroundColor: '#d6f5d6',
|
|
642
|
+
borderColor: '#29a329',
|
|
643
|
+
borderEnabled: true,
|
|
644
|
+
borderRadius: '6px'
|
|
562
645
|
},
|
|
646
|
+
|
|
647
|
+
// Other colors
|
|
648
|
+
disclaimerColor: '#7A7A7A',
|
|
649
|
+
fieldErrorColor: '#ef4444',
|
|
650
|
+
|
|
651
|
+
// Dark mode
|
|
563
652
|
dark: {
|
|
653
|
+
inputContainer: {
|
|
654
|
+
backgroundColor: '#2d2d2d',
|
|
655
|
+
borderColor: '#7A7A7A'
|
|
656
|
+
},
|
|
657
|
+
input: {
|
|
658
|
+
textColor: '#FFFFFF',
|
|
659
|
+
placeholderColor: '#959499',
|
|
660
|
+
borderColor: '#7A7A7A'
|
|
661
|
+
},
|
|
564
662
|
button: {
|
|
565
663
|
backgroundColor: '#0066CC'
|
|
566
|
-
}
|
|
664
|
+
},
|
|
665
|
+
generalError: {
|
|
666
|
+
textColor: '#ffc2b3',
|
|
667
|
+
backgroundColor: '#991f00',
|
|
668
|
+
borderColor: '#e62e00'
|
|
669
|
+
},
|
|
670
|
+
generalSuccess: {
|
|
671
|
+
textColor: '#adebad',
|
|
672
|
+
backgroundColor: '#196619',
|
|
673
|
+
borderColor: '#2eb82e'
|
|
674
|
+
},
|
|
675
|
+
disclaimerColor: '#959499',
|
|
676
|
+
fieldErrorColor: '#ef4444'
|
|
567
677
|
}
|
|
568
678
|
}}
|
|
569
679
|
buttonText="Complete Payment"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";class
|
|
1
|
+
"use strict";class x{constructor(e){if(this.iframe=null,this.messageListener=null,this.containerElement=null,this.config=e,this.iframeUrl=e.iframeUrl||"http://localhost:3000/iframe/checkout",this.environment=this.getEnvironmentFromApiKey(e.apiKey||""),this.usePopup=!e.container,e.container)if(typeof e.container=="string"){if(this.containerElement=document.querySelector(e.container),!this.containerElement)throw new Error(`Container not found: ${e.container}`)}else this.containerElement=e.container}init(){this.iframe||(this.createIframe(),this.addMessageListener())}createIframe(){const e=new URL(this.iframeUrl);this.config.apiKey&&e.searchParams.set("apiKey",this.config.apiKey),this.config.config?.paymentId&&e.searchParams.set("paymentId",this.config.config.paymentId),this.config.locale&&e.searchParams.set("locale",this.config.locale);const t=e.toString();if(this.usePopup){const i=document.createElement("div");i.id="inflowpay-sdk-overlay",i.style.cssText=`
|
|
2
2
|
position: fixed;
|
|
3
3
|
top: 0;
|
|
4
4
|
left: 0;
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
border: none;
|
|
47
47
|
display: block;
|
|
48
48
|
transition: height 0.2s ease;
|
|
49
|
-
`,this.iframe.setAttribute("allow","payment"),this.containerElement.appendChild(this.iframe),this.showLoader(this.containerElement)}}addMessageListener(){this.messageListener=e=>{const t=new URL(this.iframeUrl).origin;let n=e.origin===t;if(n||((this.environment==="sandbox"||this.environment==="development")&&(n=(e.origin.includes("localhost")||e.origin.includes("127.0.0.1"))&&(t.includes("localhost")||t.includes("127.0.0.1"))),n||(n=e.origin==="https://dev.api.inflowpay.com"||e.origin==="https://pre-prod.api.inflowpay.xyz"||e.origin==="https://api.inflowpay.xyz")),!n){this.config.debug&&console.warn("[SDK] Rejected message from unauthorized origin:",e.origin);return}const s=e.data;if(!(!s||!s.type))switch(s.type){case"iframe-ready":this.hideLoader(),this.sendConfigToIframe();break;case"content-height":if(s.height&&this.iframe){const o=Math.max(s.height,196);this.iframe.style.height=`${o}px`,this.containerElement&&(this.containerElement.style.minHeight=`${o}px`)}break;case"close":this.close();break;case"success":this.config.onSuccess&&this.config.onSuccess(s.data);break;case"error":this.config.onError&&this.config.onError(s.data);break;case"3ds-required":this.config.debug&&console.log("[SDK] Received 3DS request:",s.threeDsSessionUrl),s.threeDsSessionUrl?(this.config.debug&&console.log("[SDK] Opening 3DS modal..."),this.open3DSModal(s.threeDsSessionUrl).then(o=>{if(this.config.debug&&console.log("[SDK] 3DS modal closed, result:",o),this.iframe&&this.iframe.contentWindow){const r=this.getTargetOrigin();this.iframe.contentWindow.postMessage({type:"3ds-result",success:o,paymentId:s.paymentId||this.config.config?.paymentId},r)}})):this.config.debug&&console.error("[SDK] 3DS required but no threeDsSessionUrl provided");break;default:this.config.debug&&console.log("SDK: Received message:",s)}},window.addEventListener("message",this.messageListener)}sendConfigToIframe(){if(!this.iframe||!this.iframe.contentWindow){this.iframe&&(this.iframe.onload=()=>{this.sendConfigToIframe()});return}const e={type:"sdkData",config:{...this.config.config||{},paymentId:this.config.config?.paymentId},data:{apiKey:this.config.apiKey}},t=this.getTargetOrigin();this.iframe.contentWindow.postMessage(e,t)}showLoader(e){this.iframe&&(this.iframe.style.display="none");const t=window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches,i=t?"#2d2d2d":"#F5F5F5",n=t?"#3d3d3d":"#E5E5E5",o=`linear-gradient(90deg, ${n} 25%, ${t?"#4d4d4d":"#F0F0F0"} 50%, ${n} 75%)`,r=document.createElement("div");r.id="inflowpay-loader";const
|
|
49
|
+
`,this.iframe.setAttribute("allow","payment"),this.containerElement.appendChild(this.iframe),this.showLoader(this.containerElement)}}addMessageListener(){this.messageListener=e=>{const t=new URL(this.iframeUrl).origin;let n=e.origin===t;if(n||((this.environment==="sandbox"||this.environment==="development")&&(n=(e.origin.includes("localhost")||e.origin.includes("127.0.0.1"))&&(t.includes("localhost")||t.includes("127.0.0.1"))),n||(n=e.origin==="https://dev.api.inflowpay.com"||e.origin==="https://pre-prod.api.inflowpay.xyz"||e.origin==="https://api.inflowpay.xyz")),!n){this.config.debug&&console.warn("[SDK] Rejected message from unauthorized origin:",e.origin);return}const s=e.data;if(!(!s||!s.type))switch(s.type){case"iframe-ready":this.hideLoader(),this.sendConfigToIframe();break;case"content-height":if(s.height&&this.iframe){const o=Math.max(s.height,196);this.iframe.style.height=`${o}px`,this.containerElement&&(this.containerElement.style.minHeight=`${o}px`)}break;case"close":this.close();break;case"success":this.config.onSuccess&&this.config.onSuccess(s.data);break;case"error":this.config.onError&&this.config.onError(s.data);break;case"3ds-required":this.config.debug&&console.log("[SDK] Received 3DS request:",s.threeDsSessionUrl),s.threeDsSessionUrl?(this.config.debug&&console.log("[SDK] Opening 3DS modal..."),this.open3DSModal(s.threeDsSessionUrl).then(o=>{if(this.config.debug&&console.log("[SDK] 3DS modal closed, result:",o),this.iframe&&this.iframe.contentWindow){const r=this.getTargetOrigin();this.iframe.contentWindow.postMessage({type:"3ds-result",success:o,paymentId:s.paymentId||this.config.config?.paymentId},r)}})):this.config.debug&&console.error("[SDK] 3DS required but no threeDsSessionUrl provided");break;default:this.config.debug&&console.log("SDK: Received message:",s)}},window.addEventListener("message",this.messageListener)}sendConfigToIframe(){if(!this.iframe||!this.iframe.contentWindow){this.iframe&&(this.iframe.onload=()=>{this.sendConfigToIframe()});return}const e={type:"sdkData",config:{...this.config.config||{},paymentId:this.config.config?.paymentId},data:{apiKey:this.config.apiKey}},t=this.getTargetOrigin();this.iframe.contentWindow.postMessage(e,t)}showLoader(e){this.iframe&&(this.iframe.style.display="none");const t=window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches,i=t?"#2d2d2d":"#F5F5F5",n=t?"#3d3d3d":"#E5E5E5",o=`linear-gradient(90deg, ${n} 25%, ${t?"#4d4d4d":"#F0F0F0"} 50%, ${n} 75%)`,r=document.createElement("div");r.id="inflowpay-loader";const g=this.config.config?.style?.fillParent?"100%":"344px";r.style.cssText=`
|
|
50
50
|
position: absolute;
|
|
51
51
|
top: 0;
|
|
52
52
|
left: 0;
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
align-items: center;
|
|
61
61
|
font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
|
|
62
62
|
`;const c=document.createElement("div");c.style.cssText=`
|
|
63
|
-
width: ${
|
|
63
|
+
width: ${g};
|
|
64
64
|
max-width: 100%;
|
|
65
65
|
margin: 0 auto;
|
|
66
66
|
font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
|
|
@@ -119,14 +119,14 @@
|
|
|
119
119
|
background: ${o};
|
|
120
120
|
background-size: 200% 100%;
|
|
121
121
|
animation: inflowpay-shimmer 1.5s infinite;
|
|
122
|
-
`;const
|
|
122
|
+
`;const y=document.createElement("div");if(y.className="inflowpay-skeleton",y.style.cssText=`
|
|
123
123
|
width: 80%;
|
|
124
124
|
height: 16px;
|
|
125
125
|
border-radius: 4px;
|
|
126
126
|
background: ${o};
|
|
127
127
|
background-size: 200% 100%;
|
|
128
128
|
animation: inflowpay-shimmer 1.5s infinite;
|
|
129
|
-
`,h.appendChild(f),h.appendChild(
|
|
129
|
+
`,h.appendChild(f),h.appendChild(y),c.appendChild(l),c.appendChild(m),c.appendChild(h),r.appendChild(c),!document.getElementById("inflowpay-loader-styles")){const w=document.createElement("style");w.id="inflowpay-loader-styles",w.textContent=`
|
|
130
130
|
@keyframes inflowpay-shimmer {
|
|
131
131
|
0% {
|
|
132
132
|
background-position: -200% 0;
|
|
@@ -135,7 +135,7 @@
|
|
|
135
135
|
background-position: 200% 0;
|
|
136
136
|
}
|
|
137
137
|
}
|
|
138
|
-
`,document.head.appendChild(
|
|
138
|
+
`,document.head.appendChild(w)}e.appendChild(r)}hideLoader(){const e=document.getElementById("inflowpay-loader");e&&e.remove(),this.iframe&&(this.iframe.style.display="")}close(){if(this.config.onClose&&this.config.onClose(),this.hideLoader(),this.messageListener&&(window.removeEventListener("message",this.messageListener),this.messageListener=null),this.usePopup){const e=document.getElementById("inflowpay-sdk-overlay");e&&e.remove()}else this.containerElement&&(this.containerElement.innerHTML="");this.iframe=null}open3DSModal(e){return this.config.debug&&console.log("[SDK] open3DSModal called with URL:",e),new Promise(t=>{const i=document.createElement("div");i.id="inflowpay-3ds-overlay",i.style.cssText=`
|
|
139
139
|
position: fixed;
|
|
140
140
|
top: 0;
|
|
141
141
|
left: 0;
|
|
@@ -174,5 +174,5 @@
|
|
|
174
174
|
width: 100%;
|
|
175
175
|
height: 100%;
|
|
176
176
|
border: none;
|
|
177
|
-
`,r.setAttribute("allow","payment"),r.setAttribute("sandbox","allow-forms allow-scripts allow-same-origin allow-popups"),o.appendChild(r),n.appendChild(s),n.appendChild(o),i.appendChild(n),document.body.appendChild(i);const
|
|
178
|
-
//# sourceMappingURL=payment-sdk-
|
|
177
|
+
`,r.setAttribute("allow","payment"),r.setAttribute("sandbox","allow-forms allow-scripts allow-same-origin allow-popups"),o.appendChild(r),n.appendChild(s),n.appendChild(o),i.appendChild(n),document.body.appendChild(i);const g=i.querySelector("#inflowpay-3ds-close"),c=()=>{i.remove(),window.removeEventListener("message",l),t(!1)};g?.addEventListener("click",c);const l=a=>{if(!a.data)return;const p=["https://dev.api.inflowpay.com","https://pre-prod.api.inflowpay.xyz","https://api.inflowpay.xyz"];if(this.environment==="sandbox"||this.environment==="development"){if(!(a.origin.includes("localhost")||a.origin.includes("127.0.0.1"))){if(!p.includes(a.origin)){this.config.debug&&console.warn("[SDK] Rejected 3DS message from unauthorized origin:",a.origin);return}}}else if(!p.includes(a.origin)){this.config.debug&&console.warn("[SDK] Rejected 3DS message from unauthorized origin:",a.origin);return}const d=a.data,m=d.type==="THREE_DS_COMPLETE"||d.type==="3ds-complete",h=d.status==="success",f=d.status==="failed"||d.status==="failure";if(m&&h){i.remove(),window.removeEventListener("message",l),t(!0);return}if(h&&!m){i.remove(),window.removeEventListener("message",l),t(!0);return}if(m&&f||d.type==="3ds-failed"||f){i.remove(),window.removeEventListener("message",l),t(!1);return}};window.addEventListener("message",l)})}getTargetOrigin(){return this.environment==="production"||this.environment==="preprod"?new URL(this.iframeUrl).origin:"*"}getEnvironmentFromApiKey(e){return!e||e.includes("_local_")||e.startsWith("inflow_local_")?"sandbox":e.includes("_prod_")&&!e.includes("_preprod_")?"production":e.includes("_preprod_")||e.startsWith("inflow_preprod_")?"preprod":e.includes("_dev_")?"development":"sandbox"}destroy(){this.close()}}const E=["en","de","es","fr","it","nl","pl","pt"];function k(){if(typeof window>"u")return"en";try{const e=(navigator.language||navigator.userLanguage||"").split("-")[0].toLowerCase();if(E.includes(e))return e}catch{}return"en"}class b{constructor(e,t){this.mounted=!1;let i;if(typeof t.container=="string"){if(i=document.querySelector(t.container),!i)throw new Error(`Container not found: ${t.container}`)}else i=t.container;this.container=i,this.sdk=new x({iframeUrl:e.iframeUrl,apiKey:e.apiKey,container:this.container,locale:e.locale??k(),config:{paymentId:t.paymentId,...t.style&&{style:t.style},...t.buttonText&&{buttonText:t.buttonText},...t.placeholders&&{placeholders:t.placeholders}},onSuccess:n=>{t.onComplete&&t.onComplete({status:n?.data?.transaction?.status||"CHECKOUT_SUCCESS",data:n})},onError:n=>{t.onError?t.onError(n):t.onComplete&&t.onComplete({status:"PAYMENT_FAILED",error:n})},onClose:()=>{t.onClose&&t.onClose()}})}mount(){if(this.mounted)throw new Error("CardElement is already mounted");this.sdk.init(),this.mounted=!0}destroy(){this.mounted&&(this.sdk.destroy(),this.mounted=!1)}}class v{constructor(e){if(!e.apiKey||typeof e.apiKey!="string")throw new Error("API key is required");let t=e.iframeUrl;const i=this.getEnvironmentFromApiKey(e.apiKey);t||(i==="production"?t="https://api.inflowpay.xyz/iframe/checkout":i==="preprod"?t="https://pre-prod.api.inflowpay.xyz/iframe/checkout":i==="development"?t="https://dev.api.inflowpay.com/iframe/checkout":t="http://localhost:3000/iframe/checkout");const n=e.debug??!1;n&&(i==="production"||i==="preprod")&&console.warn("[InflowPay SDK] Debug mode is not allowed in production/pre-prod environments. Debug mode disabled.");const s=n&&(i==="sandbox"||i==="development");this.config={apiKey:e.apiKey,iframeUrl:t,timeout:e.timeout??3e4,debug:s,locale:e.locale}}createCardElement(e){return new b(this.config,e)}getIframeUrl(){return this.config.iframeUrl}getApiKey(){return this.config.apiKey}getEnvironmentFromApiKey(e){return e.includes("_local_")||e.startsWith("inflow_local_")?"sandbox":e.includes("_prod_")&&!e.includes("_preprod_")?"production":e.includes("_preprod_")||e.startsWith("inflow_preprod_")?"preprod":e.includes("_dev_")?"development":"sandbox"}}exports.CardElement=b;exports.PaymentSDK=v;exports.SDK=x;
|
|
178
|
+
//# sourceMappingURL=payment-sdk-CtCxS64i.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"payment-sdk-CtCxS64i.js","sources":["../src/sdk.ts","../src/utils.ts","../src/card-element.ts","../src/payment-sdk.ts"],"sourcesContent":["/**\n * InflowPay SDK v2 - Iframe-based Payment SDK\n * \n * This SDK creates an iframe and communicates with a React payment application\n * using postMessage API for secure cross-origin communication.\n */\n\nimport type { SDKConfig, IframeMessage } from './types';\n\nexport class SDK {\n private iframe: HTMLIFrameElement | null = null;\n private iframeUrl: string;\n private config: SDKConfig;\n private messageListener: ((event: MessageEvent) => void) | null = null;\n private containerElement: HTMLElement | null = null;\n private usePopup: boolean;\n private environment: 'sandbox' | 'production' | 'development' | 'preprod';\n\n constructor(config: SDKConfig) {\n this.config = config;\n this.iframeUrl = config.iframeUrl || 'http://localhost:3000/iframe/checkout';\n this.environment = this.getEnvironmentFromApiKey(config.apiKey || '');\n\n // Determine if we should use popup or inline\n this.usePopup = !config.container;\n\n // Resolve container if provided\n if (config.container) {\n if (typeof config.container === 'string') {\n this.containerElement = document.querySelector(config.container);\n if (!this.containerElement) {\n throw new Error(`Container not found: ${config.container}`);\n }\n } else {\n this.containerElement = config.container;\n }\n }\n }\n\n /**\n * Initialize and open the payment iframe\n */\n init(): void {\n if (this.iframe) {\n return;\n }\n\n this.createIframe();\n this.addMessageListener();\n }\n\n /**\n * Create and append the iframe to the document\n */\n private createIframe(): void {\n // Build iframe URL with API key and paymentId and locale as query parameters\n const url = new URL(this.iframeUrl);\n if (this.config.apiKey) {\n url.searchParams.set('apiKey', this.config.apiKey);\n }\n if (this.config.config?.paymentId) {\n url.searchParams.set('paymentId', this.config.config.paymentId);\n }\n if (this.config.locale) {\n url.searchParams.set('locale', this.config.locale);\n }\n const iframeSrc = url.toString();\n\n if (this.usePopup) {\n // Create overlay for popup mode\n const overlay = document.createElement('div');\n overlay.id = 'inflowpay-sdk-overlay';\n overlay.style.cssText = `\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 999999;\n `;\n\n // Create iframe container\n const container = document.createElement('div');\n container.style.cssText = `\n position: relative;\n width: 90%;\n max-width: 500px;\n height: 90%;\n max-height: 600px;\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);\n `;\n\n // Create close button\n const closeButton = document.createElement('button');\n closeButton.innerHTML = '×';\n closeButton.style.cssText = `\n position: absolute;\n top: 10px;\n right: 10px;\n width: 30px;\n height: 30px;\n border: none;\n background: transparent;\n font-size: 24px;\n cursor: pointer;\n z-index: 1000000;\n color: #333;\n display: flex;\n align-items: center;\n justify-content: center;\n `;\n closeButton.onclick = () => this.close();\n\n // Create iframe\n this.iframe = document.createElement('iframe');\n this.iframe.src = iframeSrc;\n this.iframe.style.cssText = `\n width: 100%;\n height: 100%;\n border: none;\n border-radius: 8px;\n `;\n this.iframe.setAttribute('allow', 'payment');\n\n // Assemble structure\n container.appendChild(closeButton);\n container.appendChild(this.iframe);\n overlay.appendChild(container);\n document.body.appendChild(overlay);\n\n // Show loader\n this.showLoader(container);\n\n // Close on overlay click (but not on container click)\n overlay.addEventListener('click', (e) => {\n if (e.target === overlay) {\n this.close();\n }\n });\n } else {\n // Inline mode - mount directly in container\n if (!this.containerElement) {\n throw new Error('Container element is required for inline mode');\n }\n\n // Clear container\n this.containerElement.innerHTML = '';\n\n // Set container styles for seamless integration\n if (this.containerElement instanceof HTMLElement) {\n const currentStyle = this.containerElement.getAttribute('style') || '';\n if (!currentStyle.includes('min-height')) {\n this.containerElement.style.minHeight = '196px';\n }\n if (!currentStyle.includes('position')) {\n this.containerElement.style.position = 'relative';\n }\n if (!currentStyle.includes('overflow')) {\n this.containerElement.style.overflow = 'hidden';\n }\n }\n\n // Create iframe\n this.iframe = document.createElement('iframe');\n this.iframe.src = iframeSrc;\n\n const iframeWidth = this.config.config?.style?.fillParent ? '100%' : '344px';\n const iframeMaxWidth = this.config.config?.style?.fillParent ? 'none' : '100%';\n\n this.iframe.style.cssText = `\n width: ${iframeWidth};\n max-width: ${iframeMaxWidth};\n height: 196px;\n min-height: 196px;\n border: none;\n display: block;\n transition: height 0.2s ease;\n `;\n\n this.iframe.setAttribute('allow', 'payment');\n\n // Append to container\n this.containerElement.appendChild(this.iframe);\n\n // Show loader\n this.showLoader(this.containerElement);\n }\n }\n\n /**\n * Add message listener for communication with iframe\n */\n private addMessageListener(): void {\n this.messageListener = (event: MessageEvent) => {\n const allowedOrigin = new URL(this.iframeUrl).origin;\n const isExactMatch = event.origin === allowedOrigin;\n\n let isAllowedOrigin = isExactMatch;\n\n if (!isAllowedOrigin) {\n if (this.environment === 'sandbox' || this.environment === 'development') {\n const isLocalhostDev =\n (event.origin.includes('localhost') || event.origin.includes('127.0.0.1')) &&\n (allowedOrigin.includes('localhost') || allowedOrigin.includes('127.0.0.1'));\n isAllowedOrigin = isLocalhostDev;\n }\n\n if (!isAllowedOrigin) {\n const isAllowedApiOrigin =\n event.origin === 'https://dev.api.inflowpay.com' ||\n event.origin === 'https://pre-prod.api.inflowpay.xyz' ||\n event.origin === 'https://api.inflowpay.xyz';\n isAllowedOrigin = isAllowedApiOrigin;\n }\n }\n\n if (!isAllowedOrigin) {\n if (this.config.debug) {\n console.warn('[SDK] Rejected message from unauthorized origin:', event.origin);\n }\n return;\n }\n\n const data = event.data as IframeMessage;\n\n if (!data || !data.type) {\n return;\n }\n\n switch (data.type) {\n case 'iframe-ready':\n // Wait for iframe's javascript to be ready before sending config\n this.hideLoader();\n this.sendConfigToIframe();\n break;\n\n case 'content-height':\n // Adjust iframe height based on content\n if (data.height && this.iframe) {\n const height = Math.max(data.height, 196); // Minimum 196px\n this.iframe.style.height = `${height}px`;\n if (this.containerElement) {\n this.containerElement.style.minHeight = `${height}px`;\n }\n }\n break;\n\n case 'close':\n this.close();\n break;\n\n case 'success':\n if (this.config.onSuccess) {\n this.config.onSuccess(data.data);\n }\n break;\n\n case 'error':\n if (this.config.onError) {\n this.config.onError(data.data);\n }\n break;\n\n case '3ds-required':\n // Iframe requests SDK to open 3DS popup\n if (this.config.debug) {\n console.log('[SDK] Received 3DS request:', data.threeDsSessionUrl);\n }\n if (data.threeDsSessionUrl) {\n if (this.config.debug) {\n console.log('[SDK] Opening 3DS modal...');\n }\n this.open3DSModal(data.threeDsSessionUrl).then((success) => {\n if (this.config.debug) {\n console.log('[SDK] 3DS modal closed, result:', success);\n }\n if (this.iframe && this.iframe.contentWindow) {\n const targetOrigin = this.getTargetOrigin();\n this.iframe.contentWindow.postMessage({\n type: '3ds-result',\n success: success,\n paymentId: data.paymentId || this.config.config?.paymentId,\n }, targetOrigin);\n }\n });\n } else {\n if (this.config.debug) {\n console.error('[SDK] 3DS required but no threeDsSessionUrl provided');\n }\n }\n break;\n\n default:\n if (this.config.debug) {\n console.log('SDK: Received message:', data);\n }\n }\n };\n\n window.addEventListener('message', this.messageListener);\n }\n\n /**\n * Send configuration to the iframe\n */\n private sendConfigToIframe(): void {\n if (!this.iframe || !this.iframe.contentWindow) {\n // Wait for iframe to load\n if (this.iframe) {\n this.iframe.onload = () => {\n this.sendConfigToIframe();\n };\n }\n return;\n }\n\n const message: IframeMessage = {\n type: 'sdkData',\n config: {\n ...(this.config.config || {}),\n paymentId: this.config.config?.paymentId\n },\n data: {\n apiKey: this.config.apiKey,\n },\n };\n\n const targetOrigin = this.getTargetOrigin();\n this.iframe.contentWindow.postMessage(message, targetOrigin);\n }\n\n /**\n * Show skeleton loader while iframe is connecting\n */\n private showLoader(container: HTMLElement): void {\n // Hide iframe while loader is showing\n if (this.iframe) {\n this.iframe.style.display = 'none';\n }\n \n // Detect dark mode\n const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;\n \n // Color scheme based on dark mode\n const inputBgColor = isDarkMode ? '#2d2d2d' : '#F5F5F5';\n const shimmerBase = isDarkMode ? '#3d3d3d' : '#E5E5E5';\n const shimmerLight = isDarkMode ? '#4d4d4d' : '#F0F0F0';\n const shimmerGradient = `linear-gradient(90deg, ${shimmerBase} 25%, ${shimmerLight} 50%, ${shimmerBase} 75%)`;\n \n const loader = document.createElement('div');\n loader.id = 'inflowpay-loader';\n \n // Get container width to match SDK structure\n const containerWidth = this.config.config?.style?.fillParent ? '100%' : '344px';\n \n loader.style.cssText = `\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1000;\n padding: 20px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n `;\n\n // Skeleton card element container (matching .inflowpay-card-element)\n const skeletonCard = document.createElement('div');\n skeletonCard.style.cssText = `\n width: ${containerWidth};\n max-width: 100%;\n margin: 0 auto;\n font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n `;\n\n // Input container skeleton (matching .inflowpay-card-inp-wrap)\n const inputWrap = document.createElement('div');\n inputWrap.style.cssText = `\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n background-color: ${inputBgColor};\n padding: 8px;\n border-radius: 8px;\n margin-bottom: 20px;\n `;\n\n // Card number skeleton (flex: 1)\n const cardNumberSkeleton = document.createElement('div');\n cardNumberSkeleton.className = 'inflowpay-skeleton';\n cardNumberSkeleton.style.cssText = `\n flex: 1;\n min-width: 0;\n height: 32px;\n border-radius: 6px;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n `;\n\n // Expiry skeleton (21.5% width)\n const expirySkeleton = document.createElement('div');\n expirySkeleton.className = 'inflowpay-skeleton';\n expirySkeleton.style.cssText = `\n width: 21.5%;\n flex-shrink: 0;\n height: 32px;\n border-radius: 6px;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n `;\n\n // CVC skeleton (17.5% width)\n const cvcSkeleton = document.createElement('div');\n cvcSkeleton.className = 'inflowpay-skeleton';\n cvcSkeleton.style.cssText = `\n width: 17.5%;\n flex-shrink: 0;\n height: 32px;\n border-radius: 6px;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n `;\n\n inputWrap.appendChild(cardNumberSkeleton);\n inputWrap.appendChild(expirySkeleton);\n inputWrap.appendChild(cvcSkeleton);\n\n // Button skeleton (matching .inflowpay-button)\n const buttonSkeleton = document.createElement('div');\n buttonSkeleton.className = 'inflowpay-skeleton';\n buttonSkeleton.style.cssText = `\n width: 100%;\n height: 42px;\n border-radius: 8px;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n margin-bottom: 16px;\n `;\n\n // Disclaimer skeleton (matching .inflowpay-disclaimer)\n const disclaimerSkeleton = document.createElement('div');\n disclaimerSkeleton.style.cssText = `\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 4px;\n width: 100%;\n margin-top: 16px;\n `;\n\n const disclaimerIconSkeleton = document.createElement('div');\n disclaimerIconSkeleton.className = 'inflowpay-skeleton';\n disclaimerIconSkeleton.style.cssText = `\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n `;\n\n const disclaimerTextSkeleton = document.createElement('div');\n disclaimerTextSkeleton.className = 'inflowpay-skeleton';\n disclaimerTextSkeleton.style.cssText = `\n width: 80%;\n height: 16px;\n border-radius: 4px;\n background: ${shimmerGradient};\n background-size: 200% 100%;\n animation: inflowpay-shimmer 1.5s infinite;\n `;\n\n disclaimerSkeleton.appendChild(disclaimerIconSkeleton);\n disclaimerSkeleton.appendChild(disclaimerTextSkeleton);\n\n skeletonCard.appendChild(inputWrap);\n skeletonCard.appendChild(buttonSkeleton);\n skeletonCard.appendChild(disclaimerSkeleton);\n loader.appendChild(skeletonCard);\n\n // Add shimmer animation keyframes\n if (!document.getElementById('inflowpay-loader-styles')) {\n const style = document.createElement('style');\n style.id = 'inflowpay-loader-styles';\n style.textContent = `\n @keyframes inflowpay-shimmer {\n 0% {\n background-position: -200% 0;\n }\n 100% {\n background-position: 200% 0;\n }\n }\n `;\n document.head.appendChild(style);\n }\n\n container.appendChild(loader);\n }\n\n /**\n * Hide loader\n */\n private hideLoader(): void {\n const loader = document.getElementById('inflowpay-loader');\n if (loader) {\n loader.remove();\n }\n \n // Show iframe again when loader is hidden\n if (this.iframe) {\n this.iframe.style.display = '';\n }\n }\n\n /**\n * Close the iframe and cleanup\n */\n private close(): void {\n if (this.config.onClose) {\n this.config.onClose();\n }\n\n // Hide loader\n this.hideLoader();\n\n // Remove message listener\n if (this.messageListener) {\n window.removeEventListener('message', this.messageListener);\n this.messageListener = null;\n }\n\n if (this.usePopup) {\n // Remove overlay\n const overlay = document.getElementById('inflowpay-sdk-overlay');\n if (overlay) {\n overlay.remove();\n }\n } else {\n // Clear container\n if (this.containerElement) {\n this.containerElement.innerHTML = '';\n }\n }\n\n this.iframe = null;\n }\n\n /**\n * Open 3DS authentication modal\n * Called when iframe requests 3DS authentication\n */\n private open3DSModal(challengeUrl: string): Promise<boolean> {\n if (this.config.debug) {\n console.log('[SDK] open3DSModal called with URL:', challengeUrl);\n }\n return new Promise((resolve) => {\n // Create overlay\n const overlay = document.createElement('div');\n overlay.id = 'inflowpay-3ds-overlay';\n overlay.style.cssText = `\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 999999;\n `;\n\n // Create modal\n const modal = document.createElement('div');\n modal.style.cssText = `\n position: relative;\n width: 90%;\n max-width: 500px;\n height: 90%;\n max-height: 600px;\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);\n display: flex;\n flex-direction: column;\n `;\n\n // Create header\n const header = document.createElement('div');\n header.style.cssText = `\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 15px 20px;\n border-bottom: 1px solid #e5e5e5;\n `;\n header.innerHTML = `\n <h3 style=\"margin: 0; font-size: 18px; font-weight: 600;\">Secure Payment Authentication</h3>\n <button id=\"inflowpay-3ds-close\" style=\"background: none; border: none; font-size: 24px; cursor: pointer; padding: 0; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; color: #333;\">×</button>\n `;\n\n // Create content with iframe\n const content = document.createElement('div');\n content.style.cssText = `\n flex: 1;\n position: relative;\n overflow: hidden;\n `;\n const iframe = document.createElement('iframe');\n iframe.src = challengeUrl;\n iframe.style.cssText = `\n width: 100%;\n height: 100%;\n border: none;\n `;\n iframe.setAttribute('allow', 'payment');\n iframe.setAttribute('sandbox', 'allow-forms allow-scripts allow-same-origin allow-popups');\n content.appendChild(iframe);\n\n modal.appendChild(header);\n modal.appendChild(content);\n overlay.appendChild(modal);\n document.body.appendChild(overlay);\n\n // Close button handler\n const closeBtn = overlay.querySelector('#inflowpay-3ds-close');\n const closeHandler = () => {\n overlay.remove();\n window.removeEventListener('message', messageHandler);\n resolve(false);\n };\n closeBtn?.addEventListener('click', closeHandler);\n\n const messageHandler = (event: MessageEvent) => {\n if (!event.data) return;\n\n const allowed3DSOrigins = [\n 'https://dev.api.inflowpay.com',\n 'https://pre-prod.api.inflowpay.xyz',\n 'https://api.inflowpay.xyz',\n ];\n\n if (this.environment === 'sandbox' || this.environment === 'development') {\n if (event.origin.includes('localhost') || event.origin.includes('127.0.0.1')) {\n // Allow localhost in dev/sandbox\n } else if (!allowed3DSOrigins.includes(event.origin)) {\n if (this.config.debug) {\n console.warn('[SDK] Rejected 3DS message from unauthorized origin:', event.origin);\n }\n return;\n }\n } else {\n if (!allowed3DSOrigins.includes(event.origin)) {\n if (this.config.debug) {\n console.warn('[SDK] Rejected 3DS message from unauthorized origin:', event.origin);\n }\n return;\n }\n }\n\n const data = event.data;\n const is3DSComplete = data.type === 'THREE_DS_COMPLETE' || data.type === '3ds-complete';\n const isSuccess = data.status === 'success';\n const isFailure = data.status === 'failed' || data.status === 'failure';\n\n // Success case\n if (is3DSComplete && isSuccess) {\n overlay.remove();\n window.removeEventListener('message', messageHandler);\n resolve(true);\n return;\n }\n\n // Also handle legacy format\n if (isSuccess && !is3DSComplete) {\n overlay.remove();\n window.removeEventListener('message', messageHandler);\n resolve(true);\n return;\n }\n\n // Failure case\n if ((is3DSComplete && isFailure) || data.type === '3ds-failed' || isFailure) {\n overlay.remove();\n window.removeEventListener('message', messageHandler);\n resolve(false);\n return;\n }\n };\n\n window.addEventListener('message', messageHandler);\n });\n }\n\n /**\n * Get target origin for postMessage based on environment\n * In production/pre-prod: use exact origin for security\n * In dev/sandbox: use wildcard for development flexibility\n */\n private getTargetOrigin(): string {\n if (this.environment === 'production' || this.environment === 'preprod') {\n return new URL(this.iframeUrl).origin;\n }\n return '*';\n }\n\n /**\n * Detect environment from API key\n */\n private getEnvironmentFromApiKey(apiKey: string): 'sandbox' | 'production' | 'development' | 'preprod' {\n if (!apiKey) return 'sandbox';\n if (apiKey.includes('_local_') || apiKey.startsWith('inflow_local_')) {\n return 'sandbox';\n } else if (apiKey.includes('_prod_') && !apiKey.includes('_preprod_')) {\n return 'production';\n } else if (apiKey.includes('_preprod_') || apiKey.startsWith('inflow_preprod_')) {\n return 'preprod';\n } else if (apiKey.includes('_dev_')) {\n return 'development';\n }\n return 'sandbox';\n }\n\n /**\n * Public method to close the iframe\n */\n public destroy(): void {\n this.close();\n }\n}\n\n","/**\n * Utility functions\n */\n\nimport type { Locale } from './types';\n\nexport const SUPPORTED_LOCALES: Locale[] = ['en', 'de', 'es', 'fr', 'it', 'nl', 'pl', 'pt'];\n\n/**\n * Detects the browser's language and returns a supported locale if available.\n * Falls back to 'en' if the browser language is not supported.\n */\nexport function detectBrowserLocale(): Locale {\n if (typeof window === 'undefined') {\n return 'en';\n }\n\n try {\n const browserLang =\n navigator.language ||\n (navigator as { userLanguage?: string }).userLanguage ||\n '';\n\n const primaryLang = browserLang.split('-')[0].toLowerCase();\n\n if (SUPPORTED_LOCALES.includes(primaryLang as Locale)) {\n return primaryLang as Locale;\n }\n } catch {\n // If detection fails, fall back to default\n }\n\n return 'en';\n}\n","/**\n * CardElement - Iframe-based payment element\n * \n * Mounts an iframe with the payment checkout form\n */\n\nimport { SDK } from './sdk';\n\nimport type { CSSProperties, Locale } from './types';\nimport { detectBrowserLocale } from './utils';\n\nexport interface CardElementOptions {\n /** Container element or CSS selector where the iframe will be mounted */\n container: string | HTMLElement;\n /** Payment ID for this transaction */\n paymentId: string;\n /** Callback when payment completes */\n onComplete?: (result: { status: string; data?: any; error?: any }) => void;\n /** Callback when payment fails */\n onError?: (error: any) => void;\n /** Callback when user closes the payment */\n onClose?: () => void;\n /** Custom styling for the card element */\n style?: CSSProperties;\n /** Custom button text (default: \"Complete Payment\") */\n buttonText?: string;\n /** Custom placeholder text for inputs */\n placeholders?: {\n cardNumber?: string;\n expiry?: string;\n cvc?: string;\n };\n}\n\ninterface InternalSDKConfig {\n apiKey: string;\n iframeUrl: string;\n timeout: number;\n debug: boolean;\n locale?: Locale;\n}\n\nexport class CardElement {\n private sdk: SDK;\n private container: HTMLElement;\n private mounted: boolean = false;\n\n constructor(\n config: InternalSDKConfig,\n options: CardElementOptions\n ) {\n let containerElement: HTMLElement | null;\n if (typeof options.container === 'string') {\n containerElement = document.querySelector(options.container);\n if (!containerElement) {\n throw new Error(`Container not found: ${options.container}`);\n }\n } else {\n containerElement = options.container;\n }\n this.container = containerElement;\n\n this.sdk = new SDK({\n iframeUrl: config.iframeUrl,\n apiKey: config.apiKey,\n container: this.container,\n locale: config.locale ?? detectBrowserLocale(),\n config: {\n paymentId: options.paymentId,\n ...(options.style && { style: options.style }),\n ...(options.buttonText && { buttonText: options.buttonText }),\n ...(options.placeholders && { placeholders: options.placeholders }),\n },\n onSuccess: (data) => {\n if (options.onComplete) {\n options.onComplete({\n status: data?.data?.transaction?.status || 'CHECKOUT_SUCCESS',\n data: data,\n });\n }\n },\n onError: (error) => {\n if (options.onError) {\n options.onError(error);\n } else if (options.onComplete) {\n options.onComplete({\n status: 'PAYMENT_FAILED',\n error: error,\n });\n }\n },\n onClose: () => {\n if (options.onClose) {\n options.onClose();\n }\n },\n });\n }\n\n /**\n * Mount the CardElement to the DOM\n * This will create and display the iframe\n */\n mount(): void {\n if (this.mounted) {\n throw new Error('CardElement is already mounted');\n }\n\n this.sdk.init();\n this.mounted = true;\n }\n\n /**\n * Destroy the CardElement and cleanup\n */\n destroy(): void {\n if (this.mounted) {\n this.sdk.destroy();\n this.mounted = false;\n }\n }\n}\n","/**\n * InflowPay Payment SDK v2\n * \n * Provider class that manages global SDK configuration\n * Similar to the original SDK but uses iframe-based payment flow\n */\n\nimport type { CSSProperties, Locale } from './types';\nimport { CardElement } from './card-element';\n\nexport interface PaymentSDKConfig {\n /** Public API key */\n apiKey: string;\n /** Backend API URL (optional, auto-detected from API key) */\n iframeUrl?: string;\n /** Request timeout in milliseconds (default: 30000) */\n timeout?: number;\n /** Locale for the UI. Defaults to 'en' */\n locale?: Locale;\n /** Enable debug logging (default: false, only allowed in local/dev environments) */\n debug?: boolean;\n}\n\nexport class PaymentSDK {\n private config: PaymentSDKConfig & { iframeUrl: string; timeout: number; debug: boolean; locale?: Locale };\n\n /**\n * Initialize the InflowPay Payment SDK\n * \n * @param config - SDK configuration\n * \n * @example\n * ```typescript\n * const sdk = new PaymentSDK({\n * apiKey: 'inflow_pub_local_xxx'\n * });\n * ```\n */\n constructor(config: PaymentSDKConfig) {\n // Validate API key\n if (!config.apiKey || typeof config.apiKey !== 'string') {\n throw new Error('API key is required');\n }\n\n // Auto-detect iframe URL from API key if not provided\n let iframeUrl = config.iframeUrl;\n const environment = this.getEnvironmentFromApiKey(config.apiKey);\n \n if (!iframeUrl) {\n if (environment === 'production') {\n iframeUrl = 'https://api.inflowpay.xyz/iframe/checkout';\n } else if (environment === 'preprod') {\n iframeUrl = 'https://pre-prod.api.inflowpay.xyz/iframe/checkout';\n } else if (environment === 'development') {\n iframeUrl = 'https://dev.api.inflowpay.com/iframe/checkout';\n } else {\n // sandbox/local\n iframeUrl = 'http://localhost:3000/iframe/checkout';\n }\n }\n\n // Validate debug mode - only allowed in local/dev environments\n const requestedDebug = config.debug ?? false;\n if (requestedDebug && (environment === 'production' || environment === 'preprod')) {\n console.warn('[InflowPay SDK] Debug mode is not allowed in production/pre-prod environments. Debug mode disabled.');\n }\n const debug = requestedDebug && (environment === 'sandbox' || environment === 'development');\n\n this.config = {\n apiKey: config.apiKey,\n iframeUrl,\n timeout: config.timeout ?? 30000,\n debug,\n locale: config.locale,\n };\n }\n\n /**\n * Create a CardElement for iframe-based payment UI\n * \n * @param options - CardElement configuration\n * @returns CardElement instance\n * \n * @example\n * ```typescript\n * const cardElement = sdk.createCardElement({\n * container: '#card-container',\n * paymentId: 'pay_123',\n * onComplete: (result) => {\n * if (result.status === 'CHECKOUT_SUCCESS') {\n * window.location.href = '/success';\n * }\n * }\n * });\n * \n * cardElement.mount();\n * ```\n */\n createCardElement(options: {\n container: string | HTMLElement;\n paymentId: string;\n style?: CSSProperties;\n buttonText?: string;\n placeholders?: {\n cardNumber?: string;\n expiry?: string;\n cvc?: string;\n };\n onComplete?: (result: { status: string; data?: any; error?: any }) => void;\n onError?: (error: any) => void;\n onClose?: () => void;\n }): CardElement {\n return new CardElement(this.config, options);\n }\n\n /**\n * Get the iframe URL being used\n */\n getIframeUrl(): string {\n return this.config.iframeUrl;\n }\n\n /**\n * Get the API key\n */\n getApiKey(): string {\n return this.config.apiKey;\n }\n\n /**\n * Auto-detect environment from API key\n */\n private getEnvironmentFromApiKey(apiKey: string): 'sandbox' | 'production' | 'development' | 'preprod' {\n if (apiKey.includes('_local_') || apiKey.startsWith('inflow_local_')) {\n return 'sandbox';\n } else if (apiKey.includes('_prod_') && !apiKey.includes('_preprod_')) {\n return 'production';\n } else if (apiKey.includes('_preprod_') || apiKey.startsWith('inflow_preprod_')) {\n return 'preprod';\n } else if (apiKey.includes('_dev_')) {\n return 'development';\n }\n return 'sandbox';\n }\n}\n\n"],"names":["SDK","config","url","iframeSrc","overlay","container","closeButton","e","currentStyle","iframeWidth","iframeMaxWidth","event","allowedOrigin","isAllowedOrigin","data","height","success","targetOrigin","message","isDarkMode","inputBgColor","shimmerBase","shimmerGradient","loader","containerWidth","skeletonCard","inputWrap","cardNumberSkeleton","expirySkeleton","cvcSkeleton","buttonSkeleton","disclaimerSkeleton","disclaimerIconSkeleton","disclaimerTextSkeleton","style","challengeUrl","resolve","modal","header","content","iframe","closeBtn","closeHandler","messageHandler","allowed3DSOrigins","is3DSComplete","isSuccess","isFailure","apiKey","SUPPORTED_LOCALES","detectBrowserLocale","primaryLang","CardElement","options","containerElement","error","PaymentSDK","iframeUrl","environment","requestedDebug","debug"],"mappings":"aASO,MAAMA,CAAI,CASf,YAAYC,EAAmB,CAS7B,GAjBF,KAAQ,OAAmC,KAG3C,KAAQ,gBAA0D,KAClE,KAAQ,iBAAuC,KAK7C,KAAK,OAASA,EACd,KAAK,UAAYA,EAAO,WAAa,wCACrC,KAAK,YAAc,KAAK,yBAAyBA,EAAO,QAAU,EAAE,EAGpE,KAAK,SAAW,CAACA,EAAO,UAGpBA,EAAO,UACT,GAAI,OAAOA,EAAO,WAAc,UAE9B,GADA,KAAK,iBAAmB,SAAS,cAAcA,EAAO,SAAS,EAC3D,CAAC,KAAK,iBACR,MAAM,IAAI,MAAM,wBAAwBA,EAAO,SAAS,EAAE,OAG5D,KAAK,iBAAmBA,EAAO,SAGrC,CAKA,MAAa,CACP,KAAK,SAIT,KAAK,aAAA,EACL,KAAK,mBAAA,EACP,CAKQ,cAAqB,CAE3B,MAAMC,EAAM,IAAI,IAAI,KAAK,SAAS,EAC9B,KAAK,OAAO,QACdA,EAAI,aAAa,IAAI,SAAU,KAAK,OAAO,MAAM,EAE/C,KAAK,OAAO,QAAQ,WACtBA,EAAI,aAAa,IAAI,YAAa,KAAK,OAAO,OAAO,SAAS,EAE5D,KAAK,OAAO,QACdA,EAAI,aAAa,IAAI,SAAU,KAAK,OAAO,MAAM,EAEnD,MAAMC,EAAYD,EAAI,SAAA,EAEtB,GAAI,KAAK,SAAU,CAEjB,MAAME,EAAU,SAAS,cAAc,KAAK,EAC5CA,EAAQ,GAAK,wBACbA,EAAQ,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAcxB,MAAMC,EAAY,SAAS,cAAc,KAAK,EAC9CA,EAAU,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAY1B,MAAMC,EAAc,SAAS,cAAc,QAAQ,EACnDA,EAAY,UAAY,IACxBA,EAAY,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAgB5BA,EAAY,QAAU,IAAM,KAAK,MAAA,EAGjC,KAAK,OAAS,SAAS,cAAc,QAAQ,EAC7C,KAAK,OAAO,IAAMH,EAClB,KAAK,OAAO,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA,QAM5B,KAAK,OAAO,aAAa,QAAS,SAAS,EAG3CE,EAAU,YAAYC,CAAW,EACjCD,EAAU,YAAY,KAAK,MAAM,EACjCD,EAAQ,YAAYC,CAAS,EAC7B,SAAS,KAAK,YAAYD,CAAO,EAGjC,KAAK,WAAWC,CAAS,EAGzBD,EAAQ,iBAAiB,QAAUG,GAAM,CACnCA,EAAE,SAAWH,GACf,KAAK,MAAA,CAET,CAAC,CACH,KAAO,CAEL,GAAI,CAAC,KAAK,iBACR,MAAM,IAAI,MAAM,+CAA+C,EAOjE,GAHA,KAAK,iBAAiB,UAAY,GAG9B,KAAK,4BAA4B,YAAa,CAChD,MAAMI,EAAe,KAAK,iBAAiB,aAAa,OAAO,GAAK,GAC/DA,EAAa,SAAS,YAAY,IACrC,KAAK,iBAAiB,MAAM,UAAY,SAErCA,EAAa,SAAS,UAAU,IACnC,KAAK,iBAAiB,MAAM,SAAW,YAEpCA,EAAa,SAAS,UAAU,IACnC,KAAK,iBAAiB,MAAM,SAAW,SAE3C,CAGA,KAAK,OAAS,SAAS,cAAc,QAAQ,EAC7C,KAAK,OAAO,IAAML,EAElB,MAAMM,EAAc,KAAK,OAAO,QAAQ,OAAO,WAAa,OAAS,QAC/DC,EAAiB,KAAK,OAAO,QAAQ,OAAO,WAAa,OAAS,OAExE,KAAK,OAAO,MAAM,QAAU;AAAA,iBACjBD,CAAW;AAAA,qBACPC,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAQ7B,KAAK,OAAO,aAAa,QAAS,SAAS,EAG3C,KAAK,iBAAiB,YAAY,KAAK,MAAM,EAG7C,KAAK,WAAW,KAAK,gBAAgB,CACvC,CACF,CAKQ,oBAA2B,CACjC,KAAK,gBAAmBC,GAAwB,CAC9C,MAAMC,EAAgB,IAAI,IAAI,KAAK,SAAS,EAAE,OAG9C,IAAIC,EAFiBF,EAAM,SAAWC,EAqBtC,GAjBKC,KACC,KAAK,cAAgB,WAAa,KAAK,cAAgB,iBAIzDA,GAFGF,EAAM,OAAO,SAAS,WAAW,GAAKA,EAAM,OAAO,SAAS,WAAW,KACvEC,EAAc,SAAS,WAAW,GAAKA,EAAc,SAAS,WAAW,IAIzEC,IAKHA,EAHEF,EAAM,SAAW,iCACjBA,EAAM,SAAW,sCACjBA,EAAM,SAAW,8BAKnB,CAACE,EAAiB,CAChB,KAAK,OAAO,OACd,QAAQ,KAAK,mDAAoDF,EAAM,MAAM,EAE/E,MACF,CAEA,MAAMG,EAAOH,EAAM,KAEnB,GAAI,GAACG,GAAQ,CAACA,EAAK,MAInB,OAAQA,EAAK,KAAA,CACX,IAAK,eAEH,KAAK,WAAA,EACL,KAAK,mBAAA,EACL,MAEF,IAAK,iBAEH,GAAIA,EAAK,QAAU,KAAK,OAAQ,CAC9B,MAAMC,EAAS,KAAK,IAAID,EAAK,OAAQ,GAAG,EACxC,KAAK,OAAO,MAAM,OAAS,GAAGC,CAAM,KAChC,KAAK,mBACP,KAAK,iBAAiB,MAAM,UAAY,GAAGA,CAAM,KAErD,CACA,MAEF,IAAK,QACH,KAAK,MAAA,EACL,MAEF,IAAK,UACC,KAAK,OAAO,WACd,KAAK,OAAO,UAAUD,EAAK,IAAI,EAEjC,MAEF,IAAK,QACC,KAAK,OAAO,SACd,KAAK,OAAO,QAAQA,EAAK,IAAI,EAE/B,MAEF,IAAK,eAEC,KAAK,OAAO,OACd,QAAQ,IAAI,8BAA+BA,EAAK,iBAAiB,EAE/DA,EAAK,mBACH,KAAK,OAAO,OACd,QAAQ,IAAI,4BAA4B,EAE1C,KAAK,aAAaA,EAAK,iBAAiB,EAAE,KAAME,GAAY,CAI1D,GAHI,KAAK,OAAO,OACd,QAAQ,IAAI,kCAAmCA,CAAO,EAEpD,KAAK,QAAU,KAAK,OAAO,cAAe,CAC5C,MAAMC,EAAe,KAAK,gBAAA,EAC1B,KAAK,OAAO,cAAc,YAAY,CACpC,KAAM,aACN,QAAAD,EACA,UAAWF,EAAK,WAAa,KAAK,OAAO,QAAQ,SAAA,EAChDG,CAAY,CACjB,CACF,CAAC,GAEG,KAAK,OAAO,OACd,QAAQ,MAAM,sDAAsD,EAGxE,MAEF,QACM,KAAK,OAAO,OACd,QAAQ,IAAI,yBAA0BH,CAAI,CAC5C,CAEN,EAEA,OAAO,iBAAiB,UAAW,KAAK,eAAe,CACzD,CAKQ,oBAA2B,CACjC,GAAI,CAAC,KAAK,QAAU,CAAC,KAAK,OAAO,cAAe,CAE1C,KAAK,SACP,KAAK,OAAO,OAAS,IAAM,CACzB,KAAK,mBAAA,CACP,GAEF,MACF,CAEA,MAAMI,EAAyB,CAC7B,KAAM,UACN,OAAQ,CACN,GAAI,KAAK,OAAO,QAAU,CAAA,EAC1B,UAAW,KAAK,OAAO,QAAQ,SAAA,EAEjC,KAAM,CACJ,OAAQ,KAAK,OAAO,MAAA,CACtB,EAGID,EAAe,KAAK,gBAAA,EAC1B,KAAK,OAAO,cAAc,YAAYC,EAASD,CAAY,CAC7D,CAKQ,WAAWZ,EAA8B,CAE3C,KAAK,SACP,KAAK,OAAO,MAAM,QAAU,QAI9B,MAAMc,EAAa,OAAO,YAAc,OAAO,WAAW,8BAA8B,EAAE,QAGpFC,EAAeD,EAAa,UAAY,UACxCE,EAAcF,EAAa,UAAY,UAEvCG,EAAkB,0BAA0BD,CAAW,SADxCF,EAAa,UAAY,SACoC,SAASE,CAAW,QAEhGE,EAAS,SAAS,cAAc,KAAK,EAC3CA,EAAO,GAAK,mBAGZ,MAAMC,EAAiB,KAAK,OAAO,QAAQ,OAAO,WAAa,OAAS,QAExED,EAAO,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBvB,MAAME,EAAe,SAAS,cAAc,KAAK,EACjDA,EAAa,MAAM,QAAU;AAAA,eAClBD,CAAc;AAAA;AAAA;AAAA;AAAA,MAOzB,MAAME,EAAY,SAAS,cAAc,KAAK,EAC9CA,EAAU,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA,0BAKJN,CAAY;AAAA;AAAA;AAAA;AAAA,MAOlC,MAAMO,EAAqB,SAAS,cAAc,KAAK,EACvDA,EAAmB,UAAY,qBAC/BA,EAAmB,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKnBL,CAAe;AAAA;AAAA;AAAA,MAM/B,MAAMM,EAAiB,SAAS,cAAc,KAAK,EACnDA,EAAe,UAAY,qBAC3BA,EAAe,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKfN,CAAe;AAAA;AAAA;AAAA,MAM/B,MAAMO,EAAc,SAAS,cAAc,KAAK,EAChDA,EAAY,UAAY,qBACxBA,EAAY,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKZP,CAAe;AAAA;AAAA;AAAA,MAK/BI,EAAU,YAAYC,CAAkB,EACxCD,EAAU,YAAYE,CAAc,EACpCF,EAAU,YAAYG,CAAW,EAGjC,MAAMC,EAAiB,SAAS,cAAc,KAAK,EACnDA,EAAe,UAAY,qBAC3BA,EAAe,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA,oBAIfR,CAAe;AAAA;AAAA;AAAA;AAAA,MAO/B,MAAMS,EAAqB,SAAS,cAAc,KAAK,EACvDA,EAAmB,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASnC,MAAMC,EAAyB,SAAS,cAAc,KAAK,EAC3DA,EAAuB,UAAY,qBACnCA,EAAuB,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA,oBAIvBV,CAAe;AAAA;AAAA;AAAA,MAK/B,MAAMW,EAAyB,SAAS,cAAc,KAAK,EAoB3D,GAnBAA,EAAuB,UAAY,qBACnCA,EAAuB,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA,oBAIvBX,CAAe;AAAA;AAAA;AAAA,MAK/BS,EAAmB,YAAYC,CAAsB,EACrDD,EAAmB,YAAYE,CAAsB,EAErDR,EAAa,YAAYC,CAAS,EAClCD,EAAa,YAAYK,CAAc,EACvCL,EAAa,YAAYM,CAAkB,EAC3CR,EAAO,YAAYE,CAAY,EAG3B,CAAC,SAAS,eAAe,yBAAyB,EAAG,CACvD,MAAMS,EAAQ,SAAS,cAAc,OAAO,EAC5CA,EAAM,GAAK,0BACXA,EAAM,YAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAUpB,SAAS,KAAK,YAAYA,CAAK,CACjC,CAEA7B,EAAU,YAAYkB,CAAM,CAC9B,CAKQ,YAAmB,CACzB,MAAMA,EAAS,SAAS,eAAe,kBAAkB,EACrDA,GACFA,EAAO,OAAA,EAIL,KAAK,SACP,KAAK,OAAO,MAAM,QAAU,GAEhC,CAKQ,OAAc,CAcpB,GAbI,KAAK,OAAO,SACd,KAAK,OAAO,QAAA,EAId,KAAK,WAAA,EAGD,KAAK,kBACP,OAAO,oBAAoB,UAAW,KAAK,eAAe,EAC1D,KAAK,gBAAkB,MAGrB,KAAK,SAAU,CAEjB,MAAMnB,EAAU,SAAS,eAAe,uBAAuB,EAC3DA,GACFA,EAAQ,OAAA,CAEZ,MAEM,KAAK,mBACP,KAAK,iBAAiB,UAAY,IAItC,KAAK,OAAS,IAChB,CAMQ,aAAa+B,EAAwC,CAC3D,OAAI,KAAK,OAAO,OACd,QAAQ,IAAI,sCAAuCA,CAAY,EAE1D,IAAI,QAASC,GAAY,CAE9B,MAAMhC,EAAU,SAAS,cAAc,KAAK,EAC5CA,EAAQ,GAAK,wBACbA,EAAQ,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAcxB,MAAMiC,EAAQ,SAAS,cAAc,KAAK,EAC1CA,EAAM,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QActB,MAAMC,EAAS,SAAS,cAAc,KAAK,EAC3CA,EAAO,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAOvBA,EAAO,UAAY;AAAA;AAAA;AAAA,QAMnB,MAAMC,EAAU,SAAS,cAAc,KAAK,EAC5CA,EAAQ,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA,QAKxB,MAAMC,EAAS,SAAS,cAAc,QAAQ,EAC9CA,EAAO,IAAML,EACbK,EAAO,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA,QAKvBA,EAAO,aAAa,QAAS,SAAS,EACtCA,EAAO,aAAa,UAAW,0DAA0D,EACzFD,EAAQ,YAAYC,CAAM,EAE1BH,EAAM,YAAYC,CAAM,EACxBD,EAAM,YAAYE,CAAO,EACzBnC,EAAQ,YAAYiC,CAAK,EACzB,SAAS,KAAK,YAAYjC,CAAO,EAGjC,MAAMqC,EAAWrC,EAAQ,cAAc,sBAAsB,EACvDsC,EAAe,IAAM,CACzBtC,EAAQ,OAAA,EACR,OAAO,oBAAoB,UAAWuC,CAAc,EACpDP,EAAQ,EAAK,CACf,EACAK,GAAU,iBAAiB,QAASC,CAAY,EAEhD,MAAMC,EAAkBhC,GAAwB,CAC9C,GAAI,CAACA,EAAM,KAAM,OAEjB,MAAMiC,EAAoB,CACxB,gCACA,qCACA,2BAAA,EAGF,GAAI,KAAK,cAAgB,WAAa,KAAK,cAAgB,eACzD,GAAI,EAAAjC,EAAM,OAAO,SAAS,WAAW,GAAKA,EAAM,OAAO,SAAS,WAAW,OAEhE,CAACiC,EAAkB,SAASjC,EAAM,MAAM,EAAG,CAChD,KAAK,OAAO,OACd,QAAQ,KAAK,uDAAwDA,EAAM,MAAM,EAEnF,MACF,WAEI,CAACiC,EAAkB,SAASjC,EAAM,MAAM,EAAG,CACzC,KAAK,OAAO,OACd,QAAQ,KAAK,uDAAwDA,EAAM,MAAM,EAEnF,MACF,CAGF,MAAMG,EAAOH,EAAM,KACbkC,EAAgB/B,EAAK,OAAS,qBAAuBA,EAAK,OAAS,eACnEgC,EAAYhC,EAAK,SAAW,UAC5BiC,EAAYjC,EAAK,SAAW,UAAYA,EAAK,SAAW,UAG9D,GAAI+B,GAAiBC,EAAW,CAC9B1C,EAAQ,OAAA,EACR,OAAO,oBAAoB,UAAWuC,CAAc,EACpDP,EAAQ,EAAI,EACZ,MACF,CAGA,GAAIU,GAAa,CAACD,EAAe,CAC/BzC,EAAQ,OAAA,EACR,OAAO,oBAAoB,UAAWuC,CAAc,EACpDP,EAAQ,EAAI,EACZ,MACF,CAGA,GAAKS,GAAiBE,GAAcjC,EAAK,OAAS,cAAgBiC,EAAW,CAC3E3C,EAAQ,OAAA,EACR,OAAO,oBAAoB,UAAWuC,CAAc,EACpDP,EAAQ,EAAK,EACb,MACF,CACF,EAEA,OAAO,iBAAiB,UAAWO,CAAc,CACnD,CAAC,CACH,CAOQ,iBAA0B,CAChC,OAAI,KAAK,cAAgB,cAAgB,KAAK,cAAgB,UACrD,IAAI,IAAI,KAAK,SAAS,EAAE,OAE1B,GACT,CAKQ,yBAAyBK,EAAsE,CAErG,MADI,CAACA,GACDA,EAAO,SAAS,SAAS,GAAKA,EAAO,WAAW,eAAe,EAC1D,UACEA,EAAO,SAAS,QAAQ,GAAK,CAACA,EAAO,SAAS,WAAW,EAC3D,aACEA,EAAO,SAAS,WAAW,GAAKA,EAAO,WAAW,iBAAiB,EACrE,UACEA,EAAO,SAAS,OAAO,EACzB,cAEF,SACT,CAKO,SAAgB,CACrB,KAAK,MAAA,CACP,CACF,CCnuBO,MAAMC,EAA8B,CAAC,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,IAAI,EAMnF,SAASC,GAA8B,CAC5C,GAAI,OAAO,OAAW,IACpB,MAAO,KAGT,GAAI,CAMF,MAAMC,GAJJ,UAAU,UACT,UAAwC,cACzC,IAE8B,MAAM,GAAG,EAAE,CAAC,EAAE,YAAA,EAE9C,GAAIF,EAAkB,SAASE,CAAqB,EAClD,OAAOA,CAEX,MAAQ,CAER,CAEA,MAAO,IACT,CCSO,MAAMC,CAAY,CAKvB,YACEnD,EACAoD,EACA,CALF,KAAQ,QAAmB,GAMzB,IAAIC,EACJ,GAAI,OAAOD,EAAQ,WAAc,UAE/B,GADAC,EAAmB,SAAS,cAAcD,EAAQ,SAAS,EACvD,CAACC,EACH,MAAM,IAAI,MAAM,wBAAwBD,EAAQ,SAAS,EAAE,OAG7DC,EAAmBD,EAAQ,UAE7B,KAAK,UAAYC,EAEjB,KAAK,IAAM,IAAItD,EAAI,CACjB,UAAWC,EAAO,UAClB,OAAQA,EAAO,OACf,UAAW,KAAK,UAChB,OAAQA,EAAO,QAAUiD,EAAA,EACzB,OAAQ,CACN,UAAWG,EAAQ,UACnB,GAAIA,EAAQ,OAAS,CAAE,MAAOA,EAAQ,KAAA,EACtC,GAAIA,EAAQ,YAAc,CAAE,WAAYA,EAAQ,UAAA,EAChD,GAAIA,EAAQ,cAAgB,CAAE,aAAcA,EAAQ,YAAA,CAAa,EAEnE,UAAYvC,GAAS,CACfuC,EAAQ,YACVA,EAAQ,WAAW,CACjB,OAAQvC,GAAM,MAAM,aAAa,QAAU,mBAC3C,KAAAA,CAAA,CACD,CAEL,EACA,QAAUyC,GAAU,CACdF,EAAQ,QACVA,EAAQ,QAAQE,CAAK,EACZF,EAAQ,YACjBA,EAAQ,WAAW,CACjB,OAAQ,iBACR,MAAAE,CAAA,CACD,CAEL,EACA,QAAS,IAAM,CACTF,EAAQ,SACVA,EAAQ,QAAA,CAEZ,CAAA,CACD,CACH,CAMA,OAAc,CACZ,GAAI,KAAK,QACP,MAAM,IAAI,MAAM,gCAAgC,EAGlD,KAAK,IAAI,KAAA,EACT,KAAK,QAAU,EACjB,CAKA,SAAgB,CACV,KAAK,UACP,KAAK,IAAI,QAAA,EACT,KAAK,QAAU,GAEnB,CACF,CClGO,MAAMG,CAAW,CAetB,YAAYvD,EAA0B,CAEpC,GAAI,CAACA,EAAO,QAAU,OAAOA,EAAO,QAAW,SAC7C,MAAM,IAAI,MAAM,qBAAqB,EAIvC,IAAIwD,EAAYxD,EAAO,UACvB,MAAMyD,EAAc,KAAK,yBAAyBzD,EAAO,MAAM,EAE1DwD,IACCC,IAAgB,aAClBD,EAAY,4CACHC,IAAgB,UACzBD,EAAY,qDACHC,IAAgB,cACzBD,EAAY,gDAGZA,EAAY,yCAKhB,MAAME,EAAiB1D,EAAO,OAAS,GACnC0D,IAAmBD,IAAgB,cAAgBA,IAAgB,YACrE,QAAQ,KAAK,qGAAqG,EAEpH,MAAME,EAAQD,IAAmBD,IAAgB,WAAaA,IAAgB,eAE9E,KAAK,OAAS,CACZ,OAAQzD,EAAO,OACf,UAAAwD,EACA,QAASxD,EAAO,SAAW,IAC3B,MAAA2D,EACA,OAAQ3D,EAAO,MAAA,CAEnB,CAuBA,kBAAkBoD,EAaF,CACd,OAAO,IAAID,EAAY,KAAK,OAAQC,CAAO,CAC7C,CAKA,cAAuB,CACrB,OAAO,KAAK,OAAO,SACrB,CAKA,WAAoB,CAClB,OAAO,KAAK,OAAO,MACrB,CAKQ,yBAAyBL,EAAsE,CACrG,OAAIA,EAAO,SAAS,SAAS,GAAKA,EAAO,WAAW,eAAe,EAC1D,UACEA,EAAO,SAAS,QAAQ,GAAK,CAACA,EAAO,SAAS,WAAW,EAC3D,aACEA,EAAO,SAAS,WAAW,GAAKA,EAAO,WAAW,iBAAiB,EACrE,UACEA,EAAO,SAAS,OAAO,EACzB,cAEF,SACT,CACF"}
|