feat(tabs): add new tabs components #2002
Conversation
|
Preview is ready. |
|
Visual Tests Report is ready. |
sofiushko
changed the title
amje
requested review from
ogonkov,
IsaevAlexandr,
Raubzeug,
Arucard89,
mournfulCoroner,
DakEnviy,
zamkovskaya,
kseniya57,
Marginy605,
goshander,
axtk and
Lunory
as code owners
|
All this changes for tabs? |
|
@sofiushko Hey! Could you rebase your branch? |
sofiushko
force-pushed
the
tabs2
branch
5 times, most recently
from
cb3e9d8 to
4921035
Compare
Done |
amje
requested review from
Ruminat,
Vladeeg,
NikitaCG,
Estasie,
d3m1d0v,
v4dyar4 and
jhoncool
as code owners
There was a problem hiding this comment.
There is a w3c design pattern for tabs. For now there are some differences between this pattern and current code behaviour:
Enterkey doesn't activate tab- Arrows don't move focus within tabs
- I'm not quite sure about moving focus between tabs by
Tabkey pressing
src/components/tabs/TabProvider.tsx
Outdated
| import {TabContext} from './contexts/TabContext'; | ||
|
|
||
| export type TabProviderProps = React.PropsWithChildren<{ | ||
| value: string | undefined; |
src/components/tabs/TabList.scss
Outdated
| } | ||
| } | ||
|
|
||
| &-title { |
There was a problem hiding this comment.
There is one &-title above, do we actually need to repeat it here?
|
|
||
| return ( | ||
| <div | ||
| {...filterDOMProps(props, {labelable: true})} |
There was a problem hiding this comment.
Is it assumed that users always should set aria-labelledby by themselves?
There was a problem hiding this comment.
Yes, like aria-controls for tab
It because components Tab and TabPanel can be add by users separately.
I can generate id and ARIA attrs, but there is no guarantee that panel will match tab with the id and ARIA attributes will conform to valid values
I relied on gravity-ui/rfc#16
It`s ok, we can do this
it`s not ok. If we want this behaviour, we need to make tabs component uncontrolled. It goes against the issue. Maybe we should change the interface to make it possible?
I repeated the current component in this moment |
|
@sofiushko I agree that focus behaviour should follow w3c pattern (arrow keys navigation instead of tabs). But I don't understand why we should change the API to make it possible |
So sorry |
|
Add some behaviour from w3c design pattern for tabs
|
No description provided.