@breadstone/mosaik-elements-angular 0.0.217 → 0.0.218

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+## 0.0.218 (2026-01-15)
+
+### 🚀 Features
+
+- **meter:** enhance MeterRing and MeterBar components with new styles and properties ([026b313a58](https://github.com/RueDeRennes/mosaik/commit/026b313a58))
+
 ## 0.0.217 (2026-01-09)
 
 ### 🚀 Features

package/fesm2022/mosaik-elements-angular.mjs

@@ -3205,14 +3205,14 @@ let BadgeComponent = class BadgeComponent {
             this._element.overlap = value;
         });
     }
-    get standalone() {
+    get attached() {
         // @ts-ignore - temporary fix for the type error
-        return this._element.standalone;
+        return this._element.attached;
     }
-    set standalone(value) {
+    set attached(value) {
         this._zone.runOutsideAngular(() => {
             // @ts-ignore - temporary fix for the type error
-            this._element.standalone = value;
+            this._element.attached = value;
         });
     }
     get position() {
@@ -3326,12 +3326,12 @@ let BadgeComponent = class BadgeComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: BadgeComponent, isStandalone: true, selector: "mosaik-badge", inputs: { icon: "icon", overlap: "overlap", standalone: "standalone", position: "position", themeName: "themeName", appearance: "appearance", variant: "variant", size: "size", disabled: "disabled", label: "label", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: BadgeComponent, isStandalone: true, selector: "mosaik-badge", inputs: { icon: "icon", overlap: "overlap", attached: "attached", position: "position", themeName: "themeName", appearance: "appearance", variant: "variant", size: "size", disabled: "disabled", label: "label", dir: "dir", lang: "lang" }, outputs: { connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 BadgeComponent = __decorate$3O([
     ProxyCmp({
         defineCustomElementFn: () => customElements.define('mosaik-badge', BadgeElement),
-        inputs: ['icon', 'overlap', 'standalone', 'position', 'themeName', 'appearance', 'variant', 'size', 'disabled', 'label', 'dir', 'lang'],
+        inputs: ['icon', 'overlap', 'attached', 'position', 'themeName', 'appearance', 'variant', 'size', 'disabled', 'label', 'dir', 'lang'],
         methods: ['adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
     }),
     __metadata$3O("design:paramtypes", [])
@@ -3343,14 +3343,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
-                    inputs: ['icon', 'overlap', 'standalone', 'position', 'themeName', 'appearance', 'variant', 'size', 'disabled', 'label', 'dir', 'lang'],
+                    inputs: ['icon', 'overlap', 'attached', 'position', 'themeName', 'appearance', 'variant', 'size', 'disabled', 'label', 'dir', 'lang'],
                     outputs: ['connected', 'disconnected', 'changed']
                 }]
         }], ctorParameters: () => [], propDecorators: { icon: [{
                 type: Input
             }], overlap: [{
                 type: Input
-            }], standalone: [{
+            }], attached: [{
                 type: Input
             }], position: [{
                 type: Input
@@ -12469,7 +12469,6 @@ const CHECKBOX_DEFAULT_PROPS = new InjectionToken('MOSAIK_CHECKBOX_DEFAULT_PROPS
  *
  * @slot checkmark - The checkmark slot.
  * @slot label - The label slot.
- * @slot hint - The hint slot.
  */
 let CheckboxComponent = class CheckboxComponent {
     _element;
@@ -35323,6 +35322,26 @@ let MeterBarComponent = class MeterBarComponent {
         this._element.on('changed', (e) => this.onEmit(this._changed, e));
         applyDefaults(this._element, inject(METER_BAR_DEFAULT_PROPS, { optional: true }) ?? {});
     }
+    get percent() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.percent;
+    }
+    set percent(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.percent = value;
+        });
+    }
+    get segments() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.segments;
+    }
+    set segments(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.segments = value;
+        });
+    }
     get thickness() {
         // @ts-ignore - temporary fix for the type error
         return this._element.thickness;
@@ -35373,6 +35392,16 @@ let MeterBarComponent = class MeterBarComponent {
             this._element.range = value;
         });
     }
+    get scale() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.scale;
+    }
+    set scale(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.scale = value;
+        });
+    }
     get themeName() {
         // @ts-ignore - temporary fix for the type error
         return this._element.themeName;
@@ -35497,12 +35526,12 @@ let MeterBarComponent = class MeterBarComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MeterBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MeterBarComponent, isStandalone: true, selector: "mosaik-meter-bar", inputs: { thickness: "thickness", high: "high", low: "low", optimum: "optimum", range: "range", themeName: "themeName", variant: "variant", orientation: "orientation", disabled: "disabled", label: "label", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MeterBarComponent, isStandalone: true, selector: "mosaik-meter-bar", inputs: { percent: "percent", segments: "segments", thickness: "thickness", high: "high", low: "low", optimum: "optimum", range: "range", scale: "scale", themeName: "themeName", variant: "variant", orientation: "orientation", disabled: "disabled", label: "label", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 MeterBarComponent = __decorate$1F([
     ProxyCmp({
         defineCustomElementFn: () => customElements.define('mosaik-meter-bar', MeterBarElement),
-        inputs: ['thickness', 'high', 'low', 'optimum', 'range', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
+        inputs: ['percent', 'segments', 'thickness', 'high', 'low', 'optimum', 'range', 'scale', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
         methods: ['adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
     }),
     __metadata$1F("design:paramtypes", [])
@@ -35514,10 +35543,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
-                    inputs: ['thickness', 'high', 'low', 'optimum', 'range', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
+                    inputs: ['percent', 'segments', 'thickness', 'high', 'low', 'optimum', 'range', 'scale', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
                     outputs: ['valueChanged', 'connected', 'disconnected', 'changed']
                 }]
-        }], ctorParameters: () => [], propDecorators: { thickness: [{
+        }], ctorParameters: () => [], propDecorators: { percent: [{
+                type: Input
+            }], segments: [{
+                type: Input
+            }], thickness: [{
                 type: Input
             }], high: [{
                 type: Input
@@ -35527,6 +35560,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                 type: Input
             }], range: [{
                 type: Input
+            }], scale: [{
+                type: Input
             }], themeName: [{
                 type: Input
             }], variant: [{
@@ -35589,7 +35624,8 @@ const METER_RING_DEFAULT_PROPS = new InjectionToken('MOSAIK_METER_RING_DEFAULT_P
 /**
  * @public
  *
- *
+ * @slot label - Text label content area for meter description or value display
+ * @slot hint - Secondary text content area for additional meter information or status
  */
 let MeterRingComponent = class MeterRingComponent {
     _element;
@@ -35612,6 +35648,26 @@ let MeterRingComponent = class MeterRingComponent {
         this._element.on('changed', (e) => this.onEmit(this._changed, e));
         applyDefaults(this._element, inject(METER_RING_DEFAULT_PROPS, { optional: true }) ?? {});
     }
+    get segments() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.segments;
+    }
+    set segments(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.segments = value;
+        });
+    }
+    get effectiveRadius() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.effectiveRadius;
+    }
+    set effectiveRadius(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.effectiveRadius = value;
+        });
+    }
     get radius() {
         // @ts-ignore - temporary fix for the type error
         return this._element.radius;
@@ -35672,6 +35728,16 @@ let MeterRingComponent = class MeterRingComponent {
             this._element.range = value;
         });
     }
+    get scale() {
+        // @ts-ignore - temporary fix for the type error
+        return this._element.scale;
+    }
+    set scale(value) {
+        this._zone.runOutsideAngular(() => {
+            // @ts-ignore - temporary fix for the type error
+            this._element.scale = value;
+        });
+    }
     get themeName() {
         // @ts-ignore - temporary fix for the type error
         return this._element.themeName;
@@ -35796,12 +35862,12 @@ let MeterRingComponent = class MeterRingComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MeterRingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MeterRingComponent, isStandalone: true, selector: "mosaik-meter-ring", inputs: { radius: "radius", thickness: "thickness", high: "high", low: "low", optimum: "optimum", range: "range", themeName: "themeName", variant: "variant", orientation: "orientation", disabled: "disabled", label: "label", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MeterRingComponent, isStandalone: true, selector: "mosaik-meter-ring", inputs: { segments: "segments", effectiveRadius: "effectiveRadius", radius: "radius", thickness: "thickness", high: "high", low: "low", optimum: "optimum", range: "range", scale: "scale", themeName: "themeName", variant: "variant", orientation: "orientation", disabled: "disabled", label: "label", min: "min", max: "max", value: "value", dir: "dir", lang: "lang" }, outputs: { valueChanged: "valueChanged", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 MeterRingComponent = __decorate$1E([
     ProxyCmp({
         defineCustomElementFn: () => customElements.define('mosaik-meter-ring', MeterRingElement),
-        inputs: ['radius', 'thickness', 'high', 'low', 'optimum', 'range', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
+        inputs: ['segments', 'effectiveRadius', 'radius', 'thickness', 'high', 'low', 'optimum', 'range', 'scale', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
         methods: ['adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
     }),
     __metadata$1E("design:paramtypes", [])
@@ -35813,10 +35879,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
-                    inputs: ['radius', 'thickness', 'high', 'low', 'optimum', 'range', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
+                    inputs: ['segments', 'effectiveRadius', 'radius', 'thickness', 'high', 'low', 'optimum', 'range', 'scale', 'themeName', 'variant', 'orientation', 'disabled', 'label', 'min', 'max', 'value', 'dir', 'lang'],
                     outputs: ['valueChanged', 'connected', 'disconnected', 'changed']
                 }]
-        }], ctorParameters: () => [], propDecorators: { radius: [{
+        }], ctorParameters: () => [], propDecorators: { segments: [{
+                type: Input
+            }], effectiveRadius: [{
+                type: Input
+            }], radius: [{
                 type: Input
             }], thickness: [{
                 type: Input
@@ -35828,6 +35898,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                 type: Input
             }], range: [{
                 type: Input
+            }], scale: [{
+                type: Input
             }], themeName: [{
                 type: Input
             }], variant: [{
@@ -41519,7 +41591,6 @@ const RADIO_DEFAULT_PROPS = new InjectionToken('MOSAIK_RADIO_DEFAULT_PROPS');
  *
  * @slot checkmark - The checkmark slot.
  * @slot label - The label slot.
- * @slot hint - The hint slot.
  */
 let RadioComponent = class RadioComponent {
     _element;
@@ -51181,7 +51252,8 @@ const SUMMARY_DEFAULT_PROPS = new InjectionToken('MOSAIK_SUMMARY_DEFAULT_PROPS')
  * @slot  - The default slot.
  * @slot prefix - The prefix slot.
  * @slot suffix - The suffix slot.
- * @slot text - The text slot.
+ * @slot header - The header slot.
+ * @slot content - The content slot.
  */
 let SummaryComponent = class SummaryComponent {
     _element;