devexpress-reporting-react
Version:
DevExpress Reporting React provides the capability to develop a reporting application to create and customize reports.
22 lines (21 loc) • 1.22 kB
JavaScript
import React from 'react';
import { TextBox } from 'devextreme-react/text-box';
import Validator from 'devextreme-react/validator';
import { useEditorOptions, useValidatorOptions } from '../editorHooks';
const TextBoxEditor = ({ data }) => {
const textBoxRef = React.useRef();
const args = {
getEditorOptions: () => ({
value: data.value,
disabled: data.disabled,
inputAttr: {
'aria-label': data.displayName,
'id': data.editorInputId
}
})
};
const options = useEditorOptions(textBoxRef, data, args);
const validatorOptions = useValidatorOptions(data);
return (React.createElement(TextBox, { ref: textBoxRef, value: options.value, disabled: options.disabled, inputAttr: options.inputAttr, onValueChanged: options.onValueChanged, onFocusIn: options.onFocusIn && options.onFocusIn, onKeyDown: options.onKeyDown && options.onKeyDown, onPaste: options.onPaste && options.onPaste, placeholder: options.placeholder, showClearButton: options.showClearButton }, data.validationRules && React.createElement(Validator, { validationRules: validatorOptions.validationRules })));
};
export default TextBoxEditor;