项目正在快速迭代中,API 与视觉细节可能随版本调整,请勿用于生产环境。

EtDocumentTabs · 多文档标签条 ​

多文档标签:脏标记双通道、关闭确认、溢出列表,契约与 EtTabStrip 同源。

激活:a(脏标记 aria 双通道;「备注」不可关)

API ​

import { EtDocumentTabs } from '@wil-works/evoke-tools-ui'公共工具壳功能块

Props

名称类型默认说明
modelValueString''激活文档的 id
documentsArray() => []文档表:{ id, title, dirty?, closable? }(closable 缺省视为可关闭)
overflowLabelString'更多'窄屏溢出入口文案
confirmCloseBooleanfalse关闭前弹确认(仅在同时给了 confirmText 时生效)
confirmTextString''关闭确认文案(EbPopconfirm 的 title)

Emits

事件载荷说明
update:modelValuedoc.idv-model(modelValue)的写入
changedoc.id激活文档切换;载荷 = 文档 id
closedoc.id文档被关闭(关闭钮 / 键盘 Delete);载荷 = 被关闭文档的 id——脏标记下的确认归产品
contextdoc.id, event文档被右键;载荷 = (文档 id, 原生 MouseEvent),菜单内容由产品给

键盘 · 可访问名 · 密度

键盘自定义按键(见下)
可访问名aria-hiddenaria-labelaria-selectedrole=tablistrole=tabrole=img
密度--et-chrome-tabstrip-height--et-chrome-tabstrip-underline-height--et-density-base-font--et-density-caption-font--et-density-line-height--et-toolbtn-fg

行为 ​

  • 脏标记双通道:CSS 圆点(不吃行高)+ role="img" aria-label="未保存";读屏名补「未保存」。
  • 关闭默认不弹确认(关闭是产品语义,组件不预判);confirmClose + confirmText 双条件才用 EbPopconfirm 包一层。
  • 溢出:复用 tab-strip 的 planOverflow 纯函数;全部条目常驻 DOM(溢出的只收起、不卸载)。
  • 键盘:左右 / Home / End 漫游;关闭钮 tabindex="-1",Delete 关闭由条级 keydown 处理。
  • 点条目内的关闭钮 / 脏圆点不触发选中。
  • 度量令牌与 EtTabStrip 逐项共用(同槽位视觉一致)。

令牌与门禁 ​

  • --et-icon-xs(关闭钮 14 档)。
  • G4:关闭钮与脏标记都有可访问名。
  • 内存:ResizeObserver 卸载时 disconnect。