@redneckz/wildless-cms-uni-blocks 0.10.10 → 0.11.0

package/mobile/src/components/LinkList/LinkList.tsx

@@ -1,29 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { LinkProps } from '../../model/LinkProps';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import type { LinkListContent } from './LinkListContent';
-
-export interface LinkListProps extends LinkListContent, UniBlockProps {}
-
-export const LinkList = JSX<LinkListProps>(({ className = '', documents, ...rest }) => (
-  <BlockWrapper className={`mt-2.5 ${className}`} {...rest}>
-    <ul className="flex flex-col text-s text-secondary-text p-0">
-      {documents?.length ? renderLinkListItem(documents) : null}
-    </ul>
-  </BlockWrapper>
-));
-
-const renderLinkListItem = (documents: LinkProps[]) => {
-  return documents.map((doc, i) => {
-    const { text, ...linkProps } = doc;
-
-    return (
-      <li key={`list_item_${String(i)}`} className="mb-4 list-none">
-        <a className="hover:text-primary-main" role="link" {...linkProps}>
-          {text ? text : null}
-        </a>
-      </li>
-    );
-  });
-};

package/mobile/src/components/LinkList/LinkListContent.ts

@@ -1,10 +0,0 @@
-import type { UniBlockContent } from '../../model/JSXBlock';
-import type { LinkProps } from '../../model/LinkProps';
-
-/**
- * @title Список документов
- */
-export type LinkListContent = UniBlockContent & {
-  /** @title Список */
-  documents?: LinkProps[];
-};

package/mobile/src/ui-kit/SearchBar/SearchBarInner.tsx

@@ -1,41 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { CloseButton } from '../Dialog/CloseButton';
-import { useDialog } from '../Dialog/useDialog';
-import { useDialogHandlers } from '../Dialog/useDialogHandlers';
-import { SEARCH_DIALOG_ID } from '../SearchDialog/SearchDialog';
-import { SearchInput } from '../SearchDialog/SearchInput';
-
-export interface SearchBarInnerProps {
-  isMobile?: boolean;
-  className?: string;
-}
-
-const MIN_QUERY_LEN = 3;
-
-export const SearchBarInner = JSX<SearchBarInnerProps>(({ className, isMobile }) => {
-  const [value, setValue] = useState('');
-
-  const resetQueryOnDialogClose = useCallback(() => setValue(''), []);
-  useDialogHandlers({ onClose: resetQueryOnDialogClose });
-
-  const { open } = useDialog(SEARCH_DIALOG_ID);
-
-  const handleInitialInputChange = useCallback((_: string) => {
-    setValue(_);
-    if (isQueryLongEnough(_)) {
-      open(_);
-    }
-  }, []);
-
-  return (
-    <div className={className}>
-      <SearchInput isMobile={isMobile} value={value} onChange={handleInitialInputChange} />
-      {isMobile ? (
-        <CloseButton className="absolute top-2 right-3" onClick={resetQueryOnDialogClose} />
-      ) : null}
-    </div>
-  );
-});
-
-const isQueryLongEnough = (_: string) => _ && _.length >= MIN_QUERY_LEN;

package/src/components/BaseTile/BaseTileProps.ts

@@ -1,15 +0,0 @@
-import type { AlignType } from '../../model/AlignType';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { VNode } from '../../model/VNode';
-import type { HeadingType } from '../../ui-kit/Heading/HeadingProps';
-import type { ListContent } from '../../ui-kit/List/ListContent';
-
-export interface BaseTileCommonProps extends UniBlockProps, ListContent {
-  title?: VNode;
-  headingType?: HeadingType;
-  description?: string;
-  image?: VNode;
-  list?: string;
-  buttons?: VNode;
-  align?: AlignType;
-}

package/src/components/Filtration/Filtration.tsx

