maz-ui 4.0.0-alpha.5 → 4.0.0-beta.1

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

@@ -34,14 +34,17 @@ declare const _default: import('vue').DefineComponent<MazFullscreenImgProps, {},
         easing?: string;
     };
     alt: string | null;
+    offset: number;
+    zoom: boolean;
     clickedElementBounds: {
         top: number;
         left: number;
         height: number;
         width: number;
     };
-    offset: number;
     openInstanceClass: string;
-    zoom: boolean;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    FullscreenImgElement: HTMLDivElement;
+    ImgElement: HTMLImageElement;
+}, HTMLDivElement>;
 export default _default;

package/dist/types/directives/vFullscreenImg/fullscreen-img.directive.d.ts

@@ -1,7 +1,7 @@
-import { vFullscreenImgBindingValue } from './fullscreen-img.handler';
+import { VFullscreenImgBindingValue } from './fullscreen-img.handler';
 declare const directive: {
-    mounted(el: HTMLElement, binding: import('vue').DirectiveBinding<vFullscreenImgBindingValue, string, string>): void;
-    updated(el: HTMLElement, binding: import('vue').DirectiveBinding<vFullscreenImgBindingValue, string, string>): void;
+    mounted(el: HTMLElement, binding: import('vue').DirectiveBinding<VFullscreenImgBindingValue, string, string>): void;
+    updated(el: HTMLElement, binding: import('vue').DirectiveBinding<VFullscreenImgBindingValue, string, string>): void;
     unmounted(el: HTMLElement): void;
 };
 export { directive as vFullscreenImg };

package/dist/types/directives/vFullscreenImg/fullscreen-img.handler.d.ts

@@ -1,5 +1,5 @@
 import { DirectiveBinding } from 'vue';
