@esri/solutions-components 1.1.0-next.20250814 → 1.1.0-next.20250818

package/dist/components/solution-item-diagram/customElement.js

@@ -1,14 +1,15 @@
-import { g as T, c as E } from "../../chunks/runtime.js";
-import { css as B, html as D } from "lit";
-import { u as A } from "../../chunks/useT9n.js";
-import { LitElement as C } from "@arcgis/lumina";
-import { createRef as y, ref as k } from "lit-html/directives/ref.js";
-import * as c from "gojs";
-import { injectGlobal as P } from "@emotion/css";
+import { c as b } from "../../chunks/runtime.js";
+import { css as E, html as B } from "lit";
+import { u as C } from "../../chunks/useT9n.js";
+import { LitElement as z } from "@arcgis/lumina";
+import { createRef as w, ref as y } from "lit-html/directives/ref.js";
+import * as d from "gojs";
+import { g as A } from "../../chunks/getItemIcon.js";
+import { injectGlobal as D } from "@emotion/css";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.1/esri/copyright.txt for details.
-v1.1.0-next.20250814 */
-const z = B`/** @license
+v1.1.0-next.20250818 */
+const P = E`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -22,7 +23,7 @@ const z = B`/** @license
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */#filter-bar{background-color:#f4f4f4;position:absolute;top:16px;right:220px;z-index:100}#filteredViewButtonDiv{padding:16px 16px 4px}#graph-navigation-bar{background-color:#f4f4f4;position:absolute;top:16px;right:16px;z-index:100}#graph-navigation-controls{position:absolute;top:0;right:0}`;
+ */#filter-bar{background-color:#f4f4f4;position:absolute;top:16px;right:220px;z-index:100}#filteredViewButtonDiv{padding:16px 16px 4px}#graph-navigation-bar{background-color:#f4f4f4;position:absolute;top:16px;right:16px;z-index:100}#graph-navigation-controls{position:absolute;top:0;right:0}.z-index-1{z-index:1}`;
 /** @license
  *
  * Copyright 2018 Esri
@@ -41,657 +42,348 @@ const z = B`/** @license
  *
  * email: contracts@esri.com
  */
