feat: add CustomScrollView.Tint

[SevereCloud]

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

Описание

Добавляем компонент для создания теней к прокручиваемой области

Release notes

Новые компоненты

• CustomScrollViewTint: Подкомпонент, который добавляет тени к краям прокручиваемой области

[github-actions]

size-limit report 📦

Path	Size
JS	412.56 KB (+0.15% 🔺)
JS (gzip)	126.71 KB (+0.19% 🔺)
JS (brotli)	104.31 KB (+0.21% 🔺)
JS import Div (tree shaking)	811 B (0%)
CSS	373.41 KB (+0.04% 🔺)
CSS (gzip)	46.3 KB (+0.09% 🔺)
CSS (brotli)	36.59 KB (+0.05% 🔺)

[github-actions]

e2e tests

⚠️ Some screenshots were failed. See Playwright Report.

Playwright Report

[github-actions]

📊 Найдены изменения в собранных файлах: Отчет

Commit 021b56a

[github-actions]

👀 Docs deployed

• ✅ Website
• ✅ Playground

📦 Package ✅

yarn add @vkontakte/vkui@https://development.s3.prodcloud.vk.team/pull/9359/021b56a5b4776802865111dfc69af38c909d4a4f/pkg/@vkontakte/vkui/_pkg.tgz

Commit 021b56a

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 94.75%. Comparing base (6e3da5e) to head (021b56a).

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #9359      +/-   ##
==========================================
+ Coverage   94.73%   94.75%   +0.02%     
==========================================
  Files         440      441       +1     
  Lines       11898    11930      +32     
  Branches     4386     4393       +7     
==========================================
+ Hits        11271    11304      +33     
+ Misses        627      626       -1     

Flag	Coverage Δ
unittests	94.75% <100.00%> (+0.02%)	⬆️

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.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[EldarMuhamethanov]

👍

[EldarMuhamethanov]

Пересчет теней происходит только при скролле, но при изменении размеров контейнера не происходит пересчет. Может добавить useResizeObserver?

[EldarMuhamethanov]

Я тут подумал, размер контейнера CustomScrollView может и не измениться при изменении реального размера содержимого, так что тут useResizeObserver будет бесполезным. Тут либо добавлять еще один контейнер, у которого будет меняться размер, при изменении размеров содержимого, либо забить надо это и вовсе убрать useResizeObserver, но тогда могут появиться баги в будущем

[EldarMuhamethanov]

У нас вроде не очень приветствуется использование renderFn подхода, потому что нужно мемоизировать children функцию снаружи и свойства прокидываемые в функцию. Может лучше использовать контекст как в Accordion.