arthub-table 0.0.3

package/dist/types/core/viewers/PunchTimingViewer.d.ts

@@ -0,0 +1,42 @@
+/**
+ * PunchTimingViewer - 打卡计时单元格渲染器
+ * 功能：显示时间格式文本（如 00:00:00），支持点击播放/暂停图标切换计时
+ *
+ * 核心设计：
+ *   viewerData 在每次 draw/onClick 时由 Cell.buildViewerData() 重新创建，
+ *   因此不能将可变计时状态存储在 data 上。改用 viewer 内部的 Map 来持久化。
+ */
+import type { CellViewer, ViewerRenderContext, PunchTimingViewerData } from './types';
+declare class PunchTimingViewer implements CellViewer<PunchTimingViewerData> {
+    readonly type = "punch-timing";
+    /**
+     * 以 "rowIndex-colIndex" 为 key 持久化计时器状态，
+     * 不随 data 对象重建而丢失。
+     */
+    private readonly timerStates;
+    /** 绘制单元格内容 */
+    draw(context: ViewerRenderContext, data: PunchTimingViewerData): void;
+    /** 处理点击事件 */
+    onClick(context: ViewerRenderContext, data: PunchTimingViewerData, localX: number, localY: number): boolean;
+    /** 获取鼠标悬停时的光标样式 */
+    getInteractiveCursor(context: ViewerRenderContext, data: PunchTimingViewerData, localX: number, localY: number): string | null;
+    /** 清理所有计时器资源 */
+    dispose(): void;
+    /** 绘制播放/暂停图标 */
+    private drawIcon;
+    /** 绘制时间文本 */
+    private drawTimeText;
+    /** 获取或创建持久化的计时器状态 */
+    private getOrCreateState;
+    /** 开始计时 */
+    private startTimer;
+    /** 暂停计时 */
+    private pauseTimer;
+    /** 每秒更新显示 */
+    private tick;
+    /** 安全清除 interval */
+    private clearInterval;
+    /** 获取要显示的时间文本 */
+    private getDisplayText;
+}
+export default PunchTimingViewer;

package/dist/types/core/viewers/PunchViewer.d.ts

@@ -0,0 +1,116 @@
+/**
+ * PunchViewer - 打卡进度单元格渲染器（Canvas 实现）
+ * 功能：显示环形进度条 + 日期文本 + 审批状态图标 + 未读提示红点 + 编辑/更多操作图标
+ * 从 PunchViewerOld.ts（DOM 实现）转换而来
+ */
+import type { CellViewer, ViewerRenderContext, CellViewerData } from './types';
+/**
+ * 打卡 Viewer 数据接口
+ */
+export interface PunchViewerData extends CellViewerData {
+    value: PunchValue | null;
+    /** 数据行 ID */
+    id?: string | number;
+    /** 属性 key */
+    key?: string;
+    /** 是否可编辑 */
+    canEdit?: boolean;
+    /** 是否显示删除线 */
+    showLineThrow?: boolean;
+    /** 日期显示模式 */
+    datePattern?: string;
+    /** 是否关联属性 */
+    isLink?: boolean;
+    /** 关联 key */
+    linkKey?: string;
+    /** 是否有错误 */
+    error?: {
+        errorProperty?: string;
+        errorMessage?: string;
+    } | null;
+}
+/**
+ * 打卡值
+ */
+export interface PunchValue {
+    /** 打卡记录 ID，> 0 表示已打卡 */
+    punch_id?: number;
+    /** 打卡日期时间戳 */
+    created_date?: number;
+    /** 进度 0~1 */
+    progress?: number;
+    /** 审批状态 */
+    review_status?: number | string;
+    /** 是否已读 */
+    is_read?: boolean;
+}
+declare class PunchViewer implements CellViewer<PunchViewerData> {
+    readonly type = "punch";
+    /**
+     * 绘制打卡单元格内容
+     */
+    draw(context: ViewerRenderContext, data: PunchViewerData): void;
+    /**
+     * 处理点击事件
+     * 返回 true 表示事件已被处理
+     */
+    onClick(context: ViewerRenderContext, data: PunchViewerData, localX: number, localY: number): boolean;
+    /**
+     * 获取交互区域的光标样式
+     */
+    getInteractiveCursor(context: ViewerRenderContext, data: PunchViewerData, localX: number, localY: number): string | null;
+    /**
+     * 根据打卡日期和审批状态获取环形进度条颜色
+     */
+    private getRingColor;
+    /**
+     * 绘制环形进度条
+     * @param ctx Canvas 上下文
+     * @param cx 圆心 X
+     * @param cy 圆心 Y
+     * @param radius 半径
+     * @param strokeWidth 线宽
+     * @param progress 进度 0~1
+     * @param color 进度颜色
+     */
+    private drawPercentRing;
+    /**
+     * 绘制审批状态图标（在环形进度条中心）
+     * 审批通过：✓ 图标
+     * 审批拒绝：✕ 图标
+     */
+    private drawReviewIcon;
+    /**
+     * 绘制日期文本
+     */
+    private drawDateText;
+    /**
+     * 绘制未读提示红点
+     */
+    private drawHintDot;
+    /**
+     * 绘制右侧操作图标（更多 + 编辑）
+     */
+    private drawAfterIcons;
+    /**
+     * 绘制列表/更多图标（三横线）
+     */
+    private drawListIcon;
+    /**
+     * 绘制编辑/铅笔图标
+     */
+    private drawEditIcon;
+    /**
+     * 绘制删除线
+     */
+    private drawStrikethrough;
+    /**
+     * 绘制错误提示图标（⚠）
+     */
+    private drawErrorIcon;
+    /**
+     * 文本截断，超出宽度时显示省略号
+     */
+    private truncateText;
+}
+export default PunchViewer;

