36 lines
1.0 KiB
JavaScript
36 lines
1.0 KiB
JavaScript
import { Select, SelectItem } from '@nextui-org/react'
|
|
import styles from './QSelect.module.css'
|
|
import { useEffect } from 'react'
|
|
|
|
const animals = [
|
|
{ key: 'cat', label: 'Cat' },
|
|
{ key: 'dog', label: 'Dog' },
|
|
{ key: 'elephant', label: 'Elephant' },
|
|
{ key: 'lion', label: 'Lion' },
|
|
{ key: 'tiger', label: 'Tiger' },
|
|
{ key: 'giraffe', label: 'Giraffe' },
|
|
{ key: 'dolphin', label: 'Dolphin' },
|
|
{ key: 'penguin', label: 'Penguin' },
|
|
{ key: 'zebra', label: 'Zebra' },
|
|
{ key: 'shark', label: 'Shark' },
|
|
{ key: 'whale', label: 'Whale' },
|
|
{ key: 'otter', label: 'Otter' },
|
|
{ key: 'crocodile', label: 'Crocodile' },
|
|
]
|
|
|
|
export default function QSelect() {
|
|
useEffect(() => {}, [])
|
|
return (
|
|
<>
|
|
<div className="flex w-full flex-wrap md:flex-nowrap gap-4">
|
|
<Select label="Select an animal" className="max-w-xs">
|
|
{animals.map((animal) => (
|
|
<SelectItem key={animal.key}>{animal.label}</SelectItem>
|
|
))}
|
|
</Select>
|
|
</div>
|
|
<div className={styles.test}>test</div>
|
|
</>
|
|
)
|
|
}
|