DHTMLX MCP Server

El servidor MCP de DHTMLX proporciona acceso en tiempo real a la documentación oficial y un RAG inteligente.

Ver en dhtmlx.comPrueba este MCPPatrocinado

Documentación

DHTMLX Suite es una biblioteca de interfaz de usuario en JavaScript que incluye Grid, Form, Chart, Tree, Calendar, Layout y muchos otros componentes, cada uno con sus propias propiedades de configuración, métodos y eventos. Los asistentes de codificación con IA a menudo dependen de datos de entrenamiento que pueden no reflejar las últimas versiones de Suite, por lo que el código generado puede hacer referencia a API obsoletas, nombres de eventos incorrectos u opciones de configuración modificadas.

El servidor DHTMLX MCP brinda a las herramientas de IA acceso directo a la documentación actual de Suite mientras generan respuestas. Al conectar un asistente al endpoint de MCP, los desarrolladores obtienen código de inicialización preciso, firmas de métodos actuales y detalles de configuración correctos para cualquier componente de Suite, basados en documentación en vivo en lugar de datos de entrenamiento desactualizados.

Endpoint de MCP

https://docs.dhtmlx.com/mcp

[!-secondary] -secondary nota

El servidor DHTMLX MCP es un servicio compartido para todos los productos principales de DHTMLX, no solo DHTMLX Suite. Las instrucciones de configuración se aplican a cualquier componente de DHTMLX con el que esté trabajando.

Dónde ayuda el servidor MCP con Suite

El servidor MCP indexa la documentación completa de DHTMLX Suite en todos los componentes. Los escenarios comunes incluyen:

  • Consultar la API actual de cualquier componente de Suite, incluidos Grid, Form, Chart, Tree, Calendar y otros.
  • Generar código de inicialización y configuración listo para ejecutar para cualquier componente basado en una descripción.
  • Configurar funciones de Grid: ordenamiento, filtrado, edición en línea, redimensionamiento de columnas y arrastrar y soltar entre cuadrículas.
  • Construir diseños de Form con reglas de validación, controles integrados y comportamiento basado en eventos.
  • Crear configuraciones de Chart en tipos de gráficos de barras, líneas, circulares, de área, radiales y otros.
  • Cargar y gestionar datos usando DataCollection en todos los componentes.
  • Manejar eventos de componentes para responder a interacciones de usuario, cambios de valor y actualizaciones de datos.
  • Componer múltiples componentes en un Layout compartido con filas, columnas y celdas.
  • Explorar el soporte de TypeScript y la integración con React, Vue, Angular y Svelte.

Cómo funciona el servidor DHTMLX MCP

El servidor DHTMLX MCP utiliza un pipeline de Generación Aumentada por Recuperación (RAG) combinado con el Protocolo de Contexto de Modelo (MCP) para proporcionar a los asistentes de IA documentación actualizada. Antes de todo eso, el asistente primero determina qué parte de una solicitud realmente necesita una consulta de documentación y maneja el resto con su propio conocimiento.

Así es como se ve para el prompt "Quiero crear un layout con un calendario en una celda y una cuadrícula en otra", un ejemplo entre los muchos componentes de Suite que cubre este mismo mecanismo:

  1. El asistente envía la consulta a través de MCP.
  2. El servidor determina que la consulta toca la documentación de Layout, Calendar y Grid.
  3. Dado que la respuesta requiere código generado, el servidor enruta la consulta a Search, uno de dos flujos de trabajo; una pregunta factual más limitada se enrutaría a Inference en su lugar, que lee las mismas páginas y responde directamente.
  4. Search recupera las páginas coincidentes de un índice vectorial construido sobre la documentación actual y las envía de vuelta al asistente como contexto.
  5. El asistente configura el layout, el calendario y la cuadrícula juntos usando ese contexto.

Este enfoque permite que las herramientas de IA generen respuestas basadas en documentación actual.

Configuración

La mayoría de las herramientas de desarrollo de IA permiten agregar endpoints de MCP mediante un comando CLI o un archivo de configuración JSON. La configuración generalmente consiste en registrar la URL del servidor MCP.

https://docs.dhtmlx.com/mcp

A continuación se muestran ejemplos para herramientas de uso común.

Claude Code

[!-info] -info info

Aprenda cómo conectar Claude Code con MCP en la documentación oficial.

La forma más rápida es agregar la URL del servidor MCP a través de la CLI:

claude mcp add --transport http dhtmlx-mcp https://docs.dhtmlx.com/mcp

O si prefiere la configuración manual, agregue esto a su .mcp.json:

{
  "mcpServers": {
    "dhtmlx-mcp": {
      "type": "http",
      "url": "https://docs.dhtmlx.com/mcp"
    }
  }
}

Cursor

[!-info] -info info

Para instrucciones detalladas, consulte la documentación oficial.

