I have added a custom slider element in the formBuilder. The code is as below:

var fields = [{
    label: 'Rating',
    attrs: {
      type: 'slider'
    },
    icon: '🌟'
  }];

  var templates = {
    slider: function(fieldData) {
      return {
        field: '<input type="range" min="0" max="10">'
      }
    }
  };

  $(container).formBuilder({
    templates,
    fields
  });

The JSON data it generates is as below:

[
  {
    "type": "slider",
    "required": false,
    "label": "Rating",
    "name": "slider-1643115075076-0",
    "access": false
  }
]

But when I pass this data to formRender method on my app I am getting the following error:

Error: Invalid control type. (Type: slider, Subtype: undefined). Please ensure you have registered it, and imported it correctly.

How do I register this new element such that it appears on my app?