Özel maske (plaka)

Kendi deseninizi yazın: 9 rakam, a harf, [ ] isteğe bağlı bölüm.

Önizleme

Form değeri: -

Görünen: -

import { useForm } from "react-hook-form"
import { definePreset, useViraMask } from "@virastack/mask"
 
// 9 digit · a letter · [optional part]
const plateMask = definePreset("plate", { mask: "99 a[aa] 99[99]", transform: "uppercase" })
 
function Example() {
  const form = useForm<{ plate: string }>()
  const { plate } = useViraMask(form, { plate: plateMask })
 
  return <input {...plate} placeholder="34 ABC 123" />
}

Detaylar

Desen: 99 a[aa] 99[99]
Form değeri: "34ABC123"
Hata anahtarları: plate.incomplete
transform: "uppercase" harfleri büyütür.
Hata anahtarı preset adından gelir: plate.incomplete.

Özelleştirme

definePreset ile paylaşmak

Tek yerde tanımlayın; hook, sunucu ve testler aynı maskeyi kullanır.

// masks.ts — shared by the client and the server
import { definePreset } from "@virastack/mask/server"
 
export const plate = definePreset("plate", {
  mask: "99 a[aa] 99[99]",
  transform: "uppercase",
})
 
// form
useViraMask(form, { plate })

Hook API için useViraMask(), kendi deseniniz için özel maske.