@redneckz/wildless-cms-uni-blocks 0.14.134 → 0.14.135

package/bundle/bundle.umd.js

@@ -981,7 +981,7 @@
     const ApplicationFieldsetLayout = JSX(({ title, firstChildren, secondChildren }) => (jsxs("fieldset", { className: "grid @xl:flex @xl:justify-between gap-lg border-b border-b-main-divider @xl:border-none", children: [title ? (jsx("legend", { className: "w-full", children: jsx(Heading, { title: title, headingType: "h6", className: "@xl:text-center" }) })) : null, firstChildren, secondChildren] })));
     const formChildrenStyle = '@xl:w-1/2 space-y-s';
 
-    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, autoFocus = false, }) => {
+    const Input = JSX(({ key, className = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, autoFocus = false, isTextarea = false, }) => {
         const inputRef = useRef(null);
         const handleChange = useCallback((e) => {
             onChange && onChange(e.target?.value || '');
@@ -991,16 +991,19 @@
                 inputRef.current?.focus();
             }
         }, [autoFocus, inputRef]);
+        const defaultStyle = 'w-full border rounded-md text-primary-text outline-none p-m';
         const paddingStyle = children ? 'pr-3xl' : '';
-        const validStyle = valid
-            ? 'border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'
-            : 'border-error';
-        return (jsxs("div", { className: style('relative', className), children: [jsxs("label", { children: [label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx("input", { ref: inputRef, className: style('w-full h-14 border rounded-md text-primary-text outline-none p-m', paddingStyle, validStyle, inputClassName), id: id, name: name || id, placeholder: placeholder, type: type, value: value, onInput: handleChange, onFocus: onFocus, onBlur: onBlur, pattern: pattern }, key)] }), children] }));
+        const validStyle = getValidStyle(valid);
+        return (jsxs("div", { className: style('relative', className), children: [jsxs("label", { children: [label ? renderLabel$1(label) : null, isTextarea ? (jsx("textarea", { className: style('block resize-y min-h-24', defaultStyle, validStyle), id: style('textarea', id), name: name || id, placeholder: placeholder, value: value, onInput: handleChange, onFocus: onFocus, onBlur: onBlur }, key)) : (jsx("input", { type: type, className: style('h-14', defaultStyle, paddingStyle, validStyle), ref: inputRef, id: id, name: name || id, placeholder: placeholder, value: value, onInput: handleChange, onFocus: onFocus, onBlur: onBlur, pattern: pattern }, key))] }), children] }));
     });
+    const renderLabel$1 = (label) => (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) }));
+    const getValidStyle = (valid) => valid
+        ? 'border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'
+        : 'border-error';
 
     const renderErrorText = (error) => (jsx("div", { className: "h-4", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null }));
 
