{ "$schema": "https://uipkge.dev/schema/registry-item.json", "name": "ai-crm-pipeline-dashboard", "title": "Ai Crm Pipeline Dashboard", "type": "registry:block", "files": [ { "path": "packages/registry-angular/blocks/ai-crm-pipeline-dashboard/ai-crm-pipeline-dashboard.component.ts", "content": "// High-craft AI CRM deal pipeline: revenue velocity metrics, 4-stage Kanban board\n// with predictive win scores, deal progress bars, and AI meeting summaries with\n// buying intent detection. Port of the React block 1:1.\nimport { ChangeDetectionStrategy, Component, Input, computed, signal } from '@angular/core'\nimport {\n BarChart3,\n Bot,\n BrainCircuit,\n CheckCircle2,\n DollarSign,\n Download,\n FileCheck,\n Kanban,\n LucideAngularModule,\n Plus,\n Search,\n Sparkles,\n Table as TableIcon,\n Timer,\n TrendingUp,\n User,\n Video,\n Wand2,\n Zap,\n} from 'lucide-angular'\nimport { cn } from '@/lib/utils'\nimport { UiAvatarComponent, UiAvatarFallbackComponent } from '@/ui/avatar/avatar.component'\nimport { UiBadgeComponent } from '@/ui/badge/badge.component'\nimport { UiButtonComponent } from '@/ui/button/button.component'\nimport {\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n} from '@/ui/card/card.component'\nimport { UiProgressComponent } from '@/ui/progress/progress.component'\nimport {\n UiTableBodyComponent,\n UiTableCellComponent,\n UiTableComponent,\n UiTableHeadComponent,\n UiTableHeaderComponent,\n UiTableRowComponent,\n} from '@/ui/table/table.component'\n\nexport type PipelineStageId = 'discovery' | 'demo' | 'proposal' | 'negotiation'\nexport type PipelineViewMode = 'kanban' | 'table'\nexport type PipelineStageFilter = 'all' | PipelineStageId\n\nexport interface DealItem {\n id: string\n company: string\n companyInitials: string\n avatarBg: string\n dealName: string\n tier: 'Enterprise' | 'Mid-Market' | 'Growth'\n value: number\n valueFormatted: string\n stageId: PipelineStageId\n stageName: string\n stageProgress: number\n aiWinScore: number\n contactName: string\n contactRole: string\n ownerName: string\n ownerInitials: string\n closeDate: string\n daysToClose: string\n nextStep: string\n isWinReady?: boolean\n activityCount: number\n}\n\nexport interface StageSummary {\n id: PipelineStageId\n name: string\n dealCountText: string\n totalValueText: string\n avgAiScoreText: string\n accentColor: string\n badgeVariant: string\n progressValue: number\n description: string\n}\n\nexport interface MeetingInsight {\n id: string\n company: string\n companyInitials: string\n avatarBg: string\n dealName: string\n meetingTitle: string\n timeAgo: string\n duration: string\n platform: string\n attendees: string[]\n buyingIntentScore: number\n buyingIntentLabel: string\n sentimentScore: string\n keyTakeaways: string\n aiRecommendedAction: string\n primaryActionLabel: string\n}\n\nconst defaultStages: StageSummary[] = [\n {\n id: 'discovery',\n name: 'Discovery & Qualification',\n dealCountText: '6 deals',\n totalValueText: '$240k',\n avgAiScoreText: 'AI score 42%',\n accentColor: 'bg-info',\n badgeVariant: 'bg-info/10 text-info border-info/20',\n progressValue: 25,\n description: 'Initial ICP qualification, technical scoping, and business fit discovery',\n },\n {\n id: 'demo',\n name: 'Technical Demo & Evaluation',\n dealCountText: '8 deals',\n totalValueText: '$480k',\n avgAiScoreText: 'AI score 68%',\n accentColor: 'bg-chart-1',\n badgeVariant: 'bg-chart-1/10 text-chart-1 border-chart-1/20',\n progressValue: 50,\n description: 'Deep-dive sandbox environment, latency benchmarks, and API trials',\n },\n {\n id: 'proposal',\n name: 'Executive Proposal & Security',\n dealCountText: '6 deals',\n totalValueText: '$520k',\n avgAiScoreText: 'AI score 84%',\n accentColor: 'bg-warning',\n badgeVariant: 'bg-warning/10 text-warning border-warning/20',\n progressValue: 75,\n description: 'Security & InfoSec clearance, CFO business case, and custom licensing',\n },\n {\n id: 'negotiation',\n name: 'Contract Negotiation & Closing',\n dealCountText: '4 deals',\n totalValueText: '$188k',\n avgAiScoreText: 'AI score 94%',\n accentColor: 'bg-success',\n badgeVariant: 'bg-success/10 text-success border-success/20',\n progressValue: 100,\n description: 'Master service agreement redlines, final DPA signoff, and onboarding kickoff',\n },\n]\n\nconst defaultDeals: DealItem[] = [\n {\n id: 'deal-1',\n company: 'Acme Corp',\n companyInitials: 'AC',\n avatarBg: 'bg-info/15 text-info',\n dealName: 'Acme Corp - Enterprise 500 Seats',\n tier: 'Enterprise',\n value: 120000,\n valueFormatted: '$120,000 ARR',\n stageId: 'discovery',\n stageName: 'Discovery & Qualification',\n stageProgress: 25,\n aiWinScore: 48,\n contactName: 'David Chen',\n contactRole: 'VP Eng',\n ownerName: 'Sarah Jenkins (AE)',\n ownerInitials: 'SJ',\n closeDate: 'Aug 28',\n daysToClose: '7 days',\n nextStep: 'Complete Security Questionnaire review',\n activityCount: 4,\n },\n {\n id: 'deal-2',\n company: 'HyperScale Cloud',\n companyInitials: 'HC',\n avatarBg: 'bg-info/15 text-info',\n dealName: 'HyperScale Cloud - Infra Observability',\n tier: 'Growth',\n value: 75000,\n valueFormatted: '$75,000 ARR',\n stageId: 'discovery',\n stageName: 'Discovery & Qualification',\n stageProgress: 25,\n aiWinScore: 42,\n contactName: 'Elena Rostova',\n contactRole: 'Head of DevOps',\n ownerName: 'Michael Chang (AE)',\n ownerInitials: 'MC',\n closeDate: 'Sep 14',\n daysToClose: '24 days',\n nextStep: 'Deliver architectural scoping document',\n activityCount: 3,\n },\n {\n id: 'deal-3',\n company: 'Global Logistics Hub',\n companyInitials: 'GL',\n avatarBg: 'bg-cyan-500/15 text-cyan-600 dark:text-cyan-400',\n dealName: 'Global Logistics - Fleet Telematics',\n tier: 'Mid-Market',\n value: 45000,\n valueFormatted: '$45,000 ARR',\n stageId: 'discovery',\n stageName: 'Discovery & Qualification',\n stageProgress: 25,\n aiWinScore: 36,\n contactName: 'Marcus Brody',\n contactRole: 'Dir. Operations',\n ownerName: 'Jessica Wu (AE)',\n ownerInitials: 'JW',\n closeDate: 'Sep 22',\n daysToClose: '32 days',\n nextStep: 'Schedule technical discovery sync',\n activityCount: 2,\n },\n {\n id: 'deal-4',\n company: 'QuantumPay',\n companyInitials: 'QP',\n avatarBg: 'bg-chart-1/15 text-chart-1',\n dealName: 'QuantumPay - Core Banking Modernization',\n tier: 'Enterprise',\n value: 160000,\n valueFormatted: '$160,000 ARR',\n stageId: 'demo',\n stageName: 'Technical Demo & Evaluation',\n stageProgress: 50,\n aiWinScore: 74,\n contactName: 'Amina Al-Mansoor',\n contactRole: 'CTO',\n ownerName: 'Sarah Jenkins (AE)',\n ownerInitials: 'SJ',\n closeDate: 'Sep 08',\n daysToClose: '18 days',\n nextStep: 'VPC sandbox load testing & latency trial',\n activityCount: 6,\n },\n {\n id: 'deal-5',\n company: 'Orbit Data Systems',\n companyInitials: 'OD',\n avatarBg: 'bg-chart-2/15 text-chart-2',\n dealName: 'Orbit Data - Analytics Fabric 2.0',\n tier: 'Enterprise',\n value: 135000,\n valueFormatted: '$135,000 ARR',\n stageId: 'demo',\n stageName: 'Technical Demo & Evaluation',\n stageProgress: 50,\n aiWinScore: 68,\n contactName: 'Liam O’Connor',\n contactRole: 'VP Data Systems',\n ownerName: 'Carlos Mendez (AE)',\n ownerInitials: 'CM',\n closeDate: 'Sep 18',\n daysToClose: '28 days',\n nextStep: 'Deliver custom throughput benchmark report',\n activityCount: 5,\n },\n {\n id: 'deal-6',\n company: 'CyberGuard Defense',\n companyInitials: 'CG',\n avatarBg: 'bg-chart-3/15 text-chart-3',\n dealName: 'CyberGuard - SIEM Log Ingestion',\n tier: 'Enterprise',\n value: 185000,\n valueFormatted: '$185,000 ARR',\n stageId: 'demo',\n stageName: 'Technical Demo & Evaluation',\n stageProgress: 50,\n aiWinScore: 65,\n contactName: 'Rachel Vance',\n contactRole: 'CISO',\n ownerName: 'Michael Chang (AE)',\n ownerInitials: 'MC',\n closeDate: 'Sep 30',\n daysToClose: '40 days',\n nextStep: 'InfoSec team architecture deep-dive',\n activityCount: 4,\n },\n {\n id: 'deal-7',\n company: 'Vertex Bio Labs',\n companyInitials: 'VB',\n avatarBg: 'bg-warning/15 text-warning',\n dealName: 'Vertex Bio - C-Suite Platform Rollout',\n tier: 'Enterprise',\n value: 210000,\n valueFormatted: '$210,000 ARR',\n stageId: 'proposal',\n stageName: 'Executive Proposal & Security',\n stageProgress: 75,\n aiWinScore: 88,\n contactName: 'Dr. Julian Sterling',\n contactRole: 'Chief Sci Officer',\n ownerName: 'Emily Thorne (AE)',\n ownerInitials: 'ET',\n closeDate: 'Aug 30',\n daysToClose: '9 days',\n nextStep: 'Final CFO 2-year commitment signoff',\n activityCount: 8,\n },\n {\n id: 'deal-8',\n company: 'Horizon FinServ',\n companyInitials: 'HF',\n avatarBg: 'bg-orange-500/15 text-orange-600 dark:text-orange-400',\n dealName: 'Horizon FinServ - Wealth Management Suite',\n tier: 'Enterprise',\n value: 190000,\n valueFormatted: '$190,000 ARR',\n stageId: 'proposal',\n stageName: 'Executive Proposal & Security',\n stageProgress: 75,\n aiWinScore: 84,\n contactName: 'Nathalie Dupont',\n contactRole: 'Managing Director',\n ownerName: 'Sarah Jenkins (AE)',\n ownerInitials: 'SJ',\n closeDate: 'Sep 04',\n daysToClose: '14 days',\n nextStep: 'Vendor risk committee formal approval',\n activityCount: 7,\n },\n {\n id: 'deal-9',\n company: 'Pulse Healthcare',\n companyInitials: 'PH',\n avatarBg: 'bg-destructive/15 text-destructive',\n dealName: 'Pulse Health - Telehealth Core Engine',\n tier: 'Growth',\n value: 120000,\n valueFormatted: '$120,000 ARR',\n stageId: 'proposal',\n stageName: 'Executive Proposal & Security',\n stageProgress: 75,\n aiWinScore: 82,\n contactName: 'Dr. Alan Moore',\n contactRole: 'Chief Med Officer',\n ownerName: 'Carlos Mendez (AE)',\n ownerInitials: 'CM',\n closeDate: 'Sep 12',\n daysToClose: '22 days',\n nextStep: 'Execute HIPAA BAA & data privacy rider',\n activityCount: 5,\n },\n {\n id: 'deal-10',\n company: 'Nova Fintech',\n companyInitials: 'NF',\n avatarBg: 'bg-success/15 text-success',\n dealName: 'Nova Fintech - Multi-Region VPC Latency',\n tier: 'Enterprise',\n value: 98000,\n valueFormatted: '$98,000 ARR',\n stageId: 'negotiation',\n stageName: 'Contract Negotiation & Closing',\n stageProgress: 100,\n aiWinScore: 96,\n isWinReady: true,\n contactName: 'Samantha Ray',\n contactRole: 'Head of Procurement',\n ownerName: 'Emily Thorne (AE)',\n ownerInitials: 'ET',\n closeDate: 'Aug 24',\n daysToClose: '3 days',\n nextStep: 'DocuSign envelope awaiting CEO countersignature',\n activityCount: 11,\n },\n {\n id: 'deal-11',\n company: 'Apex AI Labs',\n companyInitials: 'AA',\n avatarBg: 'bg-teal-500/15 text-teal-600 dark:text-teal-400',\n dealName: 'Apex AI - Model Orchestration Cluster',\n tier: 'Growth',\n value: 90000,\n valueFormatted: '$90,000 ARR',\n stageId: 'negotiation',\n stageName: 'Contract Negotiation & Closing',\n stageProgress: 100,\n aiWinScore: 92,\n isWinReady: true,\n contactName: 'Vikram Patel',\n contactRole: 'VP Infrastructure',\n ownerName: 'Michael Chang (AE)',\n ownerInitials: 'MC',\n closeDate: 'Aug 26',\n daysToClose: '5 days',\n nextStep: 'Send customer onboarding package & kickoff invite',\n activityCount: 9,\n },\n]\n\nconst defaultMeetingInsights: MeetingInsight[] = [\n {\n id: 'meet-1',\n company: 'Acme Corp',\n companyInitials: 'AC',\n avatarBg: 'bg-info/15 text-info',\n dealName: 'Acme Corp - Enterprise 500 Seats',\n meetingTitle: 'Security & Legal Architecture Review',\n timeAgo: 'Today at 10:30 AM',\n duration: '45 mins',\n platform: 'Zoom Meeting',\n attendees: ['Sarah Jenkins (AE)', 'David Chen (VP Eng)', 'Sarah Lin (Legal Counsel)'],\n buyingIntentScore: 94,\n buyingIntentLabel: '94% High Buying Intent',\n sentimentScore: '+0.88 Positive',\n keyTakeaways:\n 'SOC2 Type II cleared with zero exceptions. InfoSec approved AWS eu-central-1 data residency. Legal accepted master indemnity terms with 1 minor clarification on 99.95% uptime SLA credit.',\n aiRecommendedAction:\n 'Dispatch updated Master Services Agreement (MSA) & DPA with revised 99.95% SLA clause before 4:00 PM today.',\n primaryActionLabel: 'Dispatch MSA & DPA',\n },\n {\n id: 'meet-2',\n company: 'Vertex Bio Labs',\n companyInitials: 'VB',\n avatarBg: 'bg-warning/15 text-warning',\n dealName: 'Vertex Bio - C-Suite Platform Rollout',\n meetingTitle: 'CFO Business Case & ROI Alignment',\n timeAgo: 'Yesterday at 3:15 PM',\n duration: '30 mins',\n platform: 'Google Meet',\n attendees: ['Emily Thorne (AE)', 'Dr. Julian Sterling (CSO)', 'Mark Hansen (CFO)'],\n buyingIntentScore: 88,\n buyingIntentLabel: '88% Strong Buying Intent',\n sentimentScore: '+0.82 Positive',\n keyTakeaways:\n 'CFO Mark Hansen confirmed budget authorization for 2-year enterprise commitment ($420k TCV). Requested expedited 14-day onboarding plan for 450 laboratory technicians across Cambridge and Basel campuses.',\n aiRecommendedAction:\n 'Deliver 14-day technical migration blueprint & assign dedicated Customer Success Architect by 12:00 PM tomorrow.',\n primaryActionLabel: 'Send Onboarding Plan',\n },\n {\n id: 'meet-3',\n company: 'QuantumPay',\n companyInitials: 'QP',\n avatarBg: 'bg-chart-1/15 text-chart-1',\n dealName: 'QuantumPay - Core Banking Modernization',\n meetingTitle: 'Technical Sandbox & Latency Benchmark Debrief',\n timeAgo: 'Aug 19 at 11:00 AM',\n duration: '60 mins',\n platform: 'In-Person Executive Sync',\n attendees: ['Sarah Jenkins (AE)', 'Amina Al-Mansoor (CTO)', '4 Principal Engineers'],\n buyingIntentScore: 78,\n buyingIntentLabel: '78% Moderate-High Intent',\n sentimentScore: '+0.74 Validated',\n keyTakeaways:\n 'Completed live latency benchmark in us-east-1 and eu-central-1 sandbox with sustained 12,500 req/sec at 11.8ms p99 latency. CTO asked for tiered discount model if expanding to APAC in Q1 2027.',\n aiRecommendedAction:\n 'Schedule executive sponsor call with VP Engineering and send multi-region Tier-1 SLA pricing options.',\n primaryActionLabel: 'Generate Tier-1 Quote',\n },\n]\n\n@Component({\n changeDetection: ChangeDetectionStrategy.Eager,\n selector: 'ui-ai-crm-pipeline-dashboard, [ui-ai-crm-pipeline-dashboard]',\n standalone: true,\n // React renders the root
itself: the host stays out of layout and `class` goes to the root.\n host: { '[attr.class]': '\"contents\"' },\n imports: [\n LucideAngularModule,\n UiAvatarComponent,\n UiAvatarFallbackComponent,\n UiBadgeComponent,\n UiButtonComponent,\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n UiProgressComponent,\n UiTableBodyComponent,\n UiTableCellComponent,\n UiTableComponent,\n UiTableHeadComponent,\n UiTableHeaderComponent,\n UiTableRowComponent,\n ],\n template: `\n
\n \n
\n
\n
\n \n \n Enterprise Mid-Market Squad · 6 Account Executives\n \n \n \n Live AI Revenue Intelligence\n \n
\n

\n Sales Pipeline & Revenue Velocity\n

\n

\n $1,428,500.00 Pipeline · 24 Deals\n |\n Q3 Closed ARR Target: $1.20M (86% on-pace probability)\n

\n
\n\n
\n
\n \n \n
\n\n \n \n
\n
\n\n \n
\n
\n
\n

\n Total Pipeline Value\n

\n
\n \n
\n
\n
\n
$1.43M
\n
\n Across 24 qualified deals\n \n \n +17.6% MoM\n \n
\n
\n Weighted Forecast: $976,500.00\n
\n
\n
\n\n
\n
\n

\n Win Probability Index\n

\n
\n \n
\n
\n
\n
68.4%
\n
\n AI Win Probability\n \n \n +5.8% shift\n \n
\n
\n High Confidence: 14 deals (>70% score)\n
\n
\n
\n\n
\n
\n

\n Avg Deal Size\n

\n
\n \n
\n
\n
\n
$59,500.00
\n
\n ARR / deal average\n \n \n +$6.2k vs FY25\n \n
\n
\n Median Deal Value: $52,000.00 ARR\n
\n
\n
\n\n
\n
\n

\n Deal Velocity\n

\n
\n \n
\n
\n
\n
22 Days
\n
\n Avg sales cycle · -4d vs Q2\n \n \n 15.4% faster\n \n
\n
\n Fastest Velocity: 11d (Nova Fintech)\n
\n
\n
\n
\n\n \n \n
\n \n \n
\n\n
\n \n @for (stg of stages; track stg.id) {\n \n }\n
\n
\n\n \n @if (viewMode() === 'kanban') {\n
\n @for (stg of stages; track stg.id; let idx = $index) {\n
\n
\n
\n
\n \n

{{ stg.name }}

\n
\n \n {{ stg.dealCountText }}\n \n
\n\n
\n {{ stg.totalValueText }}\n \n \n {{ stg.avgAiScoreText }}\n \n
\n\n
\n
\n Stage {{ idx + 1 }} of 4\n {{ stg.progressValue }}%\n
\n \n
\n
\n\n
\n @for (deal of getStageDeals(stg.id); track deal.id) {\n \n
\n
\n \n \n {{ deal.companyInitials }}\n \n \n
\n

{{ deal.company }}

\n

{{ deal.tier }}

\n
\n
\n\n
\n @if (deal.isWinReady) {\n \n \n Win Ready\n \n }\n \n \n {{ deal.aiWinScore }}% AI Score\n \n
\n
\n\n
\n

{{ deal.dealName }}

\n
\n {{ deal.valueFormatted }}\n \n Close: {{ deal.closeDate }} ({{ deal.daysToClose }})\n \n
\n
\n\n
\n
\n Momentum\n {{ deal.stageProgress }}%\n
\n \n
\n\n \n
\n \n {{ deal.contactName }} ({{ deal.contactRole }})\n
\n
\n \n {{ deal.ownerInitials }}\n \n
\n
\n\n
\n
\n \n \n AI Next Action: {{ deal.nextStep }}\n \n
\n
\n
\n }\n\n @if (getStageDeals(stg.id).length === 0) {\n \n

No matching deals in this stage

\n
\n }\n
\n \n }\n \n } @else {\n
\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n @for (deal of filteredDeals(); track deal.id) {\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n \n }\n \n
Account & DealStageARR ValueAI Win ScoreKey ContactAE OwnerClose DateAI Next Action
\n
\n \n \n {{ deal.companyInitials }}\n \n \n
\n
\n {{ deal.company }}\n {{ deal.tier }}\n @if (deal.isWinReady) {\n \n Win Ready\n \n }\n
\n

{{ deal.dealName }}

\n
\n
\n 		\n
\n {{ deal.stageName }}\n \n
\n 		\n {{ deal.valueFormatted }}\n \n \n \n {{ deal.aiWinScore }}%\n \n \n
\n

{{ deal.contactName }}

\n

{{ deal.contactRole }}

\n
\n 		\n {{ deal.ownerName }}\n \n
\n

{{ deal.closeDate }}

\n

{{ deal.daysToClose }}

\n
\n 		\n
\n \n {{ deal.nextStep }}\n
\n
\n
\n\n
\n \n Showing {{ filteredDeals().length }} of {{ totalDeals }} deals\n \n Pipeline Velocity Index: 68.4% AI Score Average \n
\n
\n }\n\n \n @if (showInsights) {\n
\n
\n \n
\n
\n
\n \n
\n

\n Recent Deal Activities & AI Meeting Insights\n

\n
\n

\n Automated multi-speaker transcript intelligence, buyer sentiment scoring, and next-best actions\n

\n
\n \n 3 Executive Meetings Processed Today\n \n
\n\n
\n @for (insight of meetingInsights; track insight.id) {\n \n
\n
\n
\n \n \n {{ insight.companyInitials }}\n \n \n
\n

{{ insight.company }}

\n

{{ insight.platform }} · {{ insight.duration }}

\n
\n
\n\n \n \n {{ insight.buyingIntentLabel }}\n \n
\n\n
\n
{{ insight.meetingTitle }}
\n

{{ insight.timeAgo }}

\n
\n\n
\n \n Stakeholders & Reps\n \n
\n @for (att of insight.attendees; track att) {\n \n {{ att }}\n \n }\n
\n
\n\n
\n
\n \n \n AI Detected Sentiment\n \n {{ insight.sentimentScore }}\n
\n

{{ insight.keyTakeaways }}

\n
\n\n
\n
\n \n AI Next Recommendation\n
\n

{{ insight.aiRecommendedAction }}

\n
\n
\n\n
\n \n \n
\n
\n }\n \n \n
\n }\n \n `,\n})\nexport class UiAiCrmPipelineDashboardComponent {\n protected readonly Bot = Bot\n protected readonly BrainCircuit = BrainCircuit\n protected readonly CheckCircle2 = CheckCircle2\n protected readonly DollarSign = DollarSign\n protected readonly Download = Download\n protected readonly FileCheck = FileCheck\n protected readonly Kanban = Kanban\n protected readonly Plus = Plus\n protected readonly Search = Search\n protected readonly Sparkles = Sparkles\n protected readonly TableIcon = TableIcon\n protected readonly Timer = Timer\n protected readonly TrendingUp = TrendingUp\n protected readonly BarChart3 = BarChart3\n protected readonly User = User\n protected readonly Video = Video\n protected readonly Wand2 = Wand2\n protected readonly Zap = Zap\n\n protected readonly stages = defaultStages\n protected readonly meetingInsights = defaultMeetingInsights\n protected readonly totalDeals = defaultDeals.length\n protected readonly tableRowClass =\n 'hover:bg-muted/40 focus-visible:ring-ring cursor-pointer transition-colors focus-visible:ring-2 focus-visible:outline-none'\n\n @Input() set initialViewMode(v: PipelineViewMode | undefined) {\n this.viewMode.set(v ?? 'kanban')\n }\n @Input() set initialStageFilter(v: PipelineStageFilter | undefined) {\n this.stageFilter.set(v ?? 'all')\n }\n @Input() set initialSearch(v: string | undefined) {\n this.searchQuery.set(v ?? '')\n }\n @Input() showInsights = true\n @Input('class') className?: string\n\n readonly viewMode = signal('kanban')\n readonly stageFilter = signal('all')\n readonly searchQuery = signal('')\n readonly selectedDealId = signal(null)\n\n readonly filteredDeals = computed(() => {\n const stage = this.stageFilter()\n const query = this.searchQuery().trim().toLowerCase()\n return defaultDeals.filter((deal) => {\n const matchesStage = stage === 'all' || deal.stageId === stage\n if (!query) return matchesStage\n const matchesSearch =\n deal.company.toLowerCase().includes(query) ||\n deal.dealName.toLowerCase().includes(query) ||\n deal.contactName.toLowerCase().includes(query) ||\n deal.ownerName.toLowerCase().includes(query) ||\n deal.nextStep.toLowerCase().includes(query)\n return matchesStage && matchesSearch\n })\n })\n\n get rootClass(): string {\n return cn('flex w-full flex-col gap-6', this.className)\n }\n\n getStageDeals(stageId: PipelineStageId): DealItem[] {\n return this.filteredDeals().filter((deal) => deal.stageId === stageId)\n }\n\n stageShortName(stg: StageSummary): string {\n return stg.name.split(' ')[0] ?? stg.name\n }\n\n stageShortCount(stg: StageSummary): string {\n return stg.dealCountText.split(' ')[0] ?? stg.dealCountText\n }\n\n stageDotClass(stg: StageSummary): string {\n return cn('size-2.5 rounded-full', stg.accentColor)\n }\n\n stageBadgeClass(stg: StageSummary): string {\n return cn('text-xs font-semibold tabular-nums', stg.badgeVariant)\n }\n\n viewToggleClass(mode: PipelineViewMode): string {\n return cn(\n 'focus-visible:ring-ring inline-flex items-center gap-1.5 rounded-md px-2.5 py-1 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none',\n this.viewMode() === mode\n ? 'bg-background text-foreground shadow-xs'\n : 'text-muted-foreground hover:text-foreground',\n )\n }\n\n stageFilterClass(filter: PipelineStageFilter): string {\n return cn(\n 'focus-visible:ring-ring rounded-md px-2.5 py-1.5 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none',\n this.stageFilter() === filter\n ? 'bg-primary text-primary-foreground'\n : 'bg-muted/60 text-muted-foreground hover:bg-accent hover:text-foreground',\n )\n }\n\n dealCardClass(deal: DealItem): string {\n return cn(\n 'group border-border bg-card hover:border-primary/50 focus-visible:ring-ring relative flex cursor-pointer flex-col gap-3 rounded-lg border p-3.5 shadow-xs transition-colors duration-150 hover:shadow-sm focus-visible:ring-2 focus-visible:outline-none',\n this.selectedDealId() === deal.id && 'ring-primary border-primary ring-2',\n )\n }\n\n avatarFallbackClass(deal: DealItem): string {\n return cn('rounded-lg text-xs font-bold', deal.avatarBg)\n }\n\n insightAvatarClass(insight: MeetingInsight): string {\n return cn('rounded-lg text-xs font-bold', insight.avatarBg)\n }\n\n aiScoreBadgeClass(score: number): string {\n return cn('gap-1 text-xs font-semibold tabular-nums', this.aiScoreClass(score))\n }\n\n aiScoreClass(score: number): string {\n if (score >= 85) return 'bg-success/10 text-success border-success/20'\n if (score >= 70) return 'bg-info/10 text-info border-info/20'\n if (score >= 50) return 'bg-warning/10 text-warning border-warning/20'\n return 'bg-slate-500/10 text-slate-600 text-muted-foreground border-slate-500/20'\n }\n\n handleSelectDeal(id: string): void {\n this.selectedDealId.update((prev) => (prev === id ? null : id))\n }\n\n onDealKeydown(event: KeyboardEvent, id: string): void {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n this.handleSelectDeal(id)\n }\n }\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/ai-crm-pipeline-dashboard/ai-crm-pipeline-dashboard.component.ts" }, { "path": "packages/registry-angular/blocks/ai-crm-pipeline-dashboard/index.ts", "content": "export {\n UiAiCrmPipelineDashboardComponent,\n type DealItem,\n type MeetingInsight,\n type PipelineStageFilter,\n type PipelineStageId,\n type PipelineViewMode,\n type StageSummary,\n} from './ai-crm-pipeline-dashboard.component'\n", "type": "registry:block", "target": "~/src/app/components/blocks/ai-crm-pipeline-dashboard/index.ts" } ], "dependencies": [ "lucide-angular" ], "devDependencies": [], "registryDependencies": [ "https://uipkge.dev/r/angular/avatar.json", "https://uipkge.dev/r/angular/badge.json", "https://uipkge.dev/r/angular/button.json", "https://uipkge.dev/r/angular/card.json", "https://uipkge.dev/r/angular/progress.json", "https://uipkge.dev/r/angular/table.json" ], "description": "High-craft AI CRM deal pipeline, deal velocity, AI win probability scoring, and sales activity tracker inspired by Wise / revenue intelligence platforms. Features revenue velocity metrics, 4-stage pipeline Kanban board with predictive win scores, deal progress bars, and AI meeting summaries with buying intent detection.", "categories": [ "marketing", "dashboard", "data" ] }