### Basic Table Example

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

A simple example demonstrating how to create and configure a basic AntdTable with columns and data. This serves as a starting point for implementing tables.

```APIDOC
## Basic Table

```python
import feffery_antd_components as fac

fac.AntdTable(
    id='basic-table',
    columns=[
        {'title': 'Name', 'dataIndex': 'name', 'width': 150},
        {'title': 'Age', 'dataIndex': 'age', 'width': 80},
        {'title': 'City', 'dataIndex': 'city', 'width': 150}
    ],
    data=[
        {'name': 'Alice', 'age': 28, 'city': 'New York'},
        {'name': 'Bob', 'age': 32, 'city': 'Los Angeles'},
        {'name': 'Charlie', 'age': 26, 'city': 'Chicago'}
    ],
    bordered=True
)
```
```

--------------------------------

### Install Latest Version

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README.md

Install the latest stable version of feffery-antd-components using pip.

```bash
pip install feffery-antd-components -U
```

--------------------------------

### Basic AntdTable Example

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

A basic example of an AntdTable with defined columns and data, including borders.

```python
import feffery_antd_components as fac

fac.AntdTable(
    id='basic-table',
    columns=[
        {'title': '姓名', 'dataIndex': 'name', 'width': 150},
        {'title': '年龄', 'dataIndex': 'age', 'width': 80},
        {'title': '城市', 'dataIndex': 'city', 'width': 150}
    ],
    data=[
        {'name': '张三', 'age': 28, 'city': '北京'},
        {'name': '李四', 'age': 32, 'city': '上海'},
        {'name': '王五', 'age': 26, 'city': '广州'}
    ],
    bordered=True
)
```

--------------------------------

### Basic AntdButton Usage with Callback

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/overview.md

Demonstrates the basic usage of AntdButton and its integration with a Dash callback to update an output div based on button clicks. Ensure Dash and feffery_antd_components are installed.

```python
import dash
from dash import dcc, html
import feffery_antd_components as fac

app = dash.Dash(__name__)

app.layout = html.Div([
    fac.AntdButton(
        id='my-button',
        children='点击我',
        type='primary'
    ),
    html.Div(id='output')
])

@app.callback(
    dash.Output('output', 'children'),
    dash.Input('my-button', 'nClicks')
)
def update_output(nClicks):
    return f'按钮被点击了 {nClicks} 次'

if __name__ == '__main__':
    app.run_server(debug=True)
```

--------------------------------

### Install Latest Pre-release Version

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README.md

Install the latest pre-release version of feffery-antd-components using pip with the --pre flag.

```bash
pip install feffery-antd-components --pre -U
```

--------------------------------

### Internationalization Example

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README.md

Set the locale for components with built-in text. The default is 'zh-cn' (Simplified Chinese).

```Python
fac.AntdDatePicker(locale='en-us')
```

```Python
fac.AntdDatePicker(locale='de-de')
```

--------------------------------

### Form Submission Handling

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/overview.md

Shows how to handle form submissions by capturing button clicks and retrieving form values using Dash callbacks. The `values` property of the form is used to get all input data.

```python
@app.callback(
    Output('form-output', 'children'),
    Input('submit-button', 'nClicks'),
    State('my-form', 'values')
)
def handle_form_submit(nClicks, form_values):
    if nClicks == 0:
        return '未提交'
    return f'表单值：{form_values}'
```

--------------------------------

### Import AntdTable Component

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

Demonstrates how to import and initialize the AntdTable component with basic columns and data.

```python
import feffery_antd_components as fac

# 基础表格
fac.AntdTable(
    id='my-table',
    columns=[
        {'title': '名称', 'dataIndex': 'name'},
        {'title': '年龄', 'dataIndex': 'age'}
    ],
    data=[
        {'name': '张三', 'age': 28},
        {'name': '李四', 'age': 32}
    ]
)
```

--------------------------------

### Static Resource CDN Acceleration

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README.md

Configure Dash to load static resources from a CDN instead of the server. This is useful for small to medium-sized sites to speed up access.

