@pisell/materials 1.0.1056 → 1.0.1058

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

@@ -0,0 +1,197 @@
+import type { CSSProperties, MouseEvent as ReactMouseEvent, ReactNode } from 'react';
+/**
+ * 资源项形状
+ * @description 展示层支持的基础形状
+ */
+export declare type FloorMapItemShape = 'rect' | 'circle' | 'triangle' | 'polygon' | 'custom';
+/**
+ * 底层背景类型
+ * @description 地图底层的展示方式
+ */
+export declare type FloorMapBackgroundType = 'none' | 'color' | 'image' | 'svg';
+/**
+ * 平移边界策略
+ * @description 拖拽/手势平移时的边界行为
+ */
+export declare type FloorMapPanBoundary = 'none' | 'clamp' | 'bounce';
+/**
+ * 资源项坐标/尺寸单位
+ * - cell：x/y/width/height 为格子数，由 cellSize 转为像素
+ * - pixel：x/y/width/height 为像素
+ */
+export declare type FloorMapItemUnit = 'cell' | 'pixel';
+/**
+ * 资源项基础类型
+ * @description 每个资源至少包含 id 与坐标 (x, y)，其余由外部扩展。
+ * 单位由布局的 itemUnit 决定：cell 时为格子数，pixel 时为像素。
+ */
+export interface FloorMapItemBase {
+    /** 唯一标识 */
+    id: string;
+    /** 坐标 x（cell 时为格子索引，pixel 时为像素） */
+    x: number;
+    /** 坐标 y */
+    y: number;
+    /** 宽度（可选；cell 时为格子数，pixel 时为像素，缺省时 cell 为 1，pixel 为 cellSize） */
+    width?: number;
+    /** 高度（可选） */
+    height?: number;
+    /** 形状，默认 rect */
+    shape?: FloorMapItemShape;
+}
+/**
+ * 底层（MapLayer）配置
+ */
+export interface FloorMapLayerConfig {
+    /** 背景类型 */
+    backgroundType?: FloorMapBackgroundType;
+    /** 纯色背景时的颜色（backgroundType 为 color 时有效） */
+    backgroundColor?: string;
+    /** 图片背景 URL（backgroundType 为 image 时有效） */
+    backgroundImage?: string;
+    /** SVG 背景内容或 URL（backgroundType 为 svg 时有效） */
+    backgroundSvg?: string;
+    /** 是否显示网格线，默认 false */
+    showGrid?: boolean;
+    /** 底层内边距（如 16 或 "16px"） */
+    padding?: number | string;
+    /** 格子/元素间距 */
+    gap?: number | string;
+    /** 坐标吸附间隔（逻辑单位），0 表示不吸附 */
+    snapStep?: number;
+}
+/**
+ * 缩放配置
+ */
+export interface FloorMapZoomConfig {
+    /** 默认缩放比例，如 1 表示 100% */
+    defaultScale?: number;
+    /** 最小缩放，默认 0.5 (50%) */
+    min?: number;
+    /** 最大缩放，默认 2 (200%) */
+    max?: number;
+    /** 缩放步进，默认 0.1 (10%) */
+    step?: number;
+}
+/**
+ * 平移配置
+ */
+export interface FloorMapPanConfig {
+    /** 是否允许平移，默认 false */
+    enabled?: boolean;
+    /** 边界策略，默认 none */
+    boundary?: FloorMapPanBoundary;
+}
+/**
+ * 视图控制显隐（默认仅显示放大/缩小，复位与区域定位需配置开启）
+ */
+export interface FloorMapControlsConfig {
+    /** 是否显示缩放按钮（+ / −），默认 true */
+    showZoom?: boolean;
+    /** 是否显示复位按钮，默认 false */
+    showReset?: boolean;
+    /** 是否显示区域定位（fitBounds）按钮，默认 false */
+    showFitBounds?: boolean;
+}
+/**
+ * 布局模式（规则网格 vs 完全自由坐标）
+ */
+export declare type FloorMapLayoutMode = 'grid' | 'free';
+/**
+ * 规则网格布局配置（layoutMode 为 grid 时可用）
+ */
+export interface FloorMapGridLayoutConfig {
+    /** 每行列数 */
+    columns?: number;
+}
+/**
+ * PisellFloorMapLayout 组件 Props
+ * @template T - 资源项类型，需继承 FloorMapItemBase 或兼容 id/x/y
+ */
+export interface PisellFloorMapLayoutProps<T extends FloorMapItemBase = FloorMapItemBase> {
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式（作用于最外层容器）
+     */
+    style?: CSSProperties;
+    /**
+     * 资源列表；每项至少包含 id、x、y
+     */
+    items: T[];
+    /**
+     * 每个资源项的渲染函数；内容与样式由调用方完全控制
+     */
+    renderItem: (item: T, index: number) => ReactNode;
+    /**
+     * 指定每项的唯一 key，默认使用 item.id
+     */
+    rowKey?: string | ((item: T, index: number) => string);
+    /**
+     * 底层（地图层）配置：背景、网格、padding、gap、吸附
+     */
+    mapLayer?: FloorMapLayerConfig;
+    /**
+     * 每格像素尺寸（itemUnit 为 cell 时：逻辑 1 单位对应的像素；为 pixel 时：缺省宽高的默认像素）
+     * @default 64
+     */
+    cellSize?: number;
+    /**
+     * item 坐标与尺寸单位：cell 格子数，pixel 像素
+     * @default 'cell'
+     */
+    itemUnit?: FloorMapItemUnit;
+    /**
+     * 布局模式：grid 规则网格，free 完全按坐标
+     * @default 'free'
+     */
+    layoutMode?: FloorMapLayoutMode;
+    /**
+     * 规则网格时的配置（列数等）
+     */
+    gridLayout?: FloorMapGridLayoutConfig;
+    /**
+     * 缩放配置
+     */
+    zoom?: FloorMapZoomConfig;
+    /**
+     * 平移配置
+     */
+    pan?: FloorMapPanConfig;
+    /**
+     * 视图控制按钮显隐
+     */
+    controls?: FloorMapControlsConfig;
+    /**
+     * 是否开启 hover 高亮或 hover 事件，默认 true
+     */
+    enableHover?: boolean;
+    /**
+     * 资源项点击回调
+     */
+    onItemClick?: (item: T, index: number, event: ReactMouseEvent<HTMLElement>) => void;
+    /**
+     * 资源项鼠标进入
+     */
+    onItemHover?: (item: T, index: number, event: ReactMouseEvent<HTMLElement>) => void;
+    /**
+     * 资源项鼠标离开
+     */
+    onItemLeave?: (item: T, index: number, event: ReactMouseEvent<HTMLElement>) => void;
+}
+/**
+ * PisellFloorMapLayout Ref 方法
+ * @description 供外部调用缩放、复位、区域定位等
+ */
+export interface PisellFloorMapLayoutRef {
+    /** 放大 */
+    zoomIn: () => void;
+    /** 缩小 */
+    zoomOut: () => void;
+    /** 复位到默认缩放与位置 */
+    reset: () => void;
+    /** 区域定位：使所有 items 落在视口内 */
+    fitBounds: () => void;
+}

