@koumoul/vjsf 4.2.0 → 4.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koumoul/vjsf",
-  "version": "4.2.0",
+  "version": "4.3.1",
   "description": "Generate forms for the vuetify UI library (vuejs) based on annotated JSON schemas.",
   "scripts": {
     "test-tz1": "TZ=Europe/Paris vitest run",
@@ -78,8 +78,8 @@
     "vuetify": "^4.0.0"
   },
   "dependencies": {
-    "@json-layout/core": "~2.6.0",
-    "@json-layout/vocabulary": "~2.12.0",
+    "@json-layout/core": "~2.7.0",
+    "@json-layout/vocabulary": "~2.13.0",
     "@vueuse/core": "^12.5.0",
     "debug": "^4.3.4"
   },

package/src/components/nodes/list.vue

@@ -106,6 +106,14 @@ const buttonDensity = computed(() => {
   return options.value.density
 })
 
+const menuActions = computed(() => {
+  return layout.value.listActions.filter(a => {
+    if (a === 'add' || a === 'paste') return false
+    if (a === 'edit' && layout.value.listEditMode === 'inline') return false
+    return true
+  })
+})
+
 const itemTitles = computed(() => {
   const expr = props.modelValue.layout.itemTitle
   if (!expr) return null
@@ -276,7 +284,7 @@ const toggleDialog = (/** @type {boolean} */value) => {
             />
           </v-row>
           <template
-            v-if="!modelValue.options.readOnly && modelValue.layout.listActions.length"
+            v-if="!modelValue.options.readOnly && menuActions.length"
             #append
           >
             <div class="vjsf-list-item-actions-wrapper">
@@ -316,7 +324,7 @@ const toggleDialog = (/** @type {boolean} */value) => {
                 />
               </v-list-item-action>
               <v-list-item-action
-                v-else-if="(editedItem === undefined || modelValue.layout.listEditMode === 'menu') && modelValue.layout.listActions.length"
+                v-else-if="(editedItem === undefined || modelValue.layout.listEditMode === 'menu') && menuActions.length"
               >
                 <v-menu
                   location="bottom end"

package/src/components/nodes/one-of-select.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { VRow, VCol } from 'vuetify/components/VGrid'
 import { VSelect } from 'vuetify/components/VSelect'
+import { VAutocomplete } from 'vuetify/components/VAutocomplete'
 import { ref, watch, computed, toRef } from 'vue'
 import { isSection } from '@json-layout/core/state'
 import { isCompObject, isOneOfItemHeader, isOneOfItemChild } from '@json-layout/vocabulary'
@@ -32,6 +33,7 @@ const { inputProps, localData, skeleton, children } = useNode(
   toRef(props, 'modelValue'), props.statefulLayout, { bindData: false }
 )
 const zIndex = useZIndexStack(props.modelValue.fullKey)
+const isAutocomplete = computed(() => !!props.modelValue.layout.autocomplete)
 
 /** @type import('vue').Ref<string | undefined> */
 const activeChildTree = ref(undefined)
@@ -45,9 +47,10 @@ watch(() => children.value?.[0]?.key, () => {
   }
 }, { immediate: true })
 
-const onChange = (/** @type {string} */childTree) => {
+const onChange = (/** @type {string | null} */childTree) => {
   if (!skeleton.value.childrenTrees) return
-  props.statefulLayout.activateItem(props.modelValue, skeleton.value.childrenTrees.indexOf(childTree))
+  const index = childTree == null ? -1 : skeleton.value.childrenTrees.indexOf(childTree)
+  props.statefulLayout.activateItem(props.modelValue, index)
 }
 
 const fieldProps = computed(() => {
@@ -83,7 +86,8 @@ const fieldProps = computed(() => {
       v-if="modelValue.skeleton.childrenTrees"
       cols="12"
     >
-      <v-select
+      <component
+        :is="isAutocomplete ? VAutocomplete : VSelect"
         v-bind="fieldProps"
         :model-value="activeChildTree"
       >
@@ -112,7 +116,7 @@ const fieldProps = computed(() => {
             </template>
           </v-list-item>
         </template>
-      </v-select>
+      </component>
     </v-col>
     <template v-if="modelValue.children?.[0]">
       <node

package/src/composables/use-dnd.js

@@ -34,15 +34,22 @@ export default function useDnd (array, callback) {
       hovered.value = -1
     },
 
-    // drag the item
-    onDragstart: () => {
+    // drag the item — only when the user activated drag through the handle (handleBind sets draggable)
+    onDragstart: (/** @type {DragEvent} */e) => {
+      if (draggable.value !== itemIndex) {
+        // a child element (text, link, image, etc.) started a native drag; cancel it
+        e.preventDefault()
+        return
+      }
       dragging.value = itemIndex
     },
     onDragover: () => {
+      if (dragging.value === -1) return
       sortableArray.value = moveArrayItem(sortableArray.value, dragging.value, itemIndex)
       dragging.value = itemIndex
     },
     onDragend: () => {
+      if (dragging.value === -1) return
       hovered.value = itemIndex
       dragging.value = -1
       callback()

package/src/composables/use-vjsf.js

@@ -67,6 +67,7 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
   // cf https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/composables/form.ts
   /** @type {any | null} */
   const form = inject(Symbol.for('vuetify:form'), null)
+  const parentVjsf = inject(Symbol.for('vjsf:form'), false)
   const formMemberId = `vjsf-${Math.random().toString(36).substring(2, 9)}`
   if (form) {
     form.register({
@@ -79,7 +80,7 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
       resetValidation: () => statefulLayout.value?.resetValidation(),
       vm: getCurrentInstance()
     })
-  } else {
+  } else if (!parentVjsf) {
     console.warn('Vjsf should be wrapped in VForm')
   }
 
@@ -88,6 +89,7 @@ export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compi
   // registers as a single form member above. Without this, each VInput registers
   // separately, causing VForm to cascade updates to all N fields on every keystroke.
   provide(Symbol.for('vuetify:form'), null)
+  provide(Symbol.for('vjsf:form'), true)
 
   const slots = useSlots()
 

package/types/components/nodes/list.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/list.vue"],"names":[],"mappings":"wBAomEqB,OAAO,YAAY;;AAdxC;;QAGI,0EAA0E;cAAhE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,YAAY,CAAC;;;;QAKvE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;QAL7E,0EAA0E;cAAhE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,YAAY,CAAC;;;;QAKvE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;6IAK9E"}
+{"version":3,"file":"list.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/list.vue"],"names":[],"mappings":"wBAqnEqB,OAAO,YAAY;;AAdxC;;QAGI,0EAA0E;cAAhE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,YAAY,CAAC;;;;QAKvE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;QAL7E,0EAA0E;cAAhE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,YAAY,CAAC;;;;QAKvE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;6IAK9E"}

package/types/components/nodes/one-of-select.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"one-of-select.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/one-of-select.vue"],"names":[],"mappings":"wBA2XqB,OAAO,YAAY;;AAdxC;;QAGI,iFAAiF;cAAvE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,mBAAmB,CAAC;;;;QAK9E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;QAL7E,iFAAiF;cAAvE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,mBAAmB,CAAC;;;;QAK9E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;6IAK9E"}
+{"version":3,"file":"one-of-select.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/one-of-select.vue"],"names":[],"mappings":"wBAkYqB,OAAO,YAAY;;AAdxC;;QAGI,iFAAiF;cAAvE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,mBAAmB,CAAC;;;;QAK9E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;QAL7E,iFAAiF;cAAvE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,mBAAmB,CAAC;;;;QAK9E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;6IAK9E"}

package/types/composables/use-dnd.d.ts

@@ -13,7 +13,7 @@ export default function useDnd<T>(array: T[], callback: () => void): {
     itemBind: (itemIndex: number, defaultItemProps: Record<string, any>) => {
         onMouseenter: () => void;
         onMouseleave: () => void;
-        onDragstart: () => void;
+        onDragstart: (e: DragEvent) => void;
         onDragover: () => void;
         onDragend: () => void;
     };

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

@@ -1 +1 @@
-{"version":3,"file":"use-dnd.d.ts","sourceRoot":"","sources":["../../src/composables/use-dnd.js"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,+BALa,CAAC,SACH,CAAC,EAAE,YACH,MAAM,IAAI;;;;;;0BAoBU,MAAM,oBAA0B,MAAM,SAAS,GAAG,CAAC;;;;;;;4BAyBjD,MAAM;;;;EAmBtC"}
+{"version":3,"file":"use-dnd.d.ts","sourceRoot":"","sources":["../../src/composables/use-dnd.js"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,+BALa,CAAC,SACH,CAAC,EAAE,YACH,MAAM,IAAI;;;;;;0BAoBU,MAAM,oBAA0B,MAAM,SAAS,GAAG,CAAC;;;yBAWrD,SAAS;;;;4BAqBL,MAAM;;;;EAmBtC"}

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":"AAcA;IACE;;MAEE;gCADO,GAAG;IAGZ;;MAEE;4BADO,OAAO,aAAa,EAAE,kBAAkB;EAGlD;AAiBM,gCAdI,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,MAAM,CAAC,MAAM,EAAE,OAAO,KAAK,EAAE,SAAS,CAAC,QACvC,GAAG,YACH,cAAc,2BAA2B,EAAE,OAAO,0BAClD,cAAc,2BAA2B,EAAE,qBAAqB,sBAChE,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,mBAAmB,EAAE,cAAc,CAAC,GAC3D;IACV,EAAE,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5B,cAAc,EAAE,OAAO,KAAK,EAAE,UAAU,CAAC,OAAO,aAAa,EAAE,kBAAkB,GAAG,IAAI,CAAC,CAAC;IAC1F,SAAS,EAAE,OAAO,KAAK,EAAE,UAAU,CAAC,OAAO,mBAAmB,EAAE,SAAS,GAAG,IAAI,CAAC,CAAA;CAChF,CAuKH"}
+{"version":3,"file":"use-vjsf.d.ts","sourceRoot":"","sources":["../../src/composables/use-vjsf.js"],"names":[],"mappings":"AAcA;IACE;;MAEE;gCADO,GAAG;IAGZ;;MAEE;4BADO,OAAO,aAAa,EAAE,kBAAkB;EAGlD;AAiBM,gCAdI,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,MAAM,CAAC,MAAM,EAAE,OAAO,KAAK,EAAE,SAAS,CAAC,QACvC,GAAG,YACH,cAAc,2BAA2B,EAAE,OAAO,0BAClD,cAAc,2BAA2B,EAAE,qBAAqB,sBAChE,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,mBAAmB,EAAE,cAAc,CAAC,GAC3D;IACV,EAAE,EAAE,OAAO,KAAK,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5B,cAAc,EAAE,OAAO,KAAK,EAAE,UAAU,CAAC,OAAO,aAAa,EAAE,kBAAkB,GAAG,IAAI,CAAC,CAAC;IAC1F,SAAS,EAAE,OAAO,KAAK,EAAE,UAAU,CAAC,OAAO,mBAAmB,EAAE,SAAS,GAAG,IAAI,CAAC,CAAA;CAChF,CAyKH"}