[bug]: Bugged styling in React Vite project

[mulaRahul]

Describe the bug

In a react vite project created following the docs, the Button, Sidebar and other components styling is unsual/missing.

Affected component/components

Button, Sidebar

How to reproduce

1. Follow steps in getting started guide for vite from shadcn docs.
2. Add button component or sidebar block npx shadcn@latest add dashboard-01
3. View the unusual styling.

Codesandbox/StackBlitz link

No response

Logs

System Info

OS: Windows 11
Browser: Chrome 141.0.7390.108 (Official Build) (64-bit)
---
npm: 11.4.2
---
packages
├── @eslint/js@9.38.0
├── @radix-ui/react-dialog@1.1.15
├── @radix-ui/react-dropdown-menu@2.1.16
├── @radix-ui/react-label@2.1.7
├── @radix-ui/react-separator@1.1.7
├── @radix-ui/react-slot@1.2.3
├── @radix-ui/react-tooltip@1.2.8
├── @tailwindcss/vite@4.1.15
├── @types/node@24.9.1
├── @types/react-dom@19.2.2
├── @types/react@19.2.2
├── @vitejs/plugin-react@5.0.4
├── class-variance-authority@0.7.1
├── clsx@2.1.1
├── eslint-plugin-react-hooks@5.2.0
├── eslint-plugin-react-refresh@0.4.24
├── eslint@9.38.0
├── globals@16.4.0
├── lucide-react@0.546.0
├── react-dom@19.2.0
├── react@19.2.0
├── tailwind-merge@3.3.1
├── tailwindcss@4.1.15
├── tw-animate-css@1.4.0
├── typescript-eslint@8.46.2
├── typescript@5.9.3
└── vite@7.1.11

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues