@thorprovider/blocks 1.0.0 → 2.0.0

package/src/blocks/e-commerce/checkout-forms/checkout-form-3.tsx

@@ -1,392 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-import { ChevronLeft, ChevronRight, Lock } from 'lucide-react'
-
-import type { PaymentMethod } from '@thorprovider/types'
-
-import { Button } from '../../../ui/button'
-import { Card, CardContent, CardHeader, CardTitle } from '../../../ui/card'
-
-import { CheckoutForm3InformationStep } from './checkout-form-3-information-step'
-import { CheckoutForm3OrderSummary } from './checkout-form-3-order-summary'
-import { CheckoutForm3PaymentStep } from './checkout-form-3-payment-step'
-import { CheckoutForm3Progress, CHECKOUT_FORM_3_STEP_ICONS } from './checkout-form-3-progress'
-import { CheckoutForm3ReviewStep } from './checkout-form-3-review-step'
-import { CheckoutForm3ShippingStep } from './checkout-form-3-shipping-step'
-
-export interface CheckoutForm3CartItem {
-  id: number
-  name: string
-  price: number
-  quantity: number
-  image: string
-}
-
-export interface CheckoutForm3ShippingMethod {
-  id: string
-  name: string
-  description: string
-  cost: number
-}
-
-export interface CheckoutForm3CountryOption {
-  value: string
-  label: string
-}
-
-export interface CheckoutForm3Step {
-  id: number
-  name: string
-}
-
-export interface CheckoutForm3FormData {
-  email: string
-  firstName: string
-  lastName: string
-  phone: string
-  address: string
-  apartment: string
-  city: string
-  state: string
-  zipCode: string
-  country: string
-  shippingMethod: string
-  paymentMethod: string
-  cardNumber: string
-  expiryDate: string
-  cvv: string
-  cardName: string
-  billingAddress: string
-  newsletter: boolean
-  saveInfo: boolean
-}
-
-export type CheckoutForm3ChangeHandler = (
-  field: keyof CheckoutForm3FormData,
-  value: string | boolean
-) => void
-
-export interface CheckoutForm3Props {
-  cartItems: CheckoutForm3CartItem[]
-  shippingMethods: CheckoutForm3ShippingMethod[]
-  paymentMethods?: PaymentMethod[]
-  taxRate?: number
-  countryOptions?: CheckoutForm3CountryOption[]
-  steps?: CheckoutForm3Step[]
-  currencySymbol?: string
-  titleLabel?: string
-  subtitleLabel?: string
-  backLabel?: string
-  continueLabel?: string
-  placeOrderLabel?: string
-  shippingAddressLabel?: string
-  shippingMethodLabel?: string
-  paymentLabel?: string
-  noMethodsLabel?: string
-  securePaymentLabel?: string
-  emailLabel?: string
-  firstNameLabel?: string
-  lastNameLabel?: string
-  phoneLabel?: string
-  addressLabel?: string
-  apartmentLabel?: string
-  cityLabel?: string
-  stateLabel?: string
-  zipCodeLabel?: string
-  countryLabel?: string
-  cardNumberLabel?: string
-  expiryLabel?: string
-  cvvLabel?: string
-  cardNameLabel?: string
-  newsletterLabel?: string
-  saveInfoLabel?: string
-  orderSummaryLabel?: string
-  subtotalLabel?: string
-  shippingLabel?: string
-  taxLabel?: string
-  totalLabel?: string
-  freeLabel?: string
-  orderReviewLabel?: string
-  contactReviewLabel?: string
-  shipToReviewLabel?: string
-  paymentReviewLabel?: string
-  shippingReviewLabel?: string
-  onComplete?: (data: CheckoutForm3FormData) => void
-  onNextStep?: (step: number) => void
-  onPreviousStep?: (step: number) => void
-  onFieldChange?: CheckoutForm3ChangeHandler
-}
-
-const DEFAULT_COUNTRY_OPTIONS: CheckoutForm3CountryOption[] = [
-  { value: 'US', label: 'Estados Unidos' },
-  { value: 'CA', label: 'Canadá' },
-  { value: 'UK', label: 'Reino Unido' },
-  { value: 'AU', label: 'Australia' },
-]
-
-const DEFAULT_STEPS: CheckoutForm3Step[] = [
-  { id: 1, name: 'Información' },
-  { id: 2, name: 'Envío' },
-  { id: 3, name: 'Pago' },
-  { id: 4, name: 'Revisión' },
-]
-
-export default function CheckoutForm3({
-  cartItems,
-  shippingMethods,
-  paymentMethods = [],
-  taxRate = 0,
-  countryOptions = DEFAULT_COUNTRY_OPTIONS,
-  steps = DEFAULT_STEPS,
-  currencySymbol = '$',
-  titleLabel = 'Checkout seguro',
-  subtitleLabel,
-  backLabel = 'Anterior',
-  continueLabel = 'Continuar',
-  placeOrderLabel = 'Realizar pedido',
-  shippingAddressLabel = 'Dirección de envío',
-  shippingMethodLabel = 'Método de envío',
-  paymentLabel = 'Método de pago',
-  noMethodsLabel = 'No hay métodos de pago disponibles para esta región.',
-  securePaymentLabel = 'Tu información de pago está cifrada y es segura',
-  emailLabel = 'Correo electrónico',
-  firstNameLabel = 'Nombre',
-  lastNameLabel = 'Apellidos',
-  phoneLabel = 'Teléfono',
-  addressLabel = 'Dirección',
-  apartmentLabel = 'Apartamento, suite, etc.',
-  cityLabel = 'Ciudad',
-  stateLabel = 'Estado/Provincia',
-  zipCodeLabel = 'Código postal',
-  countryLabel = 'País',
-  cardNumberLabel = 'Número de tarjeta',
-  expiryLabel = 'Fecha de vencimiento',
-  cvvLabel = 'CVV',
-  cardNameLabel = 'Nombre en la tarjeta',
-  newsletterLabel = 'Quiero recibir novedades y ofertas',
-  saveInfoLabel = 'Guardar esta información para la próxima vez',
-  orderSummaryLabel = 'Resumen del pedido',
-  subtotalLabel = 'Subtotal',
-  shippingLabel = 'Envío',
-  taxLabel = 'Impuestos',
-  totalLabel = 'Total',
-  freeLabel = 'Gratis',
-  orderReviewLabel = 'Revisión del pedido',
-  contactReviewLabel = 'Contacto',
-  shipToReviewLabel = 'Enviar a',
-  paymentReviewLabel = 'Pago',
-  shippingReviewLabel = 'Envío',
-  onComplete,
-  onNextStep,
-  onPreviousStep,
-  onFieldChange,
-}: CheckoutForm3Props) {
-  const [currentStep, setCurrentStep] = useState(1)
-  const [formData, setFormData] = useState<CheckoutForm3FormData>(() => ({
-    email: '',
-    firstName: '',
-    lastName: '',
-    phone: '',
-    address: '',
-    apartment: '',
-    city: '',
-    state: '',
-    zipCode: '',
-    country: countryOptions[0]?.value ?? '',
-    shippingMethod: shippingMethods[0]?.id ?? '',
-    paymentMethod: paymentMethods[0]?.id ?? '',
-    cardNumber: '',
-    expiryDate: '',
-    cvv: '',
-    cardName: '',
-    billingAddress: 'same',
-    newsletter: false,
-    saveInfo: false,
-  }))
-
-  const subtotal = cartItems.reduce((sum, item) => sum + item.price * item.quantity, 0)
-  const shippingCosts = Object.fromEntries(
-    shippingMethods.map(method => [method.id, method.cost]),
-  ) as Record<string, number>
-  const shipping = shippingCosts[formData.shippingMethod] ?? 0
-  const tax = subtotal * taxRate
-  const total = subtotal + shipping + tax
-
-  const handleInputChange: CheckoutForm3ChangeHandler = (field, value) => {
-    setFormData(prev => ({ ...prev, [field]: value }))
-    onFieldChange?.(field, value)
-  }
-
-  const handleNextStep = () => {
-    const next = Math.min(currentStep + 1, steps.length)
-    setCurrentStep(next)
-    onNextStep?.(next)
-  }
-
-  const handlePreviousStep = () => {
-    const next = Math.max(currentStep - 1, 1)
-    setCurrentStep(next)
-    onPreviousStep?.(next)
-  }
-
-  /** Continue stays disabled until the fields this step is responsible for are filled in. */
-  const isStepComplete = (stepNumber: number) => {
-    if (stepNumber < currentStep) return true
-    if (stepNumber === 1) return Boolean(formData.email && formData.firstName && formData.lastName)
-    if (stepNumber === 2) return Boolean(formData.address && formData.city && formData.zipCode)
-    if (stepNumber === 3) {
-      const selectedMethod = paymentMethods.find(method => method.id === formData.paymentMethod)
-      if (!formData.paymentMethod) return false
-      return selectedMethod?.type === 'card' ? Boolean(formData.cardNumber) : true
-    }
-    return false
-  }
-
-  const CurrentStepIcon = CHECKOUT_FORM_3_STEP_ICONS[currentStep - 1]
-
-  return (
-    <section className='py-8'>
-      <div className='mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8'>
-        <div className='mb-8'>
-          <h1 className='text-3xl font-bold tracking-tight text-balance'>{titleLabel}</h1>
-          <p className='text-muted-foreground mt-2'>
-            {subtitleLabel ?? `Completa tu compra en ${steps.length} sencillos pasos`}
-          </p>
-        </div>
-
-        <div className='grid gap-8 lg:grid-cols-3'>
-          <div className='lg:col-span-2'>
-            <CheckoutForm3Progress
-              steps={steps}
-              currentStep={currentStep}
-              isStepComplete={isStepComplete}
-            />
-
-            <Card>
-              <CardHeader>
-                <CardTitle className='flex items-center gap-2'>
-                  {CurrentStepIcon ? <CurrentStepIcon className='size-5' aria-hidden='true' /> : null}
-                  {steps[currentStep - 1].name}
-                </CardTitle>
-              </CardHeader>
-              <CardContent className='flex flex-col gap-6'>
-                {currentStep === 1 ? (
-                  <CheckoutForm3InformationStep
-                    formData={formData}
-                    onChange={handleInputChange}
-                    emailLabel={emailLabel}
-                    firstNameLabel={firstNameLabel}
-                    lastNameLabel={lastNameLabel}
-                    phoneLabel={phoneLabel}
-                    newsletterLabel={newsletterLabel}
-                  />
-                ) : null}
-
-                {currentStep === 2 ? (
-                  <CheckoutForm3ShippingStep
-                    formData={formData}
-                    onChange={handleInputChange}
-                    countryOptions={countryOptions}
-                    shippingMethods={shippingMethods}
-                    shippingAddressLabel={shippingAddressLabel}
-                    shippingMethodLabel={shippingMethodLabel}
-                    addressLabel={addressLabel}
-                    apartmentLabel={apartmentLabel}
-                    cityLabel={cityLabel}
-                    stateLabel={stateLabel}
-                    zipCodeLabel={zipCodeLabel}
-                    countryLabel={countryLabel}
-                    freeLabel={freeLabel}
-                    currencySymbol={currencySymbol}
-                  />
-                ) : null}
-
-                {currentStep === 3 ? (
-                  <CheckoutForm3PaymentStep
-                    formData={formData}
-                    onChange={handleInputChange}
-                    paymentMethods={paymentMethods}
-                    paymentLabel={paymentLabel}
-                    noMethodsLabel={noMethodsLabel}
-                    cardNumberLabel={cardNumberLabel}
-                    expiryLabel={expiryLabel}
-                    cvvLabel={cvvLabel}
-                    cardNameLabel={cardNameLabel}
-                    securePaymentLabel={securePaymentLabel}
-                  />
-                ) : null}
-
-                {currentStep === 4 ? (
-                  <CheckoutForm3ReviewStep
-                    formData={formData}
-                    onChange={handleInputChange}
-                    shippingMethods={shippingMethods}
-                    paymentMethods={paymentMethods}
-                    orderReviewLabel={orderReviewLabel}
-                    contactReviewLabel={contactReviewLabel}
-                    shipToReviewLabel={shipToReviewLabel}
-                    paymentReviewLabel={paymentReviewLabel}
-                    shippingReviewLabel={shippingReviewLabel}
-                    saveInfoLabel={saveInfoLabel}
-                  />
-                ) : null}
-
-                <div className='flex justify-between pt-6'>
-                  <Button
-                    type='button'
-                    variant='outline'
-                    className='h-9 px-4 py-2 cursor-pointer'
-                    onClick={handlePreviousStep}
-                    disabled={currentStep === 1}
-                  >
-                    <ChevronLeft data-icon='inline-start' />
-                    {backLabel}
-                  </Button>
-
-                  {currentStep < steps.length ? (
-                    <Button
-                      type='button'
-                      onClick={handleNextStep}
-                      className='h-9 px-4 py-2 cursor-pointer'
-                      disabled={!isStepComplete(currentStep)}
-                    >
-                      {continueLabel}
-                      <ChevronRight data-icon='inline-end' />
-                    </Button>
-                  ) : (
-                    <Button
-                      type='button'
-                      className='h-9 px-4 py-2 min-w-32 cursor-pointer'
-                      onClick={() => onComplete?.(formData)}
-                    >
-                      <Lock data-icon='inline-start' />
-                      {placeOrderLabel}
-                    </Button>
-                  )}
-                </div>
-              </CardContent>
-            </Card>
-          </div>
-
-          <div className='lg:col-span-1'>
-            <CheckoutForm3OrderSummary
-              items={cartItems}
-              subtotal={subtotal}
-              shipping={shipping}
-              tax={tax}
-              total={total}
-              currencySymbol={currencySymbol}
-              orderSummaryLabel={orderSummaryLabel}
-              subtotalLabel={subtotalLabel}
-              shippingLabel={shippingLabel}
-              taxLabel={taxLabel}
-              totalLabel={totalLabel}
-              freeLabel={freeLabel}
-            />
-          </div>
-        </div>
-      </div>
-    </section>
-  )
-}

