'use strict';

var React = require('react');
var classnames = require('classnames');
var Icon = require('./Icon-cjs.js');
var Text = require('./Text-cjs.js');
var filterDataAttributes = require('./filterDataAttributes-cjs.js');

var styles = {"checkBoxParent":"YxKKPXAU10s-","wrapper":"KxWx-msbH9c-","disabled":"TKr3J-6ARFo-","checkHolder":"NO34ZbhNqhI-","input":"XnCmS-EzK2M-","checkBox":"_-8JCQE6SA9s-","indeterminate":"rqHq3ff9In0-","invalid":"Gqnclw4WaeQ-","label":"l8z5TxzVvqA-","description":"DcBfVgpiWa4-","spinning":"rFBN9M5-4Ok-"};

const Checkbox = React.forwardRef(function CheckboxInternal(props, ref) {
    const { checked, defaultChecked, disabled, label, name, value, indeterminate = false, description, id, onBlur, onChange, onFocus, onClick, onMouseDown, onMouseUp, onPointerDown, onPointerUp, invalid, } = props;
    const descriptionIdentifier = React.useId();
    const descriptionVisible = Boolean(description);
    const wrapperClassName = classnames(styles.wrapper, disabled && styles.disabled, invalid && styles.invalid);
    const isInvalid = Boolean(invalid);
    const inputClassName = classnames(styles.input, {
        [styles.indeterminate]: indeterminate,
    });
    const dataAttrs = filterDataAttributes.filterDataAttributes(props);
    const iconName = indeterminate ? "minus2" : "checkmark";
    const labelContent = typeof label === "string" ? React.createElement(Text.Text, null, label) : label;
    const descriptionContent = typeof description === "string" ? (React.createElement(Text.Text, { size: "small", variation: "subdued" }, description)) : (description);
    function handleChange(event) {
        const newChecked = event.currentTarget.checked;
        onChange === null || onChange === void 0 ? void 0 : onChange(newChecked, event);
    }
    return (React.createElement("div", { className: styles.checkBoxParent },
        React.createElement("label", { className: wrapperClassName },
            React.createElement("span", { className: styles.checkHolder },
                React.createElement("input", Object.assign({ ref: ref, type: "checkbox", id: id, className: inputClassName, name: name, "aria-label": props["aria-label"], "aria-describedby": descriptionVisible
                        ? descriptionIdentifier
                        : props["aria-describedby"], "aria-invalid": isInvalid ? true : undefined, "aria-required": props["aria-required"], checked: checked, value: value, defaultChecked: defaultChecked, disabled: disabled, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onClick: onClick, onMouseDown: onMouseDown, onMouseUp: onMouseUp, onPointerDown: onPointerDown, onPointerUp: onPointerUp }, dataAttrs)),
                React.createElement("span", { className: styles.checkBox },
                    React.createElement(Icon.Icon, { name: iconName, color: "surface" }))),
            labelContent && React.createElement("span", { className: styles.label }, labelContent)),
        description && (React.createElement("div", { id: descriptionIdentifier, className: styles.description }, descriptionContent))));
});
Checkbox.displayName = "Checkbox";

exports.Checkbox = Checkbox;
