dce-reactkit 4.2.4-beta.heat-seek.1 → 4.2.6

package/dist/cjs/types/components/ProgressBar.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Customizable Progress Bar component using Bootstrap styles
+ * @author Allison Zhang
+ */
+import React from 'react';
+import Variant from '../types/Variant';
+import ProgressBarSize from '../types/ProgressBarSize';
+type Props = (({
+    percentProgress: number;
+    numDecimalPlaces?: number;
+} | {
+    numComplete: number;
+    total: number;
+}) & {
+    striped?: boolean;
+    variant?: Variant;
+    bgVariant?: Variant;
+    showOutline?: boolean;
+    size?: ProgressBarSize;
+});
+declare const ProgressBar: React.FC<Props>;
+export default ProgressBar;

package/dist/cjs/types/helpers/getTimestampFromTimeInfoInET.d.ts

@@ -7,7 +7,7 @@
  * @param opts.month Month (1-12)
  * @param opts.day Day of the month (1-31)
  * @param opts.hour Hour (0-23)
- * @param opts.minute Minute (0-59)
+ * @param opts.minute Minute (0-59))
  * @returns Timestamp in milliseconds since epoch
  */
 declare const getTimestampFromTimeInfoInET: (opts: {

package/dist/cjs/types/index.d.ts

@@ -23,6 +23,7 @@ import ToggleSwitch from './components/ToggleSwitch';
 import AutoscrollToBottomContainer from './components/AutoscrollToBottomContainer';
 import MultiSwitch from './components/MultiSwitch';
 import Dropdown from './components/Dropdown';
+import ProgressBar from './components/ProgressBar';
 import ErrorWithCode from './errors/ErrorWithCode';
 import MINUTE_IN_MS from './constants/MINUTE_IN_MS';
 import HOUR_IN_MS from './constants/HOUR_IN_MS';
@@ -107,4 +108,4 @@ import PickableItem from './components/ItemPicker/types/PickableItem';
 import DBEntry from './components/DBEntryManagerPanel/types/DBEntry';
 import DBEntryField from './components/DBEntryManagerPanel/types/DBEntryField';
 import DBEntryFieldType from './components/DBEntryManagerPanel/types/DBEntryFieldType';
-export { AppWrapper, LoadingSpinner, ErrorBox, Modal, TabBox, RadioButton, CheckboxButton, ButtonInputGroup, SimpleDateChooser, SimpleTimeChooser, Drawer, PopSuccessMark, PopFailureMark, PopPendingMark, CopiableBox, ItemPicker, LogReviewer, IntelliTable, CSVDownloadButton, DBEntryManagerPanel, Tooltip, ToggleSwitch, AutoscrollToBottomContainer, MultiSwitch, Dropdown, alert, prompt, confirm, showFatalError, ErrorWithCode, MINUTE_IN_MS, HOUR_IN_MS, DAY_IN_MS, LOG_REVIEW_ROUTE_PATH_PREFIX, LOG_ROUTE_PATH, LOG_REVIEW_STATUS_ROUTE, LOG_REVIEW_GET_LOGS_ROUTE, SELECT_ADMIN_CHECK_ROUTE, DynamicWord, abbreviate, avg, ceilToNumDecimals, floorToNumDecimals, forceNumIntoBounds, padDecimalZeros, padZerosLeft, roundToNumDecimals, sum, waitMs, getOrdinal, getTimeInfoInET, stubServerEndpoint, startMinWait, getHumanReadableDate, getPartOfDay, stringsToHumanReadableList, onlyKeepLetters, parallelLimit, getMonthName, genCSV, canReviewLogs, isMobileOrTablet, extractProp, compareArraysByProp, genCommaList, validateEmail, validatePhoneNumber, validateString, getLocalTimeInfo, idify, makeLinksClickable, prefixWithAOrAn, everyAsync, filterAsync, forEachAsync, mapAsync, someAsync, capitalize, shuffleArray, getWordCount, cloneDeep, getTimestampFromTimeInfoInET, isSelectAdmin, initClient, visitServerEndpoint, logClientEvent, addFatalErrorHandler, leaveToURL, combineClassNames, useForceRender, setClientEventMetadataPopulator, ParamType, ModalButtonType, ModalSize, ModalType, ReactKitErrorCode, Variant, DayOfWeek, Log, LogType, LogSource, LogAction, LogBuiltInMetadata, LogMetadataType, LogFunction, LogTypeSpecificInfo, LogMainInfo, LogSourceSpecificInfo, LogLevel, IntelliTableColumn, DropdownItemType, LogReviewerFilterState, PickableItem, DBEntry, DBEntryField, DBEntryFieldType, };
+export { AppWrapper, LoadingSpinner, ErrorBox, Modal, TabBox, RadioButton, CheckboxButton, ButtonInputGroup, SimpleDateChooser, SimpleTimeChooser, Drawer, PopSuccessMark, PopFailureMark, PopPendingMark, CopiableBox, ItemPicker, LogReviewer, IntelliTable, CSVDownloadButton, DBEntryManagerPanel, Tooltip, ToggleSwitch, AutoscrollToBottomContainer, MultiSwitch, Dropdown, ProgressBar, alert, prompt, confirm, showFatalError, ErrorWithCode, MINUTE_IN_MS, HOUR_IN_MS, DAY_IN_MS, LOG_REVIEW_ROUTE_PATH_PREFIX, LOG_ROUTE_PATH, LOG_REVIEW_STATUS_ROUTE, LOG_REVIEW_GET_LOGS_ROUTE, SELECT_ADMIN_CHECK_ROUTE, DynamicWord, abbreviate, avg, ceilToNumDecimals, floorToNumDecimals, forceNumIntoBounds, padDecimalZeros, padZerosLeft, roundToNumDecimals, sum, waitMs, getOrdinal, getTimeInfoInET, stubServerEndpoint, startMinWait, getHumanReadableDate, getPartOfDay, stringsToHumanReadableList, onlyKeepLetters, parallelLimit, getMonthName, genCSV, canReviewLogs, isMobileOrTablet, extractProp, compareArraysByProp, genCommaList, validateEmail, validatePhoneNumber, validateString, getLocalTimeInfo, idify, makeLinksClickable, prefixWithAOrAn, everyAsync, filterAsync, forEachAsync, mapAsync, someAsync, capitalize, shuffleArray, getWordCount, cloneDeep, getTimestampFromTimeInfoInET, isSelectAdmin, initClient, visitServerEndpoint, logClientEvent, addFatalErrorHandler, leaveToURL, combineClassNames, useForceRender, setClientEventMetadataPopulator, ParamType, ModalButtonType, ModalSize, ModalType, ReactKitErrorCode, Variant, DayOfWeek, Log, LogType, LogSource, LogAction, LogBuiltInMetadata, LogMetadataType, LogFunction, LogTypeSpecificInfo, LogMainInfo, LogSourceSpecificInfo, LogLevel, IntelliTableColumn, DropdownItemType, LogReviewerFilterState, PickableItem, DBEntry, DBEntryField, DBEntryFieldType, };

package/dist/cjs/types/types/ProgressBarSize.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Progress bar sizes
+ * @author Allison Zhang
+ */
+declare enum ProgressBarSize {
+    Small = "Small",
+    Medium = "Medium",
+    Large = "Large"
+}
+export default ProgressBarSize;

package/dist/esm/index.js

@@ -882,7 +882,7 @@ var ReactDOM = /*@__PURE__*/getDefaultExportFromCjs(reactDom.exports);
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$a = `
+const style$b = `
 /* Container fades in */
 .LoadingSpinner-container {
   animation-name: LoadingSpinner-container-fade-in;
@@ -960,7 +960,7 @@ const LoadingSpinner = () => {
     /*------------------------------------------------------------------------*/
     // Add all four blips to a container
     return (React__default.createElement("div", { className: "text-center LoadingSpinner LoadingSpinner-container" },
-        React__default.createElement("style", null, style$a),
+        React__default.createElement("style", null, style$b),
         React__default.createElement(FontAwesomeIcon, { icon: faCircle, className: "LoadingSpinner-blip-1 me-1" }),
         React__default.createElement(FontAwesomeIcon, { icon: faCircle, className: "LoadingSpinner-blip-2 me-1" }),
         React__default.createElement(FontAwesomeIcon, { icon: faCircle, className: "LoadingSpinner-blip-3 me-1" }),
@@ -1224,7 +1224,7 @@ const getNextUniqueId = () => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$9 = `
+const style$a = `
   .Modal-backdrop {
     position: fixed;
     top: 0;
@@ -1423,7 +1423,7 @@ const Modal = (props) => {
             left: 0,
             right: 0,
         } },
-        React__default.createElement("style", null, style$9),
+        React__default.createElement("style", null, style$a),
         React__default.createElement("div", { className: `Modal-backdrop ${backdropAnimationClass}`, style: {
                 zIndex: baseZIndex + 1,
             }, onClick: () => __awaiter(void 0, void 0, void 0, function* () {
@@ -2074,7 +2074,7 @@ const showSessionExpiredMessage = () => __awaiter(void 0, void 0, void 0, functi
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$8 = `
+const style$9 = `
   .AppWrapper-leave-to-url-notice {
     opacity: 0;
 
@@ -2288,7 +2288,7 @@ const AppWrapper = (props) => {
     /* --------------- Main UI -------------- */
     /*----------------------------------------*/
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("style", null, style$8),
+        React__default.createElement("style", null, style$9),
         React__default.createElement("style", null, tooltipStyle),
         modal,
         customModalPortals,
@@ -2302,7 +2302,7 @@ const AppWrapper = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$7 = `
+const style$8 = `
   /* Tab Box */
   .TabBox-box {
     /* Light Border */
@@ -2392,7 +2392,7 @@ const TabBox = (props) => {
     /* ------------------------------- Render ------------------------------- */
     /*------------------------------------------------------------------------*/
     return (React__default.createElement("div", { className: `TabBox-container ${noBottomMargin ? '' : 'mb-2'}` },
-        React__default.createElement("style", null, style$7),
+        React__default.createElement("style", null, style$8),
         React__default.createElement("div", { className: "TabBox-title-container" },
             React__default.createElement("div", { className: "TabBox-title", style: { minWidth: minTitleWidth } }, title),
             topRightChildren && (React__default.createElement("div", { className: "TabBox-title-right-container" },
@@ -3025,7 +3025,7 @@ const SimpleTimeChooser = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$6 = `
+const style$7 = `
   .Drawer-container {
     margin-left: 1rem;
     margin-right: 1rem;
@@ -3061,7 +3061,7 @@ const Drawer = (props) => {
                 ? '#E2E3E5'
                 : (customBackgroundColor !== null && customBackgroundColor !== void 0 ? customBackgroundColor : undefined)),
         } },
-        React__default.createElement("style", null, style$6),
+        React__default.createElement("style", null, style$7),
         children));
 };
 
@@ -3072,7 +3072,7 @@ const Drawer = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$5 = `
+const style$6 = `
   .PopSuccessMark-outer-container {
     position: relative;
     display: inline-block;
@@ -3177,7 +3177,7 @@ const PopSuccessMark = (props) => {
             width: `${sizeRem}rem`,
             height: `${sizeRem}rem`,
         }, "aria-label": "checkmark indicating success" },
-        React__default.createElement("style", null, style$5),
+        React__default.createElement("style", null, style$6),
         React__default.createElement("div", { className: `PopSuccessMark-check-stroke-1 bg-${checkVariant}`, style: {
                 borderRadius: `${sizeRem / 5}rem`,
             } }),
@@ -3193,7 +3193,7 @@ const PopSuccessMark = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$4 = `
+const style$5 = `
   .PopFailureMark-outer-container {
     position: relative;
     display: inline-block;
@@ -3297,7 +3297,7 @@ const PopFailureMark = (props) => {
             width: `${sizeRem}rem`,
             height: `${sizeRem}rem`,
         }, "aria-label": "mark indicating failure" },
-        React__default.createElement("style", null, style$4),
+        React__default.createElement("style", null, style$5),
         React__default.createElement("div", { className: `PopFailureMark-x-stroke-1 bg-${xVariant}`, style: {
                 borderRadius: `${sizeRem / 5}rem`,
             } }),
@@ -3313,7 +3313,7 @@ const PopFailureMark = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$3 = `
+const style$4 = `
   .PopPendingMark-outer-container {
     position: relative;
     display: inline-block;
@@ -3386,7 +3386,7 @@ const PopPendingMark = (props) => {
             width: `${sizeRem}rem`,
             height: `${sizeRem}rem`,
         }, "aria-label": "mark indicating that the item is pending" },
-        React__default.createElement("style", null, style$3),
+        React__default.createElement("style", null, style$4),
         React__default.createElement("div", null,
             React__default.createElement(FontAwesomeIcon, { icon: faHourglass, className: `PopPendingMark-hourglass text-${hourglassVariant}`, style: {
                     fontSize: `${sizeRem * 0.6}rem`,
@@ -4474,7 +4474,7 @@ var FilterDrawer;
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$2 = `
+const style$3 = `
   .LogReviewer-outer-container {
     /* Full Screen */
     display: inline-block;
@@ -5637,7 +5637,7 @@ const LogReviewer = (props) => {
         !loading && logs.length > 0 && paginationControls));
     /* ---------- Wrap in Modal --------- */
     return (React__default.createElement("div", { className: "LogReviewer-outer-container" },
-        React__default.createElement("style", null, style$2),
+        React__default.createElement("style", null, style$3),
         React__default.createElement("div", { className: "LogReviewer-inner-container" },
             React__default.createElement("div", { className: "LogReviewer-header" },
                 React__default.createElement("div", { className: "LogReviewer-header-title" },
@@ -13906,7 +13906,7 @@ const CreatableMultiselect = (props) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$1 = `
+const style$2 = `
   .AddOrEditDBEntry-input-label {
     min-width: 7rem;
   }
@@ -14284,7 +14284,7 @@ const AddOrEditDBEntry = (props) => {
     /* --------------- Main UI -------------- */
     /*----------------------------------------*/
     return (React__default.createElement("div", { className: "alert alert-light text-black" },
-        React__default.createElement("style", null, style$1),
+        React__default.createElement("style", null, style$2),
         body));
 };
 
@@ -14660,7 +14660,7 @@ const idify = (str) => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style = `
+const style$1 = `
   .AutoscrollToBottomContainer-outer-container {
     /* Take up all space */
     height: 100%;
@@ -14896,7 +14896,7 @@ const AutoscrollToBottomContainer = (props) => {
     }
     // Main UI
     return (React__default.createElement("div", { className: "AutoscrollToBottomContainer-outer-container" },
-        React__default.createElement("style", null, style),
+        React__default.createElement("style", null, style$1),
         jumpToBottomButton,
         React__default.createElement("div", { className: "AutoscrollToBottomContainer-scrollable-container", onScroll: handleScroll, ref: container },
             messageBeforeItems,
@@ -15299,6 +15299,229 @@ const Dropdown = (props) => {
         }))));
 };
 
+/**
+ * Progress bar sizes
+ * @author Allison Zhang
+ */
+var ProgressBarSize;
+(function (ProgressBarSize) {
+    ProgressBarSize["Small"] = "Small";
+    ProgressBarSize["Medium"] = "Medium";
+    ProgressBarSize["Large"] = "Large";
+})(ProgressBarSize || (ProgressBarSize = {}));
+var ProgressBarSize$1 = ProgressBarSize;
+
+/**
+ * Customizable Progress Bar component using Bootstrap styles
+ * @author Allison Zhang
+ */
+/*------------------------------------------------------------------------*/
+/* ------------------------------ Constants ----------------------------- */
+/*------------------------------------------------------------------------*/
+// Multiplier for calculating width of number of items
+const ITEM_WIDTH_MULTIPLIER = 1.3;
+// Constant for percent width
+const PERCENT_WIDTH = 3;
+// Constant for item width
+const ITEM_WIDTH = 2;
+/*------------------------------------------------------------------------*/
+/* -------------------------------- Style ------------------------------- */
+/*------------------------------------------------------------------------*/
+// Base styles
+let style = `
+  .ProgressBar-number-of,
+  .ProgressBar-percent {
+    flex: 0 0 auto;
+    white-space: nowrap;
+    padding-right: 0.5em;
+    padding-left: 0.25em;
+    text-align: right;
+    transition: width .25s ease;
+  }
+
+  .ProgressBar-background {
+    overflow: hidden;
+  }
+
+  .ProgressBar-bar {
+    transition: width 1s ease;
+    overflow: hidden;
+  }
+`;
+/*------------------------------------------------------------------------*/
+/* ------------------------------ Component ----------------------------- */
+/*------------------------------------------------------------------------*/
+const ProgressBar = (props) => {
+    /*------------------------------------------------------------------------*/
+    /* -------------------------------- Setup ------------------------------- */
+    /*------------------------------------------------------------------------*/
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+    /* -------------- Props ------------- */
+    // Destructure props
+    const { striped, variant = Variant$1.Warning, bgVariant = Variant$1.Secondary, showOutline, size = ProgressBarSize$1.Medium, } = props;
+    /* -------------- Status ------------- */
+    // Determine progress status
+    let status;
+    // Check whether to use percent or items
+    if ('percentProgress' in props) {
+        // Percent
+        const { percentProgress, numDecimalPlaces, } = props;
+        status = {
+            usePercent: true,
+            percentProgress,
+            numDecimalPlaces,
+        };
+    }
+    else {
+        // Items
+        const { numComplete, total, } = props;
+        status = {
+            usePercent: false,
+            numComplete,
+            total,
+        };
+    }
+    /*------------------------------------------------------------------------*/
+    /* ------------------------------- Render ------------------------------- */
+    /*------------------------------------------------------------------------*/
+    /*----------------------------------------*/
+    /* ---------------- Sizes --------------- */
+    /*----------------------------------------*/
+    // Size styles
+    switch (size) {
+        case ProgressBarSize$1.Small:
+            // Small size
+            style += `
+        .ProgressBar-container .ProgressBar-number-of, .ProgressBar-container .ProgressBar-percent {
+          font-size: 1em;
+        }
+        .ProgressBar-container .ProgressBar-background {
+          height: 1.5em;
+          border-radius: 0.5em;
+        }
+        .ProgressBar-container .ProgressBar-bar {
+          height: 1.5em;
+          border-radius: 0.5em;
+        }
+        .ProgressBar-percent {
+          min-width: ${((status.usePercent ? (_a = status.numDecimalPlaces) !== null && _a !== void 0 ? _a : 0 : 0) * 1) + PERCENT_WIDTH}em;
+          max-width: ${((status.usePercent ? (_b = status.numDecimalPlaces) !== null && _b !== void 0 ? _b : 0 : 0) * 1) + PERCENT_WIDTH}em;
+        }
+        .ProgressBar-number-of {
+          min-width: ${((!status.usePercent ? ((_c = status.total) === null || _c === void 0 ? void 0 : _c.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+          max-width: ${((!status.usePercent ? ((_d = status.total) === null || _d === void 0 ? void 0 : _d.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+        }
+      `;
+            break;
+        case ProgressBarSize$1.Medium:
+            // Medium size
+            style += `
+        .ProgressBar-container .ProgressBar-number-of, .ProgressBar-container .ProgressBar-percent {
+          font-size: 1.5em;
+        }
+        .ProgressBar-container .ProgressBar-background {
+          height: 2em;
+          border-radius: 0.7em;
+        }
+        .ProgressBar-container .ProgressBar-bar {
+          height: 2em;
+          border-radius: 0.7em;
+        }
+        .ProgressBar-percent {
+          min-width: ${((status.usePercent ? (_e = status.numDecimalPlaces) !== null && _e !== void 0 ? _e : 0 : 0) * 1) + PERCENT_WIDTH}em;
+          max-width: ${((status.usePercent ? (_f = status.numDecimalPlaces) !== null && _f !== void 0 ? _f : 0 : 0) * 1) + PERCENT_WIDTH}em;
+        }
+        .ProgressBar-number-of {
+          min-width: ${((!status.usePercent ? ((_g = status.total) === null || _g === void 0 ? void 0 : _g.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+          max-width: ${((!status.usePercent ? ((_h = status.total) === null || _h === void 0 ? void 0 : _h.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+        }
+      `;
+            break;
+        case ProgressBarSize$1.Large:
+            // Large size
+            style += `
+        .ProgressBar-container .ProgressBar-number-of, .ProgressBar-container .ProgressBar-percent {
+          font-size: 2em;
+        }
+        .ProgressBar-container .ProgressBar-background {
+          height: 3em;
+          border-radius: 1em;
+        }
+        .ProgressBar-container .ProgressBar-bar {
+          height: 3em;
+          border-radius: 1em;
+        }
+        .ProgressBar-percent {
+          min-width:  ${((status.usePercent ? (_j = status.numDecimalPlaces) !== null && _j !== void 0 ? _j : 0 : 0) * 1) + PERCENT_WIDTH}em;
+          max-width:  ${((status.usePercent ? (_k = status.numDecimalPlaces) !== null && _k !== void 0 ? _k : 0 : 0) * 1) + PERCENT_WIDTH}em;
+        }
+        .ProgressBar-number-of {
+          min-width: ${((!status.usePercent ? ((_l = status.total) === null || _l === void 0 ? void 0 : _l.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+          max-width: ${((!status.usePercent ? ((_m = status.total) === null || _m === void 0 ? void 0 : _m.toString().length) || 1 : 0) * ITEM_WIDTH_MULTIPLIER) + ITEM_WIDTH}em;
+        }
+      `;
+            break;
+    }
+    // Get the width of the outline based on size
+    const outlineWidth = (() => {
+        switch (size) {
+            case ProgressBarSize$1.Small: return '0.05em';
+            case ProgressBarSize$1.Medium: return '0.08em';
+            case ProgressBarSize$1.Large: return '0.1em';
+            default: return '0.05em';
+        }
+    })();
+    /*----------------------------------------*/
+    /* --------------- Stripes -------------- */
+    /*----------------------------------------*/
+    // Stripes style
+    const stripesStyle = `
+    .ProgressBar-stripes {
+      background-image: linear-gradient(315deg, #ffffff 25%, #000000 25%, #000000 50%, #ffffff 50%, #ffffff 75%, #000000 75%, #000000 100%);
+      background-size: 6em 6em;
+      animation: ProgressBar-stripe-animation 2.5s linear infinite;
+      opacity: 0.09;
+    }
+    @keyframes ProgressBar-stripe-animation {
+      0% {
+        background-position: -6em 0;
+      }
+      100% {
+        background-position: 0 0;
+      }
+    }
+  `;
+    // Stripes for striped effect
+    const stripes = (React__default.createElement("div", null,
+        React__default.createElement("style", null, stripesStyle),
+        React__default.createElement("div", { className: "ProgressBar-stripes position-absolute ", style: {
+                width: '200%',
+                height: '100%',
+            } }, "\u00A0")));
+    /*----------------------------------------*/
+    /* --------------- Main UI -------------- */
+    /*----------------------------------------*/
+    // Render the progress bar
+    return (React__default.createElement("div", { className: "ProgressBar-container d-flex align-items-center" },
+        React__default.createElement("style", null, style),
+        !status.usePercent && status.numComplete && (React__default.createElement("span", { className: "ProgressBar-number-of pe-2 align-self-center" },
+            status.numComplete,
+            "\u00A0of\u00A0",
+            status.total)),
+        status.usePercent && status.percentProgress && (React__default.createElement("span", { className: "ProgressBar-percent pe-2 align-self-center" },
+            status.percentProgress.toFixed((_o = status === null || status === void 0 ? void 0 : status.numDecimalPlaces) !== null && _o !== void 0 ? _o : 0),
+            "%")),
+        React__default.createElement("div", { className: `ProgressBar-background bg-${bgVariant} w-100`, style: {
+                boxShadow: `0 0 0 ${outlineWidth} ${showOutline ? '#000' : '#DEE2E6'}`,
+            }, "aria-valuenow": status.usePercent ? status.percentProgress : status.numComplete, "aria-valuemin": 0, "aria-valuemax": status.usePercent ? 100 : status.total },
+            React__default.createElement("div", { className: `ProgressBar-bar bg-${variant} text-start position-relative`, style: {
+                    width: `${(status.usePercent ? status.percentProgress : (status.numComplete / status.total) * 100)}%`,
+                    overflow: 'hidden',
+                } },
+                striped && stripes,
+                "\u00A0"))));
+};
+
 /**
  * One minute in ms
  * @author Gabe Abrams
@@ -16358,58 +16581,6 @@ const getWordCount = (text) => {
 };
 
 // Import shared types
-/*----------------------------------------*/
-/* --------------- Helpers -------------- */
-/*----------------------------------------*/
-/**
- * Check if a timestamp is valid
- * @param opts object containing all arguments
- * @param opts.timestamp Timestamp in milliseconds since epoch
- * @param opts.expectedYear Expected year
- * @param opts.expectedMonth Expected month
- * @param opts.expectedDay Expected day
- * @param opts.expectedHour Expected hour
- * @param opts.expectedMinute Expected minute
- * @returns 1 if the timestamp needs to be increased, -1 if it needs to be decreased, 0 if it is valid
- */
-const checkTimestamp = (opts) => {
-    const { timestamp, expectedYear, expectedMonth, expectedDay, expectedHour, expectedMinute, } = opts;
-    const timeInfoInET = getTimeInfoInET(timestamp);
-    if (timeInfoInET.year < expectedYear) {
-        return 1;
-    }
-    if (timeInfoInET.year > expectedYear) {
-        return -1;
-    }
-    if (timeInfoInET.month < expectedMonth) {
-        return 1;
-    }
-    if (timeInfoInET.month > expectedMonth) {
-        return -1;
-    }
-    if (timeInfoInET.day < expectedDay) {
-        return 1;
-    }
-    if (timeInfoInET.day > expectedDay) {
-        return -1;
-    }
-    if (timeInfoInET.hour < expectedHour) {
-        return 1;
-    }
-    if (timeInfoInET.hour > expectedHour) {
-        return -1;
-    }
-    if (timeInfoInET.minute < expectedMinute) {
-        return 1;
-    }
-    if (timeInfoInET.minute > expectedMinute) {
-        return -1;
-    }
-    return 0;
-};
-/*----------------------------------------*/
-/* ---------------- Main ---------------- */
-/*----------------------------------------*/
 /**
  * Get a timestamp (ms since epoch) from time info (year, month, day, hour, minute, etc.) in Eastern Time (ET)
  * @author Gardenia Liu
@@ -16419,7 +16590,7 @@ const checkTimestamp = (opts) => {
  * @param opts.month Month (1-12)
  * @param opts.day Day of the month (1-31)
  * @param opts.hour Hour (0-23)
- * @param opts.minute Minute (0-59)
+ * @param opts.minute Minute (0-59))
  * @returns Timestamp in milliseconds since epoch
  */
 const getTimestampFromTimeInfoInET = (opts) => {
@@ -16437,46 +16608,18 @@ const getTimestampFromTimeInfoInET = (opts) => {
     const min = padZerosLeft(minute, 2);
     // Build ET ISO string and convert to UTC timestamp
     const etISOString = `${year}-${mm}-${dd}T${hh}:${min}:00${etOffset}`;
-    let timestamp = (new Date(etISOString)).getTime();
-    // Heat seek to get the right timestamp
-    const maxOffset = 24 * 60; // 24 hours in minutes
-    let currentOffset = 0; // minutes
-    const offsetIncrement = 15; // minutes
-    const offsetDirection = checkTimestamp({
-        timestamp,
-        expectedYear: year,
-        expectedMonth: month,
-        expectedDay: day,
-        expectedHour: hour,
-        expectedMinute: minute,
-    });
-    if (offsetDirection === 0) {
-        // Valid! Return the timestamp
-        return timestamp;
-    }
-    // Heat seek
-    while (Math.abs(currentOffset) < maxOffset) {
-        // Update offset
-        currentOffset += (offsetDirection * offsetIncrement);
-        // Update timestamp
-        const offsetMs = currentOffset * 60 * 1000;
-        timestamp += offsetMs;
-        // Check timestamp again
-        const newDirection = checkTimestamp({
-            timestamp,
-            expectedYear: year,
-            expectedMonth: month,
-            expectedDay: day,
-            expectedHour: hour,
-            expectedMinute: minute,
-        });
-        if (newDirection === 0) {
-            // Valid! Return the timestamp
-            return timestamp;
-        }
-        // Invalid. Keep looping.
-    }
-    throw new ErrorWithCode(`Timestamp mismatch: expected ${year}-${mm}-${dd} ${hh}:${min}, seeked to offset ${currentOffset} minutes but could not find a valid timestamp.`, ReactKitErrorCode$1.ETTimestampInvalid);
+    const timestamp = (new Date(etISOString)).getTime();
+    // Verify that the timestamp is correct
+    const timeInfoInET = getTimeInfoInET(timestamp);
+    if (timeInfoInET.year !== year
+        || timeInfoInET.month !== month
+        || timeInfoInET.day !== day
+        || timeInfoInET.hour !== hour
+        || timeInfoInET.minute !== minute) {
+        throw new ErrorWithCode(`Timestamp mismatch: expected ${year}-${mm}-${dd} ${hh}:${min}, got ${timeInfoInET.year}-${padZerosLeft(timeInfoInET.month, 2)}-${padZerosLeft(timeInfoInET.day, 2)} ${padZerosLeft(timeInfoInET.hour, 2)}:${padZerosLeft(timeInfoInET.minute, 2)}`, ReactKitErrorCode$1.ETTimestampInvalid);
+    }
+    // Valid! Return the timestamp
+    return timestamp;
 };
 
 /*------------------------------------------------------------------------*/
@@ -16531,5 +16674,5 @@ var DayOfWeek;
 })(DayOfWeek || (DayOfWeek = {}));
 var DayOfWeek$1 = DayOfWeek;
 
-export { AppWrapper, AutoscrollToBottomContainer, ButtonInputGroup, CSVDownloadButton, CheckboxButton, CopiableBox, DAY_IN_MS, DBEntryFieldType$1 as DBEntryFieldType, DBEntryManagerPanel, DayOfWeek$1 as DayOfWeek, Drawer, Dropdown, DropdownItemType$1 as DropdownItemType, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, ItemPicker, LOG_REVIEW_GET_LOGS_ROUTE, LOG_REVIEW_ROUTE_PATH_PREFIX, LOG_REVIEW_STATUS_ROUTE, LOG_ROUTE_PATH, LoadingSpinner, LogAction$1 as LogAction, LogBuiltInMetadata, LogLevel$1 as LogLevel, LogReviewer, LogSource$1 as LogSource, LogType$1 as LogType, MINUTE_IN_MS, Modal, ModalButtonType$1 as ModalButtonType, ModalSize$1 as ModalSize, ModalType$1 as ModalType, MultiSwitch, ParamType$1 as ParamType, PopFailureMark, PopPendingMark, PopSuccessMark, RadioButton, ReactKitErrorCode$1 as ReactKitErrorCode, SELECT_ADMIN_CHECK_ROUTE, SimpleDateChooser, SimpleTimeChooser, TabBox, ToggleSwitch, Tooltip, Variant$1 as Variant, abbreviate, addFatalErrorHandler, alert, avg, canReviewLogs, capitalize, ceilToNumDecimals, cloneDeep, combineClassNames, compareArraysByProp, confirm, everyAsync, extractProp, filterAsync, floorToNumDecimals, forEachAsync, forceNumIntoBounds, genCSV, genCommaList, getHumanReadableDate, getLocalTimeInfo, getMonthName, getOrdinal, getPartOfDay, getTimeInfoInET, getTimestampFromTimeInfoInET, getWordCount, idify, initClient, isMobileOrTablet, isSelectAdmin, leaveToURL, logClientEvent, makeLinksClickable, mapAsync, onlyKeepLetters, padDecimalZeros, padZerosLeft, parallelLimit, prefixWithAOrAn, prompt, roundToNumDecimals, setClientEventMetadataPopulator, showFatalError, shuffleArray, someAsync, startMinWait, stringsToHumanReadableList, stubServerEndpoint, sum, useForceRender, validateEmail, validatePhoneNumber, validateString, visitServerEndpoint, waitMs };
+export { AppWrapper, AutoscrollToBottomContainer, ButtonInputGroup, CSVDownloadButton, CheckboxButton, CopiableBox, DAY_IN_MS, DBEntryFieldType$1 as DBEntryFieldType, DBEntryManagerPanel, DayOfWeek$1 as DayOfWeek, Drawer, Dropdown, DropdownItemType$1 as DropdownItemType, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, ItemPicker, LOG_REVIEW_GET_LOGS_ROUTE, LOG_REVIEW_ROUTE_PATH_PREFIX, LOG_REVIEW_STATUS_ROUTE, LOG_ROUTE_PATH, LoadingSpinner, LogAction$1 as LogAction, LogBuiltInMetadata, LogLevel$1 as LogLevel, LogReviewer, LogSource$1 as LogSource, LogType$1 as LogType, MINUTE_IN_MS, Modal, ModalButtonType$1 as ModalButtonType, ModalSize$1 as ModalSize, ModalType$1 as ModalType, MultiSwitch, ParamType$1 as ParamType, PopFailureMark, PopPendingMark, PopSuccessMark, ProgressBar, RadioButton, ReactKitErrorCode$1 as ReactKitErrorCode, SELECT_ADMIN_CHECK_ROUTE, SimpleDateChooser, SimpleTimeChooser, TabBox, ToggleSwitch, Tooltip, Variant$1 as Variant, abbreviate, addFatalErrorHandler, alert, avg, canReviewLogs, capitalize, ceilToNumDecimals, cloneDeep, combineClassNames, compareArraysByProp, confirm, everyAsync, extractProp, filterAsync, floorToNumDecimals, forEachAsync, forceNumIntoBounds, genCSV, genCommaList, getHumanReadableDate, getLocalTimeInfo, getMonthName, getOrdinal, getPartOfDay, getTimeInfoInET, getTimestampFromTimeInfoInET, getWordCount, idify, initClient, isMobileOrTablet, isSelectAdmin, leaveToURL, logClientEvent, makeLinksClickable, mapAsync, onlyKeepLetters, padDecimalZeros, padZerosLeft, parallelLimit, prefixWithAOrAn, prompt, roundToNumDecimals, setClientEventMetadataPopulator, showFatalError, shuffleArray, someAsync, startMinWait, stringsToHumanReadableList, stubServerEndpoint, sum, useForceRender, validateEmail, validatePhoneNumber, validateString, visitServerEndpoint, waitMs };
 //# sourceMappingURL=index.js.map