svelte-kit-vice

Commit Graph

Author	SHA1	Message	Date
dev	4caf1100a1	refactor(blocks)!: el eje de tamano dice de QUIEN es — size deja de significar dos cosas LA AMBIGUEDAD, medida. En el canon `size` no es ambiguo: es «el eje de tamano de ESTE componente», y cada uno lo materializa a su manera — padding de bloque en `Section`, densidad de la tira en `Banner`, escala tipografica en `Text`. La ambiguedad la creaba el tier: un block no es ninguno de esos componentes, y al reenviar `size` estaba reenviando el eje de una pieza INTERNA. Desde fuera: <FeatureGrid size="xl"> cambia el AIRE de la seccion <SiteBanner size="lg"> cambia la ALTURA de la tira Misma prop, dos cosas, y una con un valor menos en la escala (`BannerSize` no tiene `xl`). Un consumidor que aprende el eje en trece blocks se equivoca en el catorceavo. EL RENOMBRADO: - `size` -> `sectionSize` en los 13 que envuelven `Section` - `container` -> `containerSize` en los 14 que envuelven `Container` - `size` queda LIBRE y solo lo usa `banner`, donde si es el tamano del block - `minColumnWidth` -> `minChildWidth` en `site-footer`: el mismo concepto tenia dos nombres en el tier, y ninguno era el del canon El patron no se invento: el tier YA nombraba un eje por su pieza (`container`). `containerSize` + `sectionSize` lo hace explicito y simetrico. LA REGLA, en `architecture/blocks.md` §Conventions, para que no reaparezca: un block que reenvia el eje de tamano de una pieza interna lo nombra `{pieza}Size`, y `size` se reserva para el tamano del block. Corolario: un eje que el canon ya nombra se reenvia CON SU NOMBRE. METODO — se renombraron los TIPOS primero y se dejo que `svelte-check` senalara cada consumidor, en vez de buscar a mano. Cazo los cinco call sites que quedaban (`CtaSite`, `HeroSite`, `SiteHeaderSite`, `TeamSite` y un uso suelto en `cta.svelte`). ⚠️ Y cazo tambien un error propio: el primer patron era demasiado ancho y renombro `size` en SIETE sub-partes donde ese `size` es el del `Card` o el `Text` que envuelven (`testimonials-item`, `contact-reason`, `team-member-role`…). Revertidas antes de seguir. DOCUMENTACION revisada entera: corregidas las tres filas de README que describian props del block con el nombre viejo (`hero` x2, `site-header`); conservadas las seis que hablan del `size` de un componente del canon (`Banner`, `Accordion`, `Heading`), que no cambia. `PLAN-blocks.md` se deja intacto: es bitacora, y reescribir el registro historico para que cuadre con el presente lo falsearia. LEDGER — el contraste doctrinal llega a 15/15, y cinco filas nuevas: - A-95 `banner`: con `affix="top"` el aviso tapa la cabecera pegada (medido: `elementFromPoint` sobre el header devuelve la tira). NO se arregla aqui: la pieza que falta es la que POSEE las alturas de pagina — Mantine lo resuelve en `AppShell`, que declara `header={{ height }}` y desplaza el resto; nuestro equivalente es el block `app-shell`, sin construir. - A-96 `banner`: `affixOffset` es prop publica sin control vivo en la demo. - A-97 `feature-grid`: RETIRADA el mismo dia. Se midio el texto `muted` con el 4,5:1 generico de WCAG y el proyecto tiene OTRA vara — «floors APCA >= 60 ∧ WCAG >= 3», con guard propio, y la tinta secundaria es «marginal sub-4.5:1 by design». Re-medido con `src/arts/color/apca.ts`: Lc 63,7 y 3,70:1, cumple las dos. (El primer intento con `apcaLc` devolvio 102666 porque le pase 0..255 donde pide 0..1: un valor fuera de rango no es un hallazgo, es un formato.) - A-98 `hero` + A-99 `Group`: las acciones no apilan ni envuelven. La causa NO es del tier — `Group` no aplica el `wrap` que su README promete en TRES sitios: `group.svelte` nunca se lo pasa a `Flex`, el recipe no lo declara, y `Omit<FlexProps,'wrap'>` impide compensarlo desde fuera. El `align: center` si se cumple, lo que descarta que el recipe no cargue. Y A-25 cae (la demo ya no promete elevacion) y A-47 corrige su disposicion: el anillo de foco es «a config axis» por doctrina — endurecerlo es una decision de VALOR en `color.focus.ring`, «never a per-component CSS change», que es exactamente lo que hacia el intento revertido en `e468e764b`. Gates: blocks:check verde (15 blocks / 115 ficheros) · svelte-check 72 errores / 59 avisos = linea base exacta, ninguno en blocks · docs:check 0/0 sobre 629 docs. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2 months ago
dev	4e785d32bf	feat(blocks): F2.7 `stats-band` — la cifra que se cuenta sola La fila de números que respalda lo que la página acaba de afirmar. Compound (`.Stat` repite, sin contexto): `<StatsBand>` + `.Stat` + `.Value` + `.Label`. - Compone, no reinventa: la semántica de KPI es el `Metrics` del canon, leído de su API y pasado tal cual (precedente `faq`/`Accordion`). `Metrics` es surfaceless, que es exactamente lo que una banda necesita: no son tarjetas de panel. Un delta, un icono o un sparkline son `Metrics.Delta`/`.Icon`/`.Chart` que la app compone dentro — el block no los re-expone. - La superación literal del dossier: `<StatsBand.Value count={12500} />` compone `CountUp`, así que la cifra se cuenta sola al entrar en pantalla. NINGUNA referencia puede shipearlo: todas entregan markup estático. El formato locale-aware y el salto directo bajo reduced-motion vienen del `CountUp`, no de aquí. - `count` es opt-in, nunca default: una cifra que se anima sin que el lector lo pida es ruido, y algunas no son contables («99,98 %»). Sin `count`, la cifra la pone la app por children. - Ni una palabra ni un separador salen del block (B-7): las palabras por children, el formato por `uix.format` dentro del `CountUp`. - Escalonado estructural: `data-stagger` en la banda y cada `.Stat` es un `Motion trigger="viewport"`, así que las cifras aterrizan una tras otra sin un solo milisegundo escrito a mano. Verificado en navegador (con la banda bajo el pliegue, para cazar el conteo desde el primer fotograma): 4 cifras con índices estructurales 0,1,2,3 contando —9377→11.678 · 255→318 · 36→45—, el porcentaje quieto por no ser contable, y el separador de millares por locale (`11.678`). Cero errores de página. `blocks:check` verde (8 blocks) · `svelte-check` sin errores propios. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>	2 months ago