-    const InputControl = JSX(({ className, label, value = '', error, onChange, onBlur }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(Input, { type: "text", "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur }), renderErrorText(error)] })));
+    const InputControl = JSX(({ className, label, value = '', placeholder, error, onChange, onBlur, isTextarea }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(Input, { type: "text", "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur, isTextarea: isTextarea, placeholder: placeholder }), renderErrorText(error)] })));
 
     const isPlaceholder = (_) => _ === '_';
     const isDigit = (_) => /\d/.test(_);
@@ -1424,7 +1427,7 @@
         },
         {
             text: 'Качество обслуживания',
-            key: 'FEEDBACK_QC',
+            key: 'FEEDBACK_QS',
         },
     ];
     const FEEDBACK_METHOD = [
@@ -1464,10 +1467,7 @@
     });
     const checkboxStyle = (value) => style('rounded border', value ? 'bg-primary-main' : '');
 
-    const renderAgreementWithSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex w-full justify-between items-baseline", children: [jsxs("div", { children: [jsxs("div", { className: "flex gap-3", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { text: "\u0421\u043E\u0433\u043B\u0430\u0441\u0435\u043D \u0441 ", link: link })] }), renderErrorText(withValidator(consentDataProcessing, consentDataProcessingValidator).error)] }), renderSubmitButton(button)] }));
-
-    const activeTextareaStyles = 'hover:border-primary-hover active:focus:border-primary-text focus:border-primary-text';
-    const renderTextarea = (textField, text, placeholder = '') => (jsxs("label", { className: "space-y-xs", htmlFor: "textarea", children: [text ? (jsx("div", { children: jsx(Text, { size: "text-m", font: "font-light", children: text }) })) : null, jsx("textarea", { id: "textarea", placeholder: placeholder, className: style('block w-full resize-y min-h-24 p-m outline-none border rounded-md border-gray', activeTextareaStyles), value: textField.value, onInput: ((e) => textField.onChange && textField.onChange(e.target?.value || '')) })] }));
+    const renderAgreementWithSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex flex-col lg:flex-row w-full justify-between items-baseline", children: [jsxs("div", { children: [jsxs("div", { className: "flex gap-3", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { text: "\u0421\u043E\u0433\u043B\u0430\u0441\u0435\u043D \u0441 ", link: link })] }), renderErrorText(withValidator(consentDataProcessing, consentDataProcessingValidator).error)] }), renderSubmitButton(button)] }));
 
     const formatDate = (date, toTimeStamp = false) => {
         if (typeof date === 'string') {
@@ -1624,7 +1624,7 @@
 
     const DatePickerControl = JSX(({ className, label, value = undefined, error, onChange }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx(DatePicker, { value: value, onChange: onChange, valid: Boolean(!error) }), renderErrorText(error)] })));
 
-    const renderUserData = (field) => (jsxs("div", { children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F*", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u0418\u043C\u044F*", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E (\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E, \u043F\u0440\u0438 \u043D\u0430\u043B\u0438\u0447\u0438\u0438)", ...withValidator(field('middleName'), nameValidator) }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('date'), defaultValidator) })] }));
+    const renderUserData = (field) => (jsxs("div", { children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F*", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u0418\u043C\u044F*", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E (\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E, \u043F\u0440\u0438 \u043D\u0430\u043B\u0438\u0447\u0438\u0438)", ...field('middleName') }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('birthday'), defaultValidator) })] }));
 
     const initialFormState$2 = {
         typeForm: { key: 'FEEDBACK', text: 'Задать вопрос по продуктам и услугам' },
@@ -1632,12 +1632,10 @@
         surname: '',
         name: '',
         middleName: '',
-        date: undefined,
+        birthday: undefined,
         feedbackMethod: { key: 'Телефонный звонок' },
         phone: '',
-        phoneAdditional: '',
-        mail: '',
-        text: '',
+        email: '',
         comment: '',
         consentDataProcessing: false,
     };
@@ -1646,34 +1644,39 @@
         region: defaultValidator,
         department: defaultValidator,
         name: nameValidator,
-        date: defaultValidator,
+        birthday: defaultValidator,
         feedbackMethod: defaultValidator,
         phone: phoneValidator,
-        mail: defaultValidator,
+        email: defaultValidator,
         consentDataProcessing: consentDataProcessingValidator,
         inn: innValidator,
     });
     const ApplicationFormFeedback = JSX(({ button, link, onSubmit }) => {
         const handleSubmit = useCallback((formState) => {
+            const { typeForm, region, department, phone, email, inn, fullName, feedbackMethod, ...usedFields } = formState;
             const submitData = {
-                ...formState,
-                typeForm: formState.typeForm.key,
-                region: formState.region?.text || '',
-                department: formState.department?.text || '',
-                phone: formState.phone.replace(/[^+\d]/g, ''),
+                ...usedFields,
+                typeForm: typeForm.key,
+                department: department?.text || '',
+                feedbackMethod: feedbackMethod.text,
+                [isLegalEntity ? 'region' : 'regionBranch']: region?.text,
+                [isLegalEntity ? 'phone' : 'phoneNumber']: phone.replace(/[^+\d]/g, ''),
+                [isLegalEntity ? 'mail' : 'email']: email,
+                ...(isLegalEntity ? { inn, fullName } : {}),
             };
-            isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData);
+            isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData, isLegalEntity);
         }, [onSubmit]);
         const [formState, { field, ...formProps }] = useForm(initialFormState$2, handleSubmit);
-        const regions = useGetRegions();
-        const branches = useBranches(formState.region?.key).filter((branch) => branch?.address);
-        const isQualityService = field('typeForm').value?.key === 'FEEDBACK_QC';
-        const isLegalEntity = isQualityService && field('serviceDirection').value?.key === 'Юридическое лицо / ИП';
-        return (jsx("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: "w-full max-w-xl space-y-s m-auto", children: [jsx(SelectControl, { label: "\u0422\u0435\u043C\u0430*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0435\u043C\u0443", options: FEEDBACK_TYPES, ...withValidator(field('typeForm'), defaultValidator) }), isQualityService ? (jsx(SelectControl, { label: "\u041D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435 \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435", options: SERVICE_DIRECTIONS, ...withValidator(field('serviceDirection'), defaultValidator) })) : null, jsx(SelectControl, { label: "\u0424\u0438\u043B\u0438\u0430\u043B \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }), jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: branches.map(({ branchCode = '', address = '' }) => ({
+        const branch = useGetRegions();
+        const regions = useBranches(formState?.region?.key).filter((region) => region?.address);
+        const isQualityService = field('typeForm').value?.key === 'FEEDBACK_QS';
+        const isLegalEntity = getLegalEntity(field('typeForm').value?.key, field('serviceDirection').value?.key);
+        return (jsx("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: "w-full max-w-xl space-y-s m-auto", children: [jsx(SelectControl, { label: "\u0422\u0435\u043C\u0430*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0435\u043C\u0443", options: FEEDBACK_TYPES, ...withValidator(field('typeForm'), defaultValidator) }), isQualityService ? (jsx(SelectControl, { label: "\u041D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435 \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435", options: SERVICE_DIRECTIONS, ...withValidator(field('serviceDirection'), defaultValidator) })) : null, jsx(SelectControl, { label: "\u0424\u0438\u043B\u0438\u0430\u043B \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B", isSearch: true, options: branch.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }), isQualityService ? (jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: regions.map(({ branchCode = '', address = '' }) => ({
                                 key: branchCode,
                                 text: address,
-                            })), ...withValidator(field('department'), defaultValidator) }), renderUserData(field), isLegalEntity ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) }), jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...withValidator(field('fullName'), defaultValidator) })] })) : null, jsx(SelectControl, { label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u044F \u043E\u0442\u0432\u0435\u0442\u0430*", options: FEEDBACK_METHOD.map(({ key: key = '' }) => ({ key, text: key })), ...withValidator(field('feedbackMethod'), defaultValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D*", ...withValidator(field('phone'), phoneValidator) }), isQualityService ? (jsxs("div", { children: [jsx(PhoneInputControl, { label: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0439 \u0442\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phoneAdditional'), phoneValidator) }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) }), jsx(InputControl, { label: "\u0424\u0418\u041E \u0438\u043B\u0438 \u0434\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u0432\u0448\u0435\u0433\u043E \u0412\u0430\u0441 \u0441\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A\u0430 \u0411\u0430\u043D\u043A\u0430", ...withValidator(field('bankEmpolee'), defaultValidator) }), jsx(InputControl, { label: "\u0414\u0430\u0442\u0430 \u0438 \u0432\u0440\u0435\u043C\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u044F \u0432 \u0411\u0430\u043D\u043A", ...withValidator(field('applicationDate'), defaultValidator) })] })) : (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })), renderTextarea(field('text'), 'Ваше сообщение*'), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }) }) }));
+                            })), ...withValidator(field('department'), defaultValidator) })) : null, renderUserData(field), isLegalEntity ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0418\u041D\u041D*", ...withValidator(field('inn'), innValidator) }), jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...field('fullName') })] })) : null, jsx(SelectControl, { label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u044F \u043E\u0442\u0432\u0435\u0442\u0430*", options: FEEDBACK_METHOD, ...withValidator(field('feedbackMethod'), defaultValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D*", ...withValidator(field('phone'), phoneValidator) }), isQualityService ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0439 \u0442\u0435\u043B\u0435\u0444\u043E\u043D", ...field('secondaryPhoneNumber') }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) }), jsx(InputControl, { label: "\u0424\u0418\u041E \u0438\u043B\u0438 \u0434\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u0432\u0448\u0435\u0433\u043E \u0412\u0430\u0441 \u0441\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A\u0430 \u0411\u0430\u043D\u043A\u0430", ...field('bankEmpolee') }), jsx(InputControl, { label: "\u0414\u0430\u0442\u0430 \u0438 \u0432\u0440\u0435\u043C\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u044F \u0432 \u0411\u0430\u043D\u043A", ...field('applicationDate') })] })) : (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) })), jsx(InputControl, { ...withValidator(field('comment'), defaultValidator), placeholder: "\u0412\u0430\u0448\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435*", isTextarea: true }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }) }) }));
     });
