@calcom/atoms 2.8.2 → 2.8.3
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/cal-atoms.css +1 -1
- package/dist/cal-atoms.js +26 -26
- package/dist/index-BfJCL_ws.js +21784 -0
- package/dist/stripe-payment-form-D1tWkuov.js +118 -0
- package/package.json +68 -38
- package/dist/index-uxS4DSg-.js +0 -67877
- package/dist/stripe-payment-form-Ct6RLnZs.js +0 -544
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { jsxs as _, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { PaymentElement as C, Elements as S, useElements as I, useStripe as k } from "@stripe/react-stripe-js";
|
|
3
|
+
import { useState as u, useEffect as b } from "react";
|
|
4
|
+
import { u as h, C as E, B as g, W as x } from "./index-BfJCL_ws.js";
|
|
5
|
+
import { loadStripe as O } from "@stripe/stripe-js/pure";
|
|
6
|
+
var v = {};
|
|
7
|
+
const w = v.NEXT_PUBLIC_STRIPE_PUBLIC_KEY || "";
|
|
8
|
+
let f;
|
|
9
|
+
const L = (e) => (f || (f = O(e || w)), f), N = (e) => {
|
|
10
|
+
const { t: o, i18n: a } = h(), { paymentOption: s, elements: r, state: c, onPaymentElementChange: m } = e, [l, t] = u(!1), [i, d] = u(s !== "HOLD"), y = l || !i || ["processing", "error"].includes(c.status), p = { layout: "accordion" };
|
|
11
|
+
return b(() => {
|
|
12
|
+
r == null || r.update({ locale: a.language });
|
|
13
|
+
}, [r, a.language]), /* @__PURE__ */ _("form", { id: "payment-form", className: "bg-subtle mt-4 rounded-md p-6", onSubmit: e.onSubmit, children: [
|
|
14
|
+
/* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(C, { options: p, onChange: () => m() }) }),
|
|
15
|
+
s === "HOLD" && /* @__PURE__ */ n("div", { className: "bg-cal-info mb-5 mt-2 rounded-md p-3", children: /* @__PURE__ */ n(
|
|
16
|
+
E,
|
|
17
|
+
{
|
|
18
|
+
description: o("acknowledge_booking_no_show_fee", {
|
|
19
|
+
amount: e.payment.amount / 100,
|
|
20
|
+
formatParams: { amount: { currency: e.payment.currency } }
|
|
21
|
+
}),
|
|
22
|
+
onChange: (P) => d(P.target.checked),
|
|
23
|
+
descriptionClassName: "text-info font-semibold"
|
|
24
|
+
}
|
|
25
|
+
) }),
|
|
26
|
+
/* @__PURE__ */ _("div", { className: "mt-2 flex justify-end space-x-2", children: [
|
|
27
|
+
/* @__PURE__ */ n(
|
|
28
|
+
g,
|
|
29
|
+
{
|
|
30
|
+
color: "minimal",
|
|
31
|
+
disabled: y,
|
|
32
|
+
id: "cancel",
|
|
33
|
+
type: "button",
|
|
34
|
+
loading: l,
|
|
35
|
+
onClick: () => {
|
|
36
|
+
t(!0), e.onCancel();
|
|
37
|
+
},
|
|
38
|
+
children: /* @__PURE__ */ n("span", { id: "button-text", children: o("cancel") })
|
|
39
|
+
}
|
|
40
|
+
),
|
|
41
|
+
/* @__PURE__ */ n(
|
|
42
|
+
g,
|
|
43
|
+
{
|
|
44
|
+
type: "submit",
|
|
45
|
+
disabled: y,
|
|
46
|
+
loading: c.status === "processing",
|
|
47
|
+
id: "submit",
|
|
48
|
+
color: "secondary",
|
|
49
|
+
children: /* @__PURE__ */ n("span", { id: "button-text", children: c.status === "processing" ? /* @__PURE__ */ n("div", { className: "spinner", id: "spinner" }) : o(s === "HOLD" ? "submit_card" : "pay_now") })
|
|
50
|
+
}
|
|
51
|
+
)
|
|
52
|
+
] }),
|
|
53
|
+
c.status === "error" && /* @__PURE__ */ n("div", { className: "mt-4 text-center text-red-900 dark:text-gray-300", role: "alert", children: c.error.message })
|
|
54
|
+
] });
|
|
55
|
+
}, B = (e) => {
|
|
56
|
+
const { t: o } = h(), a = I(), s = e.payment.paymentOption;
|
|
57
|
+
e.booking.attendees[0].email;
|
|
58
|
+
const r = k(), [c, m] = u({ status: "idle" });
|
|
59
|
+
return /* @__PURE__ */ n(
|
|
60
|
+
N,
|
|
61
|
+
{
|
|
62
|
+
...e,
|
|
63
|
+
elements: a,
|
|
64
|
+
paymentOption: s,
|
|
65
|
+
state: c,
|
|
66
|
+
onSubmit: async (l) => {
|
|
67
|
+
var d;
|
|
68
|
+
if (l.preventDefault(), !r || !a)
|
|
69
|
+
return;
|
|
70
|
+
m({ status: "processing" });
|
|
71
|
+
let t;
|
|
72
|
+
const i = {
|
|
73
|
+
uid: e.booking.uid
|
|
74
|
+
};
|
|
75
|
+
s === "HOLD" && "setupIntent" in e.payment.data ? (t = await r.confirmSetup({
|
|
76
|
+
elements: a,
|
|
77
|
+
redirect: "if_required"
|
|
78
|
+
}), t.setupIntent && (i.payment_intent = t.setupIntent.id, i.payment_intent_client_secret = t.setupIntent.client_secret || void 0, i.redirect_status = t.setupIntent.status)) : s === "ON_BOOKING" && (t = await r.confirmPayment({
|
|
79
|
+
elements: a,
|
|
80
|
+
redirect: "if_required",
|
|
81
|
+
confirmParams: {
|
|
82
|
+
return_url: `${x}/booking/${i.uid}`
|
|
83
|
+
}
|
|
84
|
+
}), t.paymentIntent && (i.payment_intent = t.paymentIntent.id, i.payment_intent_client_secret = t.paymentIntent.client_secret || void 0, i.redirect_status = t.paymentIntent.status)), t != null && t.error ? m({
|
|
85
|
+
status: "error",
|
|
86
|
+
error: new Error(`Payment failed: ${t.error.message}`)
|
|
87
|
+
}) : (m({ status: "idle" }), (d = e.onPaymentSuccess) == null || d.call(e, e), e.location && (e.location.includes("integration") ? i.location = o("web_conferencing_details_to_follow") : i.location = e.location));
|
|
88
|
+
},
|
|
89
|
+
onCancel: () => {
|
|
90
|
+
var l;
|
|
91
|
+
(l = e.onPaymentCancellation) == null || l.call(e, e);
|
|
92
|
+
},
|
|
93
|
+
onPaymentElementChange: () => {
|
|
94
|
+
m({ status: "idle" });
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
);
|
|
98
|
+
}, K = (e) => {
|
|
99
|
+
const o = L(e.payment.data.stripe_publishable_key), [a, s] = u("stripe");
|
|
100
|
+
return b(() => {
|
|
101
|
+
document.documentElement.classList.contains("dark") && s("night");
|
|
102
|
+
}, []), /* @__PURE__ */ n(
|
|
103
|
+
S,
|
|
104
|
+
{
|
|
105
|
+
stripe: o,
|
|
106
|
+
options: {
|
|
107
|
+
clientSecret: e.clientSecret,
|
|
108
|
+
appearance: {
|
|
109
|
+
theme: a
|
|
110
|
+
}
|
|
111
|
+
},
|
|
112
|
+
children: /* @__PURE__ */ n(B, { ...e })
|
|
113
|
+
}
|
|
114
|
+
);
|
|
115
|
+
};
|
|
116
|
+
export {
|
|
117
|
+
K as default
|
|
118
|
+
};
|
package/package.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"description": "Customizable UI components to integrate scheduling into your product.",
|
|
6
6
|
"author": "Cal.com, Inc.",
|
|
7
7
|
"license": "AGPL-3.0-or-later",
|
|
8
|
-
"version": "2.8.
|
|
8
|
+
"version": "2.8.3",
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
11
11
|
"url": "https://github.com/calcom/atoms",
|
|
@@ -23,13 +23,31 @@
|
|
|
23
23
|
"dev-off": "git checkout -- package.json vite.config.ts"
|
|
24
24
|
},
|
|
25
25
|
"devDependencies": {
|
|
26
|
+
"@formkit/auto-animate": "1.0.0-beta.5",
|
|
27
|
+
"@hookform/error-message": "2.0.0",
|
|
28
|
+
"@hookform/resolvers": "2.9.7",
|
|
29
|
+
"@radix-ui/react-avatar": "1.1.3",
|
|
30
|
+
"@radix-ui/react-checkbox": "1.0.4",
|
|
31
|
+
"@radix-ui/react-dialog": "1.0.4",
|
|
32
|
+
"@radix-ui/react-dropdown-menu": "2.0.5",
|
|
33
|
+
"@radix-ui/react-hover-card": "1.0.7",
|
|
34
|
+
"@radix-ui/react-id": "1.0.1",
|
|
35
|
+
"@radix-ui/react-popover": "1.0.6",
|
|
36
|
+
"@radix-ui/react-radio-group": "1.1.3",
|
|
37
|
+
"@radix-ui/react-slot": "1.1.2",
|
|
38
|
+
"@radix-ui/react-switch": "1.1.0",
|
|
39
|
+
"@radix-ui/react-toast": "1.1.5",
|
|
40
|
+
"@radix-ui/react-toggle-group": "1.0.4",
|
|
41
|
+
"@radix-ui/react-tooltip": "1.0.6",
|
|
26
42
|
"@rollup/plugin-node-resolve": "15.0.1",
|
|
43
|
+
"@stripe/react-stripe-js": "1.10.0",
|
|
44
|
+
"@stripe/stripe-js": "1.35.0",
|
|
27
45
|
"@tailwindcss/cli": "4.1.17",
|
|
28
46
|
"@tailwindcss/postcss": "4.1.17",
|
|
47
|
+
"@tanstack/react-query": "5.17.19",
|
|
29
48
|
"@testing-library/react": "16.0.1",
|
|
30
49
|
"@types/jest": "29.5.12",
|
|
31
50
|
"@types/lodash": "4.14.202",
|
|
32
|
-
"jest-environment-jsdom": "29.7.0",
|
|
33
51
|
"@types/node": "20.17.23",
|
|
34
52
|
"@types/react": "18.0.26",
|
|
35
53
|
"@types/react-dom": "18.2.6",
|
|
@@ -37,18 +55,32 @@
|
|
|
37
55
|
"@vitejs/plugin-react-swc": "4.2.2",
|
|
38
56
|
"autoprefixer": "10.4.19",
|
|
39
57
|
"cssnano": "7.1.2",
|
|
58
|
+
"framer-motion": "10.12.8",
|
|
59
|
+
"i18next": "23.2.3",
|
|
40
60
|
"jest": "29.7.0",
|
|
61
|
+
"jest-environment-jsdom": "29.7.0",
|
|
41
62
|
"postcss": "8.5.6",
|
|
42
63
|
"postcss-cli": "11.0.1",
|
|
43
64
|
"postcss-import": "16.1.0",
|
|
44
65
|
"postcss-prefixer": "3.0.0",
|
|
45
66
|
"postcss-prefixwrap": "1.57.0",
|
|
67
|
+
"react-digit-input": "2.1.0",
|
|
68
|
+
"react-hook-form": "7.43.3",
|
|
69
|
+
"react-i18next": "12.3.1",
|
|
70
|
+
"react-phone-input-2": "2.15.1",
|
|
71
|
+
"react-select": "5.10.0",
|
|
72
|
+
"react-sticky-box": "2.0.4",
|
|
73
|
+
"react-timezone-select": "1.4.0",
|
|
74
|
+
"react-use": "17.6.0",
|
|
75
|
+
"sonner": "1.7.4",
|
|
76
|
+
"tailwindcss": "4.1.17",
|
|
46
77
|
"ts-jest": "29.1.4",
|
|
47
78
|
"typescript": "5.9.3",
|
|
48
79
|
"vite": "6.4.2",
|
|
49
80
|
"vite-plugin-dts": "4.5.4",
|
|
50
81
|
"vite-plugin-inspect": "0.8.4",
|
|
51
|
-
"vitest": "4.1.2"
|
|
82
|
+
"vitest": "4.1.2",
|
|
83
|
+
"zustand": "4.5.2"
|
|
52
84
|
},
|
|
53
85
|
"files": [
|
|
54
86
|
"dist",
|
|
@@ -67,58 +99,56 @@
|
|
|
67
99
|
},
|
|
68
100
|
"types": "./dist/index.d.ts",
|
|
69
101
|
"dependencies": {
|
|
70
|
-
"@formkit/auto-animate": "1.0.0-beta.5",
|
|
71
102
|
"@getalby/lightning-tools": "5.1.2",
|
|
72
|
-
"@hookform/error-message": "2.0.0",
|
|
73
|
-
"@hookform/resolvers": "2.9.7",
|
|
74
|
-
"@radix-ui/react-avatar": "1.1.3",
|
|
75
|
-
"@radix-ui/react-checkbox": "1.0.4",
|
|
76
|
-
"@radix-ui/react-id": "1.0.1",
|
|
77
|
-
"@radix-ui/react-tooltip": "1.0.6",
|
|
78
|
-
"@radix-ui/react-dialog-atoms": "npm:@radix-ui/react-dialog@1.0.4",
|
|
79
|
-
"@radix-ui/react-dropdown-menu": "2.0.5",
|
|
80
|
-
"@radix-ui/react-hover-card": "1.0.7",
|
|
81
|
-
"@radix-ui/react-popover-atoms": "npm:@radix-ui/react-popover@1.0.6",
|
|
82
|
-
"@radix-ui/react-radio-group": "1.1.3",
|
|
83
|
-
"@radix-ui/react-slot": "1.1.2",
|
|
84
|
-
"@radix-ui/react-switch": "1.1.0",
|
|
85
|
-
"@radix-ui/react-toast": "1.1.5",
|
|
86
|
-
"@radix-ui/react-toggle-group": "1.0.4",
|
|
87
|
-
"@radix-ui/react-tooltip-atoms": "npm:@radix-ui/react-tooltip@1.0.6",
|
|
88
|
-
"@stripe/react-stripe-js": "1.10.0",
|
|
89
|
-
"@stripe/stripe-js": "1.35.0",
|
|
90
|
-
"@tanstack/react-query": "5.17.19",
|
|
91
103
|
"axios": "^1.11.0",
|
|
92
104
|
"class-variance-authority": "0.4.0",
|
|
93
105
|
"clsx": "2.1.1",
|
|
94
106
|
"date-fns-tz": "3.2.0",
|
|
95
107
|
"dayjs": "1.11.2",
|
|
96
108
|
"dompurify": "3.4.0",
|
|
97
|
-
"framer-motion": "10.12.8",
|
|
98
|
-
"i18next": "23.2.3",
|
|
99
109
|
"libphonenumber-js": "^1.12.38",
|
|
100
110
|
"lodash": "4.18.0",
|
|
101
111
|
"marked": "15.0.6",
|
|
102
|
-
"react-digit-input": "2.1.0",
|
|
103
|
-
"react-hook-form": "7.43.3",
|
|
104
|
-
"react-i18next": "12.3.1",
|
|
105
|
-
"react-phone-input-2": "2.15.1",
|
|
106
|
-
"react-select": "^5.10.0",
|
|
107
|
-
"react-sticky-box": "2.0.4",
|
|
108
|
-
"react-timezone-select": "1.4.0",
|
|
109
|
-
"react-use": "17.6.0",
|
|
110
112
|
"rrule": "2.7.1",
|
|
111
|
-
"sonner": "1.7.4",
|
|
112
113
|
"tailwind-merge": "1.13.2",
|
|
113
|
-
"tailwindcss": "4.1.17",
|
|
114
114
|
"uuid": "11.1.0",
|
|
115
|
-
"zod": "^3.25.76"
|
|
116
|
-
"zustand": "4.5.2"
|
|
115
|
+
"zod": "^3.25.76"
|
|
117
116
|
},
|
|
118
117
|
"peerDependencies": {
|
|
118
|
+
"@formkit/auto-animate": "^1.0.0-beta.5 || ^1.0.0",
|
|
119
|
+
"@hookform/error-message": "^2.0.0",
|
|
120
|
+
"@hookform/resolvers": "^2.9.0 || ^3.0.0",
|
|
121
|
+
"@radix-ui/react-avatar": "^1.0.0",
|
|
122
|
+
"@radix-ui/react-checkbox": "^1.0.0",
|
|
123
|
+
"@radix-ui/react-dialog": "^1.0.0",
|
|
124
|
+
"@radix-ui/react-dropdown-menu": "^2.0.0",
|
|
125
|
+
"@radix-ui/react-hover-card": "^1.0.0",
|
|
126
|
+
"@radix-ui/react-id": "^1.0.0",
|
|
127
|
+
"@radix-ui/react-popover": "^1.0.0",
|
|
128
|
+
"@radix-ui/react-radio-group": "^1.0.0",
|
|
129
|
+
"@radix-ui/react-slot": "^1.0.0",
|
|
130
|
+
"@radix-ui/react-switch": "^1.0.0",
|
|
131
|
+
"@radix-ui/react-toast": "^1.0.0",
|
|
132
|
+
"@radix-ui/react-toggle-group": "^1.0.0",
|
|
133
|
+
"@radix-ui/react-tooltip": "^1.0.0",
|
|
134
|
+
"@stripe/react-stripe-js": "^1.10.0 || ^2.0.0",
|
|
135
|
+
"@stripe/stripe-js": "^1.35.0 || ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0",
|
|
136
|
+
"@tanstack/react-query": "^5.0.0",
|
|
137
|
+
"framer-motion": "^10.0.0 || ^11.0.0 || ^12.0.0",
|
|
138
|
+
"i18next": "^23.0.0",
|
|
119
139
|
"next": "^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0",
|
|
120
140
|
"react": "^18.0.0 || ^19.0.0",
|
|
121
|
-
"react-
|
|
141
|
+
"react-digit-input": "^2.0.0",
|
|
142
|
+
"react-dom": "^18.0.0 || ^19.0.0",
|
|
143
|
+
"react-hook-form": "^7.0.0",
|
|
144
|
+
"react-i18next": "^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0",
|
|
145
|
+
"react-phone-input-2": "^2.15.0",
|
|
146
|
+
"react-select": "^5.0.0",
|
|
147
|
+
"react-sticky-box": "^2.0.0",
|
|
148
|
+
"react-timezone-select": "^1.0.0 || ^2.0.0 || ^3.0.0",
|
|
149
|
+
"react-use": "^17.0.0",
|
|
150
|
+
"sonner": "^1.0.0 || ^2.0.0",
|
|
151
|
+
"zustand": "^4.0.0 || ^5.0.0"
|
|
122
152
|
},
|
|
123
153
|
"main": "./dist/cal-atoms.js"
|
|
124
154
|
}
|