@ajuarezso/sui-design-system 0.24.1 → 0.25.0

package/docs/sui-filter/README.md

@@ -39,8 +39,8 @@ panel (header + items + footer) · un filtro suelto → compact-select.**
 ## Qué variante usar
 
 > **La guía del DS no tiene página de filtros**: estas piezas salen solo del Figma del DS
-> («Filters»: HorizontalFilter y VerticalFilter). Todo lo de abajo es **propuesta, falta
-> aprobación**, salvo lo marcado canon.
+> («Filters»: HorizontalFilter y VerticalFilter). Las reglas marcadas canon están aprobadas; lo
+> que sigue en **propuesta** (la barra y el item en mobile) espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app` (misma exclusión que `sui-dropdown-menu`):
 > **0 usos**. Solo aparecen en la vitrina `master-preview`.
@@ -49,8 +49,8 @@ panel (header + items + footer) · un filtro suelto → compact-select.**
 
 | variant | cuándo | fuente |
 |---|---|---|
-| `table` (default) | Arriba de una tabla: a la izquierda la vista (`sui-segmented-control`), a la derecha el buscador (`sui-input type="search"`) y el orden (`sui-select` o `sui-compact-select`). | propuesta (composición del Figma) |
-| `calendar` | Arriba de una vista por fechas: a la izquierda «Hoy» + el rango (`sui-button-group`), a la derecha el buscador. | propuesta (composición del Figma) |
+| `table` (default) | Arriba de una tabla: a la izquierda la vista (`sui-segmented-control`), a la derecha el buscador (`sui-input type="search"`) y el orden (`sui-select` o `sui-compact-select`). | canon (aprobado por el dueño, 05-10-2026, bloque B9), composición del Figma |
+| `calendar` | Arriba de una vista por fechas: a la izquierda «Hoy» + el rango (`sui-button-group`), a la derecha el buscador. | canon (aprobado por el dueño, 05-10-2026, bloque B9), composición del Figma |
 
 `variant` solo marca el host (`data-sui-variant`): **no cambia el layout**. Lo que se ve lo deciden
 los controles que se proyectan.
@@ -59,12 +59,12 @@ los controles que se proyectan.
 
 | pieza | regla | fuente |
 |---|---|---|
-| `sui-filter-item` `active` | La categoría abierta (la que muestra sus opciones al lado): fondo gris, texto negro, flecha a la derecha. | propuesta (estados del Figma) |
-| `sui-filter-item` `leftIcon` | Un ícono por categoría si ayuda a ubicarla («Estado», «Local», «Repartidor»). | propuesta |
+| `sui-filter-item` `active` | La categoría abierta (la que muestra sus opciones al lado): fondo gris, texto negro, flecha a la derecha. | según el código (estados del Figma) |
+| `sui-filter-item` `leftIcon` | Un ícono por categoría si ayuda a ubicarla («Estado», «Local», «Repartidor»). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `sui-filter-panel-header` `clear` | `clear=true` dice «Limpiar» (en español desde el 04-10-2026); un string lo cambia. | canon (CANON-SUI §5: copy en español) |
 | `sui-filter-panel-footer` | «Limpiar» a la izquierda (`stroke neutral`), «Aplicar» a la derecha (`filled primary`), mitad y mitad. | canon (orden de `sui-modal-footer`, CLAUDE.md «Botones») |
-| «Limpiar» en header **y** footer | Elegir uno. Con el footer, el header va sin link. | propuesta |
-| `applyButton` deshabilitado | `{ label: 'Aplicar', disabled: !cambio() }` mientras no se toca nada. | propuesta |
+| «Limpiar» en header **y** footer | Elegir uno. Con el footer, el header va sin link. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `applyButton` deshabilitado | `{ label: 'Aplicar', disabled: !cambio() }` mientras no se toca nada. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 
 ## Tamaño en mobile y en web
 
@@ -72,16 +72,16 @@ Ninguna pieza cambia sola en mobile, salvo la barra, que apila sus dos lados por
 
 | pieza | mobile | web | fuente |
 |---|---|---|---|
-| `sui-filter-bar` | sin tamaño; los controles adentro van `large` (48) | sin tamaño; los controles `small` (36) | propuesta (igual que `sui-compact-select` en una barra) |
+| `sui-filter-bar` | sin tamaño; los controles adentro van `large` (48) | sin tamaño; los controles `medium` (40) | web: canon (dueño, 05-10-2026, D16) · mobile: propuesta (igual que `sui-compact-select` en una barra) |
 | `sui-filter-item` | 36 de alto, no se puede cambiar: debajo de los 44 del dedo | 36 | propuesta |
-| `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` | `small` (36, default) | canon para el 48 de mobile (CLAUDE.md: footer de modal `large`); el resto, propuesta |
+| `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-header` | sin tamaño | sin tamaño | — |
 
 ```html
 <sui-filter-bar>
   <sui-segmented-control slot="start" … />
   <div slot="end">
-    <sui-input type="search" [size]="bp.isMobile() ? 'large' : 'small'" placeholder="Buscar pedido…" … />
+    <sui-input type="search" [size]="bp.isMobile() ? 'large' : 'medium'" placeholder="Buscar pedido…" … />
   </div>
 </sui-filter-bar>
 ```
@@ -164,7 +164,7 @@ de `sui-drawer-footer`).
 ```html
 <!-- Panel de filtros en web, anclado a un botón «Filtros» -->
 <sui-dropdown-menu #filtros="suiDropdownMenu" [minWidth]="320">
-  <sui-button trigger variant="stroke" color="neutral" size="small">Filtros</sui-button>
+  <sui-button trigger variant="stroke" color="neutral" size="medium">Filtros</sui-button>
   <ng-template suiDropdownPanel>
     <sui-filter-panel-header label="Filtros" leftIcon="equalizer-line" />
     <div role="listbox" aria-label="Categorías de filtro">

package/docs/sui-flag/README.md

@@ -19,7 +19,8 @@ nada a nadie.
 
 ## Qué variante usar
 
-> **La guía del DS no tiene este componente.** Todo es **propuesta, falta aprobación**.
+> **La guía del DS no tiene este componente.** Las reglas marcadas canon están aprobadas y las de
+> «según el código» describen el componente; lo que sigue en **propuesta** espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **0 usos directos**. Lo usan por dentro
 > `sui-select`, `sui-compact-select`, `sui-compact-select-for-input`, `sui-inline-select`,
