ant-design/x
6 skills348 installs28.2k starsGitHub
Install
npx skills add https://github.com/ant-design/xSkills in this repo
1X MarkdownThis skill covers rendering Markdown with the @ant-design/x-markdown React package, including streaming LLM output. A developer uses it to render assistant replies chunk-by-chunk, map custom tags to business components, add plugins or themes, and handle incomplete syntax safely. It sits at the render layer after @ant-design/x and @ant-design/x-sdk have produced the message data.74installs2Use X ChatThis skill explains how to use the @ant-design/x-sdk useXChat hook to build AI conversation applications. A developer uses it for custom Provider integration, message state management, error and abort handling, and multi-conversation management. It shows how to map the hook's MessageInfo array into Bubble.List items and wire the Sender component for sending and cancelling requests.66installs3X RequestThis skill explains how to configure XRequest from @ant-design/x-sdk, the request tool that handles network communication, authentication, error handling, and streaming for Ant Design X chat apps. A developer uses it to set up transport, auth headers, retries, and SSE or JSON streaming for a chat interface. It includes a security guide on keeping API keys out of the browser and using proxy forwarding instead.59installs4X ComponentsThis skill covers the UI components in the @ant-design/x React library for building AI chat interfaces. A developer uses it to choose components like Bubble, Sender, Conversations, ThoughtChain, and Actions for each part of a chat screen and compose them into a page. It documents API usage, composition patterns, and common anti-patterns such as mapping Bubble manually instead of using Bubble.List.56installs5X Chat ProviderThis skill explains how to implement a custom Chat Provider so a streaming chat API can be adapted into Ant Design X's standard message format. A developer uses it when their backend response shape does not match a built-in OpenAI or DeepSeek provider and they need to subclass AbstractChatProvider. It walks through analyzing the interface, creating the provider class, and wiring the transform hooks.53installs6X CardThis skill covers @ant-design/x-card, the React implementation of the A2UI protocol that lets AI agents render interactive UIs from structured JSON command streams. A developer uses it to set up XCard.Box and XCard.Card, register component catalogs, bind data via JSON Pointer paths, and handle user actions sent back to the agent. It also documents A2UI v0.9 commands and streaming progressive rendering.40installs