cortex-react-components 2.0.1 → 2.0.2

package/dist/components/dc-temp/COLLEAGUE_SELECTION_README.mjs

@@ -0,0 +1,117 @@
+import"../../chunk-M6LJ4BNZ.mjs";var a=`# Enhanced Colleague Management
+
+This update adds enhanced functionality for adding colleagues to the ColleaguesView component. Instead of only allowing manual form creation, users can now:
+
+## New Features
+
+### 1. User Selection for Human Colleagues
+- Browse existing users in the organization
+- Search and filter by name, email, role, or skills
+- Filter by department
+- Select users to automatically import their details as human colleagues
+
+### 2. Digital Colleague Cloning
+- Browse existing digital colleagues
+- Clone digital colleagues with all their capabilities, knowledge, and configurations
+- Automatically creates a copy with a new ID and updated metadata
+
+### 3. Streamlined Addition Flow
+- Type selection (Human vs Digital)
+- For humans: User selection \u2192 automatic colleague creation
+- For digital: Choice between cloning existing or creating new \u2192 respective flows
+
+## Components
+
+### \`UserSelection\`
+Provides a searchable, filterable interface for selecting existing users to add as colleagues.
+
+**Props:**
+- \`users: User[]\` - Array of available users
+- \`onUserSelect: (user: User) => void\` - Callback when user is selected
+- \`onCancel: () => void\` - Callback to cancel selection
+- \`departments?: string[]\` - Available departments for filtering
+- \`selectedUserId?: string\` - Currently selected user ID
+
+### \`DigitalColleagueClone\`
+Allows users to browse and clone existing digital colleagues.
+
+**Props:**
+- \`digitalColleagues: DigitalColleague[]\` - Array of existing digital colleagues
+- \`onColleagueClone: (colleague: DigitalColleague) => void\` - Callback when colleague is cloned
+- \`onCancel: () => void\` - Callback to cancel cloning
+- \`selectedColleagueId?: string\` - Currently selected colleague ID
+
+### \`ColleagueTypeSelection\`
+Initial selection screen for choosing between human and digital colleague addition.
+
+**Props:**
+- \`onSelectHuman: () => void\` - Callback for human selection
+- \`onSelectDigital: () => void\` - Callback for digital selection
+- \`onCancel: () => void\` - Callback to cancel
+
+### \`DigitalColleagueOptions\`
+Choice screen for digital colleagues between cloning and creating new.
+
+**Props:**
+- \`onCloneExisting: () => void\` - Callback for cloning flow
+- \`onCreateNew: () => void\` - Callback for new creation flow
+- \`onCancel: () => void\` - Callback to cancel
+
+## Updated ColleaguesView Props
+
+The main \`ColleaguesView\` component now accepts additional props:
+
+\`\`\`typescript
+interface ColleaguesViewProps {
+  // ... existing props
+  availableUsers?: User[]  // Users available for selection
+  existingDigitalColleagues?: DigitalColleague[]  // Digital colleagues available for cloning
+}
+\`\`\`
+
+## User Type Definition
+
+\`\`\`typescript
+interface User {
+  id: string
+  name: string
+  email: string
+  role: string
+  department: string
+  avatar?: string
+  skills?: string[]
+  location?: string
+  phone?: string
+  timezone?: string
+  bio?: string
+}
+\`\`\`
+
+## Usage Example
+
+\`\`\`tsx
+import ColleaguesView from './ColleaguesView'
+import { mockUsers, mockDigitalColleagues } from './mock-data'
+
+function App() {
+  return (
+    <ColleaguesView
+      initialColleagues={colleagues}
+      availableUsers={mockUsers}
+      existingDigitalColleagues={mockDigitalColleagues}
+      onColleagueAdd={(colleague) => console.log('Added:', colleague)}
+      onColleagueEdit={(colleague) => console.log('Edited:', colleague)}
+      onColleagueDelete={(id) => console.log('Deleted:', id)}
+    />
+  )
+}
+\`\`\`
+
+## Features
+
+- **Responsive Design**: All components work well on mobile and desktop
+- **Search & Filter**: Comprehensive search and filtering capabilities
+- **Animations**: Smooth transitions using Framer Motion
+- **Accessibility**: Proper keyboard navigation and screen reader support
+- **Type Safety**: Full TypeScript support with proper type definitions
+`;export{a as default};

