From 0a2f253555793e65cfe55306481811c1a8eba7ec Mon Sep 17 00:00:00 2001
From: Peace <syneffort@gmail.com>
Date: Tue, 16 Jul 2024 12:02:36 +0900
Subject: [PATCH] counter badge

---
 BlazorFluentUI/Components/Layout/NavMenu.razor   |  1 +
 .../Pages/Components/CompoCounterBadge.razor     |  2 +-
 .../Pages/Components/CompoPresenceBadge.razor    | 16 ++++++++++++++++
 3 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 BlazorFluentUI/Components/Pages/Components/CompoPresenceBadge.razor

diff --git a/BlazorFluentUI/Components/Layout/NavMenu.razor b/BlazorFluentUI/Components/Layout/NavMenu.razor
index 444a56d..0b39d5a 100644
--- a/BlazorFluentUI/Components/Layout/NavMenu.razor
+++ b/BlazorFluentUI/Components/Layout/NavMenu.razor
@@ -49,6 +49,7 @@
                 <FluentNavGroup Icon="@(new Icons.Regular.Size20.Tag())" Expanded="false" Title="Badge">
                     <FluentNavLink Href="compobadge" Icon="@(new Icons.Regular.Size20.Badge())" IconColor="Color.Accent">Badge</FluentNavLink>
                     <FluentNavLink Href="compocounterbadge" Icon="@(new Icons.Regular.Size20.NumberCircle1())" IconColor="Color.Accent">CounterBadge</FluentNavLink>
+                    <FluentNavLink Href="compopresencebadge" Icon="@(new Icons.Regular.Size20.NumberCircle1())" IconColor="Color.Accent">PresenceBadge</FluentNavLink>
                 </FluentNavGroup>
 
             </FluentNavGroup>
diff --git a/BlazorFluentUI/Components/Pages/Components/CompoCounterBadge.razor b/BlazorFluentUI/Components/Pages/Components/CompoCounterBadge.razor
index 9e03f7c..758db53 100644
--- a/BlazorFluentUI/Components/Pages/Components/CompoCounterBadge.razor
+++ b/BlazorFluentUI/Components/Pages/Components/CompoCounterBadge.razor
@@ -4,7 +4,7 @@
 
 <FluentLabel Typo="Typography.H3">CounterBadge</FluentLabel>
 <FluentDivider class="mt-1 mb-3" Role="DividerRole.Separator" />
-The <code>FluentCounterBadge</code> component is used to display a notification count on top of another compoenent.
+The <code>FluentCounterBadge</code> component is used to display a notification count on top of another component.
 
 <FluentLabel class="my-3" Typo="Typography.H4">Appearances</FluentLabel>
 <FluentCard Class="mt-3" Width="auto" Height="auto" AreaRestricted="false">
diff --git a/BlazorFluentUI/Components/Pages/Components/CompoPresenceBadge.razor b/BlazorFluentUI/Components/Pages/Components/CompoPresenceBadge.razor
new file mode 100644
index 0000000..63b608f
--- /dev/null
+++ b/BlazorFluentUI/Components/Pages/Components/CompoPresenceBadge.razor
@@ -0,0 +1,16 @@
+@page "/compopresencebadge"
+
+@rendermode RenderMode.InteractiveServer
+
+<FluentLabel Typo="Typography.H3">CounterBadge</FluentLabel>
+<FluentDivider class="mt-1 mb-3" Role="DividerRole.Separator" />
+The <code>FluentPresenceBadge</code> component is used to display a status indicator such as available, away, or busy.
+
+<FluentLabel class="my-3" Typo="Typography.H4">Appearances</FluentLabel>
+<FluentCard Class="mt-3" Width="auto" Height="auto" AreaRestricted="false">
+    
+</FluentCard>
+
+@code {
+
+}