import { jsxs as s, Fragment as m, jsx as e } from "react/jsx-runtime";
import { H as r, C as a, a as t, bA as i, T as l, c as h } from "../index-sdOMz8GW.js";
import { Dock as d, FolderOpen as p, Globe as u, Mail as g, MessageCircle as w, Map as f, Image as b, Music as N, Calendar as v, FileText as k, Calculator as I, Clock as x, CloudSun as S, LayoutGrid as y, Sliders as M, Palette as C, Shield as D, Settings as T, Terminal as O, Download as F } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const o = [
  {
    name: "Finder",
    icon: /* @__PURE__ */ e(p, { className: "h-5 w-5" }),
    path: "/macos-tahoe/finder"
  },
  {
    name: "Safari",
    icon: /* @__PURE__ */ e(u, { className: "h-5 w-5" }),
    path: "/macos-tahoe/safari"
  },
  {
    name: "Mail",
    icon: /* @__PURE__ */ e(g, { className: "h-5 w-5" }),
    path: "/macos-tahoe/mail"
  },
  {
    name: "Messages",
    icon: /* @__PURE__ */ e(w, { className: "h-5 w-5" }),
    path: "/macos-tahoe/messages"
  },
  {
    name: "Maps",
    icon: /* @__PURE__ */ e(f, { className: "h-5 w-5" }),
    path: "/macos-tahoe/maps"
  },
  {
    name: "Photos",
    icon: /* @__PURE__ */ e(b, { className: "h-5 w-5" }),
    path: "/macos-tahoe/photos"
  },
  {
    name: "Music",
    icon: /* @__PURE__ */ e(N, { className: "h-5 w-5" }),
    path: "/macos-tahoe/music"
  },
  {
    name: "Calendar",
    icon: /* @__PURE__ */ e(v, { className: "h-5 w-5" }),
    path: "/macos-tahoe/calendar"
  },
  {
    name: "Notes",
    icon: /* @__PURE__ */ e(k, { className: "h-5 w-5" }),
    path: "/macos-tahoe/notes"
  },
  {
    name: "Launchpad",
    icon: /* @__PURE__ */ e(y, { className: "h-5 w-5" }),
    path: "/macos-tahoe/launchpad",
    dropdownItems: [
      {
        name: "Calculator",
        icon: /* @__PURE__ */ e(I, { className: "h-4 w-4" }),
        path: "/macos-tahoe/launchpad/calculator"
      },
      {
        name: "Clock",
        icon: /* @__PURE__ */ e(x, { className: "h-4 w-4" }),
        path: "/macos-tahoe/launchpad/clock"
      },
      {
        name: "Weather",
        icon: /* @__PURE__ */ e(S, { className: "h-4 w-4" }),
        path: "/macos-tahoe/launchpad/weather"
      }
    ]
  },
  {
    name: "Settings",
    icon: /* @__PURE__ */ e(T, { className: "h-5 w-5" }),
    path: "/macos-tahoe/settings",
    dropdownItems: [
      {
        name: "General",
        icon: /* @__PURE__ */ e(M, { className: "h-4 w-4" }),
        path: "/macos-tahoe/settings/general"
      },
      {
        name: "Appearance",
        icon: /* @__PURE__ */ e(C, { className: "h-4 w-4" }),
        path: "/macos-tahoe/settings/appearance"
      },
      {
        name: "Privacy",
        icon: /* @__PURE__ */ e(D, { className: "h-4 w-4" }),
        path: "/macos-tahoe/settings/privacy"
      }
    ]
  }
], G = [
  {
    name: "Terminal",
    icon: /* @__PURE__ */ e(O, { className: "h-5 w-5" }),
    path: "/macos-tahoe/terminal"
  },
  {
    name: "Downloads",
    icon: /* @__PURE__ */ e(F, { className: "h-5 w-5" }),
    path: "/macos-tahoe/downloads"
  }
], j = [...o, ...G], U = () => /* @__PURE__ */ s(m, { children: [
  /* @__PURE__ */ e(
    r,
    {
      title: "Dock",
      description: "macOS Tahoe Dock with Liquid Glass material, icon magnification on hover, active indicators, tooltips, and separator for recent apps. Accepts the same IMenuItem[] used by all tucu-ui menus.",
      icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-sky-400 via-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg border border-sky-400/50", children: /* @__PURE__ */ e(d, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
    }
  ),
  /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(t, { title: "Interactive Dock", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "relative flex items-end justify-center min-h-30 rounded-2xl bg-linear-to-b from-transparent to-black/5 dark:to-white/5 overflow-visible py-6", children: /* @__PURE__ */ e(
    i,
    {
      items: j,
      separatorBeforeIndex: o.length,
      inline: !0
    }
  ) }) }) }),
  /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(t, { title: "Without Magnification", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "relative flex items-end justify-center min-h-25 rounded-2xl bg-linear-to-b from-transparent to-black/5 dark:to-white/5 overflow-visible py-6", children: /* @__PURE__ */ e(
    i,
    {
      items: o.slice(0, 6),
      magnification: !1,
      inline: !0
    }
  ) }) }) }),
  /* @__PURE__ */ e(a, { children: /* @__PURE__ */ s(t, { title: "With Dropdown Items", className: "mt-2 mb-2", children: [
    /* @__PURE__ */ e(
      l,
      {
        tag: "p",
        className: "text-sm text-gray-500 dark:text-gray-400 mb-4",
        children: "Click the Settings icon to see the dropdown popover with sub-items."
      }
    ),
    /* @__PURE__ */ e("div", { className: "relative flex items-end justify-center min-h-25 rounded-2xl bg-linear-to-b from-transparent to-black/5 dark:to-white/5 overflow-visible py-6", children: /* @__PURE__ */ e(
      i,
      {
        items: o.slice(-3),
        magnification: !1,
        inline: !0
      }
    ) })
  ] }) }),
  /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(t, { title: "Features", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 text-[13px]", children: [
    [
      "IMenuItem Compatible",
      "Uses the same IMenuItem[] type as all tucu-ui menus"
    ],
    [
      "Magnification",
      "macOS-style icon scaling on hover with configurable maxScale"
    ],
    ["Tooltips", "Hover over an icon to see the item name tooltip"],
    [
      "Separator",
      "Visual separator to divide pinned apps from recent"
    ],
    [
      "Dropdown Children",
      "Items with dropdownItems show a popover on click"
    ],
    [
      "Active Indicator",
      "Dot indicator below active item (matches current route)"
    ],
    ["Auto-Hide", "Optional auto-hide with mouse-edge reveal"],
    [
      "Liquid Glass",
      "Uses --macos-glass-* tokens for backdrop-blur and translucency"
    ]
  ].map(([n, c]) => /* @__PURE__ */ s(
    "div",
    {
      className: "rounded-xl border border-(--macos-glass-border-subtle) bg-(--macos-glass-clear-bg) p-3 backdrop-blur-sm",
      children: [
        /* @__PURE__ */ e("div", { className: "font-semibold text-(--macos-tahoe-text)", children: n }),
        /* @__PURE__ */ e("div", { className: "mt-0.5 text-(--macos-tahoe-text-muted)", children: c })
      ]
    },
    n
  )) }) }) }),
  /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(t, { title: "Usage", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
    h,
    {
      code: `import { MacOSTahoeDock } from '@e-burgos/tucu-ui';

const menuItems = [
  { name: 'Finder', icon: <FolderIcon />, path: '/finder' },
  { name: 'Safari', icon: <GlobeIcon />, path: '/safari' },
  { name: 'Settings', icon: <SettingsIcon />, path: '/settings',
    dropdownItems: [
      { name: 'General', icon: <SlidersIcon />, path: '/settings/general' },
      { name: 'Privacy', icon: <ShieldIcon />, path: '/settings/privacy' },
    ],
  },
];

{/* Fixed at bottom (default) */}
<MacOSTahoeDock items={menuItems} />

{/* With separator and magnification */}
<MacOSTahoeDock
  items={[...pinnedItems, ...recentItems]}
  separatorBeforeIndex={pinnedItems.length}
  magnification={true}
  maxScale={1.6}
/>

{/* Vertical dock on the left */}
<MacOSTahoeDock items={menuItems} position="left" />

{/* Auto-hide dock */}
<MacOSTahoeDock items={menuItems} autoHide />`,
      language: "tsx"
    }
  ) }) })
] });
export {
  U as TahoeDockSection,
  U as default
};
