DEV Community

Cover image for I Finally Published My First NPM Package! πŸŽ‰
Hossein Najafi
Hossein Najafi

Posted on

I Finally Published My First NPM Package! πŸŽ‰

Hello everyone πŸ‘‹

I’m really happy to finally share my first NPM package: taglite πŸš€

This package started from a simple need in one of my projects.

I needed a Tag Input component, so I tried several different libraries. Each one had its own limitations. Some were missing features I needed, while others weren’t flexible enough to customize the way I wanted.

So I decided to build my own.

As I kept using it, I gradually added more features and improvements. Eventually, I thought, why not turn it into an independent package and share it with others?

And that’s how taglite was born. πŸš€

What is taglite?

taglite is a lightweight Tag Input component for React.

My goal was to keep the API simple while still providing the features commonly needed in real-world projects.

✨ Features

πŸš€ Zero runtime dependencies
πŸ”· Full TypeScript support
⌨️ Add tags with Enter and define custom keys such as Tab
πŸ“‹ Copy & Paste support for creating multiple tags
🧹 Normalize and Validate tags
🚫 Prevent duplicate tags
πŸ”’ Limit the number of tags
πŸ’¬ Custom placeholder and hintText
πŸ”’ Read-only and Disabled modes
🎨 Built-in themes such as Dark, Light, Dracula, and more
🧩 Support for custom icons
πŸ”” Callbacks for adding and removing tags
βš™οΈ Support for Native HTML Input Attributes

I’m also working on a new feature that allows you to customize the component’s color and appearance using a color passed through a prop. I’m planning to release it in the next few days. 🌈

This was my first experience building and publishing an NPM package, and honestly, the process itself was one of the most interesting parts for me.

From structuring the package and designing the API to testing, building, writing the documentation, and finally publishing it, there was a lot to learn.

This is currently the first version, and I’m still working on improving it. I’ll probably add more features in future versions based on new needs and feedback.

I’d really appreciate it if you gave it a try and shared your feedback. ❀️

NPM: https://www.npmjs.com/package/taglite

GitHub: https://github.com/hossein-nj/taglite

Top comments (1)

Some comments may only be visible to logged-in visitors. Sign in to view all comments.