maz-ui 4.0.0-beta.8 → 4.0.0

package/dist/types/composables/useFormField.d.ts

@@ -1,18 +1,16 @@
-import { BaseFormPayload, ExtractModelKey, FormFieldOptions, FormSchema, ValidationIssues } from './useFormValidator/types';
-import { ComputedRef, Ref } from 'vue';
-import { getValidationEvents } from './useFormValidator/dom-events';
-interface UseFormFieldReturn<FieldType> {
-    hasError: ComputedRef<boolean>;
-    errors: ComputedRef<ValidationIssues>;
-    errorMessage: ComputedRef<string | undefined>;
-    isValid: ComputedRef<boolean>;
-    isDirty: ComputedRef<boolean>;
-    isBlurred: ComputedRef<boolean>;
-    isValidated: ComputedRef<boolean>;
-    isValidating: ComputedRef<boolean>;
-    mode: ComputedRef<FormFieldOptions<FieldType>['mode']>;
-    value: Ref<FieldType>;
-    validationEvents: ComputedRef<ReturnType<typeof getValidationEvents>>;
-}
-export declare function useFormField<FieldType, Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(name: ModelKey, options?: FormFieldOptions<FieldType>): UseFormFieldReturn<FieldType>;
-export {};
+import { BaseFormPayload, ExtractModelKey, FormFieldOptions, FormSchema } from './useFormValidator/types';
+export declare function useFormField<FieldType, Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(name: ModelKey, options?: FormFieldOptions<Model, ModelKey, FieldType>): {
+    hasError: import('vue').ComputedRef<boolean>;
+    errors: import('vue').ComputedRef<import('./useFormValidator/types').ValidationIssues>;
+    errorMessage: import('vue').ComputedRef<Record<ModelKey, string | undefined>[ModelKey]>;
+    isValid: import('vue').ComputedRef<boolean>;
+    isDirty: import('vue').ComputedRef<boolean>;
+    isBlurred: import('vue').ComputedRef<boolean>;
+    isValidated: import('vue').ComputedRef<boolean>;
+    isValidating: import('vue').ComputedRef<boolean>;
+    mode: import('vue').ComputedRef<"blur" | "eager" | "lazy" | "aggressive" | "progressive" | undefined>;
+    value: import('vue').WritableComputedRef<FieldType, FieldType>;
+    validationEvents: import('vue').ComputedRef<{
+        onBlur: () => void;
+    } | undefined>;
+};

package/dist/types/composables/useFormValidator/config.d.ts

@@ -1,6 +1,6 @@
-import { StrictOptions } from './types';
+import { BaseFormPayload, ExtractModelKey, FormSchema, StrictOptions } from './types';
 export declare const CONFIG: {
-    mode: StrictOptions['mode'];
+    mode: StrictOptions<BaseFormPayload, ExtractModelKey<FormSchema<BaseFormPayload>>>['mode'];
     scrollToErrorSelector: string;
     debounceTime: number;
     throttleTime: number;

package/dist/types/composables/useFormValidator/dom-events.d.ts

@@ -1,18 +1,18 @@
-import { BaseFormPayload, FieldState, StrictOptions } from './types';
+import { BaseFormPayload, ExtractModelKey, FieldState, FormSchema, StrictOptions } from './types';
 export declare function scrollToError(selector?: string): void;
 export declare function findInteractiveElements(el: HTMLElement): HTMLElement[];
 export declare function addEventToInteractiveElements({ interactiveElements, onBlur, mode, }: {
     interactiveElements: HTMLElement[];
     onBlur: () => void;
-    mode: StrictOptions['mode'];
+    mode: StrictOptions<BaseFormPayload, ExtractModelKey<FormSchema<BaseFormPayload>>>['mode'];
 }): void;
 export declare function removeEventFromInteractiveElements({ interactiveElements, onBlur, }: {
     interactiveElements: HTMLElement[];
     onBlur: () => void;
 }): void;
-export declare function getValidationEvents<Model extends BaseFormPayload>({ hasRef, fieldState, onBlur, }: {
+export declare function getValidationEvents<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>, F extends FieldState<Model, ModelKey, Model[ModelKey]>>({ hasRef, fieldState, onBlur, }: {
     hasRef?: boolean;
-    fieldState: FieldState<Model>;
+    fieldState: F;
     onBlur: () => void;
 }): {
     onBlur: () => void;

package/dist/types/composables/useFormValidator/state-management.d.ts

@@ -1,54 +1,72 @@
 import { InjectionKey } from 'vue';
 import { BaseFormPayload, CustomInstance, ExtractModelKey, FieldsStates, FieldState, FormContext, FormFieldOptions, FormSchema, StrictOptions } from './types';
-export declare function getFieldState<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, schema, initialValue, fieldState, options, }: {
+export declare function getFieldState<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]>({ name, schema, initialValue, fieldState, options, }: {
     name: ModelKey;
     schema?: FormSchema<Model>;
-    initialValue?: Model[ModelKey];
-    fieldState: FieldState<Model>;
-    options?: Pick<StrictOptions<Model>, 'debouncedFields' | 'throttledFields' | 'mode'>;
-}): FieldState<Model>;
+    initialValue?: FieldType;
+    fieldState: FieldState<Model, ModelKey, FieldType>;
+    options?: Pick<StrictOptions<Model, ModelKey>, 'debouncedFields' | 'throttledFields' | 'mode'>;
+}): FieldState<Model, ModelKey, FieldType>;
 export declare function fieldHasValidation<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>>(field: ModelKey, schema: FormSchema<Model>): boolean;
 export declare function getFieldsStates<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ schema, payload, options, }: {
     schema: FormSchema<Model>;
     payload: Partial<Model>;
-    options: StrictOptions<Model>;
-}): FieldsStates<Model>;
+    options: StrictOptions<Model, ModelKey>;
+}): FieldsStates<Model, ModelKey>;
 export declare function updateFieldsStates<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ fieldsStates, payload, schema, options, updateMode, }: {
-    fieldsStates: FieldsStates<Model>;
+    fieldsStates: FieldsStates<Model, ModelKey>;
     payload: Model;
     schema: FormSchema<Model>;
-    options: StrictOptions<Model>;
+    options: StrictOptions<Model, ModelKey>;
     updateMode?: boolean;
 }): void;
