@perses-dev/core 0.38.0 → 0.40.0

package/dist/cjs/model/time.js

@@ -21,15 +21,44 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    isRelativeTimeRange: ()=>isRelativeTimeRange,
-    isAbsoluteTimeRange: ()=>isAbsoluteTimeRange,
-    toAbsoluteTimeRange: ()=>toAbsoluteTimeRange,
-    parseDurationString: ()=>parseDurationString,
-    isDurationString: ()=>isDurationString,
-    roundStepInterval: ()=>roundStepInterval,
-    getSuggestedStepMs: ()=>getSuggestedStepMs
+    isRelativeTimeRange: function() {
+        return isRelativeTimeRange;
+    },
+    isAbsoluteTimeRange: function() {
+        return isAbsoluteTimeRange;
+    },
+    toAbsoluteTimeRange: function() {
+        return toAbsoluteTimeRange;
+    },
+    parseDurationString: function() {
+        return parseDurationString;
+    },
+    isDurationString: function() {
+        return isDurationString;
+    },
+    intervalToPrometheusDuration: function() {
+        return intervalToPrometheusDuration;
+    },
+    msToPrometheusDuration: function() {
+        return msToPrometheusDuration;
+    },
+    formatDuration: function() {
+        return formatDuration;
+    },
+    roundStepInterval: function() {
+        return roundStepInterval;
+    },
+    getSuggestedStepMs: function() {
+        return getSuggestedStepMs;
+    }
 });
-const _dateFns = require("date-fns");
+const _datefns = require("date-fns");
+const ONE_SECOND_IN_MS = 1000;
+const ONE_MINUTE_IN_MS = 60000;
+const ONE_HOUR_IN_MS = 3600000;
+const ONE_DAY_IN_MS = 86400000; // assuming a day has always 24h
+const ONE_WEEK_IN_MS = 604800000; // assuming a week has always 7d
+const ONE_YEAR_IN_MS = 31536000000; // assuming a year has always 365d
 function isRelativeTimeRange(timeRange) {
     return timeRange.pastDuration !== undefined;
 }
@@ -37,10 +66,10 @@ function isAbsoluteTimeRange(timeRange) {
     return timeRange.start !== undefined && timeRange.end !== undefined;
 }
 function toAbsoluteTimeRange(timeRange) {
-    var _end;
-    const end = (_end = timeRange.end) !== null && _end !== void 0 ? _end : new Date();
+    var _timeRange_end;
+    const end = (_timeRange_end = timeRange.end) !== null && _timeRange_end !== void 0 ? _timeRange_end : new Date();
     return {
-        start: (0, _dateFns.sub)(end, parseDurationString(timeRange.pastDuration)),
+        start: (0, _datefns.sub)(end, parseDurationString(timeRange.pastDuration)),
         end
     };
 }
