export default function Toggle( { checked, onChange, accent = '#7f54b3', label } ) {
	return (
		<button
			type="button"
			role="switch"
			aria-checked={ !! checked }
			aria-label={ label }
			className="edfw-toggle"
			style={ { background: checked ? accent : '#c3c4c7' } }
			onClick={ () => onChange( ! checked ) }
		>
			<span
				className="edfw-toggle__knob"
				style={ { transform: checked ? 'translateX(20px)' : 'translateX(0)' } }
			/>
		</button>
	);
}
