@natoora-libs/core 0.2.22-task-management → 0.2.22-task-management-v1

package/dist/components/index.cjs

@@ -350,6 +350,7 @@ __export(components_exports, {
   FilterOptionsCheckboxes: () => FilterOptionsCheckboxes,
   FilterSimpleSelector: () => FilterSimpleSelector_default,
   FixedFooter: () => FixedFooter_default,
+  HashtagInput: () => HashtagInput,
   Header: () => Header_default,
   IconChart: () => IconChart_default,
   IconCompare: () => IconCompare_default,
@@ -8664,9 +8665,9 @@ var TableDesktop = ({
 };
 
 // src/components/TableDesktopEditableField/TableDesktopEditableField.tsx
-var import_react45 = require("react");
+var import_react48 = require("react");
 var import_Delete = __toESM(require("@mui/icons-material/Delete"), 1);
-var import_material76 = require("@mui/material");
+var import_material77 = require("@mui/material");
 var import_x_date_pickers = require("@mui/x-date-pickers");
 var import_moment3 = __toESM(require("moment"), 1);
 
@@ -8778,10 +8779,159 @@ var TableDesktopSmartSelect = ({
   );
 };
 
-// src/components/TableDesktopEditableField/TableDesktopTextField.tsx
+// src/components/TableDesktopEditableField/TableDesktopTagsField.tsx
+var import_react46 = require("react");
+
+// src/components/HashtagInput/HashtagInput.tsx
 var import_react44 = require("react");
 var import_material75 = require("@mui/material");
 var import_jsx_runtime132 = require("react/jsx-runtime");
+var import_react45 = require("react");
+var HashtagInput = ({
+  label,
+  placeholder,
+  variant,
+  error,
+  helperText,
+  onCreateTag,
+  onDeleteTag,
+  ...props
+}) => {
+  const { palette: palette2 } = (0, import_material75.useTheme)();
+  const [inputValue, setInputValue] = (0, import_react44.useState)("");
+  const sanitizeTag = (value) => {
+    return value.toLowerCase().replace(/[^a-z0-9#]/g, "").trim();
+  };
+  const handleKeyDown = (event) => {
+    if ((event.key === " " || event.key === "Enter") && inputValue) {
+      event.preventDefault();
+      event.stopPropagation();
+      const cleaned = sanitizeTag(inputValue);
+      if (!cleaned) return;
+      onCreateTag?.(cleaned);
+      setInputValue("");
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
+    import_material75.Autocomplete,
+    {
+      ...props,
+      multiple: true,
+      freeSolo: true,
+      fullWidth: true,
+      disableClearable: true,
+      value: props.value || [],
+      options: [],
+      inputValue: inputValue.toLocaleLowerCase(),
+      onInputChange: (_event, newInputValue) => {
+        setInputValue(sanitizeTag(newInputValue));
+      },
+      onChange: (_event, _newValue, reason, details) => {
+        if (reason === "removeOption" && details?.option) {
+          onDeleteTag?.(details.option);
+        }
+      },
+      renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
+        import_material75.TextField,
+        {
+          ...params,
+          label,
+          placeholder,
+          helperText,
+          variant,
+          error,
+          onKeyDown: handleKeyDown
+        }
+      ),
+      renderValue: (value, getTagProps) => value.map((option, index) => {
+        return /* @__PURE__ */ (0, import_react45.createElement)(
+          import_material75.Chip,
+          {
+            ...getTagProps({ index }),
+            key: option.id,
+            size: "small",
+            label: `#${option.tag ?? option}`,
+            sx: {
+              paddingBlock: 0,
+              color: palette2.primary.main,
+              fontWeight: "bold",
+              backgroundColor: (0, import_material75.alpha)(palette2.primary.main, 0.1)
+            }
+          }
+        );
+      })
+    }
+  );
+};
+
+// src/components/TableDesktopEditableField/TableDesktopTagsField.tsx
+var import_jsx_runtime133 = require("react/jsx-runtime");
+var TableDesktopTagsField = ({
+  initialValue,
+  inputLabel,
+  columnId,
+  rowId,
+  disabled,
+  variant = "standard",
+  size,
+  onUpdateEditableCell
+}) => {
+  const [error, setError] = (0, import_react46.useState)();
+  const [values, setValues] = (0, import_react46.useState)([]);
+  const validateTag = (tag) => {
+    if (tag.length >= 30) {
+      return false;
+    }
+    return true;
+  };
+  const handleManageTags = (tag, operation) => {
+    const isRemoving = operation === "REMOVE";
+    const isValid = validateTag(tag);
+    if (!isValid) {
+      setError("Tag must have at most 30 characters");
+      return;
+    }
+    setError(null);
+    const newTags = isRemoving ? values.filter((t) => t !== tag) : [...values, tag];
+    setValues(newTags);
+  };
+  (0, import_react46.useEffect)(() => {
+    setValues((initialValue ?? []).map((val) => val.tag));
+  }, [initialValue]);
+  return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(import_jsx_runtime133.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    HashtagInput,
+    {
+      label: inputLabel,
+      variant,
+      size,
+      disabled,
+      value: values,
+      error: !!error,
+      helperText: error,
+      onCreateTag: (tagName) => {
+        if (!tagName) return;
+        handleManageTags(tagName, "ADD");
+      },
+      onDeleteTag: (tag) => {
+        if (!tag) return;
+        handleManageTags(tag, "REMOVE");
+      },
+      onBlur: () => {
+        onUpdateEditableCell?.({
+          rowId,
+          columnId,
+          value: values,
+          label: values.join(", ")
+        });
+      }
+    }
+  ) });
+};
+
+// src/components/TableDesktopEditableField/TableDesktopTextField.tsx
+var import_react47 = require("react");
+var import_material76 = require("@mui/material");
+var import_jsx_runtime134 = require("react/jsx-runtime");
 var TableDesktopTextField = ({
   rowId,
   initialValue,
@@ -8794,13 +8944,13 @@ var TableDesktopTextField = ({
   validateInput,
   onUpdateEditableCell
 }) => {
-  const [input, setInput] = (0, import_react44.useState)(initialValue);
-  const oldValue = (0, import_react44.useRef)(initialValue);
-  const isDirty = (0, import_react44.useMemo)(
+  const [input, setInput] = (0, import_react47.useState)(initialValue);
+  const oldValue = (0, import_react47.useRef)(initialValue);
+  const isDirty = (0, import_react47.useMemo)(
     () => input !== oldValue.current,
     [input, oldValue.current]
   );
-  const hasValidationError = (0, import_react44.useMemo)(
+  const hasValidationError = (0, import_react47.useMemo)(
     () => isDirty && validateInput && !validateInput(input),
     [input, validateInput]
   );
@@ -8818,8 +8968,8 @@ var TableDesktopTextField = ({
       commitValue(input);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
-    import_material75.TextField,
+  return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
+    import_material76.TextField,
     {
       fullWidth: true,
       variant,
@@ -8851,7 +9001,7 @@ var TableDesktopTextField = ({
 };
 
 // src/components/TableDesktopEditableField/TableDesktopEditableField.tsx
-var import_jsx_runtime133 = require("react/jsx-runtime");
+var import_jsx_runtime135 = require("react/jsx-runtime");
 var TableDesktopEditableField = ({
   editInitialValue,
   rowId,
@@ -8872,8 +9022,8 @@ var TableDesktopEditableField = ({
     allowBlankSelectOption
   }
 }) => {
-  const [parsedFilterOptions, setParsedFilterOptions] = (0, import_react45.useState)();
-  (0, import_react45.useEffect)(() => {
+  const [parsedFilterOptions, setParsedFilterOptions] = (0, import_react48.useState)();
+  (0, import_react48.useEffect)(() => {
     if (filterOptions && editableCellType === "select" || editableCellType === "multipleSelect") {
       const parsedOptions = filterOptions?.map(
         (option) => ({
@@ -8885,7 +9035,7 @@ var TableDesktopEditableField = ({
     }
   }, [filterOptions, editableCellType]);
   const editableComponents = {
-    select: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    select: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       TableDesktopSmartSelect,
       {
         rowId,
@@ -8903,7 +9053,7 @@ var TableDesktopEditableField = ({
         onUpdateEditableCell
       }
     ),
-    multipleSelect: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    multipleSelect: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       TableDesktopSmartMultipleSelect,
       {
         rowId,
@@ -8920,12 +9070,12 @@ var TableDesktopEditableField = ({
         onUpdateEditableCell
       }
     ),
-    checkbox: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
-      import_material76.FormControlLabel,
+    checkbox: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
+      import_material77.FormControlLabel,
       {
         label: showCheckboxLabel ? inputLabel : "",
-        control: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
-          import_material76.Checkbox,
+        control: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
+          import_material77.Checkbox,
           {
             disableRipple: true,
             disabled,
@@ -8942,7 +9092,7 @@ var TableDesktopEditableField = ({
         )
       }
     ),
-    text: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    text: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       TableDesktopTextField,
       {
         type: "text",
@@ -8957,7 +9107,7 @@ var TableDesktopEditableField = ({
         onUpdateEditableCell
       }
     ),
-    numeric: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    numeric: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       TableDesktopTextField,
       {
         type: "numeric",
@@ -8972,7 +9122,7 @@ var TableDesktopEditableField = ({
         onUpdateEditableCell
       }
     ),
-    date: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    date: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       import_x_date_pickers.DatePicker,
       {
         defaultValue: editInitialValue ? (0, import_moment3.default)(editInitialValue, "HH:mm:ss") : void 0,
@@ -9001,7 +9151,7 @@ var TableDesktopEditableField = ({
         }
       }
     ),
-    time: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+    time: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
       import_x_date_pickers.TimePicker,
       {
         defaultValue: editInitialValue ? (0, import_moment3.default)(editInitialValue, "HH:mm:ss") : void 0,
@@ -9027,6 +9177,18 @@ var TableDesktopEditableField = ({
           }
         }
       }
+    ),
+    tags: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
+      TableDesktopTagsField,
+      {
+        initialValue: editInitialValue,
+        inputLabel,
+        variant,
+        size,
+        onUpdateEditableCell,
+        rowId,
+        columnId
+      }
     )
   };
   if (!editableCellType) {
@@ -9037,8 +9199,8 @@ var TableDesktopEditableField = ({
 
 // src/components/TableDesktopFooter/TableDesktopFooter.tsx
 var import_Refresh = __toESM(require("@mui/icons-material/Refresh"), 1);
-var import_material77 = require("@mui/material");
-var import_jsx_runtime134 = require("react/jsx-runtime");
+var import_material78 = require("@mui/material");
+var import_jsx_runtime136 = require("react/jsx-runtime");
 var TableDesktopFooter = ({
   numPages,
   page,
@@ -9049,8 +9211,8 @@ var TableDesktopFooter = ({
   refetchData,
   isFetching
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(
-    import_material77.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
+    import_material78.Box,
     {
       sx: {
         py: 1,
@@ -9061,8 +9223,8 @@ var TableDesktopFooter = ({
         borderTop: `1px solid ${colors.neutral300}`
       },
       children: [
-        refetchData ? /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
-          import_material77.Button,
+        refetchData ? /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
+          import_material78.Button,
           {
             disableRipple: true,
             variant: "text",
@@ -9073,7 +9235,7 @@ var TableDesktopFooter = ({
               ml: 1,
               gap: 1
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
               import_Refresh.default,
               {
                 fontSize: "small",
@@ -9082,22 +9244,22 @@ var TableDesktopFooter = ({
             )
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(import_material77.Box, { sx: { display: "flex", ml: "auto", py: 1 }, children: [
-          pageSize && pageSizeOptions && onPageSizeChange ? /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(import_material77.Stack, { direction: "row", spacing: 2, alignItems: "center", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material77.Typography, { fontSize: 12, children: "Rows per page:" }),
-            /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
-              import_material77.Select,
+        /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material78.Box, { sx: { display: "flex", ml: "auto", py: 1 }, children: [
+          pageSize && pageSizeOptions && onPageSizeChange ? /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material78.Stack, { direction: "row", spacing: 2, alignItems: "center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material78.Typography, { fontSize: 12, children: "Rows per page:" }),
+            /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
+              import_material78.Select,
               {
                 value: pageSize,
                 onChange: onPageSizeChange,
                 size: "small",
                 variant: "standard",
-                children: pageSizeOptions.map((pageSizeOption) => /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material77.MenuItem, { value: pageSizeOption, children: pageSizeOption }, pageSizeOption))
+                children: pageSizeOptions.map((pageSizeOption) => /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material78.MenuItem, { value: pageSizeOption, children: pageSizeOption }, pageSizeOption))
               }
             )
           ] }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
-            import_material77.Pagination,
+          /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
+            import_material78.Pagination,
             {
               color: "standard",
               count: numPages,
@@ -9112,15 +9274,15 @@ var TableDesktopFooter = ({
 };
 
 // src/components/TableDesktopCell/TableDesktopCell.tsx
-var import_react46 = require("react");
+var import_react49 = require("react");
 var import_Check3 = __toESM(require("@mui/icons-material/Check"), 1);
 var import_Close = __toESM(require("@mui/icons-material/Close"), 1);
 var import_Edit = __toESM(require("@mui/icons-material/Edit"), 1);
-var import_material78 = require("@mui/material");
-var import_jsx_runtime135 = require("react/jsx-runtime");
+var import_material79 = require("@mui/material");
+var import_jsx_runtime137 = require("react/jsx-runtime");
 var getReadOnlyBooleanIcon = (value) => {
   if (value) {
-    return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_Check3.default, { sx: { fontSize: 16 } });
+    return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_Check3.default, { sx: { fontSize: 16 } });
   }
   return "-";
 };
@@ -9142,10 +9304,10 @@ var TableDesktopCell = ({
   onCellClick,
   headCell
 }) => {
-  const [isCellHovered, setIsCellHovered] = (0, import_react46.useState)(false);
-  const [isCellInEditMode, setIsCellInEditMode] = (0, import_react46.useState)(false);
+  const [isCellHovered, setIsCellHovered] = (0, import_react49.useState)(false);
+  const [isCellInEditMode, setIsCellInEditMode] = (0, import_react49.useState)(false);
   const { width, editableCellType } = headCell;
-  (0, import_react46.useEffect)(() => {
+  (0, import_react49.useEffect)(() => {
     const handleKeyDown = (e) => {
       if (e.key === "Escape") {
         setIsCellInEditMode(false);
@@ -9163,8 +9325,8 @@ var TableDesktopCell = ({
     setIsCellInEditMode((prev) => !prev);
   };
   const isCellEditable = !!enableEditMode && !!editableCellType && !disabled;
-  return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
-    import_material78.TableCell,
+  return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
+    import_material79.TableCell,
     {
       align: "left",
       onMouseEnter: () => isCellEditable && setIsCellHovered(true),
@@ -9178,9 +9340,9 @@ var TableDesktopCell = ({
         ":hover": isCellEditable ? getCellBackgroundColor(isCellInEditMode) : void 0,
         background: enableEditMode && isCellInEditMode ? colors.lightBlueBackground : void 0
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(DynamicOverflowTooltip, { tooltipDescription: String(readOnlyValue), arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(import_jsx_runtime135.Fragment, { children: [
-        enableEditMode && isCellHovered ? /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_material78.Tooltip, { title: isCellInEditMode ? "" : "Toggle Edit Mode", children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
-          import_material78.IconButton,
+      children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(DynamicOverflowTooltip, { tooltipDescription: String(readOnlyValue), arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(import_jsx_runtime137.Fragment, { children: [
+        enableEditMode && isCellHovered ? /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material79.Tooltip, { title: isCellInEditMode ? "" : "Toggle Edit Mode", children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
+          import_material79.IconButton,
           {
             onClick: handleEditClick,
             sx: {
@@ -9194,10 +9356,10 @@ var TableDesktopCell = ({
                 backgroundColor: isCellInEditMode ? colors.lightBlueBackground : colors.neutral150
               }
             },
-            children: isCellInEditMode ? /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_Close.default, { fontSize: "small", color: "error" }) : /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_Edit.default, { fontSize: "small" })
+            children: isCellInEditMode ? /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_Close.default, { fontSize: "small", color: "error" }) : /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_Edit.default, { fontSize: "small" })
           }
         ) }) : null,
-        enableEditMode && isCellInEditMode && editableCellType ? /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
+        enableEditMode && isCellInEditMode && editableCellType ? /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
           TableDesktopEditableField,
           {
             editInitialValue,
@@ -9213,12 +9375,12 @@ var TableDesktopCell = ({
 };
 
 // src/components/TableDesktopToolbar/TableDesktopToolbar.tsx
-var import_react47 = require("react");
+var import_react50 = require("react");
 var import_Download = __toESM(require("@mui/icons-material/Download"), 1);
 var import_KeyboardArrowLeft2 = __toESM(require("@mui/icons-material/KeyboardArrowLeft"), 1);
 var import_KeyboardArrowRight2 = __toESM(require("@mui/icons-material/KeyboardArrowRight"), 1);
-var import_material79 = require("@mui/material");
-var import_jsx_runtime136 = require("react/jsx-runtime");
+var import_material80 = require("@mui/material");
+var import_jsx_runtime138 = require("react/jsx-runtime");
 var TableDesktopToolbar = ({
   toolbarLabel,
   headCells,
@@ -9241,12 +9403,12 @@ var TableDesktopToolbar = ({
   renderTableColumnConfigurationMenu,
   renderInfoIcons
 }) => {
-  const scrollRef = (0, import_react47.useRef)(null);
-  const [bulkChanges, setBulkChanges] = (0, import_react47.useState)([]);
-  const [isBulkChangesDialogOpen, setIsBulkChangesDialogOpen] = (0, import_react47.useState)(false);
-  const [isExportCsvDialogOpen, setIsExportCsvDialogOpen] = (0, import_react47.useState)(false);
-  const [resetCounter, setResetCounter] = (0, import_react47.useState)(0);
-  const visibleEditableColumns = (0, import_react47.useMemo)(
+  const scrollRef = (0, import_react50.useRef)(null);
+  const [bulkChanges, setBulkChanges] = (0, import_react50.useState)([]);
+  const [isBulkChangesDialogOpen, setIsBulkChangesDialogOpen] = (0, import_react50.useState)(false);
+  const [isExportCsvDialogOpen, setIsExportCsvDialogOpen] = (0, import_react50.useState)(false);
+  const [resetCounter, setResetCounter] = (0, import_react50.useState)(0);
+  const visibleEditableColumns = (0, import_react50.useMemo)(
     () => headCells.filter(
       (headCell) => headCell?.enabled && !!headCell?.editableCellType
     ),
@@ -9272,8 +9434,8 @@ var TableDesktopToolbar = ({
       return [...prev, { field: columnId, value, label }];
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
-    import_material79.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
+    import_material80.Box,
     {
       sx: {
         borderBottom: "1px solid",
@@ -9281,8 +9443,8 @@ var TableDesktopToolbar = ({
         maxWidth: "100%"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
-          import_material79.Box,
+        /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
+          import_material80.Box,
           {
             sx: {
               py: 1,
@@ -9293,8 +9455,8 @@ var TableDesktopToolbar = ({
               background: isBulkChangesMode ? colors.neutral150 : void 0
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
-                import_material79.Box,
+              /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
+                import_material80.Box,
                 {
                   sx: {
                     py: 1,
@@ -9304,21 +9466,21 @@ var TableDesktopToolbar = ({
                     whiteSpace: "nowrap"
                   },
                   children: [
-                    toolbarLabel ? /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_jsx_runtime136.Fragment, { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material79.Typography, { variant: "subtitle2", color: "textSecondary", children: toolbarLabel }),
-                      /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material79.Divider, { orientation: "vertical", sx: { height: 0.75, py: 2.5 } })
+                    toolbarLabel ? /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_jsx_runtime138.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material80.Typography, { variant: "subtitle2", color: "textSecondary", children: toolbarLabel }),
+                      /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material80.Divider, { orientation: "vertical", sx: { height: 0.75, py: 2.5 } })
                     ] }) : null,
-                    renderBulkChangesDialog && refetchData ? /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                      import_material79.Tooltip,
+                    renderBulkChangesDialog && refetchData ? /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                      import_material80.Tooltip,
                       {
                         title: disableBulkChangesMode ? "Access denied, you don\u2019t have permission to use this feature." : "",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                          import_material79.FormControlLabel,
+                        children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                          import_material80.FormControlLabel,
                           {
                             label: "Bulk Changes Mode",
                             disabled: disableBulkChangesMode || !visibleEditableColumns.length,
-                            control: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                              import_material79.Switch,
+                            control: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                              import_material80.Switch,
                               {
                                 size: "small",
                                 "aria-label": "bulk-changes-mode-switch",
@@ -9332,17 +9494,17 @@ var TableDesktopToolbar = ({
                   ]
                 }
               ),
-              isScrollable && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                import_material79.IconButton,
+              isScrollable && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                import_material80.IconButton,
                 {
                   "aria-label": "scroll-left",
                   sx: { padding: 0, alignSelf: "center" },
                   onClick: () => scroll("left"),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_KeyboardArrowLeft2.default, {})
+                  children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_KeyboardArrowLeft2.default, {})
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                import_material79.Box,
+              /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                import_material80.Box,
                 {
                   ref: scrollRef,
                   sx: {
@@ -9359,12 +9521,15 @@ var TableDesktopToolbar = ({
                     }
                   },
                   children: isBulkChangesMode ? visibleEditableColumns.map((headCell) => {
-                    const { id, width, editableCellType } = headCell;
-                    return editableCellType && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                      import_material79.Box,
+                    const { id, width, editableCellType, bulkUpdateDisabled } = headCell;
+                    if (bulkUpdateDisabled) {
+                      return null;
+                    }
+                    return editableCellType && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                      import_material80.Box,
                       {
                         sx: { width, flex: "0 0 auto" },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
+                        children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
                           TableDesktopEditableField,
                           {
                             headCell,
@@ -9380,18 +9545,18 @@ var TableDesktopToolbar = ({
                   }) : null
                 }
               ),
-              isScrollable && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                import_material79.IconButton,
+              isScrollable && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                import_material80.IconButton,
                 {
                   "aria-label": "scroll-right",
                   sx: { p: 0, alignSelf: "center" },
                   onClick: () => scroll("right"),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_KeyboardArrowRight2.default, {})
+                  children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_KeyboardArrowRight2.default, {})
                 }
               ),
-              isBulkChangesMode ? /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_jsx_runtime136.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                  import_material79.Button,
+              isBulkChangesMode ? /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_jsx_runtime138.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                  import_material80.Button,
                   {
                     variant: "outlined",
                     sx: { borderRadius: 25, alignSelf: "center" },
@@ -9403,8 +9568,8 @@ var TableDesktopToolbar = ({
                     children: "RESET"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                  import_material79.Button,
+                /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                  import_material80.Button,
                   {
                     variant: "contained",
                     "aria-label": "bulk-changes-apply-button",
@@ -9414,26 +9579,26 @@ var TableDesktopToolbar = ({
                     children: "APPLY"
                   }
                 )
-              ] }) : /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material79.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              ] }) : /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_material80.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                 renderInfoIcons,
-                renderExportCsvDialog ? /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material79.Tooltip, { title: "Download List", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("span", { style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                  import_material79.IconButton,
+                renderExportCsvDialog ? /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material80.Tooltip, { title: "Download List", children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)("span", { style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                  import_material80.IconButton,
                   {
                     disableRipple: true,
                     disabled: isDataEmpty,
                     "aria-label": "export-csv-button",
                     onClick: () => setIsExportCsvDialogOpen(true),
-                    children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_Download.default, { fill: colors.neutral750 })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_Download.default, { fill: colors.neutral750 })
                   }
                 ) }) }) : null,
-                renderTableColumnConfigurationMenu ? /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material79.Tooltip, { title: "Table Column Configuration", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
-                  import_material79.IconButton,
+                renderTableColumnConfigurationMenu ? /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material80.Tooltip, { title: "Table Column Configuration", children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+                  import_material80.IconButton,
                   {
                     disableRipple: true,
                     "aria-label": "table-column-config-button",
                     ref: tableToolbarMenuButtonRef,
                     onClick: onClickToolbarMenuOpen,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(IconTableEdit_default, { fill: colors.neutral750 })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(IconTableEdit_default, { fill: colors.neutral750 })
                   }
                 ) }) : null
               ] })
@@ -9466,11 +9631,11 @@ var TableDesktopToolbar = ({
 };
 
 // src/components/TableHeader/TableHeader.tsx
-var import_react48 = require("react");
+var import_react51 = require("react");
 var import_icons_material9 = require("@mui/icons-material");
-var import_material80 = require("@mui/material");
+var import_material81 = require("@mui/material");
 var import_mui53 = require("tss-react/mui");
-var import_jsx_runtime137 = require("react/jsx-runtime");
+var import_jsx_runtime139 = require("react/jsx-runtime");
 var useStyles47 = (0, import_mui53.makeStyles)()(() => ({
   sortLabel: {
     "& .MuiTableSortLabel-icon": {
@@ -9479,9 +9644,9 @@ var useStyles47 = (0, import_mui53.makeStyles)()(() => ({
   }
 }));
 var TableHeader = ({ cells, onSort = null }) => {
-  const [sortableCells, setSortableCells] = (0, import_react48.useState)([]);
+  const [sortableCells, setSortableCells] = (0, import_react51.useState)([]);
   const { classes } = useStyles47();
-  (0, import_react48.useEffect)(() => {
+  (0, import_react51.useEffect)(() => {
     setSortableCells(cells);
   }, []);
   const getNewSortDirection = (direction) => {
@@ -9515,8 +9680,8 @@ var TableHeader = ({ cells, onSort = null }) => {
     });
     setSortableCells(sortedCells);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material80.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material80.TableRow, { children: sortableCells.map((cell, key) => /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material80.TableCell, { children: cell.isSortable ? /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
-    import_material80.TableSortLabel,
+  return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_material81.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_material81.TableRow, { children: sortableCells.map((cell, key) => /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_material81.TableCell, { children: cell.isSortable ? /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
+    import_material81.TableSortLabel,
     {
       className: classes.sortLabel,
       direction: cell?.direction || "asc",
@@ -9526,12 +9691,12 @@ var TableHeader = ({ cells, onSort = null }) => {
     }
   ) : cell.label }, cell.label || key)) }) });
 };
-var TableHeader_default = (0, import_react48.memo)(TableHeader);
+var TableHeader_default = (0, import_react51.memo)(TableHeader);
 
 // src/components/TextDivider/TextDivider.tsx
-var import_material81 = require("@mui/material");
+var import_material82 = require("@mui/material");
 var import_mui54 = require("tss-react/mui");
-var import_jsx_runtime138 = require("react/jsx-runtime");
+var import_jsx_runtime140 = require("react/jsx-runtime");
 var useStyles48 = (0, import_mui54.makeStyles)()(() => ({
   icon: {
     fontSize: 20
@@ -9568,19 +9733,19 @@ var TextDivider = ({
 }) => {
   const { classes } = useStyles48();
   const iconColor = color ?? colors.neutral900;
-  return /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
-    import_material81.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
+    import_material82.Box,
     {
       display: "flex",
       alignItems: "center",
       justifyContent: "space-between",
       className: classes.container,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material81.Divider, { className: classes.leftDivider }),
-        /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material81.Button, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_material81.Box, { className: classes.center, children: [
-          Icon2 && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } }),
-          /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
-            import_material81.Typography,
+        /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.Divider, { className: classes.leftDivider }),
+        /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.Button, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(import_material82.Box, { className: classes.center, children: [
+          Icon2 && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } }),
+          /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+            import_material82.Typography,
             {
               color: "textSecondary",
               className: classes.title,
@@ -9588,9 +9753,9 @@ var TextDivider = ({
               children: title
             }
           ),
-          Icon2 && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } })
+          Icon2 && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_material81.Divider, { className: classes.rightDivider })
+        /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.Divider, { className: classes.rightDivider })
       ]
     }
   );
@@ -9602,7 +9767,7 @@ var import_react_dates = require("react-dates");
 var import_mui55 = require("tss-react/mui");
 var import_initialize = require("react-dates/initialize");
 var import_datepicker = require("react-dates/lib/css/_datepicker.css");
-var import_jsx_runtime139 = require("react/jsx-runtime");
+var import_jsx_runtime141 = require("react/jsx-runtime");
 var useStyles49 = (0, import_mui55.makeStyles)()((theme) => ({
   wrapper: {
     "& .DateRangePicker": {
@@ -9698,15 +9863,15 @@ var ThemedDateRangePicker = ({
   ...props
 }) => {
   const { classes, cx } = useStyles49();
-  return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("div", { className: cx(classes.wrapper, className), children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_react_dates.DateRangePicker, { ...props }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)("div", { className: cx(classes.wrapper, className), children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react_dates.DateRangePicker, { ...props }) });
 };
 var ThemedDateRangePicker_default = ThemedDateRangePicker;
 
 // src/components/TheToolbar/TheToolbar.tsx
-var import_react49 = require("react");
-var import_material82 = require("@mui/material");
+var import_react52 = require("react");
+var import_material83 = require("@mui/material");
 var import_mui56 = require("tss-react/mui");
-var import_jsx_runtime140 = require("react/jsx-runtime");
+var import_jsx_runtime142 = require("react/jsx-runtime");
 var useStyles50 = (0, import_mui56.makeStyles)()((theme) => ({
   menuButton: {
     color: theme.palette.primary.contrastText
@@ -9727,9 +9892,9 @@ var TheToolbar = ({
   isAuthenticated = true
 }) => {
   const { classes } = useStyles50();
-  return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(import_material82.Box, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.AppBar, { children: /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(import_material82.Toolbar, { className: classes.topBar, children: [
-      isAuthenticated ? /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_material83.Box, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material83.AppBar, { children: /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_material83.Toolbar, { className: classes.topBar, children: [
+      isAuthenticated ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
         RoundButton_default,
         {
           className: classes.menuButton,
@@ -9738,7 +9903,7 @@ var TheToolbar = ({
           onClick: handleOpen
         }
       ) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
         CompanyLogo_default,
         {
           size: "small",
@@ -9747,31 +9912,31 @@ var TheToolbar = ({
           imageLogoLightSmall
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.Box, { ml: 2, children: leftSection }),
-      /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material82.Box, { ml: "auto", children: rightSection })
+      /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material83.Box, { ml: 2, children: leftSection }),
+      /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material83.Box, { ml: "auto", children: rightSection })
     ] }) }),
     LeftDrawer
   ] });
 };
-var TheToolbar_default = (0, import_react49.memo)(TheToolbar);
+var TheToolbar_default = (0, import_react52.memo)(TheToolbar);
 
 // src/components/ToastMessage/ToastMessage.tsx
-var import_material83 = require("@mui/material");
-var import_jsx_runtime141 = require("react/jsx-runtime");
+var import_material84 = require("@mui/material");
+var import_jsx_runtime143 = require("react/jsx-runtime");
 var ToastMessage = ({
   toastType,
   toastMessage,
   open,
   onClose
-}) => /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
-  import_material83.Snackbar,
+}) => /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+  import_material84.Snackbar,
   {
     open,
     autoHideDuration: 3e3,
     onClose,
     anchorOrigin: { vertical: "top", horizontal: "right" },
-    children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
-      import_material83.Alert,
+    children: /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+      import_material84.Alert,
       {
         elevation: 6,
         variant: "filled",
@@ -9797,9 +9962,9 @@ var ToastMessage = ({
 var ToastMessage_default = ToastMessage;
 
 // src/components/TwoButtonDialog/TwoButtonDialog.tsx
-var import_material84 = require("@mui/material");
+var import_material85 = require("@mui/material");
 var import_mui57 = require("tss-react/mui");
-var import_jsx_runtime142 = require("react/jsx-runtime");
+var import_jsx_runtime144 = require("react/jsx-runtime");
 var useStyles51 = (0, import_mui57.makeStyles)()((theme) => ({
   paper: {
     padding: theme.spacing(2)
@@ -9829,20 +9994,20 @@ var TwoButtonDialog = ({
   cancelButton
 }) => {
   const { classes } = useStyles51();
-  return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
-    import_material84.Dialog,
+  return /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
+    import_material85.Dialog,
     {
       open,
       disableEnforceFocus: true,
       maxWidth: "sm",
       fullWidth: true,
       closeAfterTransition: true,
-      BackdropComponent: import_material84.Backdrop,
+      BackdropComponent: import_material85.Backdrop,
       BackdropProps: { timeout: 500 },
-      children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material84.Fade, { in: open, children: /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_material84.Paper, { className: classes.paper, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_material84.Box, { className: classes.mb, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material84.Typography, { variant: "h5", component: "div", children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
-            import_material84.Box,
+      children: /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(import_material85.Fade, { in: open, children: /* @__PURE__ */ (0, import_jsx_runtime144.jsxs)(import_material85.Paper, { className: classes.paper, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime144.jsxs)(import_material85.Box, { className: classes.mb, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(import_material85.Typography, { variant: "h5", component: "div", children: /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
+            import_material85.Box,
             {
               sx: {
                 fontWeight: 600
@@ -9850,23 +10015,23 @@ var TwoButtonDialog = ({
               children: title
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(
-            import_material84.Box,
+          /* @__PURE__ */ (0, import_jsx_runtime144.jsxs)(
+            import_material85.Box,
             {
               className: classes.mt,
               sx: {
                 fontWeight: 600
               },
               children: [
-                subtitle1 && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material84.Typography, { variant: "subtitle1", children: subtitle1 }),
-                subtitle2 && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material84.Typography, { variant: "subtitle1", children: subtitle2 })
+                subtitle1 && /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(import_material85.Typography, { variant: "subtitle1", children: subtitle1 }),
+                subtitle2 && /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(import_material85.Typography, { variant: "subtitle1", children: subtitle2 })
               ]
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_material84.Divider, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_material84.Box, { className: classes.buttonContainer, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(import_material85.Divider, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime144.jsxs)(import_material85.Box, { className: classes.buttonContainer, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
             FilledButton_default,
             {
               copy: cancelLabel,
@@ -9879,7 +10044,7 @@ var TwoButtonDialog = ({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
             FilledButton_default,
             {
               color: "primary",
@@ -9888,7 +10053,7 @@ var TwoButtonDialog = ({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(Loading_default, { isLoading: dialogLoading })
+        /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(Loading_default, { isLoading: dialogLoading })
       ] }) })
     }
   );
@@ -9896,30 +10061,30 @@ var TwoButtonDialog = ({
 var TwoButtonDialog_default = TwoButtonDialog;
 
 // src/components/UserBust/UserBust.tsx
-var import_react50 = require("react");
-var import_material85 = require("@mui/material");
-var import_jsx_runtime143 = require("react/jsx-runtime");
-var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)("div", { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
-    import_material85.Avatar,
+var import_react53 = require("react");
+var import_material86 = require("@mui/material");
+var import_jsx_runtime145 = require("react/jsx-runtime");
+var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)("div", { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+    import_material86.Avatar,
     {
       src: user.profile_picture,
       alt: "user_avatar",
       style: { width: avatarProps.width, height: avatarProps.height }
     }
   ),
-  /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)("div", { style: { paddingTop: 16 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(import_material85.Typography, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
-    /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(import_material85.Typography, { ...typographyProps.username, children: user.username })
+  /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)("div", { style: { paddingTop: 16 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(import_material86.Typography, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
+    /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(import_material86.Typography, { ...typographyProps.username, children: user.username })
   ] })
 ] });
-var UserBust_default = (0, import_react50.memo)(UserBust);
+var UserBust_default = (0, import_react53.memo)(UserBust);
 
 // src/components/icons/IconChart.tsx
-var import_jsx_runtime144 = require("react/jsx-runtime");
+var import_jsx_runtime146 = require("react/jsx-runtime");
 var SvgIconChart = (props) => {
   const { fill } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
     "svg",
     {
       width: "20",
@@ -9928,7 +10093,7 @@ var SvgIconChart = (props) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
         "path",
         {
           d: "M2.49967 11.6667L2.91634 11.725L6.72467 7.91667C6.57467 7.375 6.71634 6.75833 7.15801 6.325C7.80801 5.66667 8.85801 5.66667 9.50801 6.325C9.94967 6.75833 10.0913 7.375 9.94134 7.91667L12.083 10.0583L12.4997 10C12.6497 10 12.7913 10 12.9163 10.0583L15.8913 7.08333C15.833 6.95833 15.833 6.81667 15.833 6.66667C15.833 6.22464 16.0086 5.80072 16.3212 5.48816C16.6337 5.17559 17.0576 5 17.4997 5C17.9417 5 18.3656 5.17559 18.6782 5.48816C18.9907 5.80072 19.1663 6.22464 19.1663 6.66667C19.1663 7.10869 18.9907 7.53262 18.6782 7.84518C18.3656 8.15774 17.9417 8.33333 17.4997 8.33333C17.3497 8.33333 17.208 8.33333 17.083 8.275L14.108 11.25C14.1663 11.375 14.1663 11.5167 14.1663 11.6667C14.1663 12.1087 13.9907 12.5326 13.6782 12.8452C13.3656 13.1577 12.9417 13.3333 12.4997 13.3333C12.0576 13.3333 11.6337 13.1577 11.3212 12.8452C11.0086 12.5326 10.833 12.1087 10.833 11.6667L10.8913 11.25L8.74967 9.10833C8.48301 9.16667 8.18301 9.16667 7.91634 9.10833L4.10801 12.9167L4.16634 13.3333C4.16634 13.7754 3.99075 14.1993 3.67819 14.5118C3.36563 14.8244 2.9417 15 2.49967 15C2.05765 15 1.63372 14.8244 1.32116 14.5118C1.0086 14.1993 0.833008 13.7754 0.833008 13.3333C0.833008 12.8913 1.0086 12.4674 1.32116 12.1548C1.63372 11.8423 2.05765 11.6667 2.49967 11.6667Z",
@@ -9974,6 +10139,7 @@ var IconChart_default = SvgIconChart;
   FilterOptionsCheckboxes,
   FilterSimpleSelector,
   FixedFooter,
+  HashtagInput,
   Header,
   IconChart,
   IconCompare,