@watermarkinsights/ripple 3.25.0 → 3.25.1

package/dist/esm-es5/wm-uploader.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmUploaderCss","Uploader","this","inputId","generateId","Object","defineProperty","prototype","el","shadowRoot","querySelector","concat","type","uploaderType","defaultMaxSize","maxSizeLimit","maxSize","Math","min","maxFiles","fileList","length","errorMessage","internalErrorMessage","toggleTabbingOn","isTabbing","toggleTabbingOff","handleUploadProgress","ev","_this","map","i","id","detail","progress","forceUpdate","numFilesInProgress","srProgress","total_1","setInterval","aggregate","reduce","avg","item","announce","uploaderMessages","getUploadProgress","floor","handleFileErrorCleared","filename","name","errorList","filter","error","uploadButtonEl","focus","handleFileDeleted","clearErrors","wmUploaderDeleteFile","emit","wmFileDelete","wmDeleteFile","handleFilePreviewed","wmUploaderPreviewFile","wmFilePreview","handleFileDownloaded","wmUploaderDownloadFile","wmFileDownload","wmDownloadFile","parseFiles","files","list","JSON","parse","forEach","size","match","convertedSize","convertBytes","toFixed","unit","Error","focusAfterRemoval","newFiles","oldFiles","newFileIds_1","file","oldFileIds","removedFileId","includes","indexOf","fileIdPrecedingRemoved_1","fileElPrecedingRemoved","focusedElementsButtons","querySelectorAll","lastButtonInFile","parseRejectedFiles","rejectedFiles","uploadNotifications","newNum","oldNum","setTimeout","notif","finishedUploading","clearInterval","getFilesUploading","handleErrorMessageChange","isValidSize","effectiveMaxSize","bytes","unitOrder","unitIndex","result","parseInt","isDuplicate","hasDuplicateUploadingFile","filesToUpload","some","fileToUpload","hasDuplicateUploadedFile","f","isEmpty","fileLimitReached","isItemUploading","hasOwnProperty","message","liveRegion","textContent","announcement","handleFiles","Array","from","target","validTypes","fileTypes","split","join","fileLimitExceeded","hasValidType","getInvalidFileType","push","zeroFileSize","getFileTooLarge","duplicateName","wmUploaderFilesSelected","wmFilesSelected","value","componentWillLoad","buttonText","console","warn","tempUploaderType","emptyStateText","componentDidLoad","document","body","classList","contains","uploadButtonOnClick","isDisabled","preventDefault","srMsg","waitToUpload","renderUploadSvg","h","class","width","height","viewBox","transform","fill","d","renderIcon","rotate","icon","String","fromCodePoint","renderInfo","info","renderNotif","renderError","displayedErrorMessage","renderUploadButton","classes","accessibleLabel","label","requiredField","multiple","onClick","onChange","htmlFor","renderEmptyState","renderErrorList","srMessage","acc","err","formatTimestamp","timestamp","uploadDate","Date","day","getDate","month","getMonth","year","getFullYear","time","toLocaleTimeString","hour","minute","formattedDate","renderInProgressFileList","stringify","showInfo","renderUploadedFileList","lastUpdated","renderFiles","sortBy","sort","a","b","localeCompare","legacyRenderHeader","renderHeader","renderRequirements","getAcceptedFileTypes","getFileCount","getMaxSize","renderFooter","getFilesAdded","renderWithItems","hasNewlyUploadedFiles","renderLabel","render","Host","ref"],"sources":["src/components/wm-uploader/wm-uploader.scss?tag=wm-uploader&encapsulation=shadow","src/components/wm-uploader/wm-uploader.tsx"],"sourcesContent":[":host,\nwm-uploader {\n  display: block;\n  position: relative;\n  max-width: 1140px;\n\n  &[dir=\"RTL\"] {\n    .mdi {\n      margin-left: rem-calc(5);\n      margin-right: 0;\n    }\n  }\n  @extend %wm-button;\n\n  input:focus + .wm-button.user-is-tabbing {\n    -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 !important;\n    -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 !important;\n    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 !important;\n  }\n}\n\n:host *,\nwm-uploader * {\n  box-sizing: border-box;\n}\n\n.wm-button.disabled {\n  // override the %wm-button rule\n  // we want a pointer event when disabled,\n  // to trigger a SR message\n  pointer-events: initial !important;\n}\n\n@include label;\n#label {\n  margin-bottom: rem-calc(8);\n}\n\n.header {\n  .info-wrapper {\n    align-items: center;\n    .info {\n      font-size: rem-calc(14);\n      margin-left: 1rem;\n    }\n  }\n\n  .accepted-types {\n    font-size: rem-calc(14);\n  }\n\n  .requirements {\n    font-size: rem-calc(14);\n    margin-left: rem-calc(16);\n  }\n}\n\n.footer {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  padding: rem-calc(15 30);\n\n  .notif-wrapper {\n    align-items: flex-end;\n  }\n\n  .filecount-wrapper {\n    display: flex;\n    align-items: center;\n    .filecount {\n      font-size: 0.875rem;\n      margin-right: 1rem;\n    }\n  }\n}\n\n.notif-wrapper {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  margin-bottom: rem-calc(12);\n\n  .requirements {\n    display: flex;\n    flex-direction: column;\n  }\n}\n\n.notif,\n#error {\n  padding-top: rem-calc(4);\n  font-size: 0.875rem;\n  font-style: italic;\n\n  &#error {\n    @include errorMessage;\n  }\n}\n\n.info-wrapper {\n  position: relative; // for .info\n  display: flex;\n}\n\n.list-container {\n  overflow-y: unset;\n\n  &.checkmark-spacer {\n    margin-right: rem-calc(44);\n  }\n\n  &:has(.error-list, .inprogress-list, .file-list) {\n    margin-top: rem-calc(40);\n  }\n\n  ul {\n    padding: 0;\n    width: 100%;\n    margin: 0;\n\n    wm-file {\n      margin-bottom: rem-calc(8);\n    }\n  }\n}\n\n.sr-only {\n  @include srOnly;\n}\n\n/// FOR DEPRECATED TYPES ///////////////////////////////////////\n.empty-block {\n  margin: 5rem auto;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  .upload-file {\n    margin-bottom: rem-calc(30);\n  }\n\n  .empty-message {\n    font-size: 0.875rem;\n    &.large {\n      font-size: 1.5rem;\n    }\n    margin-bottom: rem-calc(7);\n  }\n\n  .info-wrapper {\n    justify-content: center;\n    width: 100%; // for .notif\n\n    .wm-button {\n      // Removing the width inherit here to prevent a 100% width\n      // from the info-wrapper. Future proofing a day when\n      // we might want a long notif to wrap.\n      width: auto;\n    }\n  }\n}\n\n.header {\n  &.type1,\n  &.type2 {\n    margin-bottom: 1rem;\n  }\n  .slot-wrapper {\n    display: flex;\n    justify-content: flex-start;\n    align-items: flex-start;\n  }\n}\n\n.notif-wrapper {\n  &.type1,\n  &.type2 {\n    flex-direction: column;\n    margin-bottom: rem-calc(16);\n  }\n}\n\n.list-container {\n  &.type1,\n  &.type2 {\n    overflow-y: auto;\n    ul {\n      margin: revert;\n    }\n    .file-list li,\n    .inprogress-list li {\n      // margin-bottom also on the last element, otherwise tooltip on dl and delete btns triggers a scrollbar\n      margin-bottom: rem-calc(26);\n    }\n    .error-list li {\n      margin-bottom: rem-calc(20);\n    }\n  }\n\n  &.type1 {\n    padding: rem-calc(0 30);\n    height: rem-calc(260);\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop, State, Listen, Watch } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { generateId, hasValidType } from \"../../global/functions\";\nimport { UploadedFile } from \"../../global/interfaces\";\nimport { uploaderMessages } from \"../../global/intl\";\ninterface ErrorFile {\n  name: string;\n  message: string;\n}\n\n@Component({\n  tag: \"wm-uploader\",\n  styleUrl: \"wm-uploader.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Uploader {\n  @Element() el!: HTMLWmUploaderElement;\n  private liveRegion!: HTMLDivElement;\n  get uploadButtonEl(): HTMLElement {\n    return this.el.shadowRoot!.querySelector(`#${this.inputId}`) as HTMLElement;\n  }\n\n  @Prop({ mutable: true }) uploaderType?: \"1\" | \"2\"; // only mutable for the deprecation transition\n  @Prop() type?: \"1\" | \"2\"; // DEPRECATED in favor of uploaderType\n  get tempUploaderType() {\n    // replace instances of this.tempUploaderType with this.uploaderType once type is fully phased out\n    return this.type || this.uploaderType;\n  }\n  @Prop() label?: string;\n  @Prop() buttonText!: string;\n  @Prop() info?: string;\n  @Prop() emptyStateText!: string;\n  @Prop() icon!: string;\n  @Prop() fileTypes: string = \"pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv\";\n  @Prop() maxSize?: number | null; // in Mb\n  @Prop() maxFiles?: number;\n  @Prop() sortBy: \"name\" | \"date\" = \"date\"; // name is descending (a -> z), date is ascending (earlier -> later)\n  @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\n  @Prop() errorMessage?: string;\n  @Prop() requiredField?: boolean;\n\n  @Prop() files?: string; // String representation of an array of files (the files retrieved from the server)\n  @State() fileList: UploadedFile[] = []; // the string above transformed into the actual array\n  @Prop({ mutable: true }) filesToUpload: File[] = []; // input.files that passed validation\n\n  @State() isTabbing: boolean = false;\n\n  @Prop() rejectedFiles?: string; // String representation of an array of errors to add to errorList, allows devs to display server-side errors\n  @State() errorList: ErrorFile[] = []; // for errors on a particular file\n  @State() notif?: string | null; // for upload notifications\n  @State() internalErrorMessage?: string;\n  @State() announcement: string = \"\";\n  @State() numFilesInProgress?: number | null; // null when not uploading != 0 (when all files are done uploading) != undefined (original state)\n  @State() isCondensed: boolean = false;\n  private srProgress?: any; // setInterval for SR to announce the aggregate progress percentage when things take a long time. stored here so it can be stopped when upload is finished.\n  private inputId = generateId();\n\n  @Event() wmUploaderFilesSelected!: EventEmitter;\n  @Event() wmFilesSelected!: EventEmitter; // deprecated in favor of wmUploaderFilesSelected\n  @Event() wmUploaderDeleteFile!: EventEmitter;\n  @Event() wmDeleteFile!: EventEmitter; // deprecated in favor of wmUploaderDeleteFile\n  @Event() wmUploaderDownloadFile!: EventEmitter;\n  @Event() wmDownloadFile!: EventEmitter; // deprecated in favor of wmUploaderDownloadFile\n  @Event() wmUploaderPreviewFile!: EventEmitter;\n\n  @Event() wmFileDelete!: EventEmitter<string>;\n  @Event() wmFileDownload!: EventEmitter<string>;\n  @Event() wmFilePreview!: EventEmitter<string>;\n\n  get effectiveMaxSize() {\n    const defaultMaxSize = 100;\n    // maxsize cannot be set to over 100Mb\n    const maxSizeLimit = 100;\n\n    return this.maxSize ? Math.min(this.maxSize, maxSizeLimit) : defaultMaxSize;\n  }\n\n  get fileLimitReached() {\n    return this.maxFiles && this.fileList.length >= this.maxFiles;\n  }\n\n  get displayedErrorMessage(): string {\n    return this.errorMessage || this.internalErrorMessage || \"\";\n  }\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"wmUploadProgress\")\n  handleUploadProgress(ev: CustomEvent) {\n    this.fileList.map((i) => {\n      if (i.id === ev.detail.id) {\n        i.progress = ev.detail.progress;\n        forceUpdate(this.el);\n      }\n    });\n\n    if (ev.detail.progress === 100) {\n      // inProgressList is not a perfect reflection of how many files are uploading\n      // because even after progress reached 100% the item should remain in the array\n      // (should only be removed once it appears in fileList)\n      this.numFilesInProgress! -= 1;\n    }\n\n    // aggregate the percentages for SR to announce progress\n    if (!this.srProgress && this.numFilesInProgress) {\n      const total = this.numFilesInProgress; // if we don't reassign this number changes when a file is done and the percentage becomes wrong\n      this.srProgress = setInterval(() => {\n        const aggregate = this.fileList.reduce((avg, item) => (item.progress ? avg + item.progress : avg), 0);\n        this.announce(uploaderMessages.getUploadProgress(Math.floor(aggregate / total)));\n      }, 5000);\n    }\n  }\n\n  @Listen(\"wmFileClearErrorClicked\")\n  handleFileErrorCleared(ev: CustomEvent) {\n    const filename = ev.detail.name;\n    this.errorList = this.errorList.filter((error) => error.name != filename);\n    this.uploadButtonEl.focus();\n  }\n\n  @Listen(\"wmIntFileDeleted\")\n  handleFileDeleted(ev: CustomEvent) {\n    this.clearErrors();\n    forceUpdate(this.el); // for the button to stop being disabled if num files become < max-files\n    this.wmUploaderDeleteFile.emit(ev.detail);\n    this.wmFileDelete.emit(ev.detail);\n    this.wmDeleteFile.emit(ev.detail); // deprecated\n  }\n\n  @Listen(\"wmIntFilePreviewed\")\n  handleFilePreviewed(ev: CustomEvent) {\n    this.clearErrors();\n    this.wmUploaderPreviewFile.emit(ev.detail);\n    this.wmFilePreview.emit(ev.detail);\n  }\n\n  @Listen(\"wmIntFileDownloaded\")\n  handleFileDownloaded(ev: CustomEvent) {\n    this.clearErrors();\n    this.wmUploaderDownloadFile.emit(ev.detail);\n    this.wmFileDownload.emit(ev.detail);\n    this.wmDownloadFile.emit(ev.detail); // deprecated\n  }\n\n  @Watch(\"files\")\n  parseFiles() {\n    if (!!this.files) {\n      if (typeof this.files === \"string\") {\n        let list = JSON.parse(this.files);\n        if (typeof list === \"object\") {\n          // if size is in byte format, convert to display format\n          list.forEach((item: any) => {\n            if (item.size && (typeof item.size === \"number\" || item.size.match(/^[0-9]+$/))) {\n              const convertedSize = this.convertBytes(item.size);\n              item.size = `${convertedSize.size.toFixed(0)} ${convertedSize.unit}`;\n            }\n          });\n          this.fileList = list;\n        } else {\n          throw new Error(\"could not parse string passed to files attribute\");\n        }\n      } else {\n        throw new Error(\"Attribute 'files' should be a string\");\n      }\n    }\n  }\n\n  @Watch(\"fileList\")\n  focusAfterRemoval(newFiles: UploadedFile[], oldFiles: UploadedFile[]) {\n    if (this.isTabbing && newFiles.length < oldFiles.length) {\n      const newFileIds = newFiles.map((file: UploadedFile) => file.id);\n      const oldFileIds = oldFiles.map((file: UploadedFile) => file.id);\n      // even in the case that multiple files have been removed at once, work off of the first in that group\n      const removedFileId = oldFileIds.filter((id: string) => !newFileIds.includes(id))[0];\n\n      if (oldFileIds.indexOf(removedFileId) > 0) {\n        const fileIdPrecedingRemoved = oldFileIds[oldFileIds.indexOf(removedFileId) - 1];\n        const fileElPrecedingRemoved = this.el.shadowRoot!.querySelector(\"#file-\" + fileIdPrecedingRemoved);\n        const focusedElementsButtons = fileElPrecedingRemoved?.shadowRoot!.querySelectorAll(\"wm-button\");\n\n        if (focusedElementsButtons && focusedElementsButtons.length > 0) {\n          const lastButtonInFile = focusedElementsButtons[focusedElementsButtons.length - 1];\n          lastButtonInFile.focus();\n        } else {\n          // if preceding file has no file action buttons, rerun function with adjusted params\n          // by removing the fileElPrecedingRemoved from the newFiles list, it is now considered the removedFile and looks to focus it's preceding file\n          // if it continues to cannot find an appropriate preceding file and becomes the first file in the list, it focuses the upload button\n          this.focusAfterRemoval(\n            newFiles.filter((file: UploadedFile) => file.id !== fileIdPrecedingRemoved),\n            oldFiles\n          );\n        }\n      } else {\n        this.uploadButtonEl.focus();\n      }\n    }\n  }\n\n  @Watch(\"rejectedFiles\")\n  parseRejectedFiles() {\n    if (!!this.rejectedFiles) {\n      if (typeof this.files === \"string\") {\n        const list = JSON.parse(this.rejectedFiles);\n        if (typeof list === \"object\") {\n          this.errorList = list;\n        } else {\n          throw new Error(\"could not parse string passed to errors attribute\");\n        }\n      } else {\n        throw new Error(\"Attribute 'rejected-files' should be a string\");\n      }\n    }\n  }\n\n  @Watch(\"numFilesInProgress\")\n  uploadNotifications(newNum: number, oldNum: number) {\n    if (oldNum > 0 && newNum === 0) {\n      setTimeout(() => {\n        this.notif = \"\";\n        this.internalErrorMessage = \"\";\n      }, 20 * 1000);\n      this.notif = uploaderMessages.finishedUploading;\n      this.announce(uploaderMessages.finishedUploading);\n      this.numFilesInProgress = null;\n      clearInterval(this.srProgress);\n      forceUpdate(this.el);\n    } else if (newNum > 0 && newNum != oldNum) {\n      this.notif = uploaderMessages.getFilesUploading(newNum);\n      this.announce(uploaderMessages.getFilesUploading(newNum));\n      forceUpdate(this.el);\n    }\n  }\n\n  @Watch(\"errorMessage\")\n  handleErrorMessageChange() {\n    if (this.errorMessage) {\n      this.announce(this.errorMessage);\n    }\n  }\n\n  isValidSize(size: number) {\n    return this.convertBytes(size, \"MB\").size <= this.effectiveMaxSize;\n  }\n\n  convertBytes(bytes: number, unit?: \"KB\" | \"MB\" | \"GB\" | \"TB\") {\n    // https://stackoverflow.com/questions/2365100/converting-bytes-to-megabytes\n    const unitOrder = [\"bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n    let unitIndex = 0;\n    let result = typeof bytes === \"number\" ? bytes : parseInt(bytes);\n\n    if (unit) {\n      // convert until result matches desired unit\n      while (unitOrder.indexOf(unit) > unitIndex) {\n        result /= 1024;\n        unitIndex++;\n      }\n    } else {\n      // convert until result is appropriate unit (value is under 1000)\n      while (result > 1000) {\n        result /= 1024;\n        unitIndex++;\n      }\n    }\n    return { size: result, unit: unitOrder[unitIndex] };\n  }\n\n  isDuplicate(name: string) {\n    const hasDuplicateUploadingFile = this.filesToUpload.some((fileToUpload: File) => fileToUpload.name === name);\n    const hasDuplicateUploadedFile = this.fileList.some((f) => {\n      const filename: string = f.type ? f.name + \".\" + f.type : f.name;\n      return filename === name;\n    });\n\n    return hasDuplicateUploadingFile || hasDuplicateUploadedFile;\n  }\n\n  isEmpty() {\n    return !this.fileList.length && !this.errorList.length;\n  }\n\n  get isDisabled() {\n    // disable if is the uploader is maxed out or if something is uploading\n    return this.fileLimitReached || this.numFilesInProgress! > 0;\n  }\n\n  isItemUploading(item: UploadedFile) {\n    return item.hasOwnProperty(\"progress\") && item.progress! < 100;\n  }\n\n  announce(message: string) {\n    if (this.liveRegion.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.announcement = message;\n  }\n\n  clearErrors() {\n    this.errorList = [];\n    this.notif = \"\";\n    this.internalErrorMessage = \"\";\n  }\n\n  handleFiles(ev: Event) {\n    this.filesToUpload = [];\n    const files = Array.from((ev.target! as HTMLInputElement).files!);\n    const validTypes = this.fileTypes.split(\" \").join(\", \");\n\n    if (!!this.maxFiles && this.fileList.length + files.length > this.maxFiles) {\n      this.internalErrorMessage = uploaderMessages.fileLimitExceeded;\n      this.announce(uploaderMessages.fileLimitExceeded);\n    } else {\n      files &&\n        files.map((file) => {\n          if (!hasValidType(file, this.fileTypes)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.getInvalidFileType(validTypes),\n            };\n            this.errorList.push(error);\n          } else if (file.size === 0) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.zeroFileSize,\n            };\n            this.errorList.push(error);\n          } else if (!this.isValidSize(file.size)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.getFileTooLarge(this.effectiveMaxSize),\n            };\n            this.errorList.push(error);\n          } else if (this.isDuplicate(file.name)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.duplicateName,\n            };\n            this.errorList.push(error);\n          } else {\n            this.filesToUpload.push(file);\n          }\n        });\n\n      if (this.filesToUpload.length > 0) {\n        this.numFilesInProgress = this.filesToUpload.length;\n        this.wmUploaderFilesSelected.emit(this.filesToUpload);\n        this.wmFilesSelected.emit(this.filesToUpload); // deprecated\n      }\n    }\n    (ev.target! as HTMLInputElement).value = \"\"; // reset to ensure that onChange is triggered when the same file is selected a second time\n  }\n\n  componentWillLoad() {\n    if (!this.buttonText) {\n      throw new Error(\"wm-uploader: button-text is a required prop\");\n    }\n\n    if (this.type) {\n      console.warn(\"wm-uploader: type has been deprecated as of v3.1.0. Please use uploader-type instead.\");\n    }\n\n    if (this.tempUploaderType === \"1\" && !this.emptyStateText) {\n      throw new Error(\"wm-uploader: empty-state-text is a required prop\");\n    }\n\n    this.parseFiles();\n    this.clearErrors();\n    this.parseRejectedFiles();\n  }\n\n  componentDidLoad() {\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n  }\n\n  uploadButtonOnClick(ev: Event) {\n    if (this.isDisabled) {\n      // this is a temporary fix.\n      // we need the disabled button to be programmatically focusable\n      // to allow return focus after closing the browser file panel\n      // since it's focusable the button should respond when activated\n      // it looks disabled, and announces the reason why the action cannot\n      // be taken when activated.\n      ev.preventDefault();\n\n      if (this.numFilesInProgress! > 0) {\n        const srMsg = uploaderMessages.waitToUpload;\n        this.announce(srMsg);\n      } else if (this.fileLimitReached) {\n        this.internalErrorMessage = uploaderMessages.fileLimitReached;\n        this.announce(uploaderMessages.fileLimitReached);\n      }\n    } else {\n      this.clearErrors();\n    }\n  }\n\n  renderUploadSvg() {\n    return (\n      <svg class=\"upload-file\" width=\"91\" height=\"84\" viewBox=\"0 0 91 84\">\n        <path\n          transform=\"rotate(-180.000000) translate(-452, -255.5)\"\n          fill=\"#eae8ec\"\n          d=\"M361,249.681818 L361,197.318182 C361,194.118182 365.555061,191.5 371.122358,191.5 L391.316463,191.5 L391.286495,200.562515 L369.871211,200.600292 L369.885404,200.622146 L369.886423,246.655947 L443.657038,246.840767 L443.657038,200.622146 L421.683537,200.622146 L421.683537,191.5 L441.978865,191.5 C447.546162,191.5 452,194.118182 452,197.318182 L452,249.681818 C452,252.881818 447.546162,255.5 441.978865,255.5 L371.122358,255.5 C365.504449,255.5 361,252.881818 361,249.681818 Z M391.5,207 L406,221 L420.5,207 L409.625,207 L409.625,172 L402.375,172 L402.375,207 L391.5,207 Z\"\n        ></path>\n      </svg>\n    );\n  }\n\n  renderIcon() {\n    // mdi attachment icon (paper clip) is horizontal but we want it vertical\n    const rotate = this.icon && this.icon === \"f066\";\n    return (\n      this.icon && (\n        <span class={`mdi ${rotate ? \"rotate\" : \"\"}`}>{String.fromCodePoint(parseInt(`0x${this.icon}`))}</span>\n      )\n    );\n  }\n\n  renderInfo() {\n    return this.info && this.tempUploaderType === \"2\" ? <span class=\"info\">{this.info}</span> : \"\";\n  }\n\n  renderNotif() {\n    return <div class=\"notif\">{this.notif}</div>;\n  }\n\n  renderError() {\n    return <div id=\"error\">{this.displayedErrorMessage}</div>;\n  }\n\n  renderUploadButton(classes: string) {\n    let accessibleLabel = `${this.label && this.label !== this.buttonText ? `${this.label}, ` : \"\"}${this.buttonText}`;\n\n    return (\n      <div class=\"info-wrapper\">\n        <input\n          name={this.inputId}\n          id={this.inputId}\n          class=\"sr-only\"\n          aria-label={accessibleLabel}\n          aria-required={this.requiredField ? \"true\" : null}\n          aria-describedby={`${this.displayedErrorMessage ? \"error \" : \"\"}file-count max-size accepted-types`}\n          type=\"file\"\n          multiple\n          onClick={(ev) => this.uploadButtonOnClick(ev)}\n          onChange={(ev) => this.handleFiles(ev)}\n        />\n        <label htmlFor={this.inputId} class={`wm-button ${classes}${this.isTabbing ? \" user-is-tabbing\" : \"\"}`}>\n          {this.renderIcon()}\n          {this.buttonText}\n        </label>\n        {this.renderInfo()}\n      </div>\n    );\n  }\n\n  renderEmptyState() {\n    return (\n      <div class=\"empty-block\">\n        {this.renderUploadSvg()}\n        <div class={`empty-message`}>{this.emptyStateText}</div>\n        {this.renderUploadButton(\"-primary empty-button\")}\n        {this.notif && this.renderNotif()}\n        {this.displayedErrorMessage && this.renderError()}\n      </div>\n    );\n  }\n\n  renderErrorList() {\n    let srMessage = this.errorList.reduce(function (acc, err) {\n      return acc + `${err.name}: ${err.message} `;\n    }, \"\");\n    this.announce(srMessage);\n\n    return (\n      <ul class=\"error-list\">\n        {this.errorList.map((err) => (\n          <wm-file file={`{\"name\": \"${err.name}\"}`} error-message={err.message}></wm-file>\n        ))}\n      </ul>\n    );\n  }\n\n  formatTimestamp(timestamp: string): string {\n    const uploadDate = new Date(Date.parse(timestamp));\n    const day = uploadDate.getDate();\n    const month = uploadDate.getMonth() + 1;\n    const year = uploadDate.getFullYear();\n    const time = uploadDate.toLocaleTimeString(\"en-us\", { hour: \"numeric\", minute: \"2-digit\" });\n    const formattedDate = `${month}/${day}/${year} ${time}`;\n\n    return formattedDate;\n  }\n\n  renderInProgressFileList() {\n    return (\n      <ul class=\"inprogress-list\">\n        {this.fileList\n          .filter((item) => this.isItemUploading(item))\n          .map((item) => (\n            <wm-file file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>\n          ))}\n      </ul>\n    );\n  }\n\n  renderUploadedFileList() {\n    return (\n      <ul class=\"file-list\">\n        {this.fileList\n          .filter((item) => !this.isItemUploading(item))\n          .map((item) => {\n            item.lastUpdated = this.formatTimestamp(item.lastUpdated);\n            return <wm-file id={`file-${item.id}`} file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>;\n          })}\n      </ul>\n    );\n  }\n\n  renderFiles() {\n    // if we switch to accepting display format for the wm-uploader's file lastUpdateds, sorting by date will become impossible\n    this.sortBy === \"name\"\n      ? this.fileList.sort((a, b) => a.name.localeCompare(b.name))\n      : this.fileList.sort((a, b) => Date.parse(a.lastUpdated) - Date.parse(b.lastUpdated));\n    return (\n      <div>\n        {this.renderInProgressFileList()}\n        {this.renderUploadedFileList()}\n      </div>\n    );\n  }\n\n  legacyRenderHeader() {\n    return (\n      <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n        <div class=\"slot-wrapper\">\n          <slot />\n          <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n            {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n            {this.notif && this.renderNotif()}\n            {this.displayedErrorMessage && this.renderError()}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  renderHeader() {\n    const validTypes = \".\" + this.fileTypes.split(\" \").join(\", .\");\n\n    return (\n      <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n        <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n          {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n          {this.renderRequirements()}\n        </div>\n        <div id=\"accepted-types\" class=\"accepted-types\">\n          {uploaderMessages.getAcceptedFileTypes(validTypes, this.fileTypes.split(\" \").length)}\n        </div>\n        {this.notif && this.renderNotif()}\n        {this.displayedErrorMessage && this.renderError()}\n      </div>\n    );\n  }\n\n  renderRequirements() {\n    return (\n      <div class=\"requirements\">\n        {this.maxFiles && (\n          <span id=\"file-count\">{uploaderMessages.getFileCount(this.fileList.length, this.maxFiles)}</span>\n        )}\n        {this.maxSize && <span id=\"max-size\">{uploaderMessages.getMaxSize(this.effectiveMaxSize)}</span>}\n      </div>\n    );\n  }\n\n  renderFooter() {\n    return (\n      <div class=\"footer\">\n        <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n          <div class=\"filecount-wrapper\">\n            <div class=\"filecount\">{uploaderMessages.getFilesAdded(this.fileList.length)}</div>\n            {this.renderUploadButton(`-primary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n          </div>\n          {this.notif && this.renderNotif()}\n          {this.displayedErrorMessage && this.renderError()}\n        </div>\n      </div>\n    );\n  }\n\n  renderWithItems() {\n    // it's possible progress is passed in as a string, so we need to check for \"100\" as well\n    const hasNewlyUploadedFiles =\n      this.fileList.filter((file) => file.progress === (typeof file.progress === \"number\" ? 100 : \"100\")).length > 0;\n    return (\n      <div>\n        {!this.tempUploaderType && this.renderHeader()}\n        {this.tempUploaderType === \"2\" && this.legacyRenderHeader()}\n        <div\n          class={`list-container type${this.tempUploaderType} ${\n            !this.tempUploaderType && hasNewlyUploadedFiles ? \"checkmark-spacer\" : \"\"\n          }`}\n        >\n          {this.errorList.length > 0 && this.renderErrorList()}\n          {this.fileList.length > 0 && this.renderFiles()}\n        </div>\n        {this.tempUploaderType === \"1\" && this.renderFooter()}\n      </div>\n    );\n  }\n\n  renderLabel() {\n    return (\n      <div class={`wrapper ${this.displayedErrorMessage ? \"invalid\" : \"\"}`}>\n        <div id=\"label\" class={`label`}>\n          {this.label}\n          {this.requiredField && (\n            <span class=\"required\" aria-hidden=\"true\">\n              *\n            </span>\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.label && this.renderLabel()}\n        {this.isEmpty() && this.tempUploaderType === \"1\" ? this.renderEmptyState() : this.renderWithItems()}\n        <div\n          ref={(el) => (this.liveRegion = el as HTMLDivElement)}\n          class=\"live-region sr-only\"\n          aria-live=\"assertive\" // since it's directly linked to the action the user took, it should be read in priority. With polite, some messages get dismissed in favor of the page title\n          aria-atomic=\"true\"\n        >\n          {this.announcement}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/esm-es5/wm-wrapper.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Wrapper","prototype","componentDidLoad","this","wmWrapperLoaded","emit","render"],"sources":["src/components/wm-wrapper/wm-wrapper.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-wrapper\",\n  shadow: false,\n})\nexport class Wrapper {\n  @Element() el!: any;\n  @Event() wmWrapperLoaded!: EventEmitter<void>;\n\n  componentDidLoad() {\n    this.wmWrapperLoaded.emit();\n  }\n\n  render() {\n    return;\n  }\n}\n"],"mappings":"4FAMaA,QAAO,W,kGAIlBA,EAAAC,UAAAC,iBAAA,WACEC,KAAKC,gBAAgBC,M,EAGvBL,EAAAC,UAAAK,OAAA,WACE,M,gIATgB,U"}

