/*!
 * Custom elements for Nanopore-Digital Web applications
 */
import { Host, } from "@stencil/core";
import { h } from "../../utils/renderer";
/**
 * An item to display within [slides](/components/slides).
 *
 * @version 1.0.0
 * @status stable
 *
 * @slot - main content of the slide
 */
export class Slide {
    /**
     * Fired when the slide has loaded.
     */
    nanoSlideReady;
    /**
     * Used to to inform the parent slides components of readiness.
     * This will automatically be set to true when the slide has loaded but can be set and updated manually.
     */
    ready = null;
    readyChange(newReady, oldReady) {
        if (typeof oldReady !== 'undefined' &&
            oldReady === false &&
            newReady === true) {
            this.nanoSlideReady.emit();
        }
    }
    componentDidLoad() {
        // ready state is being loaded manually
        if (typeof this.ready === 'boolean')
            return;
        setTimeout(() => {
            this.nanoSlideReady.emit();
            this.ready = true;
        });
    }
    render() {
        return (h(Host, { key: '3de94ff45cb6dddcca7f0097f3376361c2666f7e', class: "nano-slide" }, h("slot", { key: '9998d9102bdc69eecd28752b4a2c130497b34d06' })));
    }
    static get is() { return "nano-slide"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["slide.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["slide.css"]
        };
    }
    static get properties() {
        return {
            "ready": {
                "type": "boolean",
                "attribute": "ready",
                "mutable": true,
                "complexType": {
                    "original": "boolean | null",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Used to to inform the parent slides components of readiness.\nThis will automatically be set to true when the slide has loaded but can be set and updated manually."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "defaultValue": "null"
            }
        };
    }
    static get events() {
        return [{
                "method": "nanoSlideReady",
                "name": "nanoSlideReady",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Fired when the slide has loaded."
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }];
    }
    static get watchers() {
        return [{
                "propName": "ready",
                "methodName": "readyChange"
            }];
    }
}
