@mastra/playground-ui 45.0.0 → 45.1.0-alpha.1

package/dist/components/ChatShell.cjs.js

@@ -0,0 +1,96 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const messageScroller = require('../message-scroller-DIgCd5n3.cjs');
+const utils_cn = require('../cn-vA5sWo9W.cjs');
+
+function ChatShellRoot({ className, scroller, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(messageScroller.MessageScrollerProvider, { ...scroller, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chat-shell",
+      className: utils_cn.cn(
+        "@container relative isolate flex min-h-0 min-w-0 flex-col bg-(--chat-surface)",
+        "[--chat-column:48rem] [--chat-gutter:0.75rem] [--chat-inset-end:0px]",
+        "[--chat-surface:var(--color-surface2)]",
+        "[--chat-veil:color-mix(in_oklab,var(--chat-surface)_70%,transparent)]",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function ChatShellBar({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "chat-shell-bar", className: utils_cn.cn("min-w-0 shrink-0", className), ...props });
+}
+function ChatShellStage({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(messageScroller.MessageScroller, { className: utils_cn.cn("h-auto min-h-0 flex-1", className), ...props });
+}
+function ChatShellViewport({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    messageScroller.MessageScrollerViewport,
+    {
+      className: utils_cn.cn(
+        "h-auto min-h-0 flex-1 pe-(--chat-inset-end)",
+        "transition-[padding] duration-360 ease-out-custom motion-reduce:transition-none",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "chat-shell-track", className: "flex min-h-full min-w-0 flex-col", children })
+    }
+  );
+}
+function ChatShellContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(messageScroller.MessageScrollerContent, { className: utils_cn.cn("flex-1 pb-(--chat-gutter)", className), ...props });
+}
+function ChatShellColumn({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-column",
+      className: utils_cn.cn("mx-auto flex w-full max-w-(--chat-column) min-w-0 flex-col px-3 md:px-5", className),
+      ...props
+    }
+  );
+}
+function ChatShellDock({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-dock",
+      className: utils_cn.cn("sticky bottom-0 z-10 shrink-0 bg-(--chat-veil) pb-(--chat-gutter)", className),
+      ...props
+    }
+  );
+}
+function ChatShellScrollButton({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-scroll-button",
+      className: "pointer-events-none absolute inset-x-0 bottom-[calc(100%+0.5rem)] flex",
+      children: /* @__PURE__ */ jsxRuntime.jsx(ChatShellColumn, { className: "flex-row justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+        messageScroller.MessageScrollerButton,
+        {
+          className: utils_cn.cn("pointer-events-auto static translate-x-0 rtl:translate-x-0", className),
+          ...props
+        }
+      ) })
+    }
+  );
+}
+
+const ChatShell = Object.assign(ChatShellRoot, {
+  Bar: ChatShellBar,
+  Column: ChatShellColumn,
+  Content: ChatShellContent,
+  Dock: ChatShellDock,
+  ScrollButton: ChatShellScrollButton,
+  Stage: ChatShellStage,
+  Viewport: ChatShellViewport
+});
+
+exports.ChatShell = ChatShell;
+//# sourceMappingURL=ChatShell.cjs.js.map

