import { h, Host } from "@stencil/core";
const LIGHT_STYLE = { border: '3px solid rgba(255, 255, 255, 0.3)', borderTopColor: '#fff' };
const DARK_STYLE = { border: '3px solid rgba(0, 0, 0, 0.3)', borderTopColor: '#333' };
/**
 * Display a small loading spinner.
 *
 * ```ts
 * <verdocs-spinner />
 * ```
 */
export class VerdocsQuickFilter {
    constructor() {
        this.size = 32;
        this.mode = 'light';
    }
    render() {
        return (h(Host, { key: 'b3a716bc8b5c1d1263f57ef415615f5590563808', style: {
                width: `${this.size}px`, //
                height: `${this.size}px`,
                flex: `0 0 ${this.size}px`,
                ...(this.mode === 'light' ? LIGHT_STYLE : DARK_STYLE),
            } }));
    }
    static get is() { return "verdocs-spinner"; }
    static get originalStyleUrls() {
        return {
            "$": ["verdocs-spinner.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["verdocs-spinner.css"]
        };
    }
    static get properties() {
        return {
            "size": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size",
                "defaultValue": "32"
            },
            "mode": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'light' | 'dark'",
                    "resolved": "\"dark\" | \"light\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "mode",
                "defaultValue": "'light'"
            }
        };
    }
}
//# sourceMappingURL=verdocs-spinner.js.map
