@classic-homes/theme-mcp 0.1.10 → 0.1.11

package/dist/index.js

@@ -10828,7 +10828,7 @@ var pattern_library_default = {
     {
       id: "dashboard-page",
       name: "Dashboard Page",
-      description: "Full dashboard layout with sidebar navigation",
+      description: "Full dashboard layout with sidebar navigation, role-based section expansion, and user-driven pinning",
       useCase: "Authenticated dashboard pages",
       components: [
         "DashboardLayout",
@@ -10838,7 +10838,10 @@ var pattern_library_default = {
       props: {
         navigation: "NavSection[]",
         user: "User",
-        sidebarVariant: "'light' | 'dark'"
+        sidebarVariant: "'light' | 'dark'",
+        enablePinning: "boolean",
+        initialPinnedItems: "string[]",
+        onPinnedChange: "(pinnedIds: string[]) => void"
       },
       example: `<script lang="ts">
   import { DashboardLayout } from '@classic-homes/theme-svelte';
@@ -10848,8 +10851,18 @@ var pattern_library_default = {
     {
       id: 'main',
       items: [
-        { id: 'dashboard', name: 'Dashboard', href: '/dashboard', icon: 'home' },
-        { id: 'settings', name: 'Settings', href: '/settings', icon: 'settings' },
+        { id: 'dashboard', name: 'Dashboard', href: '/dashboard', icon: 'home', pinnable: true },
+        { id: 'settings', name: 'Settings', href: '/settings', icon: 'settings', pinnable: true },
+      ],
+    },
+    {
+      id: 'admin',
+      title: 'Administration',
+      collapsible: true,
+      expandForRoles: ['admin', 'superuser'],
+      items: [
+        { id: 'users', name: 'Users', href: '/admin/users', icon: 'users', pinnable: true },
+        { id: 'roles', name: 'Roles', href: '/admin/roles', icon: 'shield', pinnable: true },
       ],
     },
   ];
@@ -10858,10 +10871,24 @@ var pattern_library_default = {
     id: '1',
     name: 'John Doe',
     email: 'john@example.com',
+    roles: ['admin'],
   };
+
+  async function handlePinnedChange(pinnedIds: string[]) {
+    await fetch('/api/user/preferences', {
+      method: 'PATCH',
+      body: JSON.stringify({ pinnedItems: pinnedIds }),
+    });
+  }
 </script>
 
-<DashboardLayout {navigation} {user} appName="My App">
+<DashboardLayout
+  {navigation}
+  {user}
+  appName="My App"
+  enablePinning={true}
+  onPinnedChange={handlePinnedChange}
+>
   <h1>Welcome to Dashboard</h1>
 </DashboardLayout>`
     },
@@ -13438,7 +13465,10 @@ function registerLayoutPagePrompt(server) {
       const layoutGuide = {
         dashboard: `DashboardLayout - For authenticated dashboard pages with sidebar navigation
 - Props: navigation (NavSection[]), user (User), appName, pageTitle, sidebarVariant, headerSearch
-- Supports: collapsible sidebar, user menu, quick links, mobile responsive`,
+- Pinning Props: enablePinning, pinnedSectionTitle, initialPinnedItems, onPinnedChange, pinIcon
+- Supports: collapsible sidebar, user menu, quick links, mobile responsive
+- Role-based Expansion: Use expandForRoles on NavSection to auto-expand sections for users with specific roles
+- User Pinning: Enable pinnable items (pinnable: true on NavItem) with onPinnedChange callback for persistence`,
         public: `PublicLayout - For public-facing pages with header and footer
 - Props: navigation (NavItem[]), footerLinks (NavSection[]), copyright, headerSearch
 - Supports: responsive header nav, footer link sections, logo customization`,
@@ -13480,12 +13510,16 @@ interface NavItem {
   badge?: string | number;
   children?: NavItem[];
   active?: boolean;
+  pinnable?: boolean;  // Allow this item to be pinned by users
 }
 
 interface NavSection {
   id: string;
   title?: string;
   items: NavItem[];
+  collapsible?: boolean;
+  expanded?: boolean;
+  expandForRoles?: string[];  // Auto-expand for users with these roles
 }
 
 interface User {
@@ -13493,7 +13527,14 @@ interface User {
   name: string;
   email?: string;
   avatar?: string;
-  roles?: string[];
+  roles?: string[];  // Used for role-based section expansion
+}
+
+// For external persistence of sidebar preferences
+interface SidebarPreferences {
+  pinnedItems: string[];
+  expandedSections: string[];
+  expandedItems: string[];
 }
 \`\`\`