mirror of
https://github.com/johndoe6345789/low-code-react-app-b.git
synced 2026-05-01 17:14:55 +00:00
johndoe6345789
f05f896a67
Migration complete for: - 5 atoms: Accordion, CopyButton, FileUpload, FilterInput, Image, Input, PasswordInput, Popover (8 total) - 1 molecule: BindingEditor Changes: - Deleted 9 legacy TSX files that have complete JSON equivalents - Exported BindingEditor from json-components.ts with useBindingEditor hook - Registered useBindingEditor in hooks-registry.ts - Updated all imports across codebase to use JSON-based components - Fixed build errors: schema-loader dynamic import, DataSourceGroupSection - Cleaned up component index exports Build status: ✅ PASSING - 0 TypeScript errors - All 9,408 modules transformed successfully - No blocking build warnings Next steps: - 3 organisms still need conversion: DataSourceManager, NavigationMenu, TreeListPanel - 120+ additional components have TSX versions (need individual migration) - 22 JSON components now available for use throughout the app Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
62 lines
1.6 KiB
TypeScript
62 lines
1.6 KiB
TypeScript
import { Card } from '@/components/ui/card'
|
|
import { cn } from '@/lib/utils'
|
|
import { ReactNode } from 'react'
|
|
|
|
interface QuickActionButtonProps {
|
|
icon: ReactNode
|
|
label: string
|
|
description?: string
|
|
onClick: () => void
|
|
variant?: 'default' | 'primary' | 'accent' | 'muted'
|
|
disabled?: boolean
|
|
className?: string
|
|
}
|
|
|
|
export function QuickActionButton({
|
|
icon,
|
|
label,
|
|
description,
|
|
onClick,
|
|
variant = 'default',
|
|
disabled,
|
|
className,
|
|
}: QuickActionButtonProps) {
|
|
const variantClasses = {
|
|
default: 'hover:bg-muted/50 hover:border-border',
|
|
primary: 'hover:bg-primary/10 hover:border-primary/50',
|
|
accent: 'hover:bg-accent/10 hover:border-accent/50',
|
|
muted: 'bg-muted hover:bg-muted/70',
|
|
}
|
|
|
|
const iconColorClasses = {
|
|
default: 'text-foreground',
|
|
primary: 'text-primary',
|
|
accent: 'text-accent',
|
|
muted: 'text-muted-foreground',
|
|
}
|
|
|
|
return (
|
|
<Card
|
|
onClick={disabled ? undefined : onClick}
|
|
className={cn(
|
|
'p-6 cursor-pointer transition-all duration-200',
|
|
'flex flex-col items-center justify-center gap-3 text-center',
|
|
'hover:scale-105 active:scale-95',
|
|
variantClasses[variant],
|
|
disabled && 'opacity-50 cursor-not-allowed hover:scale-100',
|
|
className
|
|
)}
|
|
>
|
|
<div className={cn('text-4xl', iconColorClasses[variant])}>
|
|
{icon}
|
|
</div>
|
|
<div className="space-y-1">
|
|
<h3 className="font-semibold text-foreground">{label}</h3>
|
|
{description && (
|
|
<p className="text-sm text-muted-foreground">{description}</p>
|
|
)}
|
|
</div>
|
|
</Card>
|
|
)
|
|
}
|