suis 1.1.0 → 1.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (7) hide show
  1. package/esm2022/lib/components/suis-progress-bar/suis-progress-bar.component.mjs +13 -23
  2. package/esm2022/lib/components/suis-progress-bar/suis-progress-bar.pipe.mjs +5 -3
  3. package/fesm2022/suis.mjs +16 -24
  4. package/fesm2022/suis.mjs.map +1 -1
  5. package/lib/components/suis-progress-bar/suis-progress-bar.component.d.ts +7 -7
  6. package/lib/components/suis-progress-bar/suis-progress-bar.pipe.d.ts +1 -1
  7. package/package.json +1 -1
package/esm2022/lib/components/suis-progress-bar/suis-progress-bar.component.mjs CHANGED
@@ -5,8 +5,14 @@ import { SuisNgClassPipe } from '../../pipes';
5
5
  import * as i0 from "@angular/core";
6
6
  export class SuisProgressBarComponent {
7
7
  constructor() {
8
- /** @internal */
9
- this._value = 0;
8
+ /**
9
+ * The value corresponding to the progress bar. By default set to 0.
10
+ */
11
+ this.value = 0;
12
+ /**
13
+ * Maximum value of the progress bar. By default set to 100.
14
+ */
15
+ this.maxValue = 100;
10
16
  /**
11
17
  * Sets the color of the progress bar. Type of SuisColor. By default set to 'primary'.
12
18
  */
@@ -20,32 +26,16 @@ export class SuisProgressBarComponent {
20
26
  */
21
27
  this.size = 'md';
22
28
  }
23
- /** @internal */
24
- get value() {
25
- return this._value;
26
- }
27
- /**
28
- * Width of the progress bar in percentage (value >= 0 && value <= 100). By default set to 0.
29
- */
30
- set value(value) {
31
- if (value >= 0 && value <= 100) {
32
- this._value = value;
33
- }
34
- else if (value > 100) {
35
- this._value = 100;
36
- }
37
- else {
38
- this._value = 0;
39
- }
40
- }
41
29
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
42
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SuisProgressBarComponent, isStandalone: true, selector: "suis-progress-bar", inputs: { value: "value", color: "color", backgroundColor: "backgroundColor", size: "size" }, ngImport: i0, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "pipe", type: SuisProgressBarPipe, name: "suisProgressBar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
30
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SuisProgressBarComponent, isStandalone: true, selector: "suis-progress-bar", inputs: { value: "value", maxValue: "maxValue", color: "color", backgroundColor: "backgroundColor", size: "size" }, ngImport: i0, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar : maxValue }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "pipe", type: SuisProgressBarPipe, name: "suisProgressBar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
43
31
  }
