import { h } from "@stencil/core";
export class Filter {
    onControlLoaded(e) {
        e.stopPropagation();
        this.anjFilterDidLoad.emit(e.target);
    }
    onChange({ detail }) {
        this.anjFilter.emit(detail);
    }
    render() {
        return (h("anj-form-group", null,
            h("anj-input", { placeholder: this.placeholder, clearable: true, debounce: 300 },
                h("anj-input-prefix", null,
                    h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" },
                        h("path", { d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" }))))));
    }
    static get is() { return "anj-filter"; }
    static get originalStyleUrls() { return {
        "$": ["filter.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["filter.css"]
    }; }
    static get properties() { return {
        "name": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "string",
                "resolved": "string",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "The name for the input"
            },
            "attribute": "name",
            "reflect": false
        },
        "placeholder": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "string",
                "resolved": "string",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Value of the input placeholder"
            },
            "attribute": "placeholder",
            "reflect": false
        }
    }; }
    static get events() { return [{
            "method": "anjFilterDidLoad",
            "name": "anjFilterDidLoad",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Emitted when the selector has been created."
            },
            "complexType": {
                "original": "HTMLAnjInputElement",
                "resolved": "HTMLAnjInputElement",
                "references": {
                    "HTMLAnjInputElement": {
                        "location": "global"
                    }
                }
            }
        }, {
            "method": "anjFilter",
            "name": "anjFilter",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Proxies the input's anjChange event so that if you have a filter in a see of forms, life doesn't suck so much."
            },
            "complexType": {
                "original": "InputChangeEvent",
                "resolved": "InputChangeEvent",
                "references": {
                    "InputChangeEvent": {
                        "location": "import",
                        "path": "../../types/types"
                    }
                }
            }
        }]; }
    static get listeners() { return [{
            "name": "anjControlDidLoad",
            "method": "onControlLoaded",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjChange",
            "method": "onChange",
            "target": undefined,
            "capture": false,
            "passive": false
        }]; }
}
