diff --git a/docs/audit/theming/form.md b/docs/audit/theming/form.md index 4187abc0f..1962ebf52 100644 --- a/docs/audit/theming/form.md +++ b/docs/audit/theming/form.md @@ -162,6 +162,31 @@ arquitectónica escrita una vez) y anotadas para firma. > abierto en `next-features` §13 que esos dos botones compongan también el > `Button` canónico (toca soma y morfo, clase A-112). +> **Nota 2026-08-25 — el eje `size` ya LLEGA a las acciones (expediente E2).** +> Ceder el cromo dejó a la vista el reverso: `Form.Submit` y `Form.Reset` +> traían su propio `size = 'md'` y nada lo puenteaba, así que un +> `
` los renderizaba con `data-size="md"` en las CINCO tallas +> (36 px de alto, 16 px de letra) y del eje sólo sobrevivía el `row-gap`. +> Firmado el puente de densidad de `toolbar/context.ts`, calcado 1:1: nuevo +> `components/form/context.ts` (`Symbol('form-eidos-ctx')` + getter de +> propiedad), `form.svelte` publica el `resolvedSize` que ya calculaba, y las +> dos acciones pierden su default y leen `size={size ?? form?.size}` — la prop +> explícita siempre gana, y sin `` ancestro cae en el `md` del propio +> `Button`. **VERBATIM, sin tapar en `md`**: la tapa de `reference.md` +> §«Container→part derivation» gobierna contenedores cuyo eje es ANCHURA (su +> primer consumidor es `Dialog.Close`, y un diálogo `full` no debe engordar sus +> controles); el de `form` es DENSIDAD declarada — `types.ts` lo escribe +> («Visual density for form spacing and action controls») y `form.css:25-51` ya +> tenía los cinco peldaños distintos de su acción. Medido: alto +> **−10 / −6 / 0 / +8 / +16** px y letra **−4 / −2 / 0 / +4 / +12** px +> (los dos últimos son el `clamp()` fluido de `--font-size-lg` / `-xl` +> saturado a 1280 px de ancho; a 900 px dan +3,05 / +10,1). `md` no se mueve un +> solo valor. Sólo eidos: cinco ficheros, cero morfo, cero soma, cero sema — +> el contrato de 64 claves y el ledger quedan intactos. +> Sigue abierto: `form-error-summary.svelte` estampa un `data-size` que +> **ninguna regla lee** (tercer defecto de talla del componente, el único +> totalmente inerte), y el hermano `alert-dialog` tiene el mismo agujero. + **Las adjudicaciones restantes son ramas que la demo no monta**: el layout `grid` (forzado alcanza — y ojo, su `grid-template-columns` sólo CAMBIA si el valor altera el número de columnas: con 90px pasa de una columna de 502px a diff --git a/docs/next-features.md b/docs/next-features.md index 6c9f6cc8d..ed4d28e03 100644 --- a/docs/next-features.md +++ b/docs/next-features.md @@ -2046,18 +2046,71 @@ Lo que `chart` destapó (2026-08-22): cerrarlo, las 23 claves se retiran: el censo de `form` bajaría 64 → 41. Ceder sin componer no es opción — medido, caen al ` {/snippet} diff --git a/src/uix/eidos/components/form/form-submit.svelte b/src/uix/eidos/components/form/form-submit.svelte index 6172a9639..bada85cc3 100644 --- a/src/uix/eidos/components/form/form-submit.svelte +++ b/src/uix/eidos/components/form/form-submit.svelte @@ -14,21 +14,27 @@ */ import * as Form from '$soma/components/form'; import { Button } from '$uix/eidos/components/button'; + import { getFormEidosCtx } from './context'; import type { FormSubmitProps } from './types'; let { - size = 'md', + size, variant = 'surface', color = 'primary', style, children: bodyContent, ...rest }: FormSubmitProps = $props(); + + // No default of its own: the form's density reaches the action through the + // eidos context, and an explicit `size` prop always wins. Standalone (no + // form ancestor) falls through to the Button's own `md`. + const form = getFormEidosCtx(); {#snippet child({ props })} - {/snippet} diff --git a/src/uix/eidos/components/form/form.svelte b/src/uix/eidos/components/form/form.svelte index f48bf4fe0..574e50740 100644 --- a/src/uix/eidos/components/form/form.svelte +++ b/src/uix/eidos/components/form/form.svelte @@ -2,6 +2,7 @@ import './form.css'; import { ActiveEidos } from '$uix/eidos'; import * as Form from '$soma/components/form'; + import { setFormEidosCtx } from './context'; import type { FormProps, FormProviderSnippetProps } from './types'; let { @@ -14,6 +15,15 @@ const eidos = ActiveEidos.require(); const resolvedSize = $derived(eidos.resolve(size, 'md')); + + // Density bridge for `` / ``: the composed canon + // `