@syncfusion/ej2-navigations
Advanced tools
@syncfusion/ej2-navigations is a comprehensive package that provides a variety of navigation components for building modern web applications. It includes components like menus, toolbars, tabs, accordions, and more, which are essential for creating intuitive and user-friendly interfaces.
Accordion
The Accordion component allows you to create collapsible sections of content. Each section can be expanded or collapsed, making it useful for organizing large amounts of information in a compact space.
const { Accordion } = require('@syncfusion/ej2-navigations');
let accordion = new Accordion({
items: [
{ header: 'Section 1', content: 'Content 1' },
{ header: 'Section 2', content: 'Content 2' },
{ header: 'Section 3', content: 'Content 3' }
]
});
accordion.appendTo('#accordion');Tabs
The Tabs component allows you to create tabbed interfaces, where each tab can contain different content. This is useful for organizing content into different sections that can be easily navigated by the user.
const { Tab } = require('@syncfusion/ej2-navigations');
let tab = new Tab({
items: [
{ header: { text: 'Tab 1' }, content: 'Content 1' },
{ header: { text: 'Tab 2' }, content: 'Content 2' },
{ header: { text: 'Tab 3' }, content: 'Content 3' }
]
});
tab.appendTo('#tab');Toolbar
The Toolbar component allows you to create a set of command buttons that can be used to perform various actions. This is useful for providing quick access to frequently used functions in your application.
const { Toolbar } = require('@syncfusion/ej2-navigations');
let toolbar = new Toolbar({
items: [
{ prefixIcon: 'e-cut-icon', tooltipText: 'Cut' },
{ prefixIcon: 'e-copy-icon', tooltipText: 'Copy' },
{ prefixIcon: 'e-paste-icon', tooltipText: 'Paste' }
]
});
toolbar.appendTo('#toolbar');Menu
The Menu component allows you to create hierarchical menus with multiple levels of items. This is useful for organizing navigation links or commands in a structured manner.
const { Menu } = require('@syncfusion/ej2-navigations');
let menu = new Menu({
items: [
{ text: 'File', items: [{ text: 'Open' }, { text: 'Save' }] },
{ text: 'Edit', items: [{ text: 'Cut' }, { text: 'Copy' }, { text: 'Paste' }] }
]
});
menu.appendTo('#menu');PrimeNG is a collection of rich UI components for Angular. It offers a wide range of navigation components such as menus, tabs, and toolbars, similar to @syncfusion/ej2-navigations. PrimeNG is known for its extensive set of features and ease of use.
Material-UI is a popular React UI framework that implements Google's Material Design. It includes a variety of navigation components like tabs, menus, and toolbars. Material-UI is widely used for its comprehensive documentation and community support.
Ant Design is a React UI library that provides a set of high-quality components, including navigation components like menus, tabs, and toolbars. It is known for its elegant design and extensive customization options.
This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA. To acquire a license, you can purchase one at https://www.syncfusion.com/sales/products or start a free 30-day trial here.
A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
To install Navigations and its dependent packages, use the following command.
npm install @syncfusion/ej2-navigations
Following list of components are available in the package
Accordion - Vertically collapsible content panel that displays one or more panels at a time within the available space.
ContextMenu - Graphical user interface that appears on the user right click/touch hold action. It has the support to provide nested level menu items.
Sidebar - Expandable and collapsible component that typically acts as a side container to place primary or secondary content alongside the main content.
Tab - Content panel to show multiple contents in a specific space, one at a time.
Toolbar - Displays a group of command buttons arranged horizontally.
TreeView - Represent hierarchical data in a tree like structure with advanced functions to edit, drag and drop, select with CheckBox and more.
Navigation component is also offered in following list of frameworks,
Sidebar component is used in the following samples.
Product support is available for through following mediums.
syncfusion and ej2.Check the license detail here.
Check the changelog here
© Copyright 2018 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.
FAQs
A package of Essential JS 2 navigation components such as Tree-view, Tab, Toolbar, Context-menu, and Accordion which is used to navigate from one page to another
The npm package @syncfusion/ej2-navigations receives a total of 59,316 weekly downloads. As such, @syncfusion/ej2-navigations popularity was classified as popular.
We found that @syncfusion/ej2-navigations demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.
Security News
RubyGems.org has added a new "maintainer" role that allows for publishing new versions of gems. This new permission type is aimed at improving security for gem owners and the service overall.