@pisell/materials 1.0.1034 → 1.0.1035

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

@@ -0,0 +1,259 @@
+import { TableProps } from "antd";
+import { ComponentType, Key, ReactNode } from "react";
+
+//#region src/components/pisellRecordBoard/types.d.ts
+/**
+ * 布局类型：一种 layout 对应一种「视图的集合」
+ * - grid: 搜索 + 表格 + 分页
+ * - card: 搜索 + 卡片列表 + 分页
+ * 后续可扩展 list、kanban 等
+ */
+type RecordBoardLayoutType = 'grid' | 'card';
+/**
+ * 列字段类型：对应 Pisell 表单组件，传入列 type 时用该组件自动渲染列（只读）与筛选项（编辑）
+ */
+type RecordBoardFieldType = 'singleLineText' | 'longText' | 'email' | 'phone' | 'url' | 'number' | 'currency' | 'percent' | 'rating' | 'singleSelect' | 'multipleSelect' | 'dateTime';
+/** 无 type 时筛选项可传入自定义组件，需支持 value / onChange 以接入 Form */
+type RecordBoardFilterComponentProps = {
+  value?: any;
+  onChange?: (value: any) => void;
+  [key: string]: any;
+};
+/** 选项格式，用于 getOptions / options；color 用于只读态 Tag 展示 */
+type RecordBoardOptionItem = {
+  label: string;
+  value: any; /** 只读态 Tag 颜色，如 '#e6f7ff' 或 antd 预设 'blue' */
+  color?: string;
+};
+/** 同步或异步返回选项列表，singleSelect/multipleSelect 的 fieldProps.getOptions 或 filter.getOptions 使用 */
+type RecordBoardGetOptions = (() => RecordBoardOptionItem[]) | (() => Promise<RecordBoardOptionItem[]>);
+/** 列筛选配置：不传列 type 时使用。可配置 type + options/props，或传入 component（接收 value/onChange）。 */
+interface RecordBoardColumnFilterConfig {
+  type?: 'single' | 'input' | 'datePicker' | 'rangePicker' | 'search';
+  label?: string;
+  options?: RecordBoardOptionItem[];
+  /** 同步或异步获取选项，与 options 二选一；支持 singleSelect/multipleSelect 及无 type 时 type:'single' */
+  getOptions?: RecordBoardGetOptions;
+  props?: Record<string, any>;
+  /** 放在快速筛选(true)还是高级筛选(false) */
+  quickFilter?: boolean;
+  /** 无 type 时可用：自定义筛选组件，由 Form 注入 value/onChange */
+  component?: ComponentType<RecordBoardFilterComponentProps>;
+}
+/**
+ * RecordBoard 列类型扩展（与 antd Table Column 兼容，仅增加可选字段）。
+ *
+ * 有 type（如 singleLineText）时：
+ * - 表格：自动用对应 Pisell 组件只读渲染；传入 render 则优先使用（覆盖）。
+ * - 筛选：自动用对应组件编辑态；传入 filter（type 或 component）则优先使用（覆盖）。
+ * - 排序：自动从组件 SortOptions 派生；传入 sort 则优先使用（覆盖）。
+ *
+ * 无 type 时：
+ * - 表格：无 render 则纯文本；可自定义 render。
+ * - 筛选：需配置 filterable + filter（type 或 component，component 需 value/onChange）。
+ * - 排序：需配置 sortable + sort（type 或 getSortItems）。
+ */
+interface RecordBoardColumnType<RecordType = any> {
+  title?: ReactNode;
+  dataIndex?: string | string[];
+  key?: string;
+  width?: number | string;
+  align?: 'left' | 'right' | 'center';
+  fixed?: 'left' | 'right' | boolean;
+  ellipsis?: boolean;
+  /** 列渲染；无 type 时必靠此或默认纯文本；有 type 时可选，传入则覆盖自动派生 */
+  render?: (value: any, record: RecordType, index: number) => ReactNode;
+  /** 其他 antd 列属性 */
+  [key: string]: any;
+  /** 字段类型；传入则表格/筛选/排序自动派生，可被 render/filter/sort 覆盖 */
+  type?: RecordBoardFieldType;
+  /**
+   * 传给 Pisell 组件的额外 props（type 存在且未用 filter/render 覆盖时生效）。
+   * singleSelect/multipleSelect 时支持 options 或 getOptions（同步/异步返回选项列表）。
+   */
+  fieldProps?: Record<string, any>;
+  /** 是否参与筛选；false 时不生成筛项；有 type 时默认 true */
+  filterable?: boolean;
+  /** 筛选配置；无 type 时必传 type 或 component；有 type 时可选，传入则覆盖自动派生 */
+  filter?: RecordBoardColumnFilterConfig;
+  /** 是否参与排序；false 时不生成排序项；有 type 时默认 true */
+  sortable?: boolean;
+  /**
+   * 排序配置；无 type 时需 sortable + sort；有 type 时可选，传入则覆盖自动派生。
+   * - type：内置排序子项（string/number/option 等）。
+   * - getSortItems：(fieldKey) => [{ key, label }]。
+   */
+  sort?: {
+    type?: 'date' | 'string' | 'number' | 'option';
+    label?: string;
+    isHidden?: boolean; /** 自定义排序子项，优先于 type；fieldKey 为列 key/dataIndex */
+    getSortItems?: (fieldKey: string) => Array<{
+      key: string;
+      label: string;
+    }>;
+  };
+}
+/**
+ * 分页状态（与容器内部一致）
+ */
+interface RecordBoardPaginationState {
+  pageNumber: number;
+  pageSize: number;
+}
+/**
+ * RecordBoard 容器 Context 值
+ * 与具体 layout 类型无关，所有 layout 共用同一套数据与操作
+ */
+interface RecordBoardContextValue {
+  /** 当前列表数据 */
+  data: any[];
+  /** 加载态 */
+  loading: boolean;
+  /** 总数（用于分页） */
+  total: number;
+  /** 分页状态 */
+  pagination: RecordBoardPaginationState;
+  /** 分页变更 */
+  onPageChange: (pageNumber: number, pageSize: number) => void;
+  /** 搜索/筛选参数 */
+  searchParams: Record<string, any>;
+  /** 触发搜索（会重置到第一页） */
+  onSearch: (params: Record<string, any>) => void;
+  /** 重置搜索 */
+  onReset?: () => void;
+  /** 当前布局类型，供子组件按需做差异化 */
+  layoutType: RecordBoardLayoutType;
+  /** 多选：当前选中的 key 列表 */
+  selectedKeys: Key[];
+  /** 多选：当前选中的行数据 */
+  selectedRows: any[];
+  /** 多选：选择变更回调（表格/卡片勾选、BatchActionBar 全选/清空/反选时调用） */
+  onSelectionChange: (keys: Key[], rows: any[]) => void;
+  /** 行主键，用于多选与列表渲染，如 'id' 或 (record) => record.id */
+  rowKey?: string | ((record: any) => Key);
+  /**
+   * 列显示隐藏状态（仅影响表格/卡片列展示，不影响 filter/sort 配置）。
+   * key 为列 key/dataIndex，value 为是否显示；未出现的列默认显示。
+   */
+  columnVisibility?: Record<string, boolean>;
+  /** 列显示隐藏变更回调 */
+  onColumnVisibilityChange?: (visibility: Record<string, boolean>) => void;
+  /** 各子组件透传 props，由 Provider 注入 */
+  childComponentProps?: RecordBoardChildComponentProps;
+}
+/**
+ * 各 layout 下子组件的可选透传配置（类似 ChildComponentProps）
+ */
+/**
+ * BatchActionBar 透传配置，与 PisellBatchActionBar 的 props 对齐。
+ * 具体类型见 PisellBatchActionBarProps，此处仅做透传用。
+ */
+type RecordBoardBatchActionBarProps = Record<string, any>;
+/** Filter 透传配置，与 PisellFilter 的 props 对齐 */
+type RecordBoardFilterProps = Record<string, any>;
+/**
+ * ToolBar 透传配置。
+ * - 继承 PisellToolBar 的 slots：topLeft、topRight、bottomLeft、bottomRight、tabs。
+ * - search：默认在工具栏内渲染 PisellFind；为对象时透传为 PisellFind 的 props；为 false 时不渲染搜索。
+ * - filter：默认在工具栏右侧渲染 PisellFilter；为对象时透传 PisellFilter props；为 false 时不渲染。筛选值绑定 searchParams.filter，变更触发 onSearch。
+ */
+interface RecordBoardToolBarProps {
+  className?: string;
+  style?: React.CSSProperties;
+  tabs?: React.ReactNode;
+  topLeft?: React.ReactNode;
+  topRight?: React.ReactNode;
+  bottomLeft?: React.ReactNode;
+  bottomRight?: React.ReactNode;
+  /** 在 ToolBar 内渲染搜索：默认 PisellFind；对象透传 PisellFind props；false 不渲染 */
+  search?: boolean | RecordBoardSearchProps;
+  /** 在 ToolBar 右侧渲染筛选：默认 PisellFilter；对象透传 PisellFilter props；false 不渲染。值存于 searchParams.filter */
+  filter?: boolean | RecordBoardFilterProps;
+  /** 在 ToolBar 内、筛选左侧渲染排序：默认 Sort；对象可传 list、placement 等；false 不渲染。值存于 searchParams.sort */
+  sort?: boolean | Record<string, any>;
+  /**
+   * 在 ToolBar 左侧展示内联快速筛选（替代 Filter 弹层内的 quickFilter）。
+   * 为 true 时使用 columns 派生的 quickFilter 列表；为对象时可传 filterList、formFiltersPrefix、size 等。
+   * 启用后建议对 filter 传 hiddenQuickFilter: true，弹层内仅保留高级筛选。
+   */
+  quickFilter?: boolean | Record<string, any>;
+  /** 列显示隐藏设置入口；默认 true（有 grid.columns 时显示）；false 时不渲染 */
+  columnSetting?: boolean;
+}
+/** Search 透传配置，与 PisellFind 的 props 对齐 */
+type RecordBoardSearchProps = Record<string, any>;
+/**
+ * Grid 布局透传配置，对应 RecordBoardGridView 的 props（useRecordBoardContext('grid') 会将其合并到 context）。
+ * 基于 antd TableProps，省略由 context 注入或组件自管的项（dataSource、loading、pagination、columns、scroll、size、rowSelection）。
+ * 多选用 selectedKeys/selectedRows/onSelectionChange；其余 Table props（如 onRow、onHeaderRow、expandable、rowClassName、summary）透传。
+ */
+type RecordBoardGridProps = {
+  /** 列配置；ToolBar 据此派生筛选与排序，ColumnSetting 据此做列显示隐藏 */columns?: RecordBoardColumnType[]; /** 默认隐藏的列 key 列表（对应 columns 的 key 或 dataIndex），用于初始化列显隐状态 */
+  defaultHiddenColumnKeys?: string[]; /** 表格滚动配置，同 antd Table scroll */
+  scroll?: {
+    x?: number | string;
+    y?: number | string;
+  }; /** 表格尺寸 */
+  size?: 'small' | 'middle' | 'default'; /** 当前选中的行 key 列表（多选） */
+  selectedKeys?: Key[]; /** 当前选中的行数据（多选） */
+  selectedRows?: unknown[]; /** 多选变更回调 */
+  onSelectionChange?: (keys: Key[], rows: unknown[]) => void;
+} & Omit<TableProps<unknown>, 'dataSource' | 'loading' | 'pagination' | 'columns' | 'scroll' | 'size' | 'rowSelection'>;
+interface RecordBoardChildComponentProps {
+  /** 搜索配置，透传给 PisellFind；关键词绑定 searchParams.keyword */
+  search?: RecordBoardSearchProps;
+  /** 工具栏配置，透传给 PisellToolBar；内置搜索会接 context.searchParams/onSearch */
+  toolBar?: RecordBoardToolBarProps;
+  pagination?: Record<string, any>;
+  /** Grid 布局配置：列、滚动、尺寸等，透传给 RecordBoardGridView */
+  grid?: RecordBoardGridProps;
+  cardList?: Record<string, any>;
+  /** 多选操作栏配置，透传给 PisellBatchActionBar */
+  batchActionBar?: RecordBoardBatchActionBarProps;
+}
+/**
+ * RecordBoard 容器 Props。
+ * 仅打散传参：列表/分页/搜索/多选/列显隐、以及 grid/toolBar/search/paginationConfig/batchActionBar/cardList 独立传入。
+ */
+interface RecordBoardProps {
+  /** 子节点，一般为某种 Layout 或自定义组合 */
+  children?: ReactNode;
+  /** 当前使用的布局类型 */
+  layoutType?: RecordBoardLayoutType;
+  /** 行主键，用于多选与列表 */
+  rowKey?: string | ((record: any) => Key);
+  /** 当前列表数据 */
+  data?: any[];
+  /** 加载态 */
+  loading?: boolean;
+  /** 总数（用于分页） */
+  total?: number;
+  /** 分页状态 */
+  pagination?: RecordBoardPaginationState;
+  /** 分页变更 */
+  onPageChange?: (pageNumber: number, pageSize: number) => void;
+  /** 搜索/筛选参数 */
+  searchParams?: Record<string, any>;
+  /** 触发搜索（会重置到第一页） */
+  onSearch?: (params: Record<string, any>) => void;
+  /** 重置搜索 */
+  onReset?: () => void;
+  /** Grid 配置：列、滚动、尺寸等 */
+  grid?: RecordBoardGridProps;
+  /** 工具栏配置 */
+  toolBar?: RecordBoardToolBarProps;
+  /** 搜索配置，透传给 PisellFind */
+  search?: RecordBoardSearchProps;
+  /** 分页组件透传配置（与 pagination 状态区分，此处为 Pagination 组件 props） */
+  paginationConfig?: Record<string, any>;
+  /** 多选操作栏配置 */
+  batchActionBar?: RecordBoardBatchActionBarProps;
+  /** 卡片列表配置 */
+  cardList?: Record<string, any>;
+  /** 是否启用分页（与 pagination 状态区分） */
+  enablePagination?: boolean;
+  /** 其他 */
+  [key: string]: any;
+}
+//#endregion
+export { RecordBoardChildComponentProps, RecordBoardColumnFilterConfig, RecordBoardColumnType, RecordBoardContextValue, RecordBoardFieldType, RecordBoardGetOptions, RecordBoardGridProps, RecordBoardLayoutType, RecordBoardOptionItem, RecordBoardProps, RecordBoardToolBarProps };

