Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/ui-presets / dist / presets / Order / ProductItem / renderProps.js
Size: Mime:
"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 Empty_1 = require("@skava/ui/dist/components/atoms/Empty");

const MaterialIcon_1 = require("@skava/ui/dist/components/atoms/MaterialIcon");

const Ratings_1 = tslib_1.__importDefault(require("../../Ratings"));

const ProductItem_1 = require("../../../abstractions/Order/ProductItem");

const ProductItem_2 = require("../../../abstractions/Order/ProductItem");

const styled_1 = require("./styled");
/**
 * mouse over function
 */


function handleMouseOver(state) {
  state.focus(); // console.log('[handleMouseOver] isFocused', state.isFocused)
}
/**
 * mouse out function
 */


function handleMouseOut(state) {
  state.blur(); // console.log('[handleMouseLeave] isFocused', state.isFocused)
}
/**
 * render Product Image
 */


function defaultRenderImage(props) {
  const {
    itemDetails,
    isSubscriptionItem,
    hasSingleProduct
  } = props;
  const {
    image
  } = itemDetails;

  if (exotic_1.isSafe(image)) {
    return react_1.default.createElement(styled_1.ProductImage, {
      singleProduct: hasSingleProduct,
      isSubscriptionItem: isSubscriptionItem,
      doAutoAlign: true,
      src: image
    });
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderImage = defaultRenderImage;
/**
 * render Product Name
 */

function defaultRenderName(props) {
  const {
    itemDetails
  } = props;
  const {
    title
  } = itemDetails;

  if (exotic_1.isSafe(title)) {
    return react_1.default.createElement(styled_1.ProductTitle, {
      content: title
    });
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderName = defaultRenderName;
/**
 * render Product Description
 */

function defaultRenderDescription(props) {
  const {
    itemDetails,
    isSubscriptionItem
  } = props;
  const {
    description
  } = itemDetails;

  if (exotic_1.isSafe(description)) {
    return react_1.default.createElement(styled_1.ProductDescription, {
      content: description,
      isSubscriptionItem: isSubscriptionItem
    });
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderDescription = defaultRenderDescription; // SKU ID

function defaultRenderSkuId(props) {
  const {
    itemDetails,
    isSubscriptionItem
  } = props;
  const {
    skuId
  } = itemDetails;

  if (exotic_1.isSafe(skuId)) {
    return react_1.default.createElement(styled_1.Container, {
      "data-qa": 'qa-product-id'
    }, react_1.default.createElement(styled_1.Label, null, "SKU#:"), react_1.default.createElement(styled_1.Value, null, skuId));
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderSkuId = defaultRenderSkuId;
/**
 * render Product Price
 */

function defaultRenderPrice(props) {
  const {
    itemDetails,
    isSubscriptionItem
  } = props;

  const {
    price,
    regularPrice,
    salePrice
  } = itemDetails,
        remainingProps = tslib_1.__rest(itemDetails, ["price", "regularPrice", "salePrice"]);

  const view = isSubscriptionItem ? react_1.default.createElement(styled_1.ProductPrice, {
    regularPrice: regularPrice,
    salePrice: salePrice,
    isSubscriptionItem: isSubscriptionItem
  }) : react_1.default.createElement(styled_1.ProductPrice, {
    regularPrice: price
  });
  return view;
}

exports.defaultRenderPrice = defaultRenderPrice;
/**
 * render Product Quantity
 */

function defaultRenderQuantity(props) {
  const {
    itemDetails,
    isSubscriptionItem
  } = props;
  const {
    quantity
  } = itemDetails;
  const QuantityComponent = isSubscriptionItem ? styled_1.ProductFacets : styled_1.ProductQuantity;

  if (exotic_1.isSafe(quantity)) {
    return react_1.default.createElement(styled_1.Container, {
      "data-qa": 'qa-product-quantity'
    }, react_1.default.createElement(styled_1.Label, null, "Quantity:"), react_1.default.createElement(styled_1.Value, null, quantity));
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderQuantity = defaultRenderQuantity;
/**
 * render Product Facets
 */

function defaultRenderFacets(props) {
  const {
    itemDetails,
    isSubscriptionItem
  } = props;
  const {
    facets
  } = itemDetails;
  return react_1.default.createElement(styled_1.FacetContainer, {
    list: facets
  });
}

exports.defaultRenderFacets = defaultRenderFacets;
/**
 * render Product Ratings
 */

function defaultRenderRatings(props) {
  const {
    itemDetails
  } = props;
  const {
    ratings
  } = itemDetails;

  if (exotic_1.isSafe(ratings)) {
    return react_1.default.createElement(Ratings_1.default, {
      count: ratings
    });
  } else {
    return react_1.default.createElement(Empty_1.Empty, null);
  }
}

exports.defaultRenderRatings = defaultRenderRatings;
/*
* render Product frequency
*/

function defaultRenderProductFrequency(props) {
  return react_1.default.createElement(styled_1.StyledFrequencyWrapper, null, react_1.default.createElement(styled_1.StyledSubscription, {
    type: 'history',
    fill: '#F88F22',
    className: 'frequencyIcon',
    customPaths: MaterialIcon_1.additionalPaths
  }), react_1.default.createElement(styled_1.FrequencyContent, {
    content: props.itemDetails.frequencyContent
  }));
}

exports.defaultRenderProductFrequency = defaultRenderProductFrequency;

function defaultRenderProductItemAddress(props) {
  return react_1.default.createElement(Empty_1.Empty, null);
}

exports.defaultRenderProductItemAddress = defaultRenderProductItemAddress;
/**
 * renders product item action buttons
 */

function defaultRenderProductItemButtons(props) {
  // const renderContext = (context: ProductItemContextValue) => {
  //   const { state } = context
  //   return <ProductItemButtonGroup state={state} />
  // }
  // return (
  //   <OrderProductItemContextConsumer>
  //     {renderContext}
  //   </OrderProductItemContextConsumer>
  // )
  return react_1.default.createElement(Empty_1.Empty, null);
}

exports.defaultRenderProductItemButtons = defaultRenderProductItemButtons;
/**
 * renders product item form
 */

function defaultRenderProductItemForm(props) {
  // const renderContext = (context: ProductItemContextValue) => {
  //   const { state } = context
  //   return <CancelReturnForm {...props} state={state} />
  // }
  // return (
  //   <OrderProductItemContextConsumer>
  //     {renderContext}
  //   </OrderProductItemContextConsumer>
  // )
  return react_1.default.createElement(Empty_1.Empty, null);
}

exports.defaultRenderProductItemForm = defaultRenderProductItemForm;
/**
 * render Wrapper
 */

function fromPropsToRenderContext(props) {
  const {
    className,
    children,
    isSubscriptionItem,
    hasSingleProduct
  } = props,
        remainingProps = tslib_1.__rest(props, ["className", "children", "isSubscriptionItem", "hasSingleProduct"]);

  const renderContext = context => {
    const {
      state
    } = context; // console.log('[renderContext] ==> state.isFocused', state.isFocused)

    const onMouseOver = event => handleMouseOver(state);

    const onMouseOut = event => handleMouseOut(state);

    return react_1.default.createElement(ProductItem_2.ProductItemWrapper, {
      className: className,
      onMouseOver: onMouseOver,
      onMouseOut: onMouseOut,
      singleProduct: hasSingleProduct,
      isSubscriptionItem: isSubscriptionItem
    }, children);
  };

  return renderContext;
}

function defaultRenderWrapper(props) {
  return react_1.default.createElement(ProductItem_1.OrderProductItemContextConsumer, null, fromPropsToRenderContext(props));
}

exports.defaultRenderWrapper = defaultRenderWrapper;