feat: update tooltip primitive

This commit is contained in:
shadcn
2023-01-29 14:01:40 +04:00
parent 53494e73c5
commit 9dca4334e5
3 changed files with 27 additions and 23 deletions

View File

@@ -6,21 +6,24 @@ import { Button } from "@/components/ui/button"
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip"
export function TooltipDemo() {
return (
<Tooltip>
<TooltipTrigger asChild>
<Button variant="outline" className="w-10 rounded-full p-0">
<Plus className="h-4 w-4" />
<span className="sr-only">Add</span>
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Add to library</p>
</TooltipContent>
</Tooltip>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="outline" className="w-10 rounded-full p-0">
<Plus className="h-4 w-4" />
<span className="sr-only">Add</span>
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Add to library</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)
}

View File

@@ -5,11 +5,9 @@ import * as TooltipPrimitive from "@radix-ui/react-tooltip"
import { cn } from "@/lib/utils"
const Tooltip = ({ ...props }) => (
<TooltipPrimitive.Provider>
<TooltipPrimitive.Root {...props} />
</TooltipPrimitive.Provider>
)
const TooltipProvider = TooltipPrimitive.Provider
const Tooltip = ({ ...props }) => <TooltipPrimitive.Root {...props} />
Tooltip.displayName = TooltipPrimitive.Tooltip.displayName
const TooltipTrigger = TooltipPrimitive.Trigger
@@ -30,4 +28,4 @@ const TooltipContent = React.forwardRef<
))
TooltipContent.displayName = TooltipPrimitive.Content.displayName
export { Tooltip, TooltipTrigger, TooltipContent }
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }

View File

@@ -34,15 +34,18 @@ This is the `<Tooltip />` primitive. You can place it in a file at `components/u
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip"
```
```tsx
<Tooltip>
<TooltipTrigger>Hover</TooltipTrigger>
<TooltipContent>
<p>Add to library</p>
</TooltipContent>
</Tooltip>
<TooltipProvider>
<Tooltip>
<TooltipTrigger>Hover</TooltipTrigger>
<TooltipContent>
<p>Add to library</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
```