@git-temporal/git-temporal-react/lib/app/components/PercentBar.js

<!-- START doctoc generated TOC please keep comment here to allow auto update --> <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const styles_1 = require("app/styles");
const defaultNumeratorBarStyle = {
    backgroundColor: 'blue',
    height: 10,
};
const defaultDenominatorBarStyle = {
    backgroundColor: 'grey',
    height: 10,
    marginBottom: 5,
};
exports.PercentBar = ({ numerator, denominator, }) => {
    const percentWidth = (numerator / denominator) * 100;
    return (react_1.default.createElement("div", { style: styles_1.style(defaultDenominatorBarStyle, { width: '100%' }) },
        react_1.default.createElement("div", { style: styles_1.style(defaultNumeratorBarStyle, { width: `${percentWidth}%` }) })));
};
exports.PercentBar.displayName = 'PercentBar';