@redneckz/wildless-cms-uni-blocks 0.13.23 → 0.14.0

package/mobile/src/components/SafeDepositRental/SafeBoxCases.tsx

@@ -21,7 +21,7 @@ export const SafeBoxCases = JSX<SafeBoxCasesProps>(
     onSelectedBoxSize,
   }) => {
     return (
-      <div className="flex flex-col sm:flex-row gap-m order-1">
+      <div className="flex flex-col @xl:flex-row gap-m order-1">
         <div className="flex-1 min-w-0">
           <WrapperSelect
             data={caseVolumes}

package/mobile/src/components/SafeDepositRental/SafeDepositRentalFields.tsx

@@ -33,7 +33,7 @@ export const SafeDepositRentalFields = JSX<SafeDepositRentalFieldsProps>(
     onClick,
   }) => {
     return (
-      <div className="contents sm:block flex-1 space-y-xl">
+      <div className="contents @xl:block flex-1 space-y-xl">
         <RegionsAndBranches
           regions={regions}
           selectedRegion={selectedRegion}
@@ -56,7 +56,7 @@ export const SafeDepositRentalFields = JSX<SafeDepositRentalFieldsProps>(
             Тип договора
           </Text>
         </div>
-        <div className="contents sm:flex justify-between items-center gap-m">
+        <div className="contents @md:flex justify-between items-center gap-m">
           <RadioButtons />
           <Button text="Офисы на карте" version="primary" onClick={onClick} className="order-6" />
         </div>

package/mobile/src/components/SafeDepositRental/SafeDepositRentalForm.tsx

@@ -37,7 +37,7 @@ export const SafeDepositRentalForm = JSX<SafeDepositRentalFormProps>((props) =>
   const tariffs = getTariffs(safeBoxCases, data.selectedBoxSize);
 
   return (
-    <div className="flex flex-col sm:flex-row gap-4xl align-top">
+    <div className="flex flex-col @4xl:flex-row gap-4xl align-top">
       <SafeDepositRentalFields
         {...data}
         regions={regions}

package/mobile/src/components/SafeDepositRental/SafeDepositRentalTotal.tsx

@@ -12,17 +12,17 @@ export const SafeDepositRentalTotal = JSX<SafeDepositRentalTotalProps>(({ days,
   const imageDescription = 'На рисунке изображена пачка листов\nформата А4';
 
   return (
-    <div className="contents sm:flex flex-col justify-between order-2">
-      <div className="flex flex-col sm:flex-row gap-x-6xl gap-y-2xl order-5 sm:order-none py-2xl sm:py-0 border-t border-main-divider sm:border-none">
+    <div className="contents @xl:flex flex-col justify-between gap-xl order-2">
+      <div className="flex flex-col @xl:flex-row gap-x-6xl gap-y-2xl order-5 @xl:order-none py-2xl @xl:py-0 border-t border-main-divider @xl:border-none">
         {renderTotal('Аренда за', days)}
         {renderTotal('Цена', price + ' ₽')}
       </div>
-      <span className="sm:hidden order-3 mb-xs text-s font-light text-secondary-text">
+      <span className="@xl:hidden order-3 mb-xs text-s font-light text-secondary-text">
         {imageDescription}
       </span>
-      <div className="flex flex-col items-center gap-s order-3 sm:order-none mb-xl sm:mb-0 bg-primary-main py-s sm:p-3xl text-center">
-        <Img image={{ icon: 'PackA4Icon' }} className="sm:h-60" />
-        <span className="hidden sm:inline text-s font-light text-white opacity-80 whitespace-pre-line">
+      <div className="flex flex-col items-center gap-s order-3 @xl:order-none mb-xl @xl:mb-0 bg-primary-main py-s @xl:p-3xl text-center">
+        <Img image={{ icon: 'PackA4Icon' }} className="@xl:h-60" />
+        <span className="hidden @xl:inline text-s font-light text-white opacity-80 whitespace-pre-line">
           {imageDescription}
         </span>
       </div>
@@ -32,9 +32,9 @@ export const SafeDepositRentalTotal = JSX<SafeDepositRentalTotalProps>(({ days,
 
 const renderTotal = (label: string, total: string | number) => {
   return (
-    <div className="flex justify-between items-center gap-y-xs sm:flex-col sm:items-start">
+    <div className="flex justify-between items-center gap-y-xs @xl:flex-col @xl:items-start">
       <div className="text-l font-light text-secondary-text">{label}</div>
-      <span className="text-l sm:text-h3 text-primary-text">{total}</span>
+      <span className="text-l @xl:text-h3 text-primary-text">{total}</span>
     </div>
   );
 };

package/mobile/src/components/SafeDepositRental/WrapperSelect.tsx

@@ -1,5 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { Option, Select } from '../../ui-kit/Select/Select';
+import { Option } from '../../ui-kit/Select/Option';
+import { Select } from '../../ui-kit/Select/Select';
 import { Currency } from '../ExchangeRateTile/CurrencyProps';
 
 interface WrapperSelectProps {

package/mobile/src/components/StepsBlock/StepsBlock.tsx

@@ -128,10 +128,11 @@ const renderIconArea = (size: SizeVersion, version: BlockVersion) => (step: Step
         'z-10 mr-s flex justify-center content-center',
       )}
     >
-      <span className="flex self-center text-h4 text-secondary-text group-data-secondary:text-white">
+      <span className="flex max-w-full max-h-full self-center text-h4 text-secondary-text group-data-secondary:text-white">
         {checkCanRenderIcon(step?.icon) ? (
           <Img
             image={{ ...step.icon, iconVersion: step.icon?.iconVersion || iconVersion }}
+            imageClassName="max-w-full max-h-full"
             width={iconSize}
             height={iconSize}
           />

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

@@ -13,7 +13,10 @@ export const RenderMenuItems = JSX<RenderMenuItems>(({ menuItems, onClick }) =>
   const [activeIndex] = useActiveRoute(menuItems);
 
   return (
-    <BlockWrapper className="sticky bottom-0 left-0 right-0 bg-transparent z-[100]" padding="p-0">
+    <BlockWrapper
+      className="fixed bottom-0 left-0 right-0 my-0 mx-auto w-full bg-transparent z-[100]"
+      padding="p-0"
+    >
       <div className="ml-auto container bg-white flex justify-center shadow-blue-gray">
         {menuItems.map((_, i) => (
           <RenderItem key={String(i)} isActive={i === activeIndex} item={_} onClick={onClick} />

package/mobile/src/components/TariffsTable/EmbeddableCellData.tsx

@@ -2,44 +2,77 @@ import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Img } from '../../ui-kit/Img/Img';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import {
+  type InnerTableButtonProps,
+  TableInnerButton,
+} from '../../ui-kit/InnerTable/InnerTableButton';
+import type { TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
 import { List } from '../../ui-kit/List/List';
 import type { ListProps } from '../../ui-kit/List/ListProps';
 import type { LabelDescriptionCell } from './TariffsTableContent';
 import type { ButtonsSectionContent } from '../../ui-kit/Button/ButtonsSectionContent';
+import { Text } from '../../ui-kit/Text/Text';
 
 export type EmbeddableCellDataType =
-  | ButtonContent
   | LabelDescriptionCell
+  | ButtonContent
   | ImageContent
-  | ListProps;
+  | ListProps
+  | InnerTableButtonProps;
+
+interface TableCellDataProps extends InnerTableButtonProps {
+  isVisible?: boolean;
+  displayTable: (props: TariffsTableInnerContent) => void;
+}
 
 const renderButtonsCellData = ({ buttons }: ButtonsSectionContent) =>
   renderButtonsSection(buttons, {
-    className: 'mt-s',
-    buttonClassName: 'w-12 h-12',
+    buttonClassName: 'basis-0',
   });
 
 const renderLabelDescriptionCellData = ({ label, description }: LabelDescriptionCell) => (
-  <div>
-    {label ? <div className="mb-xs">{label}</div> : null}
-    {description ? <div className="text-s text-secondary-text">{description}</div> : null}
+  <div className="space-y-2xs">
+    {label ? <div>{label}</div> : null}
+    {description ? (
+      <div>
+        <Text size="text-s" color="text-secondary-text">
+          {description}
+        </Text>
+      </div>
+    ) : null}
   </div>
 );
 
-const renderImgCellData = ({ image }: ImageContent) =>
-  image?.src ? <Img image={image} className="m-0" imageClassName="m-0" /> : null;
+const renderImgCellData = ({ image }: ImageContent) => (image?.src ? <Img image={image} /> : null);
 
 const renderListCellData = ({ isDotted, ...rest }: ListProps) => (
   <List
-    className="flex flex-col justify-between items-start text-m pl-xs text-base"
+    className="flex flex-col justify-between items-start text-h6"
     isDotted={isDotted ?? true}
     {...rest}
   />
 );
 
+const renderInnerTableCellData = ({
+  isVisible,
+  displayTable,
+  dataUrl,
+  pdfUrl,
+  isOpen,
+}: TableCellDataProps) =>
+  isVisible ? (
+    <TableInnerButton
+      isOpen={isOpen}
+      onClick={() => {
+        displayTable({ dataUrl, pdfUrl });
+      }}
+    />
+  ) : null;
+
 export const EmbeddableCellData = {
   Buttons: renderButtonsCellData,
   Img: renderImgCellData,
   List: renderListCellData,
   LabelDescription: renderLabelDescriptionCellData,
+  Table: renderInnerTableCellData,
 };

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

@@ -2,7 +2,6 @@
   "content": {
     "title": "Заголовок",
     "description": "Описание",
-    "orientation": "vertical",
     "rowHeaders": [
       {
         "title": "Параметр 1",

package/mobile/src/components/TariffsTable/TariffsTable.tsx

@@ -1,56 +1,75 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useCarouselControls } from '../../hooks/useCarouselControls';
 import type { UniBlockProps } from '../../model/JSXBlock';
+import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import { renderDefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton';
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
+import { style } from '../../utils/style';
 import { Headline } from '../Headline/Headline';
-import type {
-  CellDef,
-  TariffsTableColumn,
-  TariffsTableContent,
-  TariffsTableRowHeader,
-} from './TariffsTableContent';
-import { TariffsTableHorizontal } from './TariffsTableHorizontal';
-import { TariffsTableVertical } from './TariffsTableVertical';
+import type { TariffsTableContent } from './TariffsTableContent';
+import { TariffsTableRow } from './TariffsTableRow';
+import { COLS_LENGTH_FOR_SCROLL } from './constants';
+import { TariffsTableWrapper } from './TariffsTableWrapper';
+import { headlineAlign } from './headlineAlign';
 
 export interface TariffsTableProps extends TariffsTableContent, UniBlockProps {}
 
 export const TariffsTable = JSX<TariffsTableProps>(
   ({
-    className,
+    className = '',
     title,
     description,
-    tariffsColumns: columns,
     rowHeaders,
-    orientation = 'vertical',
+    tariffsColumns: columns,
+    hiddenRowsNum = 0,
     ...rest
   }) => {
-    const colData = getColData(columns);
-    const tiles = getTiles(rowHeaders, colData);
+    const colData = columns?.map(({ data }) => data) || [];
+    const rowData = rowHeaders?.map((header, i) => ({
+      header,
+      data: colData.map((col) => col?.[i] || []),
+    }));
+    const itemCount = colData.length;
+    const [activeIndex, controls] = useCarouselControls({
+      itemCount: itemCount,
+      visibleItemCount: COLS_LENGTH_FOR_SCROLL,
+    });
+    const rows = (rowData || []).map((row, i) => (
+      <TariffsTableRow key={String(i)} row={row} activeIndex={activeIndex} rowIdx={i} {...rest} />
+    ));
+    const [visibleRows, hiddenRows] =
+      hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
 
     return (
-      <section
-        className={`p-6xl space-3xl bg-white font-sans text-primary-text overflow-x-hidden ${className}`}
+      <BlockWrapper
+        className={style('overflow-hidden relative space-y-0 @4xl:space-y-xl', className)}
+        defaultPadding="p-6xl"
+        {...rest}
       >
         <Headline
           title={title}
           description={description}
           headlineVersion="M"
-          align="text-left"
           isEmbedded={true}
+          align={headlineAlign}
         />
-        {orientation === 'vertical' ? (
-          <TariffsTableVertical tiles={tiles} {...rest} />
-        ) : (
-          <TariffsTableHorizontal tiles={tiles} {...rest} />
-        )}
-      </section>
+        <div className="space-y-m">
+          {hiddenRowsNum > 0 ? (
+            <Foldable
+              renderFoldableSection={({ isUnfolded }) => (
+                <TariffsTableWrapper controls={controls}>
+                  {visibleRows}
+                  <FoldableSection isUnfolded={isUnfolded}>{hiddenRows}</FoldableSection>
+                </TariffsTableWrapper>
+              )}
+              renderFoldButton={renderDefaultFoldButton}
+            />
+          ) : (
+            <TariffsTableWrapper controls={controls}>{rows}</TariffsTableWrapper>
+          )}
+        </div>
+      </BlockWrapper>
     );
   },
 );
-
-const getColData = (columns: TariffsTableColumn[] | undefined) =>
-  columns?.[0]?.data ? columns[0].data : [];
-
-const getTiles = (rowHeaders: TariffsTableRowHeader[] | undefined, colData: CellDef[][]) =>
-  rowHeaders?.map((header, i) => ({
-    header,
-    data: colData?.[i] || [{}],
-  }));

package/mobile/src/components/TariffsTable/TariffsTableCell.tsx

@@ -29,10 +29,7 @@ export const TariffsTableCell = JSX<TariffsTableCellProps>(
     setOpenTableInnerIdx,
   }) => {
     return (
-      <div
-        className="w-80 flex-grow flex flex-col border-solid border-main-divider border border-t-0 border-x-0"
-        role="cell"
-      >
+      <div className="w-80 flex-grow flex flex-col gap-m @4xl:gap-lg" role="cell">
         {cells?.length
           ? cells.map(
               renderCellInner({

package/mobile/src/components/TariffsTable/TariffsTableContent.ts

@@ -1,7 +1,6 @@
 import type { EmptyOption } from '../../model/EmptyOptionType';
 import type { DescriptionProps, LabelProps, TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent, UniBlockProps } from '../../model/JSXBlock';
-import type { ListOrientation } from '../../model/ListOrientation';
 import type { IconProps } from '../../model/Picture';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
@@ -119,8 +118,6 @@ export type TariffsTableContent = UniBlockContent &
     tariffsColumns?: TariffsTableColumn[];
     /** @title Параметры */
     rowHeaders?: TariffsTableRowHeader[];
-    /** @title Отображать элементы в моб. версии (прокрутка shift+mouseScroll) */
-    orientation?: ListOrientation;
     /** @title Скрывать строк */
     hiddenRowsNum?: number;
   };

package/mobile/src/components/TariffsTable/TariffsTableRenderCell.tsx

@@ -47,11 +47,7 @@ export const renderCellInner =
     };
 
     return (
-      <div
-        key={String(i)}
-        className={cell?.tableCellType === 'Table' ? 'ml-5xl' : `first:pt-lg last:pb-lg pl-5xl`}
-      >
-        {i > 0 ? <div className="h-5" /> : null}
+      <div key={String(i)}>
         {renderCell({
           cell,
           cellProps: {

package/mobile/src/components/TariffsTable/TariffsTableRow.tsx

@@ -4,10 +4,11 @@ import type { UniBlockProps } from '../../model/JSXBlock';
 import { Img } from '../../ui-kit/Img/Img';
 import type { TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
 import { TableCarouselContainer } from '../ComparisonTable/TableCarouselContainer';
-import { COLUMN_WIDTH, DIVIDER_CLASSES, FIRST_CELL_CLASSES } from './constants';
+import { COLUMN_WIDTH, firstCellStyle } from './constants';
 import { TariffsTableCell } from './TariffsTableCell';
 import type { Data } from './TariffsTableContent';
 import { TariffsTableRowContainer } from './TariffsTableRowContainer';
+import { style } from '../../utils/style';
 
 export interface TariffsTableRowProps extends UniBlockProps {
   row: Data;
@@ -35,10 +36,15 @@ export const TariffsTableRow = JSX<TariffsTableRowProps>(
         tableInner={tableInner}
         {...rest}
       >
-        <div className={`text-s py-lg ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES}`}>
-          <div className="flex items-center text-primary-text" role="cell">
+        <div className={style('text-s', firstCellStyle)}>
+          <div className="flex gap-m items-center text-primary-text" role="cell">
             {header?.icon ? (
-              <Img className="mr-m max-w-6" image={header.icon} width="24" height="24" />
+              <Img
+                className="hidden @4xl:block max-w-6"
+                image={header.icon}
+                width="24"
+                height="24"
+              />
             ) : null}
             {header?.title ? <div className="text-m font-light">{header?.title}</div> : null}
           </div>

package/mobile/src/components/TariffsTable/TariffsTableRowContainer.tsx

@@ -2,6 +2,8 @@ import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { InnerTable } from '../../ui-kit/InnerTable/InnerTable';
 import type { TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
+import { style } from '../../utils/style';
+import { dividerStyle } from './constants';
 
 export interface TariffsTableRowContainerProps extends UniBlockProps {
   tableInner?: TariffsTableInnerContent;
@@ -11,7 +13,14 @@ export interface TariffsTableRowContainerProps extends UniBlockProps {
 export const TariffsTableRowContainer = JSX<TariffsTableRowContainerProps>(
   ({ children, tableInner, onHideContentClick }) => (
     <div className="self-start flex flex-col" role="row">
-      <div className="flex">{children}</div>
+      <div
+        className={style(
+          dividerStyle,
+          'flex flex-col @4xl:flex-row gap-y-xs gap-x-5xl pb-lg @4xl:pt-lg',
+        )}
+      >
+        {children}
+      </div>
       {tableInner ? (
         <div className="origin-top animate-expansion">
           <InnerTable {...tableInner} onClick={onHideContentClick} />

package/mobile/src/components/TariffsTable/TariffsTableWrapper.tsx

@@ -0,0 +1,27 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { renderArrows } from '../../ui-kit/Button/renderArrows';
+import { CarouselControls } from '../../hooks/useCarouselControls';
+
+interface WrapperProps {
+  controls: CarouselControls;
+}
+
+export const TariffsTableWrapper = JSX<WrapperProps>(({ children, controls }) => {
+  const { isScrollAvailable } = controls;
+
+  return (
+    <div role="table">
+      <div className="relative space-y-xs">
+        {children}
+        {renderArrows({
+          ...controls,
+          btnClass: ['top-28', 'top-11'],
+          className: 'right-7',
+        })}
+      </div>
+      {isScrollAvailable ? (
+        <div className="absolute top-0 right-0 bottom-0 w-20 bg-opacity-to-white" />
+      ) : null}
+    </div>
+  );
+});

package/mobile/src/components/TariffsTable/constants.ts

@@ -1,4 +1,4 @@
-export const DIVIDER_CLASSES = 'border-main-divider border border-t-0 border-x-0';
-export const FIRST_CELL_CLASSES = 'w-80 flex-shrink-0';
+export const dividerStyle = '@4xl:border-main-divider @4xl:border-b';
+export const firstCellStyle = 'w-80 flex-shrink-0';
 export const COLS_LENGTH_FOR_SCROLL = 2;
 export const COLUMN_WIDTH = 4 * 80 + 40; // w-80 + pl-10 = 360px

package/mobile/src/components/TariffsTable/headlineAlign.tsx

@@ -0,0 +1 @@
+export const headlineAlign = 'text-left';

package/mobile/src/content-page-repository/transformContentPage.ts

@@ -1,11 +1,12 @@
+import { fileResolver, resolveRef } from '@redneckz/json-ref';
+import type { JSONNode } from '@redneckz/json-ref/lib/JSONNode';
 import fs from 'fs';
-import path from 'path';
 import util from 'util';
 import { Attachment } from '../model/Attachment';
 import type { ContentPageDef } from '../model/ContentPageDef';
 import type { Picture } from '../model/Picture';
-import { mapJSON } from './mapJSON';
 import type { TransformationOptions } from './TransformationOptions';
+import { mapJSON } from './mapJSON';
 import { transformDocument } from './transformDocument';
 import { transformHTML } from './transformHTML';
 import { transformMarkdown } from './transformMarkdown';
@@ -34,14 +35,14 @@ export async function transformContentPage(
 ): Promise<ContentPageDef> {
   const content = await readFile(pagePath, 'utf8');
 
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-  const result = await mapJSON<ContentPageDef>(JSON.parse(content), async (value: any, [key]) => {
+  const json = await resolveRef(JSON.parse(content) as JSONNode, fileResolver(options.contentDir));
+  const result = await mapJSON(json as ContentPageDef, async (value: any, [key]) => {
     try {
       if (isMarkdown(key, value)) {
         return await transformMarkdown(value as string);
       } else if (isHTML(key, value)) {
         return await transformHTML(value as string);
-      } else if (isDocument(value)) {
+      } else if (isDocumentRef(value)) {
         return await transformDocument(value, pagePath, options);
       } else if (isPicture(value)) {
         return await transformPicture(value, pagePath, options);
@@ -65,12 +66,13 @@ const isMarkdown = (key: string, value: any): value is string =>
   isString(value) && key?.endsWith('__md');
 const isHTML = (key: string, value: any): value is string =>
   isString(value) && key?.endsWith('__html');
-const isDocument = (_: any): _ is Attachment =>
-  Boolean(_ && isLocalPath(_?.src) && isDocumentExt(path.extname(_?.src as string)));
-const isDocumentExt = (input: string) =>
-  DOCUMENT_EXT_LIST.some((ext) => input.toLowerCase().endsWith(ext));
+
+const isDocumentRef = (_: any): _ is Attachment =>
+  isLocalPath(_?.src) && DOCUMENT_EXT_LIST.some((ext) => _.src.toLowerCase().endsWith(ext));
+
 const isPicture = (_: any): _ is Picture => Boolean(_ && isLocalPath(_?.src));
-const isLocalPath = (_: any): boolean => isString(_) && _.length < 1024 && !isURL(_);
+
+const isLocalPath = (_: any): _ is string => isString(_) && _.length < 1024 && !isURL(_);
 const isURL = (src: string) => ['data:', 'https:', 'http:'].some((proto) => src.startsWith(proto));
 
 const isString = (_: any): _ is string => Boolean(_ && typeof _ === 'string');

package/mobile/src/icons/IconName.ts

@@ -3,7 +3,7 @@
 /* eslint-disable max-len, max-lines */
 
 export const IconsWithoutInversion = new Set([
-  'ActualBalanceIcon', 'AirPlaneIcon', 'BagIcon', 'BelarusianFlag', 'BriefcaseIcon', 'CardWithGemIcon', 'CarIcon', 'ChartIcon', 'ChevronLeftIcon', 'CinemaIcon', 'ClientIcon', 'ClockIcon', 'ComfortableCompIcon', 'CreditCardsIcon', 'DocsIcon', 'DollarIcon', 'DoneIcon', 'EarthIcon', 'EuroIcon', 'FullScreenIcon', 'GlassIcon', 'HeadphonesIcon', 'HeartIcon', 'HouseIcon', 'HuaweiIcon', 'InterestGrowthIcon', 'JCBIcon', 'MailIcon', 'MapMarkerClusterIcon', 'MapMarkerSingleIcon', 'MapOpenedIcon', 'MasterCardIcon', 'MirIcon', 'MoneyInsuranceIcon', 'NewDocIcon', 'OfficeIcon', 'PackA4Icon', 'PassSendIcon', 'PercentIcon', 'PhoneIcon', 'PowerIcon', 'PumpkinIcon', 'ResponseFailIcon', 'ResponseOKIcon', 'SignDocsIcon', 'SoundIcon', 'UnionPayIcon', 'UserGeoLocationIcon', 'VisaIcon', 'WateringCanIcon'
+  'ActualBalanceIcon', 'AirPlaneIcon', 'BagIcon', 'BelarusianFlag', 'BriefcaseIcon', 'CardWithGemIcon', 'CarIcon', 'ChartIcon', 'ChevronLeftIcon', 'CinemaIcon', 'ClientIcon', 'ClockIcon', 'ComfortableCompIcon', 'CreditCardsIcon', 'DocsIcon', 'DollarIcon', 'DoneIcon', 'EarthIcon', 'EuroIcon', 'FullScreenIcon', 'GlassIcon', 'HeadphonesIcon', 'HeartIcon', 'HouseIcon', 'HuaweiIcon', 'InterestGrowthIcon', 'JCBIcon', 'MapMarkerClusterIcon', 'MapMarkerSingleIcon', 'MapOpenedIcon', 'MasterCardIcon', 'MirIcon', 'MoneyInsuranceIcon', 'NewDocIcon', 'OfficeIcon', 'PackA4Icon', 'PassSendIcon', 'PercentIcon', 'PowerIcon', 'PumpkinIcon', 'ResponseFailIcon', 'ResponseOKIcon', 'SignDocsIcon', 'SoundIcon', 'UnionPayIcon', 'UserGeoLocationIcon', 'VisaIcon', 'WateringCanIcon'
 ]);
 
 export enum IconMap {

package/mobile/src/icons/MailIcon.svg

@@ -1 +1,4 @@
-<svg title="E-mail" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path stroke="#7D7E7F" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M22 12.98v2.52c0 3.5-2 5-5 5H7c-3 0-5-1.5-5-5v-7c0-3.5 2-5 5-5h10c3 0 5 1.5 5 5"/><path stroke="#7D7E7F" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="m17 9-3.13 2.5c-1.03.82-2.72.82-3.75 0L7 9"/></svg>
+<svg title="E-mail" isInverse="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M22 12.98v2.52c0 3.5-2 5-5 5H7c-3 0-5-1.5-5-5v-7c0-3.5 2-5 5-5h10c3 0 5 1.5 5 5"/>
+  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="m17 9-3.13 2.5c-1.03.82-2.72.82-3.75 0L7 9"/>
+</svg>

package/mobile/src/icons/PhoneIcon.svg

@@ -1 +1,3 @@
-<svg title="Телефон" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path stroke="#7D7E7F" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M9.39 6.01c.18.25.31.48.4.7.09.21.14.42.14.61 0 .24-.07.48-.21.71-.13.23-.32.47-.56.71l-.76.79c-.11.11-.16.24-.16.4 0 .08.01.15.03.23.03.08.06.14.08.2.18.33.49.76.93 1.28.45.52.93 1.05 1.45 1.58.54.53 1.06 1.02 1.59 1.47.52.44.95.74 1.29.92.05.02.11.05.18.08.08.03.16.04.25.04.17 0 .3-.06.41-.17l.76-.75c.25-.25.49-.44.72-.56.23-.14.46-.21.71-.21.19 0 .39.04.61.13.22.09.45.22.7.39l3.31 2.35c.26.18.44.39.55.64.1.25.16.5.16.78 0 .36-.08.73-.25 1.09-.17.36-.39.7-.68 1.02-.49.54-1.03.93-1.64 1.18-.6.25-1.25.38-1.95.38-1.02 0-2.11-.24-3.26-.73s-2.3-1.15-3.44-1.98a28.75 28.75 0 0 1-3.28-2.8 28.414 28.414 0 0 1-2.79-3.27c-.82-1.14-1.48-2.28-1.96-3.41C2.24 8.67 2 7.58 2 6.54c0-.68.12-1.33.36-1.93.24-.61.62-1.17 1.15-1.67C4.15 2.31 4.85 2 5.59 2c.28 0 .56.06.81.18.26.12.49.3.67.56"/></svg>
+<svg title="Телефон" isInverse="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M9.39 6.01c.18.25.31.48.4.7.09.21.14.42.14.61 0 .24-.07.48-.21.71-.13.23-.32.47-.56.71l-.76.79c-.11.11-.16.24-.16.4 0 .08.01.15.03.23.03.08.06.14.08.2.18.33.49.76.93 1.28.45.52.93 1.05 1.45 1.58.54.53 1.06 1.02 1.59 1.47.52.44.95.74 1.29.92.05.02.11.05.18.08.08.03.16.04.25.04.17 0 .3-.06.41-.17l.76-.75c.25-.25.49-.44.72-.56.23-.14.46-.21.71-.21.19 0 .39.04.61.13.22.09.45.22.7.39l3.31 2.35c.26.18.44.39.55.64.1.25.16.5.16.78 0 .36-.08.73-.25 1.09-.17.36-.39.7-.68 1.02-.49.54-1.03.93-1.64 1.18-.6.25-1.25.38-1.95.38-1.02 0-2.11-.24-3.26-.73s-2.3-1.15-3.44-1.98a28.75 28.75 0 0 1-3.28-2.8 28.414 28.414 0 0 1-2.79-3.27c-.82-1.14-1.48-2.28-1.96-3.41C2.24 8.67 2 7.58 2 6.54c0-.68.12-1.33.36-1.93.24-.61.62-1.17 1.15-1.67C4.15 2.31 4.85 2 5.59 2c.28 0 .56.06.81.18.26.12.49.3.67.56"/>
+</svg>

package/mobile/src/icons/RutubeIcon.svg

@@ -1 +1 @@
-<svg title="Лого «Rutube»" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><g fill="#1C1C1C" clip-path="url(#clip0_21939_18954)"><path d="M18.165 4.692a1.835 1.835 0 1 0 0-3.67 1.835 1.835 0 0 0 0 3.67ZM12.711 4.489H-.187v14.338h3.59v-4.665h6.88l3.138 4.665h4.02l-3.462-4.686c1.075-.172 1.85-.58 2.322-1.226.473-.644.71-1.676.71-3.052V8.788c0-.817-.087-1.462-.237-1.956A3.268 3.268 0 0 0 16 5.521a3.5 3.5 0 0 0-1.333-.796c-.516-.15-1.16-.236-1.956-.236Zm-.58 6.513H3.403V7.65h8.728c.494 0 .838.086 1.01.236.172.15.28.43.28.839v1.204c0 .43-.108.709-.28.86-.172.15-.516.214-1.01.214Z"/></g><defs><clipPath id="clip0_21939_18954"><path fill="#fff" d="M0 0h20v20H0z"/></clipPath></defs></svg>
+<svg title="Лого «Rutube»" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><g fill="currentColor" clip-path="url(#clip0_21939_18954)"><path d="M18.165 4.692a1.835 1.835 0 1 0 0-3.67 1.835 1.835 0 0 0 0 3.67ZM12.711 4.489H-.187v14.338h3.59v-4.665h6.88l3.138 4.665h4.02l-3.462-4.686c1.075-.172 1.85-.58 2.322-1.226.473-.644.71-1.676.71-3.052V8.788c0-.817-.087-1.462-.237-1.956A3.268 3.268 0 0 0 16 5.521a3.5 3.5 0 0 0-1.333-.796c-.516-.15-1.16-.236-1.956-.236Zm-.58 6.513H3.403V7.65h8.728c.494 0 .838.086 1.01.236.172.15.28.43.28.839v1.204c0 .43-.108.709-.28.86-.172.15-.516.214-1.01.214Z"/></g><defs><clipPath id="clip0_21939_18954"><path fill="#fff" d="M0 0h20v20H0z"/></clipPath></defs></svg>

package/mobile/src/model/AlignStyles.ts

@@ -0,0 +1 @@
+export const AlignStyles = 'text-left';

package/mobile/src/services/search/search.ts

@@ -1,6 +1,6 @@
 import { compareBy, desc } from '../../utils/Comparator';
+import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance';
 import { zip } from '../../utils/zip';
-import { jaroWinklerDistance } from './jaroWinklerDistance';
 import { joinMaps } from './joinMaps';
 import { textRank } from './textRank';
 import { tokenize } from './tokenize';

package/mobile/src/services/search/textRank.ts

@@ -1,6 +1,6 @@
+import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance';
 import { max } from '../../utils/maxBy';
 import { sum } from '../../utils/sum';
-import { jaroWinklerDistance } from './jaroWinklerDistance';
 import { tokenize } from './tokenize';
 
 export const textRank =

package/mobile/src/services/search/useSearch.ts

@@ -1,9 +1,9 @@
 import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import type { Nullable } from '../../utils/Nullable';
+import { useDebouncedEffect } from '@redneckz/uni-jsx/lib/hooks/useDebouncedEffect';
 import { fetchJSON } from '../../utils/fetchJSON';
 import { joinPath } from '../../utils/url';
-import { useDebouncedEffect } from '../../utils/useDebouncedEffect';
 import { CorpusItem, SearchIndex, search } from './search';
 
 const SEARCH_INDEX_FILENAME = 'search.index.json';

package/mobile/src/ui-kit/BaseFiltration/BaseFiltrationInner.tsx

@@ -1,28 +1,25 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { renderBlocksList } from '../../BlockRenderer/renderBlockList';
-import type { IconName } from '../../icons/IconName';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import { style } from '../../utils/style';
 import { BaseFiltrationInnerContent, NotFound } from './BaseFiltrationContent';
-import { checkShouldRenderBlock } from './checkShouldRenderBlock';
 import { DefaultFoldButton } from '../Foldable/DefaultFoldButton';
 import { Foldable } from '../Foldable/Foldable';
 import { FoldableSection } from '../Foldable/FoldableSection';
 import { Headline } from '../../components/Headline/Headline';
+import type { IconName } from '../../icons/IconName';
+import type { UniBlockProps } from '../../model/JSXBlock';
+import type { BlockDef } from '../../model/ContentPageDef';
 
 const ICONS: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
 
 const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs border-box';
 
 interface BaseFiltrationInnerProps extends BaseFiltrationInnerContent, UniBlockProps {
-  filtrationState?: Record<string, any>;
+  blocksToRender?: BlockDef[];
 }
 
 export const BaseFiltrationInner = JSX<BaseFiltrationInnerProps>(
-  ({ label = '', filtrationState = {}, topItemsCount = 0, block, notFound, ...rest }) => {
-    const blocksToRender =
-      block?.blocks?.filter((b) => checkShouldRenderBlock(filtrationState, b.content || {})) || [];
-
+  ({ label = '', blocksToRender = [], topItemsCount = 0, block, notFound, ...rest }) => {
     const [visibleBlocks, hiddenBlocks] =
       topItemsCount > 0
         ? [blocksToRender.slice(0, topItemsCount), blocksToRender.slice(topItemsCount)]

package/mobile/src/ui-kit/BaseFiltration/getBadgeCount.ts

@@ -1,6 +1,6 @@
 import type { BlockDef } from '../../model/ContentPageDef';
-import { checkShouldRenderBlock } from '../../ui-kit/BaseFiltration/checkShouldRenderBlock';
+import { shouldRenderBlock } from './shouldRenderBlock';
 import type { BaseFilter } from './useHotFilters';
 
 export const getBadgeCount = (blocks: BlockDef[] = [], filter: BaseFilter = {}) =>
-  blocks.filter(({ content = {} }) => checkShouldRenderBlock(filter, content)).length;
+  blocks.filter(({ content = {} }) => shouldRenderBlock(filter, content)).length;