floating-navigation

1"use client";
2 
3import React, { useState, useRef, useEffect } from "react";
4import { motion, AnimatePresence } from "framer-motion";
5import { cn } from "@/lib/utils";
6 
7// --- Types ---
8interface NavItem {
9    id: string;
10    label: string;
11    icon: React.ReactNode;
12}
13 
14interface FloatingNavigationProps {
15    items?: NavItem[];
16    className?: string;
17    position?: "fixed" | "absolute";
18}
19 
20// --- Icons (Internal SVGs for reliability) ---
21const HomeIcon = ({ className }: { className?: string }) => (
22    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}><path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" /><polyline points="9 22 9 12 15 12 15 22" /></svg>
23);
24const SearchIcon = ({ className }: { className?: string }) => (
25    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}><circle cx="11" cy="11" r="8" /><path d="m21 21-4.3-4.3" /></svg>
26);
27const BellIcon = ({ className }: { className?: string }) => (
28    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" /><path d="M10.3 21a1.94 1.94 0 0 0 3.4 0" /></svg>
29);
30const UserIcon = ({ className }: { className?: string }) => (
31    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" /><circle cx="12" cy="7" r="4" /></svg>
32);
33const SettingsIcon = ({ className }: { className?: string }) => (
34// … truncated