"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const exotic_1 = require("exotic");

const mobx_react_1 = require("xmobx/mobx-react");

const state_1 = require("./state");

const fixture_1 = require("../fixture");

const renderProps_1 = require("./renderProps");

const styled_1 = require("./styled");

let ProductPiece = class ProductPiece extends react_1.default.Component {
  constructor() {
    super(...arguments);
    this.observableState = new state_1.ProductPieceState(this.props);

    this.handleExpand = () => {
      let {
        item,
        onProductUpdate
      } = this.props;
      const variant = item.variant >= 4 ? 0 : item.variant + 1;
      this.observableState.updateVariantData(variant);
      const updateParams = {
        product: this.observableState.product,
        shouldRemove: false
      };

      if (onProductUpdate) {
        onProductUpdate(updateParams);
      }
    };

    this.handleSwap = () => {
      const {
        item,
        onProductUpdate
      } = this.props;
      this.observableState.swapImages(item);
      const updateParams = {
        product: this.observableState.product,
        shouldRemove: false
      };

      if (onProductUpdate) {
        onProductUpdate(updateParams);
      }
    };

    this.handleDelete = () => {
      const {
        onProductUpdate
      } = this.props;

      if (onProductUpdate) {
        const updateParams = {
          product: this.observableState.product,
          shouldRemove: true
        };
        onProductUpdate(updateParams);
      }
    };
  }

  render() {
    const {
      variantData
    } = this.observableState;

    const _a = this.props,
          {
      renderProductImage,
      renderProductDetails,
      renderHoverIcons
    } = _a,
          remainingProps = tslib_1.__rest(_a, ["renderProductImage", "renderProductDetails", "renderHoverIcons"]);

    const view = react_1.default.createElement(styled_1.Wrapper, null, react_1.default.createElement(styled_1.ImageWrapper, {
      variantData: variantData,
      draggable: false
    }, exotic_1.isFunction(renderProductImage) && renderProductImage(remainingProps, variantData)), react_1.default.createElement(styled_1.DetailsWrapper, null, exotic_1.isFunction(renderProductDetails) && renderProductDetails(remainingProps)), exotic_1.isFunction(renderHoverIcons) && renderHoverIcons(Object.assign({}, remainingProps, {
      handleExpand: this.handleExpand,
      handleSwap: this.handleSwap,
      handleDelete: this.handleDelete
    })));
    return view;
  }

};
ProductPiece.defaultProps = {
  className: '',
  // renderProps
  renderProductDetails: renderProps_1.defaultRenderProductDetails,
  renderProductImage: renderProps_1.defaultRenderProductImage,
  renderHoverIcons: renderProps_1.defaultRenderHoverIcons,
  variantConfig: fixture_1.variantConfig
};
ProductPiece = tslib_1.__decorate([mobx_react_1.observer], ProductPiece);
exports.ProductPiece = ProductPiece;
exports.default = ProductPiece; //# sourceMappingURL=ProductPiece.js.map