tigerabrodi

tigerabrodi / fude

Public

A React component for rich text input with @ mentions and AI autocomplete.

fude-docs.vercel.app
38
0
100% credibility
Found Mar 06, 2026 at 38 stars -- GitGems finds repos before they trend. Get early access to the next one.
Sign Up Free
AI Analysis
TypeScript
AI Summary

A customizable text input component that supports inline @mention tags as chips and ghost-text autocomplete suggestions.

How It Works

1
🔍 Discover Fude

You come across Fude, a smart text box that lets people add tags with @ and see helpful predictions while typing.

2
📦 Add to your creation

You easily bring the smart text box into the app or page you're making, ready to use right away.

3
👥 Set up tag options

You share a list of things like friends, files, or ideas that people can quickly tag by typing @.

4
🧠 Connect smart helper

You link a thinking service so it can guess and suggest the next words as faint preview text.

5
✨ Type with magic

As you type, @ opens a handy dropdown to pick tags that turn into neat inline chips, and ghost text predicts ahead – feels effortless and fun!

6
🎨 Make it yours

You adjust colors, icons for tags, and looks to perfectly fit your style and feel.

🎉 Smart input ready

Now everyone enjoys typing with easy tags, smart predictions, and smooth flow – your app shines!

Sign up to see the full architecture

5 more

Sign Up Free

Star Growth

See how this repo grew from 38 to 38 stars Sign Up Free
Repurpose This Repo

Repurpose is a Pro feature

Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.

Unlock Repurpose
AI-Generated Review

What is fude?

fude is a TypeScript React component for rich text inputs combining @mentions and AI autocomplete in one box. Type @ to trigger dropdowns that insert inline tag chips—complete with icons, tooltips, and hover-delete—while pausing mid-sentence shows ghost text predictions you accept with Tab. Use the segment array value for structured data, plus helpers like getPlainText for APIs and fuzzyFilter for local searches in github fude setups.

Why is it gaining traction?

It stands out among react component libraries by letting mentions and autocomplete coexist without conflicts, using keyboard-first shortcuts like double-backspace for chip deletion. Rich JSX labels/icons per mention, Tailwind-friendly classNames/styles, and auto-handling of stale API responses make it drop-in ready for react component props. Developers grab it for the zero-config fuzzy matching and multiline support that just works.

Who should use this?

Frontend devs building chat apps, issue trackers, or AI editors needing @user/file mentions alongside completions—like Slack-inspired threads or GitHub-style commenters. Perfect for react component example integrations in forms with team/file pickers, or react components handling dynamic inputs in dashboards. Skip if you need full editor features beyond chips and ghosts.

Verdict

At 38 stars and 1.0% credibility, fude feels pre-1.0 with thin tests but excellent docs, examples, and TypeScript types covering react component lifecycle basics. Prototype it now for react component libraries needing quick mentions+AI; it'll save weeks versus rolling your own.

(198 words)

Sign up to read the full AI review Sign Up Free

Similar repos coming soon.