@esri/solutions-components 1.1.0-next.20250806 → 1.1.0-next.20250808

package/dist/cdn/JVGQ4NFQ.js

@@ -0,0 +1,18 @@
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250808 */
+import{a as m}from"./TWRDYP6L.js";import"./I325H2EH.js";import{a as f,b as I,d as y}from"./5BILF3PR.js";import"./C6SWDNUF.js";import"./JNIPTN7Z.js";import{a as w}from"./KBSLLI3Y.js";import"./4L4JZKJ6.js";import"./TRGIVBAD.js";import{b as L}from"./MZB7PQ2R.js";import{A as p,B as c,h as _,i as a,k as l,n as h,q as g,w as o,x as d,y as u}from"./SHBMYV5S.js";import"./OIA7VIOQ.js";var v=_`@layer{/** @license
+ * Copyright 2025 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */:host{display:block}.map-layer-picker-container{width:100%;align-items:center}.map-layer-picker{position:relative;width:100%;display:inline-block}.padding-bottom-1{padding-bottom:1rem}.layer-picker-dropdown{height:100%;width:100%}.max-width-350{max-width:350px}.height-100{height:100%}.disabled{cursor:default!important;user-select:none;opacity:var(--calcite-opacity-disabled);pointer-events:none}.no-bottom-margin{--calcite-label-margin-bottom: 0px}.layer-picker-label-container{align-items:center;display:inline-flex;height:100%;padding-inline-start:1rem;padding-inline-end:1rem}.padding-start-1{padding-inline-start:1rem}.cursor-default{cursor:default}.popover-list{overflow:auto;width:250px}}`,b=class extends u{constructor(){super(...arguments),this.appearance="transparent",this.defaultLayerId="",this.display="inline-block",this.enabledLayerIds=[],this.isMobile=!1,this.showOnlyUpdatableLayers=!1,this.placeholderIcon="",this.selectedIds=[],this.scale="m",this.showTables=!1,this.showTablesDisabled=!1,this.showSingleLayerAsLabel=!1,this.type="select",this.showLayersListInPopover=!1,this.referenceElement="",this.force=!1,this._hasMultipleLayers=!0,this._hasValidLayers=!0,this._isDropdownOpen=!1,this.ids=[],this.selectedName="",this._translations=w({name:"map-layer-picker",blocking:!0}),this.defaultLayerHonored=!1,this._layerSelectElement=o(),this._layerComboboxElement=o(),this._skipEditCheck=!1,this._popover=o(),this.beforeLayerSelectionChange=h(),this.idsFound=h(),this.noLayersFound=h(),this.layerSelectionChange=h()}static{this.properties={appearance:1,defaultLayerId:1,display:1,enabledLayerIds:0,height:9,isMobile:5,mapView:0,showOnlyUpdatableLayers:5,placeholderIcon:1,selectedIds:0,scale:1,showTables:5,showTablesDisabled:5,showSingleLayerAsLabel:5,type:1,showLayersListInPopover:5,referenceElement:1,force:16,_hasMultipleLayers:16,_hasValidLayers:16,_isDropdownOpen:16,ids:16,selectedName:16,_translations:16}}static{this.styles=v}static{this.shadowRootOptions=g}willUpdate(e){e.has("mapView")&&this.hasUpdated&&this.mapViewWatchHandler(),e.has("type")&&(this._layerElement=this.type==="select"?this._layerSelectElement:this._layerComboboxElement),e.has("selectedIds")&&this.hasUpdated&&this.mapView&&(async()=>{let t=await y(this.mapView,this.selectedIds[0]);this.selectedName=t?.title??""})(),e.has("enabledLayerIds")&&this.hasUpdated&&this.enabledLayerIdsWatchHandler()}async enabledLayerIdsWatchHandler(){let e=this.selectedIds.length>0&&!this.enabledLayerIds.includes(this.selectedIds[0]),t=this.enabledLayerIds.some(s=>!this.ids.includes(s));e?this.mapViewWatchHandler():t&&this._setLayers(),this._hasMultipleLayers=this.enabledLayerIds.length>1}async mapViewWatchHandler(){await this._setLayers(),this.ids?.length>0?(this._hasValidLayers=!0,this._hasMultipleLayers=this.ids.length>1,await this._setSelectedLayer(this.ids[0])):(this._hasValidLayers=!1,this.noLayersFound.emit())}async setLayerById(e,t=!1){this._skipEditCheck=t,!t||t&&e!==this.selectedIds[0]?this._setSelectedLayer(e):t&&e===this.selectedIds[0]&&(this.force=!0,setTimeout(()=>{this.force=!1},10)),this._skipEditCheck=!1}async setLayerByIds(e,t=!1){this._skipEditCheck=t,this._layerSelectionChange(e),this._skipEditCheck=!1}async updateLayer(){await this._setSelectedLayer(this.ids[0])}async load(){await this._setLayers(),this.ids?.length>0?(this._hasValidLayers=!0,this._hasMultipleLayers=this.ids.length>1,await this._setSelectedLayer(this.ids[0])):(this._hasValidLayers=!1,this.noLayersFound.emit())}render(){let e="map-layer-picker",t=this.height&&this.height>0&&!this.showLayersListInPopover?{height:`${this.height.toString()}px`}:{};return t={...t,display:this.display},a`<div class="map-layer-picker-container" style=${c(t)}><div class="map-layer-picker" style=${c(t)}>${this._hasValidLayers?!this._hasMultipleLayers&&this.showSingleLayerAsLabel?this._getSingleLayerPlaceholder():this.type==="combobox"?this._getCombobox(e):this.type==="select"?this._getSelect(e):this.showLayersListInPopover?this._getMapLayerPopOver():this._getDropdown(e):this._getInvalidPlaceholder()}</div></div>`}loaded(){if(this.ids?.length>0||this.selectedIds?.length===1){let e=this.selectedIds.length===1?this.selectedIds[0]:this.ids[0];this.type==="select"?this._layerElement.value&&(this._layerElement.value.value=e):this.type==="dropdown"&&(this.selectedName=this._layerNameHash&&Object.keys(this._layerNameHash).indexOf(e)>-1?this._layerNameHash[e].name:this._tableNameHash&&Object.keys(this._tableNameHash).indexOf(e)>-1?this._tableNameHash[e].name:"")}this._popover.value?.addEventListener("calcitePopoverOpen",()=>{this.el.querySelector("calcite-dropdown-item[selected]")?.setFocus()})}_getMapLayerPopOver(){let e=this.height&&this.height>0?{"max-height":`${this.height.toString()}px`}:{};return a`<calcite-popover auto-close focus-trap-disabled .label=${this.referenceElement} placement=left .referenceElement=${this.referenceElement} scale=s ${d(this._popover)}><div class=popover-list style=${c(e)}>${this._getMapLayerOptions()}</div></calcite-popover>`}_getInvalidPlaceholder(){return a`<div><calcite-notice class="height-100" icon=exclamation-mark-triangle id=no-valid-layers kind=danger open><div slot=message>${this._translations.noLayersFound}</div></calcite-notice><calcite-tooltip .label=${this._translations.enableEditUpdate} placement=bottom reference-element=no-valid-layers><span>${this._translations.enableEditUpdate}</span></calcite-tooltip></div>`}_getSingleLayerPlaceholder(){let e=this._getItemTypeIcon();return a`<div class="layer-picker-label-container cursor-default"><calcite-icon .icon=${e} scale=s></calcite-icon><calcite-label class="no-bottom-margin padding-start-1">${this.selectedName}</calcite-label></div>`}_getSelect(e){return a`<calcite-select id=${e??l} label @calciteSelectChange=${()=>this._layerSelectionChange()} .scale=${this.scale} ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-select>`}_getCombobox(e){return a`<calcite-combobox clear-disabled id=${e??l} label @calciteComboboxChange=${()=>this._layerSelectionChange()} .placeholderIcon=${this.placeholderIcon} .scale=${this.scale} selection-mode=single ${d(this._layerElement)}>${this._getMapLayerOptions()}</calcite-combobox>`}_getDropdown(e){return a`<calcite-dropdown class="layer-picker-dropdown" @calciteDropdownBeforeClose=${()=>this._isDropdownOpen=!1} @calciteDropdownBeforeOpen=${()=>this._isDropdownOpen=!0}>${this.isMobile?this._getDropdownButton():this._getActionDropdownButton(e)}<calcite-dropdown-group selection-mode=single>${this._getMapLayerOptions()}</calcite-dropdown-group></calcite-dropdown>`}_getActionDropdownButton(e){return a`<calcite-action id=${e??l} slot=trigger text>${this._getDropdownButton()}</calcite-action>`}_getDropdownButton(){let e=this._getItemTypeIcon(),t=this.isMobile?"":"max-width-350",s=this.isMobile?"trigger":"",i=this._isDropdownOpen?"chevron-up":"chevron-down";return a`<calcite-button alignment=icon-end-space-between .appearance=${this.appearance} class=${p(t)} .iconEnd=${i} .iconStart=${e} kind=neutral slot=${s??l} width=full><div>${this.selectedName}</div></calcite-button>`}_getItemTypeIcon(){let e="layers";if(this.selectedIds.length>0&&this._layerNameHash){let t=this.selectedIds[0];e=Object.keys(this._layerNameHash).indexOf(t)>-1?"layers":"table"}return e}_getMapLayerOptions(){return this.ids.reduce((e,t)=>(this._validLayer(t)?e.push(this._getItem(t,"layer")):this._validTable(t)&&e.push(this._getItem(t,"table")),e),[])}_getItem(e,t){let s=t==="layer"&&this._layerNameHash?this._layerNameHash[e]:this._tableNameHash?this._tableNameHash[e]:void 0,i=this.showOnlyUpdatableLayers?s&&!s.supportsUpdate:!1,r=s?.name,n=this.selectedIds.indexOf(e)>-1;return this.type==="combobox"?a`<calcite-combobox-item .disabled=${i} .selected=${n} .textLabel=${r} .value=${e}></calcite-combobox-item>`:this.type==="select"?a`<calcite-option .disabled=${i} .label=${r} .selected=${n} .value=${e}></calcite-option>`:this.force&&n||!this.force?a`<calcite-dropdown-group class=${p(i?"disabled":"")} id=${r??l} .selectionMode=${i?"none":"single"}><calcite-dropdown-item .disabled=${!!(t==="table"&&this.showTablesDisabled)} .iconStart=${t} @click=${i?void 0:()=>void this._setSelectedLayer(e)} .selected=${n}>${r}</calcite-dropdown-item></calcite-dropdown-group>`:null}async _setSelectedLayer(e){if(e!==this.selectedIds[0]){let t;if(this.defaultLayerId&&!this.defaultLayerHonored&&(t=this._getLayerFromHash(this.defaultLayerId),this.defaultLayerHonored=t!==void 0,e=this.defaultLayerHonored?this.defaultLayerId:e),t=t||this._getLayerFromHash(e),!this._skipEditCheck&&this.beforeLayerSelectionChange.emit({currentId:this.selectedIds[0],newId:e,ref:this.el}).defaultPrevented)return;this.selectedName=t?.name,this.selectedIds=[e],this._popover.value&&(this._popover.value.open=!1),this.layerSelectionChange.emit(this.selectedIds)}else{let t=this.mapView&&await y(this.mapView,this.selectedIds[0]);this.selectedName=t?.title||""}}_getLayerFromHash(e){return this._layerNameHash&&Object.keys(this._layerNameHash).indexOf(e)>-1?this._layerNameHash[e]:this._tableNameHash&&Object.keys(this._tableNameHash).indexOf(e)>-1?this._tableNameHash[e]:void 0}async _setLayers(){if(this.mapView){await this._initLayerTableHash();let e=[];this._layerNameHash&&(e=this.showOnlyUpdatableLayers?this._getEditableIds(this._layerNameHash):Object.keys(this._layerNameHash));let t=[];this._tableNameHash&&(t=this.showTables?this.showOnlyUpdatableLayers?this._getEditableIds(this._tableNameHash):Object.keys(this._tableNameHash):[]),this.ids=[...e.reverse().filter(s=>this.enabledLayerIds?.length>0?this.enabledLayerIds.reverse().indexOf(s)>-1:!0),...t.reverse().filter(s=>this.enabledLayerIds?.length>0?this.enabledLayerIds.reverse().indexOf(s)>-1:!0)],this.idsFound.emit({layerIds:e,tableIds:t})}}_getEditableIds(e){return Object.keys(e).filter(t=>e[t].supportsUpdate)}async _initLayerTableHash(){this._layerNameHash=this.mapView&&await f(this.mapView,this.showOnlyUpdatableLayers),this._tableNameHash=this.showTables&&this.mapView?await I(this.mapView,this.showOnlyUpdatableLayers):{}}_validLayer(e){let t=this._layerNameHash&&this._layerNameHash[e]?.name;return t!==void 0&&Object.keys(m.managedLayers).indexOf(t)<0&&(this.enabledLayerIds?.length>0?this.enabledLayerIds.indexOf(e)>-1:!0)}_validTable(e){let t=this._tableNameHash&&this._tableNameHash[e]?.name,s=t&&this.showTables;return s?m.managedTables.indexOf(t)<0&&(this.enabledLayerIds?.length>0?this.enabledLayerIds.indexOf(e)>-1:!0):s!==void 0}_layerSelectionChange(e){if(this._layerElement.value){let t=e||(Array.isArray(this._layerElement.value.value)?this._layerElement.value.value:[this._layerElement.value.value]);if(JSON.stringify(t)!==JSON.stringify([""])){if(!this._skipEditCheck&&this.beforeLayerSelectionChange.emit({currentIds:this.selectedIds,newIds:t,ref:this.el}).defaultPrevented)return;this.selectedIds=t,this.layerSelectionChange.emit(this.selectedIds)}}}};L("map-layer-picker",b);export{b as MapLayerPicker};