@pisell/materials 6.11.240 → 6.11.241

package/lib/components/PisellGroupView/types.d.ts

@@ -1,124 +0,0 @@
-import type { CSSProperties, ReactNode } from 'react';
-import type { GroupKey, GroupResult } from '@pisell/utils';
-/**
- * 单个分组的数据模型
- * @template T - 数据项类型
- * @description 复用 `@pisell/utils` 的 `GroupResult`，包含 groupId、keys、keyMap、items 等
- */
-export declare type GroupModel<T> = GroupResult<T>;
-/**
- * 主体（第三块）渲染单条数据时的上下文
- * @template T - 数据项类型
- */
-export interface ItemContext<T> {
-    /** 当前数据所属分组 */
-    group: GroupModel<T>;
-    /** 当前数据在分组内的下标 */
-    index: number;
-    /**
-     * 参与分组的字段名列表
-     * @description
-     * 调用方可据此在卡片中省略「头部已展示」的字段，避免重复展示。
-     * 当使用自定义函数分组时，该数组为空。
-     */
-    groupKeys: string[];
-}
-/**
- * 主体（第三块）的布局配置
- * @description
- * - `'stack'`：纵向堆叠每条卡片（默认）
- * - 对象：透传给内部 `PisellBasicGrid` 实现多列/横向布局
- */
-export declare type ItemLayout = 'stack' | {
-    /** 一行显示的卡片数 */
-    columns?: number;
-    /** 卡片间距 */
-    gap?: number | string;
-    /** 排列方向 */
-    direction?: 'horizontal' | 'vertical';
-    /** 是否换行 */
-    wrap?: 'wrap' | 'nowrap';
-};
-/**
- * 一个分组渲染出的四块内容
- * @description 透传给 `renderGroup`，便于调用方自定义整组容器但复用四块默认内容
- */
-export interface GroupBlocks {
-    /** ① 头部：分组条件对应的相同信息 */
-    header: ReactNode;
-    /** ② 统计栏：来自分组数据的统计信息 */
-    stats: ReactNode;
-    /** ③ 主体：分组内所有条目（卡片） */
-    body: ReactNode;
-    /** ④ 操作区：批量操作 */
-    actions: ReactNode;
-}
-/**
- * 多端 variant
- * @description 仅用于在根节点追加 `--${variant}` class，由 Less 控制展示差异
- */
-export declare type GroupViewVariant = 'desktop' | 'tablet' | 'pos' | 'phone';
-/**
- * PisellGroupView 组件 Props
- * @template T - 数据项类型
- * @description
- * 通用、数据无关的「分组展示容器」：先按 `groupBy` 将 `dataSource` 分组，
- * 再为每个分组渲染头部 / 统计 / 主体 / 操作四块，各块均可由外部自定义渲染。
- */
-export interface PisellGroupViewProps<T = unknown> {
-    /** 数据源（应为外部已映射好的列表） */
-    dataSource: T[];
-    /**
-     * 分组规则
-     * @description
-     * - `string`：单字段路径，支持 `'a.b.c'` 点路径
-     * - `string[]`：多字段组合（如 `['productId', 'time']`）
-     * - `(item, index) => GroupKey | GroupKey[]`：完全自定义
-     */
-    groupBy: string | string[] | ((item: T, index: number) => GroupKey | GroupKey[]);
-    /** 自定义分组 id 生成，默认各键以 `|` 拼接 */
-    getGroupId?: (keys: GroupKey[]) => string;
-    /** 分组之间的排序；不传保持首次出现顺序 */
-    sortGroups?: (a: GroupModel<T>, b: GroupModel<T>) => number;
-    /** 分组内数据项的排序；不传保持原始相对顺序 */
-    sortItems?: (a: T, b: T) => number;
-    /** ① 头部：分组条件对应的相同信息（时间、商品名、客户等） */
-    renderHeader?: (group: GroupModel<T>) => ReactNode;
-    /** ② 统计栏：可自定义展示，数据来源于分组后的数据 */
-    renderStats?: (group: GroupModel<T>) => ReactNode;
-    /** ③ 主体：渲染分组内的单条数据为卡片 */
-    renderItem?: (item: T, ctx: ItemContext<T>) => ReactNode;
-    /** ④ 操作区：批量操作（加时、编辑等） */
-    renderActions?: (group: GroupModel<T>) => ReactNode;
-    /**
-     * 主体布局
-     * @default 'stack'
-     */
-    itemLayout?: ItemLayout;
-    /**
-     * 自定义主体容器
-     * @param group - 当前分组
-     * @param defaultBody - 组件按 `itemLayout` + `renderItem` 渲染出的默认主体
-     */
-    renderBody?: (group: GroupModel<T>, defaultBody: ReactNode) => ReactNode;
-    /**
-     * 自定义整组容器
-     * @param group - 当前分组
-     * @param blocks - 四块默认内容（header/stats/body/actions）
-     * @description 提供后将完全接管单个分组的结构，调用方可自由编排四块顺序与包裹
-     */
-    renderGroup?: (group: GroupModel<T>, blocks: GroupBlocks) => ReactNode;
-    /** 数据源为空时的渲染 */
-    renderEmpty?: () => ReactNode;
-    /**
-     * 主体内单条卡片的 key
-     * @description 不传时使用 index（仅在列表无增删改时安全）
-     */
-    rowKey?: string | ((item: T, index: number) => string);
-    /** 多端 variant，仅追加根节点 class */
-    variant?: GroupViewVariant;
-    /** 自定义类名 */
-    className?: string;
-    /** 自定义样式 */
-    style?: CSSProperties;
-}

