@redneckz/wildless-cms-uni-blocks 0.12.14 → 0.13.0

package/src/components/Header/HeaderTop.tsx

@@ -8,6 +8,8 @@ import type { BlockVersion } from '../../model/BlockVersion';
 import { Img } from '../../ui-kit/Img/Img';
 import { useRouter } from '../../hooks/useRouter';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { projectSettings } from '../../ProjectSettings';
+import type { PreventableEvent } from '../../ui-kit/PreventableEvent';
 
 export interface HeaderTopProps {
   bgColor?: BgColorVersion;
@@ -23,26 +25,18 @@ const BUTTON_STYLE = {
 
 export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl, version }) => {
   const router = useRouter();
-  const isRootLocation = router.pathname === '/';
-  const onClick = useCallback(() => {
+  const isRootLocation = projectSettings.BASE_PATH?.startsWith(router.pathname);
+  const onClick = useCallback((e) => {
+    e.preventDefault();
     router.back();
   }, []);
 
   return (
     <div className="flex items-center justify-between w-full">
       {isRootLocation ? (
-        <Logo bgColor={bgColor} logo={logo} />
+        <Logo className="mt-2xs" bgColor={bgColor} logo={logo} />
       ) : (
-        <Button className="flex items-center text-l" ariaLabel="Вернуться назад" onClick={onClick}>
-          <Img
-            className="w-6 h-6"
-            image={{
-              icon: 'ChevronLeft',
-              iconVersion: 'black',
-            }}
-          />
-          Вернуться назад
-        </Button>
+        renderBackButton(onClick)
       )}
       {internetBankUrl ? (
         <Button
@@ -50,7 +44,7 @@ export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl,
           ariaLabel="Войти"
           target="_blank"
           className={style(
-            'p-s my-2xs text-s whitespace-nowrap text-primary-main hover:text-primary-hover',
+            'p-s text-s whitespace-nowrap text-primary-main hover:text-primary-hover',
             BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default'],
           )}
         >
@@ -60,3 +54,22 @@ export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl,
     </div>
   );
 });
+
+const renderBackButton = (onClick: (ev?: PreventableEvent) => void) => (
+  <button
+    className="flex items-center text-l mt-2xs"
+    aria-label="Вернуться назад"
+    onClick={onClick}
+  >
+    <Img
+      className="w-6 h-6"
+      image={{
+        icon: 'ChevronLeftIcon',
+        iconVersion: 'black',
+      }}
+      width="24"
+      height="24"
+    />
+    Вернуться назад
+  </button>
+);

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

@@ -1,8 +1,8 @@
 import '../../setup-fixture';
 
-import { MobileAppTile } from './MobileAppTile';
 import type { Picture } from '../../model/Picture';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
+import { MobileAppTile } from './MobileAppTile';
 
 const image: Picture = {
   src: 'icon-phone.png',
@@ -66,8 +66,6 @@ export default {
           },
           buttonPlay,
           buttonPlay,
-          buttonStore,
-          buttonPlay,
         ]}
       />
     </div>

package/src/components/MobileAppTile/MobileAppTile.tsx

@@ -50,6 +50,7 @@ export const MobileAppTile = JSX<MobileAppTileProps>(
               />
             ) : null
           }
+          rightImage={image?.src ? <Img className="hidden lg:block" image={image} /> : null}
           buttons={renderButtonsSection(buttons, { isVertical: buttons.length > 4 })}
         >
           {renderDescription(description)}
@@ -60,7 +61,7 @@ export const MobileAppTile = JSX<MobileAppTileProps>(
               </div>
             ) : null}
             {renderList(items)}
-            {image?.src ? <Img image={image} /> : null}
+            {image?.src ? <Img className="lg:hidden" image={image} /> : null}
           </div>
         </BaseTile>
       </BlockWrapper>

package/src/components/MortgageFiltration/HotFilterRecord.ts

