import { jsxs as o, Fragment as d, jsx as e } from "react/jsx-runtime";
import { useState as c } from "react";
import { H as h, C as l, a as r, bJ as i, c as p, P as g, A as u } from "../index-sdOMz8GW.js";
import { Command as b, Search as m, Keyboard as N, Layers as x, Sparkles as w, FilePlus as y, FolderOpen as C, Save as P, PanelLeft as O, Moon as v, Terminal as F, Play as T, GitCommitHorizontal as f, ArrowUpFromLine as k } from "lucide-react";
import "react-router-dom";
import "react-dom";
const n = [
  {
    id: "1",
    label: "New File",
    icon: /* @__PURE__ */ e(y, { className: "h-4 w-4" }),
    shortcut: "⌘N",
    group: "File"
  },
  {
    id: "2",
    label: "Open File...",
    icon: /* @__PURE__ */ e(C, { className: "h-4 w-4" }),
    shortcut: "⌘O",
    group: "File"
  },
  {
    id: "3",
    label: "Save",
    icon: /* @__PURE__ */ e(P, { className: "h-4 w-4" }),
    shortcut: "⌘S",
    group: "File"
  },
  {
    id: "4",
    label: "Find & Replace",
    icon: /* @__PURE__ */ e(m, { className: "h-4 w-4" }),
    shortcut: "⌘⇧F",
    group: "Edit"
  },
  {
    id: "5",
    label: "Toggle Sidebar",
    icon: /* @__PURE__ */ e(O, { className: "h-4 w-4" }),
    shortcut: "⌘B",
    group: "View"
  },
  {
    id: "6",
    label: "Toggle Dark Mode",
    icon: /* @__PURE__ */ e(v, { className: "h-4 w-4" }),
    group: "View"
  },
  {
    id: "7",
    label: "Open Terminal",
    icon: /* @__PURE__ */ e(F, { className: "h-4 w-4" }),
    shortcut: "⌘`",
    group: "Tools"
  },
  {
    id: "8",
    label: "Run Build",
    icon: /* @__PURE__ */ e(T, { className: "h-4 w-4" }),
    shortcut: "⌘⇧B",
    group: "Tools"
  },
  {
    id: "9",
    label: "Git: Commit",
    icon: /* @__PURE__ */ e(f, { className: "h-4 w-4" }),
    group: "Git"
  },
  {
    id: "10",
    label: "Git: Push",
    icon: /* @__PURE__ */ e(k, { className: "h-4 w-4" }),
    group: "Git"
  }
];
function S(s) {
  const [t, a] = c(!1);
  return /* @__PURE__ */ o("div", { className: "space-y-3", children: [
    /* @__PURE__ */ e(
      "button",
      {
        onClick: () => a(!0),
        className: "rounded-lg border border-(--macos-glass-border) bg-(--macos-glass-clear-bg) px-4 py-2 text-[13px] text-(--macos-tahoe-text) backdrop-blur-sm transition-colors hover:bg-(--macos-tahoe-hover)",
        children: "Open Command Palette"
      }
    ),
    /* @__PURE__ */ e(
      i,
      {
        ...s,
        items: n,
        open: t,
        onOpenChange: a
      }
    )
  ] });
}
const B = () => {
  const [s, t] = c(!1);
  return /* @__PURE__ */ o(d, { children: [
    /* @__PURE__ */ e(
      h,
      {
        title: "Command Palette",
        description: "Spotlight-style command palette with glass material, real-time search filtering, grouped results, keyboard navigation, and customizable trigger key.",
        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-orange-500 via-amber-500 to-yellow-500 rounded-full flex items-center justify-center shadow-lg border border-orange-500/50", children: /* @__PURE__ */ e(b, { 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(l, { children: /* @__PURE__ */ o(r, { title: "Interactive Demo", className: "mt-2 mb-2", children: [
      /* @__PURE__ */ o("div", { className: "space-y-3", children: [
        /* @__PURE__ */ e(
          "button",
          {
            onClick: () => t(!0),
            className: "rounded-lg border border-(--macos-glass-border) bg-(--macos-glass-clear-bg) px-4 py-2 text-[13px] text-(--macos-tahoe-text) backdrop-blur-sm transition-colors hover:bg-(--macos-tahoe-hover)",
            children: "Open Command Palette"
          }
        ),
        /* @__PURE__ */ o("p", { className: "text-[12px] text-(--macos-tahoe-text-muted)", children: [
          "Or press",
          " ",
          /* @__PURE__ */ e("kbd", { className: "rounded border border-(--macos-glass-border) px-1.5 py-0.5 text-[11px]", children: "⌘K" }),
          " ",
          "to toggle"
        ] })
      ] }),
      /* @__PURE__ */ e(
        i,
        {
          items: n,
          open: s,
          onOpenChange: t,
          placeholder: "Type a command or search..."
        }
      )
    ] }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Features", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
      {
        icon: /* @__PURE__ */ e(m, { className: "h-4 w-4" }),
        title: "Real-time Filtering",
        desc: "Fuzzy search across labels and groups"
      },
      {
        icon: /* @__PURE__ */ e(N, { className: "h-4 w-4" }),
        title: "Keyboard Navigation",
        desc: "Arrow keys to move, Enter to select, Esc to close"
      },
      {
        icon: /* @__PURE__ */ e(x, { className: "h-4 w-4" }),
        title: "Grouped Results",
        desc: "Items organized by category with headers"
      },
      {
        icon: /* @__PURE__ */ e(w, { className: "h-4 w-4" }),
        title: "Glass Material",
        desc: "Prominent blur, translucent background, spatial depth"
      }
    ].map((a) => /* @__PURE__ */ o(
      "div",
      {
        className: "flex gap-3 rounded-lg bg-(--macos-glass-clear-bg) p-3 backdrop-blur-sm border border-(--macos-glass-border-subtle)",
        children: [
          /* @__PURE__ */ e("div", { className: "mt-0.5 text-(--macos-tahoe-accent)", children: a.icon }),
          /* @__PURE__ */ o("div", { children: [
            /* @__PURE__ */ e("p", { className: "text-[13px] font-medium text-(--macos-tahoe-text)", children: a.title }),
            /* @__PURE__ */ e("p", { className: "text-[12px] text-(--macos-tahoe-text-muted)", children: a.desc })
          ] })
        ]
      },
      a.title
    )) }) }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
      p,
      {
        code: `import { MacOSTahoeCommandPalette } from '@e-burgos/tucu-ui';

const items = [
  {
    id: '1',
    label: 'New File',
    icon: <FilePlusIcon />,
    shortcut: '⌘N',
    group: 'File',
    onSelect: () => createFile(),
  },
  // ...more items
];

<MacOSTahoeCommandPalette
  items={items}
  open={isOpen}
  onOpenChange={setIsOpen}
  placeholder="Type a command..."
  triggerKey="k"  // ⌘K to toggle
/>`,
        language: "tsx"
      }
    ) }) }),
    /* @__PURE__ */ e(
      g,
      {
        componentName: "MacOSTahoeCommandPalette",
        defaultValues: {
          placeholder: "Type a command or search...",
          triggerKey: "k"
        },
        includeProps: ["placeholder", "triggerKey"],
        excludeProps: ["className", "items", "open", "onOpenChange"],
        children: (a) => /* @__PURE__ */ e(S, { ...a })
      }
    ),
    /* @__PURE__ */ e(u, { componentName: "MacOSTahoeCommandPalette" })
  ] });
};
export {
  B as default
};
