@nutui/nutui-react 1.5.2-beta.0 → 1.5.2

package/dist/esm/Tabbar.js

@@ -0,0 +1,70 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+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, { useState, useEffect } from 'react';
+import { c as cn } from './bem-3b438e61.js';
+import '@bem-react/classname';
+var defaultProps = {
+  visible: 0,
+  bottom: false,
+  size: 20,
+  unactiveColor: '',
+  activeColor: '',
+  safeAreaInsetBottom: false,
+  className: '',
+  style: {},
+  onSwitch: function onSwitch(child, activeVisible) {}
+};
+var Tabbar = function Tabbar(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    visible = _defaultProps$props.visible,
+    activeVisible = _defaultProps$props.activeVisible,
+    bottom = _defaultProps$props.bottom,
+    size = _defaultProps$props.size,
+    activeColor = _defaultProps$props.activeColor,
+    unactiveColor = _defaultProps$props.unactiveColor,
+    safeAreaInsetBottom = _defaultProps$props.safeAreaInsetBottom,
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    onSwitch = _defaultProps$props.onSwitch;
+  var b = cn('tabbar');
+  var _useState = useState(activeVisible || visible),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectIndex = _useState2[0],
+    setSelectIndex = _useState2[1];
+  var _handleClick = function handleClick(idx) {
+    if (!('activeVisible' in props)) {
+      setSelectIndex(idx);
+    }
+  };
+  useEffect(function () {
+    if (activeVisible !== undefined) {
+      setSelectIndex(activeVisible);
+    }
+  }, [activeVisible]);
+  return React__default.createElement("div", {
+    className: ["".concat(b()), bottom ? "".concat(b('bottom')) : '', safeAreaInsetBottom ? "".concat(b('bottom'), " ").concat(b('safebottom')) : '', className].join(' '),
+    style: style
+  }, React__default.Children.map(children, function (child, idx) {
+    if (!React__default.isValidElement(child)) {
+      return null;
+    }
+    var childProps = _objectSpread(_objectSpread({}, child.props), {}, {
+      active: idx === selectIndex,
+      index: idx,
+      unactiveColor: unactiveColor,
+      activeColor: activeColor,
+      size: size,
+      handleClick: function handleClick() {
+        _handleClick(idx);
+        onSwitch(child, idx);
+      }
+    });
+    return React__default.cloneElement(child, childProps);
+  }));
+};
+Tabbar.defaultProps = defaultProps;
+Tabbar.displayName = 'NutTabbar';
+export { Tabbar as default };

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

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/tabbaritem/tabbaritem.scss'

package/dist/esm/TabbarItem.js

@@ -0,0 +1,80 @@
+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, { useEffect } from 'react';
+import { c as cn } from './bem-3b438e61.js';
+import Icon from './Icon.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+import '@bem-react/classname';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  dot: false,
+  size: '',
+  iconSize: '',
+  className: '',
+  tabTitle: '',
+  icon: '',
+  href: '',
+  num: '',
+  active: false,
+  activeColor: '',
+  unactiveColor: '',
+  index: 0,
+  handleClick: function handleClick(idx) {}
+});
+var TabbarItem = function TabbarItem(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    dot = _defaultProps$props.dot,
+    size = _defaultProps$props.size,
+    iconSize = _defaultProps$props.iconSize,
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    tabTitle = _defaultProps$props.tabTitle,
+    icon = _defaultProps$props.icon,
+    href = _defaultProps$props.href,
+    num = _defaultProps$props.num,
+    active = _defaultProps$props.active,
+    activeColor = _defaultProps$props.activeColor,
+    unactiveColor = _defaultProps$props.unactiveColor,
+    index = _defaultProps$props.index,
+    handleClick = _defaultProps$props.handleClick,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName;
+  var b = cn('tabbar-item');
+  var bIcon = cn('tabbar-item__icon-box');
+  useEffect(function () {
+    if (active && href) {
+      window.location.href = href;
+    }
+  }, [active, href]);
+  return React__default.createElement("div", {
+    className: "".concat(b({
+      active: active
+    }), " ").concat(className),
+    style: _objectSpread(_objectSpread({}, style), {}, {
+      color: active ? activeColor : unactiveColor
+    }),
+    onClick: function onClick() {
+      handleClick(index);
+    }
+  }, React__default.createElement("div", {
+    className: "".concat(bIcon())
+  }, !dot ? React__default.createElement(React__default.Fragment, null, num && num <= 99 && React__default.createElement("div", {
+    className: "".concat(bIcon('tips', [bIcon('num')]))
+  }, num), num && num >= 100 && React__default.createElement("div", {
+    className: "".concat(bIcon('tips', [bIcon('nums')]))
+  }, "99+")) : React__default.createElement("div", {
+    className: "".concat(bIcon('tips', [bIcon('dot')]))
+  }), icon && React__default.createElement(Icon, {
+    classPrefix: iconClassPrefix,
+    fontClassName: iconFontClassName,
+    size: iconSize || size,
+    name: icon
+  })), tabTitle && React__default.createElement("div", {
+    className: bIcon({
+      'nav-word': true
+    }, [bIcon({
+      'big-word': !icon
+    })])
+  }, tabTitle));
+};
+export { TabbarItem as default };

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

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/table/table.scss'