package/dist/ripple/index.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":[],"mappings":""}

package/dist/ripple/p-002d067e.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,H as r,g as a}from"./p-1c23de4a.js";import{i as s,e as l,h as o,g as p}from"./p-c6a0f7e5.js";const n=':host,wm-datepicker{font-family:inherit}:host *,wm-datepicker *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper,wm-datepicker .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-datepicker .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-datepicker .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-datepicker .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-datepicker .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-datepicker .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-datepicker .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-datepicker .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-datepicker .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-datepicker .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-datepicker .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper,wm-datepicker .wrapper{position:relative}:host .wrapper .required,wm-datepicker .wrapper .required{color:#c4431c}:host .wrapper .inner-wrapper,wm-datepicker .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid;border-color:rgba(35, 35, 35, 0.6);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper .date-input,wm-datepicker .wrapper .inner-wrapper .date-input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0}:host .wrapper .inner-wrapper .date-input:disabled,wm-datepicker .wrapper .inner-wrapper .date-input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper .inner-wrapper .date-input:focus,wm-datepicker .wrapper .inner-wrapper .date-input:focus{outline:none}:host .wrapper.invalid .inner-wrapper,wm-datepicker .wrapper.invalid .inner-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,wm-datepicker .wrapper.invalid .error{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem;margin-bottom:4px;top:100%;left:0}:host .wrapper.focus .inner-wrapper,wm-datepicker .wrapper.focus .inner-wrapper{-webkit-box-shadow:0 0 0 1px #19a1a9;-moz-box-shadow:0 0 0 1px #19a1a9;box-shadow:0 0 0 1px #19a1a9;outline:none;border-color:#19a1a9}:host .user-is-tabbing .toggle:focus:not(:active),wm-datepicker .user-is-tabbing .toggle:focus:not(:active){border:none;z-index:11}';const d=class{constructor(i){e(this,i);this.wmDatepickerNewValidValue=t(this,"wmDatepickerNewValidValue",7);this.lastCommittedValue=this.value;this.parsableEntry=/^(\d{1}|\d{2}|\d{4})[\-\.\/]\d{1,2}[\-\.\/](\d{1}|\d{2}|\d{4})$/;this.isoEntry=/^\d\d\d\d[-]\d\d[-]\d\d$/;this.eightDigitsEntry=/^\d{8}$/;this.dateFormats={US:s.formatMessage({id:"date.formatUS",defaultMessage:"mm/dd/yyyy"}),INT:s.formatMessage({id:"date.formatINT",defaultMessage:"dd/mm/yyyy"}),ISO:s.formatMessage({id:"date.formatISO",defaultMessage:"yyyy/mm/dd"})};this.value="";this.disabled=false;this.dateFormat="US";this.errorMessage="";this.labelPosition="top";this.label="";this.requiredField=false;this.requiredFieldMessage=undefined;this.preventValidation=undefined;this.displayError=""}handleTabbingOn(){this.dpWrapper&&this.dpWrapper.classList.add("user-is-tabbing")}handleTabbingOff(){this.dpWrapper&&this.dpWrapper.classList.remove("user-is-tabbing")}handleError(){if(this.errorMessage){this.generateError()}else{this.clearError();this.processInput()}}handleInput(e){this.value=e.target.value}handleBlur(e){const t=this.preventValidation&&l(e,this.preventValidation);if(!t){this.processInput()}this.dpWrapper.classList.remove("focus")}focusHandler(){this.dpWrapper.classList.add("focus")}handlePopupBlurred(e){if(e.detail.relatedTarget!==this.el){const t=new CustomEvent("blur");t.relatedTarget=e.detail.relatedTarget;this.el.dispatchEvent(t)}}getActiveElement(){return o(document.activeElement)}handleCellTriggered(e){let t=e.detail;let i=t.getAttribute("data-year")+"-"+t.getAttribute("data-month")+"-"+t.textContent;this.inputEl.value=this.reformatDate(this.dateFormat,i);this.processInput();const r=new CustomEvent("input");this.el.dispatchEvent(r)}processInput(e){const t=!e&&this.requiredField;let i=this.inputEl.value;if(this.eightDigitsEntry.test(this.inputEl.value)){this.inputEl.value=this.addSlashes(this.inputEl.value)}if(this.parsableEntry.test(this.inputEl.value)){i=this.reformatDate("ISO",this.inputEl.value);this.inputEl.value=this.reformatDate(this.dateFormat,i);if(this.isValidDate(i)){if(this.errorMessage){this.generateError()}else{this.clearError()}}else if(this.inputEl.value.length){this.generateError()}}else if(this.inputEl.value.length||t||this.errorMessage){this.generateError()}else if(!this.inputEl.value.length&&!t){this.clearError()}this.value=i;if(i!==this.lastCommittedValue){const e=new CustomEvent("change");this.el.dispatchEvent(e);this.lastCommittedValue=this.value}if(this.isValidDate(i)&&i!==this.lastValidValue){this.wmDatepickerNewValidValue.emit();this.lastValidValue=i}}reformatDate(e,t){if(!t){return""}else if(!this.parsableEntry.test(t)){return t}else{let i=t.replace(/[\-\.]/gi,"/").split("/");switch(e){case"US":case this.dateFormats["US"]:return i[1].padStart(2,"0")+"/"+i[2].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"INT":case this.dateFormats["INT"]:return i[2].padStart(2,"0")+"/"+i[1].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"ISO":case this.dateFormats["ISO"]:if(this.dateFormat==="US"||this.dateFormat===this.dateFormats["US"]){return i[2].padStart(4,"20")+"-"+i[0].padStart(2,"0")+"-"+i[1].padStart(2,"0")}else if(this.dateFormat==="INT"||this.dateFormat===this.dateFormats["INT"]){return i[2].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[0].padStart(2,"0")}else if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return i[0].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[2].padStart(2,"0")}default:return i.join("/")}}}isValidDate(e){if(!e||!this.isoEntry.test(e)){return false}else{let t=e.split("-");let i=parseInt(t[2],10);let r=parseInt(t[1],10);let a=parseInt(t[0],10);if(a<1e3||a>3e3||r==0||r>12)return false;let s=[31,28,31,30,31,30,31,31,30,31,30,31];if(a%400==0||a%100!=0&&a%4==0)s[1]=29;return i>0&&i<=s[r-1]}}generateError(){const e=this.requiredFieldMessage||s.formatMessage({id:"date.requiredDateError",defaultMessage:"A date is required."});const t=s.formatMessage({id:"date.invalidDate",defaultMessage:"Please enter a valid date in the format {dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}."},{dateFormat:this.dateFormat.toLowerCase()});if(this.errorMessage){this.displayError=this.errorMessage}else if(this.inputEl.value.length){this.displayError=t}else if(!this.inputEl.value.length&&this.requiredField){this.displayError=e}}clearError(){this.displayError=""}addSlashes(e){if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return e.substring(0,4)+"/"+e.substring(4,6)+"/"+e.substring(6)}else{return e.substring(0,2)+"/"+e.substring(2,4)+"/"+e.substring(4)}}componentWillLoad(){if(this.label===""){console.error("You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.")}if(this.errorMessage){this.generateError()}this.uid=this.el.id?this.el.id:p();if(this.value&&this.isValidDate(this.value)){this.lastValidValue=this.value}}componentDidLoad(){this.inputEl.value=this.reformatDate(this.dateFormat,this.value);this.processInput(true)}render(){const e=s.formatMessage({id:"date.format",defaultMessage:"{dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}"},{dateFormat:this.dateFormat.toLowerCase()});return i(r,{id:this.uid,"aria-busy":"false",class:`${this.displayError?"invalid":""}`,invalid:this.displayError?"true":null},i("div",{ref:e=>this.dpWrapper=e,class:`wrapper label-${this.labelPosition} ${this.displayError?"invalid":""}`},i("div",{class:"label-wrapper"},this.labelPosition!=="none"&&i("label",{id:`datepickerLabel-${this.uid}`,htmlFor:`date-input-${this.uid}`,class:"label",title:`${this.label} (${e})`},this.label,this.requiredField&&i("span",{"aria-hidden":"true",class:"required"},"*"))),i("div",null,i("div",{class:"inner-wrapper"},i("input",{disabled:this.disabled,type:"text",id:`date-input-${this.uid}`,class:"date-input",name:"date",placeholder:e,onFocus:this.focusHandler.bind(this),onInput:e=>this.handleInput(e),onBlur:e=>this.handleBlur(e),ref:e=>this.inputEl=e,"aria-describedby":`error-${this.uid}`,"aria-controls":`popup-${this.uid}`,"aria-label":this.label,"aria-required":this.requiredField?"true":null}),i("priv-datepicker",{disabled:this.disabled,date:this.lastValidValue?new Date(this.lastValidValue):new Date,parentId:this.uid})),i("div",{id:`error-${this.uid}`,class:"error","aria-live":"assertive","aria-atomic":"true"},this.displayError))))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{errorMessage:["handleError"]}}};d.style=n;export{d as wm_datepicker};
-//# sourceMappingURL=p-002d067e.entry.js.map

