@redneckz/wildless-cms-uni-blocks 0.7.1 → 0.7.2

package/mobile/src/ui-kit/Button/ButtonSection.tsx

@@ -1,51 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { Picture } from '../../model/Picture';
-import { Img } from '../Img/Img';
-import { Button } from './Button';
-import type { ButtonContent, ButtonWithIconProps } from './ButtonProps';
-
-export interface ButtonSectionProps extends ButtonContent {
-  className?: string;
-}
-
-interface RenderButtonProps {
-  button: ButtonWithIconProps;
-  buttonClassName?: string;
-  index?: number;
-}
-export const ButtonSection = JSX<ButtonSectionProps>(({ className = '', buttons }) =>
-  buttons && buttons?.length ? (
-    <div className={className}>
-      {buttons.map((button, index) => renderButton({ button, index }))}
-    </div>
-  ) : null,
-);
-
-export function renderButton({ button, buttonClassName, index }: RenderButtonProps) {
-  const { icon, iconRight, version, text, ...rest } = button;
-
-  const iconVersion = version === 'secondary' ? 'color' : 'white';
-  const leftIcon = renderButtonIcon({ ...icon, iconVersion: iconVersion } as Picture);
-  const rightIcon = renderButtonIcon({ ...iconRight, iconVersion: iconVersion } as Picture);
-
-  return text ? (
-    <Button
-      key={index ? String(index) : ''}
-      className={buttonClassName}
-      appendLeft={leftIcon}
-      appendRight={rightIcon}
-      version={version}
-      text={text}
-      {...rest}
-    />
-  ) : null;
-}
-
-const renderButtonIcon = (icon: Picture) => {
-  if (!icon?.icon && !icon?.src) {
-    return null;
-  }
-  const iconWidth = icon?.size?.width ? `${icon.size.width}` : '24';
-
-  return <Img image={icon} width={iconWidth} height="24" asSVG />;
-};

package/mobile/src/utils/style2className.ts

@@ -1,3 +0,0 @@
-export function style2className(style: string[] | undefined | null): string {
-  return style ? style.filter(Boolean).join(' ') : '';
-}

package/src/components/Calculator/renderButtonSection.tsx

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-import { ButtonSection } from '../../ui-kit/Button/ButtonSection';
-
-export function renderButtonSection(buttons?: ButtonWithIconProps[]) {
-  return buttons?.length ? (
-    <ButtonSection buttons={buttons} className="flex flex-col mt-7 gap-2" />
-  ) : null;
-}

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

@@ -1,128 +0,0 @@
-import '../../setup-fixture';
-
-import type { Picture } from '../../model/Picture';
-import { Headline } from './Headline';
-import type { HeadlineContent } from './HeadlineContent';
-
-export const HEADLINE: HeadlineContent = {
-  title: 'Своя кредитная карта',
-  description: 'Карта работает в 180 странах мира. Бесплатное снятие наличных в любых банкоматах.',
-  align: 'text-center',
-  bgColorHeadline: 'transparent',
-};
-
-const image: Picture = {
-  src: 'globe-1.png',
-  format: 'webp',
-  size: {
-    width: 180,
-    height: 180,
-  },
-};
-
-const defaultProps: HeadlineContent = {
-  title: 'Копите в нескольких валютах',
-  description:
-    'Откройте мультивалютный вклад, чтобы распределить свои вложения. Это до 4 счетов в разных валютах внутри одного вклада',
-  image: image,
-};
-
-const primaryProps: HeadlineContent = {
-  ...defaultProps,
-  bgColorHeadline: 'primary',
-};
-
-const secondaryProps: HeadlineContent = {
-  ...defaultProps,
-  bgColorHeadline: 'secondary',
-};
-
-export default {
-  'default left alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...defaultProps} align="text-left" />
-    </div>
-  ),
-  'default center alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...defaultProps} align="text-center" />
-    </div>
-  ),
-  'default right alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...defaultProps} align="text-right" />
-    </div>
-  ),
-
-  'primary left alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...primaryProps} align="text-left" />
-    </div>
-  ),
-  'primary center alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...primaryProps} align="text-center" />
-    </div>
-  ),
-  'primary right alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...primaryProps} align="text-right" />
-    </div>
-  ),
-  'primary without description': (
-    <div className="container grid grid-cols-12">
-      <Headline
-        className="col-span-12"
-        title="Копите в нескольких валютах"
-        image={image}
-        bgColorHeadline="primary"
-      />
-    </div>
-  ),
-  'primary without title': (
-    <div className="container grid grid-cols-12">
-      <Headline
-        className="col-span-12"
-        description="Откройте мультивалютный вклад, чтобы распределить свои вложения. Это до 4 счетов в разных валютах внутри одного вклада"
-        image={image}
-        bgColorHeadline="primary"
-      />
-    </div>
-  ),
-
-  'secondary left alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...secondaryProps} align="text-left" />
-    </div>
-  ),
-  'secondary center alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...secondaryProps} align="text-center" />
-    </div>
-  ),
-  'secondary right alignment': (
-    <div className="container grid grid-cols-12">
-      <Headline className="col-span-12" {...secondaryProps} align="text-right" />
-    </div>
-  ),
-  'secondary without description': (
-    <div className="container grid grid-cols-12">
-      <Headline
-        className="col-span-12"
-        title="Копите в нескольких валютах"
-        image={image}
-        bgColorHeadline="secondary"
-      />
-    </div>
-  ),
-  'secondary without title': (
-    <div className="container grid grid-cols-12">
-      <Headline
-        className="col-span-12"
-        description="Откройте мультивалютный вклад, чтобы распределить свои вложения. Это до 4 счетов в разных валютах внутри одного вклада"
-        image={image}
-        bgColorHeadline="secondary"
-      />
-    </div>
-  ),
-};

