@spacego/fe-components 0.1.0 → 0.2.0

package/lib/types/fe-permission/index.d.ts

@@ -0,0 +1,10 @@
+import { IBasicProps, IPermissionProps } from '../typings';
+/**
+ * 权限控制组件属性
+ */
+export interface FePermissionProps extends IPermissionProps, Pick<IBasicProps, 'children'> {
+  /**
+   * @name 权限字符串
+   */
+  permission?: string;
+}

package/lib/types/fe-permission-provider/index.d.ts

@@ -0,0 +1,8 @@
+import { IPermissionStore } from '../hooks/use-permission.hook/index.d';
+import { IBasicProps } from '../typings';
+export interface FePermissionProviderProps extends Pick<IBasicProps, 'children'> {
+  /**
+   * @name 按钮权限字符串
+   */
+  btnPermissionList?: IPermissionStore['btnPermissionList'];
+}

package/lib/types/fe-radio/index.d.ts

@@ -0,0 +1,2 @@
+import { RadioProps } from 'antd';
+export interface FeRadioProps extends RadioProps {}

package/lib/types/fe-radio-group/index.d.ts

@@ -0,0 +1,2 @@
+import { RadioGroupProps } from 'antd';
+export interface FeRadioGroupProps extends RadioGroupProps {}

package/lib/types/fe-rich-text/index.d.ts

@@ -0,0 +1,167 @@
+import { default as Quill, BoundsStatic, DeltaStatic, RangeStatic, Sources } from 'quill';
+import { CSSProperties, ReactElement } from 'react';
+export type Value = string | DeltaStatic;
+export type Range = RangeStatic | null;
+
+export interface FeRichTextRef {
+  focus: () => void;
+  blur: () => void;
+  getEditor: () => Quill | null;
+  getUnprivilegedEditor: () => UnprivilegedEditor | null;
+}
+
+export interface UnprivilegedEditor {
+  getLength(): number;
+  getText(index?: number, length?: number): string;
+  getHTML(): string;
+  getDisplayHTML(): string;
+  getBounds(index: number, length?: number): BoundsStatic;
+  getSelection(focus?: boolean): RangeStatic;
+  getContents(index?: number, length?: number): DeltaStatic;
+}
+
+type uploadToolConfig = {
+  imageConfig?: any;
+  uploadFn: any;
+};
+
+export interface FeRichTextProps {
+  /**
+   * 编辑器的内容
+   */
+  value?: Value;
+
+  /**
+   * 非受控模式的默认值
+   */
+  defaultValue?: Value;
+
+  /**
+   * 内容变化时的回调函数
+   */
+  onChange?: (value: string, delta: DeltaStatic, source: Sources, editor: UnprivilegedEditor) => void;
+
+  /**
+   * 选择变化时的回调函数
+   */
+  onChangeSelection?: (selection: Range, source: Sources, editor: UnprivilegedEditor) => void;
+
+  /**
+   * 编辑器获取焦点回调
+   */
+  onFocus?: (selection: Range, source: Sources, editor: UnprivilegedEditor) => void;
+
+  /**
+   * 编辑器失去焦点回调
+   */
+  onBlur?: (previousSelection: Range, source: Sources, editor: UnprivilegedEditor) => void;
+
+  /**
+   * 编辑器高度
+   */
+  height?: number | string;
+
+  /**
+   * 是否只读
+   */
+  readOnly?: boolean;
+
+  /**
+   * 占位符文本
+   */
+  placeholder?: string;
+
+  /**
+   * 编辑区域边界
+   */
+  bounds?: string | HTMLElement;
+
+  /**
+   * 格式白名单
+   */
+  formats?: string[];
+
+  /**
+   * 自定义模块配置
+   */
+  modules?: Record<string, any>;
+
+  /**
+   * 自定义样式
+   */
+  style?: CSSProperties;
+
+  /**
+   * 自定义类名
+   */
+  className?: string;
+
+  /**
+   * HTML ID
+   */
+  id?: string;
+
+  /**
+   * Tab索引
+   */
+  tabIndex?: number;
+
+  /**
+   * Tab键对应的空格数量
+   */
+  tabSize?: number;
+
+  /**
+   * 自定义主题
+   */
+  theme?: 'snow' | 'bubble' | string;
+
+  /**
+   * 滚动容器
+   */
+  scrollingContainer?: string | HTMLElement;
+
+  /**
+   * 键盘事件
+   */
+  onKeyPress?: React.KeyboardEventHandler;
+  onKeyDown?: React.KeyboardEventHandler;
+  onKeyUp?: React.KeyboardEventHandler;
+
+  /**
+   * 保留空白符
+   */
+  preserveWhitespace?: boolean;
+
+  /**
+   * 自定义子元素
+   */
+  children?: ReactElement;
+
+  /**
+   * 上传配置
+   */
+  uploadToolConfig?: uploadToolConfig;
+}
+
+/**
+ * Quill Delta格式类型
+ */
+export interface Delta {
+  ops?: {
+    insert?: any;
+    delete?: number;
+    retain?: number;
+    attributes?: Record<string, any>;
+  }[];
+}
+
+/**
+ * 工具栏配置选项
+ */
+export interface ToolbarOptions {
+  container?: string | string[][] | HTMLElement;
+  handlers?: Record<string, any>;
+}
+
+declare const FeRichText: React.FC<FeRichTextProps>;