package/dist/esm/Table.js

@@ -0,0 +1,142 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["children", "className", "style", "columns", "data", "bordered", "summary", "striped", "noData", "onSorter", "iconClassPrefix", "iconFontClassName", "showHeader"];
+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-3b438e61.js';
+import Icon from './Icon.js';
+import { useConfig } from './ConfigProvider.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+import '@bem-react/classname';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  className: '',
+  style: {},
+  columns: [],
+  data: [],
+  bordered: true,
+  striped: false,
+  noData: '无数据',
+  showHeader: true
+});
+var Table = function Table(props) {
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
+  defaultProps.noData = locale.noData;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    columns = _defaultProps$props.columns,
+    data = _defaultProps$props.data,
+    bordered = _defaultProps$props.bordered,
+    summary = _defaultProps$props.summary,
+    striped = _defaultProps$props.striped,
+    noData = _defaultProps$props.noData,
+    onSorter = _defaultProps$props.onSorter,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName,
+    showHeader = _defaultProps$props.showHeader,
+    rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(data),
+    _useState2 = _slicedToArray(_useState, 2),
+    curData = _useState2[0],
+    setCurData = _useState2[1];
+  useEffect(function () {
+    if (data && String(data) !== String(curData)) {
+      setCurData(data);
+    }
+  }, [data]);
+  var b = cn('table');
+  var classes = classNames({});
+  var cls = classNames(b(), classes, className);
+  var handleSorterClick = function handleSorterClick(item) {
+    if (item.sorter) {
+      onSorter && onSorter(item, curData);
+      if (typeof item.sorter === 'function') {
+        setCurData(curData.sort(item.sorter));
+      } else {
+        setCurData(item.sorter === 'default' ? curData.sort() : curData);
+      }
+    }
+  };
+  var cellClasses = function cellClasses(item) {
+    return _defineProperty({
+      'nut-table__main__head__tr--border': props.bordered
+    }, "nut-table__main__head__tr--align".concat(item.align ? item.align : ''), true);
+  };
+  var getColumnItem = function getColumnItem(value) {
+    return columns.filter(function (item) {
+      return item.key === value;
+    })[0];
+  };
+  var renderHeadCells = function renderHeadCells() {
+    return columns.map(function (item, index) {
+      return React__default.createElement("span", {
+        className: classNames('nut-table__main__head__tr__th', cellClasses(item)),
+        key: item.key,
+        onClick: function onClick() {
+          return handleSorterClick(item);
+        }
+      }, item.title, item.sorter && React__default.createElement(Icon, {
+        classPrefix: iconClassPrefix,
+        fontClassName: iconFontClassName,
+        name: "down-arrow",
+        size: "12px"
+      }));
+    });
+  };
+  var sortDataItem = function sortDataItem() {
+    return columns.map(function (columns) {
+      return [columns.key, columns.render];
+    });
+  };
+  var renderBodyTds = function renderBodyTds(item) {
+    return sortDataItem().map(function (_ref2, index) {
+      var _ref3 = _slicedToArray(_ref2, 2),
+        value = _ref3[0],
+        render = _ref3[1];
+      return React__default.createElement("span", {
+        className: classNames('nut-table__main__body__tr__td', cellClasses(getColumnItem(value))),
+        key: value
+      }, typeof item[value] === 'function' || typeof render === 'function' ? React__default.createElement("div", null, render ? render(item) : item[value](item)) : item[value]);
+    });
+  };
+  var renderBoyTrs = function renderBoyTrs() {
+    return curData.map(function (item, index) {
+      return React__default.createElement("div", {
+        className: "nut-table__main__body__tr",
+        key: index
+      }, renderBodyTds(item));
+    });
+  };
+  return React__default.createElement("div", _objectSpread({
+    className: cls,
+    style: style
+  }, rest), React__default.createElement("div", {
+    className: classNames('nut-table__main', {
+      'nut-table__main--striped': striped
+    })
+  }, showHeader && React__default.createElement("div", {
+    className: "nut-table__main__head"
+  }, React__default.createElement("div", {
+    className: "nut-table__main__head__tr"
+  }, renderHeadCells())), React__default.createElement("div", {
+    className: "nut-table__main__body"
+  }, renderBoyTrs())), summary && React__default.createElement("div", {
+    className: "nut-table__summary"
+  }, React__default.createElement("span", {
+    className: "nut-table__summary__text"
+  }, summary)), curData.length === 0 && React__default.createElement("div", {
+    className: "nut-table__nodata"
+  }, React__default.createElement("div", {
+    className: "nut-table__nodata"
+  }, React__default.createElement("div", {
+    className: "nut-table__nodata__text"
+  }, noData))));
+};
+Table.defaultProps = defaultProps;
+Table.displayName = 'NutTable';
+export { Table as default };

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