-function $(r, i) {
-  const e = r.toLowerCase(), t = i || [], s = t.includes("Hosted Service");
-  switch (e.trim()) {
-    case "360 vr experience":
-      return "360vr";
-    case "3dtiles package":
-      return "3dtileslayerpackage";
-    case "3dtiles service":
-      return t.includes("3DObject") ? "3dobjecttileslayer" : t.includes("IntegratedMesh") ? "integratedmeshtileslayer" : "3dobjecttileslayer";
-    case "feature service":
-    case "feature collection":
-    case "kml":
-    case "wfs":
-      if (t.includes("IndoorPositioningDataService"))
-        return "indoorpositioningdataservice";
-      const n = t.includes("Spatiotemporal");
-      return t.includes("Table") ? n ? "spatiotemporaltable" : "table" : t.includes("Route Layer") ? "routelayer" : t.includes("Markup") ? "markup" : n ? "spatiotemporal" : t.includes("UtilityNetwork") ? "utilitynetwork" : s ? "featureshosted" : "features";
-    case "group":
-      return "group";
-    case "group layer":
-      return t.includes("Map") ? "layergroup2d" : t.includes("Scene") ? "layergroup3d" : "layergroup";
-    case "wmts":
-      return "maptiles";
-    case "map service":
-    case "wms":
-      return s || t.includes("Tiled") ? "maptiles" : "mapimages";
-    case "scene service":
-      return t.includes("Line") ? "sceneweblayerline" : t.includes("3DObject") ? "sceneweblayermultipatch" : t.includes("Point") ? "sceneweblayerpoint" : t.includes("IntegratedMesh") ? "sceneweblayermesh" : t.includes("PointCloud") ? "sceneweblayerpointcloud" : t.includes("Polygon") ? "sceneweblayerpolygon" : t.includes("Building") ? "sceneweblayerbuilding" : t.includes("Voxel") ? "sceneweblayervoxel" : "sceneweblayer";
-    case "image service":
-      return t.includes("Elevation 3D Layer") ? "elevationlayer" : t.includes("Tiled Imagery") ? "tiledimagerylayer" : "imagery";
-    case "stream service":
-      return "streamlayer";
-    case "video service":
-      return t.includes("Live Stream") ? "livestreamvideolayer" : "mediaservice";
-    case "vector tile service":
-      return "vectortile";
-    case "datastore catalog service":
-      return "datastorecollection";
-    case "geocoding service":
-      return "geocodeservice";
-    case "geoprocessing service":
-      return t.includes("Web Tool") ? "tool" : "layers";
-    case "geodata service":
-      return "geodataservice";
-    case "web map":
-    case "cityengine web scene":
-      return "maps";
-    case "web scene":
-      return t.includes("ViewingMode-Local") ? "webscenelocal" : "websceneglobal";
-    case "application":
-    case "web mapping application":
-    case "mobile application":
-    case "operation view":
-    case "desktop application":
-      return t.includes("configurableApp") ? "instantapps" : "apps";
-    case "map document":
-    case "map package":
-    case "published map":
-    case "scene document":
-    case "globe document":
-    case "basemap package":
-    case "mobile basemap package":
-    case "mobile map package":
-    case "project package":
-    case "project template":
-    case "pro map":
-    case "layout":
-      return "mapsgray";
-    case "layer":
-      return t.includes("ArcGIS Pro") ? "mapsgray" : "layersgray";
-    case "explorer map":
-      return t.indexOf("Explorer Document") ? "mapsgray" : t.includes("Explorer Mapping Application") ? "datafilesgray" : "mapsgray";
-    case "pro presentation":
-      return "propresentation";
-    case "api key":
-      return "key";
-    case "csv":
-      return "csv";
-    case "shapefile":
-      return "shapefile";
-    case "csv collection":
-      return "csvcollection";
-    case "media layer":
-      return "medialayer";
-    case "microsoft excel":
-      return "excel";
-    case "microsoft powerpoint":
-      return "powerpoint";
-    case "microsoft word":
-      return "word";
-    case "pdf":
-      return "pdf";
-    case "sqlite geodatabase":
-      return "sqlite";
-    case "administrative report":
-      return "report";
-    case "image":
-      return "image";
-    case "cad drawing":
-      return "cad";
-    case "service definition":
-    case "geojson":
-    case "netcdf":
-      return "data";
-    case "explorer add in":
-    case "desktop add in":
-    case "windows viewer add in":
-    case "windows viewer configuration":
-      return "appsgray";
-    case "arcgis pro add in":
-    case "arcgis pro configuration":
-      return "addindesktop";
-    case "rule package":
-    case "file geodatabase":
-    case "kml collection":
-    case "windows mobile package":
-    case "map template":
-    case "desktop application template":
-    case "gml":
-    case "arcpad package":
-    case "code sample":
-    case "document link":
-    case "earth configuration":
-    case "operations dashboard add in":
-    case "rules package":
-    case "workflow manager package":
-      return "datafilesgray";
-    case "form":
-      return t.includes("Survey123") ? "survey" : "datafilesgray";
-    case "network analysis service":
-    case "geometry service":
-    case "geoprocessing package":
-    case "locator package":
-    case "geoprocessing sample":
-    case "workflow manager service":
-      return "toolsgray";
-    case "layer package":
-    case "explorer layer":
-      return "layersgray";
-    case "scene package":
-      return "scenepackage";
-    case "mobile scene package":
-      return "mobilescenepackage";
-    case "tile package":
-    case "compact tile package":
-      return "tilepackage";
-    case "task file":
-      return "taskfile";
-    case "report template":
-      return "reporttemplate";
-    case "statistical data collection":
-      return "statisticaldatacollection";
-    case "analysis model":
-      return "geoprocessingmodel";
-    case "insights workbook":
-      return "workbook";
-    case "insights model":
-      return "insightsmodel";
-    case "insights page":
-      return "insightspage";
-    case "insights theme":
-      return "insightstheme";
-    case "hub initiative":
-      return "hubinitiative";
-    case "hub page":
-      return "hubpage";
-    case "hub event":
-      return "hubevent";
-    case "hub site application":
-      return "hubsite";
-    case "hub project":
-      return "hubproject";
-    case "relational database connection":
-      return "relationaldatabaseconnection";
-    case "image collection":
-      return "imagecollection";
-    case "style":
-      return t.includes("Dictionary") ? "dictionarystyle" : "style";
-    case "desktop style":
-      return "desktopstyle";
-    case "dashboard":
-      return "dashboard";
-    case "raster function template":
-      return "rasterprocessingtemplate";
-    case "vector tile package":
-      return "vectortilepackage";
-    case "ortho mapping project":
-      return "orthomappingproject";
-    case "ortho mapping template":
-      return "orthomappingtemplate";
-    case "solution":
-      return "solutions";
-    case "geopackage":
-      return "geopackage";
-    case "deep learning package":
-      return "deeplearningpackage";
-    case "real time analytic":
-      return "realtimeanalytics";
-    case "big data analytic":
-      return "bigdataanalytics";
-    case "feed":
-      return "feed";
-    case "excalibur imagery project":
-      return "excaliburimageryproject";
-    case "notebook":
-      return "notebook";
-    case "reality mapping project":
-      return "realitymappingproject";
-    case "storymap":
-      return t.includes("storymaptemplate") ? "storymapstemplate" : t.includes("storymapcollection") ? "storymapcollection" : t.includes("storymapbriefing") ? "storymapbriefing" : "storymap";
-    case "survey123 add in":
-      return "survey123addin";
-    case "mission":
-      return "mission";
-    case "mission report":
-      return "missionreport";
-    case "quickcapture project":
-      return "quickcaptureproject";
-    case "pro report":
-      return "proreport";
-    case "urban model":
-      return "urbanmodel";
-    case "urban project":
-      return "urbanproject";
-    case "web experience":
-      return "experiencebuilder";
-    case "web experience template":
-      return "webexperiencetemplate";
-    case "experience builder widget":
-      return "experiencebuilderwidget";
-    case "experience builder widget package":
-      return "experiencebuilderwidgetpackage";
-    case "workflow":
-      return "workflow";
-    case "insights script":
-      return "insightsscript";
-    case "kernel gateway connection":
-      return "kernelgatewayconnection";
-    case "hub initiative template":
-      return "hubinitiativetemplate";
-    case "storymap theme":
-      return "storymaptheme";
-    case "knowledge graph":
-      return "knowledgegraph";
-    case "knowledge studio project":
-      return "knowledgestudio";
-    case "knowledge graph layer":
-      return "knowledgegraphlayer";
-    case "native application":
-      return "nativeapp";
-    case "native application installer":
-      return "nativeappinstaller";
-    case "web link chart":
-      return "linkchart";
-    case "knowledge graph web investigation":
-      return "investigation";
-    case "ogcfeatureserver":
-      return "features";
-    case "pro project":
-      return "proproject";
-    case "insights workbook package":
-      return "insightsworkbookpackage";
-    case "apache parquet":
-      return "apacheparquet";
-    case "notebook code snippets":
-    case "notebook code snippet library":
-      return "notebookcodesnippets";
-    case "suitability model":
-      return "suitabilitymodel";
-    case "esri classifier definition":
-      return "classifierdefinition";
-    case "esri classification schema":
-      return "classificationschema";
-    case "insights data engineering workbook":
-      return "dataengineeringworkbook";
-    case "insights data engineering model":
-      return "dataengineeringmodel";
-    case "deep learning studio project":
-      return "deeplearningproject";
-    case "data store":
-      return "datastore";
-    case "data pipeline":
-      return "datapipeline";
-    default:
-      return t.includes("Document") ? "datafilesgray" : e.includes("service") ? "layers" : "maps";
-  }
-}
-/** @license
- *
- * Copyright 2018 Esri
- *
- * All rights reserved under the copyright laws of the United States and applicable international laws, treaties,
- * and conventions.
- *
- * This material is licensed for use under the Esri Master License Agreement (MLA), and is bound by the terms of
- * that agreement. You may redistribute and use this code without modification, provided you adhere to the terms
- * of the MLA and include this copyright notice.
- *
- * See use restrictions at http://www.esri.com/legal/pdfs/mla_e204_e300/english
- *
- * For additional information, contact: Environmental Systems Research Institute, Inc. Attn: Contracts and Legal
- * Services Department 380 New York Street Redlands, California, USA 92373 USA
- *
- * email: contracts@esri.com
- */
-const O = 15, H = 15, V = 10, m = new c.Size(220, 48), _ = 1, G = 8, w = new c.Size(48, 48), M = new c.Size(16, 16), b = new c.Size(153, 17), j = '400 0.75rem "Avenir Next", Avenir, "Helvetica Neue", sans-serif', R = '700 0.75rem "Avenir Next", Avenir, "Helvetica Neue", sans-serif', F = "#f4f4f4", W = "#cacaca", K = "#ffffff", v = "#4a4a4a", S = "#6a6a6a", q = "#ffffff", g = 1, N = 0.3, f = 1, x = 0.2, U = 1;
-function Y(r) {
-  const i = document.createElement("div");
-  i.style.width = "100%", i.style.height = "100%", r.appendChild(i);
-  const e = new c.Diagram(
-    i,
+const $ = 15, H = 15, O = 10, p = new d.Size(220, 48), V = 1, _ = 8, I = new d.Size(48, 48), G = new d.Size(16, 16), S = new d.Size(153, 17), M = '400 0.75rem "Avenir Next", Avenir, "Helvetica Neue", sans-serif', R = '700 0.75rem "Avenir Next", Avenir, "Helvetica Neue", sans-serif', F = "#f4f4f4", W = "#cacaca", K = "#ffffff", k = "#4a4a4a", N = "#6a6a6a", j = "#ffffff", u = 1, x = 0.3, g = 1, L = 0.2, Y = 1;
+function Z(a) {
+  const t = document.createElement("div");
+  t.style.width = "100%", t.style.height = "100%", a.appendChild(t);
+  const e = new d.Diagram(
+    t,
     // create a Diagram for the HTML Div element
     {
-      click: ne,
+      click: ie,
       // handle diagram clicks
-      contentAlignment: c.Spot.Center,
+      contentAlignment: d.Spot.Center,
       // align document to the center of the viewport
       dragSelectingTool: null,
       // disable drag selection
       hoverDelay: 50,
       // milliseconds before mouse-hover displays information
-      initialAutoScale: c.AutoScale.Uniform,
+      initialAutoScale: d.AutoScale.Uniform,
       // automatic zoom-to-fit
-      layout: new c.LayeredDigraphLayout({
-        columnSpacing: O,
+      layout: new d.LayeredDigraphLayout({
+        columnSpacing: $,
         layerSpacing: H
       }),
-      padding: V,
-      scrollMode: c.ScrollMode.Infinite,
+      padding: O,
+      scrollMode: d.ScrollMode.Infinite,
       // allow infinite scrolling--beyond document bounds
       "toolManager.hoverDelay": 50,
       // 50 milliseconds before tooltip appears
-      "toolManager.mouseWheelBehavior": c.WheelMode.Zoom
+      "toolManager.mouseWheelBehavior": d.WheelMode.Zoom
       // mouse wheel zooms instead of scrolls vertically
     }
   );
-  e.nodeTemplate = new c.Node("Auto", {
-    click: ae,
+  e.nodeTemplate = new d.Node("Auto", {
+    click: ne,
     movable: !1,
-    opacity: g,
-    toolTip: new c.Adornment("Auto", {
+    opacity: u,
+    toolTip: new d.Adornment("Auto", {
       isShadowed: !0,
-      margin: new c.Margin(12, 16, 6, 16),
+      margin: new d.Margin(12, 16, 6, 16),
       // top, right, bottom, left
       padding: 0,
       shadowBlur: 16,
       shadowColor: "rgba(0, 0, 0, 0.16)",
-      shadowOffset: new c.Point(0, 0)
-    }).add(new c.Panel("Vertical", { background: q, margin: 0 }).add(new c.TextBlock({ margin: 14 }).bind("text", "title")))
+      shadowOffset: new d.Point(0, 0)
+    }).add(new d.Panel("Vertical", { background: j, margin: 0 }).add(new d.TextBlock({ margin: 14 }).bind("text", "title")))
   }).bind("text", "title").add(
-    new c.Shape({
-      desiredSize: m,
+    new d.Shape({
+      desiredSize: p,
       fill: K,
-      geometryString: ie(
-        m.width,
-        m.height,
-        G,
-        w.width,
+      geometryString: te(
+        p.width,
+        p.height,
+        _,
+        I.width,
         !0
       ),
-      height: m.height,
+      height: p.height,
       portId: "",
       stroke: W,
-      strokeWidth: _,
-      width: m.width
+      strokeWidth: V,
+      width: p.width
     })
   ).add(
     // Node content
-    new c.Panel("Horizontal", {
-      alignment: c.Spot.Left,
-      stretch: c.Stretch.Horizontal
+    new d.Panel("Horizontal", {
+      alignment: d.Spot.Left,
+      stretch: d.Stretch.Horizontal
     }).add(
       // Icon panel
-      new c.Panel("Horizontal", {
-        alignment: c.Spot.Left,
-        desiredSize: w,
+      new d.Panel("Horizontal", {
+        alignment: d.Spot.Left,
+        desiredSize: I,
         margin: 1
       }).add(
-        new c.Panel("Horizontal", {
-          alignment: c.Spot.Center,
+        new d.Panel("Horizontal", {
+          alignment: d.Spot.Center,
           margin: 16
         }).add(
-          new c.Picture({
-            desiredSize: M
-          }).bind("source", "", (n) => se(n.itemType, n.itemTypeKeywords))
+          new d.Picture({
+            desiredSize: G
+          }).bind("source", "", (i) => A(i.itemType, i.itemTypeKeywords))
         )
       ),
       // Label
-      new c.Panel("Horizontal", {
-        alignment: c.Spot.Right,
-        margin: new c.Margin(4, 8, 0, 8)
+      new d.Panel("Horizontal", {
+        alignment: d.Spot.Right,
+        margin: new d.Margin(4, 8, 0, 8)
         // top, right, bottom, left
       }).add(
-        new c.Panel("Vertical", {}).add(
+        new d.Panel("Vertical", {}).add(
           // First line
-          new c.TextBlock({
-            alignment: c.Spot.Left,
-            desiredSize: b,
+          new d.TextBlock({
+            alignment: d.Spot.Left,
+            desiredSize: S,
             font: R,
-            overflow: c.TextOverflow.Ellipsis,
-            stroke: v,
-            wrap: c.Wrap.None
+            overflow: d.TextOverflow.Ellipsis,
+            stroke: k,
+            wrap: d.Wrap.None
           }).bind("text", "title"),
           // Second line
-          new c.TextBlock({
-            alignment: c.Spot.Left,
-            desiredSize: b,
-            font: j,
-            overflow: c.TextOverflow.Ellipsis,
-            stroke: v,
-            wrap: c.Wrap.None
+          new d.TextBlock({
+            alignment: d.Spot.Left,
+            desiredSize: S,
+            font: M,
+            overflow: d.TextOverflow.Ellipsis,
+            stroke: k,
+            wrap: d.Wrap.None
           }).bind("text", "itemTypeForDisplay")
         )
       )
     )
   ), e.commandHandler.zoomFactor = 1.05, e.setDivBackground(F);
-  const t = e.toolManager.clickSelectingTool;
-  t.standardMouseSelect = function() {
+  const r = e.toolManager.clickSelectingTool;
+  r.standardMouseSelect = function() {
   };
   const s = e.toolManager.draggingTool;
-  return s.isEnabled = !1, e.linkTemplate = new c.Link({
+  return s.isEnabled = !1, e.linkTemplate = new d.Link({
     corner: 5,
     movable: !1,
-    routing: c.Routing.Orthogonal,
+    routing: d.Routing.Orthogonal,
     selectable: !1
   }).add(
-    new c.Shape({
+    new d.Shape({
       // the link path shape
-      opacity: f,
-      stroke: S
+      opacity: g,
+      stroke: N
     }),
-    new c.Shape({
+    new d.Shape({
       // the 'to' arrowhead
-      fill: S,
-      opacity: f,
+      fill: N,
+      opacity: g,
       stroke: null,
       toArrow: "Standard"
     })
   ), e;
 }
-function p(r, i) {
-  r.model = new c.GraphLinksModel(i.nodes, i.links, {
+function m(a, t) {
+  a.model = new d.GraphLinksModel(t.nodes, t.links, {
     linkFromPortIdProperty: "fromPort",
     linkToPortIdProperty: "toPort"
   });
 }
-function Z(r, i, e, t = !0) {
-  if (t) {
-    const d = re(r, e);
-    d.addEventListener(
+function U(a, t, e, r = !0) {
+  if (r) {
+    const c = oe(a, e);
+    c.addEventListener(
       "calciteSwitchChange",
-      () => document.dispatchEvent(new CustomEvent("filteredViewChanged", { detail: d.checked }))
+      () => document.dispatchEvent(new CustomEvent("filteredViewChanged", { detail: c.checked }))
     );
   }
-  const { resetButton: s, centerButton: n, zoomInButton: a, zoomOutButton: o } = oe(r, e);
-  s.addEventListener("click", () => de(i)), n.addEventListener("click", () => i.zoomToFit()), a.addEventListener("click", () => i.commandHandler.increaseZoom()), o.addEventListener("click", () => i.commandHandler.decreaseZoom());
+  const { resetButton: s, centerButton: i, zoomInButton: n, zoomOutButton: o } = ae(a, e);
+  s.addEventListener("click", () => de(t)), i.addEventListener("click", () => t.zoomToFit()), n.addEventListener("click", () => t.commandHandler.increaseZoom()), o.addEventListener("click", () => t.commandHandler.decreaseZoom());
 }
-function J(r, i, e) {
-  le();
-  const t = Y(r);
-  return p(t, i), Z(r, t, e), t;
+function q(a, t, e) {
+  se();
+  const r = Z(a);
+  return m(r, t), U(a, r, e), r;
 }
-function L(r) {
-  const i = /* @__PURE__ */ new Set(), e = /* @__PURE__ */ new Set();
-  function t(n) {
-    n.findLinksInto().each(
-      (a) => {
-        e.add(a);
-        const o = a.fromNode;
-        o && !i.has(o) && (i.add(o), t(o));
+function T(a) {
+  const t = /* @__PURE__ */ new Set(), e = /* @__PURE__ */ new Set();
+  function r(i) {
+    i.findLinksInto().each(
+      (n) => {
+        e.add(n);
+        const o = n.fromNode;
+        o && !t.has(o) && (t.add(o), r(o));
       }
     );
   }
-  t(r);
-  function s(n) {
-    n.findLinksOutOf().each(
-      (a) => {
-        e.add(a);
-        const o = a.toNode;
-        o && !i.has(o) && (i.add(o), s(o));
+  r(a);
+  function s(i) {
+    i.findLinksOutOf().each(
+      (n) => {
+        e.add(n);
+        const o = n.toNode;
+        o && !t.has(o) && (t.add(o), s(o));
       }
     );
   }
-  return s(r), { connectedNodes: i, connectedLinks: e };
+  return s(a), { connectedNodes: t, connectedLinks: e };
 }
-function Q(r, i = !1, e) {
-  const t = [], s = r.map((a) => {
-    if (a.type !== "Group") {
-      const o = te(a);
-      return ee(a, o, i, e);
+function J(a, t = !1, e) {
+  const r = [], s = a.map((n) => {
+    if (n.type !== "Group") {
+      const o = ee(n);
+      return X(n, o, t, e);
     } else {
-      t.push(a.id);
+      r.push(n.id);
       return;
     }
-  }).filter((a) => a !== void 0), n = [];
-  return s.forEach((a) => {
-    (r.find((d) => d.id === a.itemId)?.dependencies || []).forEach((d) => {
-      const u = s.find((l) => l?.itemId === d);
-      u && n.push({
-        from: u.key,
-        fromSpot: c.Spot.AllSides,
-        to: a.key,
-        toSpot: c.Spot.AllSides
+  }).filter((n) => n !== void 0), i = [];
+  return s.forEach((n) => {
+    (a.find((c) => c.id === n.itemId)?.dependencies || []).forEach((c) => {
+      const h = s.find((l) => l?.itemId === c);
+      h && i.push({
+        from: h.key,
+        fromSpot: d.Spot.AllSides,
+        to: n.key,
+        toSpot: d.Spot.AllSides
       });
     });
-  }), { nodes: s, links: n, groupPseudoNodes: t };
+  }), { nodes: s, links: i, groupPseudoNodes: r };
 }
-function X(r, i, e, t = !0) {
-  const s = r.diagram;
+function Q(a, t, e, r = !0) {
+  const s = a.diagram;
   if (!s)
     return;
-  const n = {};
-  if (t) {
-    for (const a of s.nodes)
-      n[a.key] = a === r ? g : N;
-    for (const a of s.links) {
-      const o = `${a.fromNode?.key}-${a.toNode?.key}`;
-      n[o] = x;
+  const i = {};
+  if (r) {
+    for (const n of s.nodes)
+      i[n.key] = n === a ? u : x;
+    for (const n of s.links) {
+      const o = `${n.fromNode?.key}-${n.toNode?.key}`;
+      i[o] = L;
     }
     {
-      const { connectedNodes: a, connectedLinks: o } = L(r);
-      for (const d of a)
-        n[d.key] = g;
-      for (const d of o) {
-        const u = `${d.fromNode?.key}-${d.toNode?.key}`;
-        n[u] = U;
+      const { connectedNodes: n, connectedLinks: o } = T(a);
+      for (const c of n)
+        i[c.key] = u;
+      for (const c of o) {
+        const h = `${c.fromNode?.key}-${c.toNode?.key}`;
+        i[h] = Y;
       }
     }
   }
-  if (e && (e.adornedObject = r), t) {
-    const a = new c.Animation();
-    a.duration = 1;
+  if (e && (e.adornedObject = a), r) {
+    const n = new d.Animation();
+    n.duration = 1;
     for (const o of s.nodes)
-      a.add(o, "opacity", o.opacity, n[o.key]);
+      n.add(o, "opacity", o.opacity, i[o.key]);
     for (const o of s.links) {
-      const d = `${o.fromNode?.key}-${o.toNode?.key}`;
-      a.add(o, "opacity", o.opacity, n[d]);
+      const c = `${o.fromNode?.key}-${o.toNode?.key}`;
+      n.add(o, "opacity", o.opacity, i[c]);
     }
-    a.start();
+    n.start();
   }
 }
-function I(r, i, e, t, s = !0) {
-  if (r.length === 0)
+function v(a, t, e, r, s = !0) {
+  if (a.length === 0)
     return;
-  const n = i[0].diagram;
-  if (!n)
+  const i = t[0].diagram;
+  if (!i)
     return;
-  const a = {};
+  const n = {};
   if (s) {
-    for (const o of n.nodes) {
-      const d = r.includes(o.key);
-      a[o.key] = !e || d ? g : N;
+    for (const o of i.nodes) {
+      const c = a.includes(o.key);
+      n[o.key] = !e || c ? u : x;
     }
-    for (const o of n.links) {
-      const d = `${o.fromNode?.key}-${o.toNode?.key}`;
-      a[d] = e ? x : f;
+    for (const o of i.links) {
+      const c = `${o.fromNode?.key}-${o.toNode?.key}`;
+      n[c] = e ? L : g;
     }
   }
-  if (Object.keys(t).forEach((o) => {
-    t[o].adornedObject = null;
+  if (Object.keys(r).forEach((o) => {
+    r[o].adornedObject = null;
   }), s) {
-    const o = new c.Animation();
+    const o = new d.Animation();
     o.duration = 1;
-    for (const d of n.nodes)
-      o.add(d, "opacity", d.opacity, a[d.key]);
-    for (const d of n.links) {
-      const u = `${d.fromNode?.key}-${d.toNode?.key}`;
-      o.add(d, "opacity", d.opacity, a[u]);
+    for (const c of i.nodes)
+      o.add(c, "opacity", c.opacity, n[c.key]);
+    for (const c of i.links) {
+      const h = `${c.fromNode?.key}-${c.toNode?.key}`;
+      o.add(c, "opacity", c.opacity, n[h]);
     }
     o.start();
   }
 }
-function ee(r, i, e = !1, t) {
+function X(a, t, e = !1, r) {
   return {
-    key: i,
-    title: r.title,
-    itemId: r.id,
-    itemType: r.type,
-    itemTypeForDisplay: ce(r.type, r.typeKeywords),
-    itemTypeKeywords: r.typeKeywords,
-    group: r.type,
-    url: e ? `${t}?id=${r.id}` : void 0
+    key: t,
+    title: a.title,
+    itemId: a.id,
+    itemType: a.type,
+    itemTypeForDisplay: re(a.type, a.typeKeywords),
+    itemTypeKeywords: a.typeKeywords,
+    group: a.type,
+    url: e ? `${r}?id=${a.id}` : void 0
   };
 }
-function te(r) {
-  return r.id;
+function ee(a) {
+  return a.id;
 }
-function ie(r, i, e, t = 0, s = !1) {
-  let n = "";
-  s && (n += "F");
-  const a = r - 2 * e, o = i - 2 * e;
-  return n += " M0 0", n += ` h${a}`, n += ` a${e} ${e} 0 0 1 ${e} ${e}`, n += ` v${o}`, n += ` a${e} ${e} 0 0 1 ${-e} ${e}`, n += ` h${-a}`, n += ` a${e} ${e} 0 0 1 ${-e} ${-e}`, n += ` v${-o}`, n += ` a${e} ${e} 0 0 1 ${e} ${-e}`, t > 0 && (n += ` M${t - e} 0 v${i}`), n;
+function te(a, t, e, r = 0, s = !1) {
+  let i = "";
+  s && (i += "F");
+  const n = a - 2 * e, o = t - 2 * e;
+  return i += " M0 0", i += ` h${n}`, i += ` a${e} ${e} 0 0 1 ${e} ${e}`, i += ` v${o}`, i += ` a${e} ${e} 0 0 1 ${-e} ${e}`, i += ` h${-n}`, i += ` a${e} ${e} 0 0 1 ${-e} ${-e}`, i += ` v${-o}`, i += ` a${e} ${e} 0 0 1 ${e} ${-e}`, r > 0 && (i += ` M${r - e} 0 v${t}`), i;
 }
-function ne() {
+function ie() {
   document.dispatchEvent(new CustomEvent("clickInDiagram"));
 }
-function ae(r, i) {
-  const e = i.part;
-  e instanceof c.Node && (e.selectionAdorned = !1, document.dispatchEvent(new CustomEvent("clickOnNode", { detail: e })));
+function ne(a, t) {
+  const e = t.part;
+  e instanceof d.Node && (e.selectionAdorned = !1, document.dispatchEvent(new CustomEvent("clickOnNode", { detail: e })));
 }
-function re(r, i) {
+function oe(a, t) {
   const e = document.createElement("calcite-switch");
-  e.id = "filteredViewButton", e.label = i.filteredView;
-  const t = document.createElement("calcite-label");
-  t.id = "filteredViewButtonLabel", t.setAttribute("layout", "inline"), t.innerHTML = i.filteredView, t.appendChild(e);
+  e.id = "filteredViewButton", e.label = t.filteredView;
+  const r = document.createElement("calcite-label");
+  r.id = "filteredViewButtonLabel", r.setAttribute("layout", "inline"), r.innerHTML = t.filteredView, r.appendChild(e);
   const s = document.createElement("div");
-  s.id = "filteredViewButtonDiv", s.appendChild(t);
-  const n = document.createElement("calcite-action-pad");
-  n.id = "filter-bar-controls", n.layout = "horizontal", n.expandDisabled = !0, n.appendChild(s);
-  const a = document.createElement("div");
-  return a.id = "filter-bar", r.appendChild(a), a.appendChild(n), e;
+  s.id = "filteredViewButtonDiv", s.appendChild(r);
+  const i = document.createElement("calcite-action-pad");
+  i.id = "filter-bar-controls", i.layout = "horizontal", i.expandDisabled = !0, i.appendChild(s);
+  const n = document.createElement("div");
+  return n.id = "filter-bar", a.appendChild(n), n.appendChild(i), e;
 }
-function oe(r, i) {
+function ae(a, t) {
   const e = document.createElement("calcite-action");
   e.icon = "reset", e.id = "showHideGrayedOutButton";
-  const t = document.createElement("calcite-tooltip");
-  t.id = "resetButtonTooltip", t.innerHTML = i.reset, t.overlayPositioning = "fixed", t.placement = "bottom", t.referenceElement = e.id;
+  const r = document.createElement("calcite-tooltip");
+  r.id = "resetButtonTooltip", r.innerHTML = t.reset, r.overlayPositioning = "fixed", r.placement = "bottom", r.referenceElement = e.id;
   const s = document.createElement("calcite-action");
   s.icon = "zoom-to-object", s.id = "centerButton";
-  const n = document.createElement("calcite-tooltip");
-  n.id = "centerButtonTooltip", n.innerHTML = i.centerDiagram, n.overlayPositioning = "fixed", n.placement = "bottom", n.referenceElement = s.id;
-  const a = document.createElement("calcite-action");
-  a.icon = "plus", a.id = "zoomInButton";
+  const i = document.createElement("calcite-tooltip");
+  i.id = "centerButtonTooltip", i.innerHTML = t.centerDiagram, i.overlayPositioning = "fixed", i.placement = "bottom", i.referenceElement = s.id;
+  const n = document.createElement("calcite-action");
+  n.icon = "plus", n.id = "zoomInButton";
   const o = document.createElement("calcite-tooltip");
-  o.id = "zoomInButtonTooltip", o.innerHTML = i.zoomIn, o.overlayPositioning = "fixed", o.placement = "bottom", o.referenceElement = a.id;
-  const d = document.createElement("calcite-action");
-  d.icon = "minus", d.id = "zoomOutButton";
-  const u = document.createElement("calcite-tooltip");
-  u.id = "zoomOutButtonTooltip", u.innerHTML = i.zoomOut, u.overlayPositioning = "fixed", u.placement = "bottom", u.referenceElement = d.id;
+  o.id = "zoomInButtonTooltip", o.innerHTML = t.zoomIn, o.overlayPositioning = "fixed", o.placement = "bottom", o.referenceElement = n.id;
+  const c = document.createElement("calcite-action");
+  c.icon = "minus", c.id = "zoomOutButton";
+  const h = document.createElement("calcite-tooltip");
+  h.id = "zoomOutButtonTooltip", h.innerHTML = t.zoomOut, h.overlayPositioning = "fixed", h.placement = "bottom", h.referenceElement = c.id;
   const l = document.createElement("calcite-action-pad");
-  l.id = "graph-navigation-controls", l.layout = "horizontal", l.expandDisabled = !0, l.appendChild(e), l.appendChild(t), l.appendChild(s), l.appendChild(n), l.appendChild(a), l.appendChild(o), l.appendChild(d), l.appendChild(u);
-  const h = document.createElement("div");
-  return h.id = "graph-navigation-bar", r.appendChild(h), h.appendChild(l), { resetButton: e, centerButton: s, zoomInButton: a, zoomOutButton: d };
-}
-function se(r, i) {
-  const e = $(r, i), t = T("assets/item-icons/");
-  return e === "group" ? `${t}/${e}16.png` : `${t}/${e}16.svg`;
+  l.id = "graph-navigation-controls", l.layout = "horizontal", l.expandDisabled = !0, l.appendChild(e), l.appendChild(r), l.appendChild(s), l.appendChild(i), l.appendChild(n), l.appendChild(o), l.appendChild(c), l.appendChild(h);
+  const f = document.createElement("div");
+  return f.id = "graph-navigation-bar", a.appendChild(f), f.appendChild(l), { resetButton: e, centerButton: s, zoomInButton: n, zoomOutButton: c };
 }
-function ce(r, i) {
-  let e = r;
-  if (r === "Feature Service") {
-    const t = i.indexOf("View Service") > -1, s = i.indexOf("Table") > -1;
-    e = t && s ? "Table (hosted, view)" : s ? "Table (hosted)" : t ? "Feature Layer (hosted, view)" : "Feature Layer (hosted)";
+function re(a, t) {
+  let e = a;
+  if (a === "Feature Service") {
+    const r = t.indexOf("View Service") > -1, s = t.indexOf("Table") > -1;
+    e = r && s ? "Table (hosted, view)" : s ? "Table (hosted)" : r ? "Feature Layer (hosted, view)" : "Feature Layer (hosted)";
   }
-  return r === "Web Mapping Application" && (e = i.indexOf("configurableApp") > -1 ? "Instant App" : e), e = r === "Geoprocessing Service" ? "Tool" : e, e = r === "Feed" ? "Feed (hosted)" : e, e = r === "Real Time Analytic" ? "Real Time Analytic (hosted)" : e, e = r === "Big Data Analytic" ? "Big Data Analytic (hosted)" : e, e = r === "Vector Tile Service" ? "Tile Layer" : e, e;
+  return a === "Web Mapping Application" && (e = t.indexOf("configurableApp") > -1 ? "Instant App" : e), e = a === "Geoprocessing Service" ? "Tool" : e, e = a === "Feed" ? "Feed (hosted)" : e, e = a === "Real Time Analytic" ? "Real Time Analytic (hosted)" : e, e = a === "Big Data Analytic" ? "Big Data Analytic (hosted)" : e, e = a === "Vector Tile Service" ? "Tile Layer" : e, e;
 }
-function de(r) {
-  r.zoomToFit(), document.dispatchEvent(new CustomEvent("reset"));
+function de(a) {
+  a.zoomToFit(), document.dispatchEvent(new CustomEvent("reset"));
 }
-function le() {
-  P`
+function se() {
+  D`
     #filter-bar {
       background-color: #f4f4f4;
       position: absolute;
@@ -734,9 +426,9 @@ function le() {
  *
  * email: contracts@esri.com
  */
-const ue = 8, pe = 15, me = "#1e90ff", ge = 4;
-c.Diagram.licenseKey = "298647e0b16f4fc702d90676423d6bf919a175639c841aa45d0412f3ed083d06329fef2851d38f9787af4efe187c90d1ddc06e219e49563fe531d3da13e1d1aab03774e5140b4589f31136c5ccaa2ca1ae2870e0d2b676a1df678bedebaa";
-class he {
+const ce = 8, le = 15, he = "#1e90ff", me = 4;
+d.Diagram.licenseKey = "298647e0b16f4fc702d90676423d6bf919a175639c841aa45d0412f3ed083d06329fef2851d38f9787af4efe187c90d1ddc06e219e49563fe531d3da13e1d1aab03774e5140b4589f31136c5ccaa2ca1ae2870e0d2b676a1df678bedebaa";
+class pe {
   /**
    * Creates a new instance of the SolutionDisplay class.
    * @param indexPanel The Calcite panel element to use as the index panel.
@@ -747,21 +439,21 @@ class he {
    *     <calcite-panel id='diagramPanel' style='display:flex;'/>
    *   </calcite-shell>
    */
-  constructor(i, e, t) {
-    this.indexPanel = i, this.diagramPanel = e, this.diagramTranslations = t, this.currentSelectedGroupId = "", this.currentSelectedItemId = "", this.diagramNeedsRedraw = !1, this.usefilteredView = !1, this.handle_clickInDiagram = (s) => {
+  constructor(t, e, r) {
+    this.indexPanel = t, this.diagramPanel = e, this.diagramTranslations = r, this.currentSelectedGroupId = "", this.currentSelectedItemId = "", this.diagramNeedsRedraw = !1, this.usefilteredView = !1, this.handle_clickInDiagram = (s) => {
       s.stopImmediatePropagation(), (this.currentSelectedGroupId || this.currentSelectedItemId) && (this.currentSelectedGroupId = "", this.currentSelectedItemId = "", this.diagramNeedsRedraw = this.usefilteredView, this.redraw());
     }, this.handle_clickOnNode = (s) => {
       s.stopImmediatePropagation();
-      const n = s.detail.data.key;
-      this.redraw(n, n === this.currentSelectedItemId);
+      const i = s.detail.data.key;
+      this.redraw(i, i === this.currentSelectedItemId);
     }, this.handle_filteredViewChanged = (s) => {
       this.usefilteredView = s.detail, this.diagramNeedsRedraw = !!this.currentSelectedGroupId || !!this.currentSelectedItemId, this.redraw(this.currentSelectedItemId || this.currentSelectedGroupId);
     }, this.handle_reset = (s) => {
       s.stopImmediatePropagation(), this.reset();
     }, this.handle_solutionItemSelect = (s) => {
       s.stopImmediatePropagation();
-      const n = s.detail.itemId;
-      this.redraw(n, n === this.currentSelectedItemId || n === this.currentSelectedGroupId, !1);
+      const i = s.detail.itemId;
+      this.redraw(i, i === this.currentSelectedItemId || i === this.currentSelectedGroupId, !1);
     }, this.indexPanel.innerHTML = "", this.diagramPanel.innerHTML = "";
   }
   /**
@@ -770,8 +462,8 @@ class he {
    * @param typeKeywords The collection type keywords for the solution.
    * @returns A promise that resolves when the index and diagram have been created.
    */
-  create(i, e) {
-    this.collection = i, this.index = document.createElement("solution-item-accordion"), this.index.listSelectionMode = "single", this.index.style.overflowY = "auto", this.indexPanel.appendChild(this.index), this.index.templateInfos = i, this.index.typeKeywords = e, this.allNodesAndLinks = Q(i), this.diagram = J(
+  create(t, e) {
+    this.collection = t, this.index = document.createElement("solution-item-accordion"), this.index.linkType = "action", this.index.listSelectionMode = "single", this.index.typeKeywords = e, this.index.style.overflowY = "auto", this.indexPanel.appendChild(this.index), this.index.templateInfos = t, this.allNodesAndLinks = J(t), this.diagram = q(
       this.diagramPanel,
       this.allNodesAndLinks,
       this.diagramTranslations
@@ -788,10 +480,10 @@ class he {
    * Clears all selections in the index and diagram.
    * @param alsoCollapseAllAccordionItems Whether to collapse all accordion items in the index
    */
-  clearSelections(i = !0) {
-    this.index.deselectAll(), i && this.index.collapseAll();
-    const e = this.getNodesFromDiagram(this.diagram), t = e.map((s) => s.data.key);
-    I(t, e, !1, this.diagramNodeHighlighterIndex);
+  clearSelections(t = !0) {
+    this.index.deselectAll(), t && this.index.collapseAll();
+    const e = this.getNodesFromDiagram(this.diagram), r = e.map((s) => s.data.key);
+    v(r, e, !1, this.diagramNodeHighlighterIndex);
   }
   /**
    * Creates indicies into the diagram's nodes and node highlighters.
@@ -800,19 +492,19 @@ class he {
   createNodeHighlighters() {
     this.diagramNodeIndex = {}, this.diagramNodeHighlighterIndex = {}, this.getNodesFromDiagram(this.diagram).forEach((e) => {
       this.diagramNodeIndex[e.data.key] = e;
-      const t = new c.Adornment("Auto", {
+      const r = new d.Adornment("Auto", {
         background: "transparent",
         margin: 2
       });
-      t.add(new c.Shape("RoundedRectangle", {
+      r.add(new d.Shape("RoundedRectangle", {
         fill: "transparent",
-        parameter1: ue,
-        parameter2: pe,
-        stroke: me,
-        strokeWidth: ge
-      })), t.add(new c.Placeholder({
+        parameter1: ce,
+        parameter2: le,
+        stroke: he,
+        strokeWidth: me
+      })), r.add(new d.Placeholder({
         margin: 1
-      })), this.diagramNodeHighlighterIndex[e.data.key] = t;
+      })), this.diagramNodeHighlighterIndex[e.data.key] = r;
     });
   }
   /**
@@ -821,18 +513,18 @@ class he {
    * @param id Id of node to find
    * @returns Node matching the given id, or undefined if not found
    */
-  getNodeById(i) {
-    return this.diagramNodeIndex[i];
+  getNodeById(t) {
+    return this.diagramNodeIndex[t];
   }
   /**
    * Retrieves all nodes from the diagram.
    * @param diagram The diagram to search
    * @returns Array of nodes in the diagram
    */
-  getNodesFromDiagram(i) {
-    const e = [], t = i.nodes.iterator;
-    for (; t.next(); )
-      e.push(t.value);
+  getNodesFromDiagram(t) {
+    const e = [], r = t.nodes.iterator;
+    for (; r.next(); )
+      e.push(r.value);
     return e;
   }
   /**
@@ -841,75 +533,75 @@ class he {
    * @param toggleSelection Whether to toggle the selection state of the item
    * @param alsoCollapseAllAccordionItems Whether to collapse all accordion items in the index
    */
-  redraw(i = "", e = !1, t = !0) {
-    const s = this.allNodesAndLinks.groupPseudoNodes.includes(i);
-    this.diagramNeedsRedraw && (p(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), this.diagramNeedsRedraw = !1);
-    let n = !1;
-    if (this.clearSelections(t), !!i) {
+  redraw(t = "", e = !1, r = !0) {
+    const s = this.allNodesAndLinks.groupPseudoNodes.includes(t);
+    this.diagramNeedsRedraw && (m(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), this.diagramNeedsRedraw = !1);
+    let i = !1;
+    if (this.clearSelections(r), !!t) {
       if (s) {
-        if (this.currentSelectedItemId = "", this.currentSelectedGroupId !== i ? this.currentSelectedGroupId = i : e && (this.currentSelectedGroupId = this.currentSelectedGroupId ? "" : i, n = this.usefilteredView && !this.currentSelectedGroupId), this.currentSelectedGroupId) {
-          this.usefilteredView && (p(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters());
-          const a = this.collection.filter((d) => d.id === i)[0], o = a.dependencies.map((d) => this.diagramNodeIndex[d]);
+        if (this.currentSelectedItemId = "", this.currentSelectedGroupId !== t ? this.currentSelectedGroupId = t : e && (this.currentSelectedGroupId = this.currentSelectedGroupId ? "" : t, i = this.usefilteredView && !this.currentSelectedGroupId), this.currentSelectedGroupId) {
+          this.usefilteredView && (m(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters());
+          const n = this.collection.filter((c) => c.id === t)[0], o = n.dependencies.map((c) => this.diagramNodeIndex[c]);
           if (this.usefilteredView) {
-            const d = o.map((u) => u.data);
-            p(this.diagram, { nodes: d, links: [] });
+            const c = o.map((h) => h.data);
+            m(this.diagram, { nodes: c, links: [] });
           } else
-            I(a.dependencies, o, !0, this.diagramNodeHighlighterIndex);
+            v(n.dependencies, o, !0, this.diagramNodeHighlighterIndex);
           this.index.selectItem(this.currentSelectedGroupId);
         }
       } else {
-        this.currentSelectedGroupId = "", this.currentSelectedItemId !== i ? this.currentSelectedItemId = i : e && (this.currentSelectedItemId = this.currentSelectedItemId ? "" : i, n = this.usefilteredView && !this.currentSelectedItemId);
-        let a = this.getNodeById(i);
-        if ((!a || this.usefilteredView) && (p(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), a = this.getNodeById(i), !a))
+        this.currentSelectedGroupId = "", this.currentSelectedItemId !== t ? this.currentSelectedItemId = t : e && (this.currentSelectedItemId = this.currentSelectedItemId ? "" : t, i = this.usefilteredView && !this.currentSelectedItemId);
+        let n = this.getNodeById(t);
+        if ((!n || this.usefilteredView) && (m(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), n = this.getNodeById(t), !n))
           return;
         if (this.currentSelectedItemId) {
           if (this.usefilteredView) {
-            const o = L(a);
-            o.connectedNodes.add(a);
-            const d = Array.from(o.connectedNodes).map((l) => l.data), u = Array.from(o.connectedLinks).map((l) => l.data);
-            if (p(this.diagram, { nodes: d, links: u }), this.createNodeHighlighters(), a = this.getNodeById(i), !a)
+            const o = T(n);
+            o.connectedNodes.add(n);
+            const c = Array.from(o.connectedNodes).map((l) => l.data), h = Array.from(o.connectedLinks).map((l) => l.data);
+            if (m(this.diagram, { nodes: c, links: h }), this.createNodeHighlighters(), n = this.getNodeById(t), !n)
               return;
           }
-          a && setTimeout(() => X(a, !0, this.diagramNodeHighlighterIndex[i]), 1), this.index.selectItem(this.currentSelectedItemId);
+          n && setTimeout(() => Q(n, !0, this.diagramNodeHighlighterIndex[t]), 1), this.index.selectItem(this.currentSelectedItemId);
         }
       }
-      n && this.reset();
+      i && this.reset();
     }
   }
   /**
    * Clears all selections in the index and diagram.
    */
   reset() {
-    this.diagramNeedsRedraw = !1, this.currentSelectedGroupId = "", this.currentSelectedItemId = "", p(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), this.clearSelections();
+    this.diagramNeedsRedraw = !1, this.currentSelectedGroupId = "", this.currentSelectedItemId = "", m(this.diagram, this.allNodesAndLinks), this.createNodeHighlighters(), this.clearSelections();
   }
 }
-class fe extends C {
+class ue extends z {
   constructor() {
-    super(...arguments), this.templateInfoGraph = [], this.typeKeywords = [], this._diagramPanel = y(), this._diagramShell = y(), this._translations = A({ name: "solution-item-diagram", blocking: !0 });
+    super(...arguments), this.templateInfoGraph = [], this.typeKeywords = [], this._diagramPanel = w(), this._diagramShell = w(), this._translations = C({ name: "solution-item-diagram", blocking: !0 });
   }
   static {
     this.properties = { templateInfoGraph: 0, typeKeywords: 0, _diagramPanel: 16, _diagramShell: 16, _translations: 16 };
   }
   static {
-    this.styles = z;
+    this.styles = P;
   }
   updated() {
     if (this.templateInfoGraph.length > 0) {
-      const i = {
+      const t = {
         centerDiagram: this._translations.graphTranslations.centerDiagram,
         filteredView: this._translations.graphTranslations.filteredView,
         reset: this._translations.graphTranslations.reset,
         zoomIn: this._translations.graphTranslations.zoomIn,
         zoomOut: this._translations.graphTranslations.zoomOut
       };
-      this.solutionDisplay = new he(this._diagramShell.value, this._diagramPanel.value, i), this.solutionDisplay.create(this.templateInfoGraph, this.typeKeywords);
+      this.solutionDisplay = new pe(this._diagramShell.value, this._diagramPanel.value, t), this.solutionDisplay.create(this.templateInfoGraph, this.typeKeywords);
     }
   }
   render() {
-    return D`<calcite-shell><calcite-shell-panel id=diagram-shell-panel slot=panel-start ${k(this._diagramShell)}></calcite-shell-panel><calcite-panel id=diagram-panel slot=panel-bottom ${k(this._diagramPanel)}></calcite-panel></calcite-shell>`;
+    return B`<calcite-shell><calcite-shell-panel id=diagram-shell-panel slot=panel-start ${y(this._diagramShell)}></calcite-shell-panel><calcite-panel class="z-index-1" id=diagram-panel slot=panel-bottom ${y(this._diagramPanel)}></calcite-panel></calcite-shell>`;
   }
 }
-E("solution-item-diagram", fe);
+b("solution-item-diagram", ue);
 export {
-  fe as SolutionItemDiagram
+  ue as SolutionItemDiagram
 };