@@ -50,21 +79,75 @@ function parseDurationString(durationString) {
     if (matches === null) {
         throw new Error(`Invalid duration string '${durationString}'`);
     }
-    var ref, ref1, ref2, ref3, ref4, ref5, ref6;
+    var _matches_, _matches_1, _matches_2, _matches_3, _matches_4, _matches_5, _matches_6;
     return {
-        years: parseInt((ref = matches[1]) !== null && ref !== void 0 ? ref : '0'),
+        years: parseInt((_matches_ = matches[1]) !== null && _matches_ !== void 0 ? _matches_ : '0'),
         months: 0,
-        weeks: parseInt((ref1 = matches[2]) !== null && ref1 !== void 0 ? ref1 : '0'),
-        days: parseInt((ref2 = matches[3]) !== null && ref2 !== void 0 ? ref2 : '0'),
-        hours: parseInt((ref3 = matches[4]) !== null && ref3 !== void 0 ? ref3 : '0'),
-        minutes: parseInt((ref4 = matches[5]) !== null && ref4 !== void 0 ? ref4 : '0'),
-        seconds: parseInt((ref5 = matches[6]) !== null && ref5 !== void 0 ? ref5 : '0') + parseInt((ref6 = matches[7]) !== null && ref6 !== void 0 ? ref6 : '0') / 1000
+        weeks: parseInt((_matches_1 = matches[2]) !== null && _matches_1 !== void 0 ? _matches_1 : '0'),
+        days: parseInt((_matches_2 = matches[3]) !== null && _matches_2 !== void 0 ? _matches_2 : '0'),
+        hours: parseInt((_matches_3 = matches[4]) !== null && _matches_3 !== void 0 ? _matches_3 : '0'),
+        minutes: parseInt((_matches_4 = matches[5]) !== null && _matches_4 !== void 0 ? _matches_4 : '0'),
+        seconds: parseInt((_matches_5 = matches[6]) !== null && _matches_5 !== void 0 ? _matches_5 : '0') + parseInt((_matches_6 = matches[7]) !== null && _matches_6 !== void 0 ? _matches_6 : '0') / 1000
     };
 }
 function isDurationString(maybeDuration) {
     if (maybeDuration === '') return false;
     return DURATION_REGEX.test(maybeDuration);
 }
