@redneckz/wildless-cms-uni-blocks 0.14.909 → 0.14.911

package/bundle/Env.d.ts

@@ -2,6 +2,8 @@ export interface Env {
     SITE_URL?: string;
     SUB_PORTALS?: string;
     MOBILE?: string;
+    SINGLE_SEARCH_INDEX?: string;
+    SEARCH_LANG?: string;
 }
 export declare const env: Env & {
     _: Env;

package/bundle/bundle.umd.js

@@ -1886,8 +1886,6 @@
         return debouncedCallback;
     };
 
-    const formatOption = (_) => _?.text || _?.key || '';
-
     function useEventListener(target, type, listener, options) {
         useEffect(() => {
             if (!target || !listener) {
@@ -1911,16 +1909,59 @@
         return targetRef;
     }
 
+    const InputWrapper = JSX(({ className, label, value = '', error, errors, type, isInteger, placeholder, maxLength, inputRef, isOpen, onOpen, onClose, onChange = noop, ...rest }) => {
+        const popupRef = useOutsideClick(onClose);
+        const handleChange = useCallback((v) => {
+            const isOverMax = maxLength && v.length > maxLength;
+            !isOpen && onOpen();
+            if (!isOverMax) {
+                onChange(normalizeInteger(v, isInteger));
+            }
+        }, [isOpen, onChange]);
+        return (jsxs("div", { className: style('shrink-0 w-full', className), ref: popupRef, onBlur: onClose, onFocus: onOpen, children: [jsx("div", { ref: inputRef, children: jsx(Input, { type: type || 'text', "aria-label": label, label: getRequiredLabel({ label, errors }), valid: Boolean(!error), onChange: handleChange, placeholder: getPlaceholder({ placeholder, errors, label }), value: value, ...rest }) }), renderErrorText(error)] }));
+    });
+    const normalizeInteger = (val = '', isInteger = false) => isInteger && val ? val.replace(/[^\d]+/g, '') : val;
+    const getPlaceholder = ({ placeholder, errors, label }) => errors && !label ? `${placeholder}*` : placeholder;
+
+    const InputControl = JSX((props) => {
+        const [isOpen, { setFalse: close, setTrue: open }] = useBool();
+        return jsx(InputWrapper, { isOpen: isOpen, onOpen: open, onClose: close, ...props });
+    });
+
+    const renderSearchInput = ({ query, isDisabled, onChangeQuery, inputProps, }) => (jsx("div", { className: "absolute top-0 w-full z-20", children: jsx(InputControl, { type: "text", value: query, autoFocus: true, disabled: isDisabled, onChange: (value) => onChangeQuery(value), maxLength: inputProps?.maxLength, isInteger: inputProps?.isInteger ?? false }) }));
+
+    const renderIcon$1 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-0 flex self-center', { 'rotate-180': !isOpen }), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
+
+    const formatOption = (_) => _?.text || _?.key || '';
+
+    const renderOptionText = ({ isManualInput, query, value, placeholder, }) => {
+        if (isManualInput && query) {
+            return query;
+        }
+        return formatOption(value) || placeholder;
+    };
+
+    const renderSelectContainer = ({ isBorder = true, valid = true, isDisabled = false, isOpen = false, onOpen, onClose, isManualInput = false, query = '', value, placeholder = '', iconVersion = 'black', options = [], }) => {
+        const isIconHidden = getIconHidden(isManualInput, options, query);
+        return (jsxs("div", { className: style({ 'border rounded-md': isBorder }, { 'hover:border-primary-hover': isBorder && !isDisabled }, isDisabled ? 'bg-main-divider' : 'cursor-pointer ', valid ? 'border-gray' : 'border-error', 'h-14 [&>*]:p-m pr-6 text-l flex items-center justify-between text-primary-text relative z-10 overflow-hidden'), onClick: isOpen ? onClose : onOpen, children: [jsx("p", { className: "line-clamp-2 text-ellipsis", children: renderOptionText({ isManualInput, query, value, placeholder }) }), isIconHidden ? '' : renderIcon$1(isOpen, iconVersion)] }));
+    };
+    const getIconHidden = (isManualInput, options, query) => {
+        if (isManualInput && query?.length) {
+            return true;
+        }
+        return isManualInput && !options.length;
+    };
+
     const usePopupManager = () => useEmitterWithActions(defaultEventBus.emitter, 'popup');
 
-    const filterOptions = (options, query) => {
-        if (!options?.length || !query?.trim()) {
+    const filterOptions = (options, query, disableFilterOptions) => {
+        if (!options?.length || !query?.trim() || disableFilterOptions) {
             return options;
         }
         return options.filter((_) => _.text?.toLocaleLowerCase().includes(query?.trim().toLocaleLowerCase()));
     };
 
-    const SelectPopup = JSX(({ popupRef, options, value, query, onChange, iconVersion, onChangeQuery }) => options?.length ? (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-2xl", role: "list", ref: popupRef, children: filterOptions(options, query).map((option) => (jsxs("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "listitem", "aria-selected": option.key === value?.key, onClick: (e) => {
+    const SelectPopup = JSX(({ popupRef, options, value, query, iconVersion, disableFilterOptions, onChange, onChangeQuery, }) => options?.length ? (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-2xl", role: "list", ref: popupRef, children: filterOptions(options, query, disableFilterOptions).map((option) => (jsxs("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "listitem", "aria-selected": option.key === value?.key, onClick: (e) => {
                 e.stopPropagation();
                 if (onChange) {
                     onChangeQuery?.('');
@@ -1930,16 +1971,16 @@
                         hidden: option.key !== value?.key,
                     }) })] }, option.key))) })) : null);
 
