test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-03 04:30:06 +08:00
Code Issues Actions 100 Packages Projects Releases Wiki Activity

Refactor: created InputIcon of common code in RangePicker and WeekPicker

Browse Source
This commit is contained in:
saxenanihal95 2019-04-20 23:10:01 +05:30
parent 5987792a44
commit 9fd4b2de63
3 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/date-picker/InputIcon.tsx Normal file
View File

@ -0,0 +1,20 @@
import * as React from 'react';
import Icon from '../icon';
import classNames from 'classnames';
export default function InputIcon(props: { suffixIcon: any; prefixCls: string }) {
const { suffixIcon, prefixCls } = props;
return (
(suffixIcon &&
(React.isValidElement<{ className?: string }>(suffixIcon) ? (
React.cloneElement(suffixIcon, {
className: classNames({
[suffixIcon.props.className!]: suffixIcon.props.className,
[`${prefixCls}-picker-icon`]: true,
}),
})
) : (
<span className={`${prefixCls}-picker-icon`}>{suffixIcon}</span>
))) || <Icon type="calendar" className={`${prefixCls}-picker-icon`} />
);
}

13
components/date-picker/RangePicker.tsx
View File

@ -13,6 +13,7 @@ import warning from '../_util/warning';
import interopDefault from '../_util/interopDefault';
import { RangePickerValue, RangePickerPresetRange } from './interface';
import { formatDate } from './utils';
import InputIcon from './InputIcon';
export interface RangePickerState {
value?: RangePickerValue;
@ -368,17 +369,7 @@ class RangePicker extends React.Component<any, RangePickerState> {
/>
) : null;
const inputIcon = (suffixIcon &&
(React.isValidElement<{ className?: string }>(suffixIcon) ? (
React.cloneElement(suffixIcon, {
className: classNames({
[suffixIcon.props.className!]: suffixIcon.props.className,
[`${prefixCls}-picker-icon`]: true,
}),
})
) : (
<span className={`${prefixCls}-picker-icon`}>{suffixIcon}</span>
))) || <Icon type="calendar" className={`${prefixCls}-picker-icon`} />;
const inputIcon = <InputIcon suffixIcon={suffixIcon} prefixCls={prefixCls} />;
const input = ({ value: inputValue }: { value: any }) => {
const [start, end] = inputValue;

13
components/date-picker/WeekPicker.tsx
View File

@ -7,6 +7,7 @@ import classNames from 'classnames';
import Icon from '../icon';
import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
import interopDefault from '../_util/interopDefault';
import InputIcon from './InputIcon';
function formatValue(value: moment.Moment | null, format: string): string {
return (value && value.format(format)) || '';
@ -180,17 +181,7 @@ class WeekPicker extends React.Component<any, WeekPickerState> {
/>
) : null;
const inputIcon = (suffixIcon &&
(React.isValidElement<{ className?: string }>(suffixIcon) ? (
React.cloneElement(suffixIcon, {
className: classNames({
[suffixIcon.props.className!]: suffixIcon.props.className,
[`${prefixCls}-picker-icon`]: true,
}),
})
) : (
<span className={`${prefixCls}-picker-icon`}>{suffixIcon}</span>
))) || <Icon type="calendar" className={`${prefixCls}-picker-icon`} />;
const inputIcon = <InputIcon suffixIcon={suffixIcon} prefixCls={prefixCls} />;
const input = ({ value }: { value: moment.Moment | undefined }) => (
<span style={{ display: 'inline-block', width: '100%' }}>