@pisell/private-materials 6.3.81 → 6.3.83

package/lib/pro/Selector/components/Card/index.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import './index.less';
+export declare type CardVariant = 'outlined' | 'borderless';
+export declare type CardLayout = 'vertical' | 'horizontal';
+export declare type SelectedType = 'none' | 'outlined' | 'outlined-bold' | 'filled';
+export declare type ActionsPosition = 'left' | 'right';
+export interface CardStyles {
+    container?: React.CSSProperties | ((props: CardStyleProps) => React.CSSProperties);
+    content?: React.CSSProperties | ((props: CardStyleProps) => React.CSSProperties);
+    actions?: React.CSSProperties | ((props: CardStyleProps) => React.CSSProperties);
+    corner?: React.CSSProperties | ((props: CardStyleProps) => React.CSSProperties);
+}
+export interface CardStyleProps {
+    selected?: boolean;
+    disabled?: boolean;
+    hoverable?: boolean;
+    variant?: CardVariant;
+    layout?: CardLayout;
+}
+export interface CardProps {
+    /** 卡片变体样式 */
+    variant?: CardVariant;
+    /** 布局方向 */
+    layout?: CardLayout;
+    /** 操作按钮区域，水平模式在右侧，垂直模式在底部 */
+    actions?: React.ReactNode[];
+    /** 水平模式下，操作按钮的位置 */
+    actionsPosition?: ActionsPosition;
+    /** 垂直模式下，右上角绝对定位展示的组件 */
+    corner?: React.ReactNode;
+    /** 子内容 */
+    children?: React.ReactNode;
+    /** 选中状态 */
+    selected?: boolean;
+    /** 禁用状态 */
+    disabled?: boolean;
+    /** 是否可悬停 */
+    hoverable?: boolean;
+    /** 点击事件 */
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    /** 自定义样式 */
+    styles?: CardStyles;
+    /**
+     * 选中时的样式类型
+     * - none: 无样式
+     * - outlined: 边框高亮
+     * - outlined-bold: 边框高亮 + 加粗（使用 outline 实现，不影响布局）
+     * - filled: 填充背景色
+     */
+    selectedType?: SelectedType;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: React.CSSProperties;
+}
+declare const Card: React.FC<CardProps>;
+export default Card;

package/lib/pro/Selector/components/Indicator/index.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './index.less';
+export interface IndicatorProps {
+    mode?: 'single' | 'multiple';
+    variant?: 'outlined' | 'filled';
+    defaultChecked?: boolean;
+    checked?: boolean;
+    disabled?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    className?: string;
+    styles?: {
+        container?: React.CSSProperties;
+        indicator?: React.CSSProperties;
+        content?: React.CSSProperties;
+    };
+    children?: React.ReactNode;
+    size?: 'small' | 'middle' | 'large' | number;
+}
+declare const Indicator: React.FC<IndicatorProps>;
+export default Indicator;

package/lib/pro/Selector/components/LayoutContainer/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { LayoutConfig } from '../../types';
+import './index.less';
+interface LayoutContainerProps {
+    className: string;
+    config: LayoutConfig | null;
+    children: React.ReactNode[];
+}
+/**
+ * 统一的布局容器组件
+ *
+ * 支持三种布局模式：
+ * 1. 响应式布局（推荐）：通过 responsive 配置，使用 ResizeObserver 实现容器级响应式
+ * 2. Custom 布局：通过 className 使用预设样式
+ * 3. Ant Design Grid 布局：基础的栅格布局，用于简单场景
+ */
+declare function LayoutContainer({ className: containerClassName, config, children, }: LayoutContainerProps): React.ReactElement | null;
+export default LayoutContainer;

package/lib/pro/Selector/demo.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const SelectorDemo: () => JSX.Element;
+export default SelectorDemo;

