@gmfe/react 2.14.30-alpha.0 → 2.14.31

package/src/component/tip/README.md

@@ -0,0 +1,105 @@
+# Tip
+
+## 简介
+提示信息组件 - 用于显示全局轻量级提示消息，支持 success、info、warning、danger 四种类型，提供组件和静态方法两种使用方式
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { Tip } from '@gmfe/react'
+```
+
+## API
+
+### 组件 Props
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| title | 标题 | `string` | `''` | 否 |
+| type | 提示类型，对应不同图标和颜色 | `'success' \| 'info' \| 'warning' \| 'danger'` | `'info'` | 否 |
+| onClose | 关闭回调 | `func` | `_.noop` | 否 |
+| children | 提示内容 | `any` | - | 否 |
+
+### TipOverlay Props（静态方法内部使用）
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| title | 标题 | `string` | - | 否 |
+| type | 提示类型 | `string` | - | 否 |
+| onClose | 关闭回调 | `func` | - | 否 |
+| time | 自动关闭时间（毫秒），设为 0 则不自动关闭 | `number` | `3000` | 否 |
+| children | 提示内容 | `any` | - | 否 |
+
+### 静态方法
+
+| 方法 | 说明 | 参数 | 返回值 |
+|------|------|------|--------|
+| `Tip.tip(options)` | 显示提示信息 | `options: Object` | `id: string` |
+| `Tip.success(options)` | 显示成功提示，参数可为字符串或对象 | `string \| Object` | `id: string` |
+| `Tip.info(options)` | 显示信息提示，参数可为字符串或对象 | `string \| Object` | `id: string` |
+| `Tip.warning(options)` | 显示警告提示，参数可为字符串或对象 | `string \| Object` | `id: string` |
+| `Tip.danger(options)` | 显示危险提示，参数可为字符串或对象 | `string \| Object` | `id: string` |
+| `Tip.clear(id)` | 关闭指定 id 的提示 | `id: string` | - |
+| `Tip.clearAll()` | 关闭所有提示 | - | - |
+
+#### 静态方法 Options
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| children | 提示内容 | `any` | - | 否 |
+| type | 提示类型（由快捷方法自动设置） | `string` | - | 否 |
+| title | 标题 | `string` | - | 否 |
+| time | 自动关闭时间（毫秒），设为 0 则需手动关闭 | `number` | `3000` | 否 |
+| onClose | 关闭回调 | `func` | - | 否 |
+
+## 示例
+
+### 基础用法 - 组件形式
+
+```jsx
+<Tip type='success'>操作成功</Tip>
+<Tip type='info'>这是一条提示信息</Tip>
+<Tip type='warning'>这是警告信息</Tip>
+<Tip type='danger'>操作失败</Tip>
+<Tip type='success' title='成功'>操作已完成</Tip>
+```
+
+### 静态方法 - 简写字符串
+
+```jsx
+// 默认 3 秒后自动关闭
+Tip.info('这是一条提示信息')
+Tip.success('操作成功')
+Tip.warning('请注意')
+Tip.danger('操作失败')
+```
+
+### 静态方法 - 完整配置
+
+```jsx
+// 显示成功提示，不自动关闭
+const tipId = Tip.success({
+  children: '需要用户自行关闭的提示',
+  time: 0,
+  onClose: () => console.log('提示已关闭')
+})
+
+// 手动关闭指定提示
+Tip.clear(tipId)
+```
+
+### 关闭所有提示
+
+```jsx
+Tip.clearAll()
+```
+
+## 注意事项
+
+- 静态方法支持字符串简写和对象两种参数形式。传入字符串时，会自动将其作为 `children` 使用。
+- 静态方法返回一个唯一 `id`，可通过 `Tip.clear(id)` 关闭指定的提示消息。
+- 设置 `time: 0` 可以禁用自动关闭，此时需要用户手动点击关闭按钮或调用 `Tip.clear(id)` 来关闭。
+- 多条提示会依次排列显示在页面右上角。
+- 组件形式的 Tip 适合嵌入到页面固定位置，静态方法适合在操作后临时弹出全局提示。

package/src/component/tool_tip/README.md

@@ -0,0 +1,84 @@
+# ToolTip
+
+## 简介
+文字提示组件 - 基于Popover封装的悬浮提示气泡，鼠标悬停时显示提示内容，默认显示问号图标
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { ToolTip } from '@gmfe/react'
+```
+
+## API
+
+### Props
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| popup | 提示气泡内容 | `element` | - | 否 |
+| children | 自定义触发元素，不传时默认显示问号图标 | `element` | - | 否 |
+| right | 是否右对齐弹出 | `bool` | `false` | 否 |
+| top | 是否向上弹出 | `bool` | `false` | 否 |
+| center | 是否居中弹出 | `bool` | `false` | 否 |
+| showArrow | 是否显示三角箭头 | `bool` | `true` | 否 |
+| className | 自定义类名（作用于默认问号图标） | `string` | - | 否 |
+| style | 自定义样式（作用于默认问号图标） | `object` | - | 否 |
+
+## 示例
+
+### 基础用法 - 默认问号图标
+
+```jsx
+<ToolTip popup={<div>这是一段提示文字</div>} />
+```
+
+### 自定义触发元素
+
+```jsx
+<ToolTip popup={<div style={{ width: '100px', height: '100px' }}>详细说明内容</div>}>
+  <span>悬浮查看提示</span>
+</ToolTip>
+```
+
+### 右对齐弹出
+
+```jsx
+<ToolTip
+  right
+  popup={<div>右对齐的提示内容</div>}
+>
+  <span>右对齐提示</span>
+</ToolTip>
+```
+
+### 居中弹出
+
+```jsx
+<ToolTip
+  center
+  popup={<div>居中的提示内容</div>}
+>
+  <span>居中提示</span>
+</ToolTip>
+```
+
+### 向上弹出
+
+```jsx
+<ToolTip
+  top
+  popup={<div>向上弹出的提示</div>}
+>
+  <span>上方提示</span>
+</ToolTip>
+```
+
+## 注意事项
+
+- ToolTip 底层基于 `Popover` 组件，默认使用 `type='hover'`（鼠标悬浮触发）和 `offset={-8}` 的配置。
+- 不传 `children` 时，组件会渲染一个默认的问号图标（带 `gm-text-desc` 样式类）。
+- 传 `children` 时会使用自定义元素作为触发器，替代默认的问号图标。
+- `popup` 属性支持传入任意 React 元素作为气泡内容。
+- ToolTip 使用 `forwardRef` 实现，支持通过 `ref` 获取组件实例并调用 `apiDoSetActive` 等底层方法。

