I’ve updated the structure based on our discussion in #64

Description

This PR focuses on reorganizing component navigation categories to improve user experience and maintainability.
The changes introduce a more logical and intuitive categorization system for better component discovery.

Changes

• Layout: Defines the structural foundation of pages, including responsive grids, headers, and footers.
• Navigation: Provides components for guiding user flow and tab-based interfaces.
• Forms: Includes input and control components used for user interactions and data entry.
• Data Display: Used to visually present data, cards, and key UI patterns in a consistent, readable way.
• Media & Galleries: Focuses on visual and creative media display components like carousels, masks, and galleries.
• Animation & Motion: Contains dynamic and interactive motion components designed for scroll, text, or animated transitions.
• Visual Effects: Dedicated to visual styling, transitions, and atmospheric effects that enhance aesthetics.
• Visual 3D: Components built with Three.js or React Three Fiber to create 3D or shader-based effects.
• Overlays: Contains layered UI components such as modals and drawers for surface-level interactions.
• Disclosure: Provides collapsible content patterns like accordions or FAQs to organize information hierarchically.
• Utilities: Functional or interactive helper components that enhance usability and interaction.

Motivation

• Better UX: Users can now more easily find components based on their intended use case.
• Logical Organization: Separating animation behaviors from visual effects creates clearer mental models.
• Maintainability: More granular categories make it easier to manage and expand the component library.
• Consistency: Aligns with common UI library patterns where form inputs are grouped together regardless of visual enhancements.

navigation categories

Layout
├─ Footers
├─ Responsive-Header
├─ Grid
└─ Masonary

Navigation
├─ Tabs
├─ Image Tabs
└─ Magnified-Doc

Disclosure
├─ Accordion
├─ FAQs
└─ Image Accordion

Overlays
├─ Dialog
├─ Media Modal
├─ Linear Modal
├─ Gallery Modal
├─ Responsive Modal
├─ Directional Drawer
└─ Motion Drawer

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

Data Display
├─ Liquid-Glass
├─ Buy Me A Coffee
├─ Hover cards
├─ Product-Cards
├─ Gradient Border
└─ Spotlight cards

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

Animation & Motion
├─ Timeline Animation
├─ Scroll Animation
├─ Scroll Text
├─ Text Maruqee
├─ Randomized Text
├─ Image Mousetrail
├─ Horizontal Scroll
├─ Stacking Card
├─ Smooth-Scroll
├─ Sticky Scroll
├─ Sparkles
├─ Sparkles Title
├─ Marquee
└─ Infinity Brand

Visual Effects
├─ Noise
├─ Blur Vignette
├─ Image Reveal
├─ Animated Beam
├─ Blocks
└─ liquid-gradient

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

Utilities
├─ Swapy Drag
└─ Drag Items