maz-ui 4.0.0-alpha.4 → 4.0.0-beta.0

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

@@ -0,0 +1,104 @@
+import { IconComponent } from '@maz-ui/icons';
+import { RouteLocationRaw } from 'vue-router';
+import { MazBtnProps } from '../../components/MazBtn.vue';
+import { MazColor } from '../../components/types';
+export type ToastPosition = 'top' | 'top-right' | 'top-left' | 'bottom' | 'bottom-right' | 'bottom-left';
+export interface ToastButton extends MazBtnProps {
+    /**
+     * If the toast is closed when the button is clicked
+     * @default false
+     */
+    closeToast?: boolean;
+    /**
+     * The text of the button
+     */
+    text?: string;
+    /**
+     * The target of the button
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target
+     * @default _self
+     */
+    target?: string;
+    /**
+     * The method to call when the button is clicked
+     */
+    onClick?: () => unknown;
+    /**
+     * The route to navigate to when the button is clicked
+     * (only with `vue-router`)
+     */
+    to?: RouteLocationRaw;
+    /**
+     * The URL to navigate to when the button is clicked
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href
+     */
+    href?: string;
+    /**
+     * The size of the button
+     * @default 'xs'
+     */
+    size?: MazBtnProps['size'];
+    /**
+     * The color of the button
+     * @default color of the toast
+     */
+    color?: MazBtnProps['color'];
+}
+export interface ToastOptions {
+    /**
+     * If the message is HTML
+     * @default false
+     */
+    html?: boolean;
+    /**
+     * The type of the toast
+     * @default 'info'
+     */
+    type?: MazColor;
+    /**
+     * The maximum number of toasts to display
+     * @default false
+     */
+    maxToasts?: number | boolean;
+    /**
+     * If the toast is queued, it will be displayed in the order of the toasts
+     * @default false
+     */
+    queue?: boolean;
+    /**
+     * The position of the toast on the screen
+     * @default 'bottom-right'
+     */
+    position?: ToastPosition;
+    /**
+     * If the toast is paused on hover, it will be paused when the mouse is over the toast
+     * @default true
+     */
+    pauseOnHover?: boolean;
+    /**
+     * The timeout is in ms, it's the time before the toast is automatically closed
+     * if set to `false`, the toast will not be closed automatically
+     * @default 10000
+     */
+    timeout?: number | boolean;
+    /**
+     * If the toast is persistent, the user should close it manually
+     * @default false
+     */
+    persistent?: boolean;
+    /**
+     * Display an icon in the toast
+     * @default true
+     */
+    icon?: false | IconComponent;
+    /**
+     * The action will be displayed as a button in the toast
+     * @default undefined
+     */
+    button?: ToastButton;
+    /**
+     * The actions will be displayed as a buttons in the toast
+     * @default undefined
+     */
+    buttons?: ToastButton[];
+}

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

@@ -0,0 +1,27 @@
+import { App } from 'vue';
+import { ToastOptions } from './toast/types';
+import { ToastHandler } from './toast/ToastHandler';
+export declare const ToastPlugin: {
+    install(app: App, options?: ToastOptions): void;
+};
+declare module '@vue/runtime-core' {
+    interface ComponentCustomProperties {
+        /**
+         * Toast handler instance
+         * @description You should install the plugin to use this property
+         * @example
+         * ```ts
+         * import { ToastPlugin } from 'maz-ui/plugins/toast'
+         * import { createApp } from 'vue'
+         *
+         * const app = createApp(App)
+         * app.use(ToastPlugin)
+         *
+         * const toast = useToast()
+         * toast.success('Hello, world!')
+         */
+        $mazToast: ToastHandler;
+    }
+}
+export { ToastHandler };
+export type { ToastOptions, ToastPosition } from './toast/types';

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

@@ -1,14 +1,34 @@
-import { App } from 'vue';
-import { LoaderId } from './wait/utils';
+type LoaderId = string | symbol | number;
 export declare class WaitHandler {
     private _loaders;
-    get loaders(): import('vue').ComputedRef<unknown[]>;
-    stop(loaderId?: LoaderId): void;
-    start(loaderId?: LoaderId): () => void;
-    get anyLoading(): import('vue').ComputedRef<boolean>;
+    get loaders(): import('vue').ComputedRef<LoaderId[]>;
+    stop(loaderId?: LoaderId): this;
+    start(loaderId?: LoaderId): this;
     isLoading(loaderId?: LoaderId): boolean;
+    get anyLoading(): import('vue').ComputedRef<boolean>;
 }
