import { c as I } from "../../chunks/runtime.js";
import { css as P, html as X } from "lit";
import { LitElement as j, safeStyleMap as z, safeClassMap as g } from "@arcgis/lumina";
import { s as Y, g as k, p as C } from "../../chunks/utils2.js";
/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.34/esri/copyright.txt for details.
v4.34.7 */
const A = P`.arcgis-legend--card__size-ramp--container{display:flex;align-items:center;justify-content:center}.arcgis-legend--card__size-ramp--vertical-container{display:flex;flex-direction:column;align-items:center;justify-content:center}.arcgis-legend--card__size-ramp--label{margin:0 .5em;white-space:nowrap}.arcgis-legend--card__size-ramp--vertical-ramp{display:flex;flex-direction:column;align-items:center}.arcgis-legend--card__size-ramp--ramp{display:flex;flex-direction:row-reverse;align-items:center}.arcgis-legend--card__size-ramp--preview{display:flex}`, d = {
  container: "arcgis-legend--card__size-ramp--container",
  verticalContainer: "arcgis-legend--card__size-ramp--vertical-container",
  label: "arcgis-legend--card__size-ramp--label",
  ramp: "arcgis-legend--card__size-ramp--ramp",
  verticalRamp: "arcgis-legend--card__size-ramp--vertical-ramp",
  preview: "arcgis-legend--card__size-ramp--preview"
}, M = "#ddd";
function N(e) {
  if (!e)
    return;
  if (e.type.includes("3d")) {
    if (!("symbolLayers" in e) || !e.symbolLayers?.length)
      return;
    const t = e.symbolLayers.at(-1), i = t && "resource" in t ? t.resource?.primitive : void 0;
    return i === "circle" || i === "cross" || i === "kite" || i === "sphere" || i === "cube" || i === "diamond";
  }
  const r = "style" in e ? e.style : void 0;
  return r === "circle" || r === "diamond" || r === "cross";
}
function O(e) {
  if (e) {
    if (e.type.includes("3d")) {
      if (!("symbolLayers" in e) || !e.symbolLayers?.length)
        return;
      const r = e.symbolLayers.at(-1), t = r && "resource" in r ? r.resource?.primitive : void 0;
      return t === "triangle" || t === "cone" || t === "tetrahedron";
    }
    return "style" in e && e.style === "triangle";
  }
}
class B extends j {
  constructor() {
    super(...arguments), this.hasIndicators = !1, this.legendElement = null, this.opacity = 1;
  }
  static {
    this.properties = { hasIndicators: 5, legendElement: 0, opacity: 9, messages: 0 };
  }
  static {
    this.styles = A;
  }
  render() {
    if (this.legendElement.theme === "spike")
      return X`<div style=${z({ display: "flex", flex: "1", justifyContent: "center" })}><arcgis-legend-spike-ramp .legendElement=${this.legendElement} .messages=${this.messages}></arcgis-legend-spike-ramp></div>`;
    const { legendElement: r, hasIndicators: t, opacity: i } = this, l = r.infos, v = l.at(0), p = l.at(-1);
    if (!v || !p)
      return null;
    const { label: f, ...S } = v, { label: u, ..._ } = p;
    let n = S.preview, s = _.preview;
    if (!n || !s)
      return null;
    n = n.cloneNode(!0), n.style.display = "flex", Y(n, k(this.messages, f)), s = s.cloneNode(!0), s.style.display = "flex", Y(s, k(this.messages, u));
    const o = { opacity: `${i ?? ""}` };
    return X`<div class=${g(t ? d.verticalContainer : d.container)}><div class=${g(d.label)}>${t ? f : u}</div><div class=${g(t ? d.verticalRamp : d.ramp)}><div class=${g(d.preview)} style=${z(o)}>${n}</div>${this._renderSizeRampLines(r)}<div class=${g(d.preview)} style=${z(o)}>${s}</div></div><div class=${g(d.label)}>${t ? u : f}</div></div>`;
  }
  _renderSizeRampLines(r) {
    const t = r.infos, i = t.at(0), l = t.at(-1);
    if (!i || !l)
      return null;
    const v = i.symbol, p = this.hasIndicators, f = i.size && typeof i.size == "number" ? i.size : 0, S = l.size && typeof l.size == "number" ? l.size : 0, u = i.outlineSize || 0, _ = l.outlineSize || 0, n = C(f + u), s = C(S + _), o = p ? n : n + 50, m = p ? n / 2 + 50 : n, h = O(v), y = N(v), c = document.createElement("canvas");
    c.width = o, c.height = m, c.style.width = `${c.width}px`, c.style.height = `${c.height}px`;
    const a = c.getContext("2d");
    if (p) {
      a.beginPath();
      const $ = 0, x = 0, b = o / 2 - s / 2, w = m;
      a.moveTo($, x), a.lineTo(b, w);
      const L = o, T = 0, E = o / 2 + s / 2, R = m;
      a.moveTo(L, T), a.lineTo(E, R);
    } else {
      a.beginPath();
      const $ = 0, x = m / 2 - s / 2, b = o, w = 0;
      a.moveTo($, x), a.lineTo(b, w);
      const L = 0, T = m / 2 + s / 2, E = o, R = m;
      a.moveTo(L, T), a.lineTo(E, R);
    }
    return a.strokeStyle = M, a.stroke(), X`<div style=${z(p ? {
      display: "flex",
      marginTop: `-${h ? 0 : y ? n / 2 : 0}px`,
      marginBottom: `-${h ? s : y ? s / 2 : 0}px`
    } : {
      display: "flex",
      marginRight: `-${h ? 0 : y ? n / 2 : 0}px`,
      marginLeft: `-${h ? 0 : y ? s / 2 : 0}px`
    })}>${c}</div>`;
  }
}
I("arcgis-legend-card-size-ramp", B);
export {
  B as LegendCardSizeRamp
};
