From a681ae87a04df527257dcaa39d450dad92f4c0bd Mon Sep 17 00:00:00 2001
From: Luke Latham <1622880+guardrex@users.noreply.github.com>
Date: Thu, 14 Nov 2024 04:02:31 -0500
Subject: [PATCH] Add RendererInfo examples (#34116)

---
 aspnetcore/blazor/components/render-modes.md | 27 ++++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/aspnetcore/blazor/components/render-modes.md b/aspnetcore/blazor/components/render-modes.md
index 77bdf0e6a1..e412321ec8 100644
--- a/aspnetcore/blazor/components/render-modes.md
+++ b/aspnetcore/blazor/components/render-modes.md
@@ -226,7 +226,30 @@ The <xref:Microsoft.AspNetCore.Components.ComponentBase.RendererInfo?displayProp
   * `InteractiveAuto` for Interactive Auto.
   * `InteractiveWebAssembly` for Interactive WebAssembly.
 
-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:
+Components use these properties to render content depending on their location or interactivity status. The following examples demonstrate typical use cases.
+
+Display content until a component is interactive:
+
+```razor
+@if (!RendererInfo.IsInteractive)
+{
+    <p>Connecting to the assistant...</p>
+}
+else
+{
+    ...
+}
+```
+
+Disable a button until a component is interactive:
+
+```razor
+<button @onclick="Send" disabled="@(!RendererInfo.IsInteractive)">
+    Send
+</button>
+```
+
+Disable a form during prerendering and enable the form when the component is interactive:
 
 ```razor
 <EditForm Model="Movie" ...>
@@ -256,7 +279,7 @@ Components use these properties to render content depending on their location or
 }
 ```
 
-The next example shows how to render markup to support performing a regular HTML action if the component is statically rendered:
+Render markup to support performing a regular HTML action if the component is statically rendered:
 
 ```razor
 @if (AssignedRenderMode is null)