@redneckz/wildless-cms-uni-blocks 0.11.2 → 0.12.3

package/mobile/src/components/ProductBlock/ProductBlockInner.tsx

@@ -1,63 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
-import { Img } from '../../ui-kit/Img/Img';
-import { List } from '../../ui-kit/List/List';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { BaseTile } from '../BaseTile/BaseTile';
-import { Headline } from '../Headline/Headline';
-import type { ProductBlockInnerContent } from './ProductBlockContent';
-import { renderBenefit } from './renderBenefit';
-
-export type ProductBlockInnerProps = ProductBlockInnerContent & UniBlockProps;
-
-export const ProductBlockInner = JSX<ProductBlockInnerProps>(
-  ({
-    className,
-    version = 'primary',
-    headlineVersion = 'L',
-    title,
-    description,
-    benefits,
-    benefitsVersion,
-    items,
-    isDotted = true,
-    __html,
-    buttons,
-    image,
-    directionRight = true,
-  }) => {
-    const benefitsWithLabel = benefits?.filter((_) => _.label);
-    const img = image?.src ? <Img className="mt-[-50px]" image={image} /> : null;
-
-    return (
-      <BaseTile
-        className={className}
-        insetTitle={
-          <Headline
-            className="max-w-[600px] xl:max-w-[728px]"
-            title={title}
-            description={description}
-            headlineVersion={headlineVersion}
-            align="text-left"
-            isPadding={false}
-          />
-        }
-        {...(directionRight ? { rightImage: img } : { leftImage: img })}
-        buttons={renderButtonsSection(buttons)}
-      >
-        {benefitsWithLabel?.length ? (
-          <div className="flex flex-wrap gap-6">
-            {benefitsWithLabel.map(renderBenefit(version, benefitsVersion))}
-          </div>
-        ) : null}
-        {__html ? (
-          <div className="mt-5">
-            <RichText __html={__html} />
-          </div>
-        ) : null}
-        {items?.length ? <List className="mt-5" items={items} isDotted={isDotted} /> : null}
-      </BaseTile>
-    );
-  },
-);

package/mobile/src/components/ProductBlock/renderBenefit.tsx

@@ -1,9 +0,0 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { IconVersion } from '../../model/IconVersion';
-import { BenefitItem } from '../../ui-kit/BenefitItem/BenefitItem';
-import type { BenefitItemProps } from '../../ui-kit/BenefitItem/BenefitItemProps';
-
-export const renderBenefit =
-  (version: BlockVersion = 'primary', benefitsVersion: IconVersion = 'normal') =>
-  (props: BenefitItemProps, i: number) =>
-    <BenefitItem key={String(i)} version={version} benefitsVersion={benefitsVersion} {...props} />;

package/mobile/src/ui-kit/BenefitItem/BenefitItemProps.ts

@@ -1,38 +0,0 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { DefaultListItemType } from '../../model/DefaultListItemType';
-import type { DescriptionProps, LabelProps } from '../../model/HeadlineType';
-import type { IconVersion } from '../../model/IconVersion';
-import type { IconProps } from '../../model/Picture';
-import type { RichTextItem } from '../../model/RichTextItem';
-
-export interface BenefitItemCommonProps {
-  /** @hidden */
-  benefitsVersion?: IconVersion;
-  /** @hidden */
-  version?: BlockVersion;
-  /** @hidden */
-  className?: string;
-}
-
-export type BenefitItemProps = DescriptionProps & LabelProps & IconProps;
-
-/**
- * @title Стандартный бенефит
- */
-type DefaultBenefit = BenefitItemProps & DefaultListItemType;
-
-/**
- * @title Преимущество
- * @default {
- *  "type": "default"
- * }
- */
-export type ComplexBenefitProps = DefaultBenefit | RichTextItem;
-
-/**
- * @title Преимущество
- */
-export type BenefitsProps = BenefitItemCommonProps & {
-  /** @title Список преимуществ */
-  benefits?: ComplexBenefitProps[];
-};

package/mobile/src/ui-kit/Img/ImgInner.tsx

@@ -1,30 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { Icon } from '../Icon/Icon';
-import { ImgAsPicture } from './ImgAsPicture';
-import type { ImageProps } from './ImgProps';
-
-export const ImgInner = JSX<ImageProps>(
-  ({ className = '', image, imageClassName = '', isMobile, pathPrefix, ...iconProps }) => {
-    if (!image?.src && !image?.icon) {
-      return null;
-    }
-
-    return image.icon ? (
-      <Icon
-        className={className}
-        imageClassName={imageClassName}
-        iconVersion={image?.iconVersion}
-        name={image.icon}
-        {...iconProps}
-      />
-    ) : (
-      <ImgAsPicture
-        className={className}
-        imageClassName={imageClassName}
-        image={image}
-        isMobile={isMobile}
-        pathPrefix={pathPrefix}
-      />
-    );
-  },
-);

