@arcgis/coding-components 4.31.0-next.54 → 4.31.0-next.56

package/dist/components/sql-expr-mode.js

@@ -1,12 +1,14 @@
 /*!
  * 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.54
+ * v4.31.0-next.56
  */
 import { editor, languages, Emitter } from 'monaco-editor';
+import { D as Deferred, t as debounce } from './index2.js';
 import { s as sqlExprDefaults } from './sql-expr-defaults.js';
-import { t as debounce } from './index2.js';
 
+// hold onto a promise that resolves when the worker is ready
+let deferredWorker = new Deferred();
 /**
  * Manager to create our sql-expression worker and client proxy
  */
@@ -26,9 +28,17 @@ class SqlExprWorkerManager {
         if (this._worker) {
             this._worker.dispose();
             this._worker = null;
+            deferredWorker = new Deferred();
         }
         this._client = null;
     }
+    /**
+     * Wait for the worker to be ready.
+     * @returns A promise that resolves when the worker is ready.
+     */
+    static async waitForWorker() {
+        return await deferredWorker.promise;
+    }
     async _getClientProxy() {
         // We used createWebWorker to create or run the web worker if it isn’t already created.
         // Otherwise, we get and return the proxy client.
@@ -42,6 +52,7 @@ class SqlExprWorkerManager {
                     languageOptions,
                 },
             });
+            deferredWorker.resolve(this._worker);
             this._client = this._worker.getProxy();
         }
         return await this._client;
