@nutui/nutui-react 2.0.0-alpha.5 → 2.0.0-alpha.7

package/dist/esm/Table.js

@@ -1,7 +1,7 @@
 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", "sorterIcon", "showHeader"];
+var _excluded = ["children", "className", "style", "columns", "data", "bordered", "summary", "striped", "noData", "sorterIcon", "showHeader", "onSort"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -26,37 +26,34 @@ function _objectSpread(target) {
 import React__default, { useState, useEffect } from "react";
 import classNames from "classnames";
 import { DownArrow } from "@nutui/icons-react";
-import { c as cn } from "./bem.js";
 import { useConfig } from "./ConfigProvider.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  className: "",
-  style: {},
   columns: [],
   data: [],
   bordered: true,
   striped: false,
-  noData: "无数据",
+  noData: "",
   sorterIcon: null,
   showHeader: true
 });
 var Table = function Table2(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, sorterIcon = _defaultProps$props.sorterIcon, showHeader = _defaultProps$props.showHeader, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  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, sorterIcon = _defaultProps$props.sorterIcon, showHeader = _defaultProps$props.showHeader, onSort = _defaultProps$props.onSort, 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 classPrefix = "nut-table";
+  var headerClassPrefix = "".concat(classPrefix, "__main__head__tr");
+  var bodyClassPrefix = "".concat(classPrefix, "__main__body__tr");
+  var cls = classNames(classPrefix, className);
   var handleSorterClick = function handleSorterClick2(item) {
     if (item.sorter) {
-      onSorter && onSorter(item, curData);
+      onSort && onSort(item, curData);
       if (typeof item.sorter === "function") {
         setCurData(curData.sort(item.sorter));
       } else {
@@ -65,9 +62,8 @@ var Table = function Table2(props) {
     }
   };
   var cellClasses = function cellClasses2(item) {
-    return _defineProperty({
-      "nut-table__main__head__tr--border": props.bordered
-    }, "nut-table__main__head__tr--align".concat(item.align ? item.align : ""), true);
+    var _ref;
+    return _ref = {}, _defineProperty(_ref, "".concat(headerClassPrefix, "--border"), props.bordered), _defineProperty(_ref, "".concat(headerClassPrefix, "--align").concat(item.align ? item.align : ""), true), _ref;
   };
   var getColumnItem = function getColumnItem2(value) {
     return columns.filter(function(item) {
@@ -77,7 +73,7 @@ var Table = function Table2(props) {
   var renderHeadCells = function renderHeadCells2() {
     return columns.map(function(item, index) {
       return React__default.createElement("span", {
-        className: classNames("nut-table__main__head__tr__th", cellClasses(item)),
+        className: classNames("".concat(headerClassPrefix, "__th"), cellClasses(item)),
         key: item.key,
         onClick: function onClick() {
           return handleSorterClick(item);
@@ -97,7 +93,7 @@ var Table = function Table2(props) {
     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))),
+        className: classNames("".concat(bodyClassPrefix, "__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]);
     });
@@ -105,7 +101,7 @@ var Table = function Table2(props) {
   var renderBoyTrs = function renderBoyTrs2() {
     return curData.map(function(item, index) {
       return React__default.createElement("div", {
-        className: "nut-table__main__body__tr",
+        className: bodyClassPrefix,
         key: index
       }, renderBodyTds(item));
     });
@@ -114,26 +110,16 @@ var Table = function Table2(props) {
     className: cls,
     style
   }, rest), React__default.createElement("div", {
-    className: classNames("nut-table__main", {
-      "nut-table__main--striped": striped
-    })
+    className: classNames("".concat(classPrefix, "__main"), _defineProperty({}, "".concat(classPrefix, "__main--striped"), striped))
   }, showHeader && React__default.createElement("div", {
-    className: "nut-table__main__head"
+    className: "".concat(classPrefix, "__main__head")
   }, React__default.createElement("div", {
-    className: "nut-table__main__head__tr"
+    className: headerClassPrefix
   }, 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))));
+    className: "".concat(classPrefix, "__main__body")
+  }, renderBoyTrs())), (summary || curData.length === 0) && React__default.createElement("div", {
+    className: "".concat(classPrefix, "__summary")
+  }, summary || noData));
 };
 Table.defaultProps = defaultProps;
 Table.displayName = "NutTable";

package/dist/esm/TextArea.js

@@ -1,7 +1,7 @@
-import _typeof from "@babel/runtime/helpers/typeof";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["className", "value", "defaultValue", "showCount", "maxLength", "rows", "placeholder", "readOnly", "disabled", "autoSize", "style", "onChange", "onBlur", "onFocus"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -23,131 +23,103 @@ function _objectSpread(target) {
   }
   return target;
 }
-import React__default, { useState, useRef, useEffect } from "react";
+import React__default, { useRef, useEffect } from "react";
+import classNames from "classnames";
 import { useConfig } from "./ConfigProvider.js";
-import { c as cn } from "./bem.js";
-import "@bem-react/classname";
-var defaultProps = {
+import { C as ComponentDefaults } from "./typings.js";
+import { u as usePropsValue } from "./use-props-value.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   defaultValue: "",
-  textAlign: "left",
-  limitshow: false,
-  maxlength: "",
-  rows: "",
+  showCount: false,
+  rows: 2,
+  maxLength: 140,
   placeholder: "",
-  readonly: false,
+  readOnly: false,
   disabled: false,
-  autosize: false
-};
+  autoSize: false
+});
 var TextArea = function TextArea2(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 _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, value = _defaultProps$props.value, defaultValue = _defaultProps$props.defaultValue, showCount = _defaultProps$props.showCount, 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, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var classPrefix = "nut-textarea";
   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();
-      });
+  var compositionRef = useRef(false);
+  var format = function format2(value2) {
+    if (maxLength !== void 0 && value2.length > maxLength) {
+      return value2.substring(0, maxLength);
     }
-  }, [defaultValue, autosize]);
+    return value2;
+  };
+  var _usePropsValue = usePropsValue({
+    value,
+    defaultValue,
+    finalValue: format(defaultValue),
+    onChange
+  }), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), inputValue = _usePropsValue2[0], setInputValue = _usePropsValue2[1];
   useEffect(function() {
-    if (inputValue) {
-      if (autosize) {
-        setContentHeight();
-      }
+    if (autoSize) {
+      setContentHeight();
     }
-  }, [inputValue]);
+  }, [autoSize, defaultValue, inputValue]);
   var setContentHeight = function setContentHeight2() {
     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 !== void 0) {
-          height = Math.min(height, maxHeight);
-        }
-        if (minHeight !== void 0) {
-          height = Math.max(height, minHeight);
-        }
-      }
       if (height) {
         textarea.style.height = "".concat(height, "px");
       }
     }
   };
