{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"logo-section-1","title":"Logo Section 1","description":"Client logos section 1 with bento-style grid, brand logo strip, centered content, background contrast section, video aspect media.","registryDependencies":["@initium/placeholder-logo-buzzsnap","@initium/placeholder-logo-dashstar","@initium/placeholder-logo-editly","@initium/placeholder-logo-geoaura","@initium/placeholder-logo-nanodea","@initium/placeholder-logo-orionbo"],"files":[{"path":"components/pro-blocks/landing-page/logo-sections/logo-section-1.tsx","content":"import { PlaceholderLogoBuzzsnap } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-buzzsnap\"\nimport { PlaceholderLogoDashstar } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-dashstar\"\nimport { PlaceholderLogoEditly } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-editly\"\nimport { PlaceholderLogoGeoaura } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-geoaura\"\nimport { PlaceholderLogoNanodea } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-nanodea\"\nimport { PlaceholderLogoOrionbo } from \"@/components/pro-blocks/landing-page/placeholder-logos/placeholder-logo-orionbo\"\nimport type { ComponentType } from \"react\"\n\ntype LogoEntry = {\n  id: number\n  component: ComponentType<{ className?: string }>\n  alt: string\n}\n\ntype Props = {\n  taglineText?: string\n  logos?: LogoEntry[]\n}\n\nconst defaultProps = {\n  taglineText: \"Logo section 1\",\n  logos: [\n    {\n      id: 1,\n      component: PlaceholderLogoBuzzsnap,\n      alt: \"Buzzsnap logo\",\n    },\n    {\n      id: 2,\n      component: PlaceholderLogoDashstar,\n      alt: \"Dashstar logo\",\n    },\n    {\n      id: 3,\n      component: PlaceholderLogoEditly,\n      alt: \"Editly logo\",\n    },\n    {\n      id: 4,\n      component: PlaceholderLogoGeoaura,\n      alt: \"Geoaura logo\",\n    },\n    {\n      id: 5,\n      component: PlaceholderLogoNanodea,\n      alt: \"Nanodea logo\",\n    },\n  ],\n}\n\nexport function LogoSection1({\n  taglineText = defaultProps.taglineText,\n  logos = defaultProps.logos,\n}: Props) {\n  const displayLogos = [...logos]\n\n  return (\n    <section className=\"bg-background\" aria-labelledby=\"logo-section-1-heading\">\n      <div className=\"wrapper\">\n        <div className=\"flex flex-col items-center gap-8\">\n          <div className=\"flex max-w-xl flex-col items-center text-center\">\n            <div className=\"tagline mb-0\">{taglineText}</div>\n          </div>\n\n          <div className=\"grid w-full grid-cols-5 gap-2\">\n            {displayLogos.map((logo, index) => {\n              const LogoComponent = logo.component\n\n              return (\n                <div\n                  key={`${logo.id}-${index}`}\n                  className=\"col-span-3 flex aspect-[2/1] w-full items-center justify-center rounded-xl bg-muted/60 lg:col-span-1\"\n                  aria-label={logo.alt}\n                >\n                  <LogoComponent className=\"h-5.5 w-auto text-foreground md:h-5.5\" />\n                </div>\n              )\n            })}\n          </div>\n        </div>\n      </div>\n    </section>\n  )\n}\n","type":"registry:component"}],"meta":{"tags":["logos","social proof","trusted by","brand strip","clients"]},"categories":["logo-sections"],"type":"registry:block"}