```Python
app = dash.Dash(serve_locally=False)
```

--------------------------------

### Dash Callback with Input, Output, and State

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/overview.md

Illustrates a standard Dash callback pattern using Input, Output, and State. This is fundamental for connecting component interactions to backend logic.

```python
from dash import Input, Output, State

@app.callback(
    Output('component-id', 'property'),
    Input('trigger-id', 'property'),
    State('state-id', 'property')
)
def update_component(input_value, state_value):
    return new_value
```

--------------------------------

### Use CDN for Dash App

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README-en_US.md

Configure a Dash application to use CDN by setting serve_locally=False in the dash.Dash() constructor.

```python
# just set serve_locally=False in dash.Dash()
app = dash.Dash(serve_locally=False)
```

--------------------------------

### Common Management Backend Layout

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdLayout.md

Implements a typical management backend layout featuring a header, a collapsible sidebar, main content area, and a footer. Setting `minHeight='100vh'` on the main layout ensures the footer stays at the bottom. The sidebar can be made collapsible.

```python
fac.AntdLayout(
    style={'minHeight': '100vh'},
    children=[
        # 顶部导航
        fac.AntdHeader(
            style={'background': '#001529', 'color': 'white', 'padding': '0 24px'},
            children=html.Div([
                html.Span('应用名称', style={'color': 'white', 'fontSize': '18px'})
            ])
        ),
        # 主体内容 = 侧边栏 + 内容区
        fac.AntdLayout(
            children=[
                # 侧边栏菜单
                fac.AntdSider(
                    id='app-sider',
                    collapsible=True,
                    children=fac.AntdMenu(id='app-menu', mode='inline', theme='dark')
                ),
                # 主内容区
                fac.AntdContent(
                    style={'padding': '24px'},
                    children=html.Div(id='page-content')
                )
            ]
        ),
        # 页脚
        fac.AntdFooter(
            style={'textAlign': 'center', 'color': '#999'},
            children='© 2026 Company Name'
        )
    ]
)
```

--------------------------------

### AntdForm with Batch Control

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdForm.md

Demonstrates how to use AntdForm with batch control enabled for multiple form items. Form values can be accessed in callbacks via the 'values' property of the form.

```python
fac.AntdForm(
    id='batch-form',
    enableBatchControl=True,  # 启用批量控制
    layout='horizontal',
    children=[
        fac.AntdFormItem(
            label='用户名',
            children=fac.AntdInput(
                id='batch-username',
                name='username',
                enableBatchControl=True
            )
        ),
        fac.AntdFormItem(
            label='角色',
            children=fac.AntdSelect(
                id='batch-role',
                name='role',
                enableBatchControl=True,
                options=[
                    {'label': '管理员', 'value': 'admin'},
                    {'label': '用户', 'value': 'user'},
                    {'label': '访客', 'value': 'guest'}
                ]
            )
        ),
        fac.AntdFormItem(
            label='邮箱',
            children=fac.AntdInput(
                id='batch-email',
                name='email',
                enableBatchControl=True
            )
        )
    ]
)
```

--------------------------------

### Dark Theme Sidebar Layout

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdLayout.md

Demonstrates how to create a layout with a dark-themed sidebar using AntdLayout and AntdSider. Ensure the AntdMenu within the sider also uses a dark theme for consistency.

```python
fac.AntdLayout(
    children=[
        fac.AntdSider(
            theme='dark',  # 使用深色主题
            children=fac.AntdMenu(
                theme='dark',
                mode='inline',
                items=[...]
            )
        ),
        fac.AntdContent(
            children='主内容'
        )
    ]
)
```

--------------------------------

### Dynamic Field Addition to AntdForm

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdForm.md

Illustrates how to dynamically add new form fields to an AntdForm using a Dash callback. A button click triggers the addition of a new input field.

