How to use the react-swipeable-views-core.mod function in react-swipeable-views-core

default:
          break;
      }

      if (action) {
        const indexLatest = this.state.index;
        let indexNew = indexLatest;

        if (action === 'increase') {
          indexNew += 1;
        } else {
          indexNew -= 1;
        }

        if (slideCount || children) {
          indexNew = mod(indexNew, slideCount || React.Children.count(children));
        }

        // Is uncontrolled
        if (this.props.index === undefined) {
          this.setState({
            index: indexNew,
          });
        }

        if (onChangeIndex) {
          onChangeIndex(indexNew, indexLatest);
        }
      }
    };

handleChangeIndex = (indexContainer, indexLatest) => {
      const { slideCount, onChangeIndex } = this.props;

      const indexDiff = indexContainer - indexLatest;
      let index = this.state.index + indexDiff;

      if (slideCount) {
        index = mod(index, slideCount);
      }

      // Is uncontrolled
      if (this.props.index === undefined) {
        this.setIndex(index, indexContainer, indexDiff);
      }

      if (onChangeIndex) {
        onChangeIndex(index, this.state.index);
      }
    };

function slideRenderer(params) {
  const { index, key } = params;
  let style;

  switch (mod(index, 3)) {
    case 0:
      style = styles.slide1;
      break;

    case 1:
      style = styles.slide2;
      break;

    case 2:
      style = styles.slide3;
      break;

    default:
      break;
  }

function slideRenderer(params) {
  const { index, key } = params;
  let style;

  switch (mod(index, 3)) {
    case 0:
      style = styles.slide1;
      break;

    case 1:
      style = styles.slide2;
      break;

    case 2:
      style = styles.slide3;
      break;

    default:
      break;
  }

function slideRenderer(params) {
  const { index, key } = params;
  let style;

  switch (mod(index, 3)) {
    case 0:
      style = styles.slide1;
      break;

    case 1:
      style = styles.slide2;
      break;

    case 2:
      style = styles.slide3;
      break;

    default:
      break;
  }

const getVideo = (i) => videos[mod(i, videos.length)]

({ index: i, key }) => (
      <img alt="" src="{slides[mod(i,">
    ),
    [slides],

function slideRenderer(params) {
  const { index, key } = params;
  let style;

  switch (mod(index, 3)) {
    case 0:
      style = styles.slide1;
      break;

    case 1:
      style = styles.slide2;
      break;

    case 2:
      style = styles.slide3;
      break;

    default:
      break;
  }

export default function Screenshots(props) {
  const classes = useStyles()
  const [index, setIndex] = React.useState(0)
  const onChangeIndex = React.useCallback(R.unary(setIndex), [])
  const actualIndex = mod(index, slides.length)
  const current = slides[actualIndex]
  const maxSlides = slides.length * SLIDE_COUNT_FACTOR
  const nearestZero = Math.floor(index / slides.length) * slides.length

  const goToNearestIndex = React.useCallback((i) => setIndex(nearestZero + i), [
    nearestZero,
  ])

  const slideRenderer = React.useCallback(
    ({ index: i, key }) => (
      <img alt="" src="{slides[mod(i,">