package/dist/components/dc-temp/DIGITAL_COLLEAGUE_UPDATES.js

@@ -0,0 +1,207 @@
+var a=`# Digital Colleague Updates
+
+## Overview
+
+Updated the digital colleague system to remove unnecessary fields, implement knowledge document management with a searchable interface, and simplify the form with better UX patterns.
+
+## Key Changes Made
+
+### 1. Type System Updates (\`DigitalColleagues/types.ts\`)
+
+**Removed from DigitalColleague:**
+- \`email\` - Digital colleagues don't need email addresses
+- \`role\` - Job description serves this purpose
+- \`department\` - Not applicable to digital assistants
+
+**Removed from BaseColleague:**
+- \`avatar\` - Simplified to use initials only
+- \`away\` status - Simplified to just active/inactive
+
+**Enhanced BaseColleague:**
+- Moved \`email\`, \`role\`, and \`department\` to only \`HumanColleague\`
+- Simplified status to \`"active" | "inactive"\` only
+- Digital colleagues now have a cleaner, focused type definition
+
+**Updated Work Instructions:**
+- \`workInstructions: string[]\` \u2192 \`workInstructions: string\` (free-text textarea)
+
+**New KnowledgeDocument Interface:**
+\`\`\`typescript
+interface KnowledgeDocument {
+  id: string
+  title: string
+  description?: string
+  metadata?: Record<string, any>
+  tags?: string[]
+  createdAt: Date
+  updatedAt?: Date
+}
+\`\`\`
+
+**Updated Knowledge References:**
+- \`knowledge: string[]\` \u2192 \`knowledge: KnowledgeDocument[]\`
+- \`coreKnowledge: string[]\` \u2192 \`coreKnowledge: KnowledgeDocument[]\`
+
+### 2. Knowledge Search Component (\`knowledge-search.tsx\`)
+
+**Features:**
+- **Real-time Search**: Search by title, description, tags, and metadata
+- **Searchable Tags**: Visual tag display with search functionality
+- **Selection Management**: Add/remove documents with visual feedback
+- **Max Selections**: Optional limit on number of documents
+- **Responsive Design**: Clean dropdown interface with scroll support
+- **Accessibility**: Full keyboard navigation and screen reader support
+
+**Search Capabilities:**
+- Title matching
+- Description content search
+- Tag-based filtering
+- Metadata field search
+- Case-insensitive matching
+
+### 3. Updated ColleagueForm (\`colleague-form.tsx\`)
+
+**Major UX Improvements:**
+- **Status Toggle**: Replaced dropdown with simple Active/Inactive toggle switch
+- **Free-text Work Instructions**: Changed from array input to textarea for natural text entry
+- **Removed Avatar URL**: Simplified to use name initials only
+- **Conditional Fields**: Email/role/department only shown for human colleagues
+- **Knowledge Search**: Replaced string arrays with searchable document selection
+- **Separate Sections**: Clear separation between human and digital colleague fields
+- **Enhanced UX**: Better organization and visual hierarchy
+
+**Digital Colleague Specific:**
+- Job Description (replaces role concept)
+- Work Instructions (free-text textarea)
+- Capabilities (array of strings)
+- Knowledge Documents (searchable selection)
+- Core Knowledge Documents (searchable with limit)
+- Version and Active status toggle
+
+### 4. Updated ColleagueCard (\`colleague-card.tsx\`)
+
+**Display Logic:**
+- **Human Colleagues**: Show email, role, department, phone, location
+- **Digital Colleagues**: Show job description, version, capabilities
+- **Conditional Rendering**: Only show relevant fields per type
+- **Simplified Avatars**: Use name initials instead of uploaded images
+- **Enhanced Badges**: Different badge styles for different colleague types
+- **Simplified Status**: Only show active/inactive states
+
+### 5. Updated ColleaguesView (\`Views/ColleaguesView.tsx\`)
+
+**Search Improvements:**
+- **Type-aware Filtering**: Different search fields for human vs digital
+- **Enhanced Search**: Human colleagues search by name/email/role, digital by name/job description
+- **Department Filtering**: Only applies to human colleagues
+- **Simplified Status Filter**: Only active/inactive options
+- **Better UX**: More intuitive filtering based on colleague type
+
+## Usage Examples
+
+### Creating a Digital Colleague with Knowledge
+
+\`\`\`typescript
+const digitalColleague: DigitalColleague = {
+  id: "dc-001",
+  name: "AI Assistant Alpha",
+  type: "digital",
+  status: "active", // Only "active" or "inactive"
+  joinedDate: new Date(),
+  jobDescription: "Specialized AI assistant for React development support",
+  workInstructions: \`Please provide React best practices guidance and help with TypeScript type issues. 
+  
+  When reviewing code:
+  1. Check for optimization opportunities
+  2. Suggest better patterns when applicable
+  3. Ensure accessibility standards are met
+  
+  Always be helpful and provide clear explanations.\`,
+  capabilities: ["React", "TypeScript", "Code Review", "Documentation"],
+  knowledge: [
+    {
+      id: "1",
+      title: "React Development Best Practices",
+      description: "Comprehensive guide to React patterns",
+      tags: ["react", "javascript", "frontend"],
+      createdAt: new Date(),
+    }
+  ],
+  coreKnowledge: [
+    {
+      id: "2", 
+      title: "TypeScript Advanced Types",
+      description: "Deep dive into TypeScript's type system",
+      tags: ["typescript", "types"],
+      createdAt: new Date(),
+    }
+  ],
+  version: "2.1.0",
+  lastUpdated: new Date(),
+  isActive: true,
+}
+\`\`\`
+
+### Using the Knowledge Search Component
+
+\`\`\`tsx
+<KnowledgeSearch
+  selectedDocuments={knowledge}
+  onDocumentsChange={setKnowledge}
+  label="Knowledge Base"
+  placeholder="Search for relevant documents..."
+  maxSelections={5}
+/>
+\`\`\`
+
+### Form UX Improvements
+
+\`\`\`tsx
+{/* Status as simple toggle */}
+<div className="flex items-center gap-2">
+  <Switch
+    id="status"
+    checked={formData.status === "active"}
+    onCheckedChange={(checked) => setFormData({ 
+      ...formData, 
+      status: checked ? "active" : "inactive" 
+    })}
+  />
+  <Label htmlFor="status">Active Status</Label>
+</div>
+
+{/* Work instructions as free text */}
+<div className="space-y-2">
+  <Label htmlFor="workInstructions">Work Instructions</Label>
+  <Textarea
+    id="workInstructions"
+    value={workInstructions}
+    onChange={(e) => setWorkInstructions(e.target.value)}
+    rows={4}
+    placeholder="Enter detailed work instructions..."
+  />
+</div>
+\`\`\`
+
+## Benefits
+
+1. **Cleaner Type System**: Digital colleagues only have relevant fields
+2. **Enhanced Search**: Rich knowledge document search with metadata
+3. **Better UX**: 
+   - Simple toggle for status instead of dropdown
+   - Free-text work instructions instead of array management
+   - No avatar URL management required
+4. **Scalable**: Easy to add new knowledge documents and search criteria
+5. **Maintainable**: Clear separation of concerns between colleague types
+6. **Simplified**: Removed unnecessary complexity while maintaining functionality
+
+## Migration Notes
+
+- Existing digital colleagues will need:
+  - \`knowledge\` and \`coreKnowledge\` arrays converted to \`KnowledgeDocument\` objects
+  - \`workInstructions\` array joined into a single string
+  - \`email\`, \`role\`, \`department\`, and \`avatar\` fields removed
+  - \`status\` updated to only "active" or "inactive" (convert "away" to "inactive")
+- Update any code that accesses removed fields to check colleague type first
+- Forms will automatically adapt to the new simpler UX patterns
+`;

