@watermarkinsights/ripple 3.24.0 → 3.24.1

package/dist/ripple/p-54f29e18.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmOptionCss","Option","undefined","hostClasses","classes","this","subinfo","push","parentSelectEl","multiple","el","textContent","toLowerCase","includes","searchTerm","join","_a","parentElement","nodeName","getRootNode","host","handleKeydown","ev","key","preventDefault","wmKeyUpPressed","emit","wmKeyDownPressed","disabled","click","wmEnterKeyPressed","stopPropagation","wmEscKeyPressed","wmHomeKeyPressed","wmEndKeyPressed","length","wmLetterPressed","handleSelection","wmOptionSelected","handleBlur","wmOptionBlurred","relatedTarget","syncAriaSelected","selected","setAttribute","removeAttribute","syncAriaDisabled","updateDisabledOnClick","onclick","onClickFunc","handleSearch","detail","regexp","RegExp","boldedText","replace","match","textEl","innerHTML","componentWillLoad","addEventListener","render","h","Host","role","tabindex","focused","class","ref","wmSelectCss","Select","requiredMessage","intl","formatMessage","id","defaultMessage","selectAllMessage","deselectAllMessage","allOptionsSelectedMessage","allOptionsDeselectedMessage","keysSoFar","searchIndex","openUp","overflowCount","displayedOptions","debouncedClearKeysSoFar","debounce","debouncedSearch","wmSelectSearchChanged","filteredOptions","announce","resultsFoundMessage","noResultsFoundMessage","description","childOptions","Array","from","querySelectorAll","duplicateOptions","shadowRoot","allOptionEls","concat","visibleOptionEls","filter","option","classList","contains","searchFieldEl","value","selectedOptions","x","allSelected","every","numResults","toggleTabbingOn","isTabbing","toggleTabbingOff","handleOptionSelection","focusOption","selectOption","changedOption","wmSelectChanged","event","CustomEvent","dispatchEvent","close","isDuplicate","originalOption","findCorrespondingOption","o","handleChildEnter","handleChildUp","moveUp","handleChildDown","moveDown","moveToFirstOption","moveToLastOption","closePopupOnEscape","handleOptionBlur","isElOrChild","handleClick","target","handleSelectAllClick","deselectAllOptions","selectAllOptions","forEach","setSelectAllButton","setButtonText","handleButtonBlur","handleSearchFieldBlur","searchFieldWrapperEl","remove","handleKey","isExpanded","open","label","console","error","uid","generateId","document","body","componentDidLoad","wmSelectDidLoad","dropdownEl","add","forceUpdate","maxHeight","listboxEl","style","updateOptionVisibility","componentWillUpdate","visibleDuplicateOptions","idx","focusableEls","selectAllEl","unshift","prevEl","indexOf","nextEl","optionToSelect","elHeight","clientHeight","buttonHeight","buttonEl","shouldOpenUp","window","requestAnimationFrame","search","focus","scrollTop","slice","returnFocus","map","i","setTimeout","duplicateOption","scrollIntoView","block","correspondingOption","findAndFocusOption","character","nextMatch","findMatchInRange","list","startIndex","endIndex","optionsInRange","startsWith","exposeErrors","newId","errorContainer","renderErrorContainer","errorMessage","handleComponentBlur","wmSelectBlurred","wmComponentBlurred","handleKeyDown","y","overflowCounterWidth","computedStyle","getComputedStyle","paddingLeft","parseInt","getPropertyValue","paddingRight","availableSpace","clientWidth","optionsWidths","querySelector","optionsTotalWidth","reduce","acc","pop","message","liveRegionEl","announcement","renderButtonText","placeholder","allSelectedMessage","renderSubinfo","renderOverflowCount","renderSearchField","onKeyDown","onFocus","onBlur","onInput","searchPlaceholder","renderSearchFailedMessage","renderSelectAllButton","selectAll","onClick","renderDuplicateOptions","children","buttonProps","getTextDir","labelPosition","invalid","htmlFor","requiredField","Object","assign"],"sources":["./src/components/wm-option/wm-option.scss?tag=wm-option&encapsulation=shadow","./src/components/wm-option/wm-option.tsx","./src/components/wm-select/wm-select.scss?tag=wm-select&encapsulation=shadow","./src/components/wm-select/wm-select.tsx"],"sourcesContent":[":host(:not(:last-child)),\nwm-option:not(:last-child) {\n  border-bottom: 2px solid $list-border-bottom-color;\n}\n\n:host,\nwm-option {\n  display: block;\n  cursor: pointer;\n  position: relative;\n  padding: rem-calc(20);\n  background: $light-background;\n  font-family: inherit;\n  list-style: none;\n  color: $body-text-color;\n  user-select: none;\n\n  &:focus,\n  &.focus {\n    outline: none;\n    background: $background;\n  }\n\n  &.icon {\n    color: $button-default-text;\n  }\n\n  .sr-only {\n    @include srOnly;\n  }\n}\n\n.checkbox {\n  &:before {\n    @include mdi-icon;\n    content: \"\\f131\";\n    display: inline;\n    margin-right: rem-calc(4);\n    color: $periwinkle;\n  }\n}\n\n:host([aria-selected=\"true\"]),\nwm-option[aria-selected=\"true\"] {\n  background: $list-selected-background-color;\n  font-weight: 500;\n\n  .checkbox {\n    &:before {\n      content: \"\\f132\";\n    }\n  }\n}\n\n:host([aria-disabled=\"true\"]),\nwm-option[aria-disabled=\"true\"] {\n  font-style: italic;\n  color: $gray;\n  cursor: default;\n\n  .checkbox {\n    &:before {\n      color: $gray;\n    }\n  }\n}\n\n:host(.multi-option),\nwm-option.multi-option {\n  background: unset;\n}\n\n:host(.hidden),\nwm-option.hidden,\n:host(.filtered-out),\nwm-option.filtered-out {\n  display: none;\n}\n\n:host(.duplicate.last),\nwm-option.duplicate.last {\n  border-bottom: 12px solid $list-border-bottom-color;\n}\n\n:host(.hassubinfo),\nwm-option.hassubinfo {\n  display: flex;\n\n  .option-wrapper {\n    flex: 1;\n  }\n  .subinfo {\n    flex: none;\n  }\n}\n\n.subinfo {\n  font-style: italic;\n}\n\n.option-wrapper {\n  // necessary for multiselect overflow measurement\n  display: inline-block;\n}\n\n::slotted {\n  font-family: inherit;\n}\n\n::slotted(i) {\n  font-size: rem-calc(14);\n\n  &:before {\n    @include mdi-icon;\n    display: inline-block;\n    margin-right: rem-calc(10);\n    pointer-events: none;\n  }\n}\n\n:host(:focus),\nwm-option:focus {\n  outline: none;\n  background: $background;\n}\n\n:host(:hover) {\n  background: $background;\n  outline: none;\n}\n","import { h, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-option\",\n  styleUrl: \"wm-option.scss\",\n  shadow: true,\n})\nexport class Option {\n  @Element() el!: HTMLElement;\n\n  @Prop() value?: string | null; // if devs pass a value as attribute they should be able to retrieve it by querying the property. This is untouched by the component.\n  @Prop({ mutable: true }) subinfo?: string = undefined;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  @Prop({ reflect: true }) selected: boolean = false;\n  @Prop() focused: boolean = false;\n\n  @Event() wmOptionSelected!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmKeyUpPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmKeyDownPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmEscKeyPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmHomeKeyPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmEndKeyPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmEnterKeyPressed!: EventEmitter<HTMLWmOptionElement>;\n  @Event() wmLetterPressed!: EventEmitter<string>;\n  @Event() wmOptionBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\n\n  private onClickFunc!: (this: GlobalEventHandlers, ev: MouseEvent) => any;\n  @State() searchTerm: string = \"\";\n  private textEl!: HTMLDivElement;\n\n  get hostClasses() {\n    let classes = [];\n    if (this.subinfo) {\n      classes.push(\"hassubinfo\");\n    }\n    if (this.parentSelectEl.multiple) {\n      classes.push(\"multi-option\");\n    }\n    if (!this.el.textContent!.toLowerCase().includes(this.searchTerm)) {\n      classes.push(\"filtered-out\");\n    }\n    return classes.join(\" \");\n  }\n\n  get parentSelectEl() {\n    return this.el.parentElement?.nodeName !== \"WM-SELECT\"\n      ? ((this.el.getRootNode() as ShadowRoot).host as HTMLWmSelectElement)\n      : (this.el.parentElement as HTMLWmSelectElement);\n  }\n\n  @Listen(\"keydown\")\n  handleKeydown(ev: KeyboardEvent) {\n    switch (ev.key) {\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.wmKeyUpPressed.emit(this.el as HTMLWmOptionElement);\n        break;\n\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.wmKeyDownPressed.emit(this.el as HTMLWmOptionElement);\n        break;\n\n      case \"Enter\":\n        ev.preventDefault();\n        if (!this.disabled) {\n          this.el.click();\n          this.wmEnterKeyPressed.emit(this.el as HTMLWmOptionElement);\n        }\n        break;\n\n      case \" \":\n        ev.preventDefault();\n        this.el.click();\n        break;\n\n      case \"Escape\":\n        ev.preventDefault();\n        ev.stopPropagation(); // for instance if select is in a modal, esc should close the select but not the modal\n        this.wmEscKeyPressed.emit();\n        break;\n\n      case \"Home\":\n        ev.preventDefault();\n        this.wmHomeKeyPressed.emit();\n        break;\n\n      case \"End\":\n        ev.preventDefault();\n        this.wmEndKeyPressed.emit();\n        break;\n\n      default:\n        if (ev.key.length === 1) {\n          // emit for single characters (\"a\",\"l\",\"5\", etc), avoid others (\"shift\", \"control\", etc)\n          this.wmLetterPressed.emit(ev.key);\n        }\n    }\n  }\n\n  @Listen(\"click\")\n  handleSelection() {\n    if (!this.disabled) {\n      // the parent wm-select is in charge of the actual selection\n      // using ev.detail because ev.target returns the wm-select for duplicate options\n      this.wmOptionSelected.emit(this.el as HTMLWmOptionElement);\n    }\n  }\n\n  @Listen(\"blur\")\n  handleBlur(ev: FocusEvent) {\n    this.wmOptionBlurred.emit({ relatedTarget: ev.relatedTarget });\n  }\n\n  @Watch(\"selected\")\n  syncAriaSelected() {\n    // this function only keeps the aria-selected attr in sync with the selected prop\n    // all the logic for selecting / deselecting happens in the parent wm-select\n    this.selected ? this.el.setAttribute(\"aria-selected\", \"true\") : this.el.removeAttribute(\"aria-selected\");\n  }\n\n  @Watch(\"disabled\")\n  syncAriaDisabled() {\n    this.disabled ? this.el.setAttribute(\"aria-disabled\", \"true\") : this.el.removeAttribute(\"aria-disabled\");\n  }\n\n  @Watch(\"disabled\")\n  updateDisabledOnClick() {\n    if (this.disabled && this.el.onclick) {\n      this.onClickFunc = this.el.onclick;\n      this.el.onclick = null;\n    } else if (!this.disabled && this.onClickFunc) {\n      this.el.onclick = this.onClickFunc;\n    }\n  }\n\n  handleSearch(ev: CustomEvent) {\n    // filter is case-insensitive, so\n    this.searchTerm = ev.detail.searchTerm.toLowerCase();\n\n    if (this.searchTerm) {\n      const regexp = new RegExp(`${this.searchTerm}`, \"gi\");\n      const boldedText = this.el.textContent!.replace(regexp, (match) => `<strong>${match}</strong>`);\n      // for voiceover, text splitting is read as separate phrases. i.e. hel<b>lo</b> will be read as \"hel lo\"\n      // aria-hidden and sr-only is used to circumvent this\n      this.textEl.innerHTML = boldedText;\n    } else {\n      this.textEl.innerHTML = this.el.textContent!;\n    }\n  }\n\n  componentWillLoad() {\n    this.syncAriaSelected();\n    this.syncAriaDisabled();\n    this.updateDisabledOnClick();\n\n    this.parentSelectEl.addEventListener(\"wmSelectSearchChanged\", (ev) => this.handleSearch(ev as CustomEvent));\n  }\n\n  render() {\n    return (\n      <Host role=\"option\" tabindex={this.focused ? 0 : -1} class={this.hostClasses}>\n        <div class={`option-wrapper ${this.parentSelectEl.multiple ? \"checkbox\" : \"\"}`}>\n          <span aria-hidden=\"true\" ref={(el) => (this.textEl = el as HTMLDivElement)}>\n            {this.el.textContent}\n          </span>\n          <span class=\"sr-only\">{this.el.textContent}</span>\n        </div>\n        <div class=\"subinfo\">{this.subinfo}</div>\n      </Host>\n    );\n  }\n}\n",":host {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  font-family: inherit;\n\n  .sr-only {\n    @include srOnly;\n  }\n}\n\n@include label;\n\n.wrapper {\n  & .button-wrapper {\n    position: relative;\n    flex: 1;\n    font-size: rem-calc(18);\n    color: $button-default-text;\n    min-width: rem-calc(140);\n\n    .displayedoption {\n      @include border-radius(3px);\n      @include box-shadow(none);\n      display: flex;\n      align-items: center;\n      flex-wrap: nowrap;\n      background: transparent;\n      width: 100%;\n      border: solid 1px rgba(35, 35, 35, 0.6);\n      padding: rem-calc(0 30 0 15);\n      cursor: pointer;\n      height: rem-calc(40);\n      line-height: normal;\n      font-family: inherit;\n      color: $button-default-text;\n      font-weight: 400;\n      font-size: rem-calc(14);\n      text-transform: none;\n      text-align: left;\n\n      @media only screen and (max-width: 768px) {\n        height: rem-calc(44);\n      }\n\n      &:before {\n        @include mdi-icon;\n        content: \"\\f140\";\n        position: absolute;\n        right: rem-calc(9);\n        pointer-events: none;\n      }\n\n      &:hover:not(:disabled):not(.-disabled):not(.-raised) {\n        background: transparent;\n        text-decoration: none;\n      }\n\n      &:active {\n        // fix style bleed in Edge\n        -ms-transform: scale(1, 1) !important;\n        transform: scale(1, 1) !important;\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &::-moz-focus-inner {\n        border: 0;\n      }\n\n      &.user-is-tabbing:focus {\n        @include focus-style;\n      }\n\n      .overflowcontrol {\n        display: block;\n        white-space: nowrap;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        flex: 1;\n\n        &.hassubinfo {\n          display: flex;\n\n          .button-text {\n            flex: 1;\n            text-overflow: ellipsis;\n            overflow: hidden;\n            min-width: 0;\n          }\n          .subinfo {\n            flex: none;\n            font-style: italic;\n          }\n        }\n      }\n\n      .overflow-counter {\n        font-weight: bold;\n        margin-left: rem-calc(8);\n      }\n    }\n\n    > .displayedoption[disabled] {\n      color: #6b6b6b;\n      border-color: #8a8a8a;\n      background: #f0f0f0;\n      cursor: default;\n    }\n\n    > .dropdown {\n      -webkit-overflow-scrolling: touch;\n\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: 0;\n      right: 0;\n      background: #fff;\n      z-index: 100;\n      width: 100%;\n      font-size: rem-calc(14);\n\n      &.upwards {\n        top: unset;\n        bottom: calc(100% - 2.5rem);\n        @include transformOrigin(center bottom);\n      }\n\n      &.hidden {\n        visibility: hidden;\n      }\n    }\n\n    > .dropdown.open {\n      @include scale($xVal: 1, $yVal: 1);\n    }\n  }\n\n  &.invalid {\n    & .button-wrapper {\n      & .displayedoption {\n        @include invalid;\n      }\n    }\n  }\n\n  & .error-message {\n    color: $error-color;\n    font-size: rem-calc(14);\n    margin-top: rem-calc(4);\n    margin-bottom: rem-calc(4);\n    display: block;\n    top: 100%;\n    left: 0;\n    font-style: italic;\n  }\n}\n\n.options-wrapper {\n  max-height: rem-calc(200);\n  overflow: auto;\n}\n\n.select-all {\n  //display: inline-block;\n  width: 100%;\n  cursor: pointer;\n  padding: rem-calc(20);\n  border: none;\n  margin: 0;\n  border-bottom: 2px solid $list-border-bottom-color;\n  background: $light-background;\n  font-family: inherit;\n  font-size: inherit;\n  text-align: left; // fallback for browsers not supporting logical properties\n  text-align: start;\n  font-weight: 500;\n  color: $interactive-element;\n  user-select: none;\n\n  &:hover,\n  &:focus {\n    outline: none;\n    background: #f4f4f4;\n  }\n}\n\n.search {\n  box-sizing: border-box;\n  border-bottom: 2px solid $list-border-bottom-color;\n  padding: rem-calc(20);\n\n  .searchfield-wrapper {\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    height: rem-calc(44);\n    width: 100%;\n    padding: 0 rem-calc(12);\n    @include border-radius(3px);\n    border: 1px solid $input-border-color;\n    &:focus,\n    &.focus {\n      @include field-focus;\n    }\n  }\n  .searchfield {\n    width: 100%;\n    border: none;\n    outline: none;\n    font-family: inherit;\n    font-size: rem-calc(14);\n    margin-left: rem-calc(4);\n  }\n  .icon:before {\n    @include mdi-icon;\n    content: \"\\f349\";\n    color: $gray;\n    font-size: rem-calc(14);\n  }\n}\n\n.search-results-message {\n  padding: rem-calc(20);\n  color: $body-text-color;\n  font-size: rem-calc(14);\n  font-style: italic;\n}\n\n.rtl {\n  > .dropdown {\n    @include transformOrigin(left top);\n    left: 0;\n    right: auto;\n\n    .option {\n      padding-left: rem-calc(48);\n      padding-right: rem-calc(20);\n    }\n  }\n\n  > .displayedoption {\n    padding: rem-calc(0 15 0 30);\n    text-align: right;\n\n    &:before {\n      right: auto;\n      left: rem-calc(9);\n    }\n  }\n}\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Watch, Host } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { generateId, getTextDir, shouldOpenUp, intl, debounce } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-select\",\n  styleUrl: \"wm-select.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Select {\n  @Element() el!: HTMLWmSelectElement;\n\n  private uid!: string;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  @Prop({ mutable: true }) invalid: boolean = false;\n  @Prop() maxHeight?: string;\n  @Prop({ mutable: true }) label?: string;\n  @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\n  @Prop() requiredField: boolean = false;\n  @Prop({ mutable: true }) errorMessage: string = \"\";\n  @Prop() multiple: boolean = false;\n  @Prop() search: boolean = false;\n  @Prop() selectAll: boolean = false;\n  @Prop() placeholder: string = intl.formatMessage({\n    id: \"select.multiPlaceholder\",\n    defaultMessage: \"Make a selection\",\n    description: \"Placeholder text. Use imperative\",\n  });\n  @Prop() searchPlaceholder: string = intl.formatMessage({\n    id: \"select.searchPlaceholder\",\n    defaultMessage: \"Search\",\n    description: \"Placeholder text. Use imperative\",\n  });\n  @Prop() allSelectedMessage: string = intl.formatMessage({\n    id: \"select.allSelected\",\n    defaultMessage: \"All selected\",\n    description: \"Text displayed when all options are selected\",\n  });\n\n  requiredMessage = intl.formatMessage({\n    id: \"global.requiredField\",\n    defaultMessage: \"required field\",\n  });\n\n  selectAllMessage = intl.formatMessage({\n    id: \"select.selectAll\",\n    defaultMessage: \"Select All\",\n  });\n\n  deselectAllMessage = intl.formatMessage({\n    id: \"select.deselectAll\",\n    defaultMessage: \"Deselect All\",\n  });\n\n  allOptionsSelectedMessage = intl.formatMessage({\n    id: \"select.allOptionsSelected\",\n    defaultMessage: \"All options selected\",\n  });\n\n  allOptionsDeselectedMessage = intl.formatMessage({\n    id: \"select.allOptionsDeselected\",\n    defaultMessage: \"All options deselected\",\n  });\n\n  @State() isTabbing: boolean = false;\n  @State() isExpanded: boolean = false;\n  @State() announcement: string = \"\";\n  @Event() wmSelectDidLoad!: EventEmitter<void>;\n  @Event() wmSelectBlurred!: EventEmitter<void>;\n  @Event() wmSelectChanged!: EventEmitter<Object>;\n  @Event() wmComponentBlurred!: EventEmitter<void>; // deprecated in favor of wmSelectBlurred\n  @Event() wmSelectSearchChanged!: EventEmitter<Object>;\n\n  private buttonEl!: HTMLButtonElement;\n  private dropdownEl!: HTMLDivElement;\n  private selectAllEl!: HTMLButtonElement;\n  private listboxEl!: HTMLDivElement;\n  private liveRegionEl!: HTMLDivElement;\n  private searchFieldWrapperEl!: HTMLDivElement;\n  private searchFieldEl!: HTMLInputElement;\n  private errorContainer!: HTMLDivElement;\n  private keysSoFar: string = \"\";\n  private searchIndex: number = 0;\n  private openUp: boolean = false;\n  get childOptions() {\n    return Array.from(this.el.querySelectorAll(\"wm-option\"));\n  }\n  get duplicateOptions(): HTMLWmOptionElement[] {\n    return Array.from(this.el.shadowRoot!.querySelectorAll(\"wm-option\"));\n  }\n  get allOptionEls(): HTMLWmOptionElement[] {\n    // this includes both slotted wm-options and internally created wm-options\n    return this.duplicateOptions.concat(this.childOptions);\n  }\n  get visibleOptionEls(): HTMLWmOptionElement[] {\n    return this.allOptionEls.filter(\n      (option) => !option.classList.contains(\"hidden\") && !option.classList.contains(\"filtered-out\")\n    );\n  }\n\n  //////////////////////////////////////\n  // for search variants\n  get searchTerm(): string {\n    return this.searchFieldEl ? this.searchFieldEl.value : \"\";\n  }\n  get filteredOptions(): HTMLWmOptionElement[] {\n    return this.childOptions.filter((option) =>\n      option.textContent?.toLowerCase().includes(this.searchTerm.toLowerCase())\n    );\n  }\n  //////////////////////////////////////\n\n  //////////////////////////////////////\n  // for multiselect button text\n  private overflowCount: number = 0;\n  get selectedOptions(): HTMLWmOptionElement[] {\n    return Array.from(this.el.querySelectorAll(\"wm-option\")).filter((x) => x.selected);\n  }\n  private displayedOptions: HTMLWmOptionElement[] = [];\n  get allSelected() {\n    return this.childOptions.every((option) => option.selected);\n  }\n  //////////////////////////////////////\n\n  get resultsFoundMessage() {\n    return intl.formatMessage(\n      {\n        id: \"select.searchResultsFound\",\n        defaultMessage: \"{numResults, plural, one {1 option found} other {# options found}}\",\n        description: \"The message read by the screen reader, indicating how many results a search returned\",\n      },\n      { numResults: this.filteredOptions.length }\n    );\n  }\n\n  get noResultsFoundMessage() {\n    return intl.formatMessage({\n      id: \"select.noSearchResults\",\n      defaultMessage: \"No results found. Please try your search again.\",\n      description: \"The message displayed when no options pass the search filter\",\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(\"wmOptionSelected\")\n  handleOptionSelection(ev: CustomEvent): void {\n    const option: HTMLWmOptionElement = ev.detail;\n    this.focusOption(option);\n    if (!this.multiple) {\n      // if the option was already selected, leave selected states untouched and don't fire the event\n      if (!option.selected) {\n        this.selectOption(option);\n        const detail = { changedOption: option, selectedOptions: [option] };\n        this.wmSelectChanged.emit(detail);\n        // change is deprecated in favor of wmSelectChanged\n        // because of issues with React wrappers when using native events name\n        const event = new CustomEvent(\"change\", { detail: detail });\n        // @ts-ignore\n        this.el.dispatchEvent(event);\n      }\n      this.close();\n    } else {\n      this.selectOption(option);\n      // we pass the original option with the event, as it's the only one the devs know or care about\n      // devs will typically set a `value` on the option, which is not copied over\n      // we could have taken the value and put it on the duplicate option,\n      // but this approach is more flexible (what if they want to have a data attribute?)\n      const isDuplicate: boolean = option.classList.contains(\"duplicate\");\n      const originalOption: HTMLWmOptionElement = isDuplicate ? this.findCorrespondingOption(option) : option;\n      const selectedOptions = this.childOptions.filter((o) => o.selected);\n      const detail = { changedOption: originalOption, selectedOptions: selectedOptions };\n      this.wmSelectChanged.emit(detail);\n      // change is deprecated in favor of wmSelectChanged\n      // because of issues with React wrappers when using native events name\n      const event = new CustomEvent(\"change\", { detail: detail });\n      // @ts-ignore\n      this.el.dispatchEvent(event);\n    }\n  }\n\n  @Listen(\"wmEnterKeyPressed\")\n  handleChildEnter(): void {\n    // only occurs for multiselects. handle the click, then close\n    this.close();\n  }\n\n  @Listen(\"wmKeyUpPressed\")\n  handleChildUp(ev: CustomEvent): void {\n    this.moveUp(ev.detail as HTMLWmOptionElement);\n  }\n\n  @Listen(\"wmKeyDownPressed\")\n  handleChildDown(ev: CustomEvent): void {\n    this.moveDown(ev.detail as HTMLWmOptionElement);\n  }\n\n  @Listen(\"wmHomeKeyPressed\")\n  moveToFirstOption(): void {\n    this.focusOption(this.visibleOptionEls[0]);\n  }\n\n  @Listen(\"wmEndKeyPressed\")\n  moveToLastOption(): void {\n    this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length - 1]);\n  }\n\n  @Listen(\"wmEscKeyPressed\")\n  closePopupOnEscape(): void {\n    this.close();\n  }\n\n  @Listen(\"wmOptionBlurred\")\n  handleOptionBlur(ev: CustomEvent): void {\n    // if the Option is blurred to something other than the component emit a blur event with the appropriate relatedTarget\n    // keeps our component's blur events accurate, and closes when focusing browser address bar\n    if (!this.isElOrChild(ev.detail.relatedTarget)) {\n      const event = new CustomEvent(\"blur\");\n      // @ts-ignore\n      event.relatedTarget = ev.detail.relatedTarget;\n      this.el.dispatchEvent(event);\n    }\n  }\n\n  @Listen(\"click\", { target: \"document\", capture: true })\n  handleClick(ev: MouseEvent): void {\n    if (!this.isElOrChild(ev.target as HTMLElement)) {\n      this.close();\n    }\n  }\n\n  handleSelectAllClick() {\n    this.allSelected ? this.deselectAllOptions() : this.selectAllOptions();\n  }\n\n  selectAllOptions() {\n    this.allOptionEls.forEach((o) => (o.selected = true));\n    this.setSelectAllButton();\n    this.setButtonText();\n    const detail = { changedOption: null, selectedOptions: this.childOptions };\n    this.wmSelectChanged.emit(detail);\n  }\n\n  deselectAllOptions() {\n    this.allOptionEls.forEach((o) => (o.selected = false));\n    this.setSelectAllButton();\n    this.setButtonText();\n    const detail = { changedOption: null, selectedOptions: [] };\n    this.wmSelectChanged.emit(detail);\n  }\n\n  handleButtonBlur(ev: FocusEvent) {\n    if (this.isElOrChild(ev.relatedTarget as HTMLElement)) {\n      // do not emit a blur event when opening the dropdown and focusing the Options\n      ev.stopPropagation();\n    }\n  }\n\n  handleSearchFieldBlur(ev: FocusEvent) {\n    this.searchFieldWrapperEl.classList.remove(\"focus\");\n    if (this.isElOrChild(ev.relatedTarget as HTMLElement)) {\n      // do not emit a blur event when moving from searchfield to options\n      ev.stopPropagation();\n    }\n  }\n\n  @Listen(\"keydown\")\n  handleKey(ev: KeyboardEvent): void {\n    switch (ev.key) {\n      case \"ArrowDown\":\n        if (this.isExpanded === false) {\n          ev.preventDefault();\n          this.open(\"next\");\n        }\n        break;\n\n      case \"ArrowUp\":\n        if (this.isExpanded === false) {\n          ev.preventDefault();\n          this.open(\"previous\");\n        }\n        break;\n    }\n  }\n\n  componentWillLoad() {\n    if (!this.label) {\n      console.error(\n        \"For accessibility purposes, this component requires a label (even if `label-position` is set to `none`).\"\n      );\n    }\n\n    this.uid = this.el.id ? this.el.id : generateId();\n\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n\n    // set initial selections\n    if (this.selectedOptions.length > 0) {\n      this.selectedOptions.forEach((x) => {\n        this.displayedOptions.push(x);\n      });\n      // single Select only, pre-select if no default option from dev\n    } else if (!this.multiple) {\n      this.selectOption(this.allOptionEls[0]);\n    }\n  }\n\n  componentDidLoad() {\n    this.wmSelectDidLoad.emit();\n    this.dropdownEl.classList.add(\"hidden\");\n    forceUpdate(this.el);\n\n    // Dev can overwrite the max-height rule set in the Sass file\n    if (this.maxHeight) {\n      this.listboxEl.style.maxHeight = this.maxHeight;\n    }\n\n    if (this.multiple) {\n      this.updateOptionVisibility();\n    }\n    this.setButtonText();\n  }\n\n  componentWillUpdate() {\n    if (this.multiple) {\n      // find last visible duplicate option and apply .last class\n      const visibleDuplicateOptions = this.visibleOptionEls.filter((option) => option.classList.contains(\"duplicate\"));\n      visibleDuplicateOptions.forEach((option, idx) => {\n        if (idx === visibleDuplicateOptions.length - 1) {\n          option.classList.add(\"last\");\n        } else {\n          option.classList.remove(\"last\");\n        }\n      });\n    }\n  }\n\n  moveUp(el: HTMLElement) {\n    const focusableEls: HTMLElement[] = this.visibleOptionEls;\n    if (this.selectAllEl) {\n      focusableEls.unshift(this.selectAllEl);\n    }\n    if (this.searchFieldEl) {\n      focusableEls.unshift(this.searchFieldEl);\n    }\n\n    const prevEl = focusableEls[focusableEls.indexOf(el) - 1] || focusableEls[focusableEls.length - 1];\n\n    if (prevEl) {\n      this.focusOption(prevEl);\n    }\n  }\n\n  moveDown(el: HTMLElement) {\n    const focusableEls: HTMLElement[] = this.visibleOptionEls;\n    if (this.selectAllEl) {\n      focusableEls.unshift(this.selectAllEl);\n    }\n    if (this.searchFieldEl) {\n      focusableEls.unshift(this.searchFieldEl);\n    }\n\n    const nextEl = focusableEls[focusableEls.indexOf(el) + 1] || focusableEls[0];\n\n    if (nextEl) {\n      this.focusOption(nextEl);\n    }\n  }\n\n  open(optionToSelect?: \"next\" | \"previous\"): void {\n    if (!this.disabled) {\n      const elHeight = this.el.clientHeight;\n      const buttonHeight = this.buttonEl.clientHeight;\n      this.openUp = shouldOpenUp(\n        this.el,\n        this.dropdownEl,\n        // when opening up, dropdown covers both label and button\n        elHeight,\n        // when opening down, dropdown covers only the button\n        buttonHeight\n      );\n      this.isExpanded = true;\n      this.dropdownEl.classList.remove(\"hidden\");\n\n      window.requestAnimationFrame(() => {\n        switch (optionToSelect) {\n          case \"next\":\n            // search variant focuses search field\n            // all others focus option \"after\" last selected option  (this can be the first option)\n            if (this.search) {\n              this.searchFieldEl.focus();\n              this.listboxEl.scrollTop = 0;\n            } else {\n              this.moveDown(this.visibleOptionEls.filter((x) => x.selected).slice(-1)[0]);\n            }\n            break;\n          case \"previous\":\n            // search variant focuses last option\n            // all others focus option \"above\" first selected option (this can be the last option)\n            if (this.search) {\n              this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length - 1]);\n            } else {\n              this.moveUp(this.visibleOptionEls.filter((x) => x.selected)[0]);\n            }\n            break;\n          default:\n            // search variant focuses search field\n            // all others focus the selected option\n            // if no option is selected (empty multiselect), focuses first option\n            if (this.search) {\n              this.searchFieldEl.focus();\n              this.listboxEl.scrollTop = 0;\n            } else if (this.selectedOptions.length > 0) {\n              this.focusOption(this.visibleOptionEls.filter((x) => x.selected)[0]);\n            } else {\n              this.focusOption(this.visibleOptionEls[0]);\n            }\n            break;\n        }\n      });\n    }\n  }\n\n  close(returnFocus: boolean = true): void {\n    if (this.isExpanded) {\n      this.isExpanded = false;\n      this.allOptionEls.map((i) => (i.focused = false));\n\n      window.setTimeout(() => {\n        this.dropdownEl.classList.add(\"hidden\");\n        if (this.multiple) {\n          this.updateOptionVisibility();\n        }\n        // clear search field, reset filtered / bolded state of wm-options\n        if (this.search) {\n          this.searchFieldEl.value = \"\";\n          this.wmSelectSearchChanged.emit({ searchTerm: this.searchTerm });\n        }\n        // Returns focus to button after popup closes (no need if user is tabbing)\n        // Delay is necessary for screenreader to get new expanded state before focus\n        // window.requestAnimationFrame is probably enough, but since we are already using setTimeout it may as well be here\n        // also UX wise, it makes sense for the button to only be focused after the animation is complete\n        if (returnFocus) {\n          this.buttonEl.focus();\n        }\n      }, 150);\n    }\n  }\n\n  updateOptionVisibility() {\n    // this runs for search multiselects, where selected options are rendered at the top of the dropdown list\n    // slotted wm-options are hidden if selected, and duplicate wm-options are made visible if selected\n    this.childOptions.forEach((option, idx) => {\n      const duplicateOption = this.duplicateOptions[idx];\n      if (option.selected) {\n        option.classList.add(\"hidden\");\n        duplicateOption.classList.remove(\"hidden\");\n      } else {\n        option.classList.remove(\"hidden\");\n        duplicateOption.classList.add(\"hidden\");\n      }\n    });\n  }\n\n  focusOption(option: HTMLElement): void {\n    this.allOptionEls.forEach((i) => (i.focused = i === option));\n\n    // option must be scrolledIntoView before focused\n    // if focus is called first the option might be positioned incorrectly (in the center of the dropdown) and scrollIntoView will do nothing as the option will already be in view\n    option.scrollIntoView({ block: \"nearest\" });\n\n    // scrollIntoView does not work when the container of the element it's called on is not rendered to the page (in our case the dropdown is still closed and has transform: scaleY(0))\n    // when opening the dropdown, scrollIntoView must be delayed to a point where the browser recognizes content within it as able to be scrolled to\n    // in Safari in particular, the soonest this seems to happen is 20ms. The longest we can wait before any jumping in the open dropdown is noticeable is 60ms\n    window.setTimeout(() => option.scrollIntoView({ block: \"nearest\" }), 60);\n\n    option.focus();\n  }\n\n  selectOption(option: HTMLWmOptionElement): void {\n    // beware of this function's name. For multiselect it actually toggles the selected state, so it can also deselect the option\n    if (option.classList.contains(\"duplicate\")) {\n      // if clicking on a duplicate option, toggle selected property of real one, then rerender\n      const correspondingOption = this.findCorrespondingOption(option);\n      correspondingOption.selected = !correspondingOption.selected;\n      forceUpdate(this.el);\n    } else if (this.multiple) {\n      option.selected = !option.selected;\n    } else {\n      this.childOptions.forEach((x) => (x.selected = x === option));\n    }\n    // update the selectAll checkbox when an option is de/selected\n    // checking is the el is present, implies that this.multiple and this.selectAll are true\n    if (this.selectAllEl) {\n      this.setSelectAllButton();\n    }\n    this.setButtonText();\n  }\n\n  @Listen(\"wmLetterPressed\")\n  findAndFocusOption(ev: CustomEvent): void {\n    const character = ev.detail.toLowerCase();\n\n    if (!this.keysSoFar) {\n      // if first character entered, set currently focused option as the starting index for the search\n      this.visibleOptionEls.forEach((option, idx) => {\n        if (option.focused) {\n          this.searchIndex = idx;\n        }\n      });\n    }\n\n    this.keysSoFar += character;\n\n    let nextMatch = this.findMatchInRange(this.visibleOptionEls, this.searchIndex + 1, this.visibleOptionEls.length);\n    if (!nextMatch) {\n      // if match can't be found from starting option downwards, search from top\n      nextMatch = this.findMatchInRange(this.visibleOptionEls, 0, this.searchIndex);\n    }\n\n    if (nextMatch) {\n      // findMatchInRange still might have returned null, only focus if match found\n      this.focusOption(nextMatch as HTMLWmOptionElement);\n    }\n    this.debouncedClearKeysSoFar();\n  }\n\n  debouncedClearKeysSoFar = debounce(() => {\n    this.keysSoFar = \"\";\n  }, 500);\n\n  findMatchInRange(list: HTMLWmOptionElement[], startIndex: number, endIndex: number): HTMLWmOptionElement | null {\n    let match: HTMLWmOptionElement | null = null;\n    let optionsInRange = list.slice(startIndex, endIndex);\n\n    // Find the first option starting with the keysSoFar substring, searching in\n    // the specified range of options\n    optionsInRange.forEach((option) => {\n      const label = option.textContent;\n      if (!match && label && label.toLowerCase().startsWith(this.keysSoFar)) {\n        match = option;\n      }\n    });\n\n    return match;\n  }\n\n  findCorrespondingOption(el: HTMLWmOptionElement): HTMLWmOptionElement {\n    // if duplicate, returns the child wm-option\n    // if child wm-option, returns duplicate\n    const isDuplicate = el.classList.contains(\"duplicate\");\n    return isDuplicate\n      ? this.childOptions[this.duplicateOptions.indexOf(el)]\n      : this.duplicateOptions[this.childOptions.indexOf(el)];\n  }\n\n  isElOrChild(el: HTMLElement) {\n    // determines whether or not the element is the component, a child of the component, or exists within the component's shadowroot\n    return el === this.el || this.el.contains(el) || this.el.shadowRoot?.contains(el);\n  }\n\n  @Watch(\"errorMessage\")\n  exposeErrors() {\n    // When the error changes, a new id is set for the error container and the button's aria-describedby attribute is updated accordingly. This is to make sure the screen reader announces teh updated errors in Firefox. See this longstanding bug: https://bugzilla.mozilla.org/show_bug.cgi?id=493683\n    const newId = generateId();\n    this.errorContainer.id = `wm-errors-${newId}`;\n    this.buttonEl.setAttribute(\"aria-describedby\", `wm-errors-${newId}`);\n  }\n\n  renderErrorContainer() {\n    return (\n      <div\n        id=\"wm-errors\"\n        class={this.errorMessage ? \"error-message\" : \"\"}\n        ref={(el) => (this.errorContainer = el as HTMLDivElement)}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n      >\n        {this.errorMessage}\n      </div>\n    );\n  }\n\n  handleComponentBlur(ev: FocusEvent): void {\n    // Do not close or emit custom blur event when blurring to an element inside (wm-option)\n    if (!this.el.contains(ev.relatedTarget as Node)) {\n      this.close(false);\n      this.wmSelectBlurred.emit();\n      this.wmComponentBlurred.emit(); // deprecated\n    }\n  }\n\n  // on search field or select all. keydown on options is handled via events.\n  handleKeyDown(ev: KeyboardEvent) {\n    const el = ev.target as HTMLElement;\n    switch (ev.key) {\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.moveDown(ev.target as HTMLElement);\n        break;\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.moveUp(ev.target as HTMLElement);\n        break;\n      case \"Escape\":\n        ev.preventDefault();\n        this.close();\n        break;\n      case \"Enter\":\n        if (el === this.selectAllEl) {\n          ev.preventDefault();\n          this.handleSelectAllClick();\n          this.close();\n        }\n        break;\n      case \" \":\n        if (el === this.selectAllEl) {\n          ev.preventDefault();\n          this.handleSelectAllClick();\n        }\n        break;\n    }\n  }\n\n  debouncedSearch = debounce(() => {\n    this.wmSelectSearchChanged.emit({ searchTerm: this.searchTerm });\n\n    if (this.filteredOptions.length) {\n      this.announce(this.resultsFoundMessage);\n    } else {\n      this.announce(this.noResultsFoundMessage);\n    }\n  }, 150);\n\n  setButtonText() {\n    this.displayedOptions = this.childOptions\n      .filter((x) => x.selected)\n      .map((y) => (!y.classList.contains(\"hidden\") ? y : this.findCorrespondingOption(y)));\n\n    // handle overflow + counter for multiselect\n    if (this.multiple) {\n      // this is a fixed measurement accounting for the max width of a 3 character overflow counter\n      const overflowCounterWidth = 38;\n      const computedStyle = window.getComputedStyle(this.buttonEl);\n\n      // there seems to be no quick way to get an elements width without padding, except for subtracting padding manually\n      const paddingLeft = parseInt(computedStyle.getPropertyValue(\"padding-left\").slice(0, -2));\n      const paddingRight = parseInt(computedStyle.getPropertyValue(\"padding-right\").slice(0, -2));\n\n      const availableSpace = this.buttonEl.clientWidth - paddingLeft - paddingRight - overflowCounterWidth;\n\n      let optionsWidths = this.displayedOptions.map((x) => x.shadowRoot!.querySelector(\".option-wrapper\")!.clientWidth);\n\n      let optionsTotalWidth = optionsWidths.reduce((acc, x) => acc + x, 0);\n      this.overflowCount = 0;\n\n      while (optionsTotalWidth > availableSpace && this.displayedOptions.length > 1) {\n        this.overflowCount++;\n        optionsTotalWidth -= optionsWidths[optionsWidths.length - 1];\n        optionsWidths.pop();\n        this.displayedOptions.pop();\n      }\n    }\n  }\n\n  setSelectAllButton() {\n    if (this.allSelected) {\n      this.selectAllEl.textContent = this.deselectAllMessage;\n      this.announce(this.allOptionsSelectedMessage);\n    } else {\n      this.selectAllEl.textContent = this.selectAllMessage;\n      if (this.selectedOptions.length === 0) {\n        this.announce(this.allOptionsDeselectedMessage);\n      }\n    }\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.announcement = message;\n  }\n\n  renderButtonText() {\n    if (this.multiple && this.displayedOptions.length < 1) {\n      return <span>{this.placeholder}</span>;\n    } else if (this.multiple && this.allSelected && this.overflowCount > 0) {\n      return this.allSelectedMessage;\n    } else {\n      return this.displayedOptions.map((x, idx) => (\n        <span>\n          {idx > 0 ? \", \" : \"\"}\n          {x.textContent}\n        </span>\n      ));\n    }\n  }\n\n  renderSubinfo() {\n    // multiselects cannot have subinfo for options\n    if (!this.multiple && this.selectedOptions.length > 0 && this.selectedOptions[0].subinfo) {\n      return <span class=\"subinfo\">{this.selectedOptions[0].subinfo}</span>;\n    }\n  }\n\n  renderOverflowCount() {\n    if (this.overflowCount > 0 && !this.allSelected) {\n      return (\n        <span>\n          <span class=\"overflow-counter\">+{this.overflowCount}</span>\n        </span>\n      );\n    }\n  }\n\n  renderSearchField() {\n    return (\n      <div class=\"search\">\n        <div class=\"searchfield-wrapper\" ref={(el) => (this.searchFieldWrapperEl = el as HTMLInputElement)}>\n          <div class=\"icon\"></div>\n          <input\n            ref={(el) => (this.searchFieldEl = el as HTMLInputElement)}\n            class=\"searchfield\"\n            role=\"combobox\"\n            aria-controls={`list-${this.uid}`}\n            aria-expanded={this.isExpanded ? \"true\" : \"false\"}\n            onKeyDown={(ev) => this.handleKeyDown(ev)}\n            onFocus={() => this.searchFieldWrapperEl.classList.add(\"focus\")}\n            onBlur={(ev) => this.handleSearchFieldBlur(ev)}\n            onInput={() => this.debouncedSearch()}\n            placeholder={this.searchPlaceholder}\n          ></input>\n        </div>\n      </div>\n    );\n  }\n\n  renderSearchFailedMessage() {\n    return <div class=\"search-results-message\">{this.noResultsFoundMessage}</div>;\n  }\n\n  renderSelectAllButton() {\n    if (this.selectAll && this.multiple && this.searchTerm == \"\") {\n      return (\n        <button\n          ref={(el) => (this.selectAllEl = el as HTMLButtonElement)}\n          class=\"select-all\"\n          onClick={() => this.handleSelectAllClick()}\n          onKeyDown={(ev) => this.handleKeyDown(ev)}\n          tabindex=\"-1\"\n        >\n          {this.allSelected ? this.deselectAllMessage : this.selectAllMessage}\n        </button>\n      );\n    }\n  }\n\n  renderDuplicateOptions() {\n    return Array.from(this.el.children).map((option) => {\n      return (\n        <wm-option class=\"duplicate\" selected={(option as HTMLWmOptionElement).selected}>\n          {option.textContent}\n        </wm-option>\n      );\n    });\n  }\n\n  render() {\n    const buttonProps = {\n      id: `selectbtn-${this.uid}`,\n      [\"disabled\"]: this.disabled,\n      [\"aria-controls\"]: `list-${this.uid}`,\n      [\"aria-labelledby\"]: `label-${this.uid} selectbtn-${this.uid}`,\n      [\"aria-describedby\"]: \"wm-errors\",\n      [\"aria-expanded\"]: this.isExpanded ? \"true\" : \"false\",\n      onClick: () => (this.isExpanded ? this.close() : this.open()),\n    };\n\n    return (\n      <Host onBlur={(ev: FocusEvent) => this.handleComponentBlur(ev)}>\n        <div\n          class={`wrapper ${getTextDir()} label-${this.labelPosition} ${\n            this.invalid || this.errorMessage ? \"invalid\" : \"\"\n          }`}\n        >\n          <div class=\"label-wrapper\">\n            <label class=\"label\" id={`label-${this.uid}`} htmlFor={`selectbtn-${this.uid}`}>\n              {this.label}\n              {\n                // we can't use aria-required or required attributes because it's invalid on the elements we're using (button controlling a listbox)\n                this.requiredField ? (\n                  <span class=\"required\">\n                    <span class=\"sr-only\">{this.requiredMessage}</span>\n                    <span aria-hidden=\"true\">*</span>\n                  </span>\n                ) : (\n                  \"\"\n                )\n              }\n            </label>\n          </div>\n          <div class=\"button-wrapper\">\n            <button\n              {...buttonProps}\n              class={`displayedoption ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}\n              ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\n              onBlur={(ev) => this.handleButtonBlur(ev)}\n              onFocus={() => this.close()}\n            >\n              <span\n                class={\n                  this.selectedOptions.length > 0 && this.selectedOptions.filter((x) => x.subinfo).length > 0\n                    ? \"overflowcontrol hassubinfo\"\n                    : \"overflowcontrol\"\n                }\n              >\n                <span class=\"button-text\">{this.renderButtonText()}</span>\n                {this.renderSubinfo()}\n              </span>\n              {this.renderOverflowCount()}\n            </button>\n            <div\n              class={`dropdown ${this.isExpanded ? \"open\" : \"\"} ${this.openUp ? \"upwards\" : \"\"}`}\n              ref={(el) => (this.dropdownEl = el as HTMLDivElement)}\n            >\n              {this.search && this.renderSearchField()}\n              <div\n                id={`list-${this.uid}`}\n                class=\"options-wrapper\"\n                tabindex={-1}\n                role=\"listbox\"\n                aria-multiselectable={this.multiple ? \"true\" : null}\n                aria-labelledby={`label-${this.uid}`}\n                ref={(el) => (this.listboxEl = el as HTMLDivElement)}\n              >\n                {this.search && this.filteredOptions.length === 0 && this.renderSearchFailedMessage()}\n                {this.renderSelectAllButton()}\n                {this.multiple && this.renderDuplicateOptions()}\n                <slot />\n              </div>\n            </div>\n            {this.renderErrorContainer()}\n            <div\n              id=\"announcement\"\n              aria-live=\"polite\"\n              class=\"sr-only\"\n              ref={(el) => (this.liveRegionEl = el as HTMLDivElement)}\n            >\n              {this.announcement}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-5e2be836.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmTagInputCss","TagInput","this","uid","el","id","generateId","openUp","tooltipVisible","tagAreaInstructions","intl","formatMessage","defaultMessage","maxTagsReachedMessage","debouncedUpdate","debounce","forceUpdate","row","column","csvToArray","selectedTags","options","focusedElement","shadowRoot","activeElement","listItemEls","Array","from","dropdownEl","querySelectorAll","tagEls","tagAreaEl","nonLockedTagEls","filter","tag","classList","contains","optionEls","wmRowEls","localRowEls","filteredRows","colValues","col1","col2","col3","col4","join","toLowerCase","inputEl","value","includes","nonLockedTagsList","list","tagInputType","tagsList","forEach","correspondingRowEl","locked","push","tagLimitReached","maxTags","length","noResultsMessage","description","inputMinimumWidth","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","focusTag","resizeObserver","ResizeObserver","observe","componentDidLoad","remove","componentDidRender","positionInput","includesCaseInsensitive","optionsList","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","canAddNew","hasNonWhiteSpaceCharacters","match","addTag","addOption","resetInput","moveDownRow","moveDownListItem","moveUpRow","moveUpListItem","window","requestAnimationFrame","handleListItemKeyDown","typedEvTarget","click","item","dataset","option","announce","rowId","referencedRow","isLocked","removeTag","handleTagAreaKeyDown","moveLeftTag","moveRightTag","handleTagAreaDelete","focusedTag","handleBlur","component","relatedTarget","fieldWrapperEl","handleCellMouseEnter","cell","contentWrapper","isTruncated","scrollWidth","clientWidth","showTooltip","innerText","handleTagAreaFocus","handleRemoveButtonClick","firstListItem","focusListItem","nextElementSibling","lastListItem","previousElementSibling","rowToFocus","focusCell","numCols","colHeaders","lastTag","firstTag","newOptionsList","optionAlreadyExists","concat","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","existingOptionsMessage","num","charLimit","charactersEnteredMessage","characterLimitReachedMessage","style","spaceAvailable","getBoundingClientRect","right","top","offsetTop","toString","lowercaseList","str","sortCaseInsensitive","sort","a","b","renderTags","lockedTags","unlockedTags","idx","tagText","targetList","h","class","role","tabIndex","onClick","renderDropdown","ref","renderHelpText","tabindex","renderAddNewButton","renderListItems","isFocused","isSelected","onKeyDown","onBlur","helpTextHasOptions","helpTextEditable","helpText","renderTagCounter","renderTable","onScroll","colWidths","renderTableHeaders","renderTableRows","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-63166c83.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmInputCss","Input","exports","this","uid","previousBlurredValue","numberErrorMessage","intl","formatMessage","id","defaultMessage","Object","defineProperty","class_1","prototype","value","length","componentWillLoad","el","generateId","label","console","error","componentDidLoad","inputEl","handleErrorMessage","newValue","displayedErrorMessage","handleKeyDown","ev","isModifierKey","ctrlKey","metaKey","altKey","isCharacter","test","key","hasReachedCharacterLimit","characterLimit","announce","generateCharacterLimitWarning","charCount","handleBlur","wmInputValueChanged","emit","shouldPreventValidation","preventValidation","isRelatedTarget","validate","inputWrapperEl","classList","remove","handleInput","target","handleFocus","add","validationRules","validateNumber","bind","validateRequired","errorMessage","reduce","prev","current","reqMsg","requiredFieldMessage","requiredField","type","validity","badInput","message","liveRegionEl","textContent","announcement","charLimit","charactersEnteredMessage","description","x","y","characterLimitReachedMessage","concat","generateCharacterLimitLabel","limit","renderErrorMessage","render","_this","h","Host","class","labelPosition","ref","htmlFor","disabled","onInput","onKeyDown","onBlur","onFocus","placeholder","autocomplete","maxLength","undefined","step","max","min","info"],"sources":["src/components/wm-input/wm-input.scss?tag=wm-input&encapsulation=shadow","src/components/wm-input/wm-input.tsx"],"sourcesContent":[":host,\nwm-input {\n  font-family: inherit;\n  width: 100%;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  @include label;\n\n  .wrapper {\n    .inner-wrapper {\n      width: 100%;\n    }\n\n    .inputfield-wrapper {\n      height: rem-calc(40);\n      border: 1px solid $input-border-color;\n      @include border-radius(3px);\n      display: flex;\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($charcoal, 0.05);\n      font-size: rem-calc(14);\n      font-weight: 500;\n      align-self: stretch;\n    }\n\n    input {\n      @include border-radius(3px);\n      border: none;\n      font-family: inherit;\n      font-size: rem-calc(14);\n      height: 100%;\n      flex: 1;\n      padding: rem-calc(12 16);\n      width: 100%;\n\n      &:disabled {\n        background-color: $input-disabled-bg;\n        color: $input-disabled-color;\n      }\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    .info {\n      font-style: italic;\n      line-height: 100%;\n      margin: 4px 0;\n    }\n\n    &.invalid {\n      & .inputfield-wrapper {\n        @include invalid;\n      }\n\n      .error-message {\n        color: $firetruck;\n        margin: 4px 0;\n        display: block;\n        font-style: italic;\n        line-height: 100%;\n      }\n    }\n\n    &:focus,\n    &.focus {\n      .inputfield-wrapper {\n        @include field-focus;\n      }\n    }\n  }\n\n  .sr-only {\n    @include srOnly;\n  }\n}\n","import { h, Component, Element, Event, EventEmitter, Host, Prop, State, Watch } from \"@stencil/core\";\nimport { intl, generateId, isRelatedTarget } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-input\",\n  styleUrl: \"wm-input.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Input {\n  @Element() el!: HTMLWmInputElement;\n  private inputEl!: HTMLInputElement;\n  private inputWrapperEl!: HTMLDivElement;\n  private liveRegionEl!: HTMLDivElement;\n\n  @Prop() label!: string;\n  @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\n  @Prop({ reflect: true }) disabled: boolean = false;\n  @Prop() info?: string;\n  @Prop() placeholder: string = \"\";\n  @Prop() requiredField: boolean = false;\n  @Prop() requiredFieldMessage?: string;\n  @Prop() errorMessage?: string;\n  @Prop() characterLimit?: number;\n  @Prop() preventValidation?: string; // id or series of ids, validation will not occur when clicking an element with this id\n  @Prop() type: \"number\" | \"text\" = \"text\";\n  @Prop() step?: number = 1;\n  @Prop() min?: number;\n  @Prop() max?: number;\n\n  get charCount(): number {\n    return this.value.length;\n  }\n\n  @State() announcement: string = \"\";\n\n  @Event() wmInputValueChanged!: EventEmitter<{ value: string }>;\n  @State() displayedErrorMessage: string = \"\";\n\n  private uid: string = \"\";\n  private previousBlurredValue: string = \"\";\n  private numberErrorMessage = intl.formatMessage({\n    id: \"input.numberError\",\n    defaultMessage: \"Please enter a valid number.\",\n  });\n\n  componentWillLoad() {\n    this.uid = this.el.id ? this.el.id : generateId();\n\n    if (!this.label) {\n      console.error(\"wm-input requires the label property\");\n    }\n  }\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputEl.value = this.value;\n      this.previousBlurredValue = this.inputEl.value;\n    }\n  }\n\n  @Watch(\"errorMessage\")\n  handleErrorMessage(newValue: string) {\n    this.displayedErrorMessage = newValue;\n  }\n\n  handleKeyDown(ev: KeyboardEvent) {\n    // in most browsers, onInput doesn't fire if the input's maxLength is reached\n    // to handle the case where a user continues to type after reaching the character limit, the keyDown event must be used\n    const isModifierKey = ev.ctrlKey || ev.metaKey || ev.altKey;\n    const isCharacter = /^.$/.test(ev.key) && !isModifierKey;\n    const hasReachedCharacterLimit =\n      isCharacter && this.characterLimit && this.inputEl.value.length >= this.characterLimit;\n\n    if (hasReachedCharacterLimit) {\n      this.announce(this.generateCharacterLimitWarning(this.charCount, this.characterLimit!));\n    }\n  }\n\n  handleBlur(ev: FocusEvent) {\n    if (this.value !== this.previousBlurredValue) {\n      this.wmInputValueChanged.emit({ value: this.value });\n    }\n    this.previousBlurredValue = this.value;\n    // do not validate if clicking to an element that should prevent validation (e.g. close button on modal)\n    const shouldPreventValidation = this.preventValidation && isRelatedTarget(ev, this.preventValidation);\n    if (!shouldPreventValidation) {\n      this.displayedErrorMessage = this.validate();\n    }\n    this.inputWrapperEl.classList.remove(\"focus\");\n  }\n\n  handleInput(ev: Event) {\n    this.value = (ev.target as HTMLInputElement).value;\n    if (this.characterLimit && this.charCount >= this.characterLimit - 5) {\n      this.announce(this.generateCharacterLimitWarning(this.charCount, this.characterLimit));\n    }\n  }\n\n  handleFocus() {\n    this.inputWrapperEl.classList.add(\"focus\");\n  }\n\n  validate() {\n    // These rules are in priority order\n    // i.e. an input that is triggering both required and number errors will only show the number one but it's first\n    const validationRules = [this.validateNumber.bind(this), this.validateRequired.bind(this)];\n\n    if (this.errorMessage) {\n      return this.errorMessage;\n    } else {\n      // sets newError to first rule that returns an error\n      return validationRules.reduce((prev, current) => (prev ? prev : current()), \"\");\n    }\n  }\n\n  validateRequired(): string {\n    const reqMsg =\n      this.requiredFieldMessage ||\n      intl.formatMessage({\n        id: \"global.requiredError\",\n        defaultMessage: \"This field is required.\",\n      });\n    return this.requiredField && this.value === \"\" ? reqMsg : \"\";\n  }\n\n  validateNumber(): string {\n    return this.type === \"number\" && this.inputEl.validity.badInput ? this.numberErrorMessage : \"\";\n  }\n\n  announce(message: string) {\n    if (this.liveRegionEl.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.announcement = message;\n  }\n\n  generateCharacterLimitWarning(charCount: number, charLimit: number): string {\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    return `${charactersEnteredMessage}${charCount >= charLimit ? \" \" + characterLimitReachedMessage : \"\"}`;\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  renderErrorMessage() {\n    return this.errorMessage || this.displayedErrorMessage;\n  }\n\n  render() {\n    return (\n      <Host id={this.uid}>\n        <div\n          class={`wrapper label-${this.labelPosition} ${\n            this.errorMessage || this.displayedErrorMessage ? \"invalid\" : \"\"\n          }`}\n          ref={(el) => (this.inputWrapperEl = el as HTMLDivElement)}\n        >\n          <div class=\"label-wrapper\">\n            {this.labelPosition !== \"none\" && (\n              <label htmlFor={`inputfield-${this.uid}`} class=\"label\">\n                {this.label}\n                {this.requiredField && (\n                  <span class=\"required\" aria-hidden=\"true\">\n                    *\n                  </span>\n                )}\n              </label>\n            )}\n          </div>\n          <div class=\"inner-wrapper\">\n            <div class=\"inputfield-wrapper\">\n              <input\n                ref={(el) => (this.inputEl = el as HTMLInputElement)}\n                id={`inputfield-${this.uid}`}\n                disabled={this.disabled}\n                aria-label={`${this.label}${\n                  this.characterLimit ? \" \" + this.generateCharacterLimitLabel(this.characterLimit) : \"\"\n                }`}\n                aria-describedby={`info-${this.uid} error-${this.uid}`}\n                onInput={(ev) => this.handleInput(ev)}\n                onKeyDown={(ev) => this.handleKeyDown(ev)}\n                onBlur={(ev) => this.handleBlur(ev)}\n                onFocus={this.handleFocus.bind(this)}\n                placeholder={this.placeholder}\n                autocomplete=\"off\"\n                aria-required={this.requiredField ? \"true\" : null}\n                maxLength={this.characterLimit || undefined}\n                type={this.type}\n                step={this.step}\n                max={this.max}\n                min={this.min}\n              />\n              {this.characterLimit && typeof this.characterLimit === \"number\" ? (\n                <div class=\"character-count\">\n                  {this.charCount}/{this.characterLimit}\n                </div>\n              ) : (\n                \"\"\n              )}\n            </div>\n            {this.info && (\n              <div id={`info-${this.uid}`} class=\"info\">\n                {this.info}\n              </div>\n            )}\n            <div id={`error-${this.uid}`} aria-live=\"assertive\" class=\"error-message\" aria-atomic=\"true\">\n              {this.renderErrorMessage()}\n            </div>\n            <div\n              class=\"sr-only\"\n              aria-live=\"polite\"\n              aria-atomic=\"true\"\n              ref={(el) => (this.liveRegionEl = el as HTMLDivElement)}\n            >\n              {this.announcement}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-67373e6f.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["privDatepickerCss","PrivDatepicker","exports","this","popupClicked","buttonClicked","prevClicked","nextClicked","openUp","calendar_months","intl","formatMessage","id","defaultMessage","description","weekdays","renderCalendarDate","date","index","monthOfDate","_this","removeZeroes","String","dayOfDate","isThisMonth","monthInFocus","dateId","isToday","isDateToday","h","role","concat","parentId","class","onClick","ev","handleTriggeredDate","target","onKeyDown","trapFocusEnd","onBlur","stopPropagation","Date","getUTCFullYear","getUTCMonth","getUTCDate","selectedMonth","selectedYear","selectedDay","class_1","prototype","handleKey","key","preventDefault","includes","click","isExpanded","closePopup","backOneMonth","forwardOneMonth","unfocusCell","dayInFocus","forceUpdate","el","getMonthDays","yearInFocus","view","newMonth","getPreviousMonth","month","year","unfocusMonth","monthNumInFocus","getNextMonth","numDaysToSubtract","openPopup","document","activeElement","shadowRoot","classList","contains","focusCell","changeoverDate","activeEl","tagName","focusMonth","toggleTabbingOn","validKeys","isTabbing","toggleTabbingOff","blurHandler","popupBlurred","emit","relatedTarget","handleBlurOnWindow","componentDidUpdate","handleSelectedDate","prevButton","focus","nextButton","componentDidLoad","setDateValuesForView","zeroPad","value","length","padStart","targetLength","padString","repeat","slice","toString","today","todayDateArray","getFullYear","getMonth","getDate","reduce","result","val","togglePopup","returnFocus","popupEl","remove","window","setTimeout","style","visibility","changeView","buttonEl","panelPosition","requestAnimationFrame","add","months30","leapYear","getMonthFirstDay","getDay","prevMonth","prevMonthYear","nextMonth","nextMonthYear","getCalendarDates","monthDays","monthFirstDay","daysFromPrevMonth","daysFromNextMonth","_a","_b","prevMonthDays","prevMonthDates","__spreadArray","Array","fill","map","_","day","thisMonthDates","nextMonthDates","totalDays","updateLiveRegion","cellTriggered","selectedDate","removeAttribute","getCellById","setAttribute","querySelector","cellToUnfocus","tabIndex","maxDays","cellToFocus","monthToUnfocus","monthToFocus","trapFocusLeft","shiftKey","focusCellInView","trapFocusRight","toggleBusyAttribute","state","text","liveRegion","innerHTML","host","getElementById","labelHeight","clientHeight","shouldOpenUp","hasRoomRight","left","right","newView","renderMonths","tabindex","render","dates","disabled","bind","ref","title","i"],"sources":["src/components/wm-datepicker/priv-datepicker/priv-datepicker.scss?tag=priv-datepicker","src/components/wm-datepicker/priv-datepicker/priv-datepicker.tsx"],"sourcesContent":[".toggle {\n  all: unset;\n  cursor: pointer;\n  padding: rem-calc(0px 6px);\n  height: rem-calc(38);\n  border: none;\n  -moz-border-top-right-radius: 3px;\n  -webkit-border-top-right-radius: 3px;\n  border-top-right-radius: 3px;\n  -moz-border-bottom-right-radius: 3px;\n  -webkit-border-bottom-right-radius: 3px;\n  border-bottom-right-radius: 3px;\n\n  // reset styles inherited from Planning in browsers without shadow DOM\n  -moz-border-top-left-radius: 0;\n  -webkit-border-top-left-radius: 0;\n  border-top-left-radius: 0;\n  -moz-border-bottom-left-radius: 0;\n  -webkit-border-bottom-left-radius: 0;\n  border-bottom-left-radius: 0;\n  @include box-shadow(none);\n  background-color: $button-default-background;\n\n  &:disabled {\n    pointer-events: none;\n    @include box-shadow(none);\n    background-color: rgba(74, 74, 74, 0.05);\n    .calendar::after {\n      color: #7b7b7b;\n    }\n  }\n\n  &:hover {\n    @include box-shadow(none);\n    background: mix(black, $button-default-background, 10%);\n\n    .calendar::after {\n      color: $button-default-text;\n    }\n  }\n\n  [dir=\"RTL\"] & {\n    right: auto;\n    left: 0;\n  }\n\n  span::after {\n    @include mdi-icon;\n    content: \"\\f0ed\";\n    font-size: rem-calc(24);\n    color: $button-default-text;\n    padding: 0;\n    line-height: rem-calc(40);\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  &::-moz-focus-inner {\n    border: 0;\n  }\n}\n\n.user-is-tabbing {\n  .toggle:focus {\n    @include focus-style;\n  }\n}\n\n.popup {\n  visibility: hidden;\n  font-family: inherit;\n  @include border-radius(3px);\n  @include box-shadow(0px 4px 15px 0px rgba(0, 0, 0, 0.2));\n  width: rem-calc(336);\n  z-index: 10;\n  //relative to inner wrapper in wm-datepicker, which contains the input and priv-datepicker\n  position: absolute;\n  left: 0;\n  top: 40px;\n  min-height: rem-calc(337);\n  transition: transform 0.25s ease;\n  transform-origin: center top;\n  transform: scale(1, 0);\n  background-color: $light-background;\n\n  &.open {\n    // display: block;\n    transform: scale(1, 1);\n  }\n\n  &.expand-upwards {\n    top: auto;\n    bottom: rem-calc(38);\n    transform-origin: center bottom;\n  }\n\n  .calendar-header {\n    @include displayFlex();\n    @include justifyContent(space-between);\n    position: relative;\n    padding: rem-calc(15 4);\n\n    .title-box {\n      height: rem-calc(42);\n      @include border-radius(3px);\n      border: 1px solid;\n      font-weight: 500;\n      font-size: rem-calc(14);\n      background: transparent;\n      cursor: pointer;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: rem-calc(0 6 0 12);\n      border-color: $button-default-text;\n      color: $button-default-text;\n\n      &:after {\n        @include mdi-icon;\n        content: \"\\f140\";\n        padding-left: rem-calc(12);\n      }\n\n      &.year:after {\n        content: \"\\f143\";\n      }\n\n      &::-moz-focus-inner {\n        border: 0;\n      }\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    .arw-btn {\n      cursor: pointer;\n      @include border-radius(50%);\n      width: rem-calc(44);\n      height: rem-calc(44);\n      border: none;\n      color: $button-default-text;\n      background: transparent;\n      padding: 0;\n      @include box-shadow(none);\n      line-height: rem-calc(44);\n\n      .mdi {\n        @include mdi-icon;\n        font-size: rem-calc(24);\n        font-weight: normal;\n        line-height: rem-calc(44);\n\n        &:hover {\n          background-color: #efeef1;\n        }\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &:active {\n        @include scale($xVal: 0.9, $yVal: 0.9);\n        background-color: #d7d6d9;\n      }\n    }\n  }\n\n  .day-view {\n    min-width: 100%;\n\n    .date-grid {\n      width: 100%;\n      text-align: center;\n      border-collapse: collapse;\n      margin-bottom: rem-calc(7);\n      color: #757575;\n\n      .date-row:first-child {\n        .date-cell {\n          margin-top: rem-calc(2);\n        }\n      }\n\n      .date-header {\n        background-color: rgb(238, 237, 244);\n      }\n\n      .header-cell {\n        height: rem-calc(33);\n        line-height: rem-calc(33);\n        width: rem-calc(44);\n        margin: 0 calc((14.28% - 44px) / 2);\n        padding: 0;\n        display: inline-block;\n        font-size: rem-calc(13);\n        font-weight: bold;\n        color: #4a4a4a;\n        border: none;\n      }\n\n      .date-cell {\n        cursor: pointer;\n        display: inline-block;\n        padding: 0;\n        @include border-radius(50%);\n        height: rem-calc(44);\n        width: rem-calc(44);\n        margin: 0 calc((14.28% - 44px) / 2);\n        font-size: rem-calc(14);\n        font-weight: 500;\n        line-height: rem-calc(44);\n\n        &:focus {\n          outline: none;\n        }\n\n        &:hover {\n          background-color: #efeef1;\n        }\n\n        &:active {\n          background-color: $button-primary-background;\n          color: #ffffff;\n        }\n\n        &.current-month {\n          color: #4a4a4a;\n\n          &[aria-selected=\"true\"] {\n            background-color: $button-primary-background;\n            color: #ffffff;\n          }\n        }\n      }\n    }\n  }\n\n  .month-view {\n    .months {\n      border-top: 2px solid;\n      border-top-color: #eeedf4;\n      @include displayFlex();\n      flex-wrap: wrap;\n    }\n\n    .month-row {\n      @include displayFlex();\n      @include justifyContent(space-between);\n      width: 100%;\n      border-bottom: 2px solid;\n      border-bottom-color: #eeedf4;\n    }\n\n    .month {\n      cursor: pointer;\n      text-align: center;\n      width: 100%;\n      height: rem-calc(64);\n      line-height: rem-calc(64);\n      font-weight: 500;\n      color: $button-default-text;\n\n      &:not(:last-child) {\n        border-right: 2px solid;\n        border-right-color: #eeedf4;\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &:hover {\n        background-color: #efeef1;\n      }\n\n      &:active,\n      &.selected {\n        background-color: #575195;\n        color: #ffffff;\n      }\n    }\n  }\n\n  &.user-is-tabbing {\n    button:focus,\n    .title-box:focus,\n    .date-cell:focus,\n    .month:focus {\n      @include focus-style;\n      border: none;\n      z-index: 11;\n    }\n  }\n}\n\n.sr-only {\n  @include srOnly;\n}\n","import { h, Component, Prop, Element, Event, EventEmitter, Listen, State } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { intl, hasRoomRight, shouldOpenUp } from \"../../../global/functions\";\n\n@Component({\n  tag: \"priv-datepicker\",\n  styleUrl: \"priv-datepicker.scss\",\n})\nexport class PrivDatepicker {\n  @Element() el!: HTMLPrivDatepickerElement;\n\n  @Prop() disabled: boolean = false;\n  @Prop({ mutable: true, reflect: true }) isExpanded: boolean = false;\n  @Prop({ mutable: true, reflect: true }) view: string = \"day\";\n  @Prop({ mutable: true, reflect: true }) date: Date = new Date();\n  @Prop({ mutable: true }) selectedYear: number = this.date.getUTCFullYear();\n  @Prop({ mutable: true }) selectedMonth: number = this.date.getUTCMonth() + 1;\n  @Prop({ mutable: true }) selectedDay: number = this.date.getUTCDate();\n  @Prop({ mutable: true }) monthInFocus: number = this.selectedMonth;\n  @Prop({ mutable: true }) yearInFocus: number = this.selectedYear;\n  @Prop({ mutable: true }) dayInFocus: number = this.selectedDay;\n  @State() monthNumInFocus: number = this.selectedMonth;\n  @Prop({ mutable: true, reflect: true }) parentId: string = \"\";\n\n  @State() isTabbing: boolean = false;\n\n  selectedDate!: HTMLTableCellElement;\n\n  @Event() cellTriggered!: EventEmitter<HTMLElement>;\n  @Event() toggleButtonClicked!: EventEmitter<HTMLButtonElement>;\n  @Event() popupClosed!: EventEmitter;\n  @Event() popupBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\n\n  private popupEl?: HTMLElement;\n  private buttonEl!: HTMLButtonElement;\n  private popupClicked: boolean = true;\n  private buttonClicked: boolean = true;\n  private prevButton!: HTMLButtonElement;\n  private nextButton!: HTMLButtonElement;\n  private prevClicked: boolean = true;\n  private nextClicked: boolean = true;\n  private openUp: boolean = false;\n\n  private calendar_months: Array<string> = [\n    intl.formatMessage({\n      id: \"date.january\",\n      defaultMessage: \"January\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.february\",\n      defaultMessage: \"February\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.march\",\n      defaultMessage: \"March\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.april\",\n      defaultMessage: \"April\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.may\",\n      defaultMessage: \"May\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.june\",\n      defaultMessage: \"June\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.july\",\n      defaultMessage: \"July\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.august\",\n      defaultMessage: \"August\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.september\",\n      defaultMessage: \"September\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.october\",\n      defaultMessage: \"October\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.november\",\n      defaultMessage: \"November\",\n      description: \"Month of the year\",\n    }),\n    intl.formatMessage({\n      id: \"date.december\",\n      defaultMessage: \"December\",\n      description: \"Month of the year\",\n    }),\n  ];\n\n  private weekdays: Array<string> = [\n    intl.formatMessage({ id: \"date.sunday\", defaultMessage: \"Sunday\" }),\n    intl.formatMessage({ id: \"date.monday\", defaultMessage: \"Monday\" }),\n    intl.formatMessage({ id: \"date.tuesday\", defaultMessage: \"Tuesday\" }),\n    intl.formatMessage({ id: \"date.wednesday\", defaultMessage: \"Wednesday\" }),\n    intl.formatMessage({ id: \"date.thursday\", defaultMessage: \"Thursday\" }),\n    intl.formatMessage({ id: \"date.friday\", defaultMessage: \"Friday\" }),\n    intl.formatMessage({ id: \"date.saturday\", defaultMessage: \"Saturday\" }),\n  ];\n\n  @Listen(\"keydown\")\n  handleKey(ev: KeyboardEvent): void {\n    this.prevClicked = false;\n    this.nextClicked = false;\n\n    switch (ev.key) {\n      case \"Enter\":\n        ev.preventDefault();\n        //Clunky exception for blur validation. Remove when blur reworked.\n        !(ev.target as HTMLElement).id.includes(\"popup-title\") && (ev.target as HTMLElement)!.click();\n        break;\n\n      case \"Escape\":\n        ev.preventDefault();\n        if (this.isExpanded) {\n          ev.stopPropagation(); // prevents closing of parent modal\n          this.closePopup(true);\n        }\n        break;\n\n      case \"PageUp\":\n        ev.preventDefault();\n        this.backOneMonth();\n        break;\n\n      case \"PageDown\":\n        ev.preventDefault();\n        this.forwardOneMonth();\n        break;\n\n      case \"Home\":\n        ev.preventDefault();\n        this.unfocusCell();\n        this.dayInFocus = 1;\n        forceUpdate(this.el);\n        break;\n\n      case \"End\":\n        ev.preventDefault();\n        this.unfocusCell();\n        this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n        forceUpdate(this.el);\n        break;\n\n      case \"ArrowLeft\":\n        ev.preventDefault();\n        if (this.view === \"day\") {\n          this.unfocusCell();\n          if (this.dayInFocus === 1) {\n            const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n            this.monthInFocus = newMonth.month;\n            this.yearInFocus = newMonth.year;\n            this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n          } else {\n            this.dayInFocus -= 1;\n          }\n        } else {\n          this.unfocusMonth();\n          if (this.monthNumInFocus === 0) {\n            this.monthNumInFocus = 11;\n          } else {\n            this.monthNumInFocus -= 1;\n          }\n        }\n        break;\n\n      case \"ArrowRight\":\n        ev.preventDefault();\n        if (this.view === \"day\") {\n          this.unfocusCell();\n          if (this.dayInFocus === this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n            const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n            this.monthInFocus = newMonth.month;\n            this.yearInFocus = newMonth.year;\n            this.dayInFocus = 1;\n          } else {\n            this.dayInFocus += 1;\n          }\n        } else {\n          this.unfocusMonth();\n          if (this.monthNumInFocus === 11) {\n            this.monthNumInFocus = 0;\n          } else {\n            this.monthNumInFocus += 1;\n          }\n        }\n        break;\n\n      case \"ArrowUp\":\n        ev.preventDefault();\n        if (this.view === \"day\") {\n          this.unfocusCell();\n          if (this.dayInFocus < 8) {\n            const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n            this.monthInFocus = newMonth.month;\n            this.yearInFocus = newMonth.year;\n            const numDaysToSubtract = 7 - this.dayInFocus;\n            this.dayInFocus = this.getMonthDays(this.monthInFocus, this.yearInFocus) - numDaysToSubtract;\n          } else {\n            this.dayInFocus -= 7;\n          }\n        } else {\n          this.unfocusMonth();\n          if (this.monthNumInFocus < 3) {\n            this.monthNumInFocus += 9;\n          } else {\n            this.monthNumInFocus -= 3;\n          }\n        }\n        break;\n\n      case \"ArrowDown\":\n        ev.preventDefault();\n        if (!this.isExpanded) {\n          this.openPopup();\n        } else {\n          if (this.view === \"day\") {\n            //If the down arrow is pressed from the month button or the arrow buttons, focus should shift to the current cell in focus\n            if (!(document.activeElement!.shadowRoot! || document).activeElement!.classList.contains(\"date-cell\")) {\n              this.focusCell();\n              break;\n            }\n\n            this.unfocusCell();\n            const changeoverDate = this.getMonthDays(this.monthInFocus, this.yearInFocus) - 7;\n            if (this.dayInFocus > changeoverDate) {\n              const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n              this.monthInFocus = newMonth.month;\n              this.yearInFocus = newMonth.year;\n              this.dayInFocus = this.dayInFocus - changeoverDate;\n            } else {\n              this.dayInFocus += 7;\n            }\n          } else {\n            //If the down arrow is pressed from the arrow buttons or the title box, focus should shift to the current month in focus\n            const activeEl = (document.activeElement!.shadowRoot! || document).activeElement!;\n            if (activeEl.tagName === \"BUTTON\" || activeEl.id.includes(\"popup-title-year\")) {\n              this.focusMonth();\n              break;\n            }\n\n            this.unfocusMonth();\n            if (this.monthNumInFocus > 8) {\n              this.monthNumInFocus -= 9;\n            } else {\n              this.monthNumInFocus += 3;\n            }\n          }\n        }\n        break;\n    }\n  }\n\n  @Listen(\"keydown\")\n  toggleTabbingOn(ev: KeyboardEvent) {\n    const validKeys = [\"Tab\", \"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \"Enter\"];\n    if (validKeys.includes(ev.key)) {\n      this.isTabbing = true;\n    }\n  }\n\n  //Using mousedown prevents this from running when the keydown listener emits \".click()\" for when enter is pressed.\n  @Listen(\"mousedown\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"click\", { target: \"document\" })\n  blurHandler(ev: PointerEvent): void {\n    if (!this.popupClicked && !this.buttonClicked && this.isExpanded) {\n      this.closePopup();\n      // in this case, the PointerEvent target is identical to the blur events relatedTarget, and is passed on as such\n      this.popupBlurred.emit({ relatedTarget: ev.target });\n    }\n    this.popupClicked = false;\n    this.buttonClicked = false;\n  }\n\n  @Listen(\"blur\", { target: \"window\" })\n  handleBlurOnWindow(ev: FocusEvent) {\n    // for cases where the user clicks or uses a shortcut to leave the document\n    if (this.isExpanded) {\n      this.closePopup();\n      this.popupBlurred.emit({ relatedTarget: ev.target });\n    }\n  }\n\n  componentDidUpdate() {\n    this.handleSelectedDate();\n    if (this.isExpanded) {\n      this.prevClicked\n        ? this.prevButton.focus()\n        : this.nextClicked\n        ? this.nextButton.focus()\n        : this.view === \"day\"\n        ? this.focusCell()\n        : this.focusMonth();\n    }\n  }\n\n  componentDidLoad() {\n    this.handleSelectedDate();\n    this.setDateValuesForView();\n  }\n\n  zeroPad(value: number | string, length: number) {\n    if (!String.prototype.padStart) {\n      String.prototype.padStart = function padStart(targetLength, padString) {\n        targetLength = targetLength - this.length;\n        if (targetLength > padString!.length) {\n          padString += padString!.repeat(targetLength / padString!.length);\n        }\n        return padString!.slice(0, targetLength) + String(this);\n      };\n    }\n    return `${value.toString()}`.padStart(length, \"0\");\n  }\n\n  removeZeroes(date: string): number {\n    return +date < 10 ? +date.slice(1) : +date;\n  }\n\n  isDateToday(date: Array<string>): boolean {\n    const today = new Date();\n    const todayDateArray = [\n      today.getFullYear().toString(),\n      (today.getMonth() + 1).toString(),\n      today.getDate().toString(),\n    ];\n    //Compare today's date to date and return true if they match\n    return todayDateArray.reduce(\n      (result: boolean, val: string, index: number) => result && this.removeZeroes(date[index]).toString() === val,\n      true\n    );\n  }\n\n  togglePopup() {\n    this.isExpanded ? this.closePopup() : this.openPopup();\n    this.buttonClicked = true;\n  }\n\n  closePopup(returnFocus: boolean = false) {\n    this.isExpanded = false;\n    this.popupEl!.classList.remove(\"open\");\n    window.setTimeout(() => {\n      //not using display none in order to get measurements of the popup while hidden\n      this.popupEl!.style.visibility = \"hidden\";\n    }, 250);\n    //Reset values so that menu reopens to day view with selected date in focus\n    if (this.view === \"day\") {\n      this.unfocusCell();\n    }\n    this.monthInFocus = this.selectedMonth;\n    this.yearInFocus = this.selectedYear;\n    this.dayInFocus = this.selectedDay;\n    this.changeView(\"day\");\n    if (returnFocus) {\n      this.buttonEl.focus();\n    }\n  }\n\n  openPopup() {\n    this.panelPosition();\n    this.setDateValuesForView();\n    this.prevClicked = false;\n    this.nextClicked = false;\n    this.popupEl!.style.visibility = \"visible\";\n    window.requestAnimationFrame(() => {\n      this.popupEl!.classList.add(\"open\");\n    });\n    this.isExpanded = true;\n    this.focusCell();\n  }\n\n  getMonthDays(month: number, year: number) {\n    const months30 = [4, 6, 9, 11];\n    const leapYear = year % 4 === 0;\n\n    return month === 2 ? (leapYear ? 29 : 28) : months30.includes(month) ? 30 : 31;\n  }\n\n  // 1 => Sunday, 7 => Saturday\n  getMonthFirstDay(month: number, year: number) {\n    return +new Date(year, month - 1, 1, 12, 0, 0).getDay() + 1;\n  }\n\n  getPreviousMonth(month: number, year: number) {\n    const prevMonth = month > 1 ? month - 1 : 12;\n    const prevMonthYear = month > 1 ? year : year - 1;\n\n    return { month: prevMonth, year: prevMonthYear };\n  }\n\n  getNextMonth(month: number, year: number) {\n    const nextMonth = month < 12 ? month + 1 : 1;\n    const nextMonthYear = month < 12 ? year : year + 1;\n\n    return { month: nextMonth, year: nextMonthYear };\n  }\n\n  getCalendarDates(month: number, year: number) {\n    // Get number of days in the month and the month's first day\n    const monthDays = this.getMonthDays(month, year);\n    const monthFirstDay = this.getMonthFirstDay(month, year);\n\n    // Get number of days to be displayed from previous and next months\n    // These ensure a total of 42 days (6 weeks) displayed on the calendar\n    const daysFromPrevMonth = monthFirstDay - 1;\n    let daysFromNextMonth = 42 - (daysFromPrevMonth + monthDays);\n    daysFromNextMonth = daysFromNextMonth > 6 ? daysFromNextMonth - 7 : daysFromNextMonth;\n\n    // Get the previous and next months and years\n    const { month: prevMonth, year: prevMonthYear } = this.getPreviousMonth(month, year);\n    const { month: nextMonth, year: nextMonthYear } = this.getNextMonth(month, year);\n\n    // Get number of days in previous month\n    const prevMonthDays = this.getMonthDays(prevMonth, prevMonthYear);\n\n    // Builds dates to be displayed from previous month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n    const prevMonthDates = [...new Array(daysFromPrevMonth).fill(\"1\")].map((_, index) => {\n      const day = index + 1 + (prevMonthDays - daysFromPrevMonth);\n      return [prevMonthYear.toString(), this.zeroPad(prevMonth, 2), this.zeroPad(day, 2)];\n    });\n\n    // Builds dates to be displayed from current month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n    const thisMonthDates = [...new Array(monthDays).fill(\"1\")].map((_, index) => {\n      const day = index + 1;\n      return [year.toString(), this.zeroPad(month, 2), this.zeroPad(day, 2)];\n    });\n\n    // Builds dates to be displayed from next month. The initialized array is \"filled\" with an arbitrary number because IE and Edge won't map over an array with empty values.\n    const nextMonthDates = [...new Array(daysFromNextMonth).fill(\"1\")].map((_, index) => {\n      const day = index + 1;\n      return [nextMonthYear.toString(), this.zeroPad(nextMonth, 2), this.zeroPad(day, 2)];\n    });\n\n    // Combines all dates from previous, current and next months\n    return [...prevMonthDates, ...thisMonthDates, ...nextMonthDates];\n  }\n\n  forwardOneMonth() {\n    this.unfocusCell();\n    const newMonth = this.getNextMonth(this.monthInFocus, this.yearInFocus);\n    this.monthInFocus = newMonth.month;\n    this.yearInFocus = newMonth.year;\n    const totalDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n    if (this.dayInFocus > this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n      this.dayInFocus = totalDays;\n    }\n    this.updateLiveRegion(`Displaying ${this.calendar_months[this.monthInFocus - 1]}, ${this.yearInFocus}`);\n  }\n\n  backOneMonth() {\n    this.unfocusCell();\n    const newMonth = this.getPreviousMonth(this.monthInFocus, this.yearInFocus);\n    this.monthInFocus = newMonth.month;\n    this.yearInFocus = newMonth.year;\n    const totalDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n    if (this.dayInFocus > this.getMonthDays(this.monthInFocus, this.yearInFocus)) {\n      this.dayInFocus = totalDays;\n    }\n    this.updateLiveRegion(`Viewing ${this.calendar_months[this.monthInFocus - 1]}, ${this.yearInFocus}`);\n  }\n\n  handleTriggeredDate(el: HTMLTableDataCellElement) {\n    this.cellTriggered.emit(el as HTMLTableDataCellElement);\n    // change of input value will trigger the function updating selectedDate\n    this.closePopup(true);\n  }\n\n  handleSelectedDate() {\n    //Remove old selection status\n    if (this.selectedDate) {\n      this.selectedDate.removeAttribute(\"aria-selected\");\n    }\n    //Update selected date to new date inputted/selected\n    this.selectedDate = this.getCellById(this.selectedYear, this.selectedMonth, this.selectedDay);\n\n    if (this.selectedDate) {\n      this.selectedDate.setAttribute(\"aria-selected\", \"true\");\n    }\n  }\n\n  getCellById(year: number, month: number, day: number) {\n    const id = year + this.zeroPad(month, 2) + this.zeroPad(day, 2);\n    return this.el.querySelector(`#cell-${id}-${this.parentId}`) as HTMLTableCellElement;\n  }\n\n  unfocusCell() {\n    const cellToUnfocus = this.getCellById(this.yearInFocus, this.monthInFocus, this.dayInFocus);\n    cellToUnfocus.tabIndex = -1;\n  }\n\n  focusCell() {\n    //These two lines of code prevent an error from happening when the day in focus does not exist in a new month selected, e.g., May 31 is in focus, then the user selects \"November\". It will return focus in the date view to the last day of the month so that focus doesn't fly out of the popup.\n    const maxDays = this.getMonthDays(this.monthInFocus, this.yearInFocus);\n    this.dayInFocus = this.dayInFocus > maxDays ? maxDays : this.dayInFocus;\n\n    const cellToFocus = this.getCellById(this.yearInFocus, this.monthInFocus, this.dayInFocus);\n    if (cellToFocus) {\n      cellToFocus.tabIndex = 0;\n      cellToFocus.focus();\n    }\n  }\n\n  unfocusMonth() {\n    const monthToUnfocus = this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`) as HTMLDivElement;\n    monthToUnfocus.tabIndex = -1;\n  }\n\n  focusMonth() {\n    const monthToFocus = this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`) as HTMLDivElement;\n    monthToFocus.tabIndex = 0;\n    monthToFocus.focus();\n  }\n\n  trapFocusLeft(ev: KeyboardEvent) {\n    if (ev.shiftKey && ev.key === \"Tab\") {\n      ev.preventDefault();\n      this.focusCellInView();\n    }\n  }\n\n  trapFocusEnd(ev: KeyboardEvent) {\n    if (!ev.shiftKey && ev.key === \"Tab\") {\n      ev.preventDefault();\n      this.prevButton.focus();\n    }\n  }\n\n  trapFocusRight(ev: KeyboardEvent) {\n    if (!ev.shiftKey && ev.key === \"Tab\") {\n      ev.preventDefault();\n      this.focusCellInView();\n    }\n  }\n\n  focusCellInView() {\n    if (this.view === \"day\") {\n      this.focusCell();\n    } else {\n      this.focusMonth();\n    }\n  }\n\n  toggleBusyAttribute(state: string) {\n    (this.el.querySelector(\"#wm-container\") as HTMLElement).setAttribute(\"aria-busy\", state);\n  }\n\n  setDateValuesForView() {\n    this.selectedYear = this.date.getUTCFullYear();\n    this.selectedMonth = this.date.getUTCMonth() + 1;\n    this.selectedDay = this.date.getUTCDate();\n    this.monthInFocus = this.selectedMonth;\n    this.yearInFocus = this.selectedYear;\n    this.dayInFocus = this.selectedDay;\n    this.monthNumInFocus = this.selectedMonth - 1;\n  }\n\n  updateLiveRegion(text: string) {\n    let liveRegion = this.el.querySelector(\"#live-region\") as HTMLElement;\n    liveRegion.innerHTML = text;\n  }\n\n  panelPosition() {\n    // getting a ref to the input el (in datepicker.tsx)\n    let host = document.getElementById(this.parentId) as HTMLWmDatepickerElement;\n\n    const labelHeight = host.shadowRoot!.querySelector(\".label-wrapper\")!.clientHeight;\n\n    this.openUp = shouldOpenUp(host, this.popupEl!, labelHeight);\n\n    if (hasRoomRight(host, 336)) {\n      this.popupEl!.style.left = \"0\";\n      this.popupEl!.style.right = \"auto\";\n    } else {\n      this.popupEl!.style.right = \"0\";\n      this.popupEl!.style.left = \"auto\";\n    }\n  }\n\n  changeView(newView: string) {\n    this.view = newView;\n    //Ensure month view always opens to the month last visited in date view\n    this.monthNumInFocus = this.monthInFocus - 1;\n  }\n\n  renderCalendarDate = (date: Array<string>, index: number) => {\n    let monthOfDate = this.removeZeroes(String(date[1]));\n    let dayOfDate = this.removeZeroes(String(date[2]));\n    let isThisMonth = monthOfDate === this.monthInFocus ? \"current-month\" : \"\";\n    const dateId = date[0] + date[1] + date[2];\n    const isToday = this.isDateToday(date);\n\n    return (\n      <div\n        role=\"gridcell\"\n        id={`cell-${dateId}-${this.parentId}`}\n        class={`date-cell ${isThisMonth}`}\n        aria-selected={false}\n        aria-label={`${\n          isToday\n            ? `${intl.formatMessage({\n                id: \"date.today\",\n                defaultMessage: \"today\",\n                description: \"calendar button\",\n              })}, `\n            : \"\"\n        }${this.weekdays[index]}, ${this.calendar_months[monthOfDate - 1]} ${dayOfDate}, ${date[0]}`}\n        onClick={(ev) => {\n          this.handleTriggeredDate(ev.target as HTMLTableDataCellElement);\n        }}\n        onKeyDown={(ev: KeyboardEvent) => this.trapFocusEnd(ev)}\n        data-month={date[1]}\n        data-year={date[0]}\n        onBlur={(ev: FocusEvent) => ev.stopPropagation()}\n      >\n        {dayOfDate}\n      </div>\n    );\n  };\n\n  renderMonths(month: string, index: number) {\n    return (\n      <div\n        id={`month-${index}-${this.parentId}`}\n        class={`month ${this.selectedMonth - 1 === index ? \"selected\" : \"\"}`}\n        role=\"gridcell\"\n        tabindex={index + 1 === this.monthInFocus ? 0 : -1}\n        onKeyDown={(ev: KeyboardEvent) => this.trapFocusEnd(ev)}\n        onBlur={(ev: FocusEvent) => ev.stopPropagation()}\n        onClick={() => {\n          this.monthInFocus = index + 1;\n          this.changeView(\"day\");\n        }}\n      >\n        {month}\n      </div>\n    );\n  }\n\n  render() {\n    const dates = this.getCalendarDates(this.monthInFocus, this.yearInFocus);\n\n    return (\n      <div class=\"container\" id=\"wm-container\">\n        <button\n          disabled={this.disabled}\n          onClick={this.togglePopup.bind(this)}\n          aria-describedby={`date-input-${this.parentId}`}\n          ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\n          aria-expanded={`${this.isExpanded}`}\n          class=\"toggle\"\n          id={`toggle-${this.parentId}`}\n        >\n          <span\n            class=\"calendar\"\n            title={intl.formatMessage({\n              id: \"date.calendarView\",\n              defaultMessage: \"Calendar View\",\n              description: \"Calendar button\",\n            })}\n          />\n        </button>\n        <div\n          class={`popup ${this.view}-view ${this.openUp ? \"expand-upwards\" : \"\"} ${\n            this.isTabbing ? \"user-is-tabbing\" : \"\"\n          }`}\n          id={`popup-${this.parentId}`}\n          ref={(el) => (this.popupEl = el as HTMLElement)}\n          onClick={() => (this.popupClicked = true)}\n          role=\"application\"\n          aria-describedby=\"application\"\n        >\n          {this.view === \"day\" ? (\n            <div class=\"day-view\">\n              <div class=\"calendar-header\">\n                <button\n                  onClick={() => {\n                    this.prevClicked = true;\n                    this.popupClicked = true;\n                    this.backOneMonth();\n                  }}\n                  onKeyDown={(ev: KeyboardEvent) => this.trapFocusLeft(ev)}\n                  ref={(el) => (this.prevButton = el as HTMLButtonElement)}\n                  class=\"arw-btn\"\n                  aria-label={intl.formatMessage({\n                    id: \"date.selectPreviousMonth\",\n                    defaultMessage: \"Select previous month\",\n                    description: \"Calendar button\",\n                  })}\n                >\n                  <span class=\"mdi\">&#xf141;</span>\n                </button>\n                <div\n                  id={`popup-title-month-${this.parentId}`}\n                  class=\"title-box\"\n                  tabindex={0}\n                  role=\"button\"\n                  onKeyDown={(ev: KeyboardEvent) => {\n                    if (ev.key === \"Enter\" || ev.key === \" \") {\n                      ev.preventDefault();\n                      this.changeView(\"month\");\n                    }\n                  }}\n                  onClick={this.changeView.bind(this, \"month\")}\n                  aria-label={`${intl.formatMessage({\n                    id: \"date.currentMonth\",\n                    defaultMessage: \"current month\",\n                    description: \"Calendar button\",\n                  })}: ${this.calendar_months[this.monthInFocus - 1]}\n                  ${this.yearInFocus}.`}\n                  aria-describedby=\"month-title\"\n                >\n                  <span class=\"title\" aria-hidden=\"true\">\n                    {this.calendar_months[this.monthInFocus - 1]} {this.yearInFocus}\n                  </span>\n                </div>\n                <button\n                  onClick={() => {\n                    this.nextClicked = true;\n                    this.popupClicked = true;\n                    this.forwardOneMonth();\n                  }}\n                  onKeyDown={(ev: KeyboardEvent) => this.trapFocusRight(ev)}\n                  aria-label={intl.formatMessage({\n                    id: \"date.selectNextMonth\",\n                    defaultMessage: \"Select next month\",\n                    description: \"Calendar button\",\n                  })}\n                  ref={(el) => (this.nextButton = el as HTMLButtonElement)}\n                  class=\"arw-btn\"\n                >\n                  <span class=\"mdi\">&#xf142;</span>\n                </button>\n              </div>\n              <div aria-labelledby={`popup-title-month-${this.parentId}`} role=\"grid\" class=\"date-grid\">\n                <div role=\"rowgroup\" class=\"date-header\">\n                  <div role=\"row\" class=\"header-row\">\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.su\",\n                          defaultMessage: \"Su\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.mo\",\n                          defaultMessage: \"Mo\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.tu\",\n                          defaultMessage: \"Tu\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.we\",\n                          defaultMessage: \"We\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.th\",\n                          defaultMessage: \"Th\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.fr\",\n                          defaultMessage: \"Fr\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                    <div role=\"columnheader\" class=\"header-cell\">\n                      <span>\n                        {intl.formatMessage({\n                          id: \"date.sa\",\n                          defaultMessage: \"Sa\",\n                          description: \"Abbreviated day of the week\",\n                        })}\n                      </span>\n                    </div>\n                  </div>\n                </div>\n                <div role=\"rowgroup\">\n                  <div role=\"row\" class=\"date-row\">\n                    {dates.slice(0, 7).map((date, i) => this.renderCalendarDate(date, i))}\n                  </div>\n                  <div role=\"row\">{dates.slice(7, 14).map((date, i) => this.renderCalendarDate(date, i))}</div>\n                  <div role=\"row\">{dates.slice(14, 21).map((date, i) => this.renderCalendarDate(date, i))}</div>\n                  <div role=\"row\">{dates.slice(21, 28).map((date, i) => this.renderCalendarDate(date, i))}</div>\n                  <div role=\"row\">{dates.slice(28, 35).map((date, i) => this.renderCalendarDate(date, i))}</div>\n                  {dates.length > 35 ? (\n                    <div role=\"row\">{dates.slice(35).map((date, i) => this.renderCalendarDate(date, i))}</div>\n                  ) : (\n                    \"\"\n                  )}\n                </div>\n              </div>\n            </div>\n          ) : (\n            <div class=\"month-view\">\n              <div class=\"calendar-header\">\n                <button\n                  onClick={() => {\n                    this.prevClicked = true;\n                    this.popupClicked = true;\n                    this.yearInFocus -= 1;\n                    this.updateLiveRegion(`${this.yearInFocus} selected.`);\n                  }}\n                  onKeyDown={(ev: KeyboardEvent) => this.trapFocusLeft(ev)}\n                  aria-label={intl.formatMessage({\n                    id: \"date.selectPreviousYear\",\n                    defaultMessage: \"Select previous year\",\n                    description: \"Calendar button\",\n                  })}\n                  ref={(el) => (this.prevButton = el as HTMLButtonElement)}\n                  class=\"arw-btn\"\n                >\n                  <span class=\"mdi\">&#xf141;</span>\n                </button>\n                <div\n                  id={`popup-title-year-${this.parentId}`}\n                  tabindex={0}\n                  class=\"title-box year\"\n                  role=\"button\"\n                  onClick={this.changeView.bind(this, \"day\")}\n                  onKeyDown={(ev: KeyboardEvent) => {\n                    if (ev.key === \"Enter\" || ev.key === \" \") {\n                      ev.preventDefault();\n                      this.changeView(\"day\");\n                    }\n                  }}\n                  aria-labelledby=\"year-title\"\n                >\n                  <span class=\"title\">{this.yearInFocus}</span>\n                </div>\n                <button\n                  onClick={() => {\n                    this.nextClicked = true;\n                    this.popupClicked = true;\n                    this.yearInFocus += 1;\n                    this.updateLiveRegion(`${this.yearInFocus} selected.`);\n                  }}\n                  aria-label={intl.formatMessage({\n                    id: \"date.selectNextYear\",\n                    defaultMessage: \"Select next year\",\n                    description: \"Calendar button\",\n                  })}\n                  onKeyDown={(ev: KeyboardEvent) => this.trapFocusRight(ev)}\n                  ref={(el) => (this.nextButton = el as HTMLButtonElement)}\n                  class=\"arw-btn\"\n                >\n                  <span class=\"mdi\">&#xf142;</span>\n                </button>\n              </div>\n              <div aria-labelledby={`popup-title-year-${this.parentId}`} role=\"grid\" class=\"months\">\n                <div role=\"row\" class=\"month-row\">\n                  {this.calendar_months\n                    .slice(0, 3)\n                    .map((month: string, index: number) => this.renderMonths(month, index))}\n                </div>\n                <div role=\"row\" class=\"month-row\">\n                  {this.calendar_months\n                    .slice(3, 6)\n                    .map((month: string, index: number) => this.renderMonths(month, index + 3))}\n                </div>\n                <div role=\"row\" class=\"month-row\">\n                  {this.calendar_months\n                    .slice(6, 9)\n                    .map((month: string, index: number) => this.renderMonths(month, index + 6))}\n                </div>\n                <div role=\"row\" class=\"month-row\">\n                  {this.calendar_months\n                    .slice(9)\n                    .map((month: string, index: number) => this.renderMonths(month, index + 9))}\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n        {this.isExpanded && <div id=\"live-region\" aria-live=\"polite\" aria-relevant=\"text\" class=\"sr-only\" />}\n        <div id=\"month-title\" class=\"sr-only\">\n          {intl.formatMessage({\n            id: \"date.selectMonth\",\n            defaultMessage: \"Activate to select a month.\",\n            description: \"Calendar button\",\n          })}\n        </div>\n        <div id=\"year-title\" class=\"sr-only\">\n          {intl.formatMessage({\n            id: \"date.selectYear\",\n            defaultMessage: \"Activate to select a year.\",\n            description: \"Calendar button\",\n          })}\n        </div>\n        <div id=\"application\" class=\"sr-only\">\n          {intl.formatMessage({\n            id: \"date.instructions\",\n            defaultMessage:\n              \"Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table.\",\n          })}\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}