package/mobile/src/ui-kit/SwipeListControl/SwipeListControlProps.ts

@@ -1,31 +0,0 @@
-import type { SwipeListControlContent } from './SwipeListControlContent';
-
-/**
- * @title Вид
- * @enumNames ["Горизонтальный", "Вертикальный"]
- */
-export type SwipeListControlType = 'horizontal-list' | 'vertical-list';
-
-/**
- * @title Минимальная высота
- * @enumNames ['Стандартная', 'Маленькая']
- */
-export type ContainerMinHeight = 866 | 720;
-
-export interface SwipeContainerProps {
-  /** @hidden */
-  gap?: number;
-  /** @hidden */
-  padding?: number;
-  listType?: SwipeListControlType;
-  minHeight?: ContainerMinHeight;
-}
-
-/**
- * @title Swipe-контроллер
- */
-export interface SwipeListControlProps extends SwipeListControlContent, SwipeContainerProps {
-  className?: string;
-  /** @hidden */
-  onVisibleIndicesChange?: (indices: number[]) => void;
-}

package/src/components/BaseTile/BaseTile.tsx

@@ -1,43 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { VNode } from '../../model/VNode';
-import { style } from '../../utils/style';
-
-interface BaseTileProps extends UniBlockProps {
-  title?: VNode;
-  insetTitle?: VNode;
-  leftImage?: VNode;
-  rightImage?: VNode;
-  backImage?: VNode;
-  buttons?: VNode;
-}
-
-export const BaseTile = JSX<BaseTileProps>(
-  ({
-    className,
-    title = '',
-    insetTitle = '',
-    buttons,
-    leftImage,
-    rightImage,
-    backImage,
-    children,
-  }) => (
-    <div className={style('relative flex flex-col font-sans', className)}>
-      {backImage ? <div className="absolute bottom-0 right-0 z-0">{backImage}</div> : null}
-      {title}
-      <div className="grow relative flex flex-wrap sm:flex-nowrap justify-between items-stretch gap-8">
-        {renderImageContainer(leftImage)}
-        <div className={style('flex flex-col gap-8', leftImage ? '' : 'grow')}>
-          {insetTitle}
-          <div className="grow">{children}</div>
-          {buttons}
-        </div>
-        {renderImageContainer(rightImage, { className: '-order-1 sm:order-1' })}
-      </div>
-    </div>
-  ),
-);
-
-const renderImageContainer = (image: VNode, { className }: { className?: string } = {}) =>
-  image ? <div className={style('flex-none', className)}>{image}</div> : null;

package/src/components/BaseTile/getTileHeadingType.ts

@@ -1,12 +0,0 @@
-import { getColSpan } from '../../utils/getColSpan';
-
-export function getTileHeadingType(className = '') {
-  const colSpan = getColSpan(className);
-  if (colSpan <= 4) {
-    return 'S';
-  } else if (colSpan <= 8) {
-    return 'M';
-  } else {
-    return 'L';
-  }
-}

package/src/components/BaseTile/getTileMinHeight.ts

@@ -1,12 +0,0 @@
-import { getColSpan } from '../../utils/getColSpan';
-
-export function getTileMinHeight(className = '') {
-  const colSpan = getColSpan(className);
-  if (colSpan <= 6) {
-    return 'min-h-[300px]';
-  } else if (colSpan <= 8) {
-    return 'min-h-[320px]';
-  } else {
-    return 'min-h-[360px]';
-  }
-}

package/src/components/ButtonBlock/ButtonBlock.example.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "href": "#",
-      "text": "Кнопка",
-      "target": "_blank",
-      "version": "primary",
-      "icon": { "format": "webp", "size": { "width": 24, "height": 24 } },
-      "iconRight": { "format": "webp", "size": { "width": 24, "height": 24 } }
-    }
-  }
-}

package/src/components/ButtonBlock/ButtonBlock.fixture.tsx

