@pelcro/react-pelcro-js 3.21.0 → 3.22.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.
Files changed (3) hide show
  1. package/dist/index.cjs.js +177 -51
  2. package/dist/index.esm.js +177 -52
  3. package/package.json +1 -1
package/dist/index.cjs.js CHANGED
@@ -11141,6 +11141,9 @@ const initViewFromURL = () => {
11141
11141
  if (view === "manage-members") {
11142
11142
  return showSubscriptionManageMembersFromUrl();
11143
11143
  }
11144
+ if (view === "payment-method-update") {
11145
+ return showPaymentMethodUpdateFromUrl();
11146
+ }
11144
11147
  switchView(view);
11145
11148
  });
11146
11149
  }
@@ -11349,6 +11352,43 @@ const showPasswordlessRequestFromUrl = () => {
11349
11352
  } = usePelcro.getStore();
11350
11353
  return switchView("passwordless-request");
11351
11354
  };
11355
+ const showPaymentMethodUpdateFromUrl = () => {
11356
+ const {
11357
+ isAuthenticated,
11358
+ whenSiteReady,
11359
+ whenUserReady,
11360
+ switchView
11361
+ } = usePelcro.getStore();
11362
+ whenSiteReady(() => {
11363
+ if (!isAuthenticated()) {
11364
+ return switchView("login");
11365
+ }
11366
+ whenUserReady(() => {
11367
+ const supportsVantiv = Boolean(window.Pelcro.site.read().vantiv_gateway_settings);
11368
+ const supportsTap = Boolean(window.Pelcro.site.read().tap_gateway_settings);
11369
+ if (!window.Stripe && !supportsVantiv && !supportsTap) {
11370
+ document.querySelector('script[src="https://js.stripe.com/v3"]').addEventListener("load", () => {
11371
+ return switchView("payment-method-update");
11372
+ });
11373
+ return;
11374
+ }
11375
+
11376
+ //vantiv
11377
+ if (supportsVantiv) {
11378
+ document.querySelector("#vantiv-eprotect-sdk").addEventListener("load", () => {
11379
+ return switchView("payment-method-update");
11380
+ });
11381
+ return;
11382
+ }
11383
+
11384
+ //Tap
11385
+ if (supportsTap && document.querySelector("#tap-sdk")) {
11386
+ return switchView("payment-method-update");
11387
+ }
11388
+ return switchView("payment-method-update");
11389
+ });
11390
+ });
11391
+ };
11352
11392
  const showInvoiceDetailsFromUrl = () => {
11353
11393
  const {
11354
11394
  isAuthenticated,
@@ -13261,7 +13301,7 @@ function LoginModal(_ref) {
13261
13301
  }
13262
13302
  resetView();
13263
13303
  const viewFromURL = getStableViewID(window.Pelcro.helpers.getURLParameter("view"));
13264
- const viewsURLs = ["invoice-details", "gift-redeem", "plan-select"];
13304
+ const viewsURLs = ["invoice-details", "gift-redeem", "plan-select", "payment-method-update"];
13265
13305
  if (viewsURLs.includes(viewFromURL)) {
13266
13306
  initViewFromURL();
13267
13307
  }
@@ -13951,6 +13991,16 @@ function productsWithMatchedTaggedFirst() {
13951
13991
  const allProductsMinusMatched = allProducts.filter(product => !productsThatMatchArticleTag.some(matchedProduct => matchedProduct.id === product.id));
13952
13992
  return [productsThatMatchArticleTag, allProductsMinusMatched];
13953
13993
  }
13994
+ function productMatchPageLanguage(product) {
13995
+ if (!product) {
13996
+ return false;
13997
+ }
13998
+ if (product.language === null) {
13999
+ return true;
14000
+ }
14001
+ const siteLanguage = window.Pelcro.helpers.getHtmlLanguageAttribute();
14002
+ return product.language === siteLanguage;
14003
+ }
13954
14004
  SelectModalWithHook.viewId = "plan-select";
13955
14005
  class SelectModal extends React.Component {
13956
14006
  constructor(props) {
@@ -13992,22 +14042,23 @@ class SelectModal extends React.Component {
13992
14042
  const userCurrency = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$user = _window$Pelcro.user) === null || _window$Pelcro$user === void 0 ? void 0 : _window$Pelcro$user.read().currency;
13993
14043
  const userCountry = (_window$Pelcro2 = window.Pelcro) === null || _window$Pelcro2 === void 0 ? void 0 : (_window$Pelcro2$user = _window$Pelcro2.user) === null || _window$Pelcro2$user === void 0 ? void 0 : _window$Pelcro2$user.location.countryCode;
13994
14044
  const userLanguage = (_window$Pelcro3 = window.Pelcro) === null || _window$Pelcro3 === void 0 ? void 0 : (_window$Pelcro3$user = _window$Pelcro3.user) === null || _window$Pelcro3$user === void 0 ? void 0 : _window$Pelcro3$user.read().language;
13995
- const productsWithPlansCountries = (_window$Pelcro4 = window.Pelcro) === null || _window$Pelcro4 === void 0 ? void 0 : (_window$Pelcro4$site = _window$Pelcro4.site) === null || _window$Pelcro4$site === void 0 ? void 0 : _window$Pelcro4$site.read().products.filter(product => {
13996
- const filteredPlans = product.plans.filter(plan => plan.countries && plan.countries.length > 0);
13997
- if (filteredPlans.length) {
13998
- return product;
13999
- }
14045
+ const productsMatchingUserCurrency = (_window$Pelcro4 = window.Pelcro) === null || _window$Pelcro4 === void 0 ? void 0 : (_window$Pelcro4$site = _window$Pelcro4.site) === null || _window$Pelcro4$site === void 0 ? void 0 : _window$Pelcro4$site.read().products.map(product => {
14046
+ const filteredPlans = product.plans.filter(plan => plan.currency === userCurrency || !userCurrency);
14047
+ return {
14048
+ ...product,
14049
+ plans: filteredPlans
14050
+ };
14000
14051
  });
14001
- const currencyMismatch = productsWithPlansCountries.length ? productsWithPlansCountries.filter(product => {
14052
+ const productsMatchingUserCountry = productsMatchingUserCurrency.filter(product => {
14002
14053
  const filteredPlans = product.plans.filter(plan => {
14003
14054
  var _plan$countries;
14004
- return (_plan$countries = plan.countries) === null || _plan$countries === void 0 ? void 0 : _plan$countries.includes(userCountry);
14055
+ return plan.countries && ((_plan$countries = plan.countries) === null || _plan$countries === void 0 ? void 0 : _plan$countries.includes(userCountry)) || !plan.countries || !plan.countries.length;
14005
14056
  });
14006
14057
  if (filteredPlans.length) return filteredPlans;
14007
- }).length === 0 : false;
14058
+ });
14008
14059
  notifyBugsnag(() => {
14009
14060
  Bugsnag.notify("SelectModal - No data viewed", event => {
14010
- var _window$Pelcro5, _window$Pelcro5$site, _window$Pelcro6, _window$Pelcro6$user, _window$Pelcro7, _window$Pelcro7$uiSet, _window$Pelcro8, _this$props, _window$Pelcro9, _window$Pelcro9$helpe, _window$Pelcro10, _window$Pelcro10$site, _window$Pelcro11, _window$Pelcro11$site;
14061
+ var _window$Pelcro5, _window$Pelcro5$site, _window$Pelcro6, _window$Pelcro6$user, _window$Pelcro7, _window$Pelcro7$uiSet, _window$Pelcro8, _this$props, _window$Pelcro9, _window$Pelcro9$helpe;
14011
14062
  event.addMetadata("MetaData", {
14012
14063
  site: (_window$Pelcro5 = window.Pelcro) === null || _window$Pelcro5 === void 0 ? void 0 : (_window$Pelcro5$site = _window$Pelcro5.site) === null || _window$Pelcro5$site === void 0 ? void 0 : _window$Pelcro5$site.read(),
14013
14064
  user: (_window$Pelcro6 = window.Pelcro) === null || _window$Pelcro6 === void 0 ? void 0 : (_window$Pelcro6$user = _window$Pelcro6.user) === null || _window$Pelcro6$user === void 0 ? void 0 : _window$Pelcro6$user.read(),
@@ -14024,12 +14075,9 @@ class SelectModal extends React.Component {
14024
14075
  userCountry: userCountry,
14025
14076
  userLanguage: userLanguage,
14026
14077
  siteLanguage: (_window$Pelcro9 = window.Pelcro) === null || _window$Pelcro9 === void 0 ? void 0 : (_window$Pelcro9$helpe = _window$Pelcro9.helpers) === null || _window$Pelcro9$helpe === void 0 ? void 0 : _window$Pelcro9$helpe.getHtmlLanguageAttribute(),
14027
- currency_mismatch: ((_window$Pelcro10 = window.Pelcro) === null || _window$Pelcro10 === void 0 ? void 0 : (_window$Pelcro10$site = _window$Pelcro10.site) === null || _window$Pelcro10$site === void 0 ? void 0 : _window$Pelcro10$site.read().products.filter(product => {
14028
- const filteredPlans = product.plans.find(plan => plan.currency === userCurrency);
14029
- if (filteredPlans) return filteredPlans;
14030
- }).length) === 0,
14031
- country_restrictions: currencyMismatch,
14032
- language_mismatch: ((_window$Pelcro11 = window.Pelcro) === null || _window$Pelcro11 === void 0 ? void 0 : (_window$Pelcro11$site = _window$Pelcro11.site) === null || _window$Pelcro11$site === void 0 ? void 0 : _window$Pelcro11$site.read().products.filter(product => product.language === userLanguage).length) === 0
14078
+ currency_mismatch: productsMatchingUserCurrency.length === 0,
14079
+ country_restrictions: productsMatchingUserCountry.length === 0,
14080
+ language_mismatch: productsMatchingUserCountry.filter(product => product.plans.length).filter(productMatchPageLanguage).length === 0
14033
14081
  });
14034
14082
  });
14035
14083
  });
@@ -16795,7 +16843,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16795
16843
  const tapInstanceRef = React__default['default'].useRef(null);
16796
16844
  const tapInstanceCard = React__default['default'].useRef(null);
16797
16845
  React.useEffect(() => {
16798
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16846
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16799
16847
  if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
16800
16848
  var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
16801
16849
  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;
@@ -16824,7 +16872,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16824
16872
  }, [selectedPaymentMethodId]);
16825
16873
  React.useEffect(() => {
16826
16874
  whenUserReady(() => {
16827
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16875
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16828
16876
  if (cardProcessor === "tap" && !window.Tapjsli) {
16829
16877
  window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
16830
16878
  window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
@@ -16838,7 +16886,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16838
16886
  });
16839
16887
  }, [selectedPaymentMethodId]);
16840
16888
  const initPaymentRequest = (state, dispatch) => {
16841
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16889
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16842
16890
  try {
16843
16891
  const paymentRequest = stripe.paymentRequest({
16844
16892
  country: window.Pelcro.user.location.countryCode || "US",
@@ -16907,7 +16955,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16907
16955
  */
16908
16956
  const updateTotalAmountWithTax = () => {
16909
16957
  var _window$Pelcro$site$r4;
16910
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16958
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16911
16959
  const taxesEnabled = (_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.taxes_enabled;
16912
16960
  if (taxesEnabled && type === "createPayment") {
16913
16961
  dispatch({
@@ -17502,6 +17550,29 @@ const PaymentMethodContainerWithoutStripe = _ref => {
17502
17550
  });
17503
17551
  };
17504
17552
  const submitPayment = (state, dispatch) => {
17553
+ if (skipPayment && (order === null || order === void 0 ? void 0 : order.price) === 0) {
17554
+ const isQuickPurchase = !Array.isArray(order);
17555
+ const mappedOrderItems = isQuickPurchase ? [{
17556
+ sku_id: order.id,
17557
+ quantity: order.quantity
17558
+ }] : order.map(item => ({
17559
+ sku_id: item.id,
17560
+ quantity: item.quantity
17561
+ }));
17562
+ window.Pelcro.ecommerce.order.create({
17563
+ items: mappedOrderItems,
17564
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
17565
+ ...(selectedAddressId && {
17566
+ address_id: selectedAddressId
17567
+ })
17568
+ }, (err, res) => {
17569
+ if (err) {
17570
+ return handlePaymentError(err);
17571
+ }
17572
+ return onSuccess(res);
17573
+ });
17574
+ return;
17575
+ }
17505
17576
  stripe.createSource({
17506
17577
  type: "card"
17507
17578
  }).then(_ref8 => {
@@ -17863,10 +17934,14 @@ const PaymentMethodContainerWithoutStripe = _ref => {
17863
17934
  state,
17864
17935
  dispatch
17865
17936
  }
17866
- }, children.length ? children.map((child, i) => /*#__PURE__*/React__default['default'].cloneElement(child, {
17867
- store: store$k,
17868
- key: i
17869
- })) : /*#__PURE__*/React__default['default'].cloneElement(children, {
17937
+ }, children.length ? children.map((child, i) => {
17938
+ if (child) {
17939
+ return /*#__PURE__*/React__default['default'].cloneElement(child, {
17940
+ store: store$k,
17941
+ key: i
17942
+ });
17943
+ }
17944
+ }) : /*#__PURE__*/React__default['default'].cloneElement(children, {
17870
17945
  store: store$k
17871
17946
  })));
17872
17947
  };
@@ -18688,6 +18763,42 @@ const SubscriptionCreateFreePlanButton = _ref => {
18688
18763
  }, otherProps), t("buttons.subscribe"));
18689
18764
  };
18690
18765
 
18766
+ const OrderCreateFreeButton = _ref => {
18767
+ let {
18768
+ name,
18769
+ onClick,
18770
+ ...otherProps
18771
+ } = _ref;
18772
+ const {
18773
+ state: {
18774
+ disableSubmit
18775
+ },
18776
+ dispatch
18777
+ } = React.useContext(store$k);
18778
+ const {
18779
+ t
18780
+ } = useTranslation("checkoutForm");
18781
+ const [isDisabled, setDisabled] = React.useState(true);
18782
+ React.useEffect(() => {
18783
+ setDisabled(disableSubmit);
18784
+ }, [disableSubmit]);
18785
+ return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
18786
+ className: "plc-w-full",
18787
+ onClick: () => {
18788
+ dispatch({
18789
+ type: DISABLE_SUBMIT,
18790
+ payload: true
18791
+ });
18792
+ dispatch({
18793
+ type: SUBMIT_PAYMENT
18794
+ });
18795
+ onClick === null || onClick === void 0 ? void 0 : onClick();
18796
+ },
18797
+ disabled: isDisabled,
18798
+ isLoading: disableSubmit
18799
+ }, otherProps), t("labels.submit"));
18800
+ };
18801
+
18691
18802
  /**
18692
18803
  *
18693
18804
  */
@@ -18700,7 +18811,8 @@ function PaymentMethodView(_ref) {
18700
18811
  type,
18701
18812
  showCoupon,
18702
18813
  showExternalPaymentMethods,
18703
- showSubscriptionButton
18814
+ showSubscriptionButton,
18815
+ showOrderButton
18704
18816
  } = _ref;
18705
18817
  const {
18706
18818
  t
@@ -18713,7 +18825,7 @@ function PaymentMethodView(_ref) {
18713
18825
  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
18714
18826
  return /*#__PURE__*/React__default['default'].createElement("div", {
18715
18827
  className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
18716
- }, cardProcessor === "stripe" && !showSubscriptionButton && /*#__PURE__*/React__default['default'].createElement("div", {
18828
+ }, cardProcessor === "stripe" && !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default['default'].createElement("div", {
18717
18829
  className: "plc-flex plc-items-center plc-w-full plc-px-4 plc-py-2 plc-text-center plc-text-green-600 plc-border plc-border-green-400 plc-rounded plc-bg-green-50"
18718
18830
  }, /*#__PURE__*/React__default['default'].createElement(SvgLock, {
18719
18831
  className: "plc-w-5 plc-h-5 plc-mr-1"
@@ -18732,7 +18844,7 @@ function PaymentMethodView(_ref) {
18732
18844
  onFailure: onFailure
18733
18845
  }, /*#__PURE__*/React__default['default'].createElement(AlertWithContext, {
18734
18846
  className: "plc-mb-2"
18735
- }), showSubscriptionButton ? /*#__PURE__*/React__default['default'].createElement(SubscriptionCreateFreePlanButton, null) : /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(BankRedirection, null), /*#__PURE__*/React__default['default'].createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default['default'].createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
18847
+ }), showSubscriptionButton && /*#__PURE__*/React__default['default'].createElement(SubscriptionCreateFreePlanButton, null), showOrderButton && /*#__PURE__*/React__default['default'].createElement(OrderCreateFreeButton, null), !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(BankRedirection, null), /*#__PURE__*/React__default['default'].createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default['default'].createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
18736
18848
  className: "plc-flex plc-items-start"
18737
18849
  }, /*#__PURE__*/React__default['default'].createElement(IncludeFirstName, {
18738
18850
  id: "pelcro-input-first-name",
@@ -20523,27 +20635,32 @@ function SubscriptionManageMembersList(props) {
20523
20635
  type: HANDLE_REMOVE_MEMBER
20524
20636
  });
20525
20637
  };
20526
- return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, members === null || members === void 0 ? void 0 : members.map(member => /*#__PURE__*/React__default['default'].createElement("tr", {
20527
- key: member.id,
20528
- className: `plc-w-full plc-align-middle plc-cursor-pointer accordion-header hover:plc-bg-gray-50 plc-text-center`
20529
- }, /*#__PURE__*/React__default['default'].createElement("td", {
20530
- className: "plc-truncate plc-text-left",
20531
- title: member === null || member === void 0 ? void 0 : member.invitation_email
20532
- }, /*#__PURE__*/React__default['default'].createElement("span", {
20533
- className: "plc-font-semibold plc-text-gray-500"
20534
- }, member === null || member === void 0 ? void 0 : member.invitation_email)), /*#__PURE__*/React__default['default'].createElement("td", {
20535
- className: "plc-py-2"
20536
- }, /*#__PURE__*/React__default['default'].createElement("span", {
20537
- className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${getMemberStatus(member).bgColor} plc-uppercase ${getMemberStatus(member).textColor} plc-rounded-lg`
20538
- }, getMemberStatus(member).icon, getMemberStatus(member).title)), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement(Button, {
20539
- variant: "ghost",
20540
- className: "plc-text-red-500 focus:plc-ring-red-500 pelcro-dashboard-sub-cancel-button",
20541
- icon: /*#__PURE__*/React__default['default'].createElement(SvgXIconSolid, null),
20542
- onClick: () => onRemoveClick(member.id),
20543
- disabled: member.id === removeMemberId,
20544
- isLoading: member.id === removeMemberId,
20545
- "data-key": member.id
20546
- }, t("labels.remove"))))));
20638
+ return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, members === null || members === void 0 ? void 0 : members.map(member => {
20639
+ var _member$customer;
20640
+ return /*#__PURE__*/React__default['default'].createElement("tr", {
20641
+ key: member.id,
20642
+ className: `plc-w-full plc-align-middle plc-cursor-pointer accordion-header hover:plc-bg-gray-50 plc-text-center`
20643
+ }, /*#__PURE__*/React__default['default'].createElement("td", {
20644
+ className: "plc-truncate plc-text-left",
20645
+ title: member === null || member === void 0 ? void 0 : member.invitation_email
20646
+ }, member.status === "active" ? /*#__PURE__*/React__default['default'].createElement("span", {
20647
+ className: "plc-font-semibold plc-text-gray-500"
20648
+ }, member === null || member === void 0 ? void 0 : (_member$customer = member.customer) === null || _member$customer === void 0 ? void 0 : _member$customer.email) : /*#__PURE__*/React__default['default'].createElement("span", {
20649
+ className: "plc-font-semibold plc-text-gray-500"
20650
+ }, member === null || member === void 0 ? void 0 : member.invitation_email)), /*#__PURE__*/React__default['default'].createElement("td", {
20651
+ className: "plc-py-2"
20652
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
20653
+ className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${getMemberStatus(member).bgColor} plc-uppercase ${getMemberStatus(member).textColor} plc-rounded-lg`
20654
+ }, getMemberStatus(member).icon, getMemberStatus(member).title)), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement(Button, {
20655
+ variant: "ghost",
20656
+ className: "plc-text-red-500 focus:plc-ring-red-500 pelcro-dashboard-sub-cancel-button",
20657
+ icon: /*#__PURE__*/React__default['default'].createElement(SvgXIconSolid, null),
20658
+ onClick: () => onRemoveClick(member.id),
20659
+ disabled: member.id === removeMemberId,
20660
+ isLoading: member.id === removeMemberId,
20661
+ "data-key": member.id
20662
+ }, t("labels.remove"))));
20663
+ }));
20547
20664
  }
20548
20665
 
20549
20666
  /**
@@ -24137,9 +24254,15 @@ const OrderCreateContainer = props => /*#__PURE__*/React__default['default'].cre
24137
24254
  }, props));
24138
24255
 
24139
24256
  const OrderCreateView = props => {
24257
+ var _window$Pelcro, _window$Pelcro$uiSett;
24140
24258
  const {
24141
24259
  t
24142
24260
  } = useTranslation("payment");
24261
+ const {
24262
+ order
24263
+ } = usePelcro();
24264
+ const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
24265
+ const showOrderButton = skipPayment && (order === null || order === void 0 ? void 0 : order.price) === 0;
24143
24266
  return /*#__PURE__*/React__default['default'].createElement("div", {
24144
24267
  id: "pelcro-order-create-view"
24145
24268
  }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -24150,7 +24273,8 @@ const OrderCreateView = props => {
24150
24273
  }, /*#__PURE__*/React__default['default'].createElement(PaymentMethodView, Object.assign({
24151
24274
  type: "orderCreate",
24152
24275
  showCoupon: true,
24153
- showExternalPaymentMethods: false
24276
+ showExternalPaymentMethods: false,
24277
+ showOrderButton: showOrderButton
24154
24278
  }, props))));
24155
24279
  };
24156
24280
 
@@ -25358,11 +25482,12 @@ const PaymentMethodSelectModal = _ref => {
25358
25482
  const {
25359
25483
  switchToCheckoutForm,
25360
25484
  set,
25361
- plan
25485
+ plan,
25486
+ order
25362
25487
  } = usePelcro();
25363
25488
  const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
25364
25489
  React.useEffect(() => {
25365
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
25490
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) {
25366
25491
  switchToCheckoutForm();
25367
25492
  }
25368
25493
  }, []);
@@ -32180,6 +32305,7 @@ exports.NewsletterUpdateView = NewsletterUpdateView;
32180
32305
  exports.Notification = Notification;
32181
32306
  exports.OrderConfirmModal = OrderConfirmModal;
32182
32307
  exports.OrderCreateContainer = OrderCreateContainer;
32308
+ exports.OrderCreateFreeButton = OrderCreateFreeButton;
32183
32309
  exports.OrderCreateModal = OrderCreateModal;
32184
32310
  exports.OrderCreateSubmitButton = OrderCreateSubmitButton;
32185
32311
  exports.OrderCreateView = OrderCreateView;
package/dist/index.esm.js CHANGED
@@ -11111,6 +11111,9 @@ const initViewFromURL = () => {
11111
11111
  if (view === "manage-members") {
11112
11112
  return showSubscriptionManageMembersFromUrl();
11113
11113
  }
11114
+ if (view === "payment-method-update") {
11115
+ return showPaymentMethodUpdateFromUrl();
11116
+ }
11114
11117
  switchView(view);
11115
11118
  });
11116
11119
  }
@@ -11319,6 +11322,43 @@ const showPasswordlessRequestFromUrl = () => {
11319
11322
  } = usePelcro.getStore();
11320
11323
  return switchView("passwordless-request");
11321
11324
  };
11325
+ const showPaymentMethodUpdateFromUrl = () => {
11326
+ const {
11327
+ isAuthenticated,
11328
+ whenSiteReady,
11329
+ whenUserReady,
11330
+ switchView
11331
+ } = usePelcro.getStore();
11332
+ whenSiteReady(() => {
11333
+ if (!isAuthenticated()) {
11334
+ return switchView("login");
11335
+ }
11336
+ whenUserReady(() => {
11337
+ const supportsVantiv = Boolean(window.Pelcro.site.read().vantiv_gateway_settings);
11338
+ const supportsTap = Boolean(window.Pelcro.site.read().tap_gateway_settings);
11339
+ if (!window.Stripe && !supportsVantiv && !supportsTap) {
11340
+ document.querySelector('script[src="https://js.stripe.com/v3"]').addEventListener("load", () => {
11341
+ return switchView("payment-method-update");
11342
+ });
11343
+ return;
11344
+ }
11345
+
11346
+ //vantiv
11347
+ if (supportsVantiv) {
11348
+ document.querySelector("#vantiv-eprotect-sdk").addEventListener("load", () => {
11349
+ return switchView("payment-method-update");
11350
+ });
11351
+ return;
11352
+ }
11353
+
11354
+ //Tap
11355
+ if (supportsTap && document.querySelector("#tap-sdk")) {
11356
+ return switchView("payment-method-update");
11357
+ }
11358
+ return switchView("payment-method-update");
11359
+ });
11360
+ });
11361
+ };
11322
11362
  const showInvoiceDetailsFromUrl = () => {
11323
11363
  const {
11324
11364
  isAuthenticated,
@@ -13231,7 +13271,7 @@ function LoginModal(_ref) {
13231
13271
  }
13232
13272
  resetView();
13233
13273
  const viewFromURL = getStableViewID(window.Pelcro.helpers.getURLParameter("view"));
13234
- const viewsURLs = ["invoice-details", "gift-redeem", "plan-select"];
13274
+ const viewsURLs = ["invoice-details", "gift-redeem", "plan-select", "payment-method-update"];
13235
13275
  if (viewsURLs.includes(viewFromURL)) {
13236
13276
  initViewFromURL();
13237
13277
  }
@@ -13921,6 +13961,16 @@ function productsWithMatchedTaggedFirst() {
13921
13961
  const allProductsMinusMatched = allProducts.filter(product => !productsThatMatchArticleTag.some(matchedProduct => matchedProduct.id === product.id));
13922
13962
  return [productsThatMatchArticleTag, allProductsMinusMatched];
13923
13963
  }
13964
+ function productMatchPageLanguage(product) {
13965
+ if (!product) {
13966
+ return false;
13967
+ }
13968
+ if (product.language === null) {
13969
+ return true;
13970
+ }
13971
+ const siteLanguage = window.Pelcro.helpers.getHtmlLanguageAttribute();
13972
+ return product.language === siteLanguage;
13973
+ }
13924
13974
  SelectModalWithHook.viewId = "plan-select";
13925
13975
  class SelectModal extends Component {
13926
13976
  constructor(props) {
@@ -13962,22 +14012,23 @@ class SelectModal extends Component {
13962
14012
  const userCurrency = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$user = _window$Pelcro.user) === null || _window$Pelcro$user === void 0 ? void 0 : _window$Pelcro$user.read().currency;
13963
14013
  const userCountry = (_window$Pelcro2 = window.Pelcro) === null || _window$Pelcro2 === void 0 ? void 0 : (_window$Pelcro2$user = _window$Pelcro2.user) === null || _window$Pelcro2$user === void 0 ? void 0 : _window$Pelcro2$user.location.countryCode;
13964
14014
  const userLanguage = (_window$Pelcro3 = window.Pelcro) === null || _window$Pelcro3 === void 0 ? void 0 : (_window$Pelcro3$user = _window$Pelcro3.user) === null || _window$Pelcro3$user === void 0 ? void 0 : _window$Pelcro3$user.read().language;
13965
- const productsWithPlansCountries = (_window$Pelcro4 = window.Pelcro) === null || _window$Pelcro4 === void 0 ? void 0 : (_window$Pelcro4$site = _window$Pelcro4.site) === null || _window$Pelcro4$site === void 0 ? void 0 : _window$Pelcro4$site.read().products.filter(product => {
13966
- const filteredPlans = product.plans.filter(plan => plan.countries && plan.countries.length > 0);
13967
- if (filteredPlans.length) {
13968
- return product;
13969
- }
14015
+ const productsMatchingUserCurrency = (_window$Pelcro4 = window.Pelcro) === null || _window$Pelcro4 === void 0 ? void 0 : (_window$Pelcro4$site = _window$Pelcro4.site) === null || _window$Pelcro4$site === void 0 ? void 0 : _window$Pelcro4$site.read().products.map(product => {
14016
+ const filteredPlans = product.plans.filter(plan => plan.currency === userCurrency || !userCurrency);
14017
+ return {
14018
+ ...product,
14019
+ plans: filteredPlans
14020
+ };
13970
14021
  });
13971
- const currencyMismatch = productsWithPlansCountries.length ? productsWithPlansCountries.filter(product => {
14022
+ const productsMatchingUserCountry = productsMatchingUserCurrency.filter(product => {
13972
14023
  const filteredPlans = product.plans.filter(plan => {
13973
14024
  var _plan$countries;
13974
- return (_plan$countries = plan.countries) === null || _plan$countries === void 0 ? void 0 : _plan$countries.includes(userCountry);
14025
+ return plan.countries && ((_plan$countries = plan.countries) === null || _plan$countries === void 0 ? void 0 : _plan$countries.includes(userCountry)) || !plan.countries || !plan.countries.length;
13975
14026
  });
13976
14027
  if (filteredPlans.length) return filteredPlans;
13977
- }).length === 0 : false;
14028
+ });
13978
14029
  notifyBugsnag(() => {
13979
14030
  Bugsnag.notify("SelectModal - No data viewed", event => {
13980
- var _window$Pelcro5, _window$Pelcro5$site, _window$Pelcro6, _window$Pelcro6$user, _window$Pelcro7, _window$Pelcro7$uiSet, _window$Pelcro8, _this$props, _window$Pelcro9, _window$Pelcro9$helpe, _window$Pelcro10, _window$Pelcro10$site, _window$Pelcro11, _window$Pelcro11$site;
14031
+ var _window$Pelcro5, _window$Pelcro5$site, _window$Pelcro6, _window$Pelcro6$user, _window$Pelcro7, _window$Pelcro7$uiSet, _window$Pelcro8, _this$props, _window$Pelcro9, _window$Pelcro9$helpe;
13981
14032
  event.addMetadata("MetaData", {
13982
14033
  site: (_window$Pelcro5 = window.Pelcro) === null || _window$Pelcro5 === void 0 ? void 0 : (_window$Pelcro5$site = _window$Pelcro5.site) === null || _window$Pelcro5$site === void 0 ? void 0 : _window$Pelcro5$site.read(),
13983
14034
  user: (_window$Pelcro6 = window.Pelcro) === null || _window$Pelcro6 === void 0 ? void 0 : (_window$Pelcro6$user = _window$Pelcro6.user) === null || _window$Pelcro6$user === void 0 ? void 0 : _window$Pelcro6$user.read(),
@@ -13994,12 +14045,9 @@ class SelectModal extends Component {
13994
14045
  userCountry: userCountry,
13995
14046
  userLanguage: userLanguage,
13996
14047
  siteLanguage: (_window$Pelcro9 = window.Pelcro) === null || _window$Pelcro9 === void 0 ? void 0 : (_window$Pelcro9$helpe = _window$Pelcro9.helpers) === null || _window$Pelcro9$helpe === void 0 ? void 0 : _window$Pelcro9$helpe.getHtmlLanguageAttribute(),
13997
- currency_mismatch: ((_window$Pelcro10 = window.Pelcro) === null || _window$Pelcro10 === void 0 ? void 0 : (_window$Pelcro10$site = _window$Pelcro10.site) === null || _window$Pelcro10$site === void 0 ? void 0 : _window$Pelcro10$site.read().products.filter(product => {
13998
- const filteredPlans = product.plans.find(plan => plan.currency === userCurrency);
13999
- if (filteredPlans) return filteredPlans;
14000
- }).length) === 0,
14001
- country_restrictions: currencyMismatch,
14002
- language_mismatch: ((_window$Pelcro11 = window.Pelcro) === null || _window$Pelcro11 === void 0 ? void 0 : (_window$Pelcro11$site = _window$Pelcro11.site) === null || _window$Pelcro11$site === void 0 ? void 0 : _window$Pelcro11$site.read().products.filter(product => product.language === userLanguage).length) === 0
14048
+ currency_mismatch: productsMatchingUserCurrency.length === 0,
14049
+ country_restrictions: productsMatchingUserCountry.length === 0,
14050
+ language_mismatch: productsMatchingUserCountry.filter(product => product.plans.length).filter(productMatchPageLanguage).length === 0
14003
14051
  });
14004
14052
  });
14005
14053
  });
@@ -16765,7 +16813,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16765
16813
  const tapInstanceRef = React__default.useRef(null);
16766
16814
  const tapInstanceCard = React__default.useRef(null);
16767
16815
  useEffect(() => {
16768
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16816
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16769
16817
  if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
16770
16818
  var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
16771
16819
  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;
@@ -16794,7 +16842,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16794
16842
  }, [selectedPaymentMethodId]);
16795
16843
  useEffect(() => {
16796
16844
  whenUserReady(() => {
16797
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16845
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16798
16846
  if (cardProcessor === "tap" && !window.Tapjsli) {
16799
16847
  window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
16800
16848
  window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
@@ -16808,7 +16856,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16808
16856
  });
16809
16857
  }, [selectedPaymentMethodId]);
16810
16858
  const initPaymentRequest = (state, dispatch) => {
16811
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16859
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16812
16860
  try {
16813
16861
  const paymentRequest = stripe.paymentRequest({
16814
16862
  country: window.Pelcro.user.location.countryCode || "US",
@@ -16877,7 +16925,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
16877
16925
  */
16878
16926
  const updateTotalAmountWithTax = () => {
16879
16927
  var _window$Pelcro$site$r4;
16880
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
16928
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) return;
16881
16929
  const taxesEnabled = (_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.taxes_enabled;
16882
16930
  if (taxesEnabled && type === "createPayment") {
16883
16931
  dispatch({
@@ -17472,6 +17520,29 @@ const PaymentMethodContainerWithoutStripe = _ref => {
17472
17520
  });
17473
17521
  };
17474
17522
  const submitPayment = (state, dispatch) => {
17523
+ if (skipPayment && (order === null || order === void 0 ? void 0 : order.price) === 0) {
17524
+ const isQuickPurchase = !Array.isArray(order);
17525
+ const mappedOrderItems = isQuickPurchase ? [{
17526
+ sku_id: order.id,
17527
+ quantity: order.quantity
17528
+ }] : order.map(item => ({
17529
+ sku_id: item.id,
17530
+ quantity: item.quantity
17531
+ }));
17532
+ window.Pelcro.ecommerce.order.create({
17533
+ items: mappedOrderItems,
17534
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
17535
+ ...(selectedAddressId && {
17536
+ address_id: selectedAddressId
17537
+ })
17538
+ }, (err, res) => {
17539
+ if (err) {
17540
+ return handlePaymentError(err);
17541
+ }
17542
+ return onSuccess(res);
17543
+ });
17544
+ return;
17545
+ }
17475
17546
  stripe.createSource({
17476
17547
  type: "card"
17477
17548
  }).then(_ref8 => {
@@ -17833,10 +17904,14 @@ const PaymentMethodContainerWithoutStripe = _ref => {
17833
17904
  state,
17834
17905
  dispatch
17835
17906
  }
17836
- }, children.length ? children.map((child, i) => /*#__PURE__*/React__default.cloneElement(child, {
17837
- store: store$k,
17838
- key: i
17839
- })) : /*#__PURE__*/React__default.cloneElement(children, {
17907
+ }, children.length ? children.map((child, i) => {
17908
+ if (child) {
17909
+ return /*#__PURE__*/React__default.cloneElement(child, {
17910
+ store: store$k,
17911
+ key: i
17912
+ });
17913
+ }
17914
+ }) : /*#__PURE__*/React__default.cloneElement(children, {
17840
17915
  store: store$k
17841
17916
  })));
17842
17917
  };
@@ -18658,6 +18733,42 @@ const SubscriptionCreateFreePlanButton = _ref => {
18658
18733
  }, otherProps), t("buttons.subscribe"));
18659
18734
  };
18660
18735
 
18736
+ const OrderCreateFreeButton = _ref => {
18737
+ let {
18738
+ name,
18739
+ onClick,
18740
+ ...otherProps
18741
+ } = _ref;
18742
+ const {
18743
+ state: {
18744
+ disableSubmit
18745
+ },
18746
+ dispatch
18747
+ } = useContext(store$k);
18748
+ const {
18749
+ t
18750
+ } = useTranslation("checkoutForm");
18751
+ const [isDisabled, setDisabled] = useState(true);
18752
+ useEffect(() => {
18753
+ setDisabled(disableSubmit);
18754
+ }, [disableSubmit]);
18755
+ return /*#__PURE__*/React__default.createElement(Button, Object.assign({
18756
+ className: "plc-w-full",
18757
+ onClick: () => {
18758
+ dispatch({
18759
+ type: DISABLE_SUBMIT,
18760
+ payload: true
18761
+ });
18762
+ dispatch({
18763
+ type: SUBMIT_PAYMENT
18764
+ });
18765
+ onClick === null || onClick === void 0 ? void 0 : onClick();
18766
+ },
18767
+ disabled: isDisabled,
18768
+ isLoading: disableSubmit
18769
+ }, otherProps), t("labels.submit"));
18770
+ };
18771
+
18661
18772
  /**
18662
18773
  *
18663
18774
  */
@@ -18670,7 +18781,8 @@ function PaymentMethodView(_ref) {
18670
18781
  type,
18671
18782
  showCoupon,
18672
18783
  showExternalPaymentMethods,
18673
- showSubscriptionButton
18784
+ showSubscriptionButton,
18785
+ showOrderButton
18674
18786
  } = _ref;
18675
18787
  const {
18676
18788
  t
@@ -18683,7 +18795,7 @@ function PaymentMethodView(_ref) {
18683
18795
  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
18684
18796
  return /*#__PURE__*/React__default.createElement("div", {
18685
18797
  className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
18686
- }, cardProcessor === "stripe" && !showSubscriptionButton && /*#__PURE__*/React__default.createElement("div", {
18798
+ }, cardProcessor === "stripe" && !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default.createElement("div", {
18687
18799
  className: "plc-flex plc-items-center plc-w-full plc-px-4 plc-py-2 plc-text-center plc-text-green-600 plc-border plc-border-green-400 plc-rounded plc-bg-green-50"
18688
18800
  }, /*#__PURE__*/React__default.createElement(SvgLock, {
18689
18801
  className: "plc-w-5 plc-h-5 plc-mr-1"
@@ -18702,7 +18814,7 @@ function PaymentMethodView(_ref) {
18702
18814
  onFailure: onFailure
18703
18815
  }, /*#__PURE__*/React__default.createElement(AlertWithContext, {
18704
18816
  className: "plc-mb-2"
18705
- }), showSubscriptionButton ? /*#__PURE__*/React__default.createElement(SubscriptionCreateFreePlanButton, null) : /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(BankRedirection, null), /*#__PURE__*/React__default.createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
18817
+ }), showSubscriptionButton && /*#__PURE__*/React__default.createElement(SubscriptionCreateFreePlanButton, null), showOrderButton && /*#__PURE__*/React__default.createElement(OrderCreateFreeButton, null), !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(BankRedirection, null), /*#__PURE__*/React__default.createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
18706
18818
  className: "plc-flex plc-items-start"
18707
18819
  }, /*#__PURE__*/React__default.createElement(IncludeFirstName, {
18708
18820
  id: "pelcro-input-first-name",
@@ -20493,27 +20605,32 @@ function SubscriptionManageMembersList(props) {
20493
20605
  type: HANDLE_REMOVE_MEMBER
20494
20606
  });
20495
20607
  };
20496
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, members === null || members === void 0 ? void 0 : members.map(member => /*#__PURE__*/React__default.createElement("tr", {
20497
- key: member.id,
20498
- className: `plc-w-full plc-align-middle plc-cursor-pointer accordion-header hover:plc-bg-gray-50 plc-text-center`
20499
- }, /*#__PURE__*/React__default.createElement("td", {
20500
- className: "plc-truncate plc-text-left",
20501
- title: member === null || member === void 0 ? void 0 : member.invitation_email
20502
- }, /*#__PURE__*/React__default.createElement("span", {
20503
- className: "plc-font-semibold plc-text-gray-500"
20504
- }, member === null || member === void 0 ? void 0 : member.invitation_email)), /*#__PURE__*/React__default.createElement("td", {
20505
- className: "plc-py-2"
20506
- }, /*#__PURE__*/React__default.createElement("span", {
20507
- className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${getMemberStatus(member).bgColor} plc-uppercase ${getMemberStatus(member).textColor} plc-rounded-lg`
20508
- }, getMemberStatus(member).icon, getMemberStatus(member).title)), /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement(Button, {
20509
- variant: "ghost",
20510
- className: "plc-text-red-500 focus:plc-ring-red-500 pelcro-dashboard-sub-cancel-button",
20511
- icon: /*#__PURE__*/React__default.createElement(SvgXIconSolid, null),
20512
- onClick: () => onRemoveClick(member.id),
20513
- disabled: member.id === removeMemberId,
20514
- isLoading: member.id === removeMemberId,
20515
- "data-key": member.id
20516
- }, t("labels.remove"))))));
20608
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, members === null || members === void 0 ? void 0 : members.map(member => {
20609
+ var _member$customer;
20610
+ return /*#__PURE__*/React__default.createElement("tr", {
20611
+ key: member.id,
20612
+ className: `plc-w-full plc-align-middle plc-cursor-pointer accordion-header hover:plc-bg-gray-50 plc-text-center`
20613
+ }, /*#__PURE__*/React__default.createElement("td", {
20614
+ className: "plc-truncate plc-text-left",
20615
+ title: member === null || member === void 0 ? void 0 : member.invitation_email
20616
+ }, member.status === "active" ? /*#__PURE__*/React__default.createElement("span", {
20617
+ className: "plc-font-semibold plc-text-gray-500"
20618
+ }, member === null || member === void 0 ? void 0 : (_member$customer = member.customer) === null || _member$customer === void 0 ? void 0 : _member$customer.email) : /*#__PURE__*/React__default.createElement("span", {
20619
+ className: "plc-font-semibold plc-text-gray-500"
20620
+ }, member === null || member === void 0 ? void 0 : member.invitation_email)), /*#__PURE__*/React__default.createElement("td", {
20621
+ className: "plc-py-2"
20622
+ }, /*#__PURE__*/React__default.createElement("span", {
20623
+ className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${getMemberStatus(member).bgColor} plc-uppercase ${getMemberStatus(member).textColor} plc-rounded-lg`
20624
+ }, getMemberStatus(member).icon, getMemberStatus(member).title)), /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement(Button, {
20625
+ variant: "ghost",
20626
+ className: "plc-text-red-500 focus:plc-ring-red-500 pelcro-dashboard-sub-cancel-button",
20627
+ icon: /*#__PURE__*/React__default.createElement(SvgXIconSolid, null),
20628
+ onClick: () => onRemoveClick(member.id),
20629
+ disabled: member.id === removeMemberId,
20630
+ isLoading: member.id === removeMemberId,
20631
+ "data-key": member.id
20632
+ }, t("labels.remove"))));
20633
+ }));
20517
20634
  }
20518
20635
 
20519
20636
  /**
@@ -24107,9 +24224,15 @@ const OrderCreateContainer = props => /*#__PURE__*/React__default.createElement(
24107
24224
  }, props));
24108
24225
 
24109
24226
  const OrderCreateView = props => {
24227
+ var _window$Pelcro, _window$Pelcro$uiSett;
24110
24228
  const {
24111
24229
  t
24112
24230
  } = useTranslation("payment");
24231
+ const {
24232
+ order
24233
+ } = usePelcro();
24234
+ const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
24235
+ const showOrderButton = skipPayment && (order === null || order === void 0 ? void 0 : order.price) === 0;
24113
24236
  return /*#__PURE__*/React__default.createElement("div", {
24114
24237
  id: "pelcro-order-create-view"
24115
24238
  }, /*#__PURE__*/React__default.createElement("div", {
@@ -24120,7 +24243,8 @@ const OrderCreateView = props => {
24120
24243
  }, /*#__PURE__*/React__default.createElement(PaymentMethodView, Object.assign({
24121
24244
  type: "orderCreate",
24122
24245
  showCoupon: true,
24123
- showExternalPaymentMethods: false
24246
+ showExternalPaymentMethods: false,
24247
+ showOrderButton: showOrderButton
24124
24248
  }, props))));
24125
24249
  };
24126
24250
 
@@ -25328,11 +25452,12 @@ const PaymentMethodSelectModal = _ref => {
25328
25452
  const {
25329
25453
  switchToCheckoutForm,
25330
25454
  set,
25331
- plan
25455
+ plan,
25456
+ order
25332
25457
  } = usePelcro();
25333
25458
  const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
25334
25459
  useEffect(() => {
25335
- if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
25460
+ if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || (order === null || order === void 0 ? void 0 : order.price) === 0)) {
25336
25461
  switchToCheckoutForm();
25337
25462
  }
25338
25463
  }, []);
@@ -32037,4 +32162,4 @@ const QrCodeModal = _ref => {
32037
32162
  };
32038
32163
  QrCodeModal.viewId = "qrcode";
32039
32164
 
32040
- export { AddressCreateCity, AddressCreateContainer, AddressCreateCountrySelect, AddressCreateFirstName, AddressCreateLastName, AddressCreateLine1, AddressCreateLine2, AddressCreateModal, AddressCreatePostalCode, AddressCreateSetDefault, AddressCreateStateSelect, AddressCreateSubmit, AddressCreateTextInput, AddressCreateView, AddressSelectContainer, AddressSelectList, AddressSelectModal, AddressSelectSubmit, AddressSelectView, AddressUpdateCity, AddressUpdateContainer, AddressUpdateCountrySelect, AddressUpdateFirstName, AddressUpdateLastName, AddressUpdateLine1, AddressUpdateLine2, AddressUpdateModal, AddressUpdatePostalCode, AddressUpdateSetDefault, AddressUpdateStateSelect, AddressUpdateSubmit, AddressUpdateTextInput, AddressUpdateView, AlertWithContext as Alert, Alert as AlertElement, ApplyCouponButton, Auth0LoginButton, Badge, BankAuthenticationSuccess, BankRedirection, Button, CartContainer, CartModal, CartRemoveItemButton, CartSubmit, CartTotalPrice, CartView, Checkbox, CheckoutForm, ConfirmPassword, CouponCode, CouponCodeField, DashboardWithHook as Dashboard, DashboardOpenButton, DatePicker, DiscountedPrice, Email, EmailVerifyContainer, EmailVerifyModal, EmailVerifyResendButton, EmailVerifyView, FacebookLoginButton, GiftCreateContainer, GiftCreateEmail, GiftCreateFirstName, GiftCreateLastName, GiftCreateMessage, GiftCreateModal, GiftCreateStartDate, GiftCreateSubmitButton, GiftCreateView, GiftRedeemCode, GiftRedeemContainer, GiftRedeemModal, GiftRedeemSubmitButton, GiftRedeemView, GoogleLoginButton, IncludeFirstName, IncludeLastName, IncludePhone, Input, InvoiceDetailsContainer, InvoiceDetailsDownloadButton, InvoiceDetailsModal, InvoiceDetailsPayButton, InvoiceDetailsView, InvoicePaymentContainer, InvoicePaymentModal, InvoicePaymentView, Link, LoginButton, LoginContainer, LoginEmail, LoginModal, LoginPassword, LoginRequestLoginToken, LoginUsername, LoginView, Logout, MeterModal, MeterView, Modal, ModalBody, ModalFooter, NewsletterWithHook as NewsLetter, NewsletterUpdateButton, NewsletterUpdateContainer, NewsletterUpdateList, NewsletterUpdateModal, NewsletterUpdateView, Notification, OrderConfirmModal, OrderCreateContainer, OrderCreateModal, OrderCreateSubmitButton, OrderCreateView, Password, PasswordChangeButton, PasswordChangeConfirmNewPassword, PasswordChangeContainer, PasswordChangeCurrentPassword, PasswordChangeModal, PasswordChangeNewPassword, PasswordChangeView, PasswordForgotButton, PasswordForgotContainer, PasswordForgotEmail, PasswordForgotModal, PasswordForgotView, PasswordResetButton, PasswordResetConfirmPassword, PasswordResetContainer, PasswordResetEmail, PasswordResetModal, PasswordResetPassword, PasswordResetView, PasswordlessRequestContainer, PasswordlessRequestEmail, PasswordlessRequestModal, PasswordlessRequestView, PasswordlessRequestViewButton, PaymentCreateContainer, PaymentCreateView, PaymentMethodContainer, PaymentMethodSelectContainer, PaymentMethodSelectList, PaymentMethodSelectModal, PaymentMethodSelectSubmit, PaymentMethodSelectView, PaymentMethodUpdateContainer, PaymentMethodUpdateModal, PaymentMethodUpdateView, PaymentMethodView, PaymentSuccessModal, PaymentSuccessView, PaypalSubscribeButton, PelcroCardCVC, PelcroCardExpiry, PelcroCardNumber, PelcroModalController, PelcroPaymentRequestButton, ProfilePicChangeButton, ProfilePicChangeContainer, ProfilePicChangeCropper, ProfilePicChangeModal, ProfilePicChangeRemoveButton, ProfilePicChangeSelectButton, ProfilePicChangeView, ProfilePicChangeZoom, QrCodeModal, QrCodeView, Radio, RegisterButton, RegisterCompany, RegisterContainer, RegisterEmail, RegisterFirstName, RegisterJobTitle, RegisterLastName, RegisterModal, RegisterPassword, RegisterView, Select, SelectModalWithHook as SelectModal, SelectedPaymentMethod, ShopPurchaseButton, ShopSelectProductButton, ShopView, SubmitPaymentMethod, SubscriptionCancelModal, SubscriptionCreateContainer, SubscriptionCreateFreePlanButton, SubscriptionCreateModal, SubscriptionCreateView, SubscriptionManageMembersButton, SubscriptionManageMembersContainer, SubscriptionManageMembersEmails, SubscriptionManageMembersList, SubscriptionManageMembersModal, SubscriptionManageMembersView, SubscriptionRenewContainer, SubscriptionRenewModal, SubscriptionRenewView, SubscriptionSuspendContainer, SubscriptionSuspendModal, SubscriptionSuspendView, TaxAmount, TextArea, Tooltip, UserNameInput, UserUpdateButton, UserUpdateContainer, UserUpdateDisplayName, UserUpdateEmail, UserUpdateFirstName, UserUpdateLastName, UserUpdateModal, UserUpdatePhone, UserUpdateProfilePic, UserUpdateTextInput, UserUpdateTin, UserUpdateUsername, UserUpdateView, VerifyLinkTokenContainer, VerifyLinkTokenLoader, VerifyLinkTokenModal, VerifyLinkTokenView, authenticatedButtons, i18next as i18n, init$1 as initButtons, init as initContentEntitlement, invoicePaymentSubmitButton, notify$1 as notify, unauthenticatedButtons, usePelcro };
32165
+ export { AddressCreateCity, AddressCreateContainer, AddressCreateCountrySelect, AddressCreateFirstName, AddressCreateLastName, AddressCreateLine1, AddressCreateLine2, AddressCreateModal, AddressCreatePostalCode, AddressCreateSetDefault, AddressCreateStateSelect, AddressCreateSubmit, AddressCreateTextInput, AddressCreateView, AddressSelectContainer, AddressSelectList, AddressSelectModal, AddressSelectSubmit, AddressSelectView, AddressUpdateCity, AddressUpdateContainer, AddressUpdateCountrySelect, AddressUpdateFirstName, AddressUpdateLastName, AddressUpdateLine1, AddressUpdateLine2, AddressUpdateModal, AddressUpdatePostalCode, AddressUpdateSetDefault, AddressUpdateStateSelect, AddressUpdateSubmit, AddressUpdateTextInput, AddressUpdateView, AlertWithContext as Alert, Alert as AlertElement, ApplyCouponButton, Auth0LoginButton, Badge, BankAuthenticationSuccess, BankRedirection, Button, CartContainer, CartModal, CartRemoveItemButton, CartSubmit, CartTotalPrice, CartView, Checkbox, CheckoutForm, ConfirmPassword, CouponCode, CouponCodeField, DashboardWithHook as Dashboard, DashboardOpenButton, DatePicker, DiscountedPrice, Email, EmailVerifyContainer, EmailVerifyModal, EmailVerifyResendButton, EmailVerifyView, FacebookLoginButton, GiftCreateContainer, GiftCreateEmail, GiftCreateFirstName, GiftCreateLastName, GiftCreateMessage, GiftCreateModal, GiftCreateStartDate, GiftCreateSubmitButton, GiftCreateView, GiftRedeemCode, GiftRedeemContainer, GiftRedeemModal, GiftRedeemSubmitButton, GiftRedeemView, GoogleLoginButton, IncludeFirstName, IncludeLastName, IncludePhone, Input, InvoiceDetailsContainer, InvoiceDetailsDownloadButton, InvoiceDetailsModal, InvoiceDetailsPayButton, InvoiceDetailsView, InvoicePaymentContainer, InvoicePaymentModal, InvoicePaymentView, Link, LoginButton, LoginContainer, LoginEmail, LoginModal, LoginPassword, LoginRequestLoginToken, LoginUsername, LoginView, Logout, MeterModal, MeterView, Modal, ModalBody, ModalFooter, NewsletterWithHook as NewsLetter, NewsletterUpdateButton, NewsletterUpdateContainer, NewsletterUpdateList, NewsletterUpdateModal, NewsletterUpdateView, Notification, OrderConfirmModal, OrderCreateContainer, OrderCreateFreeButton, OrderCreateModal, OrderCreateSubmitButton, OrderCreateView, Password, PasswordChangeButton, PasswordChangeConfirmNewPassword, PasswordChangeContainer, PasswordChangeCurrentPassword, PasswordChangeModal, PasswordChangeNewPassword, PasswordChangeView, PasswordForgotButton, PasswordForgotContainer, PasswordForgotEmail, PasswordForgotModal, PasswordForgotView, PasswordResetButton, PasswordResetConfirmPassword, PasswordResetContainer, PasswordResetEmail, PasswordResetModal, PasswordResetPassword, PasswordResetView, PasswordlessRequestContainer, PasswordlessRequestEmail, PasswordlessRequestModal, PasswordlessRequestView, PasswordlessRequestViewButton, PaymentCreateContainer, PaymentCreateView, PaymentMethodContainer, PaymentMethodSelectContainer, PaymentMethodSelectList, PaymentMethodSelectModal, PaymentMethodSelectSubmit, PaymentMethodSelectView, PaymentMethodUpdateContainer, PaymentMethodUpdateModal, PaymentMethodUpdateView, PaymentMethodView, PaymentSuccessModal, PaymentSuccessView, PaypalSubscribeButton, PelcroCardCVC, PelcroCardExpiry, PelcroCardNumber, PelcroModalController, PelcroPaymentRequestButton, ProfilePicChangeButton, ProfilePicChangeContainer, ProfilePicChangeCropper, ProfilePicChangeModal, ProfilePicChangeRemoveButton, ProfilePicChangeSelectButton, ProfilePicChangeView, ProfilePicChangeZoom, QrCodeModal, QrCodeView, Radio, RegisterButton, RegisterCompany, RegisterContainer, RegisterEmail, RegisterFirstName, RegisterJobTitle, RegisterLastName, RegisterModal, RegisterPassword, RegisterView, Select, SelectModalWithHook as SelectModal, SelectedPaymentMethod, ShopPurchaseButton, ShopSelectProductButton, ShopView, SubmitPaymentMethod, SubscriptionCancelModal, SubscriptionCreateContainer, SubscriptionCreateFreePlanButton, SubscriptionCreateModal, SubscriptionCreateView, SubscriptionManageMembersButton, SubscriptionManageMembersContainer, SubscriptionManageMembersEmails, SubscriptionManageMembersList, SubscriptionManageMembersModal, SubscriptionManageMembersView, SubscriptionRenewContainer, SubscriptionRenewModal, SubscriptionRenewView, SubscriptionSuspendContainer, SubscriptionSuspendModal, SubscriptionSuspendView, TaxAmount, TextArea, Tooltip, UserNameInput, UserUpdateButton, UserUpdateContainer, UserUpdateDisplayName, UserUpdateEmail, UserUpdateFirstName, UserUpdateLastName, UserUpdateModal, UserUpdatePhone, UserUpdateProfilePic, UserUpdateTextInput, UserUpdateTin, UserUpdateUsername, UserUpdateView, VerifyLinkTokenContainer, VerifyLinkTokenLoader, VerifyLinkTokenModal, VerifyLinkTokenView, authenticatedButtons, i18next as i18n, init$1 as initButtons, init as initContentEntitlement, invoicePaymentSubmitButton, notify$1 as notify, unauthenticatedButtons, usePelcro };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pelcro/react-pelcro-js",
3
3
  "description": "Pelcro's React UI Elements",
4
- "version": "3.21.0",
4
+ "version": "3.22.0-beta.1",
5
5
  "license": "MIT",
6
6
  "private": false,
7
7
  "main": "dist/index.cjs.js",