Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(Switch): use m3 redesign #6957

Merged
merged 8 commits into from
Jun 18, 2024
Merged

feat(Switch): use m3 redesign #6957

merged 8 commits into from
Jun 18, 2024

Conversation

inomdzhon
Copy link
Contributor

@inomdzhon inomdzhon commented May 24, 2024 •
edited
Loading

Описание

Взял длительность анимации и функцию easing'а из этой реализации https://material-web.dev/components/switch/#interactive-demo.

Note

Отвязался от токенов --vkui--size_switch_* (обговорили с @VKCOM/design).

Дополнительные изменения

Поправил состояние disabled в iOS версии – по дизайну opacity должен быть 70%.

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented May 24, 2024 •
edited
Loading

size-limit report 📦

Path Size
JS 364.35 KB (+0.1% 🔺)
JS (gzip) 111.55 KB (+0.08% 🔺)
JS (brotli) 91.77 KB (+0.01% 🔺)
JS import Div (tree shaking) 1.42 KB (0%)
CSS 282.95 KB (+1.36% 🔺)
CSS (gzip) 36.81 KB (+1.31% 🔺)
CSS (brotli) 29.84 KB (+1.37% 🔺)

@codesandbox-ci CodeSandbox CI
Copy link

codesandbox-ci bot commented May 24, 2024 •
edited
Loading

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.

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented May 24, 2024 •
edited
Loading

e2e tests

Playwright Report

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented May 24, 2024 •
edited
Loading

👀 Docs deployed

Commit 6f9e3c5

@codecov Codecov
Copy link

codecov bot commented May 24, 2024 •
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 83.42%. Comparing base (0aa34d9) to head (6f9e3c5).
Report is 14 commits behind head on master.

Additional details and impacted files 
@@            Coverage Diff             @@
##           master    #6957      +/-   ##
==========================================
+ Coverage   83.40%   83.42%   +0.02%     
==========================================
  Files         352      352              
  Lines       10532    10546      +14     
  Branches     3496     3504       +8     
==========================================
+ Hits         8784     8798      +14     
  Misses       1748     1748
Flag Coverage Δ
unittests 83.42% <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.

@qurle qurle self-assigned this May 27, 2024
@inomdzhon inomdzhon force-pushed the inomdzhon/issue6441 branch from caa78b6 to cc3e126 Compare May 28, 2024 07:05
@vkcom-publisher vkcom-publisher added the pr-needs-work Автоматизация: PR автоматически закроется через 14 дней при отсутствии активности label Jun 4, 2024
@inomdzhon inomdzhon force-pushed the inomdzhon/issue6441 branch 2 times, most recently from 4d1376f to 62729e9 Compare June 7, 2024 11:39
@inomdzhon inomdzhon added no-stale Добавляет PR в исключения для автоматического закрытия and removed pr-needs-work Автоматизация: PR автоматически закроется через 14 дней при отсутствии активности labels Jun 7, 2024
@inomdzhon inomdzhon requested a review from qurle June 7, 2024 12:37
@inomdzhon inomdzhon marked this pull request as ready for review June 7, 2024 12:37
@inomdzhon inomdzhon requested a review from a team as a code owner June 7, 2024 12:37
inomdzhon added 2 commits June 11, 2024 13:01
@inomdzhon
feat(Switch): use m3 redesign
404c88f
@inomdzhon
refactor(Switch): simplify animation
4915110 
Поправил состояние `disabled` у iOS версии.
@inomdzhon inomdzhon force-pushed the inomdzhon/issue6441 branch from 62729e9 to 33bb011 Compare June 11, 2024 10:55
@inomdzhon inomdzhon force-pushed the inomdzhon/issue6441 branch from 33bb011 to ff11987 Compare June 11, 2024 12:31
qurle
qurle previously approved these changes Jun 11, 2024
View reviewed changes
Copy link
Contributor

@qurle qurle left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Это не свитч, это бомба.

Идеи для бэклога:

  • реакция на свайпы в вебвью (требует JS)
  • продвинутая анимация (пока в самом нативе только упрощённая, целимся на однобразность)
  • обработка зажатий на андроиде (сейчас удержание даже на полсекунды не переключает свитч)

mendrew
mendrew previously approved these changes Jun 11, 2024
View reviewed changes
Copy link
Contributor

@mendrew mendrew left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Шикарно 🔥

packages/vkui/src/components/Switch/Switch.module.css Outdated Show resolved Hide resolved
packages/vkui/src/components/Switch/Switch.tsx Show resolved Hide resolved
@BlackySoul
Copy link
Contributor

Выглядит огонь, анимашки супер ✨
Но какие же они огромные, по сравнению со старыми х)

Не кажется, что в доке они теперь не подходят?

image

Как будто просто с чекбоксами лучше 🤔

image

@inomdzhon inomdzhon dismissed stale reviews from mendrew and qurle via fd107fd June 18, 2024 11:03
@inomdzhon
Copy link
Contributor Author

Выглядит огонь, анимашки супер ✨ Но какие же они огромные, по сравнению со старыми х)

Не кажется, что в доке они теперь не подходят?

image

Как будто просто с чекбоксами лучше 🤔

image

И в правду, Checkbox лучше выглядит 👍

Поправил ⚡ fd107fd

mendrew
mendrew reviewed Jun 18, 2024
View reviewed changes
Copy link
Contributor

@mendrew mendrew left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Шикарно! 🔥

Только одно место теперь смущает с useFocusVisible(false) 🙂

packages/vkui/src/components/Switch/Switch.tsx Outdated Show resolved Hide resolved
mendrew
mendrew approved these changes Jun 18, 2024
View reviewed changes
Copy link
Contributor

@mendrew mendrew left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💅

@inomdzhon inomdzhon merged commit b802ac8 into master Jun 18, 2024
26 checks passed
@inomdzhon inomdzhon deleted the inomdzhon/issue6441 branch June 18, 2024 19:44
@inomdzhon inomdzhon mentioned this pull request Aug 23, 2024
Merged
2 tasks
inomdzhon added a commit that referenced this pull request Aug 26, 2024
@inomdzhon
feat(Switch): decrease sizes for sizeY="compact" (#7440)
030724d 
В #6957 пропустил, что обводка должна скрываться, поэтому вынес обводку в псевдоэлемент с `border`, который создаётся только при `Switch--default`, тем самым теперь оперируем переменной `--vkui_internal--Switch__track_shadow_visibility`.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@BlackySoul BlackySoul BlackySoul left review comments

@mendrew mendrew mendrew approved these changes

@SevereCloud SevereCloud SevereCloud approved these changes

@qurle qurle qurle left review comments

Assignees
No one assigned
Labels
no-stale Добавляет PR в исключения для автоматического закрытия
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Feature][Switch]: Привести дизайн к виду Material v3
6 participants
@inomdzhon @BlackySoul @mendrew @SevereCloud @qurle @vkcom-publisher