-export declare function updateFieldState<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, fieldState, payload, schema, options, updateMode, }: {
+export declare function updateFieldState<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]>({ name, fieldState, payload, schema, options, updateMode, }: {
     name: ModelKey;
-    fieldState: FieldState<Model>;
+    fieldState: FieldState<Model, ModelKey, FieldType>;
     payload: Model;
     schema: FormSchema<Model>;
-    options: FormFieldOptions<Model[ModelKey]> & StrictOptions<Model>;
+    options: FormFieldOptions<Model, ModelKey, FieldType> & StrictOptions<Model, ModelKey>;
     updateMode?: boolean;
-}): FieldState<Model>;
-export declare function canExecuteValidation<Model extends BaseFormPayload>({ eventName, fieldState, isSubmitted, }: {
+}): {
+    blurred: boolean;
+    dirty: boolean;
+    error: boolean;
+    errors: import('./types').ValidationIssues;
+    valid: boolean;
+    validating: boolean;
+    validated: boolean;
+    validateFunction: ((args_0: {
+        name: ModelKey;
+        fieldState: FieldState<Model, ModelKey, Model[ModelKey]>;
+        schema: FormSchema<Model>;
+        payload: Model;
+        setError?: boolean;
+        setErrorIfInvalidAndNotEmpty?: boolean;
+    }) => Promise<void>) | undefined;
+    initialValue: Readonly<FieldType> | undefined;
+    mode: "blur" | "eager" | "lazy" | "aggressive" | "progressive" | undefined;
+};
+export declare function canExecuteValidation<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]>({ eventName, fieldState, isSubmitted, }: {
     eventName: 'blur' | 'input';
-    fieldState: FieldState<Model>;
+    fieldState: FieldState<Model, ModelKey, FieldType>;
     isSubmitted: boolean;
 }): boolean;
-export declare function handleFieldBlur<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, force, payload, fieldState, schema, isSubmitted, }: {
+export declare function handleFieldBlur<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]>({ name, force, payload, fieldState, schema, isSubmitted, }: {
     name: ModelKey;
     payload: Model;
-    fieldState: FieldState<Model>;
+    fieldState: FieldState<Model, ModelKey, FieldType>;
     schema: FormSchema<Model>;
     isSubmitted: boolean;
     force?: boolean;
 }): Promise<void> | undefined;
-export declare function handleFieldInput<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, payload, fieldState, schema, isSubmitted, forceValidation, }: {
+export declare function handleFieldInput<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]>({ name, payload, fieldState, schema, isSubmitted, forceValidation, }: {
     name: ModelKey;
     payload: Model;
-    fieldState: FieldState<Model>;
+    fieldState: FieldState<Model, ModelKey, FieldType>;
     schema: FormSchema<Model>;
     isSubmitted: boolean;
     forceValidation?: boolean;
 }): Promise<void> | undefined;
-export declare function hasModeIncludes(modes: StrictOptions['mode'][], value?: StrictOptions['mode']): value is StrictOptions['mode'];
-export declare function getInstance<Model extends BaseFormPayload>(composableName: string): CustomInstance<Model>;
-export declare function getContext<Model extends BaseFormPayload>(identifier: string | symbol | InjectionKey<FormContext<Model>>, composableName: string): FormContext<Model, Extract<keyof { [K in Extract<keyof Model, string> as Model[K] extends Required<Model>[K] ? K : never]: import('./types').Validation; }, string> | Extract<keyof { [K_1 in Extract<keyof Model, string> as Model[K_1] extends Required<Model>[K_1] ? never : K_1]?: import('./types').Validation | undefined; }, string>>;
+export declare function hasModeIncludes<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(modes: StrictOptions<Model, ModelKey>['mode'][], value?: StrictOptions<Model, ModelKey>['mode']): value is StrictOptions<Model, ModelKey>['mode'];
+export declare function getInstance<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(composableName: string): CustomInstance<Model, ModelKey>;
+export declare function getContext<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(identifier: string | symbol | InjectionKey<FormContext<Model, ModelKey>>, composableName: string): FormContext<Model, ModelKey>;

