@ucloud-fe/react-components 1.2.5 → 1.2.9

package/lib/components/AutoComplete/AutoComplete.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode, HTMLAttributes } from 'react';
-declare type InputProps = HTMLAttributes<HTMLDivElement>;
+import React, { ReactNode } from 'react';
+import { InputProps } from '../../components/Input';
 interface Item {
     value: string;
     label?: ReactNode;
@@ -31,8 +31,10 @@ interface AutoCompleteProps {
     onFocus?: () => void;
     /** 失焦回调 */
     onBlur?: () => void;
+    /** 状态 */
+    status: InputProps['status'];
     /** @ignore */
     placeholder?: InputProps['placeholder'];
 }
-declare const _default: React.MemoExoticComponent<({ value: _value, defaultValue, onChange: _onChange, options, disabled, loading, prefix, block, handleSearch, popoverProps, onFocus, onBlur, style, className, placeholder }: AutoCompleteProps & Omit<InputProps, keyof AutoCompleteProps>) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ value: _value, defaultValue, onChange: _onChange, options, disabled, loading, prefix, block, handleSearch, popoverProps, onFocus, onBlur, style, className, status, placeholder }: AutoCompleteProps & Omit<InputProps, keyof AutoCompleteProps>) => JSX.Element>;
 export default _default;

package/lib/components/AutoComplete/AutoComplete.js

@@ -61,6 +61,7 @@ var AutoComplete = function AutoComplete(_ref) {
       onBlur = _ref.onBlur,
       style = _ref.style,
       className = _ref.className,
+      status = _ref.status,
       placeholder = _ref.placeholder;
 
   var _useUncontrolled = (0, _useUncontrolled3.default)(_value, defaultValue, _onChange),
@@ -149,7 +150,8 @@ var AutoComplete = function AutoComplete(_ref) {
     }),
     className: _style.inputCls,
     block: true,
-    placeholder: placeholder
+    placeholder: placeholder,
+    status: status
   })));
 }.bind(void 0);
 

package/lib/components/Input/Input.d.ts

@@ -1,5 +1,5 @@
 import React, { InputHTMLAttributes, ReactNode } from 'react';
