Skip to main content

FormatDigital

shadow

The FormatDigital component is designed to format numeric values into a human-readable digital format with respect to various unit prefixes such as kilo, mega, giga, etc. It offers options to customize units, display style of units and supports localization.

Basic usage

Display options

Byte formatting

Formatting bits

Use with slots

When to use

Use wje-format-digital when you need a consistent WebJET-based implementation for this UI concern.

When not to use

Do not stretch the component beyond its responsibility; compose smaller primitives for edge cases.

Accessibility

Validate keyboard behavior, focus states, contrast, and meaningful labels for interactive elements.

Best Practices

  • Prefer component APIs over direct DOM manipulation.
  • Stick to design tokens and naming conventions.
  • Test components with realistic data before production rollout.

Attributes and Properties

value

DescriptionThe numeric value to format (e.g., 1024 for 1 KB).
Attributevalue
Typenumber
Default-

unitDisplay

DescriptionReturns the unit display style for the digital format. Defaults to short if not set.
Attributeunit-display
Typestring
Default-

unit

DescriptionThe unit of the value (byte or bit). Defaults to byte.
Attributeunit
Typestring
Default-

unitDisplay

DescriptionThe display style of the unit (short, long, or narrow). Defaults to short.
AttributeunitDisplay
Typestring
Default-

Events

No events available for this component.

Methods

No public methods available for this component.

CSS Shadow Parts

NameDescription
nativeThe native part of the component.
formattedThe part representing the formatted value.
startSlot for content before the formatted value.
endSlot for content after the formatted value.

CSS Custom Properties

No CSS custom properties available for this component.

Slots

No slots available for this component.