XProvider
XProvider
Provide a uniform configuration support for x components.
Importimport { XProvider } from "@ant-design/x"; |
Sourcecomponents/x-provider |
Ant Design XImportimport { XProvider } from "@ant-design/x"; |
Sourcecomponents/x-provider |
The XProvider extends the ConfigProvider from antd and provides global configuration for components in @ant-design/x.
If you are already using ConfigProvider from antd, please make the following changes to your code:
- import { ConfigProvider } from 'antd';+ import { XProvider } from '@ant-design/x';const App = () => (- <ConfigProvider>+ <XProvider><YourApp />- </ConfigProvider>+ </XProvider>);
XProvider fully extends antd's ConfigProvider. Props ref：Antd ConfigProvider
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| bubble | Global configuration for the Bubble component | {style: React.CSSProperties; styles: Record<string, React.CSSProperties>;className: string; classNames: Record<string, string>;} | - | - |
| conversations | Global configuration for the Conversations component | {style: React.CSSProperties; styles: Record<string, React.CSSProperties>;className: string; classNames: Record<string, string>;shortcutKeys: {items?: ShortcutKeys<'number'> | ShortcutKeys | - | - |
| prompts | Global configuration for the Prompts component | {style: React.CSSProperties; styles: Record<string, React.CSSProperties>;className: string; classNames: Record<string, string>;} | - | - |
| sender | Global configuration for the Sender component | {style: React.CSSProperties; styles: Record<string, React.CSSProperties>;className: string; classNames: Record<string, string>;} | - | - |
| suggestion | Global configuration for the Suggestion component | {style: React.CSSProperties; className: string;} | - | |
| thoughtChain | Global configuration for the ThoughtChain component | {style: React.CSSProperties; styles: Record<string, React.CSSProperties>;className: string; classNames: Record<string, string>;} | - | |
| actions | Global configuration for the Actions component | {style: React.CSSProperties; className: string;} | - |
type SignKeysType = {Ctrl: keyof KeyboardEvent;Alt: keyof KeyboardEvent;Meta: keyof KeyboardEvent;Shift: keyof KeyboardEvent;};type ShortcutKeys<CustomKey = number | 'number'> =| [keyof SignKeysType, keyof SignKeysType, CustomKey]| [keyof SignKeysType, CustomKey];
Components which support rtl direction are listed here, you can toggle the direction in the demo.
Modify theme by theme prop.
Modify shortcut keys by shortcutKeys prop.
What are you interested in?
What's new in X?
What's AGI?
Where is the doc?
How to design a good product?
Know the well
Set the AI role
Express the feeling
How to start a new project?
Install Ant Design X
Play on the web without installing