package/lib/components/PisellGroupView/utils/index.d.ts

@@ -1,20 +0,0 @@
-import type { PisellGroupViewProps } from '../types';
-/**
- * 组件样式前缀
- */
-export declare const COMPONENT_PREFIX = "pisell-group-view";
-/**
- * 解析参与分组的字段名列表
- * @param groupBy - 组件的 groupBy 配置
- * @returns 字段名数组；自定义函数分组时返回空数组
- * @description 用于透传给 `renderItem`，让调用方据此省略头部已展示的字段
- */
-export declare const getGroupFieldNames: <T>(groupBy: string | string[] | ((item: T, index: number) => any)) => string[];
-/**
- * 获取主体内单条数据的稳定 key
- * @param item - 数据项
- * @param index - 索引
- * @param rowKey - rowKey 配置
- * @returns key 字符串
- */
-export declare const resolveItemKey: <T>(item: T, index: number, rowKey?: string | ((item: T, index: number) => string) | undefined) => string;

package/lib/components/PisellProcedure/PisellProcedure.stories.d.ts

@@ -1,163 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import PisellProcedure from './PisellProcedure';
-/**
- * PisellProcedure 流程容器组件
- *
- * 用于管理多步骤流程的复合容器组件，基于 PisellLayout 实现三段式布局
- * 包含头部区域（步骤条）、主体区域（内容区+信息区）、底部区域（操作按钮）
- */
-declare const meta: Meta<typeof PisellProcedure>;
-export default meta;
-declare type Story = StoryObj<typeof PisellProcedure>;
-/**
- * 基础用法
- * @description 默认流程容器，包含头部、主体、底部三个区域
- */
-export declare const Default: Story;
-/**
- * 页面模式
- * @description 默认模式，支持响应式和移动端适配
- */
-export declare const PageMode: Story;
-/**
- * 弹窗模式
- * @description 用于弹窗场景，不应用移动端适配
- */
-export declare const ModalMode: Story;
-/**
- * 步骤控制
- * @description 使用 onStepsChange 监听步骤变化
- */
-export declare const StepControl: Story;
-/**
- * 步骤拦截
- * @description 通过 onNext/onPrev 返回 false 阻止步骤切换
- */
-export declare const StepIntercept: Story;
-/**
- * 无侧边栏
- */
-export declare const WithoutSidebar: Story;
-/**
- * 无头部
- */
-export declare const WithoutHeader: Story;
-/**
- * 无底部
- */
-export declare const WithoutFooter: Story;
-/**
- * 最小配置
- * @description 仅显示主体内容
- */
-export declare const MinimalConfig: Story;
-/**
- * 头部插槽顺序 - 默认
- * @description left 在左，right 在右
- */
-export declare const HeaderSlotDefault: Story;
-/**
- * 头部插槽顺序 - 反转
- * @description left 在右，right 在左
- */
-export declare const HeaderSlotReverse: Story;
-/**
- * 隐藏步骤条
- * @description 仅显示头部插槽，不显示步骤条
- */
-export declare const HideSteps: Story;
-/**
- * 第一步显示返回按钮
- * @description 通过 showBackOnFirstStep 控制
- */
-export declare const ShowBackOnFirstStep: Story;
-/**
- * 返回确认弹窗
- * @description 点击返回时弹出确认弹窗
- */
-export declare const BackConfirmModal: Story;
-/**
- * 关闭确认弹窗
- * @description 点击关闭时弹出确认弹窗
- */
-export declare const CloseConfirmModal: Story;
-/**
- * 主体布局 - 比例布局
- * @description 使用比例分配内容区和侧边栏宽度
- */
-export declare const BodyRatioLayout: Story;
-/**
- * 主体布局 - 固定宽度
- * @description 侧边栏使用固定宽度
- */
-export declare const BodyFixedLayout: Story;
-/**
- * 主体布局 - 垂直布局
- * @description 内容区和侧边栏上下排列
- */
-export declare const BodyVerticalLayout: Story;
-/**
- * 主体布局 - 内容顺序反转
- * @description 侧边栏在左/上，内容区在右/下
- */
-export declare const BodyContentOrderReverse: Story;
-/**
- * 底部位置 - 悬浮在侧边栏
- * @description 默认位置，底部悬浮在侧边栏区域
- */
-export declare const FooterFloatSidebar: Story;
-/**
- * 底部位置 - 固定在整体底部
- */
-export declare const FooterFixedBottom: Story;
-/**
- * 底部位置 - 悬浮在整体区域
- * @description 移动端默认使用此模式
- */
-export declare const FooterFloatAll: Story;
-/**
- * 底部位置 - 悬浮在内容区
- */
-export declare const FooterFloatContent: Story;
-/**
- * 底部位置 - 内嵌在内容区底部
- */
-export declare const FooterFixedContentBottom: Story;
-/**
- * 底部位置 - 内嵌在侧边栏底部
- */
-export declare const FooterFixedSidebarBottom: Story;
-/**
- * 移动端总结按钮
- * @description 移动端显示总结按钮，点击可查看侧边栏内容
- */
-export declare const MobileSummaryButton: Story;
-/**
- * 溢出收纳功能
- * @description 当宽度不足时，按钮会被收纳到 More 菜单中
- */
-export declare const OverflowActions: Story;
-/**
- * 禁用溢出收纳
- * @description 不启用溢出收纳，按钮会换行显示
- */
-export declare const DisableOverflow: Story;
-/**
- * 完整示例 - 购物流程
- * @description 模拟真实的购物流程
- */
-export declare const ShoppingFlow: Story;
-/**
- * 完整示例 - 注册流程
- * @description 模拟用户注册流程
- */
-export declare const RegistrationFlow: Story;
-/**
- * 完整示例 - 表单向导
- * @description 多步表单向导
- */
-export declare const FormWizard: Story;
-/**
- * 交互测试 - 组件渲染
- */
-export declare const InteractionTest: Story;