44
32
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarComponent, decorators: [{
45
33
  type: Component,
46
- args: [{ selector: 'suis-progress-bar', standalone: true, imports: [NgClass, SuisNgClassPipe, SuisProgressBarPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"] }]
34
+ args: [{ selector: 'suis-progress-bar', standalone: true, imports: [NgClass, SuisNgClassPipe, SuisProgressBarPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar : maxValue }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"] }]
47
35
  }], propDecorators: { value: [{
48
36
  type: Input
37
+ }], maxValue: [{
38
+ type: Input
49
39
  }], color: [{
50
40
  type: Input
51
41
  }], backgroundColor: [{
@@ -53,4 +43,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
53
43
  }], size: [{
54
44
  type: Input
55
45
  }] } });
56
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1wcm9ncmVzcy1iYXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLXByb2dyZXNzLWJhci9zdWlzLXByb2dyZXNzLWJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtcHJvZ3Jlc3MtYmFyL3N1aXMtcHJvZ3Jlc3MtYmFyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMxQyxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUUvRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sYUFBYSxDQUFDOztBQVU5QyxNQUFNLE9BQU8sd0JBQXdCO0lBUnJDO1FBU0UsZ0JBQWdCO1FBQ2hCLFdBQU0sR0FBVyxDQUFDLENBQUM7UUFvQm5COztXQUVHO1FBQ00sVUFBSyxHQUFjLFNBQVMsQ0FBQztRQUV0Qzs7V0FFRztRQUNNLG9CQUFlLEdBQWMsVUFBVSxDQUFDO1FBRWpEOztXQUVHO1FBQ00sU0FBSSxHQUFhLElBQUksQ0FBQztLQUNoQztJQWhDQyxnQkFBZ0I7SUFDaEIsSUFBSSxLQUFLO1FBQ1AsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO0lBQ3JCLENBQUM7SUFFRDs7T0FFRztJQUNILElBQWEsS0FBSyxDQUFDLEtBQWE7UUFDOUIsSUFBSSxLQUFLLElBQUksQ0FBQyxJQUFJLEtBQUssSUFBSSxHQUFHLEVBQUU7WUFDOUIsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7U0FDckI7YUFBTSxJQUFJLEtBQUssR0FBRyxHQUFHLEVBQUU7WUFDdEIsSUFBSSxDQUFDLE1BQU0sR0FBRyxHQUFHLENBQUM7U0FDbkI7YUFBTTtZQUNMLElBQUksQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDO1NBQ2pCO0lBQ0gsQ0FBQzsrR0FwQlUsd0JBQXdCO21HQUF4Qix3QkFBd0IsMktDZHJDLDhUQVVBLHFnREREWSxPQUFPLCtFQUFFLGVBQWUsK0NBQUUsbUJBQW1COzs0RkFLNUMsd0JBQXdCO2tCQVJwQyxTQUFTOytCQUNFLG1CQUFtQixjQUNqQixJQUFJLFdBQ1AsQ0FBQyxPQUFPLEVBQUUsZUFBZSxFQUFFLG1CQUFtQixDQUFDLG1CQUd2Qyx1QkFBdUIsQ0FBQyxNQUFNOzhCQWNsQyxLQUFLO3NCQUFqQixLQUFLO2dCQWFHLEtBQUs7c0JBQWIsS0FBSztnQkFLRyxlQUFlO3NCQUF2QixLQUFLO2dCQUtHLElBQUk7c0JBQVosS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOZ0NsYXNzIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFN1aXNQcm9ncmVzc0JhclBpcGUgfSBmcm9tICcuL3N1aXMtcHJvZ3Jlc3MtYmFyLnBpcGUnO1xuaW1wb3J0IHsgU3Vpc0NvbG9yLCBTdWlzU2l6ZSB9IGZyb20gJy4uLy4uL3R5cGVzJztcbmltcG9ydCB7IFN1aXNOZ0NsYXNzUGlwZSB9IGZyb20gJy4uLy4uL3BpcGVzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3Vpcy1wcm9ncmVzcy1iYXInLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTmdDbGFzcywgU3Vpc05nQ2xhc3NQaXBlLCBTdWlzUHJvZ3Jlc3NCYXJQaXBlXSxcbiAgdGVtcGxhdGVVcmw6ICcuL3N1aXMtcHJvZ3Jlc3MtYmFyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc3Vpcy1wcm9ncmVzcy1iYXIuY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFN1aXNQcm9ncmVzc0JhckNvbXBvbmVudCB7XG4gIC8qKiBAaW50ZXJuYWwgKi9cbiAgX3ZhbHVlOiBudW1iZXIgPSAwO1xuXG4gIC8qKiBAaW50ZXJuYWwgKi9cbiAgZ2V0IHZhbHVlKCk6IG51bWJlciB7XG4gICAgcmV0dXJuIHRoaXMuX3ZhbHVlO1xuICB9XG5cbiAgLyoqXG4gICAqIFdpZHRoIG9mIHRoZSBwcm9ncmVzcyBiYXIgaW4gcGVyY2VudGFnZSAodmFsdWUgPj0gMCAmJiB2YWx1ZSA8PSAxMDApLiBCeSBkZWZhdWx0IHNldCB0byAwLlxuICAgKi9cbiAgQElucHV0KCkgc2V0IHZhbHVlKHZhbHVlOiBudW1iZXIpIHtcbiAgICBpZiAodmFsdWUgPj0gMCAmJiB2YWx1ZSA8PSAxMDApIHtcbiAgICAgIHRoaXMuX3ZhbHVlID0gdmFsdWU7XG4gICAgfSBlbHNlIGlmICh2YWx1ZSA+IDEwMCkge1xuICAgICAgdGhpcy5fdmFsdWUgPSAxMDA7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuX3ZhbHVlID0gMDtcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogU2V0cyB0aGUgY29sb3Igb2YgdGhlIHByb2dyZXNzIGJhci4gVHlwZSBvZiBTdWlzQ29sb3IuIEJ5IGRlZmF1bHQgc2V0IHRvICdwcmltYXJ5Jy5cbiAgICovXG4gIEBJbnB1dCgpIGNvbG9yOiBTdWlzQ29sb3IgPSAncHJpbWFyeSc7XG5cbiAgLyoqXG4gICAqIFNldHMgdGhlIGJhY2tncm91bmQgY29sb3Igb2YgdGhlIHByb2dyZXNzIGJhci4gVHlwZSBvZiBTdWlzQ29sb3IuIEJ5IGRlZmF1bHQgc2V0IHRvICd0ZXJ0aWFyeScuXG4gICAqL1xuICBASW5wdXQoKSBiYWNrZ3JvdW5kQ29sb3I6IFN1aXNDb2xvciA9ICd0ZXJ0aWFyeSc7XG5cbiAgLyoqXG4gICAqIFNldHMgdGhlIGhlaWdodCBvZiB0aGUgcHJvZ3Jlc3MgYmFyLiBUeXBlIG9mIFN1aXNTaXplLiBCeSBkZWZhdWx0IHNldCB0byAnbWQnLlxuICAgKi9cbiAgQElucHV0KCkgc2l6ZTogU3Vpc1NpemUgPSAnbWQnO1xufVxuIiwiPGRpdlxuICBjbGFzcz1cInN1aXMtcHJvZ3Jlc3MtYmFyXCJcbiAgW25nQ2xhc3NdPVwiJ3N1aXMtcHJvZ3Jlc3MtYmFyJyB8IHN1aXNOZ0NsYXNzIDogYmFja2dyb3VuZENvbG9yIDogc2l6ZVwiXG4+XG4gIDxkaXZcbiAgICBjbGFzcz1cInN1aXMtcHJvZ3Jlc3MtYmFyX19wcm9ncmVzc1wiXG4gICAgW3N0eWxlXT1cInsgd2lkdGg6IHZhbHVlIHwgc3Vpc1Byb2dyZXNzQmFyIH1cIlxuICAgIFtuZ0NsYXNzXT1cIidzdWlzLXByb2dyZXNzLWJhcl9fcHJvZ3Jlc3MnIHwgc3Vpc05nQ2xhc3MgOiBjb2xvciA6IHNpemVcIlxuICA+PC9kaXY+XG48L2Rpdj5cbiJdfQ==
46
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1wcm9ncmVzcy1iYXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLXByb2dyZXNzLWJhci9zdWlzLXByb2dyZXNzLWJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtcHJvZ3Jlc3MtYmFyL3N1aXMtcHJvZ3Jlc3MtYmFyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMxQyxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUUvRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sYUFBYSxDQUFDOztBQVU5QyxNQUFNLE9BQU8sd0JBQXdCO0lBUnJDO1FBU0U7O1dBRUc7UUFDTSxVQUFLLEdBQVcsQ0FBQyxDQUFDO1FBRTNCOztXQUVHO1FBQ00sYUFBUSxHQUFXLEdBQUcsQ0FBQztRQUVoQzs7V0FFRztRQUNNLFVBQUssR0FBYyxTQUFTLENBQUM7UUFFdEM7O1dBRUc7UUFDTSxvQkFBZSxHQUFjLFVBQVUsQ0FBQztRQUVqRDs7V0FFRztRQUNNLFNBQUksR0FBYSxJQUFJLENBQUM7S0FDaEM7K0dBekJZLHdCQUF3QjttR0FBeEIsd0JBQXdCLGlNQ2RyQyx5VUFVQSxxZ0RERFksT0FBTywrRUFBRSxlQUFlLCtDQUFFLG1CQUFtQjs7NEZBSzVDLHdCQUF3QjtrQkFScEMsU0FBUzsrQkFDRSxtQkFBbUIsY0FDakIsSUFBSSxXQUNQLENBQUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxtQkFBbUIsQ0FBQyxtQkFHdkMsdUJBQXVCLENBQUMsTUFBTTs4QkFNdEMsS0FBSztzQkFBYixLQUFLO2dCQUtHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBS0csS0FBSztzQkFBYixLQUFLO2dCQUtHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBS0csSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nQ2xhc3MgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgU3Vpc1Byb2dyZXNzQmFyUGlwZSB9IGZyb20gJy4vc3Vpcy1wcm9ncmVzcy1iYXIucGlwZSc7XG5pbXBvcnQgeyBTdWlzQ29sb3IsIFN1aXNTaXplIH0gZnJvbSAnLi4vLi4vdHlwZXMnO1xuaW1wb3J0IHsgU3Vpc05nQ2xhc3NQaXBlIH0gZnJvbSAnLi4vLi4vcGlwZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWlzLXByb2dyZXNzLWJhcicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtOZ0NsYXNzLCBTdWlzTmdDbGFzc1BpcGUsIFN1aXNQcm9ncmVzc0JhclBpcGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vc3Vpcy1wcm9ncmVzcy1iYXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9zdWlzLXByb2dyZXNzLWJhci5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc1Byb2dyZXNzQmFyQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIFRoZSB2YWx1ZSBjb3JyZXNwb25kaW5nIHRvIHRoZSBwcm9ncmVzcyBiYXIuIEJ5IGRlZmF1bHQgc2V0IHRvIDAuXG4gICAqL1xuICBASW5wdXQoKSB2YWx1ZTogbnVtYmVyID0gMDtcblxuICAvKipcbiAgICogTWF4aW11bSB2YWx1ZSBvZiB0aGUgcHJvZ3Jlc3MgYmFyLiBCeSBkZWZhdWx0IHNldCB0byAxMDAuXG4gICAqL1xuICBASW5wdXQoKSBtYXhWYWx1ZTogbnVtYmVyID0gMTAwO1xuXG4gIC8qKlxuICAgKiBTZXRzIHRoZSBjb2xvciBvZiB0aGUgcHJvZ3Jlc3MgYmFyLiBUeXBlIG9mIFN1aXNDb2xvci4gQnkgZGVmYXVsdCBzZXQgdG8gJ3ByaW1hcnknLlxuICAgKi9cbiAgQElucHV0KCkgY29sb3I6IFN1aXNDb2xvciA9ICdwcmltYXJ5JztcblxuICAvKipcbiAgICogU2V0cyB0aGUgYmFja2dyb3VuZCBjb2xvciBvZiB0aGUgcHJvZ3Jlc3MgYmFyLiBUeXBlIG9mIFN1aXNDb2xvci4gQnkgZGVmYXVsdCBzZXQgdG8gJ3RlcnRpYXJ5Jy5cbiAgICovXG4gIEBJbnB1dCgpIGJhY2tncm91bmRDb2xvcjogU3Vpc0NvbG9yID0gJ3RlcnRpYXJ5JztcblxuICAvKipcbiAgICogU2V0cyB0aGUgaGVpZ2h0IG9mIHRoZSBwcm9ncmVzcyBiYXIuIFR5cGUgb2YgU3Vpc1NpemUuIEJ5IGRlZmF1bHQgc2V0IHRvICdtZCcuXG4gICAqL1xuICBASW5wdXQoKSBzaXplOiBTdWlzU2l6ZSA9ICdtZCc7XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwic3Vpcy1wcm9ncmVzcy1iYXJcIlxuICBbbmdDbGFzc109XCInc3Vpcy1wcm9ncmVzcy1iYXInIHwgc3Vpc05nQ2xhc3MgOiBiYWNrZ3JvdW5kQ29sb3IgOiBzaXplXCJcbj5cbiAgPGRpdlxuICAgIGNsYXNzPVwic3Vpcy1wcm9ncmVzcy1iYXJfX3Byb2dyZXNzXCJcbiAgICBbc3R5bGVdPVwieyB3aWR0aDogdmFsdWUgfCBzdWlzUHJvZ3Jlc3NCYXIgOiBtYXhWYWx1ZSB9XCJcbiAgICBbbmdDbGFzc109XCInc3Vpcy1wcm9ncmVzcy1iYXJfX3Byb2dyZXNzJyB8IHN1aXNOZ0NsYXNzIDogY29sb3IgOiBzaXplXCJcbiAgPjwvZGl2PlxuPC9kaXY+XG4iXX0=
package/esm2022/lib/components/suis-progress-bar/suis-progress-bar.pipe.mjs CHANGED
@@ -1,8 +1,10 @@
1
1
  import { Pipe } from '@angular/core';
2
2
  import * as i0 from "@angular/core";
3
3
  export class SuisProgressBarPipe {
4
- transform(value) {
5
- return `${(value / 100) * 100}%`;
4
+ transform(value, maxValue) {
5
+ if (value > maxValue)
6
+ return '100%';
7
+ return `${(value / maxValue) * 100}%`;
6
8
  }
7
9
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
8
10
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarPipe, isStandalone: true, name: "suisProgressBar" }); }
@@ -14,4 +16,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
14
16
  name: 'suisProgressBar',
15
17
  }]
