@ajuarezso/sui-design-system 0.24.1 → 0.25.0

package/docs/sui-tab-menu-vertical/README.md

@@ -23,7 +23,7 @@ de pago · Repartidores»), el perfil del super admin.
 - 2 a 4 secciones arriba del contenido: `sui-tab-menu-horizontal`.
 - Filtros de una lista: `sui-tab-chips`.
 
-Regla corta (propuesta, falta aprobación): **secciones de una página de ajustes en web → tab menu
+Regla corta (canon, aprobado por el dueño, 05-10-2026, bloque B7): **secciones de una página de ajustes en web → tab menu
 vertical · en mobile → lista de filas que abren pantalla.**
 
 ## Qué variante usar
@@ -39,14 +39,14 @@ vertical · en mobile → lista de filas que abren pantalla.**
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `card` | El menú flota junto al contenido sobre un fondo gris (`bg-weak-50`): el borde y la sombra lo separan. | según la guía del DS (ejemplo «contenedor con estilo»); el cuándo es propuesta |
-| `list` | El menú vive dentro de una columna que ya tiene fondo o borde propio (una card, un panel). | según la guía del DS (ejemplo base); el cuándo es propuesta |
+| `card` | El menú flota junto al contenido sobre un fondo gris (`bg-weak-50`): el borde y la sombra lo separan. | según la guía del DS (ejemplo «contenedor con estilo»); el cuándo: canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `list` | El menú vive dentro de una columna que ya tiene fondo o borde propio (una card, un panel). | según la guía del DS (ejemplo base); el cuándo: canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 
 ### `dividerLabel`
 
 | valor | cuándo | fuente |
 |---|---|---|
-| vacío (default) | Un solo grupo de secciones. | propuesta, falta aprobación |
+| vacío (default) | Un solo grupo de secciones. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | texto | Nombra el grupo cuando hay más de un menú apilado («Tu local» · «Tu cuenta»). Sale en MAYÚSCULAS y gris. | según la guía del DS (ejemplo con título) |
 
 ### Ítems (`tabs`)
@@ -54,10 +54,10 @@ vertical · en mobile → lista de filas que abren pantalla.**
 | qué | cuándo | fuente |
 |---|---|---|
 | texto | El nombre de la sección. Una o dos palabras; si es más largo, se corta con «…». | según la guía del DS (ejemplos con texto) |
-| `icon` | Sí, en todos los ítems: en un menú lateral el ícono ayuda a encontrar rápido. El activo se pinta naranja. | propuesta, falta aprobación |
-| `number` | Pendientes que piden acción en esa sección (círculo rojo). | propuesta, falta aprobación |
+| `icon` | Sí, en todos los ítems: en un menú lateral el ícono ayuda a encontrar rápido. El activo se pinta naranja. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `number` | Pendientes que piden acción en esa sección (círculo rojo). | canon (aprobado por el dueño, 05-10-2026, bloque B3) |
 | `rightIcon` | Cuando el ítem lleva a otra página en vez de cambiar el panel de al lado. | propuesta, falta aprobación |
-| `disabled` | Una sección que depende del plan. | propuesta, falta aprobación |
+| `disabled` | Una sección que depende del plan. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 
 Usos de hoy que rompen las reglas: **0** (no se usa).
 