@@ -1,38 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { useForm } from '../../hooks/useForm';
-import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { Button } from '../../ui-kit/Button/Button';
-import { style } from '../../utils/style';
-import type { FiltrationContent } from './FiltrationContent';
-import { FiltrationInner } from './FiltrationInner';
-import { renderFormItem } from './renderFormItem';
-
-interface FiltrationProps extends FiltrationContent, UniBlockProps {}
-
-const initialFiltrationState = {};
-
-export const Filtration: JSXBlock<FiltrationProps> = JSX<FiltrationProps>(
-  ({ className, filtrationSchema = {}, resetButton, ...rest }) => {
-    const [filtrationState, { field, reset }] = useForm(initialFiltrationState);
-
-    return (
-      <BlockWrapper className={style(className)} version="transparent" {...rest}>
-        <form className="flex justify-between bg-white p-9 mb-1">
-          <div className="flex gap-11">
-            {Object.keys(filtrationSchema).map(renderFormItem(filtrationSchema, field))}
-          </div>
-          {resetButton ? (
-            <div>
-              <Button className="w-72 ml-3" onClick={reset} {...resetButton} />
-            </div>
-          ) : null}
-        </form>
-        <FiltrationInner filtrationState={filtrationState} {...rest} />
-      </BlockWrapper>
-    );
-  },
-);
-
-Filtration.childrenTypes = ['ProductTile'];
-Filtration.childSchema = (content?: FiltrationContent) => content?.filtrationSchema || {};

package/src/components/Filtration/checkShouldRenderBlock.ts

@@ -1,18 +0,0 @@
-const isSingularFieldMatch =
-  <P extends Partial<Record<string, any>>, T extends P>(key: string, pattern: P) =>
-  (target: T) =>
-    pattern[key] === undefined || pattern[key] === target[key];
-
-const isMultipleFieldMatch =
-  <P extends Partial<Record<string, any[]>>, T extends P>(key: string, pattern: P) =>
-  (target: T) =>
-    pattern[key] === undefined || pattern[key]?.every((_) => target[key]?.includes(_));
-
-export const checkShouldRenderBlock = (pattern: Record<string, any>, target: Record<string, any>) =>
-  Object.entries(pattern)
-    .map(([key, subPattern]) =>
-      Array.isArray(subPattern)
-        ? isMultipleFieldMatch(key, pattern)
-        : isSingularFieldMatch(key, pattern),
-    )
-    .every((predicate) => predicate(target));

package/src/components/Filtration/renderFormItem.tsx

@@ -1,36 +0,0 @@
-import type { FormFieldRegisterer } from '../../hooks/useForm';
-import { SlideCheckboxGroup } from '../../ui-kit/SlideCheckboxGroup/SlideCheckboxGroup';
-import { Text } from '../../ui-kit/Text/Text';
-import type { FiltrationSchema, StringArray } from './FiltrationContent';
-
-export const renderFormItem =
-  (filtrationSchema: FiltrationSchema, field: FormFieldRegisterer<any>) => (key: string) => {
-    const item = filtrationSchema[key as keyof typeof filtrationSchema];
-    const type = item?.type;
-
-    switch (type) {
-      case 'array':
-        return renderCheckboxes(key, field)(item);
-      default:
-        return null;
-    }
-  };
-
-const renderCheckboxes = (key: string, field: FormFieldRegisterer<any>) => (item?: StringArray) => {
-  const options =
-    item?.items?.enum?.map((e, i) => ({ value: e, title: item?.items?.enumNames?.[i] || '' })) ||
-    [];
-
-  return (
-    <div key={key}>
-      {item?.title ? (
-        <div className="mb-4">
-          <Text size="text-m" font="font-light" color="text-secondary-text">
-            {item.title}
-          </Text>
-        </div>
-      ) : null}
-      <SlideCheckboxGroup items={options} multiple {...field<string, string[] | undefined>(key)} />
-    </div>
-  );
-};

package/src/components/Footer/TextInformation.mobile.tsx