16
18
  }] });
17
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1wcm9ncmVzcy1iYXIucGlwZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvc3Vpcy9zcmMvbGliL2NvbXBvbmVudHMvc3Vpcy1wcm9ncmVzcy1iYXIvc3Vpcy1wcm9ncmVzcy1iYXIucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFpQixNQUFNLGVBQWUsQ0FBQzs7QUFNcEQsTUFBTSxPQUFPLG1CQUFtQjtJQUM5QixTQUFTLENBQUMsS0FBYTtRQUNyQixPQUFPLEdBQUcsQ0FBQyxLQUFLLEdBQUcsR0FBRyxDQUFDLEdBQUcsR0FBRyxHQUFHLENBQUM7SUFDbkMsQ0FBQzsrR0FIVSxtQkFBbUI7NkdBQW5CLG1CQUFtQjs7NEZBQW5CLG1CQUFtQjtrQkFKL0IsSUFBSTttQkFBQztvQkFDSixVQUFVLEVBQUUsSUFBSTtvQkFDaEIsSUFBSSxFQUFFLGlCQUFpQjtpQkFDeEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBQaXBlLCBQaXBlVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBQaXBlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgbmFtZTogJ3N1aXNQcm9ncmVzc0JhcicsXG59KVxuZXhwb3J0IGNsYXNzIFN1aXNQcm9ncmVzc0JhclBpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcbiAgdHJhbnNmb3JtKHZhbHVlOiBudW1iZXIpOiBzdHJpbmcge1xuICAgIHJldHVybiBgJHsodmFsdWUgLyAxMDApICogMTAwfSVgO1xuICB9XG59XG4iXX0=
19
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1wcm9ncmVzcy1iYXIucGlwZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvc3Vpcy9zcmMvbGliL2NvbXBvbmVudHMvc3Vpcy1wcm9ncmVzcy1iYXIvc3Vpcy1wcm9ncmVzcy1iYXIucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFpQixNQUFNLGVBQWUsQ0FBQzs7QUFNcEQsTUFBTSxPQUFPLG1CQUFtQjtJQUM5QixTQUFTLENBQUMsS0FBYSxFQUFFLFFBQWdCO1FBQ3ZDLElBQUksS0FBSyxHQUFHLFFBQVE7WUFBRSxPQUFPLE1BQU0sQ0FBQztRQUNwQyxPQUFPLEdBQUcsQ0FBQyxLQUFLLEdBQUcsUUFBUSxDQUFDLEdBQUcsR0FBRyxHQUFHLENBQUM7SUFDeEMsQ0FBQzsrR0FKVSxtQkFBbUI7NkdBQW5CLG1CQUFtQjs7NEZBQW5CLG1CQUFtQjtrQkFKL0IsSUFBSTttQkFBQztvQkFDSixVQUFVLEVBQUUsSUFBSTtvQkFDaEIsSUFBSSxFQUFFLGlCQUFpQjtpQkFDeEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBQaXBlLCBQaXBlVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBQaXBlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgbmFtZTogJ3N1aXNQcm9ncmVzc0JhcicsXG59KVxuZXhwb3J0IGNsYXNzIFN1aXNQcm9ncmVzc0JhclBpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcbiAgdHJhbnNmb3JtKHZhbHVlOiBudW1iZXIsIG1heFZhbHVlOiBudW1iZXIpOiBzdHJpbmcge1xuICAgIGlmICh2YWx1ZSA+IG1heFZhbHVlKSByZXR1cm4gJzEwMCUnO1xuICAgIHJldHVybiBgJHsodmFsdWUgLyBtYXhWYWx1ZSkgKiAxMDB9JWA7XG4gIH1cbn1cbiJdfQ==
package/fesm2022/suis.mjs CHANGED
@@ -2003,8 +2003,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2003
2003
  }] } });
