@nutui/nutui-react-taro 1.2.2-beta.0 → 1.3.0-beta.5

package/dist/esm/input.taro-2e31ebbb.js

@@ -0,0 +1,392 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children", "type", "defaultValue", "placeholder", "label", "labelClass", "labelWidth", "labelAlign", "colon", "inputAlign", "center", "required", "disabled", "readonly", "error", "maxlength", "leftIcon", "leftIconSize", "rightIcon", "rightIconSize", "clearable", "clearIcon", "clearSize", "border", "formatTrigger", "rules", "errorMessage", "errorMessageAlign", "showWordLimit", "autofocus", "style", "className", "rows", "slotButton", "slotInput", "change", "blur", "focus", "clear", "formatter", "keypress", "clickInput", "clickLeftIcon", "clickRightIcon", "click"];
+
+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, useLayoutEffect, useEffect, useCallback } from 'react';
+import { I as Icon } from './icon-8dc4de10.js';
+import { u as useConfig } from './configprovider-18657611.js';
+
+function trimExtraChar(value, _char, regExp) {
+  var index = value.indexOf(_char);
+
+  if (index === -1) {
+    return value;
+  }
+
+  if (_char === '-' && index !== 0) {
+    return value.slice(0, index);
+  }
+
+  return value.slice(0, index + 1) + value.slice(index).replace(regExp, '');
+}
+
+function formatNumber(value) {
+  var allowDot = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  var allowMinus = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+
+  if (allowDot) {
+    value = trimExtraChar(value, '.', /\./g);
+  } else {
+    value = value.split('.')[0];
+  }
+
+  if (allowMinus) {
+    value = trimExtraChar(value, '-', /-/g);
+  } else {
+    value = value.replace(/-/, '');
+  }
+
+  var regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
+  return value.replace(regExp, '');
+}
+
+var defaultProps = {
+  type: 'text',
+  defaultValue: '',
+  placeholder: '',
+  label: '',
+  labelClass: '',
+  labelWidth: '80',
+  labelAlign: 'left',
+  colon: false,
+  inputAlign: 'left',
+  center: false,
+  required: false,
+  disabled: false,
+  readonly: false,
+  error: false,
+  maxlength: '9999',
+  leftIcon: '',
+  leftIconSize: '',
+  rightIcon: '',
+  rightIconSize: '',
+  clearable: false,
+  clearIcon: 'mask-close',
+  clearSize: '14',
+  border: true,
+  formatTrigger: 'onChange',
+  rules: [],
+  rows: null,
+  errorMessage: '',
+  errorMessageAlign: '',
+  showWordLimit: false,
+  autofocus: false,
+  slotButton: null,
+  slotInput: null
+};
+
+var Input = function Input(props) {
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      children = _defaultProps$props.children,
+      type = _defaultProps$props.type,
+      defaultValue = _defaultProps$props.defaultValue,
+      placeholder = _defaultProps$props.placeholder,
+      label = _defaultProps$props.label,
+      labelClass = _defaultProps$props.labelClass,
+      labelWidth = _defaultProps$props.labelWidth,
+      labelAlign = _defaultProps$props.labelAlign,
+      colon = _defaultProps$props.colon,
+      inputAlign = _defaultProps$props.inputAlign,
+      center = _defaultProps$props.center,
+      required = _defaultProps$props.required,
+      disabled = _defaultProps$props.disabled,
+      readonly = _defaultProps$props.readonly,
+      error = _defaultProps$props.error,
+      maxlength = _defaultProps$props.maxlength,
+      leftIcon = _defaultProps$props.leftIcon,
+      leftIconSize = _defaultProps$props.leftIconSize,
+      rightIcon = _defaultProps$props.rightIcon,
+      rightIconSize = _defaultProps$props.rightIconSize,
+      clearable = _defaultProps$props.clearable,
+      clearIcon = _defaultProps$props.clearIcon,
+      clearSize = _defaultProps$props.clearSize,
+      border = _defaultProps$props.border,
+      formatTrigger = _defaultProps$props.formatTrigger,
+      rules = _defaultProps$props.rules,
+      errorMessage = _defaultProps$props.errorMessage,
+      errorMessageAlign = _defaultProps$props.errorMessageAlign,
+      showWordLimit = _defaultProps$props.showWordLimit,
+      autofocus = _defaultProps$props.autofocus,
+      style = _defaultProps$props.style,
+      className = _defaultProps$props.className,
+      rows = _defaultProps$props.rows,
+      slotButton = _defaultProps$props.slotButton,
+      slotInput = _defaultProps$props.slotInput,
+      change = _defaultProps$props.change,
+      blur = _defaultProps$props.blur,
+      focus = _defaultProps$props.focus,
+      clear = _defaultProps$props.clear,
+      formatter = _defaultProps$props.formatter,
+      keypress = _defaultProps$props.keypress,
+      clickInput = _defaultProps$props.clickInput,
+      clickLeftIcon = _defaultProps$props.clickLeftIcon,
+      clickRightIcon = _defaultProps$props.clickRightIcon,
+      click = _defaultProps$props.click,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  locale.placeholder = placeholder || locale.placeholder;
+
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      inputValue = _useState2[0],
+      SetInputValue = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      active = _useState4[0],
+      SetActive = _useState4[1];
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      classes = _useState6[0],
+      setClasses = _useState6[1];
+
+  var getModelValue = function getModelValue() {
+    return String(inputValue !== null && inputValue !== void 0 ? inputValue : '');
+  };
+
+  var inputRef = useRef(null);
+  useLayoutEffect(function () {
+    updateValue(getModelValue(), formatTrigger);
+  });
+  useEffect(function () {
+    setClasses(inputClass);
+
+    if (defaultValue) {
+      SetInputValue(defaultValue);
+    }
+  }, [defaultValue]);
+  useEffect(function () {
+    if (inputValue) {
+      updateValue(getModelValue());
+      resetValidation();
+    }
+  }, [inputValue]);
+  var inputClass = useCallback(function () {
+    var prefixCls = 'nut-input';
+    return [prefixCls, "".concat(center ? 'center' : ''), "".concat(disabled ? "".concat(prefixCls, "-disabled") : ''), "".concat(required ? "".concat(prefixCls, "-required") : ''), "".concat(error ? "".concat(prefixCls, "-error") : ''), "".concat(border ? "".concat(prefixCls, "-border") : '')].filter(Boolean).join(' ');
+  }, [disabled, required, error, border]);
+
+  var updateValue = function updateValue(value) {
+    var _inputRef$current;
+
+    var trigger = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'onChange';
+    var val = value;
+
+    if (type === 'digit' || type === 'tel') {
+      val = formatNumber(val, false, false);
+    }
+
+    if (type === 'number') {
+      val = formatNumber(val, true, true);
+    }
+
+    if (type === 'tel' && !formatter) {
+      var regTel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
+      var regNumber = /[^-0-9]/g;
+      val = !regTel.test(val) && val.length > 11 ? val.substring(0, 11) : val.replace(regNumber, '');
+    }
+
+    if (formatter && trigger === formatTrigger) {
+      val = formatter(val);
+    }
+
+    if ((inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value) !== val) {
+      inputRef.current.value = val;
+    } // if (val !== defaultValue) {
+
+
+    SetInputValue(val); // }
+  };
+
+  var _onFocus = function onFocus(event) {
+    var val = event.target.value;
+    SetActive(true);
+    focus && focus(val, event);
+  };
+
+  var _onInput = function onInput(event) {
+    var val = event.target.value;
+
+    if (maxlength && val.length > Number(maxlength)) {
+      val = val.slice(0, Number(maxlength));
+    }
+
+    updateValue(val);
+    change && change(val, event);
+  };
+
+  var _onBlur = function onBlur(event) {
+    setTimeout(function () {
+      SetActive(false);
+    }, 200);
+    var val = event.target.value;
+
+    if (maxlength && val.length > Number(maxlength)) {
+      val = val.slice(0, Number(maxlength));
+    }
+
+    updateValue(getModelValue(), 'onBlur');
+    blur && blur(val, event);
+  };
+
+  var onClickInput = function onClickInput(event) {
+    clickInput && clickInput(event);
+  };
+
+  var onClickLeftIcon = function onClickLeftIcon(event) {
+    clickLeftIcon && clickLeftIcon(event);
+  };
+
+  var onClickRightIcon = function onClickRightIcon(event) {
+    clickRightIcon && clickRightIcon(event);
+  };
+
+  var resetValidation = function resetValidation() {};
+
+  var inputType = function inputType(type) {
+    if (type === 'number') {
+      return 'text';
+    }
+
+    if (type === 'digit') {
+      return 'tel';
+    }
+
+    return type;
+  };
+
+  var handleClear = function handleClear(event) {
+    updateValue('');
+    clear && clear('', event);
+  };
+
+  return React__default.createElement("div", _objectSpread(_objectSpread({
+    className: "".concat(classes, "  ").concat(className || ''),
+    style: style
+  }, rest), {}, {
+    onClick: function onClick(e) {
+      click && click(e);
+    }
+  }), slotInput ? React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+    className: "nut-input-label ".concat(labelClass),
+    style: {
+      width: "".concat(labelWidth, "px"),
+      textAlign: labelAlign
+    }
+  }, React__default.createElement("div", {
+    className: "label-string"
+  }, label, colon ? ':' : '')), React__default.createElement("div", {
+    className: "nut-input-value"
+  }, React__default.createElement("div", {
+    className: "nut-input-inner",
+    onClick: function onClick(e) {
+      onClickInput(e);
+    }
+  }, slotInput))) : React__default.createElement(React__default.Fragment, null, leftIcon && leftIcon.length > 0 ? React__default.createElement("div", {
+    className: "nut-input-left-icon",
+    onClick: function onClick(e) {
+      onClickLeftIcon(e);
+    }
+  }, React__default.createElement(Icon, {
+    name: leftIcon,
+    size: leftIconSize
+  })) : null, React__default.createElement("div", {
+    className: "nut-input-label ".concat(labelClass),
+    style: {
+      width: "".concat(labelWidth, "px"),
+      textAlign: labelAlign
+    }
+  }, React__default.createElement("div", {
+    className: "label-string"
+  }, label, colon ? ':' : '')), React__default.createElement("div", {
+    className: "nut-input-value"
+  }, React__default.createElement("div", {
+    className: "nut-input-inner",
+    onClick: function onClick(e) {
+      onClickInput(e);
+    }
+  }, type === 'textarea' ? React__default.createElement("textarea", {
+    className: "input-text",
+    ref: inputRef,
+    style: {
+      textAlign: inputAlign,
+      height: "".concat(Number(rows) * 24, "px")
+    },
+    maxLength: maxlength,
+    placeholder: placeholder || locale.placeholder,
+    disabled: disabled,
+    readOnly: readonly,
+    value: inputValue,
+    autoFocus: autofocus,
+    onBlur: function onBlur(e) {
+      _onBlur(e);
+    },
+    onFocus: function onFocus(e) {
+      _onFocus(e);
+    },
+    onInput: function onInput(e) {
+      _onInput(e);
+    }
+  }) : React__default.createElement("input", {
+    className: "input-text",
+    ref: inputRef,
+    style: {
+      textAlign: inputAlign
+    },
+    type: inputType(type),
+    maxLength: maxlength,
+    placeholder: placeholder || locale.placeholder,
+    disabled: disabled,
+    readOnly: readonly,
+    value: inputValue,
+    autoFocus: autofocus,
+    onBlur: function onBlur(e) {
+      _onBlur(e);
+    },
+    onFocus: function onFocus(e) {
+      _onFocus(e);
+    },
+    onInput: function onInput(e) {
+      _onInput(e);
+    }
+  }), clearable && !readonly && active && inputValue.length > 0 ? React__default.createElement(Icon, {
+    className: "nut-input-clear",
+    name: clearIcon,
+    size: clearSize,
+    onClick: function onClick(e) {
+      handleClear(e);
+    }
+  }) : null, rightIcon && rightIcon.length > 0 ? React__default.createElement("div", {
+    className: "nut-input-right-icon",
+    onClick: function onClick(e) {
+      onClickRightIcon(e);
+    }
+  }, React__default.createElement(Icon, {
+    name: rightIcon,
+    size: rightIconSize
+  })) : null, slotButton ? React__default.createElement("div", {
+    className: "nut-input-button"
+  }, slotButton) : null), showWordLimit && maxlength ? React__default.createElement("div", {
+    className: "nut-input-word-limit"
+  }, React__default.createElement("span", {
+    className: "nut-input-word-num"
+  }, inputValue ? inputValue.length : 0), "/", maxlength) : null, errorMessage ? React__default.createElement("div", {
+    className: "nut-input-error-message",
+    style: {
+      textAlign: errorMessageAlign
+    }
+  }, errorMessage) : null)));
+};
+
+Input.defaultProps = defaultProps;
+Input.displayName = 'NutInput';
+export { Input as I };

