@qsxy/element-plus-react 1.0.2 → 1.0.3

package/dist/Alert/Alert.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { AlertProps } from './typings';
+declare const Alert: {
+    (props: AlertProps): React.JSX.Element;
+    displayName: string;
+};
+export default Alert;

package/dist/Alert/Alert.js

@@ -0,0 +1,98 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+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(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import classNames from 'classnames';
+import React, { useMemo, useState } from 'react';
+import Icon from "../Icon/Icon";
+import Transition from "../Transition/Transition";
+import { mergeDefaultProps } from "../Util";
+import { TypeComponentsMap } from "../config/Constants";
+import { useClassNames } from "../hooks";
+var Alert = function Alert(props) {
+  props = mergeDefaultProps({
+    type: 'info',
+    closable: true,
+    effect: 'light'
+  }, props);
+  var _props = props,
+    title = _props.title,
+    description = _props.description,
+    type = _props.type,
+    closable = _props.closable,
+    closeText = _props.closeText,
+    showIcon = _props.showIcon,
+    center = _props.center,
+    effect = _props.effect,
+    onClose = _props.onClose,
+    icon = _props.icon,
+    children = _props.children,
+    className = _props.className,
+    style = _props.style;
+  var _useClassNames = useClassNames('alert'),
+    b = _useClassNames.b,
+    e = _useClassNames.e,
+    m = _useClassNames.m,
+    is = _useClassNames.is;
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
+  var nodeRef = React.useRef(null);
+  var hasDesc = useMemo(function () {
+    if (description) {
+      return true;
+    }
+    if (children) {
+      return React.Children.toArray(children).some(function (child) {
+        return ! /*#__PURE__*/React.isValidElement(child);
+      });
+    }
+    return false;
+  }, [description, children]);
+  var handleClose = function handleClose(evt) {
+    setVisible(false);
+    onClose === null || onClose === void 0 || onClose(evt.nativeEvent);
+  };
+  return /*#__PURE__*/React.createElement(Transition, {
+    visible: visible,
+    name: b(_templateObject || (_templateObject = _taggedTemplateLiteral(["fade"]))),
+    duration: 300,
+    nodeRef: nodeRef,
+    display: "flex"
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: nodeRef,
+    className: classNames(b(), m(type), is({
+      center: center
+    }, effect), className),
+    role: "alert",
+    style: style
+  }, showIcon && (icon || TypeComponentsMap[type]) && /*#__PURE__*/React.createElement(Icon, {
+    name: icon || TypeComponentsMap[type],
+    prefix: "fas",
+    className: classNames(e('icon'), is({
+      big: hasDesc
+    }))
+  }), /*#__PURE__*/React.createElement("div", {
+    className: e(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["content"])))
+  }, title && /*#__PURE__*/React.createElement("span", {
+    className: classNames(e(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["title"]))), {
+      'with-description': hasDesc
+    })
+  }, title), hasDesc && /*#__PURE__*/React.createElement("p", {
+    className: e(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["description"])))
+  }, description), closable && /*#__PURE__*/React.createElement(React.Fragment, null, closeText ? /*#__PURE__*/React.createElement("div", {
+    className: classNames(e(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["close-btn"]))), is('customed')),
+    onClick: handleClose
+  }, closeText) : /*#__PURE__*/React.createElement(Icon, {
+    name: "xmark",
+    className: e(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["close-btn"]))),
+    onClick: handleClose
+  })))));
+};
+Alert.displayName = 'ElAlert';
+export default Alert;

package/dist/Alert/index.d.ts

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

package/dist/Alert/index.js

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

package/dist/Alert/typings.d.ts

