i18n(es): Update guides/ V3

src/content/docs/es/guides/content-collections.mdx

@@ -396,6 +396,16 @@ const publishedBlogEntries = await getCollection('blog', ({ data }) => {
 });
 ```
 
+También puedes crear páginas en borrador que estarán disponibles cuando ejecutes el servidor de desarrollo, pero que no se construirán en producción:
+
+```js
+// Ejemplo: Filtrar las entradas de contenido con `draft: true` solo al construir para producción
+import { getCollection } from 'astro:content';
+const blogEntries = await getCollection('blog', ({ data }) => {
+  return import.meta.env.PROD ? data.draft !== true : true;
+});
+```
+
 Para filtrar argumentos también admite el filtrado por directorios anidados dentro de una colección. Dado que el `id` incluye la ruta anidada completa, puedes filtrar por el inicio de cada `id` para devolver solo los elementos de un directorio anidado específico:
 
 ```js

src/content/docs/es/guides/integrations-guide.mdx

@@ -126,17 +126,17 @@ Para eliminar una integración, primero desinstala la integración de tu proyect
 <PackageManagerTabs>
   <Fragment slot="npm">
   ```shell
-  npm uninstall @astrojs/image
+  npm uninstall @astrojs/react
   ```
   </Fragment>
   <Fragment slot="pnpm">
   ```shell
-  pnpm uninstall @astrojs/image
+  pnpm uninstall @astrojs/react
   ```
   </Fragment>
   <Fragment slot="yarn">
   ```shell
-  yarn remove @astrojs/image
+  yarn remove @astrojs/react
   ```
   </Fragment>
 </PackageManagerTabs>
@@ -145,10 +145,11 @@ Después, elimina la integración de tu archivo `astro.config.*`:
 
 ```js title="astro.config.mjs" del={3,7}
 import { defineConfig } from 'astro/config'
-import image from "@astrojs/image";
+import react from "@astrojs/react";
+
 export default defineConfig({
   integrations: [
-    image()
+    react()
   ]
 })
 ```

src/content/docs/es/guides/markdown-content.mdx

