import { jsxs as a, Fragment as p, jsx as e } from "react/jsx-runtime";
import { useState as s } from "react";
import { H as h, C as r, a as i, x as c, bv as d, P as g, A as u, c as S } from "../index-sdOMz8GW.js";
import { Command as f, Search as n, FilePlus as N, FolderOpen as v, Save as y, Settings as b, Moon as w, Terminal as x } from "lucide-react";
import "react-router-dom";
import "react-dom";
const m = [
  { id: "new-file", label: "New File", group: "File", shortcut: ["⌘", "N"], icon: /* @__PURE__ */ e(N, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "open-file", label: "Open File", group: "File", shortcut: ["⌘", "O"], icon: /* @__PURE__ */ e(v, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "save", label: "Save", group: "File", shortcut: ["⌘", "S"], icon: /* @__PURE__ */ e(y, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "settings", label: "Settings", group: "Navigation", shortcut: ["⌘", ","], icon: /* @__PURE__ */ e(b, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "theme", label: "Toggle Theme", group: "Navigation", icon: /* @__PURE__ */ e(w, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "terminal", label: "Open Terminal", group: "Tools", shortcut: ["⌘", "`"], icon: /* @__PURE__ */ e(x, { className: "w-4 h-4" }), onSelect: () => {
  } },
  { id: "search", label: "Search in Files", group: "Tools", shortcut: ["⌘", "Shift", "F"], icon: /* @__PURE__ */ e(n, { className: "w-4 h-4" }), onSelect: () => {
  } }
];
function C(t) {
  const [o, l] = s(!1);
  return /* @__PURE__ */ a("div", { className: "flex flex-col items-center gap-4", children: [
    /* @__PURE__ */ a(c, { variant: "solid", size: "medium", onClick: () => l(!0), children: [
      /* @__PURE__ */ e(n, { size: 14, className: "mr-2" }),
      "Open Command Palette"
    ] }),
    /* @__PURE__ */ a("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: [
      "Or press ",
      /* @__PURE__ */ a("kbd", { className: "px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono", children: [
        "⌘",
        t.triggerKey?.toUpperCase() ?? "K"
      ] })
    ] }),
    /* @__PURE__ */ e(
      d,
      {
        open: o,
        onOpenChange: l,
        items: m,
        placeholder: t.placeholder
      }
    )
  ] });
}
const T = () => {
  const [t, o] = s(!1);
  return /* @__PURE__ */ a(p, { children: [
    /* @__PURE__ */ e(
      h,
      {
        title: "CommandPalette",
        description: "A native macOS Spotlight-style command palette with Liquid Glass, grouped results, keyboard navigation, shortcut display, and fuzzy search. Triggered via ⌘K by default.",
        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(f, { 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(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Interactive Demo", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "p-6 flex flex-col items-center gap-4", children: [
      /* @__PURE__ */ a(c, { variant: "solid", size: "medium", onClick: () => o(!0), children: [
        /* @__PURE__ */ e(n, { size: 14, className: "mr-2" }),
        "Open Command Palette"
      ] }),
      /* @__PURE__ */ a("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: [
        "Or press",
        " ",
        /* @__PURE__ */ e("kbd", { className: "px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono", children: "⌘K" }),
        " ",
        "anywhere on this page"
      ] })
    ] }) }) }),
    /* @__PURE__ */ e(
      d,
      {
        open: t,
        onOpenChange: o,
        items: m,
        placeholder: "Search commands, files, navigation…"
      }
    ),
    /* @__PURE__ */ e(
      g,
      {
        componentName: "MacOSCommandPalette",
        defaultValues: {
          placeholder: "Search or type a command…",
          triggerKey: "k"
        },
        controlOverrides: [
          { name: "placeholder", type: "text", description: "Search input placeholder" },
          { name: "triggerKey", type: "text", description: "Keyboard shortcut letter (Meta+key)" }
        ],
        includeProps: ["placeholder", "triggerKey"],
        excludeProps: ["className", "items", "open", "onOpenChange"],
        children: (l) => /* @__PURE__ */ e(C, { ...l })
      }
    ),
    /* @__PURE__ */ e(u, { componentName: "MacOSCommandPalette" }),
    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
      S,
      {
        language: "tsx",
        code: `import { MacOSCommandPalette } from '@e-burgos/tucu-ui';

const items = [
  {
    id: 'new-file',
    label: 'New File',
    group: 'File',
    shortcut: ['⌘', 'N'],
    icon: <FilePlusIcon />,
    onSelect: () => { /* … */ },
  },
  {
    id: 'settings',
    label: 'Settings',
    group: 'Navigation',
    shortcut: ['⌘', ','],
    onSelect: () => navigate('/settings'),
  },
];

function App() {
  const [open, setOpen] = useState(false);

  return (
    <MacOSCommandPalette
      items={items}
      placeholder="Search commands…"
      open={open}
      onOpenChange={setOpen}
      triggerKey="k"   // default: Meta+K
    />
  );
}`
      }
    ) }) }) })
  ] });
};
export {
  T as MacOSCommandPaletteSection,
  T as default
};
