@douyinfe/semi-ui 2.32.2 → 2.33.0

package/lib/cjs/treeSelect/index.d.ts

@@ -101,6 +101,7 @@ declare class TreeSelect extends BaseComponent<TreeSelectProps, TreeSelectState>
         'aria-invalid': PropTypes.Requireable<boolean>;
         'aria-labelledby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
+        borderless: PropTypes.Requireable<boolean>;
         loadedKeys: PropTypes.Requireable<string[]>;
         loadData: PropTypes.Requireable<(...args: any[]) => any>;
         onLoad: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/cjs/treeSelect/index.js

@@ -441,7 +441,8 @@ class TreeSelect extends _baseComponent.default {
         showClear,
         leafOnly,
         searchPosition,
-        triggerRender
+        triggerRender,
+        borderless
       } = this.props;
       const {
         inputValue,
@@ -460,6 +461,7 @@ class TreeSelect extends _baseComponent.default {
       const isEmptyTriggerSearch = isTriggerPositionSearch && (0, _isEmpty2.default)(checkedKeys);
       const isValueTriggerSearch = isTriggerPositionSearch && !(0, _isEmpty2.default)(checkedKeys);
       const classNames = useCustomTrigger ? (0, _classnames.default)(className) : (0, _classnames.default)(prefixcls, {
+        [`${prefixcls}-borderless`]: borderless,
         [`${prefixcls}-focus`]: isFocus,
         [`${prefixcls}-disabled`]: disabled,
         [`${prefixcls}-single`]: !multiple,
@@ -1343,6 +1345,7 @@ TreeSelect.propTypes = {
   'aria-invalid': _propTypes.default.bool,
   'aria-labelledby': _propTypes.default.string,
   'aria-required': _propTypes.default.bool,
+  borderless: _propTypes.default.bool,
   loadedKeys: _propTypes.default.arrayOf(_propTypes.default.string),
   loadData: _propTypes.default.func,
   onLoad: _propTypes.default.func,
@@ -1426,6 +1429,7 @@ TreeSelect.propTypes = {
   clickTriggerToHide: _propTypes.default.bool
 };
 TreeSelect.defaultProps = {
+  borderless: false,
   searchPosition: _constants.strings.SEARCH_POSITION_DROPDOWN,
   arrowIcon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronDown, null),
   autoExpandParent: false,

package/lib/es/cascader/index.d.ts

@@ -75,6 +75,7 @@ declare class Cascader extends BaseComponent<CascaderProps, CascaderState> {
         'aria-required': PropTypes.Requireable<boolean>;
         'aria-label': PropTypes.Requireable<string>;
         arrowIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        borderless: PropTypes.Requireable<boolean>;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         changeOnSelect: PropTypes.Requireable<boolean>;
         defaultValue: PropTypes.Requireable<NonNullable<string | any[]>>;
@@ -143,6 +144,7 @@ declare class Cascader extends BaseComponent<CascaderProps, CascaderState> {
         position: PropTypes.Requireable<string>;
     };
     static defaultProps: {
+        borderless: boolean;
         leafOnly: boolean;
         arrowIcon: JSX.Element;
         stopPropagation: boolean;

package/lib/es/cascader/index.js

@@ -434,7 +434,8 @@ class Cascader extends BaseComponent {
         insetLabel,
         triggerRender,
         showClear,
-        id
+        id,
+        borderless
       } = this.props;
       const {
         isOpen,
@@ -445,6 +446,7 @@ class Cascader extends BaseComponent {
       const filterable = Boolean(filterTreeNode);
       const useCustomTrigger = typeof triggerRender === 'function';
       const classNames = useCustomTrigger ? cls(className) : cls(prefixcls, className, {
+        [`${prefixcls}-borderless`]: borderless,
         [`${prefixcls}-focus`]: isFocus || isOpen && !isInput,
         [`${prefixcls}-disabled`]: disabled,
         [`${prefixcls}-single`]: true,
@@ -977,6 +979,7 @@ Cascader.propTypes = {
   'aria-required': PropTypes.bool,
   'aria-label': PropTypes.string,
   arrowIcon: PropTypes.node,
+  borderless: PropTypes.bool,
   clearIcon: PropTypes.node,
   changeOnSelect: PropTypes.bool,
   defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
@@ -1047,6 +1050,7 @@ Cascader.propTypes = {
   position: PropTypes.string
 };
 Cascader.defaultProps = {
+  borderless: false,
   leafOnly: false,
   arrowIcon: /*#__PURE__*/React.createElement(IconChevronDown, null),
   stopPropagation: true,

package/lib/es/collapse/collapse-context.d.ts

@@ -3,6 +3,7 @@ export interface CollapseContextType {
     activeSet: Set<string>;
     expandIcon: React.ReactNode;
     collapseIcon: React.ReactNode;
+    clickHeaderToExpand: boolean;
     keepDOM: boolean;
     expandIconPosition: 'left' | 'right';
     onClick: (activeKey: string, e: React.MouseEvent) => void;

package/lib/es/collapse/index.d.ts

@@ -20,6 +20,7 @@ declare class Collapse extends BaseComponent<CollapseReactProps, CollapseState>
         activeKey: PropTypes.Requireable<NonNullable<string | any[]>>;
         defaultActiveKey: PropTypes.Requireable<NonNullable<string | any[]>>;
         accordion: PropTypes.Requireable<boolean>;
+        clickHeaderToExpand: PropTypes.Requireable<boolean>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         expandIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         collapseIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -31,6 +32,7 @@ declare class Collapse extends BaseComponent<CollapseReactProps, CollapseState>
     };
     static defaultProps: {
         defaultActiveKey: string;
+        clickHeaderToExpand: boolean;
         onChange: typeof noop;
         expandIconPosition: string;
     };

package/lib/es/collapse/index.js

@@ -81,9 +81,10 @@ class Collapse extends BaseComponent {
       expandIconPosition,
       expandIcon,
       collapseIcon,
-      children
+      children,
+      clickHeaderToExpand
     } = _a,
-          rest = __rest(_a, ["defaultActiveKey", "accordion", "style", "motion", "className", "keepDOM", "expandIconPosition", "expandIcon", "collapseIcon", "children"]);
+          rest = __rest(_a, ["defaultActiveKey", "accordion", "style", "motion", "className", "keepDOM", "expandIconPosition", "expandIcon", "collapseIcon", "children", "clickHeaderToExpand"]);
 
     const clsPrefix = cls(cssClasses.PREFIX, className);
     const {
@@ -97,6 +98,7 @@ class Collapse extends BaseComponent {
         activeSet,
         expandIcon,
         collapseIcon,
+        clickHeaderToExpand,
         keepDOM,
         expandIconPosition,
         onClick: this.onChange,
@@ -112,6 +114,7 @@ Collapse.propTypes = {
   activeKey: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
   defaultActiveKey: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
   accordion: PropTypes.bool,
+  clickHeaderToExpand: PropTypes.bool,
   onChange: PropTypes.func,
   expandIcon: PropTypes.node,
   collapseIcon: PropTypes.node,
@@ -123,6 +126,7 @@ Collapse.propTypes = {
 };
 Collapse.defaultProps = {
   defaultActiveKey: '',
+  clickHeaderToExpand: true,
   onChange: noop,
   expandIconPosition: 'right'
 };

package/lib/es/collapse/item.d.ts

@@ -14,6 +14,7 @@ export interface CollapsePanelProps {
 }
 export default class CollapsePanel extends PureComponent<CollapsePanelProps> {
     static contextType: React.Context<CollapseContextType>;
+    headerExpandIconTriggerRef: React.RefObject<HTMLElement>;
     static propTypes: {
         itemKey: PropTypes.Requireable<string>;
         extra: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -30,5 +31,6 @@ export default class CollapsePanel extends PureComponent<CollapsePanelProps> {
     private ariaID;
     context: CollapseContextType;
     renderHeader(active: boolean, expandIconEnable?: boolean): JSX.Element;
+    handleClick: (itemKey: string, e: React.MouseEvent) => void;
     render(): JSX.Element;
 }

package/lib/es/collapse/item.js

@@ -20,7 +20,18 @@ import { getUuidShort } from '@douyinfe/semi-foundation/lib/es/utils/uuid';
 export default class CollapsePanel extends PureComponent {
   constructor() {
     super(...arguments);
+    this.headerExpandIconTriggerRef = /*#__PURE__*/React.createRef();
     this.ariaID = getUuidShort({});
+
+    this.handleClick = (itemKey, e) => {
+      var _a; // Judge user click Icon or Header
+      // Don't mount this func into icon span wrapper, or get triggered twice because of event propagation
+
+
+      if (this.context.clickHeaderToExpand || ((_a = this.headerExpandIconTriggerRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+        this.context.onClick(itemKey, e);
+      }
+    };
   }
 
   renderHeader(active) {
@@ -47,6 +58,7 @@ export default class CollapsePanel extends PureComponent {
     }
 
     const icon = /*#__PURE__*/React.createElement("span", {
+      ref: this.headerExpandIconTriggerRef,
       "aria-hidden": 'true',
       className: cls([`${cssClasses.PREFIX}-header-icon`, {
         [`${cssClasses.PREFIX}-header-iconDisabled`]: !expandIconEnable
@@ -81,7 +93,6 @@ export default class CollapsePanel extends PureComponent {
       keepDOM,
       expandIconPosition,
       activeSet,
-      onClick,
       motion
     } = this.context;
     const active = activeSet.has(itemKey);
@@ -105,7 +116,7 @@ export default class CollapsePanel extends PureComponent {
       "aria-disabled": disabled,
       "aria-expanded": active ? 'true' : 'false',
       "aria-owns": this.ariaID,
-      onClick: e => !disabled && onClick(itemKey, e)
+      onClick: e => !disabled && this.handleClick(itemKey, e)
     }, this.renderHeader(active, children !== undefined && !disabled)), children && /*#__PURE__*/React.createElement(Collapsible, {
       isOpen: active,
       keepDOM: keepDOM,

package/lib/es/datePicker/dateInput.d.ts

@@ -21,6 +21,7 @@ export interface DateInputProps extends DateInputFoundationProps, BaseProps {
 }
 export default class DateInput extends BaseComponent<DateInputProps, {}> {
     static propTypes: {
+        borderless: PropTypes.Requireable<boolean>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         onEnterPress: PropTypes.Requireable<(...args: any[]) => any>;
@@ -49,6 +50,7 @@ export default class DateInput extends BaseComponent<DateInputProps, {}> {
         defaultPickerValue: PropTypes.Requireable<NonNullable<string | number | object>>;
     };
     static defaultProps: {
+        borderless: boolean;
         showClear: boolean;
         onClick: typeof noop;
         onChange: typeof noop;

package/lib/es/datePicker/dateInput.js

@@ -214,7 +214,8 @@ export default class DateInput extends BaseComponent {
       rangeInputEndRef,
       rangeInputFocus,
       prefixCls,
-      rangeSeparator
+      rangeSeparator,
+      borderless
     } = rangeProps;
     const [rangeStart, rangeEnd = ''] = text.split(rangeSeparator) || [];
     const rangeSize = size === 'large' ? 'default' : 'small';
@@ -222,15 +223,18 @@ export default class DateInput extends BaseComponent {
     const [rangeStartPlaceholder, rangeEndPlaceholder] = rangePlaceholder;
     const inputLeftWrapperCls = cls(`${prefixCls}-range-input-wrapper-start`, `${prefixCls}-range-input-wrapper`, {
       [`${prefixCls}-range-input-wrapper-active`]: rangeInputFocus === 'rangeStart' && !disabled,
-      [`${prefixCls}-range-input-wrapper-start-with-prefix`]: this.props.prefix || this.props.insetLabel
+      [`${prefixCls}-range-input-wrapper-start-with-prefix`]: this.props.prefix || this.props.insetLabel,
+      [`${prefixCls}-borderless`]: borderless
     });
     const inputRightWrapperCls = cls(`${prefixCls}-range-input-wrapper-end`, `${prefixCls}-range-input-wrapper`, {
-      [`${prefixCls}-range-input-wrapper-active`]: rangeInputFocus === 'rangeEnd' && !disabled
+      [`${prefixCls}-range-input-wrapper-active`]: rangeInputFocus === 'rangeEnd' && !disabled,
+      [`${prefixCls}-borderless`]: borderless
     });
     return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderRangePrefix(), /*#__PURE__*/React.createElement("div", {
       onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeStart'),
       className: `${inputCls} ${inputLeftWrapperCls}`
     }, /*#__PURE__*/React.createElement(Input, {
+      borderless: borderless,
       size: rangeSize,
       style: inputStyle,
       disabled: disabled,
@@ -248,6 +252,7 @@ export default class DateInput extends BaseComponent {
       className: `${inputCls} ${inputRightWrapperCls}`,
       onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeEnd')
     }, /*#__PURE__*/React.createElement(Input, {
+      borderless: borderless,
       size: rangeSize,
       style: inputStyle,
       disabled: disabled,
@@ -438,6 +443,7 @@ export default class DateInput extends BaseComponent {
 
 }
 DateInput.propTypes = {
+  borderless: PropTypes.bool,
   onClick: PropTypes.func,
   onChange: PropTypes.func,
   onEnterPress: PropTypes.func,
@@ -466,6 +472,7 @@ DateInput.propTypes = {
   defaultPickerValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object, PropTypes.array])
 };
 DateInput.defaultProps = {
+  borderless: false,
   showClear: true,
   onClick: noop,
   onChange: noop,

package/lib/es/datePicker/datePicker.d.ts

@@ -57,6 +57,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         'aria-invalid': PropTypes.Requireable<boolean>;
         'aria-labelledby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
+        borderless: PropTypes.Requireable<boolean>;
         type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "monthRange" | "dateTimeRange">;
         size: PropTypes.Requireable<"default" | "small" | "large">;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -128,6 +129,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
     };
     static defaultProps: {
         onChangeWithDateFirst: boolean;
+        borderless: boolean;
         autoAdjustOverflow: boolean;
         stopPropagation: boolean;
         motion: boolean;
@@ -227,7 +229,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
     handleInsetDateFocus: (e: React.FocusEvent, rangeType: 'rangeStart' | 'rangeEnd') => void;
     handleInsetTimeFocus: () => void;
     handlePanelVisibleChange: (visible: boolean) => void;
-    renderInner(): JSX.Element;
+    renderInner(extraProps?: Partial<DatePickerProps>): JSX.Element;
     handleConfirm: (e: React.MouseEvent) => void;
     handleCancel: (e: React.MouseEvent) => void;
     renderFooter: (locale: Locale['DatePicker'], localeCode: string) => JSX.Element;

package/lib/es/datePicker/datePicker.js

@@ -1,3 +1,4 @@
+import _pick from "lodash/pick";
 import _isEqual from "lodash/isEqual";
 import _isFunction from "lodash/isFunction";
 import _get from "lodash/get";
@@ -706,7 +707,7 @@ export default class DatePicker extends BaseComponent {
     })) : null;
   }
 
-  renderInner() {
+  renderInner(extraProps) {
     const {
       clearIcon,
       type,
@@ -727,7 +728,8 @@ export default class DatePicker extends BaseComponent {
       inputReadOnly,
       rangeSeparator,
       insetInput,
-      defaultPickerValue
+      defaultPickerValue,
+      borderless
     } = this.props;
     const {
       value,
@@ -743,12 +745,13 @@ export default class DatePicker extends BaseComponent {
       [`${cssClasses.PREFIX}-range-input-${size}`]: isRangeType && size,
       [`${cssClasses.PREFIX}-range-input-active`]: isRangeType && rangeInputFocus && !inputDisabled,
       [`${cssClasses.PREFIX}-range-input-disabled`]: isRangeType && inputDisabled,
-      [`${cssClasses.PREFIX}-range-input-${validateStatus}`]: isRangeType && validateStatus
+      [`${cssClasses.PREFIX}-range-input-${validateStatus}`]: isRangeType && validateStatus,
+      [`${cssClasses.PREFIX}-borderless`]: borderless
     });
     const phText = placeholder || locale.placeholder[type]; // i18n
     // These values should be passed to triggerRender, do not delete any key if it is not necessary
 
-    const props = {
+    const props = Object.assign(Object.assign({}, extraProps), {
       placeholder: phText,
       clearIcon,
       disabled: inputDisabled,
@@ -784,7 +787,7 @@ export default class DatePicker extends BaseComponent {
       rangeInputStartRef: insetInput ? null : this.rangeInputStartRef,
       rangeInputEndRef: insetInput ? null : this.rangeInputEndRef,
       inputRef: this.inputRef
-    };
+    });
     return /*#__PURE__*/React.createElement("div", {
       // tooltip will mount a11y props to children
       // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
@@ -804,7 +807,8 @@ export default class DatePicker extends BaseComponent {
     const {
       style,
       className,
-      prefixCls
+      prefixCls,
+      type
     } = this.props;
     const outerProps = {
       style,
@@ -818,7 +822,13 @@ export default class DatePicker extends BaseComponent {
       'aria-describedby': this.props['aria-describedby'],
       'aria-required': this.props['aria-required']
     };
-    const inner = this.renderInner();
+    const innerPropKeys = [];
+
+    if (!type.toLowerCase().includes("range")) {
+      innerPropKeys.push("borderless");
+    }
+
+    const inner = this.renderInner(_pick(this.props, innerPropKeys));
     const wrappedInner = this.wrapPopover(inner);
     return /*#__PURE__*/React.createElement("div", Object.assign({}, outerProps), wrappedInner);
   }
@@ -831,6 +841,7 @@ DatePicker.propTypes = {
   'aria-invalid': PropTypes.bool,
   'aria-labelledby': PropTypes.string,
   'aria-required': PropTypes.bool,
+  borderless: PropTypes.bool,
   type: PropTypes.oneOf(strings.TYPE_SET),
   size: PropTypes.oneOf(strings.SIZE_SET),
   clearIcon: PropTypes.node,
@@ -904,6 +915,7 @@ DatePicker.propTypes = {
 };
 DatePicker.defaultProps = {
   onChangeWithDateFirst: true,
+  borderless: false,
   autoAdjustOverflow: true,
   stopPropagation: true,
   motion: true,

package/lib/es/form/baseForm.d.ts

@@ -64,6 +64,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
         autoFocus?: boolean;
         autoClearSearchValue?: boolean;
         arrowIcon?: React.ReactNode;
+        borderless?: boolean;
         clearIcon?: React.ReactNode;
         defaultValue?: string | number | any[] | Record<string, any>;
         value?: string | number | any[] | Record<string, any>;

package/lib/es/form/field.d.ts

@@ -12,6 +12,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     autoFocus?: boolean;
     autoClearSearchValue?: boolean;
     arrowIcon?: import("react").ReactNode;
+    borderless?: boolean;
     clearIcon?: import("react").ReactNode;
     defaultValue?: string | number | any[] | Record<string, any>;
     value?: string | number | any[] | Record<string, any>;

package/lib/es/input/index.d.ts

@@ -17,6 +17,7 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     'aria-required'?: React.AriaAttributes['aria-required'];
     addonBefore?: React.ReactNode;
     addonAfter?: React.ReactNode;
+    borderless?: boolean;
     prefix?: React.ReactNode;
     suffix?: React.ReactNode;
     mode?: InputMode;
@@ -101,6 +102,7 @@ declare class Input extends BaseComponent<InputProps, InputState> {
         inputStyle: PropTypes.Requireable<object>;
         getValueLength: PropTypes.Requireable<(...args: any[]) => any>;
         preventScroll: PropTypes.Requireable<boolean>;
+        borderless: PropTypes.Requireable<boolean>;
     };
     static defaultProps: {
         addonBefore: string;
@@ -124,6 +126,7 @@ declare class Input extends BaseComponent<InputProps, InputState> {
         onKeyPress: (...args: any[]) => void;
         onEnterPress: (...args: any[]) => void;
         validateStatus: string;
+        noBg: boolean;
     };
     inputRef: React.RefObject<HTMLInputElement>;
     prefixRef: React.RefObject<React.ReactNode>;

package/lib/es/input/index.js

@@ -375,9 +375,10 @@ class Input extends BaseComponent {
       forwardRef,
       maxLength,
       getValueLength,
-      preventScroll
+      preventScroll,
+      borderless
     } = _a,
-          rest = __rest(_a, ["addonAfter", "addonBefore", "autofocus", "clearIcon", "className", "disabled", "defaultValue", "placeholder", "prefix", "mode", "insetLabel", "insetLabelId", "validateStatus", "type", "readonly", "size", "suffix", "style", "showClear", "onEnterPress", "onClear", "hideSuffix", "inputStyle", "forwardRef", "maxLength", "getValueLength", "preventScroll"]);
+          rest = __rest(_a, ["addonAfter", "addonBefore", "autofocus", "clearIcon", "className", "disabled", "defaultValue", "placeholder", "prefix", "mode", "insetLabel", "insetLabelId", "validateStatus", "type", "readonly", "size", "suffix", "style", "showClear", "onEnterPress", "onClear", "hideSuffix", "inputStyle", "forwardRef", "maxLength", "getValueLength", "preventScroll", "borderless"]);
 
     const {
       value,
@@ -405,7 +406,8 @@ class Input extends BaseComponent {
       [`${wrapperPrefix}-clearable`]: showClear,
       [`${wrapperPrefix}-modebtn`]: mode === 'password',
       [`${wrapperPrefix}-hidden`]: type === 'hidden',
-      [`${wrapperPrefix}-${size}`]: size
+      [`${wrapperPrefix}-${size}`]: size,
+      [`${prefixCls}-borderless`]: borderless
     });
     const inputCls = cls(prefixCls, {
       [`${prefixCls}-${size}`]: size,
@@ -500,7 +502,8 @@ Input.propTypes = {
   insetLabelId: PropTypes.string,
   inputStyle: PropTypes.object,
   getValueLength: PropTypes.func,
-  preventScroll: PropTypes.bool
+  preventScroll: PropTypes.bool,
+  borderless: PropTypes.bool
 };
 Input.defaultProps = {
   addonBefore: '',
@@ -523,7 +526,8 @@ Input.defaultProps = {
   onKeyUp: _noop,
   onKeyPress: _noop,
   onEnterPress: _noop,
-  validateStatus: 'default'
+  validateStatus: 'default',
+  noBg: false
 };
 const ForwardInput = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Input, Object.assign({}, props, {
   forwardRef: ref

package/lib/es/input/textarea.d.ts

@@ -4,6 +4,7 @@ import '@douyinfe/semi-foundation/lib/es/input/textarea.css';
 declare type OmitTextareaAttr = 'onChange' | 'onInput' | 'prefix' | 'size' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyPress' | 'onKeyUp';
 export interface TextAreaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, OmitTextareaAttr> {
     autosize?: boolean;
+    borderless?: boolean;
     placeholder?: string;
     value?: string;
     rows?: number;

package/lib/es/input/textarea.js

@@ -218,9 +218,10 @@ class TextArea extends BaseComponent {
       getValueLength,
       maxLength,
       minLength,
-      showClear
+      showClear,
+      borderless
     } = _a,
-          rest = __rest(_a, ["autosize", "placeholder", "onEnterPress", "onResize", "disabled", "readonly", "className", "showCounter", "validateStatus", "maxCount", "defaultValue", "style", "forwardRef", "getValueLength", "maxLength", "minLength", "showClear"]);
+          rest = __rest(_a, ["autosize", "placeholder", "onEnterPress", "onResize", "disabled", "readonly", "className", "showCounter", "validateStatus", "maxCount", "defaultValue", "style", "forwardRef", "getValueLength", "maxLength", "minLength", "showClear", "borderless"]);
 
     const {
       isFocus,
@@ -228,6 +229,7 @@ class TextArea extends BaseComponent {
       minLength: stateMinLength
     } = this.state;
     const wrapperCls = cls(className, `${prefixCls}-textarea-wrapper`, {
+      [`${prefixCls}-textarea-borderless`]: borderless,
       [`${prefixCls}-textarea-wrapper-disabled`]: disabled,
       [`${prefixCls}-textarea-wrapper-readonly`]: readonly,
       [`${prefixCls}-textarea-wrapper-${validateStatus}`]: Boolean(validateStatus),
@@ -275,6 +277,7 @@ class TextArea extends BaseComponent {
 
 TextArea.propTypes = {
   autosize: PropTypes.bool,
+  borderless: PropTypes.bool,
   placeholder: PropTypes.string,
   value: PropTypes.string,
   rows: PropTypes.number,
@@ -293,6 +296,7 @@ TextArea.propTypes = {
 };
 TextArea.defaultProps = {
   autosize: false,
+  borderless: false,
   rows: 4,
   cols: 20,
   showCounter: false,

package/lib/es/select/index.d.ts

@@ -84,6 +84,7 @@ export declare type SelectProps = {
     autoFocus?: boolean;
     autoClearSearchValue?: boolean;
     arrowIcon?: React.ReactNode;
+    borderless?: boolean;
     clearIcon?: React.ReactNode;
     defaultValue?: string | number | any[] | Record<string, any>;
     value?: string | number | any[] | Record<string, any>;
@@ -178,6 +179,7 @@ declare class Select extends BaseComponent<SelectProps, SelectState> {
         'aria-required': PropTypes.Requireable<boolean>;
         autoFocus: PropTypes.Requireable<boolean>;
         autoClearSearchValue: PropTypes.Requireable<boolean>;
+        borderless: PropTypes.Requireable<boolean>;
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         defaultValue: PropTypes.Requireable<NonNullable<string | number | object>>;

package/lib/es/select/index.js

@@ -1125,7 +1125,8 @@ class Select extends BaseComponent {
       placeholder,
       triggerRender,
       arrowIcon,
-      clearIcon
+      clearIcon,
+      borderless
     } = this.props;
     const {
       selections,
@@ -1141,6 +1142,7 @@ class Select extends BaseComponent {
     const filterable = Boolean(filter); // filter（boolean || function）
 
     const selectionCls = useCustomTrigger ? cls(className) : cls(prefixcls, className, {
+      [`${prefixcls}-borderless`]: borderless,
       [`${prefixcls}-open`]: isOpen,
       [`${prefixcls}-focus`]: isFocus,
       [`${prefixcls}-disabled`]: disabled,
@@ -1292,6 +1294,7 @@ Select.propTypes = {
   'aria-required': PropTypes.bool,
   autoFocus: PropTypes.bool,
   autoClearSearchValue: PropTypes.bool,
+  borderless: PropTypes.bool,
   children: PropTypes.node,
   clearIcon: PropTypes.node,
   defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.array, PropTypes.object]),
@@ -1373,6 +1376,7 @@ Select.propTypes = {
 Select.defaultProps = {
   stopPropagation: true,
   motion: true,
+  borderless: false,
   zIndex: popoverNumbers.DEFAULT_Z_INDEX,
   // position: 'bottomLeft',
   filter: false,

package/lib/es/timePicker/TimeInput.d.ts

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
 import InputFoundation, { TimeInputAdapter } from '@douyinfe/semi-foundation/lib/es/timePicker/inputFoundation';
 import { TimePickerProps } from './TimePicker';
-export declare type TimeInputProps = Pick<TimePickerProps, 'value' | 'format' | 'prefixCls' | 'placeholder' | 'clearText' | 'inputReadOnly' | 'disabled' | 'type' | 'timeZone' | 'defaultOpen' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'dateFnsLocale' | 'onFocus' | 'onBlur' | 'focusOnOpen' | 'locale' | 'localeCode' | 'insetLabel' | 'validateStatus' | 'preventScroll'> & BaseProps & {
+export declare type TimeInputProps = Pick<TimePickerProps, 'value' | 'format' | 'prefixCls' | 'placeholder' | 'clearText' | 'inputReadOnly' | 'disabled' | 'type' | 'timeZone' | 'defaultOpen' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'dateFnsLocale' | 'onFocus' | 'onBlur' | 'focusOnOpen' | 'locale' | 'localeCode' | 'insetLabel' | 'validateStatus' | 'borderless' | 'preventScroll'> & BaseProps & {
     onChange?: (value: string) => void;
     onEsc?: () => void;
     onClick?: React.MouseEventHandler;
@@ -14,6 +14,7 @@ export declare type TimeInputProps = Pick<TimePickerProps, 'value' | 'format' |
 };
 declare class TimeInput extends BaseComponent<TimeInputProps, any> {
     static propTypes: {
+        borderless: PropTypes.Requireable<boolean>;
         format: PropTypes.Requireable<string>;
         prefixCls: PropTypes.Requireable<string>;
         placeholder: PropTypes.Requireable<string>;
@@ -41,6 +42,7 @@ declare class TimeInput extends BaseComponent<TimeInputProps, any> {
         preventScroll: PropTypes.Requireable<boolean>;
     };
     static defaultProps: {
+        borderless: boolean;
         inputReadOnly: boolean;
         onChange: (...args: any[]) => void;
         onBlur: (...args: any[]) => void;

package/lib/es/timePicker/TimeInput.js

@@ -162,6 +162,7 @@ class TimeInput extends BaseComponent {
 }
 
 TimeInput.propTypes = {
+  borderless: PropTypes.bool,
   format: PropTypes.string,
   prefixCls: PropTypes.string,
   placeholder: PropTypes.string,
@@ -189,6 +190,7 @@ TimeInput.propTypes = {
   preventScroll: PropTypes.bool
 };
 TimeInput.defaultProps = {
+  borderless: false,
   inputReadOnly: false,
   onChange: _noop,
   onBlur: _noop,

package/lib/es/timePicker/TimePicker.d.ts

@@ -22,6 +22,7 @@ export declare type TimePickerProps = {
     'aria-required'?: React.AriaAttributes['aria-required'];
     autoAdjustOverflow?: boolean;
     autoFocus?: boolean;
+    borderless?: boolean;
     className?: string;
     clearText?: string;
     clearIcon?: React.ReactNode;
@@ -100,6 +101,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
         'aria-describedby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
         prefixCls: PropTypes.Requireable<string>;
+        borderless: PropTypes.Requireable<boolean>;
         clearText: PropTypes.Requireable<string>;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         value: PropTypes.Requireable<NonNullable<string | number | string[] | number[] | Date | Date[]>>;
@@ -154,6 +156,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
     };
     static defaultProps: {
         autoAdjustOverflow: boolean;
+        borderless: boolean;
         getPopupContainer: () => HTMLElement;
         showClear: boolean;
         zIndex: number;