@rjsf/antd
Version:
Ant Design theme, fields and widgets for react-jsonschema-form
30 lines • 2.73 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Input, InputNumber } from 'antd';
import { ariaDescribedByIds, examplesId, getInputProps, } from '@rjsf/utils';
const INPUT_STYLE = {
width: '100%',
};
/** The `BaseInputTemplate` is the template to use to render the basic `<input>` component for the `core` theme.
* It is used as the template for rendering many of the <input> based widgets that differ by `type` and callbacks only.
* It can be customized/overridden for other themes or individual implementations as needed.
*
* @param props - The `WidgetProps` for this template
*/
export default function BaseInputTemplate(props) {
const { disabled, formContext, id, onBlur, onChange, onChangeOverride, onFocus, options, placeholder, readonly, schema, value, type, } = props;
const inputProps = getInputProps(schema, type, options, false);
const { readonlyAsDisabled = true } = formContext;
const handleNumberChange = (nextValue) => onChange(nextValue);
const handleTextChange = onChangeOverride
? onChangeOverride
: ({ target }) => onChange(target.value === '' ? options.emptyValue : target.value);
const handleBlur = ({ target }) => onBlur(id, target && target.value);
const handleFocus = ({ target }) => onFocus(id, target && target.value);
const input = inputProps.type === 'number' || inputProps.type === 'integer' ? (_jsx(InputNumber, { disabled: disabled || (readonlyAsDisabled && readonly), id: id, name: id, onBlur: !readonly ? handleBlur : undefined, onChange: !readonly ? handleNumberChange : undefined, onFocus: !readonly ? handleFocus : undefined, placeholder: placeholder, style: INPUT_STYLE, list: schema.examples ? examplesId(id) : undefined, ...inputProps, value: value, "aria-describedby": ariaDescribedByIds(id, !!schema.examples) })) : (_jsx(Input, { disabled: disabled || (readonlyAsDisabled && readonly), id: id, name: id, onBlur: !readonly ? handleBlur : undefined, onChange: !readonly ? handleTextChange : undefined, onFocus: !readonly ? handleFocus : undefined, placeholder: placeholder, style: INPUT_STYLE, list: schema.examples ? examplesId(id) : undefined, ...inputProps, value: value, "aria-describedby": ariaDescribedByIds(id, !!schema.examples) }));
return (_jsxs(_Fragment, { children: [input, Array.isArray(schema.examples) && (_jsx("datalist", { id: examplesId(id), children: schema.examples
.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : [])
.map((example) => {
return _jsx("option", { value: example }, example);
}) }))] }));
}
//# sourceMappingURL=index.js.map