-export declare const instance: WaitHandler;
-export declare const plugin: {
-    install: (app: App) => void;
+export declare const waitInstance: WaitHandler;
+export declare const WaitPlugin: {
+    install: (app: import('vue').App<any>) => void;
 };
+declare module '@vue/runtime-core' {
+    interface ComponentCustomProperties {
+        /**
+         * Wait handler instance
+         * @description You should install the plugin to use this property
+         * @examl
+         * ```ts
+         * import { WaitPlugin } from 'maz-ui/plugins/wait'
+         * import { createApp } from 'vue'
+         *
+         * const app = createApp(App)
+         * app.use(WaitPlugin)
+         *
+         * const wait = useWait()
+         * wait.start()
+         * ```
+         */
+        $mazWait: WaitHandler;
+    }
+}
+export {};

package/dist/types/resolvers/MazComponentsResolver.d.ts

@@ -0,0 +1,10 @@
+import { ComponentResolver } from 'unplugin-vue-components/types';
+/**
+ * Resolver for Maz-UI (components)
+ *
+ * @author @louismazel
+ * @link https://maz-ui.com
+ */
+export declare function MazComponentsResolver(options?: {
+    devMode?: boolean;
+}): ComponentResolver;

package/dist/types/resolvers/MazDirectivesResolver.d.ts

@@ -0,0 +1,11 @@
+import { ComponentResolver } from 'unplugin-vue-components/types';
+/**
+ * Resolver for Maz-UI (directives)
+ *
+ * @author @louismazel
+ * @link https://maz-ui.com
+ */
+export declare function MazDirectivesResolver(options?: {
+    devMode?: boolean;
+    prefix?: string;
+}): ComponentResolver;

package/dist/types/resolvers/MazModulesResolver.d.ts

@@ -0,0 +1,11 @@
+import { ResolverFunction } from 'unplugin-auto-import/types';
+/**
+ * Resolver for Maz-UI (modules)
+ *
+ * @author @louismazel
+ * @link https://maz-ui.com
+ */
+export declare function MazModulesResolver(options?: {
+    devMode?: boolean;
+    prefix?: string;
+}): ResolverFunction;

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

@@ -1,3 +1,3 @@
-export * from './UnpluginDirectivesResolver';
-export * from './UnpluginModulesResolver';
-export * from './UnpluginVueComponentsResolver';
+export * from './MazComponentsResolver';
+export * from './MazDirectivesResolver';
+export * from './MazModulesResolver';

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

@@ -0,0 +1,6 @@
+export * from './tailwind.config';
+export * from './utils/colors';
+export { getNumericScreensFromTailwind, screens } from './variables/breakpoints';
+export * from './variables/colors';
+export * from './variables/design-tokens';
+export { zIndex } from './variables/z-indexes';

package/dist/types/tailwindcss/tailwind.config.d.ts

@@ -0,0 +1,84 @@
+import { Config } from 'tailwindcss';
+import { getNumericScreensFromTailwind } from './variables/breakpoints';
+export { getNumericScreensFromTailwind };
+export declare function defineMazTailwindConfig(config?: Partial<Config> & {
+    content: Config['content'];
+}): {
+    content: (import('tailwindcss/types/config').ContentConfig | undefined) & import('tailwindcss/types/config').ContentConfig;
+    important?: Partial<import('tailwindcss/types/config').ImportantConfig> | undefined;
+    prefix?: string | undefined;
+    separator?: string | undefined;
+    safelist?: import('tailwindcss/types/config').SafelistConfig[] | undefined;
+    blocklist?: string[] | undefined;
+    presets?: Partial<import('tailwindcss/types/config').Config>[] | undefined;
+    future?: Partial<import('tailwindcss/types/config').FutureConfig> | undefined;
+    experimental?: Partial<import('tailwindcss/types/config').ExperimentalConfig> | undefined;
+    darkMode: Partial<import('tailwindcss/types/config').DarkModeConfig>;
+    theme: Partial<import('tailwindcss/types/config').CustomThemeConfig & {
+        extend: Partial<import('tailwindcss/types/config').CustomThemeConfig>;
+    }> | {
+        extend: {
+            colors: import('tailwindcss/types/config').ResolvableTo<import('tailwindcss/types/config').RecursiveKeyValuePair<string, string>>;
+            screens: {
+                'mob-s': string;
+                'mob-m': string;
+                'mob-l': string;
+                'tab-s': string;
+                'tab-m': string;
+                'tab-l': string;
+                'lap-s': string;
+                'lap-m': string;
+                'lap-l': string;
+                'lap-xl': string;
+                'lap-2xl': string;
+                'lap-3xl': string;
+            };
+            zIndex: {
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                '5': string;
+                '15': string;
+                '25': string;
+                '35': string;
+                '45': string;
+                '75': string;
+                '100': string;
+                'default-backdrop': string;
+            };
+            borderRadius: {
+                sm: string;
+                md: string;
+                DEFAULT: string;
+                lg: string;
+                xl: string;
+            };
+            borderWidth: {
+                DEFAULT: string;
+                0: string;
+                2: string;
+                4: string;
+                8: string;
+            };
+            fontFamily: {
+                sans: string;
+            };
+            transitionDuration: {
+                DEFAULT: string;
+            };
+            transitionTimingFunction: {
+                DEFAULT: string;
+            };
+            boxShadow: {
+                sm: string;
+                DEFAULT: string;
+                md: string;
+                lg: string;
+                xl: string;
+            };
+        };
+    };
+    corePlugins?: Partial<import('tailwindcss/types/config').CorePluginsConfig> | undefined;
+    plugins: Partial<import('tailwindcss/types/config').PluginsConfig>;
+};

package/dist/types/tailwindcss/utils/colors.d.ts

@@ -0,0 +1,7 @@
+import { ThemeConfig } from 'tailwindcss/types/config';
+export declare function getColors(): ThemeConfig['colors'];
+export declare function createScaleColor(colorName: string): Record<string, string>;
+export declare function createSimpleColor(colorName: string, withForeground?: boolean): string | {
+    DEFAULT: string;
+    foreground: string;
+};

package/dist/types/tailwindcss/variables/breakpoints.d.ts

@@ -0,0 +1,15 @@
+export declare const screens: {
+    'mob-s': string;
+    'mob-m': string;
+    'mob-l': string;
+    'tab-s': string;
+    'tab-m': string;
+    'tab-l': string;
+    'lap-s': string;
+    'lap-m': string;
+    'lap-l': string;
+    'lap-xl': string;
+    'lap-2xl': string;
+    'lap-3xl': string;
+};
+export declare function getNumericScreensFromTailwind<T extends Record<string, string> | Record<string, number>>(inputScreens: T): Record<keyof T, number>;

package/dist/types/tailwindcss/variables/colors.d.ts

@@ -0,0 +1,20 @@
+export declare const baseColors: {};
+export declare const scaleColors: {
+    readonly primary: "primary";
+    readonly secondary: "secondary";
+    readonly accent: "accent";
+    readonly destructive: "destructive";
+    readonly success: "success";
+    readonly warning: "warning";
+    readonly contrast: "contrast";
+    readonly info: "info";
+    readonly foreground: "foreground";
+    readonly surface: "background";
+    readonly divider: "border";
+    readonly elevation: "shadow";
+    readonly overlay: "overlay";
+    readonly muted: "muted";
+};
+export declare const colorScales: readonly ["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
+export type ScaleColorName = keyof typeof scaleColors;
+export type ColorScale = typeof colorScales[number];

package/dist/types/tailwindcss/variables/design-tokens.d.ts

@@ -0,0 +1,32 @@
+export declare const designTokens: {
+    borderRadius: {
+        sm: string;
+        md: string;
+        DEFAULT: string;
+        lg: string;
+        xl: string;
+    };
+    borderWidth: {
+        DEFAULT: string;
+        0: string;
+        2: string;
+        4: string;
+        8: string;
+    };
+    fontFamily: {
+        sans: string;
+    };
+    transitionDuration: {
+        DEFAULT: string;
+    };
+    transitionTimingFunction: {
+        DEFAULT: string;
+    };
+    boxShadow: {
+        sm: string;
+        DEFAULT: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+};

package/dist/types/tailwindcss/variables/utilities.d.ts

@@ -0,0 +1,17 @@
+export declare const utilities: {
+    '.flex-center': {
+        'align-items': string;
+        'justify-content': string;
+    };
+    '.padded-container-no-p': {
+        width: string;
+        'padding-inline': string;
+    };
+    '.padded-container': {
+        width: string;
+        'padding-inline': string;
+    };
+    '.cap-f::first-letter': {
+        'text-transform': string;
+    };
+};

package/dist/types/tailwindcss/variables/z-indexes.d.ts

@@ -0,0 +1,14 @@
+export declare const zIndex: {
+    '1': string;
+    '2': string;
+    '3': string;
+    '4': string;
+    '5': string;
+    '15': string;
+    '25': string;
+    '35': string;
+    '45': string;
+    '75': string;
+    '100': string;
+    'default-backdrop': string;
+};