@esri/solutions-components 1.0.6 → 1.1.0-next.20250731

package/dist/components/solution-social-share/customElement.js

@@ -0,0 +1,178 @@
+import { c as w } from "../../chunks/runtime.js";
+import { css as b, html as e, svg as u } from "lit";
+import { u as $ } from "../../chunks/useT9n.js";
+import { LitElement as y, nothing as p, safeStyleMap as a, safeClassMap as k } from "@arcgis/lumina";
+import { createRef as r, ref as c } from "lit-html/directives/ref.js";
+/*! 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.20250731 */
+const x = b`/** @license
+ * Copyright 2025 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the 'License');
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an 'AS IS' BASIS,
+ * 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.
+ */:host{display:block;--solutions-social-share-action-width: initial;--solutions-social-share-width--s: 200px;--solutions-social-share-width--m: 280px;--solutions-social-share-width--l: 320px;--solutions-social-share-width-horizontal--s: 300px;--solutions-social-share-width-horizontal--m: 380px;--solutions-social-share-width-horizontal--l: 420px;--solutions-social-share-background-color: var(--calcite-color-foreground-1);--solutions-social-share-popover-button-background-color: transparent;--solutions-social-share-popover-button-icon-color: var(--calcite-ui-icon-color);--solutions-social-share-border: 1px solid var(--calcite-color-border-1)}.solutions-social-share__popover-button{background-color:var(--solutions-social-share-popover-button-background-color)}.solutions-social-share__popover-button calcite-icon{color:var(--solutions-social-share-popover-button-icon-color)}.solutions-social-share__dialog{background-color:var(--solutions-social-share-background-color);border:var(--solutions-social-share-border);box-sizing:border-box;height:auto;padding:10px 0;border-radius:5px;color:var(--calcite-color-text-1)}.solutions-social-share__options{margin:0;padding:1% 0 0;list-style-type:none}.solutions-social-share__options li{box-sizing:border-box;display:flex;align-items:center;width:100%;padding:5%;transition:background-color .15s ease-out 0s}.solutions-social-share__options li .solutions-social-share__icon,.solutions-social-share__options li .solutions-social-share__option-text{display:inline-block}.solutions-social-share__options li .solutions-social-share__icon{display:flex;align-items:center}.solutions-social-share__options li .solutions-social-share__option-text{width:85%;margin-left:10px;word-break:break-word}.solutions-social-share__options li .solutions-social-share__option-text--rtl{margin-left:0;margin-right:10px}.solutions-social-share__options li:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.solutions-social-share__options__x-logo--light path{fill:#000}.solutions-social-share__options__x-logo--dark path{fill:#fff}.solutions-social-share__success{display:flex;flex-direction:column;padding:15px}.solutions-social-share__success-header{display:flex;align-items:center;font-weight:700;margin-bottom:10px}.solutions-social-share__success-icon{display:flex;align-items:center;margin-right:5px}.solutions-social-share__success-icon calcite-icon{color:var(--calcite-color-status-success)}.solutions-social-share__success-message{line-height:16px}.solutions-social-share__layout--horizontal .solutions-social-share__options{display:flex;justify-content:space-around;margin-bottom:8%}.solutions-social-share__layout--horizontal .solutions-social-share__options li{flex-direction:column;padding:0}.solutions-social-share__layout--horizontal .solutions-social-share__options li .solutions-social-share__option-text{word-break:break-word;margin-left:0;margin-top:10px;text-align:center}.solutions-social-share__layout--horizontal .solutions-social-share__options li:hover{background-color:unset}.solutions-social-share__icon-container{display:flex;align-items:center}calcite-action{width:var(--solutions-social-share-action-width)}:host([scale=s]) .solutions-social-share__dialog{width:var(--solutions-social-share-width--s)}:host([scale=s]) .solutions-social-share__icon{width:16px;height:16px}:host([scale=s]) .solutions-social-share__option-text{font-size:var(--calcite-font-size--1)}:host([scale=s]) .solutions-social-share__dialog.solutions-social-share__layout--horizontal{width:var(--solutions-social-share-width-horizontal--s)}:host([scale=m]) .solutions-social-share__dialog{width:var(--solutions-social-share-width--m)}:host([scale=m]) .solutions-social-share__icon{width:24px;height:24px}:host([scale=m]) .solutions-social-share__option-text{font-size:var(--calcite-font-size-0)}:host([scale=m]) .solutions-social-share__dialog.solutions-social-share__layout--horizontal{width:var(--solutions-social-share-width-horizontal--m)}:host([scale=l]) .solutions-social-share__dialog{width:var(--solutions-social-share-width--l)}:host([scale=l]) .solutions-social-share__icon{width:32px;height:32px}:host([scale=l]) .solutions-social-share__option-text{font-size:var(--calcite-font-size-1)}:host([scale=l]) .solutions-social-share__dialog.solutions-social-share__layout--horizontal{width:var(--solutions-social-share-width-horizontal--l)}`, v = typeof window < "u" && "$arcgis" in window && typeof window.$arcgis == "object" && "import" in window.$arcgis && !("forceESM" in window.$arcgis);
+function g(i) {
+  return i.default !== void 0;
+}
+async function R() {
+  if (v)
+    return await window.$arcgis.import("esri/intl");
+  const i = await import("@arcgis/core/intl.js");
+  return g(i) ? i.default : i;
+}
+async function L() {
+  if (v)
+    return await window.$arcgis.import("esri/request");
+  const i = await import("@arcgis/core/request.js");
+  return g(i) ? i.default : i;
+}
+const f = ".calcite-mode-dark", S = {
+  facebook: "https://www.facebook.com/sharer/sharer.php?u={url}",
+  x: "https://x.com/intent/post?url={url}",
+  linkedIn: "https://www.linkedin.com/sharing/share-offsite/?url={url}",
+  bluesky: "https://bsky.app/intent/compose?text={url}"
+}, I = "https://arcg.is/prod/shorten";
+class C extends y {
+  constructor() {
+    super(...arguments), this.actionApperance = "transparent", this.autoUpdateShareUrl = !0, this.buttonAppearance = "transparent", this.inlineSuccessPopoverPlacement = "trailing", this.mode = "popover", this.popoverButtonIconScale = "m", this.popoverPositioning = "absolute", this.removePopoverOffset = !1, this.scale = "s", this.shareButtonKind = "neutral", this.shareButtonScale = "m", this.shareButtonText = "", this.shareButtonType = "button", this.shareIconsLayout = "vertical", this.shareText = "", this.shareUrl = window.location.href, this.shortenShareUrl = !0, this.socialMedia = !0, this.successMessage = "", this._copied = !1, this._inlineCopyLinkOpened = !1, this._opened = !1, this._translations = $({ name: "solution-social-share", blocking: !0 }), this._copyLinkPopoverRef = r(), this._dialogContentRef = r(), this._popoverActionRef = r(), this._popoverButtonRef = r(), this._popoverRef = r(), this._shareListRef = r();
+  }
+  static {
+    this.properties = { actionApperance: 1, autoUpdateShareUrl: 5, buttonAppearance: 1, inlineSuccessPopoverPlacement: 3, mode: 3, popoverButtonIconScale: 3, popoverPositioning: 3, removePopoverOffset: 7, scale: 3, shareButtonKind: 3, shareButtonScale: 3, shareButtonText: 1, shareButtonType: 3, shareIconsLayout: 3, shareText: 3, shareUrl: 1, shortenShareUrl: 7, socialMedia: 7, successMessage: 3, _copied: 16, _inlineCopyLinkOpened: 16, _opened: 16, _translations: 16 };
+  }
+  static {
+    this.styles = x;
+  }
+  loaded() {
+    this._setupAutoCloseListeners(), this.mode === "popover" && this._popoverRef.value && (this._opened && (this._popoverRef.value.open = !0), this.listenOn(this._popoverRef.value, "calcitePopoverOpen", () => {
+      if (!this._shareListRef.value)
+        return;
+      this._shareListRef.value.children[0].focus();
+    }), this.listenOn(this._popoverRef.value, "keydown", this._handlePopoverRefKeyDown));
+  }
+  render() {
+    const s = this._copied && this.mode === "popover" ? this._renderSuccess() : e`<div class=solutions-social-share__dialog-content>${this._renderOptions()}</div>`, o = this.shareIconsLayout === "vertical" ? " solutions-social-share__layout--vertical" : " solutions-social-share__layout--horizontal", l = ` calcite-mode-${this.el.closest(f) ? "dark" : "light"}`, t = e`<div class=${`solutions-social-share__dialog${o}${l}`} ${c(this._dialogContentRef)}>${s}</div>`, n = this.removePopoverOffset ? 0 : 6;
+    return this.mode === "popover" ? [
+      e`<calcite-popover .label=${this._translations.share?.label ?? ""} reference-element=shareButton placement=bottom-start .scale=${this.scale} overlay-positioning=${this.popoverPositioning ?? p} offset-distance=${n ?? p} pointer-disabled=${this.removePopoverOffset ?? p} ${c(this._popoverRef)}>${t}</calcite-popover>`,
+      this._renderButton()
+    ] : [
+      t,
+      e`<calcite-popover .label=${this._translations.share?.label ?? ""} reference-element=copyToClipboard .placement=${this.inlineSuccessPopoverPlacement} .scale=${this.scale} overlay-positioning=fixed ${c(this._copyLinkPopoverRef)}>${this._renderSuccess()}</calcite-popover>`
+    ];
+  }
+  _setupAutoCloseListeners() {
+    this.listenOn(document.documentElement, "click", this._autoCloseCallback), this.mode === "popover" && this._popoverRef.value ? (this.listenOn(this._popoverRef.value, "click", this._stopPropagationCallback), this.listenOn(this._popoverRef.value, "calcitePopoverClose", this._resetPopoverCopyState)) : this._dialogContentRef.value && this.listenOn(this._dialogContentRef.value, "click", this._stopPropagationCallback);
+  }
+  _handlePopoverRefKeyDown(s) {
+    if (s.code === "Tab") {
+      if (!this._shareListRef.value)
+        return;
+      const o = s.target, l = this._shareListRef.value.children[0], t = this._shareListRef.value.children[this._shareListRef.value.children.length - 1];
+      s.shiftKey && o === l ? (s.preventDefault(), t.focus()) : !s.shiftKey && o === t && (s.preventDefault(), l.focus());
+    } else s.code === "Escape" && (this._closePopover(), this.shareButtonType === "button" ? this._popoverButtonRef.value?.setFocus() : this._popoverActionRef.value?.setFocus());
+  }
+  _autoCloseCallback() {
+    this.mode === "popover" ? (this._opened = !1, this._popoverRef.value.open = this._opened) : (this._copyLinkPopoverRef.value && (this._copyLinkPopoverRef.value.open = !1), this._inlineCopyLinkOpened = !1);
+  }
+  _stopPropagationCallback(s) {
+    s.stopPropagation();
+  }
+  _resetPopoverCopyState() {
+    this.shareButtonType === "button" ? this._popoverButtonRef.value?.setFocus() : this._popoverActionRef.value?.setFocus(), setTimeout(() => {
+      this._copied = !1;
+    }, 200);
+  }
+  _renderButton() {
+    const s = this.shareButtonScale != null ? this.shareButtonScale : this.scale;
+    return this.shareButtonType === "button" ? e`<calcite-button .appearance=${this.buttonAppearance} class=solutions-social-share__popover-button icon-end=share id=shareButton .kind=${this.shareButtonKind} .label=${this._translations.share?.label} @click=${this._togglePopover.bind(this)} .scale=${s} title=${this._translations.share?.label ?? p} ${c(this._popoverButtonRef)}>${this.shareButtonText}</calcite-button>` : e`<calcite-action alignment=center .appearance=${this.actionApperance} class=solutions-social-share__popover-button id=shareButton .label=${this._translations.share?.label} @click=${this._togglePopover.bind(this)} .scale=${s} text title=${this._translations.share?.label ?? p} ${c(this._popoverActionRef)}><div class=solutions-social-share__icon-container><calcite-icon icon=share .scale=${this.popoverButtonIconScale}></calcite-icon></div></calcite-action>`;
+  }
+  _renderSuccess() {
+    const s = this._translations.success;
+    return e`<div class=solutions-social-share__success><span class=solutions-social-share__success-header><span class=solutions-social-share__success-icon><calcite-icon icon=check-circle-f .scale=${this.scale}></calcite-icon></span>${s?.label}</span><span class=solutions-social-share__success-message>${this.successMessage || s?.url}</span></div>`;
+  }
+  _renderOptions() {
+    const s = this._translations.options, o = document.dir === "rtl" ? " solutions-social-share__option-text--rtl" : "";
+    return e`<ul class=solutions-social-share__options role=menu ${c(this._shareListRef)}><li id=copyToClipboard @click=${this._handleShareItem.bind(this, "link")} @keydown=${this._handleOptionKeyDown("link")} role=menuitem tabindex=0><span class=solutions-social-share__icon><calcite-icon icon=link .scale=${this.scale}></calcite-icon></span><span class=${`solutions-social-share__option-text${o}`}>${s?.link?.label}</span></li>${this.socialMedia ? [
+      e`<li @click=${this._handleShareItem.bind(this, "facebook")} @keydown=${this._handleOptionKeyDown("facebook")} role=menuitem tabindex=0><span class=solutions-social-share__icon>${this._renderFacebookIcon()}</span><span class=${`solutions-social-share__option-text${o}`}>${s?.facebook?.label}</span></li>`,
+      e`<li @click=${this._handleShareItem.bind(this, "x")} @keydown=${this._handleOptionKeyDown("x")} role=menuitem tabindex=0><span class=solutions-social-share__icon>${this._renderXIcon()}</span><span class=${`solutions-social-share__option-text${o}`}>\r\n                X</span></li>`,
+      e`<li @click=${this._handleShareItem.bind(this, "linkedIn")} @keydown=${this._handleOptionKeyDown("linkedIn")} role=menuitem tabindex=0><span class=solutions-social-share__icon>${this._renderLinkedInIcon()}</span><span class=${`solutions-social-share__option-text${o}`}>${s?.linkedIn?.label}</span></li>`,
+      e`<li @click=${this._handleShareItem.bind(this, "bluesky")} @keydown=${this._handleOptionKeyDown("bluesky")} role=menuitem tabindex=0><span class=solutions-social-share__icon>${this._renderBlueSkyIcon()}</span><span class=${`solutions-social-share__option-text${o}`}>${s?.blueSky?.label}</span></li>`
+    ] : null}</ul>`;
+  }
+  _handleOptionKeyDown(s) {
+    return (o) => {
+      const l = o.code;
+      (l === "Space" || l === "Enter") && this._handleShareItem(s);
+    };
+  }
+  _renderFacebookIcon() {
+    return e`<svg height=100% style=${a({ fillRule: "evenodd", clipRule: "evenodd", strokeLinejoin: "round", strokeMiterlimit: "2" })} version=1.1 viewBox="0 0 512 512" width=100% xmlns=http://www.w3.org/2000/svg>${u`<g><path d="M512,256c0,-141.385 -114.615,-256 -256,-256c-141.385,0 -256,114.615 -256,256c0,127.777 93.616,233.685 216,252.89l0,-178.89l-65,0l0,-74l65,0l0,-56.4c0,-64.16 38.219,-99.6 96.695,-99.6c28.009,0 57.305,5 57.305,5l0,63l-32.281,0c-31.801,0 -41.719,19.733 -41.719,39.978l0,48.022l71,0l-11.35,74l-59.65,0l0,178.89c122.385,-19.205 216,-125.113 216,-252.89Z" style=${a({ fill: "#1877f2", fillRule: "nonzero" })} /><path d="M355.65,330l11.35,-74l-71,0l0,-48.022c0,-20.245 9.917,-39.978 41.719,-39.978l32.281,0l0,-63c0,0 -29.297,-5 -57.305,-5c-58.476,0 -96.695,35.44 -96.695,99.6l0,56.4l-65,0l0,74l65,0l0,178.89c13.033,2.045 26.392,3.11 40,3.11c13.608,0 26.966,-1.065 40,-3.11l0,-178.89l59.65,0Z" style=${a({ fill: "#fff", fillRule: "nonzero" })} /></g>`}</svg>`;
+  }
+  _renderXIcon() {
+    const s = !!this.el.closest(f);
+    return e`<svg class=${k(s ? "solutions-social-share__x-logo--dark" : "solutions-social-share__x-logo--light")} viewBox="0 0 1200 1227" fill=none xmlns=http://www.w3.org/2000/svg>${u`<rect height=400 style=${a({ fill: "none" })} width=400 x=56 y=56 /><path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" fill=${s ? "white" : "black"} />`}</svg>`;
+  }
+  _renderBlueSkyIcon() {
+    return e`<svg fill=#0f85fe xmlns=http://www.w3.org/2000/svg viewBox="0 0 512 512">${u`<path d="M111.8 62.2C170.2 105.9 233 194.7 256 242.4c23-47.6 85.8-136.4 144.2-180.2c42.1-31.6 110.3-56 110.3 21.8c0 15.5-8.9 130.5-14.1 149.2C478.2 298 412 314.6 353.1 304.5c102.9 17.5 129.1 75.5 72.5 133.5c-107.4 110.2-154.3-27.6-166.3-62.9l0 0c-1.7-4.9-2.6-7.8-3.3-7.8s-1.6 3-3.3 7.8l0 0c-12 35.3-59 173.1-166.3 62.9c-56.5-58-30.4-116 72.5-133.5C100 314.6 33.8 298 15.7 233.1C10.4 214.4 1.5 99.4 1.5 83.9c0-77.8 68.2-53.4 110.3-21.8z" />`}</svg>`;
+  }
+  _renderLinkedInIcon() {
+    return e`<svg height=100% style=${a({ fillRule: "evenodd", clipRule: "evenodd", strokeLinejoin: "round", strokeMiterlimit: "2" })} version=1.1 viewBox="0 0 512 512" width=100% xmlns=http://www.w3.org/2000/svg>${u`<g id=g5891><path d="M512,64c0,-35.323 -28.677,-64 -64,-64l-384,0c-35.323,0 -64,28.677 -64,64l0,384c0,35.323 28.677,64 64,64l384,0c35.323,0 64,-28.677 64,-64l0,-384Z" id=background style=${a({ fill: "#2867b2" })} /><g id=shapes><rect height=257.962 id=rect11 style=${a({ fill: "#fff" })} width=85.76 x=61.053 y=178.667 /><path d="M104.512,54.28c-29.341,0 -48.512,19.29 -48.512,44.573c0,24.752 18.588,44.574 47.377,44.574l0.554,0c29.903,0 48.516,-19.822 48.516,-44.574c-0.555,-25.283 -18.611,-44.573 -47.935,-44.573Z" id=path13-0 style=${a({ fill: "#fff", fillRule: "nonzero" })} /><path d="M357.278,172.601c-45.49,0 -65.866,25.017 -77.276,42.589l0,-36.523l-85.738,0c1.137,24.197 0,257.961 0,257.961l85.737,0l0,-144.064c0,-7.711 0.554,-15.42 2.827,-20.931c6.188,-15.4 20.305,-31.352 43.993,-31.352c31.012,0 43.436,23.664 43.436,58.327l0,138.02l85.741,0l0,-147.93c0,-79.237 -42.305,-116.097 -98.72,-116.097Z" id=path15 style=${a({ fill: "#fff", fillRule: "nonzero" })} /></g></g>`}</svg>`;
+  }
+  _togglePopover(s) {
+    s.stopPropagation(), this._opened = !this._opened, this._popoverRef.value.open = this._opened;
+  }
+  _closePopover() {
+    this._opened = !1, this._popoverRef.value.open = this._opened;
+  }
+  async _handleShareItem(s) {
+    this.shareUrl = await this._generateShareUrl();
+    let o = null;
+    const l = navigator?.userAgent?.includes("Chrome") ?? !1, t = (navigator?.userAgent?.includes("Safari") ?? !1) && !l;
+    !t && this.shortenShareUrl && (o = await this._shortenUrl(this.shareUrl));
+    let h = o || this.shareUrl;
+    switch (s) {
+      case "link":
+        navigator.clipboard.writeText(h), this.mode === "inline" && (this._copyLinkPopoverRef.value.open = !0, setTimeout(() => this._copyLinkPopoverRef.value.open = !1, 3e3)), this._inlineCopyLinkOpened = !0, this._copied = !0, this.mode === "popover" && setTimeout(() => this._closePopover(), 2e3);
+        return;
+      case "facebook":
+      case "bluesky":
+      case "x":
+      case "linkedIn":
+        {
+          let n;
+          t && (n = window.open("", "_blank"), this.shortenShareUrl && (h = await this._shortenUrl(this.shareUrl) || h));
+          const d = {
+            url: encodeURI(h)
+          }, m = s === "x" ? { ...d, text: this.shareText } : d, _ = (await R()).substitute(S[s], m);
+          this.mode === "popover" && this._closePopover(), t && n ? (n.location = _, n.focus()) : window.open(encodeURI(_), "_blank");
+        }
+        return;
+    }
+  }
+  async _shortenUrl(s) {
+    const t = (await (await L())(I, {
+      query: {
+        longUrl: s,
+        f: "json"
+      }
+    }))?.data?.data?.url;
+    if (t)
+      return t.replace("http://", "https://");
+  }
+  _generateShareUrl() {
+    return this.autoUpdateShareUrl && (this.shareUrl = window.location.href), this.shareUrl;
+  }
+}
+w("solution-social-share", C);
+export {
+  C as SolutionSocialShare
+};

