import { jsxs as r, Fragment as i, jsx as e } from "react/jsx-runtime";
import { H as n, C as a, a as o, bC as s, c as l } from "../index-sdOMz8GW.js";
import { PanelLeftClose as d, LayoutDashboard as c, Play as m, Archive as h, FolderKanban as p, BarChart2 as u, Users as b, Settings as w } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const t = [
  {
    name: "Dashboard",
    icon: /* @__PURE__ */ e(c, { className: "h-4 w-4" }),
    path: "/dashboard",
    isActive: !0
  },
  {
    name: "Projects",
    icon: /* @__PURE__ */ e(p, { className: "h-4 w-4" }),
    path: "/projects",
    dropdownItems: [
      {
        name: "Active",
        icon: /* @__PURE__ */ e(m, { className: "h-4 w-4" }),
        path: "/projects/active"
      },
      {
        name: "Archived",
        icon: /* @__PURE__ */ e(h, { className: "h-4 w-4" }),
        path: "/projects/archived"
      }
    ]
  },
  {
    name: "Analytics",
    icon: /* @__PURE__ */ e(u, { className: "h-4 w-4" }),
    path: "/analytics"
  },
  {
    name: "Team",
    icon: /* @__PURE__ */ e(b, { className: "h-4 w-4" }),
    path: "/team"
  },
  {
    name: "Settings",
    icon: /* @__PURE__ */ e(w, { className: "h-4 w-4" }),
    path: "/settings"
  }
], y = () => /* @__PURE__ */ r(i, { children: [
  /* @__PURE__ */ e(
    n,
    {
      title: "MacOSTahoeLayoutSidebar",
      description: "Full-app navigation sidebar for Tahoe layouts. Supports nested items with expandable groups, Liquid Glass vibrancy, route-aware active highlighting, and a mobile drawer variant.",
      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-teal-400 via-cyan-500 to-blue-600 rounded-full flex items-center justify-center shadow-lg border border-teal-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, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Interactive Preview", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ r("div", { className: "flex h-80 rounded-[20px] overflow-hidden border border-border shadow-[var(--shadow-card)]", children: [
    /* @__PURE__ */ e(s, { menuItems: t }),
    /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400", children: "Main content area" })
  ] }) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Mobile Drawer Variant", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "flex h-80 rounded-[20px] overflow-hidden border border-border shadow-[var(--shadow-card)]", children: /* @__PURE__ */ e(
    s,
    {
      menuItems: t,
      mobile: !0,
      onClose: () => {
      }
    }
  ) }) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
    l,
    {
      language: "tsx",
      code: `import { MacOSTahoeLayoutSidebar } from '@e-burgos/tucu-ui';

const menuItems = [
  { name: 'Dashboard', icon: <DashboardIcon />, path: '/dashboard' },
  {
    name: 'Projects',
    icon: <FolderIcon />,
    path: '/projects',
    dropdownItems: [
      { name: 'Active', icon: <PlayIcon />, path: '/projects/active' },
    ],
  },
  { name: 'Settings', icon: <SettingsIcon />, path: '/settings' },
];

function App() {
  const [drawerOpen, setDrawerOpen] = useState(false);
  return (
    <div className="flex h-screen">
      {/* Desktop sidebar */}
      <MacOSTahoeLayoutSidebar
        menuItems={menuItems}
        logo={{ logoDark: '/logo.svg', logoLight: '/logo.svg' }}
      />
      {/* Mobile drawer */}
      {drawerOpen && (
        <MacOSTahoeLayoutSidebar
          menuItems={menuItems}
          mobile
          onClose={() => setDrawerOpen(false)}
        />
      )}
      <main className="flex-1">Content</main>
    </div>
  );
}`
    }
  ) }) }) })
] });
export {
  y as TahoeLayoutSidebarSection,
  y as default
};
