/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import { c as g } from "../../chunks/runtime.js";
import { css as m, html as f } from "lit";
import { u as b } from "../../chunks/useT9n.js";
import { LitElement as v, createEvent as S } from "@arcgis/lumina";
import { createRef as c, ref as d } from "lit/directives/ref.js";
import "../solutions-resources-section/customElement.js";
const w = { heading: "Get Started", card1: { heading: "What's new in the app" }, card2: { heading: "Deploy a solution" }, card3: { heading: "Manage a deployment" }, card4: { heading: "AI Assistant" } }, R = { heading: "Documentation", card1: { heading: "Help" }, card2: { heading: "What's new" }, card3: { heading: "FAQ" }, card4: { heading: "ArcGIS Blog" } }, _ = { heading: "Support", card1: { heading: "Esri Community" }, card2: { heading: "ArcGIS Ideas" }, card3: { heading: "Esri Video" }, card4: { heading: "Technical support" } }, t = {
  getStarted: w,
  documentation: R,
  support: _
}, E = m`*[tabindex]:focus-visible{outline:2px solid var(--calcite-color-brand);outline-offset:2px}:host{display:block;position:relative;height:100%}.position-relative{position:relative}.border-override{border-top-width:var(--calcite-border-width-none);border-bottom-width:var(--calcite-border-width-none)}.header-override{--calcite-panel-header-content-space: 0px;--calcite-panel-header-background-color: var(--calcite-color-surface-3)}.panel-override{--calcite-panel-background-color: var(--calcite-color-surface-3);--calcite-panel-border-color: none}.z-index-1{z-index:1}calcite-shell{background-color:unset;height:auto}.section-spacing{margin-top:var(--calcite-spacing-lg)}`;
class y extends v {
  constructor() {
    super(), this._translations = b({ name: "solutions-resources-shell", blocking: !0 }), this._mainPanelRef = c(), this._getStartedSectionRef = c(), this._documentationSectionRef = c(), this._supportSectionRef = c(), this._panelFixed = !1, this.sortTypeChanged = S(), this.listenOn(window, "deployAppTabSelected", this._handleDeployAppTabSelected);
  }
  static {
    this.properties = { _translations: 16 };
  }
  static {
    this.styles = E;
  }
  updated() {
    this._fixPanelContentWrapperFocus();
  }
  _fixPanelContentWrapperFocus() {
    if (!this._panelFixed && this._mainPanelRef.value) {
      const e = this._mainPanelRef.value;
      e.componentOnReady?.().then(() => {
        if (e.shadowRoot) {
          const o = e.shadowRoot.querySelector(".content-wrapper");
          o && (o.tabIndex = -1, this._panelFixed = !0, this._setupPanelObserver());
        }
      }).catch(() => {
        this._panelFixed = !0;
      });
    }
  }
  _setupPanelObserver() {
    if (this._panelObserver)
      return;
    this._panelObserver = new MutationObserver((o) => {
      o.forEach((i) => {
        if (i.type === "attributes" && i.attributeName === "tabindex") {
          const a = i.target;
          a.classList.contains("content-wrapper") && a.tabIndex === 0 && (a.tabIndex = -1);
        }
      });
    });
    const e = this._mainPanelRef.value;
    if (e?.shadowRoot) {
      const o = e.shadowRoot.querySelector(".content-wrapper");
      o && this._panelObserver.observe(o, { attributes: !0, attributeFilter: ["tabindex"] });
    }
  }
  disconnectedCallback() {
    super.disconnectedCallback(), this._panelObserver?.disconnect();
  }
  render() {
    const e = this._translations;
    return f`<calcite-shell class="position-relative"><calcite-panel class="border-override header-override panel-override z-index-1" ${d(this._mainPanelRef)}><div class="section-spacing" ${d(this._getStartedSectionRef)}><solutions-resources-section .heading=${e.getStarted.heading} .subheading=${e.getStarted.subheading} .cards=${[
      {
        meridianIcon: "value",
        heading: e.getStarted.card1.heading,
        description: e.getStarted.card1.description,
        url: "https://links.esri.com/solutions/whats-new-in-the-app",
        headingEn: t.getStarted.card1.heading,
        sectionHeadingEn: t.getStarted.heading
      },
      {
        meridianIcon: "install",
        heading: e.getStarted.card2.heading,
        description: e.getStarted.card2.description,
        url: "https://links.esri.com/solutions/deploy-a-solution",
        headingEn: t.getStarted.card2.heading,
        sectionHeadingEn: t.getStarted.heading
      },
      {
        meridianIcon: "keys",
        heading: e.getStarted.card3.heading,
        description: e.getStarted.card3.description,
        url: "https://links.esri.com/solutions/manage-a-deployment",
        headingEn: t.getStarted.card3.heading,
        sectionHeadingEn: t.getStarted.heading
      },
      {
        meridianIcon: "speech-bubbles",
        heading: e.getStarted.card4.heading,
        description: e.getStarted.card4.description,
        url: "https://links.esri.com/solutions/ai-assistant",
        headingEn: t.getStarted.card4.heading,
        sectionHeadingEn: t.getStarted.heading
      }
    ]}></solutions-resources-section></div><div ${d(this._documentationSectionRef)}><solutions-resources-section .heading=${e.documentation.heading} .subheading=${e.documentation.subheading} .cards=${[
      {
        meridianIcon: "search-files",
        heading: e.documentation.card1.heading,
        description: e.documentation.card1.description,
        url: "https://links.esri.com/solutions/help",
        headingEn: t.documentation.card1.heading,
        sectionHeadingEn: t.documentation.heading
      },
      {
        meridianIcon: "value",
        heading: e.documentation.card2.heading,
        description: e.documentation.card2.description,
        url: "https://links.esri.com/solutions/whats-new",
        headingEn: t.documentation.card2.heading,
        sectionHeadingEn: t.documentation.heading
      },
      {
        meridianIcon: "faq",
        heading: e.documentation.card3.heading,
        description: e.documentation.card3.description,
        url: "https://links.esri.com/solutions/faq",
        headingEn: t.documentation.card3.heading,
        sectionHeadingEn: t.documentation.heading
      },
      {
        meridianIcon: "arcmap-blog",
        heading: e.documentation.card4.heading,
        description: e.documentation.card4.description,
        url: "https://links.esri.com/solutions/arcgis-blogs",
        headingEn: t.documentation.card4.heading,
        sectionHeadingEn: t.documentation.heading
      }
    ]}></solutions-resources-section></div><div ${d(this._supportSectionRef)}><solutions-resources-section .heading=${e.support.heading} .subheading=${e.support.subheading} .cards=${[
      {
        meridianIcon: "esri-community",
        heading: e.support.card1.heading,
        description: e.support.card1.description,
        url: "https://links.esri.com/solutions/esri-community",
        headingEn: t.support.card1.heading,
        sectionHeadingEn: t.support.heading
      },
      {
        meridianIcon: "idea",
        heading: e.support.card2.heading,
        description: e.support.card2.description,
        url: "https://links.esri.com/solutions/arcgis-ideas",
        headingEn: t.support.card2.heading,
        sectionHeadingEn: t.support.heading
      },
      {
        meridianIcon: "video",
        heading: e.support.card3.heading,
        description: e.support.card3.description,
        url: "https://links.esri.com/solutions/esri-video",
        headingEn: t.support.card3.heading,
        sectionHeadingEn: t.support.heading
      },
      {
        meridianIcon: "support",
        heading: e.support.card4.heading,
        description: e.support.card4.description,
        url: "https://links.esri.com/solutions/technical-support",
        headingEn: t.support.card4.heading,
        sectionHeadingEn: t.support.heading
      }
    ]}></solutions-resources-section></div></calcite-panel></calcite-shell>`;
  }
  async scrollToSection(e) {
    const i = {
      getStarted: this._getStartedSectionRef,
      documentation: this._documentationSectionRef,
      support: this._supportSectionRef
    }[e];
    if (!i.value || !this._mainPanelRef.value)
      return;
    const a = this._mainPanelRef.value, l = () => {
      let n = this.el;
      for (; n && n !== document.body; ) {
        const s = window.getComputedStyle(n), r = s.overflowY, p = s.overflow;
        if (n.scrollHeight > n.clientHeight && (r === "auto" || r === "scroll" || p === "auto" || p === "scroll") && i.value) {
          const h = n.getBoundingClientRect(), u = i.value.getBoundingClientRect().top - h.top + n.scrollTop;
          n.scrollTo({
            top: u,
            behavior: "smooth"
          });
          return;
        }
        n = n.parentElement;
      }
      if (a.shadowRoot) {
        const s = a.shadowRoot.querySelector(".content-wrapper");
        if (s && i.value) {
          const r = i.value.offsetTop;
          if (s.scrollHeight > s.clientHeight) {
            s.scrollTo({
              top: r,
              behavior: "smooth"
            });
            return;
          }
        }
      }
      i.value && i.value.scrollIntoView({
        behavior: "smooth",
        block: "start"
      });
    };
    typeof a.componentOnReady == "function" ? (await a.componentOnReady(), l()) : (await new Promise((n) => setTimeout(n, 100)), l());
  }
  _handleDeployAppTabSelected(e) {
    e.detail === "resources" && this.sortTypeChanged.emit("");
  }
}
g("solutions-resources-shell", y);
export {
  y as SolutionsResourcesShell
};
