@arcgis/coding-components 4.30.0 → 4.31.0-next.10

package/dist/components/arcade-variables.js

@@ -1,11 +1,11 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
-import { u as useControllerManager } from './chunk-2CDDVOQU.js';
-import { e as setFocusOnElement, d as createFilterExpression } from './index2.js';
+import { u as useControllerManager } from './chunk-3IUJHIAA.js';
+import { r as setFocusOnElement, d as createFilterExpression } from './index2.js';
 import { b as arcadeDefaults } from './arcade-defaults.js';
 import { u as useT9n } from './useT9n.js';
 import "@esri/calcite-components/dist/components/calcite-flow-item.js";
@@ -135,7 +135,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
                 });
                 loading = true;
             }
-            return (h("calcite-flow-item", { heading: this.messages.profilevariables, description: collection.breadcrumb, beforeBack: this._beforeBack, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-action", { slot: "header-actions-end", text: this.messages.backtotop ?? "Back to top", scale: "m", hidden: topPanel, icon: "chevrons-left", iconFlipRtl: true, onClick: this._backToTop }), h("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), loading ? (h("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "Loading" })) : (h("calcite-list", null, this.renderEditorVariables(collection)))));
+            return (h("calcite-flow-item", { heading: this.messages.profilevariables, description: collection.breadcrumb, beforeBack: this._beforeBack, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-action", { slot: "header-actions-end", text: this.messages.backtotop ?? "", scale: "m", hidden: topPanel, icon: "chevrons-left", iconFlipRtl: true, onClick: this._backToTop }), h("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), loading ? (h("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "" })) : (h("calcite-list", null, this.renderEditorVariables(collection)))));
         };
     }
     renderEditorVariables(collection) {
@@ -143,7 +143,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         const filterExpression = createFilterExpression(this._filterValue);
         const filteredVariables = collection.variables.filter((variable) => variable.passFilter(filterExpression));
         if (!filteredVariables.length) {
-            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems);
         }
         return filteredVariables.map((variable) => this.renderEditorVariable(variable));
     }
@@ -159,7 +159,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     render() {
         const profile = arcadeDefaults.getEditorProfileForModel(this.modelId ?? "");
         if (!this.loading && !profile?.variables.length) {
-            return (h("calcite-flow", null, h("calcite-flow-item", { heading: this.messages.profilevariables, closable: true, onCalciteFlowItemClose: this._emitClose }, h("div", { class: "notice-container" }, this.messages.noprofilevariablesmessage ?? ""))));
+            return (h("calcite-flow", null, h("calcite-flow-item", { heading: this.messages.profilevariables, closable: true, onCalciteFlowItemClose: this._emitClose }, h("div", { class: "notice-container" }, this.messages.noprofilevariablesmessage))));
         }
         return (h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, this.collectionBasedVariableRenderer(profile, true)(), this._flowItemRenderers.map((renderer) => renderer())));
     }

package/dist/components/arcgis-arcade-editor.js

@@ -1,20 +1,19 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Fragment, Host } from '@stencil/core/internal/client';
 import { KeyCode } from 'monaco-editor';
-import { d as defineCustomElement$5, e as executeScript, D as DevelopersWebSitePath } from './arcade-results.js';
-import { u as updateThemeColors, c as colorRulesKeys, s as setupMonacoEnvironment, a as getArcadeDiagnosticService } from './arcade-contribution.js';
-import { u as useControllerManager } from './chunk-2CDDVOQU.js';
-import { D as Deferred, p as generateGuid, q as getElementTheme } from './index2.js';
-import { b as arcadeDefaults } from './arcade-defaults.js';
+import { d as defineCustomElement$6, e as executeScript, D as DevelopersWebSitePath } from './arcade-results.js';
+import { d as defineCustomElement$3, u as updateThemeColors, c as colorRulesKeys, s as setupMonacoEnvironment } from './code-editor.js';
+import { u as useControllerManager, g as getSet } from './chunk-3IUJHIAA.js';
+import { D as Deferred, g as generateGuid, e as getElementTheme } from './index2.js';
+import { b as arcadeDefaults, g as getArcadeDiagnosticService } from './arcade-defaults.js';
 import { u as useT9n } from './useT9n.js';
-import { d as defineCustomElement$6 } from './arcade-api.js';
-import { d as defineCustomElement$4 } from './arcade-suggestions.js';
-import { d as defineCustomElement$3 } from './arcade-variables.js';
-import { d as defineCustomElement$2 } from './code-editor.js';
+import { d as defineCustomElement$5 } from './arcade-suggestions.js';
+import { d as defineCustomElement$4 } from './arcade-variables.js';
+import { d as defineCustomElement$2 } from './language-api-panel.js';
 import "@esri/calcite-components/dist/components/calcite-action-bar.js";
 import "@esri/calcite-components/dist/components/calcite-action-group.js";
 import "@esri/calcite-components/dist/components/calcite-action.js";
@@ -24,7 +23,7 @@ import { getArcgisAssetPath as getAssetPath } from "./arcgis-assets.js";
 const arcadeEditorCss = "arcgis-arcade-editor{display:flex;flex-direction:column;position:relative;overflow:hidden;border:1px solid var(--calcite-color-border-3);box-sizing:border-box;background-color:var(--calcite-color-foreground-1);height:100%}arcgis-arcade-editor .flex-adjustable{flex:1 1 auto;overflow:hidden}arcgis-arcade-editor .flex-panel{flex:1 0 auto}arcgis-arcade-editor .position-relative{position:relative}arcgis-arcade-editor .flex-row{display:flex;flex-direction:row;overflow:hidden}arcgis-arcade-editor .flex-column{display:flex;flex-direction:column;overflow:hidden}arcgis-arcade-editor .border-inline-start{border-inline-start:1px solid var(--calcite-color-border-3);box-sizing:border-box}arcgis-arcade-editor .border-inline-end{border-inline-end:1px solid var(--calcite-color-border-3);box-sizing:border-box}arcgis-arcade-editor .sticky{position:sticky;top:0px;z-index:10}arcgis-arcade-editor .notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1);text-align:center}arcgis-arcade-editor .side-action-bar{max-width:25%}arcgis-arcade-editor .side-panel{max-width:45%;width:600px}arcgis-arcade-editor .side-panel calcite-flow{height:100%}arcgis-arcade-editor .main-action-bar{border-bottom:1px solid var(--calcite-color-border-3);flex:0 0 auto}arcgis-arcade-editor .main-action-bar calcite-action-group{padding-inline-end:var(--calcite-spacing-sm)}arcgis-arcade-editor .main-action-bar calcite-action-group calcite-action{padding-inline-end:var(--calcite-spacing-sm)}arcgis-arcade-editor .main-action-bar calcite-action-group calcite-action:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}arcgis-arcade-editor .main-action-bar calcite-action-group:last-child{border-inline-end-width:0px}arcgis-arcade-editor .main-action-bar calcite-action-group:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}arcgis-arcade-editor arcgis-arcade-results{border-top:1px solid var(--calcite-color-border-3);box-sizing:border-box;max-height:50%;min-height:50%;margin-bottom:-1px}arcgis-arcade-editor calcite-flow [slot=footer]{word-break:break-word}";
 const ArcgisArcadeEditorStyle0 = arcadeEditorCss;
 
-const __cmpMeta = [0,"arcgis-arcade-editor",{"profile":[1040],"script":[1025],"testData":[1040],"suggestions":[1040],"snippets":[1040],"hideDocumentationActions":[1028,"hide-documentation-actions"],"hideSideBar":[1028,"hide-side-bar"],"sideActionBarExpanded":[1540,"side-action-bar-expanded"],"openedSidePanel":[1537,"opened-side-panel"],"editorOptions":[1040],"editorInstance":[1040],"messages":[32],"_preparingProfile":[32],"_editorProfile":[32],"_showExecutionPanel":[32],"_resultPanel":[32],"_executingScript":[32],"_consoleLogs":[32],"_executionResult":[32],"getScript":[64],"setFocus":[64],"getEditorInstance":[64],"getTestResult":[64],"updateThemeColors":[64]},undefined,{"profile":["_profileChanged"],"testData":["_testDataChanged"],"snippets":["_snippetChanged"]}];
+const __cmpMeta = [0,"arcgis-arcade-editor",{"profile":[1040],"script":[1025],"testData":[1040],"suggestions":[1040],"snippets":[1040],"hideDocumentationActions":[1028,"hide-documentation-actions"],"hideSideBar":[1028,"hide-side-bar"],"sideActionBarExpanded":[1540,"side-action-bar-expanded"],"openedSidePanel":[1537,"opened-side-panel"],"editorOptions":[1040],"editorInstance":[1040],"_preparingArcade":[32],"_editorProfile":[32],"_apiLibrary":[32],"_showExecutionPanel":[32],"_resultPanel":[32],"_executingScript":[32],"_consoleLogs":[32],"_executionResult":[32],"messages":[32],"getScript":[64],"setFocus":[64],"getEditorInstance":[64],"getTestResult":[64],"updateThemeColors":[64]},undefined,{"messages":["_messagesChanged"],"profile":["_profileChanged"],"testData":["_testDataChanged"],"snippets":["_snippetChanged"]}];
 const ArcgisArcadeEditor$1 = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeEditor extends HTMLElement {
     connectedCallback() { this.manager._connectedCallback(); }
     constructor() {
@@ -52,7 +51,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
             this._executingScript = true;
             this._consoleLogs = [];
             setTimeout(() => void (async () => {
-                const script = await this._codeEditorElt?.getValue();
+                const script = this._codeEditorElt?.value;
                 this._executionResult = await executeScript(editorProfile.definition, script, testContext, (log) => setTimeout(() => (this._consoleLogs = [...this._consoleLogs, log]), 0));
                 this._executingScript = false;
             })(), 0);
@@ -85,14 +84,15 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this._insertAsText = (e) => void this._codeEditorElt?.insertText(e.detail).catch(console.error);
         this._onResultPanelChange = (e) => void (this._resultPanel = e.detail);
         this._onExecutionPanelClose = () => void (this._showExecutionPanel = false);
-        this.messages = useT9n();
-        this._preparingProfile = false;
+        this._preparingArcade = false;
         this._editorProfile = undefined;
+        this._apiLibrary = undefined;
         this._showExecutionPanel = false;
         this._resultPanel = "output";
         this._executingScript = false;
         this._consoleLogs = [];
         this._executionResult = undefined;
+        this.messages = useT9n();
         this.profile = undefined;
         this.script = "";
         this.testData = undefined;
@@ -103,13 +103,16 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this.sideActionBarExpanded = false;
         this.openedSidePanel = "none";
         this.editorOptions = undefined;
-        this.editorInstance = this.manager.getSet(undefined, {
+        this.editorInstance = getSet(undefined, {
             get: () => this._codeEditorElt?.editorInstance,
             set: "ignore",
         });
     }
+    _messagesChanged() {
+        this._updateArcadeDefaults().catch(console.error);
+    }
     _profileChanged() {
-        this._updateEditorProfile().catch(console.error);
+        this._updateArcadeDefaults().catch(console.error);
     }
     _testDataChanged() {
         if (!this._showExecutionPanel) {
@@ -158,7 +161,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
             return { type: "error", value: "Missing editor profile", error: null };
         }
         await this._componentReadyDefer.promise;
-        const script = await this._codeEditorElt?.getValue();
+        const script = this._codeEditorElt?.value;
         return await executeScript(editorProfile.definition, script, this.testData);
     }
     /**
@@ -191,9 +194,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         // However, we need to setup the environment before the code editor is instantiated because
         // we need to access the arcade language service to get the api library.
         setupMonacoEnvironment(assetsPath);
-        await this._updateEditorProfile();
-        // The profile has to be refreshed on locale change
-        this.manager.watch("messages", () => void this._updateEditorProfile().catch(console.error));
+        await this._updateArcadeDefaults();
     }
     async componentDidLoad() {
         // Mark on component as ready.
@@ -202,7 +203,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         // Start listening to the validation diagnostics.
         // We are doing this as late as possible
         const diagnosticsService = await getArcadeDiagnosticService();
-        this._disposables.push(diagnosticsService.onDiagnosticsChange((event) => !this._preparingProfile && this.arcgisDiagnosticsChange.emit(event.diagnostics)));
+        this._disposables.push(diagnosticsService.onDiagnosticsChange((event) => !this._preparingArcade && this.arcgisDiagnosticsChange.emit(event.diagnostics)));
         // Get editor instance and add action
         this.editorInstance?.addAction({
             // An unique identifier for the action.
@@ -221,35 +222,31 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     }
     disconnectedCallback() {
         this.manager._disconnectedCallback();
-        arcadeDefaults.disposeApiContextForModel(this._modelId);
-        arcadeDefaults.disposeEditorProfileForModel(this._modelId);
+        arcadeDefaults.disposeForModel(this._modelId);
         while (this._disposables.length) {
             this._disposables.pop()?.dispose();
         }
     }
     // #endregion
     // #region Private methods API
-    async _updateEditorProfile() {
-        // The goal is to
-        // - convert the runtime profile into a specialized instance that will serve the UI better.
-        // - extract the language service  profile that is specialized for completion and validation
-        this._preparingProfile = true;
+    async _updateArcadeDefaults() {
+        // The profile definition or the locale has changed.
+        // Ask the arcade defaults to prepare the profile for the model and to download the api library.
+        this._preparingArcade = true;
         try {
-            // Set a new profile for the model using the profile definition and the locale.
             await arcadeDefaults.setProfileForModel(this._modelId, this.profile, {
                 locale: this.messages._t9nLocale,
                 snippets: this.snippets,
             });
-            // Get the corresponding editor profile for the model.
-            // The editor profile contains the specialized profile for the UI.
             this._editorProfile = arcadeDefaults.getEditorProfileForModel(this._modelId);
+            this._apiLibrary = await arcadeDefaults.getApiLibrary(this._modelId);
         }
         catch {
             this._editorProfile = undefined;
         }
         finally {
             this._editorProfilePromise = Promise.resolve(this._editorProfile);
-            this._preparingProfile = false;
+            this._preparingArcade = false;
         }
     }
     // #endregion
@@ -258,17 +255,17 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         if (!this.testData) {
             return null;
         }
-        return (h("calcite-action-bar", { class: "main-action-bar", layout: "horizontal", scale: "s", expanded: true, "expand-disabled": true }, h("calcite-action-group", { scale: "s" }, h("calcite-action", { text: this.messages.run ?? "Run", "text-enabled": true, icon: "play", scale: "s", loading: this._preparingProfile, onClick: this._executeScript }), this._executionResult ? (h("calcite-action", { text: this.messages.lastresults ?? "Last results", active: this._showExecutionPanel, "text-enabled": true, icon: "access-string-results", iconFlipRtl: true, scale: "s", onClick: this._toggleShowExecutionPanel })) : null)));
+        return (h("calcite-action-bar", { class: "main-action-bar", layout: "horizontal", scale: "s", expanded: true, "expand-disabled": true }, h("calcite-action-group", { scale: "s" }, h("calcite-action", { text: this.messages.run ?? "", textEnabled: true, icon: "play", scale: "s", loading: this._preparingArcade, onClick: () => void this._executeScript().catch(console.error) }), this._executionResult ? (h("calcite-action", { text: this.messages.lastresults ?? "", active: this._showExecutionPanel, textEnabled: true, icon: "access-string-results", iconFlipRtl: true, scale: "s", onClick: this._toggleShowExecutionPanel })) : null)));
     }
     //#endregion
     //#region Render Main Panel
     renderMainPanel() {
-        return (h("arcgis-code-editor", { class: "flex-adjustable", language: arcadeDefaults.languageId, value: this.script ?? "", modelId: this._modelId, options: this.editorOptions, onArcgisValueChange: this._onCodeEditorValueChange, ref: (e) => (this._codeEditorElt = e) }));
+        return (h("arcgis-code-editor", { class: "flex-adjustable", editorOptions: this.editorOptions, language: arcadeDefaults.languageId, value: this.script ?? "", modelId: this._modelId, onArcgisValueChange: this._onCodeEditorValueChange, ref: (e) => (this._codeEditorElt = e) }));
     }
     //#endregion
     //#region Rendering the Action Bar
-    renderAction({ id, label, icon, active, panelName, onClick = this._toggleSidePanel, }) {
-        return (h(Fragment, null, h("calcite-action", { id: id, text: label, icon: icon, active: active, onClick: onClick, "data-panel-name": panelName }), !this.sideActionBarExpanded && (h("calcite-tooltip", { label: label, "reference-element": id }, h("span", null, label)))));
+    renderAction({ id, label, icon, active, panelName, iconFlipRtl = false, onClick = this._toggleSidePanel, }) {
+        return (h(Fragment, null, h("calcite-action", { id: id, text: label, icon: icon, active: active, onClick: onClick, "data-panel-name": panelName, iconFlipRtl: iconFlipRtl }), !this.sideActionBarExpanded && (h("calcite-tooltip", { "reference-element": id }, h("span", null, label)))));
     }
     renderSideActionBar() {
         if (this.hideSideBar) {
@@ -276,20 +273,20 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         }
         return (h("calcite-action-bar", { class: "side-action-bar border-inline-start", expanded: !!this.sideActionBarExpanded, position: "end", onCalciteActionBarToggle: this._toggleSideActionBarExpanded }, h("calcite-action-group", null, this.renderAction({
             id: "profile-variables-action",
-            label: this.messages.profilevariables ?? "Profile variables",
+            label: this.messages.profilevariables ?? "",
             icon: "profile-variables",
             active: this.openedSidePanel === "variables",
             panelName: "variables",
         }), this.renderAction({
             id: "function-action",
-            label: this.messages.constantsandfunctions ?? "Constants and functions",
+            label: this.messages.constantsandfunctions ?? "",
             icon: "function",
             active: this.openedSidePanel === "api",
             panelName: "api",
         }), this.suggestions?.length
             ? this.renderAction({
                 id: "suggestions-action",
-                label: this.messages.suggestions ?? "Suggestions",
+                label: this.messages.suggestions ?? "",
                 icon: "lightbulb",
                 active: this.openedSidePanel === "suggestions",
                 panelName: "suggestions",
@@ -298,10 +295,11 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
             ? null
             : this.renderAction({
                 id: "developer-website-action",
-                label: this.messages.help ?? "Help",
+                label: this.messages.help ?? "",
                 icon: "question",
                 active: false,
                 panelName: "none",
+                iconFlipRtl: true,
                 onClick: this._openArcadeHelp,
             }))));
     }
@@ -313,9 +311,9 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         }
         switch (this.openedSidePanel) {
             case "api":
-                return (h("arcgis-arcade-api", { class: "side-panel flex-panel border-inline-start", modelId: this._modelId, hideDocumentationActions: this.hideDocumentationActions, onArcgisItemSelected: this._insertAsSnippet, onArcgisClose: this._toggleSidePanel, "data-panel-name": "none" }));
+                return (h("arcgis-language-api-panel", { class: "side-panel flex-panel border-inline-start", loading: this._preparingArcade, apiLibrary: this._apiLibrary, hideDocumentationActions: this.hideDocumentationActions, onArcgisItemSelected: this._insertAsSnippet, onArcgisClose: this._toggleSidePanel, "data-panel-name": "none" }));
             case "variables":
-                return (h("arcgis-arcade-variables", { class: "side-panel flex-panel border-inline-start", loading: this._preparingProfile, modelId: this._modelId, onArcgisItemSelected: this._insertAsText, onArcgisClose: this._toggleSidePanel, "data-panel-name": "none" }));
+                return (h("arcgis-arcade-variables", { class: "side-panel flex-panel border-inline-start", loading: this._preparingArcade, modelId: this._modelId, onArcgisItemSelected: this._insertAsText, onArcgisClose: this._toggleSidePanel, "data-panel-name": "none" }));
             case "suggestions":
                 return (h("arcgis-arcade-suggestions", { class: "side-panel flex-panel border-inline-start", suggestions: this.suggestions, onArcgisItemSelected: this._insertAsText, onArcgisClose: this._toggleSidePanel, "data-panel-name": "none" }));
             default:
@@ -333,11 +331,12 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     //#endregion
     //#region Render
     render() {
-        return (h(Host, { key: 'd17f808be4ff15d1b6cfddee64fbd555bccc9a5e' }, this.renderMainActionBar(), h("div", { key: 'a4f02c0e2de9c20c494cc486ce24c2a3e57773b5', class: "flex-row flex-adjustable" }, h("div", { key: 'b4017cfa9a04be98fde74c60a6f1d4ba61545267', class: "flex-column flex-adjustable" }, this.renderMainPanel(), this.renderResultsPanel()), this.renderSidePanel(), this.renderSideActionBar())));
+        return (h(Host, { key: '024ff08c3853fc24aa904de8b498dc99219661be' }, this.renderMainActionBar(), h("div", { key: 'eae67c4446cc0f440008deffbdeef933fd48ee79', class: "flex-row flex-adjustable" }, h("div", { key: '7c508b4d7410ec6e4440e9946fbe3a9f5318b5c3', class: "flex-column flex-adjustable" }, this.renderMainPanel(), this.renderResultsPanel()), this.renderSidePanel(), this.renderSideActionBar())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }
     static get watchers() { return {
+        "messages": ["_messagesChanged"],
         "profile": ["_profileChanged"],
         "testData": ["_testDataChanged"],
         "snippets": ["_snippetChanged"]
@@ -348,34 +347,34 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["arcgis-arcade-editor", "arcgis-arcade-api", "arcgis-arcade-results", "arcgis-arcade-suggestions", "arcgis-arcade-variables", "arcgis-code-editor"];
+    const components = ["arcgis-arcade-editor", "arcgis-arcade-results", "arcgis-arcade-suggestions", "arcgis-arcade-variables", "arcgis-code-editor", "arcgis-language-api-panel"];
     components.forEach(tagName => { switch (tagName) {
         case "arcgis-arcade-editor":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, ArcgisArcadeEditor$1);
             }
             break;
-        case "arcgis-arcade-api":
+        case "arcgis-arcade-results":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }
             break;
-        case "arcgis-arcade-results":
+        case "arcgis-arcade-suggestions":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }
             break;
-        case "arcgis-arcade-suggestions":
+        case "arcgis-arcade-variables":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }
             break;
-        case "arcgis-arcade-variables":
+        case "arcgis-code-editor":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }
             break;
-        case "arcgis-code-editor":
+        case "arcgis-language-api-panel":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }

package/dist/components/arcgis-arcade-results.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { A as ArcgisArcadeResults$1, d as defineCustomElement$1 } from './arcade-results.js';
 

package/dist/components/arcgis-arcade-suggestions.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { A as ArcgisArcadeSuggestions$1, d as defineCustomElement$1 } from './arcade-suggestions.js';
 

package/dist/components/arcgis-arcade-variables.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { A as ArcgisArcadeVariables$1, d as defineCustomElement$1 } from './arcade-variables.js';
 

package/dist/components/arcgis-assets.d.ts

@@ -1,8 +1,8 @@
 
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 /**
  * Get the base path to where the package assets can be found.

package/dist/components/arcgis-assets.js

@@ -1,10 +1,10 @@
 
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
-let resourceUrl = "https://js.arcgis.com/coding-components/4.30/";
+let resourceUrl = "https://js.arcgis.com/coding-components/next/";
 export const getArcgisAssetPath = (path) => {
   const assetUrl = new URL(path, resourceUrl);
   return assetUrl.origin !== window.location.origin ? assetUrl.href : assetUrl.pathname;

package/dist/components/arcgis-code-editor.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
- * See https://js.arcgis.com/4.30/esri/copyright.txt for details.
- * v4.30.0
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
  */
 import { A as ArcgisCodeEditor$1, d as defineCustomElement$1 } from './code-editor.js';
 

package/dist/components/arcgis-language-api-panel.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisLanguageApiPanel extends Components.ArcgisLanguageApiPanel, HTMLElement {}
+export const ArcgisLanguageApiPanel: {
+    prototype: ArcgisLanguageApiPanel;
+    new (): ArcgisLanguageApiPanel;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-language-api-panel.js

@@ -0,0 +1,11 @@
+/*!
+ * All material copyright Esri, All Rights Reserved, unless otherwise specified.
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
+ */
+import { A as ArcgisLanguageApiPanel$1, d as defineCustomElement$1 } from './language-api-panel.js';
+
+const ArcgisLanguageApiPanel = ArcgisLanguageApiPanel$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisLanguageApiPanel, defineCustomElement };

package/dist/components/arcgis-sql-expression-editor.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisSqlExpressionEditor extends Components.ArcgisSqlExpressionEditor, HTMLElement {}
+export const ArcgisSqlExpressionEditor: {
+    prototype: ArcgisSqlExpressionEditor;
+    new (): ArcgisSqlExpressionEditor;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-sql-expression-editor.js

@@ -0,0 +1,120 @@
+/*!
+ * All material copyright Esri, All Rights Reserved, unless otherwise specified.
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
+ */
+import { proxyCustomElement, HTMLElement, forceUpdate, h, Host } from '@stencil/core/internal/client';
+import { u as useControllerManager } from './chunk-3IUJHIAA.js';
+import { g as generateGuid } from './index2.js';
+import { s as sqlExprDefaults } from './sql-expr-defaults.js';
+import { d as defineCustomElement$4 } from './code-editor.js';
+import { d as defineCustomElement$3 } from './language-api-panel.js';
+import { d as defineCustomElement$2 } from './sql-expression-fields.js';
+import "@esri/calcite-components/dist/components/calcite-action-bar.js";
+import "@esri/calcite-components/dist/components/calcite-action.js";
+
+const sqlExpressionEditorCss = "arcgis-sql-expression-editor{display:flex;flex-direction:column;position:relative;overflow:hidden;border:1px solid var(--calcite-color-border-3);box-sizing:border-box;background-color:var(--calcite-color-foreground-1);height:100%}arcgis-sql-expression-editor .flex-adjustable{flex:1 1 auto;overflow:hidden}arcgis-sql-expression-editor .flex-panel{flex:1 0 auto}arcgis-sql-expression-editor .position-relative{position:relative}arcgis-sql-expression-editor .flex-row{display:flex;flex-direction:row;overflow:hidden}arcgis-sql-expression-editor .flex-column{display:flex;flex-direction:column;overflow:hidden}arcgis-sql-expression-editor .border-inline-start{border-inline-start:1px solid var(--calcite-color-border-3);box-sizing:border-box}arcgis-sql-expression-editor .border-inline-end{border-inline-end:1px solid var(--calcite-color-border-3);box-sizing:border-box}arcgis-sql-expression-editor .side-action-bar{max-width:25%}arcgis-sql-expression-editor .side-panel{max-width:45%;width:600px}arcgis-sql-expression-editor .side-panel calcite-flow{height:100%}";
+const ArcgisSqlExpressionEditorStyle0 = sqlExpressionEditorCss;
+
+const __cmpMeta = [0,"arcgis-sql-expression-editor",{"profile":[1040],"_preparing":[32],"_editorProfile":[32],"_activeAction":[32],"_apiLibrary":[32]},undefined,{"profile":["_profileChanged"]}];
+const SqlExpressionEditor = /*@__PURE__*/ proxyCustomElement(class SqlExpressionEditor extends HTMLElement {
+    connectedCallback() { this.manager._connectedCallback(); }
+    constructor() {
+        super();
+        this.__registerHost();
+this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
+        this.manager = useControllerManager(this,forceUpdate);
+        // #endregion
+        // #region Private properties
+        this._modelId = generateGuid();
+        this._insertAsSnippet = (e) => void this._codeEditorElt?.insertSnippet(e.detail).catch(console.error);
+        this._preparing = false;
+        this._editorProfile = undefined;
+        this._activeAction = undefined;
+        this._apiLibrary = undefined;
+        this.profile = undefined;
+    }
+    _profileChanged() {
+        this._updateSqlExprDefaults().catch(console.error);
+    }
+    // #endregion
+    // #region Private methods API
+    async _updateSqlExprDefaults() {
+        this._preparing = true;
+        try {
+            await sqlExprDefaults.setProfileForModel(this._modelId, this.profile);
+            this._apiLibrary = await sqlExprDefaults.getApiLibrary(this._modelId);
+        }
+        catch {
+            this._editorProfile = undefined;
+        }
+        finally {
+            // this._editorProfilePromise = Promise.resolve(this._editorProfile);
+            this._preparing = false;
+        }
+    }
+    _setActiveAction(action) {
+        this._activeAction = action;
+    }
+    _handleActionClick(e) {
+        const action = e.target;
+        this._setActiveAction(action.dataset.panelName);
+    }
+    // #endregion
+    // #region Component lifecycle events
+    async componentWillLoad() {
+        await this._updateSqlExprDefaults().catch(console.error);
+        // The profile has to be refreshed on locale change
+        // this.manager.watch("messages", () => void this._updateEditorProfile().catch(console.error));
+    }
+    disconnectedCallback() {
+        this.manager._disconnectedCallback();
+        sqlExprDefaults.disposeForModel(this._modelId);
+    }
+    // #endregion
+    render() {
+        return (h(Host, { key: '67f7ebf7a28a8ffc3fe967721389d45c4e2003a1' }, h("div", { key: 'b3bf4ec2a8d04105e97489593ccec95cd33237f0', class: "flex-row flex-adjustable" }, h("div", { key: 'fdac47e22baf64c72f786f9e09b637050f417f94', class: "flex-column flex-adjustable" }, h("arcgis-code-editor", { key: 'f4151dd39ec3523907cd907ebb7558e05bca9cc1', language: "arcgis-sql-expression", modelId: this._modelId, ref: (e) => (this._codeEditorElt = e) })), this._activeAction === "fields" && (h("arcgis-sql-expression-fields", { key: 'aa0e5d88429d4bf865b9adc506028efefec1a73a', class: "side-panel flex-panel  border-inline-start", loading: this._preparing, modelId: this._modelId, "data-panel-name": "none", onArcgisFieldSelected: this._insertAsSnippet, onArcgisClose: () => this._setActiveAction(undefined) })), this._activeAction === "functions" && (h("arcgis-language-api-panel", { key: '7826dbb1b08894c6c6385806a3aef6cff77395d0', class: "side-panel flex-panel border-inline-start", onArcgisItemSelected: this._insertAsSnippet, onArcgisClose: () => this._setActiveAction(undefined), loading: this._preparing, apiLibrary: this._apiLibrary, "data-panel-name": "none" })), h("calcite-action-bar", { key: 'ee618d666b70405495627a9d15238e8723c6f961', class: "side-action-bar border-inline-start", expanded: false, position: "end" }, h("calcite-action", { key: '2c828df5dded6347e13e59ba9e313824baa606ff', id: "fields-action", text: "Fields", icon: "profile-variables", active: this._activeAction === "fields", "data-panel-name": "fields",
+            // need to use an arrow function to automatically bind 'this'
+            onClick: (e) => this._handleActionClick(e) }), h("calcite-action", { key: 'eab785c5b14cadeb5047db1957134f5accfedc76', id: "functions-action", text: "Functions", icon: "function", active: this._activeAction === "functions", "data-panel-name": "functions", onClick: (e) => this._handleActionClick(e) })))));
+    }
+    static get assetsDirs() { return ["assets"]; }
+    get el() { return this; }
+    static get watchers() { return {
+        "profile": ["_profileChanged"]
+    }; }
+    static get style() { return ArcgisSqlExpressionEditorStyle0; }
+}, __cmpMeta);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["arcgis-sql-expression-editor", "arcgis-code-editor", "arcgis-language-api-panel", "arcgis-sql-expression-fields"];
+    components.forEach(tagName => { switch (tagName) {
+        case "arcgis-sql-expression-editor":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SqlExpressionEditor);
+            }
+            break;
+        case "arcgis-code-editor":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "arcgis-language-api-panel":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "arcgis-sql-expression-fields":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const ArcgisSqlExpressionEditor = SqlExpressionEditor;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisSqlExpressionEditor, defineCustomElement };

package/dist/components/arcgis-sql-expression-fields.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ArcgisSqlExpressionFields extends Components.ArcgisSqlExpressionFields, HTMLElement {}
+export const ArcgisSqlExpressionFields: {
+    prototype: ArcgisSqlExpressionFields;
+    new (): ArcgisSqlExpressionFields;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/arcgis-sql-expression-fields.js

@@ -0,0 +1,11 @@
+/*!
+ * All material copyright Esri, All Rights Reserved, unless otherwise specified.
+ * See https://js.arcgis.com/4.31/esri/copyright.txt for details.
+ * v4.31.0-next.10
+ */
+import { S as SqlExpressionFields, d as defineCustomElement$1 } from './sql-expression-fields.js';
+
+const ArcgisSqlExpressionFields = SqlExpressionFields;
+const defineCustomElement = defineCustomElement$1;
+
+export { ArcgisSqlExpressionFields, defineCustomElement };