@@ -68,7 +68,7 @@ Usos de hoy que rompen las reglas: **0** (no se usa).
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| secciones de ajustes | no se usa: lista de filas que abren pantalla | `tab-menu-vertical` | propuesta, falta aprobación |
+| secciones de ajustes | no se usa: lista de filas que abren pantalla | `tab-menu-vertical` | «no se usa en mobile»: canon (dueño, 04-10-2026): piso táctil 44 en el teléfono — el ítem mide 36 y no tiene `size` · la lista de filas en mobile y el uso en web: canon (aprobado por el dueño, 05-10-2026, bloque B7) |
 
 ```html
 @if (!bp.isMobile()) {

package/docs/sui-table/README.md

@@ -32,9 +32,9 @@ Regla corta: **comparar por columnas → tabla · leer de a uno → tarjetas ·
 > estructura de dos dimensiones donde cada fila es un ítem y cada columna un dato del ítem»,
 > muestra un solo ejemplo (un directorio de personas **con selección por checkbox**), le pone
 > `overflow-x-auto` al contenedor y deriva el orden, la selección y la paginación a una
-> librería externa. No trae do/don't, tamaños ni comportamiento en mobile. Casi todo lo de
-> abajo es **práctica de la app** o **propuesta, falta aprobación**; lo marcado «canon» sale de
-> `master-pedidos/CLAUDE.md` o de `docs/CANON-SUI.md`.
+> librería externa. No trae do/don't, tamaños ni comportamiento en mobile. Lo de abajo es
+> **práctica de la app**, **canon** (sale de `master-pedidos/CLAUDE.md`, de `docs/CANON-SUI.md` o lo
+> aprobó el dueño el 05-10-2026) o **propuesta, falta aprobación**, que espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **9 tablas** en 7 pantallas, sin contar
 > prototipos ni vitrinas (`master-preview`, `master-prototipos`, `mockup-sheets-*`, `dx/*`,
@@ -55,9 +55,9 @@ Regla corta: **comparar por columnas → tabla · leer de a uno → tarjetas ·
 | prop de columna | cuándo | ejemplo real de la app | fuente |
 |---|---|---|---|
 | `priority: 'leading'` + `descriptionKey` | La **primera** columna: el dato que identifica la fila arriba (14/500) y un dato de apoyo debajo (12/400). Se usa en vez de una plantilla propia para la columna principal. | `pages/orders/orders.ts:278` (pedido + «hace 12 min») · `pages/super-admin/master-orders/master-orders.ts:390` | práctica de la app (7 de 9 tablas) |
-| `priority: 'passive'` | Datos de contexto que no deciden nada: fecha, número de comprobante. Se leen en gris (`text-sub-600`). | `pages/super-admin/master-overview/master-overview.ts:192` | propuesta, falta aprobación |
+| `priority: 'passive'` | Datos de contexto que no deciden nada: fecha, número de comprobante. Se leen en gris (`text-sub-600`). | `pages/super-admin/master-overview/master-overview.ts:192` | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
 | `priority: 'none'` | Columna de acciones (íconos) sin texto propio. Con `label: ''` y `width` fijo. | `pages/super-admin/master-gastos/master-gastos.ts:143` | práctica de la app |
-| `align: 'right'` | Montos. Así se comparan en vertical. | `pages/central/central-gastos/central-gastos.ts:82` | propuesta, falta aprobación |
+| `align: 'right'` | Montos. Así se comparan en vertical. | `pages/central/central-gastos/central-gastos.ts:82` | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `width` | Columnas de largo fijo: monto, estado, fecha, acciones. | `central-gastos.ts:82-83` | práctica de la app |
 | `minWidth` | Columnas de texto que crecen (nombre, concepto): el piso para que no se aplasten. | `master-orders.ts:392` | práctica de la app |
 | `maxWidth` + `truncate` | Nombres que pueden ser muy largos: corta con «…» y el valor completo sale en tooltip. | `master-overview.ts:193` | práctica de la app |
@@ -72,10 +72,10 @@ Dentro va un componente SUI, no HTML a mano:
 
 | contenido | componente | fuente |
 |---|---|---|
-| estado o categoría | `<sui-badge variant="lighter" size="small">` | canon (CANON-SUI §0: «Chip de estado») |
-| acciones de la fila | `<sui-button variant="ghost" color="neutral" size="2xsmall" [onlyIcon]="true">` | canon (README de `sui-button`: tabla densa = `2xsmall`) |
+| estado o categoría | `<sui-badge variant="lighter" size="medium">` | canon (dueño, 05-10-2026, D16); CANON-SUI §0 («Chip de estado») todavía dice `small`: hay que actualizarlo en master-pedidos |
+| acciones de la fila | `<sui-button variant="ghost" color="neutral" size="medium" [onlyIcon]="true">` | canon (dueño, 05-10-2026, D16) (README de `sui-button`: en una tabla, `medium`; antes `2xsmall`) |
 | prender/apagar | `<sui-switch>` | propuesta, falta aprobación |
-| calificación | `<sui-rating>` de solo lectura | propuesta, falta aprobación |
+| calificación | `<sui-rating>` de solo lectura | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 
 Si la columna tiene plantilla, `descriptionKey` y `truncate` **no se aplican**: solo funcionan en
 el render de texto plano. Por eso `orders.html:94` deja la columna del pedido sin plantilla.
@@ -119,16 +119,16 @@ secundaria dentro de un tablero) y 6 sin `size` (o sea `medium`).
 |---|---|---|---|
 | tabla principal de una pantalla | `medium` | `medium` | práctica de la app |
 | tabla secundaria dentro de un tablero | `small` | `small` | práctica de la app (1 uso) |
-| filas con dos líneas y un badge | `medium` | `medium` | propuesta, falta aprobación |
+| filas con dos líneas y un badge | `medium` | `medium` | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 
 El patrón `[size]="bp.isMobile() ? 'large' : 'medium'"` de los botones **no aplica aquí**: la fila
 ya mide 64 y el toque es sobre toda la fila. `large`/`xlarge` no tienen uso hoy.
 
 **Qué pasa en mobile (≤ 767 px):** la tabla scrollea en horizontal dentro de sí misma; la
 cabecera y el cuerpo miden lo mismo y la barra de scroll se oculta. En la app conviven dos
-salidas, y las dos son práctica, no regla:
+salidas, y cuándo va cada una ya es regla:
 
-| salida | dónde | cuándo elegirla (propuesta) |
+| salida | dónde | cuándo elegirla (canon (aprobado por el dueño, 05-10-2026, bloque B7)) |
 |---|---|---|
 | la misma tabla, con scroll lateral | `orders`, `master-orders`, `central-gastos`, `central-ingresos` | 3-4 columnas, y la primera (`leading`) ya dice casi todo |
 | tarjetas en grilla por debajo de 1350 px | `drivers` (`drivers.ts:282`), `master-gastos` | 6+ columnas: con el sidebar abierto no entran ni en laptop ni en iPad |
@@ -268,12 +268,12 @@ trabajo de la página.
     emptyMessage="Sin pedidos en este estado."
     (rowClicked)="abrirDetalle($event)">
     <ng-template suiTableCell="estado" let-row>
-      <sui-badge [color]="row.color" variant="lighter" size="small">{{ row.estadoLabel }}</sui-badge>
+      <sui-badge [color]="row.color" variant="lighter" size="medium">{{ row.estadoLabel }}</sui-badge>
     </ng-template>
   </sui-table>
 
   @if (hayMas()) {
-    <sui-button variant="stroke" color="neutral" [size]="bp.isMobile() ? 'large' : 'small'"
+    <sui-button variant="stroke" color="neutral" [size]="bp.isMobile() ? 'large' : 'medium'"
                 [disabled]="cargandoMas()" (click)="cargarMas()">Cargar más</sui-button>
   }
 </sui-card>

package/docs/sui-tag/README.md

@@ -35,7 +35,7 @@ tab-chips o segmented-control.**
 > **La guía del DS dice para qué es, no cuándo usar cada estilo.** Su página lo define como
 > «categorizar y etiquetar contenido» y muestra `stroke` (default), `gray`, deshabilitado, con
 > imagen, con avatar y con botón de quitar. No trae do/don't. Lo marcado «según la guía del DS»
-> sale de ahí; el resto es **propuesta, falta aprobación**.
+> sale de ahí; lo marcado canon lo aprobó el dueño; el resto es **propuesta, falta aprobación** y espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: **0 tags**, sin contar prototipos ni
 > vitrinas (`master-preview`, `master-prototipos`, `mockup-sheets-*`, `dx/*`, `_guia-*`,
@@ -48,12 +48,12 @@ tab-chips o segmented-control.**
 | `tagStyle` | `stroke` (default) | Lo normal. Sirve sobre cualquier fondo (blanco o gris claro). | — | según la guía del DS (default) |
 | `tagStyle` | `gray` | Solo sobre blanco, cuando hay muchos tags juntos y el borde hace ruido. **Sobre gris claro desaparece.** | Varios filtros aplicados en fila | propuesta, falta aprobación |
 | `dismissible` | `true` | Lo que se nombra se puede quitar. Emite `(dismiss)`; la pantalla lo saca. | «Abierto ahora ✕» | según la guía del DS |
-| `dismissLabel` | texto | Siempre «Quitar» + el nombre: el lector de pantalla no ve el texto del tag desde la X. | `dismissLabel="Quitar Abierto ahora"` | propuesta, falta aprobación |
+| `dismissLabel` | texto | Siempre «Quitar» + el nombre: el lector de pantalla no ve el texto del tag desde la X. | `dismissLabel="Quitar Abierto ahora"` | canon (aprobado por el dueño, 05-10-2026, bloque B5) |
 | `leading` + `[data-slot=start]` | avatar | Nombra a una persona o un local. | «Burger House» con su logo | según la guía del DS (con avatar, con imagen) |
 | `leading` + `[data-slot=start]` | ícono de 16 | El ícono dice qué tipo de dato es. | «Andahuaylas» con un pin | según la guía del DS (`Tag.Icon`) |
 | `sublabel` | texto | Cuántos resultados trae ese filtro, entre paréntesis. | «Pollerías (12)» | propuesta, falta aprobación |
-| `disabled` | `true` | **No usar** hoy (ver abajo). | — | según la guía del DS (existe) · propuesta (cuándo) |
-| `interactive` | `true` | **No usar** hoy (ver abajo). | — | propuesta, falta aprobación |
+| `disabled` | `true` | **No usar** hoy (ver abajo). | — | según la guía del DS (existe) · canon (aprobado por el dueño, 05-10-2026, bloque B6) (cuándo) |
+| `interactive` | `true` | **No usar** hoy (ver abajo). | — | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 Usos de hoy que rompen la regla: **0** (no hay usos).
 
@@ -67,10 +67,13 @@ Usos de hoy que rompen la regla: **0** (no hay usos).
 
 ## Tamaño en mobile y en web
 
-Criterio de la app: **en mobile se lee y se toca con el dedo, así que va más grande; en web
-(desktop), más chico.** Mobile es `≤ 767 px`, el mismo corte de `BreakpointsService.isMobile()`
-en master-pedidos. Fuente: canon del dueño (03-10-2026), el mismo patrón que ya usan 27 controles
-de la app.
+Criterio de la app: **D16, tamaño por dispositivo** (canon, dueño, 05-10-2026), que reemplaza al
+«tamaño por plataforma» del 03-10-2026 (mobile grande, web chico). La columna «mobile» es el celular de
+380 px o más y, en lo que se toca, también la tablet (`pointer: coarse`). La columna «web» es la
+computadora (`pointer: fine`) y, en lo que no se toca, también la tablet. En el celular chico
+(< 380 px) va `medium` a la vista, sin achicar el área de 44 de lo que se toca. **Nada en `small` ni
+`xsmall`**, salvo lo que el componente solo tiene en chico. Hoy la app corta con
+`BreakpointsService.isMobile()` (≤ 767 px), que todavía no mira el puntero ni los 380 px.
 
 | size | alto | texto | leading | X de quitar (área táctil) |
 |---|---|---|---|---|
@@ -94,9 +97,9 @@ máximo se sigue cortando, y la X queda siempre visible.
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| Tag con X (filtro aplicado, elegido que se quita) | `xlarge` (40) | `medium` (24) | propuesta: el tamaño es extensión SUI aprobada (03-10-2026); el «cuándo» falta aprobarlo |
-| Tag de solo lectura (sin X) | `large` (32) | `medium` (24) | propuesta: el tamaño es extensión SUI aprobada (03-10-2026); el «cuándo» falta aprobarlo |
-| Separación entre tags | 8 px | 4–6 px | propuesta, falta aprobación |
+| Tag con X (filtro aplicado, elegido que se quita) | `xlarge` (40) | `medium` (24) | mobile: canon (dueño, 04-10-2026): piso táctil 44 en el teléfono — solo la X de `xlarge` llega a 44 · web: canon (dueño, 05-10-2026, D16) (`medium` es el más chico que tiene) |
+| Tag de solo lectura (sin X) | `large` (32) | `medium` (24) | canon (dueño, 05-10-2026, P1 b); el tamaño es extensión SUI aprobada (03-10-2026) |
+| Separación entre tags | 8 px | 4–6 px | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 
 ```html
 <sui-tag [size]="bp.isMobile() ? 'xlarge' : 'medium'" [dismissible]="true" (dismiss)="quitar(f)">{{ f.nombre }}</sui-tag>

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

@@ -35,11 +35,11 @@ Regla corta: **varios valores libres → tag-input · varias opciones fijas →
 | prop / evento | cuándo | fuente |
 |---|---|---|
 | `label` · `required` · `sublabel` · `tooltip` · `hint` | Igual que `sui-input`. El hint dice cómo se agrega: «Escribe y presiona Enter». | según la guía del DS (ejemplo con label «Tag Input») |
-| `placeholder` | **Siempre** que el default genérico («Agrega una etiqueta…», 04-10-2026) no diga qué se agrega: «Agrega una palabra…». | propuesta, falta aprobación |
-| `commaSeparator` | `true` cuando la gente ya escribe con comas (rubros, sinónimos). | propuesta, falta aprobación |
-| `addOnBlur` | `true` en mobile: si sale del campo sin Enter, lo escrito no se pierde. | propuesta, falta aprobación |
-| `maxTags` | Cuando hay un tope real. Hoy no hay. | propuesta, falta aprobación |
-| `allowDuplicates` | `false` (default). | propuesta, falta aprobación |
+| `placeholder` | **Siempre** que el default genérico («Agrega una etiqueta…», 04-10-2026) no diga qué se agrega: «Agrega una palabra…». | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `commaSeparator` | `true` cuando la gente ya escribe con comas (rubros, sinónimos). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `addOnBlur` | `true` siempre, en mobile y en web: si sale del campo sin Enter, lo escrito no se pierde. | canon (aprobado por el dueño, 05-10-2026, bloque B13) |
+| `maxTags` | Cuando hay un tope real. Hoy no hay. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `allowDuplicates` | `false` (default). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `rightIcon` | No usar hoy (ícono de info a la derecha). | — |
 | `error` + `errorMessage` | Falta al menos un valor en un campo obligatorio. | según la guía del DS (estado de error del Figma) |
 | `disabled` | Mientras se guarda. | API |
@@ -79,7 +79,7 @@ en web; el alto sigue en 48/52.
 | `rightIcon` | el hint explica mejor | — |
 | `maxTags` | no hay topes | un máximo de 5 palabras clave por producto |
 | `allowDuplicates` | repetir no sirve | — |
-| `size` `xsmall` / `small` | no hay tag-inputs en tablas | un filtro denso del panel |
+| `size` `xsmall` / `small` | son chicos (D16, 05-10-2026) | nunca: un filtro denso del panel también va `medium` |
 
 ## API
 

package/docs/sui-textarea/README.md

@@ -47,13 +47,13 @@ Regla corta: **se redacta y puede pasar de una línea → textarea · una línea
 | `hint` | Para quién es el texto: «Lo va a leer el cliente», «Solo lo ve tu equipo». | según la guía del DS (ejemplo con hint) |
 | `error` + `errorMessage` | Motivo obligatorio vacío. El mensaje reemplaza al hint y el contador se pone rojo. | según la guía del DS (`Has Error`) |
 | `placeholder` | Un ejemplo de lo que se espera: «Ej. frágil, tocar el timbre, entregar en recepción». Elipsis `…`. | canon (CANON-SUI §5.2) |
-| `maxLength` | **Siempre que otro lo va a leer** (cliente, repartidor, local) o se guarda en la base: muestra «n/200» y corta el exceso. 200 para motivos y notas; 500 para descripciones. | según la guía del DS (su ejemplo principal lleva contador); los topes son propuesta |
-| `size` | El mismo de los inputs del formulario: `large` en mobile, `medium` en web. Ver «Tamaño en mobile y en web». | canon (aprobado por el dueño, 03-10-2026), extensión SUI; el «cuándo» es propuesta, falta aprobación |
-| `rows` | `3` para motivos y notas (el default del componente es `4`). `2` para una nota corta en un formulario largo. `4` o más solo para una descripción larga. | propuesta, falta aprobación |
-| `resizable` | `true` en web. En mobile **`false`**: la manija no se puede arrastrar con el dedo y parece un adorno. | según la guía del DS (versión con y sin manija); el «cuándo» es propuesta |
-| `readonly` | Mostrar un texto ya enviado con la misma forma del campo (copiar un mensaje). | propuesta, falta aprobación |
+| `maxLength` | **Siempre que otro lo va a leer** (cliente, repartidor, local) o se guarda en la base: muestra «n/200» y corta el exceso. 200 para motivos y notas; 500 para descripciones. | según la guía del DS (su ejemplo principal lleva contador); los topes: canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `size` | El mismo de los inputs del formulario: `large` en mobile, `medium` en web. Ver «Tamaño en mobile y en web». | canon (aprobado por el dueño, 03-10-2026), extensión SUI; el «cuándo»: canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| `rows` | `3` para motivos y notas (el default del componente es `4`). `2` para una nota corta en un formulario largo. `4` o más solo para una descripción larga. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `resizable` | `true` en web. En mobile **`false`**: la manija no se puede arrastrar con el dedo y parece un adorno. | según la guía del DS (versión con y sin manija); el «cuándo»: canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `readonly` | Mostrar un texto ya enviado con la misma forma del campo (copiar un mensaje). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `disabled` | Mientras se envía. | según la guía del DS |
-| `autocomplete` | No hace falta: ningún texto libre se autocompleta. | propuesta, falta aprobación |
+| `autocomplete` | No hace falta: ningún texto libre se autocompleta. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 **Usos de hoy que rompen la regla** (medido el 04-10-2026; los `sublabel` sin paréntesis, los
 «(opcional)» en el label y los placeholders con `...` ya se corrigieron en la app, commits
@@ -90,8 +90,8 @@ también en web, así que cada fila mide 24 en las dos plataformas.
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| motivo, nota | el `size` del formulario (`large` si los inputs van en `large`), `rows=3`, `[resizable]="false"` | `medium`, `rows=3`, manija | propuesta, falta aprobación |
-| descripción larga | igual, `rows=4` | `medium`, `rows=4` | propuesta, falta aprobación |
+| motivo, nota | el `size` del formulario (`large` si los inputs van en `large`), `rows=3`, `[resizable]="false"` | `medium`, `rows=3`, manija | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| descripción larga | igual, `rows=4` | `medium`, `rows=4` | canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 
 ```html
 <sui-textarea [size]="bp.isMobile() ? 'large' : 'medium'" [rows]="3"

package/docs/sui-time-picker/README.md

@@ -30,8 +30,8 @@ pocas horas → select.**
 
 ## Qué variante usar
 
-> **La guía del DS no tiene página para este componente.** Todo es **propuesta, falta
-> aprobación**, aunque ya sea práctica de la app.
+> **La guía del DS no tiene página para este componente.** Las reglas marcadas canon
+> están aprobadas; lo que sigue en **propuesta** espera decisión.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app` (sin prototipos ni vitrinas): **7 usos en
 > 4 pantallas** — horario del local (`weekly-schedule-editor`, 2), turnos del repartidor
@@ -43,25 +43,25 @@ pocas horas → select.**
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `12h` (default) | Siempre: en Perú la hora se dice «9:30 PM». Los 7 usos lo llevan. | propuesta |
-| `24h` | No usar en la app. | propuesta |
+| `12h` (default) | Siempre: en Perú la hora se dice «9:30 PM». Los 7 usos lo llevan. | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `24h` | No usar en la app. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### `step`
 
 | valor | cuándo | fuente |
 |---|---|---|
-| `5` (default) | Horas reales que la persona conoce al minuto: apertura y cierre del local, «cerrar hasta». Con saltos de 30 se redondeaban cierres reales (comentario en `weekly-schedule-editor.html:37`). | propuesta |
-| `30` | Bloques de un turno, que se planifican por media hora (`driver-schedule.html:140`). | propuesta |
-| `15` | Citas o reservas en cuartos de hora. Sin caso hoy. | propuesta |
-| `1` | No usar: 60 opciones en la columna para una precisión que nadie pide. | propuesta |
+| `5` (default) | Horas reales que la persona conoce al minuto: apertura y cierre del local, «cerrar hasta». Con saltos de 30 se redondeaban cierres reales (comentario en `weekly-schedule-editor.html:37`). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `30` | Bloques de un turno, que se planifican por media hora (`driver-schedule.html:140`). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `15` | Citas o reservas en cuartos de hora. Sin caso hoy. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `1` | No usar: 60 opciones en la columna para una precisión que nadie pide. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### `durationPresets`, `showFooter`, `inline`
 
 | input | valor | cuándo | fuente |
 |---|---|---|---|
-| `durationPresets` | `[]` (default desde el 04-10-2026) | **Siempre.** Los presets (15 min, 30 min, 45 min, 1 h) ponen la hora como «tiempo desde la medianoche»: «30 min» deja 12:30 AM. Por eso el default pasó a `[]`; los 7 usos de la app ya los apagaban. | propuesta |
-| `durationPresets` | lista propia | No usar mientras se lean como hora del día. | propuesta |
-| `showFooter` | `true` (default) | Cancelar/Aplicar: la hora no cambia hasta confirmar. Es lo correcto cuando la hora se guarda o publica algo (el horario del local). | propuesta |
+| `durationPresets` | `[]` (default desde el 04-10-2026) | **Siempre.** Los presets (15 min, 30 min, 45 min, 1 h) ponen la hora como «tiempo desde la medianoche»: «30 min» deja 12:30 AM. Por eso el default pasó a `[]`; los 7 usos de la app ya los apagaban. | según el código |
+| `durationPresets` | lista propia | No usar mientras se lean como hora del día. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
+| `showFooter` | `true` (default) | Cancelar/Aplicar: la hora no cambia hasta confirmar. Es lo correcto cuando la hora se guarda o publica algo (el horario del local). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `showFooter` | `false` | Se aplica al tocar cada columna. Solo dentro de un formulario que ya tiene su propio «Guardar». | propuesta |
 | `inline` | `true` | El panel es el contenido, dentro de un `sui-modal` (sin campo ni popover). | propuesta |
 
@@ -69,15 +69,15 @@ pocas horas → select.**
 
 | input | cuándo | fuente |
 |---|---|---|
-| `size="medium"` (40 px, default) | Web. En mobile va `large` (48), que existe desde el 03-10-2026 (ver «Tamaño»). | propuesta |
-| `size="small"` (36 px) | Filas densas en web. | propuesta |
-| `label` | Siempre, corto y en verbo o momento: «Abre», «Cierra», «Inicio», «Cerrar hasta». | propuesta |
-| `sublabel` / `tooltip` | «Opcional» o una aclaración que no entra en el label. | propuesta |
-| `hint` | Qué pasa con esa hora: «Se reabre sola a medianoche». | propuesta |
-| `error` + `errorMessage` | La hora no cuadra: «Cierra antes de abrir». | propuesta |
-| `required` | La hora es obligatoria para guardar. | propuesta |
-| `disabled` | Mientras se guarda (como hacen el horario y los turnos). | propuesta |
-| `placeholder` | Lo que se elige: «Hora de cierre». El default «Seleccionar hora» sirve. | propuesta |
+| `size="medium"` (40 px, default) | Web. En mobile va `large` (48), que existe desde el 03-10-2026 (ver «Tamaño»). | mobile `large`: canon (dueño, 04-10-2026): piso táctil 44 en el teléfono — el campo `medium` mide 40 · web `medium`: canon (aprobado por el dueño, 05-10-2026, bloque B1) |
+| `size="small"` (36 px) | No usar: es chico. Las filas densas de web van en `medium`. | canon (dueño, 05-10-2026, D16) |
+| `label` | Siempre, corto y en verbo o momento: «Abre», «Cierra», «Inicio», «Cerrar hasta». | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `sublabel` / `tooltip` | «Opcional» o una aclaración que no entra en el label. | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `hint` | Qué pasa con esa hora: «Se reabre sola a medianoche». | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `error` + `errorMessage` | La hora no cuadra: «Cierra antes de abrir». | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `required` | La hora es obligatoria para guardar. | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `disabled` | Mientras se guarda (como hacen el horario y los turnos). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
+| `placeholder` | El default «Elige una hora» sirve. Si hace falta decir qué hora, en imperativo con tuteo: «Elige la hora de cierre». | canon (dueño, 05-10-2026, P4 a); el default cambió en la 0.25.0 (antes «Seleccionar hora») |
 
 Usos de hoy que rompen la regla: los 7 cumplen `12h`, `durationPresets=[]` y `label`, pero **los 7
 van con `size="medium"` fijo**, también en pantallas del teléfono (turnos y votaciones del
@@ -88,9 +88,9 @@ repartidor): campo de 40, contra el `large` de la tabla de «Tamaño». Cancelar
 
 | pieza | qué es | cuándo suelta | fuente |
 |---|---|---|---|
-| `sui-time-picker-item` | una fila de la columna (36 px) | No usar: para filas de horario que se tocan con el pulgar va `sui-radio-label` (`checkout.html:469`). | propuesta |
-| `sui-time-picker-duration` | la pastilla de un preset | No usar: es la de los presets de duración. | propuesta |
-| `sui-time-picker-status` | pastilla Disponible/Ocupado/En reunión/Desconectado | No usar: el estado del repartidor ya tiene su badge. | propuesta |
+| `sui-time-picker-item` | una fila de la columna (36 px) | No usar: para filas de horario que se tocan con el pulgar va `sui-radio-label` (`checkout.html:469`). | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
+| `sui-time-picker-duration` | la pastilla de un preset | No usar: es la de los presets de duración. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
+| `sui-time-picker-status` | pastilla Disponible/Ocupado/En reunión/Desconectado | No usar: el estado del repartidor ya tiene su badge. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ## Tamaño en mobile y en web
 
@@ -116,7 +116,7 @@ campo y la de las filas van en 16/24; la fila sigue en 44 (el padding bajó de 1
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| horario en un formulario | `large` (48) o `xlarge` (52) si va junto a campos xlarge | `medium`, o `small` en filas densas | mobile: canon (dueño, 04-10-2026): piso táctil 44 en el teléfono · web: propuesta, falta aprobación |
+| horario en un formulario | `large` (48) o `xlarge` (52) si va junto a campos xlarge | `medium`, también en filas densas | mobile: canon (dueño, 04-10-2026): piso táctil 44 en el teléfono · web `medium`: canon (aprobado por el dueño, 05-10-2026, bloque B1) · también en filas densas, nunca `small`: canon (dueño, 05-10-2026, D16) |
 
 ```html
 <sui-time-picker label="Cierra" format="12h" [step]="5" [durationPresets]="[]"
@@ -154,7 +154,7 @@ en la columna de la derecha, se usa (aprobado por el dueño, 03-10-2026).
 | `hint` | `string \| null` | `null` |
 | `errorMessage` | `string \| null` | `null` |
 | `error` | `boolean` | `false` |
-| `placeholder` | `string` | `'Seleccionar hora'` |
+| `placeholder` | `string` | `'Elige una hora'` |
 | `disabled` | `boolean` | `false` |
 | `size` | `'small' \| 'medium' \| 'large' \| 'xlarge'` | `'medium'` |
 | `format` | `'12h' \| '24h'` | `'12h'` |

package/docs/sui-toast/README.md

@@ -37,7 +37,8 @@ toast · bandeja → notification.**
 
 > La guía del DS define el toast pero no dice cuándo va cada tipo. Lo marcado «según la guía del
 > DS» sale de su texto o de su código publicado; «canon» es lo ya aprobado (README de `sui-alert`,
-> `docs/CANON-SUI.md` o un pedido del dueño escrito en el código); el resto es **propuesta**.
+> `docs/CANON-SUI.md`, un pedido del dueño escrito en el código o su aprobación del 05-10-2026); lo que
+> quede en **propuesta** espera decisión.
 >
 > Uso medido el 04-10-2026 en `master-pedidos/src/app` (sin prototipos, vitrinas ni tests):
 > **705 llamadas en 108 archivos**, todas con el `SuiToastService` de la copia local. El desglose
@@ -58,11 +59,11 @@ toast · bandeja → notification.**
 
 | método | cuándo | ejemplo real de la app | fuente |
 |---|---|---|---|
-| `success()` | La acción salió como se esperaba. Dice **qué** quedó hecho. | `pages/sales-channels/instagram/instagram.ts:102` («Cambios guardados») | propuesta (sigue la regla canon del alert) |
+| `success()` | La acción salió como se esperaba. Dice **qué** quedó hecho. | `pages/sales-channels/instagram/instagram.ts:102` («Cambios guardados») | canon (aprobado por el dueño, 05-10-2026, bloque B2; sigue la regla canon del alert) |
 | `error()` | La acción **no** salió. Dice qué no se pudo, nunca «Error al…» ni el mensaje técnico. | `pages/driver/driver-profile/driver-profile.ts:516` («No se pudo guardar el vehículo») | canon (copy: `docs/CANON-SUI.md` §5.7) |
-| `warning()` | Salió, **pero** con un pero que la persona tiene que saber. | `pages/super-admin/master-promos/master-promos.ts:171` («Push enviada, pero ningún cliente está dentro del radio») | propuesta |
-| `info()` | Algo que **llega** y no es el resultado de lo que hiciste: un push con la app abierta, una versión nueva. | `core/services/aviso-unico.service.ts:52` · `core/services/update.service.ts:59` | propuesta |
-| `feature()` | No usar hoy (0 usos). **Cuándo sí:** avisar una función nueva en el momento en que se activa («Ya puedes programar tus pedidos»). | — | propuesta |
+| `warning()` | Salió, **pero** con un pero que la persona tiene que saber. | `pages/super-admin/master-promos/master-promos.ts:171` («Push enviada, pero ningún cliente está dentro del radio») | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `info()` | Algo que **llega** y no es el resultado de lo que hiciste: un push con la app abierta, una versión nueva. | `core/services/aviso-unico.service.ts:52` · `core/services/update.service.ts:59` | canon (aprobado por el dueño, 05-10-2026, bloque B2) |
+| `feature()` | No usar hoy (0 usos). **Cuándo sí:** avisar una función nueva en el momento en que se activa («Ya puedes programar tus pedidos»). | — | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 | `show({ variant })` | Lo mismo que los de arriba, cuando hace falta pasar todo junto. | `pages/empresa/about/about.ts:103` | según el componente |
 
 ### `style` — el relleno
@@ -70,25 +71,25 @@ toast · bandeja → notification.**
 | style | cuándo | fuente |
 |---|---|---|
 | `stroke-dark` (default SUI) | **Siempre.** Flota sobre cualquier pantalla y el oscuro contrasta con todas. | canon (README de `sui-alert`: «default del toast») |
-| `stroke` (default de la guía) | No usar hoy: blanco sobre blanco se confunde con el contenido. **Cuándo sí:** una pantalla de fondo oscuro (una landing), donde el oscuro se pierde. | propuesta |
-| `lighter` · `light` · `filled` | No usar hoy: un toast que pesa más que el oscuro compite con el botón principal, y si tiene que pesar más, no es un toast. **Cuándo sí:** ninguno previsto; ese caso es un alert o un modal. | propuesta |
+| `stroke` (default de la guía) | No usar hoy: blanco sobre blanco se confunde con el contenido. **Cuándo sí:** una pantalla de fondo oscuro (una landing), donde el oscuro se pierde. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
+| `lighter` · `light` · `filled` | No usar hoy: un toast que pesa más que el oscuro compite con el botón principal, y si tiene que pesar más, no es un toast. **Cuándo sí:** ninguno previsto; ese caso es un alert o un modal. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### Tiempo, cierre, acción y texto
 
 | opción | valor | cuándo | fuente |
 |---|---|---|---|
 | `duration` | `4000` (default) | Un título corto. | según el componente (valor de Sonner) |
-| `duration` | `6000` | Título más `description`, o un título largo que no se alcanza a leer en 4 s. | propuesta |
+| `duration` | `6000` | Título más `description`, o un título largo que no se alcanza a leer en 4 s. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `duration` | `60_000` | Los avisos de un pedido que llegan con la app abierta: tiempo de verlos sin quedarse tapando. | canon (pedido del dueño, 28-09-2026, en `aviso-unico.service.ts`) |
-| `duration` | `Infinity` | **Solo con `action`**: hay algo que hacer y no se puede perder («Actualizar»). Sin acción, es un alert. | propuesta |
+| `duration` | `Infinity` | **Solo con `action`**: hay algo que hacer y no se puede perder («Actualizar»). Sin acción, es un alert. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `dismissible` | `true` (default) | Siempre: la X permite quitarlo antes. La guía lo trae cerrable por defecto. | según la guía del DS |
-| `dismissible` | `false` | No usar hoy. **Cuándo sí:** un toast de progreso que se reemplaza solo usando el mismo `id` («Subiendo foto…» → «Foto subida»). | propuesta (la guía muestra un ejemplo no cerrable) |
-| `action` | `{ label, onClick, keepOpen? }` | **Una** acción corta que resuelve ahí mismo: «Actualizar», «Deshacer», «Reintentar». Se dibuja como link subrayado. | propuesta |
+| `dismissible` | `false` | No usar hoy. **Cuándo sí:** un toast de progreso que se reemplaza solo usando el mismo `id` («Subiendo foto…» → «Foto subida»). | canon (aprobado por el dueño, 05-10-2026, bloque B6; la guía muestra un ejemplo no cerrable) |
+| `action` | `{ label, onClick, keepOpen? }` | **Una** acción corta que resuelve ahí mismo: «Actualizar», «Deshacer», «Reintentar». Se dibuja como link subrayado. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `title` | frase corta | Qué pasó, en sentence case, **sin punto final**. Una idea. | canon (copy de la app) |
-| `description` | segunda frase | Si hace falta una segunda frase, va aquí y no pegada al título con un punto. | propuesta |
-| `position` | `bottom-right` (default) | Siempre. En mobile toda posición pasa a ancho completo; las `bottom-*` quedan abajo, por encima de la barra inferior. | propuesta |
-| `position` | `top-*` | No usar hoy. **Cuándo sí:** una pantalla con una barra de acción fija abajo que el toast taparía. | propuesta |
-| `position` | `bottom-left` · `bottom-center` | No usar hoy: dos esquinas abren dos pilas. **Cuándo sí:** si se decide cambiar la esquina de toda la app, con `setDefaultPosition()`, una sola vez. | propuesta |
+| `description` | segunda frase | Si hace falta una segunda frase, va aquí y no pegada al título con un punto. | canon (CLAUDE.md «Canon de UI» → `docs/VOZ-Y-ESCRITURA.md` «Toasts: la regla completa»: dos frases nunca en el título; D10) |
+| `position` | `bottom-right` (default) | Siempre. En mobile toda posición pasa a ancho completo; las `bottom-*` quedan abajo, por encima de la barra inferior. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `position` | `top-*` | No usar hoy. **Cuándo sí:** una pantalla con una barra de acción fija abajo que el toast taparía. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
+| `position` | `bottom-left` · `bottom-center` | No usar hoy: dos esquinas abren dos pilas. **Cuándo sí:** si se decide cambiar la esquina de toda la app, con `setDefaultPosition()`, una sola vez. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 | `id` | texto | Para reemplazar un toast en curso o no repetir el mismo aviso. | según el componente |
 
 ### Usos de hoy que rompen la regla

package/docs/sui-tooltip/README.md

@@ -32,7 +32,8 @@ servicio»). Es un extra: la pantalla tiene que entenderse sin él.
 ## Qué variante usar
 
 > La guía del DS dice para qué es y cómo se llaman sus tamaños, pero no cuándo va cada uno. Lo
-> marcado «según la guía del DS» sale de su texto o su código publicado; el resto es **propuesta**.
+> marcado «según la guía del DS» sale de su texto o su código publicado; lo marcado canon lo aprobó
+> el dueño (05-10-2026); lo que sigue en **propuesta** espera decisión.
 >
 > Uso medido el 04-10-2026 en `master-pedidos/src/app` (sin prototipos ni vitrinas): **0 tooltips**.
 > Los 6 que había el 03-10-2026 (2 `suiTooltip` sobre un `<svg>` en el panel del local y 4
@@ -51,18 +52,18 @@ servicio»). Es un extra: la pantalla tiene que entenderse sin él.
 
 | SUI | guía | qué es | cuándo | fuente |
 |---|---|---|---|---|
-| `small` (caja de 20 px en `dark`, 22 en `light` por el borde; 24 con la flecha; texto 12) | `xsmall` | texto de una línea, chico | El nombre de un ícono en una tabla o barra densa. | escala según la guía del DS · cuándo: propuesta |
-| `medium` (caja de 28 px en `dark`, 30 en `light`; 34 con la flecha; texto 14) — default SUI | `small` (default de la guía) | texto de una línea | Lo normal: una frase corta que explica. | escala según la guía del DS · cuándo: propuesta |
-| `large` (280 px, título + descripción + ícono) | `medium` | contenido rico | Explicar un término con título y una o dos frases. Se activa solo al usar `[suiTooltipLarge]`. | escala según la guía del DS · cuándo: propuesta |
+| `small` (caja de 20 px en `dark`, 22 en `light` por el borde; 24 con la flecha; texto 12) | `xsmall` | texto de una línea, chico | No usar: es chico. El nombre de un ícono también va en `medium`. | escala según la guía del DS · no usarlo: canon (dueño, 05-10-2026, D16), reemplaza el «cuándo» del bloque B1 |
+| `medium` (caja de 28 px en `dark`, 30 en `light`; 34 con la flecha; texto 14) — default SUI | `small` (default de la guía) | texto de una línea | Lo normal: una frase corta que explica, o el nombre de un ícono. | escala según la guía del DS · cuándo: canon (aprobado por el dueño, 05-10-2026, bloque B1) · el nombre de un ícono: canon (dueño, 05-10-2026, D16) |
+| `large` (280 px, título + descripción + ícono) | `medium` | contenido rico | Explicar un término con título y una o dos frases. Se activa solo al usar `[suiTooltipLarge]`. | escala según la guía del DS · cuándo: canon (aprobado por el dueño, 05-10-2026, bloque B1) |
 | `xlarge` (320 px) | — | rico, más ancho | No usar hoy. Extensión de SUI. **Cuándo sí:** una explicación rica que en 280 px queda en más de cuatro líneas. | propuesta |
 
 ### Contenido: `suiTooltip` o `suiTooltipLarge`
 
 | input | cuándo | ejemplo real de la app | fuente |
 |---|---|---|---|
-| `suiTooltip="…"` | Una frase, sin punto final. | (sin uso hoy) | propuesta |
-| `[suiTooltipLarge]="{ title, description, icon }"` | Un término que necesita título y explicación. | (sin uso hoy) | propuesta |
-| `suiTooltipLarge.dismissible: true` | No usar hoy: lo deja abierto hasta tocar la X o Escape, que es lo que hace un popover. **Cuándo sí:** en web, una explicación larga que la persona lee con calma mientras mueve el mouse. | (sin uso hoy) | propuesta |
+| `suiTooltip="…"` | Una frase, sin punto final. | (sin uso hoy) | canon (aprobado por el dueño, 05-10-2026, bloque B4) |
+| `[suiTooltipLarge]="{ title, description, icon }"` | Un término que necesita título y explicación. | (sin uso hoy) | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `suiTooltipLarge.dismissible: true` | No usar hoy: lo deja abierto hasta tocar la X o Escape, que es lo que hace un popover. **Cuándo sí:** en web, una explicación larga que la persona lee con calma mientras mueve el mouse. | (sin uso hoy) | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### `theme`, `position` y el resto
 
@@ -71,14 +72,14 @@ servicio»). Es un extra: la pantalla tiene que entenderse sin él.
 | `theme` | `auto` | **Siempre.** Oscuro sobre la app en claro (lo que pide la guía) y claro sobre la app en oscuro. | propuesta (la guía: `dark` por default) |
 | `theme` | `dark` | Igual que `auto` en modo claro, pero no se invierte en modo oscuro. | según la guía del DS (default) |
 | `theme` | `light` (default SUI) | No usar hoy: sobre una página clara parece una card más. **Cuándo sí:** ya lo da `auto` en modo oscuro. | propuesta |
-| `position` | `top` (default) | Siempre que haya espacio. Si no lo hay, el CDK lo da vuelta solo. | propuesta |
-| `position` | `right` · `left` | Íconos de una barra lateral angosta (el sidebar colapsado). | propuesta |
-| `position` | `bottom` · `*-start` · `*-end` | Un elemento pegado al borde de arriba o a un costado de la pantalla. | propuesta |
-| `delay` | `200` (default) | Siempre: evita que se abra al cruzar con el mouse. | propuesta |
-| `delay` | otro valor | No usar hoy. **Cuándo sí:** ninguno previsto. | propuesta |
-| `disabled` | `true` | Cuando lo que dice ya está a la vista (el sidebar expandido muestra el nombre). | propuesta |
+| `position` | `top` (default) | Siempre que haya espacio. Si no lo hay, el CDK lo da vuelta solo. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `position` | `right` · `left` | Íconos de una barra lateral angosta (el sidebar colapsado). | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `position` | `bottom` · `*-start` · `*-end` | Un elemento pegado al borde de arriba o a un costado de la pantalla. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `delay` | `200` (default) | Siempre: evita que se abra al cruzar con el mouse. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `delay` | otro valor | No usar hoy. **Cuándo sí:** ninguno previsto. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| `disabled` | `true` | Cuando lo que dice ya está a la vista (el sidebar expandido muestra el nombre). | canon (aprobado por el dueño, 05-10-2026, bloque B8) |
 | `showArrow` | `true` (default) | Siempre: la flecha dice de qué elemento habla. | según la guía del DS |
-| `showArrow` | `false` | No usar hoy. **Cuándo sí:** sobre un punto de un gráfico, donde la flecha tapa el dato. | propuesta |
+| `showArrow` | `false` | No usar hoy. **Cuándo sí:** sobre un punto de un gráfico, donde la flecha tapa el dato. | canon (aprobado por el dueño, 05-10-2026, bloque B6) |
 
 ### Usos de hoy que rompen la regla
 
@@ -91,9 +92,9 @@ dos `<svg>` con tooltip del panel del local pasaron a subtítulo
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| nombre de un ícono | no aplica: el ícono lleva el nombre escrito o `aria-label` | `small` | propuesta |
-| frase que explica | no aplica: el texto va visible bajo el dato (`sui-form-hint`) | `medium` | propuesta |
-| explicación con título | no aplica: `sui-modal-sheet` al tocar el ícono | `large` (automático con `[suiTooltipLarge]`) | propuesta |
+| nombre de un ícono | no aplica: el ícono lleva el nombre escrito o `aria-label` | `medium` | mobile: canon (aprobado por el dueño, 05-10-2026, bloque B7) · web: canon (dueño, 05-10-2026, D16), antes `small` |
+| frase que explica | no aplica: el texto va visible bajo el dato (`sui-form-hint`) | `medium` | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
+| explicación con título | no aplica: `sui-modal-sheet` al tocar el ícono | `large` (automático con `[suiTooltipLarge]`) | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
 
 En pantallas que se usan en los dos (panel del local, super admin), el tooltip se apaga en mobile
 y la ayuda se muestra de otra forma:
@@ -171,7 +172,7 @@ no se usa directo en pantallas.
 ## Trampas
 
 - **El tamaño se pasa como `suiTooltipSize`**, no como `size`: así no choca con el `size` del
-  componente que lo lleva (`<sui-button size="small" suiTooltip="…">`).
+  componente que lo lleva (`<sui-button size="medium" suiTooltip="…">`).
 - **`position`, `theme`, `delay` y `disabled` sí se llaman así, sin prefijo**: si el host es un
   componente con un input del mismo nombre (`disabled` de `sui-button`), el valor llega a los dos.
 - **`suiTooltipSize="large"` con `suiTooltip` de texto dibuja una caja vacía**: el tamaño rico solo

package/docs/sui-topbar/README.md

@@ -30,20 +30,20 @@ navegada por arriba → topbar.**
 
 > **La guía del DS no tiene página de la topbar.** El componente sale del Figma de SUI (Topbar
 > [Navigation], frame 3814:25274, cuatro ejemplos: con y sin íconos, con buscador abierto o en
-> botón). Sin uso en la app, **todo lo de abajo es propuesta, falta aprobación**, salvo lo que el
-> componente ya fija.
+> botón). Sin uso en la app. Las reglas marcadas canon están aprobadas (05-10-2026) y no queda
+> ninguna en propuesta; lo marcado «Figma» lo fija el componente.
 >
 > Uso medido el 03-10-2026 en `master-pedidos/src/app`: `sui-topbar`, `sui-topbar-item` y
 > `sui-topbar-user` tienen 0 usos; `sui-topbar-button`, 1 en la vitrina de variantes.
 
 | decisión | opción | cuándo | fuente |
 |---|---|---|---|
-| items | sin `icon` | El caso normal: 3-6 secciones con nombre corto. | propuesta, falta aprobación |
-| items | con `icon` | Si **todos** llevan ícono. Mezclar con y sin se lee desordenado. | propuesta, falta aprobación |
-| item con `rightIcon: 'arrow-down-s-line'` | — | Un «Más ⌄» que abre un menú. El menú lo pones tú (`sui-dropdown-menu`) al escuchar `(itemClicked)`. | propuesta, falta aprobación |
+| items | sin `icon` | El caso normal: 3-6 secciones con nombre corto. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| items | con `icon` | Si **todos** llevan ícono. Mezclar con y sin se lee desordenado. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
+| item con `rightIcon: 'arrow-down-s-line'` | — | Un «Más ⌄» que abre un menú. El menú lo pones tú (`sui-dropdown-menu`) al escuchar `(itemClicked)`. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `search` | objeto con `placeholder` | Buscador abierto de 232 px cuando buscar es la acción principal. | Figma (Type=Default) |
 | `search` | `{ compact: true }` | Ícono de lupa en la zona de acciones; tú abres el buscador real (`sui-modal` o una paleta de comandos) en `(searchClicked)`. | Figma (Type=With Icon) |
-| `actions` | 1-3 íconos | Avisos, ayuda, acciones rápidas. `dot: true` = hay algo nuevo. | propuesta, falta aprobación |
+| `actions` | 1-3 íconos | Avisos, ayuda, acciones rápidas. `dot: true` = hay algo nuevo. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `user` | config | El chip abre el menú de la cuenta: pásale `[userOpen]` mientras el menú está abierto. | Figma |
 | `accent` | `brand` (default) | Siempre. `information` es el azul del Figma original. | canon del DS (accent = marca) |
 
@@ -55,7 +55,7 @@ oculto si no entra.
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| navegación de una web de escritorio | **no usar** | `sui-topbar` | propuesta, falta aprobación |
+| navegación de una web de escritorio | **no usar** | `sui-topbar` | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
 
 **Qué pasa en mobile:** nada se adapta. Los 44 px laterales se comen el ancho, los items se
 esconden detrás de un scroll lateral sin pista visual, el buscador no se achica y no hay

package/docs/sui-topbar-button/README.md

@@ -26,12 +26,12 @@ armada a mano que quiera verse como la topbar.
 
 > **La guía del DS no tiene página de este botón.** Sale del Figma de SUI (Topbar Item Button
 > [Topbar], set 3814:25156: Default, Hover, Active). Uso medido el 03-10-2026: **0 usos** en la
-> app, 1 en la vitrina de variantes (`master-preview/_guia-variantes`). Lo de abajo es
-> **propuesta, falta aprobación**.
+> app, 1 en la vitrina de variantes (`master-preview/_guia-variantes`). Las reglas marcadas
+> canon están aprobadas (05-10-2026) y no queda ninguna en propuesta.
 
 | prop | cuándo | fuente |
 |---|---|---|
-| `dot` | Hay algo nuevo detrás del ícono (avisos sin leer). Se apaga cuando la persona lo abre. Si el número importa, no alcanza: va un contador en otro lado. | propuesta, falta aprobación |
+| `dot` | Hay algo nuevo detrás del ícono (avisos sin leer). Se apaga cuando la persona lo abre. Si el número importa, no alcanza: va un contador en otro lado. | canon (aprobado por el dueño, 05-10-2026, bloque B9) |
 | `active` | Mientras el panel que abre el botón está abierto (pinta el ícono naranja y `aria-pressed`). | Figma (State=Active) |
 | `accent` | `brand` (default). `information` es el azul del Figma original: no usar. | canon del DS (accent = marca) |
 
@@ -43,7 +43,7 @@ mínimo táctil aceptable, pero el botón vive en la topbar, que hoy es solo de
 
 | uso | mobile | web | fuente |
 |---|---|---|---|
-| ícono de la barra superior | no usar (no hay topbar en mobile) | 40×40 | propuesta, falta aprobación |
+| ícono de la barra superior | no usar (no hay topbar en mobile) | 40×40 | canon (aprobado por el dueño, 05-10-2026, bloque B7) |
 
 ## «No usar»: por qué no hoy y cuándo sí