Customizable Toolbar & Context Menus API

[ragulpalanisamy]

Version

Latest version (using the current release)

Development Environment

Tested on Chrome on Windows 10 (should apply to all supported browsers)

Current Behavior

The TUI Image Editor currently renders a fixed toolbar and context menu with items such as Zoom In/Out, History, Hand, Delete, and Delete All. There’s no built-in option to remove or rearrange these items, forcing developers to implement custom workarounds.

// Example: Default initialization with fixed toolbar and submenu items
const imageEditor = new tui.ImageEditor(document.getElementById('editor-container'), {
  includeUI: {
    loadImage: { path: 'sample.jpg', name: 'Sample' },
    theme: {},
    initMenu: 'filter',
    menuBarPosition: 'bottom'
  },
  cssMaxWidth: 700,
  cssMaxHeight: 500,
});

Expected Behavior:

Introduce a built-in API that allows developers to easily enable, disable, and reorder toolbar and context menu items. This enhancement would offer greater UI customization without the need for unofficial hacks, while preserving backward compatibility.

Additional Information:

If further assistance is needed or if there's an opportunity to collaborate on this feature, please ping me. I'm happy to contribute and help improve the editor!