@pisell/materials 3.3.88 → 3.3.90

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

@@ -0,0 +1,268 @@
+import { FilterType } from "../filter/types";
+import { SortItemProps } from "../sort/types";
+import React from "react";
+export declare type StorageMode = "" | "localStorage";
+/**
+ * 排序总配置
+ */
+export declare type SortType = {
+    /** 排序是否展示 */
+    show: boolean;
+    /** 排序存储模式 */
+    storageMode: StorageMode;
+    list: SortItemProps[];
+};
+/**
+ * 列展示总配置
+ */
+export declare type ColumnSettingType = {
+    /** 列设置是否展示 */
+    show: boolean;
+    /** 列设置存储模式 */
+    storageMode: StorageMode;
+};
+declare type DataSourceListItemType = {
+    isCustom: boolean;
+    columnKey?: string;
+    label?: string;
+    name?: string | string[];
+    isHidden?: boolean;
+};
+/**
+ * 数据源分组总配置
+ */
+export declare type DataSourceGroupType = {
+    /** 分组设置是否展示 */
+    show: boolean;
+    /** 分组设置存储模式 */
+    storageMode: StorageMode;
+    /**  */
+    list: DataSourceListItemType[];
+};
+/**
+ * Gallery封面总配置
+ */
+declare type GalleryCoverType = {
+    /** 封面是否展示 */
+    show: boolean;
+    /**
+     * 封面图片可以使用的字段
+     */
+    fields: string[];
+    /**
+     * 封面高度
+     */
+    height: number;
+    /** 图片裁剪方式 */
+    objectFit: "fill" | "cover";
+};
+/**
+ * Gallery标题总配置
+ */
+declare type GalleryTitleType = {
+    /** 标题使用的字段 */
+    field: string;
+    /** 标题行数 */
+    line: number;
+};
+/**
+ * Gallery头部区域总配置
+ */
+declare type GalleryHeaderType = {
+    /** 头部区域插槽 */
+    slot?: (record: Record<string, any>, index: number) => React.ReactNode;
+    /** 头部区域其他字段设置 */
+    fields: {
+        /** 头部区域其他字段是否展示 */
+        show: boolean;
+        /** 头部区域其他字段 */
+        list: string[];
+    };
+};
+/**
+ * Gallery内容区域总配置
+ */
+declare type GalleryContentType = {
+    /** 内容区域字段配置 */
+    fields: {
+        columnKey: string;
+        show: boolean;
+    }[];
+};
+export declare type GallerySettingValueType = {
+    coverField: string | "noCover";
+    coverObjectFit: "fill" | "cover";
+    compactMode: "default" | "compact";
+    isShowLabel: boolean;
+};
+/**
+ * Gallery底部区域总配置
+ */
+declare type GalleryFooterType = {
+    /** 底部区域自定义渲染 */
+    render: (record: Record<string, any>, index: number) => React.ReactNode;
+    /** 底部区域高度 */
+    height: number;
+};
+/**
+ * Gallery模式总配置
+ */
+export declare type GallerySettingType = {
+    /** 卡片最小宽度 */
+    cardMinWidth: number;
+    /** 卡片最大宽度 */
+    cardMaxWidth: number;
+    /** 水平间隔 */
+    horizontalGutter: number;
+    /** 垂直间隔 */
+    verticalGutter: number;
+    /** 封面配置 */
+    cover: GalleryCoverType;
+    /** 标题配置 */
+    title: GalleryTitleType;
+    /** 头部区域 */
+    header: GalleryHeaderType;
+    /** 内容区域 */
+    content: GalleryContentType;
+    /** 固定高度 */
+    fixedHeight: boolean;
+    /** 固定的卡片高度 */
+    cardHeight: number;
+    /** 固定顶部 */
+    fixedHeader: boolean;
+    /** 固定底部 */
+    fixedFooter: boolean;
+    /** 底部区域 */
+    footer: GalleryFooterType;
+    /** 卡片点击时间 */
+    onItem: (record: Record<string, any>, index: number) => void;
+};
+/** 视图模式 */
+export declare type ModeType = "grid" | "gallery" | "kanban";
+/**
+ * 视图模式总配置
+ */
+export declare type GridViewType = {
+    /** 默认视图模式 */
+    defaultViewMode: ModeType;
+    /** 开启多视图模式可进行页面内转换 */
+    multiple: boolean;
+    /** 当前可用的视图模式列表 */
+    modeList: ModeType[];
+};
+declare type SortDetail = {
+    fromIndex: number;
+    toIndex: number;
+    dataSource: Record<string, any>[];
+    fromId: number | string;
+    toId: number | string;
+    fromItem: Record<string, any>;
+    toItem: Record<string, any>;
+};
+/** 导入导出模式 */
+export declare type ExportImportModeType = "import" | "export" | "export_file" | "import_log";
+/**
+ * @title: 导出导入api
+ * @description:
+ * @return {*}
+ * @Author: WangHan
+ * @Date: 2024-09-11 15:44
+ */
+export declare type ApiProps = {
+    export?: string;
+    import?: string;
+    export_file: string;
+    import_log?: string;
+    template?: string;
+};
+/**
+ * 导入导出配置
+ */
+export declare type ExportImportType = {
+    /** 是否展示 */
+    show: boolean;
+    /** 当前所选项 */
+    selectLists: string[];
+    /** 导入模版链接 */
+    templateFileUrl: string;
+    /** 标题 */
+    title: string;
+    hiddenKeys?: string[];
+    apiUrl?: ApiProps;
+    otherParams?: any;
+};
+/**
+ * 设置记忆范围
+ */
+export declare type LocalSettingsScope = "filters" | "sorting" | "columns";
+/**
+ * 本地记忆设置
+ */
+export declare type LocalSettingsType = {
+    /** 启用设置记忆 */
+    enable: boolean;
+    /** 记忆范围 */
+    scope: LocalSettingsScope[];
+    /** 不需要记忆的筛选字段（当 scope 包含 filters 时生效） */
+    excludedFilterFields?: string[];
+};
+export declare type GridViewProps = {
+    columns: any;
+    dataSource: any[];
+    dispatch: any;
+    /**
+     * 画册模式的配置
+     */
+    gallery: GallerySettingType;
+    /**
+     * 视图设置
+     */
+    view: GridViewType;
+    style: React.CSSProperties;
+    pagination: any;
+    filter: FilterType;
+    buttons: React.ReactNode | any[];
+    actionButtons: any;
+    sort: SortType;
+    title?: React.ReactNode | (() => React.ReactNode);
+    showTitle?: boolean;
+    subTitle?: React.ReactNode | (() => React.ReactNode);
+    showSubTitle?: boolean;
+    exportImport: ExportImportType;
+    onValuesChange: (changedValues: any, values: any) => void;
+    summary: any;
+    utils: any;
+    rowKey: ((record: Record<string, any>) => string) | string;
+    columnSetting?: ColumnSettingType;
+    dataSourceGroup?: DataSourceGroupType;
+    loading: boolean;
+    dragSort: boolean;
+    onSortChange?: (detail: SortDetail) => boolean;
+    __id?: string;
+    __designMode?: "design";
+    /**
+     * 当前本地配置的key 用此hash是否改变用来判断是否清空本地配置 不填默认使用columns数据生成hash
+     */
+    currentSettingKey?: string;
+    /**
+    * 当前本地配置的唯一值, 不填默认使用currentSettingKey
+    */
+    currentComponentId?: string;
+    /**
+     * 当前表格中数据发生变化事件 包含本地筛选和外部传入数据变化
+     * @param currentDataSource
+     */
+    onDataSourceChange?: (currentDataSource: Record<string, any>[]) => void;
+    tabs: {
+        show: boolean;
+        type: 'default' | 'button' | 'buttonGroup' | 'dropdown';
+        items: {
+            name: string;
+            filterBy?: Record<string, any>;
+            sortBy?: string;
+        }[];
+    };
+    /** 本地记忆设置 */
+    localSettings?: LocalSettingsType;
+};
+export {};

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

