First commit

2026-08-10 04:29:24 -06:00
commit 26851fa750
71 changed files with 8333 additions and 0 deletions
@@ -0,0 +1,41 @@
+# Accesibilidad
+
+Objetivo: WCAG 2.2 nivel AA para los contratos entregados.
+
+## Formularios
+
+- Labels vinculados con `for`/`id` generado o explícito.
+- Descripciones y errores unidos mediante `aria-describedby`.
+- Los errores establecen `aria-invalid`; la aplicación decide cuándo anunciarlos dinámicamente.
+- Checkbox, radio y select conservan semántica HTML nativa.
+- `required` y `disabled` se transmiten al control real.
+- El switch expone `role="switch"` y `aria-checked` porque representa encendido/apagado, no selección de formulario genérica.
+
+## Teclado y foco
+
+- El foco usa un contorno de 2 px con separación de 2 px.
+- Tabs: Tab entra en el tab activo; flechas cambian a la pestaña anterior/siguiente; Home y End van a extremos; tabs deshabilitadas se omiten.
+- Dialog: `showModal()` proporciona top layer, fondo inerte, contención y Escape nativos. Al cerrar se intenta restaurar el foco previo.
+- Todos los botones tienen una altura mínima razonable; `DsIconButton` exige un `label` accesible.
+
+## Estados
+
+- Loading en botones conserva el texto, usa `aria-busy` y deshabilita interacciones duplicadas.
+- `DsProgressBar` publica valor, mínimo y máximo.
+- Alertas estáticas no usan live regions por defecto para evitar anuncios al cargar una página. `live` debe activarse solo cuando el mensaje aparece como resultado de una acción.
+- Los iconos decorativos se ocultan con `aria-hidden`.
+- Skeleton es decorativo; el contenedor que lo usa debe proporcionar el estado textual cuando sea necesario.
+
+## Movimiento y contraste
+
+`prefers-reduced-motion: reduce` reduce animaciones y transiciones. La paleta usa texto slate oscuro sobre fondos claros, blanco sobre acciones sky oscuras y variantes de estado con texto oscuro. Los indicadores de foco no dependen de cambios de color internos.
+
+## Pruebas incluidas
+
+- Asociación label/control, descripción, error y `v-model`.
+- Disabled y loading.
+- Navegación de Tabs con teclado.
+- Apertura, nombre y cancelación de Dialog.
+- Presencia de exportaciones públicas.
+
+Limitación: jsdom permite verificar contratos DOM, pero no sustituye pruebas manuales con lector de pantalla, zoom al 200 %, alto contraste ni navegación real en Safari/iOS. Estas comprobaciones forman parte de la revisión previa a una publicación estable.