@watermarkinsights/ripple 3.25.0 → 3.25.1

package/dist/ripple/p-3869a69e.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmModalCss","Modal","exports","this","bodyFocusListener","_this","redirectFocusFromBody","Object","defineProperty","class_1","prototype","open","isOpen","modalType","isTypeDialog","customElementToFocus","elementToFocus","el","querySelector","concat","uid","console","warn","closeButtonEl","toggleModal","tempOpen","showModal","hideModal","handleClick","ev","target","overlayEl","focusOnOpenEl","focus","closeModalOnEscape","key","stopPropagation","wmModalCloseTriggered","emit","wmCloseTriggered","setAriaDescribedbyOnModal","setElToFocusOnClose","document","body","style","overflow","tabIndex","removeEventListener","addEventListener","window","requestAnimationFrame","focusOnCloseEl","componentWillLoad","id","error","generateId","componentDidLoad","emitCloseEvent","emitPrimaryEvent","wmModalPrimaryTriggered","wmPrimaryTriggered","emitSecondaryEvent","wmModalSecondaryTriggered","wmSecondaryTriggered","modalBody","getElementById","setAttribute","elToFocus","activeElement","tagName","parentElement","checkForActiveElInShadow","render","h","Host","class","tempModalType","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":"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"}

package/dist/ripple/p-4391166c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["privNavigatorButtonCss","PrivNavigatorButton","handleClick","this","buttonActivated","emit","render","altText","tabbingClass","isTabbing","h","expanded","toString","class","onClick","bind"],"sources":["./src/components/wm-navigator/priv-navigator-button/priv-navigator-button.scss?tag=priv-navigator-button&encapsulation=shadow","./src/components/wm-navigator/priv-navigator-button/priv-navigator-button.tsx"],"sourcesContent":[":host,\npriv-navigator-button {\n  * {\n    box-sizing: border-box;\n  }\n\n  .navigator {\n    color: #575195;\n    padding: 0 1.25rem;\n    position: static !important;\n    height: 100%;\n    background: transparent;\n    border: none;\n    min-height: rem-calc(60);\n    cursor: pointer;\n    border-radius: 0; //Edge\n    top: 50%;\n    img {\n      height: rem-calc(36);\n      width: rem-calc(36);\n      vertical-align: middle;\n    }\n\n    &:hover {\n      background: #dcdbde;\n    }\n\n    &:active,\n    &:focus {\n      outline: none;\n    }\n\n    &.user-is-tabbing:focus {\n      @include focus-style;\n    }\n  }\n\n  button:after {\n    vertical-align: middle;\n    height: rem-calc(36);\n    width: rem-calc(36);\n    background-size: 36px;\n    display: inline-block;\n    background-image: url(https://cdn.watermarkinsights.com/images/icons/appswitchericon_purple.svg);\n    content: \"\";\n  }\n}\n","import { Component, Element, h, Prop, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: \"priv-navigator-button\",\n  styleUrl: \"priv-navigator-button.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class PrivNavigatorButton {\n  @Element() el!: any;\n  @Prop({ mutable: true }) expanded: boolean = false;\n  @Prop() altText: string = \"\";\n  @Prop({ mutable: true }) isTabbing: boolean = false;\n  // @Prop({ attribute: \"mode\", reflect: true, mutable: true })\n  // mode: string = \"planning\";\n  @Event() buttonActivated!: EventEmitter;\n\n  handleClick() {\n    this.buttonActivated.emit();\n  }\n\n  render() {\n    const { handleClick, altText } = this;\n    const tabbingClass = this.isTabbing ? \"user-is-tabbing\" : \"\";\n\n    return (\n      <button\n        aria-expanded={this.expanded.toString()}\n        class={`navigator ${tabbingClass}`}\n        onClick={handleClick.bind(this)}\n        aria-label={altText}\n      ></button>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAyB,y5C,MCOlBC,EAAmB,M,wFAEe,M,aACnB,G,eACoB,K,CAK9CC,cACEC,KAAKC,gBAAgBC,M,CAGvBC,SACE,MAAMJ,YAAEA,EAAWK,QAAEA,GAAYJ,KACjC,MAAMK,EAAeL,KAAKM,UAAY,kBAAoB,GAE1D,OACEC,EAAA,0BACiBP,KAAKQ,SAASC,WAC7BC,MAAO,aAAaL,IACpBM,QAASZ,EAAYa,KAAKZ,MAAK,aACnBI,G"}

package/dist/ripple/p-43be123d.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,f as i,h as o,H as s,g as n}from"./p-1c23de4a.js";import{d as r,i as l,s as a,j as d}from"./p-c6a0f7e5.js";const p=':host,wm-file{display:block;width:100%}.file-wrapper{font-size:0.875rem;position:relative;list-style:none}.file-wrapper .file{min-width:300px;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;height:3.5rem;padding:0 1.25rem;position:relative;background:#f4f4f4;border:1px solid #6b6b6b;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}.file-wrapper .file .filename{white-space:nowrap}.file-wrapper .file .left-group{overflow:hidden}.file-wrapper .file .right-group{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-left:5rem;gap:1rem}.file-wrapper .file .right-group.condensed{padding-left:2.5rem}.file-wrapper .file .right-group .file-controls{display:-ms-flexbox;display:flex;gap:1rem}.file-wrapper .file .right-group .file-info{white-space:nowrap}.file-wrapper .file.--error{border:1px solid #c0392b;background-color:#f5ebea;height:3.75rem}.file-wrapper.checked .file: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:"\\f133";position:absolute;right:-44px;color:#088000;font-size:28px;line-height:1}.name-wrapper{overflow:hidden}.progress{position:absolute;left:0;top:0;right:0;height:8px}.error-message{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem}.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}.ch-measure{width:1ch !important;visibility:hidden}';const c=class{constructor(o){e(this,o);this.wmIntFilePreviewed=t(this,"wmIntFilePreviewed",7);this.wmIntFileDownloaded=t(this,"wmIntFileDownloaded",7);this.wmIntFileDeleted=t(this,"wmIntFileDeleted",7);this.wmFileClearErrorClicked=t(this,"wmFileClearErrorClicked",7);this.isWithinLegacyUploader=false;this.debouncedResize=r((()=>{this.isCondensed=this.el.clientWidth<500;i(this.el)}),50);this.file=undefined;this.showInfo="time";this.errorMessage=undefined;this.isCondensed=false}get fileData(){let e=this.file?JSON.parse(this.file):null;if(e&&e.progress&&typeof e.progress==="string"&&e.progress.match(/^[0-9]+$/)){e.progress=parseInt(e.progress.toString())}return e}get isUploading(){return this.fileData&&this.fileData.hasOwnProperty("progress")&&this.fileData.progress<100}get singleCharacterWidth(){return this.el.shadowRoot.querySelector(".ch-measure").clientWidth}get previewButtonTooltip(){return l.formatMessage({id:"file.previewButtonTooltip",defaultMessage:"Preview",description:"Tooltip of a button that triggers a file to be previewed"})}get downloadButtonTooltip(){return l.formatMessage({id:"file.downloadButtonTooltip",defaultMessage:"Download",description:"Tooltip of a button that triggers a file to be downloaded"})}get deleteButtonTooltip(){return l.formatMessage({id:"file.deleteButtonTooltip",defaultMessage:"Delete",description:"Tooltip of a button that triggers a file to be deleted"})}get previewActionMessage(){return l.formatMessage({id:"file.previewAction",defaultMessage:"Preview File",description:"Label of a button that triggers a file to be previewed"})}get downloadActionMessage(){return l.formatMessage({id:"file.downloadAction",defaultMessage:"Download File",description:"Label of a button that triggers a file to be downloaded"})}get deleteActionMessage(){return l.formatMessage({id:"file.deleteAction",defaultMessage:"Delete File",description:"Label of a button that triggers a file to be delete"})}get actionMenuLabel(){return l.formatMessage({id:"file.actionMenuLabel",defaultMessage:"Actions",description:"Label of a button that opens a menu of file actions"})}get clearButtonText(){return l.formatMessage({id:"file.clearErrorText",defaultMessage:"Clear",description:"Text for a button used to clear an error"})}generateClearButtonLabel(e){return l.formatMessage({id:"file.clearErrorLabel",defaultMessage:"Clear {fileName} error",description:"Label for a button used to clear an error, including filename"},{fileName:e})}componentWillLoad(){const e=this.el.getRootNode().host;if(e&&e.nodeName==="WM-UPLOADER"){if(e.type||e.uploaderType){this.isWithinLegacyUploader=true}}const t=new ResizeObserver((()=>this.debouncedResize()));t.observe(this.el)}componentDidRender(){this.truncateFileName(this.el.shadowRoot.querySelector(".file"))}previewFile(e){this.wmIntFilePreviewed.emit(e.id)}downloadFile(e){this.wmIntFileDownloaded.emit(e.id)}deleteFile(e){this.wmIntFileDeleted.emit(e.id)}truncateFileName(e){const t=e.querySelector(".left-group");const i=t.getBoundingClientRect().left;const o=e.querySelector(".right-group");const s=o?o.getBoundingClientRect().left:e.getBoundingClientRect().right-20;const n=e.querySelector(".filename");const r=s-i;let l=n.dataset.filename;const a=r>l.length*this.singleCharacterWidth;if(!a){const e=l.slice(l.lastIndexOf("."));const t=Math.floor(r/this.singleCharacterWidth);const i=3+3+e.length;let o=Math.max(2,t-i);const s=l.slice(0,o);const n=l.slice(l.indexOf(e)-3,l.length);l=`${s.trim()}...${n.trim()}`}n.textContent=l}handleFilenameMouseEnter(e,t){if(e.target.textContent.includes("...")){a("bottom",e.target,t)}}renderFileName(e,t){return o("div",{class:"left-group"},o("div",{class:"name-wrapper"},o("span",{class:"sr-only"},e),o("span",{"aria-hidden":"true",class:"filename","data-filename":e,onMouseEnter:t=>this.handleFilenameMouseEnter(t,e),onMouseLeave:()=>d()}),t&&o("span",{class:"sr-only"},"uploading"),o("div",{class:"ch-measure"})))}renderFileInfo(e,t){let i="";if(t==="time"&&e.lastUpdated){i=e.lastUpdated}else if(t==="size"&&e.size){i=e.size}return o("div",{class:"file-info"},i)}renderActionMenu(e){const t="download delete";const i=e.fileActions||t;const s=o("wm-menuitem",{icon:"f208",onClick:()=>this.previewFile(e)},this.previewActionMessage);const n=o("wm-menuitem",{icon:"f1da",onClick:()=>this.downloadFile(e)},this.downloadActionMessage);const r=o("wm-menuitem",{icon:"f1c0",onClick:()=>this.deleteFile(e)},this.deleteActionMessage);return o("wm-action-menu",{"action-menu-type":"icon",tooltip:this.actionMenuLabel,"tooltip-position":"bottom","label-for-identical-buttons":`${e.name} ${this.actionMenuLabel}`},i.includes("preview")&&s,i.includes("download")&&n,i.includes("delete")&&r)}renderFileActionButtons(e){const t="download delete";const i=e.fileActions||t;const s=o("wm-button",{class:"preview-button","button-type":"icononly",tooltip:this.previewButtonTooltip,"tooltip-position":"bottom","label-for-identical-buttons":`preview ${e.name}`,icon:"f208",onClick:()=>this.previewFile(e)});const n=o("wm-button",{class:"download-button","button-type":"icononly",tooltip:this.downloadButtonTooltip,"tooltip-position":"bottom","label-for-identical-buttons":`download ${e.name}`,icon:"f1da",onClick:()=>this.downloadFile(e)});const r=o("wm-button",{class:"delete-button","button-type":"icononly",tooltip:this.deleteButtonTooltip,"tooltip-position":"bottom","label-for-identical-buttons":`delete ${e.name}`,icon:"f1c0",onClick:()=>this.deleteFile(e)});return o("div",{class:"file-controls"},i.includes("preview")&&s,i.includes("download")&&n,i.includes("delete")&&r)}renderFileInProgress(e){const t=e.type?`${e.name}.${e.type}`:e.name;return o("div",{class:"file-wrapper"},o("div",{class:"file --progress"},o("div",{class:"progress",style:{background:`linear-gradient(to right, rgba(67, 126, 142, 1) ${e.progress}%, transparent ${e.progress}%)`}}),this.renderFileName(t,this.isUploading)))}renderFileControls(e){const t=e.fileActions&&e.fileActions.split(" ").length===1;const i=this.isCondensed&&!t;return i?this.renderActionMenu(e):this.renderFileActionButtons(e)}renderFile(e){const t=e.type?`${e.name}.${e.type}`:e.name;const i=!this.isWithinLegacyUploader&&e.progress===100;return o("div",{class:`file-wrapper ${i?"checked":""}`},o("div",{class:`file ${this.errorMessage?"--error":""}`},this.renderFileName(t,this.isUploading),!this.errorMessage&&o("div",{class:`right-group ${this.isCondensed?"condensed":""}`},this.showInfo!=="none"&&this.renderFileInfo(e,this.showInfo),e.fileActions!==""&&this.renderFileControls(e)),this.errorMessage&&o("wm-button",{"permanently-delete":true,"button-type":"textonly","label-for-identical-buttons":this.generateClearButtonLabel(e.name),onClick:()=>this.wmFileClearErrorClicked.emit({name:e.name})},this.clearButtonText)),this.errorMessage&&o("div",{class:"error-message"},this.errorMessage))}render(){return o(s,{role:"listitem"},this.isUploading?this.renderFileInProgress(this.fileData):this.renderFile(this.fileData))}static get delegatesFocus(){return true}get el(){return n(this)}};c.style=p;export{c as wm_file};
-//# sourceMappingURL=p-43be123d.entry.js.map

