@trap_stevo/legendarybuilderproreact-ui
Version:
The legendary UI & utility API that makes your application a legendary application. ~ Created by Steven Compton
57 lines • 4.3 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["progressPercentageLabelConfigurationSettings", "progressBarBackgroundConfigurationSettings", "progressBarContainerConfigurationSettings", "progressBarConfigurationSettings", "displayPercentageWithinBar", "displayPercentage", "currentPercentage"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import * as React from 'react';
import { useState, useEffect, useRef } from 'react';
import { useNavigate } from "react-router-dom";
function HUDProgressBar(hudProgressBarConfigurationSettings) {
var _hudProgressBarConfig = hudProgressBarConfigurationSettings.progressPercentageLabelConfigurationSettings,
progressPercentageLabelConfigurationSettings = _hudProgressBarConfig === void 0 ? {} : _hudProgressBarConfig,
_hudProgressBarConfig2 = hudProgressBarConfigurationSettings.progressBarBackgroundConfigurationSettings,
progressBarBackgroundConfigurationSettings = _hudProgressBarConfig2 === void 0 ? {} : _hudProgressBarConfig2,
_hudProgressBarConfig3 = hudProgressBarConfigurationSettings.progressBarContainerConfigurationSettings,
progressBarContainerConfigurationSettings = _hudProgressBarConfig3 === void 0 ? {} : _hudProgressBarConfig3,
_hudProgressBarConfig4 = hudProgressBarConfigurationSettings.progressBarConfigurationSettings,
progressBarConfigurationSettings = _hudProgressBarConfig4 === void 0 ? {} : _hudProgressBarConfig4,
_hudProgressBarConfig5 = hudProgressBarConfigurationSettings.displayPercentageWithinBar,
displayPercentageWithinBar = _hudProgressBarConfig5 === void 0 ? false : _hudProgressBarConfig5,
_hudProgressBarConfig6 = hudProgressBarConfigurationSettings.displayPercentage,
displayPercentage = _hudProgressBarConfig6 === void 0 ? true : _hudProgressBarConfig6,
_hudProgressBarConfig7 = hudProgressBarConfigurationSettings.currentPercentage,
currentPercentage = _hudProgressBarConfig7 === void 0 ? 0 : _hudProgressBarConfig7,
rest = _objectWithoutProperties(hudProgressBarConfigurationSettings, _excluded);
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
style: _objectSpread({
display: "flex",
alignItems: "center",
width: "69vw"
}, progressBarContainerConfigurationSettings)
}, /*#__PURE__*/React.createElement("div", {
style: _objectSpread({
backgroundColor: "rgba(227, 227, 227, 1)",
borderRadius: "0.569rem",
width: "calc(100%)",
marginTop: "0.69rem"
}, progressBarBackgroundConfigurationSettings)
}, /*#__PURE__*/React.createElement("div", {
style: _objectSpread({
position: "relative",
backgroundColor: "rgba(187.69, 27, 27, 1)",
borderRadius: "1rem",
transition: "width 0.269s",
height: "0.269rem",
width: "".concat(currentPercentage, "%")
}, progressBarConfigurationSettings)
}, displayPercentageWithinBar === true && displayPercentage ? /*#__PURE__*/React.createElement("span", {
style: _objectSpread({
marginLeft: "1rem"
}, progressPercentageLabelConfigurationSettings)
}, currentPercentage.toFixed(2), "%") : /*#__PURE__*/React.createElement(React.Fragment, null))), displayPercentageWithinBar === false && displayPercentage ? /*#__PURE__*/React.createElement("span", {
style: _objectSpread({
marginLeft: "1rem"
}, progressPercentageLabelConfigurationSettings)
}, currentPercentage.toFixed(2), "%") : /*#__PURE__*/React.createElement(React.Fragment, null)));
}
export default HUDProgressBar;