Skip to content

Commit

Permalink
style(Dialog): update types and readme
Browse files Browse the repository at this point in the history
  • Loading branch information
bindoon authored and youluna committed Oct 15, 2021
1 parent 8eafba7 commit 79397c4
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 10 deletions.
6 changes: 3 additions & 3 deletions docs/dialog/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
功能变化:

- 位置不再通过 js 计算,通过存 css 完成,响应式性能更好
- 新增 `closeIcon` 控制关闭按钮
- 新增 `closeIcon` 可定制关闭按钮 icon
- 新增 `width` 固定弹窗宽度, 或者设置 auto 跟随内容变化
- 新增 `dialogRender` 配合 `react-draggable` 以支持拖拽弹窗

Expand Down Expand Up @@ -59,9 +59,9 @@ API变化:
| width | 弹窗宽度 v2 生效 | String/Number | - | 1.25 |
| top | 弹窗距离顶部间距 | Number | - | 1.25 |
| bottom | 弹窗距离底部最小间距 | Number | - | 1.25 |
| closeIcon | 弹窗距离底部最小间距 | ReactNode | - | 1.25 |
| closeIcon | 定制关闭按钮 icon | ReactNode | - | 1.25 |
| closeable | [废弃]同closeMode, 控制对话框关闭的方式,值可以为字符串或者布尔值,其中字符串是由以下值组成:<br/>**close** 表示点击关闭按钮可以关闭对话框<br/>**mask** 表示点击遮罩区域可以关闭对话框<br/>**esc** 表示按下 esc 键可以关闭对话框<br/>如 'close' 或 'close,esc,mask'<br/>如果设置为 true,则以上关闭方式全部生效<br/>如果设置为 false,则以上关闭方式全部失效 | String/Boolean | 'esc,close' | |
| onClose | [v2废弃] 对话框关闭时触发的回调函数<br/><br/>**签名**:<br/>Function(trigger: String, event: Object) => void<br/>**参数**:<br/>_trigger_: {String} 关闭触发行为的描述字符串<br/>_event_: {Object} 关闭时事件对象 | Function | () => {} | |
| onClose | 对话框关闭时触发的回调函数<br/><br/>**签名**:<br/>Function(trigger: String, event: Object) => void<br/>**参数**:<br/>_trigger_: {String} 关闭触发行为的描述字符串<br/>_event_: {Object} 关闭时事件对象 | Function | () => {} | |
| align | [v2废弃] 对话框对齐方式, 具体见Overlay文档 | String/Boolean | 'cc cc' | |
| isFullScreen | [v2废弃] 改用 overflowScroll | Boolean | false | |
| overflowScroll | 当对话框高度超过浏览器视口高度时,是否显示所有内容而不是出现滚动条以保证对话框完整显示在浏览器视口内,该属性仅在对话框垂直水平居中时生效,即 align 被设置为 'cc cc' 时 | Boolean | - | |
Expand Down
4 changes: 2 additions & 2 deletions src/dialog/dialog.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -150,7 +150,7 @@ export default class Dialog extends Component {
*/
bottom: PropTypes.number,
/**
* 弹窗距离底部最小间距
* 定制关闭按钮 icon
* @version 1.25
*/
closeIcon: PropTypes.node,
Expand All @@ -165,7 +165,7 @@ export default class Dialog extends Component {
*/
closeable: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
/**
* [v2废弃] 对话框关闭时触发的回调函数
* 对话框关闭时触发的回调函数
* @param {String} trigger 关闭触发行为的描述字符串
* @param {Object} event 关闭时事件对象
*/
Expand Down
33 changes: 28 additions & 5 deletions types/dialog/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -115,22 +115,21 @@ export interface DialogProps extends HTMLAttributesWeak, CommonProps {
autoFocus?: boolean;

/**
* 对话框对齐方式, 具体见Overlay文档
* [v2废弃] 对话框对齐方式, 具体见Overlay文档
*/
align?: string | boolean;

/**
* 当对话框高度超过浏览器视口高度时,是否显示所有内容而不是出现滚动条以保证对话框完整显示在浏览器视口内,该属性仅在对话框垂直水平居中时生效,即 align 被设置为 'cc cc' 时
* [v2废弃] 当对话框高度超过浏览器视口高度时,是否显示所有内容而不是出现滚动条以保证对话框完整显示在浏览器视口内,该属性仅在对话框垂直水平居中时生效,即 align 被设置为 'cc cc' 时
*/
isFullScreen?: boolean;

/**
* 是否在对话框重新渲染时及时更新对话框位置,一般用于对话框高度变化后依然能保证原来的对齐方式
* [v2废弃] 是否在对话框重新渲染时及时更新对话框位置,一般用于对话框高度变化后依然能保证原来的对齐方式
*/
shouldUpdatePosition?: boolean;

/**
* 对话框距离浏览器顶部和底部的最小间距,align 被设置为 'cc cc' 并且 isFullScreen 被设置为 true 时不生效
* [v2废弃] 对话框距离浏览器顶部和底部的最小间距,align 被设置为 'cc cc' 并且 isFullScreen 被设置为 true 时不生效
*/
minMargin?: number;

Expand All @@ -152,6 +151,30 @@ export interface DialogProps extends HTMLAttributesWeak, CommonProps {
*/
height?: string;
popupContainer?: string | HTMLElement | ((target: HTMLElement) => HTMLElement);
/**
* 开启 v2 版本弹窗
*/
v2?: boolean;
/**
* 定制关闭按钮 icon
*/
closeIcon?: React.ReactNode;
/**
* 弹窗宽度 v2 生效
*/
width?: string | number,
/**
* 弹窗距离顶部间距
*/
top?: number,
/**
* 弹窗距离底部最小间距
*/
bottom?: number,
/**
* 当对话框高度超过浏览器视口高度时,是否显示所有内容而不是出现滚动条以保证对话框完整显示在浏览器视口内,该属性仅在对话框垂直水平居中时生效,即 align 被设置为 'cc cc' 时
*/
overflowScroll?: boolean,
}

export interface QuickShowConfig extends DialogProps {
Expand Down

0 comments on commit 79397c4

Please sign in to comment.