import { Host, h } from "@stencil/core";
export class PdsImage {
    constructor() {
        /**
         * The image's alt tag. If none is provided,
         * it will default to an empty string, which is desired for
         * decorative images.
         * @defaultValue ''
         */
        this.alt = '';
        /**
         * Indicates how the browser should load the image.
         * @defaultValue eager
         */
        this.loading = 'eager';
    }
    render() {
        return (h(Host, { key: 'fa205f03d5c378d27a66cbfd520ae2bc7ab9e9df', class: {
                'pds-image': true,
            }, id: this.componentId }, h("img", { key: '8d03dddf6e924ef8aebea2bf34a32e326bee329a', 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": [{
                            "name": "defaultValue",
                            "text": "''"
                        }],
                    "text": "The image's alt tag. If none is provided,\nit will default to an empty string, which is desired for\ndecorative images."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "alt",
                "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."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "component-id"
            },
            "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."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "height"
            },
            "loading": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'eager' | 'lazy'",
                    "resolved": "\"eager\" | \"lazy\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "eager"
                        }],
                    "text": "Indicates how the browser should load the image."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "loading",
                "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 certain breakpoints. Has no effect if `srcset`\nis not set or value has no width descriptor."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "sizes"
            },
            "src": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The image's source."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "src"
            },
            "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\nfor responsiveness."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "srcset"
            },
            "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."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "width"
            }
        };
    }
}
//# sourceMappingURL=pds-image.js.map
