Skip to content
Merged
Show file tree
Hide file tree
Changes from 5 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified db/TDesign.db
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
:: BASE_DOC ::

## API

### Popup Props

name | type | default | description | required
-- | -- | -- | -- | --
attach | String / Function | 'body' | Typescript:`AttachNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
children | TNode | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
closeBtn | TNode | - | Typescript:`boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
content | TNode | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
delay | Number / Array | - | delay to show or hide popover。Typescript:`number \| Array<number>` | N
destroyOnClose | Boolean | false | \- | N
Expand All @@ -20,10 +20,21 @@ overlayStyle | Boolean / Object / Function | - | Typescript:`Styles \| ((trigg
placement | String | top | Typescript:`PopupPlacement` `type PopupPlacement = 'top'\|'left'\|'right'\|'bottom'\|'top-left'\|'top-right'\|'bottom-left'\|'bottom-right'\|'left-top'\|'left-bottom'\|'right-top'\|'right-bottom'`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/popup/type.ts) | N
popperOptions | Object | - | popper initial options,details refer to https://popper.js.org/docs | N
showArrow | Boolean | false | \- | N
trigger | String | hover | optionshover/click/focus/mousedown/context-menu | N
trigger | String | hover | options: hover/click/focus/mousedown/context-menu | N
triggerElement | TNode | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
visible | Boolean | - | Typescript:`boolean` | N
defaultVisible | Boolean | - | uncontrolled property。Typescript:`boolean` | N
zIndex | Number | - | \- | N
onOverlayClick | Function | | Typescript:`(context: { e: MouseEvent }) => void`<br/>trigger on popup content click | N
onScroll | Function | | Typescript:`(context: { e: WheelEvent }) => void`<br/> | N
onScrollToBottom | Function | | Typescript:`(context: { e: WheelEvent }) => void`<br/> | N
onVisibleChange | Function | | Typescript:`(visible: boolean, context: PopupVisibleChangeContext) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/> | N

### PopupInstanceFunctions 组件实例方法

name | params | return | description
-- | -- | -- | --
getOverlay | \- | `HTMLElement` | used to get overly html element
getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay
getPopper | \- | `Instance` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/popup/type.ts)。<br/>`import { Instance } from '@popperjs/core'`<br/>
update | \- | \- | used to update overlay content
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
:: BASE_DOC ::

## API

