import { h, Host } from "@stencil/core";
const PopupContainerView = (props) => {
  const { states, callbacks } = props;
  const { styles } = states;
  return (h(Host, { class: "squatch-container" },
    h("div", { style: { padding: props.states.styles.padding }, part: "sqm-base" },
      styles.closeButton && (h("span", { part: "sqm-close-button", class: "close squatch-header-close", "data-close-panel": "#squatch-panel", onClick: () => callbacks.closePopup() }, styles.closeButtonText)),
      h("slot", null),
      styles.poweredBy ? (h("a", { class: "sqh-attribution", href: "https://impact.com/advocate/", target: "_blank" }, styles.poweredByText)) : (""))));
};
export default PopupContainerView;
