@arcgis/core/widgets/FeatureTable/Grid/EditorColumn.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as t}from"../../../chunks/tslib.es6.js";import{on as e,sync as n}from"../../../core/reactiveUtils.js";import{property as o}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/has.js";import"../../../core/Logger.js";import"../../../core/RandomLCG.js";import{subclass as i}from"../../../core/accessorSupport/decorators/subclass.js";import l from"./Column.js";import{autoLink as r}from"../../support/uriUtils.js";const s={showInput:"Enter",cancelEdit:"Escape"},a=Symbol();let c=class extends l{constructor(t){super(t),this.editInfo=null,this.cellValueValidatorFunction=({oldValue:t,value:e})=>t!==e,this.editable=!0,this.headerRenderFunction=t=>{const{root:e}=t,n=this.createHeaderContent();this.tableEditingEnabled&&!this.effectiveEditable&&n.prepend(this._lockIconNode),this.removeCellContent(e),e.appendChild(n)},this.inputRenderFunction=({root:t,column:e,rowData:n})=>{if(this.editInfo||!this.effectiveEditable||!n)return;const o=this.getCellValue(n),i=this.createInputElement({value:o});this._set("editInfo",{column:e,inputs:[i],root:t,rowData:n,oldValue:o});const l=document.createElement("div");l.appendChild(i),this.removeCellContent(t),t.appendChild(l),i.focus(),i instanceof HTMLInputElement&&i.select()},this.loadingMessage="",this.inputType="text",this.maxLength=null,this.onShowPromptCallback=()=>{},this.parseInputValueFunction=({inputs:t})=>t?.length||1!==t.length||Array.isArray(t[0].value)?null:t[0].value,this.renderFunction=t=>{const{root:e,rowData:n}=t,{editInfo:o}=this;if(o)return;const i=this.getCellValue(n),l=this.cellValueFormatFunction({root:e,rowData:n,value:i});let a=null;e.onclick=()=>e.focus(),e.ondblclick=()=>this.inputRenderFunction(t),e.ontouchend=()=>this.inputRenderFunction(t);const c=this.grid?.getSlotElementByName(e.slot),u=c?.parentElement;u&&!u.onkeydown&&(u.onkeydown=e=>{e.key!==s.showInput||this.editInfo||this.inputRenderFunction(t),e.key===s.cancelEdit&&this.editInfo&&this.cancel()}),null!=i&&null!=l?e.title=l.toString():e.title&&e.removeAttribute("title"),a=l instanceof HTMLElement?l:r(this.messagesURIUtils,l),this.removeCellContent(e),a instanceof HTMLElement?e.appendChild(a):null!=a&&(e.innerHTML=a.toString())},this.required=!1,this.tableEditingEnabled=!1}get _lockIconNode(){return this.createCalciteIcon({icon:"lock",textLabel:this.messages?.editingPreventedColumn})}get effectiveEditable(){return this.tableEditingEnabled&&this.editable}get effectiveRequired(){return this.required}get editing(){return!!this.editInfo}get shouldShowPrompt(){return!1}cancel(){this.onEditComplete()}createCalciteOption(t,e,n=!1){const o=document.createElement("calcite-option");return o.label=t,o.value=`${e}`,o.selected=n,o}createCalciteSelect(t,e){const{effectiveRequired:n,messages:o}=this;let i=!1;const l=e.map((({name:e,value:n})=>{const o=n===t;return o&&(i=!0),this.createCalciteOption(e,n,o)}));if(null!=t&&""!==t&&!i){const e=t.toString(),n=this.createCalciteOption(e,e);l.unshift(n)}n||l.unshift(this.createCalciteOption(`<${o?.noValue}>`,""));const r=document.createElement("calcite-select");return l.forEach((t=>r.appendChild(t))),r}createInputElement({value:t}){const{effectiveRequired:o,maxLength:i}=this,l=document.createElement("calcite-input");return null!=i&&(l.maxLength=i),l.required=o,l.value=null!=t?t.toString():"",this.addHandles([e((()=>l),"calciteInputChange",(()=>this.onInputBlur()),n),e((()=>l),"keydown",(t=>{t.key===s.cancelEdit&&this.onInputBlur(!0)}),n),e((()=>l),"blur",(()=>this.onInputBlur()),n)],a),l}createDateComponent(){const t=document.createElement("calcite-input-date-picker");return t.focusTrapDisabled=!0,t.overlayPositioning="fixed",t}createTimeComponent(){const t=document.createElement("calcite-input-time-picker");return t.overlayPositioning="fixed",t.placement="auto-start",t.step=1,t}createTimeZoneComponent(){const t=document.createElement("calcite-input-time-zone");return t.maxItems=4,t.overlayPositioning="fixed",t}onEditComplete(){this._set("editInfo",null),this.grid?.generateCellPartNames(),this.grid?.requestContentUpdate()}onInputBlur(t=!1){this.removeHandles(a),t?this.cancel():this.submit()}async submit(){const{editInfo:t}=this;if(!t)return void this.cancel();const{inputs:e,rowData:n,oldValue:o}=t,i=this.parseInputValueFunction({inputs:e});if(!this.cellValueValidatorFunction({value:i,oldValue:o}))return void this.cancel();const{root:l}=t,r=n.item.objectId,{fieldName:s}=this;l.textContent=this.loadingMessage,this.shouldShowPrompt?this.onShowPromptCallback({column:this,objectId:r,oldValue:o,value:i}):await this.updateItems({objectId:r,updates:[{fieldName:s,value:i}]})}async updateItems(t){const{store:e}=this;if(e)try{await e.updateItem(t),this.onEditComplete()}catch{this.cancel()}else this.cancel()}};t([o()],c.prototype,"_lockIconNode",null),t([o({readOnly:!0})],c.prototype,"editInfo",void 0),t([o()],c.prototype,"cellValueValidatorFunction",void 0),t([o()],c.prototype,"editable",void 0),t([o()],c.prototype,"effectiveEditable",null),t([o()],c.prototype,"effectiveRequired",null),t([o()],c.prototype,"editing",null),t([o()],c.prototype,"headerRenderFunction",void 0),t([o()],c.prototype,"inputRenderFunction",void 0),t([o({constructOnly:!0})],c.prototype,"loadingMessage",void 0),t([o()],c.prototype,"inputType",void 0),t([o()],c.prototype,"maxLength",void 0),t([o()],c.prototype,"onShowPromptCallback",void 0),t([o()],c.prototype,"parseInputValueFunction",void 0),t([o()],c.prototype,"renderFunction",void 0),t([o()],c.prototype,"required",void 0),t([o()],c.prototype,"shouldShowPrompt",null),t([o()],c.prototype,"tableEditingEnabled",void 0),c=t([i("esri.widgets.FeatureTable.Grid.EditorColumn")],c);const u=c;export{u as default};