@create-lft-app/cli 1.0.14 → 1.1.0

package/templates/app/dashboard/page.tsx

@@ -1,102 +0,0 @@
-import { Header } from "@/components/layout/header"
-import { Widget, WidgetGrid } from "@/components/dashboard/widget"
-import {
-  Users,
-  DollarSign,
-  Activity,
-  TrendingUp,
-  Building2,
-  FileText,
-  AlertCircle,
-  CheckCircle,
-} from "lucide-react"
-
-export default function DashboardPage() {
-  return (
-    <>
-      <Header title="Dashboard" />
-      <main className="flex-1 p-6">
-        <div className="space-y-6">
-          <div>
-            <h2 className="text-2xl font-bold tracking-tight">
-              Bienvenido de vuelta
-            </h2>
-            <p className="text-muted-foreground">
-              Aquí está el resumen de tu actividad
-            </p>
-          </div>
-
-          <WidgetGrid>
-            <Widget
-              title="Usuarios Activos"
-              icon={<Users className="h-4 w-4" />}
-              value="1,234"
-              subValue="usuarios registrados"
-              trend={{ value: 12.5, positive: true }}
-              href="/admin/users"
-            />
-            <Widget
-              title="Ingresos"
-              icon={<DollarSign className="h-4 w-4" />}
-              value="$45,231"
-              subValue="este mes"
-              trend={{ value: 8.2, positive: true }}
-              variant="success"
-            />
-            <Widget
-              title="Organizaciones"
-              icon={<Building2 className="h-4 w-4" />}
-              value="89"
-              subValue="organizaciones activas"
-              trend={{ value: 3.1, positive: true }}
-              href="/admin/organizations"
-            />
-            <Widget
-              title="Actividad"
-              icon={<Activity className="h-4 w-4" />}
-              value="2,345"
-              subValue="eventos hoy"
-              trend={{ value: 5.4, positive: true }}
-            />
-          </WidgetGrid>
-
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-            <WidgetGrid>
-              <Widget
-                title="Documentos Pendientes"
-                icon={<FileText className="h-4 w-4" />}
-                value="23"
-                subValue="requieren revisión"
-                variant="warning"
-              />
-              <Widget
-                title="Alertas"
-                icon={<AlertCircle className="h-4 w-4" />}
-                value="5"
-                subValue="alertas activas"
-                variant="danger"
-              />
-            </WidgetGrid>
-
-            <WidgetGrid>
-              <Widget
-                title="Tareas Completadas"
-                icon={<CheckCircle className="h-4 w-4" />}
-                value="156"
-                subValue="esta semana"
-                variant="success"
-              />
-              <Widget
-                title="Crecimiento"
-                icon={<TrendingUp className="h-4 w-4" />}
-                value="+24%"
-                subValue="vs mes anterior"
-                trend={{ value: 24, positive: true }}
-              />
-            </WidgetGrid>
-          </div>
-        </div>
-      </main>
-    </>
-  )
-}

package/templates/app/globals.css

