@odus/checkout 0.8.0 → 0.10.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.
@@ -1,40 +1,40 @@
1
- const N = (n) => n === "test" ? "https://sandbox-api.odus.com" : n === "live" ? "https://api.odus.com" : "http://localhost:3000";
2
- class O {
1
+ const N = () => "http://localhost:3000";
2
+ class H {
3
3
  apiKey;
4
4
  baseUrl;
5
5
  browserInfo;
6
- constructor(e, t, i) {
7
- this.apiKey = e, this.baseUrl = N(t), this.browserInfo = i || { userAgent: navigator.userAgent };
6
+ constructor(e, t, a) {
7
+ this.apiKey = e, this.baseUrl = N(), this.browserInfo = a || { userAgent: navigator.userAgent };
8
8
  }
9
9
  async fetchApi({
10
10
  endpoint: e,
11
11
  method: t = "POST",
12
- body: i,
13
- customHeaders: a = {}
12
+ body: a,
13
+ customHeaders: i = {}
14
14
  }) {
15
15
  const r = {
16
16
  Authorization: `Bearer ${this.apiKey}`,
17
17
  "Content-Type": "application/json",
18
- ...a
18
+ ...i
19
19
  };
20
20
  try {
21
21
  const s = await fetch(`${this.baseUrl}${e}`, {
22
22
  method: t,
23
23
  headers: r,
24
- body: i ? JSON.stringify(i) : void 0
24
+ body: a ? JSON.stringify(a) : void 0
25
25
  });
26
26
  if (!s.ok) {
27
- let o;
27
+ let n;
28
28
  try {
29
- o = await s.json();
29
+ n = await s.json();
30
30
  } catch (c) {
31
31
  console.log("error", c);
32
32
  }
33
33
  throw {
34
- message: o?.message[0] || `API request failed: ${s.status} ${s.statusText}`,
34
+ message: n?.message[0] || `API request failed: ${s.status} ${s.statusText}`,
35
35
  status: s.status,
36
36
  statusText: s.statusText,
37
- details: o
37
+ details: n
38
38
  };
39
39
  }
40
40
  return s.json();
@@ -51,26 +51,26 @@ class O {
51
51
  async authorizePayment({
52
52
  paymentId: e,
53
53
  checkoutKey: t,
54
- formData: i,
55
- token: a,
54
+ formData: a,
55
+ token: i,
56
56
  returnUrl: r
57
57
  }) {
58
58
  let s = {};
59
- if (a && i) {
60
- const o = i.cardExpiry.replace(/\s+/g, "").split("/"), l = o[0], c = o[1];
59
+ if (i && a) {
60
+ const n = a.cardExpiry.replace(/\s+/g, "").split("/"), l = n[0], c = n[1];
61
61
  s = {
62
62
  paymentMethodData: {
63
63
  type: "card",
64
64
  card: {
65
- token: a,
65
+ token: i,
66
66
  expMonth: l,
67
67
  expYear: `20${c}`,
68
- cardholderName: i.name
68
+ cardholderName: a.name
69
69
  }
70
70
  },
71
71
  customerData: {
72
- email: i.email,
73
- name: i.name
72
+ email: a.email,
73
+ name: a.name
74
74
  },
75
75
  context: {
76
76
  returnUrl: r,
@@ -90,27 +90,28 @@ class O {
90
90
  return await this.fetchApi({
91
91
  endpoint: `/payments/${e}/authorize`,
92
92
  customHeaders: {
93
- Authorization: `Bearer ${t}`
93
+ Authorization: `Bearer ${t}`,
94
+ "X-Idempotency-Key": e
94
95
  },
95
96
  body: s
96
97
  });
97
98
  }
98
99
  }
99
- const q = async ({
100
- id: n,
100
+ const O = async ({
101
+ id: o,
101
102
  apiKey: e,
102
103
  environment: t
103
104
  }) => {
104
- const i = N(t), a = await fetch(`${i}/checkout-profiles/${n}`, {
105
+ const a = N(), i = await fetch(`${a}/checkout-profiles/${o}`, {
105
106
  method: "GET",
106
107
  headers: {
107
108
  "Content-Type": "application/json",
108
109
  Authorization: `Bearer ${e}`
109
110
  }
110
111
  });
111
- if (!a.ok)
112
- throw new Error(`HTTP error! Status: ${a.status}`);
113
- return await a.json();
112
+ if (!i.ok)
113
+ throw new Error(`HTTP error! Status: ${i.status}`);
114
+ return await i.json();
114
115
  };
115
116
  class K {
116
117
  events = /* @__PURE__ */ new Map();
@@ -122,8 +123,8 @@ class K {
122
123
  */
123
124
  subscribe(e, t) {
124
125
  return this.events.has(e) || this.events.set(e, /* @__PURE__ */ new Set()), this.events.get(e)?.add(t), () => {
125
- const i = this.events.get(e);
126
- i && (i.delete(t), i.size === 0 && this.events.delete(e));
126
+ const a = this.events.get(e);
127
+ a && (a.delete(t), a.size === 0 && this.events.delete(e));
127
128
  };
128
129
  }
129
130
  /**
@@ -132,8 +133,8 @@ class K {
132
133
  * @param data - The data to pass to subscribers
133
134
  */
134
135
  publish(e, t) {
135
- const i = this.events.get(e);
136
- i && i.forEach((a) => a(t));
136
+ const a = this.events.get(e);
137
+ a && a.forEach((i) => i(t));
137
138
  }
138
139
  /**
139
140
  * Clear all event subscriptions
@@ -150,13 +151,13 @@ class K {
150
151
  return this.events.get(e)?.size || 0;
151
152
  }
152
153
  }
153
- const j = new K();
154
- class U {
154
+ const q = new K();
155
+ class j {
155
156
  state;
156
157
  initialState;
157
158
  eventBus;
158
159
  stateChangedEvent = "state-changed";
159
- constructor(e, t = j) {
160
+ constructor(e, t = q) {
160
161
  this.initialState = { ...e }, this.state = { ...e }, this.eventBus = t;
161
162
  }
162
163
  /**
@@ -196,51 +197,51 @@ class U {
196
197
  return this.state[e];
197
198
  }
198
199
  }
199
- function k(n) {
200
- return new U(n);
200
+ function T(o) {
201
+ return new j(o);
201
202
  }
202
- function _({
203
- apiKey: n,
203
+ function U({
204
+ apiKey: o,
204
205
  profileId: e,
205
206
  environment: t
206
207
  }) {
207
- const i = k({
208
+ const a = T({
208
209
  checkoutProfile: void 0,
209
210
  isLoading: !0,
210
211
  error: null
211
- }), a = async () => {
212
+ }), i = async () => {
212
213
  try {
213
- i.setState({ isLoading: !0 });
214
- const r = await q({
215
- apiKey: n,
214
+ a.setState({ isLoading: !0 });
215
+ const r = await O({
216
+ apiKey: o,
216
217
  id: e,
217
218
  environment: t
218
219
  });
219
- r && i.setState({
220
+ r && a.setState({
220
221
  checkoutProfile: r,
221
222
  isLoading: !1,
222
223
  error: null
223
224
  });
224
225
  } catch (r) {
225
- i.setState({
226
+ a.setState({
226
227
  error: "Failed to load checkout profile",
227
228
  isLoading: !1
228
229
  }), console.error(r);
229
230
  }
230
231
  };
231
- return a(), {
232
- getState: i.getState.bind(i),
233
- subscribe: i.subscribe.bind(i),
234
- reload: a
232
+ return i(), {
233
+ getState: a.getState.bind(a),
234
+ subscribe: a.subscribe.bind(a),
235
+ reload: i
235
236
  };
236
237
  }
237
- const z = {
238
- cardNumber: (n) => (n.replace(/\s/g, "").match(/.{1,4}/g) || []).join(" "),
239
- cardExpiry: (n) => {
240
- const t = n.replace(/\D/g, "").slice(0, 4);
238
+ const D = {
239
+ cardNumber: (o) => (o.replace(/\s/g, "").match(/.{1,4}/g) || []).join(" "),
240
+ cardExpiry: (o) => {
241
+ const t = o.replace(/\D/g, "").slice(0, 4);
241
242
  return t.length > 2 ? `${t.slice(0, 2)} / ${t.slice(2, 4)}` : t;
242
243
  }
243
- }, R = {
244
+ }, $ = {
244
245
  "gmail.com": [
245
246
  "gmal.com",
246
247
  "gmil.com",
@@ -312,98 +313,98 @@ const z = {
312
313
  "comcast.net": ["comcast.com", "comcat.net", "comcst.net", "comcastnet", "comcast.nt", "comcas.net"],
313
314
  "verizon.net": ["verizon.com", "verizon.nt", "verizonnet", "verizn.net", "verizon.ne", "verzon.net"],
314
315
  "att.net": ["att.com", "at.net", "att.nt", "attnet", "att.ne", "attt.net"]
315
- }, G = (n) => {
316
- if (!n || n.includes("."))
316
+ }, _ = (o) => {
317
+ if (!o || o.includes("."))
317
318
  return null;
318
319
  const e = ["com", "net", "org", "edu", "gov", "io", "co"];
319
320
  for (const t of e) {
320
- if (n === "companycok" && t === "co")
321
+ if (o === "companycok" && t === "co")
321
322
  return "company.co";
322
- if (n.endsWith(t) && !n.includes(".")) {
323
- const i = n.length - t.length;
324
- return `${n.substring(0, i)}.${t}`;
323
+ if (o.endsWith(t) && !o.includes(".")) {
324
+ const a = o.length - t.length;
325
+ return `${o.substring(0, a)}.${t}`;
325
326
  }
326
327
  }
327
328
  return null;
328
- }, Y = (n, e) => {
329
- if (n.length === 0) return e.length;
330
- if (e.length === 0) return n.length;
331
- const t = e.length + 1, i = n.length + 1, a = Array.from(
329
+ }, G = (o, e) => {
330
+ if (o.length === 0) return e.length;
331
+ if (e.length === 0) return o.length;
332
+ const t = e.length + 1, a = o.length + 1, i = Array.from(
332
333
  { length: t },
333
- (r, s) => Array.from({ length: i }, (o, l) => s === 0 ? l : l === 0 ? s : 0)
334
+ (r, s) => Array.from({ length: a }, (n, l) => s === 0 ? l : l === 0 ? s : 0)
334
335
  );
335
336
  for (let r = 1; r < t; r++)
336
- for (let s = 1; s < i; s++) {
337
- const o = n[s - 1] === e[r - 1] ? 0 : 1;
338
- a[r][s] = Math.min(
339
- a[r - 1][s] + 1,
337
+ for (let s = 1; s < a; s++) {
338
+ const n = o[s - 1] === e[r - 1] ? 0 : 1;
339
+ i[r][s] = Math.min(
340
+ i[r - 1][s] + 1,
340
341
  // deletion
341
- a[r][s - 1] + 1,
342
+ i[r][s - 1] + 1,
342
343
  // insertion
343
- a[r - 1][s - 1] + o
344
+ i[r - 1][s - 1] + n
344
345
  // substitution
345
346
  );
346
347
  }
347
- return a[e.length][n.length];
348
- }, Z = (n) => {
349
- let t = null, i = 3;
350
- const a = n.toLowerCase();
351
- for (const r of Object.keys(R)) {
352
- const s = Y(a, r);
353
- s <= 2 && s < i && (i = s, t = r);
348
+ return i[e.length][o.length];
349
+ }, Y = (o) => {
350
+ let t = null, a = 3;
351
+ const i = o.toLowerCase();
352
+ for (const r of Object.keys($)) {
353
+ const s = G(i, r);
354
+ s <= 2 && s < a && (a = s, t = r);
354
355
  }
355
356
  return t;
356
- }, J = () => {
357
- const { t: n } = P();
357
+ }, Z = () => {
358
+ const { t: o } = P();
358
359
  return {
359
360
  validateEmail: (t) => {
360
- const i = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
361
+ const a = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
361
362
  if (!t)
362
363
  return {
363
364
  isValid: !1,
364
- message: n("validation.emailInvalid"),
365
+ message: o("validation.emailInvalid"),
365
366
  suggestion: null
366
367
  };
367
- const a = t.indexOf("@");
368
- if (a === -1)
368
+ const i = t.indexOf("@");
369
+ if (i === -1)
369
370
  return {
370
371
  isValid: !1,
371
- message: n("validation.emailInvalid"),
372
+ message: o("validation.emailInvalid"),
372
373
  suggestion: null
373
374
  };
374
- const r = t.substring(0, a), s = t.substring(a + 1);
375
+ const r = t.substring(0, i), s = t.substring(i + 1);
375
376
  if (!s.includes(".")) {
376
- const l = G(s);
377
+ const l = _(s);
377
378
  if (l)
378
379
  return {
379
380
  isValid: !1,
380
- message: n("validation.emailSuggestion", {
381
+ message: o("validation.emailSuggestion", {
381
382
  email: `${r}@${l}`
382
383
  }),
383
384
  suggestion: `${r}@${l}`
384
385
  };
385
- for (const c of Object.keys(R))
386
+ for (const c of Object.keys($))
386
387
  if (c.replace(/\./g, "") === s)
387
388
  return {
388
389
  isValid: !1,
389
- message: n("validation.emailSuggestion", {
390
+ message: o("validation.emailSuggestion", {
390
391
  email: `${r}@${c}`
391
392
  }),
392
393
  suggestion: `${r}@${c}`
393
394
  };
394
395
  }
395
- if (!i.test(t))
396
+ if (!a.test(t))
396
397
  return {
397
398
  isValid: !1,
398
- message: n("validation.emailInvalid"),
399
+ message: o("validation.emailInvalid"),
399
400
  suggestion: null
400
401
  };
401
- const o = Z(s);
402
- if (o && o !== s) {
403
- const l = `${r}@${o}`;
402
+ const n = Y(s);
403
+ if (n && n !== s) {
404
+ const l = `${r}@${n}`;
404
405
  return {
405
406
  isValid: !1,
406
- message: n("validation.emailSuggestion", { email: l }),
407
+ message: o("validation.emailSuggestion", { email: l }),
407
408
  suggestion: l
408
409
  };
409
410
  }
@@ -414,30 +415,30 @@ const z = {
414
415
  };
415
416
  }
416
417
  };
417
- }, W = () => {
418
- const { t: n } = P(), { validateEmail: e } = J();
418
+ }, J = () => {
419
+ const { t: o } = P(), { validateEmail: e } = Z();
419
420
  return {
420
421
  email: (t) => {
421
- const i = e(t);
422
- return i.isValid ? void 0 : i.message;
422
+ const a = e(t);
423
+ return a.isValid ? void 0 : a.message;
423
424
  },
424
425
  name: (t) => {
425
426
  if (!t.trim())
426
- return n("validation.nameRequired");
427
+ return o("validation.nameRequired");
427
428
  },
428
429
  cardExpiry: (t) => {
429
- const i = t.replace(/\s/g, ""), [a, r] = i.split("/").map((u) => u.trim());
430
- if (!a || !r || a.length !== 2 || r.length !== 2)
431
- return n("validation.cardExpiryFormat");
432
- const s = /* @__PURE__ */ new Date(), o = s.getFullYear() % 100, l = s.getMonth() + 1, c = parseInt(a, 10), d = parseInt(r, 10);
430
+ const a = t.replace(/\s/g, ""), [i, r] = a.split("/").map((p) => p.trim());
431
+ if (!i || !r || i.length !== 2 || r.length !== 2)
432
+ return o("validation.cardExpiryFormat");
433
+ const s = /* @__PURE__ */ new Date(), n = s.getFullYear() % 100, l = s.getMonth() + 1, c = parseInt(i, 10), d = parseInt(r, 10);
433
434
  if (c < 1 || c > 12)
434
- return n("validation.cardExpiryFormat");
435
- if (d < o || d === o && c < l)
436
- return n("validation.cardExpiryInvalid");
435
+ return o("validation.cardExpiryFormat");
436
+ if (d < n || d === n && c < l)
437
+ return o("validation.cardExpiryInvalid");
437
438
  }
438
439
  };
439
- }, X = () => {
440
- const n = W(), e = k({
440
+ }, W = () => {
441
+ const o = J(), e = T({
441
442
  formData: {
442
443
  name: "",
443
444
  email: "",
@@ -451,51 +452,51 @@ const z = {
451
452
  },
452
453
  isValid: !1
453
454
  }), t = (l, c) => {
454
- const d = n[l];
455
+ const d = o[l];
455
456
  return d?.(c);
456
- }, i = (l) => {
457
+ }, a = (l) => {
457
458
  const c = {};
458
459
  return Object.keys(l).forEach((d) => {
459
- const u = t(d, l[d]);
460
- u && (c[d] = u);
460
+ const p = t(d, l[d]);
461
+ p && (c[d] = p);
461
462
  }), c;
462
- }, a = (l) => {
463
- const c = i(l);
463
+ }, i = (l) => {
464
+ const c = a(l);
464
465
  return Object.keys(c).length === 0;
465
466
  }, r = (l, c) => {
466
467
  const d = e.getState();
467
- let u = c;
468
- l in z && (u = z[l](c));
469
- const f = {
468
+ let p = c;
469
+ l in D && (p = D[l](c));
470
+ const g = {
470
471
  ...d.formData,
471
- [l]: u
472
- }, g = { ...d.errors };
472
+ [l]: p
473
+ }, y = { ...d.errors };
473
474
  if (d.touched[l]) {
474
- const x = t(l, u);
475
- x ? g[l] = x : delete g[l];
475
+ const F = t(l, p);
476
+ F ? y[l] = F : delete y[l];
476
477
  }
477
478
  e.setState({
478
- formData: f,
479
- errors: g,
480
- isValid: a(f)
479
+ formData: g,
480
+ errors: y,
481
+ isValid: i(g)
481
482
  });
482
483
  }, s = (l, c) => {
483
- const d = e.getState(), u = {
484
+ const d = e.getState(), p = {
484
485
  ...d.touched,
485
486
  [l]: !0
486
- }, f = t(l, c), g = { ...d.errors };
487
- f ? g[l] = f : delete g[l], e.setState({
488
- touched: u,
489
- errors: g
487
+ }, g = t(l, c), y = { ...d.errors };
488
+ g ? y[l] = g : delete y[l], e.setState({
489
+ touched: p,
490
+ errors: y
490
491
  });
491
- }, o = (l) => {
492
+ }, n = (l) => {
492
493
  const d = {
493
494
  ...e.getState().formData,
494
495
  ...l
495
496
  };
496
497
  e.setState({
497
498
  formData: d,
498
- isValid: a(d)
499
+ isValid: i(d)
499
500
  });
500
501
  };
501
502
  return {
@@ -503,35 +504,35 @@ const z = {
503
504
  subscribe: e.subscribe.bind(e),
504
505
  handleChange: r,
505
506
  handleBlur: s,
506
- setFormData: o,
507
+ setFormData: n,
507
508
  reset: e.resetState.bind(e)
508
509
  };
509
- }, Q = async ({
510
- props: n,
510
+ }, X = async ({
511
+ props: o,
511
512
  apiKey: e,
512
513
  environment: t
513
514
  }) => {
514
- const i = N(t), a = await fetch(`${i}/checkout/init`, {
515
+ const a = N(), i = await fetch(`${a}/checkout/init`, {
515
516
  method: "POST",
516
517
  headers: {
517
518
  "Content-Type": "application/json",
518
519
  Authorization: `Bearer ${e}`
519
520
  },
520
- body: JSON.stringify(n)
521
+ body: JSON.stringify(o)
521
522
  });
522
- if (!a.ok)
523
- throw new Error(`HTTP error! Status: ${a.status}`);
524
- return await a.json();
523
+ if (!i.ok)
524
+ throw new Error(`HTTP error! Status: ${i.status}`);
525
+ return await i.json();
525
526
  };
526
- function ee({
527
- apiKey: n,
527
+ function Q({
528
+ apiKey: o,
528
529
  checkoutProfile: e,
529
530
  inputStyles: t,
530
- setFormData: i,
531
- environment: a,
531
+ setFormData: a,
532
+ environment: i,
532
533
  paymentId: r
533
534
  }) {
534
- const s = k({
535
+ const s = T({
535
536
  iframeConfig: void 0,
536
537
  loadingIframe: !0,
537
538
  isCcValid: !1,
@@ -540,38 +541,38 @@ function ee({
540
541
  isCvvFocused: !1,
541
542
  possibleCardType: "unknown"
542
543
  });
543
- let o = null;
544
+ let n = null;
544
545
  const l = async () => {
545
546
  try {
546
- const m = await Q({
547
+ const u = await X({
547
548
  props: {
548
549
  payment: r
549
550
  },
550
- apiKey: n,
551
- environment: a
551
+ apiKey: o,
552
+ environment: i
552
553
  });
553
- m && (s.setState({
554
+ u && (s.setState({
554
555
  iframeConfig: {
555
- ...m,
556
+ ...u,
556
557
  origin: globalThis.location.origin
557
558
  }
558
559
  }), d());
559
- } catch (m) {
560
- console.error("Failed to generate iframe config:", m);
560
+ } catch (u) {
561
+ console.error("Failed to generate iframe config:", u);
561
562
  }
562
563
  }, c = () => {
563
- const m = s.getState();
564
- if (!m.iframeConfig || !e) {
564
+ const u = s.getState();
565
+ if (!u.iframeConfig || !e) {
565
566
  console.error(
566
567
  "[IframeConfig] Missing iframe config or checkout profile."
567
568
  );
568
569
  return;
569
570
  }
570
- const C = document.getElementById("card-element"), w = document.getElementById("card-cvv-element");
571
- if (!C || !w)
571
+ const b = document.getElementById("card-element"), k = document.getElementById("card-cvv-element");
572
+ if (!b || !k)
572
573
  throw new Error("Card elements not found in DOM");
573
- o = new globalThis.TokenEx.Iframe("card-element", {
574
- ...m.iframeConfig,
574
+ n = new globalThis.TokenEx.Iframe("card-element", {
575
+ ...u.iframeConfig,
575
576
  placeholder: "1234 1234 1234 1234",
576
577
  cvvPlaceholder: "CVC",
577
578
  cvv: !0,
@@ -594,34 +595,34 @@ function ee({
594
595
  base: `${t.base}; border-radius: 0px 0px ${e.styles.borderRadius}px 0px`
595
596
  }
596
597
  }
597
- }), o.on("load", () => {
598
+ }), n.on("load", () => {
598
599
  s.setState({ loadingIframe: !1 });
599
- }), o.on("autoCompleteValues", function(y) {
600
- const { nameOnCard: M, cardExp: b } = y;
601
- i({
602
- name: M,
603
- cardExpiry: b
600
+ }), n.on("autoCompleteValues", function(v) {
601
+ const { nameOnCard: w, cardExp: S } = v;
602
+ a({
603
+ name: w,
604
+ cardExpiry: S
604
605
  });
605
- }), o.on("validate", function(y) {
606
- const { isValid: M, isCvvValid: b } = y;
606
+ }), n.on("validate", function(v) {
607
+ const { isValid: w, isCvvValid: S } = v;
607
608
  s.setState({
608
- isCcValid: M,
609
- isCvvValid: b
609
+ isCcValid: w,
610
+ isCvvValid: S
610
611
  });
611
- }), o.on("focus", function() {
612
+ }), n.on("focus", function() {
612
613
  s.setState({ isFocused: !0 });
613
- }), o.on("blur", function() {
614
+ }), n.on("blur", function() {
614
615
  s.setState({ isFocused: !1 });
615
- }), o.on("cvvFocus", function() {
616
+ }), n.on("cvvFocus", function() {
616
617
  s.setState({ isCvvFocused: !0 });
617
- }), o.on("cvvBlur", function() {
618
+ }), n.on("cvvBlur", function() {
618
619
  s.setState({ isCvvFocused: !1 });
619
- }), o.on(
620
+ }), n.on(
620
621
  "cardTypeChange",
621
- function({ possibleCardType: y }) {
622
- s.setState({ possibleCardType: y });
622
+ function({ possibleCardType: v }) {
623
+ s.setState({ possibleCardType: v });
623
624
  }
624
- ), o.load();
625
+ ), n.load();
625
626
  }, d = () => {
626
627
  if (!s.getState().iframeConfig || !e) {
627
628
  console.error(
@@ -635,126 +636,134 @@ function ee({
635
636
  }
636
637
  try {
637
638
  c();
638
- } catch (C) {
639
- console.error("Failed to create TokenEx iframe:", C);
639
+ } catch (b) {
640
+ console.error("Failed to create TokenEx iframe:", b);
640
641
  }
641
- }, u = async () => {
642
- n && await l();
643
- }, f = () => {
644
- o && (o.remove(), o = null);
645
- }, g = async (m) => {
646
- o && (o.on("tokenize", async function(C) {
647
- await m(C);
648
- }), o.tokenize());
649
- }, x = () => {
650
- if (o)
642
+ }, p = async () => {
643
+ o && await l();
644
+ }, g = () => {
645
+ n && (n.remove(), n = null);
646
+ }, y = async (u) => {
647
+ n && (n.on("tokenize", async function(b) {
648
+ await u(b);
649
+ }), n.tokenize());
650
+ }, F = () => {
651
+ if (n)
651
652
  try {
652
- o.focus();
653
- } catch (m) {
654
- console.error("Failed to focus card number iframe:", m);
653
+ n.focus();
654
+ } catch (u) {
655
+ console.error("Failed to focus card number iframe:", u);
655
656
  }
656
657
  }, I = () => {
657
- if (o)
658
+ if (n)
658
659
  try {
659
- o.cvvFocus();
660
- } catch (m) {
661
- console.error("Failed to focus CVV iframe:", m);
660
+ n.cvvFocus();
661
+ } catch (u) {
662
+ console.error("Failed to focus CVV iframe:", u);
662
663
  }
663
664
  };
664
665
  return {
665
666
  getState: s.getState.bind(s),
666
667
  subscribe: s.subscribe.bind(s),
667
- tokenize: g,
668
- cleanup: f,
669
- initialize: u,
670
- focusCardNumber: x,
668
+ tokenize: y,
669
+ cleanup: g,
670
+ initialize: p,
671
+ focusCardNumber: F,
671
672
  focusCvv: I
672
673
  };
673
674
  }
674
- const te = "E-Mail", ie = "Name des/der Karteninhaber/in", ae = "Kartendaten", re = "Vollständiger Name", se = "MM / JJ", oe = "Das Fenster nicht schließen", ne = { pay: "ZAHLEN", submit: "ABSENDEN", getPlan: "MEINEN PLAN ERHALTEN", donate: "spenden", book: "jetzt buchen", order: "jetzt bestellen" }, le = { emailSuggestion: "Meinten Sie {{email}}?", emailInvalid: "Ihre E-Mail-Adresse ist nicht korrekt", cardExpiryInvalid: "Das Ablaufdatum Ihrer Karte liegt in der Vergangenheit", cardExpiryFormat: "Das Ablaufdatum Ihrer Karte ist unvollständig", cardSecurityFormat: "Der Sicherheitscode Ihrer Karte ist unvollständig", nameRequired: "Gib deinen Namen genau so ein, wie er auf deiner Karte steht", cardNumberInvalid: "Die Kartennummer ist unvollständig" }, ce = {
675
- email: te,
676
- cardholderNameLabel: ie,
675
+ const ee = "E-Mail", te = "Name des/der Karteninhaber/in", ae = "Kartendaten", ie = "Vollständiger Name", re = "MM / JJ", se = "Das Fenster nicht schließen", ne = { pay: "ZAHLEN", submit: "ABSENDEN", getPlan: "MEINEN PLAN ERHALTEN", donate: "spenden", book: "jetzt buchen", order: "jetzt bestellen" }, oe = { emailSuggestion: "Meinten Sie {{email}}?", emailInvalid: "Ihre E-Mail-Adresse ist nicht korrekt", cardExpiryInvalid: "Das Ablaufdatum Ihrer Karte liegt in der Vergangenheit", cardExpiryFormat: "Das Ablaufdatum Ihrer Karte ist unvollständig", cardSecurityFormat: "Der Sicherheitscode Ihrer Karte ist unvollständig", nameRequired: "Gib deinen Namen genau so ein, wie er auf deiner Karte steht", cardNumberInvalid: "Die Kartennummer ist unvollständig" }, le = {
676
+ email: ee,
677
+ cardholderNameLabel: te,
677
678
  cardInformation: ae,
678
- cardholderNamePlaceholder: re,
679
- cardExpiry: se,
680
- loading: oe,
679
+ cardholderNamePlaceholder: ie,
680
+ cardExpiry: re,
681
+ loading: se,
682
+ "pay-with-card": "oder mit Karte bezahlen",
681
683
  buttonTexts: ne,
682
- validation: le
683
- }, de = "Email", he = "Cardholder name", me = "Card information", ue = "Full name on card", pe = "MM / YY", fe = "Do not close the window", ge = { pay: "PAY", submit: "SUBMIT", getPlan: "GET MY PLAN", donate: "DONATE", book: "BOOK NOW", order: "ORDER NOW" }, ye = { emailSuggestion: "Did you mean {{email}}?", emailInvalid: "Your email is not correct", cardExpiryInvalid: "Your card's expiration date is in the past", cardExpiryFormat: "Your card’s expiration date is incomplete", cardSecurityFormat: "Your card’s security code is incomplete", nameRequired: "Please enter the name as it appears on your card", cardNumberInvalid: "Your card number is invalid" }, ve = {
684
- email: de,
685
- cardholderNameLabel: he,
686
- cardInformation: me,
687
- cardholderNamePlaceholder: ue,
688
- cardExpiry: pe,
689
- loading: fe,
690
- buttonTexts: ge,
691
- validation: ye
692
- }, Ee = "Correo electrónico", Ce = "Nombre del titular de la tarjeta", be = "Información de la tarjeta", Se = "Nombre completo en la tarjeta", xe = "MM / AA", Fe = "Por favor, no cierre esta ventana", we = { pay: "PAGAR", submit: "ENVIAR", getPlan: "OBTENER MI PLAN", donate: "DONAR", book: "RESERVAR AHORA", order: "ORDENAR AHORA" }, Me = { emailSuggestion: "¿Quisiste decir {{email}}?", emailInvalid: "Su correo electrónico no es válido", cardExpiryInvalid: "La fecha de vencimiento de la tarjeta ya pasó", cardExpiryFormat: "La fecha de vencimiento de su tarjeta está incompleta", cardSecurityFormat: "El código de seguridad de su tarjeta está incompleto", nameRequired: "Por favor, ingrese el nombre tal como aparece en su tarjeta", cardNumberInvalid: "Su número de tarjeta no es válido" }, Le = {
693
- email: Ee,
694
- cardholderNameLabel: Ce,
695
- cardInformation: be,
696
- cardholderNamePlaceholder: Se,
697
- cardExpiry: xe,
698
- loading: Fe,
699
- buttonTexts: we,
700
- validation: Me
701
- }, Te = "E-mail", ke = "Nom du titulaire de la carte", Ie = "Informations de la carte", Ne = "Nom complet figurant sur la carte", Pe = "MM / AA", Ve = "Veuillez ne pas fermer cette fenêtre", ze = { pay: "PAYER", submit: "ENVOYER", getPlan: "OBTENIR MON PLAN", donate: "FAIRE UN DON", book: "RÉSERVER MAINTENANT", order: "COMMANDER MAINTENANT" }, Ae = { emailSuggestion: "Vouliez-vous dire {{email}}?", emailInvalid: "Votre adresse e-mail n’est pas valide", cardExpiryInvalid: "La date d'expiration de votre carte est dans le passé", cardExpiryFormat: "La date d’expiration de votre carte est incomplète", cardSecurityFormat: "Le code de sécurité de votre carte est incomplet", nameRequired: "Veuillez saisir le nom tel qu’il figure sur votre carte", cardNumberInvalid: "Votre numéro de carte est invalide" }, De = {
702
- email: Te,
703
- cardholderNameLabel: ke,
704
- cardInformation: Ie,
705
- cardholderNamePlaceholder: Ne,
706
- cardExpiry: Pe,
707
- loading: Ve,
684
+ validation: oe
685
+ }, ce = "Email", de = "Cardholder name", he = "Card information", me = "Full name on card", ue = "MM / YY", pe = "Do not close the window", fe = { pay: "PAY", submit: "SUBMIT", getPlan: "GET MY PLAN", donate: "DONATE", book: "BOOK NOW", order: "ORDER NOW" }, ge = { emailSuggestion: "Did you mean {{email}}?", emailInvalid: "Your email is not correct", cardExpiryInvalid: "Your card's expiration date is in the past", cardExpiryFormat: "Your card’s expiration date is incomplete", cardSecurityFormat: "Your card’s security code is incomplete", nameRequired: "Please enter the name as it appears on your card", cardNumberInvalid: "Your card number is invalid" }, ye = {
686
+ email: ce,
687
+ cardholderNameLabel: de,
688
+ cardInformation: he,
689
+ cardholderNamePlaceholder: me,
690
+ cardExpiry: ue,
691
+ loading: pe,
692
+ "pay-with-card": "or pay with card",
693
+ buttonTexts: fe,
694
+ validation: ge
695
+ }, ve = "Correo electrónico", Ee = "Nombre del titular de la tarjeta", Ce = "Información de la tarjeta", be = "Nombre completo en la tarjeta", Se = "MM / AA", xe = "Por favor, no cierre esta ventana", Fe = { pay: "PAGAR", submit: "ENVIAR", getPlan: "OBTENER MI PLAN", donate: "DONAR", book: "RESERVAR AHORA", order: "ORDENAR AHORA" }, ke = { emailSuggestion: "¿Quisiste decir {{email}}?", emailInvalid: "Su correo electrónico no es válido", cardExpiryInvalid: "La fecha de vencimiento de la tarjeta ya pasó", cardExpiryFormat: "La fecha de vencimiento de su tarjeta está incompleta", cardSecurityFormat: "El código de seguridad de su tarjeta está incompleto", nameRequired: "Por favor, ingrese el nombre tal como aparece en su tarjeta", cardNumberInvalid: "Su número de tarjeta no es válido" }, we = {
696
+ email: ve,
697
+ cardholderNameLabel: Ee,
698
+ cardInformation: Ce,
699
+ cardholderNamePlaceholder: be,
700
+ cardExpiry: Se,
701
+ loading: xe,
702
+ "pay-with-card": "o paga con tarjeta",
703
+ buttonTexts: Fe,
704
+ validation: ke
705
+ }, Me = "E-mail", Le = "Nom du titulaire de la carte", Te = "Informations de la carte", Ie = "Nom complet figurant sur la carte", Ne = "MM / AA", Pe = "Veuillez ne pas fermer cette fenêtre", ze = { pay: "PAYER", submit: "ENVOYER", getPlan: "OBTENIR MON PLAN", donate: "FAIRE UN DON", book: "RÉSERVER MAINTENANT", order: "COMMANDER MAINTENANT" }, De = { emailSuggestion: "Vouliez-vous dire {{email}}?", emailInvalid: "Votre adresse e-mail n’est pas valide", cardExpiryInvalid: "La date d'expiration de votre carte est dans le passé", cardExpiryFormat: "La date d’expiration de votre carte est incomplète", cardSecurityFormat: "Le code de sécurité de votre carte est incomplet", nameRequired: "Veuillez saisir le nom tel qu’il figure sur votre carte", cardNumberInvalid: "Votre numéro de carte est invalide" }, Ve = {
706
+ email: Me,
707
+ cardholderNameLabel: Le,
708
+ cardInformation: Te,
709
+ cardholderNamePlaceholder: Ie,
710
+ cardExpiry: Ne,
711
+ loading: Pe,
712
+ "pay-with-card": "ou payez avec une carte",
708
713
  buttonTexts: ze,
709
- validation: Ae
710
- }, $e = "Email", Re = "Nome del titolare della carta", Be = "Informazioni sulla carta", He = "Nome completo sulla carta", Oe = "MM / AA", qe = "Non chiudere la finestra", Ke = { pay: "PAGA", submit: "INVIA", getPlan: "OTTIENI IL MIO PIANO", donate: "DONARE", book: "PRENOTA ORA", order: "ORDINA ORA" }, je = { emailSuggestion: "Intendevi {{email}}?", emailInvalid: "La tua email non è corretta", cardExpiryInvalid: "La data di scadenza della tua carta è nel passato", cardExpiryFormat: "La data di scadenza della tua carta è incompleta", cardSecurityFormat: "Il codice di sicurezza della tua carta è incompleto", nameRequired: "Inserisci il nome come appare sulla tua carta", cardNumberInvalid: "Il numero della tua carta non è valido" }, Ue = {
711
- email: $e,
712
- cardholderNameLabel: Re,
713
- cardInformation: Be,
714
- cardholderNamePlaceholder: He,
715
- cardExpiry: Oe,
716
- loading: qe,
714
+ validation: De
715
+ }, Ae = "Email", $e = "Nome del titolare della carta", Re = "Informazioni sulla carta", Be = "Nome completo sulla carta", He = "MM / AA", Oe = "Non chiudere la finestra", Ke = { pay: "PAGA", submit: "INVIA", getPlan: "OTTIENI IL MIO PIANO", donate: "DONARE", book: "PRENOTA ORA", order: "ORDINA ORA" }, qe = { emailSuggestion: "Intendevi {{email}}?", emailInvalid: "La tua email non è corretta", cardExpiryInvalid: "La data di scadenza della tua carta è nel passato", cardExpiryFormat: "La data di scadenza della tua carta è incompleta", cardSecurityFormat: "Il codice di sicurezza della tua carta è incompleto", nameRequired: "Inserisci il nome come appare sulla tua carta", cardNumberInvalid: "Il numero della tua carta non è valido" }, je = {
716
+ email: Ae,
717
+ cardholderNameLabel: $e,
718
+ cardInformation: Re,
719
+ cardholderNamePlaceholder: Be,
720
+ cardExpiry: He,
721
+ loading: Oe,
722
+ "pay-with-card": "o paga con carta",
717
723
  buttonTexts: Ke,
718
- validation: je
719
- }, _e = "Adres e-mail", Ge = "Imię i nazwisko posiadacza karty", Ye = "Informacje o karcie", Ze = "Imię i nazwisko na karcie", Je = "MM / RR", We = "Proszę nie zamykać tego okna", Xe = { pay: "ZAPŁAĆ", submit: "WYŚLIJ", getPlan: "POBIERZ MÓJ PLAN", donate: "PRZEKAŻ DAROWIZNĘ", book: "ZAREZERWUJ TERAZ", order: "ZAMÓW TERAZ" }, Qe = { emailSuggestion: "Czy chodziło Ci o {{email}}?", emailInvalid: "Państwa adres e-mail jest nieprawidłowy", cardExpiryInvalid: "Data ważności Państwa karty jest w przeszłości", cardExpiryFormat: "Data ważności Państwa karty jest niekompletna", cardSecurityFormat: "Kod zabezpieczający Państwa karty jest niekompletny", nameRequired: "Proszę wpisać imię i nazwisko tak, jak widnieje na karcie", cardNumberInvalid: "Numer Państwa karty jest nieprawidłowy" }, et = {
720
- email: _e,
721
- cardholderNameLabel: Ge,
722
- cardInformation: Ye,
723
- cardholderNamePlaceholder: Ze,
724
- cardExpiry: Je,
725
- loading: We,
726
- buttonTexts: Xe,
727
- validation: Qe
728
- }, tt = "E-mail", it = "Nome do titular do cartão", at = "Informações do cartão", rt = "Nome completo no cartão", st = "MM / AA", ot = "Por favor, não feche esta janela", nt = { pay: "PAGAR", submit: "ENVIAR", getPlan: "OBTER MEU PLANO", donate: "DOAR", book: "RESERVAR AGORA", order: "FAZER PEDIDO" }, lt = { emailSuggestion: "Você quis dizer {{email}}?", emailInvalid: "O seu endereço de e-mail não é válido", cardExpiryInvalid: "A data de validade do seu cartão está no passado", cardExpiryFormat: "A data de validade do seu cartão está incompleta", cardSecurityFormat: "O código de segurança do seu cartão está incompleto", nameRequired: "Por favor, insira o nome conforme aparece no cartão", cardNumberInvalid: "O número do seu cartão é inválido" }, ct = {
729
- email: tt,
730
- cardholderNameLabel: it,
724
+ validation: qe
725
+ }, Ue = "Adres e-mail", _e = "Imię i nazwisko posiadacza karty", Ge = "Informacje o karcie", Ye = "Imię i nazwisko na karcie", Ze = "MM / RR", Je = "Proszę nie zamykać tego okna", We = { pay: "ZAPŁAĆ", submit: "WYŚLIJ", getPlan: "POBIERZ MÓJ PLAN", donate: "PRZEKAŻ DAROWIZNĘ", book: "ZAREZERWUJ TERAZ", order: "ZAMÓW TERAZ" }, Xe = { emailSuggestion: "Czy chodziło Ci o {{email}}?", emailInvalid: "Państwa adres e-mail jest nieprawidłowy", cardExpiryInvalid: "Data ważności Państwa karty jest w przeszłości", cardExpiryFormat: "Data ważności Państwa karty jest niekompletna", cardSecurityFormat: "Kod zabezpieczający Państwa karty jest niekompletny", nameRequired: "Proszę wpisać imię i nazwisko tak, jak widnieje na karcie", cardNumberInvalid: "Numer Państwa karty jest nieprawidłowy" }, Qe = {
726
+ email: Ue,
727
+ cardholderNameLabel: _e,
728
+ cardInformation: Ge,
729
+ cardholderNamePlaceholder: Ye,
730
+ cardExpiry: Ze,
731
+ loading: Je,
732
+ "pay-with-card": "albo zapłać kartą",
733
+ buttonTexts: We,
734
+ validation: Xe
735
+ }, et = "E-mail", tt = "Nome do titular do cartão", at = "Informações do cartão", it = "Nome completo no cartão", rt = "MM / AA", st = "Por favor, não feche esta janela", nt = { pay: "PAGAR", submit: "ENVIAR", getPlan: "OBTER MEU PLANO", donate: "DOAR", book: "RESERVAR AGORA", order: "FAZER PEDIDO" }, ot = { emailSuggestion: "Você quis dizer {{email}}?", emailInvalid: "O seu endereço de e-mail não é válido", cardExpiryInvalid: "A data de validade do seu cartão está no passado", cardExpiryFormat: "A data de validade do seu cartão está incompleta", cardSecurityFormat: "O código de segurança do seu cartão está incompleto", nameRequired: "Por favor, insira o nome conforme aparece no cartão", cardNumberInvalid: "O número do seu cartão é inválido" }, lt = {
736
+ email: et,
737
+ cardholderNameLabel: tt,
731
738
  cardInformation: at,
732
- cardholderNamePlaceholder: rt,
733
- cardExpiry: st,
734
- loading: ot,
739
+ cardholderNamePlaceholder: it,
740
+ cardExpiry: rt,
741
+ loading: st,
742
+ "pay-with-card": "ou pagar com cartão",
735
743
  buttonTexts: nt,
736
- validation: lt
737
- }, dt = "E-posta", ht = "Kart sahibinin adı", mt = "Kart bilgileri", ut = "Kart üzerindeki tam ad", pt = "AA / YY", ft = "Lütfen pencereyi kapatmayın", gt = { pay: "ÖDE", submit: "GÖNDER", getPlan: "PLANIMI AL", donate: "BAĞIŞ YAP", book: "ŞİMDİ REZERVASYON YAP", order: "ŞİMDİ SİPARİŞ VER" }, yt = { emailSuggestion: "{{email}} demek mi istediniz?", emailInvalid: "E-posta adresiniz geçerli değil", cardExpiryInvalid: "Kartınızın son kullanma tarihi geçmiş", cardExpiryFormat: "Kartınızın son kullanma tarihi eksik", cardSecurityFormat: "Kartınızın güvenlik kodu eksik", nameRequired: "Lütfen kart üzerindeki ismi girin", cardNumberInvalid: "Kart numaranız geçersiz" }, vt = {
738
- email: dt,
739
- cardholderNameLabel: ht,
740
- cardInformation: mt,
741
- cardholderNamePlaceholder: ut,
742
- cardExpiry: pt,
743
- loading: ft,
744
- buttonTexts: gt,
745
- validation: yt
746
- }, A = {
747
- en: ve,
748
- de: ce,
749
- es: Le,
750
- fr: De,
751
- pl: et,
752
- pt: ct,
753
- tr: vt,
754
- it: Ue
744
+ validation: ot
745
+ }, ct = "E-posta", dt = "Kart sahibinin adı", ht = "Kart bilgileri", mt = "Kart üzerindeki tam ad", ut = "AA / YY", pt = "Lütfen pencereyi kapatmayın", ft = { pay: "ÖDE", submit: "GÖNDER", getPlan: "PLANIMI AL", donate: "BAĞIŞ YAP", book: "ŞİMDİ REZERVASYON YAP", order: "ŞİMDİ SİPARİŞ VER" }, gt = { emailSuggestion: "{{email}} demek mi istediniz?", emailInvalid: "E-posta adresiniz geçerli değil", cardExpiryInvalid: "Kartınızın son kullanma tarihi geçmiş", cardExpiryFormat: "Kartınızın son kullanma tarihi eksik", cardSecurityFormat: "Kartınızın güvenlik kodu eksik", nameRequired: "Lütfen kart üzerindeki ismi girin", cardNumberInvalid: "Kart numaranız geçersiz" }, yt = {
746
+ email: ct,
747
+ cardholderNameLabel: dt,
748
+ cardInformation: ht,
749
+ cardholderNamePlaceholder: mt,
750
+ cardExpiry: ut,
751
+ loading: pt,
752
+ "pay-with-card": "veya bir kartla ödeyin",
753
+ buttonTexts: ft,
754
+ validation: gt
755
+ }, V = {
756
+ en: ye,
757
+ de: le,
758
+ es: we,
759
+ fr: Ve,
760
+ pl: Qe,
761
+ pt: lt,
762
+ tr: yt,
763
+ it: je
755
764
  // Add other locales here
756
765
  };
757
- class Et {
766
+ class vt {
758
767
  locale;
759
768
  loadedLocales = /* @__PURE__ */ new Set();
760
769
  constructor(e = "en") {
@@ -767,32 +776,32 @@ class Et {
767
776
  return this.locale;
768
777
  }
769
778
  translate(e, t) {
770
- const i = this.getNestedTranslation(e);
771
- return !t || i === e ? i : this.interpolate(i, t);
779
+ const a = this.getNestedTranslation(e);
780
+ return !t || a === e ? a : this.interpolate(a, t);
772
781
  }
773
782
  /* eslint-disable @typescript-eslint/no-explicit-any */
774
783
  getNestedTranslation(e) {
775
- const t = this.locale in A ? A[this.locale] : {}, i = this.findNestedValue(t, e);
776
- return i === void 0 ? e : i;
784
+ const t = this.locale in V ? V[this.locale] : {}, a = this.findNestedValue(t, e);
785
+ return a === void 0 ? e : a;
777
786
  }
778
787
  findNestedValue(e, t) {
779
- const i = t.split(".");
780
- let a = e;
781
- for (const r of i) {
782
- if (a == null || !Object.prototype.hasOwnProperty.call(a, r))
788
+ const a = t.split(".");
789
+ let i = e;
790
+ for (const r of a) {
791
+ if (i == null || !Object.prototype.hasOwnProperty.call(i, r))
783
792
  return;
784
- a = a[r];
793
+ i = i[r];
785
794
  }
786
- return typeof a == "string" ? a : void 0;
795
+ return typeof i == "string" ? i : void 0;
787
796
  }
788
797
  interpolate(e, t) {
789
- return e.replace(/{{(\w+)}}/g, (i, a) => {
790
- const r = t[a];
791
- return r === void 0 ? i : String(r);
798
+ return e.replace(/{{(\w+)}}/g, (a, i) => {
799
+ const r = t[i];
800
+ return r === void 0 ? a : String(r);
792
801
  });
793
802
  }
794
803
  }
795
- const D = [
804
+ const A = [
796
805
  "en",
797
806
  "de",
798
807
  "es",
@@ -801,92 +810,92 @@ const D = [
801
810
  "pt",
802
811
  "it",
803
812
  "tr"
804
- ], Ct = "en";
805
- function bt(n) {
806
- const e = new Et(), i = (() => {
807
- const o = navigator?.language?.split("-")[0]?.toLowerCase();
808
- return D.includes(o) ? o : Ct;
813
+ ], Et = "en";
814
+ function Ct(o) {
815
+ const e = new vt(), a = (() => {
816
+ const n = navigator?.language?.split("-")[0]?.toLowerCase();
817
+ return A.includes(n) ? n : Et;
809
818
  })();
810
- e.setLocale(i);
811
- const a = k({
812
- locale: i,
819
+ e.setLocale(a);
820
+ const i = T({
821
+ locale: a,
813
822
  translationService: e
814
823
  });
815
824
  return {
816
- store: a,
817
- translate: (o, l) => a.getState().translationService.translate(o, l),
818
- setLocale: (o) => {
819
- D.includes(o) && (a.getState().translationService.setLocale(o), a.setState({ locale: o }));
825
+ store: i,
826
+ translate: (n, l) => i.getState().translationService.translate(n, l),
827
+ setLocale: (n) => {
828
+ A.includes(n) && (i.getState().translationService.setLocale(n), i.setState({ locale: n }));
820
829
  },
821
- getLocale: () => a.getValue("locale"),
822
- subscribe: a.subscribe.bind(a)
830
+ getLocale: () => i.getValue("locale"),
831
+ subscribe: i.subscribe.bind(i)
823
832
  };
824
833
  }
825
- const St = bt(), P = () => {
826
- const { translate: n, getLocale: e, setLocale: t, subscribe: i } = St;
834
+ const bt = Ct(), P = () => {
835
+ const { translate: o, getLocale: e, setLocale: t, subscribe: a } = bt;
827
836
  return {
828
- t: n,
829
- translate: n,
837
+ t: o,
838
+ translate: o,
830
839
  locale: e(),
831
840
  setLocale: t,
832
- subscribe: i
841
+ subscribe: a
833
842
  };
834
- }, xt = ({ fontFamily: n }) => {
835
- if (!n)
843
+ }, St = ({ fontFamily: o }) => {
844
+ if (!o)
836
845
  return { cleanup: () => {
837
846
  } };
838
- const e = n.replace(/\s+/g, "+"), t = `https://fonts.googleapis.com/css2?family=${e}:wght@400;700&display=swap`, i = [...document.head.querySelectorAll("link")].filter(
839
- (o) => o.href.includes("fonts.googleapis.com/css2") && o.rel === "stylesheet"
840
- ), a = document.createElement("link");
841
- a.rel = "stylesheet", a.href = t;
842
- const r = i.find(
843
- (o) => o.href.includes(`family=${e}`)
847
+ const e = o.replace(/\s+/g, "+"), t = `https://fonts.googleapis.com/css2?family=${e}:wght@400;700&display=swap`, a = [...document.head.querySelectorAll("link")].filter(
848
+ (n) => n.href.includes("fonts.googleapis.com/css2") && n.rel === "stylesheet"
849
+ ), i = document.createElement("link");
850
+ i.rel = "stylesheet", i.href = t;
851
+ const r = a.find(
852
+ (n) => n.href.includes(`family=${e}`)
844
853
  );
845
854
  if (r)
846
855
  r.href = t;
847
- else if (i.length > 0) {
848
- const o = i.at(
856
+ else if (a.length > 0) {
857
+ const n = a.at(
849
858
  -1
850
859
  );
851
- o?.nextSibling ? document.head.insertBefore(a, o.nextSibling) : document.head.appendChild(a);
860
+ n?.nextSibling ? document.head.insertBefore(i, n.nextSibling) : document.head.appendChild(i);
852
861
  } else
853
- document.head.appendChild(a);
862
+ document.head.appendChild(i);
854
863
  return { cleanup: () => {
855
- document.head.contains(a) && document.head.removeChild(a);
864
+ document.head.contains(i) && document.head.removeChild(i);
856
865
  } };
857
- }, Ft = ({
858
- scriptSrc: n,
866
+ }, xt = ({
867
+ scriptSrc: o,
859
868
  async: e = !0
860
869
  }) => {
861
- if (!n)
870
+ if (!o)
862
871
  return {
863
872
  cleanup: () => {
864
873
  },
865
874
  isLoaded: Promise.resolve(!1)
866
875
  };
867
876
  if ([...document.head.querySelectorAll("script")].filter(
868
- (s) => s.src === n
877
+ (s) => s.src === o
869
878
  ).length > 0)
870
879
  return {
871
880
  cleanup: () => {
872
881
  },
873
882
  isLoaded: Promise.resolve(!0)
874
883
  };
875
- const i = document.createElement("script");
876
- i.src = n, i.async = e;
877
- const a = new Promise((s, o) => {
878
- i.onload = () => s(!0), i.onerror = () => {
879
- console.error(`Failed to load script: ${n}`), o(new Error(`Failed to load script: ${n}`));
884
+ const a = document.createElement("script");
885
+ a.src = o, a.async = e;
886
+ const i = new Promise((s, n) => {
887
+ a.onload = () => s(!0), a.onerror = () => {
888
+ console.error(`Failed to load script: ${o}`), n(new Error(`Failed to load script: ${o}`));
880
889
  };
881
890
  });
882
- return document.head.appendChild(i), {
891
+ return document.head.appendChild(a), {
883
892
  cleanup: () => {
884
- document.head.contains(i) && document.head.removeChild(i);
893
+ document.head.contains(a) && document.head.removeChild(a);
885
894
  },
886
- isLoaded: a
895
+ isLoaded: i
887
896
  };
888
897
  };
889
- class wt {
898
+ class Ft {
890
899
  // The sequence of fields to focus in order
891
900
  focusSequence = [
892
901
  "cardNumber",
@@ -931,24 +940,24 @@ class wt {
931
940
  */
932
941
  handleFieldFocus(e) {
933
942
  const t = this.focusSequence.findIndex(
934
- (i) => i === e
943
+ (a) => a === e
935
944
  );
936
945
  t >= 0 && (this.currentFocusIndex = t);
937
946
  }
938
947
  /**
939
948
  * Update the validation state of fields based on form and iframe state
940
949
  */
941
- handleStateUpdate(e, t, i, a) {
950
+ handleStateUpdate(e, t, a, i) {
942
951
  Object.assign(this.previousFieldValidState, this.fieldValidState);
943
- const r = !!e.email && !t.email && !!i.email;
952
+ const r = !!e.email && !t.email && !!a.email;
944
953
  this.fieldValidState.email = r;
945
- const s = !!a.isCcValid;
954
+ const s = !!i.isCcValid;
946
955
  this.fieldValidState.cardNumber = s;
947
- const o = !!e.cardExpiry && !t.cardExpiry && !!i.cardExpiry;
948
- this.fieldValidState.cardExpiry = o;
949
- const l = !!a.isCvvValid;
956
+ const n = !!e.cardExpiry && !t.cardExpiry && !!a.cardExpiry;
957
+ this.fieldValidState.cardExpiry = n;
958
+ const l = !!i.isCvvValid;
950
959
  this.fieldValidState.cardCvv = l;
951
- const c = !!e.name && !t.name && !!i.name;
960
+ const c = !!e.name && !t.name && !!a.name;
952
961
  this.fieldValidState.name = c, this.checkForValidTransitions();
953
962
  }
954
963
  /**
@@ -990,12 +999,12 @@ class wt {
990
999
  this.currentFocusIndex = 0, this.applyFocusToCurrentField();
991
1000
  }
992
1001
  }
993
- const T = (n) => Object.entries(n).map(([e, t]) => {
994
- const i = e.replace(/([A-Z])/g, "-$1").toLowerCase(), a = typeof t == "number" ? `${t}px` : t;
995
- return `${i}: ${a}`;
1002
+ const L = (o) => Object.entries(o).map(([e, t]) => {
1003
+ const a = e.replace(/([A-Z])/g, "-$1").toLowerCase(), i = typeof t == "number" ? `${t}px` : t;
1004
+ return `${a}: ${i}`;
996
1005
  }).join("; ");
997
- function Mt(n) {
998
- if (!n)
1006
+ function kt(o) {
1007
+ if (!o)
999
1008
  return {
1000
1009
  formContainerStyle: {},
1001
1010
  baseStyles: {},
@@ -1015,35 +1024,35 @@ function Mt(n) {
1015
1024
  display: "block",
1016
1025
  border: "none",
1017
1026
  outline: "none",
1018
- fontSize: `${n.styles.fontSize}px`,
1027
+ fontSize: `${o.styles.fontSize}px`,
1019
1028
  lineHeight: 30,
1020
1029
  boxSizing: "border-box",
1021
1030
  padding: "0px 12px",
1022
1031
  height: 36,
1023
1032
  width: "100%",
1024
- fontFamily: `${n.styles.fontFamily}, sans-serif`
1033
+ fontFamily: `${o.styles.fontFamily}, sans-serif`
1025
1034
  }, t = {
1026
1035
  color: "#717173",
1027
1036
  opacity: "0.3",
1028
- fontFamily: `${n.styles.fontFamily}, sans-serif`
1029
- }, i = {
1030
- color: "#dc2727"
1037
+ fontFamily: `${o.styles.fontFamily}, sans-serif`
1031
1038
  }, a = {
1039
+ color: "#dc2727"
1040
+ }, i = {
1032
1041
  outline: "none"
1033
1042
  }, r = {
1034
- fontFamily: `${n.styles.fontFamily}, sans-serif`
1043
+ fontFamily: `${o.styles.fontFamily}, sans-serif`
1035
1044
  }, s = {
1036
- base: T(e),
1037
- error: T(i),
1038
- focus: T(a),
1039
- placeholder: T(t)
1045
+ base: L(e),
1046
+ error: L(a),
1047
+ focus: L(i),
1048
+ placeholder: L(t)
1040
1049
  };
1041
1050
  return {
1042
1051
  formContainerStyle: r,
1043
1052
  baseStyles: e,
1044
1053
  placeholderStyles: t,
1045
- errorStyles: i,
1046
- focusStyles: a,
1054
+ errorStyles: a,
1055
+ focusStyles: i,
1047
1056
  inputStyles: s
1048
1057
  };
1049
1058
  }
@@ -1057,9 +1066,9 @@ class h {
1057
1066
  * @param classNames Optional CSS class names to add
1058
1067
  * @param attributes Optional attributes to set on the element
1059
1068
  */
1060
- constructor(e, t = [], i = {}) {
1061
- this.element = document.createElement(e), t.length > 0 && this.addClass(...t), Object.entries(i).forEach(([a, r]) => {
1062
- this.setAttribute(a, r);
1069
+ constructor(e, t = [], a = {}) {
1070
+ this.element = document.createElement(e), t.length > 0 && this.addClass(...t), Object.entries(a).forEach(([i, r]) => {
1071
+ this.setAttribute(i, r);
1063
1072
  });
1064
1073
  }
1065
1074
  /**
@@ -1114,14 +1123,14 @@ class h {
1114
1123
  /**
1115
1124
  * Add an event listener to the element
1116
1125
  */
1117
- addEventListener(e, t, i) {
1118
- return this.element.addEventListener(e, t, i), this.eventListeners.push({ type: e, listener: t }), this;
1126
+ addEventListener(e, t, a) {
1127
+ return this.element.addEventListener(e, t, a), this.eventListeners.push({ type: e, listener: t }), this;
1119
1128
  }
1120
1129
  /**
1121
1130
  * Remove an event listener from the element
1122
1131
  */
1123
- removeEventListener(e, t, i) {
1124
- return this.element.removeEventListener(e, t, i), this;
1132
+ removeEventListener(e, t, a) {
1133
+ return this.element.removeEventListener(e, t, a), this;
1125
1134
  }
1126
1135
  /**
1127
1136
  * Hide this component
@@ -1144,7 +1153,7 @@ class h {
1144
1153
  }), this.eventListeners = [], this.children.forEach((e) => e.destroy()), this.children = [], this.element.parentNode && this.element.parentNode.removeChild(this.element);
1145
1154
  }
1146
1155
  }
1147
- class F {
1156
+ class m {
1148
1157
  /**
1149
1158
  * Create a div element
1150
1159
  */
@@ -1160,27 +1169,27 @@ class F {
1160
1169
  /**
1161
1170
  * Create a button element
1162
1171
  */
1163
- static createButton(e, t = [], i = {}) {
1164
- const a = new h("button", t, i);
1165
- return a.setText(e), a;
1172
+ static createButton(e, t = [], a = {}) {
1173
+ const i = new h("button", t, a);
1174
+ return i.setText(e), i;
1166
1175
  }
1167
1176
  /**
1168
1177
  * Create an input element
1169
1178
  */
1170
- static createInput(e, t = [], i = {}) {
1171
- const a = { type: e, ...i };
1172
- return new h("input", t, a);
1179
+ static createInput(e, t = [], a = {}) {
1180
+ const i = { type: e, ...a };
1181
+ return new h("input", t, i);
1173
1182
  }
1174
1183
  /**
1175
1184
  * Create a text input
1176
1185
  */
1177
- static createTextInput(e = "", t = [], i = {}) {
1178
- const a = {
1186
+ static createTextInput(e = "", t = [], a = {}) {
1187
+ const i = {
1179
1188
  type: "text",
1180
1189
  placeholder: e,
1181
- ...i
1190
+ ...a
1182
1191
  };
1183
- return new h("input", t, a);
1192
+ return new h("input", t, i);
1184
1193
  }
1185
1194
  /**
1186
1195
  * Create a form element
@@ -1191,47 +1200,47 @@ class F {
1191
1200
  /**
1192
1201
  * Create a label element
1193
1202
  */
1194
- static createLabel(e, t = "", i = [], a = {}) {
1195
- const r = t ? { for: t, ...a } : a, s = new h("label", i, r);
1203
+ static createLabel(e, t = "", a = [], i = {}) {
1204
+ const r = t ? { for: t, ...i } : i, s = new h("label", a, r);
1196
1205
  return s.setText(e), s;
1197
1206
  }
1198
1207
  /**
1199
1208
  * Create a select element
1200
1209
  */
1201
- static createSelect(e, t = [], i = {}) {
1202
- const a = new h("select", t, i);
1210
+ static createSelect(e, t = [], a = {}) {
1211
+ const i = new h("select", t, a);
1203
1212
  return e.forEach((r) => {
1204
1213
  const s = document.createElement("option");
1205
- s.value = r.value, s.textContent = r.text, r.selected && (s.selected = !0), a.getElement().appendChild(s);
1206
- }), a;
1214
+ s.value = r.value, s.textContent = r.text, r.selected && (s.selected = !0), i.getElement().appendChild(s);
1215
+ }), i;
1207
1216
  }
1208
1217
  /**
1209
1218
  * Create an image element
1210
1219
  */
1211
- static createImage(e, t = "", i = [], a = {}) {
1212
- const r = { src: e, alt: t, ...a };
1213
- return new h("img", i, r);
1220
+ static createImage(e, t = "", a = [], i = {}) {
1221
+ const r = { src: e, alt: t, ...i };
1222
+ return new h("img", a, r);
1214
1223
  }
1215
1224
  }
1216
- class Lt extends h {
1225
+ class wt extends h {
1217
1226
  messageComponent;
1218
1227
  constructor(e) {
1219
1228
  super("div", []);
1220
- const t = F.createDiv(["error-alert"], {
1229
+ const t = m.createDiv(["error-alert"], {
1221
1230
  role: "alert",
1222
1231
  "aria-live": "polite"
1223
- }), i = F.createDiv(["error-alert-content"]), a = F.createDiv([
1232
+ }), a = m.createDiv(["error-alert-content"]), i = m.createDiv([
1224
1233
  "error-alert-icon-container"
1225
1234
  ]);
1226
- a.getElement().innerHTML = this.createAlertCircleSVG();
1227
- const r = F.createDiv([
1235
+ i.getElement().innerHTML = this.createAlertCircleSVG();
1236
+ const r = m.createDiv([
1228
1237
  "error-alert-text-container"
1229
1238
  ]), s = new h("h4", [
1230
1239
  "error-alert-title"
1231
1240
  ]);
1232
1241
  s.setText("Checkout Error"), this.messageComponent = new h("p", [
1233
1242
  "error-alert-message"
1234
- ]), this.messageComponent.setText(e.message || "Bad request"), r.appendChild(s), r.appendChild(this.messageComponent), i.appendChild(a), i.appendChild(r), t.appendChild(i), this.appendChild(t);
1243
+ ]), this.messageComponent.setText(e.message || "Bad request"), r.appendChild(s), r.appendChild(this.messageComponent), a.appendChild(i), a.appendChild(r), t.appendChild(a), this.appendChild(t);
1235
1244
  }
1236
1245
  createAlertCircleSVG() {
1237
1246
  return `
@@ -1256,18 +1265,66 @@ class Lt extends h {
1256
1265
  return this.messageComponent.setText(e), this;
1257
1266
  }
1258
1267
  }
1259
- class $ extends h {
1268
+ class Mt extends h {
1269
+ constructor() {
1270
+ super("div", ["skeleton-container"]), this.createSkeletonElements();
1271
+ }
1272
+ createSkeletonElements() {
1273
+ this.appendChild(this.createPaymentMethodSkeleton()), this.appendChild(this.createPaymentSeparatorSkeleton()), this.appendChild(this.createFieldSkeleton()), this.appendChild(this.createFieldSkeleton()), this.appendChild(this.createCardRowSkeleton()), this.appendChild(this.createFieldSkeleton());
1274
+ }
1275
+ createPaymentMethodSkeleton() {
1276
+ const e = m.createDiv(["skeleton-field"]), t = m.createDiv([
1277
+ "skeleton",
1278
+ "skeleton-payment-method"
1279
+ ]);
1280
+ return e.appendChild(t), e;
1281
+ }
1282
+ createPaymentSeparatorSkeleton() {
1283
+ const e = m.createDiv([
1284
+ "payment-separator_container"
1285
+ ]), t = m.createDiv(["payment-separator__line"]), a = m.createDiv([
1286
+ "skeleton",
1287
+ "skeleton-separator-text"
1288
+ ]), i = m.createDiv(["payment-separator__line"]);
1289
+ return e.appendChild(t), e.appendChild(a), e.appendChild(i), e;
1290
+ }
1291
+ createFieldSkeleton() {
1292
+ const e = m.createDiv(["skeleton-field"]), t = m.createDiv(["skeleton", "skeleton-label"]);
1293
+ e.appendChild(t);
1294
+ const a = m.createDiv(["skeleton", "skeleton-input"]);
1295
+ return e.appendChild(a), e;
1296
+ }
1297
+ createCardRowSkeleton() {
1298
+ const e = m.createDiv(["skeleton-card-row"]), t = m.createDiv(["skeleton-field"]), a = m.createDiv([
1299
+ "skeleton",
1300
+ "skeleton-label"
1301
+ ]), i = m.createDiv([
1302
+ "skeleton",
1303
+ "skeleton-input"
1304
+ ]);
1305
+ t.appendChild(a), t.appendChild(i);
1306
+ const r = m.createDiv(["skeleton-field"]), s = m.createDiv(["skeleton", "skeleton-label"]), n = m.createDiv(["skeleton", "skeleton-input"]);
1307
+ return r.appendChild(s), r.appendChild(n), e.appendChild(t), e.appendChild(r), e;
1308
+ }
1309
+ createSubmitButtonSkeleton() {
1310
+ return m.createDiv([
1311
+ "skeleton",
1312
+ "skeleton-submit-button"
1313
+ ]);
1314
+ }
1315
+ }
1316
+ class Lt extends h {
1260
1317
  titleElement;
1261
1318
  constructor(e = {}) {
1262
1319
  super("div", ["blur-bg"]);
1263
- const t = F.createDiv(["loader"]);
1320
+ const t = m.createDiv(["loader"]);
1264
1321
  this.titleElement = new h("h3", ["title"]), this.titleElement.setText(e.text || ""), this.appendChild(t), this.appendChild(this.titleElement);
1265
1322
  }
1266
1323
  setText(e) {
1267
1324
  return this.titleElement.setText(e), this;
1268
1325
  }
1269
1326
  }
1270
- class E extends h {
1327
+ class C extends h {
1271
1328
  span;
1272
1329
  constructor(e) {
1273
1330
  super("div", []), this.span = document.createElement("span"), this.span.className = "form-helper-text", e.visible === !1 && this.span.classList.add("form-helper-text-hidden"), this.span.textContent = e.text || "", this.getElement().appendChild(this.span);
@@ -1294,12 +1351,12 @@ class Tt extends h {
1294
1351
  t.style.fontFamily = "inherit", t.style.color = e.styles.color, t.style.fontSize = `${e.styles.fontSize}px`;
1295
1352
  }
1296
1353
  }
1297
- class V extends h {
1354
+ class z extends h {
1298
1355
  inputElement;
1299
1356
  helperText = null;
1300
1357
  constructor(e) {
1301
1358
  if (super("div", ["input-wrapper"]), e.label && e.styles) {
1302
- const i = new Tt({
1359
+ const a = new Tt({
1303
1360
  styles: {
1304
1361
  color: e.styles.color,
1305
1362
  fontSize: e.styles.fontSize
@@ -1307,25 +1364,25 @@ class V extends h {
1307
1364
  label: e.label,
1308
1365
  id: e.name
1309
1366
  });
1310
- this.appendChild(i);
1367
+ this.appendChild(a);
1311
1368
  }
1312
1369
  const t = {
1313
1370
  id: e.name,
1314
1371
  name: e.name,
1315
1372
  class: `form-input ${e.error ? "form-input-error" : ""}`
1316
1373
  };
1317
- if (e.placeholder && (t.placeholder = e.placeholder), e.value && (t.value = e.value), e.required && (t.required = String(e.required)), e.disabled && (t.disabled = String(e.disabled)), e.autocomplete && (t.autocomplete = e.autocomplete), this.inputElement = F.createInput(
1374
+ if (e.placeholder && (t.placeholder = e.placeholder), e.value && (t.value = e.value), e.required && (t.required = String(e.required)), e.disabled && (t.disabled = String(e.disabled)), e.autocomplete && (t.autocomplete = e.autocomplete), this.inputElement = m.createInput(
1318
1375
  e.type || "text",
1319
1376
  [],
1320
1377
  t
1321
1378
  ), e.styles) {
1322
- const i = this.inputElement.getElement();
1323
- i.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, i.style.color = e.styles.color, i.style.fontSize = `${e.styles.fontSize}px`, i.style.borderRadius = e.styles.borderRadius;
1379
+ const a = this.inputElement.getElement();
1380
+ a.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.style.color = e.styles.color, a.style.fontSize = `${e.styles.fontSize}px`, a.style.borderRadius = e.styles.borderRadius;
1324
1381
  }
1325
- e.onChange && this.inputElement.getElement().addEventListener("input", e.onChange), this.getElement().appendChild(this.inputElement.getElement()), e.error ? (this.helperText = new E({
1382
+ e.onChange && this.inputElement.getElement().addEventListener("input", e.onChange), this.getElement().appendChild(this.inputElement.getElement()), e.error ? (this.helperText = new C({
1326
1383
  text: e.errorMsg,
1327
1384
  visible: !0
1328
- }), this.appendChild(this.helperText)) : (this.helperText = new E({ text: "", visible: !1 }), this.appendChild(this.helperText));
1385
+ }), this.appendChild(this.helperText)) : (this.helperText = new C({ text: "", visible: !1 }), this.appendChild(this.helperText));
1329
1386
  }
1330
1387
  getValue() {
1331
1388
  return this.inputElement.getElement().value;
@@ -1334,11 +1391,11 @@ class V extends h {
1334
1391
  return this.inputElement.getElement().value = e, this;
1335
1392
  }
1336
1393
  setError(e, t) {
1337
- const i = this.inputElement.getElement();
1338
- return e ? (i.classList.add("form-input-error"), !this.helperText && t ? (this.helperText = new E({ text: t }), this.appendChild(this.helperText)) : this.helperText && t ? this.helperText.setText(t).toggleVisibility(!0) : this.helperText && this.helperText.toggleVisibility(!0)) : (i.classList.remove("form-input-error"), this.helperText && this.helperText.toggleVisibility(!1)), this;
1394
+ const a = this.inputElement.getElement();
1395
+ return e ? (a.classList.add("form-input-error"), !this.helperText && t ? (this.helperText = new C({ text: t }), this.appendChild(this.helperText)) : this.helperText && t ? this.helperText.setText(t).toggleVisibility(!0) : this.helperText && this.helperText.toggleVisibility(!0)) : (a.classList.remove("form-input-error"), this.helperText && this.helperText.toggleVisibility(!1)), this;
1339
1396
  }
1340
- addEventListener(e, t, i) {
1341
- return this.inputElement.getElement().addEventListener(e, t, i), this;
1397
+ addEventListener(e, t, a) {
1398
+ return this.inputElement.getElement().addEventListener(e, t, a), this;
1342
1399
  }
1343
1400
  /**
1344
1401
  * Focus the input element
@@ -1347,39 +1404,39 @@ class V extends h {
1347
1404
  this.inputElement.getElement().focus();
1348
1405
  }
1349
1406
  }
1350
- class kt {
1407
+ class It {
1351
1408
  input;
1352
1409
  constructor(e) {
1353
1410
  const {
1354
1411
  value: t,
1355
- onChange: i,
1356
- onBlur: a,
1412
+ onChange: a,
1413
+ onBlur: i,
1357
1414
  error: r,
1358
1415
  errorMsg: s,
1359
- checkoutProfile: o,
1416
+ checkoutProfile: n,
1360
1417
  translationFunc: l,
1361
1418
  autocomplete: c = "cc-name"
1362
1419
  } = e;
1363
- this.input = new V({
1420
+ this.input = new z({
1364
1421
  name: "name",
1365
1422
  label: l("cardholderNameLabel"),
1366
1423
  // Always hide error initially - we'll show it only on blur if needed
1367
1424
  error: !1,
1368
1425
  errorMsg: s,
1369
1426
  styles: {
1370
- color: o.styles.textColor,
1371
- borderRadius: `${o.styles.borderRadius}px`,
1372
- fontSize: o.styles.fontSize,
1373
- fontFamily: o.styles.fontFamily
1427
+ color: n.styles.textColor,
1428
+ borderRadius: `${n.styles.borderRadius}px`,
1429
+ fontSize: n.styles.fontSize,
1430
+ fontFamily: n.styles.fontFamily
1374
1431
  },
1375
1432
  placeholder: l("cardholderNamePlaceholder"),
1376
1433
  value: t,
1377
1434
  autocomplete: c,
1378
1435
  onChange: (d) => {
1379
- this.input.setError(!1), this.trim(), i(d);
1436
+ this.input.setError(!1), this.trim(), a(d);
1380
1437
  }
1381
1438
  }), this.input.addEventListener("blur", (d) => {
1382
- r && this.input.setError(r, s), a(d);
1439
+ r && this.input.setError(r, s), i(d);
1383
1440
  });
1384
1441
  }
1385
1442
  getValue() {
@@ -1405,13 +1462,13 @@ class kt {
1405
1462
  this.input.focus();
1406
1463
  }
1407
1464
  }
1408
- class It extends h {
1465
+ class Nt extends h {
1409
1466
  constructor(e) {
1410
1467
  super("div", []);
1411
1468
  const t = document.createElement("div");
1412
1469
  t.className = e.isLoading ? "loading" : "", t.style.borderRadius = `0px 0px ${e.styles.borderRadius}px 0px`;
1413
- const i = document.createElement("div");
1414
- i.id = "card-cvv-element", i.className = `card-element ${e.isFocused ? "card-element-focus" : ""}`, i.style.zIndex = e.isFocused ? "2" : "0", t.appendChild(i), this.getElement().appendChild(t);
1470
+ const a = document.createElement("div");
1471
+ a.id = "card-cvv-element", a.className = `card-element ${e.isFocused ? "card-element-focus" : ""}`, a.style.zIndex = e.isFocused ? "2" : "0", t.appendChild(a), this.getElement().appendChild(t);
1415
1472
  }
1416
1473
  setFocused(e) {
1417
1474
  const t = this.getElement().querySelector("#card-cvv-element");
@@ -1422,22 +1479,22 @@ class It extends h {
1422
1479
  return t && (e ? t.classList.add("loading") : t.classList.remove("loading")), this;
1423
1480
  }
1424
1481
  }
1425
- const Nt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='30px'%20width='30px'%20version='1.1'%20id='Capa_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20512%20512'%20xml:space='preserve'%3e%3cpath%20style='fill:%23306FC5;'%20d='M512,402.281c0,16.716-13.55,30.267-30.265,30.267H30.265C13.55,432.549,0,418.997,0,402.281V109.717%20c0-16.715,13.55-30.266,30.265-30.266h451.47c16.716,0,30.265,13.551,30.265,30.266V402.281L512,402.281z'/%3e%3cpath%20style='opacity:0.15;fill:%23202121;enable-background:new%20;'%20d='M21.517,402.281V109.717%20c0-16.715,13.552-30.266,30.267-30.266h-21.52C13.55,79.451,0,93.001,0,109.717v292.565c0,16.716,13.55,30.267,30.265,30.267h21.52%20C35.07,432.549,21.517,418.997,21.517,402.281z'/%3e%3cg%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='74.59,220.748%2089.888,220.748%2082.241,201.278%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='155.946,286.107%20155.946,295.148%20181.675,295.148%20181.675,304.885%20155.946,304.885%20155.946,315.318%20184.455,315.318%20197.666,300.712%20185.151,286.107%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='356.898,201.278%20348.553,220.748%20364.548,220.748%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='230.348,320.875%20230.348,281.241%20212.268,300.712%20'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M264.42,292.368c-0.696-4.172-3.48-6.261-7.654-6.261h-14.599v12.516h15.299%20C261.637,298.624,264.42,296.539,264.42,292.368z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M313.09,297.236c1.391-0.697,2.089-2.785,2.089-4.867c0.696-2.779-0.698-4.172-2.089-4.868%20c-1.387-0.696-3.476-0.696-5.559-0.696h-13.91v11.127h13.909C309.613,297.932,311.702,297.932,313.09,297.236z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M413.217,183.198v8.344l-4.169-8.344H376.37v8.344l-4.174-8.344h-44.502%20c-7.648,0-13.909,1.392-19.469,4.173v-4.173h-31.289v0.696v3.477c-3.476-2.78-7.648-4.173-13.211-4.173h-111.95l-7.652,17.384%20l-7.647-17.384h-25.031h-10.431v8.344l-3.477-8.344h-0.696H66.942l-13.909,32.68L37.042,251.34l-0.294,0.697h0.294h35.463h0.444%20l0.252-0.697l4.174-10.428h9.039l4.172,11.125h40.326v-0.697v-7.647l3.479,8.343h20.163l3.475-8.343v7.647v0.697h15.993h79.965%20h0.696v-18.08h1.394c1.389,0,1.389,0,1.389,2.087v15.297h50.065v-4.172c4.172,2.089,10.426,4.172,18.771,4.172h20.863l4.172-11.123%20h9.732l4.172,11.123h40.328v-6.952v-3.476l6.261,10.428h1.387h0.698h30.595v-68.143h-31.291l0,0H413.217z%20M177.501,241.609h-6.955%20h-4.171v-4.169v-34.076l-0.696,1.595v-0.019l-16.176,36.669h-0.512h-3.719h-6.017l-16.687-38.245v38.245h-23.64l-4.867-10.43%20H70.417l-4.868,10.43H53.326l20.57-48.675h17.382l19.469,46.587v-46.587h4.171h14.251l0.328,0.697h0.024l8.773,19.094l6.3,14.306%20l0.223-0.721l13.906-33.375H177.5v48.674H177.501L177.501,241.609z%20M225.481,203.364h-27.119v9.039h26.423v9.734h-26.423v9.738%20h27.119v10.427h-38.939v-49.367h38.939V203.364L225.481,203.364z%20M275.076,221.294c0.018,0.016,0.041,0.027,0.063,0.042%20c0.263,0.278,0.488,0.557,0.68,0.824c1.332,1.746,2.409,4.343,2.463,8.151c0.004,0.066,0.007,0.131,0.011,0.197%20c0,0.038,0.007,0.071,0.007,0.11c0,0.022-0.002,0.039-0.002,0.06c0.016,0.383,0.026,0.774,0.026,1.197v9.735h-10.428v-5.565%20c0-2.781,0-6.954-2.089-9.735c-0.657-0.657-1.322-1.09-2.046-1.398c-1.042-0.675-3.017-0.686-6.295-0.686h-12.52v17.384h-11.818%20v-48.675h26.425c6.254,0,10.428,0,13.906,2.086c3.407,2.046,5.465,5.439,5.543,10.812c-0.161,7.4-4.911,11.46-8.326,12.829%20C270.676,218.662,272.996,219.129,275.076,221.294z%20M298.491,241.609h-11.822v-48.675h11.822V241.609z%20M434.083,241.609h-15.3%20l-22.25-36.855v30.595l-0.073-0.072v6.362h-11.747v-0.029h-11.822l-4.172-10.43H344.38l-4.172,11.123h-13.211%20c-5.559,0-12.517-1.389-16.687-5.561c-4.172-4.172-6.256-9.735-6.256-18.773c0-6.953,1.389-13.911,6.256-19.472%20c3.474-4.175,9.735-5.562,17.382-5.562h11.128v10.429h-11.128c-4.172,0-6.254,0.693-9.041,2.783%20c-2.082,2.085-3.474,6.256-3.474,11.123c0,5.564,0.696,9.04,3.474,11.821c2.091,2.089,4.87,2.785,8.346,2.785h4.867l15.991-38.243%20h6.957h10.428l19.472,46.587v-2.376v-15.705v-1.389v-27.116h17.382l20.161,34.07v-34.07h11.826v47.977h0.002L434.083,241.609%20L434.083,241.609z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M265.161,213.207c0.203-0.217,0.387-0.463,0.543-0.745c0.63-0.997,1.352-2.793,0.963-5.244%20c-0.016-0.225-0.057-0.433-0.105-0.634c-0.013-0.056-0.011-0.105-0.026-0.161l-0.007,0.001c-0.346-1.191-1.229-1.923-2.11-2.367%20c-1.394-0.693-3.48-0.693-5.565-0.693h-13.909v11.127h13.909c2.085,0,4.172,0,5.565-0.697c0.209-0.106,0.395-0.25,0.574-0.413%20l0.002,0.009C264.996,213.389,265.067,213.315,265.161,213.207z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M475.105,311.144c0-4.867-1.389-9.736-3.474-13.212v-31.289h-0.032v-2.089c0,0-29.145,0-33.483,0%20c-4.336,0-9.598,4.171-9.598,4.171v-4.171h-31.984c-4.87,0-11.124,1.392-13.909,4.171v-4.171h-57.016v2.089v2.081%20c-4.169-3.474-11.824-4.171-15.298-4.171h-37.549v2.089v2.081c-3.476-3.474-11.824-4.171-15.998-4.171H215.05l-9.737,10.431%20l-9.04-10.431h-2.911h-4.737h-54.93v2.089v5.493v62.651h61.19l10.054-10.057l8.715,10.057h0.698h35.258h1.598h0.696h0.692v-6.953%20v-9.039h3.479c4.863,0,11.124,0,15.991-2.089v17.382v1.394h31.291v-1.394V317.4h1.387c2.089,0,2.089,0,2.089,2.086v14.6v1.394%20h94.563c6.263,0,12.517-1.394,15.993-4.175v2.781v1.394h29.902c6.254,0,12.517-0.695,16.689-3.478%20c6.402-3.841,10.437-10.64,11.037-18.749c0.028-0.24,0.063-0.48,0.085-0.721l-0.041-0.039%20C475.087,312.043,475.105,311.598,475.105,311.144z%20M256.076,306.973h-13.91v2.081v4.174v4.173v7.649h-22.855l-13.302-15.299%20l-0.046,0.051l-0.65-0.748l-15.297,15.996h-44.501v-48.673h45.197l12.348,13.525l2.596,2.832l0.352-0.365l14.604-15.991h36.852%20c7.152,0,15.161,1.765,18.196,9.042c0.365,1.441,0.577,3.043,0.577,4.863C276.237,304.189,266.502,306.973,256.076,306.973z%20M325.609,306.276c1.389,2.081,2.085,4.867,2.085,9.041v9.732h-11.819v-6.256c0-2.786,0-7.65-2.089-9.739%20c-1.387-2.081-4.172-2.081-8.341-2.081H292.93v18.077h-11.82v-49.369h26.421c5.559,0,10.426,0,13.909,2.084%20c3.474,2.088,6.254,5.565,6.254,11.128c0,7.647-4.865,11.819-8.343,13.212C322.829,303.49,324.914,304.885,325.609,306.276z%20M373.589,286.107h-27.122v9.04h26.424v9.737h-26.424v9.736h27.122v10.429H334.65V275.68h38.939V286.107z%20M402.791,325.05h-22.252%20v-10.429h22.252c2.082,0,3.476,0,4.87-1.392c0.696-0.697,1.387-2.085,1.387-3.477c0-1.394-0.691-2.778-1.387-3.475%20c-0.698-0.695-2.091-1.391-4.176-1.391c-11.126-0.696-24.337,0-24.337-15.296c0-6.954,4.172-14.604,16.689-14.604h22.945v11.819%20h-21.554c-2.085,0-3.478,0-4.87,0.696c-1.387,0.697-1.387,2.089-1.387,3.478c0,2.087,1.387,2.783,2.778,3.473%20c1.394,0.697,2.783,0.697,4.172,0.697h6.259c6.259,0,10.43,1.391,13.211,4.173c2.087,2.087,3.478,5.564,3.478,10.43%20C420.869,320.179,414.611,325.05,402.791,325.05z%20M462.59,320.179c-2.778,2.785-7.648,4.871-14.604,4.871H425.74v-10.429h22.245%20c2.087,0,3.481,0,4.87-1.392c0.693-0.697,1.391-2.085,1.391-3.477c0-1.394-0.698-2.778-1.391-3.475%20c-0.696-0.695-2.085-1.391-4.172-1.391c-11.122-0.696-24.337,0-24.337-15.295c0-6.609,3.781-12.579,13.106-14.352%20c1.115-0.154,2.293-0.253,3.583-0.253h22.948v11.819h-15.3h-5.561h-0.696c-2.087,0-3.476,0-4.865,0.696%20c-0.7,0.697-1.396,2.089-1.396,3.478c0,2.087,0.696,2.783,2.785,3.473c1.389,0.697,2.78,0.697,4.172,0.697h0.691h5.565%20c3.039,0,5.337,0.375,7.44,1.114c1.926,0.697,8.302,3.549,9.728,10.994c0.124,0.78,0.215,1.594,0.215,2.495%20C466.761,313.925,465.37,317.401,462.59,320.179z'/%3e%3c/g%3e%3c/svg%3e", Pt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='30px'%20width='30px'%20version='1.1'%20id='Capa_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20512%20512'%20xml:space='preserve'%3e%3cpath%20style='fill:%2334495E;'%20d='M512,402.282c0,16.716-13.55,30.267-30.265,30.267H30.265C13.55,432.549,0,418.996,0,402.282V109.717%20c0-16.716,13.55-30.266,30.265-30.266h451.469c16.716,0,30.265,13.551,30.265,30.266L512,402.282L512,402.282z'/%3e%3cpath%20style='opacity:0.15;fill:%23202121;enable-background:new%20;'%20d='M21.517,402.282V109.717%20c0-16.716,13.552-30.266,30.267-30.266h-21.52C13.55,79.451,0,93.003,0,109.717v292.565c0,16.716,13.55,30.267,30.265,30.267h21.52%20C35.07,432.549,21.517,418.996,21.517,402.282z'/%3e%3cpath%20style='fill:%23F26E21;'%20d='M309.389,255.801c0.041-9.636-3.572-19.286-10.843-26.558c-7.287-7.287-16.961-10.897-26.617-10.839%20c-0.046,0-0.091-0.003-0.139-0.003c-20.968,0-37.6,16.628-37.6,37.602c0,20.767,16.837,37.599,37.6,37.599%20c20.974,0,37.604-16.631,37.604-37.599C309.394,255.934,309.389,255.869,309.389,255.801z'/%3e%3cg%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M227.198,271.909c-5.62,5.626-10.807,7.824-16.394,7.943c-13.611-0.122-23.618-10.202-23.618-24.573%20c0-7.234,2.739-13.163,7.078-18.228l0,0c4.069-3.863,9.311-6.359,15.339-6.359c6.507,0,11.571,2.169,17.352,7.954v-16.631%20c-5.78-2.891-10.846-4.338-17.352-4.338c-9.192,0.657-17.859,4.371-24.507,10.203l0,0c-1.916,1.724-3.752,3.627-5.309,5.805%20c-4.856,6.294-7.791,14.001-7.791,22.32c0,20.967,16.637,36.875,37.606,36.875c0.102,0,0.203-0.009,0.302-0.01%20c0.141,0.002,0.28,0.01,0.42,0.01c5.784,0,10.85-1.443,17.357-4.336L227.198,271.909c-0.244,0.244,0.242,0.471,0,0.702V271.909z'/%3e%3cpolygon%20style='fill:%23E7E8E3;'%20points='356.863,228.033%20356.863,228.033%20340.487,268.295%20321.685,220.566%20306.502,220.566%20336.148,293.601%20344.102,293.601%20375.196,220.566%20360.013,220.566%20'/%3e%3cpolygon%20style='fill:%23E7E8E3;'%20points='380.983,252.384%20380.983,291.435%20420.033,291.435%20420.753,291.435%20420.753,279.861%20408.461,279.861%20395.445,279.861%20395.445,266.848%20395.445,260.342%20420.033,260.342%20420.033,248.045%20395.445,248.045%20395.445,232.861%20420.753,232.861%20420.753,220.566%20380.983,220.566%20'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M54.135,220.566H33.884v70.869h20.25c10.845,0,18.798-2.895,25.306-7.957%20c7.953-6.508,13.017-16.629,13.017-27.474C92.458,235.028,77.27,220.566,54.135,220.566z%20M70.765,274.08%20c-4.339,3.614-10.124,5.781-18.802,5.781h-4.339V232.86h3.615c8.678,0,14.463,1.446,18.803,5.783%20c5.061,4.336,7.955,10.848,7.955,17.358C78.72,262.509,75.828,269.737,70.765,274.08z'/%3e%3crect%20x='98.97'%20y='220.56'%20style='fill:%23E7E8E3;'%20width='13.739'%20height='70.867'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M147.415,248.045c-8.676-2.892-10.848-5.063-10.848-8.677c0-4.339,4.339-7.954,10.124-7.954%20c4.339,0,7.954,1.447,11.57,5.786l7.233-9.4c-5.787-5.064-13.015-7.953-20.97-7.953c-12.296,0-22.42,8.678-22.42,20.244%20c0,10.126,4.343,14.464,17.357,19.526c5.785,2.166,7.955,2.892,9.404,4.338c2.887,1.444,4.336,4.339,4.336,7.228%20c0,5.786-4.336,10.126-10.848,10.126c-6.514,0-12.294-3.615-15.187-9.401l-8.678,8.678c6.511,9.4,14.465,13.738,24.589,13.738%20c14.461,0,24.58-9.4,24.58-23.141C167.659,258.893,163.324,253.831,147.415,248.045z'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M459.804,261.783c10.843-2.166,16.63-9.4,16.63-20.244c0-13.014-9.402-20.973-25.308-20.973h-20.972%20v70.869h13.739V263.23h2.172l19.519,28.205h16.634L459.804,261.783z%20M448.23,253.105h-4.336v-21.691h4.336%20c8.678,0,13.742,3.614,13.742,10.85C461.972,249.492,456.909,253.105,448.23,253.105z'/%3e%3c/g%3e%3c/svg%3e", Vt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='800px'%20width='800px'%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20291.791%20291.791'%20xml:space='preserve'%3e%3cg%3e%3cpath%20style='fill:%23E2574C;'%20d='M182.298,145.895c0,50.366-40.801,91.176-91.149,91.176S0,196.252,0,145.895%20s40.811-91.176,91.149-91.176S182.298,95.538,182.298,145.895z'/%3e%3cpath%20style='fill:%23F4B459;'%20d='M200.616,54.719c-20.442,0-39.261,6.811-54.469,18.181l0.073,0.009%20c2.991,2.89,6.291,4.924,8.835,8.251l-18.965,0.301c-2.972,3-5.68,6.264-8.233,9.656H161.3c2.544,3.054,4.896,5.708,7.03,9.081%20h-46.536c-1.705,2.936-3.282,5.954-4.659,9.09h56.493c1.477,3.127,2.799,5.489,3.921,8.799h-63.76%20c-1.012,3.146-1.878,6.364-2.535,9.646h68.966c0.675,3.155,1.194,6.072,1.55,9.045h-71.884c-0.301,3-0.456,6.045-0.456,9.118%20h72.859c0,3.228-0.228,6.218-0.556,9.118h-71.847c0.31,3.091,0.766,6.127,1.368,9.118h68.856c-0.711,2.954-1.532,5.926-2.562,9.008%20h-63.969c0.966,3.118,2.143,6.145,3.428,9.099h56.621c-1.568,3.319-3.346,5.972-5.306,9.081h-46.691%20c1.842,3.191,3.875,6.236,6.081,9.154l33.589,0.501c-2.863,3.437-6.537,5.507-9.884,8.516c0.182,0.146-5.352-0.018-16.248-0.191%20c16.576,17.105,39.744,27.772,65.446,27.772c50.357,0,91.176-40.82,91.176-91.176S250.981,54.719,200.616,54.719z'/%3e%3c/g%3e%3c/svg%3e", zt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%20-140%20780%20780'%20enable-background='new%200%200%20780%20500'%20version='1.1'%20xml:space='preserve'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M40,0h700c22.092,0,40,17.909,40,40v420c0,22.092-17.908,40-40,40H40c-22.091,0-40-17.908-40-40V40%20C0,17.909,17.909,0,40,0z'%20fill='%230E4595'/%3e%3cpath%20d='m293.2%20348.73l33.361-195.76h53.36l-33.385%20195.76h-53.336zm246.11-191.54c-10.57-3.966-27.137-8.222-47.822-8.222-52.725%200-89.865%2026.55-90.18%2064.603-0.299%2028.13%2026.514%2043.822%2046.752%2053.186%2020.771%209.595%2027.752%2015.714%2027.654%2024.283-0.131%2013.121-16.586%2019.116-31.922%2019.116-21.357%200-32.703-2.967-50.227-10.276l-6.876-3.11-7.489%2043.823c12.463%205.464%2035.51%2010.198%2059.438%2010.443%2056.09%200%2092.5-26.246%2092.916-66.882%200.199-22.269-14.016-39.216-44.801-53.188-18.65-9.055-30.072-15.099-29.951-24.268%200-8.137%209.668-16.839%2030.557-16.839%2017.449-0.27%2030.09%203.535%2039.938%207.5l4.781%202.26%207.232-42.429m137.31-4.223h-41.232c-12.773%200-22.332%203.487-27.941%2016.234l-79.244%20179.4h56.031s9.16-24.123%2011.232-29.418c6.125%200%2060.555%200.084%2068.338%200.084%201.596%206.853%206.49%2029.334%206.49%2029.334h49.514l-43.188-195.64zm-65.418%20126.41c4.412-11.279%2021.26-54.723%2021.26-54.723-0.316%200.522%204.379-11.334%207.074-18.684l3.605%2016.879s10.219%2046.729%2012.354%2056.528h-44.293zm-363.3-126.41l-52.24%20133.5-5.567-27.13c-9.725-31.273-40.025-65.155-73.898-82.118l47.766%20171.2%2056.456-0.064%2084.004-195.39h-56.521'%20fill='%23ffffff'/%3e%3cpath%20d='m146.92%20152.96h-86.041l-0.681%204.073c66.938%2016.204%20111.23%2055.363%20129.62%20102.41l-18.71-89.96c-3.23-12.395-12.597-16.094-24.186-16.527'%20fill='%23F2AE14'/%3e%3c/svg%3e", L = [
1482
+ const Pt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='30px'%20width='30px'%20version='1.1'%20id='Capa_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20512%20512'%20xml:space='preserve'%3e%3cpath%20style='fill:%23306FC5;'%20d='M512,402.281c0,16.716-13.55,30.267-30.265,30.267H30.265C13.55,432.549,0,418.997,0,402.281V109.717%20c0-16.715,13.55-30.266,30.265-30.266h451.47c16.716,0,30.265,13.551,30.265,30.266V402.281L512,402.281z'/%3e%3cpath%20style='opacity:0.15;fill:%23202121;enable-background:new%20;'%20d='M21.517,402.281V109.717%20c0-16.715,13.552-30.266,30.267-30.266h-21.52C13.55,79.451,0,93.001,0,109.717v292.565c0,16.716,13.55,30.267,30.265,30.267h21.52%20C35.07,432.549,21.517,418.997,21.517,402.281z'/%3e%3cg%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='74.59,220.748%2089.888,220.748%2082.241,201.278%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='155.946,286.107%20155.946,295.148%20181.675,295.148%20181.675,304.885%20155.946,304.885%20155.946,315.318%20184.455,315.318%20197.666,300.712%20185.151,286.107%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='356.898,201.278%20348.553,220.748%20364.548,220.748%20'/%3e%3cpolygon%20style='fill:%23FFFFFF;'%20points='230.348,320.875%20230.348,281.241%20212.268,300.712%20'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M264.42,292.368c-0.696-4.172-3.48-6.261-7.654-6.261h-14.599v12.516h15.299%20C261.637,298.624,264.42,296.539,264.42,292.368z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M313.09,297.236c1.391-0.697,2.089-2.785,2.089-4.867c0.696-2.779-0.698-4.172-2.089-4.868%20c-1.387-0.696-3.476-0.696-5.559-0.696h-13.91v11.127h13.909C309.613,297.932,311.702,297.932,313.09,297.236z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M413.217,183.198v8.344l-4.169-8.344H376.37v8.344l-4.174-8.344h-44.502%20c-7.648,0-13.909,1.392-19.469,4.173v-4.173h-31.289v0.696v3.477c-3.476-2.78-7.648-4.173-13.211-4.173h-111.95l-7.652,17.384%20l-7.647-17.384h-25.031h-10.431v8.344l-3.477-8.344h-0.696H66.942l-13.909,32.68L37.042,251.34l-0.294,0.697h0.294h35.463h0.444%20l0.252-0.697l4.174-10.428h9.039l4.172,11.125h40.326v-0.697v-7.647l3.479,8.343h20.163l3.475-8.343v7.647v0.697h15.993h79.965%20h0.696v-18.08h1.394c1.389,0,1.389,0,1.389,2.087v15.297h50.065v-4.172c4.172,2.089,10.426,4.172,18.771,4.172h20.863l4.172-11.123%20h9.732l4.172,11.123h40.328v-6.952v-3.476l6.261,10.428h1.387h0.698h30.595v-68.143h-31.291l0,0H413.217z%20M177.501,241.609h-6.955%20h-4.171v-4.169v-34.076l-0.696,1.595v-0.019l-16.176,36.669h-0.512h-3.719h-6.017l-16.687-38.245v38.245h-23.64l-4.867-10.43%20H70.417l-4.868,10.43H53.326l20.57-48.675h17.382l19.469,46.587v-46.587h4.171h14.251l0.328,0.697h0.024l8.773,19.094l6.3,14.306%20l0.223-0.721l13.906-33.375H177.5v48.674H177.501L177.501,241.609z%20M225.481,203.364h-27.119v9.039h26.423v9.734h-26.423v9.738%20h27.119v10.427h-38.939v-49.367h38.939V203.364L225.481,203.364z%20M275.076,221.294c0.018,0.016,0.041,0.027,0.063,0.042%20c0.263,0.278,0.488,0.557,0.68,0.824c1.332,1.746,2.409,4.343,2.463,8.151c0.004,0.066,0.007,0.131,0.011,0.197%20c0,0.038,0.007,0.071,0.007,0.11c0,0.022-0.002,0.039-0.002,0.06c0.016,0.383,0.026,0.774,0.026,1.197v9.735h-10.428v-5.565%20c0-2.781,0-6.954-2.089-9.735c-0.657-0.657-1.322-1.09-2.046-1.398c-1.042-0.675-3.017-0.686-6.295-0.686h-12.52v17.384h-11.818%20v-48.675h26.425c6.254,0,10.428,0,13.906,2.086c3.407,2.046,5.465,5.439,5.543,10.812c-0.161,7.4-4.911,11.46-8.326,12.829%20C270.676,218.662,272.996,219.129,275.076,221.294z%20M298.491,241.609h-11.822v-48.675h11.822V241.609z%20M434.083,241.609h-15.3%20l-22.25-36.855v30.595l-0.073-0.072v6.362h-11.747v-0.029h-11.822l-4.172-10.43H344.38l-4.172,11.123h-13.211%20c-5.559,0-12.517-1.389-16.687-5.561c-4.172-4.172-6.256-9.735-6.256-18.773c0-6.953,1.389-13.911,6.256-19.472%20c3.474-4.175,9.735-5.562,17.382-5.562h11.128v10.429h-11.128c-4.172,0-6.254,0.693-9.041,2.783%20c-2.082,2.085-3.474,6.256-3.474,11.123c0,5.564,0.696,9.04,3.474,11.821c2.091,2.089,4.87,2.785,8.346,2.785h4.867l15.991-38.243%20h6.957h10.428l19.472,46.587v-2.376v-15.705v-1.389v-27.116h17.382l20.161,34.07v-34.07h11.826v47.977h0.002L434.083,241.609%20L434.083,241.609z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M265.161,213.207c0.203-0.217,0.387-0.463,0.543-0.745c0.63-0.997,1.352-2.793,0.963-5.244%20c-0.016-0.225-0.057-0.433-0.105-0.634c-0.013-0.056-0.011-0.105-0.026-0.161l-0.007,0.001c-0.346-1.191-1.229-1.923-2.11-2.367%20c-1.394-0.693-3.48-0.693-5.565-0.693h-13.909v11.127h13.909c2.085,0,4.172,0,5.565-0.697c0.209-0.106,0.395-0.25,0.574-0.413%20l0.002,0.009C264.996,213.389,265.067,213.315,265.161,213.207z'/%3e%3cpath%20style='fill:%23FFFFFF;'%20d='M475.105,311.144c0-4.867-1.389-9.736-3.474-13.212v-31.289h-0.032v-2.089c0,0-29.145,0-33.483,0%20c-4.336,0-9.598,4.171-9.598,4.171v-4.171h-31.984c-4.87,0-11.124,1.392-13.909,4.171v-4.171h-57.016v2.089v2.081%20c-4.169-3.474-11.824-4.171-15.298-4.171h-37.549v2.089v2.081c-3.476-3.474-11.824-4.171-15.998-4.171H215.05l-9.737,10.431%20l-9.04-10.431h-2.911h-4.737h-54.93v2.089v5.493v62.651h61.19l10.054-10.057l8.715,10.057h0.698h35.258h1.598h0.696h0.692v-6.953%20v-9.039h3.479c4.863,0,11.124,0,15.991-2.089v17.382v1.394h31.291v-1.394V317.4h1.387c2.089,0,2.089,0,2.089,2.086v14.6v1.394%20h94.563c6.263,0,12.517-1.394,15.993-4.175v2.781v1.394h29.902c6.254,0,12.517-0.695,16.689-3.478%20c6.402-3.841,10.437-10.64,11.037-18.749c0.028-0.24,0.063-0.48,0.085-0.721l-0.041-0.039%20C475.087,312.043,475.105,311.598,475.105,311.144z%20M256.076,306.973h-13.91v2.081v4.174v4.173v7.649h-22.855l-13.302-15.299%20l-0.046,0.051l-0.65-0.748l-15.297,15.996h-44.501v-48.673h45.197l12.348,13.525l2.596,2.832l0.352-0.365l14.604-15.991h36.852%20c7.152,0,15.161,1.765,18.196,9.042c0.365,1.441,0.577,3.043,0.577,4.863C276.237,304.189,266.502,306.973,256.076,306.973z%20M325.609,306.276c1.389,2.081,2.085,4.867,2.085,9.041v9.732h-11.819v-6.256c0-2.786,0-7.65-2.089-9.739%20c-1.387-2.081-4.172-2.081-8.341-2.081H292.93v18.077h-11.82v-49.369h26.421c5.559,0,10.426,0,13.909,2.084%20c3.474,2.088,6.254,5.565,6.254,11.128c0,7.647-4.865,11.819-8.343,13.212C322.829,303.49,324.914,304.885,325.609,306.276z%20M373.589,286.107h-27.122v9.04h26.424v9.737h-26.424v9.736h27.122v10.429H334.65V275.68h38.939V286.107z%20M402.791,325.05h-22.252%20v-10.429h22.252c2.082,0,3.476,0,4.87-1.392c0.696-0.697,1.387-2.085,1.387-3.477c0-1.394-0.691-2.778-1.387-3.475%20c-0.698-0.695-2.091-1.391-4.176-1.391c-11.126-0.696-24.337,0-24.337-15.296c0-6.954,4.172-14.604,16.689-14.604h22.945v11.819%20h-21.554c-2.085,0-3.478,0-4.87,0.696c-1.387,0.697-1.387,2.089-1.387,3.478c0,2.087,1.387,2.783,2.778,3.473%20c1.394,0.697,2.783,0.697,4.172,0.697h6.259c6.259,0,10.43,1.391,13.211,4.173c2.087,2.087,3.478,5.564,3.478,10.43%20C420.869,320.179,414.611,325.05,402.791,325.05z%20M462.59,320.179c-2.778,2.785-7.648,4.871-14.604,4.871H425.74v-10.429h22.245%20c2.087,0,3.481,0,4.87-1.392c0.693-0.697,1.391-2.085,1.391-3.477c0-1.394-0.698-2.778-1.391-3.475%20c-0.696-0.695-2.085-1.391-4.172-1.391c-11.122-0.696-24.337,0-24.337-15.295c0-6.609,3.781-12.579,13.106-14.352%20c1.115-0.154,2.293-0.253,3.583-0.253h22.948v11.819h-15.3h-5.561h-0.696c-2.087,0-3.476,0-4.865,0.696%20c-0.7,0.697-1.396,2.089-1.396,3.478c0,2.087,0.696,2.783,2.785,3.473c1.389,0.697,2.78,0.697,4.172,0.697h0.691h5.565%20c3.039,0,5.337,0.375,7.44,1.114c1.926,0.697,8.302,3.549,9.728,10.994c0.124,0.78,0.215,1.594,0.215,2.495%20C466.761,313.925,465.37,317.401,462.59,320.179z'/%3e%3c/g%3e%3c/svg%3e", zt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='30px'%20width='30px'%20version='1.1'%20id='Capa_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20512%20512'%20xml:space='preserve'%3e%3cpath%20style='fill:%2334495E;'%20d='M512,402.282c0,16.716-13.55,30.267-30.265,30.267H30.265C13.55,432.549,0,418.996,0,402.282V109.717%20c0-16.716,13.55-30.266,30.265-30.266h451.469c16.716,0,30.265,13.551,30.265,30.266L512,402.282L512,402.282z'/%3e%3cpath%20style='opacity:0.15;fill:%23202121;enable-background:new%20;'%20d='M21.517,402.282V109.717%20c0-16.716,13.552-30.266,30.267-30.266h-21.52C13.55,79.451,0,93.003,0,109.717v292.565c0,16.716,13.55,30.267,30.265,30.267h21.52%20C35.07,432.549,21.517,418.996,21.517,402.282z'/%3e%3cpath%20style='fill:%23F26E21;'%20d='M309.389,255.801c0.041-9.636-3.572-19.286-10.843-26.558c-7.287-7.287-16.961-10.897-26.617-10.839%20c-0.046,0-0.091-0.003-0.139-0.003c-20.968,0-37.6,16.628-37.6,37.602c0,20.767,16.837,37.599,37.6,37.599%20c20.974,0,37.604-16.631,37.604-37.599C309.394,255.934,309.389,255.869,309.389,255.801z'/%3e%3cg%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M227.198,271.909c-5.62,5.626-10.807,7.824-16.394,7.943c-13.611-0.122-23.618-10.202-23.618-24.573%20c0-7.234,2.739-13.163,7.078-18.228l0,0c4.069-3.863,9.311-6.359,15.339-6.359c6.507,0,11.571,2.169,17.352,7.954v-16.631%20c-5.78-2.891-10.846-4.338-17.352-4.338c-9.192,0.657-17.859,4.371-24.507,10.203l0,0c-1.916,1.724-3.752,3.627-5.309,5.805%20c-4.856,6.294-7.791,14.001-7.791,22.32c0,20.967,16.637,36.875,37.606,36.875c0.102,0,0.203-0.009,0.302-0.01%20c0.141,0.002,0.28,0.01,0.42,0.01c5.784,0,10.85-1.443,17.357-4.336L227.198,271.909c-0.244,0.244,0.242,0.471,0,0.702V271.909z'/%3e%3cpolygon%20style='fill:%23E7E8E3;'%20points='356.863,228.033%20356.863,228.033%20340.487,268.295%20321.685,220.566%20306.502,220.566%20336.148,293.601%20344.102,293.601%20375.196,220.566%20360.013,220.566%20'/%3e%3cpolygon%20style='fill:%23E7E8E3;'%20points='380.983,252.384%20380.983,291.435%20420.033,291.435%20420.753,291.435%20420.753,279.861%20408.461,279.861%20395.445,279.861%20395.445,266.848%20395.445,260.342%20420.033,260.342%20420.033,248.045%20395.445,248.045%20395.445,232.861%20420.753,232.861%20420.753,220.566%20380.983,220.566%20'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M54.135,220.566H33.884v70.869h20.25c10.845,0,18.798-2.895,25.306-7.957%20c7.953-6.508,13.017-16.629,13.017-27.474C92.458,235.028,77.27,220.566,54.135,220.566z%20M70.765,274.08%20c-4.339,3.614-10.124,5.781-18.802,5.781h-4.339V232.86h3.615c8.678,0,14.463,1.446,18.803,5.783%20c5.061,4.336,7.955,10.848,7.955,17.358C78.72,262.509,75.828,269.737,70.765,274.08z'/%3e%3crect%20x='98.97'%20y='220.56'%20style='fill:%23E7E8E3;'%20width='13.739'%20height='70.867'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M147.415,248.045c-8.676-2.892-10.848-5.063-10.848-8.677c0-4.339,4.339-7.954,10.124-7.954%20c4.339,0,7.954,1.447,11.57,5.786l7.233-9.4c-5.787-5.064-13.015-7.953-20.97-7.953c-12.296,0-22.42,8.678-22.42,20.244%20c0,10.126,4.343,14.464,17.357,19.526c5.785,2.166,7.955,2.892,9.404,4.338c2.887,1.444,4.336,4.339,4.336,7.228%20c0,5.786-4.336,10.126-10.848,10.126c-6.514,0-12.294-3.615-15.187-9.401l-8.678,8.678c6.511,9.4,14.465,13.738,24.589,13.738%20c14.461,0,24.58-9.4,24.58-23.141C167.659,258.893,163.324,253.831,147.415,248.045z'/%3e%3cpath%20style='fill:%23E7E8E3;'%20d='M459.804,261.783c10.843-2.166,16.63-9.4,16.63-20.244c0-13.014-9.402-20.973-25.308-20.973h-20.972%20v70.869h13.739V263.23h2.172l19.519,28.205h16.634L459.804,261.783z%20M448.23,253.105h-4.336v-21.691h4.336%20c8.678,0,13.742,3.614,13.742,10.85C461.972,249.492,456.909,253.105,448.23,253.105z'/%3e%3c/g%3e%3c/svg%3e", Dt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20height='800px'%20width='800px'%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%20291.791%20291.791'%20xml:space='preserve'%3e%3cg%3e%3cpath%20style='fill:%23E2574C;'%20d='M182.298,145.895c0,50.366-40.801,91.176-91.149,91.176S0,196.252,0,145.895%20s40.811-91.176,91.149-91.176S182.298,95.538,182.298,145.895z'/%3e%3cpath%20style='fill:%23F4B459;'%20d='M200.616,54.719c-20.442,0-39.261,6.811-54.469,18.181l0.073,0.009%20c2.991,2.89,6.291,4.924,8.835,8.251l-18.965,0.301c-2.972,3-5.68,6.264-8.233,9.656H161.3c2.544,3.054,4.896,5.708,7.03,9.081%20h-46.536c-1.705,2.936-3.282,5.954-4.659,9.09h56.493c1.477,3.127,2.799,5.489,3.921,8.799h-63.76%20c-1.012,3.146-1.878,6.364-2.535,9.646h68.966c0.675,3.155,1.194,6.072,1.55,9.045h-71.884c-0.301,3-0.456,6.045-0.456,9.118%20h72.859c0,3.228-0.228,6.218-0.556,9.118h-71.847c0.31,3.091,0.766,6.127,1.368,9.118h68.856c-0.711,2.954-1.532,5.926-2.562,9.008%20h-63.969c0.966,3.118,2.143,6.145,3.428,9.099h56.621c-1.568,3.319-3.346,5.972-5.306,9.081h-46.691%20c1.842,3.191,3.875,6.236,6.081,9.154l33.589,0.501c-2.863,3.437-6.537,5.507-9.884,8.516c0.182,0.146-5.352-0.018-16.248-0.191%20c16.576,17.105,39.744,27.772,65.446,27.772c50.357,0,91.176-40.82,91.176-91.176S250.981,54.719,200.616,54.719z'/%3e%3c/g%3e%3c/svg%3e", Vt = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%20-140%20780%20780'%20enable-background='new%200%200%20780%20500'%20version='1.1'%20xml:space='preserve'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M40,0h700c22.092,0,40,17.909,40,40v420c0,22.092-17.908,40-40,40H40c-22.091,0-40-17.908-40-40V40%20C0,17.909,17.909,0,40,0z'%20fill='%230E4595'/%3e%3cpath%20d='m293.2%20348.73l33.361-195.76h53.36l-33.385%20195.76h-53.336zm246.11-191.54c-10.57-3.966-27.137-8.222-47.822-8.222-52.725%200-89.865%2026.55-90.18%2064.603-0.299%2028.13%2026.514%2043.822%2046.752%2053.186%2020.771%209.595%2027.752%2015.714%2027.654%2024.283-0.131%2013.121-16.586%2019.116-31.922%2019.116-21.357%200-32.703-2.967-50.227-10.276l-6.876-3.11-7.489%2043.823c12.463%205.464%2035.51%2010.198%2059.438%2010.443%2056.09%200%2092.5-26.246%2092.916-66.882%200.199-22.269-14.016-39.216-44.801-53.188-18.65-9.055-30.072-15.099-29.951-24.268%200-8.137%209.668-16.839%2030.557-16.839%2017.449-0.27%2030.09%203.535%2039.938%207.5l4.781%202.26%207.232-42.429m137.31-4.223h-41.232c-12.773%200-22.332%203.487-27.941%2016.234l-79.244%20179.4h56.031s9.16-24.123%2011.232-29.418c6.125%200%2060.555%200.084%2068.338%200.084%201.596%206.853%206.49%2029.334%206.49%2029.334h49.514l-43.188-195.64zm-65.418%20126.41c4.412-11.279%2021.26-54.723%2021.26-54.723-0.316%200.522%204.379-11.334%207.074-18.684l3.605%2016.879s10.219%2046.729%2012.354%2056.528h-44.293zm-363.3-126.41l-52.24%20133.5-5.567-27.13c-9.725-31.273-40.025-65.155-73.898-82.118l47.766%20171.2%2056.456-0.064%2084.004-195.39h-56.521'%20fill='%23ffffff'/%3e%3cpath%20d='m146.92%20152.96h-86.041l-0.681%204.073c66.938%2016.204%20111.23%2055.363%20129.62%20102.41l-18.71-89.96c-3.23-12.395-12.597-16.094-24.186-16.527'%20fill='%23F2AE14'/%3e%3c/svg%3e", M = [
1426
1483
  {
1427
1484
  type: "visa",
1428
- imgSrc: zt
1485
+ imgSrc: Vt
1429
1486
  },
1430
1487
  {
1431
1488
  type: "masterCard",
1432
- imgSrc: Vt
1489
+ imgSrc: Dt
1433
1490
  },
1434
1491
  {
1435
1492
  type: "americanExpress",
1436
- imgSrc: Nt
1493
+ imgSrc: Pt
1437
1494
  },
1438
1495
  {
1439
1496
  type: "discover",
1440
- imgSrc: Pt
1497
+ imgSrc: zt
1441
1498
  }
1442
1499
  ];
1443
1500
  class At extends h {
@@ -1446,26 +1503,26 @@ class At extends h {
1446
1503
  super("div", []), this.cardType = e.cardType;
1447
1504
  const t = document.createElement("label");
1448
1505
  t.setAttribute("for", "cardNumber"), t.textContent = e.label, t.style.color = e.styles.color, t.style.fontSize = `${e.styles.fontSize}px`, t.style.display = "block", t.style.marginBottom = "6px", this.getElement().appendChild(t);
1449
- const i = document.createElement("div");
1450
- i.className = e.isLoading ? "loading" : "", i.style.borderRadius = `${e.styles.borderRadius}px ${e.styles.borderRadius}px 0px 0px`;
1451
1506
  const a = document.createElement("div");
1452
- a.id = "card-element", a.className = `card-element ${e.isFocused ? "card-element-focus" : ""}`, a.style.zIndex = e.isFocused ? "2" : "0";
1507
+ a.className = e.isLoading ? "loading" : "", a.style.borderRadius = `${e.styles.borderRadius}px ${e.styles.borderRadius}px 0px 0px`;
1508
+ const i = document.createElement("div");
1509
+ i.id = "card-element", i.className = `card-element ${e.isFocused ? "card-element-focus" : ""}`, i.style.zIndex = e.isFocused ? "2" : "0";
1453
1510
  const r = document.createElement("div");
1454
1511
  if (r.className = "cards-position", e.cardType === "unknown")
1455
- L.forEach((s) => {
1512
+ M.forEach((s) => {
1456
1513
  r.appendChild(this.createCardIcon(s));
1457
1514
  });
1458
1515
  else {
1459
- const s = L.find((o) => o.type === e.cardType);
1516
+ const s = M.find((n) => n.type === e.cardType);
1460
1517
  s && r.appendChild(this.createCardIcon(s));
1461
1518
  }
1462
- a.appendChild(r), i.appendChild(a), this.getElement().appendChild(i);
1519
+ i.appendChild(r), a.appendChild(i), this.getElement().appendChild(a);
1463
1520
  }
1464
1521
  createCardIcon(e) {
1465
1522
  const t = document.createElement("div");
1466
1523
  t.className = "card-icon";
1467
- const i = document.createElement("img");
1468
- return i.src = e.imgSrc, t.appendChild(i), t;
1524
+ const a = document.createElement("img");
1525
+ return a.src = e.imgSrc, t.appendChild(a), t;
1469
1526
  }
1470
1527
  setFocused(e) {
1471
1528
  const t = this.getElement().querySelector(
@@ -1484,22 +1541,22 @@ class At extends h {
1484
1541
  if (this.cardType === t)
1485
1542
  return this;
1486
1543
  this.cardType = t;
1487
- const i = this.getElement().querySelector(".cards-position");
1488
- if (i)
1489
- if (i.innerHTML = "", this.cardType === "unknown")
1490
- L.forEach((a) => {
1491
- i.appendChild(this.createCardIcon(a));
1544
+ const a = this.getElement().querySelector(".cards-position");
1545
+ if (a)
1546
+ if (a.innerHTML = "", this.cardType === "unknown")
1547
+ M.forEach((i) => {
1548
+ a.appendChild(this.createCardIcon(i));
1492
1549
  });
1493
1550
  else {
1494
- const a = L.find((r) => r.type === this.cardType);
1495
- a ? i.appendChild(this.createCardIcon(a)) : L.forEach((r) => {
1496
- i.appendChild(this.createCardIcon(r));
1551
+ const i = M.find((r) => r.type === this.cardType);
1552
+ i ? a.appendChild(this.createCardIcon(i)) : M.forEach((r) => {
1553
+ a.appendChild(this.createCardIcon(r));
1497
1554
  });
1498
1555
  }
1499
1556
  return this;
1500
1557
  }
1501
1558
  }
1502
- class Dt extends h {
1559
+ class $t extends h {
1503
1560
  cardNumber;
1504
1561
  cardExpiry;
1505
1562
  cardCvv;
@@ -1508,47 +1565,47 @@ class Dt extends h {
1508
1565
  super("div", []);
1509
1566
  const {
1510
1567
  checkoutProfile: t,
1511
- isLoading: i,
1512
- isFocused: a,
1568
+ isLoading: a,
1569
+ isFocused: i,
1513
1570
  isCvvFocused: r,
1514
1571
  isCcValid: s,
1515
- isCvvValid: o,
1572
+ isCvvValid: n,
1516
1573
  isCcTouched: l,
1517
1574
  isCvvTouched: c,
1518
1575
  cardType: d,
1519
- cardExpiry: u,
1520
- cardExpiryError: f,
1521
- cardExpiryTouched: g,
1522
- onChange: x,
1576
+ cardExpiry: p,
1577
+ cardExpiryError: g,
1578
+ cardExpiryTouched: y,
1579
+ onChange: F,
1523
1580
  onBlur: I,
1524
- translationFunc: m,
1525
- cardExpiryAutocomplete: C = "cc-exp"
1526
- } = e, w = document.createElement("div");
1581
+ translationFunc: u,
1582
+ cardExpiryAutocomplete: b = "cc-exp"
1583
+ } = e, k = document.createElement("div");
1527
1584
  this.cardNumber = new At({
1528
1585
  styles: {
1529
1586
  color: t.styles.textColor,
1530
1587
  fontSize: t.styles.fontSize,
1531
1588
  borderRadius: t.styles.borderRadius
1532
1589
  },
1533
- label: m("cardInformation"),
1534
- isLoading: i,
1535
- isFocused: a,
1590
+ label: u("cardInformation"),
1591
+ isLoading: a,
1592
+ isFocused: i,
1536
1593
  cardType: d
1537
- }), w.appendChild(this.cardNumber.getElement());
1538
- const y = document.createElement("div");
1539
- y.className = "card-details", this.cardExpiry = new V({
1594
+ }), k.appendChild(this.cardNumber.getElement());
1595
+ const v = document.createElement("div");
1596
+ v.className = "card-details", this.cardExpiry = new z({
1540
1597
  name: "cardExpiry",
1541
1598
  type: "tel",
1542
- placeholder: m("cardExpiry"),
1599
+ placeholder: u("cardExpiry"),
1543
1600
  // Always hide error initially
1544
1601
  error: !1,
1545
- errorMsg: f,
1546
- value: u,
1547
- autocomplete: C,
1548
- onChange: (p) => {
1602
+ errorMsg: g,
1603
+ value: p,
1604
+ autocomplete: b,
1605
+ onChange: (f) => {
1549
1606
  this.cardExpiry.setError(!1);
1550
- const S = this.validationMessages.get("cardExpiry");
1551
- S && (S.getElement().remove(), this.validationMessages.delete("cardExpiry"), this.updateErrorContainerHeight()), this.trimCardExpiry(), x(p);
1607
+ const x = this.validationMessages.get("cardExpiry");
1608
+ x && (x.getElement().remove(), this.validationMessages.delete("cardExpiry"), this.updateErrorContainerHeight()), this.trimCardExpiry(), F(f);
1552
1609
  },
1553
1610
  styles: {
1554
1611
  color: t.styles.textColor,
@@ -1556,65 +1613,65 @@ class Dt extends h {
1556
1613
  fontSize: t.styles.fontSize,
1557
1614
  fontFamily: t.styles.fontFamily
1558
1615
  }
1559
- }), this.cardExpiry.addEventListener("blur", (p) => {
1560
- f && g && this.cardExpiry.setError(!0, f), I(p);
1561
- }), this.cardExpiry.addEventListener("keydown", (p) => {
1562
- const S = p, B = [
1616
+ }), this.cardExpiry.addEventListener("blur", (f) => {
1617
+ g && y && this.cardExpiry.setError(!0, g), I(f);
1618
+ }), this.cardExpiry.addEventListener("keydown", (f) => {
1619
+ const x = f, R = [
1563
1620
  "Backspace",
1564
1621
  "Delete",
1565
1622
  "ArrowLeft",
1566
1623
  "ArrowRight",
1567
1624
  "Tab"
1568
- ], H = this.cardExpiry.getValue().replace(/\D/g, "");
1569
- B.includes(S.key) || (!/^\d$/.test(S.key) || H.length >= 4 && !S.isComposing) && S.preventDefault();
1625
+ ], B = this.cardExpiry.getValue().replace(/\D/g, "");
1626
+ R.includes(x.key) || (!/^\d$/.test(x.key) || B.length >= 4 && !x.isComposing) && x.preventDefault();
1570
1627
  });
1571
- const M = this.cardExpiry.getElement();
1572
- M.style.height = "38.5px";
1573
- const b = document.createElement("div");
1574
- b.className = "input-wrapper", this.cardCvv = new It({
1628
+ const w = this.cardExpiry.getElement();
1629
+ w.style.height = "38.5px";
1630
+ const S = document.createElement("div");
1631
+ S.className = "input-wrapper", this.cardCvv = new Nt({
1575
1632
  styles: {
1576
1633
  borderRadius: typeof t.styles.borderRadius == "number" ? t.styles.borderRadius : 0
1577
1634
  },
1578
- isLoading: i,
1635
+ isLoading: a,
1579
1636
  isFocused: r
1580
- }), b.appendChild(this.cardCvv.getElement()), y.appendChild(this.cardExpiry.getElement()), y.appendChild(b), w.appendChild(y);
1581
- const v = document.createElement("div");
1582
- if (v.className = "error-messages-container", v.style.width = "100%", v.style.transition = "height 0.3s ease-in-out, opacity 0.3s ease-in-out", v.style.overflow = "hidden", v.style.height = "0px", v.style.opacity = "0", this.getElement().appendChild(w), this.getElement().appendChild(v), (a || l) && !s) {
1583
- const p = new E({
1584
- text: m("validation.cardNumberInvalid")
1637
+ }), S.appendChild(this.cardCvv.getElement()), v.appendChild(this.cardExpiry.getElement()), v.appendChild(S), k.appendChild(v);
1638
+ const E = document.createElement("div");
1639
+ if (E.className = "error-messages-container", E.style.width = "100%", E.style.transition = "height 0.3s ease-in-out, opacity 0.3s ease-in-out", E.style.overflow = "hidden", E.style.height = "0px", E.style.opacity = "0", this.getElement().appendChild(k), this.getElement().appendChild(E), (i || l) && !s) {
1640
+ const f = new C({
1641
+ text: u("validation.cardNumberInvalid")
1585
1642
  });
1586
- this.validationMessages.set("cardNumber", p), v.appendChild(p.getElement());
1643
+ this.validationMessages.set("cardNumber", f), E.appendChild(f.getElement());
1587
1644
  }
1588
- if ((r || c) && !o) {
1589
- const p = new E({
1590
- text: m("validation.cardSecurityFormat")
1645
+ if ((r || c) && !n) {
1646
+ const f = new C({
1647
+ text: u("validation.cardSecurityFormat")
1591
1648
  });
1592
- this.validationMessages.set("cardCvv", p), v.appendChild(p.getElement());
1649
+ this.validationMessages.set("cardCvv", f), E.appendChild(f.getElement());
1593
1650
  }
1594
- if (f && g) {
1595
- const p = new E({
1596
- text: f
1651
+ if (g && y) {
1652
+ const f = new C({
1653
+ text: g
1597
1654
  });
1598
- this.validationMessages.set("cardExpiry", p), v.appendChild(p.getElement());
1655
+ this.validationMessages.set("cardExpiry", f), E.appendChild(f.getElement());
1599
1656
  }
1600
1657
  setTimeout(() => this.updateErrorContainerHeight(), 0);
1601
1658
  }
1602
1659
  updateCardType(e) {
1603
1660
  return this.cardNumber.updateCardType(e), this;
1604
1661
  }
1605
- updateCardExpiry(e, t, i) {
1662
+ updateCardExpiry(e, t, a) {
1606
1663
  this.cardExpiry.setValue(e);
1607
- const a = this.getElement().querySelector(
1664
+ const i = this.getElement().querySelector(
1608
1665
  ".error-messages-container"
1609
1666
  ), r = this.cardExpiry.getElement().querySelector("input"), s = document.activeElement === r;
1610
- if (t && i && !s)
1667
+ if (t && a && !s)
1611
1668
  if (this.cardExpiry.setError(!1), this.validationMessages.has("cardExpiry"))
1612
1669
  this.validationMessages.get("cardExpiry")?.setText(t);
1613
1670
  else {
1614
- const l = new E({
1671
+ const l = new C({
1615
1672
  text: t
1616
1673
  });
1617
- this.validationMessages.set("cardExpiry", l), a.appendChild(l.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1674
+ this.validationMessages.set("cardExpiry", l), i.appendChild(l.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1618
1675
  }
1619
1676
  else if (this.cardExpiry.setError(!1), s) {
1620
1677
  const l = this.validationMessages.get("cardExpiry");
@@ -1632,43 +1689,43 @@ class Dt extends h {
1632
1689
  const e = this.getCardExpiryValue().trim();
1633
1690
  return this.cardExpiry.setValue(e), this;
1634
1691
  }
1635
- updateCardNumberValidation(e, t, i, a = !1) {
1692
+ updateCardNumberValidation(e, t, a, i = !1) {
1636
1693
  this.cardNumber.setFocused(e);
1637
1694
  const r = this.getElement().querySelector(
1638
1695
  ".error-messages-container"
1639
1696
  ), s = t !== !1;
1640
1697
  if (e) {
1641
- const o = this.validationMessages.get("cardNumber");
1642
- return o && (o.getElement().remove(), this.validationMessages.delete("cardNumber"), this.updateErrorContainerHeight()), this;
1698
+ const n = this.validationMessages.get("cardNumber");
1699
+ return n && (n.getElement().remove(), this.validationMessages.delete("cardNumber"), this.updateErrorContainerHeight()), this;
1643
1700
  }
1644
- if (!e && a && !s) {
1701
+ if (!e && i && !s) {
1645
1702
  if (!this.validationMessages.has("cardNumber")) {
1646
- const o = new E({
1647
- text: i("validation.cardNumberInvalid")
1703
+ const n = new C({
1704
+ text: a("validation.cardNumberInvalid")
1648
1705
  });
1649
- this.validationMessages.set("cardNumber", o), r.appendChild(o.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1706
+ this.validationMessages.set("cardNumber", n), r.appendChild(n.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1650
1707
  }
1651
1708
  } else {
1652
- const o = this.validationMessages.get("cardNumber");
1653
- o && (o.getElement().remove(), this.validationMessages.delete("cardNumber"), this.updateErrorContainerHeight());
1709
+ const n = this.validationMessages.get("cardNumber");
1710
+ n && (n.getElement().remove(), this.validationMessages.delete("cardNumber"), this.updateErrorContainerHeight());
1654
1711
  }
1655
1712
  return this;
1656
1713
  }
1657
- updateCardCvvValidation(e, t, i, a = !1) {
1714
+ updateCardCvvValidation(e, t, a, i = !1) {
1658
1715
  this.cardCvv.setFocused(e);
1659
1716
  const r = this.getElement().querySelector(
1660
1717
  ".error-messages-container"
1661
1718
  );
1662
- if (!e && a && !(t !== !1)) {
1719
+ if (!e && i && !(t !== !1)) {
1663
1720
  if (!this.validationMessages.has("cardCvv")) {
1664
- const o = new E({
1665
- text: i("validation.cardSecurityFormat")
1721
+ const n = new C({
1722
+ text: a("validation.cardSecurityFormat")
1666
1723
  });
1667
- this.validationMessages.set("cardCvv", o), r.appendChild(o.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1724
+ this.validationMessages.set("cardCvv", n), r.appendChild(n.getElement()), setTimeout(() => this.updateErrorContainerHeight(), 0);
1668
1725
  }
1669
1726
  } else {
1670
- const o = this.validationMessages.get("cardCvv");
1671
- o && (o.getElement().remove(), this.validationMessages.delete("cardCvv"), this.updateErrorContainerHeight());
1727
+ const n = this.validationMessages.get("cardCvv");
1728
+ n && (n.getElement().remove(), this.validationMessages.delete("cardCvv"), this.updateErrorContainerHeight());
1672
1729
  }
1673
1730
  return this;
1674
1731
  }
@@ -1687,10 +1744,10 @@ class Dt extends h {
1687
1744
  if (this.validationMessages.size === 0)
1688
1745
  e.style.height = "0px", e.style.opacity = "0";
1689
1746
  else {
1690
- const t = e.style.height, i = e.style.overflow;
1747
+ const t = e.style.height, a = e.style.overflow;
1691
1748
  e.style.height = "auto", e.style.overflow = "visible";
1692
- const a = e.scrollHeight;
1693
- e.style.overflow = i, e.style.height = t, e.offsetHeight, e.style.height = a + 4 + "px", e.style.opacity = "1";
1749
+ const i = e.scrollHeight;
1750
+ e.style.overflow = a, e.style.height = t, e.offsetHeight, e.style.height = i + 4 + "px", e.style.opacity = "1";
1694
1751
  }
1695
1752
  }
1696
1753
  /**
@@ -1712,30 +1769,30 @@ class Dt extends h {
1712
1769
  this.focusField("cardExpiry");
1713
1770
  }
1714
1771
  }
1715
- class $t {
1772
+ class Rt {
1716
1773
  input;
1717
1774
  constructor(e) {
1718
1775
  const {
1719
1776
  value: t,
1720
- onChange: i,
1721
- onBlur: a,
1777
+ onChange: a,
1778
+ onBlur: i,
1722
1779
  error: r,
1723
1780
  errorMsg: s,
1724
- checkoutProfile: o,
1781
+ checkoutProfile: n,
1725
1782
  translationFunc: l,
1726
1783
  autocomplete: c = "email"
1727
1784
  } = e;
1728
- this.input = new V({
1785
+ this.input = new z({
1729
1786
  name: "email",
1730
1787
  label: l("email"),
1731
1788
  // Always hide error initially - we'll show it only on blur if needed
1732
1789
  error: !1,
1733
1790
  errorMsg: s,
1734
1791
  styles: {
1735
- color: o.styles.textColor,
1736
- borderRadius: `${o.styles.borderRadius}px`,
1737
- fontSize: o.styles.fontSize,
1738
- fontFamily: o.styles.fontFamily
1792
+ color: n.styles.textColor,
1793
+ borderRadius: `${n.styles.borderRadius}px`,
1794
+ fontSize: n.styles.fontSize,
1795
+ fontFamily: n.styles.fontFamily
1739
1796
  },
1740
1797
  placeholder: l("email"),
1741
1798
  type: "email",
@@ -1743,10 +1800,10 @@ class $t {
1743
1800
  autocomplete: c,
1744
1801
  // Wrap the original onChange to apply trim and hide errors during typing
1745
1802
  onChange: (d) => {
1746
- this.input.setError(!1), this.trim(), i(d);
1803
+ this.input.setError(!1), this.trim(), a(d);
1747
1804
  }
1748
1805
  }), this.input.addEventListener("blur", (d) => {
1749
- r && this.input.setError(r, s), a(d);
1806
+ r && this.input.setError(r, s), i(d);
1750
1807
  });
1751
1808
  }
1752
1809
  getValue() {
@@ -1772,19 +1829,19 @@ class $t {
1772
1829
  this.input.focus();
1773
1830
  }
1774
1831
  }
1775
- const Rt = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='101px'%20height='32'%20viewBox='0%200%20101%2032'%20preserveAspectRatio='xMinYMin%20meet'%3e%3cpath%20fill='%23003087'%20d='M%2012.237%202.8%20L%204.437%202.8%20C%203.937%202.8%203.437%203.2%203.337%203.7%20L%200.237%2023.7%20C%200.137%2024.1%200.437%2024.4%200.837%2024.4%20L%204.537%2024.4%20C%205.037%2024.4%205.537%2024%205.637%2023.5%20L%206.437%2018.1%20C%206.537%2017.6%206.937%2017.2%207.537%2017.2%20L%2010.037%2017.2%20C%2015.137%2017.2%2018.137%2014.7%2018.937%209.8%20C%2019.237%207.7%2018.937%206%2017.937%204.8%20C%2016.837%203.5%2014.837%202.8%2012.237%202.8%20Z%20M%2013.137%2010.1%20C%2012.737%2012.9%2010.537%2012.9%208.537%2012.9%20L%207.337%2012.9%20L%208.137%207.7%20C%208.137%207.4%208.437%207.2%208.737%207.2%20L%209.237%207.2%20C%2010.637%207.2%2011.937%207.2%2012.637%208%20C%2013.137%208.4%2013.337%209.1%2013.137%2010.1%20Z'/%3e%3cpath%20fill='%23003087'%20d='M%2035.437%2010%20L%2031.737%2010%20C%2031.437%2010%2031.137%2010.2%2031.137%2010.5%20L%2030.937%2011.5%20L%2030.637%2011.1%20C%2029.837%209.9%2028.037%209.5%2026.237%209.5%20C%2022.137%209.5%2018.637%2012.6%2017.937%2017%20C%2017.537%2019.2%2018.037%2021.3%2019.337%2022.7%20C%2020.437%2024%2022.137%2024.6%2024.037%2024.6%20C%2027.337%2024.6%2029.237%2022.5%2029.237%2022.5%20L%2029.037%2023.5%20C%2028.937%2023.9%2029.237%2024.3%2029.637%2024.3%20L%2033.037%2024.3%20C%2033.537%2024.3%2034.037%2023.9%2034.137%2023.4%20L%2036.137%2010.6%20C%2036.237%2010.4%2035.837%2010%2035.437%2010%20Z%20M%2030.337%2017.2%20C%2029.937%2019.3%2028.337%2020.8%2026.137%2020.8%20C%2025.037%2020.8%2024.237%2020.5%2023.637%2019.8%20C%2023.037%2019.1%2022.837%2018.2%2023.037%2017.2%20C%2023.337%2015.1%2025.137%2013.6%2027.237%2013.6%20C%2028.337%2013.6%2029.137%2014%2029.737%2014.6%20C%2030.237%2015.3%2030.437%2016.2%2030.337%2017.2%20Z'/%3e%3cpath%20fill='%23003087'%20d='M%2055.337%2010%20L%2051.637%2010%20C%2051.237%2010%2050.937%2010.2%2050.737%2010.5%20L%2045.537%2018.1%20L%2043.337%2010.8%20C%2043.237%2010.3%2042.737%2010%2042.337%2010%20L%2038.637%2010%20C%2038.237%2010%2037.837%2010.4%2038.037%2010.9%20L%2042.137%2023%20L%2038.237%2028.4%20C%2037.937%2028.8%2038.237%2029.4%2038.737%2029.4%20L%2042.437%2029.4%20C%2042.837%2029.4%2043.137%2029.2%2043.337%2028.9%20L%2055.837%2010.9%20C%2056.137%2010.6%2055.837%2010%2055.337%2010%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2067.737%202.8%20L%2059.937%202.8%20C%2059.437%202.8%2058.937%203.2%2058.837%203.7%20L%2055.737%2023.6%20C%2055.637%2024%2055.937%2024.3%2056.337%2024.3%20L%2060.337%2024.3%20C%2060.737%2024.3%2061.037%2024%2061.037%2023.7%20L%2061.937%2018%20C%2062.037%2017.5%2062.437%2017.1%2063.037%2017.1%20L%2065.537%2017.1%20C%2070.637%2017.1%2073.637%2014.6%2074.437%209.7%20C%2074.737%207.6%2074.437%205.9%2073.437%204.7%20C%2072.237%203.5%2070.337%202.8%2067.737%202.8%20Z%20M%2068.637%2010.1%20C%2068.237%2012.9%2066.037%2012.9%2064.037%2012.9%20L%2062.837%2012.9%20L%2063.637%207.7%20C%2063.637%207.4%2063.937%207.2%2064.237%207.2%20L%2064.737%207.2%20C%2066.137%207.2%2067.437%207.2%2068.137%208%20C%2068.637%208.4%2068.737%209.1%2068.637%2010.1%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2090.937%2010%20L%2087.237%2010%20C%2086.937%2010%2086.637%2010.2%2086.637%2010.5%20L%2086.437%2011.5%20L%2086.137%2011.1%20C%2085.337%209.9%2083.537%209.5%2081.737%209.5%20C%2077.637%209.5%2074.137%2012.6%2073.437%2017%20C%2073.037%2019.2%2073.537%2021.3%2074.837%2022.7%20C%2075.937%2024%2077.637%2024.6%2079.537%2024.6%20C%2082.837%2024.6%2084.737%2022.5%2084.737%2022.5%20L%2084.537%2023.5%20C%2084.437%2023.9%2084.737%2024.3%2085.137%2024.3%20L%2088.537%2024.3%20C%2089.037%2024.3%2089.537%2023.9%2089.637%2023.4%20L%2091.637%2010.6%20C%2091.637%2010.4%2091.337%2010%2090.937%2010%20Z%20M%2085.737%2017.2%20C%2085.337%2019.3%2083.737%2020.8%2081.537%2020.8%20C%2080.437%2020.8%2079.637%2020.5%2079.037%2019.8%20C%2078.437%2019.1%2078.237%2018.2%2078.437%2017.2%20C%2078.737%2015.1%2080.537%2013.6%2082.637%2013.6%20C%2083.737%2013.6%2084.537%2014%2085.137%2014.6%20C%2085.737%2015.3%2085.937%2016.2%2085.737%2017.2%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2095.337%203.3%20L%2092.137%2023.6%20C%2092.037%2024%2092.337%2024.3%2092.737%2024.3%20L%2095.937%2024.3%20C%2096.437%2024.3%2096.937%2023.9%2097.037%2023.4%20L%20100.237%203.5%20C%20100.337%203.1%20100.037%202.8%2099.637%202.8%20L%2096.037%202.8%20C%2095.637%202.8%2095.437%203%2095.337%203.3%20Z'/%3e%3c/svg%3e";
1776
- class Bt extends h {
1832
+ const Bt = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='101px'%20height='32'%20viewBox='0%200%20101%2032'%20preserveAspectRatio='xMinYMin%20meet'%3e%3cpath%20fill='%23003087'%20d='M%2012.237%202.8%20L%204.437%202.8%20C%203.937%202.8%203.437%203.2%203.337%203.7%20L%200.237%2023.7%20C%200.137%2024.1%200.437%2024.4%200.837%2024.4%20L%204.537%2024.4%20C%205.037%2024.4%205.537%2024%205.637%2023.5%20L%206.437%2018.1%20C%206.537%2017.6%206.937%2017.2%207.537%2017.2%20L%2010.037%2017.2%20C%2015.137%2017.2%2018.137%2014.7%2018.937%209.8%20C%2019.237%207.7%2018.937%206%2017.937%204.8%20C%2016.837%203.5%2014.837%202.8%2012.237%202.8%20Z%20M%2013.137%2010.1%20C%2012.737%2012.9%2010.537%2012.9%208.537%2012.9%20L%207.337%2012.9%20L%208.137%207.7%20C%208.137%207.4%208.437%207.2%208.737%207.2%20L%209.237%207.2%20C%2010.637%207.2%2011.937%207.2%2012.637%208%20C%2013.137%208.4%2013.337%209.1%2013.137%2010.1%20Z'/%3e%3cpath%20fill='%23003087'%20d='M%2035.437%2010%20L%2031.737%2010%20C%2031.437%2010%2031.137%2010.2%2031.137%2010.5%20L%2030.937%2011.5%20L%2030.637%2011.1%20C%2029.837%209.9%2028.037%209.5%2026.237%209.5%20C%2022.137%209.5%2018.637%2012.6%2017.937%2017%20C%2017.537%2019.2%2018.037%2021.3%2019.337%2022.7%20C%2020.437%2024%2022.137%2024.6%2024.037%2024.6%20C%2027.337%2024.6%2029.237%2022.5%2029.237%2022.5%20L%2029.037%2023.5%20C%2028.937%2023.9%2029.237%2024.3%2029.637%2024.3%20L%2033.037%2024.3%20C%2033.537%2024.3%2034.037%2023.9%2034.137%2023.4%20L%2036.137%2010.6%20C%2036.237%2010.4%2035.837%2010%2035.437%2010%20Z%20M%2030.337%2017.2%20C%2029.937%2019.3%2028.337%2020.8%2026.137%2020.8%20C%2025.037%2020.8%2024.237%2020.5%2023.637%2019.8%20C%2023.037%2019.1%2022.837%2018.2%2023.037%2017.2%20C%2023.337%2015.1%2025.137%2013.6%2027.237%2013.6%20C%2028.337%2013.6%2029.137%2014%2029.737%2014.6%20C%2030.237%2015.3%2030.437%2016.2%2030.337%2017.2%20Z'/%3e%3cpath%20fill='%23003087'%20d='M%2055.337%2010%20L%2051.637%2010%20C%2051.237%2010%2050.937%2010.2%2050.737%2010.5%20L%2045.537%2018.1%20L%2043.337%2010.8%20C%2043.237%2010.3%2042.737%2010%2042.337%2010%20L%2038.637%2010%20C%2038.237%2010%2037.837%2010.4%2038.037%2010.9%20L%2042.137%2023%20L%2038.237%2028.4%20C%2037.937%2028.8%2038.237%2029.4%2038.737%2029.4%20L%2042.437%2029.4%20C%2042.837%2029.4%2043.137%2029.2%2043.337%2028.9%20L%2055.837%2010.9%20C%2056.137%2010.6%2055.837%2010%2055.337%2010%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2067.737%202.8%20L%2059.937%202.8%20C%2059.437%202.8%2058.937%203.2%2058.837%203.7%20L%2055.737%2023.6%20C%2055.637%2024%2055.937%2024.3%2056.337%2024.3%20L%2060.337%2024.3%20C%2060.737%2024.3%2061.037%2024%2061.037%2023.7%20L%2061.937%2018%20C%2062.037%2017.5%2062.437%2017.1%2063.037%2017.1%20L%2065.537%2017.1%20C%2070.637%2017.1%2073.637%2014.6%2074.437%209.7%20C%2074.737%207.6%2074.437%205.9%2073.437%204.7%20C%2072.237%203.5%2070.337%202.8%2067.737%202.8%20Z%20M%2068.637%2010.1%20C%2068.237%2012.9%2066.037%2012.9%2064.037%2012.9%20L%2062.837%2012.9%20L%2063.637%207.7%20C%2063.637%207.4%2063.937%207.2%2064.237%207.2%20L%2064.737%207.2%20C%2066.137%207.2%2067.437%207.2%2068.137%208%20C%2068.637%208.4%2068.737%209.1%2068.637%2010.1%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2090.937%2010%20L%2087.237%2010%20C%2086.937%2010%2086.637%2010.2%2086.637%2010.5%20L%2086.437%2011.5%20L%2086.137%2011.1%20C%2085.337%209.9%2083.537%209.5%2081.737%209.5%20C%2077.637%209.5%2074.137%2012.6%2073.437%2017%20C%2073.037%2019.2%2073.537%2021.3%2074.837%2022.7%20C%2075.937%2024%2077.637%2024.6%2079.537%2024.6%20C%2082.837%2024.6%2084.737%2022.5%2084.737%2022.5%20L%2084.537%2023.5%20C%2084.437%2023.9%2084.737%2024.3%2085.137%2024.3%20L%2088.537%2024.3%20C%2089.037%2024.3%2089.537%2023.9%2089.637%2023.4%20L%2091.637%2010.6%20C%2091.637%2010.4%2091.337%2010%2090.937%2010%20Z%20M%2085.737%2017.2%20C%2085.337%2019.3%2083.737%2020.8%2081.537%2020.8%20C%2080.437%2020.8%2079.637%2020.5%2079.037%2019.8%20C%2078.437%2019.1%2078.237%2018.2%2078.437%2017.2%20C%2078.737%2015.1%2080.537%2013.6%2082.637%2013.6%20C%2083.737%2013.6%2084.537%2014%2085.137%2014.6%20C%2085.737%2015.3%2085.937%2016.2%2085.737%2017.2%20Z'/%3e%3cpath%20fill='%23009cde'%20d='M%2095.337%203.3%20L%2092.137%2023.6%20C%2092.037%2024%2092.337%2024.3%2092.737%2024.3%20L%2095.937%2024.3%20C%2096.437%2024.3%2096.937%2023.9%2097.037%2023.4%20L%20100.237%203.5%20C%20100.337%203.1%20100.037%202.8%2099.637%202.8%20L%2096.037%202.8%20C%2095.637%202.8%2095.437%203%2095.337%203.3%20Z'/%3e%3c/svg%3e";
1833
+ class Ht extends h {
1777
1834
  formData;
1778
1835
  onSubmit;
1779
1836
  isSubmitting = !1;
1780
1837
  constructor(e) {
1781
1838
  super("div", ["paypal"]);
1782
- const { formData: t, onSubmit: i } = e;
1783
- this.formData = t, this.onSubmit = i, this.getElement().style.cursor = i ? "pointer" : "default", this.getElement().style.opacity = "1";
1784
- const a = document.createElement("div");
1785
- a.className = "paypal-icon-container";
1839
+ const { formData: t, onSubmit: a } = e;
1840
+ this.formData = t, this.onSubmit = a, this.getElement().style.cursor = a ? "pointer" : "default", this.getElement().style.opacity = "1";
1841
+ const i = document.createElement("div");
1842
+ i.className = "paypal-icon-container";
1786
1843
  const r = document.createElement("img");
1787
- r.src = Rt, r.style.width = "69px", r.style.height = "22px", r.style.maxWidth = "100%", r.style.display = "block", r.style.height = "auto", a.appendChild(r), this.getElement().appendChild(a), i && this.getElement().addEventListener("click", () => this.handleSubmit());
1844
+ r.src = Bt, r.style.width = "69px", r.style.height = "22px", r.style.maxWidth = "100%", r.style.display = "block", r.style.height = "auto", i.appendChild(r), this.getElement().appendChild(i), a && this.getElement().addEventListener("click", () => this.handleSubmit());
1788
1845
  }
1789
1846
  async handleSubmit() {
1790
1847
  if (!(!this.onSubmit || this.isSubmitting)) {
@@ -1805,14 +1862,28 @@ class Bt extends h {
1805
1862
  return this.isSubmitting = e, this.getElement().style.opacity = e ? "0.7" : "1", this;
1806
1863
  }
1807
1864
  }
1808
- class Ht extends h {
1865
+ class Ot extends h {
1866
+ constructor(e) {
1867
+ const { translationFunc: t, checkoutProfile: a } = e;
1868
+ super("div", ["payment-separator"]);
1869
+ const i = this.getElement(), r = document.createElement("span");
1870
+ r.className = "payment-separator__line";
1871
+ const s = document.createElement("p");
1872
+ s.textContent = t("pay-with-card"), s.className = "payment-separator__text", s.style.fontFamily = `${a.styles.fontFamily}, sans-serif`;
1873
+ const n = document.createElement("span");
1874
+ n.className = "payment-separator__line", i.appendChild(r), i.appendChild(s), i.appendChild(n);
1875
+ }
1876
+ }
1877
+ class Kt extends h {
1809
1878
  paymentMethods;
1879
+ paymentSeparator;
1810
1880
  constructor(e) {
1811
1881
  const {
1812
1882
  checkoutProfile: t,
1813
- formData: i,
1814
- onPaypalSubmit: a,
1815
- supportedPaymentMethods: r
1883
+ formData: a,
1884
+ onPaypalSubmit: i,
1885
+ supportedPaymentMethods: r,
1886
+ translationFunc: s
1816
1887
  } = e;
1817
1888
  if (super("div", ["payment-methods"]), this.paymentMethods = /* @__PURE__ */ new Map(), !t?.additionalPaymentMethods) {
1818
1889
  this.getElement().style.display = "none";
@@ -1822,26 +1893,26 @@ class Ht extends h {
1822
1893
  this.getElement().style.display = "none";
1823
1894
  return;
1824
1895
  }
1825
- const s = Object.entries(
1896
+ const n = Object.entries(
1826
1897
  t.additionalPaymentMethods
1827
- ).filter(([o, l]) => {
1828
- const c = l.enabled, d = r ? r[o] === !0 : !0;
1829
- return c && d;
1830
- }).sort((o, l) => o[1].order - l[1].order);
1831
- if (s.length === 0) {
1898
+ ).filter(([l, c]) => {
1899
+ const d = c.enabled, p = r ? r[l] === !0 : !0;
1900
+ return d && p;
1901
+ }).sort((l, c) => l[1].order - c[1].order);
1902
+ if (n.length === 0) {
1832
1903
  this.getElement().style.display = "none";
1833
1904
  return;
1834
1905
  }
1835
- for (const [o] of s)
1836
- switch (o) {
1906
+ for (const [l] of n)
1907
+ switch (l) {
1837
1908
  case "paypal": {
1838
- if (a) {
1839
- const l = new Bt({
1909
+ if (i) {
1910
+ const c = new Ht({
1840
1911
  checkoutProfile: t,
1841
- formData: i,
1842
- onSubmit: a
1912
+ formData: a,
1913
+ onSubmit: i
1843
1914
  });
1844
- this.paymentMethods.set("paypal", l), l.appendTo(this.getElement());
1915
+ this.paymentMethods.set("paypal", c), c.appendTo(this.getElement());
1845
1916
  }
1846
1917
  break;
1847
1918
  }
@@ -1858,10 +1929,14 @@ class Ht extends h {
1858
1929
  // break;
1859
1930
  default:
1860
1931
  console.warn(
1861
- `[PaymentMethods] Unsupported payment method: ${o}`
1932
+ `[PaymentMethods] Unsupported payment method: ${l}`
1862
1933
  );
1863
1934
  break;
1864
1935
  }
1936
+ this.paymentMethods.size > 0 && (this.paymentSeparator = new Ot({
1937
+ translationFunc: s,
1938
+ checkoutProfile: t
1939
+ }), this.getElement().appendChild(this.paymentSeparator.getElement()));
1865
1940
  }
1866
1941
  updateFormData(e) {
1867
1942
  const t = this.paymentMethods.get("paypal");
@@ -1871,8 +1946,8 @@ class Ht extends h {
1871
1946
  return this.paymentMethods.size > 0 && this.getElement().style.display !== "none";
1872
1947
  }
1873
1948
  }
1874
- const Ot = 17;
1875
- class qt extends h {
1949
+ const qt = 17;
1950
+ class jt extends h {
1876
1951
  styles;
1877
1952
  isHovered = !1;
1878
1953
  constructor(e) {
@@ -1883,7 +1958,7 @@ class qt extends h {
1883
1958
  }
1884
1959
  applyStyles() {
1885
1960
  const e = this.getElement();
1886
- e.style.backgroundColor = this.isHovered ? `color-mix(in srgb, ${this.styles.backgroundColor} 80%, transparent)` : this.styles.backgroundColor, e.disabled ? e.style.color = "#cccccc" : e.style.color = this.styles.color, e.style.borderRadius = this.styles.borderRadius === Ot ? "100vmax" : `${this.styles.borderRadius}px`, e.style.fontSize = `${this.styles.fontSize}px`, e.style.fontFamily = `${this.styles.fontFamily}, sans-serif`;
1961
+ e.style.backgroundColor = this.isHovered ? `color-mix(in srgb, ${this.styles.backgroundColor} 80%, transparent)` : this.styles.backgroundColor, e.disabled ? (e.style.color = "rgb(150, 150, 150)", e.style.backgroundColor = "rgb(200, 200, 200)") : e.style.color = this.styles.color, e.style.borderRadius = this.styles.borderRadius === qt ? "100vmax" : `${this.styles.borderRadius}px`, e.style.fontSize = `${this.styles.fontSize}px`, e.style.fontFamily = `${this.styles.fontFamily}, sans-serif`;
1887
1962
  }
1888
1963
  handleMouseEnter() {
1889
1964
  this.isHovered = !0, this.applyStyles();
@@ -1895,20 +1970,20 @@ class qt extends h {
1895
1970
  return this.getElement().disabled = e, e ? (this.addClass("disabled"), this.removeClass("valid")) : (this.removeClass("disabled"), this.addClass("valid")), this.applyStyles(), this;
1896
1971
  }
1897
1972
  }
1898
- class Kt {
1973
+ class Ut {
1899
1974
  button;
1900
1975
  constructor(e) {
1901
- const { disabled: t, checkoutProfile: i, translationFunc: a } = e;
1902
- this.button = new qt({
1903
- text: a(
1904
- `buttonTexts.${i?.layout.actionButton.translationKey}`
1976
+ const { disabled: t, checkoutProfile: a, translationFunc: i } = e;
1977
+ this.button = new jt({
1978
+ text: i(
1979
+ `buttonTexts.${a?.layout.actionButton.translationKey}`
1905
1980
  ),
1906
1981
  styles: {
1907
- backgroundColor: i.styles.buttonColor,
1908
- color: i.styles.buttonTextColor,
1909
- fontFamily: i.styles.fontFamily,
1910
- borderRadius: i.styles.borderRadius,
1911
- fontSize: i.styles.buttonFontSize
1982
+ backgroundColor: a.styles.buttonColor,
1983
+ color: a.styles.buttonTextColor,
1984
+ fontFamily: a.styles.fontFamily,
1985
+ borderRadius: a.styles.borderRadius,
1986
+ fontSize: a.styles.buttonFontSize
1912
1987
  },
1913
1988
  disabled: t
1914
1989
  });
@@ -1919,15 +1994,15 @@ class Kt {
1919
1994
  setDisabled(e) {
1920
1995
  return this.button.setDisabled(e), this;
1921
1996
  }
1922
- addEventListener(e, t, i) {
1923
- return this.button.addEventListener(e, t, i), this;
1997
+ addEventListener(e, t, a) {
1998
+ return this.button.addEventListener(e, t, a), this;
1924
1999
  }
1925
2000
  appendTo(e) {
1926
2001
  return this.button.appendTo(e), this;
1927
2002
  }
1928
2003
  }
1929
- const jt = "https://test-htp.tokenex.com/Iframe/Iframe-v3.min.js", Ut = "https://htp.tokenex.com/iframe/iframe-v3.min.js";
1930
- class _t extends h {
2004
+ const _t = "https://test-htp.tokenex.com/Iframe/Iframe-v3.min.js", Gt = "https://htp.tokenex.com/iframe/iframe-v3.min.js";
2005
+ class Yt extends h {
1931
2006
  options;
1932
2007
  isSubmitting = !1;
1933
2008
  scriptCleanup;
@@ -1940,20 +2015,21 @@ class _t extends h {
1940
2015
  submitButton;
1941
2016
  paymentMethods;
1942
2017
  spinner;
2018
+ formSkeleton;
1943
2019
  alert;
1944
2020
  // Focus management
1945
- focusManager = new wt();
2021
+ focusManager = new Ft();
1946
2022
  // Event handler references
1947
2023
  emailFocusHandler;
1948
2024
  cardExpiryFocusHandler;
1949
2025
  nameFocusHandler;
1950
2026
  // factories
1951
- formManager = X();
2027
+ formManager = W();
1952
2028
  checkoutProfile;
1953
2029
  translation = P();
1954
2030
  iframeHook;
1955
2031
  constructor(e) {
1956
- super("form", ["form-container"]), this.options = e, this.checkoutProfile = _({
2032
+ super("form", ["form-container"]), this.options = e, this.checkoutProfile = U({
1957
2033
  apiKey: e.apiKey,
1958
2034
  profileId: e.profileId,
1959
2035
  environment: e.environment
@@ -1972,10 +2048,10 @@ class _t extends h {
1972
2048
  };
1973
2049
  }
1974
2050
  handleFormStateChange = () => {
1975
- const { formData: e, errors: t, touched: i } = this.formManager.getFormState(), a = this.iframeHook?.getState() || {};
1976
- Object.keys(i).forEach((r) => {
1977
- i[r] && this.localTouchedFields.add(r);
1978
- }), this.focusManager.handleStateUpdate(e, t, i, a), this.updateFormUI();
2051
+ const { formData: e, errors: t, touched: a } = this.formManager.getFormState(), i = this.iframeHook?.getState() || {};
2052
+ Object.keys(a).forEach((r) => {
2053
+ a[r] && this.localTouchedFields.add(r);
2054
+ }), this.focusManager.handleStateUpdate(e, t, a, i), this.updateFormUI();
1979
2055
  };
1980
2056
  handleProfileStateChange = (e) => {
1981
2057
  if (!e.isLoading)
@@ -1983,7 +2059,7 @@ class _t extends h {
1983
2059
  try {
1984
2060
  if (e.checkoutProfile.styles?.fontFamily)
1985
2061
  try {
1986
- const { cleanup: t } = xt({
2062
+ const { cleanup: t } = St({
1987
2063
  fontFamily: e.checkoutProfile.styles.fontFamily
1988
2064
  });
1989
2065
  this.fontCleanup = t;
@@ -1995,8 +2071,8 @@ class _t extends h {
1995
2071
  });
1996
2072
  } catch (t) {
1997
2073
  console.error("Error in profile state change:", t);
1998
- const i = e.error || "Failed to load checkout profile data";
1999
- this.setErrorMessage(i);
2074
+ const a = e.error || "Failed to load checkout profile data";
2075
+ this.setErrorMessage(a);
2000
2076
  }
2001
2077
  else e.error && (console.error("NO profile found", e.error), this.setErrorMessage(e.error), this.setLoadingState(!1));
2002
2078
  };
@@ -2017,18 +2093,18 @@ class _t extends h {
2017
2093
  );
2018
2094
  return;
2019
2095
  }
2020
- const { inputStyles: t, formContainerStyle: i } = Mt(
2096
+ const { inputStyles: t, formContainerStyle: a } = kt(
2021
2097
  e.checkoutProfile
2022
2098
  );
2023
- this.applyFormContainerStyles(i);
2024
- const a = document.getElementById("card-element"), r = document.getElementById("card-cvv-element");
2025
- if (!a || !r) {
2099
+ this.applyFormContainerStyles(a);
2100
+ const i = document.getElementById("card-element"), r = document.getElementById("card-cvv-element");
2101
+ if (!i || !r) {
2026
2102
  console.error(
2027
2103
  "[Form] Card elements not found, cannot initialize TokenEx iframe."
2028
2104
  );
2029
2105
  return;
2030
2106
  }
2031
- this.iframeHook = ee({
2107
+ this.iframeHook = Q({
2032
2108
  apiKey: this.options.apiKey,
2033
2109
  checkoutProfile: e.checkoutProfile,
2034
2110
  inputStyles: t,
@@ -2061,13 +2137,13 @@ class _t extends h {
2061
2137
  this.translation.t,
2062
2138
  this.isCvvTouched
2063
2139
  ), this.cardSection.updateCardType(e.possibleCardType), this.cardSection.setLoading(e.loadingIframe)), e.loadingIframe || this.setLoadingState(!1), this.submitButton && this.submitButton.setDisabled(this.isFormDisabled());
2064
- const { formData: t, errors: i, touched: a } = this.formManager.getFormState();
2065
- this.focusManager.handleStateUpdate(t, i, a, e);
2140
+ const { formData: t, errors: a, touched: i } = this.formManager.getFormState();
2141
+ this.focusManager.handleStateUpdate(t, a, i, e);
2066
2142
  };
2067
2143
  createCardSection = (e) => {
2068
2144
  if (!this.cardSection)
2069
2145
  try {
2070
- const { formData: t, errors: i, touched: a } = this._getFormStateData();
2146
+ const { formData: t, errors: a, touched: i } = this._getFormStateData();
2071
2147
  let r = {
2072
2148
  loadingIframe: !0,
2073
2149
  isFocused: !1,
@@ -2076,7 +2152,7 @@ class _t extends h {
2076
2152
  isCvvValid: !1,
2077
2153
  possibleCardType: "unknown"
2078
2154
  };
2079
- this.iframeHook && (r = this.iframeHook.getState()), this.cardSection = new Dt({
2155
+ this.iframeHook && (r = this.iframeHook.getState()), this.cardSection = new $t({
2080
2156
  checkoutProfile: e,
2081
2157
  isLoading: r.loadingIframe,
2082
2158
  isFocused: r.isFocused,
@@ -2089,8 +2165,8 @@ class _t extends h {
2089
2165
  // Initially not touched
2090
2166
  cardType: r.possibleCardType,
2091
2167
  cardExpiry: t.cardExpiry,
2092
- cardExpiryError: i.cardExpiry,
2093
- cardExpiryTouched: !!a.cardExpiry,
2168
+ cardExpiryError: a.cardExpiry,
2169
+ cardExpiryTouched: !!i.cardExpiry,
2094
2170
  onChange: this.handleChange,
2095
2171
  onBlur: this.handleBlur,
2096
2172
  translationFunc: this.translation.t
@@ -2112,10 +2188,10 @@ class _t extends h {
2112
2188
  };
2113
2189
  initializeForm() {
2114
2190
  this.setLoadingState(!0), this.options.errorMsg && this.setErrorMessage(this.options.errorMsg);
2115
- const e = this.options.environment === "test" ? jt : Ut, { cleanup: t, isLoaded: i } = Ft({
2191
+ const e = this.options.environment === "test" ? _t : Gt, { cleanup: t, isLoaded: a } = xt({
2116
2192
  scriptSrc: e
2117
2193
  });
2118
- this.scriptCleanup = t, this.tokenExScriptPromise = i, i.then(() => {
2194
+ this.scriptCleanup = t, this.tokenExScriptPromise = a, a.then(() => {
2119
2195
  }).catch(() => {
2120
2196
  this.setLoadingState(!1), this.setErrorMessage(
2121
2197
  "Failed to load payment system. Please try again later."
@@ -2160,11 +2236,12 @@ class _t extends h {
2160
2236
  try {
2161
2237
  if (!e?.additionalPaymentMethods)
2162
2238
  return;
2163
- const i = this.iframeHook?.getState().iframeConfig?.supportedPaymentMethods, { formData: a } = this._getFormStateData();
2164
- this.paymentMethods = new Ht({
2239
+ const a = this.iframeHook?.getState().iframeConfig?.supportedPaymentMethods, { formData: i } = this._getFormStateData();
2240
+ this.paymentMethods = new Kt({
2165
2241
  checkoutProfile: e,
2166
- formData: a,
2167
- supportedPaymentMethods: i,
2242
+ formData: i,
2243
+ supportedPaymentMethods: a,
2244
+ translationFunc: this.translation.t,
2168
2245
  onPaypalSubmit: async () => {
2169
2246
  await this.handlePaypalSubmit();
2170
2247
  }
@@ -2172,19 +2249,19 @@ class _t extends h {
2172
2249
  this.paymentMethods.getElement(),
2173
2250
  this.element.firstChild
2174
2251
  ) : this.element.appendChild(this.paymentMethods.getElement());
2175
- } catch (i) {
2176
- throw console.error("Error creating payment methods:", i), i;
2252
+ } catch (a) {
2253
+ throw console.error("Error creating payment methods:", a), a;
2177
2254
  }
2178
2255
  }
2179
2256
  createEmailField(e) {
2180
2257
  try {
2181
- const { formData: t, errors: i, touched: a } = this._getFormStateData();
2182
- this.emailField = new $t({
2258
+ const { formData: t, errors: a, touched: i } = this._getFormStateData();
2259
+ this.emailField = new Rt({
2183
2260
  value: t.email,
2184
2261
  onChange: this.handleChange,
2185
2262
  onBlur: this.handleBlur,
2186
- error: !!(i.email && a.email),
2187
- errorMsg: i.email,
2263
+ error: !!(a.email && i.email),
2264
+ errorMsg: a.email,
2188
2265
  checkoutProfile: e,
2189
2266
  translationFunc: this.translation.t
2190
2267
  }), this.emailFocusHandler = () => this.handleFieldFocus("email"), this.emailField.getElement().addEventListener("focus", this.emailFocusHandler, !0), this.focusManager.registerField("email", this.emailField), this.element.appendChild(this.emailField.getElement());
@@ -2194,13 +2271,13 @@ class _t extends h {
2194
2271
  }
2195
2272
  createCardholderSection(e) {
2196
2273
  try {
2197
- const { formData: t, errors: i, touched: a } = this._getFormStateData();
2198
- this.cardholderSection = new kt({
2274
+ const { formData: t, errors: a, touched: i } = this._getFormStateData();
2275
+ this.cardholderSection = new It({
2199
2276
  value: t.name,
2200
2277
  onChange: this.handleChange,
2201
2278
  onBlur: this.handleBlur,
2202
- error: !!(i.name && a.name),
2203
- errorMsg: i.name,
2279
+ error: !!(a.name && i.name),
2280
+ errorMsg: a.name,
2204
2281
  checkoutProfile: e,
2205
2282
  translationFunc: this.translation.t
2206
2283
  });
@@ -2212,7 +2289,7 @@ class _t extends h {
2212
2289
  }
2213
2290
  createSubmitButton(e) {
2214
2291
  try {
2215
- this.submitButton = new Kt({
2292
+ this.submitButton = new Ut({
2216
2293
  disabled: this.isFormDisabled(),
2217
2294
  checkoutProfile: e,
2218
2295
  translationFunc: this.translation.t
@@ -2224,18 +2301,18 @@ class _t extends h {
2224
2301
  // Track locally touched fields to avoid redundant state checks
2225
2302
  localTouchedFields = /* @__PURE__ */ new Set();
2226
2303
  handleChange = (e) => {
2227
- const t = e.target, { name: i, value: a } = t, r = i;
2228
- this.formManager.handleChange(r, a), this.localTouchedFields.has(r) || (this.localTouchedFields.add(r), this.formManager.handleBlur(r, a));
2229
- const { formData: s, errors: o, touched: l } = this.formManager.getFormState(), c = this.iframeHook?.getState() || {};
2230
- this.focusManager.handleStateUpdate(s, o, l, c);
2304
+ const t = e.target, { name: a, value: i } = t, r = a;
2305
+ this.formManager.handleChange(r, i), this.localTouchedFields.has(r) || (this.localTouchedFields.add(r), this.formManager.handleBlur(r, i));
2306
+ const { formData: s, errors: n, touched: l } = this.formManager.getFormState(), c = this.iframeHook?.getState() || {};
2307
+ this.focusManager.handleStateUpdate(s, n, l, c);
2231
2308
  };
2232
2309
  handleBlur = (e) => {
2233
- const t = e.target, { name: i, value: a } = t, r = i;
2234
- this.localTouchedFields.add(r), this.formManager.handleBlur(r, a);
2235
- const { formData: s, errors: o, touched: l } = this.formManager.getFormState(), c = this.iframeHook?.getState() || {};
2310
+ const t = e.target, { name: a, value: i } = t, r = a;
2311
+ this.localTouchedFields.add(r), this.formManager.handleBlur(r, i);
2312
+ const { formData: s, errors: n, touched: l } = this.formManager.getFormState(), c = this.iframeHook?.getState() || {};
2236
2313
  l[r] || this.focusManager.handleStateUpdate(
2237
2314
  s,
2238
- o,
2315
+ n,
2239
2316
  l,
2240
2317
  c
2241
2318
  );
@@ -2261,26 +2338,29 @@ class _t extends h {
2261
2338
  isCvvValid: !1
2262
2339
  };
2263
2340
  this.iframeHook && (t = this.iframeHook.getState());
2264
- const i = Object.keys(e.errors).length > 0, a = (
2341
+ const a = Object.keys(e.errors).length > 0, i = (
2265
2342
  // Only require card validation if CardSection exists
2266
2343
  (!this.cardSection || t.isCcValid && t.isCvvValid) && !!e.formData.email && !!e.formData.name && // Only require card expiry if CardSection exists
2267
2344
  (!this.cardSection || !!e.formData.cardExpiry)
2268
2345
  );
2269
- return i || !a || this.isSubmitting;
2346
+ return a || !i || this.isSubmitting;
2270
2347
  }
2271
2348
  setLoadingState(e) {
2272
2349
  if (this.options.onLoadingStateChange) {
2273
2350
  this.options.onLoadingStateChange(e);
2274
2351
  return;
2275
2352
  }
2276
- e ? (this.hideSpinner(), this.spinner = new $(), this.element.appendChild(this.spinner.getElement())) : this.hideSpinner();
2353
+ e ? (this.hideSkeleton(), this.formSkeleton = new Mt(), this.element.appendChild(this.formSkeleton.getElement())) : this.hideSkeleton();
2277
2354
  }
2278
2355
  showSpinner(e) {
2279
- this.hideSpinner(), this.spinner = new $({ text: e }), this.element.appendChild(this.spinner.getElement());
2356
+ this.hideSpinner(), this.spinner = new Lt({ text: e }), this.element.appendChild(this.spinner.getElement());
2280
2357
  }
2281
2358
  hideSpinner() {
2282
2359
  this.spinner && (this.spinner.getElement().remove(), this.spinner = void 0);
2283
2360
  }
2361
+ hideSkeleton() {
2362
+ this.formSkeleton && (this.formSkeleton.getElement().remove(), this.formSkeleton = void 0);
2363
+ }
2284
2364
  handleSubmit = async (e) => {
2285
2365
  if (e.preventDefault(), !this.isFormDisabled())
2286
2366
  try {
@@ -2324,7 +2404,7 @@ class _t extends h {
2324
2404
  * Update the form error message
2325
2405
  */
2326
2406
  setErrorMessage(e) {
2327
- return this.alert && (this.alert.getElement().remove(), this.alert = void 0), this.alert = new Lt({ message: e }), this.element.insertBefore(this.alert.getElement(), this.element.firstChild), this;
2407
+ return this.alert && (this.alert.getElement().remove(), this.alert = void 0), this.alert = new wt({ message: e }), this.element.insertBefore(this.alert.getElement(), this.element.firstChild), this;
2328
2408
  }
2329
2409
  /**
2330
2410
  * Clean up resources when the form is destroyed
@@ -2345,7 +2425,7 @@ class _t extends h {
2345
2425
  const e = this.cardholderSection.getElement().querySelector('input[name="name"]');
2346
2426
  e && this.nameFocusHandler && e.removeEventListener("focus", this.nameFocusHandler), this.cardholderSection.getElement().remove(), this.cardholderSection = void 0;
2347
2427
  }
2348
- this.submitButton && (this.submitButton.getElement().remove(), this.submitButton = void 0), this.paymentMethods && (this.paymentMethods.getElement().remove(), this.paymentMethods = void 0), this.spinner && (this.spinner.getElement().remove(), this.spinner = void 0), this.alert && (this.alert.getElement().remove(), this.alert = void 0), this.getElement().remove();
2428
+ this.submitButton && (this.submitButton.getElement().remove(), this.submitButton = void 0), this.paymentMethods && (this.paymentMethods.getElement().remove(), this.paymentMethods = void 0), this.spinner && (this.spinner.getElement().remove(), this.spinner = void 0), this.formSkeleton && (this.formSkeleton.getElement().remove(), this.formSkeleton = void 0), this.alert && (this.alert.getElement().remove(), this.alert = void 0), this.getElement().remove();
2349
2429
  }
2350
2430
  handleKeyDown = (e) => {
2351
2431
  e.key === "Enter" && !this.isFormDisabled() && (e.target instanceof HTMLTextAreaElement || (e.preventDefault(), this.handleSubmit(e)));
@@ -2357,7 +2437,7 @@ class _t extends h {
2357
2437
  this.focusManager.handleFieldFocus(e);
2358
2438
  };
2359
2439
  }
2360
- class Gt {
2440
+ class Zt {
2361
2441
  container = null;
2362
2442
  options;
2363
2443
  onSubmit;
@@ -2372,7 +2452,7 @@ class Gt {
2372
2452
  this.container && this.form && (this.form && e.errorMsg && !this.options.disableErrorMessages ? this.form.setErrorMessage(e.errorMsg) : this.renderForm(e.errorMsg));
2373
2453
  }
2374
2454
  renderForm(e) {
2375
- this.container && (this.form && (this.form.destroy(), this.form = null), this.form = new _t({
2455
+ this.container && (this.form && (this.form.destroy(), this.form = null), this.form = new Yt({
2376
2456
  apiKey: this.options.apiKey,
2377
2457
  onSubmit: this.onSubmit,
2378
2458
  locale: this.options.locale,
@@ -2388,7 +2468,7 @@ class Gt {
2388
2468
  this.form && (this.form.destroy(), this.form = null);
2389
2469
  }
2390
2470
  }
2391
- class Yt {
2471
+ class Jt {
2392
2472
  state;
2393
2473
  listeners = /* @__PURE__ */ new Set();
2394
2474
  constructor(e) {
@@ -2410,20 +2490,20 @@ class Yt {
2410
2490
  this.listeners.forEach((t) => t(e));
2411
2491
  }
2412
2492
  }
2413
- const Zt = "en";
2414
- class Jt {
2493
+ const Wt = "en";
2494
+ class Xt {
2415
2495
  config;
2416
2496
  apiService;
2417
2497
  formManager;
2418
2498
  stateManager;
2419
2499
  constructor(e) {
2420
- this.config = this.validateConfig(e), this.apiService = new O(
2500
+ this.config = this.validateConfig(e), this.apiService = new H(
2421
2501
  this.config.apiKey,
2422
2502
  this.config.environment
2423
- ), this.stateManager = new Yt({
2503
+ ), this.stateManager = new Jt({
2424
2504
  mounted: !1,
2425
2505
  form: null
2426
- }), this.formManager = new Gt(
2506
+ }), this.formManager = new Zt(
2427
2507
  {
2428
2508
  locale: this.config.locale,
2429
2509
  apiKey: this.config.apiKey,
@@ -2448,7 +2528,7 @@ class Jt {
2448
2528
  paymentId: e.paymentId,
2449
2529
  returnUrl: e.returnUrl,
2450
2530
  environment: e.environment,
2451
- locale: e.locale || Zt,
2531
+ locale: e.locale || Wt,
2452
2532
  disableErrorMessages: e.disableErrorMessages ?? !1,
2453
2533
  manualActionHandling: e.manualActionHandling ?? !1,
2454
2534
  callbacks: {
@@ -2463,11 +2543,11 @@ class Jt {
2463
2543
  const t = document.querySelector(e);
2464
2544
  if (!t)
2465
2545
  throw new Error(`Container ${e} not found`);
2466
- const i = document.createElement("div");
2467
- return t.appendChild(i), this.stateManager.updateState({
2468
- form: i,
2546
+ const a = document.createElement("div");
2547
+ return t.appendChild(a), this.stateManager.updateState({
2548
+ form: a,
2469
2549
  mounted: !0
2470
- }), this.formManager.mount(i), this;
2550
+ }), this.formManager.mount(a), this;
2471
2551
  }
2472
2552
  unmount() {
2473
2553
  const { mounted: e } = this.stateManager.getState();
@@ -2485,16 +2565,16 @@ class Jt {
2485
2565
  formData: t
2486
2566
  }) {
2487
2567
  try {
2488
- const i = await this.apiService.authorizePayment({
2568
+ const a = await this.apiService.authorizePayment({
2489
2569
  checkoutKey: this.config.checkoutKey,
2490
2570
  formData: t || null,
2491
2571
  token: e?.token || null,
2492
2572
  paymentId: this.config.paymentId,
2493
2573
  returnUrl: this.config.returnUrl
2494
2574
  });
2495
- this.handlePaymentResponse(i);
2496
- } catch (i) {
2497
- this.handleAuthorizationError(i);
2575
+ this.handlePaymentResponse(a);
2576
+ } catch (a) {
2577
+ this.handleAuthorizationError(a);
2498
2578
  }
2499
2579
  }
2500
2580
  handlePaymentResponse(e) {
@@ -2511,15 +2591,15 @@ class Jt {
2511
2591
  t && this.formManager.update({ errorMsg: e.details?.message });
2512
2592
  }
2513
2593
  }
2514
- typeof globalThis < "u" && (globalThis.OdusCheckout = Jt);
2594
+ typeof globalThis < "u" && (globalThis.OdusCheckout = Xt);
2515
2595
  export {
2516
- Jt as OdusCheckout,
2517
- ce as deLocale,
2518
- ve as enLocale,
2519
- Le as esLocale,
2520
- De as frLocale,
2521
- Ue as itLocale,
2522
- et as plLocale,
2523
- ct as ptLocale,
2524
- vt as trLocale
2596
+ Xt as OdusCheckout,
2597
+ le as deLocale,
2598
+ ye as enLocale,
2599
+ we as esLocale,
2600
+ Ve as frLocale,
2601
+ je as itLocale,
2602
+ Qe as plLocale,
2603
+ lt as ptLocale,
2604
+ yt as trLocale
2525
2605
  };