kopia lustrzana https://github.com/shoelace-style/shoelace
fix watch handlers
rodzic
0489d8b5c0
commit
0234fe81d5
|
@ -10,6 +10,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
|
||||||
|
|
||||||
- Fixed a bug where the active tab indicator wouldn't render properly on tabs styled with `flex-end` [#355](https://github.com/shoelace-style/shoelace/issues/355)
|
- Fixed a bug where the active tab indicator wouldn't render properly on tabs styled with `flex-end` [#355](https://github.com/shoelace-style/shoelace/issues/355)
|
||||||
- Fixed a bug where `sl-change` wasn't emitted by `sl-checkbox` or `sl-switch` [#370](https://github.com/shoelace-style/shoelace/issues/370)
|
- Fixed a bug where `sl-change` wasn't emitted by `sl-checkbox` or `sl-switch` [#370](https://github.com/shoelace-style/shoelace/issues/370)
|
||||||
|
- Fixed a bug where some props weren't being watched correctly in `sl-alert` and `sl-color-picker`
|
||||||
- Improved `@watch` decorator so watch handlers don't run before the first render
|
- Improved `@watch` decorator so watch handlers don't run before the first render
|
||||||
- Removed guards that were added due to previous watch handler behavior
|
- Removed guards that were added due to previous watch handler behavior
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { LitElement, html, internalProperty, property, unsafeCSS } from 'lit-element';
|
import { LitElement, html, internalProperty, property, unsafeCSS } from 'lit-element';
|
||||||
import { classMap } from 'lit-html/directives/class-map';
|
import { classMap } from 'lit-html/directives/class-map';
|
||||||
import { event, EventEmitter, tag } from '../../internal/decorators';
|
import { event, EventEmitter, tag, watch } from '../../internal/decorators';
|
||||||
import styles from 'sass:./alert.scss';
|
import styles from 'sass:./alert.scss';
|
||||||
|
|
||||||
const toastStack = Object.assign(document.createElement('div'), { className: 'sl-toast-stack' });
|
const toastStack = Object.assign(document.createElement('div'), { className: 'sl-toast-stack' });
|
||||||
|
@ -157,11 +157,13 @@ export default class SlAlert extends LitElement {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
openChanged() {
|
@watch('open')
|
||||||
|
handleOpenChange() {
|
||||||
this.open ? this.show() : this.hide();
|
this.open ? this.show() : this.hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
durationChanged() {
|
@watch('duration')
|
||||||
|
handleDurationChange() {
|
||||||
this.restartAutoHide();
|
this.restartAutoHide();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { LitElement, html, internalProperty, property, query, unsafeCSS } from 'lit-element';
|
import { LitElement, html, internalProperty, property, query, unsafeCSS } from 'lit-element';
|
||||||
import { classMap } from 'lit-html/directives/class-map';
|
import { classMap } from 'lit-html/directives/class-map';
|
||||||
import { styleMap } from 'lit-html/directives/style-map';
|
import { styleMap } from 'lit-html/directives/style-map';
|
||||||
import { event, EventEmitter, tag } from '../../internal/decorators';
|
import { event, EventEmitter, tag, watch } from '../../internal/decorators';
|
||||||
import styles from 'sass:./color-picker.scss';
|
import styles from 'sass:./color-picker.scss';
|
||||||
import { SlDropdown, SlInput } from '../../shoelace';
|
import { SlDropdown, SlInput } from '../../shoelace';
|
||||||
import color from 'color';
|
import color from 'color';
|
||||||
|
@ -579,15 +579,18 @@ export default class SlColorPicker extends LitElement {
|
||||||
this.bypassValueParse = false;
|
this.bypassValueParse = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
formatChanged() {
|
@watch('format')
|
||||||
|
handleFormatChange() {
|
||||||
this.syncValues();
|
this.syncValues();
|
||||||
}
|
}
|
||||||
|
|
||||||
opacityChanged() {
|
@watch('opacity')
|
||||||
|
handleOpacityChange() {
|
||||||
this.alpha = 100;
|
this.alpha = 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
valueChanged(newValue: string, oldValue: string) {
|
@watch('value')
|
||||||
|
handleValueChange(newValue: string, oldValue: string) {
|
||||||
if (!this.bypassValueParse) {
|
if (!this.bypassValueParse) {
|
||||||
const newColor = this.parseColor(newValue);
|
const newColor = this.parseColor(newValue);
|
||||||
|
|
||||||
|
|
|
@ -108,7 +108,7 @@ export default class SlSwitch extends LitElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
@watch('checked')
|
@watch('checked')
|
||||||
checkedChanged() {
|
handleCheckedChange() {
|
||||||
if (this.input) {
|
if (this.input) {
|
||||||
this.input.checked = this.checked;
|
this.input.checked = this.checked;
|
||||||
this.slChange.emit();
|
this.slChange.emit();
|
||||||
|
|
Ładowanie…
Reference in New Issue