@@ -0,0 +1,14 @@
+import { arrCmp, combineBoolCmps, objCmp, scalarCmp } from '../../utils/BoolComparator';
+
+export type HotFilterRecord = {
+  /** @title Тип недвижимости */
+  propertyType?: string[];
+  /** @title Этап строительства */
+  stage?: string[];
+  /** @title Категории */
+  categories?: string[];
+  /** @title Дополнительно */
+  extraOptions?: string[];
+};
+
+export const hotFilterRecordCmp = objCmp<string[]>(combineBoolCmps(scalarCmp, arrCmp()));

package/src/components/MortgageFiltration/MortgageFiltration.example.json

@@ -6,8 +6,15 @@
         "type": "array",
         "items": {
           "type": "string",
-          "enum": ["flat", "apartment", "house", "storeRoom", "parkingSpace"],
-          "enumNames": ["Квартира", "Апартаменты", "Жилой дом", "Кладовая", "Машино-место"]
+          "enum": ["flat", "apartment", "house", "storeRoom", "parkingSpace", "suburban"],
+          "enumNames": [
+            "Квартира",
+            "Апартаменты",
+            "Жилой дом",
+            "Кладовая",
+            "Машино-место",
+            "Загородная недвижимость"
+          ]
         }
       },
       "stage": {
@@ -40,11 +47,54 @@
         "type": "array",
         "items": {
           "type": "string",
-          "enum": ["preferentialMortgage", "children"],
-          "enumNames": ["Льготная ипотека", "Дети"]
+          "enum": ["preferentialMortgage", "children", "refinancing"],
+          "enumNames": ["Льготная ипотека", "Дети", "Рефинансирование"]
         }
       }
     },