@@ -32,17 +33,17 @@ nada a nadie.
 |---|---|---|---|
 | `xs` | 16 | Dentro de un select o un tag (así lo usa el DS). | propuesta |
 | `sm` | 20 | El prefijo de un teléfono. | propuesta |
-| `md` (default) | 24 | Fila de una lista. | propuesta |
+| `md` (default) | 24 | Fila de una lista. | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | `lg` | 32 | Dentro de una card. | propuesta |
-| `xl` | 48 | No usar hoy. | propuesta |
-| `full` | 100 % | Llena su caja (la caja manda). | propuesta |
+| `xl` | 48 | No usar hoy. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
+| `full` | 100 % | Llena su caja (la caja manda). | según el código |
 
 ### `name` y `ariaLabel`
 
 | input | cuándo | fuente |
 |---|---|---|
-| `name` | El slug en inglés y en kebab-case: `peru`, `venezuela`, `united-states`. Son 262. | propuesta |
-| `ariaLabel` | El nombre del país en español, si no está escrito al lado. Sin él, es decorativa. | propuesta |
+| `name` | El slug en inglés y en kebab-case: `peru`, `venezuela`, `united-states`. Son 262. | según el código |
+| `ariaLabel` | El nombre del país en español, si no está escrito al lado. Sin él, es decorativa. | canon (aprobado por el dueño, 05-10-2026, bloque B5) |
 
 Usos de hoy que rompen la regla: **0**.
 
@@ -51,7 +52,10 @@ Usos de hoy que rompen la regla: **0**.
 En mobile se lee y se toca con el dedo, así que va más grande; en web, más chico. En las
 pantallas que se usan en los dos (panel del local, super admin) se elige con el servicio de
 breakpoints de la app (`bp`, en `services/breakpoints.service.ts`); en las que solo existen en
-el celular (cliente, repartidor) va directo el valor de mobile. Todo es **propuesta**.
+el celular (cliente, repartidor) va directo el valor de mobile. No se toca, así que la tablet va
+con el valor de web, y el celular chico (< 380 px) también (D16).
+Es **canon (dueño, 05-10-2026, P1 b)**: un paso más grande en el celular que en computadora, y
+se migra todo ahora, no solo al tocar cada pantalla.
 
 | uso | mobile | web |
 |---|---|---|

package/docs/sui-form-hint/README.md

@@ -51,8 +51,8 @@ Regla corta: **ayuda o error de un control sin hint propio → form-hint · camp
 |---|---|---|
 | `message` | Hasta 8 palabras (mediana 6). Si no cabe, es un `sui-alert`. Sin punto final si es una frase corta; con punto si son dos oraciones. | canon (`docs/CANON-SUI.md` §5.4 el largo; `docs/VOZ-Y-ESCRITURA.md` el punto) |
 | `icon` sin pasar | El de la variante (ninguno en `neutral`, info en `error` y `disabled`). | según la guía del DS (ícono opcional); default de SUI |
-| `icon="…"` en `neutral` | Solo cuando la ayuda es una advertencia que conviene notar («No reconocimos el distrito…»). | propuesta, falta aprobación (2 usos hoy) |
-| `[icon]="null"` | Quita el ícono también en `error`. No usar: el error necesita algo más que el color. | propuesta, falta aprobación |
+| `icon="…"` en `neutral` | Solo cuando la ayuda es una advertencia que conviene notar («No reconocimos el distrito…»). | canon (aprobado por el dueño, 05-10-2026, bloque B9) (2 usos hoy) |
+| `[icon]="null"` | Quita el ícono también en `error`. No usar: el error necesita algo más que el color. | canon (aprobado por el dueño, 05-10-2026, bloque B5) |
 
 **Usos de hoy que rompen las reglas:**
 

package/docs/sui-form-label/README.md

@@ -48,8 +48,8 @@ Regla corta: **campo de texto → su propio `[label]` · grupo o control sin lab
 | `label` | Siempre. Una a tres palabras, sentence case, sin dos puntos ni punto final. | según la guía del DS (pieza); largo y forma según `docs/CANON-SUI.md` §5.4 |
 | `required` | Campo obligatorio: asterisco **rojo** (`state-error-base`). | según la guía del DS (asterisco = obligatorio); el color es canon (`docs/CANON-SUI.md` §4: excepción documentada) |
 | `sublabel` | «(Opcional)» en un formulario donde casi todo es obligatorio. Nunca el «opcional» dentro del `label`. | según la guía del DS (ejemplo «(Optional)») |
-| `tooltip` | Ayuda corta que no cabe en la pantalla y no hace falta para llenar el campo. Si hace falta, va visible en `sui-form-hint`. | propuesta, falta aprobación |
-| `link` | Una acción sobre el campo, a la derecha: «Cambiar» (el distrito). | propuesta (ya es práctica de la app: 2 usos) |
+| `tooltip` | Ayuda corta que no cabe en la pantalla y no hace falta para llenar el campo. Si hace falta, va visible en `sui-form-hint`. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `link` | Una acción sobre el campo, a la derecha: «Cambiar» (el distrito). | canon (aprobado por el dueño, 05-10-2026, bloque B9); ya es práctica de la app: 2 usos |
 | `disabled` | El campo de abajo está deshabilitado. | según la guía del DS |
 | `for` | Siempre que el control de abajo tenga `id`. | propuesta, falta aprobación |
 
@@ -59,7 +59,7 @@ Regla corta: **campo de texto → su propio `[label]` · grupo o control sin lab
 |---|---|---|
 | `medium` (default) | Lo normal. | según la guía del DS (único tamaño) |
 | `small` | Es **idéntico** a `medium` (mismo CSS). No aporta. | — |
-| `xsmall` | Junto a un campo `xsmall` en una tabla o filtro denso (12 px). | propuesta, falta aprobación |
+| `xsmall` | No usar: con D16 no hay campos `xsmall`; en una tabla o filtro va `medium`. | canon (dueño, 05-10-2026, D16), reemplaza el «cuándo» del bloque B1 |
 
 La regla de controles grandes del dueño (28-09-2026) no aplica aquí: el `size` del label es
 tipografía, no área táctil.
@@ -85,7 +85,7 @@ tipografía, no área táctil.
 | uso | mobile | web |
 |---|---|---|
 | rótulo de un grupo o control | `medium` (14 px) | `medium` (14 px) |
-| junto a un campo `xsmall` en una tabla o filtro denso | no aplica | `xsmall` (12 px) |
+| junto a un campo de una tabla o filtro | no aplica | `medium` (14 px): ya no hay campos `xsmall` (D16) |
 
 No necesita `bp`: es texto, no se toca. Lo único tocable es el `link` («Cambiar»), un
 `sui-link-button` de 12 px **sin tamaño para mobile**: su área táctil es la del texto. Si en

