@qsxy/element-plus-react 1.0.3 → 2.0.0

package/dist/Input/index.js

@@ -1,3 +1,4 @@
 export { default as InputRange } from "../Input/InputRange";
 export { default as Input } from "./Input";
-export { default as InputGroup } from "./InputGroup";
+export { default as InputGroup } from "./InputGroup";
+export { default as TextArea } from "./TextArea";

package/dist/Input/typings.d.ts

@@ -31,7 +31,7 @@ export type InputRef = {
 export type TextareaRef = {
     input: HTMLTextAreaElement;
 } & BaseInputRef;
-export interface InputProps extends FormControlBaseProps<string | number>, BaseProps, NativeProps, Omit<React.AllHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'size' | 'prefix' | 'type' | 'onInput' | 'onChange' | 'style' | 'children'> {
+export interface InputProps extends FormControlBaseProps<string | number>, BaseProps, NativeProps<'--el-input-text-color' | '--el-input-border' | '--el-input-hover-border' | '--el-input-focus-border' | '--el-input-transparent-border' | '--el-input-border-color' | '--el-input-border-radius' | '--el-input-bg-color' | '--el-input-icon-color' | '--el-input-placeholder-color' | '--el-input-hover-border-color' | '--el-input-clear-hover-color' | '--el-input-focus-border-color' | '--el-input-width' | '--el-input-height' | '--el-input-inner-height'>, Omit<React.AllHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'size' | 'prefix' | 'type' | 'onInput' | 'onChange' | 'style' | 'children'> {
     size?: TypeAttributes.Size;
     value?: string | number;
     /** 初始值 */
@@ -58,20 +58,12 @@ export interface InputProps extends FormControlBaseProps<string | number>, BaseP
     showPassword?: boolean;
     /** 是否纯文本模式，即无边框 */
     plain?: boolean;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
     /** 输入是否防抖动 */
     debounceInput?: boolean;
     /** 获取输入建议的防抖延时，单位为毫秒 */
     debounceTime?: number;
     /** input自定义内联样式 */
     innerStyle?: React.CSSProperties;
-    /** 范围选择时开始输入框的占位内容 */
-    startPlaceholder?: string;
-    /** 范围选择时结束输入框的占位内容 */
-    endPlaceholder?: string;
     /** 最大输入长度 */
     maxLength?: number;
     /** 原生属性，最小输入长度 */
@@ -79,7 +71,6 @@ export interface InputProps extends FormControlBaseProps<string | number>, BaseP
     /** 是否显示统计字数, 只在 type 为 'text' 或 'textarea' 的时候生效	 */
     showWordLimit?: boolean;
     /** 字数统计的位置，仅当 show-word-limit 为 true 时生效。 */
-    wordLimitPosition?: 'inside' | 'outside';
     /** 是否隐藏值 */
     hiddenValue?: boolean;
     /** 原生属性 autocomplete */
@@ -94,12 +85,6 @@ export interface InputProps extends FormControlBaseProps<string | number>, BaseP
     autofocus?: boolean;
     /** 原生属性 inputmode */
     inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
-    /** 容器的 role 属性 */
-    containerRole?: string;
-    /** 是否触发表单验证 */
-    validateEvent?: boolean;
-    /** 修饰符 */
-    modelModifiers?: ModelModifiers;
     /** 在点击由 clearable 属性生成的清空按钮时触发 */
     onClear?: (e: React.MouseEvent) => void;
     /** 在 Input 值改变时触发 */
@@ -126,10 +111,6 @@ export interface InputGroupProps extends BaseProps, NativeProps {
 export interface TextareaProps extends Omit<React.AllHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'size' | 'prefix' | 'type' | 'onInput' | 'onChange' | 'style' | 'children'>, FormControlBaseProps<ValueType>, BaseProps, NativeProps {
     /** 初始值 */
     defaultValue?: ValueType;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
     /** 是否纯文本模式，即无边框 */
     plain?: boolean;
     rows?: number;
@@ -148,6 +129,8 @@ export interface TextareaProps extends Omit<React.AllHTMLAttributes<HTMLInputEle
         minRows?: number;
         maxRows?: number;
     };
+    /** 是否可清空 */
+    clearable?: boolean;
     /** 在 Input 值改变时触发 */
     onChange?: (value: ValueType, event?: React.ChangeEvent) => void;
 }
@@ -178,14 +161,9 @@ export interface InputRangeProps<T = InputRangeValueType> extends Omit<FormContr
     clearable?: boolean;
     /** 是否纯文本模式，即无边框 */
     plain?: boolean;
-    /** 表单校验失败 */
-    error?: boolean;
-    /** 表单校验失败 */
-    warning?: boolean;
     /** 选择范围时的分隔符 */
     rangeSeparator?: string;
     /** 输入是否防抖动 */
-    debounceInput?: boolean;
     /** input自定义内联样式 */
     innerStyle?: React.CSSProperties;
     /** 范围选择时开始输入框的占位内容 */

package/dist/InputNumber/InputNumber.js

@@ -1,5 +1,5 @@
 var _templateObject, _templateObject2;
-var _excluded = ["name", "id", "max", "min", "step", "precision", "stepStrictly", "valueOnClear", "inputmode", "align", "disabledScientific", "controls", "controlsPosition", "onChange", "onFocus", "onBlur", "classPrefix", "prefix", "suffix", "placeholder", "warning", "error", "maxLength", "minLength", "decreaseIcon", "increaseIcon"];
+var _excluded = ["name", "id", "max", "min", "step", "precision", "stepStrictly", "valueOnClear", "inputmode", "align", "disabledScientific", "controls", "controlsPosition", "onChange", "onFocus", "onBlur", "classPrefix", "prefix", "suffix", "placeholder", "maxLength", "minLength", "decreaseIcon", "increaseIcon"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -10,6 +10,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useMount, useUnmount } from 'ahooks';
 import classNames from 'classnames';
 import isNil from 'lodash/isNil';
 import omit from 'lodash/omit';
@@ -34,7 +35,6 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     min: Number.MIN_SAFE_INTEGER,
     placeholder: '',
     controls: true,
-    controlsPosition: '',
     stepStrictly: false,
     valueOnClear: null,
     // validateEvent: true,
@@ -63,8 +63,6 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     prefix = _props.prefix,
     suffix = _props.suffix,
     placeholder = _props.placeholder,
-    warning = _props.warning,
-    error = _props.error,
     maxLength = _props.maxLength,
     minLength = _props.minLength,
     decreaseIcon = _props.decreaseIcon,
@@ -98,6 +96,9 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     _useState2 = _slicedToArray(_useState, 2),
     userInput = _useState2[0],
     setUserInput = _useState2[1];
+  var userInputRef = useRef(null);
+  var isMouseDown = useRef(false);
+  var timerRef = useRef(null);
 
   // Computed properties equivalent
   var controlsAtRight = useMemo(function () {
@@ -138,10 +139,16 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
       return Math.max(getPrecision(value), stepPrecision);
     }
   }, [getPrecision, step, props.precision, precisionProp, value]);
-  var minDisabled = useMemo(function () {
+  var minDisabled = useCallback(function () {
+    if (isMouseDown.current) {
+      return userInputRef.current !== null && Number(userInputRef.current) <= minProp;
+    }
     return typeof value === 'number' && value <= minProp;
   }, [value, minProp]);
-  var maxDisabled = useMemo(function () {
+  var maxDisabled = useCallback(function () {
+    if (isMouseDown.current) {
+      return userInputRef.current !== null && Number(userInputRef.current) >= maxProp;
+    }
     return typeof value === 'number' && value >= maxProp;
   }, [value, maxProp]);
   var displayValue = useMemo(function () {
@@ -249,6 +256,7 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
       return;
     }
     setUserInput(null);
+    userInputRef.current = null;
     if (oldVal === newVal && val) {
       return;
     }
@@ -258,9 +266,9 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     }
 
     // Form validation would go here if needed
-  }, [value, verifyValue, setValue, setUserInput, onChange]);
+  }, [value, verifyValue, setValue, onChange]);
   var increase = useCallback(function () {
-    if (props.readOnly || disabled || maxDisabled) {
+    if (props.readOnly || disabled || maxDisabled()) {
       return;
     }
     var val = Number(displayValue) || 0;
@@ -269,7 +277,7 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     onChange === null || onChange === void 0 || onChange(newVal);
   }, [props.readOnly, disabled, maxDisabled, displayValue, ensurePrecision, setCurrentValue, onChange]);
   var decrease = useCallback(function () {
-    if (props.readOnly || disabled || minDisabled) {
+    if (props.readOnly || disabled || minDisabled()) {
       return;
     }
     var val = Number(displayValue) || 0;
@@ -303,6 +311,7 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
   }, [decrease, disabledScientific, increase]);
   var handleInput = useCallback(function (inputVal) {
     setUserInput(inputVal);
+    userInputRef.current = inputVal;
     var newVal = inputVal === '' ? null : Number(inputVal);
     onChange === null || onChange === void 0 || onChange(newVal);
     setCurrentValue(newVal, false);
@@ -313,6 +322,7 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     // setCurrentValue(newVal, true);
     if (typeof newVal === 'number' && !Number.isNaN(newVal) || inputVal === '') {
       setUserInput(inputVal);
+      userInputRef.current = inputVal;
       onChange === null || onChange === void 0 || onChange(newVal);
       // setCurrentValue(newVal);
     }
@@ -329,12 +339,13 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
       inputRef.current.input.current.value = '';
     }
     onBlur === null || onBlur === void 0 || onBlur(event);
-    if (isNotEmpty(userInput)) {
-      setCurrentValue(String(userInput), false);
+    if (isNotEmpty(userInputRef.current)) {
+      setCurrentValue(String(userInputRef.current), true);
       setUserInput(null);
+      userInputRef.current = null;
     }
     // Form validation would go here
-  }, [value, onBlur, setCurrentValue, userInput]);
+  }, [value, onBlur, setCurrentValue, userInputRef]);
 
   // Effects
   useEffect(function () {
@@ -359,9 +370,9 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
       innerInput.setAttribute('aria-disabled', String(disabled));
 
       // Add wheel event listener
-      var handleWheel = function handleWheel(e) {
-        if (document.activeElement === e.target) {
-          e.preventDefault();
+      var handleWheel = function handleWheel(event) {
+        if (document.activeElement === event.target) {
+          event.preventDefault();
         }
       };
       innerInput.addEventListener('wheel', handleWheel, {
@@ -372,6 +383,24 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
       };
     }
   }, [maxProp, minProp, value, disabled]);
+  var handleMouseUp = useCallback(function () {
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+      clearInterval(timerRef.current);
+    }
+    if (isMouseDown.current) {
+      setCurrentValue(userInputRef.current, false);
+      onChange === null || onChange === void 0 || onChange(userInputRef.current);
+      userInputRef.current = null;
+      isMouseDown.current = false;
+    }
+  }, [onChange, setCurrentValue, userInputRef, isMouseDown]);
+  useMount(function () {
+    document.addEventListener('mouseup', handleMouseUp);
+  });
+  useUnmount(function () {
+    document.removeEventListener('mouseup', handleMouseUp);
+  });
 
   // Ref methods
   useImperativeHandle(ref, function () {
@@ -401,12 +430,12 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     style: props.style,
     ref: containerRef
   }, tooltipEvents, {
-    onDragStart: function onDragStart(e) {
-      return e.preventDefault();
+    onDragStart: function onDragStart(event) {
+      return event.preventDefault();
     }
   }), controls && /*#__PURE__*/React.createElement("span", {
     className: classNames(e(_templateObject || (_templateObject = _taggedTemplateLiteral(["decrease"]))), is({
-      disabled: minDisabled
+      disabled: minDisabled()
     })),
     role: "button",
     "aria-label": t('el.inputNumber.decrease', {
@@ -416,13 +445,25 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     onKeyDown: function onKeyDown(event) {
       return event.key === 'Enter' && decrease();
     },
-    onClick: decrease
+    onMouseDown: function onMouseDown() {
+      decrease();
+      timerRef.current = setTimeout(function () {
+        isMouseDown.current = true;
+        timerRef.current = setInterval(function () {
+          var val = userInputRef.current !== null ? Number(userInputRef.current) || 0 : Number(displayValue) || 0;
+          var newVal = verifyValue(ensurePrecision(val, -1));
+          setUserInput(!isUndefined(precisionProp) ? newVal.toFixed(precisionProp) : newVal);
+          userInputRef.current = newVal;
+        }, 100);
+      }, 500);
+    }
+    // onClick={decrease}
   }, decreaseIcon || /*#__PURE__*/React.createElement(Icon, {
     name: controlsAtRight ? 'angle-down' : 'minus',
     prefix: controlsAtRight ? 'fal' : 'far'
   })), controls && /*#__PURE__*/React.createElement("span", {
     className: classNames(e(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["increase"]))), is({
-      disabled: maxDisabled
+      disabled: maxDisabled()
     })),
     role: "button",
     "aria-label": t('el.inputNumber.increase', {
@@ -432,7 +473,19 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     onKeyDown: function onKeyDown(event) {
       return event.key === 'Enter' && increase();
     },
-    onClick: increase
+    onMouseDown: function onMouseDown() {
+      increase();
+      timerRef.current = setTimeout(function () {
+        isMouseDown.current = true;
+        timerRef.current = setInterval(function () {
+          var val = userInputRef.current !== null ? Number(userInputRef.current) || 0 : Number(displayValue) || 0;
+          var newVal = verifyValue(ensurePrecision(val));
+          setUserInput(!isUndefined(precisionProp) ? newVal.toFixed(precisionProp) : newVal);
+          userInputRef.current = newVal;
+        }, 100);
+      }, 500);
+    }
+    // onClick={increase}
   }, increaseIcon || /*#__PURE__*/React.createElement(Icon, {
     name: controlsAtRight ? 'angle-up' : 'plus',
     prefix: controlsAtRight ? 'fal' : 'far'
@@ -446,8 +499,6 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     disabled: disabled,
     readOnly: props.readOnly,
     size: size,
-    error: error,
-    warning: warning,
     clearable: false,
     onBlur: handleBlur,
     onFocus: handleFocus

package/dist/InputNumber/typings.d.ts

@@ -26,10 +26,6 @@ export interface InputNumberProps<V = ValueType> extends Omit<FormControlBasePro
     onChange?: (currentValue: number | string, oldValue?: number | string) => void;
     /** 样式前缀 */
     prefixCls?: string;
-    /** 表单校验错误提示 */
-    error?: boolean;
-    /** 表单校验警告提示 */
-    warning?: boolean;
     /** 输入框头部内容 */
     prefix?: React.ReactElement<any> | string | number;
     /** 输入框尾部内容 */

package/dist/Menu/Menu.js

@@ -18,7 +18,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import classNames from 'classnames';
 import { addClass, removeClass } from 'dom-lib';
-import { pick } from 'lodash';
+import pick from 'lodash/pick';
 import React, { Children, forwardRef, useCallback, useImperativeHandle, useRef, useState } from 'react';
 import { More } from "../Icon/IconList/More";
 import { mergeDefaultProps } from "../Util";

package/dist/Menu/typings.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import { IconName } from '../Icon';
 import { BaseProps, NativeProps } from '../types/common';
 export interface MenuRef {
     open: MenuOpenEvent;
@@ -49,27 +48,18 @@ export interface MenuProps extends BaseProps, NativeProps<'--el-menu-active-colo
 export interface SubMenuProps extends BaseProps, NativeProps {
     /** 唯一标志 */
     index: string;
+    /** 标题内容 */
     title: string | React.ReactElement;
     /** 为 popper 添加类名 */
     popperClass?: string;
+    /** 是否禁用 */
+    disabled?: boolean;
     /** 子菜单出现之前的延迟，(继承 menu 的 `showTimeout` 配置) */
     showTimeout?: number;
     /** 子菜单消失之前的延迟，(继承 menu 的 `hideTimeout` 配置) */
     hideTimeout?: number;
-    /** 是否禁用 */
-    disabled?: boolean;
-    /** 是否将弹出菜单挂载到 body 上，第一级 SubMenu 默认值为 true，其他 SubMenus 的值为 false */
-    appendToBody?: boolean;
     /** 弹出窗口的偏移量 (覆盖 `popper`的菜单) */
     popperOffset?: number;
-    /** 父菜单展开且子菜单关闭时的图标， `expandCloseIcon` 和 `expandOpenIcon` 需要一起配置才能生效 */
-    expandCloseIcon?: IconName | React.ReactElement;
-    /** 父菜单展开且子菜单打开时的图标， `expandOpenIcon` 和 `expandCloseIcon` 需要一起配置才能生效 */
-    expandOpenIcon?: IconName | React.ReactElement;
-    /** 父菜单收起且子菜单关闭时的图标， `collapseCloseIcon` 和 `collapseOpenIcon` 需要一起配置才能生效 */
-    collapseCloseIcon?: IconName | React.ReactElement;
-    /** 父菜单收起且子菜单打开时的图标， `collapseOpenIcon` 和 `collapseCloseIcon` 需要一起配置才能生效 */
-    collapseOpenIcon?: IconName | React.ReactElement;
 }
 export interface MenuItemProps extends BaseProps, NativeProps {
     /** 唯一标志 */

package/dist/Message/index.js

@@ -24,9 +24,11 @@ export var Message = function Message() {
   }
   var options = opts;
   var verticalOffset = typeof opts !== 'string' && ! /*#__PURE__*/isValidElement(opts) ? ((_opts = opts) === null || _opts === void 0 ? void 0 : _opts.offset) || 20 : 20;
-  instances.forEach(function (inst) {
-    var _inst$current$el$curr;
-    verticalOffset += (((_inst$current$el$curr = inst.current.el.current) === null || _inst$current$el$curr === void 0 ? void 0 : _inst$current$el$curr.offsetHeight) || 52) + 16;
+  instances.filter(function (inst) {
+    return inst.current;
+  }).forEach(function (inst) {
+    var _inst$current;
+    verticalOffset += (((_inst$current = inst.current) === null || _inst$current === void 0 || (_inst$current = _inst$current.el.current) === null || _inst$current === void 0 ? void 0 : _inst$current.offsetHeight) || 52) + 16;
   });
   verticalOffset += 16;
   var id = 'message_' + seed++;

package/dist/MessageBox/MessageBox.js

@@ -1,6 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-var _excluded = ["title", "message", "type", "icon", "width", "callback", "showClose", "beforeClose", "showCancelButton", "showConfirmButton", "cancelButtonText", "cancelButtonClass", "confirmButtonClass", "buttonSize", "buttonPosition", "draggable", "overflow", "showInput", "inputType", "inputPlaceholder", "inputPattern", "inputErrorMessage", "inputValidator", "distinguishCancelAndClose", "classPrefix", "className", "style", "padding", "roundButton", "dangerouslyUseHTMLString"];
+var _excluded = ["title", "message", "type", "icon", "width", "callback", "showClose", "beforeClose", "showCancelButton", "showConfirmButton", "cancelButtonText", "cancelButtonClass", "confirmButtonClass", "buttonSize", "buttonPosition", "draggable", "overflow", "showInput", "inputType", "inputPlaceholder", "inputPattern", "inputErrorMessage", "inputValidator", "distinguishCancelAndClose", "classPrefix", "className", "style", "roundButton", "dangerouslyUseHTMLString"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -86,7 +86,6 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     classPrefix = _options$classPrefix === void 0 ? 'message-box' : _options$classPrefix,
     className = options.className,
     style = options.style,
-    padding = options.padding,
     roundButton = options.roundButton,
     dangerouslyUseHTMLString = options.dangerouslyUseHTMLString,
     rest = _objectWithoutProperties(options, _excluded);
@@ -241,7 +240,8 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     ref: containerRef,
     classPrefix: classPrefix,
     visible: visible,
-    className: classNames('is-message-box', className)
+    modalClass: "is-message-box",
+    className: className
     // @ts-ignore
     ,
     style: _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, "--".concat(namespace, "-messagebox-width"), addUnit(width))),
@@ -253,19 +253,33 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     beforeClose: function beforeClose() {
       return handleAction('close');
     }
-  }, transitionProps), dangerouslyUseHTMLString ? /*#__PURE__*/React.createElement(Dialog.body, {
-    classPrefix: classPrefix,
-    padding: padding
-  }, /*#__PURE__*/React.createElement("div", {
+  }, transitionProps, {
+    unmountOnExit: false,
+    transitionConfig: 'fade-in-linear',
+    footer: showCancelButton || showConfirmButton ? /*#__PURE__*/React.createElement(React.Fragment, null, showCancelButton && /*#__PURE__*/React.createElement(Button, {
+      className: cancelButtonClass,
+      size: buttonSize,
+      round: roundButton,
+      onClick: function onClick() {
+        return handleAction('cancel');
+      }
+    }, cancelButtonText), showConfirmButton && /*#__PURE__*/React.createElement(Button, {
+      className: confirmButtonClass,
+      type: "primary",
+      size: buttonSize,
+      round: roundButton,
+      loading: confirmButtonLoading,
+      onClick: function onClick() {
+        return handleAction('confirm');
+      }
+    }, confirmButtonText)) : null
+  }), dangerouslyUseHTMLString ? /*#__PURE__*/React.createElement("div", {
     className: e(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["container"])))
   }, iconContent, /*#__PURE__*/React.createElement("div", {
     dangerouslySetInnerHTML: {
       __html: message
     }
-  }))) : /*#__PURE__*/React.createElement(Dialog.body, {
-    classPrefix: classPrefix,
-    padding: padding
-  }, /*#__PURE__*/React.createElement("div", {
+  })) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: e(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["container"])))
   }, iconContent, /*#__PURE__*/React.createElement("div", {
     className: e(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["message"])))
@@ -273,8 +287,9 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     className: e(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["input"])))
   }, /*#__PURE__*/React.createElement(Input, {
     value: inputValue,
-    type: inputType,
-    error: validateError,
+    type: inputType
+    // error={validateError}
+    ,
     placeholder: inputPlaceholder,
     onChange: function onChange(value) {
       setInputValue(value);
@@ -282,26 +297,7 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
     }
   }), validateError && /*#__PURE__*/React.createElement("div", {
     className: e(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["errormsg"])))
-  }, editorErrorMessage))), (showCancelButton || showConfirmButton) && /*#__PURE__*/React.createElement(Dialog.footer, {
-    classPrefix: classPrefix,
-    position: buttonPosition
-  }, showCancelButton && /*#__PURE__*/React.createElement(Button, {
-    className: cancelButtonClass,
-    size: buttonSize,
-    round: roundButton,
-    onClick: function onClick() {
-      return handleAction('cancel');
-    }
-  }, cancelButtonText), showConfirmButton && /*#__PURE__*/React.createElement(Button, {
-    className: confirmButtonClass,
-    type: "primary",
-    size: buttonSize,
-    round: roundButton,
-    loading: confirmButtonLoading,
-    onClick: function onClick() {
-      return handleAction('confirm');
-    }
-  }, confirmButtonText)));
+  }, editorErrorMessage))));
 }));
 MessageBox.displayName = 'ElMessageBox';
 export default MessageBox;

