You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

84 lines
2.3 KiB

import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import RcCheckbox from 'rc-checkbox';
import shallowEqual from 'shallowequal';
import CheckboxGroup from './Group';
export interface AbstractCheckboxProps {
prefixCls?: string;
className?: string;
defaultChecked?: boolean;
checked?: boolean;
style?: React.CSSProperties;
disabled?: boolean;
onChange?: React.FormEventHandler<any>;
onMouseEnter?: React.MouseEventHandler<any>;
onMouseLeave?: React.MouseEventHandler<any>;
value?: any;
}
export interface CheckboxProps extends AbstractCheckboxProps {
indeterminate?: boolean;
}
export default class Checkbox extends React.Component<CheckboxProps, any> {
static Group: typeof CheckboxGroup;
static defaultProps = {
prefixCls: 'ant-checkbox',
indeterminate: false,
};
static contextTypes = {
checkboxGroup: PropTypes.any,
};
shouldComponentUpdate(nextProps, nextState, nextContext) {
return !shallowEqual(this.props, nextProps) ||
!shallowEqual(this.state, nextState) ||
!shallowEqual(this.context.checkboxGroup, nextContext.checkboxGroup);
}
render() {
const { props, context } = this;
const {
prefixCls,
className,
children,
indeterminate,
style,
onMouseEnter,
onMouseLeave,
...restProps,
} = props;
const { checkboxGroup } = context;
let checkboxProps: CheckboxProps = { ...restProps };
if (checkboxGroup) {
checkboxProps.onChange = () => checkboxGroup.toggleOption({ label: children, value: props.value });
checkboxProps.checked = checkboxGroup.value.indexOf(props.value) !== -1;
checkboxProps.disabled = 'disabled' in props ? props.disabled : checkboxGroup.disabled;
}
const classString = classNames(className, {
[`${prefixCls}-wrapper`]: true,
});
const checkboxClass = classNames({
[`${prefixCls}-indeterminate`]: indeterminate,
});
return (
<label
className={classString}
style={style}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
>
<RcCheckbox
{...checkboxProps}
prefixCls={prefixCls}
className={checkboxClass}
/>
{children !== undefined ? <span>{children}</span> : null}
</label>
);
}
}