/* COPYRIGHT Esri - https://js.arcgis.com/5.0/LICENSE.txt */
import { c as v } from "../../chunks/runtime.js";
import { keyed as p } from "lit/directives/keyed.js";
import { repeat as k } from "lit/directives/repeat.js";
import { B as r } from "../../chunks/common.js";
import "@arcgis/toolkit/type";
import "../../chunks/series-types.js";
import { R as f } from "../../chunks/rest-js-object-literals.js";
import "@arcgis/toolkit/intl";
import "lodash-es";
import "luxon";
import "d3-array";
import { d3 as $, bU as g, bS as y, cU as F } from "../../chunks/index.js";
import "@arcgis/core/Graphic.js";
import "@arcgis/core/renderers/support/jsonUtils.js";
import "@arcgis/core/symbols/support/symbolUtils.js";
import { substitute as L } from "@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 { e as P, p as I } from "../../chunks/popover-ui-utils.js";
import { a as l } from "../../chunks/interfaces.js";
import { a as h, e as x, c as u, d as S } from "../../chunks/chart-ui-utils2.js";
import { u as D } from "../../chunks/useT9n.js";
import { css as T, html as n } from "lit";
import { createRef as b, ref as d } from "lit/directives/ref.js";
import { LitElement as E, createEvent as C, renderElement as w, safeStyleMap as B, safeClassMap as m } from "@arcgis/lumina";
const o = {
  jsAppFlyout: "js-app-flyout",
  name: "bar-chart-data-popover",
  numericFieldPickList: "bar-chart-data-numeric-fields-pick-list",
  header: "header",
  fab: "fab",
  pickListItemLabel: "pick-list-item-label",
  sortMean: "sort-mean",
  sortMedian: "sort-median",
  sortOrderPickList: "sort-order-pick-list",
  panel: "panel"
}, N = T`.hide{visibility:hidden}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.name{display:flex;flex-direction:column;margin:.5rem;padding:.5rem;background:#fff;min-width:250px}.header{margin:0;font-weight:bolder}.fab{display:flex;justify-content:stretch}.pick-list-item-label{font-size:small}.sort-icon-color{color:#000}.sort-mean,.sort-median{transform:rotate(90deg)}.sort-order-pick-list{overflow-y:hidden}.panel{max-height:60vh}`;
class K extends E {
  constructor() {
    super(...arguments), this._messages = D(), this.picklist = b(), this.placement = "leading", this.popoverElement = b(), this.offsetDistance = -200, this.pickListHasChanged = !1, this.layerFieldsInfo = [], this.isCustomSortDisabled = !1, this.arcgisChartsConfigBoxPlotDataPopoverChange = C(), this.arcgisChartsConfigPopoverClose = C();
  }
  static {
    this.properties = { messageOverrides: 0, headingTitle: 1, referenceElement: 0, open: 5, contentKind: 1, layerFieldsInfo: 0, isCustomSortDisabled: 5, selectedContent: 1 };
  }
  static {
    this.styles = N;
  }
  async reposition() {
    await this.popoverElement.value?.reposition();
  }
  willUpdate(e) {
    e.has("selectedContent") && this.selectedContentChange(this.selectedContent, e.get("selectedContent"));
  }
  updated() {
    setTimeout(() => {
      typeof this.picklist.value?.setFocus == "function" && this.picklist.value?.setFocus();
    }, h.PopoverTimer), P(this.popoverElement.value, this.open), this.hasUpdated || setTimeout(() => {
      this.popoverElement.value?.reposition();
    }, h.PopoverTimer);
  }
  selectedContentChange(e, t) {
    this.pickListHasChanged = I(e, t);
  }
  closePopover() {
    if (this.contentKind === l.numericFields && this.pickListHasChanged) {
      const e = {
        pickListElement: this.picklist.value,
        eventEmitter: this.arcgisChartsConfigBoxPlotDataPopoverChange,
        contentKind: this.contentKind
      };
      x(e);
    }
    this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
  }
  onDataContentTypeChange(e) {
    this.pickListHasChanged = !0;
    const t = e.target.selectedItems;
    this.arcgisChartsConfigBoxPlotDataPopoverChange.emit({
      contentKind: this.contentKind,
      value: t.map((i) => i.value)
    }), this.open = !1;
  }
  buildPickListItem(e) {
    return p(e.name, n`<calcite-list-item .label=${$(this.layerFieldsInfo, e.name)} .value=${e.name} .selected=${u(e.name, this.selectedContent)}></calcite-list-item>`);
  }
  buildPickListItems(e) {
    const t = this.layerFieldsInfo?.length ?? 0, i = [];
    switch (e) {
      case l.numericFields: {
        for (let s = 0; s < t; s += 1) {
          const a = this.layerFieldsInfo[s];
          y(a) && i.push(this.buildPickListItem(a));
        }
        break;
      }
      case l.category: {
        const s = p(" ", n`<calcite-list-item label=" " value=" " .selected=${u("", this.selectedContent)}></calcite-list-item>`);
        i.push(s);
        for (let a = 0; a < t; a += 1) {
          const c = this.layerFieldsInfo[a];
          (g(c) || c.type === f.String) && i.push(this.buildPickListItem(c));
        }
        break;
      }
      case l.splitByField: {
        const s = p(" ", n`<calcite-list-item label=" " value=" " .selected=${u("", this.selectedContent)}></calcite-list-item>`);
        i.push(s);
        for (let a = 0; a < t; a += 1) {
          const c = this.layerFieldsInfo[a];
          (g(c) || c.type === f.String) && i.push(this.buildPickListItem(c));
        }
        break;
      }
    }
    return i;
  }
  onNumericFieldsChange(e) {
    e.target !== null && (this.selectedContent = e.target.selectedItems.map((t) => t.value));
  }
  buildSortOrder() {
    const e = Object.keys(r);
    let t;
    return k(e, (i) => i, (i) => {
      let s = "";
      switch (i) {
        case r.xAxisAsc: {
          t = "a-z-down";
          break;
        }
        case r.xAxisDesc: {
          t = "a-z-up";
          break;
        }
        case r.meanAsc:
          t = "sort-descending", s = o.sortMean;
          break;
        case r.meanDesc: {
          t = "sort-ascending", s = o.sortMean;
          break;
        }
        case r.medianAsc: {
          t = "sort-descending", s = o.sortMedian;
          break;
        }
        case r.medianDesc: {
          t = "sort-ascending", s = o.sortMedian;
          break;
        }
        case r.customSort: {
          t = "arrow-up-down";
          break;
        }
      }
      return n`<calcite-list-item .disabled=${this.isCustomSortDisabled && i === r.customSort} .label=${this._messages[i]} .selected=${this.selectedContent === i} .value=${r[i]} @mouseover=${this.createTooltip} @mouseout=${this.destroyTooltip}><calcite-icon class=${`sort-icon-color ${s}`} slot=content-start .icon=${t}></calcite-icon></calcite-list-item>`;
    });
  }
  onNumericFieldSelectionDone() {
    this.pickListHasChanged && this.closePopover();
  }
  createTooltip(e) {
    if (e.target?.label === this._messages.customSort && this.isCustomSortDisabled) {
      const t = e.target, i = F(t), a = new Intl.NumberFormat(i).format(h.customSortLimit), c = L(this._messages.customSortLimit ?? "", {
        totalLimit: a
      });
      this.tooltip = w(n`<calcite-tooltip style=${B({ opacity: 1, zIndex: "var(--calcite-floating-ui-z-index)" })} .referenceElement=${t} open placement=top>${c}</calcite-tooltip>`), document.body.appendChild(this.tooltip);
    }
  }
  destroyTooltip() {
    S(this.tooltip);
  }
  renderCategory() {
    const e = this.buildPickListItems(l.category);
    return n`<calcite-list label class=${m(o.pickListItemLabel)} selection-mode=single selection-appearance=border filter-enabled @calciteListChange=${this.onDataContentTypeChange} ${d(this.picklist)}>${e}</calcite-list>`;
  }
  renderNumericFields() {
    const e = this.buildPickListItems(l.numericFields);
    return n`<calcite-list label class=${m(o.numericFieldPickList)} selection-mode=multiple filter-enabled @calciteListChange=${this.onNumericFieldsChange} ${d(this.picklist)}>${e}</calcite-list>`;
  }
  renderSplitByField() {
    const e = this.buildPickListItems(l.splitByField);
    return n`<calcite-list label class=${m(o.pickListItemLabel)} selection-mode=single selection-appearance=border filter-enabled @calciteListChange=${this.onDataContentTypeChange} ${d(this.picklist)}>${e}</calcite-list>`;
  }
  renderSortOrder() {
    const e = this.buildSortOrder();
    return n`<calcite-list label class=${m(o.sortOrderPickList)} selection-mode=single selection-appearance=border @calciteListChange=${this.onDataContentTypeChange}>${e}</calcite-list>`;
  }
  renderPopoverInfo() {
    let e;
    switch (this.contentKind) {
      case l.category:
        e = this.renderCategory();
        break;
      case l.numericFields:
        e = this.renderNumericFields();
        break;
      case l.splitByField:
        e = this.renderSplitByField();
        break;
      case l.sortOrder:
        e = this.renderSortOrder();
        break;
    }
    return e;
  }
  render() {
    let e;
    return this.contentKind === l.numericFields && (e = n`<div slot=footer><calcite-fab class=${m(o.fab)} appearance=outline-fill kind=neutral .icon=${void 0} .label=${this._messages.selectionDone} scale=s text-enabled .text=${this._messages.selectionDone} @click=${this.onNumericFieldSelectionDone}></calcite-fab></div>`), n`<div class=${m(o.jsAppFlyout)}><calcite-popover class=${m(o.name)} .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .offsetDistance=${this.offsetDistance} .open=${this.open} @calcitePopoverClose=${this.closePopover} label auto-close ${d(this.popoverElement)}><calcite-panel class=${m(o.panel)} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div slot=header-content class=${m(o.header)}>${this.headingTitle ?? ""}</div>${this.renderPopoverInfo()}${e}</calcite-panel></calcite-popover></div>`;
  }
}
v("arcgis-charts-config-box-plot-popover", K);
export {
  K as ArcgisChartsConfigBoxPlotPopover
};
