import { h } from "@stencil/core";
import { MediaFigureAlignment } from "./media-figure-alignment.enum";
/**
 * @slot default - Ska vara en bild (eller bildlik) komponent. Helst en `digi-media-image`.
 *
 * @enums MediaFigureAlignment - media-figure-alignment.enum.ts
 * @swedishName Mediefigur
 */
export class MediaFigure {
    constructor() {
        this.afFigcaption = undefined;
        this.afAlignment = MediaFigureAlignment.START;
    }
    get cssModifiers() {
        return {
            'digi-media-figure--align-start': this.afAlignment === 'start',
            'digi-media-figure--align-center': this.afAlignment === 'center',
            'digi-media-figure--align-end': this.afAlignment === 'end'
        };
    }
    render() {
        return (h("figure", { key: 'bf78c6b502bb19c42ab7d0a43156b64123cfa621', class: Object.assign({ 'digi-media-figure': true }, this.cssModifiers) }, h("div", { key: '5a885741daa877fd551c8cca7232e5e3e48bb358', class: "digi-media-figure__image" }, h("slot", { key: 'd33842527ecacf6305cc310a832ac83a8e766f99' })), this.afFigcaption && (h("figcaption", { key: '6c996e27377c768d1671c63bb2cd08123e25526c', class: "digi-media-figure__figcaption" }, this.afFigcaption))));
    }
    static get is() { return "digi-media-figure"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["media-figure.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["media-figure.css"]
        };
    }
    static get properties() {
        return {
            "afFigcaption": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Adds an optional figcaption element"
                        }],
                    "text": "L\u00E4gger till ett valfritt figcaptionelement"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-figcaption",
                "reflect": false
            },
            "afAlignment": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "MediaFigureAlignment",
                    "resolved": "MediaFigureAlignment.CENTER | MediaFigureAlignment.END | MediaFigureAlignment.START",
                    "references": {
                        "MediaFigureAlignment": {
                            "location": "import",
                            "path": "./media-figure-alignment.enum",
                            "id": "src/components/_media/media-figure/media-figure-alignment.enum.ts::MediaFigureAlignment"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Alignment of image and caption. Value can be 'start', 'center' or 'end'."
                        }],
                    "text": "Justering av bild och text. Kan vara 'start', 'center' eller 'end'"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-alignment",
                "reflect": false,
                "defaultValue": "MediaFigureAlignment.START"
            }
        };
    }
}