package/dist/MessageBox/typings.d.ts

@@ -44,7 +44,6 @@ export interface MessageBoxProps extends BaseProps, NativeProps, AnimationEventP
     /** 是否将取消（点击取消按钮）与关闭（点击关闭按钮或遮罩层、按下 Esc 键）进行区分 */
     distinguishCancelAndClose?: boolean;
     /** 内容区域padding */
-    padding?: string | number;
     /** 是否在 MessageBox 出现时将 body 滚动锁定 */
     lockScroll?: boolean;
     /** 是否显示输入框 */

package/dist/Notification/typings.d.ts

@@ -32,7 +32,7 @@ export interface NotificationProps extends BaseProps, NativeProps, AnimationEven
     showClose?: boolean;
     /** 关闭时的回调函数 */
     onClose?: () => void;
-    /**  */
+    /** 自定义图标类名，用于自定义图标样式 */
     iconClass?: string;
     /**  */
     id?: string;

package/dist/PageHeader/PageHeader.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { PageHeaderProps } from './typings';
+/**
+ * @description PageHeader 页面头部组件
+ * 用于展示页面的标题、面包屑和操作区域
+ */
+declare const PageHeader: React.MemoExoticComponent<React.ForwardRefExoticComponent<PageHeaderProps & React.RefAttributes<HTMLDivElement>>>;
+export default PageHeader;

