suggestion of sidebar

[naymurdev]

@Yeom-JinHo Is there any way we can improve how I add the component list in sidebar? I don’t know, but I feel like people might get lost. i feel people are not aware how many components we have,? Can we make it better? Any suggestions?

[Yeom-JinHo]

@naymurdev
Just to make sure I understand correctly —
are you referring to improving how users discover and browse components in the sidebar,
rather than how contributors technically add them?

[naymurdev]

@Yeom-JinHo yep, you get it right

[Yeom-JinHo]

@naymurdev
Hmm… I agree that it might be difficult for users to navigate right now since the categories aren’t clearly defined.

I gave it some quick thought — how about the following two options?

---

🅰️ Option A – Function-Based Structure

“What does this component do?”

• Top-Level Groups: Layout, Navigation, Forms, Motion, 3D, etc.
• Navigation Flow: Role → Subcategory → Component
• Pros: Logical and familiar (similar to Material UI or Shadcn)
• Cons: Less intuitive for discovering where a component can be used

---

🅱️ Option B – Use-Case-Based Structure

“What do users want to build?”

• Top-Level Groups: Build Sections, Animate, Show Data, 3D & Canvas, etc.
• Navigation Flow: Goal → Implementation (Technology / Type)
• Pros: Intuitive, beginner-friendly, great for showcases
• Cons: Some components may appear in multiple categories

---

Both structures make sense, but I personally find Option A more familiar and would prefer that approach if we decide to reorganize the structure.

[naymurdev]

@Yeom-JinHo I think we can go with the option a

[Yeom-JinHo]

@naymurdev
Got it! I’ll work on it and open a PR soon — please take a look once it’s ready!

[Yeom-JinHo]

@naymurdev
I’ve updated the structure to Option A in PR #65 — please review it when you have time!

[naymurdev]

@Yeom-JinHo i changed the categories little bit, here's the updated one

`
Layout & Structure
├─ Grid
├─ Masonry
├─ Footers
└─ Responsive Header

Navigation & Menus
├─ Tabs
├─ Image Tabs
├─ Magnified Doc
├─ Accordion
└─ FAQs

Forms & Inputs
├─ Buttons
├─ Color Picker
├─ Range Slider
├─ Password
├─ UTube Tags
├─ Phone Input
├─ Datetime Picker
├─ Multi Selector
├─ File Upload
└─ Motion Number

Cards & Highlights
├─ Buy Me A Coffee
├─ Hover Cards
├─ Product Cards
└─ Gradient Border

Media & Galleries
├─ Carousel
├─ Framer Carousel
├─ Progressive Carousel
├─ Clip Path
├─ Image Masking
└─ Video Masking

Motion & Animations
├─ Timeline Animation
├─ Scroll Animation
├─ Scroll Text
├─ Text Marquee
├─ Randomized Text
├─ Image Mousetrail
├─ Horizontal Scroll
├─ Stacking Card
├─ Smooth Scroll
├─ Sticky Scroll
├─ Sparkles
├─ Sparkles Title
├─ Marquee
├─ Infinity Brand
├─ Swapy Drag
└─ Drag Items

Visual Effects
├─ Liquid-Glass
├─ Spotlight Cards
├─ Noise
├─ Blur Vignette
├─ Image Reveal
├─ Animated Beam
├─ Blocks
└─ Liquid Gradient

3D & Visuals
├─ Globe
├─ Img Ripple Effect
├─ R3F Blob
└─ Mesh Gradients
`

[Yeom-JinHo]

@naymurdev Nice update! The updated categories look great — much clearer now