import PropTypes from "prop-types";
import { PureComponent } from "react";
import "./Product3DViewer.style";
export class Product3DViewer extends PureComponent {
// Define the props that this component expects to receive
// Checked at runtime in development builds
modelUrls: PropTypes.arrayOf(PropTypes.string),
const { modelUrls } = this.props;
const { activeModelIndex } = this.state;
const activeNumber = activeModelIndex + 1;
const size = modelUrls.length;
const isFirst = activeModelIndex <= 0;
const isLast = activeModelIndex >= size - 1;
<div block="Product3DViewer" elem="Switcher">
this.setState({ activeModelIndex: activeModelIndex - 1 })
<span block="Product3DViewer" elem="ActiveIndex">
this.setState({ activeModelIndex: activeModelIndex + 1 })
const { modelUrls } = this.props;
const { activeModelIndex } = this.state;
const url = modelUrls[activeModelIndex];
<div block="Product3DViewer">
{this.renderModelSwitcher()}
class="Product3DViewer-Model"
alt={__("Product 3D Model")}
export default Product3DViewer;