@selfcommunity/react-ui/lib/cjs/components/NavigationToolbar/NavigationToolbar.d.ts

React UI Components to integrate a Community created with SelfCommunity Platform.

import { ToolbarProps } from '@mui/material';
import React from 'react';
import { NotificationsMenuProps } from './NotificationMenu';
import { SearchAutocompleteProps } from '../SearchAutocomplete';
import { NavigationSettingsIconButtonProps } from '../NavigationSettingsIconButton';
import { ComposerIconButtonProps } from '../ComposerIconButton';
import { NavigationMenuIconButtonProps } from '../NavigationMenuIconButton';
export interface NavigationToolbarProps extends ToolbarProps {
    /**
     * Disable search action if possible
     */
    disableSearch?: boolean;
    /**
     * Disable composer action if possible
     */
    disableComposer?: boolean;
    /**
     * Searchbar props
     */
    SearchAutocompleteComponentProps?: SearchAutocompleteProps;
    /**
     * The navigation path
     */
    value: string;
    /**
     * Actions to be inserted before composer IconButton
     */
    startActions?: React.ReactNode | null;
    /**
     * Actions to be inserted after Private Messages IconButton
     */
    endActions?: React.ReactNode | null;
    /**
     * Component for Navigation Menu Icon Button
     */
    NavigationMenuIconButtonComponent?: (inProps: NavigationMenuIconButtonProps) => JSX.Element;
    /**
     * Props to spread to the NavigationMenuIconButtonComponent
     * @default {}
     */
    NavigationMenuIconButtonComponentProps?: NavigationMenuIconButtonProps;
    /**
     * Component for Navigation Settings
     */
    NavigationSettingsIconButtonComponent?: (inProps: NavigationSettingsIconButtonProps) => JSX.Element;
    /**
     * Callback on open notification menu
     */
    onOpenNotificationMenu?: () => void;
    /**
     * Callback on close notification menu
     */
    onCloseNotificationMenu?: () => void;
    /**
     * Props to spread to the NotificationsMenu
     * @default {}
     */
    NotificationMenuProps?: Omit<NotificationsMenuProps, 'anchorEl' | 'open' | 'onClose' | 'onClick' | 'transformOrigin' | 'anchorOrigin'>;
    /**
     * Props to spread to the ComposerIconButton
     * @default {}
     */
    ComposerIconButtonProps?: ComposerIconButtonProps;
}
/**
 * > API documentation for the Community-JS NavigationToolbar component. Learn about the available props and the CSS API.
 *
 *
 * This component renders the application header.
 * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/NavigationToolbar)

 #### Import

 ```jsx
 import {NavigationToolbar} from '@selfcommunity/react-ui';
 ```

 #### Component Name

 The name `SCNavigationToolbar` can be used when providing style overrides in the theme.


 #### CSS

 |Rule Name|Global class|Description|
 |---|---|---|
 |root|.SCNavigationToolbar-root|Styles applied to the root element.|
 |logo|.SCNavigationToolbar-logo|Styles applied to the logo element.|
 |register|.SCNavigationToolbar-register|Styles applied to the register button elements.|
 |navigation|.SCNavigationToolbar-navigation|Styles applied to the navigation container element|
 |home|.SCNavigationToolbar-home|Styles applied to the home button|
 |explore|.SCNavigationToolbar-explore|Styles applied to the explore button|
 |groups|.SCNavigationToolbar-groups|Styles applied to the group button|
 |events|.SCNavigationToolbar-events|Styles applied to the event button|
 |search|.SCNavigationToolbar-search|Styles applied to the search component|
 |composer|.SCNavigationToolbar-composer|Styles applied to the composer component|
 |profile|.SCNavigationToolbar-profile|Styles applied to the profile button|
 |notification|.SCNavigationToolbar-notification|Styles applied to the notification button|
 |notificationsMenu|.SCNavigationToolbar-notifications-menu|Styles applied to the notifications menu|
 |messages|.SCNavigationToolbar-messages|Styles applied to the messages button|
 |settings|.SCNavigationToolbar-settings|Styles applied to the settings button|
 |active|.SCNavigationToolbar-active|Styles applied to the active button on navigation|

 *
 * @param inProps
 */
export default function NavigationToolbar(inProps: NavigationToolbarProps): JSX.Element;