@koumoul/vjsf 3.0.0-beta.8 → 3.0.0-beta.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koumoul/vjsf",
-  "version": "3.0.0-beta.8",
+  "version": "3.0.0-beta.9",
   "description": "Generate forms for the vuetify UI library (vuejs) based on annotated JSON schemas.",
   "scripts": {
     "test": "vitest",
@@ -75,7 +75,7 @@
     "vuetify": "^3.4.9"
   },
   "dependencies": {
-    "@json-layout/core": "0.13.0",
+    "@json-layout/core": "0.14.0",
     "@vueuse/core": "^10.5.0",
     "debug": "^4.3.4",
     "ejs": "^3.1.9"

package/src/composables/use-vjsf.js

@@ -30,6 +30,8 @@ export const emits = {
  */
 export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compile, precompiledLayout) => {
   const el = ref(null)
+
+  // TODO: apply a debounce to width ?
   const { width } = useElementSize(el)
 
   /** @type import('vue').ShallowRef<import('../types.js').VjsfStatefulLayout | null> */
@@ -74,7 +76,6 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
   const onStatefulLayoutUpdate = () => {
     if (!statefulLayout.value) return
     stateTree.value = statefulLayout.value.stateTree
-    emit('update:modelValue', statefulLayout.value.data)
     emit('update:state', statefulLayout.value)
     if (form) {
       // cf https://vuetifyjs.com/en/components/forms/#validation-state
@@ -84,6 +85,12 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
     }
   }
 
+  const onDataUpdate = () => {
+    if (statefulLayout.value && modelValue !== statefulLayout.value.data) {
+      emit('update:modelValue', statefulLayout.value.data)
+    }
+  }
+
   const initStatefulLayout = () => {
     if (!width.value) return
 
@@ -96,9 +103,13 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
     ))
     statefulLayout.value = _statefulLayout
     onStatefulLayoutUpdate()
+    onDataUpdate()
     _statefulLayout.events.on('update', () => {
       onStatefulLayoutUpdate()
     })
+    _statefulLayout.events.on('data', () => {
+      onDataUpdate()
+    })
     emit('update:state', _statefulLayout)
     _statefulLayout.events.on('autofocus', () => {
       if (!el.value) return

package/types/components/vjsf.vue.d.ts

@@ -1,5 +1,5 @@
 declare const _default: import("vue").DefineComponent<{}, {
-    $emit: ((event: "update:modelValue", data: any) => void) & ((event: "update:state", state: import("../types.js").VjsfStatefulLayout) => void);
+    $emit: ((event: "update:state", state: import("../types.js").VjsfStatefulLayout) => void) & ((event: "update:modelValue", data: any) => void);
     options: Partial<Omit<import("../types.js").VjsfOptions, "width">> | null;
     modelValue: any;
     schema: Record<string, any>;

package/types/composables/use-vjsf.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-vjsf.d.ts","sourceRoot":"","sources":["../../src/composables/use-vjsf.js"],"names":[],"mappings":"AAUA;IACE;;MAEE;gCADO,GAAG;IAGZ;;MAEE;4BADO,OAAO,aAAa,EAAE,kBAAkB;EAGlD;AAWM,gCARI,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,cACzB,OAAO,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,WACtB,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,aAAa,EAAE,kBAAkB,GAAG,IAAI,CAAC,kBAClE,OAAO,MAAM,EAAE,OAAO,KAAK,EAAE,SAAS,CAAC,QACvC,GAAG;;;;EA2Gb"}
+{"version":3,"file":"use-vjsf.d.ts","sourceRoot":"","sources":["../../src/composables/use-vjsf.js"],"names":[],"mappings":"AAUA;IACE;;MAEE;gCADO,GAAG;IAGZ;;MAEE;4BADO,OAAO,aAAa,EAAE,kBAAkB;EAGlD;AAWM,gCARI,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,cACzB,OAAO,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,WACtB,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,aAAa,EAAE,kBAAkB,GAAG,IAAI,CAAC,kBAClE,OAAO,MAAM,EAAE,OAAO,KAAK,EAAE,SAAS,CAAC,QACvC,GAAG;;;;EAsHb"}