@redneckz/wildless-cms-uni-blocks 0.3.84 → 0.3.85

package/mobile/lib/ui-kit/Img/ImgAsPicture.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+const sourcesComparator = (a, b) => {
+    if (a.media && b.media) {
+        return a.media - b.media;
+    }
+    return 0;
+};
+export const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', isMobile = false }) => {
+    if (!image) {
+        return null;
+    }
+    const pictureStyles = isMobile ? 'flex' : 'flex-none';
+    return (_jsxs("picture", { className: `${pictureStyles} ${className}`, children: [image?.sources?.length
+                ? image.sources
+                    .sort(sourcesComparator)
+                    .map(({ src, format, media, size }, index) => (_jsx("source", { srcSet: src, type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...size }, `${index}_${src}`)))
+                : null, renderImg(image, imageClassName, isMobile)] }));
+});
+const renderImg = (image, imageClassName = '', isMobile = false) => {
+    const title = image.title || '';
+    const alt = image.alt || image.title;
+    const imgStyle = isMobile ? 'm-auto' : 'm-0';
+    return (_jsx("img", { src: image.src, className: `${imgStyle} ${imageClassName}`, alt: alt, title: title, ...image.size }));
+};
+export function formatToMimeType(format) {
+    return format ? `image/${String(format)}` : undefined;
+}
+//# sourceMappingURL=ImgAsPicture.js.map

package/mobile/lib/ui-kit/Img/ImgAsPicture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImgAsPicture.js","sourceRoot":"","sources":["../../../src/ui-kit/Img/ImgAsPicture.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAIxC,MAAM,iBAAiB,GAAG,CAAC,CAAU,EAAE,CAAU,EAAE,EAAE;IACnD,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,EAAE;QACtB,OAAO,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC;KAC1B;IAED,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAC7B,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,cAAc,GAAG,EAAE,EAAE,QAAQ,GAAG,KAAK,EAAE,EAAE,EAAE;IACnE,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,IAAI,CAAC;KACb;IAED,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC;IAEtD,OAAO,CACL,mBAAS,SAAS,EAAE,GAAG,aAAa,IAAI,SAAS,EAAE,aAChD,KAAK,EAAE,OAAO,EAAE,MAAM;gBACrB,CAAC,CAAC,KAAK,CAAC,OAAO;qBACV,IAAI,CAAC,iBAAiB,CAAC;qBACvB,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,iBAEE,MAAM,EAAE,GAAG,EACX,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,EAC9B,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,eAAe,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,KACzC,IAAI,IAJH,GAAG,KAAK,IAAI,GAAG,EAAE,CAKtB,CACH,CAAC;gBACN,CAAC,CAAC,IAAI,EACP,SAAS,CAAC,KAAK,EAAE,cAAc,EAAE,QAAQ,CAAC,IACnC,CACX,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAAc,EAAE,cAAc,GAAG,EAAE,EAAE,QAAQ,GAAG,KAAK,EAAE,EAAE;IAC1E,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;IAChC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,CAAC;IACrC,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC;IAE7C,OAAO,CACL,cACE,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,SAAS,EAAE,GAAG,QAAQ,IAAI,cAAc,EAAE,EAC1C,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,KACR,KAAK,CAAC,IAAI,GACd,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,gBAAgB,CAAC,MAA2B;IAC1D,OAAO,MAAM,CAAC,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;AACxD,CAAC"}

package/mobile/lib/ui-kit/Img/ImgInner.d.ts

@@ -0,0 +1,2 @@
+import type { Image, ImageProps } from './ImgProps';
+export declare const ImgInner: (props: import("@redneckz/uni-jsx").PropsWithChildren<ImageProps<Image>, any>, context?: any) => any;

package/mobile/lib/ui-kit/Img/ImgInner.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { Icon } from '../Icon/Icon.js';
+import { getIconVersion } from './getIconVersion.js';
+import { ImgAsPicture } from './ImgAsPicture.js';
+export const ImgInner = JSX(({ className = '', image, imageClassName = '', isMobile, ...iconProps }) => {
+    if (!image) {
+        return null;
+    }
+    // backwards compatibility with existing icons in usage
+    const icon = typeof image === 'string' ? image : image.icon;
+    if (icon || icon === '') {
+        return icon.length ? (_jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: getIconVersion(image), name: icon, ...iconProps })) : null;
+    }
+    return (_jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, isMobile: isMobile }));
+});
+//# sourceMappingURL=ImgInner.js.map