@@ -401,6 +412,8 @@ let sqlExprWorker;
  * @returns The sql-expression worker.
  */
 async function getSqlExprWorker(...uris) {
+    // ensures the worker is registered
+    await SqlExprWorkerManager.waitForWorker();
     return await new Promise((resolve, reject) => {
         if (!sqlExprWorker) {
             reject(new Error("sql expression worker not registered!"));

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

@@ -1,11 +1,12 @@
 /*!
  * 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.54
+ * v4.31.0-next.56
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
-import { u as useControllerManager } from './chunk-BMBYH3VH.js';
+import { u as useControllerManager } from './chunk-W77CUVCX.js';
 import { s as sqlExprDefaults } from './sql-expr-defaults.js';
+import { u as useT9n } from './useT9n.js';
 import "@esri/calcite-components/dist/components/calcite-block.js";
 import "@esri/calcite-components/dist/components/calcite-flow.js";
 import "@esri/calcite-components/dist/components/calcite-flow-item.js";
@@ -27,22 +28,28 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this.arcgisClose = createEvent(this, "arcgisClose", 3);
         this.arcgisFieldSelected = createEvent(this, "arcgisFieldSelected", 3);
         this.manager = useControllerManager(this,forceUpdate);
+        this.messages = useT9n();
         // #endregion
         // #region Private Methods
         this._handleSelectField = (event) => {
             if (event.target instanceof HTMLElement) {
                 const tagName = event.target.tagName;
                 switch (tagName.toLowerCase()) {
-                    case "calcite-list-item":
-                        // TODO: why is value missing from HTMLCalciteListElement type?
-                        this.arcgisFieldSelected.emit(event.target.value ?? "");
+                    case "calcite-list-item": {
+                        const value = event.target.value;
+                        this.arcgisFieldSelected.emit(value ?? "");
                         break;
+                    }
                     case "calcite-action":
                         event.stopPropagation();
                         break;
                 }
             }
         };
+        this._handleSelectDomain = (event) => {
+            const value = event.target.value;
+            this.arcgisFieldSelected.emit(value ? `'${value}'` : "");
+        };
         this._emitClose = () => {
             this.arcgisClose.emit();
         };
@@ -65,14 +72,14 @@ this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
     render() {
         const layer = sqlExprDefaults.getFeatureLayerForModel(this.modelId ?? "");
         if (this.loading || !this.modelId || !layer) {
-            return h("calcite-block", { heading: "Available Fields" });
+            return h("calcite-block", { heading: this.messages.availablefields ?? "" });
         }
-        return (h("calcite-flow", null, h("calcite-flow-item", { heading: "Available Fields", closable: true, description: "Select a field to insert into the expression", onCalciteFlowItemClose: this._emitClose }, h("calcite-list", { filterEnabled: true }, layer.fields.map((field) => (h("calcite-list-item", { key: field.name, onClick: this._handleSelectField, label: field.name, description: field.alias, value: field.name }, field.domain && (h("calcite-action", { slot: "actions-end", text: "open", icon: "chevron-right", onClick: () => {
+        return (h("calcite-flow", null, h("calcite-flow-item", { heading: this.messages.availablefields ?? "", closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-list", { filterEnabled: true }, layer.fields.map((field) => (h("calcite-list-item", { key: field.name, onClick: this._handleSelectField, label: field.name, description: field.alias, value: field.name }, field.domain && (h("calcite-action", { slot: "actions-end", text: "open", icon: "chevron-right", onClick: () => {
                 const domain = field.domain;
                 if (domain.type === "coded-value") {
                     this._flowItemRenderers = [
                         ...this._flowItemRenderers,
-                        () => (h("calcite-flow-item", { closable: true, heading: "Domains", description: field.name, onCalciteFlowItemClose: this._emitClose }, h("calcite-list", null, domain.codedValues.map((value) => (h("calcite-list-item", { key: value.code, onClick: this._handleSelectField, label: value.name, description: String(value.code), value: value.code })))))),
+                        () => (h("calcite-flow-item", { closable: true, heading: this.messages.domainvalues ?? "", description: field.name, onCalciteFlowItemClose: this._emitClose }, h("calcite-list", null, domain.codedValues.map((value) => (h("calcite-list-item", { key: value.code, onClick: this._handleSelectDomain, label: value.name, description: String(value.code), value: String(value.code) })))))),
                     ];
                 }
             } }))))))), this._flowItemRenderers.map((renderer) => renderer())));

package/dist/components/useT9n.js

@@ -1,9 +1,9 @@
 /*!
  * 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.54
+ * v4.31.0-next.56
  */
-import { p as proxyExports, w as watch, C as Controller, s as setAmbientComponent } from './chunk-BMBYH3VH.js';
+import { p as proxyExports, w as watch, C as Controller, s as setAmbientComponent } from './chunk-W77CUVCX.js';
 import { n as startLocaleObserver, p as getElementLocales } from './index2.js';
 import { getArcgisAssetPath as getAssetPath } from "./arcgis-assets.js";
 

package/dist/components/utilities.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.54
+ * v4.31.0-next.56
  */
 import { d as createFilterExpression } from './index2.js';
 

package/dist/esm/{app-globals-7a9ff748.js → app-globals-68a9d20e.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.54
+ * v4.31.0-next.56
  */
 const globalScripts = () => {};
 

package/dist/esm/{arcade-defaults-112cabaa.js → arcade-defaults-06fa8817.js}

@@ -1,10 +1,10 @@
 /*!
  * 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.54
+ * v4.31.0-next.56
  */
-import { m as main, f as fieldsToProfileValues, i as isPredefinedProfile, a as isFeatureSetCollectionDefinition, b as isFeatureSetDefinition, c as isFeatureDefinition, s as supportedLocales, L as LanguageDefaultsBase, d as fetchT9nStringsBundle, E as EditorProfile, U as Uri } from './language-defaults-base-9e3f1f44.js';
-import { g as getAssetPath } from './index-20936dfe.js';
+import { m as main, f as fieldsToProfileValues, i as isPredefinedProfile, a as isFeatureSetCollectionDefinition, b as isFeatureSetDefinition, c as isFeatureDefinition, s as supportedLocales, L as LanguageDefaultsBase, d as fetchT9nStringsBundle, E as EditorProfile, U as Uri } from './language-defaults-base-307b77e5.js';
+import { g as getAssetPath } from './index-b5d43ca7.js';
 
 /**
  * Returns the arcade diagnostic service.
@@ -38,7 +38,7 @@ async function getArcadeWorker(uri) {
  * @returns arcade mode module
  */
 async function getMode() {
-    return await import('./arcade-mode-78a2482d.js');
+    return await import('./arcade-mode-e2e247bd.js');
 }
 
 // #region convert editor profile to apiProfile

package/dist/esm/{arcade-mode-78a2482d.js → arcade-mode-e2e247bd.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.54
+ * v4.31.0-next.56
  */
-import { m as main, g as editor, O as MarkerSeverity, R as Range, z as languages, P as debounce, Q as Emitter } from './language-defaults-base-9e3f1f44.js';
+import { m as main, g as editor, O as MarkerSeverity, R as Range, x as languages, P as debounce, D as Deferred, Q as Emitter } from './language-defaults-base-307b77e5.js';
 
-var V={False:"false",Null:"null",True:"true"},f={Break:"break",Continue:"continue",Else:"else",For:"for",From:"from",Function:"function",If:"if",Import:"import",Export:"export",In:"in",Return:"return",Var:"var",While:"while"},Ee=["++","--"],Je=["-","+","!","~"],Qe=["=","/=","*=","%=","+=","-="],Ze=["||","&&"],Lt=["|","&",">>","<<",">>>","^","==","!=","<","<=",">",">=","+","-","*","/","%"];var U=[[],[],[]];Ee.forEach(t=>U[t.length-1]?.push(t));Je.forEach(t=>U[t.length-1]?.push(t));Ze.forEach(t=>U[t.length-1]?.push(t));Qe.forEach(t=>U[t.length-1]?.push(t));Lt.forEach(t=>U[t.length-1]?.push(t));var ft=Object.values(f),gt=Object.values(V);gt.map(t=>({label:t,kind:main.exports.CompletionItemKind.Constant}));ft.map(t=>({label:t,kind:main.exports.CompletionItemKind.Keyword}));
+var V={False:"false",Null:"null",True:"true"},f={Break:"break",Continue:"continue",Else:"else",For:"for",From:"from",Function:"function",If:"if",Import:"import",Export:"export",In:"in",Return:"return",Var:"var",While:"while"},Ee=["++","--"],Je=["-","+","!","~"],Qe=["=","/=","*=","%=","+=","-="],Ze=["||","&&"],Bt=["|","&",">>","<<",">>>","^","==","!=","<","<=",">",">=","+","-","*","/","%"];var U=[[],[],[]];Ee.forEach(t=>U[t.length-1]?.push(t));Je.forEach(t=>U[t.length-1]?.push(t));Ze.forEach(t=>U[t.length-1]?.push(t));Qe.forEach(t=>U[t.length-1]?.push(t));Bt.forEach(t=>U[t.length-1]?.push(t));var ft=Object.values(f),gt=Object.values(V);gt.map(t=>({label:t,kind:main.exports.CompletionItemKind.Constant}));ft.map(t=>({label:t,kind:main.exports.CompletionItemKind.Keyword}));
 
 const operators = [
     "<=",
@@ -476,6 +476,8 @@ class FormattingProvider {
 }
 //#endregion
 
+// hold onto a promise that resolves when the worker is ready
+let deferredWorker = new Deferred();
 /**
  * Manager to create our arcade worker and client proxy
  */
@@ -495,9 +497,17 @@ class WorkerManager {
         if (this._worker) {
             this._worker.dispose();
             this._worker = null;
+            deferredWorker = new Deferred();
         }
         this._client = null;
     }
+    /**
+     * Wait for the worker to be ready.
+     * @returns A promise that resolves when the worker is ready.
+     */
+    static async waitForWorker() {
+        return await deferredWorker.promise;
+    }
     async _getClientProxy() {
         // We used createWebWorker to create or run the web worker if it isn’t already created.
         // Otherwise, we get and return the proxy client.
@@ -511,6 +521,7 @@ class WorkerManager {
                     languageOptions,
                 },
             });
+            deferredWorker.resolve(this._worker);
             this._client = this._worker.getProxy();
         }
         return await this._client;
@@ -529,6 +540,8 @@ let arcadeWorker;
  * @returns The arcade worker.
  */
 async function getArcadeWorker(...uris) {
+    // ensures the worker is registered
+    await WorkerManager.waitForWorker();
     return await new Promise((resolve, reject) => {
         if (!arcadeWorker) {
             reject(new Error("Arcade not registered!"));

package/dist/esm/arcgis-arcade-editor_6.entry.js

@@ -1,12 +1,12 @@
 /*!
  * 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.54
+ * v4.31.0-next.56
  */
-import { g as getAssetPath, r as registerInstance, c as createEvent, h, F as Fragment, H as Host, a as getElement } from './index-20936dfe.js';
-import { e as importArcade, g as editor, h as startLocaleObserver, j as getElementLocales, k as isURL, l as hasSameOrigin, n as importRequest, D as Deferred, o as generateGuid, p as getElementTheme, K as KeyCode, q as setValuesInString, r as quoteString, t as supportedFields, u as generateTokensCSSForColorMap, S as StandaloneServices, I as IStandaloneThemeService, v as commonjsGlobal, w as setFocusOnElement, x as filterCollection, y as createFilterExpression, z as languages, R as Range, A as observeAncestorsMutation, U as Uri, B as KeyMod, C as addLTRMark } from './language-defaults-base-9e3f1f44.js';
-import { p as proxyExports, w as watch, C as Controller, s as setAmbientComponent, u as useControllerManager, g as getSet, a as sqlExprDefaults, b as getMode$1 } from './sql-expr-defaults-3913a59f.js';
-import { b as arcadeDefaults, g as getArcadeDiagnosticService, c as getMode } from './arcade-defaults-112cabaa.js';
+import { r as registerInstance, c as createEvent, g as getAssetPath, h, F as Fragment, H as Host, a as getElement } from './index-b5d43ca7.js';
+import { e as importArcade, g as editor, h as isURL, j as hasSameOrigin, k as importRequest, D as Deferred, l as generateGuid, n as getElementTheme, K as KeyCode, o as setValuesInString, q as quoteString, p as supportedFields, r as generateTokensCSSForColorMap, S as StandaloneServices, I as IStandaloneThemeService, t as commonjsGlobal, u as setFocusOnElement, v as filterCollection, w as createFilterExpression, x as languages, R as Range, y as observeAncestorsMutation, U as Uri, z as KeyMod, A as addLTRMark } from './language-defaults-base-307b77e5.js';
+import { u as useControllerManager, a as useT9n, g as getSet, s as sqlExprDefaults, b as getMode$1 } from './sql-expr-defaults-c2608671.js';
+import { b as arcadeDefaults, g as getArcadeDiagnosticService, c as getMode } from './arcade-defaults-06fa8817.js';
 
 const DevelopersWebSitePath = "https://developers.arcgis.com/arcade/";
 const MaxArrayItems = 100;
@@ -290,107 +290,6 @@ function updateThemeColors(theme, colorRules) {
     editor.defineTheme(base, { base, inherit: true, rules, colors: {} });
 }
 
-// src/functional.ts
-var makeController = (constructor) => proxy(void 0, constructor);
-var FunctionalController = class extends Controller {
-  constructor(component, constructor) {
-    super(component);
-    const originalExports = this.exports;
-    try {
-      setAmbientComponent(this.component);
-      const value = constructor(this.component, this);
-      const constructorChangedExports = this.exports !== originalExports;
-      if (value instanceof Promise) {
-        if (!constructorChangedExports) {
-          this.setProvisionalExports(value);
-        }
-        const resolved = value.then((result) => {
-          this.exports = result;
-          super.catchUpLifecycle();
-        }).catch((error) => {
-          this._ready.reject(error);
-          console.error(error);
-        });
-        this.onLoad(async () => await resolved);
-      } else {
-        if (!constructorChangedExports || value !== void 0) {
-          this.exports = value;
-        }
-        queueMicrotask(() => super.catchUpLifecycle());
-      }
-    } catch (error) {
-      this._ready.reject(error);
-      console.error(error);
-    }
-  }
-  /** Noop - will be called in the constructor instead */
-  catchUpLifecycle() {
-    return;
-  }
-};
-var proxy = proxyExports(FunctionalController);
-var makeT9nController = (getAssetPath) => (options = {}) => (
-  // eslint-disable-next-line @typescript-eslint/promise-function-async
-  makeController((component, controller) => {
-    const componentWithOverrides = component;
-    controller.onLifecycle(
-      () => startLocaleObserver(
-        component.el,
-        getAssetPath("./assets"),
-        ({ t9nLocale, t9nStrings, lang }) => {
-          const withoutOverrides = {
-            ...t9nStrings,
-            _lang: lang,
-            _t9nLocale: t9nLocale,
-            _loading: false
-          };
-          controller.exports = withoutOverrides;
-          const label = t9nStrings.componentLabel ?? t9nStrings.widgetLabel;
-          if (typeof label === "string" && "label" in component && component.label == null) {
-            component.label ?? (component.label = label);
-          }
-          applyOverrides(componentWithOverrides.messageOverrides);
-        },
-        options.name
-      )
-    );
-    function applyOverrides(messageOverrides) {
-      const currentValue = controller.exports;
-      const rawMessages = currentValue._original ?? currentValue;
-      const updated = deepMerge(rawMessages, messageOverrides);
-      updated._original = rawMessages;
-      controller.exports = updated;
-    }
-    if ("messageOverrides" in componentWithOverrides) {
-      controller.onLifecycle(() => watch(componentWithOverrides, "messageOverrides", applyOverrides));
-    }
-    if (options.blocking) {
-      return controller.ready;
-    }
-    const locale = getElementLocales(component.el);
-    const pending = {
-      _lang: locale.lang,
-      _t9nLocale: locale.t9nLocale,
-      _loading: true
-    };
-    return pending;
-  })
-);
-function deepMerge(original, overwrites) {
-  if (!overwrites) {
-    return original;
-  }
-  const merged = { ...original };
-  Object.entries(overwrites).forEach(([key, value]) => {
-    if (typeof value === "object") {
-      merged[key] = deepMerge(original[key], value);
-    } else {
-      merged[key] = value ?? original[key];
-    }
-  });
-  return merged;
-}
-
 function isMonacoEnvironmentSetup() {
     return !!window.MonacoEnvironment?.getWorkerUrl;
 }
@@ -449,8 +348,6 @@ function setupMonacoEnvironment(assetsPath) {
     };
 }
 
-const useT9n = makeT9nController(getAssetPath);
-
 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;
 
@@ -535,11 +432,13 @@ const ArcgisArcadeEditor = class {
             set: "ignore",
         });
     }
-    _messagesChanged() {
-        this._updateArcadeDefaults().catch(console.error);
+    async _messagesChanged() {
+        await this._updateEditorProfile().catch(console.error);
+        await this._updateApiLibrary().catch(console.error);
     }
-    _profileChanged() {
-        this._updateArcadeDefaults().catch(console.error);
+    async _profileChanged() {
+        await this._updateEditorProfile().catch(console.error);
+        await this._updateApiLibrary().catch(console.error);
     }
     _testDataChanged() {
         if (!this._showExecutionPanel) {
@@ -621,12 +520,15 @@ const ArcgisArcadeEditor = class {
         // 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._updateArcadeDefaults();
+        await this._updateEditorProfile();
     }
     async componentDidLoad() {
         // Mark on component as ready.
         // Some methods are waiting for this state to actually continue.
         this._componentReadyDefer.resolve();
+        // We do updateApiLibrary in componentDidLoad because we need to wait until code editor
+        // is rendered for worker to register and allow for fetching the sdk
+        await this._updateApiLibrary();
         // Start listening to the validation diagnostics.
         // We are doing this as late as possible
         const diagnosticsService = await getArcadeDiagnosticService();
@@ -655,7 +557,7 @@ const ArcgisArcadeEditor = class {
     }
     // #endregion
     // #region Private methods API
-    async _updateArcadeDefaults() {
+    async _updateEditorProfile() {
         // 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;
@@ -665,7 +567,6 @@ const ArcgisArcadeEditor = class {
                 snippets: this.snippets,
             });
             this._editorProfile = arcadeDefaults.getEditorProfileForModel(this._modelId);
-            this._apiLibrary = await arcadeDefaults.getApiLibrary(this._modelId);
         }
         catch {
             this._editorProfile = undefined;
@@ -675,6 +576,9 @@ const ArcgisArcadeEditor = class {
             this._preparingArcade = false;
         }
     }
+    async _updateApiLibrary() {
+        this._apiLibrary = await arcadeDefaults.getApiLibrary(this._modelId);
+    }
     // #endregion
     //#region Render Main Action Bar
     renderMainActionBar() {
@@ -757,7 +661,7 @@ const ArcgisArcadeEditor = class {
     //#endregion
     //#region Render
     render() {
-        return (h(Host, { key: 'f8a7e9cb7620c72586fc06dba017a44b63330198' }, this.renderMainActionBar(), h("div", { key: '086f52ceaa74266a8bcd28833ae526f73537a165', class: "flex-row flex-adjustable" }, h("div", { key: 'fa33e21b52d41b7c01a504eb85a229714b8c0556', class: "flex-column flex-adjustable" }, this.renderMainPanel(), this.renderResultsPanel()), this.renderSidePanel(), this.renderSideActionBar())));
+        return (h(Host, { key: '0d94f0940e22ebdf09ce14dac1f29ff6d0cda848' }, this.renderMainActionBar(), h("div", { key: 'cf41e32ee268570fc70204de9885f351bf2f0f6e', class: "flex-row flex-adjustable" }, h("div", { key: 'd2dd6c0e068baa18aa057b53b31b5ee552de97bc', class: "flex-column flex-adjustable" }, this.renderMainPanel(), this.renderResultsPanel()), this.renderSidePanel(), this.renderSideActionBar())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -4420,6 +4324,7 @@ const ArcgisCodeEditor = class {
         this.addCommonEditorActions();
     }
     disconnectedCallback() {
+        this._editorInstance?.getModel()?.dispose();
         while (this._disposables.length) {
             this._disposables.pop()?.dispose();
         }
@@ -4487,7 +4392,7 @@ const ArcgisCodeEditor = class {
     //#endregion
     // #region Rendering
     render() {
-        return h(Host, { key: 'dc46295c6153511a5af31138745f7cb7cc03e1c8' });
+        return h(Host, { key: 'ad62779413690025ea1498106aee049b3c786582' });
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -4555,6 +4460,21 @@ const ArcgisLanguageApiPanel = class {
         this.loading = false;
         this.apiLibrary = undefined;
     }
+    _apiLibraryChanged(newVal) {
+        // refresh the selected api item if there is one to use the new language
+        if (!this._selectedApiItem) {
+            return;
+        }
+        for (const category of newVal ?? []) {
+            for (const item of category.items) {
+                if (item.name === this._selectedApiItem.name) {
+                    this._selectedApiItem = item;
+                    return;
+                }
+            }
+        }
+        this._selectedApiItem = undefined;
+    }
     //#endregion
     // #region Component lifecycle events
     async componentWillLoad() {
@@ -4616,10 +4536,13 @@ const ArcgisLanguageApiPanel = class {
     render() {
         const categories = (this.apiLibrary ?? []).map((apiCategory) => this.renderApiCategory(apiCategory));
         const empty = categories.every((g) => !g);
-        return (h(Host, { key: '60e169c299bceeb3d2912eea067d69005fb27bf5' }, h("style", { key: '4460f4de437b518f40f5013c6e06dadefc7c90a4' }, this._colorizeStyle), h("calcite-flow", { key: '06a7e13f55efbd24e4eb200ad2c4cbf56b699b50', ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { key: 'db5e4e8817ee85de1c19655496529fb93bb544dd', heading: this.messages.constantsandfunctions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { key: 'a35a4cedbdec59eed366f719c7d48e662005f6fb', value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), this.loading ? (h("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "Loading" })) : (h("calcite-list", null, empty ? h("div", { class: "notice-container" }, this.messages.noitems) : categories))), this.renderApiItemFlowItem())));
+        return (h(Host, { key: '777e65f0a9891fbdf8fd6177890df475261d198e' }, h("style", { key: 'bacffd5a30dfa72f9cc99db6a7066fd551c06e60' }, this._colorizeStyle), h("calcite-flow", { key: 'b48417bccd1a1a5e400d5b205ff0dc3a21e08a76', ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { key: 'a44cdb484d60daa1a6410ed7d513eb680f20f883', heading: this.messages.constantsandfunctions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { key: 'ebe4708ce6ccb62b2d5639bb9cbc5ee207e7e2b9', value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), this.loading ? (h("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "Loading" })) : (h("calcite-list", null, empty ? h("div", { class: "notice-container" }, this.messages.noitems) : categories))), this.renderApiItemFlowItem())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "apiLibrary": ["_apiLibraryChanged"]
+    }; }
 };
 ArcgisLanguageApiPanel.style = ArcgisLanguageApiPanelStyle0;
 

package/dist/esm/arcgis-coding-components.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.54
+ * v4.31.0-next.56
  */
-import { p as promiseResolve, b as bootstrapLazy } from './index-20936dfe.js';
-export { s as setNonce } from './index-20936dfe.js';
-import { g as globalScripts } from './app-globals-7a9ff748.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-b5d43ca7.js';
+export { s as setNonce } from './index-b5d43ca7.js';
+import { g as globalScripts } from './app-globals-68a9d20e.js';
 
 /*
  Stencil Client Patch Browser v4.19.2 | MIT Licensed | https://stenciljs.com
@@ -21,5 +21,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["arcgis-sql-expression-fields",[[1,"arcgis-sql-expression-fields",{"loading":[4],"modelId":[1,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},null,{"modelId":["modelIdPropChanged"]}]]],["arcgis-arcade-editor_6",[[0,"arcgis-arcade-editor",{"profile":[16],"script":[1025],"testData":[16],"suggestions":[16],"snippets":[16],"hideDocumentationActions":[4,"hide-documentation-actions"],"hideSideBar":[4,"hide-side-bar"],"sideActionBarExpanded":[1540,"side-action-bar-expanded"],"openedSidePanel":[1537,"opened-side-panel"],"editorOptions":[16],"editorInstance":[16],"_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]},null,{"messages":["_messagesChanged"],"profile":["_profileChanged"],"testData":["_testDataChanged"],"snippets":["_snippetChanged"]}],[1,"arcgis-arcade-results",{"loading":[4],"openedResultPanel":[1537,"opened-result-panel"],"result":[16],"consoleLogs":[16]}],[1,"arcgis-arcade-suggestions",{"suggestions":[16],"_selectedSuggestion":[32],"_filterValue":[32],"_colorizeStyle":[32]},null,{"suggestions":["suggestionsPropChanged"]}],[1,"arcgis-arcade-variables",{"loading":[4],"modelId":[1,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},null,{"modelId":["modelIdPropChanged"]}],[0,"arcgis-code-editor",{"value":[1],"language":[1],"modelId":[1,"model-id"],"editorOptions":[16],"editorInstance":[16],"getValue":[64],"setValue":[64],"insertText":[64],"insertSnippet":[64],"getEditorInstance":[64],"setFocus":[64]},null,{"language":["languagePropChange"],"modelId":["modelIdPropChange"],"editorOptions":["editorOptionsPropChange"]}],[1,"arcgis-language-api-panel",{"hideDocumentationActions":[4,"hide-documentation-actions"],"loading":[4],"apiLibrary":[16],"_selectedApiItem":[32],"_filterValue":[32],"_colorizeStyle":[32]}]]],["arcgis-sql-expression-editor",[[0,"arcgis-sql-expression-editor",{"profile":[16],"_preparing":[32],"_editorProfile":[32],"_activeAction":[32],"_apiLibrary":[32]},null,{"profile":["_profileChanged"]}]]]], options);
+  return bootstrapLazy([["arcgis-sql-expression-fields",[[1,"arcgis-sql-expression-fields",{"loading":[4],"modelId":[1,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},null,{"modelId":["modelIdPropChanged"]}]]],["arcgis-arcade-editor_6",[[0,"arcgis-arcade-editor",{"profile":[16],"script":[1025],"testData":[16],"suggestions":[16],"snippets":[16],"hideDocumentationActions":[4,"hide-documentation-actions"],"hideSideBar":[4,"hide-side-bar"],"sideActionBarExpanded":[1540,"side-action-bar-expanded"],"openedSidePanel":[1537,"opened-side-panel"],"editorOptions":[16],"editorInstance":[16],"_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]},null,{"messages":["_messagesChanged"],"profile":["_profileChanged"],"testData":["_testDataChanged"],"snippets":["_snippetChanged"]}],[1,"arcgis-arcade-results",{"loading":[4],"openedResultPanel":[1537,"opened-result-panel"],"result":[16],"consoleLogs":[16]}],[1,"arcgis-arcade-suggestions",{"suggestions":[16],"_selectedSuggestion":[32],"_filterValue":[32],"_colorizeStyle":[32]},null,{"suggestions":["suggestionsPropChanged"]}],[1,"arcgis-arcade-variables",{"loading":[4],"modelId":[1,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},null,{"modelId":["modelIdPropChanged"]}],[0,"arcgis-code-editor",{"value":[1],"language":[1],"modelId":[1,"model-id"],"editorOptions":[16],"editorInstance":[16],"getValue":[64],"setValue":[64],"insertText":[64],"insertSnippet":[64],"getEditorInstance":[64],"setFocus":[64]},null,{"language":["languagePropChange"],"modelId":["modelIdPropChange"],"editorOptions":["editorOptionsPropChange"]}],[1,"arcgis-language-api-panel",{"hideDocumentationActions":[4,"hide-documentation-actions"],"loading":[4],"apiLibrary":[16],"_selectedApiItem":[32],"_filterValue":[32],"_colorizeStyle":[32]},null,{"apiLibrary":["_apiLibraryChanged"]}]]],["arcgis-sql-expression-editor",[[0,"arcgis-sql-expression-editor",{"profile":[16],"script":[1025],"_preparing":[32],"_editorProfile":[32],"_activeAction":[32],"_apiLibrary":[32],"messages":[32]},null,{"messages":["_messagesChanged"],"profile":["_profileChanged"]}]]]], options);
 });

package/dist/esm/arcgis-sql-expression-editor.entry.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.54
+ * v4.31.0-next.56
  */
-import { r as registerInstance, h, H as Host, a as getElement } from './index-20936dfe.js';
-import { u as useControllerManager, a as sqlExprDefaults } from './sql-expr-defaults-3913a59f.js';
-import { o as generateGuid } from './language-defaults-base-9e3f1f44.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-b5d43ca7.js';
+import { u as useControllerManager, s as sqlExprDefaults, a as useT9n } from './sql-expr-defaults-c2608671.js';
+import { l as generateGuid } from './language-defaults-base-307b77e5.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;
@@ -13,27 +13,42 @@ const ArcgisSqlExpressionEditorStyle0 = sqlExpressionEditorCss;
 const SqlExpressionEditor = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.arcgisScriptChange = createEvent(this, "arcgisScriptChange", 3);
         this.manager = useControllerManager(this);
         // #endregion
         // #region Private properties
         this._modelId = generateGuid();
         this._insertAsSnippet = (e) => void this._codeEditorElt?.insertSnippet(e.detail).catch(console.error);
+        this._updateApiLibrary = async () => {
+            this._apiLibrary = await sqlExprDefaults.getApiLibrary(this._modelId);
+        };
+        this._onCodeEditorValueChange = (e) => {
+            e.stopPropagation();
+            this.script = e.detail;
+            this.arcgisScriptChange.emit(e.detail);
+        };
         this._preparing = false;
         this._editorProfile = undefined;
         this._activeAction = undefined;
         this._apiLibrary = undefined;
+        this.messages = useT9n();
         this.profile = undefined;
+        this.script = "";
+    }
+    async _messagesChanged() {
+        await this._updateEditorProfile().catch(console.error);
+        await this._updateApiLibrary().catch(console.error);
     }
-    _profileChanged() {
-        this._updateSqlExprDefaults().catch(console.error);
+    async _profileChanged() {
+        await this._updateEditorProfile().catch(console.error);
+        await this._updateApiLibrary().catch(console.error);
     }
     // #endregion
     // #region Private methods API
-    async _updateSqlExprDefaults() {
+    async _updateEditorProfile() {
         this._preparing = true;
         try {
             await sqlExprDefaults.setProfileForModel(this._modelId, this.profile);
-            this._apiLibrary = await sqlExprDefaults.getApiLibrary(this._modelId);
         }
         catch {
             this._editorProfile = undefined;
@@ -53,22 +68,28 @@ const SqlExpressionEditor = class {
     // #endregion
     // #region Component lifecycle events
     async componentWillLoad() {
-        await this._updateSqlExprDefaults().catch(console.error);
+        await this._updateEditorProfile().catch(console.error);
         // The profile has to be refreshed on locale change
         // this.manager.watch("messages", () => void this._updateEditorProfile().catch(console.error));
     }
+    async componentDidLoad() {
+        // We do updateApiLibrary in componentDidLoad because we need to wait until code editor
+        // is rendered for worker to register and allow for fetching the sdk
+        await this._updateApiLibrary();
+    }
     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",
+        return (h(Host, { key: '63348b6e3e5aa7544203c5ec7270db7827c6f3ed' }, h("div", { key: '203ed656208717c877c540ed5c49fc12338d6b15', class: "flex-row flex-adjustable" }, h("div", { key: '4dfe400bbc9ab74ef86c4115ceeabbcb41913427', class: "flex-column flex-adjustable" }, h("arcgis-code-editor", { key: 'dfc9e247b39d2d9901ac911e147d993897809954', language: "arcgis-sql-expression", modelId: this._modelId, ref: (e) => (this._codeEditorElt = e), value: this.script ?? "", onArcgisValueChange: this._onCodeEditorValueChange })), this._activeAction === "fields" && (h("arcgis-sql-expression-fields", { key: 'b5a5516264aae278f3feec00a5e20e2d0855024d', 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: '6da236e289e8bcdadc27cadece6e1fb34c55b1da', 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: '91549ebac7e78165b911e5def1141010032dfa43', class: "side-action-bar border-inline-start", expanded: false, position: "end" }, h("calcite-action", { key: '32211e3b4e8db0530a047ba6c22234d15e504e17', id: "fields-action", text: this.messages.fields ?? "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) })))));
+            onClick: (e) => this._handleActionClick(e) }), h("calcite-action", { key: '3c308d994b45c67df76414580d881a082333d2f8', id: "functions-action", text: this.messages.functions ?? "Functions", icon: "function", active: this._activeAction === "functions", "data-panel-name": "functions", onClick: (e) => this._handleActionClick(e) })))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "messages": ["_messagesChanged"],
         "profile": ["_profileChanged"]
     }; }
 };