@@ -1,249 +0,0 @@
-@import "tailwindcss";
-@import "tw-animate-css";
-
-@custom-variant dark (&:is(.dark *));
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-  --color-sidebar-ring: var(--sidebar-ring);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar: var(--sidebar);
-  --color-chart-5: var(--chart-5);
-  --color-chart-4: var(--chart-4);
-  --color-chart-3: var(--chart-3);
-  --color-chart-2: var(--chart-2);
-  --color-chart-1: var(--chart-1);
-  --color-ring: var(--ring);
-  --color-input: var(--input);
-  --color-border: var(--border);
-  --color-destructive: var(--destructive);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-accent: var(--accent);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-muted: var(--muted);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-secondary: var(--secondary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-primary: var(--primary);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-popover: var(--popover);
-  --color-card-foreground: var(--card-foreground);
-  --color-card: var(--card);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-2xl: calc(var(--radius) + 8px);
-  --radius-3xl: calc(var(--radius) + 12px);
-  --radius-4xl: calc(var(--radius) + 16px);
-}
-
-/* ========================================
-   MIDDAY DESIGN SYSTEM - Color Palette
-   ======================================== */
-
-:root {
-  --radius: 0.5rem;
-
-  /* Midday Dark Theme - Pure blacks (DEFAULT) */
-  --background: hsl(0 0% 5%);
-  --foreground: hsl(0 0% 98%);
-
-  --card: hsl(0 0% 7%);
-  --card-foreground: hsl(0 0% 98%);
-
-  --popover: hsl(0 0% 4%);
-  --popover-foreground: hsl(0 0% 98%);
-
-  --primary: hsl(0 0% 98%);
-  --primary-foreground: hsl(0 0% 9%);
-
-  --secondary: hsl(0 0% 11%);
-  --secondary-foreground: hsl(0 0% 98%);
-
-  --muted: hsl(0 0% 11%);
-  --muted-foreground: hsl(0 0% 64%);
-
-  --accent: hsl(0 0% 11%);
-  --accent-foreground: hsl(0 0% 98%);
-
-  --destructive: hsl(0 63% 31%);
-  --destructive-foreground: hsl(0 0% 98%);
-
-  --border: hsl(0 0% 11%);
-  --input: hsl(0 0% 15%);
-  --ring: hsl(0 0% 83%);
-
-  /* Chart colors dark */
-  --chart-1: hsl(220 70% 50%);
-  --chart-2: hsl(160 60% 45%);
-  --chart-3: hsl(30 80% 55%);
-  --chart-4: hsl(280 65% 60%);
-  --chart-5: hsl(340 75% 55%);
-
-  /* Sidebar dark */
-  --sidebar: hsl(0 0% 7%);
-  --sidebar-foreground: hsl(0 0% 98%);
-  --sidebar-primary: hsl(0 0% 98%);
-  --sidebar-primary-foreground: hsl(0 0% 9%);
-  --sidebar-accent: hsl(0 0% 11%);
-  --sidebar-accent-foreground: hsl(0 0% 98%);
-  --sidebar-border: hsl(0 0% 11%);
-  --sidebar-ring: hsl(0 0% 83%);
-}
-
-.light {
-  /* Midday Light Theme - Warm beige/neutral palette */
-  --background: hsl(0 0% 100%);
-  --foreground: hsl(0 0% 7%);
-
-  --card: hsl(45 18% 96%);
-  --card-foreground: hsl(0 0% 4%);
-
-  --popover: hsl(0 0% 100%);
-  --popover-foreground: hsl(0 0% 4%);
-
-  --primary: hsl(240 6% 10%);
-  --primary-foreground: hsl(0 0% 98%);
-
-  --secondary: hsl(40 11% 89%);
-  --secondary-foreground: hsl(0 0% 9%);
-
-  --muted: hsl(40 11% 89%);
-  --muted-foreground: hsl(0 0% 38%);
-
-  --accent: hsl(40 10% 94%);
-  --accent-foreground: hsl(0 0% 9%);
-
-  --destructive: hsl(0 84% 60%);
-  --destructive-foreground: hsl(0 0% 98%);
-
-  --border: hsl(45 5% 85%);
-  --input: hsl(0 0% 90%);
-  --ring: hsl(0 0% 4%);
-
-  /* Chart colors */
-  --chart-1: hsl(12 76% 61%);
-  --chart-2: hsl(173 58% 39%);
-  --chart-3: hsl(197 37% 24%);
-  --chart-4: hsl(43 74% 66%);
-  --chart-5: hsl(27 87% 67%);
-
-  /* Sidebar - Midday style */
-  --sidebar: hsl(0 0% 99%);
-  --sidebar-foreground: hsl(0 0% 7%);
-  --sidebar-primary: hsl(240 6% 10%);
-  --sidebar-primary-foreground: hsl(0 0% 98%);
-  --sidebar-accent: hsl(40 10% 97%);
-  --sidebar-accent-foreground: hsl(0 0% 9%);
-  --sidebar-border: hsl(45 5% 85%);
-  --sidebar-ring: hsl(0 0% 4%);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}
-
-/* ========================================
-   MIDDAY UTILITIES
-   ======================================== */
-
-/* Scrollbar hide utility */
-.scrollbar-hide {
-  -ms-overflow-style: none;
-  scrollbar-width: none;
-}
-.scrollbar-hide::-webkit-scrollbar {
-  display: none;
-}
-
-/* ========================================
-   MIDDAY ANIMATIONS
-   ======================================== */
-
-@keyframes shimmer {
-  0% {
-    transform: translateX(-100%);
-  }
-  100% {
-    transform: translateX(100%);
-  }
-}
-
-@keyframes accordion-down {
-  from {
-    height: 0;
-  }
-  to {
-    height: var(--radix-accordion-content-height);
-  }
-}
-
-@keyframes accordion-up {
-  from {
-    height: var(--radix-accordion-content-height);
-  }
-  to {
-    height: 0;
-  }
-}
-
-@keyframes dialog-overlay-show {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes dialog-content-show {
-  from {
-    opacity: 0;
-    transform: translate(-50%, -50%) scale(0.97);
-  }
-  to {
-    opacity: 1;
-    transform: translate(-50%, -50%) scale(1);
-  }
-}
-
-@keyframes caret-blink {
-  0%, 70%, 100% {
-    opacity: 1;
-  }
-  20%, 50% {
-    opacity: 0;
-  }
-}
-
-/* Loading ellipsis animation */
-@keyframes loading-ellipsis {
-  0% { content: ''; }
-  25% { content: '.'; }
-  50% { content: '..'; }
-  75% { content: '...'; }
-}
-
-.loading-ellipsis::after {
-  content: '';
-  animation: loading-ellipsis 1.5s infinite;
-}
-
-/* Animate shimmer class */
-.animate-shimmer {
-  animation: shimmer 2.5s linear infinite;
-}

package/templates/app/layout.tsx

@@ -1,40 +0,0 @@
-import type { Metadata } from "next"
-import { Inter } from "next/font/google"
-import "./globals.css"
-import { SidebarProvider, SidebarInset } from "@/components/ui/sidebar"
-import { AdminSidebar } from "@/components/layout/admin-sidebar"
-import { Toaster } from "@/components/ui/sonner"
-
-const inter = Inter({ subsets: ["latin"] })
-
-export const metadata: Metadata = {
-  title: "Dashboard - LFT App",
-  description: "Panel de administración creado con create-lft-app",
-}
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode
-}) {
-  // Usuario de ejemplo - en producción esto vendría de Supabase Auth
-  const user = {
-    email: "admin@ejemplo.com",
-    full_name: "Admin Usuario",
-    role: "Super Admin",
-  }
-
-  return (
-    <html lang="es" className="dark" suppressHydrationWarning>
-      <body className={`${inter.className} font-sans antialiased`}>
-        <SidebarProvider>
-          <AdminSidebar user={user} />
-          <SidebarInset>
-            {children}
-          </SidebarInset>
-        </SidebarProvider>
-        <Toaster />
-      </body>
-    </html>
-  )
-}