package/lib/pro/Selector/hooks/usePresetItemProps.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+import { ItemProps, ItemLayout, SelectorVariant, PresetConfig } from '../types';
+interface UsePresetItemPropsParams {
+    variant?: SelectorVariant;
+    itemLayout?: ItemLayout;
+    preset?: PresetConfig;
+    itemProps?: ItemProps;
+    indicator: React.ReactNode;
+    numberSelector: React.ReactNode;
+    mode?: 'single' | 'multiple';
+    disabled?: boolean;
+    selected?: boolean;
+}
+interface PresetItemPropsResult {
+    mediaProps: Record<string, any>;
+    cardProps: Record<string, any>;
+}
+/**
+ * 根据预设项生成 option Item 的 props
+ *
+ * 规则说明：
+ * 1. variant='default': 使用 Card，borderless，horizontal，selectedType='none'，actionsPosition='left'
+ *    1.1 preset.variant='1': renderContent={() => <span>{dataSource._label}</span>}
+ *    1.2 preset.variant='2': renderContent={() => <span>{dataSource._label}</span>}
+ * 2. variant='media': 使用 MediaItem
+ *    2.1 preset.variant='1': size='small', showIndicator=false, 单选shape='circle'，多选shape='square'
+ *    2.2 preset.variant='2': size='large', showIndicator=true, shape='circle'
+ * 3. variant='card': 根据 itemLayout 区分横向和纵向
+ *    3.1 横向（horizontal）:
+ *        - preset.variant='2': selectedType='filled'
+ *        - preset.variant='5': variant='borderless'
+ *        - 默认样式: styles.container = { padding: 8 }
+ *        - 使用 lodash merge 深度合并样式，itemProps.styles 优先级更高
+ *    3.2 纵向（vertical）:
+ *        - 统一使用 borderless，selectedType='none'
+ *        - preset.variant='2': indicator 通过 corner 传入
+ *    3.3 actions 处理:
+ *        - 优先使用 numberSelector（如果存在）
+ *        - 其次使用 indicator
+ *        - 纵向且 preset.variant='2': indicator 放到 corner，actions 仅展示 numberSelector
+ */
+declare const usePresetItemProps: (params: UsePresetItemPropsParams) => PresetItemPropsResult;
+export default usePresetItemProps;

package/lib/pro/Selector/hooks/usePresetProps.d.ts

@@ -0,0 +1,24 @@
+import { LayoutConfig, ItemLayout, PresetConfig, SelectorVariant, SelectorProps } from '../types';
+interface UsePresetPropsParams {
+    layout?: LayoutConfig;
+    mode?: 'single' | 'multiple';
+    preset?: PresetConfig;
+    itemLayout?: ItemLayout;
+    variant?: SelectorVariant;
+    indicatorProps?: SelectorProps['indicatorProps'];
+}
+interface UsePresetPropsResult {
+    layout: LayoutConfig | null;
+    indicatorProps: SelectorProps['indicatorProps'];
+}
+/**
+ * 根据预设配置生成 layout 和 indicatorProps
+ * Layout 规则：
+ * - 根据 variant 和 preset.variant 计算布局样式
+ * IndicatorProps 规则：
+ * 1. 当 variant='card' 且 preset.variant='2' 时，indicator 默认 variant='filled'
+ * 2. 当 variant='media' 时，indicator 默认 variant='filled'
+ * 3. 外部传入的 indicatorProps 优先级更高（会合并到预设配置中）
+ */
+declare const usePresetProps: ({ layout, mode, preset, itemLayout, variant, indicatorProps, }: UsePresetPropsParams) => UsePresetPropsResult;
+export default usePresetProps;

package/lib/pro/Selector/types.d.ts