package/lib/components/pisellFloorMapLayout/types.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellFloorMapLayout/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/pisellGoodPassCard/index.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+import './index.less';
+interface ApplicableProductDetails {
+    amount: string;
+    type: string;
+    resource_id: number;
+    title: string;
+    original_amount: string;
+}
+interface Discount {
+    id: number;
+    product_name: string;
+    encoded: string;
+    code: string;
+    tag: string;
+    expire_time?: string;
+    product_id: number;
+    relation_type: string;
+    par_value: string;
+    used_par_value: string;
+    limit_status: string;
+    limited_relation_product_data: any;
+    balance: string;
+    format_title: any;
+    product: any;
+    savedAmount: number;
+    isDisabled: boolean;
+    isSelected?: boolean;
+    isAvailable?: boolean;
+    isUsed?: boolean;
+    applicableProductIds?: number[];
+    applicableProductDetails: ApplicableProductDetails[];
+    appliedProductDetails: any[];
+}
+export interface PisellGoodPassCardProps {
+    /**数据源 */
+    dataSource: Array<Discount>;
+    /**事件 */
+    onChange?: (current: {
+        id: string | number;
+        isSelected: boolean;
+    }) => void;
+    /**样式 */
+    style: React.CSSProperties;
+    /**快捷展示排序 */
+    mixedSort?: (val: Discount[]) => Discount[];
+    isInModal: boolean;
+}
+declare const index: (props: PisellGoodPassCardProps) => JSX.Element;
+export default index;

package/lib/components/pisellGridPro/GridPro.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import './index.less';
+export interface GridProProps {
+    className?: string;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}
+declare const PisellGridPro: (props: GridProProps) => JSX.Element;
+export default PisellGridPro;

package/lib/components/pisellGridPro/GridView/index.d.ts

@@ -0,0 +1,5 @@
+import './index.less';
+import { GridViewProps } from './type';
+export type { GridViewProps };
+declare const GridView: (props: GridViewProps) => JSX.Element;
+export default GridView;

package/lib/components/pisellGridPro/GridView/type.d.ts

@@ -0,0 +1,3 @@
+import { PisellScrollViewProps } from '../../PisellScrollView/types';
+export interface GridViewProps extends PisellScrollViewProps {
+}

