@redneckz/wildless-cms-uni-blocks 0.13.4 → 0.13.5

package/bundle/bundle.umd.js

@@ -685,7 +685,7 @@
         };
     };
 
-    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, }) => {
+    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, autoFocus = false, }) => {
         const handleChange = useCallback((e) => {
             onChange && onChange(e.target?.value || '');
         }, [onChange]);
@@ -693,7 +693,7 @@
         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", { className: style('w-full 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] }));
+        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", { className: style('w-full 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, autoFocus: autoFocus }, key)] }), children] }));
     });
 
     const InputControl = JSX(({ className, label, value = '', error, onChange, onBlur }) => (jsxs("div", { className: className, children: [jsx(Input, { type: "text", "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
@@ -717,7 +717,7 @@
         return (jsx(Input, { onChange: handleChange, onFocus: (event) => handleChange(event?.target?.value || ''), ...inputProps, children: children }));
     });
 
-    const PhoneInputControl = JSX(({ className, label, value, error, onChange, onBlur }) => (jsxs("div", { className: className, children: [jsx(PhoneInput, { "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
+    const PhoneInputControl = JSX(({ className, label, value, error, onChange, onBlur }) => (jsxs("div", { className: className, children: [jsx(PhoneInput, { "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur, placeholder: "+7 (___) ___-__-__" }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
 
     const pattern = (regexp) => validator((_) => typeof _ === 'string' && regexp.test(_));
 
@@ -776,6 +776,70 @@
         return targetRef;
     }
 
+    const JARO_WINKLER_P = 0.1;
+    const JARO_WINKLER_MAX_L = 4;
+    const jaroWinklerDistance = (s1) => (s2) => {
+        if (s1 === s2) {
+            return 1;
+        }
+        if (!s1 || !s2) {
+            return 0;
+        }
+        const { m, s1Matches, s2Matches } = computeM(s1, s2);
+        if (m === 0) {
+            return 0;
+        }
+        const t = computeT(s1, s2, { s1Matches, s2Matches });
+        const jaroWeight = (m / s1.length + m / s2.length + (m - t / 2) / m) / 3;
+        const winklerWeight = jaroWeight > 0.7 ? computePrefixL(s1, s2) * JARO_WINKLER_P : 0;
+        return jaroWeight + winklerWeight * (1 - jaroWeight);
+    };
+    function computeM(s1, s2) {
+        const range = Math.max(0, Math.floor(Math.max(s1.length, s2.length) / 2) - 1);
+        const s1Matches = new Array(s1.length);
+        const s2Matches = new Array(s2.length);
+        let m = 0;
+        for (let i = 0; i < s1.length; i++) {
+            const low = Math.max(0, i - range);
+            const high = Math.min(i + range, s2.length - 1);
+            for (let j = low; j <= high; j++) {
+                if (s1Matches[i] || s2Matches[j] || s1[i] !== s2[j]) {
+                    continue;
+                }
+                m++;
+                s1Matches[i] = true;
+                s2Matches[j] = true;
+            }
+        }
+        return { m, s1Matches, s2Matches };
+    }
+    function computeT(s1, s2, { s1Matches, s2Matches }) {
+        let t = 0;
+        for (let i = 0, k = 0; i < s1.length; i++) {
+            if (!s1Matches[i]) {
+                continue;
+            }
+            let j = k;
+            for (; j < s2.length; j++) {
+                if (s2Matches[j]) {
+                    k = j + 1;
+                    break;
+                }
+            }
+            if (s1[i] !== s2[j]) {
+                t++;
+            }
+        }
+        return t;
+    }
+    function computePrefixL(s1, s2) {
+        let prefixL = 0;
+        while (s1[prefixL] === s2[prefixL] && prefixL < JARO_WINKLER_MAX_L) {
+            prefixL++;
+        }
+        return prefixL;
+    }
+
     const svgUseStyleMap = {
         normal: '',
         color: 'text-primary-main',
@@ -796,16 +860,28 @@
     const getSvgSize = (width) => (width ? '' : 'w-full h-full');
     const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
 
-    const Select = JSX(({ className = '', label, options = [], value, valid = true, isBorder = true, placeholder = '', onChange, }) => {
+    const Select = JSX(({ className = '', label, options = [], value, valid = true, isBorder = true, placeholder = '', onChange, isSearch = false, }) => {
         const [isOpen, { setFalse: close, toggle }] = useBool();
-        const wrapperRef = useOutsideClick(close);
-        const handleChange = useCallback((option) => {
+        const [searchValue, setSearchValue] = useState('');
+        const reset = useCallback(() => {
             close();
+            setSearchValue('');
+        }, []);
+        const wrapperRef = useOutsideClick(reset);
+        const handleChange = useCallback((option) => {
+            reset();
             onChange && onChange(option);
         }, [onChange]);
         const isSelected = (option) => option.key === value?.key;
-        return (jsxs("div", { className: className, ref: wrapperRef, children: [label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", color: "text-primary-text", font: "font-light", children: label }) })) : null, jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), children: [jsxs("div", { className: style('text-l flex justify-between items-center text-primary-text cursor-pointer', getBorderStyle(isBorder, valid)), onClick: toggle, children: [jsx("p", { className: "p-m pr-3xl h-14 overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), name: "ArrowUpIcon", width: "16", height: "16" })] }), options?.length ? (jsx("div", { className: style('h-0', isOpen ? '' : 'overflow-hidden'), children: jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: options.map(renderOption(handleChange, isOpen, isSelected)) }) })) : null] })] }));
+        return (jsxs("div", { className: className, ref: wrapperRef, children: [renderLabel(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), children: [jsxs("div", { className: style('text-l flex justify-between items-center text-primary-text cursor-pointer relative z-10', getBorderStyle(isBorder, valid)), onClick: toggle, children: [jsx("p", { className: "p-m pr-3xl h-14 overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), name: "ArrowUpIcon", width: "16", height: "16" })] }), isSearch ? renderSearch(isOpen, searchValue, setSearchValue) : null, options?.length ? (jsx("div", { className: style('h-0', isOpen ? '' : 'overflow-hidden'), children: jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: getFilteredOptions(options, searchValue).map(renderOption(handleChange, isOpen, isSelected)) }) })) : null] })] }));
     });
+    const renderLabel = (label) => label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", color: "text-primary-text", font: "font-light", children: label }) })) : null;
+    const getFilteredOptions = (options, searchValue) => {
+        return searchValue
+            ? options.filter((_) => jaroWinklerDistance(_.text?.toLowerCase())(searchValue.toLowerCase()) >= 0.6)
+            : options;
+    };
+    const renderSearch = (isOpen, searchValue, setSearchValue) => isOpen ? (jsx("div", { className: style('absolute top-0 w-full h-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: searchValue, onChange: setSearchValue }) })) : null;
     const renderOption = (handleChange, isOpen, isSelected) => (option, i) => (jsxs("div", { onClick: () => {
             handleChange(option);
         }, className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", children: [jsx("span", { className: "min-h-6", children: formatOption(option) }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: style('absolute right-4 pt-3xs', isSelected(option) && isOpen ? '' : 'hidden') })] }, String(i)));
@@ -867,7 +943,7 @@
 
     const renderBusinessCardDataOrganization = (field) => (jsxs("div", { className: "sm:flex sm:justify-between sm:gap-lg", children: [jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) })] }), jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })] })] }));
 
-    const renderRegion$1 = ({ regions, field }) => (jsx(SelectControl, { className: "w-full", label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }));
+    const renderRegion$1 = ({ regions, field }) => (jsx(SelectControl, { className: "w-full", label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }));
 
     const initialFormState$3 = {
         name: '',
@@ -919,7 +995,7 @@
     const MAX_CREDIT_TERM = 180;
     const ITEMS_CREDIT_TERM = ['От 1 мес', 'До 15 лет'];
 
-    const renderCreditDataOrganization = (field) => (jsxs("div", { className: "pb-2xs border-b border-b-main-divider sm:flex sm:justify-between sm:gap-lg sm:border-none sm:pb-0", children: [jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", 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') }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...withValidator(field('annualRevenue'), defaultValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...field('mail') })] })] }));
+    const renderCreditDataOrganization = (field) => (jsxs("div", { className: "pb-2xs border-b border-b-main-divider sm:flex sm:justify-between sm:gap-lg sm:border-none sm:pb-0", children: [jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", 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, { className: "shrink-0 w-full", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "sm:w-1/2 space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...withValidator(field('annualRevenue'), defaultValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...field('mail') })] })] }));
 
     const useNormalizedInput = (props, { normalize, format }) => {
         const { value, onFocus, onBlur, onChange } = props;
@@ -982,9 +1058,9 @@
     const closestValue = (list) => (_) => list.reduce((prev, curr) => (Math.abs(curr - _) < Math.abs(prev - _) ? curr : prev));
     const renderRangeCaption = (items) => (jsx("div", { className: "flex justify-between my-xs", children: items.map((item, i) => (jsx(Text, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item }, String(i)))) }));
 
-    const renderCreditParameters = (field) => (jsxs("div", { className: "border-b border-b-main-divider sm:flex sm:justify-between gap-lg sm:border-none", children: [jsxs("div", { className: "sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0443\u043C\u043C\u0430 \u043A\u0440\u0435\u0434\u0438\u0442\u0430, \u20BD" }) }), jsx(InputRange, { items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field('amount') })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0440\u043E\u043A \u043A\u0440\u0435\u0434\u0438\u0442\u0430, \u043C\u0435\u0441\u044F\u0446\u0435\u0432" }) }), jsx(InputRange, { items: ITEMS_CREDIT_TERM, min: MIN_CREDIT_TERM, max: MAX_CREDIT_TERM, ...field('term') })] })] }));
+    const renderCreditParameters = (field) => (jsxs("div", { className: "border-b border-b-main-divider sm:flex sm:justify-between gap-lg sm:border-none", children: [jsxs("div", { className: "sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0443\u043C\u043C\u0430, \u20BD" }) }), jsx(InputRange, { items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field('amount') })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0440\u043E\u043A, \u043C\u0435\u0441\u044F\u0446\u0435\u0432" }) }), jsx(InputRange, { items: ITEMS_CREDIT_TERM, min: MIN_CREDIT_TERM, max: MAX_CREDIT_TERM, ...field('term') })] })] }));
 
-    const renderRegionDepartment = ({ regions, branches, field }) => (jsxs("div", { className: "sm:flex sm:justify-between sm:gap-m sm:mb-2xl sm:border-none sm:pb-0", children: [jsx("div", { className: "sm:w-1/2", children: jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) }), jsx("div", { className: "sm:w-1/2", children: 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 renderRegionDepartment = ({ regions, branches, field }) => (jsxs("div", { className: "sm:flex sm:justify-between sm:gap-m sm:mb-2xl sm:border-none sm:pb-0", children: [jsx("div", { className: "sm:w-1/2", children: jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) }), jsx("div", { className: "sm:w-1/2", children: 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 = '' }) => ({
                         key: branchCode,
                         text: address,
                     })), ...withValidator(field('department'), defaultValidator) }) })] }));
@@ -1000,6 +1076,7 @@
         annualRevenue: '',
     };
     const creditValidator = objectValidator({
+        fullName: defaultValidator,
         annualRevenue: defaultValidator,
         inn: innValidator,
         name: nameValidator,
@@ -1026,7 +1103,7 @@
         const [formState, { field, ...formProps }] = useForm(initialFormState$2, handleSubmit);
         const regions = useGetRegions();
         const branches = useBranches(formState.region?.key).filter((branch) => branch?.address);
-        return (jsxs("form", { className: "container space-y-m", onSubmit: formProps.onSubmit, children: [jsx(Heading, { headingType: "h6", title: "\u041F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u044B \u043A\u0440\u0435\u0434\u0438\u0442\u0430", className: "sm:text-center" }), renderCreditParameters(field), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "sm:text-center" }), renderCreditDataOrganization(field), jsx(Heading, { headingType: "h6", title: "\u041E\u0444\u0438\u0441 \u0431\u0430\u043D\u043A\u0430", className: "sm:text-center" }), renderRegionDepartment({ regions, branches, field }), renderSubmitButton(button), jsx(Footnote, { link: link })] }));
+        return (jsxs("form", { className: "container space-y-m", onSubmit: formProps.onSubmit, children: [jsx(Heading, { headingType: "h6", title: "\u041F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u044B", className: "sm:text-center" }), renderCreditParameters(field), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "sm:text-center" }), renderCreditDataOrganization(field), jsx(Heading, { headingType: "h6", title: "\u041E\u0444\u0438\u0441 \u0431\u0430\u043D\u043A\u0430", className: "sm:text-center" }), renderRegionDepartment({ regions, branches, field }), renderSubmitButton(button), jsx(Footnote, { link: link })] }));
     });
 
     const initialFormState$1 = {
@@ -1277,7 +1354,7 @@
         },
         XS: {
             title: { headingType: 'h5', as: 'h2' },
-            descriptionSize: 'text-l',
+            descriptionSize: 'text-m',
             descriptionWeight: 'font-light',
             descriptionStyle: 'mt-xs',
         },
@@ -2416,13 +2493,21 @@
     const renderCardHighlight = ({ className, text = 'ХИТ' } = {}) => (jsxs("div", { className: style('w-14 h-14 bg-white flex flex-col items-center justify-center rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]', className), children: [jsx(Icon, { iconVersion: "black", name: "HeartIcon", width: "24", height: "24" }), jsx(Paragraph, { size: "text-s", font: "font-normal", align: "text-center", color: "text-primary-text", children: text })] }));
 
     const cardBaseStyle = 'relative h-full';
-    const renderCarouselCards = ({ noCardBorder, activeIndex, ...rest }) => {
+    const CARD_SIZE_MAP = {
+        normal: 'sm:min-w-96',
+        big: 'sm:min-w-[515px]',
+    };
+    const renderCarouselCards = ({ noCardBorder, activeIndex, cardSize = 'normal', ...rest }) => {
         const { blocks: childBlocks } = rest.block || {};
         const someCardsHighlighted = childBlocks?.some(isCardHighlighted);
         return renderChildren({
             ...rest,
             renderProps: (block, options, blockIndex) => (jsxs("div", { className: cardWrapperStyle(block, { someCardsHighlighted }), children: [renderBlock$1(block, options, {
-                        className: cardStyle(block, { someCardsHighlighted, showBorder: !noCardBorder }),
+                        className: cardStyle(block, {
+                            someCardsHighlighted,
+                            showBorder: !noCardBorder,
+                            cardSize,
+                        }),
                         blockIndex,
                         isActive: blockIndex === activeIndex,
                     }), isCardHighlighted(block)
@@ -2431,11 +2516,12 @@
         });
     };
     const cardWrapperStyle = (_, { someCardsHighlighted }) => style(cardBaseStyle, someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl' : 'pt-3xl sm:pt-16'));
-    const cardStyle = (_, { someCardsHighlighted, showBorder }) => style(cardBaseStyle, 'min-w-80 sm:min-w-96', someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl sm:pt-16' : 'pt-3xl'), showBorder &&
+    const cardStyle = (_, { someCardsHighlighted, showBorder, cardSize = 'normal', }) => style(cardBaseStyle, 'min-w-80', CARD_SIZE_MAP[cardSize], // TODO fix для RecommendationCard
+    someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl sm:pt-16' : 'pt-3xl'), showBorder &&
         'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider');
     const isCardHighlighted = (_) => _?.content && 'isHighlighting' in _.content && _.content.isHighlighting;
 
-    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, showDots, arrowsPadded = true, isGap = true, ...rest }) => {
+    const Carousel = JSX(({ className, itemCount, visibleItemCount = 0, noCardBorder, isAlignCenter, showDots, arrowsPadded = true, isGap = true, cardSize = 'normal', ...rest }) => {
         const { blocks: childBlocks = [] } = rest.block || {};
         const count = itemCount || childBlocks?.length;
         const [activeIndex, { inc: increaseActiveIndex, dec: decreaseActiveIndex }] = useCarouselControls({
@@ -2446,7 +2532,7 @@
         const [dotsActiveIndex] = scroll.visibleIndicesRange;
         // TODO Remove
         const isBankHistoryCarousel = childBlocks && childBlocks[0]?.type === 'CarouselBankHistoryCard';
-        return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })) : null] }) }));
+        return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: style(isAlignCenter ? 'flex justify-center' : '', 'relative max-w-full'), children: [jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: visibleItemCount, snapAlign: "snap-start", gap: isGap ? ITEMS_GAP : undefined, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, children: renderCarouselCards({ noCardBorder, activeIndex, cardSize, ...rest }) }), jsx(CarouselScrollButtons, { scroll: scroll, arrowsPadded: arrowsPadded, onScrollLeft: decreaseActiveIndex, onScrollRight: increaseActiveIndex, hasEdgeBlocks: isBankHistoryCarousel, activeIndex: activeIndex, itemCount: count }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: dotsActiveIndex, dotCount: count, listType: "horizontal-list" })) : null] }) }));
     });
     Carousel.childrenTypes = [
         'CarouselCard',
@@ -2511,7 +2597,7 @@
     const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col gap-3xl font-sans overflow-hidden', padding || defaultPadding, className), children: [title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: "grow relative flex flex-wrap @xl:flex-nowrap justify-around @xl:justify-between items-stretch gap-3xl", children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('flex flex-col gap-3xl max-w-[600px] @xl:max-w-[728px]', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), backImage ? (jsx("div", { className: "mx-auto sm:absolute sm:-z-10 sm:-bottom-4 sm:-right-4", children: backImage })) : null, buttons] }), renderImageContainer(rightImage, { className: '-order-1 @xl:order-1', imageAlign })] })] })));
     const renderImageContainer = (image, { className, imageAlign }) => {
         //TODO Спорное решение
-        const fullWidth = image?.props?.image.size?.width > 400;
+        const fullWidth = image?.props?.image?.size?.width > 400;
         return image ? (jsx("div", { className: style('flex-shrink-0', fullWidth ? 'w-full @xl:w-auto' : '', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
     };
 
@@ -2535,7 +2621,7 @@
     const CarouselLinks = JSX(({ className, additionalDescription, description, links, title, maxLinksCount = 10, ...rest }) => (jsxs(BlockWrapper, { className: style('flex flex-col sm:flex-row w-full overflow-hidden', className), ...rest, children: [jsxs("div", { className: "mr-xl flex-auto", children: [jsx(Headline, { isEmbedded: true, title: title, description: description, as: "h1", align: "text-left" }), additionalDescription ? (jsx(Headline, { className: "pt-m", description: additionalDescription, align: "text-left", isEmbedded: true })) : null] }), links?.length ? renderLinks(links, maxLinksCount) : null] })));
     const renderLinks = (links, maxLinksCount) => {
         const itemCount = Math.ceil(links.length / maxLinksCount);
-        return (jsx(Carousel, { className: "sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, showDots: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
+        return (jsx(Carousel, { className: "@container-normal sm:w-2/3 w-full p-0 sm:p-xs", version: "secondary", itemCount: itemCount, arrowsPadded: false, showDots: false, children: new Array(itemCount).fill(null).map((_, groupIndex) => (jsx("div", { className: style('flex flex-wrap self-start w-full sm:w-[672px]'), children: links
                     .slice(groupIndex * maxLinksCount, (groupIndex + 1) * maxLinksCount)
                     .map((link, index) => (jsx(CarouselLinkButton, { className: "sm:m-2xs", ...link }, String(index)))) }, String(groupIndex)))) }));
     };
@@ -2544,15 +2630,18 @@
         L: 'w-1.5 h-1.5 mr-m',
         M: 'w-1.5 h-1.5 mr-s',
         S: 'w-1 h-1 mr-xs',
+        XS: 'w-1 h-1 mr-xs',
     };
     const ListItem = JSX(({ className, isDotted = true, children, size = 'M' }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full bg-primary-text group-data-secondary:bg-white', DOT_SIZE_MAP[size]) }) })) : null, jsx("span", { children: children })] })));
 
     const TEXT_SIZE_MAP = {
+        XS: 'text-m font-light',
         S: 'text-l font-light',
         M: 'text-h6',
         L: 'text-h5',
     };
     const ITEM_INDENT_MAP = {
+        XS: 'ml-2xs',
         S: 'ml-xs',
         M: 'ml-s',
         L: 'ml-m',
@@ -3194,70 +3283,6 @@
         return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
     }
 
-    const JARO_WINKLER_P = 0.1;
-    const JARO_WINKLER_MAX_L = 4;
-    const jaroWinklerDistance = (s1) => (s2) => {
-        if (s1 === s2) {
-            return 1;
-        }
-        if (!s1 || !s2) {
-            return 0;
-        }
-        const { m, s1Matches, s2Matches } = computeM(s1, s2);
-        if (m === 0) {
-            return 0;
-        }
-        const t = computeT(s1, s2, { s1Matches, s2Matches });
-        const jaroWeight = (m / s1.length + m / s2.length + (m - t / 2) / m) / 3;
-        const winklerWeight = jaroWeight > 0.7 ? computePrefixL(s1, s2) * JARO_WINKLER_P : 0;
-        return jaroWeight + winklerWeight * (1 - jaroWeight);
-    };
-    function computeM(s1, s2) {
-        const range = Math.max(0, Math.floor(Math.max(s1.length, s2.length) / 2) - 1);
-        const s1Matches = new Array(s1.length);
-        const s2Matches = new Array(s2.length);
-        let m = 0;
-        for (let i = 0; i < s1.length; i++) {
-            const low = Math.max(0, i - range);
-            const high = Math.min(i + range, s2.length - 1);
-            for (let j = low; j <= high; j++) {
-                if (s1Matches[i] || s2Matches[j] || s1[i] !== s2[j]) {
-                    continue;
-                }
-                m++;
-                s1Matches[i] = true;
-                s2Matches[j] = true;
-            }
-        }
-        return { m, s1Matches, s2Matches };
-    }
-    function computeT(s1, s2, { s1Matches, s2Matches }) {
-        let t = 0;
-        for (let i = 0, k = 0; i < s1.length; i++) {
-            if (!s1Matches[i]) {
-                continue;
-            }
-            let j = k;
-            for (; j < s2.length; j++) {
-                if (s2Matches[j]) {
-                    k = j + 1;
-                    break;
-                }
-            }
-            if (s1[i] !== s2[j]) {
-                t++;
-            }
-        }
-        return t;
-    }
-    function computePrefixL(s1, s2) {
-        let prefixL = 0;
-        while (s1[prefixL] === s2[prefixL] && prefixL < JARO_WINKLER_MAX_L) {
-            prefixL++;
-        }
-        return prefixL;
-    }
-
     const joinMaps = (aggregate, emptyVal) => (acc, map) => {
         for (const [key, b] of map) {
             acc.set(key, aggregate(acc.get(key) || emptyVal, b));
@@ -5190,7 +5215,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.13.4";
+    const packageVersion = "0.13.5";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;