@dartech/arsenal-ui 1.4.20 → 1.4.21

package/index.js

@@ -1066,9 +1066,10 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
       fontSize = 16,
       validate = true,
       parseValue,
-      requiredErrorText = ''
+      requiredErrorText = '',
+      useCleanValue
     } = _a,
-    otherProps = __rest(_a, ["control", "name", "mode", "label", "width", "height", "readOnly", "required", "validateJson", "hideErrorMessage", "fontSize", "validate", "parseValue", "requiredErrorText"]);
+    otherProps = __rest(_a, ["control", "name", "mode", "label", "width", "height", "readOnly", "required", "validateJson", "hideErrorMessage", "fontSize", "validate", "parseValue", "requiredErrorText", "useCleanValue"]);
   const _b = useController({
       control,
       name,
@@ -1106,6 +1107,16 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
     javascript: [langs.javascript()],
     python: [langs.python()]
   }), []);
+  const safeValue = useMemo(() => {
+    if (mode === 'json' && typeof value !== 'string') {
+      if (value === null) return '';
+      return useCleanValue ? JSON.stringify(value, null, 2).replace(/\\"/g, '') : JSON.stringify(value, null, 2);
+    }
+    if (typeof value === 'string') {
+      return useCleanValue ? value.replace(/\\"/g, '') : value;
+    }
+    return value;
+  }, [value, useCleanValue, mode]);
   const handleChange = useCallback(value => {
     if (parseValue) {
       try {
@@ -1157,7 +1168,7 @@ const ControlAceEditor = /*#__PURE__*/forwardRef((_a, ref) => {
           isolation: 'isolate'
         },
         readOnly: readOnly,
-        value: mode === 'json' && typeof value !== 'string' ? value === null ? '' : JSON.stringify(value, null, 2) : value,
+        value: safeValue,
         onChange: handleChange,
         extensions: extensions[mode]
       }, otherProps)), error && !hideErrorMessage && jsx(FormHelperText, Object.assign({
@@ -6035,7 +6046,8 @@ const PropertyFiller = ({
       control: control,
       label: valueLabel,
       parseValue: true,
-      hideErrorMessage: true
+      hideErrorMessage: true,
+      useCleanValue: true
     }) : jsx(ControlInput, {
       control: control,
       name: name,
@@ -6294,7 +6306,8 @@ const MultiplePropertyFiller = ({
       control: control,
       label: valueLabel,
       parseValue: true,
-      hideErrorMessage: true
+      hideErrorMessage: true,
+      useCleanValue: true
     }) : jsx(ControlInput, {
       required: true,
       hideErrorMessage: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.4.20",
+  "version": "1.4.21",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/lib/Forms/ControlAceEditor.d.ts

@@ -17,6 +17,7 @@ export interface ControlAceEditorProps {
     parseValue?: boolean;
     requiredErrorText?: string;
     [key: string]: unknown;
+    useCleanValue?: boolean;
 }
 export declare const ControlAceEditor: import("react").ForwardRefExoticComponent<Omit<ControlAceEditorProps, "ref"> & import("react").RefAttributes<ReactCodeMirrorRef>>;
 export default ControlAceEditor;