-  var textChange = function textChange2(event) {
+  var handleChange = function handleChange2(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 value2 = compositionRef.current ? text.value : format(text.value);
+    setInputValue(value2);
   };
-  var textFocus = function textFocus2(event) {
+  var handleFocus = function handleFocus2(event) {
     if (disabled)
       return;
-    if (readonly)
+    if (readOnly)
       return;
     onFocus && onFocus(event);
   };
-  var textBlur = function textBlur2(event) {
+  var handleBlur = function handleBlur2(event) {
     if (disabled)
       return;
-    if (readonly)
+    if (readOnly)
       return;
-    var text = event.target;
-    onChange && onChange(text.value, event);
     onBlur && onBlur(event);
   };
-  var startComposing = function startComposing2() {
-    compositingRef.current = true;
-  };
-  var endComposing = function endComposing2() {
-    compositingRef.current = false;
-  };
   return React__default.createElement("div", {
-    className: "".concat(textareaBem(), " ").concat(disabled ? textareaBem("disabled") : "", " ").concat(className || "")
-  }, React__default.createElement("textarea", {
+    className: classNames(classPrefix, className, _defineProperty({}, "".concat(classPrefix, "__disabled"), disabled))
+  }, React__default.createElement("textarea", _objectSpread({
     ref: textareaRef,
-    className: textareaBem("textarea"),
-    style: _objectSpread({
-      textAlign
-    }, style),
+    className: "".concat(classPrefix, "__textarea"),
+    style,
     disabled,
-    readOnly: readonly,
+    readOnly,
     value: inputValue,
-    // onInput={(e: any) => {
-    //   textChange(e)
-    // }}
     onChange: function onChange2(e) {
-      textChange(e);
+      return handleChange(e);
     },
     onBlur: function onBlur2(e) {
-      textBlur(e);
+      return handleBlur(e);
     },
     onFocus: function onFocus2(e) {
-      textFocus(e);
+      return handleFocus(e);
     },
-    onCompositionEnd: function onCompositionEnd(e) {
-      return endComposing();
+    onCompositionEnd: function onCompositionEnd() {
+      compositionRef.current = false;
     },
-    onCompositionStart: function onCompositionStart(e) {
-      return startComposing();
+    onCompositionStart: function onCompositionStart() {
+      compositionRef.current = true;
     },
     rows,
-    maxLength: maxlength < 0 ? 0 : maxlength,
+    maxLength: maxLength === -1 ? void 0 : maxLength,
     placeholder: placeholder || locale.placeholder
-  }), limitshow ? React__default.createElement("div", {
-    className: textareaBem("limit")
-  }, _toConsumableArray(inputValue).length, "/", maxlength < 0 ? 0 : maxlength) : null);
+  }, rest)), showCount && React__default.createElement("div", {
+    className: "".concat(classPrefix, "__limit")
+  }, inputValue.length, "/", maxLength < 0 ? 0 : maxLength));
 };
 TextArea.defaultProps = defaultProps;
 TextArea.displayName = "NutTextArea";

package/dist/esm/tabs2.js

@@ -100,6 +100,18 @@ var Tabs = function Tabs2(props) {
     return titles2;
   };
   var titles = useRef(getTitles());
+  useEffect(function() {
+    titles.current = getTitles();
+    var current = "";
+    titles.current.forEach(function(title2) {
+      if (title2.value === value) {
+        current = value;
+      }
+    });
+    if (current !== "") {
+      setValue(current);
+    }
+  }, [children]);
   var classes = classNames(classPrefix, "".concat(classPrefix, "--").concat(direction), className);
   var classesTitle = classNames("".concat(classPrefix, "__titles"), (_classNames = {}, _defineProperty(_classNames, "".concat(classPrefix, "__titles--").concat(activeType), activeType), _defineProperty(_classNames, "".concat(classPrefix, "__titles--scrollable"), true), _defineProperty(_classNames, "".concat(classPrefix, "__titles--").concat(align), align), _classNames));
   var tabsActiveStyle = {

package/dist/locales/base.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/en-US.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/id-ID.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-CN.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-TW.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-UG.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:18:02 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:59 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */