@arcgis/coding-components 4.29.0-beta.47 → 4.29.0-beta.49

package/dist/components/arcade-results.js

@@ -16,494 +16,490 @@ const MaxArrayItems = 100;
 const BatchSize = 100;
 
 function isArcadeFeatureSet(value) {
-  return value.declaredRootClass === "esri.arcade.featureset.support.FeatureSet";
+    return value.declaredRootClass === "esri.arcade.featureset.support.FeatureSet";
 }
 function isArcadeFeature(value) {
-  return value.arcadeDeclaredClass === "esri.arcade.Feature";
+    return value.arcadeDeclaredClass === "esri.arcade.Feature";
 }
 function isArcadeDictionary(value) {
-  return value.declaredClass === "esri.arcade.Dictionary";
+    return value.declaredClass === "esri.arcade.Dictionary";
 }
 function isGeometry(value) {
-  const declaredClass = value.declaredClass;
-  return typeof declaredClass === "string" && declaredClass.startsWith("esri.geometry.");
+    const declaredClass = value.declaredClass;
+    return typeof declaredClass === "string" && declaredClass.startsWith("esri.geometry.");
 }
 function isArcadePortal(value) {
-  const declaredClass = value.declaredClass;
-  return typeof declaredClass === "string" && declaredClass === "esri.arcade.Portal";
+    const declaredClass = value.declaredClass;
+    return typeof declaredClass === "string" && declaredClass === "esri.arcade.Portal";
 }
 function isArcadeAttachment(value) {
-  const declaredClass = value.declaredClass;
-  return typeof declaredClass === "string" && declaredClass === "esri.arcade.Attachment";
+    const declaredClass = value.declaredClass;
+    return typeof declaredClass === "string" && declaredClass === "esri.arcade.Attachment";
 }
 function isArcadeDate(value) {
-  const declaredRootClass = value.declaredRootClass;
-  return typeof declaredRootClass === "string" && declaredRootClass === "esri.arcade.arcadedate";
+    const declaredRootClass = value.declaredRootClass;
+    return typeof declaredRootClass === "string" && declaredRootClass === "esri.arcade.arcadedate";
 }
 function isArcadeDateOnly(value) {
-  const declaredRootClass = value.declaredRootClass;
-  return typeof declaredRootClass === "string" && declaredRootClass === "esri.core.sql.dateonly";
+    const declaredRootClass = value.declaredRootClass;
+    return typeof declaredRootClass === "string" && declaredRootClass === "esri.core.sql.dateonly";
 }
 function isArcadeTimeOnly(value) {
-  const declaredRootClass = value.declaredRootClass;
-  return typeof declaredRootClass === "string" && declaredRootClass === "esri.core.sql.timeonly";
+    const declaredRootClass = value.declaredRootClass;
+    return typeof declaredRootClass === "string" && declaredRootClass === "esri.core.sql.timeonly";
 }
 function isArcadeImmutableArray(value) {
-  return (typeof value.length === "function" &&
-    typeof value.get === "function" &&
-    typeof value.toArray === "function" &&
-    Array.isArray(value._elements));
+    return (typeof value.length === "function" &&
+        typeof value.get === "function" &&
+        typeof value.toArray === "function" &&
+        Array.isArray(value._elements));
 }
 function valueToArcadeResult(value) {
-  if (value == null || value === undefined) {
-    return { type: "null" };
-  }
-  if (Array.isArray(value)) {
-    return { type: "array", value };
-  }
-  if (isArcadeImmutableArray(value)) {
-    return { type: "array", value: value.toArray() };
-  }
-  if (value instanceof Date) {
-    return { type: "date", value };
-  }
-  if (typeof value === "string") {
-    return { type: "text", value };
-  }
-  if (typeof value === "number") {
-    return { type: "number", value };
-  }
-  if (typeof value === "boolean") {
-    return { type: "boolean", value };
-  }
-  if (typeof value !== "object") {
+    if (value == null || value === undefined) {
+        return { type: "null" };
+    }
+    if (Array.isArray(value)) {
+        return { type: "array", value };
+    }
+    if (isArcadeImmutableArray(value)) {
+        return { type: "array", value: value.toArray() };
+    }
+    if (value instanceof Date) {
+        return { type: "date", value };
+    }
+    if (typeof value === "string") {
+        return { type: "text", value };
+    }
+    if (typeof value === "number") {
+        return { type: "number", value };
+    }
+    if (typeof value === "boolean") {
+        return { type: "boolean", value };
+    }
+    if (typeof value !== "object") {
+        return { type: "unknown" };
+    }
+    if (isArcadeDate(value)) {
+        return { type: "date", value };
+    }
+    if (isArcadeDateOnly(value)) {
+        return { type: "dateOnly", value };
+    }
+    if (isArcadeTimeOnly(value)) {
+        return { type: "time", value };
+    }
+    if (isArcadeAttachment(value)) {
+        return { type: "attachment", value };
+    }
+    if (isArcadePortal(value)) {
+        return { type: "portal", value };
+    }
+    if (isArcadeFeatureSet(value)) {
+        return { type: "featureSet", value, features: [], iterator: null };
+    }
+    if (isArcadeFeature(value)) {
+        return { type: "feature", value };
+    }
+    if (isArcadeDictionary(value)) {
+        return { type: "dictionary", value };
+    }
+    if (isGeometry(value)) {
+        return { type: "geometry", value };
+    }
     return { type: "unknown" };
-  }
-  if (isArcadeDate(value)) {
-    return { type: "date", value };
-  }
-  if (isArcadeDateOnly(value)) {
-    return { type: "dateOnly", value };
-  }
-  if (isArcadeTimeOnly(value)) {
-    return { type: "time", value };
-  }
-  if (isArcadeAttachment(value)) {
-    return { type: "attachment", value };
-  }
-  if (isArcadePortal(value)) {
-    return { type: "portal", value };
-  }
-  if (isArcadeFeatureSet(value)) {
-    return { type: "featureSet", value, features: [], iterator: null };
-  }
-  if (isArcadeFeature(value)) {
-    return { type: "feature", value };
-  }
-  if (isArcadeDictionary(value)) {
-    return { type: "dictionary", value };
-  }
-  if (isGeometry(value)) {
-    return { type: "geometry", value };
-  }
-  return { type: "unknown" };
 }
 function formatArcadeResultDate(dateObject, lang = "en") {
-  // Default to english
-  if (dateObject.value instanceof Date) {
-    return new Intl.DateTimeFormat(lang, { dateStyle: "medium", timeStyle: "long" }).format(dateObject.value);
-  }
-  return dateObject.value
-    .toDateTime()
-    .setLocale(lang)
-    .toFormat(dateObject.value.isUnknownTimeZone ? "FF" : "FF ZZZZZ");
+    // Default to english
+    if (dateObject.value instanceof Date) {
+        return new Intl.DateTimeFormat(lang, { dateStyle: "medium", timeStyle: "long" }).format(dateObject.value);
+    }
+    return dateObject.value
+        .toDateTime()
+        .setLocale(lang)
+        .toFormat(dateObject.value.isUnknownTimeZone ? "FF" : "FF ZZZZZ");
 }
 function formatArcadeResultDateOnly(dateObject) {
-  return dateObject.value.toString();
+    return dateObject.value.toString();
 }
 function formatArcadeResultTimeOnly(dateObject) {
-  return dateObject.value.toString();
+    return dateObject.value.toString();
 }
 async function loadArcadeResult(result, timeZone = "system") {
-  if (result.type !== "featureSet") {
-    return result;
-  }
-  // Feature Set needs to be loaded
-  await result.value.load();
-  // Create the first iterator
-  result.iterator = result.value.iterator({ aborted: false });
-  if (result.iterator == null) {
+    if (result.type !== "featureSet") {
+        return result;
+    }
+    // Feature Set needs to be loaded
+    await result.value.load();
+    // Create the first iterator
+    result.iterator = result.value.iterator({ aborted: false });
+    if (result.iterator == null) {
+        return result;
+    }
+    // Load the first batch of items
+    result.features = (await result.iterator.nextBatchAsArcadeFeatures(BatchSize, timeZone)) ?? [];
     return result;
-  }
-  // Load the first batch of items
-  result.features = (await result.iterator.nextBatchAsArcadeFeatures(BatchSize, timeZone)) ?? [];
-  return result;
 }
 async function executeScript(editorProfile, script, testContext, console) {
-  //
-  const timeStamp = new Date();
-  // Provide a default console function is missing
-  console = console ?? (() => undefined);
-  try {
-    // We want to measure compilation time
-    const t0 = performance.now();
-    // Setup an executor with the script
-    const arcade = await importArcade();
-    const executor = await arcade.createArcadeExecutor(script ?? "", {
-      variables: editorProfile?.variables ?? []
-    });
-    // We want to measure the execution time
-    const t1 = performance.now();
-    // Manufacture our execution context
-    const { profileVariableInstances, spatialReference, timeZone } = testContext;
-    const executeContext = {
-      spatialReference,
-      timeZone,
-      rawOutput: true,
-      console
-    };
-    // Execute the script
-    const scriptOutput = await executor.executeAsync(profileVariableInstances ?? {}, executeContext);
-    // Convert script output to arcade result object and load data if necessary
-    const scriptResult = await loadArcadeResult(valueToArcadeResult(scriptOutput), timeZone);
-    // Timestamp and measure cost
-    scriptResult.timeStamp = timeStamp;
-    scriptResult.compilationTime = t1 - t0;
-    scriptResult.executionTime = performance.now() - t1;
-    return scriptResult;
     //
-  }
-  catch (error) {
-    let message = "Unknown Error";
-    if (error instanceof Error) {
-      message = error.message;
-    }
-    return {
-      type: "error",
-      value: message,
-      error,
-      timeStamp: timeStamp,
-      compilationTime: 0,
-      executionTime: 0
-    };
-  }
+    const timeStamp = new Date();
+    // Provide a default console function if missing
+    console ?? (console = () => undefined);
+    try {
+        // We want to measure compilation time
+        const t0 = performance.now();
+        // Setup an executor with the script
+        const arcade = await importArcade();
+        const executor = await arcade.createArcadeExecutor(script ?? "", {
+            variables: editorProfile?.variables ?? []
+        });
+        // We want to measure the execution time
+        const t1 = performance.now();
+        // Manufacture our execution context
+        const { profileVariableInstances, spatialReference, timeZone } = testContext;
+        const executeContext = {
+            spatialReference,
+            timeZone,
+            rawOutput: true,
+            console
+        };
+        // Execute the script
+        const scriptOutput = await executor.executeAsync(profileVariableInstances ?? {}, executeContext);
+        // Convert script output to arcade result object and load data if necessary
+        const scriptResult = await loadArcadeResult(valueToArcadeResult(scriptOutput), timeZone);
+        // Timestamp and measure cost
+        scriptResult.timeStamp = timeStamp;
+        scriptResult.compilationTime = t1 - t0;
+        scriptResult.executionTime = performance.now() - t1;
+        return scriptResult;
+        //
+    }
+    catch (error) {
+        let message = "Unknown Error";
+        if (error instanceof Error) {
+            message = error.message;
+        }
+        return {
+            type: "error",
+            value: message,
+            error,
+            timeStamp,
+            compilationTime: 0,
+            executionTime: 0
+        };
+    }
 }
 
 const indentSpecs = { char: " ", size: 2 };
 const indentType = new Array(indentSpecs.size + 1).join(indentSpecs.char);
 function createPushFunc(p) {
-  return (substring) => "\\" + p.push(substring) + "\\";
+    return (substring) => `\\${p.push(substring)}\\`;
 }
 function createPopFunc(p) {
-  return (_, offset) => p[offset - 1];
+    return (_, offset) => p[offset - 1];
 }
 function indent(index, indentType) {
-  return new Array(index + 1).join(indentType);
+    return new Array(index + 1).join(indentType);
 }
 function jsonFormat(json) {
-  // Convert to string and extract backslashes and strings
-  const p = [];
-  const pushFunc = createPushFunc(p);
-  const jsonString = JSON.stringify(json)
-    .replace(/\\./g, pushFunc)
-    .replace(/(".*?"|'.*?')/g, pushFunc)
-    .replace(/\s+/, "");
-  // Indent and insert newlines
-  let indentIndex = 0;
-  let out = "";
-  for (let i = 0; i < jsonString.length; i++) {
-    const c = jsonString.charAt(i);
-    switch (c) {
-      case "{":
-      case "[":
-        out += c + "\n" + indent(++indentIndex, indentType);
-        break;
-      case "}":
-      case "]":
-        out += "\n" + indent(--indentIndex, indentType) + c;
-        break;
-      case ",":
-        out += ",\n" + indent(indentIndex, indentType);
-        break;
-      case ":":
-        out += ": ";
-        break;
-      default:
-        out += c;
-        break;
-    }
-  }
-  // Strip whitespace from numeric arrays and put backslashes
-  // and strings back in
-  const popFunc = createPopFunc(p);
-  return out
-    .replace(/\[[\d,\s]+?\]/g, function (m) {
-    return m.replace(/\s/g, "");
-  })
-    .replace(/\\(\d+)\\/g, popFunc) // strings
-    .replace(/\\(\d+)\\/g, popFunc); // backslashes in strings
+    // Convert to string and extract backslashes and strings
+    const p = [];
+    const pushFunc = createPushFunc(p);
+    const jsonString = JSON.stringify(json)
+        .replace(/\\./gu, pushFunc)
+        .replace(/(".*?"|'.*?')/gu, pushFunc)
+        .replace(/\s+/u, "");
+    // Indent and insert newlines
+    let indentIndex = 0;
+    let out = "";
+    for (let i = 0; i < jsonString.length; i += 1) {
+        const c = jsonString.charAt(i);
+        switch (c) {
+            case "{":
+            case "[":
+                indentIndex += 1;
+                out += `${c}\n${indent(indentIndex, indentType)}`;
+                break;
+            case "}":
+            case "]":
+                indentIndex -= 1;
+                out += `\n${indent(indentIndex, indentType)}${c}`;
+                break;
+            case ",":
+                out += `,\n${indent(indentIndex, indentType)}`;
+                break;
+            case ":":
+                out += ": ";
+                break;
+            default:
+                out += c;
+                break;
+        }
+    }
+    // Strip whitespace from numeric arrays and put backslashes
+    // and strings back in
+    const popFunc = createPopFunc(p);
+    return out
+        .replace(/\[[\d,\s]+?\]/gu, (m) => m.replace(/\s/gu, ""))
+        .replace(/\\(\d+)\\/gu, popFunc) // strings
+        .replace(/\\(\d+)\\/gu, popFunc); // backslashes in strings
 }
 
 const arcadeResultsCss = ":host{display:flex;flex-direction:column;width:100%;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2)}:host .flex-adjustable{flex:1 1 auto;overflow:hidden}:host .flex-row{display:flex;flex-direction:row;overflow:hidden}:host .flex-column{display:flex;flex-direction:column;overflow:hidden}:host .y-scrollable-container{overflow-y:auto;block-size:100%;background-color:var(--calcite-ui-foreground-1)}:host header{border-bottom:1px solid var(--calcite-ui-border-3);flex:0 0 auto}:host .ltr-container{direction:ltr}:host calcite-action-bar calcite-action-group{padding-inline-end:var(--calcite-spacing-half)}:host calcite-action-bar calcite-action-group calcite-action{padding-inline-end:var(--calcite-spacing-half)}:host calcite-action-bar calcite-action-group calcite-action:not(:first-child){padding-inline-start:var(--calcite-spacing-half)}:host calcite-action-bar calcite-action-group:last-child{border-inline-end-width:0px}:host calcite-action-bar calcite-action-group:not(:first-child){padding-inline-start:var(--calcite-spacing-half)}:host .notice-container{margin:var(--calcite-spacing-quarter);padding:var(--calcite-spacing-half);background-color:var(--calcite-ui-foreground-1)}:host .color-info{color:var(--calcite-ui-info)}:host .color-error{color:var(--calcite-ui-danger)}:host .color-success{color:var(--calcite-ui-success)}:host [class*=result-value-]{font-size:var(--calcite-font-size--2);line-height:1.25rem;background-color:var(--calcite-ui-foreground-1);margin:var(--calcite-spacing-three-quarter)}:host .console-logs-container{background-color:var(--calcite-ui-foreground-1);padding:0 var(--calcite-spacing-three-quarter);font-family:var(--calcite-code-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal)}:host .result-value-table table{display:block;max-width:fit-content;overflow-x:auto;border-spacing:0;border-collapse:collapse;text-align:start;white-space:nowrap}:host .result-value-table table thead{background-color:var(--calcite-ui-foreground-2)}:host .result-value-table table tr{border-top:1px solid var(--calcite-ui-border-3);border-bottom:1px solid var(--calcite-ui-border-3)}:host .result-value-table table th,:host .result-value-table table td{border-inline-start:1px solid var(--calcite-ui-border-3);border-inline-end:1px solid var(--calcite-ui-border-3);text-align:start;padding:var(--calcite-spacing-quarter)}:host .result-value-table table th .string-value,:host .result-value-table table td .string-value{white-space:pre}:host .result-value-table table th{font-weight:var(--calcite-font-weight-medium)}:host .tree-item-label,:host .number-value,:host .string-value,:host .boolean-value{font-family:var(--calcite-code-family)}:host .tree-item-label,:host .value-type{color:var(--calcite-text-2);font-weight:var(--calcite-font-weight-normal)}:host .dictionary-property{color:var(--arcgis-arcade-editor-identifier)}:host .number-value{color:var(--arcgis-arcade-editor-number)}:host .string-value{color:var(--arcgis-arcade-editor-string);white-space:pre-wrap}:host .constant-value{color:var(--arcgis-arcade-editor-constant)}:host .date-value{color:var(--arcgis-arcade-editor-date)}";
 
 //#region Specialized Constants
 const treeProps = {
-  lines: true,
-  selectionMode: "none",
-  scale: "s",
-  onCalciteTreeSelect: (e) => e.target.selectedItems.forEach((itemElt) => (itemElt.selected = false))
+    lines: true,
+    selectionMode: "none",
+    scale: "s",
+    onCalciteTreeSelect: (e) => e.target.selectedItems.forEach((itemElt) => (itemElt.selected = false))
 };
 const expandableTreeItemProps = {
-  onClick: (e) => {
-    const item = e.currentTarget;
-    item.expanded = !item.expanded;
-  }
+    onClick: (e) => {
+        const item = e.currentTarget;
+        item.expanded = !item.expanded;
+    }
 };
 const ArcgisArcadeResults = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeResults extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.openedResultPanelChange = createEvent(this, "openedResultPanelChange", 3);