@@ -1,19 +0,0 @@
-import '../../setup-fixture';
-
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-import { ButtonBlock } from './ButtonBlock';
-
-const button: ButtonWithIconProps = {
-  href: '/credit-cards',
-  text: 'Подробнее',
-  target: '_blank',
-  version: 'primary',
-};
-
-export default {
-  default: (
-    <div className="container grid grid-cols-12 p-4">
-      <ButtonBlock className="col-span-12" button={button} />
-    </div>
-  ),
-};

package/src/components/ButtonBlock/ButtonBlock.ui.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "icon": {
-        "ui:field": "icon"
-      },
-      "iconRight": {
-        "ui:field": "icon"
-      }
-    }
-  }
-}

package/src/components/ButtonBlock/ButtonBlockContent.ts

@@ -1,9 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-  /** @title Кнопка */
-  button?: ButtonWithIconProps;
-}

package/src/components/MobileAppTile/MobileAppTile.mobile.tsx

@@ -1,33 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { MobileAppTileContent } from './MobileAppTileContent';
-
-import { Logo } from '../../ui-kit/Logo/Logo';
-import { style } from '../../utils/style';
-
-export interface MobileAppTileProps extends MobileAppTileContent, UniBlockProps {}
-
-export const MobileAppTile = JSX<MobileAppTileProps>(
-  ({ className = '', title = 'Мобильное приложение', description, href = '#' }) => {
-    return (
-      <div
-        className={style(
-          'col-span-12 rounded-md cursor-pointer p-4 bg-secondary-light font-sans',
-          className,
-        )}
-      >
-        {href ? (
-          <div className="flex">
-            <div className="flex justify-center align-middle rounded-md bg-primary-main w-12 h-12">
-              <Logo className="w-8" bgColor="transparent" showTitle />
-            </div>
-            <a href={href} target="_blank" className="flex flex-col justify-center pl-3">
-              <div className="text-s font-medium mb-[3px]">{title}</div>
-              <div className="text-s text-secondary-text">{description}</div>
-            </a>
-          </div>
-        ) : null}
-      </div>
-    );
-  },
-);

package/src/components/PictureText/renderBenefit.tsx

@@ -1,34 +0,0 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import { BenefitItem } from '../../ui-kit/BenefitItem/BenefitItem';
-import type { ComplexBenefitProps } from '../../ui-kit/BenefitItem/BenefitItemProps';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { assertUnreachable } from '../../utils/assertUnreachable';
-
-// TODO: Create universal function for this case
-export const renderBenefit =
-  // Linter doesn't understand that switch processes all cases
-  // eslint-disable-next-line consistent-return
-  (version: BlockVersion) => (benefit: ComplexBenefitProps, i: number) => {
-    const { type } = benefit;
-
-    if (!(type === 'default' || type === 'rte')) {
-      return null;
-    }
-
-    switch (type) {
-      case 'default':
-        return (
-          <BenefitItem
-            key={String(i)}
-            icon={benefit.icon}
-            label={benefit.label}
-            description={benefit.description}
-            version={version}
-          />
-        );
-      case 'rte':
-        return <RichText __html={benefit.__html} />;
-      default:
-        assertUnreachable(benefit);
-    }
-  };

package/src/components/ProductBlock/ProductBlockInner.tsx

@@ -1,63 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
-import { Img } from '../../ui-kit/Img/Img';
-import { List } from '../../ui-kit/List/List';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { BaseTile } from '../BaseTile/BaseTile';
-import { Headline } from '../Headline/Headline';
-import type { ProductBlockInnerContent } from './ProductBlockContent';
-import { renderBenefit } from './renderBenefit';
-
-export type ProductBlockInnerProps = ProductBlockInnerContent & UniBlockProps;
-
-export const ProductBlockInner = JSX<ProductBlockInnerProps>(
-  ({
-    className,
-    version = 'primary',
-    headlineVersion = 'L',
-    title,
-    description,
-    benefits,
-    benefitsVersion,
-    items,
-    isDotted = true,
-    __html,
-    buttons,
-    image,
-    directionRight = true,
-  }) => {
-    const benefitsWithLabel = benefits?.filter((_) => _.label);
-    const img = image?.src ? <Img className="mt-[-50px]" image={image} /> : null;
-
-    return (
-      <BaseTile
-        className={className}
-        insetTitle={
-          <Headline
-            className="max-w-[600px] xl:max-w-[728px]"
-            title={title}
-            description={description}
-            headlineVersion={headlineVersion}
-            align="text-left"
-            isPadding={false}
-          />
-        }
-        {...(directionRight ? { rightImage: img } : { leftImage: img })}
-        buttons={renderButtonsSection(buttons)}
-      >
-        {benefitsWithLabel?.length ? (
-          <div className="flex flex-wrap gap-6">
-            {benefitsWithLabel.map(renderBenefit(version, benefitsVersion))}
-          </div>
-        ) : null}
-        {__html ? (
-          <div className="mt-5">
-            <RichText __html={__html} />
-          </div>
-        ) : null}
-        {items?.length ? <List className="mt-5" items={items} isDotted={isDotted} /> : null}
-      </BaseTile>
-    );
-  },
-);

