@redneckz/wildless-cms-uni-blocks 0.14.795 → 0.14.797

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.795",
+  "version": "0.14.797",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/Header/HeaderChatBotButton.tsx

@@ -12,10 +12,18 @@ interface HeaderChatBotButtonProps {
   onClick?: (ev: PreventableEventWithTarget) => void;
   ariaLabel?: string;
   version?: BlockVersion;
+  buttonSize?: 'default' | 'medium' | 'large';
 }
 
 export const HeaderChatBotButton = JSX<HeaderChatBotButtonProps>(
-  ({ chat = 'personal', iconVersion, className, ariaLabel = 'Чат', version }) => {
+  ({
+    chat = 'personal',
+    iconVersion,
+    className,
+    ariaLabel = 'Чат',
+    version,
+    buttonSize = 'large',
+  }) => {
     const { load, isLoading } = useChatBot(chat);
 
     return (
@@ -24,7 +32,7 @@ export const HeaderChatBotButton = JSX<HeaderChatBotButtonProps>(
         image={{ icon: 'HeadphonesIcon', iconVersion }}
         ariaLabel={ariaLabel}
         onClick={load}
-        buttonSize="large"
+        buttonSize={buttonSize}
         isGrayBg={true}
         version={version}
         isLoading={isLoading}

package/src/components/Header/HeaderSecondaryMenuButton.tsx

@@ -10,7 +10,7 @@ import { style } from '../../utils/style';
 export interface HeaderSecondaryMenuButtonProps extends ImageContent, AspectsProps {
   className?: string;
   isRounded?: boolean;
-  buttonSize?: 'default' | 'large';
+  buttonSize?: 'default' | 'medium' | 'large';
   isGrayBg?: boolean;
   disabled?: boolean;
   ariaLabel?: string;
@@ -23,6 +23,7 @@ export interface HeaderSecondaryMenuButtonProps extends ImageContent, AspectsPro
 
 const BUTTON_SIZE_STYLE = {
   default: 'w-6 h-6',
+  medium: 'w-10 h-10',
   large: 'w-12 h-12',
 };
 

package/src/components/Header/HeaderTop.tsx

@@ -3,9 +3,12 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useRouter } from '../../external/useRouter';
 import { type BgColorVersion } from '../../model/BgColorVersion';
 import { type BlockVersion } from '../../model/BlockVersion';
+import { type IconVersion } from '../../model/IconVersion';
 import { type LogoType } from '../../model/LogoType';
+import { projectSettings } from '../../ProjectSettings';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import { Logo } from '../../ui-kit/Logo/Logo';
+import { HeaderChatBotButton } from './HeaderChatBotButton';
 import { type InternetButtonProps } from './HeaderProps';
 import { InternetBankButton } from './InternetBankButton';
 
@@ -22,6 +25,7 @@ export const HeaderTop = JSX<HeaderTopProps>(
   ({ bgColor, logo, alwaysShowLogo, internetBankButton, version, backwardButton }) => {
     const router = useRouter();
     const isRootLocation = router.pathname === '/';
+    const iconVersion: IconVersion = version === 'transparent' ? 'white' : 'black';
 
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const { dataFooter, dataHeader, ...logoProps } = logo ?? {};
@@ -45,7 +49,17 @@ export const HeaderTop = JSX<HeaderTopProps>(
         ) : (
           renderBackButton(onClick, backwardButton)
         )}
-        <InternetBankButton version={version} {...internetBankButton} />
+        <div className="flex gap-lg items-center">
+          {projectSettings.CHAT_BOT ? (
+            <HeaderChatBotButton
+              version={version}
+              iconVersion={iconVersion}
+              chat={projectSettings.CHAT_BOT}
+              buttonSize="medium"
+            />
+          ) : null}
+          <InternetBankButton version={version} {...internetBankButton} />
+        </div>
       </div>
     );
   },

package/src/components/Header/useChatBot.ts

@@ -79,9 +79,7 @@ const renderBusinessChatBot = async (chatUrl: string) => {
 const createChatFrame = () => {
   const chatFrame = globalThis.document.createElement('div');
   chatFrame.id = CHAT_FRAME_ID;
-  chatFrame.style.position = 'fixed';
-  chatFrame.style.right = '0';
-  chatFrame.style.bottom = '0';
+  chatFrame.className = 'fixed right-0 bottom-0 h-full w-full z-10 @3xl:w-auto h-fit';
 
   globalThis.document.body.appendChild(chatFrame);
 };