rsuite · simonguo · Jan 16, 2024 · Jan 13, 2024 · Jan 13, 2024 · Jan 15, 2024
diff --git a/docs/package-lock.json b/docs/package-lock.json
diff --git a/docs/pages/components/auto-complete/en-US/index.md b/docs/pages/components/auto-complete/en-US/index.md
@@ -36,6 +36,23 @@ Autocomplete function of input field.
 
 <!--{include:`controlled.md`}-->
 
+## Accessibility
+
+### ARIA properties
+
+- Autocomplete has role `combobox`.
+- Has the `aria-haspopup="listbox"` attribute to indicate that the input has a popup listbox.
+- Has the `aria-expanded` attribute to indicate whether the listbox is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the listbox element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused option.
+
+### Keyboard interactions
+
+- <kbd>Down</kbd> - Move focus to the next option.
+- <kbd>Up</kbd> - Move focus to the previous option.
+- <kbd>Enter</kbd> - Select the focused option.
+- <kbd>Esc</kbd> - Close the listbox.
+
 ## Props
 
 ### `<AutoComplete>`

diff --git a/docs/pages/components/auto-complete/zh-CN/index.md b/docs/pages/components/auto-complete/zh-CN/index.md
@@ -36,6 +36,23 @@
 
 <!--{include:`controlled.md`}-->
 
+## 可访问性
+
+### ARIA 属性
+
+- Autocomplete 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="listbox"` 属性来指示输入框有一个弹出的列表框。
+- 有 `aria-expanded` 属性来指示列表框是否打开。
+- 有 `aria-controls` 属性来指示列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个选项。
+- <kbd>↑</kbd> - 移动焦点到上一个选项。
+- <kbd>Enter</kbd> - 选择焦点选项。
+- <kbd>Esc</kbd> - 关闭列表框。
+
 ## Props
 
 ### `<AutoComplete>`

diff --git a/docs/pages/components/cascader/en-US/index.md b/docs/pages/components/cascader/en-US/index.md
@@ -62,7 +62,23 @@ This tree allows the use of the `getChildren` option and the length of the child
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- Cascader has role `combobox`.
+- Has the `aria-haspopup="tree"` attribute to indicate that the combobox has a popup tree.
+- Has the `aria-expanded` attribute to indicate whether the tree is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the tree element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused tree node.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the tree element and is set to the value of the `id` attribute of `label`.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next tree node.
+- <kbd>↑</kbd> - Move focus to the previous tree node.
+- <kbd>→</kbd> - Expand the focused tree node if it is collapsed.
+- <kbd>←</kbd> - Collapse the focused tree node if it is expanded.
+- <kbd>Enter</kbd> - Select the focused tree node.
+- <kbd>Esc</kbd> - Close the tree.
 
 ## Props
 

diff --git a/docs/pages/components/cascader/zh-CN/index.md b/docs/pages/components/cascader/zh-CN/index.md
@@ -60,9 +60,25 @@
 
 <!--{include:`inline.md`}-->
 
-## 无障碍设计
+## 可访问性
 
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+### ARIA 属性
+
+- Cascader 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="tree"` 属性来指示 combobox 有一个弹出的树形列表框。
+- 有 `aria-expanded` 属性来指示树形列表框是否打开。
+- 有 `aria-controls` 属性来指示树形列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 tree 元素上，并将值设置为 `label` 的 `id` 属性值。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个树节点。
+- <kbd>↑</kbd> - 移动焦点到上一个树节点。
+- <kbd>→</kbd> - 展开当前树节点。
+- <kbd>←</kbd> - 收起当前树节点。
+- <kbd>Enter</kbd> - 选择聚焦的树节点。
+- <kbd>Esc</kbd> - 关闭树形列表框。
 
 ## Props
 

