@thinkingcat/subscription-ui 1.0.7 → 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +40 -4
- package/dist/index.mjs +40 -4
- package/package.json +8 -3
package/dist/index.js
CHANGED
|
@@ -95,7 +95,10 @@ function SubscribePage({
|
|
|
95
95
|
const res = await fetch(cardsApiPath, {
|
|
96
96
|
method: "POST",
|
|
97
97
|
headers: { "Content-Type": "application/json" },
|
|
98
|
-
body: JSON.stringify(
|
|
98
|
+
body: JSON.stringify({
|
|
99
|
+
...cardForm,
|
|
100
|
+
cardNumber: cardForm.cardNumber.replace(/\s/g, "")
|
|
101
|
+
})
|
|
99
102
|
});
|
|
100
103
|
const data = await res.json();
|
|
101
104
|
if (!data.success) {
|
|
@@ -287,7 +290,22 @@ function SubscribePage({
|
|
|
287
290
|
type,
|
|
288
291
|
placeholder,
|
|
289
292
|
value: cardForm[key],
|
|
290
|
-
onChange: (e) =>
|
|
293
|
+
onChange: (e) => {
|
|
294
|
+
const val = e.target.value;
|
|
295
|
+
if (key === "cardNumber") {
|
|
296
|
+
const formatted = val.replace(/\D/g, "").replace(/(\d{4})(?=\d)/g, "$1 ").slice(0, 19);
|
|
297
|
+
setCardForm((f) => ({ ...f, [key]: formatted }));
|
|
298
|
+
} else if (key === "expiryDate") {
|
|
299
|
+
const digits = val.replace(/\D/g, "");
|
|
300
|
+
let formatted = digits;
|
|
301
|
+
if (digits.length > 2) {
|
|
302
|
+
formatted = `${digits.slice(0, 2)}/${digits.slice(2, 4)}`;
|
|
303
|
+
}
|
|
304
|
+
setCardForm((f) => ({ ...f, [key]: formatted.slice(0, 5) }));
|
|
305
|
+
} else {
|
|
306
|
+
setCardForm((f) => ({ ...f, [key]: val }));
|
|
307
|
+
}
|
|
308
|
+
},
|
|
291
309
|
className: "w-full bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 rounded-lg px-3 py-2 text-gray-900 dark:text-white text-sm placeholder-gray-300 dark:placeholder-gray-600 focus:outline-none focus:border-blue-500 dark:focus:border-blue-500 transition-colors"
|
|
292
310
|
}
|
|
293
311
|
)
|
|
@@ -545,7 +563,10 @@ function SubscriptionManagement({
|
|
|
545
563
|
const res = await fetch(cardsApiPath, {
|
|
546
564
|
method: "POST",
|
|
547
565
|
headers: { "Content-Type": "application/json" },
|
|
548
|
-
body: JSON.stringify(
|
|
566
|
+
body: JSON.stringify({
|
|
567
|
+
...cardForm,
|
|
568
|
+
cardNumber: cardForm.cardNumber.replace(/\s/g, "")
|
|
569
|
+
})
|
|
549
570
|
});
|
|
550
571
|
const data = await res.json();
|
|
551
572
|
if (!data.success) {
|
|
@@ -688,7 +709,22 @@ function SubscriptionManagement({
|
|
|
688
709
|
type,
|
|
689
710
|
placeholder,
|
|
690
711
|
value: cardForm[key],
|
|
691
|
-
onChange: (e) =>
|
|
712
|
+
onChange: (e) => {
|
|
713
|
+
const val = e.target.value;
|
|
714
|
+
if (key === "cardNumber") {
|
|
715
|
+
const formatted = val.replace(/\D/g, "").replace(/(\d{4})(?=\d)/g, "$1 ").slice(0, 19);
|
|
716
|
+
setCardForm((f) => ({ ...f, [key]: formatted }));
|
|
717
|
+
} else if (key === "expiryDate") {
|
|
718
|
+
const digits = val.replace(/\D/g, "");
|
|
719
|
+
let formatted = digits;
|
|
720
|
+
if (digits.length > 2) {
|
|
721
|
+
formatted = `${digits.slice(0, 2)}/${digits.slice(2, 4)}`;
|
|
722
|
+
}
|
|
723
|
+
setCardForm((f) => ({ ...f, [key]: formatted.slice(0, 5) }));
|
|
724
|
+
} else {
|
|
725
|
+
setCardForm((f) => ({ ...f, [key]: val }));
|
|
726
|
+
}
|
|
727
|
+
},
|
|
692
728
|
className: "w-full bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 rounded-lg px-3 py-2 text-gray-900 dark:text-white text-sm placeholder-gray-300 dark:placeholder-gray-600 focus:outline-none focus:border-blue-500 transition-colors"
|
|
693
729
|
}
|
|
694
730
|
)
|
package/dist/index.mjs
CHANGED
|
@@ -69,7 +69,10 @@ function SubscribePage({
|
|
|
69
69
|
const res = await fetch(cardsApiPath, {
|
|
70
70
|
method: "POST",
|
|
71
71
|
headers: { "Content-Type": "application/json" },
|
|
72
|
-
body: JSON.stringify(
|
|
72
|
+
body: JSON.stringify({
|
|
73
|
+
...cardForm,
|
|
74
|
+
cardNumber: cardForm.cardNumber.replace(/\s/g, "")
|
|
75
|
+
})
|
|
73
76
|
});
|
|
74
77
|
const data = await res.json();
|
|
75
78
|
if (!data.success) {
|
|
@@ -261,7 +264,22 @@ function SubscribePage({
|
|
|
261
264
|
type,
|
|
262
265
|
placeholder,
|
|
263
266
|
value: cardForm[key],
|
|
264
|
-
onChange: (e) =>
|
|
267
|
+
onChange: (e) => {
|
|
268
|
+
const val = e.target.value;
|
|
269
|
+
if (key === "cardNumber") {
|
|
270
|
+
const formatted = val.replace(/\D/g, "").replace(/(\d{4})(?=\d)/g, "$1 ").slice(0, 19);
|
|
271
|
+
setCardForm((f) => ({ ...f, [key]: formatted }));
|
|
272
|
+
} else if (key === "expiryDate") {
|
|
273
|
+
const digits = val.replace(/\D/g, "");
|
|
274
|
+
let formatted = digits;
|
|
275
|
+
if (digits.length > 2) {
|
|
276
|
+
formatted = `${digits.slice(0, 2)}/${digits.slice(2, 4)}`;
|
|
277
|
+
}
|
|
278
|
+
setCardForm((f) => ({ ...f, [key]: formatted.slice(0, 5) }));
|
|
279
|
+
} else {
|
|
280
|
+
setCardForm((f) => ({ ...f, [key]: val }));
|
|
281
|
+
}
|
|
282
|
+
},
|
|
265
283
|
className: "w-full bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 rounded-lg px-3 py-2 text-gray-900 dark:text-white text-sm placeholder-gray-300 dark:placeholder-gray-600 focus:outline-none focus:border-blue-500 dark:focus:border-blue-500 transition-colors"
|
|
266
284
|
}
|
|
267
285
|
)
|
|
@@ -519,7 +537,10 @@ function SubscriptionManagement({
|
|
|
519
537
|
const res = await fetch(cardsApiPath, {
|
|
520
538
|
method: "POST",
|
|
521
539
|
headers: { "Content-Type": "application/json" },
|
|
522
|
-
body: JSON.stringify(
|
|
540
|
+
body: JSON.stringify({
|
|
541
|
+
...cardForm,
|
|
542
|
+
cardNumber: cardForm.cardNumber.replace(/\s/g, "")
|
|
543
|
+
})
|
|
523
544
|
});
|
|
524
545
|
const data = await res.json();
|
|
525
546
|
if (!data.success) {
|
|
@@ -662,7 +683,22 @@ function SubscriptionManagement({
|
|
|
662
683
|
type,
|
|
663
684
|
placeholder,
|
|
664
685
|
value: cardForm[key],
|
|
665
|
-
onChange: (e) =>
|
|
686
|
+
onChange: (e) => {
|
|
687
|
+
const val = e.target.value;
|
|
688
|
+
if (key === "cardNumber") {
|
|
689
|
+
const formatted = val.replace(/\D/g, "").replace(/(\d{4})(?=\d)/g, "$1 ").slice(0, 19);
|
|
690
|
+
setCardForm((f) => ({ ...f, [key]: formatted }));
|
|
691
|
+
} else if (key === "expiryDate") {
|
|
692
|
+
const digits = val.replace(/\D/g, "");
|
|
693
|
+
let formatted = digits;
|
|
694
|
+
if (digits.length > 2) {
|
|
695
|
+
formatted = `${digits.slice(0, 2)}/${digits.slice(2, 4)}`;
|
|
696
|
+
}
|
|
697
|
+
setCardForm((f) => ({ ...f, [key]: formatted.slice(0, 5) }));
|
|
698
|
+
} else {
|
|
699
|
+
setCardForm((f) => ({ ...f, [key]: val }));
|
|
700
|
+
}
|
|
701
|
+
},
|
|
666
702
|
className: "w-full bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 rounded-lg px-3 py-2 text-gray-900 dark:text-white text-sm placeholder-gray-300 dark:placeholder-gray-600 focus:outline-none focus:border-blue-500 transition-colors"
|
|
667
703
|
}
|
|
668
704
|
)
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"publishConfig": {
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
|
-
"version": "1.0.
|
|
6
|
+
"version": "1.0.8",
|
|
7
7
|
"description": "Subscription UI components for ThinkingCat services",
|
|
8
8
|
"main": "dist/index.js",
|
|
9
9
|
"module": "dist/index.mjs",
|
|
@@ -20,7 +20,12 @@
|
|
|
20
20
|
"dev": "tsup src/index.ts --format cjs,esm --dts --external react --external react-dom --external next --watch",
|
|
21
21
|
"prepublishOnly": "npm run build"
|
|
22
22
|
},
|
|
23
|
-
"keywords": [
|
|
23
|
+
"keywords": [
|
|
24
|
+
"subscription",
|
|
25
|
+
"ui",
|
|
26
|
+
"react",
|
|
27
|
+
"thinkingcat"
|
|
28
|
+
],
|
|
24
29
|
"author": "ThinkingCat",
|
|
25
30
|
"license": "MIT",
|
|
26
31
|
"peerDependencies": {
|
|
@@ -41,4 +46,4 @@
|
|
|
41
46
|
"dist",
|
|
42
47
|
"README.md"
|
|
43
48
|
]
|
|
44
|
-
}
|
|
49
|
+
}
|