@nanoporetech-digital/components 8.0.0-alpha.0 → 8.0.0-alpha.2

package/dist/nano-components/nano-file-upload.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as o,c as i,a,d as n}from"./index-CFYZ-ZOT.js";import{h as l}from"./renderer-LJzCFyMt.js";let e=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){o(this,a),this.nanoChange=i(this,"nanoChange",7),this.nanoFocus=i(this,"nanoFocus",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoValidate=i(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+e++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((o=>o.file))),setTimeout((()=>{this.nanoChange.emit({value:this.value,files:this.files})}),20))}hasFocus;get host(){return a(this)}name;accept;capture;maxFileSize=1;maxFiles=1;label;placeholder="Choose a file...";hideLabel=!1;required=!1;disabled=!1;clearInput=!1;showInlineError=!0;validateOn="submit";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=!1;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((o=>(o.objectURL=URL.createObjectURL(o),o))):[]}set files(o){this.addNewFiles(this.arrToFileList(o))}get value(){return this.inputEl?this.inputEl.value:""}set value(o){""===o&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(o){return o&&(this.validate(),this.showInlineValidation()),{isValid:!this.invalid,errorMessage:this.inputEl.validationMessage}}async setFocus(){this.inputEl&&this.inputEl.focus()}getInputElement(){return Promise.resolve(this.inputEl)}async showError(o){this.inputEl&&(this.inputEl.setCustomValidity(o),this.validate(),this.showInlineValidation())}globalClickHandler(o){this.hasFocus&&o.composedPath().every((o=>o!==this.host))&&this.onBlur()}globalKeydownHandler(o){this.hasFocus&&"Tab"===o.key&&o.target!==this.inputEl&&this.onBlur()}onReset(o){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&o.target===this.host.closest("form")&&(this.value="")}onClearClick=()=>{this.value=""};onBlur=()=>{this.hasFocus=!1,this.validate(),"dirty"===this.validateOn&&this.showInlineValidation(),this.nanoBlur.emit()};onFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};arrToFileList(o){const i=t();for(let a=0,n=o.length;a<n;a++)i.items.add(o[a]);return i.files}checkFileSize(o){return o/1e6<=this.maxFileSize}checkFileType(o){return!this.accept||this.accept.match(o)&&this.accept.match(o).length>0}validate=()=>{let o;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?(this.fileList.forEach((i=>{o=null,this.checkFileSize(i.file.size)?this.checkFileType(i.file.type)||(o=`File type is not allowed (${this.accept})`):o="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",i.validationMessage=o,i.valid=!o})),this.fileList.length>this.maxFiles&&(o=`Maxinum number of files exceeded (${this.maxFiles})`)):o=this.inputEl.validationMessage,o&&this.inputEl.setCustomValidity(o)};showInlineValidation(o){"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this._invalid=!1,this.errorMessage="",this.inputEl.validity.valid||(this.errorMessage=this.inputEl.validationMessage,this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.inputEl.validationMessage,originalEvent:o})}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.host.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]')}addNewFiles(o){const i=Array.from(o).map((o=>({file:o,location:URL.createObjectURL(o),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const o=i.filter((o=>!this.fileList.find((i=>i.file.name===o.file.name))));this.fileList=[...this.fileList,...o]}else this.fileList=i}onInvalid=o=>{this.showInlineError&&o.preventDefault(),this.validate(),this.showInlineValidation(o)};onFileChoose=o=>{const i=o.target.files;i&&i.length&&this.addNewFiles(o.target.files)};onFileRemoveFileClick=(o,i)=>{this.canChangeFileList&&(this.removeFiles.push(i),o.target.closest(".file-upload__list-item--active").classList.remove("file-upload__list-item--active"))};onFileRemoveAnim=()=>{if(this.canChangeFileList&&this.removeFiles.length){this.fileList=this.fileList.filter((o=>!this.removeFiles.find((i=>i===o))));try{this.removeFiles.forEach((o=>o.location?URL.revokeObjectURL(o.location):""))}catch(o){console.error(o)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!1};onDragStart=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!0};onDrop=o=>{this.onDragStop(o),o.dataTransfer.files&&o.dataTransfer.files.length&&this.addNewFiles(o.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(o,i)=>{const a=this.fileInputId+"-lbl",n=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[l("div",{class:"file-upload__"+o+"-wrap"},l("label",{class:"file-upload__"+o,htmlFor:this.fileInputId,id:a,onDrop:o=>{this.onDrop(o),this.onDragStop(o)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==o)&&l("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==o&&l("slot",{name:"label"})),"drop"===o&&l("div",{class:"file-upload__drop-area"},l("div",null,this.hasLabelSlot&&l("slot",{name:"label"})),l("div",null,"Drag and drop or ",l("span",null,"browse"))),"btn"===o&&l("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},l("div",{class:"file-upload__btn-content"},l("nano-icon",{name:"regular/cloud-arrow-up"}),l("span",null,this.fileList.length?this.fileList[0].file.name:this.placeholder),!!this.value&&this.clearInput&&!this.disabled&&l("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"-1",onClick:this.onClearClick},l("nano-icon",{name:"light/xmark"})))),l("input",{"aria-labelledby":a+" "+n+" "+i,type:"file",id:this.fileInputId,accept:this.accept,class:"file-upload__input",multiple:this.maxFiles>1,disabled:this.disabled,name:this.canChangeFileList?void 0:this.name,form:this.form,ref:o=>{this.canChangeFileList?this.publicInputEl=o:this.inputEl=o},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),l("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:o=>{this.canChangeFileList&&(this.inputEl=o)},type:"file",id:this.fileInputId+"-hidden",tabIndex:-1,multiple:!0,class:"file-upload__input",disabled:this.disabled,required:this.required,accept:this.accept,onInvalid:this.onInvalid,onChange:this.onInputChange})),this.showInlineError||this.hasHelperSlot?l("div",{class:"file-upload__more",id:n},this.showInlineError&&this.errorMessage.length?l("div",{class:"file-upload__error"},this.errorMessage):"",l("div",{class:"file-upload__help"},l("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const o=this.fileInputId+"-list";return[this.FileUploadInput("drop",o),l("output",{class:"file-upload__list-wrap",id:o},!!this.fileList&&this.fileList.length>0&&l("ul",{class:"file-upload__list list"},this.fileList.map((o=>l("li",{key:o.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},l("span",{class:"list-title"},o.file.name),!o.valid&&l("nano-tooltip",{content:o.validationMessage,placement:"left"},l("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&l("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:o.location}),this.canChangeFileList&&l("nano-icon-button",{onClick:i=>this.onFileRemoveFileClick(i,o),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return l(n,{key:"2bd95bf5d3c725d84679a373eac2f87b491ae2bd",class:"nano-file-upload"},l("div",{key:"026b77c3165ea04d5ed9a2f8536fd5089ed3ee8e",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":this._invalid}},l(this.maxFiles>1?this.dropArea:this.button,null)))}static get watchers(){return{fileList:["fileListChange","shouldValidate"],maxFiles:["shouldValidate"],maxFileSize:["shouldValidate"],capture:["shouldValidate"],accept:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"]}}};s.style='.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h{min-block-size:1rem;display:block;--invalid-msg-color:var(--nano-color-danger, #ef4135);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--label-color:var(--nano-input-label-color, "currentcolor");--label-font-size:var(--nano-input-label-color, 1em);--label-padding:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--label-color--invalid:var(--nano-input-label-color-invalid, "currentcolor");--drop-bg:#f2f7f9;--drop-text:#756f6a;--drop-height:3.5em;--drop-border-tint:var(--nano-color-primary-rgb, 0 116 149);--drop-border-width:2px;--drop-border-radius:5px;--drop-bg--invalid:var(--nano-input-background-color, white);--drop-border--invalid:var(--nano-color-danger-rgb, 239 65 53);--btn-bg:var(--nano-color-primary, #007495);--btn-text:var(--nano-color-primary-contrast, #fff);--btn-icon-size:var(--nano-btn-icon-size, 1.4em);--btn-padding-top:var(--nano-btn-padding-top, 0.5em);--btn-padding-bottom:var(--nano-btn-padding-bottom, 0.5em);--btn-padding-start:var(--nano-btn-padding-start, 1rem);--btn-padding-end:var(--nano-btn-padding-end, 1rem)}[disabled].sc-nano-file-upload-h:not([disabled=false]){opacity:0.7}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload__label.sc-nano-file-upload{font-size:var(--label-font-size);padding:0 0 var(--label-padding);margin:0;line-height:1}[invalid].sc-nano-file-upload-h:not([invalid=false]) .file-upload__label.sc-nano-file-upload{color:var(--label-color--invalid)}.file-upload__input.sc-nano-file-upload{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload,.file-upload__more.sc-nano-file-upload,.file-upload__label.sc-nano-file-upload{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{block-size:1em;margin-block:calc(var(--label-padding) / 2) var(--label-padding);margin-inline:3px 0;position:relative}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;transition:0.3s ease-out opacity}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload,.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:1}.file-upload__error.sc-nano-file-upload{color:var(--invalid-msg-color);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1}.file-upload__help.sc-nano-file-upload{font-style:italic;opacity:1;color:var(--help-msg-color)}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0}.file-upload__drop.sc-nano-file-upload{position:relative;inline-size:100%;display:inline-block}.file-upload__drop-area.sc-nano-file-upload{flex-direction:column;background-color:var(--drop-bg);color:var(--drop-text);min-block-size:var(--drop-height);display:flex;align-items:center;justify-content:center;font-size:0.9em;position:relative;transition:background-color 0.15s ease-in-out;padding:0.5rem}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{opacity:0.7}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:var(--drop-bg--invalid)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:#fff}.file-upload__drop-area.sc-nano-file-upload::after{content:"";position:absolute;border-radius:var(--drop-border-radius);border-width:var(--drop-border-width);border-color:rgb(var(--drop-border-tint)/50%);border-style:dashed;inset:0;transition:top 0.1s ease-in-out, bottom 0.1s ease-in-out, left 0.1s ease-in-out, right 0.1s ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{border-color:rgb(var(--drop-border--invalid)/100%)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:rgb(var(--drop-border-tint)/100%);text-decoration:underline;border-radius:2px;z-index:1;cursor:pointer;position:relative}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__list.sc-nano-file-upload{list-style:none;margin:0;padding:0}.file-upload__list-wrap.sc-nano-file-upload{position:relative;inset-block-start:-4px}.file-upload__list-item.sc-nano-file-upload{inline-size:100%;margin:0 0 2px;display:flex;align-items:center;transform:translateZ(0);animation:hideListItem 0.3s ease-in-out forwards}@keyframes hideListItem{0%{opacity:1;transform:translateY(0);transform:translateZ(0)}100%{opacity:0;transform:translateY(10px);transform:translateZ(0)}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem 0.3s ease-in-out forwards}@keyframes showListItem{0%{opacity:0;transform:translateY(10px);transform:translateZ(0)}100%{opacity:1;transform:translateY(0);transform:translateZ(0)}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;padding:5px;margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:0.9em;color:var(--help-msg-color)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:rgb(var(--drop-border--invalid) / 100%)}.file-upload__button.sc-nano-file-upload{padding:0;border:none;background-color:transparent;font:inherit;-webkit-box-align:center;text-decoration:none;color:inherit;transition:background-color 100ms ease-in-out, box-shadow 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out;padding-inline:var(--nano-btn-padding-start, 1rem) var(--nano-btn-padding-end, 1rem);padding-block:var(--nano-btn-padding-top, 0.5rem) var(--nano-btn-padding-bottom, 0.5rem);box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2));display:inline-block;border-radius:var(--nano-btn-border-radius, 5px);line-height:var(--nano-btn-line-height, 1.5em);font-weight:400;cursor:pointer;background:rgba(0, 0, 0, 0.02);background-color:var(--btn-bg);color:var(--btn-text);--nano-btn-icon-size:var(--btn-icon-size);--nano-btn-line-height:var(--btn-icon-size);--nano-btn-padding-top:var(--btn-padding-top);--nano-btn-padding-bottom:var(--btn-padding-bottom);--nano-btn-padding-start:var(--btn-padding-start);--nano-btn-padding-end:var(--btn-padding-end);max-inline-size:100%;font-size:0.9em}.file-upload__button.sc-nano-file-upload::-moz-focus-inner{border:0;padding:0}.file-upload__button.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:focus{text-decoration:none;color:inherit}@media print{.file-upload__button.sc-nano-file-upload{display:none}}.file-upload__button.sc-nano-file-upload:focus,.file-upload__button.button--focus.sc-nano-file-upload{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__button.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload nano-spinner.sc-nano-file-upload{--base-color-rgb:255 255 255;margin-inline:0.5em 0;font-size:var(--nano-btn-icon-size, 1em);vertical-align:middle;margin-block-start:-0.188em;display:inline-block}.file-upload__button.button--icon-start.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.button--icon-start.sc-nano-file-upload nano-spinner.sc-nano-file-upload{margin-inline:0 0.5em}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled){box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2))}.file-upload__button.sc-nano-file-upload:active:not(.button--disabled,.sc-nano-file-upload:disabled){box-shadow:none}.file-upload__button--disabled.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload:disabled{opacity:0.6}.file-upload__button--disabled.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:disabled:hover{cursor:default}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--active.sc-nano-file-upload{background-color:var(--nano-color-primary-shade, #00637f);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled).button--keyline,.file-upload__button.button--active.button--keyline.sc-nano-file-upload{background-color:var(--btn-bg);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:focus{color:var(--btn-text)}.file-upload__button.button--keyline.sc-nano-file-upload{background:transparent;border-style:var(--nano-btn-border-style, solid);border-width:var(--nano-btn-border-width, 2px);border-radius:var(--nano-btn-border-radius, 5px);padding-block:calc(var(--nano-btn-padding-top, 0.5rem) - var(--nano-btn-border-width, 2px)) calc(var(--nano-btn-padding-bottom, 0.5rem) - var(--nano-btn-border-width, 2px));color:var(--btn-bg);border-color:var(--btn-bg)}.file-upload__button.button--keyline.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--keyline.sc-nano-file-upload:not(:focus,.button--focus).sc-nano-file-upload,.file-upload__button.button--keyline.button--active.sc-nano-file-upload{box-shadow:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__button.sc-nano-file-upload{opacity:0.4}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;background-color:transparent;display:flex;align-items:stretch;inline-size:auto;color:var(--clear-btn-color)}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{color:var(--clear-btn-color--invalid)}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin-inline:0.4rem 0;margin-block:0}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{display:flex;align-items:center}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload span.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}';export{s as nano_file_upload}
+import{r as o,c as i,a,d as n}from"./index-DXvE-U_j.js";import{h as l}from"./renderer-BUaAsDso.js";let e=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){o(this,a),this.nanoChange=i(this,"nanoChange",7),this.nanoFocus=i(this,"nanoFocus",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoValidate=i(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+e++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((o=>o.file))),setTimeout((()=>{this.nanoChange.emit({value:this.value,files:this.files})}),20))}hasFocus;get host(){return a(this)}name;accept;capture;maxFileSize=1;maxFiles=1;label;placeholder="Choose a file...";hideLabel=!1;required=!1;disabled=!1;clearInput=!1;showInlineError=!0;validateOn="submit";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=!1;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((o=>(o.objectURL=URL.createObjectURL(o),o))):[]}set files(o){this.addNewFiles(this.arrToFileList(o))}get value(){return this.inputEl?this.inputEl.value:""}set value(o){""===o&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(o){return o&&(this.validate(),this.showInlineValidation()),{isValid:!this.invalid,errorMessage:this.inputEl.validationMessage}}async setFocus(){this.inputEl&&this.inputEl.focus()}getInputElement(){return Promise.resolve(this.inputEl)}async showError(o){this.inputEl&&(this.inputEl.setCustomValidity(o),this.validate(),this.showInlineValidation())}globalClickHandler(o){this.hasFocus&&o.composedPath().every((o=>o!==this.host))&&this.onBlur()}globalKeydownHandler(o){this.hasFocus&&"Tab"===o.key&&o.target!==this.inputEl&&this.onBlur()}onReset(o){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&o.target===this.host.closest("form")&&(this.value="")}onClearClick=()=>{this.value=""};onBlur=()=>{this.hasFocus=!1,this.validate(),"dirty"===this.validateOn&&this.showInlineValidation(),this.nanoBlur.emit()};onFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};arrToFileList(o){const i=t();for(let a=0,n=o.length;a<n;a++)i.items.add(o[a]);return i.files}checkFileSize(o){return o/1e6<=this.maxFileSize}checkFileType(o){return!this.accept||this.accept.match(o)&&this.accept.match(o).length>0}validate=()=>{let o;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?(this.fileList.forEach((i=>{o=null,this.checkFileSize(i.file.size)?this.checkFileType(i.file.type)||(o=`File type is not allowed (${this.accept})`):o="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",i.validationMessage=o,i.valid=!o})),this.fileList.length>this.maxFiles&&(o=`Maxinum number of files exceeded (${this.maxFiles})`)):o=this.inputEl.validationMessage,o&&this.inputEl.setCustomValidity(o)};showInlineValidation(o){"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this._invalid=!1,this.errorMessage="",this.inputEl.validity.valid||(this.errorMessage=this.inputEl.validationMessage,this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.inputEl.validationMessage,originalEvent:o})}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.host.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]')}addNewFiles(o){const i=Array.from(o).map((o=>({file:o,location:URL.createObjectURL(o),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const o=i.filter((o=>!this.fileList.find((i=>i.file.name===o.file.name))));this.fileList=[...this.fileList,...o]}else this.fileList=i}onInvalid=o=>{this.showInlineError&&o.preventDefault(),this.validate(),this.showInlineValidation(o)};onFileChoose=o=>{const i=o.target.files;i&&i.length&&this.addNewFiles(o.target.files)};onFileRemoveFileClick=(o,i)=>{this.canChangeFileList&&(this.removeFiles.push(i),o.target.closest(".file-upload__list-item--active").classList.remove("file-upload__list-item--active"))};onFileRemoveAnim=()=>{if(this.canChangeFileList&&this.removeFiles.length){this.fileList=this.fileList.filter((o=>!this.removeFiles.find((i=>i===o))));try{this.removeFiles.forEach((o=>o.location?URL.revokeObjectURL(o.location):""))}catch(o){console.error(o)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!1};onDragStart=o=>{o.preventDefault(),o.stopPropagation(),this.isDragging=!0};onDrop=o=>{this.onDragStop(o),o.dataTransfer.files&&o.dataTransfer.files.length&&this.addNewFiles(o.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(o,i)=>{const a=this.fileInputId+"-lbl",n=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[l("div",{class:"file-upload__"+o+"-wrap"},l("label",{class:"file-upload__"+o,htmlFor:this.fileInputId,id:a,onDrop:o=>{this.onDrop(o),this.onDragStop(o)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==o)&&l("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==o&&l("slot",{name:"label"})),"drop"===o&&l("div",{class:"file-upload__drop-area"},l("div",null,this.hasLabelSlot&&l("slot",{name:"label"})),l("div",null,"Drag and drop or ",l("span",null,"browse"))),"btn"===o&&l("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},l("div",{class:"file-upload__btn-content"},l("nano-icon",{name:"regular/cloud-arrow-up"}),l("span",null,this.fileList.length?this.fileList[0].file.name:this.placeholder),!!this.value&&this.clearInput&&!this.disabled&&l("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"-1",onClick:this.onClearClick},l("nano-icon",{name:"light/xmark"})))),l("input",{"aria-labelledby":a+" "+n+" "+i,type:"file",id:this.fileInputId,accept:this.accept,class:"file-upload__input",multiple:this.maxFiles>1,disabled:this.disabled,name:this.canChangeFileList?void 0:this.name,form:this.form,ref:o=>{this.canChangeFileList?this.publicInputEl=o:this.inputEl=o},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),l("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:o=>{this.canChangeFileList&&(this.inputEl=o)},type:"file",id:this.fileInputId+"-hidden",tabIndex:-1,multiple:!0,class:"file-upload__input",disabled:this.disabled,required:this.required,accept:this.accept,onInvalid:this.onInvalid,onChange:this.onInputChange})),this.showInlineError||this.hasHelperSlot?l("div",{class:"file-upload__more",id:n},this.showInlineError&&this.errorMessage.length?l("div",{class:"file-upload__error"},this.errorMessage):"",l("div",{class:"file-upload__help"},l("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const o=this.fileInputId+"-list";return[this.FileUploadInput("drop",o),l("output",{class:"file-upload__list-wrap",id:o},!!this.fileList&&this.fileList.length>0&&l("ul",{class:"file-upload__list list"},this.fileList.map((o=>l("li",{key:o.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},l("span",{class:"list-title"},o.file.name),!o.valid&&l("nano-tooltip",{content:o.validationMessage,placement:"left"},l("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&l("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:o.location}),this.canChangeFileList&&l("nano-icon-button",{onClick:i=>this.onFileRemoveFileClick(i,o),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return l(n,{key:"2bd95bf5d3c725d84679a373eac2f87b491ae2bd",class:"nano-file-upload"},l("div",{key:"026b77c3165ea04d5ed9a2f8536fd5089ed3ee8e",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":this._invalid}},l(this.maxFiles>1?this.dropArea:this.button,null)))}static get watchers(){return{fileList:["fileListChange","shouldValidate"],maxFiles:["shouldValidate"],maxFileSize:["shouldValidate"],capture:["shouldValidate"],accept:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"]}}};s.style='.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-file-upload-h,*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-file-upload-h{min-block-size:1rem;display:block;--invalid-msg-color:var(--nano-color-danger, #ef4135);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--label-color:var(--nano-input-label-color, "currentcolor");--label-font-size:var(--nano-input-label-color, 1em);--label-padding:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--label-color--invalid:var(--nano-input-label-color-invalid, "currentcolor");--drop-bg:#f2f7f9;--drop-text:#756f6a;--drop-height:3.5em;--drop-border-tint:var(--nano-color-primary-rgb, 0 116 149);--drop-border-width:2px;--drop-border-radius:5px;--drop-bg--invalid:var(--nano-input-background-color, white);--drop-border--invalid:var(--nano-color-danger-rgb, 239 65 53);--btn-bg:var(--nano-color-primary, #007495);--btn-text:var(--nano-color-primary-contrast, #fff);--btn-icon-size:var(--nano-btn-icon-size, 1.4em);--btn-padding-top:var(--nano-btn-padding-top, 0.5em);--btn-padding-bottom:var(--nano-btn-padding-bottom, 0.5em);--btn-padding-start:var(--nano-btn-padding-start, 1rem);--btn-padding-end:var(--nano-btn-padding-end, 1rem)}[disabled].sc-nano-file-upload-h:not([disabled=false]){opacity:0.7}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload__label.sc-nano-file-upload{font-size:var(--label-font-size);padding:0 0 var(--label-padding);margin:0;line-height:1}[invalid].sc-nano-file-upload-h:not([invalid=false]) .file-upload__label.sc-nano-file-upload{color:var(--label-color--invalid)}.file-upload__input.sc-nano-file-upload{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload,.file-upload__more.sc-nano-file-upload,.file-upload__label.sc-nano-file-upload{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{block-size:1em;margin-block:calc(var(--label-padding) / 2) var(--label-padding);margin-inline:3px 0;position:relative}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;transition:0.3s ease-out opacity}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload,.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:1}.file-upload__error.sc-nano-file-upload{color:var(--invalid-msg-color);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1}.file-upload__help.sc-nano-file-upload{font-style:italic;opacity:1;color:var(--help-msg-color)}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0}.file-upload__drop.sc-nano-file-upload{position:relative;inline-size:100%;display:inline-block}.file-upload__drop-area.sc-nano-file-upload{flex-direction:column;background-color:var(--drop-bg);color:var(--drop-text);min-block-size:var(--drop-height);display:flex;align-items:center;justify-content:center;font-size:0.9em;position:relative;transition:background-color 0.15s ease-in-out;padding:0.5rem}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{opacity:0.7}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:var(--drop-bg--invalid)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:#fff}.file-upload__drop-area.sc-nano-file-upload::after{content:"";position:absolute;border-radius:var(--drop-border-radius);border-width:var(--drop-border-width);border-color:rgb(var(--drop-border-tint)/50%);border-style:dashed;inset:0;transition:top 0.1s ease-in-out, bottom 0.1s ease-in-out, left 0.1s ease-in-out, right 0.1s ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{border-color:rgb(var(--drop-border--invalid)/100%)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:rgb(var(--drop-border-tint)/100%);text-decoration:underline;border-radius:2px;z-index:1;cursor:pointer;position:relative}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__list.sc-nano-file-upload{list-style:none;margin:0;padding:0}.file-upload__list-wrap.sc-nano-file-upload{position:relative;inset-block-start:-4px}.file-upload__list-item.sc-nano-file-upload{inline-size:100%;margin:0 0 2px;display:flex;align-items:center;transform:translateZ(0);animation:hideListItem 0.3s ease-in-out forwards}@keyframes hideListItem{0%{opacity:1;transform:translateY(0);transform:translateZ(0)}100%{opacity:0;transform:translateY(10px);transform:translateZ(0)}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem 0.3s ease-in-out forwards}@keyframes showListItem{0%{opacity:0;transform:translateY(10px);transform:translateZ(0)}100%{opacity:1;transform:translateY(0);transform:translateZ(0)}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;padding:5px;margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:0.9em;color:var(--help-msg-color)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:rgb(var(--drop-border--invalid) / 100%)}.file-upload__button.sc-nano-file-upload{padding:0;border:none;background-color:transparent;font:inherit;-webkit-box-align:center;text-decoration:none;color:inherit;transition:background-color 100ms ease-in-out, box-shadow 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out;padding-inline:var(--nano-btn-padding-start, 1rem) var(--nano-btn-padding-end, 1rem);padding-block:var(--nano-btn-padding-top, 0.5rem) var(--nano-btn-padding-bottom, 0.5rem);box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2));display:inline-block;border-radius:var(--nano-btn-border-radius, 5px);line-height:var(--nano-btn-line-height, 1.5em);font-weight:400;cursor:pointer;background:rgba(0, 0, 0, 0.02);background-color:var(--btn-bg);color:var(--btn-text);--nano-btn-icon-size:var(--btn-icon-size);--nano-btn-line-height:var(--btn-icon-size);--nano-btn-padding-top:var(--btn-padding-top);--nano-btn-padding-bottom:var(--btn-padding-bottom);--nano-btn-padding-start:var(--btn-padding-start);--nano-btn-padding-end:var(--btn-padding-end);max-inline-size:100%;font-size:0.9em}.file-upload__button.sc-nano-file-upload::-moz-focus-inner{border:0;padding:0}.file-upload__button.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:focus{text-decoration:none;color:inherit}@media print{.file-upload__button.sc-nano-file-upload{display:none}}.file-upload__button.sc-nano-file-upload:focus,.file-upload__button.button--focus.sc-nano-file-upload{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.file-upload__button.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload nano-spinner.sc-nano-file-upload{--base-color-rgb:255 255 255;margin-inline:0.5em 0;font-size:var(--nano-btn-icon-size, 1em);vertical-align:middle;margin-block-start:-0.188em;display:inline-block}.file-upload__button.button--icon-start.sc-nano-file-upload nano-icon.sc-nano-file-upload,.file-upload__button.button--icon-start.sc-nano-file-upload nano-spinner.sc-nano-file-upload{margin-inline:0 0.5em}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled){box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2))}.file-upload__button.sc-nano-file-upload:active:not(.button--disabled,.sc-nano-file-upload:disabled){box-shadow:none}.file-upload__button--disabled.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload:disabled{opacity:0.6}.file-upload__button--disabled.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:disabled:hover{cursor:default}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--active.sc-nano-file-upload{background-color:var(--nano-color-primary-shade, #00637f);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled).button--keyline,.file-upload__button.button--active.button--keyline.sc-nano-file-upload{background-color:var(--btn-bg);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:focus{color:var(--btn-text)}.file-upload__button.button--keyline.sc-nano-file-upload{background:transparent;border-style:var(--nano-btn-border-style, solid);border-width:var(--nano-btn-border-width, 2px);border-radius:var(--nano-btn-border-radius, 5px);padding-block:calc(var(--nano-btn-padding-top, 0.5rem) - var(--nano-btn-border-width, 2px)) calc(var(--nano-btn-padding-bottom, 0.5rem) - var(--nano-btn-border-width, 2px));color:var(--btn-bg);border-color:var(--btn-bg)}.file-upload__button.button--keyline.sc-nano-file-upload:hover:not(.button--disabled,.sc-nano-file-upload:disabled),.file-upload__button.button--keyline.sc-nano-file-upload:not(:focus,.button--focus).sc-nano-file-upload,.file-upload__button.button--keyline.button--active.sc-nano-file-upload{box-shadow:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__button.sc-nano-file-upload{opacity:0.4}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;background-color:transparent;display:flex;align-items:stretch;inline-size:auto;color:var(--clear-btn-color)}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{color:var(--clear-btn-color--invalid)}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin-inline:0.4rem 0;margin-block:0}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{display:flex;align-items:center}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload span.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}';export{s as nano_file_upload}

package/dist/nano-components/nano-footer.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,a as e,h as a}from"./index-CFYZ-ZOT.js";import{a as o}from"./style-BrRDhFfF.js";const t=class{constructor(e){n(this,e)}get host(){return e(this)}componentWillLoad(){o(this.host.shadowRoot)}render(){return a("footer",{key:"6c5f9e943485a21b7c19a1c1173816151450a7a7",class:"footer"},a("div",{key:"4f412bbb7737f5f8225729e2109b688ccc800989",class:"upper"},a("div",{key:"dd53490055399eafe7599aca856dd0ca79ba21fb",class:"top"},a("div",{key:"c8103cf1bcd74ce025924fc975849573051368d0",class:"top-start"},a("slot",{key:"924b1f7d97a15e4afa0126f7c03fe525f97f92ba",name:"top-start_heading"}),a("slot",{key:"3feb30f6395b9acbdd670cd656321ea751a4e81a",name:"top-start_content"})),a("div",{key:"5dd035af59487992c2da47b7b61012da97cfeec4",class:"top-center"},a("slot",{key:"aecc20ee6792c8912cd330724af3a75cfcd487af",name:"top-center_heading"}),a("slot",{key:"f30e4dae00d45df2afb7a419daf875843ad61a50",name:"top-center_content"})),a("div",{key:"824feef5a5f50b461904096752bdb4aeefd84d99",class:"top-end"},a("slot",{key:"7f06ff962236e057b640460097881646e2d8b1b2",name:"top-end_heading"}),a("slot",{key:"5e2412c74e444c570f5ea46b756d2e3369f12215",name:"top-end_content"})))),a("div",{key:"77cb498fde6fb578e3c5a249ca6c3db5c88206d1",class:"lower nano-theme-dark"},a("div",{key:"7f2e8024df8f7470443d0048eefd8978d203f727",class:"middle"},a("div",{key:"18c334b18c07c0ee2416cb646c5f5287c091bdb3",class:"middle-start"},a("img",{key:"be83911db58e7a75566a2d495b843427a7d1fa0a",src:"/nano-assets/img/ont-logo-light.svg",alt:"Oxford Nanopore Technologies logo. Featuring a stylised representation of a nanopore,\n          (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",height:"46"})),a("div",{key:"a7b84187146146325db5cb990d53650ebfaf5741",class:"middle-center"},a("a",{key:"d2edfbc2e1034a9378be6291bf290af6d0e36119",href:"https://x.com/nanopore",target:"_blank"},a("nano-icon",{key:"8e8cb317194b2dd9277599c38b525128d94d69c0",name:"brands/x-twitter",size:"large",ariaLabel:"X (formerly Twitter)"})),a("a",{key:"07091f28412bf31e853c5c51d6448631a7e47b33",href:"https://bsky.app/profile/nanoporetech.com",target:"_blank"},a("nano-icon",{key:"8e5f4e5b2d13ce77df193d4a38743d6225f667d6",name:"brands/bluesky",size:"large",ariaLabel:"Bluesky"})),a("a",{key:"2561aa967f77b1ac0618c02fe1e78c270d8f82f7",href:"https://www.youtube.com/channel/UC5yMlYjHSgFfZ37LYq-dzig",target:"_blank"},a("nano-icon",{key:"27ac4933b66ff7027c3f45bc001d0e311055cf0a",name:"brands/youtube",size:"large",ariaLabel:"YouTube"})),a("a",{key:"2b46f3651b32439997c4f1020d89901bcf6679a8",href:"https://www.facebook.com/Oxford-Nanopore-Technologies-251034380246/",target:"_blank"},a("nano-icon",{key:"0f25dc9636ece933dbc00911d0e0c36735203666",name:"brands/facebook",size:"large",ariaLabel:"Facebook"})),a("a",{key:"541bef691993ace5b8c270e82d08984baace7964",href:"https://www.linkedin.com/company/oxford-nanopore-technologies",target:"_blank"},a("nano-icon",{key:"bb4a4104c3a39375d1f50c7c8aca1561a66d9c28",name:"brands/linkedin",size:"large",ariaLabel:"LinkedIn"})),a("a",{key:"4817a0798d5ab0586a20c40a14de73280ce749e3",href:"https://www.instagram.com/oxfordnanopore",target:"_blank"},a("nano-icon",{key:"dea3b9c4bc6100f73a3769999779ab4e6f343193",name:"brands/instagram",size:"large",ariaLabel:"Instagram"}))),a("div",{key:"151bbc03ca7c9fbdb14cf355dd4ff61c6fba1e36",class:"middle-end"},a("slot",{key:"241922e25dbe52e5a6e5b9b661c037f3faa004f5",name:"middle-end"}))),a("div",{key:"08489f7cb75832e26fe862987d19bbdc03b8ff23",class:"bottom"},a("div",{key:"1e2cfb25bbb0f6a60399b344f83a091677d848d7",class:"bottom-start"},a("slot",{key:"ce19389f907a75fb43a533a7ca200670b136ad86",name:"bottom-start"},a("p",{key:"5d6d5135e67276a81f290e91d7753b9b2b4964ce"},"© 2008 - 2025 Oxford Nanopore Technologies plc. All rights reserved. Registered Office: Gosling Building, Edmund Halley Road, Oxford Science Park, OX4 4DQ, UK | Registered No. 05386273 | VAT No 336942382. Oxford Nanopore Technologies, the Wheel icon, EPI2ME, Flongle, GridION, Metrichor, MinION, MinIT, MinKNOW, Plongle, PromethION, SmidgION, Ubik and VolTRAX are registered trademarks of Oxford Nanopore Technologies plc in various countries. Oxford Nanopore Technologies products are not intended for use for health assessment or to diagnose, treat, mitigate, cure, or prevent any disease or condition."))),a("div",{key:"db091f94e130553a106a71071988b2c591a943ab",class:"bottom-end"},a("slot",{key:"6b6642608e571e9d1690de419727476b27e1514f",name:"bottom-end"})))))}};t.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  --col-gap: var(--nano-spacing-l1-default);\n  --icon-gap-md: var(--nano-spacing-md);\n  --icon-gap-sm: var(--nano-spacing-sm);\n  --vertical-padding: var(--nano-spacing-l1-default);\n  --horizontal-padding: 0;\n  --header-margin: 0 0 var(--nano-spacing-l1-default) 0;\n  display: block;\n}\n:host .footer {\n  container-type: inline-size;\n  container-name: footer-container;\n  display: flex;\n  flex-direction: column;\n}\n@container footer-container (max-width: 768px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-md);\n    --col-gap: var(--nano-spacing-l);\n    --vertical-padding: var(--nano-spacing-md);\n  }\n  :host .top-start,\n  :host .top-center,\n  :host .top-end {\n    --header-margin: 0 0 var(--nano-spacing-md) 0;\n  }\n}\n@container footer-container (max-width: 1023px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l);\n  }\n}\n@container footer-container (max-width: 1346px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l1-default);\n  }\n}\n:host .upper {\n  background-color: var(--nano-color-base-rgb-1000);\n  border-block-start: 1px solid var(--nano-color-neutral-200);\n}\n:host .lower {\n  background-color: var(--nano-color-base-0);\n  color: var(--nano-color-base-1000);\n}\n:host .top,\n:host .middle,\n:host .bottom {\n  display: grid;\n  gap: var(--col-gap);\n  margin: 0 auto;\n  max-inline-size: 1266px;\n}\n:host .top,\n:host .middle {\n  grid-template-columns: repeat(3, 1fr);\n  padding: var(--vertical-padding) var(--horizontal-padding);\n}\n:host .bottom {\n  grid-template-columns: repeat(2, 1fr);\n  padding-inline: var(--horizontal-padding);\n  padding-block-end: var(--vertical-padding);\n}\n:host .middle-center a {\n  color: inherit;\n}\n:host .middle-center a:hover {\n  color: var(--nano-color-primary-1000);\n}\n:host .middle-center a:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n:host .top-start,\n:host .top-center,\n:host .top-end {\n  flex-direction: column;\n}\n:host .middle-start,\n:host .middle-center,\n:host .middle-end {\n  align-items: center;\n}\n:host .middle-start {\n  display: flex;\n  justify-content: flex-start;\n}\n:host .middle-center {\n  display: flex;\n  justify-content: center;\n  gap: var(--icon-gap-md);\n  flex-wrap: nowrap;\n}\n:host .middle-end {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 20rem));\n  gap: var(--icon-gap-sm);\n  justify-content: end;\n}\n:host [slot=middle-end] {\n  inline-size: 100%;\n}\n:host .bottom-start p,\n:host .bottom-start ::slotted(p), .bottom-start :host::slotted(p) {\n  font-weight: var(--nano-font-weight-normal) !important;\n  font-size: var(--nano-font-size-xs) !important;\n  line-height: var(--nano-line-height-normal) !important;\n  letter-spacing: var(--nano-letter-spacing-loose) !important;\n  margin-block: 0 !important;\n}\n:host .bottom-end {\n  display: flex;\n  justify-content: flex-end;\n}\n:host .bottom-end ::slotted(*), .bottom-end :host::slotted(*) {\n  --input-font-size: var(--nano-font-size-2xs) !important;\n  max-inline-size: 9rem !important;\n}\n@container footer-container (max-width: 912px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    grid-template-columns: 1fr;\n  }\n  :host .middle-center {\n    flex-wrap: wrap;\n  }\n  :host .middle-end {\n    grid-template-columns: minmax(0, 6.6rem);\n  }\n  :host .bottom {\n    display: flex;\n    flex-direction: column-reverse;\n    align-items: center;\n  }\n  :host .middle-start,\n  :host .middle-center,\n  :host .middle-end {\n    justify-content: center;\n  }\n}";export{t as nano_footer}
+import{r as n,a as e,h as a}from"./index-DXvE-U_j.js";import{a as o}from"./style-BrRDhFfF.js";const t=class{constructor(e){n(this,e)}get host(){return e(this)}componentWillLoad(){o(this.host.shadowRoot)}render(){return a("footer",{key:"6c5f9e943485a21b7c19a1c1173816151450a7a7",class:"footer"},a("div",{key:"4f412bbb7737f5f8225729e2109b688ccc800989",class:"upper"},a("div",{key:"dd53490055399eafe7599aca856dd0ca79ba21fb",class:"top"},a("div",{key:"c8103cf1bcd74ce025924fc975849573051368d0",class:"top-start"},a("slot",{key:"924b1f7d97a15e4afa0126f7c03fe525f97f92ba",name:"top-start_heading"}),a("slot",{key:"3feb30f6395b9acbdd670cd656321ea751a4e81a",name:"top-start_content"})),a("div",{key:"5dd035af59487992c2da47b7b61012da97cfeec4",class:"top-center"},a("slot",{key:"aecc20ee6792c8912cd330724af3a75cfcd487af",name:"top-center_heading"}),a("slot",{key:"f30e4dae00d45df2afb7a419daf875843ad61a50",name:"top-center_content"})),a("div",{key:"824feef5a5f50b461904096752bdb4aeefd84d99",class:"top-end"},a("slot",{key:"7f06ff962236e057b640460097881646e2d8b1b2",name:"top-end_heading"}),a("slot",{key:"5e2412c74e444c570f5ea46b756d2e3369f12215",name:"top-end_content"})))),a("div",{key:"77cb498fde6fb578e3c5a249ca6c3db5c88206d1",class:"lower nano-theme-dark"},a("div",{key:"7f2e8024df8f7470443d0048eefd8978d203f727",class:"middle"},a("div",{key:"18c334b18c07c0ee2416cb646c5f5287c091bdb3",class:"middle-start"},a("img",{key:"be83911db58e7a75566a2d495b843427a7d1fa0a",src:"/nano-assets/img/ont-logo-light.svg",alt:"Oxford Nanopore Technologies logo. Featuring a stylised representation of a nanopore,\n          (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",height:"46"})),a("div",{key:"a7b84187146146325db5cb990d53650ebfaf5741",class:"middle-center"},a("a",{key:"d2edfbc2e1034a9378be6291bf290af6d0e36119",href:"https://x.com/nanopore",target:"_blank"},a("nano-icon",{key:"8e8cb317194b2dd9277599c38b525128d94d69c0",name:"brands/x-twitter",size:"large",ariaLabel:"X (formerly Twitter)"})),a("a",{key:"07091f28412bf31e853c5c51d6448631a7e47b33",href:"https://bsky.app/profile/nanoporetech.com",target:"_blank"},a("nano-icon",{key:"8e5f4e5b2d13ce77df193d4a38743d6225f667d6",name:"brands/bluesky",size:"large",ariaLabel:"Bluesky"})),a("a",{key:"2561aa967f77b1ac0618c02fe1e78c270d8f82f7",href:"https://www.youtube.com/channel/UC5yMlYjHSgFfZ37LYq-dzig",target:"_blank"},a("nano-icon",{key:"27ac4933b66ff7027c3f45bc001d0e311055cf0a",name:"brands/youtube",size:"large",ariaLabel:"YouTube"})),a("a",{key:"2b46f3651b32439997c4f1020d89901bcf6679a8",href:"https://www.facebook.com/Oxford-Nanopore-Technologies-251034380246/",target:"_blank"},a("nano-icon",{key:"0f25dc9636ece933dbc00911d0e0c36735203666",name:"brands/facebook",size:"large",ariaLabel:"Facebook"})),a("a",{key:"541bef691993ace5b8c270e82d08984baace7964",href:"https://www.linkedin.com/company/oxford-nanopore-technologies",target:"_blank"},a("nano-icon",{key:"bb4a4104c3a39375d1f50c7c8aca1561a66d9c28",name:"brands/linkedin",size:"large",ariaLabel:"LinkedIn"})),a("a",{key:"4817a0798d5ab0586a20c40a14de73280ce749e3",href:"https://www.instagram.com/oxfordnanopore",target:"_blank"},a("nano-icon",{key:"dea3b9c4bc6100f73a3769999779ab4e6f343193",name:"brands/instagram",size:"large",ariaLabel:"Instagram"}))),a("div",{key:"151bbc03ca7c9fbdb14cf355dd4ff61c6fba1e36",class:"middle-end"},a("slot",{key:"241922e25dbe52e5a6e5b9b661c037f3faa004f5",name:"middle-end"}))),a("div",{key:"08489f7cb75832e26fe862987d19bbdc03b8ff23",class:"bottom"},a("div",{key:"1e2cfb25bbb0f6a60399b344f83a091677d848d7",class:"bottom-start"},a("slot",{key:"ce19389f907a75fb43a533a7ca200670b136ad86",name:"bottom-start"},a("p",{key:"5d6d5135e67276a81f290e91d7753b9b2b4964ce"},"© 2008 - 2025 Oxford Nanopore Technologies plc. All rights reserved. Registered Office: Gosling Building, Edmund Halley Road, Oxford Science Park, OX4 4DQ, UK | Registered No. 05386273 | VAT No 336942382. Oxford Nanopore Technologies, the Wheel icon, EPI2ME, Flongle, GridION, Metrichor, MinION, MinIT, MinKNOW, Plongle, PromethION, SmidgION, Ubik and VolTRAX are registered trademarks of Oxford Nanopore Technologies plc in various countries. Oxford Nanopore Technologies products are not intended for use for health assessment or to diagnose, treat, mitigate, cure, or prevent any disease or condition."))),a("div",{key:"db091f94e130553a106a71071988b2c591a943ab",class:"bottom-end"},a("slot",{key:"6b6642608e571e9d1690de419727476b27e1514f",name:"bottom-end"})))))}};t.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  --col-gap: var(--nano-spacing-l1-default);\n  --icon-gap-md: var(--nano-spacing-md);\n  --icon-gap-sm: var(--nano-spacing-sm);\n  --vertical-padding: var(--nano-spacing-l1-default);\n  --horizontal-padding: 0;\n  --header-margin: 0 0 var(--nano-spacing-l1-default) 0;\n  display: block;\n}\n:host .footer {\n  container-type: inline-size;\n  container-name: footer-container;\n  display: flex;\n  flex-direction: column;\n}\n@container footer-container (max-width: 768px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-md);\n    --col-gap: var(--nano-spacing-l);\n    --vertical-padding: var(--nano-spacing-md);\n  }\n  :host .top-start,\n  :host .top-center,\n  :host .top-end {\n    --header-margin: 0 0 var(--nano-spacing-md) 0;\n  }\n}\n@container footer-container (max-width: 1023px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l);\n  }\n}\n@container footer-container (max-width: 1346px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    --horizontal-padding: var(--nano-spacing-l1-default);\n  }\n}\n:host .upper {\n  background-color: var(--nano-color-base-rgb-1000);\n  border-block-start: 1px solid var(--nano-color-neutral-200);\n}\n:host .lower {\n  background-color: var(--nano-color-base-0);\n  color: var(--nano-color-base-1000);\n}\n:host .top,\n:host .middle,\n:host .bottom {\n  display: grid;\n  gap: var(--col-gap);\n  margin: 0 auto;\n  max-inline-size: 1266px;\n}\n:host .top,\n:host .middle {\n  grid-template-columns: repeat(3, 1fr);\n  padding: var(--vertical-padding) var(--horizontal-padding);\n}\n:host .bottom {\n  grid-template-columns: repeat(2, 1fr);\n  padding-inline: var(--horizontal-padding);\n  padding-block-end: var(--vertical-padding);\n}\n:host .middle-center a {\n  color: inherit;\n}\n:host .middle-center a:hover {\n  color: var(--nano-color-primary-1000);\n}\n:host .middle-center a:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n:host .top-start,\n:host .top-center,\n:host .top-end {\n  flex-direction: column;\n}\n:host .middle-start,\n:host .middle-center,\n:host .middle-end {\n  align-items: center;\n}\n:host .middle-start {\n  display: flex;\n  justify-content: flex-start;\n}\n:host .middle-center {\n  display: flex;\n  justify-content: center;\n  gap: var(--icon-gap-md);\n  flex-wrap: nowrap;\n}\n:host .middle-end {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 20rem));\n  gap: var(--icon-gap-sm);\n  justify-content: end;\n}\n:host [slot=middle-end] {\n  inline-size: 100%;\n}\n:host .bottom-start p,\n:host .bottom-start ::slotted(p), .bottom-start :host::slotted(p) {\n  font-weight: var(--nano-font-weight-normal) !important;\n  font-size: var(--nano-font-size-xs) !important;\n  line-height: var(--nano-line-height-normal) !important;\n  letter-spacing: var(--nano-letter-spacing-loose) !important;\n  margin-block: 0 !important;\n}\n:host .bottom-end {\n  display: flex;\n  justify-content: flex-end;\n}\n:host .bottom-end ::slotted(*), .bottom-end :host::slotted(*) {\n  --input-font-size: var(--nano-font-size-2xs) !important;\n  max-inline-size: 9rem !important;\n}\n@container footer-container (max-width: 912px) {\n  :host .top,\n  :host .middle,\n  :host .bottom {\n    grid-template-columns: 1fr;\n  }\n  :host .middle-center {\n    flex-wrap: wrap;\n  }\n  :host .middle-end {\n    grid-template-columns: minmax(0, 6.6rem);\n  }\n  :host .bottom {\n    display: flex;\n    flex-direction: column-reverse;\n    align-items: center;\n  }\n  :host .middle-start,\n  :host .middle-center,\n  :host .middle-end {\n    justify-content: center;\n  }\n}";export{t as nano_footer}