package/docs/sui-icon/README.md

@@ -26,8 +26,8 @@ propios del DS (`info-custom-fill`, `heart-half-fill`…) también pasan por aqu
 
 > **La guía del DS no tiene página para el ícono**: usa RemixIcon en todos sus ejemplos, sin
 > reglas de tamaño. La escala de abajo sale de los tokens del DS (`--sui-icon-size-*` y
-> `--sui-icon-*` en `sui-tokens.scss`). Lo marcado «canon» ya es regla del proyecto; el resto es
-> **propuesta, falta aprobación**.
+> `--sui-icon-*` en `sui-tokens.scss`). Lo marcado «canon» ya es regla del proyecto; lo que sigue
+> en **propuesta** espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: 406 íconos en 95 archivos, sin contar
 > prototipos ni vitrinas. 331 `-line`, 43 `-fill`. Ninguno usa el input `color`.
@@ -36,14 +36,14 @@ propios del DS (`info-custom-fill`, `heart-half-fill`…) también pasan por aqu
 
 | valor | tamaño de hoy | cuándo | fuente |
 |---|---|---|---|
-| `12` | 5 | Dentro de un badge `small`. | propuesta (token `--sui-icon-size-xs`) |
-| `16` | 69 | Junto a texto chico: metadatos, botones `2xsmall`/`xsmall`, dentro de un kbd. | propuesta (token `--sui-icon-size-sm`) |
-| `20` (default) | 114 | El normal: botones, inputs, filas, navegación. | propuesta (token `--sui-icon-size-md`) |
-| `24` | 5 | Cabeceras y acciones sueltas. | propuesta (token `--sui-icon-size-lg`) |
-| `32` | 2 | Ícono protagonista. Si va dentro de un círculo, es `sui-key-icon`. | propuesta (token `--sui-icon-size-xl`) |
+| `12` | 5 | Dentro de un badge `small`. | canon (aprobado por el dueño, 05-10-2026, bloque B1), token `--sui-icon-size-xs` |
+| `16` | 69 | Junto a texto chico: metadatos, botones `2xsmall`/`xsmall`, dentro de un kbd. | canon (aprobado por el dueño, 05-10-2026, bloque B1), token `--sui-icon-size-sm` |
+| `20` (default) | 114 | El normal: botones, inputs, filas, navegación. | canon (aprobado por el dueño, 05-10-2026, bloque B1), token `--sui-icon-size-md` |
+| `24` | 5 | Cabeceras y acciones sueltas. | canon (aprobado por el dueño, 05-10-2026, bloque B1), token `--sui-icon-size-lg` |
+| `32` | 2 | Ícono protagonista. Si va dentro de un círculo, es `sui-key-icon`. | canon (aprobado por el dueño, 05-10-2026, bloque B1), token `--sui-icon-size-xl` |
 | `26` | 7 | Solo el ícono del hero de los onboarding (`ob__hero-icon`). | canon (`CLAUDE.md`, patrón de los pasos de onboarding) |
 | `14`, `18` | 149 | Fuera de la escala, pero el DS mismo los usa (tabs, product-card). **A discutir**: no migrar en masa. | propuesta |
-| `13`, `22`, `28`, `44`… | 49 | Sin regla: van al más cercano de la escala. | propuesta |
+| `13`, `22`, `28`, `44`… | 49 | Sin regla: van al más cercano de la escala. | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 
 **Usos de hoy fuera de la escala sin regla: 49.** `22` (20 usos: `components/ota-quick-fab/ota-quick-fab.html:11`,
 `pages/schedule/schedule.html:10`), `13` (14: `pages/super-admin/master-drivers/master-drivers.html:359`, `:419`),
@@ -56,18 +56,18 @@ propios del DS (`info-custom-fill`, `heart-half-fill`…) también pasan por aqu
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `-line` | El normal. | propuesta |
-| `-fill` | El seleccionado (el tab activo) o un glifo chico sobre color. | propuesta |
-| propios del DS (`info-custom-fill`, `heart-half-fill`, `building-skyline`, `avatar-placeholder`) | Los usan componentes del DS; en la app no hacen falta. | propuesta |
+| `-line` | El normal. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `-fill` | El seleccionado (el tab activo) o un glifo chico sobre color. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| propios del DS (`info-custom-fill`, `heart-half-fill`, `building-skyline`, `avatar-placeholder`) | Los usan componentes del DS; en la app no hacen falta. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### `color`
 
 | valor | cuándo | fuente |
 |---|---|---|
-| sin `color` (default) | El normal: hereda el color del texto. Casi siempre es lo que se quiere. | propuesta |
-| `var(--sui-icon-sub-600)` | Ícono de apoyo junto a un texto principal. | propuesta |
-| `var(--sui-icon-soft-400)` | Decorativo, metadatos. | propuesta |
-| `var(--sui-icon-disabled-300)` | Deshabilitado. | propuesta |
+| sin `color` (default) | El normal: hereda el color del texto. Casi siempre es lo que se quiere. | canon (aprobado por el dueño, 05-10-2026, bloque B3) |
+| `var(--sui-icon-sub-600)` | Ícono de apoyo junto a un texto principal. | canon (CANON-SUI §4.1: los íconos siguen la semántica del texto; sub-600 = secundario que igual se lee) |
+| `var(--sui-icon-soft-400)` | Decorativo, metadatos. | canon (CANON-SUI §4.1: soft-400 = lo que no es contenido, metadata terciaria) |
+| `var(--sui-icon-disabled-300)` | Deshabilitado. | canon (CANON-SUI §4.1: disabled-300 solo para disabled) |
 | `var(--sui-icon-white-0)` | Sobre fondo oscuro o de color. | propuesta |
 | un hex o un color de estado | No usar: si el ícono dice un estado, va en `sui-key-icon` `lighter`. | propuesta |
 
@@ -76,7 +76,10 @@ propios del DS (`info-custom-fill`, `heart-half-fill`…) también pasan por aqu
 En mobile se lee y se toca con el dedo, así que va más grande; en web, más chico. En las
 pantallas que se usan en los dos (panel del local, super admin) se elige con el servicio de
 breakpoints de la app (`bp`, en `services/breakpoints.service.ts`); en las que solo existen en
