@redneckz/wildless-cms-uni-blocks 0.6.26 → 0.6.27

package/src/components/InsuranceAmountBlock/InsuranceAmountBlock.tsx

@@ -16,12 +16,11 @@ interface RenderNavButtonProps {
 export interface InsuranceAmountBlockProps extends InsuranceAmountBlockContent, UniBlockProps {}
 
 export const InsuranceAmountBlock = JSX<InsuranceAmountBlockProps>(
-  ({ className = '', context, title, insuranceTabs = [], button, ...rest }) => {
+  ({ className = '', title, insuranceTabs = [], button, ...rest }) => {
     const [activeSlideIndex, setActiveSlideIndex] = useState(0);
 
     return (
       <BlockWrapper
-        context={context}
         className={`box-border py-[50px] overflow-hidden relative font-sans w-100 bg-white ${className}`}
         {...rest}
       >
@@ -44,8 +43,6 @@ export const InsuranceAmountBlock = JSX<InsuranceAmountBlockProps>(
           role="list"
         >
           {renderInsuranceGalleries({
-            context,
-            className,
             insuranceTabs,
             button,
           })}
@@ -55,23 +52,12 @@ export const InsuranceAmountBlock = JSX<InsuranceAmountBlockProps>(
   },
 );
 
-const renderInsuranceGalleries = ({
-  insuranceTabs,
-  button,
-  context,
-  className = '',
-}: InsuranceAmountBlockProps) => {
+const renderInsuranceGalleries = ({ insuranceTabs, button }: InsuranceAmountBlockContent) => {
   const insuranceGalleries = insuranceTabs?.map((_) => _.cards);
 
   return insuranceGalleries?.length
     ? insuranceGalleries.map((cards, i) => (
-        <InsuranceAmountBlockInner
-          key={String(i)}
-          context={context}
-          className={className}
-          button={button}
-          cards={cards}
-        />
+        <InsuranceAmountBlockInner key={String(i)} button={button} cards={cards} />
       ))
     : null;
 };

package/src/components/InsuranceAmountBlock/InsuranceAmountBlockInner.tsx

@@ -1,6 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import { Button } from '../../ui-kit/Button/Button';
 import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import { renderArrows } from '../../ui-kit/Button/renderArrows';
@@ -8,7 +7,8 @@ import { Img } from '../../ui-kit/Img/Img';
 import { addSpacesBetweenNumbers } from '../../utils/addSpacesBetweenNumbers';
 import type { CardItem, InsuranceAmountBlockTab } from './InsuranceAmountBlockContent';
 
-export interface InsuranceAmountBlockInnerProps extends InsuranceAmountBlockTab, UniBlockProps {
+export interface InsuranceAmountBlockInnerProps extends InsuranceAmountBlockTab {
+  className?: string;
   button?: ButtonProps;
 }
 

package/src/components/InvestmentGallery/InvestmentGallery.fixture.tsx

@@ -1,5 +1,5 @@
 import type { Picture } from '../../model/Picture';
-import { context } from '../../react/setup-fixture';
+import '../../react/setup-fixture';
 import { InvestmentGallery, InvestmentGalleryProps } from './InvestmentGallery';
 
 const five: Picture = {
@@ -46,7 +46,6 @@ const cardCoomonProps = {
 };
 
 export const shortProps: InvestmentGalleryProps = {
-  context,
   title: 'Примеры еврооблигаций (Московская Биржа)',
   cards: [
     {

package/src/components/InvestmentGallery/InvestmentGallery.tsx

@@ -1,8 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import type { BlockVersion } from '../../model/BlockVersion';
 import { VersionStyleMap } from '../../model/BlockVersion';
+import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderArrows } from '../../ui-kit/Button/renderArrows';
 import { Heading } from '../../ui-kit/Heading/Heading';
@@ -11,7 +11,6 @@ import type {
   InvestmentGalleryCardTypes,
   InvestmentGalleryContent,
 } from './InvestmentGalleryContent';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
 
 const BLUR_BLOCK_CLASSES = 'absolute top-0 bottom-0 w-[84px]';
 const CARD_FULL_VIEW_COUNT = 1;
@@ -25,16 +24,13 @@ interface NavButtonsProps {
 }
 
 export const InvestmentGallery = JSX<InvestmentGalleryProps>(
-  ({ context, cards = [], className = '', title, version = 'primary', ...rest }) => {
+  ({ cards = [], className = '', title, version = 'primary', ...rest }) => {
     const [activeCardIndex, setActiveCardIndex] = useState(0);
     const cardWidth = 525;
 
     return (
       <BlockWrapper
-        context={context}
-        className={`relative font-sans p-9 overflow-hidden text-center 
-        ${VersionStyleMap[version]} 
-        ${className}`}
+        className={`relative font-sans p-9 overflow-hidden text-center ${VersionStyleMap[version]} ${className}`}
         {...rest}
       >
         {title ? <Heading headingType="h3" className="mb-9" title={title} /> : null}
@@ -44,9 +40,7 @@ export const InvestmentGallery = JSX<InvestmentGalleryProps>(
             style={{ transform: `translateX(-${activeCardIndex * cardWidth}px)` }}
             role="list"
           >
-            {cards?.length
-              ? cards.map(renderInvestmentGalleryCard(context, className, version))
-              : null}
+            {cards?.length ? cards.map(renderInvestmentGalleryCard(className, version)) : null}
           </div>
           {renderNavButtons({
             cardsCount: cards.length,
@@ -70,17 +64,8 @@ export const InvestmentGallery = JSX<InvestmentGalleryProps>(
 );
 
 const renderInvestmentGalleryCard =
-  (context: ContentPageContext, className: string, version?: BlockVersion) =>
-  (card: InvestmentGalleryCardTypes, i: number) =>
-    (
-      <InvestmentGalleryCard
-        key={String(i)}
-        className={className}
-        context={context}
-        version={version}
-        {...card}
-      />
-    );
+  (className: string, version?: BlockVersion) => (card: InvestmentGalleryCardTypes, i: number) =>
+    <InvestmentGalleryCard key={String(i)} className={className} version={version} {...card} />;
 
 const renderNavButtons = ({ cardsCount, activeCardIndex, setActiveCardIndex }: NavButtonsProps) => {
   const isUseSlider = cardsCount > CARD_FULL_VIEW_COUNT;

package/src/components/InvestmentGallery/InvestmentGalleryCard.tsx

@@ -1,7 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { BlockVersion } from '../../model/BlockVersion';
 import { BorderVersionStyleMap } from '../../model/BorderVersion';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import { Description } from '../../ui-kit/Description/Description';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
@@ -12,7 +11,8 @@ import type {
   InvestmentGalleryCardTypes,
 } from './InvestmentGalleryContent';
 
-export interface RecommendationCardProps extends InvestmentGalleryCardTypes, UniBlockProps {
+export interface RecommendationCardProps extends InvestmentGalleryCardTypes {
+  className?: string;
   version?: BlockVersion;
 }
 const getItemListFontSize = (colValue?: string) => (colValue === 'single' ? 'text-h6' : 'text-l');
@@ -26,7 +26,6 @@ export const InvestmentGalleryCard = JSX<RecommendationCardProps>(
   ({
     className = '',
     columnsMode = 'double',
-    context,
     description,
     additionalDescription,
     image,
@@ -49,12 +48,7 @@ export const InvestmentGalleryCard = JSX<RecommendationCardProps>(
           ${className}`}
         role="listitem"
       >
-        <BaseTile
-          context={context}
-          className="flex justify-between"
-          title={tileTitle}
-          image={tileImage}
-        >
+        <BaseTile className="flex justify-between" title={tileTitle} image={tileImage}>
           <div className="flex flex-col justify-between">
             <div className="flex itens-center justify-between mb-4">
               {description ? <Description className="text-h6" description={description} /> : null}

package/src/components/InvestmentInfo/InvestmentInfo.fixture.tsx

@@ -1,4 +1,4 @@
-import { context } from '../../react/setup-fixture';
+import '../../react/setup-fixture';
 import { InvestmentInfo } from './InvestmentInfo';
 import type { InvestmentInfoContent } from './InvestmentInfoContent';
 
@@ -100,7 +100,7 @@ export const INVESTMENT_INFO: InvestmentInfoContent = {
 export default {
   default: (
     <div className="container grid grid-cols-12">
-      <InvestmentInfo className="col-span-12" context={context} {...INVESTMENT_INFO} />
+      <InvestmentInfo className="col-span-12" {...INVESTMENT_INFO} />
     </div>
   ),
 };

package/src/components/InvestmentInfo/InvestmentInfo.tsx

@@ -31,7 +31,6 @@ export interface InvestmentInfoProps extends InvestmentInfoContent, UniBlockProp
 
 export const InvestmentInfo = JSX<InvestmentInfoProps>((props) => {
   const {
-    context,
     className = '',
     items,
     isDotted,
@@ -45,11 +44,7 @@ export const InvestmentInfo = JSX<InvestmentInfoProps>((props) => {
   }
 
   return (
-    <BlockWrapper
-      className={`font-sans bg-white px-9 py-12 ${className}`}
-      context={context}
-      {...rest}
-    >
+    <BlockWrapper className={`font-sans bg-white px-9 py-12 ${className}`} {...rest}>
       <div className="container text-m-light">
         {colums?.length ? (
           <div>

package/src/components/LikeControl/LikeControl.fixture.tsx

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

package/src/components/LikeControl/LikeControl.tsx

@@ -1,24 +1,20 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { handlerDecorator } from '../../hooks/handlerDecorator';
 import { useLikeService } from '../../hooks/useLikeService';
-import { defaultHandlerDecorator } from '../../hooks/useLink';
-import type { UniBlockProps } from '../../model/JSXBlock';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import { useRouter } from '../../hooks/useRouter';
 import { LikeButton } from '../../ui-kit/Button/LikeButton';
 
-export const LikeControl = JSX<UniBlockProps>(({ className, context, ...rest }) => {
-  const { useRouter, handlerDecorator = defaultHandlerDecorator } = context;
+interface LikeControlProps {
+  className?: string;
+}
 
+export const LikeControl = JSX<LikeControlProps>(({ className = '' }) => {
   const router = useRouter();
   const likeService = useLikeService(router.pathname);
 
   return (
-    <BlockWrapper
-      tag="div"
-      context={context}
-      className={`border-main border-2 border-solid bg-white flex w-[125px] items-center justify-center gap-3 p-2 font-sans ${
-        className || ''
-      }`}
-      {...rest}
+    <div
+      className={`border-main border-2 border-solid bg-white flex w-[125px] items-center justify-center gap-3 p-2 font-sans ${className}`}
     >
       <LikeButton
         onClick={handlerDecorator(likeService.like)}
@@ -30,6 +26,6 @@ export const LikeControl = JSX<UniBlockProps>(({ className, context, ...rest })
         ariaLabel="Поставить отметку «дизлайк»"
       />
       <span className="select-none">{likeService.likeCount}</span>
-    </BlockWrapper>
+    </div>
   );
 });

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

@@ -1,31 +1,21 @@
-import { mobileContext } from '../../react/setup-fixture';
+import '../../react/setup-fixture';
 import { LinkDocs } from './LinkDocs';
 import { linkDocsContentExample } from './linkDocsContentExample';
 
 export default {
   'vertical (default)': (
     <div className="container grid grid-cols-12">
-      <LinkDocs className="col-span-12" context={mobileContext} {...linkDocsContentExample} />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} />
     </div>
   ),
   'vertical, no border': (
     <div className="container grid grid-cols-12">
-      <LinkDocs
-        className="col-span-12"
-        context={mobileContext}
-        hasBorder={false}
-        {...linkDocsContentExample}
-      />
+      <LinkDocs className="col-span-12" hasBorder={false} {...linkDocsContentExample} />
     </div>
   ),
   'horizontal, swipe list': (
     <div className="container grid grid-cols-12">
-      <LinkDocs
-        className="col-span-12"
-        context={mobileContext}
-        {...linkDocsContentExample}
-        orientation="horizontal"
-      />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} orientation="horizontal" />
     </div>
   ),
 };

package/src/components/LinkDocs/LinkDocs.fixture.tsx

@@ -1,41 +1,26 @@
-import { context } from '../../react/setup-fixture';
+import '../../react/setup-fixture';
 import { LinkDocs } from './LinkDocs';
 import { linkDocsContentExample } from './linkDocsContentExample';
 
 export default {
   'two columns (default)': (
     <div className="container grid grid-cols-12">
-      <LinkDocs className="col-span-12" context={context} {...linkDocsContentExample} />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} />
     </div>
   ),
   'one column': (
     <div className="container grid grid-cols-12">
-      <LinkDocs
-        className="col-span-12"
-        context={context}
-        {...linkDocsContentExample}
-        columnsMode="single"
-      />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} columnsMode="single" />
     </div>
   ),
   'custom icon': (
     <div className="container grid grid-cols-12">
-      <LinkDocs
-        className="col-span-12"
-        context={context}
-        {...linkDocsContentExample}
-        icon={{ icon: 'GlassIcon' }}
-      />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} icon={{ icon: 'GlassIcon' }} />
     </div>
   ),
   'no icon': (
     <div className="container grid grid-cols-12">
-      <LinkDocs
-        className="col-span-12"
-        context={context}
-        {...linkDocsContentExample}
-        icon={{ icon: '' }}
-      />
+      <LinkDocs className="col-span-12" {...linkDocsContentExample} icon={{ icon: '' }} />
     </div>
   ),
 };

package/src/components/LinkDocs/LinkDocs.mobile.tsx

@@ -10,36 +10,29 @@ export interface LinkDocsProps extends LinkDocsContent, UniBlockProps {}
 export const LinkDocs = JSX<LinkDocsProps>(
   ({
     className = '',
-    context,
     title,
     description,
     icon = { icon: 'DocIconMonoColor' },
     documents,
     orientation = 'vertical',
     hasBorder = true,
-  }) => {
-    return (
-      <section
-        className={`font-sans text-primary-text py-6 px-4 bg-white overflow-x-hidden ${className}`}
-      >
-        <Headline
-          className={`!p-0 ${description ? 'gap-2' : 'gap-5'}`}
-          title={title}
-          description={description}
-          context={context}
-          align="center"
-        />
-        {orientation === 'vertical' ? (
-          <LinkDocsVerticalList hasBorder={hasBorder} documents={documents} icon={icon} />
-        ) : (
-          <LinkDocsHorizontalList
-            context={context}
-            hasBorder={hasBorder}
-            documents={documents}
-            icon={icon}
-          />
-        )}
-      </section>
-    );
-  },
+    ...rest
+  }) => (
+    <section
+      className={`font-sans text-primary-text py-6 px-4 bg-white overflow-x-hidden ${className}`}
+    >
+      <Headline
+        className={`!p-0 ${description ? 'gap-2' : 'gap-5'}`}
+        title={title}
+        description={description}
+        align="center"
+        {...rest}
+      />
+      {orientation === 'vertical' ? (
+        <LinkDocsVerticalList hasBorder={hasBorder} documents={documents} icon={icon} />
+      ) : (
+        <LinkDocsHorizontalList hasBorder={hasBorder} documents={documents} icon={icon} />
+      )}
+    </section>
+  ),
 );

package/src/components/LinkDocs/LinkDocs.tsx

@@ -14,7 +14,6 @@ export interface LinkDocsProps extends LinkDocsContent, UniBlockProps {}
 
 export const LinkDocs = JSX<LinkDocsProps>(
   ({
-    context,
     className = '',
     title,
     description,
@@ -23,29 +22,26 @@ export const LinkDocs = JSX<LinkDocsProps>(
     icon = { icon: 'DocIcon' },
     columnsMode = 'double',
     ...rest
-  }) => {
-    return (
-      <BlockWrapper
-        className={`font-sans text-primary-text p-[50px] bg-white ${className}`}
-        context={context}
+  }) => (
+    <BlockWrapper
+      className={`font-sans text-primary-text p-[50px] bg-white ${className}`}
+      {...rest}
+    >
+      <Headline
+        className="!p-0"
+        title={title}
+        description={description}
+        align={align}
+        headlineVersion="M"
+        as="h2"
         {...rest}
-      >
-        <Headline
-          className="!p-0"
-          title={title}
-          description={description}
-          context={context}
-          align={align}
-          headlineVersion="M"
-          as="h2"
-        />
-        <LinkDocsList
-          className={`mt-8 ${linkColumnsModeStyleMap[columnsMode]}`}
-          columnsMode={columnsMode}
-          documents={documents}
-          icon={icon}
-        />
-      </BlockWrapper>
-    );
-  },
+      />
+      <LinkDocsList
+        className={`mt-8 ${linkColumnsModeStyleMap[columnsMode]}`}
+        columnsMode={columnsMode}
+        documents={documents}
+        icon={icon}
+      />
+    </BlockWrapper>
+  ),
 );

package/src/components/LinkDocs/LinkDocsHorizontalList.tsx

@@ -2,27 +2,20 @@ import { JSX } from '@redneckz/uni-jsx';
 import { SwipeListControl } from '../../ui-kit/SwipeListControl/SwipeListControl';
 import { LinkDocsListItem } from './LinkDocsListItem';
 import type { LinkDocsVerticalListProps } from './LinkDocsVerticalList';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
 
-export interface LinkDocsHorizontalListProps extends LinkDocsVerticalListProps {
-  context: ContentPageContext;
-}
-
-export const LinkDocsHorizontalList = JSX<LinkDocsHorizontalListProps>(
-  ({ context, hasBorder = true, documents, icon }) => {
-    return (
-      <SwipeListControl context={context} className="text-s text-primary-main mt-5">
-        {documents?.length
-          ? documents.map((doc, i) => (
-              <LinkDocsListItem
-                key={String(i)}
-                className={hasBorder ? 'rounded-md border-main-stroke border border-solid p-4' : ''}
-                doc={doc}
-                icon={icon}
-              />
-            ))
-          : null}
-      </SwipeListControl>
-    );
-  },
+export const LinkDocsHorizontalList = JSX<LinkDocsVerticalListProps>(
+  ({ hasBorder = true, documents, icon }) => (
+    <SwipeListControl className="text-s text-primary-main mt-5">
+      {documents?.length
+        ? documents.map((doc, i) => (
+            <LinkDocsListItem
+              key={String(i)}
+              className={hasBorder ? 'rounded-md border-main-stroke border border-solid p-4' : ''}
+              doc={doc}
+              icon={icon}
+            />
+          ))
+        : null}
+    </SwipeListControl>
+  ),
 );

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

@@ -1,11 +1,11 @@
-import { mobileContext } from '../../react/setup-fixture';
+import '../../react/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" context={mobileContext} {...linkDocsContentExample} />
+      <LinkList className="col-span-12" {...linkDocsContentExample} />
     </div>
   ),
 };

package/src/components/LinkList/LinkList.tsx

@@ -6,15 +6,13 @@ import type { LinkListContent } from './LinkListContent';
 
 export interface LinkListProps extends LinkListContent, UniBlockProps {}
 
-export const LinkList = JSX<LinkListProps>(({ className = '', documents, ...rest }) => {
-  return (
-    <BlockWrapper className={`font-sans bg-white mt-[10px] ${className}`} {...rest}>
-      <ul className="flex flex-col text-s text-secondary-text p-0">
-        {documents?.length ? renderLinkListItem(documents) : null}
-      </ul>
-    </BlockWrapper>
-  );
-});
+export const LinkList = JSX<LinkListProps>(({ className = '', documents, ...rest }) => (
+  <BlockWrapper className={`font-sans bg-white mt-[10px] ${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) => {

package/src/components/MiniGallery/MiniGallery.fixture.tsx

@@ -1,9 +1,9 @@
 import type { Picture } from '../../model/Picture';
-import { context } from '../../react/setup-fixture';
-import { MiniGallery } from './MiniGallery';
-import type { MiniGalleryProps } from './MiniGallery';
-import type { GalleryCardProps } from '../Gallery/GalleryContent';
+import '../../react/setup-fixture';
 import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { GalleryCardProps } from '../Gallery/GalleryContent';
+import type { MiniGalleryProps } from './MiniGallery';
+import { MiniGallery } from './MiniGallery';
 
 const image: Picture = {
   src: 'domovoj-kupon.png',
@@ -18,7 +18,6 @@ const image: Picture = {
 export const defaultProps: MiniGalleryProps = {
   title: 'Вы можете оплатить бонусными баллами',
   description: 'Удобный каталог с большим ассортиментом товаров и сервисов',
-  context,
   cards: [
     {
       title: 'Более 5000 товаров',
@@ -53,7 +52,6 @@ export const defaultProps: MiniGalleryProps = {
 const onlyTitleProps: MiniGalleryProps = {
   title: 'Вы можете оплатить бонусными баллами',
   description: 'Удобный каталог с большим ассортиментом товаров и сервисов',
-  context,
   cards: [
     {
       title: 'Более 5000 товаров',
@@ -110,7 +108,6 @@ const additionalDescriptionCards: GalleryCardProps[] = [
 const additionalDescriptionProps: MiniGalleryProps = {
   title: 'Вы можете оплатить бонусными баллами',
   description: 'Удобный каталог с большим ассортиментом товаров и сервисов',
-  context,
   cards: additionalDescriptionCards,
 };
 
@@ -126,7 +123,6 @@ const list = [{ text: 'Item 1' }, { text: 'Item 2' }, { text: 'Item 3' }];
 const combinedProps: MiniGalleryProps = {
   title: 'Вы можете оплатить бонусными баллами',
   description: 'Удобный каталог с большим ассортиментом товаров и сервисов',
-  context,
   cards: additionalDescriptionCards.map((card, i) => ({
     ...card,
     button: button,

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

@@ -1,4 +1,4 @@
-import { context } from '../../react/setup-fixture';
+import '../../react/setup-fixture';
 
 import { MobileAppTile as MobileAppTileMobile } from './MobileAppTile.mobile';
 
@@ -6,7 +6,6 @@ export default {
   default: (
     <div className="container grid grid-cols-12">
       <MobileAppTileMobile
-        context={context}
         title="Мобильное приложение!"
         description="Загрузить для IOS и Android"
       />