@arcgis/coding-components 4.30.0-next.29 → 4.30.0-next.30

package/dist/esm/arcgis-arcade-api_6.entry.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-next.29
+ * v4.30.0-next.30
  */
-import { f as forceUpdate, g as getAssetPath, r as registerInstance, c as createEvent, h as h$1, H as Host, a as getElement, F as Fragment } from './index-18371544.js';
-import { g as generateTokensCSSForColorMap, e as editor, S as StandaloneServices, I as IStandaloneThemeService, c as createCommonjsModule, b as commonjsGlobal, d as de, f as ge, i as importRequest, l as languages, h as arcadeDefaults, U as Uri, W, j as filterCollection, o as oe, k as importArcade, m as h$2, Q, _, K as KeyCode, r as re, t as te, s as supportedFields, n as ne, R as Range, p as b$1, q as KeyMod } from './arcade-defaults-87a86d11.js';
+import { f as forceUpdate, g as getAssetPath, r as registerInstance, c as createEvent, h, H as Host, a as getElement, F as Fragment } from './index-06d390be.js';
+import { g as generateTokensCSSForColorMap, e as editor, S as StandaloneServices, I as IStandaloneThemeService, c as createCommonjsModule, b as commonjsGlobal, i as importCoreAccessor, d as importCoreAccessorSupportDecorators, f as isURL, h as hasSameOrigin, j as importRequest, l as languages, k as arcadeDefaults, U as Uri, s as setFocusOnElement, m as filterCollection, n as addLTRMark, o as importArcade, D as Deferred$1, p as generateGuid, q as getElementTheme, K as KeyCode, r as setValuesInString, t as quoteString, u as supportedFields, v as createFilterExpression, R as Range, w as observeAncestorsMutation$1, x as KeyMod } from './arcade-defaults-3f0e1c43.js';
 
 async function colorizeCode(code) {
     return await editor.colorize(code, "arcade", { tabSize: 2 });
@@ -2922,8 +2922,8 @@ marked_umd.marked.use({
     renderer: {
         link(href, title, text) {
             return `<calcite-link href="${href}" title="${title ?? text}" target="Arcade Help">${text}</calcite-link>`;
-        }
-    }
+        },
+    },
 });
 /**
  * Converts a markdown string to HTML using the marked library.
@@ -2936,105 +2936,93 @@ function convertMarkdownString(value) {
 }
 
 // ../components-utils/dist/index.js
-var h = class {
+var Deferred = class {
+  /**
+   * Creates a new deferred promise.
+   */
   constructor() {
-    this.resolve = () => {
-    }, this.reject = () => {
-    }, this.promise = new Promise((t, n) => {
-      this.resolve = t, this.reject = n;
+    this.resolve = () => void 0;
+    this.reject = () => void 0;
+    this.promise = new Promise((resolve, reject) => {
+      this.resolve = resolve;
+      this.reject = reject;
     });
   }
 };
-function w(e, t) {
-  let n = e;
-  for (; n; ) {
-    if (n === t)
+function inTargetElement(element, targetElement) {
+  let currentElement = element;
+  while (currentElement) {
+    if (currentElement === targetElement) {
       return true;
-    if (!n.parentNode)
+    }
+    if (!currentElement.parentNode) {
       return false;
-    n.parentNode instanceof ShadowRoot ? n = n.parentNode.host : n = n.parentNode;
+    }
+    if (currentElement.parentNode instanceof ShadowRoot) {
+      currentElement = currentElement.parentNode.host;
+    } else {
+      currentElement = currentElement.parentNode;
+    }
   }
   return false;
 }
-function b(e, t, n) {
-  let { subscribe: r } = $(t);
-  return r((o) => {
-    o.some((s) => w(e, s.target)) && n();
+function observeAncestorsMutation(element, attributeFilter, callback) {
+  const { subscribe } = observe(attributeFilter);
+  return subscribe((mutations) => {
+    const matched = mutations.some((mutation) => inTargetElement(element, mutation.target));
+    if (matched)
+      callback();
   });
 }
-var f = {};
-function $(e) {
-  let t = e.join(","), n = f[t];
-  if (n !== void 0)
-    return n;
-  let r = /* @__PURE__ */ new Set(), o = new MutationObserver((s) => r.forEach((a) => a(s)));
-  o.observe(document.documentElement, { attributes: true, attributeFilter: e, subtree: true });
-  let i = { subscribe(s) {
-    return r.add(s), { remove: () => {
-      r.delete(s), r.size === 0 && (o.disconnect(), f[t] = void 0);
-    } };
-  } };
-  return f[t] = i, i;
+var observers = {};
+function observe(attributeFilter) {
+  const attributes = attributeFilter.join(",");
+  const previousObserver = observers[attributes];
+  if (previousObserver !== void 0)
+    return previousObserver;
+  const subscribers = /* @__PURE__ */ new Set();
+  const mutationObserver = new MutationObserver((mutations) => subscribers.forEach((callback) => callback(mutations)));
+  mutationObserver.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter,
+    subtree: true
+  });
+  const observer = {
+    subscribe(callback) {
+      subscribers.add(callback);
+      return {
+        remove: () => {
+          subscribers.delete(callback);
+          if (subscribers.size === 0) {
+            mutationObserver.disconnect();
+            observers[attributes] = void 0;
+          }
+        }
+      };
+    }
+  };
+  observers[attributes] = observer;
+  return observer;
 }
-function x(e, t) {
-  let n = e;
-  for (; n; ) {
-    let r = n.closest(t);
-    if (r)
-      return r;
-    let o = n.getRootNode();
-    if (o === document)
+function closestElement(base, selector) {
+  let currentElement = base;
+  while (currentElement) {
+    const element = currentElement.closest(selector);
+    if (element) {
+      return element;
+    }
+    const rootElement = currentElement.getRootNode();
+    if (rootElement === document) {
       return null;
-    n = o.host;
+    }
+    currentElement = rootElement.host;
   }
   return null;
 }
-function m(e, t, n) {
-  return x(e, `[${t}]`)?.getAttribute(t) ?? n;
+function getElementAttribute(el, prop, fallbackValue) {
+  const closest = closestElement(el, `[${prop}]`);
+  return closest?.getAttribute(prop) ?? fallbackValue;
 }
-var A = (e) => e.charAt(0).toUpperCase() + e.slice(1);
-var T = (e) => A(e.replaceAll(/([a-z])([A-Z])/gu, "$1 $2"));
-var v = /* @__PURE__ */ new Set(["ar", "bg", "bs", "ca", "cs", "da", "de", "el", "en", "es", "et", "fi", "fr", "he", "hr", "hu", "id", "it", "ja", "ko", "lt", "lv", "nl", "nb", "pl", "pt-BR", "pt-PT", "ro", "ru", "sk", "sl", "sr", "sv", "th", "tr", "uk", "vi", "zh-CN", "zh-HK", "zh-TW"]);
-var g = "en";
-async function j(e, t, n = "") {
-  let r = `${t}/${n}`, o = `${r}${e}.json`;
-  return u[o] ?? (u[o] = S(e, r)), await u[o];
-}
-var u = {};
-async function S(e, t) {
-  let n = `${t}${e}.json`;
-  try {
-    let r = await fetch(n);
-    if (r.ok)
-      return await r.json();
-  } catch (r) {
-    return console.error(r), E;
-  }
-  return e === g ? E : await S(g, t);
-}
-var E = new Proxy({}, { get: (e, t) => T(t.toString()) });
-function M(e) {
-  let t = m(e, "lang", navigator.language || g);
-  if (v.has(t))
-    return { lang: t, t9nLocale: t };
-  let n = t.slice(0, 2);
-  return { lang: t, t9nLocale: v.has(n) ? n : g };
-}
-function Y(e, t, n, r) {
-  let o, i = () => void P(e, t, r).then((s) => {
-    (o?.lang !== s.lang || o.t9nLocale !== s.t9nLocale || o.t9nStrings !== s.t9nStrings) && n(s), o = s;
-  }).catch(console.error);
-  return i(), b(e, ["lang"], i);
-}
-async function P(e, t, n = e.tagName.toLowerCase().replace("arcgis-", "")) {
-  let { lang: r, t9nLocale: o } = M(e), i = `${t}/${n}/t9n`, s = `${n}.t9n.`, a = await j(o, i, s);
-  return { lang: r, t9nLocale: o, t9nStrings: a };
-}
-
-// src/types.ts
-var controllerSymbol = Symbol("controller");
-
-// src/utils.ts
 function safeCall(callback) {
   try {
     return callback?.();
@@ -3051,6 +3039,108 @@ async function safeAsyncCall(callback) {
   }
   return void 0;
 }
+var capitalize = (string) => string.charAt(0).toUpperCase() + string.slice(1);
+var camelToHuman = (value) => capitalize(value.replaceAll(/([a-z])([A-Z])/gu, "$1 $2"));
+var supportedLocales = /* @__PURE__ */ new Set([
+  "ar",
+  "bg",
+  "bs",
+  "ca",
+  "cs",
+  "da",
+  "de",
+  "el",
+  "en",
+  "es",
+  "et",
+  "fi",
+  "fr",
+  "he",
+  "hr",
+  "hu",
+  "id",
+  "it",
+  "ja",
+  "ko",
+  "lt",
+  "lv",
+  "nl",
+  "nb",
+  "pl",
+  "pt-BR",
+  "pt-PT",
+  "ro",
+  "ru",
+  "sk",
+  "sl",
+  "sr",
+  "sv",
+  "th",
+  "tr",
+  "uk",
+  "vi",
+  "zh-CN",
+  "zh-HK",
+  "zh-TW"
+]);
+var defaultLocale = "en";
+async function fetchT9NStringsBundle(locale, assetsPath, prefix = "") {
+  const path = `${assetsPath}/${prefix}`;
+  const filePath = `${path}${locale}.json`;
+  t9nStringsCache[filePath] ?? (t9nStringsCache[filePath] = fetchBundle(locale, path));
+  return await t9nStringsCache[filePath];
+}
+var t9nStringsCache = {};
+async function fetchBundle(locale, path) {
+  const filePath = `${path}${locale}.json`;
+  try {
+    const response = await fetch(filePath);
+    if (response.ok)
+      return await response.json();
+  } catch (error) {
+    console.error(error);
+    return fallbackBundle;
+  }
+  if (locale === defaultLocale)
+    return fallbackBundle;
+  return await fetchBundle(defaultLocale, path);
+}
+var fallbackBundle = new Proxy(
+  {},
+  {
+    get: (_target, property) => camelToHuman(property.toString())
+  }
+);
+function getElementLocales(element) {
+  const lang = getElementAttribute(element, "lang", navigator.language || defaultLocale);
+  if (supportedLocales.has(lang)) {
+    return { lang, t9nLocale: lang };
+  }
+  const rootCode = lang.slice(0, 2);
+  return { lang, t9nLocale: supportedLocales.has(rootCode) ? rootCode : defaultLocale };
+}
+function startLocaleObserver(element, assetsPath, onUpdated, assetName) {
+  let result = void 0;
+  const callback = () => void updateComponentLocateState(element, assetsPath, assetName).then((newResult) => {
+    if (result?.lang !== newResult.lang || result.t9nLocale !== newResult.t9nLocale || result.t9nStrings !== newResult.t9nStrings)
+      onUpdated(newResult);
+    result = newResult;
+  }).catch(console.error);
+  callback();
+  return observeAncestorsMutation(element, ["lang"], callback);
+}
+async function updateComponentLocateState(element, assetsPath, assetName = element.tagName.toLowerCase().replace("arcgis-", "")) {
+  const { lang, t9nLocale } = getElementLocales(element);
+  const t9nAssetsPath = `${assetsPath}/${assetName}/t9n`;
+  const prefix = `${assetName}.t9n.`;
+  const t9nStrings = await fetchT9NStringsBundle(t9nLocale, t9nAssetsPath, prefix);
+  return { lang, t9nLocale, t9nStrings };
+}
+
+// src/types.ts
+var controllerSymbol = Symbol("controller");
+
+// src/utils.ts
 function extendObject(base, extend) {
   Object.entries(extend).forEach(([key, value]) => {
     if (key in base)
@@ -3100,6 +3190,7 @@ var ControllerInternals = class {
       return controller;
     };
     this.shouldBypassSetter = false;
+    this.shouldBypassGetter = false;
     this.shouldBypassReadonly = false;
     /**
      * A map from component instance or component element to component instance.
@@ -3109,7 +3200,7 @@ var ControllerInternals = class {
     this.elementToInstance = /* @__PURE__ */ new WeakMap();
   }
   /*
-   * Allow controllers to implicitly retrive which component they are in, to
+   * Allow controllers to implicitly retrieve which component they are in, to
    * improve DX (avoids the need to pass "this" explicitly for each controller)
    */
   setAmbientComponent(component) {
@@ -3121,7 +3212,7 @@ var ControllerInternals = class {
         this._ambientComponent = void 0;
     });
   }
-  retriveComponent(name) {
+  retrieveComponent(name) {
     if (this._ambientComponent === void 0)
       throw new Error(
         [
@@ -3154,7 +3245,7 @@ var ControllerInternals = class {
       this._ambientControllers = [];
     });
   }
-  retriveParentControllers() {
+  retrieveParentControllers() {
     return this._ambientControllers;
   }
   /*
@@ -3170,7 +3261,7 @@ var ControllerInternals = class {
         this._ambientChildController = void 0;
     });
   }
-  retriveAmbientChildController() {
+  retrieveAmbientChildController() {
     const controller = this._ambientChildController;
     this._ambientChildController = void 0;
     return controller;
@@ -3179,10 +3270,10 @@ var ControllerInternals = class {
    * Try to resolve a controller, without awaiting it's load
    */
   _useRefSync(value) {
-    const ambientChildController = this.retriveAmbientChildController();
+    const ambientChildController = this.retrieveAmbientChildController();
     if (ambientChildController !== void 0)
       return ambientChildController;
-    const component = Controller.internals.retriveComponent();
+    const component = Controller.internals.retrieveComponent();
     const controller = component.manager.internals.resolveExports(value);
     if (controller !== void 0)
       return controller;
@@ -3204,7 +3295,7 @@ function retrieveComponentMeta(component) {
   constructor.__registerControllers = void 0;
   if (typeof meta !== "object")
     throw new Error(
-      "Failed to retrive internal component meta. Make sure you have the useComponentsControllers() Rollup Plugin for Stencil Controllers configured in your Stencil config."
+      "Failed to retrieve internal component meta. Make sure you have the useComponentsControllers() Rollup Plugin for Stencil Controllers configured in your Stencil config."
     );
   component.manager.internals.meta = { members: meta[0], watchers: meta[1] };
 }
@@ -3222,8 +3313,8 @@ function parsePropertyValue(value, type = 8 /* Any */) {
     return value;
 }
 var makeMemberFilter = (filter) => (component) => {
-  const meta = component.manager.internals.meta;
-  return Object.entries(meta.members ?? {}).filter(([_name, [propType]]) => (propType & filter) !== 0).map(([name]) => name);
+  const members = component.manager.internals.meta?.members;
+  return Object.entries(members ?? {}).filter(([_name, [propType]]) => (propType & filter) !== 0).map(([name]) => name);
 };
 var getPropLikeMembers = makeMemberFilter(63 /* PropLike */);
 var getMemberType = (component, name) => component.manager.internals.meta.members?.[name]?.[0];
@@ -3251,7 +3342,7 @@ var watcherCallbackName = "dynamicWatcherCallback";
 var _a;
 var _Controller = class _Controller {
   constructor(component) {
-    this._ready = new h();
+    this._ready = new Deferred();
     this._lifecycleDisconnected = [];
     this.connectedCalled = false;
     this.willLoadCalled = false;
@@ -3266,7 +3357,7 @@ var _Controller = class _Controller {
     this._exports = makeProvisionalValue(this);
     this._exportWatchers = /* @__PURE__ */ new Set();
     const resolvedComponent = toControllerHost(
-      component ?? _Controller.internals.retriveComponent(new.target.name)
+      component ?? _Controller.internals.retrieveComponent(new.target.name)
     );
     Object.defineProperty(this, "component", {
       writable: false,
@@ -3372,7 +3463,7 @@ var _Controller = class _Controller {
    * Use cases:
    * - You have a controller and you want to make sure it's loaded before you
    *   try to use it
-   * - Your contoller is not using exports, so you wish to access some props on
+   * - Your controller is not using exports, so you wish to access some props on
    *   it directly
    * - You have a controller exports only, and you want to retrieve the
    *   controller itself. This is useful if you wish to call .watchExports() or
@@ -3388,7 +3479,7 @@ var _Controller = class _Controller {
    * of this function
    *
    * @example
-   * @Prop({mutable:true}) readOnly = this.manager.readOnly(true);
+   * @Prop() readOnly = this.manager.readOnly(true);
    *
    * someAction(): void {
    *   this.manager.bypassSetter(()=>{
@@ -3413,6 +3504,30 @@ var _Controller = class _Controller {
     _Controller.internals.shouldBypassReadonly = false;
     return result;
   }
+  /**
+   * Property reads inside of this function will bypass any custom getter you
+   * may have, and read the value directly from what's stored in Stencil.
+   *
+   * This also bypasses reactiveUtils integration - reading a property inside of
+   * bypassGetter won't make that property tracked.
+   *
+   * @example
+   * reactiveUtils.watch(
+   *   ()=>{
+   *     this.manager.bypassGetter(()=>{
+   *       console.log(this.someProp);
+   *     });
+   *     return this.prop;
+   *   },
+   *   console.log
+   * )
+   */
+  bypassGetter(callback) {
+    _Controller.internals.shouldBypassGetter = true;
+    const result = safeCall(callback);
+    _Controller.internals.shouldBypassGetter = false;
+    return result;
+  }
   /**
    * Like this.manager.getSet(), but can be called on any component's
    * state/prop from anywhere, rather than just from the default value
@@ -3427,25 +3542,14 @@ var _Controller = class _Controller {
    */
   genericGetSet(property, getSet) {
     var _a2, _b;
-    const classPrototype = Object.getPrototypeOf(this.component);
-    this.internals.getSetProxy(classPrototype, property, getSet, "class");
-    const htmlPrototype = Object.getPrototypeOf(this.component.el);
-    if (classPrototype !== htmlPrototype)
-      this.internals.getSetProxy(htmlPrototype, property, getSet, "html");
     const genericGetSet = getSet;
     if (genericGetSet.get !== void 0) {
       (_a2 = this.internals.getters)[property] ?? (_a2[property] = []);
-      if (getSet.order === "last")
-        this.internals.getters[property].splice(-1, 0, genericGetSet.get);
-      else
-        this.internals.getters[property].unshift(genericGetSet.get);
+      this.internals.getters[property].unshift(genericGetSet.get);
     }
     if (genericGetSet.set !== void 0) {
       (_b = this.internals.setters)[property] ?? (_b[property] = []);
-      if (getSet.order === "last")
-        this.internals.setters[property].splice(-1, 0, genericGetSet.set);
-      else
-        this.internals.setters[property].unshift(genericGetSet.set);
+      this.internals.setters[property].unshift(genericGetSet.set);
     }
   }
   // FEATURE: improve typings
@@ -3598,9 +3702,9 @@ function makeProvisionalValue(base) {
       console.error(`Trying to access "${prop.toString()}" on the controller before it's loaded. ${accessBeforeLoad}`);
       return void 0;
     },
-    set(target, prop, newValue, reciever) {
+    set(target, prop, newValue, receiver) {
       console.error(`Trying to set "${prop.toString()}" on the controller before it's loaded. ${accessBeforeLoad}`);
-      return Reflect.set(target, prop, newValue, reciever);
+      return Reflect.set(target, prop, newValue, receiver);
     }
   });
   return proxy3;
@@ -3640,13 +3744,14 @@ function trackPropertyKey(object, onResolved, defaultValue) {
     pendingTrackers.keyCount = keyCount;
   }
   pendingTrackers.callbacks.push((keys2) => {
+    const callback = (key2) => safeCall(() => onResolved(key2));
     const key = keys2[keyCount];
     if (key === void 0)
-      onResolved(void 0);
+      callback(void 0);
     else if (object[key] === defaultValue)
-      onResolved(key);
+      callback(key);
     else
-      onResolved(void 0);
+      callback(void 0);
   });
   return defaultValue;
 }
@@ -3706,7 +3811,7 @@ var ComponentInternals = class {
         queueMicrotask(() => this._firePropertyTrackers(void 0, void 0, void 0));
       this._trackedValue = defaultValue;
       this._keyTrackers.push(
-        (key, value, previousValue) => onResolved(defaultValue === value ? key : void 0, previousValue)
+        (key, value, previousValue) => safeCall(() => onResolved(defaultValue === value ? key : void 0, previousValue))
       );
       return defaultValue;
     };
@@ -3714,6 +3819,8 @@ var ComponentInternals = class {
     this._keyTrackers = [];
     this.getters = {};
     this.setters = {};
+    this.accessorGetter = {};
+    this.accessorSetter = {};
     this._exports = /* @__PURE__ */ new WeakMap();
     Object.defineProperty(this, "component", {
       writable: false,
@@ -3729,15 +3836,22 @@ var ComponentInternals = class {
     trackers.forEach((tracker) => tracker(key, value, oldValue));
   }
   /**
-   * Configure a getter or setter for a given @Prop/@State. Note, since props
-   * are defined on the prototype, they are shared between all instances of a
-   * component. Thus instead of passing function reference to
-   * Object.defineProperty, we use instance-owned getters and setters array.
+   * Configure a getter or setter for a given \@Prop/\@State
+   *
+   * Note, since props are defined on the prototype, they are shared between all
+   * instances of a component. Thus, instead of passing a reference to the
+   * getter/setter function, you should update the
+   * ComponentInternals.getters/setters properties, and then call getSetProxy
+   * to apply the changes to the prototype
    */
-  getSetProxy(prototype, name, {
-    get,
-    set
-  }, type) {
+  getSetProxy(property, hasGetter, hasSetter) {
+    const classPrototype = Object.getPrototypeOf(this.component);
+    this._getSetProxy(classPrototype, property, hasGetter, hasSetter, "class");
+    const htmlPrototype = Object.getPrototypeOf(this.component.el);
+    if (classPrototype !== htmlPrototype)
+      this._getSetProxy(htmlPrototype, property, hasGetter, hasSetter, "html");
+  }
+  _getSetProxy(prototype, name, hasGetter, hasSetter, type) {
     const component = this.component;
     const propType = getMemberType(component, name);
     const descriptor = Object.getOwnPropertyDescriptor(prototype, name);
@@ -3754,36 +3868,37 @@ var ComponentInternals = class {
     const { get: originalGet, set: originalSet } = descriptor;
     const isGetterAlreadyOverwritten = customAccessor in originalGet;
     const isSetterAlreadyOverwritten = customAccessor in originalSet;
-    const shouldOverwriteGet = !isGetterAlreadyOverwritten && typeof get === "function";
-    const shouldOverwriteSet = !isSetterAlreadyOverwritten && typeof set === "function";
+    const shouldOverwriteGet = !isGetterAlreadyOverwritten && hasGetter;
+    const shouldOverwriteSet = !isSetterAlreadyOverwritten && hasSetter;
     if (!shouldOverwriteGet && !shouldOverwriteSet)
       return;
     const finalGetter = shouldOverwriteGet ? function getter() {
       let value = originalGet.call(this);
+      if (Controller.internals.shouldBypassGetter)
+        return value;
       const component2 = Controller.internals.elementToInstance.get(this);
-      const getters = component2?.manager.internals.getters[name] ?? [];
+      const internals = component2.manager.internals;
+      value = internals.accessorGetter[name](value, name);
+      const getters = internals.getters[name] ?? emptyArray;
       for (let i = 0; i < getters.length; i++)
         value = getters[i](value, name);
       return value;
     } : originalGet;
     const finalSetter = shouldOverwriteSet ? function setter(rawNewValue) {
-      if (Controller.internals.shouldBypassSetter) {
-        originalSet.call(this, rawNewValue);
-        return;
-      }
       const oldValue = originalGet.call(this);
       let newValue = parsePropertyValue(rawNewValue, propType);
       const component2 = Controller.internals.elementToInstance.get(this);
-      const internals = component2?.manager.internals;
+      const internals = component2.manager.internals;
       if (newValue === oldValue)
         originalSet.call(this, rawNewValue);
       else {
-        const setters = internals?.setters[name] ?? [];
+        const setters = Controller.internals.shouldBypassSetter ? emptyArray : internals.setters[name] ?? emptyArray;
         for (let i = 0; i < setters.length; i++)
           newValue = setters[i](newValue, oldValue, name);
+        newValue = internals.accessorSetter[name](newValue, oldValue, name);
         originalSet.call(this, newValue);
       }
-      if ((internals?._keyTrackers.length ?? 0) > 0)
+      if (internals._keyTrackers.length > 0)
         internals?._firePropertyTrackers(name, rawNewValue, oldValue);
     } : originalSet;
     if (shouldOverwriteGet)
@@ -3811,59 +3926,42 @@ var ComponentInternals = class {
       return void 0;
   }
 };
+var emptyArray = [];
 var customAccessor = Symbol("controllersCustomAccessor");
 var nothing = Symbol("nothing");
-
-// ../core-adapter/dist/index.js
-var isAMD = typeof window !== "undefined" && "$arcgis" in window && typeof window.$arcgis === "object" && "import" in window.$arcgis;
-function isDefaultModule(module) {
-  return module.default !== void 0;
-}
-async function importCoreAccessor() {
-  if (isAMD) {
-    return await window.$arcgis.import("esri/core/Accessor");
-  }
-  const module = await import('./Accessor-U5QUEX2T-0dfda39e.js');
-  return isDefaultModule(module) ? module.default : module;
-}
-async function importCoreAccessorSupportDecorators() {
-  if (isAMD) {
-    return await window.$arcgis.import("esri/core/accessorSupport/decorators");
-  }
-  const module = await import('./decorators-5KFQ5FDO-7ae08fab.js');
-  return isDefaultModule(module) ? module.default : module;
-}
-
-// src/accessorIntegration.ts
 var accessorPromise = Promise.all([importCoreAccessor(), importCoreAccessorSupportDecorators()]);
-async function accessorIntegration(component) {
-  let accessor = void 0;
-  const getSet = {
-    get: (value, propertyName) => {
-      const accessorValue = accessor?.[propertyName];
-      return value ?? accessorValue ?? value;
-    },
-    set: (newValue, oldValue, propertyName) => {
+function reactiveUtilsIntegration(component) {
+  const members = getPropLikeMembers(component);
+  const internals = component.manager.internals;
+  members.forEach((name) => {
+    internals.accessorGetter[name] = defaultGetterSetter;
+    internals.accessorSetter[name] = defaultGetterSetter;
+    internals.getSetProxy(name, true, true);
+  });
+  return async (enabledMembers = members) => {
+    const [Accessor, { subclass, property }] = await accessorPromise;
+    class AccessorSubclass extends Accessor {
+    }
+    const getter = (_value, propertyName) => accessor[propertyName];
+    function setter(newValue, _oldValue, propertyName) {
       if (accessor !== void 0)
         accessor[propertyName] = newValue;
       return newValue;
     }
-  };
-  const members = getPropLikeMembers(component);
-  members.forEach((member) => component.manager.genericGetSet(member, getSet));
-  const [Accessor, { subclass, property }] = await accessorPromise;
-  return () => {
-    class AccessorSubclass extends Accessor {
-    }
-    members.forEach(
-      (name) => property({
-        value: component[name]
-      })(AccessorSubclass.prototype, name)
+    component.manager.bypassGetter(
+      () => enabledMembers.forEach((name) => {
+        internals.accessorGetter[name] = getter;
+        internals.accessorSetter[name] = setter;
+        property({
+          value: component[name]
+        })(AccessorSubclass.prototype, name);
+      })
     );
     const Subclass = subclass(component.el.tagName)(AccessorSubclass);
-    accessor = new Subclass();
+    const accessor = new Subclass();
   };
 }
+var defaultGetterSetter = (value) => value;
 
 // src/ControllerManager.ts
 var useControllerManager = (component) => new ControllerManager(component);
@@ -3885,12 +3983,12 @@ var ControllerManager = class extends GenericController {
     };
     extendObject(component, controllerHost);
     super(component);
-    this._connected = new h();
+    this._connected = new Deferred();
     this.internals = new ComponentInternals(this.component);
     this.connected = this._connected.promise;
     this.hasDestroy = false;
     this.destroyed = false;
-    this._updatePromise = new h();
+    this._updatePromise = new Deferred();
     this._originalLifecycles = {};
     /**
      * A magical solution to finding out what property name a given controller
@@ -3935,6 +4033,26 @@ var ControllerManager = class extends GenericController {
      * \@Prop() decorator or not
      */
     this.trackKey = this.internals.trackKey;
+    this._readonlySetter = (newValue, _oldValue, property) => {
+      if (Controller.internals.shouldBypassReadonly)
+        return newValue;
+      const isProp = getPropType(this.component, property) === "prop";
+      if (isProp)
+        forceUpdate(this.component);
+      throw new Error(
+        `Cannot assign to read-only property "${property}" of ${this.component.el.tagName.toLowerCase()}. Trying to assign "${String(
+          newValue
+        )}"`
+      );
+    };
+    /**
+     * In development, on hot module reload, controller would be re-initialized
+     * with all Props and State values persistent, but properties lost. This unsafe
+     * development-only API lets you set or get data for a controller that would
+     * persist across hot reloads.
+     */
+    this.devOnlySetPersistentControllerData = void 0 ;
+    this.devOnlyGetPersistentControllerData = void 0 ;
     this.component.manager = this;
     retrieveComponentMeta(component);
     this._controllers = controllers;
@@ -3947,8 +4065,7 @@ var ControllerManager = class extends GenericController {
     Object.defineProperty(component, "updateComplete", {
       get: async () => await this._updatePromise.promise
     });
-    this.component.addController(this);
-    this._accessorIntegrationReady = accessorIntegration(this.component);
+    this.internals.reactiveUtilsIntegration = reactiveUtilsIntegration(this.component);
     Controller.internals.setParentController(void 0);
     Controller.internals.setAmbientComponent(component);
     Controller.internals.elementToInstance.set(component.el, component);
@@ -4017,8 +4134,7 @@ var ControllerManager = class extends GenericController {
       this._preserveOnDisconnectWatcher();
   }
   async _componentWillLoad() {
-    const enableIntegration = await this._accessorIntegrationReady;
-    enableIntegration();
+    await this.internals.reactiveUtilsIntegration();
     await Promise.allSettled(
       Array.from(
         this._controllers,
@@ -4063,7 +4179,7 @@ var ControllerManager = class extends GenericController {
     );
     this._originalLifecycles.componentDidUpdate?.call(this.component);
     const updatePromise = this._updatePromise;
-    this._updatePromise = new h();
+    this._updatePromise = new Deferred();
     updatePromise.resolve(true);
   }
   async destroy() {
@@ -4104,18 +4220,6 @@ var ControllerManager = class extends GenericController {
   readonly(value) {
     return this.getSet(value, { set: this._readonlySetter });
   }
-  _readonlySetter(newValue, _oldValue, property) {
-    if (Controller.internals.shouldBypassReadonly)
-      return newValue;
-    const isProp = getPropType(this.component, property) === "prop";
-    if (isProp)
-      forceUpdate(this.component);
-    throw new Error(
-      `Cannot assign to read-only property "${property}" of ${this.component.el.tagName.toLowerCase()}. Trying to assign "${String(
-        newValue
-      )}"`
-    );
-  }
   /**
    * Listen for any component's @State()/@Prop() change, and mutate it's
    * value before it is set.
@@ -4171,7 +4275,7 @@ ${// Don't expose internal code in production, and keep bundle smaller:
 
 // src/proxyExports.ts
 var proxyExports = (Class) => (...args) => {
-  const ambientControllers = Controller.internals.retriveParentControllers();
+  const ambientControllers = Controller.internals.retrieveParentControllers();
   const instance = new Class(...args);
   const initialExports = instance.exports;
   Controller.internals.setParentController(ambientControllers.at(-1));
@@ -4250,20 +4354,21 @@ function useT9n({
 } = {}) {
   return makeController((component, controller) => {
     controller.onLifecycle(
-      () => Y(
+      () => startLocaleObserver(
         component.el,
         getAssetPath("./assets"),
         ({ t9nLocale, t9nStrings, lang }) => {
           controller.exports = { ...t9nStrings, _lang: lang, _t9nLocale: t9nLocale };
-          if (typeof t9nStrings.widgetLabel === "string" && "label" in component)
-            component.label ?? (component.label = t9nStrings.widgetLabel);
+          const label = t9nStrings.componentLabel ?? t9nStrings.widgetLabel;
+          if (typeof label === "string" && "label" in component && component.label == null)
+            component.label ?? (component.label = label);
         },
         name
       )
     );
     if (blocking)
       return controller.ready;
-    const locale = M(component.el);
+    const locale = getElementLocales(component.el);
     return { _lang: locale.lang, _t9nLocale: locale.t9nLocale };
   });
 }
@@ -4308,18 +4413,18 @@ function setupMonacoEnvironment(assetsPath) {
                     break;
             }
             // If we have a relative path or we are on same orgin, we can use the default js implementation
-            if (!de(url) || ge(url, globalThis.location.href, true)) {
+            if (!isURL(url) || hasSameOrigin(url, globalThis.location.href, true)) {
                 return new Worker(url, { name: languageId });
             }
             // For cross orgin, we will load the worker code as a string and manufacture a blob
             const esriRequest = await importRequest();
             const response = await esriRequest(url, {
-                responseType: "text"
+                responseType: "text",
             });
             return new Worker(URL.createObjectURL(new Blob([response.data], {
-                type: "text/javascript"
+                type: "text/javascript",
             })));
-        }
+        },
     };
 }
 
@@ -4358,9 +4463,9 @@ function setupArcadeTheme() {
                 { token: "keyword.arc", foreground: colors.keyword },
                 { token: "identifier.arc", foreground: colors.identifier },
                 { token: "number.arc", foreground: colors.number },
-                { token: "string.arc", foreground: colors.string }
+                { token: "string.arc", foreground: colors.string },
             ],
-            colors: {}
+            colors: {},
         });
     });
 }
@@ -4415,14 +4520,14 @@ async function getArcadeWorker(uri) {
  * @returns arcade mode module
  */
 async function getMode() {
-    return await import('./arcade-mode-45fc67da.js');
+    return await import('./arcade-mode-5aef1763.js');
 }
 // Register the language in Monaco
 languages.register({
     id: arcadeDefaults.languageId,
     aliases: ["Arcade", "arcade"],
     extensions: [".arc"],
-    mimetypes: ["application/arcade"]
+    mimetypes: ["application/arcade"],
 });
 // An event emitted when a language is first time needed
 languages.onLanguage(arcadeDefaults.languageId, () => {
@@ -4552,7 +4657,7 @@ const ArcgisArcadeApi = class {
         // When switching between flow the same reference is reused
         this._flowObserver = new MutationObserver(() => {
             // Get the last panel and try to set focus on the input element
-            W(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
+            setFocusOnElement(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
         });
         this._flowObserver.observe(ref, { attributes: true, attributeFilter: ["id"], childList: true });
     }
@@ -4563,14 +4668,14 @@ const ArcgisArcadeApi = class {
         if (!filteredApiItems.length) {
             return null;
         }
-        return (h$1("calcite-list-item-group", { heading: category.title }, filteredApiItems.map((apiItem) => (h$1("calcite-list-item", { label: oe(apiItem.completion.detail), onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": apiItem }, h$1("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "Expand", icon: "chevron-right", iconFlipRtl: true, scale: "s", onClick: this._selectItem, "data-item": apiItem }))))));
+        return (h("calcite-list-item-group", { heading: category.title }, filteredApiItems.map((apiItem) => (h("calcite-list-item", { label: addLTRMark(apiItem.completion.detail), onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": apiItem }, h("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "Expand", icon: "chevron-right", iconFlipRtl: true, scale: "s", onClick: this._selectItem, "data-item": apiItem }))))));
     }
     renderApiItemFlowItem() {
         const apiItem = this._selectedApiItem;
         if (!apiItem) {
             return null;
         }
-        return (h$1("calcite-flow-item", { heading: this.messages.constantsandfunctions, beforeBack: this._unselectItem, closable: true, onCalciteFlowItemClose: this._emitClose }, this.hideDocumentationActions ? null : (h$1("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", scale: "s", href: apiItem.link, target: "Arcade Help", "icon-start": "information" }, this.messages.moreinformation)), h$1("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", "icon-start": "code", scale: "s", onClick: this._emitItemSelectedAndClose, "data-item": apiItem, ref: (e) => void e?.setFocus() }, this.messages.insert ?? "Insert"), h$1("calcite-block", { open: true, heading: oe(apiItem.completion.detail) }, h$1("div", { innerHTML: convertMarkdownString(apiItem.completion.documentation) }), apiItem.examples ? (h$1("div", { ref: (e) => {
+        return (h("calcite-flow-item", { heading: this.messages.constantsandfunctions, beforeBack: this._unselectItem, closable: true, onCalciteFlowItemClose: this._emitClose }, this.hideDocumentationActions ? null : (h("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", scale: "s", href: apiItem.link, target: "Arcade Help", "icon-start": "information" }, this.messages.moreinformation)), h("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", "icon-start": "code", scale: "s", onClick: this._emitItemSelectedAndClose, "data-item": apiItem, ref: (e) => void e?.setFocus() }, this.messages.insert ?? "Insert"), h("calcite-block", { open: true, heading: addLTRMark(apiItem.completion.detail) }, h("div", { innerHTML: convertMarkdownString(apiItem.completion.documentation) }), apiItem.examples ? (h("div", { ref: (e) => {
                 if (!e) {
                     return;
                 }
@@ -4581,7 +4686,7 @@ const ArcgisArcadeApi = class {
     render() {
         const categories = (this._apiLibrary ?? []).map((apiCategory) => this.renderApiCategory(apiCategory));
         const empty = categories.every((g) => !g);
-        return (h$1(Host, null, h$1("style", null, this._colorizeStyle), h$1("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, h$1("calcite-flow-item", { heading: this.messages.constantsandfunctions, closable: true, onCalciteFlowItemClose: this._emitClose }, h$1("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), this._preparingApi ? (h$1("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "Loading" })) : (h$1("calcite-list", null, empty ? h$1("div", { class: "notice-container" }, this.messages.noitems ?? "No items") : categories))), this.renderApiItemFlowItem())));
+        return (h(Host, null, h("style", null, this._colorizeStyle), h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { heading: this.messages.constantsandfunctions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), this._preparingApi ? (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 ?? "No items") : categories))), this.renderApiItemFlowItem())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -4771,7 +4876,7 @@ async function executeScript(editorProfile, script, testContext, console) {
         // Setup an executor with the script
         const arcade = await importArcade();
         const executor = await arcade.createArcadeExecutor(script ?? "", {
-            variables: editorProfile?.variables ?? []
+            variables: editorProfile?.variables ?? [],
         });
         // We want to measure the execution time
         const t1 = performance.now();
@@ -4781,7 +4886,7 @@ async function executeScript(editorProfile, script, testContext, console) {
             spatialReference,
             timeZone,
             rawOutput: true,
-            console
+            console,
         };
         // Execute the script
         const scriptOutput = await executor.executeAsync(profileVariableInstances, executeContext);
@@ -4805,7 +4910,7 @@ async function executeScript(editorProfile, script, testContext, console) {
             error,
             timeStamp,
             compilationTime: 0,
-            executionTime: 0
+            executionTime: 0,
         };
     }
 }
@@ -4818,8 +4923,8 @@ const ArcgisArcadeEditor = class {
         this.scriptChange = createEvent(this, "scriptChange", 3);
         this.diagnosticsChange = createEvent(this, "diagnosticsChange", 3);
         this.manager = useControllerManager(this);
-        this._componentReadyDefer = new h$2();
-        this._modelId = Q();
+        this._componentReadyDefer = new Deferred$1();
+        this._modelId = generateGuid();
         this._editorProfilePromise = Promise.resolve(undefined);
         this._disposables = [];
         this._executeScript = async () => {
@@ -4899,7 +5004,7 @@ const ArcgisArcadeEditor = class {
     }
     _snippetChanged() {
         arcadeDefaults.updateApiContextForModel(this._modelId, {
-            snippets: this.snippets
+            snippets: this.snippets,
         });
     }
     // #endregion
@@ -4948,7 +5053,7 @@ const ArcgisArcadeEditor = class {
      * @internal
      */
     async updateThemeColors(colorRules) {
-        const theme = _(this.el);
+        const theme = getElementTheme(this.el);
         updateThemeColors(theme, colorRules);
         if (colorRules === undefined) {
             colorRulesKeys.forEach((key) => {
@@ -4998,7 +5103,7 @@ const ArcgisArcadeEditor = class {
                 if (this.testData) {
                     this._executeScript().catch(console.error);
                 }
-            }
+            },
         });
         await this._codeEditorElt?.setFocus();
     }
@@ -5020,7 +5125,7 @@ const ArcgisArcadeEditor = class {
             // 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
+                snippets: this.snippets,
             });
             // Get the corresponding editor profile for the model.
             // The editor profile contains the specialized profile for the UI.
@@ -5040,41 +5145,41 @@ const ArcgisArcadeEditor = class {
         if (!this.testData) {
             return null;
         }
-        return (h$1("calcite-action-bar", { class: "main-action-bar", layout: "horizontal", scale: "s", expanded: true, "expand-disabled": true }, h$1("calcite-action-group", { scale: "s" }, h$1("calcite-action", { text: this.messages.run ?? "Run", "text-enabled": true, icon: "play", scale: "s", loading: this._preparingProfile, onClick: this._executeScript }), this._executionResult ? (h$1("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 ?? "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)));
     }
     //#endregion
     //#region Render Main Panel
     renderMainPanel() {
-        return (h$1("arcgis-code-editor", { class: "flex-adjustable", language: arcadeDefaults.languageId, value: this.script ?? "", modelId: this._modelId, options: this.editorOptions, onValueChange: this._emitScriptChange, ref: (e) => (this._codeEditorElt = e) }));
+        return (h("arcgis-code-editor", { class: "flex-adjustable", language: arcadeDefaults.languageId, value: this.script ?? "", modelId: this._modelId, options: this.editorOptions, onValueChange: this._emitScriptChange, ref: (e) => (this._codeEditorElt = e) }));
     }
     //#endregion
     //#region Rendering the Action Bar
-    renderAction({ id, label, icon, active, panelName, onClick = this._toggleSidePanel }) {
-        return (h$1(Fragment, null, h$1("calcite-action", { id: id, text: label, icon: icon, active: active, onClick: onClick, "data-panel-name": panelName }), !this.sideActionBarExpanded && (h$1("calcite-tooltip", { label: label, "reference-element": id }, h$1("span", null, label)))));
+    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)))));
     }
     renderSideActionBar() {
         if (this.hideSideBar) {
             return null;
         }
-        return (h$1("calcite-action-bar", { class: "side-action-bar border-inline-start", expanded: !!this.sideActionBarExpanded, position: "end", onCalciteActionBarToggle: this._toggleSideActionBarExpanded }, h$1("calcite-action-group", null, this.renderAction({
+        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",
             icon: "profile-variables",
             active: this.openedSidePanel === "variables",
-            panelName: "variables"
+            panelName: "variables",
         }), this.renderAction({
             id: "function-action",
             label: this.messages.constantsandfunctions ?? "Constants and functions",
             icon: "function",
             active: this.openedSidePanel === "api",
-            panelName: "api"
+            panelName: "api",
         }), this.suggestions?.length
             ? this.renderAction({
                 id: "suggestions-action",
                 label: this.messages.suggestions ?? "Suggestions",
                 icon: "lightbulb",
                 active: this.openedSidePanel === "suggestions",
-                panelName: "suggestions"
+                panelName: "suggestions",
             })
             : null, this.hideDocumentationActions
             ? null
@@ -5084,7 +5189,7 @@ const ArcgisArcadeEditor = class {
                 icon: "question",
                 active: false,
                 panelName: "none",
-                onClick: this._openArcadeHelp
+                onClick: this._openArcadeHelp,
             }))));
     }
     //#endregion
@@ -5095,11 +5200,11 @@ const ArcgisArcadeEditor = class {
         }
         switch (this.openedSidePanel) {
             case "api":
-                return (h$1("arcgis-arcade-api", { class: "side-panel flex-panel border-inline-start", modelId: this._modelId, hideDocumentationActions: this.hideDocumentationActions, onItemSelected: this._insertAsSnippet, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
+                return (h("arcgis-arcade-api", { class: "side-panel flex-panel border-inline-start", modelId: this._modelId, hideDocumentationActions: this.hideDocumentationActions, onItemSelected: this._insertAsSnippet, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
             case "variables":
-                return (h$1("arcgis-arcade-variables", { class: "side-panel flex-panel border-inline-start", loading: this._preparingProfile, modelId: this._modelId, onItemSelected: this._insertAsText, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
+                return (h("arcgis-arcade-variables", { class: "side-panel flex-panel border-inline-start", loading: this._preparingProfile, modelId: this._modelId, onItemSelected: this._insertAsText, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
             case "suggestions":
-                return (h$1("arcgis-arcade-suggestions", { class: "side-panel flex-panel border-inline-start", suggestions: this.suggestions, onItemSelected: this._insertAsText, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
+                return (h("arcgis-arcade-suggestions", { class: "side-panel flex-panel border-inline-start", suggestions: this.suggestions, onItemSelected: this._insertAsText, onClose: this._toggleSidePanel, "data-panel-name": "none" }));
             default:
                 return null;
         }
@@ -5110,12 +5215,12 @@ const ArcgisArcadeEditor = class {
         if (!this._showExecutionPanel) {
             return null;
         }
-        return (h$1("arcgis-arcade-results", { class: "flex-adjustable", openedResultPanel: this._resultPanel, loading: this._executingScript, result: this._executionResult, consoleLogs: this._consoleLogs, onOpenedResultPanelChange: this._onResultPanelChange, onClose: this._onExecutionPanelClose }));
+        return (h("arcgis-arcade-results", { class: "flex-adjustable", openedResultPanel: this._resultPanel, loading: this._executingScript, result: this._executionResult, consoleLogs: this._consoleLogs, onOpenedResultPanelChange: this._onResultPanelChange, onClose: this._onExecutionPanelClose }));
     }
     //#endregion
     //#region Render
     render() {
-        return (h$1(Host, null, this.renderMainActionBar(), h$1("div", { class: "flex-row flex-adjustable" }, h$1("div", { class: "flex-column flex-adjustable" }, this.renderMainPanel(), this.renderResultsPanel()), this.renderSidePanel(), this.renderSideActionBar())));
+        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())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -5134,55 +5239,55 @@ const treeProps = {
     lines: true,
     selectionMode: "none",
     scale: "s",
-    onCalciteTreeSelect: (e) => e.target.selectedItems.forEach((itemElt) => (itemElt.selected = false))
+    onCalciteTreeSelect: (e) => e.target.selectedItems.forEach((itemElt) => (itemElt.selected = false)),
 };
 const expandableTreeItemProps = {
     onClick: (e) => {
         const item = e.currentTarget;
         item.expanded = !item.expanded;
-    }
+    },
 };
 //#endregion
 //#region Helper Functions
 function renderDictionaryProperty(key) {
-    return (h$1(Fragment, null, h$1("span", { class: "dictionary-property" }, key), h$1("span", null, ":\u00A0")));
+    return (h(Fragment, null, h("span", { class: "dictionary-property" }, key), h("span", null, ":\u00A0")));
 }
 function renderDictionaryAsJsonTree(value, subtree = false) {
-    return (h$1("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h$1("calcite-tree-item", { class: "string-value" }, JSON.stringify(value.castAsJson(), undefined, 2))));
+    return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", { class: "string-value" }, JSON.stringify(value.castAsJson(), undefined, 2))));
 }
 function renderGeometryTree(value, subtree = false) {
-    return (h$1("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h$1("calcite-tree-item", null, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty("type"), value.type)), h$1("calcite-tree-item", null, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty("value"), h$1("span", { class: "string-value" }, JSON.stringify(value, undefined, 2))))));
+    return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, renderDictionaryProperty("type"), value.type)), h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, renderDictionaryProperty("value"), h("span", { class: "string-value" }, JSON.stringify(value, undefined, 2))))));
 }
 function renderSimpleValue(arcadeResult) {
     switch (arcadeResult.type) {
         case "unknown":
         case "null":
-            return h$1("span", { class: "constant-value" }, arcadeResult.type);
+            return h("span", { class: "constant-value" }, arcadeResult.type);
         case "text":
-            return h$1("span", { class: "string-value" }, te(arcadeResult.value));
+            return h("span", { class: "string-value" }, quoteString(arcadeResult.value));
         case "number":
-            return h$1("span", { class: "number-value" }, arcadeResult.value.toString());
+            return h("span", { class: "number-value" }, arcadeResult.value.toString());
         case "boolean":
-            return h$1("span", { class: "constant-value" }, arcadeResult.value.toString());
+            return h("span", { class: "constant-value" }, arcadeResult.value.toString());
         case "date":
-            return h$1("span", { class: "date-value" }, formatArcadeResultDate(arcadeResult));
+            return h("span", { class: "date-value" }, formatArcadeResultDate(arcadeResult));
         case "dateOnly":
-            return h$1("span", { class: "string-value" }, te(formatArcadeResultDateOnly(arcadeResult)));
+            return h("span", { class: "string-value" }, quoteString(formatArcadeResultDateOnly(arcadeResult)));
         case "time":
-            return h$1("span", { class: "string-value" }, te(formatArcadeResultTimeOnly(arcadeResult)));
+            return h("span", { class: "string-value" }, quoteString(formatArcadeResultTimeOnly(arcadeResult)));
         default:
             return null;
     }
 }
 function renderFeatureSetTable(arcadeResult) {
     const fields = supportedFields(arcadeResult.value.fields);
-    return (h$1("table", null, h$1("thead", null, h$1("tr", null, fields.map((field) => (h$1("th", null, field.name))))), h$1("tbody", null, arcadeResult.features.map((feature) => (h$1("tr", null, fields.map((field) => {
+    return (h("table", null, h("thead", null, h("tr", null, fields.map((field) => (h("th", null, field.name))))), h("tbody", null, arcadeResult.features.map((feature) => (h("tr", null, fields.map((field) => {
         try {
             const arcadeResult = valueToArcadeResult(feature.field(field.name));
-            return h$1("td", null, renderSimpleValue(arcadeResult));
+            return h("td", null, renderSimpleValue(arcadeResult));
         }
         catch {
-            return h$1("td", null);
+            return h("td", null);
         }
     })))))));
 }
@@ -5223,96 +5328,96 @@ const ArcgisArcadeResults = class {
             return null;
         }
         if (this.loading && !this.consoleLogs?.length) {
-            return h$1("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+            return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
         }
-        return (h$1("div", { class: "console-logs-container ltr-container" }, this.consoleLogs?.length ? this.consoleLogs.map((log) => h$1("p", null, log)) : h$1("p", null, this.messages.consolemessage)));
+        return (h("div", { class: "console-logs-container ltr-container" }, this.consoleLogs?.length ? this.consoleLogs.map((log) => h("p", null, log)) : h("p", null, this.messages.consolemessage)));
     }
     renderLogPanel() {
         if (this.openedResultPanel !== "log") {
             return null;
         }
         if (this.loading) {
-            return h$1("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+            return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
         }
         const iconClass = this.result?.type === "error" ? "color-error" : "color-success";
-        return (h$1("calcite-list", null, this.result ? (h$1(Fragment, null, h$1("calcite-list-item", { label: re(this.messages.lastexecutionformat, {
+        return (h("calcite-list", null, this.result ? (h(Fragment, null, h("calcite-list-item", { label: setValuesInString(this.messages.lastexecutionformat, {
                 timeStamp: new Intl.DateTimeFormat(this.messages._t9nLocale, {
                     dateStyle: "medium",
-                    timeStyle: "medium"
-                }).format(this.result.timeStamp)
-            }) }, h$1("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h$1("calcite-list-item", { label: re(this.messages.compilationtimeformat, {
+                    timeStyle: "medium",
+                }).format(this.result.timeStamp),
+            }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: setValuesInString(this.messages.compilationtimeformat, {
                 time: new Intl.NumberFormat(this.messages._t9nLocale, {
                     style: "unit",
                     unit: "millisecond",
-                    maximumFractionDigits: 2
-                }).format(this.result.compilationTime ?? 0)
-            }) }, h$1("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h$1("calcite-list-item", { label: re(this.messages.executiontimeformat, {
+                    maximumFractionDigits: 2,
+                }).format(this.result.compilationTime ?? 0),
+            }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: setValuesInString(this.messages.executiontimeformat, {
                 time: new Intl.NumberFormat(this.messages._t9nLocale, {
                     style: "unit",
                     unit: "millisecond",
-                    maximumFractionDigits: 2
-                }).format(this.result.executionTime ?? 0)
-            }) }, h$1("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })))) : (h$1("calcite-list-item", { label: this.messages.runscriptmessage ?? "No output, run the script once." }, h$1("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: "color-info" })))));
+                    maximumFractionDigits: 2,
+                }).format(this.result.executionTime ?? 0),
+            }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })))) : (h("calcite-list-item", { label: this.messages.runscriptmessage ?? "No output, run the script once." }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: "color-info" })))));
     }
     renderOutputPanel() {
         if (this.openedResultPanel !== "output") {
             return null;
         }
         if (this.loading) {
-            return h$1("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+            return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
         }
         switch (this.result?.type) {
             case "error":
-                return (h$1("div", { class: "result-value-simple flex-adjustable" }, re(this.messages.executionerrorformat, {
-                    message: this.result.value
+                return (h("div", { class: "result-value-simple flex-adjustable" }, setValuesInString(this.messages.executionerrorformat, {
+                    message: this.result.value,
                 })));
             case "null":
             case "unknown":
-                return h$1("div", { class: "result-value-simple ltr-container" }, renderSimpleValue(this.result));
+                return h("div", { class: "result-value-simple ltr-container" }, renderSimpleValue(this.result));
             case "text":
             case "number":
             case "date":
             case "dateOnly":
             case "time":
             case "boolean":
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("span", { class: "value-type" }, this.result.type, ":\u00A0"), renderSimpleValue(this.result)));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("span", { class: "value-type" }, this.result.type, ":\u00A0"), renderSimpleValue(this.result)));
             case "array": {
                 const items = this.result.value ?? [];
                 const firstItems = items.slice(0, MaxArrayItems);
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("calcite-tree", { ...treeProps }, h$1("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, this.renderArrayHeader(this.result)), this.renderArrayTree(firstItems, true)))));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("calcite-tree", { ...treeProps }, h("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderArrayHeader(this.result)), this.renderArrayTree(firstItems, true)))));
             }
             case "geometry":
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("calcite-tree", { ...treeProps }, h$1("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, this.result.type), renderGeometryTree(this.result.value, true)))));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("calcite-tree", { ...treeProps }, h("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.result.type), renderGeometryTree(this.result.value, true)))));
             case "attachment":
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("calcite-tree", { ...treeProps }, h$1("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, this.result.type), renderDictionaryAsJsonTree(this.result.value, true)))));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("calcite-tree", { ...treeProps }, h("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.result.type), renderDictionaryAsJsonTree(this.result.value, true)))));
             case "feature":
             case "dictionary":
             case "portal":
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("calcite-tree", { ...treeProps }, h$1("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, this.result.type), this.renderDictionaryTree(this.result.value, true)))));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("calcite-tree", { ...treeProps }, h("calcite-tree-item", { expanded: true, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.result.type), this.renderDictionaryTree(this.result.value, true)))));
             case "featureSet":
-                return (h$1("div", { class: "result-value-table ltr-container" }, this.renderFeatureSetLabel(this.result), renderFeatureSetTable(this.result)));
+                return (h("div", { class: "result-value-table ltr-container" }, this.renderFeatureSetLabel(this.result), renderFeatureSetTable(this.result)));
             case "knowledgeGraph":
-                return (h$1("div", { class: "result-value-simple ltr-container" }, h$1("span", { class: "value-type" }, this.result.type, ":\u00A0"), h$1("span", { class: "string-value" }, this.result.value.url)));
+                return (h("div", { class: "result-value-simple ltr-container" }, h("span", { class: "value-type" }, this.result.type, ":\u00A0"), h("span", { class: "string-value" }, this.result.value.url)));
             default:
-                return h$1("div", { class: "result-value-simple flex-adjustable ltr-container" }, this.messages.runscriptmessage);
+                return h("div", { class: "result-value-simple flex-adjustable ltr-container" }, this.messages.runscriptmessage);
         }
     }
     renderArrayHeader(arcadeResult) {
         const items = arcadeResult.value ?? [];
         const leftoverCount = Math.max(items.length - MaxArrayItems, 0);
-        return (h$1(Fragment, null, h$1("span", null, `${arcadeResult.type}(${items.length ?? 0})`), leftoverCount > 0 ? (h$1("span", null, "\u00A0", re(this.messages.showingfirstitemsformat, {
-            count: MaxArrayItems.toString()
+        return (h(Fragment, null, h("span", null, `${arcadeResult.type}(${items.length ?? 0})`), leftoverCount > 0 ? (h("span", null, "\u00A0", setValuesInString(this.messages.showingfirstitemsformat, {
+            count: MaxArrayItems.toString(),
         }))) : null));
     }
     renderArrayTree(items, subtree = false) {
-        return (h$1("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, items.map((value, key) => {
+        return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, items.map((value, key) => {
             const arcadeValue = valueToArcadeResult(value);
             return this.renderTreeItem(arcadeValue, key, !subtree);
         })));
     }
     renderDictionaryTree(value, subtree = false) {
         const geometry = value.geometry?.();
-        return (h$1("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, value.keys().map((key) => {
+        return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, value.keys().map((key) => {
             const arcadeValue = valueToArcadeResult(value.field(key));
             return this.renderTreeItem(arcadeValue, key);
         }), geometry ? this.renderTreeItem({ type: "geometry", value: geometry }, "geometry") : null));
@@ -5327,31 +5432,31 @@ const ArcgisArcadeResults = class {
             case "dateOnly":
             case "time":
             case "boolean":
-                return (h$1("calcite-tree-item", null, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty(key), renderSimpleValue(arcadeResult))));
+                return (h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, renderDictionaryProperty(key), renderSimpleValue(arcadeResult))));
             case "array": {
                 const items = arcadeResult.value ?? [];
                 const firstItems = items.slice(0, MaxArrayItems);
-                return (h$1("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty(key), this.renderArrayHeader(arcadeResult)), this.renderArrayTree(firstItems, true)));
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, renderDictionaryProperty(key), this.renderArrayHeader(arcadeResult)), this.renderArrayTree(firstItems, true)));
             }
             case "geometry":
-                return (h$1("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h$1("span", null, arcadeResult.type)), renderGeometryTree(arcadeResult.value, true)));
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h("span", null, arcadeResult.type)), renderGeometryTree(arcadeResult.value, true)));
             case "attachment":
-                return (h$1("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h$1("span", null, arcadeResult.type)), renderDictionaryAsJsonTree(arcadeResult.value, true)));
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h("span", null, arcadeResult.type)), renderDictionaryAsJsonTree(arcadeResult.value, true)));
             case "feature":
             case "dictionary":
             case "portal":
-                return (h$1("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h$1("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h$1("span", null, arcadeResult.type)), this.renderDictionaryTree(arcadeResult.value, true)));
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderDictionaryTree(arcadeResult.value, true)));
             default:
                 return null;
         }
     }
     renderFeatureSetLabel(arcadeResult) {
-        return (h$1("div", { class: "value-type" }, h$1("span", null, arcadeResult.type, ":"), arcadeResult.features.length >= BatchSize ? (h$1("span", null, "\u00A0", re(this.messages.showingfirstitemsformat, {
-            count: BatchSize.toString()
+        return (h("div", { class: "value-type" }, h("span", null, arcadeResult.type, ":"), arcadeResult.features.length >= BatchSize ? (h("span", null, "\u00A0", setValuesInString(this.messages.showingfirstitemsformat, {
+            count: BatchSize.toString(),
         }))) : null));
     }
     render() {
-        return (h$1(Host, null, h$1("header", { class: "flex-row" }, h$1("calcite-action-bar", { class: "flex-adjustable", layout: "horizontal", scale: "s", expanded: true, "expand-disabled": true }, h$1("calcite-action-group", { scale: "s" }, h$1("calcite-action", { active: this.openedResultPanel === "output", text: this.messages.output ?? "Output", "text-enabled": true, scale: "s", icon: "list-show-all", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "output" }), h$1("calcite-action", { active: this.openedResultPanel === "console", text: this.messages.console ?? "Console", "text-enabled": true, scale: "s", icon: "console", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "console" }), h$1("calcite-action", { active: this.openedResultPanel === "log", text: this.messages.log ?? "Log", "text-enabled": true, scale: "s", icon: "list", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "log" }))), h$1("calcite-action", { scale: "s", icon: "x", text: this.messages.close ?? "", onClick: this._emitClose })), h$1("article", { class: "flex-adjustable" }, this.loading ? (h$1("calcite-loader", { scale: "s", type: "indeterminate", label: "" })) : (h$1("div", { class: "flex-column y-scrollable-container" }, this.renderOutputPanel(), this.renderConsolePanel(), this.renderLogPanel())))));
+        return (h(Host, null, h("header", { class: "flex-row" }, h("calcite-action-bar", { class: "flex-adjustable", layout: "horizontal", scale: "s", expanded: true, "expand-disabled": true }, h("calcite-action-group", { scale: "s" }, h("calcite-action", { active: this.openedResultPanel === "output", text: this.messages.output ?? "Output", "text-enabled": true, scale: "s", icon: "list-show-all", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "output" }), h("calcite-action", { active: this.openedResultPanel === "console", text: this.messages.console ?? "Console", "text-enabled": true, scale: "s", icon: "console", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "console" }), h("calcite-action", { active: this.openedResultPanel === "log", text: this.messages.log ?? "Log", "text-enabled": true, scale: "s", icon: "list", iconFlipRtl: true, onClick: this._switchResultPanel, "data-panel-name": "log" }))), h("calcite-action", { scale: "s", icon: "x", text: this.messages.close ?? "", onClick: this._emitClose })), h("article", { class: "flex-adjustable" }, this.loading ? (h("calcite-loader", { scale: "s", type: "indeterminate", label: "" })) : (h("div", { class: "flex-column y-scrollable-container" }, this.renderOutputPanel(), this.renderConsolePanel(), this.renderLogPanel())))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -5439,7 +5544,7 @@ const ArcgisArcadeSuggestions = class {
         // When switching between flow the same reference is reused
         this._flowObserver = new MutationObserver(() => {
             // Get the last panel and try to set focus on the input element
-            W(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
+            setFocusOnElement(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
         });
         this._flowObserver.observe(ref, { attributes: true, attributeFilter: ["id"], childList: true });
     }
@@ -5450,26 +5555,26 @@ const ArcgisArcadeSuggestions = class {
             return null;
         }
         if (isSuggestionGroups(this.suggestions)) {
-            return this.suggestions.map((suggestionGroup) => (h$1("calcite-list-item-group", { heading: suggestionGroup.label }, this.renderSuggestionListItems(suggestionGroup.suggestions))));
+            return this.suggestions.map((suggestionGroup) => (h("calcite-list-item-group", { heading: suggestionGroup.label }, this.renderSuggestionListItems(suggestionGroup.suggestions))));
         }
         return this.renderSuggestionListItems(this.suggestions);
     }
     renderSuggestionListItems(suggestions) {
         suggestions = filterCollection(suggestions, "label", this._filterValue);
         if (!suggestions.length) {
-            return h$1("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
         }
-        return suggestions.map((suggestion) => (h$1("calcite-list-item", { label: suggestion.label, description: suggestion.description, onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": suggestion }, h$1("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "", scale: "s", icon: "chevron-right", iconFlipRtl: true, onClick: this._showSuggestionDetail, "data-item": suggestion }))));
+        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 }))));
     }
     renderSuggestionFlowItem() {
         const suggestion = this._selectedSuggestion;
         if (!suggestion) {
             return null;
         }
-        return (h$1("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose, beforeBack: this._beforeBack }, h$1("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$1("calcite-block", { open: true, heading: suggestion.label, description: suggestion.description }, h$1("div", { innerHTML: convertMarkdownString(suggestion.documentation) }), h$1("pre", null, h$1("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", "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) })))));
     }
     render() {
-        return (h$1(Host, null, h$1("style", null, this._colorizeStyle), h$1("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, h$1("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose }, h$1("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), h$1("calcite-list", null, this.renderSuggestionGroups())), this.renderSuggestionFlowItem())));
+        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())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -5560,7 +5665,7 @@ const ArcgisArcadeVariables = class {
         // When switching between flow the same reference is reused
         this._flowObserver = new MutationObserver(() => {
             // Get the last panel and try to set focus on the input element
-            W(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
+            setFocusOnElement(ref.querySelector("calcite-flow-item:last-child"), "calcite-input");
         });
         this._flowObserver.observe(ref, { attributes: true, attributeFilter: ["id"], childList: true });
     }
@@ -5589,15 +5694,15 @@ const ArcgisArcadeVariables = class {
                 });
                 loading = true;
             }
-            return (h$1("calcite-flow-item", { heading: this.messages.profilevariables, description: collection.breadcrumb, beforeBack: this._beforeBack, closable: true, onCalciteFlowItemClose: this._emitClose }, h$1("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$1("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), loading ? (h$1("calcite-loader", { scale: "s", type: "indeterminate", label: this.messages.loading ?? "Loading" })) : (h$1("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 ?? "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)))));
         };
     }
     renderEditorVariables(collection) {
         // Filter the variables. Skip group, we will filter the children later on.
-        const filterExpression = ne(this._filterValue);
+        const filterExpression = createFilterExpression(this._filterValue);
         const filteredVariables = collection.variables.filter((variable) => variable.passFilter(filterExpression));
         if (!filteredVariables.length) {
-            return h$1("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
         }
         return filteredVariables.map((variable) => this.renderEditorVariable(variable));
     }
@@ -5605,17 +5710,17 @@ const ArcgisArcadeVariables = class {
         switch (variable.type) {
             case "group":
                 // Group is a collection but we represent it differently
-                return (h$1("calcite-list-item-group", { heading: variable.getLabel() }, this.renderEditorVariables(variable)));
+                return (h("calcite-list-item-group", { heading: variable.getLabel() }, this.renderEditorVariables(variable)));
             default:
-                return (h$1("calcite-list-item", { label: variable.getLabel(), description: variable.getDescription(), onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": variable }, variable.isCollection ? (h$1("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "", scale: "s", icon: "chevron-right", iconFlipRtl: true, onClick: this._showCollectionPanel, onKeyPress: stopEnterPropagation, "data-item": variable })) : null, variable.icon ? h$1("calcite-icon", { icon: variable.icon, scale: "s", slot: "content-start" }) : null));
+                return (h("calcite-list-item", { label: variable.getLabel(), description: variable.getDescription(), onCalciteListItemSelect: this._emitItemSelected, onKeyPress: this._emitItemSelected, "data-item": variable }, variable.isCollection ? (h("calcite-action", { slot: "actions-end", text: this.messages.expand ?? "", scale: "s", icon: "chevron-right", iconFlipRtl: true, onClick: this._showCollectionPanel, onKeyPress: stopEnterPropagation, "data-item": variable })) : null, variable.icon ? h("calcite-icon", { icon: variable.icon, scale: "s", slot: "content-start" }) : null));
         }
     }
     render() {
         const profile = arcadeDefaults.getEditorProfileForModel(this.modelId ?? "");
         if (!this.loading && !profile?.variables.length) {
-            return (h$1("calcite-flow", null, h$1("calcite-flow-item", { heading: this.messages.profilevariables, closable: true, onCalciteFlowItemClose: this._emitClose }, h$1("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$1("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, this.collectionBasedVariableRenderer(profile, true)(), this._flowItemRenderers.map((renderer) => renderer())));
+        return (h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, this.collectionBasedVariableRenderer(profile, true)(), this._flowItemRenderers.map((renderer) => renderer())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -5636,20 +5741,20 @@ const EditorOptionsDefaults = {
     renderLineHighlight: "none",
     suggest: {
         snippetsPreventQuickSuggestions: false,
-        showWords: false
+        showWords: false,
     },
     tabSize: 2,
-    useShadowDOM: true
+    useShadowDOM: true,
 };
 const ArcgisCodeEditor = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.valueChange = createEvent(this, "valueChange", 3);
-        this._componentReadyDefer = new h$2();
+        this._componentReadyDefer = new Deferred$1();
         this._disposables = [];
         this.value = undefined;
         this.language = undefined;
-        this.modelId = Q();
+        this.modelId = generateGuid();
         this.options = undefined;
     }
     valuePropChange(newValue) {
@@ -5777,7 +5882,7 @@ const ArcgisCodeEditor = class {
             ...(this.options ?? {}),
             model,
             fixedOverflowWidgets: true,
-            scrollBeyondLastLine: false
+            scrollBeyondLastLine: false,
         });
         this._disposables.push(this._editorInstance);
         // Set the value now to trigger a diagnostic again
@@ -5791,7 +5896,7 @@ const ArcgisCodeEditor = class {
             this.valueChange.emit(script);
         });
         // Detect if the host element or its ancestors got a theme attribute mutation
-        this._themeObserver = b$1(this._hostElt, ["class"], () => this.updateTheme());
+        this._themeObserver = observeAncestorsMutation$1(this._hostElt, ["class"], () => this.updateTheme());
         // Update the theme of the Monaco Editor
         this.updateTheme();
         // Creates a resize observer to re-layout the editor on size changing
@@ -5822,7 +5927,7 @@ const ArcgisCodeEditor = class {
         // This is called the first time and subsequently by the Mutation Observer
         // Figure out the theme by walking the ancestor path.
         // If no theme is found then default to light.
-        const theme = _(this._hostElt) === "light" ? "vs" : "vs-dark";
+        const theme = getElementTheme(this._hostElt) === "light" ? "vs" : "vs-dark";
         if (theme === this._currentTheme) {
             return;
         }
@@ -5847,7 +5952,7 @@ const ArcgisCodeEditor = class {
             contextMenuOrder: 1,
             // Method that will be executed when the action is triggered.
             // @param editor The editor instance is passed in as a convenience
-            run: async () => await zoomInFn?.run()
+            run: async () => await zoomInFn?.run(),
         });
         this._editorInstance?.addAction({
             id: "editor.action.fontZoomOut",
@@ -5855,13 +5960,13 @@ const ArcgisCodeEditor = class {
             keybindings: [KeyMod.CtrlCmd | KeyCode.Minus],
             contextMenuGroupId: "zooming",
             contextMenuOrder: 2,
-            run: async () => await zoomOutFn?.run()
+            run: async () => await zoomOutFn?.run(),
         });
     }
     //#endregion
     // #region Rendering
     render() {
-        return h$1(Host, null);
+        return h(Host, null);
     }
     static get assetsDirs() { return ["assets"]; }
     get _hostElt() { return getElement(this); }