test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 02:59:04 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

feat(select): customize remove/clear/menuItemSelected icons

Browse Source
This commit is contained in:
Cheng Liu 2018-11-05 14:57:11 +08:00 committed by 偏右
parent 11384384d0
commit 0d7963236c
1 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
components/select/index.tsx
View File

@ -67,6 +67,9 @@ export interface SelectProps extends AbstractSelectProps {
getInputElement?: () => React.ReactElement<any>;
autoFocus?: boolean;
suffixIcon?: React.ReactNode;
removeIcon?: React.ReactNode;
clearIcon?: React.ReactNode;
menuItemSelectedIcon?: React.ReactNode;
}
export interface OptionProps {
@ -163,9 +166,12 @@ export default class Select extends React.Component<SelectProps, {}> {
size,
mode,
suffixIcon,
removeIcon,
clearIcon,
menuItemSelectedIcon,
...restProps
} = this.props;
const rest = omit(restProps, ['inputIcon', 'removeIcon', 'clearIcon']);
const rest = omit(restProps, ['inputIcon']);
const cls = classNames({
[`${prefixCls}-lg`]: size === 'large',
@ -190,24 +196,30 @@ export default class Select extends React.Component<SelectProps, {}> {
<Icon type="down" className={`${prefixCls}-arrow-icon`} />
);
const removeIcon = (
const finalRemoveIcon = removeIcon && (
React.isValidElement<{ className?: string }>(removeIcon)
? React.cloneElement(removeIcon) : removeIcon) || (
<Icon type="close" className={`${prefixCls}-remove-icon`} />
);
const clearIcon = (
const finalClearIcon = clearIcon && (
React.isValidElement<{ className?: string }>(clearIcon)
? React.cloneElement(clearIcon) : clearIcon) || (
<Icon type="close-circle" theme="filled" className={`${prefixCls}-clear-icon`} />
);
const menuItemSelectedIcon = (
const finalMenuItemSelectedIcon = menuItemSelectedIcon && (
React.isValidElement<{ className?: string }>(menuItemSelectedIcon)
? React.cloneElement(menuItemSelectedIcon) : menuItemSelectedIcon) || (
<Icon type="check" className={`${prefixCls}-selected-icon`} />
);
return (
<RcSelect
inputIcon={inputIcon}
removeIcon={removeIcon}
clearIcon={clearIcon}
menuItemSelectedIcon={menuItemSelectedIcon}
removeIcon={finalRemoveIcon}
clearIcon={finalClearIcon}
menuItemSelectedIcon={finalMenuItemSelectedIcon}
{...rest}
{...modeConfig}
prefixCls={prefixCls}