package/dist/ripple/p-002d067e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmDatepickerCss","DatePicker","this","lastCommittedValue","value","parsableEntry","isoEntry","eightDigitsEntry","dateFormats","US","intl","formatMessage","id","defaultMessage","INT","ISO","handleTabbingOn","dpWrapper","classList","add","handleTabbingOff","remove","handleError","errorMessage","generateError","clearError","processInput","handleInput","ev","target","handleBlur","shouldPreventValidation","preventValidation","isRelatedTarget","focusHandler","handlePopupBlurred","detail","relatedTarget","el","event","CustomEvent","dispatchEvent","getActiveElement","checkForFocusableElInShadow","document","activeElement","handleCellTriggered","dateElement","isoDate","getAttribute","textContent","inputEl","reformatDate","dateFormat","isFirstLoad","leftEmpty","requiredField","test","addSlashes","isValidDate","length","lastValidValue","wmDatepickerNewValidValue","emit","toFormat","date","dateArr","replace","split","padStart","join","input","parts","day","parseInt","month","year","monthLength","requiredDateErr","requiredFieldMessage","validDateErr","toLowerCase","displayError","substring","componentWillLoad","label","console","error","uid","generateId","componentDidLoad","render","h","Host","class","invalid","ref","d","labelPosition","htmlFor","title","disabled","type","name","placeholder","onFocus","bind","onInput","onBlur","Date","parentId"],"sources":["./src/components/wm-datepicker/wm-datepicker.scss?tag=wm-datepicker&encapsulation=shadow","./src/components/wm-datepicker/wm-datepicker.tsx"],"sourcesContent":[":host,\nwm-datepicker {\n  font-family: inherit;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  @include label;\n\n  .wrapper {\n    position: relative;\n\n    .required {\n      color: $datepicker-required-input;\n    }\n\n    .inner-wrapper {\n      @include displayFlex();\n      align-items: center;\n      height: rem-calc(40);\n      border: 1px solid;\n      border-color: $datepicker-input-border-color;\n      @include border-radius(3px);\n      max-width: 236px; /* input is 200px or smaller, button is 36px */\n      justify-content: space-between;\n      position: relative;\n\n      .date-input {\n        -moz-border-top-left-radius: 3px;\n        -webkit-border-top-left-radius: 3px;\n        border-top-left-radius: 3px;\n        -moz-border-bottom-left-radius: 3px;\n        -webkit-border-bottom-left-radius: 3px;\n        border-bottom-left-radius: 3px;\n        border: none;\n        font-size: rem-calc(14);\n        padding: rem-calc(10 15 8);\n        min-width: 0;\n        height: 100%;\n        flex: 1;\n        margin: 0;\n\n        &:disabled {\n          background-color: $input-disabled-bg;\n          color: $input-disabled-color;\n        }\n\n        &:focus {\n          outline: none;\n        }\n      }\n    }\n\n    &.invalid {\n      .inner-wrapper {\n        @include invalidBorder;\n      }\n\n      .error {\n        @include errorMessage;\n        margin-bottom: 4px;\n        top: 100%;\n        left: 0;\n      }\n    }\n\n    &.focus {\n      .inner-wrapper {\n        @include field-focus;\n      }\n    }\n  }\n\n  .user-is-tabbing {\n    .toggle:focus {\n      &:not(:active) {\n        border: none;\n        z-index: 11;\n      }\n    }\n  }\n}\n","import { h, Component, Host, Element, Event, EventEmitter, Prop, Listen, Watch, State } from \"@stencil/core\";\nimport { generateId, checkForFocusableElInShadow, intl, isRelatedTarget } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-datepicker\",\n  styleUrl: \"wm-datepicker.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class DatePicker {\n  @Element() el!: HTMLWmDatepickerElement;\n  private dpWrapper!: HTMLDivElement;\n  private inputEl!: HTMLInputElement;\n\n  @Prop({ mutable: true }) value?: string = \"\";\n  @Prop() disabled: boolean = false;\n  @Prop({ mutable: true }) dateFormat: string = \"US\";\n  @Prop({ reflect: true }) errorMessage: string = \"\";\n  @Prop({ mutable: true }) labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\n  @Prop({ mutable: true }) label: string = \"\";\n  @Prop() requiredField: boolean = false;\n  @Prop() requiredFieldMessage?: string;\n  @Prop() preventValidation?: string; // id or series of ids, validation will not occur when clicking an element with this id\n  @State() displayError: string = \"\";\n  @Event() wmDatepickerNewValidValue!: EventEmitter;\n\n  // we only want to fire the \"change\" event if the value has actually changed (that's\n  // how native elements do it), so we need to keep in state the last committed value.\n  private lastCommittedValue?: string = this.value;\n  private lastValidValue?: string;\n  private uid!: string;\n\n  // 1, 2, or 4 digits, separator, 1 or 2 digits, separator, then 1 or 2 or 4 digits\n  private parsableEntry = /^(\\d{1}|\\d{2}|\\d{4})[\\-\\.\\/]\\d{1,2}[\\-\\.\\/](\\d{1}|\\d{2}|\\d{4})$/;\n  private isoEntry = /^\\d\\d\\d\\d[-]\\d\\d[-]\\d\\d$/;\n  private eightDigitsEntry = /^\\d{8}$/;\n\n  dateFormats: any = {\n    US: intl.formatMessage({\n      id: \"date.formatUS\",\n      defaultMessage: \"mm/dd/yyyy\",\n    }),\n    INT: intl.formatMessage({\n      id: \"date.formatINT\",\n      defaultMessage: \"dd/mm/yyyy\",\n    }),\n    ISO: intl.formatMessage({\n      id: \"date.formatISO\",\n      defaultMessage: \"yyyy/mm/dd\",\n    }),\n  };\n\n  @Listen(\"keydown\")\n  handleTabbingOn() {\n    this.dpWrapper && this.dpWrapper.classList.add(\"user-is-tabbing\");\n  }\n\n  @Listen(\"click\")\n  handleTabbingOff() {\n    this.dpWrapper && this.dpWrapper.classList.remove(\"user-is-tabbing\");\n  }\n\n  @Watch(\"errorMessage\")\n  handleError() {\n    if (this.errorMessage) {\n      this.generateError();\n    } else {\n      this.clearError();\n      this.processInput();\n    }\n  }\n\n  handleInput(ev: Event) {\n    // keep component's value in sync with input's value\n    // validation only happens on blur and initial load,\n    // but component's value should reflect user input at any time\n    this.value = (ev.target! as HTMLInputElement).value; // same as this.inputEl.value\n  }\n\n  // this is input blur, not component blur\n  handleBlur(ev: FocusEvent) {\n    // do not validate if clicking to an element that should prevent validation (e.g. close button on modal)\n    const shouldPreventValidation = this.preventValidation && isRelatedTarget(ev, this.preventValidation);\n    if (!shouldPreventValidation) {\n      this.processInput();\n    }\n    this.dpWrapper.classList.remove(\"focus\");\n  }\n\n  // this is input focus, not component focus\n  focusHandler() {\n    this.dpWrapper.classList.add(\"focus\");\n  }\n\n  @Listen(\"popupBlurred\")\n  handlePopupBlurred(ev: CustomEvent) {\n    // emit blur event when leaving component from priv-datepicker\n    if (ev.detail.relatedTarget !== this.el) {\n      const event = new CustomEvent(\"blur\");\n      // @ts-ignore\n      event.relatedTarget = ev.detail.relatedTarget;\n      this.el.dispatchEvent(event);\n    }\n  }\n\n  getActiveElement() {\n    return checkForFocusableElInShadow(document.activeElement as HTMLElement);\n  }\n\n  @Listen(\"cellTriggered\")\n  handleCellTriggered(ev: CustomEvent) {\n    let dateElement = ev.detail as HTMLTableCellElement;\n    let isoDate =\n      dateElement.getAttribute(\"data-year\")! +\n      \"-\" +\n      dateElement.getAttribute(\"data-month\")! +\n      \"-\" +\n      dateElement.textContent!;\n    this.inputEl.value = this.reformatDate(this.dateFormat, isoDate);\n    this.processInput();\n\n    // Create event to trigger onInput function on host element, to get the updated value\n    // Because there are more ways to input than just typing, we are firing this event upon cellTriggered\n    const event = new CustomEvent(\"input\");\n    this.el.dispatchEvent(event);\n  }\n\n  processInput(isFirstLoad?: boolean) {\n    // The required field error should not display on first load\n    const leftEmpty = !isFirstLoad && this.requiredField;\n\n    let isoDate = this.inputEl.value;\n\n    //If input is 8 digits, add slashes as a courtesy and process anyway\n    if (this.eightDigitsEntry.test(this.inputEl.value)) {\n      this.inputEl.value = this.addSlashes(this.inputEl.value);\n    }\n\n    // if we don't have 2 separators we can't reformat so we'll return what was passed in\n    if (this.parsableEntry.test(this.inputEl.value)) {\n      //ISO format for submission\n      isoDate = this.reformatDate(\"ISO\", this.inputEl.value);\n\n      //User-specific format for display\n      this.inputEl.value = this.reformatDate(this.dateFormat, isoDate);\n\n      if (this.isValidDate(isoDate)) {\n        //If there's no errorMessage on state, all errors can be cleared. If there IS an error message, it will clear any internal validation errors by overriding them.\n        if (this.errorMessage) {\n          this.generateError();\n        } else {\n          this.clearError();\n        }\n        //Prevents error from appearing if input field is empty\n      } else if (this.inputEl.value.length) {\n        this.generateError();\n      }\n    } else if (this.inputEl.value.length || leftEmpty || this.errorMessage) {\n      this.generateError();\n    } else if (!this.inputEl.value.length && !leftEmpty) {\n      this.clearError();\n    }\n\n    // value is set to the reformated date or whatever the user passed\n    this.value = isoDate;\n\n    if (isoDate !== this.lastCommittedValue) {\n      const event = new CustomEvent(\"change\");\n      this.el.dispatchEvent(event);\n      this.lastCommittedValue = this.value;\n    }\n\n    // event must fire after we set this.value\n    // only fire if new valid value is different from the previous one\n    if (this.isValidDate(isoDate) && isoDate !== this.lastValidValue) {\n      this.wmDatepickerNewValidValue.emit();\n      //Update prop passed into calendar to valid date\n      this.lastValidValue = isoDate;\n    }\n  }\n\n  // this function reformats date strings to/from the storage format ONLY. US -> INT and vice versa is not supported.\n  reformatDate(toFormat: string, date?: string): string {\n    if (!date) {\n      return \"\";\n    } else if (!this.parsableEntry.test(date)) {\n      return date;\n    } else {\n      let dateArr = date.replace(/[\\-\\.]/gi, \"/\").split(\"/\");\n      switch (toFormat) {\n        case \"US\":\n        case this.dateFormats[\"US\"]:\n          return dateArr[1].padStart(2, \"0\") + \"/\" + dateArr[2].padStart(2, \"0\") + \"/\" + dateArr[0].padStart(4, \"20\");\n        case \"INT\":\n        case this.dateFormats[\"INT\"]:\n          return dateArr[2].padStart(2, \"0\") + \"/\" + dateArr[1].padStart(2, \"0\") + \"/\" + dateArr[0].padStart(4, \"20\");\n        case \"ISO\":\n        case this.dateFormats[\"ISO\"]:\n          if (this.dateFormat === \"US\" || this.dateFormat === this.dateFormats[\"US\"]) {\n            return dateArr[2].padStart(4, \"20\") + \"-\" + dateArr[0].padStart(2, \"0\") + \"-\" + dateArr[1].padStart(2, \"0\");\n          } else if (this.dateFormat === \"INT\" || this.dateFormat === this.dateFormats[\"INT\"]) {\n            return dateArr[2].padStart(4, \"20\") + \"-\" + dateArr[1].padStart(2, \"0\") + \"-\" + dateArr[0].padStart(2, \"0\");\n          } else if (this.dateFormat === \"ISO\" || this.dateFormat === this.dateFormats[\"ISO\"]) {\n            return dateArr[0].padStart(4, \"20\") + \"-\" + dateArr[1].padStart(2, \"0\") + \"-\" + dateArr[2].padStart(2, \"0\");\n          }\n        default:\n          return dateArr.join(\"/\");\n      }\n    }\n  }\n\n  isValidDate(input?: string) {\n    // if it's not ISO it's not valid\n    if (!input || !this.isoEntry.test(input)) {\n      return false;\n    } else {\n      // Parse the ISO date parts to integers\n      let parts = input.split(\"-\");\n      let day = parseInt(parts[2], 10);\n      let month = parseInt(parts[1], 10);\n      let year = parseInt(parts[0], 10);\n      // Check the ranges of month and year\n      if (year < 1000 || year > 3000 || month == 0 || month > 12) return false;\n      let monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];\n      // Adjust for leap years\n      if (year % 400 == 0 || (year % 100 != 0 && year % 4 == 0)) monthLength[1] = 29;\n      // Check the range of the day\n      return day > 0 && day <= monthLength[month - 1];\n    }\n  }\n\n  generateError() {\n    const requiredDateErr: string =\n      this.requiredFieldMessage ||\n      intl.formatMessage({\n        id: \"date.requiredDateError\",\n        defaultMessage: \"A date is required.\",\n      });\n    const validDateErr = intl.formatMessage(\n      {\n        id: \"date.invalidDate\",\n        defaultMessage:\n          \"Please enter a valid date in the format {dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}.\",\n      },\n      { dateFormat: this.dateFormat.toLowerCase() }\n    );\n    if (this.errorMessage) {\n      this.displayError = this.errorMessage;\n    } else if (this.inputEl.value.length) {\n      this.displayError = validDateErr;\n    } else if (!this.inputEl.value.length && this.requiredField) {\n      this.displayError = requiredDateErr;\n    }\n  }\n\n  clearError() {\n    this.displayError = \"\";\n  }\n\n  addSlashes(input: string) {\n    if (this.dateFormat === \"ISO\" || this.dateFormat === this.dateFormats[\"ISO\"]) {\n      return input.substring(0, 4) + \"/\" + input.substring(4, 6) + \"/\" + input.substring(6);\n    } else {\n      return input.substring(0, 2) + \"/\" + input.substring(2, 4) + \"/\" + input.substring(4);\n    }\n  }\n\n  componentWillLoad() {\n    if (this.label === \"\") {\n      console.error(\n        \"You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.\"\n      );\n    }\n    if (this.errorMessage) {\n      this.generateError();\n    }\n\n    this.uid = this.el.id ? this.el.id : generateId();\n\n    if (this.value && this.isValidDate(this.value)) {\n      // update value passed into calendar so that it opens on the specified date\n      this.lastValidValue = this.value;\n    }\n  }\n\n  componentDidLoad() {\n    // convert passed-in starting date from ISO to locale format, update displayed input to proper format\n    this.inputEl.value = this.reformatDate(this.dateFormat, this.value);\n    this.processInput(true);\n  }\n\n  render() {\n    const dateFormat = intl.formatMessage(\n      {\n        id: \"date.format\",\n        defaultMessage: \"{dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}\",\n      },\n      { dateFormat: this.dateFormat.toLowerCase() }\n    );\n    return (\n      <Host\n        id={this.uid}\n        aria-busy=\"false\"\n        class={`${this.displayError ? \"invalid\" : \"\"}`}\n        invalid={this.displayError ? \"true\" : null}\n      >\n        <div\n          ref={(d) => (this.dpWrapper = d as HTMLDivElement)}\n          class={`wrapper label-${this.labelPosition} ${this.displayError ? \"invalid\" : \"\"}`}\n        >\n          <div class=\"label-wrapper\">\n            {this.labelPosition !== \"none\" && (\n              <label\n                id={`datepickerLabel-${this.uid}`}\n                htmlFor={`date-input-${this.uid}`}\n                class=\"label\"\n                title={`${this.label} (${dateFormat})`}\n              >\n                {this.label}\n                {this.requiredField && (\n                  <span aria-hidden=\"true\" class=\"required\">\n                    *\n                  </span>\n                )}\n              </label>\n            )}\n          </div>\n          <div>\n            <div class=\"inner-wrapper\">\n              <input\n                disabled={this.disabled}\n                type=\"text\"\n                id={`date-input-${this.uid}`}\n                class=\"date-input\"\n                name=\"date\"\n                placeholder={dateFormat}\n                onFocus={this.focusHandler.bind(this)}\n                onInput={(ev) => this.handleInput(ev)}\n                onBlur={(ev) => this.handleBlur(ev)}\n                ref={(input) => (this.inputEl = input as HTMLInputElement)}\n                aria-describedby={`error-${this.uid}`}\n                aria-controls={`popup-${this.uid}`}\n                aria-label={this.label}\n                aria-required={this.requiredField ? \"true\" : null}\n              />\n              <priv-datepicker\n                disabled={this.disabled}\n                date={this.lastValidValue ? new Date(this.lastValidValue) : new Date()}\n                parentId={this.uid}\n              />\n            </div>\n            <div id={`error-${this.uid}`} class=\"error\" aria-live=\"assertive\" aria-atomic=\"true\">\n              {this.displayError}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-02a1000a.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as e,H as i,g as o}from"./p-1c23de4a.js";import{i as r}from"./p-c6a0f7e5.js";import{g as n}from"./p-9b2dfb54.js";const a=':host,wm-search{width:100%;font-size:0.875rem}:host *,wm-search *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wm-search-wrapper,wm-search .wm-search-wrapper{border-radius:3px;position:relative;border:1px solid rgba(35, 35, 35, 0.6);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}:host .wm-search-wrapper .search-icon,wm-search .wm-search-wrapper .search-icon{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;font-size:1.0625rem;position:absolute;left:0.4375rem}:host .wm-search-wrapper input,wm-search .wm-search-wrapper input{border:none;height:40px;padding:0 1.75rem;background:transparent;overflow:visible;width:100%;-ms-flex:1;flex:1;font-family:inherit}:host .wm-search-wrapper input:focus,wm-search .wm-search-wrapper input:focus{outline:none}:host .wm-search-wrapper.focus,wm-search .wm-search-wrapper.focus{-webkit-box-shadow:0 0 0 1px #19a1a9;-moz-box-shadow:0 0 0 1px #19a1a9;box-shadow:0 0 0 1px #19a1a9;outline:none;border-color:#19a1a9}:host .find,wm-search .find{min-height:3rem}:host .find input,wm-search .find input{padding:16px 8px 16px 28px}:host .find .wm-find-elements,wm-search .find .wm-find-elements{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;padding-right:16px}:host .find .wm-find-elements wm-button+wm-button,wm-search .find .wm-find-elements wm-button+wm-button{margin-left:0.25rem}:host .find .wm-find-elements .results,wm-search .find .wm-find-elements .results{margin-right:0.5rem;font-style:italic}:host .sr-only,wm-search .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}:host .show-for-tabbers,wm-search .show-for-tabbers{all:unset;color:#575195;text-decoration:none;font-weight:500;font-size:0.875rem;margin:10px 0}:host .show-for-tabbers:hover,wm-search .show-for-tabbers:hover{background:-webkit-gradient(linear, left top, left bottom, from(#575195), to(#575195)) no-repeat;background:linear-gradient(#575195, #575195) no-repeat;background-size:100% 1px;background-position:0 1.2em;padding-bottom:0.2em}:host .show-for-tabbers:focus,wm-search .show-for-tabbers:focus{outline:none;background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1.2em;padding-bottom:0.2em}';const h=class{constructor(e){t(this,e);this.wmSearchBrowseResults=s(this,"wmSearchBrowseResults",7);this.wmBrowseSearchResults=s(this,"wmBrowseSearchResults",7);this.wmSearchValueChanged=s(this,"wmSearchValueChanged",7);this.wrapperEl=null;this.linkEl=null;this.searchType="basic";this.disabled=false;this.placeholder="";this.label="";this.numResults=0;this.value="";this.isTabbing=false;this.highlightedId="";this.highlightedName=null;this.highlightedNum=0;this.previousBlurredValue="";this.parentModal=undefined;this.announcement=""}get resultCount(){let t="";const s=r.formatMessage({id:"search.resultsFound",defaultMessage:"{numResults, plural, =0 {No results} one {1 result} other {# results}} found"},{numResults:this.numResults});const e=r.formatMessage({id:"search.xOfYResults",defaultMessage:"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}"},{numResults:this.numResults,current:this.highlightedNum});if(this.searchType==="basic"){t=s}else if(this.searchType==="find"){t=e}return t}toggleTabbingOn(){this.isTabbing=true;this.linkEl&&this.linkEl.classList.remove("sr-only");this.linkEl&&this.linkEl.classList.add("show-for-tabbers")}toggleTabbingOff(){this.isTabbing=false;this.linkEl&&this.linkEl.classList.add("sr-only");this.linkEl&&this.linkEl.classList.remove("show-for-tabbers")}componentWillLoad(){if(this.placeholder===""){console.error("You must set the placeholder property for the wm-search component.")}if(this.label===""){console.error("You must set the label property for the wm-search component.")}this.hookToModal()}hookToModal(){let t=this.el;while(!!t){if(t.tagName==="WM-MODAL"){this.parentModal=t}t=t.parentElement}if(this.parentModal){const t=["wmCloseTriggered","wmPrimaryTriggered","wmSecondaryTriggered"];t.map((t=>{this.parentModal.addEventListener(t,(()=>{this.updateValue("")}))}))}}async updateValue(t){this.value=t;this.resetHighlightCountToStart();if(this.value){this.announceChanges()}}resetHighlightCountToStart(){if(this.searchType==="find"){this.highlightedNum=this.numResults?1:0}}announce(t){if(this.resultsLiveRegion.textContent===t){t+=" "}this.announcement=t}announceChanges(){window.requestAnimationFrame((()=>{let t=this.resultCount;if(this.searchType==="find"&&this.highlightedName){t+=`, ${this.highlightedName}`}this.announce(t)}))}changeHighlightedNum(t){if(this.numResults){if(t<1){this.highlightedNum=this.numResults}else if(t>this.numResults){this.highlightedNum=1}else{this.highlightedNum=t}this.wmSearchBrowseResults.emit({position:this.highlightedNum});this.wmBrowseSearchResults.emit({position:this.highlightedNum});this.announceChanges()}}addFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.add("focus")}}removeFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.remove("focus")}}handleBlur(){this.removeFocusStyle();if(this.previousBlurredValue!==this.value){this.wmSearchValueChanged.emit({value:this.value})}this.previousBlurredValue=this.value}renderResultsAndBrowseButtons(){return e("div",{class:"wm-find-elements"},e("div",{id:"results-display",class:"results"},this.resultCount),e("div",{class:"wm-button-collection"},e("wm-button",{"button-type":"icononly",icon:"f05d",tooltip:n.previous,"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum-1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":r.formatMessage({id:"search.previousResult",defaultMessage:"Press to hear previous matching result"})}),e("wm-button",{"button-type":"icononly",icon:"f045",tooltip:n.next,"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum+1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":r.formatMessage({id:"search.nextResult",defaultMessage:"Press to hear next matching result"})})))}renderJumpToLink(){if(this.numResults&&this.highlightedId){return e("a",{ref:t=>this.linkEl=t,href:`#${this.highlightedId}`,class:"sr-only"},r.formatMessage({id:"search.jumpToResult",defaultMessage:"Jump to search result in list"}))}else{return null}}render(){return e(i,null,e("div",{id:"wm-search-wrapper",class:`wm-search-wrapper ${this.searchType}`,ref:t=>this.wrapperEl=t},e("input",{disabled:this.disabled,id:"wm-search-input",placeholder:this.placeholder,"aria-label":`${this.label?this.label+". ":""}${r.formatMessage({id:"search.typeToFilterResults",defaultMessage:"Type to filter the results"})}`,onInput:t=>this.updateValue(t.target.value),onFocus:()=>this.addFocusStyle(),onBlur:()=>this.handleBlur(),"aria-autocomplete":"none",autocomplete:"off",value:this.value}),e("span",{class:"mdi search-icon"},String.fromCodePoint(parseInt(`0xf349`))),this.searchType==="find"&&this.renderResultsAndBrowseButtons(),e("div",{id:"wm-search-live",class:"sr-only","aria-live":"polite","aria-atomic":"true",ref:t=>this.resultsLiveRegion=t},this.announcement)),this.searchType==="find"&&this.renderJumpToLink())}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{numResults:["resetHighlightCountToStart"]}}};h.style=a;export{h as wm_search};
-//# sourceMappingURL=p-02a1000a.entry.js.map

package/dist/ripple/p-02a1000a.entry.js.map

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

package/dist/ripple/p-04ae66fd.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmNavigatorCss","Navigator","exports","this","retrievedInfo","loadFromUserinfo","parsedProducts","openRight","class_1","prototype","componentWillLoad","userName","console","error","parseData","_a","sent","setFocusIndex","getRequest","then","response","_this","email","currentProductId","current_product_id","productKeysToCamelCase","products","logoutUrl","logout_url","connectionName","connection_name","catch","errStatus","getWmMode","el","JSON","parse","sort","a","b","name","map","product","keys","Object","newProduct","forEach","key","snakeCaseToCamelCase","length","currentProduct","getProduct","itemIndexToFocus","indexOf","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKeys","ev","preventDefault","closeMenu","isOpen","getNewIndexToFocus","navigatorItems","openMenu","handleKeydown","detail","item","navItem","click","oldIndex","focusItem","unfocusItem","handleClick","isElOrChild","target","contains","handleButtonClick","wrapperEl","wrapperWidth","clientWidth","spaceLeft","getBoundingClientRect","left","spaceRight","document","documentElement","right","buttonFocusHandler","newSelection","tabIndex","focused","window","requestAnimationFrame","focus","index","oldSelection","hostButton","shadowRoot","querySelector","button","renderUserInfo","h","class","id","intl","formatMessage","defaultMessage","setAltText","renderHeading","description","renderList","role","concat","renderProductOptions","renderLogoutOption","icon","isSelected","clickRedirect","iconUrl","setProductOnClick","selected","onClick","src","alt","productId","authType","location","href","linkUrl","connName_1","samlLinkUrl","setLogoutOnclick","wmNavigatorLogout","emit","defineProperty","Array","from","querySelectorAll","find","render","Host","expanded","altText","ref"],"sources":["src/components/wm-navigator/wm-navigator.scss?tag=wm-navigator&encapsulation=shadow","src/components/wm-navigator/wm-navigator.tsx"],"sourcesContent":[":host,\nwm-navigator {\n  min-width: 0;\n  position: relative;\n  display: inline-block;\n\n  .wrapper {\n    overflow: auto;\n    font-size: rem-calc(18);\n    min-width: rem-calc(210);\n    width: auto;\n    max-height: 80vh;\n    text-align: left;\n    position: absolute;\n    z-index: 50;\n    top: 100%;\n    right: 20px;\n    left: auto;\n    background: #fff;\n    letter-spacing: normal;\n    @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\n    @include transition(transform 0.25s ease);\n    @include transformOrigin(center top);\n    @include scale($xVal: 1, $yVal: 1);\n\n    .user {\n      background: $background;\n      padding: rem-calc(10 20);\n      font-size: rem-calc(14);\n\n      p {\n        margin: 0;\n      }\n      p:first-child {\n        font-weight: 700;\n        text-transform: capitalize;\n      }\n    }\n\n    h2 {\n      background: #2e1b46;\n      color: #fff;\n      font-weight: 700;\n      margin: 0;\n      padding: rem-calc(10 20);\n      font-size: rem-calc(14);\n    }\n\n    [role=\"listbox\"] {\n      list-style: none;\n      margin: 0;\n      padding-left: 0;\n    }\n\n    &.hide {\n      @include scale($xVal: 1, $yVal: 0);\n    }\n\n    &.right {\n      right: auto;\n      left: 20px;\n    }\n  }\n\n  img {\n    transform: scale(0.8);\n    transform-origin: left center;\n    display: block;\n  }\n\n  .logout {\n    text-align: center;\n    text-transform: capitalize;\n  }\n}\n\npriv-navigator-item:focus {\n  outline: none;\n}\n","import { Component, Element, h, Host, Prop, State, Listen, EventEmitter, Event, Watch } from \"@stencil/core\";\nimport { getWmMode, Product, NavigatorPayload } from \"../../global/interfaces\";\nimport { intl, snakeCaseToCamelCase, getNewIndexToFocus } from \"../../global/functions\";\nimport { getRequest } from \"../../global/services/http-service\";\n\n@Component({\n  tag: \"wm-navigator\",\n  styleUrl: \"wm-navigator.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Navigator {\n  @Element() el!: any;\n  private wrapperEl?: HTMLDivElement;\n\n  // Component can receive user info and products as props (this is how it worked before)\n  @Prop() userName?: string;\n  @Prop() email?: string;\n  @Prop() authType: number = 1; // 1: none or off, 2: username-password or username_password_sso, 3: saml or saml_sso\n  @Prop() connectionName?: string;\n  @Prop() logoutUrl?: string;\n  @Prop() products?: string | []; // products as JSON string, parsed on load\n\n  // The new way is to retrieve user info from an endpoint\n  // dev needs to opt-in by setting loadFromUserinfo to true\n  @Prop() loadFromUserinfo: boolean = false;\n  // comp can check whether the info was successfully retrieved with:\n  private retrievedInfo: boolean = !this.loadFromUserinfo; // when in endpoint mode, only render after get request completed\n\n  // used either way to store the products\n  parsedProducts: Array<Product> = [];\n\n  /**\n   * Event emitted from child wm-navigator-button updates the state, which is then passed down as a prop by wm-navigator.\n   */\n  @State() isOpen: boolean = false;\n  private openRight: boolean = false; // whether the menu should open on the right side\n\n  @State() isTabbing: boolean = false;\n\n  /**\n   * Value is set to the index of the current product on load.\n   * Keyboard navigation updates the state to keep track of focus in the dropdown.\n   * State resets to the index of the current product when the dropdown closes.\n   */\n  @State() itemIndexToFocus: number = 0;\n\n  @Event() wmNavigatorLogout!: EventEmitter;\n\n  private currentProductId!: string;\n\n  async componentWillLoad() {\n    if (!this.userName) {\n      console.error(\"wm-navigator: user-name is a required property.\");\n    }\n\n    await this.parseData();\n    this.setFocusIndex();\n  }\n\n  // async because we need the http request to complete before proceeding\n  @Watch(\"products\")\n  async parseData() {\n    if (!!this.loadFromUserinfo) {\n      await getRequest(\"/platform/navigator/userinfo\")\n        .then((response: NavigatorPayload) => {\n          this.email = response.email;\n          this.currentProductId = response.current_product_id;\n          this.parsedProducts = this.productKeysToCamelCase(response.products);\n          this.logoutUrl = this.logoutUrl ? this.logoutUrl : response.logout_url;\n          this.connectionName = this.connectionName ? this.connectionName : response.connection_name;\n          if (!!this.email && !!this.currentProductId) {\n            this.retrievedInfo = true;\n          }\n        })\n        .catch((errStatus) => {\n          console.error(errStatus);\n        });\n    } else {\n      this.currentProductId = getWmMode(this.el);\n      if (!!this.products) {\n        if (typeof this.products === \"string\") {\n          this.parsedProducts = JSON.parse(this.products);\n        } else {\n          this.parsedProducts = this.products;\n        }\n        this.parsedProducts = this.productKeysToCamelCase(this.parsedProducts);\n      }\n    }\n    // products is initialized as empty array in case nothing is passed\n    this.parsedProducts.sort((a, b) => (a.name < b.name ? -1 : 1));\n  }\n\n  productKeysToCamelCase(products: object[]): Product[] {\n    products = products.map((product: any) => {\n      const keys = Object.keys(product);\n      let newProduct: { [key: string]: string } = {};\n      keys.forEach((key) => {\n        newProduct[snakeCaseToCamelCase(key)] = product[key];\n      });\n      return newProduct;\n    });\n    return products as Product[];\n  }\n\n  /**\n   * Sets index to focus on open to the selected product. This index resets it when the menu closes.\n   */\n  setFocusIndex() {\n    if (this.parsedProducts.length > 1) {\n      const currentProduct = this.getProduct(this.currentProductId);\n\n      if (currentProduct) {\n        this.itemIndexToFocus = this.parsedProducts.indexOf(currentProduct);\n      }\n    }\n  }\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"keydown\")\n  handleKeys(ev: KeyboardEvent) {\n    switch (ev.key) {\n      case \"Escape\":\n        ev.preventDefault();\n        this.closeMenu();\n        break;\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        ev.preventDefault();\n        if (!this.isOpen) {\n          this.itemIndexToFocus = getNewIndexToFocus(this.itemIndexToFocus, ev.key, this.navigatorItems.length);\n          this.openMenu();\n        }\n        break;\n    }\n  }\n\n  @Listen(\"keydownOnNavItem\")\n  handleKeydown(ev: CustomEvent) {\n    const key = ev.detail.key;\n    const item = ev.detail.navItem;\n    switch (key) {\n      case \"Tab\":\n        this.closeMenu();\n        break;\n      case \"Enter\":\n      case \" \":\n        item.click();\n        break;\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        const oldIndex = this.itemIndexToFocus;\n        this.itemIndexToFocus = getNewIndexToFocus(this.itemIndexToFocus, key, this.navigatorItems.length);\n        this.focusItem();\n        this.unfocusItem(oldIndex);\n        break;\n    }\n  }\n\n  @Listen(\"click\", { target: \"document\" })\n  handleClick(ev: MouseEvent) {\n    const isElOrChild = ev.target === this.el || this.el.contains(ev.target as Node);\n\n    if (!isElOrChild && this.isOpen) {\n      this.closeMenu();\n    }\n  }\n\n  @Listen(\"buttonActivated\")\n  handleButtonClick() {\n    this.isOpen ? this.closeMenu() : this.openMenu();\n  }\n\n  openMenu() {\n    if (this.wrapperEl) {\n      const wrapperWidth = this.wrapperEl.clientWidth;\n      const spaceLeft = this.el.getBoundingClientRect().left;\n      const spaceRight = document.documentElement.clientWidth - this.el.getBoundingClientRect().right;\n      this.openRight = wrapperWidth > spaceLeft && spaceRight > spaceLeft;\n    }\n    this.isOpen = true;\n    this.focusItem();\n  }\n\n  closeMenu() {\n    this.isOpen = false;\n    this.buttonFocusHandler();\n    this.unfocusItem(this.itemIndexToFocus);\n    this.setFocusIndex();\n  }\n\n  focusItem() {\n    const newSelection = this.navigatorItems[this.itemIndexToFocus];\n    newSelection.tabIndex = 0;\n    newSelection.focused = true;\n    window.requestAnimationFrame(() => newSelection.focus());\n  }\n\n  unfocusItem(index: number) {\n    const oldSelection = this.navigatorItems[index];\n    oldSelection.tabIndex = -1;\n    oldSelection.focused = false;\n  }\n\n  buttonFocusHandler() {\n    const hostButton = this.el.shadowRoot.querySelector(\"priv-navigator-button\");\n    const button = hostButton.shadowRoot.querySelector(\"button\");\n    window.requestAnimationFrame(() => button.focus());\n  }\n\n  /**\n   * HELPERS FOR RENDER\n   */\n  renderUserInfo() {\n    return (\n      <div\n        class=\"user\"\n        id=\"wm-nav-user\"\n        aria-label={intl.formatMessage(\n          {\n            id: \"navigator.userinfoLabel\",\n            defaultMessage: \"for {name}, email {email}\",\n          },\n          { name: this.userName, email: this.email }\n        )}\n      >\n        <p>{this.userName}</p>\n        <p>{this.email}</p>\n      </div>\n    );\n  }\n\n  setAltText(): string {\n    if (this.parsedProducts.length > 1) {\n      return intl.formatMessage({\n        id: \"navigator.userinfoAndProductNavigator\",\n        defaultMessage: \"User information and product navigator\",\n      });\n    } else {\n      return intl.formatMessage({\n        id: \"navigator.userinfo\",\n        defaultMessage: \"User information\",\n      });\n    }\n  }\n\n  renderHeading() {\n    return (\n      <h2>\n        {intl.formatMessage({\n          id: \"navigator.watermarkApps\",\n          defaultMessage: \"Watermark Apps\",\n          description: \"Applications made by Watermark Insights\",\n        })}\n      </h2>\n    );\n  }\n\n  renderList() {\n    return (\n      <ul\n        role=\"listbox\"\n        aria-label={`${intl.formatMessage({\n          id: \"navigator.WatermarkAppNavigation\",\n          defaultMessage: \"Watermark App Navigation\",\n          description: \"list of applications by Watermark Insights\",\n        })}`}\n        aria-describedby=\"wm-nav-user\"\n      >\n        {this.parsedProducts.length > 1 && this.renderProductOptions()}\n        {this.renderLogoutOption()}\n      </ul>\n    );\n  }\n\n  renderProductOptions(): Array<HTMLPrivNavigatorItemElement> {\n    return this.parsedProducts.map((product: Product) => {\n      let name: string | undefined, icon: string | undefined, isSelected: boolean, clickRedirect: any;\n\n      name = product.name;\n      icon = (product as Product).iconUrl;\n\n      clickRedirect = this.setProductOnClick(product.id);\n\n      if (!!name && !!icon) {\n        isSelected = this.currentProductId === product.id;\n\n        return (\n          <priv-navigator-item\n            selected={isSelected}\n            id={product.id}\n            onClick={clickRedirect}\n            role=\"option\"\n            aria-label={name}\n          >\n            <img src={icon} alt={name} />\n          </priv-navigator-item>\n        );\n      }\n    });\n  }\n\n  setProductOnClick(productId: string) {\n    const product = this.getProduct(productId);\n\n    if (this.currentProductId === productId) {\n      return () => {};\n    } else if (product) {\n      if (!!this.loadFromUserinfo || this.authType === 2) {\n        return () => (window.location.href = (product as Product).linkUrl);\n      } else if (this.authType === 3) {\n        // products passed as prop, saml\n        const connName = this.connectionName ? `/?connection_name=${this.connectionName}` : \"\";\n        return () => (window.location.href = (product as Product).samlLinkUrl + connName);\n      }\n    }\n  }\n\n  renderLogoutOption() {\n    return (\n      <priv-navigator-item\n        class=\"logout\"\n        selected={!(this.parsedProducts.length > 1)}\n        id=\"nav-logout\"\n        onClick={this.setLogoutOnclick()}\n        role=\"option\"\n      >\n        <span class=\"logout\">\n          {intl.formatMessage({\n            id: \"navigator.logout\",\n            defaultMessage: \"Log Out\",\n          })}\n        </span>\n      </priv-navigator-item>\n    );\n  }\n\n  setLogoutOnclick() {\n    // The logout item will always emit a custom event on click so that the dev can run any business logic specific to the app on logout (e.g., clearing local storage).\n    // It will only redirect if the dev has set the logoutUrl. If some sort of custom redirect is needed, the logoutUrl should not be set.\n    return () => {\n      this.wmNavigatorLogout.emit();\n      if (this.logoutUrl) {\n        window.location.href = this.logoutUrl;\n      }\n    };\n  }\n\n  private get navigatorItems(): Array<HTMLPrivNavigatorItemElement> {\n    return Array.from(this.el.shadowRoot.querySelectorAll(\"priv-navigator-item\"));\n  }\n\n  private getProduct(id: string): Product | undefined {\n    return this.parsedProducts.find((product) => product.id === id);\n  }\n\n  render() {\n    return this.retrievedInfo ? (\n      <Host class={this.isTabbing ? \"user-is-tabbing\" : \"\"}>\n        <priv-navigator-button expanded={this.isOpen} altText={this.setAltText()} isTabbing={this.isTabbing} />\n        <div\n          class={`wrapper ${this.isOpen ? \"\" : \"hide\"} ${this.openRight ? \"right\" : \"\"}`}\n          ref={(el) => (this.wrapperEl = el as HTMLDivElement)}\n        >\n          {this.renderUserInfo()}\n          {this.parsedProducts.length > 1 && this.renderHeading()}\n          {this.renderList()}\n        </div>\n      </Host>\n    ) : (\n      \"\"\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-0826dc64.system.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["patchBrowser","importMeta","module","meta","url","opts","resourcesUrl","URL","href","promiseResolve","then","options","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v3.0.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';\n/**\n * Helper method for querying a `meta` tag that contains a nonce value\n * out of a DOM's head.\n *\n * @param doc The DOM containing the `head` to query against\n * @returns The content of the meta tag representing the nonce value, or `undefined` if no tag\n * exists or the tag has no content.\n */\nfunction queryNonceMetaTagContent(doc) {\n    var _a, _b, _c;\n    return (_c = (_b = (_a = doc.head) === null || _a === void 0 ? void 0 : _a.querySelector('meta[name=\"csp-nonce\"]')) === null || _b === void 0 ? void 0 : _b.getAttribute('content')) !== null && _c !== void 0 ? _c : undefined;\n}\n// TODO(STENCIL-661): Remove code related to the dynamic import shim\nconst getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\\s|-/g, '_')}`;\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n    if (BUILD.cssVarShim) {\n        // shim css vars\n        // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n        plt.$cssShim$ = win.__cssshim;\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    if (BUILD.profile && !performance.mark) {\n        // not all browsers support performance.mark/measure (Safari 10)\n        // because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,\n        // simply stub the implementations out.\n        // TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)\n        // @ts-ignore\n        performance.mark = performance.measure = () => {\n            /*noop*/\n        };\n        performance.getEntriesByName = () => [];\n    }\n    // @ts-ignore\n    const scriptElm = \n    // TODO(STENCIL-661): Remove code related to the dynamic import shim\n    // TODO(STENCIL-663): Remove code related to deprecated `safari10` field.\n    BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};\n    // TODO(STENCIL-663): Remove code related to deprecated `safari10` field.\n    if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {\n        // Safari < v11 support: This IF is true if it's Safari below v11.\n        // This fn cannot use async/await since Safari didn't support it until v11,\n        // however, Safari 10 did support modules. Safari 10 also didn't support \"nomodule\",\n        // so both the ESM file and nomodule file would get downloaded. Only Safari\n        // has 'onbeforeload' in the script, and \"history.scrollRestoration\" was added\n        // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.\n        // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.\n        return {\n            then() {\n                /* promise noop */\n            },\n        };\n    }\n    // TODO(STENCIL-663): Remove code related to deprecated `safari10` field.\n    if (!BUILD.safari10 && importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n        // TODO(STENCIL-661): Remove code related to the dynamic import shim\n        // TODO(STENCIL-663): Remove code related to deprecated `safari10` field.\n    }\n    else if (BUILD.dynamicImportShim || BUILD.safari10) {\n        opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;\n        // TODO(STENCIL-661): Remove code related to the dynamic import shim\n        if (BUILD.dynamicImportShim) {\n            patchDynamicImport(opts.resourcesUrl, scriptElm);\n        }\n        // TODO(STENCIL-661): Remove code related to the dynamic import shim\n        if (BUILD.dynamicImportShim && !win.customElements) {\n            // module support, but no custom elements support (Old Edge)\n            // @ts-ignore\n            return import(/* webpackChunkName: \"polyfills-dom\" */ './dom.js').then(() => opts);\n        }\n    }\n    return promiseResolve(opts);\n};\n// TODO(STENCIL-661): Remove code related to the dynamic import shim\nconst patchDynamicImport = (base, orgScriptElm) => {\n    const importFunctionName = getDynamicImportFunction(NAMESPACE);\n    try {\n        // test if this browser supports dynamic imports\n        // There is a caching issue in V8, that breaks using import() in Function\n        // By generating a random string, we can workaround it\n        // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info\n        win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);\n    }\n    catch (e) {\n        // this shim is specifically for browsers that do support \"esm\" imports\n        // however, they do NOT support \"dynamic\" imports\n        // basically this code is for old Edge, v18 and below\n        const moduleMap = new Map();\n        win[importFunctionName] = (src) => {\n            var _a;\n            const url = new URL(src, base).href;\n            let mod = moduleMap.get(url);\n            if (!mod) {\n                const script = doc.createElement('script');\n                script.type = 'module';\n                script.crossOrigin = orgScriptElm.crossOrigin;\n                script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {\n                    type: 'application/javascript',\n                }));\n                // Apply CSP nonce to the script tag if it exists\n                const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);\n                if (nonce != null) {\n                    script.setAttribute('nonce', nonce);\n                }\n                mod = new Promise((resolve) => {\n                    script.onload = () => {\n                        resolve(win[importFunctionName].m);\n                        script.remove();\n                    };\n                });\n                moduleMap.set(url, mod);\n                doc.head.appendChild(script);\n            }\n            return mod;\n        };\n    }\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"oMAmBA,IAAMA,EAAe,WAkCjB,IAAMC,EAAaC,EAAAC,KAAAC,IACnB,IAAMC,EAA6D,GAiBnE,GAAuBJ,IAAe,GAAI,CACtCI,EAAKC,aAAe,IAAIC,IAAI,IAAKN,GAAYO,I,CAiBjD,OAAOC,EAAeJ,EAC1B,ECtFAL,IAAeU,MAAK,SAAAC,GAElB,OAAOC,EAAcC,KAAAC,MAAA,m8aAAuCH,EAC9D,G"}

package/dist/ripple/p-08b7ec08.system.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["getIconCodeFromName","icon","iconCodes","close","pencil","cancel","check","delete","magnify","export","defaultMode","getWmMode","exports","ref","getAttribute","document","documentElement"],"sources":["src/global/interfaces.ts"],"sourcesContent":["export type Notification = {\n  message: string;\n  id: string;\n  link: string;\n  newWindow: boolean;\n};\n\n// Create label for icon-only buttons\nexport type label = string | undefined;\n\nexport type CssClassMap = { [className: string]: boolean };\n\ninterface IconLabels {\n  [index: string]: string;\n}\n\nexport type Product = {\n  description?: string;\n  samlLinkUrl?: string;\n  iconUrl: string;\n  id: string;\n  linkUrl: string;\n  name: string;\n};\n\n// products retrieved from endpoint:\nexport type NavigatorPayload = {\n  connection_name?: string;\n  current_product_id: string;\n  email: string;\n  logout_url: string;\n  products: Product[];\n};\n\nexport type validButtonTypes =\n  | \"primary\"\n  | \"secondary\"\n  | \"textonly\"\n  | \"icononly\"\n  | \"navigational\"\n  | \"selector\"\n  | \"selector-primary\"\n  | \"pairpositive\"\n  | \"pairnegative\";\n\n//List of icon codes with more indicative descriptors to create labels for icon-only buttons\nexport const iconLabels: IconLabels = {\n  f156: \"Close\",\n  f3eb: \"Edit\",\n  f739: \"Cancel\",\n  f12c: \"Save\",\n  f1c0: \"Delete\",\n  f349: \"Search\",\n  f207: \"Export info\",\n  f1d9: \"Open dropdown\",\n  f04d: \"Go back\",\n  f054: \"Go forward\",\n  f141: \"Left\",\n  f142: \"Right\",\n  f35e: \"Menu left\",\n  f35d: \"Toggle menu down\",\n  f30d: \"Backspace\",\n  f645: \"Sort hierarchically\",\n  f4bb: \"Sort alphabetically\",\n};\n\n// For backwards compatibility, the icon prop accepts the icon name minus mdi- prefix, e.g. \"icon\"\n// this function converts the name to the corresponding code or returns what it was passed\ninterface IconCodes {\n  [index: string]: string;\n}\nexport function getIconCodeFromName(icon: string): string {\n  return iconCodes[icon] || icon;\n}\n\nconst iconCodes: IconCodes = {\n  close: \"f156\",\n  pencil: \"f3eb\",\n  cancel: \"f739\",\n  check: \"f12c\",\n  delete: \"f1c0\",\n  magnify: \"f349\",\n  export: \"f207\",\n  \"dots-vertical\": \"f1d9\",\n  \"arrow-left\": \"f04d\",\n  \"arrow-right\": \"f054\",\n  \"chevron-left\": \"f141\",\n  \"chevron-right\": \"f142\",\n  \"menu-left\": \"f35e\",\n  \"menu-down\": \"f35d\",\n  \"keyboard-backspace\": \"f30d\",\n  \"file-tree\": \"f645\",\n  \"sort-alphabetical\": \"f4bb\",\n  \"checkbox-marked-circle\": \"f133\",\n  \"account-settings\": \"f630\",\n  \"backup-restore\": \"f06f\",\n};\n\nexport const defaultMode = \"planning\";\n\nexport const getWmMode = (ref?: any) => {\n  return ref.getAttribute(\"mode\") || document.documentElement.getAttribute(\"mode\") || defaultMode;\n};\n\nexport type TooltipPlacement =\n  | \"top\"\n  | \"bottom\"\n  | \"left\"\n  | \"right\"\n  | \"bottom-left\"\n  | \"bottom-right\"\n  | \"top-right\"\n  | \"top-left\";\n\nexport type SliceElement = (SVGElement | HTMLElement);\n\nexport type SliceDetails = {\n  amount: number;\n  perc: number;\n  legend: string | null;\n  color: string;\n  offset: number;\n  id: string;\n  title: string | null;\n  text: string | null;\n  buttonText: string | null;\n  sliceRef: Element;\n  inSmallCluster: boolean;\n  coords?: {x: number, y: number};\n};\n\nexport type ChartDetails = {\n  size: number;\n  colors: Array<string>;\n  thickness?: number;\n  padding: number;\n  category: \"doughnut\" | \"stackedBar\" | \"simpleBar\";\n};\n\nexport type ChartType =\n  // progress monitor types\n  | \"doughnut\"\n  | \"bar\"\n  // chart types\n  | \"doughnut1\"\n  | \"doughnut2\"\n  | \"doughnut2plus\"\n  | \"doughnut3\"\n  | \"bar2\"\n  | \"bar3\"\n  | \"bar4\"\n  | \"bar5\"\n  | \"bar6\"\n  | \"bar7\"\n  // deprecated\n  | \"doughnut0\"\n  | \"bar1\";\n\nexport type LegendItem = { key: string; color: string };\n\nexport type UploadedFile = {\n  name: string;\n  id: string;\n  type: string;\n  lastUpdated: string; // in display format\n  progress?: number;\n  fileActions?: string;\n  size?: string; // in display format\n};\n"],"mappings":"yFAuEgBA,EAAoBC,GAClC,OAAOC,EAAUD,IAASA,CAC5B,CAEA,IAAMC,EAAuB,CAC3BC,MAAO,OACPC,OAAQ,OACRC,OAAQ,OACRC,MAAO,OACPC,OAAQ,OACRC,QAAS,OACTC,OAAQ,OACR,gBAAiB,OACjB,aAAc,OACd,cAAe,OACf,eAAgB,OAChB,gBAAiB,OACjB,YAAa,OACb,YAAa,OACb,qBAAsB,OACtB,YAAa,OACb,oBAAqB,OACrB,yBAA0B,OAC1B,mBAAoB,OACpB,iBAAkB,QAGb,IAAMC,EAAc,W,IAEdC,EAASC,EAAA,KAAG,SAACC,GACxB,OAAOA,EAAIC,aAAa,SAAWC,SAASC,gBAAgBF,aAAa,SAAWJ,CACtF,G"}

package/dist/ripple/p-0ad3a708.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as o,H as i,g as s}from"./p-1c23de4a.js";import{g as a,c as n}from"./p-c6a0f7e5.js";const d="wm-modal{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:2001;width:80vw;max-width:750px;max-height:80vh;-webkit-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);-moz-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14)}wm-modal *{-webkit-box-sizing:border-box;box-sizing:border-box}wm-modal>*{width:80vw;max-width:750px;background:#fff}wm-modal>*:focus{outline:none}wm-modal wm-modal-header,wm-modal wm-modal-footer{padding:1.25rem 1.875rem}wm-modal wm-modal-header{z-index:2003}wm-modal wm-modal-footer{z-index:2003}wm-modal>:not(wm-modal-header):not(wm-modal-footer){max-height:calc(80vh - 166px);z-index:2002}wm-modal.wm-modal wm-modal-header{border-bottom:1px solid #f4f3f6}wm-modal.wm-modal wm-modal-footer{border-top:1px solid #f4f3f6}@media only screen and (max-width: 768px){wm-modal.wm-modal{height:100%;max-height:none;max-width:none;width:100vw}wm-modal.wm-modal>*{max-width:none;width:100vw}wm-modal.wm-modal>*:not(wm-modal-header):not(wm-modal-footer){max-height:none;height:calc(100vh - 166px)}}wm-modal.wm-dialog>:not(wm-modal-header):not(wm-modal-footer){padding:0 1.875rem 1.25rem 1.875rem;font-size:0.875rem;border:none}wm-modal .overlay{width:100vw;height:100vh;max-width:none;max-height:none;position:fixed !important;top:-1;bottom:1;left:-1;right:1;-webkit-transform:translate(0%, 0%);transform:translate(0%, 0%);background-color:rgba(25, 25, 25, 0.4);-ms-transition:opacity 0.5s ease-out;-webkit-transition:opacity 0.5s ease-out;-moz-transition:opacity 0.5s ease-out;transition:opacity 0.5s ease-out;z-index:2000}wm-modal.hide{visibility:hidden}wm-modal .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;top:0;left:0}";const m=class{constructor(o){t(this,o);this.focusLastElement=e(this,"focusLastElement",3);this.focusFirstElement=e(this,"focusFirstElement",3);this.wmModalCloseTriggered=e(this,"wmModalCloseTriggered",3);this.wmCloseTriggered=e(this,"wmCloseTriggered",7);this.wmModalPrimaryTriggered=e(this,"wmModalPrimaryTriggered",7);this.wmPrimaryTriggered=e(this,"wmPrimaryTriggered",7);this.wmModalSecondaryTriggered=e(this,"wmModalSecondaryTriggered",7);this.wmSecondaryTriggered=e(this,"wmSecondaryTriggered",7);this.bodyFocusListener=()=>this.redirectFocusFromBody();this.open=false;this.isOpen=false;this.elementToFocus="";this.modalType=null;this.isTypeDialog=null;this.uid=undefined}get tempOpen(){return this.open||this.isOpen}get tempModalType(){return this.modalType?this.modalType:this.isTypeDialog?"dialog":"modal"}get focusOnOpenEl(){let t=null;if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){t=this.el.querySelector(`#wm-${this.elementToFocus}-${this.uid}`)}else if(this.elementToFocus){t=this.el.querySelector("#"+this.elementToFocus);!t&&console.warn("Ripple Component Library: The modal component couldn't find an element matching the id you passed for 'elementToFocus'. It will fall back to the default and focus the close button when the modal opens.")}const e=this.el.querySelector(`#wm-modal-close-${this.uid}`);return t?t:e}toggleModal(){this.tempOpen?this.showModal():this.hideModal()}handleClick(t){this.tempOpen&&t.target===this.overlayEl&&this.focusOnOpenEl.focus()}closeModalOnEscape(t){if(t.key==="Escape"){t.stopPropagation();this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit();this.open=false}}showModal(){this.setAriaDescribedbyOnModal();this.setElToFocusOnClose();document.body.style.overflow="hidden";document.body.tabIndex=0;document.body.removeEventListener("focus",this.bodyFocusListener,true);document.body.addEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>{window.requestAnimationFrame((()=>this.focusOnOpenEl.focus()))}))}hideModal(){document.body.style.overflow="visible";document.body.tabIndex=-1;document.body.removeEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>this.focusOnCloseEl.focus()))}componentWillLoad(){if(this.isOpen){console.warn("wm-modal: is-open has been deprecated as of v3.1.0. Please use open instead.")}if(this.isTypeDialog){console.warn("wm-modal: is-type-dialog has been deprecated as of v3.1.0. Please use modal-type instead.")}if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){if(!this.el.id){console.error("You are telling the modal to focus an element in the footer when it opens. That's fine! But when you do that, you also need to give the wm-modal-wrapper an ID and set the ID of the modal body to 'content-[id of wm-modal-wrapper]. This is for accessibility purposes.")}}this.el.focus=()=>{this.focusOnOpenEl.focus()};this.uid=this.el.id?this.el.id:a()}componentDidLoad(){if(this.tempOpen){this.showModal()}}async emitCloseEvent(){this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit()}async emitPrimaryEvent(){this.wmModalPrimaryTriggered.emit();this.wmPrimaryTriggered.emit()}async emitSecondaryEvent(){this.wmModalSecondaryTriggered.emit();this.wmSecondaryTriggered.emit()}setAriaDescribedbyOnModal(){const t=document.getElementById(`content-${this.uid}`);if(!t){console.warn("Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.")}else{this.el.setAttribute("aria-describedby",`wm-modal-heading-text-${this.uid} content-${this.uid}`)}}setElToFocusOnClose(){const t=document.activeElement;if(t.tagName==="WM-MENUITEM"){this.focusOnCloseEl=t.parentElement}else{this.focusOnCloseEl=n(t)}}redirectFocusFromBody(){if(document.activeElement.tagName==="BODY"){this.focusOnOpenEl.focus()}}render(){return o(i,{class:`${this.tempOpen?"":"hide "}${"wm-"+this.tempModalType}`,role:"dialog","aria-describedby":`wm-modal-heading-text-${this.uid}`,"aria-modal":"true",tabindex:this.tempOpen?0:null,onFocus:()=>{this.focusLastElement.emit()}},o("div",{class:"overlay",ref:t=>this.overlayEl=t}),o("div",{class:"sr-only",tabIndex:0,onFocus:()=>{this.focusFirstElement.emit()}}))}get el(){return s(this)}static get watchers(){return{open:["toggleModal"],isOpen:["toggleModal"]}}};m.style=d;export{m as wm_modal};
-//# sourceMappingURL=p-0ad3a708.entry.js.map