package/mobile/lib/ui-kit/Img/ImgInner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImgInner.js","sourceRoot":"","sources":["../../../src/ui-kit/Img/ImgInner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CACzB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,cAAc,GAAG,EAAE,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IACzE,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,IAAI,CAAC;KACb;IAED,uDAAuD;IACvD,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;IAC5D,IAAI,IAAI,IAAI,IAAI,KAAK,EAAE,EAAE;QACvB,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CACnB,KAAC,IAAI,IACH,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,cAAc,CAAC,KAAK,CAAC,EAClC,IAAI,EAAE,IAAI,KACN,SAAS,GACb,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;KACV;IAED,OAAO,CACL,KAAC,YAAY,IACX,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,KAAgB,EACvB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/lib/ui-kit/Img/ImgProps.d.ts

@@ -7,4 +7,5 @@ export interface ImageContent<T = Picture> {
 export interface ImageProps<T> extends ImageContent<T>, IconCompatibilityFields {
     className?: string;
     imageClassName?: string;
+    isMobile?: boolean;
 }

package/mobile/lib/ui-kit/Logo/Logo.js

@@ -1,13 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
-import { SVG } from '../SVG.js';
-const LOGO_PATHS = [
-    'm13.72 25.51 4.42-4.33v-2.95l-4.42 4.32v2.96Zm0-10.98 4.42-4.35V7.41l-4.42 4.31v2.8Zm0 3.63 4.42-4.33v-2.78l-4.42 4.32v2.8ZM12.46 7.44l-.6-.56V0h-.66v6.22l-.58-.57V0h-.67v5l-.59-.58V0H8.7v6.56l4.44 4.33V0h-.67v7.44Zm1.26 14.35 4.42-4.33v-2.78L13.72 19v2.8Zm-5.03-.61 4.44 4.33v-2.96l-4.44-4.32v2.95Zm8.79-16.76-.59.58V0h-.66v5.66l-.6.56V0h-.66v6.87l-.58.57V0h-.67v10.9l4.42-4.34V0h-.66v4.42Zm-8.79 5.76 4.44 4.35v-2.8L8.69 7.4v2.77Zm0 3.65 4.44 4.33v-2.8l-4.44-4.3v2.77Zm0 3.63 4.44 4.33V19l-4.44-4.31v2.78Zm26.37 2.29H24.3a2.25 2.25 0 0 0 .36-1.22 2.32 2.32 0 0 0-2.33-2.31 2.32 2.32 0 0 0-2.31 2.31c0 .5.16.96.43 1.34a.74.74 0 0 0-.33.61c0 .26.14.49.33.62a2.32 2.32 0 0 0-.43 1.34 2.31 2.31 0 0 0 2.31 2.31 2.32 2.32 0 0 0 2.33-2.31c0-.45-.13-.87-.36-1.22h8.01v.49h-.8v.68h.8v.7h-.8v1.3h.8v-.58h1.17v.58h.79v-1.3h-.79v-.7h.79v-.68h-.79v-.5h1.58a.56.56 0 0 0 .56-.56v-.34a.57.57 0 0 0-.56-.56Zm-11.53 2.7a1.2 1.2 0 0 1-2.4 0c0-.24.08-.47.2-.66l.34-.56a.97.97 0 0 1-.34-.75c0-.3.13-.56.33-.74l-.32-.56a1.13 1.13 0 0 1-.2-.66 1.2 1.2 0 0 1 2.4 0c0 .49-.56 1.65-.56 1.65v.62c-.01.01.55 1.17.55 1.66ZM4.67 18.34v2.89c0 2.75 1.2 4.53 1.9 5.21l4.58 4.5c1.28 1.25 1.5 1.66 1.79 2.37v-3.2c0-2.84-1.44-3.94-2.19-4.67-1.73-1.68-2.89-2.8-3.82-3.73a8.98 8.98 0 0 1-2.26-3.37Zm6.08 14.24c-1.73-1.7-2.89-2.8-3.82-3.73a10 10 0 0 1-2.25-2.98v2.49a7.87 7.87 0 0 0 1.89 5.24l4.58 4.47c1.28 1.25 1.5 1.85 1.79 2.55v-3.37c0-2.85-1.45-3.95-2.19-4.67Z',
-    'M19.88 5.34c-.32 0-.64 0-.96.02V6.7a18.5 18.5 0 1 1 .95 36.94A18.5 18.5 0 0 1 1.35 25.17c0-5.67 2.55-10.73 6.58-14.13V9.32A19.78 19.78 0 0 0 0 25.17C0 36.12 8.9 45 19.88 45a19.85 19.85 0 0 0 19.86-19.83c0-10.95-8.9-19.83-19.87-19.83Z',
-    'M33.93 35.53c.3-.41.6-.85.87-1.3v-2.66h-.87v3.96Zm2.54-4.92c.12-.4.24-.78.34-1.16h-2.88v.7h.43c.77-.02 1.63-.03 2.11.46Zm-19.19-1.27h-.78v7.91h.78v-7.9Z',
-    'M14.7 27.83h2.58c.67 0 1.14.14 1.4.4.27.25.4.72.4 1.38v7.4c0 .66-.12 1.12-.4 1.38-.4.41-1.16.41-1.78.41l-.4-.01v3.5l.78.14v-2.88c1.2 0 1.97-.4 2.34-1.22v4.29h.26l.5-.01V29.74c0-.68.13-1.16.4-1.43.25-.27.72-.4 1.37-.4.67 0 1.65-.1 2.16.4.26.27.38.76.38 1.43v3.8h-1.77v-4.06h-.77v12.99c.26-.03.5-.07.77-.12V34.3h1.77v7.64c.36-.1.72-.21 1.08-.34v-7c0-.8.19-1.4 1-1.67l-.9-4.87h1.8l.3 5.31h.22l.3-5.31h1.88l-1.01 4.87c.84.3 1.01.81 1.01 1.66v4.53a16.63 16.63 0 0 0 1.5-1.27v-9.83h5.25l.1-.72H24.93l.17.89c-.38-.72-1.12-1.08-2.2-1.08h-.77c-1.3 0-2.1.52-2.4 1.55-.27-1.08-1.1-1.62-2.46-1.62h-3.36v14.52c.26.09.52.18.78.25V27.84Zm16.29 5.58-.85-.8.85-4.37v5.17Z',
-    'M27.66 40.79c.27-.14.55-.28.8-.43v-5.98h-.8v6.4Z',
-];
+import { Img } from '../Img/Img.js';
 const SVG_COLOR = {
     'bg-white': 'text-primary-main',
     transparent: 'text-white',
@@ -17,6 +10,6 @@ const TEXT_COLOR = {
     transparent: 'text-white',
 };
 export const Logo = JSX(({ className = '', href, children, targetBlank, bgColor = 'bg-white', hideTitle }) => {
-    return (_jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || 'https://rshb.ru/', target: targetBlank ? '_blank' : '_self', "aria-label": "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A", children: [_jsx(SVG, { className: `${SVG_COLOR[bgColor]} w-10 h-[38px]`, viewBox: "0 0 40 45", paths: LOGO_PATHS.map((d) => ({ d })) }), hideTitle ? null : (_jsx("span", { className: `${TEXT_COLOR[bgColor]} text-sm font-medium ml-2.5`, children: children || 'Россельхозбанк' }))] }));
+    return (_jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || 'https://rshb.ru/', target: targetBlank ? '_blank' : '_self', "aria-label": "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A", children: [_jsx(Img, { image: { icon: 'Logo' }, className: `${SVG_COLOR[bgColor]} w-10 h-[38px]`, asSVG: true }), hideTitle ? null : (_jsx("span", { className: `${TEXT_COLOR[bgColor]} text-sm font-medium ml-2.5`, children: children || 'Россельхозбанк' }))] }));
 });
 //# sourceMappingURL=Logo.js.map

