maz-ui 4.0.0-beta.2 → 4.0.0-beta.21

package/dist/types/components/MazDatePicker.vue.d.ts

@@ -249,11 +249,11 @@ declare function __VLS_template(): {
             $data: {};
             $props: {
                 readonly modelValue?: boolean | undefined;
-                readonly position?: import('./MazPopover.vue').PopoverPosition | undefined;
-                readonly preferPosition?: import('./MazPopover.vue').PopoverPosition | undefined;
-                readonly fallbackPosition?: import('./MazPopover.vue').PopoverPosition | undefined;
-                readonly trigger?: import('./MazPopover.vue').PopoverTrigger | undefined;
-                readonly role?: import('./MazPopover.vue').PopoverRole | undefined;
+                readonly position?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+                readonly preferPosition?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+                readonly fallbackPosition?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+                readonly trigger?: import('./MazPopover.vue').MazPopoverTrigger | undefined;
+                readonly role?: import('./MazPopover.vue').MazPopoverRole | undefined;
                 readonly ariaLabel?: string | undefined;
                 readonly announceChanges?: boolean | undefined;
                 readonly disabled?: boolean | undefined;
@@ -275,7 +275,7 @@ declare function __VLS_template(): {
                 readonly trapFocus?: boolean | undefined;
                 readonly keepOpenOnHover?: boolean | undefined;
                 readonly block?: boolean | undefined;
-                readonly positionDelay?: number | undefined;
+                readonly positionReference?: (string | HTMLElement) | undefined;
                 readonly onClose?: (() => any) | undefined;
                 readonly onToggle?: ((value: boolean) => any) | undefined;
                 readonly onOpen?: (() => any) | undefined;
@@ -338,11 +338,7 @@ declare function __VLS_template(): {
             };
             $forceUpdate: () => void;
             $nextTick: typeof import('vue').nextTick;
-            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (... /**
-             * CSS selector for a custom element that triggers the picker
-             * @type {string}
-             * @example '#my-button', '.trigger-class'
-             */args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
         } & Readonly<{}> & Omit<Readonly<{
             modelValue?: boolean;
         } & MazPopoverProps> & Readonly<{
@@ -407,7 +403,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     hideHeader: boolean;
     inputFormat: Intl.DateTimeFormatOptions;
     autoClose: boolean;
-    pickerPosition: import('./MazPopover.vue').PopoverPosition;
+    pickerPosition: import('./MazPopover.vue').MazPopoverPosition;
     onlyTime: boolean;
     useBrowserLocale: boolean;
     fetchLocal: boolean;
@@ -417,11 +413,11 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
         $data: {};
         $props: {
             readonly modelValue?: boolean | undefined;
-            readonly position?: import('./MazPopover.vue').PopoverPosition | undefined;
-            readonly preferPosition?: import('./MazPopover.vue').PopoverPosition | undefined;
-            readonly fallbackPosition?: import('./MazPopover.vue').PopoverPosition | undefined;
-            readonly trigger?: import('./MazPopover.vue').PopoverTrigger | undefined;
-            readonly role?: import('./MazPopover.vue').PopoverRole | undefined;
+            readonly position?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+            readonly preferPosition?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+            readonly fallbackPosition?: import('./MazPopover.vue').MazPopoverPosition | undefined;
+            readonly trigger?: import('./MazPopover.vue').MazPopoverTrigger | undefined;
+            readonly role?: import('./MazPopover.vue').MazPopoverRole | undefined;
             readonly ariaLabel?: string | undefined;
             readonly announceChanges?: boolean | undefined;
             readonly disabled?: boolean | undefined;
@@ -443,7 +439,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
             readonly trapFocus?: boolean | undefined;
             readonly keepOpenOnHover?: boolean | undefined;
             readonly block?: boolean | undefined;
-            readonly positionDelay?: number | undefined;
+            readonly positionReference?: (string | HTMLElement) | undefined;
             readonly onClose?: (() => any) | undefined;
             readonly onToggle?: ((value: boolean) => any) | undefined;
             readonly onOpen?: (() => any) | undefined;
@@ -506,11 +502,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
         };
         $forceUpdate: () => void;
         $nextTick: typeof import('vue').nextTick;
-        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (... /**
-         * CSS selector for a custom element that triggers the picker
-         * @type {string}
-         * @example '#my-button', '.trigger-class'
-         */args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
     } & Readonly<{}> & Omit<Readonly<{
         modelValue?: boolean;
     } & MazPopoverProps> & Readonly<{

package/dist/types/components/MazDialogConfirm/useMazDialogConfirm.d.ts

@@ -0,0 +1,47 @@
+import { Ref } from 'vue';
+import { MazBtnProps } from '../MazBtn.vue';
+import { MazDialogConfirmInternalProps } from '../MazDialogConfirm.vue';
+export interface MazDialogConfirmState {
+    id: string;
+    isActive: boolean;
+    accept: (value: unknown) => void;
+    reject?: (reason?: unknown) => void;
+}
+export interface MazDialogConfirmButtonAction extends Omit<MazBtnProps, 'type'> {
+    type: never;
+    text?: string;
+    onClick: () => unknown;
+}
+export interface MazDialogConfirmButtonPromised extends Omit<MazBtnProps, 'type'> {
+    text?: string;
+    type: 'accept' | 'reject';
+    response?: unknown;
+}
+export type MazDialogConfirmButton = MazDialogConfirmButtonPromised | MazDialogConfirmButtonAction;
+export type MazDialogConfirmData = Omit<MazDialogConfirmInternalProps, 'identifier'>;
+export declare const defaultData: {
+    buttons: undefined;
+    acceptText: string;
+    hideAcceptButton: false;
+    acceptProps: {
+        color: "success";
+        type: "accept";
+        response: string;
+    };
+    rejectText: string;
+    hideRejectButton: false;
+    rejectProps: {
+        color: "destructive";
+        type: "reject";
+        response: string;
+    };
+};
+declare function showDialogAndWaitChoice(identifier: string, callback?: () => unknown): Promise<unknown>;
+export declare function useMazDialogConfirm(): {
+    data: Ref<MazDialogConfirmData, MazDialogConfirmData>;
+    dialogState: Ref<MazDialogConfirmState[], MazDialogConfirmState[]>;
+    showDialogAndWaitChoice: typeof showDialogAndWaitChoice;
+    reject: (currentDialog: MazDialogConfirmState, response?: unknown, onClick?: () => unknown) => Promise<unknown>;
+    accept: (currentDialog: MazDialogConfirmState, response?: unknown, onClick?: () => unknown) => Promise<unknown>;
+};
+export {};

package/dist/types/components/{MazDialogPromise.vue.d.ts → MazDialogConfirm.vue.d.ts}

@@ -1,7 +1,8 @@
-import { MazDialogProps } from './MazDialog.vue';
-import { MazDialogPromiseButton, MazDialogPromiseData } from './MazDialogPromise/useMazDialogPromise';
 import { ComponentPublicInstance, ComputedRef } from 'vue';
-export interface MazDialogPromiseInternalProps {
+import { MazBtnProps } from './MazBtn.vue';
+import { MazDialogProps } from './MazDialog.vue';
+import { MazDialogConfirmButton, MazDialogConfirmData } from './MazDialogConfirm/useMazDialogConfirm';
+export interface MazDialogConfirmInternalProps {
     /**
      * Uniq identifier of the dialog
      * @description This is used to identify the dialog in the state
@@ -15,22 +16,54 @@ export interface MazDialogPromiseInternalProps {
      * Dialog message displayed in the body
      */
     message?: string;
+    /**
+     * Text for the reject button - will be applied only if buttons props is not provided
+     * @default undefined
+     */
+    rejectText?: string;
+    /**
+     * Props for the reject button - will be applied only if buttons props is not provided
+     * @default { color: 'destructive', type: 'reject', text: 'Cancel', response: 'reject' }
+     * @type {Omit<MazBtnProps, 'type'> & MazDialogConfirmButton}
+     */
+    rejectProps?: Omit<MazBtnProps, 'type'> & MazDialogConfirmButton;
+    /**
+     * Whether to display the reject button
+     * @default true
+     */
+    hideRejectButton?: boolean;
+    /**
+     * Text for the accept button
+     * @default undefined
+     */
+    acceptText?: string;
+    /**
+     * Props for the accept button - will be applied only if buttons props is not provided
+     * @default { color: 'success', type: 'accept', text: 'Confirm', response: 'accept' }
+     * @type {Omit<MazBtnProps, 'type'> & MazDialogConfirmButton}
+     */
+    acceptProps?: Omit<MazBtnProps, 'type'> & MazDialogConfirmButton;
+    /**
+     * Whether to display the accept button
+     * @default true
+     */
+    hideAcceptButton?: boolean;
     /**
      * Buttons to display in the footer
-     * @default [{ text: 'Confirm', color: 'success', type: 'accept' }, { text: 'Cancel', color: 'destructive', type: 'reject' }]
+     * @default undefined
      */
-    buttons?: MazDialogPromiseButton[];
+    buttons?: MazDialogConfirmButton[];
 }
-export type MazDialogPromiseProps = MazDialogPromiseInternalProps & MazDialogPromiseData & MazDialogProps;
-export { useMazDialogPromise } from './MazDialogPromise/useMazDialogPromise';
-export type { MazDialogPromiseButton, MazDialogPromiseData } from './MazDialogPromise/useMazDialogPromise';
-declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<MazDialogPromiseProps, {
+export type MazDialogConfirmProps = MazDialogConfirmInternalProps & MazDialogConfirmData & MazDialogProps;
+export { useMazDialogConfirm } from './MazDialogConfirm/useMazDialogConfirm';
+export type { MazDialogConfirmButton, MazDialogConfirmData } from './MazDialogConfirm/useMazDialogConfirm';
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<MazDialogConfirmProps, {
     close: () => void;
     isActive: ComputedRef<boolean>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     close: (value: void) => any;
     open: (value: void) => any;
-}, string, import('vue').PublicProps, Readonly<MazDialogPromiseProps> & Readonly<{
+}, string, import('vue').PublicProps, Readonly<MazDialogConfirmProps> & Readonly<{
     onClose?: ((value?: void | undefined) => any) | undefined;
     onOpen?: ((value?: void | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/types/components/MazDropdown.vue.d.ts

@@ -2,25 +2,25 @@ import { IconComponent } from '@maz-ui/icons';
 import { HTMLAttributes } from 'vue';
 import { RouteLocationRaw } from 'vue-router';
 import { MazLinkProps } from './MazLink.vue';
-import { MazColor, MazSize } from './types';
 import { MazPopoverProps } from './MazPopover.vue';
+import { MazColor, MazSize } from './types';
 type __VLS_Props = MazDropdownProps;
-type ItemBase = Record<string, unknown> & {
+type MazDropdownItemBase = Record<string, unknown> & {
     label: string;
     class?: unknown;
     color?: MazColor;
 };
-type LinkItem = ItemBase & MazLinkProps & {
+type MazDropdownLinkItem = MazDropdownItemBase & MazLinkProps & {
     target?: string;
     href?: string;
     to?: RouteLocationRaw;
 };
-type ActionItem = ItemBase & {
+type MazDropdownActionItem = MazDropdownItemBase & {
     onClick?: () => unknown;
 };
-export type MenuItem = (LinkItem & {
+export type MazDropdownMenuItem = (MazDropdownLinkItem & {
     action?: never;
-}) | (ActionItem & {
+}) | (MazDropdownActionItem & {
     href?: never;
     to?: never;
     target?: never;
@@ -46,7 +46,7 @@ export interface MazDropdownProps extends Omit<MazPopoverProps, 'modelValue'> {
     /**
      * Menu items to display in the dropdown
      * Each item can be either a link (with href/to properties) or an action (with onClick function)
-     * @type {MenuItem[]}
+     * @type {MazDropdownMenuItem[]}
      * @default []
      * @example
      * [
@@ -54,7 +54,7 @@ export interface MazDropdownProps extends Omit<MazPopoverProps, 'modelValue'> {
      *   { label: 'Settings', onClick: () => console.log('Settings clicked') }
      * ]
      */
-    items?: MenuItem[];
+    items?: MazDropdownMenuItem[];
     /**
      * Unique identifier for the dropdown component
      * @type {string}
@@ -63,8 +63,8 @@ export interface MazDropdownProps extends Omit<MazPopoverProps, 'modelValue'> {
     /**
      * Determines how the dropdown should be triggered
      * @type {MazPopoverProps['trigger']}
-     * @values click, hover, manual
-     * @default 'click'
+     * @values click, hover, manual, adaptive
+     * @default 'adaptive'
      */
     trigger?: MazPopoverProps['trigger'];
     /**
@@ -172,14 +172,14 @@ declare function __VLS_template(): {
             open: () => void;
         }): any;
         dropdown?(_: {
-            items: MenuItem[];
+            items: MazDropdownMenuItem[];
             open: () => void;
             close: () => void;
             isOpen: true;
             toggle: () => void;
         }): any;
         menuitem?(_: {
-            item: MenuItem;
+            item: MazDropdownMenuItem;
             open: () => void;
             close: () => void;
             isOpen: true;

package/dist/types/components/MazInput.vue.d.ts

@@ -192,6 +192,12 @@ export interface MazInputProps<T = MazInputValue> {
      * @example "email"
      */
     autocomplete?: string;
+    /**
+     * Loading state for the input field. Used to show a loading spinner
+     * @note Spinner can be replace with the `loader` slot
+     * @default false
+     */
+    loading?: boolean;
 }
 declare const _default: <T extends MazInputValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
@@ -207,6 +213,7 @@ declare const _default: <T extends MazInputValue>(__VLS_props: NonNullable<Await
     slots: {
         'left-icon'?(_: {}): any;
         'right-icon'?(_: {}): any;
+        loader?(_: {}): any;
     };
     emit: ((evt: "blur", event: Event) => void) & ((evt: "change", event: Event) => void) & ((evt: "click", event: Event) => void) & ((evt: "focus", event: Event) => void) & ((evt: "input", event: Event) => void) & ((evt: "update:model-value", value?: T | undefined) => void);
 }>) => import('vue').VNode & {

package/dist/types/components/MazInputNumber.vue.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'vue';
-import { MazSize } from './types';
 import { MazInputProps } from './MazInput.vue';
+import { MazSize } from './types';
 export interface MazInputNumberProps {
     /**
      * The inline style object for the component.
@@ -119,7 +119,7 @@ declare const _default: import('vue').DefineComponent<MazInputNumberProps, {}, {
     step: number;
     min: number;
     max: number;
-    inputmode: "search" | "text" | "none" | "email" | "tel" | "decimal" | "url" | "numeric";
+    inputmode: "search" | "text" | "none" | "decimal" | "email" | "url" | "numeric" | "tel";
     textCenter: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/types/components/MazInputPhoneNumber/useLibphonenumber.d.ts

@@ -1,11 +1,11 @@
 import { CountryCode, Examples, getCountries, getCountryCallingCode } from 'libphonenumber-js';
-import { Results } from './types';
+import { MazInputPhoneNumberData } from '../MazInputPhoneNumber.vue';
 declare function isCountryAvailable(locale: string): boolean;
 declare function getPhoneNumberResults({ phoneNumber, countryCode, checkCountryCode, }: {
     phoneNumber?: string | undefined | null;
     countryCode?: CountryCode | undefined | null;
     checkCountryCode?: boolean;
-}): Results;
+}): MazInputPhoneNumberData;
 declare function getPhoneNumberExamplesFile(): Promise<Examples>;
 declare function getPhoneNumberExample(countryCode?: CountryCode | undefined | null): string | undefined;
 declare function getAsYouTypeFormat(countryCode?: CountryCode | undefined | null, phoneNumber?: string | undefined | null): string | undefined;

package/dist/types/components/MazInputPhoneNumber/useMazInputPhoneNumber.d.ts

@@ -1,10 +1,14 @@
 import { CountryCode } from 'libphonenumber-js';
-import { Country } from './types';
+export interface CountryOption {
+    code: CountryCode;
+    dialCode: string;
+    name: string;
+}
 declare function getBrowserLocale(): {
     locale: string;
     browserLocale: string;
 } | undefined;
-declare function getCountryList(locale?: string, customCountriesNameListByIsoCode?: Record<CountryCode, string>): Country[] | undefined;
+declare function getCountryList(locale?: string, customCountriesNameListByIsoCode?: Record<CountryCode, string>): CountryOption[] | undefined;
 declare function fetchCountryCode(): Promise<{
     data: CountryCode;
     error: undefined;

package/dist/types/components/MazInputPhoneNumber.vue.d.ts

@@ -1,9 +1,24 @@
 import { MazTranslationsNestedSchema } from '@maz-ui/translations/src/types.js';
-import { CountryCode } from 'libphonenumber-js';
+import { CountryCallingCode, CountryCode, NationalNumber, NumberType } from 'libphonenumber-js';
 import { HTMLAttributes } from 'vue';
-import { Results } from './MazInputPhoneNumber/types';
 import { MazPopoverProps } from './MazPopover.vue';
 import { MazColor, MazSize } from './types';
+export interface MazInputPhoneNumberData {
+    isValid: boolean;
+    isPossible?: boolean;
+    countryCode?: CountryCode | undefined | null;
+    parsedCountryCode?: CountryCode | undefined | null;
+    countryCallingCode?: CountryCallingCode;
+    nationalNumber?: NationalNumber;
+    type?: NumberType;
+    formatInternational?: string;
+    formatNational?: string;
+    uri?: string;
+    e164?: string;
+    rfc3966?: string;
+    possibleCountries?: CountryCode[];
+    phoneNumber?: string | undefined | null;
+}
 export interface MazInputPhoneNumberProps {
     /**
      * Style attribut of the component root element
@@ -213,7 +228,11 @@ export interface MazInputPhoneNumberProps {
      * @type {Record<string, unknown>}
      * @default { autocomplete: 'tel', name: 'phone', inputmode: 'tel' }
      */
-    phoneInputAttributes?: Record<string, unknown>;
+    phoneInputAttributes?: Record<string, unknown> & {
+        name: string;
+        inputmode: HTMLAttributes['inputmode'];
+        autocomplete: string;
+    };
 }
 /** Models */
 declare const phoneNumber: import('vue').Ref<string | null | undefined, string | null | undefined>;
@@ -223,9 +242,9 @@ declare const results: import('vue').Ref<{
     isPossible?: boolean | undefined;
     countryCode?: CountryCode | null | undefined;
     parsedCountryCode?: CountryCode | null | undefined;
-    countryCallingCode?: import('libphonenumber-js').CountryCallingCode | undefined;
-    nationalNumber?: import('libphonenumber-js').NationalNumber | undefined;
-    type?: import('libphonenumber-js').NumberType;
+    countryCallingCode?: CountryCallingCode | undefined;
+    nationalNumber?: NationalNumber | undefined;
+    type?: NumberType;
     formatInternational?: string | undefined;
     formatNational?: string | undefined;
     uri?: string | undefined;
@@ -233,14 +252,14 @@ declare const results: import('vue').Ref<{
     rfc3966?: string | undefined;
     possibleCountries?: CountryCode[] | undefined;
     phoneNumber?: string | undefined | null | undefined;
-}, Results | {
+}, MazInputPhoneNumberData | {
     isValid: boolean;
     isPossible?: boolean | undefined;
     countryCode?: CountryCode | null | undefined;
     parsedCountryCode?: CountryCode | null | undefined;
-    countryCallingCode?: import('libphonenumber-js').CountryCallingCode | undefined;
-    nationalNumber?: import('libphonenumber-js').NationalNumber | undefined;
-    type?: import('libphonenumber-js').NumberType;
+    countryCallingCode?: CountryCallingCode | undefined;
+    nationalNumber?: NationalNumber | undefined;
+    type?: NumberType;
     formatInternational?: string | undefined;
     formatNational?: string | undefined;
     uri?: string | undefined;
@@ -264,7 +283,7 @@ declare function __VLS_template(): {
         }): any;
         'country-list-flag'?(_: {
             countryCode: CountryCode;
-            option: import('./MazInputPhoneNumber/types').Country;
+            option: import('./MazInputPhoneNumber/useMazInputPhoneNumber').CountryOption;
             isSelected: boolean;
         }): any;
     };
@@ -316,12 +335,12 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<MazInputPhoneNumberProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    data: (results: Results) => any;
+    data: (results: MazInputPhoneNumberData) => any;
     "update:model-value": (value: string | null | undefined) => any;
     "country-code": (countryCode?: CountryCode | null | undefined) => any;
     "update:country-code": (countryCode?: CountryCode | null | undefined) => any;
 }, string, import('vue').PublicProps, Readonly<MazInputPhoneNumberProps> & Readonly<{
-    onData?: ((results: Results) => any) | undefined;
+    onData?: ((results: MazInputPhoneNumberData) => any) | undefined;
     "onUpdate:model-value"?: ((value: string | null | undefined) => any) | undefined;
     "onCountry-code"?: ((countryCode?: CountryCode | null | undefined) => any) | undefined;
     "onUpdate:country-code"?: ((countryCode?: CountryCode | null | undefined) => any) | undefined;
@@ -333,7 +352,7 @@ declare const __VLS_component: import('vue').DefineComponent<MazInputPhoneNumber
     orientation: "row" | "col" | "responsive";
     example: boolean;
     useBrowserLocale: boolean;
-    listPosition: import('./MazPopover.vue').PopoverPosition;
+    listPosition: import('./MazPopover.vue').MazPopoverPosition;
     searchThreshold: number;
     hideFlags: boolean;
     showCodeInList: boolean;
@@ -345,7 +364,11 @@ declare const __VLS_component: import('vue').DefineComponent<MazInputPhoneNumber
     validationSuccess: boolean;
     displayCountryName: boolean;
     countrySelectAttributes: Record<string, unknown>;
-    phoneInputAttributes: Record<string, unknown>;
+    phoneInputAttributes: Record<string, unknown> & {
+        name: string;
+        inputmode: HTMLAttributes["inputmode"];
+        autocomplete: string;
+    };
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     PhoneInputRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
         modelValue?: string | undefined | null;

package/dist/types/components/MazInputTags.vue.d.ts

@@ -44,8 +44,8 @@ declare const _default: import('vue').DefineComponent<MazInputTagsProps, {}, {},
     class: HTMLAttributes["class"];
     color: MazColor;
     disabled: boolean;
-    modelValue: (string | number)[];
     placeholder: string;
+    modelValue: (string | number)[];
     addTagsOnBlur: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/types/components/MazLazyImg.vue.d.ts

@@ -47,15 +47,15 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<MazLazyImgProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    error: (el: HTMLElement) => any;
-    loaded: (el: HTMLElement) => any;
-    loading: (el: HTMLElement) => any;
-    intersecting: (el: HTMLElement) => any;
+    error: (el: Element) => any;
+    loaded: (el: Element) => any;
+    loading: (el: Element) => any;
+    intersecting: (el: Element) => any;
 }, string, import('vue').PublicProps, Readonly<MazLazyImgProps> & Readonly<{
-    onError?: ((el: HTMLElement) => any) | undefined;
-    onLoaded?: ((el: HTMLElement) => any) | undefined;
-    onLoading?: ((el: HTMLElement) => any) | undefined;
-    onIntersecting?: ((el: HTMLElement) => any) | undefined;
+    onError?: ((el: Element) => any) | undefined;
+    onLoaded?: ((el: Element) => any) | undefined;
+    onLoading?: ((el: Element) => any) | undefined;
+    onIntersecting?: ((el: Element) => any) | undefined;
 }>, {
     src: MazImage | null;
     style: string | false | import('vue').CSSProperties | import('vue').StyleValue[] | null;

package/dist/types/components/MazLink.vue.d.ts

@@ -1,7 +1,18 @@
 import { IconComponent } from '@maz-ui/icons';
+import { HTMLAttributes } from 'vue';
 import { RouteLocationRaw } from 'vue-router';
 import { MazColor } from './types';
 export interface MazLinkProps {
+    /**
+     * The class attribute of the link
+     * @default undefined
+     */
+    class?: HTMLAttributes['class'];
+    /**
+     * The style attribute of the link
+     * @default undefined
+     */
+    style?: HTMLAttributes['style'];
     /**
      * The component to use for the link - if not provided, it will be `router-link` if `to` is provided, will be `a` if `href` is provided, otherwise it will be `button`, you can force the component to be used with `as` prop
      * @default depends on the provided props

package/dist/types/components/MazPopover.vue.d.ts

@@ -1,9 +1,9 @@
 import { HTMLAttributes } from 'vue';
 import { MazColor } from './types';
 type __VLS_Props = MazPopoverProps;
-export type PopoverPosition = 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
-export type PopoverTrigger = 'click' | 'hover' | 'manual';
-export type PopoverRole = 'dialog' | 'tooltip' | 'menu';
+export type MazPopoverPosition = 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
+export type MazPopoverTrigger = 'click' | 'hover' | 'manual' | 'adaptive';
+export type MazPopoverRole = 'dialog' | 'tooltip' | 'menu';
 export interface MazPopoverProps {
     /**
      * Controls the popover open state
@@ -18,35 +18,35 @@ export interface MazPopoverProps {
      * @default auto
      * @description Position of the popover relative to trigger
      */
-    position?: PopoverPosition;
+    position?: MazPopoverPosition;
     /**
      * Preferred position of the popover relative to trigger when auto position is used
      * @values auto, top, bottom, left, right, top-start, top-end, bottom-start, bottom-end, left-start, left-end, right-start, right-end
      * @default 'bottom-start'
      * @description Preferred position of the popover relative to trigger
      */
-    preferPosition?: PopoverPosition;
+    preferPosition?: MazPopoverPosition;
     /**
      * Fallback position of the popover relative to trigger when prefer position is not visible
      * @values auto, top, bottom, left, right, top-start, top-end, bottom-start, bottom-end, left-start, left-end, right-start, right-end
      * @default auto
      * @description Fallback position of the popover relative to trigger
      */
-    fallbackPosition?: PopoverPosition;
+    fallbackPosition?: MazPopoverPosition;
     /**
      * How the popover is triggered
-     * @values click, hover, manual
+     * @values click, hover, manual, adaptive
      * @default click
-     * @description How the popover is triggered
+     * @description How the popover is triggered. 'adaptive' uses hover on desktop and click on mobile
      */
-    trigger?: PopoverTrigger;
+    trigger?: MazPopoverTrigger;
     /**
      * ARIA role for accessibility
      * @values dialog, tooltip
      * @default dialog
      * @description ARIA role for accessibility
      */
-    role?: PopoverRole;
+    role?: MazPopoverRole;
     /**
      * ARIA label for the popover
      * @default undefined
@@ -155,11 +155,14 @@ export interface MazPopoverProps {
      */
     block?: boolean;
     /**
-     * Delay before setting the position in milliseconds
-     * @description Useful when the popover content is not immediately visible or rendered
-     * @default 50
+     * CSS selector or element reference to use for positioning calculations
+     * @description When provided, the popover will position relative to this element instead of the trigger
+     * Useful for components with labels where you want to position relative to the actual input
+     * @type {string | HTMLElement}
+     * @default undefined
+     * @example "input" or "#my-input" or HTMLElement
      */
-    positionDelay?: number;
+    positionReference?: string | HTMLElement;
 }
 declare function updatePosition(): void;
 declare function open(): void;
@@ -212,7 +215,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     toggle: typeof toggle;
     /**
      * Check if the popover is open
-     * @type {Ref<boolean>}
+     * @type {ComputedRef<boolean>}
      * @description Reactive reference to the popover open state
      * @usage `const isPopoverOpen = mazPopoverInstance.value?.isOpen`
      */

package/dist/types/components/MazRadioButtons.vue.d.ts

@@ -18,7 +18,7 @@ export interface MazRadioButtonsProps<T = string | number | boolean> {
     /** The name of the radio group */
     name?: string;
     /** The color of the selected radio buttons */
-    color?: MazColor;
+    color?: MazColor | 'background';
     /** Add elevation to the radio buttons */
     elevation?: boolean;
     /**

package/dist/types/components/MazSelect.vue.d.ts

@@ -1,8 +1,8 @@
 import { MazTranslationsNestedSchema } from '@maz-ui/translations/src/types.js';
 import { HTMLAttributes } from 'vue';
 import { MazInputValue } from './MazInput.vue';
-import { MazColor, MazSize } from './types';
 import { MazPopoverProps } from './MazPopover.vue';
+import { MazColor, MazSize } from './types';
 export interface MazSelectNormalizedOption {
     [key: string]: MazInputValue;
 }
@@ -11,7 +11,7 @@ export interface MazSelectOptionWithOptGroup {
     options: (MazSelectNormalizedOption | string | number | boolean)[];
 }
 export type MazSelectOption = MazSelectNormalizedOption | string | number | boolean | MazSelectOptionWithOptGroup;
-export interface MazSelectProps<Value extends MazInputValue, Option extends MazSelectOption, Multiple extends boolean> {
+export interface MazSelectProps<Value extends MazInputValue = MazInputValue, Option extends MazSelectOption = MazSelectOption, Multiple extends boolean = false> {
     /**
      * Style attribut of the component root element
      * @type {HTMLAttributes['style']}