import { Component, h, Prop } from "@stencil/core";
export class NavigationFooter {
  constructor() {
    this.hidePins = false;
  }
  render() {
    return (h("ion-header", { class: { "showing-pins": !this.hidePins } },
      h("ion-toolbar", null,
        h("div", { class: "header-content", style: { display: "flex", "flex-wrap": "wrap" } },
          h("slot", null),
          !this.hidePins && (h("floodteam-pin-bar", { style: {
              display: "flex",
              "justify-content": "flex-end",
            } }))),
        h("div", { class: "menu-buttons" },
          h("ion-menu-button", { autoHide: false },
            h("ion-icon", { src: "/assets/icon/icon.svg", "aria-hidden": "true", style: {
                height: "55px",
                width: "60px",
                margin: "auto",
                marginTop: this.hidePins ? "auto" : "5px",
                textDecoration: "none",
                color: "var(--ion-text-color)",
              } })),
          h("ion-button", { style: {
              transition: "all ease 0.5s",
              position: "absolute",
              right: this.hidePins ? "40px" : "0",
              bottom: this.hidePins ? "10px" : "0px",
            }, onClick: () => (this.hidePins = !this.hidePins), fill: "clear", color: "medium", size: "small" },
            h("ion-icon", { name: "pin", slot: "icon-only" }))))));
  }
  static get is() { return "floodteam-navigation-footer"; }
  static get originalStyleUrls() { return {
    "$": ["navigation-footer.css"]
  }; }
  static get styleUrls() { return {
    "$": ["navigation-footer.css"]
  }; }
  static get properties() { return {
    "hidePins": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "hide-pins",
      "reflect": false,
      "defaultValue": "false"
    }
  }; }
}
//# sourceMappingURL=navigation-footer.js.map