package/src/component/transfer/README.md

@@ -0,0 +1,98 @@
+# Transfer
+
+## 简介
+穿梭框组件 - 用于在左右两栏之间转移选项，支持普通列表和分组树形列表
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { Transfer, TransferGroup } from '@gmfe/react'
+
+// 普通穿梭框
+<Transfer
+  list={list}
+  selectedValues={selectedValues}
+  onSelect={values => setSelectedValues(values)}
+/>
+
+// 分组穿梭框
+<TransferGroup
+  list={groupList}
+  selectedValues={selectedValues}
+  onSelect={values => setSelectedValues(values)}
+/>
+```
+
+## API
+
+### Transfer Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| list | 数据源，格式：`[{value, name}]` | `array` | - | 是 |
+| selectedValues | 已选中的 value 数组 | `array` | - | 是 |
+| onSelect | 选中值变化回调 | `function` | - | 是 |
+| listStyle | 左右两栏的样式 | `object` | `{width: '250px', height: '350px'}` | 否 |
+| leftTitle | 左栏标题 | `string` | `'待选择'` | 否 |
+| leftWithFilter | 左栏搜索过滤函数 | `func \| bool` | `true` | 否 |
+| leftPlaceHolder | 左栏搜索框占位文本 | `string` | `'搜索'` | 否 |
+| rightTitle | 右栏标题 | `string` | `'已选择'` | 否 |
+| rightWithFilter | 右栏搜索过滤函数 | `func \| bool` | `true` | 否 |
+| rightPlaceHolder | 右栏搜索框占位文本 | `string` | `'搜索'` | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式 | `object` | - | 否 |
+| disabled | 是否禁用 | `bool` | - | 否 |
+| isVirtual | 是否使用虚拟滚动 | `bool` | `false` | 否 |
+| itemSize | 虚拟滚动时每项的高度 | `number` | `25` | 否 |
+
+### TransferGroup Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| list | 树形数据源，格式：`[{value, name, children: [{value, name, children: []}]}]` | `array` | - | 是 |
+| selectedValues | 已选中的叶子节点 value 数组 | `array` | - | 是 |
+| onSelect | 选中值变化回调 | `function` | - | 是 |
+| listStyle | 左右两栏的样式 | `object` | `{width: '250px', height: '350px'}` | 否 |
+| leftTitle | 左栏标题 | `string` | `'待选择'` | 否 |
+| leftWithFilter | 左栏搜索过滤函数 | `func \| bool` | `true` | 否 |
+| leftPlaceHolder | 左栏搜索框占位文本 | `string` | `'搜索'` | 否 |
+| rightTitle | 右栏标题 | `string` | `'已选择'` | 否 |
+| rightWithFilter | 右栏搜索过滤函数 | `func \| bool` | `true` | 否 |
+| rightPlaceHolder | 右栏搜索框占位文本 | `string` | `'搜索'` | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式 | `object` | - | 否 |
+
+## 示例
+
+### 基础穿梭框
+```jsx
+<Transfer
+  list={list}
+  selectedValues={selectedValues}
+  onSelect={values => setSelectedValues(values)}
+/>
+```
+
+### 虚拟滚动
+```jsx
+<Transfer
+  isVirtual
+  list={largeList}
+  selectedValues={selectedValues}
+  onSelect={values => setSelectedValues(values)}
+/>
+```
+
+### 分组穿梭框
+```jsx
+<TransferGroup
+  list={groupList}
+  selectedValues={selectedValues}
+  onSelect={values => setSelectedValues(values)}
+/>
+```
+
+## 注意事项
+- `Transfer` 适用于扁平列表数据
+- `TransferGroup` 适用于树形分组数据，左侧为 Tree 组件，右侧为普通列表
+- 启用虚拟滚动 (`isVirtual`) 后可处理大量数据

package/src/component/transfer_v2/README.md

@@ -0,0 +1,85 @@
+# TransferV2
+
+## 简介
+穿梭框组件 V2 - 基于虚拟化树形控件的新版穿梭框，支持左右栏独立搜索过滤和自定义渲染
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { TransferV2 } from '@gmfe/react'
+
+<TransferV2
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={selected => setSelectedValues(selected)}
+/>
+```
+
+## API
+
+### Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| list | 数据源（支持树形数据和平铺数据） | `array` | - | 是 |
+| selectedValues | 已选中的 value 数组 | `array` | - | 是 |
+| onSelectValues | 选中值变化回调 | `function` | - | 是 |
+| rightTree | 右边是否以树状结构展示 | `bool` | - | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式 | `object` | - | 否 |
+| leftTitle | 左栏标题 | `string` | `'待选择'` | 否 |
+| leftPlaceholder | 左栏搜索框占位文本 | `string` | - | 否 |
+| leftWithFilter | 左栏过滤函数 | `func \| bool` | - | 否 |
+| leftRenderLeafItem | 左栏叶子节点自定义渲染 | `function` | - | 否 |
+| leftRenderGroupItem | 左栏分组节点自定义渲染 | `function` | - | 否 |
+| leftStyle | 左栏自定义样式 | `object` | `{width: '300px', height: '500px'}` | 否 |
+| leftClassName | 左栏自定义类名 | `string` | - | 否 |
+| rightTitle | 右栏标题 | `string` | `'已选择'` | 否 |
+| rightPlaceholder | 右栏搜索框占位文本 | `string` | - | 否 |
+| rightWithFilter | 右栏过滤函数 | `func \| bool` | - | 否 |
+| rightRenderLeafItem | 右栏叶子节点自定义渲染 | `function` | - | 否 |
+| rightRenderGroupItem | 右栏分组节点自定义渲染 | `function` | - | 否 |
+| rightStyle | 右栏自定义样式 | `object` | `{width: '300px', height: '500px'}` | 否 |
+| rightClassName | 右栏自定义类名 | `string` | - | 否 |
+
+## 示例
+
+### 基础用法
+```jsx
+<TransferV2
+  list={flatData}
+  selectedValues={selected}
+  onSelectValues={selected => setSelectedValues(selected)}
+  rightTree
+/>
+```
+
+### 树形数据
+```jsx
+<TransferV2
+  list={treeData}
+  selectedValues={selected}
+  onSelectValues={selected => setSelectedValues(selected)}
+/>
+```
+
+### 自定义标题和渲染
+```jsx
+<TransferV2
+  list={treeData}
+  selectedValues={selected}
+  onSelectValues={selected => setSelectedValues(selected)}
+  leftTitle="修改左边的标题"
+  rightTitle="修改右边的标题"
+  rightStyle={{ width: '500px', height: '500px' }}
+  rightRenderLeafItem={data => (
+    <div>{data.parent.text} -- {data.text}</div>
+  )}
+/>
+```
+
+## 注意事项
+- 左右栏默认尺寸为 `300px x 500px`
+- 内部基于 `TreeV2` 组件，支持大数据量虚拟化渲染
+- 设置 `rightTree` 后右侧会以树状结构展示，否则为扁平列表

