@hanzo/ui 4.8.5 → 5.0.0

package/blocks/marketing/cta-section.tsx

@@ -1,207 +0,0 @@
-'use client'
-
-import { cn } from '@hanzo/ui/util'
-import { Button } from '@hanzo/ui/primitives'
-
-interface CTASectionProps extends React.ComponentPropsWithoutRef<'section'> {
-  title: string
-  description?: string
-  primaryAction?: {
-    label: string
-    onClick: () => void
-  }
-  secondaryAction?: {
-    label: string
-    onClick: () => void
-  }
-  variant?: 'default' | 'centered' | 'card' | 'gradient'
-}
-
-export function CTASection({
-  className,
-  title,
-  description,
-  primaryAction,
-  secondaryAction,
-  variant = 'default',
-  ...props
-}: CTASectionProps) {
-  if (variant === 'card') {
-    return (
-      <section className={cn('py-24 sm:py-32', className)} {...props}>
-        <div className="container">
-          <div className="rounded-2xl bg-muted px-6 py-16 sm:px-12 sm:py-20">
-            <div className="mx-auto max-w-3xl text-center">
-              <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-                {title}
-              </h2>
-              {description && (
-                <p className="mt-4 text-lg text-muted-foreground">
-                  {description}
-                </p>
-              )}
-              {(primaryAction || secondaryAction) && (
-                <div className="mt-10 flex flex-col gap-4 sm:flex-row sm:justify-center">
-                  {primaryAction && (
-                    <Button
-                      size="lg"
-                      onClick={primaryAction.onClick}
-                      className="w-full sm:w-auto"
-                    >
-                      {primaryAction.label}
-                    </Button>
-                  )}
-                  {secondaryAction && (
-                    <Button
-                      size="lg"
-                      variant="outline"
-                      onClick={secondaryAction.onClick}
-                      className="w-full sm:w-auto"
-                    >
-                      {secondaryAction.label}
-                    </Button>
-                  )}
-                </div>
-              )}
-            </div>
-          </div>
-        </div>
-      </section>
-    )
-  }
-
-  if (variant === 'gradient') {
-    return (
-      <section
-        className={cn(
-          'relative overflow-hidden bg-gradient-to-br from-primary/90 to-primary py-24 sm:py-32',
-          className
-        )}
-        {...props}
-      >
-        <div className="absolute inset-0 bg-grid-white/10" />
-        <div className="container relative">
-          <div className="mx-auto max-w-3xl text-center">
-            <h2 className="text-3xl font-bold tracking-tight text-primary-foreground sm:text-4xl">
-              {title}
-            </h2>
-            {description && (
-              <p className="mt-4 text-lg text-primary-foreground/90">
-                {description}
-              </p>
-            )}
-            {(primaryAction || secondaryAction) && (
-              <div className="mt-10 flex flex-col gap-4 sm:flex-row sm:justify-center">
-                {primaryAction && (
-                  <Button
-                    size="lg"
-                    variant="secondary"
-                    onClick={primaryAction.onClick}
-                    className="w-full sm:w-auto"
-                  >
-                    {primaryAction.label}
-                  </Button>
-                )}
-                {secondaryAction && (
-                  <Button
-                    size="lg"
-                    variant="outline"
-                    className="w-full border-primary-foreground/20 text-primary-foreground hover:bg-primary-foreground/10 sm:w-auto"
-                    onClick={secondaryAction.onClick}
-                  >
-                    {secondaryAction.label}
-                  </Button>
-                )}
-              </div>
-            )}
-          </div>
-        </div>
-      </section>
-    )
-  }
-
-  if (variant === 'centered') {
-    return (
-      <section className={cn('py-24 sm:py-32', className)} {...props}>
-        <div className="container">
-          <div className="mx-auto max-w-3xl text-center">
-            <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-              {title}
-            </h2>
-            {description && (
-              <p className="mt-4 text-lg text-muted-foreground">
-                {description}
-              </p>
-            )}
-            {(primaryAction || secondaryAction) && (
-              <div className="mt-10 flex flex-col gap-4 sm:flex-row sm:justify-center">
-                {primaryAction && (
-                  <Button
-                    size="lg"
-                    onClick={primaryAction.onClick}
-                    className="w-full sm:w-auto"
-                  >
-                    {primaryAction.label}
-                  </Button>
-                )}
-                {secondaryAction && (
-                  <Button
-                    size="lg"
-                    variant="outline"
-                    onClick={secondaryAction.onClick}
-                    className="w-full sm:w-auto"
-                  >
-                    {secondaryAction.label}
-                  </Button>
-                )}
-              </div>
-            )}
-          </div>
-        </div>
-      </section>
-    )
-  }
-
-  // Default variant
-  return (
-    <section className={cn('py-24 sm:py-32', className)} {...props}>
-      <div className="container">
-        <div className="flex flex-col items-center justify-between gap-8 sm:flex-row sm:gap-12">
-          <div className="max-w-xl">
-            <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-              {title}
-            </h2>
-            {description && (
-              <p className="mt-4 text-lg text-muted-foreground">
-                {description}
-              </p>
-            )}
-          </div>
-          {(primaryAction || secondaryAction) && (
-            <div className="flex flex-col gap-4 sm:flex-row">
-              {primaryAction && (
-                <Button
-                  size="lg"
-                  onClick={primaryAction.onClick}
-                  className="w-full sm:w-auto"
-                >
-                  {primaryAction.label}
-                </Button>
-              )}
-              {secondaryAction && (
-                <Button
-                  size="lg"
-                  variant="outline"
-                  onClick={secondaryAction.onClick}
-                  className="w-full sm:w-auto"
-                >
-                  {secondaryAction.label}
-                </Button>
-              )}
-            </div>
-          )}
-        </div>
-      </div>
-    </section>
-  )
-}

