Ant Design v6 operator

Answer common Ant Design React questions with a compact component chooser, import patterns, API reminders, state-model guidance, and version-aware examples. Use when someone asks which component to use, how to wire a common prop or pattern, or wants a quick Ant Design reference.

Compose Ant Design data displays with Card, List, Descriptions, Statistic, Tag, Badge, Avatar, Empty, Skeleton, Result, and Progress. Use when building dashboards, detail panels, activity lists, status summaries, loading states, empty states, or error and partial-data views.

Build, review, and repair typed Ant Design forms with Form, Form.Item, validation rules, async submission, dependencies, dynamic Form.List fields, Upload normalization, and controlled values. Use when adding create or edit forms, fixing validation or initial-value behavior, or wiring submit, reset, loading, and error states.

Connect Ant Design to the surrounding React stack, covering routers, server-state and form libraries, date adapters, Tailwind or existing CSS, internationalization and locale, design tokens, icon bundling, and component testing. Use when Ant Design must cooperate with another library, when links or navigation inside components behave wrongly, when a date picker rejects the project's date type, or when styles from two systems collide.

Build and review responsive Ant Design page shells and layouts with Layout, Flex, Space, Grid, Row, and Col. Use when creating dashboards, sidebars, headers, content regions, responsive columns, or fixing overflow, height, spacing, and breakpoint behavior.

Discover, compatibility-check, install, update, or explain Ant Design's first-party agent skill for Ant Design 6. Use when asked about native Ant Design skills, agent setup, the Ant Design CLI skill, or whether an installed Ant Design skill matches this v6 operator.

Build and review Ant Design navigation with Menu, Dropdown, Breadcrumb, Tabs, Steps, and route-aware active state. Use when adding app navigation, settings sections, tabbed views, breadcrumbs, action menus, or fixing selected keys, deep links, keyboard behavior, and mobile navigation.

Implement Ant Design overlays and feedback with Modal, Drawer, Popconfirm, Alert, message, notification, Spin, and Result. Use when adding confirmations, task panels, toasts, inline errors, loading feedback, or repairing missing context, focus, close, and destructive-action behavior.

Configure and verify Ant Design in React applications, including package detection, provider placement, Next.js boundaries, styling, icons, and SSR-safe setup. Use when adding Ant Design to an app, fixing a broken installation, wiring ConfigProvider or App, or checking whether an existing setup matches the installed Ant Design version.

Build and repair typed Ant Design Tables with stable row keys, column renderers, sorting, filtering, pagination, selection, expandable rows, loading, empty states, and server-side data. Use when adding an admin or data-heavy table or fixing stale rows, incorrect pagination, filters, or selection behavior.

Configure and review Ant Design visual tokens, ConfigProvider themes, component overrides, dark or compact modes, typography, spacing, radius, and status colors. Use when establishing a design system, adding theme switching, fixing inconsistent component styling, or replacing brittle CSS overrides.

Diagnose Ant Design React failures involving missing styles, SSR or hydration, provider context, Form values, Table state, overlays, icons, dates, tokens, TypeScript, layout, and accessibility. Use when Ant Design renders incorrectly, logs warnings, loses state, or behaves differently across development, production, or themes.