-el celular (cliente, repartidor) va directo el valor de mobile. Todo es **propuesta**.
+el celular (cliente, repartidor) va directo el valor de mobile. No se toca, así que la tablet va
+con el valor de web, y el celular chico (< 380 px) también (D16).
+Es **canon (dueño, 05-10-2026, P1 b)**: un paso más grande en el celular que en computadora, y
+se migra todo ahora, no solo al tocar cada pantalla.
 
 | uso | mobile | web |
 |---|---|---|

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

@@ -27,8 +27,9 @@ El archivo que entrega **no se sube tal cual**: pasa por `ImageCompressorService
 ## Qué variante usar
 
 > **La guía del DS no tiene página para este componente** (el «Image Upload» del Figma de origen
-> es otra cosa: la foto con botones, que en SUI es `sui-image-upload-profile`). Todo es
-> **propuesta, falta aprobación**.
+> es otra cosa: la foto con botones, que en SUI es `sui-image-upload-profile`). Las reglas
+> marcadas canon están aprobadas y las de «según el código» describen el componente; lo que sigue
+> en **propuesta** espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app` (sin prototipos ni vitrinas): **13 usos en
 > 10 pantallas**. `shape`: 11 `rect`, 2 `circle`. `size`: 7 `xl`, 3 `lg`, 3 sin size (fluidos).
@@ -38,16 +39,16 @@ El archivo que entrega **no se sube tal cual**: pasa por `ImageCompressorService
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `circle` (default) | **Solo la foto de una persona** (perfil del cliente, del repartidor, del usuario del local). Así se ve después en `sui-avatar`. | propuesta |
-| `rect` | **Todo lo demás**: el logo del local (en el home se ve como cuadrado redondeado), la portada, la foto del producto, comprobantes, QR, banners. | propuesta |
+| `circle` (default) | **Solo la foto de una persona** (perfil del cliente, del repartidor, del usuario del local). Así se ve después en `sui-avatar`. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `rect` | **Todo lo demás**: el logo del local (en el home se ve como cuadrado redondeado), la portada, la foto del producto, comprobantes, QR, banners. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 ### `size` y `fluid` — según la forma de la imagen
 
 | valor | px | cuándo | fuente |
 |---|---|---|---|
-| `fluid` | ancho del contenedor, alto hasta 320 | **Capturas y documentos** (comprobante, Yape, QR) y **imágenes apaisadas** (portada 16:9, banner). Una captura de celular es vertical: en un cuadrado se recorta. | propuesta |
-| `xl` | 200 | **Imágenes cuadradas**: logo, foto del producto, foto de perfil. | propuesta |
-| `lg` (default) | 160 | Imagen cuadrada al lado de otra cosa en la misma fila (el logo junto al nombre del local en web). | propuesta |
+| `fluid` | ancho del contenedor, alto hasta 320 | **Capturas y documentos** (comprobante, Yape, QR) y **imágenes apaisadas** (portada 16:9, banner). Una captura de celular es vertical: en un cuadrado se recorta. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `xl` | 200 | **Imágenes cuadradas**: logo, foto del producto, foto de perfil. | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| `lg` (default) | 160 | Imagen cuadrada al lado de otra cosa en la misma fila (el logo junto al nombre del local en web). | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | `md` | 120 | No usar: chico para ver si la foto quedó bien. | no usar |
 | `sm` | 80 | No usar: no entra el texto (el subtítulo se esconde). | no usar |
 
@@ -55,25 +56,25 @@ El archivo que entrega **no se sube tal cual**: pasa por `ImageCompressorService
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `true` | **Siempre.** Con imagen muestra dos botones a la vista: lápiz y tacho. El lápiz emite `editRequested`: si la pantalla tiene recortador, lo abre (`app-image-cropper`); si no, llama a `abrirSelector()` para elegir otra (como el Yape del repartidor). | propuesta |
+| `true` | **Siempre.** Con imagen muestra dos botones a la vista: lápiz y tacho. El lápiz emite `editRequested`: si la pantalla tiene recortador, lo abre (`app-image-cropper`); si no, llama a `abrirSelector()` para elegir otra (como el Yape del repartidor). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `false` (default) | No usar: con imagen, el lápiz aparece **solo al pasar el mouse** (en el celular no se ve) y el «Quitar» de abajo es un botón aparte (32 px). | no usar |
 
 ### Textos: `title`, `subtitle`
 
 | input | cuándo | fuente |
 |---|---|---|
-| `title` | Verbo + qué: «Subir logo», «Subir comprobante», «Subir captura del pago». | propuesta |
-| `subtitle` | Formatos y tamaño, **solo los que el componente acepta** (JPG, PNG, WebP, GIF o HEIC), o el encuadre que se va a aplicar («se recorta a 16:9»). Mientras procesa: «Procesando…». | propuesta |
+| `title` | Verbo en imperativo con tuteo + qué: «Sube tu logo», «Sube el comprobante», «Sube la captura del pago». Sin `title`: «Sube tu foto» (`circle`) o «Sube tu logo» (`rect`). | canon (dueño, 05-10-2026, P4 a); el default cambió en la 0.25.0 (antes «Subir foto» / «Subir logo») |
+| `subtitle` | Formatos y tamaño, **solo los que el componente acepta** (JPG, PNG, WebP, GIF o HEIC), o el encuadre que se va a aplicar («se recorta a 16:9»). Mientras procesa: «Procesando…». | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
 
 ### `maxSize`, `disabled`, `src`
 
 | input | cuándo | fuente |
 |---|---|---|
-| `maxSize` | Siempre, en **bytes**. 10 MB para capturas y comprobantes, 20–50 MB para fotos que se van a comprimir. | propuesta |
-| `disabled` | Mientras se comprime o se sube (`subiendo()`), para que no se elija otra encima. | propuesta |
-| `src` (model) | La URL guardada, o la vista previa local mientras se sube. Con `[(src)]` el componente la pone solo al elegir. | propuesta |
+| `maxSize` | Siempre, en **bytes**. 10 MB para capturas y comprobantes, 20–50 MB para fotos que se van a comprimir. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `disabled` | Mientras se comprime o se sube (`subiendo()`), para que no se elija otra encima. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `src` (model) | La URL guardada, o la vista previa local mientras se sube. Con `[(src)]` el componente la pone solo al elegir. | según el código |
 
-### Usos de hoy que rompen la propuesta
+### Usos de hoy que rompen la regla
 
 - **5 subtítulos prometen HEIC**: hasta el 03-10-2026 el componente lo rechazaba; desde la 0.22.0
   (la que usa la app) ya lo acepta, así que **ya no rompen nada**. Lo que queda es la vista previa en
