# elementor/3.8.0-beta1/app/assets/js/ui/atoms/checkbox.js

Elementor Website Builder – more than just a page builder, version 3.8.0-beta1. 50 lines.

- Page: https://pluginprobe.com/plugins/elementor/3.8.0-beta1/code/app/assets/js/ui/atoms/checkbox.js
- Raw: https://pluginprobe.com/plugins/elementor/3.8.0-beta1/raw/app/assets/js/ui/atoms/checkbox.js
- Modified: 2022-09-19T16:26:20+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/elementor/3.8.0-beta1/code/app/assets/js/ui/atoms/checkbox.js#L10-L20`.

```javascript
import { arrayToClassName } from 'elementor-app/utils/utils.js';

import './checkbox.scss';

export default function Checkbox( { className, checked, rounded, indeterminate, error, disabled, onChange } ) {
	const baseClassName = 'eps-checkbox',
		classes = [ baseClassName, className ];

	if ( rounded ) {
		classes.push( baseClassName + '--rounded' );
	}

	if ( indeterminate ) {
		classes.push( baseClassName + '--indeterminate' );
	}

	if ( error ) {
		classes.push( baseClassName + '--error' );
	}

	return (
		<input
			className={ arrayToClassName( classes ) }
			type="checkbox"
			checked={ checked }
			disabled={ disabled }
			onChange={ onChange }
		/>
	);
}

Checkbox.propTypes = {
	className: PropTypes.string,
	checked: PropTypes.bool,
	disabled: PropTypes.bool,
	indeterminate: PropTypes.bool,
	rounded: PropTypes.bool,
	error: PropTypes.bool,
	onChange: PropTypes.func,
};

Checkbox.defaultProps = {
	className: '',
	checked: null,
	disabled: false,
	indeterminate: false,
	error: false,
	onChange: () => {},
};

```