package/dist/components/ChatShell.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatShell.cjs.js","sources":["../../src/ds/components/ChatShell/chat-shell.tsx","../../src/ds/components/ChatShell/index.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\n\nimport {\n  MessageScroller,\n  MessageScrollerButton,\n  MessageScrollerContent,\n  MessageScrollerProvider,\n  MessageScrollerViewport,\n} from '../MessageScroller';\nimport type {\n  MessageScrollerButtonProps,\n  MessageScrollerContentProps,\n  MessageScrollerProviderProps,\n  MessageScrollerViewportProps,\n} from '../MessageScroller';\n\nimport { cn } from '@/lib/utils';\n\nexport type ChatShellProps = ComponentPropsWithoutRef<'div'> & {\n  scroller?: Omit<MessageScrollerProviderProps, 'children'>;\n};\n\n/**\n * A chat page frame with exactly one scroll container. Bars sit above it, the\n * composer docks inside it, every region shares one column.\n *\n * Tuned through custom properties, all defaulted here: `--chat-column` (column\n * width), `--chat-surface` (page colour), `--chat-gutter` (room above and below\n * the composer), `--chat-veil` (what the dock paints with), `--chat-inset-end`\n * (room an overlay panel claims on the end edge).\n */\nexport function ChatShellRoot({ className, scroller, ...props }: ChatShellProps) {\n  return (\n    <MessageScrollerProvider {...scroller}>\n      <div\n        data-slot=\"chat-shell\"\n        className={cn(\n          '@container relative isolate flex min-h-0 min-w-0 flex-col bg-(--chat-surface)',\n          '[--chat-column:48rem] [--chat-gutter:0.75rem] [--chat-inset-end:0px]',\n          '[--chat-surface:var(--color-surface2)]',\n          '[--chat-veil:color-mix(in_oklab,var(--chat-surface)_70%,transparent)]',\n          className,\n        )}\n        {...props}\n      />\n    </MessageScrollerProvider>\n  );\n}\n\n/**\n * Full-width row above the scroller (session header, goal bar). No end inset: the\n * overlay panel it would dodge floats inside the stage, below the bars.\n */\nexport function ChatShellBar({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return <div data-slot=\"chat-shell-bar\" className={cn('min-w-0 shrink-0', className)} {...props} />;\n}\n\n/** Positioned region holding the scroller plus anything overlaying it. */\nexport function ChatShellStage({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return <MessageScroller className={cn('h-auto min-h-0 flex-1', className)} {...props} />;\n}\n\n/**\n * The one scroll container. It takes the end inset itself — on an ancestor the\n * same room would drag the scrollbar inward, off the true edge.\n */\nexport function ChatShellViewport({ className, children, ...props }: MessageScrollerViewportProps) {\n  return (\n    <MessageScrollerViewport\n      className={cn(\n        'h-auto min-h-0 flex-1 pe-(--chat-inset-end)',\n        'transition-[padding] duration-360 ease-out-custom motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {/* Sticky against the scroller itself is clamped to its box, not the\n          scrolled height, and strands the dock mid-transcript. */}\n      <div data-slot=\"chat-shell-track\" className=\"flex min-h-full min-w-0 flex-col\">\n        {children}\n      </div>\n    </MessageScrollerViewport>\n  );\n}\n\n/** Scrolling content. Its bottom padding is the unveiled air above the composer. */\nexport function ChatShellContent({ className, ...props }: MessageScrollerContentProps) {\n  return <MessageScrollerContent className={cn('flex-1 pb-(--chat-gutter)', className)} {...props} />;\n}\n\n/** The shared reading column. Every chat region must go through it. */\nexport function ChatShellColumn({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return (\n    <div\n      data-slot=\"chat-shell-column\"\n      className={cn('mx-auto flex w-full max-w-(--chat-column) min-w-0 flex-col px-3 md:px-5', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Composer region, sticky but left in flow: its own height reserves the room the\n * transcript scrolls behind, so nothing measures it and a composer growing under\n * the cursor resizes no box the scroller watches.\n *\n * The veil is a background, not an overlay, so it passes behind the composer card\n * and dims the transcript in its rounded corners too.\n */\nexport function ChatShellDock({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return (\n    <div\n      data-slot=\"chat-shell-dock\"\n      className={cn('sticky bottom-0 z-10 shrink-0 bg-(--chat-veil) pb-(--chat-gutter)', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Jump-to-latest, floating just above the dock. It belongs inside the dock:\n * anywhere else it centres on a box the scrollbar has not narrowed, landing off\n * the composer's axis.\n */\nexport function ChatShellScrollButton({ className, ...props }: MessageScrollerButtonProps) {\n  return (\n    <div\n      data-slot=\"chat-shell-scroll-button\"\n      className=\"pointer-events-none absolute inset-x-0 bottom-[calc(100%+0.5rem)] flex\"\n    >\n      <ChatShellColumn className=\"flex-row justify-center\">\n        <MessageScrollerButton\n          className={cn('pointer-events-auto static translate-x-0 rtl:translate-x-0', className)}\n          {...props}\n        />\n      </ChatShellColumn>\n    </div>\n  );\n}\n","import {\n  ChatShellBar,\n  ChatShellColumn,\n  ChatShellContent,\n  ChatShellDock,\n  ChatShellRoot,\n  ChatShellScrollButton,\n  ChatShellStage,\n  ChatShellViewport,\n} from './chat-shell';\n\nexport type { ChatShellProps } from './chat-shell';\n\nexport const ChatShell = Object.assign(ChatShellRoot, {\n  Bar: ChatShellBar,\n  Column: ChatShellColumn,\n  Content: ChatShellContent,\n  Dock: ChatShellDock,\n  ScrollButton: ChatShellScrollButton,\n  Stage: ChatShellStage,\n  Viewport: ChatShellViewport,\n});\n"],"names":["jsx","MessageScrollerProvider","cn","MessageScroller","MessageScrollerViewport","MessageScrollerContent","MessageScrollerButton"],"mappings":"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"}

package/dist/components/ChatShell.d.ts

@@ -0,0 +1,2 @@
+export * from '../src/ds/components/ChatShell/index'
+export {}

package/dist/components/ChatShell.es.js

