@ui5/webcomponents-react/wrappers/webComponents/ShellBar/index.js

React Wrapper for UI5 Web Components and additional components

'use client';

import { withWebComponent } from '@ui5/webcomponents-react-base';
/**
 * The `ShellBar` is meant to serve as an application header
 * and includes numerous built-in features, such as: logo, profile image/icon, title, search field, notifications and so on.
 *
 * ### Stable DOM Refs
 *
 * You can use the following stable DOM refs for the `ShellBar`:
 *
 * - logo
 * - notifications
 * - overflow
 * - profile
 * - product-switch
 *
 * ### 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! [ShellBar UI5 Web Component Documentation](https://ui5.github.io/webcomponents/components/fiori/ShellBar) | [Repository](https://github.com/UI5/webcomponents)
 */
const ShellBar = withWebComponent('ui5-shellbar', ['accessibilityAttributes', 'notificationsCount', 'primaryTitle', 'secondaryTitle'], ['disableSearchCollapse', 'hideSearchButton', 'showNotifications', 'showProductSwitch', 'showSearchField'], ['assistant', 'branding', 'content', 'logo', 'menuItems', 'profile', 'searchField', 'startButton'], ['content-item-visibility-change', 'logo-click', 'menu-item-click', 'notifications-click', 'product-switch-click', 'profile-click', 'search-button-click', 'search-field-clear', 'search-field-toggle']);
ShellBar.displayName = 'ShellBar';
export { ShellBar };