1 | # @littlespoon/alert
|
2 |
|
3 | [![NPM version](https://img.shields.io/npm/v/@littlespoon/alert.svg)](https://www.npmjs.com/package/@littlespoon/alert)
|
4 |
|
5 | ## Install
|
6 |
|
7 | [Yarn](https://yarnpkg.com/package/@littlespoon/alert):
|
8 |
|
9 | ```sh
|
10 | yarn add alert
|
11 | ```
|
12 |
|
13 | [npm](https://www.npmjs.com/package/@littlespoon/alert):
|
14 |
|
15 | ```sh
|
16 | npm install alert --save
|
17 | ```
|
18 |
|
19 | [UNPKG](https://unpkg.com/browse/@littlespoon/alert/)
|
20 |
|
21 | ## Usage
|
22 |
|
23 | ```ts
|
24 | import Alert from '@littlespoon/alert'
|
25 | ```
|
26 |
|
27 | Render Alert:
|
28 |
|
29 | ```tsx
|
30 | <Alert />
|
31 | ```
|
32 |
|
33 | Render alert with props:
|
34 |
|
35 | ```tsx
|
36 | <Alert title="Alert Title" description="Alert description" onClose={onClose} variant="success" />
|
37 | ```
|
38 |
|
39 | Render alert with relative position:
|
40 |
|
41 | ```tsx
|
42 | <Alert
|
43 | type="relative"
|
44 | title="Alert Title"
|
45 | description="Alert description"
|
46 | onClose={onClose}
|
47 | variant="success"
|
48 | />
|
49 | ```
|