@koumoul/vjsf 3.13.1 → 3.13.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koumoul/vjsf",
-  "version": "3.13.1",
+  "version": "3.13.2",
   "description": "Generate forms for the vuetify UI library (vuejs) based on annotated JSON schemas.",
   "scripts": {
     "test": "vitest run",

package/src/components/nodes/date-time-picker.vue

@@ -10,8 +10,10 @@ import { useDate, useDefaults } from 'vuetify'
 import { computed, ref, watch, toRef } from 'vue'
 import { getDateTimeParts, getDateTimeWithOffset, getShortTime } from '../../utils/dates.js'
 import useNode from '../../composables/use-node.js'
+import useCompDefaults from '../../composables/use-comp-defaults.js'
 
 useDefaults({}, 'VjsfDatePicker')
+const timePickerDefaults = useCompDefaults('VTimePicker')
 
 const props = defineProps({
   modelValue: {
@@ -54,8 +56,8 @@ const datePickerProps = computed(() => {
 })
 
 const timePickerProps = computed(() => {
-  const timePickerProps = { ...compProps.value }
-  timePickerProps['ampm-in-title'] = true
+  const timePickerProps = { ...timePickerDefaults.value, ...compProps.value }
+  if (timePickerProps.format !== '24hr') timePickerProps['ampm-in-title'] = true
   if (localData.value) timePickerProps.modelValue = getShortTime(localData.value.slice(11))
   timePickerProps['onUpdate:modelValue'] = (/** @type {string} */value) => {
     if (!localData.value) return

package/src/components/nodes/list.vue

@@ -111,7 +111,7 @@ const pushEmptyIndexedItem = () => {
   if (!newKey.value) return
   if (!newKeyForm.value) return
   if (!newKeyForm.value.isValid) return
-  const newData = { ...(props.modelValue.data ?? {}), [newKey.value]: null }
+  const newData = { ...(props.modelValue.data ?? {}), [newKey.value]: undefined }
   props.statefulLayout.input(props.modelValue, newData)
   if (layout.value.listEditMode === 'inline-single') {
     props.statefulLayout.activateItem(props.modelValue, Object.keys(newData).length - 1)

package/src/components/nodes/time-picker.vue

@@ -7,8 +7,10 @@ import { useDate, useDefaults } from 'vuetify'
 import { computed, toRef } from 'vue'
 import { getShortTime, getLongTime } from '../../utils/dates.js'
 import useNode from '../../composables/use-node.js'
+import useCompDefaults from '../../composables/use-comp-defaults.js'
 
-useDefaults({}, 'VjsfDatePicker')
+useDefaults({}, 'VjsfTimePicker')
+const timePickerDefaults = useCompDefaults('VTimePicker')
 
 const props = defineProps({
   modelValue: {
@@ -28,8 +30,8 @@ const vDate = useDate()
 const { compProps, localData } = useNode(toRef(props, 'modelValue'), props.statefulLayout)
 
 const timePickerProps = computed(() => {
-  const timePickerProps = { ...compProps.value }
-  timePickerProps['ampm-in-title'] = true
+  const timePickerProps = { ...timePickerDefaults.value, ...compProps.value }
+  if (timePickerProps.format !== '24hr') timePickerProps['ampm-in-title'] = true
   if (localData.value) timePickerProps.modelValue = getShortTime(localData.value)
   return timePickerProps
 })