-    function useSelectPopup({ isOpen, options, value, query, onChange, onClose, iconVersion, onChangeQuery, }) {
+    function useSelectPopup({ isOpen, options, value, query, onChange = noop, onClose = noop, iconVersion, disableFilterOptions = false, onChangeQuery = noop, }) {
         const popup = usePopupManager();
         const close = useCallback(() => {
             popup.close();
-            onClose && onClose();
+            onClose();
         }, [onClose]);
         const handleChange = useCallback((option) => {
             close();
-            onChange && onChange(option);
-            onChangeQuery && onChangeQuery('');
+            onChange(option);
+            onChangeQuery('');
         }, [close, onChange]);
         const inputRef = useRef(null);
         const popupRef = useOutsideClick(close);
@@ -1950,7 +1991,7 @@
             const inputElement = inputRef.current;
             const { top, left, width, height } = inputElement.getBoundingClientRect();
             popup.open({
-                popup: (jsx(SelectPopup, { popupRef: popupRef, options: options, value: value, query: query, onChange: handleChange, iconVersion: iconVersion, onChangeQuery: onChangeQuery })),
+                popup: (jsx(SelectPopup, { popupRef: popupRef, options: options, value: value, query: query, iconVersion: iconVersion, disableFilterOptions: disableFilterOptions, onChange: handleChange, onChangeQuery: onChangeQuery })),
                 top: top + window.scrollY + height,
                 left,
                 width,
@@ -1959,56 +2000,47 @@
         return inputRef;
     }
 
-    const Select = JSX(({ className, label, options = [], value, valid = true, isBorder = true, placeholder = '', isSearch = false, isManualInput = false, disabled = false, iconVersion = 'black', onChange, onSearchQuery, }) => {
+    const Select = JSX(({ className, label, options = [], value, isSearch = false, isManualInput = false, disabled = false, iconVersion = 'black', onChange, onSearchQuery = noop, inputProps, disableFilterOptions = false, ...rest }) => {
         const [isOpen, { setFalse: close, setTrue: open }] = useBool();
         const [query, setQuery] = useState('');
-        const isDisabled = getDisabled(disabled, options.length, isManualInput);
-        const isIconHidden = getIconHidden(isManualInput, options);
-        const hasOpen = isOpen && !isDisabled;
-        const debouncedOnSearchQuery = useMemo(() => onSearchQuery && getDebouncedSearchQuery(onSearchQuery), [onSearchQuery]);
+        const isDisabled = disabled || (!isManualInput && options.length === 0);
+        const debouncedOnSearchQuery = useMemo(() => debounce((searchValue) => onSearchQuery(searchValue), 300), [onSearchQuery]);
         const handleOpen = useCallback(() => {
-            if (isDisabled) {
-                return;
-            }
-            open();
+            isDisabled ? noop() : open();
         }, [isDisabled]);
-        const handleChangeQuery = (newQuery) => {
-            setQuery(newQuery);
-            isManualInput && setOption(newQuery, onChange);
-            debouncedOnSearchQuery && debouncedOnSearchQuery(newQuery);
-        };
         const handleClose = useCallback(() => {
             !isManualInput && setQuery('');
             close();
-        }, []);
+        }, [isManualInput]);
+        const handleChangeQuery = useCallback((newQuery) => {
+            setQuery(newQuery);
+            isManualInput && onChange?.({ key: newQuery, text: newQuery, innDaData: {} });
+            debouncedOnSearchQuery?.(newQuery);
+        }, [isManualInput, onChange, debouncedOnSearchQuery]);
+        const selectState = { query, value, options, isOpen, iconVersion };
         const inputRef = useSelectPopup({
-            isOpen,
-            options,
-            value,
-            query,
             onChange,
             onClose: handleClose,
-            iconVersion,
+            disableFilterOptions,
             onChangeQuery: setQuery,
+            ...selectState,
         });
-        return (jsxs("div", { className: style('space-y-xs', className), children: [renderLabel$1(label), jsxs("div", { className: style('relative', hasOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('h-14 [&>*]:p-m pr-6 text-l flex items-center justify-between text-primary-text relative z-10 overflow-hidden', getStyle(isBorder, valid, isDisabled)), onClick: hasOpen ? handleClose : handleOpen, children: [jsx("p", { className: "line-clamp-2 text-ellipsis", children: useRenderOptionText({ isManualInput, query, value, placeholder }) }), isIconHidden ? '' : renderIcon$1(hasOpen, iconVersion)] }), isSearch && hasOpen ? renderSearchInput(query, isDisabled, handleChangeQuery) : null] })] }));
+        return (jsxs("div", { className: style('space-y-xs', className), children: [renderLabel$1(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [renderSelectContainer({
+                            isDisabled,
+                            onClose: handleClose,
+                            onOpen: handleOpen,
+                            isManualInput,
+                            ...selectState,
+                            ...rest,
+                        }), isSearch && isOpen
+                            ? renderSearchInput({
+                                query,
+                                isDisabled,
+                                inputProps,
+                                onChangeQuery: handleChangeQuery,
+                            })
+                            : null] })] }));
     });