package/blocks/marketing/faq.tsx

@@ -1,159 +0,0 @@
-'use client'
-
-import { cn } from '@hanzo/ui/util'
-import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from '@hanzo/ui/primitives'
-
-interface FAQItem {
-  question: string
-  answer: string
-}
-
-interface FAQProps extends React.ComponentPropsWithoutRef<'section'> {
-  title?: string
-  subtitle?: string
-  description?: string
-  items: FAQItem[]
-  variant?: 'default' | 'centered' | 'split'
-}
-
-export function FAQ({
-  className,
-  title,
-  subtitle,
-  description,
-  items,
-  variant = 'default',
-  ...props
-}: FAQProps) {
-  if (variant === 'split') {
-    return (
-      <section className={cn('py-24 sm:py-32', className)} {...props}>
-        <div className="container">
-          <div className="grid gap-12 lg:grid-cols-5">
-            <div className="lg:col-span-2">
-              {subtitle && (
-                <p className="mb-4 text-sm font-semibold uppercase tracking-wide text-primary">
-                  {subtitle}
-                </p>
-              )}
-              {title && (
-                <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-                  {title}
-                </h2>
-              )}
-              {description && (
-                <p className="mt-4 text-lg text-muted-foreground">
-                  {description}
-                </p>
-              )}
-            </div>
-            <div className="lg:col-span-3">
-              <Accordion type="single" collapsible className="w-full">
-                {items.map((item, i) => (
-                  <AccordionItem key={i} value={`item-${i}`}>
-                    <AccordionTrigger className="text-left">
-                      {item.question}
-                    </AccordionTrigger>
-                    <AccordionContent>{item.answer}</AccordionContent>
-                  </AccordionItem>
-                ))}
-              </Accordion>
-            </div>
-          </div>
-        </div>
-      </section>
-    )
-  }
-
-  if (variant === 'centered') {
-    return (
-      <section className={cn('py-24 sm:py-32', className)} {...props}>
-        <div className="container">
-          <div className="mx-auto max-w-3xl">
-            {(title || subtitle || description) && (
-              <div className="text-center">
-                {subtitle && (
-                  <p className="mb-4 text-sm font-semibold uppercase tracking-wide text-primary">
-                    {subtitle}
-                  </p>
-                )}
-                {title && (
-                  <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-                    {title}
-                  </h2>
-                )}
-                {description && (
-                  <p className="mt-4 text-lg text-muted-foreground">
-                    {description}
-                  </p>
-                )}
-              </div>
-            )}
-            <Accordion 
-              type="single" 
-              collapsible 
-              className={cn('w-full', (title || subtitle || description) && 'mt-12')}
-            >
-              {items.map((item, i) => (
-                <AccordionItem key={i} value={`item-${i}`}>
-                  <AccordionTrigger className="text-left">
-                    {item.question}
-                  </AccordionTrigger>
-                  <AccordionContent>{item.answer}</AccordionContent>
-                </AccordionItem>
-              ))}
-            </Accordion>
-          </div>
-        </div>
-      </section>
-    )
-  }
-
-  // Default variant
-  return (
-    <section className={cn('py-24 sm:py-32', className)} {...props}>
-      <div className="container">
-        <div className="mx-auto max-w-4xl">
-          {(title || subtitle || description) && (
-            <div>
-              {subtitle && (
-                <p className="mb-4 text-sm font-semibold uppercase tracking-wide text-primary">
-                  {subtitle}
-                </p>
-              )}
-              {title && (
-                <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-                  {title}
-                </h2>
-              )}
-              {description && (
-                <p className="mt-4 text-lg text-muted-foreground">
-                  {description}
-                </p>
-              )}
-            </div>
-          )}
-          <Accordion 
-            type="single" 
-            collapsible 
-            className={cn('w-full', (title || subtitle || description) && 'mt-12')}
-          >
-            {items.map((item, i) => (
-              <AccordionItem key={i} value={`item-${i}`}>
-                <AccordionTrigger className="text-left">
-                  {item.question}
-                </AccordionTrigger>
-                <AccordionContent>{item.answer}</AccordionContent>
-              </AccordionItem>
-            ))}
-          </Accordion>
-        </div>
-      </div>
-    </section>
-  )
-}

