33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
import { useState } from 'react';
|
|
import { ComboBox } from '@common/components/ui/ComboBox';
|
|
|
|
const Section = ({ title, desc, children }: { title: string; desc?: string; children: React.ReactNode }) => (
|
|
<div className="mb-8">
|
|
<h2 className="wing-section-header mb-1">{title}</h2>
|
|
{desc && <p className="wing-section-desc mb-4">{desc}</p>}
|
|
<div>{children}</div>
|
|
</div>
|
|
);
|
|
|
|
const OPTIONS = [
|
|
{ value: 'prediction', label: '확산 예측' },
|
|
{ value: 'hns', label: 'HNS 분석' },
|
|
{ value: 'aerial', label: '항공 방제' },
|
|
{ value: 'weather', label: '해양 기상' },
|
|
{ value: 'scat', label: 'SCAT 조사' },
|
|
];
|
|
|
|
const ComboBoxSection = () => {
|
|
const [value, setValue] = useState('prediction');
|
|
return (
|
|
<Section title="ComboBox" desc="검색 가능한 드롭다운 선택">
|
|
<div className="max-w-[240px]">
|
|
<ComboBox value={value} onChange={setValue} options={OPTIONS} placeholder="기능 선택..." />
|
|
</div>
|
|
<p className="wing-meta text-text-3 mt-2">선택값: {value}</p>
|
|
</Section>
|
|
);
|
|
};
|
|
|
|
export default ComboBoxSection;
|