How to use the paraviewweb/src/Common/Misc/SelectionBuilder.range function in paraviewweb

interval: getBinRange(binList[i], histogram1DnumberOfBins, [
                paramRange[0],
                paramRange[1],
                paramRange[1] - paramRange[0],
              ]),
            });
          }
        }
        if (rangeList.length > 0) {
          proceed = true;
          vars[pName] = rangeList;
        }
      });

      if (proceed) {
        const selection = SelectionBuilder.range(vars);
        if (model.useAnnotation) {
          lastAnnotationPushed = model.provider.getAnnotation();
          if (
            !lastAnnotationPushed ||
            model.provider.shouldCreateNewAnnotation() ||
            lastAnnotationPushed.selection.type !== 'range'
          ) {
            lastAnnotationPushed = AnnotationBuilder.annotation(
              selection,
              [model.defaultScore],
              model.defaultWeight
            );
            if (lastAnnotationPushed.name === '') {
              // set default range annotation name
              AnnotationBuilder.setDefaultName(lastAnnotationPushed);
              if (model.provider.isA('AnnotationStoreProvider')) {

import 'normalize.css';

import React from 'react';
import ReactDOM from 'react-dom';

import SelectionEditorWidget from 'paraviewweb/src/React/Widgets/SelectionEditorWidget';
import SelectionBuilder from 'paraviewweb/src/Common/Misc/SelectionBuilder';
import LegendProvider from 'paraviewweb/src/InfoViz/Core/LegendProvider';

const rangeSelection = SelectionBuilder.range({
  pressure: [
    { interval: [0, 101.3], endpoints: 'oo', uncertainty: 15 },
    { interval: [200, 400], endpoints: '*o', uncertainty: 30 },
  ],
  temperature: [
    { interval: [233, Number.MAX_VALUE], endpoints: 'oo', uncertainty: 15 },
  ],
});

const partitionSelection = SelectionBuilder.partition('pressure', [
  { value: 90, uncertainty: 0 },
  { value: 101.3, uncertainty: 10 },
  { value: 200, uncertainty: 40, closeToLeft: true },
]);

const ranges = {

import React from 'react';
import ReactDOM from 'react-dom';

import AnnotationEditorWidget from 'paraviewweb/src/React/Widgets/AnnotationEditorWidget';
import SelectionBuilder from 'paraviewweb/src/Common/Misc/SelectionBuilder';
import AnnotationBuilder from 'paraviewweb/src/Common/Misc/AnnotationBuilder';
import LegendProvider from 'paraviewweb/src/InfoViz/Core/LegendProvider';

const scores = [
  { name: 'Yes', color: '#00C900', value: 100 },
  { name: 'Maybe', color: '#FFFF00', value: 0 },
  { name: 'No', color: '#C90000', value: -Number.MAX_VALUE },
];

const rangeSelection = SelectionBuilder.range({
  pressure: [
    { interval: [0, 101.3], endpoints: 'oo', uncertainty: 15 },
    { interval: [200, 400], endpoints: '*o', uncertainty: 30 },
  ],
  temperature: [
    { interval: [233, Number.MAX_VALUE], endpoints: 'oo', uncertainty: 15 },
  ],
});

const partitionSelection = SelectionBuilder.partition('pressure', [
  { value: 90, uncertainty: 0 },
  { value: 101.3, uncertainty: 10 },
  { value: 200, uncertainty: 40, closeToLeft: true },
]);

const ranges = {

getSelection() {
    if (!this.selection) {
      const vars = {};
      let selectionCount = 0;
      this.axes.forEach((axis) => {
        if (axis.hasSelection()) {
          vars[axis.name] = [].concat(axis.selections);
          selectionCount += 1;
        }
      });
      this.selection = selectionCount
        ? SelectionBuilder.range(vars)
        : SelectionBuilder.EMPTY_SELECTION;
    }

    return this.selection;
  }