fix: type error

DODOEX · Jan 24, 2025 · d9d4caf · d9d4caf
1 parent 2c91689
commit d9d4caf
Show file tree

Hide file tree

Showing 9 changed files with 59 additions and 55 deletions.
diff --git a/packages/dodoex-components/package.json b/packages/dodoex-components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@dodoex/components",
-  "version": "3.0.2",
+  "version": "3.0.3",
   "description": "UI component library",
   "source": "src/index.ts",
   "types": "dist/types/index.d.ts",

diff --git a/packages/dodoex-components/src/Checkbox/Checkbox.tsx b/packages/dodoex-components/src/Checkbox/Checkbox.tsx
@@ -1,11 +1,9 @@
 import { Box, styled, useTheme } from '@mui/system';
-import { forwardRef } from 'react';
+import React, { forwardRef } from 'react';
 import { CheckboxProps } from './Checkbox.types';
 import { Done as CheckedIcon } from '@dodoex/icons';
 
-const Checkbox = forwardRef(function Checkbox<
-  RootComponentType extends React.ElementType,
->(
+function Checkbox<RootComponentType extends React.ElementType>(
   props: CheckboxProps<RootComponentType>,
   forwardedRef: React.ForwardedRef<Element>,
 ) {
@@ -89,6 +87,9 @@ const Checkbox = forwardRef(function Checkbox<
       </>
     </Box>
   );
-});
+}
 
-export default Checkbox;
+export default forwardRef(Checkbox) as <T extends React.ElementType>(
+  // eslint-disable-next-line no-unused-vars
+  props: CheckboxProps<T> & { ref?: React.ForwardedRef<Element> },
+) => ReturnType<typeof Checkbox>;
diff --git a/packages/dodoex-components/src/Hover/HoverAddBackground.tsx b/packages/dodoex-components/src/Hover/HoverAddBackground.tsx
@@ -7,8 +7,8 @@ interface Prop extends BoxProps {
   hoverColor?: string;
 }
 
