components/pixel-number

Type Aliases

PixelNumberSize

PixelNumberSize = "sm" | "md" | "lg" | "xl"

Supported PixelNumber sizes: one font pixel is 2, 3, 4 or 6 CSS pixels.

---

PixelNumberTone

PixelNumberTone = "current" | "primary" | "accent" | "success" | "warning" | "error"

Semantic tones supplied by the current theme.

---

PixelNumberProps

PixelNumberProps = Omit<HTMLAttributes<HTMLSpanElement>>, "children"> > & object

Props accepted by PixelNumber. Pass a value, or readout text.

Type Declaration

value?

optional value?: number

A number to draw.

text?

optional text?: string

Readout text instead of a number: digits and : . + - / × % and spaces.

pad?

optional pad?: number

Left-pad the whole part of value with zeros to this many digits.

signed?

optional signed?: boolean

Prefix a positive value with +, for gains and floating numbers.

size?

optional size?: PixelNumberSize

tone?

optional tone?: PixelNumberTone

outline?

optional outline?: boolean

Ring every lit pixel with the ink line, like a sprite outline, so the number reads over any world: damage, pickups and floating gains.

Variables

PIXEL_NUMBER_CHARACTERS

const PIXEL_NUMBER_CHARACTERS: readonly string[]

Characters the pixel face can draw.

---

PixelNumber

const PixelNumber: ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLSpanElement>>, "children"> > & object & RefAttributes<HTMLSpanElement>>>>

Crisp pixel numerals drawn as SVG, so they stay sharp at every size and never depend on a font file. The readable text is kept for assistive tech.

Functions

formatPixelNumber()

formatPixelNumber(value, pad?, signed?): string

Format a number the way PixelNumber draws it.

Parameters

value

number

pad?

number = 0

signed?

boolean = false

Returns

string

---

checkPixelText()

checkPixelText(text): string

Reject characters the pixel face cannot draw, naming the ones it can.

Parameters

text

string

Returns

string