@solcre-org/core-ui 2.11.21 → 2.11.23

package/fesm2022/solcre-org-core-ui.mjs

@@ -10224,11 +10224,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 // Este archivo es generado automáticamente por scripts/update-version.js
 // No edites manualmente este archivo
 const VERSION = {
-    full: '2.11.21',
+    full: '2.11.23',
     major: 2,
     minor: 11,
-    patch: 21,
-    timestamp: '2025-08-28T09:59:54.455Z',
+    patch: 23,
+    timestamp: '2025-08-28T12:25:25.950Z',
     buildDate: '28/8/2025'
 };
 
@@ -10794,29 +10794,183 @@ var StepSize;
     StepSize["LARGE"] = "large";
 })(StepSize || (StepSize = {}));
 
+class StepsService {
+    _steps = signal([]);
+    _activeStepId = signal('');
+    _stepsInstanceId = signal('');
+    steps = computed(() => this._steps());
+    activeStepId = computed(() => this._activeStepId());
+    activeStep = computed(() => {
+        const activeId = this._activeStepId();
+        return this._steps().find(step => step.id === activeId);
+    });
+    activeStepIndex = computed(() => {
+        const activeId = this._activeStepId();
+        return this._steps().findIndex(step => step.id === activeId);
+    });
+    initializeSteps(steps, activeStepId, instanceId) {
+        this._steps.set([...steps]);
+        this._stepsInstanceId.set(instanceId || 'default');
+        if (activeStepId) {
+            this._activeStepId.set(activeStepId);
+        }
+        else if (steps.length > 0) {
+            const activeStep = steps.find(step => step.status === StepStatus.ACTIVE) || steps[0];
+            this._activeStepId.set(activeStep.id);
+        }
+    }
+    setActiveStep(stepId) {
+        const step = this._steps().find(s => s.id === stepId);
+        if (!step) {
+            return null;
+        }
+        if (step.disabled) {
+            return null;
+        }
+        const previousStepId = this._activeStepId();
+        this._activeStepId.set(stepId);
+        return {
+            step,
+            index: this._steps().findIndex(s => s.id === stepId),
+            previousStepId
+        };
+    }
+    nextStep() {
+        const currentIndex = this.activeStepIndex();
+        if (currentIndex < this._steps().length - 1) {
+            this.completeStep(this._activeStepId());
+            const nextStep = this._steps()[currentIndex + 1];
+            this.updateStepStatus(nextStep.id, StepStatus.ACTIVE);
+            return this.setActiveStep(nextStep.id);
+        }
+        return null;
+    }
+    previousStep() {
+        const currentIndex = this.activeStepIndex();
+        if (currentIndex > 0) {
+            const prevStep = this._steps()[currentIndex - 1];
+            return this.setActiveStep(prevStep.id);
+        }
+        return null;
+    }
+    completeStep(stepId) {
+        this.updateStepStatus(stepId, StepStatus.COMPLETE);
+    }
+    setPendingStep(stepId) {
+        this.updateStepStatus(stepId, StepStatus.PENDING);
+    }
+    setActiveStepStatus(stepId) {
+        this.updateStepStatus(stepId, StepStatus.ACTIVE);
+    }
+    updateStepStatus(stepId, status) {
+        const stepIndex = this._steps().findIndex(s => s.id === stepId);
+        if (stepIndex !== -1) {
+            const updatedSteps = [...this._steps()];
+            updatedSteps[stepIndex] = { ...updatedSteps[stepIndex], status };
+            this._steps.set(updatedSteps);
+        }
+    }
+    setStepDisabled(stepId, disabled) {
+        const stepIndex = this._steps().findIndex(s => s.id === stepId);
+        if (stepIndex !== -1) {
+            const updatedSteps = [...this._steps()];
+            updatedSteps[stepIndex] = { ...updatedSteps[stepIndex], disabled };
+            this._steps.set(updatedSteps);
+        }
+    }
+    getProgress() {
+        const completedSteps = this._steps().filter(step => step.status === StepStatus.COMPLETE).length;
+        return this._steps().length > 0 ? (completedSteps / this._steps().length) * 100 : 0;
+    }
+    canGoNext() {
+        const currentIndex = this.activeStepIndex();
+        return currentIndex < this._steps().length - 1;
+    }
+    canGoPrevious() {
+        const currentIndex = this.activeStepIndex();
+        return currentIndex > 0;
+    }
+    getCompletedSteps() {
+        return this._steps().filter(step => step.status === StepStatus.COMPLETE);
+    }
+    getPendingSteps() {
+        return this._steps().filter(step => step.status === StepStatus.PENDING);
+    }
+    resetSteps() {
+        const updatedSteps = this._steps().map((step, index) => ({
+            ...step,
+            status: index === 0 ? StepStatus.ACTIVE : StepStatus.PENDING,
+            disabled: index === 0 ? false : step.disabled
+        }));
+        this._steps.set(updatedSteps);
+        if (updatedSteps.length > 0) {
+            this._activeStepId.set(updatedSteps[0].id);
+        }
+    }
+    completeStepsUpTo(stepId) {
+        const targetIndex = this._steps().findIndex(s => s.id === stepId);
+        if (targetIndex !== -1) {
+            const updatedSteps = [...this._steps()];
+            for (let i = 0; i <= targetIndex; i++) {
+                updatedSteps[i] = { ...updatedSteps[i], status: StepStatus.COMPLETE };
+            }
+            this._steps.set(updatedSteps);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: StepsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: StepsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: StepsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 class GenericStepsComponent {
-    // Inputs
+    stepsService = inject(StepsService);
     config = input.required();
-    // Outputs
+    useService = input(false);
+    instanceId = input('default');
     stepClick = output();
     stepChange = output();
-    // Signals
+    serviceStepChange = output();
     activeStepId = signal('');
     steps = signal([]);
     customColors = signal({});
-    // Computed
     activeStep = computed(() => {
+        if (this.useService()) {
+            return this.stepsService.activeStep();
+        }
         const activeId = this.activeStepId();
         return this.steps().find(step => step.id === activeId);
     });
     activeStepIndex = computed(() => {
+        if (this.useService()) {
+            return this.stepsService.activeStepIndex();
+        }
         const activeId = this.activeStepId();
         return this.steps().findIndex(step => step.id === activeId);
     });
-    // Enums for template
+    currentSteps = computed(() => {
+        return this.useService() ? this.stepsService.steps() : this.steps();
+    });
+    currentActiveStepId = computed(() => {
+        return this.useService() ? this.stepsService.activeStepId() : this.activeStepId();
+    });
     StepStatus = StepStatus;
     StepType = StepType;
     StepSize = StepSize;
+    constructor() {
+        if (this.useService()) {
+            effect(() => {
+                const serviceStepChange = this.stepsService.activeStepId();
+                if (serviceStepChange) {
+                    this.handleServiceStepChange();
+                }
+            });
+        }
+    }
     ngOnInit() {
         this.initializeSteps();
         this.setupCustomColors();
@@ -10829,13 +10983,30 @@ class GenericStepsComponent {
     }
     initializeSteps() {
         const config = this.config();
-        this.steps.set(config.steps || []);
-        if (config.activeStepId) {
-            this.activeStepId.set(config.activeStepId);
+        if (this.useService()) {
+            this.stepsService.initializeSteps(config.steps || [], config.activeStepId, this.instanceId());
+        }
+        else {
+            this.steps.set(config.steps || []);
+            if (config.activeStepId) {
+                this.activeStepId.set(config.activeStepId);
+            }
+            else if (this.steps().length > 0) {
+                const activeStep = this.steps().find(step => step.status === StepStatus.ACTIVE) || this.steps()[0];
+                this.activeStepId.set(activeStep.id);
+            }
         }
-        else if (this.steps().length > 0) {
-            const activeStep = this.steps().find(step => step.status === StepStatus.ACTIVE) || this.steps()[0];
-            this.activeStepId.set(activeStep.id);
+    }
+    handleServiceStepChange() {
+        const activeStep = this.stepsService.activeStep();
+        const activeIndex = this.stepsService.activeStepIndex();
+        if (activeStep) {
+            const changeEvent = {
+                step: activeStep,
+                index: activeIndex
+            };
+            this.serviceStepChange.emit(changeEvent);
+            this.stepChange.emit({ step: activeStep, index: activeIndex });
         }
     }
     setupCustomColors() {
@@ -10875,8 +11046,16 @@ class GenericStepsComponent {
         };
         this.stepClick.emit(clickEvent);
         if (this.config().clickable) {
-            this.activeStepId.set(step.id);
-            this.stepChange.emit({ step, index });
+            if (this.useService()) {
+                const changeEvent = this.stepsService.setActiveStep(step.id);
+                if (changeEvent) {
+                    this.serviceStepChange.emit(changeEvent);
+                }
+            }
+            else {
+                this.activeStepId.set(step.id);
+                this.stepChange.emit({ step, index });
+            }
         }
     }
     getStepClasses(step) {
@@ -10887,7 +11066,8 @@ class GenericStepsComponent {
         if (step.status === StepStatus.COMPLETE) {
             classes.push('is-complete');
         }
-        if (step.id === this.activeStepId()) {
+        const currentActiveId = this.currentActiveStepId();
+        if (step.id === currentActiveId) {
             classes.push('is-active-step');
         }
         if (step.status === StepStatus.PENDING) {
@@ -10898,7 +11078,6 @@ class GenericStepsComponent {
         }
         const size = this.config().size || StepSize.MEDIUM;
         classes.push(`c-steps__item--${size}`);
-        console.log(`Step ${step.id} size class: c-steps__item--${size}`);
         if (step.customClass) {
             classes.push(step.customClass);
         }
@@ -10919,57 +11098,119 @@ class GenericStepsComponent {
                 return step.content?.toString() || '';
         }
     }
+    getTranslatedStepContent(step) {
+        if (step.status === StepStatus.COMPLETE && !step.icon) {
+            return 'icon-check';
+        }
+        switch (step.type) {
+            case StepType.NUMBER:
+            case StepType.TEXT:
+                return step.content?.toString() || '';
+            case StepType.ICON:
+                return step.icon || step.content?.toString() || 'icon-check';
+            default:
+                return step.content?.toString() || '';
+        }
+    }
+    shouldTranslateContent(step) {
+        if (step.status === StepStatus.COMPLETE && !step.icon) {
+            return false;
+        }
+        const content = step.content?.toString() || '';
+        if (step.type === StepType.NUMBER && /^\d+$/.test(content)) {
+            return false;
+        }
+        if (step.type === StepType.ICON) {
+            return false;
+        }
+        return step.type === StepType.TEXT || step.type === StepType.NUMBER;
+    }
     isStepClickable(step) {
         return !step.disabled && (step.clickable !== false) && this.config().clickable !== false;
     }
     getConnectorClasses(index) {
         const classes = ['c-steps__connector'];
-        const currentStep = this.steps()[index];
-        const nextStep = this.steps()[index + 1];
+        const currentSteps = this.currentSteps();
+        const currentStep = currentSteps[index];
+        const nextStep = currentSteps[index + 1];
         if (currentStep?.status === StepStatus.COMPLETE) {
             classes.push('is-complete');
         }
-        else if (currentStep?.status === StepStatus.ACTIVE || currentStep?.id === this.activeStepId()) {
+        else if (currentStep?.status === StepStatus.ACTIVE || currentStep?.id === this.currentActiveStepId()) {
             classes.push('is-active');
         }
         return classes.join(' ');
     }
     setActiveStep(stepId) {
-        const step = this.steps().find(s => s.id === stepId);
-        if (step) {
-            this.activeStepId.set(stepId);
-            this.stepChange.emit({ step, index: this.steps().findIndex(s => s.id === stepId) });
+        if (this.useService()) {
+            const changeEvent = this.stepsService.setActiveStep(stepId);
+            if (changeEvent) {
+                this.serviceStepChange.emit(changeEvent);
+            }
+        }
+        else {
+            const step = this.steps().find(s => s.id === stepId);
+            if (step) {
+                this.activeStepId.set(stepId);
+                this.stepChange.emit({ step, index: this.steps().findIndex(s => s.id === stepId) });
+            }
         }
     }
     nextStep() {
-        const currentIndex = this.activeStepIndex();
-        if (currentIndex < this.steps().length - 1) {
-            const updatedSteps = [...this.steps()];
-            updatedSteps[currentIndex] = { ...updatedSteps[currentIndex], status: StepStatus.COMPLETE };
-            const nextStep = updatedSteps[currentIndex + 1];
-            updatedSteps[currentIndex + 1] = { ...nextStep, status: StepStatus.ACTIVE };
-            this.steps.set(updatedSteps);
-            this.setActiveStep(nextStep.id);
+        if (this.useService()) {
+            const changeEvent = this.stepsService.nextStep();
+            if (changeEvent) {
+                this.serviceStepChange.emit(changeEvent);
+            }
+        }
+        else {
+            const currentIndex = this.activeStepIndex();
+            if (currentIndex < this.steps().length - 1) {
+                const updatedSteps = [...this.steps()];
+                updatedSteps[currentIndex] = { ...updatedSteps[currentIndex], status: StepStatus.COMPLETE };
+                const nextStep = updatedSteps[currentIndex + 1];
+                updatedSteps[currentIndex + 1] = { ...nextStep, status: StepStatus.ACTIVE };
+                this.steps.set(updatedSteps);
+                this.setActiveStep(nextStep.id);
+            }
         }
     }
     previousStep() {
-        const currentIndex = this.activeStepIndex();
-        if (currentIndex > 0) {
-            const prevStep = this.steps()[currentIndex - 1];
-            this.setActiveStep(prevStep.id);
+        if (this.useService()) {
+            const changeEvent = this.stepsService.previousStep();
+            if (changeEvent) {
+                this.serviceStepChange.emit(changeEvent);
+            }
+        }
+        else {
+            const currentIndex = this.activeStepIndex();
+            if (currentIndex > 0) {
+                const prevStep = this.steps()[currentIndex - 1];
+                this.setActiveStep(prevStep.id);
+            }
         }
     }
     completeStep(stepId) {
-        const stepIndex = this.steps().findIndex(s => s.id === stepId);
-        if (stepIndex !== -1) {
-            const updatedSteps = [...this.steps()];
-            updatedSteps[stepIndex] = { ...updatedSteps[stepIndex], status: StepStatus.COMPLETE };
-            this.steps.set(updatedSteps);
+        if (this.useService()) {
+            this.stepsService.completeStep(stepId);
+        }
+        else {
+            const stepIndex = this.steps().findIndex(s => s.id === stepId);
+            if (stepIndex !== -1) {
+                const updatedSteps = [...this.steps()];
+                updatedSteps[stepIndex] = { ...updatedSteps[stepIndex], status: StepStatus.COMPLETE };
+                this.steps.set(updatedSteps);
+            }
         }
     }
     getStepProgress() {
-        const completedSteps = this.steps().filter(step => step.status === StepStatus.COMPLETE).length;
-        return (completedSteps / this.steps().length) * 100;
+        if (this.useService()) {
+            return this.stepsService.getProgress();
+        }
+        else {
+            const completedSteps = this.steps().filter(step => step.status === StepStatus.COMPLETE).length;
+            return (completedSteps / this.steps().length) * 100;
+        }
     }
     getCustomStyles() {
         const colors = this.customColors();
@@ -10978,12 +11219,12 @@ class GenericStepsComponent {
             .join('; ');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericStepsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericStepsComponent, isStandalone: true, selector: "core-generic-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { stepClick: "stepClick", stepChange: "stepChange" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<nav class=\"c-steps-container\" [class]=\"config().customClass\" [style]=\"getCustomStyles()\">\n  <ol class=\"c-steps\" [class]=\"'c-steps--' + (config().layout || 'horizontal') + ' c-steps--' + (config().size || StepSize.MEDIUM)\">\n    @for (step of steps(); track step.id; let i = $index) {\n      <li class=\"c-steps__step\">\n        <button \n          type=\"button\"\n          class=\"c-steps__item\"\n          [class]=\"getStepClasses(step)\"\n          [disabled]=\"step.disabled\"\n          [title]=\"step.tooltip || step.title\"\n          (click)=\"onStepClick(step, i, $event)\"\n          [attr.data-step-id]=\"step.id\">\n          \n          <span class=\"c-steps__num\" [class]=\"'c-steps__num--' + step.type\" [style]=\"step.id === activeStepId() ? '--step-border: var(--step-active-border); font-weight: 800' : ''\">\n            @if (step.type === StepType.ICON || step.status === StepStatus.COMPLETE) {\n              <i [ngClass]=\"getStepContent(step) | coreIconCompat\"></i>\n            } @else {\n              <strong *ngIf=\"step.id === activeStepId()\">{{ getStepContent(step) }}</strong>\n              <span *ngIf=\"step.id !== activeStepId()\">{{ getStepContent(step) }}</span>\n            }\n          </span>\n          \n          @if (config().showLabels !== false) {\n            <span class=\"c-steps__text\">{{ step.title }}</span>\n          }\n        </button>\n        \n        @if (config().showConnectors !== false && i < steps().length - 1) {\n          <div class=\"c-steps__connector\" [class]=\"getConnectorClasses(i)\"></div>\n        }\n      </li>\n    }\n  </ol>\n</nav>\n\n@if (activeStep()) {\n  <div class=\"c-steps__content\" [attr.data-active-step]=\"activeStepId()\">\n    <ng-content></ng-content>\n  </div>\n}", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericStepsComponent, isStandalone: true, selector: "core-generic-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, useService: { classPropertyName: "useService", publicName: "useService", isSignal: true, isRequired: false, transformFunction: null }, instanceId: { classPropertyName: "instanceId", publicName: "instanceId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { stepClick: "stepClick", stepChange: "stepChange", serviceStepChange: "serviceStepChange" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<nav class=\"c-steps-container\" [class]=\"config().customClass\" [style]=\"getCustomStyles()\">\n  <ol class=\"c-steps\" [class]=\"'c-steps--' + (config().layout || 'horizontal') + ' c-steps--' + (config().size || StepSize.MEDIUM)\">\n    @for (step of currentSteps(); track step.id; let i = $index) {\n      <li class=\"c-steps__step\">\n        <button \n          type=\"button\"\n          class=\"c-steps__item\"\n          [class]=\"getStepClasses(step)\"\n          [disabled]=\"step.disabled\"\n          [title]=\"step.tooltip || step.title\"\n          (click)=\"onStepClick(step, i, $event)\"\n          [attr.data-step-id]=\"step.id\">\n          \n          <span class=\"c-steps__num\" [class]=\"'c-steps__num--' + step.type\" [style]=\"step.id === currentActiveStepId() ? '--step-border: var(--step-active-border); font-weight: 800' : ''\">\n            @if (step.type === StepType.ICON || step.status === StepStatus.COMPLETE) {\n              <i [ngClass]=\"getStepContent(step) | coreIconCompat\"></i>\n            } @else {\n              @if (shouldTranslateContent(step)) {\n                <strong *ngIf=\"step.id === currentActiveStepId()\">{{ getTranslatedStepContent(step) | translate }}</strong>\n                <span *ngIf=\"step.id !== currentActiveStepId()\">{{ getTranslatedStepContent(step) | translate }}</span>\n              } @else {\n                <strong *ngIf=\"step.id === currentActiveStepId()\">{{ getStepContent(step) }}</strong>\n                <span *ngIf=\"step.id !== currentActiveStepId()\">{{ getStepContent(step) }}</span>\n              }\n            }\n          </span>\n          \n          @if (config().showLabels !== false) {\n            <span class=\"c-steps__text\">{{ step.title }}</span>\n          }\n        </button>\n        \n        @if (config().showConnectors !== false && i < currentSteps().length - 1) {\n          <div class=\"c-steps__connector\" [class]=\"getConnectorClasses(i)\"></div>\n        }\n      </li>\n    }\n  </ol>\n</nav>\n\n@if (activeStep()) {\n  <div class=\"c-steps__content\" [attr.data-active-step]=\"currentActiveStepId()\">\n    <ng-content></ng-content>\n  </div>\n}", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericStepsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-generic-steps', standalone: true, imports: [CommonModule, IconCompatPipe], hostDirectives: [CoreHostDirective], template: "<nav class=\"c-steps-container\" [class]=\"config().customClass\" [style]=\"getCustomStyles()\">\n  <ol class=\"c-steps\" [class]=\"'c-steps--' + (config().layout || 'horizontal') + ' c-steps--' + (config().size || StepSize.MEDIUM)\">\n    @for (step of steps(); track step.id; let i = $index) {\n      <li class=\"c-steps__step\">\n        <button \n          type=\"button\"\n          class=\"c-steps__item\"\n          [class]=\"getStepClasses(step)\"\n          [disabled]=\"step.disabled\"\n          [title]=\"step.tooltip || step.title\"\n          (click)=\"onStepClick(step, i, $event)\"\n          [attr.data-step-id]=\"step.id\">\n          \n          <span class=\"c-steps__num\" [class]=\"'c-steps__num--' + step.type\" [style]=\"step.id === activeStepId() ? '--step-border: var(--step-active-border); font-weight: 800' : ''\">\n            @if (step.type === StepType.ICON || step.status === StepStatus.COMPLETE) {\n              <i [ngClass]=\"getStepContent(step) | coreIconCompat\"></i>\n            } @else {\n              <strong *ngIf=\"step.id === activeStepId()\">{{ getStepContent(step) }}</strong>\n              <span *ngIf=\"step.id !== activeStepId()\">{{ getStepContent(step) }}</span>\n            }\n          </span>\n          \n          @if (config().showLabels !== false) {\n            <span class=\"c-steps__text\">{{ step.title }}</span>\n          }\n        </button>\n        \n        @if (config().showConnectors !== false && i < steps().length - 1) {\n          <div class=\"c-steps__connector\" [class]=\"getConnectorClasses(i)\"></div>\n        }\n      </li>\n    }\n  </ol>\n</nav>\n\n@if (activeStep()) {\n  <div class=\"c-steps__content\" [attr.data-active-step]=\"activeStepId()\">\n    <ng-content></ng-content>\n  </div>\n}" }]
-        }] });
+            args: [{ selector: 'core-generic-steps', standalone: true, imports: [CommonModule, IconCompatPipe, TranslateModule], hostDirectives: [CoreHostDirective], template: "<nav class=\"c-steps-container\" [class]=\"config().customClass\" [style]=\"getCustomStyles()\">\n  <ol class=\"c-steps\" [class]=\"'c-steps--' + (config().layout || 'horizontal') + ' c-steps--' + (config().size || StepSize.MEDIUM)\">\n    @for (step of currentSteps(); track step.id; let i = $index) {\n      <li class=\"c-steps__step\">\n        <button \n          type=\"button\"\n          class=\"c-steps__item\"\n          [class]=\"getStepClasses(step)\"\n          [disabled]=\"step.disabled\"\n          [title]=\"step.tooltip || step.title\"\n          (click)=\"onStepClick(step, i, $event)\"\n          [attr.data-step-id]=\"step.id\">\n          \n          <span class=\"c-steps__num\" [class]=\"'c-steps__num--' + step.type\" [style]=\"step.id === currentActiveStepId() ? '--step-border: var(--step-active-border); font-weight: 800' : ''\">\n            @if (step.type === StepType.ICON || step.status === StepStatus.COMPLETE) {\n              <i [ngClass]=\"getStepContent(step) | coreIconCompat\"></i>\n            } @else {\n              @if (shouldTranslateContent(step)) {\n                <strong *ngIf=\"step.id === currentActiveStepId()\">{{ getTranslatedStepContent(step) | translate }}</strong>\n                <span *ngIf=\"step.id !== currentActiveStepId()\">{{ getTranslatedStepContent(step) | translate }}</span>\n              } @else {\n                <strong *ngIf=\"step.id === currentActiveStepId()\">{{ getStepContent(step) }}</strong>\n                <span *ngIf=\"step.id !== currentActiveStepId()\">{{ getStepContent(step) }}</span>\n              }\n            }\n          </span>\n          \n          @if (config().showLabels !== false) {\n            <span class=\"c-steps__text\">{{ step.title }}</span>\n          }\n        </button>\n        \n        @if (config().showConnectors !== false && i < currentSteps().length - 1) {\n          <div class=\"c-steps__connector\" [class]=\"getConnectorClasses(i)\"></div>\n        }\n      </li>\n    }\n  </ol>\n</nav>\n\n@if (activeStep()) {\n  <div class=\"c-steps__content\" [attr.data-active-step]=\"currentActiveStepId()\">\n    <ng-content></ng-content>\n  </div>\n}" }]
+        }], ctorParameters: () => [] });
 
 var RatingSize;
 (function (RatingSize) {
@@ -11753,5 +11994,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GenericButtonComponent, GenericDocumentationComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SmartFieldComponent, StepSize, StepStatus, StepType, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
+export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GenericButtonComponent, GenericDocumentationComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SmartFieldComponent, StepSize, StepStatus, StepType, StepsService, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
 //# sourceMappingURL=solcre-org-core-ui.mjs.map