@@ -0,0 +1,4 @@
+
+import '../../TabPane/style'
+import '../../Icon/style'
+import '../../../packages/tabs/tabs.scss'

package/dist/esm/Tabs.js

@@ -0,0 +1,9 @@
+import { T as Tabs } from './tabs-e1b4e4b1.js';
+import 'react';
+import 'classnames';
+import './bem-3b438e61.js';
+import '@bem-react/classname';
+import './Icon.js';
+import './typings-f27b58f4.js';
+import './TabPane.js';
+export { Tabs as default };

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

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/tag/tag.scss'

package/dist/esm/Tag.js

@@ -0,0 +1,111 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+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, { useState, useEffect } from 'react';
+import classNames from 'classnames';
+import Icon from './Icon.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  type: 'default',
+  color: '',
+  textColor: '',
+  plain: false,
+  round: false,
+  mark: false,
+  closeable: false,
+  iconSize: '12px',
+  prefixCls: 'nut-tag',
+  onClose: function onClose(e) {},
+  onClick: function onClick(e) {}
+});
+var Tag = function Tag(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    color = _defaultProps$props.color,
+    plain = _defaultProps$props.plain,
+    type = _defaultProps$props.type,
+    round = _defaultProps$props.round,
+    prefixCls = _defaultProps$props.prefixCls,
+    children = _defaultProps$props.children,
+    mark = _defaultProps$props.mark,
+    closeable = _defaultProps$props.closeable,
+    iconSize = _defaultProps$props.iconSize,
+    textColor = _defaultProps$props.textColor,
+    onClick = _defaultProps$props.onClick,
+    onClose = _defaultProps$props.onClose,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName;
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    btnName = _useState2[0],
+    setBtnName = _useState2[1];
+  var _useState3 = useState(true),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isTagShow = _useState4[0],
+    setIsTagShow = _useState4[1];
+  useEffect(function () {
+    setBtnName(classes());
+  }, [type, color, textColor, plain, round, mark, closeable, iconSize, prefixCls, onClick, onClose, className]);
+  var classes = function classes() {
+    var _classNames;
+    var prefixCls = 'nut-tag';
+    return classNames((_classNames = {}, _defineProperty(_classNames, prefixCls, true), _defineProperty(_classNames, "".concat(prefixCls, "--").concat(type), type), _defineProperty(_classNames, "".concat(prefixCls, "--plain"), plain), _defineProperty(_classNames, "".concat(prefixCls, "--round"), round), _defineProperty(_classNames, "".concat(prefixCls, "--mark"), mark), _defineProperty(_classNames, "".concat(prefixCls, "--close"), closeable), _defineProperty(_classNames, "".concat(className), className), _classNames));
+  };
+  var handleClick = function handleClick(e) {
+    if (props.onClick) {
+      props.onClick(e);
+    }
+  };
+  // 综合考虑 textColor、color、plain 组合使用时的效果
+  var getStyle = function getStyle() {
+    var style = {};
+    // 标签内字体颜色
+    if (textColor) {
+      style.color = textColor;
+    } else if (color && plain) {
+      style.color = color;
+    }
+    // 标签背景与边框颜色
+    if (plain) {
+      style.background = '#fff';
+      style.borderColor = color;
+    } else if (color) {
+      style.background = color;
+    }
+    return style;
+  };
+  return React__default.createElement(React__default.Fragment, null, closeable ? isTagShow && React__default.createElement("div", {
+    className: btnName,
+    style: _objectSpread(_objectSpread({}, style), getStyle()),
+    onClick: function onClick(e) {
+      return handleClick(e);
+    }
+  }, children && React__default.createElement("span", {
+    className: "nut-tag-text"
+  }, children), React__default.createElement(Icon, {
+    classPrefix: iconClassPrefix,
+    fontClassName: iconFontClassName,
+    className: "_icon",
+    name: "close",
+    size: iconSize,
+    onClick: function onClick(e) {
+      setIsTagShow(false);
+      if (props.onClose) {
+        props.onClose(e);
+      }
+    }
+  })) : React__default.createElement("div", {
+    className: btnName,
+    style: _objectSpread(_objectSpread({}, style), getStyle()),
+    onClick: function onClick(e) {
+      return handleClick(e);
+    }
+  }, children && React__default.createElement("span", {
+    className: "nut-tag-text"
+  }, children)));
+};
+Tag.defaultProps = defaultProps;
+Tag.displayName = 'NutTag';
+export { Tag as default };

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

