@gravionlabs/helix-core 22.1.1 → 22.1.3

package/fesm2022/gravionlabs-helix-core-metergroup.mjs

@@ -1,16 +1,15 @@
-export * from '@gravionlabs/helix-core/types/metergroup';
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, input, inject, forwardRef, ChangeDetectionStrategy, Component, contentChild, contentChildren, ViewEncapsulation, NgModule } from '@angular/core';
-import { getOuterHeight } from '@gravionlabs/helix-core/uix/utils';
-import { SharedModule, HelixTemplate } from '@gravionlabs/helix-core/api';
-import { BaseComponent, PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';
-import * as i2 from '@gravionlabs/helix-core/bind';
-import { Bind } from '@gravionlabs/helix-core/bind';
-import { BaseStyle } from '@gravionlabs/helix-core/base';
-
-const style = /*css*/ `
+import * as i1 from "@angular/common";
+import { CommonModule } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Injectable, InjectionToken, NgModule, ViewEncapsulation, contentChild, contentChildren, forwardRef, inject, input } from "@angular/core";
+import { getOuterHeight } from "@gravionlabs/helix-core/uix/utils";
+import { HelixTemplate, SharedModule } from "@gravionlabs/helix-core/api";
+import { BaseComponent, PARENT_INSTANCE } from "@gravionlabs/helix-core/basecomponent";
+import * as i2 from "@gravionlabs/helix-core/bind";
+import { Bind } from "@gravionlabs/helix-core/bind";
+import { BaseStyle } from "@gravionlabs/helix-core/base";
+export * from "@gravionlabs/helix-core/types/metergroup";
+const style = `
     .h-metergroup {
         display: flex;
         gap: dt('metergroup.gap');
@@ -100,318 +99,715 @@ const style = /*css*/ `
         border-end-end-radius: dt('metergroup.border.radius');
     }
 `;
-
 const classes = {
-    root: ({ instance }) => [
-        'h-metergroup h-component',
-        {
-            'h-metergroup-horizontal': instance.orientation() === 'horizontal',
-            'h-metergroup-vertical': instance.orientation() === 'vertical'
-        }
-    ],
-    meters: 'h-metergroup-meters',
-    meter: 'h-metergroup-meter',
-    labelList: ({ instance }) => [
-        'h-metergroup-label-list',
-        {
-            'h-metergroup-label-list-vertical': instance.labelOrientation() === 'vertical',
-            'h-metergroup-label-list-horizontal': instance.labelOrientation() === 'horizontal'
-        }
-    ],
-    label: 'h-metergroup-label',
-    labelIcon: 'h-metergroup-label-icon',
-    labelMarker: 'h-metergroup-label-marker',
-    labelText: 'h-metergroup-label-text'
+	root: ({ instance }) => ["h-metergroup h-component", {
+		"h-metergroup-horizontal": instance.orientation() === "horizontal",
+		"h-metergroup-vertical": instance.orientation() === "vertical"
+	}],
+	meters: "h-metergroup-meters",
+	meter: "h-metergroup-meter",
+	labelList: ({ instance }) => ["h-metergroup-label-list", {
+		"h-metergroup-label-list-vertical": instance.labelOrientation() === "vertical",
+		"h-metergroup-label-list-horizontal": instance.labelOrientation() === "horizontal"
+	}],
+	label: "h-metergroup-label",
+	labelIcon: "h-metergroup-label-icon",
+	labelMarker: "h-metergroup-label-marker",
+	labelText: "h-metergroup-label-text"
+};
+var MeterGroupStyle = class MeterGroupStyle extends BaseStyle {
+	name = "metergroup";
+	style = style;
+	classes = classes;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupStyle
+	});
 };
-class MeterGroupStyle extends BaseStyle {
-    name = 'metergroup';
-    style = style;
-    classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * MeterGroup is a group of process status indicators.
- *
- * [Live Demo](https://www.primeng.org/metergroup)
- *
- * @module metergroupstyle
- *
- */
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: MeterGroupStyle,
+	decorators: [{ type: Injectable }]
+});
 var MeterGroupClasses;
