Theming y textos

Labels — todo el copy es reemplazable

Todo el texto visible fluye por un solo objeto, UploaderLabels. El inglés es el default; el español viene como ES_LABELS. El idioma se elige una sola vez en la raíz:

import { UploaderProvider } from 'uploaderkit/react'

;<UploaderProvider language='es'>
	<App />
</UploaderProvider>

Cualquier override parcial gana sobre esa base, por componente o por hook:

<Uploader {...props} labels={{ dropPrompt: 'Suelta aquí tu factura' }} />

El copy llega más lejos que los componentes

El objeto no es solo para el markup: también redacta los mensajes de validación y las respuestas HTTP del servidor, que es lo que evita que un mismo rechazo llegue en dos idiomas:

import { ES_LABELS, validateForScope } from 'uploaderkit'

const result = await validateForScope(scopes, 'facturas', file, ES_LABELS)
// result.message viene en español

En el servidor una sola opción cubre todo el round trip: createStorage resuelve el copy y lo republica como storage.labels, que es justo de donde leen createExpressStorageHandlers y createNextStorageHandlers. Una ruta no puede responder en un idioma distinto al del servicio que tiene detrás.

import { ES_LABELS } from 'uploaderkit'

const storage = createStorage({ scopes, provider, labels: ES_LABELS })
// 401 → "No autorizado"; una subida rechazada → el mismo texto 422 que vio el browser

ScopeError es la excepción, a propósito: señala un error de cableado, se queda en inglés y nunca se serializa a un cliente.

Ver UploaderLabels para la lista completa de keys.

Theming

La capa con estilos lee variables CSS --color-ui-* / --radius-ui*, declaradas con defaults en tailwind.css. Una app re-brandea toda la capa con estilos con un solo override:

:root {
	--color-ui-primary: #c41e3a;
	--color-ui-primary-hover: #8b1529;
	--radius-ui: 0.25rem;
}

El override escopa como cualquier variable CSS: ponlo en un div wrapper para re-brandear un solo uploader en vez de toda la app.

El motion viene con los componentes: las filas animan al entrar (--animate-ui-fade-in), el visor y el diálogo de confirmación hacen fade/scale al entrar y salir, el drag levanta la zona y la presión la comprime, y el indicador del slot pulsa mientras sube. Todo es CSS — nada que configurar, y sobreescribible desde la app para prefers-reduced-motion.

Dropzone, FileItem y FileViewer se exportan por separado para armar otro acomodo con las mismas piezas.