@nutui/nutui-react-taro 1.2.2-beta.0

package/dist/esm/searchbar.taro-b05ef5a8.js

@@ -0,0 +1,246 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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, { useRef, useState, useEffect } from 'react';
+import { c as cn } from './bem-893ad28d.js';
+import { u as useConfig } from './configprovider-18657611.js';
+import { I as Icon } from './icon-62bd7379.js';
+var defaultProps = {
+  placeholder: '',
+  shape: 'square',
+  disabled: false,
+  maxLength: 9999,
+  clearable: true,
+  align: 'left',
+  readonly: true,
+  autoFocus: false,
+  label: '',
+  leftinIcon: React__default.createElement(Icon, {
+    name: "search",
+    size: "12"
+  })
+};
+
+var SearchBar = function SearchBar(props) {
+  var searchbarBem = cn('searchbar');
+
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale;
+
+  var searchRef = useRef(null);
+
+  var _useState = useState(function () {
+    return props.value;
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      value = _useState2[0],
+      setValue = _useState2[1];
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      placeholder = _defaultProps$props.placeholder,
+      shape = _defaultProps$props.shape,
+      className = _defaultProps$props.className,
+      disabled = _defaultProps$props.disabled,
+      maxLength = _defaultProps$props.maxLength,
+      clearable = _defaultProps$props.clearable,
+      align = _defaultProps$props.align,
+      readOnly = _defaultProps$props.readOnly,
+      autoFocus = _defaultProps$props.autoFocus,
+      label = _defaultProps$props.label,
+      actionText = _defaultProps$props.actionText,
+      leftinIcon = _defaultProps$props.leftinIcon,
+      rightinIcon = _defaultProps$props.rightinIcon,
+      leftoutIcon = _defaultProps$props.leftoutIcon,
+      rightoutIcon = _defaultProps$props.rightoutIcon,
+      onChange = _defaultProps$props.onChange,
+      onFocus = _defaultProps$props.onFocus,
+      onBlur = _defaultProps$props.onBlur,
+      onClear = _defaultProps$props.onClear,
+      onSearch = _defaultProps$props.onSearch,
+      onClickInput = _defaultProps$props.onClickInput,
+      onClickLeftinIcon = _defaultProps$props.onClickLeftinIcon,
+      onClickLeftoutIcon = _defaultProps$props.onClickLeftoutIcon,
+      onClickRightinIcon = _defaultProps$props.onClickRightinIcon,
+      onClickRightoutIcon = _defaultProps$props.onClickRightoutIcon;
+
+  var alignClass = "".concat(align);
+
+  var change = function change(event) {
+    var value = event.target.value;
+    onChange && (onChange === null || onChange === void 0 ? void 0 : onChange(value, event));
+    setValue(value);
+  };
+
+  var focus = function focus(event) {
+    var value = event.target.value;
+    onFocus && (onFocus === null || onFocus === void 0 ? void 0 : onFocus(value, event));
+  };
+
+  var blur = function blur(event) {
+    var searchSelf = searchRef.current;
+    searchSelf && searchSelf.blur();
+    var value = event.target.value;
+    onBlur && (onBlur === null || onBlur === void 0 ? void 0 : onBlur(value, event));
+  };
+
+  useEffect(function () {
+    setValue(props.value);
+  }, [props.value]);
+  useEffect(function () {
+    if (autoFocus) {
+      var searchSelf = searchRef.current;
+      searchSelf && searchSelf.focus();
+    }
+  }, [autoFocus]);
+
+  var renderField = function renderField() {
+    return React__default.createElement("input", {
+      className: "".concat(searchbarBem('input'), "  ").concat(searchbarBem(alignClass), " ").concat(shape === 'round' ? searchbarBem('round') : '', " ").concat(clearable ? searchbarBem('input-clear') : ''),
+      ref: searchRef,
+      style: _objectSpread(_objectSpread({}, props.style), {}, {
+        background: props.inputBackground
+      }),
+      value: value || '',
+      placeholder: placeholder || locale.placeholder,
+      disabled: disabled,
+      readOnly: readOnly,
+      maxLength: maxLength,
+      onChange: function onChange(e) {
+        return change(e);
+      },
+      onFocus: function onFocus(e) {
+        return focus(e);
+      },
+      onBlur: function onBlur(e) {
+        return blur(e);
+      },
+      onClick: function onClick(e) {
+        return clickInput(e);
+      }
+    });
+  };
+
+  var clickInput = function clickInput(e) {
+    onClickInput && onClickInput(e);
+  };
+
+  var renderLeftinIcon = function renderLeftinIcon() {
+    if (!leftinIcon) return null;
+    return React__default.createElement("div", {
+      className: "".concat(searchbarBem('leftin-icon'), " ").concat(searchbarBem('icon')),
+      onClick: function onClick(e) {
+        return clickLeftIcon('in-left', e);
+      }
+    }, leftinIcon);
+  };
+
+  var renderLeftoutIcon = function renderLeftoutIcon() {
+    if (!leftoutIcon) return null;
+    return React__default.createElement("div", {
+      className: "".concat(searchbarBem('leftout-icon')),
+      onClick: function onClick(e) {
+        return clickLeftIcon('out-left', e);
+      }
+    }, leftoutIcon);
+  };
+
+  var clickLeftIcon = function clickLeftIcon(flag, event) {
+    if (flag === 'in-left') {
+      onClickLeftinIcon && onClickLeftinIcon(value, event);
+    } else {
+      onClickLeftoutIcon && onClickLeftoutIcon(value, event);
+    }
+  };
+
+  var renderRightinIcon = function renderRightinIcon() {
+    if (!rightinIcon) return null;
+    return React__default.createElement("div", {
+      className: "".concat(searchbarBem('rightin-icon'), " ").concat(searchbarBem('icon')),
+      onClick: function onClick(e) {
+        return clickRightIcon('in-right', e);
+      }
+    }, rightinIcon);
+  };
+
+  var renderRightoutIcon = function renderRightoutIcon() {
+    if (!rightoutIcon) return null;
+    return React__default.createElement("div", {
+      className: "".concat(searchbarBem('rightout-icon')),
+      onClick: function onClick(e) {
+        return clickRightIcon('out-right', e);
+      }
+    }, rightoutIcon);
+  };
+
+  var clickRightIcon = function clickRightIcon(flag, event) {
+    if (flag === 'in-left') {
+      onClickRightinIcon && onClickRightinIcon(value, event);
+    } else {
+      onClickRightoutIcon && onClickRightoutIcon(value, event);
+    }
+  };
+
+  var handleClear = function handleClear() {
+    return React__default.createElement("div", {
+      className: "".concat(searchbarBem('clear'), " ").concat(rightinIcon ? 'pos-right' : ''),
+      onClick: function onClick(e) {
+        return clearaVal(e);
+      }
+    }, React__default.createElement(Icon, {
+      name: "circle-close",
+      size: "12",
+      color: "#555"
+    }));
+  };
+
+  var clearaVal = function clearaVal(event) {
+    if (disabled || readOnly) {
+      return;
+    }
+
+    setValue('');
+    onClear && onClear(event);
+  };
+
+  var renderRightLabel = function renderRightLabel() {
+    if (actionText) {
+      return React__default.createElement("div", {
+        className: searchbarBem('action-text'),
+        onClick: search
+      }, actionText);
+    }
+
+    return null;
+  };
+
+  var search = function search() {
+    onSearch && onSearch(value);
+  };
+
+  var renderLabel = function renderLabel() {
+    if (label) {
+      return React__default.createElement("div", {
+        className: searchbarBem('label')
+      }, label);
+    }
+
+    return null;
+  };
+
+  return React__default.createElement("div", {
+    className: "".concat(searchbarBem(), " ").concat(disabled ? searchbarBem('disabled') : '', "  ").concat(className || ''),
+    style: _objectSpread(_objectSpread({}, props.style), {}, {
+      background: props.background
+    })
+  }, renderLeftoutIcon(), renderLabel(), React__default.createElement("div", {
+    className: "".concat(searchbarBem('content'))
+  }, renderLeftinIcon(), renderField(), renderRightinIcon(), clearable && value && handleClear()), renderRightoutIcon(), renderRightLabel());
+};
+
+SearchBar.defaultProps = defaultProps;
+SearchBar.displayName = 'NutSearchBar';
+export { SearchBar as S };

package/dist/esm/shortpassword.taro-aad27ce9.js

@@ -0,0 +1,206 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["title", "desc", "tips", "visible", "modelValue", "errorMsg", "noButton", "closeOnClickOverlay", "length", "style", "className", "change", "onOk", "onTips", "onCancel", "onClose", "complete"];
+
+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, { useRef, useState, useEffect } from 'react';
+import { c as cn } from './bem-893ad28d.js';
+import { P as Popup } from './popup-15922d84.js';
+import { I as Icon } from './icon-62bd7379.js';
+import { u as useConfig } from './configprovider-18657611.js';
+var defaultProps = {
+  title: '请输入密码',
+  desc: '您使用了虚拟资产，请进行验证',
+  tips: '忘记密码',
+  visible: false,
+  modelValue: '',
+  errorMsg: '',
+  noButton: true,
+  closeOnClickOverlay: true,
+  length: 6,
+  className: '',
+  change: function change(value) {},
+  onOk: function onOk(value) {},
+  onCancel: function onCancel() {},
+  onClose: function onClose() {},
+  onTips: function onTips() {},
+  complete: function complete(value) {}
+};
+
+var ShortPassword = function ShortPassword(props) {
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale;
+
+  var title = props.title,
+      desc = props.desc,
+      tips = props.tips,
+      visible = props.visible,
+      modelValue = props.modelValue,
+      errorMsg = props.errorMsg,
+      noButton = props.noButton,
+      closeOnClickOverlay = props.closeOnClickOverlay,
+      length = props.length,
+      style = props.style,
+      className = props.className,
+      change = props.change,
+      onOk = props.onOk,
+      onTips = props.onTips,
+      onCancel = props.onCancel,
+      onClose = props.onClose,
+      complete = props.complete,
+      reset = _objectWithoutProperties(props, _excluded);
+
+  var b = cn('shortpassword');
+  var textInput = useRef(null);
+
+  var range = function range(val) {
+    return Math.min(Math.max(4, val), 6);
+  };
+
+  var _useState = useState(visible),
+      _useState2 = _slicedToArray(_useState, 2),
+      innerVisible = _useState2[0],
+      setInnerVisible = _useState2[1];
+
+  var _useState3 = useState(range(Number(length))),
+      _useState4 = _slicedToArray(_useState3, 2),
+      comLen = _useState4[0],
+      setComLen = _useState4[1];
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      inputValue = _useState6[0],
+      setInputValue = _useState6[1];
+
+  useEffect(function () {
+    setInnerVisible(visible);
+  }, [visible]);
+  useEffect(function () {
+    if (modelValue) {
+      setInputValue(modelValue);
+    }
+  }, [modelValue]);
+
+  var changeValue = function changeValue(e) {
+    var inputValue = e.target.value;
+
+    if (String(inputValue).length > comLen) {
+      inputValue = inputValue.slice(0, comLen);
+    }
+
+    setInputValue(inputValue);
+
+    if (String(inputValue).length === comLen) {
+      complete && complete(inputValue);
+    }
+
+    change && change(inputValue);
+  };
+
+  var systemStyle = function systemStyle() {
+    var u = navigator.userAgent;
+    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; // g
+
+    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
+
+    if (isIOS) {
+      return {
+        paddingRight: '1200px'
+      };
+    }
+
+    if (isAndroid) {
+      return {
+        opacity: 0,
+        zIndex: 10
+      };
+    }
+  };
+
+  var focus = function focus() {
+    if (textInput.current) {
+      textInput.current.focus();
+    }
+  };
+
+  var sure = function sure() {
+    onOk && onOk(inputValue);
+  };
+
+  return React__default.createElement("div", null, React__default.createElement(Popup, {
+    style: {
+      padding: '32px 24px 28px 24px',
+      borderRadius: '12px',
+      textAlign: 'center'
+    },
+    visible: innerVisible,
+    closeable: true,
+    "close-on-click-overlay": closeOnClickOverlay,
+    onClickOverlay: onClose,
+    onClickCloseIcon: onClose
+  }, React__default.createElement("div", _objectSpread({
+    className: "".concat(b(), " ").concat(className),
+    style: _objectSpread({}, style)
+  }, reset), React__default.createElement("div", {
+    className: b('title')
+  }, locale.shortpassword.title || title), React__default.createElement("div", {
+    className: b('subtitle')
+  }, locale.shortpassword.desc || desc), React__default.createElement("div", {
+    className: b('input')
+  }, React__default.createElement("input", {
+    ref: textInput,
+    className: b('input-real'),
+    type: "number",
+    style: systemStyle(),
+    maxLength: 6,
+    value: inputValue,
+    onChange: function onChange(e) {
+      return changeValue(e);
+    }
+  }), React__default.createElement("div", {
+    className: b('input-site')
+  }), React__default.createElement("div", {
+    className: b('input-fake'),
+    onClick: function onClick() {
+      return focus();
+    }
+  }, _toConsumableArray(new Array(comLen).keys()).map(function (item, index) {
+    return React__default.createElement("div", {
+      className: b('input-fake__li'),
+      key: index
+    }, String(inputValue).length > index ? React__default.createElement("div", {
+      className: b('input-fake__li__icon')
+    }) : null);
+  }))), React__default.createElement("div", {
+    className: b('message')
+  }, React__default.createElement("div", {
+    className: b('message__error')
+  }, errorMsg), tips ? React__default.createElement("div", {
+    className: b('message__forget')
+  }, React__default.createElement(Icon, {
+    className: "icon",
+    size: "11px",
+    name: "tips"
+  }), React__default.createElement("div", {
+    onClick: onTips
+  }, locale.shortpassword.tips || tips)) : null), !noButton ? React__default.createElement("div", {
+    className: b('footer')
+  }, React__default.createElement("div", {
+    className: b('footer__cancel'),
+    onClick: onCancel
+  }, locale.cancel), React__default.createElement("div", {
+    className: b('footer__sure'),
+    onClick: function onClick() {
+      return sure();
+    }
+  }, locale.confirm)) : null)));
+};
+
+ShortPassword.defaultProps = defaultProps;
+ShortPassword.displayName = 'NutShortPassword';
+export { ShortPassword as S };

package/dist/esm/signature.taro-454c5413.js

@@ -0,0 +1,178 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["type", "lineWidth", "strokeStyle", "unSupportTpl", "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, { useRef, useState, useEffect } from 'react';
+import { B as Button } from './button-9b1f3219.js';
+import { c as cn } from './bem-893ad28d.js';
+import { u as useConfig } from './configprovider-18657611.js';
+var defaultProps = {
+  type: 'png',
+  lineWidth: 2,
+  strokeStyle: '#000',
+  unSupportTpl: '对不起，当前浏览器不支持Canvas，无法使用本控件！',
+  className: ''
+};
+
+var Signature = function Signature(props) {
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      type = _defaultProps$props.type,
+      lineWidth = _defaultProps$props.lineWidth,
+      strokeStyle = _defaultProps$props.strokeStyle,
+      unSupportTpl = _defaultProps$props.unSupportTpl,
+      className = _defaultProps$props.className,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var b = cn('signature');
+  var canvasRef = useRef(null);
+  var wrapRef = useRef(null);
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      canvasHeight = _useState2[0],
+      setCanvasHeight = _useState2[1];
+
+  var _useState3 = useState(0),
+      _useState4 = _slicedToArray(_useState3, 2),
+      canvasWidth = _useState4[0],
+      setCanvasWidth = _useState4[1];
+
+  var ctx = useRef(null);
+
+  var isCanvasSupported = function isCanvasSupported() {
+    var elem = document.createElement('canvas');
+    return !!(elem.getContext && elem.getContext('2d'));
+  };
+
+  var isSupportTouch = ('ontouchstart' in window);
+  var events = isSupportTouch ? ['touchstart', 'touchmove', 'touchend', 'touchleave'] : ['mousedown', 'mousemove', 'mouseup', 'mouseleave'];
+  useEffect(function () {
+    if (isCanvasSupported() && canvasRef.current && wrapRef.current) {
+      ctx.current = canvasRef.current.getContext('2d');
+      setCanvasWidth(wrapRef.current.offsetWidth);
+      setCanvasHeight(wrapRef.current.offsetHeight);
+      addEvent();
+    }
+  }, []);
+
+  var startEventHandler = function startEventHandler(event) {
+    event.preventDefault();
+
+    if (ctx.current && canvasRef.current) {
+      ctx.current.beginPath();
+      ctx.current.lineWidth = lineWidth;
+      ctx.current.strokeStyle = strokeStyle;
+      canvasRef.current.addEventListener(events[1], moveEventHandler, false);
+      canvasRef.current.addEventListener(events[2], endEventHandler, false);
+      canvasRef.current.addEventListener(events[3], leaveEventHandler, false);
+    }
+  };
+
+  var addEvent = function addEvent() {
+    if (canvasRef.current) {
+      canvasRef.current.addEventListener(events[0], startEventHandler, false);
+    }
+  };
+
+  var moveEventHandler = function moveEventHandler(event) {
+    event.preventDefault();
+    var evt = isSupportTouch ? event.touches[0] : event;
+
+    if (canvasRef.current && ctx.current) {
+      var coverPos = canvasRef.current.getBoundingClientRect();
+      var mouseX = evt.clientX - coverPos.left;
+      var mouseY = evt.clientY - coverPos.top;
+      ctx.current.lineTo(mouseX, mouseY);
+      ctx.current.stroke();
+    }
+  };
+
+  var endEventHandler = function endEventHandler(event) {
+    event.preventDefault();
+
+    if (canvasRef.current) {
+      canvasRef.current.removeEventListener(events[1], moveEventHandler, false);
+      canvasRef.current.removeEventListener(events[2], endEventHandler, false);
+    }
+  };
+
+  var leaveEventHandler = function leaveEventHandler(event) {
+    event.preventDefault();
+
+    if (canvasRef.current) {
+      canvasRef.current.removeEventListener(events[1], moveEventHandler, false);
+      canvasRef.current.removeEventListener(events[2], endEventHandler, false);
+    }
+  };
+
+  var clear = function clear() {
+    if (canvasRef.current && ctx.current) {
+      canvasRef.current.addEventListener(events[2], endEventHandler, false);
+      ctx.current.clearRect(0, 0, canvasWidth, canvasHeight);
+      ctx.current.closePath();
+    }
+
+    props.clear && props.clear();
+  };
+
+  var confirm = function confirm() {
+    onSave(canvasRef.current);
+  };
+
+  var onSave = function onSave(canvas) {
+    var dataurl;
+
+    switch (type) {
+      case 'png':
+        dataurl = canvas.toDataURL('image/png');
+        break;
+
+      case 'jpg':
+        dataurl = canvas.toDataURL('image/jpeg', 0.8);
+        break;
+
+      default:
+        dataurl = canvas.toDataURL('image/png');
+    }
+
+    clear();
+    props.confirm && props.confirm(canvas, dataurl);
+  };
+
+  return React__default.createElement("div", _objectSpread({
+    className: "".concat(b(), " ").concat(className)
+  }, rest), React__default.createElement("div", {
+    className: "".concat(b('inner')),
+    ref: wrapRef
+  }, isCanvasSupported() ? React__default.createElement("canvas", {
+    ref: canvasRef,
+    height: canvasHeight,
+    width: canvasWidth
+  }) : React__default.createElement("p", {
+    className: "".concat(b('unsopport'))
+  }, locale.signature.unSupportTpl || unSupportTpl)), React__default.createElement(Button, {
+    className: "".concat(b('btn')),
+    type: "default",
+    onClick: function onClick() {
+      return clear();
+    }
+  }, locale.signature.reSign), React__default.createElement(Button, {
+    className: "".concat(b('btn')),
+    type: "primary",
+    onClick: function onClick() {
+      return confirm();
+    }
+  }, locale.confirm));
+};
+
+Signature.defaultProps = defaultProps;
+Signature.displayName = 'NutSignature';
+export { Signature as S };