package/src/components/ProductBlock/renderBenefit.tsx

@@ -1,9 +0,0 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { IconVersion } from '../../model/IconVersion';
-import { BenefitItem } from '../../ui-kit/BenefitItem/BenefitItem';
-import type { BenefitItemProps } from '../../ui-kit/BenefitItem/BenefitItemProps';
-
-export const renderBenefit =
-  (version: BlockVersion = 'primary', benefitsVersion: IconVersion = 'normal') =>
-  (props: BenefitItemProps, i: number) =>
-    <BenefitItem key={String(i)} version={version} benefitsVersion={benefitsVersion} {...props} />;

package/src/ui-kit/BenefitItem/BenefitItemProps.ts

@@ -1,38 +0,0 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { DefaultListItemType } from '../../model/DefaultListItemType';
-import type { DescriptionProps, LabelProps } from '../../model/HeadlineType';
-import type { IconVersion } from '../../model/IconVersion';
-import type { IconProps } from '../../model/Picture';
-import type { RichTextItem } from '../../model/RichTextItem';
-
-export interface BenefitItemCommonProps {
-  /** @hidden */
-  benefitsVersion?: IconVersion;
-  /** @hidden */
-  version?: BlockVersion;
-  /** @hidden */
-  className?: string;
-}
-
-export type BenefitItemProps = DescriptionProps & LabelProps & IconProps;
-
-/**
- * @title Стандартный бенефит
- */
-type DefaultBenefit = BenefitItemProps & DefaultListItemType;
-
-/**
- * @title Преимущество
- * @default {
- *  "type": "default"
- * }
- */
-export type ComplexBenefitProps = DefaultBenefit | RichTextItem;
-
-/**
- * @title Преимущество
- */
-export type BenefitsProps = BenefitItemCommonProps & {
-  /** @title Список преимуществ */
-  benefits?: ComplexBenefitProps[];
-};

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

@@ -1,5 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { ImgInner } from './ImgInner';
-import type { ImageProps } from './ImgProps';
-
-export const Img = JSX<ImageProps>((props) => <ImgInner {...props} isMobile={true} />);

package/src/ui-kit/Img/ImgInner.tsx

@@ -1,30 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { Icon } from '../Icon/Icon';
-import { ImgAsPicture } from './ImgAsPicture';
-import type { ImageProps } from './ImgProps';
-
-export const ImgInner = JSX<ImageProps>(
-  ({ className = '', image, imageClassName = '', isMobile, pathPrefix, ...iconProps }) => {
-    if (!image?.src && !image?.icon) {
-      return null;
-    }
-
-    return image.icon ? (
-      <Icon
-        className={className}
-        imageClassName={imageClassName}
-        iconVersion={image?.iconVersion}
-        name={image.icon}
-        {...iconProps}
-      />
-    ) : (
-      <ImgAsPicture
-        className={className}
-        imageClassName={imageClassName}
-        image={image}
-        isMobile={isMobile}
-        pathPrefix={pathPrefix}
-      />
-    );
-  },
-);

package/src/ui-kit/SwipeListControl/SwipeListControlProps.ts

@@ -1,31 +0,0 @@
-import type { SwipeListControlContent } from './SwipeListControlContent';
-
-/**
- * @title Вид
- * @enumNames ["Горизонтальный", "Вертикальный"]
- */
-export type SwipeListControlType = 'horizontal-list' | 'vertical-list';
-
-/**
- * @title Минимальная высота
- * @enumNames ['Стандартная', 'Маленькая']
- */
-export type ContainerMinHeight = 866 | 720;
-
-export interface SwipeContainerProps {
-  /** @hidden */
-  gap?: number;
-  /** @hidden */
-  padding?: number;
-  listType?: SwipeListControlType;
-  minHeight?: ContainerMinHeight;
-}
-
-/**
- * @title Swipe-контроллер
- */
-export interface SwipeListControlProps extends SwipeListControlContent, SwipeContainerProps {
-  className?: string;
-  /** @hidden */
-  onVisibleIndicesChange?: (indices: number[]) => void;
-}