feat: rename to PinCode, add styles for size.

demo/Ursa.Demo/Pages/PinCodeDemo.axaml

@@ -0,0 +1,25 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:u="https://irihi.tech/ursa"
+             xmlns:vm="using:Ursa.Demo.ViewModels"
+             x:DataType="vm:PinCodeDemoViewModel"
+             x:CompileBindings="True"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             x:Class="Ursa.Demo.Pages.PinCodeDemo">
+    <StackPanel>
+        <u:Form>
+            <u:PinCode u:FormItem.Label="Regular" Count="4" Name="v4" CompleteCommand="{Binding CompleteCommand}"/>
+            <u:PinCode u:FormItem.Label="Digit Only" Count="4" Mode="Digit" DataValidationErrors.Errors="{Binding Error}"/>
+            <u:PinCode u:FormItem.Label="Letter Only" Count="4" Mode="Letter"/>
+            <u:PinCode u:FormItem.Label="Password Mask" Count="6" PasswordChar="•" Complete="VerificationCode_OnComplete" />
+            <u:FormGroup>
+                <u:PinCode u:FormItem.Label="Size Small" Count="6" Classes="Small" />
+                <u:PinCode u:FormItem.Label="Size Default" Count="6" />
+                <u:PinCode u:FormItem.Label="Size Large" Count="6" Classes="Large"  />
+            </u:FormGroup>
+        </u:Form>
+        
+    </StackPanel>
+</UserControl>

demo/Ursa.Demo/Pages/PinCodeDemo.axaml.cs

@@ -3,14 +3,14 @@ using Ursa.Controls;
 
 namespace Ursa.Demo.Pages;
 
-public partial class VerificationCodeDemo : UserControl
+public partial class PinCodeDemo : UserControl
 {
-    public VerificationCodeDemo()
+    public PinCodeDemo()
     {
         InitializeComponent();
     }
 
-    private async void VerificationCode_OnComplete(object? _, VerificationCodeCompleteEventArgs e)
+    private async void VerificationCode_OnComplete(object? _, PinCodeCompleteEventArgs e)
     {
         var text = string.Join(string.Empty, e.Code);
         await MessageBox.ShowOverlayAsync(text);

demo/Ursa.Demo/Pages/VerificationCodeDemo.axaml

@@ -1,17 +0,0 @@
-<UserControl xmlns="https://github.com/avaloniaui"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-             xmlns:u="https://irihi.tech/ursa"
-             xmlns:vm="using:Ursa.Demo.ViewModels"
-             x:DataType="vm:VerificationCodeDemoViewModel"
-             x:CompileBindings="True"
-             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
-             x:Class="Ursa.Demo.Pages.VerificationCodeDemo">
-    <StackPanel>
-        <u:VerificationCode Count="4" Name="v4" CompleteCommand="{Binding CompleteCommand}"/>
-        <u:VerificationCode Count="4" Mode="Digit" DataValidationErrors.Errors="{Binding Error}"/>
-        <u:VerificationCode Count="4" Mode="Letter"/>
-        <u:VerificationCode Count="6" PasswordChar="•" Complete="VerificationCode_OnComplete" />
-    </StackPanel>
-</UserControl>

demo/Ursa.Demo/ViewModels/MainViewViewModel.cs

@@ -67,7 +67,7 @@ public class MainViewViewModel : ViewModelBase
             MenuKeys.MenuKeyThemeToggler => new ThemeTogglerDemoViewModel(),
             MenuKeys.MenuKeyToolBar => new ToolBarDemoViewModel(),
             MenuKeys.MenuKeyTimeBox => new TimeBoxDemoViewModel(),
-            MenuKeys.MenuKeyVerificationCode => new VerificationCodeDemoViewModel(),
+            MenuKeys.MenuKeyPinCode => new PinCodeDemoViewModel(),
             _ => throw new ArgumentOutOfRangeException(nameof(s), s, null)
         };
     }

demo/Ursa.Demo/ViewModels/MenuViewModel.cs

@@ -40,6 +40,7 @@ public class MenuViewModel: ViewModelBase
             new() { MenuHeader = "Numeric UpDown", Key = MenuKeys.MenuKeyNumericUpDown },
             new() { MenuHeader = "NumPad", Key = MenuKeys.MenuKeyNumPad },
             new() { MenuHeader = "Pagination", Key = MenuKeys.MenuKeyPagination },
+            new() { MenuHeader = "PinCode", Key = MenuKeys.MenuKeyPinCode},
             new() { MenuHeader = "RangeSlider", Key = MenuKeys.MenuKeyRangeSlider },
             new() { MenuHeader = "Rating", Key = MenuKeys.MenuKeyRating, Status = "New"},
             new() { MenuHeader = "Scroll To", Key = MenuKeys.MenuKeyScrollToButton },
@@ -53,7 +54,6 @@ public class MenuViewModel: ViewModelBase
             new() { MenuHeader = "TwoTonePathIcon", Key = MenuKeys.MenuKeyTwoTonePathIcon},
             new() { MenuHeader = "ToolBar", Key = MenuKeys.MenuKeyToolBar },
             new() { MenuHeader = "Time Box", Key = MenuKeys.MenuKeyTimeBox },
-            new() { MenuHeader = "Verification Code", Key = MenuKeys.MenuKeyVerificationCode},
         };
     }
 }
@@ -101,7 +101,7 @@ public static class MenuKeys
     public const string MenuKeyThemeToggler = "ThemeToggler";
     public const string MenuKeyTreeComboBox = "TreeComboBox";
     public const string MenuKeyToolBar = "ToolBar";
-    public const string MenuKeyVerificationCode = "VerificationCode";
+    public const string MenuKeyPinCode = "PinCode";
     public const string MenuKeyTimeBox = "TimeBox";
 
 }

demo/Ursa.Demo/ViewModels/PinCodeDemoViewModel.cs

@@ -8,12 +8,12 @@ using Ursa.Controls;
 
 namespace Ursa.Demo.ViewModels;
 
-public partial class VerificationCodeDemoViewModel: ObservableObject
+public partial class PinCodeDemoViewModel: ObservableObject
 {
     public ICommand CompleteCommand { get; set; }
     [ObservableProperty] private List<Exception>? _error;
 
-    public VerificationCodeDemoViewModel()
+    public PinCodeDemoViewModel()
     {
         CompleteCommand = new AsyncRelayCommand<IList<string>>(OnComplete);
         Error = [new Exception("Invalid verification code")];