@sfxcode/formkit-primevue 3.2.10 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,7 +2,7 @@
2
2
  import type { FormKitFrameworkContext } from '@formkit/core'
3
3
  import type { AutoCompleteCompleteEvent, AutoCompleteProps } from 'primevue/autocomplete'
4
4
  import type { PropType } from 'vue'
5
- import { ref, watch } from 'vue'
5
+ import { ref } from 'vue'
6
6
  import { useFormKitInput } from '../composables'
7
7
 
8
8
  export interface FormKitPrimeAutoCompleteProps {
@@ -28,34 +28,12 @@ const props = defineProps({
28
28
  },
29
29
  })
30
30
 
31
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
31
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
32
32
 
33
33
  const suggestions = ref(['', {}])
34
34
  suggestions.value = []
35
35
  const loading = ref(false)
36
36
 
37
- // Local value for v-model
38
- const localValue = ref(props.context._value)
39
-
40
- // Sync localValue with context._value
41
- watch(
42
- () => props.context._value,
43
- (newVal) => {
44
- localValue.value = newVal
45
- },
46
- )
47
-
48
- // Emit changes from localValue to context
49
- watch(
50
- localValue,
51
- (newVal) => {
52
- if (newVal !== props.context._value) {
53
- props.context._value = newVal
54
- props.context?.node?.input?.(newVal)
55
- }
56
- },
57
- )
58
-
59
37
  /**
60
38
  * Searches for suggestions based on the input query.
61
39
  */
