@ajuarezso/sui-design-system 0.25.1 → 0.26.0

package/docs/sui-day-cell/README.md

@@ -125,6 +125,16 @@ dónde sale. Si la grilla va con `sui-day-label`, la cabecera también tiene que
 | `clicked` | `MouseEvent` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `fecha.dia` | Día {n} | `ariaLabel` |
+<!-- textos:fin -->
+
 ## Trampas
 
 - **`day` es el número del día, no una fecha.** Toda la lógica (qué día es, si es hoy) la hace

package/docs/sui-drawer-footer/README.md

@@ -110,8 +110,8 @@ Igual, el par de botones va en `sui-modal-footer` (ver arriba), cuyo canon es `l
 |---|---|---|
 | `type` | `'stretch' \| 'basic' \| 'checkbox' \| 'toggle' \| 'stepper' \| 'link-button'` | `'stretch'` |
 | `size` | `'medium' \| 'large'` | `'medium'` |
-| `primaryButton` | `SuiFooterButtonConfig \| string` | `'Continuar'` |
-| `secondaryButton` | `SuiFooterButtonConfig \| string \| null` | `'Cancelar'` |
+| `primaryButton` | `SuiFooterButtonConfig \| string \| null` | `null` |
+| `secondaryButton` | `SuiFooterButtonConfig \| string \| null \| undefined` | `undefined` |
 | `checkboxLabel` | `string` | `''` |
 | `checkboxActive` · model, `[(checkboxActive)]` | `boolean` | `false` |
 | `toggleLabel` | `string` | `''` |
@@ -126,6 +126,19 @@ Igual, el par de botones va en `sui-modal-footer` (ver arriba), cuyo canon es `l
 | `linkClick` | `MouseEvent` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.progreso` | Progreso | — |
+| `comun.pasoDe` | Paso {actual} de {total} | — |
+| `comun.continuar` | Continuar | `primaryButton` |
+| `comun.cancelar` | Cancelar | `secondaryButton` (`null` lo oculta) |
+<!-- textos:fin -->
+
 ```ts
 type SuiDrawerFooterType = 'stretch' | 'basic' | 'checkbox' | 'toggle' | 'stepper' | 'link-button';
 interface SuiFooterButtonConfig { label: string; disabled?: boolean; color?: 'primary' | 'error'; }
