@sfxcode/nuxt-ui-formkit 1.2.7 → 1.2.9

package/dist/module.json

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

package/dist/runtime/components/output/FUOutputBadge.d.vue.ts

@@ -0,0 +1,30 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputBadgeProps {
+    badgeIcon?: string;
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    square?: boolean;
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputBadgeProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputBadgeProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputBadge.vue

@@ -0,0 +1,56 @@
+<script setup>
+import { computed } from "vue";
+import { useFormKitOutput } from "../../utils/useFormKitOutput";
+import FUIcon from "./FUIcon.vue";
+const props = defineProps({
+  context: {
+    type: Object,
+    required: true
+  }
+});
+const displayValue = computed(() => {
+  const value = props.context._value;
+  if (value === null || value === void 0)
+    return void 0;
+  return value;
+});
+const badgeVariant = computed(() => {
+  const variant = props.context.variant;
+  if (variant === "ghost" || variant === "none")
+    return "soft";
+  return variant;
+});
+const { containerClass, iconClass, leadingIconName, trailingIconName, ui } = useFormKitOutput(props.context);
+</script>
+
+<template>
+  <div
+    :id="context.id"
+    :class="containerClass"
+    :style="context?.attrs?.style"
+  >
+    <FUIcon
+      v-if="leadingIconName"
+      :name="leadingIconName"
+      :class="iconClass"
+      :on-click="context?.onLeadingIconClicked"
+    />
+
+    <UBadge
+      :label="displayValue"
+      :color="context.color"
+      :variant="badgeVariant"
+      :size="context.size"
+      :icon="context.badgeIcon"
+      :square="context.square"
+      :ui="ui?.badge"
+    />
+
+    <FUIcon
+      v-if="trailingIconName"
+      :name="trailingIconName"
+      :class="iconClass"
+      :on-click="context?.onTrailingIconClicked"
+    />
+  </div>
+</template>

package/dist/runtime/components/output/FUOutputBadge.vue.d.ts

@@ -0,0 +1,30 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputBadgeProps {
+    badgeIcon?: string;
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    square?: boolean;
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputBadgeProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputBadgeProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputProgress.d.vue.ts

@@ -0,0 +1,32 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputProgressProps {
+    animation?: 'carousel' | 'carousel-inverse' | 'swing' | 'elastic';
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    max?: number;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    status?: boolean;
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputProgressProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputProgressProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputProgress.vue

@@ -0,0 +1,55 @@
+<script setup>
+import { computed } from "vue";
+import { useFormKitOutput } from "../../utils/useFormKitOutput";
+import FUIcon from "./FUIcon.vue";
+const props = defineProps({
+  context: {
+    type: Object,
+    required: true
+  }
+});
+const progressValue = computed(() => {
+  const value = props.context._value;
+  if (value === null || value === void 0 || value === "")
+    return null;
+  return Number(value);
+});
+const progressSizeClass = computed(() => {
+  return props.context.orientation === "vertical" ? "min-h-32" : "min-w-32 flex-1";
+});
+const { containerClass, iconClass, leadingIconName, trailingIconName, ui } = useFormKitOutput(props.context);
+</script>
+
+<template>
+  <div
+    :id="context.id"
+    :class="containerClass"
+    :style="context?.attrs?.style"
+  >
+    <FUIcon
+      v-if="leadingIconName"
+      :name="leadingIconName"
+      :class="iconClass"
+      :on-click="context?.onLeadingIconClicked"
+    />
+
+    <UProgress
+      :class="progressSizeClass"
+      :model-value="progressValue"
+      :max="context.max"
+      :status="context.status"
+      :color="context.color"
+      :size="context.size"
+      :orientation="context.orientation"
+      :animation="context.animation"
+      :ui="ui?.progress"
+    />
+
+    <FUIcon
+      v-if="trailingIconName"
+      :name="trailingIconName"
+      :class="iconClass"
+      :on-click="context?.onTrailingIconClicked"
+    />
+  </div>
+</template>

package/dist/runtime/components/output/FUOutputProgress.vue.d.ts

@@ -0,0 +1,32 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputProgressProps {
+    animation?: 'carousel' | 'carousel-inverse' | 'swing' | 'elastic';
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    max?: number;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    status?: boolean;
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputProgressProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputProgressProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputRating.d.vue.ts

@@ -0,0 +1,31 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputRatingProps {
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    emptyIcon?: string;
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    length?: number;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputRatingProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputRatingProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputRating.vue

@@ -0,0 +1,59 @@
+<script setup>
+import { computed } from "vue";
+import { useFormKitOutput } from "../../utils/useFormKitOutput";
+import FUIcon from "./FUIcon.vue";
+const props = defineProps({
+  context: {
+    type: Object,
+    required: true
+  }
+});
+const ratingValue = computed(() => {
+  const value = props.context._value;
+  if (value === null || value === void 0 || value === "")
+    return void 0;
+  return Number(value);
+});
+const { containerClass, iconClass, leadingIconName, trailingIconName, ui } = useFormKitOutput(props.context);
+</script>
+
+<template>
+  <div
+    :id="context.id"
+    :class="containerClass"
+    :style="context?.attrs?.style"
+  >
+    <FUIcon
+      v-if="leadingIconName"
+      :name="leadingIconName"
+      :class="iconClass"
+      :on-click="context?.onLeadingIconClicked"
+    />
+
+    <!--
+      This is a display component, not an input: `readonly` (Nuxt UI's dedicated
+      non-interactive-but-normal-look prop) is hardcoded true rather than exposed as a
+      schema prop - it must never be configurable off. `disabled` is deliberately left
+      unset here, unlike FUInputRating.vue's unconditional `:disabled="!!context?.disabled"`
+      - a display component has no disabled/enabled state of its own to reflect.
+    -->
+    <UInputRating
+      :model-value="ratingValue"
+      :readonly="true"
+      :color="context.color"
+      :size="context.size"
+      :orientation="context.orientation"
+      :icon="context.icon"
+      :empty-icon="context.emptyIcon"
+      :length="context.length"
+      :ui="ui?.rating"
+    />
+
+    <FUIcon
+      v-if="trailingIconName"
+      :name="trailingIconName"
+      :class="iconClass"
+      :on-click="context?.onTrailingIconClicked"
+    />
+  </div>
+</template>

package/dist/runtime/components/output/FUOutputRating.vue.d.ts

@@ -0,0 +1,31 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputRatingProps {
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    emptyIcon?: string;
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    length?: number;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputRatingProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputRatingProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputUser.d.vue.ts

@@ -0,0 +1,41 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputUserAvatar {
+    src?: string;
+    alt?: string;
+    icon?: string;
+    text?: string;
+}
+export interface FormKitOutputUserValue {
+    name?: string;
+    description?: string;
+    avatar?: FormKitOutputUserAvatar;
+}
+export interface FormKitOutputUserProps {
+    chip?: boolean | Record<string, unknown>;
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputUserProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputUserProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/output/FUOutputUser.vue

@@ -0,0 +1,45 @@
+<script setup>
+import { computed } from "vue";
+import { useFormKitOutput } from "../../utils/useFormKitOutput";
+import FUIcon from "./FUIcon.vue";
+const props = defineProps({
+  context: {
+    type: Object,
+    required: true
+  }
+});
+const userValue = computed(() => props.context._value);
+const { containerClass, iconClass, leadingIconName, trailingIconName, ui } = useFormKitOutput(props.context);
+</script>
+
+<template>
+  <div
+    :id="context.id"
+    :class="containerClass"
+    :style="context?.attrs?.style"
+  >
+    <FUIcon
+      v-if="leadingIconName"
+      :name="leadingIconName"
+      :class="iconClass"
+      :on-click="context?.onLeadingIconClicked"
+    />
+
+    <UUser
+      :name="userValue?.name"
+      :description="userValue?.description"
+      :avatar="userValue?.avatar"
+      :chip="context.chip"
+      :size="context.size"
+      :orientation="context.orientation"
+      :ui="ui?.user"
+    />
+
+    <FUIcon
+      v-if="trailingIconName"
+      :name="trailingIconName"
+      :class="iconClass"
+      :on-click="context?.onTrailingIconClicked"
+    />
+  </div>
+</template>

package/dist/runtime/components/output/FUOutputUser.vue.d.ts

@@ -0,0 +1,41 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { PropType } from 'vue';
+import type { FormKitOutputUi } from '../../utils/useFormKitOutput.js';
+import type { FormKitIconProps } from './FUIcon.vue.js';
+export interface FormKitOutputUserAvatar {
+    src?: string;
+    alt?: string;
+    icon?: string;
+    text?: string;
+}
+export interface FormKitOutputUserValue {
+    name?: string;
+    description?: string;
+    avatar?: FormKitOutputUserAvatar;
+}
+export interface FormKitOutputUserProps {
+    chip?: boolean | Record<string, unknown>;
+    color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
+    icon?: string;
+    leading?: boolean;
+    leadingIcon?: string;
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    trailing?: boolean;
+    trailingIcon?: string;
+    variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
+    ui?: FormKitOutputUi;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputUserProps & FormKitIconProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitOutputUserProps & FormKitIconProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/formkit/definitions/index.d.ts

@@ -29,10 +29,14 @@ export declare const nuxtUIInputs: {
     nuxtUIRepeater: import("@formkit/core").FormKitTypeDefinition;
 };
 export declare const nuxtUIOutputs: {
+    nuxtUIOutputBadge: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputBoolean: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputDate: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputLink: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputList: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputNumber: import("@formkit/core").FormKitTypeDefinition;
+    nuxtUIOutputProgress: import("@formkit/core").FormKitTypeDefinition;
+    nuxtUIOutputRating: import("@formkit/core").FormKitTypeDefinition;
     nuxtUIOutputText: import("@formkit/core").FormKitTypeDefinition;
+    nuxtUIOutputUser: import("@formkit/core").FormKitTypeDefinition;
 };

package/dist/runtime/formkit/definitions/index.js

@@ -1,6 +1,6 @@
 import { nuxtUICalendarDefinition, nuxtUICheckboxDefinition, nuxtUICheckboxGroupDefinition, nuxtUIColorPickerDefinition, nuxtUIEditorDefinition, nuxtUIFileUploadDefinition, nuxtUIInputDateDefinition, nuxtUIInputDefinition, nuxtUIInputMenuDefinition, nuxtUIInputNumberDefinition, nuxtUIInputRatingDefinition, nuxtUIInputTagsDefinition, nuxtUIInputTimeDefinition, nuxtUIListboxDefinition, nuxtUIPinInputDefinition, nuxtUIRadioGroupDefinition, nuxtUISelectDefinition, nuxtUISelectMenuDefinition, nuxtUISliderDefinition, nuxtUISwitchDefinition, nuxtUITextareaDefinition, nuxtUITreeDefinition } from "./input.js";
 import { nuxtUIMultiStepDefinition, nuxtUIStepDefinition } from "./multiStep.js";
-import { nuxtUIOutputBooleanDefinition, nuxtUIOutputDateDefinition, nuxtUIOutputLinkDefinition, nuxtUIOutputListDefinition, nuxtUIOutputNumberDefinition, nuxtUIOutputTextDefinition } from "./output.js";
+import { nuxtUIOutputBadgeDefinition, nuxtUIOutputBooleanDefinition, nuxtUIOutputDateDefinition, nuxtUIOutputLinkDefinition, nuxtUIOutputListDefinition, nuxtUIOutputNumberDefinition, nuxtUIOutputProgressDefinition, nuxtUIOutputRatingDefinition, nuxtUIOutputTextDefinition, nuxtUIOutputUserDefinition } from "./output.js";
 import { nuxtUIRepeaterDefinition } from "./repeater.js";
 export * from "./input.js";
 export * from "./multiStep.js";
@@ -33,10 +33,14 @@ export const nuxtUIInputs = {
   nuxtUIRepeater: nuxtUIRepeaterDefinition
 };
 export const nuxtUIOutputs = {
+  nuxtUIOutputBadge: nuxtUIOutputBadgeDefinition,
   nuxtUIOutputBoolean: nuxtUIOutputBooleanDefinition,
   nuxtUIOutputDate: nuxtUIOutputDateDefinition,
   nuxtUIOutputLink: nuxtUIOutputLinkDefinition,
   nuxtUIOutputList: nuxtUIOutputListDefinition,
   nuxtUIOutputNumber: nuxtUIOutputNumberDefinition,
-  nuxtUIOutputText: nuxtUIOutputTextDefinition
+  nuxtUIOutputProgress: nuxtUIOutputProgressDefinition,
+  nuxtUIOutputRating: nuxtUIOutputRatingDefinition,
+  nuxtUIOutputText: nuxtUIOutputTextDefinition,
+  nuxtUIOutputUser: nuxtUIOutputUserDefinition
 };

package/dist/runtime/formkit/definitions/index.mjs

@@ -1,6 +1,6 @@
 import { nuxtUICalendarDefinition, nuxtUICheckboxDefinition, nuxtUICheckboxGroupDefinition, nuxtUIColorPickerDefinition, nuxtUIEditorDefinition, nuxtUIFileUploadDefinition, nuxtUIInputDateDefinition, nuxtUIInputDefinition, nuxtUIInputMenuDefinition, nuxtUIInputNumberDefinition, nuxtUIInputRatingDefinition, nuxtUIInputTagsDefinition, nuxtUIInputTimeDefinition, nuxtUIListboxDefinition, nuxtUIPinInputDefinition, nuxtUIRadioGroupDefinition, nuxtUISelectDefinition, nuxtUISelectMenuDefinition, nuxtUISliderDefinition, nuxtUISwitchDefinition, nuxtUITextareaDefinition, nuxtUITreeDefinition } from "./input.mjs";
 import { nuxtUIMultiStepDefinition, nuxtUIStepDefinition } from "./multiStep.mjs";
-import { nuxtUIOutputBooleanDefinition, nuxtUIOutputDateDefinition, nuxtUIOutputLinkDefinition, nuxtUIOutputListDefinition, nuxtUIOutputNumberDefinition, nuxtUIOutputTextDefinition } from "./output.mjs";
+import { nuxtUIOutputBadgeDefinition, nuxtUIOutputBooleanDefinition, nuxtUIOutputDateDefinition, nuxtUIOutputLinkDefinition, nuxtUIOutputListDefinition, nuxtUIOutputNumberDefinition, nuxtUIOutputProgressDefinition, nuxtUIOutputRatingDefinition, nuxtUIOutputTextDefinition, nuxtUIOutputUserDefinition } from "./output.mjs";
 import { nuxtUIRepeaterDefinition } from "./repeater.mjs";
 export * from "./input.mjs";
 export * from "./multiStep.mjs";
@@ -33,10 +33,14 @@ export const nuxtUIInputs = {
   nuxtUIRepeater: nuxtUIRepeaterDefinition
 };
 export const nuxtUIOutputs = {
+  nuxtUIOutputBadge: nuxtUIOutputBadgeDefinition,
   nuxtUIOutputBoolean: nuxtUIOutputBooleanDefinition,
   nuxtUIOutputDate: nuxtUIOutputDateDefinition,
   nuxtUIOutputLink: nuxtUIOutputLinkDefinition,
   nuxtUIOutputList: nuxtUIOutputListDefinition,
   nuxtUIOutputNumber: nuxtUIOutputNumberDefinition,
-  nuxtUIOutputText: nuxtUIOutputTextDefinition
+  nuxtUIOutputProgress: nuxtUIOutputProgressDefinition,
+  nuxtUIOutputRating: nuxtUIOutputRatingDefinition,
+  nuxtUIOutputText: nuxtUIOutputTextDefinition,
+  nuxtUIOutputUser: nuxtUIOutputUserDefinition
 };

package/dist/runtime/formkit/definitions/output.d.ts

@@ -5,3 +5,7 @@ export declare const nuxtUIOutputDateDefinition: FormKitTypeDefinition;
 export declare const nuxtUIOutputLinkDefinition: FormKitTypeDefinition;
 export declare const nuxtUIOutputNumberDefinition: FormKitTypeDefinition;
 export declare const nuxtUIOutputListDefinition: FormKitTypeDefinition;
+export declare const nuxtUIOutputProgressDefinition: FormKitTypeDefinition;
+export declare const nuxtUIOutputRatingDefinition: FormKitTypeDefinition;
+export declare const nuxtUIOutputUserDefinition: FormKitTypeDefinition;
+export declare const nuxtUIOutputBadgeDefinition: FormKitTypeDefinition;

package/dist/runtime/formkit/definitions/output.js

@@ -5,6 +5,10 @@ import FUOutputText from "../../../runtime/components/output/FUOutputText.vue";
 import FUOutputLink from "../../../runtime/components/output/FUOutputLink.vue";
 import FUOutputNumber from "../../../runtime/components/output/FUOutputNumber.vue";
 import FUOutputList from "../../../runtime/components/output/FUOutputList.vue";
+import FUOutputProgress from "../../../runtime/components/output/FUOutputProgress.vue";
+import FUOutputRating from "../../../runtime/components/output/FUOutputRating.vue";
+import FUOutputUser from "../../../runtime/components/output/FUOutputUser.vue";
+import FUOutputBadge from "../../../runtime/components/output/FUOutputBadge.vue";
 export const nuxtUIOutputTextDefinition = createInput(FUOutputText, {
   props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "outputType", "ui"],
   family: "NuxtUIOutput"
@@ -29,3 +33,19 @@ export const nuxtUIOutputListDefinition = createInput(FUOutputList, {
   props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "listType", "separator", "itemClass", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "ui"],
   family: "NuxtUIOutput"
 });
+export const nuxtUIOutputProgressDefinition = createInput(FUOutputProgress, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "max", "status", "orientation", "animation", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputRatingDefinition = createInput(FUOutputRating, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "length", "emptyIcon", "orientation", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputUserDefinition = createInput(FUOutputUser, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "orientation", "chip", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputBadgeDefinition = createInput(FUOutputBadge, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "badgeIcon", "square", "ui"],
+  family: "NuxtUIOutput"
+});

package/dist/runtime/formkit/definitions/output.mjs

@@ -5,6 +5,10 @@ import FUOutputText from "../../../runtime/components/output/FUOutputText.vue";
 import FUOutputLink from "../../../runtime/components/output/FUOutputLink.vue";
 import FUOutputNumber from "../../../runtime/components/output/FUOutputNumber.vue";
 import FUOutputList from "../../../runtime/components/output/FUOutputList.vue";
+import FUOutputProgress from "../../../runtime/components/output/FUOutputProgress.vue";
+import FUOutputRating from "../../../runtime/components/output/FUOutputRating.vue";
+import FUOutputUser from "../../../runtime/components/output/FUOutputUser.vue";
+import FUOutputBadge from "../../../runtime/components/output/FUOutputBadge.vue";
 export const nuxtUIOutputTextDefinition = createInput(FUOutputText, {
   props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "outputType", "ui"],
   family: "NuxtUIOutput"
@@ -29,3 +33,19 @@ export const nuxtUIOutputListDefinition = createInput(FUOutputList, {
   props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "listType", "separator", "itemClass", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "ui"],
   family: "NuxtUIOutput"
 });
+export const nuxtUIOutputProgressDefinition = createInput(FUOutputProgress, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "max", "status", "orientation", "animation", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputRatingDefinition = createInput(FUOutputRating, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "length", "emptyIcon", "orientation", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputUserDefinition = createInput(FUOutputUser, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "orientation", "chip", "ui"],
+  family: "NuxtUIOutput"
+});
+export const nuxtUIOutputBadgeDefinition = createInput(FUOutputBadge, {
+  props: ["size", "color", "variant", "icon", "leadingIcon", "trailingIcon", "leading", "trailing", "onIconClicked", "onLeadingIconClicked", "onTrailingIconClicked", "badgeIcon", "square", "ui"],
+  family: "NuxtUIOutput"
+});

package/dist/runtime/formkit/index.d.ts

@@ -103,6 +103,18 @@ declare module '@formkit/inputs' {
         nuxtUIOutputList: {
             type: 'nuxtUIOutputList';
         };
+        nuxtUIOutputProgress: {
+            type: 'nuxtUIOutputProgress';
+        };
+        nuxtUIOutputRating: {
+            type: 'nuxtUIOutputRating';
+        };
+        nuxtUIOutputUser: {
+            type: 'nuxtUIOutputUser';
+        };
+        nuxtUIOutputBadge: {
+            type: 'nuxtUIOutputBadge';
+        };
     }
     interface FormKitInputSlots<Props extends FormKitInputs<Props>> {
         nuxtUICalendar: MergeSlots<FormKitBaseSlots<Props>, CalendarSlots>;

package/dist/runtime/utils/useFormKitOutput.d.ts

@@ -6,6 +6,12 @@ export interface FormKitOutputUi {
     icon?: string;
     /** Forwarded unmodified to `UBadge`'s own `:ui` prop (`FUOutputList`'s badge display mode only). */
     badge?: Record<string, unknown>;
+    /** Forwarded unmodified to `UProgress`'s own `:ui` prop (`FUOutputProgress` only). */
+    progress?: Record<string, unknown>;
+    /** Forwarded unmodified to `UInputRating`'s own `:ui` prop (`FUOutputRating` only). */
+    rating?: Record<string, unknown>;
+    /** Forwarded unmodified to `UUser`'s own `:ui` prop (`FUOutputUser` only). */
+    user?: Record<string, unknown>;
 }
 export declare function useFormKitOutput(context: FormKitFrameworkContext): {
     colorClass: import("vue").ComputedRef<string>;
@@ -22,7 +28,16 @@ export declare function useFormKitOutput(context: FormKitFrameworkContext): {
         icon?: string
         /** Forwarded unmodified to `UBadge`'s own `:ui` prop (`FUOutputList`'s badge display mode only). */
          | undefined;
-        badge?: Record<string, unknown> | undefined;
+        badge?: Record<string, unknown>
+        /** Forwarded unmodified to `UProgress`'s own `:ui` prop (`FUOutputProgress` only). */
+         | undefined;
+        progress?: Record<string, unknown>
+        /** Forwarded unmodified to `UInputRating`'s own `:ui` prop (`FUOutputRating` only). */
+         | undefined;
+        rating?: Record<string, unknown>
+        /** Forwarded unmodified to `UUser`'s own `:ui` prop (`FUOutputUser` only). */
+         | undefined;
+        user?: Record<string, unknown> | undefined;
     } | undefined, FormKitOutputUi | {
         root?: string
         /** Merged into `iconClass`, applied to every `FUIcon` an Output component renders. */
@@ -30,6 +45,15 @@ export declare function useFormKitOutput(context: FormKitFrameworkContext): {
         icon?: string
         /** Forwarded unmodified to `UBadge`'s own `:ui` prop (`FUOutputList`'s badge display mode only). */
          | undefined;
-        badge?: Record<string, unknown> | undefined;
+        badge?: Record<string, unknown>
+        /** Forwarded unmodified to `UProgress`'s own `:ui` prop (`FUOutputProgress` only). */
+         | undefined;
+        progress?: Record<string, unknown>
+        /** Forwarded unmodified to `UInputRating`'s own `:ui` prop (`FUOutputRating` only). */
+         | undefined;
+        rating?: Record<string, unknown>
+        /** Forwarded unmodified to `UUser`'s own `:ui` prop (`FUOutputUser` only). */
+         | undefined;
+        user?: Record<string, unknown> | undefined;
     } | undefined>;
 };

package/dist/runtime/utils/useFormKitOutput.js

@@ -17,7 +17,7 @@ export function useFormKitOutput(context) {
       info: "text-info",
       warning: "text-warning",
       error: "text-error",
-      neutral: "text-gray-900 dark:text-gray-100"
+      neutral: "text-highlighted"
     };
     return colorMap[color] || colorMap.neutral;
   });
@@ -35,10 +35,10 @@ export function useFormKitOutput(context) {
   const variantClass = computed(() => {
     const variant = context.variant ?? "none";
     const variantMap = {
-      outline: "border border-gray-300 dark:border-gray-700 rounded-md px-2 py-1",
-      soft: "bg-gray-100 dark:bg-gray-800 rounded-md",
-      subtle: "bg-gray-50 dark:bg-gray-900 rounded-md",
-      ghost: "hover:bg-gray-100 dark:hover:bg-gray-800 rounded-md",
+      outline: "border border-default rounded-md px-2 py-1",
+      soft: "bg-elevated rounded-md",
+      subtle: "bg-muted rounded-md",
+      ghost: "hover:bg-elevated rounded-md",
       none: ""
     };
     return variantMap[variant] || variantMap.none;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sfxcode/nuxt-ui-formkit",
-  "version": "1.2.7",
+  "version": "1.2.9",
   "description": "FormKit integration for Nuxt UI - Seamlessly connect FormKit form handling with Nuxt UI components",
   "author": {
     "name": "Tom",
@@ -90,7 +90,6 @@
   "dependencies": {
     "@formkit/addons": "^2.1.0",
     "@formkit/nuxt": "^2.1.0",
-    "@nuxt/kit": "4.4.8",
     "@nuxt/ui": "^4.10.0",
     "@standard-schema/spec": "^1.1.0",
     "@vue/compiler-dom": "^3.5.40"
@@ -101,12 +100,13 @@
     "@codemirror/theme-one-dark": "^6.1.3",
     "@codemirror/view": "^6.43.6",
     "@iconify-json/heroicons": "^1.2.3",
-    "@iconify-json/lucide": "^1.2.117",
-    "@iconify-json/simple-icons": "^1.2.90",
+    "@iconify-json/lucide": "^1.2.118",
+    "@iconify-json/simple-icons": "^1.2.91",
     "@nuxt/devtools": "4.0.0-alpha.7",
     "@nuxt/eslint-config": "^1.16.0",
+    "@nuxt/kit": "^4.5.0",
     "@nuxt/module-builder": "^1.0.2",
-    "@nuxt/schema": "4.4.8",
+    "@nuxt/schema": "^4.5.0",
     "@nuxt/test-utils": "^4.0.3",
     "@types/node": "latest",
     "@vitejs/plugin-vue": "^6.0.8",
@@ -116,7 +116,7 @@
     "eslint": "^10.7.0",
     "jsdom": "^29.1.1",
     "mkdist": "^2.4.1",
-    "nuxt": "4.4.8",
+    "nuxt": "^4.5.0",
     "sass-embedded": "^1.100.0",
     "typescript": "~6.0.3",
     "unbuild": "^3.6.1",
@@ -124,7 +124,7 @@
     "vitepress": "2.0.0-alpha.17",
     "vitest": "^4.1.10",
     "vue": "^3.5.40",
-    "vue-i18n": "^11.4.6",
+    "vue-i18n": "^11.4.7",
     "vue-tsc": "^3.3.7",
     "zod": "^4.4.3"
   },