39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
/**
|
|
* Copyright 2022 Beijing Volcano Engine Technology Co., Ltd. All Rights Reserved.
|
|
* SPDX-license-identifier: BSD-3-Clause
|
|
*/
|
|
import { ReactNode } from 'react';
|
|
import CheckedSVG from '@/assets/img/Checked.svg';
|
|
import styles from './index.module.less';
|
|
|
|
interface IProps {
|
|
className?: string;
|
|
checked: boolean;
|
|
onClick?: () => void;
|
|
icon?: string;
|
|
label?: string | ReactNode;
|
|
description?: string | ReactNode;
|
|
suffix?: string | ReactNode;
|
|
}
|
|
|
|
function CheckBox(props: IProps) {
|
|
const { className = '', icon = '', checked, label, description, suffix, onClick } = props;
|
|
|
|
return (
|
|
<div
|
|
className={`${className} ${styles.wrapper} ${checked ? styles.active : ''}`}
|
|
onClick={onClick}
|
|
>
|
|
{icon ? <img className={styles.icon} src={icon} alt="icon" /> : ''}
|
|
<div className={styles.content}>
|
|
<div className={styles.label}>{label}</div>
|
|
<div className={styles.description}>{description}</div>
|
|
</div>
|
|
{suffix}
|
|
{checked ? <img className={styles.checkIcon} src={CheckedSVG} alt="checked" /> : ''}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default CheckBox;
|