overhaul

Signed-off-by: Yi Nuo <218099172+yi-nuo426@users.noreply.github.com>

Author: yi-nuo426

package-lock.json

@@ -46,7 +46,7 @@
     "@emotion/cache": "^11.14.0",
     "@eslint/compat": "^2.0.3",
     "@eslint/eslintrc": "^3.3.5",
-    "@eslint/js": "^10.0.1",
+    "@eslint/js": "^9.39.4",
     "@meshery/schemas": "^0.9.0",
     "@mui/icons-material": "^7.3.9",
     "@reduxjs/toolkit": "^2.11.2",
@@ -60,7 +60,7 @@
     "@typescript-eslint/parser": "^8.57.2",
     "commitizen": "^4.3.1",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^10.1.0",
+    "eslint": "^9.39.4",
     "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",
@@ -83,7 +83,7 @@
     "rollup": "^4.60.0",
     "ts-jest": "^29.4.6",
     "tsup": "^8.5.1",
-    "typescript": "^6.0.2",
+    "typescript": "^5.9.3",
     "xstate": "^5.28.0"
   },
   "peerDependencies": {

package.json

@@ -2,10 +2,9 @@ import {
   ClickAwayListener as MuiClickAwayListener,
   type ClickAwayListenerProps
 } from '@mui/material';
-import React from 'react';
 
-const ClickAwayListener = React.forwardRef<HTMLDivElement, ClickAwayListenerProps>((props, ref) => {
-  return <MuiClickAwayListener {...props} ref={ref} />;
-});
+const ClickAwayListener = (props: ClickAwayListenerProps) => {
+  return <MuiClickAwayListener {...props} />;
+};
 
 export default ClickAwayListener;

src/base/ClickAwayListener/ClickAwayListener.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
-import MuiGrid from '@mui/material/Grid';
 import type { GridProps as MuiGridProps } from '@mui/material/Grid';
+import MuiGrid from '@mui/material/Grid';
+import React from 'react';
 
 const Grid2 = React.forwardRef<HTMLDivElement, MuiGridProps>((props, ref) => {
   return <MuiGrid {...props} ref={ref} />;

src/base/Grid2/Grid2.tsx

@@ -16,7 +16,6 @@ export interface HiddenProps {
   mdDown?: boolean;
   lgDown?: boolean;
   xlDown?: boolean;
-
 }
 
 export const Hidden = ({
@@ -38,8 +37,7 @@ export const Hidden = ({
 
   const conditions: string[] = [];
 
-  const extractCondition = (mediaQuery: string) =>
-    mediaQuery.replace(/^@media\s*/i, '');
+  const extractCondition = (mediaQuery: string) => mediaQuery.replace(/^@media\s*/i, '');
 
   if (onlyValues.includes('xs')) {
     conditions.push(extractCondition(theme.breakpoints.only('xs')));
@@ -89,8 +87,7 @@ export const Hidden = ({
     conditions.push(extractCondition(theme.breakpoints.down('xl')));
   }
 
-  const mediaQuery =
-    conditions.length > 0 ? `@media ${conditions.join(', ')}` : '@media not all';
+  const mediaQuery = conditions.length > 0 ? `@media ${conditions.join(', ')}` : '@media not all';
 
   const matches = useMediaQuery(mediaQuery);
 

src/base/Hidden/Hidden.tsx

@@ -1,4 +1,4 @@
-import { DEFAULT_HEIGHT, DEFAULT_WIDTH, DEFAULT_FILL_NONE } from '../../constants/constants';
+import { DEFAULT_FILL_NONE, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
 import { IconProps } from '../types';
 
 export const AccessTimeIcon = ({

src/icons/AccessTime/AccessTimeIcon.tsx

@@ -8,16 +8,19 @@ export const AccessTimeFilledIcon = ({
   ...props
 }: IconProps): JSX.Element => {
   return (
-    <svg  
-        width={width}
-        height={height}
-        viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg"
-        {...props}
-     >
-        <path d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2m3.3 14.71L11 12.41V7h2v4.59l3.71 3.71z" fill={fill} />
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2m3.3 14.71L11 12.41V7h2v4.59l3.71 3.71z"
+        fill={fill}
+      />
     </svg>
   );
 };
 
-export default AccessTimeFilledIcon;
+export default AccessTimeFilledIcon;

src/icons/AccessTimeFilled/AccessTimeFilledIcon.tsx

@@ -1 +1 @@
-export { default as AccessTimeFilledIcon } from './AccessTimeFilledIcon';
+export { default as AccessTimeFilledIcon } from './AccessTimeFilledIcon';

src/icons/AccessTimeFilled/index.ts

@@ -1,4 +1,4 @@
-import { DEFAULT_HEIGHT, DEFAULT_WIDTH ,DEFAULT_FILL} from '../../constants/constants';
+import { DEFAULT_FILL, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
 import { IconProps } from '../types';
 
 export const ArticleIcon = ({

src/icons/Article/ArticleIcon.tsx

@@ -7,7 +7,6 @@ export const BuildRoundedIcon = ({
   fill = DEFAULT_FILL_NONE,
   ...props
 }: IconProps): JSX.Element => {
-
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
@@ -17,9 +16,12 @@ export const BuildRoundedIcon = ({
       data-testid="build-rounded-icon-svg"
       {...props}
     >
-      <path d="m22.7 19-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9 6 6 9 1.6 4.7C.4 7.1.9 10.1 2.9 12.1c1.9 1.9 4.6 2.4 6.9 1.5l9.1 9.1c.4.4 1 .4 1.4 0l2.3-2.3c.5-.4.5-1.1.1-1.4z" fill={fill}/>
+      <path
+        d="m22.7 19-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9 6 6 9 1.6 4.7C.4 7.1.9 10.1 2.9 12.1c1.9 1.9 4.6 2.4 6.9 1.5l9.1 9.1c.4.4 1 .4 1.4 0l2.3-2.3c.5-.4.5-1.1.1-1.4z"
+        fill={fill}
+      />
     </svg>
   );
 };
 
-export default BuildRoundedIcon;
+export default BuildRoundedIcon;