Skip to content

Commit 5d57af2

Browse files
guardrexguardrex
authored
Merge pull request #34093 from dotnet/main
2 parents eb75389 + a681ae8 commit 5d57af2

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+504
-135
lines changed

‎aspnetcore/blazor/components/class-libraries-and-static-server-side-rendering.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/class-libraries-with-static-ssr
1010
---
1111
# ASP.NET Core Razor class libraries (RCLs) with static server-side rendering (static SSR)
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
This article provides guidance for component library authors considering support for static server-side rendering (static SSR).
2016

‎aspnetcore/blazor/components/integration.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/integration
1010
---
1111
# Integrate ASP.NET Core Razor components into ASP.NET Core apps
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
This article explains Razor component integration scenarios for ASP.NET Core apps.
2016

‎aspnetcore/blazor/components/prerender.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/prerender
1010
---
1111
# Prerender ASP.NET Core Razor components
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
<!--
2016
NOTE: The console output block quotes in this topic use a double-space

‎aspnetcore/blazor/components/quickgrid.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/quickgrid
1010
---
1111
# ASP.NET Core Blazor `QuickGrid` component
1212

13-
<!-- UPDATE 9.0 Enable the following
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
The [`QuickGrid`](xref:Microsoft.AspNetCore.Components.QuickGrid) component is a Razor component for quickly and efficiently displaying data in tabular form. `QuickGrid` provides a simple and convenient data grid component for common grid rendering scenarios and serves as a reference architecture and performance baseline for building data grid components. `QuickGrid` is highly optimized and uses advanced techniques to achieve optimal rendering performance.
2016

‎aspnetcore/blazor/components/render-components-outside-of-aspnetcore.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/render-outside-of-aspnetcore
1010
---
1111
# Render Razor components outside of ASP.NET Core
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
Razor components can be rendered outside of the context of an HTTP request. You can render Razor components as HTML directly to a string or stream independently of the ASP.NET Core hosting environment. This is convenient for scenarios where you want to generate HTML fragments, such as for generating email content, generating static site content, or for building a content templating engine.
2016

‎aspnetcore/blazor/components/render-modes.md‎

Lines changed: 26 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/render-modes
1010
---
1111
# ASP.NET Core Blazor render modes
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
This article explains control of Razor component rendering in Blazor Web Apps, either at compile time or runtime.
2016

@@ -230,7 +226,30 @@ The <xref:Microsoft.AspNetCore.Components.ComponentBase.RendererInfo?displayProp
230226
* `InteractiveAuto` for Interactive Auto.
231227
* `InteractiveWebAssembly` for Interactive WebAssembly.
232228

233-
Components use these properties to render content depending on their location or interactivity status. For example, a form can be disabled during prerendering and enabled when the component becomes interactive:
229+
Components use these properties to render content depending on their location or interactivity status. The following examples demonstrate typical use cases.
230+
231+
Display content until a component is interactive:
232+
233+
```razor
234+
@if (!RendererInfo.IsInteractive)
235+
{
236+
<p>Connecting to the assistant...</p>
237+
}
238+
else
239+
{
240+
...
241+
}
242+
```
243+
244+
Disable a button until a component is interactive:
245+
246+
```razor
247+
<button @onclick="Send" disabled="@(!RendererInfo.IsInteractive)">
248+
Send
249+
</button>
250+
```
251+
252+
Disable a form during prerendering and enable the form when the component is interactive:
234253

235254
```razor
236255
<EditForm Model="Movie" ...>
@@ -260,7 +279,7 @@ Components use these properties to render content depending on their location or
260279
}
261280
```
262281

263-
The next example shows how to render markup to support performing a regular HTML action if the component is statically rendered:
282+
Render markup to support performing a regular HTML action if the component is statically rendered:
264283

