@ui5/webcomponents-react
Version:
React Wrapper for UI5 Web Components and additional components
29 lines (28 loc) • 1.49 kB
JavaScript
'use client';
import { withWebComponent } from '../../internal/withWebComponent.js';
/**
* The ui5-message-strip component allows for the embedding of application-related messages.
* It supports four semantic designs, each with its own color and icon: "Information", "Positive", "Critical", and "Negative".
* Additionally, users can choose from two color sets ("ColorSet1" and "ColorSet2"), each containing 10 predefined color schemes.
* Each message shows a "Close" button, so that it can be removed from the UI, if needed.
*
* ### Usage
*
* For the `MessageStrip` component, you can define whether it displays
* an icon in the beginning and a close button. Moreover, its size and background
* can be controlled with CSS.
*
* ### Keyboard Handling
*
* #### Fast Navigation
* This component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].
* In order to use this functionality, you need to import the following module:
* `import "@ui5/webcomponents-base/dist/features/F6Navigation.js"`
*
*
*
* __Note__: This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)
*/
const MessageStrip = withWebComponent('ui5-message-strip', ['colorScheme', 'design'], ['hideCloseButton', 'hideIcon'], ['icon'], ['close']);
MessageStrip.displayName = 'MessageStrip';
export { MessageStrip };