package/src/component/tree/README.md

@@ -0,0 +1,99 @@
+# Tree
+
+## 简介
+树形选择组件 - 支持多级嵌套、搜索过滤、全选、自定义渲染的树形控件
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { Tree } from '@gmfe/react'
+
+<Tree
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+## API
+
+### Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| list | 树形数据，格式：`[{value, name, children: []}]` | `array` | - | 是 |
+| selectedValues | 已选中的叶子节点 value 数组 | `array` | - | 是 |
+| onSelectValues | 选择值变化回调 | `function` | - | 是 |
+| disabled | 是否禁用 | `bool` | - | 否 |
+| title | 标题 | `string` | - | 否 |
+| withFilter | 过滤函数，默认自带拼音搜索，不需要则传 `false` | `func \| bool` | `true` | 否 |
+| placeholder | 搜索框占位文本 | `string` | `'搜索'` | 否 |
+| disableSelectAll | 是否禁用全选 | `bool` | `false` | 否 |
+| showGroupCheckbox | 控制分组节点是否显示 checkbox，传入函数 `(group) => boolean` | `function` | `() => true` | 否 |
+| onClickCheckbox | 勾选 checkbox 时的通知回调，纯通知 | `function` | - | 否 |
+| onClickExpand | 点击展开/收起时的通知回调，纯通知 | `function` | - | 否 |
+| onClickLeafName | 点击叶子节点名称的回调 | `function` | - | 否 |
+| onClickGroupName | 点击分组节点名称的回调 | `function` | - | 否 |
+| renderLeafItem | 自定义叶子节点渲染，参数为 `(item)` | `function` | - | 否 |
+| renderGroupItem | 自定义分组节点渲染，参数为 `(item, next)`，`next` 为切换展开收起的函数 | `function` | - | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式，默认 `{width: '250px', height: '350px'}` | `object` | `{width: '250px', height: '350px'}` | 否 |
+| isForManage | 是否用于分类管理模式 | `bool` | - | 否 |
+
+## 示例
+
+### 基础用法
+```jsx
+<Tree
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+### 带标题
+```jsx
+<Tree
+  title="我是标题"
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+### 禁用全选
+```jsx
+<Tree
+  disableSelectAll
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+### 自定义渲染
+```jsx
+<Tree
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+  renderGroupItem={item => `group ${item.name}`}
+  renderLeafItem={item => <div>leaf {item.name}</div>}
+/>
+```
+
+### 纯树（无搜索、无全选）
+```jsx
+<Tree
+  withFilter={false}
+  disableSelectAll
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+## 注意事项
+- 默认搜索使用拼音过滤，搜索有 300ms 的防抖
+- `isForManage` 模式下会添加管理样式的类名

