How to use the @jupyter-widgets/base.ViewList function in @jupyter-widgets/base

figure_scale_promise.then(function() {
            that.mark_views = new widgets.ViewList(that.add_mark, that.remove_mark, that);
            that.mark_views.update(that.model.get("marks"));
            Promise.all(that.mark_views.views).then(function(views) {
                that.replace_dummy_nodes(views);
                that.update_marks(views);
                that.update_legend();
                // Update Interaction layer
                // This has to be done after the marks are created
                that.set_interaction(that.model.get("interaction"));
            });

            that.axis_views = new widgets.ViewList(that.add_axis, null, that);
            that.axis_views.update(that.model.get("axes"));

            // TODO: move to the model
            that.model.on_some_change(["fig_margin", "min_aspect_ration", "max_aspect_ratio"], that.relayout, that);
            that.model.on_some_change(["padding_x", "padding_y"], function() {
                this.figure_padding_x = this.model.get("padding_x");
                this.figure_padding_y = this.model.get("padding_y");
                this.trigger("margin_updated");
            }, that);
            that.model.on("change:axes", function(model, value, options) {
                this.axis_views.update(value);
            }, that);
            that.model.on("change:marks", function(model, value, options) {
                this.mark_views.update(value);
                Promise.all(this.mark_views.views).then(function(views) {
                    that.replace_dummy_nodes(views);

render() {
        this.loadConfiguration();
        this.el.style["width"] = this.model.get("width");
        this.el.style["height"] = this.model.get("height");

        this.layerViews = new widgets.ViewList(this.addLayerModel, null, this);
        this.modelEvents() ;

        this.on("displayed", () => {
            GoogleMapsLoader.load((google) => {
                this.map = new google.maps.Map(this.el) ;

                this.layerViews.update(this.model.get("layers"));

                // hack to force the map to redraw
                setTimeout(() => {
                    google.maps.event.trigger(this.map, 'resize');
                    this.setViewport(this.model.get('initial_viewport'));
                }, 500);
            })
        })
    }

initialize(parameters: any) {
        super.initialize(parameters);
        this.children_views = new ViewList(this.add_child_model, null, this);
        this.listenTo(this.model, 'change:children', this.update_children);
        this.listenTo(this.model, 'change:box_style', this.update_box_style);

        this.pWidget.addClass('jupyter-widgets');
        this.pWidget.addClass('widget-container');
        this.pWidget.addClass('widget-box');
    }

initialize(parameters) {
        super.initialize(parameters);

        this.button_views = new ViewList(this.add_button, null, this);
        this.listenTo(this.model, 'change:buttons', function(model, value) {
            this.button_views.update(value);
        });

        this.axis_views = new ViewList(this.add_axis, null, this);
        this.listenTo(this.model, 'change:axes', function(model, value) {
            this.axis_views.update(value);
        });

        this.listenTo(this.model, 'change:name', this.update_label);
    }

render() {
        this.features = new widgets.ViewList(
            this.addFeature,
            this.removeFeature,
            this
        );
        this.features.update(this.model.get('features'));
        this.model.on('change:features', () => {
            this.features.update(this.model.get('features')).then(features => {
                if (this._clickHandler) {
                    this._clickHandler.onNewFeatures(features);
                }
            });
        });
        this.model.store.addListener(() => {
            this._onNewMode();
        });
        this._clickHandler = null;

initialize(parameters: any) {
        super.initialize(parameters);
        this.childrenViews = new ViewList(
            this.addChildView,
            (view) => {view.remove();},
            this
        );
        this.listenTo(this.model, 'change:children', () => this.updateTabs());
        this.listenTo(this.model, 'change:_titles', () => this.updateTitles());
    }

initialize: function (parameters) {
        BlockView.__super__.initialize.apply(this, arguments);
        this.scene_view = this.options.scene_view;
        this.parent_view = this.options.parent_view;

        this.block_views = new widgets.ViewList(this.add_block, this.remove_block, this);
    },

initialize: function (parameters) {
        SceneView.__super__.initialize.apply(this, arguments);

        this.datablock_views = new widgets.ViewList(this.add_block, this.remove_block, this);
    },

initialize(parameters){
        super.initialize(parameters)
        this.children_views = new ViewList(this.add_child_view, this.remove_child_view, this);
        this.listenTo(this.model, 'change:children', () => this.updateChildren());
        this.listenTo(this.model, 'change:selected_index', () => this.update_selected_index());
        this.listenTo(this.model, 'change:_titles', () => this.update_titles());
    }

scale_creation_promise.then(function() {
            that.create_listeners();
            that.axis_views = new widgets.ViewList(that.add_axis, null, that);
            that.axis_views.update(that.model.get("axes"));
            that.model.on("change:axes", function(model, value, options) {
                that.axis_views.update(value);
            });
        });
        this.displayed.then(function() {