UNPKG

@rjsf/antd

Version:

Ant Design theme, fields and widgets for react-jsonschema-form

26 lines 2.23 kB
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; import { Checkbox } from 'antd'; import { ariaDescribedByIds, enumOptionsIndexForValue, enumOptionsValueForIndex, optionId, } from '@rjsf/utils'; /** The `CheckboxesWidget` is a widget for rendering checkbox groups. * It is typically used to represent an array of enums. * * @param props - The `WidgetProps` for this component */ export default function CheckboxesWidget({ autofocus, disabled, formContext, id, onBlur, onChange, onFocus, options, readonly, value }) { const { readonlyAsDisabled = true } = formContext; const { enumOptions, enumDisabled, inline, emptyValue } = options; const handleChange = (nextValue) => onChange(enumOptionsValueForIndex(nextValue, enumOptions, emptyValue)); const handleBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex(target.value, enumOptions, emptyValue)); const handleFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex(target.value, enumOptions, emptyValue)); // Antd's typescript definitions do not contain the following props that are actually necessary and, if provided, // they are used, so hacking them in via by spreading `extraProps` on the component to avoid typescript errors const extraProps = { id, onBlur: !readonly ? handleBlur : undefined, onFocus: !readonly ? handleFocus : undefined, }; const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, true); return Array.isArray(enumOptions) && enumOptions.length > 0 ? (_jsx(_Fragment, { children: _jsx(Checkbox.Group, { disabled: disabled || (readonlyAsDisabled && readonly), name: id, onChange: !readonly ? handleChange : undefined, value: selectedIndexes, ...extraProps, "aria-describedby": ariaDescribedByIds(id), children: Array.isArray(enumOptions) && enumOptions.map((option, i) => (_jsxs("span", { children: [_jsx(Checkbox, { id: optionId(id, i), name: id, autoFocus: i === 0 ? autofocus : false, disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1, value: String(i), children: option.label }), !inline && _jsx("br", {})] }, i))) }) })) : null; } //# sourceMappingURL=index.js.map