package/lib/components/PisellScrollView/PisellScrollView.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { PisellScrollViewProps, PisellScrollViewRef } from './types';
-import './PisellScrollView.less';
-declare const PisellScrollView: React.ForwardRefExoticComponent<Omit<PisellScrollViewProps, "ref"> & React.RefAttributes<PisellScrollViewRef>>;
-export default PisellScrollView;

package/lib/components/PisellScrollView/PisellScrollView.stories.d.ts

@@ -1,87 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import PisellScrollView from './PisellScrollView';
-/**
- * PisellScrollView 滚动视图组件
- *
- * 提供丰富的滚动功能，包括滚动方向控制、滚动条样式、滚动按钮、滚动事件监听、
- * 视图监听、吸附滚动等功能
- */
-declare const meta: Meta<typeof PisellScrollView>;
-export default meta;
-declare type Story = StoryObj<typeof PisellScrollView>;
-/**
- * 基础用法 - 垂直滚动
- */
-export declare const Default: Story;
-/**
- * 水平滚动
- */
-export declare const HorizontalScroll: Story;
-/**
- * 双向滚动
- */
-export declare const BothDirections: Story;
-/**
- * 滚动条样式 - 细滚动条
- */
-export declare const ThinScrollbar: Story;
-/**
- * 滚动条样式 - 隐藏滚动条
- */
-export declare const HiddenScrollbar: Story;
-/**
- * 滚动按钮 - 右侧箭头
- */
-export declare const RightArrows: Story;
-/**
- * 滚动按钮 - 左右箭头
- */
-export declare const LeftRightArrows: Story;
-/**
- * 滚动按钮 - 返回顶部
- */
-export declare const BackToTop: Story;
-/**
- * 滚动事件监听
- */
-export declare const ScrollEvents: Story;
-/**
- * 吸附滚动 - 垂直方向
- */
-export declare const SnapScrollVertical: Story;
-/**
- * 吸附滚动 - 水平方向
- */
-export declare const SnapScrollHorizontal: Story;
-/**
- * 视图监听 - IntersectionObserver
- */
-export declare const IntersectionObserver: Story;
-/**
- * Ref 方法调用
- */
-export declare const RefMethods: Story;
-/**
- * 滚动到指定元素
- */
-export declare const ScrollToElement: Story;
-/**
- * 自定义尺寸
- */
-export declare const CustomSize: Story;
-/**
- * 综合示例 - 商品列表
- */
-export declare const ProductList: Story;
-/**
- * 综合示例 - 横向标签页
- */
-export declare const HorizontalTabs: Story;
-/**
- * 交互测试 - 验证组件渲染
- */
-export declare const RenderTest: Story;
-/**
- * 交互测试 - 滚动按钮点击
- */
-export declare const ScrollButtonTest: Story;

