ape-accessibility 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +82 -0
- package/dist/index.cjs +271 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +43 -0
- package/dist/index.d.ts +43 -0
- package/dist/index.global.js +271 -0
- package/dist/index.global.js.map +1 -0
- package/dist/index.js +271 -0
- package/dist/index.js.map +1 -0
- package/package.json +54 -0
package/README.md
ADDED
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
# ape-accessibility
|
|
2
|
+
|
|
3
|
+
Widget de accesibilidad plug-and-play para cualquier aplicacion web. Funciona con React, Vue, Angular, vanilla JS — sin configuracion.
|
|
4
|
+
|
|
5
|
+
## Instalacion
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install ape-accessibility
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Uso
|
|
12
|
+
|
|
13
|
+
### Auto-mount (cero configuracion)
|
|
14
|
+
|
|
15
|
+
```js
|
|
16
|
+
import 'ape-accessibility'
|
|
17
|
+
// El widget aparece automaticamente en la esquina inferior izquierda
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
### Con configuracion
|
|
21
|
+
|
|
22
|
+
```js
|
|
23
|
+
import { init, destroy } from 'ape-accessibility'
|
|
24
|
+
|
|
25
|
+
const widget = init({
|
|
26
|
+
position: 'bottom-right', // 'bottom-left' | 'bottom-right'
|
|
27
|
+
zIndex: 9999,
|
|
28
|
+
})
|
|
29
|
+
|
|
30
|
+
// Para remover el widget
|
|
31
|
+
widget.destroy()
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
### Script tag (sin bundler)
|
|
35
|
+
|
|
36
|
+
```html
|
|
37
|
+
<script src="https://unpkg.com/ape-accessibility/dist/index.global.js"></script>
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
El widget se auto-monta al cargar el script. Para control manual:
|
|
41
|
+
|
|
42
|
+
```html
|
|
43
|
+
<script>
|
|
44
|
+
const widget = ApeAccessibility.init({ position: 'bottom-right' })
|
|
45
|
+
</script>
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
## API
|
|
49
|
+
|
|
50
|
+
| Funcion | Descripcion |
|
|
51
|
+
|---------|-------------|
|
|
52
|
+
| `init(config?)` | Monta el widget. Retorna `{ destroy() }` |
|
|
53
|
+
| `destroy()` | Remueve el widget del DOM |
|
|
54
|
+
| `getSettings()` | Retorna la configuracion actual |
|
|
55
|
+
| `resetAllSettings()` | Resetea todas las funciones a valores por defecto |
|
|
56
|
+
|
|
57
|
+
## Funcionalidades
|
|
58
|
+
|
|
59
|
+
| Funcion | Descripcion |
|
|
60
|
+
|---------|-------------|
|
|
61
|
+
| Tamano de fuente | Incrementar/decrementar (90%-120%) |
|
|
62
|
+
| Alto contraste | Modo de alto contraste |
|
|
63
|
+
| Saturacion | Alta, baja o monocromo |
|
|
64
|
+
| Fuente dislexia | Fuente OpenDyslexic |
|
|
65
|
+
| Espaciado | Control de letras e interlineado |
|
|
66
|
+
| Resaltado | Resaltar titulos y enlaces |
|
|
67
|
+
| Animaciones | Pausar todas las animaciones |
|
|
68
|
+
| Cursor grande | Cursor de mayor tamano |
|
|
69
|
+
| Guia de lectura | Linea que sigue el cursor |
|
|
70
|
+
| Lectura en voz alta | Text-to-speech del contenido |
|
|
71
|
+
| Estructura de pagina | Navegar por encabezados |
|
|
72
|
+
| Perfiles | Presets para discapacidad visual, cognitiva, motora, adulto mayor |
|
|
73
|
+
| Ocultar imagenes | Esconde imagenes, videos y SVGs |
|
|
74
|
+
| Alineacion de texto | Forzar alineacion izquierda, centro o derecha |
|
|
75
|
+
|
|
76
|
+
## Tamano
|
|
77
|
+
|
|
78
|
+
~75 KB gzipped (incluye React internamente, no requiere dependencias externas).
|
|
79
|
+
|
|
80
|
+
## Licencia
|
|
81
|
+
|
|
82
|
+
MIT
|