@acorex/modules 20.0.6 → 20.0.7

package/fesm2022/acorex-modules-report-management-report-create-root.component-LrE6TkIp.mjs

@@ -0,0 +1,302 @@
+import * as i0 from '@angular/core';
+import { inject, viewChild, signal, computed, ViewEncapsulation, Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { trigger, transition, style, animate } from '@angular/animations';
+import * as i2 from '@acorex/components/form';
+import { AXFormModule } from '@acorex/components/form';
+import * as i4 from '@acorex/components/button';
+import { AXButtonModule } from '@acorex/components/button';
+import * as i3 from '@acorex/components/text-box';
+import { AXTextBoxModule } from '@acorex/components/text-box';
+import * as i6 from '@acorex/components/check-box';
+import { AXCheckBoxModule } from '@acorex/components/check-box';
+import * as i5 from '@acorex/components/label';
+import { AXLabelModule } from '@acorex/components/label';
+import * as i7 from '@acorex/components/select-box';
+import { AXSelectBoxModule } from '@acorex/components/select-box';
+import { AXSwitchModule } from '@acorex/components/switch';
+import * as i8 from '@acorex/components/decorators';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import * as i9 from '@acorex/components/step-wizard';
+import { AXStepWizardModule } from '@acorex/components/step-wizard';
+import { AXTranslationModule } from '@acorex/core/translation';
+import { AXToastService } from '@acorex/components/toast';
+
+//#endregion
+class AXPReportCreateRootComponent {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.toastService = inject(AXToastService);
+        //#endregion
+        //#region ----   ViewChild & Signals   ----
+        this.reportWizard = viewChild('reportWizard');
+        this.isValidating = signal(false);
+        this.isSaving = signal(false);
+        //#endregion
+        //#region ----   Computed Properties   ----
+        this.canProceed = computed(() => {
+            return this.validateCurrentStep();
+        });
+        //#endregion
+        //#region ----   Form Data   ----
+        this.formData = {
+            name: '',
+            title: '',
+            category: '',
+            dataSource: '',
+            template: '',
+            formats: {},
+            isScheduled: false,
+            scheduleFrequency: '',
+            parameters: []
+        };
+        //#endregion
+        //#region ----   Step Definitions   ----
+        this.steps = [
+            {
+                id: 'basic-info',
+                title: 'Basic Information',
+                subtitle: 'Enter report details'
+            },
+            {
+                id: 'configuration',
+                title: 'Configuration',
+                subtitle: 'Configure report settings'
+            },
+            {
+                id: 'parameters',
+                title: 'Parameters',
+                subtitle: 'Define report parameters'
+            },
+            {
+                id: 'review',
+                title: 'Review & Finish',
+                subtitle: 'Review and complete'
+            }
+        ];
+        //#endregion
+        //#region ----   Data Sources   ----
+        this.categories = [
+            { id: 'financial', name: 'Financial Reports' },
+            { id: 'operational', name: 'Operational Reports' },
+            { id: 'analytics', name: 'Analytics Reports' },
+            { id: 'compliance', name: 'Compliance Reports' }
+        ];
+        this.dataSources = [
+            { id: 'users', title: 'Users Data' },
+            { id: 'orders', title: 'Orders Data' },
+            { id: 'products', title: 'Products Data' },
+            { id: 'transactions', title: 'Transactions Data' },
+            { id: 'logs', title: 'System Logs' }
+        ];
+        this.templates = [
+            { id: 'standard', name: 'Standard Template' },
+            { id: 'detailed', name: 'Detailed Template' },
+            { id: 'summary', name: 'Summary Template' },
+            { id: 'custom', name: 'Custom Template' }
+        ];
+        this.formats = [
+            { id: 'pdf', name: 'PDF' },
+            { id: 'excel', name: 'Excel' },
+            { id: 'csv', name: 'CSV' },
+            { id: 'html', name: 'HTML' }
+        ];
+        this.frequencies = [
+            { id: 'daily', name: 'Daily' },
+            { id: 'weekly', name: 'Weekly' },
+            { id: 'monthly', name: 'Monthly' },
+            { id: 'yearly', name: 'Yearly' }
+        ];
+        this.parameterTypes = [
+            { id: 'string', name: 'Text' },
+            { id: 'number', name: 'Number' },
+            { id: 'date', name: 'Date' },
+            { id: 'boolean', name: 'Boolean' },
+            { id: 'select', name: 'Selection' }
+        ];
+    }
+    //#endregion
+    //#region ----   Lifecycle Methods   ----
+    ngOnInit() {
+        this.initializeFormData();
+    }
+    ngOnDestroy() {
+        // Cleanup if needed
+    }
+    //#endregion
+    //#region ----   Step Navigation Methods   ----
+    async nextStep() {
+        if (this.isValidating())
+            return;
+        this.isValidating.set(true);
+        try {
+            const isValid = this.validateCurrentStep();
+            if (isValid) {
+                const wizard = this.reportWizard();
+                if (wizard) {
+                    wizard.next();
+                }
+            }
+            else {
+                this.toastService.warning('Please complete all required fields before proceeding.');
+            }
+        }
+        catch (error) {
+            this.toastService.danger('Validation failed. Please try again.');
+        }
+        finally {
+            this.isValidating.set(false);
+        }
+    }
+    async finishWizard() {
+        if (this.isSaving())
+            return;
+        this.isSaving.set(true);
+        try {
+            const isValid = await this.validateAllSteps();
+            if (isValid) {
+                await this.saveReport();
+                this.toastService.success('Report created successfully!');
+                // Navigate to report list or show success message
+            }
+            else {
+                this.toastService.warning('Please complete all required fields.');
+            }
+        }
+        catch (error) {
+            this.toastService.danger('Failed to create report. Please try again.');
+            console.error('Error creating report:', error);
+        }
+        finally {
+            this.isSaving.set(false);
+        }
+    }
+    //#endregion
+    //#region ----   Parameter Management   ----
+    addParameter() {
+        const newParameter = {
+            id: `param_${Date.now()}`,
+            name: '',
+            type: 'string',
+            required: false
+        };
+        this.formData.parameters.push(newParameter);
+    }
+    removeParameter(index) {
+        this.formData.parameters.splice(index, 1);
+    }
+    //#endregion
+    //#region ----   Validation Methods   ----
+    validateCurrentStep() {
+        // Since we can't reliably get current step index from wizard,
+        // we'll validate all steps and let the wizard handle navigation
+        return this.validateBasicInfo() || this.validateConfiguration() ||
+            this.validateParameters() || this.validateReview();
+    }
+    validateBasicInfo() {
+        return !!(this.formData.name?.trim() && this.formData.title?.trim() &&
+            this.formData.category && this.formData.dataSource);
+    }
+    validateConfiguration() {
+        const hasSelectedFormat = Object.values(this.formData.formats).some(selected => selected);
+        const scheduleValid = !this.formData.isScheduled || !!this.formData.scheduleFrequency;
+        return !!(this.formData.template && hasSelectedFormat && scheduleValid);
+    }
+    validateParameters() {
+        return this.formData.parameters.every(param => param.name?.trim() && param.type);
+    }
+    validateReview() {
+        return this.validateBasicInfo() && this.validateConfiguration() && this.validateParameters();
+    }
+    async validateAllSteps() {
+        // Validate each step's form individually
+        const basicValid = this.validateBasicInfo();
+        const configValid = this.validateConfiguration();
+        const paramsValid = this.validateParameters();
+        const reviewValid = this.validateReview();
+        return basicValid && configValid && paramsValid && reviewValid;
+    }
+    //#endregion
+    //#region ----   Helper Methods   ----
+    initializeFormData() {
+        // Initialize formats object
+        this.formats.forEach(format => {
+            this.formData.formats[format.id] = false;
+        });
+        // Set default PDF format
+        this.formData.formats['pdf'] = true;
+    }
+    async saveReport() {
+        // Simulate API call
+        await new Promise(resolve => setTimeout(resolve, 1000));
+        console.log('Saving report with data:', this.formData);
+        // Here you would typically call a service to save the report
+        // Example: await this.reportService.createReport(this.formData);
+    }
+    getCategoryName(categoryId) {
+        const category = this.categories.find(c => c.id === categoryId);
+        return category?.name || categoryId;
+    }
+    getTemplateName(templateId) {
+        const template = this.templates.find(t => t.id === templateId);
+        return template?.name || templateId;
+    }
+    getSelectedFormats() {
+        const selectedFormats = Object.entries(this.formData.formats)
+            .filter(([_, selected]) => selected)
+            .map(([formatId, _]) => {
+            const format = this.formats.find(f => f.id === formatId);
+            return format?.name || formatId;
+        });
+        return selectedFormats.join(', ') || 'None';
+    }
+    getDataSourceTitle(dataSourceId) {
+        const dataSource = this.dataSources.find(d => d.id === dataSourceId);
+        return dataSource?.title || dataSourceId;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AXPReportCreateRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: AXPReportCreateRootComponent, isStandalone: true, selector: "axp-report-create-root", providers: [], viewQueries: [{ propertyName: "reportWizard", first: true, predicate: ["reportWizard"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ax-w-full ax-max-w-4xl ax-mx-auto ax-p-6\">\n  <div class=\"step-wizard-header ax-text-center ax-mb-8\">\n    <h2 class=\"ax-text-2xl ax-font-bold ax-text-gray-900 ax-mb-2\">Create New Report</h2>\n    <p class=\"ax-text-gray-600\">Follow these steps to create your custom report</p>\n  </div>\n\n  <ax-step-wizard\n    [content]=\"wizardContent\"\n    [look]=\"'rounded-icon'\"\n    #reportWizard\n  >\n    <ax-step-wizard-item [label]=\"'Basic Information'\" [id]=\"'basic'\">\n      <ax-icon class=\"fas fa-info-circle\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Basic Information</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Enter the basic details for your report</p>\n          </div>\n          \n          <ax-form #basicForm>\n            <div class=\"form-grid ax-grid ax-grid-cols-1 md:ax-grid-cols-2 ax-gap-6\">\n              <ax-form-field>\n                <ax-label>Report Name *</ax-label>\n                <ax-text-box \n                  [(ngModel)]=\"formData.name\"\n                  placeholder=\"Enter report name\"\n                  [required]=\"true\"\n                  name=\"reportName\">\n                </ax-text-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Report Title *</ax-label>\n                <ax-text-box \n                  [(ngModel)]=\"formData.title\"\n                  placeholder=\"Enter report title\"\n                  [required]=\"true\"\n                  name=\"reportTitle\">\n                </ax-text-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Category *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.category\"\n                  [dataSource]=\"categories\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'name'\"\n                  placeholder=\"Select category\"\n                  [required]=\"true\"\n                  name=\"reportCategory\">\n                </ax-select-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Data Source *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.dataSource\"\n                  [dataSource]=\"dataSources\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'title'\"\n                  placeholder=\"Select data source\"\n                  [required]=\"true\"\n                  name=\"reportDataSource\">\n                </ax-select-box>\n              </ax-form-field>\n            </div>\n          </ax-form>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Configuration'\" [id]=\"'config'\">\n      <ax-icon class=\"fas fa-cog\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Report Configuration</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Configure your report settings</p>\n          </div>\n          \n          <ax-form #configForm>\n            <div class=\"form-grid ax-grid ax-grid-cols-1 md:ax-grid-cols-2 ax-gap-6\">\n              <ax-form-field>\n                <ax-label>Template *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.template\"\n                  [dataSource]=\"templates\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'name'\"\n                  placeholder=\"Select template\"\n                  [required]=\"true\"\n                  name=\"reportTemplate\">\n                </ax-select-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Output Formats *</ax-label>\n                <div class=\"format-selection ax-grid ax-grid-cols-2 ax-gap-3\">\n                  @for (format of formats; track format.id) {\n                    <div class=\"format-option ax-p-3 ax-border ax-border-gray-200 ax-rounded-lg ax-transition-colors\">\n                      <ax-check-box \n                        [(ngModel)]=\"formData.formats[format.id]\"\n                        [name]=\"'format_' + format.id\">\n                        {{ format.name }}\n                      </ax-check-box>\n                    </div>\n                  }\n                </div>\n              </ax-form-field>\n\n              <ax-form-field class=\"md:ax-col-span-2\">\n                <div class=\"schedule-section ax-space-y-4\">\n                  <ax-check-box \n                    [(ngModel)]=\"formData.isScheduled\"\n                    name=\"isScheduled\">\n                    Enable scheduled reports\n                  </ax-check-box>\n                  \n                  @if (formData.isScheduled) {\n                    <div class=\"schedule-options ax-pl-6 ax-border-l-2 ax-border-primary/20\">\n                      <ax-form-field>\n                        <ax-label>Frequency</ax-label>\n                        <ax-select-box \n                          [(ngModel)]=\"formData.scheduleFrequency\"\n                          [dataSource]=\"frequencies\"\n                          [valueField]=\"'id'\"\n                          [textField]=\"'name'\"\n                          placeholder=\"Select frequency\"\n                          name=\"scheduleFrequency\">\n                        </ax-select-box>\n                      </ax-form-field>\n                    </div>\n                  }\n                </div>\n              </ax-form-field>\n            </div>\n          </ax-form>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Parameters'\" [id]=\"'parameters'\">\n      <ax-icon class=\"fas fa-sliders-h\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Report Parameters</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Define parameters for your report</p>\n          </div>\n          \n          <div class=\"parameters-section ax-space-y-6\">\n            @if (formData.parameters.length > 0) {\n              <div class=\"parameters-list ax-space-y-4\">\n                @for (param of formData.parameters; track param.id; let i = $index) {\n                  <div class=\"parameter-item ax-p-4 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50 ax-space-y-4\">\n                    <div class=\"parameter-fields ax-grid ax-grid-cols-1 md:ax-grid-cols-3 ax-gap-4\">\n                      <ax-form-field>\n                        <ax-label>Parameter Name</ax-label>\n                        <ax-text-box \n                          [(ngModel)]=\"param.name\"\n                          placeholder=\"Enter parameter name\"\n                          [name]=\"'param_name_' + i\">\n                        </ax-text-box>\n                      </ax-form-field>\n                      \n                      <ax-form-field>\n                        <ax-label>Type</ax-label>\n                        <ax-select-box \n                          [(ngModel)]=\"param.type\"\n                          [dataSource]=\"parameterTypes\"\n                          [valueField]=\"'id'\"\n                          [textField]=\"'name'\"\n                          placeholder=\"Select type\"\n                          [name]=\"'param_type_' + i\">\n                        </ax-select-box>\n                      </ax-form-field>\n                      \n                      <ax-form-field>\n                        <ax-check-box \n                          [(ngModel)]=\"param.required\"\n                          [name]=\"'param_required_' + i\">\n                          Required\n                        </ax-check-box>\n                      </ax-form-field>\n                    </div>\n                    \n                    <ax-button \n                      look=\"ghost\"\n                      color=\"danger\"\n                      size=\"small\"\n                      (onClick)=\"removeParameter(i)\">\n                      Remove\n                    </ax-button>\n                  </div>\n                }\n              </div>\n            } @else {\n              <div class=\"no-parameters ax-text-center ax-py-8 ax-text-gray-500\">\n                <p>No parameters defined yet.</p>\n              </div>\n            }\n            \n            <div class=\"add-parameter-section ax-text-center\">\n              <ax-button \n                look=\"outline\"\n                color=\"primary\"\n                (onClick)=\"addParameter()\">\n                + Add Parameter\n              </ax-button>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Review'\" [id]=\"'review'\">\n      <ax-icon class=\"fas fa-check-circle\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Review & Confirm</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Review your report configuration before creating</p>\n          </div>\n          \n          <div class=\"review-sections ax-space-y-6\">\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Basic Information</h4>\n              <div class=\"review-items ax-space-y-3\">\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Name:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.name || 'Not specified' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Title:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.title || 'Not specified' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Category:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getCategoryName(formData.category) || 'Not selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Data Source:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getDataSourceTitle(formData.dataSource) || 'Not selected' }}</span>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Configuration</h4>\n              <div class=\"review-items ax-space-y-3\">\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Template:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getTemplateName(formData.template) || 'Not selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Formats:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getSelectedFormats() || 'None selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Scheduled:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.isScheduled ? 'Yes - ' + formData.scheduleFrequency : 'No' }}</span>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Parameters</h4>\n              <div class=\"review-items ax-space-y-3\">\n                @if (formData.parameters.length > 0) {\n                  @for (param of formData.parameters; track param.id) {\n                    <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                      <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">{{ param.name }}:</span>\n                      <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ param.type }}{{ param.required ? ' (Required)' : '' }}</span>\n                    </div>\n                  }\n                } @else {\n                  <div class=\"review-item\">\n                    <span class=\"value ax-text-gray-900\">No parameters defined</span>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n  </ax-step-wizard>\n\n  <div class=\"ax-flex ax-justify-center ax-p-5\">\n    <ng-template [axStepWizardContent] #wizardContent=\"axStepWizardContent\">\n    </ng-template>\n  </div>\n\n  <div class=\"ax-mt-10 ax-flex ax-justify-between ax-items-center ax-pt-6 ax-border-t ax-border-gray-200\">\n    <div class=\"nav-left\">\n      <ax-button\n        [disabled]=\"reportWizard.isFirst()\"\n        (onClick)=\"reportWizard.previous()\"\n        [color]=\"'primary'\"\n        text=\"\u2190 Previous\"\n        look=\"outline\">\n      </ax-button>\n    </div>\n\n    <div class=\"nav-right\">\n      @if(reportWizard.isLast()) {\n        <ax-button \n          (onClick)=\"finishWizard()\" \n          color=\"success\" \n          text=\"Create Report\"\n          [disabled]=\"isSaving()\">\n          @if (isSaving()) {\n            Creating...\n          } @else {\n            Create Report\n          }\n        </ax-button>\n      } @else {\n        <ax-button\n          (onClick)=\"nextStep()\"\n          color=\"primary\"\n          text=\"Next \u2192\"\n          [disabled]=\"!canProceed()\">\n        </ax-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [".step-content{min-height:24rem}.step-title-section{margin-bottom:1.5rem;text-align:center}.step-title-section h3{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.step-title-section p{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.form-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1.5rem}@media (min-width: 768px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.format-selection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}@media (max-width: 480px){.format-selection{grid-template-columns:repeat(1,minmax(0,1fr))}}.format-option{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding:.75rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.format-option:has(input:checked){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1));background-color:rgba(var(--ax-sys-color-primary-500),.05)}.schedule-section>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.schedule-section .schedule-options{border-left-width:2px;border-color:rgba(var(--ax-sys-color-primary-500),.2);padding-left:1.5rem}.parameters-section>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.parameters-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.parameter-item{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem}.parameter-item>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.parameter-item .parameter-fields{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1rem}@media (min-width: 768px){.parameter-item .parameter-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}.no-parameters{padding-top:2rem;padding-bottom:2rem;text-align:center;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.add-parameter-section{text-align:center}.review-sections>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.review-section{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1.5rem}.review-section h4{margin-bottom:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:600;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding-bottom:.5rem}.review-items>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.review-item{display:flex;align-items:flex-start;justify-content:space-between}@media (max-width: 480px){.review-item{flex-direction:column}.review-item>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}}.review-item .label{margin-right:1rem;min-width:0px;flex-shrink:0;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.review-item .value{overflow-wrap:break-word;text-align:right;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}@media (max-width: 480px){.review-item .value{text-align:left}}ax-form-field{display:block}ax-form-field ax-label{margin-bottom:.5rem;display:block;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: 
+                // Angular
+                CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: 
+                // ACoreX
+                AXFormModule }, { kind: "component", type: i2.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "component", type: i2.AXFormComponent, selector: "ax-form", inputs: ["labelMode", "look", "messageStyle", "updateOn"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i3.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i5.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i6.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "checked", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i7.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i8.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i8.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXStepWizardModule }, { kind: "component", type: i9.AXStepWizardComponent, selector: "ax-step-wizard", inputs: ["connector", "size", "look", "changeStep", "orientation", "content"], outputs: ["stepChanged"] }, { kind: "component", type: i9.AXStepWizardItemComponent, selector: "ax-step-wizard-item", inputs: ["disabled", "color", "step", "label", "description", "customTemplate", "active", "passed", "look", "state", "id"], outputs: ["activeChange", "passedChange", "lookChange", "stateChange"] }, { kind: "directive", type: i9.AXStepWizardContentDirective, selector: "[axStepWizardContent]", inputs: ["axStepWizardContent"], exportAs: ["axStepWizardContent"] }], animations: [
+            trigger('fadeIn', [
+                transition(':enter', [
+                    style({ opacity: 0, transform: 'translateY(20px)' }),
+                    animate('300ms ease-in', style({ opacity: 1, transform: 'translateY(0)' }))
+                ])
+            ])
+        ], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AXPReportCreateRootComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-report-create-root', imports: [
+                        // Angular
+                        CommonModule,
+                        FormsModule,
+                        // ACoreX
+                        AXFormModule,
+                        AXTextBoxModule,
+                        AXButtonModule,
+                        AXLabelModule,
+                        AXCheckBoxModule,
+                        AXSelectBoxModule,
+                        AXSwitchModule,
+                        AXDecoratorModule,
+                        AXTranslationModule,
+                        AXStepWizardModule,
+                        // Platform
+                    ], encapsulation: ViewEncapsulation.None, providers: [], animations: [
+                        trigger('fadeIn', [
+                            transition(':enter', [
+                                style({ opacity: 0, transform: 'translateY(20px)' }),
+                                animate('300ms ease-in', style({ opacity: 1, transform: 'translateY(0)' }))
+                            ])
+                        ])
+                    ], template: "<div class=\"ax-w-full ax-max-w-4xl ax-mx-auto ax-p-6\">\n  <div class=\"step-wizard-header ax-text-center ax-mb-8\">\n    <h2 class=\"ax-text-2xl ax-font-bold ax-text-gray-900 ax-mb-2\">Create New Report</h2>\n    <p class=\"ax-text-gray-600\">Follow these steps to create your custom report</p>\n  </div>\n\n  <ax-step-wizard\n    [content]=\"wizardContent\"\n    [look]=\"'rounded-icon'\"\n    #reportWizard\n  >\n    <ax-step-wizard-item [label]=\"'Basic Information'\" [id]=\"'basic'\">\n      <ax-icon class=\"fas fa-info-circle\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Basic Information</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Enter the basic details for your report</p>\n          </div>\n          \n          <ax-form #basicForm>\n            <div class=\"form-grid ax-grid ax-grid-cols-1 md:ax-grid-cols-2 ax-gap-6\">\n              <ax-form-field>\n                <ax-label>Report Name *</ax-label>\n                <ax-text-box \n                  [(ngModel)]=\"formData.name\"\n                  placeholder=\"Enter report name\"\n                  [required]=\"true\"\n                  name=\"reportName\">\n                </ax-text-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Report Title *</ax-label>\n                <ax-text-box \n                  [(ngModel)]=\"formData.title\"\n                  placeholder=\"Enter report title\"\n                  [required]=\"true\"\n                  name=\"reportTitle\">\n                </ax-text-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Category *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.category\"\n                  [dataSource]=\"categories\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'name'\"\n                  placeholder=\"Select category\"\n                  [required]=\"true\"\n                  name=\"reportCategory\">\n                </ax-select-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Data Source *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.dataSource\"\n                  [dataSource]=\"dataSources\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'title'\"\n                  placeholder=\"Select data source\"\n                  [required]=\"true\"\n                  name=\"reportDataSource\">\n                </ax-select-box>\n              </ax-form-field>\n            </div>\n          </ax-form>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Configuration'\" [id]=\"'config'\">\n      <ax-icon class=\"fas fa-cog\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Report Configuration</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Configure your report settings</p>\n          </div>\n          \n          <ax-form #configForm>\n            <div class=\"form-grid ax-grid ax-grid-cols-1 md:ax-grid-cols-2 ax-gap-6\">\n              <ax-form-field>\n                <ax-label>Template *</ax-label>\n                <ax-select-box \n                  [(ngModel)]=\"formData.template\"\n                  [dataSource]=\"templates\"\n                  [valueField]=\"'id'\"\n                  [textField]=\"'name'\"\n                  placeholder=\"Select template\"\n                  [required]=\"true\"\n                  name=\"reportTemplate\">\n                </ax-select-box>\n              </ax-form-field>\n\n              <ax-form-field>\n                <ax-label>Output Formats *</ax-label>\n                <div class=\"format-selection ax-grid ax-grid-cols-2 ax-gap-3\">\n                  @for (format of formats; track format.id) {\n                    <div class=\"format-option ax-p-3 ax-border ax-border-gray-200 ax-rounded-lg ax-transition-colors\">\n                      <ax-check-box \n                        [(ngModel)]=\"formData.formats[format.id]\"\n                        [name]=\"'format_' + format.id\">\n                        {{ format.name }}\n                      </ax-check-box>\n                    </div>\n                  }\n                </div>\n              </ax-form-field>\n\n              <ax-form-field class=\"md:ax-col-span-2\">\n                <div class=\"schedule-section ax-space-y-4\">\n                  <ax-check-box \n                    [(ngModel)]=\"formData.isScheduled\"\n                    name=\"isScheduled\">\n                    Enable scheduled reports\n                  </ax-check-box>\n                  \n                  @if (formData.isScheduled) {\n                    <div class=\"schedule-options ax-pl-6 ax-border-l-2 ax-border-primary/20\">\n                      <ax-form-field>\n                        <ax-label>Frequency</ax-label>\n                        <ax-select-box \n                          [(ngModel)]=\"formData.scheduleFrequency\"\n                          [dataSource]=\"frequencies\"\n                          [valueField]=\"'id'\"\n                          [textField]=\"'name'\"\n                          placeholder=\"Select frequency\"\n                          name=\"scheduleFrequency\">\n                        </ax-select-box>\n                      </ax-form-field>\n                    </div>\n                  }\n                </div>\n              </ax-form-field>\n            </div>\n          </ax-form>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Parameters'\" [id]=\"'parameters'\">\n      <ax-icon class=\"fas fa-sliders-h\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Report Parameters</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Define parameters for your report</p>\n          </div>\n          \n          <div class=\"parameters-section ax-space-y-6\">\n            @if (formData.parameters.length > 0) {\n              <div class=\"parameters-list ax-space-y-4\">\n                @for (param of formData.parameters; track param.id; let i = $index) {\n                  <div class=\"parameter-item ax-p-4 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50 ax-space-y-4\">\n                    <div class=\"parameter-fields ax-grid ax-grid-cols-1 md:ax-grid-cols-3 ax-gap-4\">\n                      <ax-form-field>\n                        <ax-label>Parameter Name</ax-label>\n                        <ax-text-box \n                          [(ngModel)]=\"param.name\"\n                          placeholder=\"Enter parameter name\"\n                          [name]=\"'param_name_' + i\">\n                        </ax-text-box>\n                      </ax-form-field>\n                      \n                      <ax-form-field>\n                        <ax-label>Type</ax-label>\n                        <ax-select-box \n                          [(ngModel)]=\"param.type\"\n                          [dataSource]=\"parameterTypes\"\n                          [valueField]=\"'id'\"\n                          [textField]=\"'name'\"\n                          placeholder=\"Select type\"\n                          [name]=\"'param_type_' + i\">\n                        </ax-select-box>\n                      </ax-form-field>\n                      \n                      <ax-form-field>\n                        <ax-check-box \n                          [(ngModel)]=\"param.required\"\n                          [name]=\"'param_required_' + i\">\n                          Required\n                        </ax-check-box>\n                      </ax-form-field>\n                    </div>\n                    \n                    <ax-button \n                      look=\"ghost\"\n                      color=\"danger\"\n                      size=\"small\"\n                      (onClick)=\"removeParameter(i)\">\n                      Remove\n                    </ax-button>\n                  </div>\n                }\n              </div>\n            } @else {\n              <div class=\"no-parameters ax-text-center ax-py-8 ax-text-gray-500\">\n                <p>No parameters defined yet.</p>\n              </div>\n            }\n            \n            <div class=\"add-parameter-section ax-text-center\">\n              <ax-button \n                look=\"outline\"\n                color=\"primary\"\n                (onClick)=\"addParameter()\">\n                + Add Parameter\n              </ax-button>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n\n    <ax-step-wizard-item [label]=\"'Review'\" [id]=\"'review'\">\n      <ax-icon class=\"fas fa-check-circle\"></ax-icon>\n      <ax-content>\n        <div class=\"step-content\">\n          <div class=\"step-title-section ax-text-center ax-mb-6\">\n            <h3 class=\"ax-text-xl ax-font-bold ax-text-gray-900 ax-mb-2\">Review & Confirm</h3>\n            <p class=\"ax-text-gray-600 ax-text-sm\">Review your report configuration before creating</p>\n          </div>\n          \n          <div class=\"review-sections ax-space-y-6\">\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Basic Information</h4>\n              <div class=\"review-items ax-space-y-3\">\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Name:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.name || 'Not specified' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Title:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.title || 'Not specified' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Category:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getCategoryName(formData.category) || 'Not selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Data Source:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getDataSourceTitle(formData.dataSource) || 'Not selected' }}</span>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Configuration</h4>\n              <div class=\"review-items ax-space-y-3\">\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Template:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getTemplateName(formData.template) || 'Not selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Formats:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ getSelectedFormats() || 'None selected' }}</span>\n                </div>\n                <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                  <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">Scheduled:</span>\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ formData.isScheduled ? 'Yes - ' + formData.scheduleFrequency : 'No' }}</span>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"review-section ax-p-6 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50\">\n              <h4 class=\"ax-text-lg ax-font-semibold ax-text-gray-900 ax-mb-4 ax-pb-2 ax-border-b ax-border-gray-200\">Parameters</h4>\n              <div class=\"review-items ax-space-y-3\">\n                @if (formData.parameters.length > 0) {\n                  @for (param of formData.parameters; track param.id) {\n                    <div class=\"review-item ax-flex ax-justify-between ax-items-start\">\n                      <span class=\"label ax-font-medium ax-text-gray-700 ax-min-w-0 ax-mr-4 ax-flex-shrink-0\">{{ param.name }}:</span>\n                      <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{ param.type }}{{ param.required ? ' (Required)' : '' }}</span>\n                    </div>\n                  }\n                } @else {\n                  <div class=\"review-item\">\n                    <span class=\"value ax-text-gray-900\">No parameters defined</span>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-step-wizard-item>\n  </ax-step-wizard>\n\n  <div class=\"ax-flex ax-justify-center ax-p-5\">\n    <ng-template [axStepWizardContent] #wizardContent=\"axStepWizardContent\">\n    </ng-template>\n  </div>\n\n  <div class=\"ax-mt-10 ax-flex ax-justify-between ax-items-center ax-pt-6 ax-border-t ax-border-gray-200\">\n    <div class=\"nav-left\">\n      <ax-button\n        [disabled]=\"reportWizard.isFirst()\"\n        (onClick)=\"reportWizard.previous()\"\n        [color]=\"'primary'\"\n        text=\"\u2190 Previous\"\n        look=\"outline\">\n      </ax-button>\n    </div>\n\n    <div class=\"nav-right\">\n      @if(reportWizard.isLast()) {\n        <ax-button \n          (onClick)=\"finishWizard()\" \n          color=\"success\" \n          text=\"Create Report\"\n          [disabled]=\"isSaving()\">\n          @if (isSaving()) {\n            Creating...\n          } @else {\n            Create Report\n          }\n        </ax-button>\n      } @else {\n        <ax-button\n          (onClick)=\"nextStep()\"\n          color=\"primary\"\n          text=\"Next \u2192\"\n          [disabled]=\"!canProceed()\">\n        </ax-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [".step-content{min-height:24rem}.step-title-section{margin-bottom:1.5rem;text-align:center}.step-title-section h3{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.step-title-section p{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.form-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1.5rem}@media (min-width: 768px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.format-selection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}@media (max-width: 480px){.format-selection{grid-template-columns:repeat(1,minmax(0,1fr))}}.format-option{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding:.75rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.format-option:has(input:checked){--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-primary-500),var(--tw-border-opacity, 1));background-color:rgba(var(--ax-sys-color-primary-500),.05)}.schedule-section>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.schedule-section .schedule-options{border-left-width:2px;border-color:rgba(var(--ax-sys-color-primary-500),.2);padding-left:1.5rem}.parameters-section>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.parameters-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.parameter-item{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem}.parameter-item>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.parameter-item .parameter-fields{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1rem}@media (min-width: 768px){.parameter-item .parameter-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}.no-parameters{padding-top:2rem;padding-bottom:2rem;text-align:center;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.add-parameter-section{text-align:center}.review-sections>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.review-section{border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1.5rem}.review-section h4{margin-bottom:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:600;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding-bottom:.5rem}.review-items>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.review-item{display:flex;align-items:flex-start;justify-content:space-between}@media (max-width: 480px){.review-item{flex-direction:column}.review-item>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}}.review-item .label{margin-right:1rem;min-width:0px;flex-shrink:0;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.review-item .value{overflow-wrap:break-word;text-align:right;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}@media (max-width: 480px){.review-item .value{text-align:left}}ax-form-field{display:block}ax-form-field ax-label{margin-bottom:.5rem;display:block;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}\n"] }]
+        }] });
+
+export { AXPReportCreateRootComponent };
+//# sourceMappingURL=acorex-modules-report-management-report-create-root.component-LrE6TkIp.mjs.map