@@ -108,14 +109,14 @@ que se toca a 44 sin cambiar el dibujo ni los sizes de hoy.
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| comprobante, captura, QR, portada, banner | `fluid` | `fluid` (en una columna de ≤ 480 px) | propuesta |
-| logo, foto de producto, foto de perfil | `xl` (200) | `xl` (200), o `lg` (160) al lado del nombre | propuesta |
+| comprobante, captura, QR, portada, banner | `fluid` | `fluid` (en una columna de ≤ 480 px) | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| logo, foto de producto, foto de perfil | `xl` (200) | `xl` (200), o `lg` (160) al lado del nombre | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | lápiz y tacho (`editable`) | se ven de 40 (32 en `sm`), se tocan en 44 de alto; a los lados el área crece la mitad del espacio entre los dos (3; 2 en `sm`) para no pisarse | 40 px | canon (dueño, 04-10-2026): piso táctil 44 en el teléfono (área) · canon (aprobado por el dueño, 03-10-2026), extensión SUI (40) |
 | «Quitar» (sin `editable`) | se ve de 32 (`sui-button` `xsmall`), se toca en 44 de alto: crece 4 hacia la foto (la mitad del gap de 8) y 8 hacia abajo | 32 px | canon (dueño, 04-10-2026): piso táctil 44 en el teléfono (área) · canon (aprobado por el dueño, 03-10-2026) |
 
 ```html
 <sui-image-upload shape="rect" [size]="bp.isMobile() ? 'xl' : 'lg'" [editable]="true"
-                  [src]="logo()" [maxSize]="50 * 1024 * 1024" title="Subir logo"
+                  [src]="logo()" [maxSize]="50 * 1024 * 1024" title="Sube tu logo"
                   subtitle="JPG, PNG o WebP — máx 50 MB"
                   (imageSelected)="alElegirLogo($event)" (editRequested)="abrirRecortador()"
                   (removed)="quitarLogo()" />
@@ -200,13 +201,13 @@ recortador; se llama con una referencia: `#qr` → `qr.abrirSelector()`).
 <!-- Comprobante: ancho completo, el lápiz elige otra captura -->
 <sui-image-upload #comprobante shape="rect" [fluid]="true" [editable]="true"
                   [src]="vistaPrevia()" [maxSize]="10 * 1024 * 1024"
-                  title="Subir comprobante" subtitle="Captura del Yape o del banco — máx 10 MB"
+                  title="Sube el comprobante" subtitle="Captura del Yape o del banco — máx 10 MB"
                   (imageSelected)="alElegir($event)" (editRequested)="comprobante.abrirSelector()"
                   (removed)="quitar()" />
 
 <!-- Foto del producto: cuadrada, el lápiz abre el recortador -->
 <sui-image-upload shape="rect" size="xl" [editable]="true" [src]="foto()"