diff --git a/docs/pages/components/check-picker/en-US/index.md b/docs/pages/components/check-picker/en-US/index.md
@@ -87,7 +87,22 @@ Customize a select all function.
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- CheckPicker has role `combobox`.
+- Has the `aria-haspopup="listbox"` attribute to indicate that the combobox has a popup listbox.
+- Has the `aria-expanded` attribute to indicate whether the listbox is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the listbox element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused option.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the listbox element and is set to the value of the `id` attribute of `label`.
+- listbox has the `aria-multiselectable=true` attribute to indicate that the listbox is multi-selectable.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next option.
+- <kbd>↑</kbd> - Move focus to the previous option.
+- <kbd>Enter</kbd> - Select the focused option.
+- <kbd>Esc</kbd> - Close the listbox.
 
 ## Props
 

diff --git a/docs/pages/components/check-picker/zh-CN/index.md b/docs/pages/components/check-picker/zh-CN/index.md
@@ -85,9 +85,24 @@
 
 <!--{include:`virtualized.md`}-->
 
-## 无障碍设计
+## 可访问性
 
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+### ARIA 属性
+
+- CheckPicker 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="listbox"` 属性来指示 combobox 有一个弹出的列表框。
+- 有 `aria-expanded` 属性来指示列表框是否打开。
+- 有 `aria-controls` 属性来指示列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 listbox 元素上，并将值设置为 `label` 的 `id` 属性值。
+- listbox 有 `aria-multiselectable=true` 属性来指示列表框是多选的。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个选项。
+- <kbd>↑</kbd> - 移动焦点到上一个选项。
+- <kbd>Enter</kbd> - 选择焦点选项。
+- <kbd>Esc</kbd> - 关闭列表框。
 
 ## Props
 

diff --git a/docs/pages/components/check-tree-picker/en-US/index.md b/docs/pages/components/check-tree-picker/en-US/index.md
@@ -48,7 +48,24 @@ The cascade attribute can set whether or not CheckTreePicker can consider the ca
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- CheckTreePicker has role `combobox`.
+- Has the `aria-haspopup="tree"` attribute to indicate that the combobox has a popup tree.
+- Has the `aria-expanded` attribute to indicate whether the tree is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the tree element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused tree node.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the tree element and is set to the value of the `id` attribute of `label`.
+- The tree has the `aria-multiselectable=true` attribute to indicate that the tree is multi-selectable.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next tree node.
+- <kbd>↑</kbd> - Move focus to the previous tree node.
+- <kbd>→</kbd> - Expand the focused tree node if it is collapsed.
+- <kbd>←</kbd> - Collapse the focused tree node if it is expanded.
+- <kbd>Enter</kbd> - Select the focused tree node.
+- <kbd>Esc</kbd> - Close the tree.
 
 ## Props
 

diff --git a/docs/pages/components/check-tree-picker/zh-CN/index.md b/docs/pages/components/check-tree-picker/zh-CN/index.md
@@ -46,9 +46,26 @@
 
 <!--{include:`extra-footer.md`}-->
 
-## 无障碍设计
-
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+## 可访问性
+
+### ARIA 属性
+
+- CheckTreePicker 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="tree"` 属性来指示 combobox 有一个弹出的树形列表框。
+- 有 `aria-expanded` 属性来指示树形列表框是否打开。
+- 有 `aria-controls` 属性来指示树形列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 tree 元素上，并将值设置为 `label` 的 `id` 属性值。
+- tree 有 `aria-multiselectable=true` 属性来指示树形列表框是多选的。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个树节点。
+- <kbd>↑</kbd> - 移动焦点到上一个树节点。
+- <kbd>→</kbd> - 展开当前树节点。
+- <kbd>←</kbd> - 收起当前树节点。
+- <kbd>Enter</kbd> - 选择聚焦的树节点。
+- <kbd>Esc</kbd> - 关闭树形列表框。
 
 ## Props
 

diff --git a/docs/pages/components/input-picker/en-US/index.md b/docs/pages/components/input-picker/en-US/index.md
@@ -46,7 +46,21 @@ Single item selector with text box input.
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- InputPicker has role `combobox`.
+- Has the `aria-haspopup="listbox"` attribute to indicate that the combobox has a popup listbox.
+- Has the `aria-expanded` attribute to indicate whether the listbox is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the listbox element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused option.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the listbox element and is set to the value of the `id` attribute of `label`.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next option.
+- <kbd>↑</kbd> - Move focus to the previous option.
+- <kbd>Enter</kbd> - Select the focused option.
+- <kbd>Esc</kbd> - Close the listbox.
 
 ## Props
 

