import { h } from "@stencil/core";
export class VerdocsFlag {
    constructor() {
        /**
         * The type of flag to display.
         */
        this.variant = 'fill';
        /**
         * The text label to display in the flag.
         */
        this.label = 'FILL';
        /**
         * If true, shows "or SKIP" link.
         */
        this.showSkip = false;
    }
    render() {
        return (h("div", { key: 'd7b68c88995e873d32e16f80bf8c6046d137ae1d', class: { 'verdocs-flag': true, [`variant-${this.variant}`]: true }, onClick: () => this.flagClick.emit() }, h("div", { key: '28d9f9e249265bea51e820c2ebd48c99de3d7874', class: "label" }, this.label, this.showSkip && (h("span", { key: '45ee7333ba383fb710f523749bd7f814b5c40005' }, ' or ', h("span", { key: '56ff025a695c62c39e079364e6a2c57e795b7912', class: "link", onClick: e => {
                e.stopPropagation();
                this.skip.emit();
            } }, "SKIP"))))));
    }
    static get is() { return "verdocs-flag"; }
    static get originalStyleUrls() {
        return {
            "$": ["verdocs-flag.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["verdocs-flag.css"]
        };
    }
    static get properties() {
        return {
            "variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'fill' | 'next'",
                    "resolved": "\"fill\" | \"next\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The type of flag to display."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "variant",
                "defaultValue": "'fill'"
            },
            "label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The text label to display in the flag."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "label",
                "defaultValue": "'FILL'"
            },
            "showSkip": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If true, shows \"or SKIP\" link."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-skip",
                "defaultValue": "false"
            }
        };
    }
    static get events() {
        return [{
                "method": "skip",
                "name": "skip",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the \"SKIP\" link is clicked."
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }, {
                "method": "flagClick",
                "name": "flagClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the main flag body is clicked (e.g. to focus field)."
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }];
    }
}
//# sourceMappingURL=verdocs-flag.js.map