package/dist/PageHeader/PageHeader.js

@@ -0,0 +1,91 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["icon", "title", "content", "onBack", "breadcrumb", "extra", "className", "style", "children"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import classNames from 'classnames';
+import React, { forwardRef, memo, useCallback, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useConfigProvider } from "../ConfigProvider/ConfigProviderContext";
+import Divider from "../Divider/Divider";
+import { useClassNames } from "../hooks";
+import Icon from "../Icon/Icon";
+/**
+ * @description PageHeader 页面头部组件
+ * 用于展示页面的标题、面包屑和操作区域
+ */
+var PageHeader = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref) {
+  var _props$icon = props.icon,
+    icon = _props$icon === void 0 ? 'arrow-left' : _props$icon,
+    title = props.title,
+    _props$content = props.content,
+    content = _props$content === void 0 ? '' : _props$content,
+    onBack = props.onBack,
+    breadcrumb = props.breadcrumb,
+    extra = props.extra,
+    className = props.className,
+    style = props.style,
+    children = props.children,
+    rest = _objectWithoutProperties(props, _excluded);
+  var _useClassNames = useClassNames('page-header'),
+    b = _useClassNames.b,
+    e = _useClassNames.e,
+    m = _useClassNames.m;
+  var _useConfigProvider = useConfigProvider(),
+    locale = _useConfigProvider.locale;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+
+  /**
+   * @description 处理返回按钮点击事件
+   */
+  var handleClick = useCallback(function () {
+    onBack === null || onBack === void 0 || onBack();
+  }, [onBack]);
+  var hasBreadcrumb = useMemo(function () {
+    return !!breadcrumb;
+  }, [breadcrumb]);
+  var hasExtra = useMemo(function () {
+    return !!extra;
+  }, [extra]);
+  var hasContent = useMemo(function () {
+    return !!children;
+  }, [children]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: ref,
+    className: classNames(b(), e('contentful', hasContent), _defineProperty({}, m('has-breadcrumb'), hasBreadcrumb), _defineProperty({}, m('has-extra'), hasExtra), className),
+    style: style
+  }, rest), hasBreadcrumb && /*#__PURE__*/React.createElement("div", {
+    className: e('breadcrumb')
+  }, breadcrumb), /*#__PURE__*/React.createElement("div", {
+    className: e('header')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: e('left')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: e('back'),
+    role: "button",
+    tabIndex: 0,
+    onClick: handleClick
+  }, icon && /*#__PURE__*/React.createElement("div", {
+    className: e('icon')
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: icon
+  })), /*#__PURE__*/React.createElement("div", {
+    className: e('title')
+  }, title || t('el.pageHeader.title', {
+    lng: locale
+  }))), /*#__PURE__*/React.createElement(Divider, {
+    direction: "vertical"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: e('content')
+  }, content)), hasExtra && /*#__PURE__*/React.createElement("div", {
+    className: e('extra')
+  }, extra)), hasContent && /*#__PURE__*/React.createElement("div", {
+    className: e('main')
+  }, children));
+}));
+PageHeader.displayName = 'ElPageHeader';
+export default PageHeader;

package/dist/PageHeader/index.d.ts

@@ -0,0 +1,2 @@
+export { default as PageHeader } from './PageHeader';
+export type { PageHeaderProps } from './typings';

package/dist/PageHeader/index.js

@@ -0,0 +1 @@
+export { default as PageHeader } from "./PageHeader";