@@ -1,22 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { FooterLink } from './FooterLink';
-import { TextInformationLink } from './TextInformationLink';
-
-export const TextInformation = JSX<FooterLink>(({ className = '', links }) => {
-  return (
-    <div className={className}>
-      <div className="py-6">
-        <span className="text-xs-light text-secondary-text">
-          {`\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.`}
-        </span>
-      </div>
-      {links?.length ? (
-        <div className={`flex flex-col justify-start items-start gap-2`}>
-          {links.map((_, i) => (
-            <TextInformationLink key={String(i)} index={i} {..._} />
-          ))}
-        </div>
-      ) : null}
-    </div>
-  );
-});

package/src/components/LinkList/LinkList.example.json

@@ -1,23 +0,0 @@
-{
-  "content": {
-    "documents": [
-      {
-        "text": "Документ №1",
-        "href": "/documents/document1.doc"
-      },
-      {
-        "text": "Документ №2",
-        "href": "/documents/document2.rtf",
-        "target": "_blank"
-      },
-      {
-        "text": "Документ №3",
-        "href": "/abc3/map.jpeg"
-      },
-      {
-        "text": "Документ №4",
-        "href": "/abc/map.rar"
-      }
-    ]
-  }
-}

package/src/components/LinkList/LinkList.fixture.tsx

@@ -1,12 +0,0 @@
-import '../../setup-fixture';
-
-import { LinkList } from './LinkList';
-import { linkDocsContentExample } from './linkListContentExample';
-
-export default {
-  default: (
-    <div className="container grid grid-cols-12">
-      <LinkList className="col-span-12" {...linkDocsContentExample} />
-    </div>
-  ),
-};

package/src/components/LinkList/LinkList.tsx

@@ -1,29 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { LinkProps } from '../../model/LinkProps';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import type { LinkListContent } from './LinkListContent';
-
-export interface LinkListProps extends LinkListContent, UniBlockProps {}
-
-export const LinkList = JSX<LinkListProps>(({ className = '', documents, ...rest }) => (
-  <BlockWrapper className={`mt-2.5 ${className}`} {...rest}>
-    <ul className="flex flex-col text-s text-secondary-text p-0">
-      {documents?.length ? renderLinkListItem(documents) : null}
-    </ul>
-  </BlockWrapper>
-));
-
-const renderLinkListItem = (documents: LinkProps[]) => {
-  return documents.map((doc, i) => {
-    const { text, ...linkProps } = doc;
-
-    return (
-      <li key={`list_item_${String(i)}`} className="mb-4 list-none">
-        <a className="hover:text-primary-main" role="link" {...linkProps}>
-          {text ? text : null}
-        </a>
-      </li>
-    );
-  });
-};

package/src/components/LinkList/LinkListContent.ts

@@ -1,10 +0,0 @@
-import type { UniBlockContent } from '../../model/JSXBlock';
-import type { LinkProps } from '../../model/LinkProps';
-
-/**
- * @title Список документов
- */
-export type LinkListContent = UniBlockContent & {
-  /** @title Список */
-  documents?: LinkProps[];
-};

package/src/components/LinkList/linkListContentExample.ts

@@ -1,22 +0,0 @@
-import type { LinkListContent } from './LinkListContent';
-
-export const linkDocsContentExample: LinkListContent = {
-  documents: [
-    { text: 'target self', href: '/abc1/cooldoc/', target: '_self' },
-    { text: 'target blank', href: '/abc2/wtf/', target: '_blank' },
-    { text: 'GlassIcon', href: '/abc3/map/' },
-    { text: 'no icon', href: '/abc4' },
-    { text: 'документ 5', href: '/abc5' },
-    { text: 'документ 6', href: '/abc6/abc' },
-    { text: 'Text text text', href: '/abc7/yolo' },
-    {
-      text: 'Some more generic text to stretch item, and even more, more text, and more generic text, and even more, more text, and even more',
-      href: '/abc8/archive/',
-    },
-    { text: 'И ещё немного текста', href: '/abc9/' },
-    {
-      text: 'Форматируем, сортируем, смотрим как отображается...',
-      href: '/abc10/',
-    },
-  ],
-};

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

