[Summary view] [Print] [Text view]

   1  {"version":3,"sources":["../src/constant.ts","../src/index.ts"],"names":["Default","parentTrigger","subMenu","toggle","triggerElement","ClassName","ACTIVE","COLLAPSE","COLLAPSED","COLLAPSING","METIS","SHOW","MetisMenu","constructor","element","options","this","isElement","document","querySelector","config","Object","assign","disposed","triggerArr","init","attach","el","opt","classList","add","slice","call","querySelectorAll","forEach","ul","li","closest","contains","show","hide","a","getAttribute","setAttribute","addEventListener","clickEvent","bind","push","evt","target","currentTarget","tagName","preventDefault","update","dispose","arr","removeEventListener","on","evtType","handler","off","emit","evtData","shouldBubble","CustomEvent","bubbles","detail","dispatchEvent","isTransitioning","complete","remove","style","height","setTransitioning","shownElement","eleParentSiblins","_a","parentNode","children","filter","c","length","sibli","sibUl","scrollHeight","showElement","hideElement","hiddenElement","getBoundingClientRect","offsetHeight","Boolean"],"mappings":"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","sourcesContent":["import { IMMOptions } from './interface';\n\nexport type MetisMenuEvents =\n  | 'show.metisMenu'\n  | 'shown.metisMenu'\n  | 'hide.metisMenu'\n  | 'hidden.metisMenu';\n\nexport const Default: IMMOptions = {\n  parentTrigger: 'li',\n  subMenu: 'ul',\n  toggle: true,\n  triggerElement: 'a',\n};\n\nexport const ClassName = {\n  ACTIVE: 'mm-active',\n  COLLAPSE: 'mm-collapse',\n  COLLAPSED: 'mm-collapsed',\n  COLLAPSING: 'mm-collapsing',\n  METIS: 'metismenu',\n  SHOW: 'mm-show',\n};\n","/* eslint-disable max-len */\nimport { ClassName, Default, MetisMenuEvents } from './constant';\nimport { IMMOptions } from './interface';\nimport { EventType, SpecificEventListener, CustomEventListener } from './types';\n\nclass MetisMenu {\n  protected config: IMMOptions;\n\n  protected element: Element;\n\n  protected isTransitioning!: boolean;\n\n  protected disposed: boolean;\n\n  protected triggerArr: Array<Element>;\n\n  /**\n   * Creates an instance of MetisMenu.\n   *\n   * @constructor\n   * @param {Element | string} element\n   * @param {IMMOptions} [options]\n   * @memberof MetisMenu\n   */\n\n  constructor(element: Element | string, options?: IMMOptions) {\n    this.element = MetisMenu.isElement(element) ? element : document.querySelector<HTMLElement>(element)!;\n    this.config = { ...Default, ...options };\n    this.disposed = false;\n    this.triggerArr = [];\n    this.init();\n  }\n\n  static attach(el: Element, opt?: IMMOptions) {\n    return new MetisMenu(el, opt);\n  }\n\n  private init(): void {\n    const { METIS, ACTIVE, COLLAPSE } = ClassName;\n    this.element.classList.add(METIS);\n\n    [].slice.call(this.element.querySelectorAll<HTMLElement>(this.config.subMenu!)).forEach((ul: Element) => {\n      ul.classList.add(COLLAPSE!);\n      const li = ul.closest(this.config.parentTrigger!);\n\n      if (li?.classList.contains(ACTIVE!)) {\n        this.show(ul as HTMLElement);\n      } else {\n        this.hide(ul);\n      }\n\n      const a = li?.querySelector<HTMLElement>(this.config.triggerElement!);\n      if (a?.getAttribute('aria-disabled') === 'true') {\n        return;\n      }\n\n      a?.setAttribute('aria-expanded', 'false');\n\n      a?.addEventListener('click', this.clickEvent.bind(this));\n      this.triggerArr.push(a!);\n    });\n  }\n\n  private clickEvent(evt?: Event) {\n    if (!this.disposed) {\n      const target = evt?.currentTarget as Element | null;\n      if (target && target.tagName === 'A') {\n        evt!.preventDefault();\n      }\n\n      const li = target!.closest(this.config.parentTrigger!);\n      const ul = li?.querySelector(this.config.subMenu!);\n      this.toggle(ul!);\n    }\n  }\n\n  update() {\n    this.disposed = false;\n    this.init();\n  }\n\n  dispose() {\n    this.triggerArr.forEach((arr) => {\n      arr.removeEventListener('click', this.clickEvent.bind(this));\n    });\n    this.disposed = true;\n  }\n\n  on<K extends EventType>(evtType: K, handler: SpecificEventListener<K>, options?: AddEventListenerOptions | boolean): MetisMenu;\n\n  on<E extends Event>(evtType: E, handler: CustomEventListener<E>, options?: AddEventListenerOptions | boolean): MetisMenu;\n\n  on(evtType: MetisMenuEvents, handler: EventListener, options?: AddEventListenerOptions | boolean) {\n    this.element.addEventListener(evtType, handler, options);\n    return this;\n  }\n\n  off<K extends EventType>(evtType: K, handler: SpecificEventListener<K>, options?: AddEventListenerOptions | boolean): MetisMenu;\n\n  off<E extends Event>(evtType: E, handler: CustomEventListener<E>, options?: AddEventListenerOptions | boolean): MetisMenu;\n\n  off(evtType: MetisMenuEvents, handler: EventListener, options?: AddEventListenerOptions | boolean): MetisMenu {\n    this.element.removeEventListener(evtType, handler, options);\n    return this;\n  }\n\n  emit<T extends object>(evtType: string, evtData: T, shouldBubble = false): void {\n    const evt = new CustomEvent<T>(evtType, {\n        bubbles: shouldBubble,\n        detail: evtData,\n      });\n    this.element.dispatchEvent(evt);\n  }\n\n  toggle(ul: Element) {\n    const li = ul.closest(this.config.parentTrigger!);\n    if (li?.classList.contains(ClassName.ACTIVE)) {\n      this.hide(ul);\n    } else {\n      this.show(ul);\n    }\n  }\n\n  show(el: Element) {\n    const ul = el as HTMLElement;\n    const {\n      ACTIVE, COLLAPSE, COLLAPSED, COLLAPSING, SHOW,\n    } = ClassName;\n\n    if (this.isTransitioning || ul.classList.contains(COLLAPSING!)) {\n      return;\n    }\n    const complete = () => {\n      ul.classList.remove(COLLAPSING!);\n      ul.style.height = '';\n      ul.removeEventListener('transitionend', complete);\n      this.setTransitioning(false);\n      this.emit('shown.metisMenu', {\n        shownElement: ul,\n      });\n    };\n\n    const li = ul.closest(this.config.parentTrigger!);\n    li?.classList.add(ACTIVE!);\n\n    const a = li?.querySelector<HTMLElement>(this.config.triggerElement!);\n    a?.setAttribute('aria-expanded', 'true');\n    a?.classList.remove(COLLAPSED!);\n\n    ul.style.height = '0px';\n    ul.classList.remove(COLLAPSE!);\n    ul.classList.remove(SHOW!);\n    ul.classList.add(COLLAPSING!);\n    const eleParentSiblins = [].slice\n      .call(li?.parentNode?.children)\n      .filter((c) => c !== li);\n    if (this.config.toggle && eleParentSiblins.length > 0) {\n      eleParentSiblins.forEach((sibli: Element) => {\n        const sibUl = sibli.querySelector<HTMLElement>(this.config.subMenu!);\n        if (sibUl) {\n          this.hide(sibUl);\n        }\n      });\n    }\n\n    this.setTransitioning(true);\n\n    ul.classList.add(COLLAPSE!);\n    ul.classList.add(SHOW!);\n    ul.style.height = `$ul.scrollHeight}px`;\n    this.emit('show.metisMenu', {\n      showElement: ul,\n    });\n    ul.addEventListener('transitionend', complete);\n  }\n\n  hide(el: Element) {\n    const {\n      ACTIVE, COLLAPSE, COLLAPSED, COLLAPSING, SHOW,\n    } = ClassName;\n    const ul = el as HTMLElement;\n    if (this.isTransitioning || !ul.classList.contains(SHOW!)) {\n      return;\n    }\n    this.emit('hide.metisMenu', {\n      hideElement: ul,\n    });\n\n    const li = ul.closest(this.config.parentTrigger!);\n    li?.classList.remove(ACTIVE!);\n\n    const complete = () => {\n      ul.classList.remove(COLLAPSING!);\n      ul.classList.add(COLLAPSE!);\n      ul.style.height = '';\n      ul.removeEventListener('transitionend', complete);\n      this.setTransitioning(false);\n      this.emit('hidden.metisMenu', {\n        hiddenElement: ul,\n      });\n    };\n\n    ul.style.height = `$ul.getBoundingClientRect().height}px`;\n    ul.style.height = `$ul.offsetHeight}px`;\n\n    ul.classList.add(COLLAPSING!);\n    ul.classList.remove(COLLAPSE!);\n    ul.classList.remove(SHOW!);\n    this.setTransitioning(true);\n\n    ul.addEventListener('transitionend', complete);\n\n    ul.style.height = '0px';\n\n    const a = li?.querySelector(this.config.triggerElement!);\n    a?.setAttribute('aria-expanded', 'false');\n    a?.classList.add(COLLAPSED!);\n  }\n\n  private setTransitioning(isTransitioning: boolean) {\n    this.isTransitioning = isTransitioning;\n  }\n\n  static isElement(element: unknown): element is Element {\n    return Boolean((element as Element).classList);\n  }\n}\n\nexport default MetisMenu;\n"]}