package/dist/ripple/p-0ad3a708.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmModalCss","Modal","this","bodyFocusListener","redirectFocusFromBody","tempOpen","open","isOpen","tempModalType","modalType","isTypeDialog","focusOnOpenEl","customElementToFocus","elementToFocus","el","querySelector","uid","console","warn","closeButtonEl","toggleModal","showModal","hideModal","handleClick","ev","target","overlayEl","focus","closeModalOnEscape","key","stopPropagation","wmModalCloseTriggered","emit","wmCloseTriggered","setAriaDescribedbyOnModal","setElToFocusOnClose","document","body","style","overflow","tabIndex","removeEventListener","addEventListener","window","requestAnimationFrame","focusOnCloseEl","componentWillLoad","id","error","generateId","componentDidLoad","async","wmModalPrimaryTriggered","wmPrimaryTriggered","wmModalSecondaryTriggered","wmSecondaryTriggered","modalBody","getElementById","setAttribute","elToFocus","activeElement","tagName","parentElement","checkForActiveElInShadow","render","h","Host","class","role","tabindex","onFocus","focusLastElement","ref","focusFirstElement"],"sources":["./src/components/wm-modal/wm-modal.scss?tag=wm-modal","./src/components/wm-modal/wm-modal.tsx"],"sourcesContent":["wm-modal {\n  * {\n    box-sizing: border-box;\n  }\n  @include displayFlex();\n  @include justifyContent(center);\n  @include alignItems(center);\n\n  flex-direction: column;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 2001;\n  width: 80vw;\n  max-width: 750px;\n  max-height: 80vh;\n  @include box-shadow(\n    0px 11px 15px 0px rgba(0, 0, 0, 0.2),\n    0px 9px 46px 8px rgba(0, 0, 0, 0.12),\n    0px 24px 38px 3px rgba(0, 0, 0, 0.14)\n  );\n\n  > * {\n    width: 80vw;\n    max-width: 750px;\n    background: $light-background;\n\n    &:focus {\n      outline: none;\n    }\n  }\n\n  wm-modal-header,\n  wm-modal-footer {\n    padding: rem-calc(20 30);\n  }\n\n  wm-modal-header {\n    z-index: 2003;\n  }\n\n  wm-modal-footer {\n    z-index: 2003;\n  }\n\n  > :not(wm-modal-header):not(wm-modal-footer) {\n    max-height: calc(80vh - 166px);\n    z-index: 2002;\n  }\n\n  &.wm-modal {\n    wm-modal-header {\n      border-bottom: 1px solid rgb(244, 243, 246);\n    }\n\n    wm-modal-footer {\n      border-top: 1px solid rgb(244, 243, 246);\n    }\n\n    @media only screen and (max-width: 768px) {\n      height: 100%;\n      max-height: none;\n      max-width: none;\n      width: 100vw;\n\n      > * {\n        max-width: none;\n        width: 100vw;\n      }\n\n      > *:not(wm-modal-header):not(wm-modal-footer) {\n        max-height: none;\n        height: calc(100vh - 166px);\n      }\n    }\n  }\n\n  &.wm-dialog {\n    > :not(wm-modal-header):not(wm-modal-footer) {\n      padding: rem-calc(0 30 20 30);\n      font-size: rem-calc(14px);\n      border: none;\n    }\n  }\n\n  .overlay {\n    width: 100vw;\n    height: 100vh;\n    max-width: none;\n    max-height: none;\n    position: fixed !important;\n    top: -1;\n    bottom: 1;\n    left: -1;\n    right: 1;\n    transform: translate(0%, 0%);\n    background-color: rgba(25, 25, 25, 0.4);\n    @include transition(opacity 0.5s ease-out);\n    z-index: 2000;\n  }\n\n  &.hide {\n    visibility: hidden;\n  }\n\n  .sr-only {\n    @include srOnly;\n    top: 0;\n    left: 0;\n  }\n}\n","import { h, Component, Element, Listen, Host, Prop, Watch, Event, EventEmitter, Method } from \"@stencil/core\";\nimport { checkForActiveElInShadow } from \"../../global/functions\";\nimport { generateId } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-modal\",\n  styleUrl: \"wm-modal.scss\",\n})\nexport class Modal {\n  @Element() el!: HTMLWmModalElement;\n  @Prop({ reflect: true, mutable: true }) open: boolean = false;\n  @Prop({ reflect: true, mutable: true }) isOpen: boolean = false; // DEPRECATED in favor of open\n  get tempOpen() {\n    // instances of this.tempOpen should be replaced with this.open once isOpen is fully phased out\n    return this.open || this.isOpen;\n  }\n  @Prop({ mutable: true }) elementToFocus: \"primary\" | \"secondary\" | string = \"\"; // primary and secondary point to the corresponding buttons, otherwise focus based on element id\n  @Prop({ reflect: true }) modalType: \"modal\" | \"dialog\" | null = null;\n  @Prop({ reflect: true }) isTypeDialog: boolean | null = null;\n  get tempModalType() {\n    return this.modalType ? this.modalType : this.isTypeDialog ? \"dialog\" : \"modal\";\n  }\n  @Prop({ mutable: true, reflect: true }) uid!: string;\n  private focusOnCloseEl!: HTMLElement;\n  private overlayEl!: HTMLDivElement;\n  private bodyFocusListener: () => void = () => this.redirectFocusFromBody();\n\n  @Event({ bubbles: false }) focusLastElement!: EventEmitter;\n  @Event({ bubbles: false }) focusFirstElement!: EventEmitter;\n  // wmModalCloseTriggered does not bubble, prevent nested modals from closing all at once\n  @Event({ bubbles: false }) wmModalCloseTriggered!: EventEmitter;\n  @Event() wmCloseTriggered!: EventEmitter; // deprecated in favor of wmModalCloseTriggered\n  @Event() wmModalPrimaryTriggered!: EventEmitter;\n  @Event() wmPrimaryTriggered!: EventEmitter; // deprecated in favor of wmModalPrimaryTriggered\n  @Event() wmModalSecondaryTriggered!: EventEmitter;\n  @Event() wmSecondaryTriggered!: EventEmitter; // deprecated in favor of wmModalSecondaryTriggered\n\n  get focusOnOpenEl(): HTMLElement {\n    let customElementToFocus: HTMLElement | null = null;\n\n    if (this.elementToFocus === \"primary\" || this.elementToFocus === \"secondary\") {\n      customElementToFocus = this.el.querySelector<HTMLElement>(`#wm-${this.elementToFocus}-${this.uid}`);\n    } else if (this.elementToFocus) {\n      customElementToFocus = this.el.querySelector<HTMLElement>(\"#\" + this.elementToFocus);\n      !customElementToFocus &&\n        console.warn(\n          \"Ripple Component Library: The modal component couldn't find an element matching the id you passed for 'elementToFocus'. It will fall back to the default and focus the close button when the modal opens.\"\n        );\n    }\n\n    const closeButtonEl = this.el.querySelector<HTMLElement>(`#wm-modal-close-${this.uid}`)!;\n    return customElementToFocus ? customElementToFocus : closeButtonEl;\n  }\n\n  //App can open modal by toggling the prop\n  @Watch(\"open\")\n  @Watch(\"isOpen\")\n  toggleModal() {\n    this.tempOpen ? this.showModal() : this.hideModal();\n  }\n\n  //The below not implemented in light of the fact that the app does often need to keep track of the modal's state itself so that it can update the data displayed in the body:\n  //App can also open modal by emitting wmShowModal event. Event needs to include the modal's unique id as the event detail, or else all modals on the page will open when wmShowModal event is dispatched.\n  // @Listen(\"wmShowModal\", { target: \"window\" })\n  // doesEventMatchId(ev: CustomEvent) {\n  //   ev.detail === this.uid && this.showModal();\n  // }\n\n  @Listen(\"click\")\n  handleClick(ev: MouseEvent & { target: HTMLElement }) {\n    this.tempOpen && ev.target === this.overlayEl && this.focusOnOpenEl.focus();\n  }\n\n  @Listen(\"keydown\")\n  closeModalOnEscape(ev: KeyboardEvent) {\n    if (ev.key === \"Escape\") {\n      // stops propagation prevents nested modal from closing all at once\n      ev.stopPropagation();\n      this.wmModalCloseTriggered.emit();\n      this.wmCloseTriggered.emit(); // deprecated\n      this.open = false;\n    }\n  }\n\n  showModal() {\n    this.setAriaDescribedbyOnModal();\n    this.setElToFocusOnClose(); //Record where the user was before the modal opened so that focus can return to it when the modal closes\n    document.body.style.overflow = \"hidden\"; //Keeps the page below the modal from scrolling\n\n    //Focus listeners as a general catch for keeping focus in case of errors in finding element with id passed in by dev (element is removed from DOM, etc.) or other scenarios\n    document.body.tabIndex = 0;\n    document.body.removeEventListener(\"focus\", this.bodyFocusListener, true);\n    document.body.addEventListener(\"focus\", this.bodyFocusListener, true);\n\n    window.requestAnimationFrame(() => {\n      // nested requestAnimationFrames allow all elements to become visible on page before assigning focus\n      window.requestAnimationFrame(() => this.focusOnOpenEl.focus()); //Bring focus to element inside modal\n    });\n  }\n\n  //Close the modal and focus the triggering element when the modal buttons emit their events\n  hideModal() {\n    document.body.style.overflow = \"visible\";\n    document.body.tabIndex = -1;\n    document.body.removeEventListener(\"focus\", this.bodyFocusListener, true);\n    window.requestAnimationFrame(() => this.focusOnCloseEl.focus()); //Return focus\n  }\n\n  componentWillLoad() {\n    if (this.isOpen) {\n      console.warn(\"wm-modal: is-open has been deprecated as of v3.1.0. Please use open instead.\");\n    }\n    if (this.isTypeDialog) {\n      console.warn(\"wm-modal: is-type-dialog has been deprecated as of v3.1.0. Please use modal-type instead.\");\n    }\n    if (this.elementToFocus === \"primary\" || this.elementToFocus === \"secondary\") {\n      if (!this.el.id) {\n        console.error(\n          \"You are telling the modal to focus an element in the footer when it opens. That's fine! But when you do that, you also need to give the wm-modal-wrapper an ID and set the ID of the modal body to 'content-[id of wm-modal-wrapper]. This is for accessibility purposes.\"\n        );\n      }\n    }\n\n    this.el.focus = () => {\n      this.focusOnOpenEl.focus();\n    };\n\n    this.uid = this.el.id ? this.el.id : generateId();\n  }\n\n  componentDidLoad() {\n    if (this.tempOpen) {\n      this.showModal();\n    }\n  }\n\n  @Method()\n  async emitCloseEvent() {\n    this.wmModalCloseTriggered.emit();\n    this.wmCloseTriggered.emit(); // deprecated\n  }\n\n  @Method()\n  async emitPrimaryEvent() {\n    this.wmModalPrimaryTriggered.emit();\n    this.wmPrimaryTriggered.emit(); // deprecated\n  }\n\n  @Method()\n  async emitSecondaryEvent() {\n    this.wmModalSecondaryTriggered.emit();\n    this.wmSecondaryTriggered.emit(); // deprecated\n  }\n\n  setAriaDescribedbyOnModal() {\n    const modalBody = document.getElementById(`content-${this.uid}`);\n\n    if (!modalBody) {\n      console.warn(\n        \"Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.\"\n      );\n    } else {\n      this.el.setAttribute(\"aria-describedby\", `wm-modal-heading-text-${this.uid} content-${this.uid}`);\n    }\n  }\n\n  setElToFocusOnClose() {\n    const elToFocus = document.activeElement as HTMLElement;\n    if (elToFocus.tagName === \"WM-MENUITEM\") {\n      this.focusOnCloseEl = elToFocus.parentElement!;\n    } else {\n      this.focusOnCloseEl = checkForActiveElInShadow(elToFocus);\n    }\n  }\n\n  redirectFocusFromBody() {\n    if ((document.activeElement as HTMLElement).tagName === \"BODY\") {\n      this.focusOnOpenEl.focus();\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={`${this.tempOpen ? \"\" : \"hide \"}${\"wm-\" + this.tempModalType}`}\n        role=\"dialog\"\n        aria-describedby={`wm-modal-heading-text-${this.uid}`}\n        aria-modal=\"true\"\n        tabindex={this.tempOpen ? 0 : null}\n        onFocus={() => {\n          this.focusLastElement.emit();\n        }}\n      >\n        <div class=\"overlay\" ref={(el) => (this.overlayEl = el as HTMLDivElement)} />\n        <div\n          class=\"sr-only\"\n          tabIndex={0}\n          onFocus={() => {\n            this.focusFirstElement.emit();\n          }}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"2GAAA,MAAMA,EAAa,u/E,MCQNC,EAAK,M,yeAiBRC,KAAAC,kBAAgC,IAAMD,KAAKE,wB,UAfK,M,YACE,M,oBAKkB,G,eACZ,K,kBACR,K,mBANpDC,eAEF,OAAOH,KAAKI,MAAQJ,KAAKK,M,CAKvBC,oBACF,OAAON,KAAKO,UAAYP,KAAKO,UAAYP,KAAKQ,aAAe,SAAW,O,CAiBtEC,oBACF,IAAIC,EAA2C,KAE/C,GAAIV,KAAKW,iBAAmB,WAAaX,KAAKW,iBAAmB,YAAa,CAC5ED,EAAuBV,KAAKY,GAAGC,cAA2B,OAAOb,KAAKW,kBAAkBX,KAAKc,M,MACxF,GAAId,KAAKW,eAAgB,CAC9BD,EAAuBV,KAAKY,GAAGC,cAA2B,IAAMb,KAAKW,iBACpED,GACCK,QAAQC,KACN,4M,CAIN,MAAMC,EAAgBjB,KAAKY,GAAGC,cAA2B,mBAAmBb,KAAKc,OACjF,OAAOJ,EAAuBA,EAAuBO,C,CAMvDC,cACElB,KAAKG,SAAWH,KAAKmB,YAAcnB,KAAKoB,W,CAW1CC,YAAYC,GACVtB,KAAKG,UAAYmB,EAAGC,SAAWvB,KAAKwB,WAAaxB,KAAKS,cAAcgB,O,CAItEC,mBAAmBJ,GACjB,GAAIA,EAAGK,MAAQ,SAAU,CAEvBL,EAAGM,kBACH5B,KAAK6B,sBAAsBC,OAC3B9B,KAAK+B,iBAAiBD,OACtB9B,KAAKI,KAAO,K,EAIhBe,YACEnB,KAAKgC,4BACLhC,KAAKiC,sBACLC,SAASC,KAAKC,MAAMC,SAAW,SAG/BH,SAASC,KAAKG,SAAW,EACzBJ,SAASC,KAAKI,oBAAoB,QAASvC,KAAKC,kBAAmB,MACnEiC,SAASC,KAAKK,iBAAiB,QAASxC,KAAKC,kBAAmB,MAEhEwC,OAAOC,uBAAsB,KAE3BD,OAAOC,uBAAsB,IAAM1C,KAAKS,cAAcgB,SAAQ,G,CAKlEL,YACEc,SAASC,KAAKC,MAAMC,SAAW,UAC/BH,SAASC,KAAKG,UAAY,EAC1BJ,SAASC,KAAKI,oBAAoB,QAASvC,KAAKC,kBAAmB,MACnEwC,OAAOC,uBAAsB,IAAM1C,KAAK2C,eAAelB,S,CAGzDmB,oBACE,GAAI5C,KAAKK,OAAQ,CACfU,QAAQC,KAAK,+E,CAEf,GAAIhB,KAAKQ,aAAc,CACrBO,QAAQC,KAAK,4F,CAEf,GAAIhB,KAAKW,iBAAmB,WAAaX,KAAKW,iBAAmB,YAAa,CAC5E,IAAKX,KAAKY,GAAGiC,GAAI,CACf9B,QAAQ+B,MACN,4Q,EAKN9C,KAAKY,GAAGa,MAAQ,KACdzB,KAAKS,cAAcgB,OAAO,EAG5BzB,KAAKc,IAAMd,KAAKY,GAAGiC,GAAK7C,KAAKY,GAAGiC,GAAKE,G,CAGvCC,mBACE,GAAIhD,KAAKG,SAAU,CACjBH,KAAKmB,W,EAKT8B,uBACEjD,KAAK6B,sBAAsBC,OAC3B9B,KAAK+B,iBAAiBD,M,CAIxBmB,yBACEjD,KAAKkD,wBAAwBpB,OAC7B9B,KAAKmD,mBAAmBrB,M,CAI1BmB,2BACEjD,KAAKoD,0BAA0BtB,OAC/B9B,KAAKqD,qBAAqBvB,M,CAG5BE,4BACE,MAAMsB,EAAYpB,SAASqB,eAAe,WAAWvD,KAAKc,OAE1D,IAAKwC,EAAW,CACdvC,QAAQC,KACN,8J,KAEG,CACLhB,KAAKY,GAAG4C,aAAa,mBAAoB,yBAAyBxD,KAAKc,eAAed,KAAKc,M,EAI/FmB,sBACE,MAAMwB,EAAYvB,SAASwB,cAC3B,GAAID,EAAUE,UAAY,cAAe,CACvC3D,KAAK2C,eAAiBc,EAAUG,a,KAC3B,CACL5D,KAAK2C,eAAiBkB,EAAyBJ,E,EAInDvD,wBACE,GAAKgC,SAASwB,cAA8BC,UAAY,OAAQ,CAC9D3D,KAAKS,cAAcgB,O,EAIvBqC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,GAAGjE,KAAKG,SAAW,GAAK,UAAU,MAAQH,KAAKM,gBACtD4D,KAAK,SAAQ,mBACK,yBAAyBlE,KAAKc,MAAK,aAC1C,OACXqD,SAAUnE,KAAKG,SAAW,EAAI,KAC9BiE,QAAS,KACPpE,KAAKqE,iBAAiBvC,MAAM,GAG9BiC,EAAA,OAAKE,MAAM,UAAUK,IAAM1D,GAAQZ,KAAKwB,UAAYZ,IACpDmD,EAAA,OACEE,MAAM,UACN3B,SAAU,EACV8B,QAAS,KACPpE,KAAKuE,kBAAkBzC,MAAM,I"}

