@craftzbay/ui 0.10.0 → 0.11.1

package/dist-lib/components/ui/CommandPalette.js

@@ -1,174 +1,179 @@
 "use client";
-import { jsx as n, jsxs as l } from "react/jsx-runtime";
-import { forwardRef as d, useState as p, useEffect as f } from "react";
+import { jsx as a, jsxs as u } from "react/jsx-runtime";
+import { forwardRef as d, useRef as x, useEffect as y } from "react";
 import { Command as m } from "cmdk";
-import * as i from "@radix-ui/react-dialog";
-import { Search as g } from "../../icons/index.js";
+import * as l from "@radix-ui/react-dialog";
+import { Search as C } from "../../icons/index.js";
 import { cn as r } from "../../lib/utils.js";
-import { useStrings as x } from "../../hooks/use-strings.js";
-const u = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ n(
+import { useStrings as p } from "../../hooks/use-strings.js";
+const f = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ a(
     m,
     {
       ref: o,
       className: r(
-        "flex h-full w-full flex-col overflow-hidden rounded-lg bg-popover text-popover-foreground",
-        e
+        "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-lg",
+        t
       ),
-      ...t
+      ...e
     }
   );
 });
-u.displayName = "Command";
-const y = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ l("div", { className: "flex items-center gap-2 border-b border-border px-3", "cmdk-input-wrapper": "", children: [
-    /* @__PURE__ */ n(g, { className: "size-4 shrink-0 text-foreground-subtle", "aria-hidden": !0 }),
-    /* @__PURE__ */ n(
+f.displayName = "Command";
+const b = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ u("div", { className: "border-border flex items-center gap-2 border-b px-3", "cmdk-input-wrapper": "", children: [
+    /* @__PURE__ */ a(C, { className: "text-foreground-subtle size-4 shrink-0", "aria-hidden": !0 }),
+    /* @__PURE__ */ a(
       m.Input,
       {
         ref: o,
         className: r(
-          "flex h-11 w-full bg-transparent py-3 text-sm outline-none",
+          "flex h-11 w-full bg-transparent py-3 text-lg outline-none md:text-sm",
           "placeholder:text-foreground-subtle disabled:cursor-not-allowed disabled:opacity-50",
-          e
+          t
         ),
-        ...t
+        ...e
       }
     )
   ] });
 });
-y.displayName = "CommandInput";
-const b = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ n(
+b.displayName = "CommandInput";
+const h = d(function({ className: t, label: e, ...o }, i) {
+  const s = p();
+  return /* @__PURE__ */ a(
     m.List,
     {
-      ref: o,
-      className: r("max-h-[320px] overflow-y-auto p-1", e),
-      ...t
+      ref: i,
+      label: e ?? s.command.suggestions,
+      className: r("max-h-[320px] overflow-y-auto p-1", t),
+      ...o
     }
   );
 });
-b.displayName = "CommandList";
-const C = d(function(e, t) {
-  return /* @__PURE__ */ n(
+h.displayName = "CommandList";
+const v = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ a(
     m.Empty,
     {
-      ref: t,
-      className: "py-8 text-center text-sm text-foreground-subtle",
+      ref: o,
+      className: r("text-foreground-subtle py-8 text-center text-sm", t),
       ...e
     }
   );
 });
-C.displayName = "CommandEmpty";
-const h = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ n(
+v.displayName = "CommandEmpty";
+const N = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ a(
     m.Group,
     {
       ref: o,
       className: r(
-        "overflow-hidden text-foreground p-1",
+        "text-foreground overflow-hidden p-1",
         "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5",
         "[&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",
         "[&_[cmdk-group-heading]]:text-foreground-subtle",
-        e
+        t
       ),
-      ...t
+      ...e
     }
   );
 });
-h.displayName = "CommandGroup";
-const v = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ n(
-    m.Separator,
-    {
-      ref: o,
-      className: r("-mx-1 my-1 h-px bg-border", e),
-      ...t
-    }
-  );
+N.displayName = "CommandGroup";
+const w = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ a(m.Separator, { ref: o, asChild: !0, ...e, children: /* @__PURE__ */ a("div", { role: "none", className: r("bg-border -mx-1 my-1 h-px", t) }) });
 });
-v.displayName = "CommandSeparator";
-const N = d(function({ className: e, ...t }, o) {
-  return /* @__PURE__ */ n(
+w.displayName = "CommandSeparator";
+const k = d(function({ className: t, ...e }, o) {
+  return /* @__PURE__ */ a(
     m.Item,
     {
       ref: o,
       className: r(
-        "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-foreground outline-none",
+        "text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none",
         "data-[selected=true]:bg-background-muted data-[selected=true]:text-foreground",
         "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
-        "[&_svg]:size-4 [&_svg]:text-foreground-subtle",
-        e
+        "[&_svg]:text-foreground-subtle [&_svg]:size-4",
+        t
       ),
-      ...t
+      ...e
     }
   );
 });
-N.displayName = "CommandItem";
-function E({ children: a, className: e }) {
-  return /* @__PURE__ */ n(
+k.displayName = "CommandItem";
+function S({
+  children: n,
+  className: t
+}) {
+  return /* @__PURE__ */ a(
     "span",
     {
       className: r(
-        "ml-auto inline-flex items-center gap-0.5 text-xs tracking-widest text-foreground-subtle font-mono",
-        e
+        "text-foreground-subtle ml-auto inline-flex items-center gap-0.5 font-mono text-xs tracking-widest",
+        t
       ),
-      children: a
+      children: n
     }
   );
 }
-function L({ open: a, onOpenChange: e, children: t, title: o }) {
-  const s = x();
-  return /* @__PURE__ */ n(i.Root, { open: a, onOpenChange: e, children: /* @__PURE__ */ l(i.Portal, { children: [
-    /* @__PURE__ */ n(
-      i.Overlay,
+S.displayName = "CommandShortcut";
+function K({ open: n, onOpenChange: t, children: e, title: o }) {
+  const i = p(), s = x(null);
+  return /* @__PURE__ */ a(l.Root, { open: n, onOpenChange: t, children: /* @__PURE__ */ u(l.Portal, { children: [
+    /* @__PURE__ */ a(
+      l.Overlay,
       {
         className: r(
-          "fixed inset-0 z-[var(--z-overlay)] bg-overlay",
+          "bg-overlay fixed inset-0 z-[var(--z-overlay)]",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
           "data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0"
         )
       }
     ),
-    /* @__PURE__ */ l(
-      i.Content,
+    /* @__PURE__ */ u(
+      l.Content,
       {
         "aria-describedby": void 0,
+        onOpenAutoFocus: () => {
+          s.current = document.activeElement;
+        },
+        onCloseAutoFocus: (g) => {
+          var c;
+          g.preventDefault(), (c = s.current) == null || c.focus(), s.current = null;
+        },
         className: r(
-          "fixed left-1/2 top-[20%] z-[var(--z-modal)] -translate-x-1/2",
+          "fixed top-[20%] left-1/2 z-[var(--z-modal)] -translate-x-1/2",
           "w-[calc(100%-2rem)] max-w-[640px] overflow-hidden",
-          "rounded-lg border border-border bg-popover text-popover-foreground shadow-lg",
+          "border-border bg-popover text-popover-foreground rounded-lg border shadow-lg",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
           "data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0",
           "data-[state=open]:zoom-in-95 data-[state=closed]:zoom-out-95"
         ),
         children: [
-          /* @__PURE__ */ n(i.Title, { className: "sr-only", children: o ?? s.commandDialog.title }),
-          /* @__PURE__ */ n(u, { children: t })
+          /* @__PURE__ */ a(l.Title, { className: "sr-only", children: o ?? i.commandDialog.title }),
+          /* @__PURE__ */ a(f, { children: e })
         ]
       }
     )
   ] }) });
 }
-function D(a) {
-  const [e, t] = p(0);
-  f(() => {
-    const o = (s) => {
-      s.key === "k" && (s.metaKey || s.ctrlKey) && (s.preventDefault(), a(!0), t((c) => c + 1));
+function G(n) {
+  y(() => {
+    const t = (e) => {
+      (e.key === "k" || e.key === "K") && (e.metaKey || e.ctrlKey) && !e.altKey && (e.preventDefault(), n((o) => !o));
     };
-    return window.addEventListener("keydown", o), () => window.removeEventListener("keydown", o);
-  }, [a]);
+    return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
+  }, [n]);
 }
 export {
-  u as Command,
-  L as CommandDialog,
-  C as CommandEmpty,
-  h as CommandGroup,
-  y as CommandInput,
-  N as CommandItem,
-  b as CommandList,
-  v as CommandSeparator,
-  E as CommandShortcut,
-  D as useCommandPaletteShortcut
+  f as Command,
+  K as CommandDialog,
+  v as CommandEmpty,
+  N as CommandGroup,
+  b as CommandInput,
+  k as CommandItem,
+  h as CommandList,
+  w as CommandSeparator,
+  S as CommandShortcut,
+  G as useCommandPaletteShortcut
 };
 //# sourceMappingURL=CommandPalette.js.map

package/dist-lib/components/ui/CommandPalette.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPalette.js","sources":["../../../src/components/ui/CommandPalette.tsx"],"sourcesContent":["'use client';\n\nimport {\n  forwardRef,\n  useEffect,\n  useState,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n  type ReactNode,\n} from 'react';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Search } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\n\n/* -----------------------------------------------------------------------------\n *  CommandPalette is a Dialog hosting a `cmdk` Command. It supports grouped\n *  items, keyboard navigation (handled by cmdk), an empty state, and a\n *  pluggable list of \"recent\" items shown when the search input is empty.\n * --------------------------------------------------------------------------- */\n\nexport const Command = forwardRef<\n  ElementRef<typeof CommandPrimitive>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(function Command({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive\n      ref={ref}\n      className={cn(\n        'flex h-full w-full flex-col overflow-hidden rounded-lg bg-popover text-popover-foreground',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommand.displayName = 'Command';\n\nexport const CommandInput = forwardRef<\n  ElementRef<typeof CommandPrimitive.Input>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(function CommandInput({ className, ...props }, ref) {\n  return (\n    <div className=\"flex items-center gap-2 border-b border-border px-3\" cmdk-input-wrapper=\"\">\n      <Search className=\"size-4 shrink-0 text-foreground-subtle\" aria-hidden />\n      <CommandPrimitive.Input\n        ref={ref}\n        className={cn(\n          'flex h-11 w-full bg-transparent py-3 text-sm outline-none',\n          'placeholder:text-foreground-subtle disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n});\nCommandInput.displayName = 'CommandInput';\n\nexport const CommandList = forwardRef<\n  ElementRef<typeof CommandPrimitive.List>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(function CommandList({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.List\n      ref={ref}\n      className={cn('max-h-[320px] overflow-y-auto p-1', className)}\n      {...props}\n    />\n  );\n});\nCommandList.displayName = 'CommandList';\n\nexport const CommandEmpty = forwardRef<\n  ElementRef<typeof CommandPrimitive.Empty>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>(function CommandEmpty(props, ref) {\n  return (\n    <CommandPrimitive.Empty\n      ref={ref}\n      className=\"py-8 text-center text-sm text-foreground-subtle\"\n      {...props}\n    />\n  );\n});\nCommandEmpty.displayName = 'CommandEmpty';\n\nexport const CommandGroup = forwardRef<\n  ElementRef<typeof CommandPrimitive.Group>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(function CommandGroup({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Group\n      ref={ref}\n      className={cn(\n        'overflow-hidden text-foreground p-1',\n        '[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5',\n        '[&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',\n        '[&_[cmdk-group-heading]]:text-foreground-subtle',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommandGroup.displayName = 'CommandGroup';\n\nexport const CommandSeparator = forwardRef<\n  ElementRef<typeof CommandPrimitive.Separator>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(function CommandSeparator({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Separator\n      ref={ref}\n      className={cn('-mx-1 my-1 h-px bg-border', className)}\n      {...props}\n    />\n  );\n});\nCommandSeparator.displayName = 'CommandSeparator';\n\nexport const CommandItem = forwardRef<\n  ElementRef<typeof CommandPrimitive.Item>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(function CommandItem({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Item\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-foreground outline-none',\n        'data-[selected=true]:bg-background-muted data-[selected=true]:text-foreground',\n        'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n        '[&_svg]:size-4 [&_svg]:text-foreground-subtle',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommandItem.displayName = 'CommandItem';\n\nexport function CommandShortcut({ children, className }: { children: ReactNode; className?: string }) {\n  return (\n    <span\n      className={cn(\n        'ml-auto inline-flex items-center gap-0.5 text-xs tracking-widest text-foreground-subtle font-mono',\n        className,\n      )}\n    >\n      {children}\n    </span>\n  );\n}\n\n/* -----------------------------------------------------------------------------\n *  Dialog wrapper — a ready-to-use ⌘K palette.\n * --------------------------------------------------------------------------- */\n\nexport interface CommandDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  children: ReactNode;\n  /** Visible label for screen readers. */\n  title?: string;\n}\n\nexport function CommandDialog({ open, onOpenChange, children, title }: CommandDialogProps) {\n  const strings = useStrings();\n  return (\n    <DialogPrimitive.Root open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal>\n        <DialogPrimitive.Overlay\n          className={cn(\n            'fixed inset-0 z-[var(--z-overlay)] bg-overlay',\n            'data-[state=open]:animate-in data-[state=closed]:animate-out',\n            'data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0',\n          )}\n        />\n        <DialogPrimitive.Content\n          aria-describedby={undefined}\n          className={cn(\n            'fixed left-1/2 top-[20%] z-[var(--z-modal)] -translate-x-1/2',\n            'w-[calc(100%-2rem)] max-w-[640px] overflow-hidden',\n            'rounded-lg border border-border bg-popover text-popover-foreground shadow-lg',\n            'data-[state=open]:animate-in data-[state=closed]:animate-out',\n            'data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0',\n            'data-[state=open]:zoom-in-95 data-[state=closed]:zoom-out-95',\n          )}\n        >\n          <DialogPrimitive.Title className=\"sr-only\">\n            {title ?? strings.commandDialog.title}\n          </DialogPrimitive.Title>\n          <Command>{children}</Command>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n}\n\n/**\n * Hook that wires ⌘K / Ctrl+K to a setter — the canonical way to mount the\n * palette in an app shell.\n *\n * @example\n *   const [open, setOpen] = useState(false);\n *   useCommandPaletteShortcut(setOpen);\n *   …\n *   <CommandDialog open={open} onOpenChange={setOpen}>\n *     <CommandInput placeholder=\"Type a command…\" />\n *     <CommandList>\n *       <CommandEmpty>No results.</CommandEmpty>\n *       <CommandGroup heading=\"Suggestions\">\n *         <CommandItem>Create project</CommandItem>\n *         <CommandItem>Invite teammate</CommandItem>\n *       </CommandGroup>\n *     </CommandList>\n *   </CommandDialog>\n *\n * @do Group items by category. Show \"Recent\" first when the query is empty.\n * @dont Hide essential actions behind the palette only — keep at least one\n *       button entry in the UI.\n */\nexport function useCommandPaletteShortcut(setOpen: (open: boolean) => void): void {\n  const [_, force] = useState(0);\n  useEffect(() => {\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key === 'k' && (e.metaKey || e.ctrlKey)) {\n        e.preventDefault();\n        setOpen(true);\n        force((n) => n + 1);\n      }\n    };\n    window.addEventListener('keydown', onKey);\n    return () => window.removeEventListener('keydown', onKey);\n  }, [setOpen]);\n}\n"],"names":["Command","forwardRef","className","props","ref","jsx","CommandPrimitive","cn","CommandInput","jsxs","Search","CommandList","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","children","CommandDialog","open","onOpenChange","title","strings","useStrings","DialogPrimitive","useCommandPaletteShortcut","setOpen","_","force","useState","useEffect","onKey","e","n"],"mappings":"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"}
+{"version":3,"file":"CommandPalette.js","sources":["../../../src/components/ui/CommandPalette.tsx"],"sourcesContent":["'use client';\n\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  type ComponentPropsWithoutRef,\n  type Dispatch,\n  type ElementRef,\n  type ReactNode,\n  type SetStateAction,\n} from 'react';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Search } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\n\n/* -----------------------------------------------------------------------------\n *  CommandPalette is a Dialog hosting a `cmdk` Command. It supports grouped\n *  items, keyboard navigation (handled by cmdk), an empty state, and a\n *  pluggable list of \"recent\" items shown when the search input is empty.\n * --------------------------------------------------------------------------- */\n\nexport const Command = forwardRef<\n  ElementRef<typeof CommandPrimitive>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(function Command({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive\n      ref={ref}\n      className={cn(\n        'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-lg',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommand.displayName = 'Command';\n\nexport const CommandInput = forwardRef<\n  ElementRef<typeof CommandPrimitive.Input>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(function CommandInput({ className, ...props }, ref) {\n  return (\n    <div className=\"border-border flex items-center gap-2 border-b px-3\" cmdk-input-wrapper=\"\">\n      <Search className=\"text-foreground-subtle size-4 shrink-0\" aria-hidden />\n      <CommandPrimitive.Input\n        ref={ref}\n        className={cn(\n          'flex h-11 w-full bg-transparent py-3 text-lg outline-none md:text-sm',\n          'placeholder:text-foreground-subtle disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n});\nCommandInput.displayName = 'CommandInput';\n\nexport const CommandList = forwardRef<\n  ElementRef<typeof CommandPrimitive.List>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(function CommandList({ className, label, ...props }, ref) {\n  const strings = useStrings();\n  return (\n    <CommandPrimitive.List\n      ref={ref}\n      label={label ?? strings.command.suggestions}\n      className={cn('max-h-[320px] overflow-y-auto p-1', className)}\n      {...props}\n    />\n  );\n});\nCommandList.displayName = 'CommandList';\n\nexport const CommandEmpty = forwardRef<\n  ElementRef<typeof CommandPrimitive.Empty>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>(function CommandEmpty({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Empty\n      ref={ref}\n      className={cn('text-foreground-subtle py-8 text-center text-sm', className)}\n      {...props}\n    />\n  );\n});\nCommandEmpty.displayName = 'CommandEmpty';\n\nexport const CommandGroup = forwardRef<\n  ElementRef<typeof CommandPrimitive.Group>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(function CommandGroup({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Group\n      ref={ref}\n      className={cn(\n        'text-foreground overflow-hidden p-1',\n        '[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5',\n        '[&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',\n        '[&_[cmdk-group-heading]]:text-foreground-subtle',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommandGroup.displayName = 'CommandGroup';\n\nexport const CommandSeparator = forwardRef<\n  ElementRef<typeof CommandPrimitive.Separator>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(function CommandSeparator({ className, ...props }, ref) {\n  // cmdk hard-codes role=\"separator\", which is not a permitted child of the\n  // listbox. asChild lets the child's role win: the divider is purely visual.\n  return (\n    <CommandPrimitive.Separator ref={ref} asChild {...props}>\n      <div role=\"none\" className={cn('bg-border -mx-1 my-1 h-px', className)} />\n    </CommandPrimitive.Separator>\n  );\n});\nCommandSeparator.displayName = 'CommandSeparator';\n\nexport const CommandItem = forwardRef<\n  ElementRef<typeof CommandPrimitive.Item>,\n  ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(function CommandItem({ className, ...props }, ref) {\n  return (\n    <CommandPrimitive.Item\n      ref={ref}\n      className={cn(\n        'text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none',\n        'data-[selected=true]:bg-background-muted data-[selected=true]:text-foreground',\n        'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n        '[&_svg]:text-foreground-subtle [&_svg]:size-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCommandItem.displayName = 'CommandItem';\n\nexport function CommandShortcut({\n  children,\n  className,\n}: {\n  children: ReactNode;\n  className?: string;\n}) {\n  return (\n    <span\n      className={cn(\n        'text-foreground-subtle ml-auto inline-flex items-center gap-0.5 font-mono text-xs tracking-widest',\n        className,\n      )}\n    >\n      {children}\n    </span>\n  );\n}\nCommandShortcut.displayName = 'CommandShortcut';\n\n/* -----------------------------------------------------------------------------\n *  Dialog wrapper — a ready-to-use ⌘K palette.\n * --------------------------------------------------------------------------- */\n\nexport interface CommandDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  children: ReactNode;\n  /** Visible label for screen readers. */\n  title?: string;\n}\n\nexport function CommandDialog({ open, onOpenChange, children, title }: CommandDialogProps) {\n  const strings = useStrings();\n  // The palette has no DialogTrigger (⌘K / any button opens it), so Radix has\n  // no trigger to return focus to and would drop it on <body>. Remember what\n  // was focused when the dialog opened and restore it on close.\n  const returnFocusRef = useRef<HTMLElement | null>(null);\n  return (\n    <DialogPrimitive.Root open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal>\n        <DialogPrimitive.Overlay\n          className={cn(\n            'bg-overlay fixed inset-0 z-[var(--z-overlay)]',\n            'data-[state=open]:animate-in data-[state=closed]:animate-out',\n            'data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0',\n          )}\n        />\n        <DialogPrimitive.Content\n          aria-describedby={undefined}\n          onOpenAutoFocus={() => {\n            returnFocusRef.current = document.activeElement as HTMLElement | null;\n          }}\n          onCloseAutoFocus={(event) => {\n            event.preventDefault();\n            returnFocusRef.current?.focus();\n            returnFocusRef.current = null;\n          }}\n          className={cn(\n            'fixed top-[20%] left-1/2 z-[var(--z-modal)] -translate-x-1/2',\n            'w-[calc(100%-2rem)] max-w-[640px] overflow-hidden',\n            'border-border bg-popover text-popover-foreground rounded-lg border shadow-lg',\n            'data-[state=open]:animate-in data-[state=closed]:animate-out',\n            'data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0',\n            'data-[state=open]:zoom-in-95 data-[state=closed]:zoom-out-95',\n          )}\n        >\n          <DialogPrimitive.Title className=\"sr-only\">\n            {title ?? strings.commandDialog.title}\n          </DialogPrimitive.Title>\n          <Command>{children}</Command>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n}\n\n/**\n * Hook that wires ⌘K / Ctrl+K to a setter — the canonical way to mount the\n * palette in an app shell.\n *\n * @example\n *   const [open, setOpen] = useState(false);\n *   useCommandPaletteShortcut(setOpen);\n *   …\n *   <CommandDialog open={open} onOpenChange={setOpen}>\n *     <CommandInput placeholder=\"Type a command…\" />\n *     <CommandList>\n *       <CommandEmpty>No results.</CommandEmpty>\n *       <CommandGroup heading=\"Suggestions\">\n *         <CommandItem>Create project</CommandItem>\n *         <CommandItem>Invite teammate</CommandItem>\n *       </CommandGroup>\n *     </CommandList>\n *   </CommandDialog>\n *\n * @do Group items by category. Show \"Recent\" first when the query is empty.\n * @dont Hide essential actions behind the palette only — keep at least one\n *       button entry in the UI.\n */\nexport function useCommandPaletteShortcut(setOpen: Dispatch<SetStateAction<boolean>>): void {\n  useEffect(() => {\n    const onKey = (e: KeyboardEvent) => {\n      if ((e.key === 'k' || e.key === 'K') && (e.metaKey || e.ctrlKey) && !e.altKey) {\n        e.preventDefault();\n        // Functional update: ⌘K toggles without the hook tracking open state.\n        setOpen((prev) => !prev);\n      }\n    };\n    window.addEventListener('keydown', onKey);\n    return () => window.removeEventListener('keydown', onKey);\n  }, [setOpen]);\n}\n"],"names":["Command","forwardRef","className","props","ref","jsx","CommandPrimitive","cn","CommandInput","jsxs","Search","CommandList","label","strings","useStrings","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","children","CommandDialog","open","onOpenChange","title","returnFocusRef","useRef","DialogPrimitive","event","_a","useCommandPaletteShortcut","setOpen","useEffect","onKey","prev"],"mappings":"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"}

package/dist-lib/components/ui/ContextMenu.d.ts

@@ -29,15 +29,20 @@ export declare const ContextMenuGroup: import('react').ForwardRefExoticComponent
 export declare const ContextMenuPortal: import('react').FC<ContextMenuPrimitive.ContextMenuPortalProps>;
 export declare const ContextMenuSub: import('react').FC<ContextMenuPrimitive.ContextMenuSubProps>;
 export declare const ContextMenuRadioGroup: import('react').ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuRadioGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export declare const ContextMenuSubTrigger: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubTriggerProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const ContextMenuSubTrigger: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubTriggerProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuSubContent: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubContentProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuContent: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuContentProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuItem: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
     destructive?: boolean;
 } & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuCheckboxItem: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuCheckboxItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuRadioItem: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuRadioItemProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export declare const ContextMenuLabel: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuLabelProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const ContextMenuLabel: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuLabelProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & import('react').RefAttributes<HTMLDivElement>>;
 export declare const ContextMenuSeparator: import('react').ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSeparatorProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export declare function ContextMenuShortcut({ className, ...props }: HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
 export declare namespace ContextMenuShortcut {

package/dist-lib/components/ui/ContextMenu.js

@@ -1,51 +1,61 @@
 "use client";
-import { jsxs as c, jsx as a } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
+import { jsxs as l, jsx as a } from "react/jsx-runtime";
+import { forwardRef as u } from "react";
 import * as t from "@radix-ui/react-context-menu";
-import { Check as l, Circle as m, ChevronRight as x } from "../../icons/index.js";
+import { Check as m, Circle as x, ChevronRight as p } from "../../icons/index.js";
 import { cn as r } from "../../lib/utils.js";
-const k = t.Root, w = t.Trigger, T = t.Group, p = t.Portal, j = t.Sub, G = t.RadioGroup, d = r(
+const w = t.Root, T = t.Trigger, j = t.Group, C = t.Portal, G = t.Sub, L = t.RadioGroup, i = r(
   "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-foreground outline-none",
   "data-[highlighted]:bg-background-muted data-[highlighted]:text-foreground",
-  "data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
-), C = s(function({ className: e, children: n, ...o }, i) {
-  return /* @__PURE__ */ c(
+  "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+  "transition-colors duration-[var(--duration-fast)]"
+), g = u(function({ className: e, inset: n, children: o, ...d }, c) {
+  return /* @__PURE__ */ l(
     t.SubTrigger,
     {
-      ref: i,
-      className: r(d, "data-[state=open]:bg-background-muted", e),
-      ...o,
+      ref: c,
+      className: r(
+        i,
+        "data-[state=open]:bg-background-muted",
+        n && "pl-8",
+        e
+      ),
+      ...d,
       children: [
-        n,
-        /* @__PURE__ */ a(x, { className: "ml-auto size-4 text-foreground-subtle", "aria-hidden": !0 })
+        o,
+        /* @__PURE__ */ a(p, { className: "text-foreground-subtle ml-auto size-4", "aria-hidden": !0 })
       ]
     }
   );
 });
-C.displayName = "ContextMenuSubTrigger";
-const g = s(function({ className: e, ...n }, o) {
+g.displayName = "ContextMenuSubTrigger";
+const f = u(function({ className: e, ...n }, o) {
   return /* @__PURE__ */ a(
     t.SubContent,
     {
       ref: o,
       className: r(
-        "z-[var(--z-popover)] min-w-[8rem] overflow-hidden rounded-lg border border-border bg-popover p-1 text-popover-foreground shadow-md",
+        "border-border bg-popover text-popover-foreground z-[var(--z-popover)] min-w-[8rem] overflow-hidden rounded-lg border p-1 shadow-md",
+        "data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
         e
       ),
       ...n
     }
   );
 });
-g.displayName = "ContextMenuSubContent";
-const b = s(function({ className: e, ...n }, o) {
-  return /* @__PURE__ */ a(p, { children: /* @__PURE__ */ a(
+f.displayName = "ContextMenuSubContent";
+const b = u(function({ className: e, ...n }, o) {
+  return /* @__PURE__ */ a(C, { children: /* @__PURE__ */ a(
     t.Content,
     {
       ref: o,
       className: r(
-        "z-[var(--z-popover)] min-w-[12rem] overflow-hidden rounded-lg border border-border bg-popover p-1 text-popover-foreground shadow-md",
+        "border-border bg-popover text-popover-foreground z-[var(--z-popover)] min-w-[12rem] overflow-hidden rounded-lg border p-1 shadow-md",
         "data-[state=open]:animate-in data-[state=closed]:animate-out",
         "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
         e
       ),
       ...n
@@ -53,98 +63,103 @@ const b = s(function({ className: e, ...n }, o) {
   ) });
 });
 b.displayName = "ContextMenuContent";
-const f = s(function({ className: e, destructive: n, ...o }, i) {
+const h = u(function({ className: e, inset: n, destructive: o, ...d }, c) {
   return /* @__PURE__ */ a(
     t.Item,
     {
-      ref: i,
+      ref: c,
       className: r(
-        d,
-        n && "text-danger-text data-[highlighted]:bg-danger-soft data-[highlighted]:text-danger-text",
+        i,
+        n && "pl-8",
+        o && "text-danger-text data-[highlighted]:bg-danger-soft data-[highlighted]:text-danger-text",
         e
       ),
-      ...o
+      ...d
     }
   );
 });
-f.displayName = "ContextMenuItem";
-const h = s(function({ className: e, children: n, ...o }, i) {
-  return /* @__PURE__ */ c(
+h.displayName = "ContextMenuItem";
+const M = u(function({ className: e, children: n, ...o }, d) {
+  return /* @__PURE__ */ l(
     t.CheckboxItem,
     {
-      ref: i,
-      className: r(d, "pl-8", e),
+      ref: d,
+      className: r(i, "pl-8", e),
       ...o,
       children: [
-        /* @__PURE__ */ a("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ a(t.ItemIndicator, { children: /* @__PURE__ */ a(l, { className: "size-4 text-accent", "aria-hidden": !0 }) }) }),
+        /* @__PURE__ */ a("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ a(t.ItemIndicator, { children: /* @__PURE__ */ a(m, { className: "text-accent size-4", "aria-hidden": !0 }) }) }),
         n
       ]
     }
   );
 });
-h.displayName = "ContextMenuCheckboxItem";
-const M = s(function({ className: e, children: n, ...o }, i) {
-  return /* @__PURE__ */ c(
+M.displayName = "ContextMenuCheckboxItem";
+const N = u(function({ className: e, children: n, ...o }, d) {
+  return /* @__PURE__ */ l(
     t.RadioItem,
     {
-      ref: i,
-      className: r(d, "pl-8", e),
+      ref: d,
+      className: r(i, "pl-8", e),
       ...o,
       children: [
-        /* @__PURE__ */ a("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ a(t.ItemIndicator, { children: /* @__PURE__ */ a(m, { className: "size-2 fill-accent text-accent", "aria-hidden": !0 }) }) }),
+        /* @__PURE__ */ a("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ a(t.ItemIndicator, { children: /* @__PURE__ */ a(x, { className: "fill-accent text-accent size-2", "aria-hidden": !0 }) }) }),
         n
       ]
     }
   );
 });
-M.displayName = "ContextMenuRadioItem";
-const N = s(function({ className: e, ...n }, o) {
+N.displayName = "ContextMenuRadioItem";
+const I = u(function({ className: e, inset: n, ...o }, d) {
   return /* @__PURE__ */ a(
     t.Label,
     {
-      ref: o,
-      className: r("px-2 py-1.5 text-xs font-medium text-foreground-subtle", e),
-      ...n
+      ref: d,
+      className: r(
+        "text-foreground-subtle px-2 py-1.5 text-xs font-medium",
+        n && "pl-8",
+        e
+      ),
+      ...o
     }
   );
 });
-N.displayName = "ContextMenuLabel";
-const I = s(function({ className: e, ...n }, o) {
+I.displayName = "ContextMenuLabel";
+const S = u(function({ className: e, ...n }, o) {
   return /* @__PURE__ */ a(
     t.Separator,
     {
       ref: o,
-      className: r("-mx-1 my-1 h-px bg-border", e),
+      className: r("bg-border -mx-1 my-1 h-px", e),
       ...n
     }
   );
 });
-I.displayName = "ContextMenuSeparator";
-function S({ className: u, ...e }) {
+S.displayName = "ContextMenuSeparator";
+function v({ className: s, ...e }) {
   return /* @__PURE__ */ a(
     "span",
     {
-      className: r("ml-auto text-xs tracking-widest text-foreground-subtle font-mono", u),
+      className: r("text-foreground-subtle ml-auto font-mono text-xs tracking-widest", s),
       ...e
     }
   );
 }
-S.displayName = "ContextMenuShortcut";
+v.displayName = "ContextMenuShortcut";
 export {
-  k as ContextMenu,
-  h as ContextMenuCheckboxItem,
+  w as ContextMenu,
+  M as ContextMenuCheckboxItem,
   b as ContextMenuContent,
-  T as ContextMenuGroup,
-  f as ContextMenuItem,
-  N as ContextMenuLabel,
-  p as ContextMenuPortal,
-  G as ContextMenuRadioGroup,
-  M as ContextMenuRadioItem,
-  I as ContextMenuSeparator,
-  S as ContextMenuShortcut,
-  j as ContextMenuSub,
-  g as ContextMenuSubContent,
-  C as ContextMenuSubTrigger,
-  w as ContextMenuTrigger
+  j as ContextMenuGroup,
+  h as ContextMenuItem,
+  I as ContextMenuLabel,
+  C as ContextMenuPortal,
+  L as ContextMenuRadioGroup,
+  N as ContextMenuRadioItem,
+  S as ContextMenuSeparator,
+  v as ContextMenuShortcut,
+  G as ContextMenuSub,
+  f as ContextMenuSubContent,
+  g as ContextMenuSubTrigger,
+  T as ContextMenuTrigger
 };
 //# sourceMappingURL=ContextMenu.js.map