zek 14.2.53 → 14.2.55

package/fesm2020/zek.mjs

@@ -4861,6 +4861,7 @@ class ZekProgress {
     constructor() {
         this._value = 0;
         this._showValue = false;
+        this._showTitle = true;
         this._striped = false;
         this._animated = false;
         this._label = null;
@@ -4871,7 +4872,10 @@ class ZekProgress {
         return this._value;
     }
     set value(v) {
-        this._value = clamp(Convert.toNumber(v) || 0);
+        let tmp = clamp(Convert.toNumber(v) || 0);
+        if (this._value !== tmp) {
+            this._value = tmp;
+        }
     }
     get showValue() {
         return this._showValue;
@@ -4879,6 +4883,15 @@ class ZekProgress {
     set showValue(v) {
         this._showValue = Convert.toBoolean(v);
     }
+    get showTitle() {
+        return this._showTitle;
+    }
+    set showTitle(v) {
+        this._showTitle = Convert.toBoolean(v);
+    }
+    get _title() {
+        return this._showTitle ? `${this._value} %` : null;
+    }
     get striped() {
         return this._striped;
     }
@@ -4912,14 +4925,16 @@ class ZekProgress {
     }
 }
 ZekProgress.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ZekProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZekProgress.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: ZekProgress, selector: "zek-progress", inputs: { value: "value", showValue: "showValue", striped: "striped", animated: "animated", label: "label", height: "height", background: "background" }, ngImport: i0, template: "<div class=\"progress\" [style.height.px]=\"height\">\r\n    <div class=\"progress-bar bg-{{background}}\" role=\"progressbar\"\r\n        [class.progress-bar-striped]=\"striped || animated\"\r\n        [class.progress-bar-animated]=\"animated\"\r\n        [style.width.%]=\"value\"\r\n        [attr.aria-valuenow]=\"value\"\r\n        aria-valuemin=\"0\"\r\n        aria-valuemax=\"100\">\r\n        <ng-container *ngIf=\"showValue\">{{value}}%</ng-container>\r\n        <ng-content></ng-content>>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+ZekProgress.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: ZekProgress, selector: "zek-progress", inputs: { value: "value", showValue: "showValue", showTitle: "showTitle", striped: "striped", animated: "animated", label: "label", height: "height", background: "background" }, ngImport: i0, template: "<div class=\"progress\" [style.height.px]=\"height\" [title]=\"_title\" >\r\n    <div class=\"progress-bar bg-{{background}}\" role=\"progressbar\"\r\n        [class.progress-bar-striped]=\"striped || animated\"\r\n        [class.progress-bar-animated]=\"animated\"\r\n        [style.width.%]=\"value\"\r\n        [attr.aria-valuenow]=\"value\"\r\n        aria-valuemin=\"0\"\r\n        aria-valuemax=\"100\">\r\n        <ng-container *ngIf=\"showValue\">{{value}}%</ng-container>\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ZekProgress, decorators: [{
             type: Component,
-            args: [{ selector: 'zek-progress', template: "<div class=\"progress\" [style.height.px]=\"height\">\r\n    <div class=\"progress-bar bg-{{background}}\" role=\"progressbar\"\r\n        [class.progress-bar-striped]=\"striped || animated\"\r\n        [class.progress-bar-animated]=\"animated\"\r\n        [style.width.%]=\"value\"\r\n        [attr.aria-valuenow]=\"value\"\r\n        aria-valuemin=\"0\"\r\n        aria-valuemax=\"100\">\r\n        <ng-container *ngIf=\"showValue\">{{value}}%</ng-container>\r\n        <ng-content></ng-content>>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'zek-progress', template: "<div class=\"progress\" [style.height.px]=\"height\" [title]=\"_title\" >\r\n    <div class=\"progress-bar bg-{{background}}\" role=\"progressbar\"\r\n        [class.progress-bar-striped]=\"striped || animated\"\r\n        [class.progress-bar-animated]=\"animated\"\r\n        [style.width.%]=\"value\"\r\n        [attr.aria-valuenow]=\"value\"\r\n        aria-valuemin=\"0\"\r\n        aria-valuemax=\"100\">\r\n        <ng-container *ngIf=\"showValue\">{{value}}%</ng-container>\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [":host{display:block}\n"] }]
         }], propDecorators: { value: [{
                 type: Input
             }], showValue: [{
                 type: Input
+            }], showTitle: [{
+                type: Input
             }], striped: [{
                 type: Input
             }], animated: [{
@@ -5098,13 +5113,13 @@ class ReadOnlyDirective {
     }
 }
 ReadOnlyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ReadOnlyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-ReadOnlyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.0", type: ReadOnlyDirective, selector: "[readonly],[readOnly]", inputs: { readonly: "readonly" }, host: { properties: { "attr.readonly": "_isReadonly ? \"\" : null" } }, ngImport: i0 });
+ReadOnlyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.0", type: ReadOnlyDirective, selector: "[readonly],[readOnly]", inputs: { readonly: "readonly" }, host: { properties: { "attr.readonly": "_readonly ? \"\" : null" } }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: ReadOnlyDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[readonly],[readOnly]',
                     host: {
-                        '[attr.readonly]': '_isReadonly ? "" : null'
+                        '[attr.readonly]': '_readonly ? "" : null'
                     }
                 }]
         }], propDecorators: { readonly: [{