UNPKG

@esri/calcite-components

Version:

Web Components for Esri's Calcite Design System.

5 lines (4 loc) • 21.4 kB
/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified. See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details. v3.2.1 */ import{a as A,b as $,c as pe,d as fe,e as ge,f as O,g as T,h as be,i as ve,j as E,k as Se,m as $e,n as B}from"./QPBXEGXZ.js";import{a as me}from"./CQSTX4F7.js";import{b as f,c as V}from"./5VPUXQOI.js";import{b as h}from"./XDKVBD6O.js";import{a as ue}from"./FN45KTPK.js";import{a as re,c as le,e as ce,h as de}from"./ZAT242GT.js";import{c as se,d as oe,e as ne}from"./JSDTVKI3.js";import{a as he}from"./VTROLFPV.js";import{a as ee,b as te}from"./BVJFCLMH.js";import{b as z}from"./3FSOG4LN.js";import{c as ie,d as ae}from"./CKRTMNFR.js";import{b}from"./5RDOSP2E.js";import{e as Q,n as X}from"./3ADX47DD.js";import{a as Y,d as Z}from"./HPN2C7M6.js";import"./JOSABGK6.js";import"./NNVH7JUI.js";import{E as W,F as u,J as G,R as J,c as q,d as g,h as c,q as S,s as j}from"./BJZTU5BQ.js";var N=class extends j{constructor(){super(...arguments),this.localizedDecimalSeparator=".",this.userChangedValue=!1,this.handleHourKeyDownEvent=e=>{let t=e.key;if(z.includes(t)){let i=parseInt(t),a;if(h(this.hour))switch(this.hourFormat){case"12":a=this.hour==="01"&&i>=0&&i<=2?`1${i}`:i;break;case"24":this.hour==="01"?a=`1${i}`:this.hour==="02"&&i>=0&&i<=3?a=`2${i}`:a=i;break}else a=i;this.setValuePart("hour",a)}else switch(t){case"Backspace":case"Delete":e.preventDefault(),this.setValuePart("hour",null);break;case"ArrowDown":e.preventDefault(),this.decrementHour();break;case"ArrowUp":e.preventDefault(),this.incrementHour();break;case" ":case"Spacebar":e.preventDefault();break}},this.handleMinuteKeyDownEvent=e=>{let t=e.key;if(z.includes(t)){let i=parseInt(t),a;if(h(this.minute)&&this.minute.startsWith("0")){let s=parseInt(this.minute);a=s>A?i:`${s}${i}`}else a=i;this.setValuePart("minute",a)}else switch(t){case"Backspace":case"Delete":e.preventDefault(),this.setValuePart("minute",null);break;case"ArrowDown":e.preventDefault(),this.decrementMinute();break;case"ArrowUp":e.preventDefault(),this.incrementMinute();break;case" ":case"Spacebar":e.preventDefault();break}},this.handleSecondKeyDownEvent=e=>{let t=e.key;if(z.includes(t)){let i=parseInt(t),a;if(h(this.second)&&this.second.startsWith("0")){let s=parseInt(this.second);a=s>A?i:`${s}${i}`}else a=i;this.setValuePart("second",a)}else switch(t){case"Backspace":case"Delete":e.preventDefault(),this.setValuePart("second",null);break;case"ArrowDown":e.preventDefault(),this.decrementSecond();break;case"ArrowUp":e.preventDefault(),this.incrementSecond();break;case" ":case"Spacebar":e.preventDefault();break}},this.handleFractionalSecondKeyDownEvent=e=>{let{key:t}=e;if(z.includes(t)){let i=f(this.component.step),a=parseInt(this.fractionalSecond),s=a.toString().length,r;s>=i?r=t.padStart(i,"0"):s<i&&(r=`${a}${t}`.padStart(i,"0")),this.setValuePart("fractionalSecond",parseFloat(`0.${r}`))}else switch(t){case"Backspace":case"Delete":e.preventDefault(),this.setValuePart("fractionalSecond",null);break;case"ArrowDown":e.preventDefault(),this.nudgeFractionalSecond("down");break;case"ArrowUp":e.preventDefault(),this.nudgeFractionalSecond("up");break;case" ":e.preventDefault();break}},this.handleMeridiemKeyDownEvent=e=>{switch(e.key){case"a":this.setValuePart("meridiem","AM");break;case"p":this.setValuePart("meridiem","PM");break;case"Backspace":case"Delete":e.preventDefault(),this.setValuePart("meridiem");break;case"ArrowUp":case"ArrowDown":e.preventDefault(),this.toggleMeridiem(e.key);break;case" ":case"Spacebar":e.preventDefault();break}},this.calciteTimeChange=S()}hostConnected(){this.setHourFormat(),this.setMeridiemOrder(),this.setValue(this.component.value)}hostUpdate(e){let t=!1,i=!1,a=!1;if(e.has("hourFormat")&&(t=!0,a=!0),e.has("messages")&&e.get("messages")?._lang!==this.component.messages._lang&&(t=!0,i=!0,a=!0),e.has("numberingSystem")&&(a=!0),e.has("step")){let s=this.component.step,r=e.get("step");(s>=60&&r>0&&r<60||r>=60&&s>0&&s<60)&&(a=!0)}t&&this.setHourFormat(),i&&this.setMeridiemOrder(),a&&this.setValue(this.component.value)}decrementHour(){let e=this.hour?this.hour==="00"?23:parseInt(this.hour)-1:0;this.setValuePart("hour",e)}decrementMinute(){this.decrementMinuteOrSecond("minute")}decrementMinuteOrSecond(e){let t;if(h(this[e])){let i=parseInt(this[e]);t=i===0?59:i-1}else t=59;this.setValuePart(e,t)}decrementSecond(){this.decrementMinuteOrSecond("second")}incrementHour(){let e=h(this.hour)?this.hour==="23"?0:parseInt(this.hour)+1:1;this.setValuePart("hour",e)}incrementMinute(){this.incrementMinuteOrSecond("minute")}incrementMinuteOrSecond(e){let t=h(this[e])?this[e]==="59"?0:parseInt(this[e])+1:0;this.setValuePart(e,t)}incrementSecond(){this.incrementMinuteOrSecond("second")}nudgeFractionalSecond(e){let t=V(this.component.step),i=f(this.component.step),a=parseInt(this.fractionalSecond),s=parseFloat(`0.${this.fractionalSecond}`),r,n,l,d;e==="up"&&(r=isNaN(a)?0:s+t,n=parseFloat(r.toFixed(i)),l=V(n),d=n<1&&f(l)>0?$(l,i):"".padStart(i,"0")),e==="down"&&(r=isNaN(a)||a===0?1-t:s-t,n=parseFloat(r.toFixed(i)),l=V(n),d=n<1&&f(l)>0&&Math.sign(l)===1?$(l,i):"".padStart(i,"0")),this.setValuePart("fractionalSecond",d)}setHourFormat(){let{hourFormat:e,messages:t}=this.component,i=t._lang;this.hourFormat=e==="user"?pe(i):e}setMeridiemOrder(){let{messages:e}=this.component,t=e._lang;this.meridiemOrder=be(t)}toggleMeridiem(e){let t;this.meridiem?t=this.meridiem==="AM"?"PM":"AM":t=e==="ArrowDown"?"PM":"AM",this.setValuePart("meridiem",t)}setValue(e,t=!1){let{messages:i,numberingSystem:a,step:s,value:r}=this.component,n=i._lang,l=this.hourFormat==="12",d=B(e,s);if(ve(e)){let{hour:w,minute:P,second:v,fractionalSecond:k}=$e(d,s),{hour:y,hourSuffix:p,minute:m,minuteSuffix:H,second:D,secondSuffix:C,decimalSeparator:F,fractionalSecond:M,meridiem:x}=Se({hour12:l,locale:n,numberingSystem:a,parts:!0,step:s,value:d});this.hour=w,this.minute=P,this.second=v,this.fractionalSecond=k,this.localizedHour=y,this.localizedHourSuffix=p,this.localizedMinute=m,this.localizedMinuteSuffix=H,this.localizedSecond=D,this.localizedDecimalSeparator=F,this.localizedFractionalSecond=M,this.localizedSecondSuffix=C,x&&(this.meridiem=T(this.hour),this.localizedMeridiem=x)}else this.hour=null,this.minute=null,this.second=null,this.fractionalSecond=null,this.meridiem=null,this.localizedHour=null,this.localizedHourSuffix=O("hour",n,a),this.localizedMinute=null,this.localizedMinuteSuffix=O("minute",n,a),this.localizedSecond=null,this.localizedDecimalSeparator=ge(n,a),this.localizedFractionalSecond=null,this.localizedSecondSuffix=O("second",n,a),this.localizedMeridiem=null;d!==r?(this.userChangedValue=t,this.component.value=d??""):this.component.requestUpdate()}setValuePart(e,t){let{hourFormat:i}=this,{messages:a,numberingSystem:s,step:r}=this.component,n=a._lang,l=i==="12",d=this.component.value;if(e==="meridiem"){let p=this.meridiem;if(this.meridiem=t,this.localizedMeridiem=E({hour12:l,locale:n,numberingSystem:s,part:"meridiem",value:this.meridiem}),h(this.hour)){let m=parseInt(this.hour);switch(t){case"AM":m>=12&&(this.hour=$(m-12));break;case"PM":m<12&&(this.hour=$(m+12));break;default:this.component.value="";break}this.localizedHour=E({hour12:l,locale:n,numberingSystem:s,part:"hour",value:this.hour})}p!==this.meridiem&&this.component.requestUpdate()}else if(e==="fractionalSecond"){let p=this.fractionalSecond,m=f(r);typeof t=="number"?this.fractionalSecond=t===0?"".padStart(m,"0"):$(t,m):this.fractionalSecond=t,this.localizedFractionalSecond=E({value:this.fractionalSecond,part:"fractionalSecond",locale:n,numberingSystem:s,hour12:l}),p!==this.fractionalSecond&&this.component.requestUpdate()}else{let p=this[e];this[e]=typeof t=="number"?$(t):t,this[`localized${he(e)}`]=E({value:this[e],part:e,locale:n,numberingSystem:s,hour12:l}),p!==this[e]&&this.component.requestUpdate()}let{hour:w,minute:P,second:v,fractionalSecond:k}=this,y=B({hour:w,minute:P,second:v,fractionalSecond:k},r);d!==y&&(e==="hour"&&i==="12"&&(this.meridiem=T(w),this.localizedMeridiem=fe({locale:n,meridiem:this.meridiem})),this.userChangedValue=!0,this.calciteTimeChange.emit(y??""))}},Fe=ie(N),Me=q`:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline-block}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}::slotted(input[slot=hidden-form-input]){margin:0!important;opacity:0!important;outline:none!important;padding:0!important;position:absolute!important;inset:0!important;transform:none!important;-webkit-appearance:none!important;z-index:-1!important}.container{--calcite-icon-color: var(--calcite-color-text-3);align-items:center;background-color:var(--calcite-color-foreground-1);border:1px solid var(--calcite-color-border-input);box-sizing:border-box;display:flex;color:var(--calcite-color-text-1);flex-wrap:nowrap;font-weight:var(--calcite-font-weight-normal);inline-size:100%;padding-block:var(--calcite-spacing-base);-webkit-user-select:none;user-select:none}.container:focus-within{border-color:var(--calcite-color-brand);outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}.container.read-only{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}.input-container{display:flex;flex-grow:1}.input{align-items:center;display:flex;block-size:100%;justify-content:center;min-inline-size:max-content}.input.empty{inline-size:var(--calcite-spacing-xl)}.input:focus,.input:hover:focus{background-color:Highlight;color:HighlightText;outline:2px solid transparent;outline-offset:2px}.toggle-icon{align-items:center;block-size:24px;cursor:pointer;display:flex;inline-size:24px;justify-content:center}.toggle-icon:hover{--calcite-icon-color: var(--calcite-color-text-1)}.meridiem--start{margin-inline-end:var(--calcite-spacing-xxs)}.meridiem--end{margin-inline-start:var(--calcite-spacing-xxs)}:host([scale=s]) .container{block-size:1.5rem;font-size:var(--calcite-font-size-sm);gap:var(--calcite-spacing-sm);padding-inline-start:var(--calcite-spacing-sm);padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s]) .input-container{line-height:1rem}:host([scale=m]) .container{block-size:2rem;font-size:var(--calcite-font-size);gap:var(--calcite-spacing-md);padding-inline-start:var(--calcite-spacing-md);padding-inline-end:var(--calcite-spacing-sm)}:host([scale=m]) .input-container{line-height:1.5rem}:host([scale=l]) .container{block-size:2.75rem;font-size:var(--calcite-font-size-md);gap:var(--calcite-spacing-lg);padding-inline:var(--calcite-spacing-lg)}:host([scale=l]) .input-container{line-height:2.25rem}:host([status=invalid]) .container{border-color:var(--calcite-color-status-danger)}:host([status=invalid]) .container:focus-within{outline:2px solid var(--calcite-color-status-danger);outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}.validation-container{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}:host([scale=m]) .validation-container,:host([scale=l]) .validation-container{padding-block-start:.5rem}:host([scale=s]) .validation-container{padding-block-start:.25rem}:host([hidden]){display:none}[hidden]{display:none}`,o={clockIcon:"clock-icon",container:"container",decimalSeparator:"decimal-separator",empty:"empty",fractionalSecond:"fractional-second",hour:"hour",hourSuffix:"hour-suffix",input:"input",inputContainer:"input-container",meridiem:"meridiem",meridiemStart:"meridiem--start",meridiemEnd:"meridiem--end",minute:"minute",minuteSuffix:"minute-suffix",readOnly:"read-only",second:"second",secondSuffix:"second-suffix",toggleIcon:"toggle-icon"},ze={validationMessage:"inputTimePickerValidationMessage"},L=class extends W{constructor(){super(),this.messages=ae(),this.time=Fe(this),this.disabled=!1,this.focusTrapDisabled=!1,this.hourFormat="user",this.open=!1,this.overlayPositioning="absolute",this.placement="auto",this.readOnly=!1,this.required=!1,this.scale="m",this.status="idle",this.step=60,this.validity={valid:!1,badInput:!1,customError:!1,patternMismatch:!1,rangeOverflow:!1,rangeUnderflow:!1,stepMismatch:!1,tooLong:!1,tooShort:!1,typeMismatch:!1,valueMissing:!1},this.calciteInputTimePickerBeforeClose=S({cancelable:!1}),this.calciteInputTimePickerBeforeOpen=S({cancelable:!1}),this.calciteInputTimePickerChange=S(),this.calciteInputTimePickerClose=S({cancelable:!1}),this.calciteInputTimePickerOpen=S({cancelable:!1}),this.listen("blur",this.blurHandler),this.listen("keydown",this.keyDownHandler),this.listen("calciteTimeChange",this.timeChangeHandler)}static{this.properties={disabled:[7,{},{reflect:!0,type:Boolean}],focusTrapDisabled:[7,{},{reflect:!0,type:Boolean}],form:[3,{},{reflect:!0}],hourFormat:[3,{},{reflect:!0}],max:[3,{},{reflect:!0}],messageOverrides:[0,{},{attribute:!1}],min:[3,{},{reflect:!0}],name:1,numberingSystem:[3,{},{reflect:!0}],open:[7,{},{reflect:!0,type:Boolean}],overlayPositioning:1,placement:[3,{},{reflect:!0}],readOnly:[7,{},{reflect:!0,type:Boolean}],required:[7,{},{reflect:!0,type:Boolean}],scale:[3,{},{reflect:!0}],status:[3,{},{reflect:!0}],step:[11,{},{reflect:!0,type:Number}],validationIcon:[3,{converter:G},{reflect:!0}],validationMessage:1,validity:[0,{},{attribute:!1}],value:1}}static{this.shadowRootOptions={mode:"open",delegatesFocus:!0}}static{this.styles=Me}async reposition(e=!1){this.popoverEl?.reposition(e)}async setFocus(){await Z(this),X(this.el)}connectedCallback(){super.connectedCallback(),se(this),le(this)}willUpdate(e){e.has("open")&&(this.hasUpdated||this.open!==!1)&&this.openHandler(),e.has("disabled")&&(this.hasUpdated||this.disabled!==!1)&&(this.disabled||(this.open=!1)),e.has("readOnly")&&(this.hasUpdated||this.readOnly!==!1)&&(this.readOnly||(this.open=!1)),e.has("value")&&(this.hasUpdated?(this.time.userChangedValue||(this.previousEmittedValue=this.value),this.time.setValue(this.value)):this.previousEmittedValue=this.value)}updated(){ee(this)}disconnectedCallback(){super.disconnectedCallback(),oe(this),ce(this)}blurHandler(){this.changeEventHandler()}changeEventHandler(){let{previousEmittedValue:e,value:t}=this;e!==t&&(this.calciteInputTimePickerChange.emit().defaultPrevented?this.time.setValue(this.previousEmittedValue):this.previousEmittedValue=t)}keyDownHandler(e){let{defaultPrevented:t,key:i}=e,{hourFormat:a,meridiemOrder:s}=this.time;if(!t)if(i==="Enter")re(this)&&e.preventDefault(),this.changeEventHandler();else if(this.open&&this.focusTrapDisabled&&i==="Escape")this.open=!1,e.preventDefault();else{let r=f(this.step)>0,n=this.step<60;switch(this.activeEl){case this.hourEl:i==="ArrowRight"?this.setFocusPart("minute"):i==="ArrowLeft"&&a==="12"&&s===0&&this.setFocusPart("meridiem");break;case this.minuteEl:switch(i){case"ArrowLeft":this.setFocusPart("hour");break;case"ArrowRight":this.step!==60?this.setFocusPart("second"):a==="12"&&this.setFocusPart("meridiem");break}break;case this.secondEl:switch(i){case"ArrowLeft":this.setFocusPart("minute");break;case"ArrowRight":f(this.step)>0?this.setFocusPart("fractionalSecond"):a==="12"&&this.setFocusPart("meridiem");break}break;case this.fractionalSecondEl:switch(i){case"ArrowLeft":this.setFocusPart("second");break;case"ArrowRight":a==="12"&&s!==0&&this.setFocusPart("meridiem");break}break;case this.meridiemEl:i==="ArrowLeft"&&s!==0?r?this.setFocusPart("fractionalSecond"):n?this.setFocusPart("second"):this.setFocusPart("minute"):i==="ArrowRight"&&s===0&&this.setFocusPart("hour");break}}}onLabelClick(){this.setFocus()}openHandler(){this.disabled||this.readOnly||this.popoverEl&&(this.popoverEl.open=this.open)}popoverBeforeOpenHandler(e){e.stopPropagation(),this.calciteInputTimePickerBeforeOpen.emit()}popoverOpenHandler(e){e.stopPropagation(),this.calciteInputTimePickerOpen.emit()}popoverBeforeCloseHandler(e){e.stopPropagation(),this.calciteInputTimePickerBeforeClose.emit()}popoverCloseHandler(e){e.stopPropagation(),this.calciteInputTimePickerClose.emit(),this.open=!1}setCalcitePopoverEl(e){this.popoverEl=e,this.openHandler()}setContainerEl(e){this.containerEl=e}async setFocusPart(e){this[`${e||"hour"}El`]?.focus()}setFractionalSecondEl(e){this.fractionalSecondEl=e}setHourEl(e){this.hourEl=e}setMinuteEl(e){this.minuteEl=e}setSecondEl(e){this.secondEl=e}setMeridiemEl(e){this.meridiemEl=e}syncHiddenFormInput(e){me("time",this,e)}timeChangeHandler(e){if(e.stopPropagation(),this.disabled)return;let t=e.detail;t!==this.value&&(this.value=t)}timePartFocusHandler(e){this.activeEl=e.currentTarget}timePickerChangeHandler(e){e.stopPropagation(),this.time.setValue(e.target.value,!0)}toggleIconClickHandler(){this.open=!this.open}render(){let{messages:e,readOnly:t,scale:i}=this,{fractionalSecond:a,handleHourKeyDownEvent:s,handleMinuteKeyDownEvent:r,handleSecondKeyDownEvent:n,handleFractionalSecondKeyDownEvent:l,hour:d,hourFormat:w,localizedDecimalSeparator:P,localizedFractionalSecond:v,localizedHour:k,localizedHourSuffix:y,localizedMinute:p,localizedMinuteSuffix:m,localizedSecond:H,localizedSecondSuffix:D,meridiemOrder:C,minute:F,second:M}=this.time,x="--",ke=h(a),ye=h(d),xe=h(F),Pe=h(M),U=f(this.step)>0,K=w==="12",R=this.step<60,_=C===0||Q(this.el)==="rtl",I=!this.disabled&&!this.readOnly;return te({disabled:this.disabled,children:g`<div aria-label=${ne(this)??c} class=${u({[o.container]:!0,[o.readOnly]:t})} role=combobox ${b(this.setContainerEl)}><calcite-icon class=${u(o.clockIcon)} icon=clock .scale=${i==="l"?"m":"s"}></calcite-icon><div class=${u(o.inputContainer)} dir=ltr>${K&&_&&this.renderMeridiem("start")||""}<span aria-label=${this.messages.hour??c} aria-valuemax=23 aria-valuemin=1 aria-valuenow=${ye&&parseInt(d)||"0"} aria-valuetext=${d??c} class=${u({[o.empty]:!k,[o.hour]:!0,[o.input]:!0})} @focus=${this.timePartFocusHandler} @keydown=${I?s:void 0} role=spinbutton tabindex=0 ${b(this.setHourEl)}>${k||x}</span><span class=${u(o.hourSuffix)}>${y}</span><span aria-label=${this.messages.minute??c} aria-valuemax=12 aria-valuemin=1 aria-valuenow=${xe&&parseInt(F)||"0"} aria-valuetext=${F??c} class=${u({[o.empty]:!p,[o.input]:!0,[o.minute]:!0})} @focus=${this.timePartFocusHandler} @keydown=${I?r:void 0} role=spinbutton tabindex=0 ${b(this.setMinuteEl)}>${p||x}</span>${R&&g`<span class=${u(o.minuteSuffix)}>${m}</span>`||""}${R&&g`<span aria-label=${this.messages.second??c} aria-valuemax=59 aria-valuemin=0 aria-valuenow=${Pe&&parseInt(M)||"0"} aria-valuetext=${M??c} class=${u({[o.empty]:!H,[o.input]:!0,[o.second]:!0})} @focus=${this.timePartFocusHandler} @keydown=${I?n:void 0} role=spinbutton tabindex=0 ${b(this.setSecondEl)}>${H||x}</span>`||""}${U&&g`<span class=${u(o.decimalSeparator)}>${P}</span>`||""}${U&&g`<span aria-label=${this.messages.fractionalSecond??c} aria-valuemax=999 aria-valuemin=1 aria-valuenow=${ke&&parseInt(a)||"0"} aria-valuetext=${v??c} class=${u({[o.empty]:!v,[o.fractionalSecond]:!0,[o.input]:!0})} @focus=${this.timePartFocusHandler} @keydown=${I?l:void 0} role=spinbutton tabindex=0 ${b(this.setFractionalSecondEl)}>${v||"".padStart(f(this.step),"-")}</span>`||""}${D&&g`<span class=${u(o.secondSuffix)}>${D}</span>`||""}${K&&!_&&this.renderMeridiem("end")||""}</div>${!this.readOnly&&this.renderToggleIcon(this.open)||""}</div><calcite-popover auto-close .focusTrapDisabled=${this.focusTrapDisabled} .focusTrapOptions=${{initialFocus:!1}} .label=${e.chooseTime} lang=${this.messages._lang??c} @calcitePopoverBeforeClose=${this.popoverBeforeCloseHandler} @calcitePopoverBeforeOpen=${this.popoverBeforeOpenHandler} @calcitePopoverClose=${this.popoverCloseHandler} @calcitePopoverOpen=${this.popoverOpenHandler} .overlayPositioning=${this.overlayPositioning} .placement=${this.placement} .referenceElement=${this.containerEl} trigger-disabled ${b(this.setCalcitePopoverEl)}><calcite-time-picker .hourFormat=${this.time.hourFormat} lang=${this.messages._lang??c} .messageOverrides=${this.messageOverrides} .numberingSystem=${this.numberingSystem} @calciteTimePickerChange=${this.timePickerChangeHandler} .scale=${this.scale} .step=${this.step} tabindex=${(this.open?void 0:-1)??c} .value=${this.value}></calcite-time-picker></calcite-popover>${de({component:this})}${this.validationMessage&&this.status==="invalid"?ue({icon:this.validationIcon,id:ze.validationMessage,message:this.validationMessage,scale:this.scale,status:this.status}):null}`})}renderMeridiem(e){let{handleMeridiemKeyDownEvent:t,localizedMeridiem:i,meridiem:a}=this.time,s=!this.disabled&&!this.readOnly;return g`<span aria-label=${this.messages.meridiem??c} aria-valuemax=2 aria-valuemin=1 aria-valuenow=${a==="PM"&&"2"||"1"} aria-valuetext=${a??c} class=${u({[o.empty]:!i,[o.input]:!0,[o.meridiem]:!0,[o.meridiemStart]:e==="start",[o.meridiemEnd]:e==="end"})} @focus=${this.timePartFocusHandler} @keydown=${s?t:void 0} role=spinbutton tabindex=0 ${b(this.setMeridiemEl)}>${i||"--"}</span>`}renderToggleIcon(e){return g`<span class=${u(o.toggleIcon)} @click=${this.toggleIconClickHandler}><calcite-icon .icon=${e?"chevron-up":"chevron-down"} .scale=${Y(this.scale)}></calcite-icon></span>`}};J("calcite-input-time-picker",L);export{L as InputTimePicker};