-                  title="Subir foto" subtitle="JPG, PNG o WebP — se comprime sola"
+                  title="Sube tu foto" subtitle="JPG, PNG o WebP — se comprime sola"
                   (imageSelected)="alElegir($event)" (editRequested)="abrirRecortador()"
                   (removed)="quitarFoto()" />
 ```

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

@@ -27,7 +27,8 @@ chico (56–64 px) con su texto y los botones al lado, en una fila de un formula
 ## Qué variante usar
 
 > **La guía del DS no tiene página para este componente** (existe en el Figma de origen, sin
-> texto de uso). Todo es **propuesta, falta aprobación**.
+> texto de uso). Las reglas marcadas canon están aprobadas y las de «según el código» describen
+> el componente; lo que sigue en **propuesta** espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **0 usos**. La foto de perfil va con
 > `app-avatar-editor` (3 pantallas).
@@ -36,27 +37,27 @@ chico (56–64 px) con su texto y los botones al lado, en una fila de un formula
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `avatar` (default) | La foto de una persona. Vacío muestra una silueta. | propuesta |
-| `company` | Un negocio. Vacío muestra edificios. Ojo: lo muestra en círculo. | propuesta |
+| `avatar` (default) | La foto de una persona. Vacío muestra una silueta. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `company` | Un negocio. Vacío muestra edificios. Ojo: lo muestra en círculo. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 ### `alignment`
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `vertical` (default) | Con texto: título y requisitos («Mín. 400 × 400 px, PNG o JPEG»), avatar de 64. | propuesta |
-| `horizontal` | Sin texto, solo los botones al lado del avatar de 56. Cuando el label ya está arriba (`sui-form-label`). | propuesta |
+| `vertical` (default) | Con texto: título y requisitos («Mín. 400 × 400 px, PNG o JPEG»), avatar de 64. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `horizontal` | Sin texto, solo los botones al lado del avatar de 56. Cuando el label ya está arriba (`sui-form-label`). | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 ### Textos y estados
 
 | input | cuándo | fuente |
 |---|---|---|
-| `title` | Qué es: «Tu foto», «Foto de perfil». Solo se ve en `vertical`. | propuesta |
-| `subtitle` | Requisitos reales: formatos que se aceptan y para qué se usa («La ve el cliente cuando llevas su pedido»). | propuesta |
+| `title` | Qué es: «Tu foto», «Foto de perfil». Solo se ve en `vertical`. | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `subtitle` | Requisitos reales: formatos que se aceptan y para qué se usa («La ve el cliente cuando llevas su pedido»). | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
 | `labels` | Ya vienen en español con tuteo (Subir, Eliminar, Cambiar). Cambiarlos solo si el contexto pide otro verbo («Quitar»). | propuesta |
-| `imageUrl` | La URL guardada. Con imagen muestra Eliminar + Cambiar. | propuesta |
-| `companyLogoSrc` | Solo con `type="company"`: el logo, que gana sobre `imageUrl`. | propuesta |
-| `loading` | **Siempre** mientras se comprime y se sube: deshabilita los botones y atenúa la foto. | propuesta |
-| `disabled` | La persona no puede cambiarla (cuenta verificada con foto bloqueada). | propuesta |
+| `imageUrl` | La URL guardada. Con imagen muestra Eliminar + Cambiar. | según el código |
+| `companyLogoSrc` | Solo con `type="company"`: el logo, que gana sobre `imageUrl`. | según el código |
+| `loading` | **Siempre** mientras se comprime y se sube: deshabilita los botones y atenúa la foto. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `disabled` | La persona no puede cambiarla (cuenta verificada con foto bloqueada). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 
 Usos de hoy que rompen la regla: **0**.
 

package/docs/sui-img-retry/README.md

@@ -45,7 +45,7 @@ No tiene variantes ni inputs. Lo que hace:
 
 | dónde | regla | fuente |
 |---|---|---|
-| imágenes del Storage en el home y los listados del cliente | siempre con la directiva | propuesta (es donde está hoy, y donde se vio el bug del 10-07-2026: portadas grises tras un corte) |
+| imágenes del Storage en el home y los listados del cliente | siempre con la directiva | canon (aprobado por el dueño, 05-10-2026, bloque B9) — es donde está hoy, y donde se vio el bug del 10-07-2026: portadas grises tras un corte |
 | el resto de `<img>` remotos | sumarla cuando la imagen sea parte de la decisión (la foto del producto en la carta) | propuesta |
 
 ## Tamaño en mobile y en web

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

@@ -28,7 +28,7 @@ Regla corta: **un dato, en su lugar, que se corrige rápido → inline · varios
 ## Qué variante usar
 
 > **La guía del DS no tiene página para este componente.** Viene del Figma («Inline Input»).
-> Todo lo de abajo es **propuesta, falta aprobación**.
+> Las reglas de abajo son **canon (aprobado por el dueño, 05-10-2026)**; las filas «API» describen el componente.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **0 usos**. Hay listas con campos siempre
 > abiertos que se parecen (`pages/super-admin/master-settings/master-settings.html:101`, nombre de
@@ -38,11 +38,11 @@ Regla corta: **un dato, en su lugar, que se corrige rápido → inline · varios
 | prop / evento | cuándo | fuente |
 |---|---|---|
 | `value` | El dato. `[(value)]` o `formControlName`, nunca los dos. | API |
-| `placeholder` | Lo que se ve si está vacío: «Sin nombre». **Siempre**: el default genérico es «Escribe aquí…» (en español desde el 04-10-2026). | propuesta, falta aprobación |
-| `leftIcon` | Un ícono que dice qué dato es (`price-tag-3-line` para una categoría). `false` si el texto se explica solo. El default es `user-3-line`. | propuesta, falta aprobación |
-| `editLabel` | Nombre accesible del lápiz: «Editar nombre». | propuesta, falta aprobación |
-| `error` | El valor escrito no sirve (vacío, repetido). Solo se ve en edición; no trae mensaje. | propuesta, falta aprobación |
-| `disabled` | Mientras se guarda. | propuesta, falta aprobación |
+| `placeholder` | Lo que se ve si está vacío: «Sin nombre». **Siempre**: el default genérico es «Escribe aquí…» (en español desde el 04-10-2026). | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `leftIcon` | Un ícono que dice qué dato es (`price-tag-3-line` para una categoría). `false` si el texto se explica solo. El default es `user-3-line`. | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `editLabel` | Nombre accesible del lápiz: «Editar nombre». | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `error` | El valor escrito no sirve (vacío, repetido). Solo se ve en edición; no trae mensaje. | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `disabled` | Mientras se guarda. | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
 | `(confirm)` | Guardar. Llega el texto nuevo. | API |
 | `(cancel)` · `(edit)` | Volver atrás sin guardar · avisar que se empezó a editar. | API |
 

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

@@ -50,8 +50,8 @@ entera.
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| dentro de una frase | evitar: usar `sui-select` | 20 px, en línea con el texto | propuesta, falta aprobación |
-| al final de un `sui-input` | el alto lo da el input (`large`) | el alto lo da el input (`medium`) | propuesta, falta aprobación |
+| dentro de una frase | evitar: usar `sui-select` | 20 px, en línea con el texto | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
+| al final de un `sui-input` | el alto lo da el input (`large`) | el alto lo da el input (`medium`) | mobile (input `large`): canon (decisión del dueño 04-10-2026, piso táctil 44; ver `sui-input`) · web (input `medium`): canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 
 Las opciones del menú miden **36 px también en mobile**: a diferencia de `sui-select` y de los
 compactos, este no tiene la regla de 44 en ≤ 767 px (`sui-inline-select.scss` no la trae).

package/docs/sui-input/README.md

@@ -33,7 +33,7 @@ Regla corta: **una línea → input · varias → textarea · de una lista → s
 > escribir un valor de una sola línea y muestra ejemplos (ícono, tamaños, afijos, label y hint,
 > contraseña con ojo, contraseña con niveles, error, con botón, tarjeta, con select, con tags,
 > fecha y contador) sin do/don't. Lo marcado «según la guía del DS» sale de esos ejemplos; el
-> resto es **propuesta, falta aprobación**, salvo lo que ya es canon (CLAUDE.md, CANON-SUI).
+> resto es canon (CLAUDE.md, CANON-SUI o aprobado por el dueño el 05-10-2026); lo que sigue en **propuesta** espera decisión.
 >
 > Uso medido el 04-10-2026 en `master-pedidos/src/app` (misma exclusión que `sui-badge`, más
 > `master-ejercicios`): **195 usos en 61 archivos**. Tipos: 42 `text`, 36 sin `type` (`text`),
@@ -52,10 +52,10 @@ El `type` decide el teclado del teléfono y el filtro de teclas. Por dentro, `nu
 | `email` | Correo. Pide el teclado con `@`. Va con `autocomplete="email"`. | según la guía del DS (ejemplo con label y hint) |
 | `tel` | Celular peruano de 9 dígitos, con `[maxlength]="9"` y placeholder `987 654 321`. | según la guía del DS (tipo nativo); el formato es propuesta |
 | `amount` | **Todo monto en soles**, siempre con `prefix="S/"` y placeholder `0.00`. Pone comas de miles y dos decimales al salir. | canon (CANON-SUI §5.5, 27-07-2026) |
-| `number` | Un entero que no es dinero: minutos, kilómetros, cupos, porcentaje. Si es dinero, `amount`. | propuesta, falta aprobación |
+| `number` | Un entero que no es dinero: minutos, kilómetros, cupos, porcentaje. Si es dinero, `amount`. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 | `search` | **Todo buscador.** Pide la lupa en el teclado sola (y no lleva `inputmode`). | canon (CLAUDE.md «La lupa del teclado», 14-08-2026) |
 | `password-toggle` | **Toda contraseña**: login y registro. El ojo deja revisar lo escrito en el teléfono. | según la guía del DS (sus dos ejemplos de contraseña traen el ojo) |
