@ucloud-fe/react-components 1.4.6 → 1.5.2

package/lib/components/ActionList/ActionList.d.ts

@@ -22,6 +22,8 @@ export interface DefinedActionListProps {
     actionList: ActionInfo[];
     /** 暴露的操作数量 */
     exposeCount?: number;
+    /** 是否自动按照宽度调整展示数量 */
+    autoAdjustment?: boolean;
     /** 控件尺寸 */
     size?: Size;
     /** 操作数量等于 exposeCount+1 时是否直接显示按钮而不是显示下拉菜单 */
@@ -34,5 +36,5 @@ export interface DefinedActionListProps {
     popoverProps?: any;
 }
 export declare type ActionListProps = DefinedActionListProps & Override<HTMLAttributes<HTMLDivElement>, DefinedActionListProps>;
-declare const _default: React.MemoExoticComponent<({ actionList, exposeCount, size, smart, buttonStyleType, popoverProps, dropdownButton, className, ...rest }: ActionListProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ autoAdjustment: _autoAdjustment, ...rest }: ActionListProps) => JSX.Element>;
 export default _default;

package/lib/components/ActionList/ActionList.js

@@ -33,18 +33,24 @@ var _Popover = _interopRequireDefault(require("../../components/Popover"));
 
 var _Tooltip = _interopRequireDefault(require("../../components/Tooltip"));
 
-var _Combine = _interopRequireDefault(require("../../components/Combine"));
-
 var _SvgIcon = _interopRequireDefault(require("../../components/SvgIcon"));
 
 var _usePopoverConfig = _interopRequireDefault(require("../../hooks/usePopoverConfig"));
 
+var _useOverflow3 = _interopRequireDefault(require("../../hooks/useOverflow"));
+
 var _style = require("./style");
 
+var _useConfig2 = _interopRequireDefault(require("../../hooks/useConfig"));
+
+var _config = _interopRequireDefault(require("../../config"));
+
 var _excluded = ["onClick", "disabled", "handleHide"],
     _excluded2 = ["label", "tooltip"],
     _excluded3 = ["label", "disabled", "onClick"],
-    _excluded4 = ["actionList", "exposeCount", "size", "smart", "buttonStyleType", "popoverProps", "dropdownButton", "className"];
+    _excluded4 = ["actionList", "exposeCount", "size", "smart", "buttonStyleType", "popoverProps", "dropdownButton", "className"],
+    _excluded5 = ["actionList", "exposeCount", "smart"],
+    _excluded6 = ["autoAdjustment"];
 
 var _this = void 0;
 
@@ -190,7 +196,10 @@ var ActionMenu = function ActionMenu(_ref3) {
   }));
 }.bind(void 0);
 
