feat(Tabs): add layoutFillMode prop

[BlackySoul]

• resolve [Feature][Tabs]: Возможность отключения растягивания компонента в HorizontalScroll #6088

---

- [ ] Unit-тесты

• e2e-тесты
• Дизайн-ревью
• Документация фичи

Описание

Был запрос на возможность растягивать или сжимать табы вне зависимости от контекста (платформы или использования внутри HorizontalScroll)

Изменения

Добавлен проп layoutFillMode, который позволяет форсить растягивание/сжатие вкладок, сохраняя существующее поведение

P.S.: принимаю пожертвования в виде более подходящего названия для пропа 🥺 @inomdzhon THX!

[github-actions]

size-limit report 📦

Path	Size
JS	344.87 KB (+0.06% 🔺)
JS (gzip)	105.34 KB (+0.07% 🔺)
JS (brotli)	87.1 KB (+0.06% 🔺)
JS import Div (tree shaking)	2.71 KB (0%)
CSS	259.36 KB (+0.05% 🔺)
CSS (gzip)	33.9 KB (+0.09% 🔺)
CSS (brotli)	27.52 KB (-0.05% 🔽)

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 0630438:

Sandbox	Source
VKUI TypeScript	Configuration
smoosh-violet-yghpyj	Issue #6088

[github-actions]

e2e tests

Playwright Report

[github-actions]

👀 Docs deployed

• ✅ Styleguide
• ✅ Storybook

Commit 0630438

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (107c29d) 79.38% compared to head (0630438) 79.63%.
Report is 12 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #6114      +/-   ##
==========================================
+ Coverage   79.38%   79.63%   +0.24%     
==========================================
  Files         306      303       -3     
  Lines        9631     9662      +31     
  Branches     3261     3280      +19     
==========================================
+ Hits         7646     7694      +48     
+ Misses       1985     1968      -17     

Flag	Coverage Δ
unittests	79.63% <100.00%> (+0.24%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[mendrew]

Выглядит прекрасно.

В качестве имени пропа можно было бы подумать над stretchMode или extendMode.

[BlackySoul]

Выглядит прекрасно.

В качестве имени пропа можно было бы подумать над stretchMode или extendMode.

А ты предлагаешь оставить все значения, как есть, просто переименовать itemsFlexMode в stretchMode/extendMode?

У меня вот есть сомнение по поводу значения stretchMode=shrink 😄

[mendrew]

А ты предлагаешь оставить все значения, как есть, просто переименовать itemsFlexMode в stretchMode/extendMode?

У меня вот есть сомнение по поводу значения stretchMode=shrink 😄

У меня нет сомнений. По-моему всё предельно близко по значению. Shrink тут как opposite для stretch: https://www.wordhippo.com/what-is/the-opposite-of/stretch.html

[mendrew]

А ты предлагаешь оставить все значения, как есть, просто переименовать itemsFlexMode в stretchMode/extendMode?
У меня вот есть сомнение по поводу значения stretchMode=shrink 😄

У меня нет сомнений. По-моему всё предельно близко по значению. Shrink тут как opposite для stretch: https://www.wordhippo.com/what-is/the-opposite-of/stretch.html

Ещё на языке вертится expandMode: 'stretch' | 'shrink' | 'auto';

Но я в целом и по поводу itemsFlexMode не против.

[inomdzhon]

✨ 💖 ✨

[inomdzhon]

✨ 💖 ✨ #2

[mendrew]

💅