@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
5 lines (4 loc) • 10.8 kB
JavaScript
/*! 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{l as G}from"./XDKVBD6O.js";import{a as x}from"./RE7G2NN7.js";import{c as W,e as j,f as A,h as K}from"./ZAT242GT.js";import{c as H,d as q}from"./JSDTVKI3.js";import{a as _,b as U}from"./BVJFCLMH.js";import{a as R}from"./YXZ62PQO.js";import"./3FSOG4LN.js";import{d as N}from"./CKRTMNFR.js";import{b as k}from"./5RDOSP2E.js";import"./3ADX47DD.js";import{d as V}from"./HPN2C7M6.js";import"./JOSABGK6.js";import"./NNVH7JUI.js";import{E as P,F as z,J as E,R as M,c as D,d as I,h as v,q as b}from"./BJZTU5BQ.js";var te={offset:"offset"},oe=60;function $(t){return t.replace(":15",".25").replace(":30",".5").replace(":45",".75").replace("\u2212","-")}function se(t,e){let o=w(t,"en-US",e).replace("GMT","");return o===""?0:Number($(o))*oe}function ae(){return new Date().getTimezoneOffset()*-1}function ie(){return new Intl.DateTimeFormat().resolvedOptions().timeZone}async function ne(t){if(t==="offset")return o=>o;let{normalize:e}=await import("./42GZPUJF.js");return e}async function le(t,e,o,s,n){if(o==="name"){let{groupByName:a}=await import("./KLCUBEHO.js");return(await a()).map(({label:i})=>({label:i,value:i,metadata:{filterValue:i}})).filter(i=>!!i).sort()}let r=n==="user"?t:n==="utc"?"fr":"en-GB",d=s.getTime();if(o==="region"){let[{groupByRegion:a},{getCountry:c,global:i}]=await Promise.all([import("./QJQKIXDW.js"),import("./HE3WHDG2.js")]);return(await a()).map(({label:m,tzs:u})=>(u.sort((h,f)=>{let y=T(h,e),Z=T(f,e),p="Etc/GMT";if(h.startsWith(p)&&f.startsWith(p)){let g=h.substring(p.length),L=f.substring(p.length),ee=g===""?0:parseInt(g);return(L===""?0:parseInt(L))-ee}return y.localeCompare(Z)}),{label:O(e,m),items:u.map(h=>{let f=$(w(h,r,d)),y=T(h,e),Z=m===i?`${T(i,e)} Etc`:J(h),p=c(h),g=O(e,p);return{label:y,value:h,metadata:{country:g===y?void 0:g,filterValue:Z,offset:f}}})})).sort((m,u)=>m.label===i?-1:u.label===i?1:m.label.localeCompare(u.label))}let[{groupByOffset:C},{DateEngine:X}]=await Promise.all([import("./PETHDVW3.js"),import("./RXR4G2F7.js")]),F=await C({dateEngine:new X,groupDateRange:1,startDate:new Date(d).toISOString()}),Y=new Intl.ListFormat(t,{style:"long",type:"conjunction"}),B=["Factory","Etc/UTC"];return F.forEach(a=>{let c=[],i=0;a.tzs.forEach((l,m)=>{B.includes(l)&&i++,c[m]=i}),a.tzs=a.tzs.filter(l=>!B.includes(l)),a.labelTzIdx=a.labelTzIdx.map(l=>l-c[l]).filter(l=>l>=0&&l<a.tzs.length)}),F.map(({labelTzIdx:a,tzs:c})=>{let i=c[0],l=$(w(i,r,d)),m=se(i,d),u=a.map(f=>T(c[f],e));return{label:me(e,l,Y.format(u)),value:m,metadata:{filterValue:c.map(f=>J(f))}}}).filter(a=>!!a).sort((a,c)=>a.value-c.value)}function T(t,e){return e[t]||ce(t)}function re(t,e,o){return o.timeZoneRegionLabel.replace("{city}",t).replace("{country}",O(o,e))}function O(t,e){return t[e]||e}function ce(t){return t.split("/").pop()}function J(t){return t.replace(/_/g," ")}function me(t,e,o){return t.timeZoneLabel.replace("{offset}",e).replace("{cities}",o)}function w(t,e,o=Date.now()){return t==="Factory"&&(t="Etc/GMT"),G(e,{timeZone:t,timeZoneName:"shortOffset"}).formatToParts(o).find(({type:r})=>r==="timeZoneName").value}function he(t){return t[0].items!==void 0}function fe(t){return he(t)?t.flatMap(e=>e.items):t}function Q(t,e,o){return o==null?null:fe(t).find(s=>s[e]==o)}var de=D`: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:block}.offset{white-space:nowrap}:host([hidden]){display:none}[hidden]{display:none}: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}`,S=class extends P{constructor(){super(...arguments),this.messages=N({blocking:!0}),this.clearable=!1,this.disabled=!1,this.maxItems=0,this.mode="offset",this.offsetStyle="user",this.open=!1,this.overlayPositioning="absolute",this.readOnly=!1,this.required=!1,this.scale="m",this.status="idle",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.calciteInputTimeZoneBeforeClose=b({cancelable:!1}),this.calciteInputTimeZoneBeforeOpen=b({cancelable:!1}),this.calciteInputTimeZoneChange=b({cancelable:!1}),this.calciteInputTimeZoneClose=b({cancelable:!1}),this.calciteInputTimeZoneOpen=b({cancelable:!1})}static{this.properties={clearable:[7,{},{reflect:!0,type:Boolean}],disabled:[7,{},{reflect:!0,type:Boolean}],form:[3,{},{reflect:!0}],maxItems:[11,{},{reflect:!0,type:Number}],messageOverrides:[0,{},{attribute:!1}],mode:[3,{},{reflect:!0}],name:[3,{},{reflect:!0}],offsetStyle:[3,{},{reflect:!0}],open:[7,{},{reflect:!0,type:Boolean}],overlayPositioning:[3,{},{reflect:!0}],readOnly:[7,{},{reflect:!0,type:Boolean}],referenceDate:1,required:[7,{},{reflect:!0,type:Boolean}],scale:[3,{},{reflect:!0}],status:[3,{},{reflect:!0}],validationIcon:[3,{converter:E},{reflect:!0}],validationMessage:1,validity:[0,{},{attribute:!1}],value:1}}static{this.shadowRootOptions={mode:"open",delegatesFocus:!0}}static{this.styles=de}get value(){return this._value}set value(e){this._value=e}async setFocus(){await V(this),await this.comboboxEl.setFocus()}connectedCallback(){super.connectedCallback(),W(this),H(this)}async load(){this.normalizer=await ne(this.mode),await this.updateTimeZoneItems();let e=this.value,o=this.normalizeValue(e);this.value=o||(e===""?o:void 0),this.updateTimeZoneSelection();let s=this.selectedTimeZoneItem?`${this.selectedTimeZoneItem.value}`:"";A(this,s),this.value=s}willUpdate(e){e.has("value")&&this.hasUpdated&&this.handleValueChange(this.value,e.get("value")),(e.has("messages")||e.has("mode")&&(this.hasUpdated||this.mode!=="offset")||e.has("referenceDate"))&&this.handleTimeZoneItemPropsChange(),e.has("open")&&(this.hasUpdated||this.open!==!1)&&this.openChanged()}updated(){_(this)}loaded(){this.overrideSelectedLabelForRegion(this.open),this.openChanged()}disconnectedCallback(){super.disconnectedCallback(),j(this),q(this)}async handleTimeZoneItemPropsChange(){!this.timeZoneItems||!this.hasUpdated||(await this.updateTimeZoneItems(),this.updateTimeZoneSelection())}openChanged(){this.comboboxEl&&(this.comboboxEl.open=this.open)}async handleValueChange(e,o){let s=this.normalizeValue(e);if(!s){if(this.clearable){this._value=s,this.selectedTimeZoneItem=null;return}this._value=o,this.selectedTimeZoneItem=this.findTimeZoneItem(o);return}let n=this.findTimeZoneItem(s);if(!n){this._value=o;return}this._value=s,this.selectedTimeZoneItem=n,s!==e&&(await this.updateComplete,this.overrideSelectedLabelForRegion(this.open))}onLabelClick(){this.setFocus()}setComboboxRef(e){this.comboboxEl=e}overrideSelectedLabelForRegion(e){if(this.mode!=="region"||!this.selectedTimeZoneItem)return;let{label:o,metadata:s}=this.selectedTimeZoneItem;this.comboboxEl.selectedItems[0].textLabel=!s.country||e?o:re(o,s.country,this.messages)}onComboboxBeforeClose(e){e.stopPropagation(),this.overrideSelectedLabelForRegion(!1),this.calciteInputTimeZoneBeforeClose.emit()}onComboboxBeforeOpen(e){e.stopPropagation(),this.overrideSelectedLabelForRegion(!0),this.calciteInputTimeZoneBeforeOpen.emit()}onComboboxChange(e){e.stopPropagation();let s=e.target.selectedItems[0];if(!s){this._value="",this.selectedTimeZoneItem=null,this.calciteInputTimeZoneChange.emit();return}let n=this.findTimeZoneItemByLabel(s.getAttribute("data-label")),r=`${n.value}`;this.value===r&&n.label===this.selectedTimeZoneItem.label||(this._value=r,this.selectedTimeZoneItem=n,this.calciteInputTimeZoneChange.emit())}onComboboxClose(e){e.stopPropagation(),this.open=!1,this.calciteInputTimeZoneClose.emit()}onComboboxOpen(e){this.open=!0,e.stopPropagation(),this.calciteInputTimeZoneOpen.emit()}findTimeZoneItem(e){return Q(this.timeZoneItems,"value",e)}findTimeZoneItemByLabel(e){return Q(this.timeZoneItems,"label",e)}async updateTimeZoneItems(){this.timeZoneItems=await this.createTimeZoneItems()}updateTimeZoneSelection(){if(this.value===""&&this.clearable){this.selectedTimeZoneItem=null;return}let e=this.mode==="offset"?ae():ie(),o=this.value===""||!this.value?e:this.value;this.selectedTimeZoneItem=this.findTimeZoneItem(o)||this.findTimeZoneItem(e)}async createTimeZoneItems(){return!this.messages._lang||!this.messages?[]:le(this.messages._lang,this.messages,this.mode,this.referenceDate instanceof Date?this.referenceDate:new Date(this.referenceDate??Date.now()),this.offsetStyle)}normalizeValue(e){return e=e===void 0?"":e,e&&this.normalizer(e)}render(){return U({disabled:this.disabled,children:I`<calcite-combobox .clearDisabled=${!this.clearable} .disabled=${this.disabled} .label=${this.messages.chooseTimeZone} lang=${this.messages._lang??v} .maxItems=${this.maxItems} =${this.onComboboxBeforeClose} =${this.onComboboxBeforeOpen} =${this.onComboboxChange} =${this.onComboboxClose} =${this.onComboboxOpen} .overlayPositioning=${this.overlayPositioning} .placeholder=${this.mode==="name"?this.messages.namePlaceholder:this.mode==="offset"?this.messages.offsetPlaceholder:this.messages.regionPlaceholder} placeholder-icon=search .readOnly=${this.readOnly} .scale=${this.scale} .selectionMode=${this.clearable?"single":"single-persist"} .status=${this.status} .validationIcon=${this.validationIcon} .validationMessage=${this.validationMessage} ${k(this.setComboboxRef)}>${this.renderItems()}</calcite-combobox>${K({component:this})}`})}renderItems(){return this.mode==="region"?this.renderRegionItems():x(this.timeZoneItems,({label:e})=>e,e=>{let o=this.selectedTimeZoneItem===e,{label:s,metadata:n,value:r}=e;return I`<calcite-combobox-item data-label=${s??v} .metadata=${n} .selected=${o} .textLabel=${s} .value=${r}></calcite-combobox-item>`})}renderRegionItems(){return this.timeZoneItems.flatMap(({label:e,items:o})=>R(e,I`<calcite-combobox-item-group .label=${e}>${x(o,({label:s})=>s,s=>{let n=this.selectedTimeZoneItem===s,{label:r,metadata:d,value:C}=s;return I`<calcite-combobox-item data-label=${r??v} .description=${d.country} .metadata=${d} .selected=${n} .textLabel=${r} .value=${C}><span class=${z(te.offset)} slot=content-end>${d.offset}</span></calcite-combobox-item>`})}</calcite-combobox-item-group>`))}};M("calcite-input-time-zone",S);export{S as InputTimeZone};