Siga los pasos a continuación:

  1. Abra Configuración (Cmd+Shift+J en Mac, Ctrl+Shift+J en Windows/Linux)
  2. Vaya a Herramientas y MCP
  3. Haga clic en Agregar MCP personalizado
  4. Pegue esta configuración:
{
  "mcpServers": {
    "dhtmlx-mcp": {
      "url": "https://docs.dhtmlx.com/mcp"
    }
  }
}

Google Antigravity

Antigravity 2.0

[!-info] -info info

Aprenda más sobre cómo conectar servidores MCP en la documentación oficial.

Estos son los pasos a completar:

  1. Abra la paleta de comandos
  2. Escriba "mcp add"
  3. Seleccione "HTTP"
  4. Proporcione los siguientes valores:
  • Nombre:
dhtmlx-mcp
  • URL:
https://docs.dhtmlx.com/mcp

Antigravity CLI

[!-info] -info info

Consulte la guía relacionada para aprender sobre la migración de Gemini CLI a Antigravity CLI.

Cree mcp_config.json en una de estas ubicaciones:

  • Global: ~/.gemini/config/mcp_config.json
  • Espacio de trabajo: .agents/mcp_config.json

Agregue lo siguiente:

{
  "mcpServers": {
    "dhtmlx-mcp": {
      "serverUrl": "https://docs.dhtmlx.com/mcp"
    }
  }
}

Luego ejecute agy en la terminal.

ChatGPT

[!-info] -info info

Para más información, consulte la documentación oficial.

Siga estos pasos:

  1. Vaya a Configuración → Aplicaciones y conectores
  2. Haga clic en Configuración avanzada
  3. Habilite Modo desarrollador
  4. Regrese a la pantalla de Aplicaciones y conectores y haga clic en "Crear"
  5. Configure el conector:
  • Nombre:
dhtmlx-mcp
  • URL:
https://docs.dhtmlx.com/mcp
  • Autenticación: No authentication
  1. Haga clic en Crear

Una vez agregado, ChatGPT puede recuperar documentación del servidor MCP durante las conversaciones.

[!-info] -info info

Para flujos de trabajo de codificación intensivos, otras herramientas compatibles con MCP pueden ser más eficientes.

Otras herramientas

La mayoría de las herramientas modernas de codificación con IA exponen MCP bajo "Model Context Protocol", "Context Sources" o redacción similar en la configuración. Agregue https://docs.dhtmlx.com/mcp como fuente personalizada.

Privacidad y manejo de datos

El servidor MCP es un servicio alojado.

Puntos clave:

  • No se ejecuta localmente.
  • No accede a archivos en su entorno.
  • No almacena información personal de usuarios.

Las consultas pueden registrarse para depuración y mejoras del servicio.

Las organizaciones que requieren garantías de privacidad más estrictas pueden solicitar opciones de implementación comercial sin registro de consultas. Para consultas: info@dhtmlx.com.

Ejemplos de prompts para Suite con IA

Una vez que conecte el servidor MCP, formule sus prompts en torno a un objetivo concreto para que el asistente sepa qué componente y función debe consultar. Los prompts a continuación están organizados por componente. Cópielos y adáptelos según sea necesario.

Grid

I want to create a grid with the possibility to sort, resize and edit column cells.

I want to create two grids with the possibility to drag item rows from one grid to another, but not vice versa.

How do I apply multiple filters to a DHTMLX Grid?

Form

How do I add custom validation to DHTMLX Form? Use the docs.

How do I get all form values as an object and handle the afterSend event in DHTMLX Form?

Chart

I have a chart with the bar type, how can I also add a line chart above it?

How do I load data into a DHTMLX Chart from a JSON array?

Layout y composición

I want to create a layout with a calendar in one cell, and a grid in another.

How do I resize layout cells and handle the resize event in DHTMLX Layout?

Ejemplo relacionado: Kanban y Chatbot. Ejemplo construido con MCP

Consejos para prompts efectivos de Suite

  • Nombre el componente. DHTMLX Suite contiene muchos componentes, cada uno con su propia API. Siempre especifique el componente en su prompt (por ejemplo, "en DHTMLX Grid" vs. "en DHTMLX Form"). Sin esto, el asistente puede recuperar documentación del componente incorrecto.
  • Incluya la función o el comportamiento. Prompts como "arrastrar y soltar entre dos cuadrículas" o "validación de formulario al enviar" recuperan documentación más relevante que una descripción genérica. Cuanto más específica sea la función, más precisa será la recuperación.
  • Agregue "Usa la documentación" a su prompt. Esta frase le indica al asistente que debe activar una consulta de MCP en lugar de responder solo con datos de entrenamiento. Es especialmente útil para nombres de eventos, firmas de métodos y propiedades de configuración que cambian entre versiones.
  • Describa la interacción esperada. Los componentes de Suite a menudo admiten múltiples formas de lograr un objetivo (una propiedad de configuración, una llamada a método o un manejador de eventos). Describir el comportamiento esperado ayuda al asistente a elegir el enfoque correcto.