diff --git a/apps/docs/src/app/pages/(home).page.ts b/apps/docs/src/app/pages/(home).page.ts index a02530e..cc9cac4 100644 --- a/apps/docs/src/app/pages/(home).page.ts +++ b/apps/docs/src/app/pages/(home).page.ts @@ -52,7 +52,7 @@ const COPY = { frame: 'GSAP es agnóstico al framework y corre en cualquier app Angular hoy, sin wrapper. Lo que no puede saber es Angular: cuándo se pintó un template, qué posee un componente, cuándo se destruye, si el código corre en un servidor. Esta librería resuelve exactamente esas fricciones y nada más.', howEyebrow: 'La idea completa', - howTitle: 'Un composable. GSAP puro adentro.', + howTitle: 'Un solo composable. Adentro escribes GSAP puro.', howBody: 'injectGsap() ejecuta tu código GSAP en un contexto que pertenece al componente. Apunta a elementos con queries viewChild o selectores limitados al componente, lee signals para hacerlo reactivo, y el contexto revierte todo cuando el componente se destruye. En el servidor nunca se ejecuta.', howCta: 'Empieza con los básicos →', @@ -62,7 +62,7 @@ const COPY = { featNote: 'Todo este pegamento lo podrías escribir tú. La mayoría de las apps Angular que animan terminan haciendo justo eso, componente por componente.', features: [ - 'Scoped por defecto', + 'Acotado a tu componente', 'Dirigido por signals', 'Sin limpieza manual', 'Listo para SSR', diff --git a/apps/docs/src/app/pages/directives.page.ts b/apps/docs/src/app/pages/directives.page.ts index db35e12..c952234 100644 --- a/apps/docs/src/app/pages/directives.page.ts +++ b/apps/docs/src/app/pages/directives.page.ts @@ -54,7 +54,7 @@ const COPY = { reveal: 'Entradas para un solo elemento, al pintar o con scroll. Presets: fade, fade-up/down/left/right, scale-in. El demo hace scroll dentro de su propio marco vía [scroller].', stagger: 'Las mismas entradas sobre los hijos de un elemento. Funciona natural con @for: los items nuevos repiten la entrada.', splitReveal: 'Divide el texto en caracteres, palabras o líneas y escalona las piezas. El marcado original se restaura al destruir.', - scrambleText: 'Descodifica el texto en su lugar. Sin texto objetivo, descodifica el contenido propio del elemento.', + scrambleText: 'Revuelve el texto hasta que cae en su lugar. Sin un texto objetivo, descifra el contenido del propio elemento.', counter: 'Cuenta el texto del elemento hasta un número, con el formato del locale del usuario.', parallax: 'Deriva ligada al scroll mientras el elemento cruza el viewport. Velocidades negativas van contra el scroll. Aquí sigue al marco, no a la página: eso es [scroller].', drawSvg: 'Dibuja trazos de SVG. En un contenedor, cada descendiente con trazo se dibuja, escalonado.', @@ -65,7 +65,7 @@ const COPY = { hover: 'Microinteracciones de puntero. Los tweens de entrada y salida se sobreescriben: los pases rápidos no se acumulan.', }, explain: [ - 'Cada directiva aquí es un preset sobre injectGsap: mismo scoping, misma limpieza, mismos inputs de signal. Cubren los casos comunes; para cualquier cosa más rica, usa el composable.', + 'Cada directiva aquí es un preset sobre injectGsap: mismo scoping, misma limpieza, mismos inputs de signal. Cubren los casos comunes; para cualquier cosa más elaborada, usa el composable.', 'El ejemplo de sequence envuelve a sus hijos en sequence="0.1": el título, las etiquetas y la línea partida entran una tras otra sin contabilidad de [delay]. Anidar en el template es la coreografía; [at] acepta cualquier parámetro de posición de GSAP.', 'Los inputs son signals: cambia cualquiera y la entrada se repite. El botón Repetir solo recrea el subárbol.', 'Los demos de reveal y parallax hacen scroll dentro de su propio marco en lugar de la página: [scroller] apunta ScrollTrigger a cualquier contenedor con scroll.', diff --git a/apps/docs/src/app/pages/loop.page.ts b/apps/docs/src/app/pages/loop.page.ts index d931caa..0c4ac71 100644 --- a/apps/docs/src/app/pages/loop.page.ts +++ b/apps/docs/src/app/pages/loop.page.ts @@ -35,7 +35,7 @@ const COPY = { 'Cada ficha tiene un tween motionPath pausado usado como setter de posición: el estado del bucle es un número p, y cada ficha se pinta en p más su desfase. Mueves el número, se mueve todo el tren.', 'Observer fusiona rueda, touch y puntero en un solo stream. Mientras arrastras suma deltas a p; al soltar, la velocidad del gesto pasa a InertiaPlugin.', 'A InertiaPlugin no le importa que p no sea un elemento: gsap.to(state, { inertia: { p: { velocity } } }) desliza cualquier propiedad con fricción física, igual que los ladrillos lanzados en la página de Draggable.', - 'Todo se crea dentro del callback: sal de la página y el Observer, los setters y la deriva ambiental se desmontan.', + 'Todo se crea dentro del callback: sal de la página y el Observer, los setters y el movimiento de fondo se desmontan.', ], }, } as const; diff --git a/apps/docs/src/app/pages/sections.page.ts b/apps/docs/src/app/pages/sections.page.ts index bce0887..1285b08 100644 --- a/apps/docs/src/app/pages/sections.page.ts +++ b/apps/docs/src/app/pages/sections.page.ts @@ -32,7 +32,7 @@ const COPY = { 'Un port del demo Animated Continuous Sections de GreenSock: cada tick de rueda, deslizamiento o arrastre mueve una sección completa, con envoltorios en capas que se deslizan en direcciones opuestas, un fondo con parallax y títulos que entran carácter por carácter. El original es GSAP puro; esta versión usa queries de signal e injectGsap, sin cambiar nada más.', hint: 'rueda o desliza dentro del marco', how: 'Cómo funciona', - slides: ['Con scope', 'Reactivo', 'Limpio', 'Tuyo'], + slides: ['Acotado', 'Reactivo', 'Limpio', 'Tuyo'], explain: [ 'La capa deslizante son dos envoltorios anidados animados en direcciones opuestas (yPercent 100 y −100 encontrándose en 0), mientras el fondo se mueve 15% en contra. La dirección decide el signo, así que subir y bajar se sienten igual de bien.', "Un Observer convierte rueda, touch y puntero en 'siguiente' y 'anterior'. Una bandera animating ignora la entrada a mitad de transición; gsap.utils.wrap hace que los extremos den la vuelta.", diff --git a/apps/docs/src/app/pages/svg.page.ts b/apps/docs/src/app/pages/svg.page.ts index a83bd3e..9d7ab7a 100644 --- a/apps/docs/src/app/pages/svg.page.ts +++ b/apps/docs/src/app/pages/svg.page.ts @@ -46,7 +46,7 @@ const COPY = { eyebrow: 'Ejemplo · SVG', title: 'Animación de SVG', intro: - 'Para GSAP el SVG es DOM normal: los trazos se dibujan con DrawSVG, las formas se transforman con MorphSVG y los elementos recorren rutas con MotionPath. Los tres plugins se registran una vez en provideGsap. La forma flotante empieza como el logo de Angular; Transformar la pasa por las demás.', + 'Para GSAP el SVG es DOM normal: los trazos se dibujan con DrawSVG, las formas se transforman con MorphSVG y los elementos recorren rutas con MotionPath. Los tres plugins se registran una vez en provideGsap. La forma flotante empieza como el logo de Angular; el botón Transformar la va cambiando por las demás.', morph: 'Transformar', how: 'Cómo funciona', explain: [ diff --git a/apps/docs/src/app/pages/webgl.page.ts b/apps/docs/src/app/pages/webgl.page.ts index 15aaeeb..1262123 100644 --- a/apps/docs/src/app/pages/webgl.page.ts +++ b/apps/docs/src/app/pages/webgl.page.ts @@ -27,7 +27,7 @@ const COPY = { eyebrow: 'Ejemplo · WebGL', title: 'Un cubo movido por tweens', intro: - 'La rotación, inclinación y escala del cubo viven en un objeto plano; GSAP lo anima como cualquier otra cosa. Un tween lineal infinito lo gira, dos setters quickTo lo inclinan hacia el puntero, Pulso golpea la escala, y el loop de render es un callback de gsap.ticker que la limpieza devuelta se encarga de quitar.', + 'La rotación, inclinación y escala del cubo viven en un objeto plano; GSAP lo anima como cualquier otra cosa. Un tween lineal infinito lo gira, dos setters quickTo lo inclinan hacia el puntero, el botón Pulso le da un empujón a la escala, y el loop de render es un callback de gsap.ticker que se quita con la limpieza devuelta.', hint: 'mueve el puntero para inclinar el cubo', pulse: 'Pulso', how: 'Cómo funciona',