@titaui/pc 1.6.12 → 1.6.16

package/lib/components/file-list/components/single-file/index.css

@@ -14,8 +14,8 @@
 }
 
 .titaui-new-file-list-single-file__file-preview-img {
-  width: 180px;
-  height: 180px;
+  max-width: 180px;
+  max-height: 180px;
   border-radius: 8px;
 }
 

package/lib/components/file-list/components/single-file/index.js

@@ -97,7 +97,7 @@ var SingleFile = function SingleFile(_ref) {
     }
   }, isImg && /*#__PURE__*/_react["default"].createElement("img", {
     className: prefix + "__file-preview-img",
-    src: data.bigImageUrl || data.smallImageUrl
+    src: data.previewUrl || data.bigImageUrl
   }), !isImg && /*#__PURE__*/_react["default"].createElement("div", {
     className: prefix + "__file-preview-other"
   }, /*#__PURE__*/_react["default"].createElement("img", {

package/lib/components/file-list/index.js

@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SingleFile = exports["default"] = void 0;
+exports["default"] = exports.SingleFile = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 

package/lib/components/form/form-fields/radios/index.css

@@ -14,6 +14,11 @@
   color: red;
 }
 
+.form-field-radio__radios {
+  display: flex;
+  flex-wrap: wrap;
+}
+
 .form-field-radio__radios .tita-radio {
   margin-right: 8px;
 }

package/lib/components/form/form-fields/radios/index.js

@@ -17,6 +17,18 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
+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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
 var prefixCls = 'form-field-radio';
 
 var _default = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
@@ -26,7 +38,22 @@ var _default = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       onChange = props.onChange,
       radios = props.radios,
       require = props.require,
-      value = props.value;
+      value = props.value,
+      radioClass = props.radioClass;
+
+  var _useState = (0, _react.useState)(value),
+      _useState2 = _slicedToArray(_useState, 2),
+      activedValue = _useState2[0],
+      setActivedValue = _useState2[1];
+
+  var onChangeHandler = function onChangeHandler(activedkey) {
+    onChange && onChange(activedkey);
+    setActivedValue(activedkey);
+  };
+
+  (0, _react.useEffect)(function () {
+    setActivedValue(value);
+  }, [value]);
   (0, _react.useImperativeHandle)(ref, function () {
     return {};
   });
@@ -41,12 +68,14 @@ var _default = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, "*")), /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(prefixCls, "__radios")
   }, radios.map(function (radio) {
-    return /*#__PURE__*/_react["default"].createElement(_radio.Radio, {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "".concat(prefixCls, "__radios-item ").concat(radioClass)
+    }, /*#__PURE__*/_react["default"].createElement(_radio.Radio, {
       key: radio.value,
       value: radio.value,
-      onChange: onChange,
-      checked: radio.value == value
-    }, radio.label);
+      onChange: onChangeHandler,
+      checked: radio.value == activedValue
+    }, radio.label));
   })));
 });
 

package/lib/components/form/index.js

@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FormFields = exports["default"] = void 0;
+exports["default"] = exports.FormFields = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 

package/lib/components/grid-page/commen-components/index.js

@@ -15,16 +15,16 @@ Object.defineProperty(exports, "CardContainer", {
     return _cardContain["default"];
   }
 });
