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 i2$1 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 i3$1 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 { AXPStateMessageComponent } from '@acorex/platform/layout/components';
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', ...(ngDevMode ? [{ debugName: "reportWizard" }] : []));
        this.isValidating = signal(false, ...(ngDevMode ? [{ debugName: "isValidating" }] : []));
        this.isSaving = signal(false, ...(ngDevMode ? [{ debugName: "isSaving" }] : []));
        //#endregion
        //#region ----   Computed Properties   ----
        this.canProceed = computed(() => {
            return this.validateCurrentStep();
        }, ...(ngDevMode ? [{ debugName: "canProceed" }] : []));
        //#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.3.4", ngImport: i0, type: AXPReportCreateRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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 [content]=\"wizardContent\" [look]=\"'rounded-icon'\" #reportWizard>\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                >\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                >\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                >\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                >\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                >\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 [(ngModel)]=\"formData.formats[format.id]\" [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 [(ngModel)]=\"formData.isScheduled\" 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                        >\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\n                    class=\"parameter-item ax-p-4 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50 ax-space-y-4\"\n                  >\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                        >\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                        >\n                        </ax-select-box>\n                      </ax-form-field>\n\n                      <ax-form-field>\n                        <ax-check-box [(ngModel)]=\"param.required\" [name]=\"'param_required_' + i\">\n                          Required\n                        </ax-check-box>\n                      </ax-form-field>\n                    </div>\n\n                    <ax-button look=\"ghost\" color=\"danger\" size=\"small\" (onClick)=\"removeParameter(i)\">\n                      Remove\n                    </ax-button>\n                  </div>\n                }\n              </div>\n            } @else {\n              <axp-state-message\n                icon=\"fa-light fa-sliders-h\"\n                [title]=\"'@report-management:no-parameters.title'\"\n                [description]=\"'@report-management:no-parameters.description'\"\n              >\n              </axp-state-message>\n            }\n\n            <div class=\"add-parameter-section ax-text-center\">\n              <ax-button look=\"outline\" color=\"primary\" (onClick)=\"addParameter()\"> + Add Parameter </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\">\n                Basic Information\n              </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\">{{\n                    formData.name || 'Not specified'\n                  }}</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\">{{\n                    formData.title || 'Not specified'\n                  }}</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\"\n                    >Category:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getCategoryName(formData.category) || 'Not selected'\n                  }}</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\"\n                    >Data Source:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getDataSourceTitle(formData.dataSource) || 'Not selected'\n                  }}</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\">\n                Configuration\n              </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\"\n                    >Template:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getTemplateName(formData.template) || 'Not selected'\n                  }}</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\"\n                    >Formats:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getSelectedFormats() || 'None selected'\n                  }}</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\"\n                    >Scheduled:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    formData.isScheduled ? 'Yes - ' + formData.scheduleFrequency : 'No'\n                  }}</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\">\n                Parameters\n              </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\"\n                        >{{ param.name }}:</span\n                      >\n                      <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\"\n                        >{{ param.type }}{{ param.required ? ' (Required)' : '' }}</span\n                      >\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\"> </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      >\n      </ax-button>\n    </div>\n\n    <div class=\"nav-right\">\n      @if (reportWizard.isLast()) {\n        <ax-button (onClick)=\"finishWizard()\" color=\"success\" text=\"Create Report\" [disabled]=\"isSaving()\">\n          @if (isSaving()) {\n            Creating...\n          } @else {\n            Create Report\n          }\n        </ax-button>\n      } @else {\n        <ax-button (onClick)=\"nextStep()\" color=\"primary\" text=\"Next \u2192\" [disabled]=\"!canProceed()\"> </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: i2$1.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", "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", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3$1.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", "scrollToStep", "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"] }, { kind: "component", type: 
                // Platform
                AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "variant"] }], 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.3.4", 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
                        AXPStateMessageComponent,
                    ], 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 [content]=\"wizardContent\" [look]=\"'rounded-icon'\" #reportWizard>\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                >\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                >\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                >\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                >\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                >\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 [(ngModel)]=\"formData.formats[format.id]\" [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 [(ngModel)]=\"formData.isScheduled\" 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                        >\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\n                    class=\"parameter-item ax-p-4 ax-border ax-border-gray-200 ax-rounded-lg ax-bg-gray-50 ax-space-y-4\"\n                  >\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                        >\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                        >\n                        </ax-select-box>\n                      </ax-form-field>\n\n                      <ax-form-field>\n                        <ax-check-box [(ngModel)]=\"param.required\" [name]=\"'param_required_' + i\">\n                          Required\n                        </ax-check-box>\n                      </ax-form-field>\n                    </div>\n\n                    <ax-button look=\"ghost\" color=\"danger\" size=\"small\" (onClick)=\"removeParameter(i)\">\n                      Remove\n                    </ax-button>\n                  </div>\n                }\n              </div>\n            } @else {\n              <axp-state-message\n                icon=\"fa-light fa-sliders-h\"\n                [title]=\"'@report-management:no-parameters.title'\"\n                [description]=\"'@report-management:no-parameters.description'\"\n              >\n              </axp-state-message>\n            }\n\n            <div class=\"add-parameter-section ax-text-center\">\n              <ax-button look=\"outline\" color=\"primary\" (onClick)=\"addParameter()\"> + Add Parameter </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\">\n                Basic Information\n              </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\">{{\n                    formData.name || 'Not specified'\n                  }}</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\">{{\n                    formData.title || 'Not specified'\n                  }}</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\"\n                    >Category:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getCategoryName(formData.category) || 'Not selected'\n                  }}</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\"\n                    >Data Source:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getDataSourceTitle(formData.dataSource) || 'Not selected'\n                  }}</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\">\n                Configuration\n              </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\"\n                    >Template:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getTemplateName(formData.template) || 'Not selected'\n                  }}</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\"\n                    >Formats:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    getSelectedFormats() || 'None selected'\n                  }}</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\"\n                    >Scheduled:</span\n                  >\n                  <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\">{{\n                    formData.isScheduled ? 'Yes - ' + formData.scheduleFrequency : 'No'\n                  }}</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\">\n                Parameters\n              </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\"\n                        >{{ param.name }}:</span\n                      >\n                      <span class=\"value ax-text-gray-900 ax-text-right ax-break-words\"\n                        >{{ param.type }}{{ param.required ? ' (Required)' : '' }}</span\n                      >\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\"> </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      >\n      </ax-button>\n    </div>\n\n    <div class=\"nav-right\">\n      @if (reportWizard.isLast()) {\n        <ax-button (onClick)=\"finishWizard()\" color=\"success\" text=\"Create Report\" [disabled]=\"isSaving()\">\n          @if (isSaving()) {\n            Creating...\n          } @else {\n            Create Report\n          }\n        </ax-button>\n      } @else {\n        <ax-button (onClick)=\"nextStep()\" color=\"primary\" text=\"Next \u2192\" [disabled]=\"!canProceed()\"> </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-w6pWujhV.mjs.map
