import{r as e,c as i,h as t,H as s}from"./p-b31dd0cc.js";class a{constructor(t){e(this,t),this.timepicker=!0,this.timepickerStep=15,this.timepickerFormat="24h",this.input=i(this,"input",7)}async isValid(){return await this.materialsTextFieldEl.isValid()}async forceValidation(){this.materialsTextFieldEl.forceValidation()}componentWillLoad(){this.outlined&&this.fullwidth&&console.warn("[materials-date-field] You should not use fullwidth and outlined together")}updateValue(){this.materialsTextFieldEl&&(this.materialsTextFieldEl.value=this.value)}renderTimePicker(){if(this.timepicker)return t("materials-menu",{maxHeight:200,noPadding:!0,ref:e=>this.materialsMenuTimepickerEl=e},t("materials-timepicker",{timeSelected:this.value,clock24:"24h"===this.timepickerFormat,step:this.timepickerStep,onTimeSelectedChange:e=>{this.value=e.detail,this.input.emit(),this.materialsMenuTimepickerEl&&this.materialsMenuTimepickerEl.close()},onClick:e=>e.stopPropagation()}))}async openPicker(e){if(!this.disabled&&this.timepicker&&(e.stopPropagation(),e.preventDefault(),this.materialsMenuTimepickerEl)){await this.materialsMenuTimepickerEl.open();const e=this.materialsMenuTimepickerEl.querySelector("materials-timepicker"),i=this.materialsMenuTimepickerEl.shadowRoot.querySelector(".mdc-menu"),t=e.shadowRoot.querySelector("materials-list-item[selected]");e&&i&&t&&(i.scrollTop=t.offsetTop-60)}}render(){return t(s,{class:{"materials-time-field--dense":this.dense}},t("materials-text-field",{class:"timepicker-with-value",type:"time",value:this.value,label:this.label,fullwidth:this.fullwidth,dense:this.dense,outlined:this.outlined,focused:this.focused,disabled:this.disabled,leadingIcon:this.leadingIcon,required:this.required,width:this.width,helperText:this.helperText,persistent:this.persistent,hideNativeClear:!0,customValidation:this.customValidation,ref:e=>this.materialsTextFieldEl=e,onInput:e=>{e.stopPropagation(),this.input.emit(e.detail)},onClick:e=>this.openPicker(e)}),this.renderTimePicker())}static get watchers(){return{value:["updateValue"]}}static get style(){return":host{display:-ms-flexbox;display:flex}.date-picker{padding:16px}"}}export{a as materials_time_field};