wp-optimize / vendor / team-updraft / lib-onboarding-wizard / Wizard / Onboarding / src / components / Fields / CheckboxInput.tsx

CheckboxInput.tsx in WP-Optimize – Cache, Compress images, Minify & Clean database to boost page speed & performance 4.6.1, at vendor/team-updraft/lib-onboarding-wizard/Wizard/Onboarding/src/components/Fields/CheckboxInput.tsx

47 lines 1.2 KB

Raw Download Zip

1	import {memo} from "@wordpress/element";
2	import Icon from "../../utils/Icon";
3	import * as Checkbox from '@radix-ui/react-checkbox';
4
5	interface CheckboxInputProps {
6	label: string;
7	value: boolean;
8	id: string;
9	onChange: (value: boolean) => void;
10	required?: boolean;
11	disabled?: boolean;
12	}
13
14	const CheckboxInput = ({
15	label,
16	value,
17	id,
18	onChange,
19	disabled,
20	}:CheckboxInputProps) => {
21	return (
22	<Checkbox.Root
23	className={`flex-shrink-0 ${disabled ? "opacity-50 pointer-events-none" : ""}`}
24	id={id}
25	checked={!!value}
26	aria-label={label}
27	disabled={disabled}
28	onCheckedChange={onChange}
29	>
30	{!value && <Icon
31	name="checkbox-rounded-outline"
32	fill="#B7BABD"
33	size={25}
34	strokeWidth={3}
35	/>}
36	<Checkbox.Indicator className="flex items-center justify-center">
37	<Icon
38	name="checkbox-rounded"
39	size={25}
40	strokeWidth={3}
41	/>
42	</Checkbox.Indicator>
43	</Checkbox.Root>
44	);
45	};
46
47	export default memo(CheckboxInput);