@tomino/dynamic-form-semantic-ui/dist/mjs/properties/tuple.js

Semantic UI form renderer based on dynamic form generation

import * as React from 'react';
import { observer } from 'mobx-react';
import names from 'classnames';
import { parseProps, onChangeHandler, controlMargin } from './properties_common';
import { Input } from 'semantic-ui-react';
import { EditorContext } from '../editor/editor_context';
export const Tuple = observer((componentProps) => {
    const context = React.useContext(EditorContext);
    const onChange = React.useMemo(() => onChangeHandler.bind({ props: componentProps, editorState: context }), [componentProps, context]);
    const { formElement, readOnly } = componentProps;
    const { value, error, props } = parseProps(componentProps, context);
    return (React.createElement("div", null, props.items.map((item, i) => (React.createElement(Input, { key: i, type: item.type || 'text', label: item.label, labelPosition: "right", name: formElement.uid, className: names(controlMargin, { invalid: error }), onChange: onChange, "data-value": value, value: value || '', readOnly: readOnly })))));
});
Tuple.displayName = 'Tuple';
//# sourceMappingURL=tuple.js.map