@pelcro/react-pelcro-js 4.0.0-alpha.85 → 4.0.0-alpha.87

package/dist/index.cjs.js

@@ -33053,12 +33053,21 @@ const OrderCreateSummary = ({
   const [items, setItems] = React.useState([]);
   const [orderTotal, setOrderTotal] = React.useState("");
   React.useEffect(() => {
-    if ((order === null || order === void 0 ? void 0 : order.length) > 0) {
+    const isQuickPurchase = !Array.isArray(order);
+
+    if (isQuickPurchase) {
       var _calcAndFormatItemsTo, _order$;
 
-      setItems(order);
+      setItems([order]);
       setOrderTotal((_calcAndFormatItemsTo = calcAndFormatItemsTotal(order, (_order$ = order[0]) === null || _order$ === void 0 ? void 0 : _order$.currency)) !== null && _calcAndFormatItemsTo !== void 0 ? _calcAndFormatItemsTo : getFormattedPriceByLocal(order === null || order === void 0 ? void 0 : order.price, order === null || order === void 0 ? void 0 : order.currency, getPageOrDefaultLanguage()));
     }
+
+    if ((order === null || order === void 0 ? void 0 : order.length) > 0) {
+      var _calcAndFormatItemsTo2, _order$2;
+
+      setItems(order);
+      setOrderTotal((_calcAndFormatItemsTo2 = calcAndFormatItemsTotal(order, (_order$2 = order[0]) === null || _order$2 === void 0 ? void 0 : _order$2.currency)) !== null && _calcAndFormatItemsTo2 !== void 0 ? _calcAndFormatItemsTo2 : getFormattedPriceByLocal(order === null || order === void 0 ? void 0 : order.price, order === null || order === void 0 ? void 0 : order.currency, getPageOrDefaultLanguage()));
+    }
   }, []);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-px-8 md:plc-px-0"
@@ -33172,7 +33181,8 @@ const OrderCreateModal = ({
   ...otherProps
 }) => {
   const {
-    switchView
+    switchView,
+    order
   } = usePelcro();
   const {
     t
@@ -33185,6 +33195,39 @@ const OrderCreateModal = ({
     return switchView("order-confirm");
   };
 
+  const showBackButton = Boolean(order);
+
+  const userHasPaymentMethod = () => {
+    var _window$Pelcro$user$r, _window$Pelcro$user$r2;
+
+    const sources = (_window$Pelcro$user$r = (_window$Pelcro$user$r2 = window.Pelcro.user.read()) === null || _window$Pelcro$user$r2 === void 0 ? void 0 : _window$Pelcro$user$r2.sources) !== null && _window$Pelcro$user$r !== void 0 ? _window$Pelcro$user$r : [];
+    return sources.length > 0;
+  };
+
+  const userHasAddress = () => {
+    var _window$Pelcro$user$r3, _window$Pelcro$user$r4;
+
+    const addresses = (_window$Pelcro$user$r3 = (_window$Pelcro$user$r4 = window.Pelcro.user.read()) === null || _window$Pelcro$user$r4 === void 0 ? void 0 : _window$Pelcro$user$r4.addresses) !== null && _window$Pelcro$user$r3 !== void 0 ? _window$Pelcro$user$r3 : [];
+    return addresses.length > 0;
+  };
+
+  const isUserHasPaymentMethod = userHasPaymentMethod();
+  const isUserHasAddress = userHasAddress();
+
+  const goBack = () => {
+    if (order && isUserHasPaymentMethod) {
+      return switchView("payment-method-select");
+    }
+
+    if (order && isUserHasAddress) {
+      return switchView("address-select");
+    }
+
+    if (order) {
+      return switchView("cart");
+    }
+  };
+
   return /*#__PURE__*/React__default['default'].createElement(Modal, {
     id: "pelcro-order-create-modal",
     className: "plc-max-w-7xl",
@@ -33193,8 +33236,12 @@ const OrderCreateModal = ({
     onCloseModal: onClose
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-text-left plc-text-gray-900 pelcro-title-wrapper plc-flex-1 plc-flex plc-flex-col plc-justify-center"
-  }, /*#__PURE__*/React__default['default'].createElement("h4", {
-    className: "plc-text-xl plc-font-bold "
+  }, showBackButton && /*#__PURE__*/React__default['default'].createElement("button", {
+    type: "button",
+    onClick: goBack,
+    className: "plc-absolute plc-w-6 plc-text-gray-500 focus:plc-text-black plc-z-max plc-top-1/2 plc-left-6 plc-transform plc--translate-y-1/2 plc-border-0 hover:plc-text-black hover:plc-shadow-none plc-bg-transparent hover:plc-bg-transparent focus:plc-bg-transparent"
+  }, /*#__PURE__*/React__default['default'].createElement(SvgArrowLeft, null)), /*#__PURE__*/React__default['default'].createElement("h4", {
+    className: "plc-text-xl plc-font-bold plc-text-center"
   }, t("labels.checkout.title")))), /*#__PURE__*/React__default['default'].createElement(ModalBody, null, /*#__PURE__*/React__default['default'].createElement(OrderCreateView, Object.assign({}, otherProps, {
     onSuccess: onSuccess
   }))), /*#__PURE__*/React__default['default'].createElement(ModalFooter, null));
@@ -34241,7 +34288,8 @@ const AddressSelectModal = ({
     resetView,
     product,
     plan,
-    giftRecipient
+    giftRecipient,
+    order
   } = usePelcro();
   const {
     t
@@ -34273,11 +34321,15 @@ const AddressSelectModal = ({
     resetView();
   };
 
-  const showBackButton = Boolean(product && plan && !giftRecipient);
+  const showBackButton = Boolean(product && plan && !giftRecipient || order);
 
   const goBack = () => {
     if (product && plan) {
-      switchView("plan-select");
+      return switchView("plan-select");
+    }
+
+    if (order) {
+      return switchView("cart");
     }
   };
 
@@ -34665,7 +34717,7 @@ const PaymentMethodSelectModal = ({
     switchToCheckoutForm();
   };
 
-  const showBackButton = Boolean(product && plan && !giftRecipient);
+  const showBackButton = Boolean(product && plan && !giftRecipient || order);
 
   const userHasAddress = () => {
     var _window$Pelcro$user$r, _window$Pelcro$user$r2;
@@ -34677,13 +34729,17 @@ const PaymentMethodSelectModal = ({
   const isUserHasAddress = userHasAddress();
 
   const goBack = () => {
-    if (product && plan && product.address_required && isUserHasAddress) {
+    if ((product && plan && product.address_required || order) && isUserHasAddress) {
       return switchView("address-select");
     }
 
     if (product && plan) {
       return switchView("plan-select");
     }
+
+    if (order) {
+      return switchView("cart");
+    }
   };
 
   return /*#__PURE__*/React__default['default'].createElement(Modal, {

package/dist/index.esm.js

@@ -33023,12 +33023,21 @@ const OrderCreateSummary = ({
   const [items, setItems] = useState([]);
   const [orderTotal, setOrderTotal] = useState("");
   useEffect(() => {
-    if ((order === null || order === void 0 ? void 0 : order.length) > 0) {
+    const isQuickPurchase = !Array.isArray(order);
+
+    if (isQuickPurchase) {
       var _calcAndFormatItemsTo, _order$;
 
-      setItems(order);
+      setItems([order]);
       setOrderTotal((_calcAndFormatItemsTo = calcAndFormatItemsTotal(order, (_order$ = order[0]) === null || _order$ === void 0 ? void 0 : _order$.currency)) !== null && _calcAndFormatItemsTo !== void 0 ? _calcAndFormatItemsTo : getFormattedPriceByLocal(order === null || order === void 0 ? void 0 : order.price, order === null || order === void 0 ? void 0 : order.currency, getPageOrDefaultLanguage()));
     }
+
+    if ((order === null || order === void 0 ? void 0 : order.length) > 0) {
+      var _calcAndFormatItemsTo2, _order$2;
+
+      setItems(order);
+      setOrderTotal((_calcAndFormatItemsTo2 = calcAndFormatItemsTotal(order, (_order$2 = order[0]) === null || _order$2 === void 0 ? void 0 : _order$2.currency)) !== null && _calcAndFormatItemsTo2 !== void 0 ? _calcAndFormatItemsTo2 : getFormattedPriceByLocal(order === null || order === void 0 ? void 0 : order.price, order === null || order === void 0 ? void 0 : order.currency, getPageOrDefaultLanguage()));
+    }
   }, []);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "plc-px-8 md:plc-px-0"
@@ -33142,7 +33151,8 @@ const OrderCreateModal = ({
   ...otherProps
 }) => {
   const {
-    switchView
+    switchView,
+    order
   } = usePelcro();
   const {
     t
@@ -33155,6 +33165,39 @@ const OrderCreateModal = ({
     return switchView("order-confirm");
   };
 
+  const showBackButton = Boolean(order);
+
+  const userHasPaymentMethod = () => {
+    var _window$Pelcro$user$r, _window$Pelcro$user$r2;
+
+    const sources = (_window$Pelcro$user$r = (_window$Pelcro$user$r2 = window.Pelcro.user.read()) === null || _window$Pelcro$user$r2 === void 0 ? void 0 : _window$Pelcro$user$r2.sources) !== null && _window$Pelcro$user$r !== void 0 ? _window$Pelcro$user$r : [];
+    return sources.length > 0;
+  };
+
+  const userHasAddress = () => {
+    var _window$Pelcro$user$r3, _window$Pelcro$user$r4;
+
+    const addresses = (_window$Pelcro$user$r3 = (_window$Pelcro$user$r4 = window.Pelcro.user.read()) === null || _window$Pelcro$user$r4 === void 0 ? void 0 : _window$Pelcro$user$r4.addresses) !== null && _window$Pelcro$user$r3 !== void 0 ? _window$Pelcro$user$r3 : [];
+    return addresses.length > 0;
+  };
+
+  const isUserHasPaymentMethod = userHasPaymentMethod();
+  const isUserHasAddress = userHasAddress();
+
+  const goBack = () => {
+    if (order && isUserHasPaymentMethod) {
+      return switchView("payment-method-select");
+    }
+
+    if (order && isUserHasAddress) {
+      return switchView("address-select");
+    }
+
+    if (order) {
+      return switchView("cart");
+    }
+  };
+
   return /*#__PURE__*/React__default.createElement(Modal, {
     id: "pelcro-order-create-modal",
     className: "plc-max-w-7xl",
@@ -33163,8 +33206,12 @@ const OrderCreateModal = ({
     onCloseModal: onClose
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "plc-text-left plc-text-gray-900 pelcro-title-wrapper plc-flex-1 plc-flex plc-flex-col plc-justify-center"
-  }, /*#__PURE__*/React__default.createElement("h4", {
-    className: "plc-text-xl plc-font-bold "
+  }, showBackButton && /*#__PURE__*/React__default.createElement("button", {
+    type: "button",
+    onClick: goBack,
+    className: "plc-absolute plc-w-6 plc-text-gray-500 focus:plc-text-black plc-z-max plc-top-1/2 plc-left-6 plc-transform plc--translate-y-1/2 plc-border-0 hover:plc-text-black hover:plc-shadow-none plc-bg-transparent hover:plc-bg-transparent focus:plc-bg-transparent"
+  }, /*#__PURE__*/React__default.createElement(SvgArrowLeft, null)), /*#__PURE__*/React__default.createElement("h4", {
+    className: "plc-text-xl plc-font-bold plc-text-center"
   }, t("labels.checkout.title")))), /*#__PURE__*/React__default.createElement(ModalBody, null, /*#__PURE__*/React__default.createElement(OrderCreateView, Object.assign({}, otherProps, {
     onSuccess: onSuccess
   }))), /*#__PURE__*/React__default.createElement(ModalFooter, null));
@@ -34211,7 +34258,8 @@ const AddressSelectModal = ({
     resetView,
     product,
     plan,
-    giftRecipient
+    giftRecipient,
+    order
   } = usePelcro();
   const {
     t
@@ -34243,11 +34291,15 @@ const AddressSelectModal = ({
     resetView();
   };
 
-  const showBackButton = Boolean(product && plan && !giftRecipient);
+  const showBackButton = Boolean(product && plan && !giftRecipient || order);
 
   const goBack = () => {
     if (product && plan) {
-      switchView("plan-select");
+      return switchView("plan-select");
+    }
+
+    if (order) {
+      return switchView("cart");
     }
   };
 
@@ -34635,7 +34687,7 @@ const PaymentMethodSelectModal = ({
     switchToCheckoutForm();
   };
 
-  const showBackButton = Boolean(product && plan && !giftRecipient);
+  const showBackButton = Boolean(product && plan && !giftRecipient || order);
 
   const userHasAddress = () => {
     var _window$Pelcro$user$r, _window$Pelcro$user$r2;
@@ -34647,13 +34699,17 @@ const PaymentMethodSelectModal = ({
   const isUserHasAddress = userHasAddress();
 
   const goBack = () => {
-    if (product && plan && product.address_required && isUserHasAddress) {
+    if ((product && plan && product.address_required || order) && isUserHasAddress) {
       return switchView("address-select");
     }
 
     if (product && plan) {
       return switchView("plan-select");
     }
+
+    if (order) {
+      return switchView("cart");
+    }
   };
 
   return /*#__PURE__*/React__default.createElement(Modal, {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pelcro/react-pelcro-js",
   "description": "Pelcro's React UI Elements",
-  "version": "4.0.0-alpha.85",
+  "version": "4.0.0-alpha.87",
   "license": "MIT",
   "private": false,
   "main": "dist/index.cjs.js",