checks 添加 labelClassName

This commit is contained in:
liaoxuezhi 2019-09-19 13:15:40 +08:00
parent 5d299a9af4
commit e9c0883d31
6 changed files with 23 additions and 7 deletions

View File

@ -219,6 +219,7 @@
&-desc {
color: $text--muted-color;
margin-left: $Checkbox-gap;
margin-top: $gap-xs;
}
}

View File

@ -23,6 +23,7 @@ interface CheckboxProps {
type?: string;
size?: 'sm' | 'lg' | 'small' | 'large';
label?: string;
labelClassName?: string;
className?: string;
onChange?: (value: any) => void;
value?: any;
@ -75,7 +76,8 @@ export class Checkbox extends React.Component<CheckboxProps, any> {
checked,
type,
name,
data
data,
labelClassName
} = this.props;
className = (className ? className : '') + (size && sizeMap[size] ? ` ${sizeMap[size]}` : '');
@ -105,7 +107,7 @@ export class Checkbox extends React.Component<CheckboxProps, any> {
name={name}
/>
<i />
<span>{children || label}</span>
<span className={cx(labelClassName)}>{children || label}</span>
{description ? (<div className={cx("Checkbox-desc")}>{filter(description, data)}</div>) : null}
</label>
);

View File

@ -111,8 +111,10 @@ interface CheckboxesProps extends OptionProps {
inline?: boolean;
columnsCount?: number;
checked?: boolean;
labelClassName?: string;
classPrefix: string;
classnames: ClassNamesFn;
}
export class Checkboxes extends React.PureComponent<CheckboxesProps, any> {
@ -173,7 +175,8 @@ export class Checkboxes extends React.PureComponent<CheckboxesProps, any> {
placeholder,
columnsCount,
disabled,
inline
inline,
labelClassName
} = this.props;
let valueArray = value2array(value, {
@ -192,6 +195,7 @@ export class Checkboxes extends React.PureComponent<CheckboxesProps, any> {
checked={!!~valueArray.indexOf(option)}
disabled={disabled || option.disabled}
inline={inline}
labelClassName={labelClassName}
>
{option.label}
</Checkbox>

View File

@ -31,6 +31,7 @@ interface RadioProps extends OptionProps {
onChange?: Function;
columnsCount: number;
itemClassName?: string;
labelClassName?: string;
classPrefix: string;
classnames: ClassNamesFn;
}
@ -83,7 +84,7 @@ export class Radios extends React.Component<RadioProps, any> {
return this.renderGroup(option, index, valueArray);
}
const {disabled, inline, itemClassName, classnames: cx} = this.props;
const {disabled, inline, itemClassName, classnames: cx, labelClassName} = this.props;
return (
<Checkbox
@ -95,6 +96,7 @@ export class Radios extends React.Component<RadioProps, any> {
disabled={disabled || option.disabled}
description={option.description}
inline={inline}
labelClassName={labelClassName}
>
{option.label}
</Checkbox>

View File

@ -9,6 +9,7 @@ export interface CheckboxesProps extends OptionsControlProps {
disabled?: boolean;
itemClassName?: string;
columnsCount?: number;
labelClassName?: string;
}
export default class CheckboxesControl extends React.Component<CheckboxesProps, any> {
@ -48,7 +49,7 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
return this.renderGroup(option, index);
}
const {itemClassName, onToggle, selectedOptions, disabled, inline} = this.props;
const {itemClassName, onToggle, selectedOptions, disabled, inline, labelClassName} = this.props;
return (
<Checkbox
@ -58,6 +59,7 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
checked={!!~selectedOptions.indexOf(option)}
disabled={disabled || option.disabled}
inline={inline}
labelClassName={labelClassName}
>
{option.label}
</Checkbox>
@ -77,7 +79,8 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
onToggleAll,
checkAll,
classnames: cx,
itemClassName
itemClassName,
labelClassName
} = this.props;
let body: Array<React.ReactNode> = [];
@ -96,6 +99,7 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
partial={!!(selectedOptions.length && selectedOptions.length !== options.length)}
disabled={disabled}
inline={inline}
labelClassName={labelClassName}
>
/
</Checkbox>

View File

@ -9,6 +9,7 @@ import {dataMapping} from '../../utils/tpl-builtin';
export interface RadiosProps extends OptionsControlProps {
placeholder?: any;
columnsCount?: number;
labelClassName?: string;
}
export default class RadiosControl extends React.Component<RadiosProps, any> {
@ -51,7 +52,8 @@ export default class RadiosControl extends React.Component<RadiosProps, any> {
formMode,
columnsCount,
classPrefix,
itemClassName
itemClassName,
labelClassName
} = this.props;
return (
@ -64,6 +66,7 @@ export default class RadiosControl extends React.Component<RadiosProps, any> {
joinValues={joinValues}
extractValue={extractValue}
delimiter={delimiter}
labelClassName={labelClassName}
placeholder={placeholder}
options={options}
columnsCount={columnsCount}