package/dist/ripple/p-0cd13c7d.system.entry.js.map

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

package/dist/ripple/p-0d7bccf7.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,g as e}from"./p-1c23de4a.js";const i=class{constructor(e){t(this,e);this.wmTagInputRowUpdated=s(this,"wmTagInputRowUpdated",7);this.col1=undefined;this.col2=undefined;this.col3=undefined;this.col4=undefined;this.locked=false}componentDidUpdate(){this.wmTagInputRowUpdated.emit()}get el(){return e(this)}};export{i as wm_tag_input_row};
-//# sourceMappingURL=p-0d7bccf7.entry.js.map

package/dist/ripple/p-0d7bccf7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["TagInputRow","componentDidUpdate","this","wmTagInputRowUpdated","emit"],"sources":["./src/components/wm-tag-input/wm-tag-input-row/wm-tag-input-row.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Prop } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-tag-input-row\",\n})\nexport class TagInputRow {\n  @Element() el!: HTMLWmTagInputRowElement;\n\n  @Prop({ attribute: \"col1\" }) col1?: string;\n  @Prop({ attribute: \"col2\" }) col2?: string;\n  @Prop({ attribute: \"col3\" }) col3?: string;\n  @Prop({ attribute: \"col4\" }) col4?: string;\n  @Prop() locked: boolean = false;\n\n  @Event() wmTagInputRowUpdated!: EventEmitter<void>;\n\n  componentDidUpdate() {\n    this.wmTagInputRowUpdated.emit();\n  }\n}\n"],"mappings":"wDAKaA,EAAW,M,gLAOI,K,CAI1BC,qBACEC,KAAKC,qBAAqBC,M"}

