@arcgis/coding-components 4.32.0-next.82 → 4.32.0-next.84

package/dist/chunks/arcade-defaults.js

@@ -4,7 +4,7 @@ import { g as m } from "./runtime.js";
 import { CompletionItemKind as w, InsertTextMode as f, InsertTextFormat as d } from "vscode-languageserver-types";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 async function S(e) {
   const { apiVersion: s, bundles: t, hiddenApiItems: r } = e.toEditorProfileDefinition(), n = await g(e.dictionaryVariables);
   return { apiVersion: s, bundles: t, variables: n, hiddenApiItems: r?.map((i) => i.toLowerCase()) };

package/dist/chunks/arcade-executor.js

@@ -1,7 +1,7 @@
 import { importArcade as C } from "@arcgis/core-adapter";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const G = "https://developers.arcgis.com/arcade/", O = 100, A = 100;
 function u(t) {
   return !!t && typeof t == "object" && "declaredRootClass" in t && typeof t.declaredRootClass == "string" && t.declaredRootClass === "esri.arcade.featureset.support.FeatureSet";

package/dist/chunks/arcade-mode.js

@@ -8,7 +8,7 @@ import { InsertTextFormat as y, DiagnosticSeverity as m, CompletionItemKind as o
 import { debounce as F, Deferred as _ } from "@arcgis/components-utils";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const S = [
   "<=",
   ">=",

package/dist/chunks/arcade-service-accessors.js

@@ -2,7 +2,7 @@ import { importRequest as n } from "@arcgis/core-adapter";
 import { isURL as i, hasSameOrigin as c } from "@arcgis/components-utils";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 function a() {
   return !!window.MonacoEnvironment?.getWorkerUrl;
 }

package/dist/chunks/fields.js

@@ -1,6 +1,6 @@
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 function t(e) {
   switch (e.type) {
     case "oid":

package/dist/chunks/language-defaults-base.js

@@ -8,7 +8,7 @@ import { filterApiLibraryForContext as le } from "@arcgis/languages-api-utils";
 import { Emitter as x, Uri as $ } from "monaco-editor";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 function W(t) {
   return !!t && typeof t == "object" && "declaredClass" in t && typeof t.declaredClass == "string" && t.declaredClass.startsWith("esri.layers.") && g(t) && "queryFeatures" in t && typeof t.queryFeatures == "function";
 }

package/dist/chunks/markdown.js

@@ -4,7 +4,7 @@ import { IStandaloneThemeService as G } from "monaco-editor/esm/vs/editor/standa
 import { generateTokensCSSForColorMap as te } from "monaco-editor/esm/vs/editor/common/languages/supports/tokenization";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 async function ne(l) {
   return await (await ee()).colorize(l, "arcade", { tabSize: 2 });
 }

package/dist/chunks/monaco-importer.js

@@ -5,7 +5,7 @@ import "monaco-editor/esm/vs/editor/standalone/common/standaloneTheme";
 import "monaco-editor/esm/vs/editor/common/languages/supports/tokenization";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 function g(r, t, n, m) {
   if (!t)
     return [];

package/dist/chunks/runtime.js

@@ -1,7 +1,7 @@
 import { makeRuntime as t } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const s = t({ defaultAssetPath: "https://jsdev.arcgis.com/coding-components/next/", hydratedAttribute: "hydrated" }), { customElement: a, getAssetPath: o, setAssetPath: m } = s;
 export {
   a as c,

package/dist/chunks/sql-expr-defaults.js

@@ -4,7 +4,7 @@ import { fetchT9nStringsBundle as M } from "@arcgis/components-utils";
 import { g as b } from "./runtime.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const x = (r) => {
   const e = r.variables[0], i = e && e.type === "featureSet" ? A(e) : void 0, { apiVersion: t, bundles: o, hiddenApiItems: s } = r.toEditorProfileDefinition();
   return {

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

@@ -7,7 +7,7 @@ import { Deferred as _, debounce as N } from "@arcgis/components-utils";
 import { a as d } from "./sql-expr-defaults.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 let h = new _();
 class k {
   constructor(e) {

package/dist/chunks/useT9n.js

@@ -2,7 +2,7 @@ import { makeT9nController as o } from "@arcgis/components-controllers";
 import { g as t } from "./runtime.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const s = o(t);
 export {
   s as u

package/dist/components/arcgis-arcade-editor/customElement.d.ts

@@ -9,9 +9,13 @@ import { IEditorProfileDefinition, IPredefinedProfile } from '../../utils/profil
 import { EditorProfile } from '../../utils/profile/editor-profile';
 import { ArcadeResult, IEditorTestContext } from '../../utils/arcade-executor';
 import { ResultPanelName } from '../arcgis-arcade-results/customElement.js';
+import { ICustomPanel } from '../../utils/custom-panel';
 
-export type SidePanelName = "api" | "none" | "suggestions" | "variables";
-export declare class ArcgisArcadeEditor extends LitElement {
+type SidePanelName = "api" | "none" | "suggestions" | "variables";
+type WithCustomPanels = {
+    customPanels?: ICustomPanel[];
+};
+export declare class ArcgisArcadeEditor<T extends WithCustomPanels = object> extends LitElement {
     /**
      * Options to update on the editor.
      * For example:
@@ -29,7 +33,7 @@ export declare class ArcgisArcadeEditor extends LitElement {
     /** If true, it will hide the side actions bar. The editor will be in a minimalistic UX. */
     hideSideBar: boolean;
     /** The name of the opened side panel. 'none' means 'no panel opened'. */
-    openedSidePanel: SidePanelName;
+    openedSidePanel: T extends Required<WithCustomPanels> ? SidePanelName : string;
     /**
      * The profile contains metadata used by the editor for editing context and help.
      * Example:
@@ -57,6 +61,12 @@ export declare class ArcgisArcadeEditor extends LitElement {
     suggestions: IEditorCodeSuggestion[] | IEditorCodeSuggestionGroup[] | undefined;
     /** Test data used to execute the script in the editor. If undefined the execute script UX will be hidden. */
     testData: IEditorTestContext | undefined;
+    /**
+     * Custom panels to be displayed in the side panel.
+     * Will be placed below the default panels but above the help panel.
+     * @internal
+     */
+    customPanels: ICustomPanel[] | undefined;
     /** @deprecated Use `script` property instead. */
     getScript(): Promise<string | undefined>;
     /** Returns the Arcade result for the script for the provided test data. */
@@ -68,3 +78,4 @@ export declare class ArcgisArcadeEditor extends LitElement {
     /** Emitted when the script string has changed. */
     readonly arcgisScriptChange: TargetedEvent<this, string>;
 }
+export {};

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

@@ -1,38 +1,42 @@
-import { g as h, c as u } from "../../chunks/runtime.js";
-import { html as t, nothing as n } from "lit";
-import { KeyCode as g } from "monaco-editor";
+import { g as u, c as g } from "../../chunks/runtime.js";
+import { html as t, nothing as r } from "lit";
+import { KeyCode as _ } from "monaco-editor";
 import "monaco-editor/esm/vs/editor/standalone/browser/standaloneServices";
 import "monaco-editor/esm/vs/editor/standalone/common/standaloneTheme";
 import "monaco-editor/esm/vs/editor/common/languages/supports/tokenization";
-import { LitElement as _, createEvent as r, noShadowRoot as f } from "@arcgis/lumina";
-import { Deferred as m, generateGuid as x } from "@arcgis/components-utils";
-import { D as b, e as c } from "../../chunks/arcade-executor.js";
-import { s as v, a as P } from "../../chunks/arcade-service-accessors.js";
+import { LitElement as m, createEvent as c, noShadowRoot as f } from "@arcgis/lumina";
+import { Deferred as x, generateGuid as b } from "@arcgis/components-utils";
+import { D as v, e as l } from "../../chunks/arcade-executor.js";
+import { s as P, a as w } from "../../chunks/arcade-service-accessors.js";
 import { b as s } from "../../chunks/arcade-defaults.js";
-import { u as E } from "../../chunks/useT9n.js";
-import { createRef as S, ref as A } from "lit-html/directives/ref.js";
-import { css as w } from "@lit/reactive-element/css-tag.js";
+import { u as S } from "../../chunks/useT9n.js";
+import { createRef as E, ref as A } from "lit-html/directives/ref.js";
+import { css as $ } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
-const $ = w`arcgis-arcade-editor{display:flex;flex-direction:column;position:relative;overflow:hidden;border:var(--arcgis-coding-components-border);box-sizing:border-box;background-color:var(--arcgis-coding-components-background-color);height:100%;.flex-adjustable{flex:1 1 auto;overflow:hidden}.flex-panel{flex:1 0 auto}.position-relative{position:relative}.flex-row{display:flex;flex-direction:row;overflow:hidden}.flex-column{display:flex;flex-direction:column;overflow:hidden}.border-inline-start{border-inline-start:var(--arcgis-coding-components-border);box-sizing:border-box}.border-inline-end{border-inline-end:var(--arcgis-coding-components-border);box-sizing:border-box}.sticky{position:sticky;top:0;z-index:10}.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1);text-align:center}.side-action-bar{max-width:var(--arcgis-coding-components-side-action-bar-max-w)}.side-panel{max-width:var(--arcgis-coding-components-side-panel-max-w);width:var(--arcgis-coding-components-side-panel-w);calcite-flow{height:100%}}.main-action-bar{border-bottom:var(--arcgis-coding-components-border);flex:0 0 auto;calcite-action-group{padding-inline-end:var(--calcite-spacing-sm);calcite-action{padding-inline-end:var(--calcite-spacing-sm)}calcite-action:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}calcite-action-group:last-child{border-inline-end-width:0px}calcite-action-group:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}arcgis-arcade-results{border-top:var(--arcgis-coding-components-border);box-sizing:border-box;max-height:50%;min-height:50%;margin-bottom:-1px}calcite-flow{[slot=footer]{word-break:break-word}}}`;
-class y extends _ {
+v4.32.0-next.84 */
+const y = (n) => {
+  if (!n.toString().includes("calcite-flow-item"))
+    throw new Error("Renderer must return a JSX node that starts with <calcite-flow-item>");
+  return !0;
+}, D = $`arcgis-arcade-editor{display:flex;flex-direction:column;position:relative;overflow:hidden;border:var(--arcgis-coding-components-border);box-sizing:border-box;background-color:var(--arcgis-coding-components-background-color);height:100%;.flex-adjustable{flex:1 1 auto;overflow:hidden}.flex-panel{flex:1 0 auto}.position-relative{position:relative}.flex-row{display:flex;flex-direction:row;overflow:hidden}.flex-column{display:flex;flex-direction:column;overflow:hidden}.border-inline-start{border-inline-start:var(--arcgis-coding-components-border);box-sizing:border-box}.border-inline-end{border-inline-end:var(--arcgis-coding-components-border);box-sizing:border-box}.sticky{position:sticky;top:0;z-index:10}.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1);text-align:center}.side-action-bar{max-width:var(--arcgis-coding-components-side-action-bar-max-w)}.side-panel{max-width:var(--arcgis-coding-components-side-panel-max-w);width:var(--arcgis-coding-components-side-panel-w);calcite-flow{height:100%}}.main-action-bar{border-bottom:var(--arcgis-coding-components-border);flex:0 0 auto;calcite-action-group{padding-inline-end:var(--calcite-spacing-sm);calcite-action{padding-inline-end:var(--calcite-spacing-sm)}calcite-action:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}calcite-action-group:last-child{border-inline-end-width:0px}calcite-action-group:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}arcgis-arcade-results{border-top:var(--arcgis-coding-components-border);box-sizing:border-box;max-height:50%;min-height:50%;margin-bottom:-1px}calcite-flow{[slot=footer]{word-break:break-word}}}`;
+class C extends m {
   constructor() {
-    super(...arguments), this._codeEditorElt = S(), this._componentReadyDefer = new m(), this._disposables = [], this._editorProfilePromise = Promise.resolve(void 0), this.messages = E(), this._modelId = x(), this._openArcadeHelp = () => void window.open(b, "Arcade Help"), this._toggleSidePanel = (e) => {
+    super(...arguments), this._codeEditorElt = E(), this._componentReadyDefer = new x(), this._disposables = [], this._editorProfilePromise = Promise.resolve(void 0), this.messages = S(), this._modelId = b(), this._openArcadeHelp = () => void window.open(v, "Arcade Help"), this._toggleSidePanel = (e) => {
       if (!e.target)
         return;
       const i = e.target?.dataset.panelName ?? "none";
       this.openedSidePanel = i === this.openedSidePanel ? "none" : i, this.openedSidePanel === "none" && this._codeEditorElt.value?.setFocus().catch(console.error);
-    }, this._consoleLogs = [], this._executingScript = !1, this._preparingArcade = !1, this._resultPanel = "output", this._showExecutionPanel = !1, this.hideDocumentationActions = !1, this.hideSideBar = !1, this.openedSidePanel = "none", this.script = "", this.sideActionBarExpanded = !1, this.arcgisDiagnosticsChange = r({ bubbles: !1 }), this.arcgisScriptChange = r({ bubbles: !1 });
+    }, this._consoleLogs = [], this._executingScript = !1, this._preparingArcade = !1, this._resultPanel = "output", this._showExecutionPanel = !1, this.hideDocumentationActions = !1, this.hideSideBar = !1, this.openedSidePanel = "none", this.script = "", this.sideActionBarExpanded = !1, this.arcgisDiagnosticsChange = c({ bubbles: !1 }), this.arcgisScriptChange = c({ bubbles: !1 });
   }
   static {
-    this.properties = { _apiLibrary: 16, _consoleLogs: 16, _editorProfile: 16, _executingScript: 16, _executionResult: 16, _preparingArcade: 16, _resultPanel: 16, _showExecutionPanel: 16, editorInstance: 32, editorOptions: 0, hideDocumentationActions: 5, hideSideBar: 5, openedSidePanel: 3, profile: 0, script: 1, sideActionBarExpanded: 7, snippets: 0, suggestions: 0, testData: 0 };
+    this.properties = { _apiLibrary: 16, _consoleLogs: 16, _editorProfile: 16, _executingScript: 16, _executionResult: 16, _preparingArcade: 16, _resultPanel: 16, _showExecutionPanel: 16, editorInstance: 32, editorOptions: 0, hideDocumentationActions: 5, hideSideBar: 5, openedSidePanel: 2, profile: 0, script: 1, sideActionBarExpanded: 7, snippets: 0, suggestions: 0, testData: 0, customPanels: 0 };
   }
   static {
     this.shadowRootOptions = f;
   }
   static {
-    this.styles = $;
+    this.styles = D;
   }
   // #endregion
   // #region Public Properties
@@ -69,7 +73,7 @@ class y extends _ {
       return { type: "error", value: "Missing editor profile", error: null };
     await this._componentReadyDefer.promise;
     const i = this._codeEditorElt.value?.value;
-    return await c(e.definition, i, this.testData);
+    return await l(e.definition, i, this.testData);
   }
   /** Set the focus on the element. */
   async setFocus() {
@@ -78,8 +82,8 @@ class y extends _ {
   // #endregion
   // #region Lifecycle
   async load() {
-    const e = h("./assets");
-    v(e), await this._updateEditorProfile();
+    const e = u("./assets");
+    P(e), await this._updateEditorProfile();
   }
   willUpdate(e) {
     (e.has("messages") || e.has("profile")) && this._updateDataModelDeps(), e.has("testData") && this._testDataChanged(), e.has("snippets") && s.updateApiContextForModel(this._modelId, {
@@ -89,7 +93,7 @@ class y extends _ {
   /** This lifecycle method is not expected to return a promise. The returned promise will be ignored by Lit rather than awaited. */
   async loaded() {
     this._componentReadyDefer.resolve(), await this._updateApiLibrary();
-    const e = await P();
+    const e = await w();
     this._disposables.push(e.onDiagnosticsChange((i) => !this._preparingArcade && this.arcgisDiagnosticsChange.emit(i.diagnostics))), this.testData && this._addExecuteScriptAction(), await this._codeEditorElt.value?.setFocus();
   }
   disconnectedCallback() {
@@ -131,7 +135,7 @@ class y extends _ {
     }
     this._showExecutionPanel = !0, this._executingScript = !0, this._consoleLogs = [], setTimeout(() => void (async () => {
       const a = this._codeEditorElt.value?.value;
-      this._executionResult = await c(i.definition, a, e, (o) => setTimeout(() => this._consoleLogs = [...this._consoleLogs, o], 0)), this._executingScript = !1;
+      this._executionResult = await l(i.definition, a, e, (o) => setTimeout(() => this._consoleLogs = [...this._consoleLogs, o], 0)), this._executingScript = !1;
     })(), 0);
   }
   _toggleShowExecutionPanel() {
@@ -147,7 +151,10 @@ class y extends _ {
     this._codeEditorElt.value?.insertSnippet(e.detail).catch(console.error);
   }
   _insertAsText(e) {
-    this._codeEditorElt.value?.insertText(e.detail).catch(console.error);
+    this._insertText(e.detail);
+  }
+  _insertText(e) {
+    this._codeEditorElt.value?.insertText(e).catch(console.error);
   }
   _onResultPanelChange(e) {
     this._resultPanel = e.detail;
@@ -160,7 +167,7 @@ class y extends _ {
       // An unique identifier for the action.
       id: "run-script",
       label: "Run Arcade Expression",
-      keybindings: [g.F5],
+      keybindings: [_.F5],
       contextMenuGroupId: "code",
       contextMenuOrder: 1,
       run: () => {
@@ -182,8 +189,8 @@ class y extends _ {
   renderMainPanel() {
     return t`<arcgis-code-editor class="flex-adjustable" .editorOptions=${this.editorOptions} .language=${s.languageId} .value=${this.script ?? ""} .modelId=${this._modelId} @arcgisValueChange=${this._onCodeEditorValueChange} ${A(this._codeEditorElt)}></arcgis-code-editor>`;
   }
-  renderAction({ id: e, label: i, icon: a, active: o, panelName: l, iconFlipRtl: d = !1, onClick: p = this._toggleSidePanel }) {
-    return t`<calcite-action id=${e ?? n} .text=${i} .icon=${a} .active=${o} @click=${p} data-panel-name=${l ?? n} .iconFlipRtl=${d}></calcite-action>${!this.sideActionBarExpanded && t`<calcite-tooltip .referenceElement=${e}><span>${i}</span></calcite-tooltip>` || ""}`;
+  renderAction({ id: e, label: i, icon: a, active: o, panelName: d, iconFlipRtl: h = !1, onClick: p = this._toggleSidePanel }) {
+    return t`<calcite-action id=${e ?? r} .text=${i} .icon=${a} .active=${o} @click=${p} data-panel-name=${d ?? r} .iconFlipRtl=${h}></calcite-action>${!this.sideActionBarExpanded && t`<calcite-tooltip .referenceElement=${e}><span>${i}</span></calcite-tooltip>` || ""}`;
   }
   renderSideActionBar() {
     return this.hideSideBar ? null : t`<calcite-action-bar class="side-action-bar border-inline-start" .expanded=${!!this.sideActionBarExpanded} position=end @calciteActionBarToggle=${this._toggleSideActionBarExpanded}><calcite-action-group>${this.renderAction({
@@ -204,7 +211,13 @@ class y extends _ {
       icon: "lightbulb",
       active: this.openedSidePanel === "suggestions",
       panelName: "suggestions"
-    }) : null}${this.hideDocumentationActions ? null : this.renderAction({
+    }) : null}${this.customPanels?.map((e) => this.renderAction({
+      id: e.id,
+      label: e.name,
+      icon: e.icon,
+      active: this.openedSidePanel === e.id,
+      panelName: e.id
+    }))}${this.hideDocumentationActions ? null : this.renderAction({
       id: "developer-website-action",
       label: this.messages.help ?? "",
       icon: "question",
@@ -224,9 +237,15 @@ class y extends _ {
         return t`<arcgis-editor-variables class="side-panel flex-panel border-inline-start" .loading=${this._preparingArcade} .modelId=${this._modelId} @arcgisItemSelected=${this._insertAsText} @arcgisClose=${this._toggleSidePanel} data-panel-name=none .variable=${this._editorProfile}></arcgis-editor-variables>`;
       case "suggestions":
         return t`<arcgis-arcade-suggestions class="side-panel flex-panel border-inline-start" .suggestions=${this.suggestions} @arcgisItemSelected=${this._insertAsText} @arcgisClose=${this._toggleSidePanel} data-panel-name=none></arcgis-arcade-suggestions>`;
-      default:
+      case "none":
         return null;
     }
+    const e = this.customPanels?.find((i) => i.id === this.openedSidePanel);
+    if (e) {
+      const i = !!e?.useFlows;
+      return t`<calcite-flow class="side-panel flex-panel border-inline-start">${i && y(e.renderer) ? e.renderer({ closePanel: this._toggleSidePanel, insertText: this._insertText.bind(this) }) : t`<calcite-flow-item .heading=${e.name} closable @calciteFlowItemClose=${this._toggleSidePanel} .description=${e.description}>${e.renderer({ closePanel: this._toggleSidePanel, insertText: this._insertText.bind(this) })}</calcite-flow-item>`}</calcite-flow>`;
+    }
+    return null;
   }
   renderResultsPanel() {
     return this._showExecutionPanel ? t`<arcgis-arcade-results class="flex-adjustable" .openedResultPanel=${this._resultPanel} .loading=${this._executingScript} .result=${this._executionResult} .consoleLogs=${this._consoleLogs} @arcgisOpenedResultPanelChange=${this._onResultPanelChange} @arcgisClose=${this._onExecutionPanelClose}></arcgis-arcade-results>` : null;
@@ -235,7 +254,7 @@ class y extends _ {
     return t`${this.renderMainActionBar()}<div class="flex-row flex-adjustable"><div class="flex-column flex-adjustable">${this.renderMainPanel()}${this.renderResultsPanel()}</div>${this.renderSidePanel()}${this.renderSideActionBar()}</div>`;
   }
 }
-u("arcgis-arcade-editor", y);
+g("arcgis-arcade-editor", C);
 export {
-  y as ArcgisArcadeEditor
+  C as ArcgisArcadeEditor
 };

package/dist/components/arcgis-arcade-editor/index.d.ts

@@ -6,5 +6,7 @@ import "@esri/calcite-components/components/calcite-tooltip";
 import "../arcgis-language-api-panel/index.js";
 import "../arcgis-editor-variables/index.js";
 import "../arcgis-arcade-suggestions/index.js";
+import "@esri/calcite-components/components/calcite-flow";
+import "@esri/calcite-components/components/calcite-flow-item";
 import "../arcgis-arcade-results/index.js";
 export * from "./customElement.js";

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

@@ -6,5 +6,7 @@ import "@esri/calcite-components/components/calcite-tooltip";
 import "../arcgis-language-api-panel/index.js";
 import "../arcgis-editor-variables/index.js";
 import "../arcgis-arcade-suggestions/index.js";
+import "@esri/calcite-components/components/calcite-flow";
+import "@esri/calcite-components/components/calcite-flow-item";
 import "../arcgis-arcade-results/index.js";
 export * from "./customElement.js";

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

@@ -8,7 +8,7 @@ import { u as M } from "../../chunks/useT9n.js";
 import { css as C } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const A = C`:host{display:flex;flex-direction:column;width:100%;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);.flex-adjustable{flex:1 1 auto;overflow:hidden}.flex-row{display:flex;flex-direction:row;overflow:hidden}.flex-column{display:flex;flex-direction:column;overflow:hidden}.y-scrollable-container{overflow-y:auto;block-size:100%;background-color:var(--calcite-color-foreground-1)}header{border-bottom:1px solid var(--calcite-color-border-3);flex:0 0 auto}.ltr-container{direction:ltr}calcite-action-bar{calcite-action-group{padding-inline-end:var(--calcite-spacing-sm);calcite-action{padding-inline-end:var(--calcite-spacing-sm)}calcite-action:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}calcite-action-group:last-child{border-inline-end-width:0px}calcite-action-group:not(:first-child){padding-inline-start:var(--calcite-spacing-sm)}}.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}.color-info{color:var(--calcite-color-status-info)}.color-error{color:var(--calcite-color-status-danger)}.color-success{color:var(--calcite-color-status-success)}[class*=result-value-]{font-size:var(--calcite-font-size--2);line-height:1.25rem;background-color:var(--calcite-color-foreground-1);margin:var(--calcite-spacing-md)}.console-logs-container{background-color:var(--calcite-color-foreground-1);padding:0 var(--calcite-spacing-md);font-family:var(--calcite-code-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal)}.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;thead{background-color:var(--calcite-color-foreground-2)}tr{border-top:1px solid var(--calcite-color-border-3);border-bottom:1px solid var(--calcite-color-border-3)}th,td{border-inline-start:1px solid var(--calcite-color-border-3);border-inline-end:1px solid var(--calcite-color-border-3);text-align:start;padding:var(--calcite-spacing-xxs);.string-value{white-space:pre}}th{font-weight:var(--calcite-font-weight-medium)}}}.tree-item-label,.number-value,.string-value,.boolean-value{font-family:var(--calcite-code-family)}.tree-item-label,.value-type{color:var(--calcite-color-text-2);font-weight:var(--calcite-font-weight-normal)}.dictionary-property{color:var(--arcgis-editor-identifier)}.number-value{color:var(--arcgis-editor-number)}.string-value{color:var(--arcgis-editor-string);white-space:pre-wrap}.constant-value{color:var(--arcgis-editor-constant)}.date-value{color:var(--arcgis-editor-date)}}`, a = {
   lines: !0,
   selectionMode: "none",

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

@@ -9,7 +9,7 @@ import { u as b } from "../../chunks/useT9n.js";
 import { css as _ } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 function v(o) {
   return !Array.isArray(o) || !o.length ? !1 : Array.isArray(o[0].suggestions);
 }

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

@@ -13,7 +13,7 @@ import { css as C } from "@lit/reactive-element/css-tag.js";
 import { load as b } from "@arcgis/components-controllers";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 c.register({
   id: n.languageId,
   aliases: ["Arcade", "arcade"],

package/dist/components/arcgis-editor-variables/customElement.js

@@ -7,7 +7,7 @@ import { u as f } from "../../chunks/useT9n.js";
 import { css as m } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const u = m`:host{background-color:var(--calcite-color-foreground-1);.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}.sticky{position:sticky;top:0;z-index:10}calcite-flow{height:100%}calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}}`;
 function g(l) {
   l.key === "Enter" && l.stopPropagation();

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

@@ -9,7 +9,7 @@ import { u as _ } from "../../chunks/useT9n.js";
 import { css as b } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const v = b`:host{background-color:var(--calcite-color-foreground-1);.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}.sticky{position:sticky;top:0;z-index:10}calcite-flow{height:100%}calcite-block{p:first-of-type{margin-top:0}code{font-family:var(--calcite-code-family)}pre{direction:ltr;overflow-x:auto;background-color:var(--calcite-color-foreground-2);padding:var(--calcite-spacing-sm);code{font-size:var(--calcite-font-size--2)}}}calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}}`;
 class y extends u {
   constructor() {

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

@@ -8,7 +8,7 @@ import { createRef as l, ref as p } from "lit-html/directives/ref.js";
 import { css as h } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const g = h`arcgis-sql-expression-editor{display:flex;flex-direction:column;position:relative;overflow:hidden;border:var(--arcgis-coding-components-border);box-sizing:border-box;background-color:var(--arcgis-coding-components-background-color);height:100%;.flex-adjustable{flex:1 1 auto;overflow:hidden}.flex-panel{flex:1 0 auto}.position-relative{position:relative}.flex-row{display:flex;flex-direction:row;overflow:hidden}.flex-column{display:flex;flex-direction:column;overflow:hidden}.border-inline-start{border-inline-start:var(--arcgis-coding-components-border);box-sizing:border-box}.border-inline-end{border-inline-end:var(--arcgis-coding-components-border);box-sizing:border-box}.side-action-bar{max-width:var(--arcgis-coding-components-side-action-bar-max-w)}.side-panel{max-width:var(--arcgis-coding-components-side-panel-max-w);width:var(--arcgis-coding-components-side-panel-w);calcite-flow{height:100%}}}`;
 class f extends s {
   constructor() {

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

@@ -7,7 +7,7 @@ import { u as m } from "../../chunks/useT9n.js";
 import { css as d } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.82 */
+v4.32.0-next.84 */
 const h = d`:host{calcite-flow{height:100%}calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}}`;
 class f extends r {
   constructor() {

package/dist/docs/api.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2025-01-14T19:26:22",
+  "timestamp": "2025-01-16T04:57:13",
   "compiler": {
     "name": "@arcgis/lumina-compiler",
-    "version": "4.32.0-next.82",
+    "version": "4.32.0-next.84",
     "typescriptVersion": "5.6.3"
   },
   "schemaVersion": "1.0.0",
@@ -55,6 +55,28 @@
                 }
               ]
             },
+            {
+              "kind": "field",
+              "name": "customPanels",
+              "description": "Custom panels to be displayed in the side panel.\nWill be placed below the default panels but above the help panel.",
+              "type": {
+                "text": "(Array<{\n    id: string;\n    name: string;\n    icon: string;\n    description?: string | undefined;\n    useFlows?: boolean | undefined;\n    renderer: ({ closePanel, insertText, }: {\n        closePanel: (e: Event) => void;\n        insertText: (text: string) => void;\n    }) => JsxNode;\n}>)",
+                "references": [
+                  {
+                    "name": "Array",
+                    "package": "typescript",
+                    "module": "lib/lib.es5.d.ts",
+                    "start": 1,
+                    "end": 6
+                  }
+                ]
+              },
+              "docsTags": [
+                {
+                  "name": "internal"
+                }
+              ]
+            },
             {
               "kind": "field",
               "name": "editorOptions",
@@ -258,28 +280,17 @@
               "name": "openedSidePanel",
               "description": "The name of the opened side panel. 'none' means 'no panel opened'.",
               "type": {
-                "text": "\"api\" | \"none\" | \"suggestions\" | \"variables\"",
-                "values": [
-                  {
-                    "value": "api",
-                    "type": "string"
-                  },
-                  {
-                    "value": "none",
-                    "type": "string"
-                  },
-                  {
-                    "value": "suggestions",
-                    "type": "string"
-                  },
+                "text": "T extends {\n    customPanels: Array<ICustomPanel>;\n} ? \"none\" | \"variables\" | \"suggestions\" | \"api\" : string",
+                "references": [
                   {
-                    "value": "variables",
-                    "type": "string"
+                    "name": "T",
+                    "module": "dist/components/arcgis-arcade-editor/customElement.d.ts",
+                    "start": 0,
+                    "end": 1
                   }
                 ]
               },
               "default": "\"none\"",
-              "attribute": "opened-side-panel",
               "reflects": true
             },
             {
@@ -478,33 +489,6 @@
               "default": "false",
               "fieldName": "hideSideBar"
             },
-            {
-              "name": "opened-side-panel",
-              "description": "The name of the opened side panel. 'none' means 'no panel opened'.",
-              "type": {
-                "text": "\"api\" | \"none\" | \"suggestions\" | \"variables\"",
-                "values": [
-                  {
-                    "value": "api",
-                    "type": "string"
-                  },
-                  {
-                    "value": "none",
-                    "type": "string"
-                  },
-                  {
-                    "value": "suggestions",
-                    "type": "string"
-                  },
-                  {
-                    "value": "variables",
-                    "type": "string"
-                  }
-                ]
-              },
-              "default": "\"none\"",
-              "fieldName": "openedSidePanel"
-            },
             {
               "name": "script",
               "description": "The arcade script. Use this property to define or update the script.",