@nutui/nutui-react 2.0.0-beta.0 → 2.0.0-beta.1

package/dist/esm/NumberKeyboard.js

@@ -1,277 +1,192 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-
-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, useEffect } from 'react';
-import classNames from 'classnames';
-import { c as cn } from './bem-893ad28d.js';
-import Popup from './Popup.js';
-import { useConfig } from './ConfigProvider.js';
-import '@bem-react/classname';
-var defaultProps = {
-  confirmText: '',
-  title: '',
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["title", "confirmText", "visible", "type", "custom", "random", "style", "className", "onChange", "onDelete", "onClose", "onConfirm"];
+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, { useMemo, useState } from "react";
+import classNames from "classnames";
+import { RectDown } from "@nutui/icons-react";
+import Popup from "./Popup.js";
+import { useConfig } from "./ConfigProvider.js";
+import { C as ComponentDefaults } from "./typings.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   visible: false,
-  type: 'default',
-  customKey: [],
-  className: '',
-  randomKeys: false,
-  popClass: '',
-  onClose: function onClose() {}
-};
-
-var NumberKeyboard = function NumberKeyboard(props) {
-  var _useConfig = useConfig(),
-      locale = _useConfig.locale;
-
-  var title = props.title,
-      confirmText = props.confirmText,
-      visible = props.visible,
-      type = props.type,
-      customKey = props.customKey,
-      randomKeys = props.randomKeys,
-      popClass = props.popClass,
-      style = props.style,
-      className = props.className,
-      onChange = props.onChange,
-      onDelete = props.onDelete,
-      onClose = props.onClose;
-  var b = cn('numberkeyboard');
-
-  var _useState = useState(visible),
-      _useState2 = _slicedToArray(_useState, 2),
-      show = _useState2[0],
-      setShow = _useState2[1];
-
-  var _useState3 = useState(undefined),
-      _useState4 = _slicedToArray(_useState3, 2),
-      clickKeyIndex = _useState4[0],
-      setClickKeyIndex = _useState4[1];
-
-  var _useState5 = useState([]),
-      _useState6 = _slicedToArray(_useState5, 2),
-      keysList = _useState6[0],
-      setKeysList = _useState6[1];
-
-  useEffect(function () {
-    setShow(visible);
-  }, [visible]);
-
-  var defaultKey = function defaultKey() {
-    var leftBottomKey = {
-      id: 'lock',
-      type: 'lock'
-    };
-
-    if (customKey) {
-      var customKeys = Array.isArray(customKey) ? customKey : [customKey];
-
-      if (customKeys.length > 0) {
-        var newCustomKey = customKeys[0];
-        leftBottomKey = {
-          id: newCustomKey,
-          type: 'custom'
-        };
-      }
-    }
-
-    return [].concat(_toConsumableArray(getBasicKeys()), [leftBottomKey, {
-      id: 0,
-      type: 'number'
-    }, {
-      id: 'delete',
-      type: 'delete'
-    }]);
-  };
-
-  var getBasicKeys = function getBasicKeys() {
-    var keys = [];
-
-    for (var i = 1; i <= 9; i++) {
-      keys.push({
-        id: i,
-        type: 'number'
-      });
-    }
-
-    if (randomKeys) {
-      return keys.sort(function () {
-        return Math.random() > 0.5 ? 1 : -1;
-      });
-    }
-
-    return keys;
+  type: "default",
+  custom: [],
+  random: false,
+  onClose: function onClose() {
+  }
+});
+var NumberKeyboard = function NumberKeyboard2(props) {
+  var _useConfig = useConfig(), locale = _useConfig.locale;
+  var title = props.title, confirmText = props.confirmText, visible = props.visible, type = props.type, custom = props.custom, random = props.random, style = props.style, className = props.className, onChange = props.onChange, onDelete = props.onDelete, onClose2 = props.onClose, onConfirm = props.onConfirm, rest = _objectWithoutProperties(props, _excluded);
+  var classPrefix = "nut-numberkeyboard";
+  var getBasicKeys = function getBasicKeys2() {
+    var keys = new Array(9).fill(0).map(function(_, index) {
+      return {
+        id: String(index + 1),
+        type: "num"
+      };
+    });
+    return random ? keys.sort(function() {
+      return Math.random() > 0.5 ? 1 : -1;
+    }) : keys;
   };
-
-  var genCustomKeys = function genCustomKeys() {
-    var keys = getBasicKeys();
-    if (!customKey) return [];
-    var customKeys = Array.isArray(customKey) ? customKey : [customKey];
-
-    if (customKeys.length > 2) {
-      customKeys = [customKeys[0], customKeys[1]];
-    }
-
-    if (customKeys.length === 2 && props.title && props.type !== 'rightColumn') {
-      customKeys = [customKeys[0]];
-    }
-
-    if (customKeys.length === 1) {
-      if (props.title && props.type !== 'rightColumn') {
-        keys.push({
-          id: customKeys[0],
-          type: 'custom'
-        }, {
-          id: 0,
-          type: 'number'
-        }, {
-          id: 'delete',
-          type: 'delete'
-        });
-      } else {
-        keys.push({
-          id: 0,
-          type: 'number'
-        }, {
-          id: customKeys[0],
-          type: 'custom'
-        });
-      }
-    } else if (customKeys.length === 2) {
-      keys.push({
-        id: customKeys[0],
-        type: 'custom'
-      }, {
-        id: 0,
-        type: 'number'
-      }, {
-        id: customKeys[1],
-        type: 'custom'
-      });
-    }
-
-    return keys;
-  };
-
-  useEffect(function () {
-    if (props.type === 'rightColumn' || props.title !== '') {
-      setKeysList(genCustomKeys());
-    } else {
-      setKeysList(defaultKey());
-    }
-  }, []);
-
-  var onTouchstart = function onTouchstart(item, event) {
-    event.stopPropagation();
-    setClickKeyIndex(item.id);
-
-    if (item.type === 'number' || item.type === 'custom') {
-      onChange && onChange(item.id);
-    }
-
-    if (item.type === 'lock') {
-      onClose && onClose();
+  var getCustomKeys = function getCustomKeys2() {
+    var customKeys = [{
+      id: "close",
+      type: "close"
+    }, {
+      id: "0",
+      type: "num"
+    }, {
+      id: "delete",
+      type: "delete"
+    }];
+    if (!custom)
+      return customKeys;
+    if (custom.length > 0) {
+      customKeys[0] = {
+        id: custom[0],
+        type: "custom"
+      };
     }
-
-    if (item.type === 'delete') {
-      onDelete && onDelete();
+    if (custom.length > 1) {
+      customKeys[2] = {
+        id: custom[1],
+        type: "custom"
+      };
     }
+    return customKeys;
   };
-
-  var onTouchMove = function onTouchMove(event) {
-    event.stopPropagation();
+  var keysList = useMemo(function() {
+    return [].concat(_toConsumableArray(getBasicKeys()), _toConsumableArray(getCustomKeys()));
+  }, [type, random, custom]);
+  var DeleteIcon = function DeleteIcon2() {
+    return React__default.createElement("svg", {
+      viewBox: "0 0 1024 1024",
+      width: "36",
+      height: "36"
+    }, React__default.createElement("path", {
+      d: "M875.594 186.122H390.803a51.162 51.162 0 0 0-36.18 14.986L79.91 475.821a51.166 51.166 0 0 0 0 72.358l274.714 274.712a51.164 51.164 0 0 0 36.179 14.986h484.791c46.033 0 83.484-37.45 83.484-83.483V269.606c.001-46.033-37.45-83.484-83.483-83.484zm32.32 568.274c0 17.85-14.473 32.318-32.32 32.318H390.803L116.089 512l274.714-274.714h484.791c17.849 0 32.32 14.47 32.32 32.32v484.789z",
+      fill: "currentColor"
+    }), React__default.createElement("path", {
+      d: "M753.945 360.214l-121.43 121.429-121.43-121.429s-16.062-8.224-30.356 6.072c-14.295 14.295-6.073 30.357-6.073 30.357l121.43 121.428L486.8 627.357s-8.222 16.062 6.072 30.357c14.297 14.296 30.358 6.072 30.358 6.072l109.286-109.285 109.286 109.285s16.062 8.224 30.357-6.072c14.295-14.295 6.07-30.357 6.07-30.357L668.944 518.072l121.431-121.43s8.22-16.061-6.074-30.356c-14.294-14.296-30.356-6.072-30.356-6.072z",
+      fill: "currentColor"
+    }));
   };
-
-  var onTouchEnd = function onTouchEnd(event) {
-    event.preventDefault();
-    setClickKeyIndex(undefined);
-  };
-
-  return React__default.createElement("div", null, React__default.createElement(Popup, {
-    visible: show,
-    position: "bottom",
-    popClass: popClass,
-    onClickOverlay: onClose,
-    onClickCloseIcon: onClose,
-    overlayStyle: {
-      backgroundColor: 'rgba(0, 0, 0, 0)'
-    }
-  }, React__default.createElement("div", {
-    className: "".concat(b(), " ").concat(className),
-    style: _objectSpread({}, style)
-  }, title ? React__default.createElement("div", {
-    className: b('header')
-  }, React__default.createElement("h3", {
-    className: b('header__tit')
-  }, title), type === 'default' ? React__default.createElement("span", {
-    className: b('header__close'),
-    onClick: onClose
-  }, locale.done) : null) : null, React__default.createElement("div", {
-    className: b('body')
-  }, React__default.createElement("div", {
-    className: b('body__keys')
-  }, keysList === null || keysList === void 0 ? void 0 : keysList.map(function (item, index) {
+  var NumberKeyboardKey = function NumberKeyboardKey2(props2) {
+    var item = props2.item;
+    var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), active = _useState2[0], setActive = _useState2[1];
+    var _onTouchStart = function onTouchStart() {
+      setActive(true);
+    };
+    var _onTouchEnd = function onTouchEnd(item2) {
+      setActive(false);
+      if (item2.type === "num" || item2.type === "custom") {
+        onChange && onChange(item2.id);
+      }
+      if (item2.type === "close") {
+        onClose2 && onClose2();
+      }
+      if (item2.type === "delete") {
+        onDelete && onDelete();
+      }
+      if (item2.type === "confirm") {
+        onConfirm && onConfirm();
+      }
+    };
     return React__default.createElement("div", {
-      key: index,
-      className: classNames({
-        'key-board-wrapper': true,
-        'key-board-wrapper-large': item.id === 0 && type === 'rightColumn' && Array.isArray(customKey) && customKey.length === 1
-      })
+      key: item.id,
+      className: "".concat(classPrefix, "__body__wrapper")
     }, React__default.createElement("div", {
       className: classNames({
         key: true,
-        active: item.id === clickKeyIndex,
-        lock: item.type === 'lock',
-        "delete": item.type === 'delete'
+        active,
+        close: item.type === "close",
+        "delete": item.type === "delete",
+        confirm: item.type === "confirm"
       }),
-      onTouchStart: function onTouchStart(event) {
-        return onTouchstart(item, event);
+      onTouchStart: function onTouchStart() {
+        return _onTouchStart();
       },
-      onTouchMove: onTouchMove,
-      onTouchEnd: onTouchEnd
-    }, item.type === 'number' || item.type === 'custom' ? React__default.createElement("div", null, item.id) : null, item.type === 'lock' ? React__default.createElement("img", {
-      src: "https://img11.360buyimg.com/imagetools/jfs/t1/146371/38/8485/738/5f606425Eca239740/14f4b4f5f20d8a68.png",
-      alt: ""
-    }) : null, item.type === 'delete' ? React__default.createElement("img", {
-      src: "https://img11.360buyimg.com/imagetools/jfs/t1/129395/8/12735/2030/5f61ac37E70cab338/fb477dc11f46056c.png",
-      alt: ""
-    }) : null));
-  })), type === 'rightColumn' ? React__default.createElement("div", {
-    className: b('sidebar')
-  }, React__default.createElement("div", {
-    className: "key-board-wrapper"
-  }, React__default.createElement("div", {
-    className: classNames({
-      key: true,
-      active: clickKeyIndex === 'delete'
-    }),
-    onTouchStart: function onTouchStart(event) {
-      return onTouchstart({
-        id: 'delete',
-        type: 'delete'
-      }, event);
-    },
-    onTouchMove: onTouchMove,
-    onTouchEnd: onTouchEnd
-  }, React__default.createElement("img", {
-    src: "https://img11.360buyimg.com/imagetools/jfs/t1/129395/8/12735/2030/5f61ac37E70cab338/fb477dc11f46056c.png",
-    alt: ""
-  }))), React__default.createElement("div", {
-    className: "key-board-wrapper key-board-finish",
-    onClick: onClose
+      onTouchEnd: function onTouchEnd() {
+        return _onTouchEnd(item);
+      },
+      onTouchCancel: function onTouchCancel() {
+        return _onTouchEnd(item);
+      }
+    }, (item.type === "num" || item.type === "custom") && React__default.createElement("div", null, item.id), item.type === "delete" && React__default.createElement(DeleteIcon, null), item.type === "close" && React__default.createElement(RectDown, {
+      width: 25,
+      height: 25
+    }), item.type === "confirm" && React__default.createElement(React__default.Fragment, null, confirmText || locale.done)));
+  };
+  return React__default.createElement(Popup, _objectSpread({
+    visible,
+    position: "bottom",
+    onClickOverlay: onClose2,
+    onClickCloseIcon: onClose2,
+    overlayStyle: {
+      backgroundColor: "rgba(0, 0, 0, 0)"
+    }
+  }, rest), React__default.createElement("div", {
+    className: classNames(classPrefix, className),
+    style
+  }, title && React__default.createElement("div", {
+    className: "".concat(classPrefix, "__header")
+  }, React__default.createElement("h3", {
+    className: "".concat(classPrefix, "__header__title")
+  }, title), type === "default" && React__default.createElement("span", {
+    className: "".concat(classPrefix, "__header__close"),
+    onClick: onClose2
+  }, locale.done)), React__default.createElement("div", {
+    className: "".concat(classPrefix, "__body")
   }, React__default.createElement("div", {
-    className: classNames({
-      key: true,
-      finish: true,
-      activeFinsh: clickKeyIndex === 'finish'
-    })
-  }, confirmText || locale.done))) : null))));
+    className: "".concat(classPrefix, "__body__keys")
+  }, keysList === null || keysList === void 0 ? void 0 : keysList.map(function(item) {
+    return React__default.createElement(NumberKeyboardKey, {
+      key: item.id,
+      item
+    });
+  })), type === "rightColumn" && React__default.createElement("div", {
+    className: "".concat(classPrefix, "__sidebar")
+  }, React__default.createElement(NumberKeyboardKey, {
+    key: "delete",
+    item: {
+      id: "delete",
+      type: "delete"
+    }
+  }), React__default.createElement(NumberKeyboardKey, {
+    key: "confirm",
+    item: {
+      id: "confirm",
+      type: "confirm"
+    }
+  })))));
 };
