@campxdev/react-blueprint 1.4.2 → 1.5.0

package/package.json

@@ -1,10 +1,9 @@
 {
   "name": "@campxdev/react-blueprint",
-  "version": "1.4.2",
+  "version": "1.5.0",
   "main": "./export.ts",
   "private": false,
   "dependencies": {
-    "@campxdev/campx-web-utils": "0.1.5",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@mui/icons-material": "^6.1.5",
@@ -12,12 +11,11 @@
     "@mui/x-data-grid": "^7.22.1",
     "@mui/x-date-pickers": "^7.22.1",
     "@reduxjs/toolkit": "^2.2.7",
-    "@storybook/addon-backgrounds": "^8.3.1",
-    "@storybook/addon-designs": "^8.0.3",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^13.0.0",
     "@testing-library/user-event": "^13.2.1",
     "@types/jest": "^27.0.1",
+    "@types/lodash": "^4.17.13",
     "@types/node": "^16.7.13",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.3.0",
@@ -43,8 +41,7 @@
     "redux": "^5.0.1",
     "storybook-dark-mode": "^4.0.1",
     "typescript": "^5.5.2",
-    "web-vitals": "^2.1.0",
-    "yalc": "^1.0.0-pre.53"
+    "web-vitals": "^2.1.0"
   },
   "scripts": {
     "start": "react-scripts start",
@@ -76,6 +73,8 @@
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@chromatic-com/storybook": "^2.0.2",
+    "@storybook/addon-backgrounds": "^8.3.1",
+    "@storybook/addon-designs": "^8.0.3",
     "@storybook/addon-essentials": "^8.3.1",
     "@storybook/addon-interactions": "^8.3.1",
     "@storybook/addon-links": "^8.3.1",

package/src/App.tsx

@@ -2,7 +2,6 @@ import { GridColDef } from '@mui/x-data-grid';
 import { useState } from 'react';
 import './App.css';
 import { EditableDataTable, Select, SingleSelect } from './components/export';
-import { usePageHeader } from './hooks/usePageHeader';
 
 interface RowType {
   lastName: string;
@@ -13,8 +12,6 @@ interface RowType {
 function App() {
   const [status, setStatus] = useState('ok1');
 
-  const { uniqueId, density, columnVisibilityModel } = usePageHeader();
-
   const columns: GridColDef[] = [
     {
       field: 'firstName',

package/src/AppContent.tsx

@@ -1,29 +1,6 @@
-import { axios } from '@campxdev/campx-web-utils';
-import { useQuery } from 'react-query';
 import { AppHeader } from './components/export';
 
-const fetchClubRequests = () => {
-  return axios.get(`/square/clubs`).then((res) => res.data);
-};
-
-function AppContent() {
-  const {
-    data: requests,
-    isLoading,
-    error,
-    refetch,
-  } = useQuery('club-requests', fetchClubRequests);
-
-  if (isLoading) {
-    return <div>Loading...</div>;
-  }
-
-  if (error) {
-    // No need to handle the error locally, it will be caught by ErrorBoundary
-    console.error('Error fetching club requests:', error);
-    throw error; // Re-throw the error to be caught by the ErrorBoundary
-  }
-
+export const AppContent = () => {
   return (
     <AppHeader
       clientName="Anurag University"
@@ -33,6 +10,4 @@ function AppContent() {
       institutionsData={[]}
     />
   );
-}
-
-export default AppContent;
+};

package/src/components/Assets/Icons/IconComponents/AdminIcon.tsx

@@ -16,7 +16,7 @@ export const AdminIcon = ({ size = 16 }) => {
         transform="translate(-492 -188)"
       >
         <g id="frame" transform="translate(492 188)">
-          <g id="Vector" transform="translate(2.208 1.044)" fill="#121212">
+          <g id="Vector" transform="translate(2.208 1.044)" fill={color}>
             <path
               d="M 7.791670799255371 18.02291679382324 C 6.836270809173584 18.02291679382324 5.921350955963135 17.73477554321289 5.215450763702393 17.21158599853516 L 1.631850838661194 14.53637599945068 C 0.660740852355957 13.81230640411377 -0.09999914467334747 12.29828643798828 -0.09999914467334747 11.08958625793457 L -0.09999914467334747 4.889586448669434 C -0.09999914467334747 3.561296463012695 0.8729908466339111 2.158456325531006 2.115100860595703 1.695876359939575 L 6.27324104309082 0.1376064121723175 C 6.683250904083252 -0.01562358718365431 7.219511032104492 -0.1000035852193832 7.783330917358398 -0.1000035852193832 C 8.347150802612305 -0.1000035852193832 8.883410453796387 -0.01562358718365431 9.293340682983398 0.1375764161348343 L 13.4600305557251 1.695926427841187 C 14.70201110839844 2.158456325531006 15.67500114440918 3.561296463012695 15.67500114440918 4.889586448669434 L 15.67500114440918 11.0812463760376 C 15.67500114440918 12.28994655609131 14.91426086425781 13.80397605895996 13.94310092926025 14.52808666229248 L 10.35982131958008 17.20304679870605 C 9.666180610656738 17.73153686523438 8.753850936889648 18.02291679382324 7.791670799255371 18.02291679382324 Z M 7.802260875701904 1.348946452140808 C 7.412920951843262 1.348946452140808 7.042130947113037 1.403976440429688 6.784960746765137 1.499936461448669 L 2.626760959625244 3.058226346969604 C 1.946520805358887 3.311336517333984 1.350000858306885 4.170966625213623 1.350000858306885 4.897916316986084 L 1.350000858306885 11.08958625793457 C 1.350000858306885 11.83955669403076 1.89487087726593 12.92940616607666 2.493160963058472 13.37611675262451 L 6.076490879058838 16.05111694335938 C 6.516410827636719 16.38009643554688 7.140020847320557 16.56874656677246 7.787500858306885 16.56874656677246 C 8.434980392456055 16.56874656677246 9.058590888977051 16.38009643554688 9.498440742492676 16.05116653442383 L 13.0818510055542 13.37611675262451 C 13.69073104858398 12.91944599151611 14.22500038146973 11.85091686248779 14.22500038146973 11.08958625793457 L 14.22500038146973 4.889586448669434 C 14.22500038146973 4.170546531677246 13.62804126739502 3.310746431350708 12.94750118255615 3.049606323242188 L 8.789911270141602 1.491556406021118 C 8.540990829467773 1.401046395301819 8.180670738220215 1.348946452140808 7.802260875701904 1.348946452140808 Z"
               stroke="none"
@@ -24,14 +24,14 @@ export const AdminIcon = ({ size = 16 }) => {
             <path
               d="M 7.791670799255371 17.92291641235352 C 8.700000762939453 17.92291641235352 9.600000381469727 17.65624618530273 10.30000114440918 17.12291717529297 L 13.88333129882812 14.44791603088379 C 14.83333110809326 13.73958683013916 15.57500076293945 12.26458644866943 15.57500076293945 11.0812463760376 L 15.57500076293945 4.889586448669434 C 15.57500076293945 3.606246471405029 14.63333129882812 2.239586353302002 13.42500114440918 1.789586424827576 L 9.258331298828125 0.2312464118003845 C 8.433330535888672 -0.07708358764648438 7.133330821990967 -0.07708358764648438 6.30833101272583 0.2312464118003845 L 2.150000810623169 1.789586424827576 C 0.941670835018158 2.239586353302002 8.583068620282575e-07 3.606246471405029 8.583068620282575e-07 4.889586448669434 L 8.583068620282575e-07 11.08958625793457 C 8.583068620282575e-07 12.27291679382324 0.7416708469390869 13.74791622161865 1.691670894622803 14.4562463760376 L 5.275001049041748 17.13124656677246 C 5.983330726623535 17.65624618530273 6.883330821990967 17.92291641235352 7.791670799255371 17.92291641235352 M 7.802259922027588 1.248941779136658 C 8.17853832244873 1.248941779136658 8.552820205688477 1.298941850662231 8.825000762939453 1.397916436195374 L 12.98333072662354 2.956246376037598 C 13.70000076293945 3.231246471405029 14.32500076293945 4.131246566772461 14.32500076293945 4.889586448669434 L 14.32500076293945 11.08958625793457 C 14.32500076293945 11.87291622161865 13.77500057220459 12.98124599456787 13.1416711807251 13.4562463760376 L 9.558330535888672 16.13124656677246 C 8.600000381469727 16.8479175567627 6.975000858306885 16.8479175567627 6.016670703887939 16.13124656677246 L 2.433330774307251 13.4562463760376 C 1.808330893516541 12.98958683013916 1.250000834465027 11.88124656677246 1.250000834465027 11.08958625793457 L 1.250000834465027 4.897916316986084 C 1.250000834465027 4.131246566772461 1.875000834465027 3.231246471405029 2.591670751571655 2.964586496353149 L 6.750000953674316 1.406246423721313 C 7.032028198242188 1.301013350486755 7.418185234069824 1.248941779136658 7.802259922027588 1.248941779136658 M 7.791670799255371 18.12291717529297 C 6.814970970153809 18.12291717529297 5.878911018371582 17.82779693603516 5.155910968780518 17.29192733764648 L 1.572030901908875 14.61651611328125 C 0.5784108638763428 13.87565612792969 -0.199999138712883 12.326416015625 -0.199999138712883 11.08958625793457 L -0.199999138712883 4.889586448669434 C -0.199999138712883 3.522346496582031 0.8015808463096619 2.078336477279663 2.080200910568237 1.602166414260864 L 6.238151073455811 0.04396641254425049 C 6.659180641174316 -0.1133835911750793 7.207870960235596 -0.20000359416008 7.783330917358398 -0.20000359416008 C 8.358790397644043 -0.20000359416008 8.90748119354248 -0.1133835911750793 9.328340530395508 0.04390641301870346 L 13.49506092071533 1.602256417274475 C 14.77342128753662 2.078336477279663 15.77500057220459 3.522346496582031 15.77500057220459 4.889586448669434 L 15.77500057220459 11.0812463760376 C 15.77500057220459 12.31808662414551 14.99659061431885 13.8673267364502 14.00288105010986 14.60825634002686 L 10.41964054107666 17.2831859588623 C 9.709470748901367 17.82427597045898 8.775620460510254 18.12291717529297 7.791670799255371 18.12291717529297 Z M 7.802260875701904 1.448946356773376 C 7.424400806427002 1.448946356773376 7.066350936889648 1.501676440238953 6.819921016693115 1.593626379966736 L 2.661850929260254 3.151866436004639 C 2.027400970458984 3.387936353683472 1.450000882148743 4.220086574554443 1.450000882148743 4.897916316986084 L 1.450000882148743 11.08958625793457 C 1.450000882148743 11.81332683563232 1.975720882415771 12.86497688293457 2.552990913391113 13.29598617553711 L 6.136311054229736 15.97097682952881 C 6.559370994567871 16.28735733032227 7.161150932312012 16.46874618530273 7.787500858306885 16.46874618530273 C 8.413861274719238 16.46874618530273 9.015641212463379 16.28735733032227 9.43855094909668 15.97107601165771 L 13.0220308303833 13.29597663879395 C 13.59911060333252 12.86316680908203 14.12500095367432 11.81138610839844 14.12500095367432 11.08958625793457 L 14.12500095367432 4.889586448669434 C 14.12500095367432 4.219136238098145 13.54669094085693 3.38663649559021 12.91168117523193 3.142976522445679 L 8.754820823669434 1.585196375846863 C 8.517340660095215 1.498856425285339 8.16947078704834 1.448946356773376 7.802260875701904 1.448946356773376 Z"
               stroke="none"
-              fill="#121212"
+              fill={color}
             />
           </g>
           <g
             id="Vector-2"
             data-name="Vector"
             transform="translate(7.708 6.458)"
-            fill="#121212"
+            fill={color}
           >
             <path
               d="M 2.291666746139526 4.683336734771729 C 0.9728967547416687 4.683336734771729 -0.100003257393837 3.610436677932739 -0.100003257393837 2.291666746139526 C -0.100003257393837 0.9728967547416687 0.9728967547416687 -0.100003257393837 2.291666746139526 -0.100003257393837 C 3.610436677932739 -0.100003257393837 4.683336734771729 0.9728967547416687 4.683336734771729 2.291666746139526 C 4.683336734771729 3.610436677932739 3.610436677932739 4.683336734771729 2.291666746139526 4.683336734771729 Z M 2.291666746139526 1.34999680519104 C 1.772426724433899 1.34999680519104 1.34999680519104 1.772426724433899 1.34999680519104 2.291666746139526 C 1.34999680519104 2.810906648635864 1.772426724433899 3.233336687088013 2.291666746139526 3.233336687088013 C 2.810906648635864 3.233336687088013 3.233336687088013 2.810906648635864 3.233336687088013 2.291666746139526 C 3.233336687088013 1.772426724433899 2.810906648635864 1.34999680519104 2.291666746139526 1.34999680519104 Z"
@@ -40,14 +40,14 @@ export const AdminIcon = ({ size = 16 }) => {
             <path
               d="M 2.291666746139526 4.58333683013916 C 3.558336734771729 4.58333683013916 4.58333683013916 3.558336734771729 4.58333683013916 2.291666746139526 C 4.58333683013916 1.024996757507324 3.558336734771729 -3.25386054100818e-06 2.291666746139526 -3.25386054100818e-06 C 1.024996757507324 -3.25386054100818e-06 -3.25386054100818e-06 1.024996757507324 -3.25386054100818e-06 2.291666746139526 C -3.25386054100818e-06 3.558336734771729 1.024996757507324 4.58333683013916 2.291666746139526 4.58333683013916 M 2.291666746139526 1.249996781349182 C 2.866666793823242 1.249996781349182 3.33333683013916 1.716666698455811 3.33333683013916 2.291666746139526 C 3.33333683013916 2.866666793823242 2.866666793823242 3.33333683013916 2.291666746139526 3.33333683013916 C 1.716666698455811 3.33333683013916 1.249996781349182 2.866666793823242 1.249996781349182 2.291666746139526 C 1.249996781349182 1.716666698455811 1.716666698455811 1.249996781349182 2.291666746139526 1.249996781349182 M 2.291666746139526 4.783336639404297 C 0.9177567362785339 4.783336639404297 -0.2000032514333725 3.665576696395874 -0.2000032514333725 2.291666746139526 C -0.2000032514333725 0.9177567362785339 0.9177567362785339 -0.2000032514333725 2.291666746139526 -0.2000032514333725 C 3.665576696395874 -0.2000032514333725 4.783336639404297 0.9177567362785339 4.783336639404297 2.291666746139526 C 4.783336639404297 3.665576696395874 3.665576696395874 4.783336639404297 2.291666746139526 4.783336639404297 Z M 2.291666746139526 1.449996709823608 C 1.827566742897034 1.449996709823608 1.449996709823608 1.827566742897034 1.449996709823608 2.291666746139526 C 1.449996709823608 2.755766630172729 1.827566742897034 3.133336782455444 2.291666746139526 3.133336782455444 C 2.755766630172729 3.133336782455444 3.133336782455444 2.755766630172729 3.133336782455444 2.291666746139526 C 3.133336782455444 1.827566742897034 2.755766630172729 1.449996709823608 2.291666746139526 1.449996709823608 Z"
               stroke="none"
-              fill="#121212"
+              fill={color}
             />
           </g>
           <g
             id="Vector-3"
             data-name="Vector"
             transform="translate(9.375 9.792)"
-            fill="#121212"
+            fill={color}
           >
             <path
               d="M 0.625 3.849999904632568 C 0.2252299934625626 3.849999904632568 -0.1000000014901161 3.524770021438599 -0.1000000014901161 3.125 L -0.1000000014901161 0.625 C -0.1000000014901161 0.2252299934625626 0.2252299934625626 -0.1000000014901161 0.625 -0.1000000014901161 C 1.024770021438599 -0.1000000014901161 1.350000023841858 0.2252299934625626 1.350000023841858 0.625 L 1.350000023841858 3.125 C 1.350000023841858 3.524770021438599 1.024770021438599 3.849999904632568 0.625 3.849999904632568 Z"
@@ -56,7 +56,7 @@ export const AdminIcon = ({ size = 16 }) => {
             <path
               d="M 0.625 3.75 C 0.9666699767112732 3.75 1.25 3.466670036315918 1.25 3.125 L 1.25 0.625 C 1.25 0.2833299934864044 0.9666699767112732 -2.220446049250313e-16 0.625 -2.220446049250313e-16 C 0.2833299934864044 -2.220446049250313e-16 0 0.2833299934864044 0 0.625 L 0 3.125 C 0 3.466670036315918 0.2833299934864044 3.75 0.625 3.75 M 0.625 3.950000047683716 C 0.1700900048017502 3.950000047683716 -0.2000000029802322 3.579910039901733 -0.2000000029802322 3.125 L -0.2000000029802322 0.625 C -0.2000000029802322 0.1700900048017502 0.1700900048017502 -0.2000000029802322 0.625 -0.2000000029802322 C 1.079910039901733 -0.2000000029802322 1.450000047683716 0.1700900048017502 1.450000047683716 0.625 L 1.450000047683716 3.125 C 1.450000047683716 3.579910039901733 1.079910039901733 3.950000047683716 0.625 3.950000047683716 Z"
               stroke="none"
-              fill="#121212"
+              fill={color}
             />
           </g>
           <path

package/src/components/Assets/Icons/IconComponents/DownloadIcon.tsx

@@ -1,7 +1,4 @@
-import { useTheme } from '@mui/material';
-
 export const DownloadIcon = ({ size = 16 }) => {
-  const theme = useTheme();
   return (
     <div>
       <svg

package/src/components/Charts/BarChart/BarChart.tsx

@@ -1,11 +1,4 @@
-import {
-  Box,
-  Stack,
-  styled,
-  SxProps,
-  useTheme,
-  Typography,
-} from '@mui/material';
+import { Box, Stack, SxProps, Typography, useTheme } from '@mui/material';
 import {
   Bar,
   CartesianGrid,
@@ -16,6 +9,8 @@ import {
   XAxis,
   YAxis,
 } from 'recharts';
+import { LayoutType } from 'recharts/types/util/types';
+import { StyledContainer } from '../../export';
 import {
   AxisLabelProps,
   BaseAxisProps,
@@ -25,8 +20,6 @@ import {
   SubTitleProps,
   TitleProps,
 } from '../types/types';
-import { LayoutType } from 'recharts/types/util/types';
-import { StyledContainer } from '../../export';
 
 export type BarChartProps = {
   title?: string;
@@ -135,7 +128,9 @@ export const BarChart = ({
           />
         )}
         {showLegend && <Legend {...legendSx} />}
-        {bars?.map((item, index) => <Bar key={index} {...item} />)}
+        {bars?.map((item, index) => (
+          <Bar key={index} {...item} />
+        ))}
         {isVerticalLayout ? (
           <>
             <XAxis

package/src/components/Charts/LineChart/LineChart.tsx

@@ -1,6 +1,5 @@
-import { Box, Stack, SxProps, useTheme } from '@mui/material';
+import { Stack, SxProps, useTheme } from '@mui/material';
 import {
-  Bar,
   CartesianGrid,
   Label,
   Legend,
@@ -10,6 +9,8 @@ import {
   XAxis,
   YAxis,
 } from 'recharts';
+import { CurveType } from 'recharts/types/shape/Curve';
+import { Typography } from '../../export';
 import {
   AxisLabelProps,
   BaseAxisProps,
@@ -19,8 +20,6 @@ import {
   SubTitleProps,
   TitleProps,
 } from '../types/types';
-import { CurveType } from 'recharts/types/shape/Curve';
-import { Typography } from '../../export';
 
 export type LineChartProps = {
   title?: string;
@@ -150,7 +149,9 @@ export const LineChart = ({
             />
           )}
         </YAxis>
-        {lines?.map((item, index) => <Line key={index} {...item} />)}
+        {lines?.map((item, index) => (
+          <Line key={index} {...item} />
+        ))}
       </ReLineChart>
     </Stack>
   );

package/src/components/Charts/TreeMap/TreeMap.tsx

@@ -1,8 +1,8 @@
 import { Box, Stack, styled, SxProps, useTheme } from '@mui/material';
 import { Treemap as ReTreeMap, Tooltip } from 'recharts';
 import { AnimationTiming } from 'recharts/types/util/types';
-import { MarginProps, SubTitleProps, TitleProps } from '../types/types';
 import { Typography } from '../../export';
+import { MarginProps, SubTitleProps, TitleProps } from '../types/types';
 
 interface TreeMapProps {
   title?: string;
@@ -87,20 +87,7 @@ export default TreeMap;
 
 const CustomizedContent = (props: any) => {
   const theme = useTheme();
-  const {
-    root,
-    depth,
-    x,
-    y,
-    width,
-    height,
-    index,
-    payload,
-    rank,
-    name,
-    fill,
-    stroke,
-  } = props;
+  const { depth, x, y, width, height, name, fill, stroke } = props;
 
   return (
     <g {...props}>

package/src/components/DataDisplay/Avatar/Avatar.tsx

@@ -2,7 +2,6 @@ import {
   Avatar as MuiAvatar,
   AvatarProps as MuiAvatarProps,
   styled,
-  useTheme,
 } from '@mui/material';
 import { Typography } from '../Typography/Typography';
 
@@ -19,7 +18,6 @@ export const CircularAvatar = ({ text, ...rest }: CircularAvatarProps) => {
       ?.join('')
       .toUpperCase();
   };
-  const theme = useTheme();
 
   const StyledCircularAvatar = styled(MuiAvatar)(({ theme }) => ({
     height: '42px',

package/src/components/DataDisplay/Card/styles.tsx

@@ -1,11 +1,8 @@
 import {
-  Box,
   Button,
   CardActions,
-  CardContent,
   Divider,
   IconButton,
-  Card as MuiCard,
   Stack,
   styled,
   Typography,

package/src/components/Feedback/Tutorial/Tutorial.tsx

@@ -1,5 +1,5 @@
-import { axios } from '@campxdev/campx-web-utils';
 import { Box, useTheme } from '@mui/material';
+import axios from 'axios';
 import { ReactNode, useCallback, useEffect, useState } from 'react';
 import ReactJoyride, { ACTIONS, CallBackProps, Step } from 'react-joyride';
 import { Typography } from '../../DataDisplay/Typography/Typography';
@@ -34,8 +34,7 @@ export const Tutorial = ({
   }, [userTours, tourName, startTour]);
 
   const handleJoyrideCallback = (data: CallBackProps) => {
-    console.log(data);
-    const { action, status, lifecycle, type, size } = data;
+    const { action, lifecycle, type } = data;
     const reqData = {
       tourName: tourName,
       skipped: false,

package/src/components/Input/MultiCheckBox/MultiCheckBox.tsx

@@ -36,7 +36,7 @@ export const MultiCheckBox = ({
       containerProps={containerProps}
     >
       <Stack direction={direction} spacing={4}>
-        {options?.length != 0 &&
+        {options?.length !== 0 &&
           options?.map((item, index) => (
             <SingleCheckBox
               key={index}

package/src/components/Input/SingleSelect/SingleSelect.tsx

@@ -1,4 +1,3 @@
-import { axios as campxAxios } from '@campxdev/campx-web-utils';
 import {
   AutocompleteCloseReason,
   AutocompleteProps,
@@ -6,7 +5,7 @@ import {
   Autocomplete as MuiAutocomplete,
   Paper,
 } from '@mui/material';
-import axios from 'axios';
+import axios, { AxiosInstance } from 'axios';
 import _, { debounce } from 'lodash';
 import { SyntheticEvent, useEffect, useMemo, useReducer } from 'react';
 import { Typography } from '../../DataDisplay/Typography/Typography';
@@ -39,7 +38,7 @@ export type SingleSelectProps = {
   options?: { label: string; subLabel?: string; value: any }[] | any[];
   optionsApiEndPoint?: string;
   optionsApiEndpointParams?: any;
-  useCampxAxios?: boolean;
+  externalAxios?: AxiosInstance;
   required?: boolean;
   label?: string;
   name?: string;
@@ -88,7 +87,7 @@ export const SingleSelect = ({
   options,
   optionsApiEndPoint,
   optionsApiEndpointParams,
-  useCampxAxios = true,
+  externalAxios,
   required = false,
   label,
   name,
@@ -136,7 +135,7 @@ export const SingleSelect = ({
     search,
   } = state;
 
-  const internalAxios = useCampxAxios ? campxAxios : axios;
+  const internalAxios = externalAxios || axios;
 
   const handleOpen = async (event: SyntheticEvent) => {
     dispatch({
@@ -213,11 +212,11 @@ export const SingleSelect = ({
         actionType: SingleSelectActionsTypes.CLEAR_SEARCH,
         stateChanges: {
           internalOptions: internalOptions.filter((o: any) =>
-            reason != 'selectOption' ? o.value == value : o.value != value,
+            reason !== 'selectOption' ? o.value === value : o.value !== value,
           ),
           internalOptionsMap: generateOptionsMap(
             internalOptions.filter((o: any) =>
-              reason != 'selectOption' ? o.value == value : o.value != value,
+              reason !== 'selectOption' ? o.value === value : o.value !== value,
             ),
           ),
         },
@@ -287,9 +286,11 @@ export const SingleSelect = ({
       dispatch({
         actionType: SingleSelectActionsTypes.CLEAR_SEARCH,
         stateChanges: {
-          internalOptions: internalOptions.filter((o: any) => o.value == value),
+          internalOptions: internalOptions.filter(
+            (o: any) => o.value === value,
+          ),
           internalOptionsMap: generateOptionsMap(
-            internalOptions.filter((o: any) => o.value == value),
+            internalOptions.filter((o: any) => o.value === value),
           ),
         },
       });
@@ -326,11 +327,11 @@ export const SingleSelect = ({
           stateChanges: {
             internalOptions: [
               ...options,
-              ...internalOptions.filter((o: any) => o.value == value),
+              ...internalOptions.filter((o: any) => o.value === value),
             ],
             internalOptionsMap: generateOptionsMap([
               ...options,
-              ...internalOptions.filter((o: any) => o.value == value),
+              ...internalOptions.filter((o: any) => o.value === value),
             ]),
           },
         });

package/src/components/Layout/AppHeader/AppHeader.tsx

@@ -4,8 +4,6 @@ import { Typography } from '../../DataDisplay/Typography/Typography';
 import { Button } from '../../export';
 import UserBox from './AppHeaderActions/UserBox';
 import { StyledHeader } from './styles/styles';
-import { StyledIconButton } from '../../Navigation/DropDownMenu/styles';
-import { HelpIcon } from '../../Assets/Icons/IconComponents/HelpIcon';
 
 export interface AppHeaderProps {
   actions?: ReactNode[];

package/src/components/Navigation/ManageFilters/ManageFilters.tsx

@@ -1,4 +1,4 @@
-import { MenuListProps, MenuProps, Typography, useTheme } from '@mui/material';
+import { MenuListProps, MenuProps, Typography } from '@mui/material';
 import { ReactNode, useState } from 'react';
 import { Button, Icons, SearchBar, SingleCheckBox } from '../../export';
 import { DropdownMenu } from '../export';
@@ -22,7 +22,6 @@ export const ManageFilters = ({
 }: ManageFiltersProps) => {
   const [values, setValues] = useState<Options[]>([]);
   const [search, setSearch] = useState<string>('');
-  const theme = useTheme();
 
   const filteredOptions = options.filter((option) =>
     option.label.toLowerCase().includes(search.toLowerCase()),

package/src/components/Navigation/Sidebar/Components.tsx

@@ -54,7 +54,7 @@ export const InternalMenuButton = ({
   icon,
   collapsed,
 }: InternalMenuButtonProps) => {
-  const { StyledListItemButton, StyledListItemIcon, HoverIcon } = useMemo(
+  const { StyledListItemButton, StyledListItemIcon } = useMemo(
     () => createSidebarStyles(collapsed),
     [collapsed],
   );

package/src/stories/Navigation/ManageFilters.stories.tsx

@@ -65,7 +65,6 @@ Default.args = {
       label: 'Option 1',
       value: (
         <SingleSelect
-          useCampxAxios={false}
           onChange={() => {}}
           options={[
             {

package/src/utils/logout.ts

@@ -1,4 +1,4 @@
-import { axios } from '@campxdev/campx-web-utils';
+import axios from 'axios';
 import Cookies from 'js-cookie';
 
 export default function logout() {