@watermarkinsights/ripple 3.25.0-2 → 3.25.0

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

@@ -1 +0,0 @@
-{"version":3,"names":["wmTimepickerCss","Timepicker","this","twelveHrValid","twentyFourHrValid","uid","timeFormat","times","openUp","buttonAriaLabel","intl","formatMessage","id","defaultMessage","description","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKey","ev","key","preventDefault","isExpanded","open","moveDown","selectedOption","moveUp","handleOptionClick","textContent","stopPropagation","close","focusOption","optionsList","setDropdownPosition","length","updateErrorState","displayedErrorMessage","errorMessage","componentWillLoad","label","console","error","el","generateId","generateTimes","componentDidLoad","optionsEl","classList","add","Array","from","querySelectorAll","value","processInput","isValidTime","input","test","startTime","i","h","Math","floor","hour","toString","padStart","m","min","findNearestTimeInterval","time","formattedTime","formatToStorage","minutes","parseInt","slice","roundedMinutes","round","roundedHour","replace","handleListSelection","option","filter","o","formatToDisplay","setValue","previousValue","inputEl","wmTimepickerNewValidValue","emit","wmTimepickerOnChange","isValid","newErrorMessage","determineErrorMessage","message","requiredError","requiredFieldMessage","invalidError","requiredField","splitTime","exec","hours","amPm","undefined","toUpperCase","includes","itemToSelect","shouldOpenUp","remove","window","requestAnimationFrame","returnFocus","setTimeout","buttonEl","focus","item","forEach","tabIndex","position","prevItem","previousElementSibling","scrollTop","getBoundingClientRect","top","nextItem","nextElementSibling","bottom","offsetHeight","findIndex","x","clientHeight","prevEl","nextEl","handleInput","handleInputBlur","shouldPreventValidation","preventValidation","isRelatedTarget","tpWrapper","renderOptions","map","index","role","onClick","render","Host","invalid","onBlur","class","labelPosition","ref","t","htmlFor","onInput","disabled","placeholder","autocomplete","onFocus","onMouseDown","tabindex"],"sources":["./src/components/wm-timepicker/wm-timepicker.scss?tag=wm-timepicker&encapsulation=shadow","./src/components/wm-timepicker/wm-timepicker.tsx"],"sourcesContent":[":host,\r\nwm-timepicker {\r\n  font-family: inherit;\r\n\r\n  * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n  }\r\n\r\n  @include label;\r\n\r\n  .wrapper {\r\n    .inner-wrapper {\r\n      @include displayFlex();\r\n      align-items: center;\r\n      height: rem-calc(40);\r\n      border: 1px solid $input-border-color;\r\n      @include border-radius(3px);\r\n      max-width: 236px; /* input is 200px or smaller, button is 36px */\r\n      justify-content: space-between;\r\n      position: relative;\r\n\r\n      input {\r\n        -moz-border-top-left-radius: 3px;\r\n        -webkit-border-top-left-radius: 3px;\r\n        border-top-left-radius: 3px;\r\n        -moz-border-bottom-left-radius: 3px;\r\n        -webkit-border-bottom-left-radius: 3px;\r\n        border-bottom-left-radius: 3px;\r\n        border: none;\r\n        font-size: rem-calc(14);\r\n        padding: rem-calc(10 15 8);\r\n        min-width: 0;\r\n        height: 100%;\r\n        flex: 1;\r\n        margin: 0;\r\n        font-family: inherit;\r\n\r\n        &:disabled {\r\n          background-color: $input-disabled-bg;\r\n          color: $input-disabled-color;\r\n        }\r\n\r\n        &:focus {\r\n          outline: none;\r\n        }\r\n      }\r\n\r\n      button {\r\n        all: unset;\r\n        cursor: pointer;\r\n        padding: rem-calc(0px 6px);\r\n        height: rem-calc(38);\r\n        background-color: $button-default-background;\r\n        border: none;\r\n        -moz-border-top-right-radius: 3px;\r\n        -webkit-border-top-right-radius: 3px;\r\n        border-top-right-radius: 3px;\r\n        -moz-border-bottom-right-radius: 3px;\r\n        -webkit-border-bottom-right-radius: 3px;\r\n        border-bottom-right-radius: 3px;\r\n\r\n        // reset styles inherited from Planning in browsers without shadow DOM\r\n        -moz-border-top-left-radius: 0;\r\n        -webkit-border-top-left-radius: 0;\r\n        border-top-left-radius: 0;\r\n        -moz-border-bottom-left-radius: 0;\r\n        -webkit-border-bottom-left-radius: 0;\r\n        border-bottom-left-radius: 0;\r\n        @include box-shadow(none);\r\n\r\n        .clock::after {\r\n          @include mdi-icon;\r\n          content: \"\\f150\";\r\n          color: $button-default-text;\r\n          font-size: rem-calc(24);\r\n          padding: 0;\r\n          line-height: rem-calc(40);\r\n        }\r\n\r\n        &:hover {\r\n          background: mix(black, $button-default-background, 10%);\r\n          @include box-shadow(none);\r\n        }\r\n\r\n        &:disabled {\r\n          background-color: rgba(74, 74, 74, 0.05);\r\n          pointer-events: none;\r\n          @include box-shadow(none);\r\n          .clock::after {\r\n            color: #7b7b7b;\r\n          }\r\n        }\r\n\r\n        [dir=\"RTL\"] & {\r\n          right: auto;\r\n          left: 0;\r\n        }\r\n\r\n        &:focus {\r\n          outline: none;\r\n        }\r\n\r\n        &.user-is-tabbing:focus {\r\n          @include focus-style;\r\n        }\r\n\r\n        &::-moz-focus-inner {\r\n          border: 0;\r\n        }\r\n      }\r\n\r\n      .options {\r\n        margin: 0;\r\n        padding: 0;\r\n        -webkit-overflow-scrolling: touch;\r\n        overflow: auto;\r\n        // value can be passed in to the component and overwrite the following\r\n        max-height: rem-calc(305);\r\n        @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\r\n        @include transition(transform 0.25s ease);\r\n        @include scale($xVal: 1, $yVal: 0);\r\n        @include transformOrigin(center top);\r\n        @include border-radius(3px);\r\n        position: absolute;\r\n        top: 2.5rem;\r\n        right: 0;\r\n        background: #fff;\r\n        z-index: 100;\r\n        width: 100%;\r\n        font-size: rem-calc(14);\r\n\r\n        &.upwards {\r\n          top: unset;\r\n          bottom: 2.5rem;\r\n          @include transformOrigin(center bottom);\r\n        }\r\n\r\n        &.hidden {\r\n          visibility: hidden;\r\n        }\r\n\r\n        [role=\"option\"] {\r\n          display: block;\r\n          cursor: pointer;\r\n          position: relative;\r\n          padding: rem-calc(20);\r\n          background: #fff;\r\n          font-family: inherit;\r\n          list-style: none;\r\n          color: $body-text-color;\r\n\r\n          &:hover {\r\n            background: $background;\r\n            outline: none;\r\n          }\r\n\r\n          &:focus {\r\n            outline: none;\r\n            background: $background;\r\n          }\r\n\r\n          &:not(:last-child) {\r\n            border-bottom: 2px solid rgba(#2e1b46, 0.05);\r\n          }\r\n        }\r\n      }\r\n\r\n      .options.open {\r\n        @include scale($xVal: 1, $yVal: 1);\r\n      }\r\n    }\r\n\r\n    &.invalid {\r\n      .inner-wrapper {\r\n        @include invalidBorder;\r\n      }\r\n\r\n      .error {\r\n        @include errorMessage;\r\n        margin-bottom: 4px;\r\n        top: 100%;\r\n        left: 0;\r\n      }\r\n    }\r\n\r\n    &:focus,\r\n    &.focus {\r\n      .inner-wrapper {\r\n        @include field-focus;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import { h, Component, Host, Element, Prop, Watch, State, Listen, Event, EventEmitter } from \"@stencil/core\";\r\nimport { intl, generateId, shouldOpenUp, isRelatedTarget } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-timepicker\",\r\n  styleUrl: \"wm-timepicker.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class Timepicker {\r\n  @Element() el!: HTMLWmTimepickerElement;\r\n  private inputEl!: HTMLInputElement;\r\n  private optionsEl!: HTMLUListElement;\r\n  private tpWrapper!: HTMLDivElement;\r\n  private buttonEl!: HTMLButtonElement;\r\n  private optionsList!: HTMLLIElement[];\r\n\r\n  @Prop() disabled: boolean = false;\r\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\r\n  @Prop() errorMessage?: string | null;\r\n  @Prop() label: string = \"\";\r\n  @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\r\n  @Prop() requiredField: boolean = false;\r\n  @Prop() requiredFieldMessage?: string;\r\n  @Prop() preventValidation?: string; // id or series of ids, validation will not occur when clicking an element with this id\r\n  @State() selectedOption!: HTMLLIElement;\r\n  @State() isExpanded: boolean = false;\r\n  @State() isTabbing: boolean = false;\r\n  @Event() wmTimepickerNewValidValue!: EventEmitter<{ value: string }>;\r\n  @Event() wmTimepickerOnChange!: EventEmitter<{\r\n    // deprecated in favor of wmTimepickerNewValidValue and standard input event\r\n    value: string;\r\n    isValid: boolean;\r\n  }>;\r\n  private twelveHrValid = /^(0?[0-9]|1[0-2])\\s*:?\\s*([0-5][0-9])?\\s?(a|p|am|pm)?$/i;\r\n  private twentyFourHrValid = /^(0?[0-9]|1[0-9]|2[0-4])\\s*:?\\s*([0-5][0-9])?$/;\r\n  private uid: string = \"\";\r\n  private timeFormat: string = \"hh:mm\";\r\n  private times: string[] = [];\r\n  private openUp: boolean = false;\r\n  private buttonAriaLabel: string = intl.formatMessage({\r\n    id: \"time.selectTime\",\r\n    defaultMessage: \"Select time\",\r\n    description: \"Button text for screen readers.\",\r\n  });\r\n  @State() displayedErrorMessage?: string | null;\r\n\r\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\r\n  toggleTabbingOn() {\r\n    this.isTabbing = true;\r\n  }\r\n\r\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\r\n  toggleTabbingOff() {\r\n    this.isTabbing = false;\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  handleKey(ev: KeyboardEvent): void {\r\n    switch (ev.key) {\r\n      case \"ArrowDown\":\r\n        ev.preventDefault();\r\n        if (this.isExpanded === false) {\r\n          this.open(\"next\");\r\n        } else {\r\n          this.moveDown(this.selectedOption);\r\n        }\r\n        break;\r\n      case \"ArrowUp\":\r\n        ev.preventDefault();\r\n        if (this.isExpanded === false) {\r\n          this.open(\"previous\");\r\n        } else {\r\n          this.moveUp(this.selectedOption);\r\n        }\r\n        break;\r\n      case \"Enter\":\r\n      case \" \":\r\n        if (this.isExpanded) {\r\n          ev.preventDefault();\r\n          this.handleOptionClick(this.selectedOption.textContent!);\r\n        }\r\n        break;\r\n      case \"Escape\":\r\n        ev.preventDefault();\r\n        if (this.isExpanded) {\r\n          ev.stopPropagation(); // for instance if select is in a modal, esc should close the select but not the modal\r\n          this.close();\r\n        }\r\n        break;\r\n      case \"Tab\":\r\n        if (this.isExpanded) {\r\n          this.close(false);\r\n        }\r\n        break;\r\n      case \"Home\":\r\n        ev.preventDefault();\r\n        if (this.isExpanded) {\r\n          this.focusOption(this.optionsList[0]);\r\n          this.setDropdownPosition(\"first\");\r\n        }\r\n        break;\r\n      case \"End\":\r\n        ev.preventDefault();\r\n        if (this.isExpanded) {\r\n          this.focusOption(this.optionsList[this.optionsList.length - 1]);\r\n          this.setDropdownPosition(\"last\");\r\n        }\r\n        break;\r\n    }\r\n  }\r\n\r\n  @Watch(\"errorMessage\")\r\n  updateErrorState() {\r\n    this.displayedErrorMessage = this.errorMessage;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.label === \"\") {\r\n      console.error(\r\n        \"You must include a label prop for the timepicker (for accessibility reasons), even if the label position is none.\"\r\n      );\r\n    }\r\n\r\n    this.uid = this.el.id ? this.el.id : generateId();\r\n    this.updateErrorState();\r\n    this.timeFormat = intl.formatMessage({\r\n      id: \"time.timeFormat\",\r\n      defaultMessage: \"hh:mm\",\r\n    });\r\n\r\n    this.times = this.generateTimes();\r\n  }\r\n\r\n  componentDidLoad() {\r\n    this.optionsEl.classList.add(\"hidden\");\r\n    this.optionsList = Array.from(this.optionsEl.querySelectorAll(\"li\"));\r\n\r\n    if (this.value) {\r\n      this.processInput();\r\n    }\r\n  }\r\n\r\n  isValidTime(input: string) {\r\n    return this.twelveHrValid.test(input) || this.twentyFourHrValid.test(input);\r\n  }\r\n\r\n  generateTimes() {\r\n    let times = [];\r\n    let startTime = 0;\r\n\r\n    for (let i = 0; startTime < 24 * 60; i++) {\r\n      const h = Math.floor(startTime / 60);\r\n      const hour = h.toString().padStart(2, \"0\");\r\n      const m = (startTime % 60).toString();\r\n      const min = m.padStart(2, \"0\");\r\n      times[i] = `${hour}:${min}`;\r\n      startTime = startTime + 15;\r\n    }\r\n\r\n    return times;\r\n  }\r\n\r\n  findNearestTimeInterval(time: string) {\r\n    let formattedTime = this.formatToStorage(time);\r\n    const minutes = parseInt(formattedTime.slice(3, 5));\r\n\r\n    // first find the closest 15 min increment\r\n    if (minutes % 15 !== 0) {\r\n      const hour = parseInt(formattedTime.slice(0, 2));\r\n      let roundedMinutes = (Math.round(minutes / 15) * 15).toString().padStart(2, \"0\");\r\n      if (roundedMinutes === \"60\") {\r\n        roundedMinutes = \"00\";\r\n        let roundedHour = hour + 1;\r\n        if (roundedHour === 24) {\r\n          roundedHour = 0;\r\n        }\r\n        formattedTime = formattedTime.replace(\r\n          `${hour.toString().padStart(2, \"0\")}:`,\r\n          `${roundedHour.toString().padStart(2, \"0\")}:`\r\n        );\r\n      }\r\n      if (parseInt(roundedMinutes) < 8) {\r\n        roundedMinutes = \"00\";\r\n      }\r\n      time = formattedTime.replace(`:${minutes.toString().padStart(2, \"0\")}`, `:${roundedMinutes}`);\r\n    }\r\n\r\n    return time;\r\n  }\r\n\r\n  handleListSelection(time: string) {\r\n    time = this.findNearestTimeInterval(time);\r\n\r\n    const option = this.optionsList.filter((o) => o.textContent == this.formatToDisplay(time))[0];\r\n    option && this.focusOption(option);\r\n  }\r\n\r\n  setValue(time: string) {\r\n    const previousValue = this.value;\r\n    this.inputEl.value = this.formatToDisplay(time);\r\n    this.value = this.formatToStorage(time);\r\n    // update the selection in the list\r\n    // so it opens on the closest item\r\n    this.handleListSelection(time);\r\n\r\n    if (previousValue !== this.value) {\r\n      this.wmTimepickerNewValidValue.emit({ value: this.value });\r\n    }\r\n    // deprecated in favor of wmTimepickerNewValidValue and input\r\n    this.wmTimepickerOnChange.emit({\r\n      value: this.value,\r\n      isValid: !!this.displayedErrorMessage,\r\n    });\r\n  }\r\n\r\n  processInput() {\r\n    if (this.isValidTime(this.value)) {\r\n      this.setValue(this.value);\r\n    }\r\n    const newErrorMessage = this.determineErrorMessage();\r\n    this.displayedErrorMessage = newErrorMessage;\r\n  }\r\n\r\n  determineErrorMessage(): string | undefined | null {\r\n    let message: string | undefined | null = this.errorMessage;\r\n    const requiredError =\r\n      this.requiredFieldMessage ||\r\n      intl.formatMessage({\r\n        id: \"time.requiredError\",\r\n        defaultMessage: \"A time is required.\",\r\n      });\r\n    const invalidError = intl.formatMessage({\r\n      id: \"time.invalidTime\",\r\n      defaultMessage: \"Please enter a valid time.\",\r\n    });\r\n    const isValid = this.isValidTime(this.value);\r\n\r\n    if (isValid && !this.errorMessage) {\r\n      message = null;\r\n    } else if (!isValid && !this.errorMessage) {\r\n      if (this.requiredField && !this.value) {\r\n        message = requiredError;\r\n      } else if (this.value) {\r\n        message = invalidError;\r\n      } else {\r\n        message = null;\r\n      }\r\n    }\r\n\r\n    return message;\r\n  }\r\n\r\n  splitTime(time: string): [number, string, string?] {\r\n    const splitTime = this.twelveHrValid.exec(time) || this.twentyFourHrValid.exec(time);\r\n    let hours = parseInt(splitTime![1]);\r\n    let minutes = splitTime![2] || \"00\";\r\n    let amPm = splitTime ? splitTime[3] : undefined;\r\n\r\n    // handles edge case uncaught by regex '0pm'\r\n    if (hours === 0 && amPm?.toUpperCase().includes(\"P\")) {\r\n      // if user types '0pm' we change it to midnight\r\n      amPm = \"AM\";\r\n    }\r\n    return [hours, minutes, amPm];\r\n  }\r\n\r\n  formatToDisplay(time: string) {\r\n    let [hours, minutes, amPm] = this.splitTime(time);\r\n    // at the moment the component only displays in 12hr AM/PM\r\n    if (hours === 12 && !amPm) {\r\n      amPm = \"PM\";\r\n    }\r\n    if (hours === 0 || hours === 24) {\r\n      hours = 12;\r\n    }\r\n    if (hours > 12) {\r\n      hours -= 12;\r\n      amPm = \"PM\";\r\n    }\r\n    if (amPm && amPm.toUpperCase().includes(\"P\")) {\r\n      amPm = \"PM\";\r\n    } else {\r\n      amPm = \"AM\";\r\n    }\r\n\r\n    return `${hours.toString().padStart(2, \"0\")}:${minutes} ${amPm}`;\r\n  }\r\n\r\n  formatToStorage(time: string) {\r\n    let [hours, minutes, amPm] = this.splitTime(time);\r\n    if (hours === 24) {\r\n      hours = 0;\r\n    }\r\n    if (hours === 12 && amPm && amPm.toUpperCase().includes(\"A\")) {\r\n      hours -= 12;\r\n    }\r\n    if (amPm && amPm.toUpperCase().includes(\"P\") && hours !== 12) {\r\n      hours += 12;\r\n    }\r\n    return `${hours.toString().padStart(2, \"0\")}:${minutes}`;\r\n  }\r\n\r\n  open(itemToSelect?: \"next\" | \"previous\") {\r\n    this.openUp = shouldOpenUp(this.el, this.optionsEl);\r\n    this.isExpanded = true;\r\n    this.optionsEl.classList.remove(\"hidden\");\r\n\r\n    if (this.errorMessage || !this.value) {\r\n      this.handleListSelection(\"09:00\");\r\n    }\r\n    this.setDropdownPosition(\"center\", this.selectedOption);\r\n    this.focusOption(this.selectedOption);\r\n\r\n    window.requestAnimationFrame(() => {\r\n      if (itemToSelect === \"next\") {\r\n        this.moveDown(this.selectedOption);\r\n      } else if (itemToSelect === \"previous\") {\r\n        this.moveUp(this.selectedOption);\r\n      }\r\n    });\r\n  }\r\n\r\n  close(returnFocus: boolean = true) {\r\n    this.isExpanded = false;\r\n\r\n    window.setTimeout(() => {\r\n      this.optionsEl.classList.add(\"hidden\");\r\n      // Returns focus to button after popup closes (no need if user is tabbing)\r\n      // Delay is necessary for screenreader to get new expanded state before focus\r\n      // window.requestAnimationFrame is probably enough, but since we are already using setTimeout it may as well be here\r\n      // also UX wise, it makes sense for the button to only be focused after the animation is complete\r\n      if (returnFocus) {\r\n        this.buttonEl.focus();\r\n      }\r\n    }, 150);\r\n  }\r\n\r\n  focusOption(item: HTMLLIElement): void {\r\n    this.optionsList.forEach((option) => {\r\n      option.tabIndex = -1;\r\n    });\r\n\r\n    item.tabIndex = 0;\r\n    this.selectedOption = item;\r\n    item.focus();\r\n  }\r\n\r\n  setDropdownPosition(position: string, item?: HTMLLIElement) {\r\n    switch (position) {\r\n      case \"top\":\r\n        const prevItem = item?.previousElementSibling as HTMLLIElement;\r\n        this.optionsEl.scrollTop =\r\n          prevItem.getBoundingClientRect().top - this.optionsEl.getBoundingClientRect().top + this.optionsEl.scrollTop;\r\n        break;\r\n      case \"bottom\":\r\n        const nextItem = item?.nextElementSibling as HTMLLIElement;\r\n        this.optionsEl.scrollTop =\r\n          nextItem.getBoundingClientRect().bottom -\r\n          this.optionsEl.getBoundingClientRect().top +\r\n          this.optionsEl.scrollTop -\r\n          this.optionsEl.offsetHeight;\r\n        break;\r\n      case \"center\":\r\n        this.optionsEl.scrollTop =\r\n          (this.optionsList.findIndex((x) => x.textContent === item?.textContent) - 2) * item!.offsetHeight;\r\n        break;\r\n      case \"first\":\r\n        this.optionsEl.scrollTop = 0;\r\n        break;\r\n      case \"last\":\r\n        this.optionsEl.scrollTop = this.optionsList[0].clientHeight * this.optionsList.length;\r\n        break;\r\n    }\r\n  }\r\n\r\n  moveUp(el: HTMLLIElement) {\r\n    const prevEl = el.previousElementSibling as HTMLLIElement;\r\n    if (prevEl) {\r\n      // scroll option to top of dropdown if partially obscured / out of view\r\n      if (prevEl.getBoundingClientRect().top < this.optionsEl.getBoundingClientRect().top) {\r\n        this.setDropdownPosition(\"top\", el);\r\n      }\r\n      this.focusOption(prevEl);\r\n    } else {\r\n      this.focusOption(this.optionsList[this.optionsList.length - 1]);\r\n      this.setDropdownPosition(\"last\");\r\n    }\r\n  }\r\n\r\n  moveDown(el: HTMLLIElement) {\r\n    const nextEl = el.nextElementSibling as HTMLLIElement;\r\n    if (nextEl) {\r\n      // scroll option to bottom of dropdown if partially obscured / out of view\r\n      if (nextEl.getBoundingClientRect().bottom > this.optionsEl.getBoundingClientRect().bottom) {\r\n        this.setDropdownPosition(\"bottom\", el);\r\n      }\r\n      this.focusOption(nextEl);\r\n    } else {\r\n      this.focusOption(this.optionsList[0]);\r\n      this.setDropdownPosition(\"first\");\r\n    }\r\n  }\r\n\r\n  handleOptionClick(time: string) {\r\n    this.close();\r\n    this.setValue(time);\r\n    this.processInput();\r\n  }\r\n\r\n  handleInput() {\r\n    this.value = this.inputEl.value;\r\n    if (this.isValidTime(this.value)) {\r\n      this.handleListSelection(this.findNearestTimeInterval(this.value));\r\n      this.setDropdownPosition(\"center\", this.selectedOption);\r\n    }\r\n  }\r\n\r\n  handleInputBlur(ev: FocusEvent) {\r\n    // do not validate if clicking to an element that should prevent validation (e.g. close button on modal)\r\n    const shouldPreventValidation = this.preventValidation && isRelatedTarget(ev, this.preventValidation);\r\n    if (!shouldPreventValidation) {\r\n      this.processInput();\r\n    }\r\n    this.tpWrapper.classList.remove(\"focus\");\r\n  }\r\n\r\n  renderOptions() {\r\n    return this.times.map((time, index) => (\r\n      <li id={`option${index + 1}`} role=\"option\" onClick={() => this.handleOptionClick(time)}>\r\n        {this.formatToDisplay(time)}\r\n      </li>\r\n    ));\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host id={this.uid} invalid={!!this.displayedErrorMessage ? \"true\" : null} onBlur={() => this.close(false)}>\r\n        <div\r\n          class={`wrapper label-${this.labelPosition} ${!!this.displayedErrorMessage ? \"invalid\" : \"\"}`}\r\n          ref={(t) => (this.tpWrapper = t as HTMLDivElement)}\r\n        >\r\n          <div class=\"label-wrapper\">\r\n            {this.labelPosition !== \"none\" && (\r\n              <label id={`label-${this.uid}`} class=\"label\" htmlFor={`time-input-${this.uid}`}>\r\n                {this.label}\r\n                {this.requiredField && (\r\n                  <span class=\"required\" aria-hidden=\"true\">\r\n                    *\r\n                  </span>\r\n                )}\r\n              </label>\r\n            )}\r\n          </div>\r\n          <div>\r\n            <div class=\"inner-wrapper\">\r\n              <input\r\n                id={`time-input-${this.uid}`}\r\n                aria-label={this.label}\r\n                aria-describedby={`error-${this.uid}`}\r\n                ref={(el) => (this.inputEl = el as HTMLInputElement)}\r\n                onBlur={(ev) => this.handleInputBlur(ev)}\r\n                onInput={() => this.handleInput()}\r\n                disabled={this.disabled}\r\n                aria-required={this.requiredField ? \"true\" : null}\r\n                placeholder={this.timeFormat}\r\n                autocomplete=\"off\"\r\n                onFocus={() => this.tpWrapper.classList.add(\"focus\")}\r\n              />\r\n              <button\r\n                id={`btn-${this.uid}`}\r\n                class={this.isTabbing ? \"user-is-tabbing\" : \"\"}\r\n                ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\r\n                disabled={this.disabled}\r\n                aria-controls={`list-${this.uid}`}\r\n                aria-expanded={this.isExpanded ? \"true\" : \"false\"}\r\n                aria-label={this.buttonAriaLabel}\r\n                aria-describedby={`time-input-${this.uid}`}\r\n                onClick={() => (this.isExpanded ? this.close() : this.open())}\r\n                // This addresses an issue in Safari, where clicking buttons does not focus them\r\n                // if the button does not receive focus when clicked, Timepicker incorrectly emits a blur event\r\n                onMouseDown={(ev) => {\r\n                  ev.preventDefault();\r\n                  this.buttonEl.focus();\r\n                }}\r\n              >\r\n                <span class=\"clock\" />\r\n              </button>\r\n              <ul\r\n                class={`options ${this.isExpanded ? \"open\" : \"\"}  ${this.openUp ? \"upwards\" : \"\"}`}\r\n                id={`list-${this.uid}`}\r\n                role=\"listbox\"\r\n                aria-labelledby={`label-${this.uid}`}\r\n                aria-describedby={this.isExpanded ? \"collapsed\" : null} //For screenreader, to announce state when expanded\r\n                tabindex={-1}\r\n                ref={(el) => (this.optionsEl = el as HTMLUListElement)}\r\n              >\r\n                {this.renderOptions()}\r\n              </ul>\r\n            </div>\r\n            <div id={`error-${this.uid}`} class=\"error\" aria-live=\"assertive\" aria-atomic=\"true\">\r\n              {this.displayedErrorMessage}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/p-bf808ec4.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,H as s,g as o,f as r}from"./p-1c23de4a.js";import{i as n,d as a,g as l,m as h,w as p}from"./p-05e0f901.js";const d=':host(:not(:last-child)),wm-option:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host,wm-option{display:block;cursor:pointer;position:relative;padding:1.25rem;background:#fff;font-family:inherit;list-style:none;color:#4a4a4a;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host:focus,:host.focus,wm-option:focus,wm-option.focus{outline:none;background:#f4f4f4}:host.icon,wm-option.icon{color:#575195}:host .sr-only,wm-option .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.checkbox:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f131";display:inline;margin-right:0.25rem;color:#575195}:host([aria-selected=true]),wm-option[aria-selected=true]{background:rgba(46, 27, 70, 0.05);font-weight:500}:host([aria-selected=true]) .checkbox:before,wm-option[aria-selected=true] .checkbox:before{content:"\\f132"}:host([aria-disabled=true]),wm-option[aria-disabled=true]{font-style:italic;color:#6b6b6b;cursor:default}:host([aria-disabled=true]) .checkbox:before,wm-option[aria-disabled=true] .checkbox:before{color:#6b6b6b}:host(.multi-option),wm-option.multi-option{background:unset}:host(.hidden),wm-option.hidden,:host(.filtered-out),wm-option.filtered-out{display:none}:host(.duplicate.last),wm-option.duplicate.last{border-bottom:12px solid rgba(46, 27, 70, 0.05)}:host(.hassubinfo),wm-option.hassubinfo{display:-ms-flexbox;display:flex}:host(.hassubinfo) .option-wrapper,wm-option.hassubinfo .option-wrapper{-ms-flex:1;flex:1}:host(.hassubinfo) .subinfo,wm-option.hassubinfo .subinfo{-ms-flex:none;flex:none}.subinfo{font-style:italic}.option-wrapper{display:inline-block}::slotted{font-family:inherit}::slotted(i){font-size:0.875rem}::slotted(i):before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;margin-right:0.625rem;pointer-events:none}:host(:focus),wm-option:focus{outline:none;background:#f4f4f4}:host(:hover){background:#f4f4f4;outline:none}';const c=class{constructor(i){t(this,i);this.wmOptionSelected=e(this,"wmOptionSelected",7);this.wmKeyUpPressed=e(this,"wmKeyUpPressed",7);this.wmKeyDownPressed=e(this,"wmKeyDownPressed",7);this.wmEscKeyPressed=e(this,"wmEscKeyPressed",7);this.wmHomeKeyPressed=e(this,"wmHomeKeyPressed",7);this.wmEndKeyPressed=e(this,"wmEndKeyPressed",7);this.wmEnterKeyPressed=e(this,"wmEnterKeyPressed",7);this.wmLetterPressed=e(this,"wmLetterPressed",7);this.wmOptionBlurred=e(this,"wmOptionBlurred",7);this.value=undefined;this.subinfo=undefined;this.disabled=false;this.selected=false;this.focused=false;this.searchTerm=""}get hostClasses(){let t=[];if(this.subinfo){t.push("hassubinfo")}if(this.parentSelectEl.multiple){t.push("multi-option")}if(!this.el.textContent.toLowerCase().includes(this.searchTerm)){t.push("filtered-out")}return t.join(" ")}get parentSelectEl(){var t;return((t=this.el.parentElement)===null||t===void 0?void 0:t.nodeName)!=="WM-SELECT"?this.el.getRootNode().host:this.el.parentElement}handleKeydown(t){switch(t.key){case"ArrowUp":t.preventDefault();this.wmKeyUpPressed.emit(this.el);break;case"ArrowDown":t.preventDefault();this.wmKeyDownPressed.emit(this.el);break;case"Enter":t.preventDefault();if(!this.disabled){this.el.click();this.wmEnterKeyPressed.emit(this.el)}break;case" ":t.preventDefault();this.el.click();break;case"Escape":t.preventDefault();t.stopPropagation();this.wmEscKeyPressed.emit();break;case"Home":t.preventDefault();this.wmHomeKeyPressed.emit();break;case"End":t.preventDefault();this.wmEndKeyPressed.emit();break;default:if(t.key.length===1){this.wmLetterPressed.emit(t.key)}}}handleSelection(){if(!this.disabled){this.wmOptionSelected.emit(this.el)}}handleBlur(t){this.wmOptionBlurred.emit({relatedTarget:t.relatedTarget})}syncAriaSelected(){this.selected?this.el.setAttribute("aria-selected","true"):this.el.removeAttribute("aria-selected")}syncAriaDisabled(){this.disabled?this.el.setAttribute("aria-disabled","true"):this.el.removeAttribute("aria-disabled")}updateDisabledOnClick(){if(this.disabled&&this.el.onclick){this.onClickFunc=this.el.onclick;this.el.onclick=null}else if(!this.disabled&&this.onClickFunc){this.el.onclick=this.onClickFunc}}handleSearch(t){this.searchTerm=t.detail.searchTerm.toLowerCase();if(this.searchTerm){const t=new RegExp(`${this.searchTerm}`,"gi");const e=this.el.textContent.replace(t,(t=>`<strong>${t}</strong>`));this.textEl.innerHTML=e}else{this.textEl.innerHTML=this.el.textContent}}componentWillLoad(){this.syncAriaSelected();this.syncAriaDisabled();this.updateDisabledOnClick();this.parentSelectEl.addEventListener("wmSelectSearchChanged",(t=>this.handleSearch(t)))}render(){return i(s,{role:"option",tabindex:this.focused?0:-1,class:this.hostClasses},i("div",{class:`option-wrapper ${this.parentSelectEl.multiple?"checkbox":""}`},i("span",{"aria-hidden":"true",ref:t=>this.textEl=t},this.el.textContent),i("span",{class:"sr-only"},this.el.textContent)),i("div",{class:"subinfo"},this.subinfo))}get el(){return o(this)}static get watchers(){return{selected:["syncAriaSelected"],disabled:["syncAriaDisabled","updateDisabledOnClick"]}}};c.style=d;const f=':host{position:relative;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:inherit}:host .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}.wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}.wrapper .label .required{color:#c0392b}.wrapper.label-left{-ms-flex-direction:row;flex-direction:row}.wrapper.label-left .label-wrapper{line-height:2.5rem}.wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}.wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper.invalid .label{color:#c0392b}.wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}.wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}.wrapper .button-wrapper{position:relative;-ms-flex:1;flex:1;font-size:1.125rem;color:#575195;min-width:8.75rem}.wrapper .button-wrapper .displayedoption{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;background:transparent;width:100%;border:solid 1px rgba(35, 35, 35, 0.6);padding:0 1.875rem 0 0.9375rem;cursor:pointer;height:2.5rem;line-height:normal;font-family:inherit;color:#575195;font-weight:400;font-size:0.875rem;text-transform:none;text-align:left}@media only screen and (max-width: 768px){.wrapper .button-wrapper .displayedoption{height:2.75rem}}.wrapper .button-wrapper .displayedoption:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";position:absolute;right:0.5625rem;pointer-events:none}.wrapper .button-wrapper .displayedoption:hover:not(:disabled):not(.-disabled):not(.-raised){background:transparent;text-decoration:none}.wrapper .button-wrapper .displayedoption:active{-ms-transform:scale(1, 1) !important;-webkit-transform:scale(1, 1) !important;transform:scale(1, 1) !important}.wrapper .button-wrapper .displayedoption:focus{outline:none}.wrapper .button-wrapper .displayedoption::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-ms-flex:1;flex:1}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo{display:-ms-flexbox;display:flex}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .button-text{-ms-flex:1;flex:1;text-overflow:ellipsis;overflow:hidden;min-width:0}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .subinfo{-ms-flex:none;flex:none;font-style:italic}.wrapper .button-wrapper .displayedoption .overflow-counter{font-weight:bold;margin-left:0.5rem}.wrapper .button-wrapper>.displayedoption[disabled]{color:#6b6b6b;border-color:#8a8a8a;background:#f0f0f0;cursor:default}.wrapper .button-wrapper>.dropdown{-webkit-overflow-scrolling:touch;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:0;right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}.wrapper .button-wrapper>.dropdown.upwards{top:unset;bottom:calc(100% - 2.5rem);-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}.wrapper .button-wrapper>.dropdown.hidden{visibility:hidden}.wrapper .button-wrapper>.dropdown.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}.wrapper.invalid .button-wrapper .displayedoption{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}.wrapper .error-message{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem;margin-bottom:0.25rem;top:100%;left:0}.options-wrapper{max-height:12.5rem;overflow:auto}.select-all{width:100%;cursor:pointer;padding:1.25rem;border:none;margin:0;border-bottom:2px solid rgba(46, 27, 70, 0.05);background:#fff;font-family:inherit;font-size:inherit;text-align:left;text-align:start;font-weight:500;color:#575195;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.select-all:hover,.select-all:focus{outline:none;background:#f4f4f4}.search{-webkit-box-sizing:border-box;box-sizing:border-box;border-bottom:2px solid rgba(46, 27, 70, 0.05);padding:1.25rem}.search .searchfield-wrapper{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.75rem;width:100%;padding:0 0.75rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid #4a4a4a}.search .searchfield-wrapper:focus,.search .searchfield-wrapper.focus{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}.search .searchfield{width:100%;border:none;outline:none;font-family:inherit;font-size:0.875rem;margin-left:0.25rem}.search .icon:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f349";color:#6b6b6b;font-size:0.875rem}.search-results-message{padding:1.25rem;color:#4a4a4a;font-size:0.875rem;font-style:italic}.rtl>.dropdown{-ms-transform-origin:left top;-webkit-transform-origin:left top;-moz-transform-origin:left top;transform-origin:left top;left:0;right:auto}.rtl>.dropdown .option{padding-left:3rem;padding-right:1.25rem}.rtl>.displayedoption{padding:0 0.9375rem 0 1.875rem;text-align:right}.rtl>.displayedoption:before{right:auto;left:0.5625rem}';const b=class{constructor(i){t(this,i);this.wmSelectDidLoad=e(this,"wmSelectDidLoad",7);this.wmSelectBlurred=e(this,"wmSelectBlurred",7);this.wmSelectChanged=e(this,"wmSelectChanged",7);this.wmComponentBlurred=e(this,"wmComponentBlurred",7);this.wmSelectSearchChanged=e(this,"wmSelectSearchChanged",7);this.requiredMessage=n.formatMessage({id:"global.requiredField",defaultMessage:"required field"});this.selectAllMessage=n.formatMessage({id:"select.selectAll",defaultMessage:"Select All"});this.deselectAllMessage=n.formatMessage({id:"select.deselectAll",defaultMessage:"Deselect All"});this.allOptionsSelectedMessage=n.formatMessage({id:"select.allOptionsSelected",defaultMessage:"All options selected"});this.allOptionsDeselectedMessage=n.formatMessage({id:"select.allOptionsDeselected",defaultMessage:"All options deselected"});this.keysSoFar="";this.searchIndex=0;this.openUp=false;this.overflowCount=0;this.displayedOptions=[];this.debouncedClearKeysSoFar=a((()=>{this.keysSoFar=""}),500);this.debouncedSearch=a((()=>{this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm});if(this.filteredOptions.length){this.announce(this.resultsFoundMessage)}else{this.announce(this.noResultsFoundMessage)}}),150);this.disabled=false;this.invalid=false;this.maxHeight=undefined;this.label=undefined;this.labelPosition="top";this.requiredField=false;this.errorMessage="";this.multiple=false;this.search=false;this.selectAll=false;this.placeholder=n.formatMessage({id:"select.multiPlaceholder",defaultMessage:"Make a selection",description:"Placeholder text. Use imperative"});this.searchPlaceholder=n.formatMessage({id:"select.searchPlaceholder",defaultMessage:"Search",description:"Placeholder text. Use imperative"});this.allSelectedMessage=n.formatMessage({id:"select.allSelected",defaultMessage:"All selected",description:"Text displayed when all options are selected"});this.isTabbing=false;this.isExpanded=false;this.announcement=""}get childOptions(){return Array.from(this.el.querySelectorAll("wm-option"))}get duplicateOptions(){return Array.from(this.el.shadowRoot.querySelectorAll("wm-option"))}get allOptionEls(){return this.duplicateOptions.concat(this.childOptions)}get visibleOptionEls(){return this.allOptionEls.filter((t=>!t.classList.contains("hidden")&&!t.classList.contains("filtered-out")))}get searchTerm(){return this.searchFieldEl?this.searchFieldEl.value:""}get filteredOptions(){return this.childOptions.filter((t=>{var e;return(e=t.textContent)===null||e===void 0?void 0:e.toLowerCase().includes(this.searchTerm.toLowerCase())}))}get selectedOptions(){return Array.from(this.el.querySelectorAll("wm-option")).filter((t=>t.selected))}get allSelected(){return this.childOptions.every((t=>t.selected))}get resultsFoundMessage(){return n.formatMessage({id:"select.searchResultsFound",defaultMessage:"{numResults, plural, one {1 option found} other {# options found}}",description:"The message read by the screen reader, indicating how many results a search returned"},{numResults:this.filteredOptions.length})}get noResultsFoundMessage(){return n.formatMessage({id:"select.noSearchResults",defaultMessage:"No results found. Please try your search again.",description:"The message displayed when no options pass the search filter"})}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleOptionSelection(t){const e=t.detail;this.focusOption(e);if(!this.multiple){if(!e.selected){this.selectOption(e);const t={changedOption:e,selectedOptions:[e]};this.wmSelectChanged.emit(t);const i=new CustomEvent("change",{detail:t});this.el.dispatchEvent(i)}this.close()}else{this.selectOption(e);const t=e.classList.contains("duplicate");const i=t?this.findCorrespondingOption(e):e;const s=this.childOptions.filter((t=>t.selected));const o={changedOption:i,selectedOptions:s};this.wmSelectChanged.emit(o);const r=new CustomEvent("change",{detail:o});this.el.dispatchEvent(r)}}handleChildEnter(){this.close()}handleChildUp(t){this.moveUp(t.detail)}handleChildDown(t){this.moveDown(t.detail)}moveToFirstOption(){this.focusOption(this.visibleOptionEls[0])}moveToLastOption(){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}closePopupOnEscape(){this.close()}handleOptionBlur(t){if(!this.isElOrChild(t.detail.relatedTarget)){const e=new CustomEvent("blur");e.relatedTarget=t.detail.relatedTarget;this.el.dispatchEvent(e)}}handleClick(t){if(!this.isElOrChild(t.target)){this.close()}}handleSelectAllClick(){this.allSelected?this.deselectAllOptions():this.selectAllOptions()}selectAllOptions(){this.allOptionEls.forEach((t=>t.selected=true));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:this.childOptions};this.wmSelectChanged.emit(t)}deselectAllOptions(){this.allOptionEls.forEach((t=>t.selected=false));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:[]};this.wmSelectChanged.emit(t)}handleButtonBlur(t){if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleSearchFieldBlur(t){this.searchFieldWrapperEl.classList.remove("focus");if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleKey(t){switch(t.key){case"ArrowDown":if(this.isExpanded===false){t.preventDefault();this.open("next")}break;case"ArrowUp":if(this.isExpanded===false){t.preventDefault();this.open("previous")}break}}componentWillLoad(){if(!this.label){console.error("For accessibility purposes, this component requires a label (even if `label-position` is set to `none`).")}this.uid=this.el.id?this.el.id:l();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}if(this.selectedOptions.length>0){this.selectedOptions.forEach((t=>{this.displayedOptions.push(t)}))}else if(!this.multiple){this.selectOption(this.allOptionEls[0])}}componentDidLoad(){this.wmSelectDidLoad.emit();this.dropdownEl.classList.add("hidden");r(this.el);if(this.maxHeight){this.listboxEl.style.maxHeight=this.maxHeight}if(this.multiple){this.updateOptionVisibility()}this.setButtonText()}componentWillUpdate(){if(this.multiple){const t=this.visibleOptionEls.filter((t=>t.classList.contains("duplicate")));t.forEach(((e,i)=>{if(i===t.length-1){e.classList.add("last")}else{e.classList.remove("last")}}))}}moveUp(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)-1]||e[e.length-1];if(i){this.focusOption(i)}}moveDown(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)+1]||e[0];if(i){this.focusOption(i)}}open(t){if(!this.disabled){const e=this.el.clientHeight;const i=this.buttonEl.clientHeight;this.openUp=h(this.el,this.dropdownEl,e,i);this.isExpanded=true;this.dropdownEl.classList.remove("hidden");window.requestAnimationFrame((()=>{switch(t){case"next":if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else{this.moveDown(this.visibleOptionEls.filter((t=>t.selected)).slice(-1)[0])}break;case"previous":if(this.search){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}else{this.moveUp(this.visibleOptionEls.filter((t=>t.selected))[0])}break;default:if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else if(this.selectedOptions.length>0){this.focusOption(this.visibleOptionEls.filter((t=>t.selected))[0])}else{this.focusOption(this.visibleOptionEls[0])}break}}))}}close(t=true){if(this.isExpanded){this.isExpanded=false;this.allOptionEls.map((t=>t.focused=false));window.setTimeout((()=>{this.dropdownEl.classList.add("hidden");if(this.multiple){this.updateOptionVisibility()}if(this.search){this.searchFieldEl.value="";this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm})}if(t){this.buttonEl.focus()}}),150)}}updateOptionVisibility(){this.childOptions.forEach(((t,e)=>{const i=this.duplicateOptions[e];if(t.selected){t.classList.add("hidden");i.classList.remove("hidden")}else{t.classList.remove("hidden");i.classList.add("hidden")}}))}focusOption(t){this.allOptionEls.forEach((e=>e.focused=e===t));t.scrollIntoView({block:"nearest"});window.setTimeout((()=>t.scrollIntoView({block:"nearest"})),60);t.focus()}selectOption(t){if(t.classList.contains("duplicate")){const e=this.findCorrespondingOption(t);e.selected=!e.selected;r(this.el)}else if(this.multiple){t.selected=!t.selected}else{this.childOptions.forEach((e=>e.selected=e===t))}if(this.selectAllEl){this.setSelectAllButton()}this.setButtonText()}findAndFocusOption(t){const e=t.detail.toLowerCase();if(!this.keysSoFar){this.visibleOptionEls.forEach(((t,e)=>{if(t.focused){this.searchIndex=e}}))}this.keysSoFar+=e;let i=this.findMatchInRange(this.visibleOptionEls,this.searchIndex+1,this.visibleOptionEls.length);if(!i){i=this.findMatchInRange(this.visibleOptionEls,0,this.searchIndex)}if(i){this.focusOption(i)}this.debouncedClearKeysSoFar()}findMatchInRange(t,e,i){let s=null;let o=t.slice(e,i);o.forEach((t=>{const e=t.textContent;if(!s&&e&&e.toLowerCase().startsWith(this.keysSoFar)){s=t}}));return s}findCorrespondingOption(t){const e=t.classList.contains("duplicate");return e?this.childOptions[this.duplicateOptions.indexOf(t)]:this.duplicateOptions[this.childOptions.indexOf(t)]}isElOrChild(t){var e;return t===this.el||this.el.contains(t)||((e=this.el.shadowRoot)===null||e===void 0?void 0:e.contains(t))}exposeErrors(){const t=l();this.errorContainer.id=`wm-errors-${t}`;this.buttonEl.setAttribute("aria-describedby",`wm-errors-${t}`)}renderErrorContainer(){return i("div",{id:"wm-errors",class:this.errorMessage?"error-message":"",ref:t=>this.errorContainer=t,"aria-live":"assertive","aria-atomic":"true"},this.errorMessage)}handleComponentBlur(t){if(!this.el.contains(t.relatedTarget)){this.close(false);this.wmSelectBlurred.emit();this.wmComponentBlurred.emit()}}handleKeyDown(t){const e=t.target;switch(t.key){case"ArrowDown":t.preventDefault();this.moveDown(t.target);break;case"ArrowUp":t.preventDefault();this.moveUp(t.target);break;case"Escape":t.preventDefault();this.close();break;case"Enter":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick();this.close()}break;case" ":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick()}break}}setButtonText(){this.displayedOptions=this.childOptions.filter((t=>t.selected)).map((t=>!t.classList.contains("hidden")?t:this.findCorrespondingOption(t)));if(this.multiple){const t=38;const e=window.getComputedStyle(this.buttonEl);const i=parseInt(e.getPropertyValue("padding-left").slice(0,-2));const s=parseInt(e.getPropertyValue("padding-right").slice(0,-2));const o=this.buttonEl.clientWidth-i-s-t;let r=this.displayedOptions.map((t=>t.shadowRoot.querySelector(".option-wrapper").clientWidth));let n=r.reduce(((t,e)=>t+e),0);this.overflowCount=0;while(n>o&&this.displayedOptions.length>1){this.overflowCount++;n-=r[r.length-1];r.pop();this.displayedOptions.pop()}}}setSelectAllButton(){if(this.allSelected){this.selectAllEl.textContent=this.deselectAllMessage;this.announce(this.allOptionsSelectedMessage)}else{this.selectAllEl.textContent=this.selectAllMessage;if(this.selectedOptions.length===0){this.announce(this.allOptionsDeselectedMessage)}}}announce(t){if(this.liveRegionEl.textContent===t){t+=" "}this.announcement=t}renderButtonText(){if(this.multiple&&this.displayedOptions.length<1){return i("span",null,this.placeholder)}else if(this.multiple&&this.allSelected&&this.overflowCount>0){return this.allSelectedMessage}else{return this.displayedOptions.map(((t,e)=>i("span",null,e>0?", ":"",t.textContent)))}}renderSubinfo(){if(!this.multiple&&this.selectedOptions.length>0&&this.selectedOptions[0].subinfo){return i("span",{class:"subinfo"},this.selectedOptions[0].subinfo)}}renderOverflowCount(){if(this.overflowCount>0&&!this.allSelected){return i("span",null,i("span",{class:"overflow-counter"},"+",this.overflowCount))}}renderSearchField(){return i("div",{class:"search"},i("div",{class:"searchfield-wrapper",ref:t=>this.searchFieldWrapperEl=t},i("div",{class:"icon"}),i("input",{ref:t=>this.searchFieldEl=t,class:"searchfield",role:"combobox","aria-controls":`list-${this.uid}`,"aria-expanded":this.isExpanded?"true":"false",onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.searchFieldWrapperEl.classList.add("focus"),onBlur:t=>this.handleSearchFieldBlur(t),onInput:()=>this.debouncedSearch(),placeholder:this.searchPlaceholder})))}renderSearchFailedMessage(){return i("div",{class:"search-results-message"},this.noResultsFoundMessage)}renderSelectAllButton(){if(this.selectAll&&this.multiple&&this.searchTerm==""){return i("button",{ref:t=>this.selectAllEl=t,class:"select-all",onClick:()=>this.handleSelectAllClick(),onKeyDown:t=>this.handleKeyDown(t),tabindex:"-1"},this.allSelected?this.deselectAllMessage:this.selectAllMessage)}}renderDuplicateOptions(){return Array.from(this.el.children).map((t=>i("wm-option",{class:"duplicate",selected:t.selected},t.textContent)))}render(){const t={id:`selectbtn-${this.uid}`,["disabled"]:this.disabled,["aria-controls"]:`list-${this.uid}`,["aria-labelledby"]:`label-${this.uid} selectbtn-${this.uid}`,["aria-describedby"]:"wm-errors",["aria-expanded"]:this.isExpanded?"true":"false",onClick:()=>this.isExpanded?this.close():this.open()};return i(s,{onBlur:t=>this.handleComponentBlur(t)},i("div",{class:`wrapper ${p()} label-${this.labelPosition} ${this.invalid||this.errorMessage?"invalid":""}`},i("div",{class:"label-wrapper"},i("label",{class:"label",id:`label-${this.uid}`,htmlFor:`selectbtn-${this.uid}`},this.label,this.requiredField?i("span",{class:"required"},i("span",{class:"sr-only"},this.requiredMessage),i("span",{"aria-hidden":"true"},"*")):"")),i("div",{class:"button-wrapper"},i("button",Object.assign({},t,{class:`displayedoption ${this.isTabbing?"user-is-tabbing":""}`,ref:t=>this.buttonEl=t,onBlur:t=>this.handleButtonBlur(t),onFocus:()=>this.close()}),i("span",{class:this.selectedOptions.length>0&&this.selectedOptions.filter((t=>t.subinfo)).length>0?"overflowcontrol hassubinfo":"overflowcontrol"},i("span",{class:"button-text"},this.renderButtonText()),this.renderSubinfo()),this.renderOverflowCount()),i("div",{class:`dropdown ${this.isExpanded?"open":""} ${this.openUp?"upwards":""}`,ref:t=>this.dropdownEl=t},this.search&&this.renderSearchField(),i("div",{id:`list-${this.uid}`,class:"options-wrapper",tabindex:-1,role:"listbox","aria-multiselectable":this.multiple?"true":null,"aria-labelledby":`label-${this.uid}`,ref:t=>this.listboxEl=t},this.search&&this.filteredOptions.length===0&&this.renderSearchFailedMessage(),this.renderSelectAllButton(),this.multiple&&this.renderDuplicateOptions(),i("slot",null))),this.renderErrorContainer(),i("div",{id:"announcement","aria-live":"polite",class:"sr-only",ref:t=>this.liveRegionEl=t},this.announcement))))}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{errorMessage:["exposeErrors"]}}};b.style=f;export{c as wm_option,b as wm_select};
-//# sourceMappingURL=p-bf808ec4.entry.js.map

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

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

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

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

@@ -1 +0,0 @@
-{"version":3,"names":["colors","salmon","cyan","forest","sleet","midnight","lavender","periwinkle","gray","allChartsDetails","exports","doughnut","size","thickness","padding","category","doughnut0","doughnut1","doughnut2","doughnut2plus","doughnut3","bar","bar1","bar2","bar3","bar4","bar5","bar6","bar7","showValue","valueFormat","textHiddenMessage","intl","formatMessage","id","defaultMessage","description","seeDetailsMessage","abbrNumber","num","Math","round","amountToPercent","val","total","asInt","amountToDegree","toFixed","number","parseFloat","floor","polarToCartesian","half","radius","startAngle","endAngle","x","cos","PI","y","sin","undefined","x2","y2","x1","y1","getArc","largeArcFlag","chartSize","z","concat","scale","inMin","inMax","outMin","outMax","scaled","minSpacing","width","getMaxTicks","getInterval","largest","maxticks","minimum","magnitude","pow","log10","residual","interval","handleSliceKeyDown","ev","this","popoverEl","open","key","popoverBtn","querySelector","click","handleSliceClick","s","isTabbing","coords","clientX","clientY","openPopover","call","handleSliceFocus","getPosition","target","handleChartKeydown","preventDefault","focusPrevious","focusNext","exitChart","userIsNavigating","title","text","popoverTitle","popoverText","buttonText","sliceRef","window","setTimeout","_this","debouncedClosePopover_1","debounce","__awaiter","document","addEventListener","scrollableParent","findParentWithScrollbar","el","activeEl","checkForActiveElInShadow","activeElement","index","sliceEls","indexOf","length","focusSlice","componentWrapperEl","tabIndex","focusable","map","p","focus","getDetails","chartType","slicesDetails","acc","children","Array","from","reduce","slice","parseInt","getAttribute","forEach","c","i","amount","perc","colorIndex","notStartedColor","color","sliceDetails","legend","offset","uid","inSmallCluster","push","sortSlicesDetails","sortedSlicesDetails","__spreadArray","sort","a","b","idx","prev","next","prevPerc","nextPerc","isInSmallCluster","isSmall","prevIsSmall","nextIsSmall","lessThanOnePerc","getPathData","activeAngle","largeArcFlagOuter","largeArcFlagInner","chartDetails","innerRadius","outerRadius","isHybridDoughnut","outerSeparatorOffset","innerSeparatorOffset","outerCoords","innerCoords","moveTo","arc1","line","arc2","renderInstructionsText","chartInstructions","h","renderFilter","stdDeviation","result","operator","in2","in","renderDoughnut","outerSize","class","height","renderPath","transform","renderDoughnutText","fill","d","onClick","onFocus","onKeyDown","role","arcMiddle","_a","renderStackedBar","isHybridBar","drawAxis","tempValueFormat","renderBarText","renderStackedBarSegment","renderCompletionMessage","isLastSlice","style","backgroundColor","renderSimpleBar","labelWidth","getComputedStyle","getPropertyValue","chartPadding","componentWidth","getBoundingClientRect","chartWidth","numTicks","lastTickVal","extraTicks","setProperty","showBarLegend","rows","renderSimpleBarLegend","renderSimpleBarItem","ticks","tickVal","showGrid","show","hidden","chartMaxVal","currentChartType","cssWidth","amt","displayValue","renderLegend","showLegend","hasCluster","isBar","cur","mode","renderLegendItem","renderHiddenValuesMessage","legendItem","completionMessage"],"sources":["src/components/charts/chartFunctions.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\r\nimport { checkForActiveElInShadow, debounce, findParentWithScrollbar, getPosition, intl } from \"../../global/functions\";\r\nimport { LegendItem, ChartType, ChartDetails, SliceDetails, SliceElement } from \"../../global/interfaces\";\r\n\r\nconst colors = {\r\n  salmon: \"#ff5f4e\",\r\n  cyan: \"#19a1a9\",\r\n  forest: \"#088000\",\r\n  sleet: \"#7f97ad\",\r\n  midnight: \"#2e1b46\",\r\n  lavender: \"#8b86ca\",\r\n  periwinkle: \"#575195\",\r\n  gray: \"#6b6b6b\",\r\n};\r\n\r\nexport const allChartsDetails: { [Key in ChartType]: ChartDetails } = {\r\n  // for progress monitor\r\n  doughnut: {\r\n    size: 155,\r\n    colors: [colors.forest, colors.gray],\r\n    thickness: 0.73,\r\n    padding: 25,\r\n    category: \"doughnut\",\r\n  },\r\n  // deprecated hybrid chart type, should use Progress Indicator's \"doughnut\" instead\r\n  doughnut0: {\r\n    size: 155,\r\n    colors: [colors.forest, colors.gray],\r\n    thickness: 0.73,\r\n    padding: 25,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut1: {\r\n    size: 130,\r\n    colors: [colors.lavender, colors.midnight, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut2: {\r\n    size: 130,\r\n    colors: [colors.cyan, colors.salmon, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  // an internal type only for use when doughnut 2 is populated with 4 slices\r\n  // in this case, the first slice is colored purple\r\n  doughnut2plus: {\r\n    size: 130,\r\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut3: {\r\n    size: 130,\r\n    colors: [colors.lavender, colors.midnight, \"#0089e4\", colors.forest, \"#ea8500\", \"#d54f41\", \"#146ca9\"],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  // for progress monitor\r\n  bar: {\r\n    size: 350,\r\n    colors: [colors.forest, colors.gray],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  // deprecated hybrid chart type, should use Progress Indicator's \"bar\" instead\r\n  bar1: {\r\n    size: 350,\r\n    colors: [colors.forest, colors.gray],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar2: {\r\n    size: 400,\r\n    colors: [colors.gray, colors.periwinkle, colors.cyan, colors.salmon],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar3: {\r\n    size: 300,\r\n    colors: [\"#0d696e\", colors.cyan, \"#8e4129\", colors.salmon],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar4: {\r\n    size: 400,\r\n    colors: [colors.salmon, colors.cyan, colors.periwinkle],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar5: {\r\n    size: 400,\r\n    colors: [\r\n      colors.gray, // this is only used if prop notStartedColor is set\r\n      colors.lavender,\r\n      colors.midnight,\r\n      \"#0089e4\",\r\n      colors.forest,\r\n      \"#ea8500\",\r\n      \"#d54f41\",\r\n      \"#146ca9\",\r\n    ],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar6: {\r\n    size: 400,\r\n    colors: [colors.lavender],\r\n    padding: 0,\r\n    category: \"simpleBar\",\r\n  },\r\n  bar7: {\r\n    size: 400,\r\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\r\n    padding: 0,\r\n    category: \"simpleBar\",\r\n  },\r\n};\r\n\r\nfunction showValue(valueFormat: string): string {\r\n  return valueFormat === \"percentage\" || valueFormat === \"amount\" ? \"show-values\" : \"\";\r\n}\r\n\r\nexport const textHiddenMessage = intl.formatMessage({\r\n  id: \"chart.hiddenValues\",\r\n  defaultMessage: \"Values are not shown when too close to each other.\",\r\n  description: \"Text displayed when a chart has some values hidden\",\r\n});\r\n\r\nexport const seeDetailsMessage = intl.formatMessage({\r\n  id: \"chart.clickToSeeDetails\",\r\n  defaultMessage: \"Click or use arrow keys to see details.\",\r\n  description: \"Text displayed, guiding user to interact to see more details.\",\r\n});\r\n\r\nfunction abbrNumber(num: number) {\r\n  return num > 999 ? Math.round(num / 100) / 10 + \"K\" : num;\r\n}\r\n\r\nexport function amountToPercent(val: number, total: number, asInt: boolean) {\r\n  return asInt ? Math.round((val * 100) / total) : Math.round((val * 10000) / total) / 100; // with 2 decimals\r\n}\r\n\r\nexport function amountToDegree(val: number, total: number) {\r\n  // In a circle of {total}, determine degrees of slice {val}\r\n  return (val * 360) / total;\r\n}\r\n\r\nexport function toFixed(number: number) {\r\n  return parseFloat((Math.floor(number * 100) / 100).toFixed(2));\r\n}\r\n\r\nexport function polarToCartesian(half: number, radius: number, startAngle: number, endAngle?: number) {\r\n  var x = toFixed(half + half * radius * Math.cos((Math.PI * startAngle) / 180));\r\n  var y = toFixed(half + half * radius * Math.sin((Math.PI * startAngle) / 180));\r\n  if (endAngle !== undefined) {\r\n    // if a 2nd angle value was passed, return 2 pairs of coords\r\n    var x2 = toFixed(half + half * radius * Math.cos((Math.PI * endAngle) / 180));\r\n    var y2 = toFixed(half + half * radius * Math.sin((Math.PI * endAngle) / 180));\r\n    return { x1: x, y1: y, x2, y2 };\r\n  }\r\n  return { x, y };\r\n}\r\n\r\nfunction getArc(radius: number, largeArcFlag: string, x: number, y: number, chartSize: number) {\r\n  var z = toFixed((chartSize / 2) * radius);\r\n  return `A ${z}, ${z} 0 ${largeArcFlag} ${toFixed(x)}, ${toFixed(y)}`;\r\n}\r\n\r\nfunction scale(val: number, inMin: number, inMax: number, outMin: number, outMax: number) {\r\n  let scaled = ((val - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin;\r\n  // clip the values so that whatever is passed in the output is never smaller than outMin or greater than outMax\r\n  return scaled < outMin ? outMin : scaled > outMax ? outMax : scaled;\r\n}\r\n\r\nfunction minSpacing(width: number) {\r\n  // minimum spacing between 2 ticks, in px\r\n  return scale(width, 300, 900, 70, 150);\r\n}\r\n\r\nfunction getMaxTicks(width: number) {\r\n  return Math.round(width / minSpacing(width));\r\n}\r\n\r\nfunction getInterval(largest: number, maxticks: number) {\r\n  const minimum = largest / maxticks;\r\n  const magnitude = 10 ** Math.floor(Math.log10(minimum));\r\n  const residual = minimum / magnitude;\r\n  let interval;\r\n  if (residual > 5) {\r\n    interval = 10 * magnitude;\r\n  } else if (residual > 3) {\r\n    interval = 5 * magnitude;\r\n  } else if (residual > 2) {\r\n    interval = 3 * magnitude;\r\n  } else if (residual > 1.5) {\r\n    interval = 2 * magnitude;\r\n  } else if (residual > 1) {\r\n    interval = 1.5 * magnitude;\r\n  } else {\r\n    interval = magnitude;\r\n  }\r\n  return interval;\r\n}\r\n\r\nfunction handleSliceKeyDown(this: any, ev: KeyboardEvent) {\r\n  if (this.popoverEl && this.popoverEl.open && ev.key === \"Enter\") {\r\n    const popoverBtn = this.popoverEl.querySelector(\"button\");\r\n    popoverBtn && popoverBtn.click();\r\n  }\r\n}\r\n\r\nexport function handleSliceClick(this: any, ev: MouseEvent, s: SliceDetails) {\r\n  if (this.popoverEl && !this.isTabbing) {\r\n    s.coords = { x: ev.clientX, y: ev.clientY };\r\n    openPopover.call(this, s);\r\n  }\r\n}\r\n\r\nfunction handleSliceFocus(this: any, ev: FocusEvent, s: SliceDetails) {\r\n  if (this.popoverEl && this.isTabbing) {\r\n    s.coords = getPosition(ev.target as HTMLElement);\r\n    openPopover.call(this, s);\r\n  }\r\n}\r\n\r\nexport function handleChartKeydown(this: any, ev: KeyboardEvent) {\r\n  switch (ev.key) {\r\n    // arrow up / left\r\n    case \"ArrowUp\":\r\n    case \"ArrowLeft\":\r\n      ev.preventDefault();\r\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\r\n      focusPrevious.call(this);\r\n      break;\r\n    // arrow right / down\r\n    case \"ArrowRight\":\r\n    case \"ArrowDown\":\r\n      ev.preventDefault();\r\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\r\n      focusNext.call(this);\r\n      break;\r\n    // tab\r\n    case \"Tab\":\r\n      exitChart.call(this);\r\n      break;\r\n    case \"Escape\":\r\n      this.popoverEl!.open = false;\r\n      this.userIsNavigating = false;\r\n      break;\r\n  }\r\n}\r\n\r\nexport function openPopover(this: any, s: SliceDetails) {\r\n  if (!!this.popoverEl && !!s.title && !!s.text) {\r\n    this.popoverEl.popoverTitle = s.title;\r\n    this.popoverEl.popoverText = s.text;\r\n    this.popoverEl.buttonText = s.buttonText;\r\n    this.popoverEl.coords = s.coords;\r\n    this.popoverEl.sliceRef = s.sliceRef;\r\n    window.setTimeout(() => {\r\n      if (this.popoverEl) {\r\n        this.popoverEl.open = true;\r\n      }\r\n    }, 30);\r\n\r\n    const debouncedClosePopover = debounce(async () => {\r\n      this.popoverEl!.open = false;\r\n    }, 10);\r\n\r\n    // set up event listeners for scrolling\r\n    // to close popover on page scroll\r\n    document.addEventListener(\"scroll\", () => {\r\n      debouncedClosePopover();\r\n    });\r\n\r\n    // ... and on parent scroll\r\n    const scrollableParent = findParentWithScrollbar(this.el as HTMLElement);\r\n    if (!!scrollableParent) {\r\n      scrollableParent.addEventListener(\"scroll\", () => {\r\n        debouncedClosePopover();\r\n      });\r\n    }\r\n  }\r\n}\r\n\r\nfunction focusNext(this: any) {\r\n  const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\r\n  const index =\r\n    // if the active el is not in the array the first element gets focused\r\n    (this.sliceEls!.indexOf(activeEl as HTMLElement) + 1) % this.sliceEls!.length;\r\n  focusSlice.call(this, index);\r\n}\r\n\r\nfunction focusPrevious(this: any) {\r\n  if (this.sliceEls) {\r\n    const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\r\n    let index = this.sliceEls.indexOf(activeEl as SliceElement);\r\n\r\n    if (index === -1) {\r\n      // not in the array : focus the first slice\r\n      index = 0;\r\n    } else if (index === 0) {\r\n      // first slice : focus the last slice\r\n      index = this.sliceEls.length - 1;\r\n    } else {\r\n      // anything else: focus previous\r\n      index -= 1;\r\n    }\r\n    focusSlice.call(this, index);\r\n  }\r\n}\r\n\r\nfunction focusSlice(this: any, index: number) {\r\n  if (this.sliceEls && this.el) {\r\n    this.userIsNavigating = true;\r\n    if (this.popoverEl) {\r\n      this.popoverEl.open = false;\r\n    }\r\n    // set tabindex of the wrapper to -1 while slices are being focused, to allow for shft-tabbing out of the component directly\r\n    this.componentWrapperEl.tabIndex = -1;\r\n    // @ts-ignore\r\n    this.el.focusable = false; // for Edge\r\n    this.sliceEls.map((p: SliceElement) => {\r\n      p.tabIndex = -1;\r\n      // @ts-ignore\r\n      p.focusable = false; // for Edge\r\n    });\r\n    this.sliceEls[index].tabIndex = 0;\r\n    // @ts-ignore\r\n    this.sliceEls[index].focusable = true; // for Edge\r\n    this.sliceEls[index].focus();\r\n    window.setTimeout(() => {\r\n      if (this.popoverEl) {\r\n        this.popoverEl.open = true;\r\n      }\r\n    }, 10);\r\n  }\r\n}\r\n\r\nexport function exitChart(this: any) {\r\n  this.sliceEls &&\r\n    this.sliceEls.map((p: SliceElement) => {\r\n      p.tabIndex = -1;\r\n      // @ts-ignore\r\n      p.focusable = false; // for Edge\r\n    });\r\n  this.userIsNavigating = false;\r\n  // delay so that we can tab out of component before chart becomes focusable again\r\n  // and in case user was still pressing an arrow key when they pressed tab\r\n  window.setTimeout(() => {\r\n    this.componentWrapperEl.tabIndex = 0;\r\n    // @ts-ignore\r\n    this.el.focusable = true; // for Edge\r\n    if (this.popoverEl) {\r\n      this.popoverEl.open = false;\r\n    }\r\n  }, 100);\r\n}\r\n\r\nexport async function getDetails(this: any, chartType: ChartType) {\r\n  this.slicesDetails = [];\r\n  let acc = 0;\r\n  const children = Array.from(this.el.children) as Array<HTMLWmChartSliceElement>;\r\n\r\n  this.total = children.reduce(\r\n    (total: number, slice: SliceElement) => (total += parseInt(slice.getAttribute(\"amount\") || \"0\")),\r\n    0\r\n  );\r\n\r\n  children.forEach((c: Element, i: number) => {\r\n    const amount = parseInt(c.getAttribute(\"amount\") || \"0\");\r\n    const perc = amountToPercent(amount, this.total, true);\r\n\r\n    let colorIndex = i;\r\n\r\n    // for bar5, first color should be skipped unless notStartedColor is set to true\r\n    if (chartType === \"bar5\") {\r\n      colorIndex = this.notStartedColor ? i : i + 1;\r\n    }\r\n\r\n    // bars in bar6 are all the same color\r\n    if (chartType === \"bar6\") {\r\n      colorIndex = 0;\r\n    }\r\n\r\n    const color = allChartsDetails[chartType].colors[colorIndex];\r\n\r\n    const sliceDetails: SliceDetails = {\r\n      amount: amount,\r\n      perc: perc,\r\n      legend: c.getAttribute(\"legend\"),\r\n      color: color || colors.gray,\r\n      offset: acc,\r\n      id: `${this.uid}-${i + 1}`,\r\n      title: c.getAttribute(\"popover-title\"),\r\n      text: c.getAttribute(\"popover-text\"),\r\n      buttonText: c.getAttribute(\"popover-button-text\"),\r\n      sliceRef: c,\r\n      inSmallCluster: false,\r\n    };\r\n    acc += amount;\r\n    this.slicesDetails.push(sliceDetails);\r\n  });\r\n}\r\n\r\nfunction sortSlicesDetails(slicesDetails: SliceDetails[], total: number): SliceDetails[] {\r\n  // sort slices by decreasing amount\r\n  let sortedSlicesDetails = [...slicesDetails].sort((a: SliceDetails, b: SliceDetails) =>\r\n    a.amount === b.amount ? 0 : a.amount > b.amount ? -1 : 1\r\n  );\r\n\r\n  let acc = 0;\r\n\r\n  sortedSlicesDetails.forEach((s: SliceDetails, idx: number) => {\r\n    const prev = sortedSlicesDetails[idx === 0 ? sortedSlicesDetails.length - 1 : idx - 1];\r\n    const next = sortedSlicesDetails[idx === sortedSlicesDetails.length - 1 ? 0 : idx + 1];\r\n    const prevPerc = amountToPercent(prev.amount, total, true);\r\n    const nextPerc = amountToPercent(next.amount, total, true);\r\n\r\n    s.offset = acc;\r\n    acc += s.amount;\r\n    s.inSmallCluster = isInSmallCluster(prevPerc, s.perc, s.amount, nextPerc);\r\n  });\r\n  return sortedSlicesDetails;\r\n}\r\n\r\nfunction isInSmallCluster(prevPerc: number, perc: number, amount: number, nextPerc: number): boolean {\r\n  // determine whether the slice is in a cluster of small values\r\n  // to avoid percentage text overlap for small values\r\n  const isSmall = perc < 4;\r\n  const prevIsSmall = prevPerc < 5;\r\n  const nextIsSmall = nextPerc < 5;\r\n  let inSmallCluster = isSmall && (prevIsSmall || nextIsSmall);\r\n\r\n  // because <1% slice percentage text has an additional character\r\n  // the inSmallCluster threshold needs to be widened for that slice only\r\n  const lessThanOnePerc = perc === 0 && amount > 0;\r\n  if (lessThanOnePerc && (nextPerc < 8 || prevPerc < 8)) {\r\n    inSmallCluster = true;\r\n  }\r\n\r\n  return inSmallCluster;\r\n}\r\n\r\nfunction getPathData(this: any, amount: number, offset: number, chartType: ChartType) {\r\n  const startAngle = amountToDegree(offset, this.total) - 90; // start at noon, not at 3 o'clock\r\n  const activeAngle = (amount / this.total) * 360;\r\n  let endAngle = startAngle + activeAngle;\r\n  const largeArcFlagOuter = activeAngle > 180 ? \"1 1\" : \"0 1\";\r\n  const largeArcFlagInner = activeAngle > 180 ? \"1 0\" : \"0 0\";\r\n  const half = this.chartDetails.size / 2;\r\n  const innerRadius = this.chartDetails.thickness!;\r\n  const outerRadius = 1;\r\n\r\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\r\n  const outerSeparatorOffset = 1.5;\r\n  const innerSeparatorOffset = isHybridDoughnut ? 2.25 : 3;\r\n\r\n  if (activeAngle === 360) {\r\n    // fix to avoid bad svg shape when the path goes all around (100%)\r\n    endAngle -= 0.01;\r\n  }\r\n\r\n  const outerCoords = polarToCartesian(\r\n    half,\r\n    outerRadius,\r\n    startAngle + outerSeparatorOffset, // Addition for slice separator\r\n    endAngle\r\n  );\r\n  const innerCoords = polarToCartesian(\r\n    half,\r\n    innerRadius,\r\n    startAngle + innerSeparatorOffset, // Addition for slice separator\r\n    endAngle\r\n  );\r\n\r\n  const moveTo = `M ${outerCoords.x1}, ${outerCoords.y1} `;\r\n  const arc1 = getArc(outerRadius, largeArcFlagOuter, outerCoords.x2!, outerCoords.y2!, this.chartDetails.size);\r\n  const line = ` L ${innerCoords.x2}, ${innerCoords.y2} `;\r\n  const arc2 = getArc(innerRadius, largeArcFlagInner, innerCoords.x1!, innerCoords.y1!, this.chartDetails.size);\r\n\r\n  return moveTo + arc1 + line + arc2 + \" z\";\r\n}\r\n\r\nexport function renderInstructionsText() {\r\n  const chartInstructions = intl.formatMessage({\r\n    id: \"chart.instructions\",\r\n    defaultMessage: \"Use arrow keys to browse elements, press Tab to exit.\",\r\n    description: \"For screen readers only, instructions on how to interact with the chart component\",\r\n  });\r\n\r\n  return <div id=\"chart-instructions\">{chartInstructions}</div>;\r\n}\r\n\r\nfunction renderFilter() {\r\n  return (\r\n    <defs>\r\n      <filter id=\"wmHoverDropShadow\">\r\n        <feGaussianBlur stdDeviation=\"3\"></feGaussianBlur>\r\n        <feOffset result=\"offsetblur\"></feOffset>\r\n        <feFlood flood-color=\"#333\"></feFlood>\r\n        <feComposite operator=\"in\" in2=\"offsetblur\"></feComposite>\r\n        <feMerge>\r\n          <feMergeNode></feMergeNode>\r\n          <feMergeNode in=\"SourceGraphic\"></feMergeNode>\r\n        </feMerge>\r\n      </filter>\r\n    </defs>\r\n  );\r\n}\r\n\r\nexport function renderDoughnut(this: any, chartType: ChartType) {\r\n  const outerSize = this.chartDetails.size + this.chartDetails.padding;\r\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\r\n  // no sorting in progress indicators\r\n  let slicesDetails = isHybridDoughnut ? this.slicesDetails : sortSlicesDetails(this.slicesDetails, this.total);\r\n\r\n  return (\r\n    <div class=\"chart-wrapper doughnut-wrapper\">\r\n      <svg width={outerSize + \"px\"} height={outerSize + \"px\"} id={`graphic-${this.uid}`} class=\"doughnut-svg\">\r\n        {renderFilter()}\r\n        {slicesDetails.map((s: SliceDetails) => renderPath.call(this, s, chartType))}\r\n        {isHybridDoughnut ? (\r\n          <text\r\n            class=\"value\"\r\n            x=\"50%\"\r\n            y=\"50%\"\r\n            font-size=\"1.5rem\"\r\n            font-weight=\"500\"\r\n            text-anchor=\"middle\"\r\n            dominant-baseline=\"middle\"\r\n          >\r\n            {amountToPercent(slicesDetails[0].amount, this.total, true) + \"%\"}\r\n          </text>\r\n        ) : (\r\n          <g\r\n            transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}\r\n            text-anchor=\"middle\"\r\n            dominant-baseline=\"middle\"\r\n          >\r\n            {slicesDetails.map((s: SliceDetails) =>\r\n              s.amount > 0 && !s.inSmallCluster ? renderDoughnutText.call(this, s) : \"\"\r\n            )}\r\n          </g>\r\n        )}\r\n      </svg>\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderPath(this: any, s: SliceDetails, chartType: ChartType) {\r\n  return (\r\n    <g transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}>\r\n      <path\r\n        id={s.id}\r\n        class=\"segment doughnut-segment\"\r\n        fill={s.amount ? s.color : \"transparent\"}\r\n        d={getPathData.call(this, s.amount, s.offset, chartType)}\r\n        onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n        onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n        onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n        role=\"img\"\r\n        aria-label={s.legend}\r\n      ></path>\r\n    </g>\r\n  );\r\n}\r\n\r\nfunction renderDoughnutText(this: any, s: SliceDetails) {\r\n  const arcMiddle = amountToDegree(s.offset + s.amount / 2, this.total);\r\n  let { x, y } = polarToCartesian(this.chartDetails.size / 2, 1.4, arcMiddle - 90);\r\n  return (\r\n    <text class=\"value\" x={x + \"px\"} y={y + \"px\"}>\r\n      {`${s.perc > 0 ? s.perc : \"<1\"}%`}\r\n    </text>\r\n  );\r\n}\r\n\r\nexport function renderStackedBar(this: any, chartType: ChartType) {\r\n  const isHybridBar = chartType === \"bar1\" || chartType === \"bar\";\r\n  return (\r\n    <div class=\"chart-wrapper bar-wrapper\">\r\n      {isHybridBar ? (\r\n        <div class=\"single-perc\">{amountToPercent(this.slicesDetails[0].amount, this.total, true) + \"%\"}</div>\r\n      ) : (\r\n        \"\"\r\n      )}\r\n      {this.chartType === \"bar3\" && this.drawAxis()}\r\n      <div class={`inner-stacked-bar-wrapper ${showValue(this.tempValueFormat)}`}>\r\n        {!isHybridBar ? (\r\n          <div class=\"values\">\r\n            {this.slicesDetails.map((s: SliceDetails, idx: number) => this.renderBarText(s, idx))}\r\n          </div>\r\n        ) : (\r\n          \"\"\r\n        )}\r\n        <div class=\"stacked-bar-segments-wrapper\">\r\n          {this.slicesDetails.map((s: SliceDetails, idx: number) => renderStackedBarSegment.call(this, s, idx))}\r\n        </div>\r\n        {isHybridBar ? renderCompletionMessage.call(this) : \"\"}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderStackedBarSegment(this: any, s: SliceDetails, idx: number) {\r\n  const isLastSlice = idx !== this.slicesDetails.length - 1;\r\n  const width = `calc(${amountToPercent(s.amount, this.total, false)}%${isLastSlice ? \" - 2px\" : \"\"})`;\r\n\r\n  return (\r\n    <div\r\n      class={`segment stacked-bar-segment ${amountToPercent(s.amount, this.total, false) === 0 ? \"zero\" : \"\"}`}\r\n      style={{\r\n        backgroundColor: s.color,\r\n        width: width,\r\n      }}\r\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n    >\r\n      <span class=\"sr-only\">{s.legend}</span>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderSimpleBar(this: any, chartType: ChartType) {\r\n  // find largest number and get interval, numTicks, chartMaxVal for all.\r\n  const largest = this.slicesDetails\r\n    .map((s: SliceDetails) => s.amount)\r\n    .reduce((a: number, b: number) => {\r\n      return a > b ? a : b;\r\n    });\r\n  const labelWidth = parseInt(getComputedStyle(this.el).getPropertyValue(\"--labelWidth\"), 10);\r\n  const chartPadding = 48; \r\n  const componentWidth = this.el.getBoundingClientRect().width;\r\n  const chartWidth = componentWidth - labelWidth - chartPadding;\r\n  let numTicks = getMaxTicks(chartWidth);\r\n  let interval = getInterval(largest, numTicks);\r\n  // after the algorithm finds an interval, remove extra ticks so that the greater number is always between the last tick and the one before that\r\n  const lastTickVal = numTicks * interval;\r\n  const extraTicks = Math.floor((lastTickVal - largest) / interval);\r\n  numTicks -= extraTicks;\r\n\r\n  this.el.style.setProperty(\"--backgroundSize\", 100 / numTicks + \"%\");\r\n  this.el.style.setProperty(\"--labelWidth\", this.labelWidth);\r\n\r\n  if (chartType === \"bar7\" && !this.showBarLegend) {\r\n    this.el.style.setProperty(\"--labelWidth\", \"0px\");\r\n  }\r\n\r\n  // we have to prep the data here rather than iterate directly in the return statement\r\n  // because CSS grid needs a flat structure, and return functions must\r\n  // have a single parent element\r\n  const rows: HTMLElement[] = [];\r\n  this.slicesDetails.forEach((s: SliceDetails) => {\r\n    s.legend && rows.push(renderSimpleBarLegend(s.legend, this.showBarLegend, chartType));\r\n    rows.push(renderSimpleBarItem.call(this, s, interval, numTicks, largest));\r\n  });\r\n\r\n  const ticks = [];\r\n  for (let i = 1; i <= numTicks; i++) {\r\n    const tickVal: number | string = abbrNumber(i * interval);\r\n    ticks.push(\r\n      <div class=\"tick\">\r\n        <span>{tickVal}</span>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  const showGrid = chartType === \"bar6\" && this.showGrid && this.el.getBoundingClientRect().width > 300;\r\n\r\n  return (\r\n    <div class=\"chart-wrapper simple-bar-wrapper\">\r\n      <div class={`chart ${showValue(this.tempValueFormat)}`}>\r\n        {showGrid && <div class=\"gridlines\"></div>}\r\n        <div class=\"rows\">{rows}</div>\r\n      </div>\r\n      {showGrid && (\r\n        <div class=\"x-axis\" aria-hidden=\"true\">\r\n          <div class=\"zero\">\r\n            <span>0</span>\r\n          </div>\r\n          {ticks}\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderSimpleBarLegend(legend: string, show: boolean, chartType: ChartType): HTMLLabelElement {\r\n  // not sure how to collapse the left column to 0 width with CSS grid. text should still be available to SR.\r\n  const hidden = chartType === \"bar7\" && !show ? \" hidden\" : \"\";\r\n  return <label class={`label${hidden}`}>{legend}</label>;\r\n}\r\n\r\nfunction renderSimpleBarItem(\r\n  this: any,\r\n  s: SliceDetails,\r\n  interval: number,\r\n  ticks: number,\r\n  largest: number\r\n): HTMLDivElement {\r\n  const chartMaxVal = this.currentChartType === \"bar6\" ? interval * ticks : largest;\r\n  const width = amountToPercent(s.amount, chartMaxVal, false);\r\n  const cssWidth: string = width ? width + \"%\" : \"1px\";\r\n  const amt = abbrNumber(s.amount);\r\n  let displayValue = this.tempValueFormat === \"amount\" ? amt : \"\";\r\n  if (this.currentChartType === \"bar6\" && this.tempValueFormat === \"percentage\") {\r\n    displayValue = s.amount + \"%\";\r\n  } else if (this.currentChartType === \"bar7\" && this.tempValueFormat === \"percentage\") {\r\n    displayValue = amountToPercent(s.amount, this.total, true) + \"%\";\r\n  }\r\n\r\n  return (\r\n    <div\r\n      class={\"bar segment\"}\r\n      style={{\r\n        backgroundColor: s.color,\r\n        width: cssWidth,\r\n      }}\r\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n    >\r\n      <div class=\"value\">{displayValue}</div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderLegend(this: any, chartType: ChartType) {\r\n  // legend is hidden for bar1 and bar6 types regardless of showLegend value\r\n  if (this.showLegend) {\r\n    const hasCluster =\r\n      !this.chartDetails.isBar &&\r\n      this.slicesDetails.reduce(\r\n        (hasCluster: boolean, cur: SliceDetails) => (hasCluster = cur.inSmallCluster ? true : hasCluster),\r\n        false\r\n      );\r\n    return (\r\n      <div class=\"legend-wrapper\">\r\n        <div class={`legend ${chartType} ${this.mode === \"bar\" ? \"--top\" : \"--bottom\"}`} aria-hidden=\"true\">\r\n          {this.total > 0\r\n            ? this.slicesDetails.map((s: SliceDetails) => {\r\n                // when both legend and amount are omitted, the legend is not shown for that particular option (it's been deactivated by the user)\r\n                if (!!s.amount || !!s.legend) {\r\n                  return renderLegendItem({ key: s.legend!, color: s.color });\r\n                }\r\n              })\r\n            : \"\"}\r\n        </div>\r\n        {hasCluster && renderHiddenValuesMessage()}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nexport function renderLegendItem(legendItem: LegendItem) {\r\n  return (\r\n    <div class=\"legend-item\">\r\n      <div class=\"legend-color\" style={{ backgroundColor: legendItem.color }}></div>\r\n      <div class=\"legend-text\">{legendItem.key}</div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderCompletionMessage(this: any) {\r\n  if (this.completionMessage) {\r\n    return <div class=\"completion-message\">{this.completionMessage}</div>;\r\n  }\r\n}\r\n\r\nexport function renderHiddenValuesMessage() {\r\n  return (\r\n    <div class=\"hidden-values-warning\">\r\n      {textHiddenMessage}\r\n      <br />\r\n      {seeDetailsMessage}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"q8DAIA,IAAMA,EAAS,CACbC,OAAQ,UACRC,KAAM,UACNC,OAAQ,UACRC,MAAO,UACPC,SAAU,UACVC,SAAU,UACVC,WAAY,UACZC,KAAM,W,IAGKC,EAAgBC,EAAA,IAAyC,CAEpEC,SAAU,CACRC,KAAM,IACNZ,OAAQ,CAACA,EAAOG,OAAQH,EAAOQ,MAC/BK,UAAW,IACXC,QAAS,GACTC,SAAU,YAGZC,UAAW,CACTJ,KAAM,IACNZ,OAAQ,CAACA,EAAOG,OAAQH,EAAOQ,MAC/BK,UAAW,IACXC,QAAS,GACTC,SAAU,YAEZE,UAAW,CACTL,KAAM,IACNZ,OAAQ,CAACA,EAAOM,SAAUN,EAAOK,SAAUL,EAAOQ,MAClDK,UAAW,GACXC,QAAS,GACTC,SAAU,YAEZG,UAAW,CACTN,KAAM,IACNZ,OAAQ,CAACA,EAAOE,KAAMF,EAAOC,OAAQD,EAAOQ,MAC5CK,UAAW,GACXC,QAAS,GACTC,SAAU,YAIZI,cAAe,CACbP,KAAM,IACNZ,OAAQ,CAACA,EAAOO,WAAYP,EAAOE,KAAMF,EAAOC,OAAQD,EAAOQ,MAC/DK,UAAW,GACXC,QAAS,GACTC,SAAU,YAEZK,UAAW,CACTR,KAAM,IACNZ,OAAQ,CAACA,EAAOM,SAAUN,EAAOK,SAAU,UAAWL,EAAOG,OAAQ,UAAW,UAAW,WAC3FU,UAAW,GACXC,QAAS,GACTC,SAAU,YAGZM,IAAK,CACHT,KAAM,IACNZ,OAAQ,CAACA,EAAOG,OAAQH,EAAOQ,MAC/BM,QAAS,EACTC,SAAU,cAGZO,KAAM,CACJV,KAAM,IACNZ,OAAQ,CAACA,EAAOG,OAAQH,EAAOQ,MAC/BM,QAAS,EACTC,SAAU,cAEZQ,KAAM,CACJX,KAAM,IACNZ,OAAQ,CAACA,EAAOQ,KAAMR,EAAOO,WAAYP,EAAOE,KAAMF,EAAOC,QAC7Da,QAAS,EACTC,SAAU,cAEZS,KAAM,CACJZ,KAAM,IACNZ,OAAQ,CAAC,UAAWA,EAAOE,KAAM,UAAWF,EAAOC,QACnDa,QAAS,EACTC,SAAU,cAEZU,KAAM,CACJb,KAAM,IACNZ,OAAQ,CAACA,EAAOC,OAAQD,EAAOE,KAAMF,EAAOO,YAC5CO,QAAS,EACTC,SAAU,cAEZW,KAAM,CACJd,KAAM,IACNZ,OAAQ,CACNA,EAAOQ,KACPR,EAAOM,SACPN,EAAOK,SACP,UACAL,EAAOG,OACP,UACA,UACA,WAEFW,QAAS,EACTC,SAAU,cAEZY,KAAM,CACJf,KAAM,IACNZ,OAAQ,CAACA,EAAOM,UAChBQ,QAAS,EACTC,SAAU,aAEZa,KAAM,CACJhB,KAAM,IACNZ,OAAQ,CAACA,EAAOO,WAAYP,EAAOE,KAAMF,EAAOC,OAAQD,EAAOQ,MAC/DM,QAAS,EACTC,SAAU,eAId,SAASc,EAAUC,GACjB,OAAOA,IAAgB,cAAgBA,IAAgB,SAAW,cAAgB,EACpF,CAEO,IAAMC,EAAoBC,EAAKC,cAAc,CAClDC,GAAI,qBACJC,eAAgB,qDAChBC,YAAa,uDAGR,IAAMC,EAAoBL,EAAKC,cAAc,CAClDC,GAAI,0BACJC,eAAgB,0CAChBC,YAAa,kEAGf,SAASE,EAAWC,GAClB,OAAOA,EAAM,IAAMC,KAAKC,MAAMF,EAAM,KAAO,GAAK,IAAMA,CACxD,C,SAEgBG,EAAgBC,EAAaC,EAAeC,GAC1D,OAAOA,EAAQL,KAAKC,MAAOE,EAAM,IAAOC,GAASJ,KAAKC,MAAOE,EAAM,IAASC,GAAS,GACvF,C,SAEgBE,EAAeH,EAAaC,GAE1C,OAAQD,EAAM,IAAOC,CACvB,C,SAEgBG,EAAQC,GACtB,OAAOC,YAAYT,KAAKU,MAAMF,EAAS,KAAO,KAAKD,QAAQ,GAC7D,C,SAEgBI,EAAiBC,EAAcC,EAAgBC,EAAoBC,GACjF,IAAIC,EAAIT,EAAQK,EAAOA,EAAOC,EAASb,KAAKiB,IAAKjB,KAAKkB,GAAKJ,EAAc,MACzE,IAAIK,EAAIZ,EAAQK,EAAOA,EAAOC,EAASb,KAAKoB,IAAKpB,KAAKkB,GAAKJ,EAAc,MACzE,GAAIC,IAAaM,UAAW,CAE1B,IAAIC,EAAKf,EAAQK,EAAOA,EAAOC,EAASb,KAAKiB,IAAKjB,KAAKkB,GAAKH,EAAY,MACxE,IAAIQ,EAAKhB,EAAQK,EAAOA,EAAOC,EAASb,KAAKoB,IAAKpB,KAAKkB,GAAKH,EAAY,MACxE,MAAO,CAAES,GAAIR,EAAGS,GAAIN,EAAGG,GAAEA,EAAEC,GAAEA,E,CAE/B,MAAO,CAAEP,EAACA,EAAEG,EAACA,EACf,CAEA,SAASO,EAAOb,EAAgBc,EAAsBX,EAAWG,EAAWS,GAC1E,IAAIC,EAAItB,EAASqB,EAAY,EAAKf,GAClC,MAAO,KAAAiB,OAAKD,EAAC,MAAAC,OAAKD,EAAC,OAAAC,OAAMH,EAAY,KAAAG,OAAIvB,EAAQS,GAAE,MAAAc,OAAKvB,EAAQY,GAClE,CAEA,SAASY,EAAM5B,EAAa6B,EAAeC,EAAeC,EAAgBC,GACxE,IAAIC,GAAWjC,EAAM6B,IAAUG,EAASD,IAAYD,EAAQD,GAASE,EAErE,OAAOE,EAASF,EAASA,EAASE,EAASD,EAASA,EAASC,CAC/D,CAEA,SAASC,EAAWC,GAElB,OAAOP,EAAMO,EAAO,IAAK,IAAK,GAAI,IACpC,CAEA,SAASC,EAAYD,GACnB,OAAOtC,KAAKC,MAAMqC,EAAQD,EAAWC,GACvC,CAEA,SAASE,EAAYC,EAAiBC,GACpC,IAAMC,EAAUF,EAAUC,EAC1B,IAAME,EAAY5C,KAAA6C,IAAA,GAAM7C,KAAKU,MAAMV,KAAK8C,MAAMH,KAC9C,IAAMI,EAAWJ,EAAUC,EAC3B,IAAII,EACJ,GAAID,EAAW,EAAG,CAChBC,EAAW,GAAKJ,C,MACX,GAAIG,EAAW,EAAG,CACvBC,EAAW,EAAIJ,C,MACV,GAAIG,EAAW,EAAG,CACvBC,EAAW,EAAIJ,C,MACV,GAAIG,EAAW,IAAK,CACzBC,EAAW,EAAIJ,C,MACV,GAAIG,EAAW,EAAG,CACvBC,EAAW,IAAMJ,C,KACZ,CACLI,EAAWJ,C,CAEb,OAAOI,CACT,CAEA,SAASC,EAA8BC,GACrC,GAAIC,KAAKC,WAAaD,KAAKC,UAAUC,MAAQH,EAAGI,MAAQ,QAAS,CAC/D,IAAMC,EAAaJ,KAAKC,UAAUI,cAAc,UAChDD,GAAcA,EAAWE,O,CAE7B,C,SAEgBC,EAA4BR,EAAgBS,GAC1D,GAAIR,KAAKC,YAAcD,KAAKS,UAAW,CACrCD,EAAEE,OAAS,CAAE7C,EAAGkC,EAAGY,QAAS3C,EAAG+B,EAAGa,SAClCC,EAAYC,KAAKd,KAAMQ,E,CAE3B,CAEA,SAASO,EAA4BhB,EAAgBS,GACnD,GAAIR,KAAKC,WAAaD,KAAKS,UAAW,CACpCD,EAAEE,OAASM,EAAYjB,EAAGkB,QAC1BJ,EAAYC,KAAKd,KAAMQ,E,CAE3B,C,SAEgBU,EAA8BnB,GAC5C,OAAQA,EAAGI,KAET,IAAK,UACL,IAAK,YACHJ,EAAGoB,iBACHnB,KAAKS,UAAY,KACjBW,EAAcN,KAAKd,MACnB,MAEF,IAAK,aACL,IAAK,YACHD,EAAGoB,iBACHnB,KAAKS,UAAY,KACjBY,EAAUP,KAAKd,MACf,MAEF,IAAK,MACHsB,EAAUR,KAAKd,MACf,MACF,IAAK,SACHA,KAAKC,UAAWC,KAAO,MACvBF,KAAKuB,iBAAmB,MACxB,MAEN,C,SAEgBV,EAAuBL,G,WACrC,KAAMR,KAAKC,aAAeO,EAAEgB,SAAWhB,EAAEiB,KAAM,CAC7CzB,KAAKC,UAAUyB,aAAelB,EAAEgB,MAChCxB,KAAKC,UAAU0B,YAAcnB,EAAEiB,KAC/BzB,KAAKC,UAAU2B,WAAapB,EAAEoB,WAC9B5B,KAAKC,UAAUS,OAASF,EAAEE,OAC1BV,KAAKC,UAAU4B,SAAWrB,EAAEqB,SAC5BC,OAAOC,YAAW,WAChB,GAAIC,EAAK/B,UAAW,CAClB+B,EAAK/B,UAAUC,KAAO,I,IAEvB,IAEH,IAAM+B,EAAwBC,GAAS,kBAAAC,UAAAH,OAAA,qB,qCACrChC,KAAKC,UAAWC,KAAO,M,kBACtB,IAIHkC,SAASC,iBAAiB,UAAU,WAClCJ,G,IAIF,IAAMK,EAAmBC,EAAwBvC,KAAKwC,IACtD,KAAMF,EAAkB,CACtBA,EAAiBD,iBAAiB,UAAU,WAC1CJ,G,KAIR,CAEA,SAASZ,IACP,IAAMoB,EAAWC,EAAyBN,SAASO,eACnD,IAAMC,GAEH5C,KAAK6C,SAAUC,QAAQL,GAA2B,GAAKzC,KAAK6C,SAAUE,OACzEC,EAAWlC,KAAKd,KAAM4C,EACxB,CAEA,SAASxB,IACP,GAAIpB,KAAK6C,SAAU,CACjB,IAAMJ,EAAWC,EAAyBN,SAASO,eACnD,IAAIC,EAAQ5C,KAAK6C,SAASC,QAAQL,GAElC,GAAIG,KAAW,EAAG,CAEhBA,EAAQ,C,MACH,GAAIA,IAAU,EAAG,CAEtBA,EAAQ5C,KAAK6C,SAASE,OAAS,C,KAC1B,CAELH,GAAS,C,CAEXI,EAAWlC,KAAKd,KAAM4C,E,CAE1B,CAEA,SAASI,EAAsBJ,GAA/B,IAAAZ,EAAAhC,KACE,GAAIA,KAAK6C,UAAY7C,KAAKwC,GAAI,CAC5BxC,KAAKuB,iBAAmB,KACxB,GAAIvB,KAAKC,UAAW,CAClBD,KAAKC,UAAUC,KAAO,K,CAGxBF,KAAKiD,mBAAmBC,UAAY,EAEpClD,KAAKwC,GAAGW,UAAY,MACpBnD,KAAK6C,SAASO,KAAI,SAACC,GACjBA,EAAEH,UAAY,EAEdG,EAAEF,UAAY,K,IAEhBnD,KAAK6C,SAASD,GAAOM,SAAW,EAEhClD,KAAK6C,SAASD,GAAOO,UAAY,KACjCnD,KAAK6C,SAASD,GAAOU,QACrBxB,OAAOC,YAAW,WAChB,GAAIC,EAAK/B,UAAW,CAClB+B,EAAK/B,UAAUC,KAAO,I,IAEvB,G,CAEP,C,SAEgBoB,I,WACdtB,KAAK6C,UACH7C,KAAK6C,SAASO,KAAI,SAACC,GACjBA,EAAEH,UAAY,EAEdG,EAAEF,UAAY,K,IAElBnD,KAAKuB,iBAAmB,MAGxBO,OAAOC,YAAW,WAChBC,EAAKiB,mBAAmBC,SAAW,EAEnClB,EAAKQ,GAAGW,UAAY,KACpB,GAAInB,EAAK/B,UAAW,CAClB+B,EAAK/B,UAAUC,KAAO,K,IAEvB,IACL,CAEO,SAAeqD,EAAsBC,G,wGAC1CxD,KAAKyD,cAAgB,GACjBC,EAAM,EACJC,EAAWC,MAAMC,KAAK7D,KAAKwC,GAAGmB,UAEpC3D,KAAK/C,MAAQ0G,EAASG,QACpB,SAAC7G,EAAe8G,GAAmB,OAAM9G,GAAS+G,SAASD,EAAME,aAAa,WAAa,IAAxD,GACnC,GAGFN,EAASO,SAAQ,SAACC,EAAYC,GAC5B,IAAMC,EAASL,SAASG,EAAEF,aAAa,WAAa,KACpD,IAAMK,EAAOvH,EAAgBsH,EAAQrC,EAAK/E,MAAO,MAEjD,IAAIsH,EAAaH,EAGjB,GAAIZ,IAAc,OAAQ,CACxBe,EAAavC,EAAKwC,gBAAkBJ,EAAIA,EAAI,C,CAI9C,GAAIZ,IAAc,OAAQ,CACxBe,EAAa,C,CAGf,IAAME,EAAQ3J,EAAiB0I,GAAWnJ,OAAOkK,GAEjD,IAAMG,EAA6B,CACjCL,OAAQA,EACRC,KAAMA,EACNK,OAAQR,EAAEF,aAAa,UACvBQ,MAAOA,GAASpK,EAAOQ,KACvB+J,OAAQlB,EACRnH,GAAI,GAAAoC,OAAGqD,EAAK6C,IAAG,KAAAlG,OAAIyF,EAAI,GACvB5C,MAAO2C,EAAEF,aAAa,iBACtBxC,KAAM0C,EAAEF,aAAa,gBACrBrC,WAAYuC,EAAEF,aAAa,uBAC3BpC,SAAUsC,EACVW,eAAgB,OAElBpB,GAAOW,EACPrC,EAAKyB,cAAcsB,KAAKL,E,oBAI5B,SAASM,EAAkBvB,EAA+BxG,GAExD,IAAIgI,EAAsBC,cAAA,GAAIzB,EAAa,MAAE0B,MAAK,SAACC,EAAiBC,GAClE,OAAAD,EAAEf,SAAWgB,EAAEhB,OAAS,EAAIe,EAAEf,OAASgB,EAAEhB,QAAU,EAAI,CAAvD,IAGF,IAAIX,EAAM,EAEVuB,EAAoBf,SAAQ,SAAC1D,EAAiB8E,GAC5C,IAAMC,EAAON,EAAoBK,IAAQ,EAAIL,EAAoBlC,OAAS,EAAIuC,EAAM,GACpF,IAAME,EAAOP,EAAoBK,IAAQL,EAAoBlC,OAAS,EAAI,EAAIuC,EAAM,GACpF,IAAMG,EAAW1I,EAAgBwI,EAAKlB,OAAQpH,EAAO,MACrD,IAAMyI,EAAW3I,EAAgByI,EAAKnB,OAAQpH,EAAO,MAErDuD,EAAEoE,OAASlB,EACXA,GAAOlD,EAAE6D,OACT7D,EAAEsE,eAAiBa,EAAiBF,EAAUjF,EAAE8D,KAAM9D,EAAE6D,OAAQqB,E,IAElE,OAAOT,CACT,CAEA,SAASU,EAAiBF,EAAkBnB,EAAcD,EAAgBqB,GAGxE,IAAME,EAAUtB,EAAO,EACvB,IAAMuB,EAAcJ,EAAW,EAC/B,IAAMK,EAAcJ,EAAW,EAC/B,IAAIZ,EAAiBc,IAAYC,GAAeC,GAIhD,IAAMC,EAAkBzB,IAAS,GAAKD,EAAS,EAC/C,GAAI0B,IAAoBL,EAAW,GAAKD,EAAW,GAAI,CACrDX,EAAiB,I,CAGnB,OAAOA,CACT,CAEA,SAASkB,EAAuB3B,EAAgBO,EAAgBpB,GAC9D,IAAM7F,EAAaR,EAAeyH,EAAQ5E,KAAK/C,OAAS,GACxD,IAAMgJ,EAAe5B,EAASrE,KAAK/C,MAAS,IAC5C,IAAIW,EAAWD,EAAasI,EAC5B,IAAMC,EAAoBD,EAAc,IAAM,MAAQ,MACtD,IAAME,EAAoBF,EAAc,IAAM,MAAQ,MACtD,IAAMxI,EAAOuC,KAAKoG,aAAanL,KAAO,EACtC,IAAMoL,EAAcrG,KAAKoG,aAAalL,UACtC,IAAMoL,EAAc,EAEpB,IAAMC,EAAmB/C,IAAc,aAAeA,IAAc,WACpE,IAAMgD,EAAuB,IAC7B,IAAMC,EAAuBF,EAAmB,KAAO,EAEvD,GAAIN,IAAgB,IAAK,CAEvBrI,GAAY,G,CAGd,IAAM8I,EAAclJ,EAClBC,EACA6I,EACA3I,EAAa6I,EACb5I,GAEF,IAAM+I,EAAcnJ,EAClBC,EACA4I,EACA1I,EAAa8I,EACb7I,GAGF,IAAMgJ,EAAS,KAAAjI,OAAK+H,EAAYrI,GAAE,MAAAM,OAAK+H,EAAYpI,GAAE,KACrD,IAAMuI,EAAOtI,EAAO+H,EAAaJ,EAAmBQ,EAAYvI,GAAKuI,EAAYtI,GAAK4B,KAAKoG,aAAanL,MACxG,IAAM6L,EAAO,MAAAnI,OAAMgI,EAAYxI,GAAE,MAAAQ,OAAKgI,EAAYvI,GAAE,KACpD,IAAM2I,EAAOxI,EAAO8H,EAAaF,EAAmBQ,EAAYtI,GAAKsI,EAAYrI,GAAK0B,KAAKoG,aAAanL,MAExG,OAAO2L,EAASC,EAAOC,EAAOC,EAAO,IACvC,C,SAEgBC,IACd,IAAMC,EAAoB5K,EAAKC,cAAc,CAC3CC,GAAI,qBACJC,eAAgB,wDAChBC,YAAa,sFAGf,OAAOyK,EAAA,OAAK3K,GAAG,sBAAsB0K,EACvC,CAEA,SAASE,IACP,OACED,EAAA,YACEA,EAAA,UAAQ3K,GAAG,qBACT2K,EAAA,kBAAgBE,aAAa,MAC7BF,EAAA,YAAUG,OAAO,eACjBH,EAAA,yBAAqB,SACrBA,EAAA,eAAaI,SAAS,KAAKC,IAAI,eAC/BL,EAAA,eACEA,EAAA,oBACAA,EAAA,eAAaM,GAAG,oBAK1B,C,SAEgBC,EAA0BjE,G,WACxC,IAAMkE,EAAY1H,KAAKoG,aAAanL,KAAO+E,KAAKoG,aAAajL,QAC7D,IAAMoL,EAAmB/C,IAAc,aAAeA,IAAc,WAEpE,IAAIC,EAAgB8C,EAAmBvG,KAAKyD,cAAgBuB,EAAkBhF,KAAKyD,cAAezD,KAAK/C,OAEvG,OACEiK,EAAA,OAAKS,MAAM,kCACTT,EAAA,OAAK/H,MAAOuI,EAAY,KAAME,OAAQF,EAAY,KAAMnL,GAAI,WAAAoC,OAAWqB,KAAK6E,KAAO8C,MAAM,gBACtFR,IACA1D,EAAcL,KAAI,SAAC5C,GAAoB,OAAAqH,EAAW/G,KAAKkB,EAAMxB,EAAGgD,EAAzB,IACvC+C,EACCW,EAAA,QACES,MAAM,QACN9J,EAAE,MACFG,EAAE,MAAK,YACG,SAAQ,cACN,MAAK,cACL,SAAQ,oBACF,UAEjBjB,EAAgB0G,EAAc,GAAGY,OAAQrE,KAAK/C,MAAO,MAAQ,KAGhEiK,EAAA,KACEY,UAAW,aAAAnJ,OAAaqB,KAAKoG,aAAajL,QAAU,EAAC,MAAAwD,OAAKqB,KAAKoG,aAAajL,QAAU,EAAC,KAAG,cAC9E,SAAQ,oBACF,UAEjBsI,EAAcL,KAAI,SAAC5C,GAClB,OAAAA,EAAE6D,OAAS,IAAM7D,EAAEsE,eAAiBiD,EAAmBjH,KAAKkB,EAAMxB,GAAK,EAAvE,MAOd,CAEA,SAASqH,EAAsBrH,EAAiBgD,GAAhD,IAAAxB,EAAAhC,KACE,OACEkH,EAAA,KAAGY,UAAW,aAAAnJ,OAAaqB,KAAKoG,aAAajL,QAAU,EAAC,MAAAwD,OAAKqB,KAAKoG,aAAajL,QAAU,EAAC,MACxF+L,EAAA,QACE3K,GAAIiE,EAAEjE,GACNoL,MAAM,2BACNK,KAAMxH,EAAE6D,OAAS7D,EAAEiE,MAAQ,cAC3BwD,EAAGjC,EAAYlF,KAAKd,KAAMQ,EAAE6D,OAAQ7D,EAAEoE,OAAQpB,GAC9C0E,QAAS,SAACnI,GAAO,OAAAQ,EAAiBO,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB2H,QAAS,SAACpI,GAAO,OAAAgB,EAAiBD,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB4H,UAAW,SAACrI,GAAO,OAAAD,EAAmBgB,KAAKkB,EAAMjC,EAA9B,EACnBsI,KAAK,MAAK,aACE7H,EAAEmE,SAItB,CAEA,SAASoD,EAA8BvH,GACrC,IAAM8H,EAAYnL,EAAeqD,EAAEoE,OAASpE,EAAE6D,OAAS,EAAGrE,KAAK/C,OAC3D,IAAAsL,EAAW/K,EAAiBwC,KAAKoG,aAAanL,KAAO,EAAG,IAAKqN,EAAY,IAAvEzK,EAAC0K,EAAA1K,EAAEG,EAACuK,EAAAvK,EACV,OACEkJ,EAAA,QAAMS,MAAM,QAAQ9J,EAAGA,EAAI,KAAMG,EAAGA,EAAI,MACrC,GAAAW,OAAG6B,EAAE8D,KAAO,EAAI9D,EAAE8D,KAAO,KAAI,KAGpC,C,SAEgBkE,EAA4BhF,G,WAC1C,IAAMiF,EAAcjF,IAAc,QAAUA,IAAc,MAC1D,OACE0D,EAAA,OAAKS,MAAM,6BACRc,EACCvB,EAAA,OAAKS,MAAM,eAAe5K,EAAgBiD,KAAKyD,cAAc,GAAGY,OAAQrE,KAAK/C,MAAO,MAAQ,KAAU,GAIvG+C,KAAKwD,YAAc,QAAUxD,KAAK0I,WACnCxB,EAAA,OAAKS,MAAO,6BAAAhJ,OAA6BzC,EAAU8D,KAAK2I,oBACpDF,EACAvB,EAAA,OAAKS,MAAM,UACR3H,KAAKyD,cAAcL,KAAI,SAAC5C,EAAiB8E,GAAgB,OAAAtD,EAAK4G,cAAcpI,EAAG8E,EAAtB,KACtD,GAIR4B,EAAA,OAAKS,MAAM,gCACR3H,KAAKyD,cAAcL,KAAI,SAAC5C,EAAiB8E,GAAgB,OAAAuD,EAAwB/H,KAAKkB,EAAMxB,EAAG8E,EAAtC,KAE3DmD,EAAcK,EAAwBhI,KAAKd,MAAQ,IAI5D,CAEA,SAAS6I,EAAmCrI,EAAiB8E,GAA7D,IAAAtD,EAAAhC,KACE,IAAM+I,EAAczD,IAAQtF,KAAKyD,cAAcV,OAAS,EACxD,IAAM5D,EAAQ,QAAAR,OAAQ5B,EAAgByD,EAAE6D,OAAQrE,KAAK/C,MAAO,OAAM,KAAA0B,OAAIoK,EAAc,SAAW,GAAE,KAEjG,OACE7B,EAAA,OACES,MAAO,+BAAAhJ,OAA+B5B,EAAgByD,EAAE6D,OAAQrE,KAAK/C,MAAO,SAAW,EAAI,OAAS,IACpG+L,MAAO,CACLC,gBAAiBzI,EAAEiE,MACnBtF,MAAOA,GAET+I,QAAS,SAACnI,GAAO,OAAAQ,EAAiBO,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB2H,QAAS,SAACpI,GAAO,OAAAgB,EAAiBD,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB4H,UAAW,SAACrI,GAAO,OAAAD,EAAmBgB,KAAKkB,EAAMjC,EAA9B,GAEnBmH,EAAA,QAAMS,MAAM,WAAWnH,EAAEmE,QAG/B,C,SAEgBuE,EAA2B1F,G,WAEzC,IAAMlE,EAAUU,KAAKyD,cAClBL,KAAI,SAAC5C,GAAoB,OAAAA,EAAE6D,MAAF,IACzBP,QAAO,SAACsB,EAAWC,GAClB,OAAOD,EAAIC,EAAID,EAAIC,C,IAEvB,IAAM8D,EAAanF,SAASoF,iBAAiBpJ,KAAKwC,IAAI6G,iBAAiB,gBAAiB,IACxF,IAAMC,EAAe,GACrB,IAAMC,EAAiBvJ,KAAKwC,GAAGgH,wBAAwBrK,MACvD,IAAMsK,EAAaF,EAAiBJ,EAAaG,EACjD,IAAII,EAAWtK,EAAYqK,GAC3B,IAAI5J,EAAWR,EAAYC,EAASoK,GAEpC,IAAMC,EAAcD,EAAW7J,EAC/B,IAAM+J,EAAa/M,KAAKU,OAAOoM,EAAcrK,GAAWO,GACxD6J,GAAYE,EAEZ5J,KAAKwC,GAAGwG,MAAMa,YAAY,mBAAoB,IAAMH,EAAW,KAC/D1J,KAAKwC,GAAGwG,MAAMa,YAAY,eAAgB7J,KAAKmJ,YAE/C,GAAI3F,IAAc,SAAWxD,KAAK8J,cAAe,CAC/C9J,KAAKwC,GAAGwG,MAAMa,YAAY,eAAgB,M,CAM5C,IAAME,EAAsB,GAC5B/J,KAAKyD,cAAcS,SAAQ,SAAC1D,GAC1BA,EAAEmE,QAAUoF,EAAKhF,KAAKiF,EAAsBxJ,EAAEmE,OAAQ3C,EAAK8H,cAAetG,IAC1EuG,EAAKhF,KAAKkF,EAAoBnJ,KAAKkB,EAAMxB,EAAGX,EAAU6J,EAAUpK,G,IAGlE,IAAM4K,EAAQ,GACd,IAAK,IAAI9F,EAAI,EAAGA,GAAKsF,EAAUtF,IAAK,CAClC,IAAM+F,EAA2BxN,EAAWyH,EAAIvE,GAChDqK,EAAMnF,KACJmC,EAAA,OAAKS,MAAM,QACTT,EAAA,YAAOiD,I,CAKb,IAAMC,EAAW5G,IAAc,QAAUxD,KAAKoK,UAAYpK,KAAKwC,GAAGgH,wBAAwBrK,MAAQ,IAElG,OACE+H,EAAA,OAAKS,MAAM,oCACTT,EAAA,OAAKS,MAAO,SAAAhJ,OAASzC,EAAU8D,KAAK2I,mBACjCyB,GAAYlD,EAAA,OAAKS,MAAM,cACxBT,EAAA,OAAKS,MAAM,QAAQoC,IAEpBK,GACClD,EAAA,OAAKS,MAAM,SAAQ,cAAa,QAC9BT,EAAA,OAAKS,MAAM,QACTT,EAAA,kBAEDgD,GAKX,CAEA,SAASF,EAAsBrF,EAAgB0F,EAAe7G,GAE5D,IAAM8G,EAAS9G,IAAc,SAAW6G,EAAO,UAAY,GAC3D,OAAOnD,EAAA,SAAOS,MAAO,QAAAhJ,OAAQ2L,IAAW3F,EAC1C,CAEA,SAASsF,EAEPzJ,EACAX,EACAqK,EACA5K,GALF,IAAA0C,EAAAhC,KAOE,IAAMuK,EAAcvK,KAAKwK,mBAAqB,OAAS3K,EAAWqK,EAAQ5K,EAC1E,IAAMH,EAAQpC,EAAgByD,EAAE6D,OAAQkG,EAAa,OACrD,IAAME,EAAmBtL,EAAQA,EAAQ,IAAM,MAC/C,IAAMuL,EAAM/N,EAAW6D,EAAE6D,QACzB,IAAIsG,EAAe3K,KAAK2I,kBAAoB,SAAW+B,EAAM,GAC7D,GAAI1K,KAAKwK,mBAAqB,QAAUxK,KAAK2I,kBAAoB,aAAc,CAC7EgC,EAAenK,EAAE6D,OAAS,G,MACrB,GAAIrE,KAAKwK,mBAAqB,QAAUxK,KAAK2I,kBAAoB,aAAc,CACpFgC,EAAe5N,EAAgByD,EAAE6D,OAAQrE,KAAK/C,MAAO,MAAQ,G,CAG/D,OACEiK,EAAA,OACES,MAAO,cACPqB,MAAO,CACLC,gBAAiBzI,EAAEiE,MACnBtF,MAAOsL,GAETvC,QAAS,SAACnI,GAAO,OAAAQ,EAAiBO,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB2H,QAAS,SAACpI,GAAO,OAAAgB,EAAiBD,KAAKkB,EAAMjC,EAAIS,EAAhC,EACjB4H,UAAW,SAACrI,GAAO,OAAAD,EAAmBgB,KAAKkB,EAAMjC,EAA9B,GAEnBmH,EAAA,OAAKS,MAAM,SAASgD,GAG1B,C,SAEgBC,EAAwBpH,GAEtC,GAAIxD,KAAK6K,WAAY,CACnB,IAAMC,GACH9K,KAAKoG,aAAa2E,OACnB/K,KAAKyD,cAAcK,QACjB,SAACgH,EAAqBE,GAAiB,OAAMF,EAAaE,EAAIlG,eAAiB,KAAOgG,CAA/C,GACvC,OAEJ,OACE5D,EAAA,OAAKS,MAAM,kBACTT,EAAA,OAAKS,MAAO,UAAAhJ,OAAU6E,EAAS,KAAA7E,OAAIqB,KAAKiL,OAAS,MAAQ,QAAU,YAAY,cAAc,QAC1FjL,KAAK/C,MAAQ,EACV+C,KAAKyD,cAAcL,KAAI,SAAC5C,GAEtB,KAAMA,EAAE6D,UAAY7D,EAAEmE,OAAQ,CAC5B,OAAOuG,EAAiB,CAAE/K,IAAKK,EAAEmE,OAASF,MAAOjE,EAAEiE,O,KAGvD,IAELqG,GAAcK,I,CAIvB,C,SAEgBD,EAAiBE,GAC/B,OACElE,EAAA,OAAKS,MAAM,eACTT,EAAA,OAAKS,MAAM,eAAeqB,MAAO,CAAEC,gBAAiBmC,EAAW3G,SAC/DyC,EAAA,OAAKS,MAAM,eAAeyD,EAAWjL,KAG3C,C,SAEgB2I,IACd,GAAI9I,KAAKqL,kBAAmB,CAC1B,OAAOnE,EAAA,OAAKS,MAAM,sBAAsB3H,KAAKqL,kB,CAEjD,C,SAEgBF,IACd,OACEjE,EAAA,OAAKS,MAAM,yBACRvL,EACD8K,EAAA,WACCxK,EAGP,C"}

package/dist/ripple/p-ce52357e.js

@@ -1,2 +0,0 @@
-const o="3.25.0-2";if(window.navigator.plugins.length>0){console.log("Ripple component library",o)}function n(o){if(o.key=="Tab"){var n=new Event("wmUserIsTabbing");window.dispatchEvent(n);document.querySelector("body").classList.add("wmcl-user-is-tabbing")}if(o.key=="ArrowLeft"||o.key=="ArrowUp"||o.key=="ArrowRight"||o.key=="ArrowDown"){var n=new Event("wmUserIsKeying");window.dispatchEvent(n);document.querySelector("body").classList.add("wmcl-user-is-keying")}}function e(){var o=new Event("wmUserIsNotTabbing");window.dispatchEvent(o);document.querySelector("body").classList.remove("wmcl-user-is-tabbing");document.querySelector("body").classList.remove("wmcl-user-is-keying")}window.addEventListener("keydown",n);window.addEventListener("mousedown",e);const i=document.createElement("div");i.id="wm-tooltip-container";const t=document.createElement("div");t.id="wm-tooltip";t.setAttribute("aria-hidden","true");t.style.position="fixed";t.style.overflow="hidden";t.style.pointerEvents="none";t.style.lineHeight="normal";t.style.fontFamily="inherit";t.style.fontSize="0.875rem";t.style.textTransform="none";t.style.fontWeight="normal";t.style.background="black";t.style.color="#fff";t.style.zIndex="999999";t.style.maxWidth="var(--wmTooltipMaxWidth, 13.75rem)";t.style.marginRight="1.5rem";t.style.padding="0.375rem";t.style.transitionProperty="opacity";t.style.transitionDelay="opacity";t.style.opacity="0";t.style.top="0";t.style.left="0";t.style.transform="translateZ(0)";t.style.willChange="transform";t.style.transform="translate(var(--wmTooltipLeft), var(--wmTooltipTop))";i.appendChild(t);const r=document.querySelector("body");r.appendChild(i);
-//# sourceMappingURL=p-ce52357e.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["window","navigator","plugins","length","console","log","version","wmComponentKeys","ev","key","event","Event","dispatchEvent","document","querySelector","classList","add","wmComponentMouseDownOnce","remove","addEventListener","tooltipContainer","createElement","id","tooltipEl","setAttribute","style","position","overflow","pointerEvents","lineHeight","fontFamily","fontSize","textTransform","fontWeight","background","color","zIndex","maxWidth","marginRight","padding","transitionProperty","transitionDelay","opacity","top","left","transform","willChange","appendChild","body"],"sources":["./src/global/global.ts"],"sourcesContent":["import { setMode } from \"@stencil/core\";\r\nimport { version } from \"../../package.json\";\r\n\r\n// PRINT RIPPLE VERSION IN CONSOLE\r\n// test envs return 0 for plugin.length\r\n// do not print version number there as it causes issues\r\nif (window.navigator.plugins.length > 0) {\r\n  console.log(\"Ripple component library\", version);\r\n}\r\n\r\n// USER-IS-TABBING CLASSES (FOR FOCUS INDICATORS)\r\n// Dispatching events to track whether user is navigating with keyboard or mouse\r\nfunction wmComponentKeys(ev: KeyboardEvent) {\r\n  if (ev.key == \"Tab\") {\r\n    var event: Event = new Event(\"wmUserIsTabbing\");\r\n    window.dispatchEvent(event);\r\n    document.querySelector(\"body\")!.classList.add(\"wmcl-user-is-tabbing\");\r\n  }\r\n  if (ev.key == \"ArrowLeft\" || ev.key == \"ArrowUp\" || ev.key == \"ArrowRight\" || ev.key == \"ArrowDown\") {\r\n    var event: Event = new Event(\"wmUserIsKeying\");\r\n    window.dispatchEvent(event);\r\n    document.querySelector(\"body\")!.classList.add(\"wmcl-user-is-keying\");\r\n  }\r\n}\r\n\r\nfunction wmComponentMouseDownOnce() {\r\n  var event = new Event(\"wmUserIsNotTabbing\");\r\n  window.dispatchEvent(event);\r\n  document.querySelector(\"body\")!.classList.remove(\"wmcl-user-is-tabbing\");\r\n  document.querySelector(\"body\")!.classList.remove(\"wmcl-user-is-keying\");\r\n}\r\n\r\nwindow.addEventListener(\"keydown\", wmComponentKeys);\r\nwindow.addEventListener(\"mousedown\", wmComponentMouseDownOnce);\r\n\r\n// MODES (FOR PRODUCT-SPECIFIC STYLING)\r\n//Checks for mode attribute explicitly set on the document. If \"mode\" is set on component, it will override the global mode. Falls back to default (Planning styles)\r\nsetMode((elm) => {\r\n  return elm.getAttribute(\"mode\") || document.documentElement.getAttribute(\"mode\") || \"planning\";\r\n});\r\n\r\n// TOOLTIP\r\n// Add a tooltip element\r\n// This allows tooltips to be always at the highest stacking context (always on top)\r\n// Element is added withing a container to avoid performance impact\r\nconst tooltipContainer = document.createElement(\"div\");\r\ntooltipContainer.id = \"wm-tooltip-container\";\r\nconst tooltipEl = document.createElement(\"div\");\r\ntooltipEl.id = \"wm-tooltip\";\r\ntooltipEl.setAttribute(\"aria-hidden\", \"true\");\r\ntooltipEl.style.position = \"fixed\";\r\ntooltipEl.style.overflow = \"hidden\";\r\ntooltipEl.style.pointerEvents = \"none\";\r\ntooltipEl.style.lineHeight = \"normal\";\r\ntooltipEl.style.fontFamily = \"inherit\";\r\ntooltipEl.style.fontSize = \"0.875rem\";\r\ntooltipEl.style.textTransform = \"none\";\r\ntooltipEl.style.fontWeight = \"normal\";\r\ntooltipEl.style.background = \"black\";\r\ntooltipEl.style.color = \"#fff\";\r\ntooltipEl.style.zIndex = \"999999\";\r\ntooltipEl.style.maxWidth = \"var(--wmTooltipMaxWidth, 13.75rem)\";\r\ntooltipEl.style.marginRight = \"1.5rem\";\r\ntooltipEl.style.padding = \"0.375rem\";\r\ntooltipEl.style.transitionProperty = \"opacity\";\r\ntooltipEl.style.transitionDelay = \"opacity\";\r\ntooltipEl.style.opacity = \"0\";\r\ntooltipEl.style.top = \"0\";\r\ntooltipEl.style.left = \"0\";\r\ntooltipEl.style.transform = \"translateZ(0)\";\r\ntooltipEl.style.willChange = \"transform\";\r\ntooltipEl.style.transform = \"translate(var(--wmTooltipLeft), var(--wmTooltipTop))\";\r\n\r\ntooltipContainer.appendChild(tooltipEl);\r\nconst body = document.querySelector(\"body\");\r\nbody!.appendChild(tooltipContainer);\r\n"],"mappings":"mBAMA,GAAIA,OAAOC,UAAUC,QAAQC,OAAS,EAAG,CACvCC,QAAQC,IAAI,2BAA4BC,E,CAK1C,SAASC,EAAgBC,GACvB,GAAIA,EAAGC,KAAO,MAAO,CACnB,IAAIC,EAAe,IAAIC,MAAK,mBAC5BX,OAAOY,cAAcF,GACrBG,SAASC,cAAc,QAAMC,UAAAC,IAAA,uB,CAE/B,GAAAR,EAAAC,KAAA,aAAAD,EAAAC,KAAA,WAAAD,EAAAC,KAAA,cAAAD,EAAAC,KAAA,aACE,IAAIC,EAAe,IAAIC,MAAM,kBAC7BX,OAAOY,cAAcF,GACrBG,SAASC,cAAc,QAAMC,UAAAC,IAAA,sB,CAEjC,CAEA,SAAAC,IACE,IAAIP,EAAQ,IAAIC,MAAM,sBACtBX,OAAOY,cAAcF,GACrBG,SAASC,cAAc,QAAMC,UAAAG,OAAA,wBAC7BL,SAASC,cAAc,QAASC,UAAUG,OAAO,sBACnD,CAEAlB,OAAAmB,iBAAA,UAAAZ,GACAP,OAAOmB,iBAAiB,YAAaF,GAYrC,MAAMG,EAAmBP,SAASQ,cAAc,OAChDD,EAAiBE,GAAK,uBACtB,MAAMC,EAAYV,SAASQ,cAAc,OACzCE,EAAUD,GAAK,aACfC,EAAUC,aAAa,sBACvBD,EAAUE,MAAMC,SAAW,QAC3BH,EAAUE,MAAME,SAAW,SAC3BJ,EAAUE,MAAMG,cAAgB,OAChCL,EAAUE,MAAMI,WAAa,SAC7BN,EAAUE,MAAMK,WAAa,UAC7BP,EAAUE,MAAMM,SAAW,WAC3BR,EAAUE,MAAMO,cAAgB,OAChCT,EAAUE,MAAMQ,WAAa,SAC7BV,EAAUE,MAAMS,WAAa,QAC7BX,EAAUE,MAAMU,MAAQ,OACxBZ,EAAUE,MAAMW,OAAS,SACzBb,EAAUE,MAAMY,SAAW,qCAC3Bd,EAAUE,MAAMa,YAAc,SAC9Bf,EAAUE,MAAMc,QAAU,WAC1BhB,EAAUE,MAAMe,mBAAqB,UACrCjB,EAAUE,MAAMgB,gBAAkB,UAClClB,EAAUE,MAAMiB,QAAU,IAC1BnB,EAAUE,MAAMkB,IAAM,IACtBpB,EAAUE,MAAMmB,KAAO,IACvBrB,EAAUE,MAAMoB,UAAY,gBAC5BtB,EAAUE,MAAMqB,WAAa,YAC7BvB,EAAUE,MAAMoB,UAAY,uDAE5BzB,EAAiB2B,YAAYxB,GAC7B,MAAMyB,EAAOnC,SAASC,cAAc,QACpCkC,EAAMD,YAAY3B"}

package/dist/ripple/p-d0f5773a.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as i,h as t,H as r,g as a}from"./p-1c23de4a.js";import{i as s,g as n,e as p}from"./p-05e0f901.js";const o=':host,wm-input{font-family:inherit;width:100%}:host *,wm-input *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper,wm-input .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label,wm-input .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-input .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-input .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-input .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-input .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label,wm-input .wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper.invalid .label,wm-input .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-input .wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after,[dir=RTL] wm-input .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-input .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper .inner-wrapper,wm-input .wrapper .inner-wrapper{width:100%}:host .wrapper .inputfield-wrapper,wm-input .wrapper .inputfield-wrapper{height:2.5rem;border:1px solid #4a4a4a;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:-ms-flexbox;display:flex}:host .wrapper .character-count,wm-input .wrapper .character-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:5rem;background-color:rgba(74, 74, 74, 0.05);font-size:0.875rem;font-weight:500;-ms-flex-item-align:stretch;align-self:stretch}:host .wrapper input,wm-input .wrapper input{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:none;font-family:inherit;font-size:0.875rem;height:100%;-ms-flex:1;flex:1;padding:0.75rem 1rem;width:100%}:host .wrapper input:disabled,wm-input .wrapper input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper input:focus,wm-input .wrapper input:focus{outline:none}:host .wrapper .info,wm-input .wrapper .info{font-style:italic;line-height:100%;margin:4px 0}:host .wrapper.invalid .inputfield-wrapper,wm-input .wrapper.invalid .inputfield-wrapper{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}:host .wrapper.invalid .error-message,wm-input .wrapper.invalid .error-message{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem;line-height:100%}:host .wrapper:focus .inputfield-wrapper,:host .wrapper.focus .inputfield-wrapper,wm-input .wrapper:focus .inputfield-wrapper,wm-input .wrapper.focus .inputfield-wrapper{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}:host .sr-only,wm-input .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}';const l=class{constructor(t){e(this,t);this.wmInputValueChanged=i(this,"wmInputValueChanged",7);this.uid="";this.previousBlurredValue="";this.numberErrorMessage=s.formatMessage({id:"input.numberError",defaultMessage:"Please enter a valid number."});this.label=undefined;this.labelPosition="top";this.value="";this.disabled=false;this.info=undefined;this.placeholder="";this.requiredField=false;this.requiredFieldMessage=undefined;this.errorMessage=undefined;this.characterLimit=undefined;this.preventValidation=undefined;this.type="text";this.step=1;this.min=undefined;this.max=undefined;this.announcement="";this.displayedErrorMessage=""}get charCount(){return this.value.length}componentWillLoad(){this.uid=this.el.id?this.el.id:n();if(!this.label){console.error("wm-input requires the label property")}}componentDidLoad(){if(this.value){this.inputEl.value=this.value;this.previousBlurredValue=this.inputEl.value}}handleErrorMessage(e){this.displayedErrorMessage=e}handleKeyDown(e){const i=e.ctrlKey||e.metaKey||e.altKey;const t=/^.$/.test(e.key)&&!i;const r=t&&this.characterLimit&&this.inputEl.value.length>=this.characterLimit;if(r){this.announce(this.generateCharacterLimitWarning(this.charCount,this.characterLimit))}}handleBlur(e){if(this.value!==this.previousBlurredValue){this.wmInputValueChanged.emit({value:this.value})}this.previousBlurredValue=this.value;const i=this.preventValidation&&p(e,this.preventValidation);if(!i){this.displayedErrorMessage=this.validate()}this.inputWrapperEl.classList.remove("focus")}handleInput(e){this.value=e.target.value;if(this.characterLimit&&this.charCount>=this.characterLimit-5){this.announce(this.generateCharacterLimitWarning(this.charCount,this.characterLimit))}}handleFocus(){this.inputWrapperEl.classList.add("focus")}validate(){const e=[this.validateNumber.bind(this),this.validateRequired.bind(this)];if(this.errorMessage){return this.errorMessage}else{return e.reduce(((e,i)=>e?e:i()),"")}}validateRequired(){const e=this.requiredFieldMessage||s.formatMessage({id:"global.requiredError",defaultMessage:"This field is required."});return this.requiredField&&this.value===""?e:""}validateNumber(){return this.type==="number"&&this.inputEl.validity.badInput?this.numberErrorMessage:""}announce(e){if(this.liveRegionEl.textContent===e){e+=" "}this.announcement=e}generateCharacterLimitWarning(e,i){const t=s.formatMessage({id:"global.charactersEntered",defaultMessage:"{x, number} of {y, number} characters entered.",description:"for screen readers"},{x:e,y:i});const r=s.formatMessage({id:"global.characterLimitReached",defaultMessage:"No additional characters will be entered.",description:"for screen readers"});return`${t}${e>=i?" "+r:""}`}generateCharacterLimitLabel(e){return s.formatMessage({id:"global.characterLimit",defaultMessage:"{limit, number} characters allowed.",description:"for screen readers"},{limit:e})}renderErrorMessage(){return this.errorMessage||this.displayedErrorMessage}render(){return t(r,{id:this.uid},t("div",{class:`wrapper label-${this.labelPosition} ${this.errorMessage||this.displayedErrorMessage?"invalid":""}`,ref:e=>this.inputWrapperEl=e},t("div",{class:"label-wrapper"},this.labelPosition!=="none"&&t("label",{htmlFor:`inputfield-${this.uid}`,class:"label"},this.label,this.requiredField&&t("span",{class:"required","aria-hidden":"true"},"*"))),t("div",{class:"inner-wrapper"},t("div",{class:"inputfield-wrapper"},t("input",{ref:e=>this.inputEl=e,id:`inputfield-${this.uid}`,disabled:this.disabled,"aria-label":`${this.label}${this.characterLimit?" "+this.generateCharacterLimitLabel(this.characterLimit):""}`,"aria-describedby":`info-${this.uid} error-${this.uid}`,onInput:e=>this.handleInput(e),onKeyDown:e=>this.handleKeyDown(e),onBlur:e=>this.handleBlur(e),onFocus:this.handleFocus.bind(this),placeholder:this.placeholder,autocomplete:"off","aria-required":this.requiredField?"true":null,maxLength:this.characterLimit||undefined,type:this.type,step:this.step,max:this.max,min:this.min}),this.characterLimit&&typeof this.characterLimit==="number"?t("div",{class:"character-count"},this.charCount,"/",this.characterLimit):""),this.info&&t("div",{id:`info-${this.uid}`,class:"info"},this.info),t("div",{id:`error-${this.uid}`,"aria-live":"assertive",class:"error-message","aria-atomic":"true"},this.renderErrorMessage()),t("div",{class:"sr-only","aria-live":"polite","aria-atomic":"true",ref:e=>this.liveRegionEl=e},this.announcement))))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{errorMessage:["handleErrorMessage"]}}};l.style=o;export{l as wm_input};
-//# sourceMappingURL=p-d0f5773a.entry.js.map