@@ -0,0 +1,2 @@
+
+import '../../../packages/textarea/textarea.scss'

package/dist/esm/TextArea.js

@@ -0,0 +1,150 @@
+import _typeof from "@babel/runtime/helpers/typeof";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+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, { useState, useRef, useEffect } from 'react';
+import { useConfig } from './ConfigProvider.js';
+import { c as cn } from './bem-3b438e61.js';
+import '@bem-react/classname';
+var defaultProps = {
+  defaultValue: '',
+  textAlign: 'left',
+  limitshow: false,
+  maxlength: '',
+  rows: '',
+  placeholder: '',
+  readonly: false,
+  disabled: false,
+  autosize: false
+};
+var TextArea = function TextArea(props) {
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    className = _defaultProps$props.className,
+    defaultValue = _defaultProps$props.defaultValue,
+    textAlign = _defaultProps$props.textAlign,
+    limitshow = _defaultProps$props.limitshow,
+    maxlength = _defaultProps$props.maxlength,
+    rows = _defaultProps$props.rows,
+    placeholder = _defaultProps$props.placeholder,
+    readonly = _defaultProps$props.readonly,
+    disabled = _defaultProps$props.disabled,
+    autosize = _defaultProps$props.autosize,
+    style = _defaultProps$props.style,
+    onChange = _defaultProps$props.onChange,
+    onBlur = _defaultProps$props.onBlur,
+    onFocus = _defaultProps$props.onFocus;
+  var textareaBem = cn('textarea');
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputValue = _useState2[0],
+    SetInputValue = _useState2[1];
+  var textareaRef = useRef(null);
+  var compositingRef = useRef(false);
+  useEffect(function () {
+    var initValue = defaultValue;
+    if (initValue && maxlength && _toConsumableArray(initValue).length > Number(maxlength)) {
+      initValue = initValue.substring(0, Number(maxlength));
+    }
+    SetInputValue(initValue);
+    if (autosize) {
+      setTimeout(function () {
+        setContentHeight();
+      });
+    }
+  }, [defaultValue, autosize]);
+  useEffect(function () {
+    if (inputValue) {
+      if (autosize) {
+        setContentHeight();
+      }
+    }
+  }, [inputValue]);
+  var setContentHeight = function setContentHeight() {
+    var textarea = textareaRef.current;
+    if (textarea) {
+      textarea.style.height = 'auto';
+      var height = textarea === null || textarea === void 0 ? void 0 : textarea.scrollHeight;
+      if (_typeof(autosize) === 'object') {
+        var maxHeight = autosize.maxHeight,
+          minHeight = autosize.minHeight;
+        if (maxHeight !== undefined) {
+          height = Math.min(height, maxHeight);
+        }
+        if (minHeight !== undefined) {
+          height = Math.max(height, minHeight);
+        }
+      }
+      if (height) {
+        textarea.style.height = "".concat(height, "px");
+      }
+    }
+  };
+  var textChange = function textChange(event) {
+    var text = event.target;
+    if (maxlength && _toConsumableArray(text.value).length > Number(maxlength) && !compositingRef.current) {
+      text.value = text.value.substring(0, Number(maxlength));
+    }
+    SetInputValue(text.value);
+    onChange && onChange(text.value, event);
+  };
+  var textFocus = function textFocus(event) {
+    if (disabled) return;
+    if (readonly) return;
+    onFocus && onFocus(event);
+  };
+  var textBlur = function textBlur(event) {
+    if (disabled) return;
+    if (readonly) return;
+    var text = event.target;
+    onChange && onChange(text.value, event);
+    onBlur && onBlur(event);
+  };
+  var startComposing = function startComposing() {
+    compositingRef.current = true;
+  };
+  var endComposing = function endComposing() {
+    compositingRef.current = false;
+  };
+  return React__default.createElement("div", {
+    className: "".concat(textareaBem(), " ").concat(disabled ? textareaBem('disabled') : '', " ").concat(className || '')
+  }, React__default.createElement("textarea", {
+    ref: textareaRef,
+    className: textareaBem('textarea'),
+    style: _objectSpread({
+      textAlign: textAlign
+    }, style),
+    disabled: disabled,
+    readOnly: readonly,
+    value: inputValue,
+    // onInput={(e: any) => {
+    //   textChange(e)
+    // }}
+    onChange: function onChange(e) {
+      textChange(e);
+    },
+    onBlur: function onBlur(e) {
+      textBlur(e);
+    },
+    onFocus: function onFocus(e) {
+      textFocus(e);
+    },
+    onCompositionEnd: function onCompositionEnd(e) {
+      return endComposing();
+    },
+    onCompositionStart: function onCompositionStart(e) {
+      return startComposing();
+    },
+    rows: rows,
+    maxLength: maxlength < 0 ? 0 : maxlength,
+    placeholder: placeholder || locale.placeholder
+  }), limitshow ? React__default.createElement("div", {
+    className: textareaBem('limit')
+  }, _toConsumableArray(inputValue).length, "/", maxlength < 0 ? 0 : maxlength) : null);
+};
+TextArea.defaultProps = defaultProps;
+TextArea.displayName = 'NutTextArea';
+export { TextArea as default };

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

