@arcgis/coding-components 4.30.0-next.7 → 4.30.0-next.71

package/dist/components/arcade-suggestions.js

@@ -1,12 +1,14 @@
 /*!
  * 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.7
+ * v4.30.0-next.71
  */
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client';
 import { g as generateColorizeStyles, o as onColorizeThemeChanged, c as convertMarkdownString, b as colorizeCodeElement } from './markdown.js';
 import { f as filterCollection } from './utilities.js';
-import { B, q, W } from './index2.js';
+import { u as useControllerManager } from './chunk-63RMNUHL.js';
+import { e as setFocusOnElement } from './index2.js';
+import { u as useT9n } from './useT9n.js';
 import "@esri/calcite-components/dist/components/calcite-list-item-group.js";
 import "@esri/calcite-components/dist/components/calcite-list-item.js";
 import "@esri/calcite-components/dist/components/calcite-action.js";
@@ -16,7 +18,6 @@ import "@esri/calcite-components/dist/components/calcite-block.js";
 import "@esri/calcite-components/dist/components/calcite-flow.js";
 import "@esri/calcite-components/dist/components/calcite-input.js";
 import "@esri/calcite-components/dist/components/calcite-list.js";
-import { getArcgisAssetPath as getAssetPath } from "./arcgis-assets.js";
 
 function isSuggestionGroups(item) {
     if (!Array.isArray(item)) {
@@ -28,15 +29,19 @@ function isSuggestionGroups(item) {
     return Array.isArray(item[0].suggestions);
 }
 
-const arcadeSuggestionsCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-quarter);padding:var(--calcite-spacing-half);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}:host calcite-block p:first-of-type{margin-top:0}:host calcite-block code{font-family:var(--calcite-code-family)}:host calcite-block pre{direction:ltr;overflow-x:auto;background-color:var(--calcite-color-foreground-2);padding:var(--calcite-spacing-half)}:host calcite-block pre code{font-size:var(--calcite-font-size--2)}";
+const arcadeSuggestionsCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}:host calcite-block p:first-of-type{margin-top:0}:host calcite-block code{font-family:var(--calcite-code-family)}:host calcite-block pre{direction:ltr;overflow-x:auto;background-color:var(--calcite-color-foreground-2);padding:var(--calcite-spacing-sm)}:host calcite-block pre code{font-size:var(--calcite-font-size--2)}:host calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}";
 
+const __cmpMeta = [1,"arcgis-arcade-suggestions",{"suggestions":[1040],"_selectedSuggestion":[32],"_filterValue":[32],"_colorizeStyle":[32]},undefined,{"suggestions":["suggestionsPropChanged"]}];
 const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeSuggestions extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this.__attachShadow();
-        this.close = createEvent(this, "close", 3);
-        this.itemSelected = createEvent(this, "itemSelected", 3);
+        this.arcgisClose = createEvent(this, "arcgisClose", 3);
+        this.arcgisItemSelected = createEvent(this, "arcgisItemSelected", 3);
+        this.manager = useControllerManager(this,forceUpdate);
+        this.messages = useT9n();
         this._updateFilterValue = (e) => {
             this._filterValue = e.target?.value ?? "";
         };
@@ -48,7 +53,7 @@ const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArc
             const keyEvent = e;
             if (!keyEvent.key || keyEvent.key === "Enter") {
                 e.preventDefault();
-                this.itemSelected.emit(item.code);
+                this.arcgisItemSelected.emit(item.code);
             }
         };
         this._showSuggestionDetail = (e) => {
@@ -60,14 +65,11 @@ const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArc
             this._selectedSuggestion = item;
         };
         this._emitClose = () => {
-            this.close.emit();
+            this.arcgisClose.emit();
         };
         this._beforeBack = async () => {
             this._selectedSuggestion = undefined;
         };
-        this._lang = "";
-        this._t9nLocale = "";
-        this._t9nStrings = undefined;
         this._selectedSuggestion = undefined;
         this._filterValue = "";
         this._colorizeStyle = "";
@@ -80,13 +82,11 @@ const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArc
     // #region Component lifecycle events
     async componentWillLoad() {
         this._colorizeStyle = generateColorizeStyles();
-        this._themeChangedListner = onColorizeThemeChanged(() => (this._colorizeStyle = generateColorizeStyles()));
-        await B(this, getAssetPath("./assets"));
+        this._themeChangedListener = onColorizeThemeChanged(() => (this._colorizeStyle = generateColorizeStyles()));
     }
     disconnectedCallback() {
         this._flowObserver?.disconnect();
-        this._themeChangedListner?.dispose();
-        q(this);
+        this._themeChangedListener?.dispose();
     }
     // #endregion
     //#region Private Methods
