使用方法

Timer 把一段正在增加的时长写进 <time>。startTime 是毫秒级 unix 时间。不传就从这次挂载开始计。文字和 dateTime 直接写在元素上。组件不会为每一次跳动重新渲染，也不使用 aria-live。

默认 format="elapsed"。不到一分钟显示 Ns，不到一小时显示 Nm NNs，满一小时显示 Nh NNm，文字和 dateTime 都不再带秒（存成 PT{分钟数 × 60}S）。format="clock" 始终精确到秒：不到一小时是 m:ss，超过则是 h:mm:ss，dateTime 为 PT{秒数}S。

未满一小时时大约每秒更新一次，elapsed 满一小时后改为每分钟一次。如果 startTime 还在未来，第一次变化会等到开始后再过一秒。

排版和 Timestamp 同一套。type 默认 supporting，color 默认 secondary。type="inherit" 不用 Text 包一层，字体跟周围走。color="disabled" 用禁用文字色。size 和 weight 的覆盖方式和 Text 一样。

<script setup lang="ts">
import { Text } from '@astryx-vue/core/Text'
import { Timer } from '@astryx-vue/core/Timer'
</script>

<template>
  <Text type="body" color="primary">
    Processing for <Timer type="inherit" color="inherit" />
  </Text>
</template>

建议

建议	做法
推荐	状态词旁边用 elapsed。读者在盯着秒数时用 clock。
推荐	两个计时要一致时，传入同一个 startTime。
推荐	写进一句话里时用 type="inherit"，时长才跟那一行对齐。
避免	把每一次跳动都播报出去。时间元素就地更新，保持安静。
避免	满一小时后还指望 elapsed 精确到秒。这个格式到点就会改成按分钟显示。

解剖

部分	说明
已过时间	装着标准化已过时长的语义 time 元素。

示例

Timer — 格式

Elapsed 0s

Clock 0s

同一开始时间下，紧凑的已用单位和秒表式时钟记法。

Timer — 行内

Processing for 0s

把 Timer 写进状态句子里，并继承周围的排版。

Timer — 排版

Default 0s Emphasized 0s

默认排版与 Timestamp 对齐，另一行用强调样式覆盖。