@comparaonline/ui-offer-details-collapse

A package for render the detail for an offer / product into Compara Online

Usage no npm install needed!

<script type="module">
  import comparaonlineUiOfferDetailsCollapse from 'https://cdn.skypack.dev/@comparaonline/ui-offer-details-collapse';
</script>

README

@comparaonline/ui-offer-details-collapse

A package for render the detail for an offer / product into Compara Online

Getting Started

To getting started with this package you will first install it, so

yarn add @comparaonline/ui-offer-details-collapse

or

npm install @comparaonline/ui-offer-details-collapse

import React from 'react';
import DetailWithCollapseAttributes from '@comparaonline/ui-offer-details-collapse';

class View extends React.Component {
  render() {
    const offersArray = [..., offer];
    return (
      <Grid>
        <DetailWithCollapseAttributes
          offers={offersArray}
          current={offer.id}
          onClose={this.whenClose}
          callToActionText={this.functionToRenderCallToActionText}
          onCallToAction={this.onCallToActionHandler}
        />
      </Grid>
    );
  }
}

this component is built over the new Context API to manage the offers passed.

so is not a complex component usage, so the following will be the props that your should provide to getting started with this package.

Prop Name Description Default Value Expected Type Value Required
offers Array of offers to be navigable undefined Offer[] true
current the current offer id to be shown undefined string true
onClose a function that will execute the onClose intent undefined (offer) => void true
callToActionText a function that must return the text for call to action button undefined (offer) => string; true
onCallToAction a function that will be invoked when call to action is executed undefined (offer) => void; true

Happy Coding :sunglasses: