При обновлении страницы съезжает нижний бордер у Tabs.

[TatianaSerpokrylova]

Опишите проблему

В случае, когда у одной из вкладок Tabs имеется пропс rightAddons, который зависит от динамических данных, и обновляется страница на вкладке правее, нижний красный бордер отображается согласно состоянию до обновления.

Шаги для воспроизведения

1. Перейти на страницу https://core-ds.github.io/core-components/master/?path=/docs/sandbox--docs
2. Ввести в песочнице следующий код:

const TABS = [
    { title: 'Aurum', id: 'tab-1' },
    { title: 'Bercelium', id: 'tab-2' },
    { title: 'Curium', id: 'tab-3' },
    
];

render(() => {
    const [selectedId, setSelectedId] = React.useState(TABS[0].id);
    const [badgeNumber, setBadgeNumber] = React.useState(0);

    
    const [overflowType, setOverflowType] = React.useState('scrollable');
    const [textStyle, setTextStyle] = React.useState('paragraph-primary-large');

    const handleChange = (event, { selectedId }) => {
        setSelectedId(selectedId);
    };
    

    const TabsComponent = overflowType === 'collapsible' ? TabsCollapsible : TabsDesktop;
    setTimeout(() => setBadgeNumber((prevState) => 3), 5000);
    return (
        <>
            <TabsComponent
                selectedId={selectedId}
                onChange={handleChange}
                textStyle={textStyle}
            >
                {TABS.map((item) => (
                    <Tab 
                      title={item.title} 
                      id={item.id} 
                      key={item.id} 
                      rightAddons={
                        (item.id === 'tab-2' && badgeNumber!== 0 &&
                          <Circle
                            size={20}
                            text={
                              <Typography.Text
                                  view='secondary-medium'
                                  weight='bold'
                                  tag='div'
                                  color='primary'
                              >
                                  {badgeNumber}
                              </Typography.Text>
                            }
                          />)}
                          />
                ))}
            </TabsComponent>
            <br />
            <Typography.Text view='primary-medium' color='secondary'>
                Выбран таб: {TABS.find((tab) => tab.id === selectedId).title}
            </Typography.Text>

           
        </>
    );
});

3. Нажать на вкладку Curium
4. Подождать 10 секунд до изменения состояния индикатора у Bercelium

Ожидаемое поведение

При обновлении данных нижний бордер вкладки Curium смещается вместе с самой вкладкой.

Чек лист

• Тесты
• Документация https://core-ds.github.io/core-components/master/?path=/docs/tabs--docs

Внешний вид

Ожидаемый	Фактический

| |

Тестовый стенд

Десктоп (если данных нет оставьте блок пустым):

• OS: MacOS
• Browser: Safari
• Version: 10

Смартфон (если данных нет оставьте блок пустым):

• Device: iPhone 6
• OS: iOS 10
• Browser: Chrome
• Version: 65

Дополнительная информация

Дополнительная информация