@@ -58,60 +58,6 @@ No tiene muchos estilos pero Markdown soporta:
 
 📚 Lee más acerca del [enrutamiento basado en archivos](/es/core-concepts/routing/) u opciones para crear [rutas dinámicas](/es/core-concepts/routing/#rutas-dinámicas).
 
-### Páginas de borrador
-
-`draft: true` es un valor opcional que marcará una página o artículo individual de Markdown o MDX como "borrador". De forma predeterminada, esta página será:
-- excluida de la compilación final del proyecto (**no se creará ninguna página**)
-- devuelta por [`Astro.glob()`](/es/reference/api-reference/#astroglob) (**visible en listas de artículos**)
-
-```markdown {5}
----
-# src/pages/post/blog-post.md
-layout: ../../layouts/BaseLayout.astro
-title: Mi artículo de blog
-draft: true
----
-
-Este es mi artículo de blog en progreso.
-
-No se creará ninguna página para esta publicación.
-
-Para crear y publicar este artículo:
-
-- actualiza el frontmatter a `draft: false` o
-- elimina la propiedad `draft` por completo.
-
-Pero esta página _sí será_ devuelta por cualquier petición que coincida en `Astro.glob()`.
-```
-
-Para evitar que los borradores sean incluidos en un registro de artículos o en la lista de artículos más recientes, puedes filtrar los resultados devueltos por `Astro.glob()`:
-
-```js
-const posts = await Astro.glob('../pages/post/*.md');
-const nonDraftPosts = posts.filter((post) => !post.frontmatter.draft);
-```
-
-#### Habilitar la creación de páginas de borrador
-
-Para habilitar la creación de páginas de borrador por defecto, actualiza tu `astro.config.mjs` añadiendo `drafts: true` a `markdown` o a la integración `mdx`:
-
-```js title="astro.config.mjs" ins={5, 8}
-import { defineConfig } from 'astro/config';
-
-export default defineConfig({
-  markdown: {
-    drafts: true,
-  },
-  integrations: [mdx({
-    drafts: true,
-  })],
-});
-```
-
-:::tip
-¡También puedes agregar la extensión `--drafts` al ejecutar `astro build` para incluir la creación de páginas borrador!
-:::
-
 ## Características de Markdown
 
 Astro provee algunas características adicionales incorporadas disponibles a la hora de usar Markdown y archivos MDX.
@@ -182,7 +128,7 @@ Por ejemplo, para prevenir que `<` sea interpretado como el inicio de un element
 
 Añadiendo la [integración de MDX](/es/guides/integrations-guide/mdx/) de Astro vas a potenciar tu autoría de Markdown con variables JSX, expresiones y componentes.
 
-También añade características extra al MDX estándar, incluyendo soporte para [frontmatter del estilo Markdown en MDX](https://mdxjs.com/guides/frontmatter/). Esto te permite usar la mayoría de las características incorporadas en Astro de Markdown como la propiedad [`layout` en el frontmatter](#layout-en-el-frontmatter) y una configuración para [páginas de borrador](#páginas-de-borrador).
+También añade características extra al MDX estándar, incluyendo soporte para [frontmatter del estilo Markdown en MDX](https://mdxjs.com/guides/frontmatter/). Esto te permite usar la mayoría de las características incorporadas en Astro de Markdown como la propiedad [`layout` en el frontmatter](#layout-en-el-frontmatter).
 
 Los archivos `.mdx` deben ser escritos usando [sintaxis de MDX](https://mdxjs.com/docs/what-is-mdx/#mdx-syntax) en vez de la sintaxis de tipo HTML de Astro.
 

src/content/docs/es/guides/middleware.mdx

@@ -45,7 +45,7 @@ Puedes importar y usar la función de utilidad `defineMiddleware()` para aprovec
 
 
 ```ts title="src/middleware.ts"
-import { defineMiddleware } from "astro/middleware";
+import { defineMiddleware } from "astro:middleware";
 
 // `context` y `next` son tipados automáticamente.
 export const onRequest = defineMiddleware((context, next) => {
@@ -139,7 +139,7 @@ export const onRequest = async (context, next) => {
 Múltiples middlewares pueden ser unidos en un orden específico utilizando [`sequence()`](#sequence):
 
 ```js title="src/middleware.js"
-import { sequence } from "astro/middleware";
+import { sequence } from "astro:middleware";
 
 async function validation(_, next) {
     console.log("solicitud de validación");

src/content/docs/es/guides/rss.mdx

@@ -47,20 +47,20 @@ El archivo de ejemplo a continuación `src/pages/rss.xml.js` creará un feed RSS
 ```js title="src/pages/rss.xml.js"
 import rss from '@astrojs/rss';
 
-export function get(context) {
+export function GET(context) {
   return rss({
     // `<title>` campo en el xml generado
-    title: 'Buzz’s Blog',
+    title: 'Blog de Buzz',
     // `<description>` campo en el xml generado
-    description: 'A humble Astronaut’s guide to the stars',
+    description: 'Guía de un humilde astronauta a las estrellas',
     // Usa el "site" desde el contexto del endpoint
     // https://docs.astro.build/en/reference/api-reference/#contextsite
     site: context.site,
     // Array de `<item>`s en el xml generado
     // Consulta la sección "Generando `items`" para ejemplos utilizando colecciones de contenido y glob imports
     items: [],
     // (opcional) inyecta xml personalizado
-    customData: `<language>en-us</language>`,
+    customData: `<language>es</language>`,
   });
 }
 ```
@@ -76,11 +76,11 @@ Puedes generar esta matriz a partir de un esquema de colección de contenido o u
 Para crear un RSS feed de páginas manejadas en [colecciones de contenido](/es/guides/content-collections/), utiliza la función `getCollection()` para recuperar la lista de tus artículos.
 
 ```js title="src/pages/rss.xml.js" "items:" "const blog = await getCollection('blog');"
-export async function get(context) {
+export async function GET(context) {
   const blog = await getCollection('blog');
   return rss({
-    title: 'Buzz’s Blog',
-    description: 'A humble Astronaut’s guide to the stars',
+    title: 'Blog de Buzz',
+    description: 'Guía de un humilde astronauta a las estrellas',
     site: context.site,
     items: blog.map((post) => ({
       title: post.data.title,
@@ -120,10 +120,10 @@ Esta función asume, pero no verifica, que todas las propiedades RSS necesarias
 
 ```js title="src/pages/rss.xml.js" "pagesGlobToRssItems" "await pagesGlobToRssItems("
 import rss, { pagesGlobToRssItems } from '@astrojs/rss';
-export async function get(context) {
+export async function GET(context) {
   return rss({
-    title: 'Buzz’s Blog',
-    description: 'A humble Astronaut’s guide to the stars',
+    title: 'Blog de Buzz',
+    description: 'Guía de un humilde astronauta a las estrellas',
     site: context.site,
     items: await pagesGlobToRssItems(
       import.meta.glob('./blog/*.{md,mdx}'),
@@ -156,15 +156,16 @@ import rss from '@astrojs/rss';
 import sanitizeHtml from 'sanitize-html';
 import MarkdownIt from 'markdown-it';
 const parser = new MarkdownIt();
-export async function get(context) {
+
+export async function GET(context) {
   const blog = await getCollection('blog');
   return rss({
-    title: 'Buzz’s Blog',
-    description: 'A humble Astronaut’s guide to the stars',
+    title: 'Blog de Buzz',
+    description: 'Guía de las estrellas para un humilde astronauta',
     site: context.site,
     items: blog.map((post) => ({
       link: `/blog/${post.slug}/`,
-      // Note: this will not process components or JSX expressions in MDX files.
+      // Nota: esto no procesará componentes ni expresiones JSX en archivos MDX.
       content: sanitizeHtml(parser.render(post.body)),
       ...post.data,
     })),
@@ -177,12 +178,12 @@ Cuando utilices imports glob con Markdown, puedes utilizar el helper `compiledCo
 ```js title="src/pages/rss.xml.js" ins={2, 13}
 import rss from '@astrojs/rss';
 import sanitizeHtml from 'sanitize-html';
-export function get(context) {
+export function GET(context) {
   const postImportResult = import.meta.glob('../posts/**/*.md', { eager: true }); 
   const posts = Object.values(postImportResult);
   return rss({
-    title: 'Buzz’s Blog',
-    description: 'A humble Astronaut’s guide to the stars',
+    title: 'Blog de Buzz',
+    description: 'Guía de un humilde astronauta a las estrellas',
     site: context.site,
     items: posts.map((post) => ({
       link: post.url,

src/content/docs/es/guides/server-side-rendering.mdx

@@ -162,7 +162,7 @@ export const prerender = true;
 ```mdx title="src/pages/mypage.mdx" {5}
 ---
 layout: '../layouts/markdown.astro'
-title: 'My page'
+title: 'Mi página'
 ---
 export const prerender = true;
 # Esta es mi página estática, pre-renderizada
@@ -172,7 +172,7 @@ Y para un endpoint:
 
 ```js title="src/pages/myendpoint.js" {1}
 export const prerender = true;
-export async function get() {
+export async function GET() {
   return {
     body: JSON.stringify({ message: `Este es mi endpoint estático` }),
   };
@@ -185,7 +185,7 @@ Para un sitio principalmente estático configurado como `output: hybrid`, añade
 
 ```js title="src/pages/randomnumber.js" {1}
 export const prerender = false;
-export async function get() {
+export async function GET() {
   let number = Math.random();
   return {
     body: JSON.stringify({ number, message: `Aquí hay un número al azar: ${number}` }),

src/content/docs/es/guides/styling.mdx

@@ -39,10 +39,10 @@ Este CSS:
 Se compila en esto:
 ```astro
 <style>
-  h1:where(.astro-HHNQFKH6) {
+  h1[data-astro-cid-hhnqfkh6] {
      color: red;
   }
-  .text:where(.astro-HHNQFKH6) {
+  .text[data-astro-cid-hhnqfkh6] {
     color: blue;
   }
 </style>
@@ -130,7 +130,6 @@ const backgroundColor = "rgb(24 121 78)";
 
 En Astro, los atributos HTML tales como `class` no se pasan automáticamente a los componentes hijos.
 
-
 En cambio, debes aceptar una prop `class` en el componente hijo y aplicársela al elemento raíz. Al desestructurar las props debes renombrarlo, porque `class` es una [palabra clave (o reservada)](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Lexical_grammar#palabras_clave) en JavaScript.
 
 ```astro title="src/components/MyComponent.astro" {2,4}
@@ -154,7 +153,7 @@ import MyComponent from "../components/MyComponent.astro"
 <MyComponent class="red">¡Esto será rojo!</MyComponent>
 ```
 
-Este patrón te permite estilar componentes hijos directamente. Astro pasará el nombre de la clase local del padre (por ejemplo `astro-HHNQFKH6`) por la propiedad `class` automaticamente, incluyendo el hijo en ámbito del componente padre.
+Este patrón te permite estilar componentes hijos directamente. Astro pasará el nombre de la clase local del padre (p. ej. `astro-hhnqfkh6`) por la propiedad `class` automaticamente, incluyendo el hijo en el ámbito de su padre. Ten en cuenta que este patrón solo funciona cuando tu [opción `scopedStyleStrategy`](/es/reference/configuration-reference/#scopedstylestrategy) está configurada como `'where'` o `'class'`.
 
 :::note[Clases globales de componentes padre]
 Debido a que la propiedad `class` incluye al hijo en el ámbito de su padre, es posible que los estilos caigan en cascada de padre a hijo. Para evitar que esto tenga efectos secundarios no deseados, asegúrese de usar nombres de clase únicos en el componente secundario.
@@ -526,23 +525,35 @@ Si usas Tailwind, el [plugin de tipografía](https://tailwindcss.com/docs/typogr
 
 ### Control de paquetes
 
-Cuando Astro genera tu sitio para desplegarlo en producción, combina tu CSS en fragmentos. Cada página de tu sitio es un fragmento separado, y además, el CSS que se comparte entre varias páginas se separa en fragmentos adicionales para su reutilización.
+Cuando Astro genera tu sitio para desplegarlo en producción, minifica y combina tu CSS en fragmentos. Cada página de tu sitio es un fragmento separado, y además, el CSS que se comparte entre varias páginas se separa en fragmentos adicionales para su reutilización.
+
+Sin embargo, cuando varias páginas comparten estilos, algunos fragmentos compartidos pueden volverse muy pequeños. Si se enviaran todos por separado, se generarían muchas solicitudes de hojas de estilo y afectarían el rendimiento del sitio. Por lo tanto, de forma predeterminada, Astro solo vinculará aquellos en tu HTML que tengan un tamaño superior a 4 KB como etiquetas `<link rel="stylesheet">`, mientras que incluirá en línea los más pequeños en etiquetas `<style type="text/css">`. Este enfoque proporciona un equilibrio entre el número de solicitudes adicionales y el volumen de CSS que se puede almacenar en caché entre las páginas.
+
+Puedes configurar el tamaño en el que las hojas de estilo se vincularán externamente (en bytes) utilizando la opción de compilación `assetsInlineLimit` en Vite. Ten en cuenta que esta opción también afecta la inclusión en línea de scripts e imágenes.
+
+```js
+import { defineConfig } from 'astro/config';
 
-En cada uno de tus archivos HTML se agregarán etiquetas `<link rel="stylesheet">`, una por cada fragmento que necesite la página.
+export default defineConfig({
+  vite: {
+    build: {
+      assetsInlineLimit: 1024,
+    }
+  };
+});
+```
 
-Los sitios con un gran número de páginas y diferentes estilos compartidos pueden generar muchas solicitudes de hojas de estilo y afectar el rendimiento del sitio. Puedes configurar la opción `inlineStylesheets` para reducir la cantidad de estas solicitudes al colocar las hojas de estilo (minimizadas) dentro de una etiqueta `<style>` en lugar de solicitarlas externamente.
+Si prefieres que todos los estilos del proyecto sigan siendo externos, puedes configurar la opción de compilación `inlineStylesheets`.
 
 ```js
 import { defineConfig } from 'astro/config';
 export default defineConfig({
   build: {
-    inlineStylesheets: 'auto'
+    inlineStylesheets: 'never'
   }
 });
 ```
 
-La opción `'auto'` incrustará solo las hojas de estilo que estén por debajo del umbral establecido por `vite.build.assetsInlineLimit`, reduciendo la cantidad de solicitudes para hojas de estilo más pequeñas. Las hojas de estilo más grandes, como las utilizadas globalmente por todas las páginas, aún se obtendrán externamente y se almacenarán en caché. Esta opción proporciona un equilibrio entre la cantidad de hojas de estilo cargadas y los estilos que se pueden almacenar en caché entre las páginas.
-
 También puedes establecer esta opción en `'always'`, lo cual incrustará todas las hojas de estilo.
 
 ## Avanzado

src/content/docs/es/guides/troubleshooting.mdx

@@ -180,7 +180,7 @@ Para ayudarte a debuggear tus componentes de Astro, Astro provee un componente [
 
 ```astro {2,7}
 ---
-import { Debug } from 'astro/components';
+import { Debug } from 'astro:components';
 const sum = (a, b) => a + b;
 ---
 
@@ -192,7 +192,7 @@ El componente Debug soporta una gran variedad de opciones de sintaxis para un de
 
 ```astro {2,7-9}
 ---
-import { Debug } from 'astro/components';
+import { Debug } from 'astro:components';
 const sum = (a, b) => a + b;
 const respuesta = sum(2, 4);
 ---