UNPKG

@arcgis/coding-components

Version:
111 lines (110 loc) 6.21 kB
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */ import { c as p } from "../../chunks/runtime.js"; import { css as h, html as o } from "lit"; import { LitElement as g, createEvent as l, safeClassMap as m } from "@arcgis/lumina"; import { generateGuid as u } from "@arcgis/toolkit/string"; import { u as f } from "../../chunks/useT9n.js"; import { createRef as b, ref as _ } from "lit/directives/ref.js"; import { k as d } from "../../chunks/utils.js"; import { e as E } from "../../chunks/utilities.js"; import "@arcgis/core/portal/PortalItem.js"; import "@arcgis/core/WebMap.js"; import "@arcgis/core/WebScene.js"; import "@arcgis/core/layers/FeatureLayer.js"; import "@arcgis/core/applications/Components/arcadeEditorUtils.js"; import "@arcgis/toolkit/predicate"; import "vscode-languageserver-types"; import { rethrowError as r } from "@arcgis/toolkit/log"; import "@arcgis/core/core/Error.js"; import { d as n } from "../../chunks/language-defaults-base.js"; import "@arcgis/core/portal/Portal.js"; import { g as S, a as v, b as y, c as $ } from "../../chunks/sql-layer-defaults.js"; import { getSqlLayerDiagnosticService as x } from "../../chunks/sql-layer-mode.js"; const I = h`:host{height:100%}calcite-tooltip:not([calcite-hydrated])>*{display:none}`; class L extends g { constructor() { super(...arguments), this._codeEditorElt = b(), this._disposables = [], this._modelId = u(), this.messages = f(), this._preparing = !1, this._resolvedLanguage = n, this.sideActionBarExpanded = !1, this.script = "", this.hideSideBar = !1, this.openedSidePanel = "none", this.arcgisDiagnosticsChange = l({ bubbles: !1 }), this.arcgisScriptChange = l({ bubbles: !1 }); } static { this.properties = { _editorProfile: 16, _preparing: 16, _resolvedLanguage: 16, sideActionBarExpanded: 16, profile: 0, script: 1, hideSideBar: 5, messageOverrides: 0, openedSidePanel: 3, editorOptions: 0, editorInstance: 32 }; } static { this.styles = [I]; } get editorInstance() { return this._codeEditorElt.value?.editorInstance; } async setFocus() { await this._codeEditorElt.value?.setFocus(); } async load() { await this._updateDataModelDeps().catch(r(this)); } willUpdate(e) { e.has("profile") && this._updateDataModelDeps().catch(r(this)); } async loaded() { const e = x(); this._disposables.push(e.onDiagnosticsChange((t) => { t.uri.toString() === this._modelId && !this._preparing && this.arcgisDiagnosticsChange.emit(t.diagnostics); })); } disconnectedCallback() { for (super.disconnectedCallback(); this._disposables.length; ) this._disposables.pop()?.dispose(); S().forEach((e) => e.disposeForModel(this._modelId)); } async _updateDataModelDeps() { this._preparing = !0; try { const e = await v(this.profile); e !== this._resolvedLanguage && (y(this._resolvedLanguage)?.disposeForModel(this._modelId), this._resolvedLanguage = e); const t = $(this._resolvedLanguage); await t.setProfileForModel(this._modelId, this.profile, { locale: this.messages._t9nLocale }), this._editorProfile = t.getEditorProfileForModel(this._modelId); } catch { this._editorProfile = void 0, this._resolvedLanguage = n; } finally { this._preparing = !1; } } _toggleSideActionBarExpanded() { this.sideActionBarExpanded = !this.sideActionBarExpanded; } _toggleSidePanel(e) { this.openedSidePanel = this.openedSidePanel === e ? "none" : e; } _onCodeEditorValueChange(e) { e.stopPropagation(), this.script = e.detail, this.arcgisScriptChange.emit(e.detail); } async _onItemSelected(e) { e.stopPropagation(); const t = this._getSelectedTableVariable(e.detail); if (!t) { this._codeEditorElt.value?.insertText(e.detail).catch(r(this)); return; } await t.loadSource(); let i; const s = t.fieldInfos.filter((a) => a.type === "geometry" && !i ? (i = a.name, !0) : a.type !== "geometry").map((a) => a.name).filter(Boolean), c = `select ${s.length ? s.join(", ") : "*"} from ${t.snippet}`; E(this._codeEditorElt.value?.editorInstance, c, "replace", ""); } _getTablesVariable() { return this._editorProfile?.variables.find(d); } _getSelectedTableVariable(e) { const t = this._getTablesVariable(); if (d(t)) return t.tableVariables.find((i) => i.snippet === e); } render() { const e = this._getTablesVariable(), i = String(this.messages.placeholderexample ?? "Example: {sqlQueryExample}").replace("{sqlQueryExample}", "select field1, field2 from db.dataset"), s = `${this.messages.placeholder ?? "Start filtering data using SQL query syntax"} ${i}`; return o`<arcgis-code-editor-shell><arcgis-code-editor slot=editor .language=${this._resolvedLanguage} .modelId=${this._modelId} .value=${this.script ?? ""} @arcgisValueChange=${this._onCodeEditorValueChange} .editorOptions=${{ placeholder: s, ...this.editorOptions }} ${_(this._codeEditorElt)}></arcgis-code-editor>${!this.hideSideBar && o`<arcgis-editor-variables slot=side-panel .variable=${e} .heading=${this.messages.tables ?? "Tables"} .messageOverrides=${{ profileempty: this.messages.profileempty }} .closed=${this.openedSidePanel !== "variables"} class=${m(this.openedSidePanel === "variables" ? "" : "hidden")} .loading=${this._preparing} .modelId=${this._modelId} @arcgisInternalItemSelected=${this._onItemSelected} @arcgisInternalClosePanel=${() => { this.openedSidePanel = "none"; }} data-panel-name=none></arcgis-editor-variables><calcite-action-bar slot=side-action-bar .expanded=${this.sideActionBarExpanded} position=end @calciteActionBarToggle=${this._toggleSideActionBarExpanded}><calcite-action id=tables-action .text=${this.messages.tables ?? "Tables"} icon=table .active=${this.openedSidePanel === "variables"} data-panel-name=variables @click=${() => this._toggleSidePanel("variables")}></calcite-action>${!this.sideActionBarExpanded && o`<calcite-tooltip reference-element=tables-action><span>${this.messages.tables ?? "Tables"}</span></calcite-tooltip>` || ""}</calcite-action-bar>` || ""}</arcgis-code-editor-shell>`; } } p("arcgis-sql-layer-editor", L); export { L as ArcgisSqlLayerEditor };