diff --git a/docs/pages/components/input-picker/zh-CN/index.md b/docs/pages/components/input-picker/zh-CN/index.md
@@ -44,9 +44,23 @@
 
 <!--{include:`controlled.md`}-->
 
-## 无障碍设计
+## 可访问性
 
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+### ARIA 属性
+
+- SelectPicker 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="listbox"` 属性来指示 combobox 有一个弹出的列表框。
+- 有 `aria-expanded` 属性来指示列表框是否打开。
+- 有 `aria-controls` 属性来指示列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 listbox 元素上，并将值设置为 `label` 的 `id` 属性值。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个选项。
+- <kbd>↑</kbd> - 移动焦点到上一个选项。
+- <kbd>Enter</kbd> - 选择焦点选项。
+- <kbd>Esc</kbd> - 关闭列表框。
 
 ## Props
 

diff --git a/docs/pages/components/multi-cascader/en-US/index.md b/docs/pages/components/multi-cascader/en-US/index.md
@@ -68,7 +68,24 @@ The `MultiCascader` component is used to select multiple values from cascading o
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- MultiCascader has role `combobox`.
+- Has the `aria-haspopup="tree"` attribute to indicate that the combobox has a popup tree.
+- Has the `aria-expanded` attribute to indicate whether the tree is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the tree element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused tree node.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the tree element and is set to the value of the `id` attribute of `label`.
+- The tree has the `aria-multiselectable=true` attribute to indicate that the tree is multi-selectable.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next tree node.
+- <kbd>↑</kbd> - Move focus to the previous tree node.
+- <kbd>→</kbd> - Expand the focused tree node if it is collapsed.
+- <kbd>←</kbd> - Collapse the focused tree node if it is expanded.
+- <kbd>Enter</kbd> - Select the focused tree node.
+- <kbd>Esc</kbd> - Close the tree.
 
 ## Props
 

diff --git a/docs/pages/components/multi-cascader/zh-CN/index.md b/docs/pages/components/multi-cascader/zh-CN/index.md
@@ -64,9 +64,26 @@
 
 <!--{include:`inline.md`}-->
 
-## 无障碍设计
-
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+## 可访问性
+
+### ARIA 属性
+
+- MultiCascader 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="tree"` 属性来指示 combobox 有一个弹出的树形列表框。
+- 有 `aria-expanded` 属性来指示树形列表框是否打开。
+- 有 `aria-controls` 属性来指示树形列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点树节点的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 tree 元素上，并将值设置为 `label` 的 `id` 属性值。
+- tree 有 `aria-multiselectable=true` 属性来指示树形列表框是多选的。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个树节点。
+- <kbd>↑</kbd> - 移动焦点到上一个树节点。
+- <kbd>→</kbd> - 展开当前树节点。
+- <kbd>←</kbd> - 收起当前树节点。
+- <kbd>Enter</kbd> - 选择聚焦的树节点。
+- <kbd>Esc</kbd> - 关闭树形列表框。
 
 ## Props
 

diff --git a/docs/pages/components/select-picker/en-US/index.md b/docs/pages/components/select-picker/en-US/index.md
@@ -79,7 +79,21 @@ Clicking a loading picker won't open its options menu.
 
 ## Accessibility
 
-Learn more in [Accessibility](/guide/accessibility).
+### ARIA properties
+
+- SelectPicker has role `combobox`.
+- Has the `aria-haspopup="listbox"` attribute to indicate that the combobox has a popup listbox.
+- Has the `aria-expanded` attribute to indicate whether the listbox is open or not.
+- Has the `aria-controls` attribute to indicate the ID of the listbox element.
+- Has the `aria-activedescendant` attribute to indicate the ID of the focused option.
+- When `label` is set, the `aria-labelledby` attribute is added to the combobox element and the listbox element and is set to the value of the `id` attribute of `label`.
+
+### Keyboard interactions
+
+- <kbd>↓</kbd> - Move focus to the next option.
+- <kbd>↑</kbd> - Move focus to the previous option.
+- <kbd>Enter</kbd> - Select the focused option.
+- <kbd>Esc</kbd> - Close the listbox.
 
 ## Props
 