package/dist/components/dc-temp/DIGITAL_COLLEAGUE_UPDATES.mjs

@@ -0,0 +1,207 @@
+import"../../chunk-M6LJ4BNZ.mjs";var a=`# Digital Colleague Updates
+
+## Overview
+
+Updated the digital colleague system to remove unnecessary fields, implement knowledge document management with a searchable interface, and simplify the form with better UX patterns.
+
+## Key Changes Made
+
+### 1. Type System Updates (\`DigitalColleagues/types.ts\`)
+
+**Removed from DigitalColleague:**
+- \`email\` - Digital colleagues don't need email addresses
+- \`role\` - Job description serves this purpose
+- \`department\` - Not applicable to digital assistants
+
+**Removed from BaseColleague:**
+- \`avatar\` - Simplified to use initials only
+- \`away\` status - Simplified to just active/inactive
+
+**Enhanced BaseColleague:**
+- Moved \`email\`, \`role\`, and \`department\` to only \`HumanColleague\`
+- Simplified status to \`"active" | "inactive"\` only
+- Digital colleagues now have a cleaner, focused type definition
+
+**Updated Work Instructions:**
+- \`workInstructions: string[]\` \u2192 \`workInstructions: string\` (free-text textarea)
+
+**New KnowledgeDocument Interface:**
+\`\`\`typescript
+interface KnowledgeDocument {
+  id: string
+  title: string
+  description?: string
+  metadata?: Record<string, any>
+  tags?: string[]
+  createdAt: Date
+  updatedAt?: Date
+}
+\`\`\`
+
+**Updated Knowledge References:**
+- \`knowledge: string[]\` \u2192 \`knowledge: KnowledgeDocument[]\`
+- \`coreKnowledge: string[]\` \u2192 \`coreKnowledge: KnowledgeDocument[]\`
+
+### 2. Knowledge Search Component (\`knowledge-search.tsx\`)
+
+**Features:**
+- **Real-time Search**: Search by title, description, tags, and metadata
+- **Searchable Tags**: Visual tag display with search functionality
+- **Selection Management**: Add/remove documents with visual feedback
+- **Max Selections**: Optional limit on number of documents
+- **Responsive Design**: Clean dropdown interface with scroll support
+- **Accessibility**: Full keyboard navigation and screen reader support
+
+**Search Capabilities:**
+- Title matching
+- Description content search
+- Tag-based filtering
+- Metadata field search
+- Case-insensitive matching
+
+### 3. Updated ColleagueForm (\`colleague-form.tsx\`)
+
+**Major UX Improvements:**
+- **Status Toggle**: Replaced dropdown with simple Active/Inactive toggle switch
+- **Free-text Work Instructions**: Changed from array input to textarea for natural text entry
+- **Removed Avatar URL**: Simplified to use name initials only
+- **Conditional Fields**: Email/role/department only shown for human colleagues
+- **Knowledge Search**: Replaced string arrays with searchable document selection
+- **Separate Sections**: Clear separation between human and digital colleague fields
+- **Enhanced UX**: Better organization and visual hierarchy
+
+**Digital Colleague Specific:**
+- Job Description (replaces role concept)
+- Work Instructions (free-text textarea)
+- Capabilities (array of strings)
+- Knowledge Documents (searchable selection)
+- Core Knowledge Documents (searchable with limit)
+- Version and Active status toggle
+
+### 4. Updated ColleagueCard (\`colleague-card.tsx\`)
+
+**Display Logic:**
+- **Human Colleagues**: Show email, role, department, phone, location
+- **Digital Colleagues**: Show job description, version, capabilities
+- **Conditional Rendering**: Only show relevant fields per type
+- **Simplified Avatars**: Use name initials instead of uploaded images
+- **Enhanced Badges**: Different badge styles for different colleague types
+- **Simplified Status**: Only show active/inactive states
+
+### 5. Updated ColleaguesView (\`Views/ColleaguesView.tsx\`)
+
+**Search Improvements:**
+- **Type-aware Filtering**: Different search fields for human vs digital
+- **Enhanced Search**: Human colleagues search by name/email/role, digital by name/job description
+- **Department Filtering**: Only applies to human colleagues
+- **Simplified Status Filter**: Only active/inactive options
+- **Better UX**: More intuitive filtering based on colleague type
+
+## Usage Examples
+
+### Creating a Digital Colleague with Knowledge
+
+\`\`\`typescript
+const digitalColleague: DigitalColleague = {
+  id: "dc-001",
+  name: "AI Assistant Alpha",
+  type: "digital",
+  status: "active", // Only "active" or "inactive"
+  joinedDate: new Date(),
+  jobDescription: "Specialized AI assistant for React development support",
+  workInstructions: \`Please provide React best practices guidance and help with TypeScript type issues. 
+  
+  When reviewing code:
+  1. Check for optimization opportunities
+  2. Suggest better patterns when applicable
+  3. Ensure accessibility standards are met
+  
+  Always be helpful and provide clear explanations.\`,
+  capabilities: ["React", "TypeScript", "Code Review", "Documentation"],
+  knowledge: [
+    {
+      id: "1",
+      title: "React Development Best Practices",
+      description: "Comprehensive guide to React patterns",
+      tags: ["react", "javascript", "frontend"],
+      createdAt: new Date(),
+    }
+  ],
+  coreKnowledge: [
+    {
+      id: "2", 
+      title: "TypeScript Advanced Types",
+      description: "Deep dive into TypeScript's type system",
+      tags: ["typescript", "types"],
+      createdAt: new Date(),
+    }
+  ],
+  version: "2.1.0",
+  lastUpdated: new Date(),
+  isActive: true,
+}
+\`\`\`
+
+### Using the Knowledge Search Component
+
+\`\`\`tsx
+<KnowledgeSearch
+  selectedDocuments={knowledge}
+  onDocumentsChange={setKnowledge}
+  label="Knowledge Base"
+  placeholder="Search for relevant documents..."
+  maxSelections={5}
+/>
+\`\`\`
+
+### Form UX Improvements
+
+\`\`\`tsx
+{/* Status as simple toggle */}
+<div className="flex items-center gap-2">
+  <Switch
+    id="status"
+    checked={formData.status === "active"}
+    onCheckedChange={(checked) => setFormData({ 
+      ...formData, 
+      status: checked ? "active" : "inactive" 
+    })}
+  />
+  <Label htmlFor="status">Active Status</Label>
+</div>
+
+{/* Work instructions as free text */}
+<div className="space-y-2">
+  <Label htmlFor="workInstructions">Work Instructions</Label>
+  <Textarea
+    id="workInstructions"
+    value={workInstructions}
+    onChange={(e) => setWorkInstructions(e.target.value)}
+    rows={4}
+    placeholder="Enter detailed work instructions..."
+  />
+</div>
+\`\`\`
+
+## Benefits
+
+1. **Cleaner Type System**: Digital colleagues only have relevant fields
+2. **Enhanced Search**: Rich knowledge document search with metadata
+3. **Better UX**: 
+   - Simple toggle for status instead of dropdown
+   - Free-text work instructions instead of array management
+   - No avatar URL management required
+4. **Scalable**: Easy to add new knowledge documents and search criteria
+5. **Maintainable**: Clear separation of concerns between colleague types
+6. **Simplified**: Removed unnecessary complexity while maintaining functionality
+
+## Migration Notes
+
+- Existing digital colleagues will need:
+  - \`knowledge\` and \`coreKnowledge\` arrays converted to \`KnowledgeDocument\` objects
+  - \`workInstructions\` array joined into a single string
+  - \`email\`, \`role\`, \`department\`, and \`avatar\` fields removed
+  - \`status\` updated to only "active" or "inactive" (convert "away" to "inactive")
+- Update any code that accesses removed fields to check colleague type first
+- Forms will automatically adapt to the new simpler UX patterns
+`;export{a as default};

