Source

style/calculateHeightPercentageByAspectRatio.js

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var isNum_1 = __importDefault(require("../number/isNum"));
var MAX_PERCENT = 100;
/**
 * Convert aspect ratio to height percentage for use in the container
 * @param aspectRatio The floating number of aspect ratio of format (W/H). e.g. 12/8
 * @param fallbackPercentage (optional) in format of "XX%". If invalid, use "100%"
 * @returns height in format of "XX%", which is percentage of height to width (H/W)
 * @category style
 * @module calculateHeightPercentageByAspectRatio
 */
var calculateHeightPercentageByAspectRatio = function (aspectRatio, fallbackPercentage) {
    if (fallbackPercentage === void 0) { fallbackPercentage = '100%'; }
    // If is number
    if ((0, isNum_1.default)(aspectRatio, true)) {
        // AspectRatio is W/H but padding top is H/W
        return "".concat(MAX_PERCENT / parseFloat(aspectRatio.toString()), "%");
        // If in format of "number:number"
    }
    else if (/^(\d*\.)?\d+:(\d*\.)?\d+$/.test(aspectRatio.toString())) {
        var _a = aspectRatio.toString().split(':'), _b = _a[0], width = _b === void 0 ? '1' : _b, _c = _a[1], height = _c === void 0 ? '1' : _c;
        return "".concat(MAX_PERCENT * (parseFloat(height) / parseFloat(width)), "%");
    }
    // Fallback
    return /^(\d*\.)?\d+%$/.test(fallbackPercentage) ? fallbackPercentage : '100%';
};
exports.default = calculateHeightPercentageByAspectRatio;