package/lib/types/fe-select/index.d.ts

@@ -0,0 +1,8 @@
+import { SelectProps } from 'antd';
+export interface FeSelectProps extends SelectProps {
+  /**
+   * @name minWidth 最小宽度
+   * @default `200px`
+   */
+  minWidth?: string;
+}

package/lib/types/fe-switch/index.d.ts

@@ -0,0 +1,2 @@
+import { SwitchProps } from 'antd';
+export interface FeSwitchProps extends SwitchProps {}

package/lib/types/fe-table/fe-edit-table/index.d.ts

@@ -0,0 +1,3 @@
+import { FeEditTableProps } from '../type/table.d';
+declare const FeEditTable: (props: FeEditTableProps) => import("react/jsx-runtime").JSX.Element;
+export default FeEditTable;

package/lib/types/fe-table/fe-edit-table-cell/index.d.ts

@@ -0,0 +1,16 @@
+import { ITableColumns } from '../type/table.d';
+interface EditableCellProps extends ITableColumns {
+    dataIndex: string;
+    label: string;
+    editing: boolean;
+    record: any;
+    rowKey: string;
+    index: number;
+    children: React.ReactNode;
+    formRef: React.RefObject<any>;
+    onTableValueChange: (values: any) => void;
+    errorKey: Array<string>;
+    [key: string]: any;
+}
+declare const FeEditableCell: import('react').MemoExoticComponent<(props: EditableCellProps) => import("react/jsx-runtime").JSX.Element>;
+export default FeEditableCell;

