import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
import { _ as __ } from './default-i18n.js';
import './index2.js';
import { g as getType, z as zones } from './tax.js';
import { d as defineCustomElement$9 } from './sc-button2.js';
import { d as defineCustomElement$8 } from './dropdown.js';
import { d as defineCustomElement$7 } from './sc-form-control2.js';
import { d as defineCustomElement$6 } from './sc-icon2.js';
import { d as defineCustomElement$5 } from './sc-input2.js';
import { d as defineCustomElement$4 } from './sc-menu2.js';
import { d as defineCustomElement$3 } from './sc-menu-item2.js';
import { d as defineCustomElement$2 } from './sc-spinner2.js';
import { d as defineCustomElement$1 } from './sc-tooltip2.js';

const scTaxIdInputCss = ":host{display:block;z-index:3;position:relative}";

const ScTaxIdInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    this.scChange = createEvent(this, "scChange", 7);
    this.scInput = createEvent(this, "scInput", 7);
    this.scInputType = createEvent(this, "scInputType", 7);
    this.scSetState = createEvent(this, "scSetState", 7);
    /** Force show the field. */
    this.show = false;
    /** Type of tax id */
    this.type = 'other';
    /** Tax ID Number */
    this.number = null;
    /** The status */
    this.status = 'unknown';
    /** Other zones label */
    this.otherLabel = __('Tax ID', 'surecart');
    /** GST zone label */
    this.caGstLabel = __('GST Number', 'surecart');
    /** AU zone label */
    this.auAbnLabel = __('ABN Number', 'surecart');
    /** UK zone label */
    this.gbVatLabel = __('UK VAT', 'surecart');
    /** EU zone label */
    this.euVatLabel = __('EU VAT', 'surecart');
  }
  handleCountryChange() {
    if (this.country) {
      this.type = getType(this.country);
    }
  }
  onLabelChange() {
    zones.ca_gst.label = this.caGstLabel || zones.ca_gst.label;
    zones.au_abn.label = this.auAbnLabel || zones.au_abn.label;
    zones.gb_vat.label = this.gbVatLabel || zones.gb_vat.label;
    zones.eu_vat.label = this.euVatLabel || zones.eu_vat.label;
    zones.other.label = this.otherLabel || zones.other.label;
  }
  componentWillLoad() {
    if (this.country) {
      this.type = getType(this.country);
    }
    this.onLabelChange();
  }
  renderStatus() {
    if (this.status === 'valid') {
      return h("sc-icon", { name: "check", slot: "prefix", style: { color: 'var(--sc-color-success-500)' } });
    }
    if (this.status === 'invalid') {
      return h("sc-icon", { name: "x", slot: "prefix", style: { color: 'var(--sc-color-danger-500)' } });
    }
  }
  render() {
    var _a, _b;
    return (h(Fragment, null, h("sc-input", { name: "tax_identifier.number_type", value: this.type, style: { display: 'none' } }), h("sc-input", { label: (_a = zones === null || zones === void 0 ? void 0 : zones[(this === null || this === void 0 ? void 0 : this.type) || 'other']) === null || _a === void 0 ? void 0 : _a.label, name: "tax_identifier.number", value: this.number, onScInput: (e) => {
        e.stopImmediatePropagation();
        this.scInput.emit({
          number: e.target.value,
          number_type: this.type || 'other',
        });
      }, onScChange: (e) => {
        e.stopImmediatePropagation();
        this.scChange.emit({
          number: e.target.value,
          number_type: this.type || 'other',
        });
      } }, this.loading && this.type === 'eu_vat' ? h("sc-spinner", { slot: "prefix", style: { '--spinner-size': '10px' } }) : this.renderStatus(), h("sc-dropdown", { slot: "suffix", position: "bottom-right" }, h("sc-button", { type: "text", slot: "trigger", caret: true, loading: false, style: { color: 'var(--sc-input-label-color)' } }, (_b = zones === null || zones === void 0 ? void 0 : zones[(this === null || this === void 0 ? void 0 : this.type) || 'other']) === null || _b === void 0 ? void 0 : _b.label_small), h("sc-menu", null, Object.keys(zones || {}).map(name => (h("sc-menu-item", { onClick: () => {
        this.scInput.emit({
          number: this.number,
          number_type: name,
        });
        this.scChange.emit({
          number: this.number,
          number_type: name,
        });
        this.type = name;
      }, checked: this.type === name }, zones[name].label_small))))))));
  }
  static get watchers() { return {
    "country": ["handleCountryChange"],
    "otherLabel": ["onLabelChange"],
    "caGstLabel": ["onLabelChange"],
    "auAbnLabel": ["onLabelChange"],
    "gbVatLabel": ["onLabelChange"],
    "euVatLabel": ["onLabelChange"]
  }; }
  static get style() { return scTaxIdInputCss; }
}, [1, "sc-tax-id-input", {
    "country": [1],
    "show": [4],
    "type": [1025],
    "number": [1],
    "status": [1],
    "loading": [4],
    "help": [1],
    "otherLabel": [1, "other-label"],
    "caGstLabel": [1, "ca-gst-label"],
    "auAbnLabel": [1, "au-abn-label"],
    "gbVatLabel": [1, "gb-vat-label"],
    "euVatLabel": [1, "eu-vat-label"]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-tax-id-input", "sc-button", "sc-dropdown", "sc-form-control", "sc-icon", "sc-input", "sc-menu", "sc-menu-item", "sc-spinner", "sc-tooltip"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-tax-id-input":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScTaxIdInput);
      }
      break;
    case "sc-button":
      if (!customElements.get(tagName)) {
        defineCustomElement$9();
      }
      break;
    case "sc-dropdown":
      if (!customElements.get(tagName)) {
        defineCustomElement$8();
      }
      break;
    case "sc-form-control":
      if (!customElements.get(tagName)) {
        defineCustomElement$7();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$6();
      }
      break;
    case "sc-input":
      if (!customElements.get(tagName)) {
        defineCustomElement$5();
      }
      break;
    case "sc-menu":
      if (!customElements.get(tagName)) {
        defineCustomElement$4();
      }
      break;
    case "sc-menu-item":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-spinner":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
    case "sc-tooltip":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { ScTaxIdInput as S, defineCustomElement as d };
