@para-ui/core 2.2.5-beta → 2.2.7

package/Modal/index.d.ts

@@ -1,163 +1,61 @@
-import React__default, { ReactNode } from 'react';
-import { ButtonProps } from '../Button/index.js';
-import styleInject from './node_modules/style-inject/dist/style-inject.es.js';
-import '../_verture/interface-a77a851e.js';
-import 'rc-tooltip/lib/Tooltip';
-import '../_verture/index-6190b129.js';
-import '../_verture/index-5b08df83.js';
-import '../Dropdown/index.js';
-import '../_verture/index-0d8e1d07.js';
-
-var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/2 下午7:00\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-confirm .paraui-modal-body {\n  padding: 0;\n}\n.paraui-confirm-wrapper {\n  width: 416px;\n  outline: none;\n}\n.paraui-confirm-content {\n  position: relative;\n  padding: 32px 32px 24px;\n}\n.paraui-confirm-content .paraui-confirm-content-close {\n  position: absolute;\n  right: 16px;\n  top: 16px;\n  border: none;\n}\n.paraui-confirm-content .paraui-confirm-content-close .paraui-icon {\n  font-size: 18px;\n}\n.paraui-confirm-content-icon {\n  float: left;\n  margin-top: 2px;\n  color: rgb(255, 161, 80);\n}\n.paraui-confirm-content-icon svg {\n  color: inherit;\n  font-size: 16px;\n}\n.paraui-confirm-content-icon--warn, .paraui-confirm-content-icon-warning {\n  color: rgb(255, 161, 80);\n}\n.paraui-confirm-content-icon--error {\n  color: rgb(235, 96, 84);\n}\n.paraui-confirm-content-icon--success {\n  color: rgb(83, 195, 27);\n}\n.paraui-confirm-content-icon--info {\n  color: rgb(54, 102, 214);\n}\n.paraui-confirm-content-body {\n  margin: 0 16px 0 30px;\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n}\n.paraui-confirm-content-body .paraui-confirm-body-title {\n  display: block;\n  margin-bottom: 8px;\n  font-weight: 700;\n  font-size: 16px;\n}\n.paraui-confirm-content-actions {\n  margin-top: 24px;\n  text-align: right;\n}\n.paraui-confirm-content-actions > button + button {\n  margin-left: 16px;\n}";
-styleInject(css_248z$1);
-
-declare type ConfirmType = "success" | "info" | "error" | "warn" | "warning";
-interface ConfirmDialogProps {
-    /**图标类型*/
-    type?: ConfirmType;
+import React, { FunctionComponent, ReactNode } from "react";
+import { ButtonProps } from "../Button";
+import { Confirm, ConfirmObject } from "./Confirm";
+import './index.scss';
+declare type ModalSize = 'sm' | 'md' | 'lg' | 'auto' | 'fullScreen';
+export interface ModalProps {
     /**打开*/
     open?: boolean;
     /**标题*/
     title?: ReactNode;
-    /**内容*/
-    content?: ReactNode;
-    /**自定义图标*/
-    icon?: ReactNode;
-    /**ok文本*/
-    okText?: string;
-    /**cancel文本*/
-    cancelText?: string;
+    /**子节点*/
+    children?: ReactNode;
+    /**对话框头部*/
+    header?: ReactNode;
+    /**隐藏对话框头部*/
+    hideHeader?: boolean;
     /**底部操作栏*/
-    actions?: ReactNode;
+    actions?: ((buttons: ReactNode[]) => ReactNode[]) | ReactNode;
     /**是否显示actions*/
     showActions?: boolean;
     /**确定回调*/
     onOk?: Function;
-    /**取消回调*/
-    onCancel?: Function;
-    /**cls*/
-    className?: string;
-    /**confirm 宽度*/
-    width?: string | number;
-    /**显示取消按钮*/
-    showCancel?: boolean;
-    /**显示关闭按钮*/
-    closable?: boolean;
-    /**禁用backdrop点击*/
-    disableBackdropClick?: boolean;
-    /**禁用esc键*/
-    disableEscapeKeyDown?: boolean;
+    /**取消回调 return false 不关闭*/
+    onCancel?: () => boolean | void;
+    /**OK文本*/
+    okText?: string;
+    /**取消文本*/
+    cancelText?: string;
     /**确定按钮属性*/
     okButtonProps?: ButtonProps;
     /**取消按钮属性*/
     cancelButtonProps?: ButtonProps;
-    /**promise resolve*/
-    resolveFn?: Function;
-    /**确定时回调*/
-    callback?: Function;
-    /**销毁方法*/
-    destroy?: Function;
-}
-declare type ConfirmProps = Omit<ConfirmDialogProps, 'open' | 'resolveFn' | 'destroy' | 'callback'> & {
-    uuid?: string;
-};
-interface ConfirmFn {
-    (config: ConfirmProps | string, callback?: Function): void | Promise<any>;
-}
-interface ConfirmObject {
-    info: ConfirmFn;
-    warn: ConfirmFn;
-    error: ConfirmFn;
-    success: ConfirmFn;
-    destroyAll?: (uuid?: string) => void;
-}
-declare const Confirm: ConfirmObject;
-
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/6/13 下午6:54\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-modal {\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  font-variant: tabular-nums;\n  line-height: 1.5715;\n  font-feature-settings: \"tnum\";\n  pointer-events: none;\n  position: relative;\n  top: 100px;\n  width: auto;\n  max-width: calc(100vw - 32px);\n  margin: 0 auto;\n  padding-bottom: 24px;\n}\n.paraui-modal-sm .paraui-modal-content {\n  width: 430px;\n  max-height: 250px;\n}\n.paraui-modal-md .paraui-modal-content {\n  width: 486px;\n  max-height: 610px;\n}\n.paraui-modal-lg .paraui-modal-content {\n  width: 948px;\n  max-height: 610px;\n}\n.paraui-modal-fullscreen {\n  max-width: 100%;\n  width: 100%;\n  height: 100%;\n}\n.paraui-modal.paraui-modal-zoom-enter, .paraui-modal.paraui-modal-zoom-appear {\n  transform: none;\n  opacity: 0;\n  animation-duration: 0.3s;\n  user-select: none;\n}\n.paraui-modal-mask {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1500;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.45);\n}\n.paraui-modal-mask-hidden {\n  display: none;\n}\n.paraui-modal-wrap {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  overflow: auto;\n  outline: 0;\n  z-index: 1500;\n  -webkit-overflow-scrolling: touch;\n}\n.paraui-modal-title {\n  position: relative;\n  height: 44px;\n  padding: 12px 24px;\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  font-weight: 700;\n  line-height: 20px;\n  border-bottom: 1px solid rgba(171, 176, 185, 0.2);\n  overflow-wrap: break-word;\n}\n.paraui-modal-content {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n  position: relative;\n  border-radius: 4px;\n  background-color: rgb(255, 255, 255);\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n  pointer-events: auto;\n  overflow-y: auto;\n}\n.paraui-modal-close {\n  position: absolute;\n  top: 8px;\n  right: 14px;\n  z-index: 10;\n  border: 0;\n}\n.paraui-modal-body {\n  flex: auto;\n  padding: 16px 24px;\n  overflow-y: auto;\n  overflow-wrap: break-word;\n}\n.paraui-modal-footer {\n  padding: 8px 24px 24px;\n  text-align: right;\n}\n.paraui-modal-footer > button + button {\n  margin-left: 16px;\n}\n.paraui-modal-open {\n  overflow: hidden;\n}\n.paraui-modal-centered {\n  text-align: center;\n}\n.paraui-modal-centered::before {\n  display: inline-block;\n  width: 0;\n  height: 100%;\n  vertical-align: middle;\n  content: \"\";\n}\n.paraui-modal-centered .paraui-modal {\n  top: 0;\n  display: inline-block;\n  padding-bottom: 0;\n  text-align: left;\n  vertical-align: middle;\n}\n@media (max-width: 767px) {\n  .paraui-modal .paraui-modal {\n    max-width: calc(100vw - 16px);\n    margin: 8px auto;\n  }\n  .paraui-modal .paraui-modal-centered .paraui-modal {\n    flex: 1;\n  }\n}\n\n.paraui-modal-zoom-enter,\n.paraui-modal-zoom-appear {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n  transform: scale(0);\n  opacity: 0;\n  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);\n}\n\n.paraui-modal-zoom-leave {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n\n.paraui-modal-zoom-enter.paraui-modal-zoom-enter-active,\n.paraui-modal-zoom-appear.paraui-modal-zoom-appear-active {\n  animation-name: parauiModalZoomIn;\n  animation-play-state: running;\n}\n\n.paraui-modal-zoom-leave.paraui-modal-zoom-leave-active {\n  animation-name: parauiModalZoomOut;\n  animation-play-state: running;\n  pointer-events: none;\n}\n\n.paraui-modal-zoom-enter-prepare,\n.paraui-modal-zoom-appear-prepare {\n  transform: none;\n}\n\n.paraui-modal-zoom-leave {\n  animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);\n}\n\n.paraui-modal-fade-enter,\n.paraui-modal-fade-appear {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n\n.paraui-modal-fade-leave {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n\n.paraui-modal-fade-enter.paraui-modal-fade-enter-active,\n.paraui-modal-fade-appear.paraui-modal-fade-appear-active {\n  animation-name: parauiModalFadeIn;\n  animation-play-state: running;\n}\n\n.paraui-modal-fade-leave.paraui-modal-fade-leave-active {\n  animation-name: parauiModalFadeOut;\n  animation-play-state: running;\n  pointer-events: none;\n}\n\n.paraui-modal-fade-enter,\n.paraui-modal-fade-appear {\n  opacity: 0;\n  animation-timing-function: linear;\n}\n\n.paraui-modal-fade-leave {\n  animation-timing-function: linear;\n}\n\n@keyframes parauiModalZoomIn {\n  0% {\n    transform: scale(0.2);\n    opacity: 0;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n@keyframes parauiModalZoomOut {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.2);\n    opacity: 0;\n  }\n}\n@keyframes parauiModalFadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n@keyframes parauiModalFadeOut {\n  0% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n  }\n}";
-styleInject(css_248z);
-
-declare type ModalSize = 'sm' | 'md' | 'lg' | 'auto' | 'fullScreen';
-interface ModalProps {
-    /** 对话框是否可见 */
-    visible?: boolean;
-    /** 打开 */
-    open?: boolean;
-    /** 确定按钮 loading */
-    confirmLoading?: boolean;
-    /** 标题 */
-    title?: ReactNode;
-    /** 内容 */
-    children?: ReactNode;
-    /** 对话框头部 */
-    header?: ReactNode;
-    /** 隐藏对话框头部 */
-    hideHeader?: boolean;
-    /** 底部操作栏 */
-    actions?: ((buttons: ReactNode[]) => ReactNode[]) | ReactNode;
-    /** 底部内容 */
-    footer?: ((buttons: ReactNode[]) => ReactNode[]) | ReactNode;
-    /** 是否显示actions */
-    showActions?: boolean;
-    /** 显示取消按钮 */
+    /**显示取消按钮*/
     showCancel?: boolean;
-    /** 是否显示右上角的关闭按钮 */
-    closable?: boolean;
-    /** 点击确定回调 */
-    onOk?: (e?: React__default.MouseEvent<HTMLElement>) => void;
-    /** 点击模态框右上角叉、取消按钮,return false 不关闭 */
-    onCancel?: (e?: React__default.MouseEvent<HTMLElement>) => boolean | void;
-    afterClose?: () => void;
-    /** 大小 */
+    /**cls*/
+    className?: string;
+    /**大小*/
     size?: ModalSize;
-    /** 垂直居中 */
-    centered?: boolean;
-    /** 宽度 */
-    width?: string | number;
-    /** 确认按钮文字 */
-    okText?: ReactNode;
-    /** 确认按钮类型 */
-    okType?: string;
-    /** 取消按钮文字 */
-    cancelText?: ReactNode;
-    /** 点击蒙层是否允许关闭 */
-    maskClosable?: boolean;
+    /**禁用backdrop点击*/
     disableBackdropClick?: boolean;
-    /** 强制渲染 Modal */
-    forceRender?: boolean;
-    /** 确定按钮属性 */
-    okButtonProps?: ButtonProps;
-    /** 取消按钮属性 */
-    cancelButtonProps?: ButtonProps;
-    destroyOnClose?: boolean;
-    style?: React__default.CSSProperties;
-    wrapClassName?: string;
-    maskTransitionName?: string;
-    transitionName?: string;
-    className?: string;
-    getContainer?: string | HTMLElement | (() => HTMLElement) | false;
-    zIndex?: number;
-    bodyStyle?: React__default.CSSProperties;
-    maskStyle?: React__default.CSSProperties;
-    mask?: boolean;
-    /** 是否支持键盘esc关闭 */
-    keyboard?: boolean;
+    /**禁用esc键*/
     disableEscapeKeyDown?: boolean;
-    wrapProps?: any;
-    closeIcon?: ReactNode;
-    modalRender?: (node: ReactNode) => ReactNode;
-    focusTriggerAfterClose?: boolean;
-    /** 是否全屏 */
+    /**禁用强制焦点*/
+    disableEnforceFocus?: boolean;
+    /**是否全屏*/
     fullScreen?: boolean;
-    /** 自定义大小 */
-    customizeSize?: React__default.CSSProperties;
-    /** 内容宽度 */
+    /**自定义大小*/
+    customizeSize?: React.CSSProperties;
+    /**自定义大小 兼容customizeSize*/
+    style?: React.CSSProperties;
+    /**内容宽度*/
     contentWidth?: number | string;
-    /** 内容高度 */
+    /**内容高度*/
     contentHeight?: number | string;
-    /** 内容样式 */
-    contentStyle?: React__default.CSSProperties;
-    [name: string]: any;
+    /**内容样式*/
+    contentStyle?: React.CSSProperties;
 }
-declare const Modal: React__default.FC<ModalProps>;
-
-export { Confirm, ConfirmObject, Modal, ModalProps, Modal as default };
+export declare const Modal: FunctionComponent<ModalProps>;
+export { Confirm };
+export type { ConfirmObject };
+export default Modal;