package/src/blocks/marketing/footers/footer-section-1.test.tsx

@@ -1,117 +0,0 @@
-import type { ReactElement, ReactNode } from 'react'
-import { renderToStaticMarkup } from 'react-dom/server'
-import { describe, expect, it, vi } from 'vitest'
-import { FooterSection1 } from './footer-section-1'
-
-const base = {
-  brandName: 'ElectroCuba',
-  linkColumns: [],
-}
-
-type SubmitHandler = (event: { preventDefault: () => void }) => void
-
-function findForm(node: ReactNode): ReactElement<{ onSubmit?: SubmitHandler }> | undefined {
-  if (node === null || node === undefined || typeof node !== 'object') return undefined
-  if (Array.isArray(node)) {
-    for (const child of node) {
-      const found = findForm(child)
-      if (found) return found
-    }
-    return undefined
-  }
-  const element = node as ReactElement<{ children?: ReactNode }>
-  if (element.type === 'form') return element as ReactElement<{ onSubmit?: SubmitHandler }>
-  return findForm(element.props?.children)
-}
-
-describe('FooterSection1 — optional brand accent', () => {
-  it('renders the brand name unchanged when no accent is supplied', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} />)
-    expect(html).toContain('>ElectroCuba</span>')
-    expect(html).not.toContain('text-brand-promo')
-  })
-
-  it('accents a matched trailing segment without duplicating the brand name', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} brandAccent={{ text: 'Cuba', className: 'text-brand-promo' }} />,
-    )
-    expect(html).toContain('Electro<span class="text-brand-promo">Cuba</span>')
-    expect(html.match(/Electro/g)).toHaveLength(1)
-    expect(html.match(/Cuba/g)).toHaveLength(1)
-  })
-
-  it('accents the full brand name when the accent covers all of it', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} brandAccent={{ text: 'ElectroCuba', className: 'text-brand-promo' }} />,
-    )
-    expect(html).toContain('<span class="text-brand-promo">ElectroCuba</span>')
-  })
-
-  it('does not accent when the segment is not a trailing match', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} brandAccent={{ text: 'Electro' }} />)
-    expect(html).toContain('>ElectroCuba</span>')
-  })
-})
-
-describe('FooterSection1 — newsletter requires a submit callback', () => {
-  it('renders no form, input, or button when the newsletter has no onSubmit', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} newsletter={{ buttonLabel: 'Suscribirse', placeholder: 'tu@correo.com' }} />,
-    )
-    expect(html).not.toContain('<form')
-    expect(html).not.toContain('<input')
-    expect(html).not.toContain('<button')
-  })
-
-  it('renders the interactive form when a submit handler is supplied', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} newsletter={{ buttonLabel: 'Suscribirse', onSubmit: () => {} }} />,
-    )
-    expect(html).toContain('<form')
-    expect(html).toContain('<input')
-    expect(html).toContain('<button')
-    expect(html).toContain('Suscribirse')
-  })
-
-  it('retains the supplied submit handler and forwards the email', () => {
-    const onSubmit = vi.fn()
-    const tree = FooterSection1({
-      ...base,
-      newsletter: { buttonLabel: 'Suscribirse', onSubmit },
-    })
-    const form = findForm(tree)
-    expect(form).toBeDefined()
-
-    vi.stubGlobal(
-      'FormData',
-      class {
-        get() {
-          return 'shopper@example.com'
-        }
-      },
-    )
-    try {
-      form?.props.onSubmit?.({ preventDefault: () => {} })
-    } finally {
-      vi.unstubAllGlobals()
-    }
-
-    expect(onSubmit).toHaveBeenCalledWith('shopper@example.com')
-  })
-})
-
-describe('FooterSection1 — optional outer surface className', () => {
-  it('keeps the default surface when className is omitted', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} />)
-    expect(html).toContain('bg-secondary')
-  })
-
-  it('merges a branded surface onto the footer and drops the default background', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} className='bg-brand-nav text-brand-nav-foreground' />,
-    )
-    expect(html).toContain('bg-brand-nav')
-    expect(html).toContain('text-brand-nav-foreground')
-    expect(html).not.toContain('bg-secondary')
-  })
-})

