import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { d as defineCustomElement$3 } from './ecl-icon2.js';
import { d as defineCustomElement$2 } from './ecl-picture2.js';

const EclGalleryItem$1 = /*@__PURE__*/ proxyCustomElement(class EclGalleryItem extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.styleClass = '';
        this.theme = 'ec';
        this.imageAlt = undefined;
        this.mediaHref = undefined;
        this.mediaIframeHref = undefined;
        this.mediaSharePath = undefined;
        this.meta = undefined;
        this.type = 'image';
        this.icon = undefined;
    }
    getClass() {
        return [
            `ecl-gallery__item`,
            `sc-ecl-gallery-${this.theme}`,
            this.styleClass
        ].join(' ');
    }
    getLinkAttr() {
        const attrs = {
            'data-ecl-gallery-item': ''
        };
        if (this.mediaSharePath) {
            attrs['data-ecl-gallery-item-share'] = this.mediaSharePath;
        }
        if (this.mediaIframeHref) {
            attrs['data-ecl-gallery-item-embed-src'] = this.mediaIframeHref;
        }
        return attrs;
    }
    render() {
        return (h("li", { class: this.getClass() }, h("a", Object.assign({ href: this.mediaIframeHref ? this.mediaIframeHref : this.mediaHref, class: `ecl-gallery__item-link sc-ecl-gallery-${this.theme}` }, this.getLinkAttr()), h("figure", { class: `ecl-gallery__image-container sc-ecl-gallery-${this.theme}` }, h("slot", { name: "video" }), this.type !== 'html-video' ?
            h("ecl-picture", { image: this.mediaHref, "image-alt": this.imageAlt, styleClass: `ecl-gallery__picture sc-ecl-gallery-${this.theme}`, "img-class": `ecl-gallery__image sc-ecl-gallery-${this.theme}` }, h("slot", { name: "sources" })) : '', this.type !== 'image' ?
            h("div", { class: `ecl-gallery__item-icon-wrapper sc-ecl-gallery-${this.theme}` }, h("ecl-icon", { "style-class": `ecl-gallery__item-icon sc-ecl-gallery-${this.theme}`, icon: "play-filled", size: "l", color: "inverted" })) : '', h("figcaption", { class: `ecl-gallery__description sc-ecl-gallery-${this.theme}`, "data-ecl-gallery-description": true }, this.icon ?
            h("ecl-icon", { icon: this.icon, styleClass: "ecl-gallery__description-icon", size: "s" }) : '', h("slot", null), h("span", { class: `ecl-gallery__meta sc-ecl-gallery-${this.theme}`, "data-ecl-gallery-meta": true }, this.meta))))));
    }
}, [4, "ecl-gallery-item", {
        "styleClass": [1, "style-class"],
        "theme": [1],
        "imageAlt": [1, "image-alt"],
        "mediaHref": [1, "media-href"],
        "mediaIframeHref": [1, "media-iframe-href"],
        "mediaSharePath": [1, "media-share-path"],
        "meta": [1],
        "type": [1],
        "icon": [1]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["ecl-gallery-item", "ecl-icon", "ecl-picture"];
    components.forEach(tagName => { switch (tagName) {
        case "ecl-gallery-item":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, EclGalleryItem$1);
            }
            break;
        case "ecl-icon":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "ecl-picture":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}

const EclGalleryItem = EclGalleryItem$1;
const defineCustomElement = defineCustomElement$1;

export { EclGalleryItem, defineCustomElement };

//# sourceMappingURL=ecl-gallery-item.js.map