From 13cf17cb7d8d21c6896fd1cf88752be6fe9df654 Mon Sep 17 00:00:00 2001 From: Daniel <50356015+danny007in@users.noreply.github.com> Date: Sun, 28 May 2023 13:39:45 +0530 Subject: [PATCH] sidebar href="#" bug fix --- src/html/components/dashboard/_sidenav.astro | 63 +++++++++++++------ .../docs/components/main-sidebar.mdx | 4 +- src/ts/treeview.ts | 19 +++--- 3 files changed, 57 insertions(+), 29 deletions(-) diff --git a/src/html/components/dashboard/_sidenav.astro b/src/html/components/dashboard/_sidenav.astro index 69dee016d..721aead66 100644 --- a/src/html/components/dashboard/_sidenav.astro +++ b/src/html/components/dashboard/_sidenav.astro @@ -36,7 +36,7 @@ const htmlPath = convertPathToHtml(path); >
  • @@ -77,7 +77,7 @@ const htmlPath = convertPathToHtml(path);
  • @@ -118,7 +118,7 @@ const htmlPath = convertPathToHtml(path);
  • @@ -197,7 +197,7 @@ const htmlPath = convertPathToHtml(path); class:list={["nav-item", mainPage === "ui-elements" && "menu-open"]} > @@ -220,7 +220,7 @@ const htmlPath = convertPathToHtml(path);
  • @@ -243,7 +243,7 @@ const htmlPath = convertPathToHtml(path);
  • @@ -267,7 +267,7 @@ const htmlPath = convertPathToHtml(path);
  • EXAMPLES
  • - +

    Login & Register @@ -320,7 +320,7 @@ const htmlPath = convertPathToHtml(path);

  • @@ -350,6 +350,29 @@ const htmlPath = convertPathToHtml(path);
    • +
  • + + +

    + Javascript + +

    +     + +
  • MULTI LEVEL EXAMPLE
  • - +

    Level 1
  • - +

    Level 1 @@ -377,13 +400,13 @@ const htmlPath = convertPathToHtml(path);

  • - +

    Level 1

     @@ -428,19 +451,19 @@ const htmlPath = convertPathToHtml(path);
  • LABELS
  • - +

    Important
  • - +

    Warning
  • - +

    Informational

     diff --git a/src/html/components/docs/components/main-sidebar.mdx b/src/html/components/docs/components/main-sidebar.mdx index d9b6cdb16..5f3b04098 100644 --- a/src/html/components/docs/components/main-sidebar.mdx +++ b/src/html/components/docs/components/main-sidebar.mdx @@ -39,7 +39,7 @@ The sidebar used in this page to the left provides an example of what your sideb
  • - +

    Treeview @@ -76,7 +76,7 @@ The sidebar used in this page to the left provides an example of what your sideb

  • - +

    Treeview Menu Open diff --git a/src/ts/treeview.ts b/src/ts/treeview.ts index 7f802f48d..372c3b4f3 100644 --- a/src/ts/treeview.ts +++ b/src/ts/treeview.ts @@ -46,12 +46,10 @@ type Config = { class Treeview { _element: HTMLElement _config: Config - _childNavItem: HTMLElement | undefined constructor(element: HTMLElement, config: Config) { this._element = element this._config = { ...Default, ...config } - this._childNavItem = this._element.querySelector(SELECTOR_TREEVIEW_MENU) as HTMLElement | undefined } open(): void { @@ -59,8 +57,9 @@ class Treeview { this._element.classList.add(CLASS_NAME_MENU_OPEN) - if (this._childNavItem) { - slideDown(this._childNavItem, this._config.animationSpeed) + const childElement = this._element?.querySelector(SELECTOR_TREEVIEW_MENU) as HTMLElement | undefined + if (childElement) { + slideDown(childElement, this._config.animationSpeed) } this._element.dispatchEvent(event) @@ -71,8 +70,9 @@ class Treeview { this._element.classList.remove(CLASS_NAME_MENU_OPEN) - if (this._childNavItem) { - slideUp(this._childNavItem, this._config.animationSpeed) + const childElement = this._element?.querySelector(SELECTOR_TREEVIEW_MENU) as HTMLElement | undefined + if (childElement) { + slideUp(childElement, this._config.animationSpeed) } this._element.dispatchEvent(event) @@ -98,7 +98,12 @@ domReady(() => { button.forEach(btn => { btn.addEventListener('click', event => { - const target = event.target as HTMLElement + const target = event.target as HTMLAnchorElement + + if (target.getAttribute('href') === '#') { + event.preventDefault() + } + const targetItem = target.closest(SELECTOR_NAV_ITEM) as HTMLElement | undefined if (targetItem) {