[Docs] Update homepage

.github/workflows/build-core-lib.yml

@@ -13,7 +13,7 @@ on:
     paths-ignore:
       - '**/*.gitignore'
       - '**/*.gitattributes'
-  
+
   pull_request:
     types: [opened, synchronize, reopened, closed]
     branches:
@@ -29,7 +29,7 @@ env:
 jobs:
   Build:
 
-    name: Build and Test Code Lib 
+    name: Build and Test Code Lib
     runs-on: windows-latest
 
     permissions:
@@ -50,7 +50,7 @@ jobs:
 
      - name: Restore
        run: dotnet restore
-       
+
      - name: Build
        run: dotnet build ${{ env.PROJECTS }} --configuration Release -warnaserror
        working-directory: ${{ github.workspace }}
@@ -70,42 +70,42 @@ jobs:
          path: '**/*.trx'
          reporter: dotnet-trx
          list-tests: failed
-         fail-on-error: false         
+         fail-on-error: false
 
      - name: Extract Failed Tests
        if: success() || failure()
        shell: pwsh
        run: |
          $trxFilePath = Get-ChildItem -Path .\TestResults -Filter *.trx | Sort-Object LastWriteTime | Select-Object -Last 1
          $testResults = Get-Content -Path $trxFilePath
-         
+
          # Initialize an empty array to store failed test names
          $failedTests = "# Unit Tests"
          $failedTestsCount = 0
-         
+
          # Search for failed test names in the TRX file
          foreach ($line in $testResults) {
-         
+
              if ($line.Contains(" outcome=`"Failed`" "))
              {
                  $matches = [regex]::Match($line, '(?<=testName=")([^"]+)')
-         
+
                  if ($matches.Success) {
                      $failedTestsCount++
                      $testName = $matches.Groups[1].Value
                      $failedTests += "`n- ❌[FAILED] $testName"
                  }
              }
          }
-         
+
          if ($failedTestsCount -eq 0) {
              $failedTests = "✅ All tests passed successfully"
          }
-        
+
          $failedTests += "`n`n Details on [your Workflow / Core Tests](/microsoft/fluentui-blazor/actions/workflows/build-core-lib.yml) page."
 
          Write-Host "$failedTests"
-         Set-Content -Path ./TestResults/ExtractedTests.md -Value $failedTests         
+         Set-Content -Path ./TestResults/ExtractedTests.md -Value $failedTests
        working-directory: ${{ github.workspace }}
 
      - name: Publish unit tests summary
@@ -126,7 +126,7 @@ jobs:
          title: 'Unit Tests Code Coverage'
          classfilters: '-Microsoft.FluentUI.AspNetCore.Components.DesignTokens.*'
          reporttypes: 'HtmlInline;MarkdownSummaryGithub'
-     
+
      - name: Upload coverage report
        uses: actions/upload-artifact@v2
        with:
@@ -138,3 +138,59 @@ jobs:
        continue-on-error: true
        with:
          path: CoverageReports/SummaryGithub.md
+  deploy_demo:
+    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
+    runs-on: ubuntu-latest
+    name: Build and Deploy Demo site
+    env:
+      DOTNET_CLI_TELEMETRY_OPTOUT: 1
+      DOTNET_SKIP_FIRST_TIME_EXPERIENCE: 1
+      DOTNET_NOLOGO: true
+      DOTNET_GENERATE_ASPNET_CERTIFICATE: false
+      DOTNET_ADD_GLOBAL_TOOLS_TO_PATH: false
+      DOTNET_MULTILEVEL_LOOKUP: 0
+      PROJECT: "examples/Demo/Client/FluentUI.Demo.Client.csproj"
+      BUILD_ARCH: "Any CPU"
+      BUILD_CONFIG: "Release"
+      SKIP_DEPLOY_ON_MISSING_SECRETS: true
+    steps:
+      - name: Checkout source
+        uses: actions/checkout@v4
+
+      - name: .NET Setup SDKs
+        uses: actions/setup-dotnet@v4
+        with:
+          dotnet-version: |
+            8.0.x
+          include-prerelease: true
+      - name: .NET Builld
+        run: dotnet build ${{ env.PROJECT }} -c ${{ env.BUILD_CONFIG }} -o publish -f net8.0 -r linux-x64 --self-contained=true -p:BuildNumber=$BUILD_NUMBER -p:SourceRevisionId=$GITHUB_SHA -p:ContinuousIntegrationBuild=true
+
+      - name: .NET Publish
+        run: dotnet publish ${{ env.PROJECT }} -c ${{ env.BUILD_CONFIG }} -o publish -f net8.0 -r linux-x64 --self-contained=true -p:BuildNumber=$BUILD_NUMBER -p:SourceRevisionId=$GITHUB_SHA -p:ContinuousIntegrationBuild=true
+
+      - name: Deploy demo site to new Azure Static Web App
+        id: builddeploy
+        uses: Azure/static-web-apps-deploy@v1
+        with:
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_BLACK_PEBBLE_0DC79CB03 }}
+          repo_token: ${{ secrets.GITHUB_TOKEN }}
+          action: "upload"
+          app_location: "publish/wwwroot"
+          api_location: "Api"
+          output_location: "publish/wwwroot"
+          skip_api_build: true
+          skip_app_build: true
+          production_branch: 'dev'
+
+  destroy:
+    if: github.event_name == 'pull_request' && github.event.action == 'closed'
+    runs-on: ubuntu-latest
+    name: Close Pull Request Job
+    steps:
+      - name: Close Pull Request on new Azure Static Web App
+        id: closepullrequest
+        uses: Azure/static-web-apps-deploy@v1
+        with:
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_BLACK_PEBBLE_0DC79CB03 }}
+          action: "close"

Directory.Packages.props

