PHPackages                             dudelisius/livewire-tiptap - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. dudelisius/livewire-tiptap

ActiveLibrary[Utility & Helpers](/categories/utility)

dudelisius/livewire-tiptap
==========================

Easily integrate the Tiptap editor into your livewire projects

v0.1.0-alpha.4(10mo ago)18[6 PRs](https://github.com/dudelisius/livewire-tiptap/pulls)MITPHPPHP ^8.3CI passing

Since Jun 25Pushed 1mo agoCompare

[ Source](https://github.com/dudelisius/livewire-tiptap)[ Packagist](https://packagist.org/packages/dudelisius/livewire-tiptap)[ Docs](https://github.com/dudelisius/livewire-tiptap)[ GitHub Sponsors](https://github.com/:vendor_name)[ RSS](/packages/dudelisius-livewire-tiptap/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (4)Dependencies (16)Versions (16)Used By (0)

Livewire Tiptap Editor
======================

[](#livewire-tiptap-editor)

[![Latest Version on Packagist](https://camo.githubusercontent.com/2ebd72dfc3a0303f982574188ab977c726c711bd10c31a0eedf700851686f0c8/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f647564656c69736975732f6c697665776972652d7469707461702e7376673f7374796c653d666c61742d73717561726526696e636c7564655f70726572656c6561736573)](https://packagist.org/packages/dudelisius/livewire-tiptap)[![Tests Passing](https://camo.githubusercontent.com/3b3053802417a83aafff29301699e01dc11c3f43e796de5bc728362f2b5a5353/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f647564656c69736975732f6c697665776972652d7469707461702f72756e2d74657374732e796d6c3f6272616e63683d6d61696e266c6162656c3d7465737473267374796c653d666c61742d737175617265)](https://github.com/dudelisius/livewire-tiptap/actions?query=workflow%3Arun-tests+branch%3Amain)[![Code Style](https://camo.githubusercontent.com/5aa888a901cbe3d944b7f98a694c8c1de99b2782b530136f7c751b70c2df8efb/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f647564656c69736975732f6c697665776972652d7469707461702f6669782d7068702d636f64652d7374796c652d6973737565732e796d6c3f6272616e63683d6d61696e266c6162656c3d636f64652532307374796c65267374796c653d666c61742d737175617265)](https://github.com/dudelisius/livewire-tiptap/actions?query=workflow%3A%22Fix+PHP+code+style+issues%22+branch%3Amain)[![Downloads](https://camo.githubusercontent.com/da66b02ec3fd980d243d84fb7745d1d6c5decefece114695eca390155cb884f6/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f647564656c69736975732f6c697665776972652d7469707461702e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/dudelisius/livewire-tiptap)

Easily integrate the Tiptap rich-text editor into your Laravel Livewire projects, with full customization, dropdowns, and translation support.

---

📋 Prerequisites
---------------

[](#-prerequisites)

Livewire Tiptap requires the following before installing:

- **PHP** ≥ 8.3
- **Laravel** ≥ 11.x
- **Livewire** ≥ 3.6

---

🚀 Installation
--------------

[](#-installation)

```
composer require dudelisius/livewire-tiptap:"0.1.0-alpha.3"
```

Optional; publish the assets, views, and config:

```
php artisan vendor:publish --tag=livewire-tiptap-config
php artisan vendor:publish --tag=livewire-tiptap-views
php artisan vendor:publish --tag=livewire-tiptap-assets
```

---

⚙️ Configuration
----------------

[](#️-configuration)

All settings live in `config/livewire-tiptap.php`. The defaults are opinionated but sensible. You can override:

- **`toolbar`**: list of tokens, separators (`|`), spacers (`~`), or dropdown groups (`[...]`).
- **`use_default_classes`**: turn the built-in Tailwind classes on/off.
- **`classes`**: define your own class names or target elements via fallback keys.
- **`icons`**: map tokens to Blade component aliases (Tabler, Heroicons, or your own SVG).
- **`buttons`**: configure per-button icon, label, etc.
- **`extensions`**: pass through Tiptap extension options (e.g. Link). See for example the [Tiptap Link docs](https://tiptap.dev/docs/extensions/marks/link).

---

🎨 Usage
-------

[](#-usage)

Include the styles & scripts in your layout:

```
@livewireTiptapStyles
@livewireStyles

@livewireScripts
@livewireTiptapScripts
```

---

🛠 The Toolbar
-------------

[](#-the-toolbar)

The toolbar lets users style content. You can configure it in several ways:

### Simple Buttons

[](#simple-buttons)

Just add the token for each extension:

```
'toolbar' => 'bold italic underline strike'
```

### Separator

[](#separator)

Group buttons with a vertical bar:

```
'toolbar' => 'bold italic | underline strike'
```

### Spacer

[](#spacer)

Push later buttons to the right:

```
'toolbar' => 'bold italic ~ undo redo'
```

### Dropdown Groups

[](#dropdown-groups)

Group options in a dropdown by wrapping tokens in `[...]`. The dropdown shows the first icon by default, and updates to reflect the active formatting.

```
'toolbar' => '[paragraph heading-1 heading-2 heading-3] | bold italic'
```

### Per-Component Override

[](#per-component-override)

Override the toolbar when rendering:

```

```

---

🎨 Styling
---------

[](#-styling)

All default classes use Tailwind and live in the config under `classes`. If you prefer your own CSS, either customize each key or disable defaults:

```
'use_default_classes' => false,
```

---

🔧 Advanced
----------

[](#-advanced)

### Extension Overrides

[](#extension-overrides)

Pass extension options at render time:

```

```

Or edit them in your published config:

```
'extensions' => [
    'link' => [
        'autolink' => false,
        // …
    ],
],
```

### Supported Extensions

[](#supported-extensions)

- paragraph
- heading-1
- heading-2
- heading-3
- heading-4
- heading-5
- heading-6
- bold
- italic
- underline
- strike
- blockquotes
- code
- highlight
- hardBreak
- horizontalRule
- bulletList
- orderedList
- subscript
- superscript
- emojis
- [link](https://tiptap.dev/docs/extensions/marks/link)
- unlink
- undo
- red

More coming soon!

---

🌐 Translations
--------------

[](#-translations)

This package ships with English, Dutch, French, and Spanish translations. To add your own, submit a PR or drop a file into:

```
resources/lang/livewire-tiptap/{locale}.php

```

---

🤝 Contributing & Testing
----------------------------

[](#-contributing--testing)

PRs are very welcome! Please run the full QA suite before submitting:

```
composer qa
```

---

📈 Roadmap
---------

[](#-roadmap)

- Additional Tiptap extensions (blockquote, image, tables, etc.)
- Image uploads & drag-drop support
- Autosave & Ctrl+S handling
- Bubble menus & tooltips
- Improved documentation & examples
- First stable (1.0) release

###  Health Score

37

—

LowBetter than 82% of packages

Maintenance81

Actively maintained with recent releases

Popularity6

Limited adoption so far

Community9

Small or concentrated contributor base

Maturity45

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 83.3% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~6 days

Total

3

Last Release

306d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/0f1bd21636d2054899e3a05bc6bda8e0dd130a6ecbc16e032915b92134946689?d=identicon)[dudelisius](/maintainers/dudelisius)

---

Top Contributors

[![dudelisius](https://avatars.githubusercontent.com/u/394451?v=4)](https://github.com/dudelisius "dudelisius (10 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (1 commits)")[![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?v=4)](https://github.com/github-actions[bot] "github-actions[bot] (1 commits)")

---

Tags

laraveldudelisiuslivewire-tiptap

###  Code Quality

TestsPest

Static AnalysisPHPStan, Psalm

Code StyleLaravel Pint

Type Coverage Yes

### Embed Badge

![Health badge](/badges/dudelisius-livewire-tiptap/health.svg)

```
[![Health](https://phpackages.com/badges/dudelisius-livewire-tiptap/health.svg)](https://phpackages.com/packages/dudelisius-livewire-tiptap)
```

###  Alternatives

[leandrocfe/filament-apex-charts

Apex Charts integration for Filament PHP.

4861.2M8](/packages/leandrocfe-filament-apex-charts)[spatie/laravel-livewire-wizard

Build wizards using Livewire

4061.0M4](/packages/spatie-laravel-livewire-wizard)[ralphjsmit/livewire-urls

Get the previous and current url in Livewire.

82270.3k4](/packages/ralphjsmit-livewire-urls)[worksome/exchange

Check Exchange Rates for any currency in Laravel.

123544.7k](/packages/worksome-exchange)[hydrat/filament-table-layout-toggle

Filament plugin adding a toggle button to tables, allowing user to switch between Grid and Table layouts.

6292.3k1](/packages/hydrat-filament-table-layout-toggle)[codebar-ag/laravel-filament-json-field

A Laravel Filament JSON Field integration with CodeMirror support

1124.1k](/packages/codebar-ag-laravel-filament-json-field)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)