@nuxt/ui 2.17.0 → 2.18.1

package/dist/runtime/ui.config/forms/{inputMenu.mjs → inputMenu.js}

@@ -1,4 +1,4 @@
-import { arrow } from "../popper.mjs";
+import { arrow } from "../popper.js";
 export default {
   container: "z-20 group",
   trigger: "flex items-center w-full",

package/dist/runtime/ui.config/forms/{select.mjs → select.js}

@@ -1,4 +1,4 @@
-import input from "./input.mjs";
+import input from "./input.js";
 export default {
   ...input,
   form: "form-select",

package/dist/runtime/ui.config/forms/{selectMenu.mjs → selectMenu.js}

@@ -1,5 +1,5 @@
-import { arrow } from "../popper.mjs";
-import inputMenu from "./inputMenu.mjs";
+import { arrow } from "../popper.js";
+import inputMenu from "./inputMenu.js";
 export default {
   ...inputMenu,
   select: "inline-flex items-center text-left cursor-default",

package/dist/runtime/ui.config/forms/{textarea.mjs → textarea.js}

@@ -1,4 +1,4 @@
-import input from "./input.mjs";
+import input from "./input.js";
 export default {
   ...input,
   form: "form-textarea",

package/dist/runtime/ui.config/forms/toggle.d.ts

@@ -53,8 +53,8 @@ declare const _default: {
         loading: string;
     };
     default: {
-        onIcon: null;
-        offIcon: null;
+        onIcon: any;
+        offIcon: any;
         loadingIcon: string;
         color: string;
         size: string;

package/dist/runtime/ui.config/index.d.ts

@@ -1,43 +1,43 @@
-export { default as table } from './data/table';
-export { default as avatar } from './elements/avatar';
-export { default as avatarGroup } from './elements/avatarGroup';
-export { default as badge } from './elements/badge';
-export { default as button } from './elements/button';
-export { default as buttonGroup } from './elements/buttonGroup';
-export { default as chip } from './elements/chip';
-export { default as dropdown } from './elements/dropdown';
-export { default as accordion } from './elements/accordion';
-export { default as alert } from './elements/alert';
-export { default as kbd } from './elements/kbd';
-export { default as progress } from './elements/progress';
-export { default as meter } from './elements/meter';
-export { default as meterGroup } from './elements/meterGroup';
-export { default as carousel } from './elements/carousel';
-export { default as input } from './forms/input';
-export { default as inputMenu } from './forms/inputMenu';
-export { default as formGroup } from './forms/formGroup';
-export { default as textarea } from './forms/textarea';
-export { default as select } from './forms/select';
-export { default as selectMenu } from './forms/selectMenu';
-export { default as radioGroup } from './forms/radioGroup';
-export { default as radio } from './forms/radio';
-export { default as checkbox } from './forms/checkbox';
-export { default as toggle } from './forms/toggle';
-export { default as range } from './forms/range';
-export { default as card } from './layout/card';
-export { default as container } from './layout/container';
-export { default as skeleton } from './layout/skeleton';
-export { default as divider } from './layout/divider';
-export { default as verticalNavigation } from './navigation/verticalNavigation';
-export { default as horizontalNavigation } from './navigation/horizontalNavigation';
-export { default as commandPalette } from './navigation/commandPalette';
-export { default as pagination } from './navigation/pagination';
-export { default as tabs } from './navigation/tabs';
-export { default as breadcrumb } from './navigation/breadcrumb';
-export { default as modal } from './overlays/modal';
-export { default as slideover } from './overlays/slideover';
-export { default as tooltip } from './overlays/tooltip';
-export { default as popover } from './overlays/popover';
-export { default as contextMenu } from './overlays/contextMenu';
-export { default as notification } from './overlays/notification';
-export { default as notifications } from './overlays/notifications';
+export { default as table } from './data/table.js';
+export { default as avatar } from './elements/avatar.js';
+export { default as avatarGroup } from './elements/avatarGroup.js';
+export { default as badge } from './elements/badge.js';
+export { default as button } from './elements/button.js';
+export { default as buttonGroup } from './elements/buttonGroup.js';
+export { default as chip } from './elements/chip.js';
+export { default as dropdown } from './elements/dropdown.js';
+export { default as accordion } from './elements/accordion.js';
+export { default as alert } from './elements/alert.js';
+export { default as kbd } from './elements/kbd.js';
+export { default as progress } from './elements/progress.js';
+export { default as meter } from './elements/meter.js';
+export { default as meterGroup } from './elements/meterGroup.js';
+export { default as carousel } from './elements/carousel.js';
+export { default as input } from './forms/input.js';
+export { default as inputMenu } from './forms/inputMenu.js';
+export { default as formGroup } from './forms/formGroup.js';
+export { default as textarea } from './forms/textarea.js';
+export { default as select } from './forms/select.js';
+export { default as selectMenu } from './forms/selectMenu.js';
+export { default as radioGroup } from './forms/radioGroup.js';
+export { default as radio } from './forms/radio.js';
+export { default as checkbox } from './forms/checkbox.js';
+export { default as toggle } from './forms/toggle.js';
+export { default as range } from './forms/range.js';
+export { default as card } from './layout/card.js';
+export { default as container } from './layout/container.js';
+export { default as skeleton } from './layout/skeleton.js';
+export { default as divider } from './layout/divider.js';
+export { default as verticalNavigation } from './navigation/verticalNavigation.js';
+export { default as horizontalNavigation } from './navigation/horizontalNavigation.js';
+export { default as commandPalette } from './navigation/commandPalette.js';
+export { default as pagination } from './navigation/pagination.js';
+export { default as tabs } from './navigation/tabs.js';
+export { default as breadcrumb } from './navigation/breadcrumb.js';
+export { default as modal } from './overlays/modal.js';
+export { default as slideover } from './overlays/slideover.js';
+export { default as tooltip } from './overlays/tooltip.js';
+export { default as popover } from './overlays/popover.js';
+export { default as contextMenu } from './overlays/contextMenu.js';
+export { default as notification } from './overlays/notification.js';
+export { default as notifications } from './overlays/notifications.js';

package/dist/runtime/ui.config/index.js

@@ -0,0 +1,43 @@
+export { default as table } from "./data/table.js";
+export { default as avatar } from "./elements/avatar.js";
+export { default as avatarGroup } from "./elements/avatarGroup.js";
+export { default as badge } from "./elements/badge.js";
+export { default as button } from "./elements/button.js";
+export { default as buttonGroup } from "./elements/buttonGroup.js";
+export { default as chip } from "./elements/chip.js";
+export { default as dropdown } from "./elements/dropdown.js";
+export { default as accordion } from "./elements/accordion.js";
+export { default as alert } from "./elements/alert.js";
+export { default as kbd } from "./elements/kbd.js";
+export { default as progress } from "./elements/progress.js";
+export { default as meter } from "./elements/meter.js";
+export { default as meterGroup } from "./elements/meterGroup.js";
+export { default as carousel } from "./elements/carousel.js";
+export { default as input } from "./forms/input.js";
+export { default as inputMenu } from "./forms/inputMenu.js";
+export { default as formGroup } from "./forms/formGroup.js";
+export { default as textarea } from "./forms/textarea.js";
+export { default as select } from "./forms/select.js";
+export { default as selectMenu } from "./forms/selectMenu.js";
+export { default as radioGroup } from "./forms/radioGroup.js";
+export { default as radio } from "./forms/radio.js";
+export { default as checkbox } from "./forms/checkbox.js";
+export { default as toggle } from "./forms/toggle.js";
+export { default as range } from "./forms/range.js";
+export { default as card } from "./layout/card.js";
+export { default as container } from "./layout/container.js";
+export { default as skeleton } from "./layout/skeleton.js";
+export { default as divider } from "./layout/divider.js";
+export { default as verticalNavigation } from "./navigation/verticalNavigation.js";
+export { default as horizontalNavigation } from "./navigation/horizontalNavigation.js";
+export { default as commandPalette } from "./navigation/commandPalette.js";
+export { default as pagination } from "./navigation/pagination.js";
+export { default as tabs } from "./navigation/tabs.js";
+export { default as breadcrumb } from "./navigation/breadcrumb.js";
+export { default as modal } from "./overlays/modal.js";
+export { default as slideover } from "./overlays/slideover.js";
+export { default as tooltip } from "./overlays/tooltip.js";
+export { default as popover } from "./overlays/popover.js";
+export { default as contextMenu } from "./overlays/contextMenu.js";
+export { default as notification } from "./overlays/notification.js";
+export { default as notifications } from "./overlays/notifications.js";

package/dist/runtime/ui.config/navigation/{breadcrumb.mjs → breadcrumb.js}

@@ -10,11 +10,11 @@ export default {
     inactive: ""
   },
   divider: {
-    base: "flex-shrink-0 w-5 h-5"
+    base: "flex-shrink-0 w-5 h-5 rtl:rotate-180"
   },
   active: "text-primary-500 dark:text-primary-400",
   inactive: " hover:text-gray-700 dark:hover:text-gray-200",
   default: {
-    divider: "i-heroicons-chevron-right-20-solid rtl:i-heroicons-chevron-left-20-solid"
+    divider: "i-heroicons-chevron-right-20-solid"
   }
 };

package/dist/runtime/ui.config/navigation/commandPalette.d.ts

@@ -65,7 +65,7 @@ declare const _default: {
             label: string;
             queryLabel: string;
         };
-        closeButton: null;
+        closeButton: any;
         selectedIcon: string;
     };
 };

package/dist/runtime/ui.config/navigation/tabs.d.ts

@@ -28,6 +28,7 @@ declare const _default: {
             font: string;
             rounded: string;
             shadow: string;
+            icon: string;
         };
     };
 };

