Weave 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

Ckeditor Notification Bundle Laravel Package

stinger/ckeditor-notification-bundle

stinger/ckeditor-notification-bundle integrates CKEditor’s notification plugin into Symfony applications, providing configurable server-side services and Twig helpers to display toast, alert, and status messages in the editor and admin interface.

View on GitHub
Deep Wiki
Context7

Getting Started

First, the honest check: this is a Symfony2 bundle, not a Laravel package. There is no service provider, no config/ merge, no facade. It registers via AppKernel, ships an Extension/CompilerPass, and expects assets:install to dump files into web/bundles/stingerckeditornotification/. Composer-wise, composer require stinger/ckeditor-notification-bundle pulls constraints against symfony/symfony ~2.x and will conflict immediately with a modern Laravel app (symfony/* 6/7). Run composer require stinger/ckeditor-notification-bundle --dry-run once to confirm, then walk away from the Composer path.

What you actually want is the payload, not the bundle. The repo is a thin wrapper that vendors the CKEditor "Notification" plugin under Resources/public/. Clone it read-only and treat it as a vendored asset source:

git clone https://github.com/Stinger-Soft/CKEditorNotificationBundle /tmp/cknotif
ls /tmp/cknotif/Resources/public/plugins/   # this is the only directory that matters

Where to look first, in this order:

  1. Resources/public/plugins/notification/plugin.js — the actual editor.showNotification() implementation.
  2. Resources/public/plugins/notification/README.md (if present) — canonical extraPlugins and dialog/aggregator docs.
  3. DependencyInjection/Configuration.php and StingerCKEditorNotificationBundle.php — usually 10–20 lines of nothing; skim once so you can confidently say "no server-side behaviour here."
  4. The CKEditor version the plugin targets (the 2015 date implies CKEditor 4.4–4.5) — check plugin.js for CKEDITOR.plugins.add('notification', ...) and any CKEDITOR_VERSION-ish assumptions.

First use case: surface editor-side feedback without a page reload — "Draft saved", "Link could not be resolved", "Image exceeds 2 MB" — rendered as an in-editor toast anchored to the top of the editing area. That is the entire value proposition and it is worth ~30 lines of your own JS.

Minimal Laravel wiring:

cp -r /tmp/cknotif/Resources/public/plugins/notification resources/js/vendor/ckeditor/plugins/notification
// resources/js/editor.js
import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';

Stop — CKEditor 5 does not use this plugin. This plugin is CKEditor 4 (CKEDITOR.plugins.add). So either you are on CKEditor 4 (via ckeditor4 npm package or a static public/vendor/ckeditor), or you should be using CKEditor 5's built-in Notification UI plugin instead. Confirm which editor you ship before copying a single file.

For CKEditor 4:

{{-- resources/views/admin/_editor.blade.php --}}
<textarea name="body" id="body">{{ old('body', $post->body) }}</textarea>

@push('scripts')
<script src="{{ asset('vendor/ckeditor/ckeditor.js') }}"></script>
<script>
  CKEDITOR.replace('body', {
    extraPlugins: 'notification',
    customConfig: false,
  });
</script>
@endpush
// anywhere after instance creation
CKEDITOR.instances.body.showNotification('Draft saved', 'success');

Implementation Patterns

Pattern 1 — the thin Blade partial + a global registry. Do not repeat CKEDITOR.replace in twenty views. Create one partial that renders the textarea, one JS module that instantiates and stores instances by DOM id, and expose a helper.

// resources/js/ckeditor-notify.js
const instances = new Map();

export function boot(id, options = {}) {
  const editor = CKEDITOR.replace(id, {
    extraPlugins: 'notification',
    ...options,
  });
  instances.set(id, editor);
  return editor;
}

export function notify(id, message, type = 'info', progress) {
  instances.get(id)?.showNotification(message, type, progress);
}

export function notifyAll(message, type = 'info') {
  instances.forEach(e => e.showNotification(message, type));
}

The type argument accepts 'info' | 'warning' | 'success' | 'danger' and maps to cke_notification_<type> classes. Passing a fourth progress argument (0–100) renders a progress bar — useful for upload feedback.

Pattern 2 — bridge it to Laravel's session flash. The plugin has no server awareness, so push your flash bag into a JS array and replay it after boot. This is the single most useful integration and it replaces a lot of custom toast code.

<script>
  window.__editorNotices = @json(session()->pull('editor_notices', []));
</script>
boot('body');
(window.__editorNotices || []).forEach(n => notify('body', n.message, n.type));

Add a EditorNotice::push($message, $type) helper (a tiny class + a facade or just a session()->push wrapper) so controllers stay clean:

session()->push('editor_notices', ['message' => 'Body saved as draft.', 'type' => 'success']);

Pattern 3 — hook the plugin's own events rather than polling. Wrap expensive operations (image upload, paste, link validation) in editor.on('paste'|'fileUploadRequest'|'dialogShow', ...) and call showNotification from the handler. For CKEditor 4 file uploads specifically, editor.on('fileUploadResponse', evt => ...) gives you the server response — that is where a "Image rejected: 413" notice belongs.

Pattern 4 — Livewire / Inertia. With Livewire, re-boot on Livewire.hook('morph.updated') for the editor container, or better: keep the editor outside Livewire's morphing DOM with wire:ignore. Push notifications from the component via $this->dispatch('editor-notify', message: ..., type: ...) and listen with window.addEventListener('editor-notify', ...). With Inertia, boot in onMounted of the page component and destroy in onUnmounted — otherwise you leak a CKEditor instance per navigation.

Pattern 5 — config parity between environments. Keep CKEditor settings in config/editor.php (toolbar groups, extraPlugins, allowedContent, height) and emit them as a JSON blob into the Blade partial. This lets you disable the notification plugin in tests via config(['editor.plugins' => '']) without touching JS.

Pattern 6 — CI smoke test. One Dusk test that boots the editor and asserts a notice appears, so a CKEditor upgrade that breaks the plugin fails loudly:

public function test_editor_shows_notification()
{
    $this->browse(function (Browser $b) {
        $b->loginAs(User::factory()->create())
          ->visit('/admin/posts/create')
          ->waitFor('#cke_body')
          ->script("CKEDITOR.instances.body.showNotification('hello','success')");
        $b->waitFor('.cke_notification_success', 3)->assertSee('hello');
    });
}

Gotchas and Tips

Do not try to install it into Laravel. The bundle's composer.json will constrain against symfony/symfony ^2.x and/or PHP ^5.5. Modern Laravel requires PHP 8.1+ and Symfony 6/7 components; Composer will either fail resolution or (worse) succeed on a stale lockfile and drag ancient packages in. There is no Laravel service provider, so even a successful install leaves you with nothing autoloaded.

Abandoned since 2015 with 1 star and 0 dependents is a maintenance signal, not a quality signal. The plugin itself is fine — CKEditor 4's Notification plugin is stable, and "stable" here also means "nobody has touched it in a decade." Verify the vendored copy hasn't drifted from the upstream CKEditor plugin distribution before you bless it. If you are on CKEditor 5, this entire package is irrelevant: use the official Notification plugin (@ckeditor/ckeditor5-notification), which is a different API (editor.plugins.get('Notification')) and already part of most builds.

The plugin is inert until extraPlugins: 'notification' is set. This is the number one failure mode: files are copied, showNotification throws is not a function, and everything looks fine otherwise. If you also set customConfig, the plugin list in your external config file can silently override the inline one. Either drop customConfig or add the plugin there too.

showNotification is fire-and-forget — there is no callback, no promise, and no dismiss handler in the public API. Notifications auto-hide after a fixed duration (roughly 5 seconds, and it is not configurable through the public API). If you need sticky, closable, or queued messages, you are writing custom code against internal CKEDITOR.plugins.notification aggregator objects. Don't. For anything richer than a toast, render a normal Laravel component outside the editor.

Notifications are scoped to the editor instance and die with it. If you CKEDITOR.instances.body.destroy() on a tab switch, any pending notices vanish; conversely, destroying an instance while a notification is mid-animation can leave orphaned cke_notification_* DOM nodes in the page if the destroy happens outside the plugin's own teardown. Cheap guard: editor.on('destroy', ...) and clear the timer yourself, or just avoid destroying editors you will immediately re-create.

CSS is not self-contained. The plugin expects cke_notification_* styles; if you're not loading a stock CKEditor 4 skin (moono/office2013), notifications render as unstyled divs stacked at the top-left. Either include the skin CSS or add ~20 lines of your own — and if you add your own, prefer a scoped class so it doesn't collide with your app's toast library (SweetAlert, Filament, etc.).

Type strings are strict and case-sensitive. 'error' and 'Error' fall back to the default 'info' styling with no console warning. Normalize Laravel flash levels ('error' → 'danger') in one place.

CSP and SRI will bite you. The bundle-era docs assume script tags copied to web/; if you run a strict script-src policy or use Vite, hand-managing public/vendor/ckeditor/plugins/notification/plugin.js means the plugin won't be fingerprinted or cache-busted. Copy it through the build (a vite-plugin-static-copy entry or a small copyFile step) so upgrades invalidate the hash properly.

Debugging trick: if a notification "doesn't appear," check editor.getData() first. Calling showNotification before the instance fires instanceReady is the cause more often than anything else — instanceReady is your safe hook, and CKEDITOR.instances[id] is undefined before replace() returns.

Extension point, since there is no Laravel-native one: treat the vendored plugin folder as a fork you own. Patch plugin.js (or better, wrap showNotification in your own module and leave the vendor file pristine) if you need configurable durations — a wrapper gives you the upgrade path when you eventually migrate to CKEditor 5 and its native notifications.

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.
socialdept/tenant-domains
tautvydasr/blade-class-names
socialdept/color-scales
maherelgamil/controller
coleus/widgets
coleus/table
coleus/users
coleus/music
coleus/health
coleus/calendar
coleus/notes
coleus/support
coleus/settings
coleus/apps
seampact/laravel
emmyconceptng/laravel-ng-postcode
jjsquady/round-robin
skyraptor/chatter
edlugz/sasapay
abbasudo/artisan-route