UNPKG

@utrecht/web-component-library-stencil

Version:

Stencil component library bundle for the Municipality of Utrecht based on the NL Design System architecture

175 lines (174 loc) 5.53 kB
/** * @license EUPL-1.2 * Copyright (c) 2020-2024 Frameless B.V. * Copyright (c) 2021-2024 Gemeente Utrecht */ import { h } from "@stencil/core"; import clsx from "clsx"; export class Checkbox { constructor() { this.disabled = false; this.readOnly = false; this.checked = false; this.value = ''; } render() { const { checked, disabled, value } = this; return (h("input", { key: '237941bf96815e3a5f4934d79c081c0771f63348', class: clsx('utrecht-checkbox'), type: "checkbox", checked: checked, disabled: disabled, value: value, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => { this.checked = evt.target.checked; this.utrechtInput.emit(evt); } })); } static get is() { return "utrecht-checkbox"; } static get encapsulation() { return "shadow"; } static get originalStyleUrls() { return { "$": ["checkbox.scss"] }; } static get styleUrls() { return { "$": ["checkbox.css"] }; } static get properties() { return { "disabled": { "type": "boolean", "mutable": false, "complexType": { "original": "boolean", "resolved": "boolean", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "disabled", "reflect": true, "defaultValue": "false" }, "readOnly": { "type": "boolean", "mutable": false, "complexType": { "original": "boolean", "resolved": "boolean", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "readonly", "reflect": true, "defaultValue": "false" }, "checked": { "type": "boolean", "mutable": false, "complexType": { "original": "boolean", "resolved": "boolean", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "checked", "reflect": false, "defaultValue": "false" }, "value": { "type": "string", "mutable": false, "complexType": { "original": "string", "resolved": "string", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "value", "reflect": false, "defaultValue": "''" } }; } static get events() { return [{ "method": "utrechtBlur", "name": "utrechtBlur", "bubbles": true, "cancelable": true, "composed": true, "docs": { "tags": [], "text": "" }, "complexType": { "original": "any", "resolved": "any", "references": {} } }, { "method": "utrechtChange", "name": "utrechtChange", "bubbles": true, "cancelable": true, "composed": true, "docs": { "tags": [], "text": "" }, "complexType": { "original": "any", "resolved": "any", "references": {} } }, { "method": "utrechtFocus", "name": "utrechtFocus", "bubbles": true, "cancelable": true, "composed": true, "docs": { "tags": [], "text": "" }, "complexType": { "original": "any", "resolved": "any", "references": {} } }, { "method": "utrechtInput", "name": "utrechtInput", "bubbles": true, "cancelable": true, "composed": true, "docs": { "tags": [], "text": "" }, "complexType": { "original": "any", "resolved": "any", "references": {} } }]; } } //# sourceMappingURL=checkbox.js.map