@redneckz/wildless-cms-uni-blocks 0.8.16 → 0.8.17

package/src/components/Header/HeaderContent.ts

@@ -7,12 +7,6 @@ import type { IconProps, Picture } from '../../model/Picture';
  */
 export type SubMenuItem = LinkProps & IconProps;
 
-/**
- * @title Чат-бот
- * @enumNames ["", "Для физических лиц", "Для юридических лиц"]
- */
-export type ChatBot = '' | 'personal' | 'business';
-
 /**
  * @title Ссылка дополнительного меню
  * @required ["text", "href"]
@@ -40,5 +34,4 @@ export interface HeaderContent {
   showSubMenu?: boolean;
   /** @hidden */
   bgColor?: BgColorVersion;
-  chat?: ChatBot;
 }

package/src/components/Header/HeaderSecondaryMenu.tsx

@@ -8,14 +8,13 @@ import { Location } from '../../ui-kit/Location/Location';
 import { TopItem } from '../../ui-kit/TopItem/TopItem';
 import { style } from '../../utils/style';
 import { HeaderChatBotButton } from './HeaderChatBotButton';
-import type { ChatBot } from './HeaderContent';
+import { projectSettings } from '../../ProjectSettings';
 
 interface HeaderSecondaryMenuContent {
   version?: BlockVersion;
   defaultLocation?: string;
   officesLink?: string;
   foreignOffices?: ForeignOffice[];
-  chat?: ChatBot;
 }
 
 export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