-| `password` | No usar: sin ojo, en el teléfono no se puede revisar lo tipeado. | propuesta, falta aprobación |
+| `password` | No usar: sin ojo, en el teléfono no se puede revisar lo tipeado. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 | `date` / `datetime-local` | Una fecha suelta en un formulario del panel («Válido hasta», «Fecha del gasto»). Abre el selector nativo. Para un calendario propio, ver `sui-datepicker`. | propuesta, falta aprobación |
 | `url` | Un enlace (imagen de campaña). | según la guía del DS (ejemplo con afijo `https://`) |
 | `card` | No usar hoy: no hay pago con tarjeta. | según la guía del DS (ejemplo «Payment Input») |
@@ -74,21 +74,21 @@ El `type` decide el teclado del teléfono y el filtro de teclas. Por dentro, `nu
 | `sublabel` | **«(Opcional)»**, entre paréntesis, en un campo que no es obligatorio, en vez de escribir «(opcional)» en el label. También «(No editable)». El componente no pone los paréntesis: sin ellos queda pegado («ReferenciaOpcional»). | según la guía del DS (`(Optional)`) y canon (README de `sui-form-label`) |
 | `tooltip` | Una aclaración que no entra en el hint. Hoy sin uso. | según la guía del DS (ícono de info del label) |
 | `hint` | Una línea que ayuda a llenar bien: «9 dígitos, empezando con 9», «Mínimo 6 caracteres». | según la guía del DS |
-| `hintIcon` | No usar hoy: el hint se lee solo; el ícono suma ruido en formularios largos. | propuesta, falta aprobación |
+| `hintIcon` | No usar hoy: el hint se lee solo; el ícono suma ruido en formularios largos. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 | `error` + `errorMessage` | El error va **con** su mensaje, que reemplaza al hint. `error` solo pinta el borde. | según la guía del DS (`Has Error`) |
 | `placeholder` | Un ejemplo del formato, no el nombre del campo: «987 654 321», «Ej: Av. Perú 224», «0.00». Elipsis `…`, no `...`. | canon (CANON-SUI §5.2 y §5.5) |
 | `prefix` | `S/` en los montos. Nada más hoy. | canon (CANON-SUI §5.5) |
-| `icon` + `iconPosition` | `search-line` a la izquierda en buscadores; `map-pin-2-line` en un campo de dirección de solo lectura. `right` no tiene caso hoy. | según la guía del DS (ejemplo con ícono); el «cuándo» es propuesta |
+| `icon` + `iconPosition` | `search-line` a la izquierda en buscadores; `map-pin-2-line` en un campo de dirección de solo lectura. `right` no tiene caso hoy. | según la guía del DS (ejemplo con ícono); el «cuándo»: canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `showClear` | Buscadores: la X borra la búsqueda de un toque. | propuesta, falta aprobación (ya lo hacen los 3 buscadores del cliente) |
-| `fullRadius` | Solo el buscador principal del cliente (home, carta del local, rubro), que va encima de chips redondos. Los formularios, con el radio normal. | propuesta, falta aprobación (ya es práctica: `pages/customer/store-browser/store-browser.html:43`) |
+| `fullRadius` | Solo el buscador principal del cliente (home, carta del local, rubro), que va encima de chips redondos. Los formularios, con el radio normal. | canon (aprobado por el dueño, 05-10-2026, bloque B9) (ya es práctica: `pages/customer/store-browser/store-browser.html:43`) |
 | `maxlength` | Teléfono (9), nombres con tope, códigos. | propuesta, falta aprobación |
 | `inputmode` | Solo cuando el `type` no pide el teclado correcto: un DNI o un número de cuenta en `type="text"` → `numeric`. **Nunca `search`.** | canon (CLAUDE.md «La lupa del teclado», 14-08-2026) |
 | `enterkeyhint` | `next` en formularios de varios pasos, `send` en un chat, `done` en el último campo. El buscador ya pide `search` solo. | propuesta, falta aprobación |
-| `autocomplete` | Siempre en datos de la persona: `name`, `given-name`, `email`, `tel`, `current-password`, `new-password`. `off` en buscadores. | propuesta, falta aprobación |
-| `readonly` | Un dato que se muestra en forma de campo pero se elige en otro lado (el distrito que sale del mapa). | propuesta, falta aprobación |
+| `autocomplete` | Siempre en datos de la persona: `name`, `given-name`, `email`, `tel`, `current-password`, `new-password`. `off` en buscadores. | canon (aprobado por el dueño, 05-10-2026, bloque B5) |
+| `readonly` | Un dato que se muestra en forma de campo pero se elige en otro lado (el distrito que sale del mapa). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `disabled` | Mientras se envía, o cuando el campo no aplica todavía. | según la guía del DS |
 | `min` / `max` | **No hacen nada** (el `<input>` real es `text`). Validar en el componente que lo usa. | código del DS |
-| `paste` | `false` solo si pegar un monto armaría un valor equivocado. Hoy sin uso. | propuesta, falta aprobación |
+| `paste` | `false` solo si pegar un monto armaría un valor equivocado. Hoy sin uso. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `closeOnOutsideClick` | Déjalo en `true`: tocar fuera baja el teclado. `false` solo si la pantalla maneja el foco a mano (1 uso). | código del DS |
 | `leadingControl` / `trailingControl` / `leadingDivider` / `trailingDivider` | Componer un control adentro: el país del teléfono (`sui-compact-select-for-input` en `[data-slot=start]`) o una acción al lado. Hoy sin uso. | según la guía del DS (ejemplos «With Select» y «With Button») |
 
@@ -114,10 +114,10 @@ teléfono también va en 16 en todos los tamaños (antes se quedaba en 14 al lad
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| campo de formulario | `large` (48), igual que el botón del footer | `medium` (40) | propuesta, falta aprobación |
-| buscador principal del cliente (home, carta, rubro) | `xlarge` (52) + `fullRadius` | `xlarge` + `fullRadius` | propuesta (ya es práctica en las 3 pantallas) |
-| buscador o filtro de una lista del panel | `large` (48) | `small` (36) | propuesta (ya es práctica en `pages/orders/orders.html:72`) |
-| campo dentro de una tabla o fila densa | no aplica | `xsmall` (32) | según la guía del DS |
+| campo de formulario | `large` (48), igual que el botón del footer | `medium` (40) | mobile `large`: canon (decisión del dueño 04-10-2026, piso táctil 44: `medium` 40 no llega y `large` 48 es el primer size que sí) · web `medium`: canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| buscador principal del cliente (home, carta, rubro) | `xlarge` (52) + `fullRadius` | `xlarge` + `fullRadius` | canon (aprobado por el dueño, 05-10-2026, bloque B1) (ya es práctica en las 3 pantallas) |
+| buscador o filtro de una lista del panel | `large` (48) | `medium` (40) | mobile `large`: canon (decisión del dueño 04-10-2026, piso táctil 44: `large` 48 es el primer size que llega) · web `medium`: canon (dueño, 05-10-2026, D16) (hoy `pages/orders/orders.html:72` va en `small`: se migra) |
+| campo dentro de una tabla o fila densa | no aplica | `medium` (40) | canon (dueño, 05-10-2026, D16): nada en `xsmall` (la guía del DS lo usa ahí) |
 
 ```html
 <sui-input [size]="bp.isMobile() ? 'large' : 'medium'" label="Teléfono" type="tel" … />