package/lib/types/fe-table/fe-head-title/index.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+declare const FeHeadTitle: (props: {
+    title: ReactNode;
+    subTitle: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export default FeHeadTitle;

package/lib/types/fe-table/fe-normal-table/index.d.ts

@@ -0,0 +1,3 @@
+import { FeTableProps } from '../type/table.d';
+declare const FeNormalTable: (props: FeTableProps) => import("react/jsx-runtime").JSX.Element;
+export default FeNormalTable;

package/lib/types/fe-table/fe-sub-table/index.d.ts

@@ -0,0 +1,3 @@
+import { FeSubTableProps } from '../type/table.d';
+declare const FeSubTable: ({ columns, record, config }: FeSubTableProps) => import("react/jsx-runtime").JSX.Element;
+export default FeSubTable;

package/lib/types/fe-table/fe-table/index.d.ts

@@ -0,0 +1,3 @@
+import { FeFullTableProps } from '../type/table.d';
+declare const FeTable: (props: FeFullTableProps) => import("react/jsx-runtime").JSX.Element;
+export default FeTable;

package/lib/types/fe-table/fe-table-alert/index.d.ts

@@ -0,0 +1,13 @@
+import { Key } from 'antd/es/table/interface';
+export interface FeTableAlertProps<T = any> {
+    selectedRowKeys: Key[];
+    selectedRows: T[];
+    onCleanSelected: () => void;
+    tableAlertRender?: ((params: {
+        selectedRowKeys: Key[];
+        selectedRows: T[];
+        onCleanSelected: () => void;
+    }) => React.ReactNode) | false;
+}
+declare const FeTableAlert: <T extends Record<string, any> = any>(props: FeTableAlertProps<T>) => import("react/jsx-runtime").JSX.Element | null;
+export default FeTableAlert;

package/lib/types/fe-table/fe-table-link/index.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { IColumnsHandleConfig } from '../type/table.d';
+
+
+export type TFeTableLinkConfig<T> = IColumnsHandleConfig & { record: T; index: number };
+
+export interface FeTableLinkProps<T> {
+  config: Array<TFeTableLinkConfig<T>>;
+  modal?: {
+    confirm: (config: { title?: string; content?: React.ReactNode; onOk?: () => void; onCancel?: () => void }) => void;
+  };
+}

package/lib/types/fe-table/fe-table-render/index.d.ts

@@ -0,0 +1,13 @@
+import { ITableColumns, TRenderType } from '../type/table.d';
+
+
+export interface FeTableRenderProps<DataType extends Record<string, any>> {
+  value: any;
+  width: ITableColumns<DataType>['width'];
+  record: DataType;
+  column: ITableColumns<DataType>;
+  renderType: TRenderType;
+  renderParams: ITableColumns<DataType>['renderParams'];
+  tagRenderParams: ITableColumns<DataType>['tagRenderParams'];
+  thousandsParams?: ITableColumns<DataType>['thousandsParams'];
+}

package/lib/types/fe-table/fe-table-setting/index.d.ts

@@ -0,0 +1,22 @@
+import { ITableColumns } from '../type/table.d';
+export interface FeTableSettingProps<T = any> {
+    /**
+     * 表格列配置
+     */
+    columns: ITableColumns<T>[];
+    /**
+     * 列顺序变化回调
+     */
+    onColumnsChange?: (columns: ITableColumns<T>[]) => void;
+    /**
+     * 列显示/隐藏变化回调
+     */
+    onColumnVisibilityChange?: (dataIndex: string, visible: boolean) => void;
+    /**
+     * 隐藏的列的dataIndex数组
+     */
+    hiddenColumns?: string[];
+    style?: React.CSSProperties;
+}
+declare const FeTableSetting: <T extends Record<string, any> = any>(props: FeTableSettingProps<T>) => import("react/jsx-runtime").JSX.Element;
+export default FeTableSetting;

package/lib/types/fe-table/fe-table-toolbar/index.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { IToolBarBtnConfig } from '../type/table.d';
+
+
+export interface FeTableToolbarProps {
+  config: IToolBarBtnConfig[];
+  btnPermissionList?: string[];
+  modal?: {
+    confirm: (config: {
+      title?: string;
+      content?: React.ReactNode;
+      onOk?: () => void;
+      onCancel?: () => void;
+    }) => void;
+  }
+}
+
+declare const FeTableToolbar: React.ForwardRefExoticComponent<FeTableToolbarProps>;

package/lib/types/fe-table/fe-table-utils/index.d.ts

@@ -0,0 +1,193 @@
+import { FormInstance } from 'antd';
+import { ITableColumns, ITableParams } from '../type/table.d';
+import * as React from 'react';
+/**
+ * 判断是否需要重新请求前一页数据
+ * @param record 当前数据记录
+ * @param pageNo 当前页码
+ * @returns 是否需要重新请求前一页
+ */
+export declare const shouldRequestPreviousPage: (record: any[], pageNo: number) => boolean;
+/**
+ * 渲染操作按钮
+ */
+export declare const renderActionButtons: <T extends Record<string, any>>(record: T, index: number, columnsHandleConfig: any[], btnPermissionList: string[] | undefined, modal: any) => import("react/jsx-runtime").JSX.Element | never[];
+/**
+ * 创建单元格渲染器
+ */
+export declare const createCellRenderer: (column: ITableColumns<any>) => ((text: any, record: any, index: number) => React.ReactNode) | ((_: any, record: any) => import("react/jsx-runtime").JSX.Element);
+/**
+ * 添加序号列
+ */
+export declare const addIndexColumn: (columns: ITableColumns<any>[], showIndex?: boolean, pageNo?: number, pageSize?: number) => ITableColumns<any>[];
+/**
+ * 添加操作列并处理所有列的渲染函数
+ */
+export declare const processTableColumns: (columns: ITableColumns<any>[], columnsHandleConfig: any[] | undefined, btnPermissionList: string[] | undefined, columnsHandleAttr: ITableParams<any>["columnsHandleAttr"], modal: any) => {
+    render: ((text: any, record: any, index: number) => React.ReactNode) | ((_: any, record: any) => import("react/jsx-runtime").JSX.Element);
+    dataIndex: string | number | symbol;
+    key?: React.Key;
+    title: string | React.ReactNode;
+    titleRender?: React.ReactNode;
+    showHint?: boolean;
+    hintText?: string | React.ReactNode;
+    ellipsis?: boolean | {
+        showTitle: boolean;
+    };
+    align?: "left" | "center" | "right";
+    fixed?: false | "left" | "right";
+    width?: number;
+    dataType?: "string" | "integer" | "double" | "dict";
+    renderType?: import('../type/table.d').TRenderType;
+    renderParams?: {
+        tooltip: boolean;
+        ellipsis: boolean;
+        maxLines?: number;
+    };
+    defaultRenderParams?: {
+        filter?: any;
+        dictfilterParams?: {
+            dictList: Array<{
+                dataIndex: string;
+                label: string;
+            }>;
+        };
+    };
+    tagRenderParams?: {
+        filter?: any;
+        dictfilterParams?: {
+            dictList: Array<{
+                dataIndex: string;
+                label: string;
+            }>;
+        };
+        separator?: string;
+        themeEnums?: Record<string, "processing" | "success" | "error" | "default" | "warning">;
+    };
+    editRenderParams?: import('../type/table.d').IEditRenderParams;
+    thousandsParams?: {
+        precision?: number;
+        fillZero?: boolean;
+        separator?: string;
+    };
+    hideInSetting?: boolean;
+}[];
+/**
+ * 应用列样式
+ */
+export declare const applyColumnStyles: (columns: ITableColumns<any>[]) => {
+    ellipsis: boolean | {
+        showTitle: boolean;
+    };
+    align: "center" | "left" | "right";
+    dataIndex: string | number | symbol;
+    key?: React.Key;
+    title: string | React.ReactNode;
+    titleRender?: React.ReactNode;
+    showHint?: boolean;
+    hintText?: string | React.ReactNode;
+    render?: (text: any, record: any, index: number) => React.ReactNode;
+    fixed?: false | "left" | "right";
+    width?: number;
+    dataType?: "string" | "integer" | "double" | "dict";
+    renderType?: import('../type/table.d').TRenderType;
+    renderParams?: {
+        tooltip: boolean;
+        ellipsis: boolean;
+        maxLines?: number;
+    };
+    defaultRenderParams?: {
+        filter?: any;
+        dictfilterParams?: {
+            dictList: Array<{
+                dataIndex: string;
+                label: string;
+            }>;
+        };
+    };
+    tagRenderParams?: {
+        filter?: any;
+        dictfilterParams?: {
+            dictList: Array<{
+                dataIndex: string;
+                label: string;
+            }>;
+        };
+        separator?: string;
+        themeEnums?: Record<string, "processing" | "success" | "error" | "default" | "warning">;
+    };
+    editRenderParams?: import('../type/table.d').IEditRenderParams;
+    thousandsParams?: {
+        precision?: number;
+        fillZero?: boolean;
+        separator?: string;
+    };
+    hideInSetting?: boolean;
+}[];
+/**
+ * 解析表单数据，将带行ID后缀的字段名转换为按行分组的数据
+ * @param formData 原始表单数据 (如 {name_1: 'John', age_1: 25, name_2: 'Jane'})
+ * @param rowKey 行标识字段名
+ * @returns 按行分组的数据 (如 {'1': {name: 'John', age: 25}, '2': {name: 'Jane'}})
+ */
+export declare const parseTableFormData: (formData: Record<string, any>, rowKey?: string) => Record<string, any>;
+/**
+ * 从当前行数据中提取行ID
+ * @param record 当前行记录
+ * @param rowKey 行标识字段名
+ * @returns 行ID
+ */
+export declare const getRowIdFromRecord: (record: any, rowKey?: string) => string;
+/**
+ * 根据字段名和行ID构建表单字段名
+ * @param fieldName 字段名
+ * @param rowId 行ID
+ * @returns 表单字段名 (如 'name_1')
+ */
+export declare const buildFormFieldName: (fieldName: string, rowId: string) => string;
+/**
+ * 处理表格校验规则，注入表格上下文
+ * @param rules 原始校验规则数组
+ * @param record 当前行记录
+ * @param rowKey 行标识字段名
+ * @param formInstance 表单实例
+ * @returns 处理后的校验规则数组
+ */
+export declare const processTableRules: (rules: any[] | undefined, record: any, rowKey: string, formInstance: any) => any[];
+/**
+ * 表格上下文类型定义
+ */
+export interface TableContext {
+    /** 当前行记录（包含最新表单数据） */
+    currentRecord: Record<string, any>;
+    /** 所有表格行数据 */
+    allTableData: Record<string, any>;
+    /** 表单实例 */
+    form: FormInstance;
+}
+/**
+ * 创建表格校验上下文
+ * @param record 当前行记录
+ * @param rowKey 行标识字段名
+ * @param formInstance 表单实例
+ * @returns 表格校验上下文对象
+ */
+export declare const createTableContext: (record: any, rowKey: string, formInstance: any) => TableContext;
+/**
+ * 处理对象中的事件处理器，注入表格上下文
+ * @param obj 包含事件处理器的对象
+ * @param record 当前行记录
+ * @param rowKey 行标识字段名
+ * @param formInstance 表单实例
+ * @returns 处理后的对象
+ */
+export declare const processEventHandlers: (obj: Record<string, any> | undefined, record: any, rowKey: string, formInstance: any) => Record<string, any>;
+/**
+ * 深度处理表单属性中所有 *Attributes 对象的事件处理器
+ * @param formProps 表单属性配置
+ * @param record 当前行记录
+ * @param rowKey 行标识字段名
+ * @param formInstance 表单实例
+ * @returns 处理后的表单属性配置
+ */
+export declare const enhanceFormPropsWithContext: (formProps: any, record: any, rowKey: string, formInstance: any) => any;

package/lib/types/fe-table/index.d.ts

@@ -0,0 +1,6 @@
+export { default as FeTable } from './fe-table';
+export { shouldRequestPreviousPage } from './fe-table-utils';
+export * from './type/table.d';
+export * from './type/table-context.d';
+export { default as UseEditTable } from './use-edit-table';
+export { default as UseTable } from './use-table';

package/lib/types/fe-table/type/table-context.d.ts

@@ -0,0 +1,60 @@
+/**
+ * 可编辑表格上下文类型定义
+ */
+export interface TableContext {
+  /**
+   * 当前行记录（包含最新表单数据）
+   * 注意：这里的字段值是已经从表单中获取的最新值
+   */
+
+  currentRecord: Record<string, any>;
+
+  /**
+   * 所有表格行数据
+   * 格式: { rowId: rowData }
+   * 例如: { '1': { id: 1, name: '张三' }, '2': { id: 2, name: '李四' } }
+   */
+  allTableData: Record<string, Record<string, any>>;
+
+  /**
+   * Ant Design Form 表单实例
+   * 可以使用所有表单方法，如：
+   * - getFieldValue(name)
+   * - setFieldValue(name, value)
+   * - getFieldsValue()
+   * - setFieldsValue(values)
+   * - validateFields()
+   */
+  form: any;
+}
+
+/**
+ * 带表格上下文的事件处理器类型
+ * 用于为事件处理器提供类型提示
+ *
+ * @example
+ * ```typescript
+ * import type { TableEventHandler } from '@orchid/fe-table';
+ *
+ * const handleBlur: TableEventHandler<[React.FocusEvent]> = (event, tableContext) => {
+ *   const { currentRecord, form } = tableContext;
+ *   // ...
+ * };
+ * ```
+ */
+export type TableEventHandler<T extends any[] = any[]> = (...args: [...T, TableContext]) => void | Promise<void>;
+
+/**
+ * 表格值变更事件处理器
+ */
+export type TableValueChangeHandler = TableEventHandler<[any]>;
+
+/**
+ * 表格点击事件处理器
+ */
+export type TableClickHandler = TableEventHandler<[React.MouseEvent]>;
+
+/**
+ * 表格焦点事件处理器
+ */
+export type TableFocusHandler = TableEventHandler<[React.FocusEvent]>;