{"version":3,"file":"search-toggle.mjs","sources":["../../../../src/moj/components/search-toggle/search-toggle.mjs"],"sourcesContent":["import { ConfigurableComponent } from 'govuk-frontend'\n\n/**\n * @augments {ConfigurableComponent<SearchToggleConfig>}\n */\nexport class SearchToggle extends ConfigurableComponent {\n  /**\n   * @param {Element | null} $root - HTML element to use for search toggle\n   * @param {SearchToggleConfig} [config] - Search toggle config\n   */\n  constructor($root, config = {}) {\n    super($root, config)\n\n    const $searchContainer =\n      this.config.searchContainer.element ??\n      this.$root.querySelector(this.config.searchContainer.selector)\n\n    const $toggleButtonContainer =\n      this.config.toggleButtonContainer.element ??\n      this.$root.querySelector(this.config.toggleButtonContainer.selector)\n\n    if (\n      !$searchContainer ||\n      !$toggleButtonContainer ||\n      !($searchContainer instanceof HTMLElement) ||\n      !($toggleButtonContainer instanceof HTMLElement)\n    ) {\n      return this\n    }\n\n    this.$searchContainer = $searchContainer\n    this.$toggleButtonContainer = $toggleButtonContainer\n\n    const svg =\n      '<svg viewBox=\"0 0 20 20\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" class=\"moj-search-toggle__button__icon\"><path d=\"M7.433,12.5790048 C6.06762625,12.5808611 4.75763941,12.0392925 3.79217348,11.0738265 C2.82670755,10.1083606 2.28513891,8.79837375 2.28699522,7.433 C2.28513891,6.06762625 2.82670755,4.75763941 3.79217348,3.79217348 C4.75763941,2.82670755 6.06762625,2.28513891 7.433,2.28699522 C8.79837375,2.28513891 10.1083606,2.82670755 11.0738265,3.79217348 C12.0392925,4.75763941 12.5808611,6.06762625 12.5790048,7.433 C12.5808611,8.79837375 12.0392925,10.1083606 11.0738265,11.0738265 C10.1083606,12.0392925 8.79837375,12.5808611 7.433,12.5790048 L7.433,12.5790048 Z M14.293,12.579 L13.391,12.579 L13.071,12.269 C14.2300759,10.9245158 14.8671539,9.20813198 14.866,7.433 C14.866,3.32786745 11.5381325,-1.65045755e-15 7.433,-1.65045755e-15 C3.32786745,-1.65045755e-15 -1.65045755e-15,3.32786745 -1.65045755e-15,7.433 C-1.65045755e-15,11.5381325 3.32786745,14.866 7.433,14.866 C9.208604,14.8671159 10.9253982,14.2296624 12.27,13.07 L12.579,13.39 L12.579,14.294 L18.296,20 L20,18.296 L14.294,12.579 L14.293,12.579 Z\"></path></svg>'\n\n    this.$toggleButton = document.createElement('button')\n    this.$toggleButton.setAttribute('class', 'moj-search-toggle__button')\n    this.$toggleButton.setAttribute('type', 'button')\n    this.$toggleButton.setAttribute('aria-haspopup', 'true')\n    this.$toggleButton.setAttribute('aria-expanded', 'false')\n    this.$toggleButton.innerHTML = `${this.config.toggleButton.text} ${svg}`\n\n    this.$toggleButton.addEventListener(\n      'click',\n      this.onToggleButtonClick.bind(this)\n    )\n\n    this.$toggleButtonContainer.append(this.$toggleButton)\n\n    document.addEventListener('click', this.onDocumentClick.bind(this))\n    document.addEventListener('focusin', this.onDocumentClick.bind(this))\n  }\n\n  showMenu() {\n    this.$toggleButton.setAttribute('aria-expanded', 'true')\n    this.$searchContainer.classList.remove('moj-js-hidden')\n    this.$searchContainer.querySelector('input').focus()\n  }\n\n  hideMenu() {\n    this.$searchContainer.classList.add('moj-js-hidden')\n    this.$toggleButton.setAttribute('aria-expanded', 'false')\n  }\n\n  onToggleButtonClick() {\n    if (this.$toggleButton.getAttribute('aria-expanded') === 'false') {\n      this.showMenu()\n    } else {\n      this.hideMenu()\n    }\n  }\n\n  /**\n   * @param {MouseEvent | FocusEvent} event\n   */\n  onDocumentClick(event) {\n    if (\n      event.target instanceof Node &&\n      !this.$toggleButtonContainer.contains(event.target) &&\n      !this.$searchContainer.contains(event.target)\n    ) {\n      this.hideMenu()\n    }\n  }\n\n  /**\n   * Name for the component used when initialising using data-module attributes.\n   */\n  static moduleName = 'moj-search-toggle'\n\n  /**\n   * Search toggle config\n   *\n   * @type {SearchToggleConfig}\n   */\n  static defaults = Object.freeze({\n    searchContainer: {\n      selector: '.moj-search'\n    },\n    toggleButton: {\n      text: 'Search'\n    },\n    toggleButtonContainer: {\n      selector: '.moj-search-toggle__toggle'\n    }\n  })\n\n  /**\n   * Search toggle config schema\n   *\n   * @satisfies {Schema<SearchToggleConfig>}\n   */\n  static schema = Object.freeze(\n    /** @type {const} */ ({\n      properties: {\n        searchContainer: { type: 'object' },\n        toggleButton: { type: 'object' },\n        toggleButtonContainer: { type: 'object' }\n      }\n    })\n  )\n}\n\n/**\n * @typedef {object} SearchToggleConfig\n * @property {object} [searchContainer] - Search config\n * @property {string} [searchContainer.selector] - Selector for search container\n * @property {Element | null} [searchContainer.element] - HTML element for search container\n * @property {object} [toggleButton] - Toggle button config\n * @property {string} [toggleButton.text] - Text for toggle button\n * @property {object} [toggleButtonContainer] - Toggle button container config\n * @property {string} [toggleButtonContainer.selector] - Selector for toggle button container\n * @property {Element | null} [toggleButtonContainer.element] - HTML element for toggle button container\n */\n\n/**\n * @import { Schema } from 'govuk-frontend/dist/govuk/common/configuration.mjs'\n */\n"],"names":["SearchToggle","ConfigurableComponent","constructor","$root","config","_this$config$searchCo","_this$config$toggleBu","$searchContainer","searchContainer","element","querySelector","selector","$toggleButtonContainer","toggleButtonContainer","HTMLElement","svg","$toggleButton","document","createElement","setAttribute","innerHTML","toggleButton","text","addEventListener","onToggleButtonClick","bind","append","onDocumentClick","showMenu","classList","remove","focus","hideMenu","add","getAttribute","event","target","Node","contains","moduleName","defaults","Object","freeze","schema","properties","type"],"mappings":"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"}