@studiolxd/brand 42.0.0 → 44.0.0

package/dist/_types/molecules/DatePicker/DatePicker.d.ts

@@ -1,6 +1,38 @@
 import type { CalendarProps } from '../Calendar/Calendar';
 import { type DateMaskLetters } from './dateMask';
 import './DatePicker.css';
+/**
+ * El cromo del selector de fecha: el botón que abre el calendario, el aviso de
+ * fecha incompleta, el nombre del panel y **las letras de la máscara**.
+ *
+ * Las letras están aquí a propósito, y son el caso interesante de esta
+ * familia. `dd/mm/aaaa` tiene dos mitades que no se deciden igual:
+ *
+ * - **El orden y el separador son formato**: que `es` escriba 25/09/2026,
+ *   `en-US` 09/25/2026 y `de` 25.09.2026 sale del `locale` con `Intl`
+ *   (`dateMask.ts`), no de una prop ni del catálogo. Una app en inglés
+ *   mostrando fechas españolas las quiere en orden español.
+ * - **Las letras son idioma**: `aaaa` es «año», `yyyy` es *year* y `jjjj` es
+ *   *Jahr*. Son la abreviatura de una palabra, así que se traducen — y por eso
+ *   son cromo y salen del catálogo, como cualquier otro rótulo.
+ *
+ * Por eso el catálogo trae solo las tres letras y no la máscara montada: la
+ * máscara la arma el componente poniendo las letras en el orden del locale.
+ */
+export interface DatePickerMessages {
+    /** Nombre accesible del botón que abre el calendario. */
+    openCalendar: string;
+    /** Aviso de fecha incompleta o inexistente, anunciado con `role="alert"`. */
+    invalid: string;
+    /** Nombre accesible del panel del calendario (`role="dialog"`). */
+    calendar: string;
+    /**
+     * Las letras de la máscara, una por parte: `{ day: 'dd', month: 'mm',
+     * year: 'aaaa' }`. El orden y el separador NO están aquí: salen del
+     * `locale`.
+     */
+    maskLetters: DateMaskLetters;
+}
 export interface DatePickerProps {
     value?: Date | null;
     /**
@@ -9,23 +41,28 @@ export interface DatePickerProps {
      */
     onChange?: (date: Date | null) => void;
     /**
-     * Pista dentro del campo. Por defecto, la máscara del locale con las letras
-     * castellanas (`dd/mm/aaaa`, `mm/dd/aaaa` en `en-US`). Una app multiidioma
-     * pasa `maskLetters` para traducir las letras sin tocar el orden.
+     * Pista dentro del campo. Sin ella, la máscara del locale con las letras
+     * del catálogo (`dd/mm/aaaa`, `mm/dd/aaaa` en `en-US`). Es la anulación
+     * puntual: un campo que quiere decir otra cosa («Desde») la pasa.
      */
     placeholder?: string;
     /**
-     * Letras de la máscara del marcador de posición. Default castellano
-     * (`{ day: 'dd', month: 'mm', year: 'aaaa' }`). El orden y el separador no
-     * son props: salen del `locale` con `Intl`.
+     * Letras de la máscara del marcador de posición. **Sin default**: sin
+     * ellas, salen de `datePicker.maskLetters` del `BrandMessagesProvider`. El
+     * orden y el separador no son props ni catálogo: salen del `locale` con
+     * `Intl`.
      */
     maskLetters?: DateMaskLetters;
     /**
-     * Mensaje cuando lo escrito no es una fecha completa y válida. Default
-     * castellano; se anuncia con `role="alert"`.
+     * Mensaje cuando lo escrito no es una fecha completa y válida. **Sin
+     * default**: sin él, sale de `datePicker.invalid` del
+     * `BrandMessagesProvider`; se anuncia con `role="alert"`.
      */
     invalidMessage?: string;
-    /** Nombre accesible del botón que abre el calendario. Default castellano. */
+    /**
+     * Nombre accesible del botón que abre el calendario. **Sin default**: sin
+     * él, sale de `datePicker.openCalendar` del `BrandMessagesProvider`.
+     */
     openCalendarLabel?: string;
     minDate?: CalendarProps['minDate'];
     maxDate?: CalendarProps['maxDate'];
@@ -43,29 +80,22 @@ export interface DatePickerProps {
     'aria-describedby'?: string;
     /** Nombre accesible cuando el control va suelto. En un campo lo nombra la etiqueta. */
     'aria-label'?: string;
-    /** Nombre accesible del panel del calendario (`role="dialog"`). */
-    calendarLabel?: string;
     /**
-     * aria-label del botón de mes anterior del calendario. Default: «Mes
-     * anterior» (castellano). Una app multiidioma debe pasarla traducida.
+     * Nombre accesible del panel del calendario (`role="dialog"`). **Sin
+     * default**: sin él, sale de `datePicker.calendar` del
+     * `BrandMessagesProvider`. En un campo lo pone la etiqueta del campo, que es
+     * contenido de la pantalla y gana como cualquier prop.
      */
+    calendarLabel?: string;
+    /** aria-label del botón de mes anterior. Sin él, `calendar.previousMonth`. */
     previousMonthLabel?: CalendarProps['previousMonthLabel'];
-    /**
-     * aria-label del botón de mes siguiente. Default: «Mes siguiente»
-     * (castellano).
-     */
+    /** aria-label del botón de mes siguiente. Sin él, `calendar.nextMonth`. */
     nextMonthLabel?: CalendarProps['nextMonthLabel'];
-    /**
-     * aria-label del botón de retroceso **en la vista de años**. Default: «Años
-     * anteriores» (castellano).
-     */
+    /** aria-label del retroceso en la vista de años. Sin él, `calendar.previousYears`. */
     previousYearsLabel?: CalendarProps['previousYearsLabel'];
-    /**
-     * aria-label del botón de avance en la vista de años. Default: «Años
-     * siguientes» (castellano).
-     */
+    /** aria-label del avance en la vista de años. Sin él, `calendar.nextYears`. */
     nextYearsLabel?: CalendarProps['nextYearsLabel'];
-    /** aria-label de la rejilla de años. Default: «Elegir año» (castellano). */
+    /** aria-label de la rejilla de años. Sin él, `calendar.yearGrid`. */
     yearGridLabel?: CalendarProps['yearGridLabel'];
     /**
      * aria-label de la rejilla de días. Por defecto toma `calendarLabel`, que ya

package/dist/_types/molecules/DatePicker/dateMask.d.ts

@@ -1,11 +1,18 @@
 export type DatePartName = 'day' | 'month' | 'year';
-/** Letras de la máscara del marcador de posición: `dd/mm/aaaa` en castellano. */
+/**
+ * Letras de la máscara del marcador de posición, una por parte.
+ *
+ * **No hay juego por defecto, y es deliberado**: las letras se traducen
+ * (`aaaa` es «año», `yyyy` es *year*, `jjjj` es *Jahr*), así que salen del
+ * catálogo de la aplicación —`datePicker.maskLetters`— igual que cualquier
+ * otro rótulo. Lo que este módulo decide es el **orden** y el **separador**,
+ * que son formato y salen del `locale`.
+ */
 export interface DateMaskLetters {
     day: string;
     month: string;
     year: string;
 }
-export declare const SPANISH_MASK_LETTERS: DateMaskLetters;
 export interface DateMask {
     /** Orden de las partes en ese locale, p. ej. `['day', 'month', 'year']`. */
     order: DatePartName[];

package/dist/_types/molecules/DateTimeField/DateTimeField.d.ts

@@ -33,29 +33,29 @@ export interface DateTimeFieldProps {
     locale?: string;
     /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
     className?: string;
-    /** Nombre accesible del panel del calendario. Default: la etiqueta del campo. */
+    /** Nombre accesible del panel del calendario. Sin él, la etiqueta del campo. */
     calendarLabel?: DatePickerProps['calendarLabel'];
-    /** Nombre accesible del botón que abre el calendario. Default castellano. */
+    /** Nombre accesible del botón que abre el calendario. Sin él, `datePicker.openCalendar`. */
     openCalendarLabel?: DatePickerProps['openCalendarLabel'];
-    /** Mensaje de fecha incompleta del campo de texto. Default castellano. */
+    /** Mensaje de fecha incompleta del campo de texto. Sin él, `datePicker.invalid`. */
     invalidMessage?: DatePickerProps['invalidMessage'];
-    /** Letras de la máscara del marcador de posición. Default castellano. */
+    /** Letras de la máscara del marcador de posición. Sin ellas, `datePicker.maskLetters`. */
     maskLetters?: DatePickerProps['maskLetters'];
-    /** aria-label del botón de mes anterior del calendario. Default castellano. */
+    /** aria-label del botón de mes anterior. Sin él, `calendar.previousMonth`. */
     previousMonthLabel?: DatePickerProps['previousMonthLabel'];
-    /** aria-label del botón de mes siguiente. Default castellano. */
+    /** aria-label del botón de mes siguiente. Sin él, `calendar.nextMonth`. */
     nextMonthLabel?: DatePickerProps['nextMonthLabel'];
-    /** aria-label del botón de retroceso en la vista de años. Default castellano. */
+    /** aria-label del retroceso en la vista de años. Sin él, `calendar.previousYears`. */
     previousYearsLabel?: DatePickerProps['previousYearsLabel'];
-    /** aria-label del botón de avance en la vista de años. Default castellano. */
+    /** aria-label del avance en la vista de años. Sin él, `calendar.nextYears`. */
     nextYearsLabel?: DatePickerProps['nextYearsLabel'];
-    /** aria-label de la rejilla de años. Default castellano. */
+    /** aria-label de la rejilla de años. Sin él, `calendar.yearGrid`. */
     yearGridLabel?: DatePickerProps['yearGridLabel'];
-    /** aria-label de la rejilla de días. Default: `calendarLabel`. */
+    /** aria-label de la rejilla de días. Sin él, el nombre del panel. */
     gridLabel?: DatePickerProps['gridLabel'];
-    /** aria-label del desplegable de horas. Default: "Horas" (castellano). */
+    /** aria-label del desplegable de horas. Sin él, `timeSelect.hours`. */
     hoursLabel?: string;
-    /** aria-label del desplegable de minutos. Default: "Minutos" (castellano). */
+    /** aria-label del desplegable de minutos. Sin él, `timeSelect.minutes`. */
     minutesLabel?: string;
     onChange?: (date: Date | null) => void;
     /** Se llama al salir de cualquiera de los dos controles: el campo de fecha (un `<input>`) o los desplegables de hora (dos `<button>`). */

package/dist/_types/molecules/ImageCropDialog/ImageCropDialog.d.ts

@@ -1,6 +1,25 @@
 import { type ReactNode } from 'react';
 import 'react-image-crop/dist/ReactCrop.css';
 import './ImageCropDialog.css';
+/**
+ * El cromo del recortador, y **solo el cromo**: lo que el diálogo dice por su
+ * cuenta mientras la imagen va y viene.
+ *
+ * Aquí se ve la distinción que gobierna la campaña entera. El título, el
+ * «Cancelar» y el «Guardar» **no** están en este espacio y siguen siendo props
+ * obligatorias sin valor por defecto: el diálogo no sabe qué se está
+ * recortando —una foto de perfil, un logo, la portada de un curso— ni qué pasa
+ * al confirmar, y eso es contenido de la pantalla que lo abre, no un rótulo
+ * del sistema. Lo que sí sabe es que la imagen puede tardar y puede fallar: el
+ * aviso de carga y el de error son suyos, valen igual en todas las pantallas y
+ * por eso salen del catálogo.
+ */
+export interface ImageCropDialogMessages {
+    /** Lo que se dice mientras la imagen se descarga y descodifica. Se anuncia y se ve. */
+    loading: string;
+    /** Lo que se dice cuando la imagen no se puede cargar. */
+    error: string;
+}
 export interface ImageCropDialogProps {
     /** Object URL del fichero elegido; el diálogo está abierto mientras no sea null. */
     sourceUrl: string | null;
@@ -16,16 +35,21 @@ export interface ImageCropDialogProps {
     busy?: boolean;
     cancelLabel: ReactNode;
     confirmLabel: ReactNode;
-    /** Etiqueta del botón de cierre del diálogo. */
+    /**
+     * Etiqueta del botón de cierre del diálogo. Se reenvía **tal cual** al
+     * `Modal`, que todavía no lee del proveedor: mientras no se migre, sin esta
+     * prop el aspa sigue diciendo lo que diga `Modal`.
+     */
     closeLabel?: string;
     /**
      * Lo que se dice mientras la imagen se descarga y descodifica. Se anuncia y
-     * se ve. Default castellano: «Cargando imagen…».
+     * se ve. **Sin default**: sin él, sale de `imageCropDialog.loading` del
+     * `BrandMessagesProvider`.
      */
     loadingLabel?: string;
     /**
-     * Lo que se dice cuando la imagen no se puede cargar. Default castellano:
-     * «No hemos podido cargar la imagen. Prueba con otro archivo.».
+     * Lo que se dice cuando la imagen no se puede cargar. **Sin default**: sin
+     * él, sale de `imageCropDialog.error` del `BrandMessagesProvider`.
      */
     errorMessage?: string;
     onConfirm: (blob: Blob) => void | Promise<void>;

package/dist/_types/molecules/TimeField/TimeField.d.ts

@@ -29,9 +29,16 @@ export interface TimeFieldProps {
     helperText?: string;
     /** Se añade DESPUÉS de las clases propias (el consumidor añade, no sustituye). */
     className?: string;
-    /** aria-label del desplegable de horas. Default: "Horas" (castellano). */
+    /**
+     * aria-label del desplegable de horas. **Sin default**: sin él, el texto
+     * sale de `timeSelect.hours` del `BrandMessagesProvider`, que el
+     * `TimeSelect` de dentro lee por contexto.
+     */
     hoursLabel?: string;
-    /** aria-label del desplegable de minutos. Default: "Minutos" (castellano). */
+    /**
+     * aria-label del desplegable de minutos. **Sin default**: sin él, sale de
+     * `timeSelect.minutes` del `BrandMessagesProvider`.
+     */
     minutesLabel?: string;
     onChange?: (value: TimeValue) => void;
     onBlur?: React.FocusEventHandler<HTMLButtonElement>;

package/dist/_types/molecules/_shared/calendarGrid.d.ts

@@ -51,10 +51,14 @@ export interface CalendarMonthNavOptions {
     /**
      * Nombre accesible del botón de retroceso. Depende de la vista: «Mes
      * anterior» sobre la rejilla de días, «Años anteriores» sobre la de años.
+     *
+     * Opcional porque sin `navigable` no se pinta ningún botón: quien la monta
+     * lee el texto de su catálogo **solo cuando hay flechas**, y un calendario
+     * estático no exige un texto que nadie va a ver.
      */
-    previousLabel: string;
+    previousLabel?: string;
     /** Nombre accesible del botón de avance, también según la vista. */
-    nextLabel: string;
+    nextLabel?: string;
     prevDisabled?: boolean;
     nextDisabled?: boolean;
     onPrev: () => void;

package/dist/avatar-upload.js

@@ -1,18 +1,19 @@
 'use client';
 import './avatar-upload.css';
-import { Icon as e } from "./icon.js";
-import { VisuallyHidden as t } from "./visually-hidden.js";
-import { n } from "./_shared/form-size.js";
-import { Button as r } from "./button.js";
-import { Avatar as i } from "./avatar.js";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { VisuallyHidden as n } from "./visually-hidden.js";
+import { n as r } from "./_shared/form-size.js";
+import { Button as i } from "./button.js";
+import { Avatar as a } from "./avatar.js";
 import { ErrorText as ee } from "./error-text.js";
-import { n as te, t as a } from "./_shared/validate.js";
-import { t as ne } from "./_shared/env.js";
-import { t as re } from "./_shared/imagecropdialog.js";
-import { useCallback as ie, useEffect as o, useId as s, useRef as c, useState as l } from "react";
+import { i as te, n as ne, r as o, t as re } from "./_shared/validate.js";
+import { t as ie } from "./_shared/env.js";
+import { t as ae } from "./_shared/imagecropdialog.js";
+import { useCallback as oe, useEffect as s, useId as se, useRef as c, useState as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/stories/molecules/AvatarUpload/AvatarUpload.tsx
-var ae = {
+var ce = {
 	sm: "2xl",
 	md: "3xl",
 	lg: "4xl"
@@ -21,92 +22,94 @@ var ae = {
 	md: "lg",
 	lg: "xl"
 };
-function p(e) {
-	return e.split(",").map((e) => e.trim()).filter(Boolean).map((e) => e.startsWith(".") ? e.slice(1) : e.split("/")[1] ?? e).map((e) => e.toUpperCase()).join(", ");
+function le(e, t) {
+	return o(e.split(",").map((e) => e.trim()).filter(Boolean).map((e) => e.startsWith(".") ? e.slice(1) : e.split("/")[1] ?? e).map((e) => e.toUpperCase()), t);
 }
-function m({ src: m, name: oe, alt: h, shape: g = "circle", size: se, accept: _ = "image/jpeg,image/png,image/webp", maxSize: v, outputMimeType: y = "image/jpeg", outputSize: b, disabled: x = !1, busy: S = !1, errorMessage: ce, onChange: le, onSelect: C, onError: w, buttonLabel: T = "Subir", buttonAccessibleLabel: ue, hintLabel: de, formatsLabel: fe, maxSizeHint: pe = (e) => `máx. ${e}`, invalidTypeError: E = (e) => `Formato no admitido. Se aceptan ${e}.`, tooLargeError: D = (e) => `El archivo pesa demasiado. El máximo es ${e}.`, dropActiveMessage: me = "Suelta la imagen sobre el avatar para subirla", dropHintLabel: O = "…o arrastra la imagen hasta el avatar", cropTitle: he = "Recortar imagen", cropDescription: k, cropCancelLabel: A = "Cancelar", cropConfirmLabel: j = "Guardar", cropCloseLabel: M = "Cerrar", cropLoadingLabel: N, cropErrorMessage: P, className: F }) {
-	let I = n(se), L = c(null), R = c(null), [z, B] = l(null), [V, H] = l(!1), [ge, U] = l(!1), [_e, W] = l(null), G = s(), K = `${G}-hint`, q = `${G}-error`, J = fe ?? p(_), Y = de ?? [J, v === void 0 ? null : pe(a(v))].filter(Boolean).join(" · "), X = _e ?? ce, Z = x || S, Q = ue ?? T;
-	ne() && !Q.toLowerCase().includes(T.toLowerCase()) && console.warn(`[AvatarUpload] El nombre accesible del botón ("${Q}") no contiene su texto visible ("${T}"). WCAG 2.5.3 (Label in Name) lo exige: quien navega por voz dice lo que ve, y con estos textos no encontraría el control.`), o(() => {
-		R.current = z;
-	}, [z]), o(() => () => {
-		R.current && URL.revokeObjectURL(R.current.url);
-	}, []), o(() => {
-		if (Z) return;
+function p({ src: o, name: p, alt: m, shape: h = "circle", size: ue, accept: g = "image/jpeg,image/png,image/webp", maxSize: _, outputMimeType: de = "image/jpeg", outputSize: v, disabled: fe = !1, busy: y = !1, errorMessage: b, onChange: pe, onSelect: x, onError: S, subject: me, buttonLabel: he, buttonAccessibleLabel: ge, hintLabel: _e, formatsLabel: ve, locale: C = re, maxSizeHint: ye, invalidTypeError: w, tooLargeError: T, dropActiveMessage: be, dropHintLabel: xe, cropTitle: Se, cropDescription: Ce, cropCancelLabel: E, cropConfirmLabel: D, cropCloseLabel: O, cropLoadingLabel: k, cropErrorMessage: A, className: we }) {
+	let j = e("avatarUpload"), M = r(ue), N = c(null), P = c(null), [F, I] = l(null), [L, R] = l(!1), [z, B] = l(!1), [Te, V] = l(null), H = se(), U = `${H}-hint`, W = `${H}-error`, G = j("subject", me), K = ve ?? le(g, C), q = _e ?? [K, _ === void 0 ? null : j("maxSize", ye)(ne(_, C))].filter(Boolean).join(" · "), J = Te ?? b, Y = fe || y, X = j("button", he), Z = ge ?? j("buttonFor")(G);
+	ie() && !Z.toLowerCase().includes(X.toLowerCase()) && console.warn(`[AvatarUpload] El nombre accesible del botón ("${Z}") no contiene su texto visible ("${X}"). WCAG 2.5.3 (Label in Name) lo exige: quien navega por voz dice lo que ve, y con estos textos no encontraría el control.`), s(() => {
+		P.current = F;
+	}, [F]), s(() => () => {
+		P.current && URL.revokeObjectURL(P.current.url);
+	}, []), s(() => {
+		if (Y) return;
 		let e = 0, t = (e) => Array.from(e.dataTransfer?.types ?? []).includes("Files"), n = (n) => {
-			t(n) && (e += 1, H(!0));
+			t(n) && (e += 1, R(!0));
 		}, r = () => {
-			e = Math.max(0, e - 1), e === 0 && H(!1);
+			e = Math.max(0, e - 1), e === 0 && R(!1);
 		}, i = () => {
-			e = 0, H(!1);
+			e = 0, R(!1);
 		};
 		return window.addEventListener("dragenter", n), window.addEventListener("dragleave", r), window.addEventListener("drop", i), window.addEventListener("dragend", i), () => {
-			window.removeEventListener("dragenter", n), window.removeEventListener("dragleave", r), window.removeEventListener("drop", i), window.removeEventListener("dragend", i), H(!1);
+			window.removeEventListener("dragenter", n), window.removeEventListener("dragleave", r), window.removeEventListener("drop", i), window.removeEventListener("dragend", i), R(!1);
 		};
-	}, [Z]);
-	let $ = ie((e) => {
-		let t = te(e, _, v, D, E(J));
+	}, [Y]);
+	let Q = oe((e) => {
+		let t = te(e, g, _, j("tooLarge", T), j("invalidType", w)(K), C);
 		if (t) {
-			W(t), w?.(t);
+			V(t), S?.(t);
 			return;
 		}
-		W(null), C?.(e), B({
+		V(null), x?.(e), I({
 			url: URL.createObjectURL(e),
 			file: e
 		});
 	}, [
+		g,
 		_,
-		v,
-		D,
-		E,
-		J,
+		j,
+		T,
 		w,
-		C
-	]), ve = () => {
-		z && URL.revokeObjectURL(z.url), B(null);
-	}, ye = async (e) => {
-		z && await le(e, z.file);
-	};
+		K,
+		C,
+		S,
+		x
+	]), Ee = () => {
+		F && URL.revokeObjectURL(F.url), I(null);
+	}, De = async (e) => {
+		F && await pe(e, F.file);
+	}, $ = xe ?? j("dropHint")(G);
 	return /* @__PURE__ */ d("div", {
 		className: [
 			"avatar-upload",
-			g === "square" ? "avatar-upload--square" : "",
-			V ? "avatar-upload--armed" : "",
-			ge ? "avatar-upload--over" : "",
-			Z ? "avatar-upload--inert" : "",
-			F ?? ""
+			h === "square" ? "avatar-upload--square" : "",
+			L ? "avatar-upload--armed" : "",
+			z ? "avatar-upload--over" : "",
+			Y ? "avatar-upload--inert" : "",
+			we ?? ""
 		].filter(Boolean).join(" "),
 		children: [
 			/* @__PURE__ */ d("div", {
 				className: "avatar-upload__target",
 				onClick: () => {
-					Z || L.current?.click();
+					Y || N.current?.click();
 				},
 				onDragEnter: (e) => {
-					e.preventDefault(), Z || U(!0);
+					e.preventDefault(), Y || B(!0);
 				},
 				onDragOver: (e) => {
-					e.preventDefault(), !Z && (e.dataTransfer.dropEffect = "copy", U(!0));
+					e.preventDefault(), !Y && (e.dataTransfer.dropEffect = "copy", B(!0));
 				},
 				onDragLeave: (e) => {
-					e.currentTarget.contains(e.relatedTarget) || U(!1);
+					e.currentTarget.contains(e.relatedTarget) || B(!1);
 				},
 				onDrop: (e) => {
-					if (e.preventDefault(), U(!1), H(!1), Z) return;
+					if (e.preventDefault(), B(!1), R(!1), Y) return;
 					let t = e.dataTransfer.files?.[0];
-					t && $(t);
+					t && Q(t);
 				},
-				children: [/* @__PURE__ */ u(i, {
-					src: m ?? void 0,
-					name: oe,
-					...h === void 0 ? {} : { alt: h },
-					shape: g,
-					size: ae[I]
+				children: [/* @__PURE__ */ u(a, {
+					src: o ?? void 0,
+					name: p,
+					...m === void 0 ? {} : { alt: m },
+					shape: h,
+					size: ce[M]
 				}), /* @__PURE__ */ u("span", {
 					className: "avatar-upload__overlay",
 					"aria-hidden": "true",
-					children: /* @__PURE__ */ u(e, {
+					children: /* @__PURE__ */ u(t, {
 						name: "upload",
-						size: f[I]
+						size: f[M]
 					})
 				})]
 			}),
@@ -114,63 +117,63 @@ function m({ src: m, name: oe, alt: h, shape: g = "circle", size: se, accept: _
 				className: "avatar-upload__body",
 				children: [
 					/* @__PURE__ */ u("input", {
-						ref: L,
+						ref: N,
 						type: "file",
 						className: "avatar-upload__input",
-						accept: _,
+						accept: g,
 						tabIndex: -1,
 						"aria-hidden": "true",
-						disabled: Z,
+						disabled: Y,
 						onChange: (e) => {
 							let t = e.target.files?.[0];
-							t && $(t), e.target.value = "";
+							t && Q(t), e.target.value = "";
 						}
 					}),
-					/* @__PURE__ */ u(r, {
+					/* @__PURE__ */ u(i, {
 						variant: "outline",
-						size: I,
-						disabled: Z,
-						onClick: () => L.current?.click(),
-						...Q === T ? {} : { "aria-label": Q },
-						"aria-describedby": [Y ? K : null, X ? q : null].filter(Boolean).join(" ") || void 0,
-						children: T
+						size: M,
+						disabled: Y,
+						onClick: () => N.current?.click(),
+						...Z === X ? {} : { "aria-label": Z },
+						"aria-describedby": [q ? U : null, J ? W : null].filter(Boolean).join(" ") || void 0,
+						children: X
 					}),
-					Y && /* @__PURE__ */ u(t, {
-						id: K,
-						children: Y
+					q && /* @__PURE__ */ u(n, {
+						id: U,
+						children: q
 					}),
-					O && /* @__PURE__ */ u("span", {
+					$ && /* @__PURE__ */ u("span", {
 						className: "avatar-upload__hint",
-						children: O
+						children: $
 					}),
-					X && /* @__PURE__ */ u(ee, {
-						id: q,
-						children: X
+					J && /* @__PURE__ */ u(ee, {
+						id: W,
+						children: J
 					})
 				]
 			}),
-			/* @__PURE__ */ u(t, {
+			/* @__PURE__ */ u(n, {
 				role: "status",
-				children: V ? me : ""
+				children: L ? be ?? j("dropActive")(G) : ""
 			}),
-			/* @__PURE__ */ u(re, {
-				sourceUrl: z?.url ?? null,
-				title: he,
-				description: k,
-				circularCrop: g === "circle",
-				outputMimeType: y,
-				...b === void 0 ? {} : { outputSize: b },
-				busy: S,
-				cancelLabel: A,
-				confirmLabel: j,
-				closeLabel: M,
-				...N === void 0 ? {} : { loadingLabel: N },
-				...P === void 0 ? {} : { errorMessage: P },
-				onConfirm: ye,
-				onClose: ve
+			/* @__PURE__ */ u(ae, {
+				sourceUrl: F?.url ?? null,
+				title: Se,
+				description: Ce,
+				circularCrop: h === "circle",
+				outputMimeType: de,
+				...v === void 0 ? {} : { outputSize: v },
+				busy: y,
+				cancelLabel: E ?? j("cropCancel"),
+				confirmLabel: D ?? j("cropConfirm"),
+				...O === void 0 ? {} : { closeLabel: O },
+				...k === void 0 ? {} : { loadingLabel: k },
+				...A === void 0 ? {} : { errorMessage: A },
+				onConfirm: De,
+				onClose: Ee
 			})
 		]
 	});
 }
 //#endregion
-export { m as AvatarUpload };
+export { p as AvatarUpload };