Components › Records & data › Voice message › Video note

Video note

canon

A round 200 px video without a bubble, with a 3 px accent progress ring, duration and a Přepis link.

acrm !4918 (DS) + !4935 (Komunikace) + !4956 (44 px tap target), prototype proto/chat-hlasove-zpravy@6ed969dc9 (owner approved 8 Oct 2026). Family split from discussion/voice-message on 11 Oct 2026 (owner R43 a). Not on dev with data (stories only). Canon 14 Oct 2026: dev check after !4957 + !4982 — 390 px 64 bars × 3.7 px, gap 0; time without tabular-nums (StableTime). Signed off by AD. Own stories + light/dark baseline: acrm !5079 (Default · In-out · States; fixed wrapping of „Přepis se nepodařil · Zkusit znovu“ under the 200 px circle).

Used in no file in the app (main)

@acrm/ui <VideoNote>.vmx .vm-bare .vn .vn-circle +12SourceStory
ExamplesCodeUsageAccessibilityChangelog

Keyboard

  • Tab order: the circle (one button) · Přepis link · copy · each transcript sentence.
  • The circle is a native <button>: Enter / Space toggle playback.
  • Sentences: Enter / Space seek to the sentence and play.
  • There is no seek control for the video itself; seeking is possible only through transcript sentences or the ref handle.

ARIA

  • The circle's accessible name switches "Přehrát video" ⇄ "Pozastavit"; the ring SVG and the play icon are aria-hidden.
  • Visually hidden fromLabel precedes the player.
  • Přepis link, status, sentences and copy behave as in Voice message (aria-expanded / aria-controls, role="status", aria-current).

Focus

  • Foundation :focus-visible ring on the circle, link, copy and sentences.

Contrast

  • Progress ring --accent (#0072f5) on the page background is ≥ 3 : 1 in both themes; over the video it depends on the picture.
  • Duration --fg-muted and the Přepis link --accent sit on the thread background, not a bubble — same limits as Voice message (RULES §18).

Known limits

  • No keyboard seek and no slider semantics for the video position; progress is visual only (ring).
  • The video has no captions track — the transcript is the text alternative and is collapsed by default.
  • Not verified on dev with real data (stories only, 10 Oct 2026).

Source: docs/voice-message/video-note.a11y.md · GitLab