@snteam/amplify-angular-core 1.0.41 → 1.0.43

package/fesm2022/snteam-amplify-angular-core.mjs

@@ -3,7 +3,7 @@ import { Injectable, Component, Pipe, inject, Input, ChangeDetectionStrategy, mo
 import * as i3$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i1 from '@angular/forms';
-import { FormGroup, Validators, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { FormGroup, Validators, FormControl, ReactiveFormsModule, FormsModule, FormBuilder } from '@angular/forms';
 import * as i4 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i3 from '@angular/material/form-field';
@@ -30,9 +30,9 @@ import * as i4$1 from '@angular/router';
 import { ActivatedRoute, Router } from '@angular/router';
 import * as i5$2 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i1$1 from '@angular/material/expansion';
+import * as i2 from '@angular/material/expansion';
 import { MatExpansionModule } from '@angular/material/expansion';
-import * as i3$5 from '@angular/material/card';
+import * as i4$2 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 
 // Dynamic Relationship Loader Interfaces
@@ -5150,13 +5150,32 @@ class ConfigurationsComponent {
     qcs = inject(QuestionControlService);
     ams = inject(AmplifyModelService);
     snackBar = inject(MatSnackBar);
+    fb = inject(FormBuilder);
     // Track which models exist in the schema
     hasTableConfig = false;
     hasFormView = false;
     hasListView = false;
     hasFieldConfig = false;
+    hasRelationshipConfig = false;
+    // Relationship configuration management
+    relationshipConfigs = [];
+    showAddRelationshipConfig = false;
+    editingRelationshipConfig = null;
+    relationshipConfigForm;
+    availableModels = [];
+    availableFields = [];
+    constructor() {
+        this.relationshipConfigForm = this.fb.group({
+            relationshipModel: ['', Validators.required],
+            fieldName: ['', Validators.required],
+            selectionSet: ['', Validators.required],
+            description: ['']
+        });
+    }
     ngOnInit() {
         this.checkAvailableModels();
+        this.loadRelationshipConfigs();
+        this.loadAvailableModels();
     }
     get outputs() {
         return this.amplifyOutputs || this.qcs.outputs;
@@ -5172,11 +5191,13 @@ class ConfigurationsComponent {
         this.hasFormView = 'FormView' in models;
         this.hasListView = 'ListView' in models;
         this.hasFieldConfig = 'FieldConfig' in models;
+        this.hasRelationshipConfig = 'RelationshipConfig' in models;
         console.log('ConfigurationsComponent: Model availability:', {
             TableConfig: this.hasTableConfig,
             FormView: this.hasFormView,
             ListView: this.hasListView,
-            FieldConfig: this.hasFieldConfig
+            FieldConfig: this.hasFieldConfig,
+            RelationshipConfig: this.hasRelationshipConfig
         });
     }
     async populateDefaultFieldConfigs() {
@@ -5447,21 +5468,400 @@ return fields;
         }
         return 'text'; // Default fallback
     }
+    // Relationship Configuration Management Methods
+    loadAvailableModels() {
+        if (!this.outputs || !this.outputs.data || !this.outputs.data.model_introspection) {
+            console.warn('ConfigurationsComponent: No model introspection data available for relationship configs');
+            return;
+        }
+        const models = this.outputs.data.model_introspection.models;
+        this.availableModels = Object.keys(models).sort();
+        console.log('ConfigurationsComponent: Available models for relationship configs:', this.availableModels);
+    }
+    onRelationshipModelChange(event) {
+        const selectedModel = event.value;
+        this.loadAvailableFields(selectedModel);
+        // Reset field name when model changes
+        this.relationshipConfigForm.patchValue({ fieldName: '' });
+    }
+    loadAvailableFields(modelName) {
+        if (!this.outputs || !this.outputs.data || !this.outputs.data.model_introspection) {
+            this.availableFields = [];
+            return;
+        }
+        const models = this.outputs.data.model_introspection.models;
+        const modelData = models[modelName];
+        if (!modelData || !modelData.fields) {
+            this.availableFields = [];
+            return;
+        }
+        // Get relationship fields from the selected model
+        this.availableFields = Object.values(modelData.fields)
+            .filter((field) => {
+            // Include relationship fields (fields that reference other models)
+            return field.association && field.association.connectionType;
+        })
+            .map((field) => ({
+            name: field.name,
+            label: this.formatFieldLabel(field.name),
+            type: field.type
+        }))
+            .sort((a, b) => a.label.localeCompare(b.label));
+        console.log('ConfigurationsComponent: Available relationship fields for', modelName, ':', this.availableFields);
+    }
+    loadRelationshipConfigs() {
+        if (!this.hasRelationshipConfig) {
+            console.warn('ConfigurationsComponent: RelationshipConfig model not available, falling back to localStorage');
+            this.loadRelationshipConfigsFromLocalStorage();
+            return;
+        }
+        // Load from Amplify RelationshipConfig model
+        const observable = this.ams.listItemsForModel('RelationshipConfig');
+        if (!observable) {
+            console.error('ConfigurationsComponent: Failed to get RelationshipConfig observable');
+            this.loadRelationshipConfigsFromLocalStorage();
+            return;
+        }
+        observable.subscribe({
+            next: ({ items }) => {
+                this.relationshipConfigs = items
+                    .filter((item) => item.isActive !== false)
+                    .map((item) => ({
+                    id: item.id,
+                    relationshipModel: item.relationshipModel,
+                    fieldName: item.fieldName,
+                    selectionSet: item.selectionSet || [],
+                    description: item.description
+                }));
+                console.log('ConfigurationsComponent: Loaded relationship configs from Amplify:', this.relationshipConfigs);
+                // Update the AmplifyModelService with loaded configurations
+                this.updateAmplifyModelService();
+            },
+            error: (error) => {
+                console.error('ConfigurationsComponent: Error loading relationship configs from Amplify:', error);
+                this.loadRelationshipConfigsFromLocalStorage();
+            }
+        });
+    }
+    loadRelationshipConfigsFromLocalStorage() {
+        // Fallback to localStorage for backward compatibility
+        const stored = localStorage.getItem('snteam-relationship-configs');
+        if (stored) {
+            try {
+                const config = JSON.parse(stored);
+                this.relationshipConfigs = (config.relationships || []).map(rel => ({
+                    ...rel,
+                    id: rel.id || this.generateId()
+                }));
+                console.log('ConfigurationsComponent: Loaded relationship configs from localStorage:', this.relationshipConfigs);
+            }
+            catch (error) {
+                console.error('ConfigurationsComponent: Error loading relationship configs from localStorage:', error);
+                this.relationshipConfigs = [];
+            }
+        }
+        else {
+            this.relationshipConfigs = [];
+        }
+    }
+    saveRelationshipConfigsToStorage() {
+        // Always update localStorage for backward compatibility
+        const config = {
+            relationships: this.relationshipConfigs.map(({ id, ...config }) => config),
+            defaultSelectionSet: ['id'],
+            enableFallback: true
+        };
+        localStorage.setItem('snteam-relationship-configs', JSON.stringify(config));
+        // Update the AmplifyModelService with the new configuration
+        this.updateAmplifyModelService();
+        console.log('ConfigurationsComponent: Saved relationship configs to storage and updated service');
+    }
+    updateAmplifyModelService() {
+        const config = {
+            relationships: this.relationshipConfigs.map(({ id, ...config }) => config),
+            defaultSelectionSet: ['id'],
+            enableFallback: true
+        };
+        this.ams.setRelationshipConfig(config);
+        console.log('ConfigurationsComponent: Updated AmplifyModelService with relationship configs');
+    }
+    async saveRelationshipConfig() {
+        if (!this.relationshipConfigForm.valid) {
+            this.snackBar.open('Please fill in all required fields', 'Dismiss', { duration: 3000 });
+            return;
+        }
+        const formValue = this.relationshipConfigForm.value;
+        // Parse selection set from textarea (one field per line)
+        const selectionSet = formValue.selectionSet
+            .split('\n')
+            .map((line) => line.trim())
+            .filter((line) => line.length > 0);
+        try {
+            if (this.editingRelationshipConfig) {
+                // Update existing configuration
+                await this.updateRelationshipConfig(this.editingRelationshipConfig.id, {
+                    relationshipModel: formValue.relationshipModel,
+                    fieldName: formValue.fieldName,
+                    selectionSet: selectionSet,
+                    description: formValue.description || undefined
+                });
+                this.snackBar.open('Relationship configuration updated successfully', 'Dismiss', { duration: 3000 });
+            }
+            else {
+                // Check for duplicate configuration
+                const existing = this.relationshipConfigs.find(c => c.relationshipModel === formValue.relationshipModel &&
+                    c.fieldName === formValue.fieldName);
+                if (existing) {
+                    this.snackBar.open('Configuration for this relationship already exists', 'Dismiss', { duration: 3000 });
+                    return;
+                }
+                // Create new configuration
+                await this.createRelationshipConfig({
+                    relationshipModel: formValue.relationshipModel,
+                    fieldName: formValue.fieldName,
+                    selectionSet: selectionSet,
+                    description: formValue.description || undefined
+                });
+                this.snackBar.open('Relationship configuration added successfully', 'Dismiss', { duration: 3000 });
+            }
+            this.cancelRelationshipConfigEdit();
+        }
+        catch (error) {
+            console.error('ConfigurationsComponent: Error saving relationship config:', error);
+            this.snackBar.open('Error saving configuration: ' + error, 'Dismiss', { duration: 5000 });
+        }
+    }
+    async createRelationshipConfig(config) {
+        if (!this.hasRelationshipConfig) {
+            // Fallback to localStorage if model not available
+            const newConfig = {
+                ...config,
+                id: this.generateId()
+            };
+            this.relationshipConfigs.push(newConfig);
+            this.saveRelationshipConfigsToStorage();
+            return;
+        }
+        const amplifyConfig = {
+            relationshipModel: config.relationshipModel,
+            fieldName: config.fieldName,
+            selectionSet: config.selectionSet,
+            description: config.description,
+            isActive: true,
+            createdAt: new Date().toISOString(),
+            updatedAt: new Date().toISOString()
+        };
+        const result = await this.ams.createItemPromise('RelationshipConfig', amplifyConfig);
+        if (result && result.data) {
+            console.log('ConfigurationsComponent: Created RelationshipConfig in Amplify:', result.data);
+            // Reload configurations to get the updated list
+            this.loadRelationshipConfigs();
+        }
+        else {
+            throw new Error('Failed to create RelationshipConfig in Amplify');
+        }
+    }
+    async updateRelationshipConfig(id, config) {
+        if (!this.hasRelationshipConfig) {
+            // Fallback to localStorage if model not available
+            const index = this.relationshipConfigs.findIndex(c => c.id === id);
+            if (index >= 0) {
+                this.relationshipConfigs[index] = { ...config, id };
+                this.saveRelationshipConfigsToStorage();
+            }
+            return;
+        }
+        const amplifyConfig = {
+            id: id,
+            relationshipModel: config.relationshipModel,
+            fieldName: config.fieldName,
+            selectionSet: config.selectionSet,
+            description: config.description,
+            updatedAt: new Date().toISOString()
+        };
+        const result = await this.ams.updateItemForModel('RelationshipConfig', amplifyConfig);
+        if (result && result.data) {
+            console.log('ConfigurationsComponent: Updated RelationshipConfig in Amplify:', result.data);
+            // Reload configurations to get the updated list
+            this.loadRelationshipConfigs();
+        }
+        else {
+            throw new Error('Failed to update RelationshipConfig in Amplify');
+        }
+    }
+    editRelationshipConfig(config) {
+        this.editingRelationshipConfig = config;
+        this.showAddRelationshipConfig = true;
+        // Load fields for the selected model
+        this.loadAvailableFields(config.relationshipModel);
+        // Populate form with existing values
+        this.relationshipConfigForm.patchValue({
+            relationshipModel: config.relationshipModel,
+            fieldName: config.fieldName,
+            selectionSet: config.selectionSet.join('\n'),
+            description: config.description || ''
+        });
+    }
+    async deleteRelationshipConfig(config) {
+        try {
+            if (!this.hasRelationshipConfig) {
+                // Fallback to localStorage if model not available
+                const index = this.relationshipConfigs.findIndex(c => c.id === config.id);
+                if (index >= 0) {
+                    this.relationshipConfigs.splice(index, 1);
+                    this.saveRelationshipConfigsToStorage();
+                    this.snackBar.open('Relationship configuration deleted', 'Dismiss', { duration: 3000 });
+                }
+                return;
+            }
+            const result = await this.ams.deleteItemForModel('RelationshipConfig', config.id);
+            if (result && result.data) {
+                console.log('ConfigurationsComponent: Deleted RelationshipConfig from Amplify:', result.data);
+                // Reload configurations to get the updated list
+                this.loadRelationshipConfigs();
+                this.snackBar.open('Relationship configuration deleted', 'Dismiss', { duration: 3000 });
+            }
+            else {
+                throw new Error('Failed to delete RelationshipConfig from Amplify');
+            }
+        }
+        catch (error) {
+            console.error('ConfigurationsComponent: Error deleting relationship config:', error);
+            this.snackBar.open('Error deleting configuration: ' + error, 'Dismiss', { duration: 5000 });
+        }
+    }
+    generateId() {
+        return 'config_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
+    }
+    cancelRelationshipConfigEdit() {
+        this.showAddRelationshipConfig = false;
+        this.editingRelationshipConfig = null;
+        this.relationshipConfigForm.reset();
+        this.availableFields = [];
+    }
+    async loadDefaultRelationshipConfigs() {
+        // Load some sensible default configurations
+        const defaultConfigs = [
+            {
+                relationshipModel: 'ListView',
+                fieldName: 'table',
+                selectionSet: [
+                    'id',
+                    'table',
+                    'table.id',
+                    'table.name',
+                    'table.title',
+                    'table.description'
+                ],
+                description: 'Configuration for ListView -> Table relationship'
+            },
+            {
+                relationshipModel: 'FormViewField',
+                fieldName: 'formView',
+                selectionSet: [
+                    'id',
+                    'formView',
+                    'formView.id',
+                    'formView.name',
+                    'formView.title',
+                    'formView.description'
+                ],
+                description: 'Configuration for FormViewField -> FormView relationship'
+            },
+            {
+                relationshipModel: 'ServiceCustomer',
+                fieldName: 'service',
+                selectionSet: [
+                    'id',
+                    'service',
+                    'service.id',
+                    'service.title',
+                    'service.cost',
+                    'service.price'
+                ],
+                description: 'Configuration for ServiceCustomer -> Service relationship'
+            },
+            {
+                relationshipModel: 'ServiceCustomer',
+                fieldName: 'customer',
+                selectionSet: [
+                    'id',
+                    'customer',
+                    'customer.id',
+                    'customer.name',
+                    'customer.contact_preference'
+                ],
+                description: 'Configuration for ServiceCustomer -> Customer relationship'
+            }
+        ];
+        try {
+            // Only add configs that don't already exist
+            let addedCount = 0;
+            for (const defaultConfig of defaultConfigs) {
+                const existing = this.relationshipConfigs.find(c => c.relationshipModel === defaultConfig.relationshipModel &&
+                    c.fieldName === defaultConfig.fieldName);
+                if (!existing) {
+                    await this.createRelationshipConfig(defaultConfig);
+                    addedCount++;
+                }
+            }
+            if (addedCount > 0) {
+                this.snackBar.open(`Added ${addedCount} default relationship configurations`, 'Dismiss', { duration: 3000 });
+            }
+            else {
+                this.snackBar.open('All default configurations already exist', 'Dismiss', { duration: 3000 });
+            }
+        }
+        catch (error) {
+            console.error('ConfigurationsComponent: Error loading default relationship configs:', error);
+            this.snackBar.open('Error loading default configurations: ' + error, 'Dismiss', { duration: 5000 });
+        }
+    }
+    async clearAllRelationshipConfigs() {
+        if (this.relationshipConfigs.length === 0) {
+            this.snackBar.open('No relationship configurations to clear', 'Dismiss', { duration: 3000 });
+            return;
+        }
+        try {
+            if (!this.hasRelationshipConfig) {
+                // Fallback to localStorage if model not available
+                this.relationshipConfigs = [];
+                this.saveRelationshipConfigsToStorage();
+                this.snackBar.open('All relationship configurations cleared', 'Dismiss', { duration: 3000 });
+                return;
+            }
+            // Delete all configurations from Amplify
+            const deletePromises = this.relationshipConfigs.map(config => this.ams.deleteItemForModel('RelationshipConfig', config.id));
+            await Promise.all(deletePromises);
+            // Reload configurations to get the updated (empty) list
+            this.loadRelationshipConfigs();
+            this.snackBar.open('All relationship configurations cleared', 'Dismiss', { duration: 3000 });
+        }
+        catch (error) {
+            console.error('ConfigurationsComponent: Error clearing relationship configs:', error);
+            this.snackBar.open('Error clearing configurations: ' + error, 'Dismiss', { duration: 5000 });
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ConfigurationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ConfigurationsComponent, isStandalone: true, selector: "snteam-configurations", inputs: { amplifyOutputs: "amplifyOutputs" }, ngImport: i0, template: "<div class=\"configurations-container\">\n  <h2>System Configurations</h2>\n  \n  <mat-accordion multi=\"true\">\n    \n    <!-- Table Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>table_chart</mat-icon>\n          <span class=\"panel-title\">Table Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Manage table configurations and settings\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasTableConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Table Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Table Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'TableConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>TableConfig Model Not Found</h3>\n              <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Form Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>dynamic_form</mat-icon>\n          <span class=\"panel-title\">Form Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure custom form layouts and field selections\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFormView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Form Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FormView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FormView Model Not Found</h3>\n              <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- List Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>view_list</mat-icon>\n          <span class=\"panel-title\">List Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Customize list displays and column configurations\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasListView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All List Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'ListView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>ListView Model Not Found</h3>\n              <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Field Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>settings</mat-icon>\n          <span class=\"panel-title\">Field Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure field behavior, validation, and choices\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFieldConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Field Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Field Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FieldConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FieldConfig Model Not Found</h3>\n              <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n  </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i1$1.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i1$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i3$5.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$5.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "component", type: ListViewComponent, selector: "snteam-list-view", inputs: ["modelName", "customItemTemplate", "hideNewButton", "title", "useRouter", "showRowActions", "showDeleteAction", "customRowActions"], outputs: ["itemClick", "newClick", "itemsLoaded", "itemDeleted"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ConfigurationsComponent, isStandalone: true, selector: "snteam-configurations", inputs: { amplifyOutputs: "amplifyOutputs" }, ngImport: i0, template: "<div class=\"configurations-container\">\n  <h2>System Configurations</h2>\n  \n  <mat-accordion multi=\"true\">\n    \n    <!-- Table Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>table_chart</mat-icon>\n          <span class=\"panel-title\">Table Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Manage table configurations and settings\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasTableConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Table Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Table Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'TableConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>TableConfig Model Not Found</h3>\n              <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Form Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>dynamic_form</mat-icon>\n          <span class=\"panel-title\">Form Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure custom form layouts and field selections\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFormView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Form Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FormView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FormView Model Not Found</h3>\n              <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- List Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>view_list</mat-icon>\n          <span class=\"panel-title\">List Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Customize list displays and column configurations\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasListView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All List Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'ListView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>ListView Model Not Found</h3>\n              <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Field Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>settings</mat-icon>\n          <span class=\"panel-title\">Field Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure field behavior, validation, and choices\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFieldConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Field Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Field Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FieldConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FieldConfig Model Not Found</h3>\n              <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Relationship Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>link</mat-icon>\n          <span class=\"panel-title\">Relationship Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure GraphQL selection sets for relationship queries\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        <div class=\"section-actions\">\n          <button mat-raised-button color=\"primary\" (click)=\"showAddRelationshipConfig = !showAddRelationshipConfig\" class=\"add-button\">\n            <mat-icon>{{ showAddRelationshipConfig ? 'close' : 'add' }}</mat-icon>\n            {{ showAddRelationshipConfig ? 'Cancel' : 'Add Relationship Config' }}\n          </button>\n          <button mat-raised-button color=\"accent\" (click)=\"loadDefaultRelationshipConfigs()\" class=\"populate-button\">\n            <mat-icon>auto_fix_high</mat-icon>\n            Load Default Configs\n          </button>\n          <button mat-raised-button color=\"warn\" (click)=\"clearAllRelationshipConfigs()\" class=\"delete-button\">\n            <mat-icon>delete</mat-icon>\n            Clear All Configs\n          </button>\n        </div>\n\n        <!-- Add/Edit Relationship Config Form -->\n        @if (showAddRelationshipConfig) {\n          <mat-card class=\"config-form-card\">\n            <mat-card-header>\n              <mat-card-title>\n                <mat-icon>{{ editingRelationshipConfig ? 'edit' : 'add' }}</mat-icon>\n                {{ editingRelationshipConfig ? 'Edit' : 'Add' }} Relationship Configuration\n              </mat-card-title>\n            </mat-card-header>\n            <mat-card-content>\n              <form [formGroup]=\"relationshipConfigForm\" (ngSubmit)=\"saveRelationshipConfig()\">\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Relationship Model</mat-label>\n                    <mat-select formControlName=\"relationshipModel\" (selectionChange)=\"onRelationshipModelChange($event)\">\n                      @for (model of availableModels; track model) {\n                        <mat-option [value]=\"model\">{{ model }}</mat-option>\n                      }\n                    </mat-select>\n                    <mat-hint>The model that contains the relationship field</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Field Name</mat-label>\n                    <mat-select formControlName=\"fieldName\">\n                      @for (field of availableFields; track field.name) {\n                        <mat-option [value]=\"field.name\">{{ field.label }}</mat-option>\n                      }\n                    </mat-select>\n                    <mat-hint>The relationship field in the selected model</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Selection Set</mat-label>\n                    <textarea \n                      matInput \n                      formControlName=\"selectionSet\" \n                      rows=\"6\"\n                      placeholder=\"Enter GraphQL selection fields, one per line:&#10;id&#10;table&#10;table.id&#10;table.name&#10;table.title\">\n                    </textarea>\n                    <mat-hint>GraphQL fields to select for this relationship (one per line)</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input matInput formControlName=\"description\" placeholder=\"Optional description for this configuration\">\n                    <mat-hint>Optional description to document this configuration</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-actions\">\n                  <button mat-raised-button color=\"primary\" type=\"submit\" [disabled]=\"!relationshipConfigForm.valid\">\n                    <mat-icon>save</mat-icon>\n                    {{ editingRelationshipConfig ? 'Update' : 'Save' }} Configuration\n                  </button>\n                  <button mat-button type=\"button\" (click)=\"cancelRelationshipConfigEdit()\">\n                    <mat-icon>cancel</mat-icon>\n                    Cancel\n                  </button>\n                </div>\n              </form>\n            </mat-card-content>\n          </mat-card>\n        }\n\n        <!-- Current Relationship Configurations -->\n        <div class=\"current-configs\">\n          <h3>Current Relationship Configurations</h3>\n          @if (relationshipConfigs.length === 0) {\n            <mat-card class=\"empty-state-card\">\n              <mat-card-content>\n                <mat-icon class=\"empty-icon\">link_off</mat-icon>\n                <h4>No Relationship Configurations</h4>\n                <p>Add relationship configurations to control GraphQL selection sets for relationship queries.</p>\n              </mat-card-content>\n            </mat-card>\n          } @else {\n            <div class=\"configs-list\">\n              @for (config of relationshipConfigs; track config.id) {\n                <mat-card class=\"config-card\">\n                  <mat-card-header>\n                    <mat-card-title>{{ config.relationshipModel }} \u2192 {{ config.fieldName }}</mat-card-title>\n                    <mat-card-subtitle>{{ config.description || 'No description' }}</mat-card-subtitle>\n                    <div class=\"card-actions\">\n                      <button mat-icon-button (click)=\"editRelationshipConfig(config)\" matTooltip=\"Edit Configuration\">\n                        <mat-icon>edit</mat-icon>\n                      </button>\n                      <button mat-icon-button color=\"warn\" (click)=\"deleteRelationshipConfig(config)\" matTooltip=\"Delete Configuration\">\n                        <mat-icon>delete</mat-icon>\n                      </button>\n                    </div>\n                  </mat-card-header>\n                  <mat-card-content>\n                    <div class=\"selection-set\">\n                      <strong>Selection Set:</strong>\n                      <div class=\"selection-fields\">\n                        @for (field of config.selectionSet; track field) {\n                          <span class=\"field-chip\">{{ field }}</span>\n                        }\n                      </div>\n                    </div>\n                  </mat-card-content>\n                </mat-card>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Configuration Status -->\n        <div class=\"config-status\">\n          <mat-card class=\"status-card\">\n            <mat-card-content>\n              <div class=\"status-info\">\n                <mat-icon class=\"status-icon\">info</mat-icon>\n                <div class=\"status-text\">\n                  <strong>Active Configurations: {{ relationshipConfigs.length }}</strong>\n                  <p>These configurations control how relationship data is queried from your GraphQL API.</p>\n                </div>\n              </div>\n            </mat-card-content>\n          </mat-card>\n        </div>\n      </div>\n    </mat-expansion-panel>\n\n  </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}.add-button{background-color:#4caf50;color:#fff}.add-button mat-icon{margin-right:8px}.config-form-card{margin:16px 0;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.config-form-card mat-card-header{background-color:#f5f5f5;border-radius:8px 8px 0 0;padding:16px 24px}.config-form-card mat-card-title{display:flex;align-items:center;font-size:18px;font-weight:500;color:#333}.config-form-card mat-card-title mat-icon{margin-right:12px;color:#2196f3}.config-form-card mat-card-content{padding:24px}.form-row{margin-bottom:20px}.full-width{width:100%}.form-actions{display:flex;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid #e0e0e0}.form-actions button mat-icon{margin-right:8px}.current-configs{margin-top:24px}.current-configs h3{margin-bottom:16px;color:#333;font-weight:500}.empty-state-card{text-align:center;padding:32px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.empty-state-card mat-card-content{padding:0}.empty-icon{font-size:48px;width:48px;height:48px;color:#bbb;margin-bottom:16px}.empty-state-card h4{margin:0 0 12px;color:#333;font-weight:500}.empty-state-card p{margin:0;color:#666;line-height:1.5}.configs-list{display:grid;gap:16px}.config-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;transition:box-shadow .2s ease}.config-card:hover{box-shadow:0 4px 8px #00000026}.config-card mat-card-header{padding:16px 20px;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between}.config-card mat-card-title{font-size:16px;font-weight:500;color:#333;margin:0}.config-card mat-card-subtitle{font-size:14px;color:#666;margin:4px 0 0}.card-actions{display:flex;gap:4px}.config-card mat-card-content{padding:16px 20px}.selection-set{margin:0}.selection-set strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.selection-fields{display:flex;flex-wrap:wrap;gap:6px}.field-chip{display:inline-block;padding:4px 8px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-family:Roboto Mono,monospace;border:1px solid #bbdefb}.config-status{margin-top:24px}.status-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.status-card mat-card-content{padding:16px 20px}.status-info{display:flex;align-items:flex-start;gap:12px}.status-icon{color:#2196f3;margin-top:2px}.status-text strong{display:block;margin-bottom:4px;color:#333;font-size:16px}.status-text p{margin:0;color:#666;font-size:14px;line-height:1.5}@media (max-width: 768px){.config-form-card mat-card-content{padding:16px}.form-actions{flex-direction:column}.form-actions button{width:100%}.config-card mat-card-header{flex-direction:column;align-items:flex-start;gap:8px}.card-actions{align-self:flex-end}.selection-fields{gap:4px}.field-chip{font-size:11px;padding:3px 6px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$2.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$2.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$2.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "component", type: ListViewComponent, selector: "snteam-list-view", inputs: ["modelName", "customItemTemplate", "hideNewButton", "title", "useRouter", "showRowActions", "showDeleteAction", "customRowActions"], outputs: ["itemClick", "newClick", "itemsLoaded", "itemDeleted"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ConfigurationsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'snteam-configurations', standalone: true, imports: [
                         CommonModule,
+                        ReactiveFormsModule,
                         MatExpansionModule,
                         MatIconModule,
                         MatCardModule,
                         MatButtonModule,
+                        MatFormFieldModule,
+                        MatInputModule,
+                        MatSelectModule,
+                        MatTooltipModule,
                         MatSnackBarModule,
                         ListViewComponent
-                    ], template: "<div class=\"configurations-container\">\n  <h2>System Configurations</h2>\n  \n  <mat-accordion multi=\"true\">\n    \n    <!-- Table Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>table_chart</mat-icon>\n          <span class=\"panel-title\">Table Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Manage table configurations and settings\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasTableConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Table Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Table Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'TableConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>TableConfig Model Not Found</h3>\n              <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Form Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>dynamic_form</mat-icon>\n          <span class=\"panel-title\">Form Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure custom form layouts and field selections\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFormView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Form Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FormView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FormView Model Not Found</h3>\n              <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- List Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>view_list</mat-icon>\n          <span class=\"panel-title\">List Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Customize list displays and column configurations\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasListView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All List Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'ListView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>ListView Model Not Found</h3>\n              <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Field Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>settings</mat-icon>\n          <span class=\"panel-title\">Field Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure field behavior, validation, and choices\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFieldConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Field Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Field Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FieldConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FieldConfig Model Not Found</h3>\n              <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n  </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}\n"] }]
-        }], propDecorators: { amplifyOutputs: [{
+                    ], template: "<div class=\"configurations-container\">\n  <h2>System Configurations</h2>\n  \n  <mat-accordion multi=\"true\">\n    \n    <!-- Table Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>table_chart</mat-icon>\n          <span class=\"panel-title\">Table Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Manage table configurations and settings\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasTableConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Table Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Table Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'TableConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>TableConfig Model Not Found</h3>\n              <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Form Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>dynamic_form</mat-icon>\n          <span class=\"panel-title\">Form Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure custom form layouts and field selections\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFormView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Form Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FormView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FormView Model Not Found</h3>\n              <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- List Views Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>view_list</mat-icon>\n          <span class=\"panel-title\">List Views</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Customize list displays and column configurations\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasListView) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All List Views\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'ListView'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>ListView Model Not Found</h3>\n              <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Field Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>settings</mat-icon>\n          <span class=\"panel-title\">Field Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure field behavior, validation, and choices\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        @if (hasFieldConfig) {\n          <div class=\"section-actions\">\n            <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n              <mat-icon>auto_fix_high</mat-icon>\n              Populate Default Field Configs\n            </button>\n            <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n              <mat-icon>delete</mat-icon>\n              Delete All Field Configs\n            </button>\n          </div>\n          <snteam-list-view \n            [modelName]=\"'FieldConfig'\"\n            [useRouter]=\"true\"\n            [showDeleteAction]=\"true\">\n          </snteam-list-view>\n        } @else {\n          <mat-card class=\"error-card\">\n            <mat-card-content>\n              <mat-icon class=\"error-icon\">error_outline</mat-icon>\n              <h3>FieldConfig Model Not Found</h3>\n              <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n              <button mat-raised-button color=\"primary\" class=\"help-button\">\n                <mat-icon>help</mat-icon>\n                View Documentation\n              </button>\n            </mat-card-content>\n          </mat-card>\n        }\n      </div>\n    </mat-expansion-panel>\n\n    <!-- Relationship Configs Section -->\n    <mat-expansion-panel>\n      <mat-expansion-panel-header>\n        <mat-panel-title>\n          <mat-icon>link</mat-icon>\n          <span class=\"panel-title\">Relationship Configs</span>\n        </mat-panel-title>\n        <mat-panel-description>\n          Configure GraphQL selection sets for relationship queries\n        </mat-panel-description>\n      </mat-expansion-panel-header>\n      \n      <div class=\"panel-content\">\n        <div class=\"section-actions\">\n          <button mat-raised-button color=\"primary\" (click)=\"showAddRelationshipConfig = !showAddRelationshipConfig\" class=\"add-button\">\n            <mat-icon>{{ showAddRelationshipConfig ? 'close' : 'add' }}</mat-icon>\n            {{ showAddRelationshipConfig ? 'Cancel' : 'Add Relationship Config' }}\n          </button>\n          <button mat-raised-button color=\"accent\" (click)=\"loadDefaultRelationshipConfigs()\" class=\"populate-button\">\n            <mat-icon>auto_fix_high</mat-icon>\n            Load Default Configs\n          </button>\n          <button mat-raised-button color=\"warn\" (click)=\"clearAllRelationshipConfigs()\" class=\"delete-button\">\n            <mat-icon>delete</mat-icon>\n            Clear All Configs\n          </button>\n        </div>\n\n        <!-- Add/Edit Relationship Config Form -->\n        @if (showAddRelationshipConfig) {\n          <mat-card class=\"config-form-card\">\n            <mat-card-header>\n              <mat-card-title>\n                <mat-icon>{{ editingRelationshipConfig ? 'edit' : 'add' }}</mat-icon>\n                {{ editingRelationshipConfig ? 'Edit' : 'Add' }} Relationship Configuration\n              </mat-card-title>\n            </mat-card-header>\n            <mat-card-content>\n              <form [formGroup]=\"relationshipConfigForm\" (ngSubmit)=\"saveRelationshipConfig()\">\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Relationship Model</mat-label>\n                    <mat-select formControlName=\"relationshipModel\" (selectionChange)=\"onRelationshipModelChange($event)\">\n                      @for (model of availableModels; track model) {\n                        <mat-option [value]=\"model\">{{ model }}</mat-option>\n                      }\n                    </mat-select>\n                    <mat-hint>The model that contains the relationship field</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Field Name</mat-label>\n                    <mat-select formControlName=\"fieldName\">\n                      @for (field of availableFields; track field.name) {\n                        <mat-option [value]=\"field.name\">{{ field.label }}</mat-option>\n                      }\n                    </mat-select>\n                    <mat-hint>The relationship field in the selected model</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Selection Set</mat-label>\n                    <textarea \n                      matInput \n                      formControlName=\"selectionSet\" \n                      rows=\"6\"\n                      placeholder=\"Enter GraphQL selection fields, one per line:&#10;id&#10;table&#10;table.id&#10;table.name&#10;table.title\">\n                    </textarea>\n                    <mat-hint>GraphQL fields to select for this relationship (one per line)</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-row\">\n                  <mat-form-field appearance=\"outline\" class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input matInput formControlName=\"description\" placeholder=\"Optional description for this configuration\">\n                    <mat-hint>Optional description to document this configuration</mat-hint>\n                  </mat-form-field>\n                </div>\n\n                <div class=\"form-actions\">\n                  <button mat-raised-button color=\"primary\" type=\"submit\" [disabled]=\"!relationshipConfigForm.valid\">\n                    <mat-icon>save</mat-icon>\n                    {{ editingRelationshipConfig ? 'Update' : 'Save' }} Configuration\n                  </button>\n                  <button mat-button type=\"button\" (click)=\"cancelRelationshipConfigEdit()\">\n                    <mat-icon>cancel</mat-icon>\n                    Cancel\n                  </button>\n                </div>\n              </form>\n            </mat-card-content>\n          </mat-card>\n        }\n\n        <!-- Current Relationship Configurations -->\n        <div class=\"current-configs\">\n          <h3>Current Relationship Configurations</h3>\n          @if (relationshipConfigs.length === 0) {\n            <mat-card class=\"empty-state-card\">\n              <mat-card-content>\n                <mat-icon class=\"empty-icon\">link_off</mat-icon>\n                <h4>No Relationship Configurations</h4>\n                <p>Add relationship configurations to control GraphQL selection sets for relationship queries.</p>\n              </mat-card-content>\n            </mat-card>\n          } @else {\n            <div class=\"configs-list\">\n              @for (config of relationshipConfigs; track config.id) {\n                <mat-card class=\"config-card\">\n                  <mat-card-header>\n                    <mat-card-title>{{ config.relationshipModel }} \u2192 {{ config.fieldName }}</mat-card-title>\n                    <mat-card-subtitle>{{ config.description || 'No description' }}</mat-card-subtitle>\n                    <div class=\"card-actions\">\n                      <button mat-icon-button (click)=\"editRelationshipConfig(config)\" matTooltip=\"Edit Configuration\">\n                        <mat-icon>edit</mat-icon>\n                      </button>\n                      <button mat-icon-button color=\"warn\" (click)=\"deleteRelationshipConfig(config)\" matTooltip=\"Delete Configuration\">\n                        <mat-icon>delete</mat-icon>\n                      </button>\n                    </div>\n                  </mat-card-header>\n                  <mat-card-content>\n                    <div class=\"selection-set\">\n                      <strong>Selection Set:</strong>\n                      <div class=\"selection-fields\">\n                        @for (field of config.selectionSet; track field) {\n                          <span class=\"field-chip\">{{ field }}</span>\n                        }\n                      </div>\n                    </div>\n                  </mat-card-content>\n                </mat-card>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Configuration Status -->\n        <div class=\"config-status\">\n          <mat-card class=\"status-card\">\n            <mat-card-content>\n              <div class=\"status-info\">\n                <mat-icon class=\"status-icon\">info</mat-icon>\n                <div class=\"status-text\">\n                  <strong>Active Configurations: {{ relationshipConfigs.length }}</strong>\n                  <p>These configurations control how relationship data is queried from your GraphQL API.</p>\n                </div>\n              </div>\n            </mat-card-content>\n          </mat-card>\n        </div>\n      </div>\n    </mat-expansion-panel>\n\n  </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}.add-button{background-color:#4caf50;color:#fff}.add-button mat-icon{margin-right:8px}.config-form-card{margin:16px 0;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.config-form-card mat-card-header{background-color:#f5f5f5;border-radius:8px 8px 0 0;padding:16px 24px}.config-form-card mat-card-title{display:flex;align-items:center;font-size:18px;font-weight:500;color:#333}.config-form-card mat-card-title mat-icon{margin-right:12px;color:#2196f3}.config-form-card mat-card-content{padding:24px}.form-row{margin-bottom:20px}.full-width{width:100%}.form-actions{display:flex;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid #e0e0e0}.form-actions button mat-icon{margin-right:8px}.current-configs{margin-top:24px}.current-configs h3{margin-bottom:16px;color:#333;font-weight:500}.empty-state-card{text-align:center;padding:32px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.empty-state-card mat-card-content{padding:0}.empty-icon{font-size:48px;width:48px;height:48px;color:#bbb;margin-bottom:16px}.empty-state-card h4{margin:0 0 12px;color:#333;font-weight:500}.empty-state-card p{margin:0;color:#666;line-height:1.5}.configs-list{display:grid;gap:16px}.config-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;transition:box-shadow .2s ease}.config-card:hover{box-shadow:0 4px 8px #00000026}.config-card mat-card-header{padding:16px 20px;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between}.config-card mat-card-title{font-size:16px;font-weight:500;color:#333;margin:0}.config-card mat-card-subtitle{font-size:14px;color:#666;margin:4px 0 0}.card-actions{display:flex;gap:4px}.config-card mat-card-content{padding:16px 20px}.selection-set{margin:0}.selection-set strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.selection-fields{display:flex;flex-wrap:wrap;gap:6px}.field-chip{display:inline-block;padding:4px 8px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-family:Roboto Mono,monospace;border:1px solid #bbdefb}.config-status{margin-top:24px}.status-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.status-card mat-card-content{padding:16px 20px}.status-info{display:flex;align-items:flex-start;gap:12px}.status-icon{color:#2196f3;margin-top:2px}.status-text strong{display:block;margin-bottom:4px;color:#333;font-size:16px}.status-text p{margin:0;color:#666;font-size:14px;line-height:1.5}@media (max-width: 768px){.config-form-card mat-card-content{padding:16px}.form-actions{flex-direction:column}.form-actions button{width:100%}.config-card mat-card-header{flex-direction:column;align-items:flex-start;gap:8px}.card-actions{align-self:flex-end}.selection-fields{gap:4px}.field-chip{font-size:11px;padding:3px 6px}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { amplifyOutputs: [{
                 type: Input
             }] } });