```python
import dash
from dash import dcc, html

@app.callback(
    Output('form-container', 'children'),
    Input('add-field-btn', 'nClicks'),
    State('form-container', 'children')
)
def add_field(nClicks, current_children):
    if nClicks == 0:
        current_children = []
    
    # 添加新字段
    new_field = fac.AntdFormItem(
        label=f'字段{nClicks}',
        children=fac.AntdInput(
            id=f'dynamic-field-{nClicks}',
            placeholder='输入内容'
        )
    )
    
    return current_children + [new_field]

app.layout = html.Div([
    fac.AntdButton(
        id='add-field-btn',
        children='添加字段',
        type='primary'
    ),
    fac.AntdForm(
        id='dynamic-form',
        children=[],
        style={'marginTop': '20px'}
    )
])
```

--------------------------------

### AntdTable Component Signature

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

This snippet details the component's signature, outlining all available props, their types, default values, and descriptions. It's useful for understanding the full range of customization options.

```APIDOC
## AntdTable Component Signature

```javascript
const AntdTable = ({
    id,
    className,
    style,
    key,
    locale = 'zh-cn',
    containerId,
    columns = [],
    showHeader = true,
    rowHoverable = true,
    tableLayout,
    miniChartHeight = 30,
    miniChartAnimation = false,
    rowSelectionType,
    selectedRowKeys,
    rowSelectionWidth = 32,
    rowSelectionCheckStrictly,
    rowSelectionIgnoreRowKeys,
    sticky = false,
    titlePopoverInfo,
    columnsFormatConstraint,
    enableHoverListen = false,
    data = [],
    sortOptions = {},
    showSorterTooltip = true,
    showSorterTooltipTarget = 'full-header',
    filterOptions = {},
    defaultFilteredValues = {},
    pagination,
    bordered = false,
    maxHeight,
    maxWidth,
    scrollToFirstRowOnChange = true,
    size = 'middle',
    mode = 'client-side',
    nClicksButton = 0,
    nDoubleClicksCell = 0,
    summaryRowContents,
    summaryRowBlankColumns = 0,
    summaryRowFixed = false,
    customFormatFuncs,
    conditionalStyleFuncs = {},
    expandedRowKeyToContent,
    expandedRowWidth,
    expandRowByClick = false,
    defaultExpandedRowKeys,
    expandedRowKeys,
    enableCellClickListenColumns = [],
    nClicksCell = 0,
    nContextMenuClicksCell = 0,
    emptyContent,
    cellUpdateOptimize = false,
    nClicksDropdownItem = 0,
    hiddenRowKeys = [],
    virtual = false,
    title,
    footer,
    loading = false,
    rowClassName,
    selectedRowsSyncWithData = false,
    setProps,
    ...others
}) => { ... }
```
```

--------------------------------

### AntdForm with Unified Validation Status

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdForm.md

Demonstrates how to set unified validation statuses and help messages for form items. This allows for consistent feedback to the user regarding input validity.

```python
fac.AntdForm(
    id='validation-form',
    enableBatchControl=True,
    validateStatuses={
        '用户名': 'success',
        '邮箱': 'error',
        '密码': 'warning'
    },
    helps={
        '用户名': '用户名有效',
        '邮箱': '邮箱格式不正确',
        '密码': '密码强度弱'
    },
    children=[
        fac.AntdFormItem(
            label='用户名',
            children=fac.AntdInput(id='val-username')
        ),
        fac.AntdFormItem(
            label='邮箱',
            children=fac.AntdInput(id='val-email')
        ),
        fac.AntdFormItem(
            label='密码',
            children=fac.AntdInput(id='val-password', mode='password')
        )
    ]
)
```

--------------------------------

### Render Types

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

Lists the available render types for table columns, such as links, ellipsis, tags, images, buttons, and various mini-charts, allowing for rich data visualization within cells.

