@pelcro/react-pelcro-js 3.10.1-beta.9 → 3.11.0-beta.1
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.cjs.js +67 -71
- package/dist/index.esm.js +67 -71
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -15405,6 +15405,9 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15405
15405
|
selectedPaymentMethodId,
|
|
15406
15406
|
couponCode
|
|
15407
15407
|
} = usePelcro();
|
|
15408
|
+
const {
|
|
15409
|
+
whenUserReady
|
|
15410
|
+
} = usePelcro.getStore();
|
|
15408
15411
|
const product = (_props$product = props.product) !== null && _props$product !== void 0 ? _props$product : pelcroStore.product;
|
|
15409
15412
|
const plan = (_props$plan = props.plan) !== null && _props$plan !== void 0 ? _props$plan : pelcroStore.plan;
|
|
15410
15413
|
const subscriptionIdToRenew = (_props$subscriptionId = props.subscriptionIdToRenew) !== null && _props$subscriptionId !== void 0 ? _props$subscriptionId : pelcroStore.subscriptionIdToRenew;
|
|
@@ -15413,6 +15416,7 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15413
15416
|
const isGift = (_props$isGift = props.isGift) !== null && _props$isGift !== void 0 ? _props$isGift : pelcroStore.isGift;
|
|
15414
15417
|
const isRenewingGift = (_props$isRenewingGift = props.isRenewingGift) !== null && _props$isRenewingGift !== void 0 ? _props$isRenewingGift : pelcroStore.isRenewingGift;
|
|
15415
15418
|
const invoice = (_props$invoice = props.invoice) !== null && _props$invoice !== void 0 ? _props$invoice : pelcroStore.invoice;
|
|
15419
|
+
const cardProcessor = getSiteCardProcessor();
|
|
15416
15420
|
React.useEffect(() => {
|
|
15417
15421
|
if (window.Pelcro.coupon.getFromUrl()) {
|
|
15418
15422
|
dispatch({
|
|
@@ -15686,6 +15690,52 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15686
15690
|
}
|
|
15687
15691
|
}
|
|
15688
15692
|
}
|
|
15693
|
+
|
|
15694
|
+
const initTapScript = () => {
|
|
15695
|
+
var _window$Pelcro$site$r;
|
|
15696
|
+
|
|
15697
|
+
const tapKey = window.Tapjsli((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings.publishable_key);
|
|
15698
|
+
let elements = tapKey.elements({});
|
|
15699
|
+
let style = {
|
|
15700
|
+
base: {
|
|
15701
|
+
color: "#535353",
|
|
15702
|
+
lineHeight: "18px",
|
|
15703
|
+
fontFamily: "sans-serif",
|
|
15704
|
+
fontSmoothing: "antialiased",
|
|
15705
|
+
fontSize: "16px",
|
|
15706
|
+
"::placeholder": {
|
|
15707
|
+
color: "rgba(0, 0, 0, 0.26)",
|
|
15708
|
+
fontSize: "15px"
|
|
15709
|
+
}
|
|
15710
|
+
},
|
|
15711
|
+
invalid: {
|
|
15712
|
+
color: "red"
|
|
15713
|
+
}
|
|
15714
|
+
}; // input labels/placeholders
|
|
15715
|
+
|
|
15716
|
+
let labels = {
|
|
15717
|
+
cardNumber: "Card Number",
|
|
15718
|
+
expirationDate: "MM/YY",
|
|
15719
|
+
cvv: "CVV",
|
|
15720
|
+
cardHolder: "Card Holder Name"
|
|
15721
|
+
}; //payment options
|
|
15722
|
+
|
|
15723
|
+
let paymentOptions = {
|
|
15724
|
+
labels: labels,
|
|
15725
|
+
TextDirection: "ltr"
|
|
15726
|
+
}; //create element, pass style and payment options
|
|
15727
|
+
|
|
15728
|
+
let card = elements.create("card", {
|
|
15729
|
+
style: style
|
|
15730
|
+
}, paymentOptions); //mount element
|
|
15731
|
+
|
|
15732
|
+
card.mount("#tapPaymentIframe"); //card change event listener
|
|
15733
|
+
|
|
15734
|
+
card.addEventListener("change", function (event) {//If needed
|
|
15735
|
+
});
|
|
15736
|
+
tapInstanceRef.current = tapKey;
|
|
15737
|
+
tapInstanceCard.current = card;
|
|
15738
|
+
};
|
|
15689
15739
|
/*====== End Tap integration ========*/
|
|
15690
15740
|
|
|
15691
15741
|
|
|
@@ -15867,13 +15917,12 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15867
15917
|
const vantivInstanceRef = React__default['default'].useRef(null);
|
|
15868
15918
|
const tapInstanceRef = React__default['default'].useRef(null);
|
|
15869
15919
|
const tapInstanceCard = React__default['default'].useRef(null);
|
|
15870
|
-
const cardProcessor = getSiteCardProcessor();
|
|
15871
15920
|
React.useEffect(() => {
|
|
15872
15921
|
if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
|
|
15873
|
-
var _window$Pelcro$site$
|
|
15922
|
+
var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
|
|
15874
15923
|
|
|
15875
|
-
const payPageId = (_window$Pelcro$site$
|
|
15876
|
-
const reportGroup = (_window$Pelcro$site$
|
|
15924
|
+
const payPageId = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.vantiv_gateway_settings.pay_page_id;
|
|
15925
|
+
const reportGroup = (_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.vantiv_gateway_settings.report_group;
|
|
15877
15926
|
vantivInstanceRef.current = new window.EprotectIframeClient({
|
|
15878
15927
|
paypageId: payPageId,
|
|
15879
15928
|
reportGroup: reportGroup,
|
|
@@ -15897,73 +15946,20 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15897
15946
|
}
|
|
15898
15947
|
}, [selectedPaymentMethodId]);
|
|
15899
15948
|
React.useEffect(() => {
|
|
15900
|
-
|
|
15901
|
-
|
|
15902
|
-
|
|
15903
|
-
|
|
15904
|
-
|
|
15905
|
-
|
|
15906
|
-
|
|
15907
|
-
|
|
15908
|
-
|
|
15909
|
-
|
|
15910
|
-
|
|
15911
|
-
|
|
15912
|
-
|
|
15913
|
-
|
|
15914
|
-
color: "rgba(0, 0, 0, 0.26)",
|
|
15915
|
-
fontSize: "15px"
|
|
15916
|
-
}
|
|
15917
|
-
},
|
|
15918
|
-
invalid: {
|
|
15919
|
-
color: "red"
|
|
15920
|
-
}
|
|
15921
|
-
}; // input labels/placeholders
|
|
15922
|
-
|
|
15923
|
-
let labels = {
|
|
15924
|
-
cardNumber: "Card Number",
|
|
15925
|
-
expirationDate: "MM/YY",
|
|
15926
|
-
cvv: "CVV",
|
|
15927
|
-
cardHolder: "Card Holder Name"
|
|
15928
|
-
}; //payment options
|
|
15929
|
-
|
|
15930
|
-
let paymentOptions = {
|
|
15931
|
-
labels: labels,
|
|
15932
|
-
TextDirection: "ltr"
|
|
15933
|
-
}; //create element, pass style and payment options
|
|
15934
|
-
|
|
15935
|
-
let card = elements.create("card", {
|
|
15936
|
-
style: style
|
|
15937
|
-
}, paymentOptions); //mount element
|
|
15938
|
-
|
|
15939
|
-
card.mount("#tapPaymentIframe"); //card change event listener
|
|
15940
|
-
|
|
15941
|
-
card.addEventListener("change", function (event) {// if (event.error_interactive) {
|
|
15942
|
-
// onFailure(event.error_interactive);
|
|
15943
|
-
// return dispatch({
|
|
15944
|
-
// type: SHOW_ALERT,
|
|
15945
|
-
// payload: {
|
|
15946
|
-
// type: "error",
|
|
15947
|
-
// content: getErrorMessages(event.error_interactive)
|
|
15948
|
-
// }
|
|
15949
|
-
// });
|
|
15950
|
-
// } else {
|
|
15951
|
-
// dispatch({
|
|
15952
|
-
// type: SHOW_ALERT,
|
|
15953
|
-
// payload: { type: "error", content: "" }
|
|
15954
|
-
// });
|
|
15955
|
-
// }
|
|
15956
|
-
// let displayError = document.getElementById("error-handler");
|
|
15957
|
-
// if (event.error) {
|
|
15958
|
-
// displayError.textContent = event.error.message;
|
|
15959
|
-
// } else {
|
|
15960
|
-
// displayError.textContent = "";
|
|
15961
|
-
// }
|
|
15962
|
-
});
|
|
15963
|
-
tapInstanceRef.current = tapKey;
|
|
15964
|
-
tapInstanceCard.current = card;
|
|
15965
|
-
}
|
|
15966
|
-
}, [selectedPaymentMethodId, window.Tapjsli]);
|
|
15949
|
+
whenUserReady(() => {
|
|
15950
|
+
if (cardProcessor === "tap" && !window.Tapjsli) {
|
|
15951
|
+
window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
|
|
15952
|
+
window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
|
|
15953
|
+
document.querySelector('script[src="https://secure.gosell.io/js/sdk/tap.min.js"]').addEventListener("load", () => {
|
|
15954
|
+
initTapScript();
|
|
15955
|
+
});
|
|
15956
|
+
}
|
|
15957
|
+
|
|
15958
|
+
if (cardProcessor === "tap" && !selectedPaymentMethodId && window.Tapjsli) {
|
|
15959
|
+
initTapScript();
|
|
15960
|
+
}
|
|
15961
|
+
});
|
|
15962
|
+
}, [selectedPaymentMethodId]);
|
|
15967
15963
|
|
|
15968
15964
|
const initPaymentRequest = (state, dispatch) => {
|
|
15969
15965
|
try {
|
package/dist/index.esm.js
CHANGED
|
@@ -15375,6 +15375,9 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15375
15375
|
selectedPaymentMethodId,
|
|
15376
15376
|
couponCode
|
|
15377
15377
|
} = usePelcro();
|
|
15378
|
+
const {
|
|
15379
|
+
whenUserReady
|
|
15380
|
+
} = usePelcro.getStore();
|
|
15378
15381
|
const product = (_props$product = props.product) !== null && _props$product !== void 0 ? _props$product : pelcroStore.product;
|
|
15379
15382
|
const plan = (_props$plan = props.plan) !== null && _props$plan !== void 0 ? _props$plan : pelcroStore.plan;
|
|
15380
15383
|
const subscriptionIdToRenew = (_props$subscriptionId = props.subscriptionIdToRenew) !== null && _props$subscriptionId !== void 0 ? _props$subscriptionId : pelcroStore.subscriptionIdToRenew;
|
|
@@ -15383,6 +15386,7 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15383
15386
|
const isGift = (_props$isGift = props.isGift) !== null && _props$isGift !== void 0 ? _props$isGift : pelcroStore.isGift;
|
|
15384
15387
|
const isRenewingGift = (_props$isRenewingGift = props.isRenewingGift) !== null && _props$isRenewingGift !== void 0 ? _props$isRenewingGift : pelcroStore.isRenewingGift;
|
|
15385
15388
|
const invoice = (_props$invoice = props.invoice) !== null && _props$invoice !== void 0 ? _props$invoice : pelcroStore.invoice;
|
|
15389
|
+
const cardProcessor = getSiteCardProcessor();
|
|
15386
15390
|
useEffect(() => {
|
|
15387
15391
|
if (window.Pelcro.coupon.getFromUrl()) {
|
|
15388
15392
|
dispatch({
|
|
@@ -15656,6 +15660,52 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15656
15660
|
}
|
|
15657
15661
|
}
|
|
15658
15662
|
}
|
|
15663
|
+
|
|
15664
|
+
const initTapScript = () => {
|
|
15665
|
+
var _window$Pelcro$site$r;
|
|
15666
|
+
|
|
15667
|
+
const tapKey = window.Tapjsli((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings.publishable_key);
|
|
15668
|
+
let elements = tapKey.elements({});
|
|
15669
|
+
let style = {
|
|
15670
|
+
base: {
|
|
15671
|
+
color: "#535353",
|
|
15672
|
+
lineHeight: "18px",
|
|
15673
|
+
fontFamily: "sans-serif",
|
|
15674
|
+
fontSmoothing: "antialiased",
|
|
15675
|
+
fontSize: "16px",
|
|
15676
|
+
"::placeholder": {
|
|
15677
|
+
color: "rgba(0, 0, 0, 0.26)",
|
|
15678
|
+
fontSize: "15px"
|
|
15679
|
+
}
|
|
15680
|
+
},
|
|
15681
|
+
invalid: {
|
|
15682
|
+
color: "red"
|
|
15683
|
+
}
|
|
15684
|
+
}; // input labels/placeholders
|
|
15685
|
+
|
|
15686
|
+
let labels = {
|
|
15687
|
+
cardNumber: "Card Number",
|
|
15688
|
+
expirationDate: "MM/YY",
|
|
15689
|
+
cvv: "CVV",
|
|
15690
|
+
cardHolder: "Card Holder Name"
|
|
15691
|
+
}; //payment options
|
|
15692
|
+
|
|
15693
|
+
let paymentOptions = {
|
|
15694
|
+
labels: labels,
|
|
15695
|
+
TextDirection: "ltr"
|
|
15696
|
+
}; //create element, pass style and payment options
|
|
15697
|
+
|
|
15698
|
+
let card = elements.create("card", {
|
|
15699
|
+
style: style
|
|
15700
|
+
}, paymentOptions); //mount element
|
|
15701
|
+
|
|
15702
|
+
card.mount("#tapPaymentIframe"); //card change event listener
|
|
15703
|
+
|
|
15704
|
+
card.addEventListener("change", function (event) {//If needed
|
|
15705
|
+
});
|
|
15706
|
+
tapInstanceRef.current = tapKey;
|
|
15707
|
+
tapInstanceCard.current = card;
|
|
15708
|
+
};
|
|
15659
15709
|
/*====== End Tap integration ========*/
|
|
15660
15710
|
|
|
15661
15711
|
|
|
@@ -15837,13 +15887,12 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15837
15887
|
const vantivInstanceRef = React__default.useRef(null);
|
|
15838
15888
|
const tapInstanceRef = React__default.useRef(null);
|
|
15839
15889
|
const tapInstanceCard = React__default.useRef(null);
|
|
15840
|
-
const cardProcessor = getSiteCardProcessor();
|
|
15841
15890
|
useEffect(() => {
|
|
15842
15891
|
if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
|
|
15843
|
-
var _window$Pelcro$site$
|
|
15892
|
+
var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
|
|
15844
15893
|
|
|
15845
|
-
const payPageId = (_window$Pelcro$site$
|
|
15846
|
-
const reportGroup = (_window$Pelcro$site$
|
|
15894
|
+
const payPageId = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.vantiv_gateway_settings.pay_page_id;
|
|
15895
|
+
const reportGroup = (_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.vantiv_gateway_settings.report_group;
|
|
15847
15896
|
vantivInstanceRef.current = new window.EprotectIframeClient({
|
|
15848
15897
|
paypageId: payPageId,
|
|
15849
15898
|
reportGroup: reportGroup,
|
|
@@ -15867,73 +15916,20 @@ const PaymentMethodContainerWithoutStripe = ({
|
|
|
15867
15916
|
}
|
|
15868
15917
|
}, [selectedPaymentMethodId]);
|
|
15869
15918
|
useEffect(() => {
|
|
15870
|
-
|
|
15871
|
-
|
|
15872
|
-
|
|
15873
|
-
|
|
15874
|
-
|
|
15875
|
-
|
|
15876
|
-
|
|
15877
|
-
|
|
15878
|
-
|
|
15879
|
-
|
|
15880
|
-
|
|
15881
|
-
|
|
15882
|
-
|
|
15883
|
-
|
|
15884
|
-
color: "rgba(0, 0, 0, 0.26)",
|
|
15885
|
-
fontSize: "15px"
|
|
15886
|
-
}
|
|
15887
|
-
},
|
|
15888
|
-
invalid: {
|
|
15889
|
-
color: "red"
|
|
15890
|
-
}
|
|
15891
|
-
}; // input labels/placeholders
|
|
15892
|
-
|
|
15893
|
-
let labels = {
|
|
15894
|
-
cardNumber: "Card Number",
|
|
15895
|
-
expirationDate: "MM/YY",
|
|
15896
|
-
cvv: "CVV",
|
|
15897
|
-
cardHolder: "Card Holder Name"
|
|
15898
|
-
}; //payment options
|
|
15899
|
-
|
|
15900
|
-
let paymentOptions = {
|
|
15901
|
-
labels: labels,
|
|
15902
|
-
TextDirection: "ltr"
|
|
15903
|
-
}; //create element, pass style and payment options
|
|
15904
|
-
|
|
15905
|
-
let card = elements.create("card", {
|
|
15906
|
-
style: style
|
|
15907
|
-
}, paymentOptions); //mount element
|
|
15908
|
-
|
|
15909
|
-
card.mount("#tapPaymentIframe"); //card change event listener
|
|
15910
|
-
|
|
15911
|
-
card.addEventListener("change", function (event) {// if (event.error_interactive) {
|
|
15912
|
-
// onFailure(event.error_interactive);
|
|
15913
|
-
// return dispatch({
|
|
15914
|
-
// type: SHOW_ALERT,
|
|
15915
|
-
// payload: {
|
|
15916
|
-
// type: "error",
|
|
15917
|
-
// content: getErrorMessages(event.error_interactive)
|
|
15918
|
-
// }
|
|
15919
|
-
// });
|
|
15920
|
-
// } else {
|
|
15921
|
-
// dispatch({
|
|
15922
|
-
// type: SHOW_ALERT,
|
|
15923
|
-
// payload: { type: "error", content: "" }
|
|
15924
|
-
// });
|
|
15925
|
-
// }
|
|
15926
|
-
// let displayError = document.getElementById("error-handler");
|
|
15927
|
-
// if (event.error) {
|
|
15928
|
-
// displayError.textContent = event.error.message;
|
|
15929
|
-
// } else {
|
|
15930
|
-
// displayError.textContent = "";
|
|
15931
|
-
// }
|
|
15932
|
-
});
|
|
15933
|
-
tapInstanceRef.current = tapKey;
|
|
15934
|
-
tapInstanceCard.current = card;
|
|
15935
|
-
}
|
|
15936
|
-
}, [selectedPaymentMethodId, window.Tapjsli]);
|
|
15919
|
+
whenUserReady(() => {
|
|
15920
|
+
if (cardProcessor === "tap" && !window.Tapjsli) {
|
|
15921
|
+
window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
|
|
15922
|
+
window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
|
|
15923
|
+
document.querySelector('script[src="https://secure.gosell.io/js/sdk/tap.min.js"]').addEventListener("load", () => {
|
|
15924
|
+
initTapScript();
|
|
15925
|
+
});
|
|
15926
|
+
}
|
|
15927
|
+
|
|
15928
|
+
if (cardProcessor === "tap" && !selectedPaymentMethodId && window.Tapjsli) {
|
|
15929
|
+
initTapScript();
|
|
15930
|
+
}
|
|
15931
|
+
});
|
|
15932
|
+
}, [selectedPaymentMethodId]);
|
|
15937
15933
|
|
|
15938
15934
|
const initPaymentRequest = (state, dispatch) => {
|
|
15939
15935
|
try {
|