@@ -0,0 +1,45 @@
+import { ReactElement } from 'react';
+import { IconName } from '../Icon/typings';
+import { BaseProps, NativeProps } from '../types/common';
+export interface AlertProps extends BaseProps, NativeProps {
+    /**
+     * Alert 标题。
+     */
+    title?: string | ReactElement;
+    /**
+     * 描述性文本。
+     */
+    description?: string;
+    /**
+     * Alert 类型。
+     */
+    type?: 'primary' | 'success' | 'warning' | 'error' | 'info';
+    /**
+     * 是否可关闭。
+     */
+    closable?: boolean;
+    /**
+     * 替换关闭按钮的文本。
+     */
+    closeText?: string;
+    /**
+     * 是否显示图标。
+     */
+    showIcon?: boolean;
+    /**
+     * 是否将内容居中。
+     */
+    center?: boolean;
+    /**
+     * 主题样式
+     */
+    effect?: 'light' | 'dark';
+    /**
+     * 图标。
+     */
+    icon?: IconName;
+    /**
+     * 关闭时的回调函数。
+     */
+    onClose?: (evt: MouseEvent) => void;
+}

package/dist/Alert/typings.js

@@ -0,0 +1 @@
+export {};

package/dist/Card/Card.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;
-var _excluded = ["header", "footer", "bodyStyle", "shadow", "classPrefix"];
+var _excluded = ["header", "footer", "bodyStyle", "shadow", "classPrefix", "className", "style"];
 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 _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; }
@@ -28,6 +28,8 @@ var Card = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref) {
     shadow = _props.shadow,
     _props$classPrefix = _props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'card' : _props$classPrefix,
+    className = _props.className,
+    style = _props.style,
     rest = _objectWithoutProperties(_props, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     b = _useClassNames.b,
@@ -35,8 +37,8 @@ var Card = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref) {
     is = _useClassNames.is;
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: ref,
-    className: classNames(b(), is(_defineProperty({}, "".concat(shadow, "-shadow"), ['always', 'hover'].includes(shadow))), props.className),
-    style: props.style
+    className: classNames(b(), is(_defineProperty({}, "".concat(shadow, "-shadow"), ['always', 'hover'].includes(shadow))), className),
+    style: style
   }, rest), header && /*#__PURE__*/React.createElement("div", {
     className: e(_templateObject || (_templateObject = _taggedTemplateLiteral(["header"])))
   }, header), /*#__PURE__*/React.createElement("div", {

package/dist/Cascader/useCascader.d.ts

@@ -1,4 +1,3 @@
-import { Key } from '../Tree';
 import { CascaderProps, OptionNode } from './typings';
 export declare const useCascader: (initialData: object[], props: CascaderProps, value: string[] | string[][]) => {
     /** 最高层级 */
@@ -70,19 +69,6 @@ export declare const useCascader: (initialData: object[], props: CascaderProps,
      * @returns
      */
     getDataType: (level: number) => any;
-    /**
-     * 获取扩展key
-     * @param level 层级
-     * @returns
-     */
-    getExpandedKeys: (level: number) => Key[];
-    /**
-     * 设置扩展key
-     * @param level 层级
-     * @param keys
-     * @returns
-     */
-    setExpandedKeys: (level: number, keys: Key[]) => void;
     handleSearch: (searchText: string) => OptionNode[][];
     resetNodes: () => void;
 };

package/dist/Cascader/useCascader.js

@@ -61,7 +61,7 @@ export var useCascader = function useCascader(initialData, props, value) {
   // 选中的节点组（多选）
   var checkedNodes = useRef([]);
   // 树组件扩展keys
-  var expandKeys = useRef({});
+  // const expandKeys = useRef<Record<string, Key[]>>({});
 
   /**
    * 初始化时分离不同层级的数据
@@ -493,25 +493,24 @@ export var useCascader = function useCascader(initialData, props, value) {
     return lazy && dataTypes[level];
   }, [dataTypes, lazy]);
 
-  /**
-   * 获取扩展key
-   * @param level 层级
-   * @returns
-   */
-  var getExpandedKeys = useCallback(function (level) {
-    var _expandKeys$current;
-    return (_expandKeys$current = expandKeys.current["level".concat(level)]) !== null && _expandKeys$current !== void 0 ? _expandKeys$current : [];
-  }, []);
+  // /**
+  //  * 获取扩展key
+  //  * @param level 层级
+  //  * @returns
+  //  */
+  // const getExpandedKeys = useCallback((level: number): Key[] => {
+  //     return expandKeys.current[`level${level}`] ?? [];
+  // }, []);
 
-  /**
-   * 设置扩展key
-   * @param level 层级
-   * @param keys
-   * @returns
-   */
-  var setExpandedKeys = useCallback(function (level, keys) {
-    expandKeys.current["level".concat(level)] = keys;
-  }, []);
+  // /**
+  //  * 设置扩展key
+  //  * @param level 层级
+  //  * @param keys
+  //  * @returns
+  //  */
+  // const setExpandedKeys = useCallback((level: number, keys: Key[]) => {
+  //     expandKeys.current[`level${level}`] = keys;
+  // }, []);
 
   /** 搜索 */
   var handleSearch = useCallback(function (searchText) {
@@ -758,19 +757,21 @@ export var useCascader = function useCascader(initialData, props, value) {
      * @returns
      */
     getDataType: getDataType,
-    /**
-     * 获取扩展key
-     * @param level 层级
-     * @returns
-     */
-    getExpandedKeys: getExpandedKeys,
-    /**
-     * 设置扩展key
-     * @param level 层级
-     * @param keys
-     * @returns
-     */
-    setExpandedKeys: setExpandedKeys,
+    // /**
+    //  * 获取扩展key
+    //  * @param level 层级
+    //  * @returns
+    //  */
+    // getExpandedKeys,
+
+    // /**
+    //  * 设置扩展key
+    //  * @param level 层级
+    //  * @param keys
+    //  * @returns
+    //  */
+    // setExpandedKeys,
+
     handleSearch: handleSearch,
     resetNodes: resetNodes
   };

package/dist/Checkbox/Checkbox.js

@@ -101,6 +101,7 @@ var Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref)
         checked: checked,
         disabled: disabled
       }), m(_defineProperty({}, size, size)), className),
+      style: props.style,
       ref: containerRef
     }, tooltipEvents, {
       onClick: onClick
@@ -129,10 +130,10 @@ var Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref)
         checked: checked,
         disabled: disabled
       }))
