@arcgis/common-components 5.1.0-next.9 → 5.1.0-next.90

package/dist/cdn/ZL3E4ZGE.js

@@ -1,2 +0,0 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{A as s,B as u,H as h,g as r,i as n,q as o,z as a}from"./UTXWKXMT.js";export default $arcgis.t(([{formatNumber:c}])=>{var d=r`:host{display:block}:host([hidden]){display:none}.readOnlyLabel{display:block;font-size:var(--calcite-font-size-sm);font-variant-numeric:tabular-nums;line-height:var(--calcite-font-line-height-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline:.5rem;padding-block:3px;border-color:var(--calcite-color-transparent);border-style:solid;border-width:var(--calcite-button-border-size, 1px);color:var(--calcite-color-text-1)}:host(:not([read-only])) .readOnlyLabel{position:absolute;opacity:0}:host([alignment="start"]){.readOnlyLabel{text-align:start}}:host([alignment="end"]){.readOnlyLabel{text-align:end}}:host([alignment="center"]){.readOnlyLabel{text-align:center}}calcite-button{inline-size:100%;--calcite-offset-invert-focus: 1;--calcite-internal-animation-timing-fast: 0}calcite-input-number{inline-size:100%;--calcite-internal-animation-timing-fast: 0}`,l=class extends u{constructor(){super(...arguments),this._buttonRef=a(),this._inputRef=a(),this._labelRef=a(),this._formatOptions={style:"decimal",useGrouping:!0,minimumFractionDigits:0,maximumFractionDigits:2},this._formatValue=t=>c(t,this._formatOptions),this._pointerDownPosition=null,this._displayedValue="",this._editing=!1,this.alignment="center",this.readOnly=!1,this.value=0,this.arcgisChange=o({cancelable:!1})}static{this.properties={_displayedValue:16,_editing:16,alignment:3,editing:39,labelFormatter:0,readOnly:7,value:11}}static{this.styles=d}static{this.shadowRootOptions={mode:"open",delegatesFocus:!0}}get editing(){return this._editing}async edit(){this._enterEdit()}getLabelBoundingClientRect(){return this._labelRef.value?this._labelRef.value.getBoundingClientRect():this.el.getBoundingClientRect()}willUpdate(t){if(t.has("value")||t.has("labelFormatter")){let e=this.value;this._displayedValue=this._internalLabelFormatter(e)}}updated(t){let e=this._inputRef.value,i=this.renderRoot.querySelector(".readOnlyLabel");e&&i&&(e.style.width=`${i.offsetWidth}px`)}_enterEdit(){this._editing||this.readOnly||(this._editing=!0,this.requestUpdate("editing",!1),this.updateComplete.then(async()=>{let t=this._inputRef.value;await t?.setFocus(),await t?.selectText()}))}_exitEdit(t,e=!1){this._editing&&(t?this._commitValue(this._inputRef.value):this._inputRef.value&&(this._displayedValue=this._internalLabelFormatter(this.value),this._inputRef.value.value=`${this.value}`),this._editing=!1,this.requestUpdate("editing",!0),e||this.updateComplete.then(async()=>{await this._buttonRef.value?.setFocus()}))}_commitValue(t){let e=this._parseNumber(t?.value??"");e!==null&&this.value!==e&&(this.value=e,this.arcgisChange.emit())}_parseNumber(t){if(t.trim()==="")return null;let e=Number(t);return Number.isFinite(e)?e:this.value??null}_internalLabelFormatter(t){let e=this.labelFormatter;return e?e(t,this._formatValue)??this._formatValue(t):this._formatValue(t)}_onBlur(){this._exitEdit(!0,!0)}_onValueChange(t){this._commitValue(t.currentTarget)}_onKeyDown(t){t.key==="Enter"?(this._exitEdit(!0),t.stopPropagation(),t.preventDefault()):t.key==="Escape"&&(this._exitEdit(!1),t.stopPropagation(),t.preventDefault())}_onPointerDown(t){this._pointerDownPosition={x:t.clientX,y:t.clientY}}_onClick(t){if(this._pointerDownPosition){let e=t.clientX-this._pointerDownPosition.x,i=t.clientY-this._pointerDownPosition.y;if(Math.sqrt(e*e+i*i)>2)return}this._enterEdit(),this._pointerDownPosition=null}_onInput(t){let e=this._parseNumber(t.currentTarget.value??"");if(e===null){this._displayedValue="";return}this._displayedValue=this._internalLabelFormatter(e)}render(){let{alignment:t,_displayedValue:e}=this,i=[n`<span class="readOnlyLabel"><span ${s(this._labelRef)}>${e}</span></span>`];return this.readOnly||i.push(n`<calcite-button .alignment=${t} appearance=transparent .hidden=${this._editing} kind=neutral @pointerdown=${this._onPointerDown} @click=${this._onClick} scale=s width=full ${s(this._buttonRef)}>${e}</calcite-button>`,n`<calcite-input-number .alignment=${t} group-separator .hidden=${!this._editing} number-button-type=none @calciteInputNumberChange=${this._onValueChange} @keydown=${this._onKeyDown} @blur=${this._onBlur} @input=${this._onInput} scale=s status=idle .value=${`${this.value}`} ${s(this._inputRef)}></calcite-input-number>`),i}};h("arcgis-label-input",l);return l},"intl")