@@ -104,7 +104,7 @@ const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArc
         // 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 });
     }
@@ -122,37 +122,27 @@ const ArcgisArcadeSuggestions = /*@__PURE__*/ proxyCustomElement(class ArcgisArc
     renderSuggestionListItems(suggestions) {
         suggestions = filterCollection(suggestions, "label", this._filterValue);
         if (!suggestions.length) {
-            return h("div", { class: "notice-container" }, this._t9nStrings?.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
         }
-        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._t9nStrings?.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("calcite-flow-item", { heading: this._t9nStrings?.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._t9nStrings?.insert), h("calcite-block", { open: true, heading: suggestion.label, description: suggestion.description }, h("div", { innerHTML: convertMarkdownString(suggestion.documentation) }), h("pre", null, h("code", { ref: (e) => e === undefined ? undefined : void colorizeCodeElement(e, suggestion.code).catch(console.error) })))));
+        return (h("calcite-flow-item", { heading: this.messages.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose, beforeBack: this._beforeBack }, h("calcite-button", { width: "half", slot: "footer", appearance: "outline", kind: "brand", "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(Host, null, h("style", null, this._colorizeStyle), h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, h("calcite-flow-item", { heading: this._t9nStrings?.suggestions, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-input", { value: this._filterValue, icon: "magnifying-glass", clearable: true, onCalciteInputInput: this._updateFilterValue, class: "sticky", scale: "m" }), h("calcite-list", null, this.renderSuggestionGroups())), this.renderSuggestionFlowItem())));
+        return (h(Host, 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 _hostElement() { return this; }
+    get el() { return this; }
     static get watchers() { return {
         "suggestions": ["suggestionsPropChanged"]
     }; }
     static get style() { return arcadeSuggestionsCss; }
-}, [1, "arcgis-arcade-suggestions", {
-        "suggestions": [16],
-        "_lang": [32],
-        "_t9nLocale": [32],
-        "_t9nStrings": [32],
-        "_selectedSuggestion": [32],
-        "_filterValue": [32],
-        "_colorizeStyle": [32]
-    }, undefined, {
-        "suggestions": ["suggestionsPropChanged"]
-    }]);
+}, __cmpMeta);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;

package/dist/components/arcade-variables.js

@@ -1,11 +1,13 @@
 /*!
  * 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.7
+ * v4.30.0-next.71
  */
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { B, q, W, K } from './index2.js';
+import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
+import { u as useControllerManager } from './chunk-63RMNUHL.js';
+import { e as setFocusOnElement, d as createFilterExpression } from './index2.js';
 import { b as arcadeDefaults } from './arcade-defaults.js';
+import { u as useT9n } from './useT9n.js';
 import "@esri/calcite-components/dist/components/calcite-flow-item.js";
 import "@esri/calcite-components/dist/components/calcite-action.js";
 import "@esri/calcite-components/dist/components/calcite-input.js";
@@ -15,22 +17,25 @@ import "@esri/calcite-components/dist/components/calcite-list-item-group.js";
 import "@esri/calcite-components/dist/components/calcite-list-item.js";
 import "@esri/calcite-components/dist/components/calcite-icon.js";
 import "@esri/calcite-components/dist/components/calcite-flow.js";
-import { getArcgisAssetPath as getAssetPath } from "./arcgis-assets.js";
 
-const arcadeVariablesCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-quarter);padding:var(--calcite-spacing-half);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}";
+const arcadeVariablesCss = ":host{background-color:var(--calcite-color-foreground-1)}:host .notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}:host .sticky{position:sticky;top:0px;z-index:10}:host calcite-flow{height:100%}:host calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}";
 
 function stopEnterPropagation(e) {
     if (e.key === "Enter") {
         e.stopPropagation();
     }
 }
+const __cmpMeta = [1,"arcgis-arcade-variables",{"loading":[1028],"modelId":[1025,"model-id"],"_mutationCounter":[32],"_flowItemRenderers":[32],"_filterValue":[32]},undefined,{"modelId":["modelIdPropChanged"]}];
 const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcadeVariables extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+this.constructor.__registerControllers = ()=>__cmpMeta[2]??{};
         this.__attachShadow();
-        this.close = createEvent(this, "close", 3);
-        this.itemSelected = createEvent(this, "itemSelected", 3);
+        this.arcgisClose = createEvent(this, "arcgisClose", 3);
+        this.arcgisItemSelected = createEvent(this, "arcgisItemSelected", 3);
+        this.manager = useControllerManager(this,forceUpdate);
+        this.messages = useT9n();
         this._updateFilterValue = (e) => {
             this._filterValue = e.target.value;
         };