-    }), /*#__PURE__*/React.createElement("span", {
+    }), children && /*#__PURE__*/React.createElement("span", {
       className: e(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["label"])))
     }, children));
-  }, [b, checked, children, className, disabled, e, handleChange, htmlInputProps, indeterminate, is, m, name, onCheckboxClick, onClick, prevent, readOnly, size, tooltipEvents, value]);
+  }, [b, checked, children, className, disabled, e, handleChange, htmlInputProps, indeterminate, is, m, name, onCheckboxClick, onClick, prevent, props.style, readOnly, size, tooltipEvents, value]);
   return title ? /*#__PURE__*/React.createElement(Tooltip, {
     content: title
   }, main) : main;

package/dist/ConfigProvider/ConfigProvider.js

@@ -7,8 +7,8 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 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 React, { useEffect } from 'react';
-import { isEmpty, mergeDefaultProps } from "../Util";
+import React from 'react';
+import { mergeDefaultProps } from "../Util";
 import ConfigProviderContext from "./ConfigProviderContext";
 var ConfigProvider = function ConfigProvider(props) {
   props = mergeDefaultProps({
@@ -38,28 +38,6 @@ var ConfigProvider = function ConfigProvider(props) {
     children = _props.children,
     locale = _props.locale,
     values = _objectWithoutProperties(_props, _excluded);
-  useEffect(function () {
-    // const configs = localStorage.getItem('__el__config__provider__');
-    // let msgConfig = null;
-    // if (isEmpty(configs) || JSON.parse(configs).length === 0) {
-    //     msgConfig = [props.message];
-    //     localStorage.setItem('__el__config__provider__', JSON.stringify([props.message]));
-    // } else {
-    //     msgConfig = [...JSON.parse(configs), props.message];
-    //     localStorage.setItem('__el__config__provider__', JSON.stringify(msgConfig));
-    // }
-
-    var msgConfig = localStorage.getItem('__el__message__config__provider__');
-    if (isEmpty(msgConfig) || Object.keys(JSON.parse(msgConfig)).length === 0) {
-      localStorage.setItem('__el__message__config__provider__', JSON.stringify(props.message));
-    } else {
-      localStorage.setItem('__el__message__config__provider__', JSON.stringify(mergeDefaultProps(JSON.parse(msgConfig), props.message)));
-    }
-
-    // return () => {
-    //     localStorage.removeItem('__el__message_config__provider');
-    // };
-  });
   return /*#__PURE__*/React.createElement(ConfigProviderContext.Provider, {
     value: _objectSpread(_objectSpread({}, values), {}, {
       locale: locale === 'zh-cn' ? 'zh-CN' : locale

package/dist/ConfigProvider/ConfigProviderContext.js

@@ -2,7 +2,7 @@ import { createContext, useContext } from 'react';
 var ConfigProviderContext = /*#__PURE__*/createContext({
   // message: { max: Infinity },
   inputNumber: {
-    controlsPositionRight: false
+    controlsPosition: ''
   },
   locale: 'en',
   popper: {}

package/dist/ConfigProvider/typings.d.ts

@@ -39,7 +39,7 @@ export interface ConfigProviderProps extends BaseProps {
     /** 对数字输入框进行配置 */
     inputNumber?: {
         /** 控制按钮位置 */
-        controlsPositionRight?: boolean;
+        controlsPosition?: '' | 'right';
         max?: number;
         min?: number;
     };

package/dist/Container/Main.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-declare const Main: React.ForwardRefExoticComponent<import("..").BaseProps<import("../types/common").ComponentChildren> & import("..").NativeProps & React.RefAttributes<HTMLDivElement>>;
+declare const Main: React.ForwardRefExoticComponent<import("..").BaseProps<import("../types/common").ComponentChildren> & import("..").NativeProps<"--el-main-padding"> & React.RefAttributes<HTMLDivElement>>;
 export default Main;

package/dist/Container/typings.d.ts

@@ -20,7 +20,7 @@ export type HeaderProps = BaseProps & NativeProps<'--el-header-padding' | '--el-
      */
     height?: string | number;
 };
-export type MainProps = BaseProps & NativeProps;
+export type MainProps = BaseProps & NativeProps<'--el-main-padding'>;
 export type FooterProps = BaseProps & NativeProps<'--el-footer-padding' | '--el-footer-height'> & {
     /**
      * 底栏高度

package/dist/Dialog/Dialog.js

@@ -14,7 +14,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 React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useRef } from 'react';
+import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import { createPortal } from 'react-dom';
 import Transition from "../Transition/Transition";
 import { PopupManager, addUnit } from "../Util";
@@ -73,6 +73,9 @@ function InternalElDialog(props, ref) {
   // const backdropRef = useRef<HTMLDivElement>(null);
   var overlayRef = useRef(null);
   var headerRef = useRef(null);
+  var nextZIndex = useMemo(function () {
+    return zIndex || PopupManager.nextZIndex();
+  }, [zIndex]);
   useDraggable(dialogRef, headerRef, draggable, overflow);
 
   /** 获取子组件 */
@@ -146,16 +149,6 @@ function InternalElDialog(props, ref) {
       });
     }
   }, [b, modal, beforeClose, doClose, ref, setVisible, visible, closeOnClickModal]);
-
-  // useEffect(() => {
-  //     document.addEventListener('keydown', keydown, false);
-  //     console.log(PopupManager.zIndex);
-  //     return () => {
-  //         console.log(PopupManager.zIndex);
-  //         document.removeEventListener('keydown', keydown, false);
-  //     };
-  // }, [keydown]);
-
   useEffect(function () {
     getInstancesFromChildren(children);
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -225,7 +218,7 @@ function InternalElDialog(props, ref) {
   }, /*#__PURE__*/React.createElement("div", {
     className: classNames(b('overlay', false), props.className),
     style: {
-      zIndex: zIndex || PopupManager.nextZIndex()
+      zIndex: nextZIndex
     },
     ref: wrapperRef
   }, /*#__PURE__*/React.createElement("div", {

package/dist/Input/Input.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, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
-var _excluded = ["name", "title", "prefix", "suffix", "prepend", "append", "error", "warning", "debounceInput", "debounceTime", "placeholder", "readOnly", "plain", "classPrefix", "onChange", "onClear", "showPassword", "onFocus", "onBlur", "maxLength", "showWordLimit", "hiddenValue", "defaultValue", "formatter"];
+var _excluded = ["name", "title", "prefix", "suffix", "prepend", "append", "error", "warning", "debounceInput", "debounceTime", "placeholder", "readOnly", "plain", "classPrefix", "onInput", "onChange", "onClear", "showPassword", "onFocus", "onBlur", "maxLength", "showWordLimit", "hiddenValue", "defaultValue", "formatter"];
 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; }
@@ -16,11 +16,10 @@ 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 { useDebounceFn } from 'ahooks';
 import classNames from 'classnames';
-import { addClass, addStyle, hasClass, removeClass } from 'dom-lib';
+import { addStyle, hasClass } from 'dom-lib';
 import isObject from 'lodash/isObject';
-import React, { cloneElement, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import React, { cloneElement, forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useConfigProvider } from "../ConfigProvider/ConfigProviderContext";
 import Icon from "../Icon/Icon";
@@ -59,6 +58,7 @@ function InternalInput(props, ref) {
     plain = _props.plain,
     _props$classPrefix = _props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'input' : _props$classPrefix,
+    onInput = _props.onInput,
     onChange = _props.onChange,
     onClear = _props.onClear,
     showPassword = _props.showPassword,
@@ -88,6 +88,10 @@ function InternalInput(props, ref) {
     _useState2 = _slicedToArray(_useState, 2),
     type = _useState2[0],
     setType = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    focused = _useState4[0],
+    setFocused = _useState4[1];
   var disabled = useDisabled(props.disabled);
   var size = useSize(props.size);
   var containerRef = useRef(null);
@@ -209,31 +213,38 @@ function InternalInput(props, ref) {
   /** 输入事件 */
   var handleInput = useCallback(function (event) {
     // console.log('handleInput', event.target.value);
-    if (inputOver.current) {
-      // 让搜索变成异步的
-      setValue(event.target.value);
-      if (clearRef.current && clearable && isNotEmpty(event.target.value)) {
-        showClear(event.target.value);
-      } else {
-        hideClear();
-      }
-      onChange === null || onChange === void 0 || onChange(event.target.value, event);
+    // if (inputOver.current) {
+    // }
+    // 让搜索变成异步的
+    setValue(event.target.value);
+    if (clearRef.current && clearable && isNotEmpty(event.target.value)) {
+      showClear(event.target.value);
+    } else {
+      hideClear();
     }
+    onChange === null || onChange === void 0 || onChange(event.target.value, event);
   }, [setValue, clearable, onChange, showClear, hideClear]);
-  var _useDebounceFn = useDebounceFn(handleInput, {
-      wait: debounceTime
-    }),
-    handleDebounceInput = _useDebounceFn.run;
-  var handleComposition = useCallback(function (event) {
-    var _type = event.type;
-    // console.log(_type);
-    if (_type === 'compositionstart') {
-      inputOver.current = false;
-    } else if (_type === 'compositionend') {
-      inputOver.current = true;
-      handleInput(event);
-    }
-  }, [handleInput]);
+  var handleChange = useCallback(function (event) {
+    // console.log('handleChange', event.target.value);
+    setValue(event.target.value);
+    onChange === null || onChange === void 0 || onChange(event.target.value, event);
+  }, [setValue, onChange]);
+
+  // const { run: handleDebounceInput } = useDebounceFn(handleInput, { wait: debounceTime });
+
+  // const handleComposition = useCallback(
+  //     (event: any) => {
+  //         const _type = event.type;
+  //         // console.log(_type);
+  //         if (_type === 'compositionstart') {
+  //             inputOver.current = false;
+  //         } else if (_type === 'compositionend') {
+  //             inputOver.current = true;
+  //             handleInput(event);
+  //         }
+  //     },
+  //     [handleInput],
+  // );
 
   // useEffect(() => {
   //     const input = inputRef.current;
@@ -242,13 +253,16 @@ function InternalInput(props, ref) {
   //         input.addEventListener('compositionupdate', handleComposition);
   //         input.addEventListener('compositionend', handleComposition);
   //     }
-  // }, [debounceInput, handleComposition]);
+  // }, [handleComposition]);
+
+  // useEffect(() => {
+  //     requestAnimationFrame(() => {
+  //         if (inputRef.current) {
+  //             inputRef.current.value = formatValue as string;
+  //         }
+  //     });
+  // }, []);
 
-  useEffect(function () {
-    requestAnimationFrame(function () {
-      inputRef.current.value = formatValue;
-    });
-  }, []);
   useImperativeHandle(ref, function () {
     return {
       ref: containerRef,
@@ -290,6 +304,12 @@ function InternalInput(props, ref) {
     }
     return null;
   }, [type, prefix, e]);
+  var inputValue = useMemo(function () {
+    if (hiddenValue) {
+      return '';
+    }
+    return focused ? value : formatValue;
+  }, [focused, formatValue, hiddenValue, value]);
   return /*#__PURE__*/React.createElement("div", {
     ref: containerRef,
     className: classNames(b(), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, bm('group', 'prepend'), prepend), bm('group', 'append'), append), m(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["prefix"]))), preffixSlot), m(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["suffix"]))), suffixSlot || clearable), m(size), size), b(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["hidden"]))), type === 'hidden'), is({
@@ -306,7 +326,8 @@ function InternalInput(props, ref) {
     ref: wrapperRef,
     className: classNames(e(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["wrapper"]))), is({
       error: error,
-      warning: warning
+      warning: warning,
+      focus: focused
     })),
     onMouseEnter: function onMouseEnter() {
       return showClear(value);
@@ -325,7 +346,7 @@ function InternalInput(props, ref) {
     type: type,
     name: name,
     title: title,
-    value: hiddenValue ? '' : value,
+    value: inputValue,
     className: e(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["inner"]))),
     style: props.innerStyle,
     placeholder: placeholder,
@@ -334,26 +355,30 @@ function InternalInput(props, ref) {
     disabled: disabled,
     maxLength: maxLength,
     onInput: handleInput
+    // onChange={handleChange}
     // onCompositionStart={handleComposition}
     // onCompositionUpdate={handleComposition}
     // onCompositionEnd={handleComposition}
     ,
     onClick: props.onClick,
     onFocus: function onFocus(event) {
-      inputRef.current.value = value;
-      if (wrapperRef.current) {
-        addClass(wrapperRef.current, is('focus'));
-      }
+      // inputRef.current.value = value as string;
+      // if (wrapperRef.current) {
+      //     addClass(wrapperRef.current, is('focus'));
+      // }
+      setFocused(true);
       showClear(value);
       _onFocus === null || _onFocus === void 0 || _onFocus.call(_this, event);
     },
     onBlur: function onBlur(event) {
-      inputRef.current.value = formatValue;
-      if (wrapperRef.current) {
-        removeClass(wrapperRef.current, is('focus'));
-      }
+      // inputRef.current.value = formatValue as string;
+      // if (wrapperRef.current) {
+      //     removeClass(wrapperRef.current, is('focus'));
+      // }
+      setFocused(false);
       hideClear();
       _onBlur === null || _onBlur === void 0 || _onBlur.call(_this, event);
+      // handleChange(event);
     }
   }, htmlInputProps)), /*#__PURE__*/React.createElement("span", {
     ref: clearRef,