@limetech/lime-elements/dist/lime-elements/p-c84911e6.entry.js

Lime Elements

import{r as t,c as i,h as s,a as e}from"./p-DBTJNfo7.js";import{c as h}from"./p-JbKhhoXs.js";import{i as a,a as n}from"./p-B-tmXAXV.js";import"./p-ndpPJpml.js";import{m as r}from"./p-BYx8mudw.js";import{M as o}from"./p-DZkKQUDM.js";import"./p-BFTU3MAI.js";import"./p-ChRGk668.js";import"./p-BN1-aIOw.js";import"./p-C9yTLqR8.js";class l{constructor(t="en"){this.language=t}formatDate(t,i){return t?r(t).locale(this.getLanguage()).format(i):""}parseDate(t,i){return t?r(t,i).toDate():null}getLanguage(){return"no"===this.language?"nb":this.language}getDateFormat(t){return{date:"L",time:"LT",week:"[w] W GGGG",month:"MM/YYYY",quarter:"[Q]Q YYYY",year:"YYYY",datetime:"L - LT"}[t]||"L - LT"}}const d={date:"date",time:"time",week:a()?"date":"week",month:"month",quarter:"date",year:"date",datetime:"datetime-local",default:"datetime-local"},m={date:"Y-MM-DD",time:"HH:mm",week:"GGGG-[W]WW",month:"Y-MM","datetime-local":"Y-MM-DD[T]HH:mm"},p=class{constructor(s){t(this,s),this.change=i(this,"change"),this.disabled=!1,this.readonly=!1,this.invalid=!1,this.required=!1,this.type="datetime",this.language="en",this.showPortal=!1,this.portalId=`date-picker-calendar-${h()}`,this.documentClickListener=t=>{t.composedPath().includes(this.textField)||document.querySelector(`#${this.portalId}`).contains(t.target)||this.hideCalendar()},this.formatValue=t=>this.dateFormatter.formatDate(t,this.internalFormat),this.handleCalendarChange=this.handleCalendarChange.bind(this),this.handleInputElementChange=this.handleInputElementChange.bind(this),this.showCalendar=this.showCalendar.bind(this),this.dateFormatter=new l(this.language),this.clearValue=this.clearValue.bind(this),this.hideCalendar=this.hideCalendar.bind(this),this.onInputClick=this.onInputClick.bind(this),this.nativeChangeHandler=this.nativeChangeHandler.bind(this),this.preventBlurFromCalendarContainer=this.preventBlurFromCalendarContainer.bind(this)}componentWillLoad(){this.useNative=!this.readonly&&(a()||n()),this.updateInternalFormatAndType()}componentWillUpdate(){this.updateInternalFormatAndType()}disconnectedCallback(){this.hideCalendar()}render(){const t={onAction:this.clearValue};!this.value||this.readonly||this.disabled||(t.trailingIcon="clear_symbol");const i=this.disabled||this.readonly?void 0:this.helperText;if(this.useNative)return s("limel-input-field",{disabled:this.disabled,readonly:this.readonly,invalid:this.invalid,label:this.label,helperText:i,required:this.required,value:this.formatValue(this.value),type:this.nativeType,onChange:this.nativeChangeHandler});const e=getComputedStyle(this.host).getPropertyValue("--dropdown-z-index"),h=this.formatter||this.formatValue;return[s("limel-input-field",Object.assign({disabled:this.disabled,readonly:this.readonly,invalid:this.invalid,label:this.label,placeholder:this.placeholder,helperText:i,required:this.required,value:this.value?h(this.value):"",onFocus:this.showCalendar,onBlur:this.hideCalendar,onClick:this.onInputClick,onChange:this.handleInputElementChange,ref:t=>this.textField=t},t)),s("limel-portal",{containerId:this.portalId,visible:this.showPortal,containerStyle:{"z-index":e}},s("limel-flatpickr-adapter",{format:this.internalFormat,language:this.language,type:this.type,value:this.value,ref:t=>this.datePickerCalendar=t,isOpen:this.showPortal,formatter:h,onChange:this.handleCalendarChange}))]}updateInternalFormatAndType(){this.nativeType=d[this.type||"default"],this.nativeFormat=m[this.nativeType],this.internalFormat=this.useNative?this.nativeFormat:this.formatter||this.format?this.format:this.dateFormatter.getDateFormat(this.type)}nativeChangeHandler(t){t.stopPropagation();const i=this.dateFormatter.parseDate(t.detail,this.internalFormat);this.change.emit(i)}showCalendar(t){if(this.disabled||this.readonly)return void t.stopPropagation();this.showPortal=!0;const i=this.textField.shadowRoot.querySelector("input");setTimeout((()=>{this.datePickerCalendar.inputElement=i})),t.stopPropagation(),document.addEventListener("mousedown",this.documentClickListener,{passive:!0}),document.addEventListener("blur",this.preventBlurFromCalendarContainer,{capture:!0})}preventBlurFromCalendarContainer(t){t.relatedTarget===this.datePickerCalendar&&t.stopPropagation()}hideCalendar(){setTimeout((()=>{this.showPortal=!1})),document.removeEventListener("mousedown",this.documentClickListener),document.removeEventListener("blur",this.preventBlurFromCalendarContainer,{capture:!0}),this.pickerIsAutoClosing()||this.fixFlatpickrFocusBug()}fixFlatpickrFocusBug(){const t=new o(this.textField.shadowRoot.querySelector(".mdc-text-field"));t.getDefaultFoundation().deactivateFocus(),t.valid=!this.invalid}handleCalendarChange(t){const i=t.detail;t.stopPropagation(),this.pickerIsAutoClosing()&&this.hideCalendar(),this.change.emit(i)}onInputClick(t){this.disabled||this.readonly||this.showPortal||this.showCalendar(t)}handleInputElementChange(t){this.disabled||this.readonly||""===t.detail&&this.clearValue(),t.stopPropagation()}pickerIsAutoClosing(){return"datetime"!==this.type&&"time"!==this.type}clearValue(){this.change.emit(null)}get host(){return e(this)}};p.style=":host(limel-date-picker){position:relative}limel-input-field[disabled],limel-input-field[readonly]{pointer-events:none}";export{p as limel_date_picker}