@nuxt/ui 2.17.0 → 2.18.0

package/dist/runtime/components/forms/FormGroup.vue.d.ts

@@ -1,22 +1,47 @@
 import type { Ref, PropType } from 'vue';
-import type { FormGroupSize } from '../../types';
+import type { FormGroupSize, Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    inner: string;
+    label: {
+        wrapper: string;
+        base: string;
+        required: string;
+    };
+    size: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    container: string;
+    description: string;
+    hint: string;
+    help: string;
+    error: string;
+    default: {
+        size: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     size: {
         type: PropType<FormGroupSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     label: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     description: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
@@ -24,22 +49,24 @@ declare const _default: import("vue").DefineComponent<{
     };
     help: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     error: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: null;
+        type: (BooleanConstructor | StringConstructor)[];
+        default: any;
     };
     hint: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     eagerValidation: {
@@ -47,30 +74,54 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        inner: string;
+        label: {
+            wrapper: string;
+            base: string;
+            required: string;
+        };
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        container: string;
+        description: string;
+        hint: string;
+        help: string;
+        error: string;
+        default: {
+            size: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
-    inputId: Ref<any>;
+    inputId: Ref<string>;
     size: import("vue").ComputedRef<any>;
-    error: import("vue").ComputedRef<string | boolean | undefined>;
+    error: import("vue").ComputedRef<string | boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     size: {
         type: PropType<FormGroupSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     label: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     description: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
@@ -78,22 +129,24 @@ declare const _default: import("vue").DefineComponent<{
     };
     help: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     error: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: null;
+        type: (BooleanConstructor | StringConstructor)[];
+        default: any;
     };
     hint: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     eagerValidation: {
@@ -101,15 +154,15 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }>>, {
+    error: string | boolean;
     size: FormGroupSize;
-    name: string;
-    required: boolean;
+    ui: {};
     label: string;
     class: any;
-    ui: any;
-    help: string;
     description: string;
-    error: string | boolean;
+    name: string;
+    required: boolean;
+    help: string;
     hint: string;
     eagerValidation: boolean;
 }, {}>;

package/dist/runtime/components/forms/Input.vue

@@ -34,7 +34,7 @@
 <script>
 import { ref, computed, toRef, onMounted, defineComponent } from "vue";
 import { twMerge, twJoin } from "tailwind-merge";
-import UIcon from "../elements/Icon.vue";
+import { UIcon } from "#components";
 import { defu } from "defu";
 import { useUI } from "../../composables/useUI";
 import { useFormGroup } from "../../composables/useFormGroup";
@@ -163,7 +163,7 @@ export default defineComponent({
     const { ui, attrs } = useUI("input", toRef(props, "ui"), config, toRef(props, "class"));
     const { size: sizeButtonGroup, rounded } = useInjectButtonGroup({ ui, props });
     const { emitFormBlur, emitFormInput, size: sizeFormGroup, color, inputId, name } = useFormGroup(props, config);
-    const size = computed(() => sizeButtonGroup.value || sizeFormGroup.value);
+    const size = computed(() => sizeButtonGroup.value ?? sizeFormGroup.value);
     const modelModifiers = ref(defu({}, props.modelModifiers, { trim: false, lazy: false, number: false }));
     const input2 = ref(null);
     const autoFocus = () => {

package/dist/runtime/components/forms/Input.vue.d.ts

@@ -1,8 +1,117 @@
 import type { PropType } from 'vue';
-import type { InputSize, InputVariant } from '../../types';
+import type { InputSize, InputColor, InputVariant, Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    base: string;
+    form: string;
+    rounded: string;
+    placeholder: string;
+    file: {
+        base: string;
+    };
+    size: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    gap: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    padding: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    leading: {
+        padding: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+    };
+    trailing: {
+        padding: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+    };
+    color: {
+        white: {
+            outline: string;
+        };
+        gray: {
+            outline: string;
+        };
+    };
+    variant: {
+        outline: string;
+        none: string;
+    };
+    icon: {
+        base: string;
+        color: string;
+        loading: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        leading: {
+            wrapper: string;
+            pointer: string;
+            padding: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+        };
+        trailing: {
+            wrapper: string;
+            pointer: string;
+            padding: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+        };
+    };
+    default: {
+        size: string;
+        color: string;
+        variant: string;
+        loadingIcon: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     modelValue: {
-        type: (StringConstructor | NumberConstructor)[];
+        type: (NumberConstructor | StringConstructor)[];
         default: string;
     };
     type: {
@@ -11,15 +120,15 @@ declare const _default: import("vue").DefineComponent<{
     };
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     placeholder: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
@@ -39,19 +148,19 @@ declare const _default: import("vue").DefineComponent<{
     };
     icon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     loadingIcon: {
         type: StringConstructor;
-        default: () => any;
+        default: () => string;
     };
     leadingIcon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     trailingIcon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     trailing: {
         type: BooleanConstructor;
@@ -71,54 +180,164 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<InputSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<InputColor>;
+        default: () => string;
         validator(value: string): boolean;
     };
     variant: {
         type: PropType<InputVariant>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     modelModifiers: {
         type: PropType<{
-            trim?: boolean | undefined;
-            lazy?: boolean | undefined;
-            number?: boolean | undefined;
+            trim?: boolean;
+            lazy?: boolean;
+            number?: boolean;
         }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        base: string;
+        form: string;
+        rounded: string;
+        placeholder: string;
+        file: {
+            base: string;
+        };
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        gap: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        padding: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        leading: {
+            padding: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+        };
+        trailing: {
+            padding: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+        };
+        color: {
+            white: {
+                outline: string;
+            };
+            gray: {
+                outline: string;
+            };
+        };
+        variant: {
+            outline: string;
+            none: string;
+        };
+        icon: {
+            base: string;
+            color: string;
+            loading: string;
+            size: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+            leading: {
+                wrapper: string;
+                pointer: string;
+                padding: {
+                    '2xs': string;
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                };
+            };
+            trailing: {
+                wrapper: string;
+                pointer: string;
+                padding: {
+                    '2xs': string;
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                };
+            };
+        };
+        default: {
+            size: string;
+            color: string;
+            variant: string;
+            loadingIcon: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
-    name: import("vue").ComputedRef<string | undefined>;
-    inputId: import("vue").ComputedRef<string | undefined>;
-    input: import("vue").Ref<HTMLInputElement | null>;
+    name: import("vue").ComputedRef<string>;
+    inputId: import("vue").ComputedRef<string>;
+    input: import("vue").Ref<HTMLInputElement>;
     isLeading: import("vue").ComputedRef<string | true>;
     isTrailing: import("vue").ComputedRef<string | true>;
     inputClass: import("vue").ComputedRef<string>;
-    leadingIconName: import("vue").ComputedRef<string | undefined>;
+    leadingIconName: import("vue").ComputedRef<string>;
     leadingIconClass: import("vue").ComputedRef<string>;
     leadingWrapperIconClass: import("vue").ComputedRef<string>;
-    trailingIconName: import("vue").ComputedRef<string | undefined>;
+    trailingIconName: import("vue").ComputedRef<string>;
     trailingIconClass: import("vue").ComputedRef<string>;
     trailingWrapperIconClass: import("vue").ComputedRef<string>;
     onInput: (event: Event) => void;
@@ -126,7 +345,7 @@ declare const _default: import("vue").DefineComponent<{
     onBlur: (event: FocusEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("blur" | "change" | "update:modelValue")[], "blur" | "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
-        type: (StringConstructor | NumberConstructor)[];
+        type: (NumberConstructor | StringConstructor)[];
         default: string;
     };
     type: {
@@ -135,15 +354,15 @@ declare const _default: import("vue").DefineComponent<{
     };
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     placeholder: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
@@ -163,19 +382,19 @@ declare const _default: import("vue").DefineComponent<{
     };
     icon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     loadingIcon: {
         type: StringConstructor;
-        default: () => any;
+        default: () => string;
     };
     leadingIcon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     trailingIcon: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     trailing: {
         type: BooleanConstructor;
@@ -195,71 +414,69 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<InputSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<InputColor>;
+        default: () => string;
         validator(value: string): boolean;
     };
     variant: {
         type: PropType<InputVariant>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     modelModifiers: {
         type: PropType<{
-            trim?: boolean | undefined;
-            lazy?: boolean | undefined;
-            number?: boolean | undefined;
+            trim?: boolean;
+            lazy?: boolean;
+            number?: boolean;
         }>;
         default: () => {};
     };
 }>> & {
-    onBlur?: ((...args: any[]) => any) | undefined;
-    onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onBlur?: (...args: any[]) => any;
+    onChange?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
 }, {
     size: InputSize;
-    name: string;
+    ui: {};
     type: string;
-    required: boolean;
+    disabled: boolean;
+    color: InputColor;
+    variant: InputVariant;
+    icon: string;
+    id: string;
     class: any;
     leading: boolean;
-    color: any;
-    variant: InputVariant;
-    disabled: boolean;
-    ui: any;
+    name: string;
+    modelValue: string | number;
+    required: boolean;
     loading: boolean;
     padded: boolean;
-    icon: string;
     loadingIcon: string;
     leadingIcon: string;
     trailingIcon: string;
     trailing: boolean;
-    id: string;
-    modelValue: string | number;
-    inputClass: string;
     placeholder: string;
     autofocus: boolean;
+    inputClass: string;
     autofocusDelay: number;
-    modelModifiers: {
-        trim?: boolean | undefined;
-        lazy?: boolean | undefined;
-        number?: boolean | undefined;
-    };
+    modelModifiers: {};
 }, {}>;
 export default _default;