```APIDOC
## Render Types (renderType)

| Type | Description |
|------|-------------|
| `'link'` | Link style |
| `'ellipsis'` | Text ellipsis |
| `'copyable'` | Copyable text |
| `'ellipsis-copyable'` | Ellipsis + Copyable |
| `'tags'` | Tags |
| `'status-badge'` | Status badge |
| `'image'` | Image |
| `'button'` | Button |
| `'checkbox'` | Checkbox |
| `'switch'` | Switch |
| `'select'` | Dropdown select |
| `'dropdown'` | Dropdown menu |
| `'mini-line'` | Mini line chart |
| `'mini-bar'` | Mini bar chart |
| `'mini-area'` | Mini area chart |
| `'mini-progress'` | Mini progress bar |
| `'corner-mark'` | Corner mark |
```

--------------------------------

### Dynamic Select Options Update

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/overview.md

Demonstrates updating the options of an AntdSelect component dynamically based on user input in a search field. Uses `debounceValue` for efficient updates.

```python
@app.callback(
    Output('my-select', 'options'),
    Input('search-input', 'debounceValue')
)
def update_options(search_value):
    # 根据搜索值动态生成选项
    return [{'label': f'选项 {i}', 'value': i} 
            for i in range(10) if str(i) in search_value]
```

--------------------------------

### Accessing Batch Form Values in Callback

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdForm.md

Shows how to access the batch-controlled form values within a Dash callback. The 'values' property of the AntdForm component provides these values.

```python
@app.callback(
    Output('result', 'children'),
    Input('batch-form', 'values')
)
def handle_form_values(form_values):
    if not form_values:
        return '未填写'
    return f'表单值：{form_values}'
```

--------------------------------

### AntdTable Component Signature

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

The JavaScript signature for the AntdTable component, outlining all available props and their default values.

```javascript
const AntdTable = ({
    id,
    className,
    style,
    key,
    locale = 'zh-cn',
    containerId,
    columns = [],
    showHeader = true,
    rowHoverable = true,
    tableLayout,
    miniChartHeight = 30,
    miniChartAnimation = false,
    rowSelectionType,
    selectedRowKeys,
    rowSelectionWidth = 32,
    rowSelectionCheckStrictly,
    rowSelectionIgnoreRowKeys,
    sticky = false,
    titlePopoverInfo,
    columnsFormatConstraint,
    enableHoverListen = false,
    data = [],
    sortOptions = {},
    showSorterTooltip = true,
    showSorterTooltipTarget = 'full-header',
    filterOptions = {},
    defaultFilteredValues = {},
    pagination,
    bordered = false,
    maxHeight,
    maxWidth,
    scrollToFirstRowOnChange = true,
    size = 'middle',
    mode = 'client-side',
    nClicksButton = 0,
    nDoubleClicksCell = 0,
    summaryRowContents,
    summaryRowBlankColumns = 0,
    summaryRowFixed = false,
    customFormatFuncs,
    conditionalStyleFuncs = {},
    expandedRowKeyToContent,
    expandedRowWidth,
    expandRowByClick = false,
    defaultExpandedRowKeys,
    expandedRowKeys,
    enableCellClickListenColumns = [],
    nClicksCell = 0,
    nContextMenuClicksCell = 0,
    emptyContent,
    cellUpdateOptimize = false,
    nClicksDropdownItem = 0,
    hiddenRowKeys = [],
    virtual = false,
    title,
    footer,
    loading = false,
    rowClassName,
    selectedRowsSyncWithData = false,
    setProps,
    ...others
}) => { ... }
```

--------------------------------

### Core Properties Table

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

This table lists the core properties of the AntdTable component, including their types, whether they are required, default values, and a brief explanation of their purpose.