package/dist/runtime/ui.config/navigation/{tabs.mjs → tabs.js}

@@ -27,7 +27,8 @@ export default {
       size: "text-sm",
       font: "font-medium",
       rounded: "rounded-md",
-      shadow: ""
+      shadow: "",
+      icon: "w-4 h-4 flex-shrink-0 mr-2"
     }
   }
 };

package/dist/runtime/ui.config/overlays/{contextMenu.mjs → contextMenu.js}

@@ -1,4 +1,4 @@
-import { arrow } from "../popper.mjs";
+import { arrow } from "../popper.js";
 export default {
   wrapper: "relative",
   container: "z-20 group",

package/dist/runtime/ui.config/overlays/{modal.mjs → modal.js}

@@ -8,7 +8,7 @@ export default {
   overlay: {
     base: "fixed inset-0 transition-opacity",
     background: "bg-gray-200/75 dark:bg-gray-800/75",
-    // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
+    // Syntax for `<TransitionRoot>` component https://headlessui.com/v1/vue/transition#basic-example
     transition: {
       enter: "ease-out duration-300",
       enterFrom: "opacity-0",
@@ -25,7 +25,7 @@ export default {
   width: "w-full sm:max-w-lg",
   height: "",
   fullscreen: "w-screen h-screen",
-  // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
+  // Syntax for `<TransitionRoot>` component https://headlessui.com/v1/vue/transition#basic-example
   transition: {
     enter: "ease-out duration-300",
     enterFrom: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",

package/dist/runtime/ui.config/overlays/notification.d.ts

@@ -33,7 +33,7 @@ declare const _default: {
     };
     default: {
         color: string;
-        icon: null;
+        icon: any;
         timeout: number;
         closeButton: {
             icon: string;

package/dist/runtime/ui.config/overlays/{popover.mjs → popover.js}

@@ -1,4 +1,4 @@
-import { arrow } from "../popper.mjs";
+import { arrow } from "../popper.js";
 export default {
   wrapper: "relative",
   container: "z-50 group",

package/dist/runtime/ui.config/overlays/{slideover.mjs → slideover.js}

@@ -3,7 +3,7 @@ export default {
   overlay: {
     base: "fixed inset-0 transition-opacity",
     background: "bg-gray-200/75 dark:bg-gray-800/75",
-    // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
+    // Syntax for `<TransitionRoot>` component https://headlessui.com/v1/vue/transition#basic-example
     transition: {
       enter: "ease-in-out duration-500",
       enterFrom: "opacity-0",
@@ -28,7 +28,7 @@ export default {
     top: "-translate-y-full",
     bottom: "translate-y-full"
   },
-  // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
+  // Syntax for `<TransitionRoot>` component https://headlessui.com/v1/vue/transition#basic-example
   transition: {
     enter: "transform transition ease-in-out duration-300",
     leave: "transform transition ease-in-out duration-200"

package/dist/runtime/ui.config/overlays/{tooltip.mjs → tooltip.js}

@@ -1,4 +1,4 @@
-import { arrow } from "../popper.mjs";
+import { arrow } from "../popper.js";
 export default {
   wrapper: "relative inline-flex",
   container: "z-20 group",

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

@@ -2,8 +2,8 @@ import type { Config as TWConfig } from 'tailwindcss';
 import defaultColors from 'tailwindcss/colors.js';
 type ColorConfig = Exclude<TWConfig['theme']['colors'], Function>;
 export declare const excludeColors: (colors: ColorConfig | typeof defaultColors) => string[];
-export declare const setGlobalColors: (theme: TWConfig['theme']) => string[];
-export declare const generateSafelist: (colors: string[], globalColors: string[]) => any[];
+export declare const setGlobalColors: (theme: TWConfig["theme"]) => string[];
+export declare const generateSafelist: (colors: string[], globalColors: string[]) => import("tailwindcss/types/config").SafelistConfig[];
 type SafelistFn = Exclude<NonNullable<Extract<TWConfig['content'], {
     extract?: unknown;
 }>['extract']>, Record<string, unknown>>;

package/dist/runtime/utils/{colors.mjs → colors.js}

@@ -1,4 +1,4 @@
-import { omit } from "./lodash.mjs";
+import { omit } from "./lodash.js";
 import { kebabCase, camelCase, upperFirst } from "scule";
 import defaultColors from "tailwindcss/colors.js";
 const colorsToExclude = [

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

@@ -1,11 +1,11 @@
-import type { Strategy } from '../types';
+import type { Strategy } from '../types.js';
 export declare function mergeConfig<T>(strategy: Strategy, ...configs: any[]): T;
-export declare function hexToRgb(hex: string): string | null;
+export declare function hexToRgb(hex: string): string;
 export declare function getSlotsChildren(slots: any): any;
 /**
  * "123-foo" will be parsed to 123
  * This is used for the .number modifier in v-model
  */
 export declare function looseToNumber(val: any): any;
-export * from './lodash';
-export * from './link';
+export * from './lodash.js';
+export * from './link.js';

package/dist/runtime/utils/{index.mjs → index.js}

@@ -63,5 +63,5 @@ export function looseToNumber(val) {
   const n = parseFloat(val);
   return isNaN(n) ? val : n;
 }
-export * from "./lodash.mjs";
-export * from "./link.mjs";
+export * from "./lodash.js";
+export * from "./link.js";

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

@@ -1,68 +1,70 @@
 import type { PropType } from 'vue';
+import type { RouteLocationRaw } from '#vue-router';
+import type { NuxtLinkProps } from '#app';
 export declare const nuxtLinkProps: {
     readonly to: {
         readonly type: PropType<RouteLocationRaw>;
-        readonly default: undefined;
+        readonly default: any;
         readonly required: false;
     };
     readonly href: {
         readonly type: PropType<RouteLocationRaw>;
-        readonly default: undefined;
+        readonly default: any;
         readonly required: false;
     };
     readonly target: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["target"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly rel: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["rel"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly noRel: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["noRel"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly prefetch: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["prefetch"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly noPrefetch: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["noPrefetch"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly activeClass: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["activeClass"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly exactActiveClass: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["exactActiveClass"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly prefetchedClass: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["prefetchedClass"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly replace: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["replace"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly ariaCurrentValue: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["ariaCurrentValue"]>;
+        readonly default: any;
         readonly required: false;
     };
     readonly external: {
-        readonly type: PropType<NuxtLinkProps>;
-        readonly default: undefined;
+        readonly type: PropType<NuxtLinkProps["external"]>;
+        readonly default: any;
         readonly required: false;
     };
 };

package/dist/runtime/utils/{link.mjs → link.js}

@@ -114,7 +114,7 @@ export const getNuxtLinkProps = (props) => {
   }, {});
 };
 export const getULinkProps = (props) => {
-  const keys = [...Object.keys(nuxtLinkProps), ...Object.keys(uLinkProps)];
+  const keys = [...Object.keys(nuxtLinkProps), ...Object.keys(uLinkProps), "ariaLabel"];
   return keys.reduce((acc, key) => {
     if (props[key] !== void 0) {
       acc[key] = props[key];

package/dist/types.d.mts

@@ -1,16 +1 @@
-
-import type { ModuleOptions } from './module.js'
-
-
-declare module '@nuxt/schema' {
-  interface NuxtConfig { ['ui']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['ui']?: ModuleOptions }
-}
-
-declare module 'nuxt/schema' {
-  interface NuxtConfig { ['ui']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['ui']?: ModuleOptions }
-}
-
-
-export type { accordion, alert, avatar, avatarGroup, badge, breadcrumb, button, buttonGroup, card, carousel, checkbox, chip, commandPalette, container, contextMenu, divider, dropdown, formGroup, horizontalNavigation, input, inputMenu, kbd, meter, meterGroup, modal, notification, notifications, pagination, popover, progress, radio, radioGroup, range, select, selectMenu, skeleton, slideover, table, tabs, textarea, toggle, tooltip, verticalNavigation } from './module.js'
+export { type ModuleOptions, default } from './module.js'

package/dist/types.d.ts

@@ -1,16 +1 @@
-
-import type { ModuleOptions } from './module'
-
-
-declare module '@nuxt/schema' {
-  interface NuxtConfig { ['ui']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['ui']?: ModuleOptions }
-}
-
-declare module 'nuxt/schema' {
-  interface NuxtConfig { ['ui']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['ui']?: ModuleOptions }
-}
-
-
-export type { accordion, alert, avatar, avatarGroup, badge, breadcrumb, button, buttonGroup, card, carousel, checkbox, chip, commandPalette, container, contextMenu, divider, dropdown, formGroup, horizontalNavigation, input, inputMenu, kbd, meter, meterGroup, modal, notification, notifications, pagination, popover, progress, radio, radioGroup, range, select, selectMenu, skeleton, slideover, table, tabs, textarea, toggle, tooltip, verticalNavigation } from './module'
+export { type ModuleOptions, default } from './module'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nuxt/ui",
-  "version": "2.17.0",
-  "packageManager": "pnpm@9.1.1",
+  "version": "2.18.1",
+  "packageManager": "pnpm@9.5.0",
   "repository": "nuxt/ui",
   "homepage": "https://ui.nuxt.com",
   "type": "module",
@@ -34,13 +34,13 @@
     "test": "vitest"
   },
   "dependencies": {
-    "@egoist/tailwindcss-icons": "^1.8.1",
     "@headlessui/tailwindcss": "^0.2.1",
     "@headlessui/vue": "^1.7.22",
-    "@iconify-json/heroicons": "^1.1.21",
-    "@nuxt/kit": "^3.12.1",
-    "@nuxtjs/color-mode": "^3.4.1",
-    "@nuxtjs/tailwindcss": "^6.12.0",
+    "@iconify-json/heroicons": "^1.1.22",
+    "@nuxt/icon": "^1.2.1",
+    "@nuxt/kit": "^3.12.4",
+    "@nuxtjs/color-mode": "^3.4.2",
+    "@nuxtjs/tailwindcss": "^6.12.1",
     "@popperjs/core": "^2.11.8",
     "@tailwindcss/aspect-ratio": "^0.4.2",
     "@tailwindcss/container-queries": "^0.1.1",
@@ -51,37 +51,35 @@
     "@vueuse/math": "^10.11.0",
     "defu": "^6.1.4",
     "fuse.js": "^6.6.2",
-    "nuxt-icon": "^0.6.10",
     "ohash": "^1.1.3",
     "pathe": "^1.1.2",
     "scule": "^1.3.0",
-    "tailwind-merge": "^2.3.0",
-    "tailwindcss": "^3.4.4"
+    "tailwind-merge": "^2.4.0",
+    "tailwindcss": "^3.4.6"
   },
   "devDependencies": {
     "@nuxt/eslint-config": "^0.3.13",
-    "@nuxt/module-builder": "^0.5.5",
+    "@nuxt/module-builder": "^0.8.1",
     "@nuxt/test-utils": "^3.13.1",
     "@release-it/conventional-changelog": "^8.0.1",
     "@vue/test-utils": "^2.4.6",
     "eslint": "^8.57.0",
-    "happy-dom": "^14.10.1",
-    "joi": "^17.13.1",
-    "nuxt": "^3.12.1",
-    "release-it": "^17.3.0",
-    "typescript": "^5.4.5",
+    "happy-dom": "^14.12.3",
+    "joi": "^17.13.3",
+    "nuxt": "^3.12.4",
+    "release-it": "^17.6.0",
     "unbuild": "^2.0.0",
+    "valibot": "^0.36.0",
     "valibot30": "npm:valibot@0.30.0",
-    "valibot": "^0.31.1",
-    "vitest": "^1.6.0",
+    "valibot31": "npm:valibot@0.31.0",
+    "vitest": "^2.0.3",
     "vitest-environment-nuxt": "^1.0.0",
-    "vue-tsc": "^2.0.16",
+    "vue-tsc": "^2.0.29",
     "yup": "^1.4.0",
     "zod": "^3.23.8"
   },
   "resolutions": {
     "@nuxt/ui": "workspace:*",
-    "@nuxt/module-builder": "0.5.5",
-    "vue-tsc": "2.0.16"
+    "nuxt-component-meta": "0.6.4"
   }
 }

package/dist/runtime/composables/useFormGroup.mjs

@@ -1,45 +0,0 @@
-import { inject, ref, computed } from "vue";
-import { useDebounceFn } from "@vueuse/core";
-export const useFormGroup = (inputProps, config) => {
-  const formBus = inject("form-events", void 0);
-  const formGroup = inject("form-group", void 0);
-  const formInputs = inject("form-inputs", void 0);
-  if (formGroup) {
-    if (inputProps?.id) {
-      formGroup.inputId.value = inputProps?.id;
-    }
-    if (formInputs) {
-      formInputs.value[formGroup.name.value] = formGroup.inputId.value;
-    }
-  }
-  const blurred = ref(false);
-  function emitFormEvent(type, path) {
-    if (formBus) {
-      formBus.emit({ type, path });
-    }
-  }
-  function emitFormBlur() {
-    emitFormEvent("blur", formGroup?.name.value);
-    blurred.value = true;
-  }
-  function emitFormChange() {
-    emitFormEvent("change", formGroup?.name.value);
-  }
-  const emitFormInput = useDebounceFn(() => {
-    if (blurred.value || formGroup?.eagerValidation.value) {
-      emitFormEvent("input", formGroup?.name.value);
-    }
-  }, 300);
-  return {
-    inputId: computed(() => inputProps?.id ?? formGroup?.inputId.value),
-    name: computed(() => inputProps?.name ?? formGroup?.name.value),
-    size: computed(() => {
-      const formGroupSize = config.size[formGroup?.size.value] ? formGroup?.size.value : null;
-      return inputProps?.size ?? formGroupSize ?? config?.default?.size;
-    }),
-    color: computed(() => formGroup?.error?.value ? "red" : inputProps?.color),
-    emitFormBlur,
-    emitFormInput,
-    emitFormChange
-  };
-};