package/dist/ripple/p-43be123d.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmFileCss","File","this","isWithinLegacyUploader","debouncedResize","debounce","isCondensed","el","clientWidth","forceUpdate","fileData","data","file","JSON","parse","progress","match","parseInt","toString","isUploading","hasOwnProperty","singleCharacterWidth","shadowRoot","querySelector","previewButtonTooltip","intl","formatMessage","id","defaultMessage","description","downloadButtonTooltip","deleteButtonTooltip","previewActionMessage","downloadActionMessage","deleteActionMessage","actionMenuLabel","clearButtonText","generateClearButtonLabel","filename","fileName","componentWillLoad","shadowRootHost","getRootNode","host","nodeName","type","uploaderType","resizeObserver","ResizeObserver","observe","componentDidRender","truncateFileName","previewFile","wmIntFilePreviewed","emit","downloadFile","wmIntFileDownloaded","deleteFile","wmIntFileDeleted","leftGroup","leftBoundary","getBoundingClientRect","left","rightGroup","rightBoundary","right","filenameEl","availableSpace","dataset","canFitText","length","extension","slice","lastIndexOf","numFittingCharacters","Math","floor","postEllipsesLength","preEllipsesLength","max","preEllipsesText","postEllipsesText","indexOf","trim","textContent","handleFilenameMouseEnter","ev","target","includes","showTooltip","renderFileName","h","class","onMouseEnter","onMouseLeave","hideTooltip","renderFileInfo","item","showInfo","displayedInfo","lastUpdated","size","renderActionMenu","defaultFileActions","availableActions","fileActions","previewItem","icon","onClick","downloadItem","deleteItem","tooltip","name","renderFileActionButtons","previewButton","downloadButton","deleteButton","renderFileInProgress","style","background","renderFileControls","hasSingleFileAction","split","showActionMenu","renderFile","showCheckmark","errorMessage","wmFileClearErrorClicked","render","Host","role"],"sources":["./src/components/wm-file/wm-file.scss?tag=wm-file&encapsulation=shadow","./src/components/wm-file/wm-file.tsx"],"sourcesContent":[":host,\nwm-file {\n  display: block;\n  width: 100%;\n}\n.file-wrapper {\n  font-size: rem-calc(14);\n  position: relative;\n  list-style: none;\n\n  .file {\n    min-width: 300px;\n    @include border-radius(3px);\n    height: rem-calc(56);\n    padding: 0 rem-calc(20);\n    position: relative; // for progress bar\n    background: $background;\n    border: 1px solid rgb(107, 107, 107);\n\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    .filename {\n      white-space: nowrap;\n    }\n\n    .left-group {\n      overflow: hidden;\n    }\n\n    .right-group {\n      display: flex;\n      align-items: center;\n      padding-left: rem-calc(80);\n      gap: rem-calc(16);\n\n      &.condensed {\n        padding-left: rem-calc(40);\n      }\n\n      .file-controls {\n        display: flex;\n        gap: rem-calc(16);\n      }\n      .file-info {\n        white-space: nowrap;\n      }\n    }\n\n    &.--error {\n      border: 1px solid $error-color;\n      background-color: #f5ebea;\n      height: rem-calc(60);\n    }\n  }\n\n  &.checked {\n    .file:after {\n      @include mdi-icon;\n      content: \"\\f133\";\n      position: absolute;\n      right: calc(-16px + -28px);\n      color: $uploader-checkmark-background;\n      font-size: 28px;\n      line-height: 1;\n    }\n  }\n}\n\n.name-wrapper {\n  overflow: hidden;\n}\n\n.progress {\n  position: absolute;\n  left: 0;\n  top: 0;\n  right: 0;\n  height: 8px;\n}\n\n.error-message {\n  @include errorMessage;\n}\n\n.sr-only {\n  @include srOnly;\n}\n\n.ch-measure {\n  // used to get the measurement of a single character, for truncation calculations\n  width: 1ch !important;\n  visibility: hidden;\n}\n","import { h, Component, Element, Event, EventEmitter, Prop, State, Host, forceUpdate } from \"@stencil/core\";\nimport { debounce, hideTooltip, intl, showTooltip } from \"../../global/functions\";\nimport { UploadedFile } from \"../../global/interfaces\";\n\n@Component({\n  tag: \"wm-file\",\n  styleUrl: \"wm-file.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class File {\n  @Element() el!: HTMLWmFileElement;\n  @Prop() file?: string;\n  @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\n  @Prop() errorMessage?: string;\n  @State() isCondensed: boolean = false;\n  @Event() wmIntFilePreviewed!: EventEmitter<string>;\n  @Event() wmIntFileDownloaded!: EventEmitter<string>;\n  @Event() wmIntFileDeleted!: EventEmitter<string>;\n  @Event() wmFileClearErrorClicked!: EventEmitter; // undocumented event, for communication with wm-uploader\n  // the file component is used within wm-uploader, which still includes legacy types 1 and 2\n  // some new features are not included in these legacy types, and must use the below in conditions\n  private isWithinLegacyUploader: boolean = false;\n\n  get fileData(): UploadedFile {\n    let data = this.file ? JSON.parse(this.file) : null;\n\n    // sometimes JSON numbers can be received as strings, make sure progress is always a number\n    if (data && data.progress && typeof data.progress === \"string\" && data.progress.match(/^[0-9]+$/)) {\n      data.progress = parseInt(data.progress.toString());\n    }\n    return data;\n  }\n\n  get isUploading(): boolean {\n    return this.fileData && this.fileData.hasOwnProperty(\"progress\") && this.fileData.progress! < 100;\n  }\n\n  get singleCharacterWidth() {\n    return this.el.shadowRoot!.querySelector(\".ch-measure\")!.clientWidth;\n  }\n\n  get previewButtonTooltip() {\n    return intl.formatMessage({\n      id: \"file.previewButtonTooltip\",\n      defaultMessage: \"Preview\",\n      description: \"Tooltip of a button that triggers a file to be previewed\",\n    });\n  }\n\n  get downloadButtonTooltip() {\n    return intl.formatMessage({\n      id: \"file.downloadButtonTooltip\",\n      defaultMessage: \"Download\",\n      description: \"Tooltip of a button that triggers a file to be downloaded\",\n    });\n  }\n\n  get deleteButtonTooltip() {\n    return intl.formatMessage({\n      id: \"file.deleteButtonTooltip\",\n      defaultMessage: \"Delete\",\n      description: \"Tooltip of a button that triggers a file to be deleted\",\n    });\n  }\n\n  get previewActionMessage() {\n    return intl.formatMessage({\n      id: \"file.previewAction\",\n      defaultMessage: \"Preview File\",\n      description: \"Label of a button that triggers a file to be previewed\",\n    });\n  }\n\n  get downloadActionMessage() {\n    return intl.formatMessage({\n      id: \"file.downloadAction\",\n      defaultMessage: \"Download File\",\n      description: \"Label of a button that triggers a file to be downloaded\",\n    });\n  }\n\n  get deleteActionMessage() {\n    return intl.formatMessage({\n      id: \"file.deleteAction\",\n      defaultMessage: \"Delete File\",\n      description: \"Label of a button that triggers a file to be delete\",\n    });\n  }\n\n  get actionMenuLabel() {\n    return intl.formatMessage({\n      id: \"file.actionMenuLabel\",\n      defaultMessage: \"Actions\",\n      description: \"Label of a button that opens a menu of file actions\",\n    });\n  }\n\n  get clearButtonText() {\n    return intl.formatMessage({\n      id: \"file.clearErrorText\",\n      defaultMessage: \"Clear\",\n      description: \"Text for a button used to clear an error\",\n    });\n  }\n\n  generateClearButtonLabel(filename: string) {\n    return intl.formatMessage(\n      {\n        id: \"file.clearErrorLabel\",\n        defaultMessage: \"Clear {fileName} error\",\n        description: \"Label for a button used to clear an error, including filename\",\n      },\n      { fileName: filename }\n    );\n  }\n\n  componentWillLoad() {\n    const shadowRootHost = (this.el.getRootNode() as ShadowRoot).host;\n\n    if (shadowRootHost && shadowRootHost.nodeName === \"WM-UPLOADER\") {\n      if ((shadowRootHost as HTMLWmUploaderElement).type || (shadowRootHost as HTMLWmUploaderElement).uploaderType) {\n        this.isWithinLegacyUploader = true;\n      }\n    }\n\n    // rerender on resize in case layout needs to change\n    const resizeObserver = new ResizeObserver(() => this.debouncedResize());\n    resizeObserver.observe(this.el);\n  }\n\n  componentDidRender() {\n    this.truncateFileName(this.el.shadowRoot!.querySelector(\".file\")!);\n  }\n\n  debouncedResize = debounce(() => {\n    this.isCondensed = this.el.clientWidth < 500;\n    // rerender to show filename truncation changes\n    forceUpdate(this.el);\n  }, 50);\n\n  previewFile(file: UploadedFile) {\n    this.wmIntFilePreviewed.emit(file.id);\n  }\n\n  downloadFile(file: UploadedFile) {\n    this.wmIntFileDownloaded.emit(file.id);\n  }\n\n  deleteFile(file: UploadedFile) {\n    this.wmIntFileDeleted.emit(file.id);\n  }\n\n  truncateFileName(file: Element) {\n    const leftGroup = file.querySelector(\".left-group\");\n    const leftBoundary = leftGroup!.getBoundingClientRect().left;\n    const rightGroup = file.querySelector(\".right-group\");\n    const rightBoundary = rightGroup\n      ? rightGroup.getBoundingClientRect().left\n      : file.getBoundingClientRect().right - 20;\n    const filenameEl = file.querySelector(\".filename\") as HTMLElement;\n    const availableSpace = rightBoundary - leftBoundary;\n\n    let filename = filenameEl.dataset.filename!;\n    const canFitText = availableSpace > filename.length * this.singleCharacterWidth;\n\n    if (!canFitText) {\n      const extension = filename.slice(filename.lastIndexOf(\".\"));\n      const numFittingCharacters = Math.floor(availableSpace / this.singleCharacterWidth);\n\n      // three ellipses, three constant characters, extension\n      const postEllipsesLength = 3 + 3 + extension.length;\n      let preEllipsesLength = Math.max(2, numFittingCharacters - postEllipsesLength);\n      const preEllipsesText = filename.slice(0, preEllipsesLength);\n      const postEllipsesText = filename.slice(filename.indexOf(extension) - 3, filename.length);\n      filename = `${preEllipsesText.trim()}...${postEllipsesText.trim()}`;\n    }\n\n    filenameEl.textContent = filename;\n  }\n\n  handleFilenameMouseEnter(ev: MouseEvent, filename: string) {\n    // only show tooltip if file name is being truncated (has ellipses)\n    if ((ev.target as HTMLElement).textContent!.includes(\"...\")) {\n      showTooltip(\"bottom\", ev.target as HTMLElement, filename);\n    }\n  }\n\n  renderFileName(filename: string, isUploading: boolean) {\n    return (\n      <div class=\"left-group\">\n        <div class=\"name-wrapper\">\n          <span class=\"sr-only\">{filename}</span>\n          <span\n            aria-hidden=\"true\"\n            class=\"filename\"\n            data-filename={filename}\n            onMouseEnter={(ev) => this.handleFilenameMouseEnter(ev, filename)}\n            onMouseLeave={() => hideTooltip()}\n          ></span>\n          {isUploading && <span class=\"sr-only\">uploading</span>}\n          <div class=\"ch-measure\"></div>\n        </div>\n      </div>\n    );\n  }\n\n  renderFileInfo(item: UploadedFile, showInfo: string) {\n    let displayedInfo = \"\";\n    if (showInfo === \"time\" && item.lastUpdated) {\n      displayedInfo = item.lastUpdated;\n    } else if (showInfo === \"size\" && item.size) {\n      displayedInfo = item.size;\n    }\n\n    return <div class=\"file-info\">{displayedInfo}</div>;\n  }\n\n  renderActionMenu(item: UploadedFile) {\n    const defaultFileActions = \"download delete\";\n    const availableActions = item.fileActions || defaultFileActions;\n    const previewItem = (\n      <wm-menuitem icon=\"f208\" onClick={() => this.previewFile(item)}>\n        {this.previewActionMessage}\n      </wm-menuitem>\n    );\n    const downloadItem = (\n      <wm-menuitem icon=\"f1da\" onClick={() => this.downloadFile(item)}>\n        {this.downloadActionMessage}\n      </wm-menuitem>\n    );\n    const deleteItem = (\n      <wm-menuitem icon=\"f1c0\" onClick={() => this.deleteFile(item)}>\n        {this.deleteActionMessage}\n      </wm-menuitem>\n    );\n    return (\n      <wm-action-menu\n        action-menu-type=\"icon\"\n        tooltip={this.actionMenuLabel}\n        tooltip-position=\"bottom\"\n        label-for-identical-buttons={`${item.name} ${this.actionMenuLabel}`}\n      >\n        {availableActions.includes(\"preview\") && previewItem}\n        {availableActions.includes(\"download\") && downloadItem}\n        {availableActions.includes(\"delete\") && deleteItem}\n      </wm-action-menu>\n    );\n  }\n\n  renderFileActionButtons(item: UploadedFile) {\n    const defaultFileActions = \"download delete\";\n    const availableActions = item.fileActions || defaultFileActions;\n\n    const previewButton = (\n      <wm-button\n        class=\"preview-button\"\n        button-type=\"icononly\"\n        tooltip={this.previewButtonTooltip}\n        tooltip-position=\"bottom\"\n        label-for-identical-buttons={`preview ${item.name}`}\n        icon=\"f208\"\n        onClick={() => this.previewFile(item)}\n      ></wm-button>\n    );\n    const downloadButton = (\n      <wm-button\n        class=\"download-button\"\n        button-type=\"icononly\"\n        tooltip={this.downloadButtonTooltip}\n        tooltip-position=\"bottom\"\n        label-for-identical-buttons={`download ${item.name}`}\n        icon=\"f1da\"\n        onClick={() => this.downloadFile(item)}\n      ></wm-button>\n    );\n    const deleteButton = (\n      <wm-button\n        class=\"delete-button\"\n        button-type=\"icononly\"\n        tooltip={this.deleteButtonTooltip}\n        tooltip-position=\"bottom\"\n        label-for-identical-buttons={`delete ${item.name}`}\n        icon=\"f1c0\"\n        onClick={() => this.deleteFile(item)}\n      ></wm-button>\n    );\n\n    return (\n      <div class=\"file-controls\">\n        {availableActions.includes(\"preview\") && previewButton}\n        {availableActions.includes(\"download\") && downloadButton}\n        {availableActions.includes(\"delete\") && deleteButton}\n      </div>\n    );\n  }\n\n  renderFileInProgress(item: UploadedFile) {\n    const filename = item.type ? `${item.name}.${item.type}` : item.name;\n    return (\n      <div class=\"file-wrapper\">\n        <div class=\"file --progress\">\n          <div\n            class=\"progress\"\n            style={{\n              background: `linear-gradient(to right, rgba(67, 126, 142, 1) ${item.progress}%, transparent ${item.progress}%)`,\n            }}\n          ></div>\n          {this.renderFileName(filename, this.isUploading)}\n        </div>\n      </div>\n    );\n  }\n\n  renderFileControls(item: UploadedFile) {\n    const hasSingleFileAction = item.fileActions && item.fileActions.split(\" \").length === 1;\n    const showActionMenu = this.isCondensed && !hasSingleFileAction;\n\n    return showActionMenu ? this.renderActionMenu(item) : this.renderFileActionButtons(item);\n  }\n\n  renderFile(item: UploadedFile) {\n    const filename = item.type ? `${item.name}.${item.type}` : item.name;\n    const showCheckmark = !this.isWithinLegacyUploader && item.progress === 100;\n\n    return (\n      <div class={`file-wrapper ${showCheckmark ? \"checked\" : \"\"}`}>\n        <div class={`file ${this.errorMessage ? \"--error\" : \"\"}`}>\n          {this.renderFileName(filename, this.isUploading)}\n          {!this.errorMessage && (\n            <div class={`right-group ${this.isCondensed ? \"condensed\" : \"\"}`}>\n              {this.showInfo !== \"none\" && this.renderFileInfo(item, this.showInfo)}\n              {item.fileActions !== \"\" && this.renderFileControls(item)}\n            </div>\n          )}\n          {this.errorMessage && (\n            <wm-button\n              permanently-delete\n              button-type=\"textonly\"\n              label-for-identical-buttons={this.generateClearButtonLabel(item.name)}\n              onClick={() => this.wmFileClearErrorClicked.emit({ name: item.name })}\n            >\n              {this.clearButtonText}\n            </wm-button>\n          )}\n        </div>\n        {this.errorMessage && <div class=\"error-message\">{this.errorMessage}</div>}\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        {this.isUploading ? this.renderFileInProgress(this.fileData) : this.renderFile(this.fileData)}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-4a014591.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,g as i}from"./p-1c23de4a.js";const o="wm-modal-footer{-webkit-border-radius:0px 0px 5px 5px;-moz-border-radius:0px 0px 5px 5px;-ms-border-radius:0px 0px 5px 5px;border-radius:0px 0px 5px 5px;margin-top:-1px}wm-modal-footer .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}@media only screen and (max-width: 650px){wm-modal-footer .wm-wrapper.footer-text{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}wm-modal-footer .wm-wrapper wm-button+wm-button{margin-left:1rem}wm-modal-footer .wm-wrapper .wm-info{font-size:0.875rem;font-style:italic}@media only screen and (max-width: 650px){wm-modal-footer .wm-wrapper .wm-info{padding-bottom:0.625rem}}wm-modal-footer .wm-wrapper .wm-info:focus{outline:none}";const s=class{constructor(e){t(this,e);this.secondaryText="";this.primaryText="";this.infoText="";this.primaryActionDisabled=false;this.deleteStyle=false}componentWillLoad(){this.uid=this.el.parentElement.uid;this.el.parentElement.addEventListener("focusLastElement",(()=>{this.lastElement.focus()}))}emitParentPrimaryEvent(){const t=this.el.parentElement;t.emitPrimaryEvent()}emitParentSecondaryEvent(){const t=this.el.parentElement;t.emitSecondaryEvent()}render(){return e("div",{class:`wm-wrapper ${this.infoText?" footer-text":""}`},e("div",{class:"wm-info","aria-live":"polite"},this.infoText),e("div",{class:"wm-button-collection"},this.secondaryText&&e("wm-button",{onClick:()=>this.emitParentSecondaryEvent(),id:`wm-secondary-${this.uid}`,ref:t=>this.primaryActionDisabled?this.lastElement=t:null},this.secondaryText),e("wm-button",{"button-type":this.deleteStyle?"secondary":"primary","permanently-delete":this.deleteStyle,onClick:()=>this.emitParentPrimaryEvent(),disabled:this.primaryActionDisabled,id:`wm-primary-${this.uid}`,ref:t=>!this.primaryActionDisabled?this.lastElement=t:null},this.primaryText)))}get el(){return i(this)}};s.style=o;export{s as wm_modal_footer};
-//# sourceMappingURL=p-4a014591.entry.js.map

package/dist/ripple/p-4a014591.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmModalFooterCss","ModalFooter","componentWillLoad","this","uid","el","parentElement","addEventListener","lastElement","focus","emitParentPrimaryEvent","parentModal","emitPrimaryEvent","emitParentSecondaryEvent","emitSecondaryEvent","render","h","class","infoText","secondaryText","onClick","id","ref","primaryActionDisabled","deleteStyle","disabled","primaryText"],"sources":["./src/components/wm-modal/wm-modal-footer.scss?tag=wm-modal-footer","./src/components/wm-modal/wm-modal-footer.tsx"],"sourcesContent":["wm-modal-footer {\n  @include border-radius(0px 0px 5px 5px);\n  //Fix for Chrome sometimes leaving space between footer and content, making the overlay show through\n  margin-top: -1px;\n\n  .wm-wrapper {\n    @include displayFlex();\n    @include justifyContent(space-between);\n    @include alignItems(center);\n\n    &.footer-text {\n      @media only screen and (max-width: 650px) {\n        flex-direction: column;\n        align-items: flex-start;\n      }\n    }\n\n    wm-button + wm-button {\n      margin-left: rem-calc(16);\n      // @media only screen and (max-width: 768px) {\n      //   margin-right: 15px;\n      // }\n    }\n\n    .wm-info {\n      font-size: rem-calc(14);\n      font-style: italic;\n      @media only screen and (max-width: 650px) {\n        padding-bottom: rem-calc(10);\n      }\n\n      &:focus {\n        outline: none;\n      }\n    }\n  }\n}\n","import { h, Component, Element, Prop } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-modal-footer\",\n  styleUrl: \"wm-modal-footer.scss\",\n})\nexport class ModalFooter {\n  @Element() el!: HTMLElement;\n\n  @Prop() secondaryText?: string = \"\";\n  @Prop() primaryText?: string = \"\";\n  @Prop() infoText?: string = \"\";\n  @Prop() primaryActionDisabled: boolean = false;\n  @Prop() deleteStyle: boolean = false;\n  private uid!: string;\n  private lastElement!: HTMLElement;\n\n  componentWillLoad() {\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\n\n    // Trap focus when user shift+tabs past first 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(\"focusLastElement\", () => {\n      this.lastElement.focus();\n    });\n  }\n\n  emitParentPrimaryEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitPrimaryEvent();\n  }\n\n  emitParentSecondaryEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitSecondaryEvent();\n  }\n\n  render() {\n    return (\n      <div class={`wm-wrapper ${this.infoText ? \" footer-text\" : \"\"}`}>\n        <div class=\"wm-info\" aria-live=\"polite\">{this.infoText}</div>\n        <div class=\"wm-button-collection\">\n          {this.secondaryText && (\n            <wm-button\n              onClick={() => this.emitParentSecondaryEvent()}\n              id={`wm-secondary-${this.uid}`}\n              ref={(el) => (this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\n            >\n              {this.secondaryText}\n            </wm-button>\n          )}\n          <wm-button\n            button-type={this.deleteStyle ? \"secondary\" : \"primary\"}\n            permanently-delete={this.deleteStyle}\n            onClick={() => this.emitParentPrimaryEvent()}\n            disabled={this.primaryActionDisabled}\n            id={`wm-primary-${this.uid}`}\n            ref={(el) => (!this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\n          >\n            {this.primaryText}\n          </wm-button>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAmB,47B,MCMZC,EAAW,M,4CAGW,G,iBACF,G,cACH,G,2BACa,M,iBACV,K,CAI/BC,oBACEC,KAAKC,IAAOD,KAAKE,GAAGC,cAAqCF,IAKzDD,KAAKE,GAAGC,cAAeC,iBAAiB,oBAAoB,KAC1DJ,KAAKK,YAAYC,OAAO,G,CAI5BC,yBACE,MAAMC,EAAcR,KAAKE,GAAGC,cAE5BK,EAAYC,kB,CAGdC,2BACE,MAAMF,EAAcR,KAAKE,GAAGC,cAE5BK,EAAYG,oB,CAGdC,SACE,OACEC,EAAA,OAAKC,MAAO,cAAcd,KAAKe,SAAW,eAAiB,MACzDF,EAAA,OAAKC,MAAM,UAAS,YAAW,UAAUd,KAAKe,UAC9CF,EAAA,OAAKC,MAAM,wBACRd,KAAKgB,eACJH,EAAA,aACEI,QAAS,IAAMjB,KAAKU,2BACpBQ,GAAI,gBAAgBlB,KAAKC,MACzBkB,IAAMjB,GAAQF,KAAKoB,sBAAyBpB,KAAKK,YAAcH,EAAqB,MAEnFF,KAAKgB,eAGVH,EAAA,2BACeb,KAAKqB,YAAc,YAAc,UAAS,qBACnCrB,KAAKqB,YACzBJ,QAAS,IAAMjB,KAAKO,yBACpBe,SAAUtB,KAAKoB,sBACfF,GAAI,cAAclB,KAAKC,MACvBkB,IAAMjB,IAASF,KAAKoB,sBAAyBpB,KAAKK,YAAcH,EAAqB,MAEpFF,KAAKuB,c"}

package/dist/ripple/p-4a06d0a9.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmNetworkUploaderCss","NetworkUploader","exports","this","inputId","generateId","class_1","prototype","toggleTabbingOn","isTabbing","toggleTabbingOff","handleUploadProgress","ev","_this","inProgressList","map","i","name","detail","file_name","progress","forceUpdate","el","numFilesInProgress","srProgress","total_1","setInterval","aggregate","reduce","avg","item","liveRegion","innerHTML","intl","formatMessage","id","defaultMessage","percentage","Math","floor","handleFinishedSnack","snackbar","filter","n","setMaxSize","maxSize","uploadNotifications","newNum","oldNum","setTimeout","notif","message","clearInterval","num","emitFileListEvent","wmNetworkUploaderFilesChanged","emit","fileList","formatDate","isoDate","locale","timezone","timestamp","Date","parse","match","Intl","getCanonicalLocales","_a","date","year","getFullYear","month","getMonth","substr","day","getDate","time","toLocaleTimeString","timeZone","hour","minute","concat","isValidSize","size","isDuplicate","find","f","isEmpty","length","errorList","Object","defineProperty","isMax","maxFiles","errMessage","description","purgeProgressList","getExistingFiles","getRequest","getPath","then","reply","sortBy","sort","a","b","localeCompare","catch","errStatus","console","error","clearErrors","handleFiles","files","Array","from","target","validTypes","fileTypes","split","join","file","hasValidType","push","uploadFile","value","requestUploadPath","toString","__awaiter","assData","JSON","associatedData","fileInfo","assign","mime_type","type","file_path","path","document_uuid","guid","onProgress","lengthComputable","total","loaded","event","CustomEvent","dispatchEvent","putRequest","url","_b","sent","postRequest","uploadPath","err","globalMessages","genericError","downloadFile","uuid","payload","file_uuid","requestDownloadPath","window","location","deleteFile","fileName","link","deleteRequest","deletePath","componentWillLoad","Error","buttonText","emptyStateText","componentDidLoad","document","body","classList","contains","uploadButtonOnClick","isDisabled","preventDefault","errMsg_1","Promise","resolve","renderUploadSvg","h","class","width","height","viewBox","transform","fill","d","renderIcon","rotate","icon","String","fromCodePoint","parseInt","renderNotif","renderUploadButton","classes","multiple","onClick","onChange","e","htmlFor","renderWithItems","renderErrorList","renderInProgressList","renderFileList","renderEmptyState","srMessage","acc","style","background","renderFile","updated_at","DateTimeFormat","resolvedOptions","tooltip","render","Host","notifications","stringify","ref"],"sources":["src/components/wm-uploader/wm-network-uploader/wm-network-uploader.scss?tag=wm-network-uploader&encapsulation=shadow","src/components/wm-uploader/wm-network-uploader/wm-network-uploader.tsx"],"sourcesContent":[":host,\nwm-network-uploader {\n  width: 100%;\n  position: relative;\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-network-uploader * {\n  box-sizing: border-box;\n}\n\n.sr-only {\n  @include srOnly;\n}\n\n.header {\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  flex-wrap: wrap;\n\n  .notif-wrapper {\n    align-items: flex-end;\n  }\n}\n\n.notif-wrapper {\n  display: flex;\n  align-items: flex-start; // for .notif\n  height: -moz-fit-content;\n  height: fit-content;\n  flex-direction: column; // for.notif\n  align-items: center; // for.notif\n  .notif {\n    font-size: 0.875rem;\n    font-style: italic;\n    margin-top: rem-calc(4);\n  }\n}\n\n@media (max-width: rem-calc(975)) {\n  .descr {\n    margin-bottom: rem-calc(8);\n  }\n  .notif-wrapper {\n    margin-bottom: rem-calc(16);\n  }\n  .header {\n    .notif-wrapper {\n      align-items: flex-start;\n    }\n  }\n}\n\n.file-info {\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n\n  + .file-controls {\n    flex: none;\n    margin-left: rem-calc(16);\n  }\n}\n\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: 1.5rem;\n    margin-bottom: rem-calc(7);\n  }\n\n  .notif-wrapper {\n    justify-content: center;\n\n    .wm-button {\n      // Removing the width inherit here to prevent a 100% width\n      // from the notif-wrapper. Future proofing a day when\n      // we might want a long notif to wrap.\n      width: auto;\n    }\n  }\n}\n\nul {\n  list-style: none;\n  padding: 0;\n  width: 100%;\n  li {\n    font-size: rem-calc(14);\n    .file {\n      @include border-radius(3px);\n      position: relative; // for progress bar\n      height: rem-calc(60);\n      padding: rem-calc(8 20);\n      background: $background;\n      border: 1px solid rgb(107, 107, 107);\n\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n\n      + .file {\n        margin-top: rem-calc(20);\n      }\n\n      .filename {\n        font-weight: 500;\n      }\n\n      .filedate {\n        margin-left: rem-calc(60);\n        font-weight: normal;\n        font-style: italic;\n      }\n\n      wm-button + wm-button {\n        margin-left: rem-calc(16);\n      }\n    }\n  }\n\n  &.file-list .file.--saved,\n  &.inprogress-list .file {\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\n  .progress {\n    position: absolute;\n    left: 0;\n    top: 0;\n    right: 0;\n    height: 8px;\n  }\n\n  &.error-list li {\n    margin-bottom: rem-calc(20);\n    color: $error-color;\n    .file {\n      border: 1px solid $error-color;\n      background-color: #f5ebea;\n      height: rem-calc(60);\n    }\n  }\n  .error-message {\n    padding-top: rem-calc(4);\n    font-style: italic;\n  }\n}\n","import { Component, Element, h, Host, Prop, State, Listen, Watch, Event, EventEmitter } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { getRequest, postRequest, putRequest, deleteRequest } from \"../../../global/services/http-service\";\nimport { intl, generateId, hasValidType } from \"../../../global/functions\";\nimport { globalMessages } from \"../../../global/intl\";\n//\n// Web API File interface => for FileList on input element, sending to AWS\n// Custom FileInfo interface (below) => for our server\nexport interface FileInfo {\n  file_name: string;\n  file_path?: string;\n  mime_type: string;\n  updated_at?: string;\n\n  uuid?: string; // AWS guid\n  document_uuid?: string; // aka file uuid. how is that different from the uuid above?\n  // organization_uuid: string; // aka node uuid\n}\n\ninterface FileInProgress extends File {\n  progress?: number;\n}\n\ninterface ErrorInfo {\n  file_name: string;\n  message: string;\n}\n\ninterface AWSData {\n  url: string;\n  updated_at: string;\n  path: string;\n  guid: string;\n}\n\ninterface Notification {\n  message: string;\n  id: string;\n  link: string;\n}\n\n@Component({\n  tag: \"wm-network-uploader\",\n  styleUrl: \"wm-network-uploader.scss\",\n  shadow: true,\n})\nexport class NetworkUploader {\n  @Element() el!: HTMLWmNetworkUploaderElement;\n  private liveRegion?: HTMLDivElement;\n\n  @State() isTabbing: boolean = false;\n\n  @State() fileList: FileInfo[] = [];\n  @State() inProgressList: FileInProgress[] = [];\n  @State() errorList: ErrorInfo[] = []; // for errors on a particular file\n  @State() notif?: { id: number; message: string } | null; // for global errors, e.g. user tries uploading too many files, and upload notifications\n  @State() snackbar: Notification[] = [];\n  @State() numFilesInProgress?: number | null; // null when not uploading != 0 (when all files are done uploading) != undefined (original state)\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\n  @Prop() getPath!: string;\n  @Prop() requestUploadPath!: string;\n  @Prop() uploadPath!: string; // used for POST request (create db entry)\n  @Prop() requestDownloadPath!: string;\n  @Prop() deletePath!: string;\n\n  @Prop() associatedData?: string;\n  @Prop() buttonText!: 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({ mutable: true }) maxSize: number = 100; // in Mb\n  @Prop() maxFiles?: number;\n  @Prop() sortBy: \"name\" | \"date\" = \"date\"; // name is descending (a -> z), date is ascending (earlier -> later)\n\n  @Event() wmNetworkUploaderFilesChanged!: EventEmitter<Object[]>;\n\n  private inputId = generateId();\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.inProgressList.map((i) => {\n      if (i.name === ev.detail.file_name) {\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.inProgressList.reduce((avg, item) => (item.progress ? avg + item.progress : avg), 0);\n        if (this.liveRegion) {\n          this.liveRegion.innerHTML = intl.formatMessage(\n            {\n              id: \"uploader.uploadProgress\",\n              defaultMessage: \"Upload progress: {percentage}%\",\n            },\n            { percentage: Math.floor(aggregate / total) }\n          );\n        }\n      }, 5000);\n    }\n  }\n\n  @Listen(\"userFinishedSnack\")\n  handleFinishedSnack(ev: CustomEvent) {\n    this.snackbar = this.snackbar.filter((n) => n.id !== ev.detail.id);\n  }\n\n  @Watch(\"maxSize\")\n  setMaxSize() {\n    // Max size can't be set above 100Mb\n    this.maxSize = this.maxSize > 100 ? 100 : this.maxSize;\n  }\n\n  @Watch(\"numFilesInProgress\")\n  uploadNotifications(newNum: number, oldNum: number) {\n    if (oldNum > 0 && newNum === 0) {\n      setTimeout(() => {\n        this.notif = null;\n      }, 20 * 1000);\n      const message = intl.formatMessage({\n        id: \"uploader.finishedUploading\",\n        defaultMessage: \"Finished uploading\",\n      });\n      this.notif = { id: 5, message };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = message;\n      }\n      this.numFilesInProgress = null;\n      clearInterval(this.srProgress);\n      forceUpdate(this.el);\n    } else if (newNum > 0 && newNum != oldNum) {\n      const message = intl.formatMessage(\n        {\n          id: \"uploader.filesUploading\",\n          defaultMessage: \"{num, plural, one {1 file uploading} other {# files uploading}}\",\n        },\n        { num: newNum }\n      );\n      this.notif = { id: 6, message };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = message;\n      }\n      forceUpdate(this.el);\n    }\n  }\n\n  @Watch(\"fileList\")\n  emitFileListEvent() {\n    this.wmNetworkUploaderFilesChanged.emit(this.fileList);\n  }\n\n  formatDate(isoDate: string, locale: string, timezone: string) {\n    const timestamp = Date.parse(isoDate);\n    if (locale.match(/^[a-zA-Z]*(-[a-zA-Z0-9]*)*$/g)) {\n      // make sure locale is valid, otherwise set default locale\n      try {\n        //@ts-ignore\n        Intl.getCanonicalLocales(locale);\n      } catch {\n        locale = \"en-us\";\n      }\n    } else {\n      return isoDate;\n    }\n\n    if (!!timestamp) {\n      const date = new Date(timestamp);\n      const year = date.getFullYear();\n      const month = (\"0\" + (date.getMonth() + 1)).substr(-2);\n      const day = (\"0\" + date.getDate()).substr(-2);\n      const time = date.toLocaleTimeString([locale, \"en-us\"], {\n        timeZone: timezone,\n        hour: \"numeric\",\n        minute: \"numeric\",\n      });\n      return `${year}/${month}/${day} ${time}`;\n    } else {\n      return isoDate;\n    }\n  }\n\n  isValidSize(size: number) {\n    // https://stackoverflow.com/questions/2365100/converting-bytes-to-megabytes\n    return size / 1024 / 1024 <= this.maxSize;\n  }\n\n  isDuplicate(name: string) {\n    return this.fileList.find((f) => f.file_name === name);\n  }\n\n  isEmpty() {\n    return !this.fileList.length && !this.inProgressList.length && !this.errorList.length;\n  }\n\n  get isDisabled() {\n    const isMax = !!this.maxFiles && this.fileList.length >= this.maxFiles;\n\n    if (!this.notif) {\n      if (isMax) {\n        const errMessage = intl.formatMessage({\n          id: \"uploader.fileUploadLimitExceeded\",\n          defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n          description: \"Message displayed when trying to upload too many files\",\n        });\n        this.notif = { id: 1, message: errMessage };\n        if (this.liveRegion) {\n          this.liveRegion.innerHTML = errMessage;\n        }\n      } else {\n        this.notif = null;\n      }\n    } else if (this.notif.id === 1) {\n      // to make sure SR don't repeat the error, don't reset it if it already is showing\n      // just dismiss it if isMax is not true anymore\n      if (!isMax) {\n        this.notif = null;\n      }\n      // finally do nothing if error 2 is showing (special case when user selects too many files)\n    }\n    // disable if is the uploader is maxed out or if something is uploading\n    return isMax || this.numFilesInProgress! > 0;\n  }\n\n  purgeProgressList(item: FileInfo) {\n    // If a file is retrieved from the server because it was just uploaded\n    // it should be removed from inProgressList\n    this.inProgressList = this.inProgressList.filter((i) => i.progress !== 100 && i.name !== item.file_name);\n  }\n\n  getExistingFiles() {\n    getRequest(this.getPath)\n      .then((reply: FileInfo[]) => {\n        reply.map((item) => this.purgeProgressList(item));\n        if (this.sortBy === \"name\") {\n          reply.sort((a, b) => a.file_name.localeCompare(b.file_name));\n        }\n        this.fileList = reply;\n      })\n      .catch((errStatus) => {\n        console.error(errStatus);\n      });\n  }\n\n  clearErrors() {\n    this.errorList = [];\n    this.notif = null;\n  }\n\n  handleFiles(ev: Event) {\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      const errMessage = intl.formatMessage({\n        id: \"uploader.fileUploadLimitExceeded\",\n        defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n        description: \"Message displayed when trying to upload too many files\",\n      });\n      this.notif = { id: 2, message: errMessage };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = errMessage;\n      }\n    } else {\n      // map to create inProgress items so they can be displayed immediately\n      files &&\n        files.map((file) => {\n          if (!hasValidType(file, this.fileTypes)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage(\n                {\n                  id: \"uploader.invalidFileType\",\n                  defaultMessage: \"The file type is invalid. Accepted types: {validTypes}\",\n                },\n                { validTypes }\n              ),\n            };\n            this.errorList.push(error);\n          } else if (!this.isValidSize(file.size)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage(\n                {\n                  id: \"uploader.fileTooLarge\",\n                  defaultMessage: \"The selected file is too large. Maximum file size is {size}Mb\",\n                },\n                { size: this.maxSize }\n              ),\n            };\n            this.errorList.push(error);\n          } else if (this.isDuplicate(file.name)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage({\n                id: \"uploader.duplicateName\",\n                defaultMessage: \"A file with this name already exists.\",\n              }),\n            };\n            this.errorList.push(error);\n          } else {\n            this.inProgressList.push(file);\n          }\n          forceUpdate(this.el);\n        });\n\n      if (this.inProgressList.length > 0) {\n        this.numFilesInProgress = this.inProgressList.length;\n\n        // map over \"uploadable\" files for actual upload\n        // this happens separately otherwise at each pass we'd have to wait for the requests to complete before displaying things\n        this.inProgressList.map((file, i) => {\n          this.uploadFile(file, i); // = input.files file\n        });\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  uploadFile(file: File, i: number) {\n    // get upload link\n    getRequest(this.requestUploadPath + i.toString())\n      .then(async (reply: AWSData) => {\n        const assData = JSON.parse(this.associatedData!);\n        const fileInfo: FileInfo = {\n          ...assData,\n          file_name: file.name,\n          mime_type: file.type,\n          file_path: reply.path,\n          document_uuid: reply.guid,\n        };\n\n        // onProgress is passed as a callback to the ev listener inside putRequest (http service),\n        // so we can't change component things directly => custom event to pass data to uploader component.\n        const onProgress = (ev: ProgressEvent) => {\n          const progress = ev.lengthComputable && ev.total !== 0 ? (ev.loaded / ev.total) * 100 : 0;\n          const event = new CustomEvent(\"wmUploadProgress\", {\n            detail: { file_name: file.name, progress },\n          });\n\n          this.el.dispatchEvent(event);\n        };\n\n        // upload to AWS s3 to url we just fetched\n        await putRequest(reply.url, file, onProgress);\n\n        // create the db entry\n        await postRequest(this.uploadPath, fileInfo);\n\n        // get files from server again\n        this.getExistingFiles();\n      })\n      .catch((err) => {\n        // do not show toast on error\n        this.numFilesInProgress = null;\n        // do not show in progress item on error\n        this.inProgressList = [];\n        this.notif = {\n          id: 3,\n          message: globalMessages.genericError,\n        };\n        console.error(err);\n      });\n  }\n\n  downloadFile(uuid: string, path: string) {\n    this.clearErrors();\n\n    // POST request to get temporary download link\n    const payload = {\n      file_path: path,\n      file_uuid: uuid,\n    };\n    postRequest(this.requestDownloadPath, payload)\n      .then((reply: { url: string }) => {\n        // we got the download link, now download the file\n        window.location.assign(reply.url);\n      })\n      .catch((err) => {\n        console.error(err);\n      });\n  }\n\n  deleteFile(file: FileInfo) {\n    this.clearErrors();\n\n    this.snackbar.push({\n      message: intl.formatMessage(\n        {\n          id: \"uploader.fileDeleted\",\n          defaultMessage: \"{fileName} was deleted.\",\n        },\n        { fileName: file.file_name }\n      ),\n      id: file.uuid!,\n      link: \"\",\n    });\n\n    // rm file from list immediately.\n    this.fileList = this.fileList.filter((i) => i.uuid !== file.uuid);\n\n    deleteRequest(`${this.deletePath}/${file.uuid}`).catch((err) => {\n      this.notif = {\n        id: 4,\n        message: intl.formatMessage(\n          {\n            id: \"uploader.fileNotDeleted\",\n            defaultMessage: \"{fileName} could not be deleted.\",\n          },\n          { fileName: file.file_name }\n        ),\n      };\n      this.getExistingFiles();\n      console.error(err);\n    });\n  }\n\n  componentWillLoad() {\n    if (!this.getPath) {\n      throw new Error(\"wm-network-uploader: get-path is a required prop\");\n    }\n    if (!this.requestUploadPath) {\n      throw new Error(\"wm-network-uploader: request-upload-path is a required prop\");\n    }\n    if (!this.uploadPath) {\n      throw new Error(\"wm-network-uploader: upload-path is a required prop\");\n    }\n    if (!this.requestDownloadPath) {\n      throw new Error(\"wm-network-uploader: request-download-path is a required prop\");\n    }\n    if (!this.deletePath) {\n      throw new Error(\"wm-network-uploader: delete-path is a required prop\");\n    }\n    if (!this.buttonText) {\n      throw new Error(\"wm-network-uploader: button-text is a required prop\");\n    }\n    if (!this.emptyStateText) {\n      throw new Error(\"wm-network-uploader: empty-state-text is a required prop\");\n    }\n    if (!this.associatedData) {\n      throw new Error(\"wm-network-uploader: associated-data is a required prop\");\n    }\n\n    this.setMaxSize();\n    this.clearErrors();\n  }\n\n  componentDidLoad() {\n    this.getExistingFiles();\n\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      // this is not pretty duplicating a intl message + the logic of isDisabled,\n      // but not worth a bigger refactor since this is only until we get the UX for disabled elements and refactor all interactive els.\n      ev.preventDefault();\n      if (this.liveRegion) {\n        const isMax = !!this.maxFiles && this.fileList.length >= this.maxFiles;\n        let errMsg: string = \"\";\n        if (this.numFilesInProgress! > 0) {\n          errMsg = intl.formatMessage({\n            id: \"uploader.waitToUpload\",\n            defaultMessage: \"Please wait for current upload to complete before uploading new files.\",\n            description: \"Message for screen reader users\",\n          });\n        } else if (isMax) {\n          errMsg = intl.formatMessage({\n            id: \"uploader.fileUploadLimitExceeded\",\n            defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n            description: \"Message displayed when trying to upload too many files\",\n          });\n        }\n\n        if (errMsg) {\n          // clear and set again to re-announce if button is clicked several times\n          // (can't be done inside setTimeout because of scope, hence the promise)\n          this.liveRegion.innerHTML = \"\";\n          new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(\"\");\n            }, 500);\n          }).then(() => (this.liveRegion!.innerHTML = errMsg));\n        }\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  renderNotif() {\n    return this.notif ? <span class=\"notif\">{this.notif.message}</span> : \"\";\n  }\n\n  renderUploadButton(classes: string) {\n    return (\n      <div class=\"notif-wrapper\">\n        <input\n          name={this.inputId}\n          id={this.inputId}\n          class=\"sr-only\"\n          type=\"file\"\n          multiple\n          onClick={(ev) => this.uploadButtonOnClick(ev)}\n          onChange={(e) => this.handleFiles(e)}\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.renderNotif()}\n      </div>\n    );\n  }\n\n  renderWithItems() {\n    return (\n      <div>\n        <div class=\"header\">\n          <div class=\"descr\">\n            <slot />\n          </div>\n          {this.renderUploadButton(this.isDisabled ? \"disabled\" : \"\")}\n        </div>\n        {this.renderErrorList()}\n        {this.renderInProgressList()}\n        {this.renderFileList()}\n      </div>\n    );\n  }\n\n  renderEmptyState() {\n    return (\n      <div>\n        <div class=\"header\">\n          <div class=\"descr\">\n            <slot />\n          </div>\n        </div>\n        <div class=\"empty-block\">\n          {this.renderUploadSvg()}\n          <div class=\"empty-message\">{this.emptyStateText}</div>\n          {this.renderUploadButton(\"-primary empty-button\")}\n        </div>\n      </div>\n    );\n  }\n\n  renderErrorList() {\n    if (!!this.errorList.length) {\n      if (this.liveRegion) {\n        let srMessage = this.errorList.reduce(function (acc, err) {\n          return acc + `${err.file_name}: ${err.message} `;\n        }, \"\");\n        this.liveRegion.innerHTML = srMessage;\n      }\n\n      return (\n        <ul class=\"error-list\">\n          {this.errorList.map((err) => (\n            <li>\n              <div class=\"file --error\">\n                <div class=\"file-info\">\n                  <span class=\"filename\">{err.file_name}</span>\n                </div>\n              </div>\n              <div class=\"error-message\">{err.message}</div>\n            </li>\n          ))}\n        </ul>\n      );\n    }\n  }\n\n  renderInProgressList() {\n    return (\n      <ul class=\"inprogress-list\">\n        {this.inProgressList.map((item) => {\n          return (\n            <li>\n              <div class=\"file --progress\">\n                <div\n                  class=\"progress\"\n                  style={{\n                    background: `linear-gradient(to right, rgba(67, 126, 142, 1) ${item.progress}%, transparent ${item.progress}%)`,\n                  }}\n                ></div>\n                <div class=\"file-info\">\n                  <span class=\"filename\">\n                    {item.name} <span class=\"sr-only\">uploading</span>\n                  </span>\n                </div>\n              </div>\n            </li>\n          );\n        })}\n      </ul>\n    );\n  }\n\n  renderFile(item: FileInfo) {\n    return (\n      <li>\n        <div class=\"file --saved\">\n          <div class=\"file-info\">\n            <span class=\"filename\">{item.file_name}</span>\n            <span class=\"filedate\">\n              {this.formatDate(item.updated_at!, intl.locale, Intl.DateTimeFormat().resolvedOptions().timeZone)}\n            </span>\n          </div>\n          <div class=\"file-controls\">\n            <wm-button\n              class=\"download-button\"\n              button-type=\"icononly\"\n              tooltip=\"download\"\n              label-for-identical-buttons={`download ${item.file_name}`}\n              icon=\"f1da\"\n              onClick={() => this.downloadFile(item.uuid!, item.file_path!)}\n            ></wm-button>\n            <wm-button\n              class=\"delete-button\"\n              button-type=\"icononly\"\n              tooltip=\"remove\"\n              label-for-identical-buttons={`remove ${item.file_name}`}\n              icon=\"f1c0\"\n              onClick={() => this.deleteFile(item)}\n            ></wm-button>\n          </div>\n        </div>\n      </li>\n    );\n  }\n\n  renderFileList() {\n    return <ul class=\"file-list\">{this.fileList.map((item) => this.renderFile(item))}</ul>;\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.isEmpty() ? this.renderEmptyState() : this.renderWithItems()}\n        <wm-snackbar notifications={JSON.stringify(this.snackbar)}></wm-snackbar>\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        ></div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-4e02e2ae.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,H as s,g as n,f as o}from"./p-1c23de4a.js";import{i as a,x as r}from"./p-c6a0f7e5.js";import{g as l}from"./p-9b2dfb54.js";const h=":host{z-index:10}:host([aria-expanded=true]){z-index:5000}.tray{-webkit-box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);-moz-box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:7.5625rem;background-color:#fff;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;font-size:0.875rem;height:100%}.navlist{margin:0;padding:0}.toggle-wrapper{display:none}@media screen and (max-width: 1023px){.tray{-ms-transition:transform 0.33s ease;-webkit-transition:transform 0.33s ease;-moz-transition:transform 0.33s ease;-webkit-transition:-webkit-transform 0.33s ease;transition:-webkit-transform 0.33s ease;transition:transform 0.33s ease;transition:transform 0.33s ease, -webkit-transform 0.33s ease;position:fixed;top:0;bottom:0;left:0;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.tray ul{visibility:hidden}.tray .toggle-wrapper{display:inline-block;min-height:5rem;width:100%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host([aria-expanded=true]) .tray{-webkit-transform:translateX(0);transform:translateX(0)}:host([aria-expanded=true]) .tray ul{visibility:visible}.overlay{width:100vw;height:100vh;max-width:none;max-height:none;position:fixed !important;top:0;bottom:0;left:0;right:0;-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}}";const c=class{constructor(e){t(this,e);this.wmNavigationStateChanged=i(this,"wmNavigationStateChanged",7);this.mainNavigationMessage=a.formatMessage({id:"navigation.mainNavigation",defaultMessage:"Main",description:"Label describing the site navigation, for screen reader users"});this.throttledRerender=r((()=>o(this.el)),50);this.open=false;this.isTabbing=false}get isCollapsible(){return window.innerWidth<1024}get ariaExpanded(){return this.isCollapsible?this.open.toString():undefined}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}closeOnEscape(t){if(t.key==="Escape"){this.open=false}}handleWindowResize(){this.throttledRerender()}handleHamburgerClicked(){this.open=!this.open}handleClickOnItem(){this.open=false}handleStateChange(){if(this.isCollapsible){this.wmNavigationStateChanged.emit();this.open?this.expand():this.collapse()}}componentWillLoad(){if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}this.el.focus=()=>{const t=this.open?this.el.shadowRoot.querySelector(".toggle"):document.querySelector("wm-navigation-hamburger");const i=this.el.querySelector("wm-navigation-item");this.isCollapsible?t.focus():i.focus()};if(this.isCollapsible&&this.open){this.wmNavigationStateChanged.emit();this.expand()}}redirectFocusFromBody(t){if(document.activeElement.tagName==="BODY"&&!t.relatedTarget){this.el.focus()}}expand(){document.body.tabIndex=0;document.body.addEventListener("focus",this.redirectFocusFromBody.bind(this),true);setTimeout((()=>this.toggleEl.focus()),250)}collapse(){document.body.tabIndex=-1;document.body.removeEventListener("focus",this.redirectFocusFromBody.bind(this));const t=document.querySelector("wm-navigation-hamburger");if(t)t.focus()}focusLastItem(){const t=this.el.querySelectorAll("wm-navigation-item");const i=Array.from(t).pop();i.focus()}renderOverlay(){return e("div",{class:"overlay",onClick:()=>{this.open=false}})}render(){return e(s,{role:"navigation","aria-expanded":this.ariaExpanded,"aria-label":this.mainNavigationMessage},this.open?this.renderOverlay():"",this.isCollapsible&&e("div",{class:"trapfocus",tabindex:this.open?0:undefined,onFocus:()=>this.focusLastItem()}),e("div",{class:"tray"},e("div",{class:"toggle-wrapper"},e("wm-button",{ref:t=>this.toggleEl=t,class:`toggle ${this.isTabbing?"user-is-tabbing":""}`,"button-type":"navigational",icon:this.open?"f156":"f35c","icon-size":"2rem",tooltip:this.open?l.close:l.open,"tooltip-position":"left",tabIndex:this.open?undefined:-1,onClick:()=>{this.open=!this.open}})),e("ul",{class:"navlist"},e("slot",null))),this.isCollapsible&&e("div",{class:"trapfocus",tabindex:this.open?0:undefined,onFocus:()=>this.toggleEl.focus()}))}static get delegatesFocus(){return true}get el(){return n(this)}static get watchers(){return{open:["handleStateChange"]}}};c.style=h;const d='button{display:none;width:100%;height:100%;border:none;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1);background-color:transparent;outline:none;padding:0}button.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}button.user-is-tabbing:focus::-moz-focus-inner{border:0}button:hover{background-color:#d7d6d9}.icon:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f35c";font-size:1.5rem;color:#575195}@media screen and (max-width: 1023px){:host{width:3.75rem;height:3.75rem}button{display:initial}}';const g=class{constructor(e){t(this,e);this.wmNavigationHamburgerClicked=i(this,"wmNavigationHamburgerClicked",7);this.showNavMessage=a.formatMessage({id:"navigation.showNavigation",defaultMessage:"Show navigation",description:"For user interface element opening a navigation menu"});this.navId=undefined;this.tooltipVisible=false;this.isTabbing=false;this.open=false}get tooltipEl(){return document.getElementById("wm-tooltip")}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleNavigationStateChanged(t){this.open=t.target.open}componentWillLoad(){if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}if(!this.navId){console.error("wm-navigation-hamburger: nav-id is a required prop")}}showTooltip(){const t=this.showNavMessage;this.tooltipEl.textContent=t;this.tooltipEl.style.setProperty("--wmTooltipTop","1.125rem");this.tooltipEl.style.setProperty("--wmTooltipLeft","2.75rem");this.tooltipEl.style.transitionDelay="500ms";this.tooltipEl.style.opacity="1";const i=t.match(/^[^\s]+$/);if(i){this.tooltipEl.classList.add("single-word");this.tooltipEl.style.setProperty("--wmTooltipMaxWidth","none")}else{this.tooltipEl.classList.remove("single-word");this.tooltipEl.style.removeProperty("--wmTooltipMaxWidth")}setTimeout((()=>{this.tooltipVisible=true}),500)}hideTooltip(){this.tooltipEl.style.transitionDelay="0s";this.tooltipEl.style.opacity="0";this.tooltipVisible=false}showTooltipForKeyboardUsers(){if(this.isTabbing){this.showTooltip()}}handleClick(){this.hideTooltip();this.wmNavigationHamburgerClicked.emit()}render(){return e(s,{class:`hamburger ${this.open?"nav-open":"nav-closed"}`},e("button",{class:this.isTabbing?"user-is-tabbing":undefined,"aria-expanded":this.open,"aria-controls":this.navId,"aria-label":this.showNavMessage,onMouseEnter:()=>this.showTooltip(),onMouseLeave:()=>this.hideTooltip(),onFocus:()=>this.showTooltipForKeyboardUsers(),onBlur:()=>this.hideTooltip(),onClick:()=>this.handleClick()},e("span",{class:"icon"})))}static get delegatesFocus(){return true}get el(){return n(this)}};g.style=d;const u='.link{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;color:inherit;text-decoration:none;min-height:4.5rem;text-align:center;padding:1.25rem 0.5rem;font-weight:500;outline:none;position:relative}.link:hover{background-color:#f2f2f2}.link .icon{font-size:1.375rem;color:#6b6b6b}.link .text{font-size:0.875rem}.link.user-is-tabbing:focus{-webkit-box-shadow:inset 0 2px 2px 0 rgba(244, 243, 246, 0.2), inset 0 2px 2px 0 rgba(0, 0, 0, 0.1), inset 0 0 4px 3px #61279e;box-shadow:inset 0 2px 2px 0 rgba(244, 243, 246, 0.2), inset 0 2px 2px 0 rgba(0, 0, 0, 0.1), inset 0 0 4px 3px #61279e}.link.active{background-color:#e9e7ec}.link.active:before{content:"";background-color:#575195;position:absolute;height:100%;width:5px;left:0}.link.active .text{color:#575195}.link.active .icon{color:#575195}';const m=class{constructor(e){t(this,e);this.wmNavigationItemClicked=i(this,"wmNavigationItemClicked",7);this.href=undefined;this.text=undefined;this.active=undefined;this.isTabbing=false}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}componentWillLoad(){if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}}render(){return e(s,{role:"listitem"},e("a",{class:`link ${this.active?"active":""} ${this.isTabbing?"user-is-tabbing":""}`,href:this.href,onClick:()=>this.wmNavigationItemClicked.emit()},e("div",{class:"icon","aria-hidden":"true"},e("slot",null)),e("div",{class:"text"},this.text)))}static get delegatesFocus(){return true}get el(){return n(this)}};m.style=u;export{c as wm_navigation,g as wm_navigation_hamburger,m as wm_navigation_item};
-//# sourceMappingURL=p-4e02e2ae.entry.js.map

package/dist/ripple/p-4e02e2ae.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmNavigationCss","Navigation","this","mainNavigationMessage","intl","formatMessage","id","defaultMessage","description","throttledRerender","throttle","forceUpdate","el","isCollapsible","window","innerWidth","ariaExpanded","open","toString","undefined","toggleTabbingOn","isTabbing","toggleTabbingOff","closeOnEscape","ev","key","handleWindowResize","handleHamburgerClicked","handleClickOnItem","handleStateChange","wmNavigationStateChanged","emit","expand","collapse","componentWillLoad","document","body","classList","contains","focus","btn","shadowRoot","querySelector","firstItem","redirectFocusFromBody","activeElement","tagName","relatedTarget","tabIndex","addEventListener","bind","setTimeout","toggleEl","removeEventListener","hamburgerBtn","focusLastItem","items","querySelectorAll","lastItem","Array","from","pop","renderOverlay","h","class","onClick","render","Host","role","tabindex","onFocus","ref","icon","tooltip","globalMessages","close","wmNavigationHamburgerCss","NavigationHamburger","showNavMessage","tooltipEl","getElementById","handleNavigationStateChanged","target","navId","console","error","showTooltip","tooltipText","textContent","style","setProperty","transitionDelay","opacity","hasNoWhitespace","match","add","remove","removeProperty","tooltipVisible","hideTooltip","showTooltipForKeyboardUsers","handleClick","wmNavigationHamburgerClicked","onMouseEnter","onMouseLeave","onBlur","wmNavigationItemCss","NavigationItem","active","href","wmNavigationItemClicked","text"],"sources":["./src/components/wm-navigation/wm-navigation.scss?tag=wm-navigation&encapsulation=shadow","./src/components/wm-navigation/wm-navigation.tsx","./src/components/wm-navigation/wm-navigation-hamburger.scss?tag=wm-navigation-hamburger&encapsulation=shadow","./src/components/wm-navigation/wm-navigation-hamburger.tsx","./src/components/wm-navigation/wm-navigation-item.scss?tag=wm-navigation-item&encapsulation=shadow","./src/components/wm-navigation/wm-navigation-item.tsx"],"sourcesContent":[":host {\n  z-index: 10;\n}\n\n:host([aria-expanded=\"true\"]) {\n  z-index: 5000;\n}\n\n.tray {\n  @include box-shadow(0 0 14px 0 rgba(0, 0, 0, 0.14));\n  display: flex;\n  flex-direction: column;\n  width: rem-calc(121);\n  background-color: $light-background;\n  overflow-x: hidden;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n  font-size: rem-calc(14);\n  height: 100%;\n}\n\n.navlist {\n  margin: 0;\n  padding: 0;\n}\n\n.toggle-wrapper {\n  display: none;\n}\n\n/* COLLAPSIBLE STYLES */\n@media screen and (max-width: 1023px) {\n  .tray {\n    @include transition(transform 0.33s ease);\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    transform: translateX(-100%);\n\n    ul {\n      visibility: hidden;\n    }\n\n    .toggle-wrapper {\n      display: inline-block;\n      min-height: 5rem;\n      width: 100%;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    }\n  }\n\n  :host([aria-expanded=\"true\"]) {\n    .tray {\n      transform: translateX(0);\n\n      ul {\n        visibility: visible;\n      }\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: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    transform: translate(0%, 0%);\n    background-color: rgba(25, 25, 25, 0.4);\n    @include transition(opacity 0.5s ease-out);\n  }\n}\n","import {\n  h,\n  Component,\n  Element,\n  Prop,\n  State,\n  Listen,\n  Host,\n  Watch,\n  Event,\n  EventEmitter,\n  forceUpdate,\n} from \"@stencil/core\";\nimport { intl, throttle } from \"../../global/functions\";\nimport { globalMessages } from \"../../global/intl\";\n\n@Component({\n  tag: \"wm-navigation\",\n  styleUrl: \"wm-navigation.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Navigation {\n  @Element() el!: HTMLWmNavigationElement;\n  toggleEl!: HTMLWmButtonElement;\n  @Prop({ reflect: true, mutable: true }) open: boolean = false;\n\n  @State() isTabbing: boolean = false;\n  @Event() wmNavigationStateChanged!: EventEmitter;\n\n  private mainNavigationMessage: string = intl.formatMessage({\n    id: \"navigation.mainNavigation\",\n    defaultMessage: \"Main\",\n    description: \"Label describing the site navigation, for screen reader users\",\n  });\n\n  get isCollapsible() {\n    return window.innerWidth < 1024;\n  }\n\n  get ariaExpanded() {\n    return this.isCollapsible\n      ? // if component is in collapsible mode, set aria-expanded according to expanded state\n        this.open.toString()\n      : // otherwise, do not render attr at all\n        undefined;\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  closeOnEscape(ev: KeyboardEvent) {\n    if (ev.key === \"Escape\") {\n      this.open = false;\n    }\n  }\n\n  throttledRerender = throttle(() => forceUpdate(this.el), 50);\n\n  @Listen(\"resize\", { target: \"window\" })\n  handleWindowResize() {\n    // for component to react when breakpoint is crossed\n    // (doesn't rerender on window resize)\n    this.throttledRerender();\n  }\n\n  @Listen(\"wmNavigationHamburgerClicked\", { target: \"window\" })\n  handleHamburgerClicked() {\n    this.open = !this.open;\n  }\n\n  @Listen(\"wmNavigationItemClicked\")\n  handleClickOnItem() {\n    this.open = false;\n  }\n\n  @Watch(\"open\")\n  handleStateChange() {\n    if (this.isCollapsible) {\n      this.wmNavigationStateChanged.emit();\n      this.open ? this.expand() : this.collapse();\n    }\n  }\n\n  componentWillLoad() {\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n\n    this.el.focus = () => {\n      // in addition to delegatesFocus, we need to highjack the focus method to send focus to the appropriate element based on the navigation's state\n      const btn = this.open\n        ? (this.el.shadowRoot!.querySelector(\".toggle\")! as HTMLWmButtonElement)\n        : (document.querySelector(\"wm-navigation-hamburger\") as HTMLWmNavigationHamburgerElement);\n      const firstItem = this.el.querySelector(\"wm-navigation-item\")! as HTMLWmNavigationItemElement;\n      this.isCollapsible ? btn.focus() : firstItem.focus();\n    };\n\n    if (this.isCollapsible && this.open) {\n      // hamburger needs to know if open was initially set to true\n      this.wmNavigationStateChanged.emit();\n      this.expand();\n    }\n  }\n\n  redirectFocusFromBody(ev: FocusEvent) {\n    // the 2nd check excludes the case when user clicks on the page when the nav is open,\n    // which should not redirect focus\n    if ((document.activeElement as HTMLElement).tagName === \"BODY\" && !ev.relatedTarget) {\n      this.el.focus();\n    }\n  }\n\n  expand() {\n    // listen to focus on body and redirect to the component\n    // this is to handle trap focus when user has left the page (e.g. went to the address bar)\n    // and is tabbing back in\n    document.body.tabIndex = 0;\n    document.body.addEventListener(\"focus\", this.redirectFocusFromBody.bind(this), true);\n\n    // wait for nav to be expanded otherwise tooltip will be misplaced.\n    setTimeout(() => this.toggleEl.focus(), 250);\n    //document.querySelector(\"wm-navigation\")!.shadowRoot!.querySelector(\".toggle\")!.focus()\n  }\n\n  collapse() {\n    // rm event listener on body\n    document.body.tabIndex = -1;\n    document.body.removeEventListener(\"focus\", this.redirectFocusFromBody.bind(this));\n\n    const hamburgerBtn = document.querySelector(\"wm-navigation-hamburger\");\n    // should fail silently if el doesn't exist\n    // (dev may have chosen not to use the hamburger component)\n    if (hamburgerBtn) hamburgerBtn.focus();\n  }\n\n  focusLastItem() {\n    const items = this.el.querySelectorAll(\"wm-navigation-item\");\n    const lastItem = Array.from(items).pop() as HTMLWmNavigationItemElement;\n    lastItem.focus();\n  }\n\n  renderOverlay() {\n    return (\n      <div\n        class=\"overlay\"\n        onClick={() => {\n          this.open = false;\n        }}\n      ></div>\n    );\n  }\n\n  render() {\n    return (\n      <Host role=\"navigation\" aria-expanded={this.ariaExpanded} aria-label={this.mainNavigationMessage}>\n        {this.open ? this.renderOverlay() : \"\"}\n        {this.isCollapsible && (\n          <div class=\"trapfocus\" tabindex={this.open ? 0 : undefined} onFocus={() => this.focusLastItem()}></div>\n        )}\n        <div class=\"tray\">\n          <div class=\"toggle-wrapper\">\n            <wm-button\n              ref={(el) => (this.toggleEl = el as HTMLWmButtonElement)}\n              class={`toggle ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}\n              button-type=\"navigational\"\n              icon={this.open ? \"f156\" : \"f35c\"}\n              icon-size=\"2rem\"\n              tooltip={this.open ? globalMessages.close : globalMessages.open}\n              tooltip-position=\"left\"\n              tabIndex={this.open ? undefined : -1}\n              onClick={() => {\n                this.open = !this.open;\n              }}\n            />\n          </div>\n          <ul class=\"navlist\">\n            <slot />\n          </ul>\n        </div>\n        {this.isCollapsible && (\n          <div class=\"trapfocus\" tabindex={this.open ? 0 : undefined} onFocus={() => this.toggleEl.focus()}></div>\n        )}\n      </Host>\n    );\n  }\n}\n","button {\n  display: none;\n  width: 100%;\n  height: 100%;\n  border: none;\n  box-shadow: none;\n  transition: background-color 500ms cubic-bezier(0.4, 0, 0.2, 1);\n  background-color: transparent;\n  outline: none;\n  padding: 0;\n\n  &.user-is-tabbing:focus {\n    @include focus-style;\n  }\n\n  &:hover {\n    background-color: $button-default-hover;\n  }\n}\n\n.icon {\n  &:before {\n    @include mdi-icon;\n    content: \"\\f35c\";\n    font-size: rem-calc(24);\n    color: $button-default-text;\n  }\n}\n\n@media screen and (max-width: 1023px) {\n  :host {\n    width: rem-calc(60);\n    height: rem-calc(60);\n  }\n\n  button {\n    display: initial;\n  }\n}\n","import { h, Component, Element, Host, Prop, Listen, Event, EventEmitter, State } from \"@stencil/core\";\nimport { intl } from \"../../global/functions\";\n\n@Component({\n  tag: \"wm-navigation-hamburger\",\n  styleUrl: \"wm-navigation-hamburger.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class NavigationHamburger {\n  @Element() el!: HTMLWmNavigationHamburgerElement;\n  nav!: HTMLWmNavigationElement;\n\n  @Prop() navId?: string;\n  @Prop({ mutable: true }) tooltipVisible = false; // this is not part of the documented API but we need to expose as prop in order to change it from the focus method defined in WillLoad()\n\n  @State() isTabbing?: boolean = false;\n  @State() open: boolean = false;\n\n  @Event() wmNavigationHamburgerClicked!: EventEmitter;\n\n  showNavMessage = intl.formatMessage({\n    id: \"navigation.showNavigation\",\n    defaultMessage: \"Show navigation\",\n    description: \"For user interface element opening a navigation menu\",\n  });\n\n  get tooltipEl(): HTMLElement {\n    return document.getElementById(\"wm-tooltip\")!;\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  // this also works on initial load because event is fired then\n  @Listen(\"wmNavigationStateChanged\", { target: \"document\" })\n  handleNavigationStateChanged(ev: CustomEvent) {\n    this.open = (ev.target! as HTMLWmNavigationElement).open;\n  }\n\n  componentWillLoad() {\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n    if (!this.navId) {\n      console.error(\"wm-navigation-hamburger: nav-id is a required prop\");\n    }\n  }\n\n  showTooltip() {\n    const tooltipText = this.showNavMessage;\n    this.tooltipEl.textContent = tooltipText;\n    this.tooltipEl.style.setProperty(\"--wmTooltipTop\", \"1.125rem\");\n    this.tooltipEl.style.setProperty(\"--wmTooltipLeft\", \"2.75rem\");\n    this.tooltipEl.style.transitionDelay = \"500ms\";\n    this.tooltipEl.style.opacity = \"1\";\n\n    // tooltip only has a maxWidth if it contains whitespace and can break\n    const hasNoWhitespace = tooltipText!.match(/^[^\\s]+$/);\n    if (hasNoWhitespace) {\n      this.tooltipEl.classList.add(\"single-word\");\n      this.tooltipEl.style.setProperty(\"--wmTooltipMaxWidth\", \"none\");\n    } else {\n      this.tooltipEl.classList.remove(\"single-word\");\n      this.tooltipEl.style.removeProperty(\"--wmTooltipMaxWidth\");\n    }\n\n    // tooltip is only visible after the transition delay.\n    // This also fixes an issue for keyboard users:\n    // if they tab to a button out of screen bounds, the page scrolls\n    // and hideTooltip() would be triggered before the tooltip would show\n    setTimeout(() => {\n      this.tooltipVisible = true;\n    }, 500);\n  }\n\n  hideTooltip() {\n    this.tooltipEl.style.transitionDelay = \"0s\";\n    this.tooltipEl.style.opacity = \"0\";\n    this.tooltipVisible = false;\n  }\n\n  showTooltipForKeyboardUsers() {\n    if (this.isTabbing) {\n      this.showTooltip();\n    }\n  }\n\n  handleClick() {\n    this.hideTooltip();\n    this.wmNavigationHamburgerClicked.emit();\n  }\n\n  render() {\n    return (\n      <Host class={`hamburger ${this.open ? \"nav-open\" : \"nav-closed\"}`}>\n        <button\n          class={this.isTabbing ? \"user-is-tabbing\" : undefined}\n          aria-expanded={this.open}\n          aria-controls={this.navId}\n          aria-label={this.showNavMessage}\n          onMouseEnter={() => this.showTooltip()}\n          onMouseLeave={() => this.hideTooltip()}\n          onFocus={() => this.showTooltipForKeyboardUsers()}\n          onBlur={() => this.hideTooltip()}\n          onClick={() => this.handleClick()}\n        >\n          <span class=\"icon\"></span>\n        </button>\n      </Host>\n    );\n  }\n}\n",".link {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  color: inherit;\n  text-decoration: none;\n  min-height: rem-calc(72);\n  text-align: center;\n  padding: 1.25rem 0.5rem;\n  font-weight: 500;\n  outline: none;\n  position: relative;\n\n  &:hover {\n    background-color: $light-background-hover;\n  }\n\n  .icon {\n    font-size: rem-calc(22);\n    color: $sidenav-icon;\n  }\n\n  .text {\n    font-size: rem-calc(14);\n  }\n\n  &.user-is-tabbing:focus {\n    // from P&SS\n    box-shadow: inset 0 2px 2px 0 rgb(244 243 246 / 20%), inset 0 2px 2px 0 rgb(0 0 0 / 10%), inset 0 0 4px 3px #61279e;\n  }\n}\n\n.link.active {\n  background-color: $pale-lilac-gray;\n  &:before {\n    content: \"\";\n    // link to or create semantic name\n    background-color: $periwinkle;\n    position: absolute;\n    height: 100%;\n    width: 5px;\n    left: 0;\n  }\n\n  .text {\n    // link to or create semantic name\n    color: $periwinkle;\n  }\n\n  .icon {\n    // link to or create semantic name\n    color: $periwinkle;\n  }\n}\n","import { h, Component, Prop, Element, Host, State, Listen, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-navigation-item\",\n  styleUrl: \"wm-navigation-item.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class NavigationItem {\n  @Element() el!: HTMLWmNavigationItemElement;\n  @Prop() href?: string;\n  @Prop() text?: string;\n  @Prop() active?: boolean;\n\n  @State() isTabbing?: boolean = false;\n  @Event() wmNavigationItemClicked!: EventEmitter;\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  componentWillLoad() {\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n  }\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <a\n          class={`link ${this.active ? \"active\" : \"\"} ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}\n          href={this.href}\n          onClick={() => this.wmNavigationItemClicked.emit()}\n        >\n          <div class=\"icon\" aria-hidden=\"true\">\n            <slot />\n          </div>\n          <div class=\"text\">{this.text}</div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-50ea2036.system.js.map

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

package/dist/ripple/p-56cd4d5e.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,f as o,h as n,H as r,g as i}from"./p-1c23de4a.js";import{g as a,p as s,a as l,d}from"./p-a6d6eae7.js";import{g as b,i as m,v as u}from"./p-c6a0f7e5.js";import{g as w}from"./p-9b2dfb54.js";const p=':host .wm-button,wm-network-uploader .wm-button{-ms-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-moz-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;width:inherit;border:2px solid #575195;color:#575195;font-family:inherit;font-size:0.75rem;font-weight:700;height:2.75rem;padding:0 1.3333333333em;cursor:pointer;position:relative;background:#fff;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-decoration:none;text-transform:uppercase;letter-spacing:0.01875rem;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button,wm-network-uploader .wm-button{height:3.3333333333em}}:host .wm-button.nowrap,wm-network-uploader .wm-button.nowrap{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .wm-button:focus,wm-network-uploader .wm-button:focus{outline:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button::-moz-focus-inner,wm-network-uploader .wm-button::-moz-focus-inner{border:0;outline:none}:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,wm-network-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-network-uploader .wm-button.-textonly .button-text,wm-network-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-network-uploader .wm-button.-textonly .button-text{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 1em;border-radius:0;line-height:normal}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled),wm-network-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark),wm-network-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark){-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner,wm-network-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner{border:0}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled),wm-network-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled){background:transparent;border:2px solid #fff;color:#fff}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover,wm-network-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark,wm-network-uploader .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-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 #c6b4e3;-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 #c6b4e3;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 #c6b4e3;outline:none}:host .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption),wm-network-uploader .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption){-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9)}:host .wm-button .mdi,wm-network-uploader .wm-button .mdi{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}:host .wm-button:not(.-icononly):not(.-navigational) .mdi,wm-network-uploader .wm-button:not(.-icononly):not(.-navigational) .mdi{margin-right:0.3125rem}:host .wm-button[dir=RTL] :not(.-icononly) .mdi,wm-network-uploader .wm-button[dir=RTL] :not(.-icononly) .mdi{margin-left:0.3125rem;margin-right:0}:host .wm-button.-primary:not(.-textonly),wm-network-uploader .wm-button.-primary:not(.-textonly){background:#575195;color:#fff}:host .wm-button.-primary:not(.-textonly):not(:focus),wm-network-uploader .wm-button.-primary:not(.-textonly):not(:focus){-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2)}:host .wm-button.-primary:not(.-textonly):hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-primary:not(.-textonly):hover:not(:disabled):not(.disabled){background:#464177}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover,wm-network-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-secondary:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-secondary:hover:not(:disabled):not(.disabled),:host .wm-button.-selector:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-selector:hover:not(:disabled):not(.disabled),:host .wm-button.-icononly:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-icononly:hover:not(:disabled):not(.disabled){background:#464177;color:#fff}:host .wm-button.-textonly,wm-network-uploader .wm-button.-textonly{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:inline-block;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;border:none;background:transparent;padding-left:0;padding-right:0;height:auto;border-radius:0;line-height:1}:host .wm-button.-textonly+.-textonly,wm-network-uploader .wm-button.-textonly+.-textonly{margin-left:0.3125rem}:host .wm-button.-textonly:focus,wm-network-uploader .wm-button.-textonly:focus{outline:none}:host .wm-button.-textonly::-moz-focus-inner,wm-network-uploader .wm-button.-textonly::-moz-focus-inner{border:0;outline:none}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text,wm-network-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text{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 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text,wm-network-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text{background:-webkit-gradient(linear, left top, right top, color-stop(66%, #fff), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #fff 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.small,wm-network-uploader .wm-button.-textonly.small{font-size:0.625rem}:host .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete),wm-network-uploader .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete){text-decoration:underline}:host .wm-button.-textonly.-permanentlydelete,wm-network-uploader .wm-button.-textonly.-permanentlydelete{color:#c0392b}:host .wm-button.-textonly.-permanentlydelete:hover:not(:disabled):not(.disabled):not(.dark),wm-network-uploader .wm-button.-textonly.-permanentlydelete:hover:not(:disabled):not(.disabled):not(.dark){text-decoration:underline;color:#c0392b !important}:host .wm-button.-textonly.dark,wm-network-uploader .wm-button.-textonly.dark{color:#fff}:host .wm-button.-textonly.dark:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-textonly.dark:hover:not(:disabled):not(.disabled){text-decoration:underline;color:#fff !important}:host .wm-button.-icononly,wm-network-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-network-uploader .wm-button.-navigational{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;font-size:1rem;padding:0;height:auto;line-height:1;min-width:2.75rem;min-height:2.75rem;text-align:center;letter-spacing:normal}:host .wm-button.-icononly:not(:focus),wm-network-uploader .wm-button.-icononly:not(:focus),:host .wm-button.-navigational:not(:focus),wm-network-uploader .wm-button.-navigational:not(:focus){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button.-icononly,wm-network-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-network-uploader .wm-button.-navigational{min-width:2.5rem;min-height:2.5rem}}:host .wm-button.-icononly,wm-network-uploader .wm-button.-icononly{border-width:1px !important}:host .wm-button.-icononly:before,wm-network-uploader .wm-button.-icononly:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-navigational,wm-network-uploader .wm-button.-navigational{border:none !important;background-color:transparent}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled),wm-network-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled){color:#575195}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled):hover,wm-network-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled):hover,:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled).selected,wm-network-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled).selected{background-color:#d7d6d9}:host .wm-button.-navigational:before,wm-network-uploader .wm-button.-navigational:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-permanentlydelete:not(.-textonly),wm-network-uploader .wm-button.-permanentlydelete:not(.-textonly){background:#c0392b;border-color:#c0392b;color:#fff}:host .wm-button.-permanentlydelete:not(.-textonly):hover:not(:disabled):not(.disabled):not(.dark),wm-network-uploader .wm-button.-permanentlydelete:not(.-textonly):hover:not(:disabled):not(.disabled):not(.dark){background:#9a2e22;border-color:#9a2e22}:host .wm-button.-pairnegative,wm-network-uploader .wm-button.-pairnegative{background:#cc4c3e;border-color:#cc4c3e;color:#fff}:host .wm-button.-pairnegative:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-pairnegative:hover:not(:disabled):not(.disabled){background:#a33d32;border-color:#a33d32}:host .wm-button.-pairpositive,wm-network-uploader .wm-button.-pairpositive{background:#15868d;border-color:#15868d;color:#fff}:host .wm-button.-pairpositive:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-pairpositive:hover:not(:disabled):not(.disabled){background:#116b71;border-color:#116b71}:host .wm-button.-selector,wm-network-uploader .wm-button.-selector,:host .wm-button.-selector-primary,wm-network-uploader .wm-button.-selector-primary{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:block;background:transparent;border:2px solid #575195;border-radius:3px;height:2.75rem;min-width:11.4375rem;padding:0 1.875rem 0 0.9375rem;line-height:normal;font-family:inherit;color:#575195;font-weight:700;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.01875rem;text-align:left}@media screen and (min-width: 48rem){:host .wm-button.-selector,wm-network-uploader .wm-button.-selector,:host .wm-button.-selector-primary,wm-network-uploader .wm-button.-selector-primary{height:2.5rem}}:host .wm-button.-selector:before,wm-network-uploader .wm-button.-selector:before,:host .wm-button.-selector-primary:before,wm-network-uploader .wm-button.-selector-primary:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";position:absolute;right:0.5625rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);font-size:0.875rem;font-weight:700;pointer-events:none}:host .wm-button.-selector:active,wm-network-uploader .wm-button.-selector:active,:host .wm-button.-selector-primary:active,wm-network-uploader .wm-button.-selector-primary:active{-ms-transform:scale(1, 1) !important;-webkit-transform:scale(1, 1) !important;transform:scale(1, 1) !important}:host .wm-button.-selector::-moz-focus-inner,wm-network-uploader .wm-button.-selector::-moz-focus-inner,:host .wm-button.-selector-primary::-moz-focus-inner,wm-network-uploader .wm-button.-selector-primary::-moz-focus-inner{border:0}:host .wm-button.-selector .overflowcontrol,wm-network-uploader .wm-button.-selector .overflowcontrol,:host .wm-button.-selector-primary .overflowcontrol,wm-network-uploader .wm-button.-selector-primary .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:visible}:host .wm-button.-selector.dark:not(:disabled):not(.disabled):hover,wm-network-uploader .wm-button.-selector.dark:not(:disabled):not(.disabled):hover,:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled):hover,wm-network-uploader .wm-button.-selector-primary.dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-selector-primary,wm-network-uploader .wm-button.-selector-primary{background:#575195;color:#fff}:host .wm-button.-selector-primary:hover:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-selector-primary:hover:not(:disabled):not(.disabled){background:#464177}:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled),wm-network-uploader .wm-button.-selector-primary.dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button:disabled,wm-network-uploader .wm-button:disabled,:host .wm-button.disabled,wm-network-uploader .wm-button.disabled{background:inherit;border-color:#737373;color:#737373;cursor:default;pointer-events:none}:host .wm-button:disabled.-primary,wm-network-uploader .wm-button:disabled.-primary,:host .wm-button:disabled.-permanentlydelete,wm-network-uploader .wm-button:disabled.-permanentlydelete,:host .wm-button:disabled.-pairnegative,wm-network-uploader .wm-button:disabled.-pairnegative,:host .wm-button:disabled.-pairpositive,wm-network-uploader .wm-button:disabled.-pairpositive,:host .wm-button.disabled.-primary,wm-network-uploader .wm-button.disabled.-primary,:host .wm-button.disabled.-permanentlydelete,wm-network-uploader .wm-button.disabled.-permanentlydelete,:host .wm-button.disabled.-pairnegative,wm-network-uploader .wm-button.disabled.-pairnegative,:host .wm-button.disabled.-pairpositive,wm-network-uploader .wm-button.disabled.-pairpositive{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-secondary,wm-network-uploader .wm-button:disabled.-secondary,:host .wm-button.disabled.-secondary,wm-network-uploader .wm-button.disabled.-secondary{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button:disabled.-selector,wm-network-uploader .wm-button:disabled.-selector,:host .wm-button.disabled.-selector,wm-network-uploader .wm-button.disabled.-selector{color:#737373}:host .wm-button:disabled.-selector-primary,wm-network-uploader .wm-button:disabled.-selector-primary,:host .wm-button.disabled.-selector-primary,wm-network-uploader .wm-button.disabled.-selector-primary{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-textonly,wm-network-uploader .wm-button:disabled.-textonly,:host .wm-button.disabled.-textonly,wm-network-uploader .wm-button.disabled.-textonly{color:#6b6b6b;background:transparent}:host .wm-button:disabled.dark.-secondary:not(.-permanentlydelete),wm-network-uploader .wm-button:disabled.dark.-secondary:not(.-permanentlydelete),:host .wm-button:disabled.dark.-selector,wm-network-uploader .wm-button:disabled.dark.-selector,:host .wm-button:disabled.dark.-textonly,wm-network-uploader .wm-button:disabled.dark.-textonly,:host .wm-button:disabled.dark.-navigational,wm-network-uploader .wm-button:disabled.dark.-navigational,:host .wm-button:disabled.dark.-icononly,wm-network-uploader .wm-button:disabled.dark.-icononly,:host .wm-button.disabled.dark.-secondary:not(.-permanentlydelete),wm-network-uploader .wm-button.disabled.dark.-secondary:not(.-permanentlydelete),:host .wm-button.disabled.dark.-selector,wm-network-uploader .wm-button.disabled.dark.-selector,:host .wm-button.disabled.dark.-textonly,wm-network-uploader .wm-button.disabled.dark.-textonly,:host .wm-button.disabled.dark.-navigational,wm-network-uploader .wm-button.disabled.dark.-navigational,:host .wm-button.disabled.dark.-icononly,wm-network-uploader .wm-button.disabled.dark.-icononly{color:#b5b5b5;border-color:#b5b5b5}:host .wm-button:disabled.dark.-primary,wm-network-uploader .wm-button:disabled.dark.-primary,:host .wm-button:disabled.dark.-selector-primary,wm-network-uploader .wm-button:disabled.dark.-selector-primary,:host .wm-button:disabled.dark.-permanentlydelete:not(.-textonly),wm-network-uploader .wm-button:disabled.dark.-permanentlydelete:not(.-textonly),:host .wm-button.disabled.dark.-primary,wm-network-uploader .wm-button.disabled.dark.-primary,:host .wm-button.disabled.dark.-selector-primary,wm-network-uploader .wm-button.disabled.dark.-selector-primary,:host .wm-button.disabled.dark.-permanentlydelete:not(.-textonly),wm-network-uploader .wm-button.disabled.dark.-permanentlydelete:not(.-textonly){background:#a6a6a6;border-color:#a6a6a6;color:#353b48}:host a.wm-button,wm-network-uploader a.wm-button,:host label.wm-button,wm-network-uploader label.wm-button{height:auto;padding-top:0.75rem;padding-bottom:0.75rem}:host,wm-network-uploader{width:100%;position:relative}:host[dir=RTL] .mdi,wm-network-uploader[dir=RTL] .mdi{margin-left:0.3125rem;margin-right:0}:host input:focus+.wm-button.user-is-tabbing,wm-network-uploader input:focus+.wm-button.user-is-tabbing{-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;-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;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}:host *,wm-network-uploader *{-webkit-box-sizing:border-box;box-sizing:border-box}.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}.header{position:relative;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-wrap:wrap;flex-wrap:wrap}.header .notif-wrapper{-ms-flex-align:end;align-items:flex-end}.notif-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}.notif-wrapper .notif{font-size:0.875rem;font-style:italic;margin-top:0.25rem}@media (max-width: 60.9375rem){.descr{margin-bottom:0.5rem}.notif-wrapper{margin-bottom:1rem}.header .notif-wrapper{-ms-flex-align:start;align-items:flex-start}}.file-info{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.file-info+.file-controls{-ms-flex:none;flex:none;margin-left:1rem}.empty-block{margin:5rem auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}.empty-block .upload-file{margin-bottom:1.875rem}.empty-block .empty-message{font-size:1.5rem;margin-bottom:0.4375rem}.empty-block .notif-wrapper{-ms-flex-pack:center;justify-content:center}.empty-block .notif-wrapper .wm-button{width:auto}ul{list-style:none;padding:0;width:100%}ul li{font-size:0.875rem}ul li .file{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:relative;height:3.75rem;padding:0.5rem 1.25rem;background:#f4f4f4;border:1px solid #6b6b6b;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}ul li .file+.file{margin-top:1.25rem}ul li .file .filename{font-weight:500}ul li .file .filedate{margin-left:3.75rem;font-weight:normal;font-style:italic}ul li .file wm-button+wm-button{margin-left:1rem}ul.file-list .file.--saved,ul.inprogress-list .file{margin-bottom:1.625rem}ul .progress{position:absolute;left:0;top:0;right:0;height:8px}ul.error-list li{margin-bottom:1.25rem;color:#c0392b}ul.error-list li .file{border:1px solid #c0392b;background-color:#f5ebea;height:3.75rem}ul .error-message{padding-top:0.25rem;font-style:italic}';const h=class{constructor(o){t(this,o);this.wmNetworkUploaderFilesChanged=e(this,"wmNetworkUploaderFilesChanged",7);this.inputId=b();this.isTabbing=false;this.fileList=[];this.inProgressList=[];this.errorList=[];this.notif=undefined;this.snackbar=[];this.numFilesInProgress=undefined;this.getPath=undefined;this.requestUploadPath=undefined;this.uploadPath=undefined;this.requestDownloadPath=undefined;this.deletePath=undefined;this.associatedData=undefined;this.buttonText=undefined;this.emptyStateText=undefined;this.icon=undefined;this.fileTypes="pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv";this.maxSize=100;this.maxFiles=undefined;this.sortBy="date"}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleUploadProgress(t){this.inProgressList.map((e=>{if(e.name===t.detail.file_name){e.progress=t.detail.progress;o(this.el)}}));if(t.detail.progress===100){this.numFilesInProgress-=1}if(!this.srProgress&&this.numFilesInProgress){const t=this.numFilesInProgress;this.srProgress=setInterval((()=>{const e=this.inProgressList.reduce(((t,e)=>e.progress?t+e.progress:t),0);if(this.liveRegion){this.liveRegion.innerHTML=m.formatMessage({id:"uploader.uploadProgress",defaultMessage:"Upload progress: {percentage}%"},{percentage:Math.floor(e/t)})}}),5e3)}}handleFinishedSnack(t){this.snackbar=this.snackbar.filter((e=>e.id!==t.detail.id))}setMaxSize(){this.maxSize=this.maxSize>100?100:this.maxSize}uploadNotifications(t,e){if(e>0&&t===0){setTimeout((()=>{this.notif=null}),20*1e3);const t=m.formatMessage({id:"uploader.finishedUploading",defaultMessage:"Finished uploading"});this.notif={id:5,message:t};if(this.liveRegion){this.liveRegion.innerHTML=t}this.numFilesInProgress=null;clearInterval(this.srProgress);o(this.el)}else if(t>0&&t!=e){const e=m.formatMessage({id:"uploader.filesUploading",defaultMessage:"{num, plural, one {1 file uploading} other {# files uploading}}"},{num:t});this.notif={id:6,message:e};if(this.liveRegion){this.liveRegion.innerHTML=e}o(this.el)}}emitFileListEvent(){this.wmNetworkUploaderFilesChanged.emit(this.fileList)}formatDate(t,e,o){const n=Date.parse(t);if(e.match(/^[a-zA-Z]*(-[a-zA-Z0-9]*)*$/g)){try{Intl.getCanonicalLocales(e)}catch(t){e="en-us"}}else{return t}if(!!n){const t=new Date(n);const r=t.getFullYear();const i=("0"+(t.getMonth()+1)).substr(-2);const a=("0"+t.getDate()).substr(-2);const s=t.toLocaleTimeString([e,"en-us"],{timeZone:o,hour:"numeric",minute:"numeric"});return`${r}/${i}/${a} ${s}`}else{return t}}isValidSize(t){return t/1024/1024<=this.maxSize}isDuplicate(t){return this.fileList.find((e=>e.file_name===t))}isEmpty(){return!this.fileList.length&&!this.inProgressList.length&&!this.errorList.length}get isDisabled(){const t=!!this.maxFiles&&this.fileList.length>=this.maxFiles;if(!this.notif){if(t){const t=m.formatMessage({id:"uploader.fileUploadLimitExceeded",defaultMessage:"Upload unsuccessful because file selection would exceed the maximum number of files",description:"Message displayed when trying to upload too many files"});this.notif={id:1,message:t};if(this.liveRegion){this.liveRegion.innerHTML=t}}else{this.notif=null}}else if(this.notif.id===1){if(!t){this.notif=null}}return t||this.numFilesInProgress>0}purgeProgressList(t){this.inProgressList=this.inProgressList.filter((e=>e.progress!==100&&e.name!==t.file_name))}getExistingFiles(){a(this.getPath).then((t=>{t.map((t=>this.purgeProgressList(t)));if(this.sortBy==="name"){t.sort(((t,e)=>t.file_name.localeCompare(e.file_name)))}this.fileList=t})).catch((t=>{console.error(t)}))}clearErrors(){this.errorList=[];this.notif=null}handleFiles(t){const e=Array.from(t.target.files);const n=this.fileTypes.split(" ").join(", ");if(!!this.maxFiles&&this.fileList.length+e.length>this.maxFiles){const t=m.formatMessage({id:"uploader.fileUploadLimitExceeded",defaultMessage:"Upload unsuccessful because file selection would exceed the maximum number of files",description:"Message displayed when trying to upload too many files"});this.notif={id:2,message:t};if(this.liveRegion){this.liveRegion.innerHTML=t}}else{e&&e.map((t=>{if(!u(t,this.fileTypes)){const e={file_name:t.name,message:m.formatMessage({id:"uploader.invalidFileType",defaultMessage:"The file type is invalid. Accepted types: {validTypes}"},{validTypes:n})};this.errorList.push(e)}else if(!this.isValidSize(t.size)){const e={file_name:t.name,message:m.formatMessage({id:"uploader.fileTooLarge",defaultMessage:"The selected file is too large. Maximum file size is {size}Mb"},{size:this.maxSize})};this.errorList.push(e)}else if(this.isDuplicate(t.name)){const e={file_name:t.name,message:m.formatMessage({id:"uploader.duplicateName",defaultMessage:"A file with this name already exists."})};this.errorList.push(e)}else{this.inProgressList.push(t)}o(this.el)}));if(this.inProgressList.length>0){this.numFilesInProgress=this.inProgressList.length;this.inProgressList.map(((t,e)=>{this.uploadFile(t,e)}))}}t.target.value=""}uploadFile(t,e){a(this.requestUploadPath+e.toString()).then((async e=>{const o=JSON.parse(this.associatedData);const n=Object.assign(Object.assign({},o),{file_name:t.name,mime_type:t.type,file_path:e.path,document_uuid:e.guid});const r=e=>{const o=e.lengthComputable&&e.total!==0?e.loaded/e.total*100:0;const n=new CustomEvent("wmUploadProgress",{detail:{file_name:t.name,progress:o}});this.el.dispatchEvent(n)};await s(e.url,t,r);await l(this.uploadPath,n);this.getExistingFiles()})).catch((t=>{this.numFilesInProgress=null;this.inProgressList=[];this.notif={id:3,message:w.genericError};console.error(t)}))}downloadFile(t,e){this.clearErrors();const o={file_path:e,file_uuid:t};l(this.requestDownloadPath,o).then((t=>{window.location.assign(t.url)})).catch((t=>{console.error(t)}))}deleteFile(t){this.clearErrors();this.snackbar.push({message:m.formatMessage({id:"uploader.fileDeleted",defaultMessage:"{fileName} was deleted."},{fileName:t.file_name}),id:t.uuid,link:""});this.fileList=this.fileList.filter((e=>e.uuid!==t.uuid));d(`${this.deletePath}/${t.uuid}`).catch((e=>{this.notif={id:4,message:m.formatMessage({id:"uploader.fileNotDeleted",defaultMessage:"{fileName} could not be deleted."},{fileName:t.file_name})};this.getExistingFiles();console.error(e)}))}componentWillLoad(){if(!this.getPath){throw new Error("wm-network-uploader: get-path is a required prop")}if(!this.requestUploadPath){throw new Error("wm-network-uploader: request-upload-path is a required prop")}if(!this.uploadPath){throw new Error("wm-network-uploader: upload-path is a required prop")}if(!this.requestDownloadPath){throw new Error("wm-network-uploader: request-download-path is a required prop")}if(!this.deletePath){throw new Error("wm-network-uploader: delete-path is a required prop")}if(!this.buttonText){throw new Error("wm-network-uploader: button-text is a required prop")}if(!this.emptyStateText){throw new Error("wm-network-uploader: empty-state-text is a required prop")}if(!this.associatedData){throw new Error("wm-network-uploader: associated-data is a required prop")}this.setMaxSize();this.clearErrors()}componentDidLoad(){this.getExistingFiles();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}}uploadButtonOnClick(t){if(this.isDisabled){t.preventDefault();if(this.liveRegion){const t=!!this.maxFiles&&this.fileList.length>=this.maxFiles;let e="";if(this.numFilesInProgress>0){e=m.formatMessage({id:"uploader.waitToUpload",defaultMessage:"Please wait for current upload to complete before uploading new files.",description:"Message for screen reader users"})}else if(t){e=m.formatMessage({id:"uploader.fileUploadLimitExceeded",defaultMessage:"Upload unsuccessful because file selection would exceed the maximum number of files",description:"Message displayed when trying to upload too many files"})}if(e){this.liveRegion.innerHTML="";new Promise((t=>{setTimeout((()=>{t("")}),500)})).then((()=>this.liveRegion.innerHTML=e))}}}else{this.clearErrors()}}renderUploadSvg(){return n("svg",{class:"upload-file",width:"91",height:"84",viewBox:"0 0 91 84"},n("path",{transform:"rotate(-180.000000) translate(-452, -255.5)",fill:"#eae8ec",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"}))}renderIcon(){const t=this.icon&&this.icon==="f066";return this.icon&&n("span",{class:`mdi ${t?"rotate":""}`},String.fromCodePoint(parseInt(`0x${this.icon}`)))}renderNotif(){return this.notif?n("span",{class:"notif"},this.notif.message):""}renderUploadButton(t){return n("div",{class:"notif-wrapper"},n("input",{name:this.inputId,id:this.inputId,class:"sr-only",type:"file",multiple:true,onClick:t=>this.uploadButtonOnClick(t),onChange:t=>this.handleFiles(t)}),n("label",{htmlFor:this.inputId,class:`wm-button ${t}${this.isTabbing?" user-is-tabbing":""}`},this.renderIcon(),this.buttonText),this.renderNotif())}renderWithItems(){return n("div",null,n("div",{class:"header"},n("div",{class:"descr"},n("slot",null)),this.renderUploadButton(this.isDisabled?"disabled":"")),this.renderErrorList(),this.renderInProgressList(),this.renderFileList())}renderEmptyState(){return n("div",null,n("div",{class:"header"},n("div",{class:"descr"},n("slot",null))),n("div",{class:"empty-block"},this.renderUploadSvg(),n("div",{class:"empty-message"},this.emptyStateText),this.renderUploadButton("-primary empty-button")))}renderErrorList(){if(!!this.errorList.length){if(this.liveRegion){let t=this.errorList.reduce((function(t,e){return t+`${e.file_name}: ${e.message} `}),"");this.liveRegion.innerHTML=t}return n("ul",{class:"error-list"},this.errorList.map((t=>n("li",null,n("div",{class:"file --error"},n("div",{class:"file-info"},n("span",{class:"filename"},t.file_name))),n("div",{class:"error-message"},t.message)))))}}renderInProgressList(){return n("ul",{class:"inprogress-list"},this.inProgressList.map((t=>n("li",null,n("div",{class:"file --progress"},n("div",{class:"progress",style:{background:`linear-gradient(to right, rgba(67, 126, 142, 1) ${t.progress}%, transparent ${t.progress}%)`}}),n("div",{class:"file-info"},n("span",{class:"filename"},t.name," ",n("span",{class:"sr-only"},"uploading"))))))))}renderFile(t){return n("li",null,n("div",{class:"file --saved"},n("div",{class:"file-info"},n("span",{class:"filename"},t.file_name),n("span",{class:"filedate"},this.formatDate(t.updated_at,m.locale,Intl.DateTimeFormat().resolvedOptions().timeZone))),n("div",{class:"file-controls"},n("wm-button",{class:"download-button","button-type":"icononly",tooltip:"download","label-for-identical-buttons":`download ${t.file_name}`,icon:"f1da",onClick:()=>this.downloadFile(t.uuid,t.file_path)}),n("wm-button",{class:"delete-button","button-type":"icononly",tooltip:"remove","label-for-identical-buttons":`remove ${t.file_name}`,icon:"f1c0",onClick:()=>this.deleteFile(t)}))))}renderFileList(){return n("ul",{class:"file-list"},this.fileList.map((t=>this.renderFile(t))))}render(){return n(r,null,this.isEmpty()?this.renderEmptyState():this.renderWithItems(),n("wm-snackbar",{notifications:JSON.stringify(this.snackbar)}),n("div",{ref:t=>this.liveRegion=t,class:"live-region sr-only","aria-live":"assertive","aria-atomic":"true"}))}get el(){return i(this)}static get watchers(){return{maxSize:["setMaxSize"],numFilesInProgress:["uploadNotifications"],fileList:["emitFileListEvent"]}}};h.style=p;export{h as wm_network_uploader};
-//# sourceMappingURL=p-56cd4d5e.entry.js.map

package/dist/ripple/p-56cd4d5e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmNetworkUploaderCss","NetworkUploader","this","inputId","generateId","toggleTabbingOn","isTabbing","toggleTabbingOff","handleUploadProgress","ev","inProgressList","map","i","name","detail","file_name","progress","forceUpdate","el","numFilesInProgress","srProgress","total","setInterval","aggregate","reduce","avg","item","liveRegion","innerHTML","intl","formatMessage","id","defaultMessage","percentage","Math","floor","handleFinishedSnack","snackbar","filter","n","setMaxSize","maxSize","uploadNotifications","newNum","oldNum","setTimeout","notif","message","clearInterval","num","emitFileListEvent","wmNetworkUploaderFilesChanged","emit","fileList","formatDate","isoDate","locale","timezone","timestamp","Date","parse","match","Intl","getCanonicalLocales","_a","date","year","getFullYear","month","getMonth","substr","day","getDate","time","toLocaleTimeString","timeZone","hour","minute","isValidSize","size","isDuplicate","find","f","isEmpty","length","errorList","isDisabled","isMax","maxFiles","errMessage","description","purgeProgressList","getExistingFiles","getRequest","getPath","then","reply","sortBy","sort","a","b","localeCompare","catch","errStatus","console","error","clearErrors","handleFiles","files","Array","from","target","validTypes","fileTypes","split","join","file","hasValidType","push","uploadFile","value","requestUploadPath","toString","async","assData","JSON","associatedData","fileInfo","Object","assign","mime_type","type","file_path","path","document_uuid","guid","onProgress","lengthComputable","loaded","event","CustomEvent","dispatchEvent","putRequest","url","postRequest","uploadPath","err","globalMessages","genericError","downloadFile","uuid","payload","file_uuid","requestDownloadPath","window","location","deleteFile","fileName","link","deleteRequest","deletePath","componentWillLoad","Error","buttonText","emptyStateText","componentDidLoad","document","body","classList","contains","uploadButtonOnClick","preventDefault","errMsg","Promise","resolve","renderUploadSvg","h","class","width","height","viewBox","transform","fill","d","renderIcon","rotate","icon","String","fromCodePoint","parseInt","renderNotif","renderUploadButton","classes","multiple","onClick","onChange","e","htmlFor","renderWithItems","renderErrorList","renderInProgressList","renderFileList","renderEmptyState","srMessage","acc","style","background","renderFile","updated_at","DateTimeFormat","resolvedOptions","tooltip","render","Host","notifications","stringify","ref"],"sources":["./src/components/wm-uploader/wm-network-uploader/wm-network-uploader.scss?tag=wm-network-uploader&encapsulation=shadow","./src/components/wm-uploader/wm-network-uploader/wm-network-uploader.tsx"],"sourcesContent":[":host,\nwm-network-uploader {\n  width: 100%;\n  position: relative;\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-network-uploader * {\n  box-sizing: border-box;\n}\n\n.sr-only {\n  @include srOnly;\n}\n\n.header {\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  flex-wrap: wrap;\n\n  .notif-wrapper {\n    align-items: flex-end;\n  }\n}\n\n.notif-wrapper {\n  display: flex;\n  align-items: flex-start; // for .notif\n  height: -moz-fit-content;\n  height: fit-content;\n  flex-direction: column; // for.notif\n  align-items: center; // for.notif\n  .notif {\n    font-size: 0.875rem;\n    font-style: italic;\n    margin-top: rem-calc(4);\n  }\n}\n\n@media (max-width: rem-calc(975)) {\n  .descr {\n    margin-bottom: rem-calc(8);\n  }\n  .notif-wrapper {\n    margin-bottom: rem-calc(16);\n  }\n  .header {\n    .notif-wrapper {\n      align-items: flex-start;\n    }\n  }\n}\n\n.file-info {\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n\n  + .file-controls {\n    flex: none;\n    margin-left: rem-calc(16);\n  }\n}\n\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: 1.5rem;\n    margin-bottom: rem-calc(7);\n  }\n\n  .notif-wrapper {\n    justify-content: center;\n\n    .wm-button {\n      // Removing the width inherit here to prevent a 100% width\n      // from the notif-wrapper. Future proofing a day when\n      // we might want a long notif to wrap.\n      width: auto;\n    }\n  }\n}\n\nul {\n  list-style: none;\n  padding: 0;\n  width: 100%;\n  li {\n    font-size: rem-calc(14);\n    .file {\n      @include border-radius(3px);\n      position: relative; // for progress bar\n      height: rem-calc(60);\n      padding: rem-calc(8 20);\n      background: $background;\n      border: 1px solid rgb(107, 107, 107);\n\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n\n      + .file {\n        margin-top: rem-calc(20);\n      }\n\n      .filename {\n        font-weight: 500;\n      }\n\n      .filedate {\n        margin-left: rem-calc(60);\n        font-weight: normal;\n        font-style: italic;\n      }\n\n      wm-button + wm-button {\n        margin-left: rem-calc(16);\n      }\n    }\n  }\n\n  &.file-list .file.--saved,\n  &.inprogress-list .file {\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\n  .progress {\n    position: absolute;\n    left: 0;\n    top: 0;\n    right: 0;\n    height: 8px;\n  }\n\n  &.error-list li {\n    margin-bottom: rem-calc(20);\n    color: $error-color;\n    .file {\n      border: 1px solid $error-color;\n      background-color: #f5ebea;\n      height: rem-calc(60);\n    }\n  }\n  .error-message {\n    padding-top: rem-calc(4);\n    font-style: italic;\n  }\n}\n","import { Component, Element, h, Host, Prop, State, Listen, Watch, Event, EventEmitter } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { getRequest, postRequest, putRequest, deleteRequest } from \"../../../global/services/http-service\";\nimport { intl, generateId, hasValidType } from \"../../../global/functions\";\nimport { globalMessages } from \"../../../global/intl\";\n//\n// Web API File interface => for FileList on input element, sending to AWS\n// Custom FileInfo interface (below) => for our server\nexport interface FileInfo {\n  file_name: string;\n  file_path?: string;\n  mime_type: string;\n  updated_at?: string;\n\n  uuid?: string; // AWS guid\n  document_uuid?: string; // aka file uuid. how is that different from the uuid above?\n  // organization_uuid: string; // aka node uuid\n}\n\ninterface FileInProgress extends File {\n  progress?: number;\n}\n\ninterface ErrorInfo {\n  file_name: string;\n  message: string;\n}\n\ninterface AWSData {\n  url: string;\n  updated_at: string;\n  path: string;\n  guid: string;\n}\n\ninterface Notification {\n  message: string;\n  id: string;\n  link: string;\n}\n\n@Component({\n  tag: \"wm-network-uploader\",\n  styleUrl: \"wm-network-uploader.scss\",\n  shadow: true,\n})\nexport class NetworkUploader {\n  @Element() el!: HTMLWmNetworkUploaderElement;\n  private liveRegion?: HTMLDivElement;\n\n  @State() isTabbing: boolean = false;\n\n  @State() fileList: FileInfo[] = [];\n  @State() inProgressList: FileInProgress[] = [];\n  @State() errorList: ErrorInfo[] = []; // for errors on a particular file\n  @State() notif?: { id: number; message: string } | null; // for global errors, e.g. user tries uploading too many files, and upload notifications\n  @State() snackbar: Notification[] = [];\n  @State() numFilesInProgress?: number | null; // null when not uploading != 0 (when all files are done uploading) != undefined (original state)\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\n  @Prop() getPath!: string;\n  @Prop() requestUploadPath!: string;\n  @Prop() uploadPath!: string; // used for POST request (create db entry)\n  @Prop() requestDownloadPath!: string;\n  @Prop() deletePath!: string;\n\n  @Prop() associatedData?: string;\n  @Prop() buttonText!: 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({ mutable: true }) maxSize: number = 100; // in Mb\n  @Prop() maxFiles?: number;\n  @Prop() sortBy: \"name\" | \"date\" = \"date\"; // name is descending (a -> z), date is ascending (earlier -> later)\n\n  @Event() wmNetworkUploaderFilesChanged!: EventEmitter<Object[]>;\n\n  private inputId = generateId();\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.inProgressList.map((i) => {\n      if (i.name === ev.detail.file_name) {\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.inProgressList.reduce((avg, item) => (item.progress ? avg + item.progress : avg), 0);\n        if (this.liveRegion) {\n          this.liveRegion.innerHTML = intl.formatMessage(\n            {\n              id: \"uploader.uploadProgress\",\n              defaultMessage: \"Upload progress: {percentage}%\",\n            },\n            { percentage: Math.floor(aggregate / total) }\n          );\n        }\n      }, 5000);\n    }\n  }\n\n  @Listen(\"userFinishedSnack\")\n  handleFinishedSnack(ev: CustomEvent) {\n    this.snackbar = this.snackbar.filter((n) => n.id !== ev.detail.id);\n  }\n\n  @Watch(\"maxSize\")\n  setMaxSize() {\n    // Max size can't be set above 100Mb\n    this.maxSize = this.maxSize > 100 ? 100 : this.maxSize;\n  }\n\n  @Watch(\"numFilesInProgress\")\n  uploadNotifications(newNum: number, oldNum: number) {\n    if (oldNum > 0 && newNum === 0) {\n      setTimeout(() => {\n        this.notif = null;\n      }, 20 * 1000);\n      const message = intl.formatMessage({\n        id: \"uploader.finishedUploading\",\n        defaultMessage: \"Finished uploading\",\n      });\n      this.notif = { id: 5, message };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = message;\n      }\n      this.numFilesInProgress = null;\n      clearInterval(this.srProgress);\n      forceUpdate(this.el);\n    } else if (newNum > 0 && newNum != oldNum) {\n      const message = intl.formatMessage(\n        {\n          id: \"uploader.filesUploading\",\n          defaultMessage: \"{num, plural, one {1 file uploading} other {# files uploading}}\",\n        },\n        { num: newNum }\n      );\n      this.notif = { id: 6, message };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = message;\n      }\n      forceUpdate(this.el);\n    }\n  }\n\n  @Watch(\"fileList\")\n  emitFileListEvent() {\n    this.wmNetworkUploaderFilesChanged.emit(this.fileList);\n  }\n\n  formatDate(isoDate: string, locale: string, timezone: string) {\n    const timestamp = Date.parse(isoDate);\n    if (locale.match(/^[a-zA-Z]*(-[a-zA-Z0-9]*)*$/g)) {\n      // make sure locale is valid, otherwise set default locale\n      try {\n        //@ts-ignore\n        Intl.getCanonicalLocales(locale);\n      } catch {\n        locale = \"en-us\";\n      }\n    } else {\n      return isoDate;\n    }\n\n    if (!!timestamp) {\n      const date = new Date(timestamp);\n      const year = date.getFullYear();\n      const month = (\"0\" + (date.getMonth() + 1)).substr(-2);\n      const day = (\"0\" + date.getDate()).substr(-2);\n      const time = date.toLocaleTimeString([locale, \"en-us\"], {\n        timeZone: timezone,\n        hour: \"numeric\",\n        minute: \"numeric\",\n      });\n      return `${year}/${month}/${day} ${time}`;\n    } else {\n      return isoDate;\n    }\n  }\n\n  isValidSize(size: number) {\n    // https://stackoverflow.com/questions/2365100/converting-bytes-to-megabytes\n    return size / 1024 / 1024 <= this.maxSize;\n  }\n\n  isDuplicate(name: string) {\n    return this.fileList.find((f) => f.file_name === name);\n  }\n\n  isEmpty() {\n    return !this.fileList.length && !this.inProgressList.length && !this.errorList.length;\n  }\n\n  get isDisabled() {\n    const isMax = !!this.maxFiles && this.fileList.length >= this.maxFiles;\n\n    if (!this.notif) {\n      if (isMax) {\n        const errMessage = intl.formatMessage({\n          id: \"uploader.fileUploadLimitExceeded\",\n          defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n          description: \"Message displayed when trying to upload too many files\",\n        });\n        this.notif = { id: 1, message: errMessage };\n        if (this.liveRegion) {\n          this.liveRegion.innerHTML = errMessage;\n        }\n      } else {\n        this.notif = null;\n      }\n    } else if (this.notif.id === 1) {\n      // to make sure SR don't repeat the error, don't reset it if it already is showing\n      // just dismiss it if isMax is not true anymore\n      if (!isMax) {\n        this.notif = null;\n      }\n      // finally do nothing if error 2 is showing (special case when user selects too many files)\n    }\n    // disable if is the uploader is maxed out or if something is uploading\n    return isMax || this.numFilesInProgress! > 0;\n  }\n\n  purgeProgressList(item: FileInfo) {\n    // If a file is retrieved from the server because it was just uploaded\n    // it should be removed from inProgressList\n    this.inProgressList = this.inProgressList.filter((i) => i.progress !== 100 && i.name !== item.file_name);\n  }\n\n  getExistingFiles() {\n    getRequest(this.getPath)\n      .then((reply: FileInfo[]) => {\n        reply.map((item) => this.purgeProgressList(item));\n        if (this.sortBy === \"name\") {\n          reply.sort((a, b) => a.file_name.localeCompare(b.file_name));\n        }\n        this.fileList = reply;\n      })\n      .catch((errStatus) => {\n        console.error(errStatus);\n      });\n  }\n\n  clearErrors() {\n    this.errorList = [];\n    this.notif = null;\n  }\n\n  handleFiles(ev: Event) {\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      const errMessage = intl.formatMessage({\n        id: \"uploader.fileUploadLimitExceeded\",\n        defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n        description: \"Message displayed when trying to upload too many files\",\n      });\n      this.notif = { id: 2, message: errMessage };\n      if (this.liveRegion) {\n        this.liveRegion.innerHTML = errMessage;\n      }\n    } else {\n      // map to create inProgress items so they can be displayed immediately\n      files &&\n        files.map((file) => {\n          if (!hasValidType(file, this.fileTypes)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage(\n                {\n                  id: \"uploader.invalidFileType\",\n                  defaultMessage: \"The file type is invalid. Accepted types: {validTypes}\",\n                },\n                { validTypes }\n              ),\n            };\n            this.errorList.push(error);\n          } else if (!this.isValidSize(file.size)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage(\n                {\n                  id: \"uploader.fileTooLarge\",\n                  defaultMessage: \"The selected file is too large. Maximum file size is {size}Mb\",\n                },\n                { size: this.maxSize }\n              ),\n            };\n            this.errorList.push(error);\n          } else if (this.isDuplicate(file.name)) {\n            const error = {\n              file_name: file.name,\n              message: intl.formatMessage({\n                id: \"uploader.duplicateName\",\n                defaultMessage: \"A file with this name already exists.\",\n              }),\n            };\n            this.errorList.push(error);\n          } else {\n            this.inProgressList.push(file);\n          }\n          forceUpdate(this.el);\n        });\n\n      if (this.inProgressList.length > 0) {\n        this.numFilesInProgress = this.inProgressList.length;\n\n        // map over \"uploadable\" files for actual upload\n        // this happens separately otherwise at each pass we'd have to wait for the requests to complete before displaying things\n        this.inProgressList.map((file, i) => {\n          this.uploadFile(file, i); // = input.files file\n        });\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  uploadFile(file: File, i: number) {\n    // get upload link\n    getRequest(this.requestUploadPath + i.toString())\n      .then(async (reply: AWSData) => {\n        const assData = JSON.parse(this.associatedData!);\n        const fileInfo: FileInfo = {\n          ...assData,\n          file_name: file.name,\n          mime_type: file.type,\n          file_path: reply.path,\n          document_uuid: reply.guid,\n        };\n\n        // onProgress is passed as a callback to the ev listener inside putRequest (http service),\n        // so we can't change component things directly => custom event to pass data to uploader component.\n        const onProgress = (ev: ProgressEvent) => {\n          const progress = ev.lengthComputable && ev.total !== 0 ? (ev.loaded / ev.total) * 100 : 0;\n          const event = new CustomEvent(\"wmUploadProgress\", {\n            detail: { file_name: file.name, progress },\n          });\n\n          this.el.dispatchEvent(event);\n        };\n\n        // upload to AWS s3 to url we just fetched\n        await putRequest(reply.url, file, onProgress);\n\n        // create the db entry\n        await postRequest(this.uploadPath, fileInfo);\n\n        // get files from server again\n        this.getExistingFiles();\n      })\n      .catch((err) => {\n        // do not show toast on error\n        this.numFilesInProgress = null;\n        // do not show in progress item on error\n        this.inProgressList = [];\n        this.notif = {\n          id: 3,\n          message: globalMessages.genericError,\n        };\n        console.error(err);\n      });\n  }\n\n  downloadFile(uuid: string, path: string) {\n    this.clearErrors();\n\n    // POST request to get temporary download link\n    const payload = {\n      file_path: path,\n      file_uuid: uuid,\n    };\n    postRequest(this.requestDownloadPath, payload)\n      .then((reply: { url: string }) => {\n        // we got the download link, now download the file\n        window.location.assign(reply.url);\n      })\n      .catch((err) => {\n        console.error(err);\n      });\n  }\n\n  deleteFile(file: FileInfo) {\n    this.clearErrors();\n\n    this.snackbar.push({\n      message: intl.formatMessage(\n        {\n          id: \"uploader.fileDeleted\",\n          defaultMessage: \"{fileName} was deleted.\",\n        },\n        { fileName: file.file_name }\n      ),\n      id: file.uuid!,\n      link: \"\",\n    });\n\n    // rm file from list immediately.\n    this.fileList = this.fileList.filter((i) => i.uuid !== file.uuid);\n\n    deleteRequest(`${this.deletePath}/${file.uuid}`).catch((err) => {\n      this.notif = {\n        id: 4,\n        message: intl.formatMessage(\n          {\n            id: \"uploader.fileNotDeleted\",\n            defaultMessage: \"{fileName} could not be deleted.\",\n          },\n          { fileName: file.file_name }\n        ),\n      };\n      this.getExistingFiles();\n      console.error(err);\n    });\n  }\n\n  componentWillLoad() {\n    if (!this.getPath) {\n      throw new Error(\"wm-network-uploader: get-path is a required prop\");\n    }\n    if (!this.requestUploadPath) {\n      throw new Error(\"wm-network-uploader: request-upload-path is a required prop\");\n    }\n    if (!this.uploadPath) {\n      throw new Error(\"wm-network-uploader: upload-path is a required prop\");\n    }\n    if (!this.requestDownloadPath) {\n      throw new Error(\"wm-network-uploader: request-download-path is a required prop\");\n    }\n    if (!this.deletePath) {\n      throw new Error(\"wm-network-uploader: delete-path is a required prop\");\n    }\n    if (!this.buttonText) {\n      throw new Error(\"wm-network-uploader: button-text is a required prop\");\n    }\n    if (!this.emptyStateText) {\n      throw new Error(\"wm-network-uploader: empty-state-text is a required prop\");\n    }\n    if (!this.associatedData) {\n      throw new Error(\"wm-network-uploader: associated-data is a required prop\");\n    }\n\n    this.setMaxSize();\n    this.clearErrors();\n  }\n\n  componentDidLoad() {\n    this.getExistingFiles();\n\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      // this is not pretty duplicating a intl message + the logic of isDisabled,\n      // but not worth a bigger refactor since this is only until we get the UX for disabled elements and refactor all interactive els.\n      ev.preventDefault();\n      if (this.liveRegion) {\n        const isMax = !!this.maxFiles && this.fileList.length >= this.maxFiles;\n        let errMsg: string = \"\";\n        if (this.numFilesInProgress! > 0) {\n          errMsg = intl.formatMessage({\n            id: \"uploader.waitToUpload\",\n            defaultMessage: \"Please wait for current upload to complete before uploading new files.\",\n            description: \"Message for screen reader users\",\n          });\n        } else if (isMax) {\n          errMsg = intl.formatMessage({\n            id: \"uploader.fileUploadLimitExceeded\",\n            defaultMessage: \"Upload unsuccessful because file selection would exceed the maximum number of files\",\n            description: \"Message displayed when trying to upload too many files\",\n          });\n        }\n\n        if (errMsg) {\n          // clear and set again to re-announce if button is clicked several times\n          // (can't be done inside setTimeout because of scope, hence the promise)\n          this.liveRegion.innerHTML = \"\";\n          new Promise((resolve) => {\n            setTimeout(() => {\n              resolve(\"\");\n            }, 500);\n          }).then(() => (this.liveRegion!.innerHTML = errMsg));\n        }\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  renderNotif() {\n    return this.notif ? <span class=\"notif\">{this.notif.message}</span> : \"\";\n  }\n\n  renderUploadButton(classes: string) {\n    return (\n      <div class=\"notif-wrapper\">\n        <input\n          name={this.inputId}\n          id={this.inputId}\n          class=\"sr-only\"\n          type=\"file\"\n          multiple\n          onClick={(ev) => this.uploadButtonOnClick(ev)}\n          onChange={(e) => this.handleFiles(e)}\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.renderNotif()}\n      </div>\n    );\n  }\n\n  renderWithItems() {\n    return (\n      <div>\n        <div class=\"header\">\n          <div class=\"descr\">\n            <slot />\n          </div>\n          {this.renderUploadButton(this.isDisabled ? \"disabled\" : \"\")}\n        </div>\n        {this.renderErrorList()}\n        {this.renderInProgressList()}\n        {this.renderFileList()}\n      </div>\n    );\n  }\n\n  renderEmptyState() {\n    return (\n      <div>\n        <div class=\"header\">\n          <div class=\"descr\">\n            <slot />\n          </div>\n        </div>\n        <div class=\"empty-block\">\n          {this.renderUploadSvg()}\n          <div class=\"empty-message\">{this.emptyStateText}</div>\n          {this.renderUploadButton(\"-primary empty-button\")}\n        </div>\n      </div>\n    );\n  }\n\n  renderErrorList() {\n    if (!!this.errorList.length) {\n      if (this.liveRegion) {\n        let srMessage = this.errorList.reduce(function (acc, err) {\n          return acc + `${err.file_name}: ${err.message} `;\n        }, \"\");\n        this.liveRegion.innerHTML = srMessage;\n      }\n\n      return (\n        <ul class=\"error-list\">\n          {this.errorList.map((err) => (\n            <li>\n              <div class=\"file --error\">\n                <div class=\"file-info\">\n                  <span class=\"filename\">{err.file_name}</span>\n                </div>\n              </div>\n              <div class=\"error-message\">{err.message}</div>\n            </li>\n          ))}\n        </ul>\n      );\n    }\n  }\n\n  renderInProgressList() {\n    return (\n      <ul class=\"inprogress-list\">\n        {this.inProgressList.map((item) => {\n          return (\n            <li>\n              <div class=\"file --progress\">\n                <div\n                  class=\"progress\"\n                  style={{\n                    background: `linear-gradient(to right, rgba(67, 126, 142, 1) ${item.progress}%, transparent ${item.progress}%)`,\n                  }}\n                ></div>\n                <div class=\"file-info\">\n                  <span class=\"filename\">\n                    {item.name} <span class=\"sr-only\">uploading</span>\n                  </span>\n                </div>\n              </div>\n            </li>\n          );\n        })}\n      </ul>\n    );\n  }\n\n  renderFile(item: FileInfo) {\n    return (\n      <li>\n        <div class=\"file --saved\">\n          <div class=\"file-info\">\n            <span class=\"filename\">{item.file_name}</span>\n            <span class=\"filedate\">\n              {this.formatDate(item.updated_at!, intl.locale, Intl.DateTimeFormat().resolvedOptions().timeZone)}\n            </span>\n          </div>\n          <div class=\"file-controls\">\n            <wm-button\n              class=\"download-button\"\n              button-type=\"icononly\"\n              tooltip=\"download\"\n              label-for-identical-buttons={`download ${item.file_name}`}\n              icon=\"f1da\"\n              onClick={() => this.downloadFile(item.uuid!, item.file_path!)}\n            ></wm-button>\n            <wm-button\n              class=\"delete-button\"\n              button-type=\"icononly\"\n              tooltip=\"remove\"\n              label-for-identical-buttons={`remove ${item.file_name}`}\n              icon=\"f1c0\"\n              onClick={() => this.deleteFile(item)}\n            ></wm-button>\n          </div>\n        </div>\n      </li>\n    );\n  }\n\n  renderFileList() {\n    return <ul class=\"file-list\">{this.fileList.map((item) => this.renderFile(item))}</ul>;\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.isEmpty() ? this.renderEmptyState() : this.renderWithItems()}\n        <wm-snackbar notifications={JSON.stringify(this.snackbar)}></wm-snackbar>\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        ></div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/p-59654f8e.entry.js

@@ -1,2 +0,0 @@
-import{r,c as s,g as t}from"./p-1c23de4a.js";const e=class{constructor(t){r(this,t);this.wmWrapperLoaded=s(this,"wmWrapperLoaded",7)}componentDidLoad(){this.wmWrapperLoaded.emit()}render(){return}get el(){return t(this)}};export{e as wm_wrapper};
-//# sourceMappingURL=p-59654f8e.entry.js.map

package/dist/ripple/p-59654f8e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Wrapper","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":"mDAMaA,EAAO,M,0EAIlBC,mBACEC,KAAKC,gBAAgBC,M,CAGvBC,SACE,M"}