SuperTagInput 🏷️

A production-ready, highly customizable "Tag Input" for Flutter that behaves exactly like the Gmail/Outlook "To:" field.

---

Why SuperTagInput?

Every developer eventually needs an input field where users can type multiple items (emails, tags, categories) that turn into "bubbles" (Chips). Most existing packages are either abandoned, buggy on web/desktop, or too difficult to style.

SuperTagInput solves this by providing a robust, extensible, and beautiful solution.

✨ Key Features

• Smart Backspace:
  • Press 1: Highlights the last tag (visual feedback).
  • Press 2: Deletes the highlighted tag.
• Paste Intelligence: Paste a list like apple, banana, orange and watch them instantly turn into individual tags. Even trailing text is intelligently converted.
• Bulk Delete: Support for Cmd + Backspace (Mac) or Ctrl + Backspace (Windows/Linux) to clear all tags at once.
• Custom Delimiters: Split tags on any character (Space, Comma, Enter, or even custom characters like 'T').
• Validation: Built-in validator support to prevent invalid tags from being created.
• Highly Configurable: Use the tagBuilder for 100% control over the look and feel of your tags.
• Focus Unification: Tapping anywhere in the container focuses the input field, just like a native input.

---

🎨 Showcase

Modern Rounded	User Mentions (Avatars)

Hashtags (Minimal)	Validation Feedback

Cyberpunk (Dark Mode)	Multi-word Tags

---

🚀 Usage

Simple Implementation

SuperTagInput(
  initialTags: ['Flutter', 'Dart'],
  onTagAdded: (tag) => print("Added $tag"),
  onTagRemoved: (tag) => print("Removed $tag"),
  inputDecoration: InputDecoration(
    hintText: "Add tags...",
    border: OutlineInputBorder(),
  ),
)

Advanced Customization

SuperTagInput(
  delimiters: [',', '\n'], // Don't split on space, allow multi-word tags
  validate: (tag) => tag.contains('@'), // Only allow emails
  deleteIcon: Icon(Icons.close, size: 18),
  tagBuilder: (context, tag, isSelected, onDeleted) {
    return Chip(
      label: Text(tag),
      onDeleted: onDeleted,
      backgroundColor: isSelected ? Colors.blue : Colors.grey[200],
    );
  },
)

---

⚙️ Parameters

Parameter	Type	Default	Description
initialTags	List<String>	[]	List of tags to display initially.
onTagAdded	ValueChanged<String>?	null	Callback triggered when a new tag is added.
onTagRemoved	ValueChanged<String>?	null	Callback triggered when a tag is removed.
delimiters	List<String>	[',', ' ', '\n']	Characters that trigger tag creation.
validate	bool Function(String)?	null	Function to validate a tag before it's created.
tagBuilder	Widget Function(...)	null	Custom builder for tag widgets. Passes onDeleted for manual wiring.
inputDecoration	InputDecoration?	Classic style	Styling for the underlying TextField and container.
deleteIcon	Widget?	null	Custom icon to use for the delete button (if using default Chip).

---

🛠️ Installation

Add this to your pubspec.yaml:

dependencies:
  super_tag_input: ^0.0.1

Then run:

flutter pub get

---

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

---

👨‍💻 Maintainer

This package is created and maintained by Mohammad Dilshad Alam.

Feel free to reach out for support, feature requests, or to contribute to the project!

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.