-import { Size } from '../../type';
+import { Override, Size } from '../../type';
 export interface InputProps {
     /**
      * @deprecated 使用 suffix 替换
@@ -15,7 +15,7 @@ export interface InputProps {
     /** 尺寸 */
     size?: Size;
     /** 状态 */
-    status?: 'error';
+    status?: 'default' | 'error';
     /** 展示变更为块占位 */
     block?: boolean;
     /** 点击 clear 按钮回调 */
@@ -37,5 +37,6 @@ export declare type InputRef = {
     /** input 元素 */
     input?: HTMLInputElement | null;
 };
+export declare type FullInputProps = InputProps & Override<InputHTMLAttributes<HTMLInputElement>, InputProps>;
 declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<InputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, keyof InputProps> & React.RefAttributes<InputRef>>>;
 export default _default;

package/lib/components/Input/Input.js

@@ -188,7 +188,7 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     focused: focused,
     style: style,
     disabled: disabled,
-    status: status || _status,
+    status: _status || status,
     customStyle: customStyle,
     empty: !value
   }, /*#__PURE__*/_react.default.createElement("span", {

package/lib/components/Input/index.d.ts

@@ -1,10 +1,12 @@
 /// <reference types="react" />
 import NumberInput from '../../components/NumberInput';
 import Textarea from '../../components/Textarea';
+import { FullInputProps as InputProps } from './Input';
 declare const ExportClassInput: import("react").ComponentClass<import("./Input").InputProps & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, keyof import("./Input").InputProps> & import("react").RefAttributes<import("./Input").InputRef>, any> & {
     Search: import("react").ComponentClass<import("./Search").SearchProps & import("./Input").InputProps & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, keyof import("./Input").InputProps> & import("react").RefAttributes<import("./Input").InputRef>, any>;
     Number: typeof NumberInput;
     Textarea: typeof Textarea;
     Sizes: ["sm", "md", "lg"];
 };
+export type { InputProps };
 export default ExportClassInput;

package/lib/components/Select/Select.js

@@ -84,11 +84,15 @@ var deprecatedLogForPopover = (0, _once.default)(function () {
 exports.deprecatedLogForPopover = deprecatedLogForPopover;
 var warnLogForVirtualList = (0, _once.default)(function () {
   (0, _newArrowCheck2.default)(this, _this);
-  return console.warn('Select virtualList only valid when use options');
+  return console.error('Select virtualList only valid when use options');
 }.bind(void 0));
 var warnLogForCustomHeight = (0, _once.default)(function () {
   (0, _newArrowCheck2.default)(this, _this);
-  return console.warn('CustomStyle.optionListMaxHeight is invalid when use virtualList, please use virtualList.height');
+  return console.error('CustomStyle.optionListMaxHeight is invalid when use virtualList, please use virtualList.height');
+}.bind(void 0));
+var warnLogForSearchProps = (0, _once.default)(function () {
+  (0, _newArrowCheck2.default)(this, _this);
+  return console.error("Don't use item.props in custom search, just use item as props.");
 }.bind(void 0));
 var groupOptions = {
   itemTag: 'isMenuItem',
@@ -281,7 +285,8 @@ var Popup = function Popup(_ref2) {
 
   return /*#__PURE__*/_react.default.createElement(_style.MenuWrap, null, search && /*#__PURE__*/_react.default.createElement(_style.SelectSearchInput, {
     onChange: handleSearchInput,
-    value: searchValue
+    value: searchValue,
+    status: "default"
   }), children || options ? /*#__PURE__*/_react.default.createElement(_style.BlockMenu, {
     onChange: handleChange,
     customStyle: newCustomStyle,
@@ -327,6 +332,11 @@ var groupOptionsAsDataSource = function groupOptionsAsDataSource(options) {
   var subGroupMap = new Map();
   var childrenMap = new Map();
 
+  var isValidKey = function isValidKey(v) {
+    (0, _newArrowCheck2.default)(this, _this5);
+    return typeof v === 'string' || typeof v === 'number';
+  }.bind(this);
+
   var group = function group(options) {
     var _this6 = this;
 
@@ -342,6 +352,7 @@ var groupOptionsAsDataSource = function groupOptionsAsDataSource(options) {
       if (subChildren) {
         var _key = child[subGroupKeyName] || child.key || "".concat(prefixKey, "-").concat(i);
 
+        var reactKey = child.key || isValidKey(child[subGroupKeyName]) ? child[subGroupKeyName] : "".concat(prefixKey, "-").concat(i);
         var isDisabled = disabled || child.disabled;
 
         var _group = group(subChildren, isDisabled, _key),
@@ -361,7 +372,7 @@ var groupOptionsAsDataSource = function groupOptionsAsDataSource(options) {
 
         if (_visible) {
           renderChildren.push( /*#__PURE__*/_react.default.createElement(SubGroupComponent, (0, _extends2.default)({
-            key: _key
+            key: reactKey
           }, child, (0, _defineProperty2.default)({
             disabled: globalDisabled || isDisabled
           }, subGroupKeyName, _key)), subRenderChildren));
@@ -371,6 +382,8 @@ var groupOptionsAsDataSource = function groupOptionsAsDataSource(options) {
 
         var _key2 = child[itemKeyName] === undefined ? child.key : child[itemKeyName];
 
+        var _reactKey = child.key || isValidKey(child[itemKeyName]) ? child[itemKeyName] : "".concat(prefixKey, "-").concat(i);
+
         var _isDisabled = disabled || child.disabled;
 
         if (_isDisabled) {
@@ -385,7 +398,7 @@ var groupOptionsAsDataSource = function groupOptionsAsDataSource(options) {
 
         if (_visible2) {
           renderChildren.push( /*#__PURE__*/_react.default.createElement(ItemComponent, (0, _extends2.default)({
-            key: _key2
+            key: _reactKey
           }, child, (0, _defineProperty2.default)({
             disabled: globalDisabled || _isDisabled
           }, itemKeyName, _key2)), display));
@@ -457,6 +470,8 @@ var Select = function Select(_ref8) {
     if (virtualList && !options) warnLogForVirtualList();
   }.bind(this));
   var handleSearch = (0, _react.useCallback)(function (value, props) {
+    var _this8 = this;
+
     (0, _newArrowCheck2.default)(this, _this7);
 
     if (!search || !searchValue) {
@@ -464,14 +479,33 @@ var Select = function Select(_ref8) {
     }
 
     if ((0, _typeof2.default)(search) === 'object' && search.handleSearch) {
-      return search.handleSearch(searchValue, value, _objectSpread(_objectSpread({}, props), {}, {
-        props: props
-      }));
+      var _beforeProps$label;
+
+      // assign props for forward compatible
+      var beforeProps = _objectSpread({}, props);
+
+      if (options) beforeProps.children = (_beforeProps$label = beforeProps.label) !== null && _beforeProps$label !== void 0 ? _beforeProps$label : beforeProps.value;
+
+      var itemInfo = _objectSpread({}, props);
+
+      if (!('props' in itemInfo)) {
+        Object.defineProperty(itemInfo, 'props', {
+          get: function get() {
+            (0, _newArrowCheck2.default)(this, _this8);
+            warnLogForSearchProps();
+            return beforeProps;
+          }.bind(this)
+        });
+      }
+
+      return search.handleSearch(searchValue, value, itemInfo);
     } else {
-      var _children = props.children;
+      // use label for options case
+      var _children = options ? props.label : props.children;
+
       return (value + '').indexOf(searchValue) >= 0 || _children && typeof _children === 'string' && _children.indexOf(searchValue) >= 0;
     }
-  }.bind(this), [search, searchValue]);
+  }.bind(this), [options, search, searchValue]);
   var childrenDataSource = (0, _react.useMemo)(function () {
     (0, _newArrowCheck2.default)(this, _this7);
     return options ? [] : (0, _group3.groupChildrenAsDataSource)(children, disabled, groupOptions);

package/lib/components/Table/SearchInput.js

@@ -57,6 +57,7 @@ var SearchInput = /*#__PURE__*/function (_Component) {
         (0, _newArrowCheck2.default)(this, _this);
         var handleSearch = _ref.handleSearch;
         return /*#__PURE__*/_react.default.createElement(_Input.default.Search, (0, _extends2.default)({
+          status: "default",
           onSearch: handleSearch
         }, rest));
       }.bind(this));

package/lib/components/Transfer/Transfer.js

@@ -328,7 +328,8 @@ var Transfer = (_dec = (0, _uncontrolled.default)({
         block: true,
         onSearch: onSearch,
         onChange: onSearch,
-        disabled: disabled
+        disabled: disabled,
+        status: "default"
       })), _this2.renderContent({
         part: part,
         dataSource: partDataSource,

package/lib/components/Tree/Tree.js

@@ -66,6 +66,7 @@ var groupDataSource = function groupDataSource(dataSource) {
   var group = {};
   var allKeys = [];
   var allDisabledKeys = [];
+  if (!dataSource) dataSource = [];
 
   var _groupData2 = function _groupData(children, disabled) {
     var _this3 = this;
@@ -122,10 +123,10 @@ var keysToMap = function keysToMap() {
   return result;
 };
 
-var defaultSearchHandle = function defaultSearchHandle(searchValue, dataSource) {
+var defaultSearchHandle = function defaultSearchHandle(searchValue) {
   var _this5 = this;
 
-  (0, _newArrowCheck2.default)(this, _this);
+  var dataSource = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   if (!searchValue) return {
     dataSource: dataSource,
     count: null
@@ -185,15 +186,14 @@ var defaultSearchHandle = function defaultSearchHandle(searchValue, dataSource)
     count: count,
     openKeys: Object.keys(finalExpandedKeyMap)
   };
-}.bind(void 0);
+};
 
 var CommonTree = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _this7 = this;
 
   (0, _newArrowCheck2.default)(this, _this);
 
-  var _ref$dataSource = _ref.dataSource,
-      dataSource = _ref$dataSource === void 0 ? [] : _ref$dataSource,
+  var dataSource = _ref.dataSource,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$multiple = _ref.multiple,

package/lib/sharedComponents/Search/Search.js

@@ -70,7 +70,8 @@ var Search = function Search(_ref) {
     prefix: prefix,
     onChange: handleChange,
     clearable: true,
-    block: true
+    block: true,
+    status: "default"
   }), loading ? /*#__PURE__*/_react.default.createElement(_Loading.default, {
     loading: loading,
     className: _style.loadingCls

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ucloud-fe/react-components",
-  "version": "1.2.5",
+  "version": "1.2.9",
   "title": "UCloud react components",
   "description": "UCloud react components",
   "keywords": [