{"$schema":"https://ui.shadcn.com/schema/registry-item.json","type":"registry:block","registryDependencies":["button"],"name":"integrations-1","description":"Grid layout with integration cards and view all link.","categories":["integrations"],"files":[{"path":"registry/blocks/integrations/1/integrations.tsx","type":"registry:component","content":"import { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\n\ntype Integration = {\n\tsrc: string;\n\tname: string;\n\tdescription: string;\n\tisInvertable?: boolean;\n};\n\nconst data: Integration[] = [\n\t{\n\t\tsrc: \"https://storage.efferd.com/logo/vercel.svg\",\n\t\tname: \"Vercel\",\n\t\tdescription: \"Amet praesentium deserunt ex commodi tempore fuga....\",\n\t\tisInvertable: true,\n\t},\n\t{\n\t\tsrc: \"https://storage.efferd.com/logo/openai.svg\",\n\t\tname: \"OpenAI\",\n\t\tdescription: \"Amet praesentium deserunt ex commodi tempore fuga....\",\n\t\tisInvertable: true,\n\t},\n\t{\n\t\tsrc: \"https://storage.efferd.com/logo/supabase.svg\",\n\t\tname: \"Supabase\",\n\t\tdescription: \"Amet praesentium deserunt ex commodi tempore fuga....\",\n\t},\n\t{\n\t\tsrc: \"https://storage.efferd.com/logo/notion.svg\",\n\t\tname: \"Notion\",\n\t\tdescription: \"Amet praesentium deserunt ex commodi tempore fuga....\",\n\t},\n];\n\nexport function Integrations() {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\t\"mx-auto grid max-w-5xl gap-1 overflow-hidden rounded-md bg-secondary p-1 sm:grid-cols-2 lg:grid-cols-4 dark:bg-secondary/50\"\n\t\t\t)}\n\t\t>\n\t\t\t{data.map((item) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"group relative flex flex-col justify-between gap-2 rounded-md bg-background p-6 shadow-sm\"\n\t\t\t\t\t)}\n\t\t\t\t\tkey={item.name}\n\t\t\t\t>\n\t\t\t\t\t<img\n\t\t\t\t\t\talt={item.name}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"pointer-events-none size-8 shrink-0 select-none object-contain\",\n\t\t\t\t\t\t\titem.isInvertable && \"dark:invert\"\n\t\t\t\t\t\t)}\n\t\t\t\t\t\theight={32}\n\t\t\t\t\t\tsrc={item.src}\n\t\t\t\t\t\twidth={32}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"space-y-1\">\n\t\t\t\t\t\t<h3 className=\"font-semibold\">{item.name}</h3>\n\t\t\t\t\t\t<p className=\"text-muted-foreground text-xs md:text-sm\">\n\t\t\t\t\t\t\t{item.description}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t\t<div className=\"relative flex items-center justify-center p-1 sm:col-span-2 lg:col-span-4\">\n\t\t\t\t<Button asChild className=\"group text-xs\" size=\"sm\" variant=\"link\">\n\t\t\t\t\t<a href=\"#\">\n\t\t\t\t\t\tView all integrations\n\t\t\t\t\t\t<IconPlaceholder\n\t\t\t\t\t\t\tdata-icon=\"inline-end\"\n\t\t\t\t\t\t\thugeicons=\"ArrowUpRight01Icon\"\n\t\t\t\t\t\t\tlucide=\"ArrowUpRightIcon\"\n\t\t\t\t\t\t\tphosphor=\"ArrowUpRightIcon\"\n\t\t\t\t\t\t\tremixicon=\"RiArrowRightUpLine\"\n\t\t\t\t\t\t\ttabler=\"IconArrowUpRight\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</a>\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"}]}