@@ -1,17 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import type { ProductBlockContent } from './ProductBlockContent';
-import { ProductBlockInner } from './ProductBlockInner';
-
-export interface ProductBlockProps extends ProductBlockContent, UniBlockProps {}
-
-export const ProductBlock = JSX<ProductBlockProps>((props /* Get rid of image and benefits */) => {
-  const { className = '', ...rest } = props;
-
-  return (
-    <BlockWrapper className={`px-4 py-6 ${className}`} {...rest}>
-      <ProductBlockInner {...props} />
-    </BlockWrapper>
-  );
-});

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

@@ -1,65 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { Picture } from '../../model/Picture';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
-import { Img } from '../../ui-kit/Img/Img';
-import { List } from '../../ui-kit/List/List';
-import { Text } from '../../ui-kit/Text/Text';
-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 = '',
-    headlineVersion = 'L',
-    benefits,
-    benefitsVersion = 'normal',
-    buttons,
-    image,
-    items,
-    isDotted = true,
-    label,
-    title,
-    description,
-    ...rest
-  }) => (
-    <BlockWrapper className={`w-full ${className}`} {...rest}>
-      <div>
-        {label ? renderLabel(label) : null}
-        <Headline
-          className="!p-0 max-w-[600px]"
-          title={title}
-          description={description}
-          headlineVersion={headlineVersion}
-          align="text-left"
-        />
-        <BaseTile buttons={renderButtonsSection(buttons, { className: 'mt-5', isVertical: true })}>
-          {benefits?.filter((_) => _.label)?.length ? (
-            <div className="mt-3">{benefits.map(renderBenefit('primary', benefitsVersion))}</div>
-          ) : null}
-          {items?.length ? (
-            <List className="mt-3 text-m" items={items} isDotted={isDotted} />
-          ) : null}
-        </BaseTile>
-      </div>
-      {renderImage(image)}
-    </BlockWrapper>
-  ),
-);
-
-function renderImage(image?: Picture) {
-  return image?.src ? (
-    <Img imageClassName="mt-5 mx-auto block" image={{ className: 'block', ...image }} />
-  ) : null;
-}
-
-const renderLabel = (label: string) => (
-  <div className="w-fit px-2.5 py-1.5 mb-5 rounded-md border-2 border-solid border-secondary-hover">
-    <Text color="text-primary-main group-data-secondary:text-white/80">{label}</Text>
-  </div>
-);

package/src/components/RollupItem/RollupItem.mobile.tsx

