import { Component, h, Host, State } from "@stencil/core";
import { withHooks } from "@saasquatch/stencil-hooks";
import { useProgramMenu } from "./useProgramMenu";
import { getProps } from "../../utils/utils";
/**
 * @uiName Microsite Program Menu
 * @validParents ["sqm-portal-container","div","sqm-divided-layout","sqm-brand","template"]
 * @slots [{"name":"","title":"Menu Content"}]
 * @canvasRenderer always-replace
 */
export class ProgramMenu {
  constructor() {
    this.ignored = true;
    withHooks(this);
  }
  disconnectedCallback() { }
  render() {
    const { data, ref } = useProgramMenu(getProps(this));
    return (h(Host, { style: { display: "contents" } },
      h("sl-select", { style: { paddingBottom: "var(--sl-spacing-large)" }, value: data.programId, ref: (r) => (ref.current = r) },
        h("slot", null))));
  }
  static get is() { return "sqm-program-menu"; }
  static get states() { return {
    "ignored": {}
  }; }
}