package/dist/ripple/p-0eb7b1b7.system.entry.js.map

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

package/dist/ripple/p-11124a23.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,H as i,g as s}from"./p-1c23de4a.js";import{g as a}from"./p-9b2dfb54.js";import"./p-c6a0f7e5.js";const o="wm-modal-header{-webkit-border-radius:5px 5px 0 0px;-moz-border-radius:5px 5px 0 0px;-ms-border-radius:5px 5px 0 0px;border-radius:5px 5px 0 0px;margin-bottom:-1px}wm-modal-header .wm-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}wm-modal-header .wm-wrapper .title{margin:0;font-weight:600;font-size:1.125rem;color:#4a4a4a;line-height:normal}wm-modal-header .wm-wrapper .title .subtitle{display:block;font-size:0.875rem;font-weight:normal}wm-modal-header .wm-wrapper .title:focus{outline:none}";const r=class{constructor(e){t(this,e);this.heading="";this.subheading=""}componentWillLoad(){this.uid=this.el.parentElement.uid;this.el.parentElement.addEventListener("focusFirstElement",(()=>{this.closeButtonEl.focus()}))}emitParentCloseEvent(){const t=this.el.parentElement;t.emitCloseEvent()}render(){return e(i,null,e("div",{class:"wm-wrapper"},e("div",null,e("h2",{class:"title",id:`wm-modal-heading-text-${this.uid}`},this.heading,e("span",{class:"subtitle"},this.subheading))),e("wm-button",{"button-type":"navigational",icon:"f156",tooltip:a.close,"tooltip-position":"left",id:`wm-modal-close-${this.uid}`,ref:t=>this.closeButtonEl=t,onClick:()=>this.emitParentCloseEvent()})))}get el(){return s(this)}};r.style=o;export{r as wm_modal_header};
-//# sourceMappingURL=p-11124a23.entry.js.map

