# upload-wrapper LLMs.txt

> 供 LLM 快速理解 `@flatbiz/antd/upload-wrapper` 的使用方式。

## 模块定位

文件上传，支持拖拽上传

## 导入方式

```ts
import { UploadWrapper } from '@flatbiz/antd/upload-wrapper';
// 也可以从主入口导入：import { ... } from '@flatbiz/antd';
```

## 公开导出

- `* from ./upload-wrapper.jsx`
- `UploadWrapper` - 文件上传，支持拖拽上传
- `UploadWrapperFileItem`
- `UploadWrapperProps`
- `getBase64`

## 依赖的 antd 能力

`Button`、`Image`、`message`、`Upload`、`UploadFile`、`UploadProps`

## Props / 配置要点

### UploadWrapperFileItem

- `uid`（必填）：: string
- `name`（必填）：: string
- `url`（可选）：: string

### UploadWrapperProps

- `value`（可选）：: T[] | T
- `onChange`（可选）：: (value?: T[]) => void
- `onUploadError`（可选）：: (message?: string) => void
- `onUploadChange`（可选）：: (info: UploadChangeParam<UploadFile>) => void
- `fieldNames`（可选）：: { uid: string; name?: string; url?: string; size?: string | number; }；属性取值映射
- `onRequestResultAdapter`（可选）：: (respData: TAny) => TPlainObject；接口响应数据适配器，如果配置了fieldNames，适配器返回值会再进过fieldNames转换
- `triggerText`（可选）：: ReactNode；操作触发显示文本
- `limitHidden`（可选）：: boolean；超过maxCount 隐藏上传入口
- `autoSubmit`（可选）：: boolean；自动提交，默认：true
- `imagePreviewAccept`（可选）：: string[]；图片预览文件类型，默认：['png', 'jpg', 'jpeg', 'gif', 'heic', 'heif']
- `extraOperate`（可选）：: { icon: ReactElement; onClick: (file: UploadFile, fileList: UploadFile[], e) => void; }[]；配置文件额外操作
- `isDragger`（可选）：: boolean；是否使用拖拽上传
- `draggerLayoutSize`（可选）：: 'default' | 'middle' | 'large'

## 使用规则与行为

- 属性取值映射
- 文件大小
- 接口响应数据适配器，如果配置了fieldNames，适配器返回值会再进过fieldNames转换
- 操作触发显示文本
- 超过maxCount 隐藏上传入口
- 自动提交，默认：true
- 图片预览开关, 重写 onPreview 方法后失效
- 图片预览文件类型，默认：['png', 'jpg', 'jpeg', 'gif', 'heic', 'heif']
- 配置文件额外操作
- 是否使用拖拽上传

## 默认值线索

- `imagePreviewAccept => ['png', 'jpg', 'jpeg', 'gif', 'heic', 'heif']`
- `draggerLayoutSize => 'default'`
- `value => undefined`

## 基础示例

```tsx
import { UploadWrapper, type UploadWrapperProps } from '@flatbiz/antd/upload-wrapper';

const props: UploadWrapperProps = {
  // 按业务传入必要参数
};

<UploadWrapper {...props} />;
```

## 源码索引

- `src/upload-wrapper/index.ts`
- `src/upload-wrapper/upload-wrapper.tsx`
- `src/upload-wrapper/utils.ts`

## 给 LLM 的注意事项

- 优先使用 `@flatbiz/antd/upload-wrapper` 或主入口 `@flatbiz/antd` 的公开导出，不要引用内部实现文件。
- 当 Props 与 antd 原组件同名能力冲突时，以本模块导出的 Props 类型为准。
- 若文档未覆盖某个边缘参数，请读取上方源码索引中的类型定义和 JSDoc。