import { AXPValueWidgetComponent } from '@acorex/platform/layout/widget-core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { inject, signal, effect, computed, ChangeDetectionStrategy, Component } from '@angular/core';
import * as i2 from '@acorex/components/badge';
import { AXBadgeModule } from '@acorex/components/badge';
import { AXPModuleManifestRegistry } from '@acorex/platform/core';
import { AXTranslationModule } from '@acorex/core/translation';
import { AXPStateMessageComponent } from '@acorex/platform/layout/components';

class AXPFeaturesWidgetViewComponent extends AXPValueWidgetComponent {
    constructor() {
        super(...arguments);
        this.manifestRegistry = inject(AXPModuleManifestRegistry);
        this.modules = signal([], ...(ngDevMode ? [{ debugName: "modules" }] : []));
        this.loadModulesEffect = effect(async () => {
            // Load modules when component initializes
            if (this.modules().length === 0) {
                const manifests = this.manifestRegistry.getAll();
                this.modules.set(manifests
                    .filter((m) => {
                    const moduleFeatures = this.manifestRegistry.getModuleFeatures(m.name);
                    return moduleFeatures.length > 0;
                })
                    .map((m) => ({ name: m.name, title: m.title })));
            }
        }, ...(ngDevMode ? [{ debugName: "loadModulesEffect" }] : []));
        this.featuresByModule = computed(() => {
            const featureValues = this.getValue() || {};
            const modules = this.modules();
            const result = [];
            for (const module of modules) {
                const moduleFeatures = this.manifestRegistry.getModuleFeatures(module.name);
                const enabledFeatures = [];
                for (const featureDef of moduleFeatures) {
                    const value = featureValues[featureDef.name];
                    if (value !== undefined && value !== null) {
                        let displayValue = `${featureDef.title}: `;
                        // Format display value based on type
                        if (Array.isArray(value)) {
                            displayValue += value.join(', ');
                        }
                        else if (typeof value === 'boolean') {
                            displayValue += value ? 'Enabled' : 'Disabled';
                        }
                        else {
                            displayValue += String(value);
                        }
                        enabledFeatures.push({
                            module: module.name,
                            feature: featureDef,
                            value: value,
                            displayValue: displayValue,
                        });
                    }
                }
                if (enabledFeatures.length > 0) {
                    result.push({
                        module: module.name,
                        moduleTitle: module.title,
                        features: enabledFeatures,
                    });
                }
            }
            return result;
        }, ...(ngDevMode ? [{ debugName: "featuresByModule" }] : []));
        this.isEmpty = computed(() => {
            return this.featuresByModule().every((group) => !group.features.length);
        }, ...(ngDevMode ? [{ debugName: "isEmpty" }] : []));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AXPFeaturesWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: AXPFeaturesWidgetViewComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
    <div class="ax-flex ax-flex-col ax-gap-2">
      @for (group of featuresByModule(); track group.module) {
        <div *ngIf="group.features?.length">
          <div class="ax-text-xs ax-font-semibold ax-mb-2 ax-text-muted">{{ group.moduleTitle }}</div>
          <div class="ax-flex ax-gap-1 ax-flex-wrap">
            @for (featureDisplay of group.features; track featureDisplay.feature.name) {
              <ax-badge [text]="featureDisplay.displayValue" color="primary" size="sm"></ax-badge>
            }
          </div>
        </div>
      }
      @if (isEmpty()) {
        <axp-state-message 
          icon="fa-light fa-star"
          [title]="'@application-management:features-widget.components.features-editor.empty-states.no-features.title'"
          [description]="'@application-management:features-widget.components.features-editor.empty-states.no-features.description'">
        </axp-state-message>
      }
    </div>
  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i2.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AXPFeaturesWidgetViewComponent, decorators: [{
            type: Component,
            args: [{
                    template: `
    <div class="ax-flex ax-flex-col ax-gap-2">
      @for (group of featuresByModule(); track group.module) {
        <div *ngIf="group.features?.length">
          <div class="ax-text-xs ax-font-semibold ax-mb-2 ax-text-muted">{{ group.moduleTitle }}</div>
          <div class="ax-flex ax-gap-1 ax-flex-wrap">
            @for (featureDisplay of group.features; track featureDisplay.feature.name) {
              <ax-badge [text]="featureDisplay.displayValue" color="primary" size="sm"></ax-badge>
            }
          </div>
        </div>
      }
      @if (isEmpty()) {
        <axp-state-message 
          icon="fa-light fa-star"
          [title]="'@application-management:features-widget.components.features-editor.empty-states.no-features.title'"
          [description]="'@application-management:features-widget.components.features-editor.empty-states.no-features.description'">
        </axp-state-message>
      }
    </div>
  `,
                    standalone: true,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    imports: [CommonModule, AXBadgeModule, AXTranslationModule, AXPStateMessageComponent]
                }]
        }] });

export { AXPFeaturesWidgetViewComponent };
//# sourceMappingURL=acorex-modules-application-management-features-widget-view.component-7QoKvFqX.mjs.map
