@zjlab-fe/data-hub-ui 0.0.3 → 0.0.4

package/README.md

@@ -1,5 +1,11 @@
 # data-hub-ui
 
+## 组件文档
+
+组件的详细文档请参考以下链接:
+
+- [上传组件](./docs/uploadDrawer.md)
+
 ## 组件开发&调试
 
 ### 新建组件

package/dist/types/components/uploadDrawer/UploadStoreProvider.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import { UploadableFile } from './utils';
+export type UploadStore = {
+    [key: string]: UploadableFile[];
+};
+type UploadStoreAction = {
+    type: 'add';
+    identifier: string | number;
+} | {
+    type: 'edit_file';
+    identifier: string | number;
+    file: UploadableFile;
+} | {
+    type: 'remove_file';
+    identifier: string | number;
+    file: UploadableFile;
+} | {
+    type: 'add_file';
+    identifier: string | number;
+    file: UploadableFile;
+} | {
+    type: 'clear_finished';
+    identifier: string | number;
+} | {
+    type: 'add_files';
+    identifier: string | number;
+    files: UploadableFile[];
+};
+type UploadStoreDispatch = React.Dispatch<UploadStoreAction>;
+export declare const TEMP_STORE: {};
+export declare const UploadStoreContext: React.Context<UploadStore>;
+export declare const UploadStoreDispatchContext: React.Context<UploadStoreDispatch>;
+export default function UploadStoreProvider({ children }: {
+    children: React.ReactElement;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/uploadDrawer/demo/index.d.ts

@@ -0,0 +1 @@
+export default function Demo(): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/uploadDrawer/fileUploadDrawer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type FileUploadDrawerProps = {
+    open: boolean;
+    identifier: string;
+    accept?: string;
+    dragAreaDescription?: React.ReactNode;
+    footer?: React.ReactNode;
+    directory?: boolean;
+    onClose: () => void;
+};
+export default function FileUploadDrawer({ open, identifier, accept, dragAreaDescription, footer, directory, onClose, }: FileUploadDrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/uploadDrawer/fileUploadDrawerFileDragger.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+type FileDraggerProps = {
+    accept?: string;
+    directory?: boolean;
+    dragAreaDescription?: ReactNode;
+    onFileReceived: (_files: File[]) => void;
+};
+export default function FileUploadDrawerFileDragger({ accept, directory, dragAreaDescription, onFileReceived, }: FileDraggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/uploadDrawer/fileUploadDrawerList.d.ts

@@ -0,0 +1,4 @@
+export default function FileUploading({ identifier, showFinished, }: {
+    identifier: string;
+    showFinished: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/uploadDrawer/fileUploadDrawerListProgressButton.d.ts

@@ -0,0 +1,5 @@
+export default function FileUploadDrawerListProgressButton({ percent, status, onClick, }: {
+    percent: number;
+    status: number;
+    onClick: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/uploadDrawer/hooks/useCancelUpload.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '../utils';
+export declare function useCancelUpload(): (file: UploadableFile) => Promise<void>;

package/dist/types/components/uploadDrawer/hooks/useFilterFiles.d.ts

@@ -0,0 +1,7 @@
+/**
+ * useFilterFiles hook用于过滤上传文件
+ * 主要功能:
+ * 1. 检查文件大小是否超过限制
+ * 2. 检查是否有重复文件名
+ */
+export declare function useFilterFiles(): (files: File[]) => Promise<[Set<string>, Set<string>]>;

package/dist/types/components/uploadDrawer/hooks/useFinishUpload.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '../utils';
+export declare function useFinishUpload(): (file: UploadableFile) => Promise<void>;

package/dist/types/components/uploadDrawer/hooks/useFormatFiles.d.ts

@@ -0,0 +1 @@
+export declare function useFormatFiles(): (allFiles: File[]) => Promise<void>;

package/dist/types/components/uploadDrawer/hooks/useProgressButtonRef.d.ts

@@ -0,0 +1,4 @@
+export declare function useProgressButtonRef(): {
+    progressButtonRef: import("react").RefObject<HTMLButtonElement>;
+    buttonInHover: boolean;
+};

package/dist/types/components/uploadDrawer/hooks/useRemoveFilesInUploadQueue.d.ts

@@ -0,0 +1 @@
+export declare function useRemoveFilesInUploadQueue(): (duplicationOfName: Set<string>) => void;

package/dist/types/components/uploadDrawer/hooks/useResumeUnfinishedUploads.d.ts

@@ -0,0 +1 @@
+export declare function useResumeUnfinishedUploads(identifier: string): () => Promise<void>;

package/dist/types/components/uploadDrawer/hooks/useRetryUpload.d.ts

@@ -0,0 +1,5 @@
+import { UploadableFile } from '../utils';
+/**
+ * 自定义钩子函数,用于重试文件上传
+ */
+export declare function useRetryUpload(): (file: UploadableFile) => Promise<void>;

package/dist/types/components/uploadDrawer/hooks/useSaveUnfinishedUploads.d.ts

@@ -0,0 +1,2 @@
+import { UploadStore } from '../UploadStoreProvider';
+export declare function useSaveUnfinishedUploads(uploadStore: UploadStore): void;

package/dist/types/components/uploadDrawer/hooks/useSetupUpload.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '../utils';
+export declare function useSetupUpload(): (file: UploadableFile) => Promise<false | undefined>;

package/dist/types/components/uploadDrawer/hooks/useUploadFileToOSS.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '../utils';
+export declare function useUploadFileToOSS(): (file: UploadableFile, onSuccess?: (_file: UploadableFile) => void) => Promise<void>;

package/dist/types/components/uploadDrawer/index.d.ts

@@ -0,0 +1,44 @@
+import UploadStoreProvider from './UploadStoreProvider';
+import { FileUploadDrawerProps } from './fileUploadDrawer';
+import './index.css';
+export type UploadUrl = {
+    uploadUrl: string;
+    partNum: number;
+};
+export type FileInfo = {
+    fileName: string;
+    isFolder?: boolean;
+};
+export type UploadInfoErrorResult = {
+    status: false;
+    reason?: string;
+};
+type UploadInfoSuccessResult = {
+    status: true;
+    uploadInfo: {
+        uploadUrls: UploadUrl[];
+        uploadId: string;
+    };
+};
+export type UploadInfoResult = UploadInfoErrorResult | UploadInfoSuccessResult;
+export type FileUploadDrawerContextProps = {
+    identifier: string;
+    maxSizePerFile?: number;
+    directory?: boolean;
+    root?: string;
+    uploadHistory?: FileInfo[];
+    onSuccess?: (_file: FileInfo) => void;
+    getUploadUrls: (_fileName: string, _partCount: number) => Promise<UploadInfoResult>;
+    onCancelUpload: (_fileName: string, _uploadId: string) => Promise<UploadInfoErrorResult | {
+        status: true;
+    }>;
+    onOnePartDone: (_fileName: string, _uploadId: string, _partNum: number) => Promise<UploadInfoErrorResult | {
+        status: true;
+    }>;
+    onAllPartDone: (_fileName: string, _uploadId: string) => Promise<UploadInfoErrorResult | {
+        status: true;
+    }>;
+};
+export declare const FileUploadDrawerContext: import("react").Context<FileUploadDrawerContextProps>;
+export { UploadStoreProvider };
+export default function FileUploadDrawer(props: FileUploadDrawerContextProps & FileUploadDrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/uploadDrawer/utils/calcDisplaySize.d.ts

@@ -0,0 +1 @@
+export declare function calcDisplaySize(size: number): string;

package/dist/types/components/uploadDrawer/utils/constant.d.ts

@@ -0,0 +1,14 @@
+export declare const KB: 1024;
+export declare const MB: 1048576;
+export declare const GB: 1073741824;
+export declare const enum FILE_UPLOAD_STATUS {
+    INIT = 1,
+    UPLOADING = 2,
+    FINISHED = 3,
+    FAILED = 4,
+    PAUSED = 5,
+    CANCELED = 6
+}
+export declare const NEW: 1;
+export declare const STILL_NEED_CHECK: 0;
+export declare const USE_OLD_INFO: 2;

package/dist/types/components/uploadDrawer/utils/createFileToUpload.d.ts

@@ -0,0 +1,3 @@
+import { UploadableFile } from '.';
+import { FileUploadDrawerContextProps } from '..';
+export declare function createFileToUpload(raw: File, root: string | undefined, getUploadUrls: FileUploadDrawerContextProps['getUploadUrls']): Promise<UploadableFile>;

package/dist/types/components/uploadDrawer/utils/fileDB/deleteFileInStore.d.ts

@@ -0,0 +1 @@
+export declare function deleteFileInStore(storeName: string, fileName: string): void;

package/dist/types/components/uploadDrawer/utils/fileDB/deleteObjectStore.d.ts

@@ -0,0 +1 @@
+export declare function deleteObjectStore(storeNames: string[]): Promise<void>;

package/dist/types/components/uploadDrawer/utils/fileDB/handleAddFilesToDB.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '..';
+export declare function handleAddFilesToDB(storeName: string, files: UploadableFile[]): void;

package/dist/types/components/uploadDrawer/utils/fileDB/index.d.ts

@@ -0,0 +1,7 @@
+export declare const DATABASE_NAME = "uploadStore";
+export declare let UPLOADS_DATABASE: IDBDatabase;
+export declare function updateUploadsDatabase(db: IDBDatabase): void;
+export { openDB } from './openDB';
+export { handleAddFilesToDB } from './handleAddFilesToDB';
+export { deleteFileInStore } from './deleteFileInStore';
+export { deleteObjectStore } from './deleteObjectStore';

package/dist/types/components/uploadDrawer/utils/fileDB/openDB.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '..';
+export declare function openDB(storeName: string): Promise<UploadableFile[]>;

package/dist/types/components/uploadDrawer/utils/index.d.ts

@@ -0,0 +1,27 @@
+import { UploadUrl } from '..';
+export type UploadableFile = {
+    raw?: File;
+    fileStatus: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    partCount: number;
+    chunkSize: number;
+    uploadId: string;
+    fileName: string;
+    expiryTime?: string;
+    uploadUrls: UploadUrl[];
+    completeSeq: UploadUrl[];
+    failSeq: UploadUrl[];
+    cancelControllers: {
+        [key: string]: AbortController;
+    };
+    displaySize: string;
+    percentage: number;
+    uploadStatus: number[];
+};
+export * from './shouldCreateNewFile';
+export * from './constant';
+export * from './createFileToUpload';
+export * from './reloadSaveData';
+export * from './splitFileIntoChunk';
+export * from './calcDisplaySize';
+export { deleteFileInStore, deleteObjectStore, handleAddFilesToDB, openDB } from './fileDB';
+export * from './retrieveAllFiles';

package/dist/types/components/uploadDrawer/utils/reloadSaveData.d.ts

@@ -0,0 +1,2 @@
+import { UploadableFile } from '.';
+export declare function reloadSaveData(identifier: string): Promise<UploadableFile[]>;

package/dist/types/components/uploadDrawer/utils/retrieveAllFiles.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 递归检索所有文件
+ * @param item - 文件系统条目
+ * @param directory - 是否允许处理目录
+ * @param acceptList - 可接受的文件扩展名集合
+ * @param fileNameWithLocation - 文件的完整路径
+ * @returns 符合条件的文件数组
+ */
+export declare function retrieveAllFiles(item: FileSystemEntry, directory: boolean, acceptList: Set<string>, fileNameWithLocation?: string): Promise<File[]>;

package/dist/types/components/uploadDrawer/utils/shouldCreateNewFile.d.ts

@@ -0,0 +1,2 @@
+import { NEW, USE_OLD_INFO, UploadableFile } from '.';
+export declare function checkExpiryTime(file: UploadableFile): typeof NEW | typeof USE_OLD_INFO;

package/dist/types/components/uploadDrawer/utils/splitFileIntoChunk.d.ts

@@ -0,0 +1,8 @@
+import { UploadableFile } from '.';
+import { UploadUrl } from '..';
+type ChunkInfo = {
+    url: UploadUrl;
+    chunk: Blob;
+};
+export declare function splitFileIntoChunk(file: UploadableFile): ChunkInfo[];
+export {};

package/dist/types/demo/router/index.d.ts

@@ -0,0 +1,10 @@
+import { createBrowserRouter } from 'react-router-dom';
+export declare const routerConfig: {
+    path: string;
+    element: import("react/jsx-runtime").JSX.Element;
+    children: {
+        path: string;
+        element: import("react/jsx-runtime").JSX.Element;
+    }[];
+}[];
+export declare const router: ReturnType<typeof createBrowserRouter>;

package/dist/types/index.d.ts

@@ -1,3 +1,4 @@
 export { default as Header } from './components/header';
 export { default as InputTag } from './components/input-tag';
 export type { IProps as InputTagProps } from './components/input-tag';
+export { default as FileUploadDrawer, UploadStoreProvider } from './components/uploadDrawer';