fix: nx only set peer deps as build external

libs/mibao-ui/src/index.ts

@@ -1,6 +1,5 @@
 import './index.scss'
 
-export * from './lib/confirm/confirm'
 export * from './lib/select/select'
 export * from './lib/pagination/pagination'
 export * from './lib/alert/alert'

libs/mibao-ui/src/lib/copyzone/copyzone.spec.tsx

@@ -1,7 +1,7 @@
 import { render } from '@testing-library/react'
 import { MibaoProvider } from '../..'
 
-import Copyzone from './copyzone'
+import { Copyzone } from './copyzone'
 
 describe('Copyzone', () => {
   it('should render successfully', () => {

libs/mibao-ui/src/lib/copyzone/copyzone.tsx

@@ -18,5 +18,3 @@ export const Copyzone: React.FC<CopyzoneProps> = ({ children, containerProps, va
     </Flex>
   )
 }
-
-export default Copyzone

libs/mibao-ui/src/lib/issuer/issuer.tsx

@@ -1,7 +1,7 @@
 import { Link } from '@chakra-ui/react'
 import React from 'react'
 import { Avatar, AvatarProps } from '../avatar/avatar'
-import Copyzone from '../copyzone/copyzone'
+import { Copyzone } from '../copyzone/copyzone'
 import { Flex, Stack, Text, TextProps } from '../typography/typography'
 import styles from './issuer.module.scss'
 
@@ -57,7 +57,7 @@ export const Issuer: React.FC<IssuerProps> = ({
       <Stack spacing="4px" direction="column" justifyContent="space-between">
         <Text
           isTruncated
-          color={isBanned ? 'banned.main' : undefined}
+          color={isBanned ? 'banned.500' : undefined}
           fontSize={isOneline ? '12px' : '14px' }
           fontWeight={isOneline ? 'normal' : 500}
           {...nameProps}
@@ -67,17 +67,17 @@ export const Issuer: React.FC<IssuerProps> = ({
         {id
           ? (
               disableCopy
-                ? <Text fontSize="12px" color="gray.main">
+                ? <Text fontSize="12px" color="gray.500">
                     {displayId ?? id}
                   </Text>
-                : <Copyzone value={id} fontSize="12px" color="gray.main">
+                : <Copyzone value={id} fontSize="12px" color="gray.500">
                     {displayId ?? id}
                   </Copyzone>
             )
           : null}
         {verifiedTitle && isVerified
           ? (
-          <Text isTruncated fontSize="12px" color="gray.main">
+          <Text isTruncated fontSize="12px" color="gray.500">
             {verifiedTitle}
           </Text>
             )

libs/mibao-ui/src/lib/like/like.tsx

@@ -36,7 +36,7 @@ export const Like: React.FC<LikeProps> = ({ isLiked, isLoading, className, onCli
       onClick={onClick}
     >
       {icon}
-      <Text color="gray.main" fontSize="12px" ml="6px" {...props}>
+      <Text color="gray.500" fontSize="12px" ml="6px" {...props}>
         {formatCount(likeCount, locale)}
       </Text>
     </Flex>

libs/mibao-ui/src/lib/limited/limited.tsx

@@ -30,7 +30,7 @@ export const Limited: React.FC<LimitProps> = ({ count, serialNumber, limitedText
     return null
   }
 
-  return <Text color="gray.main" fontSize="12px" {...rest}>
+  return <Text color="gray.500" fontSize="12px" {...rest}>
     {content}
   </Text>
 }

libs/mibao-ui/src/lib/menu/menu.tsx

@@ -1 +1,43 @@
-export * from '@chakra-ui/menu'
+export {
+  Menu,
+  MenuButton,
+  MenuButtonProps,
+  MenuCommand,
+  MenuCommandProps,
+  MenuDescendantsProvider,
+  MenuDivider,
+  MenuDividerProps,
+  MenuGroup,
+  MenuGroupProps,
+  MenuIcon,
+  MenuItem,
+  MenuItemOption,
+  MenuItemOptionProps,
+  MenuItemProps,
+  MenuList,
+  MenuListProps,
+  MenuOptionGroup,
+  MenuOptionGroupProps,
+  MenuProps,
+  MenuProvider,
+  useMenu,
+  useMenuButton,
+  useMenuContext,
+  useMenuDescendant,
+  useMenuDescendants,
+  useMenuDescendantsContext,
+  useMenuItem,
+  useMenuList,
+  useMenuOption,
+  useMenuOptionGroup,
+  useMenuPositioner,
+  useMenuState,
+  UseMenuButtonProps,
+  UseMenuItemProps,
+  UseMenuListProps,
+  UseMenuOptionGroupProps,
+  UseMenuOptionOptions,
+  UseMenuOptionProps,
+  UseMenuProps,
+  UseMenuReturn
+} from '@chakra-ui/react'

libs/mibao-ui/src/lib/nft-title/nft-title.tsx

@@ -13,7 +13,7 @@ export const NFTTitle: React.FC<NFTTitleProps> = ({ title, isBanned, bannedText,
       isTruncated
       fontWeight="500"
       fontSize="16px"
-      color={isBanned ? 'banned.main' : undefined}
+      color={isBanned ? 'banned.500' : undefined}
       {...props}
     >
       {!isBanned ? title : bannedText}

libs/mibao-ui/src/lib/progress/progress.tsx

@@ -3,7 +3,7 @@ import { Progress as RawProgress, ProgressProps } from '@chakra-ui/react'
 
 export const Progress: React.FC<ProgressProps> = (props) => {
   return (
-    <RawProgress borderRadius="8px" height="10px" color="progress.main" {...props} />
+    <RawProgress borderRadius="8px" height="10px" color="progress.500" {...props} />
   )
 }
 

libs/mibao-ui/src/lib/typography/typography.tsx

@@ -1,4 +1,4 @@
-import { Heading as RawHeading, TextProps, Text as RawText, HeadingProps } from '@chakra-ui/layout'
+import { Heading as RawHeading, TextProps, Text as RawText, HeadingProps } from '@chakra-ui/react'
 
 export const Text: React.FC<TextProps> = ({ isTruncated, noOfLines, ...rest }) => {
   return (
@@ -12,4 +12,65 @@ export const Heading: React.FC<HeadingProps> = ({ isTruncated, noOfLines, ...res
   )
 }
 
-export * from '@chakra-ui/layout'
+export {
+  AbsoluteCenter,
+  AbsoluteCenterProps,
+  AspectRatio,
+  AspectRatioProps,
+  Badge,
+  BadgeProps,
+  Box,
+  BoxProps,
+  Center,
+  CenterProps,
+  Circle,
+  Code,
+  CodeProps,
+  Container,
+  ContainerProps,
+  Divider,
+  DividerProps,
+  Flex,
+  FlexOptions,
+  FlexProps,
+  Grid,
+  GridItem,
+  GridItemProps,
+  GridOptions,
+  GridProps,
+  HStack,
+  HeadingProps,
+  Kbd,
+  KbdProps,
+  Link,
+  LinkBox,
+  LinkBoxProps,
+  LinkOverlay,
+  LinkOverlayProps,
+  LinkProps,
+  List,
+  ListIcon,
+  ListItem,
+  ListItemProps,
+  ListProps,
+  OrderedList,
+  SimpleGrid,
+  SimpleGridProps,
+  Spacer,
+  SpacerProps,
+  Square,
+  SquareProps,
+  Stack,
+  StackDirection,
+  StackDivider,
+  StackDividerProps,
+  StackItem,
+  StackProps,
+  TextProps,
+  UnorderedList,
+  VStack,
+  Wrap,
+  WrapItem,
+  WrapItemProps,
+  WrapProps
+} from '@chakra-ui/react'

libs/mibao-ui/src/theme.tsx

@@ -13,13 +13,13 @@ export const mibaoTheme = extendTheme({
     gray: {
       200: '#eee',
       800: '#23262F',
-      main: '#777E91'
+      500: '#777E91'
     },
     progress: {
-      main: '#5065E5'
+      500: '#5065E5'
     },
     banned: {
-      main: '#d03a3a'
+      500: '#d03a3a'
     }
   },
   shadows: {

package.json

@@ -23,6 +23,18 @@
     "regenerator-runtime": "0.13.9",
     "tslib": "2.3.1"
   },
+  "browserslist": {
+    "production": [
+      "since 2015",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
   "devDependencies": {
     "@babel/core": "7.15.8",
     "@babel/preset-typescript": "7.15.0",

workspace.json

@@ -14,7 +14,7 @@
             "tsConfig": "libs/mibao-ui/tsconfig.lib.json",
             "project": "libs/mibao-ui/package.json",
             "entryFile": "libs/mibao-ui/src/index.ts",
-            "external": ["react/jsx-runtime"],
+            "external": ["react/jsx-runtime", "@chakra-ui/*"],
             "rollupConfig": "@nrwl/react/plugins/bundle-rollup",
             "assets": [
               {