logo

eola Style Guide 2024: Voucher Bar

Voucher Bar

The VoucherBar component is used to display voucher or discount code being active and info regarding type and remaining credit or percentage reduction.

Examples

VoucherBar

<Grid gridGap={2}  width="50%">
   <VoucherBar
    activity={{isActive: activityVoucher }}
    onClick={() => {alert('Run some action')}}
  />
    <VoucherBar
      credit={{ data: creditVoucher }}
      onClick={() => {alert('Run some action')}}
    />
  <VoucherBar
    discount={{ data: discountCode }}
    onClick={() => {alert('Run some action')}}
  />
</Grid>