Remove clsx

Author: abewheel

package.json

@@ -71,8 +71,7 @@
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
     "@mui/icons-material": "^7.3.5",
-    "@mui/material": "^7.3.5",
-    "clsx": "^2.1.1"
+    "@mui/material": "^7.3.5"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",

pnpm-lock.yaml

@@ -99,8 +99,8 @@ function AppContent({ selectedUI }: { selectedUI: UISimulation }) {
   return (
     <Carousel>
       {places.map((place) => (
-        <div key={place.id} className="sp-carousel-item">
-          <Card
+        <Card
+          key={place.id}
             id={place.id}
             image={place.image}
             imageAlt={place.name}
@@ -114,10 +114,9 @@ function AppContent({ selectedUI }: { selectedUI: UISimulation }) {
               onClick: () => console.log(`Learn more about ${place.name}`),
               isPrimary: true,
             }}
-          >
-            {place.description}
-          </Card>
-        </div>
+        >
+          {place.description}
+        </Card>
       ))}
     </Carousel>
   );

simulations/chatgpt/main.tsx

@@ -1,5 +1,4 @@
 import { type ReactNode, type HTMLAttributes } from 'react';
-import { clsx } from 'clsx';
 import { Button, type ButtonProps as MuiButtonProps, Box, useTheme } from '@mui/material';
 import { useRequestDisplayMode, useDisplayMode, useMaxHeight, useWidgetState } from '../../hooks';
 import type { GenAIProps } from '../GenAI';
@@ -135,11 +134,6 @@ export const Card = ({
         {...muiProps}
         variant={isPrimary ? 'contained' : 'outlined'}
         onClick={handleClick}
-        className={clsx(
-          'sp-button',
-          isPrimary ? 'sp-button-primary' : 'sp-button-secondary',
-          muiProps.className
-        )}
       >
         {children}
       </Button>

src/components/Card/Card.tsx

@@ -154,7 +154,7 @@ export default defineConfig({
   ],
   publicDir: 'assets',
   server: {
-    port: 6742,
+    port: 6768,
     strictPort: true,
   },
   resolve: {