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

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

@@ -1,129 +1,305 @@
-import { DropzoneFile, DropzoneOptions } from 'dropzone';
-import { ComponentPublicInstance, PropType } from 'vue';
-export interface MazDropzoneOptions extends DropzoneOptions {
-    dictFilesDescriptions?: string;
-    autoRemoveOnError?: boolean;
-}
-export interface MazDropzoneFile extends DropzoneFile {
-    manuallyAdded?: boolean;
-}
-export interface IMazDropzone extends Dropzone {
-    options: MazDropzoneOptions;
-}
-export interface MazDropzoneInstance extends ComponentPublicInstance {
-    manuallyAddFile: (file: DropzoneFile, fileUrl: string) => void;
-    setOption: (option: string, value: unknown) => IMazDropzone['options'];
-    processQueue: IMazDropzone['processQueue'];
-    removeFile: IMazDropzone['removeFile'];
-    removeAllFiles: IMazDropzone['removeAllFiles'];
-    destroy: IMazDropzone['destroy'];
-    disable: IMazDropzone['disable'];
-    enable: IMazDropzone['enable'];
-    accept: IMazDropzone['accept'];
-    addFile: IMazDropzone['addFile'];
-    resizeImage: IMazDropzone['resizeImage'];
-    cancelUpload: IMazDropzone['cancelUpload'];
-    getAcceptedFiles: () => MazDropzoneFile[];
-    getRejectedFiles: () => MazDropzoneFile[];
-    getFilesWithStatus: IMazDropzone['getFilesWithStatus'];
-    getQueuedFiles: IMazDropzone['getQueuedFiles'];
-    getUploadingFiles: IMazDropzone['getUploadingFiles'];
-    getAddedFiles: IMazDropzone['getAddedFiles'];
-    getActiveFiles: IMazDropzone['getActiveFiles'];
-}
-declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    options: {
-        type: PropType<MazDropzoneOptions>;
-        required: true;
-    };
-    height: {
-        type: PropType<number | string>;
-        default: string;
-    };
-    width: {
-        type: PropType<number | string>;
-        default: string;
+import { MazBtnProps } from './MazBtn.vue';
+import { MazSpinnerProps } from './MazSpinner.vue';
+import { MazColor } from './types';
+type __VLS_Props = MazDropzoneProps;
+export type MazDropzoneErrorCode = 'FILE_SIZE_EXCEEDED' | 'MAX_FILES_EXCEEDED' | 'FILE_TYPE_NOT_ALLOWED' | 'FILE_DUPLICATED' | 'FILE_UPLOAD_ERROR' | 'NO_FILES_TO_UPLOAD' | 'FILE_UPLOAD_ERROR_MULTIPLE' | 'NO_URL' | 'FILE_SIZE_TOO_SMALL';
+export type MazDropzoneProps = {
+    /**
+     * The id of the dropzone
+     */
+    id?: string;
+    /**
+     * Allow multiple files to be uploaded.
+     * @default false
+     */
+    multiple?: boolean;
+    /**
+     * Allowed data types/MIME types for files (e.g. ['application/json'])
+     * @default ['*\/*']
+     */
+    dataTypes?: string[];
+    /**
+     * Prevent default behavior for unhandled drag & drop events.
+     * @default true
+     */
+    preventDefaultForUnhandled?: boolean;
+    /**
+     * Maximum file size in MB.
+     */
+    maxFileSize?: number;
+    /**
+     * Maximum number of files allowed.
+     */
+    maxFiles?: number;
+    /**
+     * Disable the dropzone
+     */
+    disabled?: boolean;
+    /**
+     * Show file preview
+     */
+    preview?: boolean;
+    /**
+     * Minimum file size in MB
+     */
+    minFileSize?: number;
+    /**
+     * Allow duplicates
+     * @default false
+     */
+    allowDuplicates?: boolean;
+    /**
+     * Translations
+     * @description Custom translations for the component
+     * @default {
+     *   dragAndDrop: 'Drag and drop your files',
+     *   fileMaxCount: 'Maximum {count} files',
+     *   fileMaxSize: 'Maximum {size} MB',
+     *   fileTypes: 'Allowed file types: {types}',
+     *   selectFile: 'Select file',
+     *   divider: 'or'
+     * }
+     */
+    translations?: {
+        dragAndDrop?: string;
+        fileMaxCount?: string;
+        fileMaxSize?: string;
+        fileTypes?: string;
+        selectFile?: string;
+        divider?: string;
     };
-    noDestroyOnUnmount: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, {
-    ButtonElement: import('vue').Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
-    dropzoneReady: import('vue').Ref<boolean, boolean>;
-    dropzoneOptions: import('vue').Ref<MazDropzoneOptions | undefined, MazDropzoneOptions | undefined>;
-    dropzoneStyle: import('vue').ComputedRef<{
-        width: string;
-        height: string;
-    }>;
-    setOption: (option: string, value: unknown) => MazDropzoneOptions;
-    manuallyAddFile: (file: DropzoneFile, fileUrl: string) => void;
-    removeAllFiles: (cancelIfNecessary?: boolean) => void;
-    processQueue: () => void;
-    destroy: () => Dropzone;
-    disable: () => void;
-    enable: () => void;
-    accept: (file: Dropzone.DropzoneFile, done: (error?: string | Error) => void) => void;
-    addFile: (file: Dropzone.DropzoneFile) => void;
-    resizeImage: (file: Dropzone.DropzoneFile, width?: number, height?: number, resizeMethod?: string, callback?: ((...args: any[]) => void) | undefined) => void;
-    cancelUpload: (file: Dropzone.DropzoneFile) => void;
-    getAcceptedFiles: () => MazDropzoneFile[];
-    getRejectedFiles: () => MazDropzoneFile[];
-    getFilesWithStatus: (status: string) => Dropzone.DropzoneFile[];
-    getQueuedFiles: () => Dropzone.DropzoneFile[];
-    getUploadingFiles: () => Dropzone.DropzoneFile[];
-    getAddedFiles: () => Dropzone.DropzoneFile[];
-    getActiveFiles: () => Dropzone.DropzoneFile[];
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "error" | "paste" | "reset" | "success" | "thumbnail" | "addedfile" | "addedfiles" | "removedfile" | "processing" | "processingmultiple" | "uploadprogress" | "totaluploadprogress" | "sending" | "sendingmultiple" | "canceled" | "canceledmultiple" | "complete" | "completemultiple" | "maxfilesexceeded" | "maxfilesreached" | "queuecomplete")[], "dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "error" | "paste" | "reset" | "success" | "thumbnail" | "addedfile" | "addedfiles" | "removedfile" | "processing" | "processingmultiple" | "uploadprogress" | "totaluploadprogress" | "sending" | "sendingmultiple" | "canceled" | "canceledmultiple" | "complete" | "completemultiple" | "maxfilesexceeded" | "maxfilesreached" | "queuecomplete", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    options: {
-        type: PropType<MazDropzoneOptions>;
-        required: true;
-    };
-    height: {
-        type: PropType<number | string>;
-        default: string;
-    };
-    width: {
-        type: PropType<number | string>;
-        default: string;
+    /**
+     * Main color of the component
+     * @default 'primary'
+     */
+    color?: MazColor;
+    /**
+     * MazBtn props [MazBtn props](/components/maz-btn#props)
+     * @default {}
+     */
+    selectFileBtnProps?: MazBtnProps;
+    /**
+     * MazBtn props [MazBtn props](/components/maz-btn#props)
+     * @default {}
+     */
+    removeFileBtnProps?: MazBtnProps;
+    /**
+     * MazSpinner props [MazSpinner props](/components/maz-spinner#props)
+     * @default {}
+     */
+    spinnerProps?: MazSpinnerProps;
+    /**
+     * Auto upload files
+     * @description If set to `multiple`, all files will be uploaded at once in a single request. If set to `single`, files will be uploaded one by one in separate requests. If set to `false`, no upload will be done automatically.
+     * @default false
+     */
+    autoUpload?: 'multiple' | 'single' | false;
+    /**
+     * Upload URL
+     * @description If set, files will be uploaded to the given URL.
+     */
+    url?: string;
+    /**
+     * Request options
+     * @description Request options to be used for the upload (using fetch) [Request options](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options)
+     * @example `{ mode: 'no-cors', headers: { 'Content-Type': 'multipart/form-data', 'Authorization': 'Bearer 1234567890' } }`
+     */
+    requestOptions?: RequestInit;
+    /**
+     * Transform the body of the request
+     */
+    transformBody?: (formData: FormData) => RequestInit['body'];
+};
+export interface MazDropzoneFileData {
+    file: File;
+    name?: string;
+    size?: number;
+    type?: string;
+    lastModified?: number;
+    sizeInMb?: string;
+    thumbnail?: string | undefined;
+    lastModifiedDate?: Date;
+    uploading?: boolean;
+    success?: boolean;
+    error?: boolean;
+    url?: string;
+}
+declare function getFormData(file: File): FormData;
+declare function getFormDataMultiple(): FormData;
+declare function uploadFilesMultiple(): Promise<void>;
+declare function uploadFiles(): Promise<void>;
+declare function handleFileInputClick(): void;
+declare function reset(): void;
+declare function addFile(file: File): void;
+declare function removeFile(file: File): void;
+type __VLS_PublicProps = {
+    modelValue?: MazDropzoneFileData[];
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        'files-area'?(_: {
+            filesData: MazDropzoneFileData[];
+        }): any;
+        'file-item'?(_: {
+            file: MazDropzoneFileData;
+        }): any;
+        'no-files-area'?(_: {
+            selectFile: typeof handleFileInputClick;
+        }): any;
+        'upload-icon'?(_: {}): any;
     };
-    noDestroyOnUnmount: {
-        type: BooleanConstructor;
-        default: boolean;
+    refs: {
+        dropZoneRef: HTMLLabelElement;
+        fileInput: HTMLInputElement;
     };
-}>> & Readonly<{
-    onError?: ((...args: any[]) => any) | undefined;
-    onPaste?: ((...args: any[]) => any) | undefined;
-    onDragend?: ((...args: any[]) => any) | undefined;
-    onDragenter?: ((...args: any[]) => any) | undefined;
-    onDragleave?: ((...args: any[]) => any) | undefined;
-    onDragover?: ((...args: any[]) => any) | undefined;
-    onDragstart?: ((...args: any[]) => any) | undefined;
-    onDrop?: ((...args: any[]) => any) | undefined;
-    onReset?: ((...args: any[]) => any) | undefined;
-    onComplete?: ((...args: any[]) => any) | undefined;
-    onSuccess?: ((...args: any[]) => any) | undefined;
-    onThumbnail?: ((...args: any[]) => any) | undefined;
-    onAddedfile?: ((...args: any[]) => any) | undefined;
-    onAddedfiles?: ((...args: any[]) => any) | undefined;
-    onRemovedfile?: ((...args: any[]) => any) | undefined;
-    onProcessing?: ((...args: any[]) => any) | undefined;
-    onProcessingmultiple?: ((...args: any[]) => any) | undefined;
-    onUploadprogress?: ((...args: any[]) => any) | undefined;
-    onTotaluploadprogress?: ((...args: any[]) => any) | undefined;
-    onSending?: ((...args: any[]) => any) | undefined;
-    onSendingmultiple?: ((...args: any[]) => any) | undefined;
-    onCanceled?: ((...args: any[]) => any) | undefined;
-    onCanceledmultiple?: ((...args: any[]) => any) | undefined;
-    onCompletemultiple?: ((...args: any[]) => any) | undefined;
-    onMaxfilesexceeded?: ((...args: any[]) => any) | undefined;
-    onMaxfilesreached?: ((...args: any[]) => any) | undefined;
-    onQueuecomplete?: ((...args: any[]) => any) | undefined;
-}>, {
-    width: string | number;
-    height: string | number;
-    noDestroyOnUnmount: boolean;
-}, {}, {
-    MazSpinner: import('vue').DefineComponent<import('./MazSpinner.vue').MazSpinnerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('./MazSpinner.vue').MazSpinnerProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    rootEl: HTMLLabelElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {
+    /**
+     * Upload files
+     * @description With this method, the files are uploaded one by one (a request for each file)
+     * @usage `mazDropzoneInstance.value?.uploadFiles()`
+     */
+    uploadFiles: typeof uploadFiles;
+    /**
+     * Upload multiple files
+     * @description With this method, the files are uploaded all at once in a single request
+     * @usage `mazDropzoneInstance.value?.uploadFilesMultiple()`
+     */
+    uploadFilesMultiple: typeof uploadFilesMultiple;
+    /**
+     * Get form data
+     * @description Get the form data of one file
+     * @usage `const formData = mazDropzoneInstance.value?.getFormData(file)`
+     */
+    getFormData: typeof getFormData;
+    /**
+     * Get form data multiple
+     * @description Get the form data of all files
+     * @usage `const formData = mazDropzoneInstance.value?.getFormDataMultiple()`
+     */
+    getFormDataMultiple: typeof getFormDataMultiple;
+    /**
+     * Reset the files
+     * @description Remove all files from the dropzone
+     * @usage `mazDropzoneInstance.value?.reset()`
+     */
+    reset: typeof reset;
+    /**
+     * Check if the files are uploading
+     * @type boolean
+     * @description Check if the files are uploading
+     * @usage `const isUploading = mazDropzoneInstance.value?.isUploading`
+     */
+    isUploading: import('vue').Ref<boolean, boolean>;
+    /**
+     * Add a file to the dropzone
+     * @description Add a file manually to the dropzone
+     * @usage `mazDropzoneInstance.value?.addFile(file)`
+     */
+    addFile: typeof addFile;
+    /**
+     * Remove a file from the dropzone
+     * @description Remove a file manually from the dropzone
+     * @usage `mazDropzoneInstance.value?.removeFile(file)`
+     */
+    removeFile: typeof removeFile;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    drop: (values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any;
+    error: (values: {
+        files: File[] | null;
+        event: DragEvent | null;
+        code: MazDropzoneErrorCode;
+    }) => any;
+    add: (value: File) => any;
+    enter: (values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any;
+    over: (values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any;
+    leave: (values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any;
+    "update:modelValue": (value: MazDropzoneFileData[]) => any;
+    remove: (value: File) => any;
+    "upload-error": (values: {
+        file: File;
+        code: MazDropzoneErrorCode;
+        error: unknown;
+    }) => any;
+    "upload-error-multiple": (values: {
+        files: File[];
+        code: MazDropzoneErrorCode;
+        error: unknown;
+    }) => any;
+    "upload-success": (values: {
+        file: File;
+        response?: Response;
+    }) => any;
+    "upload-success-multiple": (values: {
+        files: File[];
+        response?: Response;
+    }) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDrop?: ((values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any) | undefined;
+    onError?: ((values: {
+        files: File[] | null;
+        event: DragEvent | null;
+        code: MazDropzoneErrorCode;
+    }) => any) | undefined;
+    onAdd?: ((value: File) => any) | undefined;
+    onEnter?: ((values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any) | undefined;
+    onOver?: ((values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any) | undefined;
+    onLeave?: ((values: {
+        files: File[] | null;
+        event: DragEvent;
+    }) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: MazDropzoneFileData[]) => any) | undefined;
+    onRemove?: ((value: File) => any) | undefined;
+    "onUpload-error"?: ((values: {
+        file: File;
+        code: MazDropzoneErrorCode;
+        error: unknown;
+    }) => any) | undefined;
+    "onUpload-error-multiple"?: ((values: {
+        files: File[];
+        code: MazDropzoneErrorCode;
+        error: unknown;
+    }) => any) | undefined;
+    "onUpload-success"?: ((values: {
+        file: File;
+        response?: Response;
+    }) => any) | undefined;
+    "onUpload-success-multiple"?: ((values: {
+        files: File[];
+        response?: Response;
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    dropZoneRef: HTMLLabelElement;
+    fileInput: HTMLInputElement;
+}, HTMLLabelElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -10,28 +10,31 @@ export interface MazExpandAnimationProps {
      */
     timingFunction?: string;
 }
-declare let __VLS_typeProps: MazExpandAnimationProps;
+type __VLS_Props = MazExpandAnimationProps;
 type __VLS_PublicProps = {
     modelValue?: boolean;
-} & typeof __VLS_typeProps;
+} & __VLS_Props;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {
         expandAnimationRef: HTMLDivElement;
     };
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (modelValue: boolean) => any;
+    "update:modelValue": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((modelValue: boolean) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {
     duration: string;
     timingFunction: string;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    expandAnimationRef: HTMLDivElement;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1,18 +1,19 @@
-import { Color } from './types';
+import { MazColor } from './types';
 export interface MazFullscreenLoaderProps {
     /** The color of the spinner */
-    color?: Color;
+    color?: MazColor;
     /** The size of the spinner */
     size?: string;
     /** The selector to teleport the loader */
     teleportSelector?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<MazFullscreenLoaderProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<MazFullscreenLoaderProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;