'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-fd2bbf0b.js');

const inputFileCss = "fireenjin-input-file ion-card{width:95%;margin:15px auto;background-color:var(--ion-color-light-tint);--background-color:var(--ion-color-light-tint);padding:0}fireenjin-input-file ion-card.drag-over{opacity:0.8}fireenjin-input-file ion-card ion-item{padding:5px 0;background-color:var(--ion-color-light-tint);--ion-color-base:var(--ion-color-light-tint);--background:var(--ion-color-light-tint);pointer-events:none}fireenjin-input-file ion-card ion-item ion-icon{height:50px;width:50px;color:var(--ion-color-medium)}fireenjin-input-file ion-card ion-item h2{font-size:20px;color:var(--ion-color-dark);margin:0}fireenjin-input-file ion-card ion-item p{color:var(--ion-color-darker-grey);margin:0}fireenjin-input-file ion-card:hover{cursor:pointer}fireenjin-input-file ion-card:hover h2{color:var(--ion-color-primary)}fireenjin-input-file ion-card:hover ion-icon{color:var(--ion-color-primary)}fireenjin-input-file input{float:left;height:0;width:0;visibility:hidden}";

let InputFile = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.fireenjinUpload = index.createEvent(this, "fireenjinUpload", 7);
    this.ionInput = index.createEvent(this, "ionInput", 7);
    this.type = "file";
    this.disabled = false;
    /**
     * The endpoint to upload to
     */
    this.endpoint = "upload";
    this.uploadData = {};
    this.dragOver = false;
  }
  onFileChange() {
    if (!this.value)
      return false;
    this.ionInput.emit({
      name: this.name,
      value: this.value,
    });
  }
  async openFile() {
    const fileInputEl = this.fileUploaderEl.querySelector('input[type="file"]');
    fileInputEl.click();
    return fileInputEl;
  }
  uploadFile(file) {
    this.isLoading = true;
    if (!window.FileReader)
      return;
    const reader = new FileReader();
    reader.onload = async (event) => {
      if (event.target.readyState != 2)
        return;
      if (event.target.error) {
        alert("Error while reading file");
        return;
      }
      this.fireenjinUpload.emit({
        event,
        name: this.name,
        endpoint: this.endpoint,
        data: Object.assign({
          id: this.documentId,
          type: this.type,
          fileName: this.fileName,
          file,
          path: this.path,
          encodedContent: event.target.result,
        }, this.uploadData),
      });
    };
    reader.readAsDataURL(file);
  }
  selectFile(event) {
    this.isLoading = true;
    const file = event.target.files[0];
    this.selectedFile = file.name;
    this.uploadFile(file);
  }
  onDrop(event) {
    event.preventDefault();
    if (event.dataTransfer.items) {
      // Use DataTransferItemList interface to access the file(s)
      for (var i = 0; i < event.dataTransfer.items.length; i++) {
        // If dropped items aren't files, reject them
        if (event.dataTransfer.items[i].kind === "file") {
          var file = event.dataTransfer.items[i].getAsFile();
          this.selectedFile = file.name;
          this.uploadFile(file);
        }
      }
    }
    else {
      // Use DataTransfer interface to access the file(s)
      for (var i = 0; i < event.dataTransfer.files.length; i++) {
        const file = event.dataTransfer.files[i];
        this.selectedFile = file.name;
        this.uploadFile(file);
        console.log("... file[" + i + "].name = " + file.name);
      }
    }
    this.dragOver = false;
  }
  onDrag(event) {
    event.preventDefault();
  }
  onDragOver(event) {
    event.preventDefault();
  }
  onDragEnter(event) {
    console.log("Show UI to drop file", event);
    this.dragOver = true;
  }
  onDragLeave(event) {
    console.log("Hide UI to drop file", event);
    this.dragOver = false;
  }
  render() {
    return (index.h("ion-card", { disabled: this.disabled, class: { "drag-over": this.dragOver }, onDragEnter: (event) => this.onDragEnter(event), onDragOver: (event) => this.onDragOver(event), onDrag: (event) => this.onDrag(event), onDrop: (event) => this.onDrop(event), onDragLeave: (event) => this.onDragLeave(event), onClick: () => this.openFile() }, index.h("ion-item", { lines: "none" }, index.h("ion-icon", { name: this.icon ? this.icon : "document", slot: "start" }), index.h("div", null, index.h("h2", null, this.dragOver
      ? "Drop File Here"
      : this.label
        ? this.label
        : "Upload a File"), index.h("p", null, this.selectedFile
      ? this.selectedFile
      : this.defaultValue
        ? this.defaultValue
        : "Select a letterhead"))), index.h("input", { disabled: this.disabled, type: "file", onChange: (event) => this.selectFile(event), accept: this.accept ? this.accept : null, value: "blah" })));
  }
  get fileUploaderEl() { return index.getElement(this); }
  static get watchers() { return {
    "value": ["onFileChange"]
  }; }
};
InputFile.style = inputFileCss;

const radiosCss = "";

let Radios = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.fireenjinFetch = index.createEvent(this, "fireenjinFetch", 7);
    this.disabled = false;
    this.allowEmptySelection = false;
    this.lines = "none";
    this.labelPosition = "stacked";
    this.limit = 15;
    this.radioSlot = "start";
    this.results = [];
  }
  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) !== "radios" ||
      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: "radios",
      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 (index.h("ion-list", null, index.h("ion-radio-group", { name: this.name, value: this.value, allowEmptySelection: this.allowEmptySelection }, index.h("ion-list-header", { position: this.labelPosition }, this.label), (this.options ? this.options : []).map((option) => this.optionEl ? (this.optionEl(option)) : (index.h("ion-item", { lines: this.lines }, index.h("ion-label", null, (option === null || option === void 0 ? void 0 : option.label) || (option === null || option === void 0 ? void 0 : option.value)), index.h("ion-radio", { mode: this.mode, color: (option === null || option === void 0 ? void 0 : option.color) || this.color, disabled: this.disabled || option.disabled, slot: (option === null || option === void 0 ? void 0 : option.slot) || this.radioSlot, value: (option === null || option === void 0 ? void 0 : option.value) || null })))), (this.results ? this.results : []).map((result) => this.optionEl ? (this.optionEl(result)) : (index.h("ion-item", { lines: this.lines }, index.h("ion-label", null, (result === null || result === void 0 ? void 0 : result.label) || (result === null || result === void 0 ? void 0 : result.name) || (result === null || result === void 0 ? void 0 : result.value) || (result === null || result === void 0 ? void 0 : result.id)), index.h("ion-radio", { mode: this.mode, color: (result === null || result === void 0 ? void 0 : result.color) || this.color, disabled: this.disabled || (result === null || result === void 0 ? void 0 : result.disabled), slot: (result === null || result === void 0 ? void 0 : result.slot) || this.radioSlot, value: (result === null || result === void 0 ? void 0 : result.value) || (result === null || result === void 0 ? void 0 : result.id) || null })))))));
  }
};
Radios.style = radiosCss;

exports.fireenjin_input_file = InputFile;
exports.fireenjin_radios = Radios;

//# sourceMappingURL=fireenjin-input-file_2.cjs.entry.js.map