@page "/security-code"

<RadzenText TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    SecurityCode
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Demonstration and configuration of the Radzen Blazor <strong>SecurityCode</strong> component.
</RadzenText>

<RadzenText TextStyle="TextStyle.Subtitle2" TagName="TagName.P" class="rz-pb-4">
    In this demo four security code inputs demonstrate different types: <strong>Default</strong> (alphanumeric), <strong>Numeric</strong> (<code>Type="SecurityCodeType.Numeric"</code>), <strong>Password</strong> (masked), and one with pre-filled value "sa4f", with controls to adjust <code>Count</code> (1-8 digits), <code>Gap</code>, and <code>Disabled</code> state.
</RadzenText>

<RadzenExample ComponentName="SecurityCode" Example="SecurityCodeConfig">
    <SecurityCodeConfig />
</RadzenExample>
