Harakat · primitive
Pin tugmasi (☆)
Sahifa yoki körinişni çap relsga pin qiliş tugmasi (Ustoz 21.10, PDP rels naqşi): ☆ — pin qilinmagan, ★ — pin qilingan (ogohlantiriş rangida). Bosilganda holat almaşadi va «fx-pin» hodisasi çiqadi (detail: href, nom, on) — ilova saqlaydi (har a'zoning özi, serverda). Pinlar relsda ajratuvçi ostida — fx-rail .fx-rail__pins.
Buyurtmalar
Anatomiya
- root
.fx-pinşart
Holatlar
onbusy
Klaviatura va kiriş
| Tugma | Amal |
|---|---|
| Enter / Space | Pin qiliş yoki oliş |
<button aria-pressed>; aria-label va title xulq tomonidan holatga qarab yangilanadi («Relsga pin qiliş» / «Pindan oliş»).
Kod
AI uçun: qaçon işlatiladi
Işlating
- CRM, röyxat va hisobot sahifalarida — tez-tez oçiladigan körinişni relsga mahkamlaş.
Işlatmang
- Elementni sevimlilarga qöşiş (karta, mahsulot) →
rating - Pinni brauzerda (localStorage) saqlamang — har a'zoniki, serverda (qurilmalar örtasida bir xil).
- Tugmani yozuvsiz qoldirmang — aria-label holatga qarab özgaradi.
npx foxui add pin
<h2 style="display:flex;align-items:center;gap:var(--fx-space-2);margin:0">Buyurtmalar <button class="fx-pin" type="button" data-fx-pin data-href="/crm?k=buyurtmalar&v=jadval" data-nom="Buyurtmalar · Jadval" aria-pressed="false" aria-label="Relsga pin qiliş" title="Relsga pin qiliş"><svg viewBox="0 0 256 256" aria-hidden="true"><path fill="currentColor" d="M239.18,97.26A16.38,16.38,0,0,0,224.92,86l-59-4.76L143.14,26.15a16.36,16.36,0,0,0-30.27,0L90.11,81.23,31.08,86a16.46,16.46,0,0,0-9.37,28.86l45,38.83L53,211.75a16.38,16.38,0,0,0,24.5,17.82L128,198.49l50.53,31.08A16.4,16.4,0,0,0,203,211.75l-13.76-58.07,45-38.83A16.43,16.43,0,0,0,239.18,97.26Zm-15.34,5.47-48.7,42a8,8,0,0,0-2.56,7.91l14.88,62.8a.37.37,0,0,1-.17.48c-.18.14-.23.11-.38,0l-54.72-33.65a8,8,0,0,0-8.38,0L69.09,215.94c-.15.09-.19.12-.38,0a.37.37,0,0,1-.17-.48l14.88-62.8a8,8,0,0,0-2.56-7.91l-48.7-42c-.12-.1-.23-.19-.13-.5s.18-.27.33-.29l63.92-5.16A8,8,0,0,0,103,91.86l24.62-59.61c.08-.17.11-.25.35-.25s.27.08.35.25L153,91.86a8,8,0,0,0,6.75,4.92l63.92,5.16c.15,0,.24,0,.33.29S224,102.63,223.84,102.73Z"/></svg><svg viewBox="0 0 256 256" aria-hidden="true"><path fill="currentColor" d="M234.29,114.85l-45,38.83L203,211.75a16.4,16.4,0,0,1-24.5,17.82L128,198.49,77.47,229.57A16.4,16.4,0,0,1,53,211.75l13.76-58.07-45-38.83A16.46,16.46,0,0,1,31.08,86l59-4.76,22.76-55.08a16.36,16.36,0,0,1,30.27,0l22.75,55.08,59,4.76a16.46,16.46,0,0,1,9.37,28.86Z"/></svg></button></h2>
Tokenlar: --fx-bg-muted --fx-border-color-focus --fx-border-width-default --fx-border-width-focus --fx-control-h-sm --fx-ease-standard --fx-fg-warning --fx-motion-fast --fx-motion-instant --fx-motion-press --fx-radius-circle --fx-size-icon-md --fx-text-primary --fx-text-tertiary
Şu toifadan
Ommaviy panelTanlov bölsa pastda markazda suzib çiqadigan panel: son, summa (ixtiyoriy), amallar, ×.TugmaAmal tugmasi.AI checkpointAI suhbati yoki agent lentasidagi «şu nuqtaga qaytiş» belgisi (4.204, Vercel AI Elements «Checkpoint»; Cursor va Claude Code'dagi rewind).Yopiş tugmasiDialog, sheet, alert va chip uçun bir xil ✕ tugmasi.Nusxa tugmasiBir bosişda matn clipboard'ga yoziladi: nusxa ikoni ✓ ga yumşoq almaşadi (2 soniya), natija e'lon qilinadi.Prujinali sudraşElementni barmoq yoki siçqonça bilan suriş: sudralayotganda körsatkiçga yopişadi va biroz kötariladi, qöyib yuborilganda tezligi bilan biroz davom etadi (inersiya) va prujina bilan joyiga qaytadi (HIG, M3 Expressive, Vaul).