VideoBlock

Демо данные
const content: IContent = {
    title: 'Интернет',
    description: 'Подключение к домашнему интернету осуществляется в удобное для вас время по технологиям Ethernet, Docsis.',
    href: '#',
    buttonTitle: 'Подключение',
};

const contentWithoutButton: IContent = {
    title: 'Интернет',
    description:
        'Подключение к домашнему интернету осуществляется в удобное для вас время по технологиям Ethernet, Docsis.',
};

Если в компоненте выбран тип видео 'youtube', то в качество источника необходимо указать id видео:
<VideoBlock videoType='youtube' videoSrc='2Sps5MnvlKM' />

Если в компоненте выбран тип видео 'rutube', то в качество источника необходимо указать id видео:
<VideoBlock videoType='rutube' videoSrc='ef1544b84a713728d88ace67dafd375a' />

Если в компоненте выбран тип видео 'vk', то в качество источника необходимо указать id видео целиком (все цифры, что в ссылке вида 'https://vk.com/video-3785_456248663' после 'video-', вместе с символом '_'):
<VideoBlock videoType='vk' videoSrc='3785_456248663' />

Базовое использование

<VideoBlock
  videoSrc={video}
/>

Базовое использование (без перехода в полноэкранный режим на iOS)

<VideoBlock
  videoSrc={video}
  playsinline
/>

С превью

<VideoBlock
  videoSrc={video}
  poster={poster.src}
/>

Контент

<VideoBlock
  content={content}
  videoSrc={video}
/>

Текст справа от видео (только для десктопа)

<VideoBlock
  content={content}
  videoSrc={video}
  contentPositionRight
/>

Без кнопки

<VideoBlock
  content={contentWithoutButton}
  videoSrc={video}
/>

Видео с Youtube

<VideoBlock
  videoSrc={youtubeVideoId}
  videoType="youtube"
  isAutoplay
/>

Видео с Rutube

<VideoBlock
  videoSrc={rutubeVideoId}
  videoType="rutube"
  isAutoplay
/>

Видео с VK

<VideoBlock
  videoSrc={vkVideoId}
  videoType="vk"
  isAutoplay
/>

C контентом

<VideoBlock
  content={content}
  videoSrc={youtubeVideoId}
  videoType="youtube"
/>

Видео с Youtube (без перехода в полноэкранный режим на iOS)

<VideoBlock
  videoSrc={youtubeVideoId}
  videoType="youtube"
  isAutoplay
  playsinline
/>

HTML-теги и спецсимволы

В свойстве content в свойствах title и description поддерживаются некоторые HTML-теги: "<br>, <font color>, <a href>".

Также в обоих свойствах поддерживается спецсимвол &nbsp.

Демо данные
const htmlTitle: '<a href="https://moscow.megafon.ru">Текст</a><br><font color="#731982">≈40</font> символов.&nbspКороткие слова',
const htmlDescription = 'Описание&nbspдолжно <a href="https://moscow.megafon.ru">быть</a> <font color="#731982">примерно</font> не более 130 символов.<br>Пишите содержательно, кратно и не будет проблем с текстовым контентом.';

<VideoBlock
  content={{
      title: '<a href="https://moscow.megafon.ru">Текст</a><br><font color="#731982">≈40</font> символов.&nbspКороткие слова',
      description: 'Описание&nbspдолжно <a href="https://moscow.megafon.ru">быть</a> <font color="#731982">примерно</font> не более 130 символов.<br>Пишите <b>содержательно</b>, кратно и не будет проблем с текстовым контентом.',
      href: '#',
      buttonTitle: 'Подключение',
  }}
  videoSrc={youtubeVideoId}
  videoType="youtube"
/>

Фикс для белого фона

<VideoBlock
  videoSrc={video}
  fixWhiteVideoBackground
/>