impact-nova 2.1.0-alpha.7 → 2.1.0-alpha.8

package/dist/components/flows/command-palette/command-palette.js

@@ -1,18 +1,20 @@
-import { jsxs as c, jsx as e, Fragment as se } from "react/jsx-runtime";
-import * as n from "react";
-import * as P from "@radix-ui/react-dialog";
-import { Search as _ } from "impact-nova-icons";
-import { cn as l } from "../../../lib/utils.js";
-import { useCommandPalette as ie } from "./use-command-palette.js";
-import { Kbd as v } from "../../primitives/kbd/kbd.js";
-import { keybindingToSymbols as de } from "../../primitives/kbd/keybinding-display.js";
-import { buildCommandPaletteLayout as le } from "./command-palette-layout.js";
-import { COMMAND_SOURCE_LABELS as ce, fuzzyFilter as me } from "./utils.js";
-const ue = /* @__PURE__ */ new Set(["browser", "system", "ag-grid"]);
-function fe(o) {
-  return !!o && ue.has(o);
+import { jsxs as m, jsx as e, Fragment as ee } from "react/jsx-runtime";
+import * as o from "react";
+import * as E from "@radix-ui/react-dialog";
+import { Search as B } from "impact-nova-icons";
+import { cn as c } from "../../../lib/utils.js";
+import { createComponent as b } from "../../../lib/primitives/create-component.js";
+import { wrapRadixPart as H } from "../../../lib/primitives/create-compound.js";
+import { useCommandPalette as te } from "./use-command-palette.js";
+import { Kbd as P } from "../../primitives/kbd/kbd.js";
+import { keybindingToSymbols as ne } from "../../primitives/kbd/keybinding-display.js";
+import { buildCommandPaletteLayout as ae } from "./command-palette-layout.js";
+import { COMMAND_SOURCE_LABELS as re, fuzzyFilter as oe } from "./utils.js";
+const se = /* @__PURE__ */ new Set(["browser", "system", "ag-grid"]);
+function ie(r) {
+  return !!r && se.has(r);
 }
-const R = n.createContext({
+const I = o.createContext({
   query: "",
   setQuery: () => {
   },
@@ -22,93 +24,105 @@ const R = n.createContext({
   orderedCommands: [],
   onExecute: () => {
   }
-});
-function pe({
-  className: o,
-  children: a,
-  commands: r,
+}), de = H(
+  "command-palette",
+  "overlay",
+  "CommandPaletteOverlay",
+  E.Overlay,
+  "fixed inset-0 z-50 bg-scrim data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 motion-reduce:animate-none motion-reduce:transition-none"
+), le = H(
+  "command-palette",
+  "title",
+  "CommandPaletteTitle",
+  E.Title,
+  "sr-only"
+);
+function ce({
+  className: r,
+  children: n,
+  commands: a,
   placeholder: i = "Type a command or search...",
-  emptyTitle: m = "No results found",
-  emptyDescription: f = "Try a different search term",
-  recentGroupLabel: p = "Recently Used",
+  emptyTitle: l = "No results found",
+  emptyDescription: x = "Try a different search term",
+  recentGroupLabel: u = "Recently Used",
   defaultGroupLabel: d = "Commands",
-  navigateLabel: z = "Navigate",
-  runLabel: M = "Run",
-  closeLabel: D = "Close",
-  configureShortcutsLabel: O = "Configure Shortcuts",
+  navigateLabel: S = "Navigate",
+  runLabel: D = "Run",
+  closeLabel: O = "Close",
+  configureShortcutsLabel: T = "Configure Shortcuts",
   onCommandExecute: $,
   onOpenChange: A
 }) {
   const {
-    open: E,
+    open: R,
     setOpen: F,
-    getPaletteCommands: Z,
-    getEffectiveKeybinding: G,
-    registry: k
-  } = ie(), [y, j] = n.useState(""), [N, g] = n.useState(0), q = n.useRef(null), T = n.useRef(null), K = n.useMemo(() => (r ?? Z()).filter((s) => {
-    const u = s.source ?? "user";
-    return u === "user" || u === "ag-grid";
-  }), [r, E]), Q = n.useMemo(() => {
-    const t = me(
-      K,
+    getPaletteCommands: L,
+    getEffectiveKeybinding: V,
+    registry: v
+  } = te(), [y, j] = o.useState(""), [N, g] = o.useState(0), q = o.useRef(null), K = o.useRef(null), Q = o.useMemo(() => (a ?? L()).filter((s) => {
+    const p = s.source ?? "user";
+    return p === "user" || p === "ag-grid";
+  }), [a, R]), U = o.useMemo(() => {
+    const t = oe(
+      Q,
       y,
       (s) => `${s.category ? s.category + ": " : ""}${s.label}${s.description ? " " + s.description : ""}`
     );
     if (!y.trim()) {
-      const s = k.getRecentCommandIds(), u = new Set(s), x = [], C = [];
+      const s = v.getRecentCommandIds(), p = new Set(s), f = [], k = [];
       for (const h of t)
-        u.has(h.item.id) ? x.push(h) : C.push(h);
-      return x.sort(
-        (h, oe) => s.indexOf(h.item.id) - s.indexOf(oe.item.id)
-      ), [...x, ...C];
+        p.has(h.item.id) ? f.push(h) : k.push(h);
+      return f.sort(
+        (h, G) => s.indexOf(h.item.id) - s.indexOf(G.item.id)
+      ), [...f, ...k];
     }
     return t;
-  }, [K, y, k]), U = n.useMemo(
-    () => Q.map((t) => t.item),
-    [Q]
-  ), ee = n.useMemo(
-    () => le({
-      filteredCommands: U,
+  }, [Q, y, v]), _ = o.useMemo(
+    () => U.map((t) => t.item),
+    [U]
+  ), X = o.useMemo(
+    () => ae({
+      filteredCommands: _,
       emptyQuery: !y.trim(),
-      recentCommandIds: k.getRecentCommandIds(),
-      recentGroupLabel: p,
+      recentCommandIds: v.getRecentCommandIds(),
+      recentGroupLabel: u,
       defaultGroupLabel: d
     }),
-    [U, y, k, p, d]
-  ), { groups: te, orderedCommands: b } = ee, S = n.useRef({
-    ordered: b,
+    [_, y, v, u, d]
+  ), { groups: J, orderedCommands: C } = X, z = o.useRef({
+    ordered: C,
     index: N
   });
-  S.current = { ordered: b, index: N }, n.useEffect(() => {
-    E && (j(""), g(0), requestAnimationFrame(() => {
+  z.current = { ordered: C, index: N }, o.useEffect(() => {
+    R && (j(""), g(0), requestAnimationFrame(() => {
       q.current?.focus();
     }));
-  }, [E]);
-  const I = n.useCallback(
+  }, [R]);
+  const M = o.useCallback(
     (t) => {
       F(t), A?.(t);
     },
     [A, F]
-  ), w = n.useCallback(
+  ), w = o.useCallback(
     (t) => {
-      t.handler(), k.addRecentCommand(t.id), $?.(t), I(!1);
+      t.handler(), v.addRecentCommand(t.id), $?.(t), M(!1);
     },
-    [k, $, I]
-  ), ae = n.useCallback(
+    [v, $, M]
+  ), W = o.useCallback(
     (t) => {
-      const { ordered: s } = S.current, u = Math.max(s.length - 1, 0);
+      const { ordered: s } = z.current, p = Math.max(s.length - 1, 0);
       switch (t.key) {
         case "ArrowDown": {
-          t.preventDefault(), g((x) => Math.min(x + 1, u));
+          t.preventDefault(), g((f) => Math.min(f + 1, p));
           break;
         }
         case "ArrowUp": {
-          t.preventDefault(), g((x) => Math.max(x - 1, 0));
+          t.preventDefault(), g((f) => Math.max(f - 1, 0));
           break;
         }
         case "Enter": {
           t.preventDefault();
-          const { ordered: x, index: C } = S.current, h = x[C];
+          const { ordered: f, index: k } = z.current, h = f[k];
           h && w(h);
           break;
         }
@@ -117,20 +131,20 @@ function pe({
           break;
         }
         case "End": {
-          t.preventDefault(), g(u);
+          t.preventDefault(), g(p);
           break;
         }
       }
     },
     [w]
   );
-  n.useEffect(() => {
+  o.useEffect(() => {
     g(0);
-  }, [y]), n.useEffect(() => {
-    const t = b.length;
+  }, [y]), o.useEffect(() => {
+    const t = C.length;
     g((s) => t === 0 ? 0 : Math.min(s, t - 1));
-  }, [b.length]), n.useLayoutEffect(() => {
-    const t = T.current;
+  }, [C.length]), o.useLayoutEffect(() => {
+    const t = K.current;
     if (!t) return;
     const s = t.querySelector(
       '[data-selected="true"]'
@@ -141,50 +155,50 @@ function pe({
       behavior: "auto"
     });
   }, [N]);
-  const ne = n.useMemo(
+  const Y = o.useMemo(
     () => ({
       query: y,
       setQuery: j,
       selectedIndex: N,
       setSelectedIndex: g,
-      orderedCommands: b,
+      orderedCommands: C,
       onExecute: w,
       placeholder: i,
-      emptyTitle: m,
-      emptyDescription: f,
-      recentGroupLabel: p,
+      emptyTitle: l,
+      emptyDescription: x,
+      recentGroupLabel: u,
       defaultGroupLabel: d,
-      navigateLabel: z,
-      runLabel: M,
-      closeLabel: D,
-      configureShortcutsLabel: O
+      navigateLabel: S,
+      runLabel: D,
+      closeLabel: O,
+      configureShortcutsLabel: T
     }),
     [
       y,
       N,
-      b,
+      C,
       w,
       i,
-      m,
-      f,
-      p,
+      l,
+      x,
+      u,
       d,
-      z,
-      M,
+      S,
       D,
-      O
+      O,
+      T
     ]
-  ), re = n.Children.count(a) > 0;
-  return /* @__PURE__ */ e(P.Root, { open: E, onOpenChange: I, children: /* @__PURE__ */ c(P.Portal, { children: [
-    /* @__PURE__ */ e(P.Overlay, { className: "fixed inset-0 z-50 bg-scrim data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 motion-reduce:animate-none motion-reduce:transition-none" }),
-    /* @__PURE__ */ c(
-      P.Content,
+  ), Z = o.Children.count(n) > 0;
+  return /* @__PURE__ */ e(E.Root, { open: R, onOpenChange: M, children: /* @__PURE__ */ m(E.Portal, { children: [
+    /* @__PURE__ */ e(de, {}),
+    /* @__PURE__ */ m(
+      E.Content,
       {
         "aria-describedby": void 0,
         "data-command-palette": !0,
         "data-component": "command-palette",
-        onKeyDown: ae,
-        className: l(
+        onKeyDown: W,
+        className: c(
           "fixed left-[50%] top-[20%] z-50 w-full max-w-[640px] -translate-x-1/2",
           "rounded-xl border border-stroke-hairline bg-canvas-elevated shadow-2xl overflow-hidden",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
@@ -194,69 +208,69 @@ function pe({
           // Pin translate-x at -50% during animation so it stays centered (no horizontal slide)
           "data-[state=open]:slide-in-from-left-1/2 data-[state=closed]:slide-out-to-left-1/2",
           "duration-150",
-          o
+          r
         ),
         style: { transformOrigin: "top center" },
         children: [
-          /* @__PURE__ */ e(P.Title, { className: "sr-only", children: "Command Palette" }),
-          /* @__PURE__ */ e(R.Provider, { value: ne, children: re ? a : /* @__PURE__ */ c(se, { children: [
-            /* @__PURE__ */ e(B, { ref: q, placeholder: i }),
-            /* @__PURE__ */ e(H, { ref: T, children: b.length === 0 ? /* @__PURE__ */ e(J, {}) : te.map((t, s) => /* @__PURE__ */ c(
-              n.Fragment,
+          /* @__PURE__ */ e(le, { children: "Command Palette" }),
+          /* @__PURE__ */ e(I.Provider, { value: Y, children: Z ? n : /* @__PURE__ */ m(ee, { children: [
+            /* @__PURE__ */ e(me, { ref: q, placeholder: i }),
+            /* @__PURE__ */ e(ue, { ref: K, children: C.length === 0 ? /* @__PURE__ */ e(ge, {}) : J.map((t, s) => /* @__PURE__ */ m(
+              o.Fragment,
               {
                 children: [
-                  s > 0 && /* @__PURE__ */ e(W, {}),
-                  /* @__PURE__ */ e(L, { heading: t.heading, children: t.items.map((u, x) => {
-                    const C = t.rowStart + x, h = G(u.id);
+                  s > 0 && /* @__PURE__ */ e(ye, {}),
+                  /* @__PURE__ */ e(pe, { heading: t.heading, children: t.items.map((p, f) => {
+                    const k = t.rowStart + f, h = V(p.id);
                     return /* @__PURE__ */ e(
-                      V,
+                      xe,
                       {
-                        command: u,
-                        isSelected: C === N,
-                        onSelect: () => w(u),
-                        onMouseEnter: () => g(C),
+                        command: p,
+                        isSelected: k === N,
+                        onSelect: () => w(p),
+                        onMouseEnter: () => g(k),
                         keybinding: h
                       },
-                      u.id
+                      p.id
                     );
                   }) })
                 ]
               },
               `${t.heading}-${t.rowStart}`
             )) }),
-            /* @__PURE__ */ e(Y, {})
+            /* @__PURE__ */ e(be, {})
           ] }) })
         ]
       }
     )
   ] }) });
 }
-pe.displayName = "CommandPalette";
-const B = n.forwardRef(({ className: o, placeholder: a, onValueChange: r, ...i }, m) => {
-  const { query: f, setQuery: p } = n.useContext(R);
-  return /* @__PURE__ */ c(
+ce.displayName = "CommandPalette";
+const me = b("CommandPaletteInput", ({ className: r, placeholder: n, onValueChange: a, ...i }, l) => {
+  const { query: x, setQuery: u } = o.useContext(I);
+  return /* @__PURE__ */ m(
     "div",
     {
-      className: l(
+      className: c(
         "flex items-center gap-3 border-b border-stroke-hairline px-4",
-        o
+        r
       ),
       "data-command-palette-input": !0,
       children: [
-        /* @__PURE__ */ e(_, { className: "h-4 w-4 shrink-0 text-content-icon" }),
+        /* @__PURE__ */ e(B, { className: "h-4 w-4 shrink-0 text-content-icon" }),
         /* @__PURE__ */ e(
           "input",
           {
-            ref: m,
-            value: f,
+            ref: l,
+            value: x,
             onChange: (d) => {
-              p(d.target.value), r?.(d.target.value);
+              u(d.target.value), a?.(d.target.value);
             },
-            placeholder: a,
+            placeholder: n,
             autoComplete: "off",
             autoCorrect: "off",
             spellCheck: !1,
-            className: l(
+            className: c(
               "flex h-12 w-full bg-transparent py-3 text-sm font-medium outline-none",
               "placeholder:text-content-placeholder"
             ),
@@ -264,7 +278,7 @@ const B = n.forwardRef(({ className: o, placeholder: a, onValueChange: r, ...i }
           }
         ),
         /* @__PURE__ */ e(
-          v,
+          P,
           {
             keybinding: { key: "Escape" },
             size: "sm",
@@ -275,117 +289,112 @@ const B = n.forwardRef(({ className: o, placeholder: a, onValueChange: r, ...i }
       ]
     }
   );
-});
-B.displayName = "CommandPaletteInput";
-const H = n.forwardRef(({ className: o, children: a, ...r }, i) => /* @__PURE__ */ e(
+}), ue = b("CommandPaletteList", ({ className: r, children: n, ...a }, i) => /* @__PURE__ */ e(
   "div",
   {
     ref: i,
     role: "listbox",
     "data-command-palette-list": !0,
-    className: l(
+    className: c(
       "max-h-[360px] overflow-y-auto overscroll-contain py-1",
-      o
+      r
     ),
-    ...r,
-    children: a
+    ...a,
+    children: n
   }
-));
-H.displayName = "CommandPaletteList";
-const L = n.forwardRef(({ className: o, heading: a, children: r, ...i }, m) => /* @__PURE__ */ c(
+)), pe = b("CommandPaletteGroup", ({ className: r, heading: n, children: a, ...i }, l) => /* @__PURE__ */ m(
   "div",
   {
-    ref: m,
+    ref: l,
     role: "group",
-    "aria-label": a,
+    "aria-label": n,
     "data-command-palette-group": !0,
-    className: l("py-1", o),
+    className: c("py-1", r),
     ...i,
     children: [
-      a && /* @__PURE__ */ e("div", { className: "px-4 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-secondary-foreground", children: a }),
-      r
+      n && /* @__PURE__ */ e("div", { className: "px-4 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-secondary-foreground", children: n }),
+      a
     ]
   }
 ));
-L.displayName = "CommandPaletteGroup";
-function xe({
-  source: o,
-  isSelected: a
+function fe({
+  source: r,
+  isSelected: n
 }) {
-  if (!o || o === "user") return null;
-  const r = ce[o];
-  return r ? /* @__PURE__ */ e(
+  if (!r || r === "user") return null;
+  const a = re[r];
+  return a ? /* @__PURE__ */ e(
     "span",
     {
-      className: l(
+      className: c(
         "shrink-0 rounded px-1.5 py-px text-[9px] font-medium leading-tight tracking-wide",
-        a ? "text-brand-foreground/50" : "text-secondary-foreground border border-stroke-hairline"
+        n ? "text-brand-foreground/50" : "text-secondary-foreground border border-stroke-hairline"
       ),
-      children: r
+      children: a
     }
   ) : null;
 }
-const V = n.memo(
-  n.forwardRef(
-    ({ className: o, command: a, isSelected: r, onSelect: i, keybinding: m, ...f }, p) => {
-      const d = fe(a.source);
-      return /* @__PURE__ */ c(
+const xe = o.memo(
+  b(
+    "CommandPaletteItem",
+    ({ className: r, command: n, isSelected: a, onSelect: i, keybinding: l, ...x }, u) => {
+      const d = ie(n.source);
+      return /* @__PURE__ */ m(
         "div",
         {
-          ref: p,
+          ref: u,
           role: "option",
-          "aria-selected": r,
-          "data-selected": r,
+          "aria-selected": a,
+          "data-selected": a,
           "data-command-palette-item": !0,
-          "data-command-id": a.id,
+          "data-command-id": n.id,
           onClick: i,
-          className: l(
+          className: c(
             "flex items-center gap-3 cursor-pointer px-4 py-2 text-sm",
-            // Smooth selection shift; scroll-margin keeps row clear of list edges when scrolling into view
             "transition-[color,background-color] duration-150 ease-out [scroll-margin-block:6px]",
-            r ? "bg-brand text-brand-foreground" : d ? "text-secondary-foreground hover:bg-canvas-muted" : "text-content-charcoal hover:bg-canvas-muted",
-            o
+            a ? "bg-brand text-brand-foreground" : d ? "text-secondary-foreground hover:bg-canvas-muted" : "text-content-charcoal hover:bg-canvas-muted",
+            r
           ),
-          ...f,
+          ...x,
           children: [
-            a.icon && /* @__PURE__ */ e(
+            n.icon && /* @__PURE__ */ e(
               "span",
               {
-                className: l(
+                className: c(
                   "flex h-4 w-4 shrink-0 items-center justify-center",
-                  r ? "text-brand-foreground" : d ? "text-stroke-hairline" : "text-secondary-foreground"
+                  a ? "text-brand-foreground" : d ? "text-stroke-hairline" : "text-secondary-foreground"
                 ),
-                children: a.icon
+                children: n.icon
               }
             ),
-            /* @__PURE__ */ c("div", { className: "flex flex-1 flex-col min-w-0", children: [
+            /* @__PURE__ */ m("div", { className: "flex flex-1 flex-col min-w-0", children: [
               /* @__PURE__ */ e(
                 "span",
                 {
-                  className: l(
+                  className: c(
                     "truncate",
-                    d && !r ? "font-normal" : "font-medium"
+                    d && !a ? "font-normal" : "font-medium"
                   ),
-                  children: a.label
+                  children: n.label
                 }
               ),
-              a.description && /* @__PURE__ */ e(
+              n.description && /* @__PURE__ */ e(
                 "span",
                 {
-                  className: l(
+                  className: c(
                     "truncate text-xs",
-                    r ? "text-brand-foreground/70" : d ? "text-stroke-hairline" : "text-secondary-foreground"
+                    a ? "text-brand-foreground/70" : d ? "text-stroke-hairline" : "text-secondary-foreground"
                   ),
-                  children: a.description
+                  children: n.description
                 }
               )
             ] }),
-            /* @__PURE__ */ e(xe, { source: a.source, isSelected: r }),
-            m && /* @__PURE__ */ e(
-              X,
+            /* @__PURE__ */ e(fe, { source: n.source, isSelected: a }),
+            l && /* @__PURE__ */ e(
+              he,
               {
-                keybinding: m,
-                isSelected: r,
+                keybinding: l,
+                isSelected: a,
                 external: d
               }
             )
@@ -394,120 +403,98 @@ const V = n.memo(
       );
     }
   )
-);
-V.displayName = "CommandPaletteItem";
-function X({
-  keybinding: o,
-  isSelected: a,
-  external: r,
-  className: i,
-  ...m
-}) {
-  const f = de(o);
+), he = b("CommandPaletteShortcut", ({ keybinding: r, isSelected: n, external: a, className: i, ...l }, x) => {
+  const u = ne(r);
   return /* @__PURE__ */ e(
     "span",
     {
-      className: l("ms-auto flex items-center gap-0.5 shrink-0", i),
+      ref: x,
+      className: c("ms-auto flex items-center gap-0.5 shrink-0", i),
       "data-command-palette-shortcut": !0,
-      ...m,
-      children: f.map((p, d) => /* @__PURE__ */ e(
+      ...l,
+      children: u.map((d, S) => /* @__PURE__ */ e(
         "kbd",
         {
-          className: l(
+          className: c(
             "inline-flex min-w-[20px] items-center justify-center rounded px-1 h-[20px] text-[10px] font-mono leading-none",
             "transition-[color,background-color,border-color] duration-150 ease-out",
-            a ? "bg-canvas-elevated/20 text-brand-foreground border border-brand-foreground/30" : r ? "bg-canvas-muted text-stroke-hairline border border-stroke-hairline" : "bg-canvas-muted text-secondary-foreground border border-stroke-hairline"
+            n ? "bg-canvas-elevated/20 text-brand-foreground border border-brand-foreground/30" : a ? "bg-canvas-muted text-stroke-hairline border border-stroke-hairline" : "bg-canvas-muted text-secondary-foreground border border-stroke-hairline"
           ),
-          children: p
+          children: d
         },
-        `${p}-${d}`
+        `${d}-${S}`
       ))
     }
   );
-}
-X.displayName = "CommandPaletteShortcut";
-function J({
-  className: o,
-  ...a
-}) {
-  const { emptyTitle: r, emptyDescription: i } = n.useContext(R);
-  return /* @__PURE__ */ c(
+}), ge = b("CommandPaletteEmpty", ({ className: r, ...n }, a) => {
+  const { emptyTitle: i, emptyDescription: l } = o.useContext(I);
+  return /* @__PURE__ */ m(
     "div",
     {
+      ref: a,
       "data-command-palette-empty": !0,
-      className: l(
+      className: c(
         "flex flex-col items-center justify-center py-12 text-center text-sm text-secondary-foreground",
-        o
+        r
       ),
-      ...a,
+      ...n,
       children: [
-        /* @__PURE__ */ e(_, { className: "h-8 w-8 mb-3 text-stroke-hairline" }),
-        /* @__PURE__ */ e("p", { className: "font-medium", children: r }),
-        /* @__PURE__ */ e("p", { className: "text-xs mt-1", children: i })
+        /* @__PURE__ */ e(B, { className: "h-8 w-8 mb-3 text-stroke-hairline" }),
+        /* @__PURE__ */ e("p", { className: "font-medium", children: i }),
+        /* @__PURE__ */ e("p", { className: "text-xs mt-1", children: l })
       ]
     }
   );
-}
-J.displayName = "CommandPaletteEmpty";
-function W({
-  className: o,
-  ...a
-}) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      "data-command-palette-separator": !0,
-      className: l("h-px bg-stroke-hairline mx-2", o),
-      ...a
-    }
-  );
-}
-W.displayName = "CommandPaletteSeparator";
-function Y({
-  className: o,
-  ...a
-}) {
-  const { navigateLabel: r, runLabel: i, closeLabel: m, configureShortcutsLabel: f } = n.useContext(R);
-  return /* @__PURE__ */ c(
+}), ye = b("CommandPaletteSeparator", ({ className: r, ...n }, a) => /* @__PURE__ */ e(
+  "div",
+  {
+    ref: a,
+    "data-command-palette-separator": !0,
+    className: c("h-px bg-stroke-hairline mx-2", r),
+    ...n
+  }
+)), be = b("CommandPaletteFooter", ({ className: r, ...n }, a) => {
+  const { navigateLabel: i, runLabel: l, closeLabel: x, configureShortcutsLabel: u } = o.useContext(I);
+  return /* @__PURE__ */ m(
     "div",
     {
+      ref: a,
       "data-command-palette-footer": !0,
-      className: l(
+      className: c(
         "flex items-center gap-4 border-t border-stroke-hairline px-4 py-2 text-[11px] text-secondary-foreground",
-        o
+        r
       ),
-      ...a,
+      ...n,
       children: [
-        /* @__PURE__ */ c("span", { className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ e(v, { keys: ["↑"], size: "sm", variant: "muted" }),
-          /* @__PURE__ */ e(v, { keys: ["↓"], size: "sm", variant: "muted" }),
-          /* @__PURE__ */ e("span", { children: r })
-        ] }),
-        /* @__PURE__ */ c("span", { className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ e(v, { keys: ["↵"], size: "sm", variant: "muted" }),
+        /* @__PURE__ */ m("span", { className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ e(P, { keys: ["↑"], size: "sm", variant: "muted" }),
+          /* @__PURE__ */ e(P, { keys: ["↓"], size: "sm", variant: "muted" }),
           /* @__PURE__ */ e("span", { children: i })
         ] }),
-        /* @__PURE__ */ c("span", { className: "inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ e(v, { keys: ["Escape"], size: "sm", variant: "muted" }),
-          /* @__PURE__ */ e("span", { children: m })
+        /* @__PURE__ */ m("span", { className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ e(P, { keys: ["↵"], size: "sm", variant: "muted" }),
+          /* @__PURE__ */ e("span", { children: l })
         ] }),
-        f && /* @__PURE__ */ c("span", { className: "ms-auto inline-flex items-center gap-1", children: [
-          /* @__PURE__ */ e(v, { keybinding: { key: "k", alt: !0 }, size: "sm", variant: "muted" }),
-          /* @__PURE__ */ e("span", { children: f })
+        /* @__PURE__ */ m("span", { className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ e(P, { keys: ["Escape"], size: "sm", variant: "muted" }),
+          /* @__PURE__ */ e("span", { children: x })
+        ] }),
+        u && /* @__PURE__ */ m("span", { className: "ms-auto inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ e(P, { keybinding: { key: "k", alt: !0 }, size: "sm", variant: "muted" }),
+          /* @__PURE__ */ e("span", { children: u })
         ] })
       ]
     }
   );
-}
-Y.displayName = "CommandPaletteFooter";
+});
 export {
-  pe as CommandPalette,
-  J as CommandPaletteEmpty,
-  Y as CommandPaletteFooter,
-  L as CommandPaletteGroup,
-  B as CommandPaletteInput,
-  V as CommandPaletteItem,
-  H as CommandPaletteList,
-  W as CommandPaletteSeparator,
-  X as CommandPaletteShortcut
+  ce as CommandPalette,
+  ge as CommandPaletteEmpty,
+  be as CommandPaletteFooter,
+  pe as CommandPaletteGroup,
+  me as CommandPaletteInput,
+  xe as CommandPaletteItem,
+  ue as CommandPaletteList,
+  ye as CommandPaletteSeparator,
+  he as CommandPaletteShortcut
 };