### Popup Props

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
attach | String / Function | 'body' | 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
attach | String / Function | 'body' | 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
children | TNode | - | 触发元素,同 triggerElement。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
closeBtn | TNode | - | 是否展示关闭按钮,值为 `true` 显示默认关闭按钮;值为 `false` 则不显示关闭按钮;也可以自定义关闭按钮。TS 类型:`boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
content | TNode | - | 浮层里面的内容。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
delay | Number / Array | - | 延时显示或隐藏浮层,[延迟显示的时间,延迟隐藏的时间],单位:毫秒。如果只有一个时间,则表示显示和隐藏的延迟时间相同。示例 `'300'` 或者 `[200, 200]`。默认为:[250, 150]。TS 类型:`number \| Array<number>` | N
destroyOnClose | Boolean | false | 是否在关闭浮层时销毁浮层 | N
Expand All @@ -23,7 +23,18 @@ showArrow | Boolean | false | 是否显示浮层箭头 | N
trigger | String | hover | 触发浮层出现的方式。可选项:hover/click/focus/mousedown/context-menu | N
triggerElement | TNode | - | 触发元素。值类型为字符串表示元素选择器。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/common.ts) | N
visible | Boolean | - | 是否显示浮层。TS 类型:`boolean` | N
defaultVisible | Boolean | - | 是否显示浮层。非受控属性。TS 类型:`boolean` | N
zIndex | Number | - | 组件层级,Web 侧样式默认为 5500,移动端和小程序样式默认为 1500 | N
onOverlayClick | Function | | TS 类型:`(context: { e: MouseEvent }) => void`<br/>内容面板点击时触发 | N
onScroll | Function | | TS 类型:`(context: { e: WheelEvent }) => void`<br/>下拉选项滚动事件 | N
onScrollToBottom | Function | | TS 类型:`(context: { e: WheelEvent }) => void`<br/>下拉滚动触底事件,常用于滚动到底执行具体业务逻辑 | N
onVisibleChange | Function | | TS 类型:`(visible: boolean, context: PopupVisibleChangeContext) => void`<br/>当浮层隐藏或显示时触发,`trigger=document` 表示点击非浮层元素触发;`trigger=context-menu` 表示右击触发。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/> | N

### PopupInstanceFunctions 组件实例方法

名称 | 参数 | 返回值 | 描述
-- | -- | -- | --
getOverlay | \- | `HTMLElement` | 获取浮层元素
getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态
getPopper | \- | `Instance` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/packages/components/popup/type.ts)。<br/>`import { Instance } from '@popperjs/core'`<br/>
update | \- | \- | 更新浮层内容
Original file line number Diff line number Diff line change
Expand Up @@ -4,23 +4,20 @@
* 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC
* */

import { Instance } from '@popperjs/core';
import { TNode, ClassName, Styles, AttachNode } from '../common';
import { MouseEvent, KeyboardEvent, FocusEvent, WheelEvent } from 'react';

export interface TdPopupProps {
/**
* 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body
* 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body
* @default 'body'
*/
attach?: AttachNode;
/**
* 触发元素,同 triggerElement
*/
children?: TNode;
/**
* 是否展示关闭按钮,值为 `true` 显示默认关闭按钮;值为 `false` 则不显示关闭按钮;也可以自定义关闭按钮
*/
closeBtn?: TNode;
/**
* 浮层里面的内容
*/
Expand Down Expand Up @@ -94,6 +91,10 @@ export interface TdPopupProps {
* 组件层级,Web 侧样式默认为 5500,移动端和小程序样式默认为 1500
*/
zIndex?: number;
/**
* 内容面板点击时触发
*/
onOverlayClick?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
/**
* 下拉选项滚动事件
*/
Expand All @@ -108,6 +109,26 @@ export interface TdPopupProps {
onVisibleChange?: (visible: boolean, context: PopupVisibleChangeContext) => void;
}

/** 组件实例方法 */
export interface PopupInstanceFunctions {
/**
* 获取浮层元素
*/
getOverlay?: () => HTMLElement;
/**
* 获取浮层悬浮状态
*/
getOverlayState?: () => { hover: boolean };
/**
* 获取当前组件 popper 实例
*/
getPopper?: () => Instance;
/**
* 更新浮层内容
*/
update?: () => void;
}

export type PopupPlacement =
| 'top'
| 'left'
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
:: BASE_DOC ::

## API

### Popup Props

name | type | default | description | required
-- | -- | -- | -- | --
attach | String / Function | 'body' | Typescript:`AttachNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
closeBtn | Boolean / Slot / Function | - | Typescript:`boolean \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
content | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
default | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
delay | Number / Array | - | delay to show or hide popover。Typescript:`number \| Array<number>` | N
Expand All @@ -20,10 +20,12 @@ overlayStyle | Boolean / Object / Function | - | Typescript:`Styles \| ((trigg
placement | String | top | Typescript:`PopupPlacement` `type PopupPlacement = 'top'\|'left'\|'right'\|'bottom'\|'top-left'\|'top-right'\|'bottom-left'\|'bottom-right'\|'left-top'\|'left-bottom'\|'right-top'\|'right-bottom'`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts) | N
popperOptions | Object | - | popper initial options,details refer to https://popper.js.org/docs | N
showArrow | Boolean | false | \- | N
trigger | String | hover | optionshover/click/focus/mousedown/context-menu | N
trigger | String | hover | options: hover/click/focus/mousedown/context-menu | N
triggerElement | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
visible | Boolean | - | `v-model` and `v-model:visible` is supported。Typescript:`boolean` | N
defaultVisible | Boolean | - | uncontrolled property。Typescript:`boolean` | N
zIndex | Number | - | \- | N
onOverlayClick | Function | | Typescript:`(context: { e: MouseEvent }) => void`<br/>trigger on popup content click | N
onScroll | Function | | Typescript:`(context: { e: WheelEvent }) => void`<br/> | N
onScrollToBottom | Function | | Typescript:`(context: { e: WheelEvent }) => void`<br/> | N
onVisibleChange | Function | | Typescript:`(visible: boolean, context: PopupVisibleChangeContext) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/> | N
Expand All @@ -32,6 +34,16 @@ onVisibleChange | Function | | Typescript:`(visible: boolean, context: PopupV

name | params | description
-- | -- | --
overlay-click | `(context: { e: MouseEvent })` | trigger on popup content click
scroll | `(context: { e: WheelEvent })` | \-
scroll-to-bottom | `(context: { e: WheelEvent })` | \-
visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | [see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/>

### PopupInstanceFunctions 组件实例方法

name | params | return | description
-- | -- | -- | --
getOverlay | \- | `HTMLElement` | used to get overly html element
getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay
getPopper | \- | `Instance` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`import { Instance } from '@popperjs/core'`<br/>
update | \- | \- | used to update overlay content
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
:: BASE_DOC ::

## API

### Popup Props

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
attach | String / Function | 'body' | 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
closeBtn | Boolean / Slot / Function | - | 是否展示关闭按钮,值为 `true` 显示默认关闭按钮;值为 `false` 则不显示关闭按钮;也可以自定义关闭按钮。TS 类型:`boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
attach | String / Function | 'body' | 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
content | String / Slot / Function | - | 浮层里面的内容。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
default | String / Slot / Function | - | 触发元素,同 triggerElement。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
delay | Number / Array | - | 延时显示或隐藏浮层,[延迟显示的时间,延迟隐藏的时间],单位:毫秒。如果只有一个时间,则表示显示和隐藏的延迟时间相同。示例 `'300'` 或者 `[200, 200]`。默认为:[250, 150]。TS 类型:`number \| Array<number>` | N
Expand All @@ -23,7 +23,9 @@ showArrow | Boolean | false | 是否显示浮层箭头 | N
trigger | String | hover | 触发浮层出现的方式。可选项:hover/click/focus/mousedown/context-menu | N
triggerElement | String / Slot / Function | - | 触发元素。值类型为字符串表示元素选择器。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
visible | Boolean | - | 是否显示浮层。支持语法糖 `v-model` 或 `v-model:visible`。TS 类型:`boolean` | N
defaultVisible | Boolean | - | 是否显示浮层。非受控属性。TS 类型:`boolean` | N
zIndex | Number | - | 组件层级,Web 侧样式默认为 5500,移动端和小程序样式默认为 1500 | N
onOverlayClick | Function | | TS 类型:`(context: { e: MouseEvent }) => void`<br/>内容面板点击时触发 | N
onScroll | Function | | TS 类型:`(context: { e: WheelEvent }) => void`<br/>下拉选项滚动事件 | N
onScrollToBottom | Function | | TS 类型:`(context: { e: WheelEvent }) => void`<br/>下拉滚动触底事件,常用于滚动到底执行具体业务逻辑 | N
onVisibleChange | Function | | TS 类型:`(visible: boolean, context: PopupVisibleChangeContext) => void`<br/>当浮层隐藏或显示时触发,`trigger=document` 表示点击非浮层元素触发;`trigger=context-menu` 表示右击触发。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/> | N
Expand All @@ -32,6 +34,16 @@ onVisibleChange | Function | | TS 类型:`(visible: boolean, context: PopupVi

名称 | 参数 | 描述
-- | -- | --
overlay-click | `(context: { e: MouseEvent })` | 内容面板点击时触发
scroll | `(context: { e: WheelEvent })` | 下拉选项滚动事件
scroll-to-bottom | `(context: { e: WheelEvent })` | 下拉滚动触底事件,常用于滚动到底执行具体业务逻辑
visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当浮层隐藏或显示时触发,`trigger=document` 表示点击非浮层元素触发;`trigger=context-menu` 表示右击触发。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`<br/><br/>`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`<br/><br/>`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'trigger-element-close' \| 'context-menu' \| 'keydown-esc'`<br/>

### PopupInstanceFunctions 组件实例方法

名称 | 参数 | 返回值 | 描述
-- | -- | -- | --
getOverlay | \- | `HTMLElement` | 获取浮层元素
getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态
getPopper | \- | `Instance` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。<br/>`import { Instance } from '@popperjs/core'`<br/>
update | \- | \- | 更新浮层内容
Loading