-export interface vFullscreenImgOptions {
+export interface VFullscreenImgOptions {
     disabled?: boolean;
     scaleOnHover?: boolean;
     blurOnHover?: boolean;
@@ -10,12 +10,12 @@ export interface vFullscreenImgOptions {
         easing?: string;
     };
 }
-interface vFullscreenImgBindingOptions extends vFullscreenImgOptions {
+interface VFullscreenImgBindingOptions extends VFullscreenImgOptions {
     src: string;
     alt?: string | null;
 }
-export type vFullscreenImgBindingValue = string | vFullscreenImgBindingOptions | undefined;
-export type vFullscreenImgBinding = DirectiveBinding<vFullscreenImgBindingValue>;
+export type VFullscreenImgBindingValue = string | VFullscreenImgBindingOptions | undefined;
+export type VFullscreenImgBinding = DirectiveBinding<VFullscreenImgBindingValue>;
 export declare class FullscreenImgHandler {
     private options;
     private defaultOptions;
@@ -26,8 +26,8 @@ export declare class FullscreenImgHandler {
     get allInstances(): HTMLElement[];
     private getImgSrc;
     private getImgAlt;
-    create(el: HTMLElement, binding: vFullscreenImgBinding): void;
-    update(el: HTMLElement, binding: vFullscreenImgBinding): void;
+    create(el: HTMLElement, binding: VFullscreenImgBinding): void;
+    update(el: HTMLElement, binding: VFullscreenImgBinding): void;
     remove(el: HTMLElement): void;
     private renderPreview;
     private mouseLeave;

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

@@ -3,4 +3,4 @@ declare const plugin: {
 };
 export { plugin as vFullscreenImgInstall };
 export { vFullscreenImg } from './vFullscreenImg/fullscreen-img.directive';
-export type { vFullscreenImgBindingValue, vFullscreenImgOptions } from './vFullscreenImg/fullscreen-img.handler';
+export type { VFullscreenImgBindingValue, VFullscreenImgOptions } from './vFullscreenImg/fullscreen-img.handler';

package/dist/types/directives/vLazyImg/lazy-img.directive.d.ts

@@ -1,7 +1,7 @@
-import { vLazyImgBindingValue } from './lazy-img.handler';
+import { VLazyImgBindingValue } from './lazy-img.handler';
 declare const directive: {
-    created(el: HTMLElement, binding: import('vue').DirectiveBinding<vLazyImgBindingValue, string, string>): void;
-    updated(el: HTMLElement, binding: import('vue').DirectiveBinding<vLazyImgBindingValue, string, string>): void;
-    unmounted(el: HTMLElement, binding: import('vue').DirectiveBinding<vLazyImgBindingValue, string, string>): void;
+    created(el: HTMLElement, binding: import('vue').DirectiveBinding<VLazyImgBindingValue, string, string>): void;
+    updated(el: HTMLElement, binding: import('vue').DirectiveBinding<VLazyImgBindingValue, string, string>): void;
+    unmounted(el: HTMLElement, binding: import('vue').DirectiveBinding<VLazyImgBindingValue, string, string>): void;
 };
 export { directive as vLazyImg };

package/dist/types/directives/vLazyImg/lazy-img.handler.d.ts

@@ -1,4 +1,4 @@
-import { ClassOptions, vLazyImgBinding, vLazyImgOptions } from './types';
+import { ClassOptions, VLazyImgBinding, VLazyImgOptions } from './types';
 export * from './types';
 export declare const DEFAULT_OPTIONS: ClassOptions;
 export declare class LazyImg {
@@ -8,7 +8,7 @@ export declare class LazyImg {
     private onImgLoadedCallback;
     private onImgErrorCallback;
     private hasImgLoaded;
-    constructor(opts?: vLazyImgOptions);
+    constructor(opts?: VLazyImgOptions);
     private loadErrorPhoto;
     private buildOptions;
     private removeClass;
@@ -16,7 +16,6 @@ export declare class LazyImg {
     private removeAllStateClasses;
     private setBaseClass;
     private imageIsLoading;
-    private imageHasNoPhoto;
     private imageIsLoaded;
     private imageHasError;
     private getSrc;
@@ -33,7 +32,7 @@ export declare class LazyImg {
     private createObserver;
     private imageHandler;
     private bindUpdateHandler;
-    add(el: HTMLElement, binding: vLazyImgBinding): Promise<void>;
-    update(el: HTMLElement, binding: vLazyImgBinding): Promise<void>;
-    remove(el: HTMLElement, binding: vLazyImgBinding): void;
+    add(el: HTMLElement, binding: VLazyImgBinding): Promise<void>;
+    update(el: HTMLElement, binding: VLazyImgBinding): Promise<void>;
+    remove(el: HTMLElement, binding: VLazyImgBinding): void;
 }

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

@@ -4,9 +4,7 @@ export interface ClassOptions {
     loadingClass: string;
     loadedClass: string;
     errorClass: string;
-    noPhotoClass: string;
-    noPhoto: boolean;
-    noUseErrorPhoto: boolean;
+    fallbackClass: string;
     observerOnce: boolean;
     loadOnce: boolean;
     observerOptions: {
@@ -14,22 +12,18 @@ export interface ClassOptions {
         threshold: number;
         rootMargin?: string;
     };
-    /**
-     * @deprecated use `fallbackSrc` instead
-     */
-    errorPhoto?: string;
-    fallbackSrc?: string;
+    fallbackSrc?: string | false;
     onLoading?: (el: Element) => unknown;
     onLoaded?: (el: Element) => unknown;
     onError?: (el: Element) => unknown;
     onIntersecting?: (el: Element) => unknown;
 }
-export type vLazyImgOptions = Partial<ClassOptions>;
-interface vLazyImgBindingOptions extends vLazyImgOptions {
+export type VLazyImgOptions = Partial<ClassOptions>;
+interface VLazyImgBindingOptions extends VLazyImgOptions {
     src?: string;
     disabled?: boolean;
 }
-export type vLazyImgBindingValue = string | vLazyImgBindingOptions;
-export type vLazyImgBinding = DirectiveBinding<vLazyImgBindingValue>;
-export type vLazyImgDirective = ObjectDirective<HTMLElement, vLazyImgBinding>;
+export type VLazyImgBindingValue = string | VLazyImgBindingOptions;
+export type VLazyImgBinding = DirectiveBinding<VLazyImgBindingValue>;
+export type VLazyImgDirective = ObjectDirective<HTMLElement, VLazyImgBinding>;
 export {};

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

@@ -1,7 +1,7 @@
-import { vLazyImgBindingValue, vLazyImgOptions } from './vLazyImg/types';
+import { VLazyImgBindingValue, VLazyImgOptions } from './vLazyImg/types';
 declare const plugin: {
     install(app: import('vue').App<any>, opts?: Partial<import('./vLazyImg/types').ClassOptions>): void;
 };
 export { vLazyImg } from './vLazyImg/lazy-img.directive';
 export { plugin as vLazyImgInstall };
-export type { vLazyImgBindingValue, vLazyImgOptions };
+export type { VLazyImgBindingValue, VLazyImgOptions };

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

@@ -1,42 +1,54 @@
 import { DirectiveBinding } from 'vue';
-import { Color } from '../components/types';
-type vTooltipColor = Exclude<Color, 'transparent'> | 'default' | 'light' | 'dark';
-interface vTooltipOptions {
+import { MazPopoverProps, PopoverPosition, PopoverTrigger } from '../components/MazPopover.vue';
+interface VTooltipOptions extends Partial<Omit<MazPopoverProps, 'modelValue'>> {
+    /**
+     * Text to display in the tooltip
+     */
+    text?: string;
+    /**
+     * HTML content (alternative to text)
+     */
+    html?: string;
+    /**
+     * Color variant of the tooltip
+     * @default default
+     */
+    color?: MazPopoverProps['color'];
     /**
      * Position of the tooltip
-     * @default 'top'
+     * The preferred position is set to 'top' if no position is provided
+     * @default undefined
      */
-    position?: 'top' | 'bottom' | 'left' | 'right';
+    position?: PopoverPosition;
     /**
-     * Color of the tooltip
-     * @default 'default'
+     * Trigger of the tooltip
+     * @default hover
      */
-    color?: vTooltipColor;
-}
-type vTooltipBindingValue = string | ({
+    trigger?: PopoverTrigger;
     /**
-     * Text to display in the tooltip
-     * @default ''
+     * Close on click outside
+     * @default false
      */
-    text: string;
+    closeOnClickOutside?: boolean;
     /**
-     * Open the tooltip
+     * Close on escape
      * @default false
      */
-    open?: boolean;
+    closeOnEscape?: boolean;
     /**
-     * Offset of the tooltip
-     * @default '1rem'
+     * Open the tooltip
+     * @default false
      */
-    offset?: string;
-} & vTooltipOptions);
-export type TooltipBinding = DirectiveBinding<vTooltipBindingValue>;
+    open?: boolean;
+}
+type VTooltipBindingValue = string | VTooltipOptions;
+export type TooltipBinding = DirectiveBinding<VTooltipBindingValue, NonNullable<MazPopoverProps['position']>>;
 declare const directive: {
-    beforeMount(el: HTMLElement, binding: DirectiveBinding<vTooltipBindingValue, string, string>): void;
-    updated(el: HTMLElement, binding: DirectiveBinding<vTooltipBindingValue, string, string>): void;
-    unmounted(el: HTMLElement, binding: DirectiveBinding<vTooltipBindingValue, string, string>): void;
+    mounted(el: HTMLElement, binding: TooltipBinding): void;
+    updated(el: HTMLElement, binding: TooltipBinding): void;
+    unmounted(el: HTMLElement): void;
 };
 declare const plugin: {
-    install: (app: import('vue').App<any>, options?: vTooltipOptions) => void;
+    install: (app: import('vue').App<any>, options?: Partial<VTooltipOptions>) => void;
 };
-export { directive as vTooltip, type vTooltipBindingValue, type vTooltipColor, plugin as vTooltipInstall, type vTooltipOptions, };
+export { directive as vTooltip, type VTooltipBindingValue, plugin as vTooltipInstall, type VTooltipOptions, };

package/dist/types/directives/vZoomImg/zoom-img.directive.d.ts

@@ -1,6 +1,6 @@
-import { vZoomImgBindingValue } from './zoom-img.handler';
+import { VZoomImgBindingValue } from './zoom-img.handler';
 export declare const vZoomImg: {
-    created(el: HTMLElement, binding: import('vue').DirectiveBinding<vZoomImgBindingValue, string, string>): void;
-    updated(_el: HTMLElement, binding: import('vue').DirectiveBinding<vZoomImgBindingValue, string, string>): void;
+    created(el: HTMLElement, binding: import('vue').DirectiveBinding<VZoomImgBindingValue, string, string>): void;
+    updated(_el: HTMLElement, binding: import('vue').DirectiveBinding<VZoomImgBindingValue, string, string>): void;
     unmounted(el: HTMLElement): void;
 };

package/dist/types/directives/vZoomImg/zoom-img.handler.d.ts

@@ -1,16 +1,16 @@
 import { DirectiveBinding } from 'vue';
-export interface vZoomImgOptions {
+export interface VZoomImgOptions {
     disabled?: boolean;
     scale?: boolean;
     blur?: boolean;
 }
-interface vZoomImgBindingOptions extends vZoomImgOptions {
+interface VZoomImgBindingOptions extends VZoomImgOptions {
     src: string;
     alt?: string;
 }
-export type vZoomImgBindingValue = string | vZoomImgBindingOptions;
-export type vZoomImgBinding = DirectiveBinding<vZoomImgBindingValue>;
-export declare class VueZoomImg {
+export type VZoomImgBindingValue = string | VZoomImgBindingOptions;
+export type VZoomImgBinding = DirectiveBinding<VZoomImgBindingValue>;
+export declare class ZoomImgHandler {
     private options;
     private loader;
     private wrapper;
@@ -22,11 +22,11 @@ export declare class VueZoomImg {
     private mouseEnterListener;
     private mouseLeaveListener;
     private renderPreviewListener;
-    constructor(binding: vZoomImgBinding);
+    constructor(binding: VZoomImgBinding);
     private buildOptions;
     get allInstances(): HTMLElement[];
     create(el: HTMLElement): void;
-    update(binding: vZoomImgBinding): void;
+    update(binding: VZoomImgBinding): void;
     remove(el: HTMLElement): void;
     private renderPreview;
     private onImgLoaded;

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

@@ -3,4 +3,4 @@ declare const plugin: {
     install(app: import('vue').App<any>): void;
 };
 export { vZoomImg, plugin as vZoomImgInstall };
-export type { vZoomImgBindingValue } from './vZoomImg/zoom-img.handler';
+export type { VZoomImgBindingValue } from './vZoomImg/zoom-img.handler';

package/dist/types/index.d.ts

@@ -1,8 +1 @@
-export * from './components';
-export * from './composables';
-export * from './directives';
-export * from './filters';
-export * from './helpers';
-export * from './plugins';
-export * from './resolvers';
-export * from './ts-helpers';
+export * from '@maz-ui/utils/src/index.js';

package/dist/types/plugins/aos.d.ts

@@ -29,8 +29,27 @@ export declare class AosHandler {
     private handleObserver;
     runAnimations(): Promise<void> | undefined;
 }
-export declare const plugin: {
+export declare const AosPlugin: {
     install: (app: App, options?: AosOptions) => void;
 };
-export declare function getInstance(): AosHandler;
+declare module '@vue/runtime-core' {
+    interface ComponentCustomProperties {
+        /**
+         * Aos handler instance
+         * @description You should install the plugin to use this property
+         * @examl
+         * ```ts
+         * import { AosPlugin } from 'maz-ui/plugins/aos'
+         * import { createApp } from 'vue'
+         *
+         * const app = createApp(App)
+         * app.use(AosPlugin)
+         *
+         * const aos = useAos()
+         * aos.runAnimations()
+         */
+        $mazAos: AosHandler;
+    }
+}
+export declare function getAosInstance(): AosHandler;
 export {};

package/dist/types/plugins/dialog/DialogHandler.d.ts

@@ -1,14 +1,15 @@
 import { App } from 'vue';
 import { MazDialogPromiseProps } from '../../components/MazDialogPromise.vue';
-export type DialogOptions = Partial<Omit<MazDialogPromiseProps, 'modelValue'>> & {
-    promiseCallback?: () => unknown;
+export type DialogOptions = Partial<Omit<MazDialogPromiseProps, 'modelValue' | 'variant' | 'justify'>> & {
+    onClose?: () => unknown;
+    onAccept?: (response: unknown) => unknown;
+    onReject?: (response: unknown) => unknown;
 };
 export declare class DialogHandler {
     private readonly app;
-    private readonly globalOptions;
+    readonly globalOptions: DialogOptions;
     constructor(app: App, globalOptions?: DialogOptions);
     open(options: DialogOptions): {
-        promise: Promise<unknown>;
         destroy: () => void;
         close: () => void;
     };

package/dist/types/plugins/dialog.d.ts

@@ -1,6 +1,28 @@
 import { App } from 'vue';
-import { DialogOptions } from './dialog/DialogHandler';
-export declare const installDialog: {
+import { DialogOptions, DialogHandler } from './dialog/DialogHandler';
+export declare const DialogPlugin: {
     install(app: App, options?: DialogOptions): void;
 };
+declare module '@vue/runtime-core' {
+    interface ComponentCustomProperties {
+        /**
+         * Dialog handler instance
+         * @description You should install the plugin to use this property
+         * @examl
+         * ```ts
+         * import { DialogPlugin } from 'maz-ui/plugins/dialog'
+         * import { createApp } from 'vue'
+         *
+         * const app = createApp(App)
+         * app.use(DialogPlugin)
+         *
+         * const dialog = useDialog()
+         * dialog.open({
+         *   title: 'Hello',
+         *   message: 'This is a dialog',
+         * })
+         */
+        $mazDialog: Omit<DialogHandler, 'app'>;
+    }
+}
 export { DialogHandler, type DialogOptions } from './dialog/DialogHandler';

package/dist/types/plugins/index.d.ts

@@ -1,4 +1,5 @@
-export { AosHandler, type AosOptions, getInstance as getAosInstance, plugin as installAos } from './aos';
-export { DialogHandler, type DialogOptions, installDialog, } from './dialog';
-export { installToaster, ToasterHandler, type ToasterOptions, type ToasterPosition, type ToasterPositions, } from './toaster';
-export { plugin as installWait, WaitHandler, instance as waitInstance } from './wait';
+export { AosHandler, type AosOptions, AosPlugin, getAosInstance } from './aos';
+export { type DialogOptions, DialogPlugin } from './dialog';
+export { MazUi, type MazUiOptions } from './maz-ui';
+export { ToastHandler, type ToastOptions, ToastPlugin, type ToastPosition } from './toast';
+export { WaitHandler, waitInstance, WaitPlugin } from './wait';

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

@@ -0,0 +1,104 @@
+import { VLazyImgOptions, VTooltipOptions } from '../directives';
+import { AosOptions, DialogOptions, ToastOptions } from './index';
+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;
+    /**
+     * The translations configurations
+     * Can not be disabled
+     */
+    translations?: MazTranslationsOptions;
+    plugins?: {
+        /**
+         * If true or options are provided, the dialog plugin will be installed
+         * The dialog plugin configurations are available in the [dialog plugin documentation](./dialog.md)
+         */
+        dialog?: boolean | DialogOptions;
+        /**
+         * If true or options are provided, the toast plugin will be installed
+         * The toast plugin configurations
+         */
+        toast?: boolean | ToastOptions;
+        /**
+         * If true, the wait plugin will be installed
+         * No global options are available for this plugin
+         */
+        wait?: boolean;
+        /**
+         * If true or options are provided, the aos plugin will be installed
+         * The aos plugin configurations
+         */
+        aos?: boolean | AosOptions;
+    };
+    directives?: {
+        /**
+         * If true, the tooltip directive will be installed globally
+         */
+        vTooltip?: boolean | VTooltipOptions;
+        /**
+         * If true, the lazy-img directive will be installed globally
+         */
+        vLazyImg?: boolean | VLazyImgOptions;
+        /**
+         * If true, the click-outside directive will be installed globally
+         */
+        vClickOutside?: boolean;
+        /**
+         * If true, the fullscreen-img directive will be installed globally
+         */
+        vFullscreenImg?: boolean;
+        /**
+         * If true, the scroll-lock directive will be installed globally
+         * No global options are available for this plugin
+         */
+        vZoomImg?: boolean;
+    };
+}
+/**
+ * @example
+ * ```ts
+ * import { MazUi } from 'maz-ui/plugins/maz-ui'
+ * import { mazUi as mazUiPreset } from '@maz-ui/themes/presets/mazUi'
+ * import 'maz-ui/styles'
+ *
+ * app.use(MazUi, {
+ *   theme: {
+ *     preset: mazUiPreset,
+ *     strategy: 'hybrid',
+ *     darkMode: 'class',
+ *   },
+ *   translations: {
+ *     locale: 'en',
+ *     translations: {
+ *       en: {
+ *         ...
+ *       },
+ *       fr: {
+ *         ...
+ *       },
+ *     },
+ *   },
+ *   plugins: {
+ *     dialog: true,
+ *     toast: true,
+ *     wait: true,
+ *     aos: true,
+ *   },
+ *   directives: {
+ *     vTooltip: true,
+ *     vLazyImg: true,
+ *     vClickOutside: true,
+ *     vFullscreenImg: true,
+ *     vZoomImg: true,
+ *   },
+ * })
+ * ```
+ */
+export declare const MazUi: {
+    install(app: import('vue').App<any>, options?: MazUiOptions): Promise<void>;
+};

package/dist/types/plugins/toast/MazToast.vue.d.ts

@@ -0,0 +1,34 @@
+import { ToastOptions } from './types';
+export interface MazToastProps extends ToastOptions {
+    /**
+     * The message of the toast
+     */
+    message?: string;
+    /**
+     * The type of the toast
+     */
+    type?: ToastOptions['type'];
+    /**
+     * The function to destroy the toast
+     */
+    destroy?: () => void;
+}
+declare function closeToast(): void;
+declare const _default: import('vue').DefineComponent<MazToastProps, {
+    /**
+     * Close the toast
+     * @description This is used to close the toast
+     */
+    closeToast: typeof closeToast;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (args_0: Event) => any;
+    close: () => any;
+    open: () => any;
+}, string, import('vue').PublicProps, Readonly<MazToastProps> & Readonly<{
+    onClick?: ((args_0: Event) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    Toast: HTMLDivElement;
+}, any>;
+export default _default;

package/dist/types/plugins/toast/ToastHandler.d.ts

@@ -0,0 +1,29 @@
+import { App } from 'vue';
+import { ToastOptions } from './types';
+export declare class ToastHandler {
+    private readonly app;
+    private readonly globalOptions?;
+    constructor(app: App, globalOptions?: ToastOptions | undefined);
+    private show;
+    private getLocalOptions;
+    message(message: string, options?: ToastOptions): {
+        destroy: () => void;
+        close: () => any;
+    };
+    success(message: string, options?: Omit<ToastOptions, 'type'>): {
+        destroy: () => void;
+        close: () => any;
+    };
+    error(message: string, options?: Omit<ToastOptions, 'type'>): {
+        destroy: () => void;
+        close: () => any;
+    };
+    info(message: string, options?: Omit<ToastOptions, 'type'>): {
+        destroy: () => void;
+        close: () => any;
+    };
+    warning(message: string, options?: Omit<ToastOptions, 'type'>): {
+        destroy: () => void;
+        close: () => any;
+    };
+}