package/blocks/marketing/features-grid.tsx

@@ -1,156 +0,0 @@
-'use client'
-
-import { cn } from '@hanzo/ui/util'
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@hanzo/ui/primitives'
-import type { LucideIcon } from 'lucide-react'
-
-interface Feature {
-  icon?: LucideIcon
-  title: string
-  description: string
-  href?: string
-}
-
-interface FeaturesGridProps extends React.ComponentPropsWithoutRef<'section'> {
-  title?: string
-  subtitle?: string
-  description?: string
-  features: Feature[]
-  columns?: 2 | 3 | 4
-  variant?: 'default' | 'cards' | 'minimal'
-}
-
-export function FeaturesGrid({
-  className,
-  title,
-  subtitle,
-  description,
-  features,
-  columns = 3,
-  variant = 'default',
-  ...props
-}: FeaturesGridProps) {
-  const gridCols = {
-    2: 'md:grid-cols-2',
-    3: 'md:grid-cols-2 lg:grid-cols-3',
-    4: 'md:grid-cols-2 lg:grid-cols-4',
-  }[columns]
-
-  return (
-    <section className={cn('py-24 sm:py-32', className)} {...props}>
-      <div className="container">
-        {(title || subtitle || description) && (
-          <div className="mx-auto max-w-3xl text-center">
-            {subtitle && (
-              <p className="mb-4 text-sm font-semibold uppercase tracking-wide text-primary">
-                {subtitle}
-              </p>
-            )}
-            {title && (
-              <h2 className="text-3xl font-bold tracking-tight sm:text-4xl">
-                {title}
-              </h2>
-            )}
-            {description && (
-              <p className="mt-4 text-lg text-muted-foreground">
-                {description}
-              </p>
-            )}
-          </div>
-        )}
-        
-        {variant === 'cards' && (
-          <div className={cn('mt-16 grid gap-6', gridCols)}>
-            {features.map((feature, i) => {
-              const Icon = feature.icon
-              return (
-                <Card key={i} className="relative">
-                  {feature.href && (
-                    <a
-                      href={feature.href}
-                      className="absolute inset-0 z-10"
-                      aria-label={feature.title}
-                    />
-                  )}
-                  <CardHeader>
-                    {Icon && (
-                      <div className="mb-2 inline-flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10">
-                        <Icon className="h-5 w-5 text-primary" />
-                      </div>
-                    )}
-                    <CardTitle>{feature.title}</CardTitle>
-                  </CardHeader>
-                  <CardContent>
-                    <CardDescription>{feature.description}</CardDescription>
-                  </CardContent>
-                </Card>
-              )
-            })}
-          </div>
-        )}
-        
-        {variant === 'minimal' && (
-          <div className={cn('mt-16 grid gap-x-8 gap-y-10', gridCols)}>
-            {features.map((feature, i) => {
-              const Icon = feature.icon
-              return (
-                <div key={i} className="relative">
-                  {feature.href && (
-                    <a
-                      href={feature.href}
-                      className="absolute inset-0 z-10"
-                      aria-label={feature.title}
-                    />
-                  )}
-                  <div className="flex items-start gap-4">
-                    {Icon && (
-                      <div className="flex-shrink-0">
-                        <div className="inline-flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10">
-                          <Icon className="h-5 w-5 text-primary" />
-                        </div>
-                      </div>
-                    )}
-                    <div>
-                      <h3 className="font-semibold">{feature.title}</h3>
-                      <p className="mt-2 text-sm text-muted-foreground">
-                        {feature.description}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              )
-            })}
-          </div>
-        )}
-        
-        {variant === 'default' && (
-          <div className={cn('mt-16 grid gap-8', gridCols)}>
-            {features.map((feature, i) => {
-              const Icon = feature.icon
-              return (
-                <div key={i} className="relative text-center">
-                  {feature.href && (
-                    <a
-                      href={feature.href}
-                      className="absolute inset-0 z-10"
-                      aria-label={feature.title}
-                    />
-                  )}
-                  {Icon && (
-                    <div className="mx-auto mb-4 inline-flex h-12 w-12 items-center justify-center rounded-lg bg-primary/10">
-                      <Icon className="h-6 w-6 text-primary" />
-                    </div>
-                  )}
-                  <h3 className="mb-2 text-lg font-semibold">{feature.title}</h3>
-                  <p className="text-sm text-muted-foreground">
-                    {feature.description}
-                  </p>
-                </div>
-              )
-            })}
-          </div>
-        )}
-      </div>
-    </section>
-  )
-}