56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
'use client';
|
|
|
|
import { Checkbox } from '@/components/ui/checkbox';
|
|
import {
|
|
Select, SelectContent, SelectItem, SelectTrigger, SelectValue,
|
|
} from '@/components/ui/select';
|
|
import type { FieldConfig } from '@/types/invyone-component';
|
|
|
|
interface CheckboxFieldProps {
|
|
field: FieldConfig;
|
|
value: any;
|
|
onChange: (value: any) => void;
|
|
mode: 'form' | 'search';
|
|
disabled?: boolean;
|
|
error?: string;
|
|
}
|
|
|
|
export function CheckboxField({ field, value, onChange, mode, disabled, error }: CheckboxFieldProps) {
|
|
if (mode === 'search') {
|
|
// 검색: Select (전체/✓/✗)
|
|
return (
|
|
<Select
|
|
value={value === true ? 'true' : value === false ? 'false' : ''}
|
|
onValueChange={(v) => {
|
|
if (v === 'true') onChange(true);
|
|
else if (v === 'false') onChange(false);
|
|
else onChange(undefined);
|
|
}}
|
|
disabled={disabled}
|
|
>
|
|
<SelectTrigger className={`h-7 text-xs ${error ? 'border-destructive' : ''}`}>
|
|
<SelectValue placeholder="전체" />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="all" className="text-xs">전체</SelectItem>
|
|
<SelectItem value="true" className="text-xs">✓</SelectItem>
|
|
<SelectItem value="false" className="text-xs">✗</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
);
|
|
}
|
|
|
|
// 폼: 체크박스
|
|
const checked = value === true || value === 'true' || value === 't';
|
|
return (
|
|
<div className="flex items-center gap-2 h-7">
|
|
<Checkbox
|
|
checked={checked}
|
|
onCheckedChange={(c) => onChange(c === true)}
|
|
disabled={disabled}
|
|
/>
|
|
<span className="text-xs text-[var(--v5-text-sec)]">{field.label}</span>
|
|
</div>
|
|
);
|
|
}
|