package/src/components/Headline/Headline.mobile.tsx

@@ -1,40 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import { Heading } from '../../ui-kit/Heading/Heading';
-import { Img } from '../../ui-kit/Img/Img';
-import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
-import type { HeadlineContent } from './HeadlineContent';
-import { headlineStyles } from './headlineStyles';
-
-export interface HeadlineProps extends UniBlockProps, HeadlineContent {}
-
-export const Headline = JSX<HeadlineProps>(
-  ({
-    className = '',
-    title,
-    description,
-    image,
-    bgColorHeadline = 'transparent',
-    align = 'text-left',
-  }) => {
-    const style = headlineStyles[bgColorHeadline];
-
-    return (
-      <section className={`px-4 py-6 flex flex-col gap-2.5 ${style.wrapper} ${className}`}>
-        {title ? (
-          <Heading headingType="h2" className={`${style.titleColor} ${align}`} title={title} />
-        ) : null}
-        {description ? (
-          <Paragraph color={style.descriptionColor || style.titleColor} size="text-m" align={align}>
-            {description}
-          </Paragraph>
-        ) : null}
-        {image?.src && (
-          <div className="mt-2.5 mx-auto flex justify-center">
-            <Img image={image} />
-          </div>
-        )}
-      </section>
-    );
-  },
-);

package/src/components/Headline/headlineStyles.ts

@@ -1,25 +0,0 @@
-import type { BlockVersionWithTransparent } from '../../model/BlockVersion';
-import type { TextColor } from '../../ui-kit/Text/TextProps';
-
-export const headlineStyles: Record<
-  BlockVersionWithTransparent,
-  {
-    wrapper: string;
-    titleColor: TextColor;
-    descriptionColor?: TextColor;
-  }
-> = {
-  transparent: {
-    wrapper: 'bg-transparent',
-    titleColor: 'text-primary-text',
-  },
-  primary: {
-    wrapper: 'bg-white',
-    titleColor: 'text-primary-text',
-  },
-  secondary: {
-    wrapper: 'bg-primary-main',
-    titleColor: 'text-white',
-    descriptionColor: 'text-white/80',
-  },
-};

package/src/components/StepsBlock/renderItems.tsx

@@ -1,23 +0,0 @@
-import { List } from '../../ui-kit/List/List';
-import type { BlockVersion } from '../../model/BlockVersion';
-
-export const renderItems = ({
-  items,
-  isDotted = true,
-  version = 'primary',
-  className = '',
-}: {
-  items?: string[];
-  isDotted?: boolean;
-  version?: BlockVersion;
-  className?: string;
-}) =>
-  items ? (
-    <List
-      className={className}
-      version={version}
-      items={items}
-      listItemSize="M"
-      isDotted={isDotted}
-    />
-  ) : null;

package/src/model/BorderVersion.ts

@@ -1,10 +0,0 @@
-/**
- * @title Цвет бордера
- * @enumNames ["Основной", "Второстепенный"]
- */
-export type BorderVersion = 'primary' | 'secondary';
-
-export const BorderVersionStyleMap: Record<BorderVersion, string> = {
-  primary: 'border-gray',
-  secondary: 'border-white/50',
-};

package/src/ui-kit/Button/ButtonSection.tsx

@@ -1,51 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { Picture } from '../../model/Picture';
-import { Img } from '../Img/Img';
-import { Button } from './Button';
-import type { ButtonContent, ButtonWithIconProps } from './ButtonProps';
-
-export interface ButtonSectionProps extends ButtonContent {
-  className?: string;
-}
-
-interface RenderButtonProps {
-  button: ButtonWithIconProps;
-  buttonClassName?: string;
-  index?: number;
-}
-export const ButtonSection = JSX<ButtonSectionProps>(({ className = '', buttons }) =>
-  buttons && buttons?.length ? (
-    <div className={className}>
-      {buttons.map((button, index) => renderButton({ button, index }))}
-    </div>
-  ) : null,
-);
-
-export function renderButton({ button, buttonClassName, index }: RenderButtonProps) {
-  const { icon, iconRight, version, text, ...rest } = button;
-
-  const iconVersion = version === 'secondary' ? 'color' : 'white';
-  const leftIcon = renderButtonIcon({ ...icon, iconVersion: iconVersion } as Picture);
-  const rightIcon = renderButtonIcon({ ...iconRight, iconVersion: iconVersion } as Picture);
-
-  return text ? (
-    <Button
-      key={index ? String(index) : ''}
-      className={buttonClassName}
-      appendLeft={leftIcon}
-      appendRight={rightIcon}
-      version={version}
-      text={text}
-      {...rest}
-    />
-  ) : null;
-}
-
-const renderButtonIcon = (icon: Picture) => {
-  if (!icon?.icon && !icon?.src) {
-    return null;
-  }
-  const iconWidth = icon?.size?.width ? `${icon.size.width}` : '24';
-
-  return <Img image={icon} width={iconWidth} height="24" asSVG />;
-};

package/src/utils/style2className.ts

@@ -1,3 +0,0 @@
-export function style2className(style: string[] | undefined | null): string {
-  return style ? style.filter(Boolean).join(' ') : '';
-}