` with a scoping class instead:
> ```razor
> @* ❌ Wrong — CssClass does not exist on SfDiagramComponent *@
>
>
> @* ✅ Correct — use a wrapper div *@
>
>
>
> ```
#### Phase Offset Property
> **⚠️ `Phase.Offset` does NOT exist** — using it causes a compile error.
> Use **`Phase.Width`** to set the size of a phase in a swimlane:
> ```csharp
> // ❌ Wrong — Offset does not exist on Phase
> new Phase { ID = "ph1", Offset = 220 }
>
> // ✅ Correct — use Width
> new Phase { ID = "ph1", Width = 220 }
> ```
#### Lane Constraints Property
> **⚠️ `Lane.Constraints` does NOT exist** and **`LaneConstraints` enum does NOT exist**.
> Individual lanes cannot have constraints set via a `Constraints` property.
> To restrict swimlane-level interactions, use **`SwimlaneConstraints`** on the **`Swimlane`** object itself:
> ```csharp
> // ❌ Wrong — Lane.Constraints and LaneConstraints do not exist
> lane.Constraints = LaneConstraints.Default & ~LaneConstraints.ResizeEntries;
>
> // ✅ Correct — set constraints on the Swimlane object
> swimlane.Constraints = SwimlaneConstraints.Default & ~SwimlaneConstraints.Interaction;
> ```
#### FitMode.Page Value
> **⚠️ `FitMode.Page` does NOT exist** — using it causes `CS0117`.
> The correct values for `FitMode` are **`FitMode.Width`** and **`FitMode.Height`**:
> ```csharp
> // ❌ Wrong — FitMode.Page does not exist
> new FitOptions { Mode = FitMode.Page }
>
> // ✅ Correct — use FitMode.Width or FitMode.Height
> new FitOptions { Mode = FitMode.Width, Region = DiagramRegion.Content }
> ```
#### LoadDiagram Method
> **⚠️ `SfDiagramComponent.LoadDiagram()` does NOT exist** — using it causes a compile error.
> Use the async version **`LoadDiagramAsync()`** instead:
> ```csharp
> // ❌ Wrong — LoadDiagram() does not exist
> diagram.LoadDiagram(savedJson);
>
> // ✅ Correct — use LoadDiagramAsync
> await diagram.LoadDiagramAsync(savedJson);
> ```
#### FitToPageAsync Method
> **⚠️ `SfDiagramComponent.FitToPageAsync()` does NOT exist** — using it causes a compile error.
> Use the non-async overload **`FitToPage()`** instead:
> ```csharp
> // ❌ Wrong — FitToPageAsync does not exist
> await diagram.FitToPageAsync(new FitOptions { Mode = FitMode.Width });
>
> // ✅ Correct — use FitToPage (synchronous)
> diagram.FitToPage(new FitOptions { Mode = FitMode.Width, Region = DiagramRegion.Content });
> ```
#### BasicShapes Enum
> **⚠️ `BasicShapes` does NOT exist** — use `NodeBasicShapes` instead:
> ```csharp
> // ❌ Wrong
> new BasicShape { Shape = BasicShapes.Rectangle }
>
> // ✅ Correct
> new BasicShape { Shape = NodeBasicShapes.Rectangle }
> ```
#### DiagramThickness Constructor
> **⚠️ `DiagramThickness` does NOT have a 4-argument constructor** — using it causes `CS1729: does not contain a constructor that takes 4 arguments`.
> Use the **object initializer** syntax with named properties instead:
> ```csharp
> // ❌ Wrong — CS1729: no 4-argument constructor
> new DiagramThickness(20, 50, 20, 20)
>
> // ✅ Correct — use object initializer with named properties
> new DiagramThickness { Left = 20, Top = 50, Right = 20, Bottom = 20 }
>
> // ✅ Correct — set only the sides you need
> new DiagramThickness { Top = 50 }
> ```
#### ScrollSettings EnableAutoScroll Property
> **⚠️ `CanAutoScroll` does NOT exist** on `ScrollSettings` — using it causes `InvalidOperationException: does not have a property matching the name 'CanAutoScroll'`.
> The correct property name is **`EnableAutoScroll`**:
> ```razor
> @* ❌ Wrong — CanAutoScroll does not exist *@
>
>
> @* ✅ Correct *@
>
> ```
#### Zoom, Undo, and Redo Methods
> **⚠️ `ZoomAsync()`, `UndoAsync()`, and `RedoAsync()` do NOT exist** — using them causes a compile error.
> Use the non-async overloads **`Zoom()`**, **`Undo()`**, and **`Redo()`** instead:
> ```csharp
> // ❌ Wrong — ZoomAsync, UndoAsync, RedoAsync do not exist
> await _diagram.ZoomAsync(1.2, new DiagramPoint { X = 300, Y = 300 });
> await _diagram.UndoAsync();
> await _diagram.RedoAsync();
>
> // ✅ Correct — use non-async overloads
> _diagram.Zoom(1.2, new DiagramPoint { X = 300, Y = 300 });
> _diagram.Undo();
> _diagram.Redo();
> ```
#### Overview Component Namespace
> **⚠️ `SfDiagramOverviewComponent` requires an additional `@using`** — it lives in `Syncfusion.Blazor.Diagram.Overview`, NOT in `Syncfusion.Blazor.Diagram`. Forgetting it causes `CS0246`:
> ```razor
> @* ❌ Wrong — SfDiagramOverviewComponent not found without the Overview namespace *@
> @using Syncfusion.Blazor.Diagram
>
> @* ✅ Correct — both namespaces required *@
> @using Syncfusion.Blazor.Diagram
> @using Syncfusion.Blazor.Diagram.Overview
> ```
> **⚠️ `SourceID` must exactly match the `ID` set on `SfDiagramComponent`** — the `ID` is NOT auto-generated; you must set it explicitly. A mismatch (including case) renders the overview empty:
> ```razor
> @* ❌ Wrong — ID not set on the diagram; SourceID has nothing to link to *@
>
>
>
> @* ✅ Correct — ID set on diagram, SourceID matches exactly *@
>
>
> ```
> **⚠️ Do NOT nest `SfDiagramOverviewComponent` inside `SfDiagramComponent`** — the overview is a sibling component rendered outside the diagram markup.