@@ -102,22 +80,22 @@ function handlePaste(event: ClipboardEvent) {
102
80
  .map(item => item.trim())
103
81
  .filter(item => item.length > 0)
104
82
  // Use a local ref, never mutate context._value directly
105
- if (Array.isArray(localValue.value)) {
106
- localValue.value = [...localValue.value, ...items]
83
+ if (Array.isArray(modelValue.value)) {
84
+ modelValue.value = [...modelValue.value, ...items]
107
85
  }
108
86
  else {
109
- localValue.value = items
87
+ modelValue.value = items
110
88
  }
111
89
  }
112
90
  // If no separators, just set the value directly
113
91
  else if (pastedText) {
114
92
  event.preventDefault()
115
93
  // If no separators, just set the value directly
116
- if (Array.isArray(localValue.value)) {
117
- localValue.value = [...localValue.value, pastedText.trim()]
94
+ if (Array.isArray(modelValue.value)) {
95
+ modelValue.value = [...modelValue.value, pastedText.trim()]
118
96
  }
119
97
  else {
120
- localValue.value = [pastedText.trim()]
98
+ modelValue.value = [pastedText.trim()]
121
99
  }
122
100
  }
123
101
  }
@@ -127,7 +105,7 @@ function handlePaste(event: ClipboardEvent) {
127
105
  <div class="p-formkit">
128
106
  <AutoComplete
129
107
  :id="context.id"
130
- v-model="localValue"
108
+ v-model="modelValue"
131
109
  v-bind="context?.attrs"
132
110
  :disabled="!!context?.disabled"
133
111
  :class="context?.attrs?.class"
@@ -25,14 +25,14 @@ const props = defineProps({
25
25
  },
26
26
  })
27
27
 
28
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
28
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
29
29
  </script>
30
30
 
31
31
  <template>
32
32
  <div class="p-formkit">
33
33
  <CascadeSelect
34
34
  :id="context.id"
35
- v-model="context._value"
35
+ v-model="modelValue"
36
36
  v-bind="context?.attrs"
37
37
  :disabled="!!context?.disabled"
38
38
  :readonly="context?.attrs.readonly ?? false"
@@ -26,7 +26,7 @@ const props = defineProps({
26
26
 
27
27
  const { hasPrefix, hasSuffix, generateId } = useFormKitSection(props.context)
28
28
 
29
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
29
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
30
30
 
31
31
  const generatedId = generateId()
32
32
  </script>
@@ -37,7 +37,7 @@ const generatedId = generateId()
37
37
  {{ context?.prefix }}
38
38
  </label>
39
39
  <Checkbox
40
- v-model="context._value"
40
+ v-model="modelValue"
41
41
  v-bind="context?.attrs"
42
42
  :input-id="generatedId"
43
43
  :disabled="!!context?.disabled"
@@ -21,13 +21,13 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- const { unstyled, handleChange } = useFormKitInput(props.context)
24
+ const { unstyled, handleChange, modelValue } = useFormKitInput(props.context)
25
25
  </script>
26
26
 
27
27
  <template>
28
28
  <div class="p-formkit">
29
29
  <ColorPicker
30
- v-model="context._value"
30
+ v-model="modelValue"
31
31
  v-bind="context?.attrs"
32
32
  :disabled="!!context?.disabled"
33
33
  :readonly="context?.attrs.readonly ?? false"
@@ -60,7 +60,7 @@ const props = defineProps({
60
60
  },
61
61
  })
62
62
 
63
- const { validSlotNames, unstyled, isInvalid, handleInput } = useFormKitInput(props.context)
63
+ const { validSlotNames, unstyled, isInvalid, handleInput, modelValue } = useFormKitInput(props.context)
64
64
 
65
65
  function handleBlur(e: DatePickerBlurEvent) {
66
66
  props.context?.handlers.blur(e.originalEvent as FocusEvent)
@@ -83,7 +83,7 @@ function handleSelect(e: any) {
83
83
  <template>
84
84
  <div class="p-formkit">
85
85
  <DatePicker
86
- v-model="context._value"
86
+ v-model="modelValue"
87
87
  v-bind="context?.attrs"
88
88
  :input-id="context.id"
89
89
  :disabled="!!context?.disabled"
@@ -27,7 +27,7 @@ const props = defineProps({
27
27
  },
28
28
  })
29
29
 
30
- const { unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
30
+ const { unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
31
31
  const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
32
32
  </script>
33
33
 
@@ -37,7 +37,7 @@ const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
37
37
  <InputIcon v-if="hasPrefixIcon" :class="context?.iconPrefix" />
38
38
  <InputMask
39
39
  :id="context.id"
40
- v-model="context._value"
40
+ v-model="modelValue"
41
41
  v-bind="context?.attrs"
42
42
  :disabled="!!context?.disabled"
43
43
  :readonly="context?.attrs.readonly ?? false"
@@ -63,7 +63,7 @@ const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
63
63
  <InputMask
64
64
  v-if="!hasPrefixIcon && !hasSuffixIcon"
65
65
  :id="context.id"
66
- v-model="context._value"
66
+ v-model="modelValue"
67
67
  v-bind="context?.attrs"
68
68
  :disabled="!!context?.disabled"
69
69
  :readonly="context?.attrs.readonly ?? false"
@@ -34,7 +34,7 @@ const props = defineProps({
34
34
  },
35
35
  })
36
36
 
37
- const { validSlotNames, unstyled, isInvalid } = useFormKitInput(props.context)
37
+ const { validSlotNames, unstyled, isInvalid, modelValue } = useFormKitInput(props.context)
38
38
 
39
39
  function handleBlur(e: InputNumberBlurEvent) {
40
40
  props.context?.handlers.blur(e.originalEvent as FocusEvent)
@@ -70,7 +70,7 @@ watch(
70
70
  <template>
71
71
  <div class="p-formkit">
72
72
  <InputNumber
73
- v-model="context._value"
73
+ v-model="modelValue"
74
74
  v-bind="context?.attrs"
75
75
  :input-id="context.id"
76
76
  :disabled="!!context?.disabled"
@@ -23,14 +23,14 @@ const props = defineProps({
23
23
  },
24
24
  })
25
25
 
26
- const { validSlotNames, unstyled, isInvalid, handleBlur, handleInput } = useFormKitInput(props.context)
26
+ const { validSlotNames, unstyled, isInvalid, handleBlur, handleInput, modelValue } = useFormKitInput(props.context)
27
27
  </script>
28
28
 
29
29
  <template>
30
30
  <div class="p-formkit">
31
31
  <InputOtp
32
32
  :id="context.id"
33
- v-model="context._value"
33
+ v-model="modelValue"
34
34
  v-bind="context?.attrs"
35
35
  :disabled="!!context?.disabled"
36
36
  :readonly="context?.attrs.readonly ?? false"
@@ -23,7 +23,7 @@ const props = defineProps({
23
23
  },
24
24
  })
25
25
 
26
- const { unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
26
+ const { unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
27
27
  const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
28
28
  </script>
29
29
 
@@ -33,7 +33,7 @@ const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
33
33
  <InputIcon v-if="hasPrefixIcon" :class="context?.iconPrefix" />
34
34
  <InputText
35
35
  :id="context.id"
36
- v-model="context._value"
36
+ v-model="modelValue"
37
37
  v-bind="context?.attrs"
38
38
  :type="context?.attrs?.inputType ?? 'text'"
39
39
  :disabled="!!context?.disabled"
@@ -57,7 +57,7 @@ const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
57
57
  <InputText
58
58
  v-if="!hasPrefixIcon && !hasSuffixIcon"
59
59
  :id="context.id"
60
- v-model="context._value"
60
+ v-model="modelValue"
61
61
  v-bind="context?.attrs"
62
62
  :type="context?.inputType ?? 'text'"
63
63
  :disabled="!!context?.disabled"
@@ -29,7 +29,7 @@ const props = defineProps({
29
29
  },
30
30
  })
31
31
 
32
- const { unstyled, isInvalid } = useFormKitInput(props.context)
32
+ const { unstyled, isInvalid, modelValue } = useFormKitInput(props.context)
33
33
 
34
34
  function handleInput(e: any) {
35
35
  props.context?.node.input(e)
@@ -45,7 +45,7 @@ function updateValue(n: number) {
45
45
  <div class="p-formkit">
46
46
  <Knob
47
47
  :id="context.id"
48
- v-model="context._value"
48
+ v-model="modelValue"
49
49
  v-bind="context?.attrs"
50
50
  :disabled="!!context?.disabled"
51
51
  :readonly="context?.attrs.readonly ?? false"
@@ -38,14 +38,14 @@ const props = defineProps({
38
38
  },
39
39
  })
40
40
 
41
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
41
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
42
42
  </script>
43
43
 
44
44
  <template>
45
45
  <div class="p-formkit">
46
46
  <Listbox
47
47
  :id="context.id"
48
- v-model="context._value"
48
+ v-model="modelValue"
49
49
  v-bind="context?.attrs"
50
50
  :disabled="!!context?.disabled"
51
51
  :readonly="context?.attrs.readonly ?? false"
@@ -51,13 +51,13 @@ const props = defineProps({
51
51
  },
52
52
  })
53
53
 
54
- const { validSlotNames, unstyled, isInvalid, handleBlur, handleChange } = useFormKitInput(props.context)
54
+ const { validSlotNames, unstyled, isInvalid, handleBlur, handleChange, modelValue } = useFormKitInput(props.context)
55
55
  </script>
56
56
 
57
57
  <template>
58
58
  <div class="p-formkit">
59
59
  <MultiSelect
60
- v-model="context._value"
60
+ v-model="modelValue"
61
61
  v-bind="context?.attrs"
62
62
  :input-id="context.id"
63
63
  :disabled="!!context?.disabled"
@@ -32,35 +32,39 @@ const getListValues = computed(() => {
32
32
  }
33
33
  return values
34
34
  })
35
+
36
+ const dividerClass = computed(() => props.context?.dividerClass || '')
37
+ const itemClass = computed(() => props.context?.itemClass || '')
38
+ const listItemsClass = computed(() => props.context?.attrs?.class || '')
35
39
  </script>
36
40
 
37
41
  <template>
38
42
  <div class="p-formkit p-output-list">
39
43
  <FormKitIcon v-if="hasPrefixIcon" :icon-class="context?.iconPrefix as string" :on-click="context?.onIconPrefixClicked as (() => void)" position="prefix" />
40
44
  <FormKitPrefix v-if="hasPrefix && listStyle === 'span'" :prefix="context?.prefix as string" />
41
- <span v-if="listStyle === 'span'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
45
+ <span v-if="listStyle === 'span'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="listItemsClass">
42
46
  <template v-for="(value, index) of getListValues" :key="index">
43
- <span v-if="index !== 0" class="p-output-list-divider" :class="context?.dividerClass">{{ context?.divider ?? ', ' }}</span>
44
- <span class="p-output-list-item" :class="context?.itemClass">{{ value }}</span>
47
+ <span v-if="index !== 0" class="p-output-list-divider" :class="dividerClass">{{ context?.divider ?? ', ' }}</span>
48
+ <span class="p-output-list-item" :class="itemClass">{{ value }}</span>
45
49
  </template>
46
50
  </span>
47
- <div v-if="listStyle === 'div'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
51
+ <div v-if="listStyle === 'div'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="listItemsClass">
48
52
  <template v-for="(value, index) of getListValues" :key="index">
49
- <div class="p-output-list-item" :class="context?.itemClass">
53
+ <div class="p-output-list-item" :class="itemClass">
50
54
  {{ value }}
51
55
  </div>
52
56
  </template>
53
57
  </div>
54
- <ul v-if="listStyle === 'ul'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
58
+ <ul v-if="listStyle === 'ul'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="listItemsClass">
55
59
  <li v-for="(value, index) of getListValues" :key="index">
56
- <span class="p-output-list-item" :class="context?.itemClass">
60
+ <span class="p-output-list-item" :class="itemClass">
57
61
  {{ value }}
58
62
  </span>
59
63
  </li>
60
64
  </ul>
61
- <ol v-if="listStyle === 'ol'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
65
+ <ol v-if="listStyle === 'ol'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="listItemsClass">
62
66
  <li v-for="(value, index) of getListValues" :key="index">
63
- <span class="p-output-list-item" :class="context?.itemClass">
67
+ <span class="p-output-list-item" :class="itemClass">
64
68
  {{ value }}
65
69
  </span>
66
70
  </li>
@@ -30,13 +30,13 @@ const props = defineProps({
30
30
  },
31
31
  })
32
32
 
33
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
33
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
34
34
  </script>
35
35
 
36
36
  <template>
37
37
  <div class="p-formkit">
38
38
  <Password
39
- v-model="context._value"
39
+ v-model="modelValue"
40
40
  v-bind="context?.attrs"
41
41
  :input-id="context.id"
42
42
  :disabled="!!context?.disabled"
@@ -3,6 +3,7 @@ import type { FormKitFrameworkContext } from '@formkit/core'
3
3
  import type { RadioButtonProps } from 'primevue/radiobutton'
4
4
 
5
5
  import type { PropType } from 'vue'
6
+ import { computed } from 'vue'
6
7
  import { useFormKitInput } from '../composables'
7
8
 
8
9
  export interface FormKitPrimeRadioButtonProps {
@@ -22,15 +23,19 @@ const props = defineProps({
22
23
  },
23
24
  })
24
25
 
25
- const { unstyled, isInvalid, handleChange, handleBlur } = useFormKitInput(props.context)
26
+ const { unstyled, isInvalid, handleChange, handleBlur, modelValue } = useFormKitInput(props.context)
27
+
28
+ const optionsClass = computed(() => props.context?.optionsClass ?? '')
29
+ const optionClass = computed(() => props.context?.optionClass ?? '')
30
+ const labelClass = computed(() => props.context?.labelClass ?? '')
26
31
  </script>
27
32
 
28
33
  <template>
29
- <div class="p-formkit p-formkit-options" :class="context.optionsClass">
30
- <div v-for="option in context.options" :key="option.value" class="p-formkit-option" :class="context.optionClass">
34
+ <div class="p-formkit p-formkit-options" :class="optionsClass">
35
+ <div v-for="option in context.options" :key="option.value" class="p-formkit-option" :class="optionClass">
31
36
  <RadioButton
32
37
  :id="context.id"
33
- v-model="context._value"
38
+ v-model="modelValue"
34
39
  v-bind="context?.attrs"
35
40
  :disabled="!!context?.disabled"
36
41
  :readonly="context?.attrs.readonly ?? false"
@@ -47,7 +52,7 @@ const { unstyled, isInvalid, handleChange, handleBlur } = useFormKitInput(props.
47
52
  @change="handleChange"
48
53
  @blur="handleBlur"
49
54
  />
50
- <label :for="option.value" :class="context.labelClass">{{ option.label }}</label>
55
+ <label :for="option.value" :class="labelClass">{{ option.label }}</label>
51
56
  </div>
52
57
  </div>
53
58
  </template>
@@ -21,14 +21,14 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
24
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
25
25
  </script>
26
26
 
27
27
  <template>
28
28
  <div class="p-formkit">
29
29
  <Rating
30
30
  :id="context.id"
31
- v-model="context._value"
31
+ v-model="modelValue"
32
32
  v-bind="context?.attrs"
33
33
  :disabled="!!context?.disabled"
34
34
  :readonly="context?.attrs.readonly ?? false"
@@ -48,13 +48,13 @@ const props = defineProps({
48
48
  },
49
49
  })
50
50
 
51
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
51
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
52
52
  </script>
53
53
 
54
54
  <template>
55
55
  <div class="p-formkit">
56
56
  <Select
57
- v-model="context._value"
57
+ v-model="modelValue"
58
58
  v-bind="context?.attrs"
59
59
  :input-id="context.id"
60
60
  :disabled="!!context?.disabled"
@@ -26,14 +26,14 @@ const props = defineProps({
26
26
  },
27
27
  })
28
28
 
29
- const { validSlotNames, unstyled, isInvalid, handleChange, handleBlur } = useFormKitInput(props.context)
29
+ const { validSlotNames, unstyled, isInvalid, handleChange, handleBlur, modelValue } = useFormKitInput(props.context)
30
30
  </script>
31
31
 
32
32
  <template>
33
33
  <div class="p-formkit">
34
34
  <SelectButton
35
35
  :id="context.id"
36
- v-model="context._value"
36
+ v-model="modelValue"
37
37
  v-bind="context?.attrs"
38
38
  :disabled="!!context?.disabled"
39
39
  :readonly="context?.attrs.readonly ?? false"
@@ -23,7 +23,7 @@ const props = defineProps({
23
23
  },
24
24
  })
25
25
 
26
- const { unstyled, isInvalid, handleBlur } = useFormKitInput(props.context)
26
+ const { unstyled, isInvalid, handleBlur, modelValue } = useFormKitInput(props.context)
27
27
 
28
28
  function handleInput(e: any) {
29
29
  props.context?.node.input(e)
@@ -35,7 +35,7 @@ function handleInput(e: any) {
35
35
  <div class="p-formkit">
36
36
  <Slider
37
37
  :id="context.id"
38
- v-model="context._value"
38
+ v-model="modelValue"
39
39
  v-bind="context?.attrs"
40
40
  :disabled="!!context?.disabled"
41
41
  :readonly="context?.attrs.readonly ?? false"
@@ -22,14 +22,14 @@ const props = defineProps({
22
22
  },
23
23
  })
24
24
 
25
- const { unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
25
+ const { unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
26
26
  </script>
27
27
 
28
28
  <template>
29
29
  <div class="p-formkit">
30
30
  <Textarea
31
31
  :id="context.id"
32
- v-model="context._value"
32
+ v-model="modelValue"
33
33
  v-bind="context?.attrs"
34
34
  :disabled="!!context?.disabled"
35
35
  :readonly="context?.attrs.readonly ?? false"
@@ -24,13 +24,13 @@ const props = defineProps({
24
24
  },
25
25
  })
26
26
 
27
- const { validSlotNames, unstyled, isInvalid, handleChange, handleBlur } = useFormKitInput(props.context)
27
+ const { validSlotNames, unstyled, isInvalid, handleChange, handleBlur, modelValue } = useFormKitInput(props.context)
28
28
  </script>
29
29
 
30
30
  <template>
31
31
  <div class="p-formkit">
32
32
  <ToggleButton
33
- v-model="context._value"
33
+ v-model="modelValue"
34
34
  v-bind="context?.attrs"
35
35
  :input-id="context.id"
36
36
  :disabled="!!context?.disabled"
@@ -22,7 +22,7 @@ const props = defineProps({
22
22
 
23
23
  const { hasPrefix, hasSuffix } = useFormKitSection(props.context)
24
24
 
25
- const { unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
25
+ const { unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
26
26
  </script>
27
27
 
28
28
  <template>
@@ -31,7 +31,7 @@ const { unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.c
31
31
  {{ context?.prefix }}
32
32
  </span>
33
33
  <ToggleSwitch
34
- v-model="context._value"
34
+ v-model="modelValue"
35
35
  v-bind="context?.attrs"
36
36
  :input-id="context.id"
37
37
  :disabled="!!context?.disabled"
@@ -29,13 +29,13 @@ const props = defineProps({
29
29
  },
30
30
  })
31
31
 
32
- const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur } = useFormKitInput(props.context)
32
+ const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
33
33
  </script>
34
34
 
35
35
  <template>
36
36
  <div class="p-formkit">
37
37
  <TreeSelect
38
- v-model="context._value"
38
+ v-model="modelValue"
39
39
  v-bind="context?.attrs"
40
40
  :input-id="context.id"
41
41
  :disabled="!!context?.disabled"
@@ -7,4 +7,5 @@ export declare function useFormKitInput(context: any): {
7
7
  handleChange: (_: any) => void;
8
8
  handleInput: (_: any) => void;
9
9
  handleSelect: (e: any) => void;
10
+ modelValue: import("vue").WritableComputedRef<any, any>;
10
11
  };
@@ -38,6 +38,12 @@ function useFormKitInput(context) {
38
38
  function handleSelect(e) {
39
39
  context?.node?.input?.(e);
40
40
  }
41
+ const modelValue = (0, _vue.computed)({
42
+ get: () => context._value,
43
+ set: value => {
44
+ context.node.input(value);
45
+ }
46
+ });
41
47
  return {
42
48
  isInvalid,
43
49
  validSlotNames,
@@ -46,6 +52,7 @@ function useFormKitInput(context) {
46
52
  handleBlur,
47
53
  handleChange,
48
54
  handleInput,
49
- handleSelect
55
+ handleSelect,
56
+ modelValue
50
57
  };
51
58
  }
@@ -35,5 +35,11 @@ export function useFormKitInput(context) {
35
35
  function handleSelect(e) {
36
36
  context?.node?.input?.(e);
37
37
  }
38
- return { isInvalid, validSlotNames, styleClass, unstyled, handleBlur, handleChange, handleInput, handleSelect };
38
+ const modelValue = computed({
39
+ get: () => context._value,
40
+ set: (value) => {
41
+ context.node.input(value);
42
+ }
43
+ });
44
+ return { isInvalid, validSlotNames, styleClass, unstyled, handleBlur, handleChange, handleInput, handleSelect, modelValue };
39
45
  }
@@ -13,11 +13,11 @@ function useFormKitRepeater() {
13
13
  } = (0, _useFormKitSchema.useFormKitSchema)();
14
14
  function addInsertButton(label = "Add", innerClass = "", outerClass = "", buttonClass = "p-button-sm", iconClass = "pi pi-plus") {
15
15
  return addElementsInOuterDiv([addComponent("Button", {
16
- onClick: "$addNode($node.parent)",
16
+ onClick: "$addNode($node)",
17
17
  label,
18
18
  class: buttonClass,
19
19
  icon: iconClass
20
- }, "$node.parent.value.length == 0")], innerClass, outerClass);
20
+ }, "$node.children.length == 0")], innerClass, outerClass);
21
21
  }
22
22
  function addListGroupFunctions(data, addNodeDefaultObject = {}) {
23
23
  const swapElements = (array, index1, index2) => {
@@ -3,7 +3,7 @@ export function useFormKitRepeater() {
3
3
  const { addElement, addComponent, addElementsInOuterDiv } = useFormKitSchema();
4
4
  function addInsertButton(label = "Add", innerClass = "", outerClass = "", buttonClass = "p-button-sm", iconClass = "pi pi-plus") {
5
5
  return addElementsInOuterDiv([
6
- addComponent("Button", { onClick: "$addNode($node.parent)", label, class: buttonClass, icon: iconClass }, "$node.parent.value.length == 0")
6
+ addComponent("Button", { onClick: "$addNode($node)", label, class: buttonClass, icon: iconClass }, "$node.children.length == 0")
7
7
  ], innerClass, outerClass);
8
8
  }
9
9
  function addListGroupFunctions(data, addNodeDefaultObject = {}) {
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@sfxcode/formkit-primevue",
3
3
  "type": "module",
4
- "version": "3.2.10",
5
- "packageManager": "pnpm@10.29.2+sha512.bef43fa759d91fd2da4b319a5a0d13ef7a45bb985a3d7342058470f9d2051a3ba8674e629672654686ef9443ad13a82da2beb9eeb3e0221c87b8154fff9d74b8",
4
+ "version": "3.3.0",
5
+ "packageManager": "pnpm@10.30.3+sha512.c961d1e0a2d8e354ecaa5166b822516668b7f44cb5bd95122d590dd81922f606f5473b6d23ec4a5be05e7fcd18e8488d47d978bbe981872f1145d06e9a740017",
6
6
  "author": {
7
7
  "name": "Tom",
8
8
  "email": "tom@sfxcode.com"
@@ -75,7 +75,7 @@
75
75
  "dev": "vite serve dev",
76
76
  "dev:build": "vite build dev",
77
77
  "dev:preview": "vite preview dev",
78
- "release": "npm run lint && npm run build && changelogen --patch --release && npm publish --access public && git push --follow-tags",
78
+ "release": "npm run lint && npm run build && changelogen --minor --release && npm publish --access public && git push --follow-tags",
79
79
  "lint": "eslint .",
80
80
  "lint:fix": "eslint . --fix",
81
81
  "prepublishOnly": "pnpm build",
@@ -101,36 +101,36 @@
101
101
  "vue-i18n": "^11.2.8"
102
102
  },
103
103
  "devDependencies": {
104
- "@antfu/eslint-config": "^7.3.0",
104
+ "@antfu/eslint-config": "^7.6.1",
105
105
  "@formkit/core": "^1.6.9",
106
106
  "@formkit/drag-and-drop": "^0.5.3",
107
107
  "@primeuix/themes": "^2.0.3",
108
- "@types/node": "^25.2.2",
109
- "@unocss/preset-icons": "66.6.0",
110
- "@unocss/preset-uno": "66.6.0",
108
+ "@types/node": "^25.3.2",
109
+ "@unocss/preset-icons": "66.6.2",
110
+ "@unocss/preset-uno": "66.6.2",
111
111
  "@vitejs/plugin-vue": "^6.0.4",
112
112
  "@vitest/coverage-v8": "^4.0.18",
113
113
  "@vitest/ui": "^4.0.18",
114
- "@vue/compiler-sfc": "^3.5.28",
115
- "@vue/server-renderer": "^3.5.28",
114
+ "@vue/compiler-sfc": "^3.5.29",
115
+ "@vue/server-renderer": "^3.5.29",
116
116
  "@vue/test-utils": "^2.4.6",
117
117
  "@vue/tsconfig": "^0.8.1",
118
- "@vueuse/core": "^14.2.0",
118
+ "@vueuse/core": "^14.2.1",
119
119
  "@vueuse/head": "^2.0.0",
120
120
  "changelogen": "^0.6.2",
121
121
  "chart.js": "^4.5.1",
122
122
  "consola": "^3.4.2",
123
123
  "cookie": "^1.1.1",
124
124
  "esbuild": "^0.27.3",
125
- "eslint": "^10.0.0",
126
- "happy-dom": "^20.5.3",
125
+ "eslint": "^10.0.2",
126
+ "happy-dom": "^20.7.0",
127
127
  "json-editor-vue": "^0.18.1",
128
128
  "mkdist": "^2.4.1",
129
129
  "sass": "^1.97.3",
130
130
  "tslib": "^2.8.1",
131
131
  "typescript": "^5.9.3",
132
132
  "unbuild": "^3.6.1",
133
- "unocss": "66.6.0",
133
+ "unocss": "66.6.2",
134
134
  "unplugin-auto-import": "^21.0.0",
135
135
  "unplugin-vue-components": "^31.0.0",
136
136
  "vite": "^7.3.1",
@@ -140,9 +140,9 @@
140
140
  "vite-ssg": "^28.3.0",
141
141
  "vitepress": "2.0.0-alpha.12",
142
142
  "vitest": "^4.0.18",
143
- "vue": "^3.5.28",
143
+ "vue": "^3.5.29",
144
144
  "vue-demi": "^0.14.10",
145
- "vue-router": "^5.0.2",
146
- "vue-tsc": "^3.2.4"
145
+ "vue-router": "^5.0.3",
146
+ "vue-tsc": "^3.2.5"
147
147
  }
148
148
  }