openreplay/frontend/app/components/ui/Toggler/Toggler.js
2024-03-26 12:59:49 +01:00

31 lines
696 B
JavaScript

import React from 'react';
import styles from './toggler.module.css';
export default ({
onChange,
name,
className = '',
checked,
label = '',
plain = false,
}) => (
<div className={className + ' w-fit'}>
<label className={styles.label}>
<div className={plain ? styles.switchPlain : styles.switch}>
<input
type={styles.checkbox}
onClick={onChange}
name={name}
defaultChecked={checked}
/>
<span
className={`${plain ? styles.sliderPlain : styles.slider} ${
checked ? styles.checked : ''
}`}
/>
</div>
{label && <span>{label}</span>}
</label>
</div>
);