{"version":3,"sources":["webpack:///./src/js/modules/ticketsForm.js","webpack:///./src/js/components/dropdown.js"],"names":["Module","this","dom","tabs","el","querySelectorAll","dropdown","querySelector","tableScroll","activeTable","Dropdown","isSticky","cloneHeader","on","handleDropdownChange","bind","addEventListener","handleTableScroll","forEach","tab","handleTabChange","window","handleScreenScroll","sizeStickyHeader","e","showOption","target","value","update","option","classList","remove","add","stickyHeader","document","createElement","innerHTML","outerHTML","headerRows","subheaderRows","row","i","style","width","offsetWidth","scrollY","offsetTop","tableBottom","offsetHeight","append","scrollLeft","top","Component","options","dataset","search","searchTimeout","buildDropdown","handleClickOutside","handleOptionSelect","trigger","handleTriggerClick","handleTriggerKeydown","parentNode","hideDropdownList","list","childNodes","item","selectItem","event","callback","Event","createEvent","initEvent","dispatchEvent","wrapper","contains","getPlaceholder","setAttribute","isDevice","getAttribute","showDropdownList","key","which","keyCode","activeItem","preventDefault","stopPropagation","nextElement","previousElementSibling","focusItem","focusLast","nextElementSibling","focusFirst","findItemToFocus","character","String","fromCharCode","trim","items","clearTimeout","find","textContent","innerText","toLowerCase","startsWith","setTimeout","element","removeAttribute","defocusItem","scrollHeight","clientHeight","scrollBottom","scrollTop","elementBottom","firstItem","length","open","duration","close","placeholder","selectedOptionLabel","listId","uuidv4","insertBefore","appendChild","label","id","map","text","join","nextSibling","parent","removeChild","destroy","setupDefaults","addListeners"],"mappings":"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","file":"41.55aad31b9856dfca2106.js","sourcesContent":["import { Component } from '@verndale/core';\n\nimport Dropdown from '../components/dropdown';\n\nclass Module extends Component {\n  setupDefaults() {\n    this.dom = {\n      tabs: [...this.el.querySelectorAll('.tickets-form__tabs-list button')],\n      dropdown: this.el.querySelector('.tickets-form__dropdown'),\n      tableScroll: this.el.querySelector('.tickets-form__table-scroll')\n    };\n\n    this.activeTable = this.el.querySelector(\n      '.tickets-form__table-wrapper.selected'\n    );\n\n    this.dropdown = new Dropdown(this.dom.dropdown);\n    this.isSticky = false;\n    this.cloneHeader();\n  }\n\n  addListeners() {\n    this.dropdown.on('option', this.handleDropdownChange.bind(this));\n    this.dom.tableScroll.addEventListener(\n      'scroll',\n      this.handleTableScroll.bind(this)\n    );\n\n    this.dom.tabs.forEach(tab => {\n      tab.addEventListener('click', this.handleTabChange.bind(this));\n    });\n\n    window.addEventListener('scroll', this.handleScreenScroll.bind(this));\n    window.addEventListener('resize', this.sizeStickyHeader.bind(this));\n  }\n\n  handleDropdownChange(e) {\n    this.showOption(e.target.value);\n  }\n\n  handleTabChange(e) {\n    this.showOption(e.target.value);\n    this.dom.dropdown.value = e.target.value;\n    this.dropdown.update();\n  }\n\n  showOption(option) {\n    this.el\n      .querySelector('.tickets-form__tabs-list button.selected')\n      .classList.remove('selected');\n    this.el\n      .querySelector('.tickets-form__table-wrapper.selected')\n      .classList.remove('selected');\n    this.el\n      .querySelector(`.tickets-form__tabs-list button[value=\"${option}\"]`)\n      ?.classList.add('selected');\n\n    this.activeTable = this.el.querySelector(\n      `.tickets-form__table-wrapper[data-id=\"${option}\"]`\n    );\n    this.activeTable.classList.add('selected');\n\n    this.el\n      .querySelector('.tickets-form__info-wrapper.selected')\n      .classList.remove('selected');\n    this.el\n      .querySelector(`.tickets-form__info-wrapper[data-id=\"${option}\"]`)\n      .classList.add('selected');\n\n    this.cloneHeader();\n  }\n\n  cloneHeader() {\n    this.stickyHeader = document.createElement('div');\n    this.stickyHeader.classList.add('tickets-form__sticky-header');\n    this.stickyHeader.innerHTML = `\n     <div>\n      <table>\n        <thead>${this.activeTable.querySelector('thead').innerHTML}</thead>\n        <tbody>${\n          this.activeTable.querySelector('.tickets-form__table-categories')\n            .outerHTML\n        }</tbody>\n      </div>\n    </table>`;\n\n    // this.stickyHeader.addEventListener(\n    //   'scroll',\n    //   this.handleHeaderScroll.bind(this)\n    // );\n\n    this.sizeStickyHeader();\n  }\n\n  sizeStickyHeader() {\n    const headerRows = [\n      ...this.activeTable.querySelectorAll('.tickets-form__table-header th')\n    ];\n    const subheaderRows = [\n      ...this.activeTable.querySelectorAll('.tickets-form__table-categories th')\n    ];\n\n    [\n      ...this.stickyHeader.querySelectorAll('.tickets-form__table-header th')\n    ].forEach((row, i) => {\n      row.style.width = `${headerRows[i].offsetWidth}px`;\n    });\n\n    [\n      ...this.stickyHeader.querySelectorAll(\n        '.tickets-form__table-categories th'\n      )\n    ].forEach((row, i) => {\n      row.style.width = `${subheaderRows[i].offsetWidth}px`;\n    });\n\n    this.handleScreenScroll();\n  }\n\n  handleScreenScroll() {\n    const { scrollY } = window;\n    const { offsetTop } = this.activeTable;\n    const tableBottom =\n      offsetTop +\n      this.activeTable.offsetHeight -\n      this.stickyHeader.offsetHeight;\n\n    if (scrollY > offsetTop) {\n      if (!this.isSticky) {\n        this.el.append(this.stickyHeader);\n        this.isSticky = true;\n        this.stickyHeader.scrollLeft = this.dom.tableScroll.scrollLeft;\n      }\n\n      if (scrollY > tableBottom) {\n        this.stickyHeader.style.top = `-${scrollY - tableBottom}px`;\n      } else {\n        this.stickyHeader.style.top = '0';\n      }\n    } else {\n      if (this.isSticky) {\n        this.stickyHeader.remove();\n        this.isSticky = false;\n      }\n    }\n  }\n\n  handleTableScroll(e) {\n    this.stickyHeader.scrollLeft = e.target.scrollLeft;\n  }\n\n  // handleHeaderScroll(e) {\n  //   this.dom.tableScroll.scrollLeft = e.target.scrollLeft;\n  // }\n}\n\nexport default Module;\n","import { Component } from '@verndale/core';\nimport { isDevice, open, close } from '../helpers';\nimport { v4 as uuidv4 } from 'uuid';\n\nclass Module extends Component {\n  setupDefaults() {\n    this.options = [...this.el];\n    this.style = this.el.dataset.style;\n    this.search = '';\n    this.searchTimeout = null;\n\n    this.buildDropdown();\n  }\n\n  addListeners() {\n    document.addEventListener('click', this.handleClickOutside.bind(this));\n    this.el.addEventListener('change', this.handleOptionSelect.bind(this));\n    this.dom.trigger.addEventListener(\n      'click',\n      this.handleTriggerClick.bind(this)\n    );\n    this.dom.trigger.addEventListener(\n      'keydown',\n      this.handleTriggerKeydown.bind(this)\n    );\n    this.dom.trigger.parentNode.addEventListener(\n      'blur',\n      this.hideDropdownList.bind(this)\n    );\n    this.dom.list.childNodes.forEach(item => {\n      item.addEventListener('click', () => this.selectItem(item));\n    });\n  }\n\n  on(event, callback) {\n    this.el.addEventListener(event, callback);\n  }\n\n  setValue(value) {\n    let event;\n\n    if (typeof Event === 'function') {\n      event = new Event('change');\n    } else {\n      event = document.createEvent('Event');\n      event.initEvent('change', true, true);\n    }\n\n    this.el.value = value;\n    this.el.dispatchEvent(event);\n  }\n\n  getValue() {\n    return this.el.value;\n  }\n\n  handleClickOutside(e) {\n    if (this.dom.wrapper !== e.target && !this.dom.wrapper.contains(e.target)) {\n      this.hideDropdownList();\n    }\n  }\n\n  handleOptionSelect() {\n    let event;\n\n    if (typeof Event === 'function') {\n      event = new Event('option');\n    } else {\n      event = document.createEvent('Event');\n      event.initEvent('option', true, true);\n    }\n\n    this.dom.trigger.innerHTML = this.getPlaceholder(this.el.value);\n\n    this.options.forEach(option => {\n      if (option.value === this.el.value) {\n        option.setAttribute('aria-selected', true);\n      } else {\n        option.setAttribute('aria-selected', false);\n      }\n    });\n\n    this.dom.list.childNodes.forEach(item => {\n      if (item.dataset.value === this.el.value) {\n        item.setAttribute('aria-selected', true);\n      } else {\n        item.setAttribute('aria-selected', false);\n      }\n    });\n\n    this.el.dispatchEvent(event);\n  }\n\n  handleTriggerClick() {\n    if (isDevice()) {\n      return;\n    }\n\n    if (!this.dom.trigger.getAttribute('aria-expanded')) {\n      this.showDropdownList();\n    } else {\n      this.hideDropdownList();\n    }\n  }\n\n  handleTriggerKeydown(e) {\n    if (isDevice()) return;\n\n    const key = e.which || e.keyCode;\n\n    switch (key) {\n      case 13: // ENTER\n        if (this.dom.trigger.getAttribute('aria-expanded')) {\n          if (this.activeItem) {\n            e.preventDefault();\n            e.stopPropagation();\n            this.selectItem(this.activeItem);\n          }\n        }\n        break;\n      case 38: // UP\n        e.preventDefault();\n        if (this.dom.trigger.getAttribute('aria-expanded') !== 'true') {\n          this.showDropdownList();\n        }\n\n        if (this.activeItem) {\n          const nextElement = this.activeItem.previousElementSibling;\n\n          if (nextElement) {\n            this.focusItem(nextElement);\n          } else {\n            this.focusLast();\n          }\n        } else {\n          this.focusLast();\n        }\n\n        break;\n      case 40: // DOWN\n        e.preventDefault();\n        if (this.dom.trigger.getAttribute('aria-expanded') !== 'true') {\n          this.showDropdownList();\n        }\n\n        if (this.activeItem) {\n          const nextElement = this.activeItem.nextElementSibling;\n\n          if (nextElement) {\n            this.focusItem(nextElement);\n          } else {\n            this.focusFirst();\n          }\n        } else {\n          this.focusFirst();\n        }\n\n        break;\n      case 36:\n        e.preventDefault();\n        this.focusFirst();\n        break;\n      case 35:\n        e.preventDefault();\n        this.focusLast();\n        break;\n      default:\n        this.findItemToFocus(key);\n        break;\n    }\n  }\n\n  findItemToFocus(key) {\n    const character = String.fromCharCode(key).trim();\n    const items = this.dom.list.querySelectorAll('[role=\"option\"]');\n\n    if (!character) return;\n\n    if (!this.dom.trigger.getAttribute('aria-expanded')) {\n      this.showDropdownList();\n    }\n\n    if (this.searchTimeout) {\n      clearTimeout(this.searchTimeout);\n    }\n\n    this.search += character;\n\n    [...items].find(option => {\n      const label = option.textContent || option.innerText || '';\n\n      if (label.trim().toLowerCase().startsWith(this.search.toLowerCase())) {\n        this.focusItem(option);\n        return true;\n      }\n    });\n\n    this.searchTimeout = setTimeout(() => {\n      this.search = '';\n    }, 500);\n  }\n\n  selectItem(item) {\n    this.el.value = item.dataset.value;\n    this.handleOptionSelect();\n    this.hideDropdownList();\n  }\n\n  defocusItem(element) {\n    if (!element) return;\n    element.removeAttribute('aria-selected');\n  }\n\n  focusItem(element) {\n    this.defocusItem(this.activeItem);\n    element.setAttribute('aria-selected', 'true');\n    this.activeItem = element;\n\n    if (this.dom.list.scrollHeight > this.dom.list.clientHeight) {\n      const scrollBottom = this.dom.list.clientHeight + this.dom.list.scrollTop;\n      const elementBottom = element.offsetTop + element.offsetHeight;\n      if (elementBottom > scrollBottom) {\n        this.dom.list.scrollTop = elementBottom - this.dom.list.clientHeight;\n      } else if (element.offsetTop < this.dom.list.scrollTop) {\n        this.dom.list.scrollTop = element.offsetTop;\n      }\n    }\n  }\n\n  focusFirst() {\n    const firstItem = this.dom.list.querySelector('[role=\"option\"]');\n    if (firstItem) {\n      this.focusItem(firstItem);\n    }\n  }\n\n  focusLast() {\n    const items = this.dom.list.querySelectorAll('[role=\"option\"]');\n\n    if (items.length) {\n      this.focusItem(items[items.length - 1]);\n    }\n  }\n\n  showDropdownList() {\n    this.dom.trigger.setAttribute('aria-expanded', true);\n    this.dom.wrapper.classList.add('open');\n    open({ element: this.dom.list, duration: 0.6 });\n  }\n\n  hideDropdownList() {\n    close({\n      element: this.dom.list,\n      duration: 0.6\n    });\n    this.dom.trigger.removeAttribute('aria-expanded');\n    this.dom.wrapper.classList.remove('open');\n    this.defocusItem(this.activeItem);\n    this.activeItem = null;\n  }\n\n  getPlaceholder(value) {\n    const placeholder = this.el.getAttribute('placeholder');\n    const selectedOptionLabel = this.options.find(\n      option => option.value === value\n    ).innerHTML;\n\n    if (placeholder) {\n      return `${\n        selectedOptionLabel\n          ? `<span>${placeholder}:</span>`\n          : `<span>${placeholder}</span>`\n      } ${selectedOptionLabel}<svg><use xlink:href=\"#chevron-right\" /></svg>`;\n    }\n\n    return `${selectedOptionLabel}<svg><use xlink:href=\"#chevron-right\" /></svg>`;\n  }\n\n  buildDropdown() {\n    const listId = uuidv4();\n    this.dom.wrapper = document.createElement('div');\n    this.el.setAttribute('aria-hidden', true);\n    this.el.setAttribute('tabindex', '-1');\n    this.el.parentNode.insertBefore(this.dom.wrapper, this.el);\n    this.dom.wrapper.classList.add('dropdown');\n\n    if (this.style) {\n      this.dom.wrapper.classList.add(`dropdown--${this.style}`);\n    }\n\n    if (isDevice()) {\n      this.dom.wrapper.classList.add('dropdown--native');\n    }\n    this.dom.wrapper.appendChild(this.el);\n\n    this.dom.trigger = document.createElement('button');\n    this.dom.trigger.classList.add('dropdown__trigger');\n    this.dom.trigger.setAttribute('type', 'button');\n    this.dom.trigger.setAttribute('role', 'combobox');\n    this.dom.trigger.setAttribute('aria-haspopup', 'listbox');\n    this.dom.trigger.setAttribute('aria-controls', `${listId}`);\n\n    // Get label\n    const label = document.querySelector(`label[for=\"${this.el.id}\"]`);\n\n    if (label) {\n      this.dom.trigger.setAttribute('aria-label', label.textContent);\n    }\n\n    this.dom.trigger.innerHTML = this.getPlaceholder(this.el.value);\n\n    this.dom.wrapper.appendChild(this.dom.trigger);\n\n    this.dom.list = document.createElement('ul');\n    this.dom.list.id = listId;\n    this.dom.list.classList.add('dropdown__list');\n    this.dom.list.setAttribute('role', 'listbox');\n    this.dom.list.setAttribute(\n      'aria-label',\n      this.el.getAttribute('aria-label')\n    );\n    this.dom.list.innerHTML = this.options\n      .map(\n        option =>\n          `<li class=\"dropdown__list__option\" role=\"option\" data-value=\"${\n            option.value\n          }\" aria-selected=\"${option.value === this.el.value}\">${option.text}\n            <span clasS=\"dropdown__list__option-decorator\">\n              <span></span>\n            </span>\n          </li>`\n      )\n      .join('');\n    this.el.parentNode.insertBefore(this.dom.list, this.el.nextSibling);\n    this.dom.wrapper.appendChild(this.dom.list);\n  }\n\n  destroy() {\n    const parent = this.el.parentNode;\n    parent.removeChild(this.el);\n    parent.parentNode.insertBefore(this.el, parent);\n    parent.parentNode.removeChild(parent);\n  }\n\n  update() {\n    this.destroy();\n    this.setupDefaults();\n    this.addListeners();\n  }\n}\n\nexport default Module;\n"],"sourceRoot":""}