+    const getLegalEntity = (typeFormKey = '', serviceDirectionKey = '') => typeFormKey === 'FEEDBACK_QS' && serviceDirectionKey === 'Юридическое лицо / ИП';
 
     const ApplicationFormGrantSupport = JSX((props) => {
         const { button, sourceBookDir } = props;
@@ -1692,8 +1695,8 @@
         name: '',
         middleName: '',
         phone: '',
-        mail: '',
-        date: undefined,
+        email: '',
+        birthday: undefined,
         consentDataProcessing: true,
     };
     const individualsValidator = objectValidator({
@@ -1701,28 +1704,28 @@
         name: nameValidator,
         middleName: nameValidator,
         phone: phoneValidator,
-        mail: defaultValidator,
-        date: defaultValidator,
+        email: defaultValidator,
+        birthday: defaultValidator,
     });
     const ApplicationFormIndividuals = JSX((props) => {
         const { button, link, product, onSubmit } = props;
         const handleSubmit = useCallback((formState) => {
-            const { surname, name, middleName, phone, mail, date, consentDataProcessing } = formState;
+            const { surname, name, middleName, phone, email, birthday, consentDataProcessing } = formState;
             isValidationSuccess(individualsValidator(formState)) &&
                 onSubmit({
                     typeForm: 'dpst',
                     surname,
                     name,
                     middleName,
-                    mail,
+                    email,
                     consentDataProcessing,
-                    phone: phone.replace(/[^+\d]/g, ''),
-                    date: date?.toISOString().slice(0, 10) || '',
+                    phoneNumber: phone.replace(/[^+\d]/g, ''),
+                    birthday: birthday?.toISOString().slice(0, 10) || '',
                     product: product || '',
                 }, true);
         }, [onSubmit]);
         const [, { field, ...formProps }] = useForm(initialFormState$1, handleSubmit);
-        return (jsxs("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: [jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E", ...withValidator(field('middleName'), nameValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), secondChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(InputControl, { label: "\u0418\u043C\u044F", ...withValidator(field('name'), nameValidator) }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('date'), defaultValidator) }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })] }) }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }));
+        return (jsxs("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: [jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E", ...withValidator(field('middleName'), nameValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), secondChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(InputControl, { label: "\u0418\u043C\u044F", ...withValidator(field('name'), nameValidator) }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('birthday'), defaultValidator) }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('email'), defaultValidator) })] }) }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }));
     });
 
     const renderContacts = () => (jsxs("div", { className: "flex gap-xl", children: [jsxs("a", { className: "flex gap-s items-center text-primary-text no-underline", href: `tel:8 (800) 200-78-70`, "aria-label": "8 (800) 200-78-70", children: [jsx(Img, { image: { icon: 'PhoneIcon' }, width: "24", height: "24" }), jsx("span", { children: "8 (800) 200-78-70" })] }), jsxs("a", { className: "flex gap-s items-center text-primary-text no-underline", "aria-label": "ved@rshb.ru", href: `mailto:ved@rshb.ru`, children: [jsx(Img, { image: { icon: 'MailIcon' }, width: "24", height: "24" }), jsx("span", { children: "ved@rshb.ru" })] })] }));
