@nanoporetech-digital/components 8.2.0 → 8.3.1

package/dist/nano-components/nano-date-picker_2.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,c as t,g as e,a}from"./index-DgO0qeQ9.js";import{h as i,t as o}from"./renderer-T8etwwhk.js";import{i as s,g as r,b as l,D as c,p as d,d as h,s as p,e as u,f as b,h as f,j as _,k as m,l as v,a as g}from"./date-utils-BZYdjI1P.js";import{c as y}from"./dom-CrrHp_I_.js";import{a as k}from"./throttle-C93FMm2Z.js";import{F as x,a as w}from"./form-control-D4EZD4gc.js";const z={buttonLabel:"Choose date",placeholder:"YYYY-MM-DD",selectedDateMessage:"Selected date is",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",monthSelectLabel:"Month",yearSelectLabel:"Year",closeLabel:"Close window",keyboardInstruction:"You can use arrow keys to navigate dates",calendarHeading:"Choose a date",dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNamesShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},D=({focusedDay:n,today:t,day:e,onDaySelect:a,onKeyboardNavigation:o,focusedDayRef:r,inRange:l,disabled:c,isSelected:d})=>{const h=s(e,t),p=s(e,n),u=e.getMonth()!==n.getMonth()||c,b=!l;return i("button",{class:{"duet-date__day":!0,"is-outside":b,"is-disabled":u,"is-today":h},tabIndex:p?0:-1,onClick:function(n){a(n,e)},onKeyDown:o,disabled:b,type:"button","aria-pressed":d?"true":"false",ref:n=>{p&&n&&r&&r(n)}},i("span",{"aria-hidden":"true"},e.getDate()),i("span",{class:"duet-date__vhidden"},e.toLocaleDateString(void 0,{day:"numeric",month:"long"})))},C=({selectedDate:n,focusedDate:t,labelledById:e,localization:a,firstDayOfWeek:o,min:c,max:d,onDateSelect:h,onKeyboardNavigation:p,focusedDayRef:u,onMouseDown:b,onFocusIn:f,isDateDisabled:_})=>{const m=new Date,v=r(t,o);return i("table",{class:"duet-date__table",role:"grid","aria-labelledby":e,onFocusin:f,onMouseDown:b},i("thead",null,i("tr",null,(y=o,k=n=>i("th",{class:"duet-date__table-header",scope:"col"},i("span",{"aria-hidden":"true"},n.substring(0,2)),i("span",{class:"duet-date__vhidden"},n)),(g=a.dayNames).map(((n,t)=>k(g[(t+y)%g.length])))))),i("tbody",null,function(n){const t=[];for(let e=0;e<n.length;e+=7)t.push(n.slice(e,e+7));return t}(v).map((e=>i("tr",{class:"duet-date__row"},e.map((e=>i("td",{class:"duet-date__cell",role:"gridcell","aria-selected":s(e,n)?"true":void 0},i(D,{day:e,today:m,focusedDay:t,inRange:l(e,c,d),onDaySelect:h,onKeyboardNavigation:p,focusedDayRef:u,disabled:_(e),isSelected:s(e,n)})))))))));var g,y,k};let S=0;const I=class{constructor(e){n(this,e),this.nanoDatePicked=t(this,"nanoDatePicked",7)}dateId="nano-datepicker-"+S++;monthSelectId=this.dateId+"-month";yearSelectId=this.dateId+"-year";dialogLabelId=this.dateId+"-dialog";firstFocusableElement;monthSelectNode;focusedDayNode;focusTimeoutId;initialTouchX=null;initialTouchY=null;get host(){return e(this)}activeFocus=!1;focusedDay=new Date;_selectedDate="";get selectedDate(){return this._selectedDate}set selectedDate(n){"string"==typeof n?(n=n.split("T")[0],this._selectedDate=n):this._selectedDate=""}min="";max="";firstDayOfWeek=c.Monday;localization=z;isDateDisabled=()=>!1;isModal=!1;firstFocusEle;nanoDatePicked;async setFocus(n=!1){this.setFocusedDay(d(this.selectedDate)||new Date),n?setTimeout((()=>this.focusedDayNode.focus({preventScroll:!0})),20):(clearTimeout(this.focusTimeoutId),this.focusTimeoutId=setTimeout((()=>{this.monthSelectNode.focus({preventScroll:!0})}),20))}handleSelectedDateChange(){this.setFocus(!0)}enableActiveFocus=()=>{this.activeFocus=!0};disableActiveFocus=()=>{this.activeFocus=!1};addDays(n){this.setFocusedDay(h(this.focusedDay,n))}addMonths(n){this.setMonth(this.focusedDay.getMonth()+n)}addYears(n){this.setYear(this.focusedDay.getFullYear()+n)}startOfWeek(){this.setFocusedDay(p(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(u(this.focusedDay,this.firstDayOfWeek))}setMonth(n){const t=b(f(this.focusedDay),n),e=_(t),a=b(this.focusedDay,n);this.setFocusedDay(m(a,t,e))}setYear(n){const t=v(f(this.focusedDay),n),e=_(t),a=v(this.focusedDay,n);this.setFocusedDay(m(a,t,e))}setFocusedDay(n){this.focusedDay=m(n,d(this.min),d(this.max))}handleTouchStart=n=>{const t=n.changedTouches[0];this.initialTouchX=t.pageX,this.initialTouchY=t.pageY};handleTouchMove=n=>{n.preventDefault()};handleTouchEnd=n=>{const t=n.changedTouches[0],e=t.pageX-this.initialTouchX,a=t.pageY-this.initialTouchY;Math.abs(e)>=70&&Math.abs(a)<=70&&this.addMonths(e<0?1:-1),this.initialTouchY=null,this.initialTouchX=null};handleNextMonthClick=n=>{n.preventDefault(),this.addMonths(1)};handlePreviousMonthClick=n=>{n.preventDefault(),this.addMonths(-1)};handleKeyboardNavigation=n=>{if("Tab"===n.key&&!n.shiftKey&&this.isModal){n.preventDefault();const t=this.firstFocusEle||this.firstFocusableElement;return void(t.setFocus?t.setFocus():t.focus())}let t=!0;switch(n.key){case"ArrowRight":this.addDays(1);break;case"ArrowLeft":this.addDays(-1);break;case"ArrowDown":this.addDays(7);break;case"ArrowUp":this.addDays(-7);break;case"PageUp":n.shiftKey?this.addYears(-1):this.addMonths(-1);break;case"PageDown":n.shiftKey?this.addYears(1):this.addMonths(1);break;case"Home":this.startOfWeek();break;case"End":this.endOfWeek();break;default:t=!1}t&&(n.preventDefault(),this.enableActiveFocus())};handleDaySelect=(n,t)=>{const e=!this.isDateDisabled(t);l(t,d(this.min),d(this.max))&&e&&(t.getMonth()===this.focusedDay.getMonth()?this.setValue(t):this.setFocusedDay(t))};handleMonthSelect=n=>{this.setMonth(parseInt(n.target.value,10))};handleYearSelect=n=>{this.setYear(parseInt(n.target.value,10))};setValue(n){this.selectedDate=g(n),this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:n})}processFocusedDayNode=n=>{this.focusedDayNode=n,this.activeFocus&&setTimeout((()=>n.focus({preventScroll:!0})),0)};componentWillLoad(){this.handleSelectedDateChange()}render(){const n=d(this.selectedDate),t=(n||this.focusedDay).getFullYear(),e=this.focusedDay.getMonth(),o=this.focusedDay.getFullYear(),s=d(this.min),r=d(this.max),c=null!=s&&s.getMonth()===e&&s.getFullYear()===o,h=null!=r&&r.getMonth()===e&&r.getFullYear()===o;let p=t-10,u=t+10;return s&&(p=s.getFullYear()),r&&(u=r.getFullYear()),i(a,{key:"d3b992532815f40dbd9fcb7b0ddfaa27d703899b",class:"nano-date-picker"},i("div",{key:"c1be847528fac0224c54110aa77a7b471969c34d",class:"duet-date"},i("div",{key:"8aa8dceea4d272bf171924bfbf59a4f645bed23d",class:{"duet-date__dialog":!0,"is-active":!0},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},i("div",{key:"374d34c706b3972971ebfc05d32d4f2cfb8721de",class:"duet-date__dialog-content"},i("div",{key:"4713d41d66ae2bc7057ec337080cd54700b51033",class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),i("div",{key:"b602d630814a176a066dab67645178fd15a7ca22",class:"duet-date__header",onFocusin:this.disableActiveFocus},i("div",{key:"2cc00317d6468c2ea5c477249774eec83f5b94da"},i("h2",{key:"0f420e58b51e50d6d973330665c508ca8167f3c3",id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[e]," ",this.focusedDay.getFullYear()),i("label",{key:"56192f5d51880678b86137cca89cb4a98515e03e",htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),i("div",{key:"900c7995f2a3c51b5d22fee6176518940e7efc27",class:"duet-date__select"},i("select",{key:"22bef19a74a42e7864d6cff32707adc7c0cc52b6",id:this.monthSelectId,class:"duet-date__select--month",ref:n=>this.firstFocusableElement=this.monthSelectNode=n,onChange:this.handleMonthSelect},this.localization.monthNames.map(((n,t)=>i("option",{key:n,value:t,selected:t===e,disabled:!l(new Date(o,t,1),s?f(s):null,r?_(r):null)},n)))),i("div",{key:"ba1108c781547bbaba8da184f07fd7d36b12cb4c",class:"duet-date__select-label","aria-hidden":"true"},i("span",{key:"8cd8018d9b68129e69219b9bffcd978a394269a5"},this.localization.monthNamesShort[e]),i("nano-icon",{key:"e2b440b6adf599930d20e584c92c5f66d52564fd",name:"light/chevron-down"}))),i("label",{key:"043530523830f9c5a67682c47cfb6dc0464f3133",htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),i("div",{key:"e2e43ad2280255eb46cf06b9328af9bbefbe96a5",class:"duet-date__select"},i("select",{key:"eaaa7a64a034d1723c20b42cf14c8cea0f8c78b1",id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect},function(n,t){const e=[];for(let a=n;a<=t;a++)e.push(a);return e}(p,u).map((n=>i("option",{key:n,selected:n===o},n)))),i("div",{key:"c6ce7ec0f073caad0bd6ab09d03f1e20f5433e97",class:"duet-date__select-label","aria-hidden":"true"},i("span",{key:"3f985ad9b631cb140f4e551ab2f20cbdef88da6a"},this.focusedDay.getFullYear()),i("nano-icon",{key:"1b06f5e08b8b33bcc7d641abe122e3bb0fad05ba",name:"light/chevron-down"})))),i("div",{key:"4ea6d2f63406af47b4aba3b137c778aa9fed2524",class:"duet-date__nav"},i("button",{key:"6cd94d90c91aa0ccbd74a9ba361b7d894ef9fccf",class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},i("nano-icon",{key:"83d33e3779d7249634afbd8f1cd1c6476bad4697",name:"light/chevron-left"}),i("span",{key:"2318ef1d137f42a93240efc4caa15b376f079909",class:"duet-date__vhidden"},this.localization.prevMonthLabel)),i("button",{key:"f8c400b9e644687ce1279a70e6fc5c0b1aec6aac",class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},i("nano-icon",{key:"a4ef19900fdfee3cc340ab6bba83dcf782e9b21a",name:"light/chevron-right"}),i("span",{key:"da03dc579aeb3dc5a00b2c647f78b71186cc7d74",class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),i("div",{key:"ec82cee96b94f0b4a36993d42bae2eb02a392522"},i(C,{key:"e84697f87540abe1e8cfd47903655ac8b68ba08d",selectedDate:n,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:s,max:r,isDateDisabled:this.isDateDisabled}))))))}static get watchers(){return{selectedDate:["handleSelectedDateChange"]}}};I.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{--active-color:var(--nano-color-primary-1000);--active-text-color:var(--nano-color-base-0);--inactive-color:var(--nano-color-neutral-300);display:block;font-size:16px;background:var(--nano-color-neutral-50)}.duet-date *,.duet-date *::before,.duet-date *::after{box-sizing:border-box;margin:0}.duet-date{box-sizing:border-box;color:currentcolor;display:block;margin:0;position:relative;text-align:start;inline-size:100%}.duet-date__dialog{display:flex;inset-block-start:100%;max-inline-size:100%;inline-size:100%}.duet-date__dialog.is-left{inset-inline:auto 0;inline-size:auto}.duet-date__dialog-content{min-inline-size:290px;padding:var(--nano-spacing-md);position:relative;transform:none;max-inline-size:100%;inline-size:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1;text-align:center;inline-size:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1;padding-block-end:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center;padding:0 0 3px}.duet-date__day{appearance:none;background:transparent;border:0;border-radius:50%;cursor:pointer;display:inline-block;font-size:0.875em;font-variant-numeric:tabular-nums;line-height:1;position:relative;text-align:center;vertical-align:middle;z-index:1;block-size:2.5em;inline-size:2.5em}.duet-date__day.is-today{box-shadow:0 0 0 1px var(--active-color);position:relative}.duet-date__day:hover::before,.duet-date__day.is-today::before{content:"";background:var(--active-color);border-radius:50%;opacity:0.16;position:absolute;inset:0}[aria-selected=true] .duet-date__day{background:var(--active-color) !important;color:var(--active-text-color);box-shadow:none;outline:0}.duet-date__day:not(.is-disabled):active{background:color-mix(in srgb, var(--active-color), black 20%);color:var(--active-text-color)}.duet-date__day:focus-visible{outline:var(--nano-focus-ring);outline-offset:-1px;z-index:2}.duet-date__day.is-disabled{background:transparent;box-shadow:none;cursor:default;opacity:0.5}.duet-date__day.is-disabled::before{display:none}.duet-date__day.is-outside{background:var(--inactive-color);box-shadow:none;cursor:default;opacity:0.8;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{align-items:center;display:flex;justify-content:space-between;margin-block-end:var(--nano-spacing-md);inline-size:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{background:var(--inactive-color);align-items:center;appearance:none;border:0;border-radius:50%;cursor:pointer;display:inline-flex;justify-content:space-around;margin-inline-start:8px;padding:0;font-size:0.9em;block-size:2.2em;inline-size:2.2em}.duet-date__prev:focus-visible,.duet-date__next:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.duet-date__prev:active,.duet-date__next:active{background:color-mix(in srgb, var(--inactive-color), black 20%)}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.7}.duet-date__prev .nano-icon,.duet-date__next .nano-icon{margin-block:0;margin-inline:auto}.duet-date__select{display:inline-flex;margin-block-start:4px;position:relative}.duet-date__select span{margin-inline-end:4px}.duet-date__select select{cursor:pointer;font-size:1em;block-size:100%;inset-inline-start:0;opacity:0;position:absolute;inset-block-start:0;inline-size:100%;z-index:2}.duet-date__select select:focus-visible:focus+.duet-date__select-label{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.duet-date__select-label{align-items:center;display:flex;font-size:1.25em;font-weight:600;line-height:1;padding-block:0;padding-inline:8px 4px;pointer-events:none;position:relative;inline-size:100%;z-index:1}.duet-date__select-label .nano-icon{font-size:0.55em}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);block-size:1px;overflow:hidden;padding:0;position:absolute;inset-block-start:0;inline-size:1px}';let M=0;const L=class{nativeInput;inputId="nano-input-"+M++;didBlurAfterEdit=!1;rtl=!1;mo;charCount=0;hasRendered=!1;pickerDropdown;picker;pickerCloseBtn;shouldValidate=!1;_nativeInputWrap;get nativeInputWrap(){return this._nativeInputWrap}set nativeInputWrap(n){this._nativeInputWrap!==n&&(this._nativeInputWrap=n,this.setDataListOpts())}constructor(e){n(this,e),this.nanoInput=t(this,"nanoInput",7),this.nanoChange=t(this,"nanoChange",7),this.nanoBlur=t(this,"nanoBlur",7),this.nanoFocus=t(this,"nanoFocus",7),this.nanoDidLoad=t(this,"nanoDidLoad",7),this.nanoDidUnload=t(this,"nanoDidUnload",7),this.nanoValidate=t(this,"nanoValidate",7),this.handleBlur=this.handleBlur.bind(this)}hasFocus=!1;hasLabelSlot=!1;hasHelperSlot=!1;hasHelperEndSlot=!1;errorMessage="";datalist=null;setDataListOpts(){this.datalist&&(this.datalist.dropDownConfig={distance:10,...this.datalist.dropDownConfig||{},skidding:-1,tetherTo:this.nativeInputWrap})}get el(){return e(this)}get invalid(){return this._invalid}_invalid=null;get validityMessage(){return this.nativeInput?this.nativeInput.validationMessage:""}accept;autocapitalise="none";autocomplete="off";autocorrect="off";autofocus=!1;clearable=!1;clearOnEdit;debounce=0;debounceChanged(){this.nanoChange=k(this.nanoChange,this.debounce)}disabled=!1;inputmode;validateOn="submitThenDirty";showInlineError=!0;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(n){this._label=n}alwaysShowPlaceholder=!1;hideLabel=!1;floatLabel=!1;max;maxlength;min;minlength;multiple;name=this.inputId;pattern;placeholder;readonly=!1;required=!1;spellcheck=!1;step;size;type="text";form;value="";valueChanged(){this.nanoChange.emit({value:this.value}),this.charCount=this.value?.length||0,"textarea"===this.type&&"auto"===this.resize&&(this.nativeInput.style.height="auto",this.value?.length&&(this.nativeInput.style.height=this.nativeInput.scrollHeight+"px")),"date"===this.type&&(this.isDateDisabled(this.valueAsDate)?this.nativeInput.setCustomValidity("Date selected is not available."):"Date selected is not available."===this.nativeInput.validationMessage&&this.nativeInput.setCustomValidity("")),this.shouldValidate=!0}get valueAsNumber(){return"textarea"===this.type?NaN:this.nativeInput?.valueAsNumber||NaN}get valueAsDate(){return"textarea"===this.type?null:new Date(this.value)}showCharCount=!1;handleValidatePropChange(){this.hasRendered&&(this.shouldValidate=!0)}resize="auto";rows=2;showPicker=!0;isDateDisabled=()=>!1;initialPickerDate;closeAfterPicked=!0;pickerOptions={};nanoInput;nanoChange;nanoBlur;nanoFocus;nanoDidLoad;nanoDidUnload;nanoValidate;async reportValidity(n){return new Promise((t=>{n&&this.validate(),setTimeout((()=>{t({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage})}),50)}))}async setFocus(){this.nativeInput&&(this.nativeInput.focus(),this.nativeInput.click())}async select(){this.nativeInput&&this.nativeInput.select()}getInputElement(){return Promise.resolve(this.nativeInput)}async showError(n){this.nativeInput&&(this.nativeInput.setCustomValidity(n),this.validate())}onReset(n){(this.form?document.querySelector("#"+this.form):this.el.closest("form"))&&n.target===this.el.closest("form")&&(this.value="")}handleBlur(n){if(!this.hasFocus)return;const t=n;let e;requestAnimationFrame((()=>{if(n instanceof KeyboardEvent&&t.key){if("Tab"!==t.key)return;e=document.activeElement}else e=n instanceof FocusEvent?document.activeElement:n.target;y(this.el.tagName.toLowerCase(),e)!==this.el&&this.onBlur()}))}shouldClearOnEdit(){const{type:n,clearOnEdit:t}=this;return void 0===t?"password"===n:t}getValue(){return this.value||""}validate=n=>{"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.nativeInput.validity?.valid?this._invalid=!1:(this.showInlineError&&(n&&n.preventDefault(),this.errorMessage=this.nativeInput.validationMessage),this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage,originalEvent:n})};onInput=n=>{const t=n.target;this.value=t?.value||"",this.nanoInput.emit(n)};onBlur=()=>{this.hasFocus=!1,this.focusChanged(),"dirty"===this.validateOn&&this.validate(),this.nanoBlur.emit()};onFocus=n=>{"date"===this.type&&n.preventDefault(),this.hasFocus=!0,this.focusChanged(),this.nanoFocus.emit()};onKeydown=n=>{"date"===this.type&&[" "].includes(n.key)&&(n.preventDefault(),this.showPicker&&this.pickerDropdown?.show()),this.shouldClearOnEdit()&&(this.didBlurAfterEdit&&this.hasValue()&&this.clearTextInput(),this.didBlurAfterEdit=!1)};clearTextInput=n=>{this.clearable&&!this.readonly&&!this.disabled&&n&&(n.preventDefault(),n.stopPropagation()),this.value="",this.nativeInput.value="";const t=new window.Event("change");this.nativeInput.dispatchEvent(t)};focusChanged(){!this.hasFocus&&this.shouldClearOnEdit()&&this.hasValue()&&(this.didBlurAfterEdit=!0)}hasValue(){return this.getValue().length>0}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.el,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.el.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.el.querySelector('[slot="helper"]'),this.hasHelperEndSlot=!!this.el.querySelector('[slot="helper-end"]'),this.datalist=this.el.querySelector(`${o("nano-datalist")}:not([slot])`)}connectedCallback(){this.debounceChanged(),this.el.dispatchEvent(new CustomEvent("nanoDidLoad",{detail:this.el}))}disconnectedCallback(){document.dispatchEvent(new CustomEvent("nanoDidUnload",{detail:this.el})),this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver(),this.hasRendered=!0,this.autofocus&&setTimeout((()=>this.setFocus()),300)}componentWillLoad(){this.processSlottedContent()}componentDidRender(){this.shouldValidate&&(this.validate(),this.shouldValidate=!1)}render(){const n=this.getValue(),t=this.inputId+"-lbl",e=this.showInlineError||this.hasHelperSlot?this.inputId+"-more":"",o=this.hasHelperEndSlot?this.inputId+"-helper":"";this.rtl="rtl"===this.el.ownerDocument.dir;const s={...(({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:a,errorMessage:i,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:p,showCharCount:u,rtl:b,hasHelperEndSlot:f})=>({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:a,errorMessage:i,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:p,showCharCount:u,rtl:b,hasHelperEndSlot:f}))(this),labelId:t,moreId:e,helperEndId:o,hasValue:this.hasValue(),controlId:this.inputId},r=(({clearable:n,readonly:t,disabled:e})=>({clearable:n,readonly:t,disabled:e,clearControl:this.clearable}))(this);return i(a,{key:"636d7624bcfe136a0e93b55cf9fc38e272f7aed6","aria-disabled":this.disabled?"true":null,class:{"has-value":this.hasValue(),"has-focus":this.hasFocus,"is-invalid":!0===this._invalid,"is-valid":!1===this._invalid,"nano-input":!0}},i("div",{key:"942db1636f7d08dd581359b66df66ebf080d23ae",style:{width:"100%"}},i(x,{key:"d944b897545398b51ab0a76e1f8d62c57cd85843",...s,class:{"has-helper":this.hasHelperSlot,"has-error":!!this.errorMessage&&this.showInlineError&&!0===this._invalid}},i(w,{key:"efd29f841ff0724228fc47754a5aad8d82f88d49",...r,onClearText:this.clearTextInput,control:this.el,ref:n=>this.nativeInputWrap=n,showInlineError:this.showInlineError,endSlot:this.showPicker&&"date"===this.type&&!this.readonly&&!this.disabled&&[i("nano-dropdown",{slot:"end",dialogTitle:"Choose a date",class:"input__date-dropdown",part:"date__dropdown",placement:"bottom-end",skidding:10,distance:12,ref:n=>this.pickerDropdown=n,onNanoAfterShow:()=>this.picker.setFocus(!0)},i("nano-icon-button",{label:"Open date picker",iconName:"light/calendar-days",slot:"trigger",class:"input__date-trigger"}),i("div",null,i("div",{class:"date-field__close-bar"},i("nano-icon-button",{label:"Close date picker",iconName:"light/xmark",class:"input__date-close",onClick:n=>{n.target.closest("nano-dropdown")?.hide()},ref:n=>this.pickerCloseBtn=n})),i("nano-date-picker",{part:"date__picker",ref:n=>{this.picker=n,this.picker.firstFocusEle=this.pickerCloseBtn},...this.pickerOptions,isDateDisabled:this.isDateDisabled,onNanoDatePicked:n=>{this.value=n.detail.value,this.pickerDropdown?.hide()},min:this.min,max:this.max,"is-modal":!0,selectedDate:this.value||this.initialPickerDate||void 0})))]},"textarea"!==this.type&&i("input",{key:"ce5547777de11926717b27712f7d687171d0dde7",id:this.inputId,class:"input__native-ctrl",ref:n=>this.nativeInput=n,"aria-labelledby":t+" "+e+" "+o,disabled:this.disabled,accept:this.accept,autoCapitalize:this.autocapitalise,autoComplete:this.autocomplete,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,min:this.min,max:this.max,minLength:this.minlength,maxLength:this.maxlength,multiple:this.multiple,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,step:this.step,size:this.size,type:this.type,value:n,onInput:this.onInput,onClick:n=>n.preventDefault(),onChange:this.onInput,onFocus:this.onFocus,onBlur:this.handleBlur,onKeyDown:this.onKeydown,onInvalid:this.validate}),"textarea"===this.type&&i("textarea",{key:"e1dc2377200cdccda85cdbb6cda08a49d8459c1e",rows:this.floatLabel?1:this.rows,id:this.inputId,class:{"input__native-ctrl":!0,input__resizable:"true"===this.resize},ref:n=>this.nativeInput=n,"aria-labelledby":t+" "+e+" "+o,disabled:this.disabled,autoCapitalize:this.autocapitalise,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,minLength:this.minlength,maxLength:this.maxlength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,value:n,onInput:this.onInput,onChange:this.onInput,onFocus:this.onFocus,onKeyDown:this.onKeydown,onInvalid:this.validate,onBlur:this.handleBlur}))),i("slot",{key:"564511c369dc13eb85cbf7e1c48b5d5fbbea8679"})))}static get watchers(){return{datalist:["setDataListOpts"],debounce:["debounceChanged"],value:["valueChanged"],minlength:["handleValidatePropChange"],maxlength:["handleValidatePropChange"],min:["handleValidatePropChange"],max:["handleValidatePropChange"],required:["handleValidatePropChange"],disabled:["handleValidatePropChange"],readonly:["handleValidatePropChange"],pattern:["handleValidatePropChange"],inputmode:["handleValidatePropChange"],type:["handleValidatePropChange"]}}};L.style='.sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::after {\n  box-sizing: border-box;\n}\n[hidden].sc-nano-input {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    .sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::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  }.sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::after {\n  box-sizing: border-box;\n}\n[hidden].sc-nano-input {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    .sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::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  }slot-fb.sc-nano-input {\n  display: contents !important;\n}\n\n[disabled].sc-nano-input-h:not([disabled=false]) {\n  opacity: 0.5;\n  position: relative;\n}\n[disabled].sc-nano-input-h:not([disabled=false])::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  cursor: not-allowed;\n}\n\n.form-ctrl.sc-nano-input {\n  min-inline-size: 100%;\n  display: block;\n}\n.form-ctrl.has-helper-end.sc-nano-input {\n  display: flex;\n  gap: 1rem;\n  container-type: inline-size;\n}\n.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__wrapper.sc-nano-input {\n  flex: 1 1 100%;\n}\n.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__helper-end.sc-nano-input {\n  display: none;\n}\n@container (min-width: 350px) {\n  .form-ctrl.has-helper-end .form-ctrl__helper-end {\n    display: block !important;\n  }\n  .form-ctrl.has-helper-end .form-ctrl__helper {\n    display: none !important;\n  }\n}\n\n.form-ctrl__wrapper.sc-nano-input {\n  display: block;\n}\n\nlabel.sc-nano-input, .form-ctrl__more.sc-nano-input, .form-ctrl__error.sc-nano-input, .form-ctrl__helper.sc-nano-input {\n  display: block;\n}\nlabel.visually-hide.sc-nano-input, .form-ctrl__more.visually-hide.sc-nano-input, .form-ctrl__error.visually-hide.sc-nano-input, .form-ctrl__helper.visually-hide.sc-nano-input {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n\n.form-ctrl__float-label.sc-nano-input {\n  padding-block: 0;\n  padding-inline: var(--padding-start) 0;\n  color: var(--label-color);\n  position: absolute;\n  font-size: 1em;\n  transform: translateY(-50%);\n  inset-block-start: 50%;\n  transition: all 0.125s ease-in;\n  opacity: 1;\n}\n.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input, .has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input {\n  transform: none;\n  font-size: 0.75em;\n  opacity: 0.7;\n  inset-block-start: var(--padding-top);\n}\n.form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input, .has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__label.sc-nano-input {\n  color: var(--label-color);\n  font-size: var(--label-font-size);\n  padding-block-end: var(--padding-bottom);\n  line-height: 1;\n  display: flex;\n  align-items: center;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-wrap.sc-nano-input {\n  flex: 1;\n  overflow-x: clip;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input {\n  margin-block: unset;\n  margin-inline: 0 5px;\n  opacity: 0;\n  appearance: none;\n  transition: 0.3s ease opacity;\n  font-size: 0.85em;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  margin-block: unset;\n  margin-inline: auto 0;\n  font-size: var(--nano-font-size-2xs);\n  opacity: 0.5;\n}\n.has-value.sc-nano-input-h .form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input {\n  opacity: 0.5;\n}\n\n.has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-focus.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__more.sc-nano-input {\n  position: relative;\n  margin-block: var(--padding-bottom) 0;\n  margin-inline: 0;\n  opacity: 0;\n  display: none;\n  transition: all var(--nano-transition-fast) ease;\n  transition-behavior: allow-discrete;\n}\n.form-ctrl__more.sc-nano-input > *.sc-nano-input {\n  grid-column: 1;\n  grid-row: 1;\n}\n.has-helper.sc-nano-input .form-ctrl__more.sc-nano-input, .has-error.sc-nano-input .form-ctrl__more.sc-nano-input {\n  display: grid;\n  opacity: 1;\n}\n\n.form-ctrl__helper.sc-nano-input, .form-ctrl__error.sc-nano-input {\n  font-size: var(--more-font-size);\n  line-height: 1.2;\n  transition: 0.3s ease-out opacity;\n}\n\n.form-ctrl__helper.sc-nano-input {\n  font-style: italic;\n  color: var(--help-msg-color);\n}\n[show-inline-error].sc-nano-input-h:not([show-inline-error=false]).is-invalid .form-ctrl__helper.sc-nano-input {\n  opacity: 0;\n}\n\n.form-ctrl__helper-end.sc-nano-input {\n  flex: 1 1 30%;\n  min-inline-size: 150px;\n  font-size: var(--invalid-msg-font-size);\n  color: var(--help-msg-color);\n  font-style: italic;\n}\n\n.form-ctrl__error.sc-nano-input {\n  opacity: 0;\n  color: var(--invalid-msg-color);\n  font-style: italic;\n}\n.is-invalid.sc-nano-input-h:not([disabled]) .form-ctrl__error.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__input.sc-nano-input {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  border-radius: var(--input-border-radius);\n  inline-size: 100%;\n  padding: 0 !important;\n  position: relative;\n  flex: 1 0 auto;\n  display: flex;\n  background: var(--input-bg-color);\n  border: var(--input-border-style) var(--input-border-width);\n  font-size: var(--input-font-size);\n  padding-inline-start: calc(var(--input-invalid-border-hint-width) - var(--input-border-width)) !important;\n}\n.form-ctrl__input.sc-nano-input:focus-visible, .form-ctrl__input.sc-nano-input:focus-within, .has-focus.sc-nano-input-h .form-ctrl__input.sc-nano-input {\n  outline: var(--nano-focus-ring-color) solid 3px;\n  outline-offset: -2px;\n}\n.is-invalid.sc-nano-input-h:not([disabled]) .form-ctrl__input.sc-nano-input {\n  border-inline-start: solid var(--color-invalid) var(--input-invalid-border-hint-width);\n  padding-inline-start: 0 !important;\n}\n.is-invalid.has-focus.sc-nano-input-h:not([disabled]) .form-ctrl__input.sc-nano-input {\n  border-color: var(--color-invalid);\n  border-inline-start: solid var(--color-invalid) var(--input-invalid-border-hint-width);\n  padding-inline-start: 0 !important;\n}\n\n.form-ctrl__input-wrap.sc-nano-input {\n  display: flex;\n  flex: 1;\n  max-inline-size: 100%;\n  align-items: center;\n}\n[type=textarea].sc-nano-input-h .form-ctrl__input-wrap.sc-nano-input {\n  align-items: start;\n}\n\n.form-ctrl__clear-btn.sc-nano-input, .form-ctrl__slot-end.sc-nano-input, .form-ctrl__slot-start.sc-nano-input, .form-ctrl__slot-value-end.sc-nano-input {\n  margin-block: 0;\n  margin-inline: 0;\n  font-size: 1em;\n  border: 0;\n  outline: none;\n  background-color: transparent;\n  background-repeat: no-repeat;\n  display: flex;\n  align-items: center;\n  inline-size: auto;\n  padding-inline-end: var(--padding-end);\n  padding-block: var(--padding-top) var(--padding-bottom);\n}\n.form-ctrl__clear-btn.sc-nano-input:empty, .form-ctrl__slot-end.sc-nano-input:empty, .form-ctrl__slot-start.sc-nano-input:empty, .form-ctrl__slot-value-end.sc-nano-input:empty {\n  display: none;\n}\n\n.form-ctrl__slot-end.sc-nano-input {\n  padding-block: calc(var(--padding-top) / 2) calc(var(--padding-bottom) / 2);\n}\n\n.form-ctrl__slot-start.sc-nano-input {\n  padding-inline-end: 0;\n}\n.has-float-label.sc-nano-input .form-ctrl__slot-start.sc-nano-input {\n  display: none;\n}\n\n.form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > *, .form-ctrl__slot-end.sc-nano-input-s > *, .form-ctrl__slot-end .sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input-s > :not(slot-fb), .form-ctrl__slot-value-end .sc-nano-input-s > :not(slot-fb) {\n  padding-inline: unset;\n  align-items: center;\n  display: flex;\n  block-size: 100%;\n  z-index: 1;\n}\n.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > *, .sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-end.sc-nano-input-s > *, .form-ctrl__slot-end .sc-nano-input-s > *, .sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-input-s > :not(slot-fb), .form-ctrl__slot-value-end .sc-nano-input-s > :not(slot-fb) {\n  pointer-events: none;\n}\n\n.form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > * {\n  margin-inline: var(--padding-start) 0;\n}\n\n.form-ctrl__slot-value-end.sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input-s > *, .form-ctrl__slot-value-end .sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input *.sc-nano-input {\n  pointer-events: none;\n}\n\n.form-ctrl__clear-btn.sc-nano-input {\n  color: var(--clear-btn-color);\n  padding: 0;\n  opacity: 0;\n  inline-size: 0;\n  appearance: none;\n  align-items: center;\n  overflow: hidden;\n  padding-block: var(--padding-top) var(--padding-bottom);\n}\n.is-invalid.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input {\n  color: var(--clear-btn-color--invalid);\n}\n.has-value.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input {\n  padding-inline: 0 var(--padding-end);\n  opacity: 1;\n  inline-size: auto;\n}\n.form-ctrl__clear-btn.sc-nano-input:hover {\n  color: var(--clear-btn-color--hover);\n}\n\n.form-ctrl__validation-icon.sc-nano-input {\n  padding-block: var(--padding-top) var(--padding-bottom);\n  padding-inline-end: var(--padding-end);\n  display: grid;\n  grid-template-areas: "overlay";\n}\n.sc-nano-input-h:not(.is-invalid .form-ctrl__validation-icon.sc-nano-input, .is-valid).sc-nano-input-h .form-ctrl__validation-icon.sc-nano-input {\n  display: none;\n}\n\n.form-ctrl__error-icon.sc-nano-input, .form-ctrl__success-icon.sc-nano-input {\n  color: var(--color-valid);\n  opacity: 0;\n  transition: 0.3s ease-out opacity;\n  grid-area: overlay;\n}\n\n.is-valid.sc-nano-input-h .form-ctrl__success-icon.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__error-icon.sc-nano-input {\n  color: var(--color-invalid);\n}\n.is-invalid.sc-nano-input-h .form-ctrl__error-icon.sc-nano-input {\n  opacity: 1;\n}\n\n.sc-nano-input-h {\n  \n  --placeholder-color: var(--nano-color-neutral-1000);\n  --padding-top: var(--nano-spacing-sm);\n  --padding-end: var(--nano-spacing-sm);\n  --padding-bottom: var(--nano-spacing-sm);\n  --padding-start: var(--nano-spacing-sm);\n  --color-invalid: var(--nano-color-danger-1100);\n  --color-valid: var(--nano-color-success-1000);\n  --input-font-size: var(--nano-font-size-sm);\n  --input-text-color: var(--nano-color-base-1000);\n  --input-border-width: 1px;\n  --input-border-color: var(--nano-color-neutral-300);\n  --input-border-radius: 0px;\n  --input-invalid-border-hint-width: 2px;\n  --input-border-style: solid var(--input-border-color);\n  --input-border-style--focus: solid var(--input-border-width) var(--nano-color-primary-700);\n  --input-bg-color: var(--nano-color-base-0);\n  --invalid-msg-color: var(--color-invalid);\n  --help-msg-color: var(--nano-color-base-1000);\n  --more-font-size: var(--nano-font-size-2xs);\n  --clear-btn-color: rgb(var(--nano-color-base-rgb-1000) / 60%);\n  --clear-btn-color--hover: rgb(var(--nano-color-base-rgb-1000) / 100%);\n  --clear-btn-color--invalid: rgb(var(--color-invalid) / 100%);\n  --label-color: var(--nano-color-base-1000);\n  --label-font-size: var(--nano-font-size-xs);\n  position: relative;\n  inline-size: 100%;\n  padding: 0 !important;\n  color: currentcolor;\n  display: block;\n}\n\n[type=date].sc-nano-input-h .input__date-trigger.sc-nano-input {\n  color: var(--nano-color-primary-1200);\n}\n[type=date].sc-nano-input-h .input__date-dropdown.sc-nano-input {\n  --overflow: visible;\n}\n[type=date].sc-nano-input-h .input__date-close.sc-nano-input {\n  position: absolute;\n  inset-inline-end: 0;\n  inset-block: 0;\n  opacity: 0;\n  z-index: 2;\n}\n[type=date].sc-nano-input-h .input__date-close.sc-nano-input:focus {\n  opacity: 1;\n}\n@supports selector(::-moz-placeholder) {\n  [type=date].sc-nano-input-h .form-ctrl__input-wrap.sc-nano-input {\n    justify-content: end;\n    min-block-size: 2.5em;\n  }\n  [type=date].sc-nano-input-h .input__native-ctrl.sc-nano-input {\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block-start: 0;\n  }\n  [type=date].sc-nano-input-h .input__date-dropdown.sc-nano-input {\n    background-color: var(--nano-color-base-0);\n  }\n}\n\n.input__native-ctrl.sc-nano-input {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  appearance: none;\n  -webkit-rtl-ordering: logical;\n  padding-block: 0;\n  padding-inline: var(--padding-start) var(--padding-end);\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  inline-size: 100%;\n  max-inline-size: 100%;\n  max-block-size: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  line-height: 2.5em;\n  min-block-size: 2.5em;\n  \n}\n.has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  line-height: 2.1em;\n  min-block-size: 2.1em;\n  padding-block-start: 1.4em;\n}\n.input__native-ctrl.sc-nano-input::placeholder {\n  color: var(--placeholder-color);\n  font-family: inherit;\n  font-style: initial;\n  font-weight: initial;\n  line-height: inherit;\n  min-block-size: initial;\n}\n.input__native-ctrl.sc-nano-input::-moz-placeholder {\n  line-height: 2.8em;\n  text-overflow: ellipsis;\n}\n.input__native-ctrl.sc-nano-input:-webkit-autofill {\n  background-color: transparent;\n}\n.input__native-ctrl.sc-nano-input::-webkit-search-decoration, .input__native-ctrl.sc-nano-input::-webkit-search-cancel-button, .input__native-ctrl.sc-nano-input::-webkit-search-results-button, .input__native-ctrl.sc-nano-input::-webkit-search-results-decoration {\n  appearance: none;\n}\n.input__native-ctrl.sc-nano-input::-webkit-calendar-picker-indicator {\n  display: none;\n}\n.input__native-ctrl.sc-nano-input::-webkit-datetime-edit {\n  display: block;\n  padding: 0;\n}\n.input__native-ctrl.sc-nano-input:invalid {\n  box-shadow: none;\n}\n.input__native-ctrl.sc-nano-input::-ms-clear, .input__native-ctrl.sc-nano-input::-ms-reveal {\n  display: none;\n}\n.input__native-ctrl.input__resizable.sc-nano-input {\n  resize: vertical;\n  overflow: auto;\n}\n.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input {\n  line-height: 1.5em;\n  padding-block: calc(var(--padding-top) - 3px) 0.5em;\n  white-space: pre-wrap;\n}\n.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::placeholder {\n  line-height: 1.5em;\n}\n.has-float-label.sc-nano-input .form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input {\n  padding-block-start: 1.75em;\n}\n[readonly].sc-nano-input-h:not([readonly=false]) .input__native-ctrl.sc-nano-input {\n  -webkit-user-select: none;\n          user-select: none;\n}';export{I as nano_date_picker,L as nano_input}
+import{r as n,c as t,g as e,a}from"./index-BM3Om9WE.js";import{h as i,t as o}from"./renderer-BaP2L8CT.js";import{i as s,g as r,b as l,D as c,p as d,d as h,s as p,e as u,f as b,h as f,j as _,k as m,l as v,a as g}from"./date-utils-BZYdjI1P.js";import{c as y}from"./dom-dlicJTEJ.js";import{a as k}from"./throttle-C93FMm2Z.js";import{F as x,a as w}from"./form-control-CIz-2SMG.js";const z={buttonLabel:"Choose date",placeholder:"YYYY-MM-DD",selectedDateMessage:"Selected date is",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",monthSelectLabel:"Month",yearSelectLabel:"Year",closeLabel:"Close window",keyboardInstruction:"You can use arrow keys to navigate dates",calendarHeading:"Choose a date",dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNamesShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},D=({focusedDay:n,today:t,day:e,onDaySelect:a,onKeyboardNavigation:o,focusedDayRef:r,inRange:l,disabled:c,isSelected:d})=>{const h=s(e,t),p=s(e,n),u=e.getMonth()!==n.getMonth()||c,b=!l;return i("button",{class:{"duet-date__day":!0,"is-outside":b,"is-disabled":u,"is-today":h},tabIndex:p?0:-1,onClick:function(n){a(n,e)},onKeyDown:o,disabled:b,type:"button","aria-pressed":d?"true":"false",ref:n=>{p&&n&&r&&r(n)}},i("span",{"aria-hidden":"true"},e.getDate()),i("span",{class:"duet-date__vhidden"},e.toLocaleDateString(void 0,{day:"numeric",month:"long"})))},C=({selectedDate:n,focusedDate:t,labelledById:e,localization:a,firstDayOfWeek:o,min:c,max:d,onDateSelect:h,onKeyboardNavigation:p,focusedDayRef:u,onMouseDown:b,onFocusIn:f,isDateDisabled:_})=>{const m=new Date,v=r(t,o);return i("table",{class:"duet-date__table",role:"grid","aria-labelledby":e,onFocusin:f,onMouseDown:b},i("thead",null,i("tr",null,(y=o,k=n=>i("th",{class:"duet-date__table-header",scope:"col"},i("span",{"aria-hidden":"true"},n.substring(0,2)),i("span",{class:"duet-date__vhidden"},n)),(g=a.dayNames).map(((n,t)=>k(g[(t+y)%g.length])))))),i("tbody",null,function(n){const t=[];for(let e=0;e<n.length;e+=7)t.push(n.slice(e,e+7));return t}(v).map((e=>i("tr",{class:"duet-date__row"},e.map((e=>i("td",{class:"duet-date__cell",role:"gridcell","aria-selected":s(e,n)?"true":void 0},i(D,{day:e,today:m,focusedDay:t,inRange:l(e,c,d),onDaySelect:h,onKeyboardNavigation:p,focusedDayRef:u,disabled:_(e),isSelected:s(e,n)})))))))));var g,y,k};let S=0;const I=class{constructor(e){n(this,e),this.nanoDatePicked=t(this,"nanoDatePicked",7)}dateId="nano-datepicker-"+S++;monthSelectId=this.dateId+"-month";yearSelectId=this.dateId+"-year";dialogLabelId=this.dateId+"-dialog";firstFocusableElement;monthSelectNode;focusedDayNode;focusTimeoutId;initialTouchX=null;initialTouchY=null;get host(){return e(this)}activeFocus=!1;focusedDay=new Date;_selectedDate="";get selectedDate(){return this._selectedDate}set selectedDate(n){"string"==typeof n?(n=n.split("T")[0],this._selectedDate=n):this._selectedDate=""}min="";max="";firstDayOfWeek=c.Monday;localization=z;isDateDisabled=()=>!1;isModal=!1;firstFocusEle;nanoDatePicked;async setFocus(n=!1){this.setFocusedDay(d(this.selectedDate)||new Date),n?setTimeout((()=>this.focusedDayNode.focus({preventScroll:!0})),20):(clearTimeout(this.focusTimeoutId),this.focusTimeoutId=setTimeout((()=>{this.monthSelectNode.focus({preventScroll:!0})}),20))}handleSelectedDateChange(){this.setFocus(!0)}enableActiveFocus=()=>{this.activeFocus=!0};disableActiveFocus=()=>{this.activeFocus=!1};addDays(n){this.setFocusedDay(h(this.focusedDay,n))}addMonths(n){this.setMonth(this.focusedDay.getMonth()+n)}addYears(n){this.setYear(this.focusedDay.getFullYear()+n)}startOfWeek(){this.setFocusedDay(p(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(u(this.focusedDay,this.firstDayOfWeek))}setMonth(n){const t=b(f(this.focusedDay),n),e=_(t),a=b(this.focusedDay,n);this.setFocusedDay(m(a,t,e))}setYear(n){const t=v(f(this.focusedDay),n),e=_(t),a=v(this.focusedDay,n);this.setFocusedDay(m(a,t,e))}setFocusedDay(n){this.focusedDay=m(n,d(this.min),d(this.max))}handleTouchStart=n=>{const t=n.changedTouches[0];this.initialTouchX=t.pageX,this.initialTouchY=t.pageY};handleTouchMove=n=>{n.preventDefault()};handleTouchEnd=n=>{const t=n.changedTouches[0],e=t.pageX-this.initialTouchX,a=t.pageY-this.initialTouchY;Math.abs(e)>=70&&Math.abs(a)<=70&&this.addMonths(e<0?1:-1),this.initialTouchY=null,this.initialTouchX=null};handleNextMonthClick=n=>{n.preventDefault(),this.addMonths(1)};handlePreviousMonthClick=n=>{n.preventDefault(),this.addMonths(-1)};handleKeyboardNavigation=n=>{if("Tab"===n.key&&!n.shiftKey&&this.isModal){n.preventDefault();const t=this.firstFocusEle||this.firstFocusableElement;return void(t.setFocus?t.setFocus():t.focus())}let t=!0;switch(n.key){case"ArrowRight":this.addDays(1);break;case"ArrowLeft":this.addDays(-1);break;case"ArrowDown":this.addDays(7);break;case"ArrowUp":this.addDays(-7);break;case"PageUp":n.shiftKey?this.addYears(-1):this.addMonths(-1);break;case"PageDown":n.shiftKey?this.addYears(1):this.addMonths(1);break;case"Home":this.startOfWeek();break;case"End":this.endOfWeek();break;default:t=!1}t&&(n.preventDefault(),this.enableActiveFocus())};handleDaySelect=(n,t)=>{const e=!this.isDateDisabled(t);l(t,d(this.min),d(this.max))&&e&&(t.getMonth()===this.focusedDay.getMonth()?this.setValue(t):this.setFocusedDay(t))};handleMonthSelect=n=>{this.setMonth(parseInt(n.target.value,10))};handleYearSelect=n=>{this.setYear(parseInt(n.target.value,10))};setValue(n){this.selectedDate=g(n),this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:n})}processFocusedDayNode=n=>{this.focusedDayNode=n,this.activeFocus&&setTimeout((()=>n.focus({preventScroll:!0})),0)};componentWillLoad(){this.handleSelectedDateChange()}render(){const n=d(this.selectedDate),t=(n||this.focusedDay).getFullYear(),e=this.focusedDay.getMonth(),o=this.focusedDay.getFullYear(),s=d(this.min),r=d(this.max),c=null!=s&&s.getMonth()===e&&s.getFullYear()===o,h=null!=r&&r.getMonth()===e&&r.getFullYear()===o;let p=t-10,u=t+10;return s&&(p=s.getFullYear()),r&&(u=r.getFullYear()),i(a,{key:"d3b992532815f40dbd9fcb7b0ddfaa27d703899b",class:"nano-date-picker"},i("div",{key:"c1be847528fac0224c54110aa77a7b471969c34d",class:"duet-date"},i("div",{key:"8aa8dceea4d272bf171924bfbf59a4f645bed23d",class:{"duet-date__dialog":!0,"is-active":!0},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},i("div",{key:"374d34c706b3972971ebfc05d32d4f2cfb8721de",class:"duet-date__dialog-content"},i("div",{key:"4713d41d66ae2bc7057ec337080cd54700b51033",class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),i("div",{key:"b602d630814a176a066dab67645178fd15a7ca22",class:"duet-date__header",onFocusin:this.disableActiveFocus},i("div",{key:"2cc00317d6468c2ea5c477249774eec83f5b94da"},i("h2",{key:"0f420e58b51e50d6d973330665c508ca8167f3c3",id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[e]," ",this.focusedDay.getFullYear()),i("label",{key:"56192f5d51880678b86137cca89cb4a98515e03e",htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),i("div",{key:"900c7995f2a3c51b5d22fee6176518940e7efc27",class:"duet-date__select"},i("select",{key:"22bef19a74a42e7864d6cff32707adc7c0cc52b6",id:this.monthSelectId,class:"duet-date__select--month",ref:n=>this.firstFocusableElement=this.monthSelectNode=n,onChange:this.handleMonthSelect},this.localization.monthNames.map(((n,t)=>i("option",{key:n,value:t,selected:t===e,disabled:!l(new Date(o,t,1),s?f(s):null,r?_(r):null)},n)))),i("div",{key:"ba1108c781547bbaba8da184f07fd7d36b12cb4c",class:"duet-date__select-label","aria-hidden":"true"},i("span",{key:"8cd8018d9b68129e69219b9bffcd978a394269a5"},this.localization.monthNamesShort[e]),i("nano-icon",{key:"e2b440b6adf599930d20e584c92c5f66d52564fd",name:"light/chevron-down"}))),i("label",{key:"043530523830f9c5a67682c47cfb6dc0464f3133",htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),i("div",{key:"e2e43ad2280255eb46cf06b9328af9bbefbe96a5",class:"duet-date__select"},i("select",{key:"eaaa7a64a034d1723c20b42cf14c8cea0f8c78b1",id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect},function(n,t){const e=[];for(let a=n;a<=t;a++)e.push(a);return e}(p,u).map((n=>i("option",{key:n,selected:n===o},n)))),i("div",{key:"c6ce7ec0f073caad0bd6ab09d03f1e20f5433e97",class:"duet-date__select-label","aria-hidden":"true"},i("span",{key:"3f985ad9b631cb140f4e551ab2f20cbdef88da6a"},this.focusedDay.getFullYear()),i("nano-icon",{key:"1b06f5e08b8b33bcc7d641abe122e3bb0fad05ba",name:"light/chevron-down"})))),i("div",{key:"4ea6d2f63406af47b4aba3b137c778aa9fed2524",class:"duet-date__nav"},i("button",{key:"6cd94d90c91aa0ccbd74a9ba361b7d894ef9fccf",class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},i("nano-icon",{key:"83d33e3779d7249634afbd8f1cd1c6476bad4697",name:"light/chevron-left"}),i("span",{key:"2318ef1d137f42a93240efc4caa15b376f079909",class:"duet-date__vhidden"},this.localization.prevMonthLabel)),i("button",{key:"f8c400b9e644687ce1279a70e6fc5c0b1aec6aac",class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},i("nano-icon",{key:"a4ef19900fdfee3cc340ab6bba83dcf782e9b21a",name:"light/chevron-right"}),i("span",{key:"da03dc579aeb3dc5a00b2c647f78b71186cc7d74",class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),i("div",{key:"ec82cee96b94f0b4a36993d42bae2eb02a392522"},i(C,{key:"e84697f87540abe1e8cfd47903655ac8b68ba08d",selectedDate:n,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:s,max:r,isDateDisabled:this.isDateDisabled}))))))}static get watchers(){return{selectedDate:["handleSelectedDateChange"]}}};I.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{--active-color:var(--nano-color-primary-1000);--active-text-color:var(--nano-color-base-0);--inactive-color:var(--nano-color-neutral-300);display:block;font-size:16px;background:var(--nano-color-neutral-50)}.duet-date *,.duet-date *::before,.duet-date *::after{box-sizing:border-box;margin:0}.duet-date{box-sizing:border-box;color:currentcolor;display:block;margin:0;position:relative;text-align:start;inline-size:100%}.duet-date__dialog{display:flex;inset-block-start:100%;max-inline-size:100%;inline-size:100%}.duet-date__dialog.is-left{inset-inline:auto 0;inline-size:auto}.duet-date__dialog-content{min-inline-size:290px;padding:var(--nano-spacing-md);position:relative;transform:none;max-inline-size:100%;inline-size:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1;text-align:center;inline-size:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1;padding-block-end:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center;padding:0 0 3px}.duet-date__day{appearance:none;background:transparent;border:0;border-radius:50%;cursor:pointer;display:inline-block;font-size:0.875em;font-variant-numeric:tabular-nums;line-height:1;position:relative;text-align:center;vertical-align:middle;z-index:1;block-size:2.5em;inline-size:2.5em}.duet-date__day.is-today{box-shadow:0 0 0 1px var(--active-color);position:relative}.duet-date__day:hover::before,.duet-date__day.is-today::before{content:"";background:var(--active-color);border-radius:50%;opacity:0.16;position:absolute;inset:0}[aria-selected=true] .duet-date__day{background:var(--active-color) !important;color:var(--active-text-color);box-shadow:none;outline:0}.duet-date__day:not(.is-disabled):active{background:color-mix(in srgb, var(--active-color), black 20%);color:var(--active-text-color)}.duet-date__day:focus-visible{outline:var(--nano-focus-ring);outline-offset:-1px;z-index:2}.duet-date__day.is-disabled{background:transparent;box-shadow:none;cursor:default;opacity:0.5}.duet-date__day.is-disabled::before{display:none}.duet-date__day.is-outside{background:var(--inactive-color);box-shadow:none;cursor:default;opacity:0.8;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{align-items:center;display:flex;justify-content:space-between;margin-block-end:var(--nano-spacing-md);inline-size:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{background:var(--inactive-color);align-items:center;appearance:none;border:0;border-radius:50%;cursor:pointer;display:inline-flex;justify-content:space-around;margin-inline-start:8px;padding:0;font-size:0.9em;block-size:2.2em;inline-size:2.2em}.duet-date__prev:focus-visible,.duet-date__next:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.duet-date__prev:active,.duet-date__next:active{background:color-mix(in srgb, var(--inactive-color), black 20%)}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.7}.duet-date__prev .nano-icon,.duet-date__next .nano-icon{margin-block:0;margin-inline:auto}.duet-date__select{display:inline-flex;margin-block-start:4px;position:relative}.duet-date__select span{margin-inline-end:4px}.duet-date__select select{cursor:pointer;font-size:1em;block-size:100%;inset-inline-start:0;opacity:0;position:absolute;inset-block-start:0;inline-size:100%;z-index:2}.duet-date__select select:focus-visible:focus+.duet-date__select-label{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.duet-date__select-label{align-items:center;display:flex;font-size:1.25em;font-weight:600;line-height:1;padding-block:0;padding-inline:8px 4px;pointer-events:none;position:relative;inline-size:100%;z-index:1}.duet-date__select-label .nano-icon{font-size:0.55em}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);block-size:1px;overflow:hidden;padding:0;position:absolute;inset-block-start:0;inline-size:1px}';let M=0;const L=class{nativeInput;inputId="nano-input-"+M++;didBlurAfterEdit=!1;rtl=!1;mo;charCount=0;hasRendered=!1;pickerDropdown;picker;pickerCloseBtn;shouldValidate=!1;_nativeInputWrap;get nativeInputWrap(){return this._nativeInputWrap}set nativeInputWrap(n){this._nativeInputWrap!==n&&(this._nativeInputWrap=n,this.setDataListOpts())}constructor(e){n(this,e),this.nanoInput=t(this,"nanoInput",7),this.nanoChange=t(this,"nanoChange",7),this.nanoBlur=t(this,"nanoBlur",7),this.nanoFocus=t(this,"nanoFocus",7),this.nanoDidLoad=t(this,"nanoDidLoad",7),this.nanoDidUnload=t(this,"nanoDidUnload",7),this.nanoValidate=t(this,"nanoValidate",7),this.handleBlur=this.handleBlur.bind(this)}hasFocus=!1;hasLabelSlot=!1;hasHelperSlot=!1;hasHelperEndSlot=!1;errorMessage="";datalist=null;setDataListOpts(){this.datalist&&(this.datalist.dropDownConfig={distance:10,...this.datalist.dropDownConfig||{},skidding:-1,tetherTo:this.nativeInputWrap})}get el(){return e(this)}get invalid(){return this._invalid}_invalid=null;get validityMessage(){return this.nativeInput?this.nativeInput.validationMessage:""}accept;autocapitalise="none";autocomplete="off";autocorrect="off";autofocus=!1;clearable=!1;clearOnEdit;debounce=0;debounceChanged(){this.nanoChange=k(this.nanoChange,this.debounce)}disabled=!1;inputmode;validateOn="submitThenDirty";showInlineError=!0;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(n){this._label=n}alwaysShowPlaceholder=!1;hideLabel=!1;floatLabel=!1;max;maxlength;min;minlength;multiple;name=this.inputId;pattern;placeholder;readonly=!1;required=!1;spellcheck=!1;step;size;type="text";form;value="";valueChanged(){this.nanoChange.emit({value:this.value}),this.charCount=this.value?.length||0,"textarea"===this.type&&"auto"===this.resize&&(this.nativeInput.style.height="auto",this.value?.length&&(this.nativeInput.style.height=this.nativeInput.scrollHeight+"px")),"date"===this.type&&(this.isDateDisabled(this.valueAsDate)?this.nativeInput.setCustomValidity("Date selected is not available."):"Date selected is not available."===this.nativeInput.validationMessage&&this.nativeInput.setCustomValidity("")),this.shouldValidate=!0}get valueAsNumber(){return"textarea"===this.type?NaN:this.nativeInput?.valueAsNumber||NaN}get valueAsDate(){return"textarea"===this.type?null:new Date(this.value)}showCharCount=!1;handleValidatePropChange(){this.hasRendered&&(this.shouldValidate=!0)}resize="auto";rows=2;showPicker=!0;isDateDisabled=()=>!1;initialPickerDate;closeAfterPicked=!0;pickerOptions={};nanoInput;nanoChange;nanoBlur;nanoFocus;nanoDidLoad;nanoDidUnload;nanoValidate;async reportValidity(n){return new Promise((t=>{n&&this.validate(),setTimeout((()=>{t({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage})}),50)}))}async setFocus(){this.nativeInput&&(this.nativeInput.focus(),this.nativeInput.click())}async select(){this.nativeInput&&this.nativeInput.select()}getInputElement(){return Promise.resolve(this.nativeInput)}async showError(n){this.nativeInput&&(this.nativeInput.setCustomValidity(n),this.validate())}onReset(n){(this.form?document.querySelector("#"+this.form):this.el.closest("form"))&&n.target===this.el.closest("form")&&(this.value="")}handleBlur(n){if(!this.hasFocus)return;const t=n;let e;requestAnimationFrame((()=>{if(n instanceof KeyboardEvent&&t.key){if("Tab"!==t.key)return;e=document.activeElement}else e=n instanceof FocusEvent?document.activeElement:n.target;y(this.el.tagName.toLowerCase(),e)!==this.el&&this.onBlur()}))}shouldClearOnEdit(){const{type:n,clearOnEdit:t}=this;return void 0===t?"password"===n:t}getValue(){return this.value||""}validate=n=>{"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.nativeInput.validity?.valid?this._invalid=!1:(this.showInlineError&&(n&&n.preventDefault(),this.errorMessage=this.nativeInput.validationMessage),this._invalid=!0),this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage,originalEvent:n})};onInput=n=>{const t=n.target;this.value=t?.value||"",this.nanoInput.emit(n)};onBlur=()=>{this.hasFocus=!1,this.focusChanged(),"dirty"===this.validateOn&&this.validate(),this.nanoBlur.emit()};onFocus=n=>{"date"===this.type&&n.preventDefault(),this.hasFocus=!0,this.focusChanged(),this.nanoFocus.emit()};onKeydown=n=>{"date"===this.type&&[" "].includes(n.key)&&(n.preventDefault(),this.showPicker&&this.pickerDropdown?.show()),this.shouldClearOnEdit()&&(this.didBlurAfterEdit&&this.hasValue()&&this.clearTextInput(),this.didBlurAfterEdit=!1)};clearTextInput=n=>{this.clearable&&!this.readonly&&!this.disabled&&n&&(n.preventDefault(),n.stopPropagation()),this.value="",this.nativeInput.value="";const t=new window.Event("change");this.nativeInput.dispatchEvent(t)};focusChanged(){!this.hasFocus&&this.shouldClearOnEdit()&&this.hasValue()&&(this.didBlurAfterEdit=!0)}hasValue(){return this.getValue().length>0}slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.el,{childList:!0,subtree:!0})}processSlottedContent(){this.hasLabelSlot=!!this.el.querySelectorAll('[slot="label"]'),this.hasHelperSlot=!!this.el.querySelector('[slot="helper"]'),this.hasHelperEndSlot=!!this.el.querySelector('[slot="helper-end"]'),this.datalist=this.el.querySelector(`${o("nano-datalist")}:not([slot])`)}connectedCallback(){this.debounceChanged(),this.el.dispatchEvent(new CustomEvent("nanoDidLoad",{detail:this.el}))}disconnectedCallback(){document.dispatchEvent(new CustomEvent("nanoDidUnload",{detail:this.el})),this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver(),this.hasRendered=!0,this.autofocus&&setTimeout((()=>this.setFocus()),300)}componentWillLoad(){this.processSlottedContent()}componentDidRender(){this.shouldValidate&&(this.validate(),this.shouldValidate=!1)}render(){const n=this.getValue(),t=this.inputId+"-lbl",e=this.showInlineError||this.hasHelperSlot?this.inputId+"-more":"",o=this.hasHelperEndSlot?this.inputId+"-helper":"";this.rtl="rtl"===this.el.ownerDocument.dir;const s={...(({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:a,errorMessage:i,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:p,showCharCount:u,rtl:b,hasHelperEndSlot:f})=>({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:a,errorMessage:i,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:p,showCharCount:u,rtl:b,hasHelperEndSlot:f}))(this),labelId:t,moreId:e,helperEndId:o,hasValue:this.hasValue(),controlId:this.inputId},r=(({clearable:n,readonly:t,disabled:e})=>({clearable:n,readonly:t,disabled:e,clearControl:this.clearable}))(this);return i(a,{key:"636d7624bcfe136a0e93b55cf9fc38e272f7aed6","aria-disabled":this.disabled?"true":null,class:{"has-value":this.hasValue(),"has-focus":this.hasFocus,"is-invalid":!0===this._invalid,"is-valid":!1===this._invalid,"nano-input":!0}},i("div",{key:"942db1636f7d08dd581359b66df66ebf080d23ae",style:{width:"100%"}},i(x,{key:"d944b897545398b51ab0a76e1f8d62c57cd85843",...s,class:{"has-helper":this.hasHelperSlot,"has-error":!!this.errorMessage&&this.showInlineError&&!0===this._invalid}},i(w,{key:"efd29f841ff0724228fc47754a5aad8d82f88d49",...r,onClearText:this.clearTextInput,control:this.el,ref:n=>this.nativeInputWrap=n,showInlineError:this.showInlineError,endSlot:this.showPicker&&"date"===this.type&&!this.readonly&&!this.disabled&&[i("nano-dropdown",{slot:"end",dialogTitle:"Choose a date",class:"input__date-dropdown",part:"date__dropdown",placement:"bottom-end",skidding:10,distance:12,ref:n=>this.pickerDropdown=n,onNanoAfterShow:()=>this.picker.setFocus(!0)},i("nano-icon-button",{label:"Open date picker",iconName:"light/calendar-days",slot:"trigger",class:"input__date-trigger"}),i("div",null,i("div",{class:"date-field__close-bar"},i("nano-icon-button",{label:"Close date picker",iconName:"light/xmark",class:"input__date-close",onClick:n=>{n.target.closest("nano-dropdown")?.hide()},ref:n=>this.pickerCloseBtn=n})),i("nano-date-picker",{part:"date__picker",ref:n=>{this.picker=n,this.picker.firstFocusEle=this.pickerCloseBtn},...this.pickerOptions,isDateDisabled:this.isDateDisabled,onNanoDatePicked:n=>{this.value=n.detail.value,this.pickerDropdown?.hide()},min:this.min,max:this.max,"is-modal":!0,selectedDate:this.value||this.initialPickerDate||void 0})))]},"textarea"!==this.type&&i("input",{key:"ce5547777de11926717b27712f7d687171d0dde7",id:this.inputId,class:"input__native-ctrl",ref:n=>this.nativeInput=n,"aria-labelledby":t+" "+e+" "+o,disabled:this.disabled,accept:this.accept,autoCapitalize:this.autocapitalise,autoComplete:this.autocomplete,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,min:this.min,max:this.max,minLength:this.minlength,maxLength:this.maxlength,multiple:this.multiple,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,step:this.step,size:this.size,type:this.type,value:n,onInput:this.onInput,onClick:n=>n.preventDefault(),onChange:this.onInput,onFocus:this.onFocus,onBlur:this.handleBlur,onKeyDown:this.onKeydown,onInvalid:this.validate}),"textarea"===this.type&&i("textarea",{key:"e1dc2377200cdccda85cdbb6cda08a49d8459c1e",rows:this.floatLabel?1:this.rows,id:this.inputId,class:{"input__native-ctrl":!0,input__resizable:"true"===this.resize},ref:n=>this.nativeInput=n,"aria-labelledby":t+" "+e+" "+o,disabled:this.disabled,autoCapitalize:this.autocapitalise,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,minLength:this.minlength,maxLength:this.maxlength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,value:n,onInput:this.onInput,onChange:this.onInput,onFocus:this.onFocus,onKeyDown:this.onKeydown,onInvalid:this.validate,onBlur:this.handleBlur}))),i("slot",{key:"564511c369dc13eb85cbf7e1c48b5d5fbbea8679"})))}static get watchers(){return{datalist:["setDataListOpts"],debounce:["debounceChanged"],value:["valueChanged"],minlength:["handleValidatePropChange"],maxlength:["handleValidatePropChange"],min:["handleValidatePropChange"],max:["handleValidatePropChange"],required:["handleValidatePropChange"],disabled:["handleValidatePropChange"],readonly:["handleValidatePropChange"],pattern:["handleValidatePropChange"],inputmode:["handleValidatePropChange"],type:["handleValidatePropChange"]}}};L.style='.sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::after {\n  box-sizing: border-box;\n}\n[hidden].sc-nano-input {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    .sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::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  }.sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::after {\n  box-sizing: border-box;\n}\n[hidden].sc-nano-input {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    .sc-nano-input-h, *.sc-nano-input, *.sc-nano-input::before, *.sc-nano-input::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  }slot-fb.sc-nano-input {\n  display: contents !important;\n}\n\n[disabled].sc-nano-input-h:not([disabled=false]) {\n  opacity: 0.5;\n  position: relative;\n}\n[disabled].sc-nano-input-h:not([disabled=false])::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  cursor: not-allowed;\n}\n\n.form-ctrl.sc-nano-input {\n  min-inline-size: 100%;\n  display: block;\n}\n.form-ctrl.has-helper-end.sc-nano-input {\n  display: flex;\n  gap: 1rem;\n  container-type: inline-size;\n}\n.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__wrapper.sc-nano-input {\n  flex: 1 1 100%;\n}\n.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__helper-end.sc-nano-input {\n  display: none;\n}\n@container (min-width: 350px) {\n  .form-ctrl.has-helper-end .form-ctrl__helper-end {\n    display: block !important;\n  }\n  .form-ctrl.has-helper-end .form-ctrl__helper {\n    display: none !important;\n  }\n}\n\n.form-ctrl__wrapper.sc-nano-input {\n  display: block;\n}\n\nlabel.sc-nano-input, .form-ctrl__more.sc-nano-input, .form-ctrl__error.sc-nano-input, .form-ctrl__helper.sc-nano-input {\n  display: block;\n}\nlabel.visually-hide.sc-nano-input, .form-ctrl__more.visually-hide.sc-nano-input, .form-ctrl__error.visually-hide.sc-nano-input, .form-ctrl__helper.visually-hide.sc-nano-input {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n\n.form-ctrl__float-label.sc-nano-input {\n  padding-block: 0;\n  padding-inline: var(--padding-start) 0;\n  color: var(--label-color);\n  position: absolute;\n  font-size: 1em;\n  transform: translateY(-50%);\n  inset-block-start: 50%;\n  transition: all 0.125s ease-in;\n  opacity: 1;\n}\n.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input, .has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input {\n  transform: none;\n  font-size: 0.75em;\n  opacity: 0.7;\n  inset-block-start: var(--padding-top);\n}\n.form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input, .has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__label.sc-nano-input {\n  color: var(--label-color);\n  font-size: var(--label-font-size);\n  padding-block-end: var(--padding-bottom);\n  line-height: 1;\n  display: flex;\n  align-items: center;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-wrap.sc-nano-input {\n  flex: 1;\n  overflow-x: clip;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input {\n  margin-block: unset;\n  margin-inline: 0 5px;\n  opacity: 0;\n  appearance: none;\n  transition: 0.3s ease opacity;\n  font-size: 0.85em;\n}\n.form-ctrl__label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input {\n  margin-block: unset;\n  margin-inline: auto 0;\n  font-size: var(--nano-font-size-2xs);\n  opacity: 0.5;\n}\n.has-value.sc-nano-input-h .form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input {\n  opacity: 0.5;\n}\n\n.has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input, .has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input, .has-focus.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input, .has-value.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__more.sc-nano-input {\n  position: relative;\n  margin-block: var(--padding-bottom) 0;\n  margin-inline: 0;\n  opacity: 0;\n  display: none;\n  transition: all var(--nano-transition-fast) ease;\n  transition-behavior: allow-discrete;\n}\n.form-ctrl__more.sc-nano-input > *.sc-nano-input {\n  grid-column: 1;\n  grid-row: 1;\n}\n.has-helper.sc-nano-input .form-ctrl__more.sc-nano-input, .has-error.sc-nano-input .form-ctrl__more.sc-nano-input {\n  display: grid;\n  opacity: 1;\n}\n\n.form-ctrl__helper.sc-nano-input, .form-ctrl__error.sc-nano-input {\n  font-size: var(--more-font-size);\n  line-height: 1.2;\n  transition: 0.3s ease-out opacity;\n}\n\n.form-ctrl__helper.sc-nano-input {\n  font-style: italic;\n  color: var(--help-msg-color);\n}\n[show-inline-error].sc-nano-input-h:not([show-inline-error=false]).is-invalid .form-ctrl__helper.sc-nano-input {\n  opacity: 0;\n}\n\n.form-ctrl__helper-end.sc-nano-input {\n  flex: 1 1 30%;\n  min-inline-size: 150px;\n  font-size: var(--invalid-msg-font-size);\n  color: var(--help-msg-color);\n  font-style: italic;\n}\n\n.form-ctrl__error.sc-nano-input {\n  opacity: 0;\n  color: var(--invalid-msg-color);\n  font-style: italic;\n}\n.is-invalid.sc-nano-input-h:not([disabled]) .form-ctrl__error.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__input.sc-nano-input {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  border-radius: var(--input-border-radius);\n  inline-size: 100%;\n  padding: 0 !important;\n  position: relative;\n  flex: 1 0 auto;\n  display: flex;\n  background: var(--input-bg-color);\n  border: var(--input-border-style) var(--input-border-width);\n  font-size: var(--input-font-size);\n  padding-inline-start: calc(var(--input-invalid-border-hint-width) - var(--input-border-width)) !important;\n}\n.form-ctrl__input.sc-nano-input:focus-visible, .form-ctrl__input.sc-nano-input:focus-within, .has-focus.sc-nano-input-h .form-ctrl__input.sc-nano-input {\n  outline: var(--nano-focus-ring-color) solid 3px;\n  outline-offset: -2px;\n}\n.is-invalid.sc-nano-input-h:not([disabled]) .form-ctrl__input.sc-nano-input {\n  border-inline-start: solid var(--color-invalid) var(--input-invalid-border-hint-width);\n  padding-inline-start: 0 !important;\n}\n.is-invalid.has-focus.sc-nano-input-h:not([disabled]) .form-ctrl__input.sc-nano-input {\n  border-color: var(--color-invalid);\n  border-inline-start: solid var(--color-invalid) var(--input-invalid-border-hint-width);\n  padding-inline-start: 0 !important;\n}\n\n.form-ctrl__input-wrap.sc-nano-input {\n  display: flex;\n  flex: 1;\n  max-inline-size: 100%;\n  align-items: center;\n}\n[type=textarea].sc-nano-input-h .form-ctrl__input-wrap.sc-nano-input {\n  align-items: start;\n}\n\n.form-ctrl__clear-btn.sc-nano-input, .form-ctrl__slot-end.sc-nano-input, .form-ctrl__slot-start.sc-nano-input, .form-ctrl__slot-value-end.sc-nano-input {\n  margin-block: 0;\n  margin-inline: 0;\n  font-size: 1em;\n  border: 0;\n  outline: none;\n  background-color: transparent;\n  background-repeat: no-repeat;\n  display: flex;\n  align-items: center;\n  inline-size: auto;\n  padding-inline-end: var(--padding-end);\n  padding-block: var(--padding-top) var(--padding-bottom);\n}\n.form-ctrl__clear-btn.sc-nano-input:empty, .form-ctrl__slot-end.sc-nano-input:empty, .form-ctrl__slot-start.sc-nano-input:empty, .form-ctrl__slot-value-end.sc-nano-input:empty {\n  display: none;\n}\n\n.form-ctrl__slot-end.sc-nano-input {\n  padding-block: calc(var(--padding-top) / 2) calc(var(--padding-bottom) / 2);\n}\n\n.form-ctrl__slot-start.sc-nano-input {\n  padding-inline-end: 0;\n}\n.has-float-label.sc-nano-input .form-ctrl__slot-start.sc-nano-input {\n  display: none;\n}\n\n.form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > *, .form-ctrl__slot-end.sc-nano-input-s > *, .form-ctrl__slot-end .sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input-s > :not(slot-fb), .form-ctrl__slot-value-end .sc-nano-input-s > :not(slot-fb) {\n  padding-inline: unset;\n  align-items: center;\n  display: flex;\n  block-size: 100%;\n  z-index: 1;\n}\n.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > *, .sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-end.sc-nano-input-s > *, .form-ctrl__slot-end .sc-nano-input-s > *, .sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-input-s > :not(slot-fb), .form-ctrl__slot-value-end .sc-nano-input-s > :not(slot-fb) {\n  pointer-events: none;\n}\n\n.form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start.sc-nano-input-s > *, .form-ctrl__slot-start .sc-nano-input-s > * {\n  margin-inline: var(--padding-start) 0;\n}\n\n.form-ctrl__slot-value-end.sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input-s > *, .form-ctrl__slot-value-end .sc-nano-input-s > *, .form-ctrl__slot-value-end.sc-nano-input *.sc-nano-input {\n  pointer-events: none;\n}\n\n.form-ctrl__clear-btn.sc-nano-input {\n  color: var(--clear-btn-color);\n  padding: 0;\n  opacity: 0;\n  inline-size: 0;\n  appearance: none;\n  align-items: center;\n  overflow: hidden;\n  padding-block: var(--padding-top) var(--padding-bottom);\n}\n.is-invalid.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input {\n  color: var(--clear-btn-color--invalid);\n}\n.has-value.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input {\n  padding-inline: 0 var(--padding-end);\n  opacity: 1;\n  inline-size: auto;\n}\n.form-ctrl__clear-btn.sc-nano-input:hover {\n  color: var(--clear-btn-color--hover);\n}\n\n.form-ctrl__validation-icon.sc-nano-input {\n  padding-block: var(--padding-top) var(--padding-bottom);\n  padding-inline-end: var(--padding-end);\n  display: grid;\n  grid-template-areas: "overlay";\n}\n.sc-nano-input-h:not(.is-invalid .form-ctrl__validation-icon.sc-nano-input, .is-valid).sc-nano-input-h .form-ctrl__validation-icon.sc-nano-input {\n  display: none;\n}\n\n.form-ctrl__error-icon.sc-nano-input, .form-ctrl__success-icon.sc-nano-input {\n  color: var(--color-valid);\n  opacity: 0;\n  transition: 0.3s ease-out opacity;\n  grid-area: overlay;\n}\n\n.is-valid.sc-nano-input-h .form-ctrl__success-icon.sc-nano-input {\n  opacity: 1;\n}\n\n.form-ctrl__error-icon.sc-nano-input {\n  color: var(--color-invalid);\n}\n.is-invalid.sc-nano-input-h .form-ctrl__error-icon.sc-nano-input {\n  opacity: 1;\n}\n\n.sc-nano-input-h {\n  \n  --placeholder-color: var(--nano-color-neutral-1000);\n  --padding-top: var(--nano-spacing-sm);\n  --padding-end: var(--nano-spacing-sm);\n  --padding-bottom: var(--nano-spacing-sm);\n  --padding-start: var(--nano-spacing-sm);\n  --color-invalid: var(--nano-color-danger-1100);\n  --color-valid: var(--nano-color-success-1000);\n  --input-font-size: var(--nano-font-size-sm);\n  --input-text-color: var(--nano-color-base-1000);\n  --input-border-width: 1px;\n  --input-border-color: var(--nano-color-neutral-300);\n  --input-border-radius: 0px;\n  --input-invalid-border-hint-width: 2px;\n  --input-border-style: solid var(--input-border-color);\n  --input-border-style--focus: solid var(--input-border-width) var(--nano-color-primary-700);\n  --input-bg-color: var(--nano-color-base-0);\n  --invalid-msg-color: var(--color-invalid);\n  --help-msg-color: var(--nano-color-base-1000);\n  --more-font-size: var(--nano-font-size-2xs);\n  --clear-btn-color: rgb(var(--nano-color-base-rgb-1000) / 60%);\n  --clear-btn-color--hover: rgb(var(--nano-color-base-rgb-1000) / 100%);\n  --clear-btn-color--invalid: rgb(var(--color-invalid) / 100%);\n  --label-color: var(--nano-color-base-1000);\n  --label-font-size: var(--nano-font-size-xs);\n  position: relative;\n  inline-size: 100%;\n  padding: 0 !important;\n  color: currentcolor;\n  display: block;\n}\n\n[type=date].sc-nano-input-h .input__date-trigger.sc-nano-input {\n  color: var(--nano-color-primary-1200);\n}\n[type=date].sc-nano-input-h .input__date-dropdown.sc-nano-input {\n  --overflow: visible;\n}\n[type=date].sc-nano-input-h .input__date-close.sc-nano-input {\n  position: absolute;\n  inset-inline-end: 0;\n  inset-block: 0;\n  opacity: 0;\n  z-index: 2;\n}\n[type=date].sc-nano-input-h .input__date-close.sc-nano-input:focus {\n  opacity: 1;\n}\n@supports selector(::-moz-placeholder) {\n  [type=date].sc-nano-input-h .form-ctrl__input-wrap.sc-nano-input {\n    justify-content: end;\n    min-block-size: 2.5em;\n  }\n  [type=date].sc-nano-input-h .input__native-ctrl.sc-nano-input {\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block-start: 0;\n  }\n  [type=date].sc-nano-input-h .input__date-dropdown.sc-nano-input {\n    background-color: var(--nano-color-base-0);\n  }\n}\n\n.input__native-ctrl.sc-nano-input {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  appearance: none;\n  -webkit-rtl-ordering: logical;\n  padding-block: 0;\n  padding-inline: var(--padding-start) var(--padding-end);\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  inline-size: 100%;\n  max-inline-size: 100%;\n  max-block-size: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  line-height: 2.5em;\n  min-block-size: 2.5em;\n  \n}\n.has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input {\n  line-height: 2.1em;\n  min-block-size: 2.1em;\n  padding-block-start: 1.4em;\n}\n.input__native-ctrl.sc-nano-input::placeholder {\n  color: var(--placeholder-color);\n  font-family: inherit;\n  font-style: initial;\n  font-weight: initial;\n  line-height: inherit;\n  min-block-size: initial;\n}\n.input__native-ctrl.sc-nano-input::-moz-placeholder {\n  line-height: 2.8em;\n  text-overflow: ellipsis;\n}\n.input__native-ctrl.sc-nano-input:-webkit-autofill {\n  background-color: transparent;\n}\n.input__native-ctrl.sc-nano-input::-webkit-search-decoration, .input__native-ctrl.sc-nano-input::-webkit-search-cancel-button, .input__native-ctrl.sc-nano-input::-webkit-search-results-button, .input__native-ctrl.sc-nano-input::-webkit-search-results-decoration {\n  appearance: none;\n}\n.input__native-ctrl.sc-nano-input::-webkit-calendar-picker-indicator {\n  display: none;\n}\n.input__native-ctrl.sc-nano-input::-webkit-datetime-edit {\n  display: block;\n  padding: 0;\n}\n.input__native-ctrl.sc-nano-input:invalid {\n  box-shadow: none;\n}\n.input__native-ctrl.sc-nano-input::-ms-clear, .input__native-ctrl.sc-nano-input::-ms-reveal {\n  display: none;\n}\n.input__native-ctrl.input__resizable.sc-nano-input {\n  resize: vertical;\n  overflow: auto;\n}\n.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input {\n  line-height: 1.5em;\n  padding-block: calc(var(--padding-top) - 3px) 0.5em;\n  white-space: pre-wrap;\n}\n.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::placeholder {\n  line-height: 1.5em;\n}\n.has-float-label.sc-nano-input .form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input {\n  padding-block-start: 1.75em;\n}\n[readonly].sc-nano-input-h:not([readonly=false]) .input__native-ctrl.sc-nano-input {\n  -webkit-user-select: none;\n          user-select: none;\n}';export{I as nano_date_picker,L as nano_input}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as e,a as i}from"./index-DgO0qeQ9.js";import{h as n}from"./renderer-T8etwwhk.js";import{H as a}from"./slot-ncg8_2lY.js";import"./dom-CrrHp_I_.js";const o=class{constructor(i){t(this,i),this.nanoOpen=e(this,"nanoOpen",7),this.nanoClose=e(this,"nanoClose",7),this.nanoAfterOpen=e(this,"nanoAfterOpen",7),this.nanoAfterClose=e(this,"nanoAfterClose",7)}mo;stateChanging=!1;slotCtrl=new a(this,"icon-start","icon-end","icon-collapse","icon-expand");detailsEl;headerEl;_bodyEl;get bodyEl(){return this._bodyEl}set bodyEl(t){this.bodyEl&&this.bodyEl===this._bodyEl||(this.bodyEl&&this.bodyEl.removeEventListener("transitionend",this.handleTransitionEnd),t.addEventListener("transitionend",this.handleTransitionEnd),this._bodyEl=t)}label="";open=!1;disabled=!1;size="medium";nanoOpen;nanoClose;nanoAfterOpen;nanoAfterClose;toggleClick(){this.stateChanging=!0,this.open?this.show():this.hide()}onKeyDown=t=>{if(!this.stateChanging&&!this.disabled)switch(t.key){case"Enter":case" ":t.preventDefault(),this.open=!this.open;break;case"ArrowUp":case"ArrowLeft":t.preventDefault(),this.open=!1;break;case"ArrowDown":case"ArrowRight":t.preventDefault(),this.open=!0}};onMouseDown=t=>{t.preventDefault(),this.headerEl.focus(),this.stateChanging||this.disabled||(this.open=!this.open)};handleTransitionEnd=t=>{"opacity"===t.propertyName&&t.composedPath().find((t=>t===this.bodyEl))&&(this.open?(this.nanoAfterOpen.emit(),requestAnimationFrame((()=>this.stateChanging=!1))):(this.detailsEl.open=!1,this.nanoAfterClose.emit(),requestAnimationFrame((()=>this.stateChanging=!1))))};hide(){if(this.nanoClose.emit(this.open).defaultPrevented)return this.open=!0,void(this.detailsEl.open=!0)}show(){const t=this.nanoOpen.emit();if(this.detailsEl.open=!0,t.defaultPrevented)return this.open=!1,void(this.detailsEl.open=!1)}attachMo(){!this.mo&&this.detailsEl&&(this.mo=new MutationObserver((t=>{if(!this.stateChanging)for(const e of t)"attributes"===e.type&&"open"===e.attributeName&&(this.open=this.detailsEl.open)})),this.mo.observe(this.detailsEl,{attributes:!0}))}componentDidLoad(){this.open&&this.detailsEl.setAttribute("open","true"),this.attachMo()}connectedCallback(){this.bodyEl&&this.bodyEl.addEventListener("transitionend",this.handleTransitionEnd),this.attachMo()}disconnectedCallback(){this.mo&&(this.mo.disconnect(),this.mo=void 0),this.bodyEl&&this.bodyEl.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return n(i,{key:"4109b3670c8ccd41ddac5eb03e799e1c149ad7c8",class:"nano-details"},n("details",{key:"6af0af31042e2bb156e835604b4f79edad79b7ce",part:"base",ref:t=>this.detailsEl=t,class:{details:!0,disabled:this.disabled}},n("summary",{key:"6589a9dd56e93246177f8c7b6f5e46f279e661c1",part:"header","aria-controls":"content","aria-expanded":this.open?"true":"false","aria-disabled":this.disabled?"true":"false",tabindex:this.disabled?"-1":"0",id:"header",role:"button",class:"header",ref:t=>this.headerEl=t,onKeyDown:this.onKeyDown,onClick:this.onMouseDown},this.slotCtrl.has("icon-start")&&n("span",{key:"7d794f0724f7c43bf4747edd1e402be32ec28129",part:"icon icon--start",class:"icon icon--start"},n("slot",{key:"4e55292c3018d9bbcb4b65e2f69002bf0cb5ae43",name:"icon-start"})),n("div",{key:"d3ab36f253ae4f062fe2aa998c483648b382b7ca",part:"label",class:"label"},this.label?this.label:n("slot",{name:"label"})),n("span",{key:"6bd0a9630c2d657915811164bdcbf0696609d4e5",part:"icon icon--end",class:"icon icon--end"},n("slot",this.open?{name:"icon-collapse"}:{name:"icon-expand"}),n("slot",{key:"b38f81f25f6d224da5afa1d701621993dba3d723",name:"icon-end"},!this.slotCtrl.has("icon-start")&&!this.slotCtrl.has("icon-end")&&!this.slotCtrl.has("icon-expand")&&!this.slotCtrl.has("icon-collapse")&&n("nano-icon",{key:"be8d56737badde36a3a88f797f411065e5a59ae4",class:"default-icon",name:"light/chevron-down"})))),n("div",{key:"90d0bba50dc77e45c5861ac74188aba8005980fc",part:"body",class:"body",ref:t=>this.bodyEl=t,role:"region","aria-labelledby":"header"},n("div",{key:"ecc6e416fb9bc20d0d2feb99c7ed899104338c1e",class:"content-wrapper"},n("div",{key:"18115d6264604535817c700ab7eea7265f4d7b3b",part:"content",class:"content",id:"content"},n("slot",{key:"bfdb6bda88ba909bbedec0e000b6fef5c1d1895c"}))))))}static get watchers(){return{open:["toggleClick"]}}};o.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{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;--padding:var(--nano-spacing-md);--btn-padding:var(--padding);--btn-bg-color:transparent;--btn-bg-color--hover:var(--nano-color-primary-100);--btn-bg-color--active:var(--nano-color-primary-300);--content-padding:var(--padding);display:block;border:1px solid var(--nano-color-neutral-300);color:var(--nano-color-neutral-1400)}:host([size=small]){--padding:var(--nano-spacing-sm) 0.9375rem}:host([size=large]){--padding:var(--nano-spacing-l)}:host([size=large]) .header{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-lg);line-height:var(--nano-line-height-dense);text-wrap:balance}:host([disabled]){opacity:0.5}.header{all:unset;cursor:pointer;padding:var(--btn-padding);position:relative;display:flex;flex-wrap:wrap;align-items:center;background:var(--btn-bg-color);color:inherit;font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-md);line-height:var(--nano-line-height-dense);text-wrap:balance}.header::-webkit-details-marker{display:none}.header:focus{outline:none}.header:not([aria-disabled=true]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.header:not([aria-disabled=true]):hover{background:var(--btn-bg-color--hover)}.header:not([aria-disabled=true]):active{background:var(--btn-bg-color--active)}.disabled .header{cursor:not-allowed}.header .label{inline-size:100%;max-inline-size:100%;max-block-size:100%;flex:1;display:inline-block}.header .icon{line-height:0;flex-direction:column;justify-content:center;display:inline-block;color:var(--nano-color-primary-1200)}.header .icon .default-icon{rotate:0deg;transform-origin:center;transition:var(--nano-transition-x-fast) ease rotate}:host([open]) .header .icon .default-icon{rotate:180deg}.header .icon--start{margin-inline:0 var(--btn-padding);margin-block:0}.header .icon--end{margin-inline:var(--btn-padding) 0;margin-block:0}.header .icon ::slotted(.nano-icon),.header .icon::slotted(.nano-icon){color:currentcolor;transition:var(--nano-transition-x-fast) ease rotate;transform-origin:center}.body{display:grid;grid-template-rows:0fr;transition:all var(--nano-transition-fast) ease-out;opacity:0}:host([open]) .body{grid-template-rows:1fr;opacity:1}.content-wrapper{overflow:hidden}.content{padding:var(--content-padding)}";export{o as nano_details}
+import{r as t,c as e,a as i}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";import{H as a}from"./slot-CFTP7C_Z.js";import"./dom-dlicJTEJ.js";const o=class{constructor(i){t(this,i),this.nanoOpen=e(this,"nanoOpen",7),this.nanoClose=e(this,"nanoClose",7),this.nanoAfterOpen=e(this,"nanoAfterOpen",7),this.nanoAfterClose=e(this,"nanoAfterClose",7)}mo;stateChanging=!1;slotCtrl=new a(this,"icon-start","icon-end","icon-collapse","icon-expand");detailsEl;headerEl;_bodyEl;get bodyEl(){return this._bodyEl}set bodyEl(t){this.bodyEl&&this.bodyEl===this._bodyEl||(this.bodyEl&&this.bodyEl.removeEventListener("transitionend",this.handleTransitionEnd),t.addEventListener("transitionend",this.handleTransitionEnd),this._bodyEl=t)}label="";open=!1;disabled=!1;size="medium";nanoOpen;nanoClose;nanoAfterOpen;nanoAfterClose;toggleClick(){this.stateChanging=!0,this.open?this.show():this.hide()}onKeyDown=t=>{if(!this.stateChanging&&!this.disabled)switch(t.key){case"Enter":case" ":t.preventDefault(),this.open=!this.open;break;case"ArrowUp":case"ArrowLeft":t.preventDefault(),this.open=!1;break;case"ArrowDown":case"ArrowRight":t.preventDefault(),this.open=!0}};onMouseDown=t=>{t.preventDefault(),this.headerEl.focus(),this.stateChanging||this.disabled||(this.open=!this.open)};handleTransitionEnd=t=>{"opacity"===t.propertyName&&t.composedPath().find((t=>t===this.bodyEl))&&(this.open?(this.nanoAfterOpen.emit(),requestAnimationFrame((()=>this.stateChanging=!1))):(this.detailsEl.open=!1,this.nanoAfterClose.emit(),requestAnimationFrame((()=>this.stateChanging=!1))))};hide(){if(this.nanoClose.emit(this.open).defaultPrevented)return this.open=!0,void(this.detailsEl.open=!0)}show(){const t=this.nanoOpen.emit();if(this.detailsEl.open=!0,t.defaultPrevented)return this.open=!1,void(this.detailsEl.open=!1)}attachMo(){!this.mo&&this.detailsEl&&(this.mo=new MutationObserver((t=>{if(!this.stateChanging)for(const e of t)"attributes"===e.type&&"open"===e.attributeName&&(this.open=this.detailsEl.open)})),this.mo.observe(this.detailsEl,{attributes:!0}))}componentDidLoad(){this.open&&this.detailsEl.setAttribute("open","true"),this.attachMo()}connectedCallback(){this.bodyEl&&this.bodyEl.addEventListener("transitionend",this.handleTransitionEnd),this.attachMo()}disconnectedCallback(){this.mo&&(this.mo.disconnect(),this.mo=void 0),this.bodyEl&&this.bodyEl.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return n(i,{key:"4109b3670c8ccd41ddac5eb03e799e1c149ad7c8",class:"nano-details"},n("details",{key:"6af0af31042e2bb156e835604b4f79edad79b7ce",part:"base",ref:t=>this.detailsEl=t,class:{details:!0,disabled:this.disabled}},n("summary",{key:"6589a9dd56e93246177f8c7b6f5e46f279e661c1",part:"header","aria-controls":"content","aria-expanded":this.open?"true":"false","aria-disabled":this.disabled?"true":"false",tabindex:this.disabled?"-1":"0",id:"header",role:"button",class:"header",ref:t=>this.headerEl=t,onKeyDown:this.onKeyDown,onClick:this.onMouseDown},this.slotCtrl.has("icon-start")&&n("span",{key:"7d794f0724f7c43bf4747edd1e402be32ec28129",part:"icon icon--start",class:"icon icon--start"},n("slot",{key:"4e55292c3018d9bbcb4b65e2f69002bf0cb5ae43",name:"icon-start"})),n("div",{key:"d3ab36f253ae4f062fe2aa998c483648b382b7ca",part:"label",class:"label"},this.label?this.label:n("slot",{name:"label"})),n("span",{key:"6bd0a9630c2d657915811164bdcbf0696609d4e5",part:"icon icon--end",class:"icon icon--end"},n("slot",this.open?{name:"icon-collapse"}:{name:"icon-expand"}),n("slot",{key:"b38f81f25f6d224da5afa1d701621993dba3d723",name:"icon-end"},!this.slotCtrl.has("icon-start")&&!this.slotCtrl.has("icon-end")&&!this.slotCtrl.has("icon-expand")&&!this.slotCtrl.has("icon-collapse")&&n("nano-icon",{key:"be8d56737badde36a3a88f797f411065e5a59ae4",class:"default-icon",name:"light/chevron-down"})))),n("div",{key:"90d0bba50dc77e45c5861ac74188aba8005980fc",part:"body",class:"body",ref:t=>this.bodyEl=t,role:"region","aria-labelledby":"header"},n("div",{key:"ecc6e416fb9bc20d0d2feb99c7ed899104338c1e",class:"content-wrapper"},n("div",{key:"18115d6264604535817c700ab7eea7265f4d7b3b",part:"content",class:"content",id:"content"},n("slot",{key:"bfdb6bda88ba909bbedec0e000b6fef5c1d1895c"}))))))}static get watchers(){return{open:["toggleClick"]}}};o.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{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;--padding:var(--nano-spacing-md);--btn-padding:var(--padding);--btn-bg-color:transparent;--btn-bg-color--hover:var(--nano-color-primary-100);--btn-bg-color--active:var(--nano-color-primary-300);--content-padding:var(--padding);display:block;border:1px solid var(--nano-color-neutral-300);color:var(--nano-color-neutral-1400)}:host([size=small]){--padding:var(--nano-spacing-sm) 0.9375rem}:host([size=large]){--padding:var(--nano-spacing-l)}:host([size=large]) .header{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-lg);line-height:var(--nano-line-height-dense);text-wrap:balance}:host([disabled]){opacity:0.5}.header{all:unset;cursor:pointer;padding:var(--btn-padding);position:relative;display:flex;flex-wrap:wrap;align-items:center;background:var(--btn-bg-color);color:inherit;font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-md);line-height:var(--nano-line-height-dense);text-wrap:balance}.header::-webkit-details-marker{display:none}.header:focus{outline:none}.header:not([aria-disabled=true]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.header:not([aria-disabled=true]):hover{background:var(--btn-bg-color--hover)}.header:not([aria-disabled=true]):active{background:var(--btn-bg-color--active)}.disabled .header{cursor:not-allowed}.header .label{inline-size:100%;max-inline-size:100%;max-block-size:100%;flex:1;display:inline-block}.header .icon{line-height:0;flex-direction:column;justify-content:center;display:inline-block;color:var(--nano-color-primary-1200)}.header .icon .default-icon{rotate:0deg;transform-origin:center;transition:var(--nano-transition-x-fast) ease rotate}:host([open]) .header .icon .default-icon{rotate:180deg}.header .icon--start{margin-inline:0 var(--btn-padding);margin-block:0}.header .icon--end{margin-inline:var(--btn-padding) 0;margin-block:0}.header .icon ::slotted(.nano-icon),.header .icon::slotted(.nano-icon){color:currentcolor;transition:var(--nano-transition-x-fast) ease rotate;transform-origin:center}.body{display:grid;grid-template-rows:0fr;transition:all var(--nano-transition-fast) ease-out;opacity:0}:host([open]) .body{grid-template-rows:1fr;opacity:1}.content-wrapper{overflow:hidden}.content{padding:var(--content-padding)}";export{o as nano_details}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as a,c as o,g as i,a as t}from"./index-DgO0qeQ9.js";import{h as e}from"./renderer-T8etwwhk.js";import{M as n}from"./modal-CYo2pVRA.js";import{l as s,u as r}from"./scroll-DtQwV9-u.js";import{H as d}from"./slot-ncg8_2lY.js";import{C as l}from"./component-store-DeKxotC5.js";import{g as h}from"./tabbable-DbW4RUw6.js";import"./dom-CrrHp_I_.js";import"./throttle-C93FMm2Z.js";let c=0;const b=class{constructor(i){a(this,i),this.nanoShow=o(this,"nanoShow",7),this.nanoAfterShow=o(this,"nanoAfterShow",7),this.nanoHide=o(this,"nanoHide",7),this.nanoAfterHide=o(this,"nanoAfterHide",7),this.nanoInitialFocus=o(this,"nanoInitialFocus",7),this.nanoRequestClose=o(this,"nanoRequestClose",7)}componentId="dialog-"+ ++c;modal;willShow=!1;willHide=!1;originalTrigger;overlay;dialog;slotCtrl=new d(this,"footer");get panel(){return this._panel}set panel(a){this._panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd),a.addEventListener("transitionend",this.handleTransitionEnd),this._panel=a}_panel;get host(){return i(this)}noDismiss=!1;hidden=!0;showRibbon=!0;open=!1;handleOpenChange(){this.open?this.show():this.hide()}label;noHeader=!1;noUserDismiss=!1;storeId;storeMethod="url-hash";hoist=!1;handleHoistChange(){"popover"in globalThis.HTMLElement.prototype||!this.hoist||Array.from(document.body.children).includes(this.host)||document.body.prepend(this.host)}nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;nanoInitialFocus;nanoRequestClose;async show(){if(this.willShow)return;if(this.nanoShow.emit().defaultPrevented)return void(this.open=!1);this.dialog&&(this.dialog.hidden=!1),this.originalTrigger=document.activeElement,this.willShow=!0,this.hidden=!1,this.open=!0,this.modal.activate(),"function"==typeof this.dialog?.showPopover&&this.dialog.showPopover(),s(this.host);const a=this.host.querySelector("[autofocus]");a&&a.removeAttribute("autofocus"),this.host.addEventListener("nanoAfterShow",(()=>{this.nanoInitialFocus.emit().defaultPrevented||(a||h(this.host,!0,!0,!0)[0]||this.panel).focus({preventScroll:!0})}),{once:!0})}async hide(){if(this.willHide)return;if(this.nanoHide.emit().defaultPrevented)return void(this.open=!0);this.willHide=!0,this.open=!1,this.modal.deactivate(),this.stopVideos();const a=this.originalTrigger;a&&(a.setFocus&&"function"==typeof a.setFocus?a.setFocus():a.focus()),setTimeout((()=>{this.open||"function"!=typeof this.dialog?.hidePopover||this.dialog.hidePopover(),r(this.host)}),300)}handleKeyDown=a=>{"Escape"===a.key&&this.requestClose()};requestClose=()=>{this.nanoRequestClose.emit().defaultPrevented||this.noUserDismiss?(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250)):this.hide()};handleTransitionEnd=a=>{"opacity"===a.propertyName&&a.composedPath().find((a=>a===this.panel||a===this.overlay))&&(this.willShow=!1,this.willHide=!1,this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit(),this.open||(this.dialog.hidden=!0,this.hidden=!0))};stopVideos(){Array.from(this.host.querySelectorAll("iframe,video")).forEach((a=>{"video"===a.tagName.toLowerCase()?a.pause():a.src=a.src}))}connectedCallback(){this.handleHoistChange(),this.modal=new n(this.host)}componentWillLoad(){this.storeId&&l.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){this.dialog.hidden=!this.open,this.open&&(this.show(),this.nanoAfterShow.emit())}disconnectedCallback(){r(this.host),this.panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return e(t,{key:"b6ba3eea63e7aee1da10dca2a653a6c9f7d66266",class:"nano-dialog"},e("div",{key:"8ac30cda032a4fbc89b432f16ce3e9adb88ca68e",part:"base",class:{dialog:!0,"dialog--open":this.open,"dialog--has-footer":this.slotCtrl.has("footer"),"dialog--has-header":!this.noHeader,"dialog--nodismiss":this.noDismiss,"dialog--with-ribbon":this.showRibbon},onKeyDown:this.handleKeyDown,ref:a=>this.dialog=a,popover:"manual"},e("div",{key:"4d2cde77fa9c8796daa2591eb425d1694f211d90",part:"overlay",class:"dialog__overlay",ref:a=>this.overlay=a,onClick:this.requestClose}),e("div",{key:"a99ea663fbb2560aaa8f49f23325a661f96dece6",ref:a=>this.panel=a,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.hidden?"true":"false","aria-label":this.noHeader?this.label:null,"aria-labelledby":this.noHeader?null:`${this.componentId}-title`,tabIndex:-1},e("div",{key:"0e0bab9c4307d64cd9d7deb14603d1a5e1f9d27c",class:"dialog__body-wrap"},!this.noHeader&&e("nano-sticker",{key:"6f1ea1f827d3a18622515f57b5c55d9cb4daa8a0"},e("header",{key:"d1cb39f7c1878810f85c7641fdae2217180327b3",part:"header",class:"dialog__header"},e("span",{key:"7f0ac92358b64688eca01979fd68a665802636d6",part:"title",class:"dialog__title",id:`${this.componentId}-title`},e("slot",{key:"9b53b34fa5f815a46e9bbd961acecbe592b14cb5",name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&e("nano-icon-button",{key:"4b110b4b490ede1f757046d252de8e2015f50d6e",part:"close-button",exportparts:"base:close-button__base",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/xmark"}))),e("div",{key:"f2225d9d4753b91afd697466b897e20441704f82",part:"body",class:"dialog__body"},e("slot",{key:"1bc02a8964d47650a45dd047bac390615823b176"})),this.slotCtrl.has("footer")&&e("nano-sticker",{key:"9cca925aa007316b93475d54194278ee69fcfdd6",position:"bottom"},e("footer",{key:"8b1b57752c43c3e010361c90da2cd3e647243828",part:"footer",class:"dialog__footer"},e("slot",{key:"3fdf3ec86fb5efd8a97a8ddee887dac53d3f58be",name:"footer"})))))))}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};b.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:0;--content-background:var(--nano-color-surface-300);--footer-content:var(--nano-color-neutral-75);--scrim-color:var(--nano-overlay-background-color);--box-shadow:var(--nano-shadow-l3);--close-button-color:var(--nano-color-primary-1200);--width:50rem;--height:auto;--body-padding-v:var(--nano-spacing-l1-default);--body-padding-h:var(--nano-spacing-l1-default);--header-padding-v:var(--nano-spacing-l);--header-padding-h:var(--nano-spacing-l1-default);--footer-padding-v:var(--nano-spacing-l);--footer-padding-h:var(--nano-spacing-l1-default)}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:var(--nano-z-index-modal);border:none;inline-size:unset;block-size:unset;color:unset;background-color:unset}.dialog::backdrop{display:none}.dialog__panel{display:flex;flex-direction:column;z-index:2;inline-size:var(--width);block-size:var(--height);max-inline-size:calc(100% - (var(--nano-spacing-xl) + var(--nano-scroll-lock-size)));max-block-size:calc(92vh - var(--nano-spacing-xl));background-color:var(--content-background);border-radius:var(--border-radius);box-shadow:var(--box-shadow);opacity:0;transform:scale(0.8);transition:var(--nano-transition-fast) opacity, var(--nano-transition-fast) transform}.dialog__panel:focus{outline:none}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog--nodismiss .dialog__panel{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.dialog__header{flex:0 0 auto;display:flex;inline-size:100%;background-color:var(--content-background);border-radius:var(--border-radius) var(--border-radius) 0 0;transition:var(--nano-transition-x-fast) box-shadow;min-inline-size:auto;padding-block:var(--header-padding-v);padding-inline:var(--header-padding-h)}[stuck] .dialog__header{box-shadow:var(--nano-shadow-l0)}.dialog__title{flex:1 1 auto;font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-xl);line-height:var(--nano-line-height-denser);text-wrap:balance}.dialog__close-icon{flex:0 0 auto;display:flex;align-items:center;font-size:1.375rem;position:relative;inset-inline-end:calc(var(--nano-spacing-l1-default) / 2 * -1);--color:var(--close-button-color)}.dialog__body-wrap{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:var(--border-radius)}.dialog:not(.dialog--has-header) .dialog__body-wrap{border-start-start-radius:0;border-start-end-radius:0;border-end-start-radius:inherit;border-end-end-radius:inherit}.dialog:not(.dialog--has-footer) .dialog__body-wrap{border-start-start-radius:inherit;border-start-end-radius:inherit;border-end-start-radius:0;border-end-end-radius:0}.dialog__body{padding-block:0 var(--body-padding-v);padding-inline:var(--body-padding-h)}.dialog:not(.dialog--has-header) .dialog__body{padding-block-start:var(--body-padding-v)}.dialog__body ::slotted(*){max-inline-size:100%}.dialog__footer{inline-size:100%;padding-block:var(--footer-padding-v);padding-inline:var(--footer-padding-h);background:var(--footer-content);border-radius:0 0 var(--border-radius) var(--border-radius);position:relative;inset-block-start:1px;min-inline-size:auto;border-block-start:1px solid var(--nano-color-neutral-300);gap:var(--nano-spacing-md);display:inline-flex}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__overlay{position:fixed;inset:0 !important;background-color:var(--scrim-color);opacity:0;transition:var(--nano-transition-fast) opacity}.dialog--open .dialog__overlay{opacity:1}";export{b as nano_dialog}
+import{r as a,c as o,g as i,a as t}from"./index-BM3Om9WE.js";import{h as e}from"./renderer-BaP2L8CT.js";import{M as n}from"./modal-CY_3_LJ7.js";import{l as s,u as r}from"./scroll-1nFw8CNk.js";import{H as d}from"./slot-CFTP7C_Z.js";import{C as l}from"./component-store-JYVuxwvK.js";import{g as h}from"./tabbable-BgopY-vd.js";import"./dom-dlicJTEJ.js";import"./throttle-C93FMm2Z.js";let c=0;const b=class{constructor(i){a(this,i),this.nanoShow=o(this,"nanoShow",7),this.nanoAfterShow=o(this,"nanoAfterShow",7),this.nanoHide=o(this,"nanoHide",7),this.nanoAfterHide=o(this,"nanoAfterHide",7),this.nanoInitialFocus=o(this,"nanoInitialFocus",7),this.nanoRequestClose=o(this,"nanoRequestClose",7)}componentId="dialog-"+ ++c;modal;willShow=!1;willHide=!1;originalTrigger;overlay;dialog;slotCtrl=new d(this,"footer");get panel(){return this._panel}set panel(a){this._panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd),a.addEventListener("transitionend",this.handleTransitionEnd),this._panel=a}_panel;get host(){return i(this)}noDismiss=!1;hidden=!0;showRibbon=!0;open=!1;handleOpenChange(){this.open?this.show():this.hide()}label;noHeader=!1;noUserDismiss=!1;storeId;storeMethod="url-hash";hoist=!1;handleHoistChange(){"popover"in globalThis.HTMLElement.prototype||!this.hoist||Array.from(document.body.children).includes(this.host)||document.body.prepend(this.host)}nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;nanoInitialFocus;nanoRequestClose;async show(){if(this.willShow)return;if(this.nanoShow.emit().defaultPrevented)return void(this.open=!1);this.dialog&&(this.dialog.hidden=!1),this.originalTrigger=document.activeElement,this.willShow=!0,this.hidden=!1,this.open=!0,this.modal.activate(),"function"==typeof this.dialog?.showPopover&&this.dialog.showPopover(),s(this.host);const a=this.host.querySelector("[autofocus]");a&&a.removeAttribute("autofocus"),this.host.addEventListener("nanoAfterShow",(()=>{this.nanoInitialFocus.emit().defaultPrevented||(a||h(this.host,!0,!0,!0)[0]||this.panel).focus({preventScroll:!0})}),{once:!0})}async hide(){if(this.willHide)return;if(this.nanoHide.emit().defaultPrevented)return void(this.open=!0);this.willHide=!0,this.open=!1,this.modal.deactivate(),this.stopVideos();const a=this.originalTrigger;a&&(a.setFocus&&"function"==typeof a.setFocus?a.setFocus():a.focus()),setTimeout((()=>{this.open||"function"!=typeof this.dialog?.hidePopover||this.dialog.hidePopover(),r(this.host)}),300)}handleKeyDown=a=>{"Escape"===a.key&&this.requestClose()};requestClose=()=>{this.nanoRequestClose.emit().defaultPrevented||this.noUserDismiss?(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250)):this.hide()};handleTransitionEnd=a=>{"opacity"===a.propertyName&&a.composedPath().find((a=>a===this.panel||a===this.overlay))&&(this.willShow=!1,this.willHide=!1,this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit(),this.open||(this.dialog.hidden=!0,this.hidden=!0))};stopVideos(){Array.from(this.host.querySelectorAll("iframe,video")).forEach((a=>{"video"===a.tagName.toLowerCase()?a.pause():a.src=a.src}))}connectedCallback(){this.handleHoistChange(),this.modal=new n(this.host)}componentWillLoad(){this.storeId&&l.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){this.dialog.hidden=!this.open,this.open&&(this.show(),this.nanoAfterShow.emit())}disconnectedCallback(){r(this.host),this.panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return e(t,{key:"b6ba3eea63e7aee1da10dca2a653a6c9f7d66266",class:"nano-dialog"},e("div",{key:"8ac30cda032a4fbc89b432f16ce3e9adb88ca68e",part:"base",class:{dialog:!0,"dialog--open":this.open,"dialog--has-footer":this.slotCtrl.has("footer"),"dialog--has-header":!this.noHeader,"dialog--nodismiss":this.noDismiss,"dialog--with-ribbon":this.showRibbon},onKeyDown:this.handleKeyDown,ref:a=>this.dialog=a,popover:"manual"},e("div",{key:"4d2cde77fa9c8796daa2591eb425d1694f211d90",part:"overlay",class:"dialog__overlay",ref:a=>this.overlay=a,onClick:this.requestClose}),e("div",{key:"a99ea663fbb2560aaa8f49f23325a661f96dece6",ref:a=>this.panel=a,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.hidden?"true":"false","aria-label":this.noHeader?this.label:null,"aria-labelledby":this.noHeader?null:`${this.componentId}-title`,tabIndex:-1},e("div",{key:"0e0bab9c4307d64cd9d7deb14603d1a5e1f9d27c",class:"dialog__body-wrap"},!this.noHeader&&e("nano-sticker",{key:"6f1ea1f827d3a18622515f57b5c55d9cb4daa8a0"},e("header",{key:"d1cb39f7c1878810f85c7641fdae2217180327b3",part:"header",class:"dialog__header"},e("span",{key:"7f0ac92358b64688eca01979fd68a665802636d6",part:"title",class:"dialog__title",id:`${this.componentId}-title`},e("slot",{key:"9b53b34fa5f815a46e9bbd961acecbe592b14cb5",name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&e("nano-icon-button",{key:"4b110b4b490ede1f757046d252de8e2015f50d6e",part:"close-button",exportparts:"base:close-button__base",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/xmark"}))),e("div",{key:"f2225d9d4753b91afd697466b897e20441704f82",part:"body",class:"dialog__body"},e("slot",{key:"1bc02a8964d47650a45dd047bac390615823b176"})),this.slotCtrl.has("footer")&&e("nano-sticker",{key:"9cca925aa007316b93475d54194278ee69fcfdd6",position:"bottom"},e("footer",{key:"8b1b57752c43c3e010361c90da2cd3e647243828",part:"footer",class:"dialog__footer"},e("slot",{key:"3fdf3ec86fb5efd8a97a8ddee887dac53d3f58be",name:"footer"})))))))}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};b.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:0;--content-background:var(--nano-color-surface-300);--footer-content:var(--nano-color-neutral-75);--scrim-color:var(--nano-overlay-background-color);--box-shadow:var(--nano-shadow-l3);--close-button-color:var(--nano-color-primary-1200);--width:50rem;--height:auto;--body-padding-v:var(--nano-spacing-l1-default);--body-padding-h:var(--nano-spacing-l1-default);--header-padding-v:var(--nano-spacing-l);--header-padding-h:var(--nano-spacing-l1-default);--footer-padding-v:var(--nano-spacing-l);--footer-padding-h:var(--nano-spacing-l1-default)}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:var(--nano-z-index-modal);border:none;inline-size:unset;block-size:unset;color:unset;background-color:unset}.dialog::backdrop{display:none}.dialog__panel{display:flex;flex-direction:column;z-index:2;inline-size:var(--width);block-size:var(--height);max-inline-size:calc(100% - (var(--nano-spacing-xl) + var(--nano-scroll-lock-size)));max-block-size:calc(92vh - var(--nano-spacing-xl));background-color:var(--content-background);border-radius:var(--border-radius);box-shadow:var(--box-shadow);opacity:0;transform:scale(0.8);transition:var(--nano-transition-fast) opacity, var(--nano-transition-fast) transform}.dialog__panel:focus{outline:none}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog--nodismiss .dialog__panel{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.dialog__header{flex:0 0 auto;display:flex;inline-size:100%;background-color:var(--content-background);border-radius:var(--border-radius) var(--border-radius) 0 0;transition:var(--nano-transition-x-fast) box-shadow;min-inline-size:auto;padding-block:var(--header-padding-v);padding-inline:var(--header-padding-h)}[stuck] .dialog__header{box-shadow:var(--nano-shadow-l0)}.dialog__title{flex:1 1 auto;font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-xl);line-height:var(--nano-line-height-denser);text-wrap:balance}.dialog__close-icon{flex:0 0 auto;display:flex;align-items:center;font-size:1.375rem;position:relative;inset-inline-end:calc(var(--nano-spacing-l1-default) / 2 * -1);--color:var(--close-button-color)}.dialog__body-wrap{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:var(--border-radius)}.dialog:not(.dialog--has-header) .dialog__body-wrap{border-start-start-radius:0;border-start-end-radius:0;border-end-start-radius:inherit;border-end-end-radius:inherit}.dialog:not(.dialog--has-footer) .dialog__body-wrap{border-start-start-radius:inherit;border-start-end-radius:inherit;border-end-start-radius:0;border-end-end-radius:0}.dialog__body{padding-block:0 var(--body-padding-v);padding-inline:var(--body-padding-h)}.dialog:not(.dialog--has-header) .dialog__body{padding-block-start:var(--body-padding-v)}.dialog__body ::slotted(*){max-inline-size:100%}.dialog__footer{inline-size:100%;padding-block:var(--footer-padding-v);padding-inline:var(--footer-padding-h);background:var(--footer-content);border-radius:0 0 var(--border-radius) var(--border-radius);position:relative;inset-block-start:1px;min-inline-size:auto;border-block-start:1px solid var(--nano-color-neutral-300);gap:var(--nano-spacing-md);display:inline-flex}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__overlay{position:fixed;inset:0 !important;background-color:var(--scrim-color);opacity:0;transition:var(--nano-transition-fast) opacity}.dialog--open .dialog__overlay{opacity:1}";export{b as nano_dialog}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as i,g as o,a as e}from"./index-DgO0qeQ9.js";import{f as n,g as s}from"./active-element-CKJIkX0R.js";import{P as a}from"./popover-CWVbjtKn.js";import{a as r,g as h}from"./tabbable-DbW4RUw6.js";import{t as d,h as l}from"./renderer-T8etwwhk.js";import{g as p}from"./dom-CrrHp_I_.js";import{g as c}from"./slot-ncg8_2lY.js";let m=0;const u=class{constructor(o){t(this,o),this.nanoShow=i(this,"nanoShow",7),this.nanoAfterShow=i(this,"nanoAfterShow",7),this.nanoHide=i(this,"nanoHide",7),this.nanoAfterHide=i(this,"nanoAfterHide",7)}dropdownId="dropdown-"+m++;labelId=this.dropdownId+"-title";ignoreOpenWatcher=!1;panel;popover;trigger;positioner;accessibleTrigger;didLoad=!1;focusFirstEle=!0;get menu(){return this.host.querySelector(d("nano-menu"))}get host(){return o(this)}autoOpen=!0;open=!1;handleOpenChange(){this.ignoreOpenWatcher||(this.open?this.show():this.hide(),this.accessibleTrigger?this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString()):this.updateAccessibleTrigger())}closeOnSelect=!0;containingElement;tetherTo=null;handleTetherToChange(){this.createPopover(),this.updateAccessibleTrigger()}placement="bottom-start";distance=5;skidding=0;hoist=!1;handlePopoverOptionsChange(){this.popover&&this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})}dialogTitle;nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;eventType;secondaryOpen(t){t.detail.secondaryMenu&&(t.stopPropagation(),this.panel.classList.add("loading"),this.panel.addEventListener("transitionend",(()=>{this.panel.classList.remove("loading")}),{once:!0}),this.panel.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px")}secondaryClose(t){t.detail.secondaryMenu&&(t.stopPropagation(),t.target.parentElement&&(this.panel.style.minHeight=t.target.parentElement.scrollHeight+"px"))}handlePanelSelect(t){this.closeOnSelect&&t.target.tagName.toLowerCase()===d("nano-menu")&&this.hide()}async show(){if(this.ignoreOpenWatcher=!0,this.open=!0,this.nanoShow.emit().defaultPrevented)return this.open=!1,void(this.ignoreOpenWatcher=!1);"function"==typeof this.positioner?.showPopover?(this.hoist=!0,this.popover.show(),this.positioner.showPopover()):this.popover.show(),this.ignoreOpenWatcher=!1,document.addEventListener("mousedown",this.handleDocumentMouseDown),document.addEventListener("keydown",this.handleDocumentKeyDown)}async hide(){if(this.ignoreOpenWatcher=!0,this.open=!1,this.nanoHide.emit().defaultPrevented)return this.open=!0,void(this.ignoreOpenWatcher=!1);this.popover&&this.popover.hide(),this.ignoreOpenWatcher=!1,document.removeEventListener("mousedown",this.handleDocumentMouseDown),document.removeEventListener("keydown",this.handleDocumentKeyDown)}afterHide(){"function"==typeof this.positioner?.hidePopover&&this.positioner.hidePopover(),this.panel.scrollTop=0,this.accessibleTrigger&&n(this.containingElement,this.trigger)&&this.accessibleTrigger.focus()}togglePanel=()=>{this.autoOpen&&(this.open?this.hide():this.show())};updateAccessibleTrigger(){if(!this.didLoad)return;let t;this.accessibleTrigger=null,t=this.tetherTo?r(this.tetherTo):Array.from(this.host.querySelectorAll('[slot="trigger"]')).map(r)[0],t&&!t.getAttribute("aria-haspopup")&&(t.setAttribute("aria-haspopup","true"),t.setAttribute("aria-expanded",this.open?"true":"false"),this.accessibleTrigger=t)}handleDocumentKeyDown(t){if("Escape"!==t.key)if("Tab"===t.key)setTimeout((()=>{n(this.containingElement,this.trigger,t)||this.hide()}));else{if(this.menu&&(this.placement.match(/bottom|top/)&&["ArrowDown","ArrowUp"].includes(t.key)||this.placement.match(/right|left/)&&["ArrowRight","ArrowLeft"].includes(t.key)))return!this.open||n(this.containingElement,this.trigger,t)?"NANO-DROPDOWN"===this.containingElement.tagName&&this.containingElement.placement.match(/right|left/)&&"NANO-DROPDOWN"===this.trigger.getRootNode()?.host?.tagName?void this.hide():void 0:(t.preventDefault(),this.menu.setFocus(),void(this.focusFirstEle=!0));const i=t.composedPath();if(this.menu&&i.length&&!i.find((t=>t!==this.menu)))return void this.menu.dispatchEvent(new KeyboardEvent(t.type,t))}else this.hide()}handleDocumentMouseDown(t){n(this.containingElement,this.trigger,t)||this.hide()}handleTriggerKeyDown=t=>{(this.placement.match(/bottom|top/)&&["ArrowDown","ArrowUp"," ","Enter"].includes(t.key)||this.placement.match(/right|left/)&&["ArrowRight","ArrowLeft"," ","Enter"].includes(t.key))&&(this.show(),t.preventDefault(),t.stopPropagation(),this.menu&&(this.menu.setFocus(),this.focusFirstEle=!0))};handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};createPopover(){(this.tetherTo||this.trigger)&&this.positioner&&(this.popover&&(this.open&&this.hide(),this.popover.destroy(),this.popover=null),this.popover=new a(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>{this.nanoAfterHide.emit()},onAfterShow:()=>{this.nanoAfterShow.emit()},onTransitionEnd:()=>{this.open?this.menu&&(this.menu.showActiveElement(),this.focusFirstEle&&(this.menu.setFocus(),this.focusFirstEle=!1)):this.afterHide()}}),this.open&&this.show())}isOverflowing(){return["auto","scroll"].includes(window.getComputedStyle(this.host).getPropertyValue("--overflow"))}connectedCallback(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this),this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this),this.containingElement||(this.containingElement=this.host)}componentDidLoad(){this.didLoad=!0,this.createPopover(),setTimeout((()=>this.updateAccessibleTrigger()),100)}disconnectedCallback(){this.host.isConnected&&this.hide(),this.popover&&this.popover.destroy()}render(){return l(e,{key:"c0ed4b8b03d27f7437c148c8df305886c6cf29d9",class:"nano-dropdown"},l("div",{key:"27165586e2caa99ba746e7db3aa1574f0e9d1576",part:"base",id:this.dropdownId,class:{dropdown:!0,"dropdown--open":this.open}},l("span",{key:"b401a4d341e786ae4fe8c54adf06f8da1be4f531",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},l("slot",{key:"bd61e0f2d5e164b21d3ecba81c63ec72b0b7cc6f",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),l("div",{key:"e0cb2a8823490b70f6aa01073d3873fa785fd763",ref:t=>this.positioner=t,class:"dropdown__positioner",popover:"manual",id:this.dropdownId+"-positioner"},l("div",{key:"3f1b7e3911cd7616ff85d042fc0d1e3e358f36c2",ref:t=>this.panel=t,part:"panel",class:`dropdown__panel ${this.placement.split("-").join(" ")}`,"aria-hidden":!this.open,role:"group"===this.host.getAttribute("role")?"group":"dialog","aria-modal":"group"===this.host.getAttribute("role")?void 0:"true","aria-labelledby":this.dialogTitle?this.labelId:void 0,tabIndex:this.isOverflowing()?0:void 0},this.dialogTitle&&l("span",{key:"19cc4dd331a4c2cbdc73a05687681cb2830fff0c",id:this.labelId,class:"dropdown__accessible-title","aria-live":"group"===this.host.getAttribute("role")?void 0:"polite"},this.dialogTitle),l("slot",{key:"5da1881086c31481463b3b7244552e17ee66d997"})))))}static get watchers(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}}};u.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{--width:auto;--border:none;--border-radius:0px;--background:var(--nano-color-neutral-75);--padding:0 0;--overflow:auto;--dropdown-z-index:var(--nano-z-index-dropdown);--min-width:0;--max-height:none;--box-shadow:var(--nano-shadow-l2);--menu-height:calc(100vh - 200px);display:inline-block}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-inline-size:var(--min-width);border:0;background:none;padding:0;overflow:visible;color:unset}.dropdown__positioner::backdrop{display:none}.dropdown__positioner[popover],.dropdown__positioner:popover-open{inset:unset}@media (width <= 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-inline-size:var(--min-width);inline-size:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentcolor;box-shadow:var(--box-shadow);opacity:0;transition:var(--nano-transition-x-fast) ease opacity, var(--nano-transition-x-fast) ease transform, var(--nano-transition-fast) ease min-block-size;min-block-size:20px;overflow:var(--overflow);max-block-size:var(--max-height);box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(.nano-menu){max-block-size:var(--menu-height)}.dropdown__accessible-title{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}";const b=class{constructor(o){t(this,o),this.nanoFocus=i(this,"nanoFocus",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoSelect=i(this,"nanoSelect",7)}ignoreMouseEvents=!1;ignoreMouseTimeout;menu;typeToSelect="";typeToSelectTimeout;get el(){return o(this)}get hasFocus(){return this._hasFocus}_hasFocus=!1;type;_type;label;nanoFocus;nanoBlur;nanoSelect;async setFocus(){this.menu?.focus&&this.menu.focus({preventScroll:!0})}async removeFocus(){this.menu?.blur&&this.menu.blur()}async showActiveElement(){this.selectedItem&&this.selectedItem.scrollIntoView({block:"nearest"})}async resetActiveItem(){this.getItems.filter((t=>t.tagName.toLowerCase()===d("nano-option"))).map((t=>t.setAttribute("tabindex","-1")))}get getItems(){let t;if("listbox"===this._type)t=p(this.el,`${d("nano-nav-item")}, ${d("nano-option")}`,"slot");else{const i=this.el.querySelectorAll("[open]");t=h(i[i.length-1]||this.el)}return t.filter((t=>!t.disabled&&!t.hidden))}get activeItem(){const t=s();return this.getItems.find((i=>"0"===i.getAttribute("tabindex")||i===t||i===document.activeElement||i.classList.contains("has-focus")))}get selectedItem(){return this.getItems.find((t=>t.selected))}async setActiveFocusItem(t,i=!0){const o=this.getItems,e=t||o.find((t=>t.selected))||o[0];o.filter((t=>t.tagName.toLowerCase()===d("nano-option"))).map((t=>t.setAttribute("tabindex",t===e?"0":"-1"))),i&&(e?e.setFocus?e.setFocus():e.focus():this.hasFocus||this.menu.focus())}handleBlur(t){if(!this.hasFocus)return;let i;if(t.key){if("Tab"!==t.key)return;i=s()&&s().closest(this.el.tagName.toLowerCase())===this.el}else i=!!t.composedPath().find((t=>t===this.el));i||(this.resetActiveItem(),this._hasFocus=!1,this.nanoBlur.emit())}handleFocus=()=>{this._hasFocus=!0,this.setActiveFocusItem(this.selectedItem||this.getItems[0]),this.nanoFocus.emit()};handleClick=t=>{const i=t.target.closest(d("nano-nav-item"));i&&!i.disabled&&this.nanoSelect.emit(i)};handleKeyDown=t=>{switch(clearTimeout(this.ignoreMouseTimeout),this.ignoreMouseTimeout=setTimeout((()=>this.ignoreMouseEvents=!1),500),this.ignoreMouseEvents=!0,t.key){case" ":this.activeItem&&(t.stopPropagation(),"BUTTON"!==this.activeItem.nodeName&&this.activeItem.click());break;case"ArrowDown":case"ArrowUp":case"PageDown":case"PageUp":case"Home":case"End":{const i=this.getItems;let o=i.indexOf(this.activeItem);if(i.length)return t.preventDefault(),"ArrowDown"===t.key?o++:"ArrowUp"===t.key?o--:"Home"===t.key||"PageUp"===t.key?o=0:"End"!==t.key&&"PageDown"!==t.key||(o=i.length-1),o<0&&(o=i.length-1),o>i.length-1&&(o=0),this.setActiveFocusItem(i[o]),void(i[o]&&i[o].scrollIntoView({block:"nearest"}));break}}if(" "===t.key||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(this.typeToSelectTimeout),this.typeToSelectTimeout=setTimeout((()=>this.typeToSelect=""),750),this.typeToSelect+=t.key;const i=this.getItems;for(const t of i)if(c(t).toLowerCase().trim().substring(0,this.typeToSelect.length)===this.typeToSelect){this.setActiveFocusItem(t);break}}};handleMouseOver=t=>{const i=t.target,o=i.closest(d("nano-nav-item"))||i.closest(d("nano-option"))||i.closest("a");o&&!this.ignoreMouseEvents&&this.setActiveFocusItem(o)};handleSlotContent=()=>{if(this._type=this.type||null,!this._type){let t,i=0;h(this.el).forEach((o=>{"A"===o.tagName||"link"===o.role?t++:i++})),this._type=t>i?"nav":"menu"}"nav"!==this._type&&(p(this.el,`*:not(${d("nano-nav-item")}, a, ${d("nano-option")}, ${d("nano-dropdown")})`,!0).forEach((t=>{this.getItems.indexOf(t)<0&&t.setAttribute("role","none")})),this.el.querySelectorAll(`a, ${d("nano-dropdown")}`).forEach((t=>{t.setAttribute("role","A"===t.tagName?"menuitem":"group")})))};componentWillLoad(){this.handleSlotContent()}render(){return l(e,{key:"584081bb33462feb595037c47abd68aa3db1105a",role:"listbox"===this._type?"group":this._type,class:"nano-menu"},l("div",{key:"3847f51ea7fb4b0a80fe527d98e2af79468ed4bb",onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onFocus:this.handleFocus,"aria-label":this.label?this.label:void 0,ref:t=>this.menu=t,part:"base",class:{menu:!0,["menu--"+this._type]:!0,"menu--has-focus":this.hasFocus},tabIndex:-1,role:"group"},l("slot",{key:"213d89d4ce752d7fa07e0f145d939679d6cb82ab",onSlotchange:this.handleSlotContent})))}};b.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:var(--nano-spacing-sm) var(--nano-spacing-sm);--font-size:1rem;--background:var(--nano-color-neutral-75);--nav-item-padding:var(--padding);display:block;background:var(--background);color:var(--nano-color-neutral-1400);overflow-x:clip}.menu{font-size:var(--font-size);overscroll-behavior:none;min-inline-size:var(--width);position:relative}.menu:focus{outline:none}::slotted(*:not(.nano-nav-item,.nano-option,hr,slot)){padding:var(--padding);display:block}";export{u as nano_dropdown,b as nano_menu}
+import{r as t,c as i,g as o,a as e}from"./index-BM3Om9WE.js";import{f as n,g as s}from"./active-element-CKJIkX0R.js";import{P as a}from"./popover-CWVbjtKn.js";import{a as r,g as h}from"./tabbable-BgopY-vd.js";import{t as d,h as l}from"./renderer-BaP2L8CT.js";import{g as p}from"./dom-dlicJTEJ.js";import{g as c}from"./slot-CFTP7C_Z.js";let m=0;const u=class{constructor(o){t(this,o),this.nanoShow=i(this,"nanoShow",7),this.nanoAfterShow=i(this,"nanoAfterShow",7),this.nanoHide=i(this,"nanoHide",7),this.nanoAfterHide=i(this,"nanoAfterHide",7)}dropdownId="dropdown-"+m++;labelId=this.dropdownId+"-title";ignoreOpenWatcher=!1;panel;popover;trigger;positioner;accessibleTrigger;didLoad=!1;focusFirstEle=!0;get menu(){return this.host.querySelector(d("nano-menu"))}get host(){return o(this)}autoOpen=!0;open=!1;handleOpenChange(){this.ignoreOpenWatcher||(this.open?this.show():this.hide(),this.accessibleTrigger?this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString()):this.updateAccessibleTrigger())}closeOnSelect=!0;containingElement;tetherTo=null;handleTetherToChange(){this.createPopover(),this.updateAccessibleTrigger()}placement="bottom-start";distance=5;skidding=0;hoist=!1;handlePopoverOptionsChange(){this.popover&&this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})}dialogTitle;nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;eventType;secondaryOpen(t){t.detail.secondaryMenu&&(t.stopPropagation(),this.panel.classList.add("loading"),this.panel.addEventListener("transitionend",(()=>{this.panel.classList.remove("loading")}),{once:!0}),this.panel.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px")}secondaryClose(t){t.detail.secondaryMenu&&(t.stopPropagation(),t.target.parentElement&&(this.panel.style.minHeight=t.target.parentElement.scrollHeight+"px"))}handlePanelSelect(t){this.closeOnSelect&&t.target.tagName.toLowerCase()===d("nano-menu")&&this.hide()}async show(){if(this.ignoreOpenWatcher=!0,this.open=!0,this.nanoShow.emit().defaultPrevented)return this.open=!1,void(this.ignoreOpenWatcher=!1);"function"==typeof this.positioner?.showPopover?(this.hoist=!0,this.popover.show(),this.positioner.showPopover()):this.popover.show(),this.ignoreOpenWatcher=!1,document.addEventListener("mousedown",this.handleDocumentMouseDown),document.addEventListener("keydown",this.handleDocumentKeyDown)}async hide(){if(this.ignoreOpenWatcher=!0,this.open=!1,this.nanoHide.emit().defaultPrevented)return this.open=!0,void(this.ignoreOpenWatcher=!1);this.popover&&this.popover.hide(),this.ignoreOpenWatcher=!1,document.removeEventListener("mousedown",this.handleDocumentMouseDown),document.removeEventListener("keydown",this.handleDocumentKeyDown)}afterHide(){"function"==typeof this.positioner?.hidePopover&&this.positioner.hidePopover(),this.panel.scrollTop=0,this.accessibleTrigger&&n(this.containingElement,this.trigger)&&this.accessibleTrigger.focus()}togglePanel=()=>{this.autoOpen&&(this.open?this.hide():this.show())};updateAccessibleTrigger(){if(!this.didLoad)return;let t;this.accessibleTrigger=null,t=this.tetherTo?r(this.tetherTo):Array.from(this.host.querySelectorAll('[slot="trigger"]')).map(r)[0],t&&!t.getAttribute("aria-haspopup")&&(t.setAttribute("aria-haspopup","true"),t.setAttribute("aria-expanded",this.open?"true":"false"),this.accessibleTrigger=t)}handleDocumentKeyDown(t){if("Escape"!==t.key)if("Tab"===t.key)setTimeout((()=>{n(this.containingElement,this.trigger,t)||this.hide()}));else{if(this.menu&&(this.placement.match(/bottom|top/)&&["ArrowDown","ArrowUp"].includes(t.key)||this.placement.match(/right|left/)&&["ArrowRight","ArrowLeft"].includes(t.key)))return!this.open||n(this.containingElement,this.trigger,t)?"NANO-DROPDOWN"===this.containingElement.tagName&&this.containingElement.placement.match(/right|left/)&&"NANO-DROPDOWN"===this.trigger.getRootNode()?.host?.tagName?void this.hide():void 0:(t.preventDefault(),this.menu.setFocus(),void(this.focusFirstEle=!0));const i=t.composedPath();if(this.menu&&i.length&&!i.find((t=>t!==this.menu)))return void this.menu.dispatchEvent(new KeyboardEvent(t.type,t))}else this.hide()}handleDocumentMouseDown(t){n(this.containingElement,this.trigger,t)||this.hide()}handleTriggerKeyDown=t=>{(this.placement.match(/bottom|top/)&&["ArrowDown","ArrowUp"," ","Enter"].includes(t.key)||this.placement.match(/right|left/)&&["ArrowRight","ArrowLeft"," ","Enter"].includes(t.key))&&(this.show(),t.preventDefault(),t.stopPropagation(),this.menu&&(this.menu.setFocus(),this.focusFirstEle=!0))};handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};createPopover(){(this.tetherTo||this.trigger)&&this.positioner&&(this.popover&&(this.open&&this.hide(),this.popover.destroy(),this.popover=null),this.popover=new a(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>{this.nanoAfterHide.emit()},onAfterShow:()=>{this.nanoAfterShow.emit()},onTransitionEnd:()=>{this.open?this.menu&&(this.menu.showActiveElement(),this.focusFirstEle&&(this.menu.setFocus(),this.focusFirstEle=!1)):this.afterHide()}}),this.open&&this.show())}isOverflowing(){return["auto","scroll"].includes(window.getComputedStyle(this.host).getPropertyValue("--overflow"))}connectedCallback(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this),this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this),this.containingElement||(this.containingElement=this.host)}componentDidLoad(){this.didLoad=!0,this.createPopover(),setTimeout((()=>this.updateAccessibleTrigger()),100)}disconnectedCallback(){this.host.isConnected&&this.hide(),this.popover&&this.popover.destroy()}render(){return l(e,{key:"c0ed4b8b03d27f7437c148c8df305886c6cf29d9",class:"nano-dropdown"},l("div",{key:"27165586e2caa99ba746e7db3aa1574f0e9d1576",part:"base",id:this.dropdownId,class:{dropdown:!0,"dropdown--open":this.open}},l("span",{key:"b401a4d341e786ae4fe8c54adf06f8da1be4f531",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},l("slot",{key:"bd61e0f2d5e164b21d3ecba81c63ec72b0b7cc6f",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),l("div",{key:"e0cb2a8823490b70f6aa01073d3873fa785fd763",ref:t=>this.positioner=t,class:"dropdown__positioner",popover:"manual",id:this.dropdownId+"-positioner"},l("div",{key:"3f1b7e3911cd7616ff85d042fc0d1e3e358f36c2",ref:t=>this.panel=t,part:"panel",class:`dropdown__panel ${this.placement.split("-").join(" ")}`,"aria-hidden":!this.open,role:"group"===this.host.getAttribute("role")?"group":"dialog","aria-modal":"group"===this.host.getAttribute("role")?void 0:"true","aria-labelledby":this.dialogTitle?this.labelId:void 0,tabIndex:this.isOverflowing()?0:void 0},this.dialogTitle&&l("span",{key:"19cc4dd331a4c2cbdc73a05687681cb2830fff0c",id:this.labelId,class:"dropdown__accessible-title","aria-live":"group"===this.host.getAttribute("role")?void 0:"polite"},this.dialogTitle),l("slot",{key:"5da1881086c31481463b3b7244552e17ee66d997"})))))}static get watchers(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}}};u.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{--width:auto;--border:none;--border-radius:0px;--background:var(--nano-color-neutral-75);--padding:0 0;--overflow:auto;--dropdown-z-index:var(--nano-z-index-dropdown);--min-width:0;--max-height:none;--box-shadow:var(--nano-shadow-l2);--menu-height:calc(100vh - 200px);display:inline-block}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-inline-size:var(--min-width);border:0;background:none;padding:0;overflow:visible;color:unset}.dropdown__positioner::backdrop{display:none}.dropdown__positioner[popover],.dropdown__positioner:popover-open{inset:unset}@media (width <= 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-inline-size:var(--min-width);inline-size:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentcolor;box-shadow:var(--box-shadow);opacity:0;transition:var(--nano-transition-x-fast) ease opacity, var(--nano-transition-x-fast) ease transform, var(--nano-transition-fast) ease min-block-size;min-block-size:20px;overflow:var(--overflow);max-block-size:var(--max-height);box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(.nano-menu){max-block-size:var(--menu-height)}.dropdown__accessible-title{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}";const b=class{constructor(o){t(this,o),this.nanoFocus=i(this,"nanoFocus",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoSelect=i(this,"nanoSelect",7)}ignoreMouseEvents=!1;ignoreMouseTimeout;menu;typeToSelect="";typeToSelectTimeout;get el(){return o(this)}get hasFocus(){return this._hasFocus}_hasFocus=!1;type;_type;label;nanoFocus;nanoBlur;nanoSelect;async setFocus(){this.menu?.focus&&this.menu.focus({preventScroll:!0})}async removeFocus(){this.menu?.blur&&this.menu.blur()}async showActiveElement(){this.selectedItem&&this.selectedItem.scrollIntoView({block:"nearest"})}async resetActiveItem(){this.getItems.filter((t=>t.tagName.toLowerCase()===d("nano-option"))).map((t=>t.setAttribute("tabindex","-1")))}get getItems(){let t;if("listbox"===this._type)t=p(this.el,`${d("nano-nav-item")}, ${d("nano-option")}`,"slot");else{const i=this.el.querySelectorAll("[open]");t=h(i[i.length-1]||this.el)}return t.filter((t=>!t.disabled&&!t.hidden))}get activeItem(){const t=s();return this.getItems.find((i=>"0"===i.getAttribute("tabindex")||i===t||i===document.activeElement||i.classList.contains("has-focus")))}get selectedItem(){return this.getItems.find((t=>t.selected))}async setActiveFocusItem(t,i=!0){const o=this.getItems,e=t||o.find((t=>t.selected))||o[0];o.filter((t=>t.tagName.toLowerCase()===d("nano-option"))).map((t=>t.setAttribute("tabindex",t===e?"0":"-1"))),i&&(e?e.setFocus?e.setFocus():e.focus():this.hasFocus||this.menu.focus())}handleBlur(t){if(!this.hasFocus)return;let i;if(t.key){if("Tab"!==t.key)return;i=s()&&s().closest(this.el.tagName.toLowerCase())===this.el}else i=!!t.composedPath().find((t=>t===this.el));i||(this.resetActiveItem(),this._hasFocus=!1,this.nanoBlur.emit())}handleFocus=()=>{this._hasFocus=!0,this.setActiveFocusItem(this.selectedItem||this.getItems[0]),this.nanoFocus.emit()};handleClick=t=>{const i=t.target.closest(d("nano-nav-item"));i&&!i.disabled&&this.nanoSelect.emit(i)};handleKeyDown=t=>{switch(clearTimeout(this.ignoreMouseTimeout),this.ignoreMouseTimeout=setTimeout((()=>this.ignoreMouseEvents=!1),500),this.ignoreMouseEvents=!0,t.key){case" ":this.activeItem&&(t.stopPropagation(),"BUTTON"!==this.activeItem.nodeName&&this.activeItem.click());break;case"ArrowDown":case"ArrowUp":case"PageDown":case"PageUp":case"Home":case"End":{const i=this.getItems;let o=i.indexOf(this.activeItem);if(i.length)return t.preventDefault(),"ArrowDown"===t.key?o++:"ArrowUp"===t.key?o--:"Home"===t.key||"PageUp"===t.key?o=0:"End"!==t.key&&"PageDown"!==t.key||(o=i.length-1),o<0&&(o=i.length-1),o>i.length-1&&(o=0),this.setActiveFocusItem(i[o]),void(i[o]&&i[o].scrollIntoView({block:"nearest"}));break}}if(" "===t.key||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(this.typeToSelectTimeout),this.typeToSelectTimeout=setTimeout((()=>this.typeToSelect=""),750),this.typeToSelect+=t.key;const i=this.getItems;for(const t of i)if(c(t).toLowerCase().trim().substring(0,this.typeToSelect.length)===this.typeToSelect){this.setActiveFocusItem(t);break}}};handleMouseOver=t=>{const i=t.target,o=i.closest(d("nano-nav-item"))||i.closest(d("nano-option"))||i.closest("a");o&&!this.ignoreMouseEvents&&this.setActiveFocusItem(o)};handleSlotContent=()=>{if(this._type=this.type||null,!this._type){let t,i=0;h(this.el).forEach((o=>{"A"===o.tagName||"link"===o.role?t++:i++})),this._type=t>i?"nav":"menu"}"nav"!==this._type&&(p(this.el,`*:not(${d("nano-nav-item")}, a, ${d("nano-option")}, ${d("nano-dropdown")})`,!0).forEach((t=>{this.getItems.indexOf(t)<0&&t.setAttribute("role","none")})),this.el.querySelectorAll(`a, ${d("nano-dropdown")}`).forEach((t=>{t.setAttribute("role","A"===t.tagName?"menuitem":"group")})))};componentWillLoad(){this.handleSlotContent()}render(){return l(e,{key:"584081bb33462feb595037c47abd68aa3db1105a",role:"listbox"===this._type?"group":this._type,class:"nano-menu"},l("div",{key:"3847f51ea7fb4b0a80fe527d98e2af79468ed4bb",onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onFocus:this.handleFocus,"aria-label":this.label?this.label:void 0,ref:t=>this.menu=t,part:"base",class:{menu:!0,["menu--"+this._type]:!0,"menu--has-focus":this.hasFocus},tabIndex:-1,role:"group"},l("slot",{key:"213d89d4ce752d7fa07e0f145d939679d6cb82ab",onSlotchange:this.handleSlotContent})))}};b.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:var(--nano-spacing-sm) var(--nano-spacing-sm);--font-size:1rem;--background:var(--nano-color-neutral-75);--nav-item-padding:var(--padding);display:block;background:var(--background);color:var(--nano-color-neutral-1400);overflow-x:clip}.menu{font-size:var(--font-size);overscroll-behavior:none;min-inline-size:var(--width);position:relative}.menu:focus{outline:none}::slotted(*:not(.nano-nav-item,.nano-option,hr,slot)){padding:var(--padding);display:block}";export{u as nano_dropdown,b as nano_menu}

package/dist/nano-components/nano-feature-box.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as o}from"./index-DgO0qeQ9.js";const t=class{constructor(t){o(this,t)}imgPosition="start"};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_feature_box}
+import{r as o}from"./index-BM3Om9WE.js";const t=class{constructor(t){o(this,t)}imgPosition="start"};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_feature_box}

package/dist/nano-components/nano-field-validator.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as i,g as s,B as h,a}from"./index-DgO0qeQ9.js";import{c as e}from"./index-CjVnX0W1.js";import{t as n,h as o}from"./renderer-T8etwwhk.js";const r=class{constructor(s){t(this,s),this.nanoPayloadChange=i(this,"nanoPayloadChange",7),this.nanoSubmit=i(this,"nanoSubmit",7),this.nanoInvalid=i(this,"nanoInvalid",7)}get host(){return s(this)}submitted=!1;userForm;userFormChange(){this.userForm&&(this.activeForm=this.userForm)}get activeForm(){return this._activeForm}set activeForm(t){t&&(this._activeForm&&this._activeForm.removeEventListener("invalid",this.handleFormInvalid,!0),t.addEventListener("invalid",this.handleFormInvalid,!0),this._activeForm=t)}_activeForm;mo;allFields=[];nanoFields;plainFields;nanoFieldSelector="\n    nano-input,\n    nano-select,\n    nano-file-upload,\n    nano-date-input,\n    nano-checkbox\n  ";hasSetStore=!1;internalValidate=!1;validateOn="submitThenDirty";validateOnChange(){this.nanoFields.forEach((t=>{if(t.tagName.toLowerCase()===n("nano-checkbox")){const i=t.closest(n("nano-checkbox-group"));i&&(i.validateOn=this.validateOn)}else t.validateOn=this.validateOn}))}scrollToInvalid=!0;get dirty(){return this._dirty}_dirty=!1;get valid(){return this._valid}_valid;get store(){return this._store}_store;get payload(){return this._store?.state}get showValidation(){return"dirty"===this.validateOn&&this.dirty||this.submitted}get validationState(){const t=[];return this.allFields.forEach((async i=>{const s=t.find((t=>t.name===this.getName(i)));let h,a,e,n;s&&(i.validationMessage?(h=i,s.validityMessage=h.validationMessage.length?h.validationMessage:s.validityMessage,this.internalValidate=!0,s.valid&&!h.checkValidity()&&(s.valid=!1),this.internalValidate=!1):i.validityMessage&&(a=i,s.validityMessage=a.validityMessage,s.valid&&a.invalid&&(s.valid=!1)),s.fields.find((t=>t===i))||s.fields.push(i)),i.checkValidity?(h=i,this.internalValidate=!0,e=h.checkValidity(),this.internalValidate=!1,n=h.validationMessage):(a=i,e=!a.invalid,n=a.validityMessage),t.push({fields:[i],name:this.getName(i),value:this._store.state[this.getName(i)],dirty:!1,valid:e,validityMessage:n})})),t}extraFieldSelector="input, select, textarea";validation;async setStore(t){this.hasSetStore=!0,Object.entries(t).forEach((([t,i])=>{this.store.state[t]=i}))}async setCustomValidity(t,i){return await Promise.all(Object.entries(t).map((async([t,i])=>{const s=this.allFields.find((i=>this.getName(i)===t));s&&await this.setFieldError(s,i)}))).finally((()=>{this.scrollToFirstInvalid(i)}))}async resetValidity(){return await Promise.all(this.allFields.map((async t=>await this.setFieldError(t,""))))}async scrollToFirstInvalid(t=!0){(t||this.scrollToInvalid)&&setTimeout((()=>{const t=this.validationState.find((t=>!t.valid));t&&t.fields[0].scrollIntoView({behavior:"smooth",block:"nearest"})}),200)}nanoPayloadChange;nanoSubmit;nanoInvalid;attachSlotObserver(){this.mo||h.isServer||(this.mo=new MutationObserver((()=>{const t=this.host.querySelector("form");t&&t!==this.activeForm&&(this.activeForm=t),this.setupFields()}))).observe(this.host,{childList:!0,attributes:!0,attributeFilter:["name"],subtree:!0})}getName(t){return t.name||t.getAttribute("name")}setupFields(){let t=Array.from(this.host.querySelectorAll(this.nanoFieldSelector)),i=Array.from(this.host.querySelectorAll(this.extraFieldSelector)).filter((t=>!t.closest(this.nanoFieldSelector)));t=t.filter((t=>!!this.getName(t)&&!!this.getName(t).length)),i=i.filter((t=>!!this.getName(t)&&!!this.getName(t).length)),[...t,...i].filter((t=>!this.allFields.includes(t))).length&&(this.nanoFields=t,this.plainFields=i,this.allFields=[...t,...i],this.storeToFields(this.allFields),this.validateOnChange(),this.fieldsToStore(this.allFields,!0),this.nanoPayloadChange.emit(this._store.state))}storeToFields(t){t.forEach((t=>{const i=this.getName(t);if(i.length&&void 0!==this._store.state[i])if(t.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(t.type)){const s=this.allFields.filter((i=>this.getName(t)===this.getName(i)));"radio"===s[0].type||"segment"===s[0].type?s.forEach((t=>{t.checked=this._store.state[i]===t.value})):Array.isArray(this._store.state[i])?s.forEach((t=>{t.checked=!!this._store.state[i]?.includes(t.value)})):s.forEach((t=>{t.checked=this._store.state[i]===t.value}))}else if(t.tagName.toLowerCase()!==n("nano-file-upload"))t.value=this._store.state[i];else{const s=t;s.files?.length||(s.files=this._store.state[i])}}))}getValidityTarget(t){let i=t;return t.tagName.toLowerCase()===n("nano-checkbox")&&(i=t.closest(n("nano-checkbox-group"))||t),i}fieldsToStore(t,i=!1){t.forEach((t=>{const s=this.getName(t);if(s.length&&!(this._store.state[s]&&this.hasSetStore&&i))if(t.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(t.type)){const i=t;if("radio"===i.type||"segment"===i.type)i.checked&&(this._store.state[s]=i.value);else if(this.allFields.filter((t=>this.getName(t)===s&&(t.tagName.toLowerCase()===n("nano-checkbox")||"checkbox"===t.type))).length>1){const t=Array.isArray(this._store.state[s])?this._store.state[s]:[];i.checked?this._store.state[s]?.includes(i.value)||(this._store.state[s]=[...t,i.value]):this._store.state[s]=t.filter((t=>t!==i.value))}else this._store.state[s]=i.checked?i.value:""}else if(t.tagName.toLowerCase()!==n("nano-file-upload"))this._store.state[s]=t.value;else{const i=t;this.fileStateEqual(s,i)||(this._store.state[s]=i.files)}}))}fileStateEqual(t,i){return JSON.stringify(this._store.state[t])===JSON.stringify(i.files)||this._store.state[t]==i.files}async validate(t,i){if(!this.validation)return;const s=this.validation(t,i,this._store.state);s&&await Promise.all(Object.entries(s).map((async([t,i])=>i.fields.map((async s=>{const h=this.allFields.find((t=>this.getName(t)===s)),a=this.getValidityTarget(h);(a.validityMessage||a.validationMessage)===t&&i.valid?await this.setFieldError(a,""):i.valid||await this.setFieldError(a,t)})))))}async validateAllFields(){await Object.entries(this._store.state).reduce((async(t,[i,s])=>{await t,await this.validate(i,s)}),void 0)}async setFieldError(t,i){const s=this.getValidityTarget(t);s.showError?await s.showError(i):s.setError?await s.setError(i):s.setCustomValidity(i)}submitForm(){this.nanoSubmit.emit().defaultPrevented||this.activeForm.submit()}handleStoreChange=async(t,i)=>{const s=this.allFields.find((i=>this.getName(i)===t));(s&&(s.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(s.type))||s&&(s.tagName.toLowerCase()===n("nano-file-upload")&&!this.fileStateEqual(t,s)||s.tagName.toLowerCase()!==n("nano-file-upload")&&s.value!==i))&&this.storeToFields([s]),"dirty"===this.validateOn&&this.dirty&&(this.internalValidate=!0,await this.validateAllFields(),this._valid=this.activeForm.checkValidity(),this.internalValidate=!1),this.nanoPayloadChange.emit(this._store.state)};handleFieldChange(t){this.nanoFields?.includes(t.target)&&(this._dirty=!0,this.fieldsToStore([t.target]))}handlePlainFieldChange(t){this.plainFields.includes(t.target)&&this.fieldsToStore([t.target])}handleFormInvalid=async t=>{this.plainFields.includes(t.target)||t.preventDefault(),this._valid=!1,this.internalValidate||("submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.submitted=!0,await this.validateAllFields(),this.internalValidate=!0,this._valid=this.activeForm.checkValidity(),this.internalValidate=!1,"submit"===this.validateOn&&this._valid?this.submitForm():(this.scrollToFirstInvalid(!1),this.nanoInvalid.emit()))};async handleSubmit(t){t.preventDefault(),"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.submitted=!0,await this.validateAllFields(),this.internalValidate=!0,this._valid=this.activeForm.checkValidity(),this.internalValidate=!1,this._valid?this.submitForm():this.scrollToFirstInvalid(!1)}connectedCallback(){this.userForm=this.host.querySelector("form:not(.sc-nano-field-validator)"),this._store=e({})}componentDidLoad(){requestAnimationFrame((()=>{this.setupFields(),this.attachSlotObserver(),this._store.on("set",this.handleStoreChange)}))}disconnectedCallback(){this.mo&&this.mo.disconnect(),this._store.reset(),this.activeForm&&this.activeForm.removeEventListener("invalid",this.handleFormInvalid,!0)}render(){return o(a,{key:"145b307561c5a2a35d5b6b6d88d03c88ba8a41b4",class:"nano-field-validator"},this.userForm&&o("slot",{key:"2a16d6a8f32afe2c22522e240e117ccf8446edc5"}),!this.userForm&&o("form",{key:"c72a5b25d958c97d28c78279b05fa7a3643a994e",ref:t=>this.activeForm=t},o("slot",{key:"7983e9fc33115b5448b980cbcba0940163521db8"})))}static get watchers(){return{userForm:["userFormChange"],validateOn:["validateOnChange"],extraFieldSelector:["attachSlotObserver"]}}};export{r as nano_field_validator}
+import{r as t,c as i,g as s,B as a,a as h}from"./index-BM3Om9WE.js";import{c as e}from"./index-BlBZYxu4.js";import{t as n,h as o}from"./renderer-BaP2L8CT.js";const r=class{constructor(s){t(this,s),this.nanoPayloadChange=i(this,"nanoPayloadChange",7),this.nanoSubmit=i(this,"nanoSubmit",7),this.nanoInvalid=i(this,"nanoInvalid",7)}get host(){return s(this)}submitted=!1;userForm;userFormChange(){this.userForm&&(this.activeForm=this.userForm)}get activeForm(){return this._activeForm}set activeForm(t){t&&(this._activeForm&&this._activeForm.removeEventListener("invalid",this.handleFormInvalid,!0),t.addEventListener("invalid",this.handleFormInvalid,!0),this._activeForm=t)}_activeForm;mo;allFields=[];nanoFields;plainFields;nanoFieldSelector="\n    nano-input,\n    nano-select,\n    nano-file-upload,\n    nano-date-input,\n    nano-checkbox\n  ";hasSetStore=!1;internalValidate=!1;validateOn="submitThenDirty";validateOnChange(){this.nanoFields.forEach((t=>{if(t.tagName.toLowerCase()===n("nano-checkbox")){const i=t.closest(n("nano-checkbox-group"));i&&(i.validateOn=this.validateOn)}else t.validateOn=this.validateOn}))}scrollToInvalid=!0;get dirty(){return this._dirty}_dirty=!1;get valid(){return this._valid}_valid;get store(){return this._store}_store;get payload(){return this._store?.state}get showValidation(){return"dirty"===this.validateOn&&this.dirty||this.submitted}get validationState(){const t=[];return this.allFields.forEach((async i=>{const s=t.find((t=>t.name===this.getName(i)));let a,h,e,n;s&&(i.validationMessage?(a=i,s.validityMessage=a.validationMessage.length?a.validationMessage:s.validityMessage,this.internalValidate=!0,s.valid&&!a.checkValidity()&&(s.valid=!1),this.internalValidate=!1):i.validityMessage&&(h=i,s.validityMessage=h.validityMessage,s.valid&&h.invalid&&(s.valid=!1)),s.fields.find((t=>t===i))||s.fields.push(i)),i.checkValidity?(a=i,this.internalValidate=!0,e=a.checkValidity(),this.internalValidate=!1,n=a.validationMessage):(h=i,e=!h.invalid,n=h.validityMessage),t.push({fields:[i],name:this.getName(i),value:this._store.state[this.getName(i)],dirty:!1,valid:e,validityMessage:n})})),t}extraFieldSelector="input, select, textarea";validation;async setStore(t){this.hasSetStore=!0,Object.entries(t).forEach((([t,i])=>{this.store.state[t]=i}))}async setCustomValidity(t,i){return await Promise.all(Object.entries(t).map((async([t,i])=>{const s=this.allFields.find((i=>this.getName(i)===t));s&&await this.setFieldError(s,i)}))).finally((()=>{this.scrollToFirstInvalid(i)}))}async resetValidity(){return await Promise.all(this.allFields.map((async t=>await this.setFieldError(t,""))))}async scrollToFirstInvalid(t=!0){(t||this.scrollToInvalid)&&setTimeout((()=>{const t=this.validationState.find((t=>!t.valid));t&&t.fields[0].scrollIntoView({behavior:"smooth",block:"nearest"})}),200)}nanoPayloadChange;nanoSubmit;nanoInvalid;attachSlotObserver(){this.mo||a.isServer||(this.mo=new MutationObserver((()=>{const t=this.host.querySelector("form");t&&t!==this.activeForm&&(this.activeForm=t),this.setupFields()}))).observe(this.host,{childList:!0,attributes:!0,attributeFilter:["name"],subtree:!0})}getName(t){return t.name||t.getAttribute("name")}setupFields(){let t=Array.from(this.host.querySelectorAll(this.nanoFieldSelector)),i=Array.from(this.host.querySelectorAll(this.extraFieldSelector)).filter((t=>!t.closest(this.nanoFieldSelector)));t=t.filter((t=>!!this.getName(t)&&!!this.getName(t).length)),i=i.filter((t=>!!this.getName(t)&&!!this.getName(t).length)),[...t,...i].filter((t=>!this.allFields.includes(t))).length&&(this.nanoFields=t,this.plainFields=i,this.allFields=[...t,...i],this.storeToFields(this.allFields),this.validateOnChange(),this.fieldsToStore(this.allFields,!0),this.nanoPayloadChange.emit(this._store.state))}storeToFields(t){t.forEach((t=>{const i=this.getName(t);if(i.length&&void 0!==this._store.state[i])if(t.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(t.type)){const s=this.allFields.filter((i=>this.getName(t)===this.getName(i)));"radio"===s[0].type||"segment"===s[0].type?s.forEach((t=>{t.checked=this._store.state[i]===t.value})):Array.isArray(this._store.state[i])?s.forEach((t=>{t.checked=!!this._store.state[i]?.includes(t.value)})):s.forEach((t=>{t.checked=this._store.state[i]===t.value}))}else if(t.tagName.toLowerCase()!==n("nano-file-upload"))t.value=this._store.state[i];else{const s=t;s.files?.length||(s.files=this._store.state[i])}}))}getValidityTarget(t){let i=t;return t.tagName.toLowerCase()===n("nano-checkbox")&&(i=t.closest(n("nano-checkbox-group"))||t),i}fieldsToStore(t,i=!1){t.forEach((t=>{const s=this.getName(t);if(s.length&&!(this._store.state[s]&&this.hasSetStore&&i))if(t.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(t.type)){const i=t;if("radio"===i.type||"segment"===i.type)i.checked&&(this._store.state[s]=i.value);else if(this.allFields.filter((t=>this.getName(t)===s&&(t.tagName.toLowerCase()===n("nano-checkbox")||"checkbox"===t.type))).length>1){const t=Array.isArray(this._store.state[s])?this._store.state[s]:[];i.checked?this._store.state[s]?.includes(i.value)||(this._store.state[s]=[...t,i.value]):this._store.state[s]=t.filter((t=>t!==i.value))}else this._store.state[s]=i.checked?i.value:""}else if(t.tagName.toLowerCase()!==n("nano-file-upload"))this._store.state[s]=t.value;else{const i=t;this.fileStateEqual(s,i)||(this._store.state[s]=i.files)}}))}fileStateEqual(t,i){return JSON.stringify(this._store.state[t])===JSON.stringify(i.files)||this._store.state[t]==i.files}async validate(t,i){if(!this.validation)return;const s=this.validation(t,i,this._store.state);s&&await Promise.all(Object.entries(s).map((async([t,i])=>i.fields.map((async s=>{const a=this.allFields.find((t=>this.getName(t)===s)),h=this.getValidityTarget(a);(h.validityMessage||h.validationMessage)===t&&i.valid?await this.setFieldError(h,""):i.valid||await this.setFieldError(h,t)})))))}async validateAllFields(){await Object.entries(this._store.state).reduce((async(t,[i,s])=>{await t,await this.validate(i,s)}),void 0)}async setFieldError(t,i){const s=this.getValidityTarget(t);s.showError?await s.showError(i):s.setError?await s.setError(i):s.setCustomValidity(i)}submitForm(){this.nanoSubmit.emit().defaultPrevented||this.activeForm.submit()}handleStoreChange=async(t,i)=>{const s=this.allFields.find((i=>this.getName(i)===t));(s&&(s.tagName.toLowerCase()===n("nano-checkbox")||["radio","checkbox"].includes(s.type))||s&&(s.tagName.toLowerCase()===n("nano-file-upload")&&!this.fileStateEqual(t,s)||s.tagName.toLowerCase()!==n("nano-file-upload")&&s.value!==i))&&this.storeToFields([s]),"dirty"===this.validateOn&&this.dirty&&(this.internalValidate=!0,await this.validateAllFields(),this._valid=this.activeForm.checkValidity(),this.internalValidate=!1),this.nanoPayloadChange.emit(this._store.state)};handleFieldChange(t){this.nanoFields?.includes(t.target)&&(this._dirty=!0,this.fieldsToStore([t.target]))}handlePlainFieldChange(t){this.plainFields.includes(t.target)&&this.fieldsToStore([t.target])}handleFormInvalid=async t=>{this.plainFields.includes(t.target)||t.preventDefault(),this._valid=!1,this.internalValidate||("submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.submitted=!0,await this.validateAllFields(),this.internalValidate=!0,this._valid=this.activeForm.checkValidity(),this.internalValidate=!1,"submit"===this.validateOn&&this._valid?this.submitForm():(this.scrollToFirstInvalid(!1),this.nanoInvalid.emit()))};async handleSubmit(t){t.preventDefault(),"submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.submitted=!0,await this.validateAllFields(),this.internalValidate=!0,this._valid=this.activeForm.checkValidity(),this.internalValidate=!1,this._valid?this.submitForm():this.scrollToFirstInvalid(!1)}connectedCallback(){this.userForm=this.host.querySelector("form:not(.sc-nano-field-validator)"),this._store=e({})}componentDidLoad(){requestAnimationFrame((()=>{this.setupFields(),this.attachSlotObserver(),this._store.on("set",this.handleStoreChange)}))}disconnectedCallback(){this.mo&&this.mo.disconnect(),this._store.reset(),this.activeForm&&this.activeForm.removeEventListener("invalid",this.handleFormInvalid,!0)}render(){return o(h,{key:"145b307561c5a2a35d5b6b6d88d03c88ba8a41b4",class:"nano-field-validator"},this.userForm&&o("slot",{key:"2a16d6a8f32afe2c22522e240e117ccf8446edc5"}),!this.userForm&&o("form",{key:"c72a5b25d958c97d28c78279b05fa7a3643a994e",ref:t=>this.activeForm=t},o("slot",{key:"7983e9fc33115b5448b980cbcba0940163521db8"})))}static get watchers(){return{userForm:["userFormChange"],validateOn:["validateOnChange"],extraFieldSelector:["attachSlotObserver"]}}};export{r as nano_field_validator}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as i,c as o,g as a,a as l}from"./index-DgO0qeQ9.js";import{h as e}from"./renderer-T8etwwhk.js";let n=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){i(this,a),this.nanoChange=o(this,"nanoChange",7),this.nanoFocus=o(this,"nanoFocus",7),this.nanoBlur=o(this,"nanoBlur",7),this.nanoValidate=o(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+n++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((i=>i.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="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(i){this._label=i}placeholder="Choose a file";hideLabel=!1;required=!1;disabled=!1;clearable=!1;showInlineError=!0;validateOn="submitThenDirty";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=null;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((i=>(i.objectURL=URL.createObjectURL(i),i))):[]}set files(i){this.addNewFiles(this.arrToFileList(i))}get value(){return this.inputEl?this.inputEl.value:""}set value(i){""===i&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(i){return i&&(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(i){this.inputEl&&(this.inputEl.setCustomValidity(i),this.showInlineValidation())}globalClickHandler(i){this.hasFocus&&i.composedPath().every((i=>i!==this.host))&&this.onBlur()}globalKeydownHandler(i){this.hasFocus&&"Tab"===i.key&&i.target!==this.inputEl&&this.onBlur()}onReset(i){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&i.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(i){const o=t();for(let a=0,l=i.length;a<l;a++)o.items.add(i[a]);return o.files}checkFileSize(i){return i/1e6<=this.maxFileSize}checkFileType(i){return!this.accept||!!i&&this.accept.match(i)&&this.accept.match(i).length>0}validate=()=>{let i;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?this.fileList.length>this.maxFiles?i=`Maximum number of files exceeded (${this.maxFiles})`:this.fileList.forEach((o=>{let a=null;this.checkFileSize(o.file.size)?this.checkFileType(o.file.type)||(a=`File type is not allowed (${this.accept})`):a="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",o.validationMessage=a,o.valid=!a,a&&(i=a)})):i=this.inputEl.validationMessage,i?this.inputEl.setCustomValidity(i):(this.inputEl.setCustomValidity(""),this.errorMessage="")};showInlineValidation(i){"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:i})}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(i){const o=Array.from(i).map((i=>({file:i,location:URL.createObjectURL(i),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const i=o.filter((i=>!this.fileList.find((o=>o.file.name===i.file.name))));this.fileList=[...this.fileList,...i]}else this.fileList=o}onInvalid=i=>{this.showInlineError&&i.preventDefault(),this.validate(),this.showInlineValidation(i)};onFileChoose=i=>{const o=i.target.files;o&&o.length&&this.addNewFiles(i.target.files)};onFileRemoveFileClick=(i,o)=>{this.canChangeFileList&&(this.removeFiles.push(o),i.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((i=>!this.removeFiles.find((o=>o===i))));try{this.removeFiles.forEach((i=>i.location?URL.revokeObjectURL(i.location):""))}catch(i){console.error(i)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!1};onDragStart=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!0};onDrop=i=>{this.onDragStop(i),i.dataTransfer.files&&i.dataTransfer.files.length&&this.addNewFiles(i.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(i,o)=>{const a=this.fileInputId+"-lbl",l=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[e("div",{class:"file-upload__"+i+"-wrap"},e("label",{class:"file-upload__"+i,htmlFor:this.fileInputId,id:a,onDrop:i=>{this.onDrop(i),this.onDragStop(i)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==i)&&e("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==i&&e("slot",{name:"label"})),"drop"===i&&e("div",{class:"file-upload__drop-area"},e("div",null,this.hasLabelSlot&&e("slot",{name:"label"})),e("div",null,"Drag and drop or ",e("span",null,"browse"))),"btn"===i&&e("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},e("nano-cta",{secondary:!0,class:"file-upload__btn-content"},e("div",{class:"button",disabled:this.disabled},this.fileList.length?this.fileList[0].file.name:this.placeholder)),!!this.value&&this.clearable&&!this.disabled&&e("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"0","aria-label":"Clear selected file",onClick:this.onClearClick},e("nano-icon",{name:"light/xmark"})),!this.disabled&&this.showInlineError&&e("nano-icon",this._invalid?{name:"solid/circle-xmark",class:"file-upload__icon file-upload__icon-error"}:{name:"solid/circle-check",class:"file-upload__icon file-upload__icon-success"})),e("input",{"aria-labelledby":a+" "+l+" "+o,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:i=>{this.canChangeFileList?this.publicInputEl=i:this.inputEl=i},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),e("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:i=>{this.canChangeFileList&&(this.inputEl=i)},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?e("div",{class:"file-upload__more",id:l},this.showInlineError&&this.errorMessage.length?e("div",{class:"file-upload__error"},this.errorMessage):"",e("div",{class:"file-upload__help"},e("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const i=this.fileInputId+"-list";return[this.FileUploadInput("drop",i),e("output",{class:"file-upload__list-wrap",id:i},!!this.fileList&&this.fileList.length>0&&e("ul",{class:"file-upload__list list"},this.fileList.map((i=>e("li",{key:i.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},e("span",{class:"list-title"},i.file.name),!i.valid&&e("nano-tooltip",{content:i.validationMessage,placement:"left"},e("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&e("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:i.location}),this.canChangeFileList&&e("nano-icon-button",{onClick:o=>this.onFileRemoveFileClick(o,i),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return e(l,{key:"c6fc291c7ac3c990d5304a2589c7dd1a0193333e",class:"nano-file-upload"},e("div",{key:"12fd1e6551fe6ff6e1eb6a84000a21e526c61c36",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":!0===this._invalid,"file-upload--valid":!1===this._invalid}},e(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;--color-error:var(--nano-color-danger-1100);--color-error-light:var(--nano-color-danger-100);--color-text:var(--nano-color-neutral-1400);--color-drop-browse:var(--nano-color-primary-1200);--color-drop-border:var(--nano-color-primary-1200);--color-drop-bg:var(--nano-color-primary-75);--drop-height:3.5em;--color-btn-bg:var(--nano-color-base-0);--color-btn-border:var(--nano-color-primary-1000);--color-btn-text:var(--nano-color-primary-1000)}[disabled].sc-nano-file-upload-h:not([disabled=false]){cursor:not-allowed}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload--invalid.sc-nano-file-upload{--color-drop-bg:var(--color-error-light)}.file-upload--dragging.sc-nano-file-upload{--color-drop-bg:var(--nano-color-success-50)}.file-upload__label.sc-nano-file-upload{font-size:var(--nano-font-size-xs);margin:0;line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__label.sc-nano-file-upload{color:var(--nano-color-neutral-1200)}.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%;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0;position:relative}.file-upload__more.sc-nano-file-upload:has(.file-upload__error) .file-upload__help.sc-nano-file-upload{display:none !important}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;font-style:italic;font-size:var(--nano-font-size-2xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}.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(--color-error);opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1;display:block}.file-upload__help.sc-nano-file-upload{opacity:1;color:var(--color-text);display:block}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0;display:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__help.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.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(--color-drop-bg);color:var(--color-text);min-block-size:var(--drop-height);padding:var(--nano-spacing-md);display:flex;align-items:center;justify-content:center;position:relative;transition:background-color var(--nano-transition-x-fast) ease-in-out;font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{color:var(--nano-color-neutral-1200);background-color:var(--nano-color-neutral-300);border-color:var(--nano-color-neutral-1200)}.file-upload__drop-area.sc-nano-file-upload::after{content:\"\";position:absolute;border-width:1px;background-color:var(--color-drop-border);-webkit-mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;inset:0;transition:top var(--nano-transition-x-fast) ease-in-out, bottom var(--nano-transition-x-fast) ease-in-out, left var(--nano-transition-x-fast) ease-in-out, right var(--nano-transition-x-fast) ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--nano-color-success-1100);inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--color-drop-browse);text-decoration:underline;z-index:1;cursor:pointer;position:relative}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__list.sc-nano-file-upload{list-style:none;margin:var(--nano-spacing-xs) 0 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;animation:hideListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes hideListItem{0%{opacity:1}100%{opacity:0}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes showListItem{0%{opacity:0}100%{opacity:1}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--color-drop-bg);padding:var(--nano-spacing-xs);margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--nano-font-size-2xs);color:var(--color-text)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{--padding:0.406rem;background:var(--color-drop-bg);margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:var(--color-error)}.file-upload__drop-area.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0}.file-upload__button.sc-nano-file-upload{max-inline-size:100%;display:flex}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload{color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;display:flex;align-items:center;inline-size:auto;color:var(--color-btn-text);background:var(--color-btn-bg)}.is-invalid.sc-nano-file-upload-h .file-upload__clear-btn.sc-nano-file-upload{color:var(--color-error)}.file-upload__clear-btn.sc-nano-file-upload:focus-visible>nano-icon.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin:0.1rem 0 0 var(--nano-spacing-sm)}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0;display:block}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__icon.sc-nano-file-upload{align-self:center;margin-inline-start:var(--nano-spacing-sm);size:var(--nano-icon-size-small)}.file-upload__icon-error.sc-nano-file-upload{color:var(--color-error);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__icon-error.sc-nano-file-upload{opacity:1}.file-upload__icon-success.sc-nano-file-upload{color:var(--nano-color-success-1100);opacity:0}.file-upload--valid.sc-nano-file-upload .file-upload__icon-success.sc-nano-file-upload{opacity:1}";export{s as nano_file_upload}
+import{r as i,c as o,g as a,a as l}from"./index-BM3Om9WE.js";import{h as e}from"./renderer-BaP2L8CT.js";let n=0,t=()=>new DataTransfer;try{t()}catch{try{t=()=>new ClipboardEvent("").clipboardData,t()}catch{t=null}}const s=class{constructor(a){i(this,a),this.nanoChange=o(this,"nanoChange",7),this.nanoFocus=o(this,"nanoFocus",7),this.nanoBlur=o(this,"nanoBlur",7),this.nanoValidate=o(this,"nanoValidate",7)}inputEl;publicInputEl;mo;fileInputId="nano-file-upload-"+n++;canChangeFileList=!!t;removeFiles=[];hasHelperSlot;hasLabelSlot;errorMessage="";isDragging=!1;fileList=[];fileListChange(){this.canChangeFileList&&(this.publicInputEl.value="",this.inputEl.files=this.arrToFileList(this.fileList.map((i=>i.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="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(i){this._label=i}placeholder="Choose a file";hideLabel=!1;required=!1;disabled=!1;clearable=!1;showInlineError=!0;validateOn="submitThenDirty";form;shouldValidate(){this.inputEl&&(this.validate(),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.showInlineValidation()})))}_invalid=null;get invalid(){return this._invalid}get validityMessage(){return this.inputEl?this.inputEl.validationMessage:""}get files(){return this.inputEl?Array.from(this.inputEl.files).map((i=>(i.objectURL=URL.createObjectURL(i),i))):[]}set files(i){this.addNewFiles(this.arrToFileList(i))}get value(){return this.inputEl?this.inputEl.value:""}set value(i){""===i&&this.inputEl&&(this.fileList=[],this.inputEl.value="")}nanoChange;nanoFocus;nanoBlur;nanoValidate;async reportValidity(i){return i&&(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(i){this.inputEl&&(this.inputEl.setCustomValidity(i),this.showInlineValidation())}globalClickHandler(i){this.hasFocus&&i.composedPath().every((i=>i!==this.host))&&this.onBlur()}globalKeydownHandler(i){this.hasFocus&&"Tab"===i.key&&i.target!==this.inputEl&&this.onBlur()}onReset(i){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&i.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(i){const o=t();for(let a=0,l=i.length;a<l;a++)o.items.add(i[a]);return o.files}checkFileSize(i){return i/1e6<=this.maxFileSize}checkFileType(i){return!this.accept||!!i&&this.accept.match(i)&&this.accept.match(i).length>0}validate=()=>{let i;this.errorMessage="",this.inputEl.setCustomValidity(""),this.inputEl.validity.valid?this.fileList.length>this.maxFiles?i=`Maximum number of files exceeded (${this.maxFiles})`:this.fileList.forEach((o=>{let a=null;this.checkFileSize(o.file.size)?this.checkFileType(o.file.type)||(a=`File type is not allowed (${this.accept})`):a="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb",o.validationMessage=a,o.valid=!a,a&&(i=a)})):i=this.inputEl.validationMessage,i?this.inputEl.setCustomValidity(i):(this.inputEl.setCustomValidity(""),this.errorMessage="")};showInlineValidation(i){"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:i})}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(i){const o=Array.from(i).map((i=>({file:i,location:URL.createObjectURL(i),valid:!0,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const i=o.filter((i=>!this.fileList.find((o=>o.file.name===i.file.name))));this.fileList=[...this.fileList,...i]}else this.fileList=o}onInvalid=i=>{this.showInlineError&&i.preventDefault(),this.validate(),this.showInlineValidation(i)};onFileChoose=i=>{const o=i.target.files;o&&o.length&&this.addNewFiles(i.target.files)};onFileRemoveFileClick=(i,o)=>{this.canChangeFileList&&(this.removeFiles.push(o),i.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((i=>!this.removeFiles.find((o=>o===i))));try{this.removeFiles.forEach((i=>i.location?URL.revokeObjectURL(i.location):""))}catch(i){console.error(i)}this.removeFiles=[]}};onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};onDragStop=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!1};onDragStart=i=>{i.preventDefault(),i.stopPropagation(),this.isDragging=!0};onDrop=i=>{this.onDragStop(i),i.dataTransfer.files&&i.dataTransfer.files.length&&this.addNewFiles(i.dataTransfer.files)};disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}FileUploadInput=(i,o)=>{const a=this.fileInputId+"-lbl",l=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[e("div",{class:"file-upload__"+i+"-wrap"},e("label",{class:"file-upload__"+i,htmlFor:this.fileInputId,id:a,onDrop:i=>{this.onDrop(i),this.onDragStop(i)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&"drop"!==i)&&e("div",{class:"file-upload__label "+(this.hideLabel?"visually-hide":"")},this.label&&this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&"drop"!==i&&e("slot",{name:"label"})),"drop"===i&&e("div",{class:"file-upload__drop-area"},e("div",null,this.hasLabelSlot&&e("slot",{name:"label"})),e("div",null,"Drag and drop or ",e("span",null,"browse"))),"btn"===i&&e("div",{class:"file-upload__button button--keyline button--icon-start "+(this.hasFocus?"button--focus":"")},e("nano-cta",{secondary:!0,class:"file-upload__btn-content"},e("div",{class:"button",disabled:this.disabled},this.fileList.length?this.fileList[0].file.name:this.placeholder)),!!this.value&&this.clearable&&!this.disabled&&e("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"0","aria-label":"Clear selected file",onClick:this.onClearClick},e("nano-icon",{name:"light/xmark"})),!this.disabled&&this.showInlineError&&e("nano-icon",this._invalid?{name:"solid/circle-xmark",class:"file-upload__icon file-upload__icon-error"}:{name:"solid/circle-check",class:"file-upload__icon file-upload__icon-success"})),e("input",{"aria-labelledby":a+" "+l+" "+o,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:i=>{this.canChangeFileList?this.publicInputEl=i:this.inputEl=i},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),e("input",{name:this.canChangeFileList?this.name:void 0,form:this.form,ref:i=>{this.canChangeFileList&&(this.inputEl=i)},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?e("div",{class:"file-upload__more",id:l},this.showInlineError&&this.errorMessage.length?e("div",{class:"file-upload__error"},this.errorMessage):"",e("div",{class:"file-upload__help"},e("slot",{name:"helper"}))):""]};button=()=>this.FileUploadInput("btn");dropArea=()=>{const i=this.fileInputId+"-list";return[this.FileUploadInput("drop",i),e("output",{class:"file-upload__list-wrap",id:i},!!this.fileList&&this.fileList.length>0&&e("ul",{class:"file-upload__list list"},this.fileList.map((i=>e("li",{key:i.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:()=>this.onFileRemoveAnim()},e("span",{class:"list-title"},i.file.name),!i.valid&&e("nano-tooltip",{content:i.validationMessage,placement:"left"},e("nano-icon-button",{class:"list-button list-error",iconName:"light/triangle-exclamation",label:"File error"})),this.canChangeFileList&&e("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:i.location}),this.canChangeFileList&&e("nano-icon-button",{onClick:o=>this.onFileRemoveFileClick(o,i),class:"list-button list-button--remove",iconName:"light/xmark",label:"Remove file"}))))))]};render(){return e(l,{key:"c6fc291c7ac3c990d5304a2589c7dd1a0193333e",class:"nano-file-upload"},e("div",{key:"12fd1e6551fe6ff6e1eb6a84000a21e526c61c36",class:{"file-upload":!0,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":!0===this._invalid,"file-upload--valid":!1===this._invalid}},e(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;--color-error:var(--nano-color-danger-1100);--color-error-light:var(--nano-color-danger-100);--color-text:var(--nano-color-neutral-1400);--color-drop-browse:var(--nano-color-primary-1200);--color-drop-border:var(--nano-color-primary-1200);--color-drop-bg:var(--nano-color-primary-75);--drop-height:3.5em;--color-btn-bg:var(--nano-color-base-0);--color-btn-border:var(--nano-color-primary-1000);--color-btn-text:var(--nano-color-primary-1000)}[disabled].sc-nano-file-upload-h:not([disabled=false]){cursor:not-allowed}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload--invalid.sc-nano-file-upload{--color-drop-bg:var(--color-error-light)}.file-upload--dragging.sc-nano-file-upload{--color-drop-bg:var(--nano-color-success-50)}.file-upload__label.sc-nano-file-upload{font-size:var(--nano-font-size-xs);margin:0;line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__label.sc-nano-file-upload{color:var(--nano-color-neutral-1200)}.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%;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0;position:relative}.file-upload__more.sc-nano-file-upload:has(.file-upload__error) .file-upload__help.sc-nano-file-upload{display:none !important}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{inset-block-start:0;inset-inline-start:0;font-style:italic;font-size:var(--nano-font-size-2xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}.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(--color-error);opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1;display:block}.file-upload__help.sc-nano-file-upload{opacity:1;color:var(--color-text);display:block}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0;display:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__help.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.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(--color-drop-bg);color:var(--color-text);min-block-size:var(--drop-height);padding:var(--nano-spacing-md);display:flex;align-items:center;justify-content:center;position:relative;transition:background-color var(--nano-transition-x-fast) ease-in-out;font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose)}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{color:var(--nano-color-neutral-1200);background-color:var(--nano-color-neutral-300);border-color:var(--nano-color-neutral-1200)}.file-upload__drop-area.sc-nano-file-upload::after{content:\"\";position:absolute;border-width:1px;background-color:var(--color-drop-border);-webkit-mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");mask-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='white' stroke-width='2' stroke-dasharray='6%2c 8' stroke-dashoffset='0'/%3e%3c/svg%3e\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;inset:0;transition:top var(--nano-transition-x-fast) ease-in-out, bottom var(--nano-transition-x-fast) ease-in-out, left var(--nano-transition-x-fast) ease-in-out, right var(--nano-transition-x-fast) ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{background-color:var(--nano-color-success-1100);inset:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--color-drop-browse);text-decoration:underline;z-index:1;cursor:pointer;position:relative}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:var(--nano-color-neutral-1200);opacity:0.8}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__list.sc-nano-file-upload{list-style:none;margin:var(--nano-spacing-xs) 0 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;animation:hideListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes hideListItem{0%{opacity:1}100%{opacity:0}}.file-upload__list-item--active.sc-nano-file-upload{animation:showListItem var(--nano-transition-fast) ease-in-out forwards}@keyframes showListItem{0%{opacity:0}100%{opacity:1}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--color-drop-bg);padding:var(--nano-spacing-xs);margin-inline-end:2px;display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--nano-font-size-2xs);color:var(--color-text)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{--padding:0.406rem;background:var(--color-drop-bg);margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:var(--color-error)}.file-upload__drop-area.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload{margin-block:var(--nano-spacing-sm) 0}.file-upload__button.sc-nano-file-upload{max-inline-size:100%;display:flex}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload{color:var(--color-error)}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__clear-btn.sc-nano-file-upload{margin:0;font-size:inherit;padding:0;border:0;outline:none;display:flex;align-items:center;inline-size:auto;color:var(--color-btn-text);background:var(--color-btn-bg)}.is-invalid.sc-nano-file-upload-h .file-upload__clear-btn.sc-nano-file-upload{color:var(--color-error)}.file-upload__clear-btn.sc-nano-file-upload:focus-visible>nano-icon.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__clear-btn.sc-nano-file-upload .nano-icon.sc-nano-file-upload{margin:0.1rem 0 0 var(--nano-spacing-sm)}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0;display:block}.file-upload--focus.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload div.sc-nano-file-upload{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.file-upload__icon.sc-nano-file-upload{align-self:center;margin-inline-start:var(--nano-spacing-sm);size:var(--nano-icon-size-small)}.file-upload__icon-error.sc-nano-file-upload{color:var(--color-error);opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__icon-error.sc-nano-file-upload{opacity:1}.file-upload__icon-success.sc-nano-file-upload{color:var(--nano-color-success-1100);opacity:0}.file-upload--valid.sc-nano-file-upload .file-upload__icon-success.sc-nano-file-upload{opacity:1}";export{s as nano_file_upload}