diff --git a/docs/pages/components/select-picker/zh-CN/index.md b/docs/pages/components/select-picker/zh-CN/index.md
@@ -77,9 +77,23 @@
 
 <!--{include:`infinite-loader.md`}-->
 
-## 无障碍设计
+## 可访问性
 
-了解更多有关[无障碍设计](/zh/guide/accessibility)的信息。
+### ARIA 属性
+
+- SelectPicker 组件的 `role` 属性为 `combobox`。
+- 有 `aria-haspopup="listbox"` 属性来指示 combobox 有一个弹出的列表框。
+- 有 `aria-expanded` 属性来指示列表框是否打开。
+- 有 `aria-controls` 属性来指示列表框元素的 ID。
+- 有 `aria-activedescendant` 属性来指示焦点选项的 ID。
+- 当设置了 `label`, `aria-labelledby` 属性被添加到 combobox 元素和 listbox 元素上，并将值设置为 `label` 的 `id` 属性值。
+
+### 键盘交互
+
+- <kbd>↓</kbd> - 移动焦点到下一个选项。
+- <kbd>↑</kbd> - 移动焦点到上一个选项。
+- <kbd>Enter</kbd> - 选择焦点选项。
+- <kbd>Esc</kbd> - 关闭列表框。
 
 ## Props
 
@@ -100,7 +114,7 @@
 | label              | ReactNode                                                                                      | 在按钮开头显示的标签                 |
 | labelKey           | string `('label')`                                                                             | 设置选项显示内容在 `data` 中的 `key` |
 | listProps          | [ListProps][listprops]                                                                         | 虚拟化长列表的相关属性               |
-| loading            | boolean `(false)`                                                                              | 是否显示一个加载中状态指示器           |
+| loading            | boolean `(false)`                                                                              | 是否显示一个加载中状态指示器         |
 | locale             | [PickerLocaleType](/zh/guide/i18n/#pickers)                                                    | 本地化的文本                         |
 | menuMaxHeight      | number `(320)`                                                                                 | 设置 Dropdown 的最大高度             |
 | menuClassName      | string                                                                                         | 应用于菜单 DOM 节点的 css class      |
@@ -141,7 +155,6 @@
 <!--{include:(_common/types/placement.md)}-->
 <!--{include:(_common/types/list-props.md)}-->
 
-
 ### `ts:ValueType`
 
 ```ts

diff --git a/docs/pages/components/tag-input/en-US/index.md b/docs/pages/components/tag-input/en-US/index.md
@@ -22,7 +22,7 @@ The enhancement of Input supports input tags and management tags.
 
 ### Tag trigger
 
-Sets the trigger for creating a tag. Options include: `Enter`, `Space`, `Comma` - (<kbd>⏎</kbd>, <kbd> </kbd>, <kbd>,</kbd>). and the default value `Enter`. Multiple trigger values can be set.
+Sets the trigger for creating a tag. Options include: `Enter`, `Space`, `Comma`. and the default value `Enter`. Multiple trigger values can be set.
 
 <!--{include:`trigger.md`}-->
 

diff --git a/docs/pages/components/tag-input/zh-CN/index.md b/docs/pages/components/tag-input/zh-CN/index.md
@@ -22,7 +22,7 @@
 
 ### 触发事件
 
-通过 `trigger` 属性设置创建标签的触发器。 可选择包括：`Enter`, `Space`, `Comma` - (<kbd>⏎</kbd>, <kbd> </kbd>, <kbd>,</kbd>)，默认值为 `Enter`, 可以同时设置多个触发事件。
+通过 `trigger` 属性设置创建标签的触发器。 可选择包括：`Enter`, `Space`, `Comma`，默认值为 `Enter`, 可以同时设置多个触发事件。
 
 <!--{include:`trigger.md`}-->