```APIDOC
## Core Properties Table

| Property Name | Type | Required | Default Value | Description |
|---------------|------|----------|---------------|-------------|
| `id` | string | — | — | Component unique identifier |
| `columns` | array | ✓ | `[]` | Column definition array, each item includes `title`, `dataIndex`, etc. |
| `data` | array | ✓ | `[]` | Table data array |
| `locale` | oneOf | — | `'zh-cn'` | Text language |
| `size` | oneOf | — | `'middle'` | Table size: `'small'`, `'middle'`, `'large'` |
| `mode` | oneOf | — | `'client-side'` | Data mode: `'client-side'` (client), `'server-side'` (server) |
| `showHeader` | bool | — | `true` | Whether to display the table header |
| `bordered` | bool | — | `false` | Whether to display borders |
| `rowHoverable` | bool | — | `true` | Whether rows are hoverable and highlighted |
| `sticky` | bool | — | `false` | Whether the header is sticky and fixed |
| `virtual` | bool | — | `false` | Whether to enable virtual scrolling (for large data) |
| `maxHeight` | number | — | — | Maximum table height (pixels) |
| `maxWidth` | number | — | — | Maximum table width (pixels) |
| `loading` | bool | — | `false` | Whether to display the loading state |
| `pagination` | object | — | — | Pagination configuration |
| `rowSelectionType` | oneOf | — | — | Row selection mode: `'checkbox'` (multi-select), `'radio'` (single-select) |
| `selectedRowKeys` | array | — | — | Array of selected row key values (controlled property) |
| `sortOptions` | object | — | `{}` | Sorting configuration |
| `filterOptions` | object | — | `{}` | Filtering configuration |
| `expandedRowKeys` | array | — | — | Array of expanded row key values (controlled property) |
| `expandedRowKeyToContent` | object | — | — | Expanded row content mapping |
| `nClicksCell` | number | — | `0` | Cumulative cell clicks (controlled property) |
| `nDoubleClicksCell` | number | — | `0` | Cumulative cell double clicks (controlled property) |
```

--------------------------------

### Basic Option Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines the basic type for selector options, which can be a string, number, or an OptionObject. OptionObject includes label, value, and optional disabled and title properties.

```typescript
type Option = string | number | OptionObject

type OptionObject = {
    label: ReactNode;                    // 选项标签
    value: string | number;              // 选项值
    disabled?: boolean;                  // 是否禁用
    title?: string;                      // 鼠标悬停提示
}
```

--------------------------------

### Grid Configuration Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for grid configurations used in components like AntdRow/AntdCol and AntdForm's labelCol/wrapperCol. It supports responsive settings for different screen sizes.

```typescript
type GridConfig = {
    span?: number;              // 占位份数（1-24）
    offset?: number;            // 向右偏移份数
    flex?: string | number;     // CSS flex 值
    xs?: number | GridConfig;   // 超小屏幕
    sm?: number | GridConfig;   // 小屏幕
    md?: number | GridConfig;   // 中等屏幕
    lg?: number | GridConfig;   // 大屏幕
    xl?: number | GridConfig;   // 超大屏幕
    xxl?: number | GridConfig;  // 超超大屏幕
}
```

--------------------------------

### Size Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for common size specifications, including 'small', 'middle', and 'large'.

```typescript
type Size = 'small' | 'middle' | 'large'
```

--------------------------------

### Column Definition Structure

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

Defines the structure for column definitions in the AntdTable, including properties like title, dataIndex, width, and sorter.

```python
columns = [
    {
        'title': '姓名',
        'dataIndex': 'name',
        'key': 'name',
        'width': 200,
        'fixed': 'left',
        'align': 'center',
        'sorter': True,
        'sortable': True,
        'render': 'link',
        'renderOptions': {...},
        'editable': True,
        'editOptions': {...}
    }
]
```

--------------------------------

### Align Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for alignment options, including 'left', 'center', and 'right'.

```typescript
type Align = 'left' | 'center' | 'right'
```

--------------------------------

### Column Definition Structure

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/api-reference/AntdTable.md

Defines the structure for column definitions within the AntdTable component, specifying properties like title, dataIndex, width, fixed, alignment, sorting, rendering, and editing capabilities.

```APIDOC
## Column Definition Structure

```python
columns = [
    {
        'title': 'Name',              # Column title
        'dataIndex': 'name',          # Data field name
        'key': 'name',                # Column unique identifier
        'width': 200,                 # Column width
        'fixed': 'left',              # Freeze direction: 'left', 'right'
        'align': 'center',            # Alignment: 'left', 'center', 'right'
        'sorter': True,               # Whether sorting is supported
        'sortable': True,
        'render': 'link',             # Render type
        'renderOptions': {{...}},       # Render options
        'editable': True,             # Whether editable
        'editOptions': {{...}}          # Edit options
    }
]
```
```