-(function (MeterGroupClasses) {
-    /**
-     * Class name of the root element
-     */
-    MeterGroupClasses["root"] = "h-metergroup";
-    /**
-     * Class name of the meters element
-     */
-    MeterGroupClasses["meters"] = "h-metergroup-meters";
-    /**
-     * Class name of the meter element
-     */
-    MeterGroupClasses["meter"] = "h-metergroup-meter";
-    /**
-     * Class name of the label list element
-     */
-    MeterGroupClasses["labelList"] = "h-metergroup-label-list";
-    /**
-     * Class name of the label element
-     */
-    MeterGroupClasses["label"] = "h-metergroup-label";
-    /**
-     * Class name of the label icon element
-     */
-    MeterGroupClasses["labelIcon"] = "h-metergroup-label-icon";
-    /**
-     * Class name of the label marker element
-     */
-    MeterGroupClasses["labelMarker"] = "h-metergroup-label-marker";
-    /**
-     * Class name of the label text element
-     */
-    MeterGroupClasses["labelText"] = "h-metergroup-label-text";
+(function(MeterGroupClasses) {
+	MeterGroupClasses["root"] = "h-metergroup";
+	MeterGroupClasses["meters"] = "h-metergroup-meters";
+	MeterGroupClasses["meter"] = "h-metergroup-meter";
+	MeterGroupClasses["labelList"] = "h-metergroup-label-list";
+	MeterGroupClasses["label"] = "h-metergroup-label";
+	MeterGroupClasses["labelIcon"] = "h-metergroup-label-icon";
+	MeterGroupClasses["labelMarker"] = "h-metergroup-label-marker";
+	MeterGroupClasses["labelText"] = "h-metergroup-label-text";
 })(MeterGroupClasses || (MeterGroupClasses = {}));
-
-const METERGROUP_INSTANCE = new InjectionToken('METERGROUP_INSTANCE');
-class MeterGroupLabel extends BaseComponent {
-    value = input([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    labelPosition = input('end', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
-    labelOrientation = input('horizontal', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "labelOrientation" }] : /* istanbul ignore next */ []));
-    min = input(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-    max = input(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    iconTemplate = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "iconTemplate" }] : /* istanbul ignore next */ []));
-    parentInstance = inject(forwardRef(() => MeterGroup));
-    _componentStyle = inject(MeterGroupStyle);
-    get dataP() {
-        return this.cn({
-            [this.labelOrientation()]: this.labelOrientation()
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupLabel, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: MeterGroupLabel, isStandalone: true, selector: "h-meterGroupLabel, h-metergrouplabel", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, labelOrientation: { classPropertyName: "labelOrientation", publicName: "labelOrientation", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, iconTemplate: { classPropertyName: "iconTemplate", publicName: "iconTemplate", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<ol [class]=\"cx('labelList')\" [hBind]=\"ptm('labelList')\" [attr.data-h]=\"dataP\">\n  @for (labelItem of value(); track parentInstance.trackByFn(index); let index = $index) {\n    <li [class]=\"cx('label')\" [hBind]=\"ptm('label')\">\n      @if (!iconTemplate()) {\n        @if (labelItem.icon) {\n          <i [class]=\"labelItem.icon\" [ngClass]=\"cx('labelIcon')\" [hBind]=\"ptm('labelIcon')\" [ngStyle]=\"{ color: labelItem.color }\"></i>\n        }\n        @if (!labelItem.icon) {\n          <span [class]=\"cx('labelMarker')\" [hBind]=\"ptm('labelMarker')\" [ngStyle]=\"{ backgroundColor: labelItem.color }\"></span>\n        }\n      }\n      <ng-container *ngTemplateOutlet=\"iconTemplate(); context: { $implicit: labelItem, icon: labelItem.icon }\"></ng-container>\n      <span [class]=\"cx('labelText')\" [hBind]=\"ptm('labelText')\">{{ labelItem.label }} ({{ parentInstance.percentValue(labelItem.value) }})</span>\n    </li>\n  }\n</ol>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: Bind, selector: "[hBind]", inputs: ["hBind"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupLabel, decorators: [{
-            type: Component,
-            args: [{ selector: 'h-meterGroupLabel, h-metergrouplabel', standalone: true, imports: [CommonModule, SharedModule, Bind], changeDetection: ChangeDetectionStrategy.Eager, template: "<ol [class]=\"cx('labelList')\" [hBind]=\"ptm('labelList')\" [attr.data-h]=\"dataP\">\n  @for (labelItem of value(); track parentInstance.trackByFn(index); let index = $index) {\n    <li [class]=\"cx('label')\" [hBind]=\"ptm('label')\">\n      @if (!iconTemplate()) {\n        @if (labelItem.icon) {\n          <i [class]=\"labelItem.icon\" [ngClass]=\"cx('labelIcon')\" [hBind]=\"ptm('labelIcon')\" [ngStyle]=\"{ color: labelItem.color }\"></i>\n        }\n        @if (!labelItem.icon) {\n          <span [class]=\"cx('labelMarker')\" [hBind]=\"ptm('labelMarker')\" [ngStyle]=\"{ backgroundColor: labelItem.color }\"></span>\n        }\n      }\n      <ng-container *ngTemplateOutlet=\"iconTemplate(); context: { $implicit: labelItem, icon: labelItem.icon }\"></ng-container>\n      <span [class]=\"cx('labelText')\" [hBind]=\"ptm('labelText')\">{{ labelItem.label }} ({{ parentInstance.percentValue(labelItem.value) }})</span>\n    </li>\n  }\n</ol>\n" }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], labelOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelOrientation", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], iconTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconTemplate", required: false }] }] } });
-/**
- * MeterGroup displays scalar measurements within a known range.
- * @group Components
- */
-class MeterGroup extends BaseComponent {
-    componentName = 'MeterGroup';
-    $pcMeterGroup = inject(METERGROUP_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    bindDirectiveInstance = inject(Bind, { self: true });
-    /**
-     * Current value of the metergroup.
-     * @group Props
-     */
-    value = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-    /**
-     * Mininum boundary value.
-     * @group Props
-     */
-    min = input(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-    /**
-     * Maximum boundary value.
-     * @group Props
-     */
-    max = input(100, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    /**
-     * Specifies the layout of the component, valid values are 'horizontal' and 'vertical'.
-     * @group Props
-     */
-    orientation = input('horizontal', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
-    /**
-     * Specifies the label position of the component, valid values are 'start' and 'end'.
-     * @group Props
-     */
-    labelPosition = input('end', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
-    /**
-     * Specifies the label orientation of the component, valid values are 'horizontal' and 'vertical'.
-     * @group Props
-     */
-    labelOrientation = input('horizontal', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "labelOrientation" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class of the element.
-     * @deprecated since v20.0.0, use `class` instead.
-     * @group Props
-     */
-    styleClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "styleClass" }] : /* istanbul ignore next */ []));
-    get vertical() {
-        return this.orientation() === 'vertical';
-    }
-    /**
-     * Custom label template.
-     * @param {MeterGroupLabelTemplateContext} context - label context.
-     * @see {@link MeterGroupLabelTemplateContext}
-     * @group Templates
-     */
-    labelTemplate = contentChild('label', { ...(ngDevMode ? { debugName: "labelTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom meter template.
-     * @param {MeterGroupMeterTemplateContext} context - meter context.
-     * @see {@link MeterGroupMeterTemplateContext}
-     * @group Templates
-     */
-    meterTemplate = contentChild('meter', { ...(ngDevMode ? { debugName: "meterTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom end template.
-     * @param {MeterGroupLabelTemplateContext} context - end context.
-     * @see {@link MeterGroupLabelTemplateContext}
-     * @group Templates
-     */
-    endTemplate = contentChild('end', { ...(ngDevMode ? { debugName: "endTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom start template.
-     * @param {MeterGroupLabelTemplateContext} context - start context.
-     * @see {@link MeterGroupLabelTemplateContext}
-     * @group Templates
-     */
-    startTemplate = contentChild('start', { ...(ngDevMode ? { debugName: "startTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom icon template.
-     * @param {MeterGroupIconTemplateContext} context - icon context.
-     * @see {@link MeterGroupIconTemplateContext}
-     * @group Templates
-     */
-    iconTemplate = contentChild('icon', { ...(ngDevMode ? { debugName: "iconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    templates = contentChildren(HelixTemplate, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
-    _labelTemplate;
-    _meterTemplate;
-    _endTemplate;
-    _startTemplate;
-    _iconTemplate;
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
-    }
-    _componentStyle = inject(MeterGroupStyle);
-    constructor() {
-        super();
-    }
-    onAfterViewInit() {
-        const _container = this.el.nativeElement;
-        const height = getOuterHeight(_container);
-        this.vertical && (_container.style.height = height + 'px');
-    }
-    onAfterContentInit() {
-        this.templates()?.forEach((item) => {
-            switch (item.getType()) {
-                case 'label':
-                    this._labelTemplate = item.template;
-                    break;
-                case 'meter':
-                    this._meterTemplate = item.template;
-                    break;
-                case 'icon':
-                    this._iconTemplate = item.template;
-                    break;
-                case 'start':
-                    this._startTemplate = item.template;
-                    break;
-                case 'end':
-                    this._endTemplate = item.template;
-                    break;
-            }
-        });
-    }
-    percent(meter = 0) {
-        const max = this.max();
-        const min = this.min();
-        if (max === min) {
-            return 100; // When min = max, any value should be 100%
-        }
-        const percentOfItem = ((meter - min) / (max - min)) * 100;
-        return Math.round(Math.max(0, Math.min(100, percentOfItem)));
-    }
-    percentValue(meter) {
-        return this.percent(meter) + '%';
-    }
-    meterStyle(val) {
-        return {
-            backgroundColor: val.color,
-            width: this.orientation() === 'horizontal' && this.percentValue(val.value || 0),
-            height: this.orientation() === 'vertical' && this.percentValue(val.value || 0)
-        };
-    }
-    totalPercent() {
-        const value = this.value();
-        if (!value) {
-            return 0;
-        }
-        return this.percent(value.reduce((total, val) => total + (val.value || 0), 0));
-    }
-    percentages() {
-        const value = this.value();
-        if (!value) {
-            return [];
-        }
-        let sum = 0;
-        const sumsArray = [];
-        value.forEach((item) => {
-            sum += item.value || 0;
-            sumsArray.push(sum);
-        });
-        return sumsArray;
-    }
-    trackByFn(index) {
-        return index;
-    }
-    get dataP() {
-        return this.cn({
-            [this.orientation()]: this.orientation()
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: MeterGroup, isStandalone: true, selector: "h-meterGroup, h-metergroup, h-meter-group", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, labelOrientation: { classPropertyName: "labelOrientation", publicName: "labelOrientation", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-valuemin": "min()", "attr.role": "\"meter\"", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "totalPercent()", "attr.data-h": "dataP", "class": "cn(cx('root'), styleClass())" } }, providers: [MeterGroupStyle, { provide: METERGROUP_INSTANCE, useExisting: MeterGroup }, { provide: PARENT_INSTANCE, useExisting: MeterGroup }], queries: [{ propertyName: "labelTemplate", first: true, predicate: ["label"], isSignal: true }, { propertyName: "meterTemplate", first: true, predicate: ["meter"], isSignal: true }, { propertyName: "endTemplate", first: true, predicate: ["end"], isSignal: true }, { propertyName: "startTemplate", first: true, predicate: ["start"], isSignal: true }, { propertyName: "iconTemplate", first: true, predicate: ["icon"], isSignal: true }, { propertyName: "templates", predicate: HelixTemplate, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i2.Bind }], ngImport: i0, template: "@if (labelPosition() === 'start') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || labelTemplate(); context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n<ng-container *ngTemplateOutlet=\"startTemplate() || _startTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n<div [class]=\"cx('meters')\" [hBind]=\"ptm('meters')\" [attr.data-h]=\"dataP\">\n  @for (meterItem of value(); track trackByFn(index); let index = $index) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                meterTemplate() || _meterTemplate;\n                context: {\n                    $implicit: meterItem,\n                    index: index,\n                    orientation: this.orientation(),\n                    class: cx('meter'),\n                    size: percentValue(meterItem.value),\n                    totalPercent: totalPercent(),\n                    dataP: dataP\n                }\n            \"\n    >\n  </ng-container>\n  @if (!meterTemplate() && !_meterTemplate && meterItem.value > 0) {\n    <span [class]=\"cx('meter')\" [attr.data-h]=\"dataP\" [hBind]=\"ptm('meter')\" [ngStyle]=\"meterStyle(meterItem)\"></span>\n  }\n}\n</div>\n<ng-container *ngTemplateOutlet=\"endTemplate() || _endTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n@if (labelPosition() === 'end') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || _labelTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MeterGroupLabel, selector: "h-meterGroupLabel, h-metergrouplabel", inputs: ["value", "labelPosition", "labelOrientation", "min", "max", "iconTemplate"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: Bind, selector: "[hBind]", inputs: ["hBind"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroup, decorators: [{
-            type: Component,
-            args: [{ selector: 'h-meterGroup, h-metergroup, h-meter-group', standalone: true, imports: [CommonModule, MeterGroupLabel, SharedModule, Bind], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [MeterGroupStyle, { provide: METERGROUP_INSTANCE, useExisting: MeterGroup }, { provide: PARENT_INSTANCE, useExisting: MeterGroup }], host: {
-                        '[attr.aria-valuemin]': 'min()',
-                        '[attr.role]': '"meter"',
-                        '[attr.aria-valuemax]': 'max()',
-                        '[attr.aria-valuenow]': 'totalPercent()',
-                        '[attr.data-h]': 'dataP',
-                        '[class]': "cn(cx('root'), styleClass())"
-                    }, hostDirectives: [Bind], template: "@if (labelPosition() === 'start') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || labelTemplate(); context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n<ng-container *ngTemplateOutlet=\"startTemplate() || _startTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n<div [class]=\"cx('meters')\" [hBind]=\"ptm('meters')\" [attr.data-h]=\"dataP\">\n  @for (meterItem of value(); track trackByFn(index); let index = $index) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                meterTemplate() || _meterTemplate;\n                context: {\n                    $implicit: meterItem,\n                    index: index,\n                    orientation: this.orientation(),\n                    class: cx('meter'),\n                    size: percentValue(meterItem.value),\n                    totalPercent: totalPercent(),\n                    dataP: dataP\n                }\n            \"\n    >\n  </ng-container>\n  @if (!meterTemplate() && !_meterTemplate && meterItem.value > 0) {\n    <span [class]=\"cx('meter')\" [attr.data-h]=\"dataP\" [hBind]=\"ptm('meter')\" [ngStyle]=\"meterStyle(meterItem)\"></span>\n  }\n}\n</div>\n<ng-container *ngTemplateOutlet=\"endTemplate() || _endTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n@if (labelPosition() === 'end') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || _labelTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n" }]
-        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], labelOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelOrientation", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], labelTemplate: [{ type: i0.ContentChild, args: ['label', { ...{ descendants: false }, isSignal: true }] }], meterTemplate: [{ type: i0.ContentChild, args: ['meter', { ...{ descendants: false }, isSignal: true }] }], endTemplate: [{ type: i0.ContentChild, args: ['end', { ...{ descendants: false }, isSignal: true }] }], startTemplate: [{ type: i0.ContentChild, args: ['start', { ...{ descendants: false }, isSignal: true }] }], iconTemplate: [{ type: i0.ContentChild, args: ['icon', { ...{ descendants: false }, isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
-class MeterGroupModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupModule, imports: [MeterGroup, SharedModule], exports: [MeterGroup, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupModule, imports: [MeterGroup, SharedModule, SharedModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: MeterGroupModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [MeterGroup, SharedModule],
-                    exports: [MeterGroup, SharedModule]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+const METERGROUP_INSTANCE = new InjectionToken("METERGROUP_INSTANCE");
+var MeterGroupLabel = class MeterGroupLabel extends BaseComponent {
+	value = input([], ...ngDevMode ? [{ debugName: "value" }] : 	/* istanbul ignore next */ []);
+	labelPosition = input("end", ...ngDevMode ? [{ debugName: "labelPosition" }] : 	/* istanbul ignore next */ []);
+	labelOrientation = input("horizontal", ...ngDevMode ? [{ debugName: "labelOrientation" }] : 	/* istanbul ignore next */ []);
+	min = input(void 0, ...ngDevMode ? [{ debugName: "min" }] : 	/* istanbul ignore next */ []);
+	max = input(void 0, ...ngDevMode ? [{ debugName: "max" }] : 	/* istanbul ignore next */ []);
+	iconTemplate = input(...ngDevMode ? [void 0, { debugName: "iconTemplate" }] : 	/* istanbul ignore next */ []);
+	parentInstance = inject(forwardRef(() => MeterGroup));
+	_componentStyle = inject(MeterGroupStyle);
+	get dataP() {
+		return this.cn({ [this.labelOrientation()]: this.labelOrientation() });
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupLabel,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: MeterGroupLabel,
+		isStandalone: true,
+		selector: "h-meterGroupLabel, h-metergrouplabel",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			labelPosition: {
+				classPropertyName: "labelPosition",
+				publicName: "labelPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			labelOrientation: {
+				classPropertyName: "labelOrientation",
+				publicName: "labelOrientation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			min: {
+				classPropertyName: "min",
+				publicName: "min",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			max: {
+				classPropertyName: "max",
+				publicName: "max",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			iconTemplate: {
+				classPropertyName: "iconTemplate",
+				publicName: "iconTemplate",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		usesInheritance: true,
+		ngImport: i0,
+		template: "<ol [class]=\"cx('labelList')\" [hBind]=\"ptm('labelList')\" [attr.data-h]=\"dataP\">\n  @for (labelItem of value(); track parentInstance.trackByFn(index); let index = $index) {\n    <li [class]=\"cx('label')\" [hBind]=\"ptm('label')\">\n      @if (!iconTemplate()) {\n        @if (labelItem.icon) {\n          <i [class]=\"labelItem.icon\" [ngClass]=\"cx('labelIcon')\" [hBind]=\"ptm('labelIcon')\" [ngStyle]=\"{ color: labelItem.color }\"></i>\n        }\n        @if (!labelItem.icon) {\n          <span [class]=\"cx('labelMarker')\" [hBind]=\"ptm('labelMarker')\" [ngStyle]=\"{ backgroundColor: labelItem.color }\"></span>\n        }\n      }\n      <ng-container *ngTemplateOutlet=\"iconTemplate(); context: { $implicit: labelItem, icon: labelItem.icon }\"></ng-container>\n      <span [class]=\"cx('labelText')\" [hBind]=\"ptm('labelText')\">{{ labelItem.label }} ({{ parentInstance.percentValue(labelItem.value) }})</span>\n    </li>\n  }\n</ol>\n",
+		dependencies: [
+			{
+				kind: "ngmodule",
+				type: CommonModule
+			},
+			{
+				kind: "directive",
+				type: i1.NgClass,
+				selector: "[ngClass]",
+				inputs: ["class", "ngClass"]
+			},
+			{
+				kind: "directive",
+				type: i1.NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "directive",
+				type: i1.NgStyle,
+				selector: "[ngStyle]",
+				inputs: ["ngStyle"]
+			},
+			{
+				kind: "ngmodule",
+				type: SharedModule
+			},
+			{
+				kind: "directive",
+				type: Bind,
+				selector: "[hBind]",
+				inputs: ["hBind"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.Eager
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: MeterGroupLabel,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "h-meterGroupLabel, h-metergrouplabel",
+			standalone: true,
+			imports: [
+				CommonModule,
+				SharedModule,
+				Bind
+			],
+			changeDetection: ChangeDetectionStrategy.Eager,
+			template: "<ol [class]=\"cx('labelList')\" [hBind]=\"ptm('labelList')\" [attr.data-h]=\"dataP\">\n  @for (labelItem of value(); track parentInstance.trackByFn(index); let index = $index) {\n    <li [class]=\"cx('label')\" [hBind]=\"ptm('label')\">\n      @if (!iconTemplate()) {\n        @if (labelItem.icon) {\n          <i [class]=\"labelItem.icon\" [ngClass]=\"cx('labelIcon')\" [hBind]=\"ptm('labelIcon')\" [ngStyle]=\"{ color: labelItem.color }\"></i>\n        }\n        @if (!labelItem.icon) {\n          <span [class]=\"cx('labelMarker')\" [hBind]=\"ptm('labelMarker')\" [ngStyle]=\"{ backgroundColor: labelItem.color }\"></span>\n        }\n      }\n      <ng-container *ngTemplateOutlet=\"iconTemplate(); context: { $implicit: labelItem, icon: labelItem.icon }\"></ng-container>\n      <span [class]=\"cx('labelText')\" [hBind]=\"ptm('labelText')\">{{ labelItem.label }} ({{ parentInstance.percentValue(labelItem.value) }})</span>\n    </li>\n  }\n</ol>\n"
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		labelPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "labelPosition",
+				required: false
+			}]
+		}],
+		labelOrientation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "labelOrientation",
+				required: false
+			}]
+		}],
+		min: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "min",
+				required: false
+			}]
+		}],
+		max: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "max",
+				required: false
+			}]
+		}],
+		iconTemplate: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "iconTemplate",
+				required: false
+			}]
+		}]
+	}
+});
+var MeterGroup = class MeterGroup extends BaseComponent {
+	componentName = "MeterGroup";
+	$pcMeterGroup = inject(METERGROUP_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	bindDirectiveInstance = inject(Bind, { self: true });
+	value = input(...ngDevMode ? [void 0, { debugName: "value" }] : 	/* istanbul ignore next */ []);
+	min = input(0, ...ngDevMode ? [{ debugName: "min" }] : 	/* istanbul ignore next */ []);
+	max = input(100, ...ngDevMode ? [{ debugName: "max" }] : 	/* istanbul ignore next */ []);
+	orientation = input("horizontal", ...ngDevMode ? [{ debugName: "orientation" }] : 	/* istanbul ignore next */ []);
+	labelPosition = input("end", ...ngDevMode ? [{ debugName: "labelPosition" }] : 	/* istanbul ignore next */ []);
+	labelOrientation = input("horizontal", ...ngDevMode ? [{ debugName: "labelOrientation" }] : 	/* istanbul ignore next */ []);
+	styleClass = input(...ngDevMode ? [void 0, { debugName: "styleClass" }] : 	/* istanbul ignore next */ []);
+	get vertical() {
+		return this.orientation() === "vertical";
+	}
+	labelTemplate = contentChild("label", {
+		...ngDevMode ? { debugName: "labelTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	meterTemplate = contentChild("meter", {
+		...ngDevMode ? { debugName: "meterTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	endTemplate = contentChild("end", {
+		...ngDevMode ? { debugName: "endTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	startTemplate = contentChild("start", {
+		...ngDevMode ? { debugName: "startTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	iconTemplate = contentChild("icon", {
+		...ngDevMode ? { debugName: "iconTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	templates = contentChildren(HelixTemplate, ...ngDevMode ? [{ debugName: "templates" }] : 	/* istanbul ignore next */ []);
+	_labelTemplate;
+	_meterTemplate;
+	_endTemplate;
+	_startTemplate;
+	_iconTemplate;
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptms(["host", "root"]));
+	}
+	_componentStyle = inject(MeterGroupStyle);
+	constructor() {
+		super();
+	}
+	onAfterViewInit() {
+		const _container = this.el.nativeElement;
+		const height = getOuterHeight(_container);
+		this.vertical && (_container.style.height = height + "px");
+	}
+	onAfterContentInit() {
+		this.templates()?.forEach((item) => {
+			switch (item.getType()) {
+				case "label":
+					this._labelTemplate = item.template;
+					break;
+				case "meter":
+					this._meterTemplate = item.template;
+					break;
+				case "icon":
+					this._iconTemplate = item.template;
+					break;
+				case "start":
+					this._startTemplate = item.template;
+					break;
+				case "end":
+					this._endTemplate = item.template;
+					break;
+			}
+		});
+	}
+	percent(meter = 0) {
+		const max = this.max();
+		const min = this.min();
+		if (max === min) return 100;
+		const percentOfItem = (meter - min) / (max - min) * 100;
+		return Math.round(Math.max(0, Math.min(100, percentOfItem)));
+	}
+	percentValue(meter) {
+		return this.percent(meter) + "%";
+	}
+	meterStyle(val) {
+		return {
+			backgroundColor: val.color,
+			width: this.orientation() === "horizontal" && this.percentValue(val.value || 0),
+			height: this.orientation() === "vertical" && this.percentValue(val.value || 0)
+		};
+	}
+	totalPercent() {
+		const value = this.value();
+		if (!value) return 0;
+		return this.percent(value.reduce((total, val) => total + (val.value || 0), 0));
+	}
+	percentages() {
+		const value = this.value();
+		if (!value) return [];
+		let sum = 0;
+		const sumsArray = [];
+		value.forEach((item) => {
+			sum += item.value || 0;
+			sumsArray.push(sum);
+		});
+		return sumsArray;
+	}
+	trackByFn(index) {
+		return index;
+	}
+	get dataP() {
+		return this.cn({ [this.orientation()]: this.orientation() });
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroup,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: MeterGroup,
+		isStandalone: true,
+		selector: "h-meterGroup, h-metergroup, h-meter-group",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			min: {
+				classPropertyName: "min",
+				publicName: "min",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			max: {
+				classPropertyName: "max",
+				publicName: "max",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			orientation: {
+				classPropertyName: "orientation",
+				publicName: "orientation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			labelPosition: {
+				classPropertyName: "labelPosition",
+				publicName: "labelPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			labelOrientation: {
+				classPropertyName: "labelOrientation",
+				publicName: "labelOrientation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			styleClass: {
+				classPropertyName: "styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: {
+			"attr.aria-valuemin": "min()",
+			"attr.role": "\"meter\"",
+			"attr.aria-valuemax": "max()",
+			"attr.aria-valuenow": "totalPercent()",
+			"attr.data-h": "dataP",
+			"class": "cn(cx('root'), styleClass())"
+		} },
+		providers: [
+			MeterGroupStyle,
+			{
+				provide: METERGROUP_INSTANCE,
+				useExisting: MeterGroup
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: MeterGroup
+			}
+		],
+		queries: [
+			{
+				propertyName: "labelTemplate",
+				first: true,
+				predicate: ["label"],
+				isSignal: true
+			},
+			{
+				propertyName: "meterTemplate",
+				first: true,
+				predicate: ["meter"],
+				isSignal: true
+			},
+			{
+				propertyName: "endTemplate",
+				first: true,
+				predicate: ["end"],
+				isSignal: true
+			},
+			{
+				propertyName: "startTemplate",
+				first: true,
+				predicate: ["start"],
+				isSignal: true
+			},
+			{
+				propertyName: "iconTemplate",
+				first: true,
+				predicate: ["icon"],
+				isSignal: true
+			},
+			{
+				propertyName: "templates",
+				predicate: HelixTemplate,
+				isSignal: true
+			}
+		],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i2.Bind }],
+		ngImport: i0,
+		template: "@if (labelPosition() === 'start') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || labelTemplate(); context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n<ng-container *ngTemplateOutlet=\"startTemplate() || _startTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n<div [class]=\"cx('meters')\" [hBind]=\"ptm('meters')\" [attr.data-h]=\"dataP\">\n  @for (meterItem of value(); track trackByFn(index); let index = $index) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                meterTemplate() || _meterTemplate;\n                context: {\n                    $implicit: meterItem,\n                    index: index,\n                    orientation: this.orientation(),\n                    class: cx('meter'),\n                    size: percentValue(meterItem.value),\n                    totalPercent: totalPercent(),\n                    dataP: dataP\n                }\n            \"\n    >\n  </ng-container>\n  @if (!meterTemplate() && !_meterTemplate && meterItem.value > 0) {\n    <span [class]=\"cx('meter')\" [attr.data-h]=\"dataP\" [hBind]=\"ptm('meter')\" [ngStyle]=\"meterStyle(meterItem)\"></span>\n  }\n}\n</div>\n<ng-container *ngTemplateOutlet=\"endTemplate() || _endTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n@if (labelPosition() === 'end') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || _labelTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n",
+		dependencies: [
+			{
+				kind: "ngmodule",
+				type: CommonModule
+			},
+			{
+				kind: "directive",
+				type: i1.NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "directive",
+				type: i1.NgStyle,
+				selector: "[ngStyle]",
+				inputs: ["ngStyle"]
+			},
+			{
+				kind: "component",
+				type: MeterGroupLabel,
+				selector: "h-meterGroupLabel, h-metergrouplabel",
+				inputs: [
+					"value",
+					"labelPosition",
+					"labelOrientation",
+					"min",
+					"max",
+					"iconTemplate"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: SharedModule
+			},
+			{
+				kind: "directive",
+				type: Bind,
+				selector: "[hBind]",
+				inputs: ["hBind"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush,
+		encapsulation: i0.ViewEncapsulation.None
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: MeterGroup,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "h-meterGroup, h-metergroup, h-meter-group",
+			standalone: true,
+			imports: [
+				CommonModule,
+				MeterGroupLabel,
+				SharedModule,
+				Bind
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			providers: [
+				MeterGroupStyle,
+				{
+					provide: METERGROUP_INSTANCE,
+					useExisting: MeterGroup
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: MeterGroup
+				}
+			],
+			host: {
+				"[attr.aria-valuemin]": "min()",
+				"[attr.role]": "\"meter\"",
+				"[attr.aria-valuemax]": "max()",
+				"[attr.aria-valuenow]": "totalPercent()",
+				"[attr.data-h]": "dataP",
+				"[class]": "cn(cx('root'), styleClass())"
+			},
+			hostDirectives: [Bind],
+			template: "@if (labelPosition() === 'start') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || labelTemplate(); context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n<ng-container *ngTemplateOutlet=\"startTemplate() || _startTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n<div [class]=\"cx('meters')\" [hBind]=\"ptm('meters')\" [attr.data-h]=\"dataP\">\n  @for (meterItem of value(); track trackByFn(index); let index = $index) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                meterTemplate() || _meterTemplate;\n                context: {\n                    $implicit: meterItem,\n                    index: index,\n                    orientation: this.orientation(),\n                    class: cx('meter'),\n                    size: percentValue(meterItem.value),\n                    totalPercent: totalPercent(),\n                    dataP: dataP\n                }\n            \"\n    >\n  </ng-container>\n  @if (!meterTemplate() && !_meterTemplate && meterItem.value > 0) {\n    <span [class]=\"cx('meter')\" [attr.data-h]=\"dataP\" [hBind]=\"ptm('meter')\" [ngStyle]=\"meterStyle(meterItem)\"></span>\n  }\n}\n</div>\n<ng-container *ngTemplateOutlet=\"endTemplate() || _endTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n@if (labelPosition() === 'end') {\n  @if (!labelTemplate() && !_labelTemplate) {\n    <h-meterGroupLabel\n      [value]=\"value()\"\n      [labelPosition()]=\"labelPosition()\"\n      [labelOrientation]=\"labelOrientation()\"\n      [min]=\"min()\"\n      [max]=\"max()\"\n      [iconTemplate]=\"iconTemplate() || _iconTemplate\"\n      [pt]=\"pt\"\n      [unstyled]=\"unstyled()\"\n      />\n  }\n  <ng-container *ngTemplateOutlet=\"labelTemplate() || _labelTemplate; context: { $implicit: value(), totalPercent: totalPercent(), percentages: percentages() }\"></ng-container>\n}\n"
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		min: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "min",
+				required: false
+			}]
+		}],
+		max: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "max",
+				required: false
+			}]
+		}],
+		orientation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "orientation",
+				required: false
+			}]
+		}],
+		labelPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "labelPosition",
+				required: false
+			}]
+		}],
+		labelOrientation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "labelOrientation",
+				required: false
+			}]
+		}],
+		styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}],
+		labelTemplate: [{
+			type: i0.ContentChild,
+			args: ["label", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		meterTemplate: [{
+			type: i0.ContentChild,
+			args: ["meter", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		endTemplate: [{
+			type: i0.ContentChild,
+			args: ["end", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		startTemplate: [{
+			type: i0.ContentChild,
+			args: ["start", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		iconTemplate: [{
+			type: i0.ContentChild,
+			args: ["icon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		templates: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }]
+		}]
+	}
+});
+var MeterGroupModule = class MeterGroupModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupModule,
+		imports: [MeterGroup, SharedModule],
+		exports: [MeterGroup, SharedModule]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: MeterGroupModule,
+		imports: [
+			MeterGroup,
+			SharedModule,
+			SharedModule
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: MeterGroupModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [MeterGroup, SharedModule],
+			exports: [MeterGroup, SharedModule]
+		}]
+	}]
+});
 export { MeterGroup, MeterGroupClasses, MeterGroupLabel, MeterGroupModule, MeterGroupStyle };
-//# sourceMappingURL=gravionlabs-helix-core-metergroup.mjs.map
+
+//# sourceMappingURL=gravionlabs-helix-core-metergroup.mjs.map