@arcgis/map-components/dist/components/arcgis-feature-content/customElement.js

ArcGIS Map Components

/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import { c as n } from "../../chunks/runtime.js";
import { css as c, html as r } from "lit";
import { ref as s } from "lit/directives/ref.js";
import { LitElement as l } from "@arcgis/lumina";
import { e as o, f as h } from "../../chunks/feature-utils.js";
import { watch as d } from "@arcgis/core/core/reactiveUtils.js";
import { renderingSanitizer as g } from "@arcgis/core/applications/Components/sanitizerUtils.js";
const f = c`.loader-container{display:flex;align-items:center;justify-content:center;padding:0;height:150px}.root{font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-normal)}.root h1,.root h2,.root h3,.root h4,.root h5,.root h6{margin:var(--calcite-spacing-sm) 0;line-height:var(--calcite-font-line-height-relative-tight);letter-spacing:0;color:var(--calcite-color-text-1);font-weight:var(--calcite-font-weight-semibold)}.root h1{font-size:var(--calcite-font-size-xxl)}.root h2{font-size:var(--calcite-font-size-xl)}.root h3{font-size:var(--calcite-font-size-lg)}.root h4,.root h5,.root h6{font-size:var(--calcite-font-size)}.description{margin-bottom:var(--calcite-spacing-xs)}.root p{margin:0 0 var(--calcite-spacing-xs);font-size:var(--calcite-font-size)}.root p:last-child{margin-block-end:0}.root img{max-width:100%;max-height:100%;image-orientation:from-image}.root video{max-width:100%;max-height:100%}.root figure{margin:0;padding:0}.root figcaption{display:block;margin:var(--calcite-spacing-xs) 0 0;padding:0;font-size:var(--calcite-font-size-sm);font-style:italic}.root ul,.root ol{margin-block:var(--calcite-spacing-sm)}.root ul:first-child,.root ol:first-child{margin-block-start:0}.root a,.root a:hover,.root a:focus{color:var(--calcite-color-text-link)}`;
class m extends l {
  static {
    this.properties = { _loadingPromise: 16, _created: 16, creator: 1, destroyer: 0, graphic: 0 };
  }
  static {
    this.styles = f;
  }
  loaded() {
    this.manager.onLifecycle(() => d(() => this.creator, (t) => {
      this._destroyContent(), this._createContent(t);
    }, { initial: !0 }));
  }
  async _createContent(t) {
    const { graphic: e } = this;
    if (!e || !t)
      return;
    const i = o({
      type: "content",
      value: t,
      event: { graphic: e }
    });
    this._loadingPromise = i;
    const a = await i;
    i === this._loadingPromise && (this._loadingPromise = void 0, this._created = a);
  }
  _destroyContent() {
    const { _created: t, graphic: e, destroyer: i } = this;
    t && e && (o({ type: "content", value: i, event: { graphic: e } }), this._created = null);
  }
  _addTargetToAnchors(t) {
    t && Array.from(t.querySelectorAll("a")).forEach((e) => {
      h(e.href) && !e.hasAttribute("target") && e.setAttribute("target", "_blank");
    });
  }
  render() {
    return r`<div class="root">${this._loadingPromise ? this._renderLoading() : this._renderCreated()}</div>`;
  }
  _renderLoading() {
    return r`<div class="loader-container"><calcite-loader inline label></calcite-loader></div>`;
  }
  _renderCreated() {
    const { _created: t } = this;
    return t instanceof HTMLElement ? t : typeof t == "string" ? r`<div .innerHTML=${g.sanitize(t) ?? ""} ${s(this._addTargetToAnchors)}></div>` : null;
  }
}
n("arcgis-feature-content", m);
export {
  m as ArcgisFeatureContent
};