feat: modify API

Tencent · May 16, 2024 · ba81811 · ba81811
1 parent 58764be
commit ba81811
Show file tree

Hide file tree

Showing 185 changed files with 1,650 additions and 1,655 deletions.
diff --git a/src/affix/affix.en-US.md b/src/affix/affix.en-US.md
@@ -10,7 +10,7 @@ style | Object | - | 样式，Typescript：`React.CSSProperties` | N
 children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 container | String / Function | () => (() => window) | Typescript：`ScrollContainer`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 content | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
-offsetBottom | Number | 0 | When the distance from the bottom of the container reaches the specified distance, the trigger is fixed | N
-offsetTop | Number | 0 | When the distance from the top of the container reaches the specified distance, the trigger is fixed | N
+offsetBottom | Number | 0 | \- | N
+offsetTop | Number | 0 | \- | N
 zIndex | Number | - | \- | N
 onFixedChange | Function |  | Typescript：`(affixed: boolean, context: { top: number }) => void`<br/> | N
diff --git a/src/affix/defaultProps.ts b/src/affix/defaultProps.ts
@@ -4,4 +4,4 @@
 
 import { TdAffixProps } from './type';
 
-export const affixDefaultProps: TdAffixProps = { container: () => window, offsetBottom: 0, offsetTop: 0 };
+export const affixDefaultProps: TdAffixProps = { container: '() => (() => window)', offsetBottom: 0, offsetTop: 0 };
diff --git a/src/affix/type.ts b/src/affix/type.ts
@@ -13,20 +13,20 @@ export interface TdAffixProps {
   children?: TNode;
   /**
    * 指定滚动的容器。数据类型为 String 时，会被当作选择器处理，进行节点查询。示例：'body' 或 () => document.body
-   * @default () => window
+   * @default () => (() => window)
    */
   container?: ScrollContainer;
   /**
    * 内容
    */
   content?: TNode;
   /**
-   *  距离容器底部达到指定距离后触发固定
+   *  距离容器顶部达到指定距离后触发固定
    * @default 0
    */
   offsetBottom?: number;
   /**
-   *  距离容器顶部达到指定距离后触发固定
+   *  距离容器底部达到指定距离后触发固定
    * @default 0
    */
   offsetTop?: number;

diff --git a/src/alert/alert.md b/src/alert/alert.md
@@ -1,6 +1,7 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Alert Props
 
 名称 | 类型 | 默认值 | 说明 | 必传

diff --git a/src/anchor/anchor.en-US.md b/src/anchor/anchor.en-US.md
@@ -1,6 +1,7 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Anchor Props
 
 name | type | default | description | required
@@ -9,10 +10,9 @@ className | String | - | 类名 | N
 style | Object | - | 样式，Typescript：`React.CSSProperties` | N
 affixProps | Object | - | Typescript：`Omit<AffixProps, 'children'>`，[Affix API Documents](./affix?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/anchor/type.ts) | N
 bounds | Number | 5 | \- | N
-container | String / Function | () => window | Typescript：`ScrollContainer`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+container | String / Function | () => (() => window) | Typescript：`ScrollContainer`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 cursor | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
-getCurrentAnchor | Function | - | Custom Highlighted Anchor Points。Typescript：`(activeLink: string) => string` | N
-size | String | medium | options: small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+size | String | medium | options：small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 targetOffset | Number | 0 | \- | N
 onChange | Function |  | Typescript：`(currentLink: string, prevLink: string) => void`<br/> | N
 onClick | Function |  | Typescript：`(link: { href: string; title: string; e: MouseEvent }) => void`<br/> | N
@@ -24,7 +24,7 @@ name | type | default | description | required
 className | String | - | 类名 | N
 style | Object | - | 样式，Typescript：`React.CSSProperties` | N
 href | String | - | required | Y
-target | String | _self | options: _self/_blank/_parent/_top | N
+target | String | _self | options：_self/_blank/_parent/_top | N
 title | TNode | '' | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 
 ### AnchorTarget Props

diff --git a/src/anchor/anchor.md b/src/anchor/anchor.md
@@ -1,6 +1,7 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Anchor Props
 
 名称 | 类型 | 默认值 | 说明 | 必传
@@ -9,9 +10,8 @@ className | String | - | 类名 | N
 style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
 affixProps | Object | - | 透传 Affix 组件属性，即让 Anchor 组件支持所有 Affix 组件特性。TS 类型：`Omit<AffixProps, 'children'>`，[Affix API Documents](./affix?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/anchor/type.ts) | N
 bounds | Number | 5 | 锚点区域边界 | N
-container | String / Function | () => window | 指定滚动的容器。数据类型为 String 时，会被当作选择器处理，进行节点查询。示例：'body' 或 () => document.body。TS 类型：`ScrollContainer`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+container | String / Function | () => (() => window) | 指定滚动的容器。数据类型为 String 时，会被当作选择器处理，进行节点查询。示例：'body' 或 () => document.body。TS 类型：`ScrollContainer`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 cursor | TElement | - | 用于自定义选中项左侧游标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
-getCurrentAnchor | Function | - | 自定义高亮的锚点	。TS 类型：`(activeLink: string) => string` | N
 size | String | medium | 组件尺寸，small(120px)，medium(200px)，large(320px)。可选项：small/medium/large。TS 类型：`SizeEnum`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 targetOffset | Number | 0 | 锚点滚动偏移量 | N
 onChange | Function |  | TS 类型：`(currentLink: string, prevLink: string) => void`<br/>锚点改变时触发 | N

diff --git a/src/auto-complete/defaultProps.ts b/src/auto-complete/defaultProps.ts
@@ -5,7 +5,6 @@
 import { TdAutoCompleteProps } from './type';
 
 export const autoCompleteDefaultProps: TdAutoCompleteProps = {
-  borderless: false,
   filterable: true,
   highlightKeyword: true,
   placeholder: undefined,

diff --git a/src/auto-complete/type.ts b/src/auto-complete/type.ts
@@ -15,11 +15,6 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
    * 自动获取焦点
    */
   autofocus?: boolean;
-  /**
-   * 无边框模式
-   * @default false
-   */
-  borderless?: boolean;
   /**
    * 触发显示联想词下拉框的元素，同 `triggerElement`
    */
@@ -115,9 +110,7 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
    */
   onChange?: (
     value: string,
-    context?: {
-      e?: FormEvent<HTMLInputElement> | MouseEvent<HTMLLIElement> | CompositionEvent<HTMLDivElement> | KeyboardEvent;
-    },
+    context?: { e?: FormEvent<HTMLInputElement> | MouseEvent<HTMLLIElement> | KeyboardEvent },
   ) => void;
   /**
    * 清空按钮点击时触发
@@ -126,11 +119,11 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
   /**
    * 中文输入结束时触发
    */
-  onCompositionend?: (context: { e: CompositionEvent<HTMLDivElement>; value: string }) => void;
+  onCompositionend?: (context: { e: CompositionEvent<HTMLInputElement>; value: string }) => void;
   /**
    * 中文输入开始时触发
    */
-  onCompositionstart?: (context: { e: CompositionEvent<HTMLDivElement>; value: string }) => void;
+  onCompositionstart?: (context: { e: CompositionEvent<HTMLInputElement>; value: string }) => void;
   /**
    * 回车键按下时触发
    */
@@ -142,7 +135,7 @@ export interface TdAutoCompleteProps<T extends AutoCompleteOption = AutoComplete
   /**
    * 选中联想词时触发
    */
-  onSelect?: (value: string, context: { e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement> }) => void;
+  onSelect?: (value: string, context: { e: MouseEvent<HTMLLIElement> | KeyboardEvent }) => void;
 }
 
 export type AutoCompleteOption = string | AutoCompleteOptionObj;

diff --git a/src/avatar/avatar.en-US.md b/src/avatar/avatar.en-US.md
@@ -1,31 +1,36 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Avatar Props
 
 name | type | default | description | required
 -- | -- | -- | -- | --
-className | String | - | 类名 | N
-style | Object | - | 样式，Typescript：`React.CSSProperties` | N
+className | String | - | className of component | N
+style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N
 alt | String | - | show it when url is not valid | N
 children | TNode | - | children, same as `content`。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 content | TNode | - | content slot or props.content。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 hideOnLoadFailed | Boolean | false | hide image when loading image failed | N
 icon | TElement | - | use icon to fill。Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 image | String | - | images url | N
 imageProps | Object | - | Typescript：`ImageProps`，[Image API Documents](./image?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
-shape | String | circle | shape。options：circle/round。Typescript：`ShapeEnum ` `type ShapeEnum = 'circle' \| 'round'`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
-size | String | - | size | N
-onError | Function |  | Typescript：`(context: { e: ImageEvent }) => void`<br/>trigger on image load failed | N
+shape | String | circle | shape。options: circle/round。Typescript：`ShapeEnum ` `type ShapeEnum = 'circle' \| 'round'`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
+size | String | medium | size | N
+onClick | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on click | N
+onContextmenu | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on context menu | N
+onError | Function |  | Typescript：`(context: { e: Event }) => void`<br/>trigger on image load failed | N
+onHover | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on mouse enter | N
+
 
 ### AvatarGroup Props
 
 name | type | default | description | required
 -- | -- | -- | -- | --
-className | String | - | 类名 | N
-style | Object | - | 样式，Typescript：`React.CSSProperties` | N
-cascading | String | 'right-up' | multiple images cascading。options：left-up/right-up。Typescript：`CascadingValue` `type CascadingValue = 'left-up' \| 'right-up'`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
+className | String | - | className of component | N
+style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N
+cascading | String | 'right-up' | multiple images cascading。options: left-up/right-up。Typescript：`CascadingValue` `type CascadingValue = 'left-up' \| 'right-up'`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
 collapseAvatar | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 max | Number | - | \- | N
 popupProps | Object | - | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
-size | String | - | size | N
+size | String | medium | size | N
diff --git a/src/avatar/avatar.md b/src/avatar/avatar.md
@@ -1,9 +1,10 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Avatar Props
 
-名称 | 类型 | 默认值 | 说明 | 必传
+名称 | 类型 | 默认值 | 描述 | 必传
 -- | -- | -- | -- | --
 className | String | - | 类名 | N
 style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
@@ -15,17 +16,21 @@ icon | TElement | - | 图标。TS 类型：`TNode`。[通用类型定义](https:
 image | String | - | 图片地址 | N
 imageProps | Object | - | 透传至 Image 组件。TS 类型：`ImageProps`，[Image API Documents](./image?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
 shape | String | circle | 形状。可选项：circle/round。TS 类型：`ShapeEnum ` `type ShapeEnum = 'circle' \| 'round'`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
-size | String | - | 尺寸，示例值：small/medium/large/24px/38px 等。优先级高于 AvatarGroup.size 。Avatar 单独存在时，默认值为 medium。如果父组件存在 AvatarGroup，默认值便由 AvatarGroup.size 决定 | N
-onError | Function |  | TS 类型：`(context: { e: ImageEvent }) => void`<br/>图片加载失败时触发 | N
+size | String | medium | 尺寸，示例值：small/medium/large/24px/38px 等。优先级高于 AvatarGroup.size 。Avatar 单独存在时，默认值为 medium。如果父组件存在 AvatarGroup，默认值便由 AvatarGroup.size 决定 | N
+onClick | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>点击时触发 | N
+onContextmenu | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>右键点击时触发 | N
+onError | Function |  | TS 类型：`(context: { e: Event }) => void`<br/>图片加载失败时触发 | N
+onHover | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>鼠标移入时触发 | N
+
 
 ### AvatarGroup Props
 
-名称 | 类型 | 默认值 | 说明 | 必传
+名称 | 类型 | 默认值 | 描述 | 必传
 -- | -- | -- | -- | --
 className | String | - | 类名 | N
 style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
 cascading | String | 'right-up' | 图片之间的层叠关系，可选值：左侧图片在上和右侧图片在上。可选项：left-up/right-up。TS 类型：`CascadingValue` `type CascadingValue = 'left-up' \| 'right-up'`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
 collapseAvatar | TNode | - | 头像数量超出时，会出现一个头像折叠元素。该元素内容可自定义。默认为 `+N`。示例：`+5`，`...`, `更多`。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 max | Number | - | 能够同时显示的最多头像数量 | N
 popupProps | Object | - | 头像右上角提示信息。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/avatar/type.ts) | N
-size | String | - | 尺寸，示例值：small/medium/large/24px/38px 等。优先级低于 Avatar.size | N
+size | String | medium | 尺寸，示例值：small/medium/large/24px/38px 等。优先级低于 Avatar.size | N
diff --git a/src/avatar/defaultProps.ts b/src/avatar/defaultProps.ts
@@ -4,6 +4,6 @@
 
 import { TdAvatarProps, TdAvatarGroupProps } from './type';
 
-export const avatarDefaultProps: TdAvatarProps = { hideOnLoadFailed: false, shape: 'circle' };
+export const avatarDefaultProps: TdAvatarProps = { hideOnLoadFailed: false, shape: 'circle', size: 'medium' };
 
-export const avatarGroupDefaultProps: TdAvatarGroupProps = { cascading: 'right-up' };
+export const avatarGroupDefaultProps: TdAvatarGroupProps = { cascading: 'right-up', size: 'medium' };
diff --git a/src/avatar/type.ts b/src/avatar/type.ts
@@ -6,7 +6,8 @@
 
 import { ImageProps } from '../image';
 import { PopupProps } from '../popup';
-import { TNode, TElement, ImageEvent } from '../common';
+import { TNode, TElement } from '../common';
+import { MouseEvent } from 'react';
 
 export interface TdAvatarProps {
   /**
@@ -47,13 +48,25 @@ export interface TdAvatarProps {
   shape?: ShapeEnum;
   /**
    * 尺寸，示例值：small/medium/large/24px/38px 等。优先级高于 AvatarGroup.size 。Avatar 单独存在时，默认值为 medium。如果父组件存在 AvatarGroup，默认值便由 AvatarGroup.size 决定
-   * @default ''
+   * @default medium
    */
   size?: string;
+  /**
+   * 点击时触发
+   */
+  onClick?: (context: { e: MouseEvent<HTMLElement> }) => void;
+  /**
+   * 右键点击时触发
+   */
+  onContextmenu?: (context: { e: MouseEvent<HTMLElement> }) => void;
   /**
    * 图片加载失败时触发
    */
-  onError?: (context: { e: ImageEvent<HTMLImageElement> }) => void;
+  onError?: (context: { e: Event }) => void;
+  /**
+   * 鼠标移入时触发
+   */
+  onHover?: (context: { e: MouseEvent<HTMLElement> }) => void;
 }
 
 export interface TdAvatarGroupProps {
@@ -76,7 +89,7 @@ export interface TdAvatarGroupProps {
   popupProps?: PopupProps;
   /**
    * 尺寸，示例值：small/medium/large/24px/38px 等。优先级低于 Avatar.size
-   * @default ''
+   * @default medium
    */
   size?: string;
 }

diff --git a/src/back-top/back-top.en-US.md b/src/back-top/back-top.en-US.md
@@ -1,7 +1,6 @@
 :: BASE_DOC ::
 
 ## API
-
 ### BackTop Props
 
 name | type | default | description | required

diff --git a/src/back-top/back-top.md b/src/back-top/back-top.md
@@ -1,7 +1,6 @@
 :: BASE_DOC ::
 
 ## API
-
 ### BackTop Props
 
 名称 | 类型 | 默认值 | 说明 | 必传

diff --git a/src/back-top/type.ts b/src/back-top/type.ts
@@ -8,14 +8,6 @@ import { TNode, AttachNode } from '../common';
 import { MouseEvent } from 'react';
 
 export interface TdBackTopProps {
-  /**
-   * 类名
-   */
-  className?: string;
-  /**
-   * 样式
-   */
-  style?: React.CSSProperties;
   /**
    * 回到顶部内容，同 `content`
    */

diff --git a/src/badge/badge.md b/src/badge/badge.md
@@ -1,6 +1,7 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Badge Props
 
 名称 | 类型 | 默认值 | 说明 | 必传

diff --git a/src/breadcrumb-item/breadcrumb-item.en-US.md b/src/breadcrumb-item/breadcrumb-item.en-US.md
@@ -0,0 +1,20 @@
+:: BASE_DOC ::
+
+## API
+
+### BreadcrumbItem Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+className | String | - | 类名 | N
+style | Object | - | 样式，Typescript：`React.CSSProperties` | N
+children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+content | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+disabled | Boolean | - | \- | N
+href | String | - | \- | N
+icon | TElement | - | prefix icon in breadcrumb item。Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+maxWidth | String | undefined | \- | N
+replace | Boolean | false | \- | N
+router | Object | - | Typescript：`any` | N
+target | String | _self | options：_blank/_self/_parent/_top | N
+to | String / Object | - | Typescript：`string \| Route` `interface Route { path?: string; name?: string; hash?: string; query?: RouteData; params?: RouteData }` `type RouteData = { [key: string]: string \| string[] }`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/breadcrumb/type.ts) | N