feat!: svelte-jsoneditor provides parser option, therefore setting non-string value in text mode should no longer be auto stringified via hard coded JSON.stringify

Author: cloydlau

demo/vue3/index.vue

@@ -4,7 +4,7 @@
       <button @click="data.value = '123'">
         设值为 string
       </button>
-      <button @click="data.value = { abc: '123' }">
+      <button @click="data.value = { abc: 124124124124124124124n }">
         设值为 JSON
       </button>
       <button @click="data.value = undefined">
@@ -20,33 +20,45 @@
 
     <br>
     <JsonEditorVue
-      v-model="data.value" v-model:mode="data.mode"
-      :readOnly="data.readOnly"
-      ref="jsonEditorVueRef"
+      ref="jsonEditorVueRef" v-model="data.value" v-model:mode="data.mode"
+      :readOnly="data.readOnly" :parser="data.parser"
     />
 
     <br>
     <p>Mode</p>
     {{ data.mode }}
     <p>Value</p>
-    {{ data.value }}
+    {{ LosslessJSONParser.stringify(data.value) }}
     <p>Type</p>
     {{ typeof data.value }}
   </div>
 </template>
 
 <script setup lang="ts">
+import { parse, stringify } from 'lossless-json'
 import JsonEditorVue from '../../src'
 import type { Mode } from '../../src'
 
+const LosslessJSONParser = {
+  parse, /* : (json) => {    return JSON.parse(json, (k, v, { source }) =>
+      (typeof source === 'number' && source > Number.MAX_SAFE_INTEGER)
+        ? BigInt(source)
+        : source,
+    )
+  } */
+  stringify,
+}
+
 const data = reactive<{
   value: any
   mode?: Mode
   readOnly?: boolean
+  parser?: { parse: Function; stringify: Function }
 }>({
   value: undefined,
   mode: undefined,
   readOnly: false,
+  parser: LosslessJSONParser,
 })
 
 const jsonEditorVueRef = ref()

package.json

@@ -75,6 +75,7 @@
     "husky": "latest",
     "json-editor-vue": "latest",
     "lint-staged": "latest",
+    "lossless-json": "latest",
     "typescript": "latest",
     "unplugin-auto-import": "latest",
     "vanilla-jsoneditor": "latest",

pnpm-lock.yaml

@@ -70,7 +70,9 @@ export default defineComponent({
           return
         }
         preventUpdate.value = true
-        emit(updateModelValue, updatedContent.text === undefined ? updatedContent.json : updatedContent.text)
+        emit(updateModelValue, updatedContent.text === undefined
+          ? updatedContent.json
+          : updatedContent.text)
       }, 100),
       onChangeMode(mode: Mode) {
         emit('update:mode', mode)
@@ -104,9 +106,7 @@ export default defineComponent({
         : {
           // Text mode take strings only
           // @ts-expect-error: props.mode can't be a boolean
-            [modeToContentKey(props.mode)]: (typeof n !== 'string' && props.mode === 'text')
-              ? JSON.stringify(n)
-              : n,
+            [modeToContentKey(props.mode)]: n,
           })
     }, {
       deep: true,