Notice
Notice
jsx
import Notice from '@semcore/ui/notice';
<Notice />;
NoticeProps
& & {...}Name | Type | Description |
---|---|---|
hidden | boolean | Property for managing visibility of Notice |
use | Deprecated Notice type | |
theme | Notice theme | |
duration | number | Duration of animation, ms |
locale | string |
Notice.Label
The component is inherited from Box
and is used to insert a label in the left part of the notice (usually, an icon).
jsx
import Notice from '@semcore/ui/notice';
<Notice.label />;
Notice.Actions
The component is inherited from Box
and is used to insert control components in the lower part of the notice. Usually, it's a button or a group of buttons.
jsx
import Notice from '@semcore/ui/notice';
<Notice.Actions />;
Notice.Content
The component is inherited from Box
and is used to insert content in the notice.
jsx
import Notice from '@semcore/ui/notice';
<Notice.Content />;
Notice.Close
The component is inherited from Button
and is used to insert the Close button.
jsx
import Notice from '@semcore/ui/notice';
<Notice.Close />;
Notice.Text
The text content of the notice. Inherited from Text
.
jsx
import Notice from '@semcore/ui/notice';
<Notice.Text />;
Notice.Title
The title of the notice. Inherited from Text
.
jsx
import Notice from '@semcore/ui/notice';
<Notice.Title />;
NoticeSmart
A more convenient component version with posibility to define features through props. For more details, refer to the example.
jsx
import { NoticeSmart } from '@semcore/ui/notice';
<NoticeSmart />;
NoticeSmartProps
& {...}Name | Type | Description |
---|---|---|
label | React.ReactNode | A custom element for additional information |
title | React.ReactNode | A custom element for title |
actions | React.ReactNode | Custom action element |
closable | boolean | Adds a Close button |
onClose | (event: React.SyntheticEvent) => void | Callback on a click on the close button |