@pelcro/react-pelcro-js 3.9.0-beta.1 → 3.9.0-beta.3

package/dist/index.cjs.js

@@ -3824,7 +3824,10 @@ var labels$F = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}s",
 	tax: "+ Tax",
-	removeCoupon: "REMOVE"
+	removeCoupon: "REMOVE",
+	firstName: "First name",
+	lastName: "Last name",
+	phone: "Phone"
 };
 var checkoutForm_en = {
 	messages: messages$I,
@@ -3851,7 +3854,10 @@ var labels$E = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}s",
 	tax: "+ Taxe",
-	removeCoupon: "RETIRER"
+	removeCoupon: "RETIRER",
+	firstName: "Prénom",
+	lastName: "Nom de famille",
+	phone: "Téléphoner"
 };
 var checkoutForm_fr = {
 	messages: messages$H,
@@ -3878,7 +3884,10 @@ var labels$D = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}",
 	tax: "+ 세금",
-	removeCoupon: "제거"
+	removeCoupon: "제거",
+	firstName: "이름",
+	lastName: "성",
+	phone: "핸드폰"
 };
 var checkoutForm_ko = {
 	messages: messages$G,
@@ -12277,32 +12286,25 @@ const RegisterButton = ({
   className,
   ...otherProps
 }) => {
-  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
+  var _window$Pelcro$site$r;
 
   const {
     state: {
       emailError,
       passwordError,
-      firstNameError,
-      lastNameError,
-      phoneError,
       email,
       password,
-      firstName,
-      lastName,
-      phone,
       buttonDisabled
     },
     dispatch
   } = React.useContext(store$k);
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   const {
     t
   } = useTranslation("register");
   const [isDisabled, setDisabled] = React.useState(true);
   React.useEffect(() => {
-    setDisabled(buttonDisabled || emailError || passwordError || firstNameError || lastNameError || phoneError || !email.length || !password.length || supportsTap && !firstName.length || supportsTap && !lastName.length || supportsTap && !phone.length);
-  }, [buttonDisabled, emailError, passwordError, firstNameError, lastNameError, phoneError, email, password, firstName, lastName, phone]);
+    setDisabled(buttonDisabled || emailError || passwordError || !email.length || !password.length);
+  }, [buttonDisabled, emailError, passwordError, email, password]);
   return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
     onClick: () => {
       dispatch({
@@ -12314,11 +12316,12 @@ const RegisterButton = ({
     isLoading: buttonDisabled,
     className: `${className} g-recaptcha`,
     "data-action": "register",
-    "data-sitekey": (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.security_key
+    "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"));
 };
 
 function FirstName({
+  initWithUserFirstName = true,
   store,
   ...otherProps
 }) {
@@ -12351,7 +12354,23 @@ function FirstName({
   }, [dispatch, firstName, finishedTyping]);
   React.useEffect(() => {
     handleInputChange(firstName);
-  }, [finishedTyping, firstName, handleInputChange]);
+  }, [finishedTyping, firstName, handleInputChange]); // Initialize first name field with user's first name
+
+  const loadFirstNameIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().first_name);
+  };
+
+  React.useEffect(() => {
+    if (initWithUserFirstName) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadFirstNameIntoField();
+      });
+      loadFirstNameIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default['default'].createElement(Input, Object.assign({
     type: "text",
     error: firstNameError,
@@ -12367,6 +12386,7 @@ const RegisterFirstName = props => /*#__PURE__*/React__default['default'].create
 }, props));
 
 function LastName({
+  initWithUserLastName = true,
   store,
   ...otherProps
 }) {
@@ -12399,7 +12419,23 @@ function LastName({
   }, [dispatch, lastName, finishedTyping]);
   React.useEffect(() => {
     handleInputChange(lastName);
-  }, [finishedTyping, lastName, handleInputChange]);
+  }, [finishedTyping, lastName, handleInputChange]); // Initialize last name field with user's last name
+
+  const loadLastNameIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().last_name);
+  };
+
+  React.useEffect(() => {
+    if (initWithUserLastName) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadLastNameIntoField();
+      });
+      loadLastNameIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default['default'].createElement(Input, Object.assign({
     type: "text",
     error: lastNameError,
@@ -12415,6 +12451,7 @@ const RegisterLastName = props => /*#__PURE__*/React__default['default'].createE
 }, props));
 
 function Phone({
+  initWithUserPhone = true,
   store,
   ...otherProps
 }) {
@@ -12447,7 +12484,23 @@ function Phone({
   }, [dispatch, phone, finishedTyping]);
   React.useEffect(() => {
     handleInputChange(phone);
-  }, [finishedTyping, phone, handleInputChange]);
+  }, [finishedTyping, phone, handleInputChange]); // Initialize phone field with user's phone
+
+  const loadPhoneIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().phone);
+  };
+
+  React.useEffect(() => {
+    if (initWithUserPhone) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadPhoneIntoField();
+      });
+      loadPhoneIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default['default'].createElement(Input, Object.assign({
     type: "tel",
     error: phoneError,
@@ -12458,16 +12511,12 @@ function Phone({
   }, otherProps));
 }
 
-const RegisterPhone = props => /*#__PURE__*/React__default['default'].createElement(Phone, Object.assign({
-  store: store$k
-}, props));
-
 /**
  *
  */
 
 function RegisterView(props) {
-  var _product$paywall$regi, _product$paywall, _product$paywall$regi2, _product$paywall2, _window$Pelcro$site$r, _window$Pelcro$site$r2, _window$Pelcro$site$r3, _window$Pelcro, _window$Pelcro$uiSett, _window$Pelcro$site$r4;
+  var _product$paywall$regi, _product$paywall, _product$paywall$regi2, _product$paywall2, _window$Pelcro$site$r, _window$Pelcro$site$r2, _window$Pelcro$site$r3, _window$Pelcro, _window$Pelcro$uiSett;
 
   const {
     t
@@ -12479,7 +12528,6 @@ function RegisterView(props) {
   const subtitle = (_product$paywall$regi2 = product === null || product === void 0 ? void 0 : (_product$paywall2 = product.paywall) === null || _product$paywall2 === void 0 ? void 0 : _product$paywall2.register_subtitle) !== null && _product$paywall$regi2 !== void 0 ? _product$paywall$regi2 : t("subtitle");
   const socialLoginEnabled = ((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.facebook_app_id) || ((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.google_app_id) || ((_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.auth0_client_id);
   const showNameFields = (_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.enableNameFieldsInRegister;
-  const supportsTap = Boolean((_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.tap_gateway_settings);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     id: "pelcro-register-view"
   }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -12489,25 +12537,18 @@ function RegisterView(props) {
   }, title), /*#__PURE__*/React__default['default'].createElement("p", null, subtitle)), /*#__PURE__*/React__default['default'].createElement("form", {
     action: "javascript:void(0);",
     className: "plc-mt-2 pelcro-form"
-  }, /*#__PURE__*/React__default['default'].createElement(RegisterContainer, props, /*#__PURE__*/React__default['default'].createElement(AlertWithContext, null), (showNameFields || supportsTap) && /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default['default'].createElement(RegisterContainer, props, /*#__PURE__*/React__default['default'].createElement(AlertWithContext, null), showNameFields && /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default['default'].createElement(RegisterFirstName, {
     id: "pelcro-input-first-name",
     label: t("labels.firstName"),
-    errorId: "pelcro-input-firstName-error",
-    required: supportsTap ? true : false
+    errorId: "pelcro-input-firstName-error"
   }), /*#__PURE__*/React__default['default'].createElement(RegisterLastName, {
     wrapperClassName: "plc-ml-3",
     id: "pelcro-input-last-name",
     label: t("labels.lastName"),
-    errorId: "pelcro-input-lastName-error",
-    required: supportsTap ? true : false
-  })), supportsTap && /*#__PURE__*/React__default['default'].createElement(RegisterPhone, {
-    id: "pelcro-input-phone",
-    errorId: "pelcro-input-phone-error",
-    label: t("labels.phone"),
-    required: supportsTap ? true : false
-  }), /*#__PURE__*/React__default['default'].createElement(RegisterEmail, {
+    errorId: "pelcro-input-lastName-error"
+  })), /*#__PURE__*/React__default['default'].createElement(RegisterEmail, {
     id: "pelcro-input-email",
     errorId: "pelcro-input-email-error",
     label: t("labels.email"),
@@ -12553,9 +12594,9 @@ function RegisterView(props) {
  */
 
 function hasSecurityTokenEnabled() {
-  var _window$Pelcro$site, _window$Pelcro$site$r5;
+  var _window$Pelcro$site, _window$Pelcro$site$r4;
 
-  return Boolean((_window$Pelcro$site = window.Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r5 = _window$Pelcro$site.read()) === null || _window$Pelcro$site$r5 === void 0 ? void 0 : _window$Pelcro$site$r5.security_key);
+  return Boolean((_window$Pelcro$site = window.Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r4 = _window$Pelcro$site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.security_key);
 }
 
 const Loader = props => /*#__PURE__*/React__default['default'].createElement("div", {
@@ -15274,6 +15315,12 @@ const initialState$j = {
   updatedPrice: null,
   taxAmount: null,
   currentPlan: null,
+  firstName: "",
+  lastName: "",
+  phone: "",
+  firstNameError: null,
+  lastNameError: null,
+  phoneError: null,
   alert: {
     type: "error",
     content: ""
@@ -15390,8 +15437,14 @@ const PaymentMethodContainerWithoutStripe = ({
           }
         });
       } else {
+        console.log("First Name", state.firstName);
+        console.log("Last Name", state.lastName);
+        console.log("Phone", state.phone);
         window.Pelcro.payment.authorize({
           auth_token: window.Pelcro.user.read().auth_token,
+          first_name: window.Pelcro.user.read().first_name || state.firstName,
+          last_name: window.Pelcro.user.read().last_name || state.lastName,
+          phone: window.Pelcro.user.read().phone || state.phone,
           site_id: window.Pelcro.siteid,
           amount: totalAmount,
           currency: (plan === null || plan === void 0 ? void 0 : plan.currency) || (invoice === null || invoice === void 0 ? void 0 : invoice.currency) || window.Pelcro.site.read().default_currency,
@@ -16917,6 +16970,42 @@ const PaymentMethodContainerWithoutStripe = ({
           percentOff: action.payload
         });
 
+      case SET_FIRST_NAME:
+        return lib_7({ ...state,
+          firstName: action.payload,
+          firstNameError: null
+        });
+
+      case SET_LAST_NAME:
+        return lib_7({ ...state,
+          lastName: action.payload,
+          lastNameError: null
+        });
+
+      case SET_PHONE:
+        return lib_7({ ...state,
+          phone: action.payload,
+          phoneError: null
+        });
+
+      case SET_FIRST_NAME_ERROR:
+        return lib_7({ ...state,
+          firstNameError: action.payload,
+          firstName: ""
+        });
+
+      case SET_LAST_NAME_ERROR:
+        return lib_7({ ...state,
+          lastNameError: action.payload,
+          lastName: ""
+        });
+
+      case SET_PHONE_ERROR:
+        return lib_7({ ...state,
+          phoneError: action.payload,
+          phone: null
+        });
+
       case SHOW_ALERT:
         return lib_7({ ...state,
           alert: action.payload
@@ -17131,7 +17220,7 @@ const SubmitPaymentMethod = ({
   onClick,
   ...otherProps
 }) => {
-  var _plan$quantity;
+  var _plan$quantity, _window$Pelcro$site$r;
 
   const {
     plan
@@ -17142,6 +17231,12 @@ const SubmitPaymentMethod = ({
   const {
     dispatch,
     state: {
+      firstNameError,
+      lastNameError,
+      phoneError,
+      firstName,
+      lastName,
+      phone,
       disableSubmit,
       isLoading,
       updatedPrice
@@ -17150,6 +17245,18 @@ const SubmitPaymentMethod = ({
   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, getPageOrDefaultLanguage());
+  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
+  const isUserFirstName = Boolean(window.Pelcro.user.read().first_name);
+  const isUserLastName = Boolean(window.Pelcro.user.read().last_name);
+  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
+  const [isDisabled, setDisabled] = React.useState(true);
+  React.useEffect(() => {
+    if (supportsTap && isUserFirstName && isUserLastName && isUserPhone) {
+      setDisabled(disableSubmit);
+    } else {
+      setDisabled(disableSubmit || supportsTap && firstNameError || supportsTap && lastNameError || supportsTap && phoneError || supportsTap && !firstName.length || supportsTap && !lastName.length || supportsTap && !phone.length);
+    }
+  }, [disableSubmit, firstNameError, lastNameError, phoneError, firstName, lastName, phone]);
   return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
     role: "submit",
     className: "plc-w-full plc-py-3",
@@ -17161,7 +17268,7 @@ const SubmitPaymentMethod = ({
       });
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
-    disabled: disableSubmit
+    disabled: isDisabled
   }, otherProps), plan ? /*#__PURE__*/React__default['default'].createElement("span", {
     className: "plc-capitalize "
   }, t("labels.pay"), " ", priceFormatted && priceFormatted) : t("labels.submit"));
@@ -17736,6 +17843,18 @@ const TaxAmount = () => {
   return null;
 };
 
+const IncludeFirstName = props => /*#__PURE__*/React__default['default'].createElement(FirstName, Object.assign({
+  store: store$j
+}, props));
+
+const IncludeLastName = props => /*#__PURE__*/React__default['default'].createElement(LastName, Object.assign({
+  store: store$j
+}, props));
+
+const IncludePhone = props => /*#__PURE__*/React__default['default'].createElement(Phone, Object.assign({
+  store: store$j
+}, props));
+
 /**
  *
  */
@@ -17755,7 +17874,10 @@ function PaymentMethodView({
   } = useTranslation("checkoutForm");
   const cardProcessor = getSiteCardProcessor();
   const supportsVantiv = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.vantiv_gateway_settings);
-  Boolean((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.tap_gateway_settings);
+  const supportsTap = Boolean((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.tap_gateway_settings);
+  const isUserFirstName = Boolean(window.Pelcro.user.read().first_name);
+  const isUserLastName = Boolean(window.Pelcro.user.read().last_name);
+  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
   }, cardProcessor === "stripe" && /*#__PURE__*/React__default['default'].createElement("div", {
@@ -17777,7 +17899,25 @@ function PaymentMethodView({
     onFailure: onFailure
   }, /*#__PURE__*/React__default['default'].createElement(BankRedirection, null), /*#__PURE__*/React__default['default'].createElement(AlertWithContext, {
     className: "plc-mb-2"
-  }), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(SelectedPaymentMethod, null), /*#__PURE__*/React__default['default'].createElement(CheckoutForm, null), showCoupon && /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default['default'].createElement("div", 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", {
+    className: "plc-flex plc-items-start"
+  }, /*#__PURE__*/React__default['default'].createElement(IncludeFirstName, {
+    id: "pelcro-input-first-name",
+    label: t("labels.firstName"),
+    errorId: "pelcro-input-firstName-error",
+    required: true
+  }), /*#__PURE__*/React__default['default'].createElement(IncludeLastName, {
+    wrapperClassName: "plc-ml-3",
+    id: "pelcro-input-last-name",
+    label: t("labels.lastName"),
+    errorId: "pelcro-input-lastName-error",
+    required: true
+  })), /*#__PURE__*/React__default['default'].createElement(IncludePhone, {
+    id: "pelcro-input-phone",
+    errorId: "pelcro-input-phone-error",
+    label: t("labels.phone"),
+    required: true
+  })), /*#__PURE__*/React__default['default'].createElement(CheckoutForm, null), showCoupon && /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-mb-2"
   }, /*#__PURE__*/React__default['default'].createElement(CouponCode, null), /*#__PURE__*/React__default['default'].createElement(DiscountedPrice, null)), /*#__PURE__*/React__default['default'].createElement(TaxAmount, null), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-grid plc-mt-4 plc-gap-y-2"
@@ -19531,30 +19671,16 @@ const UserUpdateButton = ({
   onClick,
   ...otherProps
 }) => {
-  var _window$Pelcro$site$r;
-
   const {
     state: {
       buttonDisabled,
-      email,
-      firstName,
-      lastName,
-      phone,
-      emailError,
-      firstNameError,
-      lastNameError,
-      phoneError
+      emailError
     },
     dispatch
   } = React.useContext(store$f);
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   const {
     t
   } = useTranslation("userEdit");
-  const [isDisabled, setDisabled] = React.useState(true);
-  React.useEffect(() => {
-    setDisabled(buttonDisabled || emailError || firstNameError || lastNameError || phoneError || !(email !== null && email !== void 0 && email.length) || supportsTap && !(firstName !== null && firstName !== void 0 && firstName.length) || supportsTap && !(lastName !== null && lastName !== void 0 && lastName.length) || supportsTap && !(phone !== null && phone !== void 0 && phone.length));
-  }, [email, firstName, lastName, phone, buttonDisabled, emailError, firstNameError, lastNameError, phoneError]);
   return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
     onClick: () => {
       dispatch({
@@ -19562,7 +19688,7 @@ const UserUpdateButton = ({
       });
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
-    disabled: isDisabled,
+    disabled: buttonDisabled || emailError,
     isLoading: buttonDisabled && !emailError
   }, otherProps), name !== null && name !== void 0 ? name : t("labels.submit"));
 };
@@ -19607,12 +19733,9 @@ const UserUpdateProfilePic = ({
 };
 
 const UserUpdateView = props => {
-  var _window$Pelcro$site$r;
-
   const {
     t
   } = useTranslation("userEdit");
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     id: "pelcro-user-update-view"
   }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -19631,22 +19754,19 @@ const UserUpdateView = props => {
     id: "pelcro-input-first-name",
     errorId: "pelcro-input-first-name-error",
     label: t("labels.firstName"),
-    autoFocus: true,
-    required: supportsTap ? true : false
+    autoFocus: true
   }), /*#__PURE__*/React__default['default'].createElement(UserUpdateLastName, {
     wrapperClassName: "plc-ml-3",
     autoComplete: "last-name",
     id: "pelcro-input-last-name",
     errorId: "pelcro-input-last-name-error",
-    label: t("labels.lastName"),
-    required: supportsTap ? true : false
+    label: t("labels.lastName")
   })), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default['default'].createElement(UserUpdatePhone, {
     id: "pelcro-input-phone",
     errorId: "pelcro-input-phone-error",
-    label: t("labels.phone"),
-    required: supportsTap ? true : false
+    label: t("labels.phone")
   })), /*#__PURE__*/React__default['default'].createElement(UserUpdateButton, {
     role: "submit",
     className: "plc-w-full plc-mt-2",
@@ -22951,10 +23071,12 @@ const GiftCreateEmail = props => /*#__PURE__*/React__default['default'].createEl
 }, props));
 
 const GiftCreateFirstName = props => /*#__PURE__*/React__default['default'].createElement(FirstName, Object.assign({
+  initWithUserFirstName: false,
   store: store$7
 }, props));
 
 const GiftCreateLastName = props => /*#__PURE__*/React__default['default'].createElement(LastName, Object.assign({
+  initWithUserLastName: false,
   store: store$7
 }, props));
 

package/dist/index.esm.js

@@ -3794,7 +3794,10 @@ var labels$F = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}s",
 	tax: "+ Tax",
-	removeCoupon: "REMOVE"
+	removeCoupon: "REMOVE",
+	firstName: "First name",
+	lastName: "Last name",
+	phone: "Phone"
 };
 var checkoutForm_en = {
 	messages: messages$I,
@@ -3821,7 +3824,10 @@ var labels$E = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}s",
 	tax: "+ Taxe",
-	removeCoupon: "RETIRER"
+	removeCoupon: "RETIRER",
+	firstName: "Prénom",
+	lastName: "Nom de famille",
+	phone: "Téléphoner"
 };
 var checkoutForm_fr = {
 	messages: messages$H,
@@ -3848,7 +3854,10 @@ var labels$D = {
 	interval: "{{count}} {{interval}}",
 	interval_plural: "{{count}} {{interval}}",
 	tax: "+ 세금",
-	removeCoupon: "제거"
+	removeCoupon: "제거",
+	firstName: "이름",
+	lastName: "성",
+	phone: "핸드폰"
 };
 var checkoutForm_ko = {
 	messages: messages$G,
@@ -12247,32 +12256,25 @@ const RegisterButton = ({
   className,
   ...otherProps
 }) => {
-  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
+  var _window$Pelcro$site$r;
 
   const {
     state: {
       emailError,
       passwordError,
-      firstNameError,
-      lastNameError,
-      phoneError,
       email,
       password,
-      firstName,
-      lastName,
-      phone,
       buttonDisabled
     },
     dispatch
   } = useContext(store$k);
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   const {
     t
   } = useTranslation("register");
   const [isDisabled, setDisabled] = useState(true);
   useEffect(() => {
-    setDisabled(buttonDisabled || emailError || passwordError || firstNameError || lastNameError || phoneError || !email.length || !password.length || supportsTap && !firstName.length || supportsTap && !lastName.length || supportsTap && !phone.length);
-  }, [buttonDisabled, emailError, passwordError, firstNameError, lastNameError, phoneError, email, password, firstName, lastName, phone]);
+    setDisabled(buttonDisabled || emailError || passwordError || !email.length || !password.length);
+  }, [buttonDisabled, emailError, passwordError, email, password]);
   return /*#__PURE__*/React__default.createElement(Button, Object.assign({
     onClick: () => {
       dispatch({
@@ -12284,11 +12286,12 @@ const RegisterButton = ({
     isLoading: buttonDisabled,
     className: `${className} g-recaptcha`,
     "data-action": "register",
-    "data-sitekey": (_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.security_key
+    "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"));
 };
 
 function FirstName({
+  initWithUserFirstName = true,
   store,
   ...otherProps
 }) {
@@ -12321,7 +12324,23 @@ function FirstName({
   }, [dispatch, firstName, finishedTyping]);
   useEffect(() => {
     handleInputChange(firstName);
-  }, [finishedTyping, firstName, handleInputChange]);
+  }, [finishedTyping, firstName, handleInputChange]); // Initialize first name field with user's first name
+
+  const loadFirstNameIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().first_name);
+  };
+
+  useEffect(() => {
+    if (initWithUserFirstName) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadFirstNameIntoField();
+      });
+      loadFirstNameIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default.createElement(Input, Object.assign({
     type: "text",
     error: firstNameError,
@@ -12337,6 +12356,7 @@ const RegisterFirstName = props => /*#__PURE__*/React__default.createElement(Fir
 }, props));
 
 function LastName({
+  initWithUserLastName = true,
   store,
   ...otherProps
 }) {
@@ -12369,7 +12389,23 @@ function LastName({
   }, [dispatch, lastName, finishedTyping]);
   useEffect(() => {
     handleInputChange(lastName);
-  }, [finishedTyping, lastName, handleInputChange]);
+  }, [finishedTyping, lastName, handleInputChange]); // Initialize last name field with user's last name
+
+  const loadLastNameIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().last_name);
+  };
+
+  useEffect(() => {
+    if (initWithUserLastName) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadLastNameIntoField();
+      });
+      loadLastNameIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default.createElement(Input, Object.assign({
     type: "text",
     error: lastNameError,
@@ -12385,6 +12421,7 @@ const RegisterLastName = props => /*#__PURE__*/React__default.createElement(Last
 }, props));
 
 function Phone({
+  initWithUserPhone = true,
   store,
   ...otherProps
 }) {
@@ -12417,7 +12454,23 @@ function Phone({
   }, [dispatch, phone, finishedTyping]);
   useEffect(() => {
     handleInputChange(phone);
-  }, [finishedTyping, phone, handleInputChange]);
+  }, [finishedTyping, phone, handleInputChange]); // Initialize phone field with user's phone
+
+  const loadPhoneIntoField = () => {
+    handleInputChange(window.Pelcro.user.read().phone);
+  };
+
+  useEffect(() => {
+    if (initWithUserPhone) {
+      document.addEventListener("PelcroUserLoaded", () => {
+        loadPhoneIntoField();
+      });
+      loadPhoneIntoField();
+      return () => {
+        document.removeEventListener("PelcroUserLoaded", handleInputChange);
+      };
+    }
+  }, []);
   return /*#__PURE__*/React__default.createElement(Input, Object.assign({
     type: "tel",
     error: phoneError,
@@ -12428,16 +12481,12 @@ function Phone({
   }, otherProps));
 }
 
-const RegisterPhone = props => /*#__PURE__*/React__default.createElement(Phone, Object.assign({
-  store: store$k
-}, props));
-
 /**
  *
  */
 
 function RegisterView(props) {
-  var _product$paywall$regi, _product$paywall, _product$paywall$regi2, _product$paywall2, _window$Pelcro$site$r, _window$Pelcro$site$r2, _window$Pelcro$site$r3, _window$Pelcro, _window$Pelcro$uiSett, _window$Pelcro$site$r4;
+  var _product$paywall$regi, _product$paywall, _product$paywall$regi2, _product$paywall2, _window$Pelcro$site$r, _window$Pelcro$site$r2, _window$Pelcro$site$r3, _window$Pelcro, _window$Pelcro$uiSett;
 
   const {
     t
@@ -12449,7 +12498,6 @@ function RegisterView(props) {
   const subtitle = (_product$paywall$regi2 = product === null || product === void 0 ? void 0 : (_product$paywall2 = product.paywall) === null || _product$paywall2 === void 0 ? void 0 : _product$paywall2.register_subtitle) !== null && _product$paywall$regi2 !== void 0 ? _product$paywall$regi2 : t("subtitle");
   const socialLoginEnabled = ((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.facebook_app_id) || ((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.google_app_id) || ((_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.auth0_client_id);
   const showNameFields = (_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.enableNameFieldsInRegister;
-  const supportsTap = Boolean((_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.tap_gateway_settings);
   return /*#__PURE__*/React__default.createElement("div", {
     id: "pelcro-register-view"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -12459,25 +12507,18 @@ function RegisterView(props) {
   }, title), /*#__PURE__*/React__default.createElement("p", null, subtitle)), /*#__PURE__*/React__default.createElement("form", {
     action: "javascript:void(0);",
     className: "plc-mt-2 pelcro-form"
-  }, /*#__PURE__*/React__default.createElement(RegisterContainer, props, /*#__PURE__*/React__default.createElement(AlertWithContext, null), (showNameFields || supportsTap) && /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(RegisterContainer, props, /*#__PURE__*/React__default.createElement(AlertWithContext, null), showNameFields && /*#__PURE__*/React__default.createElement("div", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default.createElement(RegisterFirstName, {
     id: "pelcro-input-first-name",
     label: t("labels.firstName"),
-    errorId: "pelcro-input-firstName-error",
-    required: supportsTap ? true : false
+    errorId: "pelcro-input-firstName-error"
   }), /*#__PURE__*/React__default.createElement(RegisterLastName, {
     wrapperClassName: "plc-ml-3",
     id: "pelcro-input-last-name",
     label: t("labels.lastName"),
-    errorId: "pelcro-input-lastName-error",
-    required: supportsTap ? true : false
-  })), supportsTap && /*#__PURE__*/React__default.createElement(RegisterPhone, {
-    id: "pelcro-input-phone",
-    errorId: "pelcro-input-phone-error",
-    label: t("labels.phone"),
-    required: supportsTap ? true : false
-  }), /*#__PURE__*/React__default.createElement(RegisterEmail, {
+    errorId: "pelcro-input-lastName-error"
+  })), /*#__PURE__*/React__default.createElement(RegisterEmail, {
     id: "pelcro-input-email",
     errorId: "pelcro-input-email-error",
     label: t("labels.email"),
@@ -12523,9 +12564,9 @@ function RegisterView(props) {
  */
 
 function hasSecurityTokenEnabled() {
-  var _window$Pelcro$site, _window$Pelcro$site$r5;
+  var _window$Pelcro$site, _window$Pelcro$site$r4;
 
-  return Boolean((_window$Pelcro$site = window.Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r5 = _window$Pelcro$site.read()) === null || _window$Pelcro$site$r5 === void 0 ? void 0 : _window$Pelcro$site$r5.security_key);
+  return Boolean((_window$Pelcro$site = window.Pelcro.site) === null || _window$Pelcro$site === void 0 ? void 0 : (_window$Pelcro$site$r4 = _window$Pelcro$site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.security_key);
 }
 
 const Loader = props => /*#__PURE__*/React__default.createElement("div", {
@@ -15244,6 +15285,12 @@ const initialState$j = {
   updatedPrice: null,
   taxAmount: null,
   currentPlan: null,
+  firstName: "",
+  lastName: "",
+  phone: "",
+  firstNameError: null,
+  lastNameError: null,
+  phoneError: null,
   alert: {
     type: "error",
     content: ""
@@ -15360,8 +15407,14 @@ const PaymentMethodContainerWithoutStripe = ({
           }
         });
       } else {
+        console.log("First Name", state.firstName);
+        console.log("Last Name", state.lastName);
+        console.log("Phone", state.phone);
         window.Pelcro.payment.authorize({
           auth_token: window.Pelcro.user.read().auth_token,
+          first_name: window.Pelcro.user.read().first_name || state.firstName,
+          last_name: window.Pelcro.user.read().last_name || state.lastName,
+          phone: window.Pelcro.user.read().phone || state.phone,
           site_id: window.Pelcro.siteid,
           amount: totalAmount,
           currency: (plan === null || plan === void 0 ? void 0 : plan.currency) || (invoice === null || invoice === void 0 ? void 0 : invoice.currency) || window.Pelcro.site.read().default_currency,
@@ -16887,6 +16940,42 @@ const PaymentMethodContainerWithoutStripe = ({
           percentOff: action.payload
         });
 
+      case SET_FIRST_NAME:
+        return lib_7({ ...state,
+          firstName: action.payload,
+          firstNameError: null
+        });
+
+      case SET_LAST_NAME:
+        return lib_7({ ...state,
+          lastName: action.payload,
+          lastNameError: null
+        });
+
+      case SET_PHONE:
+        return lib_7({ ...state,
+          phone: action.payload,
+          phoneError: null
+        });
+
+      case SET_FIRST_NAME_ERROR:
+        return lib_7({ ...state,
+          firstNameError: action.payload,
+          firstName: ""
+        });
+
+      case SET_LAST_NAME_ERROR:
+        return lib_7({ ...state,
+          lastNameError: action.payload,
+          lastName: ""
+        });
+
+      case SET_PHONE_ERROR:
+        return lib_7({ ...state,
+          phoneError: action.payload,
+          phone: null
+        });
+
       case SHOW_ALERT:
         return lib_7({ ...state,
           alert: action.payload
@@ -17101,7 +17190,7 @@ const SubmitPaymentMethod = ({
   onClick,
   ...otherProps
 }) => {
-  var _plan$quantity;
+  var _plan$quantity, _window$Pelcro$site$r;
 
   const {
     plan
@@ -17112,6 +17201,12 @@ const SubmitPaymentMethod = ({
   const {
     dispatch,
     state: {
+      firstNameError,
+      lastNameError,
+      phoneError,
+      firstName,
+      lastName,
+      phone,
       disableSubmit,
       isLoading,
       updatedPrice
@@ -17120,6 +17215,18 @@ const SubmitPaymentMethod = ({
   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, getPageOrDefaultLanguage());
+  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
+  const isUserFirstName = Boolean(window.Pelcro.user.read().first_name);
+  const isUserLastName = Boolean(window.Pelcro.user.read().last_name);
+  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
+  const [isDisabled, setDisabled] = useState(true);
+  useEffect(() => {
+    if (supportsTap && isUserFirstName && isUserLastName && isUserPhone) {
+      setDisabled(disableSubmit);
+    } else {
+      setDisabled(disableSubmit || supportsTap && firstNameError || supportsTap && lastNameError || supportsTap && phoneError || supportsTap && !firstName.length || supportsTap && !lastName.length || supportsTap && !phone.length);
+    }
+  }, [disableSubmit, firstNameError, lastNameError, phoneError, firstName, lastName, phone]);
   return /*#__PURE__*/React__default.createElement(Button, Object.assign({
     role: "submit",
     className: "plc-w-full plc-py-3",
@@ -17131,7 +17238,7 @@ const SubmitPaymentMethod = ({
       });
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
-    disabled: disableSubmit
+    disabled: isDisabled
   }, otherProps), plan ? /*#__PURE__*/React__default.createElement("span", {
     className: "plc-capitalize "
   }, t("labels.pay"), " ", priceFormatted && priceFormatted) : t("labels.submit"));
@@ -17706,6 +17813,18 @@ const TaxAmount = () => {
   return null;
 };
 
+const IncludeFirstName = props => /*#__PURE__*/React__default.createElement(FirstName, Object.assign({
+  store: store$j
+}, props));
+
+const IncludeLastName = props => /*#__PURE__*/React__default.createElement(LastName, Object.assign({
+  store: store$j
+}, props));
+
+const IncludePhone = props => /*#__PURE__*/React__default.createElement(Phone, Object.assign({
+  store: store$j
+}, props));
+
 /**
  *
  */
@@ -17725,7 +17844,10 @@ function PaymentMethodView({
   } = useTranslation("checkoutForm");
   const cardProcessor = getSiteCardProcessor();
   const supportsVantiv = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.vantiv_gateway_settings);
-  Boolean((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.tap_gateway_settings);
+  const supportsTap = Boolean((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.tap_gateway_settings);
+  const isUserFirstName = Boolean(window.Pelcro.user.read().first_name);
+  const isUserLastName = Boolean(window.Pelcro.user.read().last_name);
+  const isUserPhone = Boolean(window.Pelcro.user.read().phone);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
   }, cardProcessor === "stripe" && /*#__PURE__*/React__default.createElement("div", {
@@ -17747,7 +17869,25 @@ function PaymentMethodView({
     onFailure: onFailure
   }, /*#__PURE__*/React__default.createElement(BankRedirection, null), /*#__PURE__*/React__default.createElement(AlertWithContext, {
     className: "plc-mb-2"
-  }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), /*#__PURE__*/React__default.createElement(CheckoutForm, null), showCoupon && /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "plc-flex plc-items-start"
+  }, /*#__PURE__*/React__default.createElement(IncludeFirstName, {
+    id: "pelcro-input-first-name",
+    label: t("labels.firstName"),
+    errorId: "pelcro-input-firstName-error",
+    required: true
+  }), /*#__PURE__*/React__default.createElement(IncludeLastName, {
+    wrapperClassName: "plc-ml-3",
+    id: "pelcro-input-last-name",
+    label: t("labels.lastName"),
+    errorId: "pelcro-input-lastName-error",
+    required: true
+  })), /*#__PURE__*/React__default.createElement(IncludePhone, {
+    id: "pelcro-input-phone",
+    errorId: "pelcro-input-phone-error",
+    label: t("labels.phone"),
+    required: true
+  })), /*#__PURE__*/React__default.createElement(CheckoutForm, null), showCoupon && /*#__PURE__*/React__default.createElement("div", {
     className: "plc-mb-2"
   }, /*#__PURE__*/React__default.createElement(CouponCode, null), /*#__PURE__*/React__default.createElement(DiscountedPrice, null)), /*#__PURE__*/React__default.createElement(TaxAmount, null), /*#__PURE__*/React__default.createElement("div", {
     className: "plc-grid plc-mt-4 plc-gap-y-2"
@@ -19501,30 +19641,16 @@ const UserUpdateButton = ({
   onClick,
   ...otherProps
 }) => {
-  var _window$Pelcro$site$r;
-
   const {
     state: {
       buttonDisabled,
-      email,
-      firstName,
-      lastName,
-      phone,
-      emailError,
-      firstNameError,
-      lastNameError,
-      phoneError
+      emailError
     },
     dispatch
   } = useContext(store$f);
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   const {
     t
   } = useTranslation("userEdit");
-  const [isDisabled, setDisabled] = useState(true);
-  useEffect(() => {
-    setDisabled(buttonDisabled || emailError || firstNameError || lastNameError || phoneError || !(email !== null && email !== void 0 && email.length) || supportsTap && !(firstName !== null && firstName !== void 0 && firstName.length) || supportsTap && !(lastName !== null && lastName !== void 0 && lastName.length) || supportsTap && !(phone !== null && phone !== void 0 && phone.length));
-  }, [email, firstName, lastName, phone, buttonDisabled, emailError, firstNameError, lastNameError, phoneError]);
   return /*#__PURE__*/React__default.createElement(Button, Object.assign({
     onClick: () => {
       dispatch({
@@ -19532,7 +19658,7 @@ const UserUpdateButton = ({
       });
       onClick === null || onClick === void 0 ? void 0 : onClick();
     },
-    disabled: isDisabled,
+    disabled: buttonDisabled || emailError,
     isLoading: buttonDisabled && !emailError
   }, otherProps), name !== null && name !== void 0 ? name : t("labels.submit"));
 };
@@ -19577,12 +19703,9 @@ const UserUpdateProfilePic = ({
 };
 
 const UserUpdateView = props => {
-  var _window$Pelcro$site$r;
-
   const {
     t
   } = useTranslation("userEdit");
-  const supportsTap = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.tap_gateway_settings);
   return /*#__PURE__*/React__default.createElement("div", {
     id: "pelcro-user-update-view"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -19601,22 +19724,19 @@ const UserUpdateView = props => {
     id: "pelcro-input-first-name",
     errorId: "pelcro-input-first-name-error",
     label: t("labels.firstName"),
-    autoFocus: true,
-    required: supportsTap ? true : false
+    autoFocus: true
   }), /*#__PURE__*/React__default.createElement(UserUpdateLastName, {
     wrapperClassName: "plc-ml-3",
     autoComplete: "last-name",
     id: "pelcro-input-last-name",
     errorId: "pelcro-input-last-name-error",
-    label: t("labels.lastName"),
-    required: supportsTap ? true : false
+    label: t("labels.lastName")
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default.createElement(UserUpdatePhone, {
     id: "pelcro-input-phone",
     errorId: "pelcro-input-phone-error",
-    label: t("labels.phone"),
-    required: supportsTap ? true : false
+    label: t("labels.phone")
   })), /*#__PURE__*/React__default.createElement(UserUpdateButton, {
     role: "submit",
     className: "plc-w-full plc-mt-2",
@@ -22921,10 +23041,12 @@ const GiftCreateEmail = props => /*#__PURE__*/React__default.createElement(Email
 }, props));
 
 const GiftCreateFirstName = props => /*#__PURE__*/React__default.createElement(FirstName, Object.assign({
+  initWithUserFirstName: false,
   store: store$7
 }, props));
 
 const GiftCreateLastName = props => /*#__PURE__*/React__default.createElement(LastName, Object.assign({
+  initWithUserLastName: false,
   store: store$7
 }, props));
 

package/package.json

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