package/lib/components/pisellGridPro/ToolBar/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import './index.less';
+import { ToolBarProps } from './type';
+export type { ToolBarProps };
+declare const Toolbar: React.FC<ToolBarProps>;
+export default Toolbar;

package/lib/components/pisellGridPro/ToolBar/type.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export interface ToolBarProps {
+    className?: string;
+    style?: React.CSSProperties;
+    tabs?: React.ReactNode;
+    topLeft?: React.ReactNode;
+    topRight?: React.ReactNode;
+    bottomLeft?: React.ReactNode;
+    bottomRight?: React.ReactNode;
+}

package/lib/components/pisellGridPro/components/DataCard/components/StatCard/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { StatCardItem } from '../../types';
+import './index.less';
+/**
+ * StatCard 统计卡片组件
+ * @description 用于展示单个统计数据，包含标题、数值和对比信息
+ * @author Pisell Team
+ */
+declare const StatCard: React.FC<StatCardItem>;
+export default StatCard;

package/lib/components/pisellGridPro/components/DataCard/index.d.ts

@@ -0,0 +1,5 @@
+import { DataCardProps } from './types';
+export type { DataCardProps };
+import './index.less';
+declare const DataCard: (props: DataCardProps) => JSX.Element | null;
+export default DataCard;

package/lib/components/pisellGridPro/components/DataCard/types.d.ts

@@ -0,0 +1,70 @@
+import React from 'react';
+/**
+ * PisellGridProDataCard 组件属性接口
+ */
+export interface DataCardProps {
+    /**
+     * 统计卡片数据列表
+     */
+    dataItems?: StatCardItem[];
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: React.CSSProperties;
+}
+/**
+ * 统计卡片数据项接口
+ */
+export interface StatCardItem {
+    /**
+     * 唯一标识
+     */
+    key: string;
+    /**
+     * 卡片标题
+     * @example "Total Orders"
+     */
+    title: React.ReactNode;
+    /**
+     * 主要数值
+     * @example 50 或 "$1580"
+     */
+    value: React.ReactNode;
+    /**
+     * 对比数值
+     * @example "+12" 或 "-230"
+     */
+    compareValue?: React.ReactNode;
+    /**
+     * 对比趋势
+     * @description up-增长(绿色), down-下降(红色)
+     * @default undefined
+     */
+    trend?: 'up' | 'down';
+    /**
+     * 对比前缀文本
+     * @default "v.s. pre"
+     */
+    comparePrefix?: string;
+    /**
+     * 是否显示对比信息
+     * @default true
+     */
+    showCompare?: boolean;
+    /**
+     * 自定义卡片样式
+     */
+    style?: React.CSSProperties;
+    /**
+     * 自定义卡片类名
+     */
+    className?: string;
+    /**
+     * 点击回调
+     */
+    onClick?: () => void;
+}

package/lib/components/pisellGridPro/components/Footer/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import './index.less';
+export interface FooterProps {
+    className?: string;
+    children?: React.ReactNode;
+    style?: React.CSSProperties;
+}
+declare const Footer: (props: FooterProps) => JSX.Element;
+export default Footer;

package/lib/components/pisellGridPro/components/Header/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import './index.less';
+export interface HeaderProps {
+    title?: React.ReactNode;
+    badge?: React.ReactNode;
+    subTitle?: React.ReactNode;
+    actionsList?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const Header: React.FC<HeaderProps>;
+export default Header;

package/lib/components/pisellGridPro/index.d.ts

@@ -0,0 +1,4 @@
+import { GridProProps } from './GridPro';
+export type { GridProProps };
+declare const PisellGridPro: any;
+export default PisellGridPro;

package/lib/components/pisellImport/PisellImport.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { PisellImportProps } from './types';
+import './PisellImport.less';
+/**
+ * PisellImport 导入触发器组件
+ *
+ * @description 点击后打开文件选择，支持 accept、multiple、maxSize 校验，选择完成后回调 onImport(files)
+ */
+export declare function PisellImport(props: PisellImportProps): JSX.Element;

package/lib/components/pisellImport/PisellImport.stories.d.ts

@@ -0,0 +1,49 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellImport } from './PisellImport';
+declare const meta: Meta<typeof PisellImport>;
+export default meta;
+declare type Story = StoryObj<typeof PisellImport>;
+/**
+ * 默认 Button 形态
+ */
+export declare const Basic: Story;
+/**
+ * 仅图标形态
+ */
+export declare const IconOnly: Story;
+/**
+ * 三种尺寸 - Button
+ */
+export declare const SizesButton: Story;
+/**
+ * 三种尺寸 - Icon
+ */
+export declare const SizesIcon: Story;
+/**
+ * 默认样式 vs 主色样式
+ */
+export declare const DefaultVsPrimary: Story;
+/**
+ * 禁用态
+ */
+export declare const Disabled: Story;
+/**
+ * 自定义文案
+ */
+export declare const CustomLabel: Story;
+/**
+ * 自定义图标（antd 图标）
+ */
+export declare const CustomIcon: Story;
+/**
+ * 文件选择：限制类型与大小
+ */
+export declare const FileSelect: Story;
+/**
+ * 多选文件
+ */
+export declare const MultipleFiles: Story;
+/**
+ * 与 Export 并排
+ */
+export declare const WithExport: Story;

