@betterstore/react 0.3.14 → 0.3.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/dist/components/checkout-embed/checkout-form.d.ts +5 -1
- package/dist/index.cjs.js +25 -11
- package/dist/index.mjs +25 -11
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -17,6 +17,10 @@ interface CheckoutFormProps {
|
|
|
17
17
|
setShippingCost: (cost: number) => void;
|
|
18
18
|
exchangeRate: number;
|
|
19
19
|
setCheckout: (checkout: any) => void;
|
|
20
|
+
setPaymentSecret: (paymentSecret: string) => void;
|
|
21
|
+
setPublicKey: (publicKey: string) => void;
|
|
22
|
+
paymentSecret: string | null;
|
|
23
|
+
publicKey: string | null;
|
|
20
24
|
}
|
|
21
|
-
export default function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }: CheckoutFormProps): React.JSX.Element;
|
|
25
|
+
export default function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }: CheckoutFormProps): React.JSX.Element;
|
|
22
26
|
export {};
|
package/dist/index.cjs.js
CHANGED
|
@@ -35451,10 +35451,8 @@ const motionSettings = {
|
|
|
35451
35451
|
exit: { opacity: 0 },
|
|
35452
35452
|
transition: { duration: 0.2 },
|
|
35453
35453
|
};
|
|
35454
|
-
function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }) {
|
|
35454
|
+
function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }) {
|
|
35455
35455
|
const { formData, setFormData, step, setStep, checkoutId: storedCheckoutId, setCheckoutId, } = useFormStore();
|
|
35456
|
-
const [paymentSecret, setPaymentSecret] = React.useState(null);
|
|
35457
|
-
const [publicKey, setPublicKey] = React.useState(null);
|
|
35458
35456
|
const [shippingRates, setShippingRates] = React.useState([]);
|
|
35459
35457
|
const validateStep = React.useCallback(() => {
|
|
35460
35458
|
if (step === "customer")
|
|
@@ -35609,9 +35607,7 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
|
|
|
35609
35607
|
};
|
|
35610
35608
|
React.useEffect(() => {
|
|
35611
35609
|
const asyncFunc = () => __awaiter(this, void 0, void 0, function* () {
|
|
35612
|
-
const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a
|
|
35613
|
-
console.log("newCheckout", newCheckout);
|
|
35614
|
-
console.log("rest", rest);
|
|
35610
|
+
const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a; __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
|
|
35615
35611
|
setPaymentSecret(paymentSecret);
|
|
35616
35612
|
setPublicKey(publicKey);
|
|
35617
35613
|
setCheckout(newCheckout);
|
|
@@ -35854,7 +35850,9 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35854
35850
|
const { cancelUrl, successUrl, appearance, locale, clientSecret, clientProxy, } = config;
|
|
35855
35851
|
const storeClient = React.useMemo(() => sdk.createStoreClient({ proxy: clientProxy }), [clientProxy]);
|
|
35856
35852
|
React.useMemo(() => createI18nInstance(locale), []);
|
|
35857
|
-
const { formData,
|
|
35853
|
+
const { formData, step } = useFormStore();
|
|
35854
|
+
const [paymentSecret, setPaymentSecret] = React.useState(null);
|
|
35855
|
+
const [publicKey, setPublicKey] = React.useState(null);
|
|
35858
35856
|
const [checkout, setCheckout] = React.useState(null);
|
|
35859
35857
|
const [loading, setLoading] = React.useState(true);
|
|
35860
35858
|
React.useEffect(() => {
|
|
@@ -35908,12 +35906,28 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35908
35906
|
setCheckout(newCheckout);
|
|
35909
35907
|
});
|
|
35910
35908
|
const revalidateDiscounts = () => __awaiter(this, void 0, void 0, function* () {
|
|
35911
|
-
|
|
35912
|
-
|
|
35909
|
+
if (step === "payment") {
|
|
35910
|
+
const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
|
|
35911
|
+
setPaymentSecret(paymentSecret);
|
|
35912
|
+
setPublicKey(publicKey);
|
|
35913
|
+
setCheckout(checkoutSession);
|
|
35914
|
+
}
|
|
35915
|
+
else {
|
|
35916
|
+
const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
|
|
35917
|
+
setCheckout(newCheckout);
|
|
35918
|
+
}
|
|
35913
35919
|
});
|
|
35914
35920
|
const removeDiscount = (id) => __awaiter(this, void 0, void 0, function* () {
|
|
35915
35921
|
const newCheckout = yield storeClient.removeDiscount(clientSecret, checkoutId, id);
|
|
35916
|
-
|
|
35922
|
+
if (step === "payment") {
|
|
35923
|
+
const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
|
|
35924
|
+
setPaymentSecret(paymentSecret);
|
|
35925
|
+
setPublicKey(publicKey);
|
|
35926
|
+
setCheckout(checkoutSession);
|
|
35927
|
+
}
|
|
35928
|
+
else {
|
|
35929
|
+
setCheckout(newCheckout);
|
|
35930
|
+
}
|
|
35917
35931
|
});
|
|
35918
35932
|
React.useEffect(() => {
|
|
35919
35933
|
const interval = setTimeout(() => {
|
|
@@ -35923,7 +35937,7 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35923
35937
|
}, []);
|
|
35924
35938
|
return (React.createElement("div", { className: "checkout-embed scrollbar-hidden mx-auto max-w-[1200px] min-h-screen overflow-x-hidden gap-6 md:gap-0 py-4 md:py-12 flex flex-col md:grid md:grid-cols-7 " },
|
|
35925
35939
|
React.createElement(Appearance, { appearance: appearance }),
|
|
35926
|
-
React.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React.createElement(CheckoutFormLoading, null)) : (React.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout }))),
|
|
35940
|
+
React.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React.createElement(CheckoutFormLoading, null)) : (React.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout, setPublicKey: setPublicKey, publicKey: publicKey, setPaymentSecret: setPaymentSecret, paymentSecret: paymentSecret }))),
|
|
35927
35941
|
React.createElement("div", { className: "md:col-span-3 px-4 md:px-8 order-first md:order-last" },
|
|
35928
35942
|
React.createElement(Toaster, null),
|
|
35929
35943
|
loading ? (React.createElement(CheckoutSummaryLoading, null)) : (React.createElement(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: checkout === null || checkout === void 0 ? void 0 : checkout.shipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], revalidateDiscounts: revalidateDiscounts, removeDiscount: removeDiscount })))));
|
package/dist/index.mjs
CHANGED
|
@@ -35428,10 +35428,8 @@ const motionSettings = {
|
|
|
35428
35428
|
exit: { opacity: 0 },
|
|
35429
35429
|
transition: { duration: 0.2 },
|
|
35430
35430
|
};
|
|
35431
|
-
function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, }) {
|
|
35431
|
+
function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, setCheckout, setPaymentSecret, setPublicKey, paymentSecret, publicKey, }) {
|
|
35432
35432
|
const { formData, setFormData, step, setStep, checkoutId: storedCheckoutId, setCheckoutId, } = useFormStore();
|
|
35433
|
-
const [paymentSecret, setPaymentSecret] = useState(null);
|
|
35434
|
-
const [publicKey, setPublicKey] = useState(null);
|
|
35435
35433
|
const [shippingRates, setShippingRates] = useState([]);
|
|
35436
35434
|
const validateStep = useCallback(() => {
|
|
35437
35435
|
if (step === "customer")
|
|
@@ -35586,9 +35584,7 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
|
|
|
35586
35584
|
};
|
|
35587
35585
|
useEffect(() => {
|
|
35588
35586
|
const asyncFunc = () => __awaiter(this, void 0, void 0, function* () {
|
|
35589
|
-
const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a
|
|
35590
|
-
console.log("newCheckout", newCheckout);
|
|
35591
|
-
console.log("rest", rest);
|
|
35587
|
+
const _a = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId), { paymentSecret, publicKey, checkoutSession: newCheckout } = _a; __rest(_a, ["paymentSecret", "publicKey", "checkoutSession"]);
|
|
35592
35588
|
setPaymentSecret(paymentSecret);
|
|
35593
35589
|
setPublicKey(publicKey);
|
|
35594
35590
|
setCheckout(newCheckout);
|
|
@@ -35831,7 +35827,9 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35831
35827
|
const { cancelUrl, successUrl, appearance, locale, clientSecret, clientProxy, } = config;
|
|
35832
35828
|
const storeClient = React__default.useMemo(() => createStoreClient({ proxy: clientProxy }), [clientProxy]);
|
|
35833
35829
|
React__default.useMemo(() => createI18nInstance(locale), []);
|
|
35834
|
-
const { formData,
|
|
35830
|
+
const { formData, step } = useFormStore();
|
|
35831
|
+
const [paymentSecret, setPaymentSecret] = useState(null);
|
|
35832
|
+
const [publicKey, setPublicKey] = useState(null);
|
|
35835
35833
|
const [checkout, setCheckout] = useState(null);
|
|
35836
35834
|
const [loading, setLoading] = useState(true);
|
|
35837
35835
|
useEffect(() => {
|
|
@@ -35885,12 +35883,28 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35885
35883
|
setCheckout(newCheckout);
|
|
35886
35884
|
});
|
|
35887
35885
|
const revalidateDiscounts = () => __awaiter(this, void 0, void 0, function* () {
|
|
35888
|
-
|
|
35889
|
-
|
|
35886
|
+
if (step === "payment") {
|
|
35887
|
+
const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
|
|
35888
|
+
setPaymentSecret(paymentSecret);
|
|
35889
|
+
setPublicKey(publicKey);
|
|
35890
|
+
setCheckout(checkoutSession);
|
|
35891
|
+
}
|
|
35892
|
+
else {
|
|
35893
|
+
const newCheckout = yield storeClient.revalidateDiscounts(clientSecret, checkoutId);
|
|
35894
|
+
setCheckout(newCheckout);
|
|
35895
|
+
}
|
|
35890
35896
|
});
|
|
35891
35897
|
const removeDiscount = (id) => __awaiter(this, void 0, void 0, function* () {
|
|
35892
35898
|
const newCheckout = yield storeClient.removeDiscount(clientSecret, checkoutId, id);
|
|
35893
|
-
|
|
35899
|
+
if (step === "payment") {
|
|
35900
|
+
const { paymentSecret, publicKey, checkoutSession } = yield storeClient.generateCheckoutPaymentSecret(clientSecret, checkoutId);
|
|
35901
|
+
setPaymentSecret(paymentSecret);
|
|
35902
|
+
setPublicKey(publicKey);
|
|
35903
|
+
setCheckout(checkoutSession);
|
|
35904
|
+
}
|
|
35905
|
+
else {
|
|
35906
|
+
setCheckout(newCheckout);
|
|
35907
|
+
}
|
|
35894
35908
|
});
|
|
35895
35909
|
useEffect(() => {
|
|
35896
35910
|
const interval = setTimeout(() => {
|
|
@@ -35900,7 +35914,7 @@ function CheckoutEmbed({ checkoutId, config }) {
|
|
|
35900
35914
|
}, []);
|
|
35901
35915
|
return (React__default.createElement("div", { className: "checkout-embed scrollbar-hidden mx-auto max-w-[1200px] min-h-screen overflow-x-hidden gap-6 md:gap-0 py-4 md:py-12 flex flex-col md:grid md:grid-cols-7 " },
|
|
35902
35916
|
React__default.createElement(Appearance, { appearance: appearance }),
|
|
35903
|
-
React__default.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React__default.createElement(CheckoutFormLoading, null)) : (React__default.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout }))),
|
|
35917
|
+
React__default.createElement("div", { className: "md:col-span-4 px-4 md:px-8" }, loading ? (React__default.createElement(CheckoutFormLoading, null)) : (React__default.createElement(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, setCheckout: setCheckout, setPublicKey: setPublicKey, publicKey: publicKey, setPaymentSecret: setPaymentSecret, paymentSecret: paymentSecret }))),
|
|
35904
35918
|
React__default.createElement("div", { className: "md:col-span-3 px-4 md:px-8 order-first md:order-last" },
|
|
35905
35919
|
React__default.createElement(Toaster, null),
|
|
35906
35920
|
loading ? (React__default.createElement(CheckoutSummaryLoading, null)) : (React__default.createElement(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: checkout === null || checkout === void 0 ? void 0 : checkout.shipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], revalidateDiscounts: revalidateDiscounts, removeDiscount: removeDiscount })))));
|