aksel
aksel copied to clipboard
[FEATURE] Timeline interne-flater
WIP branch for ny tidslinje bruk på interne flater
Tidligere brukt kode
- https://github.com/navikt/helse-frontend-moduler/blob/master/packages/tidslinje/src/components/tidslinje/Tidslinje.tsx
- https://github.com/navikt/familie-felles-frontend/tree/master/packages/familie-tidslinje
Storybook:
- https://navikt.github.io/helse-frontend-moduler/?path=/docs/tidslinje-tidslinje--basic@
- https://navikt.github.io/familie-felles-frontend/?path=/story/komponenter-tidslinje--basic-clickable
Chromatic build-output:
- :clipboard: Review
- :tada: Storybook preview
- :no_entry_sign: Changes detected :no_entry_sign:, review endringer.
commit: 649f70a8b
Forslag til førsteutkast for API
<Timeline>
<Timeline.Row label=ReactNode>
<Timeline.Period from=Date to=Date .../>
<Timeline.Period from=Date to=Date icon=ReactNode onClick >
Statusboble-innhold
</Timeline.Period>
</Timeline.Row>
<Timeline.Pin date=Date>
Statusboble-innhold
</Timeline.Pin>
<Timeline.Pin date=Date>
Statusboble-innhold
</Timeline.Pin>
</Timeline>
- Bør alle rows være i en egen wrapper eks Timeline.Rows?
- Bør row ha en egen komponent for label?
<Timeline.Row>
<Timeline.Label>
<Timeline.Periods>
<Timeline.Period>
Det vil vel kun være en gruppering av Rows per tidslinje, så jeg tenker at det å tilby Timeline.Rows er å gi brukeren et unødvendig ansvar da dette er noe vi kan bygge inn fra vår side. Med mindre du ser noen fordeler ved å gi brukeren kontroll over dette? @KenAJoh
Det vil vel kun være en gruppering av Rows per tidslinje, så jeg tenker at det å tilby Timeline.Rows er å gi brukeren et unødvendig ansvar da dette er noe vi kan bygge inn fra vår side. Med mindre du ser noen fordeler ved å gi brukeren kontroll over dette? @KenAJoh
Tenker egentlig også det for denne versjonen. Hvis vi frem i tid hvis vi skal tilby "accordion-rows", er wrapper nødvendig for at det ikke skal være breaking da? Kanskje default er uten wrapper, men med collapsible (hvis vi implementerer i fremtiden) at man har en "Timeline.CollapsibleRow" eller noe lignende.
Det vil vel kun være en gruppering av Rows per tidslinje, så jeg tenker at det å tilby Timeline.Rows er å gi brukeren et unødvendig ansvar da dette er noe vi kan bygge inn fra vår side. Med mindre du ser noen fordeler ved å gi brukeren kontroll over dette? @KenAJoh
Tenker egentlig også det for denne versjonen. Hvis vi frem i tid hvis vi skal tilby "accordion-rows", er wrapper nødvendig for at det ikke skal være breaking da? Kanskje default er uten wrapper, men med collapsible (hvis vi implementerer i fremtiden) at man har en "Timeline.CollapsibleRow" eller noe lignende.
Ja det høres fornuftig ut i mitt hode i hvert fall, så da blir det en wrapper rundt collapsible rows eventuelt
Kort oppsummering fra UU/UX møte:
Aria-hidden på axis header
Teste å løse det på samme måte som Stepper:
- ol -> li
- aria-labelledby header (row-header)
Date-format:
- suksess fra 01.01.2020 til 01.02.2020
Pins:
- Bake inn pins i hver rad (fokuserbar)?
- Gi hver pin et navn: eks [pin] for lettere søk
Supplerende Stønad Uføre kunne tenke seg å bytte til denne i su-se-framover. Hvordan er ståa på denne?
Supplerende Stønad Uføre kunne tenke seg å bytte til denne i su-se-framover. Hvordan er ståa på denne?
Heisann! Vi planlegger å få den ut i beta neste uke @hestad