@@ -0,0 +1,213 @@
+/// <reference types="react" />
+export interface ExprRule {
+    [key: string]: any;
+}
+export interface RuleConfig {
+    autoValidate?: boolean;
+    required?: 0 | 1;
+    min?: number;
+    max?: number;
+    mutex?: Array<Array<OptionKey>>;
+    customValidator?: (value: SelectionValue) => Promise<void>;
+}
+export interface GroupItem {
+    id?: number;
+    title?: string;
+    mode?: 'single' | 'multiple';
+    valueType?: 'primitive' | 'object';
+    preserve?: boolean;
+    fieldNames?: {
+        label?: string;
+        value?: string;
+        cover?: string;
+    };
+    ruleConfig?: RuleConfig;
+    dataSource?: OptionItem[];
+}
+export interface OptionItem {
+    id?: number;
+    title?: string;
+    label?: string;
+    value?: OptionKey;
+    cover?: string;
+    groups?: GroupItem[];
+    disabled?: boolean;
+    ruleConfig?: {
+        min?: number;
+        max?: number;
+    };
+    [key: string]: any;
+}
+export declare type OptionKey = number | string;
+/** 原始值类型：单选时为id，多选时为id[] */
+export declare type SelectionValuePrimitive<T = OptionKey> = T | T[];
+/** 复杂对象值类型：包含id、数量等额外信息 */
+export interface SelectionValueObject<T = OptionKey> {
+    value?: T;
+    quantity?: number;
+    [key: string]: any;
+}
+/** 单选值类型 */
+export declare type SelectionValueSingle<T = OptionKey> = T | SelectionValueObject<T>;
+/** 多选值类型 */
+export declare type SelectionValueMultiple<T = OptionKey> = T[] | SelectionValueObject<T>[];
+/** 选择器值类型 */
+export declare type SelectionValue<T = OptionKey> = SelectionValueSingle<T> | SelectionValueMultiple<T>;
+export declare type RenderItemProps = {
+    dataSource: OptionItem;
+    actions: any;
+    optionItemValue?: any;
+    indicator: React.ReactNode;
+    numberSelector: React.ReactNode;
+    values: any;
+    quantityInfo: {
+        maxReached: boolean;
+        remainingCount: number;
+        selectedCount: number;
+    };
+};
+export declare type ItemProps = {
+    layout?: 'vertical' | 'horizontal';
+    renderContent?: (props: {
+        dataSource: OptionItem;
+    }) => React.ReactNode;
+    styles?: {
+        [key: string]: React.CSSProperties;
+    };
+    [key: string]: any;
+};
+export declare type LayoutType = 'antdGrid' | 'custom';
+/** 单个断点的完整配置 */
+export declare type BreakpointConfig = {
+    columns: number;
+    gap?: number | string;
+    style?: React.CSSProperties;
+};
+/**
+ * 断点映射
+ * key: 最小宽度（px）
+ * value: 列数（简写）或完整配置
+ * @example { 0: 1, 420: 2, 630: 3 } // 简写
+ * @example { 0: { columns: 1, gap: 12 }, 420: { columns: 2, gap: 16 } } // 完整
+ */
+export declare type BreakpointMap = Record<number, number | BreakpointConfig>;
+/** 响应式布局配置 */
+export declare type ResponsiveConfig = {
+    /** 每项最小宽度，系统自动计算断点 */
+    minWidth?: number;
+    /** 最大列数限制 */
+    maxColumns?: number;
+    /**
+     * 显式断点映射，key 为容器最小宽度(px)
+     * @example { 0: 1, 420: 2, 630: 3, 841: 4, 1367: 5 }
+     * @example { 0: { columns: 1, gap: 12 }, 420: { columns: 2, gap: 16 } }
+     */
+    breakpoints?: BreakpointMap;
+    /** 默认列数（容器宽度小于所有断点时），默认为 1 */
+    defaultColumns?: number;
+    /** 间距，默认为 16 */
+    gap?: number | string;
+    /** ResizeObserver 防抖延迟(ms)，默认为 0 */
+    debounce?: number;
+};
+export declare type LayoutConfig = {
+    type?: LayoutType;
+    className?: string;
+    containerStyle?: React.CSSProperties;
+    /**
+     * 响应式布局配置
+     * 存在此配置时自动启用 ResizeObserver 响应式布局
+     */
+    responsive?: ResponsiveConfig;
+    columns?: number;
+    gutter?: number | object | Array<number>;
+    align?: 'top' | 'middle' | 'bottom' | 'stretch';
+    justify?: 'start' | 'end' | 'center' | 'space-between' | 'space-around';
+    wrap?: boolean;
+    colConfig?: {
+        [key: string]: any;
+    };
+};
+export interface PresetConfig {
+    variant?: '1' | '2' | '3' | '4' | '5';
+}
+export declare type ItemLayout = 'vertical' | 'horizontal';
+export declare type SelectorVariant = 'default' | 'select' | 'card' | 'media';
+export declare type HeaderProps = {
+    visible?: boolean;
+    style?: React.CSSProperties;
+    title?: {
+        visible?: boolean;
+        text?: React.ReactNode;
+        style?: React.CSSProperties;
+    };
+    icon?: {
+        visible?: boolean;
+        icon?: React.ReactNode;
+        style?: React.CSSProperties;
+    };
+    tip?: {
+        visible?: boolean;
+        text?: React.ReactNode;
+        style?: React.CSSProperties;
+    };
+    renderExtra?: (props: {
+        dataSource: OptionItem;
+        values: SelectionValue;
+    }) => React.ReactNode;
+};
+export interface SelectorProps<T = OptionKey> extends GroupItem {
+    className?: string;
+    value?: SelectionValue<T>;
+    defaultValue?: SelectionValue<T>;
+    onChange?: (value: SelectionValue<T>) => void;
+    onClear?: () => void;
+    disabled?: boolean;
+    variant?: SelectorVariant;
+    itemLayout?: ItemLayout;
+    preset?: PresetConfig;
+    layout?: LayoutConfig;
+    renderItem?: (props: RenderItemProps) => React.ReactNode;
+    itemProps?: ItemProps;
+    indicatorProps?: {
+        show?: boolean;
+        variant?: 'outlined' | 'filled';
+        render?: (props: {
+            option: OptionItem;
+            selected: boolean;
+            disabled: boolean;
+            actions: any;
+        }) => React.ReactNode;
+        [key: string]: any;
+    };
+    showStepper?: true | false | 'auto';
+    stepperProps?: {
+        size?: 'small' | 'middle' | 'large';
+        shape?: 'round' | 'square';
+        horizontalPadding?: number | string;
+    };
+    style?: React.CSSProperties;
+    /**
+     * @deprecated
+     */
+    titleProps?: HeaderProps;
+    headerProps?: HeaderProps;
+    selectProps?: any;
+}
+export interface SelectorGroupProps {
+    allowedValuesPolicy?: 'relaxed' | 'strict';
+    className?: string;
+    customScrollParent?: HTMLElement | string;
+    dataSource: GroupItem[];
+    defaultValue?: Record<string, SelectionValue>;
+    linkageRules?: ExprRule[] | Record<string, any>;
+    onChange?: (values: Record<string, SelectionValue>) => void;
+    preserve?: boolean;
+    tabProps?: {
+        visible?: boolean;
+    };
+    style?: React.CSSProperties;
+    value?: Record<string, SelectionValue>;
+    scrollToFirstError?: boolean;
+    [key: string]: any;
+}

