@pelcro/react-pelcro-js 2.6.0-beta.4 → 2.6.0-beta.8

package/dist/index.cjs.js

@@ -4494,7 +4494,7 @@ var messages$2 = {
 		isSureToCancel: "Êtes-vous certain de vouloir annuler votre abonnement?",
 		loading: "Annulation de l'abonnement",
 		success: "L'abonnement a été annulé avec succès",
-		error: "Une erreure s'est produite lors de l'annulation de l'abonnement"
+		error: "Une erreur s'est produite lors de l'annulation de l'abonnement"
 	}
 };
 var dashboard_fr = {
@@ -6584,6 +6584,17 @@ const getPaymentCardIcon$1 = name => {
     d: "M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"
   }));
 };
+/**
+ * Gets the current date with time set to 0
+ * @param {Date} dateObject
+ * @return {Date}
+ */
+
+function getDateWithoutTime(dateObject) {
+  const date = new Date(dateObject.getTime());
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
 
 const resources = {
   en: {
@@ -8465,6 +8476,7 @@ const optionsController = options => {
     enableURLTriggers: initViewFromURL,
     enableTheme: applyPelcroTheme,
     enablePaywalls: initPaywalls,
+    loadSecuritySDK: initSecuritySdk,
     enableGoogleAnalytics: initGATracking
   }; // Only execute enabled options
 
@@ -8526,6 +8538,18 @@ const loadPaymentSDKs = () => {
     window.Pelcro.helpers.loadSDK("https://js.braintreegateway.com/web/3.69.0/js/paypal-checkout.min.js", "braintree-paypal-sdk");
   }
 };
+const initSecuritySdk = () => {
+  const {
+    whenSiteReady
+  } = usePelcro.getStore();
+  whenSiteReady(() => {
+    var _window$Pelcro$site$r2;
+
+    const securityKey = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.security_key;
+    if (!securityKey) return;
+    window.Pelcro.helpers.loadSDK(`https://www.google.com/recaptcha/enterprise.js?render=${securityKey}`, "pelcro-security-enteprise");
+  });
+};
 const initGATracking = () => {
   var _ReactGA$initialize, _ReactGA$plugin, _ReactGA$plugin$requi;
 
@@ -8612,9 +8636,9 @@ const applyPelcroTheme = () => {
   };
 
   whenSiteReady(() => {
-    var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
+    var _window$Pelcro$site$r3, _window$Pelcro$site$r4;
 
-    const primaryColorHex = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : (_window$Pelcro$site$r3 = _window$Pelcro$site$r2.design_settings) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.primary_color;
+    const primaryColorHex = (_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : (_window$Pelcro$site$r4 = _window$Pelcro$site$r3.design_settings) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.primary_color;
 
     if (!primaryColorHex) {
       return;
@@ -8813,6 +8837,7 @@ const defaultOptions = {
   enableURLTriggers: true,
   enableTheme: true,
   enablePaywalls: true,
+  loadSecuritySDK: true,
   enableGoogleAnalytics: false
 };
 const PelcroModalController = ({
@@ -9753,35 +9778,53 @@ const RegisterContainer = ({
       jobTitle,
       selectFields
     } = filteredData;
-    window.Pelcro.user.register({
-      email,
-      password,
-      first_name: firstName,
-      last_name: lastName,
-      metadata: {
-        organization,
-        jobTitle,
-        ...selectFields
-      }
-    }, (err, res) => {
-      dispatch({
-        type: DISABLE_REGISTRATION_BUTTON,
-        payload: false
+
+    if (!hasSecurityTokenEnabled()) {
+      sendRegisterRequest();
+      return;
+    }
+
+    window.grecaptcha.enterprise.ready(async () => {
+      var _window$Pelcro$site$r;
+
+      const token = await window.grecaptcha.enterprise.execute((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.security_key, {
+        action: "register"
       });
+      sendRegisterRequest(token);
+    });
 
-      if (err) {
+    function sendRegisterRequest(securityToken) {
+      window.Pelcro.user.register({
+        email,
+        password,
+        first_name: firstName,
+        last_name: lastName,
+        security_token: securityToken,
+        metadata: {
+          organization,
+          jobTitle,
+          ...selectFields
+        }
+      }, (err, res) => {
         dispatch({
-          type: SHOW_ALERT,
-          payload: {
-            type: "error",
-            content: getErrorMessages(err)
-          }
+          type: DISABLE_REGISTRATION_BUTTON,
+          payload: false
         });
-        onFailure(err);
-      } else {
-        onSuccess(res);
-      }
-    });
+
+        if (err) {
+          dispatch({
+            type: SHOW_ALERT,
+            payload: {
+              type: "error",
+              content: getErrorMessages(err)
+            }
+          });
+          onFailure(err);
+        } else {
+          onSuccess(res);
+        }
+      });
+    }
   };
 
   const handleSocialLogin = ({
@@ -9932,6 +9975,15 @@ const RegisterContainer = ({
     store: store$e
   })));
 };
+/**
+ * Checks if the current site has security token enabled
+ * @return {boolean}
+ */
+
+function hasSecurityTokenEnabled() {
+  const hasSecuritySdkLoaded = Boolean(window.grecaptcha);
+  return hasSecuritySdkLoaded;
+}
 
 var _path$l;
 
@@ -10321,8 +10373,11 @@ const RegisterPassword = props => /*#__PURE__*/React__default['default'].createE
 const RegisterButton = ({
   name,
   onClick,
+  className,
   ...otherProps
 }) => {
+  var _window$Pelcro$site$r;
+
   const {
     state: {
       emailError,
@@ -10348,7 +10403,10 @@ const RegisterButton = ({
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
     disabled: isDisabled,
-    isLoading: buttonDisabled
+    isLoading: buttonDisabled,
+    className: `${className} g-recaptcha`,
+    "data-action": "register",
+    "data-sitekey": (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.security_key
   }, otherProps), name !== null && name !== void 0 ? name : t("messages.createAccount"));
 };
 
@@ -13522,7 +13580,16 @@ const PaymentMethodContainerWithoutStripe = ({
 const UnwrappedForm = es_12(PaymentMethodContainerWithoutStripe);
 
 const PaymentMethodContainer = props => {
-  if (window.Stripe) {
+  const [isStripeLoaded, setIsStripeLoaded] = React.useState(Boolean(window.Stripe));
+  React.useEffect(() => {
+    if (!window.Stripe) {
+      document.querySelector('script[src="https://js.stripe.com/v3"]').addEventListener("load", () => {
+        setIsStripeLoaded(true);
+      });
+    }
+  }, []);
+
+  if (isStripeLoaded) {
     return /*#__PURE__*/React__default['default'].createElement(es_13, {
       apiKey: window.Pelcro.environment.stripe,
       stripeAccount: window.Pelcro.site.read().account_id,
@@ -18402,9 +18469,9 @@ const GiftCreateContainer = ({
     }
 
     if (giftRecipient.startDate) {
-      const nowDate = new Date();
-      const yearFromNowDate = new Date(new Date().setFullYear(nowDate.getFullYear() + 1));
-      const submittedDate = new Date(giftRecipient.startDate);
+      const nowDate = getDateWithoutTime(new Date());
+      const yearFromNowDate = getDateWithoutTime(new Date(new Date().setFullYear(nowDate.getFullYear() + 1)));
+      const submittedDate = getDateWithoutTime(new Date(giftRecipient.startDate));
 
       if (submittedDate < nowDate || submittedDate > yearFromNowDate) {
         dispatch({

package/dist/index.esm.js

@@ -4464,7 +4464,7 @@ var messages$2 = {
 		isSureToCancel: "Êtes-vous certain de vouloir annuler votre abonnement?",
 		loading: "Annulation de l'abonnement",
 		success: "L'abonnement a été annulé avec succès",
-		error: "Une erreure s'est produite lors de l'annulation de l'abonnement"
+		error: "Une erreur s'est produite lors de l'annulation de l'abonnement"
 	}
 };
 var dashboard_fr = {
@@ -6554,6 +6554,17 @@ const getPaymentCardIcon$1 = name => {
     d: "M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"
   }));
 };
+/**
+ * Gets the current date with time set to 0
+ * @param {Date} dateObject
+ * @return {Date}
+ */
+
+function getDateWithoutTime(dateObject) {
+  const date = new Date(dateObject.getTime());
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
 
 const resources = {
   en: {
@@ -8435,6 +8446,7 @@ const optionsController = options => {
     enableURLTriggers: initViewFromURL,
     enableTheme: applyPelcroTheme,
     enablePaywalls: initPaywalls,
+    loadSecuritySDK: initSecuritySdk,
     enableGoogleAnalytics: initGATracking
   }; // Only execute enabled options
 
@@ -8496,6 +8508,18 @@ const loadPaymentSDKs = () => {
     window.Pelcro.helpers.loadSDK("https://js.braintreegateway.com/web/3.69.0/js/paypal-checkout.min.js", "braintree-paypal-sdk");
   }
 };
+const initSecuritySdk = () => {
+  const {
+    whenSiteReady
+  } = usePelcro.getStore();
+  whenSiteReady(() => {
+    var _window$Pelcro$site$r2;
+
+    const securityKey = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.security_key;
+    if (!securityKey) return;
+    window.Pelcro.helpers.loadSDK(`https://www.google.com/recaptcha/enterprise.js?render=${securityKey}`, "pelcro-security-enteprise");
+  });
+};
 const initGATracking = () => {
   var _ReactGA$initialize, _ReactGA$plugin, _ReactGA$plugin$requi;
 
@@ -8582,9 +8606,9 @@ const applyPelcroTheme = () => {
   };
 
   whenSiteReady(() => {
-    var _window$Pelcro$site$r2, _window$Pelcro$site$r3;
+    var _window$Pelcro$site$r3, _window$Pelcro$site$r4;
 
-    const primaryColorHex = (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : (_window$Pelcro$site$r3 = _window$Pelcro$site$r2.design_settings) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.primary_color;
+    const primaryColorHex = (_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : (_window$Pelcro$site$r4 = _window$Pelcro$site$r3.design_settings) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.primary_color;
 
     if (!primaryColorHex) {
       return;
@@ -8783,6 +8807,7 @@ const defaultOptions = {
   enableURLTriggers: true,
   enableTheme: true,
   enablePaywalls: true,
+  loadSecuritySDK: true,
   enableGoogleAnalytics: false
 };
 const PelcroModalController = ({
@@ -9723,35 +9748,53 @@ const RegisterContainer = ({
       jobTitle,
       selectFields
     } = filteredData;
-    window.Pelcro.user.register({
-      email,
-      password,
-      first_name: firstName,
-      last_name: lastName,
-      metadata: {
-        organization,
-        jobTitle,
-        ...selectFields
-      }
-    }, (err, res) => {
-      dispatch({
-        type: DISABLE_REGISTRATION_BUTTON,
-        payload: false
+
+    if (!hasSecurityTokenEnabled()) {
+      sendRegisterRequest();
+      return;
+    }
+
+    window.grecaptcha.enterprise.ready(async () => {
+      var _window$Pelcro$site$r;
+
+      const token = await window.grecaptcha.enterprise.execute((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.security_key, {
+        action: "register"
       });
+      sendRegisterRequest(token);
+    });
 
-      if (err) {
+    function sendRegisterRequest(securityToken) {
+      window.Pelcro.user.register({
+        email,
+        password,
+        first_name: firstName,
+        last_name: lastName,
+        security_token: securityToken,
+        metadata: {
+          organization,
+          jobTitle,
+          ...selectFields
+        }
+      }, (err, res) => {
         dispatch({
-          type: SHOW_ALERT,
-          payload: {
-            type: "error",
-            content: getErrorMessages(err)
-          }
+          type: DISABLE_REGISTRATION_BUTTON,
+          payload: false
         });
-        onFailure(err);
-      } else {
-        onSuccess(res);
-      }
-    });
+
+        if (err) {
+          dispatch({
+            type: SHOW_ALERT,
+            payload: {
+              type: "error",
+              content: getErrorMessages(err)
+            }
+          });
+          onFailure(err);
+        } else {
+          onSuccess(res);
+        }
+      });
+    }
   };
 
   const handleSocialLogin = ({
@@ -9902,6 +9945,15 @@ const RegisterContainer = ({
     store: store$e
   })));
 };
+/**
+ * Checks if the current site has security token enabled
+ * @return {boolean}
+ */
+
+function hasSecurityTokenEnabled() {
+  const hasSecuritySdkLoaded = Boolean(window.grecaptcha);
+  return hasSecuritySdkLoaded;
+}
 
 var _path$l;
 
@@ -10291,8 +10343,11 @@ const RegisterPassword = props => /*#__PURE__*/React__default.createElement(Pass
 const RegisterButton = ({
   name,
   onClick,
+  className,
   ...otherProps
 }) => {
+  var _window$Pelcro$site$r;
+
   const {
     state: {
       emailError,
@@ -10318,7 +10373,10 @@ const RegisterButton = ({
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
     disabled: isDisabled,
-    isLoading: buttonDisabled
+    isLoading: buttonDisabled,
+    className: `${className} g-recaptcha`,
+    "data-action": "register",
+    "data-sitekey": (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.security_key
   }, otherProps), name !== null && name !== void 0 ? name : t("messages.createAccount"));
 };
 
@@ -13492,7 +13550,16 @@ const PaymentMethodContainerWithoutStripe = ({
 const UnwrappedForm = es_12(PaymentMethodContainerWithoutStripe);
 
 const PaymentMethodContainer = props => {
-  if (window.Stripe) {
+  const [isStripeLoaded, setIsStripeLoaded] = useState(Boolean(window.Stripe));
+  useEffect(() => {
+    if (!window.Stripe) {
+      document.querySelector('script[src="https://js.stripe.com/v3"]').addEventListener("load", () => {
+        setIsStripeLoaded(true);
+      });
+    }
+  }, []);
+
+  if (isStripeLoaded) {
     return /*#__PURE__*/React__default.createElement(es_13, {
       apiKey: window.Pelcro.environment.stripe,
       stripeAccount: window.Pelcro.site.read().account_id,
@@ -18372,9 +18439,9 @@ const GiftCreateContainer = ({
     }
 
     if (giftRecipient.startDate) {
-      const nowDate = new Date();
-      const yearFromNowDate = new Date(new Date().setFullYear(nowDate.getFullYear() + 1));
-      const submittedDate = new Date(giftRecipient.startDate);
+      const nowDate = getDateWithoutTime(new Date());
+      const yearFromNowDate = getDateWithoutTime(new Date(new Date().setFullYear(nowDate.getFullYear() + 1)));
+      const submittedDate = getDateWithoutTime(new Date(giftRecipient.startDate));
 
       if (submittedDate < nowDate || submittedDate > yearFromNowDate) {
         dispatch({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pelcro/react-pelcro-js",
   "description": "Pelcro's React UI Elements",
-  "version": "2.6.0-beta.4",
+  "version": "2.6.0-beta.8",
   "license": "MIT",
   "private": false,
   "main": "dist/index.cjs.js",
@@ -59,7 +59,6 @@
     "browserslist": "^4.16.3",
     "cross-env": "^7.0.3",
     "css-loader": "^3.2.0",
-    "cssimportant-loader": "^0.4.0",
     "cz-conventional-changelog": "3.3.0",
     "eslint": "^7.19.0",
     "eslint-config-google": "^0.14.0",
@@ -74,7 +73,6 @@
     "html-webpack-plugin": "^3.2.0",
     "image-webpack-loader": "^7.0.1",
     "jest": "^26.6.3",
-    "node-sass": "^4.14.1",
     "postcss": "^8.2.4",
     "postcss-import": "^14.0.0",
     "postcss-loader": "4.2.0",
@@ -92,7 +90,6 @@
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.0",
     "rollup-plugin-visualizer": "^4.2.0",
-    "sass-loader": "^7.1.0",
     "semantic-release": "^17.4.4",
     "simple-zustand-devtools": "^1.0.0",
     "style-loader": "^2.0.0",