import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
var _excluded = ["children", "onClick"];
import React from 'react';
import { Vec2 } from '../components';
import { toProps } from '../core';
import EventListener from '../event/EventListener';

function toBoxProps(_ref) {
  var ambientOcclusionMap = _ref.ambientOcclusionMap,
      ambientOcclusionMapIntensity = _ref.ambientOcclusionMapIntensity,
      ambientOcclusionTextureOffset = _ref.ambientOcclusionTextureOffset,
      ambientOcclusionTextureRepeat = _ref.ambientOcclusionTextureRepeat,
      color = _ref.color,
      depth = _ref.depth,
      displacementBias = _ref.displacementBias,
      displacementMap = _ref.displacementMap,
      displacementScale = _ref.displacementScale,
      displacementTextureOffset = _ref.displacementTextureOffset,
      displacementTextureRepeat = _ref.displacementTextureRepeat,
      envMap = _ref.envMap,
      fog = _ref.fog,
      height = _ref.height,
      metalness = _ref.metalness,
      normalMap = _ref.normalMap,
      normalScale = _ref.normalScale,
      normalTextureOffset = _ref.normalTextureOffset,
      normalTextureRepeat = _ref.normalTextureRepeat,
      repeat = _ref.repeat,
      roughness = _ref.roughness,
      segmentsDepth = _ref.segmentsDepth,
      segmentsHeight = _ref.segmentsHeight,
      segmentsWidth = _ref.segmentsWidth,
      sphericalEnvMap = _ref.sphericalEnvMap,
      src = _ref.src,
      width = _ref.width,
      wireframe = _ref.wireframe,
      wireframeLinewidth = _ref.wireframeLinewidth;
  return {
    'ambient-occlusion-map': ambientOcclusionMap,
    'ambient-occlusion-map-intensity': ambientOcclusionMapIntensity,
    'ambient-occlusion-texture-offset': ambientOcclusionTextureOffset && new Vec2(ambientOcclusionTextureOffset).toString(),
    'ambient-occlusion-texture-repeat': ambientOcclusionTextureRepeat && new Vec2(ambientOcclusionTextureRepeat).toString(),
    color: color,
    depth: depth,
    'displacement-bias': displacementBias,
    'displacement-map': displacementMap,
    'displacement-scale': displacementScale,
    'displacement-texture-offset': displacementTextureOffset && new Vec2(displacementTextureOffset).toString(),
    'displacement-texture-repeat': displacementTextureRepeat && new Vec2(displacementTextureRepeat).toString(),
    'env-map': envMap,
    fog: fog,
    height: height,
    metalness: metalness,
    'normal-map': normalMap,
    'normal-scale': normalScale,
    'normal-texture-offset': normalTextureOffset && new Vec2(normalTextureOffset).toString(),
    'normal-texture-repeat': normalTextureRepeat && new Vec2(normalTextureRepeat).toString(),
    repeat: repeat && new Vec2(repeat).toString(),
    roughness: roughness,
    'segments-depth': segmentsDepth,
    'segments-height': segmentsHeight,
    'segments-width': segmentsWidth,
    'spherical-env-map': sphericalEnvMap,
    src: src,
    width: width,
    wireframe: wireframe,
    'wireframe-linewidth': wireframeLinewidth
  };
}
/**
 * The box primitive creates shapes such as boxes, cubes, or walls.
 *
 * @see https://aframe.io/docs/1.3.0/primitives/a-box.html
 *
 * @example
 *
 * ```tsx
 * <Assets>
 *   <img id="texture" src="texture.png" />
 * </Assets>
 *
 * // Basic box.
 * <Box color="tomato" depth={2} height={4} width={0.5} />
 *
 * // Textured box.
 * <Box src="#texture" />
 * ```
 */


export var Box = function Box(props) {
  var boxProps = ['ambientOcclusionMap', 'ambientOcclusionMapIntensity', 'ambientOcclusionTextureOffset', 'ambientOcclusionTextureRepeat', 'color', 'depth', 'displacementBias', 'displacementMap', 'displacementScale', 'displacementTextureOffset', 'displacementTextureRepeat', 'envMap', 'fog', 'height', 'metalness', 'normalMap', 'normalScale', 'normalTextureOffset', 'normalTextureRepeat', 'repeat', 'roughness', 'segmentsDepth', 'segmentsHeight', 'segmentsWidth', 'sphericalEnvMap', 'src', 'width', 'wireframe', 'wireframeLinewidth'];

  var children = props.children,
      onClick = props.onClick,
      restProps = _objectWithoutPropertiesLoose(props, _excluded);

  return /*#__PURE__*/React.createElement(EventListener, _extends({
    primitive: "a-box",
    events: {
      click: function click() {
        return onClick && onClick();
      }
    }
  }, toProps(restProps, boxProps), toBoxProps(restProps)), children);
};