@redneckz/wildless-cms-uni-blocks 0.14.5 → 0.14.7

package/mobile/lib/ui-kit/Pagination/shouldRenderPage.js

@@ -0,0 +1,6 @@
+const checkPageRange = (page, currentPage, totalPages) => (currentPage <= 3 && page <= currentPage + 3) ||
+    (currentPage >= totalPages - 1 && page >= totalPages - 4);
+export const shouldRenderPage = (page, currentPage, totalPages) => (page < currentPage && page >= currentPage - 2) ||
+    (page <= currentPage + 2 && page > currentPage) ||
+    checkPageRange(page, currentPage, totalPages);
+//# sourceMappingURL=shouldRenderPage.js.map

package/mobile/lib/ui-kit/Pagination/shouldRenderPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shouldRenderPage.js","sourceRoot":"","sources":["../../../src/ui-kit/Pagination/shouldRenderPage.ts"],"names":[],"mappings":"AAAA,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,WAAmB,EAAE,UAAkB,EAAE,EAAE,CAC/E,CAAC,WAAW,IAAI,CAAC,IAAI,IAAI,IAAI,WAAW,GAAG,CAAC,CAAC;IAC7C,CAAC,WAAW,IAAI,UAAU,GAAG,CAAC,IAAI,IAAI,IAAI,UAAU,GAAG,CAAC,CAAC,CAAC;AAE5D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,WAAmB,EAAE,UAAkB,EAAE,EAAE,CACxF,CAAC,IAAI,GAAG,WAAW,IAAI,IAAI,IAAI,WAAW,GAAG,CAAC,CAAC;IAC/C,CAAC,IAAI,IAAI,WAAW,GAAG,CAAC,IAAI,IAAI,GAAG,WAAW,CAAC;IAC/C,cAAc,CAAC,IAAI,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC"}

package/mobile/lib/ui-kit/Select/filterOptions.js

@@ -1,16 +1,7 @@
-import { compareBy, desc } from '../../utils/Comparator.js';
-import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance.js';
-import { zip } from '../../utils/zip.js';
 export const filterOptions = (options, query) => {
     if (!options?.length || !query?.trim()) {
         return options;
     }
-    const ranking = options
-        .map((_) => _.text?.toLowerCase())
-        .map(jaroWinklerDistance(query?.trim().toLowerCase()));
-    return zip(options, ranking)
-        .filter(([, rank]) => rank >= 0.5)
-        .sort(desc(compareBy(([, rank]) => rank)))
-        .map(([option]) => option);
+    return options.filter((_) => _.text?.toLocaleLowerCase().includes(query?.trim().toLocaleLowerCase()));
 };
 //# sourceMappingURL=filterOptions.js.map