package/lib/components/pisellImport/index.d.ts

@@ -0,0 +1,2 @@
+export { PisellImport } from './PisellImport';
+export type { PisellImportProps, VariantType, SizeType, ImportButtonType } from './types';

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

@@ -0,0 +1,85 @@
+import type { CSSProperties, ReactNode } from 'react';
+/**
+ * 展示形态
+ * @description icon：仅图标；button：图标 + 文案
+ */
+export declare type VariantType = 'icon' | 'button';
+/**
+ * 尺寸
+ * @description 小、中、大三种尺寸，对应设计稿 padding 与字体
+ */
+export declare type SizeType = 'small' | 'medium' | 'large';
+/**
+ * 视觉类型
+ * @description default：默认边框/灰字；primary：主色描边或填充
+ */
+export declare type ImportButtonType = 'default' | 'primary';
+/**
+ * PisellImport 组件 Props
+ * @description 导入触发器 UI 组件，仅负责展示与点击回调，不内置导入逻辑
+ */
+export interface PisellImportProps {
+    /**
+     * 展示形态
+     * @default 'button'
+     */
+    variant?: VariantType;
+    /**
+     * 尺寸
+     * @default 'medium'
+     */
+    size?: SizeType;
+    /**
+     * 视觉类型（默认样式 / 主色样式）
+     * @default 'default'
+     */
+    type?: ImportButtonType;
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Button 形态下的文案，不传时使用国际化默认文案
+     */
+    label?: ReactNode;
+    /**
+     * 自定义图标，不传时使用内置上传/导入图标
+     */
+    icon?: ReactNode;
+    /**
+     * 接受的文件类型
+     * @description 与 input[type=file] 的 accept 一致，如 ".xlsx,.csv" 或 "application/vnd.ms-excel"
+     */
+    accept?: string;
+    /**
+     * 是否允许多选
+     * @default false
+     */
+    multiple?: boolean;
+    /**
+     * 单文件最大体积（MB），超出时不会调用 onImport，并调用 onError
+     */
+    maxSize?: number;
+    /**
+     * 选择文件并校验通过后回调
+     * @description 用户选择文件后触发，e 为 input 的 change 事件
+     */
+    onImport?: (files: File[], e: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * 校验失败时回调（如文件过大）
+     */
+    onError?: (error: {
+        type: 'MAX_SIZE';
+        message: string;
+        file: File;
+    }) => void;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: CSSProperties;
+}

package/lib/components/pisellLayout/index.d.ts

@@ -0,0 +1,14 @@
+import type { LayoutProps } from 'antd';
+import { Layout } from 'antd';
+import React from 'react';
+export interface PisellLayoutProps extends LayoutProps {
+    children?: React.ReactNode;
+}
+export interface CompoundedComponent extends React.FC<PisellLayoutProps> {
+    Header: typeof Layout.Header;
+    Content: typeof Layout.Content;
+    Footer: typeof Layout.Footer;
+    Sider: typeof Layout.Sider;
+}
+declare const PisellLayout: CompoundedComponent;
+export default PisellLayout;

package/lib/components/pisellLongText/PisellLongText.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import type { PisellLongTextProps } from './types';
+import './PisellLongText.less';
+/**
+ * PisellLongText 长文本/多行文本组件
+ *
+ * 多行文本输入/展示组件，支持只读、编辑、禁用三种状态。
+ * 基于 Ant Design TextArea 组件开发，提供展开/折叠功能和完整的校验框架。
+ *
+ * @param props 组件 Props
+ *
+ * @example
+ * // 编辑态
+ * <PisellLongText
+ *   placeholder="请输入内容"
+ *   rows={3}
+ *   maxLength={500}
+ *   showCount
+ * />
+ *
+ * @example
+ * // 只读态（展开折叠）
+ * <PisellLongText
+ *   mode="read"
+ *   value={longText}
+ *   maxLines={3}
+ *   enableExpand
+ * />
+ *
+ * @example
+ * // 自动高度
+ * <PisellLongText
+ *   autoSize={{ minRows: 3, maxRows: 10 }}
+ *   placeholder="自动调整高度"
+ * />
+ */
+export declare const PisellLongText: React.FC<PisellLongTextProps>;
+declare const _default: React.NamedExoticComponent<PisellLongTextProps>;
+export default _default;