import * as React from "react"; import { IntegrationDetailNarrativeProofPillarsOne } from "@/registry/integration-detail-narrative-proof-pillars-one/integration-detail-narrative-proof-pillars-one"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; type ComponentProps = React.ComponentPropsWithoutRef< typeof IntegrationDetailNarrativeProofPillarsOne >; type IntegrationDetailNarrativeProofPillarsOneProof = NonNullable< ComponentProps["proofPillars"] >[number]; type IntegrationDetailNarrativeProofPillarsOneFeature = NonNullable< ComponentProps["featureColumns"] >[number]; type IntegrationDetailNarrativeProofPillarsOneSection = NonNullable< ComponentProps["sections"] >[number]; export function IntegrationDetailNarrativeProofPillarsOneDemo() { const proofPillars: IntegrationDetailNarrativeProofPillarsOneProof[] = [ { id: "uptime", label: "Verified uptime", targetValue: 99.98, suffix: "%", description: "Backed by joint SRE playbooks and 30-minute incident SLAs.", }, { id: "customers", label: "Shared customers", targetValue: 420, suffix: "+", description: "Teams across RevOps, finance, and product using the integration.", }, { id: "certifications", label: "Certifications", value: "SOC2 • ISO27001", description: "Annual audits covering infrastructure, policies, and data flows.", }, { id: "roi", label: "Avg. hours saved", targetValue: 18.5, suffix: " hrs", description: "Automated reconciliation and workflow syncs across systems.", }, ]; const featureColumns: IntegrationDetailNarrativeProofPillarsOneFeature[] = [ { id: "automation", title: "Automation triggers", description: "Kick off downstream workflows when new customer intents are captured, complete with conditional logic and approvals.", badge: "Automation", }, { id: "analytics", title: "Unified analytics", description: "Blend product telemetry with CRM milestones to surface revenue moments and renewal risk in executive dashboards.", badge: "Analytics", }, { id: "workflow", title: "Workflow orchestration", description: "Sync statuses, tasks, and notes across teams so sales, CX, and product collaborate with zero data drift.", badge: "Collaboration", }, ]; const sections: IntegrationDetailNarrativeProofPillarsOneSection[] = [ { id: "overview", label: "Overview", eyebrow: "Why it matters", title: "Ship integrations customers trust from day one", description: "The Narrative integration unlocks real-time sync between Nextbase accounts and Horizon CRM, eliminating manual spreadsheet triage.", highlights: [ { id: "teams", label: "Multi-team activation", description: "Tailored playbooks for GTM, operations, and success teams with region-aware defaults.", }, { id: "security", label: "Enterprise-grade compliance", description: "Shared SOC 2 Type II controls, regional data residency options, and field-level encryption.", }, { id: "support", label: "Joint support desk", description: "Follow-the-sun specialists respond within 2 hours for priority integrations.", }, ], content: (

Deep linking:{" "} Generate secure deep links so sales can jump directly into Horizon opportunity records.
Lifecycle automation: {" "} Two-way sync on onboarding milestones keeps customer journeys aligned.
Event normalization: {" "} Map custom objects, owners, and intents without developer tickets.
Executive insights: {" "} Dashboard overlays highlight revenue influenced, pipeline velocity, and top performing campaigns.

), }, { id: "features", label: "Features", eyebrow: "Feature band", title: "Feature pillars built for RevOps momentum", description: "Everything from playbook automation to analytics overlays so teams can launch quickly and iterate without custom engineering.", highlights: [ { id: "audience-sync", label: "Audience sync", description: "Segment, enrich, and sync audiences in minutes with automated backfills and clear status indicators.", }, { id: "trust", label: "Trust controls", description: "Granular field-level permissions plus native audit logs for every sync run.", }, { id: "feedback", label: "Feedback loop", description: "Collect in-app feedback and ship co-owned changelog updates directly to the roadmap.", }, ], resources: [ { id: "docs", label: "Implementation playbook", href: "https://usenextbase.com/docs/integrations/narrative", description: "End-to-end guide with code samples and launch checklist.", }, { id: "webinar", label: "Scaling revenue operations webinar", href: "https://usenextbase.com/resources/narrative-webinar", description: "Hear how teams reached 187% adoption in the first quarter.", }, ], }, { id: "pricing", label: "Pricing", eyebrow: "Transparent pricing", title: "Simple packaging aligned to activation milestones", description: "Built to match how RevOps teams procure. Upgrade to enterprise as soon as compliance reviews complete—no new implementation.", content: (

Included

Install, sandbox sync, and dashboard widgets for pilot users.

Growth teams

$249

Unlimited automations plus live joint office hours each week.

Enterprise

Custom

Includes dedicated success pod, data residency controls, and shared QBRs.

), }, { id: "security", label: "Security", eyebrow: "Security & compliance", title: "Security controls that accelerate procurement", description: "Joint security practices meet ISO and SOC 2 requirements with evidence you can share across teams.", highlights: [ { id: "encryption", label: "End-to-end encryption", description: "TLS 1.3 in transit plus AES-256 at rest with scoped access policies.", }, { id: "rls", label: "Row-level security", description: "Granular data boundaries keep only relevant records synced per workspace.", }, { id: "monitoring", label: "Continuous monitoring", description: "Real-time monitoring with automated escalation to both partnership teams.", }, ], resources: [ { id: "security-brief", label: "Shared security brief", href: "https://usenextbase.com/security/narrative-brief", description: "Deep dive into encryption, retention, and incident workflows.", }, ], }, ]; return ( ); } const Example = IntegrationDetailNarrativeProofPillarsOneDemo export default IntegrationDetailNarrativeProofPillarsOneDemo;