@arcgis/core 4.28.5 → 4.28.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/esri/core/workers/RemoteClient.js +1 -1
- package/assets/esri/core/workers/chunks/5b17de91091fc17d9821.js +1 -0
- package/kernel.js +1 -1
- package/package.json +1 -1
- package/support/revision.js +1 -1
- package/widgets/FeatureForm/featureFormUtils.js +1 -1
- package/widgets/FeatureForm.js +1 -1
- package/widgets/Features.js +1 -1
- package/widgets/Popup.js +1 -1
- package/widgets/Sketch.js +1 -1
- package/widgets/support/dateUtils.js +1 -1
- package/assets/esri/core/workers/chunks/4747741429e8ff7112bb.js +0 -1
package/widgets/FeatureForm.js
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
|
3
3
|
See https://js.arcgis.com/4.28/esri/copyright.txt for details.
|
|
4
4
|
*/
|
|
5
|
-
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{isSome as t}from"../core/arrayUtils.js";import{deprecatedProperty as i}from"../core/deprecate.js";import o from"../core/Logger.js";import{watch as n,whenOnce as a}from"../core/reactiveUtils.js";import{property as s}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import{isIntegerField as l}from"../layers/support/fieldUtils.js";import d from"./Widget.js";import{css as p}from"./FeatureForm/css.js";import{isGroupInput as c,isFieldInput as u,isRelationshipInput as m,isInputInGroupInput as h,isFieldElementWithInputType as v,getErrorMessageForFieldInput as _,getIconForFeature as g,isNumberFieldInput as b}from"./FeatureForm/featureFormUtils.js";import f from"./FeatureForm/FeatureFormViewModel.js";import{loadCalciteComponents as C}from"./support/componentsUtils.js";import{isString as y}from"./support/dataUtils.js";import{getLabelForDateFieldValue as F,numberingSystem as w,prepareISOFieldValueForDateComponents as R,prepareUnixFieldValueForDateComponents as O,normalizeTimeOnlyString as k,getISOFieldValueFromDateComponents as I,getUnixFieldValueFromDateComponents as M}from"./support/dateUtils.js";import{globalCss as D}from"./support/globalCss.js";import{Heading as x,incrementHeadingLevel as V}from"./support/Heading.js";import"./support/widgetUtils.js";import{messageBundle as N}from"./support/decorators/messageBundle.js";import{vmEvent as T}from"./support/decorators/vmEvent.js";import{tsx as L}from"./support/jsxFactory.js";import{substitute as j}from"../intl/substitute.js";const E="data-field-name",U="esri.widgets.FeatureForm",S=o.getLogger(U);let $=class extends d{constructor(e,t){super(e,t),this._attemptFocusOnNextRender=!1,this._dateComponentMap=new Map,this._inputsWithChanges=new Set,this._focusedFieldName=null,this._listObserverNode=null,this._listObserver=new IntersectionObserver((e=>{e.length&&e[0].isIntersecting&&this._incrementRelatedRecordPage()}),{root:window.document}),this.groupDisplay="all",this.headingLevel=2,this.messages=null,this.messagesCommon=null,this.messagesFeature=null,this.messagesTemplates=null,this.viewModel=new f,this._onShowAllRelatedRecordsClick=e=>{const{feature:t,relatedRecordCallbacks:i}=this;t&&i?.showAllRelatedRecords&&i.showAllRelatedRecords({parentFeature:t,relationshipId:e})},this._onAddRelatedRecordsClick=(e,t)=>{const{feature:i,relatedRecordCallbacks:o}=this;i&&o?.addRelatedRecord&&o.addRelatedRecord({parentFeature:i,relatedLayer:t,relationshipId:e})},this._onFormKeyDown=this._onFormKeyDown.bind(this),this._onFormSubmit=this._onFormSubmit.bind(this),this._onGroupToggle=this._onGroupToggle.bind(this),this._onComponentBlur=this._onComponentBlur.bind(this),this._onComponentFocus=this._onComponentFocus.bind(this),this._onComponentKeyDown=this._onComponentKeyDown.bind(this),this._afterComponentCreate=this._afterComponentCreate.bind(this),this._afterComponentCreateOrUpdate=this._afterComponentCreateOrUpdate.bind(this),this._afterDateComponentCreate=this._afterDateComponentCreate.bind(this),this._afterDateComponentCreateOrUpdate=this._afterDateComponentCreateOrUpdate.bind(this),this._afterRadioGroupCreateOrUpdate=this._afterRadioGroupCreateOrUpdate.bind(this)}initialize(){this.addHandles([n((()=>this.feature),(()=>{a((()=>!this.viewModel.updating)).then((()=>{const e=this._getFocusableInput("forward");this._inputsWithChanges.clear(),this._dateComponentMap.clear(),this._syncGroupInputStates(),this._focusedFieldName=e?.name||null,this._attemptFocusOnNextRender=!0}))})),n((()=>this.groupDisplay),(()=>this._syncGroupInputStates())),this.on("submit",(e=>{if(e.invalid.length>0){const[t]=e.invalid;e.invalid.forEach((e=>this._inputsWithChanges.add(e))),this._focusedFieldName=t,this._attemptFocusOnNextRender=!0,this.scheduleRender()}})),n((()=>[this.viewModel.activeRelationshipInput,this._listObserverNode]),(()=>this._onObserverChange()))])}loadDependencies(){return C({block:()=>import("@esri/calcite-components/dist/components/calcite-block.js"),button:()=>import("@esri/calcite-components/dist/components/calcite-button.js"),combobox:()=>import("@esri/calcite-components/dist/components/calcite-combobox.js"),"combobox-item":()=>import("@esri/calcite-components/dist/components/calcite-combobox-item.js"),"combobox-item-group":()=>import("@esri/calcite-components/dist/components/calcite-combobox-item-group.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),input:()=>import("@esri/calcite-components/dist/components/calcite-input.js"),"input-date-picker":()=>import("@esri/calcite-components/dist/components/calcite-input-date-picker.js"),"input-message":()=>import("@esri/calcite-components/dist/components/calcite-input-message.js"),"input-number":()=>import("@esri/calcite-components/dist/components/calcite-input-number.js"),"input-time-picker":()=>import("@esri/calcite-components/dist/components/calcite-input-time-picker.js"),"input-time-zone":()=>import("@esri/calcite-components/dist/components/calcite-input-time-zone.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),list:()=>import("@esri/calcite-components/dist/components/calcite-list.js"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js"),notice:()=>import("@esri/calcite-components/dist/components/calcite-notice.js"),"radio-button":()=>import("@esri/calcite-components/dist/components/calcite-radio-button.js"),"radio-button-group":()=>import("@esri/calcite-components/dist/components/calcite-radio-button-group.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js"),"text-area":()=>import("@esri/calcite-components/dist/components/calcite-text-area.js")})}destroy(){this._listObserverNode&&this._listObserver.unobserve(this._listObserverNode)}get _relatedRecordsEnabled(){const e=this.relatedRecordCallbacks;return!(!e||!(e.addRelatedRecord||e.editRelatedRecord||e.showAllRelatedRecords))}get disabled(){return this.viewModel.disabled}set disabled(e){this.viewModel.disabled=e}get feature(){return this.viewModel.feature}set feature(e){this.viewModel.feature=e}get formTemplate(){return this.viewModel.formTemplate}set formTemplate(e){this.viewModel.formTemplate=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get map(){return this.viewModel.map}set map(e){this.viewModel.map=e}get relatedRecordCallbacks(){return this.viewModel.relatedRecordCallbacks}set relatedRecordCallbacks(e){this.viewModel.relatedRecordCallbacks=e}get relationshipId(){return this.viewModel.relationshipId}set relationshipId(e){this.viewModel.relationshipId=e}get spatialReference(){return this.viewModel.spatialReference}set spatialReference(e){this.viewModel.spatialReference=e}get strict(){return this.viewModel.strict}set strict(e){this.viewModel.strict=e}get timeZone(){return this.viewModel.timeZone}set timeZone(e){this.viewModel.timeZone=e}get view(){return i(S,"view",{replacement:"Use FeatureForm.map instead.",version:"4.27"}),this.viewModel.view}set view(e){i(S,"view",{replacement:"Use FeatureForm.map instead.",version:"4.27"}),this.viewModel.view=e}getValues(){return this.viewModel.getValues()}submit(){return this.viewModel.submit()}render(){const{state:e}=this.viewModel;return L("div",{class:this.classes(p.base,D.widget,D.panel)},"ready"===e?this._renderForm():null)}_renderForm(){return L("form",{class:p.form,novalidate:!0,onkeydown:this._onFormKeyDown,onsubmit:this._onFormSubmit},this._renderHeader(),this._renderContent())}_renderHeader(){const e=this.viewModel;if(!e.formHeaderVisible)return;const t=null!=e.formTitle&&L(x,{key:"title",level:this.headingLevel},e.formTitle),i=null!=e.formDescription&&L("p",{class:p.description,key:"description"},e.formDescription);return L("div",{class:p.formHeader},t,i)}_renderContent(){const{viewModel:e}=this;return e.activeRelationshipInput?this._renderActiveRelationshipInput(e.activeRelationshipInput):e.inputs.filter(t).filter((e=>e.visible)).map(((e,t)=>c(e)?this._renderGroup(e,t):u(e)?this._renderLabeledField(e):m(e)?this._renderRelationshipInput(e):void 0))}_renderActiveRelationshipInput(e){return this._renderRelationshipInput(e)}_renderDescriptionOrEmpty(e,t){return null==e?null:L("div",{class:this.classes(p.description),id:t},e)}_renderGroup(e,t){const{disabled:i,formTemplate:o,headingLevel:n}=this,{description:a,inputs:s,label:r,open:l}=e,d=s.filter((e=>e.visible)),c=this.viewModel.findField(this._focusedFieldName),h=c?.group===e,v=`${this.id}_group_${t}`,_="sequential"===this.groupDisplay;return L("calcite-block",{class:this.classes(p.group,_?p.groupSequential:null,h?p.groupActive:null,i?p.inputDisabled:null),collapsible:!0,"data-group":e,description:a||void 0,disabled:i,heading:`${r}`,headingLevel:o?.title?V(n):n,id:v,key:v,open:l,onCalciteBlockToggle:({target:t})=>this._onGroupToggle(t,e)},d.map((e=>u(e)?this._renderLabeledField(e):m(e)?this._renderRelationshipInput(e):void 0)))}_getFocusableInput(e,t){const i=this.viewModel.allFieldInputs,o="forward"===e?i:i.slice().reverse();let n;if(!t||m(t))n=0;else if(c(t)){const e=t.inputs.find(u);n=e?o.indexOf(e):0}else{let i;if(h(t)&&!t.group.open){const o=t.group.inputs.filter(u);i="forward"===e?o[o.length-1]:o[0]}else i=t;n=o.indexOf(i)+1}for(let a=n;a<o.length;a++){const e=o[a];if(e.visible&&u(e))return e}return null}_renderLabeledField(e){const{dataType:t,feature:i,label:o,layer:n,required:a}=e,s={"aria-label":a?j(this.messages.requiredFieldLabel,{name:o}):o,class:p.label,key:`${n.id}-${i.uid}-${e.name}`},r=[L("div",{class:p.labelTextContent,key:"labelTextContainer"},o,a?L("span",{"aria-hidden":"true",title:this.messagesCommon.required},"*"):void 0),"unsupported"!==t?this._renderFieldInput(e):this._renderReadOnlyComponent(e),this._renderAuxiliaryText(e)];return"date"===t&&"coded-value"!==e.domain?.type?L("label",{...s},r):L("calcite-label",{...s},r)}_renderFieldInput(e){const{dataType:t,domain:i,inputType:o,name:n}=e,a=this.getCommonInputProps(e);if("coded-value"===i?.type){const t=this.viewModel.getFieldValueOptionsForField(n,this.messages.empty);return"switch"!==o||e.hasInvalidSwitchValue?"radio-buttons"===o?this._renderRadioButtonComponents(e,t.flat(),a):this._renderComboBoxComponent(e,t,a):this._renderSwitchComponent(e,a)}return"datetime-picker"===o||"date"===t?this._renderDateComponents(e,a):"number"===t?this._renderNumberComponent(e,a):this._renderStringComponent(e,a)}_renderStringComponent(e,t){return"text-area"===e.inputType?t.readOnly?L("calcite-input",{...t,loading:e.updating,type:"textarea",onCalciteInputInput:e=>this._saveValueFromComponent(e.target)}):L("calcite-text-area",{...t,resize:"vertical",onCalciteTextAreaInput:e=>this._saveValueFromComponent(e.target)}):L("calcite-input",{...t,loading:e.updating,type:"text",onCalciteInputInput:e=>this._saveValueFromComponent(e.target)})}_renderNumberComponent(e,t){return L("calcite-input-number",{...t,integer:l(e.field),loading:e.updating,type:"number",onCalciteInputNumberInput:e=>this._saveValueFromComponent(e.target)})}_renderDateComponents(e,t){const{field:i}=e;switch(i.type){case"date":return this._renderDateFieldComponents(e,t);case"date-only":return this._renderDateOnlyFieldComponent(e,t);case"time-only":return this._renderTimeOnlyFieldComponent(e,t);case"timestamp-offset":return this._renderTimestampOffsetFieldComponents(e,t);default:return this._renderReadOnlyComponent(e,F(e.field,t.value,{timeZone:this.timeZone}))}}_renderDateOnlyFieldComponent(e,t){const{range:i,valid:o,value:n}=e,{class:a,key:s,readOnly:r}=t,{rawMax:l,rawMin:d}=i;return L("calcite-input-date-picker",{afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!o,class:a,"data-date-part":"date","data-field-name":t[E],key:`${s}-date-input`,max:y(l)?l:void 0,min:y(d)?d:void 0,numberingSystem:w,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},onfocus:this._onComponentFocus,overlayPositioning:"fixed",readOnly:r,value:null!=n?`${n}`:void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)})}_renderTimeOnlyFieldComponent(e,t){const{valid:i,value:o}=e,{class:n,key:a,readOnly:s}=t;return L("calcite-input-time-picker",{afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!i,class:n,"data-date-part":"time","data-field-name":t[E],key:`${a}-time-input`,numberingSystem:w,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},onfocus:this._onComponentFocus,overlayPositioning:"fixed",readOnly:s,step:e.timeStep,value:null!=o?`${o}`:void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)})}_renderTimestampOffsetFieldComponents(e,t){const{name:i,range:o,valid:n,value:a}=e,{class:s,key:r,readOnly:l}=t,{rawMax:d,rawMin:c}=o,u={afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!n,numberingSystem:w,overlayPositioning:"fixed",readOnly:l,[E]:i,onfocus:this._onComponentFocus},m=R(d),h=R(c),v=R(a);return L("div",{class:p.dateInputContainer,key:`${r}-date-time-container`},L("calcite-input-date-picker",{...u,class:s,"data-date-part":"date",key:`${r}-date-input`,max:m?.date??void 0,min:h?.date??void 0,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:v.date??void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)}),L("calcite-input-time-picker",{...u,class:s,"data-date-part":"time",key:`${r}-time-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},step:e.timeStep,value:v.time??void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)}),e.includeTimeOffset?L("calcite-input-time-zone",{...u,class:s,"data-date-part":"timeZone",disabled:l,key:`${r}-timezone-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:v.timeZoneOffset??"0",onCalciteInputTimeZoneChange:e=>this._saveValueFromDateComponent(e.target)}):null)}_renderDateFieldComponents(e,t){const{includeTime:i,name:o,valid:n,value:a}=e,{class:s,key:r,max:l,min:d,readOnly:c}=t,{timeZone:u}=this,m={afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!n,numberingSystem:w,overlayPositioning:"fixed",readOnly:c,[E]:o,onfocus:this._onComponentFocus},h=O(a,u),v=O(l,u),_=O(d,u);return L("div",{class:p.dateInputContainer,key:`${r}-date-time-container`},L("calcite-input-date-picker",{...m,class:s,"data-date-part":"date",key:`${r}-date-input`,max:v?.date??void 0,min:_?.date??void 0,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:h.date??void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)}),i?L("calcite-input-time-picker",{...m,class:s,"data-date-part":"time",key:`${r}-time-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},step:1,value:h.time??void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)}):null)}_renderReadOnlyComponent(e,t){const i=this.getCommonInputProps(e);return L("calcite-input",{...i,class:this.classes(p.fieldInput,p.inputDisabled),readOnly:!0,type:"text",value:null!=t?`${t}`:i.value})}_renderComboBoxComponent(e,t,i){const{value:o,name:n}=e,{messages:a,messagesTemplates:s,viewModel:r,_inputsWithChanges:l}=this,d=t.map((e=>e.map((({name:e,value:t})=>L("calcite-combobox-item",{key:`#${t}`,selected:o===t,textLabel:e,value:`${t}`}))))),[p,c]=d;this.viewModel.fieldsWithInvalidCodedValue.has(e)&&c.unshift(L("calcite-combobox-item",{key:"incompatible-option",readOnly:!0,textLabel:`${e.value}`,value:`${e.value}`}));const u=c.length>0?[L("calcite-combobox-item-group",{key:"recommended",label:a.recommended},p),L("calcite-combobox-item-group",{key:"other",label:s.other},c)]:p,m="INSERT"===r.arcadeEditType,h=l.has(n),v=null==o&&(!m||h);if(e.showNoValueOptionEnabled){const t="",i=e.showNoValueLabel||a.empty;u.unshift(L("calcite-combobox-item",{key:"empty-option",selected:v,textLabel:a.empty,value:t},i))}const _=m&&e.showNoValueOptionEnabled&&!h?()=>{}:i.onblur;return L("calcite-combobox",{...i,allowCustomValues:!1,clearDisabled:!0,disabled:i.readOnly,onblur:_,overlayPositioning:"fixed",selectionMode:"single",onCalciteComboboxChange:({target:e})=>{v&&0===e.selectedItems.length?this._ignoreDeselectionOfNoValueOption(e):this._saveValueFromComponent(e)}},u)}_renderRadioButtonComponents(e,t,i){const{name:o,value:n}=e,a=t.map((({name:e,value:t})=>this._renderRadioButtonComponent({key:e,label:e,name:o,value:t,selected:t===n,props:i})));if(e.showNoValueOptionEnabled){const t="",s=e.showNoValueLabel||this.messages.empty,r=n===t||null===n;a.unshift(this._renderRadioButtonComponent({key:"empty-option",label:s,name:o,value:t,selected:r,props:i}))}return L("calcite-radio-button-group",{afterCreate:this._afterRadioGroupCreateOrUpdate,afterUpdate:this._afterRadioGroupCreateOrUpdate,class:p.inputRadioGroup,"data-field-name":i[E],key:`${i.key}-radio-group`,layout:"vertical",name:i.key,required:i.required},a)}_renderSwitchComponent(e,t){const{value:i}=e,o=!!v(e.element,"switch")&&i===e.element.input.onValue;return L("calcite-switch",{...t,checked:o,class:p.inputSwitch,disabled:t.readOnly,onblur:()=>{this._focusedFieldName=null},onCalciteSwitchChange:e=>this._saveValueFromComponent(e.target)})}_renderRadioButtonComponent({key:e,name:t,value:i,selected:o,label:n,props:a}){return L("calcite-label",{class:p.inputRadioLabel,key:e,layout:"inline"},L("calcite-radio-button",{...a,afterCreate:void 0,afterUpdate:void 0,checked:o,class:p.inputRadio,disabled:a.readOnly,name:t,onblur:()=>{this._focusedFieldName=null},value:i,onCalciteRadioButtonChange:({target:e})=>{e.checked&&this._saveValueFromComponent(e)}}),n)}_renderAuxiliaryText(e){const t=e.name,i=this._inputsWithChanges.has(t)&&!e.valid?_(e,this.messages,this.timeZone):null!=this.viewModel.contingencyConstraintViolations.get(t)?this.messages.validationErrors.valuesIncompatible:null!=e.valueExpressionExecutor&&e.valueExpressionExecutor.stale?this.messages.valueExpressionError:null;return null!=i?L("calcite-input-message",{icon:!0,status:"invalid"},i):this._renderDescriptionOrEmpty(e.description)}_renderShowAllRelatedRecordsListItem(e){const{featureCount:t,relationshipId:i,showAllActionVisible:o}=e,{relatedRecordCallbacks:n}=this;if(!o||!n?.showAllRelatedRecords)return;const a=this.messages;return L("calcite-list-item",{description:j(a.totalCount,{count:t}),label:a.showAll,value:!0,onCalciteListItemSelect:()=>this._onShowAllRelatedRecordsClick(i)},L("calcite-icon",{icon:"list",scale:"s",slot:"content-end"}))}_renderAddRelatedRecordButton(e){const{canAddRelatedFeature:t,relationshipId:i,relatedLayer:o}=e,{messages:n,relatedRecordCallbacks:a}=this;if(t&&a?.addRelatedRecord&&o)return L("calcite-button",{alignment:"center",appearance:"outline-fill",class:p.centeredButton,disabled:e.updating||!e.originHasValidKey,iconStart:"plus",key:`${i}-add-button`,onclick:()=>this._onAddRelatedRecordsClick(i,o),round:!0,scale:"s",width:"half"},e.relatedLayerIsTable?n.addRecord:n.addFeature)}_renderRelatedRecordListItem(e,t){const{feature:i,description:o,title:n}=e,{feature:a,relatedRecordCallbacks:s}=this,{highlightHelper:r}=this.viewModel,l=()=>{r?.removeAll(),s?.editRelatedRecord&&a&&s.editRelatedRecord({parentFeature:a,relationshipId:t,relatedFeature:i})},d=r?()=>r.add(i):void 0,p=r?()=>r.remove(i):void 0;return L("calcite-list-item",{bind:this,description:o,key:`${t}-${i.uid}`,label:n,onclick:l,onmouseenter:d,onmouseleave:p,value:n},L("calcite-icon",{icon:g(i),scale:"m",slot:"content-start"}),L("calcite-icon",{icon:"chevron-right",scale:"s",slot:"content-end"}))}_renderRelationshipInput(e){if(!this._relatedRecordsEnabled||!e.editable)return;const{featureCount:t,relationshipId:i,showAllEnabled:o}=e,n=o?null:this._renderDescriptionOrEmpty(e.description),a=t>0?this._renderRelatedRecordsList(e):e.loaded?e.originHasValidKey?this._renderNoRelatedRecordsNotice():this._renderNoValidOriginKeyNotice(e):void 0;return L("calcite-label",{class:this.classes(p.label,p.relatedRecordsLabel),key:`relationship-${i}-container`},L("div",null,this._renderRelatedRecordsHeaderContainer(e),n,a),this._renderAddRelatedRecordButton(e))}_renderRelatedRecordsHeaderContainer(e){const t=e.updating||!e.loaded;return L("div",{class:p.relatedRecordsHeader,key:`relationship-${e.relationshipId}-header`},L("span",null,e.label),t?L("calcite-loader",{inline:!0,key:"loader",label:this.messagesCommon?.loading,scale:"s",type:"indeterminate"}):void 0)}_renderRelatedRecordsList(e){const{relationshipId:t}=e;return L("calcite-list",{class:p.relatedRecordsList},e.relatedFeatureInfos.map((e=>this._renderRelatedRecordListItem(e,t))),this._renderShowAllRelatedRecordsListItem(e),this._renderObserverNode())}_renderNoValidOriginKeyNotice(e){const{messages:t}=this,i=e.relatedLayerIsTable?t.noOriginKeyRecord:t.noOriginKeyFeature,o=e.relationship?.keyField,n=this.viewModel.findField(o),a=e.layer?.fieldsIndex.get(o),s=n?.label||a?.alias||o,r=j(i,{relatedLayerName:e.relatedLayer?.title,originKeyField:s});return L("calcite-notice",{icon:"information",kind:"brand",open:!0,scale:"s",width:"full"},L("div",{slot:"message"},r))}_renderNoRelatedRecordsNotice(){return L("calcite-notice",{icon:"information",kind:"brand",open:!0,scale:"s",width:"full"},L("div",{slot:"message"},this.messagesFeature.noRelatedFeatures))}_renderObserverNode(){if(this.viewModel.activeRelationshipInput?.showAllEnabled)return L("div",{afterCreate:this._afterListObserverCreated,afterRemoved:this._afterListObserverRemoved,bind:this,class:p.listObserver,key:"feature-observer"})}getCommonInputProps(e){const{disabled:t}=this,{editable:i,hint:o,label:n,maxLength:a,minLength:s,name:r,range:{max:l,min:d},required:c,valid:u,value:m}=e,h=this._inputsWithChanges.has(r),v=!i||t;return{afterCreate:this._afterComponentCreate,afterUpdate:this._afterComponentCreateOrUpdate,"aria-invalid":u?"false":"true",class:this.classes(p.fieldInput,v?p.inputDisabled:null,h&&!u?p.inputInvalid:null),key:r,label:n,max:null!=l?l:void 0,min:null!=d?d:void 0,maxLength:a>-1?a:void 0,minLength:s>-1?s:void 0,placeholder:o??void 0,readOnly:v,required:c,value:null==m?"":`${m}`,onblur:this._onComponentBlur,onfocus:this._onComponentFocus,onkeydown:this._onComponentKeyDown,[E]:r}}_getFieldInputFromHTMLElement(e){return this.viewModel.findField(e.getAttribute(E))}_afterDateComponentCreate(e){const t=this._getFieldInputFromHTMLElement(e),i=e.dataset.datePart,o=this._dateComponentMap.get(t.name);if("valueAsDate"in e&&null!=e.value){const t=e.value,i=new ResizeObserver((()=>{e.value=void 0,e.value=t,i.unobserve(e)}));i.observe(e)}if(null!=o)switch(i){case"date":o.date=e;break;case"time":o.time=e;break;case"timeZone":o.timeZone=e}else this._dateComponentMap.set(t.name,{[i]:e});this._afterDateComponentCreateOrUpdate(e)}_afterDateComponentCreateOrUpdate(e){this._afterComponentCreateOrUpdate(e)}_afterComponentCreate(e){const t=this._getFieldInputFromHTMLElement(e);b(t)&&null!=e.value&&"setNumberValue"in e&&e.setNumberValue({committing:!1,value:e.value,origin:"direct"}),this._afterComponentCreateOrUpdate(e)}_afterRadioGroupCreateOrUpdate(e){const t=e.selectedItem,i=e.querySelector("calcite-radio-button"),o=t||i;o&&this._afterComponentCreateOrUpdate(o)}_afterComponentCreateOrUpdate(e){const{viewModel:t}=this,i=this._getFieldInputFromHTMLElement(e),o=t.findField(this._focusedFieldName);this._attemptFocusOnNextRender&&o===i&&(this._attemptFocusOnNextRender=!1,h(i)&&(i.group.open=!0),e.setFocus())}_onComponentFocus(e){const t=e.target,i=this._getFieldInputFromHTMLElement(t);this._focusedFieldName=i.name}_onComponentBlur(e){const t=e.target;this._focusedFieldName=null,this._saveValueFromComponent(t)}_saveValueFromDateComponent(e){const t=this._getFieldInputFromHTMLElement(e),i=t.field.type,{name:o,range:n}=t,a=this._dateComponentMap.get(o);if(!a)return;let s=this.viewModel.getValue(o),r=null;"date-only"===i?r=e.value:"time-only"===i?(s=k(s),r=k(e.value)):r="timestamp-offset"===i?null!=e.value?I({dateComponent:a.date,timeComponent:a.time,timeZoneComponent:a.timeZone,oldValue:s}):null:null!=e.value?M({oldValue:s,dateComponent:a.date,timeComponent:a.time,timeZone:this.timeZone,max:n.max,min:n.min}):null,null!==r&&e.value?s!==r&&this._updateFieldValue(o,r):this._updateFieldValue(o,null)}_saveValueFromComponent(e){const t=this._getFieldInputFromHTMLElement(e);this._updateFieldValue(t.name,this._parseValue(e))}_onComponentKeyDown({key:e,target:t}){const i=this._getFieldInputFromHTMLElement(t);"Enter"===e&&h(i)&&!i.group.open&&(i.group.open=!0)}_updateFieldValue(e,t){if(this.viewModel.setValue(e,t),this._inputsWithChanges.add(e),this.viewModel.fieldsWithContingentValues.has(e)){const e=Object.fromEntries(Object.entries(this.getValues()).filter((([e,t])=>null!=t)));this.viewModel.validateContingencyConstraints(e)}}_parseValue(e){const t=this._getFieldInputFromHTMLElement(e),i=e.value;return v(t.element,"switch")?e.checked?t.element.input.onValue:t.element.input.offValue:null==i||""===i?null:"number"===t.dataType?"-0"===i||"-0."===i||"-0,"===i?i:parseFloat(i):"date"===t.field.type?parseFloat(i):i}_ignoreDeselectionOfNoValueOption(e){const{firstChild:t,selectedItems:i}=e;0===i.length&&t&&"selected"in t?t.selected=!0:S.warnOnce("Failed to override user attempt to deselect 'No value' option.")}_onGroupToggle(e,t){e.open?(t.open=!0,this._focusedFieldName=this._getFocusableInput("forward",t)?.name||null,this._attemptFocusOnNextRender=!0,"sequential"===this.groupDisplay&&this.viewModel.allGroupInputs.forEach((e=>{e!==t&&(e.open=!1)}))):t.open=!1,this.scheduleRender()}_onFormSubmit(e){e.preventDefault()}_onFormKeyDown(e){"Enter"===e.key&&this.viewModel.submit()}_afterListObserverCreated(e){this.viewModel.activeRelationshipInput&&(this._listObserverNode=e)}_afterListObserverRemoved(){this._listObserverNode=null}_onObserverChange(){this._listObserverNode&&this._listObserver.unobserve(this._listObserverNode);const e=this.viewModel.activeRelationshipInput;e&&this._listObserverNode&&e.showAllEnabled&&this._listObserver.observe(this._listObserverNode)}_incrementRelatedRecordPage(){const e=this.viewModel.activeRelationshipInput;e?.incrementPage()}_syncGroupInputStates(){if("sequential"!==this.groupDisplay)return;const e=this.viewModel.allGroupInputs;if(!e.length)return;const t=e.filter((e=>e.open));0===t.length?e[0].open=!0:t.length>1&&t.slice(1).forEach((e=>e.open=!1))}};e([s()],$.prototype,"_listObserverNode",void 0),e([s()],$.prototype,"_relatedRecordsEnabled",null),e([s()],$.prototype,"disabled",null),e([s()],$.prototype,"feature",null),e([s()],$.prototype,"formTemplate",null),e([s()],$.prototype,"groupDisplay",void 0),e([s()],$.prototype,"headingLevel",void 0),e([s()],$.prototype,"label",null),e([s()],$.prototype,"layer",null),e([s()],$.prototype,"map",null),e([s(),N("esri/widgets/FeatureForm/t9n/FeatureForm")],$.prototype,"messages",void 0),e([s(),N("esri/t9n/common")],$.prototype,"messagesCommon",void 0),e([s(),N("esri/widgets/Feature/t9n/Feature")],$.prototype,"messagesFeature",void 0),e([s(),N("esri/widgets/FeatureTemplates/t9n/FeatureTemplates")],$.prototype,"messagesTemplates",void 0),e([s()],$.prototype,"relatedRecordCallbacks",null),e([s()],$.prototype,"relationshipId",null),e([s()],$.prototype,"spatialReference",null),e([s()],$.prototype,"strict",null),e([s()],$.prototype,"timeZone",null),e([s()],$.prototype,"view",null),e([s(),T(["value-change","submit"])],$.prototype,"viewModel",void 0),$=e([r(U)],$);const A=$;export{A as default};
|
|
5
|
+
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{isSome as t}from"../core/arrayUtils.js";import{deprecatedProperty as i}from"../core/deprecate.js";import o from"../core/Logger.js";import{watch as n,whenOnce as a}from"../core/reactiveUtils.js";import{property as s}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import{isIntegerField as l}from"../layers/support/fieldUtils.js";import d from"./Widget.js";import{css as p}from"./FeatureForm/css.js";import{isGroupInput as c,isFieldInput as u,isRelationshipInput as m,isInputInGroupInput as h,isFieldElementWithInputType as v,getErrorMessageForFieldInput as _,getIconForFeature as g,isNumberFieldInput as b}from"./FeatureForm/featureFormUtils.js";import C from"./FeatureForm/FeatureFormViewModel.js";import{loadCalciteComponents as f}from"./support/componentsUtils.js";import{isString as y}from"./support/dataUtils.js";import{getLabelForDateFieldValue as F,getIntlOptionsForField as w,numberingSystem as R,prepareISOFieldValueForDateComponents as O,prepareUnixFieldValueForDateComponents as k,normalizeTimeOnlyString as I,getISOFieldValueFromDateComponents as M,getUnixFieldValueFromDateComponents as D}from"./support/dateUtils.js";import{globalCss as x}from"./support/globalCss.js";import{Heading as V,incrementHeadingLevel as N}from"./support/Heading.js";import"./support/widgetUtils.js";import{messageBundle as T}from"./support/decorators/messageBundle.js";import{vmEvent as L}from"./support/decorators/vmEvent.js";import{tsx as j}from"./support/jsxFactory.js";import{substitute as E}from"../intl/substitute.js";const U="data-field-name",S="esri.widgets.FeatureForm",$=o.getLogger(S);let A=class extends d{constructor(e,t){super(e,t),this._attemptFocusOnNextRender=!1,this._dateComponentMap=new Map,this._inputsWithChanges=new Set,this._focusedFieldName=null,this._listObserverNode=null,this._listObserver=new IntersectionObserver((e=>{e.length&&e[0].isIntersecting&&this._incrementRelatedRecordPage()}),{root:window.document}),this.groupDisplay="all",this.headingLevel=2,this.messages=null,this.messagesCommon=null,this.messagesFeature=null,this.messagesTemplates=null,this.viewModel=new C,this._onShowAllRelatedRecordsClick=e=>{const{feature:t,relatedRecordCallbacks:i}=this;t&&i?.showAllRelatedRecords&&i.showAllRelatedRecords({parentFeature:t,relationshipId:e})},this._onAddRelatedRecordsClick=(e,t)=>{const{feature:i,relatedRecordCallbacks:o}=this;i&&o?.addRelatedRecord&&o.addRelatedRecord({parentFeature:i,relatedLayer:t,relationshipId:e})},this._onFormKeyDown=this._onFormKeyDown.bind(this),this._onFormSubmit=this._onFormSubmit.bind(this),this._onGroupToggle=this._onGroupToggle.bind(this),this._onComponentBlur=this._onComponentBlur.bind(this),this._onComponentFocus=this._onComponentFocus.bind(this),this._onComponentKeyDown=this._onComponentKeyDown.bind(this),this._afterComponentCreate=this._afterComponentCreate.bind(this),this._afterComponentCreateOrUpdate=this._afterComponentCreateOrUpdate.bind(this),this._afterDateComponentCreate=this._afterDateComponentCreate.bind(this),this._afterDateComponentCreateOrUpdate=this._afterDateComponentCreateOrUpdate.bind(this),this._afterRadioGroupCreateOrUpdate=this._afterRadioGroupCreateOrUpdate.bind(this)}initialize(){this.addHandles([n((()=>this.feature),(()=>{a((()=>!this.viewModel.updating)).then((()=>{const e=this._getFocusableInput("forward");this._inputsWithChanges.clear(),this._dateComponentMap.clear(),this._syncGroupInputStates(),this._focusedFieldName=e?.name||null,this._attemptFocusOnNextRender=!0}))})),n((()=>this.groupDisplay),(()=>this._syncGroupInputStates())),this.on("submit",(e=>{if(e.invalid.length>0){const[t]=e.invalid;e.invalid.forEach((e=>this._inputsWithChanges.add(e))),this._focusedFieldName=t,this._attemptFocusOnNextRender=!0,this.scheduleRender()}})),n((()=>[this.viewModel.activeRelationshipInput,this._listObserverNode]),(()=>this._onObserverChange()))])}loadDependencies(){return f({block:()=>import("@esri/calcite-components/dist/components/calcite-block.js"),button:()=>import("@esri/calcite-components/dist/components/calcite-button.js"),combobox:()=>import("@esri/calcite-components/dist/components/calcite-combobox.js"),"combobox-item":()=>import("@esri/calcite-components/dist/components/calcite-combobox-item.js"),"combobox-item-group":()=>import("@esri/calcite-components/dist/components/calcite-combobox-item-group.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),input:()=>import("@esri/calcite-components/dist/components/calcite-input.js"),"input-date-picker":()=>import("@esri/calcite-components/dist/components/calcite-input-date-picker.js"),"input-message":()=>import("@esri/calcite-components/dist/components/calcite-input-message.js"),"input-number":()=>import("@esri/calcite-components/dist/components/calcite-input-number.js"),"input-time-picker":()=>import("@esri/calcite-components/dist/components/calcite-input-time-picker.js"),"input-time-zone":()=>import("@esri/calcite-components/dist/components/calcite-input-time-zone.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),list:()=>import("@esri/calcite-components/dist/components/calcite-list.js"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js"),notice:()=>import("@esri/calcite-components/dist/components/calcite-notice.js"),"radio-button":()=>import("@esri/calcite-components/dist/components/calcite-radio-button.js"),"radio-button-group":()=>import("@esri/calcite-components/dist/components/calcite-radio-button-group.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js"),"text-area":()=>import("@esri/calcite-components/dist/components/calcite-text-area.js")})}destroy(){this._listObserverNode&&this._listObserver.unobserve(this._listObserverNode)}get _relatedRecordsEnabled(){const e=this.relatedRecordCallbacks;return!(!e||!(e.addRelatedRecord||e.editRelatedRecord||e.showAllRelatedRecords))}get disabled(){return this.viewModel.disabled}set disabled(e){this.viewModel.disabled=e}get feature(){return this.viewModel.feature}set feature(e){this.viewModel.feature=e}get formTemplate(){return this.viewModel.formTemplate}set formTemplate(e){this.viewModel.formTemplate=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get map(){return this.viewModel.map}set map(e){this.viewModel.map=e}get relatedRecordCallbacks(){return this.viewModel.relatedRecordCallbacks}set relatedRecordCallbacks(e){this.viewModel.relatedRecordCallbacks=e}get relationshipId(){return this.viewModel.relationshipId}set relationshipId(e){this.viewModel.relationshipId=e}get spatialReference(){return this.viewModel.spatialReference}set spatialReference(e){this.viewModel.spatialReference=e}get strict(){return this.viewModel.strict}set strict(e){this.viewModel.strict=e}get timeZone(){return this.viewModel.timeZone}set timeZone(e){this.viewModel.timeZone=e}get view(){return i($,"view",{replacement:"Use FeatureForm.map instead.",version:"4.27"}),this.viewModel.view}set view(e){i($,"view",{replacement:"Use FeatureForm.map instead.",version:"4.27"}),this.viewModel.view=e}getValues(){return this.viewModel.getValues()}submit(){return this.viewModel.submit()}render(){const{state:e}=this.viewModel;return j("div",{class:this.classes(p.base,x.widget,x.panel)},"ready"===e?this._renderForm():null)}_renderForm(){return j("form",{class:p.form,novalidate:!0,onkeydown:this._onFormKeyDown,onsubmit:this._onFormSubmit},this._renderHeader(),this._renderContent())}_renderHeader(){const e=this.viewModel;if(!e.formHeaderVisible)return;const t=null!=e.formTitle&&j(V,{key:"title",level:this.headingLevel},e.formTitle),i=null!=e.formDescription&&j("p",{class:p.description,key:"description"},e.formDescription);return j("div",{class:p.formHeader},t,i)}_renderContent(){const{viewModel:e}=this;return e.activeRelationshipInput?this._renderActiveRelationshipInput(e.activeRelationshipInput):e.inputs.filter(t).filter((e=>e.visible)).map(((e,t)=>c(e)?this._renderGroup(e,t):u(e)?this._renderLabeledField(e):m(e)?this._renderRelationshipInput(e):void 0))}_renderActiveRelationshipInput(e){return this._renderRelationshipInput(e)}_renderDescriptionOrEmpty(e,t){return null==e?null:j("div",{class:this.classes(p.description),id:t},e)}_renderGroup(e,t){const{disabled:i,formTemplate:o,headingLevel:n}=this,{description:a,inputs:s,label:r,open:l}=e,d=s.filter((e=>e.visible)),c=this.viewModel.findField(this._focusedFieldName),h=c?.group===e,v=`${this.id}_group_${t}`,_="sequential"===this.groupDisplay;return j("calcite-block",{class:this.classes(p.group,_?p.groupSequential:null,h?p.groupActive:null,i?p.inputDisabled:null),collapsible:!0,"data-group":e,description:a||void 0,disabled:i,heading:`${r}`,headingLevel:o?.title?N(n):n,id:v,key:v,open:l,onCalciteBlockToggle:({target:t})=>this._onGroupToggle(t,e)},d.map((e=>u(e)?this._renderLabeledField(e):m(e)?this._renderRelationshipInput(e):void 0)))}_getFocusableInput(e,t){const i=this.viewModel.allFieldInputs,o="forward"===e?i:i.slice().reverse();let n;if(!t||m(t))n=0;else if(c(t)){const e=t.inputs.find(u);n=e?o.indexOf(e):0}else{let i;if(h(t)&&!t.group.open){const o=t.group.inputs.filter(u);i="forward"===e?o[o.length-1]:o[0]}else i=t;n=o.indexOf(i)+1}for(let a=n;a<o.length;a++){const e=o[a];if(e.visible&&u(e))return e}return null}_renderLabeledField(e){const{dataType:t,feature:i,label:o,layer:n,required:a}=e,s={"aria-label":a?E(this.messages.requiredFieldLabel,{name:o}):o,class:p.label,key:`${n.id}-${i.uid}-${e.name}`},r=[j("div",{class:p.labelTextContent,key:"labelTextContainer"},o,a?j("span",{"aria-hidden":"true",title:this.messagesCommon.required},"*"):void 0),"unsupported"!==t?this._renderFieldInput(e):this._renderReadOnlyComponent(e),this._renderAuxiliaryText(e)];return"date"===t&&"coded-value"!==e.domain?.type?j("label",{...s},r):j("calcite-label",{...s},r)}_renderFieldInput(e){const{dataType:t,domain:i,inputType:o,name:n}=e,a=this.getCommonInputProps(e);if("coded-value"===i?.type){const t=this.viewModel.getFieldValueOptionsForField(n,this.messages.empty);return"switch"!==o||e.hasInvalidSwitchValue?"radio-buttons"===o?this._renderRadioButtonComponents(e,t.flat(),a):this._renderComboBoxComponent(e,t,a):this._renderSwitchComponent(e,a)}return"datetime-picker"===o||"date"===t?this._renderDateComponents(e,a):"number"===t?this._renderNumberComponent(e,a):this._renderStringComponent(e,a)}_renderStringComponent(e,t){return"text-area"===e.inputType?t.readOnly?j("calcite-input",{...t,loading:e.updating,type:"textarea",onCalciteInputInput:e=>this._saveValueFromComponent(e.target)}):j("calcite-text-area",{...t,resize:"vertical",onCalciteTextAreaInput:e=>this._saveValueFromComponent(e.target)}):j("calcite-input",{...t,loading:e.updating,type:"text",onCalciteInputInput:e=>this._saveValueFromComponent(e.target)})}_renderNumberComponent(e,t){return j("calcite-input-number",{...t,integer:l(e.field),loading:e.updating,type:"number",onCalciteInputNumberInput:e=>this._saveValueFromComponent(e.target)})}_renderDateComponents(e,t){const{field:i}=e;switch(i.type){case"date":return this._renderDateFieldComponents(e,t);case"date-only":return this._renderDateOnlyFieldComponent(e,t);case"time-only":return this._renderTimeOnlyFieldComponent(e,t);case"timestamp-offset":return this._renderTimestampOffsetFieldComponents(e,t);default:return this._renderReadOnlyComponent(e,F(i,t.value,{timeZone:this.timeZone,...w(i)}))}}_renderDateOnlyFieldComponent(e,t){const{range:i,valid:o,value:n}=e,{class:a,key:s,readOnly:r}=t,{rawMax:l,rawMin:d}=i;return j("calcite-input-date-picker",{afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!o,class:a,"data-date-part":"date","data-field-name":t[U],key:`${s}-date-input`,max:y(l)?l:void 0,min:y(d)?d:void 0,numberingSystem:R,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},onfocus:this._onComponentFocus,overlayPositioning:"fixed",readOnly:r,value:null!=n?`${n}`:void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)})}_renderTimeOnlyFieldComponent(e,t){const{valid:i,value:o}=e,{class:n,key:a,readOnly:s}=t;return j("calcite-input-time-picker",{afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!i,class:n,"data-date-part":"time","data-field-name":t[U],key:`${a}-time-input`,numberingSystem:R,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},onfocus:this._onComponentFocus,overlayPositioning:"fixed",readOnly:s,step:e.timeStep,value:null!=o?`${o}`:void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)})}_renderTimestampOffsetFieldComponents(e,t){const{name:i,range:o,valid:n,value:a}=e,{class:s,key:r,readOnly:l}=t,{rawMax:d,rawMin:c}=o,u={afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!n,numberingSystem:R,overlayPositioning:"fixed",readOnly:l,[U]:i,onfocus:this._onComponentFocus},m=O(d),h=O(c),v=O(a);return j("div",{class:p.dateInputContainer,key:`${r}-date-time-container`},j("calcite-input-date-picker",{...u,class:s,"data-date-part":"date",key:`${r}-date-input`,max:m?.date??void 0,min:h?.date??void 0,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:v.date??void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)}),j("calcite-input-time-picker",{...u,class:s,"data-date-part":"time",key:`${r}-time-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},step:e.timeStep,value:v.time??void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)}),e.includeTimeOffset?j("calcite-input-time-zone",{...u,class:s,"data-date-part":"timeZone",disabled:l,key:`${r}-timezone-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:v.timeZoneOffset??"0",onCalciteInputTimeZoneChange:e=>this._saveValueFromDateComponent(e.target)}):null)}_renderDateFieldComponents(e,t){const{includeTime:i,name:o,valid:n,value:a}=e,{class:s,key:r,max:l,min:d,readOnly:c}=t,{timeZone:u}=this,m={afterCreate:this._afterDateComponentCreate,afterUpdate:this._afterDateComponentCreateOrUpdate,"aria-invalid":!n,numberingSystem:R,overlayPositioning:"fixed",readOnly:c,[U]:o,onfocus:this._onComponentFocus},h=k(a,u),v=k(l,u),_=k(d,u);return j("div",{class:p.dateInputContainer,key:`${r}-date-time-container`},j("calcite-input-date-picker",{...m,class:s,"data-date-part":"date",key:`${r}-date-input`,max:v?.date??void 0,min:_?.date??void 0,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},value:h.date??void 0,onCalciteInputDatePickerChange:e=>this._saveValueFromDateComponent(e.target)}),i?j("calcite-input-time-picker",{...m,class:s,"data-date-part":"time",key:`${r}-time-input`,onblur:e=>{this._focusedFieldName=null,this._saveValueFromDateComponent(e.target)},step:1,value:h.time??void 0,onCalciteInputTimePickerChange:e=>this._saveValueFromDateComponent(e.target)}):null)}_renderReadOnlyComponent(e,t){const i=this.getCommonInputProps(e);return j("calcite-input",{...i,class:this.classes(p.fieldInput,p.inputDisabled),readOnly:!0,type:"text",value:null!=t?`${t}`:i.value})}_renderComboBoxComponent(e,t,i){const{value:o,name:n}=e,{messages:a,messagesTemplates:s,viewModel:r,_inputsWithChanges:l}=this,d=t.map((e=>e.map((({name:e,value:t})=>j("calcite-combobox-item",{key:`#${t}`,selected:o===t,textLabel:e,value:`${t}`}))))),[p,c]=d;this.viewModel.fieldsWithInvalidCodedValue.has(e)&&c.unshift(j("calcite-combobox-item",{key:"incompatible-option",readOnly:!0,textLabel:`${e.value}`,value:`${e.value}`}));const u=c.length>0?[j("calcite-combobox-item-group",{key:"recommended",label:a.recommended},p),j("calcite-combobox-item-group",{key:"other",label:s.other},c)]:p,m="INSERT"===r.arcadeEditType,h=l.has(n),v=null==o&&(!m||h);if(e.showNoValueOptionEnabled){const t="",i=e.showNoValueLabel||a.empty;u.unshift(j("calcite-combobox-item",{key:"empty-option",selected:v,textLabel:a.empty,value:t},i))}const _=m&&e.showNoValueOptionEnabled&&!h?()=>{}:i.onblur;return j("calcite-combobox",{...i,allowCustomValues:!1,clearDisabled:!0,disabled:i.readOnly,onblur:_,overlayPositioning:"fixed",selectionMode:"single",onCalciteComboboxChange:({target:e})=>{v&&0===e.selectedItems.length?this._ignoreDeselectionOfNoValueOption(e):this._saveValueFromComponent(e)}},u)}_renderRadioButtonComponents(e,t,i){const{name:o,value:n}=e,a=t.map((({name:e,value:t})=>this._renderRadioButtonComponent({key:e,label:e,name:o,value:t,selected:t===n,props:i})));if(e.showNoValueOptionEnabled){const t="",s=e.showNoValueLabel||this.messages.empty,r=n===t||null===n;a.unshift(this._renderRadioButtonComponent({key:"empty-option",label:s,name:o,value:t,selected:r,props:i}))}return j("calcite-radio-button-group",{afterCreate:this._afterRadioGroupCreateOrUpdate,afterUpdate:this._afterRadioGroupCreateOrUpdate,class:p.inputRadioGroup,"data-field-name":i[U],key:`${i.key}-radio-group`,layout:"vertical",name:i.key,required:i.required},a)}_renderSwitchComponent(e,t){const{value:i}=e,o=!!v(e.element,"switch")&&i===e.element.input.onValue;return j("calcite-switch",{...t,checked:o,class:p.inputSwitch,disabled:t.readOnly,onblur:()=>{this._focusedFieldName=null},onCalciteSwitchChange:e=>this._saveValueFromComponent(e.target)})}_renderRadioButtonComponent({key:e,name:t,value:i,selected:o,label:n,props:a}){return j("calcite-label",{class:p.inputRadioLabel,key:e,layout:"inline"},j("calcite-radio-button",{...a,afterCreate:void 0,afterUpdate:void 0,checked:o,class:p.inputRadio,disabled:a.readOnly,name:t,onblur:()=>{this._focusedFieldName=null},value:i,onCalciteRadioButtonChange:({target:e})=>{e.checked&&this._saveValueFromComponent(e)}}),n)}_renderAuxiliaryText(e){const t=e.name,i=this._inputsWithChanges.has(t)&&!e.valid?_(e,this.messages,this.timeZone):null!=this.viewModel.contingencyConstraintViolations.get(t)?this.messages.validationErrors.valuesIncompatible:null!=e.valueExpressionExecutor&&e.valueExpressionExecutor.stale?this.messages.valueExpressionError:null;return null!=i?j("calcite-input-message",{icon:!0,status:"invalid"},i):this._renderDescriptionOrEmpty(e.description)}_renderShowAllRelatedRecordsListItem(e){const{featureCount:t,relationshipId:i,showAllActionVisible:o}=e,{relatedRecordCallbacks:n}=this;if(!o||!n?.showAllRelatedRecords)return;const a=this.messages;return j("calcite-list-item",{description:E(a.totalCount,{count:t}),label:a.showAll,value:!0,onCalciteListItemSelect:()=>this._onShowAllRelatedRecordsClick(i)},j("calcite-icon",{icon:"list",scale:"s",slot:"content-end"}))}_renderAddRelatedRecordButton(e){const{canAddRelatedFeature:t,relationshipId:i,relatedLayer:o}=e,{messages:n,relatedRecordCallbacks:a}=this;if(t&&a?.addRelatedRecord&&o)return j("calcite-button",{alignment:"center",appearance:"outline-fill",class:p.centeredButton,disabled:e.updating||!e.originHasValidKey,iconStart:"plus",key:`${i}-add-button`,onclick:()=>this._onAddRelatedRecordsClick(i,o),round:!0,scale:"s",width:"half"},e.relatedLayerIsTable?n.addRecord:n.addFeature)}_renderRelatedRecordListItem(e,t){const{feature:i,description:o,title:n}=e,{feature:a,relatedRecordCallbacks:s}=this,{highlightHelper:r}=this.viewModel,l=()=>{r?.removeAll(),s?.editRelatedRecord&&a&&s.editRelatedRecord({parentFeature:a,relationshipId:t,relatedFeature:i})},d=r?()=>r.add(i):void 0,p=r?()=>r.remove(i):void 0;return j("calcite-list-item",{bind:this,description:o,key:`${t}-${i.uid}`,label:n,onclick:l,onmouseenter:d,onmouseleave:p,value:n},j("calcite-icon",{icon:g(i),scale:"m",slot:"content-start"}),j("calcite-icon",{icon:"chevron-right",scale:"s",slot:"content-end"}))}_renderRelationshipInput(e){if(!this._relatedRecordsEnabled||!e.editable)return;const{featureCount:t,relationshipId:i,showAllEnabled:o}=e,n=o?null:this._renderDescriptionOrEmpty(e.description),a=t>0?this._renderRelatedRecordsList(e):e.loaded?e.originHasValidKey?this._renderNoRelatedRecordsNotice():this._renderNoValidOriginKeyNotice(e):void 0;return j("calcite-label",{class:this.classes(p.label,p.relatedRecordsLabel),key:`relationship-${i}-container`},j("div",null,this._renderRelatedRecordsHeaderContainer(e),n,a),this._renderAddRelatedRecordButton(e))}_renderRelatedRecordsHeaderContainer(e){const t=e.updating||!e.loaded;return j("div",{class:p.relatedRecordsHeader,key:`relationship-${e.relationshipId}-header`},j("span",null,e.label),t?j("calcite-loader",{inline:!0,key:"loader",label:this.messagesCommon?.loading,scale:"s",type:"indeterminate"}):void 0)}_renderRelatedRecordsList(e){const{relationshipId:t}=e;return j("calcite-list",{class:p.relatedRecordsList},e.relatedFeatureInfos.map((e=>this._renderRelatedRecordListItem(e,t))),this._renderShowAllRelatedRecordsListItem(e),this._renderObserverNode())}_renderNoValidOriginKeyNotice(e){const{messages:t}=this,i=e.relatedLayerIsTable?t.noOriginKeyRecord:t.noOriginKeyFeature,o=e.relationship?.keyField,n=this.viewModel.findField(o),a=e.layer?.fieldsIndex.get(o),s=n?.label||a?.alias||o,r=E(i,{relatedLayerName:e.relatedLayer?.title,originKeyField:s});return j("calcite-notice",{icon:"information",kind:"brand",open:!0,scale:"s",width:"full"},j("div",{slot:"message"},r))}_renderNoRelatedRecordsNotice(){return j("calcite-notice",{icon:"information",kind:"brand",open:!0,scale:"s",width:"full"},j("div",{slot:"message"},this.messagesFeature.noRelatedFeatures))}_renderObserverNode(){if(this.viewModel.activeRelationshipInput?.showAllEnabled)return j("div",{afterCreate:this._afterListObserverCreated,afterRemoved:this._afterListObserverRemoved,bind:this,class:p.listObserver,key:"feature-observer"})}getCommonInputProps(e){const{disabled:t}=this,{editable:i,hint:o,label:n,maxLength:a,minLength:s,name:r,range:{max:l,min:d},required:c,valid:u,value:m}=e,h=this._inputsWithChanges.has(r),v=!i||t;return{afterCreate:this._afterComponentCreate,afterUpdate:this._afterComponentCreateOrUpdate,"aria-invalid":u?"false":"true",class:this.classes(p.fieldInput,v?p.inputDisabled:null,h&&!u?p.inputInvalid:null),key:r,label:n,max:null!=l?l:void 0,min:null!=d?d:void 0,maxLength:a>-1?a:void 0,minLength:s>-1?s:void 0,placeholder:o??void 0,readOnly:v,required:c,value:null==m?"":`${m}`,onblur:this._onComponentBlur,onfocus:this._onComponentFocus,onkeydown:this._onComponentKeyDown,[U]:r}}_getFieldInputFromHTMLElement(e){return this.viewModel.findField(e.getAttribute(U))}_afterDateComponentCreate(e){const t=this._getFieldInputFromHTMLElement(e),i=e.dataset.datePart,o=this._dateComponentMap.get(t.name);if("valueAsDate"in e&&null!=e.value){const t=e.value,i=new ResizeObserver((()=>{e.value=void 0,e.value=t,i.unobserve(e)}));i.observe(e)}if(null!=o)switch(i){case"date":o.date=e;break;case"time":o.time=e;break;case"timeZone":o.timeZone=e}else this._dateComponentMap.set(t.name,{[i]:e});this._afterDateComponentCreateOrUpdate(e)}_afterDateComponentCreateOrUpdate(e){this._afterComponentCreateOrUpdate(e)}_afterComponentCreate(e){const t=this._getFieldInputFromHTMLElement(e);b(t)&&null!=e.value&&"setNumberValue"in e&&e.setNumberValue({committing:!1,value:e.value,origin:"direct"}),this._afterComponentCreateOrUpdate(e)}_afterRadioGroupCreateOrUpdate(e){const t=e.selectedItem,i=e.querySelector("calcite-radio-button"),o=t||i;o&&this._afterComponentCreateOrUpdate(o)}_afterComponentCreateOrUpdate(e){const{viewModel:t}=this,i=this._getFieldInputFromHTMLElement(e),o=t.findField(this._focusedFieldName);this._attemptFocusOnNextRender&&o===i&&(this._attemptFocusOnNextRender=!1,h(i)&&(i.group.open=!0),e.setFocus())}_onComponentFocus(e){const t=e.target,i=this._getFieldInputFromHTMLElement(t);this._focusedFieldName=i.name}_onComponentBlur(e){const t=e.target;this._focusedFieldName=null,this._saveValueFromComponent(t)}_saveValueFromDateComponent(e){const t=this._getFieldInputFromHTMLElement(e),i=t.field.type,{name:o,range:n}=t,a=this._dateComponentMap.get(o);if(!a)return;let s=this.viewModel.getValue(o),r=null;"date-only"===i?r=e.value:"time-only"===i?(s=I(s),r=I(e.value)):r="timestamp-offset"===i?null!=e.value?M({dateComponent:a.date,timeComponent:a.time,timeZoneComponent:a.timeZone,oldValue:s}):null:null!=e.value?D({oldValue:s,dateComponent:a.date,timeComponent:a.time,timeZone:this.timeZone,max:n.max,min:n.min}):null,null!==r&&e.value?s!==r&&this._updateFieldValue(o,r):this._updateFieldValue(o,null)}_saveValueFromComponent(e){const t=this._getFieldInputFromHTMLElement(e);this._updateFieldValue(t.name,this._parseValue(e))}_onComponentKeyDown({key:e,target:t}){const i=this._getFieldInputFromHTMLElement(t);"Enter"===e&&h(i)&&!i.group.open&&(i.group.open=!0)}_updateFieldValue(e,t){if(this.viewModel.setValue(e,t),this._inputsWithChanges.add(e),this.viewModel.fieldsWithContingentValues.has(e)){const e=Object.fromEntries(Object.entries(this.getValues()).filter((([e,t])=>null!=t)));this.viewModel.validateContingencyConstraints(e)}}_parseValue(e){const t=this._getFieldInputFromHTMLElement(e),i=e.value;return v(t.element,"switch")?e.checked?t.element.input.onValue:t.element.input.offValue:null==i||""===i?null:"number"===t.dataType?"-0"===i||"-0."===i||"-0,"===i?i:parseFloat(i):"date"===t.field.type?parseFloat(i):i}_ignoreDeselectionOfNoValueOption(e){const{firstChild:t,selectedItems:i}=e;0===i.length&&t&&"selected"in t?t.selected=!0:$.warnOnce("Failed to override user attempt to deselect 'No value' option.")}_onGroupToggle(e,t){e.open?(t.open=!0,this._focusedFieldName=this._getFocusableInput("forward",t)?.name||null,this._attemptFocusOnNextRender=!0,"sequential"===this.groupDisplay&&this.viewModel.allGroupInputs.forEach((e=>{e!==t&&(e.open=!1)}))):t.open=!1,this.scheduleRender()}_onFormSubmit(e){e.preventDefault()}_onFormKeyDown(e){"Enter"===e.key&&this.viewModel.submit()}_afterListObserverCreated(e){this.viewModel.activeRelationshipInput&&(this._listObserverNode=e)}_afterListObserverRemoved(){this._listObserverNode=null}_onObserverChange(){this._listObserverNode&&this._listObserver.unobserve(this._listObserverNode);const e=this.viewModel.activeRelationshipInput;e&&this._listObserverNode&&e.showAllEnabled&&this._listObserver.observe(this._listObserverNode)}_incrementRelatedRecordPage(){const e=this.viewModel.activeRelationshipInput;e?.incrementPage()}_syncGroupInputStates(){if("sequential"!==this.groupDisplay)return;const e=this.viewModel.allGroupInputs;if(!e.length)return;const t=e.filter((e=>e.open));0===t.length?e[0].open=!0:t.length>1&&t.slice(1).forEach((e=>e.open=!1))}};e([s()],A.prototype,"_listObserverNode",void 0),e([s()],A.prototype,"_relatedRecordsEnabled",null),e([s()],A.prototype,"disabled",null),e([s()],A.prototype,"feature",null),e([s()],A.prototype,"formTemplate",null),e([s()],A.prototype,"groupDisplay",void 0),e([s()],A.prototype,"headingLevel",void 0),e([s()],A.prototype,"label",null),e([s()],A.prototype,"layer",null),e([s()],A.prototype,"map",null),e([s(),T("esri/widgets/FeatureForm/t9n/FeatureForm")],A.prototype,"messages",void 0),e([s(),T("esri/t9n/common")],A.prototype,"messagesCommon",void 0),e([s(),T("esri/widgets/Feature/t9n/Feature")],A.prototype,"messagesFeature",void 0),e([s(),T("esri/widgets/FeatureTemplates/t9n/FeatureTemplates")],A.prototype,"messagesTemplates",void 0),e([s()],A.prototype,"relatedRecordCallbacks",null),e([s()],A.prototype,"relationshipId",null),e([s()],A.prototype,"spatialReference",null),e([s()],A.prototype,"strict",null),e([s()],A.prototype,"timeZone",null),e([s()],A.prototype,"view",null),e([s(),L(["value-change","submit"])],A.prototype,"viewModel",void 0),A=e([r(S)],A);const H=A;export{H as default};
|
package/widgets/Features.js
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
|
3
3
|
See https://js.arcgis.com/4.28/esri/copyright.txt for details.
|
|
4
4
|
*/
|
|
5
|
-
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import t from"../core/Collection.js";import{eventKey as i}from"../core/events.js";import s from"../core/Logger.js";import{watch as o,when as r}from"../core/reactiveUtils.js";import{throttle as n}from"../core/throttle.js";import{property as a}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import d from"./Feature.js";import c from"./Spinner.js";import u from"./Widget.js";import{css as h}from"./Feature/resources.js";import{FeatureContentMixin as p}from"./Feature/support/FeatureContentMixin.js";import{css as m}from"./Features/css.js";import v from"./Features/FeaturesRelatedRecords.js";import g from"./Features/FeaturesViewModel.js";import _ from"./Features/FeaturesVisibleElements.js";import{ActionsCollection as w}from"./Popup/actions.js";import{getPointFromGeometry as f}from"./Popup/actionUtils.js";import{loadCalciteComponents as M}from"./support/componentsUtils.js";import{globalCss as F}from"./support/globalCss.js";import{Heading as b}from"./support/Heading.js";import"./support/widgetUtils.js";import{messageBundle as y}from"./support/decorators/messageBundle.js";import{vmEvent as I}from"./support/decorators/vmEvent.js";import{tsx as C}from"./support/jsxFactory.js";import{substitute as A}from"../intl/substitute.js";import{formatNumber as x}from"../intl/number.js";const j="selected-index",R=0,O="features-spinner";let k=class extends(p(u)){constructor(e,i){super(e,i),this._featureMenuIntersectionObserverCallback=([e])=>{e?.isIntersecting&&null!=this.viewModel.featurePage&&this.viewModel.featurePage++},this._featureMenuIntersectionObserver=new IntersectionObserver(this._featureMenuIntersectionObserverCallback,{root:window.document}),this._featureMenuIntersectionObserverNode=null,this._focusOn=null,this._spinner=null,this._feature=null,this._relatedRecordsFlowItems=new t,this._relatedRecordsWidget=new v({flowItems:this._relatedRecordsFlowItems}),this._rootFlowItemNode=null,this._featureMenuViewportNode=null,this.collapsed=!1,this.icon=null,this.featureNavigationTop=!1,this.headerActions=new w,this.headingLevel=2,this.messages=null,this.messagesCommon=null,this.responsiveActionsEnabled=!1,this.viewModel=new g,this.visibleElements=new _,this._renderAction=(e,t)=>{const i=this._getActionTitle(e),{type:s,active:o,uid:r,disabled:n,indicator:a}=e;return e.visible?C("calcite-action",{active:"toggle"===s&&e.value,appearance:"solid",bind:this,"data-action-uid":r,disabled:n,icon:this._getActionIcon(e),indicator:a,key:`action-${t}`,loading:o,onclick:this._triggerAction,scale:"s",text:i,title:this._hideActionText?i:void 0},this._getFallbackIcon(e)):null},this._openFeatureMenu=()=>{this.featureMenuOpen=!0},this._previousFeature=()=>{this.viewModel.selectedFeatureIndex--},this._nextFeature=()=>{this.viewModel.selectedFeatureIndex++},this._handleFeatureMenuBack=()=>{this.featureMenuOpen&&(this._focusOn="root-flow-item",this.featureMenuOpen=!1,this.viewModel.browseClusterEnabled=!1)},this._displaySpinnerThrottled=n((()=>this._displaySpinner()),R),this._addSelectedFeatureIndexHandle(),this.addHandles([this._displaySpinnerThrottled,o((()=>this.viewModel?.active),(()=>this._toggleScreenLocationEnabled())),o((()=>this.viewModel?.active),(e=>this._relatedRecordsWidget.closed=!e)),o((()=>this.visibleElements?.closeButton),(e=>this._relatedRecordsWidget.closable=e)),o((()=>this.visibleElements?.spinner),(e=>this._spinnerEnabledChange(e))),o((()=>this.viewModel?.view),((e,t)=>this._viewChange(e,t))),o((()=>this.viewModel?.view?.ready),((e,t)=>this._viewReadyChange(e??!1,t??!1))),o((()=>[this.viewModel?.waitingForResult,this.viewModel?.location]),(()=>{this._hideSpinner(),this._displaySpinnerThrottled()})),o((()=>this.selectedFeatureWidget),(()=>this._destroyRelatedRecordsFlowItemWidgets())),o((()=>{const e=this.selectedFeatureWidget?.viewModel;return[e?.title,e?.state]}),(()=>this._setTitleFromFeatureWidget())),o((()=>{const e=this.selectedFeatureWidget?.viewModel;return[e?.content,e?.state]}),(()=>this._setContentFromFeatureWidget())),o((()=>this.viewModel?.featureViewModels),(()=>this._featureMenuViewportScrollTop())),this._relatedRecordsWidget.on("close",(()=>this.close())),this._relatedRecordsWidget.on("exit",(()=>this._destroyRelatedRecordsFlowItemWidgets())),this._relatedRecordsWidget.on("open-related-feature",(({feature:e})=>this._openRelatedFeature(e)))])}loadDependencies(){return M({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),"action-bar":()=>import("@esri/calcite-components/dist/components/calcite-action-bar.js"),"action-group":()=>import("@esri/calcite-components/dist/components/calcite-action-group.js"),button:()=>import("@esri/calcite-components/dist/components/calcite-button.js"),flow:()=>import("@esri/calcite-components/dist/components/calcite-flow.js"),"flow-item":()=>import("@esri/calcite-components/dist/components/calcite-flow-item.js"),list:()=>import("@esri/calcite-components/dist/components/calcite-list.js"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item.js"),"list-item-group":()=>import("@esri/calcite-components/dist/components/calcite-list-item-group.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js")})}destroy(){this._destroyRelatedRecordsFlowItemWidgets(),this._destroySelectedFeatureWidget(),this._destroySpinner(),this._unobserveFeatureMenuObserver(),this._featureMenuIntersectionObserver?.disconnect(),this._relatedRecordsWidget?.destroy()}get _hideActionText(){if(!this.responsiveActionsEnabled)return!1;const e=this.view?.widthBreakpoint;return"xsmall"===e||"small"===e||"medium"===e}get _featureNavigationVisible(){return this.viewModel.active&&this.viewModel.featureCount>1&&this.visibleElements.featureNavigation}get _isCollapsed(){return this._collapseEnabled&&this.collapsed}get _collapseEnabled(){return this.visibleElements.collapseButton&&!!this.title&&!!this.content}get content(){return this.viewModel.content}set content(e){this.viewModel.content=e}get featureMenuOpen(){return this.viewModel.featureMenuOpen}set featureMenuOpen(e){this.viewModel.featureMenuOpen=e}get features(){return this.viewModel.features}set features(e){this.viewModel.features=e}get location(){return this.viewModel.location}set location(e){this.viewModel.location=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get promises(){return this.viewModel.promises}set promises(e){this.viewModel.promises=e}get selectedFeature(){return this.viewModel.selectedFeature}get selectedFeatureIndex(){return this.viewModel.selectedFeatureIndex}set selectedFeatureIndex(e){this.viewModel.selectedFeatureIndex=e}get selectedFeatureWidget(){const{_feature:e,headingLevel:t,_relatedRecordsFlowItems:i}=this,{selectedFeatureViewModel:s}=this.viewModel,o={title:!1};return s?(e?(e.viewModel=s,e.visibleElements=o):this._feature=new d({flowItems:i,headingLevel:t+1,viewModel:s,visibleElements:o}),this._feature):null}get title(){return this.viewModel.title}set title(e){this.viewModel.title=e}get updateLocationEnabled(){return this.viewModel.updateLocationEnabled}set updateLocationEnabled(e){this.viewModel.updateLocationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}get visible(){return this.viewModel.visible}set visible(e){this.viewModel.visible=e}blur(){const{active:e}=this.viewModel;e?this._rootFlowItemNode?.blur():s.getLogger(this).warn("Features can only be blurred when currently active.")}clear(){return this.viewModel.clear()}close(){this.viewModel.visible=!1}fetchFeatures(e,t){return this.viewModel.fetchFeatures(e,t)}focus(){const{active:e}=this.viewModel;e?(this._setFocusOn(),this.scheduleRender()):s.getLogger(this).warn("Features can only be focused when currently active.")}next(){return this.viewModel.next()}open(e){this.removeHandles(j);const t={collapsed:e?.collapsed??!1};this.set(t),this.viewModel.open(e),this.addHandles(r((()=>!this.viewModel.waitingForResult),(()=>this._addSelectedFeatureIndexHandle()),{once:!0}))}previous(){return this.viewModel.previous()}triggerAction(e){return this.viewModel.triggerAction(e)}render(){return C("div",{bind:this,class:this.classes(m.base,F.widget,F.panel),onkeydown:this._onMainKeydown},this._renderHeader(),this._renderContentContainer())}_renderFeatureNavigation(){return[this._renderPagination(),this._renderFeatureMenuButton()]}_renderHeader(){return!this.featureMenuOpen&&this.featureNavigationTop&&this._featureNavigationVisible?C("div",{class:m.header,key:"header-actions"},this._renderFeatureNavigation()):null}_renderFooter(){return this.featureMenuOpen||this.featureNavigationTop||!this._featureNavigationVisible?null:C("div",{class:m.footer,key:"footer-actions",slot:"footer"},this._renderFeatureNavigation())}_renderFeatureMenuButton(){const{messages:e,viewModel:t}=this,{featureCount:i,selectedFeatureIndex:s,pendingPromisesCount:o}=t;return C("calcite-action",{appearance:"solid",bind:this,icon:"list",key:"feature-menu-button",label:e.selectFeature,loading:o>0,onclick:this._openFeatureMenu,scale:"s",text:A(e.pageText,{index:x(s+1),total:x(i)}),textEnabled:!0,title:e.selectFeature})}_renderPagination(){const{previous:e,next:t}=this.messagesCommon.pagination;return C("calcite-action-bar",{class:m.paginationActionBar,expandDisabled:!0,key:"pagination-action-bar",layout:"horizontal",overflowActionsDisabled:!0,scale:"s"},C("calcite-action-group",{scale:"s"},C("calcite-action",{appearance:"solid",class:m.paginationPrevious,icon:"chevron-left",iconFlipRtl:!0,label:e,onclick:this._previousFeature,scale:"s",text:e,title:e}),C("calcite-action",{appearance:"solid",icon:"chevron-right",iconFlipRtl:!0,label:t,onclick:this._nextFeature,scale:"s",text:t,title:t})))}_renderFeatureMenuItem(e){const{selectedFeatureViewModel:t,featureViewModels:i}=this.viewModel,s=e===t,o=i.indexOf(e);return C("calcite-list-item",{bind:this,"data-feature-index":o,key:`feature-menu-item-${e.uid}`,onblur:this._removeActiveFeature,onfocus:this._setActiveFeature,onmouseleave:this._removeActiveFeature,onmouseover:this._setActiveFeature,selected:s,onCalciteListItemSelect:this._selectFeature},C("span",{innerHTML:e.title||this.messagesCommon.untitled,slot:"content"}))}_groupResultsByLayer(){const{featureViewModels:e}=this.viewModel,t=new Map;return e.forEach((e=>{const i=e?.graphic;if(!i)return;const s=i.sourceLayer??i.layer,o=t.get(s)??[];t.set(s,[...o,e])})),t}_renderFeatureMenu(){const{featureViewModels:e}=this.viewModel,t=this._groupResultsByLayer();return e.length?C("calcite-list",{selectionAppearance:"icon",selectionMode:"single"},Array.from(t.keys()).map((e=>C("calcite-list-item-group",{heading:e?.title??this.messagesCommon.untitled,key:e?.uid||"untitled"},t.get(e)?.map((e=>this._renderFeatureMenuItem(e))))))):null}_renderHeaderAction(e,t){return e.visible?C("calcite-action",{active:"toggle"===e.type&&e.value,appearance:"solid",bind:this,"data-action-uid":e.uid,disabled:e.disabled,icon:e.icon||"",indicator:e.indicator,key:`header-action-${t}`,loading:e.active,onclick:this._triggerHeaderAction,scale:"m",slot:"header-actions-end",text:e.title||"",title:e.title||""}):null}_renderHeaderActions(){return this.headerActions.map(((e,t)=>this._renderHeaderAction(e,t))).toArray()}_renderContentFeature(){const{headingLevel:e,visibleElements:t,_isCollapsed:i,_collapseEnabled:s,featureNavigationTop:o}=this,{title:r,active:n}=this.viewModel,a=t.heading&&r?r:"";return C("calcite-flow-item",{afterCreate:this._focusRootFlowItemNode,afterUpdate:this._focusRootFlowItemNode,bind:this,class:this.classes({[m.contentFeature]:!0,[m.flowItemCollapsed]:i}),closable:t.closeButton,closed:!n,collapsed:i,collapseDirection:o?"down":"up",collapsible:s,headingLevel:e,key:"root-flow-item",onCalciteFlowItemClose:this.close,onCalciteFlowItemToggle:this._handleCollapseToggle},a?C(b,{class:this.classes(m.featuresHeading,F.heading),innerHTML:a,key:"header-content",level:this.headingLevel,slot:"header-content"}):null,this._renderHeaderActions(),this._renderActionBar(),i?null:C("div",{class:this.classes(m.container,m.contentContainer)},this._renderContent()),this._renderFooter())}_renderFeatureMenuContainer(){const{viewModel:e,featureMenuOpen:t,messages:i,messagesCommon:s}=this,{active:o,featureViewModels:r,pendingPromisesCount:n}=e;return t?C("calcite-flow-item",{afterCreate:this._focusFeatureMenuFlowItemNode,afterUpdate:this._focusFeatureMenuFlowItemNode,bind:this,closable:!1,closed:!o,description:A(i.total,{total:r.length}),heading:i.selectFeature,key:"feature-menu",loading:e.waitingForContents,onCalciteFlowItemBack:this._handleFeatureMenuBack},n>0?C("calcite-loader",{class:m.loader,inline:!0,key:"feature-menu-loader",label:s.loading,scale:"m",slot:"header-actions-end"}):null,C("div",{class:m.container},this._renderFeatureMenu()),C("div",{afterCreate:this._featureMenuIntersectionObserverCreated,bind:this,class:m.featureMenuObserver}),C("calcite-button",{appearance:"transparent",onclick:this._handleFeatureMenuBack,slot:"footer-actions",width:"full"},s.back)):null}_renderContentContainer(){return C("calcite-flow",{key:"content-container"},this._renderContentFeature(),this._renderFeatureMenuContainer(),this._relatedRecordsWidget.render())}_getIconStyles(e){return{"background-image":e?`url(${e})`:""}}_getActionImage(e){const{selectedFeature:t}=this,i=t?.attributes,{image:s}=e;return s&&i?A(s,i):s??""}_getFallbackIcon(e){const{className:t,icon:i}=e;if(i)return null;const s=this._getActionImage(e),o={[m.icon]:!!t,[m.actionImage]:!!s};return t&&(o[t]=!0),s||t?C("span",{"aria-hidden":"true",class:this.classes(m.icon,o),key:"icon",styles:s?this._getIconStyles(s):{}}):null}_renderActionBar(){return!this._isCollapsed&&this.visibleElements.actionBar&&this.viewModel.allActions?.length?C("calcite-action-bar",{expandDisabled:!0,expanded:!this._hideActionText,key:"header-action-bar",scale:"s",slot:"action-bar"},C("calcite-action-group",{overlayPositioning:"fixed",scale:"s"},this._renderActions())):null}_renderActions(){return this.viewModel.allActions.toArray().map(this._renderAction)}_renderContent(){const e=this.viewModel?.content;return e?"string"==typeof e?C("div",{class:h.contentNode,innerHTML:e,key:e}):this.renderNodeContent(e):null}_setFocusOn(){this._focusOn=this.featureMenuOpen?"menu-flow-item":"root-flow-item"}_handleCollapseToggle(){this.collapsed=!this.collapsed}async _openRelatedFeature(e){await e.viewModel.updateGeometry();const t=e.graphic,i=t?.geometry;if(null==i||null==t)return;this._destroyRelatedRecordsFlowItemWidgets(),await this.viewModel.zoomTo({target:i});const s=f(i);this.open({features:[t],location:null!=s?s:void 0})}_focusRootFlowItemNode(e){this._rootFlowItemNode=e,"root-flow-item"===this._focusOn&&(this._focusOn=null,requestAnimationFrame((()=>e?.setFocus())))}_focusFeatureMenuFlowItemNode(e){this._featureMenuViewportNode=e,"menu-flow-item"===this._focusOn&&(this._focusOn=null,requestAnimationFrame((()=>e?.setFocus())))}_setActiveFeature(e){const{viewModel:t}=this,i=e.currentTarget["data-feature-index"];t.activeFeature=t.features?.[i]||null}_removeActiveFeature(){this.viewModel.activeFeature=null}_selectFeature(e){const t=e.currentTarget["data-feature-index"];isNaN(t)||(this.viewModel.selectedFeatureIndex=t),this._handleFeatureMenuBack()}_unobserveFeatureMenuObserver(){this._featureMenuIntersectionObserverNode&&this._featureMenuIntersectionObserver.unobserve(this._featureMenuIntersectionObserverNode)}_featureMenuIntersectionObserverCreated(e){this._unobserveFeatureMenuObserver(),this._featureMenuIntersectionObserver.observe(e),this._featureMenuIntersectionObserverNode=e}_getActionIcon(e){return e.icon?e.icon:e.image||e.className?void 0:"question"}_getActionTitle(e){const{messages:t,selectedFeature:i,messagesCommon:s}=this,{id:o}=e,r=i?.attributes,n=e.title??"",a="zoom-to-feature"===o?A(n,{messages:t}):"remove-selected-feature"===o?A(n,{messages:s}):"zoom-to-clustered-features"===o||"browse-clustered-features"===o?A(n,{messages:t}):e.title;return a&&r?A(a,r):a??""}_onMainKeydown(e){const t=i(e);"ArrowLeft"===t&&(e.stopPropagation(),this._handleFeatureMenuBack(),this.previous()),"ArrowRight"===t&&(e.stopPropagation(),this._handleFeatureMenuBack(),this.next())}_featureMenuViewportScrollTop(){this._featureMenuViewportNode&&this._featureMenuViewportNode.scrollContentTo({top:0})}_setContentFromFeatureWidget(){const{selectedFeatureWidget:e}=this;e&&(this.viewModel.content=e)}_setTitleFromFeatureWidget(){const{selectedFeatureWidget:e,messagesCommon:t}=this,i=e?.viewModel;e&&(this.viewModel.title="error"===i?.state?t?.errorMessage:i?.title||"")}_addSelectedFeatureIndexHandle(){const e=o((()=>this.viewModel?.selectedFeatureIndex),((e,t)=>this._selectedFeatureIndexUpdated(e,t)));this.addHandles(e,j)}_selectedFeatureIndexUpdated(e,t){const{featureCount:i}=this.viewModel;i&&e!==t&&-1!==e&&(this._destroyRelatedRecordsFlowItemWidgets(),this._rootFlowItemNode&&this._rootFlowItemNode.scrollContentTo({top:0}))}_triggerHeaderAction(e){const t=e.currentTarget;if(t.disabled)return;const i=t.dataset.actionUid,s=this.headerActions.find((({uid:e})=>e===i));s&&!s.disabled&&("toggle"===s?.type&&(s.value=!s.value),this.emit("trigger-header-action",{action:s}))}_triggerAction(e){const t=e.currentTarget;if(t.disabled)return;const i=t.dataset.actionUid,{allActions:s}=this.viewModel,o=s.findIndex((e=>e.uid===i)),r=s.at(o);r&&"toggle"===r.type&&(r.value=!r.value),this.viewModel.triggerAction(o)}_createSpinner(e){e&&(this._spinner=new c({view:e}),e.ui.add(this._spinner,{key:O,position:"manual",internal:!0}))}_wireUpView(e){this._destroySpinner(),e&&this.visibleElements?.spinner&&this._createSpinner(e)}_hideSpinner(){const{_spinner:e}=this;e&&(e.location=null,e.hide())}_viewReadyChange(e,t){e?this._wireUpView(this.viewModel?.view):t&&this.viewModel.clear()}_viewChange(e,t){e&&t&&this.viewModel.clear()}_destroySelectedFeatureWidget(){const{_feature:e}=this;e&&(e.viewModel=null,!e.destroyed&&e.destroy()),this._feature=null}_destroyRelatedRecordsFlowItemWidgets(){this._relatedRecordsFlowItems.removeAll().forEach((e=>{"showAllEnabled"in e.viewModel&&(e.viewModel.showAllEnabled=!1),e.viewModel=null,e.destroy()}))}_toggleScreenLocationEnabled(){const{viewModel:e}=this;e&&(e.screenLocationEnabled=e.active)}_displaySpinner(){const{_spinner:e}=this;if(!e)return;const{location:t,waitingForResult:i}=this.viewModel;i&&t?e.show({location:t}):e.hide()}_destroySpinner(){const{_spinner:e,view:t}=this;e&&(t?.ui?.remove(e,O),e.destroy(),this._spinner=null)}_spinnerEnabledChange(e){this._destroySpinner(),e&&this._createSpinner(this.viewModel?.view)}};e([a()],k.prototype,"_focusOn",void 0),e([a()],k.prototype,"_relatedRecordsFlowItems",void 0),e([a()],k.prototype,"_hideActionText",null),e([a()],k.prototype,"_featureNavigationVisible",null),e([a()],k.prototype,"_isCollapsed",null),e([a()],k.prototype,"_collapseEnabled",null),e([a()],k.prototype,"collapsed",void 0),e([a()],k.prototype,"content",null),e([a()],k.prototype,"icon",void 0),e([a()],k.prototype,"featureMenuOpen",null),e([a()],k.prototype,"featureNavigationTop",void 0),e([a()],k.prototype,"features",null),e([a({type:w})],k.prototype,"headerActions",void 0),e([a()],k.prototype,"headingLevel",void 0),e([a()],k.prototype,"location",null),e([a()],k.prototype,"label",null),e([a(),y("esri/widgets/Features/t9n/Features")],k.prototype,"messages",void 0),e([a(),y("esri/t9n/common")],k.prototype,"messagesCommon",void 0),e([a()],k.prototype,"promises",null),e([a()],k.prototype,"responsiveActionsEnabled",void 0),e([a({readOnly:!0})],k.prototype,"selectedFeature",null),e([a()],k.prototype,"selectedFeatureIndex",null),e([a({readOnly:!0})],k.prototype,"selectedFeatureWidget",null),e([a()],k.prototype,"title",null),e([a()],k.prototype,"updateLocationEnabled",null),e([a()],k.prototype,"view",null),e([a({type:g}),I(["triggerAction","trigger-action"])],k.prototype,"viewModel",void 0),e([a({type:_,nonNullable:!0})],k.prototype,"visibleElements",void 0),e([a()],k.prototype,"visible",null),k=e([l("esri.widgets.Features")],k);const N=k;export{N as default};
|
|
5
|
+
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import t from"../core/Collection.js";import{eventKey as i}from"../core/events.js";import o from"../core/Logger.js";import{watch as s,when as r}from"../core/reactiveUtils.js";import{throttle as n}from"../core/throttle.js";import{property as a}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import d from"./Feature.js";import c from"./Spinner.js";import u from"./Widget.js";import{css as h}from"./Feature/resources.js";import{FeatureContentMixin as p}from"./Feature/support/FeatureContentMixin.js";import{css as m}from"./Features/css.js";import v from"./Features/FeaturesRelatedRecords.js";import w from"./Features/FeaturesViewModel.js";import g from"./Features/FeaturesVisibleElements.js";import{ActionsCollection as _}from"./Popup/actions.js";import{getPointFromGeometry as f}from"./Popup/actionUtils.js";import{loadCalciteComponents as F}from"./support/componentsUtils.js";import{globalCss as M}from"./support/globalCss.js";import{Heading as b}from"./support/Heading.js";import"./support/widgetUtils.js";import{messageBundle as y}from"./support/decorators/messageBundle.js";import{vmEvent as I}from"./support/decorators/vmEvent.js";import{tsx as C}from"./support/jsxFactory.js";import{substitute as A}from"../intl/substitute.js";import{formatNumber as N}from"../intl/number.js";const x="selected-index",j=0,R="features-spinner",k=50;let O=class extends(p(u)){constructor(e,i){super(e,i),this._featureMenuIntersectionObserverCallback=([e])=>{e?.isIntersecting&&null!=this.viewModel.featurePage&&this.viewModel.featurePage++},this._featureMenuIntersectionObserver=new IntersectionObserver(this._featureMenuIntersectionObserverCallback,{root:window.document}),this._featureMenuIntersectionObserverNode=null,this._focusOn=null,this._spinner=null,this._feature=null,this._relatedRecordsFlowItems=new t,this._relatedRecordsWidget=new v({flowItems:this._relatedRecordsFlowItems}),this._rootFlowItemNode=null,this._featureMenuViewportNode=null,this.collapsed=!1,this.icon=null,this.featureNavigationTop=!1,this.headerActions=new _,this.headingLevel=2,this.messages=null,this.messagesCommon=null,this.responsiveActionsEnabled=!1,this.viewModel=new w,this.visibleElements=new g,this._renderAction=(e,t)=>{const i=this._getActionTitle(e),{type:o,active:s,uid:r,disabled:n,indicator:a}=e;return e.visible?C("calcite-action",{active:"toggle"===o&&e.value,appearance:"solid",bind:this,"data-action-uid":r,disabled:n,icon:this._getActionIcon(e),indicator:a,key:`action-${t}`,loading:s,onclick:this._triggerAction,scale:"s",text:i,title:this._hideActionText?i:void 0},this._getFallbackIcon(e)):null},this._openFeatureMenu=()=>{this.featureMenuOpen=!0},this._previousFeature=()=>{this.viewModel.selectedFeatureIndex--},this._nextFeature=()=>{this.viewModel.selectedFeatureIndex++},this._handleFeatureMenuBack=()=>{this.featureMenuOpen&&(this._focusOn="root-flow-item",this.featureMenuOpen=!1,this.viewModel.browseClusterEnabled=!1)},this._focusFlowItemNode=e=>{this._focusOn===e&&requestAnimationFrame((async()=>{switch(e){case"menu-flow-item":await(this._featureMenuViewportNode?.setFocus());break;case"root-flow-item":await(this._rootFlowItemNode?.setFocus())}this._focusOn=null}))},this._focusFlowItemNodeThrottled=n(this._focusFlowItemNode,k),this._displaySpinnerThrottled=n((()=>this._displaySpinner()),j),this._addSelectedFeatureIndexHandle(),this.addHandles([this._displaySpinnerThrottled,this._focusFlowItemNodeThrottled,s((()=>this.viewModel?.active),(()=>this._toggleScreenLocationEnabled())),s((()=>this.viewModel?.active),(e=>this._relatedRecordsWidget.closed=!e)),s((()=>this.visibleElements?.closeButton),(e=>this._relatedRecordsWidget.closable=e)),s((()=>this.visibleElements?.spinner),(e=>this._spinnerEnabledChange(e))),s((()=>this.viewModel?.view),((e,t)=>this._viewChange(e,t))),s((()=>this.viewModel?.view?.ready),((e,t)=>this._viewReadyChange(e??!1,t??!1))),s((()=>[this.viewModel?.waitingForResult,this.viewModel?.location]),(()=>{this._hideSpinner(),this._displaySpinnerThrottled()})),s((()=>this.selectedFeatureWidget),(()=>this._destroyRelatedRecordsFlowItemWidgets())),s((()=>{const e=this.selectedFeatureWidget?.viewModel;return[e?.title,e?.state]}),(()=>this._setTitleFromFeatureWidget())),s((()=>{const e=this.selectedFeatureWidget?.viewModel;return[e?.content,e?.state]}),(()=>this._setContentFromFeatureWidget())),s((()=>this.viewModel?.featureViewModels),(()=>this._featureMenuViewportScrollTop())),this._relatedRecordsWidget.on("close",(()=>this.close())),this._relatedRecordsWidget.on("exit",(()=>this._destroyRelatedRecordsFlowItemWidgets())),this._relatedRecordsWidget.on("open-related-feature",(({feature:e})=>this._openRelatedFeature(e)))])}loadDependencies(){return F({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),"action-bar":()=>import("@esri/calcite-components/dist/components/calcite-action-bar.js"),"action-group":()=>import("@esri/calcite-components/dist/components/calcite-action-group.js"),button:()=>import("@esri/calcite-components/dist/components/calcite-button.js"),flow:()=>import("@esri/calcite-components/dist/components/calcite-flow.js"),"flow-item":()=>import("@esri/calcite-components/dist/components/calcite-flow-item.js"),list:()=>import("@esri/calcite-components/dist/components/calcite-list.js"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item.js"),"list-item-group":()=>import("@esri/calcite-components/dist/components/calcite-list-item-group.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js")})}destroy(){this._destroyRelatedRecordsFlowItemWidgets(),this._destroySelectedFeatureWidget(),this._destroySpinner(),this._unobserveFeatureMenuObserver(),this._featureMenuIntersectionObserver?.disconnect(),this._relatedRecordsWidget?.destroy()}get _hideActionText(){if(!this.responsiveActionsEnabled)return!1;const e=this.view?.widthBreakpoint;return"xsmall"===e||"small"===e||"medium"===e}get _featureNavigationVisible(){return this.viewModel.active&&this.viewModel.featureCount>1&&this.visibleElements.featureNavigation}get _isCollapsed(){return this._collapseEnabled&&this.collapsed}get _collapseEnabled(){return this.visibleElements.collapseButton&&!!this.title&&!!this.content}get content(){return this.viewModel.content}set content(e){this.viewModel.content=e}get featureMenuOpen(){return this.viewModel.featureMenuOpen}set featureMenuOpen(e){this.viewModel.featureMenuOpen=e}get features(){return this.viewModel.features}set features(e){this.viewModel.features=e}get location(){return this.viewModel.location}set location(e){this.viewModel.location=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get promises(){return this.viewModel.promises}set promises(e){this.viewModel.promises=e}get selectedFeature(){return this.viewModel.selectedFeature}get selectedFeatureIndex(){return this.viewModel.selectedFeatureIndex}set selectedFeatureIndex(e){this.viewModel.selectedFeatureIndex=e}get selectedFeatureWidget(){const{_feature:e,headingLevel:t,_relatedRecordsFlowItems:i}=this,{selectedFeatureViewModel:o}=this.viewModel,s={title:!1};return o?(e?(e.viewModel=o,e.visibleElements=s):this._feature=new d({flowItems:i,headingLevel:t+1,viewModel:o,visibleElements:s}),this._feature):null}get title(){return this.viewModel.title}set title(e){this.viewModel.title=e}get updateLocationEnabled(){return this.viewModel.updateLocationEnabled}set updateLocationEnabled(e){this.viewModel.updateLocationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}get visible(){return this.viewModel.visible}set visible(e){this.viewModel.visible=e}blur(){const{active:e}=this.viewModel;e?this._rootFlowItemNode?.blur():o.getLogger(this).warn("Features can only be blurred when currently active.")}clear(){return this.viewModel.clear()}close(){this.viewModel.visible=!1}fetchFeatures(e,t){return this.viewModel.fetchFeatures(e,t)}focus(){const{active:e}=this.viewModel;e?this._setFocusOn():o.getLogger(this).warn("Features can only be focused when currently active.")}next(){return this.viewModel.next()}open(e){this.removeHandles(x);const t={collapsed:e?.collapsed??!1};this.set(t),this.viewModel.open(e),this.addHandles(r((()=>!this.viewModel.waitingForResult),(()=>this._addSelectedFeatureIndexHandle()),{once:!0}))}previous(){return this.viewModel.previous()}triggerAction(e){return this.viewModel.triggerAction(e)}render(){return C("div",{bind:this,class:this.classes(m.base,M.widget,M.panel),onkeydown:this._onMainKeydown},this._renderHeader(),this._renderContentContainer())}_renderFeatureNavigation(){return[this._renderPagination(),this._renderFeatureMenuButton()]}_renderHeader(){return!this.featureMenuOpen&&this.featureNavigationTop&&this._featureNavigationVisible?C("div",{class:m.header,key:"header-actions"},this._renderFeatureNavigation()):null}_renderFooter(){return this.featureMenuOpen||this.featureNavigationTop||!this._featureNavigationVisible?null:C("div",{class:m.footer,key:"footer-actions",slot:"footer"},this._renderFeatureNavigation())}_renderFeatureMenuButton(){const{messages:e,viewModel:t}=this,{featureCount:i,selectedFeatureIndex:o,pendingPromisesCount:s}=t;return C("calcite-action",{appearance:"solid",bind:this,icon:"list",key:"feature-menu-button",label:e.selectFeature,loading:s>0,onclick:this._openFeatureMenu,scale:"s",text:A(e.pageText,{index:N(o+1),total:N(i)}),textEnabled:!0,title:e.selectFeature})}_renderPagination(){const{previous:e,next:t}=this.messagesCommon.pagination;return C("calcite-action-bar",{class:m.paginationActionBar,expandDisabled:!0,key:"pagination-action-bar",layout:"horizontal",overflowActionsDisabled:!0,scale:"s"},C("calcite-action-group",{scale:"s"},C("calcite-action",{appearance:"solid",class:m.paginationPrevious,icon:"chevron-left",iconFlipRtl:!0,label:e,onclick:this._previousFeature,scale:"s",text:e,title:e}),C("calcite-action",{appearance:"solid",icon:"chevron-right",iconFlipRtl:!0,label:t,onclick:this._nextFeature,scale:"s",text:t,title:t})))}_renderFeatureMenuItem(e){const{selectedFeatureViewModel:t,featureViewModels:i}=this.viewModel,o=e===t,s=i.indexOf(e);return C("calcite-list-item",{bind:this,"data-feature-index":s,key:`feature-menu-item-${e.uid}`,onblur:this._removeActiveFeature,onfocus:this._setActiveFeature,onmouseleave:this._removeActiveFeature,onmouseover:this._setActiveFeature,selected:o,onCalciteListItemSelect:this._selectFeature},C("span",{innerHTML:e.title||this.messagesCommon.untitled,slot:"content"}))}_groupResultsByLayer(){const{featureViewModels:e}=this.viewModel,t=new Map;return e.forEach((e=>{const i=e?.graphic;if(!i)return;const o=i.sourceLayer??i.layer,s=t.get(o)??[];t.set(o,[...s,e])})),t}_renderFeatureMenu(){const{featureViewModels:e}=this.viewModel,t=this._groupResultsByLayer();return e.length?C("calcite-list",{selectionAppearance:"icon",selectionMode:"single"},Array.from(t.keys()).map((e=>C("calcite-list-item-group",{heading:e?.title??this.messagesCommon.untitled,key:e?.uid||"untitled"},t.get(e)?.map((e=>this._renderFeatureMenuItem(e))))))):null}_renderHeaderAction(e,t){return e.visible?C("calcite-action",{active:"toggle"===e.type&&e.value,appearance:"solid",bind:this,"data-action-uid":e.uid,disabled:e.disabled,icon:e.icon||"",indicator:e.indicator,key:`header-action-${t}`,loading:e.active,onclick:this._triggerHeaderAction,scale:"m",slot:"header-actions-end",text:e.title||"",title:e.title||""}):null}_renderHeaderActions(){return this.headerActions.map(((e,t)=>this._renderHeaderAction(e,t))).toArray()}_renderContentFeature(){const{headingLevel:e,visibleElements:t,_isCollapsed:i,_collapseEnabled:o,featureNavigationTop:s}=this,{title:r,active:n}=this.viewModel,a=t.heading&&r?r:"";return C("calcite-flow-item",{afterCreate:this._storeRootFlowItemNode,afterUpdate:this._focusRootFlowItemNode,bind:this,class:this.classes({[m.contentFeature]:!0,[m.flowItemCollapsed]:i}),closable:t.closeButton,closed:!n,collapsed:i,collapseDirection:s?"down":"up",collapsible:o,headingLevel:e,key:"root-flow-item",onCalciteFlowItemClose:this.close,onCalciteFlowItemToggle:this._handleCollapseToggle},a?C(b,{class:this.classes(m.featuresHeading,M.heading),innerHTML:a,key:"header-content",level:this.headingLevel,slot:"header-content"}):null,this._renderHeaderActions(),this._renderActionBar(),i?null:C("div",{class:this.classes(m.container,m.contentContainer)},this._renderContent()),this._renderFooter())}_renderFeatureMenuContainer(){const{viewModel:e,featureMenuOpen:t,messages:i,messagesCommon:o}=this,{active:s,featureViewModels:r,pendingPromisesCount:n}=e;return t?C("calcite-flow-item",{afterCreate:this._storeFeatureMenuFlowItemNode,afterUpdate:this._focusFeatureMenuFlowItemNode,bind:this,closable:!1,closed:!s,description:A(i.total,{total:r.length}),heading:i.selectFeature,key:"feature-menu",loading:e.waitingForContents,onCalciteFlowItemBack:this._handleFeatureMenuBack},n>0?C("calcite-loader",{class:m.loader,inline:!0,key:"feature-menu-loader",label:o.loading,scale:"m",slot:"header-actions-end"}):null,C("div",{class:m.container},this._renderFeatureMenu()),C("div",{afterCreate:this._featureMenuIntersectionObserverCreated,bind:this,class:m.featureMenuObserver}),C("calcite-button",{appearance:"transparent",onclick:this._handleFeatureMenuBack,slot:"footer-actions",width:"full"},o.back)):null}_renderContentContainer(){return C("calcite-flow",{key:"content-container"},this._renderContentFeature(),this._renderFeatureMenuContainer(),this._relatedRecordsWidget.render())}_getIconStyles(e){return{"background-image":e?`url(${e})`:""}}_getActionImage(e){const{selectedFeature:t}=this,i=t?.attributes,{image:o}=e;return o&&i?A(o,i):o??""}_getFallbackIcon(e){const{className:t,icon:i}=e;if(i)return null;const o=this._getActionImage(e),s={[m.icon]:!!t,[m.actionImage]:!!o};return t&&(s[t]=!0),o||t?C("span",{"aria-hidden":"true",class:this.classes(m.icon,s),key:"icon",styles:o?this._getIconStyles(o):{}}):null}_renderActionBar(){return!this._isCollapsed&&this.visibleElements.actionBar&&this.viewModel.allActions?.length?C("calcite-action-bar",{expandDisabled:!0,expanded:!this._hideActionText,key:"header-action-bar",scale:"s",slot:"action-bar"},C("calcite-action-group",{overlayPositioning:"fixed",scale:"s"},this._renderActions())):null}_renderActions(){return this.viewModel.allActions.toArray().map(this._renderAction)}_renderContent(){const e=this.viewModel?.content;return e?"string"==typeof e?C("div",{class:h.contentNode,innerHTML:e,key:e}):this.renderNodeContent(e):null}_setFocusOn(){this._focusOn=this.featureMenuOpen?"menu-flow-item":"root-flow-item",this.renderNow()}_handleCollapseToggle(){this.collapsed=!this.collapsed}async _openRelatedFeature(e){await e.viewModel.updateGeometry();const t=e.graphic,i=t?.geometry;if(null==i||null==t)return;this._destroyRelatedRecordsFlowItemWidgets(),await this.viewModel.zoomTo({target:i});const o=f(i);this.open({features:[t],location:null!=o?o:void 0})}_focusRootFlowItemNode(){this._focusFlowItemNodeThrottled("root-flow-item")}_focusFeatureMenuFlowItemNode(){this._focusFlowItemNodeThrottled("menu-flow-item")}_storeRootFlowItemNode(e){this._rootFlowItemNode=e,this._focusFlowItemNodeThrottled("root-flow-item")}_storeFeatureMenuFlowItemNode(e){this._featureMenuViewportNode=e,this._focusFlowItemNodeThrottled("menu-flow-item")}_setActiveFeature(e){const{viewModel:t}=this,i=e.currentTarget["data-feature-index"];t.activeFeature=t.features?.[i]||null}_removeActiveFeature(){this.viewModel.activeFeature=null}_selectFeature(e){const t=e.currentTarget["data-feature-index"];isNaN(t)||(this.viewModel.selectedFeatureIndex=t),this._handleFeatureMenuBack()}_unobserveFeatureMenuObserver(){this._featureMenuIntersectionObserverNode&&this._featureMenuIntersectionObserver.unobserve(this._featureMenuIntersectionObserverNode)}_featureMenuIntersectionObserverCreated(e){this._unobserveFeatureMenuObserver(),this._featureMenuIntersectionObserver.observe(e),this._featureMenuIntersectionObserverNode=e}_getActionIcon(e){return e.icon?e.icon:e.image||e.className?void 0:"question"}_getActionTitle(e){const{messages:t,selectedFeature:i,messagesCommon:o}=this,{id:s}=e,r=i?.attributes,n=e.title??"",a="zoom-to-feature"===s?A(n,{messages:t}):"remove-selected-feature"===s?A(n,{messages:o}):"zoom-to-clustered-features"===s||"browse-clustered-features"===s?A(n,{messages:t}):e.title;return a&&r?A(a,r):a??""}_onMainKeydown(e){const t=i(e);"ArrowLeft"===t&&(e.stopPropagation(),this._handleFeatureMenuBack(),this.previous()),"ArrowRight"===t&&(e.stopPropagation(),this._handleFeatureMenuBack(),this.next())}_featureMenuViewportScrollTop(){this._featureMenuViewportNode&&this._featureMenuViewportNode.scrollContentTo({top:0})}_setContentFromFeatureWidget(){const{selectedFeatureWidget:e}=this;e&&(this.viewModel.content=e)}_setTitleFromFeatureWidget(){const{selectedFeatureWidget:e,messagesCommon:t}=this,i=e?.viewModel;e&&(this.viewModel.title="error"===i?.state?t?.errorMessage:i?.title||"")}_addSelectedFeatureIndexHandle(){const e=s((()=>this.viewModel?.selectedFeatureIndex),((e,t)=>this._selectedFeatureIndexUpdated(e,t)));this.addHandles(e,x)}_selectedFeatureIndexUpdated(e,t){const{featureCount:i}=this.viewModel;i&&e!==t&&-1!==e&&(this._destroyRelatedRecordsFlowItemWidgets(),this._rootFlowItemNode&&this._rootFlowItemNode.scrollContentTo({top:0}))}_triggerHeaderAction(e){const t=e.currentTarget;if(t.disabled)return;const i=t.dataset.actionUid,o=this.headerActions.find((({uid:e})=>e===i));o&&!o.disabled&&("toggle"===o?.type&&(o.value=!o.value),this.emit("trigger-header-action",{action:o}))}_triggerAction(e){const t=e.currentTarget;if(t.disabled)return;const i=t.dataset.actionUid,{allActions:o}=this.viewModel,s=o.findIndex((e=>e.uid===i)),r=o.at(s);r&&"toggle"===r.type&&(r.value=!r.value),this.viewModel.triggerAction(s)}_createSpinner(e){e&&(this._spinner=new c({view:e}),e.ui.add(this._spinner,{key:R,position:"manual",internal:!0}))}_wireUpView(e){this._destroySpinner(),e&&this.visibleElements?.spinner&&this._createSpinner(e)}_hideSpinner(){const{_spinner:e}=this;e&&(e.location=null,e.hide())}_viewReadyChange(e,t){e?this._wireUpView(this.viewModel?.view):t&&this.viewModel.clear()}_viewChange(e,t){e&&t&&this.viewModel.clear()}_destroySelectedFeatureWidget(){const{_feature:e}=this;e&&(e.viewModel=null,!e.destroyed&&e.destroy()),this._feature=null}_destroyRelatedRecordsFlowItemWidgets(){this._relatedRecordsFlowItems.removeAll().forEach((e=>{"showAllEnabled"in e.viewModel&&(e.viewModel.showAllEnabled=!1),e.viewModel=null,e.destroy()}))}_toggleScreenLocationEnabled(){const{viewModel:e}=this;e&&(e.screenLocationEnabled=e.active)}_displaySpinner(){const{_spinner:e}=this;if(!e)return;const{location:t,waitingForResult:i}=this.viewModel;i&&t?e.show({location:t}):e.hide()}_destroySpinner(){const{_spinner:e,view:t}=this;e&&(t?.ui?.remove(e,R),e.destroy(),this._spinner=null)}_spinnerEnabledChange(e){this._destroySpinner(),e&&this._createSpinner(this.viewModel?.view)}};e([a()],O.prototype,"_focusOn",void 0),e([a()],O.prototype,"_relatedRecordsFlowItems",void 0),e([a()],O.prototype,"_hideActionText",null),e([a()],O.prototype,"_featureNavigationVisible",null),e([a()],O.prototype,"_isCollapsed",null),e([a()],O.prototype,"_collapseEnabled",null),e([a()],O.prototype,"collapsed",void 0),e([a()],O.prototype,"content",null),e([a()],O.prototype,"icon",void 0),e([a()],O.prototype,"featureMenuOpen",null),e([a()],O.prototype,"featureNavigationTop",void 0),e([a()],O.prototype,"features",null),e([a({type:_})],O.prototype,"headerActions",void 0),e([a()],O.prototype,"headingLevel",void 0),e([a()],O.prototype,"location",null),e([a()],O.prototype,"label",null),e([a(),y("esri/widgets/Features/t9n/Features")],O.prototype,"messages",void 0),e([a(),y("esri/t9n/common")],O.prototype,"messagesCommon",void 0),e([a()],O.prototype,"promises",null),e([a()],O.prototype,"responsiveActionsEnabled",void 0),e([a({readOnly:!0})],O.prototype,"selectedFeature",null),e([a()],O.prototype,"selectedFeatureIndex",null),e([a({readOnly:!0})],O.prototype,"selectedFeatureWidget",null),e([a()],O.prototype,"title",null),e([a()],O.prototype,"updateLocationEnabled",null),e([a()],O.prototype,"view",null),e([a({type:w}),I(["triggerAction","trigger-action"])],O.prototype,"viewModel",void 0),e([a({type:g,nonNullable:!0})],O.prototype,"visibleElements",void 0),e([a()],O.prototype,"visible",null),O=e([l("esri.widgets.Features")],O);const T=O;export{T as default};
|
package/widgets/Popup.js
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
|
3
3
|
See https://js.arcgis.com/4.28/esri/copyright.txt for details.
|
|
4
4
|
*/
|
|
5
|
-
import{_ as e}from"../chunks/tslib.es6.js";import{deprecatedProperty as t}from"../core/deprecate.js";import i from"../core/Logger.js";import{watch as o,on as n,whenOnce as s}from"../core/reactiveUtils.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import a from"../support/actions/ActionButton.js";import d from"./Features.js";import c from"./Widget.js";import{css as p}from"./Popup/css.js";import h from"./Popup/PopupViewModel.js";import u from"./Popup/PopupVisibleElements.js";import{globalCss as g}from"./support/globalCss.js";import{isRTL as v}from"./support/widgetUtils.js";import{messageBundle as w}from"./support/decorators/messageBundle.js";import{vmEvent as m}from"./support/decorators/vmEvent.js";import{tsx as b}from"./support/jsxFactory.js";const f={buttonEnabled:!0,position:"auto",breakpoint:{width:544}};let _=class extends c{constructor(e,t){super(e,t),this._dockAction=new a({id:"popup-dock-action"}),this._featuresWidget=new d({responsiveActionsEnabled:!0}),this._containerNode=null,this._mainContainerNode=null,this._pointerOffsetInPx=16,this.alignment="auto",this.collapsed=!1,this.collapseEnabled=!0,this.dockEnabled=!1,this.headingLevel=2,this.maxInlineActions=3,this.messages=null,this.spinnerEnabled=!0,this.viewModel=new h,this.visibleElements=new u}initialize(){this.addHandles([o((()=>[this.viewModel?.view?.widthBreakpoint,this.dockEnabled]),(()=>this._handleDockIcon()),{initial:!0}),o((()=>[this.dockEnabled,this.messages?.undock,this.messages?.dock]),(()=>this._handleDockEnabled()),{initial:!0}),o((()=>this.dockOptions),(e=>{const{_dockAction:t}=this,i=this._featuresWidget.headerActions;i.remove(t),e.buttonEnabled&&i.add(t)}),{initial:!0}),o((()=>this.viewModel?.screenLocation),(()=>this._positionContainer())),o((()=>[this.viewModel?.active,this.dockEnabled]),(()=>this._toggleScreenLocationEnabled())),o((()=>[this.viewModel?.screenLocation,this.viewModel?.view?.padding,this.viewModel?.view?.size,this.viewModel?.active,this.viewModel?.location,this.alignment]),(()=>this.reposition())),o((()=>this.viewModel?.view?.size),((e,t)=>this._updateDockEnabledForViewSize(e,t))),o((()=>this.viewModel?.view),((e,t)=>this._viewChange(e,t))),o((()=>this.viewModel?.view?.ready),((e,t)=>this._viewReadyChange(e??!1,t??!1))),o((()=>this.viewModel),(()=>this._featuresWidget.viewModel=this.viewModel),{initial:!0}),o((()=>this._featureNavigationTop),(e=>this._featuresWidget.featureNavigationTop=e),{initial:!0}),o((()=>this.headingLevel),(e=>this._featuresWidget.headingLevel=e),{initial:!0}),o((()=>this.collapseEnabled),(e=>this._featuresWidget.visibleElements.collapseButton=e),{initial:!0}),o((()=>this.collapsed),(e=>this._featuresWidget.collapsed=e),{initial:!0}),o((()=>this.visibleElements.closeButton),(e=>this._featuresWidget.visibleElements.closeButton=!!e),{initial:!0}),o((()=>this.spinnerEnabled),(e=>this._featuresWidget.visibleElements.spinner=e),{initial:!0}),o((()=>this.visibleElements.featureNavigation),(e=>this._featuresWidget.visibleElements.featureNavigation=!!e),{initial:!0}),n((()=>this._featuresWidget),"trigger-header-action",(e=>{e.action===this._dockAction&&(this.dockEnabled=!this.dockEnabled)}))])}destroy(){this._dockAction.destroy(),this._featuresWidget?.destroy()}get _featureNavigationTop(){const{currentAlignment:e,currentDockPosition:t}=this;return"bottom-left"===e||"bottom-center"===e||"bottom-right"===e||"top-left"===t||"top-center"===t||"top-right"===t}get actions(){return this.viewModel.actions}set actions(e){this.viewModel.actions=e}get autoCloseEnabled(){return this.viewModel.autoCloseEnabled}set autoCloseEnabled(e){this.viewModel.autoCloseEnabled=e}get autoOpenEnabled(){return t(i.getLogger(this),"autoOpenEnabled",{replacement:"MapView/SceneView.popupEnabled",version:"4.27"}),this.viewModel.autoOpenEnabled}set autoOpenEnabled(e){t(i.getLogger(this),"autoOpenEnabled",{replacement:"MapView/SceneView.popupEnabled",version:"4.27"}),this.viewModel.autoOpenEnabled=e}get defaultPopupTemplateEnabled(){return this.viewModel.defaultPopupTemplateEnabled}set defaultPopupTemplateEnabled(e){this.viewModel.defaultPopupTemplateEnabled=e}get content(){return this.viewModel.content}set content(e){this.viewModel.content=e}get currentAlignment(){return this._getCurrentAlignment()}get currentDockPosition(){return this._getCurrentDockPosition()}get dockOptions(){return this._get("dockOptions")||f}set dockOptions(e){const t={...f},i=this.viewModel?.view?.breakpoints,o={};i&&(o.width=i.xsmall,o.height=i.xsmall);const n={...t,...e},s={...t.breakpoint,...o},{breakpoint:r}=n;"object"==typeof r?n.breakpoint={...s,...r}:r&&(n.breakpoint=s),this._set("dockOptions",n),this._setCurrentDockPosition(),this.reposition()}get featureCount(){return this.viewModel.featureCount}get featureMenuOpen(){return this.viewModel.featureMenuOpen}set featureMenuOpen(e){this.viewModel.featureMenuOpen=e}get features(){return this.viewModel.features}set features(e){this.viewModel.features=e}get goToOverride(){return this.viewModel.goToOverride}set goToOverride(e){this.viewModel.goToOverride=e}get highlightEnabled(){return this.viewModel.highlightEnabled}set highlightEnabled(e){this.viewModel.highlightEnabled=e}get location(){return this.viewModel.location}set location(e){this.viewModel.location=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get promises(){return this.viewModel.promises}set promises(e){this.viewModel.promises=e}get selectedFeature(){return this.viewModel.selectedFeature}get selectedFeatureIndex(){return this.viewModel.selectedFeatureIndex}set selectedFeatureIndex(e){this.viewModel.selectedFeatureIndex=e}get selectedFeatureWidget(){return this._featuresWidget.selectedFeatureWidget}get title(){return this.viewModel.title}set title(e){this.viewModel.title=e}get updateLocationEnabled(){return this.viewModel.updateLocationEnabled}set updateLocationEnabled(e){this.viewModel.updateLocationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}get visible(){return this.viewModel.visible}set visible(e){this.viewModel.visible=e}blur(){const{active:e}=this.viewModel;e||i.getLogger(this).warn("Popup can only be blurred when currently active."),this._featuresWidget.blur()}clear(){return this.viewModel.clear()}close(){this.visible=!1}fetchFeatures(e,t){return this.viewModel.fetchFeatures(e,t)}focus(){const{active:e}=this.viewModel;e||i.getLogger(this).warn("Popup can only be focused when currently active."),this._featuresWidget.focus(),this.scheduleRender()}next(){return this.viewModel.next()}open(e){const t=!!e&&!!e.featureMenuOpen,i={collapsed:!!e&&!!e.collapsed,featureMenuOpen:t};this.set(i),this.viewModel.open(e),this._shouldFocus(e)}previous(){return this.viewModel.previous()}reposition(){this.renderNow(),this._positionContainer(),this._setCurrentAlignment()}triggerAction(e){return this.viewModel.triggerAction(e)}render(){const{dockEnabled:e,currentAlignment:t,currentDockPosition:i}=this,{active:o}=this.viewModel,n=o&&e,s=o&&!e,r=this.selectedFeature?.layer?.title,l=this.selectedFeature?.layer?.id,a={[p.alignTopCenter]:"top-center"===t,[p.alignBottomCenter]:"bottom-center"===t,[p.alignTopLeft]:"top-left"===t,[p.alignBottomLeft]:"bottom-left"===t,[p.alignTopRight]:"top-right"===t,[p.alignBottomRight]:"bottom-right"===t,[p.isDocked]:n,[p.shadow]:s,[p.isDockedTopLeft]:"top-left"===i,[p.isDockedTopCenter]:"top-center"===i,[p.isDockedTopRight]:"top-right"===i,[p.isDockedBottomLeft]:"bottom-left"===i,[p.isDockedBottomCenter]:"bottom-center"===i,[p.isDockedBottomRight]:"bottom-right"===i};return b("div",{afterCreate:this._positionContainer,afterUpdate:this._positionContainer,bind:this,class:this.classes(p.base,a),"data-layer-id":l,"data-layer-title":r,role:"presentation"},o?[this._renderMainContainer(),this._renderPointer()]:null)}_renderPointer(){return this.dockEnabled?null:b("div",{class:p.pointer,key:"popup-pointer",role:"presentation"},b("div",{class:this.classes(p.pointerDirection,p.shadow)}))}_renderMainContainer(){const{dockEnabled:e}=this,t={[p.shadow]:e};return b("div",{afterCreate:this._setMainContainerNode,afterUpdate:this._setMainContainerNode,bind:this,class:this.classes(p.main,g.widget,t)},this._featuresWidget.render())}async _shouldFocus(e){e?.shouldFocus&&(await s((()=>!0===this.viewModel?.active)),this.focus())}_isOutsideView(e){const{popupHeight:t,popupWidth:i,screenLocation:o,side:n,view:s}=e;if(isNaN(i)||isNaN(t)||!s||!o)return!1;const r=s.padding;return"right"===n&&o.x+i/2>s.width-r.right||("left"===n&&o.x-i/2<r.left||("top"===n&&o.y-t<r.top||"bottom"===n&&o.y+t>s.height-r.bottom))}_calculateAutoAlignment(e){if("auto"!==e)return e;const{_pointerOffsetInPx:t,_containerNode:i,_mainContainerNode:o,viewModel:n}=this,{screenLocation:s,view:r}=n;if(null==s||!r||!i)return"top-center";function l(e){return parseInt(e.replaceAll(/[^-\d\.]/g,""),10)}const a=o?window.getComputedStyle(o,null):null,d=a?l(a.getPropertyValue("max-height")):0,c=a?l(a.getPropertyValue("height")):0,{height:p,width:h}=i.getBoundingClientRect(),u=h+t,g=Math.max(p,d,c)+t,v=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"right",view:r}),w=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"left",view:r}),m=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"top",view:r}),b=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"bottom",view:r});return w?m?"bottom-right":"top-right":v?m?"bottom-left":"top-left":m?b?"top-center":"bottom-center":"top-center"}_callCurrentAlignment(e){return"function"==typeof e?e.call(this):e}_getCurrentAlignment(){const{alignment:e,dockEnabled:t}=this;return t||!this.viewModel.active?null:this._calculatePositionResult(this._calculateAutoAlignment(this._callCurrentAlignment(e)))}_setCurrentAlignment(){this._set("currentAlignment",this._getCurrentAlignment())}_setCurrentDockPosition(){this._set("currentDockPosition",this._getCurrentDockPosition())}_calculatePositionResult(e){const t=["left","right"];return v(this.container)&&t.reverse(),e?.replace(/leading/gi,t[0]).replaceAll(/trailing/gi,t[1])}_callDockPosition(e){return"function"==typeof e?e.call(this):e}_getDockPosition(){return this._calculatePositionResult(this._calculateAutoDockPosition(this._callDockPosition(this.dockOptions?.position)))}_getCurrentDockPosition(){return this.dockEnabled&&this.viewModel.active?this._getDockPosition():null}_calculateAutoDockPosition(e){if("auto"!==e)return e;const t=this.viewModel?.view,i=v(this.container)?"top-left":"top-right";if(!t)return i;const o=t.padding||{left:0,right:0,top:0,bottom:0},n=t.width-o.left-o.right,{breakpoints:s}=t;return s&&n<=s.xsmall?"bottom-center":i}_getDockIcon(){const e=this._getDockPosition();if(this.dockEnabled)return"minimize";switch(e){case"top-left":case"bottom-left":return"dock-left";case"top-center":return"maximize";case"bottom-center":return"dock-bottom";default:return"dock-right"}}_handleDockIcon(){this._dockAction.icon=this._getDockIcon()}_handleDockEnabled(){this._dockAction.title=this.dockEnabled?this.messages?.undock:this.messages?.dock}_setMainContainerNode(e){this._mainContainerNode=e}_positionContainer(e=this._containerNode){if(e&&(this._containerNode=e),!this._containerNode)return;const{screenLocation:t}=this.viewModel,{width:i}=this._containerNode.getBoundingClientRect(),o=this._calculatePositionStyle(t,i);o&&Object.assign(this._containerNode.style,o)}_calculateFullWidth(e){const{currentAlignment:t,_pointerOffsetInPx:i}=this;return"top-left"===t||"bottom-left"===t||"top-right"===t||"bottom-right"===t?e+i:e}_calculateAlignmentPosition(e,t,i,o){const{currentAlignment:n,_pointerOffsetInPx:s}=this;if(!i)return;const{padding:r}=i,l=o/2,a=i.height-t,d=i.width-e;return"bottom-center"===n?{top:t+s-r.top,left:e-l-r.left}:"top-left"===n?{bottom:a+s-r.bottom,right:d+s-r.right}:"bottom-left"===n?{top:t+s-r.top,right:d+s-r.right}:"top-right"===n?{bottom:a+s-r.bottom,left:e+s-r.left}:"bottom-right"===n?{top:t+s-r.top,left:e+s-r.left}:"top-center"===n?{bottom:a+s-r.bottom,left:e-l-r.left}:void 0}_calculatePositionStyle(e,t){const{dockEnabled:i,view:o}=this;if(!o)return;if(i)return{left:"",top:"",right:"",bottom:""};if(null==e||!t)return;const n=this._calculateFullWidth(t),s=this._calculateAlignmentPosition(e.x,e.y,o,n);return s?{top:void 0!==s.top?`${s.top}px`:"auto",left:void 0!==s.left?`${s.left}px`:"auto",bottom:void 0!==s.bottom?`${s.bottom}px`:"auto",right:void 0!==s.right?`${s.right}px`:"auto"}:void 0}_viewChange(e,t){e&&t&&(this.close(),this.clear())}_viewReadyChange(e,t){e?this._wireUpView():t&&(this.close(),this.clear())}_wireUpView(){this._setDockEnabledForViewSize(this.dockOptions)}_dockingThresholdCrossed(e,t,i){const[o,n]=e,[s,r]=t,{width:l=0,height:a=0}=i??{};return o<=l&&s>l||o>l&&s<=l||n<=a&&r>a||n>a&&r<=a}_updateDockEnabledForViewSize(e,t){if(!e||!t)return;const i=this.viewModel?.view?.padding||{left:0,right:0,top:0,bottom:0},o=i.left+i.right,n=i.top+i.bottom,s=[],r=[];s[0]=e[0]-o,s[1]=e[1]-n,r[0]=t[0]-o,r[1]=t[1]-n;const{dockOptions:l}=this,a=l.breakpoint;this._dockingThresholdCrossed(s,r,a)&&this._setDockEnabledForViewSize(l),this._setCurrentDockPosition()}_toggleScreenLocationEnabled(){const{dockEnabled:e,viewModel:t}=this;if(!t)return;const i=t.active&&!e;t.screenLocationEnabled=i}_shouldDockAtCurrentViewSize(e){const t=e.breakpoint,i=this.viewModel?.view?.ui;if(!i)return!1;const{width:o,height:n}=i;if(isNaN(o)||isNaN(n))return!1;if(!t)return!1;const s=t.hasOwnProperty("width")&&o<=(t.width??0),r=t.hasOwnProperty("height")&&n<=(t.height??0);return s||r}_setDockEnabledForViewSize(e){e.breakpoint&&(this.dockEnabled=this._shouldDockAtCurrentViewSize(e))}};e([r({readOnly:!0})],_.prototype,"_featureNavigationTop",null),e([r()],_.prototype,"actions",null),e([r()],_.prototype,"alignment",void 0),e([r()],_.prototype,"autoCloseEnabled",null),e([r()],_.prototype,"autoOpenEnabled",null),e([r()],_.prototype,"defaultPopupTemplateEnabled",null),e([r()],_.prototype,"content",null),e([r()],_.prototype,"collapsed",void 0),e([r()],_.prototype,"collapseEnabled",void 0),e([r({readOnly:!0})],_.prototype,"currentAlignment",null),e([r({readOnly:!0})],_.prototype,"currentDockPosition",null),e([r()],_.prototype,"dockOptions",null),e([r()],_.prototype,"dockEnabled",void 0),e([r({readOnly:!0})],_.prototype,"featureCount",null),e([r()],_.prototype,"featureMenuOpen",null),e([r()],_.prototype,"features",null),e([r()],_.prototype,"goToOverride",null),e([r()],_.prototype,"headingLevel",void 0),e([r()],_.prototype,"highlightEnabled",null),e([r()],_.prototype,"location",null),e([r()],_.prototype,"label",null),e([r()],_.prototype,"maxInlineActions",void 0),e([r(),w("esri/widgets/Popup/t9n/Popup")],_.prototype,"messages",void 0),e([r()],_.prototype,"promises",null),e([r({readOnly:!0})],_.prototype,"selectedFeature",null),e([r()],_.prototype,"selectedFeatureIndex",null),e([r({readOnly:!0})],_.prototype,"selectedFeatureWidget",null),e([r()],_.prototype,"spinnerEnabled",void 0),e([r()],_.prototype,"title",null),e([r()],_.prototype,"updateLocationEnabled",null),e([r()],_.prototype,"view",null),e([r({type:h}),m(["triggerAction","trigger-action"])],_.prototype,"viewModel",void 0),e([r()],_.prototype,"visible",null),e([r({type:u,nonNullable:!0})],_.prototype,"visibleElements",void 0),_=e([l("esri.widgets.Popup")],_);const k=_;export{k as default};
|
|
5
|
+
import{_ as e}from"../chunks/tslib.es6.js";import{deprecatedProperty as t}from"../core/deprecate.js";import i from"../core/Logger.js";import{watch as o,on as n,whenOnce as s}from"../core/reactiveUtils.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import a from"../support/actions/ActionButton.js";import d from"./Features.js";import c from"./Widget.js";import{css as p}from"./Popup/css.js";import h from"./Popup/PopupViewModel.js";import u from"./Popup/PopupVisibleElements.js";import{globalCss as g}from"./support/globalCss.js";import{isRTL as v}from"./support/widgetUtils.js";import{messageBundle as w}from"./support/decorators/messageBundle.js";import{vmEvent as m}from"./support/decorators/vmEvent.js";import{tsx as b}from"./support/jsxFactory.js";const f={buttonEnabled:!0,position:"auto",breakpoint:{width:544}};let _=class extends c{constructor(e,t){super(e,t),this._dockAction=new a({id:"popup-dock-action"}),this._featuresWidget=new d({responsiveActionsEnabled:!0}),this._containerNode=null,this._mainContainerNode=null,this._pointerOffsetInPx=16,this.alignment="auto",this.collapsed=!1,this.collapseEnabled=!0,this.dockEnabled=!1,this.headingLevel=2,this.maxInlineActions=3,this.messages=null,this.spinnerEnabled=!0,this.viewModel=new h,this.visibleElements=new u}initialize(){this.addHandles([o((()=>[this.viewModel?.view?.widthBreakpoint,this.dockEnabled]),(()=>this._handleDockIcon()),{initial:!0}),o((()=>[this.dockEnabled,this.messages?.undock,this.messages?.dock]),(()=>this._handleDockEnabled()),{initial:!0}),o((()=>this.dockOptions),(e=>{const{_dockAction:t}=this,i=this._featuresWidget.headerActions;i.remove(t),e.buttonEnabled&&i.add(t)}),{initial:!0}),o((()=>this.viewModel?.screenLocation),(()=>this._positionContainer())),o((()=>[this.viewModel?.active,this.dockEnabled]),(()=>this._toggleScreenLocationEnabled())),o((()=>[this.viewModel?.screenLocation,this.viewModel?.view?.padding,this.viewModel?.view?.size,this.viewModel?.active,this.viewModel?.location,this.alignment]),(()=>this.reposition())),o((()=>this.viewModel?.view?.size),((e,t)=>this._updateDockEnabledForViewSize(e,t))),o((()=>this.viewModel?.view),((e,t)=>this._viewChange(e,t))),o((()=>this.viewModel?.view?.ready),((e,t)=>this._viewReadyChange(e??!1,t??!1))),o((()=>this.viewModel),(()=>this._featuresWidget.viewModel=this.viewModel),{initial:!0}),o((()=>this._featureNavigationTop),(e=>this._featuresWidget.featureNavigationTop=e),{initial:!0}),o((()=>this.headingLevel),(e=>this._featuresWidget.headingLevel=e),{initial:!0}),o((()=>this.collapseEnabled),(e=>this._featuresWidget.visibleElements.collapseButton=e),{initial:!0}),o((()=>this.collapsed),(e=>this._featuresWidget.collapsed=e),{initial:!0}),o((()=>this.visibleElements.closeButton),(e=>this._featuresWidget.visibleElements.closeButton=!!e),{initial:!0}),o((()=>this.spinnerEnabled),(e=>this._featuresWidget.visibleElements.spinner=e),{initial:!0}),o((()=>this.visibleElements.featureNavigation),(e=>this._featuresWidget.visibleElements.featureNavigation=!!e),{initial:!0}),n((()=>this._featuresWidget),"trigger-header-action",(e=>{e.action===this._dockAction&&(this.dockEnabled=!this.dockEnabled)}))])}destroy(){this._dockAction.destroy(),this._featuresWidget?.destroy()}get _featureNavigationTop(){const{currentAlignment:e,currentDockPosition:t}=this;return"bottom-left"===e||"bottom-center"===e||"bottom-right"===e||"top-left"===t||"top-center"===t||"top-right"===t}get actions(){return this.viewModel.actions}set actions(e){this.viewModel.actions=e}get autoCloseEnabled(){return this.viewModel.autoCloseEnabled}set autoCloseEnabled(e){this.viewModel.autoCloseEnabled=e}get autoOpenEnabled(){return t(i.getLogger(this),"autoOpenEnabled",{replacement:"MapView/SceneView.popupEnabled",version:"4.27"}),this.viewModel.autoOpenEnabled}set autoOpenEnabled(e){t(i.getLogger(this),"autoOpenEnabled",{replacement:"MapView/SceneView.popupEnabled",version:"4.27"}),this.viewModel.autoOpenEnabled=e}get defaultPopupTemplateEnabled(){return this.viewModel.defaultPopupTemplateEnabled}set defaultPopupTemplateEnabled(e){this.viewModel.defaultPopupTemplateEnabled=e}get content(){return this.viewModel.content}set content(e){this.viewModel.content=e}get currentAlignment(){return this._getCurrentAlignment()}get currentDockPosition(){return this._getCurrentDockPosition()}get dockOptions(){return this._get("dockOptions")||f}set dockOptions(e){const t={...f},i=this.viewModel?.view?.breakpoints,o={};i&&(o.width=i.xsmall,o.height=i.xsmall);const n={...t,...e},s={...t.breakpoint,...o},{breakpoint:r}=n;"object"==typeof r?n.breakpoint={...s,...r}:r&&(n.breakpoint=s),this._set("dockOptions",n),this._setCurrentDockPosition(),this.reposition()}get featureCount(){return this.viewModel.featureCount}get featureMenuOpen(){return this.viewModel.featureMenuOpen}set featureMenuOpen(e){this.viewModel.featureMenuOpen=e}get features(){return this.viewModel.features}set features(e){this.viewModel.features=e}get goToOverride(){return this.viewModel.goToOverride}set goToOverride(e){this.viewModel.goToOverride=e}get highlightEnabled(){return this.viewModel.highlightEnabled}set highlightEnabled(e){this.viewModel.highlightEnabled=e}get location(){return this.viewModel.location}set location(e){this.viewModel.location=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get promises(){return this.viewModel.promises}set promises(e){this.viewModel.promises=e}get selectedFeature(){return this.viewModel.selectedFeature}get selectedFeatureIndex(){return this.viewModel.selectedFeatureIndex}set selectedFeatureIndex(e){this.viewModel.selectedFeatureIndex=e}get selectedFeatureWidget(){return this._featuresWidget.selectedFeatureWidget}get title(){return this.viewModel.title}set title(e){this.viewModel.title=e}get updateLocationEnabled(){return this.viewModel.updateLocationEnabled}set updateLocationEnabled(e){this.viewModel.updateLocationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}get visible(){return this.viewModel.visible}set visible(e){this.viewModel.visible=e}blur(){const{active:e}=this.viewModel;e||i.getLogger(this).warn("Popup can only be blurred when currently active."),this._featuresWidget.blur()}clear(){return this.viewModel.clear()}close(){this.visible=!1}fetchFeatures(e,t){return this.viewModel.fetchFeatures(e,t)}focus(){const{active:e}=this.viewModel;e||i.getLogger(this).warn("Popup can only be focused when currently active."),this.renderNow(),this._featuresWidget.focus()}next(){return this.viewModel.next()}open(e){const t=!!e&&!!e.featureMenuOpen,i={collapsed:!!e&&!!e.collapsed,featureMenuOpen:t};this.set(i),this.viewModel.open(e),this._shouldFocus(e)}previous(){return this.viewModel.previous()}reposition(){this.renderNow(),this._positionContainer(),this._setCurrentAlignment()}triggerAction(e){return this.viewModel.triggerAction(e)}render(){const{dockEnabled:e,currentAlignment:t,currentDockPosition:i}=this,{active:o}=this.viewModel,n=o&&e,s=o&&!e,r=this.selectedFeature?.layer?.title,l=this.selectedFeature?.layer?.id,a={[p.alignTopCenter]:"top-center"===t,[p.alignBottomCenter]:"bottom-center"===t,[p.alignTopLeft]:"top-left"===t,[p.alignBottomLeft]:"bottom-left"===t,[p.alignTopRight]:"top-right"===t,[p.alignBottomRight]:"bottom-right"===t,[p.isDocked]:n,[p.shadow]:s,[p.isDockedTopLeft]:"top-left"===i,[p.isDockedTopCenter]:"top-center"===i,[p.isDockedTopRight]:"top-right"===i,[p.isDockedBottomLeft]:"bottom-left"===i,[p.isDockedBottomCenter]:"bottom-center"===i,[p.isDockedBottomRight]:"bottom-right"===i};return b("div",{afterCreate:this._positionContainer,afterUpdate:this._positionContainer,bind:this,class:this.classes(p.base,a),"data-layer-id":l,"data-layer-title":r,role:"presentation"},o?[this._renderMainContainer(),this._renderPointer()]:null)}_renderPointer(){return this.dockEnabled?null:b("div",{class:p.pointer,key:"popup-pointer",role:"presentation"},b("div",{class:this.classes(p.pointerDirection,p.shadow)}))}_renderMainContainer(){const{dockEnabled:e}=this,t={[p.shadow]:e};return b("div",{afterCreate:this._setMainContainerNode,afterUpdate:this._setMainContainerNode,bind:this,class:this.classes(p.main,g.widget,t)},this._featuresWidget.render())}async _shouldFocus(e){e?.shouldFocus&&(await s((()=>!0===this.viewModel?.active)),this.focus())}_isOutsideView(e){const{popupHeight:t,popupWidth:i,screenLocation:o,side:n,view:s}=e;if(isNaN(i)||isNaN(t)||!s||!o)return!1;const r=s.padding;return"right"===n&&o.x+i/2>s.width-r.right||("left"===n&&o.x-i/2<r.left||("top"===n&&o.y-t<r.top||"bottom"===n&&o.y+t>s.height-r.bottom))}_calculateAutoAlignment(e){if("auto"!==e)return e;const{_pointerOffsetInPx:t,_containerNode:i,_mainContainerNode:o,viewModel:n}=this,{screenLocation:s,view:r}=n;if(null==s||!r||!i)return"top-center";function l(e){return parseInt(e.replaceAll(/[^-\d\.]/g,""),10)}const a=o?window.getComputedStyle(o,null):null,d=a?l(a.getPropertyValue("max-height")):0,c=a?l(a.getPropertyValue("height")):0,{height:p,width:h}=i.getBoundingClientRect(),u=h+t,g=Math.max(p,d,c)+t,v=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"right",view:r}),w=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"left",view:r}),m=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"top",view:r}),b=this._isOutsideView({popupHeight:g,popupWidth:u,screenLocation:s,side:"bottom",view:r});return w?m?"bottom-right":"top-right":v?m?"bottom-left":"top-left":m?b?"top-center":"bottom-center":"top-center"}_callCurrentAlignment(e){return"function"==typeof e?e.call(this):e}_getCurrentAlignment(){const{alignment:e,dockEnabled:t}=this;return t||!this.viewModel.active?null:this._calculatePositionResult(this._calculateAutoAlignment(this._callCurrentAlignment(e)))}_setCurrentAlignment(){this._set("currentAlignment",this._getCurrentAlignment())}_setCurrentDockPosition(){this._set("currentDockPosition",this._getCurrentDockPosition())}_calculatePositionResult(e){const t=["left","right"];return v(this.container)&&t.reverse(),e?.replace(/leading/gi,t[0]).replaceAll(/trailing/gi,t[1])}_callDockPosition(e){return"function"==typeof e?e.call(this):e}_getDockPosition(){return this._calculatePositionResult(this._calculateAutoDockPosition(this._callDockPosition(this.dockOptions?.position)))}_getCurrentDockPosition(){return this.dockEnabled&&this.viewModel.active?this._getDockPosition():null}_calculateAutoDockPosition(e){if("auto"!==e)return e;const t=this.viewModel?.view,i=v(this.container)?"top-left":"top-right";if(!t)return i;const o=t.padding||{left:0,right:0,top:0,bottom:0},n=t.width-o.left-o.right,{breakpoints:s}=t;return s&&n<=s.xsmall?"bottom-center":i}_getDockIcon(){const e=this._getDockPosition();if(this.dockEnabled)return"minimize";switch(e){case"top-left":case"bottom-left":return"dock-left";case"top-center":return"maximize";case"bottom-center":return"dock-bottom";default:return"dock-right"}}_handleDockIcon(){this._dockAction.icon=this._getDockIcon()}_handleDockEnabled(){this._dockAction.title=this.dockEnabled?this.messages?.undock:this.messages?.dock}_setMainContainerNode(e){this._mainContainerNode=e}_positionContainer(e=this._containerNode){if(e&&(this._containerNode=e),!this._containerNode)return;const{screenLocation:t}=this.viewModel,{width:i}=this._containerNode.getBoundingClientRect(),o=this._calculatePositionStyle(t,i);o&&Object.assign(this._containerNode.style,o)}_calculateFullWidth(e){const{currentAlignment:t,_pointerOffsetInPx:i}=this;return"top-left"===t||"bottom-left"===t||"top-right"===t||"bottom-right"===t?e+i:e}_calculateAlignmentPosition(e,t,i,o){const{currentAlignment:n,_pointerOffsetInPx:s}=this;if(!i)return;const{padding:r}=i,l=o/2,a=i.height-t,d=i.width-e;return"bottom-center"===n?{top:t+s-r.top,left:e-l-r.left}:"top-left"===n?{bottom:a+s-r.bottom,right:d+s-r.right}:"bottom-left"===n?{top:t+s-r.top,right:d+s-r.right}:"top-right"===n?{bottom:a+s-r.bottom,left:e+s-r.left}:"bottom-right"===n?{top:t+s-r.top,left:e+s-r.left}:"top-center"===n?{bottom:a+s-r.bottom,left:e-l-r.left}:void 0}_calculatePositionStyle(e,t){const{dockEnabled:i,view:o}=this;if(!o)return;if(i)return{left:"",top:"",right:"",bottom:""};if(null==e||!t)return;const n=this._calculateFullWidth(t),s=this._calculateAlignmentPosition(e.x,e.y,o,n);return s?{top:void 0!==s.top?`${s.top}px`:"auto",left:void 0!==s.left?`${s.left}px`:"auto",bottom:void 0!==s.bottom?`${s.bottom}px`:"auto",right:void 0!==s.right?`${s.right}px`:"auto"}:void 0}_viewChange(e,t){e&&t&&(this.close(),this.clear())}_viewReadyChange(e,t){e?this._wireUpView():t&&(this.close(),this.clear())}_wireUpView(){this._setDockEnabledForViewSize(this.dockOptions)}_dockingThresholdCrossed(e,t,i){const[o,n]=e,[s,r]=t,{width:l=0,height:a=0}=i??{};return o<=l&&s>l||o>l&&s<=l||n<=a&&r>a||n>a&&r<=a}_updateDockEnabledForViewSize(e,t){if(!e||!t)return;const i=this.viewModel?.view?.padding||{left:0,right:0,top:0,bottom:0},o=i.left+i.right,n=i.top+i.bottom,s=[],r=[];s[0]=e[0]-o,s[1]=e[1]-n,r[0]=t[0]-o,r[1]=t[1]-n;const{dockOptions:l}=this,a=l.breakpoint;this._dockingThresholdCrossed(s,r,a)&&this._setDockEnabledForViewSize(l),this._setCurrentDockPosition()}_toggleScreenLocationEnabled(){const{dockEnabled:e,viewModel:t}=this;if(!t)return;const i=t.active&&!e;t.screenLocationEnabled=i}_shouldDockAtCurrentViewSize(e){const t=e.breakpoint,i=this.viewModel?.view?.ui;if(!i)return!1;const{width:o,height:n}=i;if(isNaN(o)||isNaN(n))return!1;if(!t)return!1;const s=t.hasOwnProperty("width")&&o<=(t.width??0),r=t.hasOwnProperty("height")&&n<=(t.height??0);return s||r}_setDockEnabledForViewSize(e){e.breakpoint&&(this.dockEnabled=this._shouldDockAtCurrentViewSize(e))}};e([r({readOnly:!0})],_.prototype,"_featureNavigationTop",null),e([r()],_.prototype,"actions",null),e([r()],_.prototype,"alignment",void 0),e([r()],_.prototype,"autoCloseEnabled",null),e([r()],_.prototype,"autoOpenEnabled",null),e([r()],_.prototype,"defaultPopupTemplateEnabled",null),e([r()],_.prototype,"content",null),e([r()],_.prototype,"collapsed",void 0),e([r()],_.prototype,"collapseEnabled",void 0),e([r({readOnly:!0})],_.prototype,"currentAlignment",null),e([r({readOnly:!0})],_.prototype,"currentDockPosition",null),e([r()],_.prototype,"dockOptions",null),e([r()],_.prototype,"dockEnabled",void 0),e([r({readOnly:!0})],_.prototype,"featureCount",null),e([r()],_.prototype,"featureMenuOpen",null),e([r()],_.prototype,"features",null),e([r()],_.prototype,"goToOverride",null),e([r()],_.prototype,"headingLevel",void 0),e([r()],_.prototype,"highlightEnabled",null),e([r()],_.prototype,"location",null),e([r()],_.prototype,"label",null),e([r()],_.prototype,"maxInlineActions",void 0),e([r(),w("esri/widgets/Popup/t9n/Popup")],_.prototype,"messages",void 0),e([r()],_.prototype,"promises",null),e([r({readOnly:!0})],_.prototype,"selectedFeature",null),e([r()],_.prototype,"selectedFeatureIndex",null),e([r({readOnly:!0})],_.prototype,"selectedFeatureWidget",null),e([r()],_.prototype,"spinnerEnabled",void 0),e([r()],_.prototype,"title",null),e([r()],_.prototype,"updateLocationEnabled",null),e([r()],_.prototype,"view",null),e([r({type:h}),m(["triggerAction","trigger-action"])],_.prototype,"viewModel",void 0),e([r()],_.prototype,"visible",null),e([r({type:u,nonNullable:!0})],_.prototype,"visibleElements",void 0),_=e([l("esri.widgets.Popup")],_);const k=_;export{k as default};
|
package/widgets/Sketch.js
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
|
3
3
|
See https://js.arcgis.com/4.28/esri/copyright.txt for details.
|
|
4
4
|
*/
|
|
5
|
-
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{handlesGroup as t}from"../core/handleUtils.js";import{removeMaybe as o,destroyMaybe as i}from"../core/maybe.js";import{watch as s,syncAndInitial as n,when as l}from"../core/reactiveUtils.js";import{property as a}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import c from"./Widget.js";import u from"./Sketch/SketchViewModel.js";import d from"./Sketch/VisibleElements.js";import{loadCalciteComponents as p}from"./support/componentsUtils.js";import{globalCss as h}from"./support/globalCss.js";import{legacyIcon as v}from"./support/legacyIcon.js";import m from"./support/SelectionToolbar.js";import _ from"./support/SketchTooltipControls.js";import g from"./support/SnappingControls.js";import{isRTL as b}from"./support/widgetUtils.js";import{messageBundle as f}from"./support/decorators/messageBundle.js";import{vmEvent as w}from"./support/decorators/vmEvent.js";import{tsx as y}from"./support/jsxFactory.js";import{substitute as C}from"../intl/substitute.js";const T="esri-sketch",M={base:T,widgetIcon:v.edit,verticalLayout:`${T}--vertical`,panel:`${T}__panel`,infoPanel:`${T}__info-panel`,section:`${T}__section`,toolSection:`${T}__tool-section`,infoSection:`${T}__info-section`,infoCountSection:`${T}__info-count-section`,menuContainer:`${T}__menu-container`,menuHeader:`${T}__menu-header`,menuTitle:`${T}__menu-title`,featureCountBadge:`${T}__feature-count-badge`,featureCountText:`${T}__feature-count-text`,featureCountNumber:`${T}__feature-count-number`,actionToggle:`${T}__action-toggle`,actionToggleOn:`${T}__action-toggle--on`,actionTitle:`${T}__item-action-title`,actionIcon:`${T}__item-action-icon`};let O=class extends c{constructor(e,t){super(e,t),this._activeCreateOptions=null,this._menuOpen=!1,this._selectionToolbar=null,this._viewModelHandlesGroup=null,this.availableCreateTools=["point","polyline","polygon","rectangle","circle"],this.creationMode="continuous",this.iconClass=M.widgetIcon,this.icon=null,this.layout="horizontal",this.messages=null,this.messagesCommon=null,this.visibleElements=new d,this._activateCreateTool=this._activateCreateTool.bind(this),this.viewModel=e?.viewModel||new u}initialize(){const{layer:e,view:i}=this,{selectionTools:a}=this.visibleElements,r=new m({view:"2d"===i?.type?i:null,sources:e?[e]:null,visibleElements:{lassoTool:!!a?.["lasso-selection"],rectangleTool:!!a?.["rectangle-selection"]}});this.addHandles([s((()=>this.viewModel),(e=>{this._viewModelHandlesGroup=o(this._viewModelHandlesGroup),e&&(this._viewModelHandlesGroup=t([e.on("create",(e=>{this.scheduleRender(),this._onCreateOperation(e)})),e.on("update",(()=>this.scheduleRender())),e.on("delete",(e=>this.emit("delete",e))),e.on("undo",(()=>this.scheduleRender())),e.on("redo",(()=>this.scheduleRender())),s((()=>e.layer),(e=>{this._selectionToolbar&&(this._selectionToolbar.sources=e?[e]:null)})),s((()=>e.view),(e=>{this._selectionToolbar&&(this._selectionToolbar.view="2d"===e?.type?e:null)})),s((()=>e.state),(()=>this.notifyChange("state")))]))}),n),l((()=>r.activeToolInfo),(()=>this.viewModel.cancel())),r.on("complete",(e=>this._onSelectionOperationComplete(e)))]),this._selectionToolbar=r}loadDependencies(){return p({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js")})}destroy(){this._selectionToolbar?.destroy(),this._viewModelHandlesGroup=o(this._viewModelHandlesGroup)}get activeTool(){const e=this._selectionToolbar?.activeToolInfo;if(e)switch(e.toolName){case"lasso":return"lasso-selection";case"rectangle":return"rectangle-selection";case"default":return"custom-selection"}return this.viewModel.activeTool}get createGraphic(){return this.viewModel.createGraphic}get defaultCreateOptions(){return this.viewModel.defaultCreateOptions}set defaultCreateOptions(e){this.viewModel.defaultCreateOptions=e}get defaultUpdateOptions(){return this.viewModel.defaultUpdateOptions}set defaultUpdateOptions(e){this.viewModel.defaultUpdateOptions=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get labelOptions(){return this.viewModel.labelOptions}set labelOptions(e){this.viewModel.labelOptions=e}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get snappingOptions(){return this.viewModel.snappingOptions}set snappingOptions(e){this.viewModel.snappingOptions=e}get state(){return this._selectionToolbar?.activeToolInfo?"active":this.viewModel.state}get tooltipOptions(){return this.viewModel.tooltipOptions}set tooltipOptions(e){this.viewModel.tooltipOptions=e}get updateGraphics(){return this.viewModel.updateGraphics}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set viewModel(e){const t=this._get("viewModel");e!==t&&(t&&i(t),this._set("viewModel",e))}get _effectiveAvailableCreateTools(){const{availableCreateTools:e,visibleElements:t}=this;return e?.filter((e=>!!t.createTools?.[e]))}create(e,t){this._activeCreateOptions=t||null,this.viewModel.create(e,t)}update(e,t){return this.viewModel.update(e,t)}complete(){this.viewModel.complete()}cancel(){this._selectionToolbar?.cancel(),this.viewModel.cancel()}undo(){this.viewModel.undo(),this.view?.focus()}redo(){this.viewModel.redo(),this.view?.focus()}delete(){this.viewModel.delete()}duplicate(){return this.viewModel.duplicate()}render(){const{label:e,layout:t,viewModel:{state:o}}=this;return y("div",{"aria-label":e,class:this.classes(M.base,h.widget,{[h.disabled]:"disabled"===o,[M.verticalLayout]:"vertical"===t})},y("div",{class:M.panel,role:"toolbar"},this._renderTopPanelContents()),y("div",{class:this.classes(M.panel,M.infoPanel)},this._renderInfoPanelContents()))}_renderTopPanelContents(){const e=this.classes(M.section,M.toolSection),{_effectiveAvailableCreateTools:t,visibleElements:o,viewModel:i}=this;return[i.updateOnGraphicClick||this._selectionToolbar?.visibleToolCount?y("div",{class:e,key:"selection-button-container",role:"menu"},this._renderDefaultSelectionButton(),this._renderSelectionToolbar()):null,t?.length?y("div",{class:e,role:"menu"},this._renderDrawButtons()):null,o.undoRedoMenu?y("div",{class:e,key:"undo-redo-menu-button-container",role:"menu"},this._renderUndoRedoMenuButtons()):null,o.settingsMenu?y("div",{class:M.section,key:"settings-menu-button-container"},this._renderSettingsMenuButton()):null]}_renderInfoPanelContents(){return this._menuOpen?this._renderSettingsMenu():this.updateGraphics.length?[y("div",{class:this.classes(M.section,M.infoSection,M.infoCountSection),key:"feature-count-container"},this._renderFeatureCount()),y("div",{class:this.classes(M.section,M.infoSection),key:"delete-button-container"},this._renderDuplicateButton(),this._renderDeleteButton())]:void 0}_renderSettingsMenu(){const{labelOptions:e,messagesCommon:t,snappingOptions:o,tooltipOptions:i,view:s,visibleElements:n}=this;return[y("div",{class:M.menuContainer,"data-testid":"menu",key:"settings-menu-container",role:"menu"},y("header",{class:M.menuHeader,key:"settings-menu-header"},y("span",{class:M.menuTitle},t.settings)),n.sketchTooltipControls?y(_,{labelOptions:e,tooltipOptions:i,viewType:s?.type,visibleElements:n.sketchTooltipControlsElements}):void 0,n.snappingControls&&s&&o?y(g,{snappingOptions:o,view:s,visibleElements:n.snappingControlsElements}):void 0)]}_renderFeatureCount(){const{layout:e,messages:t,updateGraphics:{length:o}}=this,i=C(t.selectedCount,{count:o});return y("div",{"aria-label":i,class:M.featureCountBadge},y("span",{class:M.featureCountNumber},"vertical"===e?o:i))}_renderDuplicateButton(){if(!this.visibleElements.duplicateButton)return;const e=this.messages,t=this.updateGraphics.length>1?e.duplicateFeatures:e.duplicateFeature;return y("calcite-action",{bind:this,label:t,onclick:this._onDuplicateSelect,scale:"s",text:t,title:t},y("calcite-icon",{icon:"copy",scale:"s"}))}_renderDeleteButton(){const e=this.messages,t=this.updateGraphics.length>1?e.deleteFeatures:e.deleteFeature;return y("calcite-action",{bind:this,label:t,onclick:this.delete,scale:"s",text:t,title:t},y("calcite-icon",{icon:"trash",scale:"s"}))}_renderDefaultSelectionButton(){if(!this.viewModel.updateOnGraphicClick)return;const e=this.messages.selectFeature;return y("calcite-action",{active:"ready"===this.state,bind:this,label:e,onclick:this._activateDefaultSelectTool,scale:"s",text:e,title:e},y("calcite-icon",{icon:"cursor",scale:"s"}))}_renderSelectionToolbar(){if("2d"===this.view?.type&&this._selectionToolbar)return this._selectionToolbar.render()}_renderDrawButtons(){return this._effectiveAvailableCreateTools?.map((e=>{switch(e){case"point":return this._renderPointButton();case"polyline":return this._renderPolylineButton();case"polygon":return this._renderPolygonButton();case"rectangle":return this._renderRectangleButton();case"circle":return this._renderCircleButton();default:return}}))}_renderPointButton(){const e="point",t=this.messages.drawPoint;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"pin",scale:"s"}))}_renderPolygonButton(){const e="polygon",t=this.messages.drawPolygon;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"polygon",scale:"s"}))}_renderPolylineButton(){const e="polyline",t=this.messages.drawPolyline;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"line",scale:"s"}))}_renderCircleButton(){const e="circle",t=this.messages.drawCircle;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"circle",scale:"s"}))}_renderRectangleButton(){const e="rectangle",t=this.messages.drawRectangle;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"rectangle",scale:"s"}))}_renderUndoRedoMenuButtons(){return[this._renderUndoButton(),this._renderRedoButton()]}_renderUndoButton(){const e=this.messages.undo;return y("calcite-action",{bind:this,disabled:!this.viewModel.canUndo(),label:e,onclick:this.undo,scale:"s",text:e,title:e},y("calcite-icon",{icon:b(this.container)?"redo":"undo",scale:"s"}))}_renderRedoButton(){const e=this.messages.redo;return y("calcite-action",{bind:this,disabled:!this.viewModel.canRedo(),label:e,onclick:this.redo,scale:"s",text:e,title:e},y("calcite-icon",{icon:b(this.container)?"undo":"redo",scale:"s"}))}_renderSettingsMenuButton(){const e=this.messagesCommon.settings;return y("calcite-action",{active:this._menuOpen,bind:this,"data-testid":"settings-menu-action",label:e,onclick:this._toggleMenu,scale:"s",text:e,title:e},y("calcite-icon",{icon:"gear",scale:"s"}))}_activateCreateTool(e){this.activeTool!==e?(this._selectionToolbar?.cancel(),this.create(e)):this.cancel()}_onCreateOperation(e){if("complete"!==e.state)return;const{creationMode:t}=this,{type:o}=e;if("create"===o){const{tool:o,graphic:i}=e,s=this._activeCreateOptions;this._activeCreateOptions=null,"continuous"===t?this.create(o,s):"update"===t&&this.update([i])}}_toggleMenu(){this._menuOpen=!this._menuOpen,this.scheduleRender()}_onDuplicateSelect(){const e=this.duplicate(),t=this.viewModel.activeTool;"transform"!==t&&"reshape"!==t||this.update(e,{tool:t})}_onSelectionOperationComplete(e){const{viewModel:{defaultUpdateOptions:t}}=this,{selection:o}=e;if(!e.aborted&&o.length){const e=t.tool,i=o.length>1&&"reshape"===e?"transform":e;this.update(o,{...t,tool:i})}this.notifyChange("state")}_activateDefaultSelectTool(){this.cancel(),this.view?.focus()}};e([a()],O.prototype,"activeTool",null),e([a({cast:e=>{if(!e?.length)return null;const t=new Set(["point","polyline","polygon","rectangle","circle"]);return e.filter((e=>t.has(e)))}})],O.prototype,"availableCreateTools",void 0),e([a({readOnly:!0})],O.prototype,"createGraphic",null),e([a()],O.prototype,"creationMode",void 0),e([a()],O.prototype,"defaultCreateOptions",null),e([a()],O.prototype,"defaultUpdateOptions",null),e([a()],O.prototype,"iconClass",void 0),e([a()],O.prototype,"icon",void 0),e([a()],O.prototype,"label",null),e([a()],O.prototype,"labelOptions",null),e([a()],O.prototype,"layer",null),e([a({type:["horizontal","vertical"]})],O.prototype,"layout",void 0),e([a(),f("esri/widgets/Sketch/t9n/Sketch")],O.prototype,"messages",void 0),e([a(),f("esri/t9n/common")],O.prototype,"messagesCommon",void 0),e([a()],O.prototype,"snappingOptions",null),e([a()],O.prototype,"state",null),e([a()],O.prototype,"tooltipOptions",null),e([a({readOnly:!0})],O.prototype,"updateGraphics",null),e([a()],O.prototype,"view",null),e([a(),w(["create","update","undo","redo"])],O.prototype,"viewModel",null),e([a({type:d,nonNullable:!0})],O.prototype,"visibleElements",void 0),e([a()],O.prototype,"_effectiveAvailableCreateTools",null),O=e([r("esri.widgets.Sketch")],O);const S=O;export{S as default};
|
|
5
|
+
import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{handlesGroup as t}from"../core/handleUtils.js";import{removeMaybe as o,destroyMaybe as i}from"../core/maybe.js";import{watch as s,syncAndInitial as n,when as l}from"../core/reactiveUtils.js";import{property as a}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import c from"./Widget.js";import u from"./Sketch/SketchViewModel.js";import d from"./Sketch/VisibleElements.js";import{loadCalciteComponents as p}from"./support/componentsUtils.js";import{globalCss as h}from"./support/globalCss.js";import{legacyIcon as v}from"./support/legacyIcon.js";import m from"./support/SelectionToolbar.js";import _ from"./support/SketchTooltipControls.js";import g from"./support/SnappingControls.js";import{isRTL as b}from"./support/widgetUtils.js";import{messageBundle as f}from"./support/decorators/messageBundle.js";import{vmEvent as w}from"./support/decorators/vmEvent.js";import{tsx as y}from"./support/jsxFactory.js";import{substitute as C}from"../intl/substitute.js";const T="esri-sketch",M={base:T,widgetIcon:v.edit,verticalLayout:`${T}--vertical`,panel:`${T}__panel`,infoPanel:`${T}__info-panel`,section:`${T}__section`,toolSection:`${T}__tool-section`,infoSection:`${T}__info-section`,infoCountSection:`${T}__info-count-section`,menuContainer:`${T}__menu-container`,menuHeader:`${T}__menu-header`,menuTitle:`${T}__menu-title`,featureCountBadge:`${T}__feature-count-badge`,featureCountText:`${T}__feature-count-text`,featureCountNumber:`${T}__feature-count-number`,actionToggle:`${T}__action-toggle`,actionToggleOn:`${T}__action-toggle--on`,actionTitle:`${T}__item-action-title`,actionIcon:`${T}__item-action-icon`};let O=class extends c{constructor(e,t){super(e,t),this._activeCreateOptions=null,this._menuOpen=!1,this._selectionToolbar=null,this._viewModelHandlesGroup=null,this.availableCreateTools=["point","polyline","polygon","rectangle","circle"],this.creationMode="continuous",this.iconClass=M.widgetIcon,this.icon=null,this.layout="horizontal",this.messages=null,this.messagesCommon=null,this.visibleElements=new d,this._activateCreateTool=this._activateCreateTool.bind(this),this.viewModel=e?.viewModel||new u}initialize(){const{layer:e,view:i}=this,a=new m({view:"2d"===i?.type?i:null,sources:e?[e]:null});this.addHandles([s((()=>this.viewModel),(e=>{this._viewModelHandlesGroup=o(this._viewModelHandlesGroup),e&&(this._viewModelHandlesGroup=t([e.on("create",(e=>{this.scheduleRender(),this._onCreateOperation(e)})),e.on("update",(()=>this.scheduleRender())),e.on("delete",(e=>this.emit("delete",e))),e.on("undo",(()=>this.scheduleRender())),e.on("redo",(()=>this.scheduleRender())),s((()=>e.layer),(e=>{this._selectionToolbar&&(this._selectionToolbar.sources=e?[e]:null)})),s((()=>e.view),(e=>{this._selectionToolbar&&(this._selectionToolbar.view="2d"===e?.type?e:null)})),s((()=>e.state),(()=>this.notifyChange("state")))]))}),n),l((()=>a.activeToolInfo),(()=>this.viewModel.cancel())),a.on("complete",(e=>this._onSelectionOperationComplete(e))),s((()=>{const{selectionTools:e}=this.visibleElements;return{lassoTool:!!e?.["lasso-selection"],rectangleTool:!!e?.["rectangle-selection"]}}),(e=>{Object.assign(a.visibleElements,e)}),n)]),this._selectionToolbar=a}loadDependencies(){return p({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js")})}destroy(){this._selectionToolbar?.destroy(),this._viewModelHandlesGroup=o(this._viewModelHandlesGroup)}get activeTool(){const e=this._selectionToolbar?.activeToolInfo;if(e)switch(e.toolName){case"lasso":return"lasso-selection";case"rectangle":return"rectangle-selection";case"default":return"custom-selection"}return this.viewModel.activeTool}get createGraphic(){return this.viewModel.createGraphic}get defaultCreateOptions(){return this.viewModel.defaultCreateOptions}set defaultCreateOptions(e){this.viewModel.defaultCreateOptions=e}get defaultUpdateOptions(){return this.viewModel.defaultUpdateOptions}set defaultUpdateOptions(e){this.viewModel.defaultUpdateOptions=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get labelOptions(){return this.viewModel.labelOptions}set labelOptions(e){this.viewModel.labelOptions=e}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get snappingOptions(){return this.viewModel.snappingOptions}set snappingOptions(e){this.viewModel.snappingOptions=e}get state(){return this._selectionToolbar?.activeToolInfo?"active":this.viewModel.state}get tooltipOptions(){return this.viewModel.tooltipOptions}set tooltipOptions(e){this.viewModel.tooltipOptions=e}get updateGraphics(){return this.viewModel.updateGraphics}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set viewModel(e){const t=this._get("viewModel");e!==t&&(t&&i(t),this._set("viewModel",e))}get _effectiveAvailableCreateTools(){const{availableCreateTools:e,visibleElements:t}=this;return e?.filter((e=>!!t.createTools?.[e]))}create(e,t){this._activeCreateOptions=t||null,this.viewModel.create(e,t)}update(e,t){return this.viewModel.update(e,t)}complete(){this.viewModel.complete()}cancel(){this._selectionToolbar?.cancel(),this.viewModel.cancel()}undo(){this.viewModel.undo(),this.view?.focus()}redo(){this.viewModel.redo(),this.view?.focus()}delete(){this.viewModel.delete()}duplicate(){return this.viewModel.duplicate()}render(){const{label:e,layout:t,viewModel:{state:o}}=this;return y("div",{"aria-label":e,class:this.classes(M.base,h.widget,{[h.disabled]:"disabled"===o,[M.verticalLayout]:"vertical"===t})},y("div",{class:M.panel,role:"toolbar"},this._renderTopPanelContents()),y("div",{class:this.classes(M.panel,M.infoPanel)},this._renderInfoPanelContents()))}_renderTopPanelContents(){const e=this.classes(M.section,M.toolSection),{_effectiveAvailableCreateTools:t,visibleElements:o,viewModel:i}=this;return[i.updateOnGraphicClick||this._selectionToolbar?.visibleToolCount?y("div",{class:e,key:"selection-button-container",role:"menu"},this._renderDefaultSelectionButton(),this._renderSelectionToolbar()):null,t?.length?y("div",{class:e,role:"menu"},this._renderDrawButtons()):null,o.undoRedoMenu?y("div",{class:e,key:"undo-redo-menu-button-container",role:"menu"},this._renderUndoRedoMenuButtons()):null,o.settingsMenu?y("div",{class:M.section,key:"settings-menu-button-container"},this._renderSettingsMenuButton()):null]}_renderInfoPanelContents(){return this._menuOpen?this._renderSettingsMenu():this.updateGraphics.length?[y("div",{class:this.classes(M.section,M.infoSection,M.infoCountSection),key:"feature-count-container"},this._renderFeatureCount()),y("div",{class:this.classes(M.section,M.infoSection),key:"delete-button-container"},this._renderDuplicateButton(),this._renderDeleteButton())]:void 0}_renderSettingsMenu(){const{labelOptions:e,messagesCommon:t,snappingOptions:o,tooltipOptions:i,view:s,visibleElements:n}=this;return[y("div",{class:M.menuContainer,"data-testid":"menu",key:"settings-menu-container",role:"menu"},y("header",{class:M.menuHeader,key:"settings-menu-header"},y("span",{class:M.menuTitle},t.settings)),n.sketchTooltipControls?y(_,{labelOptions:e,tooltipOptions:i,viewType:s?.type,visibleElements:n.sketchTooltipControlsElements}):void 0,n.snappingControls&&s&&o?y(g,{snappingOptions:o,view:s,visibleElements:n.snappingControlsElements}):void 0)]}_renderFeatureCount(){const{layout:e,messages:t,updateGraphics:{length:o}}=this,i=C(t.selectedCount,{count:o});return y("div",{"aria-label":i,class:M.featureCountBadge},y("span",{class:M.featureCountNumber},"vertical"===e?o:i))}_renderDuplicateButton(){if(!this.visibleElements.duplicateButton)return;const e=this.messages,t=this.updateGraphics.length>1?e.duplicateFeatures:e.duplicateFeature;return y("calcite-action",{bind:this,label:t,onclick:this._onDuplicateSelect,scale:"s",text:t,title:t},y("calcite-icon",{icon:"copy",scale:"s"}))}_renderDeleteButton(){const e=this.messages,t=this.updateGraphics.length>1?e.deleteFeatures:e.deleteFeature;return y("calcite-action",{bind:this,label:t,onclick:this.delete,scale:"s",text:t,title:t},y("calcite-icon",{icon:"trash",scale:"s"}))}_renderDefaultSelectionButton(){if(!this.viewModel.updateOnGraphicClick)return;const e=this.messages.selectFeature;return y("calcite-action",{active:"ready"===this.state,bind:this,label:e,onclick:this._activateDefaultSelectTool,scale:"s",text:e,title:e},y("calcite-icon",{icon:"cursor",scale:"s"}))}_renderSelectionToolbar(){if("2d"===this.view?.type&&this._selectionToolbar)return this._selectionToolbar.render()}_renderDrawButtons(){return this._effectiveAvailableCreateTools?.map((e=>{switch(e){case"point":return this._renderPointButton();case"polyline":return this._renderPolylineButton();case"polygon":return this._renderPolygonButton();case"rectangle":return this._renderRectangleButton();case"circle":return this._renderCircleButton();default:return}}))}_renderPointButton(){const e="point",t=this.messages.drawPoint;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"pin",scale:"s"}))}_renderPolygonButton(){const e="polygon",t=this.messages.drawPolygon;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"polygon",scale:"s"}))}_renderPolylineButton(){const e="polyline",t=this.messages.drawPolyline;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"line",scale:"s"}))}_renderCircleButton(){const e="circle",t=this.messages.drawCircle;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"circle",scale:"s"}))}_renderRectangleButton(){const e="rectangle",t=this.messages.drawRectangle;return y("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},y("calcite-icon",{icon:"rectangle",scale:"s"}))}_renderUndoRedoMenuButtons(){return[this._renderUndoButton(),this._renderRedoButton()]}_renderUndoButton(){const e=this.messages.undo;return y("calcite-action",{bind:this,disabled:!this.viewModel.canUndo(),label:e,onclick:this.undo,scale:"s",text:e,title:e},y("calcite-icon",{icon:b(this.container)?"redo":"undo",scale:"s"}))}_renderRedoButton(){const e=this.messages.redo;return y("calcite-action",{bind:this,disabled:!this.viewModel.canRedo(),label:e,onclick:this.redo,scale:"s",text:e,title:e},y("calcite-icon",{icon:b(this.container)?"undo":"redo",scale:"s"}))}_renderSettingsMenuButton(){const e=this.messagesCommon.settings;return y("calcite-action",{active:this._menuOpen,bind:this,"data-testid":"settings-menu-action",label:e,onclick:this._toggleMenu,scale:"s",text:e,title:e},y("calcite-icon",{icon:"gear",scale:"s"}))}_activateCreateTool(e){this.activeTool!==e?(this._selectionToolbar?.cancel(),this.create(e)):this.cancel()}_onCreateOperation(e){if("complete"!==e.state)return;const{creationMode:t}=this,{type:o}=e;if("create"===o){const{tool:o,graphic:i}=e,s=this._activeCreateOptions;this._activeCreateOptions=null,"continuous"===t?this.create(o,s):"update"===t&&this.update([i])}}_toggleMenu(){this._menuOpen=!this._menuOpen,this.scheduleRender()}_onDuplicateSelect(){const e=this.duplicate(),t=this.viewModel.activeTool;"transform"!==t&&"reshape"!==t||this.update(e,{tool:t})}_onSelectionOperationComplete(e){const{viewModel:{defaultUpdateOptions:t}}=this,{selection:o}=e;if(!e.aborted&&o.length){const e=t.tool,i=o.length>1&&"reshape"===e?"transform":e;this.update(o,{...t,tool:i})}this.notifyChange("state")}_activateDefaultSelectTool(){this.cancel(),this.view?.focus()}};e([a()],O.prototype,"activeTool",null),e([a({cast:e=>{if(!e?.length)return null;const t=new Set(["point","polyline","polygon","rectangle","circle"]);return e.filter((e=>t.has(e)))}})],O.prototype,"availableCreateTools",void 0),e([a({readOnly:!0})],O.prototype,"createGraphic",null),e([a()],O.prototype,"creationMode",void 0),e([a()],O.prototype,"defaultCreateOptions",null),e([a()],O.prototype,"defaultUpdateOptions",null),e([a()],O.prototype,"iconClass",void 0),e([a()],O.prototype,"icon",void 0),e([a()],O.prototype,"label",null),e([a()],O.prototype,"labelOptions",null),e([a()],O.prototype,"layer",null),e([a({type:["horizontal","vertical"]})],O.prototype,"layout",void 0),e([a(),f("esri/widgets/Sketch/t9n/Sketch")],O.prototype,"messages",void 0),e([a(),f("esri/t9n/common")],O.prototype,"messagesCommon",void 0),e([a()],O.prototype,"snappingOptions",null),e([a()],O.prototype,"state",null),e([a()],O.prototype,"tooltipOptions",null),e([a({readOnly:!0})],O.prototype,"updateGraphics",null),e([a()],O.prototype,"view",null),e([a(),w(["create","update","undo","redo"])],O.prototype,"viewModel",null),e([a({type:d,nonNullable:!0})],O.prototype,"visibleElements",void 0),e([a()],O.prototype,"_effectiveAvailableCreateTools",null),O=e([r("esri.widgets.Sketch")],O);const S=O;export{S as default};
|
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
|
3
3
|
See https://js.arcgis.com/4.28/esri/copyright.txt for details.
|
|
4
4
|
*/
|
|
5
|
-
import"../../intl.js";import"../../core/has.js";import
|
|
5
|
+
import"../../intl.js";import"../../core/has.js";import t from"../../core/Error.js";import{clamp as e}from"../../core/mathUtils.js";import{convertDateFormatToIntlOptions as n,formatTimestamp as o,formatTimeOnly as l,formatDateOnly as i,formatDate as r}from"../../intl/date.js";import{utc as a}from"../../time/timeZoneUtils.js";import{isString as u,isNumber as s}from"./dataUtils.js";import{DateTime as m,FixedOffsetZone as f,Interval as c}from"luxon";import{getLocale as d}from"../../intl/locale.js";const y=a,p={date:null,time:null,timeZoneOffset:null},h=new Map([["hours",3600],["minutes",60],["seconds",1],["deciseconds",.1],["centiseconds",.01],["milliseconds",.001]]),v="yyyy-MM-dd",S="TT";var M;!function(t){t.HM="HH:mm",t.HMS="HH:mm:ss",t.HMS_MS="HH:mm:ss.SSS"}(M||(M={}));const O=[M.HMS_MS,M.HMS,M.HM,S],w="latn",H=new Set(["date-only","time-only","timestamp-offset"]),j=t=>"valueAsDate"in t;function Z(t){return{locale:d(),numberingSystem:w,zone:t??y}}function g(t){return t?.isValid?t.toMillis():null}function x(t,e){return null===t?null:m.fromMillis(t,Z(e))}function V(t){if(null==t||!u(t)||""===t)return p;const e=m.fromISO(t,{setZone:!0});return{date:e.toFormat(v,Z()),time:e.toFormat(M.HMS_MS,Z()),timeZoneOffset:e.offset.toString()}}function I(t,e){if(null==t||!s(t)||isNaN(t))return p;const n=x(t,e);return n?{date:n.toFormat(v,Z(e)),time:n.toFormat(S,Z(e))}:p}function F(t){switch(t.type){case"date":default:return n("short-date-short-time");case"date-only":return n("short-date");case"time-only":return n("short-time");case"timestamp-offset":return{...n("short-date-short-time"),timeZone:void 0,timeZoneName:"short"}}}function T(t,e,n){if(!t||null==e)return null;switch(t.type){case"date":return r(e,n);case"date-only":return i(e,n);case"time-only":return l(e,n);case"timestamp-offset":return o(e,n);default:return null}}function C(t){const{dateComponent:e,timeComponent:n,timeZoneComponent:o,oldValue:l}=t;if(!e?.value||!n?.value)return null;const{year:i,month:r,day:u}=m.fromFormat(e.value,v),{hour:s,minute:c,second:d,millisecond:y}=b(n,a)??m.now(),p=V(l),h=null!=o?.value?parseInt(o.value,10):null!=p.timeZoneOffset?parseInt(p.timeZoneOffset,10):(new Date).getTimezoneOffset(),S=f.instance(h),M=m.fromObject({year:i,month:r,day:u,hour:s,minute:c,second:d,millisecond:y},{zone:S});return M.isValid?M.toISO({includeOffset:!0}):null}function D(t){const{dateComponent:e,timeComponent:n,timeZone:o,max:l,min:i,oldValue:r}=t,a=b(e,o);let u=!!t.applyRange;if(!a)return null;let s=null;if(null!=n?.value){const t=b(n,o),e=Date.now(),i=null!=l&&l<e?l:e,r=m.fromMillis(i,Z(o)),u=a||r,{year:f,month:c,day:d}=u,{hour:y,minute:p,second:h,millisecond:v}=t||r;s=u.set({year:f,month:c,day:d,hour:y,minute:p,second:h,millisecond:v})}else{const t=x(A({value:r??Date.now(),max:l,min:i}),o),{year:e,month:n,day:m}=a,{hour:f,minute:c,second:d,millisecond:y}=t;u=!0,s=a.set({year:e,month:n,day:m,hour:f,minute:c,second:d,millisecond:y})}if(!s.isValid)return null;const f=s.toMillis();return u?A({value:f,max:l,min:i}):f}function b(t,e){if(!t||null==t.value||Array.isArray(t.value))return null;let n=null;return n=j(t)?m.fromFormat(t.value,v,Z(e)):E(t.value),n?.isValid?n:null}function N(t){const{max:e,min:n,value:o}=t;return!isNaN(o)&&(!(null!=e&&o>e)&&!(null!=n&&o<n))}function A(t){const{max:n,min:o,value:l}=t;return null!=n&&null!=o?e(l,o,n):null!=n&&l>n?n:null!=o&&l<o?o:l}function z(e){if(!e)return"";const n=e.split(".").at(0);if(!n||n.length<1)throw new t("invalid time-only field",`Cannot parse valid time-only field value from ${e}`);const o=n.split(":"),l=new Array(3);for(let t=0;t<3;t++){const e=o.at(t)??"";l[t]=e.padStart(2,"0")}return l.join(":")}function U(t,e){switch(e){case"date":return t.getTime();case"date-only":return t.toISODate();case"time-only":return z(t.toISOTime(!0,!1));case"timestamp-offset":return t.toISOString(!1);default:return null}}function _(t){return!!t&&"object"==typeof t&&"getTime"in t&&"toISOString"in t&&"timeZone"in t}function k(t){return m.fromFormat(t,v)}function E(t){let e=null;return O.find((n=>(e=m.fromFormat(t,n),e.isValid))),e}function R(t){return m.fromISO(t)}function $(t){const{type:e,range:n,value:o}=t;if(null==o||!n)return!0;if("date"===e)return N({value:o,min:n.min,max:n.max});const{rawMax:l,rawMin:i}=n;if(!u(l)||!u(i)||!u(o))return!0;let r=null,a=null,s=null;switch(e){case"date-only":r=k(l),a=k(i),s=k(o);break;case"time-only":r=E(l),a=E(i),s=E(o);break;case"timestamp-offset":r=R(l),a=R(i),s=R(o)}return!(r?.isValid&&a?.isValid&&s?.isValid)||(c.fromDateTimes(a,r).contains(s)||a.valueOf()===s.valueOf()||r.valueOf()===s.valueOf())}export{M as TimeStampOffsetPattern,U as arcadeDateToFieldValue,A as clampValueToRange,x as createDateTimeFromFieldValue,H as dateFieldsWithStringFieldValue,k as dateOnlyToDateTime,$ as dateTimeIsInRange,g as dateTimeToFieldValue,v as defaultDatePattern,S as defaultTimePattern,Z as getDefaultLocaleOptions,C as getISOFieldValueFromDateComponents,F as getIntlOptionsForField,T as getLabelForDateFieldValue,b as getLocalDateTimeFromComponent,D as getUnixFieldValueFromDateComponents,_ as isArcadeDate,j as isCalciteDateComponent,z as normalizeTimeOnlyString,w as numberingSystem,V as prepareISOFieldValueForDateComponents,I as prepareUnixFieldValueForDateComponents,O as supportedTimeFormats,E as timeOnlyToDateTime,h as timeResolutionToStepMap,R as timestampOffsetToDateTime,N as valueIsInRange};
|