@@ -0,0 +1,17 @@
+import React from 'react';
+import './index.less';
+declare type Value = {
+    en: string;
+    'zh-CN': string;
+    'zh-HK': string;
+    'ja': string;
+    'pt': string;
+};
+interface TranslationProps {
+    value: Value;
+    onChange: (value: Value) => void;
+    maxLength?: number;
+    id?: string;
+}
+declare const Translation: React.FC<TranslationProps>;
+export default Translation;

package/lib/components/translation/utils.d.ts

@@ -0,0 +1,9 @@
+export declare const locales: {
+    en: string;
+    "zh-CN": string;
+    "zh-HK": string;
+    ja: string;
+    pt: string;
+};
+export declare const checkIfAllValuesAreEqual: (obj: any) => boolean;
+export declare const createTranslationText: (text: string, isAll?: boolean) => any;

package/lowcode/auto-resize-text/meta.ts

@@ -9,7 +9,7 @@ const AutoResizeTextMeta: ComponentMetadata = {
   "devMode": "proCode",
   "npm": {
     "package": "@pisell/materials",
-    "version": "3.3.87",
+    "version": "3.3.89",
     "exportName": "AutoResizeText",
     "main": "src/index.tsx",
     "destructuring": true,
@@ -277,10 +277,6 @@ const AutoResizeTextMeta: ComponentMetadata = {
                       "label": "progress",
                       "value": "progress"
                     },
-                    {
-                      "label": "label",
-                      "value": "label"
-                    },
                     {
                       "label": "title",
                       "value": "title"
@@ -553,6 +549,10 @@ const AutoResizeTextMeta: ComponentMetadata = {
                       "label": "kbd",
                       "value": "kbd"
                     },
+                    {
+                      "label": "label",
+                      "value": "label"
+                    },
                     {
                       "label": "legend",
                       "value": "legend"
@@ -751,10 +751,6 @@ const AutoResizeTextMeta: ComponentMetadata = {
                       "label": "progress",
                       "value": "progress"
                     },
-                    {
-                      "label": "label",
-                      "value": "label"
-                    },
                     {
                       "label": "title",
                       "value": "title"
@@ -1027,6 +1023,10 @@ const AutoResizeTextMeta: ComponentMetadata = {
                       "label": "kbd",
                       "value": "kbd"
                     },
+                    {
+                      "label": "label",
+                      "value": "label"
+                    },
                     {
                       "label": "legend",
                       "value": "legend"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "3.3.88",
+  "version": "3.3.90",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -89,9 +89,9 @@
     "styled-components": "^6.0.0-rc.3",
     "swiper": "^8.4.7",
     "vod-js-sdk-v6": "^1.4.11",
+    "@pisell/date-picker": "3.0.4",
     "@pisell/icon": "0.0.11",
-    "@pisell/utils": "3.0.2",
-    "@pisell/date-picker": "3.0.4"
+    "@pisell/utils": "3.0.2"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/es/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/es/components/PisellProcedure/index.d.ts

@@ -1,5 +0,0 @@
-/**
- * PisellProcedure 组件导出
- */
-export { default } from './PisellProcedure';
-export type { PisellProcedureProps, PisellProcedureRef, ProcedureHeaderProps, ProcedureBodyProps, ProcedureFooterProps, FooterPositionMode, BackConfirmModalConfig, BodyLayoutMode, BodyLayoutRatio, BodyDirection, StepItem, StepChangeResult, } from './types';

package/es/components/PisellSteps/PisellSteps.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import './PisellSteps.less';
-import type { PisellStepsProps } from './types';
-/**
- * PisellSteps 步骤条组件
- *
- * 基于 Ant Design Steps 组件进行二次封装和增强
- * 支持多种展示样式、布局方式和丰富的交互功能
- *
- * @author Pisell Team
- * @version 1.0.0
- */
-declare const PisellSteps: React.FC<PisellStepsProps>;
-export default PisellSteps;

package/es/components/dataSourceComponents/dataSourceSubForm/types.d.ts

@@ -1,117 +0,0 @@
-import React from 'react';
-import { ModeType } from '../dataSourceForm/type';
-/**
- * @title 字段选项接口
- * @description 用于下拉框、单选框等组件的选项配置
- */
-export interface DataSourceSubFormOption {
-    label?: React.ReactNode;
-    value: string | number;
-}
-/**
- * @title 字段 Schema 接口
- * @description 定义表单字段的结构和配置
- */
-export interface DataSourceSubFormFieldSchema {
-    /** 字段名称（必填） */
-    name: string;
-    /** 字段标签 */
-    label?: React.ReactNode;
-    /** 组件类型（兼容多种命名方式） */
-    component?: string;
-    componentName?: string;
-    /** 字段数据类型 */
-    type?: string;
-    /** 接口类型，用于映射到具体组件（如 Select、Input 等） */
-    interface?: string;
-    /** 字段选项列表（用于 Select、Radio 等） */
-    options?: DataSourceSubFormOption[];
-    /** 组件额外配置 */
-    props?: Record<string, any>;
-    /** 子字段（用于嵌套结构，如 Input.JSON） */
-    children?: DataSourceSubFormFieldSchema[];
-    _children?: DataSourceSubFormFieldSchema[];
-    /** 字段 Schema 配置 */
-    schema?: Record<string, any>;
-    /** UI Schema 配置（支持低代码平台的各种配置项） */
-    uiSchema?: {
-        title?: React.ReactNode;
-        enum?: DataSourceSubFormOption[];
-        'x-component'?: string;
-        'x-component-props'?: Record<string, any>;
-        'x-read-pretty'?: boolean;
-        'x-validator'?: string;
-        'x-display'?: 'visible' | 'hidden' | 'none';
-        'x-pattern'?: 'editable' | 'disabled' | 'readPretty';
-        'x-data-source'?: {
-            type?: string;
-            options?: Array<{
-                id?: string;
-                label: string | Record<string, any>;
-                value: string;
-                color?: string;
-            }>;
-            labelField?: string;
-            valueField?: string;
-            dataSource?: any;
-            extraParams?: Record<string, any>;
-        };
-        'x-record-schema'?: DataSourceSubFormSchema | DataSourceSubFormFieldSchema[] | string;
-        default?: any;
-        type?: 'string' | 'number' | 'integer' | 'boolean' | 'array' | 'object';
-    };
-}
-/**
- * @title Schema 接口
- * @description 表单字段集合的结构定义
- */
-export interface DataSourceSubFormSchema {
-    /** 字段列表 */
-    fields?: DataSourceSubFormFieldSchema[];
-    /** 属性映射（key-value 形式） */
-    properties?: Record<string, any>;
-    /** 子字段列表 */
-    children?: DataSourceSubFormFieldSchema[];
-}
-/**
- * @title DataSourceSubForm 组件 Props
- * @description
- * 独立的子表单组件，用于渲染一组表单字段。
- * 支持通过 xRecordSchema 配置字段，或直接传入 children 低代码子组件。
- */
-export interface DataSourceSubFormProps {
-    /** 渲染模式：edit（编辑）、disabled（禁用）、preview（预览） */
-    renderMode?: ModeType;
-    /**
-     * 表单值对象
-     * @example { "fieldName1": "value1", "fieldName2": "value2" }
-     */
-    value?: Record<string, any>;
-    /**
-     * 值变化回调
-     * @param value 更新后的表单值对象
-     */
-    onChange?: (value: Record<string, any>) => void;
-    /**
-     * xRecordSchema：定义表单字段结构
-     * 支持三种格式：
-     * 1. JSON 字符串
-     * 2. Schema 对象（包含 fields/properties/children）
-     * 3. 字段数组
-     */
-    xRecordSchema?: string | DataSourceSubFormSchema | DataSourceSubFormFieldSchema[];
-    /**
-     * 容器 children：低代码引擎渲染的子组件节点
-     * 优先使用 children，如果没有则回退到 xRecordSchema 渲染
-     */
-    children?: React.ReactNode;
-    /** 低代码设计模式标识 */
-    __designMode?: string;
-    /** 表单布局方式 */
-    layout?: 'horizontal' | 'vertical' | 'inline';
-    /** 自定义类名 */
-    className?: string;
-    /** 自定义样式 */
-    style?: React.CSSProperties;
-    [key: string]: any;
-}

package/es/components/dataSourceComponents/fields/RecordListWrapper/ReadPretty.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { RecordListWrapperProps } from './type';
-/**
- * @title: RecordListWrapper 只读态
- * @description: 低代码详情模式下展示每个 option 对应的 record 数据。
- *   值结构: { optionValue: { field1: v1, field2: v2 } }
- */
-declare const RecordListWrapperReadPretty: React.FC<RecordListWrapperProps>;
-export default RecordListWrapperReadPretty;