-var ActionList = function ActionList(_ref4) {
+var _uid = 0;
+var ID_KEY = 'data-urc-action_list-id';
+
+var PureActionList = function PureActionList(_ref4) {
   (0, _newArrowCheck2.default)(this, _this);
   var _ref4$actionList = _ref4.actionList,
       actionList = _ref4$actionList === void 0 ? [] : _ref4$actionList,
@@ -229,7 +238,7 @@ var ActionList = function ActionList(_ref4) {
     size: size,
     buttonStyleType: buttonStyleType
   };
-  return /*#__PURE__*/_react.default.createElement(_Combine.default, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/_react.default.createElement(_style.SWrap, (0, _extends2.default)({}, rest, {
     className: (0, _classnames.default)(_style.prefixCls, className),
     sharedProps: {
       size: size
@@ -245,6 +254,70 @@ var ActionList = function ActionList(_ref4) {
   })) : null);
 }.bind(void 0);
 
+var AutoAdjustmentActionList = function AutoAdjustmentActionList(_ref5) {
+  var _this6 = this;
+
+  (0, _newArrowCheck2.default)(this, _this);
+
+  var _ref5$actionList = _ref5.actionList,
+      actionList = _ref5$actionList === void 0 ? [] : _ref5$actionList,
+      _ref5$exposeCount = _ref5.exposeCount,
+      _exposeCount = _ref5$exposeCount === void 0 ? 3 : _ref5$exposeCount,
+      smart = _ref5.smart,
+      rest = (0, _objectWithoutProperties2.default)(_ref5, _excluded5);
+
+  var _useState3 = (0, _react.useState)(function () {
+    (0, _newArrowCheck2.default)(this, _this6);
+    return _uid++;
+  }.bind(this)),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 1),
+      uid = _useState4[0];
+
+  var l = actionList.length;
+  var containerRef = (0, _react.useRef)(null);
+  (0, _react.useLayoutEffect)(function () {
+    (0, _newArrowCheck2.default)(this, _this6);
+    containerRef.current = document.querySelector("[".concat(ID_KEY, "=\"").concat(uid, "\"]"));
+  }.bind(this), [uid]);
+  var maxCount = (0, _react.useMemo)(function () {
+    (0, _newArrowCheck2.default)(this, _this6);
+    var maxCount = Math.min(l, Math.max(_exposeCount, 0));
+    if (maxCount === l - 1 && smart) maxCount = l;
+    return maxCount;
+  }.bind(this), [_exposeCount, l, smart]);
+
+  var _useOverflow = (0, _useOverflow3.default)({
+    containerRef: containerRef,
+    defaultCount: maxCount,
+    maxCount: maxCount
+  }),
+      _useOverflow2 = (0, _slicedToArray2.default)(_useOverflow, 1),
+      exposeCount = _useOverflow2[0];
+
+  return /*#__PURE__*/_react.default.createElement(PureActionList, (0, _extends2.default)({}, rest, {
+    actionList: actionList,
+    exposeCount: exposeCount,
+    smart: false
+  }, (0, _defineProperty2.default)({}, ID_KEY, uid)));
+}.bind(void 0);
+
+var ActionList = function ActionList(_ref7) {
+  (0, _newArrowCheck2.default)(this, _this);
+  var _autoAdjustment = _ref7.autoAdjustment,
+      rest = (0, _objectWithoutProperties2.default)(_ref7, _excluded6);
+
+  var _useConfig = (0, _useConfig2.default)(),
+      actionListAutoAdjustment = _useConfig.actionListAutoAdjustment;
+
+  var autoAdjustment = _autoAdjustment === undefined ? actionListAutoAdjustment === undefined ? _config.default.actionListAutoAdjustment : actionListAutoAdjustment : _autoAdjustment;
+
+  if (autoAdjustment) {
+    return /*#__PURE__*/_react.default.createElement(AutoAdjustmentActionList, rest);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(PureActionList, rest);
+  }
+}.bind(void 0);
+
 ActionList.propTypes = {
   actionList: _propTypes.default.arrayOf(_propTypes.default.shape({
     label: _propTypes.default.node,
@@ -266,6 +339,7 @@ ActionList.propTypes = {
     disabled: _propTypes.default.bool
   })).isRequired,
   exposeCount: _propTypes.default.number,
+  autoAdjustment: _propTypes.default.bool,
   smart: _propTypes.default.bool,
   popoverProps: _propTypes.default.any
 };

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ActionListProps } from './ActionList';
 declare const ExportActionList: import("react").NamedExoticComponent<import("./ActionList").DefinedActionListProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("./ActionList").DefinedActionListProps>> & {
-    readonly type: ({ actionList, exposeCount, size, smart, buttonStyleType, popoverProps, dropdownButton, className, ...rest }: ActionListProps) => JSX.Element;
+    readonly type: ({ autoAdjustment: _autoAdjustment, ...rest }: ActionListProps) => JSX.Element;
 } & {
     Sizes: ["sm", "md", "lg"];
     ButtonStyleTypes: ["primary", "border", "border-gray"];

package/lib/components/ActionList/style/index.d.ts

@@ -1 +1,3 @@
+/// <reference types="react" />
 export declare const prefixCls: string;
+export declare const SWrap: import("@emotion/styled-base").StyledComponent<import("../../Combine/Combine").DefinedCombineProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("../../Combine/Combine").DefinedCombineProps>, Pick<import("../../Combine/Combine").DefinedCombineProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("../../Combine/Combine").DefinedCombineProps>, "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | keyof import("../../Combine/Combine").DefinedCombineProps>, object>;

package/lib/components/ActionList/style/index.js

@@ -5,10 +5,41 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.prefixCls = void 0;
+exports.SWrap = exports.prefixCls = void 0;
+
+var _newArrowCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/newArrowCheck"));
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _core = require("@emotion/core");
+
+var _Combine = _interopRequireDefault(require("../../../components/Combine"));
 
 var _config = _interopRequireDefault(require("../../../config"));
 
+var _this = void 0;
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
 var _prefixCls = _config.default.prefixCls;
 var prefixCls = _prefixCls + '-actionlist';
-exports.prefixCls = prefixCls;
+exports.prefixCls = prefixCls;
+
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1rn6kt6-SWrap",
+  styles: "white-space:nowrap;;label:SWrap;"
+} : {
+  name: "1rn6kt6-SWrap",
+  styles: "white-space:nowrap;;label:SWrap;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0FjdGlvbkxpc3Qvc3R5bGUvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVWMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQWN0aW9uTGlzdC9zdHlsZS9pbmRleC50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgQ29tYmluZSBmcm9tICdzcmMvY29tcG9uZW50cy9Db21iaW5lJztcbmltcG9ydCBjb25maWcgZnJvbSAnc3JjL2NvbmZpZyc7XG5cbmNvbnN0IHsgcHJlZml4Q2xzOiBfcHJlZml4Q2xzIH0gPSBjb25maWc7XG5leHBvcnQgY29uc3QgcHJlZml4Q2xzID0gX3ByZWZpeENscyArICctYWN0aW9ubGlzdCc7XG5cbmV4cG9ydCBjb25zdCBTV3JhcCA9IHN0eWxlZChDb21iaW5lKSgoKSA9PiB7XG4gICAgcmV0dXJuIGNzc2BcbiAgICAgICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBgO1xufSk7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var SWrap = ( /*#__PURE__*/0, _styledBase.default)(_Combine.default, {
+  target: "e17ez9160",
+  label: "SWrap"
+})(function () {
+  (0, _newArrowCheck2.default)(this, _this);
+  return _ref;
+}.bind(void 0), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0FjdGlvbkxpc3Qvc3R5bGUvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU3FCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0FjdGlvbkxpc3Qvc3R5bGUvaW5kZXgudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IENvbWJpbmUgZnJvbSAnc3JjL2NvbXBvbmVudHMvQ29tYmluZSc7XG5pbXBvcnQgY29uZmlnIGZyb20gJ3NyYy9jb25maWcnO1xuXG5jb25zdCB7IHByZWZpeENsczogX3ByZWZpeENscyB9ID0gY29uZmlnO1xuZXhwb3J0IGNvbnN0IHByZWZpeENscyA9IF9wcmVmaXhDbHMgKyAnLWFjdGlvbmxpc3QnO1xuXG5leHBvcnQgY29uc3QgU1dyYXAgPSBzdHlsZWQoQ29tYmluZSkoKCkgPT4ge1xuICAgIHJldHVybiBjc3NgXG4gICAgICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgYDtcbn0pO1xuIl19 */");
+exports.SWrap = SWrap;

package/lib/components/ConfigProvider/ConfigContext.d.ts

@@ -4,6 +4,6 @@ export declare const defaultConfig: {
     forwardPopupContainer: boolean;
     preventFormDefaultAction: boolean;
 };
-export declare type ConfigContextType = Pick<ConfigProviderProps, 'forwardPopupContainer' | 'popover' | 'preventFormDefaultAction' | 'iconDefaultPrefix'>;
+export declare type ConfigContextType = Pick<ConfigProviderProps, 'forwardPopupContainer' | 'popover' | 'preventFormDefaultAction' | 'iconDefaultPrefix' | 'actionListAutoAdjustment'>;
 declare const _default: import("react").Context<ConfigContextType>;
 export default _default;

package/lib/components/ConfigProvider/ConfigProvider.d.ts

@@ -33,6 +33,8 @@ export interface ConfigProviderProps {
     theme?: any;
     /** 提供时会使用 LocaleProvider 包裹 */
     locale?: AllLocaleMap;
+    /** 是否默认启用 ActionList 的 autoAdJustment 参数 */
+    actionListAutoAdjustment?: boolean;
 }
 declare const ConfigProvider: ({ children, theme, locale, ...rest }: ConfigProviderProps) => JSX.Element;
 export default ConfigProvider;

package/lib/components/ConfigProvider/ConfigProvider.js

@@ -68,7 +68,8 @@ ConfigProvider.propTypes = {
   }),
   preventFormDefaultAction: _propTypes.default.bool,
   iconDefaultPrefix: _propTypes.default.string,
-  theme: _propTypes.default.any
+  theme: _propTypes.default.any,
+  actionListAutoAdjustment: _propTypes.default.bool
 };
 var _default = ConfigProvider;
 exports.default = _default;

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

