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

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as e,c as t,a as i,d as n}from"./index-CFYZ-ZOT.js";import{h as a}from"./renderer-LJzCFyMt.js";import{p as s,a as o,c as d}from"./date-utils-BZYdjI1P.js";import{c as r}from"./theme-aiuyr36I.js";const c={d:"(\\d{1,2})",m:"(\\d{1,2})",y:"(\\d{4})"};let h=0;const l=class{constructor(i){e(this,i),this.nanoChange=t(this,"nanoChange",7),this.nanoValidate=t(this,"nanoValidate",7)}pickerEle;trigger;pickerCloseBtn;dropdown;input;directInput=!1;dateOrderIndeces={d:0,m:1,y:3};inputId="nano-input-"+h++;locale=window.navigator.languages||window.navigator.language||void 0;get host(){return i(this)}pattern;inputValue;get invalid(){return this._invalid}_invalid=!1;get validityMessage(){return this.input?this.input.validityMessage:""}helperText=!0;helperTextFormat={year:"numeric",month:"long",day:"numeric"};floatLabel=!1;name=this.inputId;readonly=!1;size;form;firstDayOfWeek;localization;disabled=!1;color;autofocus=!1;clearable=!1;label;placeholder;value="";handleValueChange(){this.directInput||(this.inputValue=this.formatIsoDate(this.value)),setTimeout((()=>{this.nanoChange.emit({value:this.value,date:s(this.value)})}),20),this.directInput=!1}validateOn="submitThenDirty";showInlineError=!0;dateOrder="dmy";handleDateOrderChange(){this.setDatePattern()}required=!1;min;max;hideLabel=!1;testDateValidity(){const e=s(this.value);let t,i,n="";this.value&&e&&(this.min&&(t=s(this.min))&&e<t&&(n="Date below the minimum: "+t.toLocaleDateString(this.locale,this.helperTextFormat)),this.max&&(i=s(this.max))&&e>i&&(n="Date above the maximum: "+i.toLocaleDateString(this.locale,this.helperTextFormat)),this.isDateDisabled(e)&&(n="Date selected is disabled.")),requestAnimationFrame((async()=>{if(!this.input)return;const t=await this.input.getInputElement();this.value.length&&!e&&(n="Please enter a valid date"),t.setCustomValidity(n),"dirty"===this.input.validateOn&&this.input.showError(n)}))}picker=!0;initialPickerDate;pickerOpen=!1;handlePickerOpenChange(){this.dropdown.open=this.pickerOpen}closeAfterPicked=!0;get dropDownConfig(){return this._dropDownConfig}set dropDownConfig(e){this._dropDownConfig={...this._dropDownConfig,...e}}_dropDownConfig={};get dateValue(){return s(this.value)}isDateDisabled=()=>!1;nanoChange;nanoValidate;async reportValidity(e){return(await this.input.reportValidity(e)).isValid&&e&&this.testDateValidity(),await this.input.reportValidity(e)}async setFocus(){this.input&&this.input.setFocus()}async getInputElement(){return await this.input.getInputElement()}async showError(e){this.input&&this.input.showError(e)}onInputChange=e=>{e.stopPropagation(),this.setValue(e.target.value)};onInputValidate=e=>{e.stopPropagation(),this._invalid=!e.detail.isValid,this.nanoValidate.emit({isValid:e.detail.isValid,errorMessage:e.detail.errorMessage,originalEvent:e.detail.originalEvent})};onInputKey=()=>{this.directInput=!0};onDatePicked=e=>{this.directInput=!1,this.value=e.detail.value,this.closeAfterPicked&&(this.pickerOpen=!1)};onDropdownHide=()=>{setTimeout((()=>this.pickerOpen=!1),200),setTimeout((()=>this.trigger.focus()),50)};onTriggerClick=()=>{this.pickerOpen||(this.pickerOpen=!0)};onTriggerKey=e=>{[" ","Enter"].includes(e.key)&&(this.pickerOpen||(this.pickerOpen=!0))};onCloseClick=()=>{this.pickerOpen&&(this.pickerOpen=!1)};onCloseKeyDown=e=>{"Tab"===e.key&&e.shiftKey&&(this.pickerEle.setFocus(!0),e.preventDefault())," "!==e.key&&"Enter"!==e.key||this.pickerOpen&&(this.pickerOpen=!1)};setDatePattern(){const e=[],t=[];Array.from(this.dateOrder).map(((i,n)=>{e.push(c[i]),this.dateOrderIndeces[i]=n,t.push("y"===i?"yyyy":i+i)})),this.pattern=e.join("\\W+"),this.placeholder||"false"===this.placeholder||(this.placeholder=t.join(" "))}formatIsoDate(e){const t=[];Array.from("ymd").map((e=>t.push(c[e])));const i=e.match(new RegExp(t.join("\\W+")));if(!i)return"";const n=[];return n[this.dateOrderIndeces.d]=i[3],n[this.dateOrderIndeces.m]=i[2],n[this.dateOrderIndeces.y]=i[1],n.join(" ")}setValue(e){const t=e.match(new RegExp(this.pattern));if(!t)return void(this.value=e);let i=d(t[this.dateOrderIndeces.y+1],t[this.dateOrderIndeces.m+1],t[this.dateOrderIndeces.d+1]);if(!i&&(i=new Date(e),!i))return void(this.value=e);const n=o(i);return this.value=n,n}connectedCallback(){console.warn('nano-date-input is deprecated and will be removed in a future version. Use nano-input with type="date" instead.'),this.setDatePattern(),this.handleValueChange()}componentDidLoad(){this.pickerCloseBtn&&this.picker&&(this.pickerEle.firstFocusEle=this.pickerCloseBtn,this.dropdown.tetherTo=this.trigger,setTimeout((()=>this.handlePickerOpenChange()),300))}render(){this.locale=navigator.languages||navigator.language||void 0,this.dropDownConfig.placement=this.dropDownConfig.placement||"bottom-end","rtl"===this.host.ownerDocument.dir&&this.dropDownConfig.placement.replace("start","end"),this.trigger&&(this.dropDownConfig.tetherTo=this.trigger);const e=s(this.value),t=!!this.host.querySelector('[slot="helper"]');return a(n,{key:"e5387f4d921d8ec1dd46a2e80bb68b98c6d050e0",class:{...r(this.color),"date-input":!0}},a("div",{key:"ee8bbe0b2c0923cc229e639179d0c7f4819cc665",class:"date-field"},a("nano-input",{key:"0c2062d026b56c893adba3ecc4ad545408083cd6",class:"date-field__input",slot:"trigger",required:this.required||void 0,showInlineError:this.showInlineError,validateOn:this.validateOn,placeholder:"false"!==this.placeholder?this.placeholder:void 0,pattern:this.pattern,label:this.label,disabled:this.disabled||void 0,color:this.color||void 0,autofocus:this.autofocus||void 0,clearable:this.clearable||void 0,onNanoChange:this.onInputChange,onNanoInput:this.onInputKey,onNanoValidate:this.onInputValidate,name:"",form:this.form||void 0,size:this.size||void 0,readonly:this.readonly,value:this.inputValue,ref:e=>this.input=e,floatLabel:this.floatLabel,hideLabel:this.hideLabel,inputmode:"numeric",part:"input"},a("slot",{key:"2faabea02873035c747b023251aa8ecd38b5eec8",name:"start",slot:"start"}),a("slot",{key:"7459e5f0c001018166fc25b40f0ebf8377d50269",name:"label",slot:"label"}),a("slot",{key:"2657702bbe0bbe221f092631c2f41e7cc296e301",name:"end",slot:"end"}),this.picker&&[a("button",{key:"fa62df397158bb262bf47ae9d3607424f2b65729",slot:"end",class:"date-field__open",type:"button",onKeyDown:this.onTriggerKey,onClick:this.onTriggerClick,ref:e=>this.trigger=e,disabled:this.disabled||this.readonly},a("nano-icon",{key:"9cb9ea18875aabffda4ffc384a5bee81a5337420",name:"light/calendar-days"})),a("nano-dropdown",{key:"c813474e3ab6b19d53cb090e72c47ff6e850f739",slot:"end",onNanoHide:this.onDropdownHide,dialogTitle:"Choose a date",class:"date-field__dropdown",ref:e=>this.dropdown=e,...this.dropDownConfig,part:"dropdown"},a("div",{key:"ebc1a186d359f6d3b33a94ebf20494cfa2d90bda"},a("div",{key:"59d1112f354d77f14240ca956ddf09a89940bb45",class:"date-field__close-bar"},a("button",{key:"d18615f69c49954bce85c962e99fee6c16e67451",class:"date-field__close",type:"button",onMouseDown:this.onCloseClick,onKeyDown:this.onCloseKeyDown,ref:e=>this.pickerCloseBtn=e},a("nano-icon",{key:"ece83cc846678beed11e322c9b52afc56b46356f",name:"light/xmark"}),a("span",{key:"60a6b3c6e95972f8307dd7d0f51bfe3d48e4da00",class:"vhidden"},"Close window"))),a("nano-date-picker",{key:"c5efd935b37738d00def7234e7bee1a60710ea75",isDateDisabled:this.isDateDisabled,onNanoDatePicked:this.onDatePicked,min:this.min||void 0,max:this.max||void 0,"is-modal":!0,ref:e=>this.pickerEle=e,localization:this.localization,selectedDate:this.value||this.initialPickerDate,firstDayOfWeek:this.firstDayOfWeek,color:this.color||void 0,part:"date-picker"})))],(t||this.helperText||this.showInlineError)&&a("span",{key:"c2aff5297c406107f98f07d6f3fd65fcbacbefc3",slot:"helper"},a("span",{key:"e429219f14b8b68e63682f83864ff8ba694c0ec1",class:{vhidden:!!this.value.length}},a("slot",{key:"2a2f1fab799e5826dfd41070959a48962d3bc754",name:"helper"})),this.helperText&&!!e&&a("span",{key:"d09144b4ef71b33dcecef9d50cb635e4d336c45d"},e.toLocaleDateString(this.locale,this.helperTextFormat)))),a("input",{key:"4d7826a5502e8574fca54bd09192be3980b0a95f",type:"hidden",value:this.value,name:this.name})))}static get watchers(){return{value:["handleValueChange","testDateValidity"],dateOrder:["handleDateOrderChange"],min:["testDateValidity"],max:["testDateValidity"],pickerOpen:["handlePickerOpenChange"]}}};l.style=".sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-date-input-h{display:inline-block;inline-size:100%;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--open-btn-color:var(--nano-button-color, #f0efed);--open-btn-border:none;--close-btn-color:var(--nano-button-color, #f0efed);--picker-base-size:16px}.nano-color.sc-nano-date-input-h{--focus-shadow:0 0 0 0.1875rem rgb(var(--nano-color-tint-rgb)/0.56)}.nano-icon.sc-nano-date-input{pointer-events:none}.date-field.sc-nano-date-input{display:flex;flex-direction:column;position:relative}.date-field__dropdown.sc-nano-date-input{--padding:0;--overflow:visible;padding:0 !important;inline-size:0 !important;inline-size:100%;z-index:var(--nano-layer-index-dropdown, 300) !important}.date-field__close-bar.sc-nano-date-input{align-items:center;display:flex;justify-content:space-between;text-overflow:ellipsis;white-space:nowrap;border:0;margin:0;overflow:visible;padding:0;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;inline-size:auto;z-index:1}.date-field__open.sc-nano-date-input{background:var(--open-btn-color);border:var(--open-btn-border);margin:0;appearance:none}.date-field__open.sc-nano-date-input:focus{box-shadow:var(--focus-shadow);outline:none}.date-field__close.sc-nano-date-input{align-items:center;appearance:none;background:var(--close-btn-color);border:0;border-radius:50%;cursor:pointer;display:flex;block-size:24px;justify-content:center;padding:0;inline-size:24px}@media (width >= 36em){.date-field__close.sc-nano-date-input{opacity:0}}.date-field__close.sc-nano-date-input:focus{box-shadow:var(--focus-shadow);outline:none}@media (width >= 36em){.date-field__close.sc-nano-date-input:focus{opacity:1}}.date-field__close.sc-nano-date-input .nano-icon.sc-nano-date-input{margin-block:0;margin-inline:auto}.date-field.sc-nano-date-input .nano-date-picker.sc-nano-date-input{font-size:var(--picker-base-size)}.vhidden.sc-nano-date-input{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}";export{l as nano_date_input}
+import{r as e,c as t,a as i,d as n}from"./index-DXvE-U_j.js";import{h as a}from"./renderer-BUaAsDso.js";import{p as s,a as o,c as d}from"./date-utils-BZYdjI1P.js";import{c as r}from"./theme-aiuyr36I.js";const c={d:"(\\d{1,2})",m:"(\\d{1,2})",y:"(\\d{4})"};let h=0;const l=class{constructor(i){e(this,i),this.nanoChange=t(this,"nanoChange",7),this.nanoValidate=t(this,"nanoValidate",7)}pickerEle;trigger;pickerCloseBtn;dropdown;input;directInput=!1;dateOrderIndeces={d:0,m:1,y:3};inputId="nano-input-"+h++;locale=window.navigator.languages||window.navigator.language||void 0;get host(){return i(this)}pattern;inputValue;get invalid(){return this._invalid}_invalid=!1;get validityMessage(){return this.input?this.input.validityMessage:""}helperText=!0;helperTextFormat={year:"numeric",month:"long",day:"numeric"};floatLabel=!1;name=this.inputId;readonly=!1;size;form;firstDayOfWeek;localization;disabled=!1;color;autofocus=!1;clearable=!1;label;placeholder;value="";handleValueChange(){this.directInput||(this.inputValue=this.formatIsoDate(this.value)),setTimeout((()=>{this.nanoChange.emit({value:this.value,date:s(this.value)})}),20),this.directInput=!1}validateOn="submitThenDirty";showInlineError=!0;dateOrder="dmy";handleDateOrderChange(){this.setDatePattern()}required=!1;min;max;hideLabel=!1;testDateValidity(){const e=s(this.value);let t,i,n="";this.value&&e&&(this.min&&(t=s(this.min))&&e<t&&(n="Date below the minimum: "+t.toLocaleDateString(this.locale,this.helperTextFormat)),this.max&&(i=s(this.max))&&e>i&&(n="Date above the maximum: "+i.toLocaleDateString(this.locale,this.helperTextFormat)),this.isDateDisabled(e)&&(n="Date selected is disabled.")),requestAnimationFrame((async()=>{if(!this.input)return;const t=await this.input.getInputElement();this.value.length&&!e&&(n="Please enter a valid date"),t.setCustomValidity(n),"dirty"===this.input.validateOn&&this.input.showError(n)}))}picker=!0;initialPickerDate;pickerOpen=!1;handlePickerOpenChange(){this.dropdown.open=this.pickerOpen}closeAfterPicked=!0;get dropDownConfig(){return this._dropDownConfig}set dropDownConfig(e){this._dropDownConfig={...this._dropDownConfig,...e}}_dropDownConfig={};get dateValue(){return s(this.value)}isDateDisabled=()=>!1;nanoChange;nanoValidate;async reportValidity(e){return(await this.input.reportValidity(e)).isValid&&e&&this.testDateValidity(),await this.input.reportValidity(e)}async setFocus(){this.input&&this.input.setFocus()}async getInputElement(){return await this.input.getInputElement()}async showError(e){this.input&&this.input.showError(e)}onInputChange=e=>{e.stopPropagation(),this.setValue(e.target.value)};onInputValidate=e=>{e.stopPropagation(),this._invalid=!e.detail.isValid,this.nanoValidate.emit({isValid:e.detail.isValid,errorMessage:e.detail.errorMessage,originalEvent:e.detail.originalEvent})};onInputKey=()=>{this.directInput=!0};onDatePicked=e=>{this.directInput=!1,this.value=e.detail.value,this.closeAfterPicked&&(this.pickerOpen=!1)};onDropdownHide=()=>{setTimeout((()=>this.pickerOpen=!1),200),setTimeout((()=>this.trigger.focus()),50)};onTriggerClick=()=>{this.pickerOpen||(this.pickerOpen=!0)};onTriggerKey=e=>{[" ","Enter"].includes(e.key)&&(this.pickerOpen||(this.pickerOpen=!0))};onCloseClick=()=>{this.pickerOpen&&(this.pickerOpen=!1)};onCloseKeyDown=e=>{"Tab"===e.key&&e.shiftKey&&(this.pickerEle.setFocus(!0),e.preventDefault())," "!==e.key&&"Enter"!==e.key||this.pickerOpen&&(this.pickerOpen=!1)};setDatePattern(){const e=[],t=[];Array.from(this.dateOrder).map(((i,n)=>{e.push(c[i]),this.dateOrderIndeces[i]=n,t.push("y"===i?"yyyy":i+i)})),this.pattern=e.join("\\W+"),this.placeholder||"false"===this.placeholder||(this.placeholder=t.join(" "))}formatIsoDate(e){const t=[];Array.from("ymd").map((e=>t.push(c[e])));const i=e.match(new RegExp(t.join("\\W+")));if(!i)return"";const n=[];return n[this.dateOrderIndeces.d]=i[3],n[this.dateOrderIndeces.m]=i[2],n[this.dateOrderIndeces.y]=i[1],n.join(" ")}setValue(e){const t=e.match(new RegExp(this.pattern));if(!t)return void(this.value=e);let i=d(t[this.dateOrderIndeces.y+1],t[this.dateOrderIndeces.m+1],t[this.dateOrderIndeces.d+1]);if(!i&&(i=new Date(e),!i))return void(this.value=e);const n=o(i);return this.value=n,n}connectedCallback(){console.warn('nano-date-input is deprecated and will be removed in a future version. Use nano-input with type="date" instead.'),this.setDatePattern(),this.handleValueChange()}componentDidLoad(){this.pickerCloseBtn&&this.picker&&(this.pickerEle.firstFocusEle=this.pickerCloseBtn,this.dropdown.tetherTo=this.trigger,setTimeout((()=>this.handlePickerOpenChange()),300))}render(){this.locale=navigator.languages||navigator.language||void 0,this.dropDownConfig.placement=this.dropDownConfig.placement||"bottom-end","rtl"===this.host.ownerDocument.dir&&this.dropDownConfig.placement.replace("start","end"),this.trigger&&(this.dropDownConfig.tetherTo=this.trigger);const e=s(this.value),t=!!this.host.querySelector('[slot="helper"]');return a(n,{key:"e5387f4d921d8ec1dd46a2e80bb68b98c6d050e0",class:{...r(this.color),"date-input":!0}},a("div",{key:"ee8bbe0b2c0923cc229e639179d0c7f4819cc665",class:"date-field"},a("nano-input",{key:"0c2062d026b56c893adba3ecc4ad545408083cd6",class:"date-field__input",slot:"trigger",required:this.required||void 0,showInlineError:this.showInlineError,validateOn:this.validateOn,placeholder:"false"!==this.placeholder?this.placeholder:void 0,pattern:this.pattern,label:this.label,disabled:this.disabled||void 0,color:this.color||void 0,autofocus:this.autofocus||void 0,clearable:this.clearable||void 0,onNanoChange:this.onInputChange,onNanoInput:this.onInputKey,onNanoValidate:this.onInputValidate,name:"",form:this.form||void 0,size:this.size||void 0,readonly:this.readonly,value:this.inputValue,ref:e=>this.input=e,floatLabel:this.floatLabel,hideLabel:this.hideLabel,inputmode:"numeric",part:"input"},a("slot",{key:"2faabea02873035c747b023251aa8ecd38b5eec8",name:"start",slot:"start"}),a("slot",{key:"7459e5f0c001018166fc25b40f0ebf8377d50269",name:"label",slot:"label"}),a("slot",{key:"2657702bbe0bbe221f092631c2f41e7cc296e301",name:"end",slot:"end"}),this.picker&&[a("button",{key:"fa62df397158bb262bf47ae9d3607424f2b65729",slot:"end",class:"date-field__open",type:"button",onKeyDown:this.onTriggerKey,onClick:this.onTriggerClick,ref:e=>this.trigger=e,disabled:this.disabled||this.readonly},a("nano-icon",{key:"9cb9ea18875aabffda4ffc384a5bee81a5337420",name:"light/calendar-days"})),a("nano-dropdown",{key:"c813474e3ab6b19d53cb090e72c47ff6e850f739",slot:"end",onNanoHide:this.onDropdownHide,dialogTitle:"Choose a date",class:"date-field__dropdown",ref:e=>this.dropdown=e,...this.dropDownConfig,part:"dropdown"},a("div",{key:"ebc1a186d359f6d3b33a94ebf20494cfa2d90bda"},a("div",{key:"59d1112f354d77f14240ca956ddf09a89940bb45",class:"date-field__close-bar"},a("button",{key:"d18615f69c49954bce85c962e99fee6c16e67451",class:"date-field__close",type:"button",onMouseDown:this.onCloseClick,onKeyDown:this.onCloseKeyDown,ref:e=>this.pickerCloseBtn=e},a("nano-icon",{key:"ece83cc846678beed11e322c9b52afc56b46356f",name:"light/xmark"}),a("span",{key:"60a6b3c6e95972f8307dd7d0f51bfe3d48e4da00",class:"vhidden"},"Close window"))),a("nano-date-picker",{key:"c5efd935b37738d00def7234e7bee1a60710ea75",isDateDisabled:this.isDateDisabled,onNanoDatePicked:this.onDatePicked,min:this.min||void 0,max:this.max||void 0,"is-modal":!0,ref:e=>this.pickerEle=e,localization:this.localization,selectedDate:this.value||this.initialPickerDate,firstDayOfWeek:this.firstDayOfWeek,color:this.color||void 0,part:"date-picker"})))],(t||this.helperText||this.showInlineError)&&a("span",{key:"c2aff5297c406107f98f07d6f3fd65fcbacbefc3",slot:"helper"},a("span",{key:"e429219f14b8b68e63682f83864ff8ba694c0ec1",class:{vhidden:!!this.value.length}},a("slot",{key:"2a2f1fab799e5826dfd41070959a48962d3bc754",name:"helper"})),this.helperText&&!!e&&a("span",{key:"d09144b4ef71b33dcecef9d50cb635e4d336c45d"},e.toLocaleDateString(this.locale,this.helperTextFormat)))),a("input",{key:"4d7826a5502e8574fca54bd09192be3980b0a95f",type:"hidden",value:this.value,name:this.name})))}static get watchers(){return{value:["handleValueChange","testDateValidity"],dateOrder:["handleDateOrderChange"],min:["testDateValidity"],max:["testDateValidity"],pickerOpen:["handlePickerOpenChange"]}}};l.style=".sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-date-input-h,*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-date-input-h{display:inline-block;inline-size:100%;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--open-btn-color:var(--nano-button-color, #f0efed);--open-btn-border:none;--close-btn-color:var(--nano-button-color, #f0efed);--picker-base-size:16px}.nano-color.sc-nano-date-input-h{--focus-shadow:0 0 0 0.1875rem rgb(var(--nano-color-tint-rgb)/0.56)}.nano-icon.sc-nano-date-input{pointer-events:none}.date-field.sc-nano-date-input{display:flex;flex-direction:column;position:relative}.date-field__dropdown.sc-nano-date-input{--padding:0;--overflow:visible;padding:0 !important;inline-size:0 !important;inline-size:100%;z-index:var(--nano-layer-index-dropdown, 300) !important}.date-field__close-bar.sc-nano-date-input{align-items:center;display:flex;justify-content:space-between;text-overflow:ellipsis;white-space:nowrap;border:0;margin:0;overflow:visible;padding:0;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;inline-size:auto;z-index:1}.date-field__open.sc-nano-date-input{background:var(--open-btn-color);border:var(--open-btn-border);margin:0;appearance:none}.date-field__open.sc-nano-date-input:focus{box-shadow:var(--focus-shadow);outline:none}.date-field__close.sc-nano-date-input{align-items:center;appearance:none;background:var(--close-btn-color);border:0;border-radius:50%;cursor:pointer;display:flex;block-size:24px;justify-content:center;padding:0;inline-size:24px}@media (width >= 36em){.date-field__close.sc-nano-date-input{opacity:0}}.date-field__close.sc-nano-date-input:focus{box-shadow:var(--focus-shadow);outline:none}@media (width >= 36em){.date-field__close.sc-nano-date-input:focus{opacity:1}}.date-field__close.sc-nano-date-input .nano-icon.sc-nano-date-input{margin-block:0;margin-inline:auto}.date-field.sc-nano-date-input .nano-date-picker.sc-nano-date-input{font-size:var(--picker-base-size)}.vhidden.sc-nano-date-input{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}";export{l as nano_date_input}

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,a as e,d as i}from"./index-CFYZ-ZOT.js";import{h as a,t as o}from"./renderer-LJzCFyMt.js";import{i as s,g as r,b as l,D as c,p as d,d as h,s as u,e as p,f as b,h as f,j as _,k as m,l as v,a as y}from"./date-utils-BZYdjI1P.js";import{c as g}from"./dom-CF0Ycs9M.js";import{a as k}from"./throttle-C93FMm2Z.js";import{F as x,a as w}from"./form-control-DXPQniNX.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:i,onKeyboardNavigation:o,focusedDayRef:r,inRange:l,disabled:c,isSelected:d})=>{const h=s(e,t),u=s(e,n),p=e.getMonth()!==n.getMonth()||c,b=!l;return a("button",{class:{"duet-date__day":!0,"is-outside":b,"is-disabled":p,"is-today":h},tabIndex:u?0:-1,onClick:function(n){i(n,e)},onKeyDown:o,disabled:b,type:"button","aria-pressed":d?"true":"false",ref:n=>{u&&n&&r&&r(n)}},a("span",{"aria-hidden":"true"},e.getDate()),a("span",{class:"duet-date__vhidden"},e.toLocaleDateString(void 0,{day:"numeric",month:"long"})))},C=({selectedDate:n,focusedDate:t,labelledById:e,localization:i,firstDayOfWeek:o,min:c,max:d,onDateSelect:h,onKeyboardNavigation:u,focusedDayRef:p,onMouseDown:b,onFocusIn:f,isDateDisabled:_})=>{const m=new Date,v=r(t,o);return a("table",{class:"duet-date__table",role:"grid","aria-labelledby":e,onFocusin:f,onMouseDown:b},a("thead",null,a("tr",null,(g=o,k=n=>a("th",{class:"duet-date__table-header",scope:"col"},a("span",{"aria-hidden":"true"},n.substring(0,2)),a("span",{class:"duet-date__vhidden"},n)),(y=i.dayNames).map(((n,t)=>k(y[(t+g)%y.length])))))),a("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=>a("tr",{class:"duet-date__row"},e.map((e=>a("td",{class:"duet-date__cell",role:"gridcell","aria-selected":s(e,n)?"true":void 0},a(D,{day:e,today:m,focusedDay:t,inRange:l(e,c,d),onDaySelect:h,onKeyboardNavigation:u,focusedDayRef:p,disabled:_(e),isSelected:s(e,n)})))))))));var y,g,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()),20):(clearTimeout(this.focusTimeoutId),this.focusTimeoutId=setTimeout((()=>{this.monthSelectNode.focus()}),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(u(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(p(this.focusedDay,this.firstDayOfWeek))}setMonth(n){const t=b(f(this.focusedDay),n),e=_(t),i=b(this.focusedDay,n);this.setFocusedDay(m(i,t,e))}setYear(n){const t=v(f(this.focusedDay),n),e=_(t),i=v(this.focusedDay,n);this.setFocusedDay(m(i,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,i=t.pageY-this.initialTouchY;Math.abs(e)>=70&&Math.abs(i)<=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=y(n),this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:n})}processFocusedDayNode=n=>{this.focusedDayNode=n,this.activeFocus&&setTimeout((()=>n.focus()),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 u=t-10,p=t+10;return s&&(u=s.getFullYear()),r&&(p=r.getFullYear()),a(i,{key:"476708135e014efc8662dcfdd6877bfa21ef6f31",class:"nano-date-picker"},a("div",{key:"4ff36de5c9e6c86fa26638db70514f12fad96262",class:"duet-date"},a("div",{key:"544a676f3354fc3cd0a6c0f1fd8610d47c5c586b",class:{"duet-date__dialog":!0,"is-active":!0},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},a("div",{key:"94665c51ab3ee801e6affb6be91076777f329665",class:"duet-date__dialog-content"},a("div",{key:"3e014e07dd3f43808bdb99fbc79c6f81958328ac",class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),a("div",{key:"6759c71255f8ff0c05a56e118ad628afc7f1af43",class:"duet-date__header",onFocusin:this.disableActiveFocus},a("div",{key:"b0688e27b47a95fbb8c051d0680975741547762e"},a("h2",{key:"1bb4b0035cc07304248c496c55077a88d43d57f5",id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[e]," ",this.focusedDay.getFullYear()),a("label",{key:"e740c878525a794eaac04b44c4770edaa5a1d780",htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),a("div",{key:"658b004a5ae3e50070a2683f92c68b924246a4e9",class:"duet-date__select"},a("select",{key:"3a99660e9c05ca78d5945b4a8dd581f3fcd64fff",id:this.monthSelectId,class:"duet-date__select--month",ref:n=>this.firstFocusableElement=this.monthSelectNode=n,onChange:this.handleMonthSelect},this.localization.monthNames.map(((n,t)=>a("option",{key:n,value:t,selected:t===e,disabled:!l(new Date(o,t,1),s?f(s):null,r?_(r):null)},n)))),a("div",{key:"6c9f19bbd85e2d6bd16e06b87507599a77f3b8e0",class:"duet-date__select-label","aria-hidden":"true"},a("span",{key:"94813adbb53c491d53045106a0e97e68ecc8a257"},this.localization.monthNamesShort[e]),a("nano-icon",{key:"d6d867b3732097902ac0b537d055ec0eb6dbb11f",name:"light/chevron-down"}))),a("label",{key:"a77adf78db5d8f2ec2998526c2d5d2882fb01a24",htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),a("div",{key:"fe5d77c1f3d5cb7bc8ba2befd232b001fcafa8da",class:"duet-date__select"},a("select",{key:"3585692273f5bdfdb58e1e265bb6b754708cb69a",id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect},function(n,t){const e=[];for(let i=n;i<=t;i++)e.push(i);return e}(u,p).map((n=>a("option",{key:n,selected:n===o},n)))),a("div",{key:"ce1137c980183ccffc195f83bdc5147de3f8194b",class:"duet-date__select-label","aria-hidden":"true"},a("span",{key:"a5d3e28fdbb1b4192f51da8009cce094558db3c0"},this.focusedDay.getFullYear()),a("nano-icon",{key:"0958bff2d269607480fb9475f4a58df147885f4b",name:"light/chevron-down"})))),a("div",{key:"d49585f3b292ba85ed013e52a5a042cb55601937",class:"duet-date__nav"},a("button",{key:"1f3f492d1965e6416a5fac52db0ecba7864b8df7",class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},a("nano-icon",{key:"abe59d338029675ad55a5e7faab8170ca2c2af2f",name:"light/chevron-left"}),a("span",{key:"7d59fa5d95085c6d66d93f95c953e9a2f74b8a5f",class:"duet-date__vhidden"},this.localization.prevMonthLabel)),a("button",{key:"a895a7b901ca21fa32710c3a187ce263cf105908",class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},a("nano-icon",{key:"b8737eb28e5ad5873f40523a557745a338aa5277",name:"light/chevron-right"}),a("span",{key:"2c98c7be89ce30939c647f7faea1c531fa0d38a9",class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),a("div",{key:"42284a65a7e2bb5302cd75a61f19a691ea1236bd"},a(C,{key:"d548838275eecb1a2dff47851e9fd57c9f49f691",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 F=class{nativeInput;inputId="nano-input-"+M++;didBlurAfterEdit=!1;rtl=!1;mo;charCount=0;hasRendered=!1;pickerDropdown;picker;pickerCloseBtn;_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("")),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.validate()}))}get valueAsNumber(){return"textarea"===this.type?NaN:this.nativeInput?.valueAsNumber||NaN}get valueAsDate(){return"textarea"===this.type?null:new Date(this.value)||null}showCharCount=!1;shouldValidate(){this.hasRendered&&requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.validate()}))}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;g(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()}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:i,errorMessage:a,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:u,showCharCount:p,rtl:b,hasHelperEndSlot:f})=>({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:i,errorMessage:a,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:u,showCharCount:p,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 a(i,{key:"1601bf765681a833b22c05294a1c8d9b5c6be5ee","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}},a("div",{key:"3db99291d328de9684137597706b79e4f24b65e2",style:{width:"100%"}},a(x,{key:"df525275b5c35b9ae3fdc793766a9af759740076",...s,class:{"has-helper":this.hasHelperSlot,"has-error":!!this.errorMessage&&this.showInlineError&&!0===this._invalid}},a(w,{key:"8f25ff2340431b2ea29d5063877ad376ec229758",...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&&[a("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)},a("nano-icon-button",{label:"Open date picker",iconName:"light/calendar-days",slot:"trigger",class:"input__date-trigger"}),a("div",null,a("div",{class:"date-field__close-bar"},a("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})),a("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&&a("input",{key:"97734d0168a049af1b22e4517db5e58d25a75b13",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&&a("textarea",{key:"b1780aa8cf51d8b7440825d461d89e8746fcd96d",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}))),a("slot",{key:"fa333ee624b824af60a8a79d09720e231e8d455c"})))}static get watchers(){return{datalist:["setDataListOpts"],debounce:["debounceChanged"],value:["valueChanged"],minlength:["shouldValidate"],maxlength:["shouldValidate"],min:["shouldValidate"],max:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"],readonly:["shouldValidate"],pattern:["shouldValidate"],inputmode:["shouldValidate"],type:["shouldValidate"]}}};F.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  inline-size: 100%;\n  overflow: clip;\n  white-space: nowrap;\n  text-overflow: ellipsis;\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  block-size: 1em;\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.has-helper.sc-nano-input .form-ctrl__more.sc-nano-input, .has-error.sc-nano-input .form-ctrl__more.sc-nano-input {\n  display: block;\n  opacity: 1;\n}\n\n.form-ctrl__helper.sc-nano-input, .form-ctrl__error.sc-nano-input {\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  position: absolute;\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] .form-ctrl__helper.sc-nano-input, [disabled]).is-invalid.sc-nano-input-h .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,F as nano_input}
+import{r as n,c as t,a as e,d as i}from"./index-DXvE-U_j.js";import{h as a,t as o}from"./renderer-BUaAsDso.js";import{i as s,g as r,b as l,D as c,p as d,d as h,s as u,e as p,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-Cb7FUtXp.js";import{a as k}from"./throttle-C93FMm2Z.js";import{F as x,a as w}from"./form-control-BOVGZF9R.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:i,onKeyboardNavigation:o,focusedDayRef:r,inRange:l,disabled:c,isSelected:d})=>{const h=s(e,t),u=s(e,n),p=e.getMonth()!==n.getMonth()||c,b=!l;return a("button",{class:{"duet-date__day":!0,"is-outside":b,"is-disabled":p,"is-today":h},tabIndex:u?0:-1,onClick:function(n){i(n,e)},onKeyDown:o,disabled:b,type:"button","aria-pressed":d?"true":"false",ref:n=>{u&&n&&r&&r(n)}},a("span",{"aria-hidden":"true"},e.getDate()),a("span",{class:"duet-date__vhidden"},e.toLocaleDateString(void 0,{day:"numeric",month:"long"})))},C=({selectedDate:n,focusedDate:t,labelledById:e,localization:i,firstDayOfWeek:o,min:c,max:d,onDateSelect:h,onKeyboardNavigation:u,focusedDayRef:p,onMouseDown:b,onFocusIn:f,isDateDisabled:_})=>{const m=new Date,v=r(t,o);return a("table",{class:"duet-date__table",role:"grid","aria-labelledby":e,onFocusin:f,onMouseDown:b},a("thead",null,a("tr",null,(y=o,k=n=>a("th",{class:"duet-date__table-header",scope:"col"},a("span",{"aria-hidden":"true"},n.substring(0,2)),a("span",{class:"duet-date__vhidden"},n)),(g=i.dayNames).map(((n,t)=>k(g[(t+y)%g.length])))))),a("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=>a("tr",{class:"duet-date__row"},e.map((e=>a("td",{class:"duet-date__cell",role:"gridcell","aria-selected":s(e,n)?"true":void 0},a(D,{day:e,today:m,focusedDay:t,inRange:l(e,c,d),onDaySelect:h,onKeyboardNavigation:u,focusedDayRef:p,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()),20):(clearTimeout(this.focusTimeoutId),this.focusTimeoutId=setTimeout((()=>{this.monthSelectNode.focus()}),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(u(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(p(this.focusedDay,this.firstDayOfWeek))}setMonth(n){const t=b(f(this.focusedDay),n),e=_(t),i=b(this.focusedDay,n);this.setFocusedDay(m(i,t,e))}setYear(n){const t=v(f(this.focusedDay),n),e=_(t),i=v(this.focusedDay,n);this.setFocusedDay(m(i,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,i=t.pageY-this.initialTouchY;Math.abs(e)>=70&&Math.abs(i)<=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()),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 u=t-10,p=t+10;return s&&(u=s.getFullYear()),r&&(p=r.getFullYear()),a(i,{key:"476708135e014efc8662dcfdd6877bfa21ef6f31",class:"nano-date-picker"},a("div",{key:"4ff36de5c9e6c86fa26638db70514f12fad96262",class:"duet-date"},a("div",{key:"544a676f3354fc3cd0a6c0f1fd8610d47c5c586b",class:{"duet-date__dialog":!0,"is-active":!0},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},a("div",{key:"94665c51ab3ee801e6affb6be91076777f329665",class:"duet-date__dialog-content"},a("div",{key:"3e014e07dd3f43808bdb99fbc79c6f81958328ac",class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),a("div",{key:"6759c71255f8ff0c05a56e118ad628afc7f1af43",class:"duet-date__header",onFocusin:this.disableActiveFocus},a("div",{key:"b0688e27b47a95fbb8c051d0680975741547762e"},a("h2",{key:"1bb4b0035cc07304248c496c55077a88d43d57f5",id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[e]," ",this.focusedDay.getFullYear()),a("label",{key:"e740c878525a794eaac04b44c4770edaa5a1d780",htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),a("div",{key:"658b004a5ae3e50070a2683f92c68b924246a4e9",class:"duet-date__select"},a("select",{key:"3a99660e9c05ca78d5945b4a8dd581f3fcd64fff",id:this.monthSelectId,class:"duet-date__select--month",ref:n=>this.firstFocusableElement=this.monthSelectNode=n,onChange:this.handleMonthSelect},this.localization.monthNames.map(((n,t)=>a("option",{key:n,value:t,selected:t===e,disabled:!l(new Date(o,t,1),s?f(s):null,r?_(r):null)},n)))),a("div",{key:"6c9f19bbd85e2d6bd16e06b87507599a77f3b8e0",class:"duet-date__select-label","aria-hidden":"true"},a("span",{key:"94813adbb53c491d53045106a0e97e68ecc8a257"},this.localization.monthNamesShort[e]),a("nano-icon",{key:"d6d867b3732097902ac0b537d055ec0eb6dbb11f",name:"light/chevron-down"}))),a("label",{key:"a77adf78db5d8f2ec2998526c2d5d2882fb01a24",htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),a("div",{key:"fe5d77c1f3d5cb7bc8ba2befd232b001fcafa8da",class:"duet-date__select"},a("select",{key:"3585692273f5bdfdb58e1e265bb6b754708cb69a",id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect},function(n,t){const e=[];for(let i=n;i<=t;i++)e.push(i);return e}(u,p).map((n=>a("option",{key:n,selected:n===o},n)))),a("div",{key:"ce1137c980183ccffc195f83bdc5147de3f8194b",class:"duet-date__select-label","aria-hidden":"true"},a("span",{key:"a5d3e28fdbb1b4192f51da8009cce094558db3c0"},this.focusedDay.getFullYear()),a("nano-icon",{key:"0958bff2d269607480fb9475f4a58df147885f4b",name:"light/chevron-down"})))),a("div",{key:"d49585f3b292ba85ed013e52a5a042cb55601937",class:"duet-date__nav"},a("button",{key:"1f3f492d1965e6416a5fac52db0ecba7864b8df7",class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},a("nano-icon",{key:"abe59d338029675ad55a5e7faab8170ca2c2af2f",name:"light/chevron-left"}),a("span",{key:"7d59fa5d95085c6d66d93f95c953e9a2f74b8a5f",class:"duet-date__vhidden"},this.localization.prevMonthLabel)),a("button",{key:"a895a7b901ca21fa32710c3a187ce263cf105908",class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},a("nano-icon",{key:"b8737eb28e5ad5873f40523a557745a338aa5277",name:"light/chevron-right"}),a("span",{key:"2c98c7be89ce30939c647f7faea1c531fa0d38a9",class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),a("div",{key:"42284a65a7e2bb5302cd75a61f19a691ea1236bd"},a(C,{key:"d548838275eecb1a2dff47851e9fd57c9f49f691",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 F=0;const M=class{nativeInput;inputId="nano-input-"+F++;didBlurAfterEdit=!1;rtl=!1;mo;charCount=0;hasRendered=!1;pickerDropdown;picker;pickerCloseBtn;_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("")),requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.validate()}))}get valueAsNumber(){return"textarea"===this.type?NaN:this.nativeInput?.valueAsNumber||NaN}get valueAsDate(){return"textarea"===this.type?null:new Date(this.value)||null}showCharCount=!1;shouldValidate(){this.hasRendered&&requestAnimationFrame((()=>{"dirty"===this.validateOn&&this.validate()}))}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()}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:i,errorMessage:a,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:u,showCharCount:p,rtl:b,hasHelperEndSlot:f})=>({el:n,floatLabel:t,label:e,alwaysShowPlaceholder:i,errorMessage:a,type:o,showInlineError:s,hasHelperSlot:r,hasLabelSlot:l,hideLabel:c,placeholder:d,maxlength:h,charCount:u,showCharCount:p,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 a(i,{key:"1601bf765681a833b22c05294a1c8d9b5c6be5ee","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}},a("div",{key:"3db99291d328de9684137597706b79e4f24b65e2",style:{width:"100%"}},a(x,{key:"df525275b5c35b9ae3fdc793766a9af759740076",...s,class:{"has-helper":this.hasHelperSlot,"has-error":!!this.errorMessage&&this.showInlineError&&!0===this._invalid}},a(w,{key:"8f25ff2340431b2ea29d5063877ad376ec229758",...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&&[a("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)},a("nano-icon-button",{label:"Open date picker",iconName:"light/calendar-days",slot:"trigger",class:"input__date-trigger"}),a("div",null,a("div",{class:"date-field__close-bar"},a("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})),a("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&&a("input",{key:"97734d0168a049af1b22e4517db5e58d25a75b13",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&&a("textarea",{key:"b1780aa8cf51d8b7440825d461d89e8746fcd96d",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}))),a("slot",{key:"fa333ee624b824af60a8a79d09720e231e8d455c"})))}static get watchers(){return{datalist:["setDataListOpts"],debounce:["debounceChanged"],value:["valueChanged"],minlength:["shouldValidate"],maxlength:["shouldValidate"],min:["shouldValidate"],max:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"],readonly:["shouldValidate"],pattern:["shouldValidate"],inputmode:["shouldValidate"],type:["shouldValidate"]}}};M.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  inline-size: 100%;\n  overflow: clip;\n  white-space: nowrap;\n  text-overflow: ellipsis;\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  block-size: 1em;\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.has-helper.sc-nano-input .form-ctrl__more.sc-nano-input, .has-error.sc-nano-input .form-ctrl__more.sc-nano-input {\n  display: block;\n  opacity: 1;\n}\n\n.form-ctrl__helper.sc-nano-input, .form-ctrl__error.sc-nano-input {\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  position: absolute;\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] .form-ctrl__helper.sc-nano-input, [disabled]).is-invalid.sc-nano-input-h .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,M 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,d as i}from"./index-CFYZ-ZOT.js";import{h as n}from"./renderer-LJzCFyMt.js";import{H as a}from"./slot-DBzVpliZ.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");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.attachMo()}disconnectedCallback(){this.mo&&(this.mo.disconnect(),this.mo=void 0),this.bodyEl&&this.bodyEl.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return n(i,{key:"dfe08b9736512e4f2e7e77b6e08f391e570f7d35",class:"nano-details"},n("details",{key:"aee47095a745ec92d97e3eb2a09f1765fbad251d",part:"base",ref:t=>this.detailsEl=t,class:{details:!0,disabled:this.disabled}},n("summary",{key:"b15a83c3386171f212a68cf456eb9ba6296917c2",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:"c29db27dc0c74a8053c035421b0738eee1d72945",part:"icon icon--start",class:"icon icon--start"},n("slot",{key:"99381aa8452aac30498cfb27148c9e507e07989e",name:"icon-start"})),n("div",{key:"59068fae315b9cd0427987eb59e03f2cd219e45a",part:"label",class:"label"},this.label?this.label:n("slot",{name:"label"})),n("span",{key:"8eb4304e5c0da199ef6ad7a9730f92130072afd8",part:"icon icon--end",class:"icon icon--end"},n("slot",this.open?{name:"icon-collapse"}:{name:"icon-expand"}),n("slot",{key:"a8c2b9213b96787007a85faf64d42436729bc6e4",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:"bfb3677f307b23b4947c80d7173b63ce51b83c70",class:"default-icon",name:"light/chevron-down"})))),n("div",{key:"dad8f7fbf316facfc2a505edf0041fb259d78d5b",part:"body",class:"body",ref:t=>this.bodyEl=t,role:"region","aria-labelledby":"header"},n("div",{key:"988b4a6201029002ab76004375955eaa87542ed9",class:"content-wrapper"},n("div",{key:"159483b132abfc6d7edf87771af0f3c2c0e077bd",part:"content",class:"content",id:"content"},n("slot",{key:"8bb9bbca225bca84bc1efd2c617372f490985bc1"}))))))}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-l);line-height:var(--nano-line-height-dense)}: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-medium);line-height:var(--nano-line-height-dense)}.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,d as i}from"./index-DXvE-U_j.js";import{h as n}from"./renderer-BUaAsDso.js";import{H as a}from"./slot-DYFgWo5f.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");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:"6bd0b907e8036bffdc232f11520fc7e7ecbd5274",class:"nano-details"},n("details",{key:"a375256a375ffa1c52f7e425328add65396d79ae",part:"base",ref:t=>this.detailsEl=t,class:{details:!0,disabled:this.disabled}},n("summary",{key:"6532629e3d2258dd7b35aa9c088c290cfd586111",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:"2a91b1368bfb4120d3356c59a6c277a2608f1ff9",part:"icon icon--start",class:"icon icon--start"},n("slot",{key:"6ec67523e758f1f189a9c2339e48116f19423a87",name:"icon-start"})),n("div",{key:"83c975864586f752a86bd13b78ba7a2329f3a484",part:"label",class:"label"},this.label?this.label:n("slot",{name:"label"})),n("span",{key:"538494f4cd43b12143151ce1523533efb70800b7",part:"icon icon--end",class:"icon icon--end"},n("slot",this.open?{name:"icon-collapse"}:{name:"icon-expand"}),n("slot",{key:"9cd7a3d39754029ad70d3b8976545513a7d6f77b",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:"0321927f47cbc530e8044598fec3370dfedbb325",class:"default-icon",name:"light/chevron-down"})))),n("div",{key:"a7366fb51de087f7c6f5d7da59e761050b2ab231",part:"body",class:"body",ref:t=>this.bodyEl=t,role:"region","aria-labelledby":"header"},n("div",{key:"dd888954cdfba45da62a01d10f7b010a0277b7ec",class:"content-wrapper"},n("div",{key:"eff6dbb8d4a41d9957d135e2f1e7470e37615255",part:"content",class:"content",id:"content"},n("slot",{key:"9b2fd79fc46ad9b9c5c7c6a39a856b20b87bca6a"}))))))}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-l);line-height:var(--nano-line-height-dense)}: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-medium);line-height:var(--nano-line-height-dense)}.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 o,c as a,a as i,d as t}from"./index-CFYZ-ZOT.js";import{h as e}from"./renderer-LJzCFyMt.js";import{M as n}from"./modal-B50PWCuY.js";import{l as s,u as r}from"./scroll-BRRzrkAi.js";import{H as d}from"./slot-DBzVpliZ.js";import{C as l}from"./component-store-DqCSKpAK.js";import{g as h}from"./tabbable-BpHwrUYt.js";import"./dom-CF0Ycs9M.js";import"./throttle-C93FMm2Z.js";let c=0;const f=class{constructor(i){o(this,i),this.nanoShow=a(this,"nanoShow",7),this.nanoAfterShow=a(this,"nanoAfterShow",7),this.nanoHide=a(this,"nanoHide",7),this.nanoAfterHide=a(this,"nanoAfterHide",7),this.nanoInitialFocus=a(this,"nanoInitialFocus",7),this.nanoRequestClose=a(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(o){this._panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd),o.addEventListener("transitionend",this.handleTransitionEnd),this._panel=o}_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 o=this.host.querySelector("[autofocus]");o&&o.removeAttribute("autofocus"),this.host.addEventListener("nanoAfterShow",(()=>{this.nanoInitialFocus.emit().defaultPrevented||(o||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 o=this.originalTrigger;o&&(o.setFocus&&"function"==typeof o.setFocus?o.setFocus():o.focus()),setTimeout((()=>{this.open||"function"!=typeof this.dialog?.hidePopover||this.dialog.hidePopover(),r(this.host)}),300)}handleKeyDown=o=>{"Escape"===o.key&&this.requestClose()};requestClose=()=>{this.nanoRequestClose.emit().defaultPrevented||this.noUserDismiss?(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250)):this.hide()};handleTransitionEnd=o=>{"opacity"===o.propertyName&&o.composedPath().find((o=>o===this.panel||o===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((o=>{"video"===o.tagName.toLowerCase()?o.pause():o.src=o.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:"40e8bc877fd5b34bbc02b9ab28a331d6bf81415a",class:"nano-dialog"},e("div",{key:"3d8c4f2b68831a42039e597d532e2efe680082df",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:o=>this.dialog=o,popover:"manual"},e("div",{key:"48ec09fb5c08830fd9f4f54e528ce47d16dcf60e",part:"overlay",class:"dialog__overlay",ref:o=>this.overlay=o,onClick:this.requestClose}),e("div",{key:"9b28aef25fc3054e329e87293e1f24b1f7bd4f63",ref:o=>this.panel=o,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:"a25853d8c1d11e52235d6d9300cc39e529b3306f",class:"dialog__body-wrap"},!this.noHeader&&e("nano-sticker",{key:"111ee49da4468e834046ecef442873d7956a9a8f"},e("header",{key:"5f40b8920bd3b7ddac34d08593752cdc58a64f4f",part:"header",class:"dialog__header"},e("span",{key:"2f35793fb4c9009db7321c27feed4448c5a67ada",part:"title",class:"dialog__title",id:`${this.componentId}-title`},e("slot",{key:"0b5de133cf8f63237cccafb96fbe635c82bdf8fb",name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&e("nano-icon-button",{key:"d517fbc641ba1e35040f08e1ba53b56d2e2f1fcd",part:"close-button",exportparts:"base:close-button__base",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/xmark"}))),e("div",{key:"d09658d8fa0c306068e4ccf77dbae233e345a648",part:"body",class:"dialog__body"},e("slot",{key:"46ef0d9c1ca1a136e15baa859a19b7e46e467d3c"})),this.slotCtrl.has("footer")&&e("nano-sticker",{key:"86dc8c994c6e3d3f7677ce9c032a3a1b9433a5e3",position:"bottom"},e("footer",{key:"6876b4a53b64469170ee81c6d442e217c844596f",part:"footer",class:"dialog__footer"},e("slot",{key:"faff1e531b53fc1895ade69bcdf8360ceedfa619",name:"footer"})))))))}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:0;--content-background:var(--nano-color-neutral-75);--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)}.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{f as nano_dialog}
+import{r as o,c as a,a as i,d as t}from"./index-DXvE-U_j.js";import{h as e}from"./renderer-BUaAsDso.js";import{M as n}from"./modal-B_AxJQQp.js";import{l as s,u as r}from"./scroll-iCYjzh9N.js";import{H as d}from"./slot-DYFgWo5f.js";import{C as l}from"./component-store-CH5BI3Tg.js";import{g as h}from"./tabbable-C4l-rYq9.js";import"./dom-Cb7FUtXp.js";import"./throttle-C93FMm2Z.js";let c=0;const f=class{constructor(i){o(this,i),this.nanoShow=a(this,"nanoShow",7),this.nanoAfterShow=a(this,"nanoAfterShow",7),this.nanoHide=a(this,"nanoHide",7),this.nanoAfterHide=a(this,"nanoAfterHide",7),this.nanoInitialFocus=a(this,"nanoInitialFocus",7),this.nanoRequestClose=a(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(o){this._panel&&this.panel.removeEventListener("transitionend",this.handleTransitionEnd),o.addEventListener("transitionend",this.handleTransitionEnd),this._panel=o}_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 o=this.host.querySelector("[autofocus]");o&&o.removeAttribute("autofocus"),this.host.addEventListener("nanoAfterShow",(()=>{this.nanoInitialFocus.emit().defaultPrevented||(o||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 o=this.originalTrigger;o&&(o.setFocus&&"function"==typeof o.setFocus?o.setFocus():o.focus()),setTimeout((()=>{this.open||"function"!=typeof this.dialog?.hidePopover||this.dialog.hidePopover(),r(this.host)}),300)}handleKeyDown=o=>{"Escape"===o.key&&this.requestClose()};requestClose=()=>{this.nanoRequestClose.emit().defaultPrevented||this.noUserDismiss?(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250)):this.hide()};handleTransitionEnd=o=>{"opacity"===o.propertyName&&o.composedPath().find((o=>o===this.panel||o===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((o=>{"video"===o.tagName.toLowerCase()?o.pause():o.src=o.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:"40e8bc877fd5b34bbc02b9ab28a331d6bf81415a",class:"nano-dialog"},e("div",{key:"3d8c4f2b68831a42039e597d532e2efe680082df",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:o=>this.dialog=o,popover:"manual"},e("div",{key:"48ec09fb5c08830fd9f4f54e528ce47d16dcf60e",part:"overlay",class:"dialog__overlay",ref:o=>this.overlay=o,onClick:this.requestClose}),e("div",{key:"9b28aef25fc3054e329e87293e1f24b1f7bd4f63",ref:o=>this.panel=o,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:"a25853d8c1d11e52235d6d9300cc39e529b3306f",class:"dialog__body-wrap"},!this.noHeader&&e("nano-sticker",{key:"111ee49da4468e834046ecef442873d7956a9a8f"},e("header",{key:"5f40b8920bd3b7ddac34d08593752cdc58a64f4f",part:"header",class:"dialog__header"},e("span",{key:"2f35793fb4c9009db7321c27feed4448c5a67ada",part:"title",class:"dialog__title",id:`${this.componentId}-title`},e("slot",{key:"0b5de133cf8f63237cccafb96fbe635c82bdf8fb",name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&e("nano-icon-button",{key:"d517fbc641ba1e35040f08e1ba53b56d2e2f1fcd",part:"close-button",exportparts:"base:close-button__base",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/xmark"}))),e("div",{key:"d09658d8fa0c306068e4ccf77dbae233e345a648",part:"body",class:"dialog__body"},e("slot",{key:"46ef0d9c1ca1a136e15baa859a19b7e46e467d3c"})),this.slotCtrl.has("footer")&&e("nano-sticker",{key:"86dc8c994c6e3d3f7677ce9c032a3a1b9433a5e3",position:"bottom"},e("footer",{key:"6876b4a53b64469170ee81c6d442e217c844596f",part:"footer",class:"dialog__footer"},e("slot",{key:"faff1e531b53fc1895ade69bcdf8360ceedfa619",name:"footer"})))))))}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:0;--content-background:var(--nano-color-neutral-75);--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)}.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{f 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,a as o,d as e}from"./index-CFYZ-ZOT.js";import{f as n,g as s}from"./active-element-C1pBwzyj.js";import{P as a}from"./popover-D1cBIHdr.js";import{a as r,g as h}from"./tabbable-BpHwrUYt.js";import{t as d,h as l}from"./renderer-LJzCFyMt.js";import{g as p}from"./dom-CF0Ycs9M.js";import{g as c}from"./slot-DBzVpliZ.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)||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())}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:"dd4615946390485d5ad05ff0fbf3714474c38b9b",class:"nano-dropdown"},l("div",{key:"9a60642705315c41efaad525f087397b458caf2a",part:"base",id:this.dropdownId,class:{dropdown:!0,"dropdown--open":this.open}},l("span",{key:"861f59e5d50c956d53ce75d16ca5430bfb339d26",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},l("slot",{key:"55e3a353ffd07ca586468bbc213d415484e4427f",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),l("div",{key:"3ac2f6fde7117cf7421ac53e1786c4da59fd4e6c",ref:t=>this.positioner=t,class:"dropdown__positioner",popover:"manual",id:this.dropdownId+"-positioner"},l("div",{key:"ff5d8d1248c1434aad2c8f042f208ff3d418f1a4",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},this.dialogTitle&&l("span",{key:"e71c3b8e09d6b8cf359470872a70da8794a221db",id:this.labelId,class:"dropdown__accessible-title","aria-live":"group"===this.host.getAttribute("role")?void 0:"polite"},this.dialogTitle),l("slot",{key:"a9349e44064f7bbd4b32b3658c203575fe39c804"})))))}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:var(--nano-spacing-sm) 0;--overflow:auto;--dropdown-z-index:var(--nano-z-index-dropdown);--min-width:0;--max-height:none;--box-shadow:var(--nano-shadow-l1);--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 f=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.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.setActiveFocusItem(this.selectedItem||this.getItems[0]),this._hasFocus=!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:"f3908b74fc21b630402f06fac95a75f5a6b2ff27",role:"listbox"===this._type?"group":this._type,class:"nano-menu"},l("div",{key:"451b5fb6151135ab4cb73d9141086be43d9eaf93",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:"37f40b06d1dc66c46130468c3de79dfeeb38c29c",onSlotchange:this.handleSlotContent})))}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--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,f as nano_menu}
+import{r as t,c as i,a as o,d as e}from"./index-DXvE-U_j.js";import{f as n,g as s}from"./active-element-C1pBwzyj.js";import{P as a}from"./popover-D1cBIHdr.js";import{a as r,g as h}from"./tabbable-C4l-rYq9.js";import{t as d,h as l}from"./renderer-BUaAsDso.js";import{g as p}from"./dom-Cb7FUtXp.js";import{g as c}from"./slot-DYFgWo5f.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)||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())}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:"dd4615946390485d5ad05ff0fbf3714474c38b9b",class:"nano-dropdown"},l("div",{key:"9a60642705315c41efaad525f087397b458caf2a",part:"base",id:this.dropdownId,class:{dropdown:!0,"dropdown--open":this.open}},l("span",{key:"861f59e5d50c956d53ce75d16ca5430bfb339d26",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},l("slot",{key:"55e3a353ffd07ca586468bbc213d415484e4427f",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),l("div",{key:"3ac2f6fde7117cf7421ac53e1786c4da59fd4e6c",ref:t=>this.positioner=t,class:"dropdown__positioner",popover:"manual",id:this.dropdownId+"-positioner"},l("div",{key:"ff5d8d1248c1434aad2c8f042f208ff3d418f1a4",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},this.dialogTitle&&l("span",{key:"e71c3b8e09d6b8cf359470872a70da8794a221db",id:this.labelId,class:"dropdown__accessible-title","aria-live":"group"===this.host.getAttribute("role")?void 0:"polite"},this.dialogTitle),l("slot",{key:"a9349e44064f7bbd4b32b3658c203575fe39c804"})))))}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:var(--nano-spacing-sm) 0;--overflow:auto;--dropdown-z-index:var(--nano-z-index-dropdown);--min-width:0;--max-height:none;--box-shadow:var(--nano-shadow-l1);--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 f=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.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.setActiveFocusItem(this.selectedItem||this.getItems[0]),this._hasFocus=!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:"f7c0e55c16e5607f25a4a75847c0defd4b860e17",role:"listbox"===this._type?"group":this._type,class:"nano-menu"},l("div",{key:"3a19c91258abaa6b0a6333a35809172aabf4db43",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:"75c213c4a744e7edd1826d88a8e391e16bdc091b",onSlotchange:this.handleSlotContent})))}};f.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--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,f as nano_menu}

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,a as s,B as e,d as h}from"./index-CFYZ-ZOT.js";import{c as a}from"./index-DxKBolVo.js";import{t as n,h as o}from"./renderer-LJzCFyMt.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 e,h,a,n;s&&(i.validationMessage?(e=i,s.validityMessage=e.validationMessage.length?e.validationMessage:s.validityMessage,this.internalValidate=!0,s.valid&&!e.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?(e=i,this.internalValidate=!0,a=e.checkValidity(),this.internalValidate=!1,n=e.validationMessage):(h=i,a=!h.invalid,n=h.validityMessage),t.push({fields:[i],name:this.getName(i),value:this._store.state[this.getName(i)],dirty:!1,valid:a,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||e.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 e=this.allFields.find((t=>this.getName(t)===s)),h=this.getValidityTarget(e);(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=a({})}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:"b1951fc1c5a049a49106a5974e99d37282f0397d",class:"nano-field-validator"},this.userForm&&o("slot",{key:"1d90fc2ed42128f067aeb7b5b17a88865f77c556"}),!this.userForm&&o("form",{key:"46c933b7363a248de93550a576cbe121174ea68d",ref:t=>this.activeForm=t},o("slot",{key:"335fbe05634148c438a69a31e7f48debe80146bc"})))}static get watchers(){return{userForm:["userFormChange"],validateOn:["validateOnChange"],extraFieldSelector:["attachSlotObserver"]}}};export{r as nano_field_validator}
+import{r as t,c as i,a as s,B as e,d as h}from"./index-DXvE-U_j.js";import{c as a}from"./index-Dw3NZx59.js";import{t as n,h as o}from"./renderer-BUaAsDso.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 e,h,a,n;s&&(i.validationMessage?(e=i,s.validityMessage=e.validationMessage.length?e.validationMessage:s.validityMessage,this.internalValidate=!0,s.valid&&!e.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?(e=i,this.internalValidate=!0,a=e.checkValidity(),this.internalValidate=!1,n=e.validationMessage):(h=i,a=!h.invalid,n=h.validityMessage),t.push({fields:[i],name:this.getName(i),value:this._store.state[this.getName(i)],dirty:!1,valid:a,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||e.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 e=this.allFields.find((t=>this.getName(t)===s)),h=this.getValidityTarget(e);(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=a({})}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:"b1951fc1c5a049a49106a5974e99d37282f0397d",class:"nano-field-validator"},this.userForm&&o("slot",{key:"1d90fc2ed42128f067aeb7b5b17a88865f77c556"}),!this.userForm&&o("form",{key:"46c933b7363a248de93550a576cbe121174ea68d",ref:t=>this.activeForm=t},o("slot",{key:"335fbe05634148c438a69a31e7f48debe80146bc"})))}static get watchers(){return{userForm:["userFormChange"],validateOn:["validateOnChange"],extraFieldSelector:["attachSlotObserver"]}}};export{r as nano_field_validator}