Resumen de componentes
Explora los componentes MDX de Jamdesk: tarjetas, pestañas, avisos y bloques de código, para encontrar el que mejor se adapte a tu documentación.
Jamdesk incluye componentes MDX que puedes usar en cualquier página. Este resumen te ayuda a elegir el componente adecuado para tu contenido.
Uso
Inserta los componentes directamente en tu MDX:
<Card title="Quickstart" icon="rocket" href="/quickstart">
Launch your docs in minutes.
</Card>
Diseño y navegación
Secciones de contenido plegables que permiten a los usuarios expandir solo lo que necesitan. Ideal para preguntas frecuentes, listas de funciones y opciones de configuración.
Aprende a usar el componente Card para crear contenedores interactivos y con estilo, con iconos, imágenes, enlaces y CTA en diseños de cuadrícula.
Diseño de cuadrícula responsivo para mostrar Cards, Tiles y otro contenido en paralelo. Se adapta automáticamente al tamaño de la pantalla.
Frame envuelve imágenes y demostraciones en un contenedor con borde y leyendas opcionales, manteniendo una presentación visual coherente en la documentación.
Usa Panel para fijar contenido personalizado, como avisos o referencias rápidas, en la barra lateral, manteniéndolo visible mientras los lectores se desplazan.
Guías numeradas paso a paso para flujos de configuración, tutoriales y solución de problemas. Admite iconos, bloques de código y contenido anidado.
Paneles intercambiables para contenido mutuamente excluyente, como gestores de paquetes o lenguajes. Los títulos de pestaña coincidentes se sincronizan en toda la página.
Los Tiles muestran vistas previas de contenido con un fondo de patrón estilizado y un área de imagen destacada. Úsalos para integraciones, plantillas o galerías visuales.
Muestra jerarquías de archivos y carpetas con expansión/contracción interactiva y navegación por teclado. Ideal para documentar la estructura de un proyecto.
Crea documentación que se adapta al framework o lenguaje que elija el lector. Secciones completas cambian según la selección del usuario.
Contenido y énfasis
Etiquetas en línea para estados, categorías y metadatos: 11 variantes de color, 4 tamaños, iconos, formas de píldora/redondeadas y contornos.
Aprende a usar los componentes Note, Tip, Warning, Danger, Check y Callout personalizados para resaltar información clave en tu documentación.
Expandable crea un simple interruptor de mostrar/ocultar para contenido que los lectores pueden querer ver, pero que no es esencial para el flujo principal.
Muestra definiciones y contexto al pasar el cursor. Define términos, explica siglas o enlaza a contenido relacionado sin saturar la página.
Entradas de registro de cambios estilo línea de tiempo, con fechas, descripciones y etiquetas de categoría. Se integra con tu tabla de contenido para la navegación.
Muestra contenido diferente a lectores humanos y a agentes de IA en la misma página. Contexto, instrucciones y definiciones exclusivos para agentes, que no aparecen en la documentación renderizada.
Código y datos
Muestra bloques de código en una interfaz con pestañas. Presenta la misma operación en varios lenguajes, como cURL, Python y JavaScript.
Fija bloques de código en una barra lateral derecha fija en escritorio para que los lectores puedan consultarlos mientras se desplazan. Admite lenguajes en pestañas.
Documenta los parámetros de la API y los campos de respuesta con los componentes ParamField y ResponseField. Admite tipos, valores predeterminados y objetos anidados.
Usa Prompt para presentar instrucciones de IA reutilizables con copia, acciones integradas de abrir en, destinos personalizados, iconos y opciones de visualización compacta.
Organiza los datos en filas y columnas. Admite tablas en markdown y componentes Table con ordenación, resaltado y combinación de celdas.
Diagramas y elementos visuales
El componente Color muestra paletas de colores para documentar sistemas de diseño, guías de marca o cualquier especificación de color.
Genera diagramas de flujo, diagramas de secuencia, líneas de tiempo, gráficos circulares y más a partir de sintaxis Mermaid basada en texto. Los diagramas se generan como SVG en el momento del build.
Genera diagramas de arquitectura, diagramas de flujo, secuencias y modelos SQL a partir de sintaxis D2 basada en texto. Los diagramas se renderizan como SVG con temas claro y oscuro automáticos.
Interacción
Agrega un formulario de suscripción a boletín o registro de cambios en cualquier página de documentación con el componente EmailSubscribe: captura nativa para siete proveedores, código incrustado para el resto.
Incorpora una demo en vivo del widget de novedades en tu documentación con el componente MDX Widget: un botón que abre tu registro de cambios en una ventana modal, sin necesidad de etiqueta de script.