@@ -1,2 +1,4 @@
-import ConfigProvider from './ConfigProvider';
-export default ConfigProvider;
+declare const ExportConfigProvider: (({ children, theme, locale, ...rest }: import("./ConfigProvider").ConfigProviderProps) => JSX.Element) & {
+    setConfig: (_config: any) => void;
+};
+export default ExportConfigProvider;

package/lib/components/ConfigProvider/index.js

@@ -7,7 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _config = require("../../config");
+
+var _type = require("../../type");
+
 var _ConfigProvider = _interopRequireDefault(require("./ConfigProvider"));
 
-var _default = _ConfigProvider.default;
+var ExportConfigProvider = (0, _type.ExportComponent)(_ConfigProvider.default, {
+  setConfig: _config.setConfig
+});
+var _default = ExportConfigProvider;
 exports.default = _default;

package/lib/components/DatePicker/DatePicker.d.ts

@@ -44,7 +44,11 @@ export declare type DatePickerProps = {
     status?: 'default' | 'error';
     /** placeholder */
     placeholder?: string;
-    /** 面板快捷内容 */
+    /**
+     * @deprecated 新版交互已移除相关展示
+     * @ignore
+     * 面板快捷内容
+     */
     shortcuts?: TShortcut[] | null;
     /** 自定义 popover，参考 popover */
     popoverProps?: any;

package/lib/components/Form/ControllerContext.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 declare const ControllerContext: React.Context<{
-    status?: "loading" | "default" | "success" | "warning" | "error" | undefined;
+    status?: "loading" | "default" | "error" | "success" | "warning" | undefined;
 }>;
 export default ControllerContext;

package/lib/components/Input/.recodo/interaction.js

@@ -24,8 +24,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 var config = {
-  size: _interactionDemo.USE_DEFINE,
-  clearable: _interactionDemo.USE_DEFINE,
+  size: ['sm', 'md', 'lg'],
+  clearable: 'boolean',
   disabled: 'boolean',
   block: _interactionDemo.USE_DEFINE,
   status: _interactionDemo.USE_DEFINE,

package/lib/components/Input/Input.js

@@ -19,16 +19,8 @@ var _newArrowCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/new
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Icon = _interopRequireDefault(require("../../components/Icon"));
-
-var _SvgIcon = _interopRequireDefault(require("../../components/SvgIcon"));
-
 var _ControllerContext = _interopRequireDefault(require("../../components/Form/ControllerContext"));
 
-var _deprecatedLog = _interopRequireDefault(require("../../utils/deprecatedLog"));
-
 var _noop = _interopRequireDefault(require("../../utils/noop"));
 
 var _useUncontrolled3 = _interopRequireDefault(require("../../hooks/useUncontrolled"));
@@ -43,7 +35,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var deprecatedLogForIcon = (0, _deprecatedLog.default)('Input icon', 'suffix');
 var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _this2 = this;
 
@@ -76,7 +67,7 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   }.bind(this), []);
 
   var _useUncontrolled = (0, _useUncontrolled3.default)(_value, defaultValue || '', _onChange, {
-    setter: valueGetter
+    getter: valueGetter
   }),
       _useUncontrolled2 = (0, _slicedToArray2.default)(_useUncontrolled, 2),
       value = _useUncontrolled2[0],