-    this.close = createEvent(this, "close", 3);
-    this._switchResultPanel = (e) => {
-      if (!e.target) {
-        return;
-      }
-      const panelName = e.target?.dataset.panelName;
-      if (!panelName) {
-        return;
-      }
-      this.updateResultPanel(panelName);
-    };
-    this._emitClose = () => this.close.emit();
-    this._lang = "";
-    this._t9nLocale = "";
-    this._t9nStrings = undefined;
-    this.loading = true;
-    this.openedResultPanel = "output";
-    this.result = undefined;
-    this.consoleLogs = undefined;
-  }
-  //#endregion
-  // #region Component lifecycle events
-  async componentWillLoad() {
-    await F(this, getAssetPath("./assets"));
-  }
-  disconnectedCallback() {
-    U(this);
-  }
-  // #endregion
-  //#region Private Methods
-  updateResultPanel(resultPanelType) {
-    this.openedResultPanel = resultPanelType;
-    this.openedResultPanelChange.emit(resultPanelType);
-  }
-  //#endregion
-  //#region Rendering
-  renderConsolePanel() {
-    if (this.openedResultPanel !== "console") {
-      return null;
-    }
-    if (this.loading && !this.consoleLogs?.length) {
-      return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
-    }
-    return (h("div", { class: "console-logs-container ltr-container" }, this.consoleLogs?.length ? (this.consoleLogs.map((log) => {
-      return h("p", null, log);
-    })) : (h("p", null, this._t9nStrings?.consolemessage))));
-  }
-  renderLogPanel() {
-    if (this.openedResultPanel !== "log") {
-      return null;
-    }
-    if (this.loading) {
-      return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
-    }
-    const iconClass = this.result?.type === "error" ? "color-error" : "color-success";
-    return (h("calcite-list", null, this.result ? (h(Fragment, null, h("calcite-list-item", { label: H(this._t9nStrings?.lastexecutionformat, {
-        timeStamp: new Intl.DateTimeFormat(this._t9nLocale, {
-          dateStyle: "medium",
-          timeStyle: "medium"
-        }).format(this.result.timeStamp)
-      }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: H(this._t9nStrings?.compilationtimeformat, {
-        time: new Intl.NumberFormat(this._t9nLocale, {
-          style: "unit",
-          unit: "millisecond",
-          maximumFractionDigits: 2
-        }).format(this.result.compilationTime ?? 0)
-      }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: H(this._t9nStrings?.executiontimeformat, {
-        time: new Intl.NumberFormat(this._t9nLocale, {
-          style: "unit",
-          unit: "millisecond",
-          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._t9nStrings?.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("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
-    }
-    switch (this.result?.type) {
-      case "error":
-        return (h("div", { class: "result-value-simple flex-adjustable" }, H(this._t9nStrings?.executionerrorformat, {
-          message: this.result.value
-        })));
-      case "null":
-      case "unknown":
-        return h("div", { class: "result-value-simple ltr-container" }, this.renderSimpleValue(this.result));
-      case "text":
-      case "number":
-      case "date":
-      case "dateOnly":
-      case "time":
-      case "boolean":
-        return (h("div", { class: "result-value-simple ltr-container" }, h("span", { class: "value-type" }, this.result.type, ":\u00A0"), this.renderSimpleValue(this.result)));
-      case "array": {
-        const items = this.result.value ?? [];
-        const firstItems = items.slice(0, MaxArrayItems);
-        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("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.renderGeometryTree(this.result.value, true)))));
-      case "attachment":
-        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.renderDictionaryAsJsonTree(this.result.value, true)))));
-      case "feature":
-      case "dictionary":
-      case "portal":
-        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("div", { class: "result-value-table ltr-container" }, this.renderFeatureSetLabel(this.result), this.renderFeatureSetTable(this.result)));
-      default:
-        return (h("div", { class: "result-value-simple flex-adjustable ltr-container" }, this._t9nStrings?.runscriptmessage));
-    }
-  }
-  renderDictionaryProperty(key) {
-    return (h(Fragment, null, h("span", { class: "dictionary-property" }, key), h("span", null, ":\u00A0")));
-  }
-  renderSimpleValue(arcadeResult) {
-    switch (arcadeResult.type) {
-      case "unknown":
-      case "null":
-        return h("span", { class: "constant-value" }, arcadeResult.type);
-      case "text":
-        return h("span", { class: "string-value" }, z(arcadeResult.value));
-      case "number":
-        return h("span", { class: "number-value" }, arcadeResult.value.toString());
-      case "boolean":
-        return h("span", { class: "constant-value" }, arcadeResult.value.toString());
-      case "date":
-        return h("span", { class: "date-value" }, formatArcadeResultDate(arcadeResult));
-      case "dateOnly":
-        return h("span", { class: "string-value" }, z(formatArcadeResultDateOnly(arcadeResult)));
-      case "time":
-        return h("span", { class: "string-value" }, z(formatArcadeResultTimeOnly(arcadeResult)));
-      default:
-        return null;
-    }
-  }
-  renderArrayHeader(arcadeResult) {
-    const items = arcadeResult.value ?? [];
-    const leftoverCount = Math.max(items.length - MaxArrayItems, 0);
-    return (h(Fragment, null, h("span", null, `${arcadeResult.type}(${items.length ?? 0})`), leftoverCount > 0 ? (h("span", null, "\u00A0", H(this._t9nStrings?.showingfirstitemsformat, {
-      count: MaxArrayItems.toString()
-    }))) : null));
-  }
-  renderArrayTree(items, subtree = false) {
-    return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, items.map((value, key) => {
-      const arcadeValue = valueToArcadeResult(value);
-      return this.renderTreeItem(arcadeValue, key, !subtree);
-    })));
-  }
-  renderGeometryTree(value, subtree = false) {
-    return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty("type"), value.type)), h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty("value"), h("span", { class: "string-value" }, jsonFormat(value.toJSON()))))));
-  }
-  renderDictionaryAsJsonTree(value, subtree = false) {
-    return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", { class: "string-value" }, jsonFormat(value.castAsJson()))));
-  }
-  renderDictionaryTree(value, subtree = false) {
-    const geometry = value.geometry?.();
-    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));
-  }
-  renderTreeItem(arcadeResult, key, expanded = false) {
-    switch (arcadeResult.type) {
-      case "null":
-      case "unknown":
-      case "text":
-      case "number":
-      case "date":
-      case "dateOnly":
-      case "time":
-      case "boolean":
-        return (h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), this.renderSimpleValue(arcadeResult))));
-      case "array": {
-        const items = arcadeResult.value ?? [];
-        const firstItems = items.slice(0, MaxArrayItems);
-        return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), this.renderArrayHeader(arcadeResult)), this.renderArrayTree(firstItems, true)));
-      }
-      case "geometry":
-        return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderGeometryTree(arcadeResult.value, true)));
-      case "attachment":
-        return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderDictionaryAsJsonTree(arcadeResult.value, true)));
-      case "feature":
-      case "dictionary":
-      case "portal":
-        return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderDictionaryTree(arcadeResult.value, true)));
-      default:
-        return null;
-    }
-  }
-  renderFeatureSetLabel(arcadeResult) {
-    return (h("div", { class: "value-type" }, h("span", null, arcadeResult.type, ":"), arcadeResult.features.length >= BatchSize ? (h("span", null, "\u00A0", H(this._t9nStrings?.showingfirstitemsformat, {
-      count: BatchSize.toString()
-    }))) : null));
-  }
-  renderFeatureSetTable(arcadeResult) {
-    const fields = supportedFields(arcadeResult.value.fields);
-    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) => {
-      return (h("tr", null, fields.map((field) => {
-        try {
-          const arcadeResult = valueToArcadeResult(feature.field(field.name));
-          return h("td", null, this.renderSimpleValue(arcadeResult));
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.openedResultPanelChange = createEvent(this, "openedResultPanelChange", 3);
+        this.close = createEvent(this, "close", 3);
+        this._switchResultPanel = (e) => {
+            if (!e.target) {
+                return;
+            }
+            const panelName = e.target?.dataset.panelName;
+            if (!panelName) {
+                return;
+            }
+            this.updateResultPanel(panelName);
+        };
+        this._emitClose = () => this.close.emit();
+        this._lang = "";
+        this._t9nLocale = "";
+        this._t9nStrings = undefined;
+        this.loading = true;
+        this.openedResultPanel = "output";
+        this.result = undefined;
+        this.consoleLogs = undefined;
+    }
+    //#endregion
+    // #region Component lifecycle events
+    async componentWillLoad() {
+        await F(this, getAssetPath("./assets"));
+    }
+    disconnectedCallback() {
+        U(this);
+    }
+    // #endregion
+    //#region Private Methods
+    updateResultPanel(resultPanelType) {
+        this.openedResultPanel = resultPanelType;
+        this.openedResultPanelChange.emit(resultPanelType);
+    }
+    //#endregion
+    //#region Rendering
+    renderConsolePanel() {
+        if (this.openedResultPanel !== "console") {
+            return null;
+        }
+        if (this.loading && !this.consoleLogs?.length) {
+            return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+        }
+        return (h("div", { class: "console-logs-container ltr-container" }, this.consoleLogs?.length ? (this.consoleLogs.map((log) => h("p", null, log))) : (h("p", null, this._t9nStrings?.consolemessage))));
+    }
+    renderLogPanel() {
+        if (this.openedResultPanel !== "log") {
+            return null;
+        }
+        if (this.loading) {
+            return h("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+        }
+        const iconClass = this.result?.type === "error" ? "color-error" : "color-success";
+        return (h("calcite-list", null, this.result ? (h(Fragment, null, h("calcite-list-item", { label: H(this._t9nStrings?.lastexecutionformat, {
+                timeStamp: new Intl.DateTimeFormat(this._t9nLocale, {
+                    dateStyle: "medium",
+                    timeStyle: "medium"
+                }).format(this.result.timeStamp)
+            }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: H(this._t9nStrings?.compilationtimeformat, {
+                time: new Intl.NumberFormat(this._t9nLocale, {
+                    style: "unit",
+                    unit: "millisecond",
+                    maximumFractionDigits: 2
+                }).format(this.result.compilationTime ?? 0)
+            }) }, h("calcite-icon", { slot: "content-start", icon: "information", scale: "s", class: iconClass })), h("calcite-list-item", { label: H(this._t9nStrings?.executiontimeformat, {
+                time: new Intl.NumberFormat(this._t9nLocale, {
+                    style: "unit",
+                    unit: "millisecond",
+                    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._t9nStrings?.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("calcite-loader", { scale: "s", type: "indeterminate", label: "" });
+        }
+        switch (this.result?.type) {
+            case "error":
+                return (h("div", { class: "result-value-simple flex-adjustable" }, H(this._t9nStrings?.executionerrorformat, {
+                    message: this.result.value
+                })));
+            case "null":
+            case "unknown":
+                return h("div", { class: "result-value-simple ltr-container" }, this.renderSimpleValue(this.result));
+            case "text":
+            case "number":
+            case "date":
+            case "dateOnly":
+            case "time":
+            case "boolean":
+                return (h("div", { class: "result-value-simple ltr-container" }, h("span", { class: "value-type" }, this.result.type, ":\u00A0"), this.renderSimpleValue(this.result)));
+            case "array": {
+                const items = this.result.value ?? [];
+                const firstItems = items.slice(0, MaxArrayItems);
+                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("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.renderGeometryTree(this.result.value, true)))));
+            case "attachment":
+                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.renderDictionaryAsJsonTree(this.result.value, true)))));
+            case "feature":
+            case "dictionary":
+            case "portal":
+                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("div", { class: "result-value-table ltr-container" }, this.renderFeatureSetLabel(this.result), this.renderFeatureSetTable(this.result)));
+            default:
+                return (h("div", { class: "result-value-simple flex-adjustable ltr-container" }, this._t9nStrings?.runscriptmessage));
+        }
+    }
+    renderDictionaryProperty(key) {
+        return (h(Fragment, null, h("span", { class: "dictionary-property" }, key), h("span", null, ":\u00A0")));
+    }
+    renderSimpleValue(arcadeResult) {
+        switch (arcadeResult.type) {
+            case "unknown":
+            case "null":
+                return h("span", { class: "constant-value" }, arcadeResult.type);
+            case "text":
+                return h("span", { class: "string-value" }, z(arcadeResult.value));
+            case "number":
+                return h("span", { class: "number-value" }, arcadeResult.value.toString());
+            case "boolean":
+                return h("span", { class: "constant-value" }, arcadeResult.value.toString());
+            case "date":
+                return h("span", { class: "date-value" }, formatArcadeResultDate(arcadeResult));
+            case "dateOnly":
+                return h("span", { class: "string-value" }, z(formatArcadeResultDateOnly(arcadeResult)));
+            case "time":
+                return h("span", { class: "string-value" }, z(formatArcadeResultTimeOnly(arcadeResult)));
+            default:
+                return null;
         }
-        catch (e) {
-          return h("td", null);
+    }
+    renderArrayHeader(arcadeResult) {
+        const items = arcadeResult.value ?? [];
+        const leftoverCount = Math.max(items.length - MaxArrayItems, 0);
+        return (h(Fragment, null, h("span", null, `${arcadeResult.type}(${items.length ?? 0})`), leftoverCount > 0 ? (h("span", null, "\u00A0", H(this._t9nStrings?.showingfirstitemsformat, {
+            count: MaxArrayItems.toString()
+        }))) : null));
+    }
+    renderArrayTree(items, subtree = false) {
+        return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, items.map((value, key) => {
+            const arcadeValue = valueToArcadeResult(value);
+            return this.renderTreeItem(arcadeValue, key, !subtree);
+        })));
+    }
+    renderGeometryTree(value, subtree = false) {
+        return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty("type"), value.type)), h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty("value"), h("span", { class: "string-value" }, jsonFormat(value.toJSON()))))));
+    }
+    renderDictionaryAsJsonTree(value, subtree = false) {
+        return (h("calcite-tree", { slot: subtree ? "children" : undefined, ...treeProps }, h("calcite-tree-item", { class: "string-value" }, jsonFormat(value.castAsJson()))));
+    }
+    renderDictionaryTree(value, subtree = false) {
+        const geometry = value.geometry?.();
+        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));
+    }
+    renderTreeItem(arcadeResult, key, expanded = false) {
+        switch (arcadeResult.type) {
+            case "null":
+            case "unknown":
+            case "text":
+            case "number":
+            case "date":
+            case "dateOnly":
+            case "time":
+            case "boolean":
+                return (h("calcite-tree-item", null, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), this.renderSimpleValue(arcadeResult))));
+            case "array": {
+                const items = arcadeResult.value ?? [];
+                const firstItems = items.slice(0, MaxArrayItems);
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), this.renderArrayHeader(arcadeResult)), this.renderArrayTree(firstItems, true)));
+            }
+            case "geometry":
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderGeometryTree(arcadeResult.value, true)));
+            case "attachment":
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderDictionaryAsJsonTree(arcadeResult.value, true)));
+            case "feature":
+            case "dictionary":
+            case "portal":
+                return (h("calcite-tree-item", { expanded: expanded, ...expandableTreeItemProps }, h("div", { class: "tree-item-label" }, this.renderDictionaryProperty(key), h("span", null, arcadeResult.type)), this.renderDictionaryTree(arcadeResult.value, true)));
+            default:
+                return null;
         }
