Как настроить компонент слайдера в React так, чтобы в мобильной версии был виден один слайд целиком, а второй слайд отображался наполовину?

Для настройки компонента слайдера в React таким образом, можно использовать библиотеку react-slick. 

Чтобы показать один слайд целиком и второй слайд наполовину на мобильной версии, можно использовать опцию "slidesToShow" и "slidesToScroll" и задать им разные значения в зависимости от размера экрана.

Пример:

```jsx
import React from 'react';
import Slider from 'react-slick';

const settings = {
  slidesToShow: 1,
  slidesToScroll: 1,
  responsive: [
    {
      breakpoint: 768, // мобильные устройства
      settings: {
        slidesToShow: 1,
        slidesToScroll: 1
      }
    }
  ]
}

const MySlider = () => {
  return (
    <Slider {...settings}>
      <div>
        <h3>Слайд 1</h3>
      </div>
      <div>
        <h3>Слайд 2</h3>
      </div>
    </Slider>
  )
}

export default MySlider;
```

Чтобы один слайд был виден полностью, а второй обрезался, можно использовать CSS для задания стилей каждому слайду и его обертке.

Пример:

```jsx
const styles = {
  slide: {
    width: '100%',
    overflow: 'hidden',
    position: 'relative'
  },
  fullSlide: {
    width: '100%',
    height: '100%'
  },
  halfSlide: {
    width: '50%',
    height: '100%',
    float: 'left'
  }
}

const MySlider = () => {
  return (
    <div style={styles.slide}>
      <div style={styles.fullSlide}>
        <h3>Слайд 1</h3>
      </div>
      <div style={styles.halfSlide}>
        <h3>Слайд 2</h3>
      </div>
    </div>
  )
}

export default MySlider;
```

Это два примера того, как можно настроить отображение слайдов в React для вашего проекта. Выберите тот, который лучше подходит под ваши требования и стилистические предпочтения.

https://swiperjs.com/swiper-api#param-slidesPerView 
 slidesPerView: 1.5