import { h, Host } from "@stencil/core";
import state from "../../../store";
export class SelectTemplate {
  constructor() {
    this.name = "template";
    this.value = undefined;
    this.jobId = undefined;
    this.disabled = false;
    this.templates = undefined;
    this.placeholder = "Select a Template";
    this.label = "Template";
    this.labelPosition = "stacked";
    this.interface = "popover";
    this.interfaceOptions = undefined;
    this.disablePosition = true;
    this.disableFrame = false;
    this.allowFullscreen = false;
    this.resize = false;
    this.zoom = 1;
    this.preview = false;
  }
  render() {
    const templateOptions = (this.templates || state.templates || []).map(({ subject: label, id: value }) => ({ label, value }));
    return (h(Host, null, templateOptions.length ? (h("fireenjin-select", { ref: (el) => (this.templateSelectEl = el), onIonChange: (event) => (this.value = event.target.value), interface: this.interface, interfaceOptions: this.interfaceOptions, name: this.name, label: this.label, labelPosition: this.labelPosition, placeholder: this.placeholder, value: this.value, options: templateOptions }, h("ion-button", { slot: "start", fill: "clear", onClick: () => (this.preview = !this.preview) }, h("ion-icon", { slot: "icon-only", name: this.preview ? "eye-off" : "eye" })), h("ion-button", { slot: "end", fill: "clear", onClick: () => (this.templateSelectEl.value = null) }, h("ion-icon", { slot: "icon-only", name: "close-circle" })))) : null, this.preview && this.value && (h("floodteam-template", { templateId: this.value, disablePosition: this.disablePosition, disableFrame: this.disableFrame, allowFullscreen: this.allowFullscreen, zoom: this.zoom || 1, resize: this.resize, style: {
        overflowY: "auto",
        height: "30vh",
        display: "block",
        width: "100%",
      } }))));
  }
  static get is() { return "floodteam-select-template"; }
  static get originalStyleUrls() {
    return {
      "$": ["select-template.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["select-template.css"]
    };
  }
  static get properties() {
    return {
      "name": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "name",
        "reflect": false,
        "defaultValue": "\"template\""
      },
      "value": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "value",
        "reflect": false
      },
      "jobId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "job-id",
        "reflect": false
      },
      "disabled": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "disabled",
        "reflect": false,
        "defaultValue": "false"
      },
      "templates": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "Template[]",
          "resolved": "Template[]",
          "references": {
            "Template": {
              "location": "import",
              "path": "../../../helpers/sdk"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        }
      },
      "placeholder": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "placeholder",
        "reflect": false,
        "defaultValue": "\"Select a Template\""
      },
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "label",
        "reflect": false,
        "defaultValue": "\"Template\""
      },
      "labelPosition": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "\"stacked\" | \"fixed\" | \"floating\"",
          "resolved": "\"fixed\" | \"floating\" | \"stacked\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "label-position",
        "reflect": false,
        "defaultValue": "\"stacked\""
      },
      "interface": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "\"action-sheet\" | \"popover\" | \"alert\"",
          "resolved": "\"action-sheet\" | \"alert\" | \"popover\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "interface",
        "reflect": false,
        "defaultValue": "\"popover\""
      },
      "interfaceOptions": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "interface-options",
        "reflect": false
      },
      "disablePosition": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "disable-position",
        "reflect": false,
        "defaultValue": "true"
      },
      "disableFrame": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "disable-frame",
        "reflect": false,
        "defaultValue": "false"
      },
      "allowFullscreen": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "allow-fullscreen",
        "reflect": false,
        "defaultValue": "false"
      },
      "resize": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "resize",
        "reflect": false,
        "defaultValue": "false"
      },
      "zoom": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "zoom",
        "reflect": false,
        "defaultValue": "1"
      },
      "preview": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "preview",
        "reflect": false,
        "defaultValue": "false"
      }
    };
  }
}