-const HoverAddBackground = forwardRef(
-  ({ sx, hoverColor, ...other }: Prop, ref: any) => {
+const HoverAddBackground = forwardRef<HTMLDivElement, Prop>(
+  ({ sx, hoverColor, ...other }, ref) => {
     const theme = useTheme();
     const { isMobile } = useDevices();
     const isLight = theme.palette.mode === 'light';
@@ -40,4 +40,6 @@ const HoverAddBackground = forwardRef(
   },
 );
 
+HoverAddBackground.displayName = 'HoverAddBackground';
+
 export default HoverAddBackground;
diff --git a/packages/dodoex-components/src/Hover/HoverOpacity.tsx b/packages/dodoex-components/src/Hover/HoverOpacity.tsx
@@ -2,46 +2,41 @@ import { merge } from 'lodash';
 import { forwardRef } from 'react';
 import { Box, BoxProps } from '../Box';
 
-const HoverOpacity = forwardRef(
-  (
-    {
-      weak,
-      color,
-      sx,
-      ...attrs
-    }: BoxProps & {
-      weak?: boolean;
-      color?: string;
+const HoverOpacity = forwardRef<
+  HTMLDivElement,
+  BoxProps & {
+    weak?: boolean;
+    color?: string;
+  }
+>(({ weak, color, sx, ...attrs }, ref) => {
+  let defaultColor = weak ? 'text.primary' : 'text.secondary';
+  let hoverColor = weak ? 'text.secondary' : 'text.primary';
+  if (color) {
+    defaultColor = color;
+    hoverColor = color;
+  }
+  const hoverCss = {
+    '&:hover': {
+      color: hoverColor,
+      opacity: color && weak ? 0.5 : 1,
     },
-    ref: any,
-  ) => {
-    let defaultColor = weak ? 'text.primary' : 'text.secondary';
-    let hoverColor = weak ? 'text.secondary' : 'text.primary';
-    if (color) {
-      defaultColor = color;
-      hoverColor = color;
-    }
-    const hoverCss = {
-      '&:hover': {
-        color: hoverColor,
-        opacity: color && weak ? 0.5 : 1,
-      },
-    };
-    return (
-      <Box
-        ref={ref}
-        sx={merge(
-          {
-            color: defaultColor,
-            opacity: color && !weak ? 0.5 : 1,
-            ...hoverCss,
-          },
-          sx,
-        )}
-        {...attrs}
-      />
-    );
-  },
-);
+  };
+  return (
+    <Box
+      ref={ref}
+      sx={merge(
+        {
+          color: defaultColor,
+          opacity: color && !weak ? 0.5 : 1,
+          ...hoverCss,
+        },
+        sx,
+      )}
+      {...attrs}
+    />
+  );
+});
+
+HoverOpacity.displayName = 'HoverOpacity';
 
 export default HoverOpacity;
diff --git a/packages/dodoex-components/src/Input/Input.tsx b/packages/dodoex-components/src/Input/Input.tsx
@@ -125,7 +125,7 @@ const StyledInput = styled(Box)(({ theme }) => {
     `;
 });
 
-export default forwardRef(function Input(
+export default forwardRef<HTMLInputElement, InputProps>(function Input(
   {
     fullWidth,
     error,
@@ -138,8 +138,8 @@ export default forwardRef(function Input(
     dataTestId,
     inputSx,
     ...attrs
-  }: InputProps,
-  ref: React.ForwardedRef<HTMLInputElement>,
+  },
+  ref,
 ) {
   const InputBaseRootMemo = useCallback(
     (props: any) => (

diff --git a/packages/dodoex-components/src/Select/index.tsx b/packages/dodoex-components/src/Select/index.tsx
@@ -186,7 +186,8 @@ const Popup = styled('div')`
   z-index: 10;
 `;
 
-interface Props<T extends {} = SelectOption, Multiple extends boolean = false> extends SelectProps<T, Multiple> {
+interface Props<T extends {} = SelectOption, Multiple extends boolean = false>
+  extends SelectProps<T, Multiple> {
   options?: SelectOption[];
   fullWidth?: boolean;
   px?: number;
@@ -196,7 +197,10 @@ interface Props<T extends {} = SelectOption, Multiple extends boolean = false> e
   sx?: BoxProps['sx'];
 }
 
-export function Select<Value = number | string, Multiple extends boolean = false>({
+export function Select<
+  Value = number | string,
+  Multiple extends boolean = false,
+>({
   options,
   fullWidth,
   px = 20,

diff --git a/packages/dodoex-components/src/Tabs/index.ts b/packages/dodoex-components/src/Tabs/index.ts
@@ -4,3 +4,4 @@ export { TabsList } from './TabsGroup/TabsList';
 export { TabPanel } from './TabPanel';
 export { TabsGroup } from './TabsGroup';
 export { TabsButtonGroup, TabButton, TabListButton } from './TabsButtonGroup';
+export { tabClasses } from '@mui/base';
diff --git a/packages/dodoex-components/src/index.ts b/packages/dodoex-components/src/index.ts
@@ -38,6 +38,7 @@ export {
   TabsButtonGroup,
   TabButton,
   TabListButton,
+  tabClasses,
 } from './Tabs';
 export { Skeleton } from './Skeleton';
 export type { SkeletonProps } from './Skeleton';

diff --git a/packages/dodoex-widgets/package.json b/packages/dodoex-widgets/package.json
@@ -59,7 +59,7 @@
   "dependencies": {
     "@babel/runtime": "^7.17.0",
     "@dodoex/api": "3.0.3-morph.7",
-    "@dodoex/components": "3.0.2",
+    "@dodoex/components": "3.0.3",
     "@dodoex/contract-request": "^1.3.0",
     "@dodoex/dodo-contract-request": "^1.9.0-alpha.9",
     "@dodoex/icons": "^2.0.2",