@pattern-stack/frontend-patterns 0.0.6 → 0.1.1

package/dist/molecules/layout/Sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../src/molecules/layout/Sidebar.tsx"],"names":[],"mappings":"AAQA,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,OAAO,GAAI,eAAe,YAAY,4CAsHlD,CAAC"}
+{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../src/molecules/layout/Sidebar.tsx"],"names":[],"mappings":"AAqBA,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,OAAO,GAAI,eAAe,YAAY,4CAsHlD,CAAC"}

package/dist/molecules/layout/SidebarButton/SidebarButton.d.ts

@@ -7,8 +7,6 @@ interface SidebarButtonProps {
     expanded?: boolean;
     onClick?: () => void;
     className?: string;
-    badge?: string | number;
-    disabled?: boolean;
 }
 export declare const SidebarButton: React.FC<SidebarButtonProps>;
 export {};

package/dist/molecules/layout/SidebarButton/SidebarButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarButton.d.ts","sourceRoot":"","sources":["../../../../src/molecules/layout/SidebarButton/SidebarButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,kBAAkB;IAC1B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwGtD,CAAC"}
+{"version":3,"file":"SidebarButton.d.ts","sourceRoot":"","sources":["../../../../src/molecules/layout/SidebarButton/SidebarButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,kBAAkB;IAC1B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoFtD,CAAC"}

package/dist/molecules/layout/index.d.ts

@@ -1,11 +1,8 @@
 export { PageTemplate, type PageTemplateProps } from './PageTemplate';
 export { ShowcaseSection } from './ShowcaseSection';
 export { AppLayout } from './AppLayout';
-export { DashboardWithSidePanel } from './DashboardWithSidePanel';
 export { SectionHeader } from './SectionHeader';
 export { SidebarButton } from './SidebarButton';
 export { AppHeader } from './AppHeader';
 export { SidebarProvider, useSidebar } from './SidebarContext';
-export { NavigationProvider, useNavigation, getNavigationItems } from './NavigationContext';
-export { Sidebar } from './Sidebar';
 //# sourceMappingURL=index.d.ts.map

package/dist/molecules/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecules/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC5F,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecules/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/templates/factory.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { ReactNode } from 'react';
-import type { AuthConfig, NavigationConfig } from '../atoms/types';
+import type { AuthConfig } from '../atoms/types';
 export interface AppConfig {
     title: string;
     description?: string;
@@ -14,7 +14,6 @@ export interface AppConfig {
     theme?: string;
     darkMode?: boolean;
     auth?: AuthConfig;
-    navigation?: NavigationConfig;
     customProviders?: React.ComponentType<{
         children: ReactNode;
     }>[];

package/dist/templates/factory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../src/templates/factory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQtC,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGlE,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,UAAU,CAAC,EAAE,gBAAgB,CAAA;IAC7B,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,EAAE,SAAS,CAAA;KAAE,CAAC,EAAE,CAAA;CACjE;AAGD,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,SAAS,CAAA;IACvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,KAAK,IAAI,CAAA;IACvD,KAAK,EAAE,CAAC,SAAS,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CACpC;AAGD,wBAAgB,cAAc,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,GAAG,WAAW,CAoItE;AAGD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,CAE1D"}
+{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../src/templates/factory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAStC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAGhD,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,EAAE,SAAS,CAAA;KAAE,CAAC,EAAE,CAAA;CACjE;AAGD,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,SAAS,CAAA;IACvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,KAAK,IAAI,CAAA;IACvD,KAAK,EAAE,CAAC,SAAS,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CACpC;AAGD,wBAAgB,cAAc,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,GAAG,WAAW,CA6HtE;AAGD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,CAE1D"}

package/dist/templates/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/templates/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,aAAa,EACb,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,WAAW,EACX,KAAK,iBAAiB,EACtB,KAAK,kBAAkB,EACvB,KAAK,aAAa,EAClB,KAAK,gBAAgB,EACtB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC7B,MAAM,gBAAgB,CAAC;AAGxB,cAAc,SAAS,CAAC;AAOxB,OAAO,EACL,cAAc,EACd,eAAe,EACf,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/templates/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,aAAa,EACb,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,WAAW,EACX,KAAK,iBAAiB,EACtB,KAAK,kBAAkB,EACvB,KAAK,aAAa,EAClB,KAAK,gBAAgB,EACtB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC7B,MAAM,gBAAgB,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,OAAO,EACL,cAAc,EACd,eAAe,EACf,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,WAAW,CAAC"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@pattern-stack/frontend-patterns",
   "description": "Production-ready React frontend template with atomic architecture patterns. Build ultra-lean applications by importing shared UI foundation patterns.",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.1.1",
   "keywords": [
     "react",
     "typescript",
@@ -44,8 +44,7 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
-    "build:lib": "npm run clean && vite build --mode library && npm run build:types",
-    "build:types": "tsc --project tsconfig.lib.json",
+    "build:lib": "npm run clean && vite build --mode library && tsc -p tsconfig.lib.json",
     "clean": "rm -rf dist",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
@@ -103,12 +102,9 @@
     "@vitejs/plugin-react": "^4.4.1",
     "@vitest/coverage-v8": "^3.2.1",
     "autoprefixer": "^10.4.21",
-    "concurrently": "^9.1.2",
-    "cors": "^2.8.5",
     "eslint": "^9.25.0",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.19",
-    "express": "^5.1.0",
     "globals": "^16.0.0",
     "jsdom": "^26.1.0",
     "postcss": "^8.5.3",
@@ -119,4 +115,4 @@
     "vite": "^6.3.5",
     "vitest": "^3.2.1"
   }
-}
+}

package/src/App.tsx

@@ -15,12 +15,8 @@ import {
   ComponentShowcase, 
   AdminDashboardShowcase, 
   AdminCRUDShowcase, 
-  AdminDetailShowcase,
-  SalesPerformanceDashboard,
-  EntityPerformanceShowcase,
-  EntityManagementShowcase
+  AdminDetailShowcase 
 } from './pages';
-import { EntityTemplateExample } from './pages/EntityTemplateExample';
 
 function App() {
   return (
@@ -45,12 +41,6 @@ function App() {
             <Route path="admin/dashboard" element={<ErrorBoundary><AdminDashboardShowcase /></ErrorBoundary>} />
             <Route path="admin/users" element={<ErrorBoundary><AdminCRUDShowcase /></ErrorBoundary>} />
             <Route path="admin/user/:id" element={<ErrorBoundary><AdminDetailShowcase /></ErrorBoundary>} />
-            <Route path="admin/sales" element={<ErrorBoundary><SalesPerformanceDashboard /></ErrorBoundary>} />
-            
-            {/* Entity Template Showcases */}
-            <Route path="entity/performance" element={<ErrorBoundary><EntityPerformanceShowcase /></ErrorBoundary>} />
-            <Route path="entity/management" element={<ErrorBoundary><EntityManagementShowcase /></ErrorBoundary>} />
-            <Route path="entity/template-example" element={<ErrorBoundary><EntityTemplateExample /></ErrorBoundary>} />
             
             {/* Fallback */}
             <Route path="*" element={<ErrorBoundary><ComponentShowcasePage /></ErrorBoundary>} />

package/src/atoms/composed/index.ts

@@ -1,6 +1,5 @@
 // Business-specific shared components
 export { DataBadge } from './DataBadge';
-export { SalesPanel } from './SalesPanel';
 export { StatCard } from './StatCard';
 export { DetailedCard } from './DetailedCard';
 export { EmptyState } from './EmptyState';

package/src/atoms/types/index.ts

@@ -1,6 +1,4 @@
 // Export all type definitions
 export * from './generated';
 export * from './loading';
-export * from './auth';
-export * from './navigation';
-export * from './entity-config';
+export * from './auth';

package/src/atoms/utils/utils.ts

@@ -5,7 +5,5 @@ export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
 }
 
-// Re-export utilities
-export * from './tooltip-helpers';
-export * from './metric-engine';
-export { Icon, getIcon, isValidIcon } from './icon-resolver';
+// Re-export tooltip helpers
+export * from './tooltip-helpers';

package/src/molecules/layout/Sidebar.tsx

@@ -1,10 +1,23 @@
+import React from 'react';
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom';
-import { cn, Icon } from '../../atoms/utils/utils';
+import { cn } from '../../atoms/utils/utils';
 import { useSidebar } from './SidebarContext';
-import { useNavigation, getNavigationItems } from './NavigationContext';
 import { SidebarButton } from './SidebarButton';
-import { Menu, X } from 'lucide-react';
-import type { NavigationItem } from '../../atoms/types';
+import { 
+  Palette,
+  Menu,
+  X,
+  Shield,
+  Users
+} from 'lucide-react';
+
+interface SidebarItem {
+  value: string;
+  label: string;
+  icon: React.ReactNode;
+  path: string;
+  category?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
+}
 
 interface SidebarProps {
   className?: string;
@@ -12,13 +25,15 @@ interface SidebarProps {
 
 export const Sidebar = ({ className }: SidebarProps) => {
   const { isExpanded, toggleSidebar } = useSidebar();
-  const { navigation } = useNavigation();
   const location = useLocation();
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
 
-  // Get navigation items from context
-  const items: NavigationItem[] = getNavigationItems(navigation);
+  const items: SidebarItem[] = [
+    { value: 'showcase', label: 'Showcase', icon: <Palette className="w-5 h-5" />, path: '/showcase', category: 5 },
+    { value: 'admin-dashboard', label: 'Admin Dashboard', icon: <Shield className="w-5 h-5" />, path: '/admin/dashboard', category: 2 },
+    { value: 'admin-users', label: 'User Management', icon: <Users className="w-5 h-5" />, path: '/admin/users', category: 3 }
+  ];
 
   const handleNavigation = (path: string) => {
     if (path.includes('?')) {
@@ -85,14 +100,12 @@ export const Sidebar = ({ className }: SidebarProps) => {
           return (
             <SidebarButton
               key={item.value}
-              icon={<Icon name={item.icon} className="w-5 h-5" />}
+              icon={item.icon}
               label={item.label}
               active={isActive}
               category={item.category}
               expanded={isExpanded}
               onClick={() => handleNavigation(item.path)}
-              badge={item.badge}
-              disabled={item.disabled}
             />
           );
         })}

package/src/molecules/layout/SidebarButton/SidebarButton.tsx

@@ -10,8 +10,6 @@ interface SidebarButtonProps {
   expanded?: boolean;
   onClick?: () => void;
   className?: string;
-  badge?: string | number;
-  disabled?: boolean;
 }
 
 export const SidebarButton: React.FC<SidebarButtonProps> = ({
@@ -21,15 +19,12 @@ export const SidebarButton: React.FC<SidebarButtonProps> = ({
   category = 1,
   expanded = false,
   onClick,
-  className,
-  badge,
-  disabled = false
+  className
 }) => {
   return (
     <Button
       variant={active ? "secondary" : "ghost"}
       onClick={onClick}
-      disabled={disabled}
       tooltip={!expanded ? label : undefined}
       className={cn(
         "relative w-full justify-start gap-3 h-12",
@@ -79,15 +74,8 @@ export const SidebarButton: React.FC<SidebarButtonProps> = ({
             {label}
           </span>
           
-          {/* Badge or Active indicator */}
-          {badge ? (
-            <span className={cn(
-              "px-2 py-0.5 text-xs font-medium rounded-full flex-shrink-0",
-              "bg-primary/10 text-primary"
-            )}>
-              {badge}
-            </span>
-          ) : active && (
+          {/* Active indicator dot */}
+          {active && (
             <div className={cn(
               "w-2 h-2 rounded-full flex-shrink-0",
               `bg-category-${category}`
@@ -96,24 +84,14 @@ export const SidebarButton: React.FC<SidebarButtonProps> = ({
         </>
       )}
       
-      {/* Collapsed indicators */}
-      {!expanded && (badge || active) && (
+      {/* Collapsed active indicator */}
+      {!expanded && active && (
         <div className="absolute -top-1 -right-1">
-          {badge ? (
-            <span className={cn(
-              "px-1.5 py-0.5 text-xs font-bold rounded-full",
-              "bg-primary text-primary-foreground",
-              "ring-2 ring-background"
-            )}>
-              {badge}
-            </span>
-          ) : active && (
-            <div className={cn(
-              "w-2.5 h-2.5 rounded-full",
-              `bg-category-${category}`,
-              "ring-2 ring-background"
-            )} />
-          )}
+          <div className={cn(
+            "w-2.5 h-2.5 rounded-full",
+            `bg-category-${category}`,
+            "ring-2 ring-background"
+          )} />
         </div>
       )}
     </Button>

package/src/molecules/layout/index.ts

@@ -1,10 +1,7 @@
 export { PageTemplate, type PageTemplateProps } from './PageTemplate';
 export { ShowcaseSection } from './ShowcaseSection';
 export { AppLayout } from './AppLayout';
-export { DashboardWithSidePanel } from './DashboardWithSidePanel';
 export { SectionHeader } from './SectionHeader';
 export { SidebarButton } from './SidebarButton';
 export { AppHeader } from './AppHeader';
-export { SidebarProvider, useSidebar } from './SidebarContext';
-export { NavigationProvider, useNavigation, getNavigationItems } from './NavigationContext';
-export { Sidebar } from './Sidebar';
+export { SidebarProvider, useSidebar } from './SidebarContext';

package/src/organisms/index.ts

@@ -2,8 +2,4 @@
 // These are complete, reusable component interfaces that compose molecules and atoms
 
 // Showcase components
-export { ComponentShowcasePage } from './showcase/ComponentShowcasePage';
-
-// Entity components - Cross-domain configurable panels
-// TODO: Fix TypeScript errors in entity components before uncommenting
-// export * from './entity';
+export { ComponentShowcasePage } from './showcase/ComponentShowcasePage';

package/src/pages/AdminShowcase/AdminDashboardShowcase.tsx

@@ -1,71 +1,71 @@
 import React from 'react';
 import { AdminDashboardTemplate } from '../../templates/admin';
 import type { MetricCard, ChartConfig, ActivityItem, AlertItem } from '../../templates/admin';
-import { Users, DollarSign, TrendingUp, ShoppingCart, Calendar, CreditCard } from 'lucide-react';
+import { Users, DollarSign, TrendingUp } from 'lucide-react';
 
 // Mock data for demonstration
 const mockMetrics: MetricCard[] = [
   {
-    title: 'Total Revenue',
-    value: '$124,832',
-    change: 15.3,
-    changePeriod: 'from last month',
-    icon: <DollarSign className="w-5 h-5" />,
-    category: 2,
-    onClick: () => console.log('Navigate to revenue')
-  },
-  {
-    title: 'Active Users',
-    value: '8,429',
+    title: 'Total Users',
+    value: '12,486',
     change: 12.5,
-    changePeriod: 'from last week',
+    changePeriod: 'from last month',
     icon: <Users className="w-5 h-5" />,
     category: 1,
     onClick: () => console.log('Navigate to users')
   },
   {
-    title: 'Daily Orders',
-    value: '342',
-    change: 8.7,
-    changePeriod: 'from yesterday',
-    icon: <ShoppingCart className="w-5 h-5" />,
-    category: 3,
-    onClick: () => console.log('Navigate to orders')
+    title: 'Revenue',
+    value: '$89,432',
+    change: 8.2,
+    changePeriod: 'from last month',
+    icon: <DollarSign className="w-5 h-5" />,
+    category: 2,
+    onClick: () => console.log('Navigate to revenue')
   },
   {
-    title: 'Conversion Rate',
-    value: '4.2%',
-    change: -1.8,
-    changePeriod: 'from last month',
+    title: 'Growth Rate',
+    value: '23.8%',
+    change: -2.1,
+    changePeriod: 'from last quarter',
     icon: <TrendingUp className="w-5 h-5" />,
-    category: 4,
+    category: 3,
     onClick: () => console.log('Navigate to analytics')
+  },
+  {
+    title: 'Active Sessions',
+    value: '1,247',
+    change: 5.7,
+    changePeriod: 'from yesterday',
+    icon: <Users className="w-5 h-5" />,
+    category: 4,
+    onClick: () => console.log('Navigate to sessions')
   }
 ];
 
 const mockCharts: ChartConfig[] = [
   {
-    title: 'Revenue Trends',
+    title: 'User Growth',
     type: 'line',
     data: [
-      { label: 'Jan', value: 89000 },
-      { label: 'Feb', value: 96000 },
-      { label: 'Mar', value: 108000 },
-      { label: 'Apr', value: 115000 },
-      { label: 'May', value: 118000 },
-      { label: 'Jun', value: 125000 }
+      { label: 'Jan', value: 1200 },
+      { label: 'Feb', value: 1400 },
+      { label: 'Mar', value: 1800 },
+      { label: 'Apr', value: 2200 },
+      { label: 'May', value: 2800 },
+      { label: 'Jun', value: 3200 }
     ],
-    category: 2
+    category: 1
   },
   {
-    title: 'Order Distribution',
+    title: 'Revenue Distribution',
     type: 'pie',
     data: [
-      { label: 'Online', value: 65, category: 1 },
-      { label: 'Mobile App', value: 25, category: 3 },
-      { label: 'In-Store', value: 10, category: 4 }
+      { label: 'Subscriptions', value: 45000, category: 2 },
+      { label: 'One-time', value: 28000, category: 3 },
+      { label: 'Enterprise', value: 16000, category: 1 }
     ],
-    category: 3
+    category: 2
   }
 ];
 
@@ -73,44 +73,44 @@ const mockActivities: ActivityItem[] = [
   {
     id: '1',
     type: 'user',
-    message: 'New customer order placed: $342.50',
-    timestamp: new Date(Date.now() - 2 * 60 * 1000),
-    user: 'Order System'
+    message: 'New user registered: john.doe@example.com',
+    timestamp: new Date(Date.now() - 5 * 60 * 1000),
+    user: 'System'
   },
   {
     id: '2',
-    type: 'content',
-    message: 'Product "Summer Collection 2024" launched',
-    timestamp: new Date(Date.now() - 8 * 60 * 1000),
-    user: 'Product Team'
+    type: 'security',
+    message: 'Failed login attempt detected',
+    timestamp: new Date(Date.now() - 15 * 60 * 1000),
+    user: 'Security Monitor'
   },
   {
     id: '3',
-    type: 'user',
-    message: 'Premium subscription activated: emma.clark@example.com',
-    timestamp: new Date(Date.now() - 15 * 60 * 1000),
-    user: 'Billing System'
+    type: 'content',
+    message: 'Blog post published: "Getting Started Guide"',
+    timestamp: new Date(Date.now() - 30 * 60 * 1000),
+    user: 'content.manager'
   },
   {
     id: '4',
     type: 'system',
-    message: 'Daily revenue report generated: $24,892',
-    timestamp: new Date(Date.now() - 25 * 60 * 1000),
-    user: 'Analytics Engine'
+    message: 'Database backup completed successfully',
+    timestamp: new Date(Date.now() - 60 * 60 * 1000),
+    user: 'System'
   },
   {
     id: '5',
     type: 'user',
-    message: 'Customer support ticket resolved #8429',
-    timestamp: new Date(Date.now() - 35 * 60 * 1000),
-    user: 'Support Team'
+    message: 'User updated profile: sarah.wilson@example.com',
+    timestamp: new Date(Date.now() - 90 * 60 * 1000),
+    user: 'sarah.wilson'
   },
   {
     id: '6',
-    type: 'security',
-    message: 'Weekly security scan completed - no issues found',
-    timestamp: new Date(Date.now() - 45 * 60 * 1000),
-    user: 'Security Monitor'
+    type: 'error',
+    message: 'Payment processing error for order #12847',
+    timestamp: new Date(Date.now() - 120 * 60 * 1000),
+    user: 'Payment System'
   }
 ];
 
@@ -118,26 +118,26 @@ const mockAlerts: AlertItem[] = [
   {
     id: '1',
     severity: 'critical',
-    title: 'Payment Gateway Error',
-    description: 'Multiple payment failures detected in the last hour',
-    timestamp: new Date(Date.now() - 8 * 60 * 1000),
-    onResolve: () => console.log('Resolving payment gateway alert')
+    title: 'High CPU Usage',
+    description: 'Server CPU usage has exceeded 90% for the last 5 minutes',
+    timestamp: new Date(Date.now() - 10 * 60 * 1000),
+    onResolve: () => console.log('Resolving CPU alert')
   },
   {
     id: '2',
     severity: 'medium',
-    title: 'Inventory Low',
-    description: '5 products are running low on stock',
-    timestamp: new Date(Date.now() - 20 * 60 * 1000),
-    onResolve: () => console.log('Resolving inventory alert')
+    title: 'Low Disk Space',
+    description: 'Database server disk usage is at 85%',
+    timestamp: new Date(Date.now() - 30 * 60 * 1000),
+    onResolve: () => console.log('Resolving disk space alert')
   },
   {
     id: '3',
     severity: 'low',
-    title: 'API Rate Limit Warning',
-    description: 'Third-party API usage at 75% of daily limit',
-    timestamp: new Date(Date.now() - 40 * 60 * 1000),
-    onResolve: () => console.log('Resolving API rate limit alert')
+    title: 'SSL Certificate Expiring',
+    description: 'SSL certificate will expire in 30 days',
+    timestamp: new Date(Date.now() - 60 * 60 * 1000),
+    onResolve: () => console.log('Resolving SSL alert')
   }
 ];
 
@@ -148,8 +148,8 @@ export const AdminDashboardShowcase: React.FC = () => {
 
   return (
     <AdminDashboardTemplate
-      title="Business Dashboard"
-      description="Monitor revenue, orders, customers, and operational health"
+      title="System Overview"
+      description="Monitor key metrics, system health, and recent activity"
       metrics={mockMetrics}
       charts={mockCharts}
       activities={mockActivities}
@@ -159,12 +159,10 @@ export const AdminDashboardShowcase: React.FC = () => {
       actions={
         <div className="flex gap-2">
           <button className="px-3 py-2 text-sm border border-input rounded-md hover:bg-muted">
-            <Calendar className="w-4 h-4 mr-2 inline" />
             Export Report
           </button>
-          <button className="px-3 py-2 text-sm bg-category-2 text-white rounded-md hover:bg-category-2/90">
-            <CreditCard className="w-4 h-4 mr-2 inline" />
-            View Transactions
+          <button className="px-3 py-2 text-sm bg-category-1 text-white rounded-md hover:bg-category-1/90">
+            View Analytics
           </button>
         </div>
       }

package/src/pages/AdminShowcase/index.tsx

@@ -1,4 +1,3 @@
 export { AdminDashboardShowcase } from './AdminDashboardShowcase';
 export { AdminCRUDShowcase } from './AdminCRUDShowcase';
-export { AdminDetailShowcase } from './AdminDetailShowcase';
-export { SalesPerformanceDashboard } from './SalesPerformanceDashboard';
+export { AdminDetailShowcase } from './AdminDetailShowcase';

package/src/pages/index.ts

@@ -1,3 +1,2 @@
 export { ComponentShowcase } from './ComponentShowcase';
-export * from './AdminShowcase';
-export * from './EntityShowcase';
+export * from './AdminShowcase';

package/src/templates/factory.tsx

@@ -2,12 +2,13 @@ import React from 'react'
 import type { ReactNode } from 'react'
 import { createRoot } from 'react-dom/client'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 import { BrowserRouter, Routes, Route } from 'react-router-dom'
 import { AuthProvider } from '../features/auth'
-import { SidebarProvider, NavigationProvider } from '../molecules/layout'
+import { SidebarProvider } from '../molecules/layout'
 import { AppLayout } from '../molecules/layout'
 import { DashboardTemplate } from './DashboardTemplate'
-import type { AuthConfig, NavigationConfig } from '../atoms/types'
+import type { AuthConfig } from '../atoms/types'
 
 // App configuration interface
 export interface AppConfig {
@@ -23,7 +24,6 @@ export interface AppConfig {
   theme?: string
   darkMode?: boolean
   auth?: AuthConfig
-  navigation?: NavigationConfig
   customProviders?: React.ComponentType<{ children: ReactNode }>[]
 }
 
@@ -50,7 +50,6 @@ export function createReactApp(config: AppConfig | string): AppInstance {
     enableQuery = true,
     enableRouting = true,
     auth,
-    navigation,
     customProviders = []
   } = appConfig
 
@@ -95,11 +94,9 @@ export function createReactApp(config: AppConfig | string): AppInstance {
     // Wrap with layout providers
     if (enableRouting) {
       tree = (
-        <NavigationProvider initialNavigation={navigation}>
-          <SidebarProvider>
-            {tree}
-          </SidebarProvider>
-        </NavigationProvider>
+        <SidebarProvider>
+          {tree}
+        </SidebarProvider>
       )
     }
 
@@ -113,11 +110,7 @@ export function createReactApp(config: AppConfig | string): AppInstance {
       tree = (
         <QueryClientProvider client={queryClient}>
           {tree}
-          {import.meta.env.DEV && (
-            import('@tanstack/react-query-devtools').then(({ ReactQueryDevtools }) => (
-              <ReactQueryDevtools initialIsOpen={false} />
-            ))
-          )}
+          {import.meta.env.DEV && <ReactQueryDevtools initialIsOpen={false} />}
         </QueryClientProvider>
       )
     }