How to use the @ckeditor/ckeditor5-engine/src/view/range function in @ckeditor/ckeditor5-engine

for ( let range of newSelection.getRanges() ) {
				const start = range.start;
				const end = range.end;
				const startWidget = getWidgetAncestor( start.parent );
				const endWidget = getWidgetAncestor( end.parent );

				// Whole range is placed inside widget - put selection around that widget.
				if ( startWidget !== null && startWidget == endWidget ) {
					newRanges.push( ViewRange.createOn( startWidget ) );

					continue;
				}

				// Range start is placed inside the widget - start selection after the widget.
				if ( startWidget !== null ) {
					newRanges.push( new ViewRange( ViewPosition.createAfter( startWidget ), end ) );

					continue;
				}

				// Range end is placed inside widget - end selection before the widget.
				if ( endWidget !== null ) {
					newRanges.push( new ViewRange( start, ViewPosition.createBefore( endWidget ) ) );

					continue;
				}

				newRanges.push( range );
			}

			if ( newRanges.length ) {
				newSelection.setRanges( newRanges, newSelection.isBackward );

if ( startWidget !== null && startWidget == endWidget ) {
					newRanges.push( ViewRange.createOn( startWidget ) );

					continue;
				}

				// Range start is placed inside the widget - start selection after the widget.
				if ( startWidget !== null ) {
					newRanges.push( new ViewRange( ViewPosition.createAfter( startWidget ), end ) );

					continue;
				}

				// Range end is placed inside widget - end selection before the widget.
				if ( endWidget !== null ) {
					newRanges.push( new ViewRange( start, ViewPosition.createBefore( endWidget ) ) );

					continue;
				}

				newRanges.push( range );
			}

			if ( newRanges.length ) {
				newSelection.setRanges( newRanges, newSelection.isBackward );
			}
		}, { priority: 'high' } );
	}

}

	const start = findMarkPos(view, position, MATHCONFIG.STARTMARKS, false);
	const end   = findMarkPos(view, position, MATHCONFIG.ENDMARKS,   true);

	if (start.pos !== null && end.pos !== null){
		const closerEnd = findMarkPos(view, position, MATHCONFIG.ENDMARKS, false);
		if (closerEnd.pos!==null){
			if (closerEnd.pos.isAfter(start.pos)) return out; //not valid
		}
		const closerStart = findMarkPos(view, position, MATHCONFIG.STARTMARKS, true);
		if (closerStart.pos!==null){
			if (closerStart.pos.isBefore(end.pos)) return out; //not valid
		}
		if (start.mark===end.mark){
			out.range = new ViewRange(start.pos, end.pos);
			out.outerRange = new ViewRange(start.markPos, end.markPos);
			out.mode  = MATHCONFIG.MODES[start.mark];
		}
	}
	return out;
}

const start = findMarkPos(view, position, MATHCONFIG.STARTMARKS, false);
	const end   = findMarkPos(view, position, MATHCONFIG.ENDMARKS,   true);

	if (start.pos !== null && end.pos !== null){
		const closerEnd = findMarkPos(view, position, MATHCONFIG.ENDMARKS, false);
		if (closerEnd.pos!==null){
			if (closerEnd.pos.isAfter(start.pos)) return out; //not valid
		}
		const closerStart = findMarkPos(view, position, MATHCONFIG.STARTMARKS, true);
		if (closerStart.pos!==null){
			if (closerStart.pos.isBefore(end.pos)) return out; //not valid
		}
		if (start.mark===end.mark){
			out.range = new ViewRange(start.pos, end.pos);
			out.outerRange = new ViewRange(start.markPos, end.markPos);
			out.mode  = MATHCONFIG.MODES[start.mark];
		}
	}
	return out;
}