{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "footer-with-suite",
  "type": "registry:block",
  "title": "Footer with Suite",
  "description": "Modern footer with oversized split sections.",
  "author": "Ahdeetai <https://aditya.is-cool.dev>",
  "registryDependencies": [],
  "dependencies": ["clsx", "tailwind-merge"],
  "files": [
    {
      "type": "registry:component",
      "path": "registry/blocks/footers/footer-with-suite.tsx",
      "content": "'use client';\n\nimport { cn } from '@/lib/utils';\n\ninterface NavLink {\n  text: string;\n  url: string;\n}\n\ninterface FooterWithSuiteProps {\n  brandName?: string;\n  tagline?: string;\n  navLinks?: NavLink[];\n  socialLinks?: NavLink[];\n  description?: string;\n  ctaText?: string;\n  ctaUrl?: string;\n  email?: string;\n  copyright?: string;\n  className?: string;\n}\n\nconst defaultNavLinks: NavLink[] = [\n  { text: 'Home', url: '#' },\n  { text: 'Work', url: '#' },\n  { text: 'Services', url: '#' },\n  { text: 'About', url: '#' },\n  { text: 'Pricing', url: '#' },\n  { text: 'Process', url: '#' },\n  { text: 'Blog', url: '#' },\n];\n\nconst defaultSocialLinks: NavLink[] = [\n  { text: 'Twitter', url: '#' },\n  { text: 'GitHub', url: '#' },\n  { text: 'LinkedIn', url: '#' },\n  { text: 'Legal', url: '#' },\n];\n\nexport default function FooterWithSuite({\n  brandName = 'Practicality',\n  tagline = 'We ship fast, we ship right.',\n  navLinks = defaultNavLinks,\n  socialLinks = defaultSocialLinks,\n  description = 'An indie product studio building tools developers actually want to use.',\n  ctaText = 'Start a project',\n  ctaUrl = '#',\n  email = 'hello@practicality.dev',\n  copyright = '© 2026 Practicality, Inc.',\n  className,\n}: FooterWithSuiteProps) {\n  return (\n    <footer\n      className={cn(\n        'w-full relative overflow-hidden bg-white dark:bg-neutral-950 select-none',\n        className,\n      )}\n    >\n      <div className='grid grid-cols-2 gap-8 px-8 pt-12 pb-4 md:px-12'>\n        <div className='flex flex-col gap-0'>\n          {navLinks.map((link, i) => (\n            <a\n              key={i}\n              href={link.url}\n              className='py-0.75 text-[11px] tracking-[0.14em] uppercase text-neutral-900 dark:text-neutral-100 hover:text-neutral-400 dark:hover:text-neutral-500 transition-colors duration-200'\n            >\n              {link.text}\n            </a>\n          ))}\n\n          <div className='h-5' />\n\n          {socialLinks.map((link, i) => (\n            <a\n              key={i}\n              href={link.url}\n              className='py-0.75 text-[11px] tracking-[0.14em] uppercase text-neutral-900 dark:text-neutral-100 hover:text-neutral-400 dark:hover:text-neutral-500 transition-colors duration-200'\n            >\n              {link.text}\n            </a>\n          ))}\n        </div>\n\n        <div className='flex flex-col gap-0'>\n          <p className='text-[11px] tracking-[0.12em] uppercase text-neutral-900 dark:text-neutral-100 leading-relaxed'>\n            {description}\n          </p>\n\n          <div className='h-5' />\n\n          <p className='text-[11px] tracking-[0.12em] uppercase text-neutral-400 dark:text-neutral-500 leading-relaxed'>\n            Got a product idea? A hard problem? Just want to talk?\n          </p>\n\n          <div className='h-4' />\n\n          <a\n            href={ctaUrl}\n            className='text-[11px] tracking-[0.14em] uppercase text-neutral-900 dark:text-neutral-100 hover:text-neutral-400 dark:hover:text-neutral-500 transition-colors duration-200'\n          >\n            {ctaText}\n          </a>\n\n          <div className='h-4' />\n\n          <a\n            href={`mailto:${email}`}\n            className='text-[11px] tracking-[0.14em] uppercase text-neutral-900 dark:text-neutral-100 hover:text-neutral-400 dark:hover:text-neutral-500 transition-colors duration-200 break-all'\n          >\n            {email}\n          </a>\n\n          <div className='h-4' />\n\n          <p className='text-[11px] tracking-[0.12em] uppercase text-neutral-400 dark:text-neutral-500'>\n            {copyright}\n          </p>\n        </div>\n      </div>\n\n      <p\n        className='inset-x-0 text-center font-bold text-neutral-900 dark:text-neutral-100'\n        style={{ fontSize: 'clamp(3rem, 15vw, 13rem)' }}\n      >\n        {brandName}\n      </p>\n\n      <div className='flex items-center justify-between px-8 md:px-12 py-3 border-t border-neutral-200 dark:border-neutral-800 mt-1'>\n        <p className='text-[10px] tracking-[0.14em] uppercase text-neutral-400 dark:text-neutral-500'>\n          {tagline}\n        </p>\n      </div>\n    </footer>\n  );\n}\n\nexport { FooterWithSuite };"
    },
    {
      "type": "registry:lib",
      "path": "lib/utils.ts",
      "content": "import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}"
    }
  ]
}
