@redneckz/wildless-cms-uni-blocks 0.16.3-isr → 0.16.4-credit

package/src/components/ProductBlock/ProductBlock.fixture.tsx

@@ -130,12 +130,6 @@ const options = {
   page: { common: require('../../../cosmos-static/wcms-resources/common.json') },
 } as BlockRendererOptions;
 
-const UNIT_BLOCK_DATA = {
-  prefix: 'от',
-  unit: 5,
-  suffix: 'баллов',
-};
-
 export default {
   'primary with back button': (
     <div className="container grid grid-cols-12">
@@ -294,26 +288,4 @@ export default {
       />
     </div>
   ),
-  'with nested unit block': (
-    <div className="container grid grid-cols-12">
-      <ProductBlock
-        className="col-span-6"
-        options={options}
-        title="300 приветственных баллов"
-        description="За операции оплаты товаров и услуг на общую сумму 1000 рублей"
-        block={{ blocks: [{ type: 'UnitBlock', content: UNIT_BLOCK_DATA }] }}
-      />
-    </div>
-  ),
-  'with nested unit block full width': (
-    <div className="container grid grid-cols-12">
-      <ProductBlock
-        className="col-span-12"
-        options={options}
-        title="300 приветственных баллов"
-        description="За операции оплаты товаров и услуг на общую сумму 1000 рублей"
-        block={{ blocks: [{ type: 'UnitBlock', content: UNIT_BLOCK_DATA }] }}
-      />
-    </div>
-  ),
 };

package/src/components/ProductBlock/ProductBlock.tsx

@@ -22,5 +22,4 @@ export const ProductBlock = UniBlock<ProductBlockProps>(
       />
     </BlockWrapper>
   ),
-  { childrenTypes: ['UnitBlock'] },
 );

package/src/components/ProductBlock/renderBackwardButton.tsx

@@ -1,13 +1,13 @@
+import type { TextProps } from '../../model/HeadlineType';
 import { type LinkButtonVersion } from '../../model/LinkButtonVersion';
 import { Img } from '../../ui-kit/Img/Img';
 import { getRegularButtonClasses } from '../../ui-kit/LinkButton/getRegularButtonClasses';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { style } from '../../utils/style';
 
