Be able to filter palette entries

I was able to successfully create a custom task to the palette but now after adding the customized elements to the palette I’ll like to delete a few of the default elements. I’m not too sure on how to do this without errors. Here is the code for my palette provider below. I saw I can use a return function but I’m not really sure how to apply that to my current palette provider code. Thanks.

export default function DCRPaletteProvider(
    palette, create, elementFactory, 
    translate) {

    this._create = create;
    this._elementFactory = elementFactory;
    this._translate = translate;


DCRPaletteProvider.$inject = [


DCRPaletteProvider.prototype.getPaletteEntries = function(element) {

    var elementFactory = this._elementFactory,
        create = this._create,
        translate = this._translate,
        actions = {};

    function createAction(type, group, className, title, options) {

        function createListener(event) {

            var shape = elementFactory.createShape(assign({type: type}, options));

            if (options) {
                shape.businessObject.di.isExpanded = options.isExpanded;

            create.start(event, shape);

        //var shortType = type.replace(/^bpmn:/, '');
        //var shortType = type.replace(/^dcr\:/, '');

        return {
            group: group,
            className: className,
            title: title , //|| 'Create ' + shortType,
            action: {
                dragstart: createListener,
                click: createListener

    assign (actions, {

        'create.dcr-task': createAction(
            'dcr:DcrTask', 'activity', 'bpmn-icon-trash', 
            translate('Create DcrTask')

    return actions;

after adding the customized elements to the palette I’ll like to delete a few of the default elements.

The palette supports two styles of palette providers:

Option 1: Your provider returns additional entries

class AddPaletteEntriesProvider {
  getPaletteEntries(element) {
    return {
      additionalElement: ...

Option 2: Your palette provider returns a middleware

That middleware receives the existing palette entries and can filter them:

class ChangePaletteEntriesProvider {
  getPaletteEntries(element) {
    return (existingEntries) => {
      // return new entries, that can be
      // an empty object to clear
      // existing entries + additional keys
      // existing entries with keys removed
      return {};

To accomplish filtering you’d implement option two.

I’m not sure I understand how the second option was implemented. Any example on this will be helpful.

Instead of returning additional entries you return a function that takes the existing entries and returns updated entries. I explicitly provided an example for that; not sure what else can help you.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.