-Object.defineProperty(exports, "CardTitle", {
+Object.defineProperty(exports, "CardFlexContent", {
   enumerable: true,
   get: function get() {
-    return _cardTitle["default"];
+    return _carditemFlexcontent["default"];
   }
 });
-Object.defineProperty(exports, "CardFlexContent", {
+Object.defineProperty(exports, "CardTitle", {
   enumerable: true,
   get: function get() {
-    return _carditemFlexcontent["default"];
+    return _cardTitle["default"];
   }
 });
 Object.defineProperty(exports, "DataItem", {

package/lib/components/grid-page/commen-components/scroll-tips.js

@@ -5,8 +5,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = ScrollTips;
 exports.AvatarTips = void 0;
+exports["default"] = ScrollTips;
 
 var _react = _interopRequireWildcard(require("react"));
 

package/lib/components/grid-page/util/network.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getIsCompanyOKREmpty = exports.getEssay = exports["default"] = exports.queryParams = void 0;
+exports.queryParams = exports.getIsCompanyOKREmpty = exports.getEssay = exports["default"] = void 0;
 
 var _axios = _interopRequireDefault(require("axios"));
 

package/lib/components/help-card/index.css

@@ -36,7 +36,7 @@
   box-shadow: 0px 0px 16px 0px rgba(127, 145, 180, 0.1);
 }
 
-.help-card-header {
+.help-card__header {
   width: 332px;
   height: 72px;
   background: #5C8EFF;
@@ -48,7 +48,7 @@
   color: #FFFFFF;
 }
 
-.help-card-header-avatar {
+.help-card__header-avatar {
   width: 40px;
   height: 40px;
   background: #03C2FC;
@@ -57,13 +57,13 @@
   border-radius: 50%;
 }
 
-.help-card-body {
+.help-card__body {
   box-sizing: border-box;
   padding: 0 20px;
   margin: 24px 0 30px;
 }
 
-.help-card-body-item {
+.help-card__body-item {
   box-sizing: border-box;
   width: 292px;
   height: 148px;
@@ -73,13 +73,13 @@
   background: rgba(240, 244, 250, 0.6) url("./image/question.svg") 100% 100% no-repeat;
 }
 
-.help-card-body-item-title {
+.help-card__body-item-title {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
 
-.help-card-body-item-title-left {
+.help-card__body-item-title-left {
   width: 64px;
   height: 24px;
   font-size: 16px;
@@ -89,7 +89,7 @@
   position: relative;
 }
 
-.help-card-body-item-title-left::before {
+.help-card__body-item-title-left::before {
   content: '';
   width: 81px;
   height: 7px;
@@ -100,7 +100,7 @@
   bottom: 0;
 }
 
-.help-card-body-item-title-right {
+.help-card__body-item-title-right {
   cursor: pointer;
   font-size: 12px;
   font-weight: 400;
@@ -108,11 +108,11 @@
   line-height: 22px;
 }
 
-.help-card-body-item-title-right > .tu-icon-gengxin1 {
+.help-card__body-item-title-right > .tu-icon-gengxin1 {
   margin-right: 4px;
 }
 
-.help-card-body-item-content-item {
+.help-card__body-item-content-item {
   cursor: pointer;
   margin-top: 12px;
   font-weight: 400;
@@ -121,7 +121,7 @@
   line-height: 22px;
 }
 
-.help-card-footer {
+.help-card__footer {
   width: 332px;
   height: 86px;
   background: #FFFFFF;
@@ -133,7 +133,7 @@
   justify-content: space-between;
 }
 
-.help-card-footer-item {
+.help-card__footer-item {
   width: 77px;
   height: 62px;
   display: flex;
@@ -147,7 +147,7 @@
   cursor: pointer;
 }
 
-.help-card-footer-item > img {
+.help-card__footer-item > img {
   width: 20px;
   height: 20px;
   margin-bottom: 5px;
@@ -156,16 +156,16 @@
 .tita-popup-zoom-left-bottom-enter,
 .tita-popup-zoom-left-bottom-appear {
   opacity: 0;
-  animation-duration: 0.3s;
+  animation-duration: 0.2s;
   animation-fill-mode: both;
-  animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
+  animation-timing-function: linear;
   animation-play-state: paused;
 }
 
 .tita-popup-zoom-left-bottom-leave {
-  animation-duration: 0.3s;
+  animation-duration: 0.2s;
   animation-fill-mode: both;
-  animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
+  animation-timing-function: linear;
   animation-play-state: paused;
 }
 

package/lib/components/help-card/index.js

@@ -53,20 +53,25 @@ var HelpCard = function HelpCard(_ref) {
       visible = _useState2[0],
       setVisible = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(false),
+  var _useState3 = (0, _react.useState)(1),
       _useState4 = _slicedToArray(_useState3, 2),
-      pointVisible = _useState4[0],
-      setPointVisible = _useState4[1];
+      pageNum = _useState4[0],
+      setPageNum = _useState4[1];
 
-  var _useState5 = (0, _react.useState)([]),
+  var _useState5 = (0, _react.useState)(false),
       _useState6 = _slicedToArray(_useState5, 2),
-      listType1 = _useState6[0],
-      setListType1 = _useState6[1];
+      pointVisible = _useState6[0],
+      setPointVisible = _useState6[1];
 
   var _useState7 = (0, _react.useState)([]),
       _useState8 = _slicedToArray(_useState7, 2),
-      listType2 = _useState8[0],
-      setListType2 = _useState8[1];
+      listType1 = _useState8[0],
+      setListType1 = _useState8[1];
+
+  var _useState9 = (0, _react.useState)([]),
+      _useState10 = _slicedToArray(_useState9, 2),
+      listType2 = _useState10[0],
+      setListType2 = _useState10[1];
 
   var isTrial = (0, _bsGlobal.getVersion)() == 1;
   var userId = window.BSGlobal && window.BSGlobal.loginUserInfo.Id || 0;
@@ -105,9 +110,8 @@ var HelpCard = function HelpCard(_ref) {
   };
 
   (0, _react.useEffect)(function () {
-    (0, _requestApi.getQuestionList)().then(function (res) {
-      console.log(res);
-      formatQuestionList(res.Data);
+    (0, _requestApi.getQuestionList)(pageNum).then(function (res) {
+      console.log(res); // formatQuestionList(res.Data);
     });
   }, []);
 
@@ -175,76 +179,76 @@ var HelpCard = function HelpCard(_ref) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: preCls
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-header")
+      className: "".concat(preCls, "__header")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-header-avatar")
+      className: "".concat(preCls, "__header-avatar")
     }), "Tita\u5C0F\u52A9\u624B"), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body")
+      className: "".concat(preCls, "__body")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item")
+      className: "".concat(preCls, "__body-item")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-title")
+      className: "".concat(preCls, "__body-item-title")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-title-left")
+      className: "".concat(preCls, "__body-item-title-left")
     }, "\u731C\u4F60\u60F3\u95EE"), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-title-right")
+      className: "".concat(preCls, "__body-item-title-right")
     }, /*#__PURE__*/_react["default"].createElement("span", {
       className: "tu-icon-gengxin1",
       onClick: chageBatch
     }), "\u6362\u4E00\u6279")), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-content")
+      className: "".concat(preCls, "__body-item-content")
     }, listType1.map(function (item, key) {
       return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(preCls, "-body-item-content-item"),
+        className: "".concat(preCls, "__body-item-content-item"),
         onClick: function onClick() {
           return handleSkip(item.questionUrl);
         },
         key: key
       }, item.questionName);
     }))), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item")
+      className: "".concat(preCls, "__body-item")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-title")
+      className: "".concat(preCls, "__body-item-title")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-title-left")
+      className: "".concat(preCls, "__body-item-title-left")
     }, "\u5E38\u89C1\u95EE\u9898")), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-body-item-content")
+      className: "".concat(preCls, "__body-item-content")
     }, listType2.map(function (item, key) {
       return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(preCls, "-body-item-content-item"),
+        className: "".concat(preCls, "__body-item-content-item"),
         onClick: function onClick() {
           return handleSkip(item.questionUrl);
         },
         key: key
       }, item.questionName);
     })))), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer")
+      className: "".concat(preCls, "__footer")
     }, isTrial && /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer-item"),
