@henrylabs-interview/payment-processor 0.2.4 → 0.2.6

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.
Files changed (2) hide show
  1. package/dist/resources/embedded.js +31 -6
  2. package/package.json +1 -1
package/dist/resources/embedded.js CHANGED
@@ -13,7 +13,7 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
13
13
  console.warn(`Expired checkout ID: "${checkoutId}".`);
14
14
  return false;
15
15
  }
16
- const container = document.getElementById(containerElementId);
16
+ const container = document.getElementById(containerElementId.startsWith('#') ? containerElementId.slice(1) : containerElementId);
17
17
  if (!container) {
18
18
  console.warn(`Container element "${containerElementId}" not found.`);
19
19
  return false;
@@ -35,7 +35,7 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
35
35
  font-weight: 600;
36
36
  color: #111827;
37
37
  ">
38
- Secure Checkout
38
+ "Secure" Checkout
39
39
  </h3>
40
40
 
41
41
  <div style="display:flex; flex-direction:column; gap:14px;">
@@ -44,7 +44,13 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
44
44
  <label style="font-size:12px; color:#6b7280; margin-bottom:6px;">
45
45
  Card Number
46
46
  </label>
47
- <input id="card-number" type="text" placeholder="4242 4242 4242 4242"
47
+ <input
48
+ id="card-number"
49
+ type="text"
50
+ placeholder="4242 4242 4242 4242"
51
+ maxlength="16"
52
+ inputmode="numeric"
53
+ pattern="[0-9]*"
48
54
  style="
49
55
  padding: 10px 12px;
50
56
  border-radius: 10px;
@@ -62,7 +68,15 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
62
68
  <label style="font-size:12px; color:#6b7280; margin-bottom:6px;">
63
69
  Exp. Month
64
70
  </label>
65
- <input id="exp-month" type="number" placeholder="12" min="1" max="12"
71
+ <input
72
+ id="exp-month"
73
+ type="text"
74
+ placeholder="12"
75
+ min="1"
76
+ max="12"
77
+ maxlength="2"
78
+ inputmode="numeric"
79
+ pattern="[0-9]*"
66
80
  style="
67
81
  padding: 10px 12px;
68
82
  border-radius: 10px;
@@ -78,7 +92,13 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
78
92
  <label style="font-size:12px; color:#6b7280; margin-bottom:6px;">
79
93
  Exp. Year
80
94
  </label>
81
- <input id="exp-year" type="number" placeholder="2030"
95
+ <input
96
+ id="exp-year"
97
+ type="text"
98
+ placeholder="2030"
99
+ maxlength="4"
100
+ inputmode="numeric"
101
+ pattern="[0-9]*"
82
102
  style="
83
103
  padding: 10px 12px;
84
104
  border-radius: 10px;
@@ -96,7 +116,12 @@ export async function renderEmbeddedCheckout(containerElementId, checkoutId, cal
96
116
  <label style="font-size:12px; color:#6b7280; margin-bottom:6px;">
97
117
  CVC
98
118
  </label>
99
- <input id="cvc" type="text" placeholder="123"
119
+ <input id="cvc"
120
+ type="text"
121
+ placeholder="123"
122
+ maxlength="4"
123
+ inputmode="numeric"
124
+ pattern="[0-9]*"
100
125
  style="
101
126
  padding: 10px 12px;
102
127
  border-radius: 10px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@henrylabs-interview/payment-processor",
3
- "version": "0.2.4",
3
+ "version": "0.2.6",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",