mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2024-12-21 04:50:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: sync type exports

Browse Source
This commit is contained in:
07akioni 2021-09-04 14:38:48 +08:00
parent 424f1cd1c0
commit 986c0be876
12 changed files with 61 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
CHANGELOG.en-US.md
View File

@ -24,12 +24,11 @@
- `n-data-table` supports multi-selection by holding down `shift`, closes [#554](https://github.com/TuSimple/naive-ui/issues/554).
- `n-tree-select` add `check-strategy` prop, closes [#624](https://github.com/TuSimple/naive-ui/issues/624).
- `n-upload` export `UploadFile` type.
- `n-dropdown` export `DropdownDivider`, `DropdownSubmenu`, and `DropdownGroup` type.
- `n-cascader` export `CascaderOption` type.
- `n-mention` export `MentionOption` type.
- `n-transfer` export `TransferOption` type.
- `n-pagination` export `PaginationInfo` type.
- `n-data-table` export `CreateSummary` type.
- `n-data-table` export `DataTableCreateSummary` type.
- `n-code` add `inline` prop, closes [#834](https://github.com/TuSimple/naive-ui/issues/834)
### Fixes

5
CHANGELOG.zh-CN.md
View File

@ -23,13 +23,12 @@
- `n-dropdown` 选项新增 `props` 属性，关闭 [#813](https://github.com/TuSimple/naive-ui/issues/813)
- `n-data-table` 支持按住 `shift` 进行多选操作，关闭 [#554](https://github.com/TuSimple/naive-ui/issues/554)
- `n-tree-select` 增加 `check-strategy` 属性，关闭 [#624](https://github.com/TuSimple/naive-ui/issues/624)
- `n-upload` 增加 `UploadFile` 类型
- `n-dropdown` 导出 `DropdownDivider`, `DropdownSubmenu` 与 `DropdownGroup` 类型
- `n-upload` 导出 `UploadFile` 类型
- `n-cascader` 导出 `CascaderOption` 类型
- `n-mention` 导出 `MentionOption` 类型
- `n-transfer` 导出 `TransferOption` 类型
- `n-pagination` 导出 `PaginationInfo` 类型
- `n-data-table` 导出 `CreateSummary` 类型
- `n-data-table` 导出 `DataTableCreateSummary` 类型
- `n-code` 新增 `inline` 属性, 关闭 [#834](https://github.com/TuSimple/naive-ui/issues/834)
### Fixes

6
src/data-table/demos/enUS/index.demo-entry.md
View File

@ -67,7 +67,7 @@ flex-height
| single-column | `boolean` | `false` | Whether the column content is a whole, when the parameter is `true`, there is no `border-bottom`. |
| single-line | `boolean` | `true` | Whether the line content is a whole, when the parameter value is `true`, there is no `border-right`. |
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | Table size. |
| summary | `CreateSummary` | `undefined` | Data of table summary row. For types, see <n-a href="#CreateSummary-Type">CreateSummary Type</n-a>. |
| summary | `DataTableCreateSummary` | `undefined` | Data of table summary row. For types, see <n-a href="#DataTableCreateSummary-Type">DataTableCreateSummary Type</n-a>. |
| table-layout | `'auto' \| 'fixed'` | `'auto'` | Style `table-layout` of the table. When `ellipsis` or `max-height` or `flex-height` are set, it will always be `'fixed'` regardless of what you set. |
| virtual-scroll | `boolean` | `false` | Whether to use virtual scroll to deal with large data. Make sure `max-height` is set before using it. |
| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | The callback function triggered when the checked-row-keys value changes. |
@ -112,10 +112,10 @@ flex-height
| type | `'selection' \| 'expand'` | `undefined` | Column type. |
| width | `number` | `undefined` | Width of the column, **required** when fixed. |
#### CreateSummary Type
#### DataTableCreateSummary Type
```__ts
type CreateSummary = (
type DataTableCreateSummary = (
pageData: RowData[]
) =>
| Array<{

6
src/data-table/demos/zhCN/index.demo-entry.md
View File

@ -68,7 +68,7 @@ scroll-debug
| single-column | `boolean` | `false` | 列内容是否为一个整体，当参数为`true`时，则没有`border-bottom` |
| single-line | `boolean` | `true` | 行内容是否为一个整体，当参数值为`true`时，则没有`border-right` |
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | 表格的尺寸 |
| summary | `CreateSummary` | `undefined` | 表格总结栏的数据，类型见 <n-a href="#CreateSummary-Type">CreateSummary Type</n-a> |
| summary | `DataTableCreateSummary` | `undefined` | 表格总结栏的数据，类型见 <n-a href="#DataTableCreateSummary-Type">DataTableCreateSummary Type</n-a> |
| table-layout | `'auto' \| 'fixed'` | `'auto'` | 表格的 `table-layout` 样式属性，在设定 `ellipsis` 或 `max-height` 的情况下固定为 `'fixed'` |
| virtual-scroll | `boolean` | `false` | 是否开启虚拟滚动，应对大规模数据，开启前请设定好 `max-height` |
| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | checked-row-keys 值改变时触发的回调函数 |
@ -113,10 +113,10 @@ scroll-debug
| type | `'selection' \| 'expand'` | `undefined` | 列的类型 |
| width | `number` | `undefined` | 列的宽度，在列固定时是**必需**的 |
#### CreateSummary Type
#### DataTableCreateSummary Type
```__ts
type CreateSummary = (
type DataTableCreateSummary = (
pageData: RowData[]
) =>
| Array<{

10
src/data-table/index.ts
View File

@ -1,10 +1,3 @@
import type {
CreateSummary as InternalCreateSummary,
RowData
} from './src/interface'
export type CreateSummary = InternalCreateSummary<RowData>
export { default as NDataTable } from './src/DataTable'
export type { DataTableProps } from './src/DataTable'
export type {
@ -20,6 +13,5 @@ export type {
CreateRowKey as DataTableCreateRowKey,
CreateRowProps as DataTableCreateRowProps,
DataTableInst,
SummaryRowData,
SummaryCell
CreateSummary as DataTableCreateSummary
} from './src/interface'

50
src/dropdown/demos/enUS/index.demo-entry.md
View File

@ -17,56 +17,48 @@ batch-render
option-props
```
## Props
## API
### Dropdown Props
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| animated | `boolean` | `true` | Use an animation when showing options. |
| inverted | `boolean` | `false` | Use the inverted style. |
| keyboard | `boolean` | `true` | Whether the component supports keyboard operation. (Be careful about the potential conflicts with other components keyboard operations) |
| options | `Array<DropdownOption \| DropdownDivider \| DropdownSubmenu>` | `[]` | Dropdown options. |
| render-icon | `(option: DropdownOption \| DropdownSubmenu) => VNodeChild` | `undefined` | Render function that renders option icons. |
| render-label | `(option: DropdownOption \| DropdownSubmenu) => VNodeChild` | `undefined` | Render function that renders option labels. |
| options | `Array<DropdownOption \| DropdownDividerOption>` | `[]` | Dropdown options. |
| render-icon | `(option: DropdownOption) => VNodeChild` | `undefined` | Render function that renders option icons. |
| render-label | `(option: DropdownOption) => VNodeChild` | `undefined` | Render function that renders option labels. |
| size | `'small'\|'medium'\|'large'\|'huge'` | `'medium'` | Dropdown size. |
| on-clickoutside | `(e: MouseEvent) => void` | `undefined` | Callback function triggered when there is a click outside of the component. |
| on-select | `(key: string \| number) => void` | `undefined` | Callback function for after an option is selected. |
For other props, for example `placement`, please see [Popover Props](popover#Props). Note that `raw` is not available.
### DropdownOption Type
| Property | Type | Description |
| -------- | ------------------ | ----------------------------------------- |
| icon? | `() => VNodeChild` | Custom render function of an option icon. |
| key | `string \| number` | Option ID (should be unique). |
| label | `string` | Displayed label value. |
| disabled | `boolean` | Whether to disable the option. |
| props | `HTMLAttributes` | Customize option props. |
### DropdownDivider Type
| Property | Type | Description |
| -------- | ------------------ | -------------------------------- |
| type | `'divider'` | The type of the DropdownDivider. |
| key | `string \| number` | Divider ID (should be unique). |
### DropdownSubmenu Type
#### DropdownOption Type
| Property | Type | Description |
| --- | --- | --- |
| type | `'submenu'` | The type of the DropdownSubmenu. |
| children? | `Array<DropdownOption \| DropdownDividerOption>` | Child options. |
| icon? | `() => VNodeChild` | Custom render function of an option icon. |
| key | `string \| number` | Option ID (should be unique). |
| label | `string` | Displayed label value. |
| icon? | `() => VNodeChild` | Custom rendering function of the option icon. |
| key | `string \| number` | Submenu ID (should be unique). |
| children | `Array<DropdownOption \| DropdownDivider \| DropdownSubmenu>` | Children options of DropdownSubmenu. |
| disabled | `boolean` | Whether to disable the option. |
| props | `HTMLAttributes` | Customize option props. |
### DropdownGroup Type
#### DropdownDividerOption Type
| Property | Type | Description |
| -------- | ------------------ | -------------------------------------- |
| type | `'divider'` | The type of the DropdownDividerOption. |
| key | `string \| number` | Divider ID (should be unique). |
#### DropdownGroupOption Type
| Property | Type | Description |
| --- | --- | --- |
| type | `'group'` | The type of the DropdownGroup. |
| type | `'group'` | The type of the DropdownGroupOption. |
| label | `string` | Group label value. |
| icon? | `() => VNodeChild` | Custom rendering function of the group icon. |
| key | `string \| number` | Group ID (should be unique). |
| children | `Array<DropdownOption \| DropdownDivider \| DropdownSubmenu>` | Children options of DropdownGroup. |
| children | `Array<DropdownOption \| DropdownDividerOption>` | Children options of DropdownGroupOption. |

46
src/dropdown/demos/zhCN/index.demo-entry.md
View File

@ -18,56 +18,48 @@ batch-render
option-props
```
## Props
## API
### Dropdown Props
| 名称 | 类型 | 默认值 | 说明 |
| --- | --- | --- | --- |
| animated | `boolean` | `true` | 弹出弹窗时使用动画 |
| inverted | `boolean` | `false` | 使用反转样式 |
| keyboard | `boolean` | `true` | 是否支持键盘操作（注意和其他内容键盘操作可能的冲突） |
| options | `Array<DropdownOption \| DropdownDivider \| DropdownSubmenu>` | `[]` | 下拉菜单传入的 options |
| render-icon | `(option: DropdownOption \| DropdownSubmenu) => VNodeChild` | `undefined` | 批量处理下拉菜单图标渲染 |
| render-label | `(option: DropdownOption \| DropdownSubmenu) => VNodeChild` | `undefined` | 批量处理下拉菜单渲染 |
| options | `Array<DropdownOption \| DropdownDividerOption>` | `[]` | 下拉菜单传入的 options |
| render-icon | `(option: DropdownOption) => VNodeChild` | `undefined` | 批量处理下拉菜单图标渲染 |
| render-label | `(option: DropdownOption) => VNodeChild` | `undefined` | 批量处理下拉菜单渲染 |
| size | `'small'\|'medium'\|'large'\|'huge'` | `'medium'` | 下拉菜单的尺寸大小 |
| on-clickoutside | `(e: MouseEvent) => void` | `undefined` | clickoutside 的时候触发的回调函数 |
| on-select | `(key: string \| number) => void` | `undefined` | select 选中时触发的回调函数 |
对于其他 Props，例如 `placement`，请参考 [Popover Props](popover#Props)。注意 `raw` 属性不可用。
### DropdownOption Type
#### DropdownOption Type
| 属性 | 类型 | 说明 |
| -------- | ------------------ | ------------------------------- |
| icon? | `() => VNodeChild` | 支持通过 render 方法自定义 icon |
| key | `string \| number` | 需要唯一 |
| label | `string` | 显示的 label 值 |
| disabled | `boolean` | 是否禁用 |
| props | `HTMLAttributes` | 自定义选项属性 |
| 属性 | 类型 | 说明 |
| --- | --- | --- |
| children? | `Array<DropdownOption \| DropdownDividerOption \| DropdownGroupOptionOption>` | 子菜单的 children 项 |
| icon? | `() => VNodeChild` | 支持通过 render 方法自定义 icon |
| key | `string \| number` | 需要唯一 |
| label | `string` | 显示的 label 值 |
| disabled | `boolean` | 是否禁用 |
| props | `HTMLAttributes` | 自定义选项属性 |
### DropdownDivider Type
#### DropdownDividerOption Type
| 属性 | 类型 | 说明 |
| ---- | ------------------ | ------------ |
| type | `'divider'` | 分割线的类型 |
| key | `string \| number` | 需要唯一 |
### DropdownSubmenu Type
#### DropdownGroupOption Type
| 属性 | 类型 | 说明 |
| --- | --- | --- |
| type | `'submenu'` | 下拉菜单 submenu 的类型 |
| type | `'group'` | DropdownGroupOption 的类型 |
| label | `string` | 显示的 label 值 |
| icon? | `() => VNodeChild` | 支持通过 render 方法自定义 icon |
| key | `string \| number` | 需要唯一 |
| children | `Array<DropdownOption \| DropdownDivider \| DropdownGroup \| DropdownSubmenu>` | DropdownSubmenu 的 children 项 |
| disabled | `boolean` | 是否禁用 |
### DropdownGroup Type
| 属性 | 类型 | 说明 |
| --- | --- | --- |
| type | `'group'` | DropdownGroup 的类型 |
| label | `string` | 显示的 label 值 |
| icon? | `() => VNodeChild` | 支持通过 render 方法自定义 icon |
| key | `string \| number` | 需要唯一 |
| children | `Array<DropdownOption \| DropdownDivider \| DropdownSubmenu>` | DropdownGroup 的 children 项 |
| children | `Array<DropdownOption \| DropdownDividerOption>` | DropdownGroupOption 的 children 项 |

3
src/dropdown/index.ts
View File

@ -4,8 +4,5 @@ export type {
DropdownOption,
DropdownGroupOption,
DropdownIgnoredOption,
DropdownDivider,
DropdownSubmenu,
DropdownGroup,
DropdownDividerOption
} from './src/interface'

19
src/dropdown/src/interface.ts
View File

@ -33,25 +33,6 @@ export interface DropdownDividerOption {
[key: string]: unknown
}
export type DropdownDivider = Pick<DropdownDividerOption, 'type' | 'key'>
export interface DropdownSubmenu {
type: 'submenu'
label: string
icon?: () => VNodeChild
key: Key
children: Array<DropdownOption | DropdownDivider | DropdownSubmenu>
disabled: boolean
}
export interface DropdownGroup {
type: 'group'
label: string
icon?: () => VNodeChild
key: Key
children: Array<DropdownOption | DropdownDivider | DropdownSubmenu>
}
export type TmNode = TreeNode<
DropdownOption,
DropdownGroupOption,

2
src/dropdown/src/utils.ts
View File

@ -1,7 +1,5 @@
import type { DropdownMixedOption } from './interface'
export type { DropdownDivider } from './interface'
export function isSubmenuNode (rawNode: DropdownMixedOption): boolean {
return (
rawNode.type === 'submenu' ||

10
src/menu/demos/enUS/index.demo-entry.md
View File

@ -17,7 +17,7 @@ inverted
long-label
```
## Props
## API
### Menu Props
@ -35,7 +35,7 @@ long-label
| icon-size | `number` | `20` | The icon size when menu is not collapsed. |
| indent | `number` | `32` | The indent of menu. |
| inverted | `boolean` | `false` | Use inverted style. |
| options | `Array<MenuOption \| MenuOptionGroup>` | `[]` | Items data of menu. |
| options | `Array<MenuOption \| MenuGroupOption>` | `[]` | Items data of menu. |
| mode | `'vertical' \| 'horizontal'` | `'vertical'` | Menu layout. |
| render-extra | `(option: MenuOption \| MenuGroupOption) => VNodeChild` | `undefined` | Render function that renders all extras. |
| render-icon | `(option: MenuOption) => VNodeChild` | `undefined` | Render function that renders all icons. |
@ -49,18 +49,18 @@ long-label
| Name | Type | Description |
| --- | --- | --- |
| children? | `Array<MenuOption \| MenuOptionGroup>` | Child menu options. |
| children? | `Array<MenuOption \| MenuGroupOption>` | Child menu options. |
| disabled? | `boolean` | Whether to disable the menu item. |
| extra? | `string \| (() => VNodeChild)` | The extra parts of the menu item. |
| icon? | `() => VNodeChild` | The icon for the menu item. |
| key | `string` | The indentifier of the menu item. |
| label | `string \| (() => VNodeChild)` | The label of the menu item. |
### MenuOptionGroup Properties
### MenuGroupOption Properties
| Name | Type | Description |
| --- | --- | --- |
| children | `Array<MenuOption \| MenuOptionGroup>` | Group items. **required!** |
| children | `Array<MenuOption \| MenuGroupOption>` | Group items. **required!** |
| key | `string` | The indentifier of the menu group. |
| label | `string \| (() => VNodeChild)` | The label of the menu item. |
| type | `'group'` | The type of the menu item, **required!** |

12
src/menu/demos/zhCN/index.demo-entry.md
View File

@ -17,7 +17,7 @@ inverted
long-label
```
## Props
## API
### Menu Props
@ -35,7 +35,7 @@ long-label
| icon-size | `number` | `20` | 菜单未折叠时图标的大小 |
| indent | `number` | `32` | 菜单每级的缩进 |
| inverted | `boolean` | `false` | 使用反转样式 |
| options | `Array<MenuOption \| MenuOptionGroup>` | `[]` | 菜单的数据 |
| options | `Array<MenuOption \| MenuGroupOption>` | `[]` | 菜单的数据 |
| mode | `'vertical' \| 'horizontal'` | `'vertical'` | 菜单的布局方式 |
| render-extra | `(option: MenuOption \| MenuGroupOption) => VNodeChild` | `undefined` | 批量处理菜单额外部分渲染 |
| render-icon | `(option: MenuOption) => VNodeChild` | `undefined` | 批量处理菜单图标渲染 |
@ -45,22 +45,22 @@ long-label
| on-update:expanded-keys | `(keys: string[]) => void` | `undefined` | `keys` 是展开菜单项的 `key` 的数组 |
| on-update:value | `(key: string, item: MenuOption) => void` | `undefined` | 选中菜单的回调，`key` 是选中菜单项的 `key`，`item` 是菜单项原始数据 |
### Menu Properties
### MenuOption Properties
| 名称 | 类型 | 说明 |
| --------- | -------------------------------------- | ---------------- |
| children? | `Array<MenuOption \| MenuOptionGroup>` | 子选项 |
| children? | `Array<MenuOption \| MenuGroupOption>` | 子选项 |
| disabled? | `boolean` | 是否禁用菜单项 |
| extra? | `string \| (() => VNodeChild)` | 菜单项的额外部分 |
| icon? | `() => VNode` | 菜单项的图标 |
| key | `string` | 菜单项的标识符 |
| label | `string \| (() => VNodeChild)` | 菜单项的内容 |
### MenuOptionGroup Properties
### MenuGroupOption Properties
| 名称 | 类型 | 说明 |
| -------- | -------------------------------------- | ------------------------ |
| children | `Array<MenuOption \| MenuOptionGroup>` | 子菜单，**必填！** |
| children | `Array<MenuOption \| MenuGroupOption>` | 子菜单，**必填！** |
| key | `string` | 菜单项的标识符 |
| label | `string \| (() => VNodeChild)` | 菜单项的内容 |
| type | `'group'` | 菜单项的类型，**必填！** |