@payloadcms/ui 3.71.0-canary.2 → 3.71.0-internal-debug.dea9d74

package/dist/fields/JSON/index.js

@@ -1,6 +1,5 @@
 'use client';
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { v4 as uuidv4 } from 'uuid';
 import { defaultOptions } from '../../elements/CodeEditor/constants.js';
@@ -15,149 +14,192 @@ import { mergeFieldStyles } from '../mergeFieldStyles.js';
 import { fieldBaseClass } from '../shared/index.js';
 import './index.scss';
 const baseClass = 'json-field';
-const JSONFieldComponent = props => {
-  const {
-    field,
-    field: {
-      admin: {
-        className,
-        description,
-        editorOptions,
-        maxHeight
-      } = {},
-      jsonSchema,
-      label,
-      localized,
-      required
-    },
-    path: pathFromProps,
-    readOnly,
-    validate
-  } = props;
-  const {
-    insertSpaces = defaultOptions.insertSpaces,
-    tabSize = defaultOptions.tabSize
-  } = editorOptions || {};
-  const formatJSON = useCallback(value => {
-    if (value === undefined) {
-      return undefined;
-    }
-    if (value === null) {
-      return '';
-    }
-    return insertSpaces ? JSON.stringify(value, null, tabSize) : JSON.stringify(value, null, '\t');
-  }, [tabSize, insertSpaces]);
-  const [jsonError, setJsonError] = useState();
-  const inputChangeFromRef = React.useRef('formState');
-  const [recalculatedHeightAt, setRecalculatedHeightAt] = useState(Date.now());
-  const memoizedValidate = useCallback((value_0, options) => {
-    if (typeof validate === 'function') {
-      return validate(value_0, {
-        ...options,
-        jsonError,
-        required
-      });
-    }
-  }, [validate, required, jsonError]);
-  const {
-    customComponents: {
-      AfterInput,
-      BeforeInput,
-      Description,
-      Error,
-      Label
-    } = {},
-    disabled,
-    initialValue,
-    path,
-    setValue,
-    showError,
-    value: value_1
-  } = useField({
-    potentiallyStalePath: pathFromProps,
-    validate: memoizedValidate
-  });
-  const stringValueRef = React.useRef(formatJSON(value_1 ?? initialValue));
-  const handleMount = useCallback((editor, monaco) => {
-    if (!jsonSchema) {
-      return;
-    }
-    monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
-      enableSchemaRequest: true,
-      schemas: [...(monaco.languages.json.jsonDefaults.diagnosticsOptions.schemas || []), jsonSchema],
-      validate: true
+const JSONFieldComponent = (props)=>{
+    const { field, field: { admin: { className, description, editorOptions, maxHeight } = {}, jsonSchema, label, localized, required }, path: pathFromProps, readOnly, validate } = props;
+    const { insertSpaces = defaultOptions.insertSpaces, tabSize = defaultOptions.tabSize } = editorOptions || {};
+    const formatJSON = useCallback((value)=>{
+        if (value === undefined) {
+            return undefined;
+        }
+        if (value === null) {
+            return '';
+        }
+        return insertSpaces ? JSON.stringify(value, null, tabSize) : JSON.stringify(value, null, '\t');
+    }, [
+        tabSize,
+        insertSpaces
+    ]);
+    const [jsonError, setJsonError] = useState();
+    const inputChangeFromRef = React.useRef('formState');
+    const [recalculatedHeightAt, setRecalculatedHeightAt] = useState(Date.now());
+    const memoizedValidate = useCallback((value, options)=>{
+        if (typeof validate === 'function') {
+            return validate(value, {
+                ...options,
+                jsonError,
+                required
+            });
+        }
+    }, [
+        validate,
+        required,
+        jsonError
+    ]);
+    const { customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {}, disabled, initialValue, path, setValue, showError, value } = useField({
+        potentiallyStalePath: pathFromProps,
+        validate: memoizedValidate
     });
-    const uri = jsonSchema.uri;
-    const newUri = uri.includes('?') ? `${uri}&${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}` : `${uri}?${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`;
-    editor.setModel(monaco.editor.createModel(formatJSON(value_1) || '', 'json', monaco.Uri.parse(newUri)));
-  }, [jsonSchema, formatJSON, value_1]);
-  const handleChange = useCallback(val => {
-    if (readOnly || disabled) {
-      return;
-    }
-    inputChangeFromRef.current = 'internalEditor';
-    try {
-      setValue(val ? JSON.parse(val) : null);
-      stringValueRef.current = val;
-      setJsonError(undefined);
-    } catch (e) {
-      setValue(val ? val : null);
-      stringValueRef.current = val;
-      setJsonError(e);
-    }
-  }, [readOnly, disabled, setValue]);
-  useEffect(() => {
-    if (inputChangeFromRef.current === 'formState') {
-      const newStringValue = formatJSON(value_1 ?? initialValue);
-      if (newStringValue !== stringValueRef.current) {
-        stringValueRef.current = newStringValue;
-        setRecalculatedHeightAt(Date.now());
-      }
-    }
-    inputChangeFromRef.current = 'formState';
-  }, [initialValue, path, formatJSON, value_1]);
-  const styles = useMemo(() => mergeFieldStyles(field), [field]);
-  return /*#__PURE__*/_jsxs("div", {
-    className: [fieldBaseClass, baseClass, className, showError && 'error', (readOnly || disabled) && 'read-only'].filter(Boolean).join(' '),
-    style: styles,
-    children: [/*#__PURE__*/_jsx(RenderCustomComponent, {
-      CustomComponent: Label,
-      Fallback: /*#__PURE__*/_jsx(FieldLabel, {
-        label: label,
-        localized: localized,
-        path: path,
-        required: required
-      })
-    }), /*#__PURE__*/_jsxs("div", {
-      className: `${fieldBaseClass}__wrap`,
-      children: [/*#__PURE__*/_jsx(RenderCustomComponent, {
-        CustomComponent: Error,
-        Fallback: /*#__PURE__*/_jsx(FieldError, {
-          message: jsonError,
-          path: path,
-          showError: showError
-        })
-      }), BeforeInput, /*#__PURE__*/_jsx(CodeEditor, {
-        defaultLanguage: "json",
-        maxHeight: maxHeight,
-        onChange: handleChange,
-        onMount: handleMount,
-        options: editorOptions,
-        readOnly: readOnly || disabled,
-        recalculatedHeightAt: recalculatedHeightAt,
-        value: stringValueRef.current,
-        wrapperProps: {
-          id: `field-${path?.replace(/\./g, '__')}`
+    const stringValueRef = React.useRef(formatJSON(value ?? initialValue));
+    const handleMount = useCallback((editor, monaco)=>{
+        if (!jsonSchema) {
+            return;
         }
-      }), AfterInput]
-    }), /*#__PURE__*/_jsx(RenderCustomComponent, {
-      CustomComponent: Description,
-      Fallback: /*#__PURE__*/_jsx(FieldDescription, {
-        description: description,
-        path: path
-      })
-    })]
-  });
+        monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
+            enableSchemaRequest: true,
+            schemas: [
+                ...monaco.languages.json.jsonDefaults.diagnosticsOptions.schemas || [],
+                jsonSchema
+            ],
+            validate: true
+        });
+        const uri = jsonSchema.uri;
+        const newUri = uri.includes('?') ? `${uri}&${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}` : `${uri}?${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`;
+        editor.setModel(monaco.editor.createModel(formatJSON(value) || '', 'json', monaco.Uri.parse(newUri)));
+    }, [
+        jsonSchema,
+        formatJSON,
+        value
+    ]);
+    const handleChange = useCallback((val)=>{
+        if (readOnly || disabled) {
+            return;
+        }
+        inputChangeFromRef.current = 'internalEditor';
+        try {
+            setValue(val ? JSON.parse(val) : null);
+            stringValueRef.current = val;
+            setJsonError(undefined);
+        } catch (e) {
+            setValue(val ? val : null);
+            stringValueRef.current = val;
+            setJsonError(e);
+        }
+    }, [
+        readOnly,
+        disabled,
+        setValue
+    ]);
+    useEffect(()=>{
+        if (inputChangeFromRef.current === 'formState') {
+            const newStringValue = formatJSON(value ?? initialValue);
+            if (newStringValue !== stringValueRef.current) {
+                stringValueRef.current = newStringValue;
+                setRecalculatedHeightAt(Date.now());
+            }
+        }
+        inputChangeFromRef.current = 'formState';
+    }, [
+        initialValue,
+        path,
+        formatJSON,
+        value
+    ]);
+    const styles = useMemo(()=>mergeFieldStyles(field), [
+        field
+    ]);
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            fieldBaseClass,
+            baseClass,
+            className,
+            showError && 'error',
+            (readOnly || disabled) && 'read-only'
+        ].filter(Boolean).join(' '),
+        style: styles,
+        children: [
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Label,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldLabel, {
+                    label: label,
+                    localized: localized,
+                    path: path,
+                    required: required
+                }, void 0, false, {
+                    fileName: "src/fields/JSON/index.tsx",
+                    lineNumber: 158,
+                    columnNumber: 11
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/fields/JSON/index.tsx",
+                lineNumber: 155,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: `${fieldBaseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Error,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldError, {
+                            message: jsonError,
+                            path: path,
+                            showError: showError
+                        }, void 0, false, {
+                            fileName: "src/fields/JSON/index.tsx",
+                            lineNumber: 164,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/fields/JSON/index.tsx",
+                        lineNumber: 162,
+                        columnNumber: 9
+                    }, this),
+                    BeforeInput,
+                    /*#__PURE__*/ _jsxDEV(CodeEditor, {
+                        defaultLanguage: "json",
+                        maxHeight: maxHeight,
+                        onChange: handleChange,
+                        onMount: handleMount,
+                        options: editorOptions,
+                        readOnly: readOnly || disabled,
+                        recalculatedHeightAt: recalculatedHeightAt,
+                        value: stringValueRef.current,
+                        wrapperProps: {
+                            id: `field-${path?.replace(/\./g, '__')}`
+                        }
+                    }, void 0, false, {
+                        fileName: "src/fields/JSON/index.tsx",
+                        lineNumber: 167,
+                        columnNumber: 9
+                    }, this),
+                    AfterInput
+                ]
+            }, void 0, true, {
+                fileName: "src/fields/JSON/index.tsx",
+                lineNumber: 161,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Description,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldDescription, {
+                    description: description,
+                    path: path
+                }, void 0, false, {
+                    fileName: "src/fields/JSON/index.tsx",
+                    lineNumber: 184,
+                    columnNumber: 19
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/fields/JSON/index.tsx",
+                lineNumber: 182,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/JSON/index.tsx",
+        lineNumber: 143,
+        columnNumber: 5
+    }, this);
 };
 export const JSONField = withCondition(JSONFieldComponent);
+
 //# sourceMappingURL=index.js.map

package/dist/fields/JSON/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useMemo","useState","v4","uuidv4","defaultOptions","CodeEditor","RenderCustomComponent","useField","withCondition","FieldDescription","FieldError","FieldLabel","mergeFieldStyles","fieldBaseClass","baseClass","JSONFieldComponent","props","field","admin","className","description","editorOptions","maxHeight","jsonSchema","label","localized","required","path","pathFromProps","readOnly","validate","insertSpaces","tabSize","formatJSON","value","undefined","JSON","stringify","jsonError","setJsonError","inputChangeFromRef","useRef","recalculatedHeightAt","setRecalculatedHeightAt","Date","now","memoizedValidate","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","initialValue","setValue","showError","potentiallyStalePath","stringValueRef","handleMount","editor","monaco","languages","json","jsonDefaults","setDiagnosticsOptions","enableSchemaRequest","schemas","diagnosticsOptions","uri","newUri","includes","crypto","randomUUID","setModel","createModel","Uri","parse","handleChange","val","current","e","newStringValue","styles","_jsxs","filter","Boolean","join","style","_jsx","CustomComponent","Fallback","message","defaultLanguage","onChange","onMount","wrapperProps","id","replace","JSONField"],"sources":["../../../src/fields/JSON/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, JsonObject } from 'payload'\n\nimport { type OnMount } from '@monaco-editor/react'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { v4 as uuidv4 } from 'uuid'\n\nimport { defaultOptions } from '../../elements/CodeEditor/constants.js'\nimport { CodeEditor } from '../../elements/CodeEditor/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldError } from '../FieldError/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nconst baseClass = 'json-field'\n\nconst JSONFieldComponent: JSONFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { className, description, editorOptions, maxHeight } = {},\n      jsonSchema,\n      label,\n      localized,\n      required,\n    },\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const { insertSpaces = defaultOptions.insertSpaces, tabSize = defaultOptions.tabSize } =\n    editorOptions || {}\n\n  const formatJSON = useCallback(\n    (value: JsonObject | undefined): string | undefined => {\n      if (value === undefined) {\n        return undefined\n      }\n      if (value === null) {\n        return ''\n      }\n      return insertSpaces ? JSON.stringify(value, null, tabSize) : JSON.stringify(value, null, '\\t')\n    },\n    [tabSize, insertSpaces],\n  )\n\n  const [jsonError, setJsonError] = useState<string>()\n  const inputChangeFromRef = React.useRef<'formState' | 'internalEditor'>('formState')\n  const [recalculatedHeightAt, setRecalculatedHeightAt] = useState<number | undefined>(Date.now())\n\n  const memoizedValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, jsonError, required })\n      }\n    },\n    [validate, required, jsonError],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    initialValue,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<JsonObject>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const stringValueRef = React.useRef<string>(formatJSON(value ?? initialValue))\n\n  const handleMount = useCallback<OnMount>(\n    (editor, monaco) => {\n      if (!jsonSchema) {\n        return\n      }\n\n      monaco.languages.json.jsonDefaults.setDiagnosticsOptions({\n        enableSchemaRequest: true,\n        schemas: [\n          ...(monaco.languages.json.jsonDefaults.diagnosticsOptions.schemas || []),\n          jsonSchema,\n        ],\n        validate: true,\n      })\n\n      const uri = jsonSchema.uri\n      const newUri = uri.includes('?')\n        ? `${uri}&${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`\n        : `${uri}?${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`\n\n      editor.setModel(\n        monaco.editor.createModel(formatJSON(value) || '', 'json', monaco.Uri.parse(newUri)),\n      )\n    },\n    [jsonSchema, formatJSON, value],\n  )\n\n  const handleChange = useCallback(\n    (val: string) => {\n      if (readOnly || disabled) {\n        return\n      }\n      inputChangeFromRef.current = 'internalEditor'\n\n      try {\n        setValue(val ? JSON.parse(val) : null)\n        stringValueRef.current = val\n        setJsonError(undefined)\n      } catch (e) {\n        setValue(val ? val : null)\n        stringValueRef.current = val\n        setJsonError(e)\n      }\n    },\n    [readOnly, disabled, setValue],\n  )\n\n  useEffect(() => {\n    if (inputChangeFromRef.current === 'formState') {\n      const newStringValue = formatJSON(value ?? initialValue)\n      if (newStringValue !== stringValueRef.current) {\n        stringValueRef.current = newStringValue\n        setRecalculatedHeightAt(Date.now())\n      }\n    }\n\n    inputChangeFromRef.current = 'formState'\n  }, [initialValue, path, formatJSON, value])\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        baseClass,\n        className,\n        showError && 'error',\n        (readOnly || disabled) && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={styles}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError message={jsonError} path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        <CodeEditor\n          defaultLanguage=\"json\"\n          maxHeight={maxHeight}\n          onChange={handleChange}\n          onMount={handleMount}\n          options={editorOptions}\n          readOnly={readOnly || disabled}\n          recalculatedHeightAt={recalculatedHeightAt}\n          value={stringValueRef.current}\n          wrapperProps={{\n            id: `field-${path?.replace(/\\./g, '__')}`,\n          }}\n        />\n        {AfterInput}\n      </div>\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={<FieldDescription description={description} path={path} />}\n      />\n    </div>\n  )\n}\n\nexport const JSONField = withCondition(JSONFieldComponent)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"sources":["../../../src/fields/JSON/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, JsonObject } from 'payload'\n\nimport { type OnMount } from '@monaco-editor/react'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { v4 as uuidv4 } from 'uuid'\n\nimport { defaultOptions } from '../../elements/CodeEditor/constants.js'\nimport { CodeEditor } from '../../elements/CodeEditor/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldError } from '../FieldError/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nconst baseClass = 'json-field'\n\nconst JSONFieldComponent: JSONFieldClientComponent = (props) => {\n  const {\n    field,\n    field: {\n      admin: { className, description, editorOptions, maxHeight } = {},\n      jsonSchema,\n      label,\n      localized,\n      required,\n    },\n    path: pathFromProps,\n    readOnly,\n    validate,\n  } = props\n\n  const { insertSpaces = defaultOptions.insertSpaces, tabSize = defaultOptions.tabSize } =\n    editorOptions || {}\n\n  const formatJSON = useCallback(\n    (value: JsonObject | undefined): string | undefined => {\n      if (value === undefined) {\n        return undefined\n      }\n      if (value === null) {\n        return ''\n      }\n      return insertSpaces ? JSON.stringify(value, null, tabSize) : JSON.stringify(value, null, '\\t')\n    },\n    [tabSize, insertSpaces],\n  )\n\n  const [jsonError, setJsonError] = useState<string>()\n  const inputChangeFromRef = React.useRef<'formState' | 'internalEditor'>('formState')\n  const [recalculatedHeightAt, setRecalculatedHeightAt] = useState<number | undefined>(Date.now())\n\n  const memoizedValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, jsonError, required })\n      }\n    },\n    [validate, required, jsonError],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled,\n    initialValue,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<JsonObject>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const stringValueRef = React.useRef<string>(formatJSON(value ?? initialValue))\n\n  const handleMount = useCallback<OnMount>(\n    (editor, monaco) => {\n      if (!jsonSchema) {\n        return\n      }\n\n      monaco.languages.json.jsonDefaults.setDiagnosticsOptions({\n        enableSchemaRequest: true,\n        schemas: [\n          ...(monaco.languages.json.jsonDefaults.diagnosticsOptions.schemas || []),\n          jsonSchema,\n        ],\n        validate: true,\n      })\n\n      const uri = jsonSchema.uri\n      const newUri = uri.includes('?')\n        ? `${uri}&${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`\n        : `${uri}?${crypto.randomUUID ? crypto.randomUUID() : uuidv4()}`\n\n      editor.setModel(\n        monaco.editor.createModel(formatJSON(value) || '', 'json', monaco.Uri.parse(newUri)),\n      )\n    },\n    [jsonSchema, formatJSON, value],\n  )\n\n  const handleChange = useCallback(\n    (val: string) => {\n      if (readOnly || disabled) {\n        return\n      }\n      inputChangeFromRef.current = 'internalEditor'\n\n      try {\n        setValue(val ? JSON.parse(val) : null)\n        stringValueRef.current = val\n        setJsonError(undefined)\n      } catch (e) {\n        setValue(val ? val : null)\n        stringValueRef.current = val\n        setJsonError(e)\n      }\n    },\n    [readOnly, disabled, setValue],\n  )\n\n  useEffect(() => {\n    if (inputChangeFromRef.current === 'formState') {\n      const newStringValue = formatJSON(value ?? initialValue)\n      if (newStringValue !== stringValueRef.current) {\n        stringValueRef.current = newStringValue\n        setRecalculatedHeightAt(Date.now())\n      }\n    }\n\n    inputChangeFromRef.current = 'formState'\n  }, [initialValue, path, formatJSON, value])\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        baseClass,\n        className,\n        showError && 'error',\n        (readOnly || disabled) && 'read-only',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={styles}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError message={jsonError} path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        <CodeEditor\n          defaultLanguage=\"json\"\n          maxHeight={maxHeight}\n          onChange={handleChange}\n          onMount={handleMount}\n          options={editorOptions}\n          readOnly={readOnly || disabled}\n          recalculatedHeightAt={recalculatedHeightAt}\n          value={stringValueRef.current}\n          wrapperProps={{\n            id: `field-${path?.replace(/\\./g, '__')}`,\n          }}\n        />\n        {AfterInput}\n      </div>\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={<FieldDescription description={description} path={path} />}\n      />\n    </div>\n  )\n}\n\nexport const JSONField = withCondition(JSONFieldComponent)\n"],"names":["React","useCallback","useEffect","useMemo","useState","v4","uuidv4","defaultOptions","CodeEditor","RenderCustomComponent","useField","withCondition","FieldDescription","FieldError","FieldLabel","mergeFieldStyles","fieldBaseClass","baseClass","JSONFieldComponent","props","field","admin","className","description","editorOptions","maxHeight","jsonSchema","label","localized","required","path","pathFromProps","readOnly","validate","insertSpaces","tabSize","formatJSON","value","undefined","JSON","stringify","jsonError","setJsonError","inputChangeFromRef","useRef","recalculatedHeightAt","setRecalculatedHeightAt","Date","now","memoizedValidate","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","initialValue","setValue","showError","potentiallyStalePath","stringValueRef","handleMount","editor","monaco","languages","json","jsonDefaults","setDiagnosticsOptions","enableSchemaRequest","schemas","diagnosticsOptions","uri","newUri","includes","crypto","randomUUID","setModel","createModel","Uri","parse","handleChange","val","current","e","newStringValue","styles","div","filter","Boolean","join","style","CustomComponent","Fallback","message","defaultLanguage","onChange","onMount","wrapperProps","id","replace","JSONField"],"mappings":"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"}