-    const useRenderOptionText = (data) => useMemo(() => {
-        if (data.isManualInput && data.query) {
-            return data.query;
-        }
-        return formatOption(data.value) || data.placeholder;
-    }, [data.isManualInput, data.query, data.value, data.placeholder]);
-    const renderSearchInput = (query, isDisabled, onChangeQuery) => (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", value: query, autoFocus: true, disabled: isDisabled, onChange: (value) => onChangeQuery(value) }) }));
-    const renderIcon$1 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-0 flex self-center', { 'rotate-180': !isOpen }), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
-    const getStyle = (isBorder, valid, disabled) => style(isBorder ? 'border rounded-md ' : '', isBorder && !disabled ? 'hover:border-primary-hover' : '', disabled ? 'bg-main-divider' : 'cursor-pointer ', valid ? 'border-gray' : 'border-error');
-    // TODO Нужен рефактор и декомпозиция компонента getDisabled, setOption, getIconHidden
-    const getDisabled = (disabled, length, isManualInput) => disabled || (!isManualInput && length === 0);
-    const setOption = (query, onChange) => {
-        onChange && query.trim() !== '' && onChange({ key: query, text: query, innDaData: {} });
-    };
-    const getIconHidden = (isManualInput, options) => isManualInput && !options.length;
-    const getDebouncedSearchQuery = (onSearchQuery) => debounce((searchValue) => onSearchQuery(searchValue), 300);
 
     const SelectControl = JSX(({ className = '', label, error, errors, ...rest }) => (jsxs("div", { className: className, children: [jsx(Select, { ...rest, valid: !error, label: getRequiredLabel({ label, errors }) }), renderErrorText(error)] })));
 
@@ -2205,25 +2237,6 @@
     const ITEMS_CREDIT_AMOUNT = ['От 1 000 ₽', 'До 1 000 000 000 ₽'];
     const AmountField = JSX(({ field, input }) => (jsx(InputRange, { title: "\u0421\u0443\u043C\u043C\u0430, \u20BD", items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field(input?.name ?? '') })));
 
-    const InputWrapper = JSX(({ className, label, value = '', error, errors, type, isInteger, placeholder, maxLength, inputRef, isOpen, onOpen, onClose, onChange = noop, ...rest }) => {
-        const popupRef = useOutsideClick(onClose);
-        const handleChange = useCallback((v) => {
-            const isOverMax = maxLength && v.length > maxLength;
-            !isOpen && onOpen();
-            if (!isOverMax) {
-                onChange(normalizeInteger(v, isInteger));
-            }
-        }, [isOpen, onChange]);
-        return (jsxs("div", { className: style('shrink-0 w-full', className), ref: popupRef, onBlur: onClose, onFocus: onOpen, children: [jsx("div", { ref: inputRef, children: jsx(Input, { type: type || 'text', "aria-label": label, label: getRequiredLabel({ label, errors }), valid: Boolean(!error), onChange: handleChange, placeholder: getPlaceholder({ placeholder, errors, label }), value: value, ...rest }) }), renderErrorText(error)] }));
-    });
-    const normalizeInteger = (val = '', isInteger = false) => isInteger && val ? val.replace(/[^\d]+/g, '') : val;
-    const getPlaceholder = ({ placeholder, errors, label }) => errors && !label ? `${placeholder}*` : placeholder;
-
-    const InputControl = JSX((props) => {
-        const [isOpen, { setFalse: close, setTrue: open }] = useBool();
-        return jsx(InputWrapper, { isOpen: isOpen, onOpen: open, onClose: close, ...props });
-    });
-
     const AnnualRevenueField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...field(input?.name ?? '') })));
 
     const ApplicationDateField = JSX(({ field, input }) => (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(input?.name ?? '') })));
