{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "integrations-03",
  "title": "Integrations 03",
  "description": "A simple integrations block",
  "files": [
    {
      "path": "src/registry/blocks/radix/integrations-03/components/integrations.tsx",
      "content": "import { ArrowUpRight } from \"lucide-react\";\nimport { Badge } from \"@/registry/bases/radix/ui/badge\";\nimport { Button } from \"@/registry/bases/radix/ui/button\";\n\nexport default function Integrations() {\n  return (\n    <div className=\"mx-auto flex max-w-7xl flex-col px-6 py-12 sm:py-14\">\n      <h2 className=\"text-center font-medium text-4xl tracking-tight\">\n        Connect your tools\n      </h2>\n      <p className=\"mt-3 text-pretty text-center text-muted-foreground text-xl -tracking-[0.01em] sm:text-2xl\">\n        Connect your favorite tools and services\n      </p>\n      <div className=\"mt-12 grid grid-cols-1 gap-5 sm:mt-16 sm:grid-cols-2 lg:grid-cols-3\">\n        {integrations.map((integration) => (\n          <div\n            className=\"flex items-center gap-4 rounded-lg border border-border/85 bg-card pe-4 shadow-xs/2\"\n            key={integration.title}\n          >\n            <div className=\"border-e border-dashed p-4\">\n              <img\n                alt={integration.title}\n                className=\"size-8 rounded\"\n                src={`https://www.google.com/s2/favicons?domain=${encodeURIComponent(integration.url)}&sz=64`}\n              />\n            </div>\n            <h3 className=\"font-medium text-lg\">{integration.title}</h3>\n\n            {integration.status === \"connected\" ? (\n              <Badge className=\"ms-auto h-7 min-w-26 rounded-lg bg-emerald-600/10 px-3 text-emerald-600 text-sm\">\n                Connected\n              </Badge>\n            ) : (\n              <Button className=\"ms-auto h-7.5\" size=\"sm\" variant=\"outline\">\n                Connect <ArrowUpRight />\n              </Button>\n            )}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n}\n\nconst integrations = [\n  {\n    title: \"PostHog\",\n    description: \"PostHog is an open-source product analytics tool.\",\n    url: \"https://posthog.com/\",\n    status: \"connected\",\n  },\n  {\n    title: \"Mailchimp\",\n    description:\n      \"Marketing platform for creating, sending, and automating emails.\",\n    url: \"https://mailchimp.com\",\n    status: \"pending\",\n  },\n  {\n    title: \"Notion\",\n    description:\n      \"Note-taking and project management tool for organizing ideas, tasks, and documents.\",\n    url: \"https://notion.com\",\n    status: \"pending\",\n  },\n  {\n    title: \"Stripe\",\n    description: \"Payment processing for online businesses and platforms.\",\n    url: \"https://stripe.com\",\n    status: \"pending\",\n  },\n  {\n    title: \"Resend\",\n    description: \"Email platform for developers to send, track, and manage.\",\n    url: \"https://resend.com\",\n    status: \"pending\",\n  },\n  {\n    title: \"Zapier\",\n    description:\n      \"Automation tool for connecting and syncing data between different apps and services.\",\n    url: \"https://zapier.com\",\n    status: \"pending\",\n  },\n  {\n    title: \"Cal.com\",\n    description:\n      \"Calendar booking tool for scheduling meetings and appointments.\",\n    url: \"https://cal.com/\",\n    status: \"pending\",\n  },\n  {\n    title: \"Linear\",\n    description: \"Project management tool for tracking tasks and projects.\",\n    url: \"https://linear.app/\",\n    status: \"connected\",\n  },\n  {\n    title: \"Plausible\",\n    description:\n      \"Analytics tool for tracking website traffic and user behavior.\",\n    url: \"https://plausible.io/\",\n    status: \"pending\",\n  },\n  {\n    title: \"Webflow\",\n    description: \"Website builder for creating and managing websites.\",\n    url: \"https://webflow.com/\",\n    status: \"pending\",\n  },\n  {\n    title: \"Sanity\",\n    description:\n      \"Content management system for creating and managing websites.\",\n    url: \"https://sanity.io/\",\n    status: \"pending\",\n  },\n  {\n    title: \"Clerk\",\n    description: \"Authentication for your website and application.\",\n    url: \"https://clerk.com/\",\n    status: \"pending\",\n  },\n];\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}