@kirbydesign/designsystem 11.11.3-dev-e7cb27f → 12.0.0-dev-67d5287

package/fesm2022/kirbydesign-designsystem-progress-circle.mjs

@@ -1,122 +1,210 @@
-import * as i0 from '@angular/core';
-import { HostBinding, Input, ChangeDetectionStrategy, Component } from '@angular/core';
-import { ThemeColorDirective } from '@kirbydesign/designsystem/shared';
-
-class ProgressCircleRingComponent {
-    constructor() {
-        this.UPPER_AND_LOWER_BOUND_GAP = 2.5;
-        this.value = 0;
-        this.themeColor = 'success';
-        this.size = 'md';
-    }
-    get _sizeClass() {
-        return this.size;
-    }
-    ngAfterViewInit() {
-        this.viewInitialized = true;
-    }
-    get _progress() {
-        if (this.value <= 0)
-            return 0;
-        if (this.value >= 100)
-            return 100;
-        return Math.min(this.value, 100 - this.UPPER_AND_LOWER_BOUND_GAP);
-    }
-    get _linecap() {
-        return this._progress <= 0 || this._progress >= 100 ? 'butt' : 'round';
-    }
-    get _remainder() {
-        return 100 - this._progress;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: ProgressCircleRingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.23", type: ProgressCircleRingComponent, isStandalone: true, selector: "kirby-progress-circle-ring", inputs: { value: "value", themeColor: "themeColor", size: "size" }, host: { properties: { "class": "this._sizeClass", "class.view-initialized": "this.viewInitialized" } }, ngImport: i0, template: "<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{width:100%;height:100%}:host.success{--kirby-progress-circle-stroke-color: var(--kirby-success-shade)}:host.warning{--kirby-progress-circle-stroke-color: var(--kirby-warning-shade)}:host.danger{--kirby-progress-circle-stroke-color: var(--kirby-danger)}:host.view-initialized .progress{transition-property:stroke-dasharray,stroke;transition-duration:var(--kirby-transition-duration-extra-long);transition-timing-function:var(--kirby-transition-easing-enter-exit);transform-origin:50% 50%;stroke:var(--kirby-progress-circle-stroke-color, var(--kirby-success))}svg{rotate:-90deg}.circle,.progress{r:calc(50% - var(--kirby-progress-circle-stroke-width, 4px) / 2);stroke-width:var(--kirby-progress-circle-stroke-width, 4px)}.circle{stroke:var(--kirby-semi-light)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: ProgressCircleRingComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-progress-circle-ring', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{width:100%;height:100%}:host.success{--kirby-progress-circle-stroke-color: var(--kirby-success-shade)}:host.warning{--kirby-progress-circle-stroke-color: var(--kirby-warning-shade)}:host.danger{--kirby-progress-circle-stroke-color: var(--kirby-danger)}:host.view-initialized .progress{transition-property:stroke-dasharray,stroke;transition-duration:var(--kirby-transition-duration-extra-long);transition-timing-function:var(--kirby-transition-easing-enter-exit);transform-origin:50% 50%;stroke:var(--kirby-progress-circle-stroke-color, var(--kirby-success))}svg{rotate:-90deg}.circle,.progress{r:calc(50% - var(--kirby-progress-circle-stroke-width, 4px) / 2);stroke-width:var(--kirby-progress-circle-stroke-width, 4px)}.circle{stroke:var(--kirby-semi-light)}\n"] }]
-        }], propDecorators: { value: [{
-                type: Input
-            }], themeColor: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], _sizeClass: [{
-                type: HostBinding,
-                args: ['class']
-            }], viewInitialized: [{
-                type: HostBinding,
-                args: ['class.view-initialized']
-            }] } });
-
-class ProgressCircleComponent {
-    get _cssSize() {
-        return this.size;
-    }
-    constructor(elementRef, changeDetectorRef) {
-        this.elementRef = elementRef;
-        this.changeDetectorRef = changeDetectorRef;
-        this.role = 'progressbar';
-        this.value = 0;
-        this.size = 'md';
-        this.themeColor = 'success';
-        this.onIntersectionChange = (entries) => {
-            this.hasElementBeenVisible = entries && entries.some((entry) => entry.isIntersecting);
-            if (this.hasElementBeenVisible) {
-                this.unobserve();
-                this.changeDetectorRef.markForCheck();
-            }
-        };
-    }
-    ngAfterViewInit() {
-        if (!this.observer) {
-            this.observer = new IntersectionObserver(this.onIntersectionChange, {
-                threshold: 0.5,
-            });
-            this.observer.observe(this.elementRef.nativeElement);
-        }
-    }
-    ngOnDestroy() {
-        this.unobserve();
-    }
-    unobserve() {
-        if (this.observer) {
-            this.observer.unobserve(this.elementRef.nativeElement);
-            // Safari does not support "disconnect", see: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility
-            if (typeof this.observer.disconnect === 'function') {
-                this.observer.disconnect();
-            }
-        }
-    }
-    get _shownValue() {
-        // This is needed to make an animation [0 -> value] when element is shown to the user
-        return this.hasElementBeenVisible ? this.value : 0;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: ProgressCircleComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.23", type: ProgressCircleComponent, isStandalone: true, selector: "kirby-progress-circle", inputs: { value: "value", size: "size", themeColor: "themeColor" }, host: { properties: { "attr.role": "this.role", "attr.aria-valuenow": "this.value", "class": "this._cssSize" } }, ngImport: i0, template: "<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n", styles: [":host{display:inline-block;position:relative;overflow:hidden;width:var(--kirby-progress-circle-size);height:var(--kirby-progress-circle-size)}:host(.sm){--kirby-progress-circle-stroke-width: 3px;--kirby-progress-circle-size: clamp(var(--kirby-spacing-xl), 2.5em, var(--kirby-spacing-xxxl))}:host(.md){--kirby-progress-circle-stroke-width: 4px;--kirby-progress-circle-size: var(--kirby-spacing-xxxl)}:host(.lg){--kirby-progress-circle-stroke-width: 6px;--kirby-progress-circle-size: calc(var(--kirby-spacing-xxxl) + var(--kirby-spacing-xl))}:host(.sm) .transcluded-content{font-size:var(--kirby-font-size-xs)}:host(.md) .transcluded-content,:host(.lg) .transcluded-content{font-size:var(--kirby-font-size-s)}.transcluded-content,kirby-progress-circle-ring{position:absolute;top:0;left:0}kirby-progress-circle-ring{z-index:calc(var(--kirby-z-index-default) + 1)}.transcluded-content{width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:var(--kirby-z-index-default);border-radius:var(--kirby-border-radius-circle);overflow:hidden}\n"], dependencies: [{ kind: "component", type: ProgressCircleRingComponent, selector: "kirby-progress-circle-ring", inputs: ["value", "themeColor", "size"] }, { kind: "directive", type: ThemeColorDirective, selector: "kirby-avatar[themeColor],             kirby-card[themeColor],             kirby-icon[themeColor],             kirby-progress-circle-ring[themeColor],             kirby-modal-footer[themeColor],             kirby-empty-state[themeColor]", inputs: ["themeColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: ProgressCircleComponent, decorators: [{
-            type: Component,
-            args: [{ imports: [ProgressCircleRingComponent, ThemeColorDirective], selector: 'kirby-progress-circle', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n", styles: [":host{display:inline-block;position:relative;overflow:hidden;width:var(--kirby-progress-circle-size);height:var(--kirby-progress-circle-size)}:host(.sm){--kirby-progress-circle-stroke-width: 3px;--kirby-progress-circle-size: clamp(var(--kirby-spacing-xl), 2.5em, var(--kirby-spacing-xxxl))}:host(.md){--kirby-progress-circle-stroke-width: 4px;--kirby-progress-circle-size: var(--kirby-spacing-xxxl)}:host(.lg){--kirby-progress-circle-stroke-width: 6px;--kirby-progress-circle-size: calc(var(--kirby-spacing-xxxl) + var(--kirby-spacing-xl))}:host(.sm) .transcluded-content{font-size:var(--kirby-font-size-xs)}:host(.md) .transcluded-content,:host(.lg) .transcluded-content{font-size:var(--kirby-font-size-s)}.transcluded-content,kirby-progress-circle-ring{position:absolute;top:0;left:0}kirby-progress-circle-ring{z-index:calc(var(--kirby-z-index-default) + 1)}.transcluded-content{width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:var(--kirby-z-index-default);border-radius:var(--kirby-border-radius-circle);overflow:hidden}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], value: [{
-                type: HostBinding,
-                args: ['attr.aria-valuenow']
-            }, {
-                type: Input
-            }], size: [{
-                type: Input
-            }], themeColor: [{
-                type: Input
-            }], _cssSize: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, HostBinding, Input } from "@angular/core";
+import { ThemeColorDirective } from "@kirbydesign/designsystem/shared";
+var ProgressCircleRingComponent = class ProgressCircleRingComponent {
+	constructor() {
+		this.UPPER_AND_LOWER_BOUND_GAP = 2.5;
+		this.value = 0;
+		this.themeColor = "success";
+		this.size = "md";
+	}
+	get _sizeClass() {
+		return this.size;
+	}
+	ngAfterViewInit() {
+		this.viewInitialized = true;
+	}
+	get _progress() {
+		if (this.value <= 0) return 0;
+		if (this.value >= 100) return 100;
+		return Math.min(this.value, 100 - this.UPPER_AND_LOWER_BOUND_GAP);
+	}
+	get _linecap() {
+		return this._progress <= 0 || this._progress >= 100 ? "butt" : "round";
+	}
+	get _remainder() {
+		return 100 - this._progress;
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ProgressCircleRingComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ProgressCircleRingComponent,
+			isStandalone: true,
+			selector: "kirby-progress-circle-ring",
+			inputs: {
+				value: "value",
+				themeColor: "themeColor",
+				size: "size"
+			},
+			host: { properties: {
+				"class": "this._sizeClass",
+				"class.view-initialized": "this.viewInitialized"
+			} },
+			ngImport: i0,
+			template: "<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n",
+			styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{width:100%;height:100%}:host.success{--kirby-progress-circle-stroke-color: var(--kirby-color-border-success-loud)}:host.warning{--kirby-progress-circle-stroke-color: var(--kirby-color-border-warning-loud)}:host.danger{--kirby-progress-circle-stroke-color: var(--kirby-color-border-danger-loud)}:host.view-initialized .progress{transition-property:stroke-dasharray,stroke;transition-duration:var(--kirby-transition-duration-extra-long);transition-timing-function:var(--kirby-transition-easing-enter-exit);transform-origin:50% 50%;stroke:var(--kirby-progress-circle-stroke-color, var(--kirby-color-border-success-loud))}svg{rotate:-90deg}.circle,.progress{r:calc(50% - var(--kirby-progress-circle-stroke-width, 4px) / 2);stroke-width:var(--kirby-progress-circle-stroke-width, 4px)}.circle{stroke:var(--kirby-color-border-base-quiet)}\n"],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ProgressCircleRingComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-progress-circle-ring",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n",
+			styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{width:100%;height:100%}:host.success{--kirby-progress-circle-stroke-color: var(--kirby-color-border-success-loud)}:host.warning{--kirby-progress-circle-stroke-color: var(--kirby-color-border-warning-loud)}:host.danger{--kirby-progress-circle-stroke-color: var(--kirby-color-border-danger-loud)}:host.view-initialized .progress{transition-property:stroke-dasharray,stroke;transition-duration:var(--kirby-transition-duration-extra-long);transition-timing-function:var(--kirby-transition-easing-enter-exit);transform-origin:50% 50%;stroke:var(--kirby-progress-circle-stroke-color, var(--kirby-color-border-success-loud))}svg{rotate:-90deg}.circle,.progress{r:calc(50% - var(--kirby-progress-circle-stroke-width, 4px) / 2);stroke-width:var(--kirby-progress-circle-stroke-width, 4px)}.circle{stroke:var(--kirby-color-border-base-quiet)}\n"]
+		}]
+	}],
+	propDecorators: {
+		value: [{ type: Input }],
+		themeColor: [{ type: Input }],
+		size: [{ type: Input }],
+		_sizeClass: [{
+			type: HostBinding,
+			args: ["class"]
+		}],
+		viewInitialized: [{
+			type: HostBinding,
+			args: ["class.view-initialized"]
+		}]
+	}
+});
+var ProgressCircleComponent = class ProgressCircleComponent {
+	get _cssSize() {
+		return this.size;
+	}
+	constructor(elementRef, changeDetectorRef) {
+		this.elementRef = elementRef;
+		this.changeDetectorRef = changeDetectorRef;
+		this.role = "progressbar";
+		this.value = 0;
+		this.size = "md";
+		this.themeColor = "success";
+		this.onIntersectionChange = (entries) => {
+			this.hasElementBeenVisible = entries && entries.some((entry) => entry.isIntersecting);
+			if (this.hasElementBeenVisible) {
+				this.unobserve();
+				this.changeDetectorRef.markForCheck();
+			}
+		};
+	}
+	ngAfterViewInit() {
+		if (!this.observer) {
+			this.observer = new IntersectionObserver(this.onIntersectionChange, { threshold: .5 });
+			this.observer.observe(this.elementRef.nativeElement);
+		}
+	}
+	ngOnDestroy() {
+		this.unobserve();
+	}
+	unobserve() {
+		if (this.observer) {
+			this.observer.unobserve(this.elementRef.nativeElement);
+			if (typeof this.observer.disconnect === "function") this.observer.disconnect();
+		}
+	}
+	get _shownValue() {
+		return this.hasElementBeenVisible ? this.value : 0;
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ProgressCircleComponent,
+			deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ProgressCircleComponent,
+			isStandalone: true,
+			selector: "kirby-progress-circle",
+			inputs: {
+				value: "value",
+				size: "size",
+				themeColor: "themeColor"
+			},
+			host: { properties: {
+				"attr.role": "this.role",
+				"attr.aria-valuenow": "this.value",
+				"class": "this._cssSize"
+			} },
+			ngImport: i0,
+			template: "<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n",
+			styles: [":host{display:inline-block;position:relative;overflow:hidden;width:var(--kirby-progress-circle-size);height:var(--kirby-progress-circle-size)}:host(.sm){--kirby-progress-circle-stroke-width: 3px;--kirby-progress-circle-size: clamp(var(--kirby-spacing-xl), 2.5em, var(--kirby-spacing-xxxl))}:host(.md){--kirby-progress-circle-stroke-width: 4px;--kirby-progress-circle-size: var(--kirby-spacing-xxxl)}:host(.lg){--kirby-progress-circle-stroke-width: 6px;--kirby-progress-circle-size: calc(var(--kirby-spacing-xxxl) + var(--kirby-spacing-xl))}:host(.sm) .transcluded-content{font-size:var(--kirby-font-size-xs)}:host(.md) .transcluded-content,:host(.lg) .transcluded-content{font-size:var(--kirby-font-size-s)}.transcluded-content,kirby-progress-circle-ring{position:absolute;top:0;left:0}kirby-progress-circle-ring{z-index:calc(var(--kirby-z-index-default) + 1)}.transcluded-content{width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:var(--kirby-z-index-default);border-radius:var(--kirby-border-radius-circle);overflow:hidden}\n"],
+			dependencies: [{
+				kind: "component",
+				type: ProgressCircleRingComponent,
+				selector: "kirby-progress-circle-ring",
+				inputs: [
+					"value",
+					"themeColor",
+					"size"
+				]
+			}, {
+				kind: "directive",
+				type: ThemeColorDirective,
+				selector: "kirby-avatar[themeColor],             kirby-card[themeColor],             kirby-icon[themeColor],             kirby-progress-circle-ring[themeColor],             kirby-modal-footer[themeColor],             kirby-empty-state[themeColor]",
+				inputs: ["themeColor"]
+			}],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ProgressCircleComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			imports: [ProgressCircleRingComponent, ThemeColorDirective],
+			selector: "kirby-progress-circle",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n",
+			styles: [":host{display:inline-block;position:relative;overflow:hidden;width:var(--kirby-progress-circle-size);height:var(--kirby-progress-circle-size)}:host(.sm){--kirby-progress-circle-stroke-width: 3px;--kirby-progress-circle-size: clamp(var(--kirby-spacing-xl), 2.5em, var(--kirby-spacing-xxxl))}:host(.md){--kirby-progress-circle-stroke-width: 4px;--kirby-progress-circle-size: var(--kirby-spacing-xxxl)}:host(.lg){--kirby-progress-circle-stroke-width: 6px;--kirby-progress-circle-size: calc(var(--kirby-spacing-xxxl) + var(--kirby-spacing-xl))}:host(.sm) .transcluded-content{font-size:var(--kirby-font-size-xs)}:host(.md) .transcluded-content,:host(.lg) .transcluded-content{font-size:var(--kirby-font-size-s)}.transcluded-content,kirby-progress-circle-ring{position:absolute;top:0;left:0}kirby-progress-circle-ring{z-index:calc(var(--kirby-z-index-default) + 1)}.transcluded-content{width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:var(--kirby-z-index-default);border-radius:var(--kirby-border-radius-circle);overflow:hidden}\n"]
+		}]
+	}],
+	ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }],
+	propDecorators: {
+		role: [{
+			type: HostBinding,
+			args: ["attr.role"]
+		}],
+		value: [{
+			type: HostBinding,
+			args: ["attr.aria-valuenow"]
+		}, { type: Input }],
+		size: [{ type: Input }],
+		themeColor: [{ type: Input }],
+		_cssSize: [{
+			type: HostBinding,
+			args: ["class"]
+		}]
+	}
+});
 export { ProgressCircleComponent, ProgressCircleRingComponent };
