How to use the @ui5/webcomponents-react-base/lib/useViewportRange.useViewportRange function in @ui5/webcomponents-react-base

const Grid: FC = forwardRef((props: GridPropTypes, ref: Ref) => {
  const {
    children,
    hSpacing,
    vSpacing,
    position,
    width,
    style,
    className,
    tooltip,
    slot,
    defaultIndent,
    defaultSpan
  } = props;

  const currentRange = useViewportRange('StdExt');

  const classes = useStyles();
  const gridClasses = StyleClassHelper.of(classes.grid);
  gridClasses.put(classes[`gridHSpace${hSpacing === 0.5 ? '05' : hSpacing}`]);
  gridClasses.put(classes[`gridVSpace${vSpacing === 0.5 ? '05' : vSpacing}`]);

  if (GridPosition.Center === position) {
    gridClasses.put(classes.gridPositionCenter);
  }

  if (GridPosition.Right === position) {
    gridClasses.put(classes.gridPositionRight);
  }

  const gridStyle: CSSProperties = useMemo(() => {
    const styles: CSSProperties = {};