/*!
 * Crafted with ❤ by Salla
 */
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';

const sallaLoyaltyProgramCss = "";

const SallaLoyaltyHero = /*@__PURE__*/ proxyCustomElement(class SallaLoyaltyHero extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
    }
    render() {
        return (h(Host, { key: '71421d1a559f9d0b8b9a2023e3015847dd4be7fb' }, h("section", { key: '914ae35d2e038a4f0f358eb3d61352cf263f4c7b', class: "s-loyalty-program-hero-container" }, h("div", { key: '93353d9f4dcc7d41e4c714f93ee84899b799633e', class: "s-loyalty-program-hero-background", style: {
                backgroundImage: `url(${this.image})`,
            } }, this.image ? h("div", { class: "s-loyalty-program-hero-overlay" }) : '', h("div", { key: '6f62cb4aadbb81f91549b60177f15e8791e6aa51', class: {
                's-loyalty-program-hero-content': true,
                's-loyalty-program-hero-white': !!this.image,
                's-loyalty-program-hero-gray': !this.image,
            } }, h("div", { key: '11794269898ee42023cac29e49c17463fe90781b' }, h("h1", { key: '95435290b38fce9dbc6a580d8452e7189074773b', class: "s-loyalty-program-hero-title" }, this.name || h("span", { key: '02fbbae525a5973d65bb98626dbe5712374495c4', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "name")), h("p", { key: 'e482ab6a067d54b9c274208a43b286e07a8e471c', class: "s-loyalty-program-hero-description" }, this.description || h("span", { key: '2fc2ea5a732e473b2c26d3b885a699b57f7df0c1', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "description"))), h("slot", { key: 'd548c168c97849abd583b510c7b1d6c4370daa1c', name: "action" }))), h("div", { key: '2423ee04e5e126eabcbfec20ad6c82a8d2593d2a', class: "s-loyalty-program-hero-footer" }, h("div", { key: '25ee4e74c9ea3c0ea420a09858c45b83b454bd40', class: "s-loyalty-program-hero-slot-container" }, h("slot", { key: '11a7147bc142914ccfa08b099826a4a2805100aa', name: "crosspoint" }))))));
    }
    static get style() { return sallaLoyaltyProgramCss; }
}, [4, "salla-loyalty-hero", {
        "image": [1],
        "name": [1],
        "description": [1]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["salla-loyalty-hero"];
    components.forEach(tagName => { switch (tagName) {
        case "salla-loyalty-hero":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, SallaLoyaltyHero);
            }
            break;
    } });
}
defineCustomElement();

export { SallaLoyaltyHero as S, defineCustomElement as d };
