@esri/solutions-components 0.6.11 → 0.6.13

package/dist/components/downloadUtils.js

@@ -7,6 +7,7 @@ import { c as createCommonjsModule, g as getDefaultExportFromCjs } from './_comm
 import { getAssetPath } from '@stencil/core/internal/client';
 import { l as loadModules } from './loadModules.js';
 import { q as queryFeaturesByID } from './queryUtils.js';
+import { _ as __assign$1, r as request, c as cleanUrl } from './clean-url.js';
 
 /** @license
  * Copyright 2022 Esri
@@ -2240,6 +2241,94 @@ function downloadPDFFile(filename, labels, labelPageDescription, title = "", ini
 }
 //#endregion
 
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+/* Copyright (c) 2017-2018 Environmental Systems Research Institute, Inc.
+ * Apache-2.0 */
+/**
+ * Helper for methods with lots of first order request options to pass through as request parameters.
+ */
+function appendCustomParams(customOptions, keys, baseOptions) {
+    var requestOptionsKeys = [
+        "params",
+        "httpMethod",
+        "rawResponse",
+        "authentication",
+        "portal",
+        "fetch",
+        "maxUrlLength",
+        "headers"
+    ];
+    var options = __assign$1(__assign$1({ params: {} }, baseOptions), customOptions);
+    // merge all keys in customOptions into options.params
+    options.params = keys.reduce(function (value, key) {
+        if (customOptions[key] || typeof customOptions[key] === "boolean") {
+            value[key] = customOptions[key];
+        }
+        return value;
+    }, options.params);
+    // now remove all properties in options that don't exist in IRequestOptions
+    return requestOptionsKeys.reduce(function (value, key) {
+        if (options[key]) {
+            value[key] = options[key];
+        }
+        return value;
+    }, {});
+}
+
+/* Copyright (c) 2018 Environmental Systems Research Institute, Inc.
+ * Apache-2.0 */
+/**
+ *
+ * ```js
+ * import { queryRelated } from '@esri/arcgis-rest-feature-layer'
+ * //
+ * queryRelated({
+ *  url: "http://services.myserver/OrgID/ArcGIS/rest/services/Petroleum/KSPetro/FeatureServer/0",
+ *  relationshipId: 1,
+ *  params: { returnCountOnly: true }
+ * })
+ *  .then(response) // response.relatedRecords
+ * ```
+ * Query the related records for a feature service. See the [REST Documentation](https://developers.arcgis.com/rest/services-reference/query-related-records-feature-service-.htm) for more information.
+ *
+ * @param requestOptions
+ * @returns A Promise that will resolve with the query response
+ */
+function queryRelated(requestOptions) {
+    var options = appendCustomParams(requestOptions, ["objectIds", "relationshipId", "definitionExpression", "outFields"], {
+        httpMethod: "GET",
+        params: __assign({ 
+            // set default query parameters
+            definitionExpression: "1=1", outFields: "*", relationshipId: 0 }, requestOptions.params)
+    });
+    return request(cleanUrl(requestOptions.url) + "/queryRelatedRecords", options);
+}
+
 /** @license
  * Copyright 2022 Esri
  *
@@ -2256,24 +2345,40 @@ function downloadPDFFile(filename, labels, labelPageDescription, title = "", ini
  * limitations under the License.
  */
 const lineSeparatorChar = "|";
+/**
+ * Get the related records for a feature service.
+ *
+ * @param url Feature service's URL, e.g., layer.url
+ * @param relationshipId Id of relationship
+ * @param objectIds Objects in the feature service whose related records are sought
+ */
+function getFeatureServiceRelatedRecords(url, relationshipId, objectIds) {
+  const options = {
+    url: url + `/${relationshipId}`,
+    relationshipId,
+    objectIds
+  };
+  return queryRelated(options);
+}
 //#endregion
 // ------------------------------------------------------------------------------------------------------------------ //
 //#region Public functions
 /**
  * Create and consolidate labels from all layers
  *
+ * @param webmap Webmap containing layer
  * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
  * all attributes are exported
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns selectionSetNames that will be used for export filenames
  */