@@ -1734,6 +1737,9 @@
         return (jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: "gap-xl grid @xl:flex @xl:items-center", children: [jsx(Radio, { name: "vedTypes", text: "\u0412\u0430\u043B\u044E\u0442\u043D\u044B\u0439 \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u044C", value: "currencyControl", checked: value === 'currencyControl', onChange: (_) => onChange && onChange(_) }), jsx(Radio, { name: "vedTypes", text: "\u0414\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430\u0440\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", value: "documentOperations", checked: value === 'documentOperations', onChange: (_) => onChange && onChange(_) }), jsx(Radio, { name: "vedTypes", text: "\u041A\u043E\u043D\u0432\u0435\u0440\u0441\u0438\u043E\u043D\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", value: "conversionTransactions", checked: value === 'conversionTransactions', onChange: (_) => onChange && onChange(_) }), jsx(Radio, { name: "vedTypes", text: "\u0418\u043D\u044B\u0435 \u0432\u043E\u043F\u0440\u043E\u0441\u044B \u0412\u042D\u0414", value: "otherIssues", checked: value === 'otherIssues', onChange: (_) => onChange && onChange(_) })] }) }));
     };
 
+    const activeTextareaStyles = 'hover:border-primary-hover active:focus:border-primary-text focus:border-primary-text';
+    const renderTextarea = ({ textField, text, placeholder = '', error }) => (jsxs("div", { children: [jsxs("label", { className: "space-y-xs", htmlFor: "textarea", children: [text ? (jsx("div", { children: jsx(Text, { size: "text-m", font: "font-light", children: text }) })) : null, jsx("textarea", { id: "textarea", placeholder: placeholder, className: style('block w-full resize-y min-h-24 p-m outline-none border rounded-md border-gray', activeTextareaStyles), value: textField.value, onInput: ((e) => textField.onChange && textField.onChange(e.target?.value || '')) })] }), renderErrorText(error)] }));
+
     const renderWedDataOrganization = ({ field, regions }) => {
         const isCurrencyControl = field('vedTypes').value === 'currencyControl';
         return (jsxs("div", { className: "space-y-s", children: [isCurrencyControl ? (jsx(SelectControl, { label: "\u0424\u0438\u043B\u0438\u0430\u043B", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) })) : null, jsxs("div", { className: "grid @xl:grid-cols-2 @xl:gap-x-lg gap-s", children: [isCurrencyControl ? (jsx(InputControl, { label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) })) : null, jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...withValidator(field('fullName'), defaultValidator) }), jsx(InputControl, { label: "\u0424\u0418\u041E", ...withValidator(field('name'), nameValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }), !isCurrencyControl ? (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })) : null] })] }));