package/lib/pro/keyboards/index.d.ts

@@ -0,0 +1,2 @@
+export { default as NumberKeyboard } from './numberKeyboard';
+export type { NumberKeyboardProps, NumberKeyboardMode } from './numberKeyboard/types';

package/lib/pro/keyboards/locales.d.ts

@@ -0,0 +1,24 @@
+declare const _default: {
+    en: {
+        'pisell2.keyboard.number-keybard.max': (max: number | string) => string;
+        'pisell2.keyboard.number-keybard.min': (min: number | string) => string;
+        'pisell2.keyboard.number-keybard.ok': string;
+        'pisell2.keyboard.number-keybard.reset': string;
+        'pisell2.keyboard.number-keybard.clear': string;
+    };
+    'zh-CN': {
+        'pisell2.keyboard.number-keybard.max': (max: number | string) => string;
+        'pisell2.keyboard.number-keybard.min': (min: number | string) => string;
+        'pisell2.keyboard.number-keybard.ok': string;
+        'pisell2.keyboard.number-keybard.reset': string;
+        'pisell2.keyboard.number-keybard.clear': string;
+    };
+    'zh-HK': {
+        'pisell2.keyboard.number-keybard.max': (max: number | string) => string;
+        'pisell2.keyboard.number-keybard.min': (min: number | string) => string;
+        'pisell2.keyboard.number-keybard.ok': string;
+        'pisell2.keyboard.number-keybard.reset': string;
+        'pisell2.keyboard.number-keybard.clear': string;
+    };
+};
+export default _default;

package/lib/pro/keyboards/numberKeyboard/types.d.ts

