انٹرایکٹو کمپوننٹس
<Input>، <Textarea>، <Select> اور <Tabs>: فوکس، شارٹ کٹس اور صفحہ فوکس میں نہ ہونے پر متن کاپی کرنا۔
یہ ان پٹس کی بورڈ سے چلتے ہیں اور اپنا فوکس خود سنبھالتے ہیں۔
لائیوTab next field · Enter submittsx
<Box className="flex-col gap-1 p-1"> <Input placeholder="my-text-app" autoFocus /> <Select options={regions} value={region} onChange={setRegion} /> <Tabs tabs={plans} activeTab={plan} onChange={setPlan} variant="pill" /></Box>فوکس
Tab اور Shift+Tab فوکس کو باری باری منتقل کرتے ہیں۔ autoFocus ماؤنٹ ہونے پر فوکس حاصل کرتا ہے۔
const { isFocused } = useFocus({ autoFocus: true });useFocusManager().focus("search");فوکس والے ایڈیٹرز اپنی کیز خود استعمال کرتے ہیں، اس لیے 1 ٹائپ کرنے سے کبھی کوئی گلوبل شارٹ کٹ فعال نہیں ہوتا۔
<Input>
readline طرز کی ایڈیٹنگ کے ساتھ ایک لائن کا ان پٹ۔
| Prop | تفصیل |
|---|---|
value / onChange | کنٹرول شدہ ویلیو |
onSubmit | Enter دبانے پر کال |
placeholder | خالی ہونے پر ظاہر ہونے والا متن |
mask | خفیہ معلومات چھپانے کا کریکٹر |
<Textarea>
کئی لائنوں کا کمپوزر۔ Enter سبمٹ کرتا ہے، Shift+Enter نئی لائن شامل کرتا ہے۔
<Textarea placeholder="Ask anything…" maxRows={6} onSubmit={send} /><Select>
کی بورڈ سے چلنے والی آپشنز کی فہرست جس میں اختیاری فزی سرچ ہے۔
| Prop | تفصیل |
|---|---|
options | { value, label, hint?, badge? }[] |
onChange | Enter دبانے پر کال |
searchable | ٹائپ کرنے پر آپشنز کی فلٹرنگ |
<Tabs>
<Tabs tabs={[{ id: "home", label: "Home", shortcut: "1" }]} activeTab={tab} onChange={setTab} />فوکس کے بغیر کرسر
جب صفحے کا فوکس ہٹتا ہے تو کرسر ساکن ہو جاتے ہیں اور فریم رک جاتے ہیں، تاکہ آپ کونسول کا متن منتخب اور کاپی کر سکیں۔