Select sheetmobile

Bottom-sheet single select with radio semantics, search for long lists, commit on pick and a hidden form input.

설치

pnpm

pnpm dlx shadcn@4.23.0 add @uikit/select-sheet

의존 아이템drawer input locale style

Default

select-sheet-demo.tsx

import { SelectSheet } from "@/components/ui/select-sheet";
const rooms = [  { value: "standard", label: "Standard", description: "1 queen bed" },  { value: "deluxe", label: "Deluxe", description: "2 queen beds" },  { value: "suite", label: "Suite", description: "Sold out", disabled: true },];
export default function SelectSheetDemo() {  return <SelectSheet name="room" title="Room type" options={rooms} defaultValue="standard" />;}