mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-26 23:04:57 +00:00
johndoe6345789
54a819ed71
ORGANIZED INTO 4 MAIN CATEGORIES: - react/ React TypeScript components (145 components + Python bindings) - qml/ QML desktop components (104+ QML components) - python/ Python package implementations - legacy/ Utilities, contexts, and migration-in-progress code SUPPORTING FOLDERS (kept as-is): - icons/ 421 SVG icons - theming/ Material Design 3 theme system - styles/ SCSS modules and utilities - scss/ SCSS preprocessor files - docs/ Documentation files STRUCTURE IMPROVEMENTS: ✅ All code preserved (nothing deleted) ✅ Clear separation by implementation type ✅ Better navigation and discoverability ✅ Easy to find what you need ✅ Professional organization DOCUMENTATION: - Added STRUCTURE.md explaining the new layout - Updated folder organization with clear purpose - Maintained all original functionality All files reorganized while keeping full functionality intact. Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
52 lines
1.2 KiB
TypeScript
52 lines
1.2 KiB
TypeScript
import React from 'react'
|
|
|
|
export interface FormFieldProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
children?: React.ReactNode
|
|
label?: string
|
|
helperText?: string
|
|
error?: boolean
|
|
errorMessage?: string
|
|
required?: boolean
|
|
disabled?: boolean
|
|
fullWidth?: boolean
|
|
}
|
|
|
|
/**
|
|
* FormField wraps form inputs with label, helper text, and error handling
|
|
* Compatible with declarative package rendering
|
|
*/
|
|
export const FormField: React.FC<FormFieldProps> = ({
|
|
children,
|
|
label,
|
|
helperText,
|
|
error,
|
|
errorMessage,
|
|
required,
|
|
disabled,
|
|
fullWidth,
|
|
className = '',
|
|
...props
|
|
}) => (
|
|
<div
|
|
className={`form-field ${error ? 'form-field--error' : ''} ${disabled ? 'form-field--disabled' : ''} ${fullWidth ? 'form-field--full-width' : ''} ${className}`}
|
|
{...props}
|
|
>
|
|
{label && (
|
|
<label className="form-field__label">
|
|
{label}
|
|
{required && <span className="form-field__required">*</span>}
|
|
</label>
|
|
)}
|
|
<div className="form-field__control">
|
|
{children}
|
|
</div>
|
|
{(helperText || errorMessage) && (
|
|
<div className={`form-field__helper ${error ? 'form-field__helper--error' : ''}`}>
|
|
{error ? errorMessage : helperText}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
|
|
export default FormField
|