@@ -1,122 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { renderChildren } from '../../BlockRenderer/renderChildren';
-import type { IconName } from '../../icons/IconName';
-import { BlockVersion } from '../../model/BlockVersion';
-import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
-import { Picture } from '../../model/Picture';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { DefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton';
-import { Foldable } from '../../ui-kit/Foldable/Foldable';
-import type { FoldablePartProps } from '../../ui-kit/Foldable/FoldablePartProps';
-import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
-import { Img } from '../../ui-kit/Img/Img';
-import { Text } from '../../ui-kit/Text/Text';
-import { style } from '../../utils/style';
-import type { RollupItemContent } from './RollupItemContent';
-
-export interface RollupItemProps extends RollupItemContent, UniBlockProps {}
-
-export const RollupItem: JSXBlock<RollupItemProps> = JSX<RollupItemProps>(
-  ({
-    className = '',
-    label = 'Развернуть',
-    isExpanded,
-    isFoldButtonOnTop = true,
-    version = 'primary',
-    ...rest
-  }) => {
-    return (
-      <BlockWrapper
-        className={style('border-b border-solid border-main-divider w-full', className)}
-        tag="div"
-        version="transparent"
-        {...rest}
-      >
-        <Foldable
-          isFoldButtonOnTop={isFoldButtonOnTop}
-          unfoldedByDefault={isExpanded}
-          renderFoldableSection={({ isUnfolded }) => (
-            <FoldableSection
-              className="flex flex-wrap group-last:last:pb-0 gap-5 [&>*]:p-0"
-              isUnfolded={isUnfolded}
-            >
-              {renderChildren(rest)}
-            </FoldableSection>
-          )}
-          renderFoldButton={({ isUnfolded, onToggle }) =>
-            renderFoldButton({ version, label, isUnfolded, onToggle })
-          }
-        />
-      </BlockWrapper>
-    );
-  },
-);
-
-RollupItem.childrenTypes = {
-  exclude: ['RollupItem'],
-};
-
-interface FoldButtonProps extends FoldablePartProps {
-  version?: BlockVersion;
-  label?: string;
-  className?: string;
-  primaryIcon?: Picture;
-}
-
-const renderFoldButton = ({
-  version,
-  label: defaultLabel,
-  isUnfolded,
-  onToggle,
-  className = '',
-  primaryIcon,
-}: FoldButtonProps) => {
-  const label = defaultLabel || (isUnfolded ? 'Скрыть' : 'Развернуть');
-
-  return version === 'primary' ? (
-    renderPrimaryFoldButton({
-      label,
-      icon: isUnfolded ? 'MinusIcon' : 'PlusIcon',
-      onToggle,
-      className,
-      primaryIcon,
-    })
-  ) : (
-    <DefaultFoldButton
-      label={label}
-      icon={isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon'}
-      onClick={onToggle}
-    />
-  );
-};
-
-interface PrimaryFoldButtonProps {
-  label?: string;
-  icon?: IconName;
-  primaryIcon?: Picture;
-  onToggle?: () => void;
-  onClick?: () => void;
-  className?: string;
-}
-
-const renderPrimaryFoldButton = ({
-  label,
-  icon,
-  primaryIcon,
-  onToggle,
-}: PrimaryFoldButtonProps) => (
-  <button
-    className={`border-none bg-transparent flex justify-between text-left w-full text-primary-text group cursor-pointer py-3.5 px-0`}
-    onClick={onToggle}
-  >
-    <div className="flex group-hover:text-primary-main">
-      {primaryIcon ? (
-        <Img image={primaryIcon} className="mr-3 flex-shrink-0" width="24" height="24" />
-      ) : null}
-      <Text size="text-m-title-xs" font="font-medium">
-        {label}
-      </Text>
-    </div>
-    <Img className="flex-shrink-0" image={{ icon }} width="24" height="24" />
-  </button>
-);

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

@@ -1,6 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { SearchBarInner, SearchBarInnerProps } from './SearchBarInner';
-
-export const SearchBar = JSX<SearchBarInnerProps>((props) => (
-  <SearchBarInner {...props} isMobile={true} />
-));

package/src/ui-kit/SearchBar/SearchBarInner.tsx

@@ -1,41 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { CloseButton } from '../Dialog/CloseButton';
-import { useDialog } from '../Dialog/useDialog';
-import { useDialogHandlers } from '../Dialog/useDialogHandlers';
-import { SEARCH_DIALOG_ID } from '../SearchDialog/SearchDialog';
-import { SearchInput } from '../SearchDialog/SearchInput';
-
-export interface SearchBarInnerProps {
-  isMobile?: boolean;
-  className?: string;
-}
-
-const MIN_QUERY_LEN = 3;
-
-export const SearchBarInner = JSX<SearchBarInnerProps>(({ className, isMobile }) => {
-  const [value, setValue] = useState('');
-
-  const resetQueryOnDialogClose = useCallback(() => setValue(''), []);
-  useDialogHandlers({ onClose: resetQueryOnDialogClose });
-
-  const { open } = useDialog(SEARCH_DIALOG_ID);
-
-  const handleInitialInputChange = useCallback((_: string) => {
-    setValue(_);
-    if (isQueryLongEnough(_)) {
-      open(_);
-    }
-  }, []);
-
-  return (
-    <div className={className}>
-      <SearchInput isMobile={isMobile} value={value} onChange={handleInitialInputChange} />
-      {isMobile ? (
-        <CloseButton className="absolute top-2 right-3" onClick={resetQueryOnDialogClose} />
-      ) : null}
-    </div>
-  );
-});
-
-const isQueryLongEnough = (_: string) => _ && _.length >= MIN_QUERY_LEN;