265284
```razor
266285
@if (AssignedRenderMode is null)

‎aspnetcore/blazor/components/sections.md‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@ uid: blazor/components/sections
1010
---
1111
# ASP.NET Core Blazor sections
1212

13-
<!-- UPDATE 9.0 Activate after release and INCLUDE is updated
14-
15-
[!INCLUDE[](~/includes/not-latest-version.md)]
16-
17-
-->
13+
[!INCLUDE[](~/includes/not-latest-version-without-not-supported-content.md)]
1814

1915
This article explains how to control the content in a Razor component from a child Razor component.
2016

‎aspnetcore/blazor/fundamentals/signalr.md‎

Lines changed: 46 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -491,43 +491,71 @@ In the `Program` file, call <xref:Microsoft.AspNetCore.Builder.ComponentEndpoint
491491

492492
## Reflect the server-side connection state in the UI
493493

494-
When the client detects that the connection has been lost, a default UI is displayed to the user while the client attempts to reconnect. If reconnection fails, the user is provided the option to retry.
494+
If the client detects a lost connection to the server, a default UI is displayed to the user while the client attempts to reconnect:
495+
496+
:::moniker range=">= aspnetcore-9.0"
497+
498+
![The default reconnection UI.](signalr/_static/reconnection-ui-90-or-later.png)
499+
500+
:::moniker-end
501+
502+
:::moniker range="< aspnetcore-9.0"
503+
504+
![The default reconnection UI.](signalr/_static/reconnection-ui-80-or-earlier.png)
505+
506+
:::moniker-end
507+
508+
If reconnection fails, the user is instructed to retry or reload the page:
509+
510+
:::moniker range=">= aspnetcore-9.0"
511+
512+
![The default retry UI.](signalr/_static/retry-ui-90-or-later.png)
513+
514+
:::moniker-end
515+
516+
:::moniker range="< aspnetcore-9.0"
517+
518+
![The default retry UI.](signalr/_static/retry-ui-80-or-earlier.png)
519+
520+
:::moniker-end
521+
522+
If reconnection succeeds, user state is often lost. Custom code can be added to any component to save and reload user state across connection failures. For more information, see <xref:blazor/state-management>.
495523

496524
:::moniker range=">= aspnetcore-8.0"
497525

498-
To customize the UI, define a single element with an `id` of `components-reconnect-modal`. The following example places the element in the `App` component.
526+
To customize the UI, define a single element with an `id` of `components-reconnect-modal` in the `<body>` element content. The following example places the element in the `App` component.
499527

500528
`App.razor`:
501529

502530
:::moniker-end
503531

504532
:::moniker range=">= aspnetcore-7.0 < aspnetcore-8.0"
505533

506-
To customize the UI, define a single element with an `id` of `components-reconnect-modal`. The following example places the element in the host page.
534+
To customize the UI, define a single element with an `id` of `components-reconnect-modal` in the `<body>` element content. The following example places the element in the host page.
507535

508536
`Pages/_Host.cshtml`:
509537

510538
:::moniker-end
511539

512540
:::moniker range=">= aspnetcore-6.0 < aspnetcore-7.0"
513541

514-
To customize the UI, define a single element with an `id` of `components-reconnect-modal`. The following example places the element in the layout page.
542+
To customize the UI, define a single element with an `id` of `components-reconnect-modal` in the `<body>` element content. The following example places the element in the layout page.
515543

516544
`Pages/_Layout.cshtml`:
517545

518546
:::moniker-end
519547

520548
:::moniker range="< aspnetcore-6.0"
521549

522-
To customize the UI, define a single element with an `id` of `components-reconnect-modal`. The following example places the element in the host page.
550+
To customize the UI, define a single element with an `id` of `components-reconnect-modal` in the `<body>` element content. The following example places the element in the host page.
523551

524552
`Pages/_Host.cshtml`:
525553

526554
:::moniker-end
527555

528556
```cshtml
529557
<div id="components-reconnect-modal">
530-
There was a problem with the connection!
558+
Connection lost.<br>Attempting to reconnect...
531559
</div>
532560
```
533561

@@ -557,6 +585,15 @@ Add the following CSS styles to the site's stylesheet.
557585
#components-reconnect-modal.components-reconnect-failed,
558586
#components-reconnect-modal.components-reconnect-rejected {
559587
display: block;
588+
background-color: white;
589+
padding: 2rem;
590+
border-radius: 0.5rem;
591+
text-align: center;
592+
box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
593+
margin: 50px 50px;
594+
position: fixed;
595+
top: 0;
596+
z-index: 10001;
560597
}
561598
```
562599

@@ -581,7 +618,7 @@ Customize the delay before the reconnection UI appears by setting the `transitio
581618

582619
:::moniker-end
583620

584-
:::moniker range="< aspnetcore-8.0"
621+
:::moniker range=">= aspnetcore-5.0 < aspnetcore-8.0"
585622

586623
`wwwroot/css/site.css`:
587624

@@ -606,11 +643,9 @@ To display the current reconnect attempt, define an element with an `id` of `com
606643
</div>
607644
```
608645

609-
When the custom reconnect modal appears, it renders content similar to the following based on the preceding code:
646+
When the custom reconnect modal appears, it renders the following content with a reconnection attempt counter:
610647

611-
```html
612-
There was a problem with the connection! (Current reconnect attempt: 3 / 8)
613-
```
648+
> :::no-loc text="There was a problem with the connection! (Current reconnect attempt: 1 / 8)":::
614649
615650
:::moniker-end
616651

‎aspnetcore/blazor/fundamentals/signalr/_static/reconnection-ui-80-or-earlier.png‎

13.7 KB
Loading

‎aspnetcore/blazor/fundamentals/signalr/_static/reconnection-ui-90-or-later.png‎

11.8 KB
Loading

0 commit comments

Comments
 (0)