> ## Documentation Index
> Fetch the complete documentation index at: https://www.mintlify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# MDX

> Usa el componente MDX para renderizar Markdown dentro de expresiones y condicionales JSX, de modo que encabezados, bloques de código y tablas se compilen como el resto de tu página.

Usa el componente `<MDX>` para renderizar sus elementos hijos como MDX. El contenido entre las etiquetas se compila como el resto de tu página: encabezados, bloques de código, tablas y otros componentes funcionan.

El componente es más útil dentro de expresiones `{...}`. El Markdown dentro de una expresión normalmente se renderiza como texto JSX sin formato. Envuélvelo en `<MDX>` para mantener el renderizado completo de Markdown mientras muestras contenido de forma condicional.

<div id="example">
  ## Ejemplo
</div>

Muestra diferentes secciones de Markdown según una variable exportada:

````mdx Conditional Markdown theme={null}
export const platform = "ios";

{platform === "ios" ? (
  <MDX>
    ## Install on iOS

    Download the SDK, then run:

    ```bash
    pod install
    ```
  </MDX>
) : (
  <MDX>
    ## Install on Android

    Add the SDK to your Gradle dependencies.
  </MDX>
)}
````

Solo la rama activa se renderiza en la página.

También puedes usar `<MDX>` en el nivel superior de una página para agrupar una sección de Markdown en un solo elemento:

```mdx Block form theme={null}
<MDX>

  # Hello

  This heading and paragraph compile as Markdown.
</MDX>
```

Deja una línea en blanco después de la etiqueta de apertura en la forma de bloque para que el contenido se analice como Markdown a nivel de bloque. Dentro de expresiones, `<MDX>` elimina la sangría inicial común de su contenido, por lo que puedes sangrarlo para que coincida con el código circundante.

<Note>
  Los encabezados dentro de `<MDX>` se fusionan en la tabla de contenido de la página en el orden del documento. Esto incluye los encabezados de ramas que nunca se renderizan, como el lado inactivo de un condicional.
</Note>

<div id="limits">
  ## Límites
</div>

* Puedes anidar componentes `<MDX>` hasta 8 niveles de profundidad.
* Una página puede expandir hasta 500 fragmentos `<MDX>` dentro de expresiones.

Superar cualquiera de los dos límites hace fallar la compilación.


## Related topics

- [Glosario](/docs/es/reference/glossary.md)
- [Extensión Mintlify MDX](/docs/es/cli/mdx-extension.md)
- [Solución de problemas](/docs/es/api-playground/troubleshooting.md)