| name | syncfusion-blazor-pdf-viewer |
| description | Implements Syncfusion Blazor PDF Viewer (SfPdfViewer) for viewing and editing PDF documents in Blazor applications. Use this when working with PDF rendering, annotation, text search, form filling, or document navigation in Blazor. |
| metadata | {"author":"Syncfusion Inc","version":"34.1.29"} |
Syncfusion Blazor Pdfviewer – UI Sample
NuGet: Syncfusion.Blazor.SfPdfViewer + Syncfusion.Blazor.Themes
Namespace: Syncfusion.Blazor.SfPdfViewer
Generate C# Code for the User's Project (default)
Trigger keywords: "how to", "add pdfviewer", "code sample", "show me", "example", "snippet", "integrate", "component", "create sample".
Purpose: Generate minimal, copy-pasteable C# and Razor code that the user can integrate directly into their Blazor project.
Workflow:
⚠️ CRITICAL — Feature Support Policy (STRICT MODE):
FUNDAMENTAL RULE: Only generate code using APIs and properties that are EXPLICITLY listed in the reference files. ANY deviation is a VIOLATION.
-
MANDATORY CHECKS BEFORE GENERATING ANY CODE:
- Search the reference files for the exact API/property name
- Verify it appears in the Method Reference, Properties, or Events tables
- If NOT found in ANY reference file, STOP immediately
- Do NOT generate or suggest undocumented APIs under any circumstances
-
STRICT ENFORCEMENT - ZERO TOLERANCE:
- NO custom properties - Only use properties from reference file tables
- NO invented methods - Only use methods from reference file tables
- NO workarounds with undefined APIs - Forbidden
- NO assumptions about undocumented behavior - Forbidden
- NO alternative implementations using guess-work - Forbidden
- NO pretending support exists - Forbidden
-
MANDATORY RESPONSE FOR UNSUPPORTED FEATURES:
-
REFERENCE FILE HIERARCHY:
- Each reference file contains complete, authoritative documentation for its domain
- The tables (Method Reference, Properties, Events) are the SOURCE OF TRUTH
- Content outside these tables in reference files is explanatory only
- Do NOT extend beyond what appears in the reference file tables
-
AUDIT YOUR GENERATION:
- Before providing any code, verify EVERY API used appears in a reference file table
- Document which reference file each API comes from
- If you cannot cite a reference file table entry, DELETE that code
-
This is a CRITICAL REQUIREMENT. Violations compromise the skill's integrity and reliability.
Step 1 — Detect the Application Type (REQUIRED - DO NOT SKIP)
- Use file_search and read_file tools to inspect workspace project files:
.csproj file (project configuration)
Program.cs (startup configuration)
_Imports.razor (namespace imports)
App.razor (root component)
- Any existing
.razor files in Components/Pages
- Output: Confirm the detected application type (e.g., "Blazor WebApp" or "Blazor Server") before proceeding.
Step 2 — Generate Code from Reference Files Only (REQUIRED)
- Before generating: Confirm that Steps 1 are complete
- Read the relevant
references/*.md file(s) for the requested feature
- Cross-reference EVERY API, property, and method against these tables
- DECLARATIVE-ONLY APPROACH (MANDATORY - NO LIFECYCLE METHODS):
- Use ONLY property binding in Razor markup similar lifecycle methods.
- Configure all PDF Viewer properties directly as component attributes
- MANDATORY: Before generating ANY code, verify that reference files exist and are accessible
- Read the appropriate reference file(s) for the requested feature:
- Use
read_file tool on relevant references/*.md files
- Confirm file contains Methods/Properties/Events tables
- Verify tables are complete and readable
- If reference file is missing or cannot be read:
- STOP code generation
- Respond: "Reference file for this feature is not available. Please ensure all reference files are present in the
references/ directory."
- List the missing reference file name
- This is a BLOCKER step: Cannot proceed without reference file validation
- If an API/property does NOT appear in the reference file table, DO NOT USE IT
- Do NOT invent, guess, or suggest any API, method, property, class, or namespace not explicitly present in the reference files
Code References
All templates and operation snippets live in references/*.md. Each file is a focused snippet or template the agent will combine when generating samples.
Flow: Always start with getting-started.md, then merge matched features into its anchors (PROPS, EVENTS, UI_BUTTONS, HANDLERS). If no keyword matches, return only the basic sample.
| File | Purpose |
|---|
| getting-started.md | Foundation setup and minimal PDF Viewer component. Includes complete setup prerequisites. Provides minimal working component with DocumentPath, Height, Width properties and feature anchor points. Use as foundation for all PDF Viewer implementations with proper project setup and configuration validation. |
| toolbar-properties.md | Comprehensive toolbar customization using PdfViewerToolbarSettings. Includes 11 properties (ShowTooltip, EnableToolbar, EnableAnnotationToolbar, IsAnnotationToolbarVisible, ToolbarSettings, ToolbarClicked, ToolbarItems, AnnotationToolbarItems, FormDesignerToolbarItems, MobileToolbarItems, RedactionToolbarItems, CustomToolbarItems), 5 specialized toolbars (Primary, Annotation, FormDesigner, Mobile, Redaction) with 14/22/9/7/7 items respectively, and 7 code examples. Use to simplify UI for workflows, create role-based tool access, optimize mobile experience, add custom functionality, and control annotation/form/redaction capabilities. |
| toolbar-methods.md | Programmatic control methods for toolbar visibility and behavior. Includes 5 methods (ShowToolbarAsync, ShowAnnotationToolbar, ShowRedactionToolbar, EnableToolbarItemsAsync, ShowToolbarItemsAsync), 14 toolbar items for granular control (OpenOption, PrintOption, DownloadOption, SearchOption, MagnificationTool, PageNavigationTool, SelectionTool, PanTool, AnnotationEditTool, CommentTool, FormDesigner, SubmitForm, UndoRedoTool, Redaction). |
| magnification.md | Programmatic zoom/magnification control with 10 properties, 7 methods, 1 event, and comprehensive decision guidance. Properties: ZoomMode (Default/FitToPage/FitToWidth/FitToHeight), ZoomValue (10-400%), MinZoomValue, MaxZoomValue , EnableMagnification, EnablePinchZoom, EnableZoomOptimization, RestrictZoomRequest, ZoomValueChanged callback, TileRenderingSettings. Methods: ZoomAsync(exact %), ZoomInAsync (step to preset), ZoomOutAsync (step to preset), FitToPageAsync, FitToWidthAsync, FitToHeightAsync, GetZoomPercentageAsync. Events: ZoomChanged (CurrentZoomValue, PreviousZoomValue). |
| text-search.md | Complete text search functionality for PDF document content discovery and navigation. EnableTextSearch property to toggle search availability. Text search methods (4 total): SearchTextAsync (string searchText, bool isMatchCase for case-sensitive/insensitive search), SearchNextAsync (navigate to next result), SearchPreviousAsync (navigate to previous result), CancelTextSearchAsync (clear highlights and cancel). Search configuration: PdfViewerTextSearchColorSettings with SearchColor (found text color), SearchHighlightColor (highlighted text color) for visual customization. Search events (3 total): OnTextSearchStart (SearchText, MatchCase parameters), OnTextSearchComplete (SearchText, MatchCase for completion tracking), OnTextSearchHighlight (PageNumber, coordinates for result location tracking). |
Quick Start Example
@page "/pdfviewer-sample"
@using Syncfusion.Blazor
@using Syncfusion.Blazor.SfPdfViewer
@using Syncfusion.Blazor.Buttons
<!-- BASE_PATCH:UI_BUTTONS -->
<!-- Buttons from feature files will be inserted here -->
<SfPdfViewer2 @ref="_pdfviewer"
DocumentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
Height="100%"
Width="100%">
<!-- "PROPERTY" should be placed here -->
<!-- "EVENTS" should be placed here-->
</SfPdfViewer2>
@code {
private SfPdfViewer2 _pdfviewer { get; set; }
}