-type BackwardButtonProps = {
+type BackwardButtonProps = TextProps & {
   version: LinkButtonVersion;
   handleClick: () => void;
-  text: string | undefined;
   alwaysVisible?: boolean;
 };
 

package/src/components/StepsBlock/StepsBlockContent.ts

@@ -1,6 +1,6 @@
 import { type BlockVersion } from '../../model/BlockVersion';
 import { type BulletsProps } from '../../model/Bullets';
-import { type DescriptionProps, type LabelProps, type TitleProps } from '../../model/HeadlineType';
+import type { DescriptionProps, LabelProps, TitleProps } from '../../model/HeadlineType';
 import { type IconProps } from '../../model/Picture';
 import { type ButtonsSectionContent } from '../../ui-kit/LinkButton/ButtonsSectionContent';
 import { type LinkButtonContent } from '../../ui-kit/LinkButton/LinkButtonContent';

package/src/components/StepsBlock/StepsBlockStyleMaps.ts

@@ -1,5 +1,6 @@
-export type StyleType = {
-  description: string;
+import type { DescriptionProps } from '../../model/HeadlineType';
+
+export type StyleType = DescriptionProps & {
   iconText: string;
   iconBackground: string;
   iconConnector: string;

package/src/components/StickyBottomMenu/BurgerMenuDialog.tsx

@@ -5,17 +5,17 @@ import { type JSONRefObject } from '../../data/JSONRefObject';
 import { type StickyMenuItem } from '../../data/StickyMobileData';
 import { env } from '../../Env';
 import { useLocation } from '../../hooks/useLocation';
+import type { OnCloseProps } from '../../model/OnCloseProps';
 import { useDialog } from '../../ui-kit/DialogManager/useDialog';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { LocationDialog } from '../../ui-kit/LocationDialog/LocationDialog';
 import { getBasePath } from '../../utils/getBasePath';
 import { StickyBottomMenuDialog } from './StickyBottomMenuDialog';
 
-export interface BurgerMenuDialogProps {
+export interface BurgerMenuDialogProps extends OnCloseProps {
   menuRef: { current?: HTMLDivElement | null };
   menuItem?: StickyMenuItem;
   locationDialogProps?: HeaderData & JSONRefObject;
-  onClose?: () => void;
 }
 
 export const BurgerMenuDialog = JSX<BurgerMenuDialogProps>(

package/src/components/StickyBottomMenu/StickyBottomMenuDialog.tsx

@@ -1,13 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
+import type { OnCloseProps } from '../../model/OnCloseProps';
 import { type VNode } from '../../model/VNode';
 import { CloseButton } from '../../ui-kit/DialogManager/CloseButton';
 import { type PreventableEvent } from '../../ui-kit/PreventableEvent';
 import { style } from '../../utils/style';
 
-export interface StickyBottomMenuDialogProps {
-  className?: string;
+export interface StickyBottomMenuDialogProps extends ComponentType, OnCloseProps {
   head?: VNode;
-  onClose?: () => void;
   onClick?: (e: PreventableEvent) => void;
 }
 

package/src/components/StickyBottomMenu/useBottomMenuItemDialog.tsx

@@ -1,15 +1,15 @@
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { type StickyMenuItem } from '../../data/StickyMobileData';
+import type { OnCloseProps } from '../../model/OnCloseProps';
 import { useDialogManager } from '../../ui-kit/DialogManager/useDialogManager';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { StickyBottomMenuDialog } from './StickyBottomMenuDialog';
 
-interface BottomMenuItemDialog {
+interface BottomMenuItemDialog extends OnCloseProps {
   menuRef?: { current: HTMLDivElement | null };
   dialogRef?: { current: HTMLDivElement | null };
   leftItems: StickyMenuItem[];
   rightItems: StickyMenuItem[];
-  onClose?: () => void;
 }
 
 export const useBottomMenuItemDialog = ({

package/src/components/StickyBottomMenu/useBurgerMenuDialog.tsx

@@ -2,6 +2,7 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { type HeaderData } from '../../data/HeaderData';
 import { type JSONRefObject } from '../../data/JSONRefObject';
 import { type StickyMenuItem } from '../../data/StickyMobileData';
+import type { OnCloseProps } from '../../model/OnCloseProps';
 import { isDialogOpen } from '../../ui-kit/DialogManager/isDialogOpen';
 import { useDialog } from '../../ui-kit/DialogManager/useDialog';
 import { useDialogsList } from '../../ui-kit/DialogManager/useDialogsList';
@@ -10,11 +11,10 @@ import { BurgerMenuDialog } from './BurgerMenuDialog';
 
 export const BURGER_MENU_DIALOG_ID = 'burgerMenuDialog';
 
-interface BurgerMenuDialog {
+interface BurgerMenuDialog extends OnCloseProps {
   menuRef: { current?: HTMLDivElement | null };
   centralMenuItem?: StickyMenuItem;
   locationDialogProps?: HeaderData & JSONRefObject;
-  onClose?: () => void;
 }
 
 export const useBurgerMenuDialog = ({

package/src/components/TabsLayout/renderTabsLayout.tsx

@@ -1,14 +1,14 @@
+import { type ComponentType } from '../../model/ComponentType';
 import { ScrollableTabsControl } from '../../ui-kit/TabsControl/ScrollableTabsControl';
 import { type TabItemBase } from '../../ui-kit/TabsControl/TabItem';
 import { type TabsControlProps, type TabsType } from '../../ui-kit/TabsControl/TabsControlProps';
 import { style } from '../../utils/style';
 
-interface RenderTabsProps {
+interface RenderTabsProps extends ComponentType {
   items: TabItemBase[];
   activeItem: TabItemBase;
   onChange: TabsControlProps['onChange'];
   tabsType?: TabsType;
-  className?: string;
 }
 
 const tabsStyle: Record<TabsType, { wrapper: string; component: string }> = {

package/src/components/TariffsTable/TableCarouselContainer.tsx

@@ -2,8 +2,6 @@ import { JSX } from '@redneckz/uni-jsx';
 import { type TableVersion } from '../../model/TableVersion';
 
 export interface TableCarouselContainerProps {
-  activeIndex: number;
-  columnWidth: number;
   version?: TableVersion;
 }
 
@@ -13,14 +11,9 @@ const carouselContainerClassesMap: Record<TableVersion, string> = {
 };
 
 export const TableCarouselContainer = JSX<TableCarouselContainerProps>(
-  ({ children, activeIndex, columnWidth, version = 'comparison' }) => (
-    <div className="flex flex-1 overflow-hidden">
-      <div
-        className={carouselContainerClassesMap[version]}
-        style={{ transform: `translateX(-${activeIndex * columnWidth}px)` }}
-      >
-        {children}
-      </div>
+  ({ children, version = 'comparison' }) => (
+    <div className="flex flex-1">
+      <div className={carouselContainerClassesMap[version]}>{children}</div>
     </div>
   ),
 );

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

@@ -29,67 +29,34 @@
         "data": [
           [
             {
-              "tableCellType": "LabelDescription",
               "label": "Ячейка 1-1",
               "description": "Описание для ячейки 2-1"
             },
             {
-              "tableCellType": "RichText",
               "isDotted": true,
-              "listItemSize": "M",
               "__html": "<ul><li>Элемент списка 1</li><li>Элемент списка 2</li><li>Элемент списка 3</li></ul>"
             },
             {
               "label": "Ячейка 1-2",
-              "tableCellType": "LabelDescription",
               "description": "Описание"
             },
             {
-              "tableCellType": "RichText",
               "isDotted": false,
-              "listItemSize": "M",
               "__html": "<ul><li>Элемент списка 1</li><li>Элемент списка 2</li><li>Элемент списка 3</li></ul>"
             }
           ],
           [
             {
-              "tableCellType": "LabelDescription",
               "label": "Ячейка 2-1"
             },
             {
-              "tableCellType": "RichText",
               "isDotted": true,
-              "listItemSize": "M",
               "__html": "<ul><li>Элемент списка 1</li><li>Элемент списка 2</li><li>Элемент списка 3</li></ul>"
             }
           ],
           [
             {
-              "label": "Ячейка 3-1",
-              "tableCellType": "LabelDescription"
-            },
-            {
-              "tableCellType": "Button",
-              "buttons": [
-                {
-                  "icon": {
-                    "icon": "AppleIcon"
-                  },
-                  "rounded": true,
-                  "version": "secondary",
-                  "href": "/",
-                  "target": "_blank"
-                },
-                {
-                  "icon": {
-                    "icon": "PlayMarketIcon"
-                  },
-                  "rounded": true,
-                  "version": "secondary",
-                  "href": "/",
-                  "target": "_blank"
-                }
-              ]
+              "label": "Ячейка 3-1"
             }
           ]
         ]

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

@@ -1,6 +1,8 @@
+// eslint-disable max-len
 import '../../setup-fixture';
 
 import {
+  columns,
   columnsTable,
   TARIFFS_TABLE_FIXTURE_EXAMPLE,
   TARIFFS_TABLE_INNER_TABLE_FIXTURE_EXAMPLE,
@@ -8,9 +10,13 @@ import {
 import { TariffsTable } from './TariffsTable';
 
 export default {
-  'default (vertical)': (
+  default: (
     <div className="container grid grid-cols-12">
-      <TariffsTable className="col-span-12" {...TARIFFS_TABLE_FIXTURE_EXAMPLE} />
+      <TariffsTable
+        className="col-span-12"
+        {...TARIFFS_TABLE_FIXTURE_EXAMPLE}
+        tariffsColumns={columns.slice(0, 1)}
+      />
     </div>
   ),
   '1 columns with inner table': (
@@ -22,4 +28,24 @@ export default {
       />
     </div>
   ),
+  '1 column': (
+    <div className="container grid grid-cols-12">
+      <TariffsTable
+        className="col-span-12"
+        {...TARIFFS_TABLE_FIXTURE_EXAMPLE}
+        tariffsColumns={Array(1).fill(columns).flat()}
+        hiddenRowsNum={2}
+      />
+    </div>
+  ),
+  '2 columns': (
+    <div className="container grid grid-cols-12">
+      <TariffsTable
+        className="col-span-12"
+        {...TARIFFS_TABLE_FIXTURE_EXAMPLE}
+        tariffsColumns={Array(2).fill(columns).flat()}
+        hiddenRowsNum={2}
+      />
+    </div>
+  ),
 };

package/src/components/TariffsTable/TariffsTable.tsx

@@ -1,21 +1,19 @@
-import { JSX } from '@redneckz/uni-jsx';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
-import { useCarouselControls } from '../../hooks/useCarouselControls';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { DefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton';
 import { Foldable } from '../../ui-kit/Foldable/Foldable';
 import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
+import { UniBlock } from '../../UniBlock/UniBlock';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 import { style } from '../../utils/style';
 import { Headline } from '../Headline/Headline';
-import { COLS_LENGTH_FOR_SCROLL } from './constants';
 import { type TariffsTableContent } from './TariffsTableContent';
 import { TariffsTableRow } from './TariffsTableRow';
 import { TariffsTableWrapper } from './TariffsTableWrapper';
 
 export interface TariffsTableProps extends TariffsTableContent, UniBlockProps {}
 
-export const TariffsTable = JSX<TariffsTableProps>(
+export const TariffsTable = UniBlock<TariffsTableProps>(
   ({
     className = '',
     title,
@@ -30,13 +28,8 @@ export const TariffsTable = JSX<TariffsTableProps>(
       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} />
+      <TariffsTableRow key={String(i)} row={row} {...rest} />
     ));
     const [visibleRows, hiddenRows] =
       hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
@@ -45,7 +38,7 @@ export const TariffsTable = JSX<TariffsTableProps>(
 
     return (
       <BlockWrapper
-        className={style('relative space-y-6xl @4xl:space-y-xl', className)}
+        className={style('relative space-y-xl', className)}
         defaultPadding="p-6xl"
         {...rest}
       >
@@ -59,14 +52,14 @@ export const TariffsTable = JSX<TariffsTableProps>(
         <div className="space-y-m overflow-hidden">
           {hiddenRowsNum > 0 ? (
             <Foldable>
-              <TariffsTableWrapper controls={controls}>
+              <TariffsTableWrapper>
                 {visibleRows}
                 <FoldableSection isUnfolded={isUnfolded}>{hiddenRows}</FoldableSection>
               </TariffsTableWrapper>
               <DefaultFoldButton className="text-h4" isUnfolded={isUnfolded} onClick={toggle} />
             </Foldable>
           ) : (
-            <TariffsTableWrapper controls={controls}>{rows}</TariffsTableWrapper>
+            <TariffsTableWrapper>{rows}</TariffsTableWrapper>
           )}
         </div>
       </BlockWrapper>

package/src/components/TariffsTable/TariffsTable.ui.json

@@ -5,9 +5,6 @@
         "data": {
           "items": {
             "items": {
-              "tableCellType": {
-                "ui:widget": "hidden"
-              },
               "image": {
                 "ui:field": "picture"
               },

package/src/components/TariffsTable/TariffsTableCell.tsx

@@ -1,48 +1,50 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { type TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
+import type { JSONRefObject } from '../../data/JSONRefObject';
+import { type OnCloseProps } from '../../model/onClose';
+import { TableInnerButton } from '../../ui-kit/InnerTable/InnerTableButton';
+import {
+  type TableFetchData,
+  type TariffsTableInnerContent,
+} from '../../ui-kit/InnerTable/InnerTableProps';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
+import { renderCell } from './renderCell';
 import { type CellDef } from './TariffsTableContent';
-import { RenderCellInner } from './TariffsTableRenderCell';
 
 export interface TariffTableContentProps {
-  openTableInnerIdx?: number;
-  setOpenTableInnerIdx: (props?: number) => void;
-  setTableInner: (props?: TariffsTableInnerContent) => void;
+  onSetTable: (props?: TariffsTableInnerContent) => void;
   tableInner?: TariffsTableInnerContent;
 }
 
-export interface TariffsTableCellProps extends TariffTableContentProps, UniBlockProps {
-  rowIdx: number;
-  cellIdx: number;
-  cells: CellDef[];
+type CellDefProps = CellDef & { tableSource?: JSONRefObject & TableFetchData };
+
+export interface TariffsTableCellProps
+  extends TariffTableContentProps,
+    UniBlockProps,
+    OnCloseProps {
+  cells: CellDefProps[];
 }
 
-export const TariffsTableCell = JSX<TariffsTableCellProps>(
-  ({
-    cells,
-    rowIdx,
-    cellIdx,
-    setTableInner,
-    tableInner,
-    openTableInnerIdx,
-    setOpenTableInnerIdx,
-  }) => (
-    <div className="w-80 flex-grow flex flex-col gap-m @4xl:gap-lg" role="cell">
+export const TariffsTableCell = JSX<TariffsTableCellProps>(({ cells, tableInner, onSetTable }) => {
+  return (
+    <div className="w-80 flex-grow flex flex-col gap-lg" role="cell">
       {cells?.length
-        ? cells.map((_, i) => (
-            <RenderCellInner
-              key={String(i)}
-              cell={_}
-              fieldIdx={i}
-              rowIdx={rowIdx}
-              cellIdx={cellIdx}
-              setTableInner={setTableInner}
-              tableInner={tableInner}
-              openTableInnerIdx={openTableInnerIdx}
-              setOpenTableInnerIdx={setOpenTableInnerIdx}
-            />
-          ))
+        ? cells.map((_, i) => {
+            if (_?.tableSource?.tableData) {
+              return (
+                <TableInnerButton
+                  key={String(i)}
+                  className="w-fit"
+                  isOpen={Boolean(tableInner)}
+                  onClick={() => {
+                    onSetTable(tableInner ? undefined : { tableSource: _.tableSource });
+                  }}
+                />
+              );
+            }
+
+            return renderCell(_, i);
+          })
         : null}
     </div>
-  ),
-);
+  );
+});

package/src/components/TariffsTable/TariffsTableContent.ts

@@ -1,34 +1,10 @@
-import { type DescriptionProps, type LabelProps, type TitleProps } from '../../model/HeadlineType';
+import type { DescriptionProps, LabelProps, TitleProps } from '../../model/HeadlineType';
 import { type IconProps } from '../../model/Picture';
 import { type ImageContent } from '../../ui-kit/Img/ImgProps';
 import { type TariffsTableInnerContent } from '../../ui-kit/InnerTable/InnerTableProps';
 import { type ButtonsSectionContent } from '../../ui-kit/LinkButton/ButtonsSectionContent';
 import { type RichTextProps } from '../../ui-kit/RichText/RichTextProps';
-import { type UniBlockContent, type UniBlockProps } from '../../UniBlock/UniBlockProps';
-
-/**
- * @hidden
- */
-export interface TariffsTableTile {
-  header: TariffsTableRowHeader;
-  data: CellDef[];
-}
-
-/**
- * @hidden
- */
-export interface TariffsTableProps extends UniBlockProps {
-  tiles?: TariffsTableTile[];
-}
-
-/**
- * @hidden
- */
-export interface TariffsTableCellIndexProps {
-  rowIdx: number;
-  cellIdx: number;
-  fieldIdx: number;
-}
+import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
 
 /**
  * @hidden
@@ -43,68 +19,15 @@ export type Data = {
  */
 export type TariffsTableRowHeader = TitleProps & IconProps;
 
-/**
- * @title Изображение
- */
-export type ImageCellDef = ImageContent & {
-  /** @default Img */
-  tableCellType: 'Img';
-};
-
-/**
- * @title Кнопки
- */
-export type ButtonsCellDef = ButtonsSectionContent & {
-  /** @default Buttons */
-  tableCellType: 'Buttons';
-};
-
-/**
- * @title Заголовок и описание
- */
-export type LabelDescriptionCell = LabelProps & DescriptionProps;
-
-/**
- * @title Заголовок и описание
- */
-export type LabelDescriptionCellDef = LabelDescriptionCell & {
-  /** @default LabelDescription */
-  tableCellType: 'LabelDescription';
-};
-
-/**
- * @title Список
- */
-export type RichTextDef = RichTextProps & {
-  /** @default RichText */
-  tableCellType: 'RichText';
-};
-
-/**
- * @title Таблица
- */
-export type InnerTableBlockDef = TariffsTableInnerContent & {
-  /** @default Table */
-  tableCellType: 'Table';
-};
-
-/** @title Не выбрано * */
-export type EmptyCellType = {
-  /** @default "" */
-  tableCellType: '';
-};
-
 /**
  * @title Содержимое ячейки
- * @default { "tableCellType": "" }
  */
-export type CellDef =
-  | EmptyCellType
-  | ImageCellDef
-  | ButtonsCellDef
-  | LabelDescriptionCellDef
-  | RichTextDef
-  | InnerTableBlockDef;
+export type CellDef = LabelProps &
+  DescriptionProps &
+  RichTextProps &
+  ImageContent &
+  TariffsTableInnerContent &
+  ButtonsSectionContent;
 
 /**
  * @title Ячейки