woocommerce/plugins/woocommerce-blocks/assets/js/base/components/totals/totals-item/index.js

48 lines
1.2 KiB
JavaScript

/**
* External dependencies
*/
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { isValidElement } from '@wordpress/element';
import FormattedMonetaryAmount from '@woocommerce/base-components/formatted-monetary-amount';
/**
* Internal dependencies
*/
import './style.scss';
const TotalsItem = ( { className, currency, label, value, description } ) => {
return (
<div
className={ classnames( 'wc-block-totals-table-item', className ) }
>
<span className="wc-block-totals-table-item__label">{ label }</span>
{ isValidElement( value ) ? (
<div className="wc-block-totals-table-item__value">
{ value }
</div>
) : (
<FormattedMonetaryAmount
className="wc-block-totals-table-item__value"
currency={ currency }
displayType="text"
value={ value }
/>
) }
<div className="wc-block-totals-table-item__description">
{ description }
</div>
</div>
);
};
TotalsItem.propTypes = {
currency: PropTypes.object,
label: PropTypes.string.isRequired,
value: PropTypes.oneOfType( [ PropTypes.number, PropTypes.node ] ),
className: PropTypes.string,
description: PropTypes.node,
};
export default TotalsItem;