import { Host, h } from "@stencil/core";
export class PdsImage {
    constructor() {
        this.alt = '';
        this.componentId = undefined;
        this.height = undefined;
        this.loading = 'eager';
        this.sizes = undefined;
        this.src = undefined;
        this.srcset = undefined;
        this.width = undefined;
    }
    render() {
        return (h(Host, { key: '8d97b63e1c5b0eb72117d6378a0b6d869c0dbdea', class: {
                'pds-image': true,
            }, id: this.componentId }, h("img", { key: '3cc2d1c185244c8e8de2f7258b85194b37a4ff38', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
    }
    static get is() { return "pds-image"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-image.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-image.css"]
        };
    }
    static get properties() {
        return {
            "alt": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The image's alt tag. If none is provided,\nit will default to an empty string."
                },
                "attribute": "alt",
                "reflect": false,
                "defaultValue": "''"
            },
            "componentId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "A unique identifier used for the underlying component `id` attribute."
                },
                "attribute": "component-id",
                "reflect": false
            },
            "height": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The height of the image in pixels. Setting this will\ndevote space in the layout to prevent layout\nshifts when the image is loaded."
                },
                "attribute": "height",
                "reflect": false
            },
            "loading": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'eager' | 'lazy'",
                    "resolved": "\"eager\" | \"lazy\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Indicates how the browser should load the image."
                },
                "attribute": "loading",
                "reflect": false,
                "defaultValue": "'eager'"
            },
            "sizes": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Determines the intended display size of an image\nwithin certian breakpoints. Has no effect if `srcset`\nis not set or value has no width descriptor."
                },
                "attribute": "sizes",
                "reflect": false
            },
            "src": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The image's source."
                },
                "attribute": "src",
                "reflect": false
            },
            "srcset": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "A set of image sources for the browser to use."
                },
                "attribute": "srcset",
                "reflect": false
            },
            "width": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The width of the image in pixels. Setting this will\ndevote space in the layout to prevent layout\nshifts when the image is loaded."
                },
                "attribute": "width",
                "reflect": false
            }
        };
    }
}
//# sourceMappingURL=pds-image.js.map
