@nutui/nutui-react 1.5.1 → 2.0.0-alpha.1

package/dist/esm/Dialog.js

@@ -1,23 +1,36 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["visible", "footer", "noFooter", "noOkBtn", "noCancelBtn", "lockScroll", "okBtnDisabled", "cancelAutoClose", "okText", "cancelText", "onClosed", "onCancel", "onOk"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import * as React from 'react';
-import React__default, { useEffect, forwardRef } from 'react';
-import classNames from 'classnames';
-import Button from './Button.js';
-import { CSSTransition } from 'react-transition-group';
-import { r as render, u as unmount } from './render-bbebb760.js';
-import 'react-dom';
-var Content = function Content(props) {
-  var visible = props.visible,
-    title = props.title,
-    footer = props.footer,
-    textAlign = props.textAlign,
-    footerDirection = props.footerDirection,
-    onClickSelf = props.onClickSelf,
-    children = props.children;
+var _excluded = ["visible", "footer", "noFooter", "noOkBtn", "noCancelBtn", "lockScroll", "okBtnDisabled", "cancelAutoClose", "confirmText", "cancelText", "onClosed", "onCancel", "onOk"];
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import * as React from "react";
+import React__default, { useEffect, forwardRef } from "react";
+import classNames from "classnames";
+import Button from "./Button.js";
+import { CSSTransition } from "react-transition-group";
+import { r as render, u as unmount } from "./render.js";
+import "react-dom";
+var Content = function Content2(props) {
+  var visible = props.visible, title = props.title, footer = props.footer, textAlign = props.textAlign, footerDirection = props.footerDirection, onClickSelf = props.onClickSelf, children = props.children;
   var headerNode;
   if (title) {
     headerNode = React__default.createElement("div", {
@@ -27,10 +40,10 @@ var Content = function Content(props) {
   var footerNode;
   if (footer) {
     footerNode = React__default.createElement("div", {
-      className: classNames('nut-dialog__footer', _defineProperty({}, footerDirection, footerDirection))
+      className: classNames("nut-dialog__footer", _defineProperty({}, footerDirection, footerDirection))
     }, footer);
   }
-  var handleClick = function handleClick() {
+  var handleClick = function handleClick2() {
     onClickSelf && onClickSelf();
   };
   return React__default.createElement("div", {
@@ -39,42 +52,35 @@ var Content = function Content(props) {
   }, React__default.createElement("div", {
     className: "nut-dialog",
     style: {
-      display: visible ? 'flex' : 'none'
+      display: visible ? "flex" : "none"
     }
   }, headerNode, React__default.createElement("div", {
     className: "nut-dialog__content",
     style: {
-      textAlign: textAlign
+      textAlign
     }
   }, React__default.createElement("div", null, children)), footerNode));
 };
-Content.displayName = 'NutContent';
+Content.displayName = "NutContent";
 function Mask(props) {
   return React.createElement("div", {
     className: "nut-dialog__mask"
   });
 }
-var DialogWrap = function DialogWrap(props) {
-  var className = props.className,
-    style = props.style,
-    visible = props.visible,
-    mask = props.mask,
-    closeOnClickOverlay = props.closeOnClickOverlay,
-    lockScroll = props.lockScroll,
-    onClosed = props.onClosed,
-    onCancel = props.onCancel;
-  var handleClick = function handleClick(e) {
+var DialogWrap = function DialogWrap2(props) {
+  var className = props.className, style = props.style, visible = props.visible, mask = props.mask, closeOnClickOverlay = props.closeOnClickOverlay, lockScroll = props.lockScroll, onClosed = props.onClosed, onCancel = props.onCancel;
+  var handleClick = function handleClick2(e) {
     if (closeOnClickOverlay && visible && e.target === e.currentTarget) {
       onClosed === null || onClosed === void 0 ? void 0 : onClosed();
       onCancel === null || onCancel === void 0 ? void 0 : onCancel();
-      lockScroll && document.body.classList.remove('nut-overflow-hidden');
+      lockScroll && document.body.classList.remove("nut-overflow-hidden");
     }
   };
   var wrapStyle = _objectSpread(_objectSpread({}, style), {}, {
-    display: visible ? 'block' : 'none'
+    display: visible ? "block" : "none"
   });
   if (lockScroll && visible) {
-    document.body.classList.add('nut-overflow-hidden');
+    document.body.classList.add("nut-overflow-hidden");
   }
   return React__default.createElement(React__default.Fragment, null, mask ? React__default.createElement(CSSTransition, {
     "in": visible,
@@ -83,49 +89,47 @@ var DialogWrap = function DialogWrap(props) {
     unmountOnExit: true,
     appear: true
   }, React__default.createElement(Mask, null)) : null, React__default.createElement("div", {
-    className: classNames('nut-dialog__wrap', className),
+    className: classNames("nut-dialog__wrap", className),
     onClick: handleClick,
     style: wrapStyle
   }, React__default.createElement(Content, _objectSpread(_objectSpread({}, props), {}, {
-    visible: visible
+    visible
   }))));
 };
-DialogWrap.displayName = 'NutDialogWrap';
-var DialogWrapper = function DialogWrapper(props) {
-  var visible = props.visible,
-    lockScroll = props.lockScroll;
-  useEffect(function () {
+DialogWrap.displayName = "NutDialogWrap";
+var DialogWrapper = function DialogWrapper2(props) {
+  var visible = props.visible, lockScroll = props.lockScroll;
+  useEffect(function() {
     if (lockScroll && visible) {
-      document.body.classList.add('nut-overflow-hidden');
+      document.body.classList.add("nut-overflow-hidden");
     } else {
-      document.body.classList.remove('nut-overflow-hidden');
+      document.body.classList.remove("nut-overflow-hidden");
     }
   }, [visible]);
-  useEffect(function () {
-    return function () {
-      if (document.body.classList.value.includes('nut-overflow-hidden')) {
-        document.body.classList.remove('nut-overflow-hidden');
+  useEffect(function() {
+    return function() {
+      if (document.body.classList.value.includes("nut-overflow-hidden")) {
+        document.body.classList.remove("nut-overflow-hidden");
       }
     };
   }, []);
   return React__default.createElement("div", {
     style: {
-      display: visible ? 'block' : 'none'
+      display: visible ? "block" : "none"
     }
   }, React__default.createElement(DialogWrap, _objectSpread({}, props)));
 };
-DialogWrapper.displayName = 'NutDialogWrapper';
+DialogWrapper.displayName = "NutDialogWrapper";
 function ConfirmDialog(props) {
   return React__default.createElement(Dialog, _objectSpread({}, props), props.content);
 }
-// 如果是消息提示型弹出框，那么只有确认按钮
-var normalizeConfig = function normalizeConfig(_config) {
+var normalizeConfig = function normalizeConfig2(_config) {
   if (_config.isNotice) {
     var icon = _config.icon;
     if (!icon && icon !== null) {
       switch (_config.noticeType) {
-        case 'alert':
-          icon = '';
+        case "alert":
+          icon = "";
           break;
       }
     }
@@ -134,11 +138,11 @@ var normalizeConfig = function normalizeConfig(_config) {
   return _config;
 };
 function confirm(config, renderFunc) {
-  var div = document.createElement('div');
+  var div = document.createElement("div");
   document.body.appendChild(div);
   function render$1(props, callback) {
     render(React__default.createElement(ConfirmDialog, _objectSpread(_objectSpread({}, props), {}, {
-      onCancel: onCancel
+      onCancel
     })), div);
     callback && callback();
   }
@@ -146,7 +150,7 @@ function confirm(config, renderFunc) {
   var dialogConfig = _objectSpread(_objectSpread({}, config), {}, {
     visible: false
   });
-  var onOk = function onOk() {
+  var onOk = function onOk2() {
     var ret;
     var _onOk = config.onOk || config.onConfirm;
     if (_onOk) {
@@ -154,9 +158,9 @@ function confirm(config, renderFunc) {
     }
     if (ret && ret.then) {
       renderFunction(dialogConfig);
-      ret.then(function () {
+      ret.then(function() {
         onCancel(true);
-      }, function (e) {
+      }, function(e) {
         console.error(e);
         renderFunction(dialogConfig);
       });
@@ -165,7 +169,6 @@ function confirm(config, renderFunc) {
       onCancel(true);
     }
   };
-  // 如果是promise，那么处理loading和加载完成关闭
   dialogConfig.onOk = onOk;
   dialogConfig = normalizeConfig(dialogConfig);
   dialogConfig.visible = true;
@@ -179,10 +182,10 @@ function confirm(config, renderFunc) {
   function onCancel(isOnOk) {
     !isOnOk && config.onCancel && config.onCancel();
     dialogConfig.visible = false;
-    dialogConfig.onClosed = function () {
+    dialogConfig.onClosed = function() {
       config.onClosed && config.onClosed();
     };
-    renderFunction(dialogConfig, function () {
+    renderFunction(dialogConfig, function() {
       destroy();
     });
   }
@@ -195,20 +198,20 @@ function confirm(config, renderFunc) {
   }
   function close() {
     dialogConfig.visible = false;
-    dialogConfig.onClosed = function () {
+    dialogConfig.onClosed = function() {
       config.onClosed && config.onClosed();
       destroy();
     };
     renderFunction(dialogConfig);
   }
   return {
-    close: close,
-    update: update
+    close,
+    update
   };
 }
 var defaultProps = {
-  okText: '确认',
-  cancelText: '取消',
+  confirmText: "确认",
+  cancelText: "取消",
   mask: true,
   closeOnClickOverlay: true,
   noFooter: false,
@@ -216,75 +219,64 @@ var defaultProps = {
   noCancelBtn: false,
   okBtnDisabled: false,
   cancelAutoClose: true,
-  textAlign: 'center',
-  footerDirection: 'horizontal',
+  textAlign: "center",
+  footerDirection: "horizontal",
   lockScroll: false
 };
-var BaseDialog = function BaseDialog(props, ref) {
-  var visible = props.visible,
-    footer = props.footer,
-    noFooter = props.noFooter,
-    noOkBtn = props.noOkBtn,
-    noCancelBtn = props.noCancelBtn,
-    lockScroll = props.lockScroll,
-    okBtnDisabled = props.okBtnDisabled,
-    cancelAutoClose = props.cancelAutoClose,
-    okText = props.okText,
-    cancelText = props.cancelText,
-    onClosed = props.onClosed,
-    onCancel = props.onCancel,
-    onOk = props.onOk,
-    restProps = _objectWithoutProperties(props, _excluded);
-  var renderFooter = function renderFooter() {
-    if (footer === null || noFooter) return '';
-    var handleCancel = function handleCancel(e) {
+var BaseDialog = function BaseDialog2(props, ref) {
+  var visible = props.visible, footer = props.footer, noFooter = props.noFooter, noOkBtn = props.noOkBtn, noCancelBtn = props.noCancelBtn, lockScroll = props.lockScroll, okBtnDisabled = props.okBtnDisabled, cancelAutoClose = props.cancelAutoClose, confirmText = props.confirmText, cancelText = props.cancelText, onClosed = props.onClosed, onCancel = props.onCancel, onOk = props.onOk, restProps = _objectWithoutProperties(props, _excluded);
+  var renderFooter = function renderFooter2() {
+    if (footer === null || noFooter)
+      return "";
+    var handleCancel = function handleCancel2(e) {
       e.stopPropagation();
-      if (!cancelAutoClose) return;
+      if (!cancelAutoClose)
+        return;
       onClosed === null || onClosed === void 0 ? void 0 : onClosed();
       onCancel === null || onCancel === void 0 ? void 0 : onCancel();
       if (lockScroll && visible) {
-        document.body.classList.remove('nut-overflow-hidden');
+        document.body.classList.remove("nut-overflow-hidden");
       }
     };
-    var handleOk = function handleOk(e) {
+    var handleOk = function handleOk2(e) {
       e.stopPropagation();
       onClosed === null || onClosed === void 0 ? void 0 : onClosed();
       onOk === null || onOk === void 0 ? void 0 : onOk(e);
       if (lockScroll && visible) {
-        document.body.classList.remove('nut-overflow-hidden');
+        document.body.classList.remove("nut-overflow-hidden");
       }
     };
     var footerContent = footer || React__default.createElement(React__default.Fragment, null, !noCancelBtn && React__default.createElement(Button, {
       size: "small",
-      plain: true,
+      fill: "outline",
       type: "primary",
       className: "nut-dialog__footer-cancel",
       onClick: handleCancel
     }, cancelText), !noOkBtn && React__default.createElement(Button, {
       size: "small",
       type: "primary",
-      className: classNames('nut-dialog__footer-ok', {
+      className: classNames("nut-dialog__footer-ok", {
         disabled: okBtnDisabled
       }),
       disabled: okBtnDisabled,
       onClick: handleOk
-    }, okText));
+    }, confirmText));
     return footerContent;
   };
   return React__default.createElement(DialogWrapper, _objectSpread(_objectSpread({}, restProps), {}, {
-    visible: visible,
-    lockScroll: lockScroll,
+    visible,
+    lockScroll,
     footer: renderFooter(),
-    onClosed: onClosed,
-    onCancel: onCancel
+    onClosed,
+    onCancel
   }));
 };
 var Dialog = forwardRef(BaseDialog);
-Dialog.confirm = function (props) {
+Dialog.confirm = function(props) {
   return confirm(props);
 };
-['alert'].forEach(function (type) {
-  Dialog[type] = function (props) {
+["alert"].forEach(function(type) {
+  Dialog[type] = function(props) {
     return confirm(_objectSpread(_objectSpread({}, props), {}, {
       isNotice: false,
       noticeType: type
@@ -292,5 +284,7 @@ Dialog.confirm = function (props) {
   };
 });
 Dialog.defaultProps = defaultProps;
-Dialog.displayName = 'NutDialog';
-export { Dialog as default };
+Dialog.displayName = "NutDialog";
+export {
+  Dialog as default
+};

package/dist/esm/Divider.js

@@ -1,36 +1,45 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "contentPosition", "dashed", "hairline", "styles", "className", "direction"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React__default from 'react';
-import classNames from 'classnames';
-import { c as cn } from './bem-3b438e61.js';
-import '@bem-react/classname';
+var _excluded = ["children", "contentPosition", "style", "className", "direction"];
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import React__default from "react";
+import classNames from "classnames";
 var defaultProps = {
-  contentPosition: 'center',
-  dashed: false,
-  hairline: true,
-  direction: 'horizontal'
+  contentPosition: "center",
+  direction: "horizontal"
 };
-var Divider = function Divider(props) {
+var classPrefix = "nut-divider";
+var Divider = function Divider2(props) {
   var _classNames, _classNames2;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    children = _defaultProps$props.children,
-    contentPosition = _defaultProps$props.contentPosition,
-    dashed = _defaultProps$props.dashed,
-    hairline = _defaultProps$props.hairline,
-    styles = _defaultProps$props.styles,
-    className = _defaultProps$props.className,
-    direction = _defaultProps$props.direction,
-    rest = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var dividerBem = cn('divider');
-  var classes = direction === 'horizontal' ? classNames((_classNames = {}, _defineProperty(_classNames, dividerBem(), true), _defineProperty(_classNames, dividerBem('center'), children), _defineProperty(_classNames, dividerBem('left'), contentPosition === 'left'), _defineProperty(_classNames, dividerBem('right'), contentPosition === 'right'), _defineProperty(_classNames, dividerBem('dashed'), dashed), _defineProperty(_classNames, dividerBem('hairline'), hairline), _classNames)) : classNames((_classNames2 = {}, _defineProperty(_classNames2, dividerBem(), true), _defineProperty(_classNames2, dividerBem('vertical'), direction === 'vertical'), _classNames2));
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, contentPosition = _defaultProps$props.contentPosition, style = _defaultProps$props.style, className = _defaultProps$props.className, direction = _defaultProps$props.direction, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var classes = direction === "horizontal" ? classNames((_classNames = {}, _defineProperty(_classNames, "".concat(classPrefix), true), _defineProperty(_classNames, "".concat(classPrefix, "__center"), children), _defineProperty(_classNames, "".concat(classPrefix, "__left"), contentPosition === "left"), _defineProperty(_classNames, "".concat(classPrefix, "__right"), contentPosition === "right"), _defineProperty(_classNames, "".concat(classPrefix, "__hairline"), true), _classNames)) : classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(classPrefix), true), _defineProperty(_classNames2, "".concat(classPrefix, "__vertical"), direction === "vertical"), _classNames2));
   return React__default.createElement("div", _objectSpread({
-    className: "".concat(classes, " ").concat(className || ''),
-    style: styles
+    className: "".concat(classes, " ").concat(className || ""),
+    style
   }, rest), children);
 };
 Divider.defaultProps = defaultProps;
-Divider.displayName = 'NutDivider';
-export { Divider as default };
+Divider.displayName = "NutDivider";
+export {
+  Divider as default
+};

package/dist/esm/Drag.js

@@ -2,63 +2,61 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["attract", "direction", "boundary", "children", "className", "style"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React__default, { useState, useRef, useEffect } from 'react';
-import { useDrag } from '@use-gesture/react';
-import { useSpring, animated } from '@react-spring/web';
-import { c as cn } from './bem-3b438e61.js';
-import '@bem-react/classname';
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import React__default, { useState, useRef, useEffect } from "react";
+import { useDrag } from "@use-gesture/react";
+import { useSpring, animated } from "@react-spring/web";
+import { c as cn } from "./bem.js";
+import "@bem-react/classname";
 var defaultProps = {
   attract: false,
-  direction: undefined,
+  direction: void 0,
   boundary: {
     top: 0,
     left: 0,
     right: 0,
     bottom: 0
   },
-  className: ''
+  className: ""
 };
-var Drag = function Drag(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    attract = _defaultProps$props.attract,
-    direction = _defaultProps$props.direction,
-    boundary = _defaultProps$props.boundary,
-    children = _defaultProps$props.children,
-    className = _defaultProps$props.className,
-    style = _defaultProps$props.style,
-    reset = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var b = cn('drag');
-  var _useState = useState(boundary),
-    _useState2 = _slicedToArray(_useState, 2),
-    boundaryState = _useState2[0],
-    setBoundaryState = _useState2[1];
+var Drag = function Drag2(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), attract = _defaultProps$props.attract, direction = _defaultProps$props.direction, boundary = _defaultProps$props.boundary, children = _defaultProps$props.children, className = _defaultProps$props.className, style = _defaultProps$props.style, reset = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var b = cn("drag");
+  var _useState = useState(boundary), _useState2 = _slicedToArray(_useState, 2), boundaryState = _useState2[0], setBoundaryState = _useState2[1];
   var myDrag = useRef(null);
-  var _useSpring = useSpring(function () {
-      return {
-        x: 0,
-        y: 0
-      };
-    }),
-    _useSpring2 = _slicedToArray(_useSpring, 2),
-    currstyle = _useSpring2[0],
-    api = _useSpring2[1];
+  var _useSpring = useSpring(function() {
+    return {
+      x: 0,
+      y: 0
+    };
+  }), _useSpring2 = _slicedToArray(_useSpring, 2), currstyle = _useSpring2[0], api = _useSpring2[1];
   var middleLine = useRef(0);
-  var getInfo = function getInfo() {
+  var getInfo = function getInfo2() {
     var el = myDrag.current;
     if (el) {
-      var offsetWidth = el.offsetWidth,
-        offsetHeight = el.offsetHeight,
-        offsetTop = el.offsetTop,
-        offsetLeft = el.offsetLeft;
-      var _document$documentEle = document.documentElement,
-        clientWidth = _document$documentEle.clientWidth,
-        clientHeight = _document$documentEle.clientHeight;
-      var top = boundary.top,
-        left = boundary.left,
-        bottom = boundary.bottom,
-        right = boundary.right;
+      var offsetWidth = el.offsetWidth, offsetHeight = el.offsetHeight, offsetTop = el.offsetTop, offsetLeft = el.offsetLeft;
+      var _document$documentEle = document.documentElement, clientWidth = _document$documentEle.clientWidth, clientHeight = _document$documentEle.clientHeight;
+      var top = boundary.top, left = boundary.left, bottom = boundary.bottom, right = boundary.right;
       setBoundaryState({
         top: -offsetTop + top,
         left: -offsetLeft + left,
@@ -68,29 +66,25 @@ var Drag = function Drag(props) {
       middleLine.current = clientWidth - offsetWidth - offsetLeft - (clientWidth - offsetWidth) / 2;
     }
   };
-  var bind = useDrag(function (_ref) {
-    var down = _ref.down,
-      last = _ref.last,
-      _ref$offset = _slicedToArray(_ref.offset, 2),
-      x = _ref$offset[0],
-      y = _ref$offset[1];
+  var bind = useDrag(function(_ref) {
+    var down = _ref.down, last = _ref.last, _ref$offset = _slicedToArray(_ref.offset, 2), x = _ref$offset[0], y = _ref$offset[1];
     api.start({
-      x: x,
-      y: y,
+      x,
+      y,
       immediate: down
     });
     if (last) {
-      if (props.direction !== 'y' && props.attract) {
+      if (props.direction !== "y" && props.attract) {
         if (x < middleLine.current) {
           api.start({
             x: boundaryState.left,
-            y: y,
+            y,
             immediate: down
           });
         } else {
           api.start({
             x: boundaryState.right,
-            y: y,
+            y,
             immediate: down
           });
         }
@@ -103,11 +97,11 @@ var Drag = function Drag(props) {
     axis: direction,
     bounds: boundaryState
   });
-  useEffect(function () {
+  useEffect(function() {
     getInfo();
   }, [myDrag]);
   return React__default.createElement("div", _objectSpread(_objectSpread({
-    style: style,
+    style,
     className: "".concat(b(), " ").concat(className)
   }, reset), {}, {
     ref: myDrag
@@ -116,5 +110,7 @@ var Drag = function Drag(props) {
   }, bind()), children));
 };
 Drag.defaultProps = defaultProps;
-Drag.displayName = 'NutDrag';
-export { Drag as default };
+Drag.displayName = "NutDrag";
+export {
+  Drag as default
+};