@sfxcode/nuxt-ui-formkit 1.2.4 → 1.2.5

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=4.0.0"
   },
-  "version": "1.2.4",
+  "version": "1.2.5",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/FUAutoForm.d.vue.ts

@@ -1,4 +1,3 @@
-import type { FormKitSchemaDefinition } from '@formkit/core';
 import type { PropType } from 'vue';
 import type { AutoFormOverrides, ValibotLikeSchema, ZodLikeSchema } from '../composables/useFormKitAutoForm.js';
 declare var __VLS_10: string, __VLS_11: any;
@@ -7,7 +6,7 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     overrides: {
@@ -23,13 +22,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     overrides: {
@@ -45,12 +44,12 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     overrides: AutoFormOverrides;
     valibotSchema: ValibotLikeSchema;
     zodSchema: ZodLikeSchema;

package/dist/runtime/components/FUAutoForm.vue

@@ -21,7 +21,7 @@ const props = defineProps({
     default: void 0
   }
 });
-const formData = defineModel({ type: [Object, String, Array] });
+const formData = defineModel({ type: Object });
 if (!formData.value && props.data) {
   formData.value = props.data;
 }

package/dist/runtime/components/FUAutoForm.vue.d.ts

@@ -1,4 +1,3 @@
-import type { FormKitSchemaDefinition } from '@formkit/core';
 import type { PropType } from 'vue';
 import type { AutoFormOverrides, ValibotLikeSchema, ZodLikeSchema } from '../composables/useFormKitAutoForm.js';
 declare var __VLS_10: string, __VLS_11: any;
@@ -7,7 +6,7 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     overrides: {
@@ -23,13 +22,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     overrides: {
@@ -45,12 +44,12 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: undefined;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     overrides: AutoFormOverrides;
     valibotSchema: ValibotLikeSchema;
     zodSchema: ZodLikeSchema;

package/dist/runtime/components/FUAutoFormOverlay.d.vue.ts

@@ -73,10 +73,10 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
 }>, {
     data: Record<string, any>;
     title: string;
+    as: "modal" | "slideover";
     overrides: AutoFormOverrides;
     valibotSchema: ValibotLikeSchema;
     zodSchema: ZodLikeSchema;
-    as: "modal" | "slideover";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/FUAutoFormOverlay.vue.d.ts

@@ -73,10 +73,10 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
 }>, {
     data: Record<string, any>;
     title: string;
+    as: "modal" | "slideover";
     overrides: AutoFormOverrides;
     valibotSchema: ValibotLikeSchema;
     zodSchema: ZodLikeSchema;
-    as: "modal" | "slideover";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/FUDataEdit.d.vue.ts

@@ -15,7 +15,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: string;
     };
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -79,17 +79,17 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;
         default: string;
     };
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -153,13 +153,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
     schema: FormKitSchemaDefinition;
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     id: string;
     standardSchema: StandardSchemaV1<unknown, unknown>;
     formClass: string;

package/dist/runtime/components/FUDataEdit.vue

@@ -82,7 +82,7 @@ useFormKitContextById(props.id, (context) => {
 });
 onScopeDispose(() => detachStandardSchema?.());
 const formSchema = ref(props.schema);
-const formData = defineModel({ type: [Object, String, Array] });
+const formData = defineModel({ type: Object });
 watch(() => props.schema, (newSchema) => {
   formSchema.value = newSchema;
 }, { deep: true });

package/dist/runtime/components/FUDataEdit.vue.d.ts

@@ -15,7 +15,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: string;
     };
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -79,17 +79,17 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;
         default: string;
     };
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -153,13 +153,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
     schema: FormKitSchemaDefinition;
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     id: string;
     standardSchema: StandardSchemaV1<unknown, unknown>;
     formClass: string;

package/dist/runtime/components/FUDataView.d.vue.ts

@@ -6,7 +6,7 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -26,13 +26,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -52,13 +52,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
     schema: FormKitSchemaDefinition;
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     formClass: string;
     debugData: boolean;
     debugSchema: boolean;

package/dist/runtime/components/FUDataView.vue

@@ -25,7 +25,7 @@ const props = defineProps({
   }
 });
 const formSchema = ref(props.schema);