@@ -0,0 +1,92 @@
+import { jsx } from 'react/jsx-runtime';
+import { d as MessageScrollerProvider, e as MessageScrollerViewport, M as MessageScroller, a as MessageScrollerButton, b as MessageScrollerContent } from '../message-scroller-BQpwFsqj.js';
+import { c as cn } from '../cn-BakJzhuv.js';
+
+function ChatShellRoot({ className, scroller, ...props }) {
+  return /* @__PURE__ */ jsx(MessageScrollerProvider, { ...scroller, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chat-shell",
+      className: cn(
+        "@container relative isolate flex min-h-0 min-w-0 flex-col bg-(--chat-surface)",
+        "[--chat-column:48rem] [--chat-gutter:0.75rem] [--chat-inset-end:0px]",
+        "[--chat-surface:var(--color-surface2)]",
+        "[--chat-veil:color-mix(in_oklab,var(--chat-surface)_70%,transparent)]",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function ChatShellBar({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "chat-shell-bar", className: cn("min-w-0 shrink-0", className), ...props });
+}
+function ChatShellStage({ className, ...props }) {
+  return /* @__PURE__ */ jsx(MessageScroller, { className: cn("h-auto min-h-0 flex-1", className), ...props });
+}
+function ChatShellViewport({ className, children, ...props }) {
+  return /* @__PURE__ */ jsx(
+    MessageScrollerViewport,
+    {
+      className: cn(
+        "h-auto min-h-0 flex-1 pe-(--chat-inset-end)",
+        "transition-[padding] duration-360 ease-out-custom motion-reduce:transition-none",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { "data-slot": "chat-shell-track", className: "flex min-h-full min-w-0 flex-col", children })
+    }
+  );
+}
+function ChatShellContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx(MessageScrollerContent, { className: cn("flex-1 pb-(--chat-gutter)", className), ...props });
+}
+function ChatShellColumn({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-column",
+      className: cn("mx-auto flex w-full max-w-(--chat-column) min-w-0 flex-col px-3 md:px-5", className),
+      ...props
+    }
+  );
+}
+function ChatShellDock({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-dock",
+      className: cn("sticky bottom-0 z-10 shrink-0 bg-(--chat-veil) pb-(--chat-gutter)", className),
+      ...props
+    }
+  );
+}
+function ChatShellScrollButton({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chat-shell-scroll-button",
+      className: "pointer-events-none absolute inset-x-0 bottom-[calc(100%+0.5rem)] flex",
+      children: /* @__PURE__ */ jsx(ChatShellColumn, { className: "flex-row justify-center", children: /* @__PURE__ */ jsx(
+        MessageScrollerButton,
+        {
+          className: cn("pointer-events-auto static translate-x-0 rtl:translate-x-0", className),
+          ...props
+        }
+      ) })
+    }
+  );
+}
+
+const ChatShell = Object.assign(ChatShellRoot, {
+  Bar: ChatShellBar,
+  Column: ChatShellColumn,
+  Content: ChatShellContent,
+  Dock: ChatShellDock,
+  ScrollButton: ChatShellScrollButton,
+  Stage: ChatShellStage,
+  Viewport: ChatShellViewport
+});
+
+export { ChatShell };
+//# sourceMappingURL=ChatShell.es.js.map