--------------------------------

### Set AntdDatePicker Locale to English

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README-en_US.md

Configure the AntdDatePicker component to use English ('en-us') for internationalization.

```python
fac.AntdDatePicker(locale='en-us')
```

--------------------------------

### Options Array Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for an array that can contain basic options, grouped options, or color options.

```typescript
type OptionsArray = (Option | GroupedOption | ColorOption)[]
```

--------------------------------

### Set AntdDatePicker Locale to German

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/README-en_US.md

Configure the AntdDatePicker component to use German ('de-de') for internationalization.

```python
fac.AntdDatePicker(locale='de-de')
```

--------------------------------

### Conditional Modal Display

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/overview.md

Implements logic to control the visibility of a modal component. The modal's `visible` property is toggled based on button clicks and close events.

```python
@app.callback(
    Output('modal', 'visible'),
    Input('open-button', 'nClicks'),
    Input('modal', 'cancelCounts')
)
def toggle_modal(open_clicks, close_counts):
    return open_clicks > close_counts
```

--------------------------------

### Color Option Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Extends the OptionObject type to include an optional array of color strings, specifically for color picker components.

```typescript
type ColorOption = OptionObject & {
    colors?: string[];                  // 颜色值数组（用于颜色选择器）
}
```

--------------------------------

### Dynamic CSS Object Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for dynamic CSS objects, used to specify CSS selectors and their corresponding style code as strings.

```typescript
type DynamicClassName = {
    'selector': string;          // CSS 选择器
    'styles': string;            // CSS 样式代码字符串
}
```

--------------------------------

### CSS Properties Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for CSS style objects, including common properties like color, background, padding, and dimensions.

```typescript
type CSSProperties = {
    [key: string]: string | number;
    // 常见属性
    color?: string;
    backgroundColor?: string;
    fontSize?: string | number;
    padding?: string | number;
    margin?: string | number;
    width?: string | number;
    height?: string | number;
    display?: string;
    flex?: string | number;
    // 更多...
}
```

--------------------------------

### Direction Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for direction options, supporting 'vertical' and 'horizontal'.

```typescript
type Direction = 'vertical' | 'horizontal'
```

--------------------------------

### Column Definition Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines the structure for table column definitions, including essential properties like title and dataIndex, and optional configurations for sorting, filtering, editing, and fixed positioning.

```typescript
type ColumnDef = {
    // 必填
    title: string | ReactNode;          // 列标题
    dataIndex: string;                  // 数据字段名
    
    // 可选
    key?: string;                       // 列唯一标识
    width?: number;                     // 列宽（像素）
    fixed?: 'left' | 'right' | boolean; // 冻结方向
    align?: 'left' | 'center' | 'right'; // 对齐方式
    
    // 排序和筛选
    sorter?: boolean;                   // 是否支持排序
    sortable?: boolean;
    filterable?: boolean;               // 是否支持筛选
    filters?: FilterOption[];
    
    // 渲染配置
    renderOptions?: RenderOptions;
    
    // 编辑配置
    editable?: boolean;                 // 是否可编辑
    editOptions?: EditOptions;
    
    // 分组
    group?: string | string[];          // 所属分组（多级表头）
}

type FilterOption = {
    text: string;                       // 筛选选项文本
    value: string | number | boolean;
}
```

--------------------------------

### Grouped Option Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for grouped selector options, including a group title and an array of OptionObject items.

```typescript
type GroupedOption = {
    group: string | ReactNode;          // 分组标题
    options: OptionObject[];            // 分组内选项
}
```

--------------------------------

### Validate Status Type

Source: https://github.com/cnfeffery/feffery-antd-components/blob/main/_autodocs/types.md

Defines a type for validation statuses, which can be 'success', 'warning', 'error', or 'validating'.

```typescript
type ValidateStatus = 'success' | 'warning' | 'error' | 'validating'
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.