mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
e0ec477433
- Enable all 15 finance component docs (from .disabled → .mdx) - Create stock-market.mdx, 8 chart docs, 8 block docs, 2 framework docs - Add direction.tsx component (RTL/LTR support from upstream shadcn) - Add xs/icon-xs button sizes, data-variant/data-size attributes - Fix build-registry.mts to handle default exports in namespace re-exports - Add default props to order-entry, positions-list, orders-history, trading-panel - Fix 18 navigation stubs → re-export from root implementations - Add 44 orphaned MDX files to nav (installation, dark-mode, desktop, guides, etc) - Migrate 6 framer-motion imports → motion/react - Bump React 19.2.0→19.2.4, Next.js 16.0.1→16.1.6, motion→12.34.0 - Align lucide-react, sonner v2, tailwind-merge v3, postcss-selector-parser v7 - Remove framer-motion dep (superseded by motion) - Fix @types/react-dom, TypeScript versions across workspaces
54 lines
1.7 KiB
TypeScript
54 lines
1.7 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import { AnimatePresence, motion } from "motion/react"
|
|
|
|
import { cn } from "@/lib/utils"
|
|
|
|
interface AnimatedTooltipProps
|
|
extends Omit<React.HTMLAttributes<HTMLDivElement>, "content"> {
|
|
content: React.ReactNode
|
|
children: React.ReactNode
|
|
delay?: number
|
|
}
|
|
|
|
const AnimatedTooltip = React.forwardRef<HTMLDivElement, AnimatedTooltipProps>(
|
|
({ className, content, children, delay = 0, ...props }, ref) => {
|
|
const [isVisible, setIsVisible] = React.useState(false)
|
|
|
|
return (
|
|
<div
|
|
ref={ref}
|
|
className={cn("relative inline-block", className)}
|
|
onMouseEnter={() => setIsVisible(true)}
|
|
onMouseLeave={() => setIsVisible(false)}
|
|
{...props}
|
|
>
|
|
{children}
|
|
<AnimatePresence>
|
|
{isVisible && (
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 10, scale: 0.95 }}
|
|
animate={{ opacity: 1, y: 0, scale: 1 }}
|
|
exit={{ opacity: 0, y: 10, scale: 0.95 }}
|
|
transition={{
|
|
duration: 0.2,
|
|
delay: delay / 1000,
|
|
ease: "easeOut",
|
|
}}
|
|
className="absolute left-1/2 -translate-x-1/2 bottom-full mb-2 px-3 py-1.5 bg-popover text-popover-foreground text-sm rounded-md shadow-md whitespace-nowrap z-50"
|
|
>
|
|
{content}
|
|
<div className="absolute left-1/2 -translate-x-1/2 top-full w-0 h-0 border-l-4 border-r-4 border-t-4 border-l-transparent border-r-transparent border-t-popover" />
|
|
</motion.div>
|
|
)}
|
|
</AnimatePresence>
|
|
</div>
|
|
)
|
|
}
|
|
)
|
|
|
|
AnimatedTooltip.displayName = "AnimatedTooltip"
|
|
|
|
export { AnimatedTooltip }
|