(true)
11 |
12 | return (
13 |
14 |
20 |
23 |
24 | )
25 | }
26 |
--------------------------------------------------------------------------------
/registry/default/components/comp-189.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-190.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
15 |
16 |
17 |
18 |
19 |
20 | )
21 | }
22 |
--------------------------------------------------------------------------------
/registry/default/components/comp-192.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
22 | Tell us what‘s your favorite Select framework
23 |
24 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-194.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
22 | Selected option is invalid
23 |
24 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-196.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-197.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | )
21 | }
22 |
--------------------------------------------------------------------------------
/registry/default/components/comp-198.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
10 |
11 |
12 |
17 |
22 |
23 |
24 | )
25 | }
26 |
--------------------------------------------------------------------------------
/registry/default/components/comp-22.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 | import { Input } from "@/registry/default/ui/input"
5 | import { Label } from "@/registry/default/ui/label"
6 |
7 | export default function Component() {
8 | const id = useId()
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 |
16 |
17 |
28 |
29 | )
30 | }
31 |
--------------------------------------------------------------------------------
/registry/default/components/comp-236.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { SelectNative } from "@/registry/default/ui/select-native"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/registry/default/components/comp-241.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/registry/default/components/comp-242.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
15 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/registry/default/components/comp-243.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
13 |
14 | )
15 | }
16 |
--------------------------------------------------------------------------------
/registry/default/components/comp-244.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
13 |
14 | )
15 | }
16 |
--------------------------------------------------------------------------------
/registry/default/components/comp-245.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
9 |
15 |
19 | 5 GB
20 | 20 GB
21 | 35 GB
22 |
23 |
24 |
13 |
14 |
15 |
16 |
17 |
22 |
7 |
8 |
9 |
13 | Low
14 | High
15 |
16 |
17 |
18 |
7 |
8 |
9 |
13 | Low
14 | High
15 |
16 |
22 |
23 |
7 |
8 |
13 |
14 | )
15 | }
16 |
--------------------------------------------------------------------------------
/registry/default/components/comp-251.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { useState } from "react"
4 |
5 | import { Label } from "@/registry/default/ui/label"
6 | import { Slider } from "@/registry/default/ui/slider"
7 |
8 | export default function Component() {
9 | const [value, setValue] = useState([25, 75])
10 |
11 | return (
12 |
13 |
14 |
15 |
18 |
19 |
24 |
9 |
10 | `${value}%`}
15 | />
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-261.tsx:
--------------------------------------------------------------------------------
1 | import { Label } from "@/registry/default/ui/label"
2 | import { Slider } from "@/registry/default/ui/slider"
3 |
4 | export default function Component() {
5 | return (
6 |
7 |
8 |
9 |
15 |
16 |
7 |
8 |
9 |
16 |
17 |
6 |
7 |
12 | Some information is missing!
13 |
14 |
6 |
7 |
12 | Some information is missing!
13 |
14 |
6 |
7 |
12 | An error occurred!
13 |
14 |
6 |
7 |
12 | An error occurred!
13 |
14 |
6 |
7 |
12 | Completed successfully!
13 |
14 |
6 |
7 |
12 | Completed successfully!
13 |
14 |
6 |
7 |
12 | Just a quick note!
13 |
14 |
6 |
7 |
12 | Just a quick note!
13 |
14 |
6 |
7 |
12 |
13 |
14 | Password does not meet requirements:
15 |
16 |
17 | - Minimum 8 characters
18 | - Inlcude a special character
19 |
20 |
21 |
22 |
6 |
7 |
12 |
13 |
14 | Password does not meet requirements:
15 |
16 |
17 | - Minimum 8 characters
18 | - Inlcude a special character
19 |
20 |
21 |
22 |
10 |
11 |
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-301.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return (
5 | // To make the notification fixed, add classes like `fixed bottom-4 inset-x-4` to the container element.
6 |
7 |
8 |
9 | We use cookies to improve your experience, analyze site usage, and
10 | show personalized content.
11 |
12 |
13 |
14 |
17 |
18 |
19 |
6 |
7 |
12 | Get the most out of your app with real-time updates and analytics{" "}
13 | ·{" "}
14 |
15 | Upgrade
16 |
17 |
18 |
9 |
15 |
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-311.tsx:
--------------------------------------------------------------------------------
1 | export default function Component() {
2 | return (
3 |
4 |
5 | 📫 Subscribe to our
6 | newsletter and get 10% off your first order!{" "}
7 | ·{" "}
8 |
9 | Subscribe
10 |
11 |
12 |
17 | Built with{" "}
18 |
24 | React Aria
25 |
26 |
27 |
28 | )
29 | }
30 |
--------------------------------------------------------------------------------
/registry/default/components/comp-390.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Avatar,
3 | AvatarFallback,
4 | AvatarImage,
5 | } from "@/registry/default/ui/avatar"
6 |
7 | export default function Component() {
8 | return (
9 |
10 |
11 | KK
12 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/registry/default/components/comp-391.tsx:
--------------------------------------------------------------------------------
1 | import { Avatar, AvatarFallback } from "@/registry/default/ui/avatar"
2 |
3 | export default function Component() {
4 | return (
5 |
6 | KK
7 |
8 | )
9 | }
10 |
--------------------------------------------------------------------------------
/registry/default/components/comp-392.tsx:
--------------------------------------------------------------------------------
1 | import { UserRoundIcon } from "lucide-react"
2 |
3 | import { Avatar, AvatarFallback } from "@/registry/default/ui/avatar"
4 |
5 | export default function Component() {
6 | return (
7 |
8 |
9 |
10 |
11 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/registry/default/components/comp-393.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Avatar,
3 | AvatarFallback,
4 | AvatarImage,
5 | } from "@/registry/default/ui/avatar"
6 |
7 | export default function Component() {
8 | return (
9 |
10 |
11 | KK
12 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/registry/default/components/comp-394.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Avatar,
3 | AvatarFallback,
4 | AvatarImage,
5 | } from "@/registry/default/ui/avatar"
6 |
7 | export default function Component() {
8 | return (
9 |
10 |
11 |
12 | KK
13 |
14 |
15 | Online
16 |
17 |
10 |
11 |
12 | KK
13 |
14 |
15 | Offline
16 |
17 |
10 |
11 |
12 | KK
13 |
14 |
15 | Online
16 |
17 |
11 |
12 |
13 | KK
14 |
15 |
16 | 6
17 |
18 |
11 |
12 |
13 | KK
14 |
15 |
16 | 6
17 |
18 |
10 |
11 |
19 |
20 | )
21 | }
22 |
--------------------------------------------------------------------------------
/registry/default/components/comp-59.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/registry/default/components/comp-60.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
13 |
14 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-61.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
17 | Please add as many details as you can
18 |
19 |
10 |
11 |
14 | Optional
15 |
16 |
17 |
10 |
11 |
12 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/registry/default/components/comp-64.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
17 |
22 | Message should be at least 10 characters
23 |
24 |
10 |
11 |
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-66.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-67.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
12 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/registry/default/components/comp-68.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 | import { Label } from "@/registry/default/ui/label"
5 | import { Textarea } from "@/registry/default/ui/textarea"
6 |
7 | export default function Component() {
8 | const id = useId()
9 | return (
10 |
11 |
12 |
13 |
14 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-69.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 | import { Label } from "@/registry/default/ui/label"
5 | import { Textarea } from "@/registry/default/ui/textarea"
6 |
7 | export default function Component() {
8 | const id = useId()
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 |
11 |
12 |
13 |
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-71.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
16 |
17 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-75.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
16 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/registry/default/components/comp-76.tsx:
--------------------------------------------------------------------------------
1 | import { useId } from "react"
2 |
3 | import { Label } from "@/registry/default/ui/label"
4 | import { Textarea } from "@/registry/default/ui/textarea"
5 |
6 | export default function Component() {
7 | const id = useId()
8 | return (
9 |
10 |
11 |
18 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/registry/default/components/comp-77.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { useId } from "react"
4 |
5 | import { Label } from "@/registry/default/ui/label"
6 | import { Textarea } from "@/registry/default/ui/textarea"
7 |
8 | export default function Component() {
9 | const id = useId()
10 | return (
11 |
12 |
13 |
18 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/registry/default/components/comp-78.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/registry/default/components/comp-79.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/registry/default/components/comp-80.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/registry/default/components/comp-81.tsx:
--------------------------------------------------------------------------------
1 | import { ArchiveIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-82.tsx:
--------------------------------------------------------------------------------
1 | import { TrashIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-83.tsx:
--------------------------------------------------------------------------------
1 | import { XIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-84.tsx:
--------------------------------------------------------------------------------
1 | import { SparklesIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-85.tsx:
--------------------------------------------------------------------------------
1 | import { ArrowLeftIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-86.tsx:
--------------------------------------------------------------------------------
1 | import { ArrowRightIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-87.tsx:
--------------------------------------------------------------------------------
1 | import { ArrowRightIcon, MailIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/registry/default/components/comp-88.tsx:
--------------------------------------------------------------------------------
1 | import { ChevronDownIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-89.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return (
5 |
6 |
7 |
8 |
9 | )
10 | }
11 |
--------------------------------------------------------------------------------
/registry/default/components/comp-90.tsx:
--------------------------------------------------------------------------------
1 | import { LoaderCircleIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-92.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return (
5 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-93.tsx:
--------------------------------------------------------------------------------
1 | import { PrinterIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
14 | )
15 | }
16 |
--------------------------------------------------------------------------------
/registry/default/components/comp-94.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from "@/registry/default/ui/button"
2 |
3 | export default function Component() {
4 | return (
5 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/registry/default/components/comp-95.tsx:
--------------------------------------------------------------------------------
1 | import { ChevronDownIcon } from "lucide-react"
2 |
3 | import {
4 | Avatar,
5 | AvatarFallback,
6 | AvatarImage,
7 | } from "@/registry/default/ui/avatar"
8 | import { Button } from "@/registry/default/ui/button"
9 |
10 | export default function Component() {
11 | return (
12 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/registry/default/components/comp-96.tsx:
--------------------------------------------------------------------------------
1 | import { PlusIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/registry/default/components/comp-97.tsx:
--------------------------------------------------------------------------------
1 | import { PlusIcon } from "lucide-react"
2 |
3 | import { Button } from "@/registry/default/ui/button"
4 |
5 | export default function Component() {
6 | return (
7 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/registry/default/components/comp-98.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { useState } from "react"
4 | import { PlusIcon } from "lucide-react"
5 |
6 | import { Button } from "@/registry/default/ui/button"
7 |
8 | export default function Component() {
9 | const [open, setOpen] = useState(false)
10 |
11 | return (
12 |
26 | )
27 | }
28 |
--------------------------------------------------------------------------------
/registry/default/components/comp-99.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { PlusIcon } from "lucide-react"
4 |
5 | import { Button } from "@/registry/default/ui/button"
6 | import {
7 | Tooltip,
8 | TooltipContent,
9 | TooltipProvider,
10 | TooltipTrigger,
11 | } from "@/registry/default/ui/tooltip"
12 |
13 | export default function Component() {
14 | return (
15 |
16 |
17 |
18 |
21 |
22 | Tooltip
23 |
24 |
25 | )
26 | }
27 |
--------------------------------------------------------------------------------
/registry/default/components/event-calendar/constants.ts:
--------------------------------------------------------------------------------
1 | // Height of calendar events in pixels - used in month, week and day views
2 | export const EventHeight = 24
3 |
4 | // Vertical gap between events in pixels - controls spacing in month view
5 | export const EventGap = 4
6 |
7 | // Height of hour cells in week and day views - controls the scale of time display
8 | export const WeekCellsHeight = 64
9 |
10 | // Number of days to show in the agenda view
11 | export const AgendaDaysToShow = 30
12 |
13 | // Start and end hours for the week and day views
14 | export const StartHour = 0
15 | export const EndHour = 24
16 |
17 | // Default start and end times
18 | export const DefaultStartHour = 9 // 9 AM
19 | export const DefaultEndHour = 10 // 10 AM
20 |
--------------------------------------------------------------------------------
/registry/default/components/event-calendar/types.ts:
--------------------------------------------------------------------------------
1 | export type CalendarView = "month" | "week" | "day" | "agenda"
2 |
3 | export interface CalendarEvent {
4 | id: string
5 | title: string
6 | description?: string
7 | start: Date
8 | end: Date
9 | allDay?: boolean
10 | color?: EventColor
11 | location?: string
12 | }
13 |
14 | export type EventColor =
15 | | "sky"
16 | | "amber"
17 | | "violet"
18 | | "rose"
19 | | "emerald"
20 | | "orange"
21 |
--------------------------------------------------------------------------------
/registry/default/hooks/use-character-limit.ts:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { ChangeEvent, useState } from "react"
4 |
5 | type UseCharacterLimitProps = {
6 | maxLength: number
7 | initialValue?: string
8 | }
9 |
10 | export function useCharacterLimit({
11 | maxLength,
12 | initialValue = "",
13 | }: UseCharacterLimitProps) {
14 | const [value, setValue] = useState(initialValue)
15 | const [characterCount, setCharacterCount] = useState(initialValue.length)
16 |
17 | const handleChange = (
18 | e: ChangeEvent
19 | ) => {
20 | const newValue = e.target.value
21 | if (newValue.length <= maxLength) {
22 | setValue(newValue)
23 | setCharacterCount(newValue.length)
24 | }
25 | }
26 |
27 | return {
28 | value,
29 | characterCount,
30 | handleChange,
31 | maxLength,
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/registry/default/lib/utils.ts:
--------------------------------------------------------------------------------
1 | import { clsx, type ClassValue } from "clsx"
2 | import { twMerge } from "tailwind-merge"
3 |
4 | export function cn(...inputs: ClassValue[]) {
5 | return twMerge(clsx(inputs))
6 | }
7 |
--------------------------------------------------------------------------------
/registry/default/ui/label.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as LabelPrimitive from "@radix-ui/react-label"
5 |
6 | import { cn } from "@/registry/default/lib/utils"
7 |
8 | function Label({
9 | className,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
21 | )
22 | }
23 |
24 | export { Label }
25 |
--------------------------------------------------------------------------------
/registry/default/ui/sonner.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { useTheme } from "next-themes"
4 | import { Toaster as Sonner, ToasterProps } from "sonner"
5 |
6 | const Toaster = ({ ...props }: ToasterProps) => {
7 | const { theme = "system" } = useTheme()
8 |
9 | return (
10 |
27 | )
28 | }
29 |
30 | export { Toaster }
31 |
--------------------------------------------------------------------------------
/registry/default/ui/textarea.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 |
3 | import { cn } from "@/registry/default/lib/utils"
4 |
5 | function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
6 | return (
7 |
15 | )
16 | }
17 | Textarea.displayName = "Textarea"
18 |
19 | export { Textarea }
20 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "lib": ["dom", "dom.iterable", "esnext"],
4 | "allowJs": true,
5 | "skipLibCheck": true,
6 | "strict": true,
7 | "noEmit": true,
8 | "esModuleInterop": true,
9 | "module": "esnext",
10 | "moduleResolution": "bundler",
11 | "resolveJsonModule": true,
12 | "isolatedModules": true,
13 | "jsx": "preserve",
14 | "incremental": true,
15 | "plugins": [
16 | {
17 | "name": "next",
18 | },
19 | ],
20 | "paths": {
21 | "@/*": ["./*"],
22 | },
23 | "target": "ES2017",
24 | },
25 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
26 | "exclude": ["node_modules"],
27 | }
28 |
--------------------------------------------------------------------------------
/tsconfig.scripts.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://json.schemastore.org/tsconfig",
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "target": "es6",
6 | "module": "ESNext",
7 | "moduleResolution": "node",
8 | "esModuleInterop": true,
9 | "isolatedModules": false
10 | },
11 | "include": ["scripts/**/*.ts"],
12 | "exclude": ["node_modules"]
13 | }
14 |
--------------------------------------------------------------------------------