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

package/dist/components/arcade-suggestions.js

@@ -1,13 +1,13 @@
 /*!
  * 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.0
+ * v4.31.0-next.10
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client';
-import { g as generateColorizeStyles, o as onColorizeThemeChanged, c as convertMarkdownString, b as colorizeCodeElement } from './markdown.js';
+import { g as generateColorizeStyles, o as onColorizeThemeChanged, c as convertMarkdownString, a as colorizeCodeElement } from './markdown.js';
 import { f as filterCollection } from './utilities.js';
-import { u as useControllerManager } from './chunk-63RMNUHL.js';
-import { e as setFocusOnElement } from './index2.js';
+import { u as useControllerManager } from './chunk-3IUJHIAA.js';
+import { r as setFocusOnElement } from './index2.js';
 import { u as useT9n } from './useT9n.js';
 import "@esri/calcite-components/dist/components/calcite-list-item-group.js";
 import "@esri/calcite-components/dist/components/calcite-list-item.js";
@@ -30,9 +30,11 @@ function isSuggestionGroups(item) {
 }
 
 const arcadeSuggestionsCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}:host calcite-block p:first-of-type{margin-top:0}:host calcite-block code{font-family:var(--calcite-code-family)}:host calcite-block pre{direction:ltr;overflow-x:auto;background-color:var(--calcite-color-foreground-2);padding:var(--calcite-spacing-sm)}:host calcite-block pre code{font-size:var(--calcite-font-size--2)}:host calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}";
+const ArcgisArcadeSuggestionsStyle0 = arcadeSuggestionsCss;
 
 const __cmpMeta = [1,"arcgis-arcade-suggestions",{"suggestions":[1040],"_selectedSuggestion":[32],"_filterValue":[32],"_colorizeStyle":[32]},undefined,{"suggestions":["suggestionsPropChanged"]}];
 const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeSuggestions extends HTMLElement {
+    connectedCallback() { this.manager._connectedCallback(); }
     constructor() {
         super();
         this.__registerHost();
@@ -85,6 +87,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this._themeChangedListener = onColorizeThemeChanged(() => (this._colorizeStyle = generateColorizeStyles()));
     }
     disconnectedCallback() {
+        this.manager._disconnectedCallback();
         this._flowObserver?.disconnect();
         this._themeChangedListener?.dispose();
     }
@@ -122,7 +125,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     renderSuggestionListItems(suggestions) {
         suggestions = filterCollection(suggestions, "label", this._filterValue);
         if (!suggestions.length) {
-            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems);
         }
         return suggestions.map((suggestion) => (h("calcite-list-item", { label: suggestion.label, description: suggestion.description, onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": suggestion }, h("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "", scale: "s", icon: "chevron-right", iconFlipRtl: true, onClick: this._showSuggestionDetail, "data-item": suggestion }))));
     }
@@ -131,17 +134,17 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         if (!suggestion) {
             return null;
         }
-        return (h("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose, beforeBack: this._beforeBack }, h("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", "icon-start": "code", scale: "s", onClick: this._emitItemSelected, ref: (e) => void e?.setFocus(), "data-item": suggestion }, this.messages.insert), h("calcite-block", { open: true, heading: suggestion.label, description: suggestion.description }, h("div", { innerHTML: convertMarkdownString(suggestion.documentation) }), h("pre", null, h("code", { ref: (e) => e === undefined ? undefined : void colorizeCodeElement(e, suggestion.code).catch(console.error) })))));
+        return (h("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose, beforeBack: this._beforeBack }, h("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", iconStart: "code", scale: "s", onClick: this._emitItemSelected, ref: (e) => void e?.setFocus(), "data-item": suggestion }, this.messages.insert), h("calcite-block", { open: true, heading: suggestion.label, description: suggestion.description }, h("div", { innerHTML: convertMarkdownString(suggestion.documentation) }), h("pre", null, h("code", { ref: (e) => e === undefined ? undefined : void colorizeCodeElement(e, suggestion.code).catch(console.error) })))));
     }
     render() {
-        return (h(Host, null, h("style", null, this._colorizeStyle), h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), h("calcite-list", null, this.renderSuggestionGroups())), this.renderSuggestionFlowItem())));
+        return (h(Host, { key: 'fc55be12efad3be68c0612c086f468826a9b13b7' }, h("style", { key: '5274396deaed7ea9f9275773bb9a2090f6713ad8' }, this._colorizeStyle), h("calcite-flow", { key: '94643eecc38f1cea329db6e2b4c4ec6477e6a081', ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { key: '9fd69601bbeb818527bb521cc288706a5cebc4b2', heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { key: 'd95ed08a58313c952e397e641d6d9d55a1d5d3d9', value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), h("calcite-list", { key: 'c63c404469b5c21f867e763a3865f60104e0c23c' }, this.renderSuggestionGroups())), this.renderSuggestionFlowItem())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }
     static get watchers() { return {
         "suggestions": ["suggestionsPropChanged"]
     }; }
-    static get style() { return arcadeSuggestionsCss; }
+    static get style() { return ArcgisArcadeSuggestionsStyle0; }
 }, __cmpMeta);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * v4.31.0-next.10
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
-import { u as useControllerManager } from './chunk-63RMNUHL.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";
@@ -19,6 +19,7 @@ import "@esri/calcite-components/dist/components/calcite-icon.js";
 import "@esri/calcite-components/dist/components/calcite-flow.js";
 
 const arcadeVariablesCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}:host calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}";
+const ArcgisArcadeVariablesStyle0 = arcadeVariablesCss;
 
 function stopEnterPropagation(e) {
     if (e.key === "Enter") {
@@ -27,6 +28,7 @@ function stopEnterPropagation(e) {
 }
 const __cmpMeta = [1,"arcgis-arcade-variables",{"loading":[1028],"modelId":[1025,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},undefined,{"modelId":["modelIdPropChanged"]}];
 const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeVariables extends HTMLElement {
+    connectedCallback() { this.manager._connectedCallback(); }
     constructor() {
         super();
         this.__registerHost();
@@ -79,6 +81,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     }
     //#endregion
     disconnectedCallback() {
+        this.manager._disconnectedCallback();
         this._flowObserver?.disconnect();
     }
     // #endregion
@@ -132,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) {
@@ -140,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));
     }
@@ -156,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())));
     }
@@ -165,7 +168,7 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     static get watchers() { return {
         "modelId": ["modelIdPropChanged"]
     }; }
-    static get style() { return arcadeVariablesCss; }
+    static get style() { return ArcgisArcadeVariablesStyle0; }
 }, __cmpMeta);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * v4.31.0-next.10
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Fragment, Host } from '@stencil/core/internal/client';
 import { KeyCode } from 'monaco-editor';
-import { e as executeScript, D as DevelopersWebSitePath, d as defineCustomElement$5 } 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-63RMNUHL.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";
@@ -22,9 +21,11 @@ import "@esri/calcite-components/dist/components/calcite-tooltip.js";
 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() {
         super();
         this.__registerHost();
@@ -50,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);
@@ -83,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;
@@ -101,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) {
@@ -156,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);
     }
     /**
@@ -189,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.
@@ -200,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.
@@ -218,35 +221,32 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         await this._codeEditorElt?.setFocus();
     }
     disconnectedCallback() {
-        arcadeDefaults.disposeApiContextForModel(this._modelId);
-        arcadeDefaults.disposeEditorProfileForModel(this._modelId);
+        this.manager._disconnectedCallback();
+        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
@@ -255,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) {
@@ -273,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",
@@ -295,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,
             }))));
     }
@@ -310,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:
@@ -330,49 +331,50 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     //#endregion
     //#region Render
     render() {
-        return (h(Host, null, this.renderMainActionBar(), h("div", { class: "flex-row flex-adjustable" }, h("div", { 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"]
     }; }
-    static get style() { return arcadeEditorCss; }
+    static get style() { return ArcgisArcadeEditorStyle0; }
 }, __cmpMeta);
 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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * 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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * 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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * 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

@@ -2,7 +2,7 @@
 /*!
  * 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.0
+ * v4.31.0-next.10
  */
 /**
  * Get the base path to where the package assets can be found.

package/dist/components/arcgis-assets.js

@@ -2,7 +2,7 @@
 /*!
  * 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.0
+ * v4.31.0-next.10
  */
 let resourceUrl = "https://js.arcgis.com/coding-components/next/";
 export const getArcgisAssetPath = (path) => {

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.31/esri/copyright.txt for details.
- * v4.31.0-next.0
+ * 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;