רכיביםחדש
אקורדיון עם וילון
שאלות ותשובות שנפתחות על קפיץ. התשובה נחשפת מלמעלה למטה כמו וילון. אפשר לאפשר כמה פריטים פתוחים.
התאמה
accentColor
secondaryColor
glowColor
מבוסס על Accordion (MIT רישיון) · תנאי שימוש
עוד ב-Pro
לכל הרכיביםמאפיינים
10 מאפיינים| מאפיין | סוג | ברירת מחדל | תיאור |
|---|---|---|---|
| children | ReactNode | — | פריטי AccordionItem עם AccordionHeader ו-AccordionPanel בפנים. |
| multiple | boolean | false | אפשר לפתוח כמה פריטים בבת אחת. |
| defaultValue | string | string[] | — | איזה פריט פתוח בהתחלה. |
| accentColor | string | "#ffffff" | הצבע הראשי: המסגרת והחץ של הפריט הפתוח. |
| secondaryColor | string | "#a3a3a3" | הצבע השני: אליו דועכת ההדגשה של כותרת הפריט הפתוח. |
| glowColor | string | "rgba(255, 255, 255, 0.12)" | זוהר רך סביב הפריט הפתוח. |
| AccordionItem.value | string | — | שם ייחודי של הפריט. |
| AccordionHeader.customIcon | boolean | — | להסתיר את החץ כדי לשים אייקון משלך. |
| AccordionPanel.articleClassName | string | — | מחלקות הבלוק הפנימי שנפתח כמו וילון. |
| className | string | — | מחלקות נוספות. |
תלויות
4 חבילות נדרשות
npm install motion lucide-react clsx tailwind-merge