AgentBinary

components/agent/Binary.vue

Animated binary block — the pawn's "working" decoration rebuilt from two glyph paths (0 and 1). Digits swap within rows and purple highlight runs re-roll on independent, tweakable clocks.

Scenarios
static (matches binarya.svg)
on a working pawn
6 × 14 grid
components/agent/Binary.vue

Usage

<AgentBinary :rows = "4" :cols = "7" :flipMs = "800" :flipCount = "1" :highlightMs = "1600" :highlightRuns = "3" :animate = "true" baseColor = "#4d5c5a" highlightColor = "#ab86f6" />

Props

PropTypeDefaultDescription
rowsNumber4Digit rows. The default 4×7 reproduces binarya.svg exactly.
colsNumber7Digits per row.
flipMsNumber800Interval between digit changes. Each tick swaps a 0 and a 1 within a row, so row widths stay constant.
flipCountNumber1Rows swapped per flip tick.
highlightMsNumber1600Interval between highlight re-rolls.
highlightRunsNumber3Purple runs (2–3 contiguous digits each) placed on every re-roll.
animateBooleantruefalse renders the static matrix; prefers-reduced-motion also disables animation.
baseColorString'#4d5c5a'Digit color.
highlightColorString'#ab86f6'Highlight-run color.

Related

Qpoint Brand Style Guide