@ckeditor/ckeditor5-utils
Advanced tools
@ckeditor/ckeditor5-utils is a utility library for CKEditor 5 that provides a variety of helper functions and classes to facilitate common tasks such as DOM manipulation, event handling, and data structures.
Event Handling
The EmitterMixin class allows you to add event handling capabilities to your classes. In this example, we create a class that extends EmitterMixin, instantiate it, and then set up an event listener for 'myEvent'. When 'myEvent' is fired, the listener logs a message to the console.
const { EmitterMixin } = require('@ckeditor/ckeditor5-utils');
class MyClass extends EmitterMixin() {}
const myInstance = new MyClass();
myInstance.on('myEvent', () => {
console.log('myEvent was fired!');
});
myInstance.fire('myEvent');DOM Manipulation
The createElement function simplifies the process of creating and configuring DOM elements. In this example, we create a <div> element with a class and id, and then append it to the document body.
const { createElement } = require('@ckeditor/ckeditor5-utils');
const div = createElement(document, 'div', {
class: 'my-class',
id: 'my-id'
});
document.body.appendChild(div);Data Structures
The Collection class provides a way to manage a collection of items. In this example, we create a new collection, add items to it, and then retrieve an item by its id.
const { Collection } = require('@ckeditor/ckeditor5-utils');
const collection = new Collection();
collection.add({ id: 1, name: 'Item 1' });
collection.add({ id: 2, name: 'Item 2' });
console.log(collection.get(1)); // { id: 1, name: 'Item 1' }Lodash is a popular utility library that provides a wide range of functions for common programming tasks such as manipulating arrays, objects, and strings. Compared to @ckeditor/ckeditor5-utils, Lodash offers a broader set of utilities but does not include CKEditor-specific features like event handling and DOM manipulation.
jQuery is a fast, small, and feature-rich JavaScript library that simplifies HTML document traversal and manipulation, event handling, and animation. While jQuery offers powerful DOM manipulation and event handling capabilities similar to @ckeditor/ckeditor5-utils, it is a larger library and includes many features that may not be necessary for all projects.
EventEmitter3 is a high-performance event emitter for Node.js and the browser. It provides a simple and efficient way to handle events, similar to the EmitterMixin in @ckeditor/ckeditor5-utils. However, EventEmitter3 focuses solely on event handling and does not include other utilities like DOM manipulation or data structures.
Various utilities used by CKEditor 5 and its features. This is a sort of CKEditor 5's standard library.
This plugin is part of the ckeditor5 package. Install the whole package to use it.
npm install ckeditor5
If you want to check full CKEditor 5 capabilities, sign up for a free non-commitment 14-day trial.
See the @ckeditor/ckeditor5-utils package page in CKEditor 5 documentation.
Licensed under a dual-license model, this software is available under:
For more information, see: https://ckeditor.com/legal/ckeditor-licensing-options.
44.3.0 (March 5, 2025)
We are happy to announce the release of CKEditor 5 v44.3.0.
This release brings a couple of minor improvements and bug fixes:
rel attribute. The fix happened so deep in the engine that we improved the overall performance of the editor slightly as well.EmptyBlock plugin: From now on, new plugin prevents adding to the output data of blocks, works similarly to the fillEmptyBlocks configuration in CKEditor 4.<hr> element in the General HTML Support plugin enhanced: attributes of the <hr> element are now properly preserved if configuration allows it.For more details, see the changelog below.
ViewConsumable.consumablesFromElement() is removed and replaced with the view.Element#_getConsumables() internal method. You should use ViewConsumable.createFrom() to create consumables if needed.ViewElementConsumables now accepts and outputs only normalized data. The ViewConsumable still accepts normalized or non-normalized input.Matcher#match() and Matcher#matchAll() output is now normalized. The MatchResult#match now contains normalized data compatible with changes in the ViewConsumable.SchemaContext class from package. Closes https://github.com/ckeditor/ckeditor5/issues/18003. (commit)<hr> element. Closes #12973. (commit)EmptyBlock plugin that prevents adding to output data. (commit)[rel] attribute will now allow mixing manual link decorators for the same attribute, as it will be now handled as a token list. Closes #13985, Closes #6436. (commit)<span> when GHS is enabled. Closes #15329. (commit)viewToPlainText() function. Closes #17950. (commit)config.users.getInitialsCallback. It allows providing a custom callback function for user initials generation.emoji.useCustomFont option to disable the filtering mechanism. Closes #18029. (commit) ) are ignored while loading editor data. (commit)Check out the Versioning policy guide for more information.
<details> <summary>Released packages (summary)</summary>Minor releases (contain minor breaking changes):
Releases containing new features:
Other releases:
FAQs
Miscellaneous utilities used by CKEditor 5.
The npm package @ckeditor/ckeditor5-utils receives a total of 784,478 weekly downloads. As such, @ckeditor/ckeditor5-utils popularity was classified as popular.
We found that @ckeditor/ckeditor5-utils demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
TypeScript is porting its compiler to Go, delivering 10x faster builds, lower memory usage, and improved editor performance for a smoother developer experience.
Research
Security News
The Socket Research Team has discovered six new malicious npm packages linked to North Korea’s Lazarus Group, designed to steal credentials and deploy backdoors.
Security News
Socket CEO Feross Aboukhadijeh discusses the open web, open source security, and how Socket tackles software supply chain attacks on The Pair Program podcast.