package/dist/components/ChatShell.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatShell.es.js","sources":["../../src/ds/components/ChatShell/chat-shell.tsx","../../src/ds/components/ChatShell/index.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\n\nimport {\n  MessageScroller,\n  MessageScrollerButton,\n  MessageScrollerContent,\n  MessageScrollerProvider,\n  MessageScrollerViewport,\n} from '../MessageScroller';\nimport type {\n  MessageScrollerButtonProps,\n  MessageScrollerContentProps,\n  MessageScrollerProviderProps,\n  MessageScrollerViewportProps,\n} from '../MessageScroller';\n\nimport { cn } from '@/lib/utils';\n\nexport type ChatShellProps = ComponentPropsWithoutRef<'div'> & {\n  scroller?: Omit<MessageScrollerProviderProps, 'children'>;\n};\n\n/**\n * A chat page frame with exactly one scroll container. Bars sit above it, the\n * composer docks inside it, every region shares one column.\n *\n * Tuned through custom properties, all defaulted here: `--chat-column` (column\n * width), `--chat-surface` (page colour), `--chat-gutter` (room above and below\n * the composer), `--chat-veil` (what the dock paints with), `--chat-inset-end`\n * (room an overlay panel claims on the end edge).\n */\nexport function ChatShellRoot({ className, scroller, ...props }: ChatShellProps) {\n  return (\n    <MessageScrollerProvider {...scroller}>\n      <div\n        data-slot=\"chat-shell\"\n        className={cn(\n          '@container relative isolate flex min-h-0 min-w-0 flex-col bg-(--chat-surface)',\n          '[--chat-column:48rem] [--chat-gutter:0.75rem] [--chat-inset-end:0px]',\n          '[--chat-surface:var(--color-surface2)]',\n          '[--chat-veil:color-mix(in_oklab,var(--chat-surface)_70%,transparent)]',\n          className,\n        )}\n        {...props}\n      />\n    </MessageScrollerProvider>\n  );\n}\n\n/**\n * Full-width row above the scroller (session header, goal bar). No end inset: the\n * overlay panel it would dodge floats inside the stage, below the bars.\n */\nexport function ChatShellBar({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return <div data-slot=\"chat-shell-bar\" className={cn('min-w-0 shrink-0', className)} {...props} />;\n}\n\n/** Positioned region holding the scroller plus anything overlaying it. */\nexport function ChatShellStage({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return <MessageScroller className={cn('h-auto min-h-0 flex-1', className)} {...props} />;\n}\n\n/**\n * The one scroll container. It takes the end inset itself — on an ancestor the\n * same room would drag the scrollbar inward, off the true edge.\n */\nexport function ChatShellViewport({ className, children, ...props }: MessageScrollerViewportProps) {\n  return (\n    <MessageScrollerViewport\n      className={cn(\n        'h-auto min-h-0 flex-1 pe-(--chat-inset-end)',\n        'transition-[padding] duration-360 ease-out-custom motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {/* Sticky against the scroller itself is clamped to its box, not the\n          scrolled height, and strands the dock mid-transcript. */}\n      <div data-slot=\"chat-shell-track\" className=\"flex min-h-full min-w-0 flex-col\">\n        {children}\n      </div>\n    </MessageScrollerViewport>\n  );\n}\n\n/** Scrolling content. Its bottom padding is the unveiled air above the composer. */\nexport function ChatShellContent({ className, ...props }: MessageScrollerContentProps) {\n  return <MessageScrollerContent className={cn('flex-1 pb-(--chat-gutter)', className)} {...props} />;\n}\n\n/** The shared reading column. Every chat region must go through it. */\nexport function ChatShellColumn({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return (\n    <div\n      data-slot=\"chat-shell-column\"\n      className={cn('mx-auto flex w-full max-w-(--chat-column) min-w-0 flex-col px-3 md:px-5', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Composer region, sticky but left in flow: its own height reserves the room the\n * transcript scrolls behind, so nothing measures it and a composer growing under\n * the cursor resizes no box the scroller watches.\n *\n * The veil is a background, not an overlay, so it passes behind the composer card\n * and dims the transcript in its rounded corners too.\n */\nexport function ChatShellDock({ className, ...props }: ComponentPropsWithoutRef<'div'>) {\n  return (\n    <div\n      data-slot=\"chat-shell-dock\"\n      className={cn('sticky bottom-0 z-10 shrink-0 bg-(--chat-veil) pb-(--chat-gutter)', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Jump-to-latest, floating just above the dock. It belongs inside the dock:\n * anywhere else it centres on a box the scrollbar has not narrowed, landing off\n * the composer's axis.\n */\nexport function ChatShellScrollButton({ className, ...props }: MessageScrollerButtonProps) {\n  return (\n    <div\n      data-slot=\"chat-shell-scroll-button\"\n      className=\"pointer-events-none absolute inset-x-0 bottom-[calc(100%+0.5rem)] flex\"\n    >\n      <ChatShellColumn className=\"flex-row justify-center\">\n        <MessageScrollerButton\n          className={cn('pointer-events-auto static translate-x-0 rtl:translate-x-0', className)}\n          {...props}\n        />\n      </ChatShellColumn>\n    </div>\n  );\n}\n","import {\n  ChatShellBar,\n  ChatShellColumn,\n  ChatShellContent,\n  ChatShellDock,\n  ChatShellRoot,\n  ChatShellScrollButton,\n  ChatShellStage,\n  ChatShellViewport,\n} from './chat-shell';\n\nexport type { ChatShellProps } from './chat-shell';\n\nexport const ChatShell = Object.assign(ChatShellRoot, {\n  Bar: ChatShellBar,\n  Column: ChatShellColumn,\n  Content: ChatShellContent,\n  Dock: ChatShellDock,\n  ScrollButton: ChatShellScrollButton,\n  Stage: ChatShellStage,\n  Viewport: ChatShellViewport,\n});\n"],"names":[],"mappings":"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"}

package/dist/components/Command.cjs.js