package/dist/components/dc-temp/IMPLEMENTATION_SUMMARY.js

@@ -0,0 +1,121 @@
+var a=`# Teams Index View Implementation Summary
+
+## Overview
+Successfully created a TeamsIndexView component in a similar style to the ProjectsIndexView that shows "My Teams" - the teams that the user is part of. The implementation includes team cards that display name, description, number of colleagues (human/digital), and number of projects.
+
+## Files Created
+
+### Core Components
+1. **\`TeamsIndexView.tsx\`** - Main view component displaying team listings
+2. **\`team-card.tsx\`** - Individual team card component
+3. **\`team-card.stories.tsx\`** - Storybook stories for the team card
+4. **\`TeamsIndexView.stories.tsx\`** - Storybook stories for the main view
+
+### Supporting Files
+5. **\`teams-complete-example.stories.tsx\`** - Comprehensive example with documentation
+6. **\`team-card.test.tsx\`** - Unit tests for the team card component
+7. **\`teams-index-view.test.tsx\`** - Unit tests for the main view component
+8. **\`dashboard-integration-example.tsx\`** - Integration guide for adding to dashboard
+9. **\`TEAMS_README.md\`** - Complete documentation
+
+## Data Structure Added
+
+### New Types (added to \`types.ts\`)
+\`\`\`typescript
+interface TeamSummary {
+  id: string
+  name: string
+  description: string
+  humanColleagues: number
+  digitalColleagues: number
+  projects: number
+}
+
+interface TeamMember {
+  id: string
+  name: string
+  email: string
+  role: string
+  type: 'human' | 'digital'
+  avatar?: string
+  joinedAt: Date
+}
+
+interface Team {
+  id: string
+  name: string
+  description: string
+  members: TeamMember[]
+  projects: Project[]
+  createdAt: Date
+  updatedAt: Date
+  isActive: boolean
+}
+
+interface TeamFormData {
+  name: string
+  description: string
+  members: string[]
+}
+\`\`\`
+
+### Mock Data (added to \`test-data.ts\`)
+- \`mockTeamSummary\`: Array of 6 sample teams with varied data
+
+## Features Implemented
+
+### TeamsIndexView Component
+- **Hero Section**: With gradient background and "Create Team" action
+- **Team Grid**: Responsive grid layout displaying team cards
+- **Empty State**: Friendly message when user has no teams
+- **Animations**: Smooth transitions using Framer Motion
+- **Callbacks**: Support for team creation and opening
+
+### TeamCard Component
+- **Team Information**: Name, description
+- **Statistics Display**: 
+  - Human colleagues count (with blue user icon)
+  - Digital colleagues count (with purple bot icon)
+  - Projects count (with green folder icon)
+- **Actions**: Single "View Team" button
+- **Hover Effects**: Scale and elevation animations
+- **Responsive Design**: Works on all screen sizes
+
+## Design Consistency
+- **Similar to ProjectsIndexView**: Maintains same layout patterns and styling
+- **UI Components**: Uses existing design system components (Card, Button, Badge, etc.)
+- **Color Scheme**: Consistent with existing palette
+- **Icons**: Uses Lucide React icons for consistency
+- **Typography**: Follows established text hierarchies
+
+## Integration Ready
+- **Exports**: Added to main component index files
+- **Dashboard Integration**: Ready to be added to dashboard with provided example
+- **Sidebar**: Teams item already exists in mockSidebarItems
+- **Navigation**: Prepared for "teams" tab in dashboard switch statement
+
+## Future Enhancements
+- Team creation dialog/form
+- Team detail view
+- Team management functionality
+- Real-time team updates
+- Team member management
+- Integration with actual API endpoints
+
+## Testing
+- Unit tests for both components
+- Storybook stories for visual testing
+- Type checking passes
+- Build process successful
+
+## Usage Example
+\`\`\`tsx
+<TeamsIndexView
+  teams={mockTeamSummary}
+  onTeamOpen={(team) => navigate(\`/teams/\${team.id}\`)}
+  onCreateTeam={() => openCreateDialog()}
+/>
+\`\`\`
+
+The implementation successfully delivers a complete teams management interface that integrates seamlessly with the existing design system and architecture.
+`;