import _extends from "@babel/runtime/helpers/esm/extends";
import React from 'react';
import { Vec2 } from '../components';
import { toProps } from '../core';
import EventListener from '../event/EventListener';

function toVideoProps(_ref) {
  var color = _ref.color,
      height = _ref.height,
      metalness = _ref.metalness,
      opacity = _ref.opacity,
      repeat = _ref.repeat,
      roughness = _ref.roughness,
      segmentsHeight = _ref.segmentsHeight,
      segmentsWidth = _ref.segmentsWidth,
      shader = _ref.shader,
      side = _ref.side,
      src = _ref.src,
      transparent = _ref.transparent,
      width = _ref.width;
  return {
    color: color,
    height: height,
    metalness: metalness,
    opacity: opacity,
    repeat: repeat && new Vec2(repeat).toString(),
    roughness: roughness,
    'segments-height': segmentsHeight,
    'segments-width': segmentsWidth,
    shader: shader,
    side: side,
    src: src,
    transparent: transparent,
    width: width
  };
}
/**
 * The video primitive plays a video as a texture on a flat plane.
 *
 * @see https://aframe.io/docs/1.3.0/primitives/a-video.html
 *
 * @example
 * ```tsx
 * <Scene>
 *   <Assets>
 *     <video
 *       id="penguin-sledding"
 *       autoplay
 *       loop="true"
 *       src="penguin-sledding.mp4"
 *     />
 *   </Assets>
 *
 *   // Using the asset management system.
 *   <Video
 *     src="#penguin-sledding"
 *     width={16}
 *     height={9}
 *     position={{ x: 0, y: 0, z: -20 }}
 *   />
 *
 *   // Defining the URL inline. Not recommended but more comfortable for web developers.
 *   <Video
 *     src="airbending.mp4"
 *   />
 * </Scene>
 * ```
 */


export var Video = function Video(props) {
  var videoKeys = ['color', 'height', 'metalness', 'opacity', 'repeat', 'roughness', 'segmentsHeight', 'segmentsWidth', 'shader', 'side', 'src', 'transparent', 'width'];
  var children = props.children;
  return /*#__PURE__*/React.createElement(EventListener, _extends({
    primitive: "a-video"
  }, toProps(props, videoKeys), toVideoProps(props)), children);
};