feat: streamline component imports and update package exports for better organization

apps/web/src/apps/index.tsx

@@ -1,10 +1,7 @@
 import { lazy, Suspense, useState } from 'react';
 import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
 import { ThemeProvider, ColorSchemeType, DensityType } from '@repo/ui/provider';
-import { NotFound } from '@repo/ui/components/system-pages/not-found';
-import { Forbidden } from '@repo/ui/components/system-pages/forbidden';
-import { Maintenance } from '@repo/ui/components/system-pages/maintenance';
-import { ComingSoon } from '@repo/ui/components/system-pages/coming-soon';
+import { NotFound, Forbidden, Maintenance, ComingSoon } from '@repo/ui/components';
 
 const AuthModule = lazy(() => import('./auth'));
 const AppModule = lazy(() => import('./modules'));

apps/web/src/apps/showcase/showcase-view.tsx

@@ -1,12 +1,5 @@
 import { ColorSchemeType, DensityType } from '@repo/ui/provider';
-import { Button } from '@repo/ui/components/button';
-import { Card } from '@repo/ui/components/card';
-import { Container } from '@repo/ui/components/container';
-import { Select } from '@repo/ui/components/select';
-import { Group, Stack } from '@repo/ui/components/group';
-import { Text, Title } from '@repo/ui/components/text';
-import { TextInput } from '@repo/ui/components/input';
-import { Checkbox } from '@repo/ui/components/checkbox';
+import { Button, Card, Container, Select, Group, Stack, Text, Title, TextInput, Checkbox } from '@repo/ui/components';
 
 interface ShowcaseViewProps {
   colorScheme: ColorSchemeType;
@@ -23,7 +16,9 @@ export default function ShowcaseView({ colorScheme, setColorScheme, density, set
 
         {/* Control Panel */}
         <Card withBorder shadow="sm" radius="md" p="md">
-          <Title order={3} mb="md">Control Panel</Title>
+          <Title order={3} mb="md">
+            Control Panel
+          </Title>
           <Group grow align="flex-end">
             <Select
               label="Color Scheme"
@@ -53,13 +48,19 @@ export default function ShowcaseView({ colorScheme, setColorScheme, density, set
         <Card withBorder shadow="sm" radius="md" p="md">
           <Stack gap="lg">
             <div>
-              <Title order={3} mb="sm">Typography</Title>
-              <Text size="sm" c="dimmed">This is dimmed small text.</Text>
+              <Title order={3} mb="sm">
+                Typography
+              </Title>
+              <Text size="sm" c="dimmed">
+                This is dimmed small text.
+              </Text>
               <Text>This is standard text describing the components below.</Text>
             </div>
 
             <div>
-              <Title order={3} mb="sm">Buttons</Title>
+              <Title order={3} mb="sm">
+                Buttons
+              </Title>
               <Group>
                 <Button variant="filled">Filled Button</Button>
                 <Button variant="outline">Outline Button</Button>
@@ -69,7 +70,9 @@ export default function ShowcaseView({ colorScheme, setColorScheme, density, set
             </div>
 
             <div>
-              <Title order={3} mb="md">Form Elements</Title>
+              <Title order={3} mb="md">
+                Form Elements
+              </Title>
               <Group grow>
                 <TextInput label="First Name" placeholder="John" />
                 <TextInput label="Last Name" placeholder="Doe" />