@hitachivantara/uikit-react-core/dist/BaseCheckBox/BaseCheckBox.js

UI Kit Core React components.

import { useClasses } from "./BaseCheckBox.styles.js";
import { HvCheckBoxIcon } from "./CheckBoxIcon.js";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { forwardRef, useCallback, useState } from "react";
import { jsx } from "react/jsx-runtime";
import MuiCheckbox from "@mui/material/Checkbox";
//#region src/BaseCheckBox/BaseCheckBox.tsx
/**
* A Checkbox is a mechanism that allows user to select one or more options.
*
* The Base Checkbox is a building block of the Checkbox form element. Don't use unless
* implementing a custom use case not covered by the Checkbox form element.
*/
var HvBaseCheckBox = forwardRef(function HvBaseCheckBox(props, ref) {
	const { classes: classesProp, className, inputProps, onChange, onFocusVisible, onBlur, checked, indeterminate, defaultChecked, value = "on", required = false, readOnly = false, disabled = false, semantic = false, color, style, ...others } = useDefaultProps("HvBaseCheckBox", props);
	const { classes, cx } = useClasses(classesProp);
	const [focusVisible, setFocusVisible] = useState(false);
	const onChangeCallback = useCallback((event) => {
		if (readOnly) return;
		onChange?.(event, event.target.checked, value);
	}, [
		onChange,
		readOnly,
		value
	]);
	const onBlurCallback = useCallback((event) => {
		setFocusVisible(false);
		onBlur?.(event);
	}, [onBlur]);
	const onFocusVisibleCallback = useCallback((event) => {
		setFocusVisible(true);
		onFocusVisible?.(event);
	}, [onFocusVisible]);
	const params = {
		indeterminate,
		disabled,
		semantic,
		color
	};
	return /* @__PURE__ */ jsx(MuiCheckbox, {
		ref,
		value,
		className: cx(classes.root, {
			[classes.focusVisible]: focusVisible,
			[classes.checked]: checked,
			[classes.indeterminate]: indeterminate,
			[classes.semantic]: semantic,
			[classes.disabled]: disabled
		}, className),
		icon: /* @__PURE__ */ jsx(HvCheckBoxIcon, { ...params }),
		indeterminateIcon: /* @__PURE__ */ jsx(HvCheckBoxIcon, {
			variant: "indeterminate",
			...params
		}),
		checkedIcon: /* @__PURE__ */ jsx(HvCheckBoxIcon, {
			variant: "checked",
			...params
		}),
		disabled,
		required,
		readOnly,
		checked,
		defaultChecked,
		indeterminate,
		inputProps,
		onChange: onChangeCallback,
		onFocusVisible: onFocusVisibleCallback,
		onBlur: onBlurCallback,
		color: "default",
		...others
	});
});
//#endregion
export { HvBaseCheckBox };