fix(progress): progress buffer defaults to negative.

This commit is contained in:
Luke Vo 2023-12-27 16:26:06 -06:00
parent 9973b90981
commit 8fa444c986

View File

@ -16,8 +16,9 @@ import {Progress} from './progress.js';
export class LinearProgress extends Progress {
/**
* Buffer amount to display, a fraction between 0 and `max`.
* If negative, the buffer is not displayed.
*/
@property({type: Number}) buffer = 1;
@property({type: Number}) buffer = -1;
// Note, the indeterminate animation is rendered with transform %'s
// Previously, this was optimized to use px calculated with the resizeObserver
@ -30,14 +31,14 @@ export class LinearProgress extends Progress {
};
const dotStyles = {
transform: `scaleX(${
(this.indeterminate ? 1 : this.buffer / this.max) * 100
(this.indeterminate || this.buffer < 0 ? 1 : this.buffer / this.max) * 100
}%)`,
};
// Only display dots when visible - this prevents invisible infinite
// animation.
const hideDots =
this.indeterminate || this.buffer >= this.max || this.value >= this.max;
this.indeterminate || this.buffer < 0 || this.buffer >= this.max || this.value >= this.max;
return html`
<div class="dots" ?hidden=${hideDots}></div>
<div class="inactive-track" style=${styleMap(dotStyles)}></div>