National ID Input

A plain Iranian national ID (کد ملی) field built on Input Group, validated through the National ID utility. It normalizes Persian and Arabic-Indic digits to Latin as you type or paste, using Normalize Persian Digits, caps the value at 10 digits, and shows a shape-based (not color-only) checkmark or alert icon once the value looks complete.

Last updated October 20, 2018

Overview

Installation

Install the input, its validation utility, and the input-group primitives in one step.

Usage

import { NationalIdInput } from "@/components/ui/national-id-input"
 
export function Example() {
  return <NationalIdInput />
}

The value is the typed digits only — Latin 0–9, at most 10 characters, leading zeros preserved exactly as typed. The component reports validity only once all 10 digits are present; shorter values stay neutral while typing. If your backend stores codes without leading zeros, the National ID utility's isValidNationalId also accepts 8–9 digit values and zero-pads them internally.

Examples

RTL

Labels and helper text follow the surrounding RTL interface while the digit value remains intentionally LTR. Persian digits are normalized as you type or paste.

API Reference