package/src/blocks/marketing/footers/footer-section-1.tsx

@@ -1,178 +0,0 @@
-'use client'
-
-import { Input } from '../../../ui/input'
-import { Button } from '../../../ui/button'
-import { ArrowRight } from 'lucide-react'
-import { cn } from '../../../lib/utils'
-
-export interface FooterLink {
-  label: string
-  href?: string
-}
-
-export interface FooterLinkColumn {
-  title: string
-  links: FooterLink[]
-}
-
-export interface FooterNewsletter {
-  placeholder?: string
-  buttonLabel: string
-  /**
-   * Submit handler. The interactive form (input + submit button) renders only
-   * when this is supplied. A newsletter without `onSubmit` renders no form,
-   * input, or button — never a fake form.
-   */
-  onSubmit?: (email: string) => void
-}
-
-export interface BrandAccent {
-  /** Trailing segment of `brandName` to render with the accent styling. */
-  text: string
-  /** Consumer-supplied classes for the accent span (e.g. a brand color token). */
-  className?: string
-}
-
-export interface FooterSection1Props {
-  brandName: string
-  /**
-   * Optional accent for a trailing segment of `brandName` (e.g. the "Cuba" in
-   * "ElectroCuba"). When omitted, or when `text` is not a trailing segment of
-   * `brandName`, the brand name renders unchanged.
-   */
-  brandAccent?: BrandAccent
-  brandDescription?: string
-  linkColumns: FooterLinkColumn[]
-  newsletter?: FooterNewsletter
-  /**
-   * Consumer-supplied classes merged onto the outer `<footer>` as the final
-   * argument, so a semantic surface such as `bg-brand-nav
-   * text-brand-nav-foreground` overrides the default `bg-secondary`. Purely
-   * presentational: no layout, structure, or behavior changes.
-   */
-  className?: string
-}
-
-export function FooterSection1({
-  brandName,
-  brandAccent,
-  brandDescription,
-  linkColumns,
-  newsletter,
-  className,
-}: FooterSection1Props) {
-  const accentText = brandAccent?.text ?? ''
-  const hasAccent = accentText.length > 0 && brandName.endsWith(accentText)
-  const baseName = hasAccent ? brandName.slice(0, brandName.length - accentText.length) : brandName
-  const newsletterSubmit = newsletter?.onSubmit
-
-  return (
-    <footer
-      className={cn('bg-secondary w-full py-16', className)}
-      aria-label='Pie de página'
-    >
-      <div className='mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8'>
-        <div className='grid grid-cols-1 gap-8 lg:grid-cols-12'>
-          {/* Left Section */}
-          <div className='me-8 md:col-span-5'>
-            <div className='mb-6 flex items-center gap-2'>
-              <svg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'>
-                <path
-                  d='M26 24.75C26.4142 24.75 26.75 24.4142 26.75 24C26.75 23.5858 26.4142 23.25 26 23.25V24.75ZM26 23.25H11V24.75H26V23.25ZM8.75 21V15H7.25V21H8.75ZM11 23.25C9.75736 23.25 8.75 22.2426 8.75 21H7.25C7.25 23.0711 8.92893 24.75 11 24.75V23.25Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M1.5 3.25C1.08579 3.25 0.75 3.58579 0.75 4C0.75 4.41421 1.08579 4.75 1.5 4.75V3.25ZM1.5 4.75H6V3.25H1.5V4.75ZM7.25 6V21H8.75V6H7.25ZM6 4.75C6.69036 4.75 7.25 5.30964 7.25 6H8.75C8.75 4.48122 7.51878 3.25 6 3.25V4.75Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M22 21.75C22.4142 21.75 22.75 21.4142 22.75 21C22.75 20.5858 22.4142 20.25 22 20.25V21.75ZM22 20.25H11V21.75H22V20.25ZM8.75 18V12H7.25V18H8.75ZM11 20.25C9.75736 20.25 8.75 19.2426 8.75 18H7.25C7.25 20.0711 8.92893 21.75 11 21.75V20.25Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M27.2057 19.754C27.0654 20.1438 26.6357 20.346 26.246 20.2057C25.8562 20.0654 25.654 19.6357 25.7943 19.246L27.2057 19.754ZM30.0361 9.67744L29.3305 9.4234L29.3305 9.4234L30.0361 9.67744ZM25.7943 19.246L29.3305 9.4234L30.7418 9.93148L27.2057 19.754L25.7943 19.246ZM28.1543 7.75L8 7.75V6.25L28.1543 6.25V7.75ZM29.3305 9.4234C29.6237 8.60882 29.0201 7.75 28.1543 7.75V6.25C30.059 6.25 31.3869 8.13941 30.7418 9.93148L29.3305 9.4234Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M13.5 21.75C13.0858 21.75 12.75 21.4142 12.75 21C12.75 20.5858 13.0858 20.25 13.5 20.25V21.75ZM26.7111 19.009L27.4174 19.2613L27.4174 19.2613L26.7111 19.009ZM13.5 20.25H23.8858V21.75H13.5V20.25ZM26.0048 18.7568L27.7937 13.7477L29.2063 14.2523L27.4174 19.2613L26.0048 18.7568ZM23.8858 20.25C24.8367 20.25 25.6849 19.6522 26.0048 18.7568L27.4174 19.2613C26.8843 20.7537 25.4706 21.75 23.8858 21.75V20.25Z'
-                  fill='currentColor'
-                />
-                <path d='M21.1694 10.5806L14.5651 17.1849' stroke='currentColor' />
-                <path d='M22.1694 14.5806L18.5632 18.1868' stroke='currentColor' />
-                <circle cx='13.1' cy='26.1' r='1.7' stroke='currentColor' />
-                <circle cx='22.1' cy='26.1' r='1.7' stroke='currentColor' />
-              </svg>
-              <span className='text-xl font-semibold'>
-                {baseName}
-                {hasAccent ? <span className={brandAccent?.className}>{accentText}</span> : null}
-              </span>
-            </div>
-            {brandDescription && (
-              <p className='text-muted-foreground mb-8 max-w-sm text-sm leading-relaxed text-balance'>
-                {brandDescription}
-              </p>
-            )}
-            {newsletter && newsletterSubmit ? (
-              <form
-                className='relative'
-                onSubmit={e => {
-                  e.preventDefault()
-                  const email = new FormData(e.currentTarget).get('email')
-                  if (typeof email === 'string') {
-                    newsletterSubmit(email)
-                  }
-                }}
-              >
-                <Input
-                  type='email'
-                  name='email'
-                  placeholder={newsletter.placeholder}
-                  className='border-muted-foreground/20 bg-background/80 h-12 pe-32'
-                  aria-label='Correo electrónico'
-                />
-                <Button
-                  type='submit'
-                  variant='default'
-                  className='absolute end-1 top-1 h-10 cursor-pointer px-4'
-                  aria-label='Suscribirse a la newsletter'
-                >
-                  {newsletter.buttonLabel}
-                  <ArrowRight />
-                </Button>
-              </form>
-            ) : null}
-          </div>
-
-          {/* Right Section */}
-          <div className='md:col-span-7'>
-            <div className='grid grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3'>
-              {linkColumns.map(column => (
-                <div key={column.title}>
-                  <h3 className='mb-4 text-lg font-medium'>{column.title}</h3>
-                  <ul className='flex flex-col gap-3'>
-                    {column.links.map(link => (
-                      <li key={link.label}>
-                        {link.href ? (
-                          <a
-                            href={link.href}
-                            className='text-muted-foreground hover:text-primary text-sm transition-colors'
-                          >
-                            {link.label}
-                          </a>
-                        ) : (
-                          <span className='text-muted-foreground text-sm'>{link.label}</span>
-                        )}
-                      </li>
-                    ))}
-                  </ul>
-                </div>
-              ))}
-            </div>
-          </div>
-        </div>
-      </div>
-    </footer>
-  )
-}
-
-export default FooterSection1