svelte-kit-vice

Commit Graph

Author	SHA1	Message	Date
dev	18165e74ed	uix(blocks-demos): la vista previa nace con el estado vivo de ActiveUix, no con los defaults El iframe de la vista previa es OTRO documento con OTRO runtime (BootUix corre su propio createActiveUix), así que el estado de la sección no cruza el marco: la rama de 375/768 se abría SIEMPRE en claro, y en 9 demos siempre en LTR, con la topbar en oscuro y RTL delante (A-29). Dentro del documento los blocks siempre atendieron a ActiveUix — el shell conduce el framework por uix.prefs.setIntent y el modeSource de eidos —; lo que faltaba era la única serialización que existe entre dos runtimes: la URL. El arreglo va en el ARNÉS, no demo a demo. BlockDemo lee el estado VIVO por la superficie sancionada del framework — readActiveUixPrefsSlot(uix.prefs, 'direction'\|'language')?.get(), las lecturas por dimensión que son rune-backed (contador $state por dimensión), y eidos.getThemeContext().mode, que lee el modeSource del shell — y compone la URL final: los props del BLOCK los pone el demo, los EJES los pone el arnés. El {#key} y el enlace «abrir ↗» pasan a la URL resuelta, así que mover un toggle global re-monta el iframe con los params nuevos y el enlace abre lo que estás viendo. Retirados los 11 controles «dir (solo la vista previa)» de banner, contact, cta, feature-grid, feature-split, hero, newsletter, site-footer, site-header, stats-band y team: eran el eje de sección repetido por demo — la regla del arnés dice que tema, idioma y dirección los da el shell — y no tocaban prefs, sólo escribían la URL. El shell queda como único dueño de los ejes; una precedencia demo-gana habría dejado el toggle global inerte en esas páginas. Dos correcciones a la ficha: testimonials ya derivaba su URL (el literal desnudo quedó atrás en F2b), y el alcance real era el sistémico que la propia ficha apuntaba — mode= no viajaba en NINGUNO de los 19 demos y dir= faltaba en 9. La pata lang sigue siendo inerte salvo en contact (blocks.* registrado), pero viaja igual: es un eje del shell. Verificado con la topbar REAL de la sección, no con params a mano: en oscuro + RTL, el iframe de pricing a 375 arranca base-dark + dir=rtl (tinta oklch(0.9491 0 0)) y el de hero — que tenía control local — hereda igual; en el estado por defecto los dos vuelven a base-light + ltr. La URL sale con los props del block primero y mode/dir/lang detrás. Gates: svelte-check 72/62 antes y después · blocks:check 0/19 · docs:check 0/0. Huella: BlockDemo +31, cada demo −18 (−192/+39 en total). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>	2 months ago
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

18165e74ed

uix(blocks-demos): la vista previa nace con el estado vivo de ActiveUix, no con los defaults

El iframe de la vista previa es OTRO documento con OTRO runtime (BootUix corre
su propio createActiveUix), así que el estado de la sección no cruza el marco:
la rama de 375/768 se abría SIEMPRE en claro, y en 9 demos siempre en LTR, con
la topbar en oscuro y RTL delante (A-29). Dentro del documento los blocks
siempre atendieron a ActiveUix — el shell conduce el framework por
uix.prefs.setIntent y el modeSource de eidos —; lo que faltaba era la única
serialización que existe entre dos runtimes: la URL.

El arreglo va en el ARNÉS, no demo a demo. BlockDemo lee el estado VIVO por la
superficie sancionada del framework — readActiveUixPrefsSlot(uix.prefs,
'direction'|'language')?.get(), las lecturas por dimensión que son rune-backed
(contador $state por dimensión), y eidos.getThemeContext().mode, que lee el
modeSource del shell — y compone la URL final: los props del BLOCK los pone el
demo, los EJES los pone el arnés. El {#key} y el enlace «abrir ↗» pasan a la
URL resuelta, así que mover un toggle global re-monta el iframe con los params
nuevos y el enlace abre lo que estás viendo.

Retirados los 11 controles «dir (solo la vista previa)» de banner, contact,
cta, feature-grid, feature-split, hero, newsletter, site-footer, site-header,
stats-band y team: eran el eje de sección repetido por demo — la regla del
arnés dice que tema, idioma y dirección los da el shell — y no tocaban prefs,
sólo escribían la URL. El shell queda como único dueño de los ejes; una
precedencia demo-gana habría dejado el toggle global inerte en esas páginas.

Dos correcciones a la ficha: testimonials ya derivaba su URL (el literal
desnudo quedó atrás en F2b), y el alcance real era el sistémico que la propia
ficha apuntaba — mode= no viajaba en NINGUNO de los 19 demos y dir= faltaba en
9. La pata lang sigue siendo inerte salvo en contact (blocks.* registrado),
pero viaja igual: es un eje del shell.

Verificado con la topbar REAL de la sección, no con params a mano: en oscuro +
RTL, el iframe de pricing a 375 arranca base-dark + dir=rtl (tinta
oklch(0.9491 0 0)) y el de hero — que tenía control local — hereda igual; en el
estado por defecto los dos vuelven a base-light + ltr. La URL sale con los
props del block primero y mode/dir/lang detrás.

Gates: svelte-check 72/62 antes y después · blocks:check 0/19 · docs:check
0/0. Huella: BlockDemo +31, cada demo −18 (−192/+39 en total).

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

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>

3 Commits (e4fa616e5d7f90ea73c1a074d1ebc914d20c284d)