@@ -148,7 +148,7 @@ en la columna de la derecha, se usa.
 | `iconPosition="right"` | el ícono de la derecha se confunde con una acción | un dato con unidad visual (un ícono de moto en «Placa») |
 | `paste=false` | pegar ayuda más de lo que rompe | un monto que llega con formato raro desde otra app |
 | afijos con control (`leadingControl`…) | solo hay teléfonos de Perú (+51) | teléfono con código de país, o monto con moneda (ver `sui-compact-select-for-input`) |
-| `size="xsmall"` | no hay campos dentro de tablas | edición rápida de un precio dentro de una tabla del panel |
+| `size="xsmall"` | es chico (D16, 05-10-2026) | nunca: la edición rápida de un precio dentro de una tabla va `medium` |
 
 ## API
 

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

@@ -38,26 +38,26 @@ Regla corta: **servicio externo que se prende y se configura → integration-swi
 
 | combinación | cuándo | fuente |
 |---|---|---|
-| `horizontal` · `card` (default) | Una integración suelta en una pantalla de ajustes de web. | propuesta |
-| `vertical` · `card` | Una grilla de integraciones, o la misma en mobile (el «Administrar» baja a ancho completo). | propuesta |
-| `horizontal` · `list` | Una lista de integraciones dentro de una card que ya pone el borde. | propuesta |
-| `vertical` · `list` | Ver «No usar». | propuesta |
+| `horizontal` · `card` (default) | Una integración suelta en una pantalla de ajustes de web. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `vertical` · `card` | Una grilla de integraciones, o la misma en mobile (el «Administrar» baja a ancho completo). | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `horizontal` · `list` | Una lista de integraciones dentro de una card que ya pone el borde. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `vertical` · `list` | Ver «No usar». | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 ### Las piezas
 
 | prop | cuándo | fuente |
 |---|---|---|
-| `title` | Siempre. El nombre del servicio: «WhatsApp Business». | propuesta |
-| `description` | Qué hace conectarlo, en una línea: «Avisa al cliente por WhatsApp cuando su pedido sale del local.» | propuesta |
-| `brandIconSrc` | El logo del servicio (`assets/brand/brand-logos/<marca>-original.svg`). | propuesta |
-| `brandIcon` | Un ícono Remix cuando no hay logo. | propuesta |
-| logo proyectado `[sui-integration-brand]` | Un `sui-brand-logo` u otro elemento propio. | propuesta |
-| `manage` (`true`, dice «Administrar») | Siempre que el servicio tenga configuración. El default ya está en español (03-10-2026). | propuesta |
-| `[manage]="false"` | El servicio no se configura: solo se prende. | propuesta |
-| `showToggle=false` | Se administra pero no se apaga desde aquí. | propuesta |
-| `badge` | Integración nueva. Con string sale naranja `light`; pasa el objeto (`purple` para lo nuevo, según el badge). | propuesta |
-| `disabled` | Falta un dato para conectarla (el RUC, la cuenta). | propuesta |
-| `[active]` + `(activeChange)` | El estado. | propuesta |
+| `title` | Siempre. El nombre del servicio: «WhatsApp Business». | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `description` | Qué hace conectarlo, en una línea: «Avisa al cliente por WhatsApp cuando su pedido sale del local.» | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `brandIconSrc` | El logo del servicio (`assets/brand/brand-logos/<marca>-original.svg`). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `brandIcon` | Un ícono Remix cuando no hay logo. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| logo proyectado `[sui-integration-brand]` | Un `sui-brand-logo` u otro elemento propio. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `manage` (`true`, dice «Administrar») | Siempre que el servicio tenga configuración. El default ya está en español (03-10-2026). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `[manage]="false"` | El servicio no se configura: solo se prende. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `showToggle=false` | Se administra pero no se apaga desde aquí. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `badge` | Integración nueva. Con string sale naranja `light`; pasa el objeto (`purple` para lo nuevo, según el badge). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `disabled` | Falta un dato para conectarla (el RUC, la cuenta). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `[active]` + `(activeChange)` | El estado. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 
 **Usos de hoy que rompen las reglas:** 0 (no hay usos).
 

package/docs/sui-kbd/README.md

@@ -23,7 +23,7 @@ cerrar, las flechas y el enter al pie de un menú.
 
 > **La guía del DS tiene una sola variante** (la tecla con texto) y la muestra dentro del
 > buscador del command menu. Lo marcado «según la guía del DS» sale de ahí; el resto es
-> **propuesta, falta aprobación**.
+> **canon (aprobado por el dueño, 05-10-2026)**.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **0 usos directos**. Lo usan por dentro
 > `sui-command-menu-search`, `sui-command-menu-item`, `sui-command-menu-footer`, `sui-filter`,
@@ -40,7 +40,7 @@ cerrar, las flechas y el enter al pie de un menú.
 | valor | cuándo | fuente |
 |---|---|---|
 | `default` | Tecla con texto: ⌘K, Esc. | según la guía del DS |
-| `subtle` | Tecla con un ícono de 16 px (flechas, enter) al pie de un menú. Extensión de SUI (sale del Figma del command menu). | propuesta |
+| `subtle` | Tecla con un ícono de 16 px (flechas, enter) al pie de un menú. Extensión de SUI (sale del Figma del command menu). | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 Usos de hoy que rompen la regla: **0**.
 
@@ -49,7 +49,7 @@ Usos de hoy que rompen la regla: **0**.
 No es táctil: es una tecla dibujada. En mobile no hay teclado físico, así que no se muestra; en
 web tiene un solo tamaño. Donde la pantalla existe en los dos (panel del local, super admin) se
 oculta con el servicio de breakpoints de la app (`bp`, en `services/breakpoints.service.ts`). Todo
-es **propuesta**.
+es **canon (aprobado por el dueño, 05-10-2026, bloque B7)**.
 
 | uso | mobile | web |
 |---|---|---|