package/dist/esm/{inputnumber.taro-4ec2bfb6.js → inputnumber.taro-75662231.js}

@@ -9,7 +9,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React__default, { useState, useEffect } from 'react';
 import classNames from 'classnames';
-import { I as Icon } from './icon-62bd7379.js';
+import { I as Icon } from './icon-8dc4de10.js';
 import { c as cn } from './bem-893ad28d.js';
 var defaultProps = {
   disabled: false,
@@ -88,16 +88,16 @@ var InputNumber = function InputNumber(props) {
   };
 
   var emitChange = function emitChange(value, e) {
-    var output_value = fixedDecimalPlaces(value);
-    change && change(output_value, e);
+    var outputValue = fixedDecimalPlaces(value);
+    change && change(outputValue, e);
 
     if (!isAsync) {
-      if (Number(output_value) < Number(min)) {
+      if (Number(outputValue) < Number(min)) {
         setInputValue(Number(min));
-      } else if (Number(output_value) > Number(max)) {
+      } else if (Number(outputValue) > Number(max)) {
         setInputValue(Number(max));
       } else {
-        setInputValue(output_value);
+        setInputValue(outputValue);
       }
     }
   };
@@ -106,8 +106,8 @@ var InputNumber = function InputNumber(props) {
     reduce && reduce(e);
 
     if (reduceAllow()) {
-      var output_value = Number(inputValue) - Number(step);
-      emitChange(output_value, e);
+      var outputValue = Number(inputValue) - Number(step);
+      emitChange(outputValue, e);
     } else {
       overlimit && overlimit(e);
     }
@@ -117,22 +117,22 @@ var InputNumber = function InputNumber(props) {
     add && add(e);
 
     if (addAllow()) {
-      var output_value = Number(inputValue) + Number(step);
-      emitChange(output_value, e);
+      var outputValue = Number(inputValue) + Number(step);
+      emitChange(outputValue, e);
     } else {
       overlimit && overlimit(e);
     }
   };
 
   var changeValue = function changeValue(e) {
-    var input = e.target;
-    change && change(input.valueAsNumber, e);
+    var value = Number(e.detail.value);
+    change && change(value, e);
 
     if (!isAsync) {
-      if (Number.isNaN(input.valueAsNumber)) {
+      if (Number.isNaN(value)) {
         setInputValue(inputValue);
       } else {
-        setInputValue(input.valueAsNumber);
+        setInputValue(value);
       }
     }
   };
@@ -146,8 +146,7 @@ var InputNumber = function InputNumber(props) {
   var burValue = function burValue(e) {
     if (disabled) return;
     if (readonly) return;
-    var input = e.target;
-    var value = input.valueAsNumber;
+    var value = Number(e.detail.value);
 
     if (value < Number(min)) {
       value = Number(min);
@@ -166,7 +165,7 @@ var InputNumber = function InputNumber(props) {
     className: iconMinusClasses,
     size: buttonSize,
     name: "minus",
-    click: reduceNumber
+    onClick: reduceNumber
   }), React__default.createElement("input", {
     type: "number",
     min: min,
@@ -184,7 +183,7 @@ var InputNumber = function InputNumber(props) {
     className: iconAddClasses,
     size: buttonSize,
     name: "plus",
-    click: addNumber
+    onClick: addNumber
   }));
 };
 

package/dist/esm/navbar.taro-f2eae6a6.js

@@ -0,0 +1,123 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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 { I as Icon } from './icon-8dc4de10.js';
+import { c as cn } from './bem-893ad28d.js';
+var defaultProps = {
+  title: '',
+  desc: '',
+  leftShow: true,
+  titIcon: '',
+  className: '',
+  leftText: '',
+  fixed: false,
+  safeAreaInsetTop: false,
+  border: false,
+  placeholder: false,
+  zIndex: 10,
+  style: {}
+};
+
+var NavBar = function NavBar(props) {
+  var _classNames;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      desc = _defaultProps$props.desc,
+      title = _defaultProps$props.title,
+      titIcon = _defaultProps$props.titIcon,
+      leftShow = _defaultProps$props.leftShow,
+      className = _defaultProps$props.className,
+      style = _defaultProps$props.style,
+      leftText = _defaultProps$props.leftText,
+      fixed = _defaultProps$props.fixed,
+      safeAreaInsetTop = _defaultProps$props.safeAreaInsetTop,
+      border = _defaultProps$props.border,
+      placeholder = _defaultProps$props.placeholder,
+      zIndex = _defaultProps$props.zIndex,
+      onClickTitle = _defaultProps$props.onClickTitle,
+      onClickIcon = _defaultProps$props.onClickIcon,
+      onClickBack = _defaultProps$props.onClickBack,
+      onClickRight = _defaultProps$props.onClickRight;
+
+  var b = cn('navbar');
+  var children = Array.isArray(props.children) ? props.children : [props.children];
+  var slot = children.reduce(function (slot, item) {
+    var data = slot;
+
+    if (item && item.props) {
+      data[item.props.slot] = item;
+    }
+
+    return data;
+  }, {});
+
+  var styles = function styles() {
+    return _objectSpread(_objectSpread({}, style), {}, {
+      zIndex: zIndex
+    });
+  };
+
+  var renderLeft = function renderLeft() {
+    return React__default.createElement("div", {
+      className: "".concat(b('left')),
+      onClick: function onClick(e) {
+        return onClickBack(e);
+      }
+    }, leftShow && React__default.createElement(Icon, {
+      name: "left",
+      color: "#979797"
+    }), leftText && React__default.createElement("div", {
+      className: "".concat(b('text'))
+    }, leftText), slot.left);
+  };
+
+  var renderContent = function renderContent() {
+    return React__default.createElement("div", {
+      className: "".concat(b('title'))
+    }, title && React__default.createElement("div", {
+      className: "title",
+      onClick: function onClick(e) {
+        return onClickTitle(e);
+      }
+    }, title), titIcon && React__default.createElement("div", {
+      onClick: function onClick(e) {
+        return onClickIcon(e);
+      }
+    }, React__default.createElement(Icon, {
+      name: titIcon
+    })), slot.content);
+  };
+
+  var renderRight = function renderRight() {
+    return React__default.createElement("div", {
+      className: "".concat(b('right')),
+      onClick: function onClick(e) {
+        return onClickRight(e);
+      }
+    }, desc && React__default.createElement("div", {
+      className: "".concat(b('text'))
+    }, desc), slot.right);
+  };
+
+  var renderWrapper = function renderWrapper() {
+    return React__default.createElement("div", {
+      className: cls,
+      style: styles()
+    }, renderLeft(), renderContent(), renderRight());
+  };
+
+  var classes = classNames((_classNames = {}, _defineProperty(_classNames, "nut-navbar--border", border), _defineProperty(_classNames, "nut-navbar--fixed", fixed), _defineProperty(_classNames, "nut-navbar--safe-area-inset-top", safeAreaInsetTop), _classNames));
+  var cls = classNames(b(''), classes, className);
+  return React__default.createElement(React__default.Fragment, null, fixed && placeholder ? React__default.createElement("div", {
+    className: "".concat(b(''), "--placeholder")
+  }, renderWrapper()) : renderWrapper());
+};
+
+NavBar.defaultProps = defaultProps;
+NavBar.displayName = 'NutNavBar';
+export { NavBar as N };