package/src/component/tree/index.js

@@ -23,7 +23,7 @@ const filterWithQuery = (list, query, withFilter) => {
     processList = list
   }
 
-  return processList
+  return processList || []
 }
 
 const Tree = ({

package/src/component/tree_v2/README.md

@@ -0,0 +1,99 @@
+# TreeV2
+
+## 简介
+树形选择组件 V2 - 基于 `react-window` 的虚拟化树形控件，支持大数据量、搜索过滤、定位功能和半选状态
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { TreeV2 } from '@gmfe/react'
+
+<TreeV2
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+## API
+
+### Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| list | 树形数据，格式：`[{value, name/text, children: []}]`，支持平铺数据和多级嵌套 | `array` | - | 是 |
+| selectedValues | 已选中的叶子节点 value 数组 | `array` | - | 是 |
+| onSelectValues | 选择值变化回调 | `function` | - | 是 |
+| onActiveValues | 激活项变化回调 | `function` | `() => []` | 否 |
+| activeValue | 当前激活的 value | `string` | `null` | 否 |
+| title | 标题 | `string` | - | 否 |
+| withFilter | 过滤函数，默认自带，不需要则传 `false` | `func \| bool` | `true` | 否 |
+| renderLeafItem | 自定义叶子节点渲染 | `function` | - | 否 |
+| renderGroupItem | 自定义分组节点渲染 | `function` | - | 否 |
+| placeholder | 搜索框占位文本 | `string` | `'搜索'` | 否 |
+| showAllCheck | 全选开关是否显示 | `bool` | `true` | 否 |
+| indeterminateList | 半勾选状态的 value 数组 | `array` | `[]` | 否 |
+| withFindFilter | 定位过滤函数，默认自带，不需要则传 `false` | `func \| bool` | `false` | 否 |
+| findPlaceholder | 定位输入框占位文本 | `string` | `'输入定位信息'` | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式 | `object` | - | 否 |
+
+### 静态方法
+| 方法 | 说明 |
+|------|------|
+| `TreeV2.filterGroupList(list, filter)` | 按条件过滤叶子节点 |
+| `TreeV2.selectedValues2SelectedList(list, selectValues)` | 将选中的 value 数组转换为选中的节点列表 |
+
+## 示例
+
+### 基础用法
+```jsx
+<TreeV2
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+### 平铺数据
+```jsx
+<TreeV2
+  list={flatData}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+/>
+```
+
+### 自定义渲染
+```jsx
+<TreeV2
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+  renderLeafItem={data => (
+    <div>
+      <span style={{backgroundColor: '#56a3f2', color: 'white', padding: '1px', borderRadius: '2px'}}>
+        上架
+      </span>
+      {data.text}
+    </div>
+  )}
+/>
+```
+
+### 定位功能
+```jsx
+<TreeV2
+  list={data}
+  selectedValues={selectedValues}
+  onSelectValues={values => setSelectedValues(values)}
+  withFindFilter={handleFind}
+  withFilter={false}
+/>
+```
+
+## 注意事项
+- 搜索输入有 300ms 防抖
+- 支持单层数据（平铺列表）和多级嵌套数据
+- 使用了虚拟化渲染，适合大数据量场景

package/src/component/uploader/README.md

@@ -0,0 +1,104 @@
+# Uploader
+
+## 简介
+文件上传组件 - 提供文件选择和上传触发功能，支持自定义上传区域和图片上传占位。
+
+## 安装
+已包含在 `@gmfe/react` 中，无需额外安装。
+
+## 使用
+```jsx
+import { Uploader } from '@gmfe/react'
+
+<Uploader
+  onUpload={(files, e) => console.log(files)}
+  accept='image/*'
+/>
+```
+
+## API
+
+### Uploader Props
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| onUpload | 上传回调，参数为 (files, event)，files 为 File 对象数组 | `func` | - | 是 |
+| disabled | 是否禁用 | `bool` | - | 否 |
+| accept | 接受的文件类型 | `string` | - | 否 |
+| multiple | 是否支持多文件选择 | `bool` | - | 否 |
+| className | 自定义类名 | `string` | - | 否 |
+| style | 自定义样式 | `object` | - | 否 |
+| children | 自定义上传区域内容 | `any` | - | 否 |
+
+### Uploader.Default Props
+默认上传区域占位组件，显示 `+` 图标。
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| className | 自定义类名 | `string` | - | 否 |
+
+### Uploader.DefaultImage Props
+图片上传占位组件，显示 `+ 加图` 文字。
+
+| 属性 | 说明 | 类型 | 默认值 | 必填 |
+|------|------|------|--------|------|
+| className | 自定义类名 | `string` | - | 否 |
+
+## 示例
+
+### 默认上传
+```jsx
+<Uploader
+  onUpload={(files, e) => console.log(files)}
+  accept='image/*'
+/>
+```
+
+### 禁用状态
+```jsx
+<Uploader
+  disabled
+  onUpload={(files, e) => console.log(files)}
+  accept='image/*'
+/>
+```
+
+### 自定义触发按钮
+```jsx
+<Uploader onUpload={(files, e) => console.log(files)} accept='.xlsx'>
+  <Button>上传 Excel</Button>
+</Uploader>
+```
+
+### 图片上传占位
+```jsx
+const { DefaultImage } = Uploader
+
+<Uploader
+  onUpload={(files, e) => console.log(files)}
+  accept='image/*'
+>
+  <DefaultImage />
+</Uploader>
+```
+
+### 替换图片上传
+```jsx
+const { DefaultImage } = Uploader
+
+<Uploader
+  onUpload={handleUpload}
+  accept='image/*'
+>
+  <DefaultImage>
+    {imageUrl && <img src={imageUrl} style={{ width: '100%', height: '100%' }} />}
+  </DefaultImage>
+</Uploader>
+```
+
+## 注意事项
+- `onUpload` 的第一个参数 `files` 是 File 对象数组，每个 File 对象会附带 `preview` 属性（通过 `URL.createObjectURL` 创建）
+- 在微信环境下 `multiple` 属性会被强制设为 `false`
+- 不传 `children` 时，默认使用 `+` 图标作为上传区域
+- `accept` 属性遵循原生 input 的 accept 属性格式，如 `image/*`、`.xlsx` 等
+- 上传文件的验证（大小、类型等）需在 `onUpload` 回调中自行处理
+- 禁用状态下点击不会触发文件选择

package/src/index.js

@@ -103,7 +103,6 @@ import Selection from './component/selection'
 import TreeV2 from './component/tree_v2'
 import RecommendInput from './component/recommend_input'
 import PicturePreview from './component/picture_preview'
-import StickyLayout from './hoc/sticky_layout'
 
 Object.assign(Sheet, {
   SheetColumn,
@@ -234,6 +233,5 @@ export {
   Selection,
   TreeV2,
   RecommendInput,
-  PicturePreview,
-  StickyLayout
+  PicturePreview
 }