Weave Code
Code Weaver
Helps Laravel developers discover, compare, and choose open-source packages. See popularity, security, maintainers, and scores at a glance to make better decisions.
Feedback
Share your thoughts, report bugs, or suggest improvements.
Subject
Message

Filament Rich Editor Heroicons Laravel Package

oliwol/filament-rich-editor-heroicons

Filament v4/v5 plugin for RichEditor (TipTap) that adds a searchable Heroicons picker. Insert inline SVG icons (outline/solid/mini) into content with configurable size, alignment, and color, and render them via RichContentRenderer.

View on GitHub
Deep Wiki
Context7

Product Decisions This Supports

  • Build vs. Buy: Buy – This package eliminates the need to build a custom icon picker for Filament’s RichEditor, saving ~3–6 weeks of dev time (estimation: frontend integration, accessibility compliance, and server-side rendering logic). The MIT license and active maintenance (releases in 2026) reduce long-term risk.
  • Feature Roadmap:
    • Phase 1: Roll out to editorial teams for blog posts, documentation, or marketing pages where icons enhance readability (e.g., step indicators, alerts, or decorative accents).
    • Phase 2: Extend to internal tools (e.g., admin dashboards) to replace hardcoded icons in notifications or status cards, reducing CSS/JS dependencies.
    • Phase 3: Explore customizing the Heroicon set (e.g., adding brand-specific icons) by forking the package or building a wrapper layer.
  • Use Cases:
    • Content-heavy applications: CMS-driven sites (e.g., Laravel Nova/Forge) where editors need to embed icons without touching code.
    • Design system adoption: Projects using Heroicons (or similar SVG icon libraries) to ensure consistency across frontend and backend interfaces.
    • Accessibility compliance: Automatically generate ARIA labels for icons, reducing manual reviews during QA.
    • Localization: Support for 10+ languages in the picker modal aligns with global product teams.

When to Consider This Package

  • Adopt if:

    • Your product uses Filament v4/v5 and relies on the RichEditor for user-generated content (e.g., posts, docs, or admin panels).
    • You need scalable vector icons (Heroicons) with customizable styles/sizes/colors without SVG markup.
    • Accessibility is a priority, and you want to avoid manual ARIA label management for icons.
    • Your team lacks frontend resources to build a custom icon picker (or wants to avoid technical debt).
    • You’re already using Heroicons in your design system and want backend consistency.
  • Look elsewhere if:

    • You’re not using Filament (this is a Filament-specific plugin).
    • You need non-Heroicon SVGs (e.g., custom or third-party icon sets). Consider alternatives like:
    • Your content requires interactive icons (e.g., clickable tooltips or animations). This package focuses on static SVGs.
    • You’re on Filament v3 or earlier (incompatible).
    • Your use case demands real-time collaboration (e.g., Google Docs-style editing), as this is a client-side plugin.

How to Pitch It (Stakeholders)

For Executives/Business Leaders:

*"This package lets our content teams embed professional-grade icons (like Heroicons) directly into Filament’s editor—no coding required. It’s a 10-minute setup that:

  • Saves time: Editors add icons in seconds instead of waiting for devs.
  • Improves consistency: Uses our design system’s icons automatically, reducing visual errors.
  • Boosts accessibility: Icons get proper labels for screen readers, cutting QA time.
  • Low risk: MIT-licensed, actively maintained, and used in other Filament projects. For ~$0 cost, we can roll this out to [X teams] by [date], with ROI in faster content updates and fewer design system violations."

For Engineers/Tech Leads:

*"This is a drop-in plugin for Filament’s RichEditor that adds a Heroicon picker with:

  • Zero backend changes: Works with existing RichEditor fields.
  • Client-side magic: Uses TipTap’s extensibility to insert SVGs with data attributes (no manual HTML).
  • Configurable: Restrict icon styles/sizes, add ARIA labels, or customize translations.
  • Future-proof: Follows Filament’s plugin architecture—easy to fork or extend. Tradeoff: Tightly coupled to Heroicons (but we can scope this to internal use). Alternatives would require building a custom TipTap extension (~2–3 dev weeks)."*

For Design/Product Teams:

*"This solves two pain points:

  1. Icon consistency: Editors can now pick from our design system’s Heroicons (outline/solid/mini) instead of uploading random images or using inconsistent fonts.
  2. Effortless styling: Adjust size, color, and alignment in the editor—no CSS classes or dev handoffs. Example: Our blog team could add step indicators or alerts to tutorials without asking for dev support. We can also audit all icons for accessibility in one pass."*
Weaver

How can I help you explore Laravel packages today?

Conversation history is not saved when not logged in.
Prompt
Add packages to context
No packages found.
daikazu/eloquent-salesforce-objects
unseen-codes/chat
romalytar/yammi-jobs-monitoring-laravel
kisame76/filament-db-table-state
nqxcode/laravel-lucene-search
dpfx/laravel-livewire-wizards
workos/workos-php-laravel
sofa/laravel-global-scope
nawasara/auth-primitives
adhocrat-io/arkhe-main
make-dev/orca-harpoon
itsemon245/lamet
baks-dev/dashboard
amoifr/pickle-panther-bundle
make-dev/orca
dmstr/symfony-system-resources-bundle
dmstr/symfony-job-queue-bundle
dmstr/openapi-json-schema-bundle
dmstr/keycloak-security-bundle
dmstr/doctrine-audit-log-bundle