package/dist/ripple/p-11124a23.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmModalHeaderCss","ModalHeader","componentWillLoad","this","uid","el","parentElement","addEventListener","closeButtonEl","focus","emitParentCloseEvent","parentModal","emitCloseEvent","render","h","Host","class","id","heading","subheading","icon","tooltip","globalMessages","close","ref","onClick"],"sources":["./src/components/wm-modal/wm-modal-header.scss?tag=wm-modal-header","./src/components/wm-modal/wm-modal-header.tsx"],"sourcesContent":["wm-modal-header {\n  @include border-radius(5px 5px 0 0px);\n  //Fix for Chrome sometimes leaving space between header and content, making the overlay show through\n  margin-bottom: -1px;\n\n  .wm-wrapper {\n    @include displayFlex();\n    @include justifyContent(space-between);\n    @include alignItems(center);\n\n    .title {\n      margin: 0;\n      font-weight: 600;\n      font-size: rem-calc(18);\n      color: rgb(74, 74, 74);\n      line-height: normal;\n\n      .subtitle {\n        display: block;\n        font-size: rem-calc(14);\n        font-weight: normal;\n      }\n\n      &:focus {\n        outline: none;\n      }\n    }\n  }\n}\n","import { h, Component, Element, Prop, Host } from \"@stencil/core\";\nimport { globalMessages } from \"../../global/intl\";\n\n@Component({\n  tag: \"wm-modal-header\",\n  styleUrl: \"wm-modal-header.scss\",\n})\nexport class ModalHeader {\n  @Element() el!: HTMLElement;\n  private closeButtonEl!: HTMLElement;\n\n  @Prop() heading?: string = \"\";\n  @Prop() subheading?: string = \"\";\n  private uid!: string;\n\n  componentWillLoad() {\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\n\n    // Trap focus when user tabs past last element in modal\n    // NB @Listen doesn't allow to listen on a specific element (the parent modal)\n    // if we listen to the whole doc each modal on the page reacts to every event\n    this.el.parentElement!.addEventListener(\"focusFirstElement\", () => {\n      this.closeButtonEl.focus();\n    });\n  }\n\n  emitParentCloseEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitCloseEvent();\n  }\n\n  // @Listen(\"click\")\n  // directFocusOnClick() {\n  //   this.headingElement.tabIndex = 0;\n  //   this.headingElement.focus();\n  // }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"wm-wrapper\">\n          <div>\n            <h2\n              class=\"title\"\n              id={`wm-modal-heading-text-${this.uid}`}\n              // ref={el => (this.headingElement = el as HTMLElement)}\n              // onBlur={() => (this.headingElement.tabIndex = -1)}\n            >\n              {this.heading}\n              <span class=\"subtitle\">{this.subheading}</span>\n            </h2>\n          </div>\n          <wm-button\n            button-type=\"navigational\"\n            icon=\"f156\"\n            tooltip={globalMessages.close}\n            tooltip-position=\"left\"\n            id={`wm-modal-close-${this.uid}`}\n            ref={(el) => (this.closeButtonEl = el as HTMLElement)}\n            onClick={() => this.emitParentCloseEvent()}\n          />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"qHAAA,MAAMA,EAAmB,ouB,MCOZC,EAAW,M,sCAIK,G,gBACG,E,CAG9BC,oBACEC,KAAKC,IAAOD,KAAKE,GAAGC,cAAqCF,IAKzDD,KAAKE,GAAGC,cAAeC,iBAAiB,qBAAqB,KAC3DJ,KAAKK,cAAcC,OAAO,G,CAI9BC,uBACE,MAAMC,EAAcR,KAAKE,GAAGC,cAE5BK,EAAYC,gB,CASdC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAM,cACTF,EAAA,WACEA,EAAA,MACEE,MAAM,QACNC,GAAI,yBAAyBd,KAAKC,OAIjCD,KAAKe,QACNJ,EAAA,QAAME,MAAM,YAAYb,KAAKgB,cAGjCL,EAAA,2BACc,eACZM,KAAK,OACLC,QAASC,EAAeC,MAAK,mBACZ,OACjBN,GAAI,kBAAkBd,KAAKC,MAC3BoB,IAAMnB,GAAQF,KAAKK,cAAgBH,EACnCoB,QAAS,IAAMtB,KAAKO,0B"}