package/dist/types/core/viewers/RichTextViewer.d.ts

@@ -0,0 +1,83 @@
+/**
+ * RichTextViewer - 富文本单元格渲染器（Canvas 实现）
+ * 功能：去除 HTML 标签后渲染纯文本 + 编辑按钮 + 错误提示 + 关联图标 + 删除线
+ * <img> 标签显示为 [图片]，<video> 标签显示为 [视频]
+ * 参考 AssetMatrix/src/views/components/ProgressPanel/ProgressPropsViewer/richTextViewer.ts
+ */
+import type { CellViewer, ViewerRenderContext, CellViewerData } from './types';
+/**
+ * 富文本 Viewer 数据接口
+ */
+export interface RichTextViewerData extends CellViewerData {
+    /** HTML 富文本内容或纯文本 */
+    value: string | null;
+    /** 数据行 ID */
+    id?: string | number;
+    /** 属性 key */
+    key?: string;
+    /** 是否可编辑 */
+    canEdit?: boolean;
+    /** 是否显示删除线 */
+    showLineThrow?: boolean;
+    /** 是否关联属性 */
+    isLink?: boolean;
+    /** 关联 key */
+    linkKey?: string;
+    /** 是否有错误 */
+    error?: {
+        errorProperty?: string;
+        errorMessage?: string;
+    } | null;
+    /** 占位符文本 */
+    placeholder?: string;
+}
+/**
+ * 解析富文本值，去除 HTML 标签
+ * <img> 标签替换为 [图片]，<video> 标签替换为 [视频]
+ */
+export declare function getDisplayValue(value: string | null | undefined): string;
+declare class RichTextViewer implements CellViewer<RichTextViewerData> {
+    readonly type = "rich-text";
+    /**
+     * 绘制富文本单元格内容
+     */
+    draw(context: ViewerRenderContext, data: RichTextViewerData): void;
+    /**
+     * 处理点击事件
+     * 返回 true 表示事件已被处理
+     */
+    onClick(context: ViewerRenderContext, data: RichTextViewerData, localX: number, _localY: number): boolean;
+    /**
+     * 获取交互区域的光标样式
+     */
+    getInteractiveCursor(context: ViewerRenderContext, data: RichTextViewerData, localX: number, _localY: number): string | null;
+    /**
+     * 绘制文本内容
+     */
+    private drawText;
+    /**
+     * 绘制右侧编辑按钮
+     */
+    private drawEditButton;
+    /**
+     * 绘制编辑/铅笔图标
+     */
+    private drawEditIcon;
+    /**
+     * 绘制关联图标（链接/附件图标）
+     */
+    private drawLinkIcon;
+    /**
+     * 绘制删除线
+     */
+    private drawStrikethrough;
+    /**
+     * 绘制错误提示图标（⚠）
+     */
+    private drawErrorIcon;
+    /**
+     * 文本截断，超出宽度时显示省略号
+     */
+    private truncateText;
+}
+export default RichTextViewer;

