@zjpcy/simple-design 1.6.0 → 1.8.2

package/dist/types/components/Upload/types.d.ts

@@ -1,15 +1,99 @@
 import React from 'react';
+/**
+ * Upload 组件样式配置
+ */
+export interface UploadStyles {
+    /** 上传容器自定义样式 */
+    wrapper?: React.CSSProperties;
+    /** 拖拽区域自定义样式 */
+    dragArea?: React.CSSProperties;
+    /** 拖拽图标自定义样式 */
+    dragIcon?: React.CSSProperties;
+    /** 拖拽文本自定义样式 */
+    dragText?: React.CSSProperties;
+    /** 拖拽提示自定义样式 */
+    dragHint?: React.CSSProperties;
+    /** 文件列表容器自定义样式 */
+    list?: React.CSSProperties;
+    /** 文件列表项自定义样式 */
+    listItem?: React.CSSProperties;
+    /** 文件信息区域自定义样式 */
+    listItemInfo?: React.CSSProperties;
+    /** 文件名自定义样式 */
+    listItemName?: React.CSSProperties;
+    /** 文件图标自定义样式 */
+    listItemIcon?: React.CSSProperties;
+    /** 文件操作区域自定义样式 */
+    listItemActions?: React.CSSProperties;
+    /** 文件操作按钮自定义样式 */
+    listItemAction?: React.CSSProperties;
+    /** 进度条容器自定义样式 */
+    progress?: React.CSSProperties;
+    /** 进度条自定义样式 */
+    progressBar?: React.CSSProperties;
+}
+/**
+ * 上传文件对象
+ */
 export interface UploadFile {
+    /** 文件唯一标识 */
     uid: string;
+    /** 文件名 */
     name: string;
+    /** 文件大小（字节） */
     size: number;
+    /** 文件类型 */
     type: string;
+    /** 上传状态 */
     status?: 'ready' | 'uploading' | 'success' | 'error';
+    /** 上传进度（0-100） */
     percent?: number;
+    /** 上传响应数据 */
     response?: any;
+    /** 上传错误信息 */
     error?: Error;
+    /** 原始文件对象 */
     raw?: File;
 }
