FormatDigital
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
The sample shows basic numeric value formatting without advanced options to make the default behavior of the component clear.
Display options
The preview compares different display modes for the same value, so you can quickly see the difference between the different formats.
Byte formatting
The demonstration focuses on converting values to byte units, which is useful when displaying file or storage sizes.
Formatting bits
The demonstration focuses on the conversion of values into bit units, for example for network speeds or transmission limits.
Use with slots
The demonstration shows how to add custom content before or after the formatted value via slots without interfering with the calculation itself.
When to use
Use wje-format-digital when you want to solve a given UI problem consistently within the WebJET design system.
When not to use
Do not use a component outside of its responsibility; in an atypical case, prefer to assemble multiple smaller components.
Accessibility
Check keyboard controls, focus states, contrast and clear naming of interactive elements.
Recommended practices
- Prefer API component over manual DOM interventions.
- Stick to design tokens and consistent naming conventions.
- Before deployment, test the component in real data scenarios.
Attributes and properties
unit
| Popis | Nastavuje textovú hodnotu uloženú vo voľbe unit. |
| Atribút | unit |
| Typ | string |
| Predvolené | byte |
unitDisplay
| Popis | Nastavuje textovú hodnotu uloženú vo voľbe unit-display. |
| Atribút | unit-display |
| Typ | string |
| Predvolené | short |
unitDisplay
| Popis | Nastavuje textovú hodnotu uloženú vo voľbe unitDisplay. |
| Atribút | unitDisplay |
| Typ | string |
| Predvolené | short |
value
| Popis | Nastavuje aktuálnu hodnotu komponentu. |
| Atribút | value |
| Typ | number |
| Predvolené | - |
Events
Pre tento komponent nie sú dostupné žiadne udalosti.
Methods
Pre tento komponent nie sú dostupné žiadne verejné metódy.
CSS shadow parts
| Názov | Popis |
|---|---|
native | Štýluje koreňovú shadow časť komponentu. |
formatted | Štýluje shadow časť formatted. |
start | Štýluje shadow časť start. |
end | Štýluje shadow časť end. |
CSS custom variables
Pre tento komponent nie sú dostupné žiadne vlastné CSS vlastnosti.
Slots
Pre tento komponent nie sú dostupné žiadne sloty.