@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
55 lines (54 loc) • 2.21 kB
JavaScript
"use client";
require("../../_virtual/_rolldown/runtime.cjs");
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
const require_factory = require("../../core/factory/factory.cjs");
const require_InputBase = require("../InputBase/InputBase.cjs");
const require_Textarea = require("../Textarea/Textarea.cjs");
const require_validate_json = require("./validate-json/validate-json.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/JsonInput/JsonInput.tsx
const defaultProps = {
serialize: JSON.stringify,
deserialize: JSON.parse,
size: "sm",
indentSpaces: 2
};
const JsonInput = require_factory.factory((props) => {
const { value, defaultValue, onChange, formatOnBlur, validationError, serialize, deserialize, onFocus, onBlur, readOnly, error, indentSpaces, ...others } = require_use_props.useProps("JsonInput", defaultProps, props);
const [_value, setValue] = (0, _mantine_hooks.useUncontrolled)({
value,
defaultValue,
finalValue: "",
onChange
});
const [valid, setValid] = (0, react.useState)(require_validate_json.validateJson(_value, deserialize));
const handleFocus = (event) => {
onFocus?.(event);
setValid(true);
};
const handleBlur = (event) => {
onBlur?.(event);
const isValid = require_validate_json.validateJson(event.currentTarget.value, deserialize);
formatOnBlur && !readOnly && isValid && event.currentTarget.value.trim() !== "" && setValue(serialize(deserialize(event.currentTarget.value), null, indentSpaces));
setValid(isValid);
};
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Textarea.Textarea, {
value: _value,
onChange: (event) => setValue(event.currentTarget.value),
onFocus: handleFocus,
onBlur: handleBlur,
readOnly,
...others,
autoComplete: "off",
__staticSelector: "JsonInput",
error: valid ? error : validationError || true,
"data-monospace": true
});
});
JsonInput.classes = require_InputBase.InputBase.classes;
JsonInput.displayName = "@mantine/core/JsonInput";
//#endregion
exports.JsonInput = JsonInput;
//# sourceMappingURL=JsonInput.cjs.map