Author

SHA1

Message

Date

dev

4caf1100a1

refactor(blocks)!: el eje de tamano dice de QUIEN es — size deja de significar dos cosas

LA AMBIGUEDAD, medida. En el canon `size` no es ambiguo: es «el eje de tamano de
ESTE componente», y cada uno lo materializa a su manera — padding de bloque en
`Section`, densidad de la tira en `Banner`, escala tipografica en `Text`. La
ambiguedad la creaba el tier: un block no es ninguno de esos componentes, y al
reenviar `size` estaba reenviando el eje de una pieza INTERNA. Desde fuera:

    <FeatureGrid size="xl">   cambia el AIRE de la seccion
    <SiteBanner  size="lg">   cambia la ALTURA de la tira

Misma prop, dos cosas, y una con un valor menos en la escala (`BannerSize` no
tiene `xl`). Un consumidor que aprende el eje en trece blocks se equivoca en el
catorceavo.

EL RENOMBRADO:

- `size`      -> `sectionSize`   en los 13 que envuelven `Section`
- `container` -> `containerSize` en los 14 que envuelven `Container`
- `size` queda LIBRE y solo lo usa `banner`, donde si es el tamano del block
- `minColumnWidth` -> `minChildWidth` en `site-footer`: el mismo concepto tenia
  dos nombres en el tier, y ninguno era el del canon

El patron no se invento: el tier YA nombraba un eje por su pieza (`container`).
`containerSize` + `sectionSize` lo hace explicito y simetrico.

LA REGLA, en `architecture/blocks.md` §Conventions, para que no reaparezca: un
block que reenvia el eje de tamano de una pieza interna lo nombra `{pieza}Size`,
y `size` se reserva para el tamano del block. Corolario: un eje que el canon ya
nombra se reenvia CON SU NOMBRE.

METODO — se renombraron los TIPOS primero y se dejo que `svelte-check` senalara
cada consumidor, en vez de buscar a mano. Cazo los cinco call sites que quedaban
(`CtaSite`, `HeroSite`, `SiteHeaderSite`, `TeamSite` y un uso suelto en
`cta.svelte`). ⚠️ Y cazo tambien un error propio: el primer patron era demasiado
ancho y renombro `size` en SIETE sub-partes donde ese `size` es el del `Card` o
el `Text` que envuelven (`testimonials-item`, `contact-reason`,
`team-member-role`…). Revertidas antes de seguir.

