@datalayer/primer-rjsf/lib/primer/CheckboxWidget/CheckboxWidget.js

React JSON Schema Form (RJSF) for Primer

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Checkbox, FormControl } from "@primer/react";
import { ariaDescribedByIds, schemaRequiresTrueValue, } from "@rjsf/utils";
/** The `CheckBoxWidget` is a widget for rendering boolean properties.
 *  It is typically used to represent a boolean.
 *
 * @param props - The `WidgetProps` for this component
 */
export default function CheckboxWidget(props) {
    const { schema, id, value, disabled, readonly, label, autofocus, onChange, onBlur, onFocus, } = props;
    // Because an unchecked checkbox will cause html5 validation to fail, only add
    // the "required" attribute if the field value must be "true", due to the
    // "const" or "enum" keywords
    const required = schemaRequiresTrueValue(schema);
    const _onChange = ({ target: { checked } }) => onChange(checked);
    const _onBlur = ({ target: { value } }) => onBlur(id, value);
    const _onFocus = ({ target: { value }, }) => onFocus(id, value);
    return (_jsxs(FormControl, { id: id, children: [_jsx(Checkbox, { checked: typeof value === "undefined" ? false : Boolean(value), required: required, disabled: disabled || readonly, autoFocus: autofocus, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id) }), _jsx(FormControl.Label, { children: label || "" })] }));
}