ChevronsUpDown } from "lucide-react" import { cn } from "@/lib/utils" import { Button } from "@/components/ui/button" import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from
<Select value={selectedOption} onValueChange={(value) => { setSelectedOption(value); }} > <SelectTrigger className="w-[300px] text-foreground"> <SelectValue /> </SelectTrigger> <SelectContent> <SelectGroup> <SelectItem value="apple">Apple</SelectItem> <SelectItem value="banana">Banana<...
{ Select, SelectContent, SelectTrigger, SelectValue, } from "@/components/ui/select"; import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; // Pass them to getQueryBuilderS...
SelectValue, } from '@/components/ui/select'; import { DayPicker } from 'react-day-picker';// --- utils start --- /** * regular expression to check for valid hour format (01-23) */ function isValidHour(value: string) { return /^(0[0-9]|...
For now, I see more value in focusing on ready-to-use components Zepyur Izyan@zepyurizyan · 3 months ago Great work! Thanks Yauheni! 😍 Yauheni Neviarouskiy@yauheniyCreator· 3 months ago Thanks, Zep! Appreciate it! Leo@luotao · 3 months ago It is recommended to use the plugin ...
ReactNode }) { const cookieStore = await cookies() const defaultOpen = cookieStore.get("sidebar:state")?.value === "true" return ( <SidebarProvider defaultOpen={defaultOpen}> <AppSidebar /> <main> <SidebarTrigger /> {children} </main> </SidebarProvider> ) }Copy...
Here are the steps to get started: Create a new database Give it a name and select a region Create a new branch GIF of planetscale database setup In order to connect to the database we need to add the database URL to our.envfile. We can get the URL by navigating...
Add Select Component 13 Mar 2024: Add Calendar Component Add Tooltip Component 11 Mar 2024 Add Alert Dialog Component Add Breadcrumb Component 9 Mar 2024 Add Switch Component Add Slider Component 29 Feb 2024 Add Accordion Component Add Pagination Component 16 Feb 2024 Add Progress Component 15 Feb...
ShadcnSelect<T>( initialValue: value, options: values .map( (e) => DropdownMenuItem( (e) => ShadcnOption( value: e, child: Text(e.name.replaceAll('\$', '')), ), ) .toList(), selectedOptionBuilder: (context, value) { return Text(value.name.replaceAll('\$', '')); }, on...
import * as React from 'react' import { MultiSelect } from from "@/components/ui/multi-select" function Demo() { const [selected, setSelected] = useState<string[]>([]); return ( <MultiSelect options={[ { value: "next.js", label: "Next.js", }, { value: "sveltekit", label: "...