package/templates/app/page.tsx

@@ -1,5 +0,0 @@
-import { redirect } from "next/navigation"
-
-export default function Home() {
-  redirect("/dashboard")
-}

package/templates/components/dashboard/widget.tsx

@@ -1,113 +0,0 @@
-'use client'
-
-import { cn } from '@/lib/utils'
-import Link from 'next/link'
-
-interface WidgetProps {
-	title: string
-	icon: React.ReactNode
-	description?: string
-	value: string | number
-	subValue?: string
-	href?: string
-	trend?: {
-		value: number
-		positive?: boolean
-	}
-	variant?: 'default' | 'warning' | 'danger' | 'success'
-	children?: React.ReactNode
-}
-
-export function Widget({
-	title,
-	icon,
-	description,
-	value,
-	subValue,
-	href,
-	trend,
-	variant = 'default',
-	children,
-}: WidgetProps) {
-	const content = (
-		<div
-			className={cn(
-				'bg-background border border-border p-4 h-[180px] flex flex-col justify-between transition-all duration-200',
-				href && 'cursor-pointer hover:bg-accent/50 hover:border-border/80',
-			)}
-		>
-			<div>
-				<div className="flex items-center gap-2 mb-3">
-					<span className="text-[#606060]">{icon}</span>
-					<h3 className="text-xs text-[#606060] font-medium uppercase tracking-wide">{title}</h3>
-				</div>
-
-				{description && (
-					<p className="text-sm text-[#878787]">{description}</p>
-				)}
-			</div>
-
-			<div>
-				{children ? (
-					children
-				) : (
-					<div className="flex flex-col gap-1">
-						<div className="flex items-baseline gap-2">
-							<span
-								className={cn(
-									'text-3xl font-medium tabular-nums',
-									variant === 'danger' && 'text-destructive',
-									variant === 'warning' && 'text-yellow-500',
-									variant === 'success' && 'text-green-500',
-								)}
-							>
-								{value}
-							</span>
-							{trend && (
-								<span
-									className={cn(
-										'text-xs',
-										trend.positive ? 'text-green-500' : 'text-destructive'
-									)}
-								>
-									{trend.positive ? '+' : ''}{trend.value}%
-								</span>
-							)}
-						</div>
-						{subValue && (
-							<span className="text-xs text-[#878787]">{subValue}</span>
-						)}
-					</div>
-				)}
-
-				{href && (
-					<span className="text-xs text-[#878787] group-hover:text-foreground transition-colors mt-2 block">
-						Ver más →
-					</span>
-				)}
-			</div>
-		</div>
-	)
-
-	if (href) {
-		return (
-			<Link href={href} className="group">
-				{content}
-			</Link>
-		)
-	}
-
-	return content
-}
-
-interface WidgetGridProps {
-	children: React.ReactNode
-}
-
-export function WidgetGrid({ children }: WidgetGridProps) {
-	return (
-		<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
-			{children}
-		</div>
-	)
-}