@redneckz/wildless-cms-uni-blocks 0.14.704 → 0.14.706

package/bundle/bundle.umd.js

@@ -2930,7 +2930,7 @@
 
     function normalizeWithMask(value, pattern) {
         const valueNumbers = value.replace(/\D/g, '');
-        if (valueNumbers === '' || value?.length === pattern.length) {
+        if (valueNumbers === '' || valueNumbers.length === pattern.length) {
             return value;
         }
         const patternInArr = [...pattern];
@@ -4087,8 +4087,10 @@
 
     const ShareholderFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u042F \u044F\u0432\u043B\u044F\u044E\u0441\u044C \u0430\u043A\u0446\u0438\u043E\u043D\u0435\u0440\u043E\u043C / \u0443\u0447\u0430\u0441\u0442\u043D\u0438\u043A\u043E\u043C / \u0447\u043B\u0435\u043D\u043E\u043C / \u043F\u0430\u0439\u0449\u0438\u043A\u043E\u043C / \u0432\u043A\u043B\u0430\u0434\u0447\u0438\u043A\u043E\u043C \u0441 \u0434\u043E\u043B\u0435\u0439 \u0443\u0447\u0430\u0441\u0442\u0438\u044F \u0431\u043E\u043B\u0435\u0435 20% \u0443\u0441\u0442\u0430\u0432\u043D\u043E\u0433\u043E \u043A\u0430\u043F\u0438\u0442\u0430\u043B\u0430 \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u043E\u0433\u043E \u043B\u0438\u0446\u0430", ...getValidation(field('shareholderFlg'), validatorObj.shareholderFlg, input?.required) })));
 
-    const SnilsInput = JSX(({ children, onChange, ...inputProps }) => {
-        const handleChange = useCallback((v) => onChange && onChange(normalizeWithMask(v, '___-___-___ __')), [onChange]);
+    const SnilsInput = JSX(({ children, onChange, maxLength, ...inputProps }) => {
+        const handleChange = useCallback((v) => maxLength
+            ? v.length <= maxLength && onChange?.(normalizeWithMask(v, '___-___-___ __'))
+            : onChange?.(normalizeWithMask(v, '___-___-___ __')), [onChange]);
         const handleBlur = useCallback((v) => {
             if (v === '___-___-___ __') {
                 onChange && onChange('');
@@ -4097,9 +4099,9 @@
         return (jsx(Input, { ...inputProps, onChange: handleChange, onFocus: (ev) => handleChange(ev?.target?.value || ''), onBlur: (ev) => handleBlur(ev?.target?.value || ''), children: children }));
     });
 
-    const InputSnilsControl = JSX(({ className, label, value, error, onChange, onBlur, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(SnilsInput, { "aria-label": label, label: getRequiredLabel({ label, errors: rest?.errors }), valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur, placeholder: "___-___-___ __" }), renderErrorText(error)] })));
+    const InputSnilsControl = JSX(({ className, label, value, error, onChange, onBlur, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(SnilsInput, { "aria-label": label, label: getRequiredLabel({ label, errors: rest?.errors }), valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur, placeholder: "___-___-___ __", ...rest }), renderErrorText(error)] })));
 
-    const SnilsField = JSX(({ field, input }) => (jsx(InputSnilsControl, { label: "\u0421\u041D\u0418\u041B\u0421", ...getValidation(field('snils'), validatorObj.snils, input?.required), ...input })));
+    const SnilsField = JSX(({ field, input }) => (jsx(InputSnilsControl, { label: "\u0421\u041D\u0418\u041B\u0421", maxLength: 14, ...getValidation(field('snils'), validatorObj.snils, input?.required), ...input })));
 
     const FIELD_NAME = 'surname';
     const SurnameField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F", maxLength: 60, disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME), ...getValidation(field('surname'), validatorObj.surname, input?.required), ...input })));
@@ -4500,7 +4502,7 @@
     const sendCode = (body) => fetchRetailJSON('/sms/sendCode', 'POST', body).then((res) => !isErrorResult(res, body.phoneNumber));
     const isErrorResult = (res, phoneNumber) => Boolean(res) &&
         typeof res !== 'string' &&
-        Boolean(res?.errorMessage.startsWith(`Too many request for phoneNumber [${phoneNumber}]`));
+        Boolean(res?.errorMessage?.startsWith(`Too many request for phoneNumber [${phoneNumber}]`));
 
     const checkCaptcha = (body) => doRequest('/sms/checkCaptcha', 'POST', body)
         .then((res) => res.text())
@@ -6816,7 +6818,7 @@
     const FailedStatusContent$1 = JSX(() => (jsx(CreditCardFormStatus, { title: "\u0411\u043B\u0430\u0433\u043E\u0434\u0430\u0440\u0438\u043C \u0412\u0430\u0441 \u0437\u0430 \u043E\u0436\u0438\u0434\u0430\u043D\u0438\u0435", description: "\u0412 \u043D\u0430\u0441\u0442\u043E\u044F\u0449\u0438\u0439 \u043C\u043E\u043C\u0435\u043D\u0442 \u0411\u0430\u043D\u043A \u043D\u0435 \u043C\u043E\u0436\u0435\u0442 \u043E\u0434\u043E\u0431\u0440\u0438\u0442\u044C \u0412\u0430\u0448\u0443 \u0437\u0430\u044F\u0432\u043A\u0443 \u043D\u0430 \u043A\u0440\u0435\u0434\u0438\u0442. \u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u043E\u0434\u0430\u0442\u044C \u0437\u0430\u044F\u0432\u043A\u0443 \u043F\u043E\u0437\u0436\u0435. \u0421\u043F\u0430\u0441\u0438\u0431\u043E \u0437\u0430 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0432 \u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB.", buttonText: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E" })));
 
     const PendingStatusContent$1 = JSX(({ handleExpireTimer }) => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditCardFormStatus, { interval: 300, intervalExpireAction: handleExpireTimer, title: "\u0417\u0430\u044F\u0432\u043A\u0430 \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0430", description: "\u041D\u0435 \u0437\u0430\u043A\u0440\u044B\u0432\u0430\u0439\u0442\u0435 \u043E\u043A\u043D\u043E, \u0441\u043A\u043E\u0440\u043E \u0441\u043E\u043E\u0431\u0449\u0438\u043C \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442", sectionInfoTitle: "\u0417\u0430\u044F\u0432\u043B\u0435\u043D\u043D\u044B\u0435 \u0443\u0441\u043B\u043E\u0432\u0438\u044F \u043F\u043E \u043A\u0440\u0435\u0434\u0438\u0442\u0443", sectionInfo: [
                 {
                     label: 'Название продукта',
@@ -6824,21 +6826,21 @@
                 },
                 {
                     label: 'Категория',
-                    description: leadForm?.cardCategory?.text,
+                    description: statusInfo?.cardCategory,
                 },
             ] }));
     });
 
     const ReworkStatusContent$1 = JSX(() => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditCardFormStatus, { title: "\u0411\u043B\u0430\u0433\u043E\u0434\u0430\u0440\u0438\u043C \u0432\u0430\u0441 \u0437\u0430 \u043E\u0436\u0438\u0434\u0430\u043D\u0438\u0435, \u043D\u043E \u043D\u0430\u043C \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044F \u0431\u043E\u043B\u044C\u0448\u0435 \u0432\u0440\u0435\u043C\u0435\u043D\u0438 \u0434\u043B\u044F \u043F\u0440\u0438\u043D\u044F\u0442\u0438\u044F \u0440\u0435\u0448\u0435\u043D\u0438\u044F", description: "\u041F\u043E\u0441\u0435\u0442\u0438\u0442\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430 \u0441 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u044B\u043C\u0438 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430\u043C\u0438 \u0438 \u0442\u0430\u043A \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u0435 \u043E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u043A\u0440\u0435\u0434\u0438\u0442\u0430.", sectionAdditionalTitle: "\u0412 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0438 \u0411\u0430\u043D\u043A\u0430", sectionInfoAdditional: [
                 {
                     label: 'Регион',
-                    description: leadForm?.regionRetail?.text,
+                    description: statusInfo?.regionRetail,
                 },
                 {
                     label: 'Адрес',
-                    description: leadForm?.addressRetail?.text,
+                    description: statusInfo?.addressRetail,
                 },
             ], sectionInfo: [
                 {
@@ -6849,7 +6851,7 @@
     });
 
     const SuccessStatusContent$1 = JSX(() => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditCardFormStatus, { title: "\u0411\u0430\u043D\u043A \u043E\u0434\u043E\u0431\u0440\u0438\u043B \u0432\u0430\u043C \u043A\u0440\u0435\u0434\u0438\u0442", description: "\u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u0432 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430, \u0447\u0442\u043E\u0431\u044B \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044C \u043E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u0438 \u043F\u043E\u043B\u0443\u0447\u0438\u0442 \u0432\u0430\u0448 \u043A\u0440\u0435\u0434\u0438\u0442", sectionInfo: [
                 {
                     label: 'Название продукта',
@@ -6865,11 +6867,11 @@
                 },
                 {
                     label: 'Срок кредита',
-                    description: leadForm?.monthsValue + ' мес',
+                    description: statusInfo?.calculator?.monthsValue + ' мес',
                 },
                 {
                     label: 'Тип платежа',
-                    description: leadForm?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
+                    description: statusInfo?.calculator?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
                 },
             ], buttonText: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E" }));
     });
@@ -6984,7 +6986,7 @@
             creditInRshbCd: undefined,
         },
         {
-            regionRetail: '',
+            regionRetail: { key: '', text: '' },
             addressRetail: {
                 key: '',
                 text: '',
@@ -7255,6 +7257,8 @@
         const [taskId] = useLocalStorage('taskId');
         const [profileId] = useLocalStorage('profileId');
         const [participantId] = useLocalStorage('participantId');
+        const [, setStatusInfo] = useLocalStorage('statusInfo');
+        const [leadForm] = useLocalStorage('leadForm');
         const handleSubmit = useCallback(async (formData) => {
             const feedbackValidator = objectValidator(getObjectValidator(calculateInputs$1(getValue$2(formData))(inputs, step)));
             if (!isValidationSuccess(feedbackValidator(formData))) {
@@ -7270,7 +7274,7 @@
                         step,
                         formData: formData,
                     }));
-                    resetForm$1(isFinalStep, response);
+                    resetForm$1({ isFinalStep, response, leadForm, setStatusInfo });
                 }
             }
             catch (ex) {
@@ -7286,8 +7290,17 @@
             handleSubmit,
         };
     };
-    const resetForm$1 = (isFinalStep, response) => {
-        if (isFinalStep && response.ok) {
+    const resetForm$1 = ({ isFinalStep, response, leadForm, setStatusInfo, }) => {
+        if (isFinalStep && response.ok && leadForm) {
+            const regionRetail = leadForm?.regionRetail?.text;
+            const addressRetail = leadForm?.addressRetail?.text;
+            const cardCategory = leadForm?.cardCategory?.text;
+            const calculator = {
+                monthsValue: leadForm?.calculator?.monthsValue,
+                moneyValue: leadForm?.calculator?.moneyValue,
+                isAnnuity: leadForm?.calculator?.isAnnuity,
+            };
+            setStatusInfo({ regionRetail, addressRetail, cardCategory, calculator });
             globalThis.localStorage.removeItem('leadForm');
         }
     };
@@ -7711,7 +7724,7 @@
     const FailedStatusContent = JSX(() => (jsx(CreditFormStatus, { title: "\u0411\u043B\u0430\u0433\u043E\u0434\u0430\u0440\u0438\u043C \u0412\u0430\u0441 \u0437\u0430 \u043E\u0436\u0438\u0434\u0430\u043D\u0438\u0435", description: "\u0412 \u043D\u0430\u0441\u0442\u043E\u044F\u0449\u0438\u0439 \u043C\u043E\u043C\u0435\u043D\u0442 \u0411\u0430\u043D\u043A \u043D\u0435 \u043C\u043E\u0436\u0435\u0442 \u043E\u0434\u043E\u0431\u0440\u0438\u0442\u044C \u0412\u0430\u0448\u0443 \u0437\u0430\u044F\u0432\u043A\u0443 \u043D\u0430 \u043A\u0440\u0435\u0434\u0438\u0442. \u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u043E\u0434\u0430\u0442\u044C \u0437\u0430\u044F\u0432\u043A\u0443 \u043F\u043E\u0437\u0436\u0435. \u0421\u043F\u0430\u0441\u0438\u0431\u043E \u0437\u0430 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0432 \u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB.", buttonText: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E" })));
 
     const PendingStatusContent = JSX(({ handleExpireTimer }) => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditFormStatus, { interval: 300, intervalExpireAction: handleExpireTimer, title: "\u0417\u0430\u044F\u0432\u043A\u0430 \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0430", description: "\u041D\u0435 \u0437\u0430\u043A\u0440\u044B\u0432\u0430\u0439\u0442\u0435 \u043E\u043A\u043D\u043E, \u0441\u043A\u043E\u0440\u043E \u0441\u043E\u043E\u0431\u0449\u0438\u043C \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442", sectionInfoTitle: "\u0417\u0430\u044F\u0432\u043B\u0435\u043D\u043D\u044B\u0435 \u0443\u0441\u043B\u043E\u0432\u0438\u044F \u043F\u043E \u043A\u0440\u0435\u0434\u0438\u0442\u0443", sectionInfo: [
                 {
                     label: 'Название продукта',
@@ -7723,29 +7736,29 @@
                 },
                 {
                     label: 'Сумма',
-                    description: `${leadForm?.calculator?.moneyValue?.toLocaleString() ?? '0'} ₽`,
+                    description: `${statusInfo?.calculator?.moneyValue?.toLocaleString() ?? '0'} ₽`,
                 },
                 {
                     label: 'Срок кредита',
-                    description: `${leadForm?.calculator?.monthsValue ?? '0'} мес`,
+                    description: `${statusInfo?.calculator?.monthsValue ?? '0'} мес`,
                 },
                 {
                     label: 'Тип платежа',
-                    description: leadForm?.calculator?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
+                    description: statusInfo?.calculator?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
                 },
             ] }));
     });
 
     const ReworkStatusContent = JSX(() => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditFormStatus, { title: "\u0411\u043B\u0430\u0433\u043E\u0434\u0430\u0440\u0438\u043C \u0432\u0430\u0441 \u0437\u0430 \u043E\u0436\u0438\u0434\u0430\u043D\u0438\u0435, \u043D\u043E \u043D\u0430\u043C \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044F \u0431\u043E\u043B\u044C\u0448\u0435 \u0432\u0440\u0435\u043C\u0435\u043D\u0438 \u0434\u043B\u044F \u043F\u0440\u0438\u043D\u044F\u0442\u0438\u044F \u0440\u0435\u0448\u0435\u043D\u0438\u044F", description: "\u041F\u043E\u0441\u0435\u0442\u0438\u0442\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430 \u0441 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u044B\u043C\u0438 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430\u043C\u0438 \u0438 \u0442\u0430\u043A \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u0435 \u043E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u043A\u0440\u0435\u0434\u0438\u0442\u0430.", sectionAdditionalTitle: "\u0412 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0438 \u0411\u0430\u043D\u043A\u0430", sectionInfoAdditional: [
                 {
                     label: 'Регион',
-                    description: leadForm?.regionRetail?.text,
+                    description: statusInfo?.regionRetail,
                 },
                 {
                     label: 'Адрес',
-                    description: leadForm?.addressRetail?.text,
+                    description: statusInfo?.addressRetail,
                 },
             ], sectionInfo: [
                 {
@@ -7756,7 +7769,7 @@
     });
 
     const SuccessStatusContent = JSX(() => {
-        const [leadForm] = useLocalStorage('leadForm');
+        const [statusInfo] = useLocalStorage('statusInfo');
         return (jsx(CreditFormStatus, { title: "\u0411\u0430\u043D\u043A \u043E\u0434\u043E\u0431\u0440\u0438\u043B \u0432\u0430\u043C \u043A\u0440\u0435\u0434\u0438\u0442", description: "\u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u0432 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430, \u0447\u0442\u043E\u0431\u044B \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044C \u043E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u0438 \u043F\u043E\u043B\u0443\u0447\u0438\u0442 \u0432\u0430\u0448 \u043A\u0440\u0435\u0434\u0438\u0442", sectionInfo: [
                 {
                     label: 'Название продукта',
@@ -7772,11 +7785,11 @@
                 },
                 {
                     label: 'Срок кредита',
-                    description: leadForm?.monthsValue + ' мес',
+                    description: statusInfo?.calculator?.monthsValue + ' мес',
                 },
                 {
                     label: 'Тип платежа',
-                    description: leadForm?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
+                    description: statusInfo?.calculator?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
                 },
             ], buttonText: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E" }));
     });
@@ -7892,7 +7905,7 @@
             creditInRshbCd: undefined,
         },
         {
-            regionRetail: '',
+            regionRetail: { key: '', text: '' },
             addressRetail: undefined,
             bankEmployeeCode: undefined,
         },
@@ -8134,6 +8147,8 @@
         const [taskId] = useLocalStorage('taskId');
         const [profileId] = useLocalStorage('profileId');
         const [participantId] = useLocalStorage('participantId');
+        const [, setStatusInfo] = useLocalStorage('statusInfo');
+        const [leadForm] = useLocalStorage('leadForm');
         const handleSubmit = useCallback(async (formData) => {
             const feedbackValidator = objectValidator(getObjectValidator(calculateInputs(getValue(formData))(inputs, step)));
             if (!isValidationSuccess(feedbackValidator(formData))) {
@@ -8149,7 +8164,7 @@
                         step,
                         formData: formData,
                     }));
-                    resetForm(isFinalStep, response);
+                    resetForm({ isFinalStep, response, leadForm, setStatusInfo });
                 }
             }
             catch (ex) {
@@ -8165,8 +8180,22 @@
             handleSubmit,
         };
     };
-    const resetForm = (isFinalStep, response) => {
-        if (isFinalStep && response.ok) {
+    const resetForm = ({ isFinalStep, response, leadForm, setStatusInfo, }) => {
+        if (isFinalStep && response.ok && leadForm !== null) {
+            const regionRetail = leadForm?.regionRetail?.text;
+            const addressRetail = leadForm?.addressRetail?.text;
+            const cardCategory = leadForm?.cardCategory?.text;
+            const calculator = {
+                monthsValue: leadForm?.calculator?.monthsValue,
+                moneyValue: leadForm?.calculator?.moneyValue,
+                isAnnuity: leadForm?.calculator?.isAnnuity,
+            };
+            setStatusInfo({
+                regionRetail,
+                addressRetail,
+                cardCategory,
+                calculator,
+            });
             globalThis.localStorage.removeItem('leadForm');
         }
     };
@@ -10776,7 +10805,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.703";
+    const packageVersion = "0.14.705";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;