@@ -144,67 +135,22 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     e.preventDefault();
     (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
   }.bind(this), []);
-  var renderClear = (0, _react.useMemo)(function () {
-    (0, _newArrowCheck2.default)(this, _this2);
-
-    if (clearable) {
-      return /*#__PURE__*/_react.default.createElement("span", {
-        className: _style.clearCls,
-        onClick: handleClear,
-        onMouseDown: handleClearMouseDown
-      }, /*#__PURE__*/_react.default.createElement(_SvgIcon.default, {
-        type: "cross-circle-filled"
-      }));
-    }
-  }.bind(this), [clearable, handleClear, handleClearMouseDown]);
-  var renderPrefix = (0, _react.useMemo)(function () {
-    (0, _newArrowCheck2.default)(this, _this2);
-    return prefix && /*#__PURE__*/_react.default.createElement("span", {
-      className: _style.inputPrefixCls
-    }, prefix);
-  }.bind(this), [prefix]);
-  var renderSuffix = (0, _react.useMemo)(function () {
-    (0, _newArrowCheck2.default)(this, _this2);
-
-    if (icon) {
-      deprecatedLogForIcon();
-    }
-
-    var renderSuffix = null;
-
-    if (suffix) {
-      renderSuffix = suffix;
-    } else if (typeof icon === 'string') {
-      renderSuffix = /*#__PURE__*/_react.default.createElement(_Icon.default, {
-        type: icon
-      });
-    } else if ( /*#__PURE__*/_react.default.isValidElement(icon)) {
-      renderSuffix = icon;
-    }
-
-    if (renderSuffix) {
-      return /*#__PURE__*/_react.default.createElement("span", {
-        className: _style.inputSuffixCls
-      }, renderSuffix);
-    }
-  }.bind(this), [icon, suffix]);
 
   var _useContext = (0, _react.useContext)(_ControllerContext.default),
       status = _useContext.status;
 