@@ -2,198 +2,17 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const jsxRuntime = require('react/jsx-runtime');
-const cmdk = require('cmdk');
-const lucideReact = require('lucide-react');
-const React = require('react');
-const dialog = require('../dialog-ClItuCFY.cjs');
-const scrollArea = require('../scroll-area-Dv6QagXt.cjs');
-const primitives_transitions = require('../primitives/transitions.cjs.js');
-const utils_cn = require('../cn-vA5sWo9W.cjs');
+const command = require('../command-qsEykgml.cjs');
 
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
-  if (e) {
-    for (const k in e) {
-      if (k !== 'default') {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
 
-const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
-const Command = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  cmdk.Command,
-  {
-    ref,
-    className: utils_cn.cn("flex size-full flex-col overflow-hidden rounded-xl bg-surface3 text-neutral4", className),
-    ...props
-  }
-));
-Command.displayName = cmdk.Command.displayName;
-const CommandDialog = ({
-  children,
-  title = "Command Palette",
-  description = "Search for commands and actions",
-  contentClassName,
-  commandClassName,
-  commandLabel,
-  showOverlay = false,
-  overlayClassName,
-  ...props
-}) => {
-  const filter = React__namespace.useCallback((value, search) => {
-    const normalizedValue = value.toLowerCase();
-    const normalizedSearch = search.toLowerCase();
-    const searchTerms = normalizedSearch.split(/\s+/).filter(Boolean);
-    const matches = searchTerms.every((term) => normalizedValue.includes(term));
-    return matches ? 1 : 0;
-  }, []);
-  const handleKeyDown = React__namespace.useCallback((e) => {
-    if (e.key === "Escape") return;
-    e.stopPropagation();
-  }, []);
-  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog, { ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    dialog.DialogContent,
-    {
-      showOverlay,
-      overlayClassName,
-      className: utils_cn.cn("overflow-hidden p-0", contentClassName),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: "sr-only", children: title }),
-        /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogDescription, { className: "sr-only", children: description }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Command,
-          {
-            label: commandLabel,
-            loop: true,
-            filter,
-            onKeyDown: handleKeyDown,
-            className: utils_cn.cn(
-              "[&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:text-neutral3",
-              "[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 **:[[cmdk-group]]:px-2",
-              "[&_[data-slot=command-input-wrapper]_svg]:size-5",
-              "**:[[cmdk-input]]:h-12",
-              "**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-3",
-              "[&_[cmdk-item]_svg]:size-5",
-              commandClassName
-            ),
-            children
-          }
-        )
-      ]
-    }
-  ) });
-};
-const CommandInput = React__namespace.forwardRef(
-  ({ className, rightSlot, wrapperClassName, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      "data-slot": "command-input-wrapper",
-      className: utils_cn.cn("flex items-center border-b border-border1 px-3", primitives_transitions.transitions.colors, wrapperClassName),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: utils_cn.cn("mr-2 size-4 shrink-0 text-neutral3", primitives_transitions.transitions.colors) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          cmdk.Command.Input,
-          {
-            ref,
-            className: utils_cn.cn(
-              "flex h-10 min-w-0 flex-1 rounded-md bg-transparent py-3 text-ui-smd leading-ui-sm text-neutral6",
-              "placeholder:text-neutral3 disabled:cursor-not-allowed disabled:opacity-50",
-              "outline-none focus:outline-none focus-visible:outline-none",
-              primitives_transitions.transitions.colors,
-              className
-            ),
-            ...props
-          }
-        ),
-        rightSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "command-input-right-slot", className: "text-neutral3 ml-2 flex shrink-0 items-center", children: rightSlot })
-      ]
-    }
-  )
-);
-CommandInput.displayName = cmdk.Command.Input.displayName;
-const CommandList = React__namespace.forwardRef(
-  ({ className, scrollArea: scrollArea$1 = false, scrollAreaClassName, scrollAreaViewportClassName, scrollAreaMask, ...props }, ref) => {
-    const list = /* @__PURE__ */ jsxRuntime.jsx(
-      cmdk.Command.List,
-      {
-        ref,
-        className: utils_cn.cn(
-          "outline-none focus:outline-none focus-visible:outline-none",
-          scrollArea$1 ? "overflow-visible" : "max-h-dropdown-max-height overflow-x-hidden overflow-y-auto",
-          className
-        ),
-        ...props
-      }
-    );
-    if (!scrollArea$1) return list;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      scrollArea.ScrollArea,
-      {
-        className: utils_cn.cn("min-h-0", scrollAreaClassName),
-        viewPortClassName: scrollAreaViewportClassName,
-        mask: scrollAreaMask,
-        children: list
-      }
-    );
-  }
-);
-CommandList.displayName = cmdk.Command.List.displayName;
-const CommandEmpty = React__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(cmdk.Command.Empty, { ref, className: "text-ui-smd text-neutral3 py-6 text-center", ...props }));
-CommandEmpty.displayName = cmdk.Command.Empty.displayName;
-const CommandGroup = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  cmdk.Command.Group,
-  {
-    ref,
-    className: utils_cn.cn(
-      "overflow-hidden p-1 text-neutral4",
-      "[&_[cmdk-group-heading]]:text-ui-xs [&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-1.5 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group-heading]]:tracking-wider **:[[cmdk-group-heading]]:text-neutral3 **:[[cmdk-group-heading]]:uppercase",
-      className
-    ),
-    ...props
-  }
-));
-CommandGroup.displayName = cmdk.Command.Group.displayName;
-const CommandSeparator = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(cmdk.Command.Separator, { ref, className: utils_cn.cn("-mx-1 h-px bg-border1", className), ...props }));
-CommandSeparator.displayName = cmdk.Command.Separator.displayName;
-const CommandItem = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  cmdk.Command.Item,
-  {
-    ref,
-    className: utils_cn.cn(
-      "relative flex cursor-pointer items-center gap-2.5 rounded-lg px-2 py-1.5 text-ui-smd leading-ui-sm text-neutral4 select-none",
-      "outline-none focus:outline-none focus-visible:outline-none",
-      primitives_transitions.transitions.colors,
-      "data-[selected=true]:bg-surface4 data-[selected=true]:text-neutral6",
-      "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
-      "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-neutral3 data-[selected=true]:[&_svg]:text-neutral6",
-      className
-    ),
-    ...props
-  }
-));
-CommandItem.displayName = cmdk.Command.Item.displayName;
-const CommandShortcut = ({ className, ...props }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("ml-auto text-ui-xs tracking-wider text-neutral3 tabular-nums", className), ...props });
-};
-CommandShortcut.displayName = "CommandShortcut";
-
-exports.Command = Command;
-exports.CommandDialog = CommandDialog;
-exports.CommandEmpty = CommandEmpty;
-exports.CommandGroup = CommandGroup;
-exports.CommandInput = CommandInput;
-exports.CommandItem = CommandItem;
-exports.CommandList = CommandList;
-exports.CommandSeparator = CommandSeparator;
-exports.CommandShortcut = CommandShortcut;
+exports.Command = command.Command;
+exports.CommandDialog = command.CommandDialog;
+exports.CommandEmpty = command.CommandEmpty;
+exports.CommandGroup = command.CommandGroup;
+exports.CommandInput = command.CommandInput;
+exports.CommandItem = command.CommandItem;
+exports.CommandList = command.CommandList;
+exports.CommandSeparator = command.CommandSeparator;
+exports.CommandShortcut = command.CommandShortcut;
 //# sourceMappingURL=Command.cjs.js.map

