Illustrated Message

An illustrated message displays an illustrated image and a message. Usually its used for error or empty states.

Install	`yarn add @diallink-corp/convergo-react-illustratedmessage`
Version	4.1.2
Usage	import {IllustratedMessage} from '@diallink-corp/convergo-react-illustratedmessage'

Example

An illustrated message provides pre-defined styling via slots for an illustrated image, a heading, a message and a button.

<IllustratedMessage>
  <Icon name='ExclamationCircleIcon' variant='outline' />
  <Heading>No results</Heading>
  <Text>Try a different search</Text>
  <Button>Press Me</Button>
</IllustratedMessage>

<IllustratedMessage>
  <Icon name='ExclamationCircleIcon' variant='outline' />
  <Heading>No results</Heading>
  <Text>Try a different search</Text>
  <Button>Press Me</Button>
</IllustratedMessage>

<IllustratedMessage>
  <Icon
    name="ExclamationCircleIcon"
    variant="outline"
  />
  <Heading>
    No results
  </Heading>
  <Text>
    Try a different
    search
  </Text>
  <Button>
    Press Me
  </Button>
</IllustratedMessage>