Add components for Act management and integrate Electron setup
This commit is contained in:
39
components/form/TextInput.tsx
Normal file
39
components/form/TextInput.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import React, {ChangeEvent} from "react";
|
||||
|
||||
interface TextInputProps {
|
||||
value: string;
|
||||
setValue?: (e: ChangeEvent<HTMLInputElement>) => void;
|
||||
placeholder?: string;
|
||||
readOnly?: boolean;
|
||||
disabled?: boolean;
|
||||
onFocus?: () => void;
|
||||
}
|
||||
|
||||
export default function TextInput(
|
||||
{
|
||||
value,
|
||||
setValue,
|
||||
placeholder,
|
||||
readOnly = false,
|
||||
disabled = false,
|
||||
onFocus
|
||||
}: TextInputProps) {
|
||||
return (
|
||||
<input
|
||||
type="text"
|
||||
value={value}
|
||||
onChange={setValue}
|
||||
readOnly={readOnly}
|
||||
disabled={disabled}
|
||||
placeholder={placeholder}
|
||||
onFocus={onFocus}
|
||||
className={`w-full bg-secondary/50 text-text-primary px-4 py-2.5 rounded-xl border border-secondary/50
|
||||
focus:border-primary focus:ring-4 focus:ring-primary/20 focus:bg-secondary
|
||||
hover:bg-secondary hover:border-secondary
|
||||
placeholder:text-muted/60
|
||||
outline-none transition-all duration-200
|
||||
${disabled ? 'opacity-50 cursor-not-allowed' : ''}
|
||||
${readOnly ? 'cursor-default' : ''}`}
|
||||
/>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user