mirror of
https://github.com/johndoe6345789/low-code-react-app-b.git
synced 2026-05-01 00:54: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>
70 lines
1.7 KiB
TypeScript
70 lines
1.7 KiB
TypeScript
import { cn } from '@/lib/utils'
|
|
|
|
interface SelectOption {
|
|
value: string
|
|
label: string
|
|
disabled?: boolean
|
|
}
|
|
|
|
interface SelectProps {
|
|
value: string
|
|
onChange: (value: string) => void
|
|
options: SelectOption[]
|
|
label?: string
|
|
placeholder?: string
|
|
error?: boolean
|
|
helperText?: string
|
|
disabled?: boolean
|
|
className?: string
|
|
}
|
|
|
|
export function Select({
|
|
value,
|
|
onChange,
|
|
options,
|
|
label,
|
|
placeholder = 'Select an option',
|
|
error,
|
|
helperText,
|
|
disabled,
|
|
className,
|
|
}: SelectProps) {
|
|
return (
|
|
<div className={cn('w-full', className)}>
|
|
{label && (
|
|
<label className="block text-sm font-medium mb-1.5 text-foreground">
|
|
{label}
|
|
</label>
|
|
)}
|
|
<select
|
|
value={value}
|
|
onChange={(e) => onChange(e.target.value)}
|
|
disabled={disabled}
|
|
className={cn(
|
|
'flex h-10 w-full rounded-md border bg-background px-3 py-2 text-sm',
|
|
'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring',
|
|
'disabled:cursor-not-allowed disabled:opacity-50',
|
|
'transition-colors',
|
|
error ? 'border-destructive focus-visible:ring-destructive' : 'border-input'
|
|
)}
|
|
>
|
|
{placeholder && (
|
|
<option value="" disabled>
|
|
{placeholder}
|
|
</option>
|
|
)}
|
|
{options.map((option) => (
|
|
<option key={option.value} value={option.value} disabled={option.disabled}>
|
|
{option.label}
|
|
</option>
|
|
))}
|
|
</select>
|
|
{helperText && (
|
|
<p className={cn('text-xs mt-1.5', error ? 'text-destructive' : 'text-muted-foreground')}>
|
|
{helperText}
|
|
</p>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|