react-native-vimeo-iframe/lib/module/index.js

React Native Vimeo Iframe is a library to render Vimeo videos in a React Native app. This component allows you to embed a Vimeo video in your app and have full access to the Vimeo player JS API (more information https://developer.vimeo.com/player/js-api).

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React, { useCallback, useRef } from 'react';
import { WebView } from 'react-native-webview';
import template from './template';
import { PlayerEvents } from './types';
export const Vimeo = ({
  handlers: handlersArr,
  videoId,
  params,
  reference,
  ...otherProps
}) => {
  const webRef = useRef();
  const url = params ? `https://player.vimeo.com/video/${videoId}?${params}` : `https://player.vimeo.com/video/${videoId}`;
  const autoPlay = params === null || params === void 0 ? void 0 : params.includes('autoplay=1');
  const handlers = {};
  const registerHandlers = useCallback(() => {
    PlayerEvents.forEach(name => {
      if (handlersArr) handlers[name] = handlersArr[name];
    });
  }, [handlers, handlersArr]);
  registerHandlers();
  const onBridgeMessage = useCallback(event => {
    const payload = JSON.parse(event.nativeEvent.data);
    let bridgeMessageHandler = handlers[payload === null || payload === void 0 ? void 0 : payload.name];
    if (bridgeMessageHandler) bridgeMessageHandler(payload === null || payload === void 0 ? void 0 : payload.data);
  }, [handlers]);
  return /*#__PURE__*/React.createElement(WebView, _extends({
    allowsFullscreenVideo: true,
    source: {
      uri: url,
      headers: {
        Referer: reference
      }
    },
    javaScriptEnabled: true,
    ref: webRef,
    onMessage: onBridgeMessage,
    scrollEnabled: false,
    injectedJavaScript: template(url),
    mediaPlaybackRequiresUserAction: !autoPlay
  }, otherProps));
};
//# sourceMappingURL=index.js.map