+function intervalToPrometheusDuration(timeRange) {
+    const durationInMs = timeRange.end.valueOf() - timeRange.start.valueOf();
+    return msToPrometheusDuration(durationInMs);
+}
+function msToPrometheusDuration(durationInMs) {
+    const years = Math.trunc(durationInMs / ONE_YEAR_IN_MS);
+    if (years > 0) durationInMs -= years * ONE_YEAR_IN_MS;
+    const weeks = Math.trunc(durationInMs / ONE_WEEK_IN_MS);
+    if (weeks > 0) durationInMs -= weeks * ONE_WEEK_IN_MS;
+    const days = Math.trunc(durationInMs / ONE_DAY_IN_MS);
+    if (days > 0) durationInMs -= days * ONE_DAY_IN_MS;
+    const hours = Math.trunc(durationInMs / ONE_HOUR_IN_MS);
+    if (hours > 0) durationInMs -= hours * ONE_HOUR_IN_MS;
+    const minutes = Math.trunc(durationInMs / ONE_MINUTE_IN_MS);
+    if (minutes > 0) durationInMs -= minutes * ONE_MINUTE_IN_MS;
+    return {
+        years: years,
+        months: 0,
+        weeks: weeks,
+        days: days,
+        hours: hours,
+        minutes: minutes,
+        seconds: durationInMs / 1000
+    };
+}
+function formatDuration(duration) {
+    const result = [];
+    if (duration.years) {
+        result.push(`${duration.years}y`);
+    }
+    if (duration.weeks) {
+        result.push(`${duration.weeks}w`);
+    }
+    if (duration.days) {
+        result.push(`${duration.days}d`);
+    }
+    if (duration.hours) {
+        result.push(`${duration.hours}h`);
+    }
+    if (duration.minutes) {
+        result.push(`${duration.minutes}m`);
+    }
+    if (duration.seconds) {
+        const seconds = Math.trunc(duration.seconds);
+        if (seconds) {
+            result.push(`${seconds}s`);
+        }
+        const ms = (duration.seconds - seconds) * 1000;
+        if (ms) {
+            result.push(`${ms}ms`);
+        }
+    }
+    return result.join('');
+}
 const DEFAULT_STEP_MS = 15000;
 const ROUNDED_STEP_INTERVALS = [
     // max: 0.015s
@@ -105,140 +188,140 @@ const ROUNDED_STEP_INTERVALS = [
     },
     // max: 1.5s
     {
-        maxMs: 1500,
-        roundedStepMs: 1000,
+        maxMs: ONE_SECOND_IN_MS * 1.5,
+        roundedStepMs: ONE_SECOND_IN_MS,
         display: '1s'
     },
     // max: 3.5s
     {
-        maxMs: 3500,
-        roundedStepMs: 2000,
+        maxMs: ONE_SECOND_IN_MS * 3.5,
+        roundedStepMs: ONE_SECOND_IN_MS * 2,
         display: '2s'
     },
     // max: 7.5s
     {
-        maxMs: 7500,
-        roundedStepMs: 5000,
+        maxMs: ONE_SECOND_IN_MS * 7.5,
+        roundedStepMs: ONE_SECOND_IN_MS * 5,
         display: '5s'
     },
     // max: 12.5s
     {
-        maxMs: 12500,
-        roundedStepMs: 10000,
+        maxMs: ONE_SECOND_IN_MS * 12.5,
+        roundedStepMs: ONE_SECOND_IN_MS * 10,
         display: '10s'
     },
     // max: 17.5s
     {
-        maxMs: 17500,
-        roundedStepMs: 15000,
+        maxMs: ONE_SECOND_IN_MS * 17.5,
+        roundedStepMs: ONE_SECOND_IN_MS * 15,
         display: '15s'
     },
     // max: 25s
     {
-        maxMs: 25000,
-        roundedStepMs: 20000,
+        maxMs: ONE_SECOND_IN_MS * 25,
+        roundedStepMs: ONE_SECOND_IN_MS * 20,
         display: '20s'
     },
     // max: 45s
     {
-        maxMs: 45000,
-        roundedStepMs: 30000,
+        maxMs: ONE_SECOND_IN_MS * 45,
+        roundedStepMs: ONE_SECOND_IN_MS * 30,
         display: '30s'
     },
     // max: 1.5m
     {
-        maxMs: 90000,
-        roundedStepMs: 60000,
+        maxMs: ONE_MINUTE_IN_MS * 1.5,
+        roundedStepMs: ONE_MINUTE_IN_MS,
         display: '1m'
     },
     // max: 3.5m
     {
-        maxMs: 210000,
-        roundedStepMs: 120000,
+        maxMs: ONE_MINUTE_IN_MS * 3.5,
+        roundedStepMs: ONE_MINUTE_IN_MS * 2,
         display: '2m'
     },
     // max: 7.5m
     {
-        maxMs: 450000,
-        roundedStepMs: 300000,
+        maxMs: ONE_MINUTE_IN_MS * 7.5,
+        roundedStepMs: ONE_MINUTE_IN_MS * 5,
         display: '5m'
     },
     // max: 12.5m
     {
-        maxMs: 750000,
-        roundedStepMs: 600000,
+        maxMs: ONE_MINUTE_IN_MS * 12.5,
+        roundedStepMs: ONE_MINUTE_IN_MS * 10,
         display: '10m'
     },
     // max: 12.5m
     {
-        maxMs: 1050000,
-        roundedStepMs: 900000,
+        maxMs: ONE_MINUTE_IN_MS * 12.5,
+        roundedStepMs: ONE_MINUTE_IN_MS * 15,
         display: '15m'
     },
     // max: 25m
     {
-        maxMs: 1500000,
-        roundedStepMs: 1200000,
+        maxMs: ONE_MINUTE_IN_MS * 25,
+        roundedStepMs: ONE_MINUTE_IN_MS * 20,
         display: '20m'
     },
     // max: 45m
     {
-        maxMs: 2700000,
-        roundedStepMs: 1800000,
+        maxMs: ONE_MINUTE_IN_MS * 45,
+        roundedStepMs: ONE_MINUTE_IN_MS * 30,
         display: '30m'
     },
     // max: 1.5h
     {
-        maxMs: 5400000,
-        roundedStepMs: 3600000,
+        maxMs: ONE_HOUR_IN_MS * 1.5,
+        roundedStepMs: ONE_HOUR_IN_MS,
         display: '1h'
     },
     // max: 2.5h
     {
-        maxMs: 9000000,
-        roundedStepMs: 7200000,
+        maxMs: ONE_HOUR_IN_MS * 2.5,
+        roundedStepMs: ONE_HOUR_IN_MS * 2,
         display: '2h'
     },
     // max: 4.5h
     {
-        maxMs: 16200000,
-        roundedStepMs: 10800000,
+        maxMs: ONE_HOUR_IN_MS * 4.5,
+        roundedStepMs: ONE_HOUR_IN_MS * 3,
         display: '3h'
     },
     // max: 9h
     {
-        maxMs: 32400000,
-        roundedStepMs: 21600000,
+        maxMs: ONE_HOUR_IN_MS * 9,
+        roundedStepMs: ONE_HOUR_IN_MS * 6,
         display: '6h'
     },
     // max: 1d
     {
-        maxMs: 86400000,
-        roundedStepMs: 43200000,
+        maxMs: ONE_DAY_IN_MS,
+        roundedStepMs: ONE_HOUR_IN_MS * 12,
         display: '12h'
     },
     // max: 1w
     {
-        maxMs: 604800000,
-        roundedStepMs: 86400000,
+        maxMs: ONE_WEEK_IN_MS,
+        roundedStepMs: ONE_DAY_IN_MS,
         display: '1d'
     },
     // max: 3w
     {
-        maxMs: 1814400000,
-        roundedStepMs: 604800000,
+        maxMs: ONE_WEEK_IN_MS * 3,
+        roundedStepMs: ONE_WEEK_IN_MS,
         display: '1w'
     },
     // max: 6w
     {
-        maxMs: 3628800000,
-        roundedStepMs: 2592000000,
+        maxMs: ONE_WEEK_IN_MS * 6,
+        roundedStepMs: ONE_DAY_IN_MS * 30,
         display: '30d'
     },
     // max: 2y
     {
-        maxMs: 63072000000,
-        roundedStepMs: 31536000000,
+        maxMs: ONE_YEAR_IN_MS * 2,
+        roundedStepMs: ONE_YEAR_IN_MS,
         display: '1y'
     }
 ];

