fix(ui-react): eslint error

.lintstagedrc.js

@@ -1,14 +1,14 @@
 export default {
-    "packages/ui-universal/**/*.{js,cjs,ts,json,css,scss,tsx,sass}": () => [
+    "packages/ui-universal/**/**.{js,cjs,ts,json,css,scss,tsx,sass}": () => [
         "pnpm --filter @sast/ui-universal lint",
         "pnpm --filter @sast/ui-universal build",
         "git add ."
     ],
-    "docs/**/*.{js,cjs,ts,html,json,css,scss,tsx,sass,md,mdx}": () => [
+    "docs/**/**.{js,cjs,ts,html,json,css,scss,tsx,sass,md,mdx}": () => [
         "pnpm --filter @sast/ui-docs build",
         "git add ."
     ],
-    "packages/ui-react/**/*.{js,cjs,ts,html,json,css,scss,tsx,sass}": () => [
+    "packages/ui-react/**/**.{js,cjs,ts,html,json,css,scss,tsx,sass}": () => [
         // "pnpm --filter @sast/ui-react test",
         "pnpm --filter @sast/ui-react format",
         "pnpm --filter @sast/ui-react lint",

docs/package.json

@@ -9,7 +9,7 @@
   },
   "dependencies": {
     "@ui-aurora/react": "workspace:^",
-    "@sast/ui-universal": "workspace:^",
+    "@ui-aurora/universal": "workspace:^",
     "@theguild/remark-mermaid": "^0.0.6",
     "rspress": "^1.16.0"
   },

packages/ui-react/lib/Calendar/Calendar.tsx

@@ -90,6 +90,8 @@ export const Calendar = React.forwardRef<HTMLDivElement, CalendarProps>(
       return weekdaysFlex;
     });
 
+    Weekdays.displayName = 'Weekdays';
+
     const calendarClass = classNames(`${styles['base']} ${styles[`shadow-${shadow}`]}`);
 
     const changeMonth = useCallback(

packages/ui-react/lib/Calendar/DayItem.tsx

@@ -11,7 +11,8 @@ interface DayItemProps {
   selectMonth: number;
 }
 
-const DayItem = memo(function otherMonthItem({
+const DayItem = memo(function DayItem({
+  // Change the function name here
   index,
   isOtherMonth,
   selectDate,

packages/ui-react/lib/Carousel/Carousel.tsx

@@ -1,4 +1,4 @@
-import React, { memo, useEffect, useMemo, useRef, useState, type HtmlHTMLAttributes } from 'react';
+import React, { useEffect, useRef, useState, type HtmlHTMLAttributes } from 'react';
 import { type CarouselItemProps, CarouselItem } from '..';
 import classNames from 'classnames';
 import styles from './Carousel.module.scss';

packages/ui-react/lib/Checkbox/Checkbox.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import styles from './Checkbox.module.scss';
 import classNames from 'classnames';
 import { Check } from 'lucide-react';

packages/ui-react/lib/CheckboxGroup/CheckboxGroup.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useState, type HtmlHTMLAttributes } from 'react';
+import React, { useCallback, useState, type HtmlHTMLAttributes } from 'react';
 import { type CheckboxProps } from '..';
 import { Content } from './Content';
 

packages/ui-react/lib/DatePicker/DatePicker.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo, useState } from 'react';
+import React, { useMemo, useState } from 'react';
 import { Button, Calendar } from '..';
 import styles from './DatePicker.module.scss';
 import { CalendarDays } from 'lucide-react';

packages/ui-react/lib/Dialog/Dialog.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useLayoutEffect, useState, type CSSProperties } from 'react';
+import React, { useLayoutEffect, useState, type CSSProperties } from 'react';
 import styles from './Dialog.module.scss';
 import { Button, Card } from '..';
 import { createPortal } from 'react-dom';

packages/ui-react/lib/Navbar/Navbar.stories.tsx

@@ -5,7 +5,7 @@ import type { Meta, StoryObj } from '@storybook/react';
 import React from 'react';
 import { Navbar, type NavbarProps } from './Navbar';
 import logoSvg from '../assets/Logo.svg';
-import { Home, LayoutList, Award } from 'lucide-react';
+import { Home, LayoutList } from 'lucide-react';
 
 const test = (value: string) => {
   console.log(value);

packages/ui-react/lib/Pagination/Pagination.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, memo, useEffect, useState, type ReactNode } from 'react';
+import React, { createContext, useEffect, useState, type ReactNode } from 'react';
 import styles from './Pagination.module.scss';
 import classNames from 'classnames';
 import { PaginationItem } from './PaginationItem';

packages/ui-react/lib/Pagination/PaginationItem.tsx

@@ -1,4 +1,4 @@
-import React, { memo, useCallback, useContext, useEffect, type ReactNode } from 'react';
+import React, { memo, useCallback, useContext, type ReactNode } from 'react';
 import { Button, PaginationStoreContext } from '..';
 import styles from './Pagination.module.scss';
 import { useCurrentPageStore } from './useCurrentPageStore';
@@ -31,7 +31,7 @@ export const PaginationItemImpl = ({
   const paginationStoreContext = useContext(PaginationStoreContext);
 
   const handleClick = useCallback((type: 'select' | 'add' | 'delete' | 'none', index?: number) => {
-    const activePage = paginationStoreContext?.activePage!;
+    const activePage = paginationStoreContext?.activePage ?? 0;
 
     if (type === 'select' && index !== undefined) {
       !activePage && changeCurrentPage(index + 1);
@@ -50,7 +50,7 @@ export const PaginationItemImpl = ({
   return (
     <Button
       className={`${styles['pagination-item']} ${className}`}
-      // @ts-ignore
+      // @ts-expect-error this string must be contained
       color={`${index !== undefined && (paginationStoreContext!.activePage ?? currentPage) === index + 1 ? 'primary' : 'border'}`}
       onClick={() => handleClick(type, index)}
       disabled={disabled}

packages/ui-react/lib/Select/Select.tsx

@@ -81,10 +81,6 @@ export const Select = React.forwardRef<HTMLDivElement, SelectProps>(
       selectItem: optionsList.find((item) => item.key === defaultSelectKey),
     };
 
-    const selectItem: SelectItemProps = {
-      selectItem: optionsList.find((item) => item.key === selectKey),
-    };
-
     const selectItemStore = useRef(createSelectItemStore(defaultSelectItem ?? selectKey)).current;
     const keySelectItemStore = useRef(createKeySelectItemStore()).current;
     const [visible, setVisible] = useState<boolean>(false);

packages/ui-react/lib/Sheet/Sheet.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useLayoutEffect, useState, type CSSProperties } from 'react';
+import React, { useLayoutEffect, useState, type CSSProperties } from 'react';
 import styles from './Sheet.module.scss';
 // import SheetTrigger from './SheetTrigger';
 import { SheetHeader } from './SheetHeader';

packages/ui-react/lib/Sheet/SheetHeader.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import styles from './Sheet.module.scss';
 import { Button } from '..';
 import { X } from 'lucide-react';

packages/ui-react/package.json

@@ -62,7 +62,7 @@
     "@vitest/ui": "^2.0.4",
     "autoprefixer": "^10.4.19",
     "clsx": "^2.1.1",
-    "eslint": "^9.8.0",
+    "eslint": "^8.57.1",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-jest-dom": "^5.4.0",
     "eslint-plugin-react": "^7.35.0",