package/lib/components/pisellRecordBoard/utils/recordBoardColumns.js

@@ -0,0 +1,292 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.js');
+const require_objectSpread2 = require('../../../_virtual/_@oxc-project_runtime@0.108.0/helpers/objectSpread2.js');
+const require_PisellSingleLineText = require('../../pisellSingleLineText/PisellSingleLineText.js');
+const require_PisellLongText = require('../../pisellLongText/PisellLongText.js');
+const require_PisellEmail = require('../../pisellEmail/PisellEmail.js');
+const require_PisellPhone = require('../../pisellPhone/PisellPhone.js');
+const require_PisellUrl = require('../../pisellUrl/PisellUrl.js');
+const require_PisellNumber = require('../../pisellNumber/PisellNumber.js');
+const require_PisellCurrency = require('../../pisellCurrency/PisellCurrency.js');
+const require_PisellPercent = require('../../pisellPercent/PisellPercent.js');
+const require_PisellRating = require('../../pisellRating/PisellRating.js');
+const require_PisellSingleSelect = require('../../pisellSingleSelect/PisellSingleSelect.js');
+const require_PisellMultipleSelect = require('../../pisellMultipleSelect/PisellMultipleSelect.js');
+const require_PisellDateTimeDisplay = require('../../pisellDateTimeDisplay/PisellDateTimeDisplay.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/pisellRecordBoard/utils/recordBoardColumns.tsx
+const FIELD_TYPE_TO_READ_COMPONENT = {
+	singleLineText: require_PisellSingleLineText.default,
+	longText: require_PisellLongText.default,
+	email: require_PisellEmail.default,
+	phone: require_PisellPhone.default,
+	url: require_PisellUrl.default,
+	number: require_PisellNumber.default,
+	currency: require_PisellCurrency.default,
+	percent: require_PisellPercent.default,
+	rating: require_PisellRating.default,
+	singleSelect: require_PisellSingleSelect.default,
+	multipleSelect: require_PisellMultipleSelect.default,
+	dateTime: require_PisellDateTimeDisplay.default
+};
+/** 列 type 对应排序类型默认值（组件未导出 SortOptions 时使用） */
+const FIELD_TYPE_TO_SORT_OPTIONS_DEFAULT = {
+	singleLineText: { type: "string" },
+	longText: { type: "string" },
+	email: { type: "string" },
+	phone: { type: "string" },
+	url: { type: "string" },
+	number: { type: "number" },
+	currency: { type: "number" },
+	percent: { type: "number" },
+	rating: { type: "number" },
+	singleSelect: { type: "option" },
+	multipleSelect: { type: "option" },
+	dateTime: { type: "date" }
+};
+/** 从组件或默认值取排序配置；组件可挂载 SortOptions.getSortItems（内置完整排序项）或 SortOptions.type */
+function getSortOptionForFieldType(fieldType) {
+	const Com = FIELD_TYPE_TO_READ_COMPONENT[fieldType];
+	const fromComponent = Com && Com.SortOptions;
+	const fallback = FIELD_TYPE_TO_SORT_OPTIONS_DEFAULT[fieldType];
+	const opts = fromComponent !== null && fromComponent !== void 0 ? fromComponent : fallback;
+	return opts ? require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, fallback), opts) : null;
+}
+/** 列 type 对应到 FilterItem 的 type（用于不传 type 时的手动 filter 或派生筛选项的兼容形态） */
+const FIELD_TYPE_TO_FILTER_TYPE = {
+	singleLineText: "input",
+	longText: "input",
+	email: "input",
+	phone: "input",
+	url: "input",
+	number: "input",
+	currency: "input",
+	percent: "input",
+	rating: "single",
+	singleSelect: "single",
+	multipleSelect: "single",
+	dateTime: "rangePicker"
+};
+function getColumnKey(column) {
+	var _column$key;
+	const key = (_column$key = column.key) !== null && _column$key !== void 0 ? _column$key : Array.isArray(column.dataIndex) ? column.dataIndex.join(".") : column.dataIndex;
+	return typeof key === "string" ? key : "";
+}
+/** 获取列唯一 key，供列显示隐藏等使用 */
+function getRecordBoardColumnKey(column) {
+	return getColumnKey(column);
+}
+function getColumnLabel(column) {
+	const title = column.title;
+	if (typeof title === "string") return title;
+	return getColumnKey(column) || "";
+}
+function normalizeOptions(list) {
+	if (!Array.isArray(list)) return [];
+	return list.map((item) => item && typeof item === "object" && "label" in item && "value" in item ? {
+		label: String(item.label),
+		value: item.value
+	} : {
+		label: String(item),
+		value: item
+	});
+}
+/**
+* 只读单元格：当列使用 getOptions（异步）时，先解析选项再渲染 Pisell 只读组件。
+*/
+function AsyncOptionsReadCell({ getOptions, value, fieldType, fieldProps }) {
+	const [options, setOptions] = (0, react.useState)([]);
+	const Com = FIELD_TYPE_TO_READ_COMPONENT[fieldType];
+	(0, react.useEffect)(() => {
+		const result = getOptions();
+		Promise.resolve(result).then((list) => setOptions(normalizeOptions(list)));
+	}, [getOptions]);
+	if (Com == null) return value;
+	const common = require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ value }, fieldProps), {}, { options });
+	if (fieldType === "singleSelect" || fieldType === "multipleSelect") return /* @__PURE__ */ react.default.createElement(Com, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, common), {}, { readOnly: true }));
+	return /* @__PURE__ */ react.default.createElement(Com, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, common), {}, { mode: "read" }));
+}
+/** 为带 type 的列生成只读态渲染函数（Pisell 组件） */
+function createReadRender(column, fieldType) {
+	var _column$fieldProps;
+	const Com = FIELD_TYPE_TO_READ_COMPONENT[fieldType];
+	const fieldProps = (_column$fieldProps = column.fieldProps) !== null && _column$fieldProps !== void 0 ? _column$fieldProps : {};
+	const getOptions = fieldProps.getOptions;
+	const useAsyncOptions = (fieldType === "singleSelect" || fieldType === "multipleSelect") && typeof getOptions === "function";
+	return (value) => {
+		if (Com == null) return value;
+		if (useAsyncOptions) return /* @__PURE__ */ react.default.createElement(AsyncOptionsReadCell, {
+			getOptions,
+			value,
+			fieldType,
+			fieldProps
+		});
+		const common = require_objectSpread2._objectSpread2({ value }, fieldProps);
+		if (fieldType === "singleSelect" || fieldType === "multipleSelect") return /* @__PURE__ */ react.default.createElement(Com, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, common), {}, { readOnly: true }));
+		if (fieldType === "dateTime") return /* @__PURE__ */ react.default.createElement(Com, common);
+		return /* @__PURE__ */ react.default.createElement(Com, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, common), {}, { mode: "read" }));
+	};
+}
+/**
+* 处理列配置：对带 type 的列注入基于 Pisell 组件的 render，其余列保持不变。
+* 有 type 时若列上传入了 render 则优先使用（覆盖自动派生）。
+*/
+function processColumnsForGrid(columns) {
+	if (!Array.isArray(columns) || columns.length === 0) return columns !== null && columns !== void 0 ? columns : [];
+	return columns.map((col) => {
+		const fieldType = col.type;
+		if (!fieldType || !FIELD_TYPE_TO_READ_COMPONENT[fieldType]) return col;
+		const existingRender = col.render;
+		const readRender = createReadRender(col, fieldType);
+		return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, col), {}, { render: existingRender !== null && existingRender !== void 0 ? existingRender : ((value, record, index) => readRender(value, record, index)) });
+	});
+}
+/** 从列配置生成筛选项（FilterItemProps）；有 type 时可由 filter 覆盖，无 type 时需传 filter */
+function columnToFilterItem(column) {
+	var _f$label2, _f$props2, _f$options;
+	const key = getColumnKey(column);
+	const label = getColumnLabel(column);
+	if (!key) return null;
+	if (column.filterable === false) return null;
+	const hasExplicitFilter = column.filter && (column.filter.type != null || column.filter.component);
+	if (column.type && !hasExplicitFilter) {
+		var _column$fieldProps2, _fieldProps$options, _fieldProps$placehold;
+		const fieldType = column.type;
+		const filterType$1 = FIELD_TYPE_TO_FILTER_TYPE[fieldType];
+		const fieldProps = (_column$fieldProps2 = column.fieldProps) !== null && _column$fieldProps2 !== void 0 ? _column$fieldProps2 : {};
+		const hasGetOptions$1 = typeof fieldProps.getOptions === "function";
+		const options = fieldType === "singleSelect" || fieldType === "multipleSelect" || fieldType === "rating" ? (_fieldProps$options = fieldProps.options) !== null && _fieldProps$options !== void 0 ? _fieldProps$options : fieldType === "rating" ? [
+			1,
+			2,
+			3,
+			4,
+			5
+		].map((v) => ({
+			label: String(v),
+			value: v
+		})) : hasGetOptions$1 ? void 0 : [] : void 0;
+		return {
+			type: filterType$1,
+			key,
+			name: key,
+			label,
+			props: filterType$1 === "single" ? require_objectSpread2._objectSpread2({
+				options: options !== null && options !== void 0 ? options : [],
+				getOptions: fieldProps.getOptions
+			}, fieldProps) : require_objectSpread2._objectSpread2({ placeholder: (_fieldProps$placehold = fieldProps.placeholder) !== null && _fieldProps$placehold !== void 0 ? _fieldProps$placehold : `请输入${label}` }, fieldProps),
+			other: require_objectSpread2._objectSpread2({
+				fieldType,
+				getOptions: fieldProps.getOptions
+			}, fieldProps)
+		};
+	}
+	if (!column.filter) return null;
+	const f = column.filter;
+	if (f.component) {
+		var _f$label, _f$props;
+		return {
+			type: "custom",
+			key,
+			name: key,
+			label: (_f$label = f.label) !== null && _f$label !== void 0 ? _f$label : label,
+			props: (_f$props = f.props) !== null && _f$props !== void 0 ? _f$props : {},
+			other: require_objectSpread2._objectSpread2({ component: f.component }, f.props || {})
+		};
+	}
+	const filterType = f.type;
+	if (!filterType) return null;
+	const hasGetOptions = typeof f.getOptions === "function";
+	return {
+		type: filterType,
+		key,
+		name: key,
+		label: (_f$label2 = f.label) !== null && _f$label2 !== void 0 ? _f$label2 : label,
+		props: (_f$props2 = f.props) !== null && _f$props2 !== void 0 ? _f$props2 : filterType === "single" ? {
+			options: (_f$options = f.options) !== null && _f$options !== void 0 ? _f$options : [],
+			getOptions: f.getOptions
+		} : {},
+		other: filterType === "single" && hasGetOptions ? { getOptions: f.getOptions } : {}
+	};
+}
+/** 从列配置生成排序项（SortItemProps）；有 type 时可由 sort 覆盖，无 type 时需传 sortable + sort */
+function columnToSortItem(column) {
+	var _s$label;
+	const key = getColumnKey(column);
+	const label = getColumnLabel(column);
+	if (!key) return null;
+	if (column.sortable === false) return null;
+	const hasExplicitSort = column.sort && (column.sort.type != null || typeof column.sort.getSortItems === "function");
+	if (column.type && !hasExplicitSort) {
+		var _opts$label;
+		const fieldType = column.type;
+		if (!FIELD_TYPE_TO_READ_COMPONENT[fieldType]) return null;
+		const opts = getSortOptionForFieldType(fieldType);
+		if (!opts) return null;
+		const hasGetSortItems$1 = "getSortItems" in opts && typeof opts.getSortItems === "function";
+		return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, hasGetSortItems$1 ? {} : { type: "type" in opts ? opts.type : void 0 }), hasGetSortItems$1 && "getSortItems" in opts ? { getSortItems: opts.getSortItems } : {}), {}, {
+			name: key,
+			label: "label" in opts ? (_opts$label = opts.label) !== null && _opts$label !== void 0 ? _opts$label : label : label,
+			isCustom: false
+		}, "localFilter" in opts && opts.localFilter !== void 0 && { localFilter: opts.localFilter }), "isHidden" in opts && opts.isHidden !== void 0 && { isHidden: opts.isHidden });
+	}
+	if (!column.type && column.sortable !== true) return null;
+	if (!column.sort) return null;
+	const s = column.sort;
+	const hasGetSortItems = typeof s.getSortItems === "function";
+	const sortItem = require_objectSpread2._objectSpread2({
+		name: key,
+		label: (_s$label = s.label) !== null && _s$label !== void 0 ? _s$label : label,
+		isCustom: false
+	}, s.isHidden !== void 0 && { isHidden: s.isHidden });
+	if (hasGetSortItems && s.getSortItems) sortItem.getSortItems = s.getSortItems;
+	else if (s.type != null) sortItem.type = s.type;
+	return sortItem;
+}
+/**
+* 从 columns 派生排序列表（SortItemProps[]）。
+* 有 type 的列：根据组件 SortOptions（或默认）生成；无 type 的列：根据 sortable + sort 生成。
+*/
+function deriveSortFromColumns(columns) {
+	if (!Array.isArray(columns) || columns.length === 0) return [];
+	const list = [];
+	for (const col of columns) {
+		if (Boolean(col.type && FIELD_TYPE_TO_READ_COMPONENT[col.type]) && col.sortable === false) continue;
+		const item = columnToSortItem(col);
+		if (item) list.push(item);
+	}
+	return list;
+}
+/**
+* 从 columns 派生 filter 列表（quickFilter + otherFilter）。
+* 有 type 的列：根据 type + fieldProps 生成筛选项；无 type 的列：根据 filterable + filter 生成。
+*/
+function deriveFilterFromColumns(columns) {
+	const quickFilter = [];
+	const otherFilter = [];
+	if (!Array.isArray(columns) || columns.length === 0) return {
+		quickFilter,
+		otherFilter
+	};
+	for (const col of columns) {
+		var _col$filter, _col$filter2;
+		if (!getColumnKey(col)) continue;
+		const hasType = Boolean(col.type && FIELD_TYPE_TO_READ_COMPONENT[col.type]);
+		if (hasType && col.filterable === false) continue;
+		const useQuick = hasType ? ((_col$filter = col.filter) === null || _col$filter === void 0 ? void 0 : _col$filter.quickFilter) === true : Boolean(col.filterable && ((_col$filter2 = col.filter) === null || _col$filter2 === void 0 ? void 0 : _col$filter2.quickFilter));
+		const item = columnToFilterItem(col);
+		if (!item) continue;
+		if (useQuick) quickFilter.push(item);
+		else otherFilter.push(item);
+	}
+	return {
+		quickFilter,
+		otherFilter
+	};
+}
+
+//#endregion
+exports.deriveFilterFromColumns = deriveFilterFromColumns;
+exports.deriveSortFromColumns = deriveSortFromColumns;
+exports.getRecordBoardColumnKey = getRecordBoardColumnKey;
+exports.processColumnsForGrid = processColumnsForGrid;

