@nutui/nutui-react 1.2.3-beta.4 → 1.3.1-beta.0

package/dist/esm/CheckboxGroup.js

@@ -49,7 +49,6 @@ var CheckboxGroup = React__default.forwardRef(function (props, ref) {
           var childrenLabel = [];
           React__default.Children.map(children, function (child) {
             var childProps = child.props;
-            console.log(child);
             childrenLabel.push(childProps.label || child.children);
           });
           setInnerValue(childrenLabel);

package/dist/esm/ConfigProvider.js

@@ -114,6 +114,22 @@ var zhCN = {
     title4: '搜索框文本设置',
     title5: '自定义图标设置',
     title6: '数据改变监听'
+  },
+  audio: {
+    back: '快退',
+    forward: '快进',
+    pause: '暂停',
+    start: '开始',
+    mute: '静音',
+    tips: 'onPlayEnd事件在loop=false时才会触发'
+  },
+  datepicker: {
+    year: '年',
+    month: '月',
+    day: '日',
+    hour: '时',
+    min: '分',
+    seconds: '秒'
   }
 };
 var defaultProps = {

package/dist/esm/DatePicker.js

@@ -10,6 +10,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React__default, { useState, useRef, useEffect } from 'react';
 import Picker from './Picker.js';
+import { useConfig } from './ConfigProvider.js';
 var currentYear = new Date().getFullYear();
 var defaultProps = {
   modelValue: null,
@@ -42,6 +43,35 @@ var DatePicker = function DatePicker(props) {
       style = _defaultProps$props.style,
       rest = _objectWithoutProperties(_defaultProps$props, _excluded);
 
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale; // const [translated] = useTranslate<T>({
+  //   'zh-CN': {
+  //     year: '年',
+  //     month: '月',
+  //     day: '日',
+  //     hour: '时',
+  //     min: '分',
+  //     seconds: '秒',
+  //   },
+  //   'zh-TW': {
+  //     year: '年',
+  //     month: '月',
+  //     day: '日',
+  //     hour: '時',
+  //     min: '分',
+  //     seconds: '秒',
+  //   },
+  //   'en-US': {
+  //     year: 'Year',
+  //     month: 'Month',
+  //     day: 'Day',
+  //     hour: 'Hour',
+  //     min: 'Minute',
+  //     seconds: 'Second',
+  //   },
+  // })
+
+
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
       show = _useState2[0],
@@ -68,13 +98,14 @@ var DatePicker = function DatePicker(props) {
     return Object.prototype.toString.call(val) === '[object Date]' && !Number.isNaN(val.getTime());
   };
 
+  var datepickerLang = locale.datepicker;
   var zhCNType = {
-    day: '日',
-    year: '年',
-    month: '月',
-    hour: '时',
-    minute: '分',
-    seconds: '秒'
+    day: datepickerLang.day,
+    year: datepickerLang.year,
+    month: datepickerLang.month,
+    hour: datepickerLang.hour,
+    minute: datepickerLang.min,
+    seconds: datepickerLang.seconds
   };
 
   var formatValue = function formatValue(value) {

package/dist/esm/Dialog.js

@@ -1,6 +1,6 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["visible", "footer", "noOkBtn", "noCancelBtn", "lockScroll", "okBtnDisabled", "cancelAutoClose", "okText", "cancelText", "onClosed", "onCancel", "onOk"];
+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; }
 
@@ -12,7 +12,6 @@ import classNames from 'classnames';
 import Button from './Button.js';
 import { CSSTransition } from 'react-transition-group';
 import ReactDOM__default from 'react-dom';
-import { useConfig } from './ConfigProvider.js';
 
 var Content = function Content(props) {
   var visible = props.visible,
@@ -241,8 +240,8 @@ function confirm(config, renderFunc) {
 }
 
 var defaultProps = {
-  okText: '',
-  cancelText: '',
+  okText: '确认',
+  cancelText: '取消',
   mask: true,
   closeOnClickOverlay: true,
   noFooter: false,
@@ -256,11 +255,9 @@ var defaultProps = {
 };
 
 var BaseDialog = function BaseDialog(props, ref) {
-  var _useConfig = useConfig(),
-      locale = _useConfig.locale;
-
   var visible = props.visible,
       footer = props.footer,
+      noFooter = props.noFooter,
       noOkBtn = props.noOkBtn,
       noCancelBtn = props.noCancelBtn,
       lockScroll = props.lockScroll,
@@ -274,7 +271,7 @@ var BaseDialog = function BaseDialog(props, ref) {
       restProps = _objectWithoutProperties(props, _excluded);
 
   var renderFooter = function renderFooter() {
-    if (footer === null) return '';
+    if (footer === null || noFooter) return '';
 
     var handleCancel = function handleCancel(e) {
       e.stopPropagation();
@@ -302,20 +299,16 @@ var BaseDialog = function BaseDialog(props, ref) {
       plain: true,
       type: "primary",
       className: "nut-dialog__footer-cancel",
-      onClick: function onClick(e) {
-        return handleCancel(e);
-      }
-    }, cancelText || locale.cancel), !noOkBtn && React__default.createElement(Button, {
+      onClick: handleCancel
+    }, cancelText), !noOkBtn && React__default.createElement(Button, {
       size: "small",
       type: "primary",
       className: classNames('nut-dialog__footer-ok', {
         disabled: okBtnDisabled
       }),
       disabled: okBtnDisabled,
-      onClick: function onClick(e) {
-        return handleOk(e);
-      }
-    }, okText || locale.confirm));
+      onClick: handleOk
+    }, okText));
     return footerContent;
   };
 

package/dist/esm/Drag.js

@@ -94,7 +94,7 @@ var Drag = function Drag(props) {
     });
 
     if (last) {
-      if (props.direction != 'y' && props.attract) {
+      if (props.direction !== 'y' && props.attract) {
         if (x < middleLine.current) {
           api.start({
             x: boundaryState.left,

package/dist/esm/Elevator.js

@@ -135,10 +135,12 @@ var Elevator = function Elevator(props) {
   var touchMove = function touchMove(e) {
     var firstTouch = e.touches[0];
     touchState.current.y2 = firstTouch.pageY;
-    var delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0;
-    var cacheIndex = state.current.anchorIndex + delta;
+    var delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0; // delta 是一个浮点数, 需要四舍五入一下, 否则页面会找不到最终计算后的index
+
+    var cacheIndex = state.current.anchorIndex + Math.ceil(delta);
     setCodeIndex(cacheIndex);
     scrollTo(cacheIndex);
+    e.preventDefault();
   };
 
   var touchEnd = function touchEnd() {
@@ -229,6 +231,17 @@ var Elevator = function Elevator(props) {
     if (state.current.fixedTop === fixedTop) return;
     state.current.fixedTop = fixedTop;
   }, [state.current.diff, titleHeight]);
+  var refIndexBar = useRef(null); // 之前的代码, 手指在index条上下移动的时候, 下面的列表也会跟随滚动, 需要阻止默认事件
+  // 如果使用react的touchmove, 没有找到可以设置passive的选项, 无法阻止默认事件, 所以使用了原生的方法进行添加
+
+  useEffect(function () {
+    refIndexBar.current && refIndexBar.current.addEventListener('touchmove', touchMove, {
+      passive: false
+    });
+    return function () {
+      refIndexBar.current && refIndexBar.current.removeEventListener('touchmove', touchMove);
+    };
+  }, []);
   return React__default.createElement("div", _objectSpread({
     className: "".concat(b(), " ").concat(className)
   }, rest), isSticky && scrollY > 0 ? React__default.createElement("div", {
@@ -267,12 +280,10 @@ var Elevator = function Elevator(props) {
       current: true
     })
   }, indexList[codeIndex][acceptKey]) : null, React__default.createElement("div", {
+    ref: refIndexBar,
     className: b('bars'),
     onTouchStart: function onTouchStart(event) {
       return touchStart(event);
-    },
-    onTouchMove: function onTouchMove(event) {
-      return touchMove(event);
     }
   }, React__default.createElement("div", {
     className: b('bars__inner')

package/dist/esm/Grid/style/index.js

@@ -0,0 +1,2 @@
+
+require('../../../packages/grid/grid.scss')

package/dist/esm/Grid.js

@@ -0,0 +1,91 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children", "columnNum", "border", "gutter", "center", "square", "reverse", "direction", "style", "iconSize", "iconColor", "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), !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 { useConfig } from './ConfigProvider.js';
+import { c as cn } from './bem-893ad28d.js';
+import '@bem-react/classname';
+var defaultProps = {
+  columnNum: 4,
+  border: true,
+  gutter: 0,
+  center: true,
+  square: false,
+  reverse: false,
+  direction: 'vertical',
+  iconSize: 28,
+  iconColor: ''
+};
+
+var Grid = function Grid(props) {
+  useConfig();
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      children = _defaultProps$props.children,
+      columnNum = _defaultProps$props.columnNum,
+      border = _defaultProps$props.border,
+      gutter = _defaultProps$props.gutter,
+      center = _defaultProps$props.center,
+      square = _defaultProps$props.square,
+      reverse = _defaultProps$props.reverse,
+      direction = _defaultProps$props.direction,
+      style = _defaultProps$props.style,
+      iconSize = _defaultProps$props.iconSize,
+      iconColor = _defaultProps$props.iconColor,
+      className = _defaultProps$props.className,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var childrenDom = React__default.Children.toArray(children);
+
+  var pxCheck = function pxCheck(value) {
+    return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+  };
+
+  var b = cn('grid');
+
+  var rootClass = function rootClass() {
+    var prefixCls = b();
+    return "".concat(className, " ").concat(prefixCls, " ").concat(border && !gutter ? "".concat(b('border')) : '');
+  };
+
+  var rootStyle = function rootStyle() {
+    var styleSelf = {};
+
+    if (style) {
+      styleSelf = style;
+    }
+
+    if (gutter) {
+      styleSelf.paddingLeft = pxCheck(gutter);
+    }
+
+    return styleSelf;
+  };
+
+  return React__default.createElement("div", _objectSpread({
+    className: rootClass(),
+    style: rootStyle()
+  }, rest), childrenDom.map(function (item, idex) {
+    return React__default.cloneElement(item, {
+      index: idex,
+      columnNum: columnNum,
+      center: center,
+      border: border,
+      gutter: gutter,
+      square: square,
+      reverse: reverse,
+      direction: direction,
+      parentIconSize: iconSize,
+      parentIconColor: iconColor
+    });
+  }));
+};
+
+Grid.defaultProps = defaultProps;
+Grid.displayName = 'NutGrid';
+export { Grid as default };

package/dist/esm/GridItem/style/index.js

@@ -0,0 +1,2 @@
+
+require('../../../packages/griditem/griditem.scss')

package/dist/esm/GridItem.js

@@ -0,0 +1,99 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children", "columnNum", "index", "gutter", "square", "text", "icon", "iconColor", "iconSize", "parentIconSize", "parentIconColor", "border", "center", "reverse", "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 { useConfig } from './ConfigProvider.js';
+import { c as cn } from './bem-893ad28d.js';
+import Icon from './Icon.js';
+import '@bem-react/classname';
+var defaultProps = {
+  text: '',
+  icon: '',
+  iconSize: '',
+  iconColor: '',
+  parentIconSize: '',
+  parentIconColor: '',
+  columnNum: 4,
+  border: true,
+  gutter: 0,
+  center: true,
+  square: false,
+  reverse: false,
+  direction: 'vertical'
+};
+
+var GridItem = function GridItem(props) {
+  useConfig();
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      children = _defaultProps$props.children,
+      columnNum = _defaultProps$props.columnNum,
+      index = _defaultProps$props.index,
+      gutter = _defaultProps$props.gutter,
+      square = _defaultProps$props.square,
+      text = _defaultProps$props.text,
+      icon = _defaultProps$props.icon,
+      iconColor = _defaultProps$props.iconColor,
+      iconSize = _defaultProps$props.iconSize,
+      parentIconSize = _defaultProps$props.parentIconSize,
+      parentIconColor = _defaultProps$props.parentIconColor,
+      border = _defaultProps$props.border,
+      center = _defaultProps$props.center,
+      reverse = _defaultProps$props.reverse,
+      direction = _defaultProps$props.direction,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var b = cn('grid-item');
+
+  var pxCheck = function pxCheck(value) {
+    return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+  };
+
+  var rootStyle = function rootStyle() {
+    var style = {
+      flexBasis: "".concat(100 / +columnNum, "%")
+    };
+
+    if (square) {
+      style.paddingTop = "".concat(100 / +columnNum, "%");
+    } else if (gutter) {
+      style.paddingRight = pxCheck(gutter);
+
+      if (index >= columnNum) {
+        style.marginTop = pxCheck(gutter);
+      }
+    }
+
+    return style;
+  };
+
+  var contentClass = function contentClass() {
+    return "".concat(b('content'), " ").concat(border && b('content--border'), " ").concat(border && gutter && b('content--surround'), "  ").concat(center && b('content--center'), " ").concat(square && b('content--square'), " ").concat(reverse && b('content--reverse'), " ").concat(!!direction && b("content--".concat(direction)), "\n      ");
+  };
+
+  var isIconName = function isIconName() {
+    return typeof icon === 'string';
+  };
+
+  return React__default.createElement("div", _objectSpread({
+    className: b(),
+    style: rootStyle()
+  }, rest), React__default.createElement("div", {
+    className: contentClass()
+  }, icon && isIconName() ? React__default.createElement(Icon, {
+    name: icon,
+    size: iconSize || parentIconSize,
+    color: iconColor || parentIconColor
+  }) : React__default.createElement(React__default.Fragment, null, icon), text && React__default.createElement("div", {
+    className: "nut-grid-item__text"
+  }, text), children && React__default.createElement(React__default.Fragment, null, children)));
+};
+
+GridItem.defaultProps = defaultProps;
+GridItem.displayName = 'NutGridItem';
+export { GridItem as default };

package/dist/esm/Icon/style/index.js

@@ -1,2 +1,3 @@
+
 
 require('../../../packages/icon/icon.scss')

package/dist/esm/Icon.js

@@ -1,5 +1,5 @@
-import { I as Icon } from './icon-62bd7379.js';
-export { I as default } from './icon-62bd7379.js';
+import { I as Icon } from './icon-8dc4de10.js';
+export { I as default } from './icon-8dc4de10.js';
 import 'react';
 import './bem-893ad28d.js';
 import '@bem-react/classname';

package/dist/esm/ImagePreview/style/index.js

@@ -0,0 +1,2 @@
+
+require('../../../packages/imagepreview/imagepreview.scss')