-      })));
-    }))));
-  }
-  render() {
-    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._t9nStrings?.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._t9nStrings?.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._t9nStrings?.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._t9nStrings?.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 _hostElement() { return this; }
-  static get style() { return arcadeResultsCss; }
+    }
+    renderFeatureSetLabel(arcadeResult) {
+        return (h("div", { class: "value-type" }, h("span", null, arcadeResult.type, ":"), arcadeResult.features.length >= BatchSize ? (h("span", null, "\u00A0", H(this._t9nStrings?.showingfirstitemsformat, {
+            count: BatchSize.toString()
+        }))) : null));
+    }
+    renderFeatureSetTable(arcadeResult) {
+        const fields = supportedFields(arcadeResult.value.fields);
+        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("td", null, this.renderSimpleValue(arcadeResult));
+            }
+            catch (e) {
+                return h("td", null);
+            }
+        })))))));
+    }
+    render() {
+        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._t9nStrings?.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._t9nStrings?.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._t9nStrings?.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._t9nStrings?.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 _hostElement() { return this; }
+    static get style() { return arcadeResultsCss; }
 }, [1, "arcgis-arcade-results", {
-    "loading": [4],
-    "openedResultPanel": [1537, "opened-result-panel"],
-    "result": [16],
-    "consoleLogs": [16],
-    "_lang": [32],
-    "_t9nLocale": [32],
-    "_t9nStrings": [32]
-  }]);
+        "loading": [4],
+        "openedResultPanel": [1537, "opened-result-panel"],
+        "result": [16],
+        "consoleLogs": [16],
+        "_lang": [32],
+        "_t9nLocale": [32],
+        "_t9nStrings": [32]
+    }]);
 function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["arcgis-arcade-results"];
-  components.forEach(tagName => { switch (tagName) {
-    case "arcgis-arcade-results":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, ArcgisArcadeResults);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["arcgis-arcade-results"];
+    components.forEach(tagName => { switch (tagName) {
+        case "arcgis-arcade-results":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ArcgisArcadeResults);
+            }
+            break;
+    } });
 }
 defineCustomElement();