package/dist/types/core/viewers/SelectViewer.d.ts

@@ -0,0 +1,57 @@
+/**
+ * SelectViewer - Dropdown select rendering viewer
+ * Handles single and multiple select display with colored tags
+ */
+import type { CellViewer, ViewerRenderContext, SelectViewerData } from './types';
+/**
+ * SelectViewer renders select/dropdown options in cells
+ * Supports single select, multiple select, and colored tag display
+ */
+declare class SelectViewer implements CellViewer<SelectViewerData> {
+    readonly type = "select";
+    /**
+     * Draw select content in the cell
+     */
+    draw(context: ViewerRenderContext, data: SelectViewerData): void;
+    /**
+     * Get selected options from value
+     */
+    private getSelectedOptions;
+    /**
+     * Draw empty state
+     */
+    private drawEmptyState;
+    /**
+     * Draw single select option
+     */
+    private drawSingleOption;
+    /**
+     * Draw multiple select tags
+     */
+    private drawMultipleTags;
+    /**
+     * Calculate tag width based on text
+     */
+    private calculateTagWidth;
+    /**
+     * Draw a tag/badge
+     */
+    private drawTag;
+    /**
+     * Draw "+N" more indicator
+     */
+    private drawMoreIndicator;
+    /**
+     * Draw dropdown arrow
+     */
+    private drawArrow;
+    /**
+     * Draw a rounded rectangle
+     */
+    private drawRoundedRect;
+    /**
+     * Truncate text with ellipsis
+     */
+    private truncateText;
+}
+export default SelectViewer;

package/dist/types/core/viewers/SeparatorRowViewer.d.ts

@@ -0,0 +1,25 @@
+/**
+ * SeparatorRowViewer - Separator row rendering viewer
+ * Renders empty visual separator rows between groups
+ */
+import type { CellViewer, ViewerRenderContext, SeparatorRowViewerData } from './types';
+/**
+ * SeparatorRowViewer renders separator rows between groups
+ * These rows are purely visual and don't contain any editable content
+ */
+declare class SeparatorRowViewer implements CellViewer<SeparatorRowViewerData> {
+    readonly type = "separator-row";
+    /**
+     * Draw separator row content (background only)
+     */
+    draw(context: ViewerRenderContext, data: SeparatorRowViewerData): void;
+    /**
+     * Separator rows do not handle click events
+     */
+    onClick(_context: ViewerRenderContext, _data: SeparatorRowViewerData, _localX: number, _localY: number): boolean;
+    /**
+     * Get preferred height for separator row
+     */
+    getPreferredHeight(_context: ViewerRenderContext, data: SeparatorRowViewerData): number;
+}
+export default SeparatorRowViewer;

package/dist/types/core/viewers/StatusTextViewer.d.ts

@@ -0,0 +1,40 @@
+/**
+ * StatusTextViewer - 状态文本渲染 viewer
+ * 用于展示状态标签（图标 + 文字），如"未开始"、"进行中"、"已完成"等
+ * 参考 AssetMatrix/src/views/components/ProgressPanel/ProgressPropsViewer/statusTextViewer.ts
+ */
+import type { CellViewer, ViewerRenderContext, StatusTextViewerData } from './types';
+/**
+ * StatusTextViewer 在单元格中渲染状态文本
+ * 展示形如 [图标] 进行中 的状态标签
+ */
+declare class StatusTextViewer implements CellViewer<StatusTextViewerData> {
+    readonly type = "status-text";
+    /** 空值占位符 */
+    private readonly emptyValue;
+    /**
+     * 绘制状态文本内容
+     */
+    draw(context: ViewerRenderContext, data: StatusTextViewerData): void;
+    /**
+     * 绘制状态内容（图标 + 文字）
+     */
+    private drawStatusContent;
+    /**
+     * 绘制空值占位文本
+     */
+    private drawEmptyText;
+    /**
+     * 绘制状态图标
+     */
+    private drawIcon;
+    /**
+     * 绘制角标（右上角三角形指示器）
+     */
+    private drawCorner;
+    /**
+     * 截断文本并添加省略号
+     */
+    private truncateText;
+}
+export default StatusTextViewer;

package/dist/types/core/viewers/StatusViewer.d.ts