package/dist/cjs/model/units/bytes.js

@@ -21,64 +21,76 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    BYTES_GROUP_CONFIG: ()=>BYTES_GROUP_CONFIG,
-    BYTES_UNIT_CONFIG: ()=>BYTES_UNIT_CONFIG,
-    formatBytes: ()=>formatBytes
+    BYTES_GROUP_CONFIG: function() {
+        return BYTES_GROUP_CONFIG;
+    },
+    BYTES_UNIT_CONFIG: function() {
+        return BYTES_UNIT_CONFIG;
+    },
+    formatBytes: function() {
+        return formatBytes;
+    }
 });
-const _numbro = /*#__PURE__*/ _interopRequireDefault(require("numbro"));
+const _numbro = /*#__PURE__*/ _interop_require_default(require("numbro"));
 const _constants = require("./constants");
 const _utils = require("./utils");
-function _interopRequireDefault(obj) {
+function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-const DEFAULT_NUMBRO_MANTISSA = 2;
-const bytesUnitKinds = [
-    'Bytes'
+/**
+ * We consider the units for bytes to be powers of 1000.
+ * In other words:
+ * 1 KB = 1000 bytes (1000^1 bytes)
+ * 1 MB = 1,000,000 bytes (1000^2 bytes)
+ * etc.
+ */ const DEFAULT_NUMBRO_MANTISSA = 2;
+const bytesUnits = [
+    'bytes'
 ];
 const BYTES_GROUP_CONFIG = {
     label: 'Bytes',
-    decimal_places: true,
-    abbreviate: true
+    decimalPlaces: true,
+    shortValues: true
 };
 const BYTES_UNIT_CONFIG = {
-    // These units are powers of 1000.
-    // In other words, 1 KB = 1000 bytes.
-    Bytes: {
+    bytes: {
         group: 'Bytes',
         label: 'Bytes'
     }
 };
-function formatBytes(bytes, options) {
-    const { abbreviate , decimal_places  } = options;
-    if (!(0, _utils.shouldAbbreviate)(abbreviate) || Math.abs(bytes) < 1000) {
+function formatBytes(bytes, { shortValues , decimalPlaces  }) {
+    // If we're showing the entire value, we can use Intl.NumberFormat.
+    if (!(0, _utils.shouldShortenValues)(shortValues) || Math.abs(bytes) < 1000) {
         const formatterOptions = {
             style: 'unit',
             unit: 'byte',
             unitDisplay: 'long',
             useGrouping: true
         };
-        if ((0, _utils.hasDecimalPlaces)(decimal_places)) {
-            formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
-            formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
+        if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+            formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+            formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
         } else {
             // This can happen if bytes is between -1000 and 1000
-            if ((0, _utils.shouldAbbreviate)(abbreviate)) {
+            if ((0, _utils.shouldShortenValues)(shortValues)) {
                 formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
             }
         }
-        return Intl.NumberFormat('en-US', formatterOptions).format(bytes);
+        const formatter = Intl.NumberFormat('en-US', formatterOptions);
+        return formatter.format(bytes);
     }
-    // numbro is able to add units like KB, MB, GB, etc. correctly
+    // If we're showing the shorten value, we use numbro.
+    // numbro is able to add units like KB, MB, GB, etc. correctly.
     return (0, _numbro.default)(bytes).format({
         output: 'byte',
         base: 'decimal',
         spaceSeparated: true,
-        mantissa: (0, _utils.hasDecimalPlaces)(decimal_places) ? decimal_places : DEFAULT_NUMBRO_MANTISSA,
+        mantissa: (0, _utils.hasDecimalPlaces)(decimalPlaces) ? decimalPlaces : DEFAULT_NUMBRO_MANTISSA,
         // trimMantissa trims trailing 0s
-        trimMantissa: !(0, _utils.hasDecimalPlaces)(decimal_places),
+        trimMantissa: !(0, _utils.hasDecimalPlaces)(decimalPlaces),
         // optionalMantissa excludes all the decimal places if they're all zeros
-        optionalMantissa: !(0, _utils.hasDecimalPlaces)(decimal_places)
+        optionalMantissa: !(0, _utils.hasDecimalPlaces)(decimalPlaces)
     });
 }

package/dist/cjs/model/units/constants.js

@@ -18,6 +18,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "MAX_SIGNIFICANT_DIGITS", {
     enumerable: true,
-    get: ()=>MAX_SIGNIFICANT_DIGITS
+    get: function() {
+        return MAX_SIGNIFICANT_DIGITS;
+    }
 });
 const MAX_SIGNIFICANT_DIGITS = 3;

package/dist/cjs/model/units/decimal.js

@@ -21,42 +21,48 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    DECIMAL_GROUP_CONFIG: ()=>DECIMAL_GROUP_CONFIG,
-    DECIMAL_UNIT_CONFIG: ()=>DECIMAL_UNIT_CONFIG,
-    formatDecimal: ()=>formatDecimal
+    DECIMAL_GROUP_CONFIG: function() {
+        return DECIMAL_GROUP_CONFIG;
+    },
+    DECIMAL_UNIT_CONFIG: function() {
+        return DECIMAL_UNIT_CONFIG;
+    },
+    formatDecimal: function() {
+        return formatDecimal;
+    }
 });
 const _constants = require("./constants");
 const _utils = require("./utils");
-const decimalUnitKinds = [
-    'Decimal'
+const decimalUnits = [
+    'decimal'
 ];
 const DECIMAL_GROUP_CONFIG = {
     label: 'Decimal',
-    decimal_places: true,
-    abbreviate: true
+    decimalPlaces: true,
+    shortValues: true
 };
 const DECIMAL_UNIT_CONFIG = {
-    Decimal: {
+    decimal: {
         group: 'Decimal',
         label: 'Decimal'
     }
 };
-function formatDecimal(value, options) {
-    const { abbreviate , decimal_places  } = options;
+function formatDecimal(value, { shortValues , decimalPlaces  }) {
     const formatterOptions = {
         style: 'decimal',
         useGrouping: true
     };
-    if ((0, _utils.shouldAbbreviate)(abbreviate)) {
+    if ((0, _utils.shouldShortenValues)(shortValues)) {
         formatterOptions.notation = 'compact';
     }
-    if ((0, _utils.hasDecimalPlaces)(decimal_places)) {
-        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
-        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
     } else {
-        if ((0, _utils.shouldAbbreviate)(abbreviate)) {
+        if ((0, _utils.shouldShortenValues)(shortValues)) {
             formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
         }
     }
-    return Intl.NumberFormat('en-US', formatterOptions).format(value);
+    const formatter = Intl.NumberFormat('en-US', formatterOptions);
+    return formatter.format(value);
 }

package/dist/cjs/model/units/index.js

@@ -14,18 +14,20 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./utils"), exports);
-_exportStar(require("./units"), exports);
-_exportStar(require("./constants"), exports);
-_exportStar(require("./types"), exports);
-function _exportStar(from, to) {
+_export_star(require("./utils"), exports);
+_export_star(require("./units"), exports);
+_export_star(require("./constants"), exports);
+_export_star(require("./types"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/model/units/percent.js

@@ -21,28 +21,34 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    PERCENT_GROUP_CONFIG: ()=>PERCENT_GROUP_CONFIG,
-    PERCENT_UNIT_CONFIG: ()=>PERCENT_UNIT_CONFIG,
-    formatPercent: ()=>formatPercent
+    PERCENT_GROUP_CONFIG: function() {
+        return PERCENT_GROUP_CONFIG;
+    },
+    PERCENT_UNIT_CONFIG: function() {
+        return PERCENT_UNIT_CONFIG;
+    },
+    formatPercent: function() {
+        return formatPercent;
+    }
 });
 const _constants = require("./constants");
 const _utils = require("./utils");
-const percentUnitKinds = [
-    'Percent',
-    'PercentDecimal',
+const percentUnits = [
+    'percent',
+    'percent-decimal',
     '%'
 ];
 const PERCENT_GROUP_CONFIG = {
-    label: 'Percent',
-    decimal_places: true
+    label: 'percent',
+    decimalPlaces: true
 };
 const PERCENT_GROUP = 'Percent';
 const PERCENT_UNIT_CONFIG = {
-    Percent: {
+    percent: {
         group: PERCENT_GROUP,
         label: 'Percent (0-100)'
     },
-    PercentDecimal: {
+    'percent-decimal': {
         group: PERCENT_GROUP,
         label: 'Percent (0.0-1.0)'
     },
@@ -54,20 +60,21 @@ const PERCENT_UNIT_CONFIG = {
         label: '%'
     }
 };
-function formatPercent(value, { kind , decimal_places  }) {
-    // Intl.NumberFormat translates 0 -> 0%, 0.5 -> 50%, 1 -> 100%
-    if (kind === 'Percent') {
-        value = value / 100;
-    }
+function formatPercent(value, { unit , decimalPlaces  }) {
     const formatterOptions = {
         style: 'percent',
         useGrouping: true
     };
-    if ((0, _utils.hasDecimalPlaces)(decimal_places)) {
-        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
-        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimal_places);
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
     } else {
         formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
     }
-    return Intl.NumberFormat('en-US', formatterOptions).format(value);
+    // Intl.NumberFormat translates 0 -> 0%, 0.5 -> 50%, 1 -> 100%, etc.
+    if (unit === 'percent') {
+        value = value / 100;
+    }
+    const formatter = Intl.NumberFormat('en-US', formatterOptions);
+    return formatter.format(value);
 }