package/lib/components/PisellScrollView/hooks/useScrollState.d.ts

@@ -1,13 +0,0 @@
-import { RefObject } from 'react';
-import { ScrollEventData, PisellScrollViewProps } from '../types';
-/**
- * 滚动状态管理 Hook
- * @description 管理滚动容器的状态，包括滚动位置、溢出检测等
- */
-export declare const useScrollState: ({ containerRef, overflow, }: {
-    containerRef: RefObject<HTMLElement>;
-    overflow: PisellScrollViewProps['overflow'];
-}) => {
-    scrollState: ScrollEventData;
-    updateScrollState: () => void;
-};

package/lib/components/PisellSteps/PisellSteps.stories.d.ts

@@ -1,155 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import PisellSteps from './PisellSteps';
-/**
- * PisellSteps 步骤条组件
- *
- * 基于 Ant Design Steps 组件进行二次封装和增强
- * 支持多种展示样式、布局方式和丰富的交互功能
- */
-declare const meta: Meta<typeof PisellSteps>;
-export default meta;
-declare type Story = StoryObj<typeof PisellSteps>;
-/**
- * 基础用法 - 默认步骤条
- */
-export declare const Default: Story;
-/**
- * 非受控模式
- * @description 使用 defaultCurrent 设置初始步骤
- */
-export declare const Uncontrolled: Story;
-/**
- * 垂直方向
- */
-export declare const Vertical: Story;
-/**
- * 点状步骤条
- * @description 通过 progressDot 属性启用点状样式
- */
-export declare const Dot: Story;
-/**
- * 自定义点状渲染
- * @description 使用函数自定义点状图标的渲染
- */
-export declare const CustomProgressDot: Story;
-/**
- * 导航步骤条
- */
-export declare const Navigation: Story;
-/**
- * 小尺寸
- */
-export declare const Small: Story;
-/**
- * 大尺寸
- */
-export declare const Large: Story;
-/**
- * 标签垂直布局
- * @description 标签在图标下方显示
- */
-export declare const LabelVertical: Story;
-/**
- * 错误状态
- */
-export declare const ErrorStatus: Story;
-/**
- * 自定义步骤状态
- * @description 每个步骤可以单独设置状态
- */
-export declare const CustomStatus: Story;
-/**
- * 可点击步骤
- */
-export declare const Clickable: Story;
-/**
- * 禁止点击已完成步骤
- * @description 设置 allowClickFinished 为 false
- */
-export declare const DisallowClickFinished: Story;
-/**
- * 禁用特定步骤
- * @description 通过 disabled 属性禁用某个步骤
- */
-export declare const DisabledStep: Story;
-/**
- * 自定义图标
- */
-export declare const CustomIcon: Story;
-/**
- * 完成图标
- */
-export declare const FinishIcon: Story;
-/**
- * 栅格布局
- * @description 启用栅格布局，自定义列数
- */
-export declare const GridLayout: Story;
-/**
- * 自定义图标与文本间距
- * @description 通过 itemGap 属性自定义间距
- */
-export declare const CustomItemGap: Story;
-/**
- * 移动端 - 完整模式
- * @description 移动端显示完整步骤条
- */
-export declare const MobileModeFull: Story;
-/**
- * 移动端 - 当前步骤模式
- * @description 只显示当前步骤信息
- */
-export declare const MobileModeCurrent: Story;
-/**
- * 移动端 - 自动模式
- * @description 根据屏幕宽度自动切换显示模式
- */
-export declare const MobileModeAuto: Story;
-/**
- * 自定义移动端断点
- * @description 通过 mobileBreakpoint 自定义断点宽度
- */
-export declare const CustomMobileBreakpoint: Story;
-/**
- * 自定义起始索引
- * @description 通过 initial 设置起始步骤索引
- */
-export declare const InitialIndex: Story;
-/**
- * 隐藏特定步骤
- * @description 通过 hidden 属性动态隐藏步骤
- */
-export declare const HiddenStep: Story;
-/**
- * 带子标题
- * @description 步骤可以包含子标题
- */
-export declare const WithSubTitle: Story;
-/**
- * 响应式步骤条
- * @description 开启响应式后会自动调整布局
- */
-export declare const Responsive: Story;
-/**
- * 完整功能演示
- * @description 展示多种功能的组合使用
- */
-export declare const FullFeature: Story;
-/**
- * 多步骤流程
- * @description 更多步骤的场景
- */
-export declare const ManySteps: Story;
-/**
- * 购物流程示例
- * @description 模拟真实的购物流程
- */
-export declare const ShoppingFlow: Story;
-/**
- * 交互测试 - 点击步骤
- */
-export declare const InteractionTest: Story;
-/**
- * 交互测试 - 验证组件渲染
- */
-export declare const RenderTest: Story;

