import { r as registerInstance, d as createEvent, h, H as Host } from './index-26447f8a.js';

const selectCss = "fireenjin-select ion-icon{margin-right:5px;color:var(--ion-text-color);opacity:0.33}fireenjin-select select{border:none;width:auto;padding:10px;min-width:30%;cursor:pointer;text-align:justify}";

const Select = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.fireenjinFetch = createEvent(this, "fireenjinFetch", 7);
    this.ionChange = createEvent(this, "ionChange", 7);
    this.disabled = false;
    this.cancelText = "Dismiss";
    this.okText = "Okay";
    this.placeholder = undefined;
    this.name = undefined;
    this.selectedText = undefined;
    this.multiple = false;
    this.interface = "alert";
    this.interfaceOptions = {};
    this.compareWith = undefined;
    this.value = undefined;
    this.icon = undefined;
    this.endpoint = undefined;
    this.header = undefined;
    this.subHeader = undefined;
    this.message = undefined;
    this.orderBy = undefined;
    this.dataPropsMap = undefined;
    this.optionEl = undefined;
    this.limit = 15;
    this.params = undefined;
    this.query = undefined;
    this.label = undefined;
    this.pattern = undefined;
    this.options = [];
    this.required = false;
    this.resultsKey = undefined;
    this.labelPosition = undefined;
    this.lines = undefined;
    this.results = [];
  }
  onChange(event) {
    var _a, _b;
    if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.name) !== this.name)
      return;
    this.value = ((_b = event.target) === null || _b === void 0 ? void 0 : _b.value) || null;
  }
  onSuccess(event) {
    var _a, _b, _c;
    if (((_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.name) !== "select" ||
      event.detail.endpoint !== this.endpoint)
      return;
    this.results = ((_c = (_b = event === null || event === void 0 ? void 0 : event.detail) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.results)
      ? event.detail.data.results
      : [];
    setTimeout(() => {
      this.value = this.value;
    }, 200);
  }
  fetchData() {
    if (!this.endpoint)
      return;
    this.fireenjinFetch.emit({
      name: "select",
      endpoint: this.endpoint,
      dataPropsMap: this.dataPropsMap
        ? this.dataPropsMap
        : this.resultsKey
          ? { [this.resultsKey]: "results" }
          : null,
      params: Object.assign({ data: Object.assign(Object.assign(Object.assign({}, (this.query ? { query: this.query } : {})), (this.orderBy ? { orderBy: this.orderBy } : {})), { limit: this.limit ? this.limit : 15 }) }, (this.params ? this.params : {})),
    });
  }
  componentWillLoad() {
    this.fetchData();
  }
  render() {
    return (h(Host, null, h("ion-item", { lines: this.lines }, this.icon && h("ion-icon", { slot: "start", name: this.icon }), this.label && (h("ion-label", { position: this.labelPosition }, this.label)), h("ion-select", { disabled: this.disabled, selectedText: this.selectedText, interface: this.interface, compareWith: this.compareWith, name: this.name, value: this.value, okText: this.okText, multiple: this.multiple, cancelText: this.cancelText, placeholder: this.placeholder, interfaceOptions: this.interfaceOptions
        ? this.interfaceOptions
        : {
          header: this.header,
          subHeader: this.subHeader,
          message: this.message,
        } }, (this.options ? this.options : []).map((option) => this.optionEl ? (this.optionEl(option)) : (h("ion-select-option", { value: option.value, disabled: option.disabled }, option.label))), (this.results ? this.results : []).map((result) => this.optionEl ? (this.optionEl(result)) : (h("ion-select-option", { value: result.id }, result.name)))), h("input", { style: {
        opacity: "0",
        height: "0",
        width: "0",
        float: "left",
        margin: "0",
        padding: "0",
      }, type: "text", pattern: this.pattern, value: this.value, required: this.required }))));
  }
};
Select.style = selectCss;

export { Select as fireenjin_select };
