Component

BinaryMarch

It turns a trivial decimal-to-binary conversion into a visible march of long divisions. Each step records a quotient and remainder, prepends the earned bit and keeps the accumulated binary result on display.

Possible use

It could let a reviewer manually convert a release number before admitting it to a machine-facing handoff, or let a presenter make one agenda count undergo a tiny arithmetic procession.

Reasonable alternative

A reasonable local alternative is `value.toString(2)` or a local conversion utility. A component that makes division a progress track is hard to defend as interface infrastructure.

01 / Preview

Try it yourself.

Preview Interactive
Binary march0 divisions
Starting decimal42—Current remainder: 42
  1. No division has marched yet.
Divide again to earn the next bit.
Mechanism
1
Start with one ordinary decimal number.
2
Divide by two; the quotient continues and the remainder becomes a real bit.
3
Repeat until the binary receipt is complete, then restart the march if needed.

02 / Usage

Put it somewhere.

example.tsxTSX
import { BinaryMarch } from "gra-ui";
import "gra-ui/styles.css";

export function CeremonialNumber() {
  return <BinaryMarch value={42} />;
}

03 / API

Small surface area.

PropTypeDescription
valuenumberThe non-negative integer that must earn its binary representation through repeated divisions.