@@ -0,0 +1,63 @@
+/// <reference types="react" />
+export declare type NumberKeyboardMode = 'integer' | 'decimal';
+export interface NumberKeyboardBaseProps {
+    /** 模式：整数 or 小数 */
+    mode?: NumberKeyboardMode;
+    /** 当前值（受控） */
+    value?: string;
+    /** 默认值（非受控） */
+    defaultValue?: string;
+    /** 原始值，用于重置 */
+    originalValue?: string;
+    /** 占位符 */
+    placeholder?: string;
+    /** 最大值 */
+    max?: number;
+    /** 最小值 */
+    min?: number;
+    /** 最大长度 */
+    maxLength?: number;
+    /** 小数位数，默认 2 */
+    precision?: number;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 确认按钮文本 */
+    doneText?: string;
+    /** 重置按钮文本 */
+    resetText?: string;
+    /** 清空按钮文本 */
+    clearText?: string;
+    /** 标签文本（显示在输入框上方） */
+    label?: string;
+    /** 超出范围时的提示文本 */
+    errorText?: string;
+    /** 值变化回调 */
+    onChange?: (value: string) => void;
+    /** 确认按钮点击回调 */
+    onEnter?: (value: string) => void;
+    /** 重置按钮点击回调 */
+    onReset?: () => void;
+    /** 外层样式 */
+    style?: React.CSSProperties;
+    /** 自定义类名 */
+    className?: string;
+    /** 键盘是否监听物理键盘 */
+    keydown?: boolean;
+    /** 输入框样式 */
+    inputStyle?: React.CSSProperties;
+    /** 输入框包裹样式 */
+    inputWrapperStyle?: React.CSSProperties;
+}
+export interface NumberKeyboardProps extends NumberKeyboardBaseProps {
+    /** 容器配置，用于控制键盘以 popover 或 modal 形态展示 */
+    containerProps?: {
+        /** 渲染类型：popover 或 modal */
+        renderType: 'modal' | 'popover';
+        /** 是否打开（受控模式） */
+        open?: boolean;
+        /** 其他传递给 Popover 或 Modal 的属性 */
+        [key: string]: any;
+    };
+    /** 子元素，用于 popover 模式的触发器 */
+    children?: React.ReactNode;
+}

package/lib/pro/pisellNumberSelector/example.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Example: React.FC;
+export default Example;

package/lib/pro/pisellPaymentList/example.d.ts

@@ -4,6 +4,7 @@
  * 这个文件演示了如何使用 PisellPaymentList 和 PisellPaymentListItem 组件
  * 包括如何通过 Context 访问父组件配置
  */
+/// <reference types="react" />
 export declare const BasicExample: () => JSX.Element;
 export declare const ChildrenExample: () => JSX.Element;
 export declare const CustomItemExample: () => JSX.Element;

package/lib/test/setup.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/vitest';

package/lowcode/eco-cup-list/meta.ts

@@ -9,7 +9,7 @@ const EcoCupListMeta: ComponentMetadata = {
   "devMode": "proCode",
   "npm": {
     "package": "@pisell/private-materials",
-    "version": "6.3.80",
+    "version": "6.8.108",
     "exportName": "EcoCupList",
     "main": "src/index.ts",
     "destructuring": true,

package/lowcode/eco-customer-list/meta.ts

@@ -9,7 +9,7 @@ const EcoCustomerListMeta: ComponentMetadata = {
   "devMode": "proCode",
   "npm": {
     "package": "@pisell/private-materials",
-    "version": "6.3.80",
+    "version": "6.8.108",
     "exportName": "EcoCustomerList",
     "main": "src/index.ts",
     "destructuring": true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/private-materials",
-  "version": "6.3.81",
+  "version": "6.3.83",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -76,10 +76,10 @@
     "react-infinite-scroll-component": "^6.1.0",
     "react-resizable": "^3.0.5",
     "styled-components": "^6.0.0-rc.3",
-    "@pisell/utils": "3.0.5",
+    "@pisell/icon": "0.0.11",
     "@pisell/materials": "6.3.23",
     "@pisell/date-picker": "3.0.8",
-    "@pisell/icon": "0.0.11"
+    "@pisell/utils": "3.0.5"
   },
   "peerDependencies": {
     "react": "^18.0.0",