feat(design-system): add new components and update styles for design system

Author: Marfuen

apps/portal/agents.md

@@ -2,7 +2,7 @@
 
 ## Design System
 
-**All UI must use `@trycompai/ui-shadcn` components. No custom styling.**
+**All UI must use `@trycompai/design-system` components. No custom styling.**
 
 **`className` is NOT a valid prop on design system components.**
 
@@ -21,7 +21,7 @@ import {
   PageLayout,
   Container,
   // ... etc
-} from '@trycompai/ui-shadcn';
+} from '@trycompai/design-system';
 ```
 
 ### ❌ NEVER Do This
@@ -126,5 +126,5 @@ For layout concerns (width, grid positioning), use wrapper elements:
 ## When Something Is Missing
 
 1. Check if a variant exists in the component
-2. Add a variant to `@trycompai/ui-shadcn` if needed
+2. Add a variant to `@trycompai/design-system` if needed
 3. **Never** work around with wrapper divs for styling that should be a variant

apps/portal/next.config.ts

@@ -4,7 +4,7 @@ import './src/env.mjs';
 const isStandalone = process.env.NEXT_OUTPUT_STANDALONE === 'true';
 
 const config = {
-  transpilePackages: ['@trycompai/db', '@trycompai/ui-shadcn'],
+  transpilePackages: ['@trycompai/db', '@trycompai/design-system'],
   images: {
     remotePatterns: [
       {

apps/portal/package.json

@@ -13,7 +13,7 @@
     "@trycompai/db": "1.3.20",
     "@trycompai/email": "workspace:*",
     "@trycompai/kv": "workspace:*",
-    "@trycompai/ui-shadcn": "workspace:*",
+    "@trycompai/design-system": "workspace:*",
     "@types/jszip": "^3.4.1",
     "@upstash/ratelimit": "^2.0.5",
     "archiver": "^7.0.1",

apps/portal/src/app/(app)/(home)/[orgId]/components/EmployeeTasksList.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { trainingVideos } from '@/lib/data/training-videos';
-import { Accordion, Card, CardContent, CardHeader } from '@trycompai/ui-shadcn';
+import { Accordion, Card, CardContent, CardHeader } from '@trycompai/design-system';
 import type { EmployeePortalDashboard } from '../types/employee-portal';
 import { DeviceAgentAccordionItem } from './tasks/DeviceAgentAccordionItem';
 import { GeneralTrainingAccordionItem } from './tasks/GeneralTrainingAccordionItem';

apps/portal/src/app/(app)/(home)/[orgId]/components/policy/PolicyCard.tsx

@@ -2,7 +2,7 @@
 
 import type { Member, Policy } from '@db';
 import type { JSONContent } from '@tiptap/react';
-import { Button, Card, CardContent, CardFooter, CardHeader } from '@trycompai/ui-shadcn';
+import { Button, Card, CardContent, CardFooter, CardHeader } from '@trycompai/design-system';
 import { ArrowRight, Check } from 'lucide-react';
 import { useState } from 'react';
 import { PolicyEditor } from './PolicyEditor';

apps/portal/src/app/(app)/(home)/[orgId]/components/policy/PolicyCarousel.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import type { Member, Policy } from '@db';
-import { Button } from '@trycompai/ui-shadcn';
+import { Button } from '@trycompai/design-system';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { useAction } from 'next-safe-action/hooks';
 import { useEffect, useRef, useState } from 'react';

apps/portal/src/app/(app)/(home)/[orgId]/components/policy/PolicyContainer.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import type { Member, Policy } from '@db';
-import { Button } from '@trycompai/ui-shadcn';
+import { Button } from '@trycompai/design-system';
 import { ArrowLeft } from 'lucide-react';
 import { useState } from 'react';
 import { PolicyCarousel } from './PolicyCarousel';

apps/portal/src/app/(app)/(home)/[orgId]/components/policy/PolicyGrid.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import type { Member, Policy } from '@db';
-import { Card, CardContent, CardHeader } from '@trycompai/ui-shadcn';
+import { Card, CardContent, CardHeader } from '@trycompai/design-system';
 import { Check } from 'lucide-react';
 
 interface PolicyGridProps {

apps/portal/src/app/(app)/(home)/[orgId]/components/policy/PortalPdfViewer.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useApiSWR } from '@/hooks/use-api-swr';
-import { Card, CardContent } from '@trycompai/ui-shadcn';
+import { Card, CardContent } from '@trycompai/design-system';
 import { FileText, Loader2 } from 'lucide-react';
 import { useParams } from 'next/navigation';
 import { toast } from 'sonner';

apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/DeviceAgentAccordionItem.tsx

@@ -6,7 +6,7 @@ import {
   WINDOWS_FILENAME,
 } from '@/app/api/download-agent/constants';
 import { detectOSFromUserAgent, SupportedOS } from '@/utils/os';
-import { AccordionContent, AccordionItem, AccordionTrigger } from '@trycompai/ui-shadcn';
+import { AccordionContent, AccordionItem, AccordionTrigger } from '@trycompai/design-system';
 import { CheckCircle2, Circle } from 'lucide-react';
 import { useEffect, useMemo, useState } from 'react';
 import { toast } from 'sonner';