@redneckz/wildless-cms-uni-blocks 0.14.932 → 0.14.934

package/src/components/Header/HeaderQuickActionsMenu.tsx

@@ -0,0 +1,134 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback, useEffect } from '@redneckz/uni-jsx/lib/hooks';
+import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { useAspects } from '../../hooks/useAspects/useAspects';
+import { useMobileMode } from '../../hooks/useMobileMode';
+import type { BlockVersion } from '../../model/BlockVersion';
+import type { ComponentType } from '../../model/ComponentType';
+import type { IconVersion } from '../../model/IconVersion';
+import { projectSettings } from '../../ProjectSettings';
+import { useDialog } from '../../ui-kit/DialogManager/useDialog';
+import { PhoneCallRequestDialog } from '../../ui-kit/PhoneCallRequestDialog/PhoneCallRequestDialog';
+import type { PreventableEventWithTarget } from '../../ui-kit/PreventableEvent';
+import { noop } from '../../utils/noop';
+import { style } from '../../utils/style';
+import { type renderDropdownItemProps } from './DropdownMenu';
+import { HeaderSecondaryMenuButton } from './HeaderSecondaryMenuButton';
+import { useDropdownSubMenu } from './useDropdownSubMenu';
+
+interface HeaderQuickActionsMenuProps extends ComponentType {
+  iconVersion?: IconVersion;
+  onClick?: (ev: PreventableEventWithTarget) => void;
+  ariaLabel?: string;
+  version?: BlockVersion;
+  buttonSize?: 'default' | 'medium' | 'large';
+}
+
+const CHAT_BOT_ASPECT_NAME = 'openChatBot';
+
+export const HeaderQuickActionsMenu = JSX<HeaderQuickActionsMenuProps>(
+  ({ iconVersion, className, ariaLabel = 'Чат', version, buttonSize = 'large' }) => {
+    const [isOpenDropdown, { setFalse, toggle }] = useBool(false);
+
+    const quickActionsList = transformQuickActions(projectSettings.QUICK_ACTIONS ?? []);
+
+    const customHandlers = useHandlers();
+
+    const isMobileMode = useMobileMode();
+
+    const dropdownMenu = useDropdownSubMenu({
+      items: quickActionsList,
+      onClose: setFalse,
+      isOpen: isOpenDropdown,
+      onHover: !isMobileMode,
+      renderDropdownItem: renderQuickActionsDropdown,
+      handlers: customHandlers,
+    });
+
+    useEffect(() => {
+      if (isMobileMode) {
+        return;
+      }
+
+      dropdownMenu.current?.addEventListener('mouseenter', toggle);
+      dropdownMenu.current?.addEventListener('mouseleave', setFalse);
+
+      // eslint-disable-next-line consistent-return
+      return () => {
+        dropdownMenu.current?.removeEventListener('mouseenter', toggle);
+        dropdownMenu.current?.removeEventListener('mouseleave', setFalse);
+      };
+    }, []);
+
+    return (
+      <div ref={dropdownMenu}>
+        <HeaderSecondaryMenuButton
+          image={{ icon: 'CallbackIcon', iconVersion }}
+          ariaLabel={ariaLabel}
+          buttonSize={buttonSize}
+          isGrayBg={true}
+          version={version}
+          className={style(isOpenDropdown ? 'shadow-blue-gray' : '', className)}
+          onClick={toggle}
+        />
+      </div>
+    );
+  },
+);
+
+const renderQuickActionsDropdown = ({
+  item,
+  handlers,
+  closeDropdown = noop,
+}: renderDropdownItemProps) => {
+  const quickActionsMapping = {
+    call: {
+      handler: () => {
+        handlers?.call();
+        closeDropdown();
+      },
+      text: 'Заказать звонок',
+    },
+    chat: {
+      handler: () => {
+        handlers?.chat();
+        closeDropdown();
+      },
+      text: 'Написать в чат',
+    },
+  };
+
+  return (
+    <button
+      className={style('text-l font-light pb-m hover:text-primary-main text-left')}
+      role="link"
+      onClick={quickActionsMapping[item?.text ?? ''].handler}
+      key={item?.text ?? ''}
+    >
+      {quickActionsMapping[item?.text ?? ''].text}
+    </button>
+  );
+};
+
+const transformQuickActions = (items: string[]) => items.map((item) => ({ text: item }));
+
+export const useHandlers = () => {
+  const phoneCallRequestDialog = useDialog(PhoneCallRequestDialog);
+  const handleCallClick = useCallback(() => {
+    phoneCallRequestDialog.open({ onClose: () => phoneCallRequestDialog.close() });
+  }, []);
+
+  const aspects = useAspects();
+
+  const handleChatClick = useCallback((ev?: PreventableEventWithTarget) => {
+    const openChatBot = aspects[CHAT_BOT_ASPECT_NAME];
+    if (openChatBot && ev) {
+      openChatBot(ev).finally();
+    }
+  }, []);
+
+  return {
+    call: handleCallClick,
+    chat: handleChatClick,
+  };
+};

package/src/components/Header/HeaderSecondaryMenuButton.tsx

@@ -23,6 +23,7 @@ export interface HeaderSecondaryMenuButtonProps
   isLoading?: boolean;
   // Made special for chatBot, temporary
   dataTestId?: string;