DOCUMENTACION revisada entera: corregidas las tres filas de README que describian
props del block con el nombre viejo (`hero` x2, `site-header`); conservadas las
seis que hablan del `size` de un componente del canon (`Banner`, `Accordion`,
`Heading`), que no cambia. `PLAN-blocks.md` se deja intacto: es bitacora, y
reescribir el registro historico para que cuadre con el presente lo falsearia.

LEDGER — el contraste doctrinal llega a 15/15, y cinco filas nuevas:

- A-95 `banner`: con `affix="top"` el aviso tapa la cabecera pegada (medido:
  `elementFromPoint` sobre el header devuelve la tira). NO se arregla aqui: la
  pieza que falta es la que POSEE las alturas de pagina — Mantine lo resuelve en
  `AppShell`, que declara `header={{ height }}` y desplaza el resto; nuestro
  equivalente es el block `app-shell`, sin construir.
- A-96 `banner`: `affixOffset` es prop publica sin control vivo en la demo.
- A-97 `feature-grid`: RETIRADA el mismo dia. Se midio el texto `muted` con el
  4,5:1 generico de WCAG y el proyecto tiene OTRA vara — «floors APCA >= 60 ∧
  WCAG >= 3», con guard propio, y la tinta secundaria es «marginal sub-4.5:1 by
  design». Re-medido con `src/arts/color/apca.ts`: Lc 63,7 y 3,70:1, cumple las
  dos. (El primer intento con `apcaLc` devolvio 102666 porque le pase 0..255
  donde pide 0..1: un valor fuera de rango no es un hallazgo, es un formato.)
- A-98 `hero` + A-99 `Group`: las acciones no apilan ni envuelven. La causa NO es
  del tier — `Group` no aplica el `wrap` que su README promete en TRES sitios:
  `group.svelte` nunca se lo pasa a `Flex`, el recipe no lo declara, y
  `Omit<FlexProps,'wrap'>` impide compensarlo desde fuera. El `align: center` si
  se cumple, lo que descarta que el recipe no cargue.

Y A-25 cae (la demo ya no promete elevacion) y A-47 corrige su disposicion: el
anillo de foco es «a config axis» por doctrina — endurecerlo es una decision de
VALOR en `color.focus.ring`, «never a per-component CSS change», que es
exactamente lo que hacia el intento revertido en `e468e764b`.

Gates: blocks:check verde (15 blocks / 115 ficheros) · svelte-check 72 errores /
59 avisos = linea base exacta, ninguno en blocks · docs:check 0/0 sobre 629 docs.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

dev

4e785d32bf

feat(blocks): F2.7 `stats-band` — la cifra que se cuenta sola

La fila de números que respalda lo que la página acaba de afirmar. Compound
(`.Stat` repite, sin contexto): `<StatsBand>` + `.Stat` + `.Value` + `.Label`.

- **Compone, no reinventa**: la semántica de KPI es el `Metrics` del canon, leído
  de su API y pasado tal cual (precedente `faq`/`Accordion`). `Metrics` es
  surfaceless, que es exactamente lo que una banda necesita: no son tarjetas de
  panel. Un delta, un icono o un sparkline son `Metrics.Delta`/`.Icon`/`.Chart`
  que la app compone dentro — el block no los re-expone.
- **La superación literal del dossier**: `<StatsBand.Value count={12500} />`
  compone `CountUp`, así que la cifra se cuenta sola al entrar en pantalla.
  NINGUNA referencia puede shipearlo: todas entregan markup estático. El formato
  locale-aware y el salto directo bajo reduced-motion vienen del `CountUp`, no
  de aquí.
- **`count` es opt-in, nunca default**: una cifra que se anima sin que el lector
  lo pida es ruido, y algunas no son contables («99,98 %»). Sin `count`, la
  cifra la pone la app por children.
- **Ni una palabra ni un separador salen del block** (B-7): las palabras por
  children, el formato por `uix.format` dentro del `CountUp`.
- Escalonado estructural: `data-stagger` en la banda y cada `.Stat` es un
  `Motion trigger="viewport"`, así que las cifras aterrizan una tras otra sin un
  solo milisegundo escrito a mano.

Verificado en navegador (con la banda bajo el pliegue, para cazar el conteo desde
el primer fotograma): 4 cifras con índices estructurales 0,1,2,3 contando
—9377→11.678 · 255→318 · 36→45—, el porcentaje quieto por no ser contable, y el
separador de millares por locale (`11.678`). Cero errores de página.
`blocks:check` verde (8 blocks) · `svelte-check` sin errores propios.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

2 Commits (4caf1100a174f1c948b84a01dba236d9cac93258)