@@ -0,0 +1,53 @@
+/**
+ * StatusViewer - Status tag rendering viewer
+ * Handles status display with icons and colored backgrounds
+ */
+import type { CellViewer, ViewerRenderContext, StatusViewerData } from './types';
+/**
+ * StatusViewer renders status values in cells
+ * Supports icons, colored tags, and various status types
+ */
+declare class StatusViewer implements CellViewer<StatusViewerData> {
+    readonly type = "status";
+    /**
+     * Draw status content in the cell
+     */
+    draw(context: ViewerRenderContext, data: StatusViewerData): void;
+    /**
+     * Find matching status option
+     */
+    private findStatusOption;
+    /**
+     * Draw status as a tag/badge
+     */
+    private drawStatusTag;
+    /**
+     * Draw status as plain text with icon
+     */
+    private drawStatusText;
+    /**
+     * Draw plain text for unknown status
+     */
+    private drawPlainText;
+    /**
+     * Draw status icon
+     */
+    private drawIcon;
+    /**
+     * Get background color for status type
+     */
+    private getTypeBackgroundColor;
+    /**
+     * Get text color for status type
+     */
+    private getTypeColor;
+    /**
+     * Draw a rounded rectangle
+     */
+    private drawRoundedRect;
+    /**
+     * Truncate text with ellipsis
+     */
+    private truncateText;
+}
+export default StatusViewer;

package/dist/types/core/viewers/TableActionButtonViewer.d.ts

@@ -0,0 +1,77 @@
+/**
+ * TableActionButtonViewer - Renders action buttons in table cells
+ *
+ * Features:
+ * - Renders multiple action buttons horizontally
+ * - Handles button overflow with "more" button
+ * - Supports different button styles (normal, operation, super admin)
+ * - Handles button clicks with callbacks
+ * - Shows link icon for linked tasks
+ *
+ * @example
+ * ```typescript
+ * const columnDef = {
+ *   key: 'actions',
+ *   title: 'Actions',
+ *   useViewer: true,
+ *   viewerType: 'table-action-button',
+ *   viewerConfig: {
+ *     onButtonClick: (event, payload) => {
+ *       console.log('Button clicked:', payload);
+ *     },
+ *     onOperationBtnClick: (event, payload) => {
+ *       console.log('Operation button clicked:', payload);
+ *     },
+ *     onAfterClick: (event, payload) => {
+ *       console.log('More button clicked:', payload);
+ *     }
+ *   }
+ * };
+ * ```
+ */
+import type { CellViewer, ViewerRenderContext, TableActionButtonViewerData } from './types';
+export declare class TableActionButtonViewer implements CellViewer<TableActionButtonViewerData> {
+    readonly type = "table-action-button";
+    private buttonPositions;
+    private moreButtonPosition;
+    /**
+     * Draw the cell content
+     */
+    draw(context: ViewerRenderContext, data: TableActionButtonViewerData): void;
+    /**
+     * Draw empty state placeholder
+     */
+    private drawEmpty;
+    /**
+     * Calculate button width based on text content
+     */
+    private calculateButtonWidth;
+    /**
+     * Calculate which buttons are visible and if overflow occurs
+     */
+    private calculateVisibleButtons;
+    /**
+     * Draw "more" button
+     */
+    private drawMoreButton;
+    /**
+     * Draw a single button
+     */
+    private drawButton;
+    /**
+     * Draw rounded rectangle path
+     */
+    private drawRoundedRect;
+    /**
+     * Draw link icon
+     */
+    private drawLinkIcon;
+    /**
+     * Handle click events on the cell
+     */
+    onClick(context: ViewerRenderContext, data: TableActionButtonViewerData, localX: number, localY: number): boolean;
+    /**
+     * Get cursor style for interactive areas
+     */
+    getInteractiveCursor(context: ViewerRenderContext, data: TableActionButtonViewerData, localX: number, localY: number): string | null;
+}

package/dist/types/core/viewers/TaskNodeViewer.d.ts