+  ref?: any;
 }
 
 const BUTTON_SIZE_STYLE = {
@@ -45,6 +46,7 @@ export const HeaderSecondaryMenuButton = JSX<HeaderSecondaryMenuButtonProps>(
     version,
     isLoading,
     dataTestId = '',
+    ref,
   }) => {
     const grayBg = isGrayBg && !isRounded ? 'bg-main-divider' : '';
     const bgColor = version === 'transparent' ? 'backdrop-opacity-30 bg-white/30' : grayBg;
@@ -69,6 +71,7 @@ export const HeaderSecondaryMenuButton = JSX<HeaderSecondaryMenuButtonProps>(
         {...getDataTestIdAttribute(dataTestId)}
         // eslint-disable-next-line react/jsx-props-no-spreading
         {...getAspectsAttributes(data)}
+        ref={ref}
       >
         {isLoading ? (
           <div className="w-full h-full rounded-full border-4 border-r-transparent animate-spin text-primary-main" />

package/src/components/Header/HeaderSubMenu.tsx

@@ -9,6 +9,7 @@ import { projectSettings } from '../../ProjectSettings';
 import { HeaderChatBotButton } from './HeaderChatBotButton';
 import { HeaderMoreMenuItem } from './HeaderMoreMenuItem';
 import { type InternetButtonProps } from './HeaderProps';
+import { HeaderQuickActionsMenu } from './HeaderQuickActionsMenu';
 import { HeaderSubMenuItem } from './HeaderSubMenuItem';
 import { InternetBankButton } from './InternetBankButton';
 
@@ -71,7 +72,17 @@ export const HeaderSubMenu = JSX<HeaderSubMenuProps>(
             ariaLabel={dropdownMenuAriaLabel}
           />
         ) : null}
-        {projectSettings.CHAT_BOT ? (
+
+        <div>
+          {projectSettings.QUICK_ACTIONS ? (
+            <HeaderQuickActionsMenu
+              version={version}
+              iconVersion={iconVersion}
+              ariaLabel={chatBotAriaLabel}
+            />
+          ) : null}
+        </div>
+        {projectSettings.CHAT_BOT && !projectSettings.QUICK_ACTIONS ? (
           <HeaderChatBotButton
             version={version}
             iconVersion={iconVersion}

package/src/components/Header/HeaderTop.tsx

@@ -10,6 +10,7 @@ import { Icon } from '../../ui-kit/Icon/Icon';
 import { Logo } from '../../ui-kit/Logo/Logo';
 import { HeaderChatBotButton } from './HeaderChatBotButton';
 import { type InternetButtonProps } from './HeaderProps';
+import { HeaderQuickActionsMenu } from './HeaderQuickActionsMenu';
 import { InternetBankButton } from './InternetBankButton';
 
 export interface HeaderTopProps {
@@ -21,6 +22,12 @@ export interface HeaderTopProps {
   internetBankButton?: InternetButtonProps;
 }
 
+type RenderButtonsProps = {
+  version?: BlockVersion;
+  iconVersion?: IconVersion;
+  internetBankButton?: InternetButtonProps;
+};
+
 export const HeaderTop = JSX<HeaderTopProps>(
   ({ bgColor, logo, alwaysShowLogo, internetBankButton, version, backwardButton }) => {
     const router = useRouter();
@@ -49,12 +56,7 @@ export const HeaderTop = JSX<HeaderTopProps>(
         ) : (
           renderBackButton(onClick, backwardButton)
         )}
-        <div className="flex gap-lg items-center">
-          {projectSettings.CHAT_BOT ? (
-            <HeaderChatBotButton version={version} iconVersion={iconVersion} buttonSize="medium" />
-          ) : null}
-          <InternetBankButton version={version} {...internetBankButton} />
-        </div>
+        {renderButtons({ version, iconVersion, internetBankButton })}
       </div>
     );
   },
@@ -72,3 +74,16 @@ const renderBackButton = (onClick: () => void, text?: string) =>
       {text}
     </button>
   ) : null;
+
+const renderButtons = ({ version, iconVersion, internetBankButton }: RenderButtonsProps) => (
+  <div className="flex gap-lg items-center">
+    {projectSettings.QUICK_ACTIONS ? (
+      <HeaderQuickActionsMenu version={version} iconVersion={iconVersion} />
+    ) : null}
+
+    {projectSettings.CHAT_BOT && !projectSettings.QUICK_ACTIONS ? (
+      <HeaderChatBotButton version={version} iconVersion={iconVersion} buttonSize="medium" />
+    ) : null}
+    <InternetBankButton version={version} {...internetBankButton} />
+  </div>
+);

package/src/components/Header/useDropdownSubMenu.tsx

@@ -3,9 +3,9 @@ import { useOutsideClick } from '@redneckz/uni-jsx/lib/hooks/useOutsideClick';
 import { type LinkProps } from '../../model/LinkProps';
 import type { OnCloseProps } from '../../model/OnCloseProps';
 import { usePopupManager } from '../../ui-kit/PopupManager/usePopupManager';
-import { DropdownMenu } from './DropdownMenu';
+import { DropdownMenu, type DropdownMenuProps } from './DropdownMenu';
 
-interface DropdownSubMenuOptions extends OnCloseProps {
+interface DropdownSubMenuOptions extends DropdownMenuProps, OnCloseProps {
   isOpen?: boolean;
   activeItem?: LinkProps;
   items?: LinkProps[];
@@ -18,6 +18,8 @@ export function useDropdownSubMenu({
   onClose,
   isOpen,
   onHover = false,
+  renderDropdownItem,
+  handlers,
 }: DropdownSubMenuOptions) {
   const popup = usePopupManager();
 
@@ -47,7 +49,16 @@ export function useDropdownSubMenu({
     const { top, left, width, height } = parentElement.getBoundingClientRect();
 
     popup.open({
-      popup: <DropdownMenu dropdownRef={popupRef} items={items} activeItem={activeItem} />,
+      popup: (
+        <DropdownMenu
+          dropdownRef={popupRef}
+          items={items}
+          activeItem={activeItem}
+          renderDropdownItem={renderDropdownItem}
+          handlers={handlers}
+          onItemClick={close}
+        />
+      ),
       top: top + window.scrollY + height,
       left,
       width,

package/src/icons/CallbackIcon.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 16 24" title="Телефон" isInverse="true" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.85668 19.2235C9.87449 19.768 10.9035 20.0914 11.8915 20.1192C12.8408 20.1457 13.7455 19.9036 14.5618 19.332L15.3482 18.7795C15.453 18.707 15.5519 18.6246 15.6476 18.535C15.7449 18.4423 15.8334 18.3492 15.9122 18.2544C16.2032 17.9064 16.3588 17.49 16.3769 17.0661C16.3955 16.6401 16.2759 16.2107 16.0172 15.8412L13.7387 12.5873C13.48 12.2177 13.1163 11.9583 12.7107 11.8302C12.3083 11.7027 11.8637 11.7075 11.4373 11.8609C11.3047 11.9085 11.1808 11.9632 11.066 12.0228C10.9489 12.0831 10.8322 12.1535 10.7195 12.2324C10.6185 12.3022 10.5217 12.3794 10.4295 12.4619C10.3394 12.5448 10.2527 12.6338 10.1694 12.7289C10.0777 12.8337 9.97081 12.9113 9.8545 12.9607C9.76451 12.9992 9.66876 13.02 9.5649 13.0239C8.67718 12.5912 7.93155 11.9438 7.38121 11.1579C6.83087 10.3719 6.47761 9.44988 6.37458 8.46766C6.41482 8.37159 6.46734 8.28766 6.53156 8.21911C6.6192 8.12473 6.72982 8.05105 6.85961 8.00072C6.97751 7.95495 7.09078 7.90392 7.1973 7.84727C7.30849 7.78921 7.41417 7.72465 7.51396 7.65571C7.62699 7.57469 7.73285 7.49019 7.8298 7.39966C7.92509 7.31218 8.01887 7.21445 8.10898 7.1061C8.39999 6.75806 8.55551 6.34171 8.57328 5.91998C8.59182 5.49393 8.47139 5.06334 8.21352 4.69505L5.93509 1.44112C5.67632 1.07156 5.31378 0.812389 4.90708 0.684105C4.50253 0.556194 4.05812 0.559926 3.63406 0.712572C3.51655 0.756192 3.39878 0.807536 3.2795 0.867486C3.16148 0.926549 3.05004 0.99232 2.94556 1.06265L2.15688 1.61583C1.9054 1.79003 1.67886 1.98639 1.47695 2.20039C0.216758 3.54017 -0.0259471 5.51432 0.42422 7.6737C0.855122 9.74098 1.92442 11.994 3.32714 13.9976C4.12384 15.1354 5.03703 16.2038 6.00827 17.1195L6.77242 16.309C5.8669 15.4549 5.00543 14.4455 4.24356 13.356C2.9187 11.4639 1.91417 9.35865 1.51559 7.4492C1.13695 5.63295 1.3072 4.00676 2.28963 2.96504C2.43928 2.80839 2.60804 2.66287 2.79769 2.531L3.57515 1.98473C3.64673 1.93744 3.71608 1.89642 3.7843 1.86186C3.8529 1.82514 3.92973 1.7921 4.01029 1.76304C4.20078 1.69567 4.39659 1.69248 4.571 1.74764C4.74328 1.80243 4.90062 1.9167 5.01671 2.0825L7.29514 5.33643C7.41123 5.50223 7.4648 5.68916 7.45736 5.86978C7.44915 6.05471 7.38026 6.23782 7.25219 6.3916C7.20151 6.45255 7.14038 6.5161 7.07172 6.57832C7.0092 6.63719 6.94206 6.6908 6.87137 6.73936C6.80468 6.78417 6.73747 6.82557 6.67014 6.8614C6.59774 6.90078 6.52522 6.93459 6.45618 6.96124C6.16323 7.07488 5.91289 7.24262 5.71274 7.45915C5.51241 7.67676 5.36214 7.93758 5.27187 8.23562L5.2422 8.33467L5.25089 8.4427C5.35359 9.67223 5.78265 10.8251 6.46416 11.7982C7.14565 12.7715 8.08331 13.5692 9.20235 14.086L9.30089 14.1311L9.40412 14.1371C9.71506 14.1542 10.0115 14.1022 10.2845 13.9884C10.5554 13.8742 10.7997 13.6965 11.0067 13.4601C11.0554 13.4043 11.1119 13.3477 11.1728 13.2919C11.2304 13.2421 11.2923 13.1931 11.3581 13.1471C11.4268 13.097 11.5012 13.0525 11.5781 13.0128C11.6601 12.9696 11.7405 12.9349 11.8153 12.9071C12.0036 12.8393 12.1993 12.8372 12.3758 12.8927C12.5481 12.9475 12.7055 13.0618 12.8215 13.2276L15.1 16.4815C15.2161 16.6473 15.2696 16.8343 15.2622 17.0149C15.2544 17.1977 15.1842 17.3816 15.0549 17.5363C14.9998 17.6032 14.9427 17.663 14.8865 17.7174C14.8298 17.7684 14.7675 17.8196 14.6977 17.8694L13.9213 18.4159C13.3104 18.8417 12.6341 19.022 11.9232 19.002C11.114 18.9792 10.252 18.7029 9.38105 18.2376L8.85668 19.2235ZM6.94188 17.9339L7.35518 18.2575C7.48449 18.3547 7.62436 18.4548 7.77069 18.556L8.40292 17.638L8.0231 17.3636L7.64043 17.0676L6.94188 17.9339Z" fill="#18191D"/>
+</svg>

package/src/icons/IconName.ts

@@ -7,11 +7,11 @@ export const IconsWithoutInversion = new Set([
 ]);
 
 export enum IconMap {
-  YoutubeIcon = 'YoutubeIcon', WalletWithMoneyIcon = 'WalletWithMoneyIcon', WalletIcon = 'WalletIcon', WalletAddIcon = 'WalletAddIcon', VKIcon = 'VKIcon', UserTickIcon = 'UserTickIcon', UserSquareIcon = 'UserSquareIcon', UserGeoLocationIcon = 'UserGeoLocationIcon', TelegramIcon = 'TelegramIcon', StarIcon = 'StarIcon', SoundIcon = 'SoundIcon', SmallClockIcon = 'SmallClockIcon', SignDocsIcon = 'SignDocsIcon', ShieldTickIcon = 'ShieldTickIcon', SecurityСardIcon = 'SecurityСardIcon', SafeIcon = 'SafeIcon', RutubeIcon = 'RutubeIcon', RustoreIcon = 'RustoreIcon', RoundRubleIcon = 'RoundRubleIcon', ResponseOKIcon = 'ResponseOKIcon', ResponseFailIcon = 'ResponseFailIcon', RefreshIcon = 'RefreshIcon', ProfileIcon = 'ProfileIcon', Profile2UserIcon = 'Profile2UserIcon', PlusIcon = 'PlusIcon', PlusCircleIcon = 'PlusCircleIcon', PlayMarketIcon = 'PlayMarketIcon', PhoneIcon = 'PhoneIcon', PhoneCallingIcon = 'PhoneCallingIcon', PersonalCardIcon = 'PersonalCardIcon', PercentageRoundIcon = 'PercentageRoundIcon', PercentIcon = 'PercentIcon', PassSendIcon = 'PassSendIcon', PackA4Icon = 'PackA4Icon', OkIcon = 'OkIcon', NotificationBingIcon = 'NotificationBingIcon', NewLoanIcon = 'NewLoanIcon', NewDocIcon = 'NewDocIcon', MonitorMobileIcon = 'MonitorMobileIcon', MoneyInsuranceIcon = 'MoneyInsuranceIcon', MoneyIcon = 'MoneyIcon', MinusIcon = 'MinusIcon', MapOpenedIcon = 'MapOpenedIcon', MapMarkerSingleIcon = 'MapMarkerSingleIcon', MapMarkerClusterYellowIcon = 'MapMarkerClusterYellowIcon', MapMarkerClusterIcon = 'MapMarkerClusterIcon', MailIcon = 'MailIcon', MagnifierIcon = 'MagnifierIcon', LoupeIcon = 'LoupeIcon', LogoIcon = 'LogoIcon', LockIcon = 'LockIcon', InfoCircleIcon = 'InfoCircleIcon', HuaweiIcon = 'HuaweiIcon', HouseIcon = 'HouseIcon', HeartTickIcon = 'HeartTickIcon', HeartIcon = 'HeartIcon', HeadphonesIcon = 'HeadphonesIcon', GridIcon = 'GridIcon', GpsIcon = 'GpsIcon', GosUslugiIcon = 'GosUslugiIcon', GlobalIcon = 'GlobalIcon', GeolocationIcon = 'GeolocationIcon', FullScreenIcon = 'FullScreenIcon', FaxIcon = 'FaxIcon', EuroIcon = 'EuroIcon', EmptyWalletIcon = 'EmptyWalletIcon', EmptyWalletChangeIcon = 'EmptyWalletChangeIcon', DzenIcon = 'DzenIcon', DoneSimpleIcon = 'DoneSimpleIcon', DoneIcon = 'DoneIcon', DollarIcon = 'DollarIcon', DocIcon = 'DocIcon', DocDownloadIcon = 'DocDownloadIcon', DiscountShapeIcon = 'DiscountShapeIcon', DevIcon = 'DevIcon', CupIcon = 'CupIcon', CourtHouseIcon = 'CourtHouseIcon', CopyIcon = 'CopyIcon', ConvertCardIcon = 'ConvertCardIcon', CoinIcon = 'CoinIcon', CloseIcon = 'CloseIcon', ClientIcon = 'ClientIcon', ChineseYuanRenminbiIcon = 'ChineseYuanRenminbiIcon', ChevronLeftIcon = 'ChevronLeftIcon', ChatBotIcon = 'ChatBotIcon', ChartSquareIcon = 'ChartSquareIcon', ChartRoundIcon = 'ChartRoundIcon', ChartIcon = 'ChartIcon', CardTickIcon = 'CardTickIcon', CardSendIcon = 'CardSendIcon', CardPosIcon = 'CardPosIcon', CardIcon = 'CardIcon', CalendarTickIcon = 'CalendarTickIcon', CalendarIcon = 'CalendarIcon', CalendarCircleIcon = 'CalendarCircleIcon', BurgerIcon = 'BurgerIcon', BuildingIcon = 'BuildingIcon', BriefcaseIcon = 'BriefcaseIcon', BelarusianFlag = 'BelarusianFlag', BankIcon = 'BankIcon', BankColorIcon = 'BankColorIcon', AtmIcon = 'AtmIcon', ArrowUpSolidIcon = 'ArrowUpSolidIcon', ArrowUpIcon = 'ArrowUpIcon', ArrowTopRightIcon = 'ArrowTopRightIcon', ArrowRightIcon = 'ArrowRightIcon', ArrowLeftIcon = 'ArrowLeftIcon', ArrowDownSolidIcon = 'ArrowDownSolidIcon', ArrowDownIcon = 'ArrowDownIcon', AppleIcon = 'AppleIcon', AlarmIcon = 'AlarmIcon', ActualBalanceIcon = 'ActualBalanceIcon', AchievementIcon = 'AchievementIcon'
+  YoutubeIcon = 'YoutubeIcon', WalletWithMoneyIcon = 'WalletWithMoneyIcon', WalletIcon = 'WalletIcon', WalletAddIcon = 'WalletAddIcon', VKIcon = 'VKIcon', UserTickIcon = 'UserTickIcon', UserSquareIcon = 'UserSquareIcon', UserGeoLocationIcon = 'UserGeoLocationIcon', TelegramIcon = 'TelegramIcon', StarIcon = 'StarIcon', SoundIcon = 'SoundIcon', SmallClockIcon = 'SmallClockIcon', SignDocsIcon = 'SignDocsIcon', ShieldTickIcon = 'ShieldTickIcon', SecurityСardIcon = 'SecurityСardIcon', SafeIcon = 'SafeIcon', RutubeIcon = 'RutubeIcon', RustoreIcon = 'RustoreIcon', RoundRubleIcon = 'RoundRubleIcon', ResponseOKIcon = 'ResponseOKIcon', ResponseFailIcon = 'ResponseFailIcon', RefreshIcon = 'RefreshIcon', ProfileIcon = 'ProfileIcon', Profile2UserIcon = 'Profile2UserIcon', PlusIcon = 'PlusIcon', PlusCircleIcon = 'PlusCircleIcon', PlayMarketIcon = 'PlayMarketIcon', PhoneIcon = 'PhoneIcon', PhoneCallingIcon = 'PhoneCallingIcon', PersonalCardIcon = 'PersonalCardIcon', PercentageRoundIcon = 'PercentageRoundIcon', PercentIcon = 'PercentIcon', PassSendIcon = 'PassSendIcon', PackA4Icon = 'PackA4Icon', OkIcon = 'OkIcon', NotificationBingIcon = 'NotificationBingIcon', NewLoanIcon = 'NewLoanIcon', NewDocIcon = 'NewDocIcon', MonitorMobileIcon = 'MonitorMobileIcon', MoneyInsuranceIcon = 'MoneyInsuranceIcon', MoneyIcon = 'MoneyIcon', MinusIcon = 'MinusIcon', MapOpenedIcon = 'MapOpenedIcon', MapMarkerSingleIcon = 'MapMarkerSingleIcon', MapMarkerClusterYellowIcon = 'MapMarkerClusterYellowIcon', MapMarkerClusterIcon = 'MapMarkerClusterIcon', MailIcon = 'MailIcon', MagnifierIcon = 'MagnifierIcon', LoupeIcon = 'LoupeIcon', LogoIcon = 'LogoIcon', LockIcon = 'LockIcon', InfoCircleIcon = 'InfoCircleIcon', HuaweiIcon = 'HuaweiIcon', HouseIcon = 'HouseIcon', HeartTickIcon = 'HeartTickIcon', HeartIcon = 'HeartIcon', HeadphonesIcon = 'HeadphonesIcon', GridIcon = 'GridIcon', GpsIcon = 'GpsIcon', GosUslugiIcon = 'GosUslugiIcon', GlobalIcon = 'GlobalIcon', GeolocationIcon = 'GeolocationIcon', FullScreenIcon = 'FullScreenIcon', FaxIcon = 'FaxIcon', EuroIcon = 'EuroIcon', EmptyWalletIcon = 'EmptyWalletIcon', EmptyWalletChangeIcon = 'EmptyWalletChangeIcon', DzenIcon = 'DzenIcon', DoneSimpleIcon = 'DoneSimpleIcon', DoneIcon = 'DoneIcon', DollarIcon = 'DollarIcon', DocIcon = 'DocIcon', DocDownloadIcon = 'DocDownloadIcon', DiscountShapeIcon = 'DiscountShapeIcon', DevIcon = 'DevIcon', CupIcon = 'CupIcon', CourtHouseIcon = 'CourtHouseIcon', CopyIcon = 'CopyIcon', ConvertCardIcon = 'ConvertCardIcon', CoinIcon = 'CoinIcon', CloseIcon = 'CloseIcon', ClientIcon = 'ClientIcon', ChineseYuanRenminbiIcon = 'ChineseYuanRenminbiIcon', ChevronLeftIcon = 'ChevronLeftIcon', ChatBotIcon = 'ChatBotIcon', ChartSquareIcon = 'ChartSquareIcon', ChartRoundIcon = 'ChartRoundIcon', ChartIcon = 'ChartIcon', CardTickIcon = 'CardTickIcon', CardSendIcon = 'CardSendIcon', CardPosIcon = 'CardPosIcon', CardIcon = 'CardIcon', CallbackIcon = 'CallbackIcon', CalendarTickIcon = 'CalendarTickIcon', CalendarIcon = 'CalendarIcon', CalendarCircleIcon = 'CalendarCircleIcon', BurgerIcon = 'BurgerIcon', BuildingIcon = 'BuildingIcon', BriefcaseIcon = 'BriefcaseIcon', BelarusianFlag = 'BelarusianFlag', BankIcon = 'BankIcon', BankColorIcon = 'BankColorIcon', AtmIcon = 'AtmIcon', ArrowUpSolidIcon = 'ArrowUpSolidIcon', ArrowUpIcon = 'ArrowUpIcon', ArrowTopRightIcon = 'ArrowTopRightIcon', ArrowRightIcon = 'ArrowRightIcon', ArrowLeftIcon = 'ArrowLeftIcon', ArrowDownSolidIcon = 'ArrowDownSolidIcon', ArrowDownIcon = 'ArrowDownIcon', AppleIcon = 'AppleIcon', AlarmIcon = 'AlarmIcon', ActualBalanceIcon = 'ActualBalanceIcon', AchievementIcon = 'AchievementIcon'
 }
 
 export enum IconTitleMap {
-  YoutubeIcon = 'Лого «Youtube»', WalletWithMoneyIcon = 'Кошелёк с деньгами', WalletIcon = 'Кошелёк', WalletAddIcon = 'Кошелёк с плюсом', VKIcon = 'Лого «VK»', UserTickIcon = 'Пользователь', UserSquareIcon = 'Пользователь в рамке', UserGeoLocationIcon = 'Самолётик', TelegramIcon = 'Лого «Telegram»', StarIcon = 'Звезда', SoundIcon = 'Кольцо', SmallClockIcon = 'Маленькие часы', SignDocsIcon = 'Подписанные документы', ShieldTickIcon = 'Безопасность', SecurityСardIcon = 'Безопасность', SafeIcon = 'Сейф', RutubeIcon = 'Лого «Rutube»', RustoreIcon = 'Лого «Rustore»', RoundRubleIcon = 'Рубль (круг.)', ResponseOKIcon = 'Ок', ResponseFailIcon = 'Ошибка', RefreshIcon = 'RefreshIcon', ProfileIcon = 'Профиль', Profile2UserIcon = 'Профиль, 2 персоны', PlusIcon = 'Плюс', PlusCircleIcon = 'Плюс в круге', PlayMarketIcon = 'Лого «PlayMarket»', PhoneIcon = 'Телефон', PhoneCallingIcon = 'Звонящий телефон', PersonalCardIcon = 'Персональная карта', PercentageRoundIcon = 'Проценты (круг.)', PercentIcon = 'Проценты', PassSendIcon = 'Бизнес', PackA4Icon = 'Пачка бумаги А4', OkIcon = 'Лого «Одноклассники»', NotificationBingIcon = 'Колокольчик нотификаций', NewLoanIcon = 'Новая заявка', NewDocIcon = 'Новый документ', MonitorMobileIcon = 'Монитор и мобильный', MoneyInsuranceIcon = 'Денежное страхование', MoneyIcon = 'Деньги', MinusIcon = 'Минус', MapOpenedIcon = 'Иконка Развёрнутая карта', MapMarkerSingleIcon = 'Маркер карты РСХБ', MapMarkerClusterYellowIcon = 'Маркер карты (желтый)', MapMarkerClusterIcon = 'Маркер карты', MailIcon = 'E-mail', MagnifierIcon = 'MagnifierIcon', LoupeIcon = 'Лупа', LogoIcon = 'Логотип', LockIcon = 'Замок', InfoCircleIcon = 'InfoCircleIcon', HuaweiIcon = 'Лого «Huawei»', HouseIcon = 'Ипотека', HeartTickIcon = 'Сердцебеение', HeartIcon = 'Сердце', HeadphonesIcon = 'HeadphonesIcon', GridIcon = 'Сетка (белая)', GpsIcon = 'Gps', GosUslugiIcon = 'ГосУслуги', GlobalIcon = 'Глобус', GeolocationIcon = 'Геолокация', FullScreenIcon = 'FullScreenIcon', FaxIcon = 'Факс', EuroIcon = 'Евро', EmptyWalletIcon = 'Пустой кошелёк', EmptyWalletChangeIcon = 'Пустой кошелёк с возвратом', DzenIcon = 'Лого «Дзен»', DoneSimpleIcon = 'Зелёная \'галочка\'', DoneIcon = 'Зелёная \'галочка\' в круге', DollarIcon = 'Доллар', DocIcon = 'Документ', DocDownloadIcon = 'Скачать документ', DiscountShapeIcon = 'Скидка', DevIcon = 'Разработка', CupIcon = 'Кубок', CourtHouseIcon = 'Здание суда', CopyIcon = 'Копирование', ConvertCardIcon = 'Конвертирование', CoinIcon = 'Монеты', CloseIcon = 'Крестик', ClientIcon = 'Клиент', ChineseYuanRenminbiIcon = 'Китайский юань', ChevronLeftIcon = 'Стрелка \'Влево\'', ChatBotIcon = 'Чат-бот', ChartSquareIcon = 'Деньги внутри кошелька', ChartRoundIcon = 'Диаграмма (в круге)', ChartIcon = 'Инвестиции', CardTickIcon = 'Кред. карта с галочкой', CardSendIcon = 'Карта', CardPosIcon = 'Кред. карта под наклоном', CardIcon = 'Кред. карта', CalendarTickIcon = 'Календарь с галочкой', CalendarIcon = 'Календарь', CalendarCircleIcon = 'Скруглённый календарь', BurgerIcon = 'Бургер', BuildingIcon = 'Здание с деревом', BriefcaseIcon = 'Портфель', BelarusianFlag = 'Белорусский флаг', BankIcon = 'Банк', BankColorIcon = 'Банк (в цвете)', AtmIcon = 'Банкомат', ArrowUpSolidIcon = 'Стрелка сплошная \'Вверх\'', ArrowUpIcon = 'Стрелка \'Вверх\'', ArrowTopRightIcon = 'Стрелка \'Вверх-право\'', ArrowRightIcon = 'Стрелка \'Вправо\'', ArrowLeftIcon = 'Стрелка \'Влево\'', ArrowDownSolidIcon = 'Стрелка сплошная \'Вниз\'', ArrowDownIcon = 'Стрелка \'Вниз\'', AppleIcon = 'Лого «Apple»', AlarmIcon = 'Предупреждение', ActualBalanceIcon = 'Деньги', AchievementIcon = 'Достижение'
+  YoutubeIcon = 'Лого «Youtube»', WalletWithMoneyIcon = 'Кошелёк с деньгами', WalletIcon = 'Кошелёк', WalletAddIcon = 'Кошелёк с плюсом', VKIcon = 'Лого «VK»', UserTickIcon = 'Пользователь', UserSquareIcon = 'Пользователь в рамке', UserGeoLocationIcon = 'Самолётик', TelegramIcon = 'Лого «Telegram»', StarIcon = 'Звезда', SoundIcon = 'Кольцо', SmallClockIcon = 'Маленькие часы', SignDocsIcon = 'Подписанные документы', ShieldTickIcon = 'Безопасность', SecurityСardIcon = 'Безопасность', SafeIcon = 'Сейф', RutubeIcon = 'Лого «Rutube»', RustoreIcon = 'Лого «Rustore»', RoundRubleIcon = 'Рубль (круг.)', ResponseOKIcon = 'Ок', ResponseFailIcon = 'Ошибка', RefreshIcon = 'RefreshIcon', ProfileIcon = 'Профиль', Profile2UserIcon = 'Профиль, 2 персоны', PlusIcon = 'Плюс', PlusCircleIcon = 'Плюс в круге', PlayMarketIcon = 'Лого «PlayMarket»', PhoneIcon = 'Телефон', PhoneCallingIcon = 'Звонящий телефон', PersonalCardIcon = 'Персональная карта', PercentageRoundIcon = 'Проценты (круг.)', PercentIcon = 'Проценты', PassSendIcon = 'Бизнес', PackA4Icon = 'Пачка бумаги А4', OkIcon = 'Лого «Одноклассники»', NotificationBingIcon = 'Колокольчик нотификаций', NewLoanIcon = 'Новая заявка', NewDocIcon = 'Новый документ', MonitorMobileIcon = 'Монитор и мобильный', MoneyInsuranceIcon = 'Денежное страхование', MoneyIcon = 'Деньги', MinusIcon = 'Минус', MapOpenedIcon = 'Иконка Развёрнутая карта', MapMarkerSingleIcon = 'Маркер карты РСХБ', MapMarkerClusterYellowIcon = 'Маркер карты (желтый)', MapMarkerClusterIcon = 'Маркер карты', MailIcon = 'E-mail', MagnifierIcon = 'MagnifierIcon', LoupeIcon = 'Лупа', LogoIcon = 'Логотип', LockIcon = 'Замок', InfoCircleIcon = 'InfoCircleIcon', HuaweiIcon = 'Лого «Huawei»', HouseIcon = 'Ипотека', HeartTickIcon = 'Сердцебеение', HeartIcon = 'Сердце', HeadphonesIcon = 'HeadphonesIcon', GridIcon = 'Сетка (белая)', GpsIcon = 'Gps', GosUslugiIcon = 'ГосУслуги', GlobalIcon = 'Глобус', GeolocationIcon = 'Геолокация', FullScreenIcon = 'FullScreenIcon', FaxIcon = 'Факс', EuroIcon = 'Евро', EmptyWalletIcon = 'Пустой кошелёк', EmptyWalletChangeIcon = 'Пустой кошелёк с возвратом', DzenIcon = 'Лого «Дзен»', DoneSimpleIcon = 'Зелёная \'галочка\'', DoneIcon = 'Зелёная \'галочка\' в круге', DollarIcon = 'Доллар', DocIcon = 'Документ', DocDownloadIcon = 'Скачать документ', DiscountShapeIcon = 'Скидка', DevIcon = 'Разработка', CupIcon = 'Кубок', CourtHouseIcon = 'Здание суда', CopyIcon = 'Копирование', ConvertCardIcon = 'Конвертирование', CoinIcon = 'Монеты', CloseIcon = 'Крестик', ClientIcon = 'Клиент', ChineseYuanRenminbiIcon = 'Китайский юань', ChevronLeftIcon = 'Стрелка \'Влево\'', ChatBotIcon = 'Чат-бот', ChartSquareIcon = 'Деньги внутри кошелька', ChartRoundIcon = 'Диаграмма (в круге)', ChartIcon = 'Инвестиции', CardTickIcon = 'Кред. карта с галочкой', CardSendIcon = 'Карта', CardPosIcon = 'Кред. карта под наклоном', CardIcon = 'Кред. карта', CallbackIcon = 'Телефон', CalendarTickIcon = 'Календарь с галочкой', CalendarIcon = 'Календарь', CalendarCircleIcon = 'Скруглённый календарь', BurgerIcon = 'Бургер', BuildingIcon = 'Здание с деревом', BriefcaseIcon = 'Портфель', BelarusianFlag = 'Белорусский флаг', BankIcon = 'Банк', BankColorIcon = 'Банк (в цвете)', AtmIcon = 'Банкомат', ArrowUpSolidIcon = 'Стрелка сплошная \'Вверх\'', ArrowUpIcon = 'Стрелка \'Вверх\'', ArrowTopRightIcon = 'Стрелка \'Вверх-право\'', ArrowRightIcon = 'Стрелка \'Вправо\'', ArrowLeftIcon = 'Стрелка \'Влево\'', ArrowDownSolidIcon = 'Стрелка сплошная \'Вниз\'', ArrowDownIcon = 'Стрелка \'Вниз\'', AppleIcon = 'Лого «Apple»', AlarmIcon = 'Предупреждение', ActualBalanceIcon = 'Деньги', AchievementIcon = 'Достижение'
 }
 
 /**
@@ -19,7 +19,7 @@ export enum IconTitleMap {
  * @title Иконка
  * @enumNames [
  *   "",
- *   'Лого «Youtube»', 'Кошелёк с деньгами', 'Кошелёк', 'Кошелёк с плюсом', 'Лого «VK»', 'Пользователь', 'Пользователь в рамке', 'Самолётик', 'Лого «Telegram»', 'Звезда', 'Кольцо', 'Маленькие часы', 'Подписанные документы', 'Безопасность', 'Безопасность', 'Сейф', 'Лого «Rutube»', 'Лого «Rustore»', 'Рубль (круг.)', 'Ок', 'Ошибка', 'RefreshIcon', 'Профиль', 'Профиль, 2 персоны', 'Плюс', 'Плюс в круге', 'Лого «PlayMarket»', 'Телефон', 'Звонящий телефон', 'Персональная карта', 'Проценты (круг.)', 'Проценты', 'Бизнес', 'Пачка бумаги А4', 'Лого «Одноклассники»', 'Колокольчик нотификаций', 'Новая заявка', 'Новый документ', 'Монитор и мобильный', 'Денежное страхование', 'Деньги', 'Минус', 'Иконка Развёрнутая карта', 'Маркер карты РСХБ', 'Маркер карты (желтый)', 'Маркер карты', 'E-mail', 'MagnifierIcon', 'Лупа', 'Логотип', 'Замок', 'InfoCircleIcon', 'Лого «Huawei»', 'Ипотека', 'Сердцебеение', 'Сердце', 'HeadphonesIcon', 'Сетка (белая)', 'Gps', 'ГосУслуги', 'Глобус', 'Геолокация', 'FullScreenIcon', 'Факс', 'Евро', 'Пустой кошелёк', 'Пустой кошелёк с возвратом', 'Лого «Дзен»', 'Зелёная \'галочка\'', 'Зелёная \'галочка\' в круге', 'Доллар', 'Документ', 'Скачать документ', 'Скидка', 'Разработка', 'Кубок', 'Здание суда', 'Копирование', 'Конвертирование', 'Монеты', 'Крестик', 'Клиент', 'Китайский юань', 'Стрелка \'Влево\'', 'Чат-бот', 'Деньги внутри кошелька', 'Диаграмма (в круге)', 'Инвестиции', 'Кред. карта с галочкой', 'Карта', 'Кред. карта под наклоном', 'Кред. карта', 'Календарь с галочкой', 'Календарь', 'Скруглённый календарь', 'Бургер', 'Здание с деревом', 'Портфель', 'Белорусский флаг', 'Банк', 'Банк (в цвете)', 'Банкомат', 'Стрелка сплошная \'Вверх\'', 'Стрелка \'Вверх\'', 'Стрелка \'Вверх-право\'', 'Стрелка \'Вправо\'', 'Стрелка \'Влево\'', 'Стрелка сплошная \'Вниз\'', 'Стрелка \'Вниз\'', 'Лого «Apple»', 'Предупреждение', 'Деньги', 'Достижение'
+ *   'Лого «Youtube»', 'Кошелёк с деньгами', 'Кошелёк', 'Кошелёк с плюсом', 'Лого «VK»', 'Пользователь', 'Пользователь в рамке', 'Самолётик', 'Лого «Telegram»', 'Звезда', 'Кольцо', 'Маленькие часы', 'Подписанные документы', 'Безопасность', 'Безопасность', 'Сейф', 'Лого «Rutube»', 'Лого «Rustore»', 'Рубль (круг.)', 'Ок', 'Ошибка', 'RefreshIcon', 'Профиль', 'Профиль, 2 персоны', 'Плюс', 'Плюс в круге', 'Лого «PlayMarket»', 'Телефон', 'Звонящий телефон', 'Персональная карта', 'Проценты (круг.)', 'Проценты', 'Бизнес', 'Пачка бумаги А4', 'Лого «Одноклассники»', 'Колокольчик нотификаций', 'Новая заявка', 'Новый документ', 'Монитор и мобильный', 'Денежное страхование', 'Деньги', 'Минус', 'Иконка Развёрнутая карта', 'Маркер карты РСХБ', 'Маркер карты (желтый)', 'Маркер карты', 'E-mail', 'MagnifierIcon', 'Лупа', 'Логотип', 'Замок', 'InfoCircleIcon', 'Лого «Huawei»', 'Ипотека', 'Сердцебеение', 'Сердце', 'HeadphonesIcon', 'Сетка (белая)', 'Gps', 'ГосУслуги', 'Глобус', 'Геолокация', 'FullScreenIcon', 'Факс', 'Евро', 'Пустой кошелёк', 'Пустой кошелёк с возвратом', 'Лого «Дзен»', 'Зелёная \'галочка\'', 'Зелёная \'галочка\' в круге', 'Доллар', 'Документ', 'Скачать документ', 'Скидка', 'Разработка', 'Кубок', 'Здание суда', 'Копирование', 'Конвертирование', 'Монеты', 'Крестик', 'Клиент', 'Китайский юань', 'Стрелка \'Влево\'', 'Чат-бот', 'Деньги внутри кошелька', 'Диаграмма (в круге)', 'Инвестиции', 'Кред. карта с галочкой', 'Карта', 'Кред. карта под наклоном', 'Кред. карта', 'Телефон', 'Календарь с галочкой', 'Календарь', 'Скруглённый календарь', 'Бургер', 'Здание с деревом', 'Портфель', 'Белорусский флаг', 'Банк', 'Банк (в цвете)', 'Банкомат', 'Стрелка сплошная \'Вверх\'', 'Стрелка \'Вверх\'', 'Стрелка \'Вверх-право\'', 'Стрелка \'Вправо\'', 'Стрелка \'Влево\'', 'Стрелка сплошная \'Вниз\'', 'Стрелка \'Вниз\'', 'Лого «Apple»', 'Предупреждение', 'Деньги', 'Достижение'
  * ]
  */
-export type IconName = '' | 'YoutubeIcon' | 'WalletWithMoneyIcon' | 'WalletIcon' | 'WalletAddIcon' | 'VKIcon' | 'UserTickIcon' | 'UserSquareIcon' | 'UserGeoLocationIcon' | 'TelegramIcon' | 'StarIcon' | 'SoundIcon' | 'SmallClockIcon' | 'SignDocsIcon' | 'ShieldTickIcon' | 'SecurityСardIcon' | 'SafeIcon' | 'RutubeIcon' | 'RustoreIcon' | 'RoundRubleIcon' | 'ResponseOKIcon' | 'ResponseFailIcon' | 'RefreshIcon' | 'ProfileIcon' | 'Profile2UserIcon' | 'PlusIcon' | 'PlusCircleIcon' | 'PlayMarketIcon' | 'PhoneIcon' | 'PhoneCallingIcon' | 'PersonalCardIcon' | 'PercentageRoundIcon' | 'PercentIcon' | 'PassSendIcon' | 'PackA4Icon' | 'OkIcon' | 'NotificationBingIcon' | 'NewLoanIcon' | 'NewDocIcon' | 'MonitorMobileIcon' | 'MoneyInsuranceIcon' | 'MoneyIcon' | 'MinusIcon' | 'MapOpenedIcon' | 'MapMarkerSingleIcon' | 'MapMarkerClusterYellowIcon' | 'MapMarkerClusterIcon' | 'MailIcon' | 'MagnifierIcon' | 'LoupeIcon' | 'LogoIcon' | 'LockIcon' | 'InfoCircleIcon' | 'HuaweiIcon' | 'HouseIcon' | 'HeartTickIcon' | 'HeartIcon' | 'HeadphonesIcon' | 'GridIcon' | 'GpsIcon' | 'GosUslugiIcon' | 'GlobalIcon' | 'GeolocationIcon' | 'FullScreenIcon' | 'FaxIcon' | 'EuroIcon' | 'EmptyWalletIcon' | 'EmptyWalletChangeIcon' | 'DzenIcon' | 'DoneSimpleIcon' | 'DoneIcon' | 'DollarIcon' | 'DocIcon' | 'DocDownloadIcon' | 'DiscountShapeIcon' | 'DevIcon' | 'CupIcon' | 'CourtHouseIcon' | 'CopyIcon' | 'ConvertCardIcon' | 'CoinIcon' | 'CloseIcon' | 'ClientIcon' | 'ChineseYuanRenminbiIcon' | 'ChevronLeftIcon' | 'ChatBotIcon' | 'ChartSquareIcon' | 'ChartRoundIcon' | 'ChartIcon' | 'CardTickIcon' | 'CardSendIcon' | 'CardPosIcon' | 'CardIcon' | 'CalendarTickIcon' | 'CalendarIcon' | 'CalendarCircleIcon' | 'BurgerIcon' | 'BuildingIcon' | 'BriefcaseIcon' | 'BelarusianFlag' | 'BankIcon' | 'BankColorIcon' | 'AtmIcon' | 'ArrowUpSolidIcon' | 'ArrowUpIcon' | 'ArrowTopRightIcon' | 'ArrowRightIcon' | 'ArrowLeftIcon' | 'ArrowDownSolidIcon' | 'ArrowDownIcon' | 'AppleIcon' | 'AlarmIcon' | 'ActualBalanceIcon' | 'AchievementIcon';
+export type IconName = '' | 'YoutubeIcon' | 'WalletWithMoneyIcon' | 'WalletIcon' | 'WalletAddIcon' | 'VKIcon' | 'UserTickIcon' | 'UserSquareIcon' | 'UserGeoLocationIcon' | 'TelegramIcon' | 'StarIcon' | 'SoundIcon' | 'SmallClockIcon' | 'SignDocsIcon' | 'ShieldTickIcon' | 'SecurityСardIcon' | 'SafeIcon' | 'RutubeIcon' | 'RustoreIcon' | 'RoundRubleIcon' | 'ResponseOKIcon' | 'ResponseFailIcon' | 'RefreshIcon' | 'ProfileIcon' | 'Profile2UserIcon' | 'PlusIcon' | 'PlusCircleIcon' | 'PlayMarketIcon' | 'PhoneIcon' | 'PhoneCallingIcon' | 'PersonalCardIcon' | 'PercentageRoundIcon' | 'PercentIcon' | 'PassSendIcon' | 'PackA4Icon' | 'OkIcon' | 'NotificationBingIcon' | 'NewLoanIcon' | 'NewDocIcon' | 'MonitorMobileIcon' | 'MoneyInsuranceIcon' | 'MoneyIcon' | 'MinusIcon' | 'MapOpenedIcon' | 'MapMarkerSingleIcon' | 'MapMarkerClusterYellowIcon' | 'MapMarkerClusterIcon' | 'MailIcon' | 'MagnifierIcon' | 'LoupeIcon' | 'LogoIcon' | 'LockIcon' | 'InfoCircleIcon' | 'HuaweiIcon' | 'HouseIcon' | 'HeartTickIcon' | 'HeartIcon' | 'HeadphonesIcon' | 'GridIcon' | 'GpsIcon' | 'GosUslugiIcon' | 'GlobalIcon' | 'GeolocationIcon' | 'FullScreenIcon' | 'FaxIcon' | 'EuroIcon' | 'EmptyWalletIcon' | 'EmptyWalletChangeIcon' | 'DzenIcon' | 'DoneSimpleIcon' | 'DoneIcon' | 'DollarIcon' | 'DocIcon' | 'DocDownloadIcon' | 'DiscountShapeIcon' | 'DevIcon' | 'CupIcon' | 'CourtHouseIcon' | 'CopyIcon' | 'ConvertCardIcon' | 'CoinIcon' | 'CloseIcon' | 'ClientIcon' | 'ChineseYuanRenminbiIcon' | 'ChevronLeftIcon' | 'ChatBotIcon' | 'ChartSquareIcon' | 'ChartRoundIcon' | 'ChartIcon' | 'CardTickIcon' | 'CardSendIcon' | 'CardPosIcon' | 'CardIcon' | 'CallbackIcon' | 'CalendarTickIcon' | 'CalendarIcon' | 'CalendarCircleIcon' | 'BurgerIcon' | 'BuildingIcon' | 'BriefcaseIcon' | 'BelarusianFlag' | 'BankIcon' | 'BankColorIcon' | 'AtmIcon' | 'ArrowUpSolidIcon' | 'ArrowUpIcon' | 'ArrowTopRightIcon' | 'ArrowRightIcon' | 'ArrowLeftIcon' | 'ArrowDownSolidIcon' | 'ArrowDownIcon' | 'AppleIcon' | 'AlarmIcon' | 'ActualBalanceIcon' | 'AchievementIcon';

package/src/retail/utils/latinFieldsUtils.ts

@@ -2,7 +2,9 @@ const MAX_LENGTH = 20;
 const latinPattern = /^[\u0041-\u005A\u0061-\u007A\s]+$/u;
 
 export const isValidLatin = (currentValue = '', secondValue = '') =>
-  latinPattern.test(currentValue) && secondValue.length < MAX_LENGTH;
+  latinPattern.test(currentValue) &&
+  secondValue.length < MAX_LENGTH &&
+  currentValue.length + secondValue.length <= MAX_LENGTH;
 
 const REPLACER = {
   А: 'A',

package/src/ui-kit/DialogManager/Dialog.tsx

@@ -1,4 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useMobileMode } from '../../hooks/useMobileMode';
 import { type OnClickPreventableProps } from '../../model/OnClickProps';
 import type { OnCloseProps } from '../../model/OnCloseProps';
 import { type VNode } from '../../model/VNode';
@@ -6,10 +7,12 @@ import { style } from '../../utils/style';
 import { CloseButton } from './CloseButton';
 
 type DialogType = 'sm' | 'lg' | '4xl' | 'none';
+type DialogPosition = 'center' | 'corner';
 
 export interface DialogProps extends OnCloseProps, OnClickPreventableProps {
   head?: VNode;
   maxWidth?: DialogType;
+  position?: DialogPosition;
 }
 
 const DIALOG_STYLE: Record<DialogType, string> = {
@@ -19,20 +22,34 @@ const DIALOG_STYLE: Record<DialogType, string> = {
   none: 'mt-0',
 };
 
-export const Dialog = JSX<DialogProps>(({ head, maxWidth = '4xl', children, onClose, onClick }) => (
-  <div
-    className={style(
-      'relative bg-white p-lg pb-6xl my-6xl mx-auto rounded-lg w-full',
-      DIALOG_STYLE[maxWidth],
-    )}
-    role="dialog"
-    title="Диалог"
-    onClick={onClick}
-  >
-    <div className="sticky py-xl top-0 bg-white z-10">
-      <CloseButton className="absolute top-0 right-0 z-10" onClose={onClose} />
-      <div className="container">{head}</div>
-    </div>
-    <div className="container">{children}</div>
-  </div>
-));
+const DIALOG_POSITION: Record<DialogPosition, string> = {
+  center: 'relative mx-auto',
+  corner: 'absolute bottom-0 right-0',
+};
+
+export const Dialog = JSX<DialogProps>(
+  ({ head, maxWidth = '4xl', children, onClose, onClick, position = 'center' }) => {
+    const isMobileMode = useMobileMode();
+
+    return (
+      <div
+        className={style(
+          'bg-white p-lg pb-6xl my-6xl rounded-lg w-full',
+          DIALOG_STYLE[maxWidth],
+          DIALOG_POSITION[position],
+          { 'mr-3xl': !isMobileMode && position === 'corner' },
+          { 'mb-12': isMobileMode },
+        )}
+        role="dialog"
+        title="Диалог"
+        onClick={onClick}
+      >
+        <div className="sticky py-xl top-0 bg-white z-10">
+          <CloseButton className="absolute top-0 right-0 z-10" onClose={onClose} />
+          <div className="container">{head}</div>
+        </div>
+        <div className="container">{children}</div>
+      </div>
+    );
+  },
+);

package/src/ui-kit/FormField/Fields/CallbackTimeField.tsx

@@ -0,0 +1,32 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { type Option } from '../../Select/Option';
+import { SelectControl } from '../../Select/SelectControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+
+const CALLBACK_TIME: Option[] = [
+  {
+    key: 'Перезвонить сейчас',
+    text: 'Перезвонить сейчас',
+  },
+  {
+    key: 'Перезвонить через час',
+    text: 'Перезвонить через час',
+  },
+  {
+    key: 'Перезвонить через два часа',
+    text: 'Перезвонить через два часа',
+  },
+  {
+    key: 'Перезвонить завтра',
+    text: 'Перезвонить завтра',
+  },
+];
+
+export const CallbackTimeField = JSX<CustomFieldProps>(({ field, input }) => (
+  <SelectControl
+    label="Когда перезвонить?"
+    {...input}
+    options={CALLBACK_TIME}
+    {...field(input?.name ?? '')}
+  />
+));

package/src/ui-kit/FormField/Fields/QuestionProductField.tsx

@@ -0,0 +1,25 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { Option } from '../../Select/Option';
+import { SelectControl } from '../../Select/SelectControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+
+type RegionFieldProps = CustomFieldProps;
+
+const QUESTION_PRODUCT_TYPES: Option[] = [
+  {
+    key: 'Вопрос по действующему продукту',
+    text: 'Вопрос по действующему продукту',
+  },
+  {
+    key: 'Оформление нового продукта',
+    text: 'Оформление нового продукта',
+  },
+];
+
+export const QuestionProductField = JSX<RegionFieldProps>(({ field, input }) => (
+  <SelectControl
+    label="Какой у вас вопрос?"
+    options={QUESTION_PRODUCT_TYPES}
+    {...field(input?.name ?? '')}
+  />
+));

package/src/ui-kit/FormField/NameFieldDef.ts

@@ -42,6 +42,8 @@ type NameFieldApplicationDef =
   | 'partnerSymbolCode'
   | 'partnerName'
   | 'dadataPartyNameSelect'
-  | 'dadataPartyInnSelect';
-
+  | 'dadataPartyInnSelect'
+  | 'questionProduct'
+  | 'callbackTime'
+  | 'russianPhone';
 export type NameFieldDef = NameFieldApplicationDef;

package/src/ui-kit/FormField/getField.tsx

@@ -11,6 +11,7 @@ import { ApplicationDateField } from './Fields/ApplicationDateField';
 import { ApplierTypeField } from './Fields/ApplierTypeField';
 import { BankEmpoleeField } from './Fields/BankEmpoleeField';
 import { BirthdayField } from './Fields/BirthdayField';
+import { CallbackTimeField } from './Fields/CallbackTimeField';
 import { CollectionCountField } from './Fields/CollectionCountField';
 import { CommentField } from './Fields/CommentField';
 import { DadataPartySelectField } from './Fields/DadataPartySelectField';
@@ -31,6 +32,7 @@ import { PartnerSymbolCodeField } from './Fields/PartnerSymbolCodeField';
 import { PhoneField } from './Fields/PhoneField';
 import { PosTerminalField } from './Fields/PosTerminalField';
 import { ProductField } from './Fields/ProductField';
+import { QuestionProductField } from './Fields/QuestionProductField';
 import { RegionField } from './Fields/RegionField';
 import { RepresentativeNameField } from './Fields/RepresentativeNameField';
 import { SecondaryPhoneField } from './Fields/SecondaryPhoneField';
@@ -102,6 +104,9 @@ const InputsMap = {
   partnerName: (props: CustomFieldProps) => <PartnerNameField {...props} source={AGENTS_REF} />,
   dadataPartyNameSelect: DadataPartySelectField,
   dadataPartyInnSelect: DadataPartySelectField,
+  questionProduct: QuestionProductField,
+  callbackTime: CallbackTimeField,
+  russianPhone: PhoneField,
 };
 
 export const getField =

package/src/ui-kit/FormField/getObjectValidator.tsx

@@ -10,6 +10,7 @@ import {
   innValidator,
   nameValidator,
   phoneValidator,
+  russianPhoneValidator,
 } from './validators';
 
 export const validatorObj: Record<string, Validator> = {
@@ -44,6 +45,9 @@ export const validatorObj: Record<string, Validator> = {
   partnerSymbolCode: defaultValidator('Укажите идентификатор партнёра'),
   dadataPartyInnSelect: innDadataValidator('Укажите ИНН'),
   dadataPartyNameSelect: defaultValidator('Укажите наименование организации'),
+  callbackTime: defaultValidator(),
+  questionProduct: defaultValidator(),
+  russianPhone: russianPhoneValidator('Укажите номер телефона'),
 };
 
 export const getFormValidator = <FormState extends Record<string, any>, F extends BaseFieldDef>(

package/src/ui-kit/FormField/validators.ts

@@ -29,8 +29,14 @@ export const innDadataValidator = (errorMsg: string) =>
 const phoneValidate = (email: string) =>
   /^(\+7)?[\s-]?\(?[0-9]{3}\)?[\s-]?[0-9]{3}[\s-]?[0-9]{2}[\s-]?[0-9]{2}$/.test(email);
 
+const russianPhoneValidate = (email: string) =>
+  /^(\+7)?[\s-]?\(?[3489][0-9]{2}\)?[\s-]?[0-9]{3}[\s-]?[0-9]{2}[\s-]?[0-9]{2}$/.test(email);
+
 export const phoneValidator = (errorMsg: string) => validator(phoneValidate)(errorMsg);
 
+export const russianPhoneValidator = (errorMsg: string) =>
+  validator(russianPhoneValidate)(errorMsg);
+
 export const phoneOptionalValidator = (errorMsg: string) =>
   validator((_: string) => !_ || phoneValidate(_))(errorMsg);
 

package/src/ui-kit/PhoneCallRequestDialog/PhoneCallRequestDialog.fixture.tsx

@@ -0,0 +1,7 @@
+import '../../setup-fixture';
+
+import { PhoneCallRequestDialog } from './PhoneCallRequestDialog';
+
+export default {
+  default: <PhoneCallRequestDialog />,
+};