ar-saas 0.3.0 → 0.3.2

package/templates/frontend/src/components/landing/footer.tsx

@@ -1,76 +1,76 @@
-import Link from 'next/link'
-import { Twitter, Github, Linkedin } from 'lucide-react'
-import { siteConfig } from '@/config/site'
-
-export function LandingFooter() {
-  const { footer } = siteConfig
-
-  return (
-    <footer className="border-t bg-card">
-      <div className="mx-auto max-w-6xl px-4 py-12">
-        <div className="grid gap-8 sm:grid-cols-2 md:grid-cols-4">
-          {/* Brand */}
-          <div className="sm:col-span-2 md:col-span-1">
-            <p className="text-lg font-bold">{siteConfig.name}</p>
-            <p className="mt-2 text-sm text-muted-foreground">{siteConfig.tagline}</p>
-            <div className="mt-4 flex gap-3">
-              {footer.social.twitter && (
-                <a
-                  href={footer.social.twitter}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground transition-colors hover:text-foreground"
-                >
-                  <Twitter className="size-4" />
-                </a>
-              )}
-              {footer.social.github && (
-                <a
-                  href={footer.social.github}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground transition-colors hover:text-foreground"
-                >
-                  <Github className="size-4" />
-                </a>
-              )}
-              {footer.social.linkedin && (
-                <a
-                  href={footer.social.linkedin}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground transition-colors hover:text-foreground"
-                >
-                  <Linkedin className="size-4" />
-                </a>
-              )}
-            </div>
-          </div>
-
-          {/* Link columns */}
-          {footer.columns.map((col) => (
-            <div key={col.title}>
-              <p className="text-sm font-semibold">{col.title}</p>
-              <ul className="mt-4 space-y-3">
-                {col.links.map((link) => (
-                  <li key={link.label}>
-                    <Link
-                      href={link.href}
-                      className="text-sm text-muted-foreground transition-colors hover:text-foreground"
-                    >
-                      {link.label}
-                    </Link>
-                  </li>
-                ))}
-              </ul>
-            </div>
-          ))}
-        </div>
-
-        <div className="mt-12 border-t pt-6 text-center text-sm text-muted-foreground">
-          {footer.copyright}
-        </div>
-      </div>
-    </footer>
-  )
-}
+import Link from 'next/link'
+import { Twitter, Github, Linkedin } from 'lucide-react'
+import { siteConfig } from '@/config/site'
+
+export function LandingFooter() {
+  const { footer } = siteConfig
+
+  return (
+    <footer className="border-t bg-card">
+      <div className="mx-auto max-w-6xl px-4 py-12">
+        <div className="grid gap-8 sm:grid-cols-2 md:grid-cols-4">
+          {/* Brand */}
+          <div className="sm:col-span-2 md:col-span-1">
+            <p className="text-lg font-bold">{siteConfig.name}</p>
+            <p className="mt-2 text-sm text-muted-foreground">{siteConfig.tagline}</p>
+            <div className="mt-4 flex gap-3">
+              {footer.social.twitter && (
+                <a
+                  href={footer.social.twitter}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-muted-foreground transition-colors hover:text-foreground"
+                >
+                  <Twitter className="size-4" />
+                </a>
+              )}
+              {footer.social.github && (
+                <a
+                  href={footer.social.github}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-muted-foreground transition-colors hover:text-foreground"
+                >
+                  <Github className="size-4" />
+                </a>
+              )}
+              {footer.social.linkedin && (
+                <a
+                  href={footer.social.linkedin}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-muted-foreground transition-colors hover:text-foreground"
+                >
+                  <Linkedin className="size-4" />
+                </a>
+              )}
+            </div>
+          </div>
+
+          {/* Link columns */}
+          {footer.columns.map((col) => (
+            <div key={col.title}>
+              <p className="text-sm font-semibold">{col.title}</p>
+              <ul className="mt-4 space-y-3">
+                {col.links.map((link) => (
+                  <li key={link.label}>
+                    <Link
+                      href={link.href}
+                      className="text-sm text-muted-foreground transition-colors hover:text-foreground"
+                    >
+                      {link.label}
+                    </Link>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          ))}
+        </div>
+
+        <div className="mt-12 border-t pt-6 text-center text-sm text-muted-foreground">
+          {footer.copyright}
+        </div>
+      </div>
+    </footer>
+  )
+}

package/templates/frontend/src/components/landing/hero.tsx

@@ -1,72 +1,72 @@
-import Link from 'next/link'
-import { ArrowRight } from 'lucide-react'
-import { siteConfig } from '@/config/site'
-import { Button } from '@/components/ui/button'
-import { Badge } from '@/components/ui/badge'
-
-export function LandingHero() {
-  return (
-    <section className="relative overflow-hidden py-20 md:py-32">
-      {/* Background gradient */}
-      <div className="pointer-events-none absolute inset-0 -z-10 bg-[radial-gradient(ellipse_80%_60%_at_50%_-10%,hsl(var(--primary)/0.12),transparent)]" />
-
-      <div className="mx-auto max-w-6xl px-4 text-center">
-        <Badge variant="outline" className="mb-6 px-4 py-1.5 text-sm">
-          Listo para producción en minutos
-        </Badge>
-
-        <h1 className="mx-auto max-w-4xl text-4xl font-bold tracking-tight md:text-6xl lg:text-7xl">
-          {siteConfig.hero.headline}
-        </h1>
-
-        <p className="mx-auto mt-6 max-w-2xl text-lg text-muted-foreground md:text-xl">
-          {siteConfig.hero.description}
-        </p>
-
-        <div className="mt-10 flex flex-col items-center justify-center gap-4 sm:flex-row">
-          <Button size="lg" asChild className="gap-2">
-            <Link href={siteConfig.hero.cta.href}>
-              {siteConfig.hero.cta.label}
-              <ArrowRight className="size-4" />
-            </Link>
-          </Button>
-          <Button size="lg" variant="outline" asChild>
-            <Link href={siteConfig.hero.ctaSecondary.href}>
-              {siteConfig.hero.ctaSecondary.label}
-            </Link>
-          </Button>
-        </div>
-
-        {/* Social proof */}
-        <p className="mt-8 text-sm text-muted-foreground">
-          Sin tarjeta de crédito &middot; Cancelá cuando quieras &middot; Soporte en español
-        </p>
-
-        {/* App mockup placeholder */}
-        <div className="mx-auto mt-16 max-w-4xl overflow-hidden rounded-xl border bg-muted/50 shadow-2xl">
-          <div className="flex h-8 items-center gap-2 border-b bg-muted px-4">
-            <div className="size-3 rounded-full bg-red-400" />
-            <div className="size-3 rounded-full bg-yellow-400" />
-            <div className="size-3 rounded-full bg-green-400" />
-            <div className="mx-2 h-4 flex-1 rounded bg-muted-foreground/20" />
-          </div>
-          <div className="grid grid-cols-[200px_1fr] divide-x" style={{ minHeight: 320 }}>
-            <div className="space-y-2 bg-card p-4">
-              {[...Array(6)].map((_, i) => (
-                <div key={i} className="h-7 rounded-md bg-muted" />
-              ))}
-            </div>
-            <div className="space-y-4 p-6">
-              <div className="grid grid-cols-3 gap-3">
-                {[...Array(3)].map((_, i) => (
-                  <div key={i} className="h-20 rounded-lg border bg-card" />
-                ))}
-              </div>
-              <div className="h-40 rounded-lg border bg-card" />
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
-  )
-}
+import Link from 'next/link'
+import { ArrowRight } from 'lucide-react'
+import { siteConfig } from '@/config/site'
+import { Button } from '@/components/ui/button'
+import { Badge } from '@/components/ui/badge'
+
+export function LandingHero() {
+  return (
+    <section className="relative overflow-hidden py-20 md:py-32">
+      {/* Background gradient */}
+      <div className="pointer-events-none absolute inset-0 -z-10 bg-[radial-gradient(ellipse_80%_60%_at_50%_-10%,hsl(var(--primary)/0.12),transparent)]" />
+
+      <div className="mx-auto max-w-6xl px-4 text-center">
+        <Badge variant="outline" className="mb-6 px-4 py-1.5 text-sm">
+          Listo para producción en minutos
+        </Badge>
+
+        <h1 className="mx-auto max-w-4xl text-4xl font-bold tracking-tight md:text-6xl lg:text-7xl">
+          {siteConfig.hero.headline}
+        </h1>
+
+        <p className="mx-auto mt-6 max-w-2xl text-lg text-muted-foreground md:text-xl">
+          {siteConfig.hero.description}
+        </p>
+
+        <div className="mt-10 flex flex-col items-center justify-center gap-4 sm:flex-row">
+          <Button size="lg" asChild className="gap-2">
+            <Link href={siteConfig.hero.cta.href}>
+              {siteConfig.hero.cta.label}
+              <ArrowRight className="size-4" />
+            </Link>
+          </Button>
+          <Button size="lg" variant="outline" asChild>
+            <Link href={siteConfig.hero.ctaSecondary.href}>
+              {siteConfig.hero.ctaSecondary.label}
+            </Link>
+          </Button>
+        </div>
+
+        {/* Social proof */}
+        <p className="mt-8 text-sm text-muted-foreground">
+          Sin tarjeta de crédito &middot; Cancelá cuando quieras &middot; Soporte en español
+        </p>
+
+        {/* App mockup placeholder */}
+        <div className="mx-auto mt-16 max-w-4xl overflow-hidden rounded-xl border bg-muted/50 shadow-2xl">
+          <div className="flex h-8 items-center gap-2 border-b bg-muted px-4">
+            <div className="size-3 rounded-full bg-red-400" />
+            <div className="size-3 rounded-full bg-yellow-400" />
+            <div className="size-3 rounded-full bg-green-400" />
+            <div className="mx-2 h-4 flex-1 rounded bg-muted-foreground/20" />
+          </div>
+          <div className="grid grid-cols-[200px_1fr] divide-x" style={{ minHeight: 320 }}>
+            <div className="space-y-2 bg-card p-4">
+              {[...Array(6)].map((_, i) => (
+                <div key={i} className="h-7 rounded-md bg-muted" />
+              ))}
+            </div>
+            <div className="space-y-4 p-6">
+              <div className="grid grid-cols-3 gap-3">
+                {[...Array(3)].map((_, i) => (
+                  <div key={i} className="h-20 rounded-lg border bg-card" />
+                ))}
+              </div>
+              <div className="h-40 rounded-lg border bg-card" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}

package/templates/frontend/src/components/landing/navbar.tsx

@@ -1,78 +1,78 @@
-'use client'
-
-import Link from 'next/link'
-import { useState } from 'react'
-import { Menu, X } from 'lucide-react'
-import { siteConfig } from '@/config/site'
-import { Button } from '@/components/ui/button'
-
-export function LandingNavbar() {
-  const [open, setOpen] = useState(false)
-
-  return (
-    <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
-      <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-4">
-        <Link href="/" className="text-lg font-bold tracking-tight">
-          {siteConfig.name}
-        </Link>
-
-        {/* Desktop nav */}
-        <nav className="hidden items-center gap-6 md:flex">
-          {siteConfig.nav.links.map((link) => (
-            <Link
-              key={link.href}
-              href={link.href}
-              className="text-sm text-muted-foreground transition-colors hover:text-foreground"
-            >
-              {link.label}
-            </Link>
-          ))}
-        </nav>
-
-        <div className="hidden items-center gap-2 md:flex">
-          <Button variant="ghost" asChild size="sm">
-            <Link href="/login">Iniciar sesión</Link>
-          </Button>
-          <Button asChild size="sm">
-            <Link href="/register">Empezar gratis</Link>
-          </Button>
-        </div>
-
-        {/* Mobile toggle */}
-        <button
-          className="md:hidden"
-          onClick={() => setOpen((v) => !v)}
-          aria-label="Menú"
-        >
-          {open ? <X className="size-5" /> : <Menu className="size-5" />}
-        </button>
-      </div>
-
-      {/* Mobile menu */}
-      {open && (
-        <div className="border-t bg-background px-4 pb-4 md:hidden">
-          <nav className="flex flex-col gap-3 pt-4">
-            {siteConfig.nav.links.map((link) => (
-              <Link
-                key={link.href}
-                href={link.href}
-                className="text-sm text-muted-foreground"
-                onClick={() => setOpen(false)}
-              >
-                {link.label}
-              </Link>
-            ))}
-            <div className="mt-2 flex flex-col gap-2">
-              <Button variant="outline" asChild>
-                <Link href="/login">Iniciar sesión</Link>
-              </Button>
-              <Button asChild>
-                <Link href="/register">Empezar gratis</Link>
-              </Button>
-            </div>
-          </nav>
-        </div>
-      )}
-    </header>
-  )
-}
+'use client'
+
+import Link from 'next/link'
+import { useState } from 'react'
+import { Menu, X } from 'lucide-react'
+import { siteConfig } from '@/config/site'
+import { Button } from '@/components/ui/button'
+
+export function LandingNavbar() {
+  const [open, setOpen] = useState(false)
+
+  return (
+    <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-4">
+        <Link href="/" className="text-lg font-bold tracking-tight">
+          {siteConfig.name}
+        </Link>
+
+        {/* Desktop nav */}
+        <nav className="hidden items-center gap-6 md:flex">
+          {siteConfig.nav.links.map((link) => (
+            <Link
+              key={link.href}
+              href={link.href}
+              className="text-sm text-muted-foreground transition-colors hover:text-foreground"
+            >
+              {link.label}
+            </Link>
+          ))}
+        </nav>
+
+        <div className="hidden items-center gap-2 md:flex">
+          <Button variant="ghost" asChild size="sm">
+            <Link href="/login">Iniciar sesión</Link>
+          </Button>
+          <Button asChild size="sm">
+            <Link href="/register">Empezar gratis</Link>
+          </Button>
+        </div>
+
+        {/* Mobile toggle */}
+        <button
+          className="md:hidden"
+          onClick={() => setOpen((v) => !v)}
+          aria-label="Menú"
+        >
+          {open ? <X className="size-5" /> : <Menu className="size-5" />}
+        </button>
+      </div>
+
+      {/* Mobile menu */}
+      {open && (
+        <div className="border-t bg-background px-4 pb-4 md:hidden">
+          <nav className="flex flex-col gap-3 pt-4">
+            {siteConfig.nav.links.map((link) => (
+              <Link
+                key={link.href}
+                href={link.href}
+                className="text-sm text-muted-foreground"
+                onClick={() => setOpen(false)}
+              >
+                {link.label}
+              </Link>
+            ))}
+            <div className="mt-2 flex flex-col gap-2">
+              <Button variant="outline" asChild>
+                <Link href="/login">Iniciar sesión</Link>
+              </Button>
+              <Button asChild>
+                <Link href="/register">Empezar gratis</Link>
+              </Button>
+            </div>
+          </nav>
+        </div>
+      )}
+    </header>
+  )
+}

package/templates/frontend/src/components/landing/pricing.tsx

@@ -1,90 +1,90 @@
-import Link from 'next/link'
-import { Check } from 'lucide-react'
-import { siteConfig } from '@/config/site'
-import { Button } from '@/components/ui/button'
-import { Badge } from '@/components/ui/badge'
-import { cn } from '@/lib/utils'
-
-export function LandingPricing() {
-  return (
-    <section id="pricing" className="py-20 md:py-28">
-      <div className="mx-auto max-w-6xl px-4">
-        <div className="mx-auto max-w-2xl text-center">
-          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
-            Precios claros y sin sorpresas
-          </h2>
-          <p className="mt-4 text-muted-foreground">
-            Elegí el plan que mejor se adapte a tu equipo. Cambiá cuando quieras.
-          </p>
-        </div>
-
-        <div className="mt-16 grid gap-8 md:grid-cols-3">
-          {siteConfig.pricing.map((plan) => (
-            <div
-              key={plan.name}
-              className={cn(
-                'relative flex flex-col rounded-xl border p-8',
-                plan.highlight
-                  ? 'border-primary bg-primary text-primary-foreground shadow-lg'
-                  : 'bg-card',
-              )}
-            >
-              {plan.highlight && (
-                <Badge className="absolute -top-3 left-1/2 -translate-x-1/2 bg-background text-foreground shadow">
-                  Más popular
-                </Badge>
-              )}
-
-              <div>
-                <h3 className="text-lg font-semibold">{plan.name}</h3>
-                <p
-                  className={cn(
-                    'mt-1 text-sm',
-                    plan.highlight ? 'text-primary-foreground/80' : 'text-muted-foreground',
-                  )}
-                >
-                  {plan.description}
-                </p>
-                <div className="mt-4 flex items-end gap-1">
-                  <span className="text-4xl font-bold">{plan.price}</span>
-                  {plan.period && (
-                    <span
-                      className={cn(
-                        'mb-1 text-sm',
-                        plan.highlight ? 'text-primary-foreground/70' : 'text-muted-foreground',
-                      )}
-                    >
-                      {plan.period}
-                    </span>
-                  )}
-                </div>
-              </div>
-
-              <ul className="my-8 flex-1 space-y-3">
-                {plan.features.map((f) => (
-                  <li key={f} className="flex items-center gap-3 text-sm">
-                    <Check
-                      className={cn(
-                        'size-4 shrink-0',
-                        plan.highlight ? 'text-primary-foreground' : 'text-primary',
-                      )}
-                    />
-                    {f}
-                  </li>
-                ))}
-              </ul>
-
-              <Button
-                asChild
-                variant={plan.highlight ? 'secondary' : 'outline'}
-                className="w-full"
-              >
-                <Link href={plan.href}>{plan.cta}</Link>
-              </Button>
-            </div>
-          ))}
-        </div>
-      </div>
-    </section>
-  )
-}
+import Link from 'next/link'
+import { Check } from 'lucide-react'
+import { siteConfig } from '@/config/site'
+import { Button } from '@/components/ui/button'
+import { Badge } from '@/components/ui/badge'
+import { cn } from '@/lib/utils'
+
+export function LandingPricing() {
+  return (
+    <section id="pricing" className="py-20 md:py-28">
+      <div className="mx-auto max-w-6xl px-4">
+        <div className="mx-auto max-w-2xl text-center">
+          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
+            Precios claros y sin sorpresas
+          </h2>
+          <p className="mt-4 text-muted-foreground">
+            Elegí el plan que mejor se adapte a tu equipo. Cambiá cuando quieras.
+          </p>
+        </div>
+
+        <div className="mt-16 grid gap-8 md:grid-cols-3">
+          {siteConfig.pricing.map((plan) => (
+            <div
+              key={plan.name}
+              className={cn(
+                'relative flex flex-col rounded-xl border p-8',
+                plan.highlight
+                  ? 'border-primary bg-primary text-primary-foreground shadow-lg'
+                  : 'bg-card',
+              )}
+            >
+              {plan.highlight && (
+                <Badge className="absolute -top-3 left-1/2 -translate-x-1/2 bg-background text-foreground shadow">
+                  Más popular
+                </Badge>
+              )}
+
+              <div>
+                <h3 className="text-lg font-semibold">{plan.name}</h3>
+                <p
+                  className={cn(
+                    'mt-1 text-sm',
+                    plan.highlight ? 'text-primary-foreground/80' : 'text-muted-foreground',
+                  )}
+                >
+                  {plan.description}
+                </p>
+                <div className="mt-4 flex items-end gap-1">
+                  <span className="text-4xl font-bold">{plan.price}</span>
+                  {plan.period && (
+                    <span
+                      className={cn(
+                        'mb-1 text-sm',
+                        plan.highlight ? 'text-primary-foreground/70' : 'text-muted-foreground',
+                      )}
+                    >
+                      {plan.period}
+                    </span>
+                  )}
+                </div>
+              </div>
+
+              <ul className="my-8 flex-1 space-y-3">
+                {plan.features.map((f) => (
+                  <li key={f} className="flex items-center gap-3 text-sm">
+                    <Check
+                      className={cn(
+                        'size-4 shrink-0',
+                        plan.highlight ? 'text-primary-foreground' : 'text-primary',
+                      )}
+                    />
+                    {f}
+                  </li>
+                ))}
+              </ul>
+
+              <Button
+                asChild
+                variant={plan.highlight ? 'secondary' : 'outline'}
+                className="w-full"
+              >
+                <Link href={plan.href}>{plan.cta}</Link>
+              </Button>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  )
+}