-async function consolidateLabels(exportInfos, formatUsingLayerPopup = true, includeHeaderNames = false, isCSVExport = false) {
+async function consolidateLabels(webmap, exportInfos, formatUsingLayerPopup = true, includeHeaderNames = false, isCSVExport = false) {
   const labelRequests = [];
   Object.keys(exportInfos).forEach(k => {
     var _a;
     const labelInfo = exportInfos[k];
-    labelRequests.push(_prepareLabels(((_a = labelInfo.layerView) === null || _a === void 0 ? void 0 : _a.layer) || labelInfo.layer, labelInfo.ids, formatUsingLayerPopup, includeHeaderNames));
+    labelRequests.push(_prepareLabels(webmap, ((_a = labelInfo.layerView) === null || _a === void 0 ? void 0 : _a.layer) || labelInfo.layer, labelInfo.ids, formatUsingLayerPopup, includeHeaderNames));
     if (isCSVExport) {
       // add the layer id as a temp value separator that we can use to split values for CSV export
       labelRequests.push(Promise.resolve([[k]]));
@@ -2285,6 +2390,7 @@ async function consolidateLabels(exportInfos, formatUsingLayerPopup = true, incl
 /**
  * Downloads csv of mailing labels for the provided list of ids
  *
+ * @param webmap Webmap containing layer
  * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
  * all attributes are exported
@@ -2292,8 +2398,8 @@ async function consolidateLabels(exportInfos, formatUsingLayerPopup = true, incl
  * @param addColumnTitle Indicates if column headings should be included in output
  * @returns Promise resolving when function is done
  */
-async function downloadCSV(exportInfos, formatUsingLayerPopup, removeDuplicates = false, addColumnTitle = false) {
-  let labels = await consolidateLabels(exportInfos, formatUsingLayerPopup, addColumnTitle, true);
+async function downloadCSV(webmap, exportInfos, formatUsingLayerPopup, removeDuplicates = false, addColumnTitle = false) {
+  let labels = await consolidateLabels(webmap, exportInfos, formatUsingLayerPopup, addColumnTitle, true);
   labels = removeDuplicates ? removeDuplicateLabels(labels) : labels;
   const layerIds = Object.keys(exportInfos);
   let layerLabels = [];
@@ -2315,6 +2421,7 @@ async function downloadCSV(exportInfos, formatUsingLayerPopup, removeDuplicates
 /**
  * Downloads csv of mailing labels for the provided list of ids
  *
+ * @param webmap Webmap containing layer
  * @param exportInfos Key details about what to export (ids, layer, and selectionSetNames)
  * @param labelPageDescription Provides PDF page layout info
  * @param removeDuplicates When true a single label is generated when multiple featues have a shared address value
@@ -2322,8 +2429,8 @@ async function downloadCSV(exportInfos, formatUsingLayerPopup, removeDuplicates
  * @param initialImageDataUrl Data URL of image for first page
  * @returns Promise resolving when function is done
  */
-async function downloadPDF(exportInfos, labelPageDescription, removeDuplicates = false, title = "", initialImageDataUrl = "") {
-  let labels = await consolidateLabels(exportInfos);
+async function downloadPDF(webmap, exportInfos, labelPageDescription, removeDuplicates = false, title = "", initialImageDataUrl = "") {
+  let labels = await consolidateLabels(webmap, exportInfos);
   const selectionSetNames = _getSelectionSetNames(exportInfos);
   labels =
     // Remove empty lines in labels
@@ -2452,6 +2559,87 @@ async function _convertPopupArcadeToLabelSpec(expressionInfo) {
     format: executor
   });
 }
+/**
+ * Extracts Arcade expressions from the lines of a label format and creates an Arcade executor for each
+ * referenced expression name.
+ *
+ * @param labelFormat Label to examine
+ * @param layer Layer from which to fetch features
+ * @return Promise resolving to a set of executors keyed using the expression name
+ */
+/*
+async function _createArcadeExecutors(
+  labelFormat: string,
+  layer: __esri.FeatureLayer
+): Promise<IArcadeExecutors> {
+  const arcadeExecutors: IArcadeExecutors = {};
+
+  // Are any Arcade expressions in the layer?
+  if (!Array.isArray(layer.popupTemplate.expressionInfos) || layer.popupTemplate.expressionInfos.length === 0) {
+    return Promise.resolve(arcadeExecutors);
+  }
+
+  // Are there any Arcade expressions in the label format?
+  const arcadeExpressionRegExp = /\{expression\/\w+\}/g;
+  const arcadeExpressionsMatches = labelFormat.match(arcadeExpressionRegExp);
+  if (!arcadeExpressionsMatches) {
+    return Promise.resolve(arcadeExecutors);
+  }
+
+  // Generate an Arcade executor for each match
+  const [arcade] = await loadModules(["esri/arcade"]);
+  const labelingProfile: __esri.Profile = {
+    variables: [
+      {
+        name: "$feature",
+        type: "feature"
+      },
+      {
+        name: "$layer",
+        type: "featureSet"
+      },
+      {
+        name: "$datastore",
+        type: "featureSetCollection"
+      },
+      {
+        name: "$map",
+        type: "featureSetCollection"
+      }
+    ]
+  };
+
+  const createArcadeExecutorPromises: IArcadeExecutorPromises = {};
+  arcadeExpressionsMatches.forEach(
+    (match: string) => {
+      const expressionName = match.substring(match.indexOf("/") + 1, match.length - 1);
+
+      (layer.popupTemplate.expressionInfos || []).forEach(
+        expressionInfo => {
+          if (expressionInfo.name === expressionName) {
+            createArcadeExecutorPromises[expressionName] =
+              arcade.createArcadeExecutor(expressionInfo.expression, labelingProfile);
+          }
+        }
+      );
+    }
+  );
+
+  const promises = Object.values(createArcadeExecutorPromises);
+  return Promise.all(promises)
+  .then(
+    executors => {
+      const expressionNames = Object.keys(createArcadeExecutorPromises);
+
+      for (let i = 0; i < expressionNames.length; ++i) {
+        arcadeExecutors[expressionNames[i]] = executors[i].valueOf() as __esri.ArcadeExecutor;
+      }
+
+      return arcadeExecutors;
+    }
+  );
+}
+*/
 /**
  * Creates a title from a list of selection set names.
  *
@@ -2515,52 +2703,73 @@ function _getFieldNamesFromFieldExpressions(fieldExpressions) {
 /**
  * Extracts the label format from the layer.
  *
+ * @param webmap Webmap containing layer
  * @param layer Layer with label format
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
  * all attributes are exported
- * @param attributeFormats Empty object to hold the formats for each attribute in a feature; the object is filled
- * with formats by this function
  * @returns A Promise resolving to the format of a single label with fields coerced to lowercase, e.g.,
- * for ILabelFormat type "pattern": "{name}|{street}|{city}, {state} {zip}"
+ * for ILabelFormatProps type "pattern": "{name}|{street}|{city}, {state} {zip}"
  */
-async function _getLabelFormat(layer, formatUsingLayerPopup, attributeFormats) {
-  var _a, _b, _c, _d, _e, _f;
-  let labelFormat = {
-    type: "unsupported",
-    format: undefined
+async function _getLabelFormat(webmap, layer, formatUsingLayerPopup) {
+  var _a, _b;
+  let labelFormatProps = {
+    layer,
+    attributeFormats: {},
+    relationshipId: undefined,
+    labelFormat: {
+      type: "unsupported",
+      format: undefined
+    }
   };
   if (layer.popupEnabled) {
     layer.popupTemplate.fieldInfos.forEach(
     // Extract any format info that we have
     fieldInfo => {
       if (fieldInfo.format) {
-        attributeFormats[fieldInfo.fieldName.toLowerCase()] = fieldInfo.format;
+        labelFormatProps.attributeFormats[fieldInfo.fieldName.toLowerCase()] = fieldInfo.format;
       }
     });
     // What is the nature of the label content?
     // Fields list
-    if (formatUsingLayerPopup && ((_b = (_a = layer.popupTemplate) === null || _a === void 0 ? void 0 : _a.content[0]) === null || _b === void 0 ? void 0 : _b.type) === "fields") {
-      labelFormat = _convertPopupFieldsToLabelSpec(layer.popupTemplate.fieldInfos);
-      // If popup is configured with "no attribute information", then no fields will visible
-      if (labelFormat.format.length === 0) {
-        // Can we use the popup title?
-        labelFormat = layer.popupTemplate.title && typeof layer.popupTemplate.title === "string" ?
-          { type: "pattern", format: layer.popupTemplate.title }
-          :
-            // Otherwise revert to using attributes
-            _convertPopupFieldsToLabelSpec(layer.popupTemplate.fieldInfos, true);
+    if (formatUsingLayerPopup) {
+      const labelFormatType = (_b = (_a = layer.popupTemplate) === null || _a === void 0 ? void 0 : _a.content[0]) === null || _b === void 0 ? void 0 : _b.type;
+      if (labelFormatType === "relationship") {
+        const relationshipId = layer.popupTemplate.content[0].relationshipId;
+        const webmapLayers = webmap.layers.toArray().concat(webmap.tables.toArray())
+          .filter((entry) => entry.type === "feature"
+          && entry.id !== layer.id
+          && entry.relationships
+          && entry.relationships.some(relationship => relationship.id === relationshipId));
+        labelFormatProps = await _getLabelFormat(webmap, webmapLayers[0], formatUsingLayerPopup);
+        labelFormatProps.relationshipId = relationshipId;
+      }
+      else if (labelFormatType === "fields") {
+        labelFormatProps.labelFormat = _convertPopupFieldsToLabelSpec(layer.popupTemplate.fieldInfos);
+        // If popup is configured with "no attribute information", then no fields will visible
+        if (labelFormatProps.labelFormat.format.length === 0) {
+          // Can we use the popup title?
+          labelFormatProps.labelFormat = layer.popupTemplate.title && typeof layer.popupTemplate.title === "string" ?
+            { type: "pattern", format: layer.popupTemplate.title }
+            :
+              // Otherwise revert to using attributes
+              _convertPopupFieldsToLabelSpec(layer.popupTemplate.fieldInfos, true);
+        }
+        // Example text: '<p>{name} {age} years &nbsp;</p><p>started: {start}</p>'
+      }
+      else if (labelFormatType === "text") {
+        labelFormatProps.labelFormat = _convertPopupTextToLabelSpec(layer.popupTemplate.content[0].text);
+        // Example expression: 'var feat = $feature\nvar label = `\n\t${feat["name"]} ${feat["age"]} years <br>\n\tstarted: ${feat["start"]}\n`\n\nreturn { \n  type : \'text\', \n  text : label\n}',
+      }
+      else if (labelFormatType === "expression") {
+        labelFormatProps.labelFormat = await _convertPopupArcadeToLabelSpec(layer.popupTemplate.content[0].expressionInfo);
+        // Fallback to all fields
+      }
+      else {
+        labelFormatProps.labelFormat = _convertPopupFieldsToLabelSpec(layer.popupTemplate.fieldInfos);
       }
-      // Example text: '<p>{name} {age} years &nbsp;</p><p>started: {start}</p>'
-    }
-    else if (formatUsingLayerPopup && ((_d = (_c = layer.popupTemplate) === null || _c === void 0 ? void 0 : _c.content[0]) === null || _d === void 0 ? void 0 : _d.type) === "text") {
-      labelFormat = _convertPopupTextToLabelSpec(layer.popupTemplate.content[0].text);
-      // Example expression: 'var feat = $feature\nvar label = `\n\t${feat["name"]} ${feat["age"]} years <br>\n\tstarted: ${feat["start"]}\n`\n\nreturn { \n  type : \'text\', \n  text : label\n}',
-    }
-    else if (formatUsingLayerPopup && ((_f = (_e = layer.popupTemplate) === null || _e === void 0 ? void 0 : _e.content[0]) === null || _f === void 0 ? void 0 : _f.type) === "expression") {
-      labelFormat = await _convertPopupArcadeToLabelSpec(layer.popupTemplate.content[0].expressionInfo);
     }
   }
-  return Promise.resolve(labelFormat);
+  return Promise.resolve(labelFormatProps);
 }
 /**
  * Extract selectionSetNames from the provided exportInfos
@@ -2632,6 +2841,7 @@ function _prepareAttributeValue(attributeValue, attributeType, attributeDomain,
 /**
  * Creates labels from items.
  *
+ * @param webmap Webmap containing layer
  * @param layer Layer from which to fetch features
  * @param ids List of ids to download
  * @param formatUsingLayerPopup When true, the layer's popup is used to choose attributes for each column; when false,
@@ -2639,32 +2849,51 @@ function _prepareAttributeValue(attributeValue, attributeType, attributeDomain,
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns Promise resolving when function is done
  */
-async function _prepareLabels(layer, ids, formatUsingLayerPopup = true, includeHeaderNames = false) {
-  // Get the features to export
-  const featureSet = await queryFeaturesByID(ids, layer, [], false);
+async function _prepareLabels(webmap, layer, ids, formatUsingLayerPopup = true, includeHeaderNames = false) {
+  // Get the label formatting, if any
+  const labelFormatProps = await _getLabelFormat(webmap, layer, formatUsingLayerPopup);
+  // Because the label may actually come from a related layer, we'll use the layer that comes back from _getLabelFormat.
+  // That function returns the supplied layer in all cases except for a "relationship" type of popup.
+  const featureLayer = labelFormatProps.layer;
+  let featureSet = [];
+  if (typeof (labelFormatProps.relationshipId) !== "undefined") {
+    // Get the related items for each id
+    const relatedRecResponse = await getFeatureServiceRelatedRecords(layer.url, labelFormatProps.relationshipId, ids);
+    const objectIdField = layer.objectIdField;
+    let relatedFeatureIds = [];
+    relatedRecResponse.relatedRecordGroups.forEach((relatedRecGroup) => {
+      relatedFeatureIds = relatedFeatureIds.concat(relatedRecGroup.relatedRecords.map((rec) => rec.attributes[objectIdField]));
+    });
+    // Remove duplicates
+    relatedFeatureIds.sort();
+    relatedFeatureIds = relatedFeatureIds.filter((id, i) => i === 0 ? true : id !== relatedFeatureIds[i - 1]);
+    // Get the full items
+    featureSet = await queryFeaturesByID(relatedFeatureIds, featureLayer, [], false);
+  }
+  else {
+    // Get the features to export
+    featureSet = await queryFeaturesByID(ids, featureLayer, [], false);
+  }
   // Get field data types. Do we have any domain-based fields?
   const attributeOrigNames = {};
   const attributeTypes = {};
   const attributeDomains = {};
-  layer.fields.forEach(field => {
+  featureLayer.fields.forEach(field => {
     const lowercaseFieldname = field.name.toLowerCase();
     attributeOrigNames[lowercaseFieldname] = field.name;
     attributeDomains[lowercaseFieldname] = field.domain;
     attributeTypes[lowercaseFieldname] = field.type;
   });
-  const attributeFormats = {};
-  // Get the label formatting, if any
-  const labelFormat = await _getLabelFormat(layer, formatUsingLayerPopup, attributeFormats);
   // Apply the label format
-  const labels = labelFormat.type === "unsupported" ?
-    // Export all attributes
-    await _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomains, includeHeaderNames)
-    : labelFormat.type == "pattern" ?
-      // Export attributes in format
-      await _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat.format, includeHeaderNames)
+  const labels = labelFormatProps.labelFormat.type === "pattern" ?
+    // Export attributes in format
+    await _prepareLabelsFromPattern(/*layer,*/ featureSet, attributeOrigNames, attributeTypes, attributeDomains, labelFormatProps.attributeFormats, labelFormatProps.labelFormat.format, includeHeaderNames)
+    : labelFormatProps.labelFormat.type === "executor" ?
+      // Export attributes in expression
+      await _prepareLabelsUsingExecutor(featureSet, labelFormatProps.labelFormat.format)
       :
-        // Export attributes in expression
-        await _prepareLabelsUsingExecutor(featureSet, labelFormat.format);
+        // Export all attributes
+        await _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomains, includeHeaderNames);
   return Promise.resolve(labels);
 }
 /**
@@ -2708,14 +2937,30 @@ async function _prepareLabelsFromAll(featureSet, attributeTypes, attributeDomain
  * @param includeHeaderNames Add the label format at the front of the list of generated labels
  * @returns Promise resolving with list of labels, each of which is a list of label lines
  */
-async function _prepareLabelsFromPattern(featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
+async function _prepareLabelsFromPattern(
+//layer: __esri.FeatureLayer,
+featureSet, attributeOrigNames, attributeTypes, attributeDomains, attributeFormats, labelFormat, includeHeaderNames = false) {
   const [intl] = await loadModules(["esri/intl"]);
   // Find the label fields that we need to replace with values
   const attributeExpressionMatches = _getFieldExpressionsFromLabel(labelFormat);
   const attributeNames = _getFieldNamesFromFieldExpressions(attributeExpressionMatches);
+  // Do we need any Arcade executors?
+  //const arcadeExecutors = await _createArcadeExecutors(labelFormat, layer);
+  //const arcadeExpressionRegExp = /\{expression\/\w+\}/g;
+  // Find the label fields that we need to replace with values
+  //const arcadeExpressionMatches = labelFormat.match(arcadeExpressionRegExp) ?? [];
   // Convert feature attributes into an array of labels
   const labels = await Promise.all(featureSet.map(async (feature) => {
     let labelPrep = labelFormat;
+    /*
+    // Replace Arcade expressions in this feature
+    for (let i = 0; i < arcadeExpressionMatches.length; i++) {
+      const match: string = arcadeExpressionMatches[i];
+      const expressionName = match.substring(match.indexOf("/") + 1, match.length - 1);
+      const value = await arcadeExecutors[expressionName].executeAsync({"$feature": feature, "$layer", layer});
+      labelPrep = labelPrep.replace(match, value);
+    }
+    */
     // Replace non-Arcade fields in this feature
     attributeNames.forEach((attributeName, i) => {
       const lowercaseFieldname = attributeName.toLowerCase();

package/dist/components/edit-card2.js

@@ -9,7 +9,7 @@ import { g as getLocaleComponentStrings } from './locale.js';
 import { d as defineCustomElement$2 } from './icon.js';
 import { d as defineCustomElement$1 } from './notice.js';
 
-const editCardCss = ":host{display:block}.padding-bottom-1{padding-bottom:1rem}.font-bold{font-weight:var(--calcite-font-weight-bold)}.font-500{font-weight:var(--calcite-font-weight-medium)}.font-italic{font-style:italic}#feature-form{--calcite-ui-background:none;padding-top:0px}.padding-sides-bottom-1{padding:0 1rem 1rem 1rem}.position-relative{position:relative}.esri-editor__prompt--danger{position:relative !important;width:100% !important;background-color:var(--calcite-ui-foreground-1) !important}";
+const editCardCss = ":host{display:block}.padding-bottom-1{padding-bottom:1rem}.font-bold{font-weight:var(--calcite-font-weight-bold)}.font-500{font-weight:var(--calcite-font-weight-medium)}.font-italic{font-style:italic}#feature-form{--calcite-ui-background:none;padding-top:0px}.padding-sides-bottom-1{padding:0 1rem 1rem 1rem}.position-relative{position:relative}.esri-editor__prompt--danger{position:relative !important;width:100% !important;background-color:var(--calcite-ui-foreground-1) !important}.esri-feature__content-node{background-color:var(--calcite-ui-foreground-1) !important}.esri-editor__panel-toolbar{display:none !important}";
 
 const EditCard = /*@__PURE__*/ proxyCustomElement(class EditCard extends HTMLElement {
   constructor() {

package/dist/components/info-card2.js

@@ -16,7 +16,7 @@ import { d as defineCustomElement$3 } from './shell.js';
 import { d as defineCustomElement$2 } from './tooltip.js';
 import { d as defineCustomElement$1 } from './edit-card2.js';
 
-const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:8px}tr:nth-child(odd){background:var(--calcite-ui-foreground-2)}.bottom-border{padding-bottom:0.5rem;border-bottom:1px solid var(--calcite-ui-border-1)}.padding-1-2{padding:0.5rem}.padding-top-1-2{padding-top:0.5rem}.font-color-3{color:var(--calcite-ui-text-3)}.display-none{display:none}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.edit-btn{z-index:999;position:absolute}.edit-btn-position{right:0.5rem;top:0.5rem}html[dir=\"rtl\"] .edit-btn-position{left:0}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.min-width-100{min-width:100px}";
+const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:8px}tr:nth-child(odd){background:var(--calcite-ui-foreground-2)}.bottom-border{padding-bottom:0.5rem;border-bottom:1px solid var(--calcite-ui-border-1)}.padding-1-2{padding:0.5rem}.padding-top-1-2{padding-top:0.5rem}.font-color-3{color:var(--calcite-ui-text-3)}.display-none{display:none}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-ui-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-ui-foreground-1) !important;height:100% !important}";
 
 const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLElement {
   constructor() {
@@ -42,6 +42,9 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
    */
   async graphicsWatchHandler() {
     var _a;
+    if (!this._features) {
+      await this._initFeaturesWidget();
+    }
     if (this.graphics.length > 0) {
       const featureLayer = (_a = this.graphics[0]) === null || _a === void 0 ? void 0 : _a.layer;
       this._editEnabled = featureLayer.editingEnabled && featureLayer.capabilities.operations.supportsUpdate;
@@ -58,9 +61,7 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
    * Watch for changes to the mapView and re-init the Feature widget
    */
   async mapViewWatchHandler() {
-    await this.mapView.when(async () => {
-      await this._initFeaturesWidget();
-    });
+    return await this._initFeaturesWidget();
   }
   //--------------------------------------------------------------------------
   //
@@ -106,7 +107,7 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
     const featureNodeClass = this.isLoading || this._editRecordOpen ? "display-none" : "position-absolute";
     const editClass = !this.isLoading && this._editRecordOpen ? "position-absolute" : "display-none";
     const editButtonClass = !this.isLoading && this._editRecordOpen ? "display-none" : "";
-    return (h(Host, null, h("calcite-shell", null, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} display-flex padding-1-2 button-container`, slot: "footer" }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, this._getCount()), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next)))), h("div", { class: `${editButtonClass} edit-btn edit-btn-position` }, h("calcite-button", { appearance: "outline", "icon-start": "pencil", id: "solutions-edit", onClick: () => this._openEditRecord() }, this._translations.edit), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit))), h("edit-card", { class: editClass, graphicIndex: (_a = this._features) === null || _a === void 0 ? void 0 : _a.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
+    return (h(Host, null, h("calcite-shell", null, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", "icon-start": "pencil", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit))), h("div", { class: "display-flex padding-1-2 button-container top-border" }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, this._getCount()), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_a = this._features) === null || _a === void 0 ? void 0 : _a.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
   }
   //--------------------------------------------------------------------------
   //
@@ -136,27 +137,29 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
    * @protected
    */
   async _initFeaturesWidget() {
-    if (!this._features) {
-      this._features = new this.Features({
-        view: this.mapView,
-        container: "features-node",
-        visibleElements: {
-          actionBar: false,
-          closeButton: false,
-          heading: true
-        }
-      });
-      if (this.zoomAndScrollToSelected) {
-        this.reactiveUtils.watch(() => this._features.selectedFeatureIndex, (i) => {
-          if (i > -1) {
-            this.selectionChanged.emit(this._features.selectedFeature);
+    return await this.mapView.when(() => {
+      if (!this._features) {
+        this._features = new this.Features({
+          view: this.mapView,
+          container: "features-node",
+          visibleElements: {
+            actionBar: false,
+            closeButton: false,
+            heading: true
           }
         });
+        if (this.zoomAndScrollToSelected) {
+          this.reactiveUtils.watch(() => this._features.selectedFeatureIndex, (i) => {
+            if (i > -1) {
+              this.selectionChanged.emit(this._features.selectedFeature);
+            }
+          });
+        }
       }
-    }
-    else {
-      this._features.view = this.mapView;
-    }
+      else {
+        this._features.view = this.mapView;
+      }
+    });
   }
   /**
    * Set the alertOpen member to false when the alert is closed

package/dist/components/interfaces.js

@@ -59,11 +59,6 @@ var ESelectionType;
   ESelectionType["POLY"] = "POLY";
   ESelectionType["RECT"] = "RECT";
 })(ESelectionType || (ESelectionType = {}));
-var EExpandType;
-(function (EExpandType) {
-  EExpandType["EXPAND"] = "EXPAND";
-  EExpandType["COLLAPSE"] = "COLLAPSE";
-})(EExpandType || (EExpandType = {}));
 var EWorkflowType;
 (function (EWorkflowType) {
   EWorkflowType["SEARCH"] = "SEARCH";
@@ -82,4 +77,4 @@ var EDrawMode;
   EDrawMode["REFINE"] = "REFINE";
 })(EDrawMode || (EDrawMode = {}));
 
-export { EWorkflowType as E, ELayoutMode as a, EExpandType as b, EDrawMode as c, EExportType as d, EPageType as e, ESelectionMode as f, EUpdateType as g };
+export { EWorkflowType as E, ELayoutMode as a, EDrawMode as b, EExportType as c, EPageType as d, ESelectionMode as e, EUpdateType as f };