import { Component, h, Host, Prop } from '@stencil/core';
import { Heading, Paragraph, Col } from '../../core';
import { PrismicResponsiveImage } from '../../web/components/prismic/PrismicResponsiveImage';
import { getAuthorsForPrismicDoc } from '../../web/utils/prismic/prismic';
import { href } from 'stencil-router-v2';
import { resourceTypeToPath } from '../../web/utils/prismic/data';
export class ResourceCard {
    constructor() {
        this.row = false;
        this.headingLevel = 4;
        this.description = true;
    }
    componentWillLoad() {
        if (!this.routing.base)
            this.routing.base = '';
        if (this.routing.includeType === undefined)
            this.routing.includeType = true;
    }
    getUrl(id) {
        const { base, includeType } = this.routing;
        const type = resourceTypeToPath(this.prismicData.type);
        if (includeType) {
            return `${base}/${type}/${id}`;
        }
        else {
            return `${base}/${id}`;
        }
    }
    render() {
        var _a, _b;
        const { title, description, type, tags, id } = this.prismicData;
        const { hero_image, content_url } = this.prismicData.doc.data;
        const authors = getAuthorsForPrismicDoc(this.prismicData.doc);
        const isLocalLink = !(content_url === null || content_url === void 0 ? void 0 : content_url.url);
        let url = this.getUrl(id);
        if (content_url === null || content_url === void 0 ? void 0 : content_url.url)
            url = content_url.url;
        return (h(Host, { class: {
                'row': this.row,
                'ui-grid': true
            } },
            h(Col, { cols: 7 }, (((_a = this.routing) === null || _a === void 0 ? void 0 : _a.router) && isLocalLink)
                ? h("a", Object.assign({ class: "image-wrapper" }, href(url, this.routing.router)),
                    h(PrismicResponsiveImage, { image: hero_image }))
                : h("a", { class: "image-wrapper", href: url, target: "_blank", rel: "noopener nofollow" },
                    h(PrismicResponsiveImage, { image: hero_image }))),
            h(Col, { class: "content", cols: 5 },
                h("div", { class: "meta" },
                    h(Heading, { class: "type | ui-theme--editorial", level: 6 }, type),
                    tags
                        ? h("resource-meta", { class: "ui-theme--editorial", tags: tags }) : ''),
                (((_b = this.routing) === null || _b === void 0 ? void 0 : _b.router) && isLocalLink)
                    ? h("a", Object.assign({}, href(url, this.routing.router)),
                        h(Heading, { class: "title | ui-theme--editorial", level: this.headingLevel }, title))
                    : h("a", { href: url, target: "_blank", rel: "noopener nofollow" },
                        h(Heading, { class: "title | ui-theme--editorial", level: this.headingLevel }, title)),
                this.description
                    ? h(Paragraph, { class: "description" }, description) : '',
                authors
                    ? h("div", { class: "author" },
                        h("resource-author-item", { author: authors[0] })) : '')));
    }
    static get is() { return "resource-card"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() { return {
        "$": ["resource-card.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["resource-card.css"]
    }; }
    static get properties() { return {
        "prismicData": {
            "type": "unknown",
            "mutable": false,
            "complexType": {
                "original": "PrismicResource",
                "resolved": "PrismicResource",
                "references": {
                    "PrismicResource": {
                        "location": "import",
                        "path": "../../web/models"
                    }
                }
            },
            "required": true,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            }
        },
        "row": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "row",
            "reflect": false,
            "defaultValue": "false"
        },
        "headingLevel": {
            "type": "number",
            "mutable": false,
            "complexType": {
                "original": "1 | 2 | 3 | 4 | 5 | 6",
                "resolved": "1 | 2 | 3 | 4 | 5 | 6",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "heading-level",
            "reflect": false,
            "defaultValue": "4"
        },
        "description": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "description",
            "reflect": false,
            "defaultValue": "true"
        },
        "routing": {
            "type": "unknown",
            "mutable": false,
            "complexType": {
                "original": "{\n    base?: string,\n    includeType?: boolean,\n    router?: Router \n  }",
                "resolved": "{ base?: string; includeType?: boolean; router?: Router; }",
                "references": {
                    "Router": {
                        "location": "import",
                        "path": "stencil-router-v2"
                    }
                }
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            }
        }
    }; }
}
