@tomino/dynamic-form-semantic-ui
Version:
Semantic UI form renderer based on dynamic form generation
23 lines • 1.74 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const mobx_react_1 = require("mobx-react");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const properties_common_1 = require("./properties_common");
const editor_context_1 = require("../editor/editor_context");
const properties_styles_1 = require("./properties_styles");
const common_1 = require("../common");
exports.Input = mobx_react_1.observer((componentProps) => {
const context = React.useContext(editor_context_1.EditorContext);
const onChange = React.useMemo(() => properties_common_1.onChangeHandler.bind({ props: componentProps, editorState: context }), [componentProps, context]);
const { formElement, readOnly, owner } = componentProps;
const { value, error, props = {} } = properties_common_1.parseProps(componentProps, context, true);
const source = common_1.prop(formElement);
const schema = owner.getSchema(source);
let type = schema.properties && schema.properties.value ? schema.properties.value.type : schema.type;
return (React.createElement("div", { className: "propertyInput" },
React.createElement("input", { type: type === 'number' || type === 'integer' ? 'number' : 'text', name: formElement.uid, className: classnames_1.default(properties_common_1.controlMargin, properties_styles_1.tableRowFlex, { invalid: error }), onChange: onChange, placeholder: props.placeholder, "data-value": value, value: value || '', readOnly: readOnly }),
props && props.inputLabel && React.createElement("div", { className: "propertyLabel" }, props.inputLabel)));
});
//# sourceMappingURL=input.js.map