SuperAPI AI 工具集

dense-ui

设计与创作

查看项目

更新于 10-15 19:52

技能介绍

用途:dense-ui 用于设计表格与仪表盘,核心目标是让人能快速比较数值,而非逐行阅读。它规定列内一致性优先于行美观,默认采用指针允许的最紧凑密度,数量右对齐并使用等宽数字,优先删列而非删行。

主要能力:提供密度模式(舒适、默认、紧凑,最多三种,仅改行内边距与字号)、列对齐与数字格式规则、表头与单元格对齐、单位放表头、粘性表头与最多冻结一列、悬停与选中使用不同视觉通道、批量操作明确范围与计数、仪表盘磁贴展示数值+变化量+周期等规范,并附列契约模板与检查清单。

使用方式:先检查项目已有的表格层(如 TanStack Table、AG Grid 或现有 DataTable)与虚拟化器,通过其暴露的接口表达密度、对齐与粘性行为;行高由行高=行高+2×间距刻度推导,不写死像素。写表前先输出列契约(列、类型、对齐、格式、宽度、空值)并确认,再声明密度模式、冻结列、选择模型与批量操作。

适用场景:数据表格、管理后台、分析仪表盘等需要高密度比较的界面。

限制:空、加载、错误状态由 ui-states 负责,查询输入与筛选属于 search-filter,图表坐标轴与标记属于图表技能;粘性应加在 th 而非 thead/tr;粗指针下取消紧凑模式;行不应整体作为链接;性能阈值由 perf 负责。具体实现细节与项目集成方式暂未提供。