bj-web-components 0.2.16 → 0.2.18

package/README.md

@@ -1,205 +1,205 @@
-# bu-max-ui
-
-企业级 UI 组件库，支持 Web、移动端、小程序三端，基于 React + TypeScript 构建。
-
-## 安装
-
-```bash
-npm install bu-max-ui
-# 或
-pnpm add bu-max-ui
-```
-
-## 快速上手
-
-引入组件时需同步引入样式文件：
-
-```tsx
-import { SkuInputCard } from 'bu-max-ui';
-import 'bu-max-ui/style';
-```
-
-## Iconfont 图标
-
-Web 组件中的图标使用 `BuIcon`（与下方 `Iconfont` 实现等价）。宿主应用或文档站需要先加载项目 iconfont symbol：
-
-```html
-<script src="//at.alicdn.com/t/c/font_5123795_8zzfaepwkju.js"></script>
-```
-
-随后通过 `type` 传入 symbol id（不包含 `#`）：
-
-```tsx
-import { BuIcon } from 'bu-max-ui/web';
-
-<BuIcon type="icon-a-dagouxi" style={{ width: 14, height: 14, color: '#333' }} />
-```
-
-`BuIcon` 的实现如下：
-
-```tsx
-import React from 'react';
-
-function Iconfont({ type, style, onClick, className, ...rest }) {
-  return (
-    <svg
-      style={style}
-      className={className ? `icon ${className}` : 'icon'}
-      aria-hidden="true"
-      onClick={onClick}
-      {...rest}
-    >
-      <use xlinkHref={`#${type}`} />
-    </svg>
-  );
-}
-
-export default Iconfont;
-```
-
-### 基础用法
-
-```tsx
-import { useState } from 'react';
-import { SkuInputCard } from 'bu-max-ui';
-import 'bu-max-ui/style';
-
-function App() {
-  const [name, setName] = useState('');
-  const [lang, setLang] = useState<'zh' | 'en'>('zh');
-
-  return (
-    <SkuInputCard
-      mode="bilingual"
-      name={name}
-      onNameChange={setName}
-      activeLang={lang}
-      onLangChange={setLang}
-      onDelete={() => setName('')}
-    />
-  );
-}
-```
-
-## 按需引入
-
-支持按平台路径单独引入，减少构建体积：
-
-```tsx
-// Web 组件
-import { SkuInputCard } from 'bu-max-ui/web';
-
-// 移动端组件
-import { ... } from 'bu-max-ui/mobile';
-
-// 小程序组件
-import { ... } from 'bu-max-ui/miniapp';
-
-// 通用组件
-import { ... } from 'bu-max-ui/shared';
-```
-
-## 组件列表
-
-### Web
-
-| 组件 | 说明 |
-|------|------|
-| `SkuInputCard` | 商品规格名称输入卡片，支持单语 / 双语模式、拖拽排序、图片上传 |
-| `Button` | 按钮 |
-| `Input` | 输入框 |
-| `Card` | 卡片 |
-| `Select` | 选择器 |
-| `Tooltip` | 气泡提示 |
-
-### Mobile
-
-| 组件 | 说明 |
-|------|------|
-| `Button` | 移动端按钮 |
-| `Input` | 移动端输入框 |
-| `Card` | 移动端卡片 |
-| `TabBar` | 底部导航栏 |
-| `Navbar` | 顶部导航栏 |
-| `ActionSheet` | 动作面板 |
-| `Toast` | 轻提示 |
-
-### 小程序
-
-| 组件 | 说明 |
-|------|------|
-| `Button` | 小程序按钮 |
-| `Input` | 小程序输入框 |
-| `Card` | 小程序卡片 |
-| `TabBar` | 底部导航栏 |
-| `Navbar` | 顶部导航栏 |
-| `ActionSheet` | 动作面板 |
-| `Modal` | 弹窗 |
-| `Loading` | 加载态 |
-| `Toast` | 轻提示 |
-| `Cell` | 单元格列表 |
-
-## SkuInputCard Props
-
-| 参数 | 类型 | 默认值 | 说明 |
-|------|------|--------|------|
-| `name` | `string` | `''` | 产品名称输入值 |
-| `onNameChange` | `(value: string) => void` | — | 名称变更回调 |
-| `mode` | `'single' \| 'bilingual'` | `'single'` | 单语或双语模式 |
-| `activeLang` | `'zh' \| 'en'` | `'zh'` | 双语模式下当前语言 |
-| `onLangChange` | `(lang: 'zh' \| 'en') => void` | — | 语言切换回调 |
-| `showBody` | `boolean` | `true` | 是否显示内容区域 |
-| `error` | `boolean` | `false` | 错误状态 |
-| `onDelete` | `() => void` | — | 点击删除按钮回调 |
-| `onUpload` | `(file: File) => string \| Promise<string>` | — | 自定义上传方法，返回图片 URL |
-| `images` | `string[]` | — | 外部托管的图片列表 |
-| `id` | `string` | — | 拖拽把手 id，供 DnD 库使用 |
-| `className` | `string` | — | 自定义类名 |
-| `style` | `CSSProperties` | — | 自定义样式 |
-
-## 本地开发
-
-```bash
-# 克隆仓库
-git clone <repo-url>
-cd bu-max-ui
-
-# 安装依赖
-pnpm install
-
-# 启动文档站（端口 3000）
-pnpm dev
-
-# 构建组件库
-pnpm build:lib
-
-# 监听模式（开发库时使用）
-pnpm build:lib:watch
-```
-
-### 项目结构
-
-```
-├── lib/              # 组件库源码（npm 包）
-│   ├── index.ts
-│   ├── web/          # Web 平台组件
-│   ├── mobile/       # 移动端组件
-│   ├── miniapp/      # 小程序组件
-│   ├── react/        # React 通用组件
-│   └── shared/       # 共享工具 / 组件
-├── src/              # 文档站源码
-│   ├── pages/        # 各组件演示页面
-│   └── components/   # 文档站内部组件
-└── dist/             # 构建产物（发布到 npm）
-```
-
-## 技术栈
-
-- **框架**: React 19 + TypeScript
-- **构建**: Vite 6（双模式：文档站 / 组件库）
-- **样式**: Less（BEM 命名规范）
-- **文档站**: React Router DOM 6 + Tailwind CSS v4
-
-## 许可证
-
-MIT
+# bu-max-ui
+
+企业级 UI 组件库，支持 Web、移动端、小程序三端，基于 React + TypeScript 构建。
+
+## 安装
+
+```bash
+npm install bu-max-ui
+# 或
+pnpm add bu-max-ui
+```
+
+## 快速上手
+
+引入组件时需同步引入样式文件：
+
+```tsx
+import { SkuInputCard } from 'bu-max-ui';
+import 'bu-max-ui/style';
+```
+
+## Iconfont 图标
+
+Web 组件中的图标使用 `BuIcon`（与下方 `Iconfont` 实现等价）。宿主应用或文档站需要先加载项目 iconfont symbol：
+
+```html
+<script src="//at.alicdn.com/t/c/font_5123795_8zzfaepwkju.js"></script>
+```
+
+随后通过 `type` 传入 symbol id（不包含 `#`）：
+
+```tsx
+import { BuIcon } from 'bu-max-ui/web';
+
+<BuIcon type="icon-a-dagouxi" style={{ width: 14, height: 14, color: '#333' }} />
+```
+
+`BuIcon` 的实现如下：
+
+```tsx
+import React from 'react';
+
+function Iconfont({ type, style, onClick, className, ...rest }) {
+  return (
+    <svg
+      style={style}
+      className={className ? `icon ${className}` : 'icon'}
+      aria-hidden="true"
+      onClick={onClick}
+      {...rest}
+    >
+      <use xlinkHref={`#${type}`} />
+    </svg>
+  );
+}
+
+export default Iconfont;
+```
+
+### 基础用法
+
+```tsx
+import { useState } from 'react';
+import { SkuInputCard } from 'bu-max-ui';
+import 'bu-max-ui/style';
+
+function App() {
+  const [name, setName] = useState('');
+  const [lang, setLang] = useState<'zh' | 'en'>('zh');
+
+  return (
+    <SkuInputCard
+      mode="bilingual"
+      name={name}
+      onNameChange={setName}
+      activeLang={lang}
+      onLangChange={setLang}
+      onDelete={() => setName('')}
+    />
+  );
+}
+```
+
+## 按需引入
+
+支持按平台路径单独引入，减少构建体积：
+
+```tsx
+// Web 组件
+import { SkuInputCard } from 'bu-max-ui/web';
+
+// 移动端组件
+import { ... } from 'bu-max-ui/mobile';
+
+// 小程序组件
+import { ... } from 'bu-max-ui/miniapp';
+
+// 通用组件
+import { ... } from 'bu-max-ui/shared';
+```
+
+## 组件列表
+
+### Web
+
+| 组件 | 说明 |
+|------|------|
+| `SkuInputCard` | 商品规格名称输入卡片，支持单语 / 双语模式、拖拽排序、图片上传 |
+| `Button` | 按钮 |
+| `Input` | 输入框 |
+| `Card` | 卡片 |
+| `Select` | 选择器 |
+| `Tooltip` | 气泡提示 |
+
+### Mobile
+
+| 组件 | 说明 |
+|------|------|
+| `Button` | 移动端按钮 |
+| `Input` | 移动端输入框 |
+| `Card` | 移动端卡片 |
+| `TabBar` | 底部导航栏 |
+| `Navbar` | 顶部导航栏 |
+| `ActionSheet` | 动作面板 |
+| `Toast` | 轻提示 |
+
+### 小程序
+
+| 组件 | 说明 |
+|------|------|
+| `Button` | 小程序按钮 |
+| `Input` | 小程序输入框 |
+| `Card` | 小程序卡片 |
+| `TabBar` | 底部导航栏 |
+| `Navbar` | 顶部导航栏 |
+| `ActionSheet` | 动作面板 |
+| `Modal` | 弹窗 |
+| `Loading` | 加载态 |
+| `Toast` | 轻提示 |
+| `Cell` | 单元格列表 |
+
+## SkuInputCard Props
+
+| 参数 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| `name` | `string` | `''` | 产品名称输入值 |
+| `onNameChange` | `(value: string) => void` | — | 名称变更回调 |
+| `mode` | `'single' \| 'bilingual'` | `'single'` | 单语或双语模式 |
+| `activeLang` | `'zh' \| 'en'` | `'zh'` | 双语模式下当前语言 |
+| `onLangChange` | `(lang: 'zh' \| 'en') => void` | — | 语言切换回调 |
+| `showBody` | `boolean` | `true` | 是否显示内容区域 |
+| `error` | `boolean` | `false` | 错误状态 |
+| `onDelete` | `() => void` | — | 点击删除按钮回调 |
+| `onUpload` | `(file: File) => string \| Promise<string>` | — | 自定义上传方法，返回图片 URL |
+| `images` | `string[]` | — | 外部托管的图片列表 |
+| `id` | `string` | — | 拖拽把手 id，供 DnD 库使用 |
+| `className` | `string` | — | 自定义类名 |
+| `style` | `CSSProperties` | — | 自定义样式 |
+
+## 本地开发
+
+```bash
+# 克隆仓库
+git clone <repo-url>
+cd bu-max-ui
+
+# 安装依赖
+pnpm install
+
+# 启动文档站（端口 3000）
+pnpm dev
+
+# 构建组件库
+pnpm build:lib
+
+# 监听模式（开发库时使用）
+pnpm build:lib:watch
+```
+
+### 项目结构
+
+```
+├── lib/              # 组件库源码（npm 包）
+│   ├── index.ts
+│   ├── web/          # Web 平台组件
+│   ├── mobile/       # 移动端组件
+│   ├── miniapp/      # 小程序组件
+│   ├── react/        # React 通用组件
+│   └── shared/       # 共享工具 / 组件
+├── src/              # 文档站源码
+│   ├── pages/        # 各组件演示页面
+│   └── components/   # 文档站内部组件
+└── dist/             # 构建产物（发布到 npm）
+```
+
+## 技术栈
+
+- **框架**: React 19 + TypeScript
+- **构建**: Vite 6（双模式：文档站 / 组件库）
+- **样式**: Less（BEM 命名规范）
+- **文档站**: React Router DOM 6 + Tailwind CSS v4
+
+## 许可证
+
+MIT

package/dist/index.d.ts

@@ -1,10 +1,11 @@
 import { CSSProperties } from 'react';
+import { default as default_2 } from 'react';
 import { FocusEvent as FocusEvent_2 } from 'react';
 import { FocusEventHandler } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { HTMLAttributes } from 'react';
 import { InputHTMLAttributes } from 'react';
-import { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react';
 import { Key } from 'react';
 import { KeyboardEvent as KeyboardEvent_2 } from 'react';
 import { KeyboardEventHandler } from 'react';
@@ -246,7 +247,7 @@ export declare const BTable: typeof BTable_2 & {
     ColumnGroup: typeof ColumnGroup;
 };
 
-declare function BTable_2<RecordType extends object>({ columns, dataSource, rowKey, rowSelection, pagination, loading, bordered, size, showHeader, emptyText, emptyImage, emptyHeight, t, className, style, rowClassName, sortDirections, onChange, children, title, footer, summary, tableLayout, components, onRow, onHeaderRow, id, scroll, locale, }: TableProps<RecordType>): JSX.Element;
+declare function BTable_2<RecordType extends object>({ columns, dataSource, rowKey, preserveSelectedRowKeys, rowSelection, pagination, loading, bordered, size, showHeader, emptyText, emptyImage, emptyHeight, t, className, style, rowClassName, sortDirections, onChange, children, title, footer, summary, tableLayout, components, onRow, onHeaderRow, id, scroll, locale, groupCollapse, }: TableProps<RecordType>): JSX.Element;
 
 export declare function BTabs({ activeKey, children, centered, className, defaultActiveKey, id, items, onChange, onTabClick, style, tabBarGutter, tabBarStyle, tabPosition, type, }: BTabsProps): JSX.Element;
 
@@ -784,6 +785,25 @@ export declare type GetRowKey<RecordType> = (record: RecordType, index?: number)
 
 declare const Group: ForwardRefExoticComponent<BCheckBoxGroupProps & RefAttributes<HTMLDivElement>>;
 
+export declare interface GroupCollapseConfig<RecordType> {
+    /** Identify group header records. Defaults to `record.isGroup`. */
+    isGroupRow?: (record: RecordType, index: number) => boolean;
+    /** Return the stable key for a group header. Defaults to `record.groupId`. */
+    groupKey?: (record: RecordType, index: number) => TableKey;
+    /** Return the stable keys of the group's child records. */
+    childrenKeys?: (record: RecordType, index: number) => readonly TableKey[];
+    expandedKeys?: readonly TableKey[];
+    defaultExpandedKeys?: readonly TableKey[];
+    onExpandedKeysChange?: (expandedKeys: readonly TableKey[], record: RecordType, expanded: boolean) => void;
+    render?: (props: GroupCollapseRenderProps<RecordType>) => ReactNode;
+}
+
+export declare interface GroupCollapseRenderProps<RecordType> {
+    record: RecordType;
+    expanded: boolean;
+    onToggle: () => void;
+}
+
 export declare type ModalLang = 'zh' | 'en';
 
 export declare type ModalMode = 'standard' | 'bilingual' | 'single';
@@ -848,7 +868,7 @@ export declare interface ProductFieldOption {
     searchText?: string;
 }
 
-export declare function ProgressTooltip({ placement, title, progress, className, style, }: ProgressTooltipProps): JSX.Element;
+export declare function ProgressTooltip({ placement, title, progress, className, style, }: ProgressTooltipProps): default_2.JSX.Element;
 
 export declare interface ProgressTooltipProps extends BaseTooltipProps {
     title?: string;
@@ -1001,6 +1021,8 @@ export declare interface TableLocale {
 
 export declare interface TablePaginationConfig extends PaginationProps {
     position?: Array<'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight' | 'none'>;
+    /** Render the supplied data as the current server-side page without local slicing. */
+    serverPagination?: boolean;
 }
 
 export declare interface TableProps<RecordType extends object> {
@@ -1008,6 +1030,8 @@ export declare interface TableProps<RecordType extends object> {
     children?: ReactNode;
     dataSource?: readonly RecordType[];
     rowKey?: keyof RecordType | string | GetRowKey<RecordType>;
+    /** Whether to preserve selected keys that are not in the current visible rows after pagination or filtering. */
+    preserveSelectedRowKeys?: boolean;
     rowSelection?: TableRowSelection<RecordType>;
     pagination?: false | TablePaginationConfig;
     loading?: boolean | {
@@ -1050,6 +1074,7 @@ export declare interface TableProps<RecordType extends object> {
     onRow?: GetComponentProps<RecordType>;
     onHeaderRow?: GetComponentProps<readonly ColumnType<RecordType>[]>;
     expandable?: ExpandableConfig<RecordType>;
+    groupCollapse?: GroupCollapseConfig<RecordType>;
     locale?: TableLocale;
     sortDirections?: SortOrder[];
     showSorterTooltip?: boolean | {
@@ -1061,7 +1086,6 @@ export declare interface TableProps<RecordType extends object> {
 }
 
 export declare interface TableRowSelection<RecordType> {
-    preserveSelectedRowKeys?: boolean;
     type?: TableSelectionType;
     selectedRowKeys?: TableKey[];
     defaultSelectedRowKeys?: TableKey[];