Kiritiş · compound
AI savolnoma
AI agent vazifani aniqlaştiriş uçun variantli savollarni bittadan söraydi: raqamli variantlar (klaviaturada 1–9), köp tanlovli savol, «Boşqa» bilan erkin javob, «Ötkazib yuboriş», jarayon çiziği va «2 / 3». Oxirida javoblar xulosasi çiqadi va agentga hodisa ketadi.
Yordamçi hisobot tayyorlaşdan oldin söraydi
Variantlar
| Atribut | Qiymatlar | Standart |
|---|---|---|
data-state | done Javoblar yuborildi — xulosa körinadi (xulq qöyadi) | — |
Anatomiya
- root
.fx-questionnaireşart - head
.fx-questionnaire__headixtiyoriy - agent
.fx-questionnaire__agentixtiyoriy - progress
.fx-questionnaire__progressixtiyoriy - bar
.fx-questionnaire__barixtiyoriy - form
.fx-questionnaire__formşart - step
.fx-questionnaire__stepşart - question
.fx-questionnaire__qşart - hint
.fx-questionnaire__hintixtiyoriy - options
.fx-questionnaire__optionsixtiyoriy - option
.fx-questionnaire__optionşart - key
.fx-questionnaire__keyixtiyoriy - label
.fx-questionnaire__labelixtiyoriy - desc
.fx-questionnaire__descixtiyoriy - other
.fx-questionnaire__otherixtiyoriy - actions
.fx-questionnaire__actionsixtiyoriy - kbd
.fx-questionnaire__kbdixtiyoriy - summary
.fx-questionnaire__summaryixtiyoriy
Holatlar
checkeddone
Klaviatura va kiriş
| Tugma | Amal |
|---|---|
| 1–9 | Şu raqamli variantni tanlaydi (köp tanlovda — almaştiradi) |
| ← → ↑ ↓ | Variantlar orasida (native radio) |
| Space | Fokusdagi variantni belgilaydi |
| Enter | Keyingi savol / yuboriş |
Har savol fieldset + legend; variantlar native radio/checkbox (strelkalar, Space). Raqam belgisi aria-hidden, tanlanganda ✓ (şakl). Jarayon matni aria-live («2 / 3»), savol almaşganda fokus birinçi (yoki tanlangan) variantga ötadi; oxirida fokus xulosaga.
Naqş: WAI-ARIA APG radio · rol group
Kod
AI uçun: qaçon işlatiladi
Işlating
- AI yordamçi vazifani bajarişdan oldin 2–5 ta aniqlaştiruvçi savol bersa.
- Çat içidagi qisqa sörovnoma yoki onboarding savollari.
Işlatmang
- Köp maydonli, ma'lumot kiritiladigan forma →
wizard - Agentning bitta amalini tasdiqlaş →
approval - Hamma savolni birdaniga uzun forma qilib bermang — agent bittadan söraydi, foydalanuvçi suhbatdan çiqmaydi.
- «Boşqa» variantisiz yopiq röyxat bermang — AI taxmini notöğri bölişi mumkin.
- Majburiy bölmagan savolda «Keyingi»ni öçirib qöymang — data-optional qöying.
npx foxui add questionnaire
<div class="fx-questionnaire" data-fx-questionnaire aria-label="Hisobot uçun savollar">
<div class="fx-questionnaire__head"><span class="fx-questionnaire__agent"><span class="fx-avatar" data-size="sm" data-color="purple" aria-hidden="true">AI</span>Yordamçi hisobot tayyorlaşdan oldin söraydi</span><span class="fx-questionnaire__progress" aria-live="polite"></span></div>
<form class="fx-questionnaire__form">
<fieldset class="fx-questionnaire__step"><legend class="fx-questionnaire__q">Hisobot qaysi davr uçun kerak?</legend><p class="fx-questionnaire__hint">Bittasini tanlang</p><div class="fx-questionnaire__options"><label class="fx-questionnaire__option"><input type="radio" name="davr" value="oy"><span class="fx-questionnaire__key" aria-hidden="true">1</span><span class="fx-questionnaire__label">Şu oy</span><span class="fx-questionnaire__desc">1–18 oktabr</span></label><label class="fx-questionnaire__option"><input type="radio" name="davr" value="chorak"><span class="fx-questionnaire__key" aria-hidden="true">2</span><span class="fx-questionnaire__label">Joriy çorak</span><span class="fx-questionnaire__desc">Iyul – sentabr</span></label><label class="fx-questionnaire__option"><input type="radio" name="davr" value="yil"><span class="fx-questionnaire__key" aria-hidden="true">3</span><span class="fx-questionnaire__label">2026 yil boşidan</span></label><label class="fx-questionnaire__option" data-other><input type="radio" name="davr" value="boshqa"><span class="fx-questionnaire__key" aria-hidden="true">4</span><span class="fx-questionnaire__label">Boşqa davr</span><input class="fx-input fx-questionnaire__other" data-size="sm" aria-label="Boşqa javob" placeholder="Özingiz yozing"></label></div></fieldset>
<fieldset class="fx-questionnaire__step" hidden><legend class="fx-questionnaire__q">Qaysi kesimlarda körsatay?</legend><p class="fx-questionnaire__hint">Bir neçtasini tanlaş mumkin</p><div class="fx-questionnaire__options"><label class="fx-questionnaire__option"><input type="checkbox" name="kesim" value="menejer"><span class="fx-questionnaire__key" aria-hidden="true">1</span><span class="fx-questionnaire__label">Menejerlar böyiça</span></label><label class="fx-questionnaire__option"><input type="checkbox" name="kesim" value="manba"><span class="fx-questionnaire__key" aria-hidden="true">2</span><span class="fx-questionnaire__label">Mijoz manbai</span><span class="fx-questionnaire__desc">Sayt, Telegram, Instagram, tavsiya</span></label><label class="fx-questionnaire__option"><input type="checkbox" name="kesim" value="filial"><span class="fx-questionnaire__key" aria-hidden="true">3</span><span class="fx-questionnaire__label">Filiallar böyiça</span></label><label class="fx-questionnaire__option"><input type="checkbox" name="kesim" value="mahsulot"><span class="fx-questionnaire__key" aria-hidden="true">4</span><span class="fx-questionnaire__label">Mahsulot turlari</span></label></div></fieldset>
<fieldset class="fx-questionnaire__step" data-optional hidden><legend class="fx-questionnaire__q">Natijani qanday körinişda beray?</legend><p class="fx-questionnaire__hint">Ixtiyoriy — tanlamasangiz, qisqa xulosa</p><div class="fx-questionnaire__options"><label class="fx-questionnaire__option"><input type="radio" name="format" value="jadval"><span class="fx-questionnaire__key" aria-hidden="true">1</span><span class="fx-questionnaire__label">Jadval (Excel)</span></label><label class="fx-questionnaire__option"><input type="radio" name="format" value="grafik"><span class="fx-questionnaire__key" aria-hidden="true">2</span><span class="fx-questionnaire__label">Grafiklar bilan PDF</span></label><label class="fx-questionnaire__option"><input type="radio" name="format" value="chat"><span class="fx-questionnaire__key" aria-hidden="true">3</span><span class="fx-questionnaire__label">Şu yerda qisqa xulosa</span></label></div></fieldset>
<div class="fx-questionnaire__actions"><button class="fx-btn" type="button" data-variant="ghost" data-size="sm" data-q="skip">Ötkazib yuboriş</button><span class="fx-questionnaire__kbd">1–4 tugmalari bilan tanlang</span><button class="fx-btn" type="button" data-size="sm" data-q="back">Orqaga</button><button class="fx-btn" type="submit" data-variant="primary" data-size="sm" data-q="next">Keyingi</button></div>
</form>
<dl class="fx-questionnaire__summary" hidden></dl>
</div>Tokenlar: --fx-bg-brand-solid --fx-bg-brand-subtle --fx-bg-muted --fx-bg-subtle --fx-bg-surface --fx-border-color-default --fx-border-color-focus --fx-border-color-strong --fx-border-color-surface --fx-border-width-default --fx-border-width-focus --fx-control-h-sm --fx-dialog-width --fx-ease-enter --fx-ease-standard --fx-font-size-md --fx-font-size-sm --fx-font-size-xs --fx-font-weight-medium --fx-font-weight-regular --fx-font-weight-semibold --fx-motion-base --fx-motion-fast --fx-motion-instant --fx-motion-press --fx-radius-circle --fx-radius-control --fx-radius-surface --fx-space-1 --fx-space-2 --fx-space-3 --fx-space-4 --fx-space-5 --fx-text-on-brand --fx-text-primary --fx-text-secondary --fx-text-tertiary
Şu toifadan
KalendarOy töri: kun tanlaş, oraliq (2 oy yonma-yon), oy va yil körinişi.Captcha ramkasi«Men robot emasman» (4.110, #27): uçinçi tomon captcha'si (Cloudflare Turnstile, reCAPTCHA, hCaptcha yoki öz serveringiz) uçun FoxUI ramkasi — forma içida begona körinmaydi, holatlar hamma provayderda bir xil: böş → «Tekşirilmoqda…» (halqa) → ✓ «Tasdiqlandi» / !CheckoutTölov / checkout formasi (naqş): raqamlangan bölimlar — aloqa (telefon +998), yetkazib beriş usuli va manzil, tölov usuli (bank kartasi — raqam va muddat niqobi bilan, naqd, bölib tölaş); öngda yopişqoq buyurtma xulosasi — mahsulotlar, promo-kod, jami va «… söm tölaş».Rang tanlagiçErkin rang tanlaş: töyinganlik/yorqinlik maydoni (siçqonça va klaviatura), ton çiziği, HEX va RGB maydonlari, tayyor ranglar qatori va pipetka (brauzer qöllasa).ComboboxYozib qidiriladigan tanlov: köp variant (şahar, mijoz, mahsulot).Yoziş paneli (composer)AI çat va messenjer uçun BITTA yoziş paneli: biriktiriş tugmasi, avto-ösuvçi maydon, ixtiyoriy emoji, matn bölmasa mikrofon — matn paydo bölsa yuboriş (ikon animatsiyali almaşadi), oqim ketayotganda «Töxtatiş».