Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.replyke.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Notification Control

A dropdown notification control component for displaying real-time application notifications. Think GitHub, LinkedIn, or Facebook’s notification bell — shows an unread count and displays a notification list when clicked.

​
Key Features

Real-Time Updates

Automatic real-time updates when new notifications arrive.

Smart Positioning

Dropdown automatically positions itself to stay within viewport bounds. Never overflows screen edges.

Infinite Scroll

Load more notifications on demand. Starts with 10, loads more as needed.

Mark as Read

Click to mark individual notifications as read, or use “Mark all read” for bulk actions.

Unread Badge

Shows unread count on the trigger component. Updates automatically in real-time.

Theme Support

Full light/dark/auto mode support with both inline styles and Tailwind variants.

​
What It’s NOT

This is not a full-page notifications center or inbox. It’s a dropdown control component designed for navigation bars and headers.For a full notifications page, use the useAppNotifications hook from @replyke/react-js to build a custom interface.

​
Use Cases

Perfect for:
  • Navigation bar notification bells
  • Header dropdown notifications
  • Real-time notification alerts
  • Social media style notification systems
  • SaaS dashboard notifications
File Complexity: Only 5 files — much simpler than comment components.

​
Notification Types Supported

TypeIconTrigger
systemWrenchSystem announcements
entity-commentMessageCircleNew comment on entity
comment-replyMessageSquareReply to your comment
entity-mention@Mentioned in entity
comment-mention@Mentioned in comment
entity-upvoteHeartUpvote on entity
comment-upvoteHeartUpvote on comment
new-followUserPlusNew follower
connection-acceptedUserPlusConnection accepted
connection-requestUserPlusConnection request
Icons are from lucide-react.

​
Platform Support

PlatformStatus
React (Web)✅ Fully supported
React Native❌ Not available
Expo❌ Not available

​
Required Dependencies

{
  "dependencies": {
    "@replyke/react-js": "^7.0.0",
    "framer-motion": "^12.0.0",
    "lucide-react": "^1.0.0"
  }
}
The CLI checks for these and offers to install them automatically.

​
Next Steps

Installation

Add notification control to your project

Props & API

Learn about component props

Customization

Customize colors, layout, and behavior

Integration Examples

See real-world integration examples