The main nav used in various admin apps, using react router.

Parameters:
NameTypeDescription
propsobject

Component props.

Properties
NameTypeDescription
childrenJSX.Element

React element children.

customAttributesobject

Custom attributes for the component.

customClassesstring | Array | object

Custom classes for the component.

handleNavigationBlockedfunction

Callback function to handle navigation blocked.

itemsArray

The nav items.

navigationBlockedboolean

Whether navigation is blocked.

typestring

The type of the nav bar, one of icon-button or icon-text-tag.

refobject | null

Ref to the component.

Since
  • 3.3.2
Source
Returns:

The RouterNavBar component.

Type: 
JSX.Element
Example
import RouterNavBar from '@gravityforms/components/react/admin/modules/RouterNavBar';

const items = [
  {
    item: { active: true, key: 'send-a-test' },
    link: { to: '/send-a-test' },
    icon: { icon: 'beaker', iconPrefix: 'gravitysmtp-admin-icon' },
    text: { content: 'Send a test' },
  },
  {
    item: { active: true, key: 'scheduled-events' },
    link: { to: '/scheduled-events' },
    icon: { icon: 'clock', iconPrefix: 'gravitysmtp-admin-icon' },
    text: { content: 'Scheduled events' },
  },
];

return <RouterNavBar items={ items } />;