ryan/squoosh
1
0
Fork 0
forked from external-repos/squoosh
Code Pull Requests Activity

Fix .disabled property reflection for range-input (only attribute worked previously)

Browse Source
This commit is contained in:
Jason Miller
2018-10-12 13:16:40 +00:00
parent a43ea761f5
commit f5964635b2
1 changed files with 14 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/custom-els/RangeInput/index.ts
View File

@@ -3,8 +3,8 @@ import './styles.css';
const RETARGETED_EVENTS = ['focus', 'blur']; const RETARGETED_EVENTS = ['focus', 'blur'];
const UPDATE_EVENTS = ['input', 'change']; const UPDATE_EVENTS = ['input', 'change'];
const REFLECTED_PROPERTIES = ['name', 'min', 'max', 'step', 'value', 'disabled']; const REFLECTED_PROPERTIES = ['name', 'min', 'max', 'step', 'value'];
const REFLECTED_ATTRIBUTES = ['name', 'min', 'max', 'step', 'value', 'disabled']; const REFLECTED_ATTRIBUTES = ['name', 'min', 'max', 'step', 'value'];
class RangeInputElement extends HTMLElement { class RangeInputElement extends HTMLElement {
private _input = document.createElement('input'); private _input = document.createElement('input');
@@ -37,6 +37,18 @@ class RangeInputElement extends HTMLElement {
this.setAttribute('label-precision', precision); this.setAttribute('label-precision', precision);
} }
get disabled(): boolean {
return this.hasAttribute('disabled');
}
set disabled(disabled: boolean) {
if (disabled) {
this.setAttribute('disabled', '');
} else {
this.removeAttribute('disabled');
}
}
connectedCallback() { connectedCallback() {
if (this._input.parentNode !== this) { if (this._input.parentNode !== this) {
this.appendChild(this._input); this.appendChild(this._input);