import { Component, h, Prop } from "@stencil/core";
export class PopoverFilter {
  render() {
    var _a;
    return (h("ion-content", { style: {
        "--background": "var(--ion-color-base)",
      } },
      h("fireenjin-form", { disableLoader: true, name: "filter" },
        this.label && h("ion-item-divider", null, this.label),
        ((_a = this.controls) === null || _a === void 0 ? void 0 : _a.length)
          ? this.controls.map((control) => h("fireenjin-select", { ...control }))
          : null,
        h("ion-item-divider", null, "Sort By"),
        h("ion-item", { class: "sort-select" },
          h("ion-icon", { slot: "start", name: "swap-vertical" }),
          h("ion-select", { name: "orderBy", value: this.sort.value, okText: "Okay", cancelText: "Dismiss", interfaceOptions: {
              header: this.sort.header,
              subHeader: this.sort.subHeader,
              message: this.sort.message,
            } }, this.sort.options.map((option) => (h("ion-select-option", { value: option.value }, option.label))))))));
  }
  static get is() { return "popover-filter"; }
  static get originalStyleUrls() { return {
    "$": ["popover-filter.css"]
  }; }
  static get styleUrls() { return {
    "$": ["popover-filter.css"]
  }; }
  static get properties() { return {
    "label": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "label",
      "reflect": false
    },
    "sort": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "{\n    label?: string;\n    value?: string;\n    header?: string;\n    subHeader?: string;\n    message?: string;\n    options: {\n      label: string;\n      value: string;\n    }[];\n  }",
        "resolved": "{ label?: string; value?: string; header?: string; subHeader?: string; message?: string; options: { label: string; value: string; }[]; }",
        "references": {}
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "controls": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "{\n    resultsKey?: string;\n    name: string;\n    icon?: string;\n    label?: string;\n    value?: any;\n    header?: string;\n    subHeader?: string;\n    message?: string;\n    optionEl?: (result: any) => any;\n    endpoint?: string;\n    query?: string;\n    limit?: number;\n    orderBy?: string;\n    dataPropsMap?: any;\n    params?: any;\n    multiple?: boolean;\n    disabled?: boolean;\n    cancelText?: string;\n    okText?: string;\n    placeholder?: string;\n    selectedText?: string;\n    interface?: SelectInterface;\n    interfaceOptions?: any;\n    compareWith?: string | SelectCompareFn | null;\n    options?: {\n      label: string;\n      value: string;\n    }[];\n  }[]",
        "resolved": "{ resultsKey?: string; name: string; icon?: string; label?: string; value?: any; header?: string; subHeader?: string; message?: string; optionEl?: (result: any) => any; endpoint?: string; query?: string; limit?: number; orderBy?: string; dataPropsMap?: any; params?: any; multiple?: boolean; disabled?: boolean; cancelText?: string; okText?: string; placeholder?: string; selectedText?: string; interface?: SelectInterface; interfaceOptions?: any; compareWith?: string | SelectCompareFn; options?: { label: string; value: string; }[]; }[]",
        "references": {
          "SelectInterface": {
            "location": "import",
            "path": "@ionic/core"
          },
          "SelectCompareFn": {
            "location": "import",
            "path": "@ionic/core"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    }
  }; }
}
