@woocommerce/components
Version:
UI components for WooCommerce.
49 lines (48 loc) • 1.88 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/**
* External dependencies
*/
const element_1 = require("@wordpress/element");
const clsx_1 = __importDefault(require("clsx"));
const prop_types_1 = __importDefault(require("prop-types"));
/**
* Use `OrderStatus` to display a badge with human-friendly text describing the current order status.
*
* @param {Object} props
* @param {Object} props.order
* @param {string} props.order.status
* @param {string} props.className
* @param {Object} props.orderStatusMap
* @param {boolean} props.labelPositionToLeft
* @return {Object} -
*/
const OrderStatus = ({ order: { status }, className, orderStatusMap, labelPositionToLeft = false, }) => {
const indicatorClasses = (0, clsx_1.default)('woocommerce-order-status__indicator', {
['is-' + status]: true,
});
const label = orderStatusMap[status] || status;
return ((0, element_1.createElement)("div", { className: (0, clsx_1.default)('woocommerce-order-status', className) }, labelPositionToLeft ? ((0, element_1.createElement)(element_1.Fragment, null,
label,
(0, element_1.createElement)("span", { className: indicatorClasses }))) : ((0, element_1.createElement)(element_1.Fragment, null,
(0, element_1.createElement)("span", { className: indicatorClasses }),
label))));
};
OrderStatus.propTypes = {
/**
* The order to display a status for.
*/
order: prop_types_1.default.object.isRequired,
/**
* Additional CSS classes.
*/
className: prop_types_1.default.string,
/**
* A map of status to label for order statuses.
*/
orderStatusMap: prop_types_1.default.object,
};
exports.default = OrderStatus;