@@ -7,9 +7,9 @@
   </PropertyGroup>
   <ItemGroup>
     <!-- For Sample Apps -->
-    <PackageVersion Include="Microsoft.FluentUI.AspNetCore.Components" Version="4.8.1" />
+    <PackageVersion Include="Microsoft.FluentUI.AspNetCore.Components" Version="4.9.0" />
     <PackageVersion Include="Microsoft.FluentUI.AspNetCore.Components.Emoji" Version="4.6.0" />
-    <PackageVersion Include="Microsoft.FluentUI.AspNetCore.Components.Icons" version="4.8.0" />
+    <PackageVersion Include="Microsoft.FluentUI.AspNetCore.Components.Icons" version="4.9.0" />
 
     <!-- Build dependencies -->
     <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="$(AspNetCoreVersion)" />

Microsoft.FluentUI.sln

@@ -46,15 +46,6 @@ EndProject
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "eng", "eng", "{E7FD7A3C-3C34-4DF6-961F-D731B0164CE4}"
 EndProject
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "pipelines", "pipelines", "{2A9638B8-C6D0-455C-B6B1-72D734664973}"
-	ProjectSection(SolutionItems) = preProject
-		eng\pipelines\azure-pipelines.yml = eng\pipelines\azure-pipelines.yml
-		eng\pipelines\build-all-lib.yml = eng\pipelines\build-all-lib.yml
-		eng\pipelines\build-core-lib.yml = eng\pipelines\build-core-lib.yml
-		eng\pipelines\common-variables.yaml = eng\pipelines\common-variables.yaml
-		eng\pipelines\compute-version-variables.ps1 = eng\pipelines\compute-version-variables.ps1
-		eng\pipelines\update-assembly-version.ps1 = eng\pipelines\update-assembly-version.ps1
-		eng\pipelines\version.yml = eng\pipelines\version.yml
-	EndProjectSection
 EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution

examples/Demo/Shared/Pages/BlazorHybrid.razor

@@ -0,0 +1,33 @@
+@page "/BlazorHybrid"
+@using FluentUI.Demo.Shared.Pages.Home.Examples
+
+<PageTitle>@App.PageTitle("Blazor Hybrid")</PageTitle>
+
+<h1>Blazor Hybrid</h1>
+
+<p>
+    It is possible to use this library in your Blazor Hybrid projects. Setup is almost the same as described in the "Getting started" section above,
+    however to get everything to work you'll need to take one extra step:
+</p>
+
+<h3 id="temporary-workaround-for-mauiwpfwindows-forms-issues">Temporary workaround for MAUI/WPF/Windows Forms issues</h3>
+<p>
+    Currently when using WebView to run Blazor (in all Hybrid variants), the web-components script is not imported automatically (see <a href="https://github.com/microsoft/fluentui-blazor/issues/404">#404</a>).
+    There is also an issue with loading the custom event handlers that are being configured by the web-components script. Until these are fixed on the WebView side, there is
+    a workaround available, namely to intercept '_framework/blazor.modules.json' and provide proper JS initializers (created by the build). The needed script is
+    included in the general library script and needs to be included with a script tag <strong>before</strong> the <code>_framework/blazor.webview.js</code> script tag.
+</p>
+
+<CodeSnippet Language="language-html">
+    &lt;script app-name=&quot;{NAME OF YOUR APP}&quot; src=&quot;./_content/Microsoft.FluentUI.AspNetCore.Components/js/initializersLoader.webview.js&quot;&gt;&lt;/script&gt;
+    &lt;script src=&quot;_framework/blazor.webview.js&quot;&gt;&lt;/script&gt;
+</CodeSnippet>
+
+<p>
+    The <code>app-name</code> attribute needs to match your app's assembly name - the script uses 'app-name' to resolve the name of the file with initializers.
+    The 'initializersLoader' part of the script replaces the standard <code>fetch</code> function with one which provides the correct file in place of the empty <code>blazor.modules.json</code>. <code>fetch</code> is restored to its original state once the <code>_framework/blazor.modules.json</code> request is intercepted.
+</p>
+<p>
+    For more information regarding this bug, see issue <a href="https://github.com/dotnet/maui/issues/15234">15234</a> in the MAUI repo.
+</p>
+

examples/Demo/Shared/Pages/DataGrid/DataGridPage.razor

@@ -49,6 +49,20 @@
     A sort can be removed by right clicking on the header column (with exception of the default sort).
 </p>
 
+<h2 if="usewithef">Using the DataGrid component with EF Core</h2>
+<p>
+    If you want to use the <code>FluentDataGrid</code> with data provided through EF Core, you need to install an additional package so the
+    grid knows how to resolve queries asynchronously for efficiency.
+</p>
+
+<h3>Installation</h3>
+    Install the package by running the command:
+<CodeSnippet>dotnet add package Microsoft.FluentUI.AspNetCore.Components.DataGrid.EntityFrameworkAdapter</CodeSnippet>
+
+<h3>Usage</h3>
+    In your <code>Program.cs</code> file you need to add the following after the <code>builder.Services.AddFluentUIComponents();</code> line:
+<CodeSnippet Language="csharp">builder.Services.AddDataGridEntityFrameworkAdapter();</CodeSnippet>
+
 <h2 id="example">Examples</h2>
 
 <DemoSection Title="Get started" Component="@typeof(DataGridGetStarted)">

examples/Demo/Shared/Pages/Home/Examples/HomeSimpleExample.razor

@@ -1,6 +1,6 @@
 @using Microsoft.FluentUI.AspNetCore.Components
 
-<FluentCard Width="400px" Height="250px">
+<FluentCard Width="350px" Height="250px">
     <h2>Hello World!</h2>
     <FluentButton Appearance="@Appearance.Accent">Click Me</FluentButton>
 </FluentCard>