-
 NumberKeyboard.defaultProps = defaultProps;
-NumberKeyboard.displayName = 'NutNumberKeyboard';
-export { NumberKeyboard as default };
+NumberKeyboard.displayName = "NutNumberKeyboard";
+export {
+  NumberKeyboard as default
+};

package/dist/esm/Overlay/style/css.js

@@ -0,0 +1 @@
+import './style.css'

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

@@ -1,2 +1,2 @@
 
-require('../../../packages/overlay/overlay.scss')
+import '../../../packages/overlay/overlay.scss'

package/dist/esm/Overlay/style/style.css

@@ -0,0 +1 @@
+.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overflow-hidden{overflow:hidden!important}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}

package/dist/esm/Overlay.js

@@ -1,6 +1,7 @@
-import { O as Overlay } from './overlay-ed3eb37d.js';
-export { O as default } from './overlay-ed3eb37d.js';
-import 'react';
-import 'classnames';
-import './bem-893ad28d.js';
-import '@bem-react/classname';
+import { O as Overlay } from "./overlay2.js";
+import "react";
+import "classnames";
+import "./typings.js";
+export {
+  Overlay as default
+};

package/dist/esm/Pagination/style/css.js

@@ -0,0 +1 @@
+import './style.css'

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

@@ -1,2 +1,2 @@
 
