dce-reactkit 3.9.4-beta-logreviewer.12 → 3.9.4-beta-logreviewer.13

package/.vscode/settings.json

@@ -1,10 +1,12 @@
 {
   "cSpell.words": [
     "Copiable",
+    "Gabe",
     "Intelli",
     "pickable",
     "Subcontext",
     "subcontexts",
-    "Uncategorized"
+    "Uncategorized",
+    "Zhang"
   ]
 }

package/dist/cjs/index.js

@@ -216,6 +216,98 @@ const LogBuiltInMetadata = {
     },
 };
 
+/**
+ * Loading spinner/indicator
+ * @author Gabe Abrams
+ */
+/*------------------------------------------------------------------------*/
+/* -------------------------------- Style ------------------------------- */
+/*------------------------------------------------------------------------*/
+const style$a = `
+/* Container fades in */
+.LoadingSpinner-container {
+  animation-name: LoadingSpinner-container-fade-in;
+  animation-duration: 0.3s;
+  animation-delay: 0.4s;
+  animation-fill-mode: both;
+  animation-timing-function: ease-out;
+}
+@keyframes LoadingSpinner-container-fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+/* Blips */
+.LoadingSpinner-blip-1,
+.LoadingSpinner-blip-2,
+.LoadingSpinner-blip-3,
+.LoadingSpinner-blip-4 {
+  font-size: 1.8rem;
+  opacity: 0.6;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
+/* First Blip */
+.LoadingSpinner-blip-1 {
+  animation: LoadingSpinner-pop-animation 2s infinite;
+}
+
+/* Second Blip */
+.LoadingSpinner-blip-2 {
+  animation: LoadingSpinner-pop-animation 2s infinite;
+  -webkit-animation-delay: 0.1s;
+  animation-delay: 0.1s;
+}
+
+/* Third Blip */
+.LoadingSpinner-blip-3 {
+  animation: LoadingSpinner-pop-animation 2s infinite;
+  animation-delay: 0.2s;
+}
+
+/* Fourth Blip */
+.LoadingSpinner-blip-4 {
+  animation: LoadingSpinner-pop-animation 2s infinite;
+  animation-delay: 0.3s;
+}
+
+/* Pop Animation for Each Blip */
+@keyframes LoadingSpinner-pop-animation {
+  0%  {
+    transform: scale(1.0);
+  }
+  10% {
+    transform: scale(1.5);
+  }
+  30% {
+    transform: scale(1.0);
+  }
+  100% {
+    transform: scale(1.0);
+  }
+}
+`;
+/*------------------------------------------------------------------------*/
+/* ------------------------------ Component ----------------------------- */
+/*------------------------------------------------------------------------*/
+const LoadingSpinner = () => {
+    /*------------------------------------------------------------------------*/
+    /* ------------------------------- Render ------------------------------- */
+    /*------------------------------------------------------------------------*/
+    // Add all four blips to a container
+    return (React__default["default"].createElement("div", { className: "text-center LoadingSpinner LoadingSpinner-container" },
+        React__default["default"].createElement("style", null, style$a),
+        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-1 me-1" }),
+        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-2 me-1" }),
+        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-3 me-1" }),
+        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-4" })));
+};
+
 /**
  * Wait for a certain number of ms
  * @author Gabe Abrams
@@ -348,6 +440,7 @@ const BASE_Z_INDEX = 1000000000;
 const BASE_Z_INDEX_ON_TOP = 2000000000;
 // Constants
 const MS_TO_ANIMATE = 200; // Animation duration
+const MS_TO_WAIT_BEFORE_SHOWING_LOADING_INDICATOR = 1000;
 // Modal type to list of buttons
 const modalTypeToModalButtonTypes = {
     [ModalType$1.Okay]: [
@@ -461,7 +554,7 @@ const getNextUniqueId = () => {
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$a = `
+const style$9 = `
   .Modal-backdrop {
     position: fixed;
     top: 0;
@@ -533,13 +626,14 @@ const Modal = (props) => {
     /*------------------------------------------------------------------------*/
     var _a;
     /* -------------- Props ------------- */
-    const { type = ModalType$1.NoButtons, size = ModalSize$1.Large, title, largeTitle, children, onClose, dontAllowBackdropExit, dontShowXButton, onTopOfOtherModals, } = props;
+    const { type = ModalType$1.NoButtons, size = ModalSize$1.Large, title, largeTitle, children, onClose, dontAllowBackdropExit, dontShowXButton, onTopOfOtherModals, isLoading, isLoadingCancelable, } = props;
     // Determine if no header either
     const noHeader = (!title && type === ModalType$1.NoButtons);
     /* -------------- State ------------- */
     // True if animation is in use
     const [animatingIn, setAnimatingIn] = React.useState(true);
     const [animatingPop, setAnimatingPop] = React.useState(false);
+    const [showModal, setShowModal] = React.useState(false);
     /* -------------- Refs -------------- */
     // Keep track of whether modal is still mounted
     const mounted = React.useRef(false);
@@ -566,6 +660,16 @@ const Modal = (props) => {
             if (mounted.current) {
                 setAnimatingIn(false);
             }
+            if (isLoading) {
+                // wait before showing modal
+                yield waitMs(MS_TO_WAIT_BEFORE_SHOWING_LOADING_INDICATOR);
+                if (mounted.current) {
+                    setShowModal(true);
+                }
+            }
+            else {
+                setShowModal(true);
+            }
         }))();
         return () => {
             mounted.current = false;
@@ -632,6 +736,15 @@ const Modal = (props) => {
     else if (animatingPop) {
         animationClass = 'Modal-animating-pop';
     }
+    // default to show close button when not loading and not show close button when loading
+    // unless downShowXButton or isLoadingCancelable
+    const showCloseButton = (
+    // The modal must have an onClose function
+    onClose
+        // ...and the close button is allowed to be visible
+        && !dontShowXButton
+        // ...and should not be shown if the modal is loading and not cancelable
+        && !(isLoading && !isLoadingCancelable));
     // Render the modal
     const contentToRender = (React__default["default"].createElement("div", { className: "modal show", tabIndex: -1, style: {
             zIndex: baseZIndex,
@@ -640,7 +753,7 @@ const Modal = (props) => {
             left: 0,
             right: 0,
         } },
-        React__default["default"].createElement("style", null, style$a),
+        React__default["default"].createElement("style", null, style$9),
         React__default["default"].createElement("div", { className: `Modal-backdrop ${backdropAnimationClass}`, style: {
                 zIndex: baseZIndex + 1,
             }, onClick: () => __awaiter(void 0, void 0, void 0, function* () {
@@ -658,7 +771,7 @@ const Modal = (props) => {
                 // Handle close
                 handleClose(ModalButtonType$1.Cancel);
             }) }),
-        React__default["default"].createElement("div", { className: `modal-dialog modal-${size} ${animationClass} modal-dialog-scrollable modal-dialog-centered`, style: {
+        showModal && (React__default["default"].createElement("div", { className: `modal-dialog modal-${size} ${animationClass} modal-dialog-scrollable modal-dialog-centered`, style: {
                 zIndex: baseZIndex + 2,
                 // Override sizes for even larger for XL
                 width: (size === ModalSize$1.ExtraLarge
@@ -690,7 +803,7 @@ const Modal = (props) => {
                                 ? '1.6rem'
                                 : undefined),
                         } }, title),
-                    (onClose && !dontShowXButton) && (React__default["default"].createElement("button", { type: "button", className: "Modal-x-button btn-close", "aria-label": "Close", style: {
+                    showCloseButton && (React__default["default"].createElement("button", { type: "button", className: "Modal-x-button btn-close", "aria-label": "Close", style: {
                             backgroundColor: (isDarkModeOn()
                                 ? 'white'
                                 : undefined),
@@ -698,14 +811,18 @@ const Modal = (props) => {
                             // Handle close
                             handleClose(ModalButtonType$1.Cancel);
                         } })))),
-                children && (React__default["default"].createElement("div", { className: "modal-body", style: {
+                React__default["default"].createElement("div", { className: "modal-body", style: {
                         color: (isDarkModeOn()
                             ? 'white'
                             : undefined),
                         backgroundColor: (isDarkModeOn()
                             ? '#444'
                             : undefined),
-                    } }, children)),
+                    } }, isLoading
+                    ? (React__default["default"].createElement(React__default["default"].Fragment, null,
+                        React__default["default"].createElement(LoadingSpinner, null),
+                        React__default["default"].createElement("span", { className: "sr-only" }, "Content loading")))
+                    : children),
                 footer && (React__default["default"].createElement("div", { className: "modal-footer pt-1 pb-1", style: {
                         color: (isDarkModeOn()
                             ? 'white'
@@ -716,7 +833,7 @@ const Modal = (props) => {
                         borderTop: (isDarkModeOn()
                             ? '0.1rem solid gray'
                             : undefined),
-                    } }, footer))))));
+                    } }, footer)))))));
     // Determine which portal to use
     const portalNumber = id.current % NUM_MODAL_PORTALS;
     // Render in a portal
@@ -1283,7 +1400,7 @@ const showSessionExpiredMessage = () => __awaiter(void 0, void 0, void 0, functi
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Style ------------------------------- */
 /*------------------------------------------------------------------------*/
-const style$9 = `
+const style$8 = `
   .AppWrapper-leave-to-url-notice {
     opacity: 0;
 
@@ -1497,105 +1614,13 @@ const AppWrapper = (props) => {
     /* --------------- Main UI -------------- */
     /*----------------------------------------*/
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement("style", null, style$9),
+        React__default["default"].createElement("style", null, style$8),
         React__default["default"].createElement("style", null, tooltipStyle),
         modal,
         customModalPortals,
         body));
 };
 
-/**
- * Loading spinner/indicator
- * @author Gabe Abrams
- */
-/*------------------------------------------------------------------------*/
-/* -------------------------------- Style ------------------------------- */
-/*------------------------------------------------------------------------*/
-const style$8 = `
-/* Container fades in */
-.LoadingSpinner-container {
-  animation-name: LoadingSpinner-container-fade-in;
-  animation-duration: 0.3s;
-  animation-delay: 0.4s;
-  animation-fill-mode: both;
-  animation-timing-function: ease-out;
-}
-@keyframes LoadingSpinner-container-fade-in {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-/* Blips */
-.LoadingSpinner-blip-1,
-.LoadingSpinner-blip-2,
-.LoadingSpinner-blip-3,
-.LoadingSpinner-blip-4 {
-  font-size: 1.8rem;
-  opacity: 0.6;
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
-
-/* First Blip */
-.LoadingSpinner-blip-1 {
-  animation: LoadingSpinner-pop-animation 2s infinite;
-}
-
-/* Second Blip */
-.LoadingSpinner-blip-2 {
-  animation: LoadingSpinner-pop-animation 2s infinite;
-  -webkit-animation-delay: 0.1s;
-  animation-delay: 0.1s;
-}
-
-/* Third Blip */
-.LoadingSpinner-blip-3 {
-  animation: LoadingSpinner-pop-animation 2s infinite;
-  animation-delay: 0.2s;
-}
-
-/* Fourth Blip */
-.LoadingSpinner-blip-4 {
-  animation: LoadingSpinner-pop-animation 2s infinite;
-  animation-delay: 0.3s;
-}
-
-/* Pop Animation for Each Blip */
-@keyframes LoadingSpinner-pop-animation {
-  0%  {
-    transform: scale(1.0);
-  }
-  10% {
-    transform: scale(1.5);
-  }
-  30% {
-    transform: scale(1.0);
-  }
-  100% {
-    transform: scale(1.0);
-  }
-}
-`;
-/*------------------------------------------------------------------------*/
-/* ------------------------------ Component ----------------------------- */
-/*------------------------------------------------------------------------*/
-const LoadingSpinner = () => {
-    /*------------------------------------------------------------------------*/
-    /* ------------------------------- Render ------------------------------- */
-    /*------------------------------------------------------------------------*/
-    // Add all four blips to a container
-    return (React__default["default"].createElement("div", { className: "text-center LoadingSpinner LoadingSpinner-container" },
-        React__default["default"].createElement("style", null, style$8),
-        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-1 me-1" }),
-        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-2 me-1" }),
-        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-3 me-1" }),
-        React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-4" })));
-};
-
 /**
  * A box with a tab on the top that holds buttons and other content
  * @author Gabe Abrams
@@ -1627,7 +1652,9 @@ const style$7 = `
 
   /* Container for Title */
   .TabBox-title-container {
-    /* Place on Left */
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
     position: relative;
     left: 0;
     text-align: left;
@@ -1660,6 +1687,19 @@ const style$7 = `
     background: #fdfdfd;
   }
 
+  .TabBox-title-right-container {
+    display: flex;
+    flex-direction: row;
+    align-items: bottom;
+    height: 2.4rem;
+    overflow: visible;
+  }
+
+  .TabBox-title-right-contents {
+    margin-right: 0.5rem;
+    margin-bottom: 0.2rem;
+  }
+
   /* Make the TabBox's Children Appear Above Title if Overlap Occurs */
   .TabBox-children {
     position: relative;
@@ -1673,19 +1713,16 @@ const TabBox = (props) => {
     /*------------------------------------------------------------------------*/
     /* -------------------------------- Setup ------------------------------- */
     /*------------------------------------------------------------------------*/
-    /* -------------- Props ------------- */
-    const { title, children, noBottomPadding, noBottomMargin, } = props;
+    const { title, children, topRightChildren, noBottomPadding, noBottomMargin, } = props;
     /*------------------------------------------------------------------------*/
     /* ------------------------------- Render ------------------------------- */
     /*------------------------------------------------------------------------*/
-    /*----------------------------------------*/
-    /* --------------- Main UI -------------- */
-    /*----------------------------------------*/
-    // Full UI
     return (React__default["default"].createElement("div", { className: `TabBox-container ${noBottomMargin ? '' : 'mb-2'}` },
         React__default["default"].createElement("style", null, style$7),
         React__default["default"].createElement("div", { className: "TabBox-title-container" },
-            React__default["default"].createElement("div", { className: "TabBox-title" }, title)),
+            React__default["default"].createElement("div", { className: "TabBox-title" }, title),
+            topRightChildren && (React__default["default"].createElement("div", { className: "TabBox-title-right-container" },
+                React__default["default"].createElement("div", { className: "TabBox-title-right-contents" }, topRightChildren)))),
         React__default["default"].createElement("div", { className: `TabBox-box ps-2 pt-2 pe-2 ${noBottomPadding ? '' : 'pb-2'}` },
             React__default["default"].createElement("div", { className: "TabBox-children" }, children))));
 };
@@ -1722,7 +1759,7 @@ const RadioButton = (props) => {
             React__default["default"].createElement("div", { className: "me-1" },
                 React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: selected ? freeSolidSvgIcons.faDotCircle : freeRegularSvgIcons.faCircle })),
             useComplexFormatting
-                ? (React__default["default"].createElement("pre", { className: "ps-1 text-start text-break", style: {
+                ? (React__default["default"].createElement("pre", { className: "ps-1 text-start text-break m-0", style: {
                         whiteSpace: 'pre-wrap',
                         tabSize: 2,
                     } }, text))
@@ -1770,7 +1807,7 @@ const CheckboxButton = (props) => {
             React__default["default"].createElement("div", { className: "me-1" },
                 React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: icon })),
             useComplexFormatting
-                ? (React__default["default"].createElement("pre", { className: "ps-1 text-start text-break", style: {
+                ? (React__default["default"].createElement("pre", { className: "ps-1 text-start text-break m-0", style: {
                         whiteSpace: 'pre-wrap',
                         tabSize: 2,
                     } }, text))
@@ -2672,7 +2709,7 @@ const NestableItemList = (props) => {
                 React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: childExpanded[item.id] ? freeSolidSvgIcons.faChevronDown : freeSolidSvgIcons.faChevronRight })))),
             React__default["default"].createElement(CheckboxButton, { className: `NestableItemList-CheckboxButton-${item.id}`, text: item.name, checked: item.isGroup ? allChecked(item.children) : item.checked, dashed: item.isGroup ? !noneChecked(item.children) : false, onChanged: (checked) => {
                     onChanged(changeChecked(item.id, checked, items));
-                }, ariaLabel: `Select ${item.name}`, checkedVariant: Variant$1.Light }),
+                }, ariaLabel: `Select ${item.name}`, checkedVariant: Variant$1.Light, uncheckedVariant: Variant$1.Light }),
             (item.isGroup && childExpanded[item.id]) && (React__default["default"].createElement("div", { className: "NestableItemList-children-container", style: {
                     paddingLeft: '2.2rem',
                 } },
@@ -2695,17 +2732,62 @@ const ItemPicker = (props) => {
     /*------------------------------------------------------------------------*/
     /* -------------- Props ------------- */
     // Destructure all props
-    const { title, items, onChanged, noBottomMargin, } = props;
+    const { title, items, onChanged, noBottomMargin, hideSelectAllOrNoneButtons, } = props;
     /*------------------------------------------------------------------------*/
     /* ------------------------- Component Functions ------------------------ */
     /*------------------------------------------------------------------------*/
+    /**
+     * Updates the checked state of an item (including all children)
+     * @author Yuen Ler Chow
+     * @param item the item to update
+     * @param checked the new checked state
+     * @returns the updated item
+     */
+    const updateItemChecked = (item, checked) => {
+        if (item.isGroup) {
+            return Object.assign(Object.assign({}, item), { children: item.children.map((child) => {
+                    return updateItemChecked(child, checked);
+                }) });
+        }
+        return Object.assign(Object.assign({}, item), { checked });
+    };
+    /**
+     * Selects all items in the list
+     * @author Yuen Ler Chow
+     */
+    const handleSelectAll = () => {
+        const updatedItems = items.map((item) => {
+            return updateItemChecked(item, true);
+        });
+        onChanged(updatedItems);
+    };
+    /**
+     * Deselects all items in the list
+     * @author Yuen Ler Chow
+     */
+    const handleDeselectAll = () => {
+        const updatedItems = items.map((item) => {
+            return updateItemChecked(item, false);
+        });
+        onChanged(updatedItems);
+    };
     /*------------------------------------------------------------------------*/
     /* ------------------------------- Render ------------------------------- */
     /*------------------------------------------------------------------------*/
     /*----------------------------------------*/
     /* --------------- Main UI -------------- */
     /*----------------------------------------*/
-    return (React__default["default"].createElement(TabBox, { title: title, noBottomMargin: noBottomMargin },
+    // Select all/none
+    const selectAllOrNone = (!hideSelectAllOrNoneButtons
+        ? (React__default["default"].createElement("div", { className: "d-flex h-100 align-items-end flex-row" },
+            React__default["default"].createElement("div", { className: "d-flex justify-content-end" },
+                React__default["default"].createElement("div", { className: "me-2", style: { fontSize: '1.2rem' } }, "Select"),
+                React__default["default"].createElement("div", { className: "btn-group", role: "group" },
+                    React__default["default"].createElement("button", { type: "button", style: { borderRight: '0.1rem solid white' }, "aria-label": "Select all contexts", className: "btn btn-secondary py-0", onClick: handleSelectAll }, "All"),
+                    React__default["default"].createElement("button", { type: "button", "aria-label": "Deselect all contexts", className: "btn btn-secondary py-0", onClick: handleDeselectAll }, "None")))))
+        : undefined);
+    // Main UI
+    return (React__default["default"].createElement(TabBox, { title: title, noBottomMargin: noBottomMargin, topRightChildren: selectAllOrNone },
         React__default["default"].createElement("div", { style: { overflowX: 'auto' } },
             React__default["default"].createElement(NestableItemList, { items: items, onChanged: onChanged }))));
 };
@@ -3077,7 +3159,7 @@ const IntelliTable = (props) => {
                             param: column.param,
                             visible: checked,
                         });
-                    }, checked: columnVisibilityMap[column.param], ariaLabel: `show "${column.title}" column in the ${title} table`, checkedVariant: Variant$1.Light, uncheckedVariant: Variant$1.Secondary }));
+                    }, checked: columnVisibilityMap[column.param], ariaLabel: `show "${column.title}" column in the ${title} table`, checkedVariant: Variant$1.Light, uncheckedVariant: Variant$1.Light }));
             }),
             React__default["default"].createElement("div", { className: "mt-3" }, "Or you can:"),
             React__default["default"].createElement("button", { type: "button", id: `IntelliTable-${id}-select-all-columns`, className: "btn btn-secondary me-2", "aria-label": `show all columns in the ${title} table`, onClick: () => {
@@ -4266,6 +4348,7 @@ const LogReviewer = (props) => {
             // Create filter UI
             filterDrawer = (React__default["default"].createElement(ItemPicker, { title: "Context", items: pickableItems, onChanged: (updatedItems) => {
                     // Update our state
+                    const newContextFilterState = Object.assign({}, pendingContextFilterState);
                     updatedItems.forEach((pickableItem) => {
                         if (pickableItem.isGroup) {
                             // Has subcontexts
@@ -4273,36 +4356,29 @@ const LogReviewer = (props) => {
                                 // Built-in
                                 // Treat as if these were top-level contexts
                                 pickableItem.children.forEach((subcontextItem) => {
-                                    const newContextFilterState = Object.assign(Object.assign({}, pendingContextFilterState), { [subcontextItem.id]: 'checked' in subcontextItem
-                                            && subcontextItem.checked });
-                                    dispatch({
-                                        type: ActionType$6.UpdateContextFilterState,
-                                        contextFilterState: newContextFilterState,
-                                    });
+                                    newContextFilterState[subcontextItem.id] = ('checked' in subcontextItem
+                                        && subcontextItem.checked);
                                 });
                             }
                             else {
                                 // Not built-in
                                 pickableItem.children.forEach((subcontextItem) => {
                                     if (!subcontextItem.isGroup) {
-                                        const newContextFilterState = Object.assign(Object.assign({}, pendingContextFilterState), { [pickableItem.id]: Object.assign(Object.assign({}, pendingContextFilterState[pickableItem.id]), { [subcontextItem.id]: subcontextItem.checked }) });
-                                        dispatch({
-                                            type: ActionType$6.UpdateContextFilterState,
-                                            contextFilterState: newContextFilterState,
-                                        });
+                                        newContextFilterState[pickableItem.id][subcontextItem.id] = (subcontextItem.checked);
                                     }
                                 });
                             }
                         }
                         else {
                             // No subcontexts
-                            const newContextFilterState = Object.assign(Object.assign({}, pendingContextFilterState), { [pickableItem.id]: pickableItem.checked });
-                            dispatch({
-                                type: ActionType$6.UpdateContextFilterState,
-                                contextFilterState: newContextFilterState,
-                            });
+                            newContextFilterState[pickableItem.id] = (pickableItem.checked);
                         }
                     });
+                    // Update state
+                    dispatch({
+                        type: ActionType$6.UpdateContextFilterState,
+                        contextFilterState: newContextFilterState,
+                    });
                 } }));
         }
         else if (expandedFilterDrawer === FilterDrawer.Tag) {
@@ -16419,6 +16495,27 @@ const visitEndpointOnAnotherServer = (opts) => __awaiter(void 0, void 0, void 0,
     return body;
 });
 
+const punctuationRegex = /[!@#$%^&*(),.?\/;:'"\-\[\]]/g;
+/**
+ * Get number of words in string
+ * @author Gardenia Liu
+ * @author Allison Zhang
+ * @author Gabe Abrams
+ * @param text the string to check
+ * @returns number of words in the string
+ */
+const getWordCount = (text) => {
+    const trimmedTextWithoutPunctuation = (text
+        // Remove leading and trailing whitespace
+        .trim()
+        // Remove punctuation
+        .replace(punctuationRegex, ''));
+    if (trimmedTextWithoutPunctuation.length === 0) {
+        return 0;
+    }
+    return trimmedTextWithoutPunctuation.split(/\s+/g).length;
+};
+
 /**
  * Days of the week
  * @author Gabe Abrams
@@ -16503,6 +16600,7 @@ exports.getMonthName = getMonthName;
 exports.getOrdinal = getOrdinal;
 exports.getPartOfDay = getPartOfDay;
 exports.getTimeInfoInET = getTimeInfoInET;
+exports.getWordCount = getWordCount;
 exports.handleError = handleError;
 exports.handleSuccess = handleSuccess;
 exports.idify = idify;