package/dist/types/composables/useFormValidator/types.d.ts

@@ -1,16 +1,16 @@
 import { BaseIssue, BaseSchema, BaseSchemaAsync, InferInput, InferIssue, InferOutput, objectAsync } from 'valibot';
-import { ComponentInternalInstance, ComponentPublicInstance, InjectionKey, Ref, TemplateRef } from 'vue';
+import { ComponentInternalInstance, InjectionKey, Ref, TemplateRef } from 'vue';
 import { getValidateFunction } from './validation';
 export type Validation = BaseSchema<unknown, unknown, BaseIssue<unknown>> | BaseSchemaAsync<unknown, unknown, BaseIssue<unknown>>;
 export type ValidationIssues = InferIssue<Validation>[];
 export type ExtractModelKey<T> = Extract<keyof T, string>;
-export type FormSchema<Model = BaseFormPayload> = {
+export type FormSchema<Model extends BaseFormPayload> = {
     [K in Extract<keyof Model, string> as Model[K] extends Required<Model>[K] ? K : never]: Validation;
 } & {
     [K in Extract<keyof Model, string> as Model[K] extends Required<Model>[K] ? never : K]?: Validation;
 };
-export type CustomInstance<Model extends BaseFormPayload> = ComponentInternalInstance & {
-    formContexts?: Map<string | symbol | InjectionKey<FormContext<Model>>, FormContext<Model>>;
+export type CustomInstance<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>> = ComponentInternalInstance & {
+    formContexts?: Map<string | symbol | InjectionKey<FormContext<Model, ModelKey>>, FormContext<Model, ModelKey>>;
 };
 export interface FormValidatorOptions<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>> {
     /**
@@ -48,16 +48,16 @@ export interface FormValidatorOptions<Model extends BaseFormPayload = BaseFormPa
      */
     identifier?: string | symbol;
 }
-export type StrictOptions<Model extends BaseFormPayload = BaseFormPayload> = Required<FormValidatorOptions<Model>>;
-export interface FormContext<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>> {
-    fieldsStates: Ref<FieldsStates<Model>>;
-    options: StrictOptions;
+export type StrictOptions<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>> = Required<FormValidatorOptions<Model, ModelKey>>;
+export interface FormContext<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>> {
+    fieldsStates: Ref<FieldsStates<Model, ModelKey>>;
+    options: StrictOptions<Model, ModelKey>;
     internalSchema: Ref<FormSchema<Model>>;
     payload: Ref<Model>;
     errorMessages: Ref<Record<ModelKey, string | undefined>>;
     isSubmitted: Ref<boolean>;
 }
-export interface FieldState<Model extends BaseFormPayload, FieldType = Model[ExtractModelKey<FormSchema<Model>>]> {
+export interface FieldState<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>, FieldType = Model[ModelKey]> {
     blurred: boolean;
     dirty: boolean;
     error: boolean;
@@ -66,12 +66,12 @@ export interface FieldState<Model extends BaseFormPayload, FieldType = Model[Ext
     initialValue?: Readonly<FieldType>;
     validating: boolean;
     validated: boolean;
-    validateFunction: ReturnType<typeof getValidateFunction<Model>>;
-    mode?: StrictOptions['mode'];
+    validateFunction: ReturnType<typeof getValidateFunction<Model, ModelKey>>;
+    mode?: StrictOptions<Model, ModelKey>['mode'];
 }
-export type FieldsStates<Model extends BaseFormPayload = BaseFormPayload> = Record<ExtractModelKey<Model>, FieldState<Model>>;
+export type FieldsStates<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>> = Record<ModelKey, FieldState<Model, ModelKey, Model[ModelKey]>>;
 export type BaseFormPayload = Record<string, any>;
-export interface FormFieldOptions<FieldType> {
+export interface FormFieldOptions<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>, FieldType> {
     /**
      * Default value of the field
      * @default undefined
@@ -81,12 +81,12 @@ export interface FormFieldOptions<FieldType> {
      * Validation mode
      * To override the form validation mode
      */
-    mode?: StrictOptions['mode'];
+    mode?: StrictOptions<Model, ModelKey>['mode'];
     /**
      * Reference to the component or HTML element to associate and trigger validation events
      * Necessary for 'eager', 'progressive' and 'blur' validation modes
      */
-    ref?: Ref<HTMLElement | ComponentPublicInstance | undefined | null> | TemplateRef<HTMLElement | ComponentPublicInstance | undefined | null>;
+    ref?: Ref | TemplateRef;
     /**
      * Identifier for the form
      * Useful when you have multiple forms on the same component

package/dist/types/composables/useFormValidator/validation.d.ts

@@ -2,40 +2,34 @@ import { BaseFormPayload, ExtractModelKey, FieldsStates, FieldState, FormSchema,
 export declare function isEmptyValue(value: unknown): value is null | undefined | '';
 export declare function getValibotValidationMethod<MethodName extends keyof typeof import('valibot')>(methodName: MethodName): Promise<(typeof import('valibot'))[MethodName]>;
 export declare function getValidationSchema<Model extends BaseFormPayload>(formSchema: FormSchema<Model>): Promise<import('valibot').ObjectSchemaAsync<FormSchema<Model>, undefined>>;
-export declare function getFieldValidationResult<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(name: ModelKey, schema: FormSchema<Model>, value: Model[ModelKey]): Promise<{
+export declare function getFieldValidationResult<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>>(name: ModelKey, schema: FormSchema<Model>, value: Model[ModelKey]): Promise<{
     result: import('valibot').SafeParseResult<FormSchema<Model>[ModelKey]>;
     isValid: boolean;
 }>;
-export declare function setFieldValidationState<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, fieldState, schema, payload, setError, setErrorIfInvalidAndNotEmpty, }: {
+export declare function setFieldValidationState<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>>>({ name, fieldState, schema, payload, setError, setErrorIfInvalidAndNotEmpty, }: {
     name: ModelKey;
-    fieldState: FieldState<Model>;
+    fieldState: FieldState<Model, ModelKey, Model[ModelKey]>;
     schema: FormSchema<Model>;
     payload: Model;
     setError?: boolean;
     setErrorIfInvalidAndNotEmpty?: boolean;
 }): Promise<void>;
-export declare function validateField<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, fieldState, payload, schema, }: {
-    name: ModelKey;
-    fieldState: FieldState<Model>;
-    payload: Model;
-    schema: FormSchema<Model>;
-}): Promise<void> | undefined;
 export declare function validateForm<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ fieldsStates, payload, setErrors, schema, }: {
-    fieldsStates: FieldsStates<Model>;
+    fieldsStates: FieldsStates<Model, ExtractModelKey<FormSchema<Model>>>;
     setErrors?: boolean;
     payload: Model;
     schema: FormSchema<Model>;
 }): Promise<void[]>;
-export declare function getErrorMessages<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(errors: Record<ModelKey, ValidationIssues>, fieldsStates: FieldsStates<Model>): Record<ModelKey, string | undefined>;
-export declare function getFieldsErrors<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(fieldsStates: FieldsStates<Model>): Record<ModelKey, ValidationIssues>;
+export declare function getErrorMessages<Model extends BaseFormPayload = BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(errors: Record<ModelKey, ValidationIssues>, fieldsStates: FieldsStates<Model, ExtractModelKey<FormSchema<Model>>>): Record<ModelKey, string | undefined>;
+export declare function getFieldsErrors<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>(fieldsStates: FieldsStates<Model, ExtractModelKey<FormSchema<Model>>>): Record<ModelKey, ValidationIssues>;
 export declare function getValidateFunction<Model extends BaseFormPayload, ModelKey extends ExtractModelKey<FormSchema<Model>> = ExtractModelKey<FormSchema<Model>>>({ name, hasValidation, debouncedFields, throttledFields, }: {
     name: ModelKey;
     hasValidation: boolean;
-    debouncedFields?: StrictOptions<Model>['debouncedFields'];
-    throttledFields?: StrictOptions<Model>['throttledFields'];
+    debouncedFields?: StrictOptions<Model, ModelKey>['debouncedFields'];
+    throttledFields?: StrictOptions<Model, ModelKey>['throttledFields'];
 }): ((args_0: {
-    name: ExtractModelKey<FormSchema<Model>>;
-    fieldState: FieldState<Model, Model[Extract<keyof { [K in Extract<keyof Model, string> as Model[K] extends Required<Model>[K] ? K : never]: import('./types').Validation; }, string> | Extract<keyof { [K_1 in Extract<keyof Model, string> as Model[K_1] extends Required<Model>[K_1] ? never : K_1]?: import('./types').Validation | undefined; }, string>]>;
+    name: ModelKey;
+    fieldState: FieldState<Model, ModelKey, Model[ModelKey]>;
     schema: FormSchema<Model>;
     payload: Model;
     setError?: boolean;

package/dist/types/composables/useFormValidator.d.ts

@@ -1,4 +1,4 @@
-import { DeepPartial } from '@maz-ui/utils/src/ts-helpers/DeepPartial.js';
+import { DeepPartial } from '@maz-ui/utils/ts-helpers/DeepPartial';
 import { MaybeRefOrGetter, Ref } from 'vue';
 import { BaseFormPayload, ExtractModelKey, FieldsStates, FormSchema, FormValidatorOptions, InferOutputSchemaFormValidator, InferSchemaFormValidator } from './useFormValidator/types';
 import { scrollToError } from './useFormValidator/dom-events';
@@ -15,7 +15,7 @@ export declare function useFormValidator<TSchema extends MaybeRefOrGetter<FormSc
     isValid: import('vue').ComputedRef<boolean>;
     errors: import('vue').ComputedRef<Record<ExtractModelKey<FormSchema<InferSchemaFormValidator<TSchema>>>, import('./useFormValidator/types').ValidationIssues>>;
     model: Ref<InferSchemaFormValidator<TSchema>, InferSchemaFormValidator<TSchema>>;
-    fieldsStates: Ref<FieldsStates<InferSchemaFormValidator<TSchema>>, FieldsStates<InferSchemaFormValidator<TSchema>>>;
+    fieldsStates: Ref<FieldsStates<InferSchemaFormValidator<TSchema>, ExtractModelKey<FormSchema<InferSchemaFormValidator<TSchema>>>>, FieldsStates<InferSchemaFormValidator<TSchema>, ExtractModelKey<FormSchema<InferSchemaFormValidator<TSchema>>>>>;
     validateForm: (setErrors?: boolean) => Promise<void[]>;
     scrollToError: typeof scrollToError;
     handleSubmit: <Func extends (model: InferOutputSchemaFormValidator<TSchema>) => Promise<Awaited<ReturnType<Func>>> | ReturnType<Func>>(successCallback: Func, enableScrollOrSelector?: FormValidatorOptions["scrollToError"]) => (event?: Event) => Promise<ReturnType<Func> | undefined>;

package/dist/types/composables/useIdleTimeout.d.ts

@@ -1,4 +1,4 @@
-import { IdleTimeoutCallback, IdleTimeoutOptions, IdleTimeout } from '@maz-ui/utils/src/helpers/idleTimeout.js';
+import { IdleTimeoutCallback, IdleTimeoutOptions, IdleTimeout } from '@maz-ui/utils/helpers/idleTimeout';
 export declare function useIdleTimeout({ callback, options, }: {
     callback: IdleTimeoutCallback;
     options?: IdleTimeoutOptions;

package/dist/types/composables/useSwipe.d.ts

@@ -1,4 +1,4 @@
-import { SwipeOptions } from '@maz-ui/utils/src/helpers/swipeHandler.js';
+import { SwipeOptions } from '@maz-ui/utils/helpers/swipeHandler';
 import { MaybeRef } from 'vue';
 export declare function useSwipe(options: Omit<SwipeOptions, 'onValuesChanged' | 'element'> & {
     element: MaybeRef<HTMLElement> | string | null | undefined;

package/dist/types/composables/useUserVisibility.d.ts

@@ -1,4 +1,4 @@
-import { UserVisibility, UserVisibilyCallback, UserVisibilyOptions } from '@maz-ui/utils/src/helpers/userVisibility.js';
+import { UserVisibilyCallback, UserVisibilyOptions, UserVisibility } from '@maz-ui/utils/helpers/userVisibility';
 export declare function useUserVisibility({ callback, options, }: {
     callback: UserVisibilyCallback;
     options?: UserVisibilyOptions;

package/dist/types/directives/vFullscreenImg/MazFullscreenImg.vue.d.ts

@@ -29,13 +29,12 @@ declare const _default: import('vue').DefineComponent<MazFullscreenImgProps, {},
     onPrevious?: ((...args: any[]) => any) | undefined;
 }>, {
     destroy: () => void;
+    offset: number;
     animation: {
         duration?: number;
         easing?: string;
     };
     alt: string | null;
-    offset: number;
-    zoom: boolean;
     clickedElementBounds: {
         top: number;
         left: number;
@@ -43,6 +42,7 @@ declare const _default: import('vue').DefineComponent<MazFullscreenImgProps, {},
         width: number;
     };
     openInstanceClass: string;
+    zoom: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     FullscreenImgElement: HTMLDivElement;
     ImgElement: HTMLImageElement;

package/dist/types/directives/vZoomImg.d.ts

@@ -1,5 +1,5 @@
 import { Plugin } from 'vue';
-import { vZoomImg, VZoomImgDirective } from './vZoomImg/zoom-img.directive';
+import { VZoomImgDirective, vZoomImg } from './vZoomImg/zoom-img.directive';
 declare const plugin: Plugin;
 export { vZoomImg, type VZoomImgDirective, plugin as vZoomImgInstall };
 export type { VZoomImgBindingValue } from './vZoomImg/zoom-img.handler';

package/dist/types/plugins/maz-ui.d.ts

@@ -1,17 +1,17 @@
+import { MazUiThemeOptions } from '@maz-ui/themes/plugin';
+import { MazUiTranslationsOptions } from '@maz-ui/translations';
 import { Plugin } from 'vue';
-import { MazUiThemeOptions } from '@maz-ui/themes/src/plugin.js';
-import { MazTranslationsOptions } from '@maz-ui/translations/src/index.js';
 export interface MazUiOptions {
     /**
      * The theme configurations
      * Can not be disabled
      */
-    theme?: MazUiThemeOptions;
+    theme: MazUiThemeOptions;
     /**
      * The translations configurations
      * Can not be disabled
      */
-    translations?: MazTranslationsOptions;
+    translations?: MazUiTranslationsOptions;
 }
 /**
  * @example
@@ -40,4 +40,4 @@ export interface MazUiOptions {
  * })
  * ```
  */
-export declare const MazUi: Plugin<[MazUiOptions?]>;
+export declare const MazUi: Plugin<[MazUiOptions]>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "maz-ui",
   "type": "module",
-  "version": "4.0.0-beta.8",
+  "version": "4.0.0",
   "description": "A standalone components library for Vue.Js 3 & Nuxt.Js 3",
   "author": "Louis Mazel <me@loicmazuel.com>",
   "license": "MIT",
@@ -28,10 +28,7 @@
   ],
   "sideEffects": [
     "*.css",
-    "./dist/css/**",
-    "./dist/**/plugins/**",
-    "./dist/**/directives/**",
-    "./dist/**/composables/useToast*"
+    "./dist/css/**"
   ],
   "exports": {
     ".": {
@@ -64,12 +61,6 @@
       "module": "./dist/directives/index.js",
       "default": "./dist/directives/index.js"
     },
-    "./resolvers": {
-      "types": "./dist/types/resolvers/index.d.ts",
-      "import": "./dist/resolvers/index.js",
-      "module": "./dist/resolvers/index.js",
-      "default": "./dist/resolvers/index.js"
-    },
     "./components/*": {
       "types": "./dist/types/components/*.vue.d.ts",
       "import": "./dist/components/*.js",
@@ -94,6 +85,12 @@
       "module": "./dist/directives/*.js",
       "default": "./dist/directives/*.js"
     },
+    "./resolvers": {
+      "types": "./dist/types/resolvers/index.d.ts",
+      "import": "./dist/resolvers/index.js",
+      "module": "./dist/resolvers/index.js",
+      "default": "./dist/resolvers/index.js"
+    },
     "./resolvers/*": {
       "types": "./dist/types/resolvers/*.d.ts",
       "import": "./dist/resolvers/*.js",
@@ -118,6 +115,18 @@
       "module": "./dist/tailwindcss/*.js",
       "default": "./dist/tailwindcss/*.js"
     },
+    "./themes": {
+      "types": "./dist/types/themes.d.ts",
+      "import": "./dist/themes.js",
+      "module": "./dist/themes.js",
+      "default": "./dist/themes.js"
+    },
+    "./translations": {
+      "types": "./dist/types/translations.d.ts",
+      "import": "./dist/translations.js",
+      "module": "./dist/translations.js",
+      "default": "./dist/translations.js"
+    },
     "./styles": "./dist/css/main.css",
     "./aos-styles": "./dist/css/aos.css",
     "./*": "./*"
@@ -165,7 +174,7 @@
     "typecheck": "vue-tsc --noEmit --skipLibCheck"
   },
   "peerDependencies": {
-    "nuxt": "^3.4.0",
+    "nuxt": ">=3.4.0 <5.0.0",
     "unplugin-auto-import": ">=19.0.0 <20.0.0",
     "unplugin-vue-components": ">=28.0.0 <29.0.0",
     "vue": "^3.5.0",
@@ -186,59 +195,60 @@
     }
   },
   "dependencies": {
-    "@maz-ui/cli": "4.0.0-beta.8",
-    "@maz-ui/icons": "4.0.0-beta.8",
-    "@maz-ui/themes": "4.0.0-beta.8",
-    "@maz-ui/translations": "4.0.0-beta.8",
-    "@maz-ui/utils": "4.0.0-beta.8",
+    "@floating-ui/vue": "^1.1.8",
+    "@maz-ui/cli": "4.0.0",
+    "@maz-ui/icons": "4.0.0",
+    "@maz-ui/themes": "4.0.0",
+    "@maz-ui/translations": "4.0.0",
+    "@maz-ui/utils": "4.0.0",
     "chart.js": "^4.5.0",
     "dayjs": "^1.11.13",
-    "libphonenumber-js": "^1.12.9",
+    "libphonenumber-js": "^1.12.10",
     "valibot": "^1.1.0",
     "vue-chartjs": "^5.3.2"
   },
   "devDependencies": {
-    "@maz-ui/eslint-config": "4.0.0-beta.8",
-    "@maz-ui/node": "4.0.0-beta.8",
-    "@vitejs/plugin-vue": "^5.2.4",
+    "@maz-ui/eslint-config": "4.0.0",
+    "@maz-ui/node": "4.0.0",
+    "@vitejs/plugin-vue": "^6.0.1",
     "@vitest/coverage-v8": "^3.2.4",
-    "@vue/compiler-sfc": "^3.5.16",
+    "@vue/compiler-sfc": "^3.5.18",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.7.0",
     "autoprefixer": "^10.4.21",
     "glob": "^11.0.3",
     "jsdom": "^26.1.0",
     "lightningcss": "^1.30.1",
-    "nuxt": "^3.17.5",
+    "nuxt": "^4.0.3",
     "postcss": "^8.5.6",
     "postcss-html": "^1.8.0",
-    "postcss-import": "^16.1.0",
+    "postcss-import": "^16.1.1",
     "postcss-nested": "^7.0.2",
     "postcss-replace": "^2.0.1",
     "postcss-url": "^10.1.3",
-    "sass": "^1.89.1",
-    "stylelint": "^16.20.0",
-    "stylelint-config-recommended-vue": "^1.6.0",
-    "stylelint-config-standard": "^38.0.0",
+    "sass": "^1.90.0",
+    "stylelint": "^16.23.1",
+    "stylelint-config-recommended-vue": "^1.6.1",
+    "stylelint-config-standard": "^39.0.0",
     "stylelint-config-standard-scss": "^15.0.1",
     "stylelint-config-tailwindcss": "^1.0.0",
     "stylelint-scss": "^6.12.0",
     "tailwindcss": "^3.4.16",
-    "typescript": "~5.8.3",
-    "unplugin-auto-import": "^19.3.0",
-    "unplugin-vue-components": "^28.7.0",
-    "vite": "^6.3.5",
+    "typescript": "~5.9.2",
+    "unplugin-auto-import": "^20.0.0",
+    "unplugin-vue-components": "^29.0.0",
+    "vite": "^7.1.1",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
     "vite-svg-loader": "^5.1.0",
     "vitest": "^3.2.4",
-    "vue": "^3.5.17",
+    "vue": "^3.5.18",
     "vue-router": "^4.5.1",
-    "vue-tsc": "^2.2.10"
+    "vue-tsc": "^3.0.5"
   },
   "lint-staged": {
-    "*.{js,ts,vue,mjs,mts,cjs,md}": "cross-env NODE_ENV=production eslint --fix",
+    "*.{js,ts,vue,mjs,mts,cjs,md,yml,json}": "cross-env NODE_ENV=production eslint --fix",
     "*.{vue,css,scss,postcss,pcss}": "stylelint --fix --allow-empty-input"
   },
-  "gitHead": "fef4d097f7e992f20980cc628216f070a516644e"
+  "gitHead": "b2e03a043ad3334ed5ce456c7f0e67c728c09524"
 }

package/dist/assets/MazAnimatedText.DDqCxrFX.css

@@ -1 +0,0 @@
-.m-animated-text__root[data-v-1285ff2b]{flex-wrap:wrap;display:inline-flex}.m-animated-text__word[data-v-1285ff2b],.m-animated-text__word-inner[data-v-1285ff2b],.m-animated-text__last-word[data-v-1285ff2b]{display:inline-flex}.m-animated-text__last-word-inner[data-v-1285ff2b]{display:inline-flex;position:relative}.m-animated-text__last-word-inner-gradient[data-v-1285ff2b]{background-image:linear-gradient(to right,var(--maz-tw-gradient-stops));--maz-tw-gradient-from:hsl(var(--maz-primary)/1)var(--maz-tw-gradient-from-position);--maz-tw-gradient-to:hsl(var(--maz-secondary)/1)var(--maz-tw-gradient-to-position);--maz-tw-gradient-stops:var(--maz-tw-gradient-from),hsl(var(--maz-info)/1)var(--maz-tw-gradient-via-position),var(--maz-tw-gradient-to);opacity:.3;--maz-tw-blur:blur(16px);width:100%;height:100%;filter:var(--maz-tw-blur)var(--maz-tw-brightness)var(--maz-tw-contrast)var(--maz-tw-grayscale)var(--maz-tw-hue-rotate)var(--maz-tw-invert)var(--maz-tw-saturate)var(--maz-tw-sepia)var(--maz-tw-drop-shadow);position:absolute;inset:0}.m-animated-text__last-word-inner-text[data-v-1285ff2b]{position:relative}@keyframes slide-up-blur-1285ff2b{0%{opacity:0;filter:blur(10px);transform:translateY(20px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes slide-down-blur-1285ff2b{0%{opacity:0;filter:blur(10px);transform:translateY(-20px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes slide-left-blur-1285ff2b{0%{opacity:0;filter:blur(10px);transform:translate(20px)}to{opacity:1;filter:blur();transform:translate(0)}}@keyframes slide-right-blur-1285ff2b{0%{opacity:0;filter:blur(10px);transform:translate(-20px)}to{opacity:1;filter:blur();transform:translate(0)}}.maz-animate-slide-up-blur[data-v-1285ff2b]{animation:cubic-bezier(.16,1,.3,1) forwards slide-up-blur-1285ff2b}.maz-animate-slide-down-blur[data-v-1285ff2b]{animation:cubic-bezier(.16,1,.3,1) forwards slide-down-blur-1285ff2b}.maz-animate-slide-left-blur[data-v-1285ff2b]{animation:cubic-bezier(.16,1,.3,1) forwards slide-left-blur-1285ff2b}.maz-animate-slide-right-blur[data-v-1285ff2b]{animation:cubic-bezier(.16,1,.3,1) forwards slide-right-blur-1285ff2b}.maz-animate-slide-up-blur[data-v-1285ff2b],.maz-animate-slide-down-blur[data-v-1285ff2b],.maz-animate-slide-left-blur[data-v-1285ff2b],.maz-animate-slide-right-blur[data-v-1285ff2b]{opacity:0}

package/dist/assets/MazBackdrop.BnhcmjbP.css

@@ -1 +0,0 @@
-html.--backdrop-present{overflow-y:hidden;height:100vh!important}html.--backdrop-present.--has-scrollbar{padding-right:var(--scrollbar-width)}.m-backdrop[data-v-94bf4716]{z-index:1050;background-color:hsl(var(--maz-overlay)/.05);--maz-tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--maz-tw-backdrop-blur)var(--maz-tw-backdrop-brightness)var(--maz-tw-backdrop-contrast)var(--maz-tw-backdrop-grayscale)var(--maz-tw-backdrop-hue-rotate)var(--maz-tw-backdrop-invert)var(--maz-tw-backdrop-opacity)var(--maz-tw-backdrop-saturate)var(--maz-tw-backdrop-sepia);backdrop-filter:var(--maz-tw-backdrop-blur)var(--maz-tw-backdrop-brightness)var(--maz-tw-backdrop-contrast)var(--maz-tw-backdrop-grayscale)var(--maz-tw-backdrop-hue-rotate)var(--maz-tw-backdrop-invert)var(--maz-tw-backdrop-opacity)var(--maz-tw-backdrop-saturate)var(--maz-tw-backdrop-sepia);position:fixed;inset:0}.m-backdrop.--persistent .m-backdrop-content[data-v-94bf4716]{cursor:default}.m-backdrop-container[data-v-94bf4716]{z-index:1050;position:fixed;inset:0}.m-backdrop-wrapper[data-v-94bf4716]{position:fixed;inset:0;overflow-y:auto}.m-backdrop-content[data-v-94bf4716]{align-items:flex-end;min-height:100%;display:flex}@media (min-width:640px){.m-backdrop-content[data-v-94bf4716]{align-items:center;padding:0}}.m-backdrop-content.--padding[data-v-94bf4716]{padding:1rem}.m-backdrop-content.--justify-center[data-v-94bf4716]{justify-content:center}.m-backdrop-content.--justify-end[data-v-94bf4716]{justify-content:flex-end}.m-backdrop-content.--justify-start[data-v-94bf4716]{justify-content:flex-start}.m-backdrop-content.--justify-space-between[data-v-94bf4716]{justify-content:space-between}.m-backdrop-content.--justify-space-around[data-v-94bf4716]{justify-content:space-around}.m-backdrop-content.--align-center[data-v-94bf4716]{align-items:center}.m-backdrop-content.--align-end[data-v-94bf4716]{align-items:flex-end}.m-backdrop-content.--align-start[data-v-94bf4716]{align-items:flex-start}.m-backdrop-content[data-v-94bf4716]>*{cursor:default}.m-backdrop.--variant-bottom-sheet .m-backdrop-content[data-v-94bf4716],.m-backdrop.--variant-drawer .m-backdrop-content[data-v-94bf4716]{position:fixed;inset:0}.m-backdrop.bottom-sheet-anim-enter-active[data-v-94bf4716],.m-backdrop.bottom-sheet-anim-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.bottom-sheet-anim-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.bottom-sheet-anim-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.bottom-sheet-anim-enter-from[data-v-94bf4716],.m-backdrop.bottom-sheet-anim-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.bottom-sheet-anim-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.bottom-sheet-anim-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:translateY(100%)}.m-backdrop.modal-anim-enter-active[data-v-94bf4716],.m-backdrop.modal-anim-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.modal-anim-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.modal-anim-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.modal-anim-enter-from[data-v-94bf4716],.m-backdrop.modal-anim-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.modal-anim-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.modal-anim-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:scale(.5)}.m-backdrop.drawer-anim-top-enter-active[data-v-94bf4716],.m-backdrop.drawer-anim-top-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.drawer-anim-top-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-top-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.drawer-anim-top-enter-from[data-v-94bf4716],.m-backdrop.drawer-anim-top-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.drawer-anim-top-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-top-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:translateY(-100%)}.m-backdrop.drawer-anim-bottom-enter-active[data-v-94bf4716],.m-backdrop.drawer-anim-bottom-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.drawer-anim-bottom-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-bottom-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.drawer-anim-bottom-enter-from[data-v-94bf4716],.m-backdrop.drawer-anim-bottom-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.drawer-anim-bottom-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-bottom-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:translateY(100%)}.m-backdrop.drawer-anim-left-enter-active[data-v-94bf4716],.m-backdrop.drawer-anim-left-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.drawer-anim-left-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-left-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.drawer-anim-left-enter-from[data-v-94bf4716],.m-backdrop.drawer-anim-left-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.drawer-anim-left-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-left-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:translate(-100%)}.m-backdrop.drawer-anim-right-enter-active[data-v-94bf4716],.m-backdrop.drawer-anim-right-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.drawer-anim-right-enter-active .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-right-leave-active .m-backdrop-content[data-v-94bf4716]>*{transition:transform .25s ease-in-out}.m-backdrop.drawer-anim-right-enter-from[data-v-94bf4716],.m-backdrop.drawer-anim-right-leave-to[data-v-94bf4716]{opacity:0}.m-backdrop.drawer-anim-right-enter-from .m-backdrop-content[data-v-94bf4716]>*,.m-backdrop.drawer-anim-right-leave-to .m-backdrop-content[data-v-94bf4716]>*{transform:translate(100%)}.m-backdrop.backdrop-anim-enter-active[data-v-94bf4716],.m-backdrop.backdrop-anim-leave-active[data-v-94bf4716]{transition:opacity .25s ease-in-out}.m-backdrop.backdrop-anim-enter-from[data-v-94bf4716],.m-backdrop.backdrop-anim-leave-to[data-v-94bf4716]{opacity:0}