/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import { c as s } from "../../chunks/runtime.js";
import { css as d, html as l } from "lit";
import { b as c } from "../../chunks/pciUtils.js";
import { createRef as o, ref as u } from "lit-html/directives/ref.js";
import { LitElement as n, safeClassMap as a } from "@arcgis/lumina";
const r = d`:host{display:block;--calcite-label-margin-bottom: 0}.label-display{display:block;padding-bottom:1rem}.display-flex{display:flex}.display-grid{display:grid}.display-none{display:none}.padding-top-1{padding-top:1rem}.main-input{width:300px;padding-inline-end:1rem}.float-end{float:inline-end}.position-relative{position:relative}.position-right{position:absolute;right:0}`;
class p extends n {
  constructor() {
    super(...arguments), this.showAddDeduct = !1, this._deductValuesElement = o();
  }
  static {
    this.properties = { showAddDeduct: 16 };
  }
  static {
    this.styles = r;
  }
  render() {
    const e = this.showAddDeduct ? "display-none" : "display-grid", t = this.showAddDeduct ? "position-relative" : "display-none";
    return l`<div class=${a(e)}><div class="label-display"><calcite-label class="label-display">\r\n              Enter comma delimited deduct values${this._getDeductValuesInput()}</calcite-label></div><div>${this._getCalculateButton()}</div></div><div class=${a(t)}><div class="position-right"><calcite-action appearance=transparent class="float-end" icon=x @click=${() => this._toggleShowAddDeduct()} scale=s text=Close></calcite-action></div><deduct-calculator class="display-grid padding-top-1" @deductValueComplete=${this._addDeductValue}></deduct-calculator></div>`;
  }
  _getDeductValuesInput() {
    return l`<div class="display-flex"><calcite-input class="main-input" ${u(this._deductValuesElement)}></calcite-input><calcite-action appearance=transparent icon=plus-circle @click=${() => this._toggleShowAddDeduct()} scale=s text="Add deduct value"></calcite-action></div>`;
  }
  _getCalculateButton() {
    return this._deductValuesElement.value ? l`<calcite-button @click=${() => this._calculatePCI(this._deductValuesElement?.value?.value || "")}>\r\n        Calculate PCI</calcite-button>` : void 0;
  }
  _toggleShowAddDeduct() {
    this.showAddDeduct = !this.showAddDeduct;
  }
  _addDeductValue(e) {
    this._toggleShowAddDeduct(), this._deductValuesElement.value && (this._deductValuesElement.value.value += Math.abs(Number.parseFloat(this._deductValuesElement.value.value)) > 0 ? `,${e.detail}` : e.detail);
  }
  _calculatePCI(e) {
    const t = c(e, !0), i = t <= 10 ? "Failed" : t <= 25 ? "Serious" : t <= 40 ? "Very Poor" : t <= 55 ? "Poor" : t <= 70 ? "Fair" : t <= 85 ? "Satisfactory" : "Good";
    console.log(`PCI: ${t}`), console.log(`Rating: ${i}`), alert("See debug console for results");
  }
}
s("pci-calculator", p);
export {
  p as PciCalculator
};
