@pelcro/react-pelcro-js 2.6.0-beta.3 → 2.6.0-beta.7

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 = {
@@ -6327,13 +6327,34 @@ const getAddressById = id => {
 };
 /**
  * Transforms locale names stored in our backend like
- * "en_US" into the standerd accepted in core i18n methods: "en-US"
+ * "en_US" into the standard accepted in core i18n methods: "en-US"
  * @param {string} localeName
  * @return {string | undefined}
  * @example getCanonicalLocaleFormat("en_US") => "en-US"
  */
 
 const getCanonicalLocaleFormat = localeName => localeName === null || localeName === void 0 ? void 0 : localeName.replace("_", "-");
+/**
+ * @param {string} localeName
+ * @return {string | undefined}
+ * @example getLanguageWithoutRegion("en-US") => "en"
+ */
+
+const getLanguageWithoutRegion = localeName => {
+  var _getCanonicalLocaleFo;
+
+  return (_getCanonicalLocaleFo = getCanonicalLocaleFormat(localeName)) === null || _getCanonicalLocaleFo === void 0 ? void 0 : _getCanonicalLocaleFo.split("-")[0];
+};
+/**
+ * Gets the current page language or fallbacks to site default
+ * @return {string | undefined}
+ */
+
+const getPageOrDefaultLanguage = () => {
+  var _window$Pelcro$helper, _window$Pelcro, _window$Pelcro$site, _window$Pelcro$site$r, _window$Pelcro$site$r2;
+
+  return (_window$Pelcro$helper = window.Pelcro.helpers.getHtmlLanguageAttribute()) !== null && _window$Pelcro$helper !== void 0 ? _window$Pelcro$helper : getLanguageWithoutRegion((_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$site = _window$Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r = _window$Pelcro$site.read) === null || _window$Pelcro$site$r === void 0 ? void 0 : (_window$Pelcro$site$r2 = _window$Pelcro$site$r.call(_window$Pelcro$site)) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.default_locale);
+};
 /**
  * Returns a formatted price string depending on locale
  * @param {number} amount
@@ -6343,7 +6364,7 @@ const getCanonicalLocaleFormat = localeName => localeName === null || localeName
  * @example getFormattedPriceByLocal(10, 'USD', 'en-US') => "$10.00"
  */
 
-const getFormattedPriceByLocal = (amount, currency = "USD", locale = "en-US") => {
+const getFormattedPriceByLocal = (amount, currency = "USD", locale = "en") => {
   const formatter = new Intl.NumberFormat(getCanonicalLocaleFormat(locale), {
     style: "currency",
     currency
@@ -6368,8 +6389,7 @@ const calcAndFormatItemsTotal = (items, currency) => {
     totalWithoutDividingBy100 += parseFloat(item.price ? (item.price * item.quantity).toFixed(2) : item.amount.toFixed(2));
   }
 
-  const locale = window.Pelcro.site.read().default_locale;
-  return getFormattedPriceByLocal(totalWithoutDividingBy100, currency, locale);
+  return getFormattedPriceByLocal(totalWithoutDividingBy100, currency, getPageOrDefaultLanguage());
 };
 /**
  * returns true if the URL contains a supported view trigger URL
@@ -6383,12 +6403,15 @@ const isValidViewFromURL = viewID => {
   }
 
   return false;
+  /**
+   *
+   */
 
   function hasValidNewsletterUpdateUrl() {
-    var _window$Pelcro, _window$Pelcro$uiSett;
+    var _window$Pelcro2, _window$Pelcro2$uiSet;
 
     if (viewID !== "newsletter-update") return false;
-    const newsletters = (_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.newsletters;
+    const newsletters = (_window$Pelcro2 = window.Pelcro) === null || _window$Pelcro2 === void 0 ? void 0 : (_window$Pelcro2$uiSet = _window$Pelcro2.uiSettings) === null || _window$Pelcro2$uiSet === void 0 ? void 0 : _window$Pelcro2$uiSet.newsletters;
     const siteHasNewslettersDefined = Array.isArray(newsletters) && newsletters.length > 0;
 
     if (!siteHasNewslettersDefined) {
@@ -6561,10 +6584,20 @@ 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;
+}
 
-var _window$Pelcro, _window$Pelcro$site, _window$Pelcro$site$r, _window$Pelcro$site$r2;
 const resources = {
-  "en-US": {
+  en: {
     common: common_en,
     paymentMethod: paymentMethod_en,
     newsletter: newsletter_en,
@@ -6586,7 +6619,7 @@ const resources = {
     select: select_en,
     notification: notification_en
   },
-  "fr-CA": {
+  fr: {
     common: common_fr,
     paymentMethod: paymentMethod_fr,
     newsletter: newsletter_fr,
@@ -6608,13 +6641,14 @@ const resources = {
     select: select_fr,
     notification: notification_fr
   }
-};
-let locale = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$site = _window$Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r = _window$Pelcro$site.read) === null || _window$Pelcro$site$r === void 0 ? void 0 : (_window$Pelcro$site$r2 = _window$Pelcro$site$r.call(_window$Pelcro$site)) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.default_locale;
-if (!locale) locale = "en-US";
+}; // set UI language to the page language or default to the language in site settings
+
+const locale = getPageOrDefaultLanguage();
 i18next.use(initReactI18next) // passes i18n down to react-i18next,
 .init({
   resources,
-  lng: getCanonicalLocaleFormat(locale),
+  lng: locale,
+  fallbackLng: "en",
   // debug: true,
   interpolation: {
     escapeValue: false // react already safes from xss
@@ -6625,6 +6659,16 @@ i18next.use(initReactI18next) // passes i18n down to react-i18next,
 
   }
 });
+const pageLanguageObserver = new MutationObserver(mutationsList => {
+  mutationsList.forEach(mutationRecord => {
+    if (mutationRecord.attributeName === "lang") {
+      i18next.changeLanguage(window.Pelcro.helpers.getHtmlLanguageAttribute());
+    }
+  });
+});
+pageLanguageObserver.observe(document.documentElement, {
+  attributes: true
+});
 
 function _classPrivateFieldGet(receiver, privateMap) {
   var descriptor = privateMap.get(receiver);
@@ -8432,6 +8476,7 @@ const optionsController = options => {
     enableURLTriggers: initViewFromURL,
     enableTheme: applyPelcroTheme,
     enablePaywalls: initPaywalls,
+    loadSecuritySDK: initSecuritySdk,
     enableGoogleAnalytics: initGATracking
   }; // Only execute enabled options
 
@@ -8493,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;
 
@@ -8579,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;
@@ -8780,6 +8837,7 @@ const defaultOptions = {
   enableURLTriggers: true,
   enableTheme: true,
   enablePaywalls: true,
+  loadSecuritySDK: true,
   enableGoogleAnalytics: false
 };
 const PelcroModalController = ({
@@ -9720,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 = ({
@@ -9899,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;
 
@@ -9920,7 +10005,7 @@ const FacebookLoginButton = ({
   labelClassName = "",
   iconClassName = ""
 }) => {
-  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
+  var _window$Pelcro$site$r;
 
   const facebookLoginEnabled = (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.facebook_app_id;
   const {
@@ -9959,7 +10044,7 @@ const FacebookLoginButton = ({
 
   return facebookLoginEnabled ? /*#__PURE__*/React__default['default'].createElement(FacebookLogin, {
     appId: window.Pelcro.site.read().facebook_app_id,
-    language: (_window$Pelcro$site$r2 = window.Pelcro.site.read().default_locale) !== null && _window$Pelcro$site$r2 !== void 0 ? _window$Pelcro$site$r2 : "en_US",
+    language: getPageOrDefaultLanguage(),
     fields: "first_name,last_name,email,picture",
     callback: onSuccess,
     onFailure: onFailure,
@@ -10288,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,
@@ -10315,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"));
 };
 
@@ -13493,7 +13584,7 @@ const PaymentMethodContainer = props => {
     return /*#__PURE__*/React__default['default'].createElement(es_13, {
       apiKey: window.Pelcro.environment.stripe,
       stripeAccount: window.Pelcro.site.read().account_id,
-      locale: getCanonicalLocaleFormat(window.Pelcro.site.read().default_locale)
+      locale: getPageOrDefaultLanguage()
     }, /*#__PURE__*/React__default['default'].createElement(es_11, null, /*#__PURE__*/React__default['default'].createElement(UnwrappedForm, Object.assign({
       store: store$d
     }, props))));
@@ -13605,9 +13696,6 @@ const DiscountedPrice = props => {
       percentOff
     }
   } = React.useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const {
     order,
     plan
@@ -13615,7 +13703,7 @@ const DiscountedPrice = props => {
   const ecommOrderCurrency = (_order$currency = order === null || order === void 0 ? void 0 : order.currency) !== null && _order$currency !== void 0 ? _order$currency : order === null || order === void 0 ? void 0 : (_order$ = order[0]) === null || _order$ === void 0 ? void 0 : _order$.currency;
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
   const discountedPriceWithoutTax = updatedPrice - taxAmount;
-  const priceFormatted = getFormattedPriceByLocal(order ? updatedPrice : discountedPriceWithoutTax * planQuantity, ecommOrderCurrency !== null && ecommOrderCurrency !== void 0 ? ecommOrderCurrency : plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(order ? updatedPrice : discountedPriceWithoutTax * planQuantity, ecommOrderCurrency !== null && ecommOrderCurrency !== void 0 ? ecommOrderCurrency : plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
 
   if (percentOff) {
     return /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
@@ -13648,12 +13736,9 @@ const SubmitPaymentMethod = ({
       updatedPrice
     }
   } = React.useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
   const price = updatedPrice !== null && updatedPrice !== void 0 ? updatedPrice : plan === null || plan === void 0 ? void 0 : plan.amount;
-  const priceFormatted = getFormattedPriceByLocal(price * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(price * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
   return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
     role: "submit",
     className: "plc-w-full plc-py-3",
@@ -13898,7 +13983,7 @@ class PaypalClient {
       this.paypalButton = window.paypal.Buttons({
         fundingSource: window.paypal.FUNDING.PAYPAL,
         // button locale
-        locale: (_this$config$locale = this.config.locale) !== null && _this$config$locale !== void 0 ? _this$config$locale : this.siteInfo.default_locale,
+        locale: (_this$config$locale = this.config.locale) !== null && _this$config$locale !== void 0 ? _this$config$locale : getPageOrDefaultLanguage(),
         // button style
         style: (_this$config$style = this.config.style) !== null && _this$config$style !== void 0 ? _this$config$style : defaultButtonStyle,
         // create payment handler
@@ -13995,7 +14080,7 @@ class PaypalClient {
           } : undefined,
           shippingAddressEditable: this.config.shippingAddressEditable,
           displayName: (_this$config$displayN = this.config.displayName) !== null && _this$config$displayN !== void 0 ? _this$config$displayN : this.siteInfo.name,
-          locale: (_this$config$locale2 = this.config.locale) !== null && _this$config$locale2 !== void 0 ? _this$config$locale2 : this.siteInfo.default_locale
+          locale: (_this$config$locale2 = this.config.locale) !== null && _this$config$locale2 !== void 0 ? _this$config$locale2 : getPageOrDefaultLanguage()
         };
       }
     });
@@ -14004,7 +14089,7 @@ class PaypalClient {
       writable: true,
       value: () => {
         const totalAmount = (this.product.quantity || 1) * this.amount;
-        const priceFormatted = getFormattedPriceByLocal(totalAmount, this.product.currency, this.siteInfo.default_locale);
+        const priceFormatted = getFormattedPriceByLocal(totalAmount, this.product.currency, getPageOrDefaultLanguage());
         const autoRenewed = this.product.auto_renew;
         const {
           interval,
@@ -14201,14 +14286,11 @@ const TaxAmount = () => {
       taxAmount
     }
   } = React.useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const {
     plan
   } = usePelcro();
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
-  const priceFormatted = getFormattedPriceByLocal(taxAmount * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(taxAmount * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
 
   if (taxAmount) {
     return /*#__PURE__*/React__default['default'].createElement("div", {
@@ -15081,10 +15163,7 @@ const SubscriptionCreateView = ({
       interval,
       count: interval_count
     });
-    const {
-      default_locale
-    } = Pelcro.site.read();
-    const priceFormatted = getFormattedPriceByLocal((plan === null || plan === void 0 ? void 0 : plan.amount) * ((_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1), plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+    const priceFormatted = getFormattedPriceByLocal((plan === null || plan === void 0 ? void 0 : plan.amount) * ((_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1), plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
     return /*#__PURE__*/React__default['default'].createElement("p", {
       className: "plc-text-gray-600"
     }, /*#__PURE__*/React__default['default'].createElement("span", {
@@ -18261,7 +18340,6 @@ const OrderConfirmModal = props => {
   const userOrders = window.Pelcro.user.read().orders;
   const latestOrder = userOrders === null || userOrders === void 0 ? void 0 : userOrders[userOrders.length - 1];
   const latestOrderDiscount = latestOrder === null || latestOrder === void 0 ? void 0 : (_latestOrder$coupon = latestOrder.coupon) === null || _latestOrder$coupon === void 0 ? void 0 : _latestOrder$coupon.percent_off;
-  const locale = window.Pelcro.site.read().default_locale;
   const {
     t
   } = useTranslation("shop");
@@ -18320,7 +18398,7 @@ const OrderConfirmModal = props => {
     className: "plc-mr-1 pelcro-summary-total-text"
   }, t("labels.total")), /*#__PURE__*/React__default['default'].createElement("p", {
     className: "pelcro-summary-total"
-  }, latestOrderDiscount && `(-${latestOrderDiscount}%) `, getFormattedPriceByLocal(latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.amount, latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.currency, locale)))), /*#__PURE__*/React__default['default'].createElement("div", {
+  }, latestOrderDiscount && `(-${latestOrderDiscount}%) `, getFormattedPriceByLocal(latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.amount, latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.currency, getPageOrDefaultLanguage())))), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-justify-center plc-mt-6"
   }, /*#__PURE__*/React__default['default'].createElement(Button, {
     id: "pelcro-submit",
@@ -18382,9 +18460,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({
@@ -20689,7 +20767,6 @@ const OrderItems = ({
   const {
     t
   } = useTranslation("dashboard");
-  const site = window.Pelcro.site.read();
   return !(orders !== null && orders !== void 0 && orders.length) ? /*#__PURE__*/React__default['default'].createElement("tbody", null, /*#__PURE__*/React__default['default'].createElement("tr", null, /*#__PURE__*/React__default['default'].createElement("td", {
     colSpan: "3",
     className: "plc-text-center plc-text-gray-500"
@@ -20705,7 +20782,7 @@ const OrderItems = ({
       className: "plc-py-4 plc-pl-2"
     }, /*#__PURE__*/React__default['default'].createElement("span", {
       className: "plc-text-xl plc-font-semibold "
-    }, getFormattedPriceByLocal(order.amount, order.currency, site.default_locale)), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("span", {
+    }, getFormattedPriceByLocal(order.amount, order.currency, getPageOrDefaultLanguage())), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("span", {
       className: "plc-text-xs plc-text-gray-400 plc-uppercase"
     }, t("labels.orders.itemsAmount", {
       count: getItemsAmount(order.id)
@@ -20734,7 +20811,7 @@ const OrderItems = ({
         className: ""
       }, item.product_sku_name))), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
         className: "plc-font-semibold"
-      }, getFormattedPriceByLocal(item.amount, order.currency, site.default_locale))));
+      }, getFormattedPriceByLocal(item.amount, order.currency, getPageOrDefaultLanguage()))));
     }), /*#__PURE__*/React__default['default'].createElement("tr", null, /*#__PURE__*/React__default['default'].createElement("td", {
       colSpan: "3"
     }, /*#__PURE__*/React__default['default'].createElement("hr", {
@@ -21461,7 +21538,7 @@ class Dashboard extends React.Component {
           className: "plc-font-semibold plc-text-gray-500"
         }, sub.plan.nickname), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("span", {
           className: "plc-text-xs plc-text-gray-400"
-        }, getFormattedPriceByLocal(sub.plan.amount, sub.plan.currency, this.site.default_locale)))), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, getFormattedPriceByLocal(sub.plan.amount, sub.plan.currency, getPageOrDefaultLanguage())))), /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
           className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${this.getSubscriptionStatus(sub).bgColor} plc-uppercase ${this.getSubscriptionStatus(sub).textColor} plc-rounded-lg`
         }, this.getSubscriptionStatus(sub).icon, this.getSubscriptionStatus(sub).title), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("div", {
           className: "plc-mb-4 plc-text-xs plc-text-gray-500"
@@ -21564,7 +21641,7 @@ class Dashboard extends React.Component {
           className: "plc-font-semibold plc-text-gray-500"
         }, recipient.plan.nickname), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("span", {
           className: "plc-text-xs plc-text-gray-400"
-        }, getFormattedPriceByLocal(recipient.plan.amount, recipient.plan.currency, this.site.default_locale)))), recipient.status && /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, getFormattedPriceByLocal(recipient.plan.amount, recipient.plan.currency, getPageOrDefaultLanguage())))), recipient.status && /*#__PURE__*/React__default['default'].createElement("td", null, /*#__PURE__*/React__default['default'].createElement("span", {
           className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${this.getSubscriptionStatus(recipient).bgColor} plc-uppercase ${this.getSubscriptionStatus(recipient).textColor} plc-rounded-lg`
         }, this.getSubscriptionStatus(recipient).icon, this.getSubscriptionStatus(recipient).title), /*#__PURE__*/React__default['default'].createElement("br", null), /*#__PURE__*/React__default['default'].createElement("div", {
           className: "plc-mb-4 plc-text-xs plc-text-gray-500"

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 = {
@@ -6297,13 +6297,34 @@ const getAddressById = id => {
 };
 /**
  * Transforms locale names stored in our backend like
- * "en_US" into the standerd accepted in core i18n methods: "en-US"
+ * "en_US" into the standard accepted in core i18n methods: "en-US"
  * @param {string} localeName
  * @return {string | undefined}
  * @example getCanonicalLocaleFormat("en_US") => "en-US"
  */
 
 const getCanonicalLocaleFormat = localeName => localeName === null || localeName === void 0 ? void 0 : localeName.replace("_", "-");
+/**
+ * @param {string} localeName
+ * @return {string | undefined}
+ * @example getLanguageWithoutRegion("en-US") => "en"
+ */
+
+const getLanguageWithoutRegion = localeName => {
+  var _getCanonicalLocaleFo;
+
+  return (_getCanonicalLocaleFo = getCanonicalLocaleFormat(localeName)) === null || _getCanonicalLocaleFo === void 0 ? void 0 : _getCanonicalLocaleFo.split("-")[0];
+};
+/**
+ * Gets the current page language or fallbacks to site default
+ * @return {string | undefined}
+ */
+
+const getPageOrDefaultLanguage = () => {
+  var _window$Pelcro$helper, _window$Pelcro, _window$Pelcro$site, _window$Pelcro$site$r, _window$Pelcro$site$r2;
+
+  return (_window$Pelcro$helper = window.Pelcro.helpers.getHtmlLanguageAttribute()) !== null && _window$Pelcro$helper !== void 0 ? _window$Pelcro$helper : getLanguageWithoutRegion((_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$site = _window$Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r = _window$Pelcro$site.read) === null || _window$Pelcro$site$r === void 0 ? void 0 : (_window$Pelcro$site$r2 = _window$Pelcro$site$r.call(_window$Pelcro$site)) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.default_locale);
+};
 /**
  * Returns a formatted price string depending on locale
  * @param {number} amount
@@ -6313,7 +6334,7 @@ const getCanonicalLocaleFormat = localeName => localeName === null || localeName
  * @example getFormattedPriceByLocal(10, 'USD', 'en-US') => "$10.00"
  */
 
-const getFormattedPriceByLocal = (amount, currency = "USD", locale = "en-US") => {
+const getFormattedPriceByLocal = (amount, currency = "USD", locale = "en") => {
   const formatter = new Intl.NumberFormat(getCanonicalLocaleFormat(locale), {
     style: "currency",
     currency
@@ -6338,8 +6359,7 @@ const calcAndFormatItemsTotal = (items, currency) => {
     totalWithoutDividingBy100 += parseFloat(item.price ? (item.price * item.quantity).toFixed(2) : item.amount.toFixed(2));
   }
 
-  const locale = window.Pelcro.site.read().default_locale;
-  return getFormattedPriceByLocal(totalWithoutDividingBy100, currency, locale);
+  return getFormattedPriceByLocal(totalWithoutDividingBy100, currency, getPageOrDefaultLanguage());
 };
 /**
  * returns true if the URL contains a supported view trigger URL
@@ -6353,12 +6373,15 @@ const isValidViewFromURL = viewID => {
   }
 
   return false;
+  /**
+   *
+   */
 
   function hasValidNewsletterUpdateUrl() {
-    var _window$Pelcro, _window$Pelcro$uiSett;
+    var _window$Pelcro2, _window$Pelcro2$uiSet;
 
     if (viewID !== "newsletter-update") return false;
-    const newsletters = (_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.newsletters;
+    const newsletters = (_window$Pelcro2 = window.Pelcro) === null || _window$Pelcro2 === void 0 ? void 0 : (_window$Pelcro2$uiSet = _window$Pelcro2.uiSettings) === null || _window$Pelcro2$uiSet === void 0 ? void 0 : _window$Pelcro2$uiSet.newsletters;
     const siteHasNewslettersDefined = Array.isArray(newsletters) && newsletters.length > 0;
 
     if (!siteHasNewslettersDefined) {
@@ -6531,10 +6554,20 @@ 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;
+}
 
-var _window$Pelcro, _window$Pelcro$site, _window$Pelcro$site$r, _window$Pelcro$site$r2;
 const resources = {
-  "en-US": {
+  en: {
     common: common_en,
     paymentMethod: paymentMethod_en,
     newsletter: newsletter_en,
@@ -6556,7 +6589,7 @@ const resources = {
     select: select_en,
     notification: notification_en
   },
-  "fr-CA": {
+  fr: {
     common: common_fr,
     paymentMethod: paymentMethod_fr,
     newsletter: newsletter_fr,
@@ -6578,13 +6611,14 @@ const resources = {
     select: select_fr,
     notification: notification_fr
   }
-};
-let locale = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$site = _window$Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r = _window$Pelcro$site.read) === null || _window$Pelcro$site$r === void 0 ? void 0 : (_window$Pelcro$site$r2 = _window$Pelcro$site$r.call(_window$Pelcro$site)) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.default_locale;
-if (!locale) locale = "en-US";
+}; // set UI language to the page language or default to the language in site settings
+
+const locale = getPageOrDefaultLanguage();
 i18next.use(initReactI18next) // passes i18n down to react-i18next,
 .init({
   resources,
-  lng: getCanonicalLocaleFormat(locale),
+  lng: locale,
+  fallbackLng: "en",
   // debug: true,
   interpolation: {
     escapeValue: false // react already safes from xss
@@ -6595,6 +6629,16 @@ i18next.use(initReactI18next) // passes i18n down to react-i18next,
 
   }
 });
+const pageLanguageObserver = new MutationObserver(mutationsList => {
+  mutationsList.forEach(mutationRecord => {
+    if (mutationRecord.attributeName === "lang") {
+      i18next.changeLanguage(window.Pelcro.helpers.getHtmlLanguageAttribute());
+    }
+  });
+});
+pageLanguageObserver.observe(document.documentElement, {
+  attributes: true
+});
 
 function _classPrivateFieldGet(receiver, privateMap) {
   var descriptor = privateMap.get(receiver);
@@ -8402,6 +8446,7 @@ const optionsController = options => {
     enableURLTriggers: initViewFromURL,
     enableTheme: applyPelcroTheme,
     enablePaywalls: initPaywalls,
+    loadSecuritySDK: initSecuritySdk,
     enableGoogleAnalytics: initGATracking
   }; // Only execute enabled options
 
@@ -8463,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;
 
@@ -8549,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;
@@ -8750,6 +8807,7 @@ const defaultOptions = {
   enableURLTriggers: true,
   enableTheme: true,
   enablePaywalls: true,
+  loadSecuritySDK: true,
   enableGoogleAnalytics: false
 };
 const PelcroModalController = ({
@@ -9690,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 = ({
@@ -9869,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;
 
@@ -9890,7 +9975,7 @@ const FacebookLoginButton = ({
   labelClassName = "",
   iconClassName = ""
 }) => {
-  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
+  var _window$Pelcro$site$r;
 
   const facebookLoginEnabled = (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.facebook_app_id;
   const {
@@ -9929,7 +10014,7 @@ const FacebookLoginButton = ({
 
   return facebookLoginEnabled ? /*#__PURE__*/React__default.createElement(FacebookLogin, {
     appId: window.Pelcro.site.read().facebook_app_id,
-    language: (_window$Pelcro$site$r2 = window.Pelcro.site.read().default_locale) !== null && _window$Pelcro$site$r2 !== void 0 ? _window$Pelcro$site$r2 : "en_US",
+    language: getPageOrDefaultLanguage(),
     fields: "first_name,last_name,email,picture",
     callback: onSuccess,
     onFailure: onFailure,
@@ -10258,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,
@@ -10285,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"));
 };
 
@@ -13463,7 +13554,7 @@ const PaymentMethodContainer = props => {
     return /*#__PURE__*/React__default.createElement(es_13, {
       apiKey: window.Pelcro.environment.stripe,
       stripeAccount: window.Pelcro.site.read().account_id,
-      locale: getCanonicalLocaleFormat(window.Pelcro.site.read().default_locale)
+      locale: getPageOrDefaultLanguage()
     }, /*#__PURE__*/React__default.createElement(es_11, null, /*#__PURE__*/React__default.createElement(UnwrappedForm, Object.assign({
       store: store$d
     }, props))));
@@ -13575,9 +13666,6 @@ const DiscountedPrice = props => {
       percentOff
     }
   } = useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const {
     order,
     plan
@@ -13585,7 +13673,7 @@ const DiscountedPrice = props => {
   const ecommOrderCurrency = (_order$currency = order === null || order === void 0 ? void 0 : order.currency) !== null && _order$currency !== void 0 ? _order$currency : order === null || order === void 0 ? void 0 : (_order$ = order[0]) === null || _order$ === void 0 ? void 0 : _order$.currency;
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
   const discountedPriceWithoutTax = updatedPrice - taxAmount;
-  const priceFormatted = getFormattedPriceByLocal(order ? updatedPrice : discountedPriceWithoutTax * planQuantity, ecommOrderCurrency !== null && ecommOrderCurrency !== void 0 ? ecommOrderCurrency : plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(order ? updatedPrice : discountedPriceWithoutTax * planQuantity, ecommOrderCurrency !== null && ecommOrderCurrency !== void 0 ? ecommOrderCurrency : plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
 
   if (percentOff) {
     return /*#__PURE__*/React__default.createElement("div", Object.assign({
@@ -13618,12 +13706,9 @@ const SubmitPaymentMethod = ({
       updatedPrice
     }
   } = useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
   const price = updatedPrice !== null && updatedPrice !== void 0 ? updatedPrice : plan === null || plan === void 0 ? void 0 : plan.amount;
-  const priceFormatted = getFormattedPriceByLocal(price * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(price * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
   return /*#__PURE__*/React__default.createElement(Button, Object.assign({
     role: "submit",
     className: "plc-w-full plc-py-3",
@@ -13868,7 +13953,7 @@ class PaypalClient {
       this.paypalButton = window.paypal.Buttons({
         fundingSource: window.paypal.FUNDING.PAYPAL,
         // button locale
-        locale: (_this$config$locale = this.config.locale) !== null && _this$config$locale !== void 0 ? _this$config$locale : this.siteInfo.default_locale,
+        locale: (_this$config$locale = this.config.locale) !== null && _this$config$locale !== void 0 ? _this$config$locale : getPageOrDefaultLanguage(),
         // button style
         style: (_this$config$style = this.config.style) !== null && _this$config$style !== void 0 ? _this$config$style : defaultButtonStyle,
         // create payment handler
@@ -13965,7 +14050,7 @@ class PaypalClient {
           } : undefined,
           shippingAddressEditable: this.config.shippingAddressEditable,
           displayName: (_this$config$displayN = this.config.displayName) !== null && _this$config$displayN !== void 0 ? _this$config$displayN : this.siteInfo.name,
-          locale: (_this$config$locale2 = this.config.locale) !== null && _this$config$locale2 !== void 0 ? _this$config$locale2 : this.siteInfo.default_locale
+          locale: (_this$config$locale2 = this.config.locale) !== null && _this$config$locale2 !== void 0 ? _this$config$locale2 : getPageOrDefaultLanguage()
         };
       }
     });
@@ -13974,7 +14059,7 @@ class PaypalClient {
       writable: true,
       value: () => {
         const totalAmount = (this.product.quantity || 1) * this.amount;
-        const priceFormatted = getFormattedPriceByLocal(totalAmount, this.product.currency, this.siteInfo.default_locale);
+        const priceFormatted = getFormattedPriceByLocal(totalAmount, this.product.currency, getPageOrDefaultLanguage());
         const autoRenewed = this.product.auto_renew;
         const {
           interval,
@@ -14171,14 +14256,11 @@ const TaxAmount = () => {
       taxAmount
     }
   } = useContext(store$d);
-  const {
-    default_locale
-  } = Pelcro.site.read();
   const {
     plan
   } = usePelcro();
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
-  const priceFormatted = getFormattedPriceByLocal(taxAmount * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+  const priceFormatted = getFormattedPriceByLocal(taxAmount * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
 
   if (taxAmount) {
     return /*#__PURE__*/React__default.createElement("div", {
@@ -15051,10 +15133,7 @@ const SubscriptionCreateView = ({
       interval,
       count: interval_count
     });
-    const {
-      default_locale
-    } = Pelcro.site.read();
-    const priceFormatted = getFormattedPriceByLocal((plan === null || plan === void 0 ? void 0 : plan.amount) * ((_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1), plan === null || plan === void 0 ? void 0 : plan.currency, default_locale);
+    const priceFormatted = getFormattedPriceByLocal((plan === null || plan === void 0 ? void 0 : plan.amount) * ((_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1), plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
     return /*#__PURE__*/React__default.createElement("p", {
       className: "plc-text-gray-600"
     }, /*#__PURE__*/React__default.createElement("span", {
@@ -18231,7 +18310,6 @@ const OrderConfirmModal = props => {
   const userOrders = window.Pelcro.user.read().orders;
   const latestOrder = userOrders === null || userOrders === void 0 ? void 0 : userOrders[userOrders.length - 1];
   const latestOrderDiscount = latestOrder === null || latestOrder === void 0 ? void 0 : (_latestOrder$coupon = latestOrder.coupon) === null || _latestOrder$coupon === void 0 ? void 0 : _latestOrder$coupon.percent_off;
-  const locale = window.Pelcro.site.read().default_locale;
   const {
     t
   } = useTranslation("shop");
@@ -18290,7 +18368,7 @@ const OrderConfirmModal = props => {
     className: "plc-mr-1 pelcro-summary-total-text"
   }, t("labels.total")), /*#__PURE__*/React__default.createElement("p", {
     className: "pelcro-summary-total"
-  }, latestOrderDiscount && `(-${latestOrderDiscount}%) `, getFormattedPriceByLocal(latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.amount, latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.currency, locale)))), /*#__PURE__*/React__default.createElement("div", {
+  }, latestOrderDiscount && `(-${latestOrderDiscount}%) `, getFormattedPriceByLocal(latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.amount, latestOrder === null || latestOrder === void 0 ? void 0 : latestOrder.currency, getPageOrDefaultLanguage())))), /*#__PURE__*/React__default.createElement("div", {
     className: "plc-flex plc-justify-center plc-mt-6"
   }, /*#__PURE__*/React__default.createElement(Button, {
     id: "pelcro-submit",
@@ -18352,9 +18430,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({
@@ -20659,7 +20737,6 @@ const OrderItems = ({
   const {
     t
   } = useTranslation("dashboard");
-  const site = window.Pelcro.site.read();
   return !(orders !== null && orders !== void 0 && orders.length) ? /*#__PURE__*/React__default.createElement("tbody", null, /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
     colSpan: "3",
     className: "plc-text-center plc-text-gray-500"
@@ -20675,7 +20752,7 @@ const OrderItems = ({
       className: "plc-py-4 plc-pl-2"
     }, /*#__PURE__*/React__default.createElement("span", {
       className: "plc-text-xl plc-font-semibold "
-    }, getFormattedPriceByLocal(order.amount, order.currency, site.default_locale)), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("span", {
+    }, getFormattedPriceByLocal(order.amount, order.currency, getPageOrDefaultLanguage())), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("span", {
       className: "plc-text-xs plc-text-gray-400 plc-uppercase"
     }, t("labels.orders.itemsAmount", {
       count: getItemsAmount(order.id)
@@ -20704,7 +20781,7 @@ const OrderItems = ({
         className: ""
       }, item.product_sku_name))), /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement("span", {
         className: "plc-font-semibold"
-      }, getFormattedPriceByLocal(item.amount, order.currency, site.default_locale))));
+      }, getFormattedPriceByLocal(item.amount, order.currency, getPageOrDefaultLanguage()))));
     }), /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
       colSpan: "3"
     }, /*#__PURE__*/React__default.createElement("hr", {
@@ -21431,7 +21508,7 @@ class Dashboard extends Component {
           className: "plc-font-semibold plc-text-gray-500"
         }, sub.plan.nickname), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("span", {
           className: "plc-text-xs plc-text-gray-400"
-        }, getFormattedPriceByLocal(sub.plan.amount, sub.plan.currency, this.site.default_locale)))), /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement("span", {
+        }, getFormattedPriceByLocal(sub.plan.amount, sub.plan.currency, getPageOrDefaultLanguage())))), /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement("span", {
           className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${this.getSubscriptionStatus(sub).bgColor} plc-uppercase ${this.getSubscriptionStatus(sub).textColor} plc-rounded-lg`
         }, this.getSubscriptionStatus(sub).icon, this.getSubscriptionStatus(sub).title), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("div", {
           className: "plc-mb-4 plc-text-xs plc-text-gray-500"
@@ -21534,7 +21611,7 @@ class Dashboard extends Component {
           className: "plc-font-semibold plc-text-gray-500"
         }, recipient.plan.nickname), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("span", {
           className: "plc-text-xs plc-text-gray-400"
-        }, getFormattedPriceByLocal(recipient.plan.amount, recipient.plan.currency, this.site.default_locale)))), recipient.status && /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement("span", {
+        }, getFormattedPriceByLocal(recipient.plan.amount, recipient.plan.currency, getPageOrDefaultLanguage())))), recipient.status && /*#__PURE__*/React__default.createElement("td", null, /*#__PURE__*/React__default.createElement("span", {
           className: `plc-inline-flex plc-p-1 plc-text-xs plc-font-semibold ${this.getSubscriptionStatus(recipient).bgColor} plc-uppercase ${this.getSubscriptionStatus(recipient).textColor} plc-rounded-lg`
         }, this.getSubscriptionStatus(recipient).icon, this.getSubscriptionStatus(recipient).title), /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement("div", {
           className: "plc-mb-4 plc-text-xs plc-text-gray-500"

package/package.json

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