package/mobile/lib/ui-kit/Logo/Logo.js.map

@@ -1 +1 @@
-{"version":3,"file":"Logo.js","sourceRoot":"","sources":["../../../src/ui-kit/Logo/Logo.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAU7B,MAAM,UAAU,GAAG;IACjB,w5CAAw5C;IACx5C,2OAA2O;IAC3O,0JAA0J;IAC1J,gpBAAgpB;IAChpB,kDAAkD;CACnD,CAAC;AACF,MAAM,SAAS,GAAmC;IAChD,UAAU,EAAE,mBAAmB;IAC/B,WAAW,EAAE,YAAY;CAC1B,CAAC;AACF,MAAM,UAAU,GAAmC;IACjD,UAAU,EAAE,YAAY;IACxB,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CACrB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,GAAG,UAAU,EAAE,SAAS,EAAE,EAAE,EAAE;IACnF,OAAO,CACL,aACE,SAAS,EAAE,mDAAmD,SAAS,EAAE,EACzE,IAAI,EAAE,IAAI,IAAI,kBAAkB,EAChC,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,gBAC7B,sFAAgB,aAE3B,KAAC,GAAG,IACF,SAAS,EAAE,GAAG,SAAS,CAAC,OAAO,CAAC,gBAAgB,EAChD,OAAO,EAAC,WAAW,EACnB,KAAK,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GACrC,EACD,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAClB,eAAM,SAAS,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,6BAA6B,YACjE,QAAQ,IAAI,gBAAgB,GACxB,CACR,IACC,CACL,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"Logo.js","sourceRoot":"","sources":["../../../src/ui-kit/Logo/Logo.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAUjC,MAAM,SAAS,GAAmC;IAChD,UAAU,EAAE,mBAAmB;IAC/B,WAAW,EAAE,YAAY;CAC1B,CAAC;AACF,MAAM,UAAU,GAAmC;IACjD,UAAU,EAAE,YAAY;IACxB,WAAW,EAAE,YAAY;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CACrB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,GAAG,UAAU,EAAE,SAAS,EAAE,EAAE,EAAE;IACnF,OAAO,CACL,aACE,SAAS,EAAE,mDAAmD,SAAS,EAAE,EACzE,IAAI,EAAE,IAAI,IAAI,kBAAkB,EAChC,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,gBAC7B,sFAAgB,aAE3B,KAAC,GAAG,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,OAAO,CAAC,gBAAgB,EAAE,KAAK,SAAG,EACvF,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAClB,eAAM,SAAS,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,6BAA6B,YACjE,QAAQ,IAAI,gBAAgB,GACxB,CACR,IACC,CACL,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.d.ts

@@ -0,0 +1,12 @@
+import { UniBlockProps } from '../../types';
+interface RadioButtonItem {
+    id: string;
+    text: string;
+}
+interface RadioButtonGroupProps extends UniBlockProps {
+    items: RadioButtonItem[];
+    checkedItem?: string;
+    onChangeCheckedItem: (id: string) => void;
+}
+export declare const RadioButtonGroup: (props: import("@redneckz/uni-jsx").PropsWithChildren<RadioButtonGroupProps, any>, context?: any) => any;
+export {};

package/mobile/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { Checkbox } from '../Checkbox/Checkbox.js';
+export const RadioButtonGroup = JSX(({ items, checkedItem, onChangeCheckedItem }) => {
+    return (_jsx("div", { children: items?.map(({ id, text }) => (_jsx(Checkbox, { isRadio: true, text: text, checked: checkedItem === id, onChange: () => onChangeCheckedItem(id) }, id))) }));
+});
+//# sourceMappingURL=RadioButtonGroup.js.map

package/mobile/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"","sources":["../../../src/ui-kit/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAahD,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CACjC,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,EAAE,EAAE;IAC9C,OAAO,CACL,wBACG,KAAK,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAC5B,KAAC,QAAQ,IAEP,OAAO,QACP,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,KAAK,EAAE,EAC3B,QAAQ,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,EAAE,CAAC,IAJlC,EAAE,CAKP,CACH,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/lib/ui-kit/SearchBar/SearchBar.js

@@ -1,11 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
-import { Img } from '../Img/Img.js';
-export const SearchBar = JSX(({ className, context }) => {
-    const { term, setTerm } = context.useSearch();
-    return (_jsxs("form", { className: `relative ${className || ''}`, children: [_jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [_jsx("div", { className: "w-[20px] h-[20px]", children: _jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (_jsx("label", { htmlFor: "search-bar-input", className: "font-sans font-normal text-sm text-secondary-text", children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), _jsx("input", { id: "search-bar-input", className: 'h-12 pl-12 w-full peer placeholder-transparent font-sans font-normal text-base text-black border border-solid rounded box-border outline-none pr-[6%] border-main-divider focus:border-primary-text', value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: "some search" }), _jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
-                    e.preventDefault();
-                    setTerm('');
-                }, children: _jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })] }));
+import { SearchBarInner } from './SearchBarInner.js';
+export const SearchBar = JSX(({ className = '', context }) => {
+    return _jsx(SearchBarInner, { context: context, className: className, isMobile: true });
 });
 //# sourceMappingURL=SearchBar.js.map

package/mobile/lib/ui-kit/SearchBar/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE;IACrE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;IAE9C,OAAO,CACL,gBAAM,SAAS,EAAE,YAAY,SAAS,IAAI,EAAE,EAAE,aAC5C,eAAK,SAAS,EAAC,yGAAyG,aACtH,cAAK,SAAS,EAAC,mBAAmB,YAChC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC5C,EACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACb,gBACE,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAC,mDAAmD,2FAGvD,CACT,IACG,EACN,gBACE,EAAE,EAAC,kBAAkB,EACrB,SAAS,EACP,qMAAqM,EAEvM,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACxC,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,kBAAkB,EACvB,WAAW,EAAC,aAAa,GACzB,EACF,iBACE,SAAS,EAAC,uHAAuH,EACjI,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,EAAE,CAAC,CAAC;gBACd,CAAC,YAED,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GACzC,IACJ,CACR,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IAC1E,OAAO,KAAC,cAAc,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,GAAI,CAAC;AACpF,CAAC,CAAC,CAAC"}

package/mobile/lib/ui-kit/SearchBar/SearchBarInner.d.ts

@@ -0,0 +1,5 @@
+import type { UniBlockProps } from '../../types';
+export interface SearchBarInnerProps extends UniBlockProps {
+    isMobile?: boolean;
+}
+export declare const SearchBarInner: (props: import("@redneckz/uni-jsx").PropsWithChildren<SearchBarInnerProps, any>, context?: any) => any;

package/mobile/lib/ui-kit/SearchBar/SearchBarInner.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { Button } from '../Button/Button.js';
+import { Img } from '../Img/Img.js';
+export const SearchBarInner = JSX(({ className, context, isMobile = false }) => {
+    const { term, setTerm } = context.useSearch();
+    const LoupeIconClassName = isMobile ? 'w-[20px] h-[20px]' : 'w-[24px] h-[24px]';
+    const SearchBarLabelClassName = isMobile ? 'font-normal text-sm' : 'font-light text-base';
+    const SearchBarInputClassName = isMobile
+        ? ' placeholder-transparent font-normal'
+        : 'font-light h-full';
+    const inputPlaceholder = isMobile ? 'some search' : null;
+    return (_jsxs("form", { className: `font-sans relative ${className}`, children: [_jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [_jsx("div", { className: LoupeIconClassName, children: _jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (_jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text ${SearchBarLabelClassName}`, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), _jsx("input", { id: "search-bar-input", className: `h-12 pl-12 w-full peer text-base text-black border border-solid rounded box-border
+              outline-none pr-[6%] border-main-divider focus:border-primary-text ${SearchBarInputClassName}`, value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: inputPlaceholder }), isMobile ? (_jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
+                    e.preventDefault();
+                    setTerm('');
+                }, children: _jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (_jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (e) => {
+                    e.preventDefault();
+                    console.log('click');
+                }, children: _jsx("div", { className: "font-normal text-sm px-9 py-[9px]", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
+});
+//# sourceMappingURL=SearchBarInner.js.map

package/mobile/lib/ui-kit/SearchBar/SearchBarInner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBarInner.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBarInner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAMjC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,EAAE,EAAE;IAC3C,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;IAE9C,MAAM,kBAAkB,GAAG,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAChF,MAAM,uBAAuB,GAAG,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,sBAAsB,CAAC;IAC1F,MAAM,uBAAuB,GAAG,QAAQ;QACtC,CAAC,CAAC,sCAAsC;QACxC,CAAC,CAAC,mBAAmB,CAAC;IACxB,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC;IAEzD,OAAO,CACL,gBAAM,SAAS,EAAE,sBAAsB,SAAS,EAAE,aAChD,eAAK,SAAS,EAAC,yGAAyG,aACtH,cAAK,SAAS,EAAE,kBAAkB,YAChC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC5C,EACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACb,gBACE,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAE,uBAAuB,uBAAuB,EAAE,2FAGrD,CACT,IACG,EACN,gBACE,EAAE,EAAC,kBAAkB,EACrB,SAAS,EAAE;mFAC8D,uBAAuB,EAAE,EAClG,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACxC,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,kBAAkB,EACvB,WAAW,EAAE,gBAAgB,GAC7B,EACD,QAAQ,CAAC,CAAC,CAAC,CACV,iBACE,SAAS,EAAC,uHAAuH,EACjI,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,EAAE,CAAC,CAAC;gBACd,CAAC,YAED,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GACzC,CACV,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,gCAAO,EACZ,SAAS,EAAC,qDAAqD,EAC/D,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBACvB,CAAC,YAED,cAAK,SAAS,EAAC,mCAAmC,+CAAY,GACvD,CACV,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/src/components/Calculator/BonusCalculatorForm.tsx

@@ -1,68 +1,60 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../../types';
+import { CommonCalculatorProps } from './CalculatorContent';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
-import { getDefaultSum } from './getDefaultSum';
-import { renderWantedSumInput } from './renderWantedSumInput';
-import { renderRate } from './renderRate';
+import { DEFAULT_REST_MIN_SUM, DEFAULT_TRAVEL_MIN_SUM } from './constants';
+import { Rate } from './Rate';
 import { renderButtonSection } from './renderButtonSection';
-import { BonusCalculatorParams, CommonCalculatorProps } from './CalculatorContent';
-
-export interface BonusCalculatorProp
-  extends BonusCalculatorParams,
-    CommonCalculatorProps,
-    UniBlockProps {}
+import { renderWantedSumInput } from './renderWantedSumInput';
+import { getBonusCalculatorParams } from './useBonusCalculatorParams';
 
-export const BonusCalculatorForm = JSX<BonusCalculatorProp>(
-  ({
-    context,
-    className = '',
-    buttons,
-    bonus,
-    minSumTrip,
-    maxSumTrip,
-    minSumOther,
-    maxSumOther,
-  }) => {
-    const [bonusTripValue, setBonusTripValue] = context.useState<number | undefined>(undefined);
-    const [bonusOtherValue, setBonusOtherValue] = context.useState<number | undefined>(undefined);
-    const calculatorTripParams = { minSum: minSumTrip, maxSum: maxSumTrip };
-    const calculatorOtherParams = { minSum: minSumOther, maxSum: maxSumOther };
+export interface BonusCalculatorProps extends CommonCalculatorProps, UniBlockProps {}
 
-    const incomeBonus = 948841;
-    const bonusOrDef = bonus || 2528;
+export const BonusCalculatorForm = JSX<BonusCalculatorProps>(
+  ({ context, className = '', sourceBookDir, buttons }) => {
+    const [travelExpenseValue, setTravelExpenseValue] = context.useState(DEFAULT_TRAVEL_MIN_SUM);
+    const [restExpenseValue, setRestExpenseValue] = context.useState(DEFAULT_REST_MIN_SUM);
+    const userInputParams = {
+      travelExpenseValue,
+      restExpenseValue,
+    };
+    const { minSumTravel, maxSumTravel, minSumOther, maxSumOther, monthBonus, yearBonus } =
+      getBonusCalculatorParams(context, userInputParams, sourceBookDir);
 
     return (
       <section className={className}>
         <div className="w-[468px]">
-          {renderWantedSumInput({
-            title: 'Сумма покупок в категории путешествия, ₽',
-            calculatorParams: calculatorTripParams,
-            moneyValue: bonusTripValue,
-            defaultSum: getDefaultSum(calculatorTripParams),
-            setMoneyValue: setBonusTripValue,
-            isShowItems: false,
-          })}
-          {renderWantedSumInput({
-            className: 'mt-6',
-            title: 'Сумма покупок в остальных категориях, ₽',
-            calculatorParams: calculatorOtherParams,
-            moneyValue: bonusOtherValue,
-            defaultSum: getDefaultSum(calculatorOtherParams),
-            setMoneyValue: setBonusOtherValue,
-            isShowItems: false,
-          })}
+          {renderWantedSumInput(
+            'Сумма покупок в категории путешествия, ₽',
+            {
+              minSum: minSumTravel,
+              maxSum: maxSumTravel,
+              moneyValue: travelExpenseValue,
+              step: 500,
+              isShowItems: false,
+            },
+            setTravelExpenseValue,
+          )}
+          {renderWantedSumInput(
+            'Сумма покупок в остальных категориях, ₽',
+            {
+              className: 'mt-6',
+              minSum: minSumOther,
+              maxSum: maxSumOther,
+              moneyValue: restExpenseValue,
+              step: 500,
+              isShowItems: false,
+            },
+            setRestExpenseValue,
+          )}
         </div>
         <div>
-          {bonusOrDef
-            ? renderRate({
-                rate: bonusOrDef,
-                title: 'Баллов за месяц',
-                className: 'tracking-[-14px]',
-              })
-            : null}
+          {monthBonus >= 0 ? (
+            <Rate title="Баллов за месяц" rate={monthBonus} rateBlockClassName="tracking-[-14px]" />
+          ) : null}
         </div>
         <div className="w-[240px]">
-          {incomeBonus ? <CalculatorValueBlock title="Баллов за год" value={incomeBonus} /> : null}
+          {yearBonus >= 0 ? <CalculatorValueBlock title="Баллов за год" value={yearBonus} /> : null}
           {renderButtonSection(context, buttons)}
         </div>
       </section>

package/mobile/src/components/Calculator/Calculator.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import type { FuncReturnVoid, UniBlockProps } from '../../types';
+import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderArrows } from '../../ui-kit/Button/renderArrows';
 import { Img } from '../../ui-kit/Img/Img';
 import type { CalculatorBlockDef, CalculatorContent, CalculatorNav } from './CalculatorContent';
@@ -23,9 +23,9 @@ type NavButtonProps = {
 };
 
 export const Calculator = JSX<CalculatorProps>(
-  ({ className = '', context, calcTabs = [], ...rest }) => {
-    const tabsNav = calcTabs.map((_) => _.nav || ({} as CalculatorNav));
-    const blockCalcTabs = calcTabs.map(
+  ({ className = '', context, calculatorTabs = [], ...rest }) => {
+    const tabsNav = calculatorTabs.map((_) => _.nav || ({} as CalculatorNav));
+    const calculatorBlocks = calculatorTabs.map(
       ({ calculatorBlock }) => calculatorBlock || ({} as CalculatorBlockDef),
     );
     const [activeSlideIndex, setActiveSlideIndex] = context.useState(0);
@@ -34,8 +34,8 @@ export const Calculator = JSX<CalculatorProps>(
     const handleNextClick = () => setTabsShift(tabsShift + 1);
     const handlePrevClick = () => setTabsShift(tabsShift - 1);
 
-    const isGalleryScrollAvailable = calcTabs?.length > 3;
-    const showNextButton = isGalleryScrollAvailable && calcTabs?.length > tabsShift + 3;
+    const isGalleryScrollAvailable = calculatorTabs?.length > 3;
+    const showNextButton = isGalleryScrollAvailable && calculatorTabs?.length > tabsShift + 3;
     const showPrevButton = tabsShift > 0;
 
     return (
@@ -60,8 +60,8 @@ export const Calculator = JSX<CalculatorProps>(
           style={{ transform: `translateX(-${activeSlideIndex}00%)` }}
           role="list"
         >
-          {blockCalcTabs?.length
-            ? blockCalcTabs.map(renderCalculatorBlock({ context, className }))
+          {calculatorBlocks?.length
+            ? calculatorBlocks.map(renderCalculatorBlock({ context, className }))
             : null}
         </div>
       </BlockWrapper>

package/mobile/src/components/Calculator/CalculatorContent.ts

@@ -5,6 +5,8 @@ import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 export interface CommonCalculatorProps {
   /** @title Кнопки */
   buttons?: ButtonWithIconProps[];
+  /** @title Адрес справочника */
+  sourceBookDir?: string;
 }
 
 /**
@@ -12,7 +14,9 @@ export interface CommonCalculatorProps {
  **/
 export interface CreditCalculatorParams {
   /** @hidden */
-  isSalary?: boolean;
+  isSalaryClient?: boolean;
+  /** @hidden */
+  isStateEmployee?: boolean;
   /** @hidden */
   isInsurance?: boolean;
   /** @hidden */
@@ -77,13 +81,19 @@ export interface BonusCalculatorParams {
   /** @hidden */
   bonus?: number;
   /** @hidden */
-  minSumTrip?: number;
+  minSumTravel?: number;
   /** @hidden */
-  maxSumTrip?: number;
+  maxSumTravel?: number;
   /** @hidden */
   minSumOther?: number;
   /** @hidden */
   maxSumOther?: number;
+  maxBonus?: number;
+  prefMonthsNum?: number;
+  prefTravelBonusRate?: number;
+  prefRestBonusRate?: number;
+  travelBonusRate?: number;
+  restBonusRate?: number;
 }
 
 /**
@@ -171,5 +181,5 @@ export interface CalculatorTab {
  */
 export interface CalculatorContent {
   /** @title Вкладки */
-  calcTabs?: CalculatorTab[];
+  calculatorTabs?: CalculatorTab[];
 }

package/mobile/src/components/Calculator/CreditCalculatorForm.tsx

@@ -1,78 +1,70 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCreditCalculatorData } from '../../hooks/useCreditCalculatorData';
 import type { UniBlockProps } from '../../types';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { CommonCalculatorProps } from './CalculatorContent';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
-import { DEFAULT_MAX_MONTHS, DEFAULT_MIN_MONTHS } from './constants';
-import { renderWantedSumInput } from './renderWantedSumInput';
-import { getCreditRate } from './getCreditRate';
-import { getCalculatorParams } from './getCalculatorParams';
-import { getDefaultSum } from './getDefaultSum';
-import { getDefaultMonths } from './getDefaultMonths';
-import { getMonthlyPayment } from './getMonthlyPayment';
-import { renderMonthsInput } from './renderMonthsInput';
+import { DEFAULT_MONTHS, DEFAULT_SUM } from './constants';
+import { Rate } from './Rate';
 import { renderButtonSection } from './renderButtonSection';
-import { renderRate } from './renderRate';
-import { CommonCalculatorProps, CreditCalculatorParams } from './CalculatorContent';
+import { renderMonthsInput } from './renderMonthsInput';
+import { renderPaymentTypeSelector } from './renderPaymentTypeSelector';
+import { renderWantedSumInput } from './renderWantedSumInput';
+import { getCreditCalculatorParams } from './useCreditCalculatorParams';
 
-const DEFAULT_PAYMENT_TYPE = 'annuity';
+export const ANNUITY = 'annuity';
+export const DIFFERENTIAL = 'differential';
 
-export interface CreditCalculatorProp
-  extends CreditCalculatorParams,
-    CommonCalculatorProps,
-    UniBlockProps {}
+const paymentTypeItems = [
+  {
+    id: ANNUITY,
+    text: 'Аннуитетный',
+  },
+  {
+    id: DIFFERENTIAL,
+    text: 'Дифференцированный',
+  },
+];
+
+export interface CreditCalculatorProp extends CommonCalculatorProps, UniBlockProps {}
 
 export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
-  ({ context, className = '', buttons }) => {
-    const [moneyValue, setMoneyValue] = context.useState<number | undefined>(undefined);
-    const [monthsValue, setMonthsValue] = context.useState<number | undefined>(undefined);
+  ({ context, className = '', sourceBookDir, buttons }) => {
     const [isAnnuity, toggleIsAnnuity] = context.useState(false);
-    const [isBudgetary, toggleIsBudgetary] = context.useState(false);
-    const [isInsurance, toggleIsInsurance] = context.useState(false);
-    const tableRows = useCreditCalculatorData(context.useAsyncData, 'directoryName').rows;
-    const calculatorParams = getCalculatorParams({ tableRows, isAnnuity: isAnnuity });
-
-    const defaultSum = getDefaultSum(calculatorParams);
-    const defaultMonths = getDefaultMonths(calculatorParams);
-
-    const minMonths = calculatorParams?.minMonths || DEFAULT_MIN_MONTHS;
-    const maxMonths = calculatorParams?.maxMonths || DEFAULT_MAX_MONTHS;
-
-    const rate = getCreditRate({ calculatorParams, isInsurance: isInsurance });
-
-    const monthlyPayment = getMonthlyPayment({
-      calculatorParams,
-      paymentType: DEFAULT_PAYMENT_TYPE,
-      rate,
-      sum: moneyValue || defaultSum,
-      months: monthsValue || defaultMonths,
-    });
-
-    const title = 'Сумма кредита, ₽';
+    const [isInsurance, toggleIsInsurance] = context.useState(true);
+    const [isSalaryClient, toggleIsSalaryClient] = context.useState(false);
+    const [isStateEmployee, toggleIsStateEmployee] = context.useState(false);
+    const [moneyValue, setMoneyValue] = context.useState(DEFAULT_SUM);
+    const [monthsValue, setMonthsValue] = context.useState(DEFAULT_MONTHS);
+    const userInputParams = {
+      isAnnuity,
+      isInsurance,
+      isSalaryClient,
+      isStateEmployee,
+      moneyValue,
+      monthsValue,
+    };
+    const calculatorParams = getCreditCalculatorParams(context, userInputParams, sourceBookDir);
 
     return (
       <section className={className}>
         <div className="w-[468px]">
-          {renderWantedSumInput({ title, calculatorParams, moneyValue, defaultSum, setMoneyValue })}
-          {renderMonthsInput({
-            title: 'Сумма кредита, ₽',
-            minMonths,
-            maxMonths,
-            monthsValue,
-            defaultMonths,
-            setMonthsValue,
-          })}
+          {renderWantedSumInput(
+            'Сумма кредита, ₽',
+            { ...calculatorParams, step: 500 },
+            setMoneyValue,
+          )}
+          {renderMonthsInput('Срок кредита, месяцев', calculatorParams, setMonthsValue)}
           <div className="pt-7">
             <Checkbox
               text="Получаю зарплату на счёт в Россельхозбанке"
-              checked={isAnnuity}
-              onChange={toggleIsAnnuity}
+              checked={isSalaryClient}
+              onChange={toggleIsSalaryClient}
             />
             <Checkbox
               className="mt-3"
               text="Работаю в бюджетной организации"
-              checked={isBudgetary}
-              onChange={toggleIsBudgetary}
+              checked={isStateEmployee}
+              onChange={toggleIsStateEmployee}
             />
             <Checkbox
               className="mt-3"
@@ -82,15 +74,23 @@ export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
             />
           </div>
         </div>
-        <div>
-          {rate
-            ? renderRate({ rate: rate, title: 'Ставка', sup: '%', className: 'tracking-[-25px]' })
-            : null}
-        </div>
+        <Rate
+          title="Ставка"
+          rate={calculatorParams.finalRate}
+          rateBlockClassName="tracking-[-25px]"
+          unit="%"
+        />
         <div className="w-[351px]">
-          {monthlyPayment ? (
-            <CalculatorValueBlock title="Ежемесячный платеж" value={monthlyPayment} postfix="₽" />
-          ) : null}
+          <CalculatorValueBlock
+            title={isAnnuity ? 'Ежемесячный платеж' : 'Платёж в первый месяц'}
+            value={calculatorParams.monthlyPayment}
+            postfix="₽"
+          />
+          {renderPaymentTypeSelector(context, {
+            items: paymentTypeItems,
+            checkedItem: isAnnuity ? ANNUITY : DIFFERENTIAL,
+            onChange: (text: string) => toggleIsAnnuity(text === ANNUITY),
+          })}
           {renderButtonSection(context, buttons)}
         </div>
       </section>