@elacity-js/uikit/dist/components/NumberDelta.js

React / Material UI Design kit for Elacity project

import { jsx, Fragment } from 'react/jsx-runtime';
import Typography from '@mui/material/Typography';
import { styled } from '@mui/material/styles';

const calculatePercentage = (from, to) => new Intl.NumberFormat('default', {
    style: 'percent',
    minimumFractionDigits: 2,
    maximumFractionDigits: 2,
}).format(((to - from)) / from);
const PercentValue = styled(Typography, {
    shouldForwardProp: (prop) => !['up', 'down'].includes(prop),
})(({ theme, up, down }) => (Object.assign(Object.assign({ fontWeight: 500 }, (up && {
    color: theme.palette.success.main,
})), (down && {
    color: theme.palette.error.main,
}))));
const NumberDelta = ({ from, to }) => {
    if (from === to || from === 0) {
        return jsx(Fragment, { children: "-" });
    }
    return jsx(PercentValue, Object.assign({}, { up: to > from, down: to < from }, { children: calculatePercentage(from, to) }));
};
NumberDelta.defaultProps = {
    from: 0,
    to: 0,
};

export { NumberDelta as default };
//# sourceMappingURL=NumberDelta.js.map