qdr.app.tools/UILayoutDefinitionFormat/Samples/sample.xml

<?xml version="1.0" encoding="UTF-8"?>
<!-- Enhanced UI Layout Definition Format Sample v1.3 -->
<ui-layout-def xmlns="http://quadarax.com/ui-layout-definition"
               xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
               xmlns:patterns="http://quadarax.com/ui-layout-patterns"
               xmlns:validation="http://quadarax.com/ui-layout-validation"
               xmlns:views="http://quadarax.com/ui-layout-views"
               xsi:schemaLocation="http://quadarax.com/ui-layout-definition ui-layout-def.xsd"
               version="1.3"
               schema-version="1.3"
               min-version="1.0"
               max-version="2.0"
               target-platform="avalonia"
               accessibility-compliance="wcag-aa">
  
  <!-- ENHANCED: v1.3 Validation Rules with Custom Validators and Profiles -->
  <validation-rules>
    <validation-include src="wcag-validation.xml" important="true" min-version="1.3" />
    <validation-include src="performance-rules.xml" important="true" min-version="1.3" />
    <validation-include src="security-rules.xml" important="true" min-version="1.3" />
    <validation-include src="view-validation.xml" important="true" min-version="1.2" />
    
    <!-- Custom Business Rule Validator -->
    <custom-validator name="BusinessRuleValidator" version="1.0" category="business-rules">
      <validation:description>Validates business-specific constraints</validation:description>
      <implementation>
        <script language="javascript">
          function validate(element, context) {
            // Custom validation logic
            return element.hasAttribute('required') ? element.value.length > 0 : true;
          }
        </script>
      </implementation>
      <parameter name="strict-mode" type="bool" default-value="false" required="false" 
                 description="Enable strict business rule validation" />
      <test-case name="required-field" description="Should validate required fields">
        <input><TextBox required="true" text="" /></input>
        <expected-result>fail</expected-result>
        <expected-message>Required field cannot be empty</expected-message>
      </test-case>
    </custom-validator>
    
    <!-- Production Validation Profile -->
    <validation-profile name="ProductionProfile" version="1.0" target-platform="avalonia" enabled="true">
      <description>Production-ready validation with accessibility and performance checks</description>
      <profile-rule rule-name="BusinessRuleValidator" enabled="true" severity="error" 
                    configuration="strict-mode=true" />
      <profile-rule rule-name="accessibility-compliance" enabled="true" severity="warning" />
      <profile-group group-name="performance-validation" enabled="true" override-severity="warning" />
      <configuration stop-on-first-error="false" max-errors="100" parallel-execution="true" cache-results="true">
        <setting key="accessibility-level" value="wcag-aa" scope="profile" />
        <setting key="performance-threshold" value="2000ms" scope="profile" />
        <exclusion pattern="*.test.xml" type="file" reason="Test files excluded from production validation" />
      </configuration>
    </validation-profile>
  </validation-rules>
  
  <!-- ENHANCED: v1.3 Pattern Definitions with Advanced Features -->
  <patterns>
    <pattern-include src="avalonia-controls.xml" important="true" platform="avalonia" min-version="1.3" />
    <pattern-include src="accessibility-controls.xml" important="true" min-version="1.3" />
    <pattern-include src="performance-controls.xml" important="false" min-version="1.3" />
    
    <!-- Enhanced Control with v1.3 Features -->
    <control name="EnhancedDataGrid" type="data" category="avalonia-data" schema-version="1.3">
      <description>High-performance data grid with virtualization and accessibility</description>
      <constraints>
        <allowed-parents>Panel,ScrollViewer,Border</allowed-parents>
        <allowed-children>columns</allowed-children>
        <container>true</container>
        <platform-constraints>
          <platform-constraint platform="avalonia" min-version="11.0" feature-required="virtualization" />
        </platform-constraints>
        <performance-hints virtualization-supported="true" memory-intensive="true" 
                          recommended-max-items="10000" />
      </constraints>
      <attributes>
        <attribute name="items-source" type="binding" default="" category="data" 
                   description="Collection of items to display" />
        <attribute name="virtualization-enabled" type="bool" default="true" category="performance" 
                   description="Enable row virtualization for large datasets" />
        <attribute name="accessibility-mode" type="enum" values="standard,enhanced,full" default="enhanced" 
                   category="accessibility" description="Level of accessibility support" />
        <attribute name="performance-mode" type="enum" values="standard,optimized,maximum" default="optimized" 
                   category="performance" description="Performance optimization level" />
      </attributes>
      <validation>
        <rule name="max-columns" type="range" pattern="count(columns/column) &lt;= 50" 
              message="Maximum 50 columns allowed for performance" severity="warning" />
        <rule name="accessibility-headers" type="custom" message="Column headers required for accessibility" 
              severity="error" />
      </validation>
      <accessibility>
        <requirement standard="wcag" level="aa" description="Table headers and navigation" required="true" />
        <requirement standard="section-508" level="aa" description="Keyboard navigation support" required="true" />
      </accessibility>
      <data-binding supports-two-way="true" supports-commands="true" supports-validation="true">
        <bindable-property name="ItemsSource" type="collection" mode="OneWay" dependency-property="true" />
        <bindable-property name="SelectedItem" type="object" mode="TwoWay" dependency-property="true" />
        <bindable-property name="IsLoading" type="bool" mode="OneWay" default-value="false" />
      </data-binding>
      <behavior>
        <event name="selection-changed" async="false" accessibility-event="true" />
        <event name="loading-started" async="true" />
        <event name="loading-completed" async="true" />
        <command name="RefreshCommand" can-execute-property="CanRefresh" async="true" />
        <gesture name="swipe-refresh" type="swipe" platform-specific="mobile" />
      </behavior>
    </control>
    
    <!-- Responsive Layout Wireframe -->
    <wireframe name="ResponsiveAppLayout" type="base-layout" schema-version="1.3">
      <description>Responsive application layout with accessibility and performance optimization</description>
      <responsive>
        <breakpoint name="mobile" max-width="768" orientation="any" template-override="MobileLayout" />
        <breakpoint name="tablet" min-width="769" max-width="1024" orientation="any" />
        <breakpoint name="desktop" min-width="1025" orientation="any" />
      </responsive>
      <theme-support>
        <theme-variant name="light" type="light" />
        <theme-variant name="dark" type="dark" />
        <theme-variant name="high-contrast" type="high-contrast" resource-override="hc-resources.xml" />
      </theme-support>
      <template>
        <Grid name="rootContainer">
          <grid-definitions>
            <row-definitions>
              <row-definition height="Auto" shared-size-group="Header" />
              <row-definition height="*" />
              <row-definition height="Auto" shared-size-group="Footer" />
            </row-definitions>
            <column-definitions>
              <column-definition width="Auto" min-width="200" />
              <column-definition width="*" />
            </column-definitions>
          </grid-definitions>
          
          <slot name="header-content" grid-row="0" grid-column="0" grid-column-span="2" 
                accessibility-landmark="banner" />
          <slot name="sidebar-content" grid-row="1" grid-column="0" 
                accessibility-landmark="navigation" conditional="screen-width > 768" />
          <slot name="main-content" grid-row="1" grid-column="1" required="true" 
                accessibility-landmark="main" />
          <slot name="footer-content" grid-row="2" grid-column="0" grid-column-span="2" 
                accessibility-landmark="contentinfo" />
        </Grid>
      </template>
    </wireframe>
  </patterns>
  
  <!-- ENHANCED: v1.3 Advanced View Definitions -->
  <views>
    <view-include src="business-views.xml" important="true" min-version="1.2" />
    
    <!-- Modern AI-Enhanced Application View -->
    <view name="ModernDashboardView" type="ai-assisted" category="ai-enhanced" 
          schema-version="1.3" platform="avalonia" singleton="true" lazy-loading="false" 
          cacheable="true" priority="high">
      <description>AI-enhanced dashboard with real-time analytics and collaboration</description>
      
      <metadata>
        <model-class>DashboardModel</model-class>
        <view-model-class>ModernDashboardViewModel</view-model-class>
        <controller-class>DashboardController</controller-class>
        <permissions>dashboard.read,analytics.view,ai.interact</permissions>
        <author>Development Team</author>
        <version>2.0.0</version>
        <created-date>2024-01-15</created-date>
        <modified-date>2024-03-10</modified-date>
        <documentation-url>https://docs.company.com/dashboard</documentation-url>
        <tags>
          <tag>ai-enhanced</tag>
          <tag>real-time</tag>
          <tag>analytics</tag>
          <tag>collaborative</tag>
        </tags>
      </metadata>
      
      <!-- Advanced State Management -->
      <state-management pattern="redux" persistence="distributed">
        <state name="initializing" initial="true" data-snapshot="InitializingState" 
               description="Loading dashboard components" />
        <state name="loading-data" final="false" data-snapshot="LoadingState" 
               description="Fetching analytics data" />
        <state name="ready" final="false" data-snapshot="ReadyState" 
               description="Dashboard fully loaded and interactive" />
        <state name="ai-processing" final="false" data-snapshot="AIProcessingState" 
               description="AI analysis in progress" />
        <state name="error" final="false" data-snapshot="ErrorState" 
               description="Error state with recovery options" />
        
        <transition from="initializing" to="loading-data" trigger="components-loaded" 
                    condition="user.isAuthenticated" action="startDataLoad" />
        <transition from="loading-data" to="ready" trigger="data-loaded" 
                    condition="data.isValid &amp;&amp; data.count > 0" action="finalizeLoad" />
        <transition from="ready" to="ai-processing" trigger="ai-analysis-requested" 
                    action="startAIAnalysis" />
        <transition from="ai-processing" to="ready" trigger="ai-analysis-complete" 
                    action="displayAIResults" />
        <transition from="*" to="error" trigger="critical-error" action="handleError" />
      </state-management>
      
      <!-- Comprehensive Accessibility -->
      <accessibility level="aaa" tested="true">
        <compliance standard="wcag" level="aaa" verified="true" />
        <compliance standard="section-508" level="aa" verified="true" />
        <compliance standard="ada" level="aa" verified="false" />
        <feature name="screen-reader" type="screen-reader" required="true" 
                 implementation="Full NVDA, JAWS, and VoiceOver compatibility" />
        <feature name="voice-control" type="voice-control" required="false" 
                 implementation="Dragon NaturallySpeaking and Windows Speech Recognition" />
        <feature name="high-contrast" type="high-contrast" required="true" 
                 implementation="Windows High Contrast and custom themes" />
        <feature name="magnification" type="magnification" required="true" 
                 implementation="Support for 200-500% zoom levels" />
        <feature name="eye-tracking" type="eye-tracking" required="false" 
                 implementation="Tobii Eye Tracker integration" />
      </accessibility>
      
      <!-- Performance Optimization -->
      <performance target-load-time="1000" memory-limit="150MB">
        <metric name="first-contentful-paint" type="load-time" target="800ms" critical="true" />
        <metric name="time-to-interactive" type="load-time" target="1200ms" critical="true" />
        <metric name="memory-usage" type="memory-usage" target="100MB" critical="false" />
        <metric name="cpu-usage" type="cpu-usage" target="5%" critical="false" />
        <metric name="frame-rate" type="frame-rate" target="60fps" critical="false" />
        
        <optimization technique="lazy-loading" description="Load widgets on demand" impact="high" />
        <optimization technique="virtualization" description="Virtualize large data grids" impact="high" />
        <optimization technique="caching" description="Cache dashboard configurations" impact="medium" />
        <optimization technique="code-splitting" description="Split AI components separately" impact="medium" />
        <optimization technique="preloading" description="Preload critical dashboard data" impact="low" />
      </performance>
      
      <!-- Security Framework -->
      <security level="high" audit-required="true">
        <permission name="dashboard-read" type="read" required="true" scope="view" />
        <permission name="analytics-access" type="read" required="true" scope="data" />
        <permission name="ai-interact" type="execute" required="false" scope="global" />
        <permission name="export-data" type="custom" required="false" scope="data" />
        
        <vulnerability-protection type="xss" protection="input-sanitization" severity="high" />
        <vulnerability-protection type="injection" protection="parameterized-queries" severity="critical" />
        <vulnerability-protection type="csrf" protection="anti-forgery-tokens" severity="high" />
        <vulnerability-protection type="data-exposure" protection="data-masking" severity="medium" />
        
        <data-protection encryption="true" gdpr-compliant="true" />
      </security>
      
      <!-- Advanced Localization -->
      <localization default-culture="en-US" fallback-culture="en" rtl-support="true">
        <supported-culture code="ar-SA" name="Arabic (Saudi Arabia)" completion="85" verified="false" />
        <supported-culture code="he-IL" name="Hebrew (Israel)" completion="90" verified="true" />
        <supported-culture code="zh-CN" name="Chinese (Simplified)" completion="95" verified="true" />
        <supported-culture code="ja-JP" name="Japanese" completion="80" verified="false" />
        <supported-culture code="de-DE" name="German" completion="100" verified="true" />
        
        <resource-bundle name="DashboardResources" path="Resources/Dashboard" type="resx" />
        <resource-bundle name="AIResources" path="Resources/AI" type="json" />
        <resource-bundle name="CommonResources" path="Resources/Common" type="resx" />
      </localization>
      
      <!-- Comprehensive Testing -->
      <testing coverage-target="95" strategy="e2e">
        <test-scenario name="dashboard-load" type="functional" priority="critical" automated="true">
          <step action="navigate-to-dashboard" expected="dashboard-container-visible" />
          <step action="wait-for-data-load" expected="charts-populated" />
          <step action="verify-ai-suggestions" expected="ai-panel-active" />
        </test-scenario>
        
        <test-scenario name="accessibility-navigation" type="accessibility" priority="high" automated="true">
          <step action="tab-through-controls" expected="all-interactive-elements-reachable" />
          <step action="screen-reader-announcements" expected="proper-aria-labels-announced" />
          <step action="high-contrast-mode" expected="all-content-visible" />
        </test-scenario>
        
        <test-scenario name="performance-benchmark" type="performance" priority="high" automated="true">
          <step action="measure-load-time" expected="under-1000ms" />
          <step action="measure-memory-usage" expected="under-150mb" />
          <step action="measure-frame-rate" expected="above-30fps" />
        </test-scenario>
        
        <test-scenario name="ai-interaction" type="functional" priority="medium" automated="true">
          <step action="request-ai-analysis" expected="ai-processing-indicator-shown" />
          <step action="wait-for-ai-results" expected="insights-displayed" />
          <step action="interact-with-suggestions" expected="actions-executed" />
        </test-scenario>
        
        <automation framework="playwright" selector-strategy="accessibility" page-object-model="true" />
      </testing>
      
      <!-- Dependencies -->
      <dependencies>
        <service-ref name="DashboardService" interface="IDashboardService" scope="scoped" required="true" />
        <service-ref name="AIAnalyticsService" interface="IAIService" scope="singleton" required="false" />
        <service-ref name="NotificationService" interface="INotificationService" scope="transient" required="true" />
        <library-ref name="ChartingLibrary" version="3.2.1" source="nuget" optional="false" />
        <library-ref name="AILibrary" version="1.5.0" source="internal" optional="true" />
      </dependencies>
      
      <!-- Data Context -->
      <data-context>
        <property name="dashboardData" type="DashboardData" scope="view" nullable="false" 
                  validation="NotNull" observable="true" />
        <property name="aiInsights" type="AIInsightCollection" scope="view" nullable="true" 
                  default-value="null" observable="true" />
        <property name="userPreferences" type="UserPreferences" scope="session" nullable="false" 
                  persistent="true" observable="true" />
        <property name="realTimeData" type="RealTimeDataStream" scope="distributed" nullable="true" 
                  observable="true" />
      </data-context>
      
      <!-- Windows -->
      <windows>
        <window-ref name="MainDashboard" role="main" default="true" lazy-load="false" 
                    cache-lifetime="3600" priority="critical" />
        <window-ref name="AIInsightsPanel" role="preview" default="false" lazy-load="true" 
                    priority="normal" />
        <window-ref name="SettingsDialog" role="utility" default="false" lazy-load="true" 
                    priority="low" />
      </windows>
      
      <!-- Navigation -->
      <navigation>
        <action name="show-dashboard" target="MainDashboard" async="false" 
                confirmation-required="false" permission="dashboard-read" />
        <action name="show-ai-insights" target="AIInsightsPanel" async="true" 
                confirmation-required="false" permission="ai-interact" />
        <action name="export-data" target="MainDashboard" async="true" 
                confirmation-required="true" permission="export-data" />
        <action name="show-settings" target="SettingsDialog" async="false" 
                confirmation-required="false" />
      </navigation>
      
      <!-- Behaviors -->
      <behaviors>
        <behavior name="refresh-dashboard" scope="view" async="true" debounce="1000" cancellable="true" />
        <behavior name="ai-analyze" scope="view" async="true" throttle="5000" cancellable="true" />
        <behavior name="save-preferences" scope="session" async="false" />
        <behavior name="export-dashboard" scope="application" async="true" cancellable="true" />
      </behaviors>
      
      <!-- Communication -->
      <communication>
        <publishes>
          <event name="dashboard-loaded" data="dashboard-id,load-time" async="false" 
                 broadcast="false" persistent="false" />
          <event name="ai-analysis-requested" data="analysis-type,parameters" async="true" 
                 broadcast="true" persistent="true" />
          <event name="data-exported" data="export-format,file-path" async="false" 
                 broadcast="false" persistent="true" />
        </publishes>
        
        <subscribes>
          <event name="data-updated" source="DataService" handler="refresh-dashboard" 
                 async="true" debounce="2000" filter="dashboard-relevant" />
          <event name="user-preferences-changed" source="SettingsView" handler="apply-preferences" 
                 async="false" />
          <event name="ai-model-updated" source="AIService" handler="refresh-ai-capabilities" 
                 async="true" />
        </subscribes>
        
        <real-time>
          <connection name="dashboard-updates" protocol="signalr" endpoint="/dashboardHub" 
                      auto-reconnect="true" />
          <connection name="ai-stream" protocol="websocket" endpoint="/ai-insights" 
                      auto-reconnect="true" />
        </real-time>
      </communication>
    </view>
  </views>
  
  <!-- ENHANCED: Window Includes with Conditional Loading -->
  <window-includes>
    <window-include src="avalonia-windows.xml" important="true" platform="avalonia" min-version="1.3" />
    <window-include src="accessibility-windows.xml" important="false" min-version="1.3" />
    <window-include src="mobile-responsive-windows.xml" important="false" platform="mobile" />
  </window-includes>
  
  <!-- ENHANCED: Modern Dashboard Window with v1.3 Features -->
  <window name="MainDashboard" title="AI-Enhanced Analytics Dashboard" 
          wireframe="ResponsiveAppLayout" view="ModernDashboardView"
          target-platform="avalonia" schema-version="1.3">
    
    <attributes>
      <attribute name="width" value="1400" />
      <attribute name="height" value="900" />
      <attribute name="min-width" value="800" />
      <attribute name="min-height" value="600" />
      <attribute name="window-state" value="Maximized" />
      <attribute name="can-resize" value="true" />
      <attribute name="system-decorations" value="Full" />
    </attributes>
    
    <view-properties>
      <role>main</role>
      <default>true</default>
      <modal>false</modal>
      <data-context-binding>dashboardData</data-context-binding>
    </view-properties>
    
    <!-- Advanced Data Binding -->
    <data-binding>
      <data-context source="ModernDashboardViewModel" type="ViewModels.ModernDashboardViewModel" mode="TwoWay" />
      <view-model class="ModernDashboardViewModel" assembly="Dashboard.ViewModels" 
                  namespace="Dashboard.ViewModels" />
      <binding-properties>
        <property control="loadingIndicator" property="IsVisible" binding-path="IsLoading" 
                  mode="OneWay" converter="BooleanToVisibilityConverter" />
        <property control="dataGrid" property="ItemsSource" binding-path="DashboardItems" 
                  mode="OneWay" validation-rule="NotNullValidator" />
        <property control="aiPanel" property="Insights" binding-path="AIInsights" 
                  mode="OneWay" converter="InsightCollectionConverter" />
      </binding-properties>
    </data-binding>
    
    <!-- Comprehensive Accessibility -->
    <accessibility compliance-level="wcag-aa">
      <screen-reader window-title="Analytics Dashboard" 
                     description="Main dashboard displaying real-time analytics with AI insights"
                     landmark-role="main" />
      <keyboard-navigation tab-order-start="1" focus-trap="false" escape-closes="false" />
      <color-contrast high-contrast-support="true" minimum-ratio="4.5" />
    </accessibility>
    
    <slot-overrides>
      <!-- Enhanced Header with AI Assistant -->
      <slot name="header-content">
        <Grid name="headerGrid">
          <grid-definitions>
            <column-definitions>
              <column-definition width="*" />
              <column-definition width="Auto" />
              <column-definition width="Auto" />
            </column-definitions>
          </grid-definitions>
          
          <StackPanel name="titlePanel" grid-column="0" orientation="horizontal" spacing="10">
            <TextBlock name="titleText" text="Analytics Dashboard" font-size="18" font-weight="Bold"
                       aria-label="Dashboard title" />
            <ProgressBar name="loadingIndicator" width="100" height="4" 
                         is-indeterminate="true" is-visible="{Binding IsLoading}"
                         aria-label="Loading progress" />
          </StackPanel>
          
          <StackPanel name="aiPanel" grid-column="1" orientation="horizontal" spacing="5">
            <Button name="aiAssistantButton" text="AI Assistant" 
                    command="{Binding ShowAIAssistantCommand}"
                    aria-label="Open AI Assistant panel"
                    tooltip="Get AI-powered insights and suggestions" />
            <InfoBar name="aiStatusInfo" severity="Informational" 
                     message="{Binding AIStatus}" is-open="{Binding ShowAIStatus}"
                     aria-live="polite" />
          </StackPanel>
          
          <StackPanel name="userPanel" grid-column="2" orientation="horizontal" spacing="5">
            <Button name="settingsButton" text="Settings" 
                    command="{Binding ShowSettingsCommand}"
                    aria-label="Open application settings" />
            <Button name="profileButton" text="{Binding CurrentUser.Name}" 
                    command="{Binding ShowProfileCommand}"
                    aria-label="User profile menu" />
          </StackPanel>
        </Grid>
      </slot>
      
      <!-- Responsive Sidebar with Performance Optimization -->
      <slot name="sidebar-content" visibility-binding="ScreenWidth" 
            visibility-value="GreaterThan:768" visibility-converter="ComparisonConverter">
        <NavigationView name="mainNavigation" is-pane-open="true" display-mode="Left"
                        aria-label="Main navigation menu">
          <NavigationView.MenuItems>
            <NavigationViewItem name="dashboardNav" content="Dashboard" icon="Home"
                                command="{Binding NavigateToDashboardCommand}"
                                aria-label="Navigate to dashboard overview" />
            <NavigationViewItem name="analyticsNav" content="Analytics" icon="BarChart"
                                command="{Binding NavigateToAnalyticsCommand}"
                                aria-label="Navigate to detailed analytics" />
            <NavigationViewItem name="reportsNav" content="Reports" icon="Document"
                                command="{Binding NavigateToReportsCommand}"
                                aria-label="Navigate to reports section" />
            <NavigationViewItem name="aiInsightsNav" content="AI Insights" icon="Lightbulb"
                                command="{Binding NavigateToAIInsightsCommand}"
                                aria-label="Navigate to AI-powered insights"
                                badge="{Binding NewInsightsCount}" />
          </NavigationView.MenuItems>
        </NavigationView>
      </slot>
      
      <!-- Main Content with Advanced Data Visualization -->
      <slot name="main-content">
        <Grid name="contentGrid">
          <grid-definitions>
            <row-definitions>
              <row-definition height="Auto" />
              <row-definition height="*" />
              <row-definition height="Auto" />
            </row-definitions>
          </grid-definitions>
          
          <!-- Filter and Search Panel -->
          <Border name="filterPanel" grid-row="0" background="LightGray" padding="10" 
                  corner-radius="5" margin="5" aria-label="Dashboard filters">
            <Grid>
              <grid-definitions>
                <column-definitions>
                  <column-definition width="Auto" />
                  <column-definition width="*" />
                  <column-definition width="Auto" />
                  <column-definition width="Auto" />
                </column-definitions>
              </grid-definitions>
              
              <TextBlock name="filterLabel" grid-column="0" text="Filters:" 
                         vertical-alignment="Center" margin="0,0,10,0"
                         aria-label="Filter controls" />
              
              <AutoCompleteBox name="searchBox" grid-column="1" placeholder-text="Search dashboard items..."
                               text="{Binding SearchText, Mode=TwoWay}" 
                               items-source="{Binding SearchSuggestions}"
                               minimum-prefix-length="2" filter-mode="Contains"
                               aria-label="Search dashboard content"
                               aria-description="Type to search and filter dashboard items" />
              
              <DatePicker name="dateFilter" grid-column="2" 
                          selected-date="{Binding FilterDate, Mode=TwoWay}"
                          aria-label="Filter by date" margin="10,0,0,0" />
              
              <Button name="refreshButton" grid-column="3" text="Refresh" 
                      command="{Binding RefreshCommand}"
                      aria-label="Refresh dashboard data" margin="10,0,0,0" />
            </Grid>
          </Border>
          
          <!-- Enhanced Data Grid with Virtualization -->
          <EnhancedDataGrid name="dashboardGrid" grid-row="1" 
                            items-source="{Binding DashboardItems}"
                            selected-item="{Binding SelectedItem, Mode=TwoWay}"
                            virtualization-enabled="true"
                            accessibility-mode="enhanced"
                            performance-mode="optimized"
                            aria-label="Dashboard data grid"
                            aria-description="Tabular view of dashboard metrics with sorting and filtering">
            <columns>
              <DataGridTextColumn header="Metric" binding="{Binding Name}" width="200" 
                                  is-read-only="true" aria-label="Metric name" />
              <DataGridTextColumn header="Value" binding="{Binding Value}" width="150" 
                                  is-read-only="true" aria-label="Current value" />
              <DataGridTextColumn header="Change" binding="{Binding Change}" width="100" 
                                  is-read-only="true" aria-label="Change from previous period" />
              <DataGridTextColumn header="Trend" binding="{Binding Trend}" width="100" 
                                  is-read-only="true" aria-label="Trend indicator" />
              <DataGridTemplateColumn header="Actions" width="150" aria-label="Available actions">
                <DataGridTemplateColumn.CellTemplate>
                  <DataTemplate>
                    <StackPanel orientation="horizontal" spacing="5">
                      <Button content="Details" command="{Binding ShowDetailsCommand}"
                              aria-label="Show metric details" />
                      <Button content="Chart" command="{Binding ShowChartCommand}"
                              aria-label="Show metric chart" />
                    </StackPanel>
                  </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
              </DataGridTemplateColumn>
            </columns>
          </EnhancedDataGrid>
          
          <!-- AI Insights Panel -->
          <Expander name="aiInsightsExpander" grid-row="2" header="AI Insights" 
                    is-expanded="{Binding ShowAIInsights}"
                    aria-label="AI-powered insights and recommendations">
            <ScrollViewer name="insightsScroller" max-height="200">
              <ItemsRepeater name="insightsList" items-source="{Binding AIInsights}">
                <ItemsRepeater.ItemTemplate>
                  <DataTemplate>
                    <Border background="LightBlue" padding="10" margin="5" corner-radius="5">
                      <StackPanel spacing="5">
                        <TextBlock text="{Binding Title}" font-weight="Bold" 
                                   aria-label="Insight title" />
                        <TextBlock text="{Binding Description}" text-wrapping="Wrap"
                                   aria-label="Insight description" />
                        <StackPanel orientation="horizontal" spacing="5">
                          <Button content="Apply" command="{Binding ApplyCommand}"
                                  aria-label="Apply this recommendation" />
                          <Button content="Dismiss" command="{Binding DismissCommand}"
                                  aria-label="Dismiss this insight" />
                        </StackPanel>
                      </StackPanel>
                    </Border>
                  </DataTemplate>
                </ItemsRepeater.ItemTemplate>
              </ItemsRepeater>
            </ScrollViewer>
          </Expander>
        </Grid>
      </slot>
      
      <!-- Enhanced Footer with Real-time Status -->
      <slot name="footer-content">
        <Grid name="footerGrid">
          <grid-definitions>
            <column-definitions>
              <column-definition width="*" />
              <column-definition width="Auto" />
              <column-definition width="Auto" />
              <column-definition width="Auto" />
            </column-definitions>
          </grid-definitions>
          
          <TextBlock name="statusText" grid-column="0" 
                     text="{Binding StatusMessage}" 
                     aria-live="polite" aria-label="Application status" />
          
          <TextBlock name="connectionStatus" grid-column="1" 
                     text="{Binding ConnectionStatus}" margin="10,0"
                     aria-label="Connection status" />
          
          <TextBlock name="lastUpdate" grid-column="2" 
                     text="{Binding LastUpdateTime, StringFormat='Last updated: {0:HH:mm:ss}'}" 
                     margin="10,0" aria-label="Last data update time" />
          
          <TextBlock name="versionInfo" grid-column="3" 
                     text="v2.0.0" margin="10,0"
                     aria-label="Application version" />
        </Grid>
      </slot>
    </slot-overrides>
  </window>
  
  <!-- AI Insights Panel Window -->
  <window name="AIInsightsPanel" title="AI Insights" view="ModernDashboardView"
          target-platform="avalonia" schema-version="1.3">
    
    <attributes>
      <attribute name="width" value="400" />
      <attribute name="height" value="600" />
      <attribute name="can-resize" value="true" />
      <attribute name="show-in-taskbar" value="false" />
      <attribute name="topmost" value="false" />
    </attributes>
    
    <view-properties>
      <role>preview</role>
      <modal>false</modal>
      <data-context-binding>aiInsights</data-context-binding>
      <parent-window>MainDashboard</parent-window>
    </view-properties>
    
    <accessibility compliance-level="wcag-aa">
      <screen-reader window-title="AI Insights Panel" 
                     description="Detailed view of AI-generated insights and recommendations"
                     landmark-role="complementary" />
      <keyboard-navigation tab-order-start="1" focus-trap="false" escape-closes="true" />
    </accessibility>
    
    <ScrollViewer name="insightsContainer" vertical-scroll-bar-visibility="Auto">
      <StackPanel name="insightsPanel" spacing="10" margin="10">
        <TextBlock name="panelTitle" text="AI-Powered Insights" font-size="16" font-weight="Bold"
                   aria-label="AI insights panel title" />
        
        <ItemsRepeater name="detailedInsightsList" items-source="{Binding AIInsights}">
          <ItemsRepeater.ItemTemplate>
            <DataTemplate>
              <Border background="White" border-brush="Gray" border-thickness="1" 
                      padding="15" margin="5" corner-radius="8">
                <StackPanel spacing="10">
                  <Grid>
                    <grid-definitions>
                      <column-definitions>
                        <column-definition width="*" />
                        <column-definition width="Auto" />
                      </column-definitions>
                    </grid-definitions>
                    
                    <TextBlock grid-column="0" text="{Binding Title}" font-weight="Bold" 
                               font-size="14" aria-label="Insight title" />
                    <TextBlock grid-column="1" text="{Binding Confidence, StringFormat='Confidence: {0:P0}'}" 
                               font-size="12" foreground="Gray" aria-label="AI confidence level" />
                  </Grid>
                  
                  <TextBlock text="{Binding Description}" text-wrapping="Wrap"
                             aria-label="Detailed insight description" />
                  
                  <TextBlock text="{Binding Impact}" text-wrapping="Wrap" 
                             font-style="Italic" foreground="DarkBlue"
                             aria-label="Expected impact" />
                  
                  <StackPanel orientation="horizontal" spacing="10">
                    <Button content="Apply Recommendation" 
                            command="{Binding ApplyRecommendationCommand}"
                            style="AccentButtonStyle"
                            aria-label="Apply this AI recommendation" />
                    <Button content="Learn More" 
                            command="{Binding LearnMoreCommand}"
                            aria-label="Learn more about this insight" />
                    <Button content="Provide Feedback" 
                            command="{Binding ProvideFeedbackCommand}"
                            aria-label="Provide feedback on this insight" />
                  </StackPanel>
                  
                  <TextBlock text="{Binding GeneratedAt, StringFormat='Generated: {0:g}'}" 
                             font-size="10" foreground="Gray"
                             aria-label="Insight generation timestamp" />
                </StackPanel>
              </Border>
            </DataTemplate>
          </ItemsRepeater.ItemTemplate>
        </ItemsRepeater>
        
        <Button name="refreshInsightsButton" content="Refresh AI Insights" 
                command="{Binding RefreshAIInsightsCommand}"
                horizontal-alignment="Center" margin="20"
                aria-label="Request new AI insights" />
      </StackPanel>
    </ScrollViewer>
  </window>
  
  <!-- Settings Dialog with Advanced Configuration -->
  <window name="SettingsDialog" title="Application Settings" 
          wireframe="DialogLayout" view="ModernDashboardView"
          target-platform="avalonia" schema-version="1.3">
    
    <attributes>
      <attribute name="width" value="600" />
      <attribute name="height" value="500" />
      <attribute name="can-resize" value="true" />
      <attribute name="modal" value="true" />
      <attribute name="show-in-taskbar" value="false" />
      <attribute name="window-startup-location" value="CenterOwner" />
    </attributes>
    
    <view-properties>
      <role>utility</role>
      <modal>true</modal>
      <data-context-binding>userPreferences</data-context-binding>
      <parent-window>MainDashboard</parent-window>
    </view-properties>
    
    <data-binding>
      <data-context source="SettingsViewModel" type="ViewModels.SettingsViewModel" mode="TwoWay" />
      <binding-properties>
        <property control="themeComboBox" property="SelectedItem" binding-path="SelectedTheme" 
                  mode="TwoWay" validation-rule="NotNullValidator" />
        <property control="languageComboBox" property="SelectedItem" binding-path="PreferredLanguage" 
                  mode="TwoWay" />
        <property control="accessibilityToggle" property="IsChecked" binding-path="HighContrastMode" 
                  mode="TwoWay" />
      </binding-properties>
    </data-binding>
    
    <accessibility compliance-level="wcag-aa">
      <screen-reader window-title="Application Settings Dialog" 
                     description="Configure application preferences and accessibility options"
                     landmark-role="dialog" />
      <keyboard-navigation tab-order-start="1" focus-trap="true" escape-closes="true" />
    </accessibility>
    
    <TabControl name="settingsTabs" selected-index="0" 
                aria-label="Settings categories">
      <TabItem name="generalTab" header="General" 
               aria-label="General application settings">
        <StackPanel spacing="15" margin="20">
          <TextBlock text="General Settings" font-size="16" font-weight="Bold"
                     aria-label="General settings section" />
          
          <Grid>
            <grid-definitions>
              <column-definitions>
                <column-definition width="150" />
                <column-definition width="*" />
              </column-definitions>
              <row-definitions>
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
              </row-definitions>
            </grid-definitions>
            
            <TextBlock grid-row="0" grid-column="0" text="Theme:" 
                       vertical-alignment="Center" aria-label="Theme selection" />
            <ComboBox name="themeComboBox" grid-row="0" grid-column="1" 
                      selected-item="{Binding SelectedTheme, Mode=TwoWay}"
                      aria-label="Select application theme">
              <ComboBoxItem content="Light Theme" />
              <ComboBoxItem content="Dark Theme" />
              <ComboBoxItem content="High Contrast" />
              <ComboBoxItem content="System Default" />
            </ComboBox>
            
            <TextBlock grid-row="1" grid-column="0" text="Language:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Language selection" />
            <ComboBox name="languageComboBox" grid-row="1" grid-column="1" margin="0,10,0,0"
                      selected-item="{Binding PreferredLanguage, Mode=TwoWay}"
                      aria-label="Select application language">
              <ComboBoxItem content="English" />
              <ComboBoxItem content="German" />
              <ComboBoxItem content="French" />
              <ComboBoxItem content="Spanish" />
              <ComboBoxItem content="Chinese (Simplified)" />
              <ComboBoxItem content="Arabic" />
              <ComboBoxItem content="Hebrew" />
            </ComboBox>
            
            <TextBlock grid-row="2" grid-column="0" text="Auto-save:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Auto-save settings" />
            <StackPanel grid-row="2" grid-column="1" orientation="horizontal" 
                        spacing="10" margin="0,10,0,0">
              <ToggleSwitch name="autoSaveToggle" 
                            is-checked="{Binding AutoSaveEnabled, Mode=TwoWay}"
                            aria-label="Enable automatic saving" />
              <NumericUpDown name="autoSaveInterval" minimum="1" maximum="60" 
                             value="{Binding AutoSaveInterval, Mode=TwoWay}"
                             suffix=" minutes" width="100"
                             aria-label="Auto-save interval in minutes" />
            </StackPanel>
            
            <TextBlock grid-row="3" grid-column="0" text="Notifications:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Notification settings" />
            <StackPanel grid-row="3" grid-column="1" spacing="5" margin="0,10,0,0">
              <CheckBox name="desktopNotifications" 
                        content="Desktop notifications" 
                        is-checked="{Binding DesktopNotificationsEnabled, Mode=TwoWay}"
                        aria-label="Enable desktop notifications" />
              <CheckBox name="soundNotifications" 
                        content="Sound notifications" 
                        is-checked="{Binding SoundNotificationsEnabled, Mode=TwoWay}"
                        aria-label="Enable sound notifications" />
            </StackPanel>
          </Grid>
        </StackPanel>
      </TabItem>
      
      <TabItem name="accessibilityTab" header="Accessibility" 
               aria-label="Accessibility settings">
        <StackPanel spacing="15" margin="20">
          <TextBlock text="Accessibility Settings" font-size="16" font-weight="Bold"
                     aria-label="Accessibility settings section" />
          
          <Grid>
            <grid-definitions>
              <column-definitions>
                <column-definition width="200" />
                <column-definition width="*" />
              </column-definitions>
              <row-definitions>
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
              </row-definitions>
            </grid-definitions>
            
            <TextBlock grid-row="0" grid-column="0" text="High Contrast Mode:" 
                       vertical-alignment="Center" aria-label="High contrast mode" />
            <ToggleSwitch name="accessibilityToggle" grid-row="0" grid-column="1"
                          is-checked="{Binding HighContrastMode, Mode=TwoWay}"
                          aria-label="Enable high contrast mode" />
            
            <TextBlock grid-row="1" grid-column="0" text="Font Size:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Font size adjustment" />
            <Slider name="fontSizeSlider" grid-row="1" grid-column="1" 
                    minimum="12" maximum="24" value="{Binding FontSize, Mode=TwoWay}"
                    tick-frequency="2" is-snap-to-tick-enabled="true"
                    margin="0,10,0,0" aria-label="Adjust font size" />
            
            <TextBlock grid-row="2" grid-column="0" text="Screen Reader:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Screen reader optimization" />
            <CheckBox name="screenReaderOptimized" grid-row="2" grid-column="1" 
                      content="Optimize for screen readers" margin="0,10,0,0"
                      is-checked="{Binding ScreenReaderOptimized, Mode=TwoWay}"
                      aria-label="Enable screen reader optimizations" />
            
            <TextBlock grid-row="3" grid-column="0" text="Keyboard Navigation:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Keyboard navigation settings" />
            <CheckBox name="enhancedKeyboardNav" grid-row="3" grid-column="1" 
                      content="Enhanced keyboard navigation" margin="0,10,0,0"
                      is-checked="{Binding EnhancedKeyboardNavigation, Mode=TwoWay}"
                      aria-label="Enable enhanced keyboard navigation" />
            
            <TextBlock grid-row="4" grid-column="0" text="Animation:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Animation preferences" />
            <CheckBox name="reduceAnimations" grid-row="4" grid-column="1" 
                      content="Reduce animations" margin="0,10,0,0"
                      is-checked="{Binding ReduceAnimations, Mode=TwoWay}"
                      aria-label="Reduce or disable animations" />
          </Grid>
        </StackPanel>
      </TabItem>
      
      <TabItem name="performanceTab" header="Performance" 
               aria-label="Performance settings">
        <StackPanel spacing="15" margin="20">
          <TextBlock text="Performance Settings" font-size="16" font-weight="Bold"
                     aria-label="Performance settings section" />
          
          <Grid>
            <grid-definitions>
              <column-definitions>
                <column-definition width="200" />
                <column-definition width="*" />
              </column-definitions>
              <row-definitions>
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
              </row-definitions>
            </grid-definitions>
            
            <TextBlock grid-row="0" grid-column="0" text="Data Virtualization:" 
                       vertical-alignment="Center" aria-label="Data virtualization" />
            <ToggleSwitch name="virtualizationToggle" grid-row="0" grid-column="1"
                          is-checked="{Binding VirtualizationEnabled, Mode=TwoWay}"
                          aria-label="Enable data virtualization for large datasets" />
            
            <TextBlock grid-row="1" grid-column="0" text="Cache Size:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Memory cache size" />
            <StackPanel grid-row="1" grid-column="1" orientation="horizontal" 
                        spacing="10" margin="0,10,0,0">
              <Slider name="cacheSizeSlider" minimum="50" maximum="500" 
                      value="{Binding CacheSize, Mode=TwoWay}" width="200"
                      aria-label="Set cache size in megabytes" />
              <TextBlock text="{Binding CacheSize, StringFormat='{0} MB'}" 
                         vertical-alignment="Center" />
            </StackPanel>
            
            <TextBlock grid-row="2" grid-column="0" text="Background Updates:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Background update frequency" />
            <ComboBox name="updateFrequencyCombo" grid-row="2" grid-column="1" margin="0,10,0,0"
                      selected-item="{Binding UpdateFrequency, Mode=TwoWay}"
                      aria-label="Select background update frequency">
              <ComboBoxItem content="Real-time" />
              <ComboBoxItem content="Every 30 seconds" />
              <ComboBoxItem content="Every minute" />
              <ComboBoxItem content="Every 5 minutes" />
              <ComboBoxItem content="Manual only" />
            </ComboBox>
            
            <TextBlock grid-row="3" grid-column="0" text="AI Processing:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="AI processing settings" />
            <StackPanel grid-row="3" grid-column="1" spacing="5" margin="0,10,0,0">
              <CheckBox name="enableAIProcessing" 
                        content="Enable AI analysis" 
                        is-checked="{Binding AIProcessingEnabled, Mode=TwoWay}"
                        aria-label="Enable AI-powered analysis" />
              <CheckBox name="localAIProcessing" 
                        content="Prefer local processing" 
                        is-checked="{Binding PreferLocalAI, Mode=TwoWay}"
                        aria-label="Prefer local AI processing over cloud" />
            </StackPanel>
          </Grid>
        </StackPanel>
      </TabItem>
      
      <TabItem name="securityTab" header="Security" 
               aria-label="Security and privacy settings">
        <StackPanel spacing="15" margin="20">
          <TextBlock text="Security &amp; Privacy" font-size="16" font-weight="Bold"
                     aria-label="Security and privacy settings section" />
          
          <Grid>
            <grid-definitions>
              <column-definitions>
                <column-definition width="200" />
                <column-definition width="*" />
              </column-definitions>
              <row-definitions>
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
                <row-definition height="Auto" />
              </row-definitions>
            </grid-definitions>
            
            <TextBlock grid-row="0" grid-column="0" text="Data Encryption:" 
                       vertical-alignment="Center" aria-label="Data encryption" />
            <ToggleSwitch name="encryptionToggle" grid-row="0" grid-column="1"
                          is-checked="{Binding DataEncryptionEnabled, Mode=TwoWay}"
                          aria-label="Enable data encryption" />
            
            <TextBlock grid-row="1" grid-column="0" text="Session Timeout:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Session timeout setting" />
            <NumericUpDown name="sessionTimeout" grid-row="1" grid-column="1" 
                           minimum="5" maximum="480" value="{Binding SessionTimeout, Mode=TwoWay}"
                           suffix=" minutes" margin="0,10,0,0"
                           aria-label="Set session timeout in minutes" />
            
            <TextBlock grid-row="2" grid-column="0" text="Audit Logging:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="Audit logging settings" />
            <CheckBox name="auditLogging" grid-row="2" grid-column="1" 
                      content="Enable audit logging" margin="0,10,0,0"
                      is-checked="{Binding AuditLoggingEnabled, Mode=TwoWay}"
                      aria-label="Enable security audit logging" />
            
            <TextBlock grid-row="3" grid-column="0" text="GDPR Compliance:" 
                       vertical-alignment="Center" margin="0,10,0,0"
                       aria-label="GDPR compliance settings" />
            <StackPanel grid-row="3" grid-column="1" spacing="5" margin="0,10,0,0">
              <CheckBox name="gdprMode" 
                        content="GDPR compliance mode" 
                        is-checked="{Binding GDPRComplianceEnabled, Mode=TwoWay}"
                        aria-label="Enable GDPR compliance features" />
              <Button name="dataExportButton" content="Export My Data" 
                      command="{Binding ExportUserDataCommand}"
                      aria-label="Export personal data" />
            </StackPanel>
          </Grid>
        </StackPanel>
      </TabItem>
    </TabControl>
    
    <!-- Dialog Buttons -->
    <StackPanel orientation="horizontal" horizontal-alignment="Right" 
                spacing="10" margin="20">
      <Button name="saveButton" content="Save Changes" 
              command="{Binding SaveSettingsCommand}"
              style="AccentButtonStyle"
              aria-label="Save all settings changes" />
      <Button name="cancelButton" content="Cancel" 
              command="{Binding CancelCommand}"
              aria-label="Cancel without saving changes" />
      <Button name="resetButton" content="Reset to Defaults" 
              command="{Binding ResetToDefaultsCommand}"
              aria-label="Reset all settings to default values" />
    </StackPanel>
  </window>
  
</ui-layout-def>