Icontuner
Icontuner can tune the size and intent of any icon from @asphalt-react/iconpack. Use Icontuner to modify icons that are part of content, for example, to show an icon with "warning" intent when a feature is deprecated, or use a "brand" intent when the icon appears in a hero section.
Supported intents:
warningdangerinfosuccessmutedbranddisabledprimarysecondaryinvalidinverse
Usage
import { Icontuner } from "@asphalt-react/icontuner
import { Trash } from "@asphalt-react/iconpack
<IconTuner>
<Trash/>
</IconTuner>
Props
children
Icon from @asphalt-react/iconpack.
| type | required | default |
|---|---|---|
| node | true | N/A |
size
Size of the icon. accepts xxs, xs, s, m, l, xl, xxl.
| type | required | default |
|---|---|---|
| enum | false | "m" |
danger
Applies danger intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
warning
Applies warning intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
info
Applies info intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
success
Applies success intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
muted
Applies muted intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
brand
Applies brand intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
disabled
Applies disabled intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
primary
Applies primary intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
secondary
Applies secondary intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
invalid
Applies invalid intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
inverse
Applies inverse intent color to icon.
| type | required | default |
|---|---|---|
| bool | false | false |
resize
Resizes icon.
| type | required | default |
|---|---|---|
| bool | false | true |