-require('../../../packages/pagination/pagination.scss')
+import '../../../packages/pagination/pagination.scss'

package/dist/esm/Pagination/style/style.css

@@ -0,0 +1 @@
+.nut-pagination{display:flex;font-size:var(--nutui-pagination-font-size, var(--nutui-font-size-2, 14px));color:var(--nutui-pagination-color, var(--nutui-brand-color, #fa2c19))}.nut-pagination__contain{display:flex}.nut-pagination__simple{height:39px;width:124px;line-height:39px;text-align:center}.nut-pagination__prev,.nut-pagination__item,.nut-pagination__next{height:39px;min-width:39px;flex-shrink:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:var(--nutui-gray-6, #ffffff);border-radius:var(--nutui-pagination-item-border-radius, 2px);border:var(--nutui-pagination-item-border-width, 1px) solid var(--nutui-pagination-item-border-color, #e4e7eb);cursor:pointer}.nut-pagination__prev,.nut-pagination__item{border-right:none}.nut-pagination__prev,.nut-pagination__next{padding:var(--nutui-pagination-prev-next-padding, 0 11px)}.nut-pagination .simple-border{border-right:var(--nutui-pagination-item-border-width, 1px) solid var(--nutui-pagination-item-border-color, #e4e7eb)}.nut-pagination .active{color:var(--nutui-gray-6, #ffffff);border:none;background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%)}.nut-pagination .disabled{color:var(--nutui-pagination-disable-color, var(--nutui-gray-3, #bfbfbf));background-color:var(--nutui-pagination-disable-background-color, #f7f8fa);cursor:not-allowed}