@@ -0,0 +1,2 @@
+
+import '../../../packages/timedetail/timedetail.scss'

package/dist/esm/TimeDetail.js

@@ -0,0 +1,69 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+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, { useState, useEffect } from 'react';
+import { c as cn } from './bem-3b438e61.js';
+import { useConfig } from './ConfigProvider.js';
+import '@bem-react/classname';
+var defaultProps = {
+  className: '',
+  currentKey: 0,
+  currentTime: [],
+  times: [],
+  select: function select() {
+    return null;
+  }
+};
+var TimeDetail = function TimeDetail(props) {
+  useConfig();
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    times = _defaultProps$props.times,
+    className = _defaultProps$props.className,
+    currentKey = _defaultProps$props.currentKey,
+    currentTime = _defaultProps$props.currentTime,
+    select = _defaultProps$props.select;
+  var b = cn('timedetail');
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    renderData = _useState2[0],
+    setRenderData = _useState2[1];
+  useEffect(function () {
+    var currentData = times.find(function (timesItem) {
+      return String(timesItem.key) === String(currentKey);
+    });
+    var renderData = currentData ? currentData.list : [];
+    // 根据选中的日期回显当前日期可配送的时间
+    setRenderData(renderData);
+  }, [times, currentKey]);
+  // 选中时间的回调
+  var handleTime = function handleTime(time) {
+    select(time);
+  };
+  // 选中的配送时间增加 active 类名
+  var getDetailClass = function getDetailClass(item) {
+    var initClass = 'nut-timedetail__item';
+    var curTimeData = currentTime.find(function (item) {
+      return String(item.key) === String(currentKey);
+    });
+    if (curTimeData && curTimeData.list && curTimeData.list.includes(item)) {
+      initClass += ' nut-timedetail__item-active';
+    }
+    return initClass;
+  };
+  return React__default.createElement("div", {
+    className: "".concat(b(), " ").concat(className || '')
+  }, renderData.map(function (item, index) {
+    return React__default.createElement("span", {
+      className: getDetailClass(item),
+      key: item,
+      onClick: function onClick() {
+        return handleTime(item);
+      }
+    }, item);
+  }));
+};
+TimeDetail.defaultProps = defaultProps;
+TimeDetail.displayName = 'NutTimeDetail';
+export { TimeDetail as default };

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

@@ -0,0 +1,2 @@
+
+import '../../../packages/timepannel/timepannel.scss'