patternfly / patternfly/patternfly-react

Wizard - Support for Custom Component Integration

Ouverte
#11,826 3 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Stale
Langage dominant
TypeScript
Étoiles
862
Forks
392
Merge moyen
4 j 8 h
PR mergées (30 j)
9

Description

Is this a new component or an extension of an existing one?

Existing; Wizard.

Describe the feature

The Wizard component currently offers limited customization for its step navigation as Wizard only accepts children of type WizardStep.

This prevents adoption of the Drawer component when teams require common alternative navigation patterns or need to integrate other components within the layout.

Developers must create custom component implementations with manual CSS height adjustments when they need variations like horizontal progress steppers or other components the navigation area (like the FilterSidePanel from react-catalog-view).

This is an RFE to enhance the Wizard component to support custom components in the left nav and header - for example, a progress stepper layout (both vertical and horizontal variants) in place of the step navigation, while maintaining the same wizard layout and functionality.

Are there visuals for this feature? If applicable, please include examples for each state and for varying widths

Image

Image

Note that, since Kubeflow Notebooks 2.0 does not use the PF Wizard here due to their custom use case, the drawer panel does not take the full height of the page container and requires a CSS override to resolve.

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par examiner la Wizard API existante et les exemples de Progress Stepper liés, en vous concentrant sur le modèle de navigation actuel basé uniquement sur WizardStep. Définissez comment le contenu personnalisé dans la navigation de gauche et le header doit préserver la mise en page et les fonctionnalités de Wizard, puis vérifiez la navigation verticale et horizontale ainsi que le comportement sur toute la hauteur montré dans les éléments visuels fournis.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
react, typescript
Domaine
design, frontend
Type d'issue
Fonctionnalité
Difficulté
5/5
Temps estimé
Plus d'une semaine
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.