package/dist/nano-components/nano-global-nav.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{a as n,r as e,c as a,d as o,l as t}from"./index-CFYZ-ZOT.js";import{h as i}from"./renderer-LJzCFyMt.js";import{a as r}from"./algoliasearch-lite.esm.browser-C1SNUAIj.js";import{d as s}from"./throttle-C93FMm2Z.js";import{a as l}from"./style-BrRDhFfF.js";import{s as c}from"./search-insights-8OL2oeQN.js";const h=class{get host(){return n(this)}overflowMenu;overflowOpen=!1;logoUrl=location.protocol+"//"+location.host;cartUrl="";msgUrl="";loginUrl="";logoutUrl="";contactUrl="https://nanoporetech.com/contact";_sessionRedirect=window.location.href;get sessionRedirect(){return encodeURIComponent(this._sessionRedirect)}set sessionRedirect(n){this._sessionRedirect=n}cartCount=0;msgCount=0;async toggleOverflowMenu(){this.overflowOpen=!this.overflowOpen}myAccountUrl;async handleMyAccountUrl(){this.myAccountUrl&&("local-logged-in"!==this.myAccountUrl?"local-logged-out"!==this.myAccountUrl?fetch(this.myAccountUrl+"/nav_bar_data.json").then((n=>n.json())).then((n=>{this.myAccountData=n})).catch((n=>{console.error("Error fetching MyAccount data",n)})):this.myAccountData=await import("./local-logged-out-CD2oXHpq.js"):this.myAccountData=await import("./local-logged-in-DNQyU0ot.js"))}myAccountData;nanoUserData;userLinks=[];isLoggedIn=!1;get myAccountUser(){return this.myAccountData?.user?.uuid?this.myAccountData.user:null}processUserData(){this.myAccountUser&&(this.userLinks=this.myAccountData?.links.filter((n=>"profile-panel-list"===n.area)),this.loginUrl=this.loginUrl||this.myAccountData.urls.login,this.logoutUrl=this.logoutUrl||this.myAccountData.urls.logout,this.msgUrl=this.msgUrl||this.myAccountData.urls.messages,this.msgCount=this.msgCount||this.myAccountData.notifications.count,this.cartUrl=this.cartUrl||this.myAccountData.urls.cart,this.cartCount=this.cartCount||this.myAccountData.cart.count,this.isLoggedIn=!0,this.nanoUserData.emit(this.myAccountUser))}formatLoginLink(n){return n?this.sessionRedirect?n.endsWith("=")?n+this.sessionRedirect:n.includes("?")?n+"&ReplayState="+this.sessionRedirect:n+"?ReplayState="+this.sessionRedirect:n:""}resizeObserver;cachedWidth;mainMenu;_mainMenuBar;get mainMenuBar(){return this._mainMenuBar}set mainMenuBar(n){this._mainMenuBar!==n&&(this._mainMenuBar=n,this.addMainmenuRo())}shouldResize=!0;breakpoint=0;breakpointChanged(){this.breakpoint<this.bpPartials.mainMenu.breakpoint&&!1===this.shouldResize&&(this.overflowOpen=!1)}debounceResetResize=s((()=>{this.shouldResize=!1}),300);addMainmenuRo(){this.removeMainmenuRo(),(this.resizeObserver=new ResizeObserver((()=>{this.shouldResize||this.mainMenuBar.clientWidth>=this.cachedWidth&&0===this.breakpoint||this.mainMenuBar.clientWidth<=this.cachedWidth&&this.mainMenuBar.clientWidth>=this.mainMenu.scrollWidth||(this.shouldResize=!0,this.breakpoint=0)}))).observe(this.mainMenuBar)}removeMainmenuRo(){this.resizeObserver&&(this.mainMenuBar?this.resizeObserver.unobserve(this.mainMenuBar):this.resizeObserver.disconnect())}handleResize=()=>{this.shouldResize&&(this.breakpoint<4&&this.mainMenu.scrollWidth>this.mainMenuBar.clientWidth?this.breakpoint++:(this.cachedWidth=this.mainMenuBar.clientWidth,this.debounceResetResize()))};algoliaClient;searchResults;searchInput;activeIndex;autocompleteResults;searchForm;searchIndices=[];searchBarShown=!1;searchLoading=!1;_searchValue="";nanoSearchResult;nanoSearchError;nanoSearchReset;searchIndex="All";get searchValue(){return this._searchValue}set searchValue(n){n&&this.host.componentOnReady().then((()=>{this.searchBarShown=!0,this.handleSearchTermChangeEvent(n)}))}async submitSearch(){this.onSearchSubmit()}handleSearchIndex(){if(this.searchIndices?.length){if(this.searchIndex)return this.activeIndex=this.searchIndices.find((n=>n.name===this.searchIndex))||this.searchIndices[0],this.activeIndex;this.activeIndex=this.searchIndices[0]}}initSearch(){if(!this.myAccountData)return;const{search:n}=this.myAccountData;n?.app_id&&n?.api_key&&(this.algoliaClient=r(n.app_id,n.api_key),c.init(n.app_id,n.api_key).then((()=>{this.myAccountUser&&c.setUser(this.myAccountUser.uuid)})),this.searchIndices=this.myAccountData.search.indeces,this.searchIndices.forEach((n=>{n.algoliaIndex=this.algoliaClient.initIndex(n.index)})),this.searchIndex||(this.searchIndex=this.searchIndices[0].name))}onSearchSubmit=async n=>{if(n&&n.preventDefault(),!this.activeIndex||!this.myAccountData||this._searchValue?.length<3)return;this.searchResults||await this.doAlgoliaSearch();const{search:e}=this.myAccountData,a=this.searchResults.results.find((n=>this.activeIndex.index===n.index)),{index:o,domain:t,filters:i,query:r,replicas:s}=a;this.searchBarShown=!1,this.nanoSearchResult.emit({meta:{indexTitle:a.indexName,index:o,domain:t,filters:i,query:r,replicas:s},client:{apiKey:e.api_key,appId:e.app_id}})};async doAlgoliaSearch(){this.searchResults=null;const n=this.searchIndices.map((n=>{const e={clickAnalytics:!0,attributesToSnippet:["body:5","title:8"],indexName:n.index,query:this._searchValue,facets:n.filters,hitsPerPage:5,filters:""};return"Community"===n.name&&(e.filters="created > "+Math.floor((Date.now()-631152e5)/1e3)),e}));try{this.searchLoading=!0,this.searchResults=this.processSearchResults(await this.algoliaClient.search(n))}catch(n){console.error(n),this.nanoSearchError.emit(n)}return this.searchLoading=!1,this.searchResults}processSearchResults(n){const e=n,a=n;return e.results?(e.results.forEach(((n,a)=>{n={...n,indexName:this.searchIndices[a].name,selected:this.activeIndex.name===this.searchIndices[a].name,domain:this.activeIndex.domain||null,domains:this.myAccountData.domains||null,allGroup:!!this.searchIndices[a].allGroup,filters:this.searchIndices[a].filters,replicas:this.activeIndex.replicas},e.results[a]=this.processSearchResults(n)})),e):(a.hits.map((n=>{n.url&&!n.url.match(/^http/)&&(n.url=location.protocol+"//"+this.domainFor(n.origin)+n.url)})),a)}domainFor(n){if(!this.myAccountData)return"";const e=this.myAccountData.domains.find((e=>e.origin===n));return e?e.domain:""}async setAutocompleteResults(){this.autocompleteResults=null,this._searchValue.length<3?this._searchValue.length||this.nanoSearchReset.emit():this.autocompleteResults=(await this.doAlgoliaSearch()).results.find((n=>n.selected))}autocompleteSnippet(n){return n._snippetResult?.title?.value||n.title}handleSearchOpenEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&(this.searchInput.setFocus(),this.searchBarShown=!0)};handleSearchCloseEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&(this.searchBarShown=!1)};handleSearchTermInputEvent=n=>{"input"===n.detail.type&&this.searchInput.value.length>=3&&(this.autocompleteResults=null,this.searchLoading=!0)};handleSearchTermChangeEvent=n=>{this._searchValue!==n&&(this._searchValue=n,this.setAutocompleteResults())};handleSearchIndexChangeEvent=n=>{if(!n.detail?.value?.length)return;const e=n.detail.value;if(this.activeIndex.index===e)return;const a=this.searchIndices.find((n=>n.index===e));a&&a.algoliaIndex&&(this.searchIndex=a.name,this._searchValue.length>=3&&(this.searchInput.setFocus(),this.searchBarShown=!0,this.setAutocompleteResults()))};constructor(n){e(this,n),this.nanoUserData=a(this,"nanoUserData",7),this.nanoSearchResult=a(this,"nanoSearchResult",7),this.nanoSearchError=a(this,"nanoSearchError",7),this.nanoSearchReset=a(this,"nanoSearchReset",7),this.handleResize=s(this.handleResize,75)}componentWillLoad(){this.handleMyAccountUrl(),this.initSearch(),this.processUserData(),l(this.host.shadowRoot)}componentDidRender(){this.handleResize()}loggedInPanel(){if(this.isLoggedIn&&this.myAccountUser)return i("div",{part:"user-panel",class:"gn__user-panel nano-theme-dark"},i("div",{class:"gn__user-panel-head",slot:"label"},i("nano-avatar",{initials:this.myAccountUser.first_name?.charAt(0)+this.myAccountUser.last_name?.charAt(0)},this.myAccountUser.small_avatar_url&&!this.myAccountUser.small_avatar_url.includes("generic")&&i("img",{src:this.myAccountUser.small_avatar_url,alt:"User Avatar",height:40,width:40})),i("div",null,this.myAccountUser.name,i("br",null),this.myAccountUser.job_title,", ",this.myAccountUser.company)),i("div",{class:"gn__user-panel-body"},this.userLinks.map((n=>i("a",{href:n.address,target:n.target||void 0},n.title,("Messages"===n.title||n.address.includes(this.msgUrl)||this.msgUrl.includes(n.address))&&this.msgCount>0&&i("nano-badge",{theme:"danger",strength:"2"},this.msgCount))))),i("div",{class:"gn__user-panel-foot"},i("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},i("a",{href:this.formatLoginLink(this.logoutUrl)},"Logout"))))}bpPartials={contact:{tpl:()=>i("a",{href:this.contactUrl},"Contact"),breakpoint:0},mainMenu:{tpl:()=>i("slot",{name:"menu"}),breakpoint:1},logo:{tpl:()=>{},breakpoint:2}};noResultPartial(){if(this.searchLoading||this.autocompleteResults?.hits.length||this._searchValue.length<3)return;const n=[];return"All"===this.searchIndex?(n.push(i("div",{slot:"no-result",class:"gn__search-no-results"},'No results matching for "',i("strong",null,this._searchValue),'" Try another phrase')),n):(this.searchResults.results.forEach((e=>{e.hits.length&&n.push(i("nano-option",{class:"gn__search-result",onNanoSelect:n=>{n.preventDefault(),this.searchIndex=e.indexName,this.onSearchSubmit(n)}},'Show results for "',i("strong",null,this._searchValue),'" in ',i("strong",null,e.indexName)))})),n.unshift(i("div",{slot:n.length?"list-top":"no-result",class:"gn__search-no-results"},'No results matching for "',i("strong",null,this._searchValue),'" in'," ",i("strong",null,this.searchIndex),". Try another phrase")),n)}render(){const n=this.bpPartials;return i(o,{key:"c968c75746e8b8211210b47c595cff25f0af8933",class:{"overflow-menu":this.breakpoint>n.mainMenu.breakpoint,"bar-menu":this.breakpoint<=n.mainMenu.breakpoint,"nano-global-nav":!0}},i("div",{key:"edeec7490c6a32e2a44f3a8109f5d3f18c9d6101",class:{gn:!0,"gn__search-open":this.searchBarShown}},i("nano-drawer",{key:"56df68664885f1ed133b75e7f290405eb32bed67",ref:n=>this.overflowMenu=n,label:"Main menu",part:"drawer",class:"gn__drawer nano-theme-dark",placement:"start",open:this.overflowOpen,onNanoAfterHide:()=>this.overflowOpen=!1,onNanoAfterShow:()=>this.overflowOpen=!0},i("div",{key:"da5e97e862497b1af8f0d0b3ed67e0dd03761f28",class:"gn__drawer-header",part:"overflow-header",slot:"label"},"Main menu"),i("nav",{key:"3336390377aba9b2f127a7e1056fb80ba7d1ec75",class:"gn__drawer-menu",part:"overflow-menu"},this.breakpoint>n.mainMenu.breakpoint?n.mainMenu.tpl():"",i("slot",{key:"8c29d087282917c213beeadf719840c44b0f5494",name:"overflow"}))),i("div",{key:"6f07398ab8cd7d5f5fadafdb1d1f29ee9917efc3",class:"gn__menu-bar-wrapper"},i("div",{key:"58546b45ca7ba896a9f0e1c5e528e191602e64a8",class:"gn__menu-bar",part:"menu-bar",ref:n=>this.mainMenuBar=n},i("nav",{key:"dd3d1cf935f2231e280cb0c7697c55470887c949",class:"gn__main-menu "+(this.shouldResize?"resizing":""),part:"main-menu",ref:n=>this.mainMenu=n},this.breakpoint>n.mainMenu.breakpoint&&i("nano-icon-button",{key:"aa31d9a9cc0e1ad0d4db76ca9f4add388cef95bd",class:"gn__overflow-button",iconName:"light/bars",label:"Open Menu",onClick:()=>this.overflowMenu.show()}),i("slot",{key:"02abef6f7550594481eff44ae5e332d74ba61138",name:"logo"},i("a",{key:"084b9f9f88c68933f0d038b655833c5ba0117498",href:this.logoUrl,class:"gn__logo-link",part:"logo-link"},i("img",this.breakpoint<=n.logo.breakpoint?{src:t("../nano-assets/ont-logo.svg"),alt:"Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--large",width:"152",height:"36",part:"logo logo--large"}:{src:t("../nano-assets/ont-wheel.svg"),alt:"Oxford Nanopore Technologies logo. A stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--small",width:"36",height:"36",part:"logo logo--small"}))),this.breakpoint<=n.mainMenu.breakpoint&&i("div",{key:"130b8ce4dfd708a8a884aa172a6b7c1a7defa204",class:"gn__main-menu-links"},n.mainMenu.tpl()),i("div",{key:"e4f69fca3d5a6700de16f8102dbf916a0b0e4d77",class:"gn__main-menu-actions"},i("nano-dropdown",{key:"40033ff956c6f0b59ef5f569a00e56efc8e0f8df",dialogTitle:"Search Oxford Nanopore Technologies",placement:"bottom",class:"gn__search-dropdown",skidding:-30,distance:25,open:this.searchBarShown,onNanoAfterShow:this.handleSearchOpenEvent,onNanoAfterHide:this.handleSearchCloseEvent,autoOpen:!!this.searchIndices.length},i("nano-icon-button",{key:"32b4e3be46dae8578c4adf038bda844d3bf4b8b9",class:"gn__search-button",slot:"trigger",iconName:"light/magnifying-glass",label:"Search"}),!!this.searchIndices.length&&i("form",{key:"17ee6f5b011997b09148d8a09749931ae0e681f0",ref:n=>this.searchForm=n,class:"gn__search-form",part:"search-form",onSubmit:this.onSearchSubmit},this.searchIndices.length>1&&i("nano-select",{key:"800b2d3b1343a6d09a8951b753742e6eb5731648",part:"search-select",label:"Which site do you wish to search in?",mask:!0,hideLabel:!0,value:this.activeIndex?.index,onNanoChange:this.handleSearchIndexChangeEvent},this.searchIndices.map((n=>i("nano-option",{selected:n.name===this.searchIndex,value:n.index},n.name||n.index)))),i("nano-input",{key:"a8eb120a2268645e17935d5dd86e8cf9de550866",ref:n=>this.searchInput=n,part:"search-input",label:"Search Oxford Nanopore Technologies",placeholder:"Search Oxford Nanopore...",hideLabel:!0,clearable:!0,onNanoChange:n=>{this.handleSearchTermChangeEvent(n.detail.value)},onNanoInput:this.handleSearchTermInputEvent,debounce:500,value:this._searchValue},i("nano-icon",{key:"33472cd1d86a17143253aed1a7924b05343614a7",slot:"end",name:"light/magnifying-glass"}),i("nano-datalist",{key:"f88f3bcef70a7a29410d77ba849862ffc9db6562",class:"gn__search-results",onNanoSelect:n=>n.preventDefault(),dropDownConfig:{tetherTo:this.searchForm},disableFilter:!0},this.searchLoading&&i("div",{key:"075a4615d1715d941bd2368db97375f614867477",slot:"no-result",class:"gn__search-loading"},i("nano-spinner",{key:"5194af389122625d1209e25208de761fa15dd7e3"},"Searching...")),this.noResultPartial(),!!this.autocompleteResults?.hits.length&&[this.autocompleteResults.hits.map(((n,e)=>i("nano-option",{href:n.url,class:"gn__search-result",onClick:()=>{c.sendClick({index:this.activeIndex.index,eventName:"Global nav quick search - search result clicked",queryID:this.autocompleteResults.queryID,objectIDs:[n.objectID],positions:[e+1]})}},i("span",{innerHTML:this.autocompleteSnippet(n)})))),i("nano-option",{key:"c9dec204a82019869cc9b8086f07cfbfdf309f15",class:"gn__search-viewall",onNanoSelect:this.onSearchSubmit},"View all results")])))),i("div",{key:"986773d6af8b1b50000db8c428c2f25f07298a3c",class:"gn__cart"},i("nano-icon-button",{key:"0afee86e684d4136e729955d28444a6c8a27838f",iconName:"light/cart-shopping",label:"View your cart",href:this.cartUrl}),!!this.cartCount&&i("nano-badge",{key:"6305ad69d802aeda9a132ca204baf8b7b3aa17be",theme:"danger",strength:"2"},this.cartCount>9?"9+":this.cartCount)),this.breakpoint<=n.contact.breakpoint?n.contact.tpl():"",this.isLoggedIn?i("nano-dropdown",{dialogTitle:"User menu",class:"gn__user-dropdown",distance:10,placement:"bottom-end"},i("button",{slot:"trigger",class:"gn__user-dropdown-trigger"},i("nano-icon",{name:"light/user"}),i("nano-icon",{name:"light/chevron-down",class:"gn__user-dropdown-chevron"}),!!this.msgCount&&i("nano-badge",{theme:"danger",strength:"2"},this.msgCount>9?"9+":this.msgCount)),this.loggedInPanel()):i("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},i("a",{href:this.formatLoginLink(this.loginUrl)},"Login")))))),i("div",{key:"7c8b5194019e9b8346f6e0e927cff22ccf8b3e2e",class:"gn__site",part:"site-wrapper"},i("nano-global-search-results",{key:"213396f31494cb46551fd6839b95bf4155982a57",part:"site-search-results"},i("slot",{key:"d9471b1379c08106453aef43c0e590cf272a425f"})))))}static get assetsDirs(){return["assets"]}static get watchers(){return{myAccountUrl:["handleMyAccountUrl"],myAccountData:["processUserData","initSearch"],shouldResize:["breakpointChanged"],breakpoint:["breakpointChanged"],searchIndices:["handleSearchIndex"],searchIndex:["handleSearchIndex"]}}};h.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--main-menu-bar-bg-color:var(--nano-color-base-0);--main-menu-text-color:var(--nano-color-base-1000);--main-menu-hover-text-color:var(--nano-color-primary-1000);--main-menu-active-text-color:var(--nano-color-primary-1200);--main-menu-active-border-color:var(--nano-color-primary-1000);--overflow-bg-color:var(--nano-color-grey-mono-1600);--overflow-text-color:var(--nano-color-basic-white);--overflow-hover-text-color:var(--nano-color-blue-cerulean-700);--overflow-active-text-color:var(--nano-color-blue-cerulean-300);display:block;color:var(--main-menu-text-color)}img{max-inline-size:none;display:block}::slotted(a),:host::slotted(a),a{text-decoration:none}a:has(img){display:inline-block}a:focus{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}nano-drawer:not(:defined){display:none}nano-badge{position:absolute;font-size:0.5625rem;pointer-events:none}.gn__cart{position:relative}.gn__cart nano-badge{inset-block-start:-0.35rem;inset-inline-end:-0.4rem}.gn__login-cta{--bg:transparent}.gn__menu-bar-wrapper{z-index:var(--nano-z-index-menubar);position:relative}.gn__menu-bar-wrapper::after{content:"";position:absolute;block-size:1px;inline-size:100%;inset-inline:0;inset-block-end:-1px;z-index:-3;background-color:var(--nano-color-neutral-200)}.gn__menu-bar{inline-size:100%;overflow:clip}.gn__menu-bar a{color:var(--main-menu-text-color)}.gn__menu-bar a:hover{color:var(--main-menu-hover-text-color)}.gn__menu-bar a:active{color:var(--main-menu-active-text-color)}.gn__main-menu{display:inline-flex;align-items:center;background-color:var(--main-menu-bar-bg-color);min-inline-size:100%;padding:var(--nano-spacing-md);transition:opacity var(--nano-transition-x-fast) ease;opacity:1}.gn__main-menu.resizing{transition:none;opacity:0}.gn__main-menu>*{margin-inline-end:var(--nano-spacing-xl)}.gn__main-menu>*:is(slot){display:flex}.gn__main-menu>*:last-child{margin-inline-end:0}.gn__overflow-button{--padding:0.5rem 0.875rem 0.5rem 0;margin-inline-end:0.875rem;font-size:1.125rem;position:relative}.gn__overflow-button::after{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-end:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__main-menu-links,.gn__main-menu-actions{display:inline-flex;align-items:center}.gn__main-menu-links .nano-icon,.gn__main-menu-links .nano-icon-button,.gn__main-menu-actions .nano-icon,.gn__main-menu-actions .nano-icon-button{--active-color:var(--main-menu-active-text-color);--hover-color:var(--main-menu-hover-text-color);font-size:1rem}.gn__main-menu-links .nano-icon-button:hover,.gn__main-menu-actions .nano-icon-button:hover{color:var(--main-menu-hover-text-color)}.gn__main-menu-links{gap:var(--nano-spacing-xl)}.gn__main-menu-links ::slotted(a),.gn__main-menu-links::slotted(a){color:var(--main-menu-text-color)}.gn__main-menu-links ::slotted(a:hover){color:var(--main-menu-hover-text-color)}.gn__main-menu-links ::slotted(*:active){color:var(--main-menu-active-text-color)}.gn__main-menu-actions{margin-inline-start:auto;font-size:0.9375rem;gap:var(--nano-spacing-md)}.gn__search-dropdown{--overflow:visible;--padding:0;--background:transparent}.gn__search-dropdown .nano-icon-button{position:relative}.gn__search-dropdown .nano-icon-button::before{content:"";position:absolute;background-color:var(--main-menu-active-border-color);block-size:4px;inset-inline:5px 2px;inset-block-end:-1.5625rem;transform:translateZ(0) scaleX(0);transform-origin:0 center;transition:transform var(--nano-transition-x-fast) ease-in-out}.gn__search-open .gn__search-dropdown .nano-icon-button::before{transform:translateZ(0) scaleX(1)}.gn__search-form{display:inline-flex;max-inline-size:100vw;inline-size:30.625rem}.gn__search-form .nano-select{--input-bg-color:var(--nano-color-neutral-200);flex:0}.gn__search-form .nano-select:focus-within{z-index:1}.gn__search-form .nano-select .form-ctrl__input{border-inline-end:none}.gn__search-form .nano-input{flex:1}.gn__search-results{--padding-start:var(--nano-spacing-md);--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);font-size:var(--nano-font-size-2xs)}.gn__search-loading{display:flex;justify-content:center}.gn__search-result{--padding-start:0.3125rem;--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-neutral-1400);font-size:var(--nano-font-size-2xs)}.gn__search-result .search__highlight{font-style:normal;background:var(--nano-color-highlight)}.gn__search-viewall{--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-primary-1200)}.gn__search-viewall::part(label),.gn__search-viewall [part~="label"]{justify-content:flex-end;text-decoration:underline}.gn__user-dropdown-trigger{all:unset;cursor:pointer;color:var(--nano-color-primary-1200);display:flex;white-space:nowrap;gap:var(--nano-spacing-xs);align-items:center;position:relative;padding-inline-start:var(--nano-spacing-md)}.gn__user-dropdown-trigger:hover{color:var(--main-menu-hover-text-color)}.gn__user-dropdown-trigger:active{color:var(--main-menu-active-text-color)}.gn__user-dropdown-trigger:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.gn__user-dropdown-trigger::before{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-start:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__user-dropdown-trigger .gn__user-dropdown-chevron{transition:rotate var(--nano-transition-x-fast) linear}[open] .gn__user-dropdown-trigger .gn__user-dropdown-chevron{rotate:180deg}.gn__user-dropdown-trigger nano-badge{inset-block-start:-0.7rem;inset-inline-end:-0.7rem}.gn__user-dropdown{--background:var(--overflow-bg-color);--padding:0;--overflow:visible}.gn__user-panel{inline-size:21.25rem;max-inline-size:21.25rem;color:var(--overflow-text-color);padding:var(--nano-spacing-md)}.gn__user-panel a{color:var(--overflow-text-color)}.gn__user-panel a:hover{text-decoration:underline;color:var(--overflow-hover-text-color)}.gn__user-panel-head{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding-block-end:var(--nano-spacing-md);display:flex;align-items:center;gap:var(--nano-spacing-sm);font-size:var(--nano-font-size-xs)}.gn__user-panel-head .gn__user-avatar nano-icon{font-size:2.5rem}.gn__user-panel-body{display:flex;flex-direction:column}.gn__user-panel-body a{position:relative;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);padding-block:var(--nano-spacing-md)}.gn__user-panel-body a:first-child{border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__user-panel-foot{padding-block-start:var(--nano-spacing-md);display:flex;align-items:center;justify-content:space-between;gap:var(--nano-spacing-md)}.gn__drawer{--panel-background:var(--overflow-bg-color);--header-button-color:var(--overflow-text-color);--body-spacing:0;--header-spacing:var(--nano-spacing-md) 0;--footer-spacing:var(--nano-spacing-md)}.gn__drawer::part(title),.gn__drawer [part~="title"]{display:flex;justify-content:flex-end}.gn__drawer::part(header-actions),.gn__drawer [part~="header-actions"]{order:-1}.gn__drawer-header{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.gn__drawer-menu{display:flex;flex-direction:column;margin:0 var(--nano-spacing-md);padding-block-end:var(--nano-spacing-md);color:var(--overflow-text-color);border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);position:relative}.gn__drawer-menu ::slotted(a),.gn__drawer-menu::slotted(a){padding:var(--nano-spacing-md) 0}.gn__drawer-menu ::slotted(a),.gn__drawer-menu ::slotted(.nano-nav-item),.gn__drawer-menu::slotted(a),.gn__drawer-menu::slotted(.nano-nav-item){--padding:var(--nano-spacing-md) 0;display:block;color:inherit !important;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__drawer-menu ::slotted(a:hover),.gn__drawer-menu ::slotted(.nano-nav-item:hover){text-decoration:underline;color:var(--overflow-hover-text-color) !important}';export{h as nano_global_nav}
+import{a as n,r as e,c as a,d as o,l as t}from"./index-DXvE-U_j.js";import{h as i}from"./renderer-BUaAsDso.js";import{a as r}from"./algoliasearch-lite.esm.browser-C1SNUAIj.js";import{d as s}from"./throttle-C93FMm2Z.js";import{a as l}from"./style-BrRDhFfF.js";import{s as c}from"./search-insights-8OL2oeQN.js";const h=class{get host(){return n(this)}overflowMenu;overflowOpen=!1;logoUrl=location.protocol+"//"+location.host;cartUrl="";msgUrl="";loginUrl="";logoutUrl="";contactUrl="https://nanoporetech.com/contact";_sessionRedirect=window.location.href;get sessionRedirect(){return encodeURIComponent(this._sessionRedirect)}set sessionRedirect(n){this._sessionRedirect=n}cartCount=0;msgCount=0;async openOverflowMenu(){this.overflowOpen=!0}async closeOverflowMenu(){this.overflowOpen=!1}myAccountUrl;async handleMyAccountUrl(){this.myAccountUrl&&("local-logged-in"!==this.myAccountUrl?"local-logged-out"!==this.myAccountUrl?fetch(this.myAccountUrl+"/nav_bar_data.json").then((n=>n.json())).then((n=>{this.myAccountData=n})).catch((n=>{console.error("Error fetching MyAccount data",n)})):this.myAccountData=await import("./local-logged-out-CD2oXHpq.js"):this.myAccountData=await import("./local-logged-in-DNQyU0ot.js"))}myAccountData;nanoUserData;userLinks=[];isLoggedIn=!1;get myAccountUser(){return this.myAccountData?.user?.uuid?this.myAccountData.user:null}processUserData(){this.myAccountUser&&(this.userLinks=this.myAccountData?.links.filter((n=>"profile-panel-list"===n.area)),this.loginUrl=this.loginUrl||this.myAccountData.urls.login,this.logoutUrl=this.logoutUrl||this.myAccountData.urls.logout,this.msgUrl=this.msgUrl||this.myAccountData.urls.messages,this.msgCount=this.msgCount||this.myAccountData.notifications.count,this.cartUrl=this.cartUrl||this.myAccountData.urls.cart,this.cartCount=this.cartCount||this.myAccountData.cart.count,this.isLoggedIn=!0,this.nanoUserData.emit(this.myAccountUser))}formatLoginLink(n){return n?this.sessionRedirect?n.endsWith("=")?n+this.sessionRedirect:n.includes("?")?n+"&ReplayState="+this.sessionRedirect:n+"?ReplayState="+this.sessionRedirect:n:""}resizeObserver;cachedWidth;mainMenu;_mainMenuBar;get mainMenuBar(){return this._mainMenuBar}set mainMenuBar(n){this._mainMenuBar!==n&&(this._mainMenuBar=n,this.addMainmenuRo())}shouldResize=!0;breakpoint=0;breakpointChanged(){this.breakpoint<this.bpPartials.mainMenu.breakpoint&&!1===this.shouldResize&&(this.overflowOpen=!1)}debounceResetResize=s((()=>{this.shouldResize=!1}),300);addMainmenuRo(){this.removeMainmenuRo(),(this.resizeObserver=new ResizeObserver((()=>{this.shouldResize||this.mainMenuBar.clientWidth>=this.cachedWidth&&0===this.breakpoint||this.mainMenuBar.clientWidth<=this.cachedWidth&&this.mainMenuBar.clientWidth>=this.mainMenu.scrollWidth||(this.shouldResize=!0,this.breakpoint=0)}))).observe(this.mainMenuBar)}removeMainmenuRo(){this.resizeObserver&&(this.mainMenuBar?this.resizeObserver.unobserve(this.mainMenuBar):this.resizeObserver.disconnect())}handleResize=()=>{this.shouldResize&&(this.breakpoint<4&&this.mainMenu.scrollWidth>this.mainMenuBar.clientWidth?this.breakpoint++:(this.cachedWidth=this.mainMenuBar.clientWidth,this.debounceResetResize()))};algoliaClient;searchResults;searchInput;activeIndex;autocompleteResults;searchForm;searchIndices=[];searchBarShown=!1;searchLoading=!1;_searchValue="";nanoSearchResult;nanoSearchError;nanoSearchReset;searchIndex="All";get searchValue(){return this._searchValue}set searchValue(n){n&&this.host.componentOnReady().then((()=>{this.searchBarShown=!0,this.handleSearchTermChangeEvent(n)}))}async submitSearch(){this.onSearchSubmit()}handleSearchIndex(){if(this.searchIndices?.length){if(this.searchIndex)return this.activeIndex=this.searchIndices.find((n=>n.name===this.searchIndex))||this.searchIndices[0],this.activeIndex;this.activeIndex=this.searchIndices[0]}}initSearch(){if(!this.myAccountData)return;const{search:n}=this.myAccountData;n?.app_id&&n?.api_key&&(this.algoliaClient=r(n.app_id,n.api_key),c.init(n.app_id,n.api_key).then((()=>{this.myAccountUser&&c.setUser(this.myAccountUser.uuid)})),this.searchIndices=this.myAccountData.search.indeces,this.searchIndices.forEach((n=>{n.algoliaIndex=this.algoliaClient.initIndex(n.index)})),this.searchIndex||(this.searchIndex=this.searchIndices[0].name))}onSearchSubmit=async n=>{if(n&&n.preventDefault(),!this.activeIndex||!this.myAccountData||this._searchValue?.length<3)return;this.searchResults||await this.doAlgoliaSearch();const{search:e}=this.myAccountData,a=this.searchResults.results.find((n=>this.activeIndex.index===n.index)),{index:o,domain:t,filters:i,query:r,replicas:s}=a;this.searchBarShown=!1,this.nanoSearchResult.emit({meta:{indexTitle:a.indexName,index:o,domain:t,filters:i,query:r,replicas:s},client:{apiKey:e.api_key,appId:e.app_id}})};async doAlgoliaSearch(){this.searchResults=null;const n=this.searchIndices.map((n=>{const e={clickAnalytics:!0,attributesToSnippet:["body:5","title:8"],indexName:n.index,query:this._searchValue,facets:n.filters,hitsPerPage:5,filters:""};return"Community"===n.name&&(e.filters="created > "+Math.floor((Date.now()-631152e5)/1e3)),e}));try{this.searchLoading=!0,this.searchResults=this.processSearchResults(await this.algoliaClient.search(n))}catch(n){console.error(n),this.nanoSearchError.emit(n)}return this.searchLoading=!1,this.searchResults}processSearchResults(n){const e=n,a=n;return e.results?(e.results.forEach(((n,a)=>{n={...n,indexName:this.searchIndices[a].name,selected:this.activeIndex.name===this.searchIndices[a].name,domain:this.activeIndex.domain||null,domains:this.myAccountData.domains||null,allGroup:!!this.searchIndices[a].allGroup,filters:this.searchIndices[a].filters,replicas:this.activeIndex.replicas},e.results[a]=this.processSearchResults(n)})),e):(a.hits.map((n=>{n.url&&!n.url.match(/^http/)&&(n.url=location.protocol+"//"+this.domainFor(n.origin)+n.url)})),a)}domainFor(n){if(!this.myAccountData)return"";const e=this.myAccountData.domains.find((e=>e.origin===n));return e?e.domain:""}async setAutocompleteResults(){this.autocompleteResults=null,this._searchValue.length<3?this._searchValue.length||this.nanoSearchReset.emit():this.autocompleteResults=(await this.doAlgoliaSearch()).results.find((n=>n.selected))}autocompleteSnippet(n){return n._snippetResult?.title?.value||n.title}handleSearchOpenEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&(this.searchInput.setFocus(),this.searchBarShown=!0)};handleSearchCloseEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&(this.searchBarShown=!1)};handleSearchTermInputEvent=n=>{"input"===n.detail.type&&this.searchInput.value.length>=3&&(this.autocompleteResults=null,this.searchLoading=!0)};handleSearchTermChangeEvent=n=>{this._searchValue!==n&&(this._searchValue=n,this.setAutocompleteResults())};handleSearchIndexChangeEvent=n=>{if(!n.detail?.value?.length)return;const e=n.detail.value;if(this.activeIndex.index===e)return;const a=this.searchIndices.find((n=>n.index===e));a&&a.algoliaIndex&&(this.searchIndex=a.name,this._searchValue.length>=3&&(this.searchInput.setFocus(),this.searchBarShown=!0,this.setAutocompleteResults()))};constructor(n){e(this,n),this.nanoUserData=a(this,"nanoUserData",7),this.nanoSearchResult=a(this,"nanoSearchResult",7),this.nanoSearchError=a(this,"nanoSearchError",7),this.nanoSearchReset=a(this,"nanoSearchReset",7),this.handleResize=s(this.handleResize,75)}componentWillLoad(){this.handleMyAccountUrl(),this.initSearch(),this.processUserData(),l(this.host.shadowRoot)}componentDidRender(){this.handleResize()}loggedInPanel(){if(this.isLoggedIn&&this.myAccountUser)return i("div",{part:"user-panel",class:"gn__user-panel nano-theme-dark"},i("div",{class:"gn__user-panel-head",slot:"label"},i("nano-avatar",{initials:this.myAccountUser.first_name?.charAt(0)+this.myAccountUser.last_name?.charAt(0)},this.myAccountUser.small_avatar_url&&!this.myAccountUser.small_avatar_url.includes("generic")&&i("img",{src:this.myAccountUser.small_avatar_url,alt:"User Avatar",height:40,width:40})),i("div",null,this.myAccountUser.name,i("br",null),this.myAccountUser.job_title,", ",this.myAccountUser.company)),i("div",{class:"gn__user-panel-body"},this.userLinks.map((n=>i("a",{href:n.address,target:n.target||void 0},n.title,("Messages"===n.title||n.address.includes(this.msgUrl)||this.msgUrl.includes(n.address))&&this.msgCount>0&&i("nano-badge",{theme:"danger",strength:"2"},this.msgCount))))),i("div",{class:"gn__user-panel-foot"},i("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},i("a",{href:this.formatLoginLink(this.logoutUrl)},"Logout"))))}bpPartials={contact:{tpl:()=>i("a",{href:this.contactUrl},"Contact"),breakpoint:0},mainMenu:{tpl:()=>i("slot",{name:"menu"}),breakpoint:1},logo:{tpl:()=>{},breakpoint:2}};noResultPartial(){if(this.searchLoading||this.autocompleteResults?.hits.length||this._searchValue.length<3)return;const n=[];return"All"===this.searchIndex?(n.push(i("div",{slot:"no-result",class:"gn__search-no-results"},'No results matching for "',i("strong",null,this._searchValue),'" Try another phrase')),n):(this.searchResults.results.forEach((e=>{e.hits.length&&n.push(i("nano-option",{class:"gn__search-result",onNanoSelect:n=>{n.preventDefault(),this.searchIndex=e.indexName,this.onSearchSubmit(n)}},'Show results for "',i("strong",null,this._searchValue),'" in ',i("strong",null,e.indexName)))})),n.unshift(i("div",{slot:n.length?"list-top":"no-result",class:"gn__search-no-results"},'No results matching for "',i("strong",null,this._searchValue),'" in'," ",i("strong",null,this.searchIndex),". Try another phrase")),n)}render(){const n=this.bpPartials;return i(o,{key:"184e0e7a9468ebb9d60cfac752d955358a4fe0fe",class:{"overflow-menu":this.breakpoint>n.mainMenu.breakpoint,"bar-menu":this.breakpoint<=n.mainMenu.breakpoint,"nano-global-nav":!0}},i("div",{key:"8eaa12e98b9a38721b9f03e2d646d20add74b3e6",class:{gn:!0,"gn__search-open":this.searchBarShown}},i("nano-drawer",{key:"b874e6c5aa026ed4c266601c52d41859857f38b5",ref:n=>this.overflowMenu=n,label:"Main menu",part:"drawer",class:"gn__drawer nano-theme-dark",placement:"start",open:this.overflowOpen,onNanoAfterHide:()=>this.overflowOpen=!1,onNanoAfterShow:()=>this.overflowOpen=!0},i("div",{key:"29e9160530cb0bfbc335cbae26a22a4a3fecdff7",class:"gn__drawer-header",part:"overflow-header",slot:"label"},"Main menu"),i("nav",{key:"0b09f539037bd906065f5cf2cc6e806173d97b66",class:"gn__drawer-menu",part:"overflow-menu"},this.breakpoint>n.mainMenu.breakpoint?n.mainMenu.tpl():"",i("slot",{key:"197989ea9849d9143024538c26b2678c6220e6d4",name:"overflow"}))),i("div",{key:"ce2b19cb76ff12eda8c4589ac188749ba3684c9f",class:"gn__menu-bar-wrapper"},i("div",{key:"11c7745248090f0163a2a505fb5a20f56fdd11d2",class:"gn__menu-bar",part:"menu-bar",ref:n=>this.mainMenuBar=n},i("nav",{key:"a797355c5204357100884bf865d5ffb58967028e",class:"gn__main-menu "+(this.shouldResize?"resizing":""),part:"main-menu",ref:n=>this.mainMenu=n},this.breakpoint>n.mainMenu.breakpoint&&i("nano-icon-button",{key:"0bf6477cd3dac4dd6cb0f55dd3ff3a313b55fb84",class:"gn__overflow-button",iconName:"light/bars",label:"Open Menu",onClick:()=>this.overflowMenu.show()}),i("slot",{key:"8dbb4a02f736efcddc019aa602953ff41c5eb15e",name:"logo"},i("a",{key:"5d60a835f364ada7ae8d8ee7b608df9b75443c26",href:this.logoUrl,class:"gn__logo-link",part:"logo-link"},i("img",this.breakpoint<=n.logo.breakpoint?{src:t("../nano-assets/ont-logo.svg"),alt:"Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--large",width:"152",height:"36",part:"logo logo--large"}:{src:t("../nano-assets/ont-wheel.svg"),alt:"Oxford Nanopore Technologies logo. A stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--small",width:"36",height:"36",part:"logo logo--small"}))),this.breakpoint<=n.mainMenu.breakpoint&&i("div",{key:"4270c5dc3e334ca906debe763771acc1dc4dd82b",class:"gn__main-menu-links"},n.mainMenu.tpl()),i("div",{key:"7f39cd0f1338a1124a6c59c18774c62d7b3e36e7",class:"gn__main-menu-actions"},i("nano-dropdown",{key:"503d51cd5f72ad19203bab7939230f8f7a7f4bd3",dialogTitle:"Search Oxford Nanopore Technologies",placement:"bottom",class:"gn__search-dropdown",skidding:-30,distance:25,open:this.searchBarShown,onNanoAfterShow:this.handleSearchOpenEvent,onNanoAfterHide:this.handleSearchCloseEvent,autoOpen:!!this.searchIndices.length},i("nano-icon-button",{key:"0a82c9022cb41265d8cb969057404ad32d7179f2",class:"gn__search-button",slot:"trigger",iconName:"light/magnifying-glass",label:"Search"}),!!this.searchIndices.length&&i("form",{key:"ee9b0742d2e8e6c3e51d35de68141bedb3677081",ref:n=>this.searchForm=n,class:"gn__search-form",part:"search-form",onSubmit:this.onSearchSubmit},this.searchIndices.length>1&&i("nano-select",{key:"df0da7c60f0ced0d52eeb84360a7215d7247a5e7",part:"search-select",label:"Which site do you wish to search in?",mask:!0,hideLabel:!0,value:this.activeIndex?.index,onNanoChange:this.handleSearchIndexChangeEvent},this.searchIndices.map((n=>i("nano-option",{selected:n.name===this.searchIndex,value:n.index},n.name||n.index)))),i("nano-input",{key:"83bdee0aca807f594505c657a4b1aeaabdb8a3d0",ref:n=>this.searchInput=n,part:"search-input",label:"Search Oxford Nanopore Technologies",placeholder:"Search Oxford Nanopore...",hideLabel:!0,clearable:!0,onNanoChange:n=>{this.handleSearchTermChangeEvent(n.detail.value)},onNanoInput:this.handleSearchTermInputEvent,debounce:500,value:this._searchValue},i("nano-icon",{key:"2f7a3e620d015b8d56044d048ed49ee6a6e29ba4",slot:"end",name:"light/magnifying-glass"}),i("nano-datalist",{key:"528da1d7293b7589ce34a00007e83cf00ac71547",class:"gn__search-results",onNanoSelect:n=>n.preventDefault(),dropDownConfig:{tetherTo:this.searchForm},disableFilter:!0},this.searchLoading&&i("div",{key:"f1556946842927cd1aa65a97346bc3ce1886311e",slot:"no-result",class:"gn__search-loading"},i("nano-spinner",{key:"b7d9e741bdbcde586cb1734961b628de31aca103"},"Searching...")),this.noResultPartial(),!!this.autocompleteResults?.hits.length&&[this.autocompleteResults.hits.map(((n,e)=>i("nano-option",{href:n.url,class:"gn__search-result",onClick:()=>{c.sendClick({index:this.activeIndex.index,eventName:"Global nav quick search - search result clicked",queryID:this.autocompleteResults.queryID,objectIDs:[n.objectID],positions:[e+1]})}},i("span",{innerHTML:this.autocompleteSnippet(n)})))),i("nano-option",{key:"88e617068d30bfa4ca09f6b122109d9a3539088b",class:"gn__search-viewall",onNanoSelect:this.onSearchSubmit},"View all results")])))),i("div",{key:"acceaf54481ab87951bbd9384f079c9d37fa0663",class:"gn__cart"},i("nano-icon-button",{key:"6bed2b6a26492c9e7e4fe205b9ef94845360327d",iconName:"light/cart-shopping",label:"View your cart",href:this.cartUrl}),!!this.cartCount&&i("nano-badge",{key:"4034d7828876c1237b1869abeb977e258d55006b",theme:"danger",strength:"2"},this.cartCount>9?"9+":this.cartCount)),this.breakpoint<=n.contact.breakpoint?n.contact.tpl():"",this.isLoggedIn?i("nano-dropdown",{dialogTitle:"User menu",class:"gn__user-dropdown",distance:10,placement:"bottom-end"},i("button",{slot:"trigger",class:"gn__user-dropdown-trigger"},i("nano-icon",{name:"light/user"}),i("nano-icon",{name:"light/chevron-down",class:"gn__user-dropdown-chevron"}),!!this.msgCount&&i("nano-badge",{theme:"danger",strength:"2"},this.msgCount>9?"9+":this.msgCount)),this.loggedInPanel()):i("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},i("a",{href:this.formatLoginLink(this.loginUrl)},"Login")))))),i("div",{key:"f52e45cccc15b745f54978bc140816847dc66560",class:"gn__site",part:"site-wrapper"},i("nano-global-search-results",{key:"0dd16b2bb789a66f3ef5b214ea54609aedad3ae4",part:"site-search-results"},i("slot",{key:"3a86b5ee10f5da29d3da8d06b2b6ad36f27e725c"})))))}static get assetsDirs(){return["assets"]}static get watchers(){return{myAccountUrl:["handleMyAccountUrl"],myAccountData:["processUserData","initSearch"],shouldResize:["breakpointChanged"],breakpoint:["breakpointChanged"],searchIndices:["handleSearchIndex"],searchIndex:["handleSearchIndex"]}}};h.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--main-menu-bar-bg-color:var(--nano-color-base-0);--main-menu-text-color:var(--nano-color-base-1000);--main-menu-hover-text-color:var(--nano-color-primary-1000);--main-menu-active-text-color:var(--nano-color-primary-1200);--main-menu-active-border-color:var(--nano-color-primary-1000);--overflow-bg-color:var(--nano-color-grey-mono-1600);--overflow-text-color:var(--nano-color-basic-white);--overflow-hover-text-color:var(--nano-color-blue-cerulean-700);--overflow-active-text-color:var(--nano-color-blue-cerulean-300);display:block;color:var(--main-menu-text-color)}img{max-inline-size:none;display:block}::slotted(a),:host::slotted(a),a{text-decoration:none}a:has(img){display:inline-block}a:focus{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}nano-drawer:not(:defined){display:none}nano-badge{position:absolute;font-size:0.5625rem;pointer-events:none}.gn__cart{position:relative}.gn__cart nano-badge{inset-block-start:-0.35rem;inset-inline-end:-0.4rem}.gn__login-cta{--bg:transparent}.gn__menu-bar-wrapper{z-index:var(--nano-z-index-menubar);position:relative}.gn__menu-bar-wrapper::after{content:"";position:absolute;block-size:1px;inline-size:100%;inset-inline:0;inset-block-end:-1px;z-index:-3;background-color:var(--nano-color-neutral-200)}.gn__menu-bar{inline-size:100%;overflow:clip}.gn__menu-bar a{color:var(--main-menu-text-color)}.gn__menu-bar a:hover{color:var(--main-menu-hover-text-color)}.gn__menu-bar a:active{color:var(--main-menu-active-text-color)}.gn__main-menu{display:inline-flex;align-items:center;background-color:var(--main-menu-bar-bg-color);min-inline-size:100%;padding:var(--nano-spacing-md);transition:opacity var(--nano-transition-x-fast) ease;opacity:1}.gn__main-menu.resizing{transition:none;opacity:0}.gn__main-menu>*{margin-inline-end:var(--nano-spacing-xl)}.gn__main-menu>*:is(slot,slot-fb){display:flex}.gn__main-menu>*:last-child{margin-inline-end:0}.gn__overflow-button{--padding:0.5rem 0.875rem 0.5rem 0;margin-inline-end:0.875rem;font-size:1.125rem;position:relative}.gn__overflow-button::after{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-end:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__main-menu-links,.gn__main-menu-actions{display:inline-flex;align-items:center}.gn__main-menu-links .nano-icon,.gn__main-menu-links .nano-icon-button,.gn__main-menu-actions .nano-icon,.gn__main-menu-actions .nano-icon-button{--active-color:var(--main-menu-active-text-color);--hover-color:var(--main-menu-hover-text-color);font-size:1rem}.gn__main-menu-links .nano-icon-button:hover,.gn__main-menu-actions .nano-icon-button:hover{color:var(--main-menu-hover-text-color)}.gn__main-menu-links{gap:var(--nano-spacing-xl)}.gn__main-menu-links ::slotted(a),.gn__main-menu-links::slotted(a){color:var(--main-menu-text-color)}.gn__main-menu-links ::slotted(a:hover){color:var(--main-menu-hover-text-color)}.gn__main-menu-links ::slotted(*:active){color:var(--main-menu-active-text-color)}.gn__main-menu-actions{margin-inline-start:auto;font-size:0.9375rem;gap:var(--nano-spacing-md)}.gn__search-dropdown{--overflow:visible;--padding:0;--background:transparent}.gn__search-dropdown .nano-icon-button{position:relative}.gn__search-dropdown .nano-icon-button::before{content:"";position:absolute;background-color:var(--main-menu-active-border-color);block-size:4px;inset-inline:5px 2px;inset-block-end:-1.5625rem;transform:translateZ(0) scaleX(0);transform-origin:0 center;transition:transform var(--nano-transition-x-fast) ease-in-out}.gn__search-open .gn__search-dropdown .nano-icon-button::before{transform:translateZ(0) scaleX(1)}.gn__search-form{display:inline-flex;max-inline-size:100vw;inline-size:30.625rem}.gn__search-form .nano-select{--input-bg-color:var(--nano-color-neutral-200);flex:0}.gn__search-form .nano-select:focus-within{z-index:1}.gn__search-form .nano-select .form-ctrl__input{border-inline-end:none}.gn__search-form .nano-input{flex:1}.gn__search-results{--padding-start:var(--nano-spacing-md);--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);font-size:var(--nano-font-size-2xs)}.gn__search-loading{display:flex;justify-content:center}.gn__search-result{--padding-start:0.3125rem;--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-neutral-1400);font-size:var(--nano-font-size-2xs)}.gn__search-result .search__highlight{font-style:normal;background:var(--nano-color-highlight)}.gn__search-viewall{--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-primary-1200)}.gn__search-viewall::part(label){justify-content:flex-end;text-decoration:underline}.gn__user-dropdown-trigger{all:unset;cursor:pointer;color:var(--nano-color-primary-1200);display:flex;white-space:nowrap;gap:var(--nano-spacing-xs);align-items:center;position:relative;padding-inline-start:var(--nano-spacing-md)}.gn__user-dropdown-trigger:hover{color:var(--main-menu-hover-text-color)}.gn__user-dropdown-trigger:active{color:var(--main-menu-active-text-color)}.gn__user-dropdown-trigger:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.gn__user-dropdown-trigger::before{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-start:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__user-dropdown-trigger .gn__user-dropdown-chevron{transition:rotate var(--nano-transition-x-fast) linear}[open] .gn__user-dropdown-trigger .gn__user-dropdown-chevron{rotate:180deg}.gn__user-dropdown-trigger nano-badge{inset-block-start:-0.7rem;inset-inline-end:-0.7rem}.gn__user-dropdown{--background:var(--overflow-bg-color);--padding:0;--overflow:visible}.gn__user-panel{inline-size:21.25rem;max-inline-size:21.25rem;color:var(--overflow-text-color);padding:var(--nano-spacing-md)}.gn__user-panel a{color:var(--overflow-text-color)}.gn__user-panel a:hover{text-decoration:underline;color:var(--overflow-hover-text-color)}.gn__user-panel-head{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding-block-end:var(--nano-spacing-md);display:flex;align-items:center;gap:var(--nano-spacing-sm);font-size:var(--nano-font-size-xs)}.gn__user-panel-head .gn__user-avatar nano-icon{font-size:2.5rem}.gn__user-panel-body{display:flex;flex-direction:column}.gn__user-panel-body a{position:relative;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);padding-block:var(--nano-spacing-md)}.gn__user-panel-body a:first-child{border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__user-panel-foot{padding-block-start:var(--nano-spacing-md);display:flex;align-items:center;justify-content:space-between;gap:var(--nano-spacing-md)}.gn__drawer{--panel-background:var(--overflow-bg-color);--header-button-color:var(--overflow-text-color);--body-spacing:0;--header-spacing:var(--nano-spacing-md) 0;--footer-spacing:var(--nano-spacing-md)}.gn__drawer::part(title){display:flex;justify-content:flex-end}.gn__drawer::part(header-actions){order:-1}.gn__drawer-header{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.gn__drawer-menu{display:flex;flex-direction:column;margin:0 var(--nano-spacing-md);padding-block-end:var(--nano-spacing-md);color:var(--overflow-text-color);border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);position:relative}.gn__drawer-menu ::slotted(a),.gn__drawer-menu::slotted(a){padding:var(--nano-spacing-md) 0}.gn__drawer-menu ::slotted(a),.gn__drawer-menu ::slotted(.nano-nav-item),.gn__drawer-menu::slotted(a),.gn__drawer-menu::slotted(.nano-nav-item){--padding:var(--nano-spacing-md) 0;display:block;color:inherit !important;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__drawer-menu ::slotted(a:hover),.gn__drawer-menu ::slotted(.nano-nav-item:hover){text-decoration:underline;color:var(--overflow-hover-text-color) !important}';export{h as nano_global_nav}

package/dist/nano-components/nano-grid-item.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as e,h as r}from"./index-CFYZ-ZOT.js";const s=class{constructor(r){e(this,r)}render(){return r("slot",{key:"8df6ce243d4a12c9cfe966f33d70b181eeb84b43"})}};s.style=":host { display: inline-block; }";export{s as nano_grid_item}
+import{r as e,h as r}from"./index-DXvE-U_j.js";const s=class{constructor(r){e(this,r)}render(){return r("slot",{key:"8df6ce243d4a12c9cfe966f33d70b181eeb84b43"})}};s.style=":host { display: inline-block; }";export{s as nano_grid_item}

package/dist/nano-components/nano-grid_2.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{h as t,d as i,a as e,r as n,c as r}from"./index-CFYZ-ZOT.js";import{h as o}from"./renderer-LJzCFyMt.js";const s=(()=>{try{return!!new CSSStyleSheet}catch(t){return!1}})(),a=new WeakMap;function c(i,e,n){(function(t){for(const i in t)if(i in t&&Array.isArray(t[i]))return t[i]}(i)||[]).push(t("style",{type:"text/css","constructible-style":e},n))}function l(t,i,e,n){i.__constructableStyle||(i.__constructableStyle={});const r=t[n.cacheKeyProperty];return i.__constructableStyle[r]||(i.__constructableStyle[r]=new CSSStyleSheet,i.__constructableStyle[r].replace(e)),i.__constructableStyle[r]}const h=class{constructor(t){n(this,t)}grids=[];cacheKey;sSize=300;mSize=550;lSize=800;xlSize=1e3;sCols;mCols;lCols;xlCols;xxlCols;sTpl;mTpl;lTpl;xlTpl;xxlTpl;showHelper=!1;constructSizeArray(){this.grids=[],this.sCols&&this.grids.push({cols:this.sCols,breakpoint:0,name:"s",template:this.sTpl}),this.mCols&&this.grids.push({cols:this.mCols,breakpoint:this.sSize,name:"m",template:this.mTpl}),this.lCols&&this.grids.push({cols:this.lCols,breakpoint:this.mSize,name:"l",template:this.lTpl}),this.xlCols&&this.grids.push({cols:this.xlCols,breakpoint:this.lSize,name:"xl",template:this.xlTpl}),this.xxlCols&&this.grids.push({cols:this.xxlCols,breakpoint:this.xlSize,name:"xxl",template:this.xxlTpl}),this.cacheKey=this.grids.map((t=>`${t.cols}-${t.breakpoint}-${t.template||""}`)).join("")+"-helper-"+this.showHelper}styles=()=>`\n      ${this.grids.map((t=>`\n          @container (min-width: ${Number(t.breakpoint+1)?Number(t.breakpoint)+1+"px":t.breakpoint}) {\n            [cache-key="${this.cacheKey}"].grid {\n              --current-grid-size: "grid size: ${t.name}";\n              ${t.template?`grid-template: ${t.template};`:`grid-template-columns: repeat(${t.cols}, minmax(calc((100% / ${t.cols}) - var(--grid-col-gap)), 1fr));`}\n            }\n            ${[...Array(t.cols)].map(((i,e)=>{const n=e+1;return`\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-start-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-start-${n}"]) {\n                    grid-column-start: ${n} !important;\n                  }\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-span-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-span-${n}"]) {\n                    grid-column-end: span ${n} !important;\n                  }\n              `})).join("")}\n              ${[...Array(24)].map(((i,e)=>{const n=e+1;return`\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-start-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-start-${n}"]) {\n                      grid-row-start: ${n} !important;\n                    }\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-span-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-span-${n}"]) {\n                      grid-row-end: span ${n} !important;\n                    }\n                `})).join("")}\n            ${this.showHelper?`\n                [cache-key="${this.cacheKey}"].grid--helper :nth-child(-n+${t.cols}) {\n                  display: block !important;\n                }\n              `:""}\n          }\n        `)).join("")}\n    `.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\s{2,}/g," ").replace(/\s*([{}:;,])\s*/g,"$1").replace(/\n/g,"");componentWillLoad(){this.constructSizeArray()}render(){return o(i,{key:"410e2e3fce3867216adb0f9bf0501f8d40514bce",class:"nano-grid"},o("div",{key:"424f6da1b39d37ef70912e87e5d61320b5ff8d11",part:"grid",class:"grid","cache-key":this.cacheKey},o("slot",{key:"051bdae40a3d63dfdb744a980c74a42c2ac9c05f"})),this.showHelper&&o("div",{key:"b24395cdacf9d7ba3a15b1a9b064a2a97f3afac1",class:"grid grid--helper",part:"helper","cache-key":this.cacheKey},[...Array(24)].map((()=>o("div",{class:"grid__helper-item"})))))}static get watchers(){return{sTpl:["constructSizeArray"],mTpl:["constructSizeArray"],lTpl:["constructSizeArray"],xlTpl:["constructSizeArray"],xxlTpl:["constructSizeArray"],sSize:["constructSizeArray"],mSize:["constructSizeArray"],lSize:["constructSizeArray"],xlSize:["constructSizeArray"],sCols:["constructSizeArray"],mCols:["constructSizeArray"],lCols:["constructSizeArray"],xlCols:["constructSizeArray"],xxlCols:["constructSizeArray"],showHelper:["constructSizeArray"]}}};(function(t,i,e,n){var r,o=arguments.length,s=o<3?i:null===n?n=Object.getOwnPropertyDescriptor(i,e):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,i,e,n);else for(var a=t.length-1;a>=0;a--)(r=t[a])&&(s=(o<3?r(s):o>3?r(i,e,s):r(i,e))||s);o>3&&s&&Object.defineProperty(i,e,s)})([function(n={}){return(r,o)=>{n.cacheKeyProperty||(n.cacheKeyProperty=o);const{componentWillLoad:h,render:d,componentWillRender:p}=r;if(h||console.warn(`ConstructibleStyle requires you to have a \`componentWillLoad\` lifecycle method in \`${r.constructor.name}\`. Failure to add this function may cause ConstructibleStyle to fail due to StencilJS build optimizations.`),s){const t=t=>{if(!t[n.cacheKeyProperty]||a.get(t)&&a.get(t)===t[n.cacheKeyProperty])return;a.set(t,t[n.cacheKeyProperty]);const i=e(t),s="function"==typeof t[o]?t[o]():t[o],c=i.shadowRoot||document;c.adoptedStyleSheets=[...c.adoptedStyleSheets||[],l(t,r,s,n)]};r.componentWillLoad=function(){const i=h&&h.call(this);return t(this),i},r.componentWillRender=function(){const i=p&&p.call(this);return t(this),i}}else r.render=function(){const e="function"==typeof this[o]?this[o]():this[o];let n=d.call(this);if(function(t){for(const e in t)if(e in t&&t[e]===i)return!0;return!1}(n))c(n,r.constructor.name,e);else if(n=t(i,null,n),"attachShadow"in HTMLElement.prototype){if(!r.__constructableStyle){const t=document.createElement("style");t.setAttribute("type","text/css"),t.setAttribute("constructible-style",r.constructor.name),t.innerHTML=e,r.__constructableStyle=t,document.head.appendChild(t)}}else c(n,r.constructor.name,e);return n}}}({cacheKeyProperty:"cacheKey"}),function(t,i){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,i)}("design:type",Object)],h.prototype,"styles",void 0),h.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--grid-col-gap:var(--nano-spacing-medium, 16px);--grid-row-gap:var(--nano-spacing-medium, 16px);--current-grid-size:"grid size: s";container-type:inline-size;display:block}:host .grid{display:grid;gap:var(--grid-row-gap) var(--grid-col-gap);block-size:inherit;min-block-size:inherit}:host([show-helper]:not([show-helper=false])){position:relative}:host([show-helper]:not([show-helper=false])) .grid--helper{position:absolute;inset:0;pointer-events:none;display:grid !important;overflow:hidden}:host([show-helper]:not([show-helper=false])) .grid--helper::before{content:var(--current-grid-size);font-size:30px;position:absolute;inline-size:100%;inset-inline-start:0;text-align:center;inset-block-start:50%;transform:translateY(-50%);color:rgba(0, 0, 0, 0.2);text-transform:uppercase;z-index:99;pointer-events:none}:host([show-helper]:not([show-helper=false])) .grid__helper-item{background:hsla(204, 80%, 72%, 0.25);block-size:100vh}';const d=class{constructor(t){n(this,t),this.nanoImgWillLoad=r(this,"nanoImgWillLoad",7),this.nanoImgDidLoad=r(this,"nanoImgDidLoad",7),this.nanoImgError=r(this,"nanoImgError",7)}io;_srcSet={};get host(){return e(this)}loadSrc;loadError;hasLoaded=!1;imgStates=null;_src;_srcChanged(){this.hasLoaded=!1,this.addIO()}alt;src;srcChanged(){this._src=this.src}srcSet;srcSetChanged(){this.srcSet&&(delete this._srcSet,this._srcSet={},this.imgStates=this.srcSet.split(",").map((t=>{const[i,e]=t.split(" ").filter((t=>t.length));return this._srcSet[i]={src:e,active:!1},i})).join(", "))}lazy=!0;lazyChanged(){this.lazy||this.load()}background;autoHeight="content";nanoImgWillLoad;nanoImgDidLoad;nanoImgError;addIO(){this._src&&!this.hasLoaded&&(this.lazy?"undefined"!=typeof window&&"IntersectionObserver"in window?(this.removeIO(),this.io=new IntersectionObserver((t=>{t[0].isIntersecting&&(this.load(),this.removeIO())})),this.io.observe(this.host)):setTimeout((()=>this.load()),200):this.load())}load(){this.loadError=this.onError,this.loadSrc=this._src,this.nanoImgWillLoad.emit()}onLoad=()=>{this.nanoImgDidLoad.emit(),setTimeout((()=>this.hasLoaded=!0),50)};onError=()=>{this.nanoImgError.emit()};onResize=t=>{Object.entries(t.detail).forEach((([t,i])=>{this._srcSet[t].active=!!i}));const i=[];Object.keys(this._srcSet).sort().forEach((t=>{this._srcSet[t].active&&i.push(this._srcSet[t].src)})),this._src=i.length?i.slice(-1)[0]:this.src};removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.srcChanged(),this.srcSetChanged(),this.lazyChanged()}componentDidLoad(){this.addIO()}disconnectedCallback(){this.removeIO()}render(){const t=this.loadSrc?{"background-image":`url(${this.loadSrc})`}:{};return o(i,{key:"a9d5cb1d0be8540d7ea690fd13d92b1f5ec614af",class:"nano-img"},o("div",{key:"1f40afc64a5652f53b224403c59b4f108e5eb044",class:"img"},o("nano-skeleton",{key:"a8872721a38b11951ca6950d567193ba16e1d348",class:"img__loader"}),!!this.background&&o("div",{key:"d9c1fd739f4a4914a0cfe8c1eb8ef50832ecc35c",class:{loaded:this.hasLoaded,img__bg:!0,"no-height":"image"===this.autoHeight},style:t},o("slot",{key:"750330595e7dc0e2127d8646616107154215e97b"})),o("img",{key:"c04ad33e34573482e701f4239e17a9a28fd98dd0",class:{img__image:!0,loaded:this.hasLoaded,hide:this.background,"no-height":"content"===this.autoHeight},decoding:"async",src:this.loadSrc,loading:void 0,alt:this.alt,onLoad:this.onLoad,onError:this.loadError}),o("nano-resize-observe",{key:"4d40e294ec3a56be5756aede03e91aaf3d629bf3",class:"img__observer",onNanoResizeStateChange:this.onResize,states:this.imgStates})))}static get watchers(){return{_src:["_srcChanged"],src:["srcChanged"],srcSet:["srcSetChanged"],lazy:["lazyChanged"]}}};d.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding:0;display:inline-block;object-fit:cover;object-position:center;background-size:cover;background-position:center}:host *{border-radius:inherit}:host([background]:not([background=false])){display:block}.img{position:relative;object-fit:inherit;object-position:inherit;background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;flex:1 1 100%;display:flex;flex-direction:column;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__loader,.img__observer{position:absolute;inset:0;block-size:100%;inline-size:100%;z-index:-1}.img__image,.img__bg{border-radius:inherit;display:block;opacity:0;transition:0.5s ease opacity, 0.3s ease filter 0.4s;filter:blur(5px);flex:1}.img__image.loaded,.img__bg.loaded{opacity:1;filter:blur(0)}@media not all and (resolution >= 0.001dpcm){@supports (-webkit-appearance: none){.img__image.loaded,.img__bg.loaded{filter:blur(0)}}}.img__image{object-fit:inherit;object-position:inherit;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__image.hide{visibility:hidden}.img__image.hide.no-height{block-size:1px;position:absolute;z-index:-1}.img__bg{background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;overflow:auto;padding:var(--padding)}.img__bg.no-height{position:absolute;inset:0}";export{h as nano_grid,d as nano_img}
+import{h as t,d as i,a as e,r as n,c as r}from"./index-DXvE-U_j.js";import{h as s}from"./renderer-BUaAsDso.js";const o=(()=>{try{return!!new CSSStyleSheet}catch(t){return!1}})(),a=new WeakMap;function c(i,e,n){(function(t){for(const i in t)if(i in t&&Array.isArray(t[i]))return t[i]}(i)||[]).push(t("style",{type:"text/css","constructible-style":e},n))}function l(t,i,e,n){i.__constructableStyle||(i.__constructableStyle={});const r=t[n.cacheKeyProperty];return i.__constructableStyle[r]||(i.__constructableStyle[r]=new CSSStyleSheet,i.__constructableStyle[r].replace(e)),i.__constructableStyle[r]}const d=class{constructor(t){n(this,t)}grids=[];cacheKey;sSize=300;mSize=550;lSize=800;xlSize=1e3;sCols;mCols;lCols;xlCols;xxlCols;sTpl;mTpl;lTpl;xlTpl;xxlTpl;showHelper=!1;constructSizeArray(){this.grids=[],this.sCols&&this.grids.push({cols:this.sCols,breakpoint:0,name:"s",template:this.sTpl}),this.mCols&&this.grids.push({cols:this.mCols,breakpoint:this.sSize,name:"m",template:this.mTpl}),this.lCols&&this.grids.push({cols:this.lCols,breakpoint:this.mSize,name:"l",template:this.lTpl}),this.xlCols&&this.grids.push({cols:this.xlCols,breakpoint:this.lSize,name:"xl",template:this.xlTpl}),this.xxlCols&&this.grids.push({cols:this.xxlCols,breakpoint:this.xlSize,name:"xxl",template:this.xxlTpl}),this.cacheKey=this.grids.map((t=>`${t.cols}-${t.breakpoint}-${t.template||""}`)).join("")+"-helper-"+this.showHelper}styles=()=>`\n      ${this.grids.map((t=>`\n          @container (min-width: ${Number(t.breakpoint+1)?Number(t.breakpoint)+1+"px":t.breakpoint}) {\n            [cache-key="${this.cacheKey}"].grid {\n              --current-grid-size: "grid size: ${t.name}";\n              ${t.template?`grid-template: ${t.template};`:`grid-template-columns: repeat(${t.cols}, minmax(calc((100% / ${t.cols}) - var(--grid-col-gap)), 1fr));`}\n            }\n            ${[...Array(t.cols)].map(((i,e)=>{const n=e+1;return`\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-start-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-start-${n}"]) {\n                    grid-column-start: ${n} !important;\n                  }\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-span-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-span-${n}"]) {\n                    grid-column-end: span ${n} !important;\n                  }\n              `})).join("")}\n              ${[...Array(24)].map(((i,e)=>{const n=e+1;return`\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-start-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-start-${n}"]) {\n                      grid-row-start: ${n} !important;\n                    }\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-span-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-span-${n}"]) {\n                      grid-row-end: span ${n} !important;\n                    }\n                `})).join("")}\n            ${this.showHelper?`\n                [cache-key="${this.cacheKey}"].grid--helper :nth-child(-n+${t.cols}) {\n                  display: block !important;\n                }\n              `:""}\n          }\n        `)).join("")}\n    `.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\s{2,}/g," ").replace(/\s*([{}:;,])\s*/g,"$1").replace(/\n/g,"");componentWillLoad(){this.constructSizeArray()}render(){return s(i,{key:"410e2e3fce3867216adb0f9bf0501f8d40514bce",class:"nano-grid"},s("div",{key:"424f6da1b39d37ef70912e87e5d61320b5ff8d11",part:"grid",class:"grid","cache-key":this.cacheKey},s("slot",{key:"051bdae40a3d63dfdb744a980c74a42c2ac9c05f"})),this.showHelper&&s("div",{key:"b24395cdacf9d7ba3a15b1a9b064a2a97f3afac1",class:"grid grid--helper",part:"helper","cache-key":this.cacheKey},[...Array(24)].map((()=>s("div",{class:"grid__helper-item"})))))}static get watchers(){return{sTpl:["constructSizeArray"],mTpl:["constructSizeArray"],lTpl:["constructSizeArray"],xlTpl:["constructSizeArray"],xxlTpl:["constructSizeArray"],sSize:["constructSizeArray"],mSize:["constructSizeArray"],lSize:["constructSizeArray"],xlSize:["constructSizeArray"],sCols:["constructSizeArray"],mCols:["constructSizeArray"],lCols:["constructSizeArray"],xlCols:["constructSizeArray"],xxlCols:["constructSizeArray"],showHelper:["constructSizeArray"]}}};(function(t,i,e,n){var r,s=arguments.length,o=s<3?i:null===n?n=Object.getOwnPropertyDescriptor(i,e):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,i,e,n);else for(var a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s<3?r(o):s>3?r(i,e,o):r(i,e))||o);s>3&&o&&Object.defineProperty(i,e,o)})([function(n={}){return(r,s)=>{n.cacheKeyProperty||(n.cacheKeyProperty=s);const{componentWillLoad:d,render:h,componentWillRender:m}=r;if(d||console.warn(`ConstructibleStyle requires you to have a \`componentWillLoad\` lifecycle method in \`${r.constructor.name}\`. Failure to add this function may cause ConstructibleStyle to fail due to StencilJS build optimizations.`),o){const t=t=>{if(!t[n.cacheKeyProperty]||a.get(t)&&a.get(t)===t[n.cacheKeyProperty])return;a.set(t,t[n.cacheKeyProperty]);const i=e(t),o="function"==typeof t[s]?t[s]():t[s],c=i.shadowRoot||document;c.adoptedStyleSheets=[...c.adoptedStyleSheets||[],l(t,r,o,n)]};r.componentWillLoad=function(){const i=d&&d.call(this);return t(this),i},r.componentWillRender=function(){const i=m&&m.call(this);return t(this),i}}else r.render=function(){const e="function"==typeof this[s]?this[s]():this[s];let n=h.call(this);if(function(t){for(const e in t)if(e in t&&t[e]===i)return!0;return!1}(n))c(n,r.constructor.name,e);else if(n=t(i,null,n),"attachShadow"in HTMLElement.prototype){if(!r.__constructableStyle){const t=document.createElement("style");t.setAttribute("type","text/css"),t.setAttribute("constructible-style",r.constructor.name),t.innerHTML=e,r.__constructableStyle=t,document.head.appendChild(t)}}else c(n,r.constructor.name,e);return n}}}({cacheKeyProperty:"cacheKey"}),function(t,i){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,i)}("design:type",Object)],d.prototype,"styles",void 0),d.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--grid-col-gap:var(--nano-spacing-medium, 16px);--grid-row-gap:var(--nano-spacing-medium, 16px);--grid-align-items:start;--current-grid-size:"grid size: s";container-type:inline-size;display:block}:host .grid{display:grid;gap:var(--grid-row-gap) var(--grid-col-gap);block-size:inherit;min-block-size:inherit;align-items:var(--grid-align-items)}:host([show-helper]:not([show-helper=false])){position:relative}:host([show-helper]:not([show-helper=false])) .grid--helper{position:absolute;inset:0;pointer-events:none;display:grid !important;overflow:hidden}:host([show-helper]:not([show-helper=false])) .grid--helper::before{content:var(--current-grid-size);font-size:30px;position:absolute;inline-size:100%;inset-inline-start:0;text-align:center;inset-block-start:50%;transform:translateY(-50%);color:rgba(0, 0, 0, 0.2);text-transform:uppercase;z-index:99;pointer-events:none}:host([show-helper]:not([show-helper=false])) .grid__helper-item{background:hsla(204, 80%, 72%, 0.25);block-size:100vh}';const h=class{constructor(t){n(this,t),this.nanoImgWillLoad=r(this,"nanoImgWillLoad",7),this.nanoImgDidLoad=r(this,"nanoImgDidLoad",7),this.nanoImgError=r(this,"nanoImgError",7)}io;_srcSet={};get host(){return e(this)}loadSrc;loadError;hasLoaded=!1;imgStates=null;_src;_srcChanged(){this.hasLoaded=!1,this.addIO()}alt;src;srcChanged(){this._src=this.src}srcSet;srcSetChanged(){this.srcSet&&(delete this._srcSet,this._srcSet={},this.imgStates=this.srcSet.split(",").map((t=>{const[i,e]=t.split(" ").filter((t=>t.length));return this._srcSet[i]={src:e,active:!1},i})).join(", "))}lazy=!0;lazyChanged(){this.lazy||this.load()}background;autoHeight="content";nanoImgWillLoad;nanoImgDidLoad;nanoImgError;addIO(){this._src&&!this.hasLoaded&&(this.lazy?"undefined"!=typeof window&&"IntersectionObserver"in window?(this.removeIO(),this.io=new IntersectionObserver((t=>{t[0].isIntersecting&&(this.load(),this.removeIO())})),this.io.observe(this.host)):setTimeout((()=>this.load()),200):this.load())}load(){this.loadError=this.onError,this.loadSrc=this._src,this.nanoImgWillLoad.emit()}onLoad=()=>{this.nanoImgDidLoad.emit(),setTimeout((()=>this.hasLoaded=!0),50)};onError=()=>{this.nanoImgError.emit()};onResize=t=>{Object.entries(t.detail).forEach((([t,i])=>{this._srcSet[t].active=!!i}));const i=[];Object.keys(this._srcSet).sort().forEach((t=>{this._srcSet[t].active&&i.push(this._srcSet[t].src)})),this._src=i.length?i.slice(-1)[0]:this.src};removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.srcChanged(),this.srcSetChanged(),this.lazyChanged()}componentDidLoad(){this.addIO()}disconnectedCallback(){this.removeIO()}render(){const t=this.loadSrc?{"background-image":`url(${this.loadSrc})`}:{};return s(i,{key:"a9d5cb1d0be8540d7ea690fd13d92b1f5ec614af",class:"nano-img"},s("div",{key:"1f40afc64a5652f53b224403c59b4f108e5eb044",class:"img"},s("nano-skeleton",{key:"a8872721a38b11951ca6950d567193ba16e1d348",class:"img__loader"}),!!this.background&&s("div",{key:"d9c1fd739f4a4914a0cfe8c1eb8ef50832ecc35c",class:{loaded:this.hasLoaded,img__bg:!0,"no-height":"image"===this.autoHeight},style:t},s("slot",{key:"750330595e7dc0e2127d8646616107154215e97b"})),s("img",{key:"c04ad33e34573482e701f4239e17a9a28fd98dd0",class:{img__image:!0,loaded:this.hasLoaded,hide:this.background,"no-height":"content"===this.autoHeight},decoding:"async",src:this.loadSrc,loading:void 0,alt:this.alt,onLoad:this.onLoad,onError:this.loadError}),s("nano-resize-observe",{key:"4d40e294ec3a56be5756aede03e91aaf3d629bf3",class:"img__observer",onNanoResizeStateChange:this.onResize,states:this.imgStates})))}static get watchers(){return{_src:["_srcChanged"],src:["srcChanged"],srcSet:["srcSetChanged"],lazy:["lazyChanged"]}}};h.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding:0;display:inline-block;object-fit:cover;object-position:center;background-size:cover;background-position:center}:host *{border-radius:inherit}:host([background]:not([background=false])){display:block}.img{position:relative;object-fit:inherit;object-position:inherit;background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;flex:1 1 100%;display:flex;flex-direction:column;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__loader,.img__observer{position:absolute;inset:0;block-size:100%;inline-size:100%;z-index:-1}.img__image,.img__bg{border-radius:inherit;display:block;opacity:0;transition:0.5s ease opacity, 0.3s ease filter 0.4s;filter:blur(5px);flex:1}.img__image.loaded,.img__bg.loaded{opacity:1;filter:blur(0)}@media not all and (resolution >= 0.001dpcm){@supports (-webkit-appearance: none){.img__image.loaded,.img__bg.loaded{filter:blur(0)}}}.img__image{object-fit:inherit;object-position:inherit;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__image.hide{visibility:hidden}.img__image.hide.no-height{block-size:1px;position:absolute;z-index:-1}.img__bg{background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;overflow:auto;padding:var(--padding)}.img__bg.no-height{position:absolute;inset:0}";export{d as nano_grid,h as nano_img}