+    "hotFilters": [
+      { "text": "Все программы" },
+      {
+        "text": "Льготные программы",
+        "filter": {
+          "categories": [],
+          "extraOptions": ["preferentialMortgage"],
+          "propertyType": [],
+          "stage": []
+        }
+      },
+      {
+        "text": "Строящееся жилье",
+        "filter": {
+          "stage": ["inProgress"],
+          "categories": [],
+          "extraOptions": [],
+          "propertyType": []
+        }
+      },
+      {
+        "text": "Готовое жилье",
+        "filter": { "stage": ["built"], "categories": [], "extraOptions": [], "propertyType": [] }
+      },
+      {
+        "text": "Загородная недвижимость",
+        "filter": {
+          "propertyType": ["suburban"],
+          "categories": [],
+          "extraOptions": [],
+          "stage": []
+        }
+      },
+      {
+        "text": "Рефинансирование",
+        "filter": {
+          "categories": [],
+          "extraOptions": ["refinancing"],
+          "propertyType": [],
+          "stage": []
+        }
+      }
+    ],
     "resetButton": {
       "text": "Очистить фильтры",
       "version": "secondary"

package/src/components/MortgageFiltration/MortgageFiltration.fixture.tsx

@@ -4,42 +4,42 @@ import type { BlockRendererOptions } from '../../BlockRenderer/BlockRendererOpti
 import { Blocks } from '../Blocks';
 import { PRODUCT_TILE } from '../ProductTile/ProductTile.fixture';
 import { MortgageFiltration } from './MortgageFiltration';
-import type { MortgageFiltrationContent } from './MortgageFiltrationContent';
+import type { HotFilterButton, MortgageFiltrationContent } from './MortgageFiltrationContent';
 
 const PROPERTY_APARTMENT = {
-  propertyType: 'apartment',
+  propertyType: ['apartment'],
 };
 
 const PROPERTY_FLAT = {
-  propertyType: 'flat',
+  propertyType: ['flat'],
 };
 
 const PROPERTY_HOUSE = {
-  propertyType: 'house',
+  propertyType: ['house'],
 };
 
 const STAGE_BUILT = {
-  stage: 'built',
+  stage: ['built'],
 };
 
 const STAGE_IN_PROGRESS = {
-  stage: 'inProgress',
+  stage: ['inProgress'],
 };
 
 const EXTRA_MORTGAGE = {
-  extraOptions: 'preferentialMortgage',
+  extraOptions: ['preferentialMortgage'],
 };
 
 const EXTRA_CHILDREN = {
-  extraOptions: 'children',
+  extraOptions: ['children'],
 };
 
 const CATEGORY_IT = {
-  categories: 'IT',
+  categories: ['IT'],
 };
 
 const CATEGORY_SALARY = {
-  categories: 'salaryClient',
+  categories: ['salaryClient'],
 };
 
 const generateBlock = (...presets: any[]) => ({
@@ -54,8 +54,15 @@ const SCHEMA: MortgageFiltrationContent['filtrationSchema'] = {
     type: 'array',
     items: {
       type: 'string',
-      enum: ['flat', 'apartment', 'house', 'storeRoom', 'parkingSpace'],
-      enumNames: ['Квартира', 'Апартаменты', 'Жилой дом', 'Кладовая', 'Машино-место'],
+      enum: ['flat', 'apartment', 'house', 'storeRoom', 'parkingSpace', 'suburban'],
+      enumNames: [
+        'Квартира',
+        'Апартаменты',
+        'Жилой дом',
+        'Кладовая',
+        'Машино-место',
+        'Загородная недвижимость',
+      ],
     },
   },
   stage: {
@@ -88,12 +95,41 @@ const SCHEMA: MortgageFiltrationContent['filtrationSchema'] = {
     type: 'array',
     items: {
       type: 'string',
-      enum: ['preferentialMortgage', 'children'],
-      enumNames: ['Льготная ипотека', 'Дети'],
+      enum: ['preferentialMortgage', 'children', 'refinancing'],
+      enumNames: ['Льготная ипотека', 'Дети', 'Рефинансирование'],
     },
   },
 };
 
+const HOT_FILTERS: HotFilterButton[] = [
+  { text: 'Все программы' },
+  {
+    text: 'Льготные программы',
+    filter: {
+      categories: [],
+      extraOptions: ['preferentialMortgage'],
+      propertyType: [],
+      stage: [],
+    },
+  },
+  {
+    text: 'Строящееся жилье',
+    filter: { stage: ['inProgress'], categories: [], extraOptions: [], propertyType: [] },
+  },
+  {
+    text: 'Готовое жилье',
+    filter: { stage: ['built'], categories: [], extraOptions: [], propertyType: [] },
+  },
+  {
+    text: 'Загородная недвижимость',
+    filter: { propertyType: ['suburban'], categories: [], extraOptions: [], stage: [] },
+  },
+  {
+    text: 'Рефинансирование',
+    filter: { categories: [], extraOptions: ['refinancing'], propertyType: [], stage: [] },
+  },
+];
+
 const options = {
   blocksRegistry: Blocks,
 } as BlockRendererOptions;
@@ -106,6 +142,7 @@ export default {
         label="Другие ипотечные программы"
         filtrationSchema={SCHEMA}
         topItemsCount={2}
+        hotFilters={HOT_FILTERS}
         resetButton={{ text: 'Очистить фильтры', version: 'secondary' }}
         notFound={{
           title: 'Нет подходящей программы',

package/src/components/MortgageFiltration/MortgageFiltration.tsx

@@ -1,19 +1,60 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 import { BaseFiltrationInner } from '../../ui-kit/BaseFiltration/BaseFiltrationInner';
 import { renderFiltrationForm } from '../../ui-kit/BaseFiltration/renderFiltrationForm';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import type { TabItemBase } from '../../ui-kit/TabsControl/TabItem';
+import { TabsControl } from '../../ui-kit/TabsControl/TabsControl';
 import { style } from '../../utils/style';
-import type { MortgageFiltrationContent } from './MortgageFiltrationContent';
+import { hotFilterRecordCmp } from './HotFilterRecord';
+import type {
+  MortgageFiltrationContent,
+  MortgageFiltrationSchema,
+} from './MortgageFiltrationContent';
 
 interface MortgageFiltrationProps extends MortgageFiltrationContent, UniBlockProps {}
 
-const initialFiltrationState = {};
+const initialFiltrationState: Partial<Record<keyof MortgageFiltrationSchema, string[]>> = {
+  categories: [],
+  extraOptions: [],
+  propertyType: [],
+  stage: [],
+};
 
 export const MortgageFiltration: JSXBlock<MortgageFiltrationProps> = JSX<MortgageFiltrationProps>(
-  ({ className, filtrationSchema = {}, resetButton, ...rest }) => {
-    const [filtrationState, { field, reset }] = useForm(initialFiltrationState);
+  ({ className, hotFilters = [], filtrationSchema = {}, resetButton, ...rest }) => {
+    const [filtrationState, { field, reset, update: replaceFiltrationState }] =
+      useForm(initialFiltrationState);
+
+    const normalizedHotFilters: TabItemBase[] = useMemo(
+      () =>
+        hotFilters.map(({ text }) => ({
+          text,
+        })),
+      [hotFilters],
+    );
+
+    const [hotFilterIndex, setHotFilterIndex] = useState(0);
+
+    const handleHotFilterSelect = useCallback(
+      (_: TabItemBase) => {
+        setHotFilterIndex(normalizedHotFilters.indexOf(_));
+        replaceFiltrationState(
+          hotFilters[normalizedHotFilters.indexOf(_)].filter || initialFiltrationState,
+        );
+      },
+      [normalizedHotFilters],
+    );
+
+    useEffect(() => {
+      const suggestedHotFilterIndex = hotFilters.findIndex((_) =>
+        hotFilterRecordCmp(_.filter, filtrationState),
+      );
+
+      setHotFilterIndex(suggestedHotFilterIndex !== -1 ? suggestedHotFilterIndex : 0);
+    }, [hotFilters, filtrationState]);
 
     return (
       <BlockWrapper
@@ -22,6 +63,12 @@ export const MortgageFiltration: JSXBlock<MortgageFiltrationProps> = JSX<Mortgag
         version="transparent"
         {...rest}
       >
+        <TabsControl
+          className="mb-2xs"
+          items={normalizedHotFilters}
+          value={normalizedHotFilters[hotFilterIndex]}
+          onChange={handleHotFilterSelect}
+        />
         {renderFiltrationForm({ field, reset, filtrationSchema, resetButton })}
         <BaseFiltrationInner filtrationState={filtrationState} {...rest} />
       </BlockWrapper>

package/src/components/MortgageFiltration/MortgageFiltrationContent.ts

@@ -2,6 +2,7 @@ import type {
   BaseFiltrationInnerContent,
   StringArray,
 } from '../../ui-kit/BaseFiltration/BaseFiltrationContent';
+import type { HotFilterRecord } from './HotFilterRecord';
 
 export type MortgageFiltrationSchema = {
   /** @title Тип недвижимости */
@@ -14,10 +15,22 @@ export type MortgageFiltrationSchema = {
   extraOptions?: StringArray;
 };
 
+/**
+ * @title Кнопка фильтрации
+ */
+export interface HotFilterButton {
+  /** @title Текст */
+  text?: string;
+  /** @title Применяемые фильтры */
+  filter?: HotFilterRecord;
+}
+
 /**
  * @title Подборщик ипотек
  */
 export interface MortgageFiltrationContent extends BaseFiltrationInnerContent {
   /** @title Параметры фильтрации */
   filtrationSchema?: MortgageFiltrationSchema;
+  /** @title Горячие фильтры */
+  hotFilters?: HotFilterButton[];
 }

package/src/components/RollupItem/RollupItem.tsx

@@ -132,7 +132,7 @@ const renderPrimaryFoldButton = ({
       )}
       onClick={onToggle}
     >
-      <div className="flex items-center group-hover/button:text-primary-main gap-s">
+      <div className="flex items-center text-start group-hover/button:text-primary-main gap-s">
         {renderRoundedIcon(labelIcon, labelIconBgVersion)}
         {label ? (
           <Text size="text-h6" font="font-normal">

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

@@ -3,5 +3,5 @@ import { RoundedIcon } from '../../ui-kit/Icon/RoundedIcon';
 import type { IconBgVersion } from '../../ui-kit/Icon/IconProps';
 
 export const renderRoundedIcon = (icon?: Picture, iconBgVersion?: IconBgVersion) => (
-  <RoundedIcon {...icon} iconBgVersion={iconBgVersion} />
+  <RoundedIcon {...icon} iconBgVersion={iconBgVersion} className="shrink-0" />
 );

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

@@ -1 +1 @@
-export const rollupIconVersion = 'normal';
+export const rollupIconVersion = 'black';

package/src/components/Tabs/Tabs.tsx

@@ -1,73 +1,60 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { defaultEventBus } from '../../EventBus/defaultEventBus';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import type { TabItemBase } from '../../ui-kit/TabsControl/TabItem';
 import { style } from '../../utils/style';
-import { CenteredTabs } from './CenteredTabs';
-import { renderTab } from './renderTab';
-import { ScrollableTabs } from './ScrollableTabs';
+import { renderTabs } from './renderTabs';
 import type { TabData, TabsContent } from './TabsContent';
 
 export interface TabsBlockProps extends TabsContent, UniBlockProps {}
 
-interface RenderTabsProps extends TabsBlockProps {
-  currentTab?: TabData;
-  onClick: (tab: TabData) => void;
-}
+export const Tabs = JSX<TabsBlockProps>(
+  ({ className = '', isSticky, tabs = [], tabsMode, ...rest }) => {
+    const normalizedTabs: TabItemBase[] = useMemo(() => tabs.map(normalizeTab), [tabs]);
 
-export const Tabs = JSX<TabsBlockProps>((props) => {
-  const { className = '', isSticky, tabs, ...rest } = props;
+    const [activeTabIndex, setActiveTabIndex] = useState(0);
 
-  const [currentTab, setCurrentTab] = useState(tabs ? tabs[0] : undefined);
+    useEffect(() => {
+      if (!tabs || !tabs[0]) {
+        return;
+      }
 
-  useEffect(() => {
-    if (!tabs || !tabs[0]) {
-      return;
-    }
+      fireTabEvent(tabs[0]);
+    }, []);
 
-    fireTabEvent(tabs[0]);
-  }, []);
+    useEffect(() => {
+      const activeTab = tabs[activeTabIndex];
 
-  useEffect(() => {
-    if (currentTab?.type === 'group') {
-      defaultEventBus.subject('tab', { type: currentTab.type, label: currentTab.ref });
-    }
-  }, [currentTab]);
+      if (activeTab?.type === 'group') {
+        defaultEventBus.subject('tab', { type: activeTab.type, label: activeTab.ref });
+      }
+    }, [tabs, activeTabIndex]);
 
-  const handleClick = useCallback((selectedTab: TabData) => {
-    fireTabEvent(selectedTab);
-    setCurrentTab(selectedTab);
-  }, []);
+    const handleChange = useCallback((_: TabItemBase) => {
+      const index = normalizedTabs.indexOf(_);
 
-  return (
-    <BlockWrapper
-      className={style(
-        'relative box-border flex gap-x-1 w-full overflow-x-auto no-scrollbar',
-        isSticky ? 'sticky top-1 z-20' : '',
-        className,
-      )}
-      defaultPadding="p-0"
-      role="tablist"
-      {...rest}
-    >
-      {renderTabs({ tabs, onClick: handleClick, currentTab, ...rest })}
-    </BlockWrapper>
-  );
-});
+      setActiveTabIndex(index);
+      fireTabEvent(tabs[index]);
+    }, []);
 
-const renderTabs = ({ tabsMode, tabs, ...rest }: RenderTabsProps) => {
-  switch (tabsMode) {
-    case 'wideScreen':
-      return tabs?.map(renderTab({ tabsMode, ...rest }));
-    case 'centered':
-      return <CenteredTabs tabs={tabs} tabsMode={tabsMode} {...rest} />;
-    case 'scrollable':
-      return <ScrollableTabs tabs={tabs} tabsMode={tabsMode} {...rest} />;
-  }
-
-  return null;
-};
+    return (
+      <BlockWrapper
+        className={style(isSticky ? 'sticky top-1 z-20' : '', className)}
+        defaultPadding="p-0"
+        {...rest}
+      >
+        {renderTabs({
+          items: normalizedTabs,
+          onChange: handleChange,
+          value: normalizedTabs[activeTabIndex],
+          tabsMode,
+        })}
+      </BlockWrapper>
+    );
+  },
+);
 
 const fireTabEvent = (tab: TabData) => {
   if (tab.type === 'group') {
@@ -77,3 +64,5 @@ const fireTabEvent = (tab: TabData) => {
     defaultEventBus.fire('tab', { type: tab.type, label: tab.href });
   }
 };
+
+const normalizeTab = (_: TabData): TabItemBase => (_?.type === 'group' ? { text: _.title } : _);

package/src/components/Tabs/renderTabs.tsx

@@ -0,0 +1,37 @@
+import { ScrollableTabsControl } from '../../ui-kit/TabsControl/ScrollableTabsControl';
+import type { TabItemBase } from '../../ui-kit/TabsControl/TabItem';
+import { TabsControl } from '../../ui-kit/TabsControl/TabsControl';
+import type { TabsControlProps } from '../../ui-kit/TabsControl/TabsControlProps';
+import type { TabsMode } from './TabsContent';
+
+interface RenderTabsProps {
+  items: TabItemBase[];
+  value: TabItemBase;
+  onChange: TabsControlProps['onChange'];
+  tabsMode?: TabsMode;
+}
+
+export const renderTabs = ({ tabsMode, ...props }: RenderTabsProps) => {
+  switch (tabsMode) {
+    case 'wideScreen':
+      return <TabsControl {...props} />;
+    case 'centered':
+      return (
+        <div className="flex">
+          <TabsControl
+            className="m-auto p-xs rounded-md bg-main-gray"
+            tabsType="rounded"
+            {...props}
+          />
+        </div>
+      );
+    case 'scrollable':
+      return (
+        <div className="flex">
+          <ScrollableTabsControl className="m-auto" tabsType="underlined" {...props} />
+        </div>
+      );
+    default:
+      return null;
+  }
+};

package/src/hooks/useForm.ts

@@ -25,6 +25,7 @@ export const useForm = <FormState extends Record<string, any>>(
   {
     isDirty: boolean;
     field: FormFieldRegisterer<FormState>;
+    update: (_: FormState) => void;
     reset: () => void;
     onSubmit: (e: PreventableEvent) => void;
   },
@@ -60,6 +61,11 @@ export const useForm = <FormState extends Record<string, any>>(
     [formState, isDirtyForm, dirtyFieldsMap],
   );
 
+  const update = useCallback((_: FormState) => {
+    setFormState(_);
+    setDirtyFieldsMap(_);
+  }, []);
+
   const reset = useCallback(() => {
     setFormState(initialState);
     setDirtyForm(false);
@@ -81,6 +87,7 @@ export const useForm = <FormState extends Record<string, any>>(
     {
       isDirty: isDirtyForm || Object.values(dirtyFieldsMap).some(Boolean),
       field,
+      update,
       reset,
       onSubmit: handleSubmit,
     },

package/src/icons/ArrowDownSolidIcon.svg

@@ -1 +1 @@
-<svg title="Стрелка сплошная 'Вниз'" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 25"><path fill="#C8CCD0" d="M6.293 9.457a1 1 0 0 1 1.414 0L12 13.75l4.293-4.293a1 1 0 1 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0l-5-5a1 1 0 0 1 0-1.414Z"/></svg>
+<svg title="Стрелка сплошная 'Вниз'" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 25"><path fill="currentColor" d="M6.293 9.457a1 1 0 0 1 1.414 0L12 13.75l4.293-4.293a1 1 0 1 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0l-5-5a1 1 0 0 1 0-1.414Z"/></svg>

package/src/icons/ArrowUpSolidIcon.svg

@@ -1 +1 @@
-<svg title="Стрелка сплошная 'Вверх'" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 25"><path fill="#C8CCD0" d="M17.707 14.871a1 1 0 0 1-1.414 0L12 10.578l-4.293 4.293a1 1 0 0 1-1.414-1.414l5-5a1 1 0 0 1 1.414 0l5 5a1 1 0 0 1 0 1.414Z"/></svg>
+<svg title="Стрелка сплошная 'Вверх'" isInverse="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 25"><path fill="currentColor" d="M17.707 14.871a1 1 0 0 1-1.414 0L12 10.578l-4.293 4.293a1 1 0 0 1-1.414-1.414l5-5a1 1 0 0 1 1.414 0l5 5a1 1 0 0 1 0 1.414Z"/></svg>