2004
2004
 
2005
2005
  class SuisProgressBarPipe {
2006
- transform(value) {
2007
- return `${(value / 100) * 100}%`;
2006
+ transform(value, maxValue) {
2007
+ if (value > maxValue)
2008
+ return '100%';
2009
+ return `${(value / maxValue) * 100}%`;
2008
2010
  }
2009
2011
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
2010
2012
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarPipe, isStandalone: true, name: "suisProgressBar" }); }
@@ -2019,8 +2021,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2019
2021
 
2020
2022
  class SuisProgressBarComponent {
2021
2023
  constructor() {
2022
- /** @internal */
2023
- this._value = 0;
2024
+ /**
2025
+ * The value corresponding to the progress bar. By default set to 0.
2026
+ */
2027
+ this.value = 0;
2028
+ /**
2029
+ * Maximum value of the progress bar. By default set to 100.
2030
+ */
2031
+ this.maxValue = 100;
2024
2032
  /**
2025
2033
  * Sets the color of the progress bar. Type of SuisColor. By default set to 'primary'.
2026
2034
  */
@@ -2034,32 +2042,16 @@ class SuisProgressBarComponent {
2034
2042
  */
2035
2043
  this.size = 'md';
2036
2044
  }
2037
- /** @internal */
2038
- get value() {
2039
- return this._value;
2040
- }
2041
- /**
2042
- * Width of the progress bar in percentage (value >= 0 && value <= 100). By default set to 0.
2043
- */
2044
- set value(value) {
2045
- if (value >= 0 && value <= 100) {
2046
- this._value = value;
2047
- }
2048
- else if (value > 100) {
2049
- this._value = 100;
2050
- }
2051
- else {
2052
- this._value = 0;
2053
- }
2054
- }
2055
2045
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2056
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SuisProgressBarComponent, isStandalone: true, selector: "suis-progress-bar", inputs: { value: "value", color: "color", backgroundColor: "backgroundColor", size: "size" }, ngImport: i0, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "pipe", type: SuisProgressBarPipe, name: "suisProgressBar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2046
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SuisProgressBarComponent, isStandalone: true, selector: "suis-progress-bar", inputs: { value: "value", maxValue: "maxValue", color: "color", backgroundColor: "backgroundColor", size: "size" }, ngImport: i0, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar : maxValue }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "pipe", type: SuisProgressBarPipe, name: "suisProgressBar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2057
2047
  }