@@ -39,7 +44,7 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
             this._filterValue = "";
         };
         this._emitClose = () => {
-            this.close.emit();
+            this.arcgisClose.emit();
         };
         this._backToTop = () => {
             this._flowItemRenderers = [];
@@ -52,7 +57,7 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
             const keyEvent = e;
             if (!keyEvent.key || keyEvent.key === "Enter") {
                 e.preventDefault();
-                this.itemSelected.emit(variable.snippet);
+                this.arcgisItemSelected.emit(variable.snippet);
             }
         };
         this._showCollectionPanel = (e) => {
@@ -63,9 +68,6 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
             e.stopPropagation();
             this.addPanelRenderer(this.collectionBasedVariableRenderer(collectionVariable));
         };
-        this._lang = "";
-        this._t9nLocale = "";
-        this._t9nStrings = undefined;
         this._mutationCounter = 1;
         this._flowItemRenderers = [];
         this._filterValue = "";
@@ -76,12 +78,7 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
         this._flowItemRenderers = [];
     }
     //#endregion
-    // #region Component lifecycle events
-    async componentWillLoad() {
-        await B(this, getAssetPath("./assets"));
-    }
     disconnectedCallback() {
-        q(this);
         this._flowObserver?.disconnect();
     }
     // #endregion
@@ -106,7 +103,7 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
         // 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 });
     }
@@ -135,15 +132,15 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
                 });
                 loading = true;
             }
-            return (h("calcite-flow-item", { heading: this._t9nStrings?.profilevariables, description: collection.breadcrumb, beforeBack: this._beforeBack, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-action", { slot: "header-actions-end", text: this._t9nStrings?.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._t9nStrings?.loading ?? "Loading" })) : (h("calcite-list", null, this.renderEditorVariables(collection)))));
+            return (h("calcite-flow-item", { heading: this.messages.profilevariables, description: collection.breadcrumb, beforeBack: this._beforeBack, closable: true, onCalciteFlowItemClose: this._emitClose }, h("calcite-action", { slot: "header-actions-end", text: this.messages.backtotop ?? "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 = K(this._filterValue);
+        const filterExpression = createFilterExpression(this._filterValue);
         const filteredVariables = collection.variables.filter((variable) => variable.passFilter(filterExpression));
         if (!filteredVariables.length) {
-            return h("div", { class: "notice-container" }, this._t9nStrings?.noitems ?? "No item");
+            return h("div", { class: "notice-container" }, this.messages.noitems ?? "No item");
         }
         return filteredVariables.map((variable) => this.renderEditorVariable(variable));
     }
@@ -153,34 +150,23 @@ const ArcgisArcadeVariables = /*@__PURE__*/ proxyCustomElement(class ArcgisArcad
                 // Group is a collection but we represent it differently
                 return (h("calcite-list-item-group", { heading: variable.getLabel() }, this.renderEditorVariables(variable)));
             default:
-                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._t9nStrings?.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));
+                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("calcite-flow", null, h("calcite-flow-item", { heading: this._t9nStrings?.profilevariables, closable: true, onCalciteFlowItemClose: this._emitClose }, h("div", { class: "notice-container" }, this._t9nStrings?.noprofilevariablesmessage ?? ""))));
+            return (h("calcite-flow", null, h("calcite-flow-item", { heading: this.messages.profilevariables, closable: true, onCalciteFlowItemClose: this._emitClose }, h("div", { class: "notice-container" }, this.messages.noprofilevariablesmessage ?? ""))));
         }
         return (h("calcite-flow", { ref: (ref) => this.flowFocusHandler(ref) }, this.collectionBasedVariableRenderer(profile, true)(), this._flowItemRenderers.map((renderer) => renderer())));
     }
     static get assetsDirs() { return ["assets"]; }
-    get _hostElement() { return this; }
+    get el() { return this; }
     static get watchers() { return {
         "modelId": ["modelIdPropChanged"]
     }; }
     static get style() { return arcadeVariablesCss; }
-}, [1, "arcgis-arcade-variables", {
-        "loading": [4],
-        "modelId": [1, "model-id"],
-        "_lang": [32],
-        "_t9nLocale": [32],
-        "_t9nStrings": [32],
-        "_mutationCounter": [32],
-        "_flowItemRenderers": [32],
-        "_filterValue": [32]
-    }, undefined, {
-        "modelId": ["modelIdPropChanged"]
-    }]);
+}, __cmpMeta);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;

package/dist/components/arcgis-arcade-api.js

@@ -1,7 +1,7 @@
 /*!
  * 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.7
+ * v4.30.0-next.71
  */
 import { A as ArcgisArcadeApi$1, d as defineCustomElement$1 } from './arcade-api.js';