question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TinyMCE 5 Preview: Create new UI controls by extending existing ones

See original GitHub issue

In Tinymce 4.x it is possible to create new UI controls by extending existing controls, eg:

var DataList = tinymce.ui.ComboBox.extend({
    init: function() {
         this._super();
    },
    value: function(value) {
        this._super(value);
    }
});
tinymce.ui.Factory.add('DataList', DataList);

but this does not appear to be possible in Tinymce 5, as the UI controls are not exposed in the API.

Is there another way this is done in Tinymce 5?

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:2
  • Comments:17 (12 by maintainers)

github_iconTop GitHub Comments

1reaction
ryandemmercommented, Oct 4, 2018

You’re right, the intention of the new UI is that controls are not exposed in the API directly.

The aim is to provide flexible components that don’t need to be extended, making it easier to create dialogs that adjust to the active skin

That makes the UI less useful, as it restricts developers to the rather limited set of controls that you create an maintain, which are suitable for only simple dialogs. It also prevents developers from creating new controls for the toolbar, or adding features to existing ones.

Can you tell us more about why you need to extend controls?

Quite simply because the UI, in its present form and in Tinymce 5, does not provide the controls I require to accomplish the tasks that I need them to. Over quite a long period of time, I have created and tested a number of controls to suit my purposes.

Here is an example of some of the controls I have created in use:

JCE custom controls example

0reactions
mdgilenecommented, Sep 9, 2021

Is this issue dead? Seems like custom UI components is a massive missing feature here. This holds back developing advanced plugins with complex UIs.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Customizing the editor UI | Docs - TinyMCE
This section is about customizing TinyMCE's user interface with skins, toolbar buttons, and manipulating the status bar.
Read more >
User interface options | Docs - TinyMCE
Configure the editor's appearance, including menu and toolbar controls.
Read more >
Work with plugins to extend TinyMCE | Docs
TinyMCE is an incredibly powerful, flexible and customizable rich text editor. This section demonstrates the power of plugins with several working examples.
Read more >
Migrating from TinyMCE 4 to TinyMCE 5. | Docs
All TinyMCE 4 API methods for creating UI components have been removed. New methods have been added for TinyMCE 5. For information on...
Read more >
Work with plugins to extend TinyMCE
Click it and voila, you can now edit the HTML hidden by the WYSIWYG interface. Let's also add a toolbar control so that...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found