+/**
+ * 显示上传列表配置
+ */
+export interface ShowUploadListType {
+    /** 是否显示删除图标 */
+    showRemoveIcon?: boolean;
+    /** 是否显示预览图标 */
+    showPreviewIcon?: boolean;
+    /** 是否显示下载图标 */
+    showDownloadIcon?: boolean;
+}
+/**
+ * 上传请求配置选项
+ */
+export interface UploadRequestOptions {
+    /** 上传地址 */
+    action: string;
+    /** 文件字段名 */
+    filename: string;
+    /** 文件对象 */
+    file: File;
+    /** 额外数据 */
+    data?: Record<string, any>;
+    /** 请求头 */
+    headers?: Record<string, string>;
+    /** 是否携带 cookie */
+    withCredentials?: boolean;
+    /** 进度回调 */
+    onProgress: (percent: number) => void;
+    /** 成功回调 */
+    onSuccess: (response: any) => void;
+    /** 错误回调 */
+    onError: (error: Error) => void;
+    /** 请求方法 */
+    method: string;
+}
+/**
+ * 上传组件 Props
+ */
 export interface UploadProps {
     /** 上传地址 */
     action?: string;
@@ -17,7 +101,7 @@ export interface UploadProps {
     defaultFileList?: UploadFile[];
     /** 已经上传的文件列表（受控） */
     fileList?: UploadFile[];
-    /** 上传文件改变时的状态 */
+    /** 上传文件改变时的回调 */
     onChange?: (fileList: UploadFile[]) => void;
     /** 上传文件之前的钩子，参数为上传的文件 */
     beforeUpload?: (file: File, fileList: File[]) => boolean | Promise<File>;
@@ -50,7 +134,9 @@ export interface UploadProps {
     /** 上传组件的类名 */
     className?: string;
     /** 自定义上传方法 */
-    customRequest?: (options: UploadRequestOptions) => void;
+    customRequest?: (options: UploadRequestOptions) => {
+        abort: () => void;
+    } | void;
     /** 文件列表渲染 */
     itemRender?: (file: UploadFile, fileList: UploadFile[]) => React.ReactNode;
     /** 是否显示文件列表 */
@@ -61,30 +147,208 @@ export interface UploadProps {
     children?: React.ReactNode;
     /** 最大上传文件数量 */
     maxCount?: number;
+    /** 自定义样式 */
+    customStyles?: UploadStyles;
+    /** 是否启用分片上传 */
+    chunked?: boolean;
+    /** 分片上传配置 */
+    chunkOptions?: ChunkOptions;
+    /** 合并分片接口地址（分片上传时使用） */
+    mergeAction?: string;
+    /** 自定义分片上传方法 */
+    customChunkRequest?: (options: ChunkUploadRequestOptions) => {
+        abort: () => void;
+    } | void;
+    /** 自定义合并分片方法 */
+    customMergeRequest?: (options: MergeChunksRequestOptions) => {
+        abort: () => void;
+    } | void;
+    /** 分片上传进度回调 */
+    onChunkProgress?: (chunkIndex: number, percent: number, file: UploadFile) => void;
+    /** 分片上传成功回调 */
+    onChunkSuccess?: (chunkIndex: number, response: any, file: UploadFile) => void;
+    /** 分片上传失败回调 */
+    onChunkError?: (chunkIndex: number, error: Error, file: UploadFile) => void;
 }
-export interface ShowUploadListType {
-    showRemoveIcon?: boolean;
-    showPreviewIcon?: boolean;
-    showDownloadIcon?: boolean;
+/**
+ * 上传列表组件 Props
+ */
+export interface UploadListProps {
+    /** 文件列表 */
+    fileList: UploadFile[];
+    /** 移除文件回调 */
+    onRemove: (file: UploadFile) => void;
+    /** 是否显示文件列表 */
+    showUploadList?: boolean | ShowUploadListType;
+    /** 自定义渲染文件列表 */
+    itemRender?: (file: UploadFile, fileList: UploadFile[]) => React.ReactNode;
 }
-export interface UploadRequestOptions {
+/**
+ * 拖拽上传组件 Props
+ */
+export interface UploadDragProps extends Omit<UploadProps, 'drag'> {
+    /** 子元素 */
+    children?: React.ReactNode;
+}
+/**
+ * 分片字段名配置
+ */
+export interface ChunkFieldNames {
+    /** 分片索引字段名，默认 'chunkIndex' */
+    chunkIndex?: string;
+    /** 总分片数字段名，默认 'totalChunks' */
+    totalChunks?: string;
+    /** 文件唯一标识字段名，默认 'fileId' */
+    fileId?: string;
+    /** 文件名字段名，默认 'fileName' */
+    fileName?: string;
+    /** 文件大小字段名，默认 'fileSize' */
+    fileSize?: string;
+    /** 其他自定义字段 */
+    [x: string]: string | undefined;
+}
+/**
+ * 合并分片字段名配置
+ */
+export interface MergeFieldNames {
+    /** 文件唯一标识字段名，默认 'fileId' */
+    fileId?: string;
+    /** 文件名字段名，默认 'filename' */
+    filename?: string;
+    /** 总分片数字段名，默认 'totalChunks' */
+    totalChunks?: string;
+    /** 文件总大小字段名，默认 'totalSize' */
+    totalSize?: string;
+    /** 其他自定义字段 */
+    [x: string]: string | undefined;
+}
+/**
+ * 分片配置选项
+ */
+export interface ChunkOptions {
+    /** 每个分片的大小（字节），默认 2MB */
+    chunkSize?: number;
+    /** 同时上传的分片数量，默认 3 */
+    concurrency?: number;
+    /** 是否支持断点续传 */
+    resumable?: boolean;
+    /** 重试次数 */
+    retryCount?: number;
+    /** 重试延迟（毫秒） */
+    retryDelay?: number;
+    /** 分片字段名配置 */
+    fieldNames?: ChunkFieldNames;
+    /** 合并分片字段名配置 */
+    mergeFieldNames?: MergeFieldNames;
+}
+/**
+ * 分片信息
+ */
+export interface ChunkInfo {
+    /** 分片索引 */
+    index: number;
+    /** 分片起始字节位置 */
+    start: number;
+    /** 分片结束字节位置 */
+    end: number;
+    /** 分片大小 */
+    size: number;
+    /** 分片数据 */
+    blob: Blob;
+    /** 分片状态 */
+    status: 'pending' | 'uploading' | 'success' | 'error';
+    /** 重试次数 */
+    retryCount: number;
+}
+/**
+ * 分片上传状态
+ */
+export interface ChunkUploadState {
+    /** 文件唯一标识 */
+    fileId: string;
+    /** 总分片数 */
+    totalChunks: number;
+    /** 已上传分片数 */
+    uploadedChunks: number;
+    /** 已上传分片索引集合 */
+    uploadedChunkIndices: Set<number>;
+    /** 分片列表 */
+    chunks: ChunkInfo[];
+    /** 整体进度（0-100） */
+    percent: number;
+}
+/**
+ * 分片上传请求参数
+ */
+export interface ChunkUploadRequestOptions {
+    /** 上传地址 */
     action: string;
+    /** 文件字段名 */
     filename: string;
+    /** 文件对象 */
     file: File;
+    /** 文件唯一标识 */
+    fileId: string;
+    /** 当前分片 */
+    chunk: ChunkInfo;
+    /** 总分片数 */
+    totalChunks: number;
+    /** 额外数据 */
     data?: Record<string, any>;
+    /** 请求头 */
     headers?: Record<string, string>;
+    /** 是否携带 cookie */
     withCredentials?: boolean;
+    /** 请求方法 */
+    method: string;
+    /** 进度回调 */
     onProgress: (percent: number) => void;
+    /** 成功回调 */
     onSuccess: (response: any) => void;
+    /** 错误回调 */
     onError: (error: Error) => void;
-    method: string;
 }
-export interface UploadListProps {
-    fileList: UploadFile[];
-    onRemove: (file: UploadFile) => void;
-    showUploadList?: boolean | ShowUploadListType;
-    itemRender?: (file: UploadFile, fileList: UploadFile[]) => React.ReactNode;
+/**
+ * 合并分片请求参数
+ */
+export interface MergeChunksRequestOptions {
+    /** 合并接口地址 */
+    action: string;
+    /** 文件唯一标识 */
+    fileId: string;
+    /** 文件名 */
+    filename: string;
+    /** 总分片数 */
+    totalChunks: number;
+    /** 文件总大小 */
+    totalSize: number;
+    /** 额外数据 */
+    data?: Record<string, any>;
+    /** 请求头 */
+    headers?: Record<string, string>;
+    /** 是否携带 cookie */
+    withCredentials?: boolean;
+    /** 成功回调 */
+    onSuccess: (response: any) => void;
+    /** 错误回调 */
+    onError: (error: Error) => void;
 }
-export interface UploadDragProps extends Omit<UploadProps, 'drag'> {
-    children?: React.ReactNode;
+/**
+ * 分片上传 hooks 返回类型
+ */
+export interface UseChunkUploadReturn {
+    /** 开始分片上传 */
+    upload: (file: File) => Promise<void>;
+    /** 暂停上传 */
+    pause: () => void;
+    /** 恢复上传 */
+    resume: () => void;
+    /** 取消上传 */
+    abort: () => void;
+    /** 当前上传状态 */
+    state: ChunkUploadState | null;
+    /** 是否正在上传 */
+    isUploading: boolean;
+    /** 是否已暂停 */
+    isPaused: boolean;
 }

package/dist/types/components/Upload/useChunkUpload.d.ts

@@ -0,0 +1,27 @@
+import { ChunkOptions, ChunkUploadRequestOptions, MergeChunksRequestOptions, UseChunkUploadReturn, UploadFile } from './types';
+/**
+ * 分片上传 Hook
+ */
+export declare const useChunkUpload: (options: {
+    action?: string;
+    mergeAction?: string;
+    filename?: string;
+    data?: Record<string, any> | ((file: File) => Record<string, any>);
+    headers?: Record<string, string>;
+    withCredentials?: boolean;
+    method?: string;
+    chunkOptions?: ChunkOptions;
+    customChunkRequest?: (options: ChunkUploadRequestOptions) => {
+        abort: () => void;
+    } | void;
+    customMergeRequest?: (options: MergeChunksRequestOptions) => {
+        abort: () => void;
+    } | void;
+    onProgress?: (percent: number, file: UploadFile) => void;
+    onSuccess?: (response: any, file: UploadFile) => void;
+    onError?: (error: Error, file: UploadFile) => void;
+    onChunkProgress?: (chunkIndex: number, percent: number, file: UploadFile) => void;
+    onChunkSuccess?: (chunkIndex: number, response: any, file: UploadFile) => void;
+    onChunkError?: (chunkIndex: number, error: Error, file: UploadFile) => void;
+}) => UseChunkUploadReturn;
+export default useChunkUpload;

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

@@ -22,12 +22,11 @@ export type { IconProps } from './Icon';
 export { default as Input, Textarea } from './Input';
 export type { InputProps, NumberInputProps, PasswordProps, TextareaProps } from './Input';
 export { default as Marquee } from './Marquee';
+export type { MarqueeProps } from './Marquee';
 export { default as Message, MessageProvider, useMessage, message } from './Message';
 export type { MessageProps, MessageInstance, MessageType } from './Message/types';
 export { default as Modal } from './Modal';
 export type { ModalProps } from './Modal/types';
-export { default as Notice } from './Notice/Notice';
-export type { NoticeProps, NoticeType } from './Notice/Notice';
 export { default as Notification } from './Notification/Notification';
 export type { NotificationProps, NotificationPosition } from './Notification/types';
 export { default as Radio } from './Radio';
@@ -37,6 +36,7 @@ export type { SelectProps, SelectOption, TagRenderProps } from './Select/types';
 export { default as Table } from './Table';
 export type { TableProps, RowSelection, Column, PaginationProps as TablePaginationProps } from './Table';
 export { default as Top } from './Top';
+export type { TopProps } from './Top';
 export { default as Typography } from './Typography';
 export type { TypographyProps } from './Typography/types';
 export { default as Masonry } from './Masonry';
@@ -97,7 +97,8 @@ export { default as Tree } from './Tree';
 export type { TreeProps, TreeNode, TreeNodeTooltip, TreeNodeProps, TreeState } from './Tree/types';
 export type { TreeRef } from './Tree';
 export { default as Upload } from './Upload';
-export type { UploadProps, UploadFile, UploadRequestOptions, ShowUploadListType, UploadListProps, UploadDragProps } from './Upload/types';
+export { useChunkUpload } from './Upload/useChunkUpload';
+export type { UploadProps, UploadFile, UploadRequestOptions, ShowUploadListType, UploadListProps, UploadDragProps, ChunkOptions, ChunkFieldNames, MergeFieldNames, ChunkInfo, ChunkUploadState, ChunkUploadRequestOptions, MergeChunksRequestOptions, UseChunkUploadReturn } from './Upload/types';
 export { default as Splitter } from './Splitter';
 export type { SplitterProps, SplitterPanel, DragState, PanelSizeInfo } from './Splitter/types';
 export { default as Calendar } from './Calendar';

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

@@ -1,3 +1,3 @@
-import i18n from 'i18next';
+import { i18n } from '../utils/i18n-adapter';
 export declare function initializeI18n(resources: Record<string, any>): void;
 export default i18n;

package/dist/types/utils/dnd-kit-adapter.d.ts

@@ -0,0 +1,2 @@
+export { useSortable, SortableContext, arrayMove, verticalListSortingStrategy, horizontalListSortingStrategy, sortableKeyboardCoordinates, } from '@dnd-kit/sortable';
+export type { UseSortableArguments, SortableContextProps } from '@dnd-kit/sortable';

package/dist/types/utils/i18n-adapter.d.ts

@@ -0,0 +1,5 @@
+export { default as i18n } from 'i18next';
+export * from 'i18next';
+export { I18nextProvider, useTranslation, initReactI18next, Trans, withTranslation, Translation, } from 'react-i18next';
+export type { i18n as I18n, Resource, TFunction, InitOptions, } from 'i18next';
+export type { UseTranslationOptions, UseTranslationResponse, I18nextProviderProps, TransProps, WithTranslation, } from 'react-i18next';

package/dist/types/utils/lunar-adapter.d.ts

@@ -0,0 +1,2 @@
+export { Solar, Lunar, HolidayUtil } from 'lunar-typescript';
+export type { Solar as SolarType, Lunar as LunarType } from 'lunar-typescript';

package/package.json

@@ -1,11 +1,31 @@
 {
   "name": "@zjpcy/simple-design",
-  "version": "1.6.0",
+  "version": "1.8.2",
   "description": "zjpcy Studio Design System - React Component Library",
-  "main": "dist/cjs/index.js",
-  "module": "dist/es/index.js",
+  "main": "dist/cjs/components/index.js",
+  "module": "dist/es/components/index.js",
   "types": "dist/types/components/index.d.ts",
   "type": "module",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/types/components/index.d.ts",
+        "default": "./dist/es/components/index.js"
+      },
+      "require": {
+        "types": "./dist/types/components/index.d.ts",
+        "default": "./dist/cjs/components/index.js"
+      }
+    },
+    "./dist/cjs/index.css": "./dist/es/index.css",
+    "./dist/es/index.css": "./dist/es/index.css",
+    "./dist/index.css": "./dist/es/index.css",
+    "./variables.css": "./dist/variables.css",
+    "./variables.less": "./dist/variables.less"
+  },
   "files": [
     "dist/**"
   ],
@@ -41,7 +61,6 @@
     "@types/i18next": "^13.0.0",
     "@types/node": "^20.0.0",
     "@types/react": "^19.2.7",
-    "@types/react-color": "^3.0.13",
     "@types/react-dom": "^19.2.3",
     "@types/react-i18next": "^8.1.0",
     "@types/react-syntax-highlighter": "^15.5.13",
@@ -50,21 +69,17 @@
     "@vitejs/plugin-react": "^4.0.0",
     "autoprefixer": "^10.4.23",
     "css-loader": "^6.0.0",
-    "dnd-kit": "^0.0.2",
     "eslint": "^8.0.0",
     "eslint-plugin-react": "^7.32.0",
     "html-webpack-plugin": "^5.6.5",
-    "i18next": "^25.7.4",
     "less": "^4.5.1",
     "less-loader": "^11.0.0",
     "mini-css-extract-plugin": "^2.10.0",
     "postcss": "^8.5.6",
+    "postcss-import": "^16.1.1",
     "postcss-less": "^6.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "react-fast-marquee": "^1.6.5",
-    "react-i18next": "^16.5.3",
-    "react-icons": "^5.5.0",
     "rimraf": "^5.0.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.2",
@@ -79,18 +94,19 @@
     "webpack-dev-server": "^4.13.0"
   },
   "dependencies": {
+    "dnd-kit": "^0.0.2",
+    "i18next": "^25.7.4",
+    "react-i18next": "^16.5.3",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "classnames": "^2.3.0",
     "lunar-typescript": "^1.8.6",
     "prismjs": "^1.30.0",
-    "react-color": "^2.19.3",
-    "react-syntax-highlighter": "^16.1.0",
-    "styled-components": "^6.3.8"
+    "react-syntax-highlighter": "^16.1.0"
   },
   "repository": {
     "type": "git",
     "url": "git@github.com:chongyin10/simple-design.git"
   }
-}
+}