@@ -2638,7 +2651,7 @@
         inn: _?.data?.inn,
     }));
 
-    const InnDadataField = JSX(({ field, input }) => {
+    const InnDadataField = JSX(({ field, input = {} }) => {
         const [options, setOptions] = useState([]);
         const [searchQuery, setSearchQuery] = useState('');
         useAsyncEffect(async () => {
@@ -2656,7 +2669,10 @@
                 },
             }));
         }, [options]);
-        return (jsx(SelectControl, { label: "\u0418\u041D\u041D", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0418\u041D\u041D", options: getOptions, ...field(input?.name ?? ''), isSearch: true, isManualInput: true, onSearchQuery: setSearchQuery }));
+        return (jsx(SelectControl, { label: "\u0418\u041D\u041D", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0418\u041D\u041D", options: getOptions, ...field(input.name ?? ''), isSearch: true, isManualInput: true, inputProps: {
+                isInteger: true,
+                maxLength: 12,
+            }, disableFilterOptions: true, onSearchQuery: setSearchQuery }));
     });
 
     const InnField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0418\u041D\u041D", isInteger: true, maxLength: 12, ...input, ...field(input?.name ?? '') })));
@@ -10404,9 +10420,9 @@
     });
     const getCurrencyRates = (currencies) => currencies?.filter((_) => [1, 2, 3].includes(_?.currency?.id)) || [];
 