@@ -1788,7 +1794,11 @@
         const [, { field, ...formProps }] = useForm(initialFormState, handleSubmit);
         const regions = useGetRegions();
         const textField = field('text');
-        return (jsxs("form", { className: "container space-y-lg", onSubmit: formProps.onSubmit, children: [renderQuestionsInterested(field), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "@xl:text-center" }), renderWedDataOrganization({ field, regions }), renderTextarea(textField, 'Обращение', 'Укажите интересующий вас вопрос, место ведения бизнеса и удобное время для телефонного звонка'), renderSubmitButton(button), jsx(Footnote, { link: link }), jsx(Heading, { headingType: "h6", title: "\u0418\u043B\u0438 \u0441\u0432\u044F\u0436\u0438\u0442\u0435\u0441\u044C \u0441 \u043D\u0430\u043C\u0438 \u0443\u0434\u043E\u0431\u043D\u044B\u043C \u0441\u043F\u043E\u0441\u043E\u0431\u043E\u043C", className: "@xl:text-center" }), renderContacts()] }));
+        return (jsxs("form", { className: "container space-y-lg", onSubmit: formProps.onSubmit, children: [renderQuestionsInterested(field), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "@xl:text-center" }), renderWedDataOrganization({ field, regions }), renderTextarea({
+                    textField,
+                    text: 'Обращение',
+                    placeholder: 'Укажите интересующий вас вопрос, место ведения бизнеса и удобное время для телефонного звонка',
+                }), renderSubmitButton(button), jsx(Footnote, { link: link }), jsx(Heading, { headingType: "h6", title: "\u0418\u043B\u0438 \u0441\u0432\u044F\u0436\u0438\u0442\u0435\u0441\u044C \u0441 \u043D\u0430\u043C\u0438 \u0443\u0434\u043E\u0431\u043D\u044B\u043C \u0441\u043F\u043E\u0441\u043E\u0431\u043E\u043C", className: "@xl:text-center" }), renderContacts()] }));
     });
 
     const EmbeddableForms = {
@@ -5889,7 +5899,7 @@
         return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-3xl sticky bottom-0 pointer-events-auto" }) }));
     }
 
-    const packageVersion = "0.14.133";
+    const packageVersion = "0.14.134";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;