package/dist/components/Command.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Command.cjs.js","sources":["../../src/ds/components/Command/command.tsx"],"sourcesContent":["import { Command as CommandPrimitive } from 'cmdk';\nimport { Search } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Dialog, DialogContent, DialogDescription, DialogTitle } from '@/ds/components/Dialog';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport type { ScrollAreaMask } from '@/ds/components/ScrollArea';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn('flex size-full flex-col overflow-hidden rounded-xl bg-surface3 text-neutral4', className)}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\ntype CommandDialogProps = Omit<React.ComponentPropsWithoutRef<typeof Dialog>, 'children'> & {\n  children?: React.ReactNode;\n  title?: string;\n  description?: string;\n  contentClassName?: string;\n  commandClassName?: string;\n  commandLabel?: string;\n  showOverlay?: boolean;\n  overlayClassName?: string;\n};\n\nconst CommandDialog = ({\n  children,\n  title = 'Command Palette',\n  description = 'Search for commands and actions',\n  contentClassName,\n  commandClassName,\n  commandLabel,\n  showOverlay = false,\n  overlayClassName,\n  ...props\n}: CommandDialogProps) => {\n  // Custom filter that preserves DOM order by returning 1 for all matches\n  // This prevents cmdk from reordering items by match score\n  const filter = React.useCallback((value: string, search: string) => {\n    const normalizedValue = value.toLowerCase();\n    const normalizedSearch = search.toLowerCase();\n    const searchTerms = normalizedSearch.split(/\\s+/).filter(Boolean);\n\n    // All search terms must be found in the value\n    const matches = searchTerms.every(term => normalizedValue.includes(term));\n    return matches ? 1 : 0;\n  }, []);\n\n  // Stop propagation to prevent keyboard events from reaching\n  // global document-level listeners (e.g., table keyboard nav)\n  const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n    if (e.key === 'Escape') return;\n\n    e.stopPropagation();\n  }, []);\n\n  return (\n    <Dialog {...props}>\n      <DialogContent\n        showOverlay={showOverlay}\n        overlayClassName={overlayClassName}\n        className={cn('overflow-hidden p-0', contentClassName)}\n      >\n        <DialogTitle className=\"sr-only\">{title}</DialogTitle>\n        <DialogDescription className=\"sr-only\">{description}</DialogDescription>\n        <Command\n          label={commandLabel}\n          loop\n          filter={filter}\n          onKeyDown={handleKeyDown}\n          className={cn(\n            '[&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:text-neutral3',\n            '[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 **:[[cmdk-group]]:px-2',\n            '[&_[data-slot=command-input-wrapper]_svg]:size-5',\n            '**:[[cmdk-input]]:h-12',\n            '**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-3',\n            '[&_[cmdk-item]_svg]:size-5',\n            commandClassName,\n          )}\n        >\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\ntype CommandInputProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> & {\n  rightSlot?: React.ReactNode;\n  wrapperClassName?: string;\n};\n\nconst CommandInput = React.forwardRef<React.ElementRef<typeof CommandPrimitive.Input>, CommandInputProps>(\n  ({ className, rightSlot, wrapperClassName, ...props }, ref) => (\n    <div\n      data-slot=\"command-input-wrapper\"\n      className={cn('flex items-center border-b border-border1 px-3', transitions.colors, wrapperClassName)}\n    >\n      <Search className={cn('mr-2 size-4 shrink-0 text-neutral3', transitions.colors)} />\n      <CommandPrimitive.Input\n        ref={ref}\n        className={cn(\n          'flex h-10 min-w-0 flex-1 rounded-md bg-transparent py-3 text-ui-smd leading-ui-sm text-neutral6',\n          'placeholder:text-neutral3 disabled:cursor-not-allowed disabled:opacity-50',\n          'outline-none focus:outline-none focus-visible:outline-none',\n          transitions.colors,\n          className,\n        )}\n        {...props}\n      />\n      {rightSlot && (\n        <div data-slot=\"command-input-right-slot\" className=\"text-neutral3 ml-2 flex shrink-0 items-center\">\n          {rightSlot}\n        </div>\n      )}\n    </div>\n  ),\n);\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\ntype CommandListProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> & {\n  scrollArea?: boolean;\n  scrollAreaClassName?: string;\n  scrollAreaViewportClassName?: string;\n  scrollAreaMask?: ScrollAreaMask;\n};\n\nconst CommandList = React.forwardRef<React.ElementRef<typeof CommandPrimitive.List>, CommandListProps>(\n  (\n    { className, scrollArea = false, scrollAreaClassName, scrollAreaViewportClassName, scrollAreaMask, ...props },\n    ref,\n  ) => {\n    const list = (\n      <CommandPrimitive.List\n        ref={ref}\n        className={cn(\n          'outline-none focus:outline-none focus-visible:outline-none',\n          scrollArea ? 'overflow-visible' : 'max-h-dropdown-max-height overflow-x-hidden overflow-y-auto',\n          className,\n        )}\n        {...props}\n      />\n    );\n\n    if (!scrollArea) return list;\n\n    return (\n      <ScrollArea\n        className={cn('min-h-0', scrollAreaClassName)}\n        viewPortClassName={scrollAreaViewportClassName}\n        mask={scrollAreaMask}\n      >\n        {list}\n      </ScrollArea>\n    );\n  },\n);\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => (\n  <CommandPrimitive.Empty ref={ref} className=\"text-ui-smd text-neutral3 py-6 text-center\" {...props} />\n));\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      'overflow-hidden p-1 text-neutral4',\n      '[&_[cmdk-group-heading]]:text-ui-xs [&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-1.5 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group-heading]]:tracking-wider **:[[cmdk-group-heading]]:text-neutral3 **:[[cmdk-group-heading]]:uppercase',\n      className,\n    )}\n    {...props}\n  />\n));\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator ref={ref} className={cn('-mx-1 h-px bg-border1', className)} {...props} />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex cursor-pointer items-center gap-2.5 rounded-lg px-2 py-1.5 text-ui-smd leading-ui-sm text-neutral4 select-none',\n      'outline-none focus:outline-none focus-visible:outline-none',\n      transitions.colors,\n      'data-[selected=true]:bg-surface4 data-[selected=true]:text-neutral6',\n      'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n      '[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-neutral3 data-[selected=true]:[&_svg]:text-neutral6',\n      className,\n    )}\n    {...props}\n  />\n));\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return <span className={cn('ml-auto text-ui-xs tracking-wider text-neutral3 tabular-nums', className)} {...props} />;\n};\nCommandShortcut.displayName = 'CommandShortcut';\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandSeparator,\n  CommandShortcut,\n};\n"],"names":["React","jsx","CommandPrimitive","cn","Dialog","jsxs","DialogContent","DialogTitle","DialogDescription","transitions","Search","scrollArea","ScrollArea"],"mappings":"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"}
+{"version":3,"file":"Command.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/dist/components/Command.es.js

@@ -1,168 +1,2 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Command as Command$1 } from 'cmdk';
-import { Search } from 'lucide-react';
-import * as React from 'react';
-import { D as Dialog, c as DialogContent, i as DialogTitle, d as DialogDescription } from '../dialog-bnt6epW2.js';
-import { S as ScrollArea } from '../scroll-area-DZrEuKjC.js';
-import { transitions } from '../primitives/transitions.es.js';
-import { c as cn } from '../cn-BakJzhuv.js';
-
-const Command = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1,
-  {
-    ref,
-    className: cn("flex size-full flex-col overflow-hidden rounded-xl bg-surface3 text-neutral4", className),
-    ...props
-  }
-));
-Command.displayName = Command$1.displayName;
-const CommandDialog = ({
-  children,
-  title = "Command Palette",
-  description = "Search for commands and actions",
-  contentClassName,
-  commandClassName,
-  commandLabel,
-  showOverlay = false,
-  overlayClassName,
-  ...props
-}) => {
-  const filter = React.useCallback((value, search) => {
-    const normalizedValue = value.toLowerCase();
-    const normalizedSearch = search.toLowerCase();
-    const searchTerms = normalizedSearch.split(/\s+/).filter(Boolean);
-    const matches = searchTerms.every((term) => normalizedValue.includes(term));
-    return matches ? 1 : 0;
-  }, []);
-  const handleKeyDown = React.useCallback((e) => {
-    if (e.key === "Escape") return;
-    e.stopPropagation();
-  }, []);
-  return /* @__PURE__ */ jsx(Dialog, { ...props, children: /* @__PURE__ */ jsxs(
-    DialogContent,
-    {
-      showOverlay,
-      overlayClassName,
-      className: cn("overflow-hidden p-0", contentClassName),
-      children: [
-        /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: title }),
-        /* @__PURE__ */ jsx(DialogDescription, { className: "sr-only", children: description }),
-        /* @__PURE__ */ jsx(
-          Command,
-          {
-            label: commandLabel,
-            loop: true,
-            filter,
-            onKeyDown: handleKeyDown,
-            className: cn(
-              "[&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:text-neutral3",
-              "[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 **:[[cmdk-group]]:px-2",
-              "[&_[data-slot=command-input-wrapper]_svg]:size-5",
-              "**:[[cmdk-input]]:h-12",
-              "**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-3",
-              "[&_[cmdk-item]_svg]:size-5",
-              commandClassName
-            ),
-            children
-          }
-        )
-      ]
-    }
-  ) });
-};
-const CommandInput = React.forwardRef(
-  ({ className, rightSlot, wrapperClassName, ...props }, ref) => /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "command-input-wrapper",
-      className: cn("flex items-center border-b border-border1 px-3", transitions.colors, wrapperClassName),
-      children: [
-        /* @__PURE__ */ jsx(Search, { className: cn("mr-2 size-4 shrink-0 text-neutral3", transitions.colors) }),
-        /* @__PURE__ */ jsx(
-          Command$1.Input,
-          {
-            ref,
-            className: cn(
-              "flex h-10 min-w-0 flex-1 rounded-md bg-transparent py-3 text-ui-smd leading-ui-sm text-neutral6",
-              "placeholder:text-neutral3 disabled:cursor-not-allowed disabled:opacity-50",
-              "outline-none focus:outline-none focus-visible:outline-none",
-              transitions.colors,
-              className
-            ),
-            ...props
-          }
-        ),
-        rightSlot && /* @__PURE__ */ jsx("div", { "data-slot": "command-input-right-slot", className: "text-neutral3 ml-2 flex shrink-0 items-center", children: rightSlot })
-      ]
-    }
-  )
-);
-CommandInput.displayName = Command$1.Input.displayName;
-const CommandList = React.forwardRef(
-  ({ className, scrollArea = false, scrollAreaClassName, scrollAreaViewportClassName, scrollAreaMask, ...props }, ref) => {
-    const list = /* @__PURE__ */ jsx(
-      Command$1.List,
-      {
-        ref,
-        className: cn(
-          "outline-none focus:outline-none focus-visible:outline-none",
-          scrollArea ? "overflow-visible" : "max-h-dropdown-max-height overflow-x-hidden overflow-y-auto",
-          className
-        ),
-        ...props
-      }
-    );
-    if (!scrollArea) return list;
-    return /* @__PURE__ */ jsx(
-      ScrollArea,
-      {
-        className: cn("min-h-0", scrollAreaClassName),
-        viewPortClassName: scrollAreaViewportClassName,
-        mask: scrollAreaMask,
-        children: list
-      }
-    );
-  }
-);
-CommandList.displayName = Command$1.List.displayName;
-const CommandEmpty = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, { ref, className: "text-ui-smd text-neutral3 py-6 text-center", ...props }));
-CommandEmpty.displayName = Command$1.Empty.displayName;
-const CommandGroup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.Group,
-  {
-    ref,
-    className: cn(
-      "overflow-hidden p-1 text-neutral4",
-      "[&_[cmdk-group-heading]]:text-ui-xs [&_[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-1.5 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group-heading]]:tracking-wider **:[[cmdk-group-heading]]:text-neutral3 **:[[cmdk-group-heading]]:uppercase",
-      className
-    ),
-    ...props
-  }
-));
-CommandGroup.displayName = Command$1.Group.displayName;
-const CommandSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Command$1.Separator, { ref, className: cn("-mx-1 h-px bg-border1", className), ...props }));
-CommandSeparator.displayName = Command$1.Separator.displayName;
-const CommandItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.Item,
-  {
-    ref,
-    className: cn(
-      "relative flex cursor-pointer items-center gap-2.5 rounded-lg px-2 py-1.5 text-ui-smd leading-ui-sm text-neutral4 select-none",
-      "outline-none focus:outline-none focus-visible:outline-none",
-      transitions.colors,
-      "data-[selected=true]:bg-surface4 data-[selected=true]:text-neutral6",
-      "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
-      "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-neutral3 data-[selected=true]:[&_svg]:text-neutral6",
-      className
-    ),
-    ...props
-  }
-));
-CommandItem.displayName = Command$1.Item.displayName;
-const CommandShortcut = ({ className, ...props }) => {
-  return /* @__PURE__ */ jsx("span", { className: cn("ml-auto text-ui-xs tracking-wider text-neutral3 tabular-nums", className), ...props });
-};
-CommandShortcut.displayName = "CommandShortcut";
-
-export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };
+export { C as Command, a as CommandDialog, b as CommandEmpty, c as CommandGroup, d as CommandInput, e as CommandItem, f as CommandList, g as CommandSeparator, h as CommandShortcut } from '../command-Duq1xsiS.js';
 //# sourceMappingURL=Command.es.js.map