@@ -0,0 +1,106 @@
+/**
+ * TaskNodeViewer - 任务节点类型单元格渲染器（Canvas 实现）
+ * 功能：显示任务节点列表（图标 + 名称），右侧编辑/查看图标
+ * 从 DOM 实现的 taskNodeViewer-new.ts 转换而来
+ *
+ * 布局结构：[ middle (nodeItem, nodeItem, ...) ] [ linkIcon? ] [ after (editIcon / viewIcon) ]
+ */
+import type { CellViewer, ViewerRenderContext, TaskNodeViewerData } from './types';
+declare class TaskNodeViewer implements CellViewer<TaskNodeViewerData> {
+    readonly type = "task-node";
+    private imageManager;
+    /** 记录加载失败的图标 URL，避免反复重试 */
+    private failedIcons;
+    constructor();
+    /**
+     * 绘制任务节点单元格内容
+     */
+    draw(context: ViewerRenderContext, data: TaskNodeViewerData): void;
+    /**
+     * 处理点击事件
+     */
+    onClick(context: ViewerRenderContext, data: TaskNodeViewerData, localX: number, localY: number): boolean;
+    /**
+     * 处理双击事件
+     * 双击节点项时打印该节点的信息
+     */
+    onDblClick(context: ViewerRenderContext, data: TaskNodeViewerData, localX: number, localY: number): boolean;
+    /**
+     * 获取交互区域的光标样式
+     */
+    getInteractiveCursor(context: ViewerRenderContext, data: TaskNodeViewerData, localX: number, localY: number): string | null;
+    /**
+     * 解析值，返回标准化的 TaskNodeItem 数组
+     * 支持：TaskNodeItem[] / 逗号分隔字符串 / 单个数字 / null
+     */
+    private parseValue;
+    /**
+     * 通过 ID 数组和 customTaskNodeInfo 映射解析节点信息
+     */
+    private resolveNodesByIds;
+    /**
+     * 计算各区域的布局位置
+     * 所有坐标相对于单元格左上角
+     */
+    private calculateLayout;
+    /**
+     * 判断坐标是否在指定区域内
+     */
+    private isInArea;
+    /**
+     * 绘制节点项矩形背景
+     */
+    private drawNodeItemBackground;
+    /**
+     * 绘制空值占位符
+     */
+    private drawEmptyPlaceholder;
+    /**
+     * 绘制所有任务节点项
+     */
+    private drawTaskNodes;
+    /**
+     * 绘制任务节点图标
+     * 有 iconFile 时加载对应图标，无或加载失败时使用默认图标 icon_folder.svg
+     */
+    private drawNodeIcon;
+    /**
+     * 通用 SVG 图标绘制方法
+     */
+    private drawSvgIcon;
+    /**
+     * 绘制节点名称文本
+     */
+    private drawNodeName;
+    /**
+     * 绘制右侧操作区域
+     * canEdit 时显示编辑图标，否则显示列表图标
+     */
+    private drawAfterArea;
+    /**
+     * 绘制编辑/铅笔图标
+     */
+    private drawEditIcon;
+    /**
+     * 绘制列表/查看图标（简化的列表形状）
+     */
+    private drawViewIcon;
+    /**
+     * 绘制关联图标
+     */
+    private drawLinkIcon;
+    /**
+     * 绘制删除线
+     */
+    private drawStrikethrough;
+    /**
+     * 绘制错误提示图标（⚠）
+     * is_warning 为 true 时使用警告色，否则使用错误色
+     */
+    private drawErrorIcon;
+    /**
+     * 文本截断，超出宽度时显示省略号
+     */
+    private truncateText;
+}
+export default TaskNodeViewer;

package/dist/types/core/viewers/TextViewer.d.ts

@@ -0,0 +1,37 @@
+/**
+ * TextViewer - Basic text rendering viewer
+ * Handles text display with alignment, truncation, tags, and rich text
+ */
+import type { CellViewer, ViewerRenderContext, TextViewerData } from './types';
+/**
+ * TextViewer renders text content in cells
+ * This is the default viewer for most cell types
+ */
+declare class TextViewer implements CellViewer<TextViewerData> {
+    readonly type = "text";
+    /**
+     * Draw text content in the cell
+     */
+    draw(context: ViewerRenderContext, data: TextViewerData): void;
+    /**
+     * Get the display text from data
+     */
+    private getDisplayText;
+    /**
+     * Extract plain text from HTML/rich text content
+     */
+    private extractPlainText;
+    /**
+     * Draw text as a tag/badge with background color
+     */
+    private drawTag;
+    /**
+     * Draw a rounded rectangle
+     */
+    private drawRoundedRect;
+    /**
+     * Truncate text with ellipsis if it exceeds max width
+     */
+    private truncateText;
+}
+export default TextViewer;