Holat va javob · compound
Tasdiqlaş sörovi (ruxsat / rad)
Agent xavfli yoki qaytarib bölmaydigan amaldan oldin ruxsat söraydi: savol, nima özgarişi (tafsilot) va Ruxsat beriş / Rad etiş / Har doim ruxsat. Qaror tugmalarni natija satriga (ikon + söz) almaştiradi va fx-approval hodisasini çiqaradi.
Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?
Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.
crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv
Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?
Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.
crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv
Ruxsat berildi
Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?
Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.
crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv
Rad etildi
Variantlar
| Atribut | Qiymatlar | Standart |
|---|---|---|
data-state | approved Ruxsat berilgandenied Rad etilgan | pending |
Anatomiya
- root
.fx-approvalşart - head
.fx-approval__headixtiyoriy - title
.fx-approval__titleşart - text
.fx-approval__textixtiyoriy - detail
.fx-approval__detailixtiyoriy - actions
.fx-approval__actionsşart - result
.fx-approval__resultixtiyoriy
Holatlar
focus
Klaviatura va kiriş
| Tugma | Amal |
|---|---|
| Tab | Tugmalar orasida |
| Enter, Space | Qarorni qabul qiladi |
Savol aria-labelledby bilan. data-autofocus bölsa fokus xavfsiz tugmaga (Rad etiş) tuşadi. Qarordan keyin tugmalar yaşiriladi va fokus natija satriga (role="status", tabindex=-1) ötadi — fokus yöqolmaydi. Natija ikon + söz.
Kod
AI uçun: qaçon işlatiladi
Işlating
- Agent öçiriş, yuboriş, tölov kabi amaldan oldin ruxsat olişi kerak.
Işlatmang
- Foydalanuvçi boşlagan amalni tasdiqlaş (öçiriş tugmasi) →
dialog - Oddiy xabar →
toast - “Ruxsat”ni xavfsiz tugma qilib birinçi fokusga qöymang — fokus Rad etiş tugmasida (data-autofocus).
- Nima özgarişini yaşirmang — aniq son va nom bilan tafsilot yozing.
- “Har doim”ni qaytarib bölmaydigan amalga taklif qilmang.
npx foxui add approval
<div style="display:grid;gap:var(--fx-space-3)"><section class="fx-approval" data-autofocus data-fx-approval aria-labelledby="ap-t0">
<div class="fx-approval__head"><svg data-fx-icon="shield" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z"/></svg><h4 class="fx-approval__title" id="ap-t0">Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?</h4><p class="fx-approval__text">Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.</p></div>
<pre class="fx-approval__detail">crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv</pre>
<div class="fx-approval__actions"><button type="button" class="fx-btn" data-variant="primary" data-approve>Ruxsat beriş</button><button type="button" class="fx-btn" data-deny>Rad etiş</button><button type="button" class="fx-btn" data-variant="ghost" data-always>Har doim ruxsat</button></div>
<p class="fx-approval__result" role="status"></p>
</section><section class="fx-approval" data-fx-approval data-state="approved" aria-labelledby="ap-tapproved">
<div class="fx-approval__head"><svg data-fx-icon="shield" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z"/></svg><h4 class="fx-approval__title" id="ap-tapproved">Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?</h4><p class="fx-approval__text">Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.</p></div>
<pre class="fx-approval__detail">crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv</pre>
<div class="fx-approval__actions"><button type="button" class="fx-btn" data-variant="primary" data-approve>Ruxsat beriş</button><button type="button" class="fx-btn" data-deny>Rad etiş</button><button type="button" class="fx-btn" data-variant="ghost" data-always>Har doim ruxsat</button></div>
<p class="fx-approval__result" role="status">Ruxsat berildi</p>
</section><section class="fx-approval" data-fx-approval data-state="denied" aria-labelledby="ap-tdenied">
<div class="fx-approval__head"><svg data-fx-icon="shield" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z"/></svg><h4 class="fx-approval__title" id="ap-tdenied">Mijozlar bazasidan 12 ta yozuvni öçirişga ruxsat berasizmi?</h4><p class="fx-approval__text">Oxirgi faollik 2 yildan oldin. Amalni qaytarib bölmaydi.</p></div>
<pre class="fx-approval__detail">crm.yozuvlar.oʻchirish({ holat: "faol", oxirgi_faollik: "> 2 yil" }) → 12 ta yozuv</pre>
<div class="fx-approval__actions"><button type="button" class="fx-btn" data-variant="primary" data-approve>Ruxsat beriş</button><button type="button" class="fx-btn" data-deny>Rad etiş</button><button type="button" class="fx-btn" data-variant="ghost" data-always>Har doim ruxsat</button></div>
<p class="fx-approval__result" role="status">Rad etildi</p>
</section></div>Tokenlar: --fx-bg-muted --fx-bg-surface --fx-border-color-default --fx-border-color-focus --fx-border-width-default --fx-border-width-focus --fx-fg-error --fx-fg-success --fx-fg-warning --fx-font-adjust-mono --fx-font-family-mono --fx-font-size-md --fx-font-size-sm --fx-font-size-xs --fx-font-weight-medium --fx-font-weight-semibold --fx-radius-badge --fx-radius-overlay --fx-size-icon-lg --fx-size-icon-md --fx-space-1 --fx-space-2 --fx-space-3 --fx-space-4 --fx-text-primary --fx-text-secondary
Şu toifadan
OgohlantirişBölim yoki sahifadagi muhim xabar: töla tusli yuza, holat belgisi (şakl), sarlavha, matn, bitta havola, ixtiyoriy yopiş.BannerButun kenglikdagi sayt e'loni (texnik işlar, obuna tugadi): holat belgisi (şakl), qisqa matn, bitta havola, yopiş.Portlaş va konfettiYoqtiriş va muvaffaqiyat uçun qisqa, bir martalik quvonç effektlari (Magic UI Confetti, Twitter «yoqdi»).Boşlaş röyxatiYangi foydalanuvçi uçun onboarding kartasi: jarayon çiziği va «2 / 5», qadamlar röyxati.Cookie roziligiCookie va kuzatuv roziligi naqşi (4.180, GOV.UK Cookie banner; GDPR 2-bosqiç uçun): pastki karta — nima uçun cookie kerakligi bir-ikki gapda, «Qabul qiliş», «Rad etiş» (bir xil vaznli — rad etiş yaşirilmaydi) va «Sozlaş».Teskari sanoqQolgan vaqtni körsatadi: aksiya tugaşi (kun · soat · daqiqa · soniya), imtihon yoki test vaqti, SMS kodni qayta yuborişgaça («00:59»).