import { h } from '@stencil/core';
export class GdUserDashboardExportDialog {
  constructor() {
    /**
     * the history items to export
     */
    this.historyItemIds = [];
    /**
     * when to show the dialog
     */
    this.show = false;
    /**
     * if the share as url functionality should be available or not
     */
    this.canShareAsUrl = true;
    /**
     * if the user is allowed to share as url (canShareAsUrl), this is used to determine
     * when to show the download export form
     */
    this.showExportForm = false;
    /**
     * a visual state to show loading in the export button
     */
    this.exporting = false;
    this.showErrors = false;
  }
  setExportOptions() {
    if (this.show) {
      this.exportOptions = { filename: 'export', shareLabel: '' };
      this.showExportForm = false;
    }
  }
  handleChange(event) {
    this.exportOptions[event.detail.target.name] = event.detail.target.value;
  }
  handleClose() {
    if (this.exporting)
      return;
    this.showErrors = false;
    this.showExportForm = false;
    // @ts-ignore
    this.el.shadowRoot.querySelector('bs-modal').closeDialog();
  }
  exportItems() {
    var _a;
    this.showErrors = true;
    if (!((_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.filename))
      return;
    this.exporting = true;
    this.export.emit({
      options: this.exportOptions,
      historyItemIds: this.historyItemIds,
    });
    // visually wait a bit before closing
    setTimeout(() => {
      this.exporting = false;
      this.handleClose();
    }, 1000);
  }
  /**
   * if the user can share items as URL and chooses to, fire an event to switch to the share dialog
   */
  switchToShareDialog() {
    this.share.emit();
    this.handleClose();
  }
  /**
   * renders the dialog
   */
  render() {
    var _a, _b, _c, _d;
    return (h("bs-modal", { show: this.show, onClose: () => this.closed.emit() }, h("bs-modal-header", { "modal-title": `<bs-icon size="20" class="mr-2" icon="fab fa-file-export"></bs-icon> Export ${this.historyItemIds.length} Items` }), this.canShareAsUrl && !this.showExportForm && (h("bs-modal-body", null, h("div", { class: "d-flex flex-column" }, h("p", null, "You can download these items as a JSON file or we can generate a URL that you can share with users to automatically import these items into their dashboard."), h("div", null, h("bs-button", { class: "mr-3", variant: "primary", onClick: () => (this.showExportForm = true) }, "Download as JSON"), h("bs-button", { class: "mr-3", variant: "primary", onClick: () => this.switchToShareDialog() }, "Share with a URL"))))), (!this.canShareAsUrl || this.showExportForm) && (h("bs-modal-body", null, h("bs-form-row", null, h("bs-form-group", null, h("bs-form-label", null, "Share Label"), h("bs-form-control", { "control-id": "shareLabel", as: "input", name: "shareLabel", type: "text", value: (_a = this.exportOptions) === null || _a === void 0 ? void 0 : _a.filename, required: true, onBsInput: this.handleChange.bind(this), "is-invalid": this.showErrors && !((_b = this.exportOptions) === null || _b === void 0 ? void 0 : _b.filename) }))), h("bs-form-row", null, h("bs-form-group", null, h("bs-form-label", null, "Filename"), h("bs-form-control", { "control-id": "filename", as: "input", name: "filename", type: "text", value: (_c = this.exportOptions) === null || _c === void 0 ? void 0 : _c.shareLabel, onBsInput: this.handleChange.bind(this) }), this.showErrors && !((_d = this.exportOptions) === null || _d === void 0 ? void 0 : _d.filename) && h("div", { class: "text-danger" }, "Filename required"))))), (!this.canShareAsUrl || this.showExportForm) && (h("bs-modal-footer", null, h("bs-button", { variant: "secondary", onClick: this.handleClose.bind(this), disabled: this.exporting }, "Cancel"), this.exporting ? (h("bs-button", { variant: "primary", disabled: true }, h("bs-spinner", { "aria-hidden": "true", size: "sm" }), h("span", { class: "ml-2" }, "Exporting..."))) : (h("bs-button", { variant: "primary", onClick: this.exportItems.bind(this) }, "Export"))))));
  }
  static get is() { return "gd-user-dashboard-export-dialog"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["gd-user-dashboard-export-dialog.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["gd-user-dashboard-export-dialog.css"]
    };
  }
  static get properties() {
    return {
      "historyItemIds": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[]",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "the history items to export"
        },
        "defaultValue": "[]"
      },
      "show": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "when to show the dialog"
        },
        "attribute": "show",
        "reflect": false,
        "defaultValue": "false"
      },
      "canShareAsUrl": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "if the share as url functionality should be available or not"
        },
        "attribute": "can-share-as-url",
        "reflect": false,
        "defaultValue": "true"
      },
      "showExportForm": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "if the user is allowed to share as url (canShareAsUrl), this is used to determine\nwhen to show the download export form"
        },
        "attribute": "show-export-form",
        "reflect": false,
        "defaultValue": "false"
      }
    };
  }
  static get states() {
    return {
      "exportOptions": {},
      "exporting": {},
      "showErrors": {}
    };
  }
  static get events() {
    return [{
        "method": "closed",
        "name": "closed",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "event emitted when the dialog is closed"
        },
        "complexType": {
          "original": "void",
          "resolved": "void",
          "references": {}
        }
      }, {
        "method": "export",
        "name": "export",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "event emitted to export items"
        },
        "complexType": {
          "original": "Export",
          "resolved": "{ options: ExportOptions; historyItemIds: string[]; }",
          "references": {
            "Export": {
              "location": "local"
            }
          }
        }
      }, {
        "method": "share",
        "name": "share",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "event emitted when user chooses to share items instead of export"
        },
        "complexType": {
          "original": "void",
          "resolved": "void",
          "references": {}
        }
      }];
  }
  static get elementRef() { return "el"; }
  static get watchers() {
    return [{
        "propName": "show",
        "methodName": "setExportOptions"
      }];
  }
}
