How to use the ve-range-utils.convertRangeTo1Based function in ve-range-utils

record.locations.map((loc, i) => {
              const base1Range = convertRangeTo1Based(loc);
              return (
                <span>
                  ({base1Range.start}-{base1Range.end})
                </span>
              );
            })
          ) : (

export function showAddOrEditFeatureDialog(annotation, { editorName }) {
  return {
    type: "TG_SHOW_MODAL",
    name: "AddOrEditFeatureDialog", //you'll need to pass a unique dialogName prop to the compoennt
    props: {
      editorName: editorName,
      dialogProps: {
        title: annotation && annotation.id ? "Edit Feature" : "New Feature"
      },
      initialValues: {
        ...(annotation
          ? {
              ...convertRangeTo1Based(annotation),
              ...(annotation.locations && {
                locations: annotation.locations.map(convertRangeTo1Based)
              })
            }
          : {})
      }
    }
  };
}
export function showAddOrEditPartDialog(annotation, { editorName }) {

render: (val, record) => {
                  const base1Range = convertRangeTo1Based(record);
                  return (
                    <span>
                      {val}{" "}
                      <span style="{{">
                        ({base1Range.start}-{base1Range.end})
                      </span>
                    </span>
                  );
                }
              },

export function showAddOrEditPartDialog(annotation, { editorName }) {
  return {
    type: "TG_SHOW_MODAL",
    name: "AddOrEditPartDialog", //you'll need to pass a unique dialogName prop to the compoennt
    props: {
      editorName: editorName,
      dialogProps: {
        title: annotation && annotation.id ? "Edit Part" : "New Part"
      },
      initialValues: annotation
        ? {
            ...convertRangeTo1Based(annotation)
          }
        : {}
    }
  };
}
export function showPrintDialog() {

export function showAddOrEditPrimerDialog(annotation, { editorName }) {
  return {
    type: "TG_SHOW_MODAL",
    name: "AddOrEditPrimerDialog", //you'll need to pass a unique dialogName prop to the compoennt
    props: {
      editorName: editorName,
      dialogProps: {
        title: annotation && annotation.id ? "Edit Primer" : "New Primer"
      },
      initialValues: annotation
        ? {
            ...convertRangeTo1Based(annotation)
          }
        : {}
    }
  };
}
export function showMergeFeaturesDialog(annotation, { editorName }) {

render: (val, record) => {
        const base1Range = convertRangeTo1Based(record);
        return (
          <span>
            ({base1Range.start}-{base1Range.end})
          </span>
        );
      }
    },

render: (val, _record, i, props) => {
    const record = props.isProtein
      ? convertDnaCaretPositionOrRangeToAA(_record)
      : _record;
    const base1Range = convertRangeTo1Based(record);
    const hasJoinedLocations = record.locations && record.locations.length > 1;

    return (
      <span>
        {props.isProtein ? Math.floor(val / 3) : val}{" "}
        <span style="{{">
          {hasJoinedLocations ? (
            record.locations.map((loc, i) =&gt; {
              const base1Range = convertRangeTo1Based(loc);
              return (
                <span>
                  ({base1Range.start}-{base1Range.end})
                </span>
              );
            })
          ) : (</span></span>