@yewdiel21/motion-kit 0.14.0 → 0.15.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 +174 -155
- package/bin/motion-kit.mjs +3 -3
- package/dist/auto/index.d.ts +6 -3
- package/dist/auto/index.js +8 -2
- package/dist/auto/index.js.map +1 -1
- package/dist/{chunk-EY4BJKC4.js → chunk-6IRJYXJU.js} +2 -2
- package/dist/{chunk-CU6SXW3E.js → chunk-A6QQCF6V.js} +1309 -310
- package/dist/chunk-A6QQCF6V.js.map +1 -0
- package/dist/chunk-JXRS3OEA.js +3638 -0
- package/dist/chunk-JXRS3OEA.js.map +1 -0
- package/dist/css/components/add-to-cart.css +72 -0
- package/dist/css/components/bidirectional-slider.css +168 -0
- package/dist/css/components/data-table.css +121 -26
- package/dist/css/components/filter-builder.css +10 -15
- package/dist/css/components/heatmap-chart.css +391 -0
- package/dist/css/components/hover-card.css +8 -2
- package/dist/css/components/image-preview.css +90 -2
- package/dist/css/components/json-viewer.css +33 -1
- package/dist/css/components/nav.css +102 -102
- package/dist/css/components/orbit-menu.css +130 -0
- package/dist/css/components/pagination.css +10 -5
- package/dist/css/components/pie-chart.css +390 -0
- package/dist/css/components/pill-button.css +135 -0
- package/dist/css/components/radar-chart.css +370 -0
- package/dist/css/components/radial-chart.css +398 -0
- package/dist/css/components/sankey-chart.css +358 -0
- package/dist/css/components/scroll-island.css +111 -0
- package/dist/css/components/select.css +136 -0
- package/dist/css/components/toolbar.css +122 -0
- package/dist/css/components/tree-view.css +79 -0
- package/dist/css/components/voice-dots.css +70 -0
- package/dist/elements/index.d.ts +180 -7
- package/dist/elements/index.js +287 -6
- package/dist/elements/index.js.map +1 -1
- package/dist/{engine-Cn6IhE3z.d.ts → engine-5zRIssTO.d.ts} +11 -1
- package/dist/index.css +1832 -168
- package/dist/index.d.ts +4 -4
- package/dist/index.js +33 -3
- package/dist/index.js.map +1 -1
- package/dist/react/index.d.ts +117 -11
- package/dist/react/index.js +314 -13
- package/dist/react/index.js.map +1 -1
- package/dist/{reduced-BBUusld6.d.ts → reduced-6X_bns60.d.ts} +1 -1
- package/dist/{reveal-DEvp6U6T.d.ts → reveal-BfyKKsw4.d.ts} +97 -4
- package/dist/store-CA2Qcun_.d.ts +453 -0
- package/package.json +9 -16
- package/registry.json +1096 -948
- package/src/auto/auto-init.ts +6 -0
- package/src/components/add-to-cart/README.md +34 -0
- package/src/components/add-to-cart/add-to-cart.css +71 -0
- package/src/components/add-to-cart/element.ts +20 -0
- package/src/components/add-to-cart/engine.ts +206 -0
- package/src/components/add-to-cart/react.tsx +29 -0
- package/src/components/bidirectional-slider/README.md +46 -0
- package/src/components/bidirectional-slider/bidirectional-slider.css +167 -0
- package/src/components/bidirectional-slider/element.ts +42 -0
- package/src/components/bidirectional-slider/engine.ts +289 -0
- package/src/components/bidirectional-slider/react.tsx +45 -0
- package/src/components/chart/README.md +10 -0
- package/src/components/chart/element.ts +2 -0
- package/src/components/chart/engine.ts +50 -23
- package/src/components/chart/parts.ts +237 -0
- package/src/components/chart/react.tsx +2 -2
- package/src/components/chart/use-chart.ts +55 -0
- package/src/components/data-table/README.md +3 -3
- package/src/components/data-table/data-table.css +121 -26
- package/src/components/data-table/engine.ts +81 -29
- package/src/components/editable-table/engine.ts +67 -11
- package/src/components/filter-builder/engine.ts +33 -2
- package/src/components/filter-builder/filter-builder.css +10 -15
- package/src/components/heatmap-chart/README.md +48 -0
- package/src/components/heatmap-chart/element.ts +21 -0
- package/src/components/heatmap-chart/engine.ts +281 -0
- package/src/components/heatmap-chart/heatmap-chart.css +93 -0
- package/src/components/heatmap-chart/react.tsx +14 -0
- package/src/components/hover-card/engine.ts +30 -1
- package/src/components/hover-card/hover-card.css +8 -2
- package/src/components/image-preview/element.ts +1 -1
- package/src/components/image-preview/engine.ts +95 -15
- package/src/components/image-preview/image-preview.css +90 -2
- package/src/components/image-preview/react.tsx +3 -3
- package/src/components/json-viewer/engine.ts +11 -2
- package/src/components/json-viewer/json-viewer.css +33 -1
- package/src/components/nav/README.md +12 -10
- package/src/components/nav/element.ts +5 -5
- package/src/components/nav/engine.ts +21 -14
- package/src/components/nav/nav.css +102 -102
- package/src/components/nav/react.tsx +4 -4
- package/src/components/orbit-menu/README.md +46 -0
- package/src/components/orbit-menu/element.ts +27 -0
- package/src/components/orbit-menu/engine.ts +179 -0
- package/src/components/orbit-menu/orbit-menu.css +129 -0
- package/src/components/orbit-menu/react.tsx +44 -0
- package/src/components/pagination/README.md +1 -1
- package/src/components/pagination/engine.ts +50 -4
- package/src/components/pagination/pagination.css +10 -5
- package/src/components/pie-chart/README.md +48 -0
- package/src/components/pie-chart/element.ts +30 -0
- package/src/components/pie-chart/engine.ts +283 -0
- package/src/components/pie-chart/pie-chart.css +92 -0
- package/src/components/pie-chart/react.tsx +14 -0
- package/src/components/pill-button/README.md +46 -0
- package/src/components/pill-button/element.ts +16 -0
- package/src/components/pill-button/engine.ts +77 -0
- package/src/components/pill-button/pill-button.css +134 -0
- package/src/components/pill-button/react.tsx +32 -0
- package/src/components/radar-chart/README.md +48 -0
- package/src/components/radar-chart/element.ts +30 -0
- package/src/components/radar-chart/engine.ts +327 -0
- package/src/components/radar-chart/radar-chart.css +72 -0
- package/src/components/radar-chart/react.tsx +14 -0
- package/src/components/radial-chart/README.md +48 -0
- package/src/components/radial-chart/element.ts +30 -0
- package/src/components/radial-chart/engine.ts +290 -0
- package/src/components/radial-chart/radial-chart.css +100 -0
- package/src/components/radial-chart/react.tsx +14 -0
- package/src/components/sankey-chart/README.md +48 -0
- package/src/components/sankey-chart/element.ts +31 -0
- package/src/components/sankey-chart/engine.ts +401 -0
- package/src/components/sankey-chart/react.tsx +14 -0
- package/src/components/sankey-chart/sankey-chart.css +60 -0
- package/src/components/scroll-island/README.md +34 -0
- package/src/components/scroll-island/element.ts +16 -0
- package/src/components/scroll-island/engine.ts +252 -0
- package/src/components/scroll-island/react.tsx +26 -0
- package/src/components/scroll-island/scroll-island.css +110 -0
- package/src/components/select/README.md +34 -0
- package/src/components/select/element.ts +26 -0
- package/src/components/select/engine.ts +267 -0
- package/src/components/select/react.tsx +33 -0
- package/src/components/select/select.css +135 -0
- package/src/components/toolbar/README.md +46 -0
- package/src/components/toolbar/element.ts +30 -0
- package/src/components/toolbar/engine.ts +230 -0
- package/src/components/toolbar/react.tsx +34 -0
- package/src/components/toolbar/toolbar.css +121 -0
- package/src/components/tree-view/element.ts +1 -1
- package/src/components/tree-view/engine.ts +174 -0
- package/src/components/tree-view/react.tsx +7 -3
- package/src/components/tree-view/tree-view.css +79 -0
- package/src/components/voice-dots/README.md +48 -0
- package/src/components/voice-dots/element.ts +45 -0
- package/src/components/voice-dots/engine.ts +243 -0
- package/src/components/voice-dots/react.tsx +52 -0
- package/src/components/voice-dots/voice-dots.css +69 -0
- package/src/elements/index.ts +39 -0
- package/src/index.ts +16 -0
- package/src/motion/liquid.ts +14 -4
- package/src/react/index.ts +14 -1
- package/dist/chunk-6P4P7NU6.js +0 -1401
- package/dist/chunk-6P4P7NU6.js.map +0 -1
- package/dist/chunk-CU6SXW3E.js.map +0 -1
- package/dist/store-DjkTBX7f.d.ts +0 -195
- /package/dist/{chunk-EY4BJKC4.js.map → chunk-6IRJYXJU.js.map} +0 -0
package/registry.json
CHANGED
|
@@ -1,948 +1,1096 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 2,
|
|
3
|
-
"css": ["css/tokens.css", "css/default-theme.css", "css/base.css", "css/states.css"],
|
|
4
|
-
"entries": {
|
|
5
|
-
"spring-cards": {
|
|
6
|
-
"kind": "recipe",
|
|
7
|
-
"description": "Tarjetas que entran con resorte y responden al movimiento del puntero.",
|
|
8
|
-
"files": ["recipes/spring-cards/create-spring-cards.ts", "recipes/spring-cards/spring-cards.css", "recipes/spring-cards/README.md"],
|
|
9
|
-
"react": "react/use-spring-cards.ts",
|
|
10
|
-
"since": "0.1.0"
|
|
11
|
-
},
|
|
12
|
-
"curved-carousel": {
|
|
13
|
-
"kind": "recipe",
|
|
14
|
-
"description": "Carrusel en arco con arrastre, inercia, snap, bucle, rueda y teclado.",
|
|
15
|
-
"files": ["recipes/curved-carousel/create-curved-carousel.ts", "recipes/curved-carousel/curved-carousel.css", "recipes/curved-carousel/README.md"],
|
|
16
|
-
"react": "react/use-curved-carousel.ts",
|
|
17
|
-
"since": "0.1.0"
|
|
18
|
-
},
|
|
19
|
-
"pile": {
|
|
20
|
-
"kind": "recipe",
|
|
21
|
-
"description": "Pila de tarjetas giradas que crece al entrar en pantalla.",
|
|
22
|
-
"files": ["recipes/pile/create-pile.ts", "recipes/pile/pile.css", "recipes/pile/README.md"],
|
|
23
|
-
"react": "react/use-pile.ts",
|
|
24
|
-
"since": "0.1.0"
|
|
25
|
-
},
|
|
26
|
-
"words": {
|
|
27
|
-
"kind": "recipe",
|
|
28
|
-
"description": "Palabras o letras que crecen desde la base con entrada escalonada.",
|
|
29
|
-
"files": ["recipes/words/create-words.ts", "recipes/words/README.md"],
|
|
30
|
-
"react": "react/use-words.ts",
|
|
31
|
-
"since": "0.1.0"
|
|
32
|
-
},
|
|
33
|
-
"flow": {
|
|
34
|
-
"kind": "recipe",
|
|
35
|
-
"description": "Entrada escalonada con desplazamiento, desenfoque y opacidad.",
|
|
36
|
-
"files": ["recipes/flow/create-flow.ts", "recipes/flow/README.md"],
|
|
37
|
-
"react": "react/use-flow.ts",
|
|
38
|
-
"since": "0.1.0"
|
|
39
|
-
},
|
|
40
|
-
"pop": {
|
|
41
|
-
"kind": "recipe",
|
|
42
|
-
"description": "Aparición de un elemento mediante escala y rebote.",
|
|
43
|
-
"files": ["recipes/pop/create-pop.ts", "recipes/pop/README.md"],
|
|
44
|
-
"react": "react/use-pop.ts",
|
|
45
|
-
"since": "0.1.0"
|
|
46
|
-
},
|
|
47
|
-
"fit-text": {
|
|
48
|
-
"kind": "recipe",
|
|
49
|
-
"description": "Texto de una línea que se ajusta al ancho de su contenedor.",
|
|
50
|
-
"files": ["recipes/fit-text/create-fit-text.ts", "recipes/fit-text/fit-text.css", "recipes/fit-text/README.md"],
|
|
51
|
-
"react": "react/use-fit-text.ts",
|
|
52
|
-
"since": "0.1.0"
|
|
53
|
-
},
|
|
54
|
-
"stretch-footer": {
|
|
55
|
-
"kind": "recipe",
|
|
56
|
-
"description": "Footer que aparece detrás de la página y estira su título con el scroll.",
|
|
57
|
-
"files": ["recipes/stretch-footer/create-stretch-footer.ts", "recipes/stretch-footer/stretch-footer.css", "recipes/stretch-footer/README.md"],
|
|
58
|
-
"react": "react/use-stretch-footer.ts",
|
|
59
|
-
"since": "0.1.0"
|
|
60
|
-
},
|
|
61
|
-
"radial-menu": {
|
|
62
|
-
"kind": "recipe",
|
|
63
|
-
"description": "Menú con opciones que se despliegan en arco alrededor de un botón.",
|
|
64
|
-
"files": ["recipes/radial-menu/create-radial-menu.ts", "recipes/radial-menu/radial-menu.css", "recipes/radial-menu/README.md"],
|
|
65
|
-
"react": "react/use-radial-menu.ts",
|
|
66
|
-
"since": "0.1.0"
|
|
67
|
-
},
|
|
68
|
-
"pill": {
|
|
69
|
-
"kind": "recipe",
|
|
70
|
-
"description": "Botón píldora y enlaces con respuesta de escala al interactuar.",
|
|
71
|
-
"files": ["recipes/pill/pill.css", "recipes/pill/README.md"],
|
|
72
|
-
"since": "0.1.0"
|
|
73
|
-
},
|
|
74
|
-
"tabs": {
|
|
75
|
-
"kind": "recipe",
|
|
76
|
-
"description": "Pestañas con indicador deslizante y navegación por teclado.",
|
|
77
|
-
"files": ["recipes/tabs/create-tabs.ts", "recipes/tabs/tabs.css", "recipes/tabs/README.md"],
|
|
78
|
-
"react": "react/use-tabs.ts",
|
|
79
|
-
"since": "0.2.0"
|
|
80
|
-
},
|
|
81
|
-
"counter": {
|
|
82
|
-
"kind": "recipe",
|
|
83
|
-
"description": "Contador que anima los cambios de valor con formato configurable.",
|
|
84
|
-
"files": ["recipes/counter/create-counter.ts", "recipes/counter/README.md"],
|
|
85
|
-
"react": "react/use-counter.ts",
|
|
86
|
-
"since": "0.2.0"
|
|
87
|
-
},
|
|
88
|
-
"details": {
|
|
89
|
-
"kind": "recipe",
|
|
90
|
-
"description": "Paneles details con apertura y cierre animados.",
|
|
91
|
-
"files": ["recipes/details/create-details.ts", "recipes/details/README.md"],
|
|
92
|
-
"react": "react/use-details.ts",
|
|
93
|
-
"since": "0.2.0"
|
|
94
|
-
},
|
|
95
|
-
"reveal": {
|
|
96
|
-
"kind": "recipe",
|
|
97
|
-
"description": "Revelado de una superficie desde un punto o elemento.",
|
|
98
|
-
"files": ["recipes/reveal/create-reveal.ts", "recipes/reveal/README.md"],
|
|
99
|
-
"react": "react/use-reveal.ts",
|
|
100
|
-
"since": "0.2.0"
|
|
101
|
-
},
|
|
102
|
-
"reflow": {
|
|
103
|
-
"kind": "recipe",
|
|
104
|
-
"description": "Transición de posición de elementos cuando cambia su distribución.",
|
|
105
|
-
"files": ["recipes/reflow/create-reflow.ts", "recipes/reflow/README.md"],
|
|
106
|
-
"react": "react/use-reflow.ts",
|
|
107
|
-
"since": "0.2.0"
|
|
108
|
-
},
|
|
109
|
-
"slot-text": {
|
|
110
|
-
"kind": "recipe",
|
|
111
|
-
"description": "Texto cuyas letras ruedan al cambiar su contenido.",
|
|
112
|
-
"files": ["recipes/slot-text/create-slot-text.ts", "recipes/slot-text/slot-text.css", "recipes/slot-text/README.md"],
|
|
113
|
-
"react": "react/use-slot-text.ts",
|
|
114
|
-
"since": "0.2.0"
|
|
115
|
-
},
|
|
116
|
-
"sortable": {
|
|
117
|
-
"kind": "recipe",
|
|
118
|
-
"description": "Listas y kanban con reordenamiento por arrastre o teclado.",
|
|
119
|
-
"files": ["recipes/sortable/create-sortable.ts", "recipes/sortable/sortable.css", "recipes/sortable/README.md"],
|
|
120
|
-
"react": "react/use-sortable.ts",
|
|
121
|
-
"since": "0.4.0"
|
|
122
|
-
},
|
|
123
|
-
"mask-text": {
|
|
124
|
-
"kind": "recipe",
|
|
125
|
-
"description": "Texto que aparece desde una máscara por líneas, palabras o caracteres.",
|
|
126
|
-
"files": ["recipes/mask-text/create-mask-text.ts", "recipes/mask-text/README.md"],
|
|
127
|
-
"react": "react/use-mask-text.ts",
|
|
128
|
-
"since": "0.6.0"
|
|
129
|
-
},
|
|
130
|
-
"cascade": {
|
|
131
|
-
"kind": "recipe",
|
|
132
|
-
"description": "Entrada escalonada de líneas, separadores y bloques.",
|
|
133
|
-
"files": ["recipes/cascade/create-cascade.ts", "recipes/cascade/README.md"],
|
|
134
|
-
"react": "react/use-cascade.ts",
|
|
135
|
-
"since": "0.6.0"
|
|
136
|
-
},
|
|
137
|
-
"text-roll": {
|
|
138
|
-
"kind": "recipe",
|
|
139
|
-
"description": "Letras que giran como un rodillo y regresan a su posición.",
|
|
140
|
-
"files": ["recipes/text-roll/create-text-roll.ts", "recipes/text-roll/text-roll.css", "recipes/text-roll/README.md"],
|
|
141
|
-
"react": "react/use-text-roll.ts",
|
|
142
|
-
"since": "0.6.0"
|
|
143
|
-
},
|
|
144
|
-
"letters": {
|
|
145
|
-
"kind": "recipe",
|
|
146
|
-
"description": "Letras que crecen al pasar el puntero o parpadean con una paleta.",
|
|
147
|
-
"files": ["recipes/letters/create-letters.ts", "recipes/letters/README.md"],
|
|
148
|
-
"react": "react/use-letters.ts",
|
|
149
|
-
"since": "0.6.0"
|
|
150
|
-
},
|
|
151
|
-
"parallax": {
|
|
152
|
-
"kind": "recipe",
|
|
153
|
-
"description": "Imagen que se desplaza y escala dentro de su marco con el scroll.",
|
|
154
|
-
"files": ["recipes/parallax/create-parallax.ts", "recipes/parallax/README.md"],
|
|
155
|
-
"react": "react/use-parallax.ts",
|
|
156
|
-
"since": "0.6.0"
|
|
157
|
-
},
|
|
158
|
-
"depth-grid": {
|
|
159
|
-
"kind": "recipe",
|
|
160
|
-
"description": "Grid de imágenes que se reúne desde la profundidad con el scroll.",
|
|
161
|
-
"files": ["recipes/depth-grid/create-depth-grid.ts", "recipes/depth-grid/README.md"],
|
|
162
|
-
"react": "react/use-depth-grid.ts",
|
|
163
|
-
"since": "0.6.0"
|
|
164
|
-
},
|
|
165
|
-
"frame-zoom": {
|
|
166
|
-
"kind": "recipe",
|
|
167
|
-
"description": "Marco e imagen que escalan en direcciones opuestas con el scroll.",
|
|
168
|
-
"files": ["recipes/frame-zoom/create-frame-zoom.ts", "recipes/frame-zoom/README.md"],
|
|
169
|
-
"react": "react/use-frame-zoom.ts",
|
|
170
|
-
"since": "0.6.0"
|
|
171
|
-
},
|
|
172
|
-
"contrast": {
|
|
173
|
-
"kind": "recipe",
|
|
174
|
-
"description": "Cabecera que cambia de tono según la sección situada debajo.",
|
|
175
|
-
"files": ["recipes/contrast/create-contrast.ts", "recipes/contrast/README.md"],
|
|
176
|
-
"react": "react/use-contrast.ts",
|
|
177
|
-
"since": "0.6.0"
|
|
178
|
-
},
|
|
179
|
-
"marquee": {
|
|
180
|
-
"kind": "recipe",
|
|
181
|
-
"description": "Banda continua horizontal o vertical con copias decorativas.",
|
|
182
|
-
"files": ["recipes/marquee/create-marquee.ts", "recipes/marquee/marquee.css", "recipes/marquee/README.md"],
|
|
183
|
-
"react": "react/use-marquee.ts",
|
|
184
|
-
"since": "0.6.0"
|
|
185
|
-
},
|
|
186
|
-
"card-dock": {
|
|
187
|
-
"kind": "recipe",
|
|
188
|
-
"description": "Tarjetas apiladas que se despliegan al señalar, enfocar o tocar.",
|
|
189
|
-
"files": ["recipes/card-dock/create-card-dock.ts", "recipes/card-dock/card-dock.css", "recipes/card-dock/README.md"],
|
|
190
|
-
"react": "react/use-card-dock.ts",
|
|
191
|
-
"since": "0.7.0"
|
|
192
|
-
},
|
|
193
|
-
"snap-strip": {
|
|
194
|
-
"kind": "recipe",
|
|
195
|
-
"description": "Tira de tarjetas con scroll-snap, autoplay y pausa al interactuar.",
|
|
196
|
-
"files": ["recipes/snap-strip/create-snap-strip.ts", "recipes/snap-strip/snap-strip.css", "recipes/snap-strip/README.md"],
|
|
197
|
-
"react": "react/use-snap-strip.ts",
|
|
198
|
-
"since": "0.7.0"
|
|
199
|
-
},
|
|
200
|
-
"fill-text": {
|
|
201
|
-
"kind": "recipe",
|
|
202
|
-
"description": "Texto que se rellena progresivamente con el scroll.",
|
|
203
|
-
"files": ["recipes/fill-text/create-fill-text.ts", "recipes/fill-text/README.md"],
|
|
204
|
-
"react": "react/use-fill-text.ts",
|
|
205
|
-
"since": "0.7.0"
|
|
206
|
-
},
|
|
207
|
-
"particle-hero": {
|
|
208
|
-
"kind": "recipe",
|
|
209
|
-
"description": "Nube de partículas en GPU que forma palabras, con fallback Canvas2D.",
|
|
210
|
-
"files": ["gl/particle-hero/create-particle-hero.ts", "gl/particle-hero/shaders.ts", "gl/particle-hero/particle-hero.css", "gl/particle-hero/README.md"],
|
|
211
|
-
"react": "react/use-particle-hero.ts",
|
|
212
|
-
"since": "0.7.0"
|
|
213
|
-
},
|
|
214
|
-
"ticket-menu": {
|
|
215
|
-
"kind": "recipe",
|
|
216
|
-
"description": "Menú boleto con recorte de apertura, filas escalonadas, foco y teclado.",
|
|
217
|
-
"files": ["recipes/ticket-menu/create-ticket-menu.ts", "recipes/ticket-menu/README.md"],
|
|
218
|
-
"react": "react/use-ticket-menu.ts",
|
|
219
|
-
"requires": [
|
|
220
|
-
"menu"
|
|
221
|
-
],
|
|
222
|
-
"since": "0.8.0"
|
|
223
|
-
},
|
|
224
|
-
"infinite-reel": {
|
|
225
|
-
"kind": "recipe",
|
|
226
|
-
"description": "Reel infinito horizontal o vertical con rueda, arrastre e inercia.",
|
|
227
|
-
"files": ["recipes/infinite-reel/create-infinite-reel.ts", "recipes/infinite-reel/infinite-reel.css", "recipes/infinite-reel/README.md"],
|
|
228
|
-
"react": "react/use-infinite-reel.ts",
|
|
229
|
-
"since": "0.8.0"
|
|
230
|
-
},
|
|
231
|
-
"repel-bento": {
|
|
232
|
-
"kind": "recipe",
|
|
233
|
-
"description": "Grid bento con entrada de resorte y repulsión entre tarjetas.",
|
|
234
|
-
"files": ["recipes/repel-bento/create-repel-bento.ts", "recipes/repel-bento/repel-bento.css", "recipes/repel-bento/README.md"],
|
|
235
|
-
"react": "react/use-repel-bento.ts",
|
|
236
|
-
"since": "0.8.0"
|
|
237
|
-
},
|
|
238
|
-
"rotator": {
|
|
239
|
-
"kind": "recipe",
|
|
240
|
-
"description": "Rotador de contenido con autoplay, controles y pausa al enfocar o señalar.",
|
|
241
|
-
"files": ["recipes/rotator/create-rotator.ts", "recipes/rotator/rotator.css", "recipes/rotator/README.md"],
|
|
242
|
-
"react": "react/use-rotator.ts",
|
|
243
|
-
"since": "0.8.0"
|
|
244
|
-
},
|
|
245
|
-
"drag-ruler": {
|
|
246
|
-
"kind": "recipe",
|
|
247
|
-
"description": "Regla numérica con arrastre, límites, paso y teclado.",
|
|
248
|
-
"files": ["recipes/drag-ruler/create-drag-ruler.ts", "recipes/drag-ruler/drag-ruler.css", "recipes/drag-ruler/README.md"],
|
|
249
|
-
"react": "react/use-drag-ruler.ts",
|
|
250
|
-
"since": "0.8.0"
|
|
251
|
-
},
|
|
252
|
-
"dock-pill": {
|
|
253
|
-
"kind": "recipe",
|
|
254
|
-
"description": "Indicador con resorte que sigue la opción activa de un dock.",
|
|
255
|
-
"files": ["recipes/dock-pill/create-dock-pill.ts", "recipes/dock-pill/dock-pill.css", "recipes/dock-pill/README.md"],
|
|
256
|
-
"react": "react/use-dock-pill.ts",
|
|
257
|
-
"since": "0.8.0"
|
|
258
|
-
},
|
|
259
|
-
"liquid-blend": {
|
|
260
|
-
"kind": "recipe",
|
|
261
|
-
"description": "Mezcla de dos imágenes con deformación de sus coordenadas UV.",
|
|
262
|
-
"files": ["gl/liquid-blend/create-liquid-blend.ts", "gl/liquid-blend/shader.ts", "gl/shared/shader.css", "gl/liquid-blend/README.md"],
|
|
263
|
-
"react": "react/use-liquid-blend.ts",
|
|
264
|
-
"since": "0.9.0"
|
|
265
|
-
},
|
|
266
|
-
"matcap": {
|
|
267
|
-
"kind": "recipe",
|
|
268
|
-
"description": "Superficie esférica iluminada con un mapa de material y luz hemisférica.",
|
|
269
|
-
"files": ["gl/matcap/create-matcap.ts", "gl/matcap/shader.ts", "gl/shared/shader.css", "gl/matcap/README.md"],
|
|
270
|
-
"react": "react/use-matcap.ts",
|
|
271
|
-
"since": "0.9.0"
|
|
272
|
-
},
|
|
273
|
-
"shader-grain": {
|
|
274
|
-
"kind": "recipe",
|
|
275
|
-
"description": "Grano de película generado y animado mediante shader.",
|
|
276
|
-
"files": ["gl/shader-grain/create-shader-grain.ts", "gl/shader-grain/shader.ts", "gl/shared/shader.css", "gl/shader-grain/README.md"],
|
|
277
|
-
"react": "react/use-shader-grain.ts",
|
|
278
|
-
"since": "0.9.0"
|
|
279
|
-
},
|
|
280
|
-
"shader-blur": {
|
|
281
|
-
"kind": "recipe",
|
|
282
|
-
"description": "Desenfoque direccional de siete muestras mediante shader.",
|
|
283
|
-
"files": ["gl/shader-blur/create-shader-blur.ts", "gl/shader-blur/shader.ts", "gl/shared/shader.css", "gl/shader-blur/README.md"],
|
|
284
|
-
"react": "react/use-shader-blur.ts",
|
|
285
|
-
"since": "0.9.0"
|
|
286
|
-
},
|
|
287
|
-
"controls": {
|
|
288
|
-
"kind": "controls",
|
|
289
|
-
"description": "Controles CSS: botones, campos, switches, checkboxes, chips, iconos y cristal.",
|
|
290
|
-
"files": ["css/controls/button.css", "css/controls/field.css", "css/controls/switch.css", "css/controls/checkbox.css", "css/controls/chip.css", "css/controls/segmented.css", "css/controls/icon.css", "css/controls/glass.css", "css/controls/burger.css", "css/controls/status.css", "css/controls/README.md"],
|
|
291
|
-
"since": "0.2.0"
|
|
292
|
-
},
|
|
293
|
-
"effects": {
|
|
294
|
-
"kind": "effects",
|
|
295
|
-
"description": "Efectos CSS y funciones para entradas, salidas, carga, blur, flotación y confeti.",
|
|
296
|
-
"files": ["css/effects/anim.css", "css/effects/loading.css", "css/effects/text.css", "css/effects/frost.css", "css/effects/float.css", "css/effects/grain.css", "css/effects/success.css", "css/effects/fade.css", "motion/effects.ts", "motion/confetti.ts", "css/effects/README.md"],
|
|
297
|
-
"react": "react/frost.tsx",
|
|
298
|
-
"since": "0.5.0"
|
|
299
|
-
},
|
|
300
|
-
"theme-picker": {
|
|
301
|
-
"kind": "component",
|
|
302
|
-
"description": "Selector de temas con muestras de color y selección animada.",
|
|
303
|
-
"files": ["components/theme-picker/engine.ts", "components/theme-picker/theme-picker.css", "components/theme-picker/README.md"],
|
|
304
|
-
"element": "components/theme-picker/element.ts",
|
|
305
|
-
"react": "components/theme-picker/react.tsx",
|
|
306
|
-
"since": "0.2.0"
|
|
307
|
-
},
|
|
308
|
-
"dialog": {
|
|
309
|
-
"kind": "component",
|
|
310
|
-
"description": "Diálogo con apertura desde un botón, variantes morph, liquid y sheet, y gestos.",
|
|
311
|
-
"files": ["components/dialog/engine.ts", "components/dialog/dialog.css", "components/dialog/README.md"],
|
|
312
|
-
"element": "components/dialog/element.ts",
|
|
313
|
-
"react": "components/dialog/react.tsx",
|
|
314
|
-
"since": "0.3.0"
|
|
315
|
-
},
|
|
316
|
-
"menu": {
|
|
317
|
-
"kind": "component",
|
|
318
|
-
"description": "Menú de opciones anclado a un botón, con entrada escalonada y teclado.",
|
|
319
|
-
"files": ["components/menu/engine.ts", "components/menu/menu.css", "components/menu/README.md"],
|
|
320
|
-
"element": "components/menu/element.ts",
|
|
321
|
-
"react": "components/menu/react.tsx",
|
|
322
|
-
"requires": [
|
|
323
|
-
"dialog"
|
|
324
|
-
],
|
|
325
|
-
"since": "0.3.0"
|
|
326
|
-
},
|
|
327
|
-
"toast": {
|
|
328
|
-
"kind": "component",
|
|
329
|
-
"description": "Pila de notificaciones con apertura desde un botón y gestos para descartar.",
|
|
330
|
-
"files": ["components/toast/engine.ts", "components/toast/store.ts", "components/toast/toast.css", "components/toast/README.md"],
|
|
331
|
-
"element": "components/toast/element.ts",
|
|
332
|
-
"react": "components/toast/react.tsx",
|
|
333
|
-
"since": "0.3.0"
|
|
334
|
-
},
|
|
335
|
-
"chat-background": {
|
|
336
|
-
"kind": "component",
|
|
337
|
-
"description": "Fondo de manchas animadas cuya energía puede seguir al micrófono.",
|
|
338
|
-
"files": ["components/chat-background/engine.ts", "components/chat-background/audio.ts", "components/chat-background/chat-background.css", "components/chat-background/README.md"],
|
|
339
|
-
"element": "components/chat-background/element.ts",
|
|
340
|
-
"react": "components/chat-background/react.tsx",
|
|
341
|
-
"since": "0.4.0"
|
|
342
|
-
},
|
|
343
|
-
"chat": {
|
|
344
|
-
"kind": "component",
|
|
345
|
-
"description": "Chat con burbujas animadas, estado de espera y campo de entrada adaptable.",
|
|
346
|
-
"files": ["components/chat/engine.ts", "components/chat/chat.css", "components/chat/README.md"],
|
|
347
|
-
"element": "components/chat/element.ts",
|
|
348
|
-
"react": "components/chat/react.tsx",
|
|
349
|
-
"requires": [
|
|
350
|
-
"chat-background"
|
|
351
|
-
],
|
|
352
|
-
"since": "0.4.0"
|
|
353
|
-
},
|
|
354
|
-
"nav": {
|
|
355
|
-
"kind": "component",
|
|
356
|
-
"description": "Navegación con siete estilos de escritorio y una barra de cristal en móvil.",
|
|
357
|
-
"files": ["components/nav/engine.ts", "components/nav/nav.css", "components/nav/README.md"],
|
|
358
|
-
"element": "components/nav/element.ts",
|
|
359
|
-
"react": "components/nav/react.tsx",
|
|
360
|
-
"since": "0.4.0"
|
|
361
|
-
},
|
|
362
|
-
"steps": {
|
|
363
|
-
"kind": "component",
|
|
364
|
-
"description": "Flujo por pasos con transiciones, contador, foco y estado ocupado.",
|
|
365
|
-
"files": ["components/steps/engine.ts", "components/steps/steps.css", "components/steps/README.md"],
|
|
366
|
-
"element": "components/steps/element.ts",
|
|
367
|
-
"react": "components/steps/react.tsx",
|
|
368
|
-
"requires": [
|
|
369
|
-
"chat-background"
|
|
370
|
-
],
|
|
371
|
-
"since": "0.4.0"
|
|
372
|
-
},
|
|
373
|
-
"cursor": {
|
|
374
|
-
"kind": "component",
|
|
375
|
-
"description": "Cursor de cristal con texto o círculo que sigue al puntero en una zona.",
|
|
376
|
-
"files": ["components/cursor/engine.ts", "components/cursor/cursor.css", "components/cursor/README.md"],
|
|
377
|
-
"element": "components/cursor/element.ts",
|
|
378
|
-
"react": "components/cursor/react.tsx",
|
|
379
|
-
"requires": [
|
|
380
|
-
"controls"
|
|
381
|
-
],
|
|
382
|
-
"since": "0.6.0"
|
|
383
|
-
},
|
|
384
|
-
"island": {
|
|
385
|
-
"kind": "component",
|
|
386
|
-
"description": "Barra flotante de cristal que se expande en paneles de menú y carrito.",
|
|
387
|
-
"files": ["components/island/engine.ts", "components/island/island.css", "components/island/README.md"],
|
|
388
|
-
"element": "components/island/element.ts",
|
|
389
|
-
"react": "components/island/react.tsx",
|
|
390
|
-
"since": "0.7.0"
|
|
391
|
-
},
|
|
392
|
-
"quantity": {
|
|
393
|
-
"kind": "component",
|
|
394
|
-
"description": "Selector numérico con límites, botones de mordida y edición accesible.",
|
|
395
|
-
"files": ["components/quantity/engine.ts", "components/quantity/quantity.css", "components/quantity/README.md"],
|
|
396
|
-
"element": "components/quantity/element.ts",
|
|
397
|
-
"react": "components/quantity/react.tsx",
|
|
398
|
-
"since": "0.10.0"
|
|
399
|
-
},
|
|
400
|
-
"pagination": {
|
|
401
|
-
"kind": "component",
|
|
402
|
-
"description": "Paginación con elipsis, controles animados y navegación por teclado.",
|
|
403
|
-
"files": ["components/pagination/engine.ts", "components/pagination/pagination.css", "components/pagination/README.md"],
|
|
404
|
-
"element": "components/pagination/element.ts",
|
|
405
|
-
"react": "components/pagination/react.tsx",
|
|
406
|
-
"since": "0.10.0"
|
|
407
|
-
},
|
|
408
|
-
"hover-card": {
|
|
409
|
-
"kind": "component",
|
|
410
|
-
"description": "Vista previa con apertura por puntero, foco o toque, posición dentro del viewport y cierre con Escape.",
|
|
411
|
-
"files": ["components/hover-card/engine.ts", "components/hover-card/hover-card.css", "components/hover-card/README.md"],
|
|
412
|
-
"element": "components/hover-card/element.ts",
|
|
413
|
-
"react": "components/hover-card/react.tsx",
|
|
414
|
-
"since": "0.10.0"
|
|
415
|
-
},
|
|
416
|
-
"input-otp": {
|
|
417
|
-
"kind": "component",
|
|
418
|
-
"description": "Código OTP con input nativo, slots animados, pegado y autocompletado.",
|
|
419
|
-
"files": ["components/input-otp/engine.ts", "components/input-otp/input-otp.css", "components/input-otp/README.md"],
|
|
420
|
-
"element": "components/input-otp/element.ts",
|
|
421
|
-
"react": "components/input-otp/react.tsx",
|
|
422
|
-
"since": "0.10.0"
|
|
423
|
-
},
|
|
424
|
-
"joined-cta": {
|
|
425
|
-
"kind": "recipe",
|
|
426
|
-
"description": "Tres cápsulas de contacto que se unen al señalar o enfocar.",
|
|
427
|
-
"files": ["recipes/joined-cta/create-joined-cta.ts", "recipes/joined-cta/joined-cta.css", "recipes/joined-cta/README.md"],
|
|
428
|
-
"react": "react/use-joined-cta.ts",
|
|
429
|
-
"since": "0.10.0"
|
|
430
|
-
},
|
|
431
|
-
"image-zoom": {
|
|
432
|
-
"kind": "recipe",
|
|
433
|
-
"description": "Zoom opuesto del marco y la imagen al señalar o enfocar.",
|
|
434
|
-
"files": ["recipes/image-zoom/create-image-zoom.ts", "recipes/image-zoom/image-zoom.css", "recipes/image-zoom/README.md"],
|
|
435
|
-
"react": "react/use-image-zoom.ts",
|
|
436
|
-
"since": "0.10.0"
|
|
437
|
-
},
|
|
438
|
-
"font-cycle": {
|
|
439
|
-
"kind": "recipe",
|
|
440
|
-
"description": "Tipografía variable por carácter con rodillo y overlay opcional.",
|
|
441
|
-
"files": ["recipes/font-cycle/create-font-cycle.ts", "recipes/font-cycle/font-cycle.css", "recipes/font-cycle/README.md"],
|
|
442
|
-
"react": "react/use-font-cycle.ts",
|
|
443
|
-
"since": "0.10.0"
|
|
444
|
-
},
|
|
445
|
-
"thumbnail-nav": {
|
|
446
|
-
"kind": "recipe",
|
|
447
|
-
"description": "Navegador de categorías en cápsula con miniaturas y teclado.",
|
|
448
|
-
"files": ["recipes/thumbnail-nav/create-thumbnail-nav.ts", "recipes/thumbnail-nav/thumbnail-nav.css", "recipes/thumbnail-nav/README.md"],
|
|
449
|
-
"react": "react/use-thumbnail-nav.ts",
|
|
450
|
-
"since": "0.10.0"
|
|
451
|
-
},
|
|
452
|
-
"action-button": {
|
|
453
|
-
"kind": "recipe",
|
|
454
|
-
"description": "Botones dibujados, iconos y etiquetas de cine con respuesta al pulsar.",
|
|
455
|
-
"files": ["recipes/action-button/create-action-button.ts", "recipes/action-button/action-button.css", "recipes/action-button/README.md"],
|
|
456
|
-
"react": "react/use-action-button.ts",
|
|
457
|
-
"since": "0.10.0"
|
|
458
|
-
},
|
|
459
|
-
"film-hero": {
|
|
460
|
-
"kind": "recipe",
|
|
461
|
-
"description": "Hero cinematográfico con revelado de líneas y desplazamiento de medios.",
|
|
462
|
-
"files": ["recipes/film-hero/create-film-hero.ts", "recipes/film-hero/film-hero.css", "recipes/film-hero/README.md"],
|
|
463
|
-
"react": "react/use-film-hero.ts",
|
|
464
|
-
"since": "0.10.0"
|
|
465
|
-
},
|
|
466
|
-
"editorial-reveal": {
|
|
467
|
-
"kind": "recipe",
|
|
468
|
-
"description": "Composición editorial de hero, tarjetas y contacto con entradas escalonadas.",
|
|
469
|
-
"files": ["recipes/editorial-reveal/create-editorial-reveal.ts", "recipes/editorial-reveal/editorial-reveal.css", "recipes/editorial-reveal/README.md"],
|
|
470
|
-
"react": "react/use-editorial-reveal.ts",
|
|
471
|
-
"since": "0.10.0",
|
|
472
|
-
"requires": [
|
|
473
|
-
"mask-text",
|
|
474
|
-
"cascade",
|
|
475
|
-
"parallax",
|
|
476
|
-
"contrast"
|
|
477
|
-
]
|
|
478
|
-
},
|
|
479
|
-
"studio-dock": {
|
|
480
|
-
"kind": "component",
|
|
481
|
-
"description": "Dock de estudio que se transforma en panel bento con páginas y contacto.",
|
|
482
|
-
"files": ["components/studio-dock/engine.ts", "components/studio-dock/studio-dock.css", "components/studio-dock/README.md"],
|
|
483
|
-
"react": "components/studio-dock/react.tsx",
|
|
484
|
-
"element": "components/studio-dock/element.ts",
|
|
485
|
-
"since": "0.10.0"
|
|
486
|
-
},
|
|
487
|
-
"trailer": {
|
|
488
|
-
"kind": "component",
|
|
489
|
-
"description": "Reproductor de video en modal con controles accesibles y retorno de foco.",
|
|
490
|
-
"files": ["components/trailer/engine.ts", "components/trailer/trailer.css", "components/trailer/README.md"],
|
|
491
|
-
"react": "components/trailer/react.tsx",
|
|
492
|
-
"element": "components/trailer/element.ts",
|
|
493
|
-
"since": "0.10.0",
|
|
494
|
-
"requires": [
|
|
495
|
-
"dialog"
|
|
496
|
-
]
|
|
497
|
-
},
|
|
498
|
-
"calendar": {
|
|
499
|
-
"kind": "component",
|
|
500
|
-
"description": "Calendario de mes y semana con eventos, entrada escalonada de días y deslizamiento al navegar (Melon Mind).",
|
|
501
|
-
"files": ["components/calendar/engine.ts", "components/calendar/calendar.css", "components/calendar/README.md"],
|
|
502
|
-
"element": "components/calendar/element.ts",
|
|
503
|
-
"react": "components/calendar/react.tsx",
|
|
504
|
-
"since": "0.10.0"
|
|
505
|
-
},
|
|
506
|
-
"slot-picker": {
|
|
507
|
-
"kind": "component",
|
|
508
|
-
"description": "Selector de día y horario para citas o reservas: horarios que se deslizan al cambiar de día (Melon Mind).",
|
|
509
|
-
"files": ["components/slot-picker/engine.ts", "components/slot-picker/slot-picker.css", "components/slot-picker/README.md"],
|
|
510
|
-
"element": "components/slot-picker/element.ts",
|
|
511
|
-
"react": "components/slot-picker/react.tsx",
|
|
512
|
-
"since": "0.10.0"
|
|
513
|
-
},
|
|
514
|
-
"weight-hover": {
|
|
515
|
-
"kind": "recipe",
|
|
516
|
-
"description": "Peso variable por letra que baja al acercarse el puntero (DOVV Studio).",
|
|
517
|
-
"files": ["recipes/weight-hover/create-weight-hover.ts", "recipes/weight-hover/weight-hover.css", "recipes/weight-hover/README.md"],
|
|
518
|
-
"react": "react/use-weight-hover.ts",
|
|
519
|
-
"since": "0.10.0"
|
|
520
|
-
},
|
|
521
|
-
"sticker": {
|
|
522
|
-
"kind": "recipe",
|
|
523
|
-
"description": "Sticker holográfico troquelado que se despega, se arrastra y cae (DOVV Studio).",
|
|
524
|
-
"files": ["recipes/sticker/create-sticker.ts", "recipes/sticker/sticker.css", "recipes/sticker/README.md"],
|
|
525
|
-
"react": "react/use-sticker.ts",
|
|
526
|
-
"since": "0.10.0"
|
|
527
|
-
},
|
|
528
|
-
"scroll-dock": {
|
|
529
|
-
"kind": "recipe",
|
|
530
|
-
"description": "Cápsula de navegación que sube al hacer scroll y se esconde en el footer (DOVV Studio).",
|
|
531
|
-
"files": ["recipes/scroll-dock/create-scroll-dock.ts", "recipes/scroll-dock/scroll-dock.css", "recipes/scroll-dock/README.md"],
|
|
532
|
-
"react": "react/use-scroll-dock.ts",
|
|
533
|
-
"since": "0.10.0"
|
|
534
|
-
},
|
|
535
|
-
"local-clock": {
|
|
536
|
-
"kind": "recipe",
|
|
537
|
-
"description": "Hora en vivo de una zona horaria, actualizada al cambiar el minuto (DOVV Studio).",
|
|
538
|
-
"files": ["recipes/local-clock/create-local-clock.ts", "recipes/local-clock/README.md"],
|
|
539
|
-
"react": "react/use-local-clock.ts",
|
|
540
|
-
"since": "0.10.0"
|
|
541
|
-
},
|
|
542
|
-
"attachment": {
|
|
543
|
-
"kind": "component",
|
|
544
|
-
"description": "Selector de archivos con arrastrar y soltar, validación, tarjetas con progreso y vista previa de imágenes.",
|
|
545
|
-
"files": ["components/attachment/engine.ts", "components/attachment/attachment.css", "components/attachment/README.md"],
|
|
546
|
-
"element": "components/attachment/element.ts",
|
|
547
|
-
"react": "components/attachment/react.tsx",
|
|
548
|
-
"since": "0.11.0"
|
|
549
|
-
},
|
|
550
|
-
"skeleton": {
|
|
551
|
-
"kind": "component",
|
|
552
|
-
"description": "Marcador de carga de texto, avatar, imagen o tarjeta con pulso o brillo y estado accesible.",
|
|
553
|
-
"files": ["components/skeleton/engine.ts", "components/skeleton/skeleton.css", "components/skeleton/README.md"],
|
|
554
|
-
"element": "components/skeleton/element.ts",
|
|
555
|
-
"react": "components/skeleton/react.tsx",
|
|
556
|
-
"since": "0.11.0"
|
|
557
|
-
},
|
|
558
|
-
"questionnaire": {
|
|
559
|
-
"kind": "component",
|
|
560
|
-
"description": "Cuestionario por pasos con texto, opción única y múltiple, validación de obligatorios y finalización.",
|
|
561
|
-
"files": ["components/questionnaire/engine.ts", "components/questionnaire/questionnaire.css", "components/questionnaire/README.md"],
|
|
562
|
-
"element": "components/questionnaire/element.ts",
|
|
563
|
-
"react": "components/questionnaire/react.tsx",
|
|
564
|
-
"requires": [
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
"
|
|
571
|
-
"
|
|
572
|
-
"
|
|
573
|
-
"
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
"
|
|
579
|
-
"
|
|
580
|
-
"
|
|
581
|
-
"
|
|
582
|
-
"
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
"
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
"
|
|
590
|
-
"
|
|
591
|
-
"
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
"
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
"
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
"
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
"
|
|
604
|
-
"
|
|
605
|
-
"
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
"since": "0.11.0"
|
|
609
|
-
},
|
|
610
|
-
"
|
|
611
|
-
"kind": "component",
|
|
612
|
-
"description": "
|
|
613
|
-
"files": ["components/
|
|
614
|
-
"element": "components/
|
|
615
|
-
"react": "components/
|
|
616
|
-
"since": "0.11.0"
|
|
617
|
-
},
|
|
618
|
-
"
|
|
619
|
-
"kind": "component",
|
|
620
|
-
"description": "
|
|
621
|
-
"files": ["components/
|
|
622
|
-
"element": "components/
|
|
623
|
-
"react": "components/
|
|
624
|
-
"since": "0.11.0"
|
|
625
|
-
},
|
|
626
|
-
"
|
|
627
|
-
"kind": "component",
|
|
628
|
-
"description": "
|
|
629
|
-
"files": ["components/
|
|
630
|
-
"element": "components/
|
|
631
|
-
"react": "components/
|
|
632
|
-
"since": "0.
|
|
633
|
-
},
|
|
634
|
-
"
|
|
635
|
-
"kind": "component",
|
|
636
|
-
"description": "
|
|
637
|
-
"files": ["components/
|
|
638
|
-
"element": "components/
|
|
639
|
-
"react": "components/
|
|
640
|
-
"since": "0.12.0"
|
|
641
|
-
},
|
|
642
|
-
"
|
|
643
|
-
"kind": "component",
|
|
644
|
-
"description": "
|
|
645
|
-
"files": ["components/
|
|
646
|
-
"element": "components/
|
|
647
|
-
"react": "components/
|
|
648
|
-
"since": "0.12.0"
|
|
649
|
-
},
|
|
650
|
-
"
|
|
651
|
-
"kind": "component",
|
|
652
|
-
"description": "
|
|
653
|
-
"files": ["components/
|
|
654
|
-
"element": "components/
|
|
655
|
-
"react": "components/
|
|
656
|
-
"since": "0.12.0"
|
|
657
|
-
},
|
|
658
|
-
"
|
|
659
|
-
"kind": "component",
|
|
660
|
-
"description": "
|
|
661
|
-
"files": ["components/
|
|
662
|
-
"element": "components/
|
|
663
|
-
"react": "components/
|
|
664
|
-
"since": "0.12.0"
|
|
665
|
-
},
|
|
666
|
-
"
|
|
667
|
-
"kind": "component",
|
|
668
|
-
"description": "
|
|
669
|
-
"files": ["components/
|
|
670
|
-
"element": "components/
|
|
671
|
-
"react": "components/
|
|
672
|
-
"since": "0.12.0"
|
|
673
|
-
},
|
|
674
|
-
"
|
|
675
|
-
"kind": "component",
|
|
676
|
-
"description": "
|
|
677
|
-
"files": ["components/
|
|
678
|
-
"element": "components/
|
|
679
|
-
"react": "components/
|
|
680
|
-
"since": "0.12.0"
|
|
681
|
-
},
|
|
682
|
-
"
|
|
683
|
-
"kind": "component",
|
|
684
|
-
"description": "
|
|
685
|
-
"files": ["components/
|
|
686
|
-
"element": "components/
|
|
687
|
-
"react": "components/
|
|
688
|
-
"since": "0.12.0"
|
|
689
|
-
},
|
|
690
|
-
"
|
|
691
|
-
"kind": "component",
|
|
692
|
-
"description": "
|
|
693
|
-
"files": ["components/
|
|
694
|
-
"element": "components/
|
|
695
|
-
"react": "components/
|
|
696
|
-
"since": "0.12.0"
|
|
697
|
-
},
|
|
698
|
-
"
|
|
699
|
-
"kind": "component",
|
|
700
|
-
"description": "
|
|
701
|
-
"files": ["components/
|
|
702
|
-
"element": "components/
|
|
703
|
-
"react": "components/
|
|
704
|
-
"since": "0.12.0"
|
|
705
|
-
},
|
|
706
|
-
"
|
|
707
|
-
"kind": "component",
|
|
708
|
-
"description": "
|
|
709
|
-
"files": ["components/
|
|
710
|
-
"element": "components/
|
|
711
|
-
"react": "components/
|
|
712
|
-
"since": "0.
|
|
713
|
-
},
|
|
714
|
-
"color-
|
|
715
|
-
"kind": "component",
|
|
716
|
-
"description": "
|
|
717
|
-
"files": ["components/color-
|
|
718
|
-
"element": "components/color-
|
|
719
|
-
"react": "components/color-
|
|
720
|
-
"since": "0.13.0"
|
|
721
|
-
},
|
|
722
|
-
"color-
|
|
723
|
-
"kind": "component",
|
|
724
|
-
"description": "
|
|
725
|
-
"files": ["components/color-
|
|
726
|
-
"element": "components/color-
|
|
727
|
-
"react": "components/color-
|
|
728
|
-
"since": "0.13.0"
|
|
729
|
-
},
|
|
730
|
-
"color-
|
|
731
|
-
"kind": "component",
|
|
732
|
-
"description": "
|
|
733
|
-
"files": ["components/color-
|
|
734
|
-
"element": "components/color-
|
|
735
|
-
"react": "components/color-
|
|
736
|
-
"
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
"
|
|
741
|
-
"
|
|
742
|
-
"
|
|
743
|
-
"
|
|
744
|
-
"
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
"
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
"
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
"
|
|
757
|
-
"
|
|
758
|
-
"
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
"
|
|
762
|
-
"
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
"
|
|
766
|
-
"
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
"
|
|
770
|
-
"
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
"
|
|
774
|
-
"
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
"
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
"
|
|
783
|
-
"
|
|
784
|
-
"
|
|
785
|
-
"
|
|
786
|
-
"
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
"
|
|
791
|
-
"
|
|
792
|
-
"
|
|
793
|
-
"
|
|
794
|
-
"
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
"
|
|
801
|
-
"
|
|
802
|
-
"
|
|
803
|
-
"
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
"
|
|
809
|
-
"
|
|
810
|
-
"
|
|
811
|
-
"
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
"
|
|
817
|
-
"
|
|
818
|
-
"
|
|
819
|
-
"
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
"
|
|
825
|
-
"
|
|
826
|
-
"
|
|
827
|
-
"
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
"
|
|
833
|
-
"
|
|
834
|
-
"
|
|
835
|
-
"
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
"
|
|
841
|
-
"
|
|
842
|
-
"
|
|
843
|
-
"
|
|
844
|
-
"
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
"
|
|
849
|
-
"
|
|
850
|
-
"
|
|
851
|
-
"
|
|
852
|
-
"
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
"
|
|
857
|
-
"
|
|
858
|
-
"
|
|
859
|
-
"
|
|
860
|
-
"
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
"
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
"
|
|
872
|
-
"
|
|
873
|
-
"
|
|
874
|
-
"
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
"
|
|
881
|
-
"
|
|
882
|
-
"
|
|
883
|
-
"
|
|
884
|
-
"
|
|
885
|
-
"since": "0.14.0"
|
|
886
|
-
},
|
|
887
|
-
"
|
|
888
|
-
"kind": "component",
|
|
889
|
-
"description": "
|
|
890
|
-
"files": ["components/
|
|
891
|
-
"element": "components/
|
|
892
|
-
"react": "components/
|
|
893
|
-
"
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
"
|
|
898
|
-
"
|
|
899
|
-
"
|
|
900
|
-
"
|
|
901
|
-
"
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
"
|
|
906
|
-
"
|
|
907
|
-
"
|
|
908
|
-
"
|
|
909
|
-
"
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
"
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
"
|
|
917
|
-
"
|
|
918
|
-
"
|
|
919
|
-
"
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
"
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
"
|
|
928
|
-
"
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
"
|
|
932
|
-
"
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
"
|
|
936
|
-
"
|
|
937
|
-
"
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
"
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
"
|
|
944
|
-
"
|
|
945
|
-
"
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
1
|
+
{
|
|
2
|
+
"version": 2,
|
|
3
|
+
"css": ["css/tokens.css", "css/default-theme.css", "css/base.css", "css/states.css"],
|
|
4
|
+
"entries": {
|
|
5
|
+
"spring-cards": {
|
|
6
|
+
"kind": "recipe",
|
|
7
|
+
"description": "Tarjetas que entran con resorte y responden al movimiento del puntero.",
|
|
8
|
+
"files": ["recipes/spring-cards/create-spring-cards.ts", "recipes/spring-cards/spring-cards.css", "recipes/spring-cards/README.md"],
|
|
9
|
+
"react": "react/use-spring-cards.ts",
|
|
10
|
+
"since": "0.1.0"
|
|
11
|
+
},
|
|
12
|
+
"curved-carousel": {
|
|
13
|
+
"kind": "recipe",
|
|
14
|
+
"description": "Carrusel en arco con arrastre, inercia, snap, bucle, rueda y teclado.",
|
|
15
|
+
"files": ["recipes/curved-carousel/create-curved-carousel.ts", "recipes/curved-carousel/curved-carousel.css", "recipes/curved-carousel/README.md"],
|
|
16
|
+
"react": "react/use-curved-carousel.ts",
|
|
17
|
+
"since": "0.1.0"
|
|
18
|
+
},
|
|
19
|
+
"pile": {
|
|
20
|
+
"kind": "recipe",
|
|
21
|
+
"description": "Pila de tarjetas giradas que crece al entrar en pantalla.",
|
|
22
|
+
"files": ["recipes/pile/create-pile.ts", "recipes/pile/pile.css", "recipes/pile/README.md"],
|
|
23
|
+
"react": "react/use-pile.ts",
|
|
24
|
+
"since": "0.1.0"
|
|
25
|
+
},
|
|
26
|
+
"words": {
|
|
27
|
+
"kind": "recipe",
|
|
28
|
+
"description": "Palabras o letras que crecen desde la base con entrada escalonada.",
|
|
29
|
+
"files": ["recipes/words/create-words.ts", "recipes/words/README.md"],
|
|
30
|
+
"react": "react/use-words.ts",
|
|
31
|
+
"since": "0.1.0"
|
|
32
|
+
},
|
|
33
|
+
"flow": {
|
|
34
|
+
"kind": "recipe",
|
|
35
|
+
"description": "Entrada escalonada con desplazamiento, desenfoque y opacidad.",
|
|
36
|
+
"files": ["recipes/flow/create-flow.ts", "recipes/flow/README.md"],
|
|
37
|
+
"react": "react/use-flow.ts",
|
|
38
|
+
"since": "0.1.0"
|
|
39
|
+
},
|
|
40
|
+
"pop": {
|
|
41
|
+
"kind": "recipe",
|
|
42
|
+
"description": "Aparición de un elemento mediante escala y rebote.",
|
|
43
|
+
"files": ["recipes/pop/create-pop.ts", "recipes/pop/README.md"],
|
|
44
|
+
"react": "react/use-pop.ts",
|
|
45
|
+
"since": "0.1.0"
|
|
46
|
+
},
|
|
47
|
+
"fit-text": {
|
|
48
|
+
"kind": "recipe",
|
|
49
|
+
"description": "Texto de una línea que se ajusta al ancho de su contenedor.",
|
|
50
|
+
"files": ["recipes/fit-text/create-fit-text.ts", "recipes/fit-text/fit-text.css", "recipes/fit-text/README.md"],
|
|
51
|
+
"react": "react/use-fit-text.ts",
|
|
52
|
+
"since": "0.1.0"
|
|
53
|
+
},
|
|
54
|
+
"stretch-footer": {
|
|
55
|
+
"kind": "recipe",
|
|
56
|
+
"description": "Footer que aparece detrás de la página y estira su título con el scroll.",
|
|
57
|
+
"files": ["recipes/stretch-footer/create-stretch-footer.ts", "recipes/stretch-footer/stretch-footer.css", "recipes/stretch-footer/README.md"],
|
|
58
|
+
"react": "react/use-stretch-footer.ts",
|
|
59
|
+
"since": "0.1.0"
|
|
60
|
+
},
|
|
61
|
+
"radial-menu": {
|
|
62
|
+
"kind": "recipe",
|
|
63
|
+
"description": "Menú con opciones que se despliegan en arco alrededor de un botón.",
|
|
64
|
+
"files": ["recipes/radial-menu/create-radial-menu.ts", "recipes/radial-menu/radial-menu.css", "recipes/radial-menu/README.md"],
|
|
65
|
+
"react": "react/use-radial-menu.ts",
|
|
66
|
+
"since": "0.1.0"
|
|
67
|
+
},
|
|
68
|
+
"pill": {
|
|
69
|
+
"kind": "recipe",
|
|
70
|
+
"description": "Botón píldora y enlaces con respuesta de escala al interactuar.",
|
|
71
|
+
"files": ["recipes/pill/pill.css", "recipes/pill/README.md"],
|
|
72
|
+
"since": "0.1.0"
|
|
73
|
+
},
|
|
74
|
+
"tabs": {
|
|
75
|
+
"kind": "recipe",
|
|
76
|
+
"description": "Pestañas con indicador deslizante y navegación por teclado.",
|
|
77
|
+
"files": ["recipes/tabs/create-tabs.ts", "recipes/tabs/tabs.css", "recipes/tabs/README.md"],
|
|
78
|
+
"react": "react/use-tabs.ts",
|
|
79
|
+
"since": "0.2.0"
|
|
80
|
+
},
|
|
81
|
+
"counter": {
|
|
82
|
+
"kind": "recipe",
|
|
83
|
+
"description": "Contador que anima los cambios de valor con formato configurable.",
|
|
84
|
+
"files": ["recipes/counter/create-counter.ts", "recipes/counter/README.md"],
|
|
85
|
+
"react": "react/use-counter.ts",
|
|
86
|
+
"since": "0.2.0"
|
|
87
|
+
},
|
|
88
|
+
"details": {
|
|
89
|
+
"kind": "recipe",
|
|
90
|
+
"description": "Paneles details con apertura y cierre animados.",
|
|
91
|
+
"files": ["recipes/details/create-details.ts", "recipes/details/README.md"],
|
|
92
|
+
"react": "react/use-details.ts",
|
|
93
|
+
"since": "0.2.0"
|
|
94
|
+
},
|
|
95
|
+
"reveal": {
|
|
96
|
+
"kind": "recipe",
|
|
97
|
+
"description": "Revelado de una superficie desde un punto o elemento.",
|
|
98
|
+
"files": ["recipes/reveal/create-reveal.ts", "recipes/reveal/README.md"],
|
|
99
|
+
"react": "react/use-reveal.ts",
|
|
100
|
+
"since": "0.2.0"
|
|
101
|
+
},
|
|
102
|
+
"reflow": {
|
|
103
|
+
"kind": "recipe",
|
|
104
|
+
"description": "Transición de posición de elementos cuando cambia su distribución.",
|
|
105
|
+
"files": ["recipes/reflow/create-reflow.ts", "recipes/reflow/README.md"],
|
|
106
|
+
"react": "react/use-reflow.ts",
|
|
107
|
+
"since": "0.2.0"
|
|
108
|
+
},
|
|
109
|
+
"slot-text": {
|
|
110
|
+
"kind": "recipe",
|
|
111
|
+
"description": "Texto cuyas letras ruedan al cambiar su contenido.",
|
|
112
|
+
"files": ["recipes/slot-text/create-slot-text.ts", "recipes/slot-text/slot-text.css", "recipes/slot-text/README.md"],
|
|
113
|
+
"react": "react/use-slot-text.ts",
|
|
114
|
+
"since": "0.2.0"
|
|
115
|
+
},
|
|
116
|
+
"sortable": {
|
|
117
|
+
"kind": "recipe",
|
|
118
|
+
"description": "Listas y kanban con reordenamiento por arrastre o teclado.",
|
|
119
|
+
"files": ["recipes/sortable/create-sortable.ts", "recipes/sortable/sortable.css", "recipes/sortable/README.md"],
|
|
120
|
+
"react": "react/use-sortable.ts",
|
|
121
|
+
"since": "0.4.0"
|
|
122
|
+
},
|
|
123
|
+
"mask-text": {
|
|
124
|
+
"kind": "recipe",
|
|
125
|
+
"description": "Texto que aparece desde una máscara por líneas, palabras o caracteres.",
|
|
126
|
+
"files": ["recipes/mask-text/create-mask-text.ts", "recipes/mask-text/README.md"],
|
|
127
|
+
"react": "react/use-mask-text.ts",
|
|
128
|
+
"since": "0.6.0"
|
|
129
|
+
},
|
|
130
|
+
"cascade": {
|
|
131
|
+
"kind": "recipe",
|
|
132
|
+
"description": "Entrada escalonada de líneas, separadores y bloques.",
|
|
133
|
+
"files": ["recipes/cascade/create-cascade.ts", "recipes/cascade/README.md"],
|
|
134
|
+
"react": "react/use-cascade.ts",
|
|
135
|
+
"since": "0.6.0"
|
|
136
|
+
},
|
|
137
|
+
"text-roll": {
|
|
138
|
+
"kind": "recipe",
|
|
139
|
+
"description": "Letras que giran como un rodillo y regresan a su posición.",
|
|
140
|
+
"files": ["recipes/text-roll/create-text-roll.ts", "recipes/text-roll/text-roll.css", "recipes/text-roll/README.md"],
|
|
141
|
+
"react": "react/use-text-roll.ts",
|
|
142
|
+
"since": "0.6.0"
|
|
143
|
+
},
|
|
144
|
+
"letters": {
|
|
145
|
+
"kind": "recipe",
|
|
146
|
+
"description": "Letras que crecen al pasar el puntero o parpadean con una paleta.",
|
|
147
|
+
"files": ["recipes/letters/create-letters.ts", "recipes/letters/README.md"],
|
|
148
|
+
"react": "react/use-letters.ts",
|
|
149
|
+
"since": "0.6.0"
|
|
150
|
+
},
|
|
151
|
+
"parallax": {
|
|
152
|
+
"kind": "recipe",
|
|
153
|
+
"description": "Imagen que se desplaza y escala dentro de su marco con el scroll.",
|
|
154
|
+
"files": ["recipes/parallax/create-parallax.ts", "recipes/parallax/README.md"],
|
|
155
|
+
"react": "react/use-parallax.ts",
|
|
156
|
+
"since": "0.6.0"
|
|
157
|
+
},
|
|
158
|
+
"depth-grid": {
|
|
159
|
+
"kind": "recipe",
|
|
160
|
+
"description": "Grid de imágenes que se reúne desde la profundidad con el scroll.",
|
|
161
|
+
"files": ["recipes/depth-grid/create-depth-grid.ts", "recipes/depth-grid/README.md"],
|
|
162
|
+
"react": "react/use-depth-grid.ts",
|
|
163
|
+
"since": "0.6.0"
|
|
164
|
+
},
|
|
165
|
+
"frame-zoom": {
|
|
166
|
+
"kind": "recipe",
|
|
167
|
+
"description": "Marco e imagen que escalan en direcciones opuestas con el scroll.",
|
|
168
|
+
"files": ["recipes/frame-zoom/create-frame-zoom.ts", "recipes/frame-zoom/README.md"],
|
|
169
|
+
"react": "react/use-frame-zoom.ts",
|
|
170
|
+
"since": "0.6.0"
|
|
171
|
+
},
|
|
172
|
+
"contrast": {
|
|
173
|
+
"kind": "recipe",
|
|
174
|
+
"description": "Cabecera que cambia de tono según la sección situada debajo.",
|
|
175
|
+
"files": ["recipes/contrast/create-contrast.ts", "recipes/contrast/README.md"],
|
|
176
|
+
"react": "react/use-contrast.ts",
|
|
177
|
+
"since": "0.6.0"
|
|
178
|
+
},
|
|
179
|
+
"marquee": {
|
|
180
|
+
"kind": "recipe",
|
|
181
|
+
"description": "Banda continua horizontal o vertical con copias decorativas.",
|
|
182
|
+
"files": ["recipes/marquee/create-marquee.ts", "recipes/marquee/marquee.css", "recipes/marquee/README.md"],
|
|
183
|
+
"react": "react/use-marquee.ts",
|
|
184
|
+
"since": "0.6.0"
|
|
185
|
+
},
|
|
186
|
+
"card-dock": {
|
|
187
|
+
"kind": "recipe",
|
|
188
|
+
"description": "Tarjetas apiladas que se despliegan al señalar, enfocar o tocar.",
|
|
189
|
+
"files": ["recipes/card-dock/create-card-dock.ts", "recipes/card-dock/card-dock.css", "recipes/card-dock/README.md"],
|
|
190
|
+
"react": "react/use-card-dock.ts",
|
|
191
|
+
"since": "0.7.0"
|
|
192
|
+
},
|
|
193
|
+
"snap-strip": {
|
|
194
|
+
"kind": "recipe",
|
|
195
|
+
"description": "Tira de tarjetas con scroll-snap, autoplay y pausa al interactuar.",
|
|
196
|
+
"files": ["recipes/snap-strip/create-snap-strip.ts", "recipes/snap-strip/snap-strip.css", "recipes/snap-strip/README.md"],
|
|
197
|
+
"react": "react/use-snap-strip.ts",
|
|
198
|
+
"since": "0.7.0"
|
|
199
|
+
},
|
|
200
|
+
"fill-text": {
|
|
201
|
+
"kind": "recipe",
|
|
202
|
+
"description": "Texto que se rellena progresivamente con el scroll.",
|
|
203
|
+
"files": ["recipes/fill-text/create-fill-text.ts", "recipes/fill-text/README.md"],
|
|
204
|
+
"react": "react/use-fill-text.ts",
|
|
205
|
+
"since": "0.7.0"
|
|
206
|
+
},
|
|
207
|
+
"particle-hero": {
|
|
208
|
+
"kind": "recipe",
|
|
209
|
+
"description": "Nube de partículas en GPU que forma palabras, con fallback Canvas2D.",
|
|
210
|
+
"files": ["gl/particle-hero/create-particle-hero.ts", "gl/particle-hero/shaders.ts", "gl/particle-hero/particle-hero.css", "gl/particle-hero/README.md"],
|
|
211
|
+
"react": "react/use-particle-hero.ts",
|
|
212
|
+
"since": "0.7.0"
|
|
213
|
+
},
|
|
214
|
+
"ticket-menu": {
|
|
215
|
+
"kind": "recipe",
|
|
216
|
+
"description": "Menú boleto con recorte de apertura, filas escalonadas, foco y teclado.",
|
|
217
|
+
"files": ["recipes/ticket-menu/create-ticket-menu.ts", "recipes/ticket-menu/README.md"],
|
|
218
|
+
"react": "react/use-ticket-menu.ts",
|
|
219
|
+
"requires": [
|
|
220
|
+
"menu"
|
|
221
|
+
],
|
|
222
|
+
"since": "0.8.0"
|
|
223
|
+
},
|
|
224
|
+
"infinite-reel": {
|
|
225
|
+
"kind": "recipe",
|
|
226
|
+
"description": "Reel infinito horizontal o vertical con rueda, arrastre e inercia.",
|
|
227
|
+
"files": ["recipes/infinite-reel/create-infinite-reel.ts", "recipes/infinite-reel/infinite-reel.css", "recipes/infinite-reel/README.md"],
|
|
228
|
+
"react": "react/use-infinite-reel.ts",
|
|
229
|
+
"since": "0.8.0"
|
|
230
|
+
},
|
|
231
|
+
"repel-bento": {
|
|
232
|
+
"kind": "recipe",
|
|
233
|
+
"description": "Grid bento con entrada de resorte y repulsión entre tarjetas.",
|
|
234
|
+
"files": ["recipes/repel-bento/create-repel-bento.ts", "recipes/repel-bento/repel-bento.css", "recipes/repel-bento/README.md"],
|
|
235
|
+
"react": "react/use-repel-bento.ts",
|
|
236
|
+
"since": "0.8.0"
|
|
237
|
+
},
|
|
238
|
+
"rotator": {
|
|
239
|
+
"kind": "recipe",
|
|
240
|
+
"description": "Rotador de contenido con autoplay, controles y pausa al enfocar o señalar.",
|
|
241
|
+
"files": ["recipes/rotator/create-rotator.ts", "recipes/rotator/rotator.css", "recipes/rotator/README.md"],
|
|
242
|
+
"react": "react/use-rotator.ts",
|
|
243
|
+
"since": "0.8.0"
|
|
244
|
+
},
|
|
245
|
+
"drag-ruler": {
|
|
246
|
+
"kind": "recipe",
|
|
247
|
+
"description": "Regla numérica con arrastre, límites, paso y teclado.",
|
|
248
|
+
"files": ["recipes/drag-ruler/create-drag-ruler.ts", "recipes/drag-ruler/drag-ruler.css", "recipes/drag-ruler/README.md"],
|
|
249
|
+
"react": "react/use-drag-ruler.ts",
|
|
250
|
+
"since": "0.8.0"
|
|
251
|
+
},
|
|
252
|
+
"dock-pill": {
|
|
253
|
+
"kind": "recipe",
|
|
254
|
+
"description": "Indicador con resorte que sigue la opción activa de un dock.",
|
|
255
|
+
"files": ["recipes/dock-pill/create-dock-pill.ts", "recipes/dock-pill/dock-pill.css", "recipes/dock-pill/README.md"],
|
|
256
|
+
"react": "react/use-dock-pill.ts",
|
|
257
|
+
"since": "0.8.0"
|
|
258
|
+
},
|
|
259
|
+
"liquid-blend": {
|
|
260
|
+
"kind": "recipe",
|
|
261
|
+
"description": "Mezcla de dos imágenes con deformación de sus coordenadas UV.",
|
|
262
|
+
"files": ["gl/liquid-blend/create-liquid-blend.ts", "gl/liquid-blend/shader.ts", "gl/shared/shader.css", "gl/liquid-blend/README.md"],
|
|
263
|
+
"react": "react/use-liquid-blend.ts",
|
|
264
|
+
"since": "0.9.0"
|
|
265
|
+
},
|
|
266
|
+
"matcap": {
|
|
267
|
+
"kind": "recipe",
|
|
268
|
+
"description": "Superficie esférica iluminada con un mapa de material y luz hemisférica.",
|
|
269
|
+
"files": ["gl/matcap/create-matcap.ts", "gl/matcap/shader.ts", "gl/shared/shader.css", "gl/matcap/README.md"],
|
|
270
|
+
"react": "react/use-matcap.ts",
|
|
271
|
+
"since": "0.9.0"
|
|
272
|
+
},
|
|
273
|
+
"shader-grain": {
|
|
274
|
+
"kind": "recipe",
|
|
275
|
+
"description": "Grano de película generado y animado mediante shader.",
|
|
276
|
+
"files": ["gl/shader-grain/create-shader-grain.ts", "gl/shader-grain/shader.ts", "gl/shared/shader.css", "gl/shader-grain/README.md"],
|
|
277
|
+
"react": "react/use-shader-grain.ts",
|
|
278
|
+
"since": "0.9.0"
|
|
279
|
+
},
|
|
280
|
+
"shader-blur": {
|
|
281
|
+
"kind": "recipe",
|
|
282
|
+
"description": "Desenfoque direccional de siete muestras mediante shader.",
|
|
283
|
+
"files": ["gl/shader-blur/create-shader-blur.ts", "gl/shader-blur/shader.ts", "gl/shared/shader.css", "gl/shader-blur/README.md"],
|
|
284
|
+
"react": "react/use-shader-blur.ts",
|
|
285
|
+
"since": "0.9.0"
|
|
286
|
+
},
|
|
287
|
+
"controls": {
|
|
288
|
+
"kind": "controls",
|
|
289
|
+
"description": "Controles CSS: botones, campos, switches, checkboxes, chips, iconos y cristal.",
|
|
290
|
+
"files": ["css/controls/button.css", "css/controls/field.css", "css/controls/switch.css", "css/controls/checkbox.css", "css/controls/chip.css", "css/controls/segmented.css", "css/controls/icon.css", "css/controls/glass.css", "css/controls/burger.css", "css/controls/status.css", "css/controls/README.md"],
|
|
291
|
+
"since": "0.2.0"
|
|
292
|
+
},
|
|
293
|
+
"effects": {
|
|
294
|
+
"kind": "effects",
|
|
295
|
+
"description": "Efectos CSS y funciones para entradas, salidas, carga, blur, flotación y confeti.",
|
|
296
|
+
"files": ["css/effects/anim.css", "css/effects/loading.css", "css/effects/text.css", "css/effects/frost.css", "css/effects/float.css", "css/effects/grain.css", "css/effects/success.css", "css/effects/fade.css", "motion/effects.ts", "motion/confetti.ts", "css/effects/README.md"],
|
|
297
|
+
"react": "react/frost.tsx",
|
|
298
|
+
"since": "0.5.0"
|
|
299
|
+
},
|
|
300
|
+
"theme-picker": {
|
|
301
|
+
"kind": "component",
|
|
302
|
+
"description": "Selector de temas con muestras de color y selección animada.",
|
|
303
|
+
"files": ["components/theme-picker/engine.ts", "components/theme-picker/theme-picker.css", "components/theme-picker/README.md"],
|
|
304
|
+
"element": "components/theme-picker/element.ts",
|
|
305
|
+
"react": "components/theme-picker/react.tsx",
|
|
306
|
+
"since": "0.2.0"
|
|
307
|
+
},
|
|
308
|
+
"dialog": {
|
|
309
|
+
"kind": "component",
|
|
310
|
+
"description": "Diálogo con apertura desde un botón, variantes morph, liquid y sheet, y gestos.",
|
|
311
|
+
"files": ["components/dialog/engine.ts", "components/dialog/dialog.css", "components/dialog/README.md"],
|
|
312
|
+
"element": "components/dialog/element.ts",
|
|
313
|
+
"react": "components/dialog/react.tsx",
|
|
314
|
+
"since": "0.3.0"
|
|
315
|
+
},
|
|
316
|
+
"menu": {
|
|
317
|
+
"kind": "component",
|
|
318
|
+
"description": "Menú de opciones anclado a un botón, con entrada escalonada y teclado.",
|
|
319
|
+
"files": ["components/menu/engine.ts", "components/menu/menu.css", "components/menu/README.md"],
|
|
320
|
+
"element": "components/menu/element.ts",
|
|
321
|
+
"react": "components/menu/react.tsx",
|
|
322
|
+
"requires": [
|
|
323
|
+
"dialog"
|
|
324
|
+
],
|
|
325
|
+
"since": "0.3.0"
|
|
326
|
+
},
|
|
327
|
+
"toast": {
|
|
328
|
+
"kind": "component",
|
|
329
|
+
"description": "Pila de notificaciones con apertura desde un botón y gestos para descartar.",
|
|
330
|
+
"files": ["components/toast/engine.ts", "components/toast/store.ts", "components/toast/toast.css", "components/toast/README.md"],
|
|
331
|
+
"element": "components/toast/element.ts",
|
|
332
|
+
"react": "components/toast/react.tsx",
|
|
333
|
+
"since": "0.3.0"
|
|
334
|
+
},
|
|
335
|
+
"chat-background": {
|
|
336
|
+
"kind": "component",
|
|
337
|
+
"description": "Fondo de manchas animadas cuya energía puede seguir al micrófono.",
|
|
338
|
+
"files": ["components/chat-background/engine.ts", "components/chat-background/audio.ts", "components/chat-background/chat-background.css", "components/chat-background/README.md"],
|
|
339
|
+
"element": "components/chat-background/element.ts",
|
|
340
|
+
"react": "components/chat-background/react.tsx",
|
|
341
|
+
"since": "0.4.0"
|
|
342
|
+
},
|
|
343
|
+
"chat": {
|
|
344
|
+
"kind": "component",
|
|
345
|
+
"description": "Chat con burbujas animadas, estado de espera y campo de entrada adaptable.",
|
|
346
|
+
"files": ["components/chat/engine.ts", "components/chat/chat.css", "components/chat/README.md"],
|
|
347
|
+
"element": "components/chat/element.ts",
|
|
348
|
+
"react": "components/chat/react.tsx",
|
|
349
|
+
"requires": [
|
|
350
|
+
"chat-background"
|
|
351
|
+
],
|
|
352
|
+
"since": "0.4.0"
|
|
353
|
+
},
|
|
354
|
+
"nav": {
|
|
355
|
+
"kind": "component",
|
|
356
|
+
"description": "Navegación con siete estilos de escritorio y una barra de cristal en móvil.",
|
|
357
|
+
"files": ["components/nav/engine.ts", "components/nav/nav.css", "components/nav/README.md"],
|
|
358
|
+
"element": "components/nav/element.ts",
|
|
359
|
+
"react": "components/nav/react.tsx",
|
|
360
|
+
"since": "0.4.0"
|
|
361
|
+
},
|
|
362
|
+
"steps": {
|
|
363
|
+
"kind": "component",
|
|
364
|
+
"description": "Flujo por pasos con transiciones, contador, foco y estado ocupado.",
|
|
365
|
+
"files": ["components/steps/engine.ts", "components/steps/steps.css", "components/steps/README.md"],
|
|
366
|
+
"element": "components/steps/element.ts",
|
|
367
|
+
"react": "components/steps/react.tsx",
|
|
368
|
+
"requires": [
|
|
369
|
+
"chat-background"
|
|
370
|
+
],
|
|
371
|
+
"since": "0.4.0"
|
|
372
|
+
},
|
|
373
|
+
"cursor": {
|
|
374
|
+
"kind": "component",
|
|
375
|
+
"description": "Cursor de cristal con texto o círculo que sigue al puntero en una zona.",
|
|
376
|
+
"files": ["components/cursor/engine.ts", "components/cursor/cursor.css", "components/cursor/README.md"],
|
|
377
|
+
"element": "components/cursor/element.ts",
|
|
378
|
+
"react": "components/cursor/react.tsx",
|
|
379
|
+
"requires": [
|
|
380
|
+
"controls"
|
|
381
|
+
],
|
|
382
|
+
"since": "0.6.0"
|
|
383
|
+
},
|
|
384
|
+
"island": {
|
|
385
|
+
"kind": "component",
|
|
386
|
+
"description": "Barra flotante de cristal que se expande en paneles de menú y carrito.",
|
|
387
|
+
"files": ["components/island/engine.ts", "components/island/island.css", "components/island/README.md"],
|
|
388
|
+
"element": "components/island/element.ts",
|
|
389
|
+
"react": "components/island/react.tsx",
|
|
390
|
+
"since": "0.7.0"
|
|
391
|
+
},
|
|
392
|
+
"quantity": {
|
|
393
|
+
"kind": "component",
|
|
394
|
+
"description": "Selector numérico con límites, botones de mordida y edición accesible.",
|
|
395
|
+
"files": ["components/quantity/engine.ts", "components/quantity/quantity.css", "components/quantity/README.md"],
|
|
396
|
+
"element": "components/quantity/element.ts",
|
|
397
|
+
"react": "components/quantity/react.tsx",
|
|
398
|
+
"since": "0.10.0"
|
|
399
|
+
},
|
|
400
|
+
"pagination": {
|
|
401
|
+
"kind": "component",
|
|
402
|
+
"description": "Paginación con elipsis, controles animados y navegación por teclado.",
|
|
403
|
+
"files": ["components/pagination/engine.ts", "components/pagination/pagination.css", "components/pagination/README.md"],
|
|
404
|
+
"element": "components/pagination/element.ts",
|
|
405
|
+
"react": "components/pagination/react.tsx",
|
|
406
|
+
"since": "0.10.0"
|
|
407
|
+
},
|
|
408
|
+
"hover-card": {
|
|
409
|
+
"kind": "component",
|
|
410
|
+
"description": "Vista previa con apertura por puntero, foco o toque, posición dentro del viewport y cierre con Escape.",
|
|
411
|
+
"files": ["components/hover-card/engine.ts", "components/hover-card/hover-card.css", "components/hover-card/README.md"],
|
|
412
|
+
"element": "components/hover-card/element.ts",
|
|
413
|
+
"react": "components/hover-card/react.tsx",
|
|
414
|
+
"since": "0.10.0"
|
|
415
|
+
},
|
|
416
|
+
"input-otp": {
|
|
417
|
+
"kind": "component",
|
|
418
|
+
"description": "Código OTP con input nativo, slots animados, pegado y autocompletado.",
|
|
419
|
+
"files": ["components/input-otp/engine.ts", "components/input-otp/input-otp.css", "components/input-otp/README.md"],
|
|
420
|
+
"element": "components/input-otp/element.ts",
|
|
421
|
+
"react": "components/input-otp/react.tsx",
|
|
422
|
+
"since": "0.10.0"
|
|
423
|
+
},
|
|
424
|
+
"joined-cta": {
|
|
425
|
+
"kind": "recipe",
|
|
426
|
+
"description": "Tres cápsulas de contacto que se unen al señalar o enfocar.",
|
|
427
|
+
"files": ["recipes/joined-cta/create-joined-cta.ts", "recipes/joined-cta/joined-cta.css", "recipes/joined-cta/README.md"],
|
|
428
|
+
"react": "react/use-joined-cta.ts",
|
|
429
|
+
"since": "0.10.0"
|
|
430
|
+
},
|
|
431
|
+
"image-zoom": {
|
|
432
|
+
"kind": "recipe",
|
|
433
|
+
"description": "Zoom opuesto del marco y la imagen al señalar o enfocar.",
|
|
434
|
+
"files": ["recipes/image-zoom/create-image-zoom.ts", "recipes/image-zoom/image-zoom.css", "recipes/image-zoom/README.md"],
|
|
435
|
+
"react": "react/use-image-zoom.ts",
|
|
436
|
+
"since": "0.10.0"
|
|
437
|
+
},
|
|
438
|
+
"font-cycle": {
|
|
439
|
+
"kind": "recipe",
|
|
440
|
+
"description": "Tipografía variable por carácter con rodillo y overlay opcional.",
|
|
441
|
+
"files": ["recipes/font-cycle/create-font-cycle.ts", "recipes/font-cycle/font-cycle.css", "recipes/font-cycle/README.md"],
|
|
442
|
+
"react": "react/use-font-cycle.ts",
|
|
443
|
+
"since": "0.10.0"
|
|
444
|
+
},
|
|
445
|
+
"thumbnail-nav": {
|
|
446
|
+
"kind": "recipe",
|
|
447
|
+
"description": "Navegador de categorías en cápsula con miniaturas y teclado.",
|
|
448
|
+
"files": ["recipes/thumbnail-nav/create-thumbnail-nav.ts", "recipes/thumbnail-nav/thumbnail-nav.css", "recipes/thumbnail-nav/README.md"],
|
|
449
|
+
"react": "react/use-thumbnail-nav.ts",
|
|
450
|
+
"since": "0.10.0"
|
|
451
|
+
},
|
|
452
|
+
"action-button": {
|
|
453
|
+
"kind": "recipe",
|
|
454
|
+
"description": "Botones dibujados, iconos y etiquetas de cine con respuesta al pulsar.",
|
|
455
|
+
"files": ["recipes/action-button/create-action-button.ts", "recipes/action-button/action-button.css", "recipes/action-button/README.md"],
|
|
456
|
+
"react": "react/use-action-button.ts",
|
|
457
|
+
"since": "0.10.0"
|
|
458
|
+
},
|
|
459
|
+
"film-hero": {
|
|
460
|
+
"kind": "recipe",
|
|
461
|
+
"description": "Hero cinematográfico con revelado de líneas y desplazamiento de medios.",
|
|
462
|
+
"files": ["recipes/film-hero/create-film-hero.ts", "recipes/film-hero/film-hero.css", "recipes/film-hero/README.md"],
|
|
463
|
+
"react": "react/use-film-hero.ts",
|
|
464
|
+
"since": "0.10.0"
|
|
465
|
+
},
|
|
466
|
+
"editorial-reveal": {
|
|
467
|
+
"kind": "recipe",
|
|
468
|
+
"description": "Composición editorial de hero, tarjetas y contacto con entradas escalonadas.",
|
|
469
|
+
"files": ["recipes/editorial-reveal/create-editorial-reveal.ts", "recipes/editorial-reveal/editorial-reveal.css", "recipes/editorial-reveal/README.md"],
|
|
470
|
+
"react": "react/use-editorial-reveal.ts",
|
|
471
|
+
"since": "0.10.0",
|
|
472
|
+
"requires": [
|
|
473
|
+
"mask-text",
|
|
474
|
+
"cascade",
|
|
475
|
+
"parallax",
|
|
476
|
+
"contrast"
|
|
477
|
+
]
|
|
478
|
+
},
|
|
479
|
+
"studio-dock": {
|
|
480
|
+
"kind": "component",
|
|
481
|
+
"description": "Dock de estudio que se transforma en panel bento con páginas y contacto.",
|
|
482
|
+
"files": ["components/studio-dock/engine.ts", "components/studio-dock/studio-dock.css", "components/studio-dock/README.md"],
|
|
483
|
+
"react": "components/studio-dock/react.tsx",
|
|
484
|
+
"element": "components/studio-dock/element.ts",
|
|
485
|
+
"since": "0.10.0"
|
|
486
|
+
},
|
|
487
|
+
"trailer": {
|
|
488
|
+
"kind": "component",
|
|
489
|
+
"description": "Reproductor de video en modal con controles accesibles y retorno de foco.",
|
|
490
|
+
"files": ["components/trailer/engine.ts", "components/trailer/trailer.css", "components/trailer/README.md"],
|
|
491
|
+
"react": "components/trailer/react.tsx",
|
|
492
|
+
"element": "components/trailer/element.ts",
|
|
493
|
+
"since": "0.10.0",
|
|
494
|
+
"requires": [
|
|
495
|
+
"dialog"
|
|
496
|
+
]
|
|
497
|
+
},
|
|
498
|
+
"calendar": {
|
|
499
|
+
"kind": "component",
|
|
500
|
+
"description": "Calendario de mes y semana con eventos, entrada escalonada de días y deslizamiento al navegar (Melon Mind).",
|
|
501
|
+
"files": ["components/calendar/engine.ts", "components/calendar/calendar.css", "components/calendar/README.md"],
|
|
502
|
+
"element": "components/calendar/element.ts",
|
|
503
|
+
"react": "components/calendar/react.tsx",
|
|
504
|
+
"since": "0.10.0"
|
|
505
|
+
},
|
|
506
|
+
"slot-picker": {
|
|
507
|
+
"kind": "component",
|
|
508
|
+
"description": "Selector de día y horario para citas o reservas: horarios que se deslizan al cambiar de día (Melon Mind).",
|
|
509
|
+
"files": ["components/slot-picker/engine.ts", "components/slot-picker/slot-picker.css", "components/slot-picker/README.md"],
|
|
510
|
+
"element": "components/slot-picker/element.ts",
|
|
511
|
+
"react": "components/slot-picker/react.tsx",
|
|
512
|
+
"since": "0.10.0"
|
|
513
|
+
},
|
|
514
|
+
"weight-hover": {
|
|
515
|
+
"kind": "recipe",
|
|
516
|
+
"description": "Peso variable por letra que baja al acercarse el puntero (DOVV Studio).",
|
|
517
|
+
"files": ["recipes/weight-hover/create-weight-hover.ts", "recipes/weight-hover/weight-hover.css", "recipes/weight-hover/README.md"],
|
|
518
|
+
"react": "react/use-weight-hover.ts",
|
|
519
|
+
"since": "0.10.0"
|
|
520
|
+
},
|
|
521
|
+
"sticker": {
|
|
522
|
+
"kind": "recipe",
|
|
523
|
+
"description": "Sticker holográfico troquelado que se despega, se arrastra y cae (DOVV Studio).",
|
|
524
|
+
"files": ["recipes/sticker/create-sticker.ts", "recipes/sticker/sticker.css", "recipes/sticker/README.md"],
|
|
525
|
+
"react": "react/use-sticker.ts",
|
|
526
|
+
"since": "0.10.0"
|
|
527
|
+
},
|
|
528
|
+
"scroll-dock": {
|
|
529
|
+
"kind": "recipe",
|
|
530
|
+
"description": "Cápsula de navegación que sube al hacer scroll y se esconde en el footer (DOVV Studio).",
|
|
531
|
+
"files": ["recipes/scroll-dock/create-scroll-dock.ts", "recipes/scroll-dock/scroll-dock.css", "recipes/scroll-dock/README.md"],
|
|
532
|
+
"react": "react/use-scroll-dock.ts",
|
|
533
|
+
"since": "0.10.0"
|
|
534
|
+
},
|
|
535
|
+
"local-clock": {
|
|
536
|
+
"kind": "recipe",
|
|
537
|
+
"description": "Hora en vivo de una zona horaria, actualizada al cambiar el minuto (DOVV Studio).",
|
|
538
|
+
"files": ["recipes/local-clock/create-local-clock.ts", "recipes/local-clock/README.md"],
|
|
539
|
+
"react": "react/use-local-clock.ts",
|
|
540
|
+
"since": "0.10.0"
|
|
541
|
+
},
|
|
542
|
+
"attachment": {
|
|
543
|
+
"kind": "component",
|
|
544
|
+
"description": "Selector de archivos con arrastrar y soltar, validación, tarjetas con progreso y vista previa de imágenes.",
|
|
545
|
+
"files": ["components/attachment/engine.ts", "components/attachment/attachment.css", "components/attachment/README.md"],
|
|
546
|
+
"element": "components/attachment/element.ts",
|
|
547
|
+
"react": "components/attachment/react.tsx",
|
|
548
|
+
"since": "0.11.0"
|
|
549
|
+
},
|
|
550
|
+
"skeleton": {
|
|
551
|
+
"kind": "component",
|
|
552
|
+
"description": "Marcador de carga de texto, avatar, imagen o tarjeta con pulso o brillo y estado accesible.",
|
|
553
|
+
"files": ["components/skeleton/engine.ts", "components/skeleton/skeleton.css", "components/skeleton/README.md"],
|
|
554
|
+
"element": "components/skeleton/element.ts",
|
|
555
|
+
"react": "components/skeleton/react.tsx",
|
|
556
|
+
"since": "0.11.0"
|
|
557
|
+
},
|
|
558
|
+
"questionnaire": {
|
|
559
|
+
"kind": "component",
|
|
560
|
+
"description": "Cuestionario por pasos con texto, opción única y múltiple, validación de obligatorios y finalización.",
|
|
561
|
+
"files": ["components/questionnaire/engine.ts", "components/questionnaire/questionnaire.css", "components/questionnaire/README.md"],
|
|
562
|
+
"element": "components/questionnaire/element.ts",
|
|
563
|
+
"react": "components/questionnaire/react.tsx",
|
|
564
|
+
"requires": [
|
|
565
|
+
"steps"
|
|
566
|
+
],
|
|
567
|
+
"since": "0.11.0"
|
|
568
|
+
},
|
|
569
|
+
"code-block": {
|
|
570
|
+
"kind": "component",
|
|
571
|
+
"description": "Bloque de código con título, lenguaje, números de línea y copiar con confirmación.",
|
|
572
|
+
"files": ["components/code-block/engine.ts", "components/code-block/highlight.ts", "components/code-block/code-block.css", "components/code-block/README.md"],
|
|
573
|
+
"element": "components/code-block/element.ts",
|
|
574
|
+
"react": "components/code-block/react.tsx",
|
|
575
|
+
"since": "0.11.0"
|
|
576
|
+
},
|
|
577
|
+
"context-menu": {
|
|
578
|
+
"kind": "component",
|
|
579
|
+
"description": "Menú contextual con clic derecho, tecla Menú, Shift+F10 o pulsación larga, dentro del viewport.",
|
|
580
|
+
"files": ["components/context-menu/engine.ts", "components/context-menu/context-menu.css", "components/context-menu/README.md"],
|
|
581
|
+
"element": "components/context-menu/element.ts",
|
|
582
|
+
"react": "components/context-menu/react.tsx",
|
|
583
|
+
"requires": [
|
|
584
|
+
"menu"
|
|
585
|
+
],
|
|
586
|
+
"since": "0.11.0"
|
|
587
|
+
},
|
|
588
|
+
"drawer": {
|
|
589
|
+
"kind": "component",
|
|
590
|
+
"description": "Panel lateral izquierdo o derecho y hoja inferior sobre el diálogo nativo, con foco y bloqueo de scroll.",
|
|
591
|
+
"files": ["components/drawer/engine.ts", "components/drawer/drawer.css", "components/drawer/README.md"],
|
|
592
|
+
"element": "components/drawer/element.ts",
|
|
593
|
+
"react": "components/drawer/react.tsx",
|
|
594
|
+
"requires": [
|
|
595
|
+
"dialog"
|
|
596
|
+
],
|
|
597
|
+
"since": "0.11.0"
|
|
598
|
+
},
|
|
599
|
+
"link-preview": {
|
|
600
|
+
"kind": "component",
|
|
601
|
+
"description": "Tarjeta de enlace con miniatura, sitio, título y descripción, o enlace que la previsualiza al señalar.",
|
|
602
|
+
"files": ["components/link-preview/engine.ts", "components/link-preview/link-preview.css", "components/link-preview/README.md"],
|
|
603
|
+
"element": "components/link-preview/element.ts",
|
|
604
|
+
"react": "components/link-preview/react.tsx",
|
|
605
|
+
"requires": [
|
|
606
|
+
"hover-card"
|
|
607
|
+
],
|
|
608
|
+
"since": "0.11.0"
|
|
609
|
+
},
|
|
610
|
+
"progress": {
|
|
611
|
+
"kind": "component",
|
|
612
|
+
"description": "Barra o anillo de progreso, determinado o indeterminado, con límites y porcentaje opcional.",
|
|
613
|
+
"files": ["components/progress/engine.ts", "components/progress/progress.css", "components/progress/README.md"],
|
|
614
|
+
"element": "components/progress/element.ts",
|
|
615
|
+
"react": "components/progress/react.tsx",
|
|
616
|
+
"since": "0.11.0"
|
|
617
|
+
},
|
|
618
|
+
"range-slider": {
|
|
619
|
+
"kind": "component",
|
|
620
|
+
"description": "Valor o intervalo sobre inputs range nativos, con pasos, límites, relleno y salida formateada.",
|
|
621
|
+
"files": ["components/range-slider/engine.ts", "components/range-slider/range-slider.css", "components/range-slider/README.md"],
|
|
622
|
+
"element": "components/range-slider/element.ts",
|
|
623
|
+
"react": "components/range-slider/react.tsx",
|
|
624
|
+
"since": "0.11.0"
|
|
625
|
+
},
|
|
626
|
+
"chart": {
|
|
627
|
+
"kind": "component",
|
|
628
|
+
"description": "Gráfica SVG de línea, área y barras agrupadas o apiladas, con tooltip, teclado y tabla accesible.",
|
|
629
|
+
"files": ["components/chart/engine.ts", "components/chart/chart.css", "components/chart/README.md"],
|
|
630
|
+
"element": "components/chart/element.ts",
|
|
631
|
+
"react": "components/chart/react.tsx",
|
|
632
|
+
"since": "0.11.0"
|
|
633
|
+
},
|
|
634
|
+
"credit-card": {
|
|
635
|
+
"kind": "component",
|
|
636
|
+
"description": "Tarjeta de crédito que se rellena al escribir y gira en 3D al llegar al CVC, con campos nativos y validación.",
|
|
637
|
+
"files": ["components/credit-card/engine.ts", "components/credit-card/card.ts", "components/credit-card/credit-card.css", "components/credit-card/README.md"],
|
|
638
|
+
"element": "components/credit-card/element.ts",
|
|
639
|
+
"react": "components/credit-card/react.tsx",
|
|
640
|
+
"since": "0.12.0"
|
|
641
|
+
},
|
|
642
|
+
"command-search": {
|
|
643
|
+
"kind": "component",
|
|
644
|
+
"description": "Paleta de comandos con ⌘K, búsqueda aproximada con letras marcadas, grupos y teclado.",
|
|
645
|
+
"files": ["components/command-search/engine.ts", "components/command-search/match.ts", "components/command-search/command-search.css", "components/command-search/README.md"],
|
|
646
|
+
"element": "components/command-search/element.ts",
|
|
647
|
+
"react": "components/command-search/react.tsx",
|
|
648
|
+
"since": "0.12.0"
|
|
649
|
+
},
|
|
650
|
+
"hold-confirm": {
|
|
651
|
+
"kind": "component",
|
|
652
|
+
"description": "Botón que confirma al mantenerlo pulsado: relleno, etiqueta que cambia, ✓ y partículas.",
|
|
653
|
+
"files": ["components/hold-confirm/engine.ts", "components/hold-confirm/hold-confirm.css", "components/hold-confirm/README.md"],
|
|
654
|
+
"element": "components/hold-confirm/element.ts",
|
|
655
|
+
"react": "components/hold-confirm/react.tsx",
|
|
656
|
+
"since": "0.12.0"
|
|
657
|
+
},
|
|
658
|
+
"image-preview": {
|
|
659
|
+
"kind": "component",
|
|
660
|
+
"description": "Visor de imágenes en diálogo que crece desde la miniatura, con galería, zoom y arrastre para cerrar.",
|
|
661
|
+
"files": ["components/image-preview/engine.ts", "components/image-preview/image-preview.css", "components/image-preview/README.md"],
|
|
662
|
+
"element": "components/image-preview/element.ts",
|
|
663
|
+
"react": "components/image-preview/react.tsx",
|
|
664
|
+
"since": "0.12.0"
|
|
665
|
+
},
|
|
666
|
+
"like-button": {
|
|
667
|
+
"kind": "component",
|
|
668
|
+
"description": "Botón de me gusta con corazón que rebota, partículas y contador que rueda.",
|
|
669
|
+
"files": ["components/like-button/engine.ts", "components/like-button/like-button.css", "components/like-button/README.md"],
|
|
670
|
+
"element": "components/like-button/element.ts",
|
|
671
|
+
"react": "components/like-button/react.tsx",
|
|
672
|
+
"since": "0.12.0"
|
|
673
|
+
},
|
|
674
|
+
"notification-bell": {
|
|
675
|
+
"kind": "component",
|
|
676
|
+
"description": "Campana de notificaciones que oscila al llegar una, con insignia, ondas y mensaje.",
|
|
677
|
+
"files": ["components/notification-bell/engine.ts", "components/notification-bell/notification-bell.css", "components/notification-bell/README.md"],
|
|
678
|
+
"element": "components/notification-bell/element.ts",
|
|
679
|
+
"react": "components/notification-bell/react.tsx",
|
|
680
|
+
"since": "0.12.0"
|
|
681
|
+
},
|
|
682
|
+
"password-strength": {
|
|
683
|
+
"kind": "component",
|
|
684
|
+
"description": "Contraseña con medidor de fortaleza en cascada, requisitos que se marcan y mostrar/ocultar.",
|
|
685
|
+
"files": ["components/password-strength/engine.ts", "components/password-strength/score.ts", "components/password-strength/password-strength.css", "components/password-strength/README.md"],
|
|
686
|
+
"element": "components/password-strength/element.ts",
|
|
687
|
+
"react": "components/password-strength/react.tsx",
|
|
688
|
+
"since": "0.12.0"
|
|
689
|
+
},
|
|
690
|
+
"scratch-card": {
|
|
691
|
+
"kind": "component",
|
|
692
|
+
"description": "Rasca y gana para cupones: cubierta metalizada en canvas, revelado con blur y confeti.",
|
|
693
|
+
"files": ["components/scratch-card/engine.ts", "components/scratch-card/scratch-card.css", "components/scratch-card/README.md"],
|
|
694
|
+
"element": "components/scratch-card/element.ts",
|
|
695
|
+
"react": "components/scratch-card/react.tsx",
|
|
696
|
+
"since": "0.12.0"
|
|
697
|
+
},
|
|
698
|
+
"star-rating": {
|
|
699
|
+
"kind": "component",
|
|
700
|
+
"description": "Valoración con estrellas sobre radios nativos, vista previa en cascada y rebote al elegir.",
|
|
701
|
+
"files": ["components/star-rating/engine.ts", "components/star-rating/star-rating.css", "components/star-rating/README.md"],
|
|
702
|
+
"element": "components/star-rating/element.ts",
|
|
703
|
+
"react": "components/star-rating/react.tsx",
|
|
704
|
+
"since": "0.12.0"
|
|
705
|
+
},
|
|
706
|
+
"swipe-actions": {
|
|
707
|
+
"kind": "component",
|
|
708
|
+
"description": "Filas de lista que se deslizan para mostrar acciones; el deslizamiento largo ejecuta la principal.",
|
|
709
|
+
"files": ["components/swipe-actions/engine.ts", "components/swipe-actions/swipe-actions.css", "components/swipe-actions/README.md"],
|
|
710
|
+
"element": "components/swipe-actions/element.ts",
|
|
711
|
+
"react": "components/swipe-actions/react.tsx",
|
|
712
|
+
"since": "0.12.0"
|
|
713
|
+
},
|
|
714
|
+
"color-slider": {
|
|
715
|
+
"kind": "component",
|
|
716
|
+
"description": "Deslizador de un canal de color (tono, opacidad…) con pista degradada y lupa.",
|
|
717
|
+
"files": ["components/color-slider/engine.ts", "components/color-slider/color-slider.css", "components/color-slider/README.md"],
|
|
718
|
+
"element": "components/color-slider/element.ts",
|
|
719
|
+
"react": "components/color-slider/react.tsx",
|
|
720
|
+
"since": "0.13.0"
|
|
721
|
+
},
|
|
722
|
+
"color-area": {
|
|
723
|
+
"kind": "component",
|
|
724
|
+
"description": "Área de saturación y brillo con arrastre, teclado y lupa de color.",
|
|
725
|
+
"files": ["components/color-area/engine.ts", "components/color-area/color-area.css", "components/color-area/README.md"],
|
|
726
|
+
"element": "components/color-area/element.ts",
|
|
727
|
+
"react": "components/color-area/react.tsx",
|
|
728
|
+
"since": "0.13.0"
|
|
729
|
+
},
|
|
730
|
+
"color-field": {
|
|
731
|
+
"kind": "component",
|
|
732
|
+
"description": "Campo de color que acepta hex, rgb() o hsl(), con muestra y validación.",
|
|
733
|
+
"files": ["components/color-field/engine.ts", "components/color-field/color-field.css", "components/color-field/README.md"],
|
|
734
|
+
"element": "components/color-field/element.ts",
|
|
735
|
+
"react": "components/color-field/react.tsx",
|
|
736
|
+
"since": "0.13.0"
|
|
737
|
+
},
|
|
738
|
+
"color-picker": {
|
|
739
|
+
"kind": "component",
|
|
740
|
+
"description": "Selector de color que crece desde su muestra: área, tono, opacidad, código, guardados y cuentagotas.",
|
|
741
|
+
"files": ["components/color-picker/engine.ts", "components/color-picker/color-picker.css", "components/color-picker/README.md"],
|
|
742
|
+
"element": "components/color-picker/element.ts",
|
|
743
|
+
"react": "components/color-picker/react.tsx",
|
|
744
|
+
"requires": [
|
|
745
|
+
"dialog",
|
|
746
|
+
"color-area",
|
|
747
|
+
"color-slider",
|
|
748
|
+
"color-field"
|
|
749
|
+
],
|
|
750
|
+
"since": "0.13.0"
|
|
751
|
+
},
|
|
752
|
+
"time-field": {
|
|
753
|
+
"kind": "component",
|
|
754
|
+
"description": "Hora por segmentos (24 h o a. m./p. m.) con dígitos que ruedan y teclado.",
|
|
755
|
+
"files": ["components/time-field/engine.ts", "components/time-field/time-field.css", "components/time-field/README.md"],
|
|
756
|
+
"element": "components/time-field/element.ts",
|
|
757
|
+
"react": "components/time-field/react.tsx",
|
|
758
|
+
"since": "0.13.0"
|
|
759
|
+
},
|
|
760
|
+
"range-calendar": {
|
|
761
|
+
"kind": "component",
|
|
762
|
+
"description": "Calendario de rango con vista previa, banda animada, días no disponibles y teclado.",
|
|
763
|
+
"files": ["components/range-calendar/engine.ts", "components/range-calendar/range-calendar.css", "components/range-calendar/README.md"],
|
|
764
|
+
"element": "components/range-calendar/element.ts",
|
|
765
|
+
"react": "components/range-calendar/react.tsx",
|
|
766
|
+
"since": "0.13.0"
|
|
767
|
+
},
|
|
768
|
+
"date-range-picker": {
|
|
769
|
+
"kind": "component",
|
|
770
|
+
"description": "Fechas de inicio y fin por segmentos con calendario de rango que crece desde su botón.",
|
|
771
|
+
"files": ["components/date-range-picker/engine.ts", "components/date-range-picker/date-range-picker.css", "components/date-range-picker/README.md"],
|
|
772
|
+
"element": "components/date-range-picker/element.ts",
|
|
773
|
+
"react": "components/date-range-picker/react.tsx",
|
|
774
|
+
"requires": [
|
|
775
|
+
"dialog",
|
|
776
|
+
"range-calendar"
|
|
777
|
+
],
|
|
778
|
+
"since": "0.13.0"
|
|
779
|
+
},
|
|
780
|
+
"tooltip": {
|
|
781
|
+
"kind": "component",
|
|
782
|
+
"description": "Información contextual que aparece al señalar o enfocar, con posición automática y flecha.",
|
|
783
|
+
"files": ["components/tooltip/engine.ts", "components/tooltip/tooltip.css", "components/tooltip/README.md"],
|
|
784
|
+
"element": "components/tooltip/element.ts",
|
|
785
|
+
"react": "components/tooltip/react.tsx",
|
|
786
|
+
"since": "0.14.0"
|
|
787
|
+
},
|
|
788
|
+
"popover": {
|
|
789
|
+
"kind": "component",
|
|
790
|
+
"description": "Panel flotante interactivo que crece desde su botón y queda anclado a él.",
|
|
791
|
+
"files": ["components/popover/engine.ts", "components/popover/popover.css", "components/popover/README.md"],
|
|
792
|
+
"element": "components/popover/element.ts",
|
|
793
|
+
"react": "components/popover/react.tsx",
|
|
794
|
+
"requires": [
|
|
795
|
+
"dialog"
|
|
796
|
+
],
|
|
797
|
+
"since": "0.14.0"
|
|
798
|
+
},
|
|
799
|
+
"loading-button": {
|
|
800
|
+
"kind": "component",
|
|
801
|
+
"description": "Botón con estados de carga, éxito y error que cambia de ancho, color e icono.",
|
|
802
|
+
"files": ["components/loading-button/engine.ts", "components/loading-button/loading-button.css", "components/loading-button/README.md"],
|
|
803
|
+
"element": "components/loading-button/element.ts",
|
|
804
|
+
"react": "components/loading-button/react.tsx",
|
|
805
|
+
"since": "0.14.0"
|
|
806
|
+
},
|
|
807
|
+
"breadcrumb": {
|
|
808
|
+
"kind": "component",
|
|
809
|
+
"description": "Ruta de navegación jerárquica que agrupa los niveles intermedios cuando falta espacio.",
|
|
810
|
+
"files": ["components/breadcrumb/engine.ts", "components/breadcrumb/breadcrumb.css", "components/breadcrumb/README.md"],
|
|
811
|
+
"element": "components/breadcrumb/element.ts",
|
|
812
|
+
"react": "components/breadcrumb/react.tsx",
|
|
813
|
+
"since": "0.14.0"
|
|
814
|
+
},
|
|
815
|
+
"empty-state": {
|
|
816
|
+
"kind": "component",
|
|
817
|
+
"description": "Estado vacío con ilustración animada, texto y acciones.",
|
|
818
|
+
"files": ["components/empty-state/engine.ts", "components/empty-state/empty-state.css", "components/empty-state/README.md"],
|
|
819
|
+
"element": "components/empty-state/element.ts",
|
|
820
|
+
"react": "components/empty-state/react.tsx",
|
|
821
|
+
"since": "0.14.0"
|
|
822
|
+
},
|
|
823
|
+
"stat-card": {
|
|
824
|
+
"kind": "component",
|
|
825
|
+
"description": "Tarjeta de KPI con cifra que cuenta, tendencia, comparativa y minigráfica.",
|
|
826
|
+
"files": ["components/stat-card/engine.ts", "components/stat-card/stat-card.css", "components/stat-card/README.md"],
|
|
827
|
+
"element": "components/stat-card/element.ts",
|
|
828
|
+
"react": "components/stat-card/react.tsx",
|
|
829
|
+
"since": "0.14.0"
|
|
830
|
+
},
|
|
831
|
+
"chart-tooltip": {
|
|
832
|
+
"kind": "component",
|
|
833
|
+
"description": "Tooltip avanzado para gráficas: guía, valores por serie, variación y fijado.",
|
|
834
|
+
"files": ["components/chart-tooltip/engine.ts", "components/chart-tooltip/chart-tooltip.css", "components/chart-tooltip/README.md"],
|
|
835
|
+
"element": "components/chart-tooltip/element.ts",
|
|
836
|
+
"react": "components/chart-tooltip/react.tsx",
|
|
837
|
+
"since": "0.14.0"
|
|
838
|
+
},
|
|
839
|
+
"multi-select": {
|
|
840
|
+
"kind": "component",
|
|
841
|
+
"description": "Selección múltiple con chips, búsqueda y lista navegable con teclado.",
|
|
842
|
+
"files": ["components/multi-select/engine.ts", "components/multi-select/multi-select.css", "components/multi-select/README.md"],
|
|
843
|
+
"element": "components/multi-select/element.ts",
|
|
844
|
+
"react": "components/multi-select/react.tsx",
|
|
845
|
+
"since": "0.14.0"
|
|
846
|
+
},
|
|
847
|
+
"tag-input": {
|
|
848
|
+
"kind": "component",
|
|
849
|
+
"description": "Entrada de etiquetas con autocompletado, validación y chips animados.",
|
|
850
|
+
"files": ["components/tag-input/engine.ts", "components/tag-input/tag-input.css", "components/tag-input/README.md"],
|
|
851
|
+
"element": "components/tag-input/element.ts",
|
|
852
|
+
"react": "components/tag-input/react.tsx",
|
|
853
|
+
"since": "0.14.0"
|
|
854
|
+
},
|
|
855
|
+
"date-time-picker": {
|
|
856
|
+
"kind": "component",
|
|
857
|
+
"description": "Fecha y hora en un solo campo por segmentos, con calendario y hora en un panel.",
|
|
858
|
+
"files": ["components/date-time-picker/engine.ts", "components/date-time-picker/date-time-picker.css", "components/date-time-picker/README.md"],
|
|
859
|
+
"element": "components/date-time-picker/element.ts",
|
|
860
|
+
"react": "components/date-time-picker/react.tsx",
|
|
861
|
+
"requires": [
|
|
862
|
+
"dialog",
|
|
863
|
+
"range-calendar",
|
|
864
|
+
"time-field"
|
|
865
|
+
],
|
|
866
|
+
"since": "0.14.0"
|
|
867
|
+
},
|
|
868
|
+
"filter-builder": {
|
|
869
|
+
"kind": "component",
|
|
870
|
+
"description": "Constructor de filtros con condiciones y grupos combinados con Y/O.",
|
|
871
|
+
"files": ["components/filter-builder/engine.ts", "components/filter-builder/filter-builder.css", "components/filter-builder/README.md"],
|
|
872
|
+
"element": "components/filter-builder/element.ts",
|
|
873
|
+
"react": "components/filter-builder/react.tsx",
|
|
874
|
+
"requires": [
|
|
875
|
+
"select"
|
|
876
|
+
],
|
|
877
|
+
"since": "0.14.0"
|
|
878
|
+
},
|
|
879
|
+
"timeline": {
|
|
880
|
+
"kind": "component",
|
|
881
|
+
"description": "Historial de actividades, cambios y eventos con una línea que se dibuja.",
|
|
882
|
+
"files": ["components/timeline/engine.ts", "components/timeline/timeline.css", "components/timeline/README.md"],
|
|
883
|
+
"element": "components/timeline/element.ts",
|
|
884
|
+
"react": "components/timeline/react.tsx",
|
|
885
|
+
"since": "0.14.0"
|
|
886
|
+
},
|
|
887
|
+
"activity-feed": {
|
|
888
|
+
"kind": "component",
|
|
889
|
+
"description": "Registro de acciones de usuarios agrupado por día, con novedades en vivo.",
|
|
890
|
+
"files": ["components/activity-feed/engine.ts", "components/activity-feed/activity-feed.css", "components/activity-feed/README.md"],
|
|
891
|
+
"element": "components/activity-feed/element.ts",
|
|
892
|
+
"react": "components/activity-feed/react.tsx",
|
|
893
|
+
"since": "0.14.0"
|
|
894
|
+
},
|
|
895
|
+
"tree-view": {
|
|
896
|
+
"kind": "component",
|
|
897
|
+
"description": "Jerarquía con nodos expandibles, casillas de tres estados y búsqueda.",
|
|
898
|
+
"files": ["components/tree-view/engine.ts", "components/tree-view/tree-view.css", "components/tree-view/README.md"],
|
|
899
|
+
"element": "components/tree-view/element.ts",
|
|
900
|
+
"react": "components/tree-view/react.tsx",
|
|
901
|
+
"since": "0.14.0"
|
|
902
|
+
},
|
|
903
|
+
"file-explorer": {
|
|
904
|
+
"kind": "component",
|
|
905
|
+
"description": "Explorador de carpetas y archivos con árbol, ruta, vistas y acciones.",
|
|
906
|
+
"files": ["components/file-explorer/engine.ts", "components/file-explorer/file-explorer.css", "components/file-explorer/README.md"],
|
|
907
|
+
"element": "components/file-explorer/element.ts",
|
|
908
|
+
"react": "components/file-explorer/react.tsx",
|
|
909
|
+
"requires": [
|
|
910
|
+
"tree-view",
|
|
911
|
+
"breadcrumb"
|
|
912
|
+
],
|
|
913
|
+
"since": "0.14.0"
|
|
914
|
+
},
|
|
915
|
+
"json-viewer": {
|
|
916
|
+
"kind": "component",
|
|
917
|
+
"description": "Visor de JSON con nodos expandibles, tipos, búsqueda y copia.",
|
|
918
|
+
"files": ["components/json-viewer/engine.ts", "components/json-viewer/json-viewer.css", "components/json-viewer/README.md"],
|
|
919
|
+
"element": "components/json-viewer/element.ts",
|
|
920
|
+
"react": "components/json-viewer/react.tsx",
|
|
921
|
+
"requires": [
|
|
922
|
+
"tree-view"
|
|
923
|
+
],
|
|
924
|
+
"since": "0.14.0"
|
|
925
|
+
},
|
|
926
|
+
"virtual-list": {
|
|
927
|
+
"kind": "component",
|
|
928
|
+
"description": "Lista virtual que dibuja solo lo visible de miles de elementos.",
|
|
929
|
+
"files": ["components/virtual-list/engine.ts", "components/virtual-list/virtual-list.css", "components/virtual-list/README.md"],
|
|
930
|
+
"element": "components/virtual-list/element.ts",
|
|
931
|
+
"react": "components/virtual-list/react.tsx",
|
|
932
|
+
"since": "0.14.0"
|
|
933
|
+
},
|
|
934
|
+
"resizable-panel": {
|
|
935
|
+
"kind": "component",
|
|
936
|
+
"description": "Paneles que se ajustan arrastrando divisores, con teclado y colapso.",
|
|
937
|
+
"files": ["components/resizable-panel/engine.ts", "components/resizable-panel/resizable-panel.css", "components/resizable-panel/README.md"],
|
|
938
|
+
"element": "components/resizable-panel/element.ts",
|
|
939
|
+
"react": "components/resizable-panel/react.tsx",
|
|
940
|
+
"since": "0.14.0"
|
|
941
|
+
},
|
|
942
|
+
"split-view": {
|
|
943
|
+
"kind": "component",
|
|
944
|
+
"description": "Dos áreas de trabajo con divisor, orientación y tamaño configurables.",
|
|
945
|
+
"files": ["components/split-view/engine.ts", "components/split-view/split-view.css", "components/split-view/README.md"],
|
|
946
|
+
"element": "components/split-view/element.ts",
|
|
947
|
+
"react": "components/split-view/react.tsx",
|
|
948
|
+
"requires": [
|
|
949
|
+
"resizable-panel"
|
|
950
|
+
],
|
|
951
|
+
"since": "0.14.0"
|
|
952
|
+
},
|
|
953
|
+
"data-table": {
|
|
954
|
+
"kind": "component",
|
|
955
|
+
"description": "Tabla de datos con orden, filtros, selección, paginación, acciones y columnas configurables.",
|
|
956
|
+
"files": ["components/data-table/engine.ts", "components/data-table/data-table.css", "components/data-table/README.md"],
|
|
957
|
+
"element": "components/data-table/element.ts",
|
|
958
|
+
"react": "components/data-table/react.tsx",
|
|
959
|
+
"requires": [
|
|
960
|
+
"pagination",
|
|
961
|
+
"menu",
|
|
962
|
+
"popover",
|
|
963
|
+
"empty-state"
|
|
964
|
+
],
|
|
965
|
+
"since": "0.14.0"
|
|
966
|
+
},
|
|
967
|
+
"editable-table": {
|
|
968
|
+
"kind": "component",
|
|
969
|
+
"description": "Tabla con edición de celdas, validación y guardado de cambios.",
|
|
970
|
+
"files": ["components/editable-table/engine.ts", "components/editable-table/editable-table.css", "components/editable-table/README.md"],
|
|
971
|
+
"element": "components/editable-table/element.ts",
|
|
972
|
+
"react": "components/editable-table/react.tsx",
|
|
973
|
+
"requires": [
|
|
974
|
+
"data-table",
|
|
975
|
+
"menu",
|
|
976
|
+
"select"
|
|
977
|
+
],
|
|
978
|
+
"since": "0.14.0"
|
|
979
|
+
},
|
|
980
|
+
"rich-text-editor": {
|
|
981
|
+
"kind": "component",
|
|
982
|
+
"description": "Editor de texto enriquecido con barra de formato, atajos y pegado limpio.",
|
|
983
|
+
"files": ["components/rich-text-editor/engine.ts", "components/rich-text-editor/rich-text-editor.css", "components/rich-text-editor/README.md"],
|
|
984
|
+
"element": "components/rich-text-editor/element.ts",
|
|
985
|
+
"react": "components/rich-text-editor/react.tsx",
|
|
986
|
+
"since": "0.14.0"
|
|
987
|
+
},
|
|
988
|
+
"select": {
|
|
989
|
+
"kind": "component",
|
|
990
|
+
"description": "Selector que abre el menú del kit desde su botón en vez de la lista del sistema; mejora un <select> y lo mantiene sincronizado.",
|
|
991
|
+
"files": ["components/select/engine.ts", "components/select/select.css", "components/select/README.md"],
|
|
992
|
+
"element": "components/select/element.ts",
|
|
993
|
+
"react": "components/select/react.tsx",
|
|
994
|
+
"requires": [
|
|
995
|
+
"menu"
|
|
996
|
+
],
|
|
997
|
+
"since": "0.15.0"
|
|
998
|
+
},
|
|
999
|
+
"add-to-cart": {
|
|
1000
|
+
"kind": "component",
|
|
1001
|
+
"description": "Agregar al carrito: el producto se empaca en una caja que vuela en arco hasta el carrito, que rebota y cuenta.",
|
|
1002
|
+
"files": ["components/add-to-cart/engine.ts", "components/add-to-cart/add-to-cart.css", "components/add-to-cart/README.md"],
|
|
1003
|
+
"element": "components/add-to-cart/element.ts",
|
|
1004
|
+
"react": "components/add-to-cart/react.tsx",
|
|
1005
|
+
"since": "0.15.0"
|
|
1006
|
+
},
|
|
1007
|
+
"scroll-island": {
|
|
1008
|
+
"kind": "component",
|
|
1009
|
+
"description": "Barra de desplazamiento tipo isla: fina al desplazarse y, al acercar el puntero, una píldora con la posición y la sección que se arrastra.",
|
|
1010
|
+
"files": ["components/scroll-island/engine.ts", "components/scroll-island/scroll-island.css", "components/scroll-island/README.md"],
|
|
1011
|
+
"element": "components/scroll-island/element.ts",
|
|
1012
|
+
"react": "components/scroll-island/react.tsx",
|
|
1013
|
+
"since": "0.15.0"
|
|
1014
|
+
},
|
|
1015
|
+
"pill-button": {
|
|
1016
|
+
"kind": "component",
|
|
1017
|
+
"description": "Botón píldora cuyo fondo se reúne alrededor del icono al pasar el puntero, enfocar o tocar.",
|
|
1018
|
+
"files": ["components/pill-button/engine.ts", "components/pill-button/pill-button.css", "components/pill-button/README.md"],
|
|
1019
|
+
"element": "components/pill-button/element.ts",
|
|
1020
|
+
"react": "components/pill-button/react.tsx",
|
|
1021
|
+
"since": "0.15.0"
|
|
1022
|
+
},
|
|
1023
|
+
"toolbar": {
|
|
1024
|
+
"kind": "component",
|
|
1025
|
+
"description": "Barra de herramientas con selector elástico tipo slime, etiquetas flotantes y navegación con flechas.",
|
|
1026
|
+
"files": ["components/toolbar/engine.ts", "components/toolbar/toolbar.css", "components/toolbar/README.md"],
|
|
1027
|
+
"element": "components/toolbar/element.ts",
|
|
1028
|
+
"react": "components/toolbar/react.tsx",
|
|
1029
|
+
"since": "0.15.0"
|
|
1030
|
+
},
|
|
1031
|
+
"bidirectional-slider": {
|
|
1032
|
+
"kind": "component",
|
|
1033
|
+
"description": "Control de volumen o balance con relleno desde un origen, burbuja animada y teclado nativo.",
|
|
1034
|
+
"files": ["components/bidirectional-slider/engine.ts", "components/bidirectional-slider/bidirectional-slider.css", "components/bidirectional-slider/README.md"],
|
|
1035
|
+
"element": "components/bidirectional-slider/element.ts",
|
|
1036
|
+
"react": "components/bidirectional-slider/react.tsx",
|
|
1037
|
+
"since": "0.15.0"
|
|
1038
|
+
},
|
|
1039
|
+
"voice-dots": {
|
|
1040
|
+
"kind": "component",
|
|
1041
|
+
"description": "Puntos que respiran, escuchan, piensan y hablan; pueden seguir el nivel real de una fuente de audio.",
|
|
1042
|
+
"files": ["components/voice-dots/engine.ts", "components/voice-dots/voice-dots.css", "components/voice-dots/README.md"],
|
|
1043
|
+
"element": "components/voice-dots/element.ts",
|
|
1044
|
+
"react": "components/voice-dots/react.tsx",
|
|
1045
|
+
"since": "0.15.0"
|
|
1046
|
+
},
|
|
1047
|
+
"pie-chart": {
|
|
1048
|
+
"kind": "component",
|
|
1049
|
+
"description": "Gráfica circular o donut con entrada de barrido, selección expansiva y total animado.",
|
|
1050
|
+
"files": ["components/chart/chart.css", "components/pie-chart/engine.ts", "components/pie-chart/pie-chart.css", "components/pie-chart/README.md"],
|
|
1051
|
+
"element": "components/pie-chart/element.ts",
|
|
1052
|
+
"react": "components/pie-chart/react.tsx",
|
|
1053
|
+
"since": "0.15.0"
|
|
1054
|
+
},
|
|
1055
|
+
"radar-chart": {
|
|
1056
|
+
"kind": "component",
|
|
1057
|
+
"description": "Perfiles sobre ejes radiales con áreas rellenas, transición de datos y selección por eje.",
|
|
1058
|
+
"files": ["components/chart/chart.css", "components/radar-chart/engine.ts", "components/radar-chart/radar-chart.css", "components/radar-chart/README.md"],
|
|
1059
|
+
"element": "components/radar-chart/element.ts",
|
|
1060
|
+
"react": "components/radar-chart/react.tsx",
|
|
1061
|
+
"since": "0.15.0"
|
|
1062
|
+
},
|
|
1063
|
+
"radial-chart": {
|
|
1064
|
+
"kind": "component",
|
|
1065
|
+
"description": "Totales en anillos concéntricos o medidor con extremos redondeados y avance animado.",
|
|
1066
|
+
"files": ["components/chart/chart.css", "components/radial-chart/engine.ts", "components/radial-chart/radial-chart.css", "components/radial-chart/README.md"],
|
|
1067
|
+
"element": "components/radial-chart/element.ts",
|
|
1068
|
+
"react": "components/radial-chart/react.tsx",
|
|
1069
|
+
"since": "0.15.0"
|
|
1070
|
+
},
|
|
1071
|
+
"sankey-chart": {
|
|
1072
|
+
"kind": "component",
|
|
1073
|
+
"description": "Flujos entre etapas con enlaces proporcionales a su valor, entrada escalonada y selección de recorridos.",
|
|
1074
|
+
"files": ["components/chart/chart.css", "components/sankey-chart/engine.ts", "components/sankey-chart/sankey-chart.css", "components/sankey-chart/README.md"],
|
|
1075
|
+
"element": "components/sankey-chart/element.ts",
|
|
1076
|
+
"react": "components/sankey-chart/react.tsx",
|
|
1077
|
+
"since": "0.15.0"
|
|
1078
|
+
},
|
|
1079
|
+
"heatmap-chart": {
|
|
1080
|
+
"kind": "component",
|
|
1081
|
+
"description": "Calendario de actividad tipo GitHub con intensidad por día, tooltips y desplazamiento horizontal.",
|
|
1082
|
+
"files": ["components/chart/chart.css", "components/heatmap-chart/engine.ts", "components/heatmap-chart/heatmap-chart.css", "components/heatmap-chart/README.md"],
|
|
1083
|
+
"element": "components/heatmap-chart/element.ts",
|
|
1084
|
+
"react": "components/heatmap-chart/react.tsx",
|
|
1085
|
+
"since": "0.15.0"
|
|
1086
|
+
},
|
|
1087
|
+
"orbit-menu": {
|
|
1088
|
+
"kind": "component",
|
|
1089
|
+
"description": "Menú central que despliega acciones en cruz o círculo con giro, desenfoque y resorte.",
|
|
1090
|
+
"files": ["components/orbit-menu/engine.ts", "components/orbit-menu/orbit-menu.css", "components/orbit-menu/README.md"],
|
|
1091
|
+
"element": "components/orbit-menu/element.ts",
|
|
1092
|
+
"react": "components/orbit-menu/react.tsx",
|
|
1093
|
+
"since": "0.15.0"
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
}
|