1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-08-07 22:45:23 +02:00

the expand feature added during navigation

This commit is contained in:
Umang G. Patel 2022-09-20 00:46:32 +05:30
parent 1af4e05027
commit de7b34603a
2 changed files with 13 additions and 2 deletions

View file

@ -17,6 +17,7 @@ export default class SidebarFilter {
sectionHidden: 'docs-sidebar__section--hidden',
sectionTitle: 'docs-sidebar__section-title',
sectionTitleSelected: 'docs-sidebar__section-title--selected',
sectionTitleActive: 'docs-sidebar__section-title--active',
sectionList: 'docs-sidebar__section-list',
sectionListItem: 'docs-sidebar__section-list-item',
sectionListItemWrapperHidden: 'docs-sidebar__section-list-item-wrapper--hidden',
@ -47,12 +48,14 @@ export default class SidebarFilter {
* @param {HTMLElement[]} sections - Array of sections.
* @param {HTMLElement} sidebarContent - Sidebar content.
* @param {HTMLElement} search - Search input.
* @param {Function} setSectionCollapsed - Function to set section collapsed.
*/
init(sections, sidebarContent, search) {
init(sections, sidebarContent, search, setSectionCollapsed) {
// Store refs to HTML elements.
this.sections = sections;
this.sidebarContent = sidebarContent;
this.search = search;
this.setSectionCollapsed = setSectionCollapsed;
let className = SidebarFilter.CSS.sidebarSearchWrapperOther;
// Search initialize with platform specific shortcut.
@ -190,6 +193,13 @@ export default class SidebarFilter {
element.classList.add(SidebarFilter.CSS.sectionTitleSelected);
} else if (type === 'item') {
element.classList.add(SidebarFilter.CSS.sectionListItemSlelected);
// close section.
const parentSection = element.closest('section');
// if item is in collapsed section, expand it.
if (!parentSection.classList.contains(SidebarFilter.CSS.sectionTitleActive)) {
this.setSectionCollapsed(parentSection, false);
}
}
// scroll to focused title or item.

View file

@ -90,7 +90,8 @@ export default class Sidebar {
this.nodes.slider.addEventListener('click', () => this.handleSliderClick());
this.nodes.search = moduleEl.querySelector('.' + Sidebar.CSS.sidebarSearch);
this.filter.init(this.nodes.sections, this.nodes.sidebarContent, this.nodes.search);
this.filter.init(this.nodes.sections, this.nodes.sidebarContent,
this.nodes.search, this.setSectionCollapsed);
this.ready();
}