UNPKG

@arcgis/map-components

Version:
76 lines (75 loc) 3.43 kB
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */ import { c as s } from "../../chunks/runtime.js"; import { css as r, html as a } from "lit"; import { watch as n } from "@arcgis/core/core/reactiveUtils.js"; import { LitElement as c, createEvent as e, nothing as l, safeClassMap as h } from "@arcgis/lumina"; import { usePropertyChange as g } from "@arcgis/lumina/controllers"; import { classes as m } from "@arcgis/toolkit/dom"; import { u } from "../../chunks/useT9n.js"; import { u as v } from "../../chunks/useView.js"; import { g as d } from "../../chunks/globalCss.js"; import { c as p } from "../../chunks/goTo.js"; const f = r`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);calcite-button{--calcite-offset-invert-focus: 1}display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{width:fit-content;height:fit-content}`; class w extends c { constructor() { super(...arguments), this.messages = u(), this.#i = null, this.#t = null, this.view = v(this), this.autoDestroyDisabled = !1, this.icon = "home", this.visualScale = "m", this.arcgisGo = e(), this.arcgisPropertyChange = g()("state", "viewpoint"), this.arcgisReady = e(); } static { this.properties = { view: 0, autoDestroyDisabled: 5, goToOverride: 0, icon: 1, label: 1, messageOverrides: 0, referenceElement: 1, visualScale: 1, state: 32, viewpoint: 0 }; } static { this.styles = f; } #i; #e; #t; get state() { return this.view?.ready ? this.#t ? "going-home" : "ready" : "disabled"; } get viewpoint() { return this.#i || this.#e; } set viewpoint(t) { this.#i = t; } async cancelGo() { this.#t?.abort(), this.#t = null; } async destroy() { await this.manager.destroy(); } async go() { if (!this.view?.ready) throw new Error("View is not ready. Cannot go to viewpoint."); if (!this.viewpoint) throw new Error("Cannot go to an undefined viewpoint."); this.cancelGo(), this.arcgisGo.emit(); const t = new AbortController(); this.#t = t; try { await this.view?.when(), await p({ target: this.viewpoint, options: { signal: t.signal } }, this.view, this.goToOverride); } catch { } this.#t = null; } async loaded() { this.manager.onLifecycle(() => [ n(() => this.view, (t) => { t?.when().then(() => { this.view === t && (this.#e = t.viewpoint.clone(), this.#i || this.arcgisPropertyChange.emit({ name: "viewpoint" })); }); }, { initial: !0, sync: !0 }) ]); } _go() { this.state === "going-home" ? this.cancelGo() : this.go(); } render() { const { messages: t, icon: o } = this, i = this.state === "going-home"; return a`<div class=${h(m("root", d.arcgisButton))}><calcite-button .disabled=${this.state === "disabled"} .iconStart=${i ? void 0 : o ?? void 0} kind=neutral .label=${t.componentLabel} @click=${this._go} .scale=${this.visualScale} .loading=${i} title=${(i ? t.cancel : t.title) ?? l}></calcite-button></div>`; } } s("arcgis-home", w); export { w as ArcgisHome };