/*! All material copyright GeoScene, All Rights Reserved, unless otherwise specified.
See https://js.geoscene.cn/4.33/geoscene/copyright.txt for details.
v4.33.18 */
import{a as R}from"./RHVNFNB7.js";import"./CUXGWD2V.js";import{a as i}from"./HCX55DY5.js";import e from"./E5V5AKTV.js";import{a as $}from"./VK24LKXI.js";import{a as d}from"./LL7T22QC.js";import c from"./Y4DAIYBP.js";import a from"./DTE4O2DP.js";import{e as f}from"./LYMDZ73M.js";import"./MG6XDMQJ.js";import"./HITJFSBP.js";import{B as w,E as v,P as u,Q as l,R as b,S as m,U as y,a as p,j as g,k as o}from"./3VKC6PRK.js";export default $geoscene.t(([{when:D,watch:L},A,,,M])=>{var I=g`@layer{geoscene-basemap-gallery{display:block}}`,E=M(A),h={small:200,default:280,wide:420},c=class extends u{constructor(){super(...arguments),this.messages=$({}),this.viewModel=E(this),this._width=0,this._state="",this.activeBasemap=this.viewModel.activeBasemap,this.autoDestroyDisabled=!1,this.disabled=!1,this.headingLevel=2,this.icon="basemap",this.label="",this.position="bottom-left",this.source=this.viewModel.source,this.state=this.viewModel.state,this.geoscenePropertyChange=f()("activeBasemap","state"),this.geosceneReady=w()}static{this.properties={_width:16,_state:16,activeBasemap:1,autoDestroyDisabled:5,disabled:7,headingLevel:9,icon:1,label:1,messageOverrides:0,position:1,referenceElement:1,source:0,state:3}}static{this.shadowRootOptions=v}static{this.styles=I}async destroy(){await this.manager.destroy()}loaded(){this.manager.onLifecycle(()=>[D(()=>this.source,()=>{this.viewModel.loadSource()},{sync:!0,initial:!0}),L(()=>this.source.state,()=>{this._state=this.source.state},{sync:!0})]);let s=new ResizeObserver(t=>{for(let a of t)this._width=a.contentRect.width}),e=this.el.childElem;e&&s.observe(e)}_getRoundRobinIndex(s,e){return(s+e)%e}_handleKeyDown(s){let{key:e}=s;if(!["ArrowUp","ArrowDown","ArrowRight","ArrowLeft"].includes(e))return;s.preventDefault();let{items:t,activeBasemapIndex:a}=this.viewModel,r=e==="ArrowUp"||e==="ArrowLeft"?this._getRoundRobinIndex(Math.max(a-1,-1),t.length):this._getRoundRobinIndex(a+1,t.length),n=t.at(r);n?.state==="ready"&&(this.viewModel.activeBasemap=n.basemap)}render(){let s=this.source.state==="loading",e=this.disabled||this.state==="disabled",t=this.viewModel.items,a={[i.sourceLoading]:s,[d.disabled]:e,"geoscene-component":!0},r=this._width;r<=h.small||r>=h.wide?a[i.layoutGrid]=!0:r<h.default&&(a[i.narrowItems]=!0);let n=s?o`<div class=${l(i.loader)}></div>`:null,_=s?null:t.length>0?o`<div aria-disabled=${this.disabled??m} aria-label=${this.label??m} class=${l(i.itemContainer)} @keydown=${this._handleKeyDown} role=radiogroup>${t.map((x,B)=>o`<geoscene-basemap-gallery-item .disabled=${e} .item=${x} .itemIndex=${B} .viewModel=${this.viewModel} .messages=${this.messages}></geoscene-basemap-gallery-item>`)}</div>`:o`<div class=${l(d.empty)}>${R({level:this.headingLevel,children:this.messages.noBasemaps})}</div>`;return o`<div class=${l(p(i.base,d.widget,d.panel,a))} style=${b({"--geoscene-basemap-gallery-small":`${h.small}px`})}>${[n,_]}</div>`}};y("geoscene-basemap-gallery",c);return c},"core/reactiveUtils","widgets/BasemapGallery/BasemapGalleryViewModel",a,c,e)