@@ -146,6 +159,8 @@ interface SuiFooterButtonConfig { label: string; disabled?: boolean; color?: 'pr
   Para el lector es un `progressbar` «Progreso» que dice «Paso 2 de 4» (`aria-valuetext`, desde
   el 04-10-2026).
 - `checkboxActive` y `toggleActive` son `model`: `[(checkboxActive)]`.
+- `checkboxLabel` / `toggleLabel` son el nombre del control para el lector (`aria-labelledby`,
+  desde el 09-10-2026): sin texto, el checkbox o el switch queda sin nombre.
 - El borde de arriba ya viene puesto: no le sumes otro.
 
 ## Bien y mal

package/docs/sui-drawer-header/README.md

@@ -114,7 +114,7 @@ En master-pedidos: sin helper; `@if (!bp.isMobile())` alrededor y `size="large"`
 | `link` | `SuiLinkConfig \| string \| null` | `null` |
 | `showDismiss` | `boolean` | `true` |
 | `showDivider` | `boolean` | `false` |
-| `dismissAriaLabel` | `string` | `'Cerrar'` |
+| `dismissAriaLabel` | `string \| null` | `null` |
 
 | output | payload |
 |---|---|
@@ -122,6 +122,16 @@ En master-pedidos: sin helper; `@if (!bp.isMobile())` alrededor y `size="large"`
 | `linkClick` | `MouseEvent` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.cerrar` | Cerrar | `dismissAriaLabel` |
+<!-- textos:fin -->
+
 ```ts
 type SuiDrawerHeaderType = 'basic' | 'left-icon';
 type SuiDrawerHeaderSize = 'small' | 'large' | 'xlarge';

package/docs/sui-dropdown-menu/README.md

@@ -1,7 +1,7 @@
 ---
 name: sui-dropdown-menu
 selector: sui-dropdown-menu, ng-template[suiDropdownPanel]
-resumen: Menú flotante anclado a un botón (el kebab ⋮ de una card, un avatar) con acciones sobre eso; también es el overlay que usan por dentro los selects
+resumen: Menú flotante anclado a un botón (el kebab ⋮ de una card, un avatar dentro de un botón) con acciones sobre eso; también es el overlay que usan por dentro los selects
 alternativas: [sui-select (elegir un valor de un formulario), sui-modal-sheet (más de 5 acciones o una lista larga en mobile), sui-popover (explicar algo con una flecha, sin anclaje propio), sui-tooltip (ayuda corta al pasar el mouse), sui-command-menu-item (buscar y saltar con ⌘K en desktop)]
 ---
 
@@ -195,6 +195,14 @@ panel va en un `<ng-template suiDropdownPanel>` (hay que importar `SuiDropdownPa
   dentro de un modal queda detrás. La copia de la app no trae ese bloque: no se verificó en la
   app, pero es lo primero que hay que mirar si un menú «no abre» dentro de un modal.
 - El host es `display: contents`: no ocupa caja. Para alinearlo, se alinea el trigger.
+- **Accesibilidad (09-10-2026).** `aria-haspopup` y `aria-expanded` se ponen en el control que se
+  proyecta como trigger (el `<button>`, el `sui-button`, el `<button>` interno del
+  `sui-compact-button`), no en el span que lo envuelve. Si el trigger no es un botón ni un enlace
+  (un `sui-avatar` suelto, un `div` con `tabindex`), no recibe esos atributos y además no se
+  alcanza bien con teclado: envuélvelo en un botón. Sin `[origin]` y con
+  `popupRole="menu"`, el panel abierto lleva `role="menu"`; por eso un panel que mezcla items con
+  un buscador u otro campo no es un menú válido: ahí va `popupRole="true"` y los items van dentro
+  de un contenedor propio con `role="menu"`.
 
 ## Bien y mal
 

package/docs/sui-dropdown-search/README.md

@@ -53,14 +53,14 @@ para limpiar.
 
 ## Tamaño en mobile y en web
 
-No tiene tamaños: 36 px de alto (8 + 20 + 8), texto 14/20, en los dos.
+No tiene tamaños: 36 px de alto (8 + 20 + 8), texto 14/20 en web y 16 en ≤ 767 px (anti-zoom de iOS, desde 0.26.0).
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
 | buscador del menú | no se usa: `sui-modal-sheet` con `sui-input type="search"` arriba | 36, fijo | mobile: canon (aprobado por el dueño, 05-10-2026, bloque B7) y D16 (dueño 05-10-2026: lo que se toca llega a 44, y este campo mide 36) · web: lo que hay en el DS |
 
-En mobile tiene dos problemas que el componente no resuelve (ver «Trampas»): el texto de 14 px hace
-que iOS haga zoom al enfocarlo, y el teclado no muestra la lupa. Para buscar en una lista larga en
+Desde 0.26.0 el texto sube a 16 en ≤ 767 px (sin zoom de iOS) y el teclado trae la lupa
+(`enterkeyhint="search"`), pero sigue midiendo 36, bajo el piso de 44. Para buscar en una lista larga en
 mobile, mejor un `sui-modal-sheet` con `sui-input type="search"` arriba. Canon (aprobado por el dueño, 05-10-2026, bloque B7).
 
 ### Por dispositivo (D16)
@@ -82,8 +82,9 @@ En master-pedidos: `@if (bp.tactil())` → sheet con `<sui-input type="search" [
 | input | tipo | default |
 |---|---|---|
 | `value` · model, `[(value)]` | `string` | `''` |
-| `placeholder` | `string` | `'Buscar…'` |
+| `placeholder` | `string \| null` | `null` |
 | `disabled` | `boolean` | `false` |
+| `ariaLabel` | `string \| null` | `null` |
 
 | output | payload |
 |---|---|
@@ -91,6 +92,17 @@ En master-pedidos: `@if (bp.tactil())` → sheet con `<sui-input type="search" [
 | `valueChanged` | `string` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.limpiarBusqueda` | Limpiar búsqueda | — |
+| `comun.buscar` | Buscar… | `placeholder` |
+<!-- textos:fin -->
+
 `valueChanged` sale con cada tecla (lo mismo que `value`, como evento). `cleared` sale al tocar la X,
 que además deja `value` en `''`.
 
@@ -98,11 +110,10 @@ que además deja `value` en `''`.
 
 - **No filtra.** Hay que filtrar la lista con el `value` (un `computed` sobre las opciones).
 - **El default del placeholder es genérico** (`'Buscar…'`, en español desde el 04-10-2026): pásalo siempre diciendo qué se busca.
-- **iOS hace zoom al enfocarlo**: el campo está en 14 px y la regla de la app pide 16 px en los
-  inputs de mobile (CLAUDE.md, «Responsive mobile»). Hoy no hay forma de cambiarlo desde afuera.
-- **El teclado no trae la lupa**: el `<input>` es `type="text"` sin `enterkeyhint="search"` (la regla
-  de la app para buscadores, CLAUDE.md «La lupa del teclado»).
-- **El campo no tiene nombre accesible**: solo placeholder, sin `aria-label`.
+- **El nombre accesible es el placeholder** si no pasas `ariaLabel`. Con un placeholder de ejemplo
+  («Ej. Juan…») pasa `ariaLabel` con lo que se busca.
+- Lleva `enterkeyhint="search"` y **no** `inputmode` (D14: `inputmode="search"` le quita la lupa al
+  teclado de Android). Texto en 16 en ≤ 767 px. Las dos cosas desde 0.26.0.
 - **Al abrir el menú el foco no entra al buscador**: quien quiera escribir de una tiene que enfocarlo
   a mano.
 - El `<input>` no tiene `(keydown)`: Enter no hace nada salvo que quien lo usa lo escuche.
@@ -140,7 +151,7 @@ Filtrar la lista
 Buscar en el celular
 
 ```html
-<!-- ❌ mal: 36 px sin lupa en el teclado, y iOS hace zoom al enfocarlo -->
+<!-- ❌ mal: mide 36, bajo el piso de 44 en lo que se toca (D1, D16) -->
 <sui-dropdown-search [(value)]="busqueda" placeholder="Buscar repartidor…" />
 ```
 

package/docs/sui-file-icon/README.md

@@ -106,6 +106,17 @@ En master-pedidos: `size="medium"` fijo, o se omite (es el default). No hay help
 Outputs: ninguno.
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `archivo.tipo` | Archivo {ext} | — |
+| `archivo.icono` | Archivo | — |
+<!-- textos:fin -->
+
 ## Trampas
 
 - **La extensión se corta a 4 letras** y va en mayúsculas: `.jpeg` → `JPEG`, `.numbers` → `NUMB`.

package/docs/sui-file-upload/README.md

@@ -133,7 +133,7 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `maxSize` | `number` | `0` |
 | `title` | `string \| null` | `null` |
 | `subtitle` | `string \| null` | `null` |
-| `browseLabel` | `string` | `'Buscar archivo'` |
+| `browseLabel` | `string \| null` | `null` |
 | `disabled` | `boolean` | `false` |
 | `error` | `boolean` | `false` |
 | `errorMessage` | `string \| null` | `null` |
@@ -145,6 +145,19 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `errorEvent` | `string` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `archivo.buscar` | Buscar archivo | `browseLabel` |
+| `archivo.soltarVarios` | Arrastra y suelta los archivos aquí | `title` |
+| `archivo.soltarUno` | Arrastra y suelta el archivo aquí | `title` |
+| `archivo.oClic` | o haz clic para seleccionar | `subtitle` |
+<!-- textos:fin -->
+
 ## Trampas
 
 - `browseLabel` dice «Buscar archivo» por defecto (antes «Browse File»).

package/docs/sui-file-upload-card/README.md

@@ -100,10 +100,10 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `progress` | `number` | `10` |
 | `statusText` | `string \| null` | `null` |
 | `showStatus` | `boolean` | `true` |
-| `cancelLabel` | `string` | `'Cancelar subida'` |
-| `removeLabel` | `string` | `'Quitar archivo'` |
-| `progressLabel` | `string` | `'Progreso de la subida'` |
-| `retryLabel` | `string` | `'Reintentar'` |
+| `cancelLabel` | `string \| null` | `null` |
+| `removeLabel` | `string \| null` | `null` |
+| `progressLabel` | `string \| null` | `null` |
+| `retryLabel` | `string \| null` | `null` |
 
 | output | payload |
 |---|---|
@@ -111,6 +111,22 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `retryClicked` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `archivo.cancelarSubida` | Cancelar subida | `cancelLabel` |
+| `archivo.quitar` | Quitar archivo | `removeLabel` |
+| `archivo.progreso` | Progreso de la subida | `progressLabel` |
+| `archivo.reintentar` | Reintentar | `retryLabel` |
+| `archivo.subiendo` | Subiendo… | `statusText` |
+| `archivo.completado` | Completado | `statusText` |
+| `archivo.fallo` | Falló | `statusText` |
+<!-- textos:fin -->
+
 ```ts
 interface SuiFileUploadCardFile { filename: string; extension?: string; }
 ```

package/docs/sui-filter/README.md

@@ -74,7 +74,7 @@ Ninguna pieza cambia sola en mobile, salvo la barra, que apila sus dos lados por
 |---|---|---|---|
 | `sui-filter-bar` | sin tamaño; los controles adentro van `large` (48) | sin tamaño; los controles `medium` (40) | canon (D16, dueño 05-10-2026) |
 | `sui-filter-item` | 36 de alto, no se puede cambiar: debajo de los 44 del dedo | 36 | pendiente (P19: área invisible de 44 o no usarlo en mobile) |
-| `sui-filter-panel-footer` | `medium` (40) es lo más grande que tiene; en mobile, mejor `sui-modal-footer` (48) dentro de un `sui-modal-sheet` | `medium` (40) | canon para el 48 de mobile (CLAUDE.md: footer de modal `large`); web `medium` (40): canon (dueño, 05-10-2026, D16), reemplaza el `small` del bloque B1 (`small` es el default del componente: hay que pasarlo) |
+| `sui-filter-panel-footer` | `large` (48, desde 0.26.0); o el panel en un `sui-modal-sheet` con `sui-modal-footer` (48) | `medium` (40, el default desde 0.26.0) | canon para el 48 de mobile (CLAUDE.md: footer de modal `large`, piso de 44); web `medium` (40): canon (dueño, 05-10-2026, D16), reemplaza el `small` del bloque B1 |
 | `sui-filter-panel-header` | sin tamaño | sin tamaño | — |
 
 ```html
@@ -95,18 +95,19 @@ controles que se proyectan en la barra. Fuente: D16, dueño 05-10-2026 (fila `fi
 |---|---|---|
 | celular chico (< 380) | sin regla en la tabla (`—`) | la fila `filter` de D16 no lo define; `bp.sizeControl()` da `large`, igual que en el celular, mientras el DS no estire a 44 el área de los `medium` |
 | celular (380–767) | controles `large` · segmented `2xlarge` | el panel va en un `sui-modal-sheet` con `sui-modal-footer` (48), no con este pie; el área de 44 de `sui-filter-item` está pendiente (P19) |
-| tablet táctil (`pointer: coarse`) | controles `large` · segmented `2xlarge` | se toca como un celular: el panel lleva `sui-modal-footer` (48) en vez de este pie, que llega solo a `medium` (40). D16 no fija el pie en la tablet; esto sigue la columna «mobile» de arriba. El área de 44 de `sui-filter-item` está pendiente (P19), igual que en el celular |
-| computadora (`pointer: fine`) | controles `medium` · `sui-filter-panel-footer` `medium` | el default del pie es `small`: hay que pasarlo |
+| tablet táctil (`pointer: coarse`) | controles `large` · segmented `2xlarge` · pie `large` | se toca como un celular: el pie va en `large` (48) o el panel lleva `sui-modal-footer`. D16 no fija el pie en la tablet; esto sigue la columna «mobile» de arriba. El área de 44 de `sui-filter-item` está pendiente (P19), igual que en el celular |
+| computadora (`pointer: fine`) | controles `medium` · `sui-filter-panel-footer` `medium` | `medium` es el default del pie desde 0.26.0 (antes era `small` y había que pasarlo) |
 
 En el ultrawide, igual que en la computadora: el espacio extra va al ancho de la tabla, no a
 controles más grandes.
 
 En master-pedidos: `[size]="bp.sizeControl()"` en el `sui-input`, `sui-select` o
 `sui-compact-select` de la barra, `[size]="bp.tactil() ? '2xlarge' : 'medium'"` en el
-`sui-segmented-control` (no tiene helper) y `size="medium"` fijo en `sui-filter-panel-footer`,
-que solo se usa en la computadora (solo tiene `small` y `medium`: `bp.sizeControl()` le pasaría un
-`large` que no existe); con `bp.tactil()` el panel lleva `sui-modal-footer` en su lugar. No uses
-`bp.isMobile() ? 'large' : 'medium'`: deja la tablet táctil en `medium`.
+`sui-segmented-control` (no tiene helper) y `[size]="bp.tactil() ? 'large' : 'medium'"` en
+`sui-filter-panel-footer` (`large` existe desde 0.26.0; con la versión anterior, `size="medium"` fijo y
+`sui-modal-footer` en táctil). No uses `bp.isMobile() ? 'large' : 'medium'`: deja la tablet táctil en
+`medium`. Los botones del pie van separados 12 px, como todo grupo de botones (canon de
+`sui-modal-footer`; el Figma dibuja 16).
 
 ## API
 
@@ -138,9 +139,9 @@ Outputs: ninguno.
 
 | input | tipo | default |
 |---|---|---|
-| `clearButton` | `SuiFooterButtonConfig \| string` | `'Limpiar'` |
-| `applyButton` | `SuiFooterButtonConfig \| string` | `'Aplicar'` |
-| `size` | `'small' \| 'medium'` | `'small'` |
+| `clearButton` | `SuiFooterButtonConfig \| string \| null` | `null` |
+| `applyButton` | `SuiFooterButtonConfig \| string \| null` | `null` |
+| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` |
 
 | output | payload |
 |---|---|
@@ -160,6 +161,17 @@ Outputs: ninguno.
 | `clearClick` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `filtro.limpiar` | Limpiar | `clearButton` · `clear` del header |
+| `filtro.aplicar` | Aplicar | `applyButton` |
+<!-- textos:fin -->
+
 Slots de `sui-filter-bar`: `[slot=start]`, `[slot=end]` y el contenido por defecto (fila única si no
 se usan los slots). El label de `sui-filter-item` es su contenido proyectado. `clearButton` y
 `applyButton` aceptan un string o `SuiFooterButtonConfig` (`{ label, disabled? }`, la misma interfaz
@@ -186,16 +198,16 @@ de `sui-drawer-footer`).
 > Hoy no hay usos de estas piezas fuera de la vitrina `master-preview`: los pares salen de las
 > trampas de este README.
 
-Pie del panel en la computadora
+Pie del panel
 
 ```html
-<!-- ❌ mal: sin size queda en small (36), y D16 no usa small -->
-<sui-filter-panel-footer (clear)="limpiar()" (apply)="aplicar()" />
+<!-- ❌ mal: small (36) no se usa en ningún dispositivo (D16) -->
+<sui-filter-panel-footer size="small" (clear)="limpiar()" (apply)="aplicar()" />
 ```
 
 ```html
-<!-- ✅ bien -->
-<sui-filter-panel-footer size="medium" (clear)="limpiar()" (apply)="aplicar()" />
+<!-- ✅ bien: medium en la computadora, large (48) donde se toca -->
+<sui-filter-panel-footer [size]="bp.tactil() ? 'large' : 'medium'" (clear)="limpiar()" (apply)="aplicar()" />
 ```
 
 «Limpiar» en dos lugares

package/docs/sui-image-upload/README.md

@@ -186,6 +186,25 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `errorEvent` | `string` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `imagen.vistaPrevia` | Vista previa | — |
+| `imagen.editar` | Editar imagen | — |
+| `imagen.quitar` | Quitar imagen | — |
+| `imagen.cambiar` | Cambiar imagen | — |
+| `imagen.subeFoto` | Sube tu foto | `title` |
+| `imagen.subeLogo` | Sube tu logo | `title` |
+| `imagen.tipoNoSoportado` | Tipo no soportado. Usa JPG, PNG, WebP, GIF o HEIC. | — |
+| `imagen.superaTamano` | Imagen supera el tamaño máximo ({tamano}) | — |
+| `imagen.formatosMax` | {formatos} — máx {tamano} | `subtitle` |
+| `imagen.formatos` | JPG, PNG, WebP o HEIC | `subtitle` |
+<!-- textos:fin -->
+
 Método público: `abrirSelector()` — abre el selector de archivo (para el lápiz cuando no hay
 recortador; se llama con una referencia: `#qr` → `qr.abrirSelector()`).
 

package/docs/sui-image-upload-profile/README.md

@@ -117,8 +117,8 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 |---|---|---|
 | `imageUrl` | `string \| null` | `null` |
 | `companyLogoSrc` | `string \| null` | `null` |
-| `title` | `string` | `'Subir imagen'` |
-| `subtitle` | `string` | `'Mín. 400x400px, PNG o JPEG'` |
+| `title` | `string \| null` | `null` |
+| `subtitle` | `string \| null` | `null` |
 | `alignment` | `'vertical' \| 'horizontal'` | `'vertical'` |
 | `type` | `'avatar' \| 'company'` | `'avatar'` |
 | `labels` | `SuiImageUploadProfileLabels` | `{}` |
@@ -132,6 +132,20 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `change` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `imagen.perfilTitulo` | Subir imagen | `title` |
+| `imagen.perfilSubtitulo` | Mín. 400x400px, PNG o JPEG | `subtitle` |
+| `imagen.subir` | Subir | `labels.upload` |
+| `imagen.eliminar` | Eliminar | `labels.remove` |
+| `imagen.cambiarCorto` | Cambiar | `labels.change` |
+<!-- textos:fin -->
+
 Es `ControlValueAccessor` de la URL (`string | null`); `remove` la deja en `null`.
 
 ```ts

package/docs/sui-inline-input/README.md

@@ -85,11 +85,11 @@ si no, `sui-inline-input`.
 | input | tipo | default |
 |---|---|---|
 | `value` · model, `[(value)]` | `string` | `''` |
-| `placeholder` | `string` | `'Escribe aquí…'` |
+| `placeholder` | `string \| null` | `null` |
 | `leftIcon` | `string \| false` | `'user-3-line'` |
 | `error` | `boolean` | `false` |
 | `disabled` | `boolean` | `false` |
-| `editLabel` | `string` | `'Editar'` |
+| `editLabel` | `string \| null` | `null` |
 
 | output | payload |
 |---|---|
@@ -98,6 +98,19 @@ si no, `sui-inline-input`.
 | `edit` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.cancelar` | Cancelar | — |
+| `comun.confirmar` | Confirmar | — |
+| `comun.escribeAqui` | Escribe aquí… | `placeholder` |
+| `comun.editar` | Editar | `editLabel` |
+<!-- textos:fin -->
+
 Implementa `ControlValueAccessor`.
 
 ## Trampas

package/docs/sui-input/README.md

@@ -213,6 +213,18 @@ en la columna de la derecha, se usa.
 Outputs: ninguno.
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.limpiar` | Limpiar | — |
+| `input.ocultarContrasena` | Ocultar contraseña | — |
+| `input.mostrarContrasena` | Mostrar contraseña | — |
+<!-- textos:fin -->
+
 `value` es `model<string>`: `[(value)]` o `[value]` + `(valueChange)`. También funciona con
 `formControlName` y `[(ngModel)]` (implementa `ControlValueAccessor`).
 

package/docs/sui-integration-switch/README.md

@@ -137,6 +137,16 @@ En master-pedidos: `[size]="bp.sizeControl()"`. El `type` sigue por ancho
 | `manageClick` | `MouseEvent` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `varios.administrar` | Administrar | `manage` |
+<!-- textos:fin -->
+
 ```ts
 interface SuiIntegrationManageConfig { label?: string; icon?: string; }   // icon default 'settings-2-line'
 ```

package/docs/sui-modal/README.md

@@ -2,7 +2,7 @@
 name: sui-modal
 selector: sui-modal
 resumen: Diálogo que se abre encima de la pantalla y pide terminar o cerrar algo antes de seguir
-alternativas: [sui-modal-sheet (hoja que sube desde abajo y deja ver lo de atrás, p. ej. un mapa), sui-alert (aviso en la misma pantalla, sin interrumpir), sui-toast (confirmación breve de una acción), sui-popover (contenido chico anclado a un botón), sui-drawer-header (panel lateral)]
+alternativas: [sui-modal-sheet (solo en el celular: hoja que sube desde abajo y deja ver lo de atrás, p. ej. un mapa), sui-alert (aviso en la misma pantalla, sin interrumpir), sui-toast (confirmación breve de una acción), sui-popover (contenido chico anclado a un botón), sui-drawer-header (panel lateral)]
 ---
 
 # sui-modal
@@ -28,6 +28,43 @@ comprobante, el detalle de un pedido).
 
 Regla corta: **hay que responder → modal · se mira junto al fondo → sheet · solo se avisa → alert/toast.**
 
+## Celular, tablet y computadora: modal u hoja
+
+Canon (decisión del dueño, 08-10-2026). La superficie depende del **dispositivo**, y el ancho del
+modal depende de **cuánto contenido** hay:
+
+| dispositivo | contenido para mirar o elegir (listas, grillas, detalles) | formularios y confirmaciones |
+|---|---|---|
+| celular (≤ 768 px) | `sui-modal-sheet` | `sui-modal` (a pantalla completa en la app) |
+| tablet y computadora (> 768 px) | **`sui-modal` centrado, nunca una hoja** | `sui-modal` centrado |
+
+En tablet y computadora el ancho sale de la cantidad de contenido:
+
+- **mucho contenido** (una grilla, una lista larga, más de una pantalla de opciones): el más ancho,
+  `xlarge`;
+- **poco contenido** (unas frases, un formulario corto): `small` o `medium`;
+- entre medio, `large`. La tabla de `size` de abajo tiene los casos.
+
+Cuando el mismo contenido se abre en los dos, va en un `ng-template` y se elige la superficie con
+el breakpoint de la app:
+
+```html
+<ng-template #contenido> … </ng-template>
+
+@if (bp.isMobile()) {
+  <sui-modal-sheet [open]="abierta()" (closed)="abierta.set(false)">
+    <ng-container *ngTemplateOutlet="contenido" />
+  </sui-modal-sheet>
+} @else {
+  <sui-modal [open]="abierta()" size="xlarge" title="Categorías" (closed)="abierta.set(false)">
+    <ng-container *ngTemplateOutlet="contenido" />
+  </sui-modal>
+}
+```
+
+Ejemplo real: «Ver todo» de las categorías del inicio del cliente
+(`pages/customer/store-browser/store-browser.html`), con más de 30 rubros en `xlarge`.
+
 ## Qué variante usar
 
 El modal tiene tres decisiones: **cómo se presenta en mobile** (`fullscreen`), **qué tan ancho
@@ -89,14 +126,15 @@ de 0.21.0 se abren **a pantalla completa** dentro de la app):
 ### `size` — el ancho en desktop
 
 En mobile **no se usa**: a 768 px o menos el contenedor toma `max-width: 100%` (centrado) o la
-pantalla entera (fullscreen). Elegirlo es una decisión de desktop.
+pantalla entera (fullscreen). Elegirlo es una decisión de desktop, y la regla es **cuánto
+contenido hay**: mucho → el más ancho; poco → el más angosto que lo contenga sin apretarlo.
 
 | size | cuándo | ejemplo real de la app | fuente |
 |---|---|---|---|
 | `small` (400) | confirmación o aviso: título, una o dos frases y los botones | `pages/customer/order-tracking/order-tracking.html:756` | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | `medium` (440, default) | formulario corto (hasta ~5 campos) o un detalle simple | `pages/discounts/discounts.html:122` («Crear descuento») | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | `large` (560) | detalle con tabla o imagen: comprobantes, el detalle de un pedido | `pages/orders/orders.html:146` · `pages/super-admin/master-drivers/master-drivers.html:685` | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
-| `xlarge` (720) | mapa, formularios de dos columnas, listas largas de opciones | `components/address-picker-modal/address-picker-modal.html:1` · `pages/customer/checkout/checkout.html:1` | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| `xlarge` (720) | **mucho contenido**: mapa, formularios de dos columnas, listas largas o grillas de opciones | `components/address-picker-modal/address-picker-modal.html:1` · `pages/customer/checkout/checkout.html:1` · Categorías del inicio (`pages/customer/store-browser/store-browser.html`) | canon (aprobado por el dueño, 05-10-2026, bloque B1; «mucho contenido → el más ancho», 08-10-2026) |
 
 Hoy: 45 `small`, 63 `medium` (50 explícitos + 13 por default), 5 `large`, 14 `xlarge` y 1 que cambia según el caso.
 
@@ -177,6 +215,16 @@ En master-pedidos: sin helper para el modal; `<sui-modal-footer>` sin `buttonSiz
 | `closed` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.cerrar` | Cerrar | — |
+<!-- textos:fin -->
+
 Slots: el contenido sin atributo va al **body**; `slot="footer"` va al pie. El pie canon es
 `<sui-modal-footer slot="footer">` (trae su propio padding y borde); un `<div slot="footer">`
 también funciona y recibe padding 16 × 20, gap 12 y alineación a la derecha.

package/docs/sui-modal-header/README.md

@@ -95,6 +95,16 @@ En master-pedidos: `[size]="description ? 'medium' : 'small'"`, nunca una señal
 | `closed` | `void` |
 <!-- api:fin -->
 
+<!-- textos:inicio -->
+### Textos
+
+Lo que el componente escribe solo sale de `provideSuiTextos` (español por defecto, se cambia en vivo; ver `docs/TEXTOS.md`). El input de la última columna le gana al texto global.
+
+| clave | por defecto | se pisa con |
+|---|---|---|
+| `comun.cerrar` | Cerrar | — |
+<!-- textos:fin -->
+
 `titleId` y `descriptionId` ponen el `id` al `<h2>` y al `<p>`: sirven para el
 `aria-labelledby` / `aria-describedby` del contenedor que hace de diálogo.