package/mobile/lib/ui-kit/Select/filterOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"filterOptions.js","sourceRoot":"","sources":["../../../src/ui-kit/Select/filterOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AACtE,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAGtC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,OAAiB,EAAE,KAAyB,EAAY,EAAE;IACtF,IAAI,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACtC,OAAO,OAAO,CAAC;KAChB;IAED,MAAM,OAAO,GAAG,OAAO;SACpB,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,WAAW,EAAE,CAAC;SACjC,GAAG,CAAC,mBAAmB,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAC,OAAO,EAAE,OAAO,CAAC;SACzB,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,IAAI,IAAI,GAAG,CAAC;SACjC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;SACzC,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC;AAC/B,CAAC,CAAC"}
+{"version":3,"file":"filterOptions.js","sourceRoot":"","sources":["../../../src/ui-kit/Select/filterOptions.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,OAAiB,EAAE,KAAyB,EAAY,EAAE;IACtF,IAAI,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACtC,OAAO,OAAO,CAAC;KAChB;IAED,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,iBAAiB,EAAE,CAAC,QAAQ,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAA;AACvG,CAAC,CAAC"}

package/mobile/lib/utils/convertTimestampToDate.d.ts

@@ -0,0 +1 @@
+export declare const convertTimestampToDate: (timestamp: number) => string;

package/mobile/lib/utils/convertTimestampToDate.js

@@ -0,0 +1,13 @@
+export const convertTimestampToDate = (timestamp) => {
+    const date = new Date(timestamp * 1000);
+    let dd = date.getDate();
+    if (dd < 10) {
+        dd = '0' + dd;
+    }
+    let mm = date.getMonth() + 1;
+    if (mm < 10) {
+        mm = '0' + mm;
+    }
+    return dd + '.' + mm + '.' + date.getFullYear();
+};
+//# sourceMappingURL=convertTimestampToDate.js.map

package/mobile/lib/utils/convertTimestampToDate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertTimestampToDate.js","sourceRoot":"","sources":["../../src/utils/convertTimestampToDate.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,SAAiB,EAAE,EAAE;IAC1D,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAExC,IAAI,EAAE,GAAoB,IAAI,CAAC,OAAO,EAAE,CAAC;IACzC,IAAI,EAAE,GAAG,EAAE,EAAE;QACX,EAAE,GAAG,GAAG,GAAG,EAAE,CAAC;KACf;IAED,IAAI,EAAE,GAAoB,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IAC9C,IAAI,EAAE,GAAG,EAAE,EAAE;QACX,EAAE,GAAG,GAAG,GAAG,EAAE,CAAC;KACf;IAED,OAAO,EAAE,GAAG,GAAG,GAAG,EAAE,GAAG,GAAG,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;AAClD,CAAC,CAAC"}

package/mobile/lib/utils/fetchMultitudeJSON.js

@@ -1,6 +1,6 @@
 import { fetchJSON } from './fetchJSON.js';
 export async function fetchMultitudeJSON(...urls) {
     const fetchPromises = urls.map((url) => fetchJSON(url));
-    return await Promise.all(fetchPromises);
+    return Promise.all(fetchPromises);
 }
 //# sourceMappingURL=fetchMultitudeJSON.js.map

package/mobile/lib/utils/fetchMultitudeJSON.js.map

@@ -1 +1 @@
-{"version":3,"file":"fetchMultitudeJSON.js","sourceRoot":"","sources":["../../src/utils/fetchMultitudeJSON.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,CAAC,KAAK,UAAU,kBAAkB,CACtC,GAAG,IAAc;IAEjB,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAI,GAAG,CAAC,CAAC,CAAC;IAE3D,OAAO,MAAM,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;AAC1C,CAAC"}
+{"version":3,"file":"fetchMultitudeJSON.js","sourceRoot":"","sources":["../../src/utils/fetchMultitudeJSON.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,CAAC,KAAK,UAAU,kBAAkB,CACtC,GAAG,IAAc;IAEjB,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAI,GAAG,CAAC,CAAC,CAAC;IAE3D,OAAO,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;AACpC,CAAC"}

package/mobile/src/components/ApplicationForm/ApplicationFormGrantSupport.tsx

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useSWRResource } from '../../hooks/useSWRResource';
-import { RegionsGrantSupportData } from '../../services/regionsGrantSupport/RegionsGrantSupportData';
+import type { RegionsGrantSupportData } from '../../services/regionsGrantSupport/RegionsGrantSupportData';
 import { Button } from '../../ui-kit/Button/Button';
 import { getRegularButtonClasses } from '../../ui-kit/Button/getRegularButtonClasses';
 import { style } from '../../utils/style';

package/mobile/src/components/ApplicationForm/renderRegion.tsx

@@ -13,8 +13,8 @@ interface RegionProps {
 export const renderRegion = ({ regions, field }: RegionProps) => (
   <SelectControl
     className="w-full"
-    label="Регион"
-    placeholder="Выберите регион"
+    label="Филиал"
+    placeholder="Выберите филиал"
     isSearch={true}
     options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
     {...withValidator(field('region'), defaultValidator)}

package/mobile/src/components/ApplicationForm/renderRegionDepartment.tsx

@@ -16,8 +16,8 @@ export const renderRegionDepartment = ({ regions, branches, field }: RegionDepar
   <div className="@xl:flex @xl:justify-between @xl:gap-lg @xl:mb-2xl @xl:border-none @xl:pb-0">
     <div className="@xl:w-1/2">
       <SelectControl
-        label="Регион"
-        placeholder="Выберите регион"
+        label="Филиал"
+        placeholder="Выберите филиал"
         isSearch={true}
         options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
         {...withValidator(field('region'), defaultValidator)}

package/mobile/src/components/ApplicationForm/renderWedDataOrganization.tsx

@@ -2,10 +2,10 @@ import { FormFieldRegisterer } from '../../hooks/useForm';
 import { withValidator } from '../../validation/withValidator';
 import { InputControl } from './InputControl';
 import { PhoneInputControl } from './PhoneInputControl';
-import { defaultValidator, innValidator, nameValidator, phoneValidator } from './validators';
-import type { WedFormState } from './WedFormState';
 import { SelectControl } from './SelectControl';
+import type { WedFormState } from './WedFormState';
 import type { Select } from './models';
+import { defaultValidator, innValidator, nameValidator, phoneValidator } from './validators';
 
 export const renderWedDataOrganization = (
   field: FormFieldRegisterer<WedFormState>,
@@ -15,11 +15,11 @@ export const renderWedDataOrganization = (
 
   return (
     <div>
-      {regions.length && isCurrencyControl ? (
+      {isCurrencyControl ? (
         <SelectControl
           className="mb-s"
-          label="Регион"
-          placeholder="Выберите регион"
+          label="Филиал"
+          placeholder="Выберите филиал"
           isSearch={true}
           options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
           {...withValidator(field('region'), defaultValidator)}

package/mobile/src/components/BenefitsBlock/BenefitsBlock.tsx

@@ -4,6 +4,7 @@ import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { RoundedIcon } from '../../ui-kit/Icon/RoundedIcon';
 import { Img } from '../../ui-kit/Img/Img';
+import { Text } from '../../ui-kit/Text/Text';
 import type {
   BenefitBlockItemProps,
   BenefitsBlockContent,
@@ -12,19 +13,19 @@ import type {
   TextBenefitDef,
 } from './BenefitsBlockContent';
 import { defaultIconSize } from './defaultIconSize';
-import { style } from '../../utils/style';
-import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
+import { AlignStyles } from '../../model/AlignStyles';
 
 interface BenefitsBlockProps extends BenefitsBlockContent, UniBlockProps {}
 
 export const BenefitsBlock = JSX<BenefitsBlockProps>(
   ({ className = '', title, benefitList, ...rest }) => (
-    <BlockWrapper className={style('space-y-x', className)} defaultPadding="p-6xl" {...rest}>
-      {title ? (
-        <Heading headingType="h3" as="h2" className="text-left sm:text-center" title={title} />
-      ) : null}
+    <BlockWrapper className={className} defaultPadding="p-6xl" {...rest}>
+      {title ? <Heading headingType="h3" as="h2" className={AlignStyles} title={title} /> : null}
       {benefitList?.length ? (
-        <div className="flex flex-wrap w-full sm:justify-center mt-xl gap-5xl" role="list">
+        <div
+          className="flex flex-col @md:flex-row flex-wrap w-full @md:justify-center mt-xl gap-5xl"
+          role="list"
+        >
           {benefitList.map(renderBenefit)}
         </div>
       ) : null}
@@ -35,7 +36,7 @@ export const BenefitsBlock = JSX<BenefitsBlockProps>(
 const renderBenefit = (benefit: BenefitBlockItemProps, i: number) => (
   <div
     key={String(i)}
-    className="flex gap-m items-center md:basis-1/2 md:max-w-[500px]"
+    className="flex gap-m items-center @md:basis-1/2 @md:max-w-[500px]"
     role="listitem"
   >
     {benefit?.icon?.icon ? (
@@ -48,7 +49,7 @@ const renderBenefit = (benefit: BenefitBlockItemProps, i: number) => (
     ) : null}
     {benefit?.icon?.src ? <Img className="shrink-0" image={benefit.icon} /> : null}
     {benefit?.label ? (
-      <div className="sm:h-full">
+      <div className="@sm:h-full">
         <Heading headingType="h6">{benefit.label}</Heading>
         {renderDescription(benefit.description)}
       </div>
@@ -60,7 +61,7 @@ const renderDescription = (description: DescriptionDef | undefined) => {
   const benefitType = description?.benefitType || null;
 
   return description && benefitType ? (
-    <div className="mt-2xs sm:mt-xs">
+    <div className="mt-xs text-l font-light text-secondary-text group-data-secondary:text-white/80">
       {benefitType === 'list'
         ? renderListBenefit(description as ListBenefitDef)
         : renderTextBenefit(description as TextBenefitDef)}
@@ -70,13 +71,13 @@ const renderDescription = (description: DescriptionDef | undefined) => {
 
 const renderTextBenefit = (description?: TextBenefitDef) =>
   description?.name ? (
-    <Paragraph
-      font="font-light"
+    <Text
       size="text-l"
-      color="text-secondary-text group-data-secondary:text-white"
+      color="text-secondary-text group-data-secondary:text-white/80"
+      font="font-light"
     >
       {description.name}
-    </Paragraph>
+    </Text>
   ) : null;
 
 const renderListBenefit = (description?: ListBenefitDef) => {
@@ -85,14 +86,15 @@ const renderListBenefit = (description?: ListBenefitDef) => {
   return description?.items && description.items.length > 0 ? (
     <ul className={listStyleType}>
       {description.items.map((_, i) => (
-        <Paragraph
-          key={`benefitListItem-${i}`}
-          font="font-light"
-          size="text-l"
-          color="text-secondary-text group-data-secondary:text-white"
-        >
-          {_}
-        </Paragraph>
+        <li key={`benefitListItem-${i}`}>
+          <Text
+            size="text-l"
+            color="text-secondary-text group-data-secondary:text-white/80"
+            font="font-light"
+          >
+            {_}
+          </Text>
+        </li>
       ))}
     </ul>
   ) : null;

package/mobile/src/components/ContentPage/ContentPage.tsx

@@ -35,7 +35,7 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>(
     useBlockRouterProvider();
 
     return (
-      <div className="@container" data-theme={colorPalette}>
+      <div data-theme={colorPalette}>
         <section className={style('relative', pageStyle, className)}>
           {slots?.header ? (
             <div className="relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]">

package/mobile/src/components/Depository/Depository.tsx

@@ -0,0 +1,43 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
+import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import { Pagination } from '../../ui-kit/Pagination/Pagination';
+import { style } from '../../utils/style';
+import type { DepositoryContent } from './DepositoryContent';
+import { DepositoryItem } from './DepositoryItem';
+import { useDepository } from './useDepository';
+
+const DEFAULT_ITEMS_COUNT = 10;
+
+interface DepositoryProps extends DepositoryContent, UniBlockProps {}
+
+export const Depository: JSXBlock<DepositoryProps> = JSX<DepositoryProps>(
+  ({ className, ...rest }) => {
+    const [currentPage, setCurrentPage] = useState(0);
+    const [itemCount] = useState(DEFAULT_ITEMS_COUNT);
+
+    const { totalPages = 0, items } = useDepository(itemCount, currentPage);
+
+    const handleChangePage = useCallback((page) => setCurrentPage(page - 1), []);
+
+    return (
+      <BlockWrapper className={style(className, 'container p-4xl')} {...rest}>
+        <div className="flex flex-col">
+          <div className="grid grid-cols-12 pb-lg border-gray border-opacity-50 border-b">
+            <span className="col-span-2 text-gray text-m">Дата</span>
+            <span className="col-span-10 text-gray text-m">Тема</span>
+          </div>
+          {items?.map((params) => (
+            <DepositoryItem key={String(params.publicId)} {...params} />
+          ))}
+          <Pagination
+            currentPage={currentPage + 1}
+            onPageChange={handleChangePage}
+            totalPages={totalPages + 1}
+          />
+        </div>
+      </BlockWrapper>
+    );
+  },
+);

package/mobile/src/components/Depository/DepositoryContent.ts

@@ -0,0 +1,6 @@
+import type { UniBlockContent } from '../../model/JSXBlock';
+
+/**
+ * @title Депозитарий
+ */
+export type DepositoryContent = UniBlockContent;

package/mobile/src/components/Depository/DepositoryItem.tsx

@@ -0,0 +1,21 @@
+import { useLink } from '../../hooks/useLink';
+import { convertTimestampToDate } from '../../utils/convertTimestampToDate';
+import { DepositoryDataItem } from './useDepository';
+
+export const DepositoryItem = ({ title, timestamp = 0, publicId }: DepositoryDataItem) => {
+  const link = useLink();
+  const { href } = link({ href: `/api/v1/depository/${publicId}/file` });
+
+  return (
+    <div className="grid grid-cols-12 py-lg border-gray border-opacity-50 border-b" key={publicId}>
+      <div className="col-span-2 text-m">
+        <span>{convertTimestampToDate(timestamp)}</span>
+      </div>
+      <div className="col-span-10 text-h6 hover:text-primary-active">
+        <a href={href} download aria-label="Скачать">
+          {title}
+        </a>
+      </div>
+    </div>
+  );
+};

package/mobile/src/components/Depository/useDepository.ts

@@ -0,0 +1,23 @@
+import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
+import { fetchJSONUnsafe } from '../../utils/fetchJSON';
+
+export interface DepositoryDataItem {
+  publicId?: number;
+  timestamp?: number;
+  title?: number;
+}
+
+interface DepositoryData {
+  content?: DepositoryDataItem[];
+  totalPages?: number;
+  totalElements?: number;
+}
+
+export const useDepository = (size: number, page: number) => {
+  const { data } = useAsyncData<DepositoryData>(
+    `/api/v1/depository?page=${page}&size=${size}`,
+    fetchJSONUnsafe,
+  );
+
+  return { items: data?.content, totalPages: data?.totalPages };
+};

package/mobile/src/components/OfficesAtmsMap/OfficesAtmsMap.example.json

@@ -0,0 +1 @@
+{}

package/mobile/src/components/OfficesAtmsMap/OfficesAtmsMapContent.ts

@@ -35,6 +35,9 @@ export type AtmsDef = {
  */
 export type OfficesAtmsBlockDef = EmptyOption | OfficesDef | AtmsDef;
 
+/**
+ * @title Блок офисов и банкоматов
+ */
 export type OfficesAtmsMapContent = UniBlockContent & {
   data?: OfficesAtmsBlockDef;
 };

package/mobile/src/components/StickyBottomMenu/StickyBottomMenu.tsx

@@ -35,11 +35,13 @@ export const StickyBottomMenu = JSX<StickyBottomMenuProps>(({ ...rest }) => {
   );
 
   return (
-    <BlockWrapper
-      className="fixed bottom-0 left-0 right-0 my-0 mx-auto w-full bg-transparent z-[100]"
-      padding="p-0"
-    >
-      {<RenderMenuItems menuItems={menuItemsWithButton} onClick={toggle} />}
-    </BlockWrapper>
+    <div className="w-full mb-5">
+      <BlockWrapper
+        className="@container-normal fixed w-full h-[74] bottom-0 left-0 my-0 mx-auto bg-transparent z-[100]"
+        padding="p-0"
+      >
+        <RenderMenuItems menuItems={menuItemsWithButton} onClick={toggle} />
+      </BlockWrapper>
+    </div>
   );
 });

package/mobile/src/components/SwipeListControlBlock/SwipeListControlBlockContent.ts

@@ -1,3 +1,6 @@
 import type { SwipeListControlContent } from '../../ui-kit/SwipeListControl/SwipeListControlContent';
 
+/**
+ * @title Swipe-контроллер
+ */
 export type SwipeListControlBlockContent = SwipeListControlContent;

package/mobile/src/ui-kit/Input/Input.tsx

@@ -1,5 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useCallback, useEffect, useRef } from '@redneckz/uni-jsx/lib/hooks';
 import { style } from '../../utils/style';
 import { Text } from '../Text/Text';
 import type { InputProps } from './InputProps';
@@ -23,6 +23,7 @@ export const Input = JSX<InputProps>(
     pattern,
     autoFocus = false,
   }) => {
+    const inputRef = useRef<HTMLInputElement | null>(null);
     const handleChange = useCallback(
       (e: { target?: { value?: string } }) => {
         onChange && onChange(e.target?.value || '');
@@ -30,6 +31,12 @@ export const Input = JSX<InputProps>(
       [onChange],
     );
 
+    useEffect(() => {
+      if (autoFocus) {
+        inputRef.current?.focus();
+      }
+    }, [autoFocus, inputRef]);
+
     const paddingStyle = children ? 'pr-3xl' : '';
     const validStyle = valid
       ? 'border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'
@@ -46,6 +53,7 @@ export const Input = JSX<InputProps>(
             </div>
           ) : null}
           <input
+            ref={inputRef}
             key={key}
             className={style(
               'w-full border rounded-md text-primary-text outline-none p-m',
@@ -62,7 +70,6 @@ export const Input = JSX<InputProps>(
             onFocus={onFocus}
             onBlur={onBlur}
             pattern={pattern}
-            autoFocus={autoFocus}
           />
         </label>
         {children}

package/mobile/src/ui-kit/Pagination/Pagination.tsx

@@ -0,0 +1,87 @@
+import { useCallback, useMemo } from '@redneckz/uni-jsx/lib/hooks';
+import { Icon } from '../Icon/Icon';
+import { renderPages } from './renderPages';
+
+export const paginationBlockStyle =
+  'py-m px-lg rounded-md cursor-pointer hover:bg-green-more-dark hover:text-white';
+
+export interface PaginationProps {
+  currentPage: number;
+  onPageChange: (page: number) => void;
+  totalPages: number;
+}
+
+const ICON_SIZE = { width: '24', height: '24' };
+
+export const Pagination = ({ currentPage, onPageChange, totalPages }: PaginationProps) => {
+  const handlePrevPage = useCallback(() => {
+    if (currentPage > 1) {
+      onPageChange(currentPage - 1);
+    }
+  }, [currentPage]);
+
+  const handleNextPage = useCallback(() => {
+    if (currentPage < totalPages - 1) {
+      onPageChange(currentPage + 1);
+    }
+  }, [currentPage, totalPages]);
+
+  const handleFirstPage = useCallback(() => onPageChange(1), []);
+  const handleLastPage = useCallback(() => onPageChange(totalPages), [totalPages]);
+
+  const pages = useMemo(
+    () =>
+      new Array(totalPages).fill({
+        currentPage,
+        onPageChange,
+        totalPages,
+      }),
+    [totalPages, currentPage],
+  );
+
+  return (
+    <div className="mt-3xl flex items-center select-none" role="navigation" aria-label="Пагинация">
+      <div className="flex gap-m items-center">
+        <div onClick={handlePrevPage}>
+          <Icon
+            name="ArrowLeftIcon"
+            iconVersion="black"
+            imageClassName={getIconStyle(currentPage === 1)}
+            {...ICON_SIZE}
+          />
+        </div>
+        <div className="flex gap-xs">
+          {currentPage > 1 ? (
+            <div onClick={handleFirstPage} className={paginationBlockStyle} aria-label="Страница 1">
+              1
+            </div>
+          ) : null}
+          {currentPage > 4 ? <div className="py-m px-s">...</div> : null}
+          {pages.map(renderPages)}
+          {currentPage < totalPages - 3 ? <div className="py-m px-s">...</div> : null}
+          {currentPage < totalPages ? (
+            <div
+              onClick={handleLastPage}
+              className={paginationBlockStyle}
+              aria-label={`Страница ${totalPages}}`}
+            >
+              {totalPages}
+            </div>
+          ) : null}
+        </div>
+        <div onClick={handleNextPage}>
+          <Icon
+            className="rotate-180"
+            name="ArrowLeftIcon"
+            iconVersion="black"
+            imageClassName={getIconStyle(currentPage === totalPages)}
+            {...ICON_SIZE}
+          />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+const getIconStyle = (condition: boolean) =>
+  condition ? 'opacity-20' : 'cursor-pointer hover:opacity-60';

package/mobile/src/ui-kit/Pagination/renderPages.tsx

@@ -0,0 +1,33 @@
+import { paginationBlockStyle, PaginationProps } from './Pagination';
+import { shouldRenderPage } from './shouldRenderPage';
+
+export const renderPages = (pagesParams: PaginationProps, index: number) => {
+  const { currentPage, onPageChange, totalPages } = pagesParams;
+  const page = index + 1;
+  if (page === currentPage) {
+    return (
+      <div
+        key={String(index)}
+        aria-current="true"
+        className="py-m px-lg bg-green-light text-white rounded-md"
+      >
+        {page}
+      </div>
+    );
+  }
+
+  if (page !== 1 && page !== totalPages && shouldRenderPage(page, currentPage, totalPages)) {
+    return (
+      <div
+        key={String(index)}
+        onClick={() => onPageChange(page)}
+        className={paginationBlockStyle}
+        aria-label={`Страница ${page}`}
+      >
+        {page}
+      </div>
+    );
+  }
+
+  return null;
+};

package/mobile/src/ui-kit/Pagination/shouldRenderPage.ts

@@ -0,0 +1,8 @@
+const checkPageRange = (page: number, currentPage: number, totalPages: number) =>
+  (currentPage <= 3 && page <= currentPage + 3) ||
+  (currentPage >= totalPages - 1 && page >= totalPages - 4);
+
+export const shouldRenderPage = (page: number, currentPage: number, totalPages: number) =>
+  (page < currentPage && page >= currentPage - 2) ||
+  (page <= currentPage + 2 && page > currentPage) ||
+  checkPageRange(page, currentPage, totalPages);

package/mobile/src/ui-kit/Select/filterOptions.ts

@@ -1,6 +1,3 @@
-import { compareBy, desc } from '../../utils/Comparator';
-import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance';
-import { zip } from '../../utils/zip';
 import type { Option } from './Option';
 
 export const filterOptions = (options: Option[], query: string | undefined): Option[] => {
@@ -8,12 +5,5 @@ export const filterOptions = (options: Option[], query: string | undefined): Opt
     return options;
   }
 
-  const ranking = options
-    .map((_) => _.text?.toLowerCase())
-    .map(jaroWinklerDistance(query?.trim().toLowerCase()));
-
-  return zip(options, ranking)
-    .filter(([, rank]) => rank >= 0.5)
-    .sort(desc(compareBy(([, rank]) => rank)))
-    .map(([option]) => option);
+  return options.filter((_) => _.text?.toLocaleLowerCase().includes(query?.trim().toLocaleLowerCase()))
 };

package/mobile/src/utils/convertTimestampToDate.ts

@@ -0,0 +1,15 @@
+export const convertTimestampToDate = (timestamp: number) => {
+  const date = new Date(timestamp * 1000);
+
+  let dd: string | number = date.getDate();
+  if (dd < 10) {
+    dd = '0' + dd;
+  }
+
+  let mm: string | number = date.getMonth() + 1;
+  if (mm < 10) {
+    mm = '0' + mm;
+  }
+
+  return dd + '.' + mm + '.' + date.getFullYear();
+};

package/mobile/src/utils/fetchMultitudeJSON.ts

@@ -5,5 +5,5 @@ export async function fetchMultitudeJSON<R = unknown>(
 ): Promise<Awaited<R | null>[]> {
   const fetchPromises = urls.map((url) => fetchJSON<R>(url));
 
-  return await Promise.all(fetchPromises);
+  return Promise.all(fetchPromises);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.5",
+  "version": "0.14.7",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/ApplicationForm/ApplicationFormGrantSupport.tsx

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useSWRResource } from '../../hooks/useSWRResource';
-import { RegionsGrantSupportData } from '../../services/regionsGrantSupport/RegionsGrantSupportData';
+import type { RegionsGrantSupportData } from '../../services/regionsGrantSupport/RegionsGrantSupportData';
 import { Button } from '../../ui-kit/Button/Button';
 import { getRegularButtonClasses } from '../../ui-kit/Button/getRegularButtonClasses';
 import { style } from '../../utils/style';

package/src/components/ApplicationForm/renderRegion.tsx

@@ -13,8 +13,8 @@ interface RegionProps {
 export const renderRegion = ({ regions, field }: RegionProps) => (
   <SelectControl
     className="w-full"
-    label="Регион"
-    placeholder="Выберите регион"
+    label="Филиал"
+    placeholder="Выберите филиал"
     isSearch={true}
     options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
     {...withValidator(field('region'), defaultValidator)}