@etsoo/materialui/lib/cjs/JsonDataInput.js

TypeScript Material-UI Implementation

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.JsonDataInput = JsonDataInput;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const InputField_1 = require("./InputField");
const ReactApp_1 = require("./app/ReactApp");
/**
 * JSON data input component
 * @param props - Component properties
 * @returns JSX Element
 */
function JsonDataInput(props) {
    // Destruct
    const { error, helperText, onChange, rows = 3, ...rest } = props;
    // Global app
    const app = (0, ReactApp_1.useRequiredAppContext)();
    const jsonError = app.get("jsonDataError") ?? "JSON format error";
    // Error message
    const [localError, setError] = react_1.default.useState();
    // Layout
    return ((0, jsx_runtime_1.jsx)(InputField_1.InputField, { multiline: true, rows: rows, ...rest, error: localError ? true : error, helperText: localError ?? helperText, onChange: (e) => {
            if (onChange) {
                onChange(e);
                if (e.isDefaultPrevented())
                    return;
            }
            const json = e.target.value;
            if (json) {
                try {
                    JSON.parse(json);
                }
                catch (e) {
                    setError(`${jsonError}: ${e instanceof Error ? e.message : String(e)}`);
                    return;
                }
            }
            setError(undefined);
        } }));
}