package/dist/components/solution-social-share/index.d.ts

@@ -0,0 +1,5 @@
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-button";
+import "@esri/calcite-components/components/calcite-action";
+import "@esri/calcite-components/components/calcite-icon";
+export * from "./customElement.js";

package/dist/components/solution-social-share/index.js

@@ -0,0 +1,5 @@
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-button";
+import "@esri/calcite-components/components/calcite-action";
+import "@esri/calcite-components/components/calcite-icon";
+export * from "./customElement.js";

package/dist/components/solution-spatial-ref/customElement.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { IFeatureServiceEnabledStatus } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';

package/dist/components/solution-spatial-ref/customElement.js

@@ -1,15 +1,14 @@
 import { c as f } from "../../chunks/runtime.js";
-import { _ as i } from "../../chunks/solution-store.js";
+import { _ as s } from "../../chunks/solution-store.js";
 import { n as d } from "../../chunks/common.js";
 import { C as l, v as h } from "../../chunks/interfaces.js";
 import { u as p } from "../../chunks/useT9n.js";
-import { html as n } from "lit";
-import { LitElement as u, createEvent as c, noShadowRoot as m } from "@arcgis/lumina";
-import { css as b } from "@lit/reactive-element/css-tag.js";
+import { css as u, html as n } from "lit";
+import { LitElement as m, createEvent as c, noShadowRoot as b } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.6 */
-const S = b`@layer{/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const S = u`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -24,7 +23,7 @@ const S = b`@layer{/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */.spatial-ref-switch{@apply m-inline-end-2;}.spatial-ref-component{@apply mt-2.5 m-inline-start-10;}#spatialRefDefn .sc-calcite-label-h label.sc-calcite-label{@apply m-0;}.spatial-ref-item-title{@apply mb-2 text-sm;}.spatial-ref-item-switch{@apply m-inline-end-2;}.switch-label{@apply text-sm;}.spatial-ref-services-list{margin-block-start:.5em;margin-block-end:.5em;list-style-type:none;padding-inline-start:2em}.spatial-ref-services-list-item{margin-top:.25rem}}`, o = "3857";
-class g extends u {
+class g extends m {
   constructor() {
     super(), this.enabled = !1, this.enableDefault = !1, this.featureServices = [], this._translations = p({ name: "solution-spatial-ref", blocking: !0 }), this.featureServiceSpatialReferenceChange = c(), this.enableDefaultSpatialReferenceChange = c(), this.enabledSpatialReferenceChange = c(), this.listenOn(window, "solutionStoreHasChanges", this.solutionStoreHasChanges);
   }
@@ -35,7 +34,7 @@ class g extends u {
     this.styles = S;
   }
   static {
-    this.shadowRootOptions = m;
+    this.shadowRootOptions = b;
   }
   willUpdate(e) {
     e.has("enabled") && (this.hasUpdated || this.enabled !== !1) && this.enabledChanged(), e.has("enableDefault") && (this.hasUpdated || this.enableDefault !== !1) && this.enableDefaultChanged();
@@ -53,9 +52,9 @@ class g extends u {
     return this._updateUIFromStore(), n`<label class="switch-label"><calcite-switch .checked=${this.enabled} class="spatial-ref-switch" @calciteSwitchChange=${(e) => this.enabled = e.target.checked} scale=m></calcite-switch>${this._translations.enableSpatialReference}</label><br><div class="spatial-ref-component" id=spatialRefDefn>${this._renderFeatureServicesList(this.featureServices)}</div><label class="switch-label spatial-ref-component"><calcite-switch .checked=${this.enableDefault} class="spatial-ref-switch" .disabled=${!this.enabled} @calciteSwitchChange=${(e) => this.enableDefault = e.target.checked} scale=m></calcite-switch>${this._translations.enableDefaultSpatialReference}</label>`;
   }
   solutionStoreHasChanges() {
-    this.featureServices = i.getStoreInfo("featureServices");
+    this.featureServices = s.getStoreInfo("featureServices");
   }
-  async _testAccess(e, t, a, s) {
+  async _testAccess(e, t, a, i) {
     switch (e) {
       case "_parameterizeWkid":
         return Promise.resolve(this._parameterizeWkid(t));
@@ -81,12 +80,12 @@ class g extends u {
     return e && (e.toString().startsWith(l) ? e : `${l}${e}${h}`);
   }
   _renderFeatureServicesList(e) {
-    const t = i.getStoreInfo("spatialReferenceInfo"), a = e.filter((s) => Object.keys(t.services).some((r) => r === s.id));
-    return a.length > 0 ? n`<div><label class="spatial-ref-item-title">${this._translations.featureServicesHeading}</label><ul class="spatial-ref-services-list">${a.map((s) => n`<li class="spatial-ref-services-list-item"><label class="switch-label"><calcite-switch .checked=${t.services[s.id]} class="spatial-ref-item-switch" .disabled=${!this.enabled} @calciteSwitchChange=${(r) => this._updateEnabledServices(r, s)} scale=m></calcite-switch>${s.name}</label></li>`)}</ul></div>` : null;
+    const t = s.getStoreInfo("spatialReferenceInfo"), a = e.filter((i) => Object.keys(t.services).some((r) => r === i.id));
+    return a.length > 0 ? n`<div><label class="spatial-ref-item-title">${this._translations.featureServicesHeading}</label><ul class="spatial-ref-services-list">${a.map((i) => n`<li class="spatial-ref-services-list-item"><label class="switch-label"><calcite-switch .checked=${t.services[i.id]} class="spatial-ref-item-switch" .disabled=${!this.enabled} @calciteSwitchChange=${(r) => this._updateEnabledServices(r, i)} scale=m></calcite-switch>${i.name}</label></li>`)}</ul></div>` : null;
   }
   _updateEnabledServices(e, t) {
-    const a = i.getStoreInfo("spatialReferenceInfo"), s = e.detail?.switched !== void 0 ? e.detail.switched : e.target?.checked !== void 0 ? e.target.checked : !0;
-    a.services[t.id] = s, i.setStoreInfo("spatialReferenceInfo", a), this._updateStore(), this.featureServiceSpatialReferenceChange.emit(t);
+    const a = s.getStoreInfo("spatialReferenceInfo"), i = e.detail?.switched !== void 0 ? e.detail.switched : e.target?.checked !== void 0 ? e.target.checked : !0;
+    a.services[t.id] = i, s.setStoreInfo("spatialReferenceInfo", a), this._updateStore(), this.featureServiceSpatialReferenceChange.emit(t);
   }
   _unparameterizeWkid(e) {
     return e && e.toString().startsWith(l) ? e.substring(l.length, e.length - h.length) : e;
@@ -96,15 +95,15 @@ class g extends u {
       e.services[t] = !1;
     }), this.featureServices.forEach((t) => {
       t.enabled = e.services[t.id], t.wkid = t.enabled ? this._parameterizeWkid(t.wkid) : this._unparameterizeWkid(t.wkid);
-    }), i.setStoreInfo("featureServices", this.featureServices);
+    }), s.setStoreInfo("featureServices", this.featureServices);
   }
   _updateStore() {
-    const e = i.getStoreInfo("spatialReferenceInfo");
-    e.enabled = this.enabled, this.enabled && this.enableDefault ? e.default = o : e.hasOwnProperty("default") && delete e.default, i.setStoreInfo("spatialReferenceInfo", e), this._updateFeatureServices(e);
+    const e = s.getStoreInfo("spatialReferenceInfo");
+    e.enabled = this.enabled, this.enabled && this.enableDefault ? e.default = o : e.hasOwnProperty("default") && delete e.default, s.setStoreInfo("spatialReferenceInfo", e), this._updateFeatureServices(e);
   }
   _updateUIFromStore() {
-    const e = i.getStoreInfo("spatialReferenceInfo");
-    this.enabled = e.enabled, this.enableDefault = !!e.default, this.featureServices = i.getStoreInfo("featureServices");
+    const e = s.getStoreInfo("spatialReferenceInfo");
+    this.enabled = e.enabled, this.enableDefault = !!e.default, this.featureServices = s.getStoreInfo("featureServices");
   }
 }
 f("solution-spatial-ref", g);

package/dist/components/solution-template-data/customElement.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 

package/dist/components/solution-template-data/customElement.js

@@ -1,13 +1,12 @@
 import { c as r } from "../../chunks/runtime.js";
 import { _ as i } from "../../chunks/solution-store.js";
 import { u as c } from "../../chunks/useT9n.js";
-import { nothing as h, html as d } from "lit";
-import { LitElement as p, noShadowRoot as u, safeClassMap as s } from "@arcgis/lumina";
-import { css as m } from "@lit/reactive-element/css-tag.js";
+import { css as h, nothing as d, html as p } from "lit";
+import { LitElement as u, noShadowRoot as m, safeClassMap as s } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.6 */
-const v = m`@layer{/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const v = h`@layer{/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -22,7 +21,7 @@ const v = m`@layer{/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */:host{@apply flexbox;}.solution-data-container{position:absolute;height:-moz-available;height:calc(100% - 48px);height:-webkit-fill-available;height:stretch;width:-moz-available;width:100%;width:-webkit-fill-available;width:stretch}.solution-data-child-container{@apply h-full w-full flex flex-col overflow-y-auto;}.solution-data-editor-container{@apply h-full;}.solution-data-child-container-collapsed{@apply h-full flex flex-col overflow-auto;width:50px}.inputBottomSeparation{@apply mt-0 mx-0 mb-6;}.json-editor{@apply m-4 w-auto fill-available;}.collapse-btn,.org-vars{@apply pt-4 pb-0 px-4;}.sol-vars{@apply py-0 px-4;min-height:45%}.padding-1{@apply p-4;}}`;
-class g extends p {
+class g extends u {
   constructor() {
     super(), this.instanceid = "", this.itemId = "", this.organizationVariables = "", this.solutionVariables = "", this.varsOpen = !0, this._translations = c({ name: "solution-template-data", blocking: !0 }), this.value = "", this._initializing = !1, this.listenOn(window, "solutionEditorContentChanged", (a) => {
       if (this.itemId) {
@@ -44,7 +43,7 @@ class g extends p {
     this.styles = v;
   }
   static {
-    this.shadowRootOptions = u;
+    this.shadowRootOptions = m;
   }
   willUpdate(a) {
     a.has("itemId") && (this.hasUpdated || this.itemId !== "") && this.itemIdWatchHandler();
@@ -53,7 +52,7 @@ class g extends p {
     this._initializing = !0, this.itemId && (this.value = JSON.stringify(this.instanceid === "data" ? i.getItemInfo(this.itemId)?.data : i.getItemInfo(this.itemId)?.properties, null, 2));
   }
   render() {
-    return d`<div class="solution-data-container"><calcite-shell class="light var-container" dir=ltr><calcite-panel class="json-editor"><div class="solution-data-child-container calcite-match-height"><json-editor class="solution-data-editor-container" .instanceid=${`${this.itemId}|${this.instanceid}`} .value=${this.value}></json-editor></div></calcite-panel><calcite-shell-panel height=l position=end slot=contextual-panel width=s><div class=${s(this.varsOpen ? "solution-data-child-container" : "solution-data-child-container-collapsed")}><calcite-button appearance=transparent class="collapse-btn" .iconStart=${this.varsOpen ? "chevrons-right" : "chevrons-left"} id=collapse-vars @click=${() => this._toggleVars()} scale=s title=${(this.varsOpen ? this._translations.collapse : this._translations.expand) ?? h}></calcite-button><div class=${s(this.varsOpen ? "org-vars" : "org-vars display-none")} id=orgVars><solution-organization-variables .value=${this.organizationVariables}></solution-organization-variables></div><div class=${s(this.varsOpen ? "sol-vars" : "sol-vars display-none")} id=solVars><solution-variables .value=${this.solutionVariables}></solution-variables></div></div></calcite-shell-panel></calcite-shell></div>`;
+    return p`<div class="solution-data-container"><calcite-shell class="light var-container" dir=ltr><calcite-panel class="json-editor"><div class="solution-data-child-container calcite-match-height"><json-editor class="solution-data-editor-container" .instanceid=${`${this.itemId}|${this.instanceid}`} .value=${this.value}></json-editor></div></calcite-panel><calcite-shell-panel height=l position=end slot=contextual-panel width=s><div class=${s(this.varsOpen ? "solution-data-child-container" : "solution-data-child-container-collapsed")}><calcite-button appearance=transparent class="collapse-btn" .iconStart=${this.varsOpen ? "chevrons-right" : "chevrons-left"} id=collapse-vars @click=${() => this._toggleVars()} scale=s title=${(this.varsOpen ? this._translations.collapse : this._translations.expand) ?? d}></calcite-button><div class=${s(this.varsOpen ? "org-vars" : "org-vars display-none")} id=orgVars><solution-organization-variables .value=${this.organizationVariables}></solution-organization-variables></div><div class=${s(this.varsOpen ? "sol-vars" : "sol-vars display-none")} id=solVars><solution-variables .value=${this.solutionVariables}></solution-variables></div></div></calcite-shell-panel></calcite-shell></div>`;
   }
   _toggleVars() {
     this.varsOpen = !this.varsOpen;

package/dist/components/solution-variables/customElement.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { IVariableItem } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';

package/dist/components/solution-variables/customElement.js

@@ -1,12 +1,11 @@
 import { c as a } from "../../chunks/runtime.js";
 import { u as r } from "../../chunks/useT9n.js";
-import { html as s, nothing as n } from "lit";
-import { LitElement as l, createEvent as c } from "@arcgis/lumina";
-import { css as o } from "@lit/reactive-element/css-tag.js";
+import { css as n, html as s, nothing as l } from "lit";
+import { LitElement as c, createEvent as o } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.6 */
-const h = o`/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const h = n`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -21,9 +20,9 @@ const h = o`/** @license
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */:host{@apply block;}.container-border{@apply overflow-y-hidden;}.org-var-header{@apply my-4 mx-0;}.icon-text{@apply truncate;}`;
-class d extends l {
+class d extends c {
   constructor() {
-    super(...arguments), this.value = "", this._solutionVariables = [], this._translations = r({ name: "solution-variables", blocking: !0 }), this.solutionVariableSelected = c();
+    super(...arguments), this.value = "", this._solutionVariables = [], this._translations = r({ name: "solution-variables", blocking: !0 }), this.solutionVariableSelected = o();
   }
   static {
     this.properties = { value: 3, _solutionVariables: 16, _translations: 16 };
@@ -41,7 +40,7 @@ class d extends l {
     return s`<div><h4 class="org-var-header">${this._translations.solVariables}</h4></div><div class="container-border"><calcite-tree id=variable-label>${this._renderHierarchy(this._solutionVariables)}</calcite-tree></div>`;
   }
   _renderHierarchy(t) {
-    return t.map((e) => e.dependencies && e.dependencies.length > 0 ? s`<calcite-tree-item @click=${this._toggleExpand}><solution-item-icon .type=${e.type}></solution-item-icon><span class="icon-text" title=${e.title ?? n}>${e.title}</span><calcite-tree slot=children>${this._renderHierarchy(e.dependencies)}</calcite-tree></calcite-tree-item>` : s`<calcite-tree-item @click=${() => this._treeItemSelected(e.id, e.value)}>${e.title}</calcite-tree-item>`);
+    return t.map((e) => e.dependencies && e.dependencies.length > 0 ? s`<calcite-tree-item @click=${this._toggleExpand}><solution-item-icon .type=${e.type}></solution-item-icon><span class="icon-text" title=${e.title ?? l}>${e.title}</span><calcite-tree slot=children>${this._renderHierarchy(e.dependencies)}</calcite-tree></calcite-tree-item>` : s`<calcite-tree-item @click=${() => this._treeItemSelected(e.id, e.value)}>${e.title}</calcite-tree-item>`);
   }
   _treeItemSelected(t, i) {
     this.solutionVariableSelected.emit({

package/dist/components/solutions-all-panel/customElement.d.ts

@@ -1,12 +1,8 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { IFilterOption, ISearchOption, ISolutionInfoCard, ISortOption, SortType } from '../../utils/interfaces';
 
 export declare class SolutionsAllPanel extends LitElement {
-    /** The authentication from global nav */
-    readonly authContextConsumer: import('@lit/context').ContextConsumer<{
-        __context__: import('../../utils/Auth').Auth;
-    }, HTMLElement & import('lit').ReactiveControllerHost>;
     /**
      * The group id that contains agol solutions.
      *
@@ -43,10 +39,6 @@ export declare class SolutionsAllPanel extends LitElement {
      * @default 'numviews'
      */
     sortType: SortType;
-    /** The user session to use for fetching solutions */
-    readonly userSessionContextConsumer: import('@lit/context').ContextConsumer<{
-        __context__: import('@esri/arcgis-rest-request').ArcGISIdentityManager;
-    }, HTMLElement & import('lit').ReactiveControllerHost>;
     /**
      * Search solutions based on key criteria
      *

package/dist/components/solutions-all-panel/customElement.js

@@ -1,15 +1,15 @@
 import { c as d } from "../../chunks/runtime.js";
-import { html as a, svg as u } from "lit-html";
-import { u as g } from "../../chunks/useT9n.js";
-import { LitElement as m, useContextConsumer as n, createEvent as l } from "@arcgis/lumina";
-import { css as _ } from "@lit/reactive-element/css-tag.js";
+import { css as u, html as a, svg as g } from "lit";
+import { u as _ } from "../../chunks/useT9n.js";
+import { LitElement as m, createEvent as n } from "@arcgis/lumina";
+import { useContextConsumer as l } from "@arcgis/lumina/context";
 import { t as c, u as p, r as S, s as f, B as C } from "../../chunks/interfaces.js";
 import { C as h, g as y } from "../../chunks/cardFetchingUtils.js";
-import { a as w, u as x } from "../../chunks/deployAppContexts.js";
+import { a as w, u as v } from "../../chunks/deployAppContexts.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/1.0/esri/copyright.txt for details.
-v1.0.6 */
-const v = _`/** @license
+See https://js.arcgis.com/1.1/esri/copyright.txt for details.
+v1.1.0-next.20250731 */
+const x = u`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -26,19 +26,19 @@ const v = _`/** @license
  */calcite-panel{width:100%;height:100%}.card-group{overflow:hidden;padding:.5rem}.solutions-briefcase{margin:auto;padding-top:2rem}.text-center{text-align:center}.leader-1{margin-top:1.5rem}.trailer-1{margin-bottom:1.5rem}.warning-text{max-width:35em;margin-left:auto;margin-right:auto}.no-solutions{display:flex;flex-direction:column;justify-content:center;width:100%;height:100%}`;
 class T extends m {
   constructor() {
-    super(...arguments), this.authContextConsumer = n({
+    super(...arguments), this.agoSolutionsGroupId = "", this.enterpriseSolutionsGroupId = "", this.locale = "", this.orgUrl = "", this.portalUrl = "", this.sortType = "numviews", this.cards = [], this._translations = _({ name: "solutions-all-panel", blocking: !0 }), this._agoTerms = `${c} OR ${p}`, this._allCards = [], this._authContextConsumer = l({
       context: w,
       subscribe: !0
-    }), this.agoSolutionsGroupId = "", this.enterpriseSolutionsGroupId = "", this.locale = "", this.orgUrl = "", this.portalUrl = "", this.sortType = "numviews", this.userSessionContextConsumer = n({
-      context: x,
+    }), this._baseAgoTerms = c, this._categories = [], this._delay = !1, this._getSuggested = !1, this._relatedSolutions = /* @__PURE__ */ new Set(), this._sortField = "numviews", this._sortOrder = "desc", this._userSessionContextConsumer = l({
+      context: v,
       subscribe: !0
-    }), this.cards = [], this._translations = g({ name: "solutions-all-panel", blocking: !0 }), this._agoTerms = `${c} OR ${p}`, this._allCards = [], this._baseAgoTerms = c, this._categories = [], this._delay = !1, this._getSuggested = !1, this._relatedSolutions = /* @__PURE__ */ new Set(), this._sortField = "numviews", this._sortOrder = "desc", this.cardsFetched = l(), this.allCardsFetched = l();
+    }), this.cardsFetched = n(), this.allCardsFetched = n();
   }
   static {
-    this.properties = { authContextConsumer: 32, agoSolutionsGroupId: 1, enterpriseSolutionsGroupId: 1, locale: 1, orgUrl: 1, portalUrl: 1, sortType: 1, userSessionContextConsumer: 32, cards: 16, _translations: 16 };
+    this.properties = { agoSolutionsGroupId: 1, enterpriseSolutionsGroupId: 1, locale: 1, orgUrl: 1, portalUrl: 1, sortType: 1, cards: 16, _translations: 16 };
   }
   static {
-    this.styles = v;
+    this.styles = x;
   }
   async searchSolutions(e) {
     e ? "searchTerm" in e ? this._textSearch(e.searchTerm) : "sortType" in e ? this._sortCards(e) : this._filterCards(e) : (this._agoTerms = this._baseAgoTerms, this._clearFilterCategories()), this.cards = await this._getSolutions();
@@ -47,7 +47,7 @@ class T extends m {
     this._cardsFetcher = new h(this.locale, this.orgUrl, this.portalUrl), this._cardsFetcherDeployed = new h(this.locale, this.orgUrl, this.portalUrl), this.cards = await this._getSolutions(), this.allCardsFetched.emit(this.cards), await this._getDeployedSolutions();
   }
   render() {
-    return a`<calcite-panel><calcite-card-group class="card-group" label>${this._renderCards()}</calcite-card-group></calcite-panel>`;
+    return a`<calcite-panel><calcite-card-group class="card-group" .label=${this._translations.allSolutionCards}>${this._renderCards()}</calcite-card-group></calcite-panel>`;
   }
   _renderCards() {
     return this.cards.length ? this.cards.map((e) => a`<solution-details-card .card=${e}></solution-details-card>`) : a`<div class="no-solutions">${this._getSolutionsBriefcase()}<div class="text-center leader-1 warning-text trailer-1">${this._translations.noSolutionsFound}</div></div>`;
@@ -68,7 +68,7 @@ class T extends m {
       this.agoSolutionsGroupId,
       "",
       //this.enterpriseSolutionsGroupId, TODO both are passed by default in the old app...don't follow why
-      this.userSessionContextConsumer.value,
+      this._userSessionContextConsumer.value,
       {
         num: 1e3
       }
@@ -81,14 +81,14 @@ class T extends m {
     return this._allCards.length === 0 && e?.cards && (this._allCards = e?.cards), this.cardsFetched.emit(o.length), o;
   }
   async _getDeployedSolutions() {
-    const e = this.authContextConsumer.value, t = this.userSessionContextConsumer.value;
+    const e = this._authContextConsumer.value, t = this._userSessionContextConsumer.value;
     if (e && t) {
       const i = await y(e, t, this._cardsFetcher, this._cardsFetcherDeployed, C, "created");
       i && (this._relatedSolutions = i.relatedSolutions, console.log(this._relatedSolutions));
     }
   }
   _getSolutionsBriefcase() {
-    return a`<div class="solutions-briefcase"><svg viewBox="0 0 32 32" width=200 height=200 xmlns=http://www.w3.org/2000/svg>${u`<path d="M29.963 7.672a1.586 1.586 0 0 0-1.584-1.585h-5.274a.187.187 0 0 1-.188-.187V3.977A2 2 0 0 0 20.825 2h-9.672A2.095 2.095 0 0 0 9.06 4.093V5.9a.187.187 0 0 1-.187.187H3.598a1.586 1.586 0 0 0-1.584 1.585v4.016a.281.281 0 0 0 .281.28H4.9l.014-.013V9.153a.177.177 0 0 1 .177-.177h21.46a.456.456 0 0 1 .449.45v13.742A1.832 1.832 0 0 1 25.168 25h-8.892a.568.568 0 0 1-.534-.373 3.98 3.98 0 0 0-7.6.373H5.657a.757.757 0 0 1-.757-.757v-3.055A.188.188 0 0 0 4.714 21H2.028l-.014.014v4.58a2.35 2.35 0 0 0 2.347 2.346h4.161a3.963 3.963 0 0 0 6.8.256.569.569 0 0 1 .475-.256h12.065a2.102 2.102 0 0 0 2.101-2.101zM21 5.625a.375.375 0 0 1-.375.375h-9.25A.375.375 0 0 1 11 5.625V4.45a.456.456 0 0 1 .45-.45h9.1a.456.456 0 0 1 .45.45zM12 28a2 2 0 1 1 2-2 2 2 0 0 1-2 2z" fill=#ccc /><path d="M13.273 17.994a.57.57 0 0 1 .479.262A3.73 3.73 0 0 0 17 20a3.74 3.74 0 0 0 3.403-2.006h3.41a.188.188 0 0 0 .187-.188v-2.589a.187.187 0 0 0-.188-.188H20.8A3.8 3.8 0 0 0 17 12a4.058 4.058 0 0 0-3.69 2.647.568.568 0 0 1-.537.383H1.093a.094.094 0 0 0-.093.093V17.9a.094.094 0 0 0 .094.094zM17 13.9a2.1 2.1 0 1 1-2.1 2.1 2.1 2.1 0 0 1 2.1-2.1z" fill=#ccc />`}</svg></div>`;
+    return a`<div class="solutions-briefcase"><svg viewBox="0 0 32 32" width=200 height=200 xmlns=http://www.w3.org/2000/svg>${g`<path d="M29.963 7.672a1.586 1.586 0 0 0-1.584-1.585h-5.274a.187.187 0 0 1-.188-.187V3.977A2 2 0 0 0 20.825 2h-9.672A2.095 2.095 0 0 0 9.06 4.093V5.9a.187.187 0 0 1-.187.187H3.598a1.586 1.586 0 0 0-1.584 1.585v4.016a.281.281 0 0 0 .281.28H4.9l.014-.013V9.153a.177.177 0 0 1 .177-.177h21.46a.456.456 0 0 1 .449.45v13.742A1.832 1.832 0 0 1 25.168 25h-8.892a.568.568 0 0 1-.534-.373 3.98 3.98 0 0 0-7.6.373H5.657a.757.757 0 0 1-.757-.757v-3.055A.188.188 0 0 0 4.714 21H2.028l-.014.014v4.58a2.35 2.35 0 0 0 2.347 2.346h4.161a3.963 3.963 0 0 0 6.8.256.569.569 0 0 1 .475-.256h12.065a2.102 2.102 0 0 0 2.101-2.101zM21 5.625a.375.375 0 0 1-.375.375h-9.25A.375.375 0 0 1 11 5.625V4.45a.456.456 0 0 1 .45-.45h9.1a.456.456 0 0 1 .45.45zM12 28a2 2 0 1 1 2-2 2 2 0 0 1-2 2z" fill=#ccc /><path d="M13.273 17.994a.57.57 0 0 1 .479.262A3.73 3.73 0 0 0 17 20a3.74 3.74 0 0 0 3.403-2.006h3.41a.188.188 0 0 0 .187-.188v-2.589a.187.187 0 0 0-.188-.188H20.8A3.8 3.8 0 0 0 17 12a4.058 4.058 0 0 0-3.69 2.647.568.568 0 0 1-.537.383H1.093a.094.094 0 0 0-.093.093V17.9a.094.094 0 0 0 .094.094zM17 13.9a2.1 2.1 0 1 1-2.1 2.1 2.1 2.1 0 0 1 2.1-2.1z" fill=#ccc />`}</svg></div>`;
   }
   _textSearch(e) {
     this._agoTerms = this._baseAgoTerms + ` ${e}`;

package/dist/components/solutions-all-shell/customElement.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 import { IFilterOption, SortType } from '../../utils/interfaces';
 import { PropertyValues } from 'lit';
@@ -18,6 +18,8 @@ export declare class SolutionsAllShell extends LitElement {
     sortType: SortType;
     /** Emitted on demand when a filter chip is closed */
     readonly filterRemoved: TargetedEvent<this, IFilterOption>;
+    /** Emitted on demand this component has loaded */
+    readonly solutionsAllLoaded: TargetedEvent<this, void>;
     /** Emitted on demand when the auth token is updated */
     readonly tokenRefreshed: TargetedEvent<this, string>;
 }