Icon Components
@wq/react and @wq/material define a vocabulary of icons to use throughout the app, particularly as the icon prop for <Button/>, <IconButton/>, <Fab/>, and <ListItem/>. The icon prop is specified as a string which is mapped to a component (in web), or to the name of a font icon (in native).
Note that by default, @wq/material components that use the icon prop will only accept the names listed below. To add more material icons to the vocabulary, register them via a custom icons plugin.
| Icon | Component | icon Prop Value |
Description |
|---|---|---|---|
 |
Add |
"add" |
Used for “Add New Record” <Fab/> in <DefaultList/> |
 |
Edit |
"edit" |
Used for “Edit This Record” <Fab/> in <DefaultDetail/> |
 |
Delete |
"delete" |
Used for <DeleteForm/> in DefaultEdit |
 |
Success |
"success" |
Shown in <OutboxList/> for synced records |
 |
Error |
"error" |
Shown in <OutboxList/> for failed sync attempts |
 |
Pending |
"pending" |
Shown in <OutboxList/> for currently syncing records |
 |
GpsStart |
"gps-start" |
Used in Geo input component |
 |
GpsStop |
"gps-stop" |
Used in Geo input component |
 |
Search |
"search" |
Used in Geo input component |
The default icons are defined in @wq/material’s src/icons.js and src/icons.native.js.