Select

import {
	Select,
	SelectContent,
	SelectGroup,
	SelectItem,
	SelectLabel,
	SelectSeparator,
	SelectTrigger,
	SelectValue,
} from "@ngrok/mantle";

<Select>
	<SelectTrigger className="w-[180px]">
		<SelectValue placeholder="Select a fruit" />
	</SelectTrigger>
	<SelectContent>
		<SelectGroup>
			<SelectLabel>Fruits</SelectLabel>
			<SelectItem value="apple">Apple</SelectItem>
			<SelectItem value="banana">Banana</SelectItem>
			<SelectItem value="blueberry">Blueberry</SelectItem>
			<SelectItem value="grapes">Grapes</SelectItem>
			<SelectItem value="pineapple">Pineapple</SelectItem>
		</SelectGroup>
		<SelectSeparator />
		<SelectGroup>
			<SelectLabel>Vegetables</SelectLabel>
			<SelectItem value="carrot">Carrot</SelectItem>
			<SelectItem value="cucumber">Cucumber</SelectItem>
			<SelectItem value="lettuce">Lettuce</SelectItem>
			<SelectItem value="tomato">Tomato</SelectItem>
			<SelectItem value="zucchini">
				<p>Zucchini</p>
				<p>Ex sit voluptate incididunt pariatur velit consequat reprehenderit.</p>
			</SelectItem>
		</SelectGroup>
	</SelectContent>
</Select>