-const formData = defineModel({ type: [Object, String, Array] });
+const formData = defineModel({ type: Object });
 watch(() => props.schema, (newSchema) => {
   formSchema.value = newSchema;
 }, { deep: true });

package/dist/runtime/components/FUDataView.vue.d.ts

@@ -6,7 +6,7 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -26,13 +26,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: FormKitSchemaDefinition | undefined) => any;
+    "update:modelValue": (value: Record<string, unknown> | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     data: {
-        type: ObjectConstructor;
+        type: PropType<Record<string, unknown>>;
         default: null;
     };
     schema: {
@@ -52,13 +52,13 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     modelValue: {
-        type: PropType<FormKitSchemaDefinition>;
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: FormKitSchemaDefinition | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
     schema: FormKitSchemaDefinition;
-    data: Record<string, any>;
+    data: Record<string, unknown>;
     formClass: string;
     debugData: boolean;
     debugSchema: boolean;

package/dist/runtime/components/inputs/FUCalendar.vue

@@ -9,7 +9,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, styleClass, color, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, styleClass, color, validSlotNames, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 const conversionOptions = computed(() => ({ timeZone: props.context.timeZone }));
 const modelValue = computed({
@@ -46,7 +46,7 @@ const maxValue = computed(() => toDateValue(props.context.maxValue, conversionOp
     :max-value="maxValue"
     :is-date-disabled="context.isDateDisabled"
     :is-date-unavailable="context.isDateUnavailable"
-    :ui="context.ui"
+    :ui="ui"
     @update:model-value="handleInput"
     @focusout="handleContainerBlur"
   >

package/dist/runtime/components/inputs/FUCheckbox.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, styleClass, modelValue, color, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, styleClass, modelValue, color, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -28,7 +28,7 @@ const { handleInput, handleChange, handleBlur, styleClass, modelValue, color, va
     :true-value="context.trueValue"
     :false-value="context.falseValue"
     :autofocus="context.autofocus"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUCheckboxGroup.vue

@@ -7,7 +7,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, styleClass, color, modelValue, items, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, styleClass, color, modelValue, items, validSlotNames, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 </script>
 
@@ -31,6 +31,7 @@ const handleContainerBlur = createContainerBlurHandler(props.context);
     :description-key="context.descriptionKey"
     :loop="context.loop ?? false"
     :name="context.name"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @focusout="handleContainerBlur"

package/dist/runtime/components/inputs/FUColorPicker.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, styleClass, modelValue } = useFormKitInput(props.context);
+const { handleInput, handleChange, styleClass, modelValue, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -20,7 +20,7 @@ const { handleInput, handleChange, styleClass, modelValue } = useFormKitInput(pr
     :size="context.size ?? 'md'"
     :format="context.format || 'hex'"
     :throttle="context.throttle"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
   />

package/dist/runtime/components/inputs/FUEditor.vue

@@ -61,7 +61,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, styleClass, modelValue } = useFormKitInput(props.context);
+const { handleInput, styleClass, modelValue, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 </script>
 
@@ -83,7 +83,7 @@ const handleContainerBlur = createContainerBlurHandler(props.context);
       :handlers="context.editorHandlers"
       :extensions="context.extensions"
       :autofocus="context.autofocus"
-      :ui="context.ui"
+      :ui="ui"
       @update:model-value="handleInput"
     >
       <template #default="{ editor, handlers }">

package/dist/runtime/components/inputs/FUFileUpload.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -38,7 +38,7 @@ const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, mod
     :file-delete-icon="context.fileDeleteIcon"
     :preview="context.preview"
     :name="context.name"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInput.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -43,7 +43,7 @@ const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, mod
     :min-length="context.minLength"
     :pattern="context.pattern"
     :step="context.step"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInputDate.vue

@@ -9,7 +9,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, validSlotNames, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 const conversionOptions = computed(() => ({
   granularity: props.context.granularity,
@@ -65,7 +65,7 @@ const minValue = computed(() => toDateValue(props.context.minValue, conversionOp
     :max-value="maxValue"
     :min-value="minValue"
     :is-date-unavailable="context.isDateUnavailable"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInputMenu.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, items, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, items, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -62,7 +62,7 @@ const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, mod
     :list="context.list"
     :autocomplete="context.autocomplete"
     :search-term="context.searchTerm"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInputNumber.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -44,7 +44,7 @@ const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, mod
     :placeholder="context.placeholder"
     :list="context.list"
     :autocomplete="context.autocomplete"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInputTags.vue

@@ -6,7 +6,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames, ui } = useFormKitInput(props.context);
 </script>
 
 <template>
@@ -46,7 +46,7 @@ const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, mod
     :loading-icon="context.loadingIcon"
     :list="context.list"
     :autocomplete="context.autocomplete || 'off'"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUInputTime.vue

@@ -7,7 +7,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, validSlotNames, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 </script>
 
@@ -45,7 +45,7 @@ const handleContainerBlur = createContainerBlurHandler(props.context);
     :hide-time-zone="context.hideTimeZone"
     :max-value="context.maxValue"
     :min-value="context.minValue"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handleBlur"

package/dist/runtime/components/inputs/FUListbox.vue

@@ -8,7 +8,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, items, validSlotNames } = useFormKitInput(props.context);
+const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, items, validSlotNames, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 const targetItems = ref(modelValue.value || []);
 const sourceSelection = ref([]);
@@ -24,6 +24,7 @@ const sourceItems = computed(() => {
   return items.value.filter((item) => !targetItems.value.some((t) => t[valueKey] === item[valueKey]));
 });
 const transferSlotNames = computed(() => validSlotNames.value.filter((name) => name !== "item-trailing"));
+const transferDefaultValue = computed(() => props.context.defaultValue);
 const sourceContainerRef = ref();
 const targetContainerRef = ref();
 const sourceDragActive = ref(false);
@@ -239,7 +240,7 @@ watch(targetItems, (newVal) => {
     :autofocus="context.autofocus"
     :autofocus-delay="context.autofocusDelay"
     :search-term="context.searchTerm"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @focusout="handleContainerBlur"
@@ -287,7 +288,7 @@ watch(targetItems, (newVal) => {
         :orientation="context.orientation"
         :selection-behavior="context.selectionBehavior"
         :disabled="!!context?.disabled"
-        :default-value="context.defaultValue"
+        :default-value="transferDefaultValue"
         :multiple="true"
         :value-key="context.valueKey"
         :label-key="context.labelKey"
@@ -304,7 +305,7 @@ watch(targetItems, (newVal) => {
         :autofocus="context.autofocus"
         :autofocus-delay="context.autofocusDelay"
         :search-term="context.searchTerm"
-        :ui="context.ui"
+        :ui="ui"
         @change="handleChange"
         @update:model-value="handleInput"
       >
@@ -389,7 +390,7 @@ watch(targetItems, (newVal) => {
         :orientation="context.orientation"
         :selection-behavior="context.selectionBehavior"
         :disabled="!!context?.disabled"
-        :default-value="context.defaultValue"
+        :default-value="transferDefaultValue"
         :multiple="true"
         :value-key="context.valueKey"
         :label-key="context.labelKey"
@@ -406,7 +407,7 @@ watch(targetItems, (newVal) => {
         :autofocus="context.autofocus"
         :autofocus-delay="context.autofocusDelay"
         :search-term="context.searchTerm"
-        :ui="context.ui"
+        :ui="ui"
         @change="handleChange"
         @update:model-value="handleInput"
       >

package/dist/runtime/components/inputs/FUPinInput.vue

@@ -7,7 +7,7 @@ const props = defineProps({
     required: true
   }
 });
-const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue } = useFormKitInput(props.context);
+const { handleInput, handleChange, handleBlur, isInvalid, styleClass, color, modelValue, ui } = useFormKitInput(props.context);
 const handleContainerBlur = createContainerBlurHandler(props.context);
 function handlePinBlur(event) {
   handleBlur(event);
@@ -37,7 +37,7 @@ function handlePinBlur(event) {
     :separator="context.separator"
     :type="context.type ?? 'text'"
     :placeholder="context.placeholder"
-    :ui="context.ui"
+    :ui="ui"
     @change="handleChange"
     @update:model-value="handleInput"
     @blur="handlePinBlur"