Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@ckeditor/ckeditor5-ui

Package Overview
Dependencies
Maintainers
1
Versions
762
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@ckeditor/ckeditor5-ui

The UI framework and standard UI library of CKEditor 5.

  • 0.0.0-nightly-20241213.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
940K
increased by14.86%
Maintainers
1
Weekly downloads
 
Created

What is @ckeditor/ckeditor5-ui?

@ckeditor/ckeditor5-ui is a package that provides a set of UI components and utilities for building rich text editors using CKEditor 5. It includes various UI elements like buttons, dropdowns, toolbars, and more, which can be customized and extended to create a tailored editing experience.

What are @ckeditor/ckeditor5-ui's main functionalities?

Button

This code demonstrates how to create a simple button using the ButtonView class from @ckeditor/ckeditor5-ui. The button is labeled 'Click me' and is appended to the document body.

const ButtonView = require('@ckeditor/ckeditor5-ui').ButtonView;
const button = new ButtonView();
button.set({
  label: 'Click me',
  withText: true
});
button.render();
document.body.appendChild(button.element);

Toolbar

This code shows how to create a toolbar and add a button to it using the ToolbarView class from @ckeditor/ckeditor5-ui. The toolbar is then rendered and appended to the document body.

const ToolbarView = require('@ckeditor/ckeditor5-ui').ToolbarView;
const toolbar = new ToolbarView();
toolbar.items.add(button); // Assuming 'button' is a ButtonView instance
toolbar.render();
document.body.appendChild(toolbar.element);

Dropdown

This code demonstrates how to create a dropdown menu using the DropdownView class from @ckeditor/ckeditor5-ui. The dropdown button is labeled 'Options' and is appended to the document body.

const DropdownView = require('@ckeditor/ckeditor5-ui').DropdownView;
const dropdown = new DropdownView();
dropdown.buttonView.set({
  label: 'Options',
  withText: true
});
dropdown.render();
document.body.appendChild(dropdown.element);

Other packages similar to @ckeditor/ckeditor5-ui

Keywords

FAQs

Package last updated on 13 Dec 2024

Did you know?

Socket

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.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc