Lógica reutilizable sin markup: confirmación, autosave, teclado, media queries, portapapeles. Un hook visual repetido en dos verticales es un hook que le falta al kit.
detectando…
Primer paint del cliente — se resuelve solo.
Angostá la ventana del navegador para verlo cambiar.
CH-2031-VELA
Reserva R-482
Los Álamos · sábado 21:00
sin cambios
Pedido #118 · 2kg dulce de leche
Pedido #119 · 1kg frutilla
Pedido #120 · 3kg surtido
calculando…
Dulce de lecheFrutillaChocolate amargo
Tripulación en línea
Desconectá el wifi de la compu para verlo cambiar en vivo.
esperando URL…easycharter.com.ar/reservas/CH-2031
12 piezas de Comportamiento que GestorSalon usa y esta galería no mostraba
Medido, no elegido: sale de cruzar los 254 símbolos del kit que aparecen en el código de GestorSalon contra los que estos especímenes montaban. Cada ficha trae el especificador de import y las props que el producto realmente le pasa.
useConfirmDialog
@solu30/ui-kit11 usos · 11 archivos
Confirmación imperativa: `confirm(opciones)` devuelve una promesa con true o false, y `ConfirmDialogPortal` se monta una vez. Es la pieza que esta galería enseñaba a reimplementar a mano en su propio espécimen de «diálogo de confirmación».
`confirm()` devuelve una promesa que resuelve `true` o `false`. Eso es lo que permite escribir la cancelación como una línea dentro del handler, en vez de partir la lógica en tres estados y dos callbacks. El portal se monta una sola vez.
useDebounce
@solu30/ui-kit/hooks1 usos · 1 archivos
El mismo valor, con retardo. Al lado del inmediato se ve para qué sirve: lo que se manda al servidor es el de abajo, lo que ve el usuario mientras escribe es el de arriba.
al instante: —con 400 ms de retardo: —
useMediaQuery
@solu30/ui-kit/hooks2 usos · 2 archivos
Cualquier media query, no sólo los breakpoints. Se suscribe y se limpia solo, y no rompe la hidratación.
Los `useIsMobile` / `useIsTablet` / `useIsDesktop` que esta galería ya mostraba son los breakpoints del sistema. Este es el escape para todo lo demás — orientación, tipo de puntero, preferencia de movimiento — sin escribir un `matchMedia` con su `addEventListener` y su limpieza a mano.
useFilteredList
@solu30/ui-kit/hooks1 usos · 1 archivos
Búsqueda sobre varios campos con rebote incluido, y un `isPending` para no mentir sobre el estado mientras el rebote corre.
4 de 4
Casamiento Off & Vera · Los Álamos · confirmada
Cumpleaños 15 · Martina · Los Álamos · señada
Aniversario 25 años · Del Bosque · confirmada
Fiesta fin de año · Zentrya · La Terraza · cancelada
useArrayEditor
@solu30/ui-kit/hooks0 usos · 6 archivos
Agregar, actualizar, quitar, mover y reemplazar sobre un arreglo controlado. Cinco operaciones que cada formulario con lista adentro reescribe, y que se escriben mal de a una.
`move` no hace nada cuando el índice se sale del arreglo — por eso «subir» en el primero es seguro aunque el botón esté deshabilitado por otra razón.
Las siete que no se demuestran en vivo, y por qué
`useConfirmDialogState` es la variante controlada del de arriba: mismo problema, con el diálogo montado por el consumidor. Los otros seis no se demuestran a propósito: `useLocalStorage` escribiría en el navegador de quien pasa por acá, `useReceptionSound` reproduciría un sonido sin que nadie lo pidiera, `useUnsavedChanges` engancha el `beforeunload` de la página entera, `useUrlTabs` y `useNavigation` necesitan el router y el proveedor de navegación de una aplicación real, y el último no es un hook: es el tipo del valor de un filtro de columna.