package/dist/nano-components/nano-hero.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,a as o,d as t}from"./index-CFYZ-ZOT.js";import{h as e}from"./renderer-LJzCFyMt.js";const i=class{constructor(o){n(this,o)}mo;get host(){return o(this)}hasIconBox;hasScrim;hasSecondaryContent;hasQuote;hasBg;hasBackBtn;hasCtas;breadCrumbs;breadCrumbChange(){this.breadCrumbs.filter((n=>"A"===n.tagName&&!n.nextElementSibling.classList.contains("slash"))).forEach((n=>{n.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItems;iconBoxItemChange(){this.iconBoxItems.forEach((n=>n.classList.remove("last"))),this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList&&this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}imgSrc;imgSrcSet=null;largeScreenBP=900;theme="dark";level="top";slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]'),this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]')),this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length,this.hasScrim=!!this.host.querySelector('[slot="scrim"]'),this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]')),this.hasSecondaryContent=!!(this.host.querySelector('[slot="icon-box"]')||this.host.querySelector('[slot="quote"]')||this.host.querySelector('[slot="icon-box-item"]')||this.host.querySelector('[slot="secondary-content"]')),this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc,this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]'),this.hasQuote=!!this.host.querySelector('[slot="quote"]')}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}HeroContent=()=>[!this.hasIconBox&&this.hasCtas?e("div",{class:"hero__ctas"},e("slot",{name:"secondary-ctas"})):"",e("div",{class:"hero__scrim"},e("slot",{name:"scrim"})),e("nano-grid",{class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},e("div",{"grid-states":"xl-col-span-2"},e("div",{class:"hero__breadcrumbs"},e("slot",{name:"breadcrumb"}))),e("div",{"grid-states":this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},e("div",{class:"hero__primary"},e("div",{class:"hero__primary-content"},e("slot",{name:"back-btn"}),e("div",null,e("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&e("div",{"grid-states":"xl-col-span-1 xl-col-start-2 xl-row-start-2"},e("div",{class:"hero__secondary"},e("slot",{name:"secondary-content"}),this.hasIconBox&&e("div",{class:"hero__icon-box"},e("slot",{name:"icon-box"}),e("slot",{name:"icon-box-item"})),this.hasQuote&&e("div",{class:"hero__quote-content"},e("span",{class:"hero__quote"},e("slot",{name:"quote"})),e("div",{class:"hero__quote-author"},e("slot",{name:"quote-author"}))))))];render(){return e(t,{key:"5d62edb541baa74626690e274ec68fa7a1cdb6b4",class:"nano-hero"},e("div",{key:"85b443fdc0154a0911cfa7d8338f713249726cfc",class:{hero:!0,"hero--light":"light"===this.theme,"hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":"rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir,"hero--scrim":this.hasScrim,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":"sub"===this.level}},e("div",{key:"7f4075117c01f9bcd658e7c315db30e6178b7d5c",class:"hero__bg-wrap"},!!this.imgSrc&&e("nano-img",{key:"938f93db20077f16fe0f3c475a7b75fff5fbd753",class:"hero__img",lazy:!1,background:!0,srcSet:this.imgSrcSet,src:this.imgSrc},e(this.HeroContent,{key:"ab363f8fa4899d633039a6533a79147e3db09a4c"})),!this.imgSrc&&[e("div",{key:"260071196444ac93ed8245015dbba9c93b2cf6b1",class:"hero__bg-slot"},e("slot",{key:"1e1b83f44caca5904ae709e3b9ca7bae0560ef38",name:"background"})),e(this.HeroContent,{key:"4588e32888b9e82221644b74a84364a6e6db9f7f"})])))}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};i.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  /**\n   * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n   * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n   * @prop --theme-color: Text color. Default depends on theme;\n   * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #90c6e7;\n   * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n   * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n   * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n   * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n   * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n  */\n  --nano-loader-base: #4a4a4a;\n  --nano-loader-tint: #7d7d7d;\n  --theme-color: #fff;\n  --theme-tint-color: #90c6e7;\n  --scrim-color: 0 0 0;\n  --scrim-direction: 90deg;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 0.7;\n  --padding: 0;\n  --quote-size: 1.3rem;\n  color: var(--theme-color);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([theme=light]) {\n  --nano-loader-base: #fff;\n  --nano-loader-tint: white;\n  --theme-color: #4a4a4a;\n  --scrim-color: 255 255 255;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 1;\n  --scrim-direction: 270deg;\n  color: var(--theme-color);\n}\n:host([theme=light]) .hero__primary-content {\n  --color: #4a4a4a;\n}\n\n.hero {\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero {\n    --quote-size: 3rem;\n  }\n}\n.hero--rtl {\n  --scrim-direction: 270deg;\n}\n.hero--secondary:not(.hero--iconbox) {\n  --scrim-direction: 0deg;\n}\n.hero__bg-wrap {\n  overflow: hidden;\n}\n.hero__bg-slot {\n  position: absolute;\n  inset: 0;\n}\n.hero__ctas {\n  display: flex;\n  justify-content: flex-end;\n  padding-block: 32px 0;\n  padding-inline: 32px;\n  margin-block-end: -64px;\n  position: relative;\n  z-index: 1;\n}\n@media (width <= 52em) {\n  .hero__ctas {\n    display: none;\n  }\n}\n@media (width <= 58em) {\n  .hero__ctas {\n    margin-block-end: -48px;\n  }\n}\n.hero__ctas ::slotted(a.button[slot=secondary-ctas]) {\n  padding-inline: 0.5rem !important;\n  font-size: 0.875rem !important;\n  margin-block: 0 !important;\n  margin-inline: 0.25rem !important;\n}\n.hero__img {\n  display: block;\n  --padding: inherit;\n}\n.hero__breadcrumbs {\n  display: none;\n  margin-block: 20px 0;\n  margin-inline: 14px;\n  line-height: 14px;\n}\n.hero--breadcrumb .hero__breadcrumbs {\n  display: block;\n}\n@container (min-width: 800px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 50px;\n    max-inline-size: 50%;\n  }\n}\n@container (min-width: 900px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 83px;\n  }\n}\n.hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  font-size: 0.85rem;\n  text-transform: uppercase;\n  letter-spacing: 1.5px;\n  font-weight: 600;\n  font-stretch: 125%;\n  display: inline-block;\n  margin-block-end: 16px;\n  position: relative;\n  z-index: 2;\n}\n.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);\n}\n.hero__breadcrumbs ::slotted(a[slot=breadcrumb]) {\n  color: var(--theme-tint-color) !important;\n  cursor: pointer;\n}\n.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]) {\n  color: var(--theme-color);\n  position: relative;\n  margin-block: 0;\n  margin-inline: 0.5rem;\n  display: inline-block;\n}\n.hero__scrim {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n  background: linear-gradient(var(--scrim-direction), rgb(var(--scrim-color)/var(--scrim-opacity-from)) 0%, rgb(var(--scrim-color)/var(--scrim-opacity-to)) 100%);\n}\n.hero--scrim .hero__scrim {\n  background: none;\n}\n.hero__content {\n  max-inline-size: 1440px;\n  display: block;\n  --grid-row-gap: 0;\n  margin-block: 0;\n  margin-inline: auto;\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero__content {\n    margin-block: 50px 0 !important;\n    max-inline-size: 1540px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__content {\n    margin-block: 83px 0 !important;\n    max-inline-size: 1606px !important;\n  }\n}\n.hero__primary {\n  margin: 16px;\n}\n.hero--breadcrumb .hero__primary {\n  margin-block: 0;\n  margin-inline: 16px;\n}\n.hero--backbtn .hero__primary {\n  margin-inline-start: 0;\n}\n.hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n  font-size: 2rem;\n}\n@container (min-width: 800px) {\n  .hero__primary {\n    margin-block: 0 50px !important;\n    margin-inline: 50px 0 !important;\n  }\n  .hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n    margin-block: 0 !important;\n    margin-inline: -3rem 0 !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__primary {\n    margin-block: 0 83px !important;\n    margin-inline: 83px 0 !important;\n  }\n}\n.hero__primary-content {\n  max-inline-size: 45rem;\n  --color: #fff;\n  display: flex;\n}\n.hero--backbtn .hero__primary-content > div {\n  padding-block: 10px 0;\n  padding-inline: 0;\n}\n.hero__primary-content ::slotted(h1[slot=primary-content]) {\n  line-height: 26px !important;\n  margin-block: 0 18px !important;\n  font-size: 2rem !important;\n}\n@container (min-width: 800px) {\n  .hero__primary-content ::slotted(h1[slot=primary-content]) {\n    line-height: 31px !important;\n    margin-block-end: 30px !important;\n  }\n  .hero__primary-content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 20px !important;\n  }\n}\n.hero__secondary {\n  display: none;\n  block-size: 100%;\n  padding-block: 0 20px;\n  padding-inline: 14px;\n}\n.hero--secondary .hero__secondary {\n  display: flex;\n  align-items: center;\n}\n@container (min-width: 800px) {\n  .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 50px;\n    justify-content: flex-end;\n  }\n}\n@container (min-width: 900px) {\n  .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 83px;\n  }\n}\n.hero__icon-box {\n  background: rgba(0, 0, 0, 0.7);\n  padding: 24px;\n  inline-size: 100%;\n  margin-block-end: auto;\n  display: flex;\n  flex-direction: column;\n  color: white;\n}\n@container (min-width: 800px) {\n  .hero__icon-box {\n    max-inline-size: 410px;\n    flex: 0 1 410px;\n  }\n}\n.hero__icon-box ::slotted([slot=icon-box-item]) {\n  --nano-color-base: var(--theme-tint-color);\n  --nano-icon-size: 32px;\n  --nano-icon-margin-end: 20px;\n  display: flex;\n  align-items: center;\n  font-size: 0.8125rem;\n  margin-block-end: 20px;\n}\n.hero__icon-box ::slotted(.last[slot=icon-box-item]) {\n  margin-block-end: 0;\n}\n.hero__quote-content {\n  margin-block-start: auto;\n  text-align: center;\n  inline-size: 100%;\n}\n@container (min-width: 800px) {\n  .hero__quote-content {\n    max-inline-size: 500px;\n    flex: 0 1 500px;\n    text-align: initial;\n  }\n}\n.hero__quote::before, .hero__quote::after {\n  content: '\"';\n  font-size: var(--quote-size);\n  font-weight: 600;\n  font-style: italic;\n  line-height: 0;\n  color: #abb6b8;\n  display: inline;\n  position: relative;\n}\n.hero__quote ::slotted([slot=quote]) {\n  font-size: var(--quote-size);\n  font-weight: 200;\n  display: inline;\n}\n.hero__quote-author {\n  text-align: end;\n  font-size: 1rem;\n  opacity: 0.8;\n}\n@container (min-width: 800px) {\n  .hero--sub .hero__content {\n    margin-block-start: 40px;\n  }\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 50px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 40px 50px;\n  }\n  .hero--sub .hero__content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 8px !important;\n  }\n  .hero--sub .hero__content ::slotted(h1[slot=primary-content]) {\n    margin-block-end: 18px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 83px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 40px 83px;\n  }\n}";export{i as nano_hero}
+import{r as n,a as o,d as t}from"./index-DXvE-U_j.js";import{h as e}from"./renderer-BUaAsDso.js";const i=class{constructor(o){n(this,o)}mo;get host(){return o(this)}hasIconBox;hasScrim;hasSecondaryContent;hasQuote;hasBg;hasBackBtn;hasCtas;breadCrumbs;breadCrumbChange(){this.breadCrumbs.filter((n=>"A"===n.tagName&&!n.nextElementSibling.classList.contains("slash"))).forEach((n=>{n.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItems;iconBoxItemChange(){this.iconBoxItems.forEach((n=>n.classList.remove("last"))),this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList&&this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}imgSrc;imgSrcSet=null;largeScreenBP=900;theme="dark";level="top";slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]'),this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]')),this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length,this.hasScrim=!!this.host.querySelector('[slot="scrim"]'),this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]')),this.hasSecondaryContent=!!(this.host.querySelector('[slot="icon-box"]')||this.host.querySelector('[slot="quote"]')||this.host.querySelector('[slot="icon-box-item"]')||this.host.querySelector('[slot="secondary-content"]')),this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc,this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]'),this.hasQuote=!!this.host.querySelector('[slot="quote"]')}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}HeroContent=()=>[!this.hasIconBox&&this.hasCtas?e("div",{class:"hero__ctas"},e("slot",{name:"secondary-ctas"})):"",e("div",{class:"hero__scrim"},e("slot",{name:"scrim"})),e("nano-grid",{class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},e("div",{"grid-states":"xl-col-span-2"},e("div",{class:"hero__breadcrumbs"},e("slot",{name:"breadcrumb"}))),e("div",{"grid-states":this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},e("div",{class:"hero__primary"},e("div",{class:"hero__primary-content"},e("slot",{name:"back-btn"}),e("div",null,e("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&e("div",{"grid-states":"xl-col-span-1 xl-col-start-2 xl-row-start-2"},e("div",{class:"hero__secondary"},e("slot",{name:"secondary-content"}),this.hasIconBox&&e("div",{class:"hero__icon-box"},e("slot",{name:"icon-box"}),e("slot",{name:"icon-box-item"})),this.hasQuote&&e("div",{class:"hero__quote-content"},e("span",{class:"hero__quote"},e("slot",{name:"quote"})),e("div",{class:"hero__quote-author"},e("slot",{name:"quote-author"}))))))];render(){return e(t,{key:"5d62edb541baa74626690e274ec68fa7a1cdb6b4",class:"nano-hero"},e("div",{key:"85b443fdc0154a0911cfa7d8338f713249726cfc",class:{hero:!0,"hero--light":"light"===this.theme,"hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":"rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir,"hero--scrim":this.hasScrim,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":"sub"===this.level}},e("div",{key:"7f4075117c01f9bcd658e7c315db30e6178b7d5c",class:"hero__bg-wrap"},!!this.imgSrc&&e("nano-img",{key:"938f93db20077f16fe0f3c475a7b75fff5fbd753",class:"hero__img",lazy:!1,background:!0,srcSet:this.imgSrcSet,src:this.imgSrc},e(this.HeroContent,{key:"ab363f8fa4899d633039a6533a79147e3db09a4c"})),!this.imgSrc&&[e("div",{key:"260071196444ac93ed8245015dbba9c93b2cf6b1",class:"hero__bg-slot"},e("slot",{key:"1e1b83f44caca5904ae709e3b9ca7bae0560ef38",name:"background"})),e(this.HeroContent,{key:"4588e32888b9e82221644b74a84364a6e6db9f7f"})])))}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};i.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  /**\n   * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n   * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n   * @prop --theme-color: Text color. Default depends on theme;\n   * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #90c6e7;\n   * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n   * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n   * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n   * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n   * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n  */\n  --nano-loader-base: #4a4a4a;\n  --nano-loader-tint: #7d7d7d;\n  --theme-color: #fff;\n  --theme-tint-color: #90c6e7;\n  --scrim-color: 0 0 0;\n  --scrim-direction: 90deg;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 0.7;\n  --padding: 0;\n  --quote-size: 1.3rem;\n  color: var(--theme-color);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([theme=light]) {\n  --nano-loader-base: #fff;\n  --nano-loader-tint: white;\n  --theme-color: #4a4a4a;\n  --scrim-color: 255 255 255;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 1;\n  --scrim-direction: 270deg;\n  color: var(--theme-color);\n}\n:host([theme=light]) .hero__primary-content {\n  --color: #4a4a4a;\n}\n\n.hero {\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero {\n    --quote-size: 3rem;\n  }\n}\n.hero--rtl {\n  --scrim-direction: 270deg;\n}\n.hero--secondary:not(.hero--iconbox) {\n  --scrim-direction: 0deg;\n}\n.hero__bg-wrap {\n  overflow: hidden;\n}\n.hero__bg-slot {\n  position: absolute;\n  inset: 0;\n}\n.hero__ctas {\n  display: flex;\n  justify-content: flex-end;\n  padding-block: 32px 0;\n  padding-inline: 32px;\n  margin-block-end: -64px;\n  position: relative;\n  z-index: 1;\n}\n@media (width <= 52em) {\n  .hero__ctas {\n    display: none;\n  }\n}\n@media (width <= 58em) {\n  .hero__ctas {\n    margin-block-end: -48px;\n  }\n}\n.hero__ctas ::slotted(a.button[slot=secondary-ctas]) {\n  padding-inline: 0.5rem !important;\n  font-size: 0.875rem !important;\n  margin-block: 0 !important;\n  margin-inline: 0.25rem !important;\n}\n.hero__img {\n  display: block;\n  --padding: inherit;\n}\n.hero__breadcrumbs {\n  display: none;\n  margin-block: 20px 0;\n  margin-inline: 14px;\n  line-height: 14px;\n}\n.hero--breadcrumb .hero__breadcrumbs {\n  display: block;\n}\n@container (min-width: 800px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 50px;\n    max-inline-size: 50%;\n  }\n}\n@container (min-width: 900px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 83px;\n  }\n}\n.hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  font-size: 0.85rem;\n  text-transform: uppercase;\n  letter-spacing: 1.5px;\n  font-weight: 600;\n  font-stretch: 125%;\n  display: inline-block;\n  margin-block-end: 16px;\n  position: relative;\n  z-index: 2;\n}\n.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);\n}\n.hero__breadcrumbs ::slotted(a[slot=breadcrumb]) {\n  color: var(--theme-tint-color) !important;\n  cursor: pointer;\n}\n.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]) {\n  color: var(--theme-color);\n  position: relative;\n  margin-block: 0;\n  margin-inline: 0.5rem;\n  display: inline-block;\n}\n.hero__scrim {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n  background: linear-gradient(var(--scrim-direction), rgb(var(--scrim-color)/var(--scrim-opacity-from)) 0%, rgb(var(--scrim-color)/var(--scrim-opacity-to)) 100%);\n}\n.hero--scrim .hero__scrim {\n  background: none;\n}\n.hero__content {\n  max-inline-size: 1440px;\n  display: block;\n  --grid-row-gap: 0;\n  margin-block: 0;\n  margin-inline: auto;\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero__content {\n    margin-block: 50px 0 !important;\n    max-inline-size: 1540px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__content {\n    margin-block: 83px 0 !important;\n    max-inline-size: 1606px !important;\n  }\n}\n.hero__primary {\n  margin: 16px;\n}\n.hero--breadcrumb .hero__primary {\n  margin-block: 0;\n  margin-inline: 16px;\n}\n.hero--backbtn .hero__primary {\n  margin-inline-start: 0;\n}\n.hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n  font-size: 2rem;\n}\n@container (min-width: 800px) {\n  .hero__primary {\n    margin-block: 0 50px !important;\n    margin-inline: 50px 0 !important;\n  }\n  .hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n    margin-block: 0 !important;\n    margin-inline: -3rem 0 !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__primary {\n    margin-block: 0 83px !important;\n    margin-inline: 83px 0 !important;\n  }\n}\n.hero__primary-content {\n  max-inline-size: 45rem;\n  --color: #fff;\n  display: flex;\n}\n.hero--backbtn .hero__primary-content > div {\n  padding-block: 10px 0;\n  padding-inline: 0;\n}\n.hero__primary-content ::slotted(h1[slot=primary-content]) {\n  line-height: 26px !important;\n  margin-block: 0 18px !important;\n  font-size: 2rem !important;\n}\n@container (min-width: 800px) {\n  .hero__primary-content ::slotted(h1[slot=primary-content]) {\n    line-height: 31px !important;\n    margin-block-end: 30px !important;\n  }\n  .hero__primary-content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 20px !important;\n  }\n}\n.hero__secondary {\n  display: none;\n  block-size: 100%;\n  padding-block: 0 20px;\n  padding-inline: 14px;\n}\n.hero--secondary .hero__secondary {\n  display: flex;\n  align-items: center;\n}\n@container (min-width: 800px) {\n  .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 50px;\n    justify-content: flex-end;\n  }\n}\n@container (min-width: 900px) {\n  .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 83px;\n  }\n}\n.hero__icon-box {\n  background: rgba(0, 0, 0, 0.7);\n  padding: 24px;\n  inline-size: 100%;\n  margin-block-end: auto;\n  display: flex;\n  flex-direction: column;\n  color: white;\n}\n@container (min-width: 800px) {\n  .hero__icon-box {\n    max-inline-size: 410px;\n    flex: 0 1 410px;\n  }\n}\n.hero__icon-box ::slotted([slot=icon-box-item]) {\n  --nano-color-base: var(--theme-tint-color);\n  --nano-icon-size: 32px;\n  --nano-icon-margin-end: 20px;\n  display: flex;\n  align-items: center;\n  font-size: 0.8125rem;\n  margin-block-end: 20px;\n}\n.hero__icon-box ::slotted(.last[slot=icon-box-item]) {\n  margin-block-end: 0;\n}\n.hero__quote-content {\n  margin-block-start: auto;\n  text-align: center;\n  inline-size: 100%;\n}\n@container (min-width: 800px) {\n  .hero__quote-content {\n    max-inline-size: 500px;\n    flex: 0 1 500px;\n    text-align: initial;\n  }\n}\n.hero__quote::before, .hero__quote::after {\n  content: '\"';\n  font-size: var(--quote-size);\n  font-weight: 600;\n  font-style: italic;\n  line-height: 0;\n  color: #abb6b8;\n  display: inline;\n  position: relative;\n}\n.hero__quote ::slotted([slot=quote]) {\n  font-size: var(--quote-size);\n  font-weight: 200;\n  display: inline;\n}\n.hero__quote-author {\n  text-align: end;\n  font-size: 1rem;\n  opacity: 0.8;\n}\n@container (min-width: 800px) {\n  .hero--sub .hero__content {\n    margin-block-start: 40px;\n  }\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 50px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 40px 50px;\n  }\n  .hero--sub .hero__content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 8px !important;\n  }\n  .hero--sub .hero__content ::slotted(h1[slot=primary-content]) {\n    margin-block-end: 18px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 83px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 40px 83px;\n  }\n}";export{i as nano_hero}

package/dist/nano-components/nano-icon-item.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as o}from"./index-CFYZ-ZOT.js";const t=class{constructor(t){o(this,t)}layout="portrait";size="regular"};t.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{t as nano_icon_item}
+import{r as o}from"./index-DXvE-U_j.js";const t=class{constructor(t){o(this,t)}layout="portrait";size="regular"};t.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{t as nano_icon_item}

package/dist/nano-components/nano-icon_3.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{l as t,r as o,c as i,a as n,d as r}from"./index-CFYZ-ZOT.js";import{h as e}from"./renderer-LJzCFyMt.js";import{P as a}from"./popover-D1cBIHdr.js";let s;const l=(t,o)=>(t||!o||p(o)||(t=o),d(t)&&(t=h(t)),d(t)&&""!==t.trim()?""!==t.replace(/[a-z]|-|\/|\d/gi,"")?(console.warn("invalid characters in icon name "+t),null):t:null),c=t=>d(t)&&(t=t.trim(),p(t))?t:null,p=t=>t.length>0&&/(\/|\.)/.test(t),d=t=>"string"==typeof t,h=t=>t.toLowerCase(),m=t=>{if(1===t.nodeType){if("script"===t.nodeName.toLowerCase())return!1;for(let o=0;o<t.attributes.length;o++){const i=t.attributes[o].value;if(d(i)&&0===i.toLowerCase().indexOf("on"))return!1}for(let o=0;o<t.childNodes.length;o++)if(!m(t.childNodes[o]))return!1}return!0},b=new Map,u=new Map,f=class{constructor(t){o(this,t),this.nanoLoad=i(this,"nanoLoad",7),this.nanoError=i(this,"nanoError",7)}io;get el(){return n(this)}svgContent;isVisible=!1;isLoading=!0;color;role;setAriaLabel(){if(this.ariaLabel||this.el.ariaLabel)"presentation"===this.role&&(this.ariaLabel=void 0);else if(!this.role||"presentation"!==this.role){const t=l(this.name,this.icon);t&&(this.ariaLabel=t.split("/").slice(-1)[0].replace(/-/g," "))}}ariaLabel;updateRole(){this.ariaLabel?this.role="img":this.ariaLabel||(this.role="presentation")}flipRtl;name;src;icon;size="auto";lazy=!0;loadIcon(){if(this.isVisible){const o=(o=>{let i=c(o.src);return i||(i=l(o.name,o.icon),i?(n=i,(()=>{if(!s){const t=window;t.Nanoicons=t.Nanoicons||{},s=t.Nanoicons.map=t.Nanoicons.map||new Map}return s})().get(n)||(n.startsWith("device/")||n.startsWith("pictogram/")?t(`../nano-assets/icon/${n}.svg`):t(`../nano-assets/fontawesome-pro/svgs/${n}.svg`))):o.icon&&(i=c(o.icon),i)?i:null);var n})(this);o&&(b.has(o)?(this.svgContent=b.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()}))):(t=>{let o=u.get(t);return o||(o=fetch(t).then((o=>{if(o.ok)return o.text().then((o=>{b.set(t,(t=>{if(t){const o=document.createElement("div");o.innerHTML=t;for(let t=o.childNodes.length-1;t>=0;t--)"svg"!==o.childNodes[t].nodeName.toLowerCase()&&o.removeChild(o.childNodes[t]);const i=o.firstElementChild;if(i&&"svg"===i.nodeName.toLowerCase()){const t=i.getAttribute("class")||"";if(i.setAttribute("class",(t+" sc-nano-icon s-nano-icon svg").trim()),m(i))return o.innerHTML}}return""})(o))}));b.set(t,"")})),u.set(t,o)),o})(o).then((()=>{this.svgContent=b.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()})),this.setAriaLabel()}),(()=>{this.nanoError.emit()})))}}nanoLoad;nanoError;waitUntilVisible(t,o,i){if(this.lazy&&"undefined"!=typeof window&&window.IntersectionObserver){const n=this.io=new window.IntersectionObserver((t=>{(t[0].isIntersecting||t[1]&&t[1].isIntersecting)&&(n.disconnect(),this.io=void 0,i())}),{rootMargin:o});n.observe(t)}else i()}isRtl(){if("rtl"===this.el.ownerDocument?.dir)return!0;if(this.el.closest('[dir="rtl"]'))return!0;const t=this.el.getRootNode().host;return!(!t||!t.closest('[dir="rtl"]'))}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=!0,this.loadIcon()}))}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}componentWillLoad(){this.updateRole(),this.setAriaLabel()}render(){const t=this.flipRtl||this.name&&this.name.match(/right|left/)&&(this.name.indexOf("arrow")>-1||this.name.indexOf("chevron")>-1)&&this.isRtl();return e(r,{key:"754a53ed280fd9bcb1dcbec89eba4180f491d1b8",class:{loading:this.isLoading,"flip-rtl":!!t,"nano-icon":!0}},e("div",this.svgContent?{class:"icon-inner",innerHTML:this.svgContent}:{class:"icon-inner"}))}static get assetsDirs(){return["device","pictogram"]}static get watchers(){return{role:["setAriaLabel"],ariaLabel:["updateRole"],name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--icon-size:1em;--primary-color:currentcolor\n  --secondary-color: color-mix(in srgb, currentColor 50%, transparent);--primary-opacity:0.8;--secondary-opacity:1;display:inline-block;inline-size:var(--icon-size);block-size:var(--icon-size);min-inline-size:var(--icon-size);min-block-size:var(--icon-size);contain:strict;fill:currentcolor;box-sizing:content-box !important;transition:opacity 0.3s ease;color:currentcolor}:host .nanoicon{stroke:currentcolor}.nanoicon-fill-none{fill:none}.icon-inner,.nanoicon,svg,.svg{display:block;block-size:100%;inline-size:100%;overflow:visible}:host(.loading){opacity:0}.fa-primary{color:var(--primary-color);opacity:var(--primary-opacity, 1)}.fa-secondary{color:var(--secondary-color);opacity:var(--secondary-opacity) !important}:host(.flip-rtl) .icon-inner{transform:scaleX(-1)}:host([name^=pictogram]),:host([name^=device]){font-size:max(var(--nano-pictogram-size-medium), var(--icon-size))}:host([size=small][name^=pictogram]),:host([size=small][name^=device]){font-size:var(--nano-pictogram-size-small)}:host([size=regular]){font-size:var(--nano-icon-size-small)}:host([size=regular][name^=pictogram]),:host([size=regular][name^=device]){font-size:var(--nano-pictogram-size-medium)}:host([size=large]){font-size:var(--nano-icon-size-large)}:host([size=large][name^=pictogram]),:host([size=large][name^=device]){font-size:var(--nano-pictogram-size-large)}:host([size=xl][name^=pictogram]),:host([size=xl][name^=device]){font-size:var(--nano-pictogram-size-x-large)}:host([name^=pictogram]),:host([name^=device]),:host([color=primary]){color:var(--nano-color-primary-1100)}:host([color=neutral]){color:var(--nano-color-base-1000)}";const v=class{constructor(t){o(this,t)}button;get host(){return n(this)}iconName;iconSrc;type="button";name;value;label;showTooltip=!1;disabled=!1;href;rel;target;form;async setFocus(){this.button.focus()}findForm(){const{form:t,host:o}=this;if(!t)return o.closest("form");if(t instanceof HTMLFormElement)return t;if("string"==typeof t){const o=document.getElementById(t);if(o instanceof HTMLFormElement)return o}return null}handleClick=t=>{if("button"===this.type)return;const o=this.findForm();if(o){t.preventDefault();const i=document.createElement("button");i.type=this.type,i.style.display="none",o.appendChild(i),i.click(),i.remove()}};content(){return e(void 0===this.href?"button":"a",{onClick:this.handleClick,part:"base",ref:t=>this.button=t,class:{"icon-button":!0,"icon-button--disabled":this.disabled},name:this.name,value:this.value,href:this.href||void 0,target:this.href&&this.target?this.target:void 0,rel:this.rel||void 0,type:!this.href&&this.type?this.type:void 0},e("span",{class:"icon-button__label"},this.label),e("nano-icon",{name:this.iconName,src:this.iconSrc,"aria-hidden":"true",lazy:!1,part:"icon"}))}render(){return e(r,{class:"nano-icon-button","aria-disabled":this.disabled?"true":null},this.showTooltip?e("nano-tooltip",{content:this.label},this.content()):this.content())}};v.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:none;--active-color:var(--nano-color-neutral-800);--hover-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-xs);--box-shadow:none;--button-bg:transparent;color:currentcolor;border-radius:var(--border-radius);display:inline-block}.icon-button{flex:0 0 auto;display:flex;align-items:center;border:none;border-radius:inherit;background:var(--button-bg);font-size:inherit;color:inherit;padding:var(--padding);cursor:pointer;appearance:none;box-shadow:var(--box-shadow)}.icon-button:hover:not(.icon-button--disabled),.icon-button:focus:not(.icon-button--disabled){color:var(--hover-color)}.icon-button:active:not(.icon-button--disabled){color:var(--active-color)}.icon-button:focus-visible:not(.icon-button--disabled){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.icon-button__label{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}:host([disabled]:not([disabled=false])){opacity:0.5;cursor:not-allowed}.icon-button--disabled{pointer-events:none}";const g=class{constructor(t){o(this,t),this.nanoShow=i(this,"nanoShow",7),this.nanoAfterShow=i(this,"nanoAfterShow",7),this.nanoHide=i(this,"nanoHide",7),this.nanoAfterHide=i(this,"nanoAfterHide",7)}isVisible=!1;popover;tooltipPositioner;tooltip;_target;get target(){return this._target}set target(t){t!==this._target&&this._target&&this._target.removeAttribute("aria-label"),t.setAttribute("aria-label",this.label),this._target=t}label="";get host(){return n(this)}content="";setLabel(){const t=Array.from(this.host.querySelectorAll('[slot="content"]')).map((t=>t.textContent)).join(" ").trim();(this.target||(this.target=this.getTarget(),this.target))&&(this.label=t||this.content,this.target.setAttribute("aria-label",this.label))}placement="top";disabled=!1;distance=10;open=!1;skidding=0;hoist=!1;trigger="hover focus";handleOpenChange(){this.open?this.show():this.hide()}nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;async show(){this.isVisible||this.disabled||(this.nanoShow.emit().defaultPrevented?this.open=!1:(this.isVisible=!0,this.open=!0,"function"==typeof this.tooltipPositioner?.showPopover?(this.hoist=!0,this.popover.show(),this.tooltipPositioner.showPopover()):this.popover.show()))}async hide(){this.isVisible&&(this.nanoHide.emit().defaultPrevented?this.open=!0:(this.isVisible=!1,this.open=!1,this.popover.hide(),setTimeout((()=>{this.open||"function"!=typeof this.tooltipPositioner?.hidePopover||this.tooltipPositioner.hidePopover()}),300)))}getTarget(){let t=Array.from(this.host.children);t=t.flatMap((t=>{const o=getComputedStyle(t).display;return"none"===o?[]:"contents"===o&&t.children?.length?Array.from(t.children):t}));const o=t.find((t=>"style"!==t.tagName.toLowerCase()&&"content"!==t.getAttribute("slot")));if(!o)throw new Error("Invalid tooltip target: no child element was found.");return o}hasTrigger(t){return this.trigger.split(" ").includes(t)}syncOptions(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.tooltip,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit()})}handleBlur=()=>{this.hasTrigger("focus")&&this.hide()};handleClick=()=>{this.hasTrigger("click")&&(this.open?this.hide():this.show())};handleFocus=()=>{this.hasTrigger("focus")&&this.show()};handleKeyDown=t=>{this.open&&"Escape"===t.key&&(t.stopPropagation(),this.hide())};handleMouseOver=()=>{this.hasTrigger("hover")&&this.show()};handleMouseOut=()=>{this.hasTrigger("hover")&&this.hide()};handleSlotChange=()=>{this.target=this.getTarget()};componentDidLoad(){this.target=this.getTarget(),this.popover=new a(this.target,this.tooltipPositioner,{sameWidth:!1}),this.syncOptions(),this.setLabel(),this.tooltipPositioner.hidden=!this.open,this.open&&this.show()}componentDidUpdate(){this.syncOptions()}disconnectedCallback(){this.popover&&this.popover.destroy()}render(){return e(r,{key:"46e02e20dbf3922cfd6accd2a1b458a7acc7f7d7",onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onMouseOut:this.handleMouseOut,onBlur:this.handleBlur,onFocus:this.handleFocus,onClick:this.handleClick,class:"nano-tooltip"},e("slot",{key:"ab5a74099fab3ada3560426bea7ec8d2a646b9b3",onSlotchange:this.handleSlotChange}),e("div",{key:"b3dbae1010de35f3583d5c74488ffef20d5e23bd",ref:t=>this.tooltipPositioner=t,class:"tooltip-positioner",popover:"manual"},e("div",{key:"b2280419b506610603bbb3ce6db3e25c3a6fc12a",part:"base",ref:t=>this.tooltip=t,class:{tooltip:!0,"tooltip--open":this.open},role:"tooltip","aria-hidden":this.open?"false":"true"},e("slot",{key:"86b3f1f338cbc8b37223253fde3e9588c9e43601",name:"content",onSlotchange:()=>this.setLabel()},this.content),e("div",{key:"8566c4ea2d7ebbb476de6b127f7d0750ec38c450",class:"tooltip-arrow","data-popper-arrow":!0}))))}static get watchers(){return{content:["setLabel"],open:["handleOpenChange"]}}};g.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:0px;--max-width:20rem;--hide-delay:var(--nano-transition-x-fast);--hide-duration:var(--nano-transition-x-fast);--hide-timing-function:ease;--show-delay:var(--nano-transition-x-fast);--show-duration:var(--nano-transition-x-fast);--show-timing-function:ease;--background:var(--nano-color-neutral-1200);--color:var(--nano-color-base-0);--padding:var(--nano-spacing-sm);--arrow-size:5px;--arrow-offset:5px;display:contents}.tooltip-arrow{content:"";position:absolute;color:var(--background);transform:none !important;inset-inline-start:unset !important}.tooltip{max-inline-size:var(--max-width);border-radius:var(--border-radius);background-color:var(--background);font-size:var(--nano-font-size-2xs);line-height:1.5;color:var(--color);opacity:0;padding:var(--padding);transform:translateY(10px) translateZ(0);transform-origin:bottom;transition:opacity, transform var(--hide-duration) var(--hide-timing-function) var(--hide-delay);white-space:normal;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip ::slotted(*){color:inherit;font-size:inherit;line-height:inherit}.tooltip-positioner{position:absolute;z-index:var(--nano-z-index-tooltip);border:0;background:none;padding:0;overflow:visible;color:unset}.tooltip-positioner::backdrop{display:none}.tooltip-positioner[popover],.tooltip-positioner:popover-open{inset:unset}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom;transform:translateY(-10px) translateZ(0)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none}.tooltip-positioner[data-popper-placement^=bottom] .tooltip-arrow{inset-block-end:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-end:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=top] .tooltip-arrow{inset-block-start:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-start:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=top-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=left] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-start:100% !important;border-inline-start:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=left-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=right] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-end:100% !important;border-inline-end:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=right-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}';export{f as nano_icon,v as nano_icon_button,g as nano_tooltip}
+import{l as t,r as o,c as i,a as n,d as r}from"./index-DXvE-U_j.js";import{h as e}from"./renderer-BUaAsDso.js";import{P as a}from"./popover-D1cBIHdr.js";let s;const l=(t,o)=>(t||!o||p(o)||(t=o),d(t)&&(t=h(t)),d(t)&&""!==t.trim()?""!==t.replace(/[a-z]|-|\/|\d/gi,"")?(console.warn("invalid characters in icon name "+t),null):t:null),c=t=>d(t)&&(t=t.trim(),p(t))?t:null,p=t=>t.length>0&&/(\/|\.)/.test(t),d=t=>"string"==typeof t,h=t=>t.toLowerCase(),m=t=>{if(1===t.nodeType){if("script"===t.nodeName.toLowerCase())return!1;for(let o=0;o<t.attributes.length;o++){const i=t.attributes[o].value;if(d(i)&&0===i.toLowerCase().indexOf("on"))return!1}for(let o=0;o<t.childNodes.length;o++)if(!m(t.childNodes[o]))return!1}return!0},b=new Map,u=new Map,f=class{constructor(t){o(this,t),this.nanoLoad=i(this,"nanoLoad",7),this.nanoError=i(this,"nanoError",7)}io;get el(){return n(this)}svgContent;isVisible=!1;isLoading=!0;color;role;setAriaLabel(){if(this.ariaLabel||this.el.ariaLabel)"presentation"===this.role&&(this.ariaLabel=void 0);else if(!this.role||"presentation"!==this.role){const t=l(this.name,this.icon);t&&(this.ariaLabel=t.split("/").slice(-1)[0].replace(/-/g," "))}}ariaLabel;updateRole(){this.ariaLabel?this.role="img":this.ariaLabel||(this.role="presentation")}flipRtl;name;src;icon;size="auto";lazy=!0;loadIcon(){if(this.isVisible){const o=(o=>{let i=c(o.src);return i||(i=l(o.name,o.icon),i?(n=i,(()=>{if(!s){const t=window;t.Nanoicons=t.Nanoicons||{},s=t.Nanoicons.map=t.Nanoicons.map||new Map}return s})().get(n)||(n.startsWith("device/")||n.startsWith("pictogram/")?t(`../nano-assets/icon/${n}.svg`):t(`../nano-assets/fontawesome-pro/svgs/${n}.svg`))):o.icon&&(i=c(o.icon),i)?i:null);var n})(this);o&&(b.has(o)?(this.svgContent=b.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()}))):(t=>{let o=u.get(t);return o||(o=fetch(t).then((o=>{if(o.ok)return o.text().then((o=>{b.set(t,(t=>{if(t){const o=document.createElement("div");o.innerHTML=t;for(let t=o.childNodes.length-1;t>=0;t--)"svg"!==o.childNodes[t].nodeName.toLowerCase()&&o.removeChild(o.childNodes[t]);const i=o.firstElementChild;if(i&&"svg"===i.nodeName.toLowerCase()){const t=i.getAttribute("class")||"";if(i.setAttribute("class",(t+" sc-nano-icon s-nano-icon svg").trim()),m(i))return o.innerHTML}}return""})(o))}));b.set(t,"")})),u.set(t,o)),o})(o).then((()=>{this.svgContent=b.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()})),this.setAriaLabel()}),(()=>{this.nanoError.emit()})))}}nanoLoad;nanoError;waitUntilVisible(t,o,i){if(this.lazy&&"undefined"!=typeof window&&window.IntersectionObserver){const n=this.io=new window.IntersectionObserver((t=>{(t[0].isIntersecting||t[1]&&t[1].isIntersecting)&&(n.disconnect(),this.io=void 0,i())}),{rootMargin:o});n.observe(t)}else i()}isRtl(){if("rtl"===this.el.ownerDocument?.dir)return!0;if(this.el.closest('[dir="rtl"]'))return!0;const t=this.el.getRootNode().host;return!(!t||!t.closest('[dir="rtl"]'))}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=!0,this.loadIcon()}))}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}componentWillLoad(){this.updateRole(),this.setAriaLabel()}render(){const t=this.flipRtl||this.name&&this.name.match(/right|left/)&&(this.name.indexOf("arrow")>-1||this.name.indexOf("chevron")>-1)&&this.isRtl();return e(r,{key:"754a53ed280fd9bcb1dcbec89eba4180f491d1b8",class:{loading:this.isLoading,"flip-rtl":!!t,"nano-icon":!0}},e("div",this.svgContent?{class:"icon-inner",innerHTML:this.svgContent}:{class:"icon-inner"}))}static get assetsDirs(){return["device","pictogram"]}static get watchers(){return{role:["setAriaLabel"],ariaLabel:["updateRole"],name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--icon-size:1em;--primary-color:currentcolor\n  --secondary-color: color-mix(in srgb, currentColor 50%, transparent);--primary-opacity:0.8;--secondary-opacity:1;display:inline-block;inline-size:var(--icon-size);block-size:var(--icon-size);min-inline-size:var(--icon-size);min-block-size:var(--icon-size);contain:strict;fill:currentcolor;box-sizing:content-box !important;transition:opacity 0.3s ease;color:currentcolor}:host .nanoicon{stroke:currentcolor}.nanoicon-fill-none{fill:none}.icon-inner,.nanoicon,svg,.svg{display:block;block-size:100%;inline-size:100%;overflow:visible}:host(.loading){opacity:0}.fa-primary{color:var(--primary-color);opacity:var(--primary-opacity, 1)}.fa-secondary{color:var(--secondary-color);opacity:var(--secondary-opacity) !important}:host(.flip-rtl) .icon-inner{transform:scaleX(-1)}:host([name^=pictogram]),:host([name^=device]){font-size:max(var(--nano-pictogram-size-medium), var(--icon-size))}:host([size=small][name^=pictogram]),:host([size=small][name^=device]){font-size:var(--nano-pictogram-size-small)}:host([size=regular]){font-size:var(--nano-icon-size-small)}:host([size=regular][name^=pictogram]),:host([size=regular][name^=device]){font-size:var(--nano-pictogram-size-medium)}:host([size=large]){font-size:var(--nano-icon-size-large)}:host([size=large][name^=pictogram]),:host([size=large][name^=device]){font-size:var(--nano-pictogram-size-large)}:host([size=xl][name^=pictogram]),:host([size=xl][name^=device]){font-size:var(--nano-pictogram-size-x-large)}:host([name^=pictogram]),:host([name^=device]),:host([color=primary]){color:var(--nano-color-primary-1100)}:host([color=neutral]){color:var(--nano-color-base-1000)}";const v=class{constructor(t){o(this,t)}button;get host(){return n(this)}iconName;iconSrc;type="button";name;value;label;showTooltip=!1;disabled=!1;href;rel;target;form;async setFocus(){this.button.focus()}findForm(){const{form:t,host:o}=this;if(!t)return o.closest("form");if(t instanceof HTMLFormElement)return t;if("string"==typeof t){const o=document.getElementById(t);if(o instanceof HTMLFormElement)return o}return null}handleClick=t=>{if("button"===this.type)return;const o=this.findForm();if(o){t.preventDefault();const i=document.createElement("button");i.type=this.type,i.style.display="none",o.appendChild(i),i.click(),i.remove()}};content(){return e(void 0===this.href?"button":"a",{onClick:this.handleClick,part:"base",ref:t=>this.button=t,class:{"icon-button":!0,"icon-button--disabled":this.disabled},name:this.name,value:this.value,href:this.href||void 0,target:this.href&&this.target?this.target:void 0,rel:this.rel||void 0,type:!this.href&&this.type?this.type:void 0},e("span",{class:"icon-button__label"},this.label),e("nano-icon",{name:this.iconName,src:this.iconSrc,"aria-hidden":"true",lazy:!1,part:"icon"}))}render(){return e(r,{class:"nano-icon-button","aria-disabled":this.disabled?"true":null},this.showTooltip?e("nano-tooltip",{content:this.label},this.content()):this.content())}};v.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:none;--active-color:var(--nano-color-neutral-800);--hover-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-xs);--box-shadow:none;--button-bg:transparent;color:currentcolor;border-radius:var(--border-radius);display:inline-block}.icon-button{flex:0 0 auto;display:flex;align-items:center;border:none;border-radius:inherit;background:var(--button-bg);font-size:inherit;color:inherit;padding:var(--padding);cursor:pointer;appearance:none;box-shadow:var(--box-shadow)}.icon-button:hover:not(.icon-button--disabled),.icon-button:focus:not(.icon-button--disabled){color:var(--hover-color)}.icon-button:active:not(.icon-button--disabled){color:var(--active-color)}.icon-button:focus-visible:not(.icon-button--disabled){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.icon-button__label{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}:host([disabled]:not([disabled=false])){opacity:0.5;cursor:not-allowed}.icon-button--disabled{pointer-events:none}";const g=class{constructor(t){o(this,t),this.nanoShow=i(this,"nanoShow",7),this.nanoAfterShow=i(this,"nanoAfterShow",7),this.nanoHide=i(this,"nanoHide",7),this.nanoAfterHide=i(this,"nanoAfterHide",7)}isVisible=!1;popover;tooltipPositioner;tooltip;_target;get target(){return this._target}set target(t){t!==this._target&&this._target&&this._target.removeAttribute("aria-label"),t.setAttribute("aria-label",this.label),this._target=t}label="";get host(){return n(this)}content="";setLabel(){const t=Array.from(this.host.querySelectorAll('[slot="content"]')).map((t=>t.textContent)).join(" ").trim();(this.target||(this.target=this.getTarget(),this.target))&&(this.label=t||this.content,this.target.setAttribute("aria-label",this.label))}placement="top";disabled=!1;distance=10;open=!1;skidding=0;hoist=!1;trigger="hover focus";handleOpenChange(){this.open?this.show():this.hide()}nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;async show(){this.isVisible||this.disabled||(this.nanoShow.emit().defaultPrevented?this.open=!1:(this.isVisible=!0,this.open=!0,"function"==typeof this.tooltipPositioner?.showPopover?(this.hoist=!0,this.popover.show(),this.tooltipPositioner.showPopover()):this.popover.show()))}async hide(){this.isVisible&&(this.nanoHide.emit().defaultPrevented?this.open=!0:(this.isVisible=!1,this.open=!1,this.popover.hide(),setTimeout((()=>{this.open||"function"!=typeof this.tooltipPositioner?.hidePopover||this.tooltipPositioner.hidePopover()}),300)))}getTarget(){let t=Array.from(this.host.children);t=t.flatMap((t=>{const o=getComputedStyle(t).display;return"none"===o?[]:"contents"===o&&t.children?.length?Array.from(t.children):t}));const o=t.find((t=>"style"!==t.tagName.toLowerCase()&&"content"!==t.getAttribute("slot")));if(!o)throw new Error("Invalid tooltip target: no child element was found.");return o}hasTrigger(t){return this.trigger.split(" ").includes(t)}syncOptions(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.tooltip,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit()})}handleBlur=()=>{this.hasTrigger("focus")&&this.hide()};handleClick=()=>{this.hasTrigger("click")&&(this.open?this.hide():this.show())};handleFocus=()=>{this.hasTrigger("focus")&&this.show()};handleKeyDown=t=>{this.open&&"Escape"===t.key&&(t.stopPropagation(),this.hide())};handleMouseOver=()=>{this.hasTrigger("hover")&&this.show()};handleMouseOut=()=>{this.hasTrigger("hover")&&this.hide()};handleSlotChange=()=>{this.target=this.getTarget()};componentDidLoad(){this.target=this.getTarget(),this.popover=new a(this.target,this.tooltipPositioner,{sameWidth:!1}),this.syncOptions(),this.setLabel(),this.tooltipPositioner.hidden=!this.open,this.open&&this.show()}componentDidUpdate(){this.syncOptions()}disconnectedCallback(){this.popover&&this.popover.destroy()}render(){return e(r,{key:"46e02e20dbf3922cfd6accd2a1b458a7acc7f7d7",onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onMouseOut:this.handleMouseOut,onBlur:this.handleBlur,onFocus:this.handleFocus,onClick:this.handleClick,class:"nano-tooltip"},e("slot",{key:"ab5a74099fab3ada3560426bea7ec8d2a646b9b3",onSlotchange:this.handleSlotChange}),e("div",{key:"b3dbae1010de35f3583d5c74488ffef20d5e23bd",ref:t=>this.tooltipPositioner=t,class:"tooltip-positioner",popover:"manual"},e("div",{key:"b2280419b506610603bbb3ce6db3e25c3a6fc12a",part:"base",ref:t=>this.tooltip=t,class:{tooltip:!0,"tooltip--open":this.open},role:"tooltip","aria-hidden":this.open?"false":"true"},e("slot",{key:"86b3f1f338cbc8b37223253fde3e9588c9e43601",name:"content",onSlotchange:()=>this.setLabel()},this.content),e("div",{key:"8566c4ea2d7ebbb476de6b127f7d0750ec38c450",class:"tooltip-arrow","data-popper-arrow":!0}))))}static get watchers(){return{content:["setLabel"],open:["handleOpenChange"]}}};g.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:0px;--max-width:20rem;--hide-delay:var(--nano-transition-x-fast);--hide-duration:var(--nano-transition-x-fast);--hide-timing-function:ease;--show-delay:var(--nano-transition-x-fast);--show-duration:var(--nano-transition-x-fast);--show-timing-function:ease;--background:var(--nano-color-neutral-1200);--color:var(--nano-color-base-0);--padding:var(--nano-spacing-sm);--arrow-size:5px;--arrow-offset:5px;display:contents}.tooltip-arrow{content:"";position:absolute;color:var(--background);transform:none !important;inset-inline-start:unset !important}.tooltip{max-inline-size:var(--max-width);border-radius:var(--border-radius);background-color:var(--background);font-size:var(--nano-font-size-2xs);line-height:1.5;color:var(--color);opacity:0;padding:var(--padding);transform:translateY(10px) translateZ(0);transform-origin:bottom;transition:opacity, transform var(--hide-duration) var(--hide-timing-function) var(--hide-delay);white-space:normal;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip ::slotted(*){color:inherit;font-size:inherit;line-height:inherit}.tooltip-positioner{position:absolute;z-index:var(--nano-z-index-tooltip);border:0;background:none;padding:0;overflow:visible;color:unset}.tooltip-positioner::backdrop{display:none}.tooltip-positioner[popover],.tooltip-positioner:popover-open{inset:unset}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom;transform:translateY(-10px) translateZ(0)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none}.tooltip-positioner[data-popper-placement^=bottom] .tooltip-arrow{inset-block-end:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-end:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=top] .tooltip-arrow{inset-block-start:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-start:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=top-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=left] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-start:100% !important;border-inline-start:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=left-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=right] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-end:100% !important;border-inline-end:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=right-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}';export{f as nano_icon,v as nano_icon_button,g as nano_tooltip}