patternfly / patternfly/patternfly-react
Input Components - Simplify Interface by handling FormGroup internally
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- TypeScript
- Estrellas
- 862
- Forks
- 392
- Merge medio
- 4 d 8 h
- PR fusionados (30 d)
- 9
Descripción
Labels and inputs in html are hooked together by ID.
<label for="username">Enter your username:</label>
<input id="username" />
In PF4 to get a label on an input requires a FormGroup.
<FormGroup
id="user-form-group"
fieldId="user"
label="User"
helperText="User help text"
isRequired
validated={error ? 'error' : undefined}
helperTextInvalid={error}
>
<TextInput
id="user"
type="text"
aria-describedby="user-form-group"
isRequired
validated={error ? 'error' : undefined}
placeholder="Enter user"
value={user}
onChange={onChange}
/>
</FormGroup>
It make for a streamlined developer experience if that logic could be hidden from the developer. On a input component, if a label is provided, then the component could handle all the logic internally.
<TextInput
id="user"
label="User"
helper="User help text"
type="text"
required
placeholder="Enter user"
value={user}
onChange={onChange}
error={error}
/>
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Empieza revisando los componentes de entrada existentes y la implementación de FormGroup para comprender sus responsabilidades actuales y sus APIs públicas. Compara cómo se gestionan las etiquetas, los IDs, el texto de ayuda, el estado de obligatoriedad, la validación y los errores; después, define el comportamiento del componente y las pruebas necesarias para confirmar que los inputs con etiqueta funcionan sin un FormGroup explícito.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- react, typescript
- Área
- frontend
- Tipo de issue
- Nueva funcionalidad
- Dificultad
- 5/5
- Tiempo estimado
- Más de una semana
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 30/100