@autobest-ui/components 2.13.12 → 2.14.0

package/lib/affix/index.js

@@ -9,7 +9,6 @@ var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _utils = require("@autobest-ui/utils");
 var _PortalAffix = _interopRequireDefault(require("./PortalAffix"));
-var _observe = _interopRequireDefault(require("./observe"));
 var __extends = void 0 && (void 0).__extends || function () {
   var _extendStatics = function extendStatics(d, b) {
     _extendStatics = Object.setPrototypeOf || {
@@ -52,46 +51,16 @@ var Affix = /** @class */function (_super) {
     _this.resizeHandler = null;
     _this.wrapRef = /*#__PURE__*/_react.default.createRef();
     _this.customRef = /*#__PURE__*/_react.default.createRef();
-    _this.onVisibleChange = function (visible) {
-      var _a = _this.props,
-        onChange = _a.onChange,
-        observeSize = _a.observeSize,
-        renderAffix = _a.renderAffix;
-      onChange(visible);
-      if (visible && observeSize && !renderAffix) {
-        _this.addElementObserve();
-        return;
-      }
-      _this.removeElementObserve();
-    };
-    _this.addElementObserve = function () {
-      var element = _this.wrapRef.current;
-      var CurrentResizeObserve = (0, _observe.default)();
-      if (_this.resizeObserver || !element || !CurrentResizeObserve) {
-        return;
-      }
-      _this.resizeObserver = new CurrentResizeObserve(_this.refreshWrap);
-      _this.resizeObserver.observe(element);
-    };
-    _this.removeElementObserve = function () {
-      if (_this.resizeObserver) {
-        _this.resizeObserver.disconnect();
-        _this.resizeObserver = null;
-      }
-    };
-    _this.refreshWrap = function () {
-      _this.onHandlerScroll();
-    };
     _this.onHandlerScroll = function (isResize) {
       var _a = _this.props,
         offsetTop = _a.offsetTop,
+        onChange = _a.onChange,
         onScroll = _a.onScroll,
         renderAffix = _a.renderAffix,
         allWidth = _a.allWidth,
         fadeEffect = _a.fadeEffect,
         getFixedStatus = _a.getFixedStatus,
-        ignoreHorizontalFixed = _a.ignoreHorizontalFixed,
-        observeSize = _a.observeSize;
+        ignoreHorizontalFixed = _a.ignoreHorizontalFixed;
       var element = _this.wrapRef.current;
       if (!element) {
         return;
@@ -101,22 +70,12 @@ var Affix = /** @class */function (_super) {
         scrollLeft = _b.left;
       var parentElement = element.parentNode;
       // 元素信息
-      var isOriginalFixed = _this.isFixed && !renderAffix;
-      var positionInfo = isOriginalFixed ? (0, _utils.getOffsetAndSize)(parentElement) : (0, _utils.getOffsetAndSize)(element);
+      var positionElement = _this.isFixed && !renderAffix ? parentElement : element;
+      var positionInfo = (0, _utils.getOffsetAndSize)(positionElement);
       if (ignoreHorizontalFixed) {
-        var ignoreScrollLeft = (0, _utils.getOffset)(isOriginalFixed ? parentElement : element, true).left;
+        var ignoreScrollLeft = (0, _utils.getOffset)(positionElement, true).left;
         positionInfo.left = ignoreScrollLeft;
       }
-      var sizeChanged = false;
-      if (observeSize && isOriginalFixed) {
-        // 如果监听元素size变化，需要获取原元素的width和height信息
-        var _c = (0, _utils.getElementSize)(element),
-          elementWidth = _c.width,
-          elementHeight = _c.height;
-        sizeChanged = elementWidth !== positionInfo.width || elementHeight !== positionInfo.height;
-        positionInfo.width = elementWidth;
-        positionInfo.height = elementHeight;
-      }
       var currentFixed = getFixedStatus({
         positionInfo: positionInfo,
         scrollTop: scrollTop,
@@ -136,8 +95,8 @@ var Affix = /** @class */function (_super) {
           parentElement.style.width = '';
           parentElement.style.height = '';
         }
-        _this.onVisibleChange(false);
-      } else if ((!_this.isFixed || isResize || sizeChanged) && currentFixed) {
+        onChange(false);
+      } else if ((!_this.isFixed || isResize) && currentFixed) {
         _this.isFixed = true;
         var documentWidth = document.body.offsetWidth;
         var allWidthLeft = ignoreHorizontalFixed ? "-".concat(scrollLeft, "px") : '0px';
@@ -156,7 +115,7 @@ var Affix = /** @class */function (_super) {
           parentElement.style.width = "".concat(positionInfo.width, "px");
           parentElement.style.height = "".concat(positionInfo.height, "px");
         }
-        _this.onVisibleChange(true);
+        onChange(true);
       } else if (_this.isFixed && currentFixed && ignoreHorizontalFixed) {
         var allWidthLeft = "-".concat(scrollLeft, "px");
         if (renderAffix || fadeEffect) {

package/lib/carousel/index.d.ts

@@ -6,6 +6,10 @@ export interface CarouselProps {
      * 一行显示的数量
      */
     slidesPerView?: number;
+    /**
+     * 初始化时显示第几个，默认是第一个
+     */
+    defaultValue?: number;
     /**
      * 监听resize
      */

package/lib/carousel/index.js

@@ -47,12 +47,21 @@ var Carousel = /** @class */function (_super) {
     _this.autoplayTimer = null;
     _this.fadeEffectTimer = null;
     _this.next = function (transition) {
+      if (transition === void 0) {
+        transition = _transition.default.TransformEaseInOut;
+      }
       _this.interceptorChangePage(_this.state.currentPage + 1, transition);
     };
     _this.prev = function (transition) {
+      if (transition === void 0) {
+        transition = _transition.default.TransformEaseInOut;
+      }
       _this.interceptorChangePage(_this.state.currentPage - 1, transition);
     };
     _this.goTo = function (nextIndex, transition) {
+      if (transition === void 0) {
+        transition = _transition.default.TransformEaseInOut;
+      }
       _this.interceptorChangePage(nextIndex - 1, transition);
     };
     /**
@@ -161,7 +170,7 @@ var Carousel = /** @class */function (_super) {
           element.style.visibility = '';
         });
       } else {
-        element.style.transition = transition || _transition.default.TransformEaseInOut;
+        element.style.transition = transition;
       }
       element.style.transform = "translateX(".concat(translateX, "px)");
     };

package/lib/checkbox/Checkbox.js

@@ -49,30 +49,14 @@ var Checkbox = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
     type: "checkbox",
     checked: checked,
     disabled: disabled,
-    onChange: onCheckboxChange,
-    style: {
-      width: size,
-      height: size
-    }
+    onChange: onCheckboxChange
   }), /*#__PURE__*/_react.default.createElement("span", {
-    className: "".concat(cls, "-control"),
-    style: {
-      width: size,
-      height: size,
-      fontSize: size
-    }
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "".concat(cls, "-outer"),
+    className: "".concat(cls, "-inner"),
     style: {
       width: size,
       height: size
     }
-  }), /*#__PURE__*/_react.default.createElement("svg", {
-    className: "".concat(cls, "-check"),
-    viewBox: "0 0 18 18"
-  }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "M2.8284 8.4853 7.7782 13.435 15.5563 5.6569 14.1421 4.2426 7.7782 10.6066 4.2426 7.0711 2.8284 8.4853Z"
-  }))), children);
+  }), children);
 });
 Checkbox.defaultProps = {
   disabled: false,

package/lib/checkbox/style/index.css

@@ -1 +1 @@
-.ab-checkbox{position:relative;cursor:pointer;display:inline-flex;align-items:center;user-select:none}.ab-checkbox:hover .ab-checkbox-outer{border-color:#767676}.ab-checkbox-input{cursor:pointer;position:absolute;opacity:0;margin:0;padding:0;top:50%;left:0;transform:translateY(-50%);z-index:2}.ab-checkbox-check{opacity:0;transform:scale(0);transition:.2s cubic-bezier(.71,-.46,.88,.6),opacity .1s}.ab-checkbox-control{display:inline-block;margin-right:.06rem;position:relative;flex-shrink:0}.ab-checkbox-control svg{position:absolute;left:0;top:0;width:1em;height:1em;user-select:none;flex-shrink:0;fill:currentcolor;stroke:none}.ab-checkbox-outer{position:absolute;left:0;top:0;border:1px solid #b0b0b0;border-radius:.02rem;background-color:#fff}.ab-checkbox-checked .ab-checkbox-check{opacity:1;transform:scale(1);transition:.2s cubic-bezier(.12,.4,.29,1.46) .1s}.ab-checkbox-disabled{cursor:not-allowed;color:rgba(0,0,0,.25)}.ab-checkbox-disabled .ab-checkbox-input{cursor:not-allowed}.ab-checkbox-disabled span.ab-checkbox-control .ab-checkbox-outer{border-color:#f0f0f0;background-color:#f5f5f5}.ab-checkbox-disabled svg.ab-checkbox-check{color:#cecece}.ab-checkbox-white .ab-checkbox-check{color:#e84040}.ab-checkbox-blue .ab-checkbox-check{color:#fff}.ab-checkbox-blue.ab-checkbox-checked .ab-checkbox-outer{background-color:#0075ff;border-color:#0075ff}.ab-checkbox-group{display:flex;flex-wrap:wrap}.ab-checkbox-group .ab-checkbox{margin-right:.08rem}
+.ab-checkbox{cursor:pointer;display:inline-flex;align-items:center;user-select:none;position:relative}.ab-checkbox-input{cursor:pointer;position:absolute;opacity:0;margin:0;padding:0;z-index:2}.ab-checkbox-inner{display:inline-block;margin-right:.06rem;position:relative;border:1px solid #b0b0b0;border-radius:.02rem;background-color:#fff;transition:.3s;flex-shrink:0}.ab-checkbox-inner::after{box-sizing:border-box;position:absolute;top:45%;left:22%;display:table;width:37.5%;height:62.5%;border-style:solid;border-width:2px;border-top:0;border-inline-start:0;transform:rotate(45deg) scale(0) translate(-50%,-50%);opacity:0;content:"";transition:.2s cubic-bezier(.71,-.46,.88,.6),opacity .1s}.ab-checkbox-checked .ab-checkbox-inner::after{opacity:1;transform:rotate(45deg) scale(1) translate(-50%,-50%);transition:.2s cubic-bezier(.12,.4,.29,1.46) .1s}.ab-checkbox-disabled{cursor:not-allowed;color:rgba(0,0,0,.25)}.ab-checkbox-disabled .ab-checkbox-inner{border-color:#f0f0f0;background-color:#f5f5f5}.ab-checkbox-disabled .ab-checkbox-input{cursor:not-allowed}.ab-checkbox-white .ab-checkbox-inner::after{border-color:#e84040}.ab-checkbox-white.ab-checkbox-disabled .ab-checkbox-inner::after{border-color:#cecece}.ab-checkbox-blue .ab-checkbox-inner::after{border-color:#fff}.ab-checkbox-blue.ab-checkbox-checked .ab-checkbox-inner{transition:none;background-color:#0075ff;border-color:#0075ff}.ab-checkbox-blue.ab-checkbox-disabled .ab-checkbox-inner{border-color:#f0f0f0;background-color:#f5f5f5}.ab-checkbox-blue.ab-checkbox-disabled .ab-checkbox-inner::after{border-color:#cecece}.ab-checkbox-group{display:flex;flex-wrap:wrap}.ab-checkbox-group .ab-checkbox{margin-right:.08rem}

package/lib/confirm/style/index.css

@@ -1 +1 @@
-.ab-mask{position:fixed;top:0;left:0;z-index:101;width:100%;height:100%;background-color:rgba(0,0,0,.45);transition:opacity .4s cubic-bezier(.7,.3,.1,1)}.ab-mask-fade-appear,.ab-mask-fade-enter{opacity:0}.ab-mask-fade-appear-active,.ab-mask-fade-enter-active,.ab-mask-fade-enter-done,.ab-mask-fade-exit{opacity:1}.ab-mask-fade-exit-active{opacity:0}.ab-mask-fade-exit-done{display:none}.ab-modal{position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto;outline:0}.ab-modal.ab-modal-center{text-align:center}.ab-modal.ab-modal-center::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.ab-modal.ab-modal-center .ab-modal-content{top:0;text-align:left;display:inline-block;vertical-align:middle}.ab-modal-content{position:relative;background-color:#fff;max-width:calc(100vw - .3rem);margin-left:auto;margin-right:auto;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s,opacity .3s cubic-bezier(.7,.3,.1,1);z-index:101}.ab-modal-title{position:relative;width:100%}.ab-modal-title .ab-modal-times{top:50%;transform:translateY(-50%)}.ab-modal-times{position:absolute;top:.12rem;right:.12rem;font-size:.15rem;color:#b0b0b0;cursor:pointer}.ab-modal-times svg{display:block}.ab-modal-times:hover{color:#333}.ab-modal-hidden{display:none}@media only screen and (max-width:767px){.ab-modal-content{width:calc(100vw - .3rem)}}.ab-modal-fade-appear,.ab-modal-fade-enter{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-appear-active,.ab-modal-fade-enter-active,.ab-modal-fade-enter-done,.ab-modal-fade-exit{transform:translateZ(0);opacity:1}.ab-modal-fade-exit-active{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-exit-done{display:none}.ab-confirm-btns{display:flex;justify-content:flex-end;padding-top:.42rem}.ab-confirm-cancel,.ab-confirm-ok{overflow:hidden;position:relative;font-size:.12rem;border-width:1px;border-style:solid;outline:0;cursor:pointer;font-weight:700;padding:.05rem .3rem;display:inline-block;color:#fff;margin-left:.3rem}.ab-confirm-ok{border-color:#bc0000;background:linear-gradient(180deg,#c00000 0,#c00000 0,#a00000 100%,#a00000 100%)}.ab-confirm-ok:hover{border-color:#bc0000;background:#bc0000}.ab-confirm-cancel{border-color:grey;background:linear-gradient(180deg,#909090 0,#909090 0,#707070 100%,#707070 100%)}.ab-confirm-cancel:hover{border-color:grey;background:grey}
+.ab-mask{position:fixed;top:0;left:0;z-index:101;width:100%;height:100%;background-color:rgba(0,0,0,.45);transition:opacity .4s cubic-bezier(.7,.3,.1,1)}.ab-mask-fade-appear,.ab-mask-fade-enter{opacity:0}.ab-mask-fade-appear-active,.ab-mask-fade-enter-active,.ab-mask-fade-enter-done,.ab-mask-fade-exit{opacity:1}.ab-mask-fade-exit-active{opacity:0}.ab-mask-fade-exit-done{display:none}.ab-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:101;overflow:auto;outline:0}.ab-modal.ab-modal-center{text-align:center}.ab-modal.ab-modal-center::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.ab-modal.ab-modal-center .ab-modal-content{top:0;text-align:left;display:inline-block;vertical-align:middle}.ab-modal-content{position:relative;background-color:#fff;max-width:calc(100vw - .3rem);margin-left:auto;margin-right:auto;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s,opacity .3s cubic-bezier(.7,.3,.1,1);z-index:101}.ab-modal-title{position:relative;width:100%}.ab-modal-title .ab-modal-times{top:50%;transform:translateY(-50%)}.ab-modal-times{position:absolute;top:.12rem;right:.12rem;font-size:.15rem;color:#b0b0b0;cursor:pointer}.ab-modal-times svg{display:block}.ab-modal-times:hover{color:#333}.ab-modal-hidden{display:none}@media only screen and (max-width:767px){.ab-modal-content{width:calc(100vw - .3rem)}}.ab-modal-fade-appear,.ab-modal-fade-enter{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-appear-active,.ab-modal-fade-enter-active,.ab-modal-fade-enter-done,.ab-modal-fade-exit{transform:translateZ(0);opacity:1}.ab-modal-fade-exit-active{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-exit-done{display:none}.ab-confirm-btns{display:flex;justify-content:flex-end;padding-top:.42rem}.ab-confirm-cancel,.ab-confirm-ok{overflow:hidden;position:relative;font-size:.12rem;border-width:1px;border-style:solid;outline:0;cursor:pointer;font-weight:700;padding:.05rem .3rem;display:inline-block;color:#fff;margin-left:.3rem}.ab-confirm-ok{border-color:#bc0000;background:linear-gradient(180deg,#c00000 0,#c00000 0,#a00000 100%,#a00000 100%)}.ab-confirm-ok:hover{border-color:#bc0000;background:#bc0000}.ab-confirm-cancel{border-color:grey;background:linear-gradient(180deg,#909090 0,#909090 0,#707070 100%,#707070 100%)}.ab-confirm-cancel:hover{border-color:grey;background:grey}

package/lib/index.d.ts

@@ -14,6 +14,10 @@ export type { MoveProps } from './move';
 export { default as Move } from './move';
 export type { ShowMoreProps } from './show-more';
 export { default as ShowMore } from './show-more';
+export type { ReadMoreProps } from './read-more';
+export { default as ReadMore } from './show-more';
+export type { ReadMoreHtmlProps } from './read-more-html';
+export { default as ReadMoreHtml } from './read-more-html';
 export type { SelectOptionItem, SelectProps, SelectPlacement } from './select';
 export { default as Select } from './select';
 export type { ConfirmProps } from './confirm';
@@ -61,3 +65,5 @@ export { default as Trigger } from './trigger';
 export { composeRef, supportRef, fillRef } from './trigger/ref';
 export type { RadioProps, RadioGroupProps, RadioValue, RadioOptionItem } from './radio';
 export { Radio, RadioGroup } from './radio';
+export type { PortalProps } from './portal';
+export { default as Portal } from './portal';

package/lib/index.js

@@ -149,6 +149,12 @@ Object.defineProperty(exports, "Popover", {
     return _popover.default;
   }
 });
+Object.defineProperty(exports, "Portal", {
+  enumerable: true,
+  get: function get() {
+    return _portal.default;
+  }
+});
 Object.defineProperty(exports, "Radio", {
   enumerable: true,
   get: function get() {
@@ -161,6 +167,18 @@ Object.defineProperty(exports, "RadioGroup", {
     return _radio.RadioGroup;
   }
 });
+Object.defineProperty(exports, "ReadMore", {
+  enumerable: true,
+  get: function get() {
+    return _showMore.default;
+  }
+});
+Object.defineProperty(exports, "ReadMoreHtml", {
+  enumerable: true,
+  get: function get() {
+    return _readMoreHtml.default;
+  }
+});
 Object.defineProperty(exports, "Script", {
   enumerable: true,
   get: function get() {
@@ -241,6 +259,7 @@ var _popover = _interopRequireDefault(require("./popover"));
 var _skeleton = _interopRequireDefault(require("./skeleton"));
 var _move = _interopRequireDefault(require("./move"));
 var _showMore = _interopRequireDefault(require("./show-more"));
+var _readMoreHtml = _interopRequireDefault(require("./read-more-html"));
 var _select = _interopRequireDefault(require("./select"));
 var _confirm = _interopRequireDefault(require("./confirm"));
 var _collapse = _interopRequireDefault(require("./collapse"));
@@ -265,5 +284,6 @@ var _loadingIcon = _interopRequireDefault(require("./loading-icon"));
 var _trigger = _interopRequireDefault(require("./trigger"));
 var _ref = require("./trigger/ref");
 var _radio = require("./radio");
+var _portal = _interopRequireDefault(require("./portal"));
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/input/Adorn.d.ts

@@ -8,6 +8,10 @@ export interface AdornProps {
      * 样式前缀，这个需要使用者提供前缀
      */
     prefixCls: string;
+    /**
+     * 包裹input父级元素标签名
+     */
+    wrapTagName?: string;
     /**
      * 样式
      */

package/lib/input/Adorn.js

@@ -57,18 +57,22 @@ var Adorn = function Adorn(props) {
       onBlur(ev);
     }
   }, [onBlur, disabled]);
-  return /*#__PURE__*/_react.default.createElement("div", {
+  var WrapTagName = props.wrapTagName;
+  return /*#__PURE__*/_react.default.createElement(WrapTagName, {
     className: (0, _classnames.default)(prefixCls, className, (_a = {}, _a["".concat(prefixCls, "-enter")] = isEnter || isFocus, _a), (_b = {}, _b["".concat(prefixCls, "-focus")] = isFocus, _b), (_c = {}, _c["".concat(prefixCls, "-disabled")] = disabled, _c)),
     onMouseEnter: onMouseEnterCallback,
     onMouseLeave: onMouseLeaveCallback
-  }, !(0, _utils.isBlank)(prefix) ? /*#__PURE__*/_react.default.createElement("div", {
+  }, !(0, _utils.isBlank)(prefix) ? /*#__PURE__*/_react.default.createElement("span", {
     className: "".concat(prefixCls, "-prefix")
   }, prefix) : null, /*#__PURE__*/_react.default.cloneElement(children, {
     onFocus: onFocusCallback,
     onBlur: onBlurCallback
-  }), !(0, _utils.isBlank)(suffix) ? /*#__PURE__*/_react.default.createElement("div", {
+  }), !(0, _utils.isBlank)(suffix) ? /*#__PURE__*/_react.default.createElement("span", {
     className: "".concat(prefixCls, "-suffix")
   }, suffix) : null);
 };
+Adorn.defaultProps = {
+  wrapTagName: 'div'
+};
 var _default = Adorn;
 exports.default = _default;

package/lib/input/Input.d.ts

@@ -54,6 +54,7 @@ export declare class InputNotRef extends React.Component<InputPropsWithRef, Inpu
     inputRef: React.RefObject<HTMLInputElement>;
     static defaultProps: {
         defaultValue: string;
+        wrapTagName: string;
         type: string;
         checkValueOnMounted: boolean;
     };

package/lib/input/Input.js

@@ -214,10 +214,12 @@ var InputNotRef = /** @class */function (_super) {
       title = _a.title,
       onKeyUp = _a.onKeyUp,
       name = _a.name,
-      autoComplete = _a.autoComplete;
+      autoComplete = _a.autoComplete,
+      wrapTagName = _a.wrapTagName;
     var value = this.state.value;
     var isFileUpload = this.isFileUpload();
     return /*#__PURE__*/_react.default.createElement(_Adorn.default, {
+      wrapTagName: wrapTagName,
       prefixCls: cls,
       onFocus: this.onFocus,
       onBlur: this.onBlur,
@@ -246,6 +248,8 @@ var InputNotRef = /** @class */function (_super) {
   };
   InputNotRef.defaultProps = {
     defaultValue: '',
+    // TODO:: 在改动最小的情况下设置默认是div, 后续升级时默认需改成label
+    wrapTagName: 'div',
     type: 'text',
     checkValueOnMounted: false
   };

package/lib/input/TextArea.d.ts

@@ -54,6 +54,7 @@ export declare class TextAreaNotRef extends React.Component<TextAreaPropsWithRef
     textareaRef: React.RefObject<HTMLTextAreaElement>;
     static defaultProps: {
         defaultValue: string;
+        wrapTagName: string;
         rows: number;
         maxlength: number;
         checkValueOnMounted: boolean;

package/lib/input/TextArea.js

@@ -183,10 +183,12 @@ var TextAreaNotRef = /** @class */function (_super) {
       prefix = _a.prefix,
       rows = _a.rows,
       maxLength = _a.maxLength,
-      name = _a.name;
+      name = _a.name,
+      wrapTagName = _a.wrapTagName;
     var value = this.state.value;
     return /*#__PURE__*/_react.default.createElement(_Adorn.default, {
       prefixCls: cls,
+      wrapTagName: wrapTagName,
       onFocus: this.onFocus,
       onBlur: this.onBlur,
       className: className,
@@ -209,6 +211,7 @@ var TextAreaNotRef = /** @class */function (_super) {
   };
   TextAreaNotRef.defaultProps = {
     defaultValue: '',
+    wrapTagName: 'div',
     rows: 5,
     maxlength: 0,
     checkValueOnMounted: false

package/lib/input-number/index.d.ts

@@ -81,6 +81,7 @@ export declare class InputNumberNotRef extends React.Component<InputNumberPropsW
     keyboardHandler: AddListenerEventRemoveHandler;
     static defaultProps: {
         defaultValue: string;
+        wrapTagName: string;
         controls: boolean;
         isAllowNumberWithDotAndMinus: boolean;
         isOnlyAllowNumber: boolean;

package/lib/input-number/index.js

@@ -289,7 +289,8 @@ var InputNumberNotRef = /** @class */function (_super) {
       controls = _b.controls,
       isValueToString = _b.isValueToString,
       checkValueOnMounted = _b.checkValueOnMounted,
-      maxLength = _b.maxLength;
+      maxLength = _b.maxLength,
+      wrapTagName = _b.wrapTagName;
     var originalValueStr = this.state.originalValueStr;
     var hasControls = controls && !isValueToString;
     return /*#__PURE__*/_react.default.createElement(_Input.default, {
@@ -297,12 +298,14 @@ var InputNumberNotRef = /** @class */function (_super) {
       className: (0, _classnames.default)(cls, className, (_a = {}, _a["".concat(cls, "-has-controls")] = hasControls, _a)),
       placeholder: placeholder,
       disabled: disabled,
+      wrapTagName: wrapTagName,
       style: style,
       prefix: prefix,
       name: name,
       value: originalValueStr,
       onChange: this.onChange,
       onKeyDown: this.onKeyDown,
+      "aria-label": this.props['aria-label'],
       onBlur: this.onBlur,
       onFocus: this.onFocus,
       suffix: hasControls ? /*#__PURE__*/_react.default.createElement(_ControlArrow.default, {
@@ -316,6 +319,7 @@ var InputNumberNotRef = /** @class */function (_super) {
   };
   InputNumberNotRef.defaultProps = {
     defaultValue: '',
+    wrapTagName: 'div',
     controls: true,
     isAllowNumberWithDotAndMinus: false,
     isOnlyAllowNumber: false,

package/lib/input-phone/index.d.ts

@@ -48,6 +48,7 @@ export declare class InputPhoneNotRef extends React.Component<InputPhonePropsWit
     onFocusTimer: ReturnType<typeof setTimeout>;
     static defaultProps: {
         defaultValue: string;
+        wrapTagName: string;
         format: string;
         placeholderChar: string;
     };

package/lib/input-phone/index.js

@@ -202,6 +202,7 @@ var InputPhoneNotRef = /** @class */function (_super) {
   };
   InputPhoneNotRef.defaultProps = {
     defaultValue: '',
+    wrapTagName: 'div',
     format: '(111)111-1111',
     placeholderChar: '_'
   };

package/lib/lazy-image/index.d.ts

@@ -1,5 +1,9 @@
-import React, { MouseEventHandler, MouseEvent } from 'react';
-export interface LazyImageProps {
+import React from 'react';
+export interface LazyImageProps extends React.AllHTMLAttributes<HTMLElement> {
+    /**
+     * 标签名，默认div
+     */
+    tagName?: string;
     /**
      * 需要显示的图片
      */
@@ -9,34 +13,13 @@ export interface LazyImageProps {
      */
     alt: string;
     /**
-     * 鼠标悬浮时显示的文字
+     * 图片额外的属性
      */
-    title?: string;
+    imgHTMLAttributes?: React.ImgHTMLAttributes<HTMLImageElement>;
     /**
      * 类名
      */
     className?: string;
-    /**
-     * hover 图片，图片透明度(需要注意不要少了isMobile属性)
-     */
-    hoverOpacity?: number;
-    /**
-     * 判断是否是移动端，如果是移动端，将不再执行hoverOpacity, onMouseOver, onMouseOut
-     */
-    isMobile?: boolean;
-    /**
-     * 判断是否需要动态loading效果，如果提供了defaultImage，则不再有loading
-     */
-    active?: boolean;
-    onClick?: MouseEventHandler<HTMLImageElement>;
-    /**
-     * 鼠标放上去的回调（方便自定义样式）
-     */
-    onMouseOver?: MouseEventHandler<HTMLImageElement>;
-    /**
-     * 鼠标离开的回调（方便自定义样式）
-     */
-    onMouseOut?: MouseEventHandler<HTMLImageElement>;
     /**
      * 加载图片时的回调
      */
@@ -55,10 +38,9 @@ interface LazyImageStates {
 }
 declare class LazyImage extends React.Component<LazyImageProps, LazyImageStates> {
     static defaultProps: {
+        tagName: string;
         className: string;
-        hoverOpacity: any;
-        isMobile: boolean;
-        active: boolean;
+        imgHTMLAttributes: {};
     };
     prefixCls: string;
     rootRef: React.RefObject<HTMLImageElement>;
@@ -71,8 +53,6 @@ declare class LazyImage extends React.Component<LazyImageProps, LazyImageStates>
      * 监听原生lazy loading, 并回调不同的事件
      */
     originalLazyLoad: () => void;
-    onMouseOut: (ev: MouseEvent<HTMLImageElement>) => void;
-    onMouseOver: (ev: MouseEvent<HTMLImageElement>) => void;
     render(): JSX.Element;
 }
 export default LazyImage;

package/lib/lazy-image/index.js

@@ -41,6 +41,16 @@ var __assign = void 0 && (void 0).__assign || function () {
   };
   return __assign.apply(this, arguments);
 };
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
 function noop() {}
 var LazyImage = /** @class */function (_super) {
   __extends(LazyImage, _super);
@@ -97,36 +107,6 @@ var LazyImage = /** @class */function (_super) {
         };
       }
     };
-    _this.onMouseOut = function (ev) {
-      if (_this.props.isMobile) {
-        return;
-      }
-      var _a = _this.props,
-        hoverOpacity = _a.hoverOpacity,
-        onMouseOut = _a.onMouseOut;
-      var el = ev.target;
-      if (hoverOpacity) {
-        el.style.opacity = '1';
-      }
-      if (onMouseOut) {
-        onMouseOut(ev);
-      }
-    };
-    _this.onMouseOver = function (ev) {
-      if (_this.props.isMobile) {
-        return;
-      }
-      var _a = _this.props,
-        hoverOpacity = _a.hoverOpacity,
-        onMouseOver = _a.onMouseOver;
-      var el = ev.target;
-      if (hoverOpacity) {
-        el.style.opacity = hoverOpacity.toString();
-      }
-      if (onMouseOver) {
-        onMouseOver(ev);
-      }
-    };
     _this.state = {
       loading: true
     };
@@ -148,34 +128,33 @@ var LazyImage = /** @class */function (_super) {
     var cls = this.prefixCls;
     var _b = this.props,
       className = _b.className,
-      active = _b.active;
+      alt = _b.alt,
+      src = _b.src,
+      imgHTMLAttributes = _b.imgHTMLAttributes,
+      tagName = _b.tagName,
+      onError = _b.onError,
+      onLoading = _b.onLoading,
+      onLoaded = _b.onLoaded,
+      extraProps = __rest(_b, ["className", "alt", "src", "imgHTMLAttributes", "tagName", "onError", "onLoading", "onLoaded"]);
     var loading = this.state.loading;
-    var props = __assign({}, this.props);
-    delete props.className;
-    delete props.onMouseOver;
-    delete props.onMouseOut;
-    delete props.hoverOpacity;
-    delete props.isMobile;
-    delete props.active;
-    delete props.onLoading;
-    delete props.onLoaded;
-    return /*#__PURE__*/_react.default.createElement("img", __assign({
-      alt: ""
-    }, props, {
-      className: (0, _classnames.default)(cls, className, (_a = {}, _a["".concat(cls, "-loading")] = loading, _a["".concat(cls, "-active")] = loading && active, _a)),
-      onMouseOver: this.onMouseOver,
-      onMouseOut: this.onMouseOut,
+    var Wrapper = tagName;
+    // 需要图片根据容器自适应时，需增加mask
+    return /*#__PURE__*/_react.default.createElement(Wrapper, __assign({}, extraProps, {
+      className: (0, _classnames.default)(cls, className, (_a = {}, _a["".concat(cls, "-loading")] = loading, _a))
+    }), /*#__PURE__*/_react.default.createElement("img", __assign({
       onFocus: noop,
-      onBlur: noop,
+      onBlur: noop
+    }, imgHTMLAttributes, {
+      src: src,
+      alt: alt,
       ref: this.rootRef,
       loading: "lazy"
-    }));
+    })));
   };
   LazyImage.defaultProps = {
+    tagName: 'div',
     className: '',
-    hoverOpacity: null,
-    isMobile: false,
-    active: true
+    imgHTMLAttributes: {}
   };
   return LazyImage;
 }(_react.default.Component);

package/lib/lazy-image/style/index.css

@@ -1 +1 @@
-.ab-lazy-image{transition:opacity .5s}.ab-lazy-image-loading{background:#f2f2f2;overflow:hidden}.ab-lazy-image-loading.ab-lazy-image-active{background:linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);background-size:400% 100%;animation:1.4s infinite ab-skeleton-loading}@keyframes ab-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}
+.ab-lazy-image{position:relative;overflow:hidden;transition:opacity .5s;display:flex;align-items:center;justify-content:center}.ab-lazy-image::after{display:none;content:"";position:absolute;left:0;top:0;width:100%;height:100%}.ab-lazy-image-loading::after{display:block;background:linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);background-size:400% 100%;animation:1.4s infinite ab-skeleton-loading}.ab-lazy-image img{display:block;max-width:100%;max-height:100%}@keyframes ab-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}

package/lib/loading-container/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import { AddListenerEventRemoveHandler } from '@autobest-ui/utils';
 export interface LoadingContainerProps {
     /**
      * 容器是否loading
@@ -13,23 +12,6 @@ export interface LoadingContainerProps {
      * 内容区域
      */
     children?: React.ReactElement | React.ReactElement[];
-    /**
-     * LoadingIcon是否需要保持在可视区域内
-     */
-    loadingInView?: boolean;
-}
-declare class LoadingContainer extends React.Component<LoadingContainerProps> {
-    prefixCls: string;
-    addScrollHandlerListener: AddListenerEventRemoveHandler;
-    wrapRef: React.RefObject<HTMLDivElement>;
-    iconRef: React.RefObject<HTMLSpanElement>;
-    componentDidMount(): void;
-    componentDidUpdate(prevProps: Readonly<LoadingContainerProps>): void;
-    componentWillUnmount(): void;
-    addScrollListener: () => void;
-    removeScrollListener: () => void;
-    setIconTopStyle: (top: string) => void;
-    onHandlerScroll: () => void;
-    render(): JSX.Element;
 }
+declare function LoadingContainer(props: LoadingContainerProps): JSX.Element;
 export default LoadingContainer;