UNPKG

ngx-slice-kit

Version:

[![npm version](https://badge.fury.io/js/ngx-slice-kit.svg)](https://badge.fury.io/js/ngx-slice-kit)

47 lines 5.83 kB
import { Component, EventEmitter, Input, Output } from '@angular/core'; import * as i0 from "@angular/core"; export class ProgressComponent { constructor() { this.val = 0; this.small = false; this.max = 100; this.min = 0; this.progressEnd = new EventEmitter(); } set value(val) { if (val > this.max) { this.val = 100; } else if (val < this.min) { this.val = 0; } else { this.val = Math.round(100 / (this.max / val)); } if (this.val === 100) { setTimeout(() => { this.progressEnd.emit(); }, 400); } } get value() { return this.val; } } ProgressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); ProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ProgressComponent, selector: "sdk-progress", inputs: { small: "small", max: "max", min: "min", value: "value" }, outputs: { progressEnd: "progressEnd" }, ngImport: i0, template: "<div class=\"sdk-progressbar progressbar\" [class.progressbar--small]=\"small\">\n <div class=\"progressbar__fill\" [style.width.%]=\"val\"></div>\n</div>\n", styles: [".progressbar{width:100%;height:32px;background-color:var(--background-a90);border-radius:3px}.progressbar .progressbar__fill{transition:all .4s;height:100%;background-color:var(--primary);border-radius:3px}.progressbar--small{height:8px}\n"] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ProgressComponent, decorators: [{ type: Component, args: [{ selector: 'sdk-progress', template: "<div class=\"sdk-progressbar progressbar\" [class.progressbar--small]=\"small\">\n <div class=\"progressbar__fill\" [style.width.%]=\"val\"></div>\n</div>\n", styles: [".progressbar{width:100%;height:32px;background-color:var(--background-a90);border-radius:3px}.progressbar .progressbar__fill{transition:all .4s;height:100%;background-color:var(--primary);border-radius:3px}.progressbar--small{height:8px}\n"] }] }], ctorParameters: function () { return []; }, propDecorators: { small: [{ type: Input }], max: [{ type: Input }], min: [{ type: Input }], value: [{ type: Input }], progressEnd: [{ type: Output }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZ3Jlc3MuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9uZ3gtc2xpY2Uta2l0L3NyYy9saWIvbGF5b3V0L3Byb2dyZXNzL3Byb2dyZXNzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvbmd4LXNsaWNlLWtpdC9zcmMvbGliL2xheW91dC9wcm9ncmVzcy9wcm9ncmVzcy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU92RSxNQUFNLE9BQU8saUJBQWlCO0lBNkIxQjtRQTNCTyxRQUFHLEdBQVcsQ0FBQyxDQUFDO1FBQ1AsVUFBSyxHQUFZLEtBQUssQ0FBQztRQUN2QixRQUFHLEdBQVcsR0FBRyxDQUFDO1FBQ2xCLFFBQUcsR0FBVyxDQUFDLENBQUM7UUFzQmYsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO0lBR2xELENBQUM7SUF2QkQsSUFBb0IsS0FBSyxDQUFDLEdBQUc7UUFDekIsSUFBSSxHQUFHLEdBQUcsSUFBSSxDQUFDLEdBQUcsRUFBRTtZQUNoQixJQUFJLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQztTQUNsQjthQUFNLElBQUksR0FBRyxHQUFHLElBQUksQ0FBQyxHQUFHLEVBQUU7WUFDdkIsSUFBSSxDQUFDLEdBQUcsR0FBRyxDQUFDLENBQUM7U0FDaEI7YUFBTTtZQUNILElBQUksQ0FBQyxHQUFHLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxHQUFHLEdBQUcsQ0FBQyxJQUFJLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQyxDQUFDLENBQUM7U0FDakQ7UUFFRCxJQUFJLElBQUksQ0FBQyxHQUFHLEtBQUssR0FBRyxFQUFFO1lBQ2xCLFVBQVUsQ0FBQyxHQUFHLEVBQUU7Z0JBQ1osSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLEVBQUUsQ0FBQztZQUM1QixDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7U0FDWDtJQUNMLENBQUM7SUFFRCxJQUFXLEtBQUs7UUFDWixPQUFPLElBQUksQ0FBQyxHQUFHLENBQUM7SUFDcEIsQ0FBQzs7OEdBekJRLGlCQUFpQjtrR0FBakIsaUJBQWlCLGlLQ1A5QixpS0FHQTsyRkRJYSxpQkFBaUI7a0JBTDdCLFNBQVM7K0JBQ0ksY0FBYzswRUFPUixLQUFLO3NCQUFwQixLQUFLO2dCQUNVLEdBQUc7c0JBQWxCLEtBQUs7Z0JBQ1UsR0FBRztzQkFBbEIsS0FBSztnQkFFYyxLQUFLO3NCQUF4QixLQUFLO2dCQW9CVyxXQUFXO3NCQUEzQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdzZGstcHJvZ3Jlc3MnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9ncmVzcy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vcHJvZ3Jlc3MuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBQcm9ncmVzc0NvbXBvbmVudCB7XG5cbiAgICBwdWJsaWMgdmFsOiBudW1iZXIgPSAwO1xuICAgIEBJbnB1dCgpIHB1YmxpYyBzbWFsbDogYm9vbGVhbiA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIHB1YmxpYyBtYXg6IG51bWJlciA9IDEwMDtcbiAgICBASW5wdXQoKSBwdWJsaWMgbWluOiBudW1iZXIgPSAwO1xuXG4gICAgQElucHV0KCkgcHVibGljIHNldCB2YWx1ZSh2YWwpIHtcbiAgICAgICAgaWYgKHZhbCA+IHRoaXMubWF4KSB7XG4gICAgICAgICAgICB0aGlzLnZhbCA9IDEwMDtcbiAgICAgICAgfSBlbHNlIGlmICh2YWwgPCB0aGlzLm1pbikge1xuICAgICAgICAgICAgdGhpcy52YWwgPSAwO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgdGhpcy52YWwgPSBNYXRoLnJvdW5kKDEwMCAvICh0aGlzLm1heCAvIHZhbCkpO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKHRoaXMudmFsID09PSAxMDApIHtcbiAgICAgICAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgICAgICAgIHRoaXMucHJvZ3Jlc3NFbmQuZW1pdCgpO1xuICAgICAgICAgICAgfSwgNDAwKTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIHB1YmxpYyBnZXQgdmFsdWUoKTogbnVtYmVyIHtcbiAgICAgICAgcmV0dXJuIHRoaXMudmFsO1xuICAgIH1cblxuICAgIEBPdXRwdXQoKSBwdWJsaWMgcHJvZ3Jlc3NFbmQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgICBjb25zdHJ1Y3RvcigpIHtcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwic2RrLXByb2dyZXNzYmFyIHByb2dyZXNzYmFyXCIgW2NsYXNzLnByb2dyZXNzYmFyLS1zbWFsbF09XCJzbWFsbFwiPlxuICAgIDxkaXYgY2xhc3M9XCJwcm9ncmVzc2Jhcl9fZmlsbFwiIFtzdHlsZS53aWR0aC4lXT1cInZhbFwiPjwvZGl2PlxuPC9kaXY+XG4iXX0=