@watermarkinsights/ripple 3.24.0 → 3.24.1

package/dist/ripple/p-98a9eb8c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmSearchCss","Search","this","wrapperEl","linkEl","resultCount","message","basicMessage","intl","formatMessage","id","defaultMessage","numResults","findMessage","current","highlightedNum","searchType","toggleTabbingOn","isTabbing","classList","remove","add","toggleTabbingOff","componentWillLoad","placeholder","console","error","label","hookToModal","el","tagName","parentModal","parentElement","events","map","event","addEventListener","updateValue","async","value","resetHighlightCountToStart","announceChanges","announce","resultsLiveRegion","textContent","announcement","window","requestAnimationFrame","messageToAnnounce","highlightedName","changeHighlightedNum","newNum","wmSearchBrowseResults","emit","position","wmBrowseSearchResults","addFocusStyle","removeFocusStyle","handleBlur","previousBlurredValue","wmSearchValueChanged","renderResultsAndBrowseButtons","h","class","icon","tooltip","description","onClick","disabled","renderJumpToLink","highlightedId","ref","href","render","Host","onInput","ev","target","onFocus","onBlur","autocomplete","String","fromCodePoint","parseInt"],"sources":["./src/components/wm-search/wm-search.scss?tag=wm-search&encapsulation=shadow","./src/components/wm-search/wm-search.tsx"],"sourcesContent":[":host,\nwm-search {\n  * {\n    box-sizing: border-box;\n  }\n  width: 100%;\n  font-size: rem-calc(14);\n\n  .wm-search-wrapper {\n    border-radius: 3px;\n    position: relative;\n    border: 1px solid rgba(35, 35, 35, 0.6);\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    .search-icon {\n      @include mdi-icon;\n      font-size: rem-calc(17);\n      position: absolute;\n      left: rem-calc(7);\n    }\n\n    input {\n      border: none;\n      height: 40px;\n      padding: rem-calc(0 28);\n      background: transparent;\n      overflow: visible;\n      width: 100%;\n      flex: 1;\n      font-family: inherit;\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    &.focus {\n      box-shadow: 0 0 0 1px #20cbd4;\n      border-color: $border-focus-color;\n      border-radius: 3px;\n    }\n  }\n\n  .find {\n    min-height: 3rem;\n\n    input {\n      padding: 16px 8px 16px 28px;\n    }\n\n    .wm-find-elements {\n      display: flex;\n      align-items: center;\n      justify-content: flex-start;\n      padding-right: 16px;\n      wm-button + wm-button {\n        margin-left: rem-calc(4);\n      }\n\n      .results {\n        margin-right: rem-calc(8);\n        font-style: italic;\n      }\n    }\n  }\n\n  .sr-only {\n    @include srOnly;\n  }\n\n  .show-for-tabbers {\n    all: unset;\n    color: #575195;\n    text-decoration: none;\n    font-weight: 500;\n    font-size: rem-calc(14);\n    margin: 10px 0;\n\n    &:hover {\n      background: linear-gradient(#575195, #575195) no-repeat;\n      background-size: 100% 1px;\n      background-position: 0 1.2em;\n      padding-bottom: 0.2em;\n    }\n\n    &:focus {\n      outline: none;\n      background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\n      background-size: 6px 3px;\n      background-position: 0 1.2em;\n      padding-bottom: 0.2em;\n    }\n  }\n}\n","import { h, Component, Element, Prop, Watch, Host, Method, Listen, State, Event, EventEmitter } from \"@stencil/core\";\nimport { intl } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-search\",\n  styleUrl: \"wm-search.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Search {\n  @Element() el!: HTMLWmSearchElement;\n  @Prop({ mutable: true }) searchType: \"basic\" | \"find\" = \"basic\";\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Props required for both variants.\n   */\n  @Prop() placeholder: string = \"\";\n  @Prop() label: string = \"\";\n  @Prop({ mutable: true }) numResults: number = 0;\n\n  /**\n   * This exposes the input's value on the host component so that the app can access it.\n   */\n  @Prop({ mutable: true, reflect: true }) value: string = \"\";\n\n  /**\n   * If the user is tabbing, the search and find variant will display a link to jump to a search result.\n   */\n  @State() isTabbing: boolean = false;\n\n  /**\n   * Prop specifically for the search and find variant. The id points to the id of the option currently highlighted,\n   * so that tabbing and screen reader users can jump to this option rather than tab through the list to find it.\n   */\n  @Prop() highlightedId: string = \"\";\n  @Prop() highlightedName: string | null = null;\n\n  /**\n   * Indicates which of the search results is currently highlighted. It will be displayed as \"[highlightedNum] of [numResults]\" next to the input in the search and find variant.\n   * This number updates as the user browses using the buttons.\n   */\n  @State() highlightedNum: number = 0;\n\n  @State() previousBlurredValue: string = \"\";\n  @State() parentModal?: HTMLWmModalElement;\n\n  /**\n   * Live region announcement\n   */\n  @State() announcement: string = \"\";\n\n  get resultCount(): string {\n    let message = \"\";\n    const basicMessage = intl.formatMessage(\n      {\n        id: \"search.resultsFound\",\n        defaultMessage: \"{numResults, plural, =0 {No results} one {1 result} other {# results}} found\",\n      },\n      { numResults: this.numResults }\n    );\n    const findMessage = intl.formatMessage(\n      {\n        id: \"search.xOfYResults\",\n        defaultMessage: \"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}\",\n      },\n      { numResults: this.numResults, current: this.highlightedNum }\n    );\n\n    if (this.searchType === \"basic\") {\n      message = basicMessage;\n    } else if (this.searchType === \"find\") {\n      message = findMessage;\n    }\n\n    return message;\n  }\n\n  /**\n   * Emitted when the buttons in the search-and-find variant are pressed.\n   */\n  @Event() wmSearchBrowseResults!: EventEmitter<{ position: number }>;\n  @Event() wmBrowseSearchResults!: EventEmitter<{ position: number }>; // deprecated in favor of wmSearchBrowseResults\n  @Event() wmSearchValueChanged!: EventEmitter<{ value: string }>;\n\n  /**\n   * Element refs\n   */\n  private resultsLiveRegion!: HTMLElement;\n  private wrapperEl: HTMLElement | null = null;\n  private linkEl: HTMLElement | null = null;\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n    this.linkEl && this.linkEl.classList.remove(\"sr-only\");\n    this.linkEl && this.linkEl.classList.add(\"show-for-tabbers\");\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n    this.linkEl && this.linkEl.classList.add(\"sr-only\");\n    this.linkEl && this.linkEl.classList.remove(\"show-for-tabbers\");\n  }\n\n  componentWillLoad() {\n    if (this.placeholder === \"\") {\n      console.error(\"You must set the placeholder property for the wm-search component.\");\n    }\n\n    if (this.label === \"\") {\n      console.error(\"You must set the label property for the wm-search component.\");\n    }\n    this.hookToModal();\n  }\n\n  hookToModal() {\n    // if the search is in a modal we want to clear the input when the modal closes\n    let el = this.el as any;\n    while (!!el) {\n      if (el.tagName === \"WM-MODAL\") {\n        this.parentModal = el as HTMLWmModalElement;\n      }\n      el = el.parentElement as HTMLElement;\n    }\n\n    if (this.parentModal) {\n      const events = [\"wmCloseTriggered\", \"wmPrimaryTriggered\", \"wmSecondaryTriggered\"];\n      events.map((event) => {\n        this.parentModal!.addEventListener(event, () => {\n          this.updateValue(\"\");\n        });\n      });\n    }\n  }\n\n  // this undocumented method is needed in hookToModal (needs to be exposed so we can set the callback func)\n  @Method()\n  async updateValue(value: string) {\n    this.value = value;\n\n    //For search-and-find, the results should always restart at \"[1 or 0] of ...\" after any new input.\n    //Reset the highlight count here just in case the new value doesn't end up changing the number of results.\n    this.resetHighlightCountToStart();\n\n    if (this.value) {\n      this.announceChanges();\n    }\n  }\n\n  @Watch(\"numResults\")\n  resetHighlightCountToStart(): void {\n    if (this.searchType === \"find\") {\n      this.highlightedNum = this.numResults ? 1 : 0;\n    }\n  }\n\n  announce(message: string) {\n    if (this.resultsLiveRegion!.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.announcement = message;\n  }\n\n  announceChanges() {\n    window.requestAnimationFrame(() => {\n      // requestAnimationFrame to allow all changes to occur before announcing results\n      let messageToAnnounce = this.resultCount;\n\n      // if a result is found, also include it after the liveregion message\n      if (this.searchType === \"find\" && this.highlightedName) {\n        messageToAnnounce += `, ${this.highlightedName}`;\n      }\n\n      this.announce(messageToAnnounce);\n    });\n  }\n\n  changeHighlightedNum(newNum: number): void {\n    if (this.numResults) {\n      if (newNum < 1) {\n        // we were on the first item, going down: go to last item\n        this.highlightedNum = this.numResults;\n      } else if (newNum > this.numResults) {\n        // we were on the last item, going up: go to first item\n        this.highlightedNum = 1;\n      } else {\n        this.highlightedNum = newNum;\n      }\n\n      this.wmSearchBrowseResults.emit({ position: this.highlightedNum });\n      this.wmBrowseSearchResults.emit({ position: this.highlightedNum });\n      this.announceChanges();\n    }\n  }\n\n  addFocusStyle() {\n    if (this.wrapperEl) {\n      this.wrapperEl.classList.add(\"focus\");\n    }\n  }\n\n  removeFocusStyle() {\n    if (this.wrapperEl) {\n      this.wrapperEl.classList.remove(\"focus\");\n    }\n  }\n\n  handleBlur() {\n    this.removeFocusStyle();\n    if (this.previousBlurredValue !== this.value) {\n      this.wmSearchValueChanged.emit({ value: this.value });\n    }\n    this.previousBlurredValue = this.value;\n  }\n\n  /**\n   * Functions that return elements specifically for search-and-find.\n   */\n  renderResultsAndBrowseButtons(): HTMLDivElement {\n    return (\n      <div class=\"wm-find-elements\">\n        <div id=\"results-display\" class=\"results\">\n          {this.resultCount}\n        </div>\n        <div class=\"wm-button-collection\">\n          <wm-button\n            button-type=\"icononly\"\n            icon=\"f05d\"\n            tooltip={intl.formatMessage({\n              id: \"global.previous\",\n              description: \"button text\",\n              defaultMessage: \"previous\",\n            })}\n            tooltip-position=\"bottom\"\n            onClick={() => this.changeHighlightedNum(this.highlightedNum - 1)}\n            disabled={this.disabled || this.numResults < 2}\n            label-for-identical-buttons={intl.formatMessage({\n              id: \"search.previousResult\",\n              defaultMessage: \"Press to hear previous matching result\",\n            })}\n          />\n          <wm-button\n            button-type=\"icononly\"\n            icon=\"f045\"\n            tooltip={intl.formatMessage({\n              id: \"global.next\",\n              description: \"button text\",\n              defaultMessage: \"next\",\n            })}\n            tooltip-position=\"bottom\"\n            onClick={() => this.changeHighlightedNum(this.highlightedNum + 1)}\n            disabled={this.disabled || this.numResults < 2}\n            label-for-identical-buttons={intl.formatMessage({\n              id: \"search.nextResult\",\n              defaultMessage: \"Press to hear next matching result\",\n            })}\n          />\n        </div>\n      </div>\n    );\n  }\n\n  renderJumpToLink(): HTMLAnchorElement | null {\n    if (this.numResults && this.highlightedId) {\n      return (\n        <a ref={(el) => (this.linkEl = el as HTMLAnchorElement)} href={`#${this.highlightedId}`} class=\"sr-only\">\n          {intl.formatMessage({\n            id: \"search.jumpToResult\",\n            defaultMessage: \"Jump to search result in list\",\n          })}\n        </a>\n      );\n    } else {\n      return null;\n    }\n  }\n  /**\n   * End search and find render helpers\n   */\n\n  render() {\n    return (\n      <Host>\n        <div\n          id=\"wm-search-wrapper\"\n          class={`wm-search-wrapper ${this.searchType}`}\n          ref={(el) => (this.wrapperEl = el as HTMLDivElement)}\n        >\n          <input\n            disabled={this.disabled}\n            id=\"wm-search-input\"\n            placeholder={this.placeholder}\n            aria-label={`${this.label ? this.label + \". \" : \"\"}${intl.formatMessage({\n              id: \"search.typeToFilterResults\",\n              defaultMessage: \"Type to filter the results\",\n            })}`}\n            onInput={(ev: Event) => this.updateValue((ev.target as HTMLInputElement).value)}\n            onFocus={() => this.addFocusStyle()}\n            onBlur={() => this.handleBlur()}\n            aria-autocomplete=\"none\"\n            autocomplete=\"off\"\n            value={this.value}\n          />\n          <span class=\"mdi search-icon\">{String.fromCodePoint(parseInt(`0xf349`))}</span>\n          {this.searchType === \"find\" && this.renderResultsAndBrowseButtons()}\n          <div\n            id=\"wm-search-live\"\n            class=\"sr-only\"\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n            ref={(el) => (this.resultsLiveRegion = el as HTMLElement)}\n          >\n            {this.announcement}\n          </div>\n        </div>\n        {this.searchType === \"find\" && this.renderJumpToLink()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-a31a30ac.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmSearchCss","Search","exports","this","wrapperEl","linkEl","Object","defineProperty","class_1","prototype","message","basicMessage","intl","formatMessage","id","defaultMessage","numResults","findMessage","current","highlightedNum","searchType","toggleTabbingOn","isTabbing","classList","remove","add","toggleTabbingOff","componentWillLoad","placeholder","console","error","label","hookToModal","_this","el","tagName","parentModal","parentElement","events","map","event","addEventListener","updateValue","value","resetHighlightCountToStart","announceChanges","announce","resultsLiveRegion","textContent","announcement","window","requestAnimationFrame","messageToAnnounce","resultCount","highlightedName","concat","changeHighlightedNum","newNum","wmSearchBrowseResults","emit","position","wmBrowseSearchResults","addFocusStyle","removeFocusStyle","handleBlur","previousBlurredValue","wmSearchValueChanged","renderResultsAndBrowseButtons","h","class","icon","tooltip","description","onClick","disabled","renderJumpToLink","highlightedId","ref","href","render","Host","onInput","ev","target","onFocus","onBlur","autocomplete","String","fromCodePoint","parseInt"],"sources":["src/components/wm-search/wm-search.scss?tag=wm-search&encapsulation=shadow","src/components/wm-search/wm-search.tsx"],"sourcesContent":[":host,\nwm-search {\n  * {\n    box-sizing: border-box;\n  }\n  width: 100%;\n  font-size: rem-calc(14);\n\n  .wm-search-wrapper {\n    border-radius: 3px;\n    position: relative;\n    border: 1px solid rgba(35, 35, 35, 0.6);\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    .search-icon {\n      @include mdi-icon;\n      font-size: rem-calc(17);\n      position: absolute;\n      left: rem-calc(7);\n    }\n\n    input {\n      border: none;\n      height: 40px;\n      padding: rem-calc(0 28);\n      background: transparent;\n      overflow: visible;\n      width: 100%;\n      flex: 1;\n      font-family: inherit;\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    &.focus {\n      box-shadow: 0 0 0 1px #20cbd4;\n      border-color: $border-focus-color;\n      border-radius: 3px;\n    }\n  }\n\n  .find {\n    min-height: 3rem;\n\n    input {\n      padding: 16px 8px 16px 28px;\n    }\n\n    .wm-find-elements {\n      display: flex;\n      align-items: center;\n      justify-content: flex-start;\n      padding-right: 16px;\n      wm-button + wm-button {\n        margin-left: rem-calc(4);\n      }\n\n      .results {\n        margin-right: rem-calc(8);\n        font-style: italic;\n      }\n    }\n  }\n\n  .sr-only {\n    @include srOnly;\n  }\n\n  .show-for-tabbers {\n    all: unset;\n    color: #575195;\n    text-decoration: none;\n    font-weight: 500;\n    font-size: rem-calc(14);\n    margin: 10px 0;\n\n    &:hover {\n      background: linear-gradient(#575195, #575195) no-repeat;\n      background-size: 100% 1px;\n      background-position: 0 1.2em;\n      padding-bottom: 0.2em;\n    }\n\n    &:focus {\n      outline: none;\n      background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\n      background-size: 6px 3px;\n      background-position: 0 1.2em;\n      padding-bottom: 0.2em;\n    }\n  }\n}\n","import { h, Component, Element, Prop, Watch, Host, Method, Listen, State, Event, EventEmitter } from \"@stencil/core\";\nimport { intl } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-search\",\n  styleUrl: \"wm-search.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Search {\n  @Element() el!: HTMLWmSearchElement;\n  @Prop({ mutable: true }) searchType: \"basic\" | \"find\" = \"basic\";\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Props required for both variants.\n   */\n  @Prop() placeholder: string = \"\";\n  @Prop() label: string = \"\";\n  @Prop({ mutable: true }) numResults: number = 0;\n\n  /**\n   * This exposes the input's value on the host component so that the app can access it.\n   */\n  @Prop({ mutable: true, reflect: true }) value: string = \"\";\n\n  /**\n   * If the user is tabbing, the search and find variant will display a link to jump to a search result.\n   */\n  @State() isTabbing: boolean = false;\n\n  /**\n   * Prop specifically for the search and find variant. The id points to the id of the option currently highlighted,\n   * so that tabbing and screen reader users can jump to this option rather than tab through the list to find it.\n   */\n  @Prop() highlightedId: string = \"\";\n  @Prop() highlightedName: string | null = null;\n\n  /**\n   * Indicates which of the search results is currently highlighted. It will be displayed as \"[highlightedNum] of [numResults]\" next to the input in the search and find variant.\n   * This number updates as the user browses using the buttons.\n   */\n  @State() highlightedNum: number = 0;\n\n  @State() previousBlurredValue: string = \"\";\n  @State() parentModal?: HTMLWmModalElement;\n\n  /**\n   * Live region announcement\n   */\n  @State() announcement: string = \"\";\n\n  get resultCount(): string {\n    let message = \"\";\n    const basicMessage = intl.formatMessage(\n      {\n        id: \"search.resultsFound\",\n        defaultMessage: \"{numResults, plural, =0 {No results} one {1 result} other {# results}} found\",\n      },\n      { numResults: this.numResults }\n    );\n    const findMessage = intl.formatMessage(\n      {\n        id: \"search.xOfYResults\",\n        defaultMessage: \"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}\",\n      },\n      { numResults: this.numResults, current: this.highlightedNum }\n    );\n\n    if (this.searchType === \"basic\") {\n      message = basicMessage;\n    } else if (this.searchType === \"find\") {\n      message = findMessage;\n    }\n\n    return message;\n  }\n\n  /**\n   * Emitted when the buttons in the search-and-find variant are pressed.\n   */\n  @Event() wmSearchBrowseResults!: EventEmitter<{ position: number }>;\n  @Event() wmBrowseSearchResults!: EventEmitter<{ position: number }>; // deprecated in favor of wmSearchBrowseResults\n  @Event() wmSearchValueChanged!: EventEmitter<{ value: string }>;\n\n  /**\n   * Element refs\n   */\n  private resultsLiveRegion!: HTMLElement;\n  private wrapperEl: HTMLElement | null = null;\n  private linkEl: HTMLElement | null = null;\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n    this.linkEl && this.linkEl.classList.remove(\"sr-only\");\n    this.linkEl && this.linkEl.classList.add(\"show-for-tabbers\");\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n    this.linkEl && this.linkEl.classList.add(\"sr-only\");\n    this.linkEl && this.linkEl.classList.remove(\"show-for-tabbers\");\n  }\n\n  componentWillLoad() {\n    if (this.placeholder === \"\") {\n      console.error(\"You must set the placeholder property for the wm-search component.\");\n    }\n\n    if (this.label === \"\") {\n      console.error(\"You must set the label property for the wm-search component.\");\n    }\n    this.hookToModal();\n  }\n\n  hookToModal() {\n    // if the search is in a modal we want to clear the input when the modal closes\n    let el = this.el as any;\n    while (!!el) {\n      if (el.tagName === \"WM-MODAL\") {\n        this.parentModal = el as HTMLWmModalElement;\n      }\n      el = el.parentElement as HTMLElement;\n    }\n\n    if (this.parentModal) {\n      const events = [\"wmCloseTriggered\", \"wmPrimaryTriggered\", \"wmSecondaryTriggered\"];\n      events.map((event) => {\n        this.parentModal!.addEventListener(event, () => {\n          this.updateValue(\"\");\n        });\n      });\n    }\n  }\n\n  // this undocumented method is needed in hookToModal (needs to be exposed so we can set the callback func)\n  @Method()\n  async updateValue(value: string) {\n    this.value = value;\n\n    //For search-and-find, the results should always restart at \"[1 or 0] of ...\" after any new input.\n    //Reset the highlight count here just in case the new value doesn't end up changing the number of results.\n    this.resetHighlightCountToStart();\n\n    if (this.value) {\n      this.announceChanges();\n    }\n  }\n\n  @Watch(\"numResults\")\n  resetHighlightCountToStart(): void {\n    if (this.searchType === \"find\") {\n      this.highlightedNum = this.numResults ? 1 : 0;\n    }\n  }\n\n  announce(message: string) {\n    if (this.resultsLiveRegion!.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.announcement = message;\n  }\n\n  announceChanges() {\n    window.requestAnimationFrame(() => {\n      // requestAnimationFrame to allow all changes to occur before announcing results\n      let messageToAnnounce = this.resultCount;\n\n      // if a result is found, also include it after the liveregion message\n      if (this.searchType === \"find\" && this.highlightedName) {\n        messageToAnnounce += `, ${this.highlightedName}`;\n      }\n\n      this.announce(messageToAnnounce);\n    });\n  }\n\n  changeHighlightedNum(newNum: number): void {\n    if (this.numResults) {\n      if (newNum < 1) {\n        // we were on the first item, going down: go to last item\n        this.highlightedNum = this.numResults;\n      } else if (newNum > this.numResults) {\n        // we were on the last item, going up: go to first item\n        this.highlightedNum = 1;\n      } else {\n        this.highlightedNum = newNum;\n      }\n\n      this.wmSearchBrowseResults.emit({ position: this.highlightedNum });\n      this.wmBrowseSearchResults.emit({ position: this.highlightedNum });\n      this.announceChanges();\n    }\n  }\n\n  addFocusStyle() {\n    if (this.wrapperEl) {\n      this.wrapperEl.classList.add(\"focus\");\n    }\n  }\n\n  removeFocusStyle() {\n    if (this.wrapperEl) {\n      this.wrapperEl.classList.remove(\"focus\");\n    }\n  }\n\n  handleBlur() {\n    this.removeFocusStyle();\n    if (this.previousBlurredValue !== this.value) {\n      this.wmSearchValueChanged.emit({ value: this.value });\n    }\n    this.previousBlurredValue = this.value;\n  }\n\n  /**\n   * Functions that return elements specifically for search-and-find.\n   */\n  renderResultsAndBrowseButtons(): HTMLDivElement {\n    return (\n      <div class=\"wm-find-elements\">\n        <div id=\"results-display\" class=\"results\">\n          {this.resultCount}\n        </div>\n        <div class=\"wm-button-collection\">\n          <wm-button\n            button-type=\"icononly\"\n            icon=\"f05d\"\n            tooltip={intl.formatMessage({\n              id: \"global.previous\",\n              description: \"button text\",\n              defaultMessage: \"previous\",\n            })}\n            tooltip-position=\"bottom\"\n            onClick={() => this.changeHighlightedNum(this.highlightedNum - 1)}\n            disabled={this.disabled || this.numResults < 2}\n            label-for-identical-buttons={intl.formatMessage({\n              id: \"search.previousResult\",\n              defaultMessage: \"Press to hear previous matching result\",\n            })}\n          />\n          <wm-button\n            button-type=\"icononly\"\n            icon=\"f045\"\n            tooltip={intl.formatMessage({\n              id: \"global.next\",\n              description: \"button text\",\n              defaultMessage: \"next\",\n            })}\n            tooltip-position=\"bottom\"\n            onClick={() => this.changeHighlightedNum(this.highlightedNum + 1)}\n            disabled={this.disabled || this.numResults < 2}\n            label-for-identical-buttons={intl.formatMessage({\n              id: \"search.nextResult\",\n              defaultMessage: \"Press to hear next matching result\",\n            })}\n          />\n        </div>\n      </div>\n    );\n  }\n\n  renderJumpToLink(): HTMLAnchorElement | null {\n    if (this.numResults && this.highlightedId) {\n      return (\n        <a ref={(el) => (this.linkEl = el as HTMLAnchorElement)} href={`#${this.highlightedId}`} class=\"sr-only\">\n          {intl.formatMessage({\n            id: \"search.jumpToResult\",\n            defaultMessage: \"Jump to search result in list\",\n          })}\n        </a>\n      );\n    } else {\n      return null;\n    }\n  }\n  /**\n   * End search and find render helpers\n   */\n\n  render() {\n    return (\n      <Host>\n        <div\n          id=\"wm-search-wrapper\"\n          class={`wm-search-wrapper ${this.searchType}`}\n          ref={(el) => (this.wrapperEl = el as HTMLDivElement)}\n        >\n          <input\n            disabled={this.disabled}\n            id=\"wm-search-input\"\n            placeholder={this.placeholder}\n            aria-label={`${this.label ? this.label + \". \" : \"\"}${intl.formatMessage({\n              id: \"search.typeToFilterResults\",\n              defaultMessage: \"Type to filter the results\",\n            })}`}\n            onInput={(ev: Event) => this.updateValue((ev.target as HTMLInputElement).value)}\n            onFocus={() => this.addFocusStyle()}\n            onBlur={() => this.handleBlur()}\n            aria-autocomplete=\"none\"\n            autocomplete=\"off\"\n            value={this.value}\n          />\n          <span class=\"mdi search-icon\">{String.fromCodePoint(parseInt(`0xf349`))}</span>\n          {this.searchType === \"find\" && this.renderResultsAndBrowseButtons()}\n          <div\n            id=\"wm-search-live\"\n            class=\"sr-only\"\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n            ref={(el) => (this.resultsLiveRegion = el as HTMLElement)}\n          >\n            {this.announcement}\n          </div>\n        </div>\n        {this.searchType === \"find\" && this.renderJumpToLink()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-a3b9c87d.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmTagInputCss","TagInput","exports","this","uid","el","id","generateId","openUp","tooltipVisible","tagAreaInstructions","intl","formatMessage","defaultMessage","maxTagsReachedMessage","debouncedUpdate","debounce","forceUpdate","_this","row","column","csvToArray","selectedTags","options","Object","defineProperty","class_1","prototype","shadowRoot","activeElement","Array","from","dropdownEl","querySelectorAll","tagAreaEl","tagEls","filter","tag","classList","contains","wmRowEls","colValues","col1","col2","col3","col4","join","toLowerCase","inputEl","value","includes","list","tagInputType","tagsList","forEach","correspondingRowEl","locked","push","maxTags","length","description","inputElStyles","getComputedStyle","tagElStyles","inputElBuffer","paddingLeft","paddingRight","marginLeft","marginRight","reduce","prev","curr","parseInt","replace","minimumWidth","Math","max","measureText","placeholder","width","generateTagAddedMessage","tagName","generateTagAlreadyAddedMessage","generateTagCounterMessage","x","y","generateCharacterLimitLabel","characterLimit","limit","componentWillLoad","createPlaceholderDefault","addNew","label","console","error","consolidateSelectedTags","focus","firstFocusableTag","nonLockedTagEls","focusTag","resizeObserver","ResizeObserver","observe","componentDidLoad","remove","componentDidRender","positionInput","includesCaseInsensitive","optionsList","concat","hasOptions","addAndSearchPlaceholder","searchPlaceholder","addPlaceholder","reflectSelectedTags","newValue","oldValue","isAddition","changedTag","val","map","querySelector","listToCSV","detail","tagChanged","wmTagInputChanged","emit","handleRowUpdate","closeIfNotElOrChild","ev","isntElOrChild","target","isExpanded","closeDropdown","dismissTooltip","hideTooltip","handleInputKeyDown","test","key","announceCharacterLimitWarning","stopPropagation","preventDefault","handleInputEnter","handleInputArrowDown","handleInputArrowUp","tablePosition","moveLeftCell","moveRightCell","handleInputBackspace","handleInputFocus","openDropdown","clearListItemFocus","handleInputChanged","charCount","clearCellFocus","announceExistingOptions","focusedListItem","handleListItemClick","submitInput","trim","handleTableRowClick","localRowEls","canAddNew","hasNonWhiteSpaceCharacters","match","addTag","addOption","resetInput","moveDownRow","moveDownListItem","moveUpRow","moveUpListItem","window","requestAnimationFrame","nonLockedTagsList","handleListItemKeyDown","typedEvTarget","click","focusedElement","item","dataset","option","announce","rowId","referencedRow","isLocked","removeTag","tagLimitReached","handleTagAreaKeyDown","moveLeftTag","moveRightTag","handleTagAreaDelete","focusedTag","handleBlur","component","relatedTarget","fieldWrapperEl","handleCellMouseEnter","cell","contentWrapper","isTruncated","scrollWidth","clientWidth","showTooltip","innerText","handleTagAreaFocus","handleRemoveButtonClick","listItemEls","firstListItem","focusListItem","nextElementSibling","lastListItem","previousElementSibling","filteredRows","rowToFocus","focusCell","numCols","colHeaders","lastTag","firstTag","newOptionsList","optionAlreadyExists","removeOption","filterCaseInsensitive","newTagsList","tagAlreadyAdded","tagExistsAsOption","textToAnnounce","tagRemovedMessage","devOptionsList","setAttribute","scrollIntoView","block","element","position","rowCells","cellToFocus","add","clearTagFocus","resetPosition","shouldOpenUp","clientHeight","message","liveRegionEl","textContent","liveRegionMessage","numResults","optionEls","existingOptionsMessage","num","charLimit","charactersEnteredMessage","characterLimitReachedMessage","style","spaceAvailable","getBoundingClientRect","right","inputMinimumWidth","top","offsetTop","toString","lowercaseList","str","sortCaseInsensitive","sort","a","b","renderTags","lockedTags","unlockedTags","idx","tagText","targetList","h","class","role","tabIndex","onClick","__spreadArray","renderDropdown","ref","renderHelpText","tabindex","renderAddNewButton","renderListItems","isFocused","isSelected","onKeyDown","onBlur","helpTextHasOptions","helpTextEditable","helpText","renderTagCounter","renderTable","onScroll","colWidths","renderTableHeaders","renderTableRows","noResultsMessage","header","overflowRule","colWrap","renderTableCells","localId","onMouseEnter","onMouseLeave","render","Host","labelPosition","htmlFor","onFocus","autocomplete","maxLength","undefined","onInput","info"],"sources":["src/components/wm-tag-input/wm-tag-input.scss?tag=wm-tag-input&encapsulation=shadow","src/components/wm-tag-input/wm-tag-input.tsx"],"sourcesContent":[":host,\nwm-tag-input {\n  font-family: inherit;\n  width: 100%;\n  display: block;\n\n  * {\n    box-sizing: border-box;\n    font-size: 14px;\n  }\n\n  @include label;\n\n  .wrapper {\n    width: 100%;\n    height: 100%;\n    position: relative;\n  }\n\n  .field-wrapper {\n    position: relative;\n    width: 100%;\n    border: 1px solid $input-border-color;\n    @include border-radius(3px);\n\n    &.focused {\n      @include field-focus;\n    }\n  }\n\n  .character-count {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: rem-calc(80);\n    background-color: rgba(74, 74, 74, 0.05);\n    font-size: rem-calc(14);\n    font-weight: 500;\n    align-self: stretch;\n  }\n\n  .tags-and-input-wrapper {\n    position: relative;\n    width: 100%;\n    padding: rem-calc(8) rem-calc(4) rem-calc(8) 0;\n    margin-bottom: rem-calc(-8);\n  }\n\n  .upper-row {\n    width: 100%;\n    display: flex;\n    flex: 1;\n    justify-content: space-between;\n    &:before {\n      align-self: flex-start;\n      @include mdi-icon;\n      content: \"\\f349\"; // magnifying glass\n      color: $tag-input-search-icon-color;\n      padding: rem-calc(12) rem-calc(8) rem-calc(12) rem-calc(12);\n    }\n  }\n\n  .lower-row {\n    width: 100%;\n    min-height: rem-calc(30);\n  }\n\n  #max-tags {\n    display: flex;\n    align-items: center;\n    min-height: rem-calc(30);\n    background-color: $tag-input-max-tags-bg;\n    padding: rem-calc(8) rem-calc(16);\n    color: $tag-input-max-tags-color;\n    font-size: rem-calc(14);\n    border-top: 1px solid $tag-input-max-tags-border;\n    border-radius: 0 0 3px 3px;\n  }\n\n  .tag-area {\n    display: flex;\n    flex-wrap: wrap;\n    margin: 0;\n    padding: 0;\n\n    &:focus {\n      outline: none;\n    }\n\n    [role=\"option\"] {\n      display: inline-flex;\n      align-items: center;\n      height: rem-calc(28);\n      list-style: none;\n      color: $charcoal;\n      background-color: rgba(3, 0, 0, 0.1);\n      padding: rem-calc(8) rem-calc(10);\n      margin-bottom: rem-calc(8);\n      margin-right: rem-calc(4);\n      margin-left: rem-calc(4);\n      transition: background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n      white-space: pre;\n\n      &.highlight {\n        animation: fadeIn 1s;\n        @keyframes fadeIn {\n          0% {\n            background-color: rgba(3, 0, 0, 0.1);\n          }\n          50% {\n            background-color: #c8dfcc;\n          }\n\n          100% {\n            background-color: rgba(3, 0, 0, 0.1);\n          }\n        }\n      }\n\n      &.focused {\n        background-color: #d1d1d1;\n      }\n\n      &.locked {\n        background-color: $tag-input-locked-tag-bg;\n        color: white;\n      }\n\n      .icon {\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        height: rem-calc(20);\n        width: rem-calc(20);\n        padding: 0;\n        margin-left: rem-calc(8);\n        &.remove-btn {\n          border: 1px solid $periwinkle;\n          color: $periwinkle;\n          border-radius: 50%;\n          cursor: pointer;\n          transition: background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1);\n\n          &:hover {\n            color: white;\n            background-color: $periwinkle;\n          }\n\n          &:before {\n            @include mdi-icon;\n            content: \"\\f156\";\n          }\n        }\n\n        &.lock {\n          color: white;\n          &:before {\n            @include mdi-icon;\n            content: \"\\f341\";\n          }\n        }\n      }\n    }\n  }\n\n  input {\n    font-family: inherit;\n    border: none;\n    height: rem-calc(28);\n    padding: 0;\n    margin-bottom: rem-calc(8);\n    margin-right: rem-calc(4);\n    padding-left: rem-calc(8);\n    right: 0px;\n\n    &.hidden {\n      display: none;\n    }\n    &:focus {\n      outline: none;\n    }\n  }\n\n  .dropdown-wrapper {\n    margin: 0;\n    padding: 0;\n    @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\n    @include transition(transform 0.25s ease);\n    @include scale($xVal: 1, $yVal: 0);\n    @include transformOrigin(center top);\n    @include border-radius(3px);\n    position: absolute;\n    top: calc(100% + 2px);\n    right: 0;\n    background: #fff;\n    z-index: 100;\n    width: 100%;\n    font-size: rem-calc(14);\n\n    .dropdown {\n      -webkit-overflow-scrolling: touch;\n      overflow: auto;\n      max-height: rem-calc(200);\n      margin: 0;\n      padding: 0;\n    }\n\n    &.open {\n      @include scale($xVal: 1, $yVal: 1);\n    }\n\n    &.upwards {\n      top: unset;\n      bottom: calc(100% + 2px);\n      @include transformOrigin(center bottom);\n    }\n\n    li,\n    div {\n      display: flex;\n      align-items: center;\n      padding: 0 rem-calc(16);\n      background: #fff;\n      list-style: none;\n      height: rem-calc(43);\n      white-space: pre;\n\n      &[role=\"option\"],\n      &.add-new-btn {\n        cursor: pointer;\n        color: $periwinkle;\n        font-weight: bold;\n        width: 100%;\n        border: none;\n\n        &[aria-selected=\"true\"] {\n          color: $gray;\n          font-style: italic;\n          font-weight: normal;\n          cursor: unset;\n        }\n        &:hover:not([aria-selected=\"true\"]),\n        &.focused {\n          outline: none;\n          background: $background;\n        }\n      }\n\n      &.help-text {\n        color: $charcoal;\n        min-height: rem-calc(43);\n        padding-top: rem-calc(4);\n        padding-bottom: rem-calc(4);\n        white-space: normal;\n      }\n\n      &:not(:last-child) {\n        border-bottom: 2px solid rgba(#2e1b46, 0.05);\n      }\n    }\n  }\n\n  .info-text {\n    font-style: italic;\n    margin-top: rem-calc(4);\n  }\n\n  .table-wrapper {\n    min-height: rem-calc(160);\n    overflow: auto;\n    margin-top: rem-calc(24);\n\n    #table {\n      width: 100%;\n      border-spacing: 0px;\n      &.fixed-widths {\n        table-layout: fixed;\n      }\n\n      .headers {\n        height: rem-calc(40);\n        background-color: #eeedf4;\n        th {\n          text-align: left;\n          font-size: rem-calc(12);\n          font-weight: 700;\n          text-transform: uppercase;\n          padding: 0 rem-calc(24);\n        }\n      }\n    }\n\n    tr {\n      // the following colors are in a css-specificity order, do not move\n      &:nth-child(even) {\n        background-color: $tag-input-row-zebra-bg;\n      }\n\n      &.selected {\n        background-color: $tag-input-row-selected-bg;\n        // box-shadow to add border without affecting surrounding cell borders\n        box-shadow: inset 0 0 0 1px $tag-input-row-selected-border;\n        font-weight: 500;\n      }\n\n      &.focused:not(.locked),\n      &:hover:not(.locked) {\n        background-color: $tag-input-row-focused;\n        box-shadow: none;\n      }\n\n      &.locked {\n        td {\n          cursor: auto;\n        }\n\n        td:first-child {\n          .cell-content-wrapper:before {\n            @include mdi-icon;\n            content: \"\\f33e\";\n            margin-right: rem-calc(8);\n            color: $tag-input-row-lock-color;\n          }\n        }\n      }\n    }\n\n    td {\n      height: rem-calc(60);\n      vertical-align: middle;\n      padding: 0 rem-calc(24);\n      cursor: pointer;\n      &.focused {\n        // from wm-navigation\n        box-shadow: inset 0 2px 2px 0 rgb(244 243 246 / 20%), inset 0 2px 2px 0 rgb(0 0 0 / 10%),\n          inset 0 0 4px 3px #61279e;\n      }\n      .cell-content-wrapper.trunc {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      .description {\n        display: none;\n      }\n    }\n  }\n\n  .no-results {\n    padding: rem-calc(20) rem-calc(24);\n  }\n\n  .sr-only {\n    @include srOnly;\n  }\n}\n","import {\n  h,\n  Component,\n  Host,\n  Element,\n  Prop,\n  Listen,\n  State,\n  Event,\n  EventEmitter,\n  Watch,\n  forceUpdate,\n} from \"@stencil/core\";\nimport {\n  csvToArray,\n  debounce,\n  generateId,\n  hideTooltip,\n  intl,\n  measureText,\n  shouldOpenUp,\n  showTooltip,\n} from \"../../global/functions\";\n\ninterface TablePosition {\n  row: number;\n  column: number;\n}\n\n@Component({\n  tag: \"wm-tag-input\",\n  styleUrl: \"wm-tag-input.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class TagInput {\n  @Element() el!: HTMLWmTagInputElement;\n  private inputEl!: HTMLInputElement;\n  private dropdownEl!: HTMLDivElement;\n  private tagAreaEl!: HTMLUListElement;\n  private liveRegionEl!: HTMLDivElement;\n  private fieldWrapperEl!: HTMLDivElement;\n\n  @Prop() label!: string;\n  @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\n  @Prop({ mutable: true }) options: string = \"\"; // csv\n  @Prop({ reflect: true, mutable: true }) selectedTags: string = \"\"; // csv\n  @Prop() info?: string;\n  @Prop() addNew: boolean = true;\n  @Prop({ mutable: true }) placeholder?: string;\n  @Prop() characterLimit: number = 50;\n  @Prop() maxTags?: number;\n  @Prop() tagInputType: \"dropdown\" | \"table\" = \"dropdown\";\n  @Prop() colHeaders!: string;\n  @Prop() colWidths?: string;\n  @Prop() colWrap?: string;\n  @Event() wmTagInputChanged!: EventEmitter<{\n    value: string[] | HTMLWmTagInputRowElement[];\n    tagChanged: string | HTMLWmTagInputRowElement;\n  }>;\n\n  private uid: string = this.el.id ? this.el.id : generateId();\n  private openUp: boolean = false;\n  private tooltipVisible: boolean = false;\n  @State() focusedListItem!: HTMLLIElement | null;\n  @State() focusedTag: HTMLLIElement | null = null;\n  @State() tablePosition: TablePosition = { row: 0, column: 1 };\n  @State() isExpanded: boolean = false;\n  @State() tagsList: string[] = csvToArray(this.selectedTags);\n  @State() optionsList: string[] = csvToArray(this.options);\n  @State() charCount: number = 0;\n  @State() liveRegionMessage = \"\";\n  private tagAreaInstructions = intl.formatMessage({\n    id: \"tagInput.tagAreaInstructions\",\n    defaultMessage: \"tag selection. Press Backspace or Delete to remove a tag.\",\n  });\n  private maxTagsReachedMessage = intl.formatMessage({\n    id: \"tagInput.maxTagsReached\",\n    defaultMessage: \"No more tags can be added because the limit has been reached.\",\n  });\n\n  get focusedElement(): Element | null {\n    return this.el.shadowRoot!.activeElement;\n  }\n  get listItemEls(): HTMLLIElement[] {\n    return Array.from(this.dropdownEl.querySelectorAll(\"li\"));\n  }\n  get tagEls(): HTMLLIElement[] {\n    return this.tagAreaEl ? Array.from(this.tagAreaEl.querySelectorAll(\".tag\")) : [];\n  }\n  get nonLockedTagEls(): HTMLLIElement[] {\n    return this.tagEls.filter((tag) => !tag.classList.contains(\"locked\"));\n  }\n  get optionEls(): HTMLLIElement[] {\n    return Array.from(this.dropdownEl.querySelectorAll(\".option\"));\n  }\n  get wmRowEls(): HTMLWmTagInputRowElement[] {\n    return Array.from(this.el.querySelectorAll(\"wm-tag-input-row\"));\n  }\n  get localRowEls(): HTMLElement[] {\n    return Array.from(this.el.shadowRoot!.querySelectorAll(\"tr\"));\n  }\n  get filteredRows(): HTMLWmTagInputRowElement[] {\n    return this.wmRowEls.filter((row) => {\n      const colValues = [row.col1, row.col2, row.col3, row.col4].join(\"\").toLowerCase();\n      return this.inputEl && this.inputEl.value ? colValues.includes(this.inputEl.value.toLowerCase()) : true;\n    });\n  }\n  get nonLockedTagsList() {\n    let list: string[] = [];\n\n    if (this.tagInputType === \"table\") {\n      this.tagsList.forEach((id) => {\n        const correspondingRowEl = this.wmRowEls.filter((row) => id === row.id)[0];\n        if (!correspondingRowEl.locked) {\n          list.push(id);\n        }\n      });\n    } else if (this.tagInputType === \"dropdown\") {\n      list = this.tagsList;\n    }\n\n    return list;\n  }\n  get tagLimitReached(): boolean {\n    return !!(this.maxTags && this.tagsList.length >= this.maxTags);\n  }\n\n  get noResultsMessage() {\n    return intl.formatMessage({\n      id: \"tagInput.noResults\",\n      defaultMessage: \"No results match your search.\",\n      description: \"Message displayed when a user's search returns empty.\",\n    });\n  }\n\n  get inputMinimumWidth(): number {\n    // 150px is the minimum width of the input field, or the length of the placeholder text\n    const inputElStyles = getComputedStyle(this.inputEl);\n    const tagElStyles = getComputedStyle(this.tagEls[this.tagEls.length - 1]);\n    const inputElBuffer = [\n      inputElStyles.paddingLeft,\n      inputElStyles.paddingRight,\n      inputElStyles.marginLeft,\n      inputElStyles.marginRight,\n      tagElStyles.marginRight,\n    ].reduce((prev, curr) => prev + parseInt(curr.replace(\"px\", \"\")), 0);\n\n    const minimumWidth = Math.max(150, measureText(this.inputEl, this.placeholder!).width + inputElBuffer);\n    return minimumWidth;\n  }\n\n  generateTagAddedMessage(tag: string): string {\n    return intl.formatMessage(\n      {\n        id: \"tagInput.tagAdded\",\n        defaultMessage: \"{tagName} added.\",\n        description: \"A confirmation for adding a tag.\",\n      },\n      { tagName: tag }\n    );\n  }\n\n  generateTagAlreadyAddedMessage(tag: string): string {\n    return intl.formatMessage(\n      {\n        id: \"tagInput.tagAlreadyAdded\",\n        defaultMessage: \"{tagName} has already been added.\",\n        description: \"An alert for adding a tag that is already present.\",\n      },\n      { tagName: tag }\n    );\n  }\n\n  generateTagCounterMessage(x: number, y: number) {\n    return intl.formatMessage(\n      {\n        id: \"tagInput.tagsAddedCounter\",\n        defaultMessage: \"Tags added: {x, number}/{y, number}\",\n        description: \"For the user to understand how close they are to the tag limit.\",\n      },\n      {\n        x: x,\n        y: y,\n      }\n    );\n  }\n\n  generateCharacterLimitLabel(characterLimit: number): string {\n    return intl.formatMessage(\n      {\n        id: \"global.characterLimit\",\n        defaultMessage: \"{limit, number} characters allowed.\",\n        description: \"for screen readers\",\n      },\n      { limit: characterLimit }\n    );\n  }\n\n  componentWillLoad() {\n    if (!this.placeholder) {\n      this.placeholder = this.createPlaceholderDefault(this.addNew, !!this.options);\n    }\n    if (!this.label) {\n      console.error(\"wm-tag-input must have a label property\");\n    }\n\n    this.consolidateSelectedTags();\n\n    this.el.focus = () => {\n      const firstFocusableTag = this.nonLockedTagEls[0];\n      if (firstFocusableTag) {\n        this.tagAreaEl.focus();\n        this.focusTag(firstFocusableTag);\n      } else {\n        this.inputEl.focus();\n      }\n    };\n\n    // on resize of component, trigger componentDidRender -> positionInput\n    const resizeObserver = new ResizeObserver(() => this.debouncedUpdate());\n    resizeObserver.observe(this.el);\n  }\n\n  componentDidLoad() {\n    // prevent highlighting of pre-selected tags\n    this.tagEls.forEach((el) => el.classList.remove(\"highlight\"));\n  }\n\n  componentDidRender() {\n    this.positionInput();\n  }\n\n  consolidateSelectedTags() {\n    this.tagsList.forEach((tag) => {\n      if (!this.includesCaseInsensitive(this.optionsList, tag)) {\n        this.options += `${this.options.length > 0 ? \",\" : \"\"}${tag}`;\n      }\n    });\n\n    this.optionsList = csvToArray(this.options);\n  }\n\n  createPlaceholderDefault(addNew: boolean, hasOptions: boolean): string {\n    const addAndSearchPlaceholder = intl.formatMessage({\n      id: \"tagInput.placeholderAddAndSearch\",\n      defaultMessage: \"Add or search for a tag\",\n      description: \"Placeholder text. Use imperative\",\n    });\n    const searchPlaceholder = intl.formatMessage({\n      id: \"tagInput.placeholderSearch\",\n      defaultMessage: \"Search and select a tag\",\n      description: \"Placeholder text. Use imperative\",\n    });\n    const addPlaceholder = intl.formatMessage({\n      id: \"tagInput.placeholderAdd\",\n      defaultMessage: \"Add a new tag\",\n      description: \"Placeholder text. Use imperative\",\n    });\n\n    let placeholder = \"\";\n    if (addNew && hasOptions) {\n      placeholder = addAndSearchPlaceholder;\n    } else if (!addNew && hasOptions) {\n      placeholder = searchPlaceholder;\n    } else if (addNew) {\n      placeholder = addPlaceholder;\n    }\n    return placeholder;\n  }\n\n  @Watch(\"tagsList\")\n  reflectSelectedTags(newValue: string[], oldValue: string[]) {\n    const isAddition = newValue.length > oldValue.length;\n    let changedTag: string | HTMLWmTagInputRowElement = \"\";\n    let selectedTags: string[] | HTMLWmTagInputRowElement[] = this.tagsList;\n\n    if (isAddition) {\n      changedTag = newValue.filter((val) => !oldValue.includes(val))[0];\n    } else {\n      changedTag = oldValue.filter((val) => !newValue.includes(val))[0];\n    }\n\n    // event emitted by type table uses element references instead of strings\n    if (this.tagInputType === \"table\") {\n      changedTag = this.wmRowEls.filter((row) => row.id === changedTag)[0];\n      selectedTags = this.tagsList.map((id) => this.el.querySelector(`#${id}`) as HTMLWmTagInputRowElement);\n    }\n\n    this.selectedTags = this.listToCSV(this.tagsList);\n    let detail = { value: selectedTags, tagChanged: changedTag };\n    this.wmTagInputChanged.emit(detail);\n  }\n\n  @Listen(\"wmTagInputRowUpdated\")\n  handleRowUpdate() {\n    forceUpdate(this.el);\n  }\n\n  @Listen(\"click\", { target: \"document\" })\n  closeIfNotElOrChild(ev: MouseEvent): void {\n    const isntElOrChild = ev.target !== this.el && !this.el.shadowRoot!.contains(ev.target as HTMLElement);\n\n    if (this.tagInputType === \"dropdown\" && isntElOrChild && this.isExpanded) {\n      this.closeDropdown();\n    }\n  }\n\n  // From wm-button\n  // we need to listen for scroll events during the capture phase because they do not bubble up\n  // there can be layouts where the main content has 100vh and overflows\n  // in these cases window will register no scroll events unless we catch on they way down\n  @Listen(\"scroll\", { target: \"window\", capture: true })\n  dismissTooltip() {\n    if (this.tooltipVisible) {\n      hideTooltip();\n      this.tooltipVisible = false;\n    }\n  }\n\n  debouncedUpdate = debounce(() => forceUpdate(this.el), 30);\n\n  handleInputKeyDown(ev: KeyboardEvent) {\n    if (/^.$/.test(ev.key) && this.inputEl.value.length >= this.characterLimit) {\n      this.announceCharacterLimitWarning(this.inputEl.value.length, this.characterLimit);\n    }\n\n    // prevent keydown triggering on tag area\n    ev.stopPropagation();\n    switch (ev.key) {\n      case \"Enter\":\n      case \",\":\n        ev.preventDefault();\n        this.handleInputEnter();\n        break;\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.handleInputArrowDown();\n        break;\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.handleInputArrowUp();\n        break;\n      case \"ArrowLeft\":\n        ev.preventDefault();\n        if (this.tagInputType === \"table\" && this.tablePosition.row) {\n          this.moveLeftCell();\n        }\n        break;\n      case \"ArrowRight\":\n        ev.preventDefault();\n        if (this.tagInputType === \"table\" && this.tablePosition.row) {\n          this.moveRightCell();\n        }\n        break;\n      case \"Escape\":\n        if (this.tagInputType === \"dropdown\" && this.isExpanded) {\n          this.closeDropdown();\n        }\n        break;\n      case \"ArrowLeft\":\n      case \"Backspace\":\n        this.handleInputBackspace();\n        break;\n    }\n  }\n\n  handleInputFocus() {\n    if (this.tagInputType === \"dropdown\") {\n      this.openDropdown();\n      this.clearListItemFocus();\n    }\n    // force update needed to apply styled state of field-wrapper el\n    forceUpdate(this.el);\n  }\n\n  handleInputChanged(value: string) {\n    this.charCount = value.length;\n\n    if (this.tagInputType === \"dropdown\") {\n      this.clearListItemFocus();\n      if (this.charCount >= this.characterLimit - 5) {\n        this.announceCharacterLimitWarning(this.charCount, this.characterLimit);\n      }\n      if (!this.isExpanded) {\n        this.openDropdown();\n      }\n    } else if (this.tagInputType === \"table\") {\n      this.clearCellFocus();\n    }\n    this.announceExistingOptions();\n  }\n\n  handleInputEnter() {\n    if (this.tagInputType === \"dropdown\") {\n      if (this.focusedListItem) {\n        this.handleListItemClick(this.focusedListItem);\n      } else {\n        this.submitInput(this.addNew, this.inputEl.value.trim());\n      }\n    } else if (this.tagInputType === \"table\" && this.tablePosition.row > 0) {\n      this.handleTableRowClick(this.localRowEls[this.tablePosition.row].id);\n    }\n  }\n\n  submitInput(canAddNew: boolean, value: string) {\n    const hasNonWhiteSpaceCharacters = value.match(/\\S/);\n    if (canAddNew && hasNonWhiteSpaceCharacters) {\n      this.addTag(value);\n      this.optionsList = this.addOption(value);\n      this.resetInput();\n    }\n  }\n\n  handleInputArrowDown() {\n    if (this.tagInputType === \"table\") {\n      this.moveDownRow();\n    } else if (this.tagInputType === \"dropdown\" && this.isExpanded) {\n      this.moveDownListItem();\n    } else if (this.tagInputType === \"dropdown\") {\n      this.openDropdown();\n    }\n  }\n\n  handleInputArrowUp() {\n    if (this.tagInputType === \"table\") {\n      this.moveUpRow();\n    } else if (this.tagInputType === \"dropdown\" && this.isExpanded) {\n      this.moveUpListItem();\n    } else if (this.tagInputType === \"dropdown\") {\n      this.openDropdown();\n    }\n  }\n\n  handleInputBackspace() {\n    if (this.inputEl.value === \"\" && this.tagsList.length > 0) {\n      // wait for events to finish firing before redirecting focus\n      // prevents double input in input area and tag area\n      window.requestAnimationFrame(() => {\n        if (this.nonLockedTagsList.length > 0) {\n          this.tagAreaEl.focus();\n          this.focusTag(this.tagEls[this.tagEls.length - 1]);\n        }\n      });\n    }\n  }\n\n  handleListItemKeyDown(ev: KeyboardEvent) {\n    const typedEvTarget = ev.target as HTMLElement;\n\n    switch (ev.key) {\n      case \"Enter\":\n      case \" \":\n        ev.preventDefault();\n        typedEvTarget.click();\n        break;\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.moveDownListItem();\n        break;\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.moveUpListItem();\n        break;\n      case \"Escape\":\n        if (this.focusedElement !== this.inputEl) {\n          this.inputEl.focus();\n        } else if (this.tagInputType === \"dropdown\") {\n          this.closeDropdown();\n        }\n        break;\n    }\n  }\n\n  handleListItemClick(item: HTMLElement) {\n    const tag = item.dataset.option!.trim() || \"\";\n\n    if (this.includesCaseInsensitive(this.tagsList, tag)) {\n      this.announce(this.generateTagAlreadyAddedMessage(tag));\n    } else {\n      this.resetInput();\n      this.addTag(tag);\n      this.optionsList = this.addOption(tag);\n      this.focusedListItem = null;\n    }\n  }\n\n  handleTableRowClick(rowId: string) {\n    const referencedRow = this.el.querySelector(`#${rowId}`) as HTMLWmTagInputRowElement;\n    const isLocked = referencedRow.locked;\n\n    if (!isLocked) {\n      if (this.includesCaseInsensitive(this.tagsList, rowId)) {\n        this.removeTag(rowId);\n      } else if (!this.tagLimitReached) {\n        this.addTag(rowId);\n        this.resetInput();\n      }\n    }\n  }\n\n  handleTagAreaKeyDown(ev: KeyboardEvent) {\n    switch (ev.key) {\n      case \"ArrowLeft\":\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.moveLeftTag();\n        break;\n      case \"ArrowRight\":\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.moveRightTag();\n        break;\n      case \"Backspace\":\n      case \"Delete\":\n        this.handleTagAreaDelete();\n        break;\n    }\n  }\n\n  handleTagAreaDelete() {\n    const isLocked = this.focusedTag && this.focusedTag.classList.contains(\"locked\");\n\n    if (this.focusedTag && this.focusedTag.dataset.tag && !isLocked) {\n      this.removeTag(this.focusedTag.dataset.tag);\n\n      if (this.nonLockedTagsList.length === 0) {\n        // focus input if no tags are left\n        this.inputEl.focus();\n      } else if (this.focusedTag === this.tagEls[this.tagEls.length - 1]) {\n        // reassign focus if removing the last tag but there are still tags remaining\n        this.focusedTag = this.tagEls[this.tagEls.length - 2];\n        this.focusTag(this.focusedTag);\n      }\n    }\n  }\n\n  handleBlur(ev: FocusEvent, component: HTMLElement) {\n    const isntElOrChild =\n      ev.relatedTarget !== component && !this.el.shadowRoot!.contains(ev.relatedTarget as HTMLElement);\n\n    this.dismissTooltip();\n    this.clearCellFocus();\n\n    if (isntElOrChild) {\n      this.fieldWrapperEl.classList.remove(\"focused\");\n      if (this.tagInputType === \"dropdown\") {\n        this.closeDropdown();\n      }\n    }\n  }\n\n  handleCellMouseEnter(ev: MouseEvent) {\n    const cell = ev.target as HTMLElement;\n    const contentWrapper = cell.querySelector(\".cell-content-wrapper\")!;\n    const isTruncated = contentWrapper.scrollWidth > contentWrapper.clientWidth;\n\n    if (isTruncated) {\n      // innerText is necessary vs textContent, as innerText ignores sr-only / display: none text\n      showTooltip(\"bottom\", cell, cell.innerText!);\n      this.tooltipVisible = true;\n    }\n  }\n\n  handleTagAreaFocus() {\n    if (this.tagInputType === \"dropdown\") {\n      this.closeDropdown();\n    }\n\n    const firstFocusableTag = this.nonLockedTagEls[0];\n    firstFocusableTag && this.focusTag(firstFocusableTag);\n  }\n\n  handleRemoveButtonClick(tag: string) {\n    this.moveLeftTag();\n    this.removeTag(tag);\n  }\n\n  moveDownListItem() {\n    if (this.listItemEls.length > 0) {\n      const firstListItem = this.listItemEls[0];\n\n      if (!this.focusedListItem) {\n        this.focusListItem(firstListItem);\n      } else if (this.focusedListItem.nextElementSibling) {\n        this.focusListItem(this.focusedListItem.nextElementSibling as HTMLLIElement);\n      } else {\n        this.focusListItem(firstListItem);\n      }\n    }\n  }\n\n  moveUpListItem() {\n    if (this.listItemEls.length > 0) {\n      const lastListItem = this.listItemEls[this.listItemEls.length - 1];\n\n      if (!this.focusedListItem) {\n        this.focusListItem(lastListItem);\n      } else if (this.focusedListItem.previousElementSibling) {\n        this.focusListItem(this.focusedListItem.previousElementSibling as HTMLLIElement);\n      } else {\n        this.clearListItemFocus();\n      }\n    }\n  }\n\n  moveDownRow() {\n    if (this.filteredRows.length > 0) {\n      if (this.tablePosition.row === 0) {\n        this.tablePosition.row = 1;\n      } else if (this.tablePosition.row === this.filteredRows.length) {\n        this.tablePosition.row = 1;\n      } else {\n        this.tablePosition.row++;\n      }\n\n      // skip locked rows\n      const rowToFocus = this.wmRowEls[this.tablePosition.row - 1] as HTMLWmTagInputRowElement;\n      if (rowToFocus.locked) {\n        this.moveDownRow();\n      } else {\n        this.focusCell(this.tablePosition);\n      }\n    }\n  }\n\n  moveUpRow() {\n    if (this.filteredRows.length > 0) {\n      if (this.tablePosition.row === 0) {\n        this.tablePosition.row = this.filteredRows.length;\n      } else if (this.tablePosition.row === 1) {\n        this.tablePosition.row = 0;\n      } else {\n        this.tablePosition.row--;\n      }\n\n      // skip locked rows\n      const rowToFocus = this.wmRowEls[this.tablePosition.row - 1] as HTMLWmTagInputRowElement;\n      if (rowToFocus && rowToFocus.locked) {\n        this.moveUpRow();\n      } else if (rowToFocus) {\n        this.focusCell(this.tablePosition);\n      } else {\n        this.clearCellFocus();\n      }\n    }\n  }\n\n  moveLeftCell() {\n    if (this.tablePosition.column != 1) {\n      this.tablePosition.column--;\n      this.focusCell(this.tablePosition);\n    }\n  }\n\n  moveRightCell() {\n    const numCols = csvToArray(this.colHeaders).length;\n\n    if (this.tablePosition.column < numCols) {\n      this.tablePosition.column++;\n      this.focusCell(this.tablePosition);\n    }\n  }\n\n  moveLeftTag() {\n    const lastTag = this.tagEls[this.tagEls.length - 1];\n    if (this.focusedTag && this.tagEls.includes(this.focusedTag.previousElementSibling as HTMLLIElement)) {\n      this.focusedTag = this.focusedTag.previousElementSibling as HTMLLIElement;\n    } else {\n      this.focusedTag = lastTag;\n    }\n    // skip locked tags\n    if (this.focusedTag.classList.contains(\"locked\") && this.nonLockedTagEls.length > 0) {\n      this.moveLeftTag();\n    } else {\n      this.focusTag(this.focusedTag);\n    }\n  }\n\n  moveRightTag() {\n    const firstTag = this.tagEls[0];\n    if (this.focusedTag && this.tagEls.includes(this.focusedTag.nextElementSibling as HTMLLIElement)) {\n      this.focusedTag = this.focusedTag.nextElementSibling as HTMLLIElement;\n    } else {\n      this.focusedTag = firstTag;\n    }\n    // skip locked tags\n    if (this.focusedTag.classList.contains(\"locked\")) {\n      this.moveRightTag();\n    } else {\n      this.focusTag(this.focusedTag);\n    }\n  }\n\n  addOption(option: string): string[] {\n    let newOptionsList = this.optionsList;\n    const optionAlreadyExists = this.includesCaseInsensitive(this.optionsList, option);\n    if (!optionAlreadyExists) {\n      newOptionsList = newOptionsList.concat(option);\n    }\n    return newOptionsList;\n  }\n\n  removeOption(option: string) {\n    this.optionsList = this.filterCaseInsensitive(this.optionsList, option);\n  }\n\n  addTag(tag: string): void {\n    let newTagsList = this.tagsList;\n    const tagAlreadyAdded = this.includesCaseInsensitive(this.tagsList, tag);\n    const tagExistsAsOption = this.optionsList.filter((x) => x.toLowerCase() === tag.toLowerCase())[0];\n\n    if (!tagAlreadyAdded) {\n      let textToAnnounce = tag;\n      if (this.tagInputType === \"table\") {\n        const referencedRow = this.el.querySelector(`#${tag}`) as HTMLWmTagInputRowElement;\n        textToAnnounce = referencedRow.col1!;\n      }\n      this.announce(this.generateTagAddedMessage(textToAnnounce));\n      this.tagsList = newTagsList.concat(tagExistsAsOption || tag);\n      // if maxTags has been reached, focus should go to the tagArea\n      if (this.tagLimitReached) {\n        this.tagAreaEl.focus();\n      }\n    }\n  }\n\n  removeTag(tag: string) {\n    let textToAnnounce = tag;\n    if (this.tagInputType === \"table\") {\n      const referencedRow = this.el.querySelector(`#${tag}`) as HTMLWmTagInputRowElement;\n      textToAnnounce = referencedRow.col1!;\n    }\n    const tagRemovedMessage = intl.formatMessage(\n      { id: \"tagInput.tagRemoved\", defaultMessage: \"{tag} removed\" },\n      { tag: textToAnnounce }\n    );\n    this.announce(tagRemovedMessage);\n    this.tagsList = this.filterCaseInsensitive(this.tagsList, tag);\n\n    if (this.tagInputType === \"dropdown\") {\n      // if a tag was introduced by the user, also remove it from the dropdown options\n      const devOptionsList = csvToArray(this.options);\n      if (this.includesCaseInsensitive(this.optionsList, tag) && !this.includesCaseInsensitive(devOptionsList, tag)) {\n        this.removeOption(tag);\n      }\n    }\n  }\n\n  focusListItem(item: HTMLLIElement): void {\n    this.focusedListItem = item;\n    this.inputEl.setAttribute(\"aria-activedescendant\", this.focusedListItem.id);\n    item.scrollIntoView({ block: \"nearest\" });\n  }\n\n  focusTag(element: HTMLLIElement): void {\n    if (element.classList.contains(\"locked\")) {\n      this.focusedTag = null;\n      this.tagAreaEl.setAttribute(\"aria-activedescendant\", \"\");\n    } else {\n      this.focusedTag = element;\n      this.tagAreaEl.setAttribute(\"aria-activedescendant\", this.focusedTag.id);\n    }\n  }\n\n  focusCell(position: TablePosition) {\n    this.clearCellFocus(false);\n\n    if (position.row) {\n      const rowToFocus = this.localRowEls[position.row];\n      const rowCells = rowToFocus.querySelectorAll(\"td\");\n      const cellToFocus = rowCells[position.column - 1];\n      const contentWrapper = cellToFocus.querySelector(\".cell-content-wrapper\")!;\n      const isTruncated = contentWrapper.scrollWidth > contentWrapper.clientWidth;\n\n      rowToFocus.classList.add(\"focused\");\n      cellToFocus.classList.add(\"focused\");\n      cellToFocus.scrollIntoView({ block: \"nearest\" });\n      this.inputEl.setAttribute(\"aria-activedescendant\", cellToFocus.id);\n\n      this.dismissTooltip();\n      if (isTruncated) {\n        // innerText is necessary vs textContent, as innerText ignores sr-only / display: none text\n        showTooltip(\"bottom\", cellToFocus, cellToFocus.innerText!);\n        this.tooltipVisible = true;\n      }\n    }\n  }\n\n  clearTagFocus() {\n    this.tagAreaEl.setAttribute(\"aria-activedescendant\", \"\");\n    this.focusedTag = null;\n  }\n\n  clearCellFocus(resetPosition: boolean = true) {\n    this.inputEl.setAttribute(\"aria-activedescendant\", \"\");\n    if (resetPosition) {\n      this.tablePosition = { row: 0, column: 1 };\n    }\n\n    this.localRowEls.forEach((row) => {\n      row.classList.remove(\"focused\");\n      row.querySelectorAll(\"td\").forEach((cell) => {\n        cell.classList.remove(\"focused\");\n      });\n    });\n  }\n\n  openDropdown() {\n    // given an offset of -2px because the dropdown is transformed downwards to avoid overlapping the focus border\n    this.openUp = shouldOpenUp(this.el, this.dropdownEl, this.el.clientHeight, -2);\n    this.isExpanded = true;\n  }\n\n  closeDropdown() {\n    this.clearListItemFocus();\n    this.isExpanded = false;\n  }\n\n  clearListItemFocus() {\n    this.focusedListItem = null;\n    this.inputEl.setAttribute(\"aria-activedescendant\", \"\");\n\n    this.listItemEls.forEach((el) => {\n      el.classList.remove(\"focused\");\n    });\n  }\n\n  resetInput() {\n    this.charCount = 0;\n    this.inputEl.value = \"\";\n  }\n\n  announce(message: string) {\n    // \\u00A0 is a non-breaking space character, which causes the message to be read as a new one\n    if (this.liveRegionEl.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.liveRegionMessage = message;\n  }\n\n  announceExistingOptions() {\n    // request animation frame to wait for re-rendering of filtered options\n    window.requestAnimationFrame(() => {\n      let numResults = 0;\n\n      if (this.tagInputType === \"dropdown\") {\n        numResults = this.optionEls.length;\n      } else if (this.tagInputType === \"table\") {\n        numResults = this.filteredRows.length;\n      }\n\n      const existingOptionsMessage = intl.formatMessage(\n        {\n          id: \"tagInput.existingOptions\",\n          defaultMessage: \"{num, plural, one {1 existing option.} other {# existing options.}}\",\n        },\n        { num: numResults }\n      );\n\n      this.announce(existingOptionsMessage);\n    });\n  }\n\n  announceCharacterLimitWarning(charCount: number, charLimit: number) {\n    const charactersEnteredMessage = intl.formatMessage(\n      {\n        id: \"global.charactersEntered\",\n        defaultMessage: \"{x, number} of {y, number} characters entered.\",\n        description: \"for screen readers\",\n      },\n      { x: charCount, y: charLimit }\n    );\n\n    const characterLimitReachedMessage = intl.formatMessage({\n      id: \"global.characterLimitReached\",\n      defaultMessage: \"No additional characters will be entered.\",\n      description: \"for screen readers\",\n    });\n\n    this.announce(`${charactersEnteredMessage}${charCount >= charLimit ? \" \" + characterLimitReachedMessage : \"\"}`);\n  }\n\n  positionInput() {\n    const lastTag = this.tagEls[this.tagEls.length - 1];\n    // default placement to fall back to when no tags are present, or not enough space is available\n    this.inputEl.style.position = \"static\";\n    this.inputEl.style.width = \"100%\";\n\n    if (lastTag) {\n      const spaceAvailable = this.tagAreaEl.getBoundingClientRect().right - lastTag.getBoundingClientRect().right;\n      if (spaceAvailable >= this.inputMinimumWidth) {\n        // because the input has right: 0px\n        // all thats needed to properly place it is setting position: absolute, top, and width\n        this.inputEl.style.position = \"absolute\";\n        this.inputEl.style.top = lastTag.offsetTop.toString() + \"px\";\n        this.inputEl.style.width =\n          (this.tagAreaEl.getBoundingClientRect().right - lastTag.getBoundingClientRect().right - 8).toString() + \"px\";\n      }\n    }\n  }\n\n  /// Helpers\n\n  listToCSV(list: string[]): string {\n    return list.join(\",\");\n  }\n\n  includesCaseInsensitive(list: string[], element: string): boolean {\n    const lowercaseList = list.map((str) => str.toLowerCase());\n    return lowercaseList.includes(element.toLowerCase());\n  }\n\n  filterCaseInsensitive(list: string[], element: string): string[] {\n    return list.filter((x) => x.toLowerCase() !== element.toLowerCase());\n  }\n\n  sortCaseInsensitive(list: string[]) {\n    // The vanilla .sort method places words that start with capital letters above others (ASCII order)\n    // so we need to pass in our own compare function to sort case-insensitive\n    return list.sort((a, b) => {\n      a = a.toLowerCase();\n      b = b.toLowerCase();\n      return a > b ? 1 : a < b ? -1 : 0;\n    });\n  }\n\n  /// Renders\n\n  renderTags() {\n    let lockedTags: HTMLLIElement[] = [];\n    let unlockedTags: HTMLLIElement[] = [];\n\n    this.tagsList.forEach((tag, idx) => {\n      const id = `tag${idx + 1}`;\n      let tagText = \"\";\n      let isLocked = false;\n\n      if (this.tagInputType === \"dropdown\") {\n        tagText = tag;\n      } else if (this.tagInputType === \"table\") {\n        // display table tags using col1 of the row with the same id\n        // if one can't be found, display as empty\n        const referencedRow = this.el.querySelector(`#${tag}`) as HTMLWmTagInputRowElement;\n        tagText = referencedRow ? referencedRow.col1! : \"\";\n        isLocked = referencedRow ? referencedRow.locked : false;\n      }\n\n      // make sure locked tags always appear in front of list\n      const targetList = isLocked ? lockedTags : unlockedTags;\n      targetList.push(\n        <li\n          id={id}\n          class={`tag highlight ${this.focusedTag && this.focusedTag.id === id ? \"focused\" : \"\"} ${\n            isLocked ? \"locked\" : \"\"\n          }`}\n          data-tag={tag}\n          role=\"option\"\n        >\n          {tagText}\n          {isLocked ? (\n            <div class=\"icon lock\"></div>\n          ) : (\n            <button class=\"icon remove-btn\" tabIndex={-1} onClick={() => this.handleRemoveButtonClick(tag)}></button>\n          )}\n        </li>\n      );\n    });\n\n    return [...lockedTags, ...unlockedTags];\n  }\n\n  renderDropdown() {\n    return (\n      <div\n        class={`dropdown-wrapper ${this.isExpanded ? \"open\" : \"\"} ${this.openUp ? \"upwards\" : \"\"}`}\n        ref={(el) => (this.dropdownEl = el as HTMLDivElement)}\n      >\n        <div id=\"help-text\" class=\"help-text\">\n          {this.renderHelpText()}\n        </div>\n        <ul\n          class=\"dropdown\"\n          id=\"dropdown\"\n          role=\"listbox\"\n          aria-multiselectable=\"true\"\n          aria-expanded={this.isExpanded ? \"true\" : false}\n          aria-label={this.label}\n          tabindex={-1}\n        >\n          {this.inputEl && this.renderAddNewButton()}\n          {this.renderListItems(this.optionsList)}\n        </ul>\n      </div>\n    );\n  }\n\n  renderListItems(optionsList: string[]) {\n    optionsList = this.sortCaseInsensitive(optionsList);\n\n    // filter by input\n    if (this.inputEl && this.inputEl.value) {\n      optionsList = this.optionsList.filter((option) =>\n        option.toLowerCase().includes(this.inputEl.value.toLowerCase())\n      );\n    }\n\n    return optionsList.map((option, idx) => {\n      const id = `option${idx + 1}`;\n      const isFocused = this.focusedListItem && this.focusedListItem.id === id;\n      const isSelected = this.includesCaseInsensitive(this.tagsList, option);\n\n      return (\n        <li\n          class={`option ${isFocused ? \"focused\" : \"\"}`}\n          role=\"option\"\n          id={id}\n          data-option={option}\n          aria-selected={isSelected ? \"true\" : \"false\"}\n          aria-disabled={isSelected ? \"true\" : \"false\"}\n          onKeyDown={(ev) => this.handleListItemKeyDown(ev)}\n          onBlur={(ev) => this.handleBlur(ev, this.el)}\n          onClick={(ev) => this.handleListItemClick(ev.target as HTMLElement)}\n        >\n          {option}\n        </li>\n      );\n    });\n  }\n\n  renderAddNewButton() {\n    const hasNonWhiteSpaceCharacters = this.inputEl.value.match(/\\S/);\n    const optionAlreadyExists = this.includesCaseInsensitive(this.optionsList, this.inputEl.value.trim());\n    if (this.addNew && hasNonWhiteSpaceCharacters && !optionAlreadyExists) {\n      const id = `add-new-btn`;\n      const isFocused = this.focusedListItem && this.focusedListItem.id === id;\n      return (\n        <li\n          role=\"option\"\n          class={`add-new-btn ${isFocused ? \"focused\" : \"\"}`}\n          id={id}\n          data-option={this.inputEl.value}\n          onKeyDown={(ev) => this.handleListItemKeyDown(ev)}\n          onBlur={(ev) => this.handleBlur(ev, this.el)}\n          onClick={(ev) => this.handleListItemClick(ev.target as HTMLElement)}\n          tabIndex={isFocused ? 0 : -1}\n        >\n          {`Add \"${this.inputEl.value.trim()}\"`}\n        </li>\n      );\n    } else return \"\";\n  }\n\n  renderHelpText() {\n    const helpTextHasOptions = intl.formatMessage({\n      id: \"tagInput.helpTextCanSelect\",\n      defaultMessage: \"Search and select a tag.\",\n      description: \"Placeholder text. Use imperative\",\n    });\n    const helpTextEditable = intl.formatMessage({\n      id: \"tagInput.helpTextEditable\",\n      defaultMessage: \"Press the Enter or Comma key to add a new tag.\",\n      description: \"Placeholder text. Use imperative\",\n    });\n\n    let helpText = \"\";\n\n    if (this.optionsList.length > 0) {\n      helpText += helpTextHasOptions;\n    }\n    if (this.addNew) {\n      helpText += \" \" + helpTextEditable;\n    }\n\n    return helpText;\n  }\n\n  renderTagCounter() {\n    if (this.maxTags) {\n      return (\n        <div class=\"lower-row\">\n          <div id=\"max-tags\">\n            {this.generateTagCounterMessage(this.tagsList.length, this.maxTags)}\n            {this.tagLimitReached && ` - ${this.maxTagsReachedMessage}`}\n          </div>\n        </div>\n      );\n    }\n  }\n\n  renderTable() {\n    return (\n      <div class=\"table-wrapper\" onScroll={() => this.dismissTooltip()}>\n        <table\n          id=\"table\"\n          role=\"grid\"\n          class={`${this.colWidths ? \"fixed-widths\" : \"\"}`}\n          aria-label={this.label}\n          aria-multiselectable=\"true\"\n        >\n          {this.renderTableHeaders()}\n          {this.filteredRows.length ? this.renderTableRows() : <div class=\"no-results\">{this.noResultsMessage}</div>}\n        </table>\n      </div>\n    );\n  }\n\n  renderTableHeaders() {\n    return (\n      <tr class=\"headers\" role=\"row\">\n        {csvToArray(this.colHeaders).map((header, idx) => {\n          let overflowRule = \"wrap\";\n          if (this.colWrap && csvToArray(this.colWrap)[idx]) {\n            overflowRule = csvToArray(this.colWrap)[idx];\n          }\n          return (\n            <th\n              class={`header-cell ${overflowRule}`}\n              role=\"columnheader\"\n              // @ts-ignore\n              width={this.colWidths ? csvToArray(this.colWidths)[idx] : \"\"}\n            >\n              {header}\n            </th>\n          );\n        })}\n      </tr>\n    );\n  }\n\n  renderTableRows() {\n    return this.filteredRows.map((row) => {\n      const isSelected: boolean = this.includesCaseInsensitive(this.tagsList, row.id);\n\n      return (\n        <tr\n          id={row.id}\n          class={`${row.locked ? \"locked\" : \"\"} ${isSelected ? \"selected\" : \"\"}`}\n          role=\"row\"\n          onClick={() => this.handleTableRowClick(row.id)}\n        >\n          {this.renderTableCells(row)}\n        </tr>\n      );\n    });\n  }\n\n  renderTableCells(row: HTMLWmTagInputRowElement) {\n    const colValues = [row.col1, row.col2, row.col3, row.col4].filter((val) => !!val);\n    const isSelected: boolean = this.includesCaseInsensitive(this.tagsList, row.id);\n\n    return colValues.map((val, idx) => {\n      const localId = `${row.id}-col${idx + 1}`;\n      let overflowRule = \"wrap\";\n      if (this.colWrap && csvToArray(this.colWrap)[idx]) {\n        overflowRule = csvToArray(this.colWrap)[idx];\n      }\n\n      return (\n        <td\n          id={localId}\n          role=\"gridcell\"\n          aria-describedby={`${localId}-description`}\n          aria-selected={isSelected.toString()}\n          onMouseEnter={(ev) => this.handleCellMouseEnter(ev)}\n          onMouseLeave={() => this.dismissTooltip()}\n        >\n          <div class={`cell-content-wrapper ${overflowRule}`}>{val}</div>\n          <div class=\"description\" id={`${localId}-description`}>\n            {row.locked ? \"locked\" : \"\"}\n          </div>\n        </td>\n      );\n    });\n  }\n\n  render() {\n    return (\n      <Host id={this.uid}>\n        <div class={`wrapper label-${this.labelPosition}`}>\n          <div class=\"label-wrapper\">\n            <label class=\"label\" htmlFor={`input${this.uid}`}>\n              {this.label}\n            </label>\n          </div>\n          <div\n            class={`field-wrapper ${this.focusedElement ? \"focused\" : \"\"}`}\n            ref={(el) => (this.fieldWrapperEl = el as HTMLDivElement)}\n          >\n            <div class=\"upper-row\">\n              <div class=\"tags-and-input-wrapper\">\n                {this.tagsList.length > 0 && (\n                  <ul\n                    ref={(el) => (this.tagAreaEl = el as HTMLUListElement)}\n                    class=\"tag-area\"\n                    role=\"listbox\"\n                    aria-activedescendant=\"\"\n                    aria-orientation=\"horizontal\"\n                    aria-label={`${this.label} ${this.tagsList.length > 0 ? this.tagAreaInstructions : \"\"}`}\n                    tabindex={this.nonLockedTagsList.length > 0 ? 0 : -1}\n                    aria-describedby={`info max-tags`}\n                    onFocus={() => this.handleTagAreaFocus()}\n                    onBlur={(ev) => {\n                      this.clearTagFocus();\n                      this.handleBlur(ev, this.el);\n                    }}\n                    onKeyDown={(ev) => this.handleTagAreaKeyDown(ev)}\n                  >\n                    {this.renderTags()}\n                  </ul>\n                )}\n                <input\n                  id={`input${this.uid}`}\n                  class={this.tagLimitReached ? \"hidden\" : \"\"}\n                  role=\"combobox\"\n                  ref={(el) => (this.inputEl = el as HTMLInputElement)}\n                  autocomplete=\"off\"\n                  aria-controls={this.tagInputType}\n                  aria-describedby=\"help-text\"\n                  aria-label={`${this.label} ${\n                    this.tagInputType === \"dropdown\" ? this.generateCharacterLimitLabel(this.characterLimit) : \"\"\n                  }`}\n                  aria-expanded={this.tagInputType === \"dropdown\" ? this.isExpanded.toString() : null}\n                  placeholder={this.placeholder}\n                  maxLength={this.tagInputType === \"dropdown\" ? this.characterLimit : undefined}\n                  onInput={() => this.handleInputChanged(this.inputEl.value)}\n                  onBlur={(ev) => {\n                    this.handleBlur(ev, this.el);\n                  }}\n                  onFocus={() => this.handleInputFocus()}\n                  onKeyDown={(ev) => this.handleInputKeyDown(ev)}\n                ></input>\n              </div>\n              {this.tagInputType === \"dropdown\" && (\n                <div class=\"character-count\">\n                  {this.charCount}/{this.characterLimit}\n                </div>\n              )}\n            </div>\n            {this.renderTagCounter()}\n            {this.tagInputType === \"dropdown\" && this.renderDropdown()}\n          </div>\n          {this.info ? (\n            <div id=\"info\" class=\"info-text\">\n              {this.info}\n            </div>\n          ) : (\n            \"\"\n          )}\n          <div\n            class=\"sr-only\"\n            aria-live=\"assertive\"\n            ref={(el) => (this.liveRegionEl = el as HTMLDivElement)}\n            aria-atomic=\"true\"\n          >\n            {this.liveRegionMessage}\n          </div>\n          {this.tagInputType === \"table\" && this.renderTable()}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-a6d6eae7.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["getRequest","async","url","response","fetch","ok","json","Error","statusText","postRequest","payload","method","headers","body","JSON","stringify","deleteRequest","putRequest","file","onProgress","Promise","resolve","reject","req","XMLHttpRequest","upload","addEventListener","ev","this","readyState","status","onerror","open","setRequestHeader","name","send"],"sources":["./src/global/services/http-service.tsx"],"sourcesContent":["export const getRequest = async (url: string) => {\n  const response = await fetch(url);\n  if (!!response && !!response.ok) {\n    return await response.json();\n  } else {\n    throw new Error(response.statusText);\n  }\n};\n\nexport const postRequest = async (url: string, payload: Object) => {\n  const response = await fetch(url, {\n    method: \"POST\",\n    headers: { \"Content-Type\": \"application/json; charset=utf-8\" },\n    body: JSON.stringify(payload),\n  });\n  if (!!response && !!response.ok) {\n    return await response.json();\n  } else {\n    throw new Error(response.statusText);\n  }\n};\n\nexport const deleteRequest = async (url: string) => {\n  const response = await fetch(url, { method: \"DELETE\" });\n  if (!!response && !!response.ok) {\n    return await response.json();\n  } else {\n    throw new Error(response.statusText);\n  }\n};\n\nexport const putRequest = (url: string, file: File, onProgress: Function) => {\n  return new Promise((resolve, reject) => {\n    // there's no way to track progress with the fetch API, so using XHR\n    const req = new XMLHttpRequest();\n\n    req.upload.addEventListener(\"progress\", (ev) => onProgress(ev));\n\n    req.addEventListener(\"readystatechange\", function () {\n      if (this.readyState === 4 && this.status === 200) {\n        resolve(this);\n      } else if (this.readyState === 4 && this.status !== 200) {\n        reject();\n      }\n    });\n\n    req.onerror = () => reject();\n    req.open(\"PUT\", url, true);\n    req.setRequestHeader(\"Content-Disposition\", `attachment;filename=\"${file.name}\"`);\n    req.send(file);\n  });\n};\n"],"mappings":"MAAaA,EAAaC,MAAOC,IAC/B,MAAMC,QAAiBC,MAAMF,GAC7B,KAAMC,KAAcA,EAASE,GAAI,CAC/B,aAAaF,EAASG,M,KACjB,CACL,MAAM,IAAIC,MAAMJ,EAASK,W,SAIhBC,EAAcR,MAAOC,EAAaQ,KAC7C,MAAMP,QAAiBC,MAAMF,EAAK,CAChCS,OAAQ,OACRC,QAAS,CAAE,eAAgB,mCAC3BC,KAAMC,KAAKC,UAAUL,KAEvB,KAAMP,KAAcA,EAASE,GAAI,CAC/B,aAAaF,EAASG,M,KACjB,CACL,MAAM,IAAIC,MAAMJ,EAASK,W,SAIhBQ,EAAgBf,MAAOC,IAClC,MAAMC,QAAiBC,MAAMF,EAAK,CAAES,OAAQ,WAC5C,KAAMR,KAAcA,EAASE,GAAI,CAC/B,aAAaF,EAASG,M,KACjB,CACL,MAAM,IAAIC,MAAMJ,EAASK,W,SAIhBS,EAAa,CAACf,EAAagB,EAAYC,IAC3C,IAAIC,SAAQ,CAACC,EAASC,KAE3B,MAAMC,EAAM,IAAIC,eAEhBD,EAAIE,OAAOC,iBAAiB,YAAaC,GAAOR,EAAWQ,KAE3DJ,EAAIG,iBAAiB,oBAAoB,WACvC,GAAIE,KAAKC,aAAe,GAAKD,KAAKE,SAAW,IAAK,CAChDT,EAAQO,K,MACH,GAAIA,KAAKC,aAAe,GAAKD,KAAKE,SAAW,IAAK,CACvDR,G,KAIJC,EAAIQ,QAAU,IAAMT,IACpBC,EAAIS,KAAK,MAAO9B,EAAK,MACrBqB,EAAIU,iBAAiB,sBAAuB,wBAAwBf,EAAKgB,SACzEX,EAAIY,KAAKjB,EAAK,W"}

package/dist/ripple/p-bc883afc.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmPaginationCss","Pagination","this","totalPages","debouncedResize","debounce","isLargeViewport","window","innerWidth","getMiddlePageNums","coreBtns","currentPage","undefined","toggleTabbingOn","isTabbing","toggleTabbingOff","maintainFocusOnNumberChange","el","requestAnimationFrame","shadowRoot","querySelector","focus","handleResize","calculateTotalPages","Math","ceil","totalItems","itemsPerPage","componentWillLoad","Error","document","body","classList","contains","getElementById","updatePageDisplayed","pageNum","value","wmPaginationPageClicked","emit","pageClicked","srAnnouncement","getCurrentPagesInView","displayShortPagination","pages","i","push","displayPageNumber","displayLongPagination","view","displayEllipsis","map","page","h","id","class","onClick","end","begin","renderLarge","disabled","renderSmall","width","height","xmlns","d","render"],"sources":["./src/components/wm-pagination/wm-pagination.scss?tag=wm-pagination&encapsulation=shadow","./src/components/wm-pagination/wm-pagination.tsx"],"sourcesContent":["nav .largescreen,\nnav .smallscreen {\n  margin-bottom: rem-calc(10);\n  @include displayFlex();\n  @include alignItems(center);\n  @include justifyContent(flex-end);\n  @include type-level-4;\n\n  .pageview {\n    @include type-level-4;\n    margin: rem-calc(0 10);\n  }\n\n  .paginationbtn {\n    position: relative;\n    @include box-shadow(none); // fix for Edge\n    @include transition(none);\n    border: none;\n    color: $button-default-text;\n    background-color: transparent;\n    margin: 0;\n    padding: 0;\n    height: rem-calc(40);\n    width: rem-calc(40);\n    font-family: inherit;\n    letter-spacing: 0.3px;\n    font-size: rem-calc(14);\n    font-weight: 500;\n    cursor: pointer;\n    text-transform: none; //For Edge\n\n    svg * {\n      fill: #565397;\n    }\n\n    &:hover:not([aria-current=\"page\"]):not([disabled]) {\n      text-decoration: underline;\n    }\n\n    &:focus {\n      outline: none;\n    }\n\n    &::-moz-focus-inner {\n      border: 0;\n      outline: none;\n    }\n\n    &[disabled] {\n      color: #9f9f9f;\n      pointer-events: none;\n      svg * {\n        fill: #9f9f9f;\n      }\n    }\n  }\n\n  .previousbtn {\n    margin-right: rem-calc(10);\n    width: auto !important;\n  }\n\n  .nextbtn {\n    margin-left: rem-calc(10);\n    margin-right: 0;\n    width: auto !important;\n  }\n\n  .previousbtn,\n  .nextbtn {\n    @include transition(none);\n  }\n\n  .ellipsis {\n    display: inline-block;\n    width: rem-calc(40);\n    text-align: center;\n  }\n\n  .pagebtncontainer {\n    &.user-is-tabbing {\n      :focus:not(.-disabled):not([aria-current=\"page\"]) {\n        @include box-shadow(none); // fix for Edge\n\n        &:before {\n          position: absolute;\n          content: \"\";\n          height: auto;\n          width: 16px;\n          top: 0;\n          bottom: 0;\n          left: 12px;\n          right: 0;\n          background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\n          background-size: 6px 2px;\n          background-position: 0 2em;\n          border-radius: 0;\n          line-height: normal;\n        }\n\n        &.previousbtn:focus:before {\n          left: 0 !important;\n        }\n\n        &.nextbtn:focus:before {\n          left: 0 !important;\n        }\n      }\n\n      [aria-current=\"page\"]:focus {\n        @include focus-style;\n      }\n    }\n  }\n}\n\nnav .largescreen {\n  & .user-is-tabbing {\n    :focus:not(.-disabled):not([aria-current=\"page\"]) {\n      // to make focus indicator as wide as text \"previous\" and \"next\"\n      &.previousbtn:focus:before {\n        width: 56px !important;\n      }\n      &.nextbtn:focus:before {\n        width: 32px !important;\n      }\n    }\n  }\n  .paginationbtn {\n    &[aria-current=\"page\"] {\n      @include border-radius(50%);\n      @include box-shadow(0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\n      background-color: $button-primary-background;\n      color: $button-primary-text;\n\n      &:hover {\n        @include box-shadow(0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\n        background: mix(black, $button-primary-background, 10%);\n      }\n    }\n  }\n}\n\n.sr-only {\n  @include srOnly;\n}\n","import { h, Component, EventEmitter, Prop, Watch, Event, Element, Listen, State } from \"@stencil/core\";\nimport { debounce } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-pagination\",\n  styleUrl: \"wm-pagination.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Pagination {\n  @Element() el!: any;\n\n  @Prop() currentPage: number = 1;\n  @Prop() totalItems?: number = undefined;\n  @Prop() itemsPerPage?: number = undefined;\n  @Prop() value = 1;\n  @Prop() isLargeViewport: boolean = window.innerWidth > 600;\n  @State() isTabbing: boolean = false;\n  @State() srAnnouncement: string = \"\";\n\n  private totalPages: number = 0;\n\n  @Event() wmPaginationPageClicked!: EventEmitter<String>;\n  @Event() pageClicked!: EventEmitter<String>; // deprecated in favor of wmPaginationPageClicked\n  @Event() focusCurrentPage!: EventEmitter;\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  maintainFocusOnNumberChange(el: \"previous\" | \"next\" | \"prev-arrow\" | \"next-arrow\" | \"page\") {\n    window.requestAnimationFrame(() => {\n      switch (el) {\n        case \"previous\":\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(`button#wm-1`).focus(); //Only shift focus from previous button to page 1 if page 1 is reached, which disables previous button. Otherwise, maintain focus on previous button.\n          break;\n        case \"next\":\n          this.currentPage === this.totalPages &&\n            this.el.shadowRoot.querySelector(`button#wm-${this.totalPages}`).focus(); //Only shift focus from next button if last page is reached, disabling next button. Otherwise, maintain focus on next button.\n          break;\n        case \"prev-arrow\":\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(\"#next-arw\").focus(); //Only shift focus if page 1 is reached, disabling previous buttons. Otherwise, maintain focus on previous buttons.\n          break;\n        case \"next-arrow\":\n          this.currentPage === this.totalPages && this.el.shadowRoot.querySelector(\"#previous-arw\").focus(); //Only shift focus if last page is reached, disabling next buttons. Otherwise, maintain focus on next buttons.\n          break;\n        case \"page\":\n          this.el.shadowRoot.querySelector(`button#wm-${this.currentPage}`).focus();\n        default:\n          return;\n      }\n    });\n  }\n\n  debouncedResize = debounce(() => {\n    this.isLargeViewport = window.innerWidth > 600;\n  }, 250);\n\n  @Listen(\"resize\", { target: \"window\" })\n  handleResize() {\n    this.debouncedResize();\n  }\n\n  @Watch(\"totalItems\")\n  @Watch(\"itemsPerPage\")\n  calculateTotalPages() {\n    this.totalPages = Math.ceil(this.totalItems! / this.itemsPerPage!);\n  }\n\n  componentWillLoad() {\n    if (!this.totalItems || !this.itemsPerPage || !this.currentPage) {\n      throw new Error(\"Please check the required attributes\");\n    }\n\n    this.calculateTotalPages();\n\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n\n    this.el.focus = () => {\n      // in addition to delegatesFocus, we need to highjack the focus method to send focus to the appropriate element based on the components's state\n      if (this.isLargeViewport) {\n        this.el.shadowRoot.getElementById(`wm-${this.currentPage}`).focus();\n      } else {\n        this.currentPage === 1\n          ? this.el.shadowRoot.getElementById(\"next-arw\").focus()\n          : this.el.shadowRoot.getElementById(\"wm-1-arw\").focus();\n      }\n    };\n  }\n\n  updatePageDisplayed(pageNum: any) {\n    this.value = pageNum;\n    this.wmPaginationPageClicked.emit();\n    this.pageClicked.emit(); // deprecated\n    this.srAnnouncement = `Current page, ${this.currentPage}. ${this.getCurrentPagesInView()}`;\n  }\n\n  displayShortPagination() {\n    let pages = [];\n    for (let i = 1; i <= this.totalPages; i++) {\n      pages.push(this.displayPageNumber(i));\n    }\n    return pages;\n  }\n\n  displayLongPagination() {\n    let view = [\n      this.displayPageNumber(1),\n      this.currentPage > 3 && this.displayEllipsis(),\n      ...this.getMiddlePageNums().map((page) => this.displayPageNumber(page)),\n      this.currentPage + 2 < this.totalPages && this.displayEllipsis(),\n      this.displayPageNumber(this.totalPages),\n    ];\n    return view;\n  }\n\n  displayPageNumber(pageNum: number) {\n    return (\n      <button\n        id={`wm-${pageNum}`}\n        class=\"paginationbtn\"\n        onClick={() => {\n          this.currentPage = pageNum;\n          this.updatePageDisplayed(pageNum);\n          this.maintainFocusOnNumberChange(\"page\");\n        }}\n        value={pageNum}\n        aria-label={this.currentPage !== pageNum ? `Go to page ${pageNum}` : \"\"}\n        aria-current={this.currentPage === pageNum ? \"page\" : undefined}\n      >\n        {pageNum}\n      </button>\n    );\n  }\n\n  displayEllipsis() {\n    return <span class=\"ellipsis\">...</span>;\n  }\n\n  getMiddlePageNums = () => {\n    let coreBtns;\n    // if pg is 1, 2 or 3\n    if (this.currentPage < 4) {\n      coreBtns = [2, 3, 4];\n    } else if (this.currentPage > this.totalPages - 3) {\n      coreBtns = [this.totalPages - 3, this.totalPages - 2, this.totalPages - 1];\n    } else {\n      coreBtns = [this.currentPage - 1, this.currentPage, this.currentPage + 1];\n    }\n    return coreBtns;\n  };\n\n  // displayPageView = () => {\n  //   // let end = this.itemsPerPage! * this.currentPage;\n  //   // const begin = end - this.itemsPerPage! + 1;\n  //   // if (end > this.totalItems!) {\n  //   //   end = this.totalItems!;\n  //   // }\n  //   return <div class=\"pageview\">{this.getCurrentView()}</div>;\n  // };\n\n  getCurrentPagesInView() {\n    let end = this.itemsPerPage! * this.currentPage;\n    const begin = end - this.itemsPerPage! + 1;\n    if (end > this.totalItems!) {\n      end = this.totalItems!;\n    }\n    return \"Viewing \" + (begin === end ? `${begin}` : `${begin}–${end} of ${this.totalItems}`);\n  }\n\n  renderLarge() {\n    return (\n      <div class=\"largescreen\">\n        <div class=\"pageview\">{this.getCurrentPagesInView()}</div>\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\n          <button\n            id=\"previous\"\n            class=\"paginationbtn previousbtn\"\n            onClick={() => {\n              this.currentPage = this.currentPage - 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"previous\");\n            }}\n            disabled={this.currentPage === 1}\n            aria-label=\"Go to previous page\"\n            aria-controls=\"status\"\n          >\n            Previous\n          </button>\n          {this.totalPages < 6 ? this.displayShortPagination() : this.displayLongPagination()}\n          <button\n            id=\"next\"\n            class=\"paginationbtn nextbtn\"\n            onClick={() => {\n              this.currentPage = this.currentPage + 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"next\");\n            }}\n            disabled={this.currentPage === this.totalPages}\n            aria-label=\"Go to next page\"\n            aria-controls=\"status\"\n          >\n            Next\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  renderSmall() {\n    return (\n      <div class=\"smallscreen\">\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\n          <button\n            id={`wm-1-arw`}\n            class=\"paginationbtn\"\n            onClick={() => {\n              this.currentPage = 1;\n              this.updatePageDisplayed(1);\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\n            }}\n            value={1}\n            aria-current={this.currentPage === 1 ? \"page\" : undefined}\n            aria-label={`Go to page 1`}\n            aria-controls=\"status\"\n            disabled={this.currentPage === 1}\n          >\n            <svg width=\"16\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6zM15.41 10.59L10.83 6l4.58-4.59L14 0 8 6l6 6z\" />\n            </svg>\n          </button>\n          <button\n            id=\"previous-arw\"\n            class=\"paginationbtn previousbtn\"\n            onClick={() => {\n              this.currentPage -= 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\n            }}\n            disabled={this.currentPage === 1}\n            aria-label=\"Go to previous page\"\n          >\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6z\" />\n            </svg>\n          </button>\n          Page {this.currentPage} of {this.totalPages}\n          <button\n            id=\"next-arw\"\n            class=\"paginationbtn nextbtn\"\n            onClick={() => {\n              this.currentPage += 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"next-arrow\");\n            }}\n            disabled={this.currentPage === this.totalPages}\n            aria-label=\"Go to next page\"\n          >\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6z\" />\n            </svg>\n          </button>\n          <button\n            id={`wm-${this.totalPages}-arw`}\n            class=\"paginationbtn\"\n            onClick={() => {\n              this.currentPage = this.totalPages;\n              this.updatePageDisplayed(this.totalPages);\n              this.maintainFocusOnNumberChange(\"next-arrow\");\n            }}\n            value={this.totalPages}\n            aria-current={this.currentPage === this.totalPages ? \"page\" : undefined}\n            aria-label={`Go to last page, page ${this.totalPages}`}\n            aria-controls=\"status\"\n            disabled={this.currentPage === this.totalPages}\n          >\n            <svg width=\"17\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6zM9.59 10.59L14.17 6 9.59 1.41 11 0l6 6-6 6z\" />\n            </svg>\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      // do not render the component if there's only one page\n      this.totalItems! > this.itemsPerPage! && (\n        <nav aria-label={`Pagination Navigation. ${this.getCurrentPagesInView()}. Current page, ${this.currentPage}.`}>\n          {/* both \"desktop\" and \"mobile\" versions are renderered. media queries hide the unnecessary stuff */}\n          {this.isLargeViewport ? this.renderLarge() : this.renderSmall()}\n          {/* The below is for screenreader purposes, ensuring it announces the new current page.*/}\n          <div id=\"status\" class=\"sr-only\" aria-live=\"polite\" aria-relevant=\"text\" aria-atomic=\"true\">\n            {this.srAnnouncement}\n          </div>\n        </nav>\n      )\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-be954fba.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmPaginationCss","Pagination","exports","this","totalPages","debouncedResize","debounce","_this","isLargeViewport","window","innerWidth","getMiddlePageNums","coreBtns","currentPage","undefined","class_1","prototype","toggleTabbingOn","isTabbing","toggleTabbingOff","maintainFocusOnNumberChange","el","requestAnimationFrame","shadowRoot","querySelector","focus","concat","handleResize","calculateTotalPages","Math","ceil","totalItems","itemsPerPage","componentWillLoad","Error","document","body","classList","contains","getElementById","updatePageDisplayed","pageNum","value","wmPaginationPageClicked","emit","pageClicked","srAnnouncement","getCurrentPagesInView","displayShortPagination","pages","i","push","displayPageNumber","displayLongPagination","view","__spreadArray","displayEllipsis","map","page","h","id","class","onClick","end","begin","renderLarge","disabled","renderSmall","width","height","xmlns","d","render"],"sources":["src/components/wm-pagination/wm-pagination.scss?tag=wm-pagination&encapsulation=shadow","src/components/wm-pagination/wm-pagination.tsx"],"sourcesContent":["nav .largescreen,\nnav .smallscreen {\n  margin-bottom: rem-calc(10);\n  @include displayFlex();\n  @include alignItems(center);\n  @include justifyContent(flex-end);\n  @include type-level-4;\n\n  .pageview {\n    @include type-level-4;\n    margin: rem-calc(0 10);\n  }\n\n  .paginationbtn {\n    position: relative;\n    @include box-shadow(none); // fix for Edge\n    @include transition(none);\n    border: none;\n    color: $button-default-text;\n    background-color: transparent;\n    margin: 0;\n    padding: 0;\n    height: rem-calc(40);\n    width: rem-calc(40);\n    font-family: inherit;\n    letter-spacing: 0.3px;\n    font-size: rem-calc(14);\n    font-weight: 500;\n    cursor: pointer;\n    text-transform: none; //For Edge\n\n    svg * {\n      fill: #565397;\n    }\n\n    &:hover:not([aria-current=\"page\"]):not([disabled]) {\n      text-decoration: underline;\n    }\n\n    &:focus {\n      outline: none;\n    }\n\n    &::-moz-focus-inner {\n      border: 0;\n      outline: none;\n    }\n\n    &[disabled] {\n      color: #9f9f9f;\n      pointer-events: none;\n      svg * {\n        fill: #9f9f9f;\n      }\n    }\n  }\n\n  .previousbtn {\n    margin-right: rem-calc(10);\n    width: auto !important;\n  }\n\n  .nextbtn {\n    margin-left: rem-calc(10);\n    margin-right: 0;\n    width: auto !important;\n  }\n\n  .previousbtn,\n  .nextbtn {\n    @include transition(none);\n  }\n\n  .ellipsis {\n    display: inline-block;\n    width: rem-calc(40);\n    text-align: center;\n  }\n\n  .pagebtncontainer {\n    &.user-is-tabbing {\n      :focus:not(.-disabled):not([aria-current=\"page\"]) {\n        @include box-shadow(none); // fix for Edge\n\n        &:before {\n          position: absolute;\n          content: \"\";\n          height: auto;\n          width: 16px;\n          top: 0;\n          bottom: 0;\n          left: 12px;\n          right: 0;\n          background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\n          background-size: 6px 2px;\n          background-position: 0 2em;\n          border-radius: 0;\n          line-height: normal;\n        }\n\n        &.previousbtn:focus:before {\n          left: 0 !important;\n        }\n\n        &.nextbtn:focus:before {\n          left: 0 !important;\n        }\n      }\n\n      [aria-current=\"page\"]:focus {\n        @include focus-style;\n      }\n    }\n  }\n}\n\nnav .largescreen {\n  & .user-is-tabbing {\n    :focus:not(.-disabled):not([aria-current=\"page\"]) {\n      // to make focus indicator as wide as text \"previous\" and \"next\"\n      &.previousbtn:focus:before {\n        width: 56px !important;\n      }\n      &.nextbtn:focus:before {\n        width: 32px !important;\n      }\n    }\n  }\n  .paginationbtn {\n    &[aria-current=\"page\"] {\n      @include border-radius(50%);\n      @include box-shadow(0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\n      background-color: $button-primary-background;\n      color: $button-primary-text;\n\n      &:hover {\n        @include box-shadow(0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\n        background: mix(black, $button-primary-background, 10%);\n      }\n    }\n  }\n}\n\n.sr-only {\n  @include srOnly;\n}\n","import { h, Component, EventEmitter, Prop, Watch, Event, Element, Listen, State } from \"@stencil/core\";\nimport { debounce } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-pagination\",\n  styleUrl: \"wm-pagination.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Pagination {\n  @Element() el!: any;\n\n  @Prop() currentPage: number = 1;\n  @Prop() totalItems?: number = undefined;\n  @Prop() itemsPerPage?: number = undefined;\n  @Prop() value = 1;\n  @Prop() isLargeViewport: boolean = window.innerWidth > 600;\n  @State() isTabbing: boolean = false;\n  @State() srAnnouncement: string = \"\";\n\n  private totalPages: number = 0;\n\n  @Event() wmPaginationPageClicked!: EventEmitter<String>;\n  @Event() pageClicked!: EventEmitter<String>; // deprecated in favor of wmPaginationPageClicked\n  @Event() focusCurrentPage!: EventEmitter;\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  maintainFocusOnNumberChange(el: \"previous\" | \"next\" | \"prev-arrow\" | \"next-arrow\" | \"page\") {\n    window.requestAnimationFrame(() => {\n      switch (el) {\n        case \"previous\":\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(`button#wm-1`).focus(); //Only shift focus from previous button to page 1 if page 1 is reached, which disables previous button. Otherwise, maintain focus on previous button.\n          break;\n        case \"next\":\n          this.currentPage === this.totalPages &&\n            this.el.shadowRoot.querySelector(`button#wm-${this.totalPages}`).focus(); //Only shift focus from next button if last page is reached, disabling next button. Otherwise, maintain focus on next button.\n          break;\n        case \"prev-arrow\":\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(\"#next-arw\").focus(); //Only shift focus if page 1 is reached, disabling previous buttons. Otherwise, maintain focus on previous buttons.\n          break;\n        case \"next-arrow\":\n          this.currentPage === this.totalPages && this.el.shadowRoot.querySelector(\"#previous-arw\").focus(); //Only shift focus if last page is reached, disabling next buttons. Otherwise, maintain focus on next buttons.\n          break;\n        case \"page\":\n          this.el.shadowRoot.querySelector(`button#wm-${this.currentPage}`).focus();\n        default:\n          return;\n      }\n    });\n  }\n\n  debouncedResize = debounce(() => {\n    this.isLargeViewport = window.innerWidth > 600;\n  }, 250);\n\n  @Listen(\"resize\", { target: \"window\" })\n  handleResize() {\n    this.debouncedResize();\n  }\n\n  @Watch(\"totalItems\")\n  @Watch(\"itemsPerPage\")\n  calculateTotalPages() {\n    this.totalPages = Math.ceil(this.totalItems! / this.itemsPerPage!);\n  }\n\n  componentWillLoad() {\n    if (!this.totalItems || !this.itemsPerPage || !this.currentPage) {\n      throw new Error(\"Please check the required attributes\");\n    }\n\n    this.calculateTotalPages();\n\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n\n    this.el.focus = () => {\n      // in addition to delegatesFocus, we need to highjack the focus method to send focus to the appropriate element based on the components's state\n      if (this.isLargeViewport) {\n        this.el.shadowRoot.getElementById(`wm-${this.currentPage}`).focus();\n      } else {\n        this.currentPage === 1\n          ? this.el.shadowRoot.getElementById(\"next-arw\").focus()\n          : this.el.shadowRoot.getElementById(\"wm-1-arw\").focus();\n      }\n    };\n  }\n\n  updatePageDisplayed(pageNum: any) {\n    this.value = pageNum;\n    this.wmPaginationPageClicked.emit();\n    this.pageClicked.emit(); // deprecated\n    this.srAnnouncement = `Current page, ${this.currentPage}. ${this.getCurrentPagesInView()}`;\n  }\n\n  displayShortPagination() {\n    let pages = [];\n    for (let i = 1; i <= this.totalPages; i++) {\n      pages.push(this.displayPageNumber(i));\n    }\n    return pages;\n  }\n\n  displayLongPagination() {\n    let view = [\n      this.displayPageNumber(1),\n      this.currentPage > 3 && this.displayEllipsis(),\n      ...this.getMiddlePageNums().map((page) => this.displayPageNumber(page)),\n      this.currentPage + 2 < this.totalPages && this.displayEllipsis(),\n      this.displayPageNumber(this.totalPages),\n    ];\n    return view;\n  }\n\n  displayPageNumber(pageNum: number) {\n    return (\n      <button\n        id={`wm-${pageNum}`}\n        class=\"paginationbtn\"\n        onClick={() => {\n          this.currentPage = pageNum;\n          this.updatePageDisplayed(pageNum);\n          this.maintainFocusOnNumberChange(\"page\");\n        }}\n        value={pageNum}\n        aria-label={this.currentPage !== pageNum ? `Go to page ${pageNum}` : \"\"}\n        aria-current={this.currentPage === pageNum ? \"page\" : undefined}\n      >\n        {pageNum}\n      </button>\n    );\n  }\n\n  displayEllipsis() {\n    return <span class=\"ellipsis\">...</span>;\n  }\n\n  getMiddlePageNums = () => {\n    let coreBtns;\n    // if pg is 1, 2 or 3\n    if (this.currentPage < 4) {\n      coreBtns = [2, 3, 4];\n    } else if (this.currentPage > this.totalPages - 3) {\n      coreBtns = [this.totalPages - 3, this.totalPages - 2, this.totalPages - 1];\n    } else {\n      coreBtns = [this.currentPage - 1, this.currentPage, this.currentPage + 1];\n    }\n    return coreBtns;\n  };\n\n  // displayPageView = () => {\n  //   // let end = this.itemsPerPage! * this.currentPage;\n  //   // const begin = end - this.itemsPerPage! + 1;\n  //   // if (end > this.totalItems!) {\n  //   //   end = this.totalItems!;\n  //   // }\n  //   return <div class=\"pageview\">{this.getCurrentView()}</div>;\n  // };\n\n  getCurrentPagesInView() {\n    let end = this.itemsPerPage! * this.currentPage;\n    const begin = end - this.itemsPerPage! + 1;\n    if (end > this.totalItems!) {\n      end = this.totalItems!;\n    }\n    return \"Viewing \" + (begin === end ? `${begin}` : `${begin}–${end} of ${this.totalItems}`);\n  }\n\n  renderLarge() {\n    return (\n      <div class=\"largescreen\">\n        <div class=\"pageview\">{this.getCurrentPagesInView()}</div>\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\n          <button\n            id=\"previous\"\n            class=\"paginationbtn previousbtn\"\n            onClick={() => {\n              this.currentPage = this.currentPage - 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"previous\");\n            }}\n            disabled={this.currentPage === 1}\n            aria-label=\"Go to previous page\"\n            aria-controls=\"status\"\n          >\n            Previous\n          </button>\n          {this.totalPages < 6 ? this.displayShortPagination() : this.displayLongPagination()}\n          <button\n            id=\"next\"\n            class=\"paginationbtn nextbtn\"\n            onClick={() => {\n              this.currentPage = this.currentPage + 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"next\");\n            }}\n            disabled={this.currentPage === this.totalPages}\n            aria-label=\"Go to next page\"\n            aria-controls=\"status\"\n          >\n            Next\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  renderSmall() {\n    return (\n      <div class=\"smallscreen\">\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\n          <button\n            id={`wm-1-arw`}\n            class=\"paginationbtn\"\n            onClick={() => {\n              this.currentPage = 1;\n              this.updatePageDisplayed(1);\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\n            }}\n            value={1}\n            aria-current={this.currentPage === 1 ? \"page\" : undefined}\n            aria-label={`Go to page 1`}\n            aria-controls=\"status\"\n            disabled={this.currentPage === 1}\n          >\n            <svg width=\"16\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6zM15.41 10.59L10.83 6l4.58-4.59L14 0 8 6l6 6z\" />\n            </svg>\n          </button>\n          <button\n            id=\"previous-arw\"\n            class=\"paginationbtn previousbtn\"\n            onClick={() => {\n              this.currentPage -= 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\n            }}\n            disabled={this.currentPage === 1}\n            aria-label=\"Go to previous page\"\n          >\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6z\" />\n            </svg>\n          </button>\n          Page {this.currentPage} of {this.totalPages}\n          <button\n            id=\"next-arw\"\n            class=\"paginationbtn nextbtn\"\n            onClick={() => {\n              this.currentPage += 1;\n              this.updatePageDisplayed(this.currentPage);\n              this.maintainFocusOnNumberChange(\"next-arrow\");\n            }}\n            disabled={this.currentPage === this.totalPages}\n            aria-label=\"Go to next page\"\n          >\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6z\" />\n            </svg>\n          </button>\n          <button\n            id={`wm-${this.totalPages}-arw`}\n            class=\"paginationbtn\"\n            onClick={() => {\n              this.currentPage = this.totalPages;\n              this.updatePageDisplayed(this.totalPages);\n              this.maintainFocusOnNumberChange(\"next-arrow\");\n            }}\n            value={this.totalPages}\n            aria-current={this.currentPage === this.totalPages ? \"page\" : undefined}\n            aria-label={`Go to last page, page ${this.totalPages}`}\n            aria-controls=\"status\"\n            disabled={this.currentPage === this.totalPages}\n          >\n            <svg width=\"17\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6zM9.59 10.59L14.17 6 9.59 1.41 11 0l6 6-6 6z\" />\n            </svg>\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      // do not render the component if there's only one page\n      this.totalItems! > this.itemsPerPage! && (\n        <nav aria-label={`Pagination Navigation. ${this.getCurrentPagesInView()}. Current page, ${this.currentPage}.`}>\n          {/* both \"desktop\" and \"mobile\" versions are renderered. media queries hide the unnecessary stuff */}\n          {this.isLargeViewport ? this.renderLarge() : this.renderSmall()}\n          {/* The below is for screenreader purposes, ensuring it announces the new current page.*/}\n          <div id=\"status\" class=\"sr-only\" aria-live=\"polite\" aria-relevant=\"text\" aria-atomic=\"true\">\n            {this.srAnnouncement}\n          </div>\n        </nav>\n      )\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-bfc8d2bb.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmProgressIndicatorCss","ProgressIndicator","this","uid","generateId","slicesDetails","barLabelsWidth","el","parentElement","popoverEl","shadowRoot","querySelector","sliceEls","Array","from","querySelectorAll","chartDetails","mode","allChartsDetails","undefined","ariaLabelText","text","label","subinfo","chartRoleDescription","intl","formatMessage","id","defaultMessage","description","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKeydown","ev","handleChartKeydown","call","componentWillLoad","console","error","children","length","warn","addEventListener","detail","async","getDetails","forceUpdate","handleModeUpdate","renderBarOrDoughnut","total","renderStackedBar","renderDoughnut","render","h","Host","onBlur","exitChart","ref","componentWrapperEl","class","userIsNavigating","role","tabindex","style","htmlFor","renderLegend","renderCompletionMessage","renderInstructionsText","wmProgressMonitorCss","ProgressMonitor","doughnutWidth","modeInitialized","debouncedUpdate","debounce","parsedBreakpoint","asNumber","parseToNum","breakpoint","asPixels","clientWidth","resizeObserver","ResizeObserver","observe","componentDidLoad","wmProgressMonitorModeChange","emit","componentWillUpdate","prevMode","num","asString","toString","withoutPx","replace","parseInt","keys","csvToArray","groupLegend","colors","bar","map","key","idx","legendItem","color","renderLegendItem","ProgressSlice","componentDidUpdate","wmProgressSliceUpdated"],"sources":["./src/components/charts/wm-progress-monitor/wm-progress-indicator.scss?tag=wm-progress-indicator&encapsulation=shadow","./src/components/charts/wm-progress-monitor/wm-progress-indicator.tsx","./src/components/charts/wm-progress-monitor/wm-progress-monitor.scss?tag=wm-progress-monitor&encapsulation=shadow","./src/components/charts/wm-progress-monitor/wm-progress-monitor.tsx","./src/components/charts/wm-progress-monitor/wm-progress-slice.tsx"],"sourcesContent":[":host,\nwm-progress-indicator {\n  @extend %chart-styles;\n}\n\n:host(:focus) {\n  @extend %chart-focus-styles;\n}\n","import { Component, Element, h, Host, Prop, State, Listen, forceUpdate, Watch } from \"@stencil/core\";\nimport { ChartDetails } from \"../../../global/interfaces\";\nimport { generateId, intl } from \"../../../global/functions\";\nimport {\n  exitChart,\n  getDetails,\n  handleChartKeydown,\n  renderStackedBar,\n  renderCompletionMessage,\n  renderDoughnut,\n  renderInstructionsText,\n  renderLegend,\n  allChartsDetails,\n} from \"../chartFunctions\";\n\n@Component({\n  tag: \"wm-progress-indicator\",\n  shadow: { delegatesFocus: true },\n  styleUrl: \"wm-progress-indicator.scss\",\n})\nexport class ProgressIndicator {\n  @Element() el!: HTMLWmProgressIndicatorElement;\n  // @ts-ignore-- TS warns this is unused, but its needed in chartFunctions\n  private componentWrapperEl!: HTMLDivElement;\n\n  @Prop() label?: string;\n  @Prop() subinfo?: string;\n  @Prop() completionMessage?: string;\n  @Prop() showLegend: boolean = true;\n\n  @State() isTabbing: boolean = false;\n  @State() mode?: \"doughnut\" | \"bar\";\n  @State() userIsNavigating: boolean = false;\n\n  private uid: string = generateId();\n  private total!: number;\n  // @ts-ignore-- TS warns this is unused, but its needed in the chartFunctions\n  private slicesDetails: SliceDetails[] = [];\n  private barLabelsWidth?: string = (this.el.parentElement as HTMLWmProgressMonitorElement).barLabelsWidth;\n\n  get popoverEl() {\n    return this.el.shadowRoot!.querySelector(\"priv-chart-popover\");\n  }\n  get sliceEls(): (SVGElement | HTMLElement)[] | undefined {\n    return Array.from(this.el.shadowRoot!.querySelectorAll(\".segment\")) as HTMLElement[];\n  }\n  get chartDetails(): ChartDetails | undefined {\n    return this.mode ? allChartsDetails[this.mode] : undefined;\n  }\n  get ariaLabelText() {\n    let text = `${this.label}`;\n    if (this.subinfo) {\n      text += ` ${this.subinfo}`;\n    }\n    return text;\n  }\n\n  get chartRoleDescription(): string {\n    return intl.formatMessage({\n      id: \"chart.roleDescription\",\n      defaultMessage: \"Interactive chart\",\n      description: \"For screen readers only, a description clarifying the role of the chart widget\",\n    });\n  }\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"keydown\")\n  handleKeydown(ev: KeyboardEvent) {\n    handleChartKeydown.call(this, ev);\n  }\n\n  componentWillLoad() {\n    if (!this.label) {\n      console.error(\n        \"For accessibility purposes, you must provide a label for the chart. See https://components.watermarkinsights.com/chart for more information.\"\n      );\n    }\n\n    if (this.el.children.length !== 2) {\n      console.warn(\"wm-progress-indicator component must have 2 wm-progress-slice children.\");\n    }\n\n    // Listen to parent for initial mode, and future changes\n    this.el.parentElement!.addEventListener(\n      \"wmProgressMonitorModeChange\",\n      (ev) => (this.mode = (ev as CustomEvent).detail)\n    );\n  }\n\n  @Listen(\"wmProgressSliceUpdated\")\n  async handleSliceUpdate() {\n    await getDetails.call(this, this.mode!);\n    forceUpdate(this.el);\n  }\n\n  @Watch(\"mode\")\n  handleModeUpdate() {\n    if (this.mode) {\n      getDetails.call(this, this.mode);\n    }\n  }\n\n  renderBarOrDoughnut() {\n    if (this.total > 0 && this.mode === \"bar\") {\n      return renderStackedBar.call(this, this.mode!);\n    } else {\n      return renderDoughnut.call(this, this.mode!);\n    }\n  }\n\n  render() {\n    return (\n      <Host onBlur={() => exitChart.call(this)}>\n        <div\n          ref={(el) => (this.componentWrapperEl = el as HTMLDivElement)}\n          class={`component-wrapper ${this.mode} ${this.isTabbing && !this.userIsNavigating ? \"user-is-tabbing\" : \"\"}`}\n          role=\"application\"\n          aria-label={this.ariaLabelText}\n          tabindex=\"0\"\n          aria-roledescription={this.chartRoleDescription}\n          aria-describedby={`chart-instructions`}\n        >\n          <label\n            id={`label-${this.uid}`}\n            class={`label ${this.barLabelsWidth && this.mode === \"bar\" ? \"custom-width\" : \"\"}`}\n            style={{ \"--custom-label-width\": this.barLabelsWidth }}\n            htmlFor={`graphic-${this.uid}`}\n          >\n            <span class=\"label-text\">{this.label}</span>\n            {this.subinfo ? <span class=\"subinfo\">{this.subinfo}</span> : \"\"}\n          </label>\n          {this.mode && this.renderBarOrDoughnut()}\n          {this.mode === \"doughnut\" ? renderLegend.call(this, this.mode) : \"\"}\n          <priv-chart-popover class={this.isTabbing ? \"user-is-tabbing\" : \"\"}></priv-chart-popover>\n          {this.mode === \"doughnut\" ? renderCompletionMessage.call(this) : \"\"}\n        </div>\n        {renderInstructionsText()}\n      </Host>\n    );\n  }\n}\n",":host,\nwm-progress-monitor {\n  display: flex;\n\n  .legend-wrapper {\n    @extend %chart-legend-styles;\n    align-items: flex-start;\n    padding: 0 1.25rem;\n  }\n}\n\n:host(.row) {\n  flex-direction: row;\n}\n\n:host(.column) {\n  flex-direction: column;\n}\n","import { Component, h, Host, Element, Prop, Event, EventEmitter, forceUpdate } from \"@stencil/core\";\nimport { csvToArray, debounce } from \"../../../global/functions\";\nimport { renderLegendItem, allChartsDetails } from \"../chartFunctions\";\nimport { LegendItem } from \"../../../global/interfaces\";\n@Component({\n  tag: \"wm-progress-monitor\",\n  shadow: { delegatesFocus: true },\n  styleUrl: \"wm-progress-monitor.scss\",\n})\nexport class ProgressMonitor {\n  @Element() el!: HTMLWmProgressMonitorElement;\n  @Prop() breakpoint?: number | string;\n  @Prop() groupLegend?: string;\n  @Prop() barLabelsWidth?: string;\n  @Event() wmProgressMonitorModeChange!: EventEmitter;\n  private doughnutWidth = 300;\n  private prevMode?: string;\n  private modeInitialized: boolean = false;\n\n  get parsedBreakpoint() {\n    const asNumber = this.parseToNum(this.breakpoint ? this.breakpoint : this.el.children.length);\n    // if number < 20, it is treated as width in terms of # of indicators. Otherwise it is a pixel value\n    // e.g. 4 -> 1200px, while 768 -> 768 px\n    const asPixels = asNumber >= 20 ? asNumber : asNumber * this.doughnutWidth;\n    return asPixels;\n  }\n\n  get mode(): \"doughnut\" | \"bar\" {\n    return this.el.clientWidth > this.parsedBreakpoint ? \"doughnut\" : \"bar\";\n  }\n\n  componentWillLoad() {\n    // rerender on resize in case layout needs to change\n    const resizeObserver = new ResizeObserver(() => this.debouncedUpdate());\n    resizeObserver.observe(this.el);\n  }\n\n  componentDidLoad() {\n    // emit initial mode for Indicators, must happen post-load as this.el measurement is needed\n    this.wmProgressMonitorModeChange.emit(this.mode);\n    this.modeInitialized = true;\n  }\n\n  componentWillUpdate() {\n    // store prevMode before every render except first to determine when it has changed\n    if (this.prevMode !== this.mode) {\n      this.wmProgressMonitorModeChange.emit(this.mode);\n    }\n    this.prevMode = this.mode;\n  }\n\n  debouncedUpdate = debounce(() => forceUpdate(this.el), 50);\n\n  parseToNum(num: string | number): number {\n    const asString = num.toString();\n    const withoutPx = asString.replace(\"px\", \"\");\n    return parseInt(withoutPx);\n  }\n\n  renderLegend() {\n    const keys = csvToArray(this.groupLegend!);\n    const colors = allChartsDetails.bar.colors;\n\n    return (\n      <div class=\"legend-wrapper\">\n        <div class=\"legend\">\n          {keys.map((key, idx) => {\n            const legendItem: LegendItem = { key: key, color: colors[idx] };\n            return renderLegendItem(legendItem);\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <Host class={this.mode === \"doughnut\" ? \"row\" : \"column\"}>\n        {/* don't render Indicators until mode is determined otherwise content flashes*/}\n        {this.modeInitialized && this.groupLegend && this.mode === \"bar\" && this.renderLegend()}\n        {this.modeInitialized && <slot />}\n      </Host>\n    );\n  }\n}\n","import { Component, Prop, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-progress-slice\",\n  shadow: true,\n})\nexport class ProgressSlice {\n  @Prop() legend?: string;\n  @Prop() amount?: string;\n  @Prop() popoverTitle?: string;\n  @Prop() popoverText?: string;\n  @Prop() popoverButtonText?: string;\n\n  @Event() wmProgressSliceUpdated!: EventEmitter<void>;\n  componentDidUpdate() {\n    this.wmProgressSliceUpdated.emit();\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-c25abcc5.system.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["colors","salmon","cyan","forest","sleet","midnight","lavender","periwinkle","gray","allChartsDetails","exports","doughnut","size","thickness","padding","category","doughnut0","doughnut1","doughnut2","doughnut2plus","doughnut3","bar","bar1","bar2","bar3","bar4","bar5","bar6","bar7","showValue","valueFormat","textHiddenMessage","intl","formatMessage","id","defaultMessage","description","seeDetailsMessage","abbrNumber","num","Math","round","amountToPercent","val","total","asInt","amountToDegree","toFixed","number","parseFloat","floor","polarToCartesian","half","radius","startAngle","endAngle","x","cos","PI","y","sin","undefined","x2","y2","x1","y1","getArc","largeArcFlag","chartSize","z","concat","scale","inMin","inMax","outMin","outMax","scaled","minSpacing","width","getMaxTicks","getInterval","largest","maxticks","minimum","magnitude","pow","log10","residual","interval","handleSliceKeyDown","ev","this","popoverEl","open","key","popoverBtn","querySelector","click","handleSliceClick","s","isTabbing","coords","clientX","clientY","openPopover","call","handleSliceFocus","getPosition","target","handleChartKeydown","preventDefault","focusPrevious","focusNext","exitChart","userIsNavigating","title","text","popoverTitle","popoverText","buttonText","sliceRef","window","setTimeout","_this","debouncedClosePopover_1","debounce","__awaiter","document","addEventListener","scrollableParent","findParentWithScrollbar","el","activeEl","checkForActiveElInShadow","activeElement","index","sliceEls","indexOf","length","focusSlice","componentWrapperEl","tabIndex","focusable","map","p","focus","getDetails","chartType","slicesDetails","acc","children","Array","from","reduce","slice","parseInt","getAttribute","forEach","c","i","amount","perc","colorIndex","notStartedColor","color","sliceDetails","legend","offset","uid","inSmallCluster","push","sortSlicesDetails","sortedSlicesDetails","__spreadArray","sort","a","b","idx","prev","next","prevPerc","nextPerc","isInSmallCluster","isSmall","prevIsSmall","nextIsSmall","lessThanOnePerc","getPathData","activeAngle","largeArcFlagOuter","largeArcFlagInner","chartDetails","innerRadius","outerRadius","isHybridDoughnut","outerSeparatorOffset","innerSeparatorOffset","outerCoords","innerCoords","moveTo","arc1","line","arc2","renderInstructionsText","chartInstructions","h","renderFilter","stdDeviation","result","operator","in2","in","renderDoughnut","outerSize","class","height","renderPath","transform","renderDoughnutText","fill","d","onClick","onFocus","onKeyDown","role","arcMiddle","_a","renderStackedBar","isHybridBar","drawAxis","tempValueFormat","renderBarText","renderStackedBarSegment","renderCompletionMessage","isLastSlice","style","backgroundColor","renderSimpleBar","numTicks","getBoundingClientRect","lastTickVal","extraTicks","setProperty","labelWidth","showBarLegend","rows","renderSimpleBarLegend","renderSimpleBarItem","ticks","tickVal","showGrid","show","hidden","chartMaxVal","currentChartType","amt","displayValue","renderLegend","showLegend","hasCluster","isBar","cur","mode","renderLegendItem","renderHiddenValuesMessage","legendItem","completionMessage"],"sources":["src/components/charts/chartFunctions.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\nimport { checkForActiveElInShadow, debounce, findParentWithScrollbar, getPosition, intl } from \"../../global/functions\";\nimport { LegendItem, ChartType, ChartDetails, SliceDetails, SliceElement } from \"../../global/interfaces\";\n\nconst colors = {\n  salmon: \"#ff5f4e\",\n  cyan: \"#19a1a9\",\n  forest: \"#088000\",\n  sleet: \"#7f97ad\",\n  midnight: \"#2e1b46\",\n  lavender: \"#8b86ca\",\n  periwinkle: \"#575195\",\n  gray: \"#6b6b6b\",\n};\n\nexport const allChartsDetails: { [Key in ChartType]: ChartDetails } = {\n  // for progress monitor\n  doughnut: {\n    size: 155,\n    colors: [colors.forest, colors.gray],\n    thickness: 0.73,\n    padding: 25,\n    category: \"doughnut\",\n  },\n  // deprecated hybrid chart type, should use Progress Indicator's \"doughnut\" instead\n  doughnut0: {\n    size: 155,\n    colors: [colors.forest, colors.gray],\n    thickness: 0.73,\n    padding: 25,\n    category: \"doughnut\",\n  },\n  doughnut1: {\n    size: 130,\n    colors: [colors.lavender, colors.midnight, colors.gray],\n    thickness: 0.5,\n    padding: 90,\n    category: \"doughnut\",\n  },\n  doughnut2: {\n    size: 130,\n    colors: [colors.cyan, colors.salmon, colors.gray],\n    thickness: 0.5,\n    padding: 90,\n    category: \"doughnut\",\n  },\n  // an internal type only for use when doughnut 2 is populated with 4 slices\n  // in this case, the first slice is colored purple\n  doughnut2plus: {\n    size: 130,\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\n    thickness: 0.5,\n    padding: 90,\n    category: \"doughnut\",\n  },\n  doughnut3: {\n    size: 130,\n    colors: [colors.lavender, colors.midnight, \"#0089e4\", colors.forest, \"#ea8500\", \"#d54f41\", \"#146ca9\"],\n    thickness: 0.5,\n    padding: 90,\n    category: \"doughnut\",\n  },\n  // for progress monitor\n  bar: {\n    size: 350,\n    colors: [colors.forest, colors.gray],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  // deprecated hybrid chart type, should use Progress Indicator's \"bar\" instead\n  bar1: {\n    size: 350,\n    colors: [colors.forest, colors.gray],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  bar2: {\n    size: 400,\n    colors: [colors.gray, colors.periwinkle, colors.cyan, colors.salmon],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  bar3: {\n    size: 300,\n    colors: [\"#0d696e\", colors.cyan, \"#8e4129\", colors.salmon],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  bar4: {\n    size: 400,\n    colors: [colors.salmon, colors.cyan, colors.periwinkle],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  bar5: {\n    size: 400,\n    colors: [\n      colors.gray, // this is only used if prop notStartedColor is set\n      colors.lavender,\n      colors.midnight,\n      \"#0089e4\",\n      colors.forest,\n      \"#ea8500\",\n      \"#d54f41\",\n      \"#146ca9\",\n    ],\n    padding: 0,\n    category: \"stackedBar\",\n  },\n  bar6: {\n    size: 400,\n    colors: [colors.lavender],\n    padding: 0,\n    category: \"simpleBar\",\n  },\n  bar7: {\n    size: 400,\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\n    padding: 0,\n    category: \"simpleBar\",\n  },\n};\n\nfunction showValue(valueFormat: string): string {\n  return valueFormat === \"percentage\" || valueFormat === \"amount\" ? \"show-values\" : \"\";\n}\n\nexport const textHiddenMessage = intl.formatMessage({\n  id: \"chart.hiddenValues\",\n  defaultMessage: \"Values are not shown when too close to each other.\",\n  description: \"Text displayed when a chart has some values hidden\",\n});\n\nexport const seeDetailsMessage = intl.formatMessage({\n  id: \"chart.clickToSeeDetails\",\n  defaultMessage: \"Click or use arrow keys to see details.\",\n  description: \"Text displayed, guiding user to interact to see more details.\",\n});\n\nfunction abbrNumber(num: number) {\n  return num > 999 ? Math.round(num / 100) / 10 + \"K\" : num;\n}\n\nexport function amountToPercent(val: number, total: number, asInt: boolean) {\n  return asInt ? Math.round((val * 100) / total) : Math.round((val * 10000) / total) / 100; // with 2 decimals\n}\n\nexport function amountToDegree(val: number, total: number) {\n  // In a circle of {total}, determine degrees of slice {val}\n  return (val * 360) / total;\n}\n\nexport function toFixed(number: number) {\n  return parseFloat((Math.floor(number * 100) / 100).toFixed(2));\n}\n\nexport function polarToCartesian(half: number, radius: number, startAngle: number, endAngle?: number) {\n  var x = toFixed(half + half * radius * Math.cos((Math.PI * startAngle) / 180));\n  var y = toFixed(half + half * radius * Math.sin((Math.PI * startAngle) / 180));\n  if (endAngle !== undefined) {\n    // if a 2nd angle value was passed, return 2 pairs of coords\n    var x2 = toFixed(half + half * radius * Math.cos((Math.PI * endAngle) / 180));\n    var y2 = toFixed(half + half * radius * Math.sin((Math.PI * endAngle) / 180));\n    return { x1: x, y1: y, x2, y2 };\n  }\n  return { x, y };\n}\n\nfunction getArc(radius: number, largeArcFlag: string, x: number, y: number, chartSize: number) {\n  var z = toFixed((chartSize / 2) * radius);\n  return `A ${z}, ${z} 0 ${largeArcFlag} ${toFixed(x)}, ${toFixed(y)}`;\n}\n\nfunction scale(val: number, inMin: number, inMax: number, outMin: number, outMax: number) {\n  let scaled = ((val - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin;\n  // clip the values so that whatever is passed in the output is never smaller than outMin or greater than outMax\n  return scaled < outMin ? outMin : scaled > outMax ? outMax : scaled;\n}\n\nfunction minSpacing(width: number) {\n  // minimum spacing between 2 ticks, in px\n  return scale(width, 300, 900, 70, 150);\n}\n\nfunction getMaxTicks(width: number) {\n  return Math.round(width / minSpacing(width));\n}\n\nfunction getInterval(largest: number, maxticks: number) {\n  const minimum = largest / maxticks;\n  const magnitude = 10 ** Math.floor(Math.log10(minimum));\n  const residual = minimum / magnitude;\n  let interval;\n  if (residual > 5) {\n    interval = 10 * magnitude;\n  } else if (residual > 3) {\n    interval = 5 * magnitude;\n  } else if (residual > 2) {\n    interval = 3 * magnitude;\n  } else if (residual > 1.5) {\n    interval = 2 * magnitude;\n  } else if (residual > 1) {\n    interval = 1.5 * magnitude;\n  } else {\n    interval = magnitude;\n  }\n  return interval;\n}\n\nfunction handleSliceKeyDown(this: any, ev: KeyboardEvent) {\n  if (this.popoverEl && this.popoverEl.open && ev.key === \"Enter\") {\n    const popoverBtn = this.popoverEl.querySelector(\"button\");\n    popoverBtn && popoverBtn.click();\n  }\n}\n\nexport function handleSliceClick(this: any, ev: MouseEvent, s: SliceDetails) {\n  if (this.popoverEl && !this.isTabbing) {\n    s.coords = { x: ev.clientX, y: ev.clientY };\n    openPopover.call(this, s);\n  }\n}\n\nfunction handleSliceFocus(this: any, ev: FocusEvent, s: SliceDetails) {\n  if (this.popoverEl && this.isTabbing) {\n    s.coords = getPosition(ev.target as HTMLElement);\n    openPopover.call(this, s);\n  }\n}\n\nexport function handleChartKeydown(this: any, ev: KeyboardEvent) {\n  switch (ev.key) {\n    // arrow up / left\n    case \"ArrowUp\":\n    case \"ArrowLeft\":\n      ev.preventDefault();\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\n      focusPrevious.call(this);\n      break;\n    // arrow right / down\n    case \"ArrowRight\":\n    case \"ArrowDown\":\n      ev.preventDefault();\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\n      focusNext.call(this);\n      break;\n    // tab\n    case \"Tab\":\n      exitChart.call(this);\n      break;\n    case \"Escape\":\n      this.popoverEl!.open = false;\n      this.userIsNavigating = false;\n      break;\n  }\n}\n\nexport function openPopover(this: any, s: SliceDetails) {\n  if (!!this.popoverEl && !!s.title && !!s.text) {\n    this.popoverEl.popoverTitle = s.title;\n    this.popoverEl.popoverText = s.text;\n    this.popoverEl.buttonText = s.buttonText;\n    this.popoverEl.coords = s.coords;\n    this.popoverEl.sliceRef = s.sliceRef;\n    window.setTimeout(() => {\n      if (this.popoverEl) {\n        this.popoverEl.open = true;\n      }\n    }, 30);\n\n    const debouncedClosePopover = debounce(async () => {\n      this.popoverEl!.open = false;\n    }, 10);\n\n    // set up event listeners for scrolling\n    // to close popover on page scroll\n    document.addEventListener(\"scroll\", () => {\n      debouncedClosePopover();\n    });\n\n    // ... and on parent scroll\n    const scrollableParent = findParentWithScrollbar(this.el as HTMLElement);\n    if (!!scrollableParent) {\n      scrollableParent.addEventListener(\"scroll\", () => {\n        debouncedClosePopover();\n      });\n    }\n  }\n}\n\nfunction focusNext(this: any) {\n  const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\n  const index =\n    // if the active el is not in the array the first element gets focused\n    (this.sliceEls!.indexOf(activeEl as HTMLElement) + 1) % this.sliceEls!.length;\n  focusSlice.call(this, index);\n}\n\nfunction focusPrevious(this: any) {\n  if (this.sliceEls) {\n    const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\n    let index = this.sliceEls.indexOf(activeEl as SliceElement);\n\n    if (index === -1) {\n      // not in the array : focus the first slice\n      index = 0;\n    } else if (index === 0) {\n      // first slice : focus the last slice\n      index = this.sliceEls.length - 1;\n    } else {\n      // anything else: focus previous\n      index -= 1;\n    }\n    focusSlice.call(this, index);\n  }\n}\n\nfunction focusSlice(this: any, index: number) {\n  if (this.sliceEls && this.el) {\n    this.userIsNavigating = true;\n    if (this.popoverEl) {\n      this.popoverEl.open = false;\n    }\n    // set tabindex of the wrapper to -1 while slices are being focused, to allow for shft-tabbing out of the component directly\n    this.componentWrapperEl.tabIndex = -1;\n    // @ts-ignore\n    this.el.focusable = false; // for Edge\n    this.sliceEls.map((p: SliceElement) => {\n      p.tabIndex = -1;\n      // @ts-ignore\n      p.focusable = false; // for Edge\n    });\n    this.sliceEls[index].tabIndex = 0;\n    // @ts-ignore\n    this.sliceEls[index].focusable = true; // for Edge\n    this.sliceEls[index].focus();\n    window.setTimeout(() => {\n      if (this.popoverEl) {\n        this.popoverEl.open = true;\n      }\n    }, 10);\n  }\n}\n\nexport function exitChart(this: any) {\n  this.sliceEls &&\n    this.sliceEls.map((p: SliceElement) => {\n      p.tabIndex = -1;\n      // @ts-ignore\n      p.focusable = false; // for Edge\n    });\n  this.userIsNavigating = false;\n  // delay so that we can tab out of component before chart becomes focusable again\n  // and in case user was still pressing an arrow key when they pressed tab\n  window.setTimeout(() => {\n    this.componentWrapperEl.tabIndex = 0;\n    // @ts-ignore\n    this.el.focusable = true; // for Edge\n    if (this.popoverEl) {\n      this.popoverEl.open = false;\n    }\n  }, 100);\n}\n\nexport async function getDetails(this: any, chartType: ChartType) {\n  this.slicesDetails = [];\n  let acc = 0;\n  const children = Array.from(this.el.children) as Array<HTMLWmChartSliceElement>;\n\n  this.total = children.reduce(\n    (total: number, slice: SliceElement) => (total += parseInt(slice.getAttribute(\"amount\") || \"0\")),\n    0\n  );\n\n  children.forEach((c: Element, i: number) => {\n    const amount = parseInt(c.getAttribute(\"amount\") || \"0\");\n    const perc = amountToPercent(amount, this.total, true);\n\n    let colorIndex = i;\n\n    // for bar5, first color should be skipped unless notStartedColor is set to true\n    if (chartType === \"bar5\") {\n      colorIndex = this.notStartedColor ? i : i + 1;\n    }\n\n    // bars in bar6 are all the same color\n    if (chartType === \"bar6\") {\n      colorIndex = 0;\n    }\n\n    const color = allChartsDetails[chartType].colors[colorIndex];\n\n    const sliceDetails: SliceDetails = {\n      amount: amount,\n      perc: perc,\n      legend: c.getAttribute(\"legend\"),\n      color: color || colors.gray,\n      offset: acc,\n      id: `${this.uid}-${i + 1}`,\n      title: c.getAttribute(\"popover-title\"),\n      text: c.getAttribute(\"popover-text\"),\n      buttonText: c.getAttribute(\"popover-button-text\"),\n      sliceRef: c,\n      inSmallCluster: false,\n    };\n    acc += amount;\n    this.slicesDetails.push(sliceDetails);\n  });\n}\n\nfunction sortSlicesDetails(slicesDetails: SliceDetails[], total: number): SliceDetails[] {\n  // sort slices by decreasing amount\n  let sortedSlicesDetails = [...slicesDetails].sort((a: SliceDetails, b: SliceDetails) =>\n    a.amount === b.amount ? 0 : a.amount > b.amount ? -1 : 1\n  );\n\n  let acc = 0;\n\n  sortedSlicesDetails.forEach((s: SliceDetails, idx: number) => {\n    const prev = sortedSlicesDetails[idx === 0 ? sortedSlicesDetails.length - 1 : idx - 1];\n    const next = sortedSlicesDetails[idx === sortedSlicesDetails.length - 1 ? 0 : idx + 1];\n    const prevPerc = amountToPercent(prev.amount, total, true);\n    const nextPerc = amountToPercent(next.amount, total, true);\n\n    s.offset = acc;\n    acc += s.amount;\n    s.inSmallCluster = isInSmallCluster(prevPerc, s.perc, s.amount, nextPerc);\n  });\n  return sortedSlicesDetails;\n}\n\nfunction isInSmallCluster(prevPerc: number, perc: number, amount: number, nextPerc: number): boolean {\n  // determine whether the slice is in a cluster of small values\n  // to avoid percentage text overlap for small values\n  const isSmall = perc < 4;\n  const prevIsSmall = prevPerc < 5;\n  const nextIsSmall = nextPerc < 5;\n  let inSmallCluster = isSmall && (prevIsSmall || nextIsSmall);\n\n  // because <1% slice percentage text has an additional character\n  // the inSmallCluster threshold needs to be widened for that slice only\n  const lessThanOnePerc = perc === 0 && amount > 0;\n  if (lessThanOnePerc && (nextPerc < 8 || prevPerc < 8)) {\n    inSmallCluster = true;\n  }\n\n  return inSmallCluster;\n}\n\nfunction getPathData(this: any, amount: number, offset: number, chartType: ChartType) {\n  const startAngle = amountToDegree(offset, this.total) - 90; // start at noon, not at 3 o'clock\n  const activeAngle = (amount / this.total) * 360;\n  let endAngle = startAngle + activeAngle;\n  const largeArcFlagOuter = activeAngle > 180 ? \"1 1\" : \"0 1\";\n  const largeArcFlagInner = activeAngle > 180 ? \"1 0\" : \"0 0\";\n  const half = this.chartDetails.size / 2;\n  const innerRadius = this.chartDetails.thickness!;\n  const outerRadius = 1;\n\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\n  const outerSeparatorOffset = 1.5;\n  const innerSeparatorOffset = isHybridDoughnut ? 2.25 : 3;\n\n  if (activeAngle === 360) {\n    // fix to avoid bad svg shape when the path goes all around (100%)\n    endAngle -= 0.01;\n  }\n\n  const outerCoords = polarToCartesian(\n    half,\n    outerRadius,\n    startAngle + outerSeparatorOffset, // Addition for slice separator\n    endAngle\n  );\n  const innerCoords = polarToCartesian(\n    half,\n    innerRadius,\n    startAngle + innerSeparatorOffset, // Addition for slice separator\n    endAngle\n  );\n\n  const moveTo = `M ${outerCoords.x1}, ${outerCoords.y1} `;\n  const arc1 = getArc(outerRadius, largeArcFlagOuter, outerCoords.x2!, outerCoords.y2!, this.chartDetails.size);\n  const line = ` L ${innerCoords.x2}, ${innerCoords.y2} `;\n  const arc2 = getArc(innerRadius, largeArcFlagInner, innerCoords.x1!, innerCoords.y1!, this.chartDetails.size);\n\n  return moveTo + arc1 + line + arc2 + \" z\";\n}\n\nexport function renderInstructionsText() {\n  const chartInstructions = intl.formatMessage({\n    id: \"chart.instructions\",\n    defaultMessage: \"Use arrow keys to browse elements, press Tab to exit.\",\n    description: \"For screen readers only, instructions on how to interact with the chart component\",\n  });\n\n  return <div id=\"chart-instructions\">{chartInstructions}</div>;\n}\n\nfunction renderFilter() {\n  return (\n    <defs>\n      <filter id=\"wmHoverDropShadow\">\n        <feGaussianBlur stdDeviation=\"3\"></feGaussianBlur>\n        <feOffset result=\"offsetblur\"></feOffset>\n        <feFlood flood-color=\"#333\"></feFlood>\n        <feComposite operator=\"in\" in2=\"offsetblur\"></feComposite>\n        <feMerge>\n          <feMergeNode></feMergeNode>\n          <feMergeNode in=\"SourceGraphic\"></feMergeNode>\n        </feMerge>\n      </filter>\n    </defs>\n  );\n}\n\nexport function renderDoughnut(this: any, chartType: ChartType) {\n  const outerSize = this.chartDetails.size + this.chartDetails.padding;\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\n  // no sorting in progress indicators\n  let slicesDetails = isHybridDoughnut ? this.slicesDetails : sortSlicesDetails(this.slicesDetails, this.total);\n\n  return (\n    <div class=\"chart-wrapper doughnut-wrapper\">\n      <svg width={outerSize + \"px\"} height={outerSize + \"px\"} id={`graphic-${this.uid}`} class=\"doughnut-svg\">\n        {renderFilter()}\n        {slicesDetails.map((s: SliceDetails) => renderPath.call(this, s, chartType))}\n        {isHybridDoughnut ? (\n          <text\n            class=\"value\"\n            x=\"50%\"\n            y=\"50%\"\n            font-size=\"1.5rem\"\n            font-weight=\"500\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"middle\"\n          >\n            {amountToPercent(slicesDetails[0].amount, this.total, true) + \"%\"}\n          </text>\n        ) : (\n          <g\n            transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}\n            text-anchor=\"middle\"\n            dominant-baseline=\"middle\"\n          >\n            {slicesDetails.map((s: SliceDetails) =>\n              s.amount > 0 && !s.inSmallCluster ? renderDoughnutText.call(this, s) : \"\"\n            )}\n          </g>\n        )}\n      </svg>\n    </div>\n  );\n}\n\nfunction renderPath(this: any, s: SliceDetails, chartType: ChartType) {\n  return (\n    <g transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}>\n      <path\n        id={s.id}\n        class=\"segment doughnut-segment\"\n        fill={s.amount ? s.color : \"transparent\"}\n        d={getPathData.call(this, s.amount, s.offset, chartType)}\n        onClick={(ev) => handleSliceClick.call(this, ev, s)}\n        onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\n        onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\n        role=\"img\"\n        aria-label={s.legend}\n      ></path>\n    </g>\n  );\n}\n\nfunction renderDoughnutText(this: any, s: SliceDetails) {\n  const arcMiddle = amountToDegree(s.offset + s.amount / 2, this.total);\n  let { x, y } = polarToCartesian(this.chartDetails.size / 2, 1.4, arcMiddle - 90);\n  return (\n    <text class=\"value\" x={x + \"px\"} y={y + \"px\"}>\n      {`${s.perc > 0 ? s.perc : \"<1\"}%`}\n    </text>\n  );\n}\n\nexport function renderStackedBar(this: any, chartType: ChartType) {\n  const isHybridBar = chartType === \"bar1\" || chartType === \"bar\";\n  return (\n    <div class=\"chart-wrapper bar-wrapper\">\n      {isHybridBar ? (\n        <div class=\"single-perc\">{amountToPercent(this.slicesDetails[0].amount, this.total, true) + \"%\"}</div>\n      ) : (\n        \"\"\n      )}\n      {this.chartType === \"bar3\" && this.drawAxis()}\n      <div class={`inner-stacked-bar-wrapper ${showValue(this.tempValueFormat)}`}>\n        {!isHybridBar ? (\n          <div class=\"values\">\n            {this.slicesDetails.map((s: SliceDetails, idx: number) => this.renderBarText(s, idx))}\n          </div>\n        ) : (\n          \"\"\n        )}\n        <div class=\"stacked-bar-segments-wrapper\">\n          {this.slicesDetails.map((s: SliceDetails, idx: number) => renderStackedBarSegment.call(this, s, idx))}\n        </div>\n        {isHybridBar ? renderCompletionMessage.call(this) : \"\"}\n      </div>\n    </div>\n  );\n}\n\nfunction renderStackedBarSegment(this: any, s: SliceDetails, idx: number) {\n  const isLastSlice = idx !== this.slicesDetails.length - 1;\n  const width = `calc(${amountToPercent(s.amount, this.total, false)}%${isLastSlice ? \" - 2px\" : \"\"})`;\n\n  return (\n    <div\n      class={`segment stacked-bar-segment ${amountToPercent(s.amount, this.total, false) === 0 ? \"zero\" : \"\"}`}\n      style={{\n        backgroundColor: s.color,\n        width: width,\n      }}\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\n    >\n      <span class=\"sr-only\">{s.legend}</span>\n    </div>\n  );\n}\n\nexport function renderSimpleBar(this: any, chartType: ChartType) {\n  // find largest number and get interval, numTicks, chartMaxVal for all.\n  const largest = this.slicesDetails\n    .map((s: SliceDetails) => s.amount)\n    .reduce((a: number, b: number) => {\n      return a > b ? a : b;\n    });\n  let numTicks = getMaxTicks(this.el.getBoundingClientRect().width);\n  let interval = getInterval(largest, numTicks);\n  // after the algorithm finds an interval, remove extra ticks so that the greater number is always between the last tick and the one before that\n  const lastTickVal = numTicks * interval;\n  const extraTicks = Math.floor((lastTickVal - largest) / interval);\n  numTicks -= extraTicks;\n\n  this.el.style.setProperty(\"--backgroundSize\", 100 / numTicks + \"%\");\n  this.el.style.setProperty(\"--labelWidth\", this.labelWidth);\n\n  if (chartType === \"bar7\" && !this.showBarLegend) {\n    this.el.style.setProperty(\"--labelWidth\", \"0px\");\n  }\n\n  // we have to prep the data here rather than iterate directly in the return statement\n  // because CSS grid needs a flat structure, and return functions must\n  // have a single parent element\n  const rows: HTMLElement[] = [];\n  this.slicesDetails.forEach((s: SliceDetails) => {\n    s.legend && rows.push(renderSimpleBarLegend(s.legend, this.showBarLegend, chartType));\n    rows.push(renderSimpleBarItem.call(this, s, interval, numTicks, largest));\n  });\n\n  const ticks = [];\n  for (let i = 1; i <= numTicks; i++) {\n    const tickVal: number | string = abbrNumber(i * interval);\n    ticks.push(\n      <div class=\"tick\">\n        <span>{tickVal}</span>\n      </div>\n    );\n  }\n\n  const showGrid = chartType === \"bar6\" && this.showGrid && this.el.getBoundingClientRect().width > 300;\n\n  return (\n    <div class=\"chart-wrapper simple-bar-wrapper\">\n      <div class={`chart ${showValue(this.tempValueFormat)}`}>\n        {showGrid && <div class=\"gridlines\"></div>}\n        <div class=\"rows\">{rows}</div>\n      </div>\n      {showGrid && (\n        <div class=\"x-axis\" aria-hidden=\"true\">\n          <div class=\"zero\">\n            <span>0</span>\n          </div>\n          {ticks}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction renderSimpleBarLegend(legend: string, show: boolean, chartType: ChartType): HTMLLabelElement {\n  // not sure how to collapse the left column to 0 width with CSS grid. text should still be available to SR.\n  const hidden = chartType === \"bar7\" && !show ? \" hidden\" : \"\";\n  return <label class={`label${hidden}`}>{legend}</label>;\n}\n\nfunction renderSimpleBarItem(\n  this: any,\n  s: SliceDetails,\n  interval: number,\n  ticks: number,\n  largest: number\n): HTMLDivElement {\n  const chartMaxVal = this.currentChartType === \"bar6\" ? interval * ticks : largest;\n  const width = amountToPercent(s.amount, chartMaxVal, false);\n  const amt = abbrNumber(s.amount);\n  let displayValue = this.tempValueFormat === \"amount\" ? amt : \"\";\n  if (this.currentChartType === \"bar6\" && this.tempValueFormat === \"percentage\") {\n    displayValue = s.amount + \"%\";\n  } else if (this.currentChartType === \"bar7\" && this.tempValueFormat === \"percentage\") {\n    displayValue = amountToPercent(s.amount, this.total, true) + \"%\";\n  }\n\n  return (\n    <div\n      class={\"bar segment\"}\n      style={{\n        backgroundColor: s.color,\n        width: width + \"%\",\n      }}\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\n    >\n      <div class=\"value\">{displayValue}</div>\n    </div>\n  );\n}\n\nexport function renderLegend(this: any, chartType: ChartType) {\n  // legend is hidden for bar1 and bar6 types regardless of showLegend value\n  if (this.showLegend) {\n    const hasCluster =\n      !this.chartDetails.isBar &&\n      this.slicesDetails.reduce(\n        (hasCluster: boolean, cur: SliceDetails) => (hasCluster = cur.inSmallCluster ? true : hasCluster),\n        false\n      );\n    return (\n      <div class=\"legend-wrapper\">\n        <div class={`legend ${chartType} ${this.mode === \"bar\" ? \"--top\" : \"--bottom\"}`} aria-hidden=\"true\">\n          {this.total > 0\n            ? this.slicesDetails.map((s: SliceDetails) => {\n                // when both legend and amount are omitted, the legend is not shown for that particular option (it's been deactivated by the user)\n                if (!!s.amount || !!s.legend) {\n                  return renderLegendItem({ key: s.legend!, color: s.color });\n                }\n              })\n            : \"\"}\n        </div>\n        {hasCluster && renderHiddenValuesMessage()}\n      </div>\n    );\n  }\n}\n\nexport function renderLegendItem(legendItem: LegendItem) {\n  return (\n    <div class=\"legend-item\">\n      <div class=\"legend-color\" style={{ backgroundColor: legendItem.color }}></div>\n      <div class=\"legend-text\">{legendItem.key}</div>\n    </div>\n  );\n}\n\nexport function renderCompletionMessage(this: any) {\n  if (this.completionMessage) {\n    return <div class=\"completion-message\">{this.completionMessage}</div>;\n  }\n}\n\nexport function renderHiddenValuesMessage() {\n  return (\n    <div class=\"hidden-values-warning\">\n      {textHiddenMessage}\n      <br />\n      {seeDetailsMessage}\n    </div>\n  );\n}\n"],"mappings":"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"}