Bytes
<quiet-bytes>
Formats an arbitrary number of bytes or bits into a human-readable size.
<quiet-bytes value="240000000"></quiet-bytes>
Examples Jump to heading
Formatting bytes Jump to heading
Set the value attribute to indicate the number of bytes to format.
<quiet-bytes value="68000"></quiet-bytes>
Formatting bits Jump to heading
Set the unit attribute to bit to output bits instead of bytes.
<quiet-bytes value="42000000000" unit="bit"></quiet-bytes>
Localizing output Jump to heading
Use the lang attribute to format the output in a different locale.
<quiet-bytes value="12300000" lang="en"></quiet-bytes><br> <quiet-bytes value="12300000" lang="es"></quiet-bytes><br> <quiet-bytes value="12300000" lang="de"></quiet-bytes><br> <quiet-bytes value="12300000" lang="ru"></quiet-bytes>
API Jump to heading
Importing Jump to heading
The autoloader is the recommended way to import components but, if you prefer to do it manually, the following code snippets will be helpful.
To manually import <quiet-bytes> from the CDN, use the following code.
import 'https://cdn.jsdelivr.net/npm/@quietui/quiet@1.0.0/dist/components/bytes/bytes.js';
To manually import <quiet-bytes> from npm, use the following code.
import '@quietui/quiet/dist/components/bytes/bytes.js';
Properties Jump to heading
Bytes has the following properties that can be set with corresponding attributes. In many cases, the attribute's name is the same as the property's name. If an attribute is different, it will be displayed after the property. Learn more about attributes and properties
| Property / Attribute | Description | Reflects | Type | Default |
|---|---|---|---|---|
value
|
The number of bytes to format. |
|
number
|
0
|
unit
|
The unit to display. |
|
'byte'
|
'byte'
|
display
|
How to display the bytes, e.g. "100 bytes", "100 b", or "100b". |
|
'long'
|
'narrow'
|