patternfly / patternfly/patternfly-react

ToolbarItem - expand-all variant should include expand all icon

Aperta
#9,641 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Breaking change :boom: PF Team
Lingua principale
TypeScript
Stelle
862
Fork
392
Merge medio
4g 8h
PR unite (30g)
9

Descrizione

re: https://github.com/patternfly/patternfly-react/pull/9605/files

The expand all icon is currently something the user passes, but for us to mirror it automatically in RTL in the CSS, our component should be updated to include it for the user. This button is primarily for an expandable data-list and table, and the expand toggles in those components supply the icon, so the toolbar probably should, too, and would provide consistency in the icons used. We could probably do it a couple of ways:

  1. Keep everything the way it is now, but update <ToolbarExpandIconWrapper> to include the icon for the user. And rename it to <ToolbarExpandAllIcon>? That aligns with the core class. IMO that should be updated whether we use it as a wrapper or not.
  2. Update <ToolbarItem variant="expand-all"> to bundle the 1) toggle button, 2) <ToolbarExpandIconWrapper>/<ToolbarExpandAllIcon>, and 3) the icon. Chatting with @thatblindgeye, we could also allow tooltip props in case someone wants a tooltip for the button.

As far as I can tell, the data list and table do not allow the user to pass their own icon to the expandable toggle, so I don't know that we need to allow for that in the toolbar, either? If we do, there is a question of whether it should go in <ToolbarExpandIconWrapper>/<ToolbarExpandAllIcon> or not, which will rotate (when expanded) and mirror (in RTL) the icon the user passes.

My vote would be for the second option.


Jira Issue: PF-118

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia esaminando la variante expand-all di ToolbarItem e l’implementazione di ToolbarExpandIconWrapper, quindi confrontale con i toggle espandibili nei componenti data-list e table. Determina quale API proposta utilizzare e verifica che l’icona risultante sia coerente negli stati espanso e RTL.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
react, typescript
Ambito
frontend
Tipo di issue
Funzionalità
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.