+      className: "".concat(preCls, "__footer-item"),
       onClick: handlePoint
     }, /*#__PURE__*/_react["default"].createElement("img", {
       src: require("./image/yuyueyanshi.svg"),
       alt: "\u9884\u7EA6\u6F14\u793A"
     }), "\u9884\u7EA6\u6F14\u793A"), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer-item"),
+      className: "".concat(preCls, "__footer-item"),
       onClick: handleHelpCenter
     }, /*#__PURE__*/_react["default"].createElement("img", {
       src: require("./image/helpzx.svg"),
       alt: "\u5E2E\u52A9\u4E2D\u5FC3"
     }), "\u5E2E\u52A9\u4E2D\u5FC3"), !isTrial && /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer-item"),
+      className: "".concat(preCls, "__footer-item"),
       onClick: handleUpgrade
     }, /*#__PURE__*/_react["default"].createElement("img", {
       src: require("./image/yuyueyanshi.svg"),
       alt: "\u5347\u7EA7\u901A\u77E5"
     }), "\u5347\u7EA7\u901A\u77E5"), !(0, _openData.isPlatform)("feishu") && /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer-item"),
+      className: "".concat(preCls, "__footer-item"),
       onClick: handleKnowledgeCommunity
     }, /*#__PURE__*/_react["default"].createElement("img", {
       src: require("./image/okr-shequ.svg"),
       alt: "\u77E5\u8BC6\u793E\u533A"
     }), "\u77E5\u8BC6\u793E\u533A"), !(0, _openData.isPlatform)("feishu") && !(0, _openData.isPlatform)("dd") && /*#__PURE__*/_react["default"].createElement("div", {
-      className: "".concat(preCls, "-footer-item"),
+      className: "".concat(preCls, "__footer-item"),
       onClick: handleCustomerService
     }, /*#__PURE__*/_react["default"].createElement("img", {
       src: require("./image/kefu1.svg"),

package/lib/components/help-card/request-api.js

@@ -19,14 +19,14 @@ var requestDomain = function requestDomain() {
   return "".concat(location.protocol, "//www.tita.gift");
 };
 
-var getQuestionList = function getQuestionList() {
+var getQuestionList = function getQuestionList(pageNum) {
   var source = (0, _bsGlobal.getSource)();
 
   if (source !== 860 || source !== 861 || source !== 862) {
     source = 0;
   }
 
-  return _axios["default"].get("".concat(requestDomain(), "/api/v1/").concat(tenantId, "/").concat(userId, "/const/question?source=").concat(source)).then(function (res) {
+  return _axios["default"].get("".concat(requestDomain(), "/api/v1/").concat(tenantId, "/").concat(userId, "/const/question?source=").concat(source, "&pageSize=", 3, "&pageNum=").concat(pageNum)).then(function (res) {
     return res.data;
   });
 };

package/lib/components/img-viewer/index.css

@@ -78,6 +78,10 @@
   background: #f7f9fb;
 }
 
+.titaui-img-viewer__body-img {
+  max-width: 800px;
+}
+
 .titaui-img-viewer__body-operate-btn {
   position: absolute;
   width: 48px;

package/lib/components/img-viewer/index.js

@@ -188,8 +188,9 @@ var ImgViewer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
         transform: "rotate(".concat(currentRotateDeg, "deg)")
       }
     }, /*#__PURE__*/_react["default"].createElement("img", {
+      className: prefix + '__body-img',
       ref: imgRef,
-      src: currentImgData.bigImageUrl,
+      src: currentImgData.previewUrl || currentImgData.bigImageUrl,
       style: {
         transform: "scale(".concat(currentScale, ")")
       }

package/lib/components/mblog/common/index.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.textareaAutoResizing = textareaAutoResizing;
-exports.insertTextAtPointer = insertTextAtPointer;
 exports.dealWithLoadedFileTips = dealWithLoadedFileTips;
 exports.generateSelectedMark = generateSelectedMark;
 exports.getByteLen = getByteLen;
-exports.htmlEncodeByRegExp = htmlEncodeByRegExp;
 exports.htmlDecodeByRegExp = htmlDecodeByRegExp;
+exports.htmlEncodeByRegExp = htmlEncodeByRegExp;
+exports.insertTextAtPointer = insertTextAtPointer;
+exports.textareaAutoResizing = textareaAutoResizing;
 
 // 修改textarea高度
 function textareaAutoResizing(id, initialTextHeight) {

package/lib/components/mblog/style.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DragEffect = exports.PreviewBox = exports.BtnPrivate = exports.BtnConfirm = exports.BtnCancel = exports.RightBtn = exports.RightBtnGroupWrapper = exports.IconSpan = exports.LeftBtn = exports.LeftBtnGroupWrapper = exports.MblogActionWrapper = exports.Tips = exports.Textarea = exports.TextareaWrapper = exports.Label = exports.LabelWrapper = exports.DivMblogContent = exports.MBlogBox = void 0;
+exports.Tips = exports.TextareaWrapper = exports.Textarea = exports.RightBtnGroupWrapper = exports.RightBtn = exports.PreviewBox = exports.MblogActionWrapper = exports.MBlogBox = exports.LeftBtnGroupWrapper = exports.LeftBtn = exports.LabelWrapper = exports.Label = exports.IconSpan = exports.DragEffect = exports.DivMblogContent = exports.BtnPrivate = exports.BtnConfirm = exports.BtnCancel = void 0;
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 

package/lib/components/menus/components/drag-resize/index.css

@@ -1,13 +1,13 @@
-.titaui-drag-width {
+.titaui-drag-resize__bar {
   display: inline-block;
   position: absolute;
   width: 10px;
-  height: calc(100% - 12px);
-  top: 8px;
+  height: calc(100% - 52px);
+  top: 40px;
   right: -5px;
 }
 
-.titaui-drag-width__darg {
+.titaui-drag-resize__bar-darg {
   position: absolute;
   width: 3px;
   height: 100%;

package/lib/components/menus/components/drag-resize/index.js

@@ -19,32 +19,20 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-var preCls = 'titaui-drag-width';
+var preCls = 'titaui-drag-resize';
 
 var _default = function _default(props) {
-  var container = props.container;
+  var children = props.children,
+      _props$defaultWidth = props.defaultWidth,
+      defaultWidth = _props$defaultWidth === void 0 ? 180 : _props$defaultWidth,
+      _props$onResize = props.onResize,
+      onResize = _props$onResize === void 0 ? function () {} : _props$onResize,
+      _props$minWidth = props.minWidth,
+      minWidth = _props$minWidth === void 0 ? 180 : _props$minWidth,
+      _props$maxWidth = props.maxWidth,
+      maxWidth = _props$maxWidth === void 0 ? 600 : _props$maxWidth;
   var dragRef = (0, _react.useRef)();
-
-  var _useState = (0, _react.useState)(180),
-      _useState2 = _slicedToArray(_useState, 1),
-      minWidth = _useState2[0];
-
-  var _useState3 = (0, _react.useState)(600),
-      _useState4 = _slicedToArray(_useState3, 1),
-      maxWidth = _useState4[0]; // 拖拽
-
+  var container = (0, _react.useRef)(); // 拖拽
 
   (0, _react.useEffect)(function () {
     var m_pos;
@@ -55,23 +43,40 @@ var _default = function _default(props) {
       var width = parseInt(getComputedStyle(container.current, '').width) - dx;
       if (width < minWidth) return;
       if (width > maxWidth) return;
-      container.current.style.width = parseInt(getComputedStyle(container.current, '').width) - dx + 'px';
+      container.current.style.width = "".concat(width, "px");
+      onResize({
+        width: width
+      });
     };
 
     dragRef.current.addEventListener('mousedown', function (e) {
       m_pos = e.x;
       document.addEventListener('mousemove', resize, false);
     }, false);
-    document.addEventListener('mouseup', function () {
-      document.removeEventListener('mousemove', resize, false);
-    }, false);
+
+    var removeHandler = function removeHandler() {
+      return document.removeEventListener('mousemove', resize, false);
+    };
+
+    document.addEventListener('mouseup', removeHandler, false);
+    return function () {
+      document.removeEventListener('mouseup', removeHandler);
+    };
   }, []);
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _classnames["default"])(preCls)
+    ref: container,
+    className: (0, _classnames["default"])(preCls),
+    style: {
+      'width': defaultWidth
+    }
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])("".concat(preCls, "__container"))
+  }, children), /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])("".concat(preCls, "__bar"))
   }, /*#__PURE__*/_react["default"].createElement("div", {
     ref: dragRef,
-    className: (0, _classnames["default"])("".concat(preCls, "__darg"))
-  }));
+    className: (0, _classnames["default"])("".concat(preCls, "__bar-darg"))
+  })));
 };
 
 exports["default"] = _default;