-    const LinkList = JSX(({ className = '', items }) => {
+    const LinkList = JSX(({ className = '', items, isFlex = true }) => {
         const link = useLink();
-        return (jsx("ul", { className: style('flex flex-col gap-s w-full', className), children: items?.map(renderLinkListItem(link)) }));
+        return (jsx("ul", { className: style(isFlex ? 'flex flex-col gap-s' : 'block', 'w-full', className), children: items?.map(renderLinkListItem(link)) }));
     });
     const renderLinkListItem = (link) => ({ dataFooter, ...linkProps }, i) => {
         const { text, href, target, onClick } = link(linkProps);
@@ -10419,9 +10435,12 @@
     const isVisibleItem = (areaKeys) => (_) => !_.displayArea || areaKeys.includes(_.displayArea.toLowerCase());
 
     const FOOTER_AREA_KEYS = ['all', 'footer'];
+    const IS_SINGLE_SEARCH_INDEX$1 = Boolean(env.SINGLE_SEARCH_INDEX);
     const Sitemap = JSX(({ className, navigationItems }) => {
         const link = useLink();
-        return (jsx("div", { role: "menu", className: style('w-full flex items-start justify-between flex-col md:flex-row gap-y-m lg:order-2', className), children: navigationItems?.filter(isVisibleItem(FOOTER_AREA_KEYS)).map(link).map(renderColumn) }));
+        const filteredItems = navigationItems?.filter(isVisibleItem(FOOTER_AREA_KEYS))?.map(link) ?? [];
+        const [firstItem] = filteredItems;
+        return (jsx("div", { className: "space-y-2", children: IS_SINGLE_SEARCH_INDEX$1 ? (jsx("div", { children: jsx(LinkList, { className: "columns-3 space-y-3 gap-x-6xl", items: firstItem?.items, isFlex: false }) })) : (jsx("div", { role: "menu", className: style('w-full flex items-start justify-between flex-col md:flex-row gap-y-m lg:order-2', className), children: filteredItems?.map(renderColumn) })) }));
     });
     const renderColumn = (menuItem, index) => {
         const { text, items = [], href, target = '_self', onClick, dataFooter } = menuItem;
@@ -10540,10 +10559,12 @@
     const sum = (list = []) => list.reduce((a, b) => a + b, 0);
 
     const MIN_TERM_LEN = 3;
+    const LANG = env.SEARCH_LANG;
     const tokenize = (text) => text
         .toLowerCase()
         .split(/[^0-9a-zа-я-]+/)
-        .filter((token) => token.length >= MIN_TERM_LEN && !/[0-9a-z]/.test(token));
+        .filter((token) => token.length >= MIN_TERM_LEN &&
+        (LANG === 'en' ? !/[а-яА-ЯёЁ0-9]/.test(token) : !/[0-9a-z]/.test(token)));
 
     const textRank = (queryTokens) => (text) => {
         const textTokens = tokenize(text || '');
@@ -10626,8 +10647,10 @@
         return (jsxs("div", { className: style('relative', className), role: "form", children: [jsx("div", { className: "absolute h-full flex items-center pl-m pointer-events-none", children: jsx(Img, { image: { icon: 'LoupeIcon', iconVersion: 'black' }, width: "24", height: "24" }) }), jsx("input", { className: style('h-14 w-full px-10 text-l text-black box-border rounded-md', inputValidStyle), value: value, type: "text", name: "search-bar-input", placeholder: placeholder, autoFocus: autoFocus, onChange: handleChange, onFocus: onFocus })] }));
     });
 
+    const IS_SINGLE_SEARCH_INDEX = Boolean(env.SINGLE_SEARCH_INDEX);
     const SearchDialog = JSX(({ initialQuery, navigationItems, onClose }) => {
-        const basePathList = useMemo(() => navigationItems?.map((_) => _.href || '/'), [navigationItems]);
+        const basePath = getBasePath(env.SITE_URL);
+        const basePathList = useMemo(() => (IS_SINGLE_SEARCH_INDEX ? [basePath] : navigationItems?.map((_) => _.href || '/')), [navigationItems]);
         const [searchResult, searchInputProps] = useSearch({
             basePathList,
             initialQuery,
@@ -11998,7 +12021,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.908";
+    const packageVersion = "0.14.910";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;