package/lib/components/PisellSuperTabs/PisellSuperTabs.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import './PisellSuperTabs.less';
-import type { PisellSuperTabsProps } from './types';
-interface PisellSuperTabsRef {
-    scrollItemByRowKey: (key: string) => void;
-}
-declare const _default: React.ForwardRefExoticComponent<PisellSuperTabsProps<unknown> & React.RefAttributes<PisellSuperTabsRef>>;
-export default _default;

package/lib/components/PisellTabbar/constants.d.ts

@@ -1,47 +0,0 @@
-import { TabbarLevelConfig, ExpandConfig, LevelType } from './types';
-/**
- * 默认层级配置
- */
-export declare const DEFAULT_LEVEL_CONFIG: Record<LevelType, TabbarLevelConfig>;
-/**
- * 获取展开配置
- */
-export declare const getExpandConfig: () => ExpandConfig;
-/**
- * 默认数据项配置
- */
-export declare const DEFAULT_ITEMS: {
-    all: {
-        id: string;
-        shop_id: number;
-        parent_id: number;
-        name: any;
-        slug: string;
-        icon: string;
-    };
-    search: {
-        id: string;
-        shop_id: number;
-        parent_id: number;
-        name: any;
-        text: any;
-        slug: string;
-        key: string;
-        icon: string;
-        customClick: boolean;
-    };
-    expand: {
-        id: string;
-        shop_id: number;
-        parent_id: number;
-        key: string;
-        icon: string;
-        name: string;
-        slug: string;
-        customClick: boolean;
-    };
-};
-/**
- * 获取层级对应的添加项配置
- */
-export declare const LEVEL_ADD_ITEMS: Record<LevelType, ('all' | 'search' | 'expand')[]>;