components
Loader (code)
To convey to a user that a page or a specific part is loading, you can present them with a Loader.
import { Loader } from '@mediahuis/chameleon-react'
Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| accessibilityLabel | String | 'Loading' | - | Accessibility label. If the loader is never removed from the dom, use in combination of aria-hidden! You should wrap the loading content within a section scoped by aria-busy |
| className | String | - | - | Extend classNames. |
| size | 'small''medium''large''xLarge''xxLarge' | 'medium' | - | Changes the loader's `height`, and `width`. |
System Props
alignSelf, flex, flexBasis, flexGrow, flexShrink, order
m, mb, ml, mr, mt, mx, my
position, bottom, left, right, top, zIndex
float
System Props
Next to the properties listed in the propstable, a collection of system props can be added to any component for further general styling and layouting purposes. These props vary per component.
To read more about the system, click here to check out its dedicated page.
Size
default: medium
Different cases call for different sizes. There are 5 available sizes for a Loader.
import { Loader } from '@mediahuis/chameleon-react'