@@ -23,7 +22,7 @@ export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
 }
 
 export const HeaderSecondaryMenu = JSX<HeaderSecondaryMenuProps>(
-  ({ version, className, officesLink, defaultLocation = 'Москва', foreignOffices, chat }) => {
+  ({ version, className, officesLink, defaultLocation = 'Москва', foreignOffices }) => {
     const [isShowLocationModal, { setTrue: showLocationModal, setFalse: hideLocationModal }] =
       useBool();
 
@@ -43,8 +42,12 @@ export const HeaderSecondaryMenu = JSX<HeaderSecondaryMenuProps>(
         {officesLink ? (
           <TopItem className="mr-7" flat={true} href={officesLink} text="Офисы и банкоматы" />
         ) : null}
-        {chat ? (
-          <HeaderChatBotButton className="mr-5" iconVersion={iconVersion} chat={chat} />
+        {projectSettings.CHAT_BOT ? (
+          <HeaderChatBotButton
+            className="mr-5"
+            iconVersion={iconVersion}
+            chat={projectSettings.CHAT_BOT}
+          />
         ) : null}
         {isShowLocationModal ? (
           <Location

package/src/components/Header/useChatBot.ts

@@ -1,15 +1,14 @@
 import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
 import { useExternalNS } from '../../hooks/useExternalNS';
-import { ChatBot } from './HeaderChatBotButton';
 
 const CHATBOT_NAMESPACE = 'chatbot';
 
-const CHATBOT_URL: Record<ChatBot, string> = {
+const CHATBOT_URL: Record<string, string> = {
   personal: '//chat.mes.rshb.ru/assets/js/webchat_rshb',
   business: '', //TODO: add url business chat
 };
 
-export const useChatBot = (chat: ChatBot) => {
+export const useChatBot = (chat: string) => {
   useEffect(() => globalThis.localStorage?.setItem('webchat-keep-open', String(Date.now())), []);
 
   return useExternalNS(CHATBOT_NAMESPACE, CHATBOT_URL[chat]);

package/src/components/ProductBlock/ProductBlockInner.tsx

@@ -47,7 +47,7 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
             <BaseTile buttons={renderButtonsSection(buttons)}>
               {benefitsCount ? (
                 <div className={benefitsContainerStyles}>
-                  {benefits.map(renderBenefit(version, benefitsVersion))}
+                  {benefits?.map(renderBenefit(version, benefitsVersion))}
                 </div>
               ) : null}
               {__html ? (

package/src/components/ProductBlock/renderBackwardButton.tsx

@@ -2,19 +2,19 @@ import type { ButtonVersion } from '../../model/ButtonVersion';
 import { Button } from '../../ui-kit/Button/Button';
 import type { BackwardButtonProps } from '../../ui-kit/Button/ButtonProps';
 import { Img } from '../../ui-kit/Img/Img';
+import { style } from '../../utils/style';
 
 export function renderBackwardButton(
   button: BackwardButtonProps,
   version: ButtonVersion,
   className: string,
 ) {
-  const { text, href, target, onClick } = button;
+  const { text, href, target } = button;
   const iconVersion = version === 'primary' ? 'white' : 'black';
   const backwardIcon = button?.icon || { icon: 'ArrowLeftIcon' };
 
-  // TODO Move click handler to Button
   return (
-    <div className={`flex items-center cursor-pointer ${className}`} onClick={onClick}>
+    <div className={style('flex items-center', className)}>
       <Button
         version={version}
         rounded
@@ -29,7 +29,9 @@ export function renderBackwardButton(
           asSVG
         />
       </Button>
-      {text ? <span className="text-m">{text}</span> : null}
+      {text ? (
+        <Button version="link" text={text} href={href} target={target} ariaLabel={text} />
+      ) : null}
     </div>
   );
 }

package/src/components/ProductGallery/ProductGallery.example.json

@@ -15,7 +15,6 @@
               "height": 299
             }
           },
-          "version": "primary",
           "description": "Описание",
           "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"],
           "benefits": [
@@ -50,7 +49,6 @@
               "height": 299
             }
           },
-          "version": "primary",
           "description": "Описание",
           "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"],
           "benefits": [
@@ -71,6 +69,7 @@
           ]
         }
       }
-    ]
+    ],
+    "version": "primary"
   }
 }

package/src/components/ProductGallery/ProductGallery.tsx

@@ -61,7 +61,7 @@ function renderProductBlock(block: ProductBlockInnerContent & UniBlockProps, i:
     >
       <div className="flex grow">
         <ProductBlockInner
-          className="pl-12 z-10 text-secondary-text group-data-secondary:text-white"
+          className="pl-12 z-10 group-data-secondary:text-white"
           textBlockClassName="mb-[154px]"
           headlineVersion="XXL"
           {...block}

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

@@ -35,6 +35,7 @@
             {
               "tableCellType": "List",
               "isDotted": true,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             },
             {
@@ -45,6 +46,7 @@
             {
               "tableCellType": "List",
               "isDotted": false,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             }
           ],
@@ -56,6 +58,7 @@
             {
               "tableCellType": "List",
               "isDotted": true,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             }
           ],

package/src/components/TariffsTable/TariffsTableContent.ts

@@ -80,6 +80,7 @@ export type LabelDescriptionCellDef = LabelDescriptionCell & {
 
 /**
  * @title Список
+ * @default { "listItemSize": "M", "isDotted": true  }
  */
 export type ListBlockDef = ListProps & {
   /** @default List */

package/src/components/VerticalLayout/VerticalLayout.example.json

@@ -3,7 +3,7 @@
     "version": "primary",
     "isPadding": false,
     "isInnerPadding": true,
-    "align": "left",
+    "align": "stretch",
     "gap": ""
   },
   "style": ["col-span-12"],

package/src/components/VerticalLayout/VerticalLayout.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { renderChildren } from '../../BlockRenderer/renderChildren';
-import type { AlignType } from '../../model/AlignType';
+import type { AlignTypeWithStretch } from '../../model/AlignType';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { style } from '../../utils/style';
@@ -9,7 +9,8 @@ import type { VerticalLayoutContent } from './VerticalLayoutContent';
 
 export interface VerticalLayoutProps extends VerticalLayoutContent, UniBlockProps {}
 
-const alignStyle: Record<AlignType, string> = {
+const alignStyle: Record<AlignTypeWithStretch, string> = {
+  stretch: 'items-stretch',
   left: 'items-start',
   center: 'items-center',
   right: 'items-end',
@@ -19,7 +20,7 @@ export const VerticalLayout: JSXBlock<VerticalLayoutProps> = JSX<VerticalLayoutP
   ({
     className = '',
     gap = '',
-    align,
+    align = 'stretch',
     isPadding = false,
     isInnerPadding = true,
     version = 'transparent',

package/src/components/VerticalLayout/VerticalLayoutContent.ts

@@ -1,4 +1,4 @@
-import type { AlignType } from '../../model/AlignType';
+import type { AlignTypeWithStretch } from '../../model/AlignType';
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ColorPalette } from '../../model/ContentPageDef';
 import type { GapVersion } from '../HorizontalLayout/HorizontalLayoutContent';
@@ -9,7 +9,7 @@ import type { GapVersion } from '../HorizontalLayout/HorizontalLayoutContent';
 export interface VerticalLayoutContent {
   colorPalette?: ColorPalette;
   version?: BlockVersion;
-  align?: AlignType;
+  align?: AlignTypeWithStretch;
   gap?: GapVersion;
   /** @title Внутренний отступ компоновщика */
   isPadding?: boolean;

package/src/components/Video/Video.tsx

@@ -1,6 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useRouter } from '../../hooks/useRouter';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import { adjustHref } from '../../utils/adjustHref';
 import { style } from '../../utils/style';
 import { Headline } from '../Headline/Headline';
 import { getPaddings } from './getPaddings';
@@ -8,19 +10,23 @@ import type { VideoContent } from './VideoContent';
 
 interface VideoProps extends VideoContent, UniBlockProps {}
 
-export const Video = JSX<VideoProps>(({ className, title, src, previewImg, ...rest }) => (
-  <BlockWrapper className={style(getPaddings(className), className)} {...rest}>
-    <Headline title={title} headlineVersion="M" />
-    {src ? (
-      <video
-        className="m-auto w-full object-fill"
-        preload="metadata"
-        poster={previewImg?.src}
-        style={{ maxHeight: 524 }}
-        controls
-      >
-        <source src={src} />
-      </video>
-    ) : null}
-  </BlockWrapper>
-));
+export const Video = JSX<VideoProps>(({ className, title, src, previewImg, ...rest }) => {
+  const router = useRouter();
+
+  return (
+    <BlockWrapper className={style(getPaddings(className), className)} {...rest}>
+      <Headline title={title} headlineVersion="M" />
+      {src ? (
+        <video
+          className="m-auto w-full object-fill"
+          preload="metadata"
+          poster={adjustHref(router)(previewImg?.src)}
+          style={{ maxHeight: 524 }}
+          controls
+        >
+          <source src={adjustHref(router)(src)} />
+        </video>
+      ) : null}
+    </BlockWrapper>
+  );
+});

package/src/hooks/useLink.ts

@@ -12,7 +12,7 @@ interface Clickable {
   onClick(ev?: PreventableEvent): void;
 }
 
-export function useLink(isRemote?: boolean) {
+export function useLink(isRemote = false) {
   const router = useRouter();
 
   return <L extends Partial<LinkProps & Clickable>>(props: L): L & Clickable => ({

package/src/model/AlignType.ts

@@ -7,3 +7,14 @@
  * ]
  */
 export type AlignType = 'left' | 'center' | 'right';
+
+/**
+ * @title Выравнивание
+ * @enumNames [
+ *    "Во всю ширину",
+ *    "По левому краю",
+ *    "По центру",
+ *    "По правому краю"
+ * ]
+ */
+export type AlignTypeWithStretch = 'stretch' | 'left' | 'center' | 'right';

package/src/services/sitemap/isTopItemActive.ts

@@ -1,11 +1,6 @@
 import type { Router } from '../../hooks/useRouter';
 import { projectSettings } from '../../ProjectSettings';
 import { isHrefActive } from './isHrefActive';
-import { TopMenuItem } from './SitemapProps';
 
-export const isTopItemActive =
-  (router: Router) =>
-  (topItem: TopMenuItem): boolean =>
-    projectSettings.BASE_PATH
-      ? isHrefActive({ pathname: projectSettings.BASE_PATH })(topItem)
-      : topItem.items?.some(isHrefActive(router)) || isHrefActive(router)(topItem);
+export const isTopItemActive = (router: Router) =>
+  isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);

package/src/wlc.json

@@ -2,5 +2,7 @@
   "PROD_BRANCH": "master",
   "FORCED_DRAFT_FLOW": false,
   "YANDEX_MAP_API_KEY": "f4b40c1e-1891-45f2-b307-90c481af210b",
-  "SITEMAP": "sayt-rshb"
+  "SITEMAP": "sayt-rshb",
+  "CHAT_BOT": "personal",
+  "BASE_PATH": "/natural/"
 }

package/bundle/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/dist/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/dist/model/CarouselCardVersion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselCardVersion.js","sourceRoot":"","sources":["../../src/model/CarouselCardVersion.ts"],"names":[],"mappings":""}

package/lib/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/lib/model/CarouselCardVersion.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=CarouselCardVersion.js.map

package/lib/model/CarouselCardVersion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselCardVersion.js","sourceRoot":"","sources":["../../src/model/CarouselCardVersion.ts"],"names":[],"mappings":""}

package/mobile/bundle/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/mobile/dist/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/mobile/dist/model/CarouselCardVersion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselCardVersion.js","sourceRoot":"","sources":["../../src/model/CarouselCardVersion.ts"],"names":[],"mappings":""}

package/mobile/lib/model/CarouselCardVersion.d.ts

@@ -1 +0,0 @@
-export declare type CarouselCardVersion = 'normal' | 'mini';

package/mobile/lib/model/CarouselCardVersion.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=CarouselCardVersion.js.map

package/mobile/lib/model/CarouselCardVersion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselCardVersion.js","sourceRoot":"","sources":["../../src/model/CarouselCardVersion.ts"],"names":[],"mappings":""}

package/mobile/src/model/CarouselCardVersion.ts

@@ -1 +0,0 @@
-export type CarouselCardVersion = 'normal' | 'mini';

package/src/model/CarouselCardVersion.ts

@@ -1 +0,0 @@
-export type CarouselCardVersion = 'normal' | 'mini';