package/lib/components/pisellShellFrame/PisellShellFrame.d.ts

@@ -0,0 +1,16 @@
+import { PisellShellFrameProps } from "./types.js";
+import React from "react";
+import "./PisellShellFrame.less";
+
+//#region src/components/pisellShellFrame/PisellShellFrame.d.ts
+/**
+ * PisellShellFrame：通用壳层布局组件。
+ * 支持通过 config 控制各区域显隐，不同展示类型（表格/看板/日历/楼层图等）复用同一壳层。
+ *
+ * - 顶部：标题区（标题/副标题/辅助信息）、工具区（Toolbar）、统计区（Statistic List，可选折叠）
+ * - 中间：滚动承载（可选）+ Layout 插槽（children）
+ * - 底部：批量操作条（按选中状态出现）、状态提示区（加载/错误/同步提示等）
+ */
+declare const PisellShellFrame: React.FC<PisellShellFrameProps>;
+//#endregion
+export { PisellShellFrame };

package/lib/components/pisellShellFrame/PisellShellFrame.js

@@ -0,0 +1,62 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.js');
+const require_objectSpread2 = require('../../_virtual/_@oxc-project_runtime@0.108.0/helpers/objectSpread2.js');
+const require_index = require('../../locales/index.js');
+let antd = require("antd");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+require("./PisellShellFrame.less");
+
+//#region src/components/pisellShellFrame/PisellShellFrame.tsx
+const defaultConfig = {
+	showTitle: false,
+	showToolbar: false,
+	showStatistic: false,
+	statisticCollapsible: false,
+	scroll: false,
+	showBatchActionBar: false,
+	showStatusArea: false
+};
+/**
+* PisellShellFrame：通用壳层布局组件。
+* 支持通过 config 控制各区域显隐，不同展示类型（表格/看板/日历/楼层图等）复用同一壳层。
+*
+* - 顶部：标题区（标题/副标题/辅助信息）、工具区（Toolbar）、统计区（Statistic List，可选折叠）
+* - 中间：滚动承载（可选）+ Layout 插槽（children）
+* - 底部：批量操作条（按选中状态出现）、状态提示区（加载/错误/同步提示等）
+*/
+const PisellShellFrame = (props) => {
+	const { className, style, config: configProp, title, subtitle, titleExtra, toolbar, statisticList, children, batchActionBar, statusArea } = props;
+	const config = require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, defaultConfig), configProp);
+	const [statisticCollapsed, setStatisticCollapsed] = (0, react.useState)(false);
+	const hasTitle = config.showTitle && (title != null || subtitle != null || titleExtra != null);
+	const hasToolbar = config.showToolbar && toolbar != null;
+	const hasStatistic = config.showStatistic && statisticList != null;
+	const hasBatchBar = config.showBatchActionBar && batchActionBar != null;
+	const hasStatus = config.showStatusArea && statusArea != null;
+	const scrollConfig = config.scroll;
+	const useScroll = scrollConfig === true || typeof scrollConfig === "object" && scrollConfig != null;
+	const scrollOpts = typeof scrollConfig === "object" && scrollConfig != null ? scrollConfig : null;
+	const scrollStyle = scrollOpts === null || scrollOpts === void 0 ? void 0 : scrollOpts.style;
+	const scrollClassName = scrollOpts === null || scrollOpts === void 0 ? void 0 : scrollOpts.className;
+	return /* @__PURE__ */ react.default.createElement("div", {
+		className: `pisell-shell-frame ${className !== null && className !== void 0 ? className : ""}`.trim(),
+		style,
+		"data-shell-frame": true
+	}, /* @__PURE__ */ react.default.createElement("header", { className: "pisell-shell-frame-header" }, hasTitle && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-title" }, /* @__PURE__ */ react.default.createElement("span", null, title != null && /* @__PURE__ */ react.default.createElement("span", { className: "pisell-shell-frame-title-main" }, title), subtitle != null && /* @__PURE__ */ react.default.createElement("span", { className: "pisell-shell-frame-title-sub" }, subtitle)), titleExtra != null && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-title-extra" }, titleExtra)), hasToolbar && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-toolbar" }, toolbar), hasStatistic && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-statistic" }, config.statisticCollapsible ? /* @__PURE__ */ react.default.createElement(antd.Collapse, {
+		ghost: true,
+		activeKey: statisticCollapsed ? [] : ["statistic"],
+		onChange: (keys) => setStatisticCollapsed(keys.length === 0),
+		items: [{
+			key: "statistic",
+			label: /* @__PURE__ */ react.default.createElement("span", { className: "pisell-shell-frame-statistic-collapse-header" }, statisticCollapsed ? require_index.getText("shell-frame-statistic-expand") : require_index.getText("shell-frame-statistic-collapse")),
+			children: statisticList
+		}]
+	}) : statisticList)), /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-body" }, useScroll ? /* @__PURE__ */ react.default.createElement("div", {
+		className: `pisell-shell-frame-scroll ${scrollClassName !== null && scrollClassName !== void 0 ? scrollClassName : ""}`.trim(),
+		style: scrollStyle
+	}, children) : children), /* @__PURE__ */ react.default.createElement("footer", { className: "pisell-shell-frame-footer" }, hasBatchBar && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-batch-bar" }, batchActionBar), hasStatus && /* @__PURE__ */ react.default.createElement("div", { className: "pisell-shell-frame-status" }, statusArea)));
+};
+PisellShellFrame.displayName = "PisellShellFrame";
+
+//#endregion
+exports.PisellShellFrame = PisellShellFrame;