ionic-team / ionic-team/ionic-docs

content: document focusable classes and usage

Abierto
#3,557 4 comentarios 0 reacciones 0 asignados Ver en GitHub
content
Lenguaje dominante
MDX
Estrellas
621
Forks
3.2k
Merge medio
1 d 2 h
PR fusionados (30 d)
86

Descripción

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v6.x, v7.x

### Current Behavior

.ion-focused nor :focus-visible selector is working for ion-toggle component and toggle/labels combo.

There are workarounds for this but not optimal
- use ion-item, but ion-item is expected to be used under restricted scenarios
- use :focus selector but causes the style for accessibility leak when non-keyboard focus is applied.

### Expected Behavior

- ion-toggle should provide a default keyboard focus accessibility style.
- ion-toggle should expose a way to set custom focus accessibility style

### Steps to Reproduce

1. go to https://stackblitz.com/edit/ionic-ion-toggle-focus-isse
2. use keyboard to navigate.
3. background of focus-visible element SHOULD BE RED, similar to the button

### Code Reproduction URL

https://stackblitz.com/edit/ionic-ion-toggle-focus-isse

### Ionic Info

Ionic:

Ionic CLI : 7.1.1
Ionic Framework : @ionic/angular 6.2.7
@angular-devkit/build-angular : 17.1.1
@angular-devkit/schematics : 17.1.1
@angular/cli : 17.1.1
@ionic/angular-toolkit : 7.0.0

Capacitor:

Capacitor CLI : 5.2.3
@capacitor/android : 5.2.3
@capacitor/core : 5.2.3
@capacitor/ios : 5.2.3

Utility:

cordova-res : not installed globally
native-run : 1.7.4

System:

NodeJS : v20.11.0 (C:\Program Files\nodejs\node.exe)
npm : 10.2.4
OS : Windows 10

### Additional Information

_No response_

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.