-  return /*#__PURE__*/_react.default.createElement(_style.SWrap, {
-    className: (0, _classnames.default)(block && _style.blockCls, className),
+  return /*#__PURE__*/_react.default.createElement(_style.InputWrap, {
     size: size,
     focused: focused,
     style: style,
     disabled: disabled,
     status: _status || status,
     customStyle: customStyle,
+    block: block,
+    className: className,
     empty: !value,
     onMouseDown: handleWrapMouseDown
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: _style.inputWrapCls
-  }, renderPrefix, /*#__PURE__*/_react.default.createElement("span", {
+  }, /*#__PURE__*/_react.default.createElement(_style.Prefix, null, prefix), /*#__PURE__*/_react.default.createElement("span", {
     className: _style.inputBlockWrapCls
   }, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, rest, {
     value: value,
@@ -213,7 +159,13 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     onFocus: handleFocus,
     onBlur: handleBlur,
     disabled: disabled
-  })), renderClear), renderSuffix));
+  })), /*#__PURE__*/_react.default.createElement(_style.Clear, {
+    clearable: clearable,
+    onMouseDown: handleClearMouseDown,
+    onClick: handleClear
+  })), /*#__PURE__*/_react.default.createElement(_style.Suffix, {
+    icon: icon
+  }, suffix));
 }.bind(void 0));
 
 var _default = /*#__PURE__*/_react.default.memo(Input);

package/lib/components/Input/Search.js

@@ -71,6 +71,7 @@ var Search = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     ref: inputRef,
     suffix: /*#__PURE__*/_react.default.createElement(_style.SearchIcon, {
       type: "search",
+      disabled: disabled,
       onClick: onSearch
     })
   }));

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

@@ -1,19 +1,34 @@
-/// <reference types="react" />
+import React, { CSSProperties, ReactNode } from 'react';
 import SvgIcon from '../../../components/SvgIcon';
 import { InputProps } from '../Input';
 export declare const prefixCls: string;
 export declare const focusedCls: string;
 export declare const disabledCls: string;
 export declare const blockCls: string;
-export declare const inputWrapCls: string;
 export declare const inputPrefixCls: string;
 export declare const inputSuffixCls: string;
 export declare const clearCls: string;
 export declare const inputBlockWrapCls: string;
-export declare const SearchIcon: import("@emotion/styled-base").StyledComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<SvgIcon>, Pick<Pick<any, string | number | symbol> & import("react").RefAttributes<SvgIcon>, string | number | symbol>, object>;
-export declare const SWrap: import("react").ForwardRefExoticComponent<Pick<InputProps, "customStyle" | "disabled" | "status"> & Required<Pick<InputProps, "size">> & {
-    focused: boolean;
-    empty: boolean;
-} & import("react").HTMLAttributes<HTMLSpanElement> & {
+export declare const SearchIcon: import("@emotion/styled-base").StyledComponent<Pick<any, string | number | symbol> & React.RefAttributes<SvgIcon>, Pick<Pick<any, string | number | symbol> & React.RefAttributes<SvgIcon>, string | number | symbol>, object>;
+export declare const Prefix: React.NamedExoticComponent<object>;
+export declare const Suffix: React.NamedExoticComponent<{
+    icon?: string | ReactNode;
+    children?: ReactNode;
+}>;
+export declare const Clear: React.NamedExoticComponent<Pick<InputProps, "clearable"> & React.HTMLAttributes<HTMLSpanElement>>;
+export declare const InputPart: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    stretch?: boolean | undefined;
+    visible?: boolean | undefined;
+}, object>;
+export declare type InputWrapProps = Pick<InputProps, 'block' | 'disabled' | 'status' | 'customStyle'> & Required<Pick<InputProps, 'size'>> & {
+    focused?: boolean;
+    empty?: boolean;
+    cursor?: CSSProperties['cursor'];
+};
+export declare const InputWrap: React.ForwardRefExoticComponent<Pick<InputProps, "block" | "customStyle" | "disabled" | "status"> & Required<Pick<InputProps, "size">> & {
+    focused?: boolean | undefined;
+    empty?: boolean | undefined;
+    cursor?: CSSProperties['cursor'];
+} & React.HTMLAttributes<HTMLSpanElement> & {
     theme?: import("../../../style").Theme | undefined;
-} & import("react").RefAttributes<HTMLSpanElement>>;
+} & React.RefAttributes<HTMLSpanElement>>;