UNPKG

@teknim/rjsf-mantine

Version:

Mantine theme, fields and widgets for react-jsonschema-form

26 lines 1.5 kB
import { jsx as _jsx } from "react/jsx-runtime"; import { useCallback } from 'react'; import { labelValue, ariaDescribedByIds, } from '@rjsf/utils'; import { Checkbox } from '@mantine/core'; import { cleanupOptions } from '../utils'; export default function CheckboxWidget(props) { const { id, name, value = false, required, disabled, readonly, autofocus, label, hideLabel, rawErrors, options, onChange, onBlur, onFocus, } = props; const themeProps = cleanupOptions(options); const handleCheckboxChange = useCallback((e) => { if (!disabled && !readonly && onChange) { onChange(e.currentTarget.checked); } }, [onChange, disabled, readonly]); const handleBlur = useCallback(({ target }) => { if (onBlur) { onBlur(id, target.checked); } }, [onBlur, id]); const handleFocus = useCallback(({ target }) => { if (onFocus) { onFocus(id, target.checked); } }, [onFocus, id]); return (_jsx(Checkbox, { id: id, name: name, label: labelValue(label || undefined, hideLabel, false), disabled: disabled || readonly, required: required, autoFocus: autofocus, checked: typeof value === 'undefined' ? false : value === 'true' || value, onChange: handleCheckboxChange, onBlur: handleBlur, onFocus: handleFocus, error: rawErrors && rawErrors.length > 0 ? rawErrors.join('\n') : undefined, "aria-describedby": ariaDescribedByIds(id), ...themeProps })); } //# sourceMappingURL=CheckboxWidget.js.map