2058
2048
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuisProgressBarComponent, decorators: [{
2059
2049
  type: Component,
2060
- args: [{ selector: 'suis-progress-bar', standalone: true, imports: [NgClass, SuisNgClassPipe, SuisProgressBarPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"] }]
2050
+ args: [{ selector: 'suis-progress-bar', standalone: true, imports: [NgClass, SuisNgClassPipe, SuisProgressBarPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"suis-progress-bar\"\n [ngClass]=\"'suis-progress-bar' | suisNgClass : backgroundColor : size\"\n>\n <div\n class=\"suis-progress-bar__progress\"\n [style]=\"{ width: value | suisProgressBar : maxValue }\"\n [ngClass]=\"'suis-progress-bar__progress' | suisNgClass : color : size\"\n ></div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-progress-bar{width:100%}.suis-progress-bar,.suis-progress-bar__progress{border-radius:1rem}.suis-progress-bar--primary,.suis-progress-bar__progress--primary{background-color:#192a56}.suis-progress-bar--secondary,.suis-progress-bar__progress--secondary{background-color:#273c75}.suis-progress-bar--tertiary,.suis-progress-bar__progress--tertiary{background-color:#dcdde1}.suis-progress-bar--complementary,.suis-progress-bar__progress--complementary{background-color:#f5f6fa}.suis-progress-bar--success,.suis-progress-bar__progress--success{background-color:#2ed573}.suis-progress-bar--warning,.suis-progress-bar__progress--warning{background-color:#ffa502}.suis-progress-bar--danger,.suis-progress-bar__progress--danger{background-color:#ff4757}.suis-progress-bar--white,.suis-progress-bar__progress--white{background-color:#fff}.suis-progress-bar--gray,.suis-progress-bar__progress--gray{background-color:#bcbcbc}.suis-progress-bar--dark,.suis-progress-bar__progress--dark{background-color:#000}.suis-progress-bar--xs,.suis-progress-bar__progress--xs{height:.375rem}.suis-progress-bar--sm,.suis-progress-bar__progress--sm{height:.5rem}.suis-progress-bar--md,.suis-progress-bar__progress--md{height:.625rem}.suis-progress-bar--lg,.suis-progress-bar__progress--lg{height:.75rem}.suis-progress-bar--xl,.suis-progress-bar__progress--xl{height:1rem}\n"] }]
2061
2051
  }], propDecorators: { value: [{
2062
2052
  type: Input
2053
+ }], maxValue: [{
2054
+ type: Input
2063
2055
  }], color: [{
2064
2056
  type: Input
2065
2057
  }], backgroundColor: [{