-//# sourceMappingURL=kirbydesign-designsystem-progress-circle.mjs.map
+
+//# sourceMappingURL=kirbydesign-designsystem-progress-circle.mjs.map

package/fesm2022/kirbydesign-designsystem-progress-circle.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kirbydesign-designsystem-progress-circle.mjs","sources":["../../progress-circle/src/progress-circle-ring.component.ts","../../progress-circle/src/progress-circle-ring.component.html","../../progress-circle/src/progress-circle.component.ts","../../progress-circle/src/progress-circle.component.html","../../progress-circle/src/kirbydesign-designsystem-progress-circle.ts"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  HostBinding,\n  Input,\n} from '@angular/core';\n\n@Component({\n  selector: 'kirby-progress-circle-ring',\n  templateUrl: './progress-circle-ring.component.html',\n  styleUrls: ['./progress-circle-ring.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ProgressCircleRingComponent implements AfterViewInit {\n  private readonly UPPER_AND_LOWER_BOUND_GAP = 2.5;\n\n  @Input() value: number = 0;\n  @Input() themeColor: 'success' | 'warning' | 'danger' = 'success';\n  @Input() size: 'sm' | 'md' | 'lg' = 'md';\n\n  @HostBinding('class')\n  get _sizeClass() {\n    return this.size;\n  }\n\n  @HostBinding('class.view-initialized')\n  viewInitialized;\n\n  ngAfterViewInit(): void {\n    this.viewInitialized = true;\n  }\n\n  get _progress(): number {\n    if (this.value <= 0) return 0;\n    if (this.value >= 100) return 100;\n    return Math.min(this.value, 100 - this.UPPER_AND_LOWER_BOUND_GAP);\n  }\n\n  get _linecap(): 'butt' | 'round' {\n    return this._progress <= 0 || this._progress >= 100 ? 'butt' : 'round';\n  }\n\n  get _remainder(): number {\n    return 100 - this._progress;\n  }\n}\n","<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n","import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  OnDestroy,\n} from '@angular/core';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\nimport { ProgressCircleRingComponent } from './progress-circle-ring.component';\n\n@Component({\n  imports: [ProgressCircleRingComponent, ThemeColorDirective],\n  selector: 'kirby-progress-circle',\n  templateUrl: './progress-circle.component.html',\n  styleUrls: ['./progress-circle.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ProgressCircleComponent implements AfterViewInit, OnDestroy {\n  @HostBinding('attr.role') readonly role = 'progressbar';\n  @HostBinding('attr.aria-valuenow')\n  @Input()\n  value: number = 0;\n  @Input() size: 'sm' | 'md' | 'lg' = 'md';\n  @Input() themeColor: 'success' | 'warning' | 'danger' = 'success';\n\n  @HostBinding('class')\n  get _cssSize() {\n    return this.size;\n  }\n\n  private hasElementBeenVisible?: boolean;\n  private observer: IntersectionObserver;\n\n  constructor(\n    private elementRef: ElementRef<HTMLElement>,\n    private changeDetectorRef: ChangeDetectorRef\n  ) {}\n\n  ngAfterViewInit(): void {\n    if (!this.observer) {\n      this.observer = new IntersectionObserver(this.onIntersectionChange, {\n        threshold: 0.5,\n      });\n      this.observer.observe(this.elementRef.nativeElement);\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.unobserve();\n  }\n\n  private onIntersectionChange = (entries: IntersectionObserverEntry[]) => {\n    this.hasElementBeenVisible = entries && entries.some((entry) => entry.isIntersecting);\n    if (this.hasElementBeenVisible) {\n      this.unobserve();\n      this.changeDetectorRef.markForCheck();\n    }\n  };\n\n  private unobserve() {\n    if (this.observer) {\n      this.observer.unobserve(this.elementRef.nativeElement);\n      // Safari does not support \"disconnect\", see: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility\n      if (typeof this.observer.disconnect === 'function') {\n        this.observer.disconnect();\n      }\n    }\n  }\n\n  get _shownValue() {\n    // This is needed to make an animation [0 -> value] when element is shown to the user\n    return this.hasElementBeenVisible ? this.value : 0;\n  }\n}\n","<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;MAca,2BAA2B,CAAA;AANxC,IAAA,WAAA,GAAA;QAOmB,IAAA,CAAA,yBAAyB,GAAG,GAAG;QAEvC,IAAA,CAAA,KAAK,GAAW,CAAC;QACjB,IAAA,CAAA,UAAU,GAAqC,SAAS;QACxD,IAAA,CAAA,IAAI,GAAuB,IAAI;AA2BzC,IAAA;AAzBC,IAAA,IACI,UAAU,GAAA;QACZ,OAAO,IAAI,CAAC,IAAI;IAClB;IAKA,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI;IAC7B;AAEA,IAAA,IAAI,SAAS,GAAA;AACX,QAAA,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC;AAAE,YAAA,OAAO,CAAC;AAC7B,QAAA,IAAI,IAAI,CAAC,KAAK,IAAI,GAAG;AAAE,YAAA,OAAO,GAAG;AACjC,QAAA,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI,CAAC,yBAAyB,CAAC;IACnE;AAEA,IAAA,IAAI,QAAQ,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,GAAG,GAAG,MAAM,GAAG,OAAO;IACxE;AAEA,IAAA,IAAI,UAAU,GAAA;AACZ,QAAA,OAAO,GAAG,GAAG,IAAI,CAAC,SAAS;IAC7B;kIA/BW,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA3B,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,2BAA2B,kQCdxC,+dAmBA,EAAA,MAAA,EAAA,CAAA,63BAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FDLa,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBANvC,SAAS;+BACE,4BAA4B,EAAA,eAAA,EAGrB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,+dAAA,EAAA,MAAA,EAAA,CAAA,63BAAA,CAAA,EAAA;;sBAK9C;;sBACA;;sBACA;;sBAEA,WAAW;uBAAC,OAAO;;sBAKnB,WAAW;uBAAC,wBAAwB;;;MEN1B,uBAAuB,CAAA;AAQlC,IAAA,IACI,QAAQ,GAAA;QACV,OAAO,IAAI,CAAC,IAAI;IAClB;IAKA,WAAA,CACU,UAAmC,EACnC,iBAAoC,EAAA;QADpC,IAAA,CAAA,UAAU,GAAV,UAAU;QACV,IAAA,CAAA,iBAAiB,GAAjB,iBAAiB;QAjBQ,IAAA,CAAA,IAAI,GAAG,aAAa;QAGvD,IAAA,CAAA,KAAK,GAAW,CAAC;QACR,IAAA,CAAA,IAAI,GAAuB,IAAI;QAC/B,IAAA,CAAA,UAAU,GAAqC,SAAS;AA4BzD,QAAA,IAAA,CAAA,oBAAoB,GAAG,CAAC,OAAoC,KAAI;AACtE,YAAA,IAAI,CAAC,qBAAqB,GAAG,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,cAAc,CAAC;AACrF,YAAA,IAAI,IAAI,CAAC,qBAAqB,EAAE;gBAC9B,IAAI,CAAC,SAAS,EAAE;AAChB,gBAAA,IAAI,CAAC,iBAAiB,CAAC,YAAY,EAAE;YACvC;AACF,QAAA,CAAC;IArBE;IAEH,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,QAAQ,GAAG,IAAI,oBAAoB,CAAC,IAAI,CAAC,oBAAoB,EAAE;AAClE,gBAAA,SAAS,EAAE,GAAG;AACf,aAAA,CAAC;YACF,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;QACtD;IACF;IAEA,WAAW,GAAA;QACT,IAAI,CAAC,SAAS,EAAE;IAClB;IAUQ,SAAS,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;;YAEtD,IAAI,OAAO,IAAI,CAAC,QAAQ,CAAC,UAAU,KAAK,UAAU,EAAE;AAClD,gBAAA,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;YAC5B;QACF;IACF;AAEA,IAAA,IAAI,WAAW,GAAA;;AAEb,QAAA,OAAO,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;IACpD;kIAvDW,uBAAuB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,OAAA,EAAA,eAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpBpC,sNAQA,EAAA,MAAA,EAAA,CAAA,wiCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDMY,2BAA2B,gHAAE,mBAAmB,EAAA,QAAA,EAAA,6OAAA,EAAA,MAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAM/C,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAPnC,SAAS;8BACC,CAAC,2BAA2B,EAAE,mBAAmB,CAAC,YACjD,uBAAuB,EAAA,eAAA,EAGhB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,sNAAA,EAAA,MAAA,EAAA,CAAA,wiCAAA,CAAA,EAAA;;sBAG9C,WAAW;uBAAC,WAAW;;sBACvB,WAAW;uBAAC,oBAAoB;;sBAChC;;sBAEA;;sBACA;;sBAEA,WAAW;uBAAC,OAAO;;;AE5BtB;;AAEG;;;;"}
+{"version":3,"file":"kirbydesign-designsystem-progress-circle.mjs","names":[],"sources":["../../progress-circle/src/progress-circle-ring.component.ts","../../progress-circle/src/progress-circle-ring.component.html","../../progress-circle/src/progress-circle.component.ts","../../progress-circle/src/progress-circle.component.html"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  HostBinding,\n  Input,\n} from '@angular/core';\n\n@Component({\n  selector: 'kirby-progress-circle-ring',\n  templateUrl: './progress-circle-ring.component.html',\n  styleUrls: ['./progress-circle-ring.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ProgressCircleRingComponent implements AfterViewInit {\n  private readonly UPPER_AND_LOWER_BOUND_GAP = 2.5;\n\n  @Input() value: number = 0;\n  @Input() themeColor: 'success' | 'warning' | 'danger' = 'success';\n  @Input() size: 'sm' | 'md' | 'lg' = 'md';\n\n  @HostBinding('class')\n  get _sizeClass() {\n    return this.size;\n  }\n\n  @HostBinding('class.view-initialized')\n  viewInitialized;\n\n  ngAfterViewInit(): void {\n    this.viewInitialized = true;\n  }\n\n  get _progress(): number {\n    if (this.value <= 0) return 0;\n    if (this.value >= 100) return 100;\n    return Math.min(this.value, 100 - this.UPPER_AND_LOWER_BOUND_GAP);\n  }\n\n  get _linecap(): 'butt' | 'round' {\n    return this._progress <= 0 || this._progress >= 100 ? 'butt' : 'round';\n  }\n\n  get _remainder(): number {\n    return 100 - this._progress;\n  }\n}\n","<svg width=\"100%\" height=\"100%\" aria-hidden=\"true\">\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"circle\"\n    fill=\"transparent\"\n    cx=\"50%\"\n    cy=\"50%\"\n  />\n  <circle\n    shape-rendering=\"geometricPrecision\"\n    class=\"progress\"\n    fill=\"transparent\"\n    pathLength=\"100\"\n    cx=\"50%\"\n    cy=\"50%\"\n    [attr.stroke-linecap]=\"_linecap\"\n    [attr.stroke-dasharray]=\"_progress + ' ' + _remainder\"\n  />\n</svg>\n","import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  OnDestroy,\n} from '@angular/core';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\nimport { ProgressCircleRingComponent } from './progress-circle-ring.component';\n\n@Component({\n  imports: [ProgressCircleRingComponent, ThemeColorDirective],\n  selector: 'kirby-progress-circle',\n  templateUrl: './progress-circle.component.html',\n  styleUrls: ['./progress-circle.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ProgressCircleComponent implements AfterViewInit, OnDestroy {\n  @HostBinding('attr.role') readonly role = 'progressbar';\n  @HostBinding('attr.aria-valuenow')\n  @Input()\n  value: number = 0;\n  @Input() size: 'sm' | 'md' | 'lg' = 'md';\n  @Input() themeColor: 'success' | 'warning' | 'danger' = 'success';\n\n  @HostBinding('class')\n  get _cssSize() {\n    return this.size;\n  }\n\n  private hasElementBeenVisible?: boolean;\n  private observer: IntersectionObserver;\n\n  constructor(\n    private elementRef: ElementRef<HTMLElement>,\n    private changeDetectorRef: ChangeDetectorRef\n  ) {}\n\n  ngAfterViewInit(): void {\n    if (!this.observer) {\n      this.observer = new IntersectionObserver(this.onIntersectionChange, {\n        threshold: 0.5,\n      });\n      this.observer.observe(this.elementRef.nativeElement);\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.unobserve();\n  }\n\n  private onIntersectionChange = (entries: IntersectionObserverEntry[]) => {\n    this.hasElementBeenVisible = entries && entries.some((entry) => entry.isIntersecting);\n    if (this.hasElementBeenVisible) {\n      this.unobserve();\n      this.changeDetectorRef.markForCheck();\n    }\n  };\n\n  private unobserve() {\n    if (this.observer) {\n      this.observer.unobserve(this.elementRef.nativeElement);\n      // Safari does not support \"disconnect\", see: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility\n      if (typeof this.observer.disconnect === 'function') {\n        this.observer.disconnect();\n      }\n    }\n  }\n\n  get _shownValue() {\n    // This is needed to make an animation [0 -> value] when element is shown to the user\n    return this.hasElementBeenVisible ? this.value : 0;\n  }\n}\n","<div class=\"transcluded-content\">\n  <ng-content></ng-content>\n</div>\n<kirby-progress-circle-ring\n  [themeColor]=\"themeColor\"\n  [value]=\"_shownValue\"\n  [size]=\"size\"\n></kirby-progress-circle-ring>\n"],"mappings":"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"}