/* COPYRIGHT Esri - https://js.arcgis.com/5.0/LICENSE.txt */
import { c as r } from "../../chunks/runtime.js";
import { css as l, html as o } from "lit";
import "@arcgis/toolkit/type";
import "../../chunks/series-types.js";
import { f as p } from "../../chunks/rest-js-object-literals.js";
import "@arcgis/toolkit/intl";
import "lodash-es";
import "luxon";
import "d3-array";
import "../../chunks/index.js";
import "@arcgis/core/Graphic.js";
import "@arcgis/core/renderers/support/jsonUtils.js";
import "@arcgis/core/symbols/support/symbolUtils.js";
import "@esri/arcgis-html-sanitizer";
import "@arcgis/core/intl.js";
import "@arcgis/core/layers/support/FeatureFilter.js";
import "@arcgis/core/smartMapping/statistics/histogram.js";
import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
import "simple-statistics";
import "@arcgis/core/request.js";
import "@arcgis/core/core/sql.js";
import "@arcgis/core/AttributeBinsGraphic.js";
import "@arcgis/core/geometry/support/jsonUtils.js";
import "@arcgis/core/rest/support/AttributeBinsQuery.js";
import "@arcgis/core/rest/support/StatisticDefinition.js";
import "@arcgis/core/time/TimeExtent.js";
import "@arcgis/core/core/promiseUtils.js";
import "@arcgis/toolkit/dom";
import { e as a } from "../../chunks/popover-ui-utils.js";
import { g as s } from "../../chunks/default.js";
import { u as n } from "../../chunks/useT9n.js";
import { createRef as m, ref as c } from "lit/directives/ref.js";
import { LitElement as h, createEvent as i, safeClassMap as g } from "@arcgis/lumina";
const C = {
  jsAppFlyout: "js-app-flyout"
}, d = l``;
class f extends h {
  constructor() {
    super(...arguments), this._messages = n(), this.popoverElement = m(), this.placement = "leading", this.arcgisChartsConfigGuidePopoverColorChange = i(), this.arcgisChartsConfigGuidePopoverSymbolChange = i(), this.arcgisChartsConfigPopoverClose = i();
  }
  static {
    this.properties = { messageOverrides: 0, selectedElement: 0, referenceElement: 0, placement: 1, open: 5 };
  }
  static {
    this.styles = d;
  }
  async reposition() {
    await this.popoverElement.value?.reposition();
  }
  updated() {
    a(this.popoverElement.value, this.open);
  }
  guidePopoverClose() {
    this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
  }
  updateColorProperties(t) {
    const e = t.detail;
    e !== void 0 && (e[3] = s), this.selectedElement = e, this.arcgisChartsConfigGuidePopoverColorChange.emit(this.selectedElement);
  }
  updateSymbolProperties(t) {
    const { lineStyle: e } = t.target;
    e?.color !== void 0 && (e.color[3] = s), this.selectedElement = e, this.arcgisChartsConfigGuidePopoverSymbolChange.emit(t.detail);
  }
  render() {
    const t = this.selectedElement, e = this.selectedElement;
    return o`<div class=${g(C.jsAppFlyout)}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .open=${this.open} offset-distance=20 offset-skidding=60 label pointer-disabled @calcitePopoverClose=${this.guidePopoverClose} auto-close ${c(this.popoverElement)}>${Array.isArray(t) && o`<arcgis-charts-config-color-style .header=${this._messages.fillStyle} enable-close .open=${this.open} .selectedColor=${t} @arcgisChartsConfigColorStyleClose=${this.guidePopoverClose} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` || ""}${e?.type === p.SLS && o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${e} @arcgisChartsConfigLineStyleClose=${this.guidePopoverClose} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` || ""}</calcite-popover></div>`;
  }
}
r("arcgis-charts-config-guide-popover", f);
export {
  f as ArcgisChartsConfigGuidePopover
};
