@12-apps/ui 5.0.0 → 5.0.1

package/dist/form/CodeEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/form/CodeEditor/CodeEditor.tsx","../../src/components/form/CodeEditor/CodeEditor.helpers.ts","../../src/components/form/CodeEditor/CodeEditor.hooks.ts","../../src/components/form/CodeEditor/CodeEditor.monaco.ts","../../src/components/form/CodeEditor/CodeEditorToolbar.tsx"],"sourcesContent":["import Editor from '@monaco-editor/react';\nimport {\n  alpha,\n  Box,\n  Paper,\n  styled,\n  Typography } from '@mui/material';\nimport type { editor } from 'monaco-editor';\nimport type { FC} from 'react';\nimport React, {  } from 'react';\n\nimport { makeTestId, resolveCodeEditorProps } from './CodeEditor.helpers';\nimport { useCodeEditor } from './CodeEditor.hooks';\nimport type { CodeEditorProps } from './CodeEditor.types';\nimport { EditorToolbar } from './CodeEditorToolbar';\n\n// Styled components\nconst EditorContainer = styled(Paper)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.98)} 0%, ${alpha(theme.palette.background.paper, 0.95)} 100%)`,\n  backdropFilter: 'blur(10px)',\n  WebkitBackdropFilter: 'blur(10px)',\n  border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n  borderRadius: theme.shape.borderRadius * 2,\n  overflow: 'hidden' }));\n\nconst EditorWrapper = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'fullscreen' })<{ fullscreen: boolean }>(({ theme, fullscreen }) => ({\n  position: 'relative',\n  flex: 1,\n  minHeight: 200,\n  ...(fullscreen && {\n    position: 'fixed',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    zIndex: theme.zIndex.modal,\n    background: theme.palette.background.paper }) }));\n\nconst PlaceholderOverlay = styled(Box)(({ theme }) => ({\n  position: 'absolute',\n  top: theme.spacing(2),\n  left: theme.spacing(8),\n  color: theme.palette.text.disabled,\n  fontFamily: 'Monaco, Menlo, \"Ubuntu Mono\", Consolas, source-code-pro, monospace',\n  fontSize: '0.875rem',\n  pointerEvents: 'none',\n  userSelect: 'none' }));\n\n// Monaco editor themes\nconst EditorLoading: FC = () => (\n  <Box\n    sx={{\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      height: '100%',\n      color: 'text.secondary' }}\n  >\n    <Typography variant=\"body2\">Loading editor...</Typography>\n  </Box>\n);\n\nconst buildEditorOptions = ({\n  minimap,\n  fontSize,\n  isWrapped,\n  lineNumbers,\n  readOnly }: {\n  minimap?: boolean;\n  fontSize: number;\n  isWrapped: boolean;\n  lineNumbers: boolean;\n  readOnly: boolean;\n}): editor.IStandaloneEditorConstructionOptions => ({\n    readOnly,\n    // Explicitly convert minimap to boolean to ensure Monaco receives a definitive value\n    // This prevents undefined from being interpreted differently in various environments\n    minimap: { enabled: minimap === true },\n    fontSize,\n    wordWrap: isWrapped ? 'on' : 'off',\n    lineNumbers: lineNumbers ? 'on' : 'off',\n    scrollBeyondLastLine: false,\n    automaticLayout: true,\n    tabSize: 2,\n    insertSpaces: true,\n    folding: true,\n    foldingStrategy: 'indentation',\n    showFoldingControls: 'mouseover',\n    smoothScrolling: true,\n    cursorBlinking: 'smooth',\n    cursorSmoothCaretAnimation: 'on',\n    renderWhitespace: 'selection',\n    renderLineHighlight: 'all',\n    selectOnLineNumbers: true,\n    roundedSelection: true,\n    padding: { top: 16, bottom: 16 },\n    fontFamily: 'Monaco, Menlo, \"Ubuntu Mono\", Consolas, source-code-pro, monospace',\n    fontLigatures: true });\n\nexport const CodeEditor: FC<CodeEditorProps> = (componentProps) => {\n  const {\n    language,\n    height,\n    theme: themeProp,\n    value,\n    onChange,\n    readOnly,\n    lineNumbers,\n    minimap,\n    fontSize,\n    wordWrap,\n    showToolbar,\n    autoFormat,\n    placeholder,\n    onSave,\n    dataTestId } = resolveCodeEditorProps(componentProps);\n\n  const testId = makeTestId(dataTestId);\n  const editor = useCodeEditor({ themeProp, wordWrap, autoFormat, readOnly, onSave });\n\n  const editorOptions = buildEditorOptions({\n    minimap,\n    fontSize,\n    isWrapped: editor.isWrapped,\n    lineNumbers,\n    readOnly });\n\n  return (\n    <EditorContainer elevation={2} data-testid={dataTestId || 'code-editor'}>\n      {showToolbar && (\n        <EditorToolbar\n          language={language}\n          readOnly={readOnly}\n          isWrapped={editor.isWrapped}\n          isCopied={editor.isCopied}\n          isFullscreen={editor.isFullscreen}\n          dataTestId={dataTestId}\n          onFormat={editor.handleFormat}\n          onCopy={editor.handleCopy}\n          onWrapToggle={editor.handleWrapToggle}\n          onFullscreenToggle={editor.handleFullscreenToggle}\n        />\n      )}\n\n      <EditorWrapper fullscreen={editor.isFullscreen} data-testid={testId('editor-wrapper')}>\n        {placeholder && !value && (\n          <PlaceholderOverlay data-testid={testId('placeholder')}>{placeholder}</PlaceholderOverlay>\n        )}\n\n        <Editor\n          height={editor.isFullscreen ? '100vh' : height}\n          language={language}\n          value={value}\n          onChange={(newValue) => onChange?.(newValue || '')}\n          theme={editor.editorTheme}\n          options={editorOptions}\n          onMount={editor.handleEditorDidMount}\n          loading={<EditorLoading />}\n        />\n      </EditorWrapper>\n    </EditorContainer>\n  );\n};\n","import type { CodeEditorProps } from './CodeEditor.types';\n\n// Every element repeated the same conditional test id; this is that ternary once.\nexport const makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `code-editor-${suffix}`;\n\ntype CodeEditorDefaultedKeys =\n  | 'height'\n  | 'theme'\n  | 'readOnly'\n  | 'lineNumbers'\n  | 'minimap'\n  | 'fontSize'\n  | 'wordWrap'\n  | 'showToolbar'\n  | 'autoFormat';\n\ntype ResolvedCodeEditorProps = CodeEditorProps &\n  Required<Pick<CodeEditorProps, CodeEditorDefaultedKeys>>;\n\nconst CODE_EDITOR_DEFAULTS: Pick<CodeEditorProps, CodeEditorDefaultedKeys> = {\n  height: '400px',\n  theme: 'auto',\n  readOnly: false,\n  lineNumbers: true,\n  minimap: false,\n  fontSize: 14,\n  wordWrap: false,\n  showToolbar: true,\n  autoFormat: false,\n};\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}` still\n// falls back to the default exactly as a destructuring default would. Applied as\n// a merge rather than destructuring defaults, which would otherwise put nine\n// branches into the component's own complexity budget.\nexport const resolveCodeEditorProps = (props: CodeEditorProps): ResolvedCodeEditorProps =>\n  ({\n    ...CODE_EDITOR_DEFAULTS,\n    ...(Object.fromEntries(\n      Object.entries(props).filter(([, value]) => value !== undefined),\n    ) as Partial<CodeEditorProps>),\n  }) as ResolvedCodeEditorProps;\n","import type { Monaco } from '@monaco-editor/react';\nimport { useTheme } from '@mui/material';\nimport type { editor } from 'monaco-editor';\nimport React, { useEffect, useRef } from 'react';\n\nimport {\n  configureTypeScriptDefaults,\n  registerEditorThemes,\n  registerSaveShortcut,\n  resolveEditorTheme,\n  scheduleAutoFormat,\n} from './CodeEditor.monaco';\n\nconst COPIED_FEEDBACK_MS = 2000;\n\n// Escape leaves fullscreen, so the flag and its listener belong together.\nconst useFullscreen = () => {\n  const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n  useEffect(() => {\n    if (!isFullscreen) return;\n\n    const handleEsc = (event: globalThis.KeyboardEvent) => {\n      if (event.key === 'Escape') setIsFullscreen(false);\n    };\n\n    window.addEventListener('keydown', handleEsc);\n    return () => window.removeEventListener('keydown', handleEsc);\n  }, [isFullscreen]);\n\n  return { isFullscreen, toggleFullscreen: () => setIsFullscreen((prev) => !prev) };\n};\n\n// All of the editor's own state: the Monaco handles, the three toggles, and the\n// handlers that drive them.\nexport const useCodeEditor = ({\n  themeProp,\n  wordWrap,\n  autoFormat,\n  readOnly,\n  onSave,\n}: {\n  themeProp: string;\n  wordWrap: boolean;\n  autoFormat: boolean;\n  readOnly: boolean;\n  onSave?: (value: string) => void;\n}) => {\n  const theme = useTheme();\n  const editorRef = useRef<editor.IStandaloneCodeEditor | null>(null);\n  const monacoRef = useRef<Monaco | null>(null);\n  const { isFullscreen, toggleFullscreen } = useFullscreen();\n  const [isWrapped, setIsWrapped] = React.useState(wordWrap);\n  const [isCopied, setIsCopied] = React.useState(false);\n\n  const editorTheme = React.useMemo(\n    () => resolveEditorTheme(themeProp, theme.palette.mode),\n    [themeProp, theme.palette.mode],\n  );\n\n  const handleEditorDidMount = (mountedEditor: editor.IStandaloneCodeEditor, monaco: Monaco) => {\n    editorRef.current = mountedEditor;\n    monacoRef.current = monaco;\n\n    registerEditorThemes(monaco);\n    configureTypeScriptDefaults(monaco);\n    scheduleAutoFormat(mountedEditor, autoFormat && !readOnly);\n    registerSaveShortcut(mountedEditor, monaco, onSave);\n  };\n\n  // No-ops where the clipboard API is unavailable, as in jsdom.\n  const handleCopy = async () => {\n    if (!editorRef.current || !navigator.clipboard?.writeText) return;\n\n    try {\n      await navigator.clipboard.writeText(editorRef.current.getValue());\n      setIsCopied(true);\n      window.setTimeout(() => setIsCopied(false), COPIED_FEEDBACK_MS);\n    } catch {\n      // Silently handle clipboard errors in test environments\n    }\n  };\n\n  const handleWrapToggle = () => {\n    setIsWrapped(!isWrapped);\n    editorRef.current?.updateOptions({ wordWrap: !isWrapped ? 'on' : 'off' });\n  };\n\n  const handleFormat = () => {\n    if (!readOnly) editorRef.current?.getAction('editor.action.formatDocument')?.run();\n  };\n\n  return {\n    editorTheme,\n    isFullscreen,\n    isWrapped,\n    isCopied,\n    handleEditorDidMount,\n    handleCopy,\n    handleFullscreenToggle: toggleFullscreen,\n    handleWrapToggle,\n    handleFormat,\n  };\n};\n","import type { Monaco } from '@monaco-editor/react';\nimport type { editor } from 'monaco-editor';\n\nconst customLightTheme = {\n  base: 'vs' as const,\n  inherit: true,\n  rules: [\n    { token: 'comment', foreground: '6A737D', fontStyle: 'italic' },\n    { token: 'keyword', foreground: 'D73A49' },\n    { token: 'string', foreground: '032F62' },\n    { token: 'number', foreground: '005CC5' },\n  ],\n  colors: {\n    'editor.background': '#FFFFFF',\n    'editor.foreground': '#24292E',\n    'editor.lineHighlightBackground': '#F6F8FA',\n    'editorLineNumber.foreground': '#959DA5',\n    'editorIndentGuide.background': '#D1D5DA',\n    'editor.selectionBackground': '#C8E1FF',\n  },\n};\n\nconst customDarkTheme = {\n  base: 'vs-dark' as const,\n  inherit: true,\n  rules: [\n    { token: 'comment', foreground: '6A737D', fontStyle: 'italic' },\n    { token: 'keyword', foreground: 'F97583' },\n    { token: 'string', foreground: '9ECBFF' },\n    { token: 'number', foreground: '79B8FF' },\n  ],\n  colors: {\n    'editor.background': '#0D1117',\n    'editor.foreground': '#C9D1D9',\n    'editor.lineHighlightBackground': '#161B22',\n    'editorLineNumber.foreground': '#8B949E',\n    'editorIndentGuide.background': '#21262D',\n    'editor.selectionBackground': '#3392FF44',\n  },\n};\n\n// Main component\nconst AUTO_FORMAT_DELAY_MS = 100;\n\nexport const registerEditorThemes = (monaco: Monaco) => {\n  monaco.editor.defineTheme('custom-light', customLightTheme);\n  monaco.editor.defineTheme('custom-dark', customDarkTheme);\n};\n\n// Best-effort: a Monaco build without the TypeScript worker (as in jsdom) throws\n// here, and the editor is still usable without it.\nexport const configureTypeScriptDefaults = (monaco: Monaco) => {\n  try {\n    const tsLanguage = monaco.languages\n      .getLanguages()\n      .find((language) => language.id === 'typescript');\n\n    if (!tsLanguage) return;\n\n    monaco.languages.typescript.typescriptDefaults.setCompilerOptions({\n      target: monaco.languages.typescript.ScriptTarget.ES2020,\n      allowNonTsExtensions: true,\n      moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,\n      module: monaco.languages.typescript.ModuleKind.CommonJS,\n      noEmit: true,\n      esModuleInterop: true,\n      jsx: monaco.languages.typescript.JsxEmit.React,\n      reactNamespace: 'React',\n      allowJs: true,\n      typeRoots: ['node_modules/@types'],\n    });\n\n    monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({\n      noSemanticValidation: false,\n      noSyntaxValidation: false,\n      noSuggestionDiagnostics: true,\n    });\n  } catch {\n    // Silently handle any TypeScript configuration errors in test environments\n  }\n};\n\nexport const scheduleAutoFormat = (mountedEditor: editor.IStandaloneCodeEditor, enabled: boolean) => {\n  if (!enabled) return;\n\n  window.setTimeout(() => {\n    mountedEditor.getAction('editor.action.formatDocument')?.run();\n  }, AUTO_FORMAT_DELAY_MS);\n};\n\nexport const registerSaveShortcut = (\n  mountedEditor: editor.IStandaloneCodeEditor,\n  monaco: Monaco,\n  onSave?: (value: string) => void,\n) => {\n  mountedEditor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, () => {\n    onSave?.(mountedEditor.getValue());\n  });\n};\n\n// 'auto' follows the MUI palette; otherwise the caller's choice wins.\nexport const resolveEditorTheme = (themeProp: string, paletteMode: string) => {\n  const wantsDark = themeProp === 'auto' ? paletteMode === 'dark' : themeProp === 'dark';\n\n  return wantsDark ? 'custom-dark' : 'custom-light';\n};\n\n// Monaco's options object. Only the first five entries vary with our props; the\n// rest are fixed editor preferences.\n","import CodeIcon from '@mui/icons-material/Code';\nimport CopyIcon from '@mui/icons-material/ContentCopy';\nimport ExitFullscreenIcon from '@mui/icons-material/FullscreenExit';\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\nimport WrapIcon from '@mui/icons-material/WrapText';\nimport { Box, IconButton, Stack, Tooltip, Typography } from '@mui/material';\nimport { alpha, styled } from '@mui/material';\nimport React from 'react';\n\n// Each button repeated the same conditional test id; this is that ternary once.\nconst makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `code-editor-${suffix}`;\n\nconst Toolbar = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'space-between',\n  alignItems: 'center',\n  padding: theme.spacing(1, 2),\n  borderBottom: `1px solid ${alpha(theme.palette.divider, 0.12)}`,\n  background: alpha(theme.palette.background.default, 0.4),\n}));\n\nconst LanguageBadge = styled(Box)(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: theme.spacing(0.5),\n  padding: theme.spacing(0.5, 1),\n  borderRadius: theme.shape.borderRadius,\n  background: alpha(theme.palette.primary.main, 0.1),\n  color: theme.palette.primary.main,\n  fontSize: '0.75rem',\n  fontWeight: 600,\n  textTransform: 'uppercase',\n  letterSpacing: '0.05em',\n}));\n\nconst EditorActions: React.FC<{\n  readOnly: boolean;\n  isWrapped: boolean;\n  isCopied: boolean;\n  isFullscreen: boolean;\n  dataTestId?: string;\n  onFormat: () => void;\n  onCopy: () => void;\n  onWrapToggle: () => void;\n  onFullscreenToggle: () => void;\n}> = ({\n  readOnly,\n  isWrapped,\n  isCopied,\n  isFullscreen,\n  dataTestId,\n  onFormat,\n  onCopy,\n  onWrapToggle,\n  onFullscreenToggle,\n}) => {\n  const testId = makeTestId(dataTestId);\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n    {!readOnly && (\n      <Tooltip title=\"Format Code (Ctrl+Shift+F)\">\n        <IconButton\n          size=\"small\"\n          onClick={onFormat}\n          data-testid={testId('format-btn')}\n        >\n          <CodeIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n    )}\n\n    <Tooltip title={isWrapped ? 'Disable Word Wrap' : 'Enable Word Wrap'}>\n      <IconButton\n        size=\"small\"\n        onClick={onWrapToggle}\n        color={isWrapped ? 'primary' : 'default'}\n        data-testid={testId('wrap-btn')}\n      >\n        <WrapIcon fontSize=\"small\" />\n      </IconButton>\n    </Tooltip>\n\n    <Tooltip title={isCopied ? 'Copied!' : 'Copy to Clipboard'}>\n      <IconButton\n        size=\"small\"\n        onClick={onCopy}\n        color={isCopied ? 'success' : 'default'}\n        data-testid={testId('copy-btn')}\n      >\n        <CopyIcon fontSize=\"small\" />\n      </IconButton>\n    </Tooltip>\n\n    <Tooltip title={isFullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen'}>\n      <IconButton\n        size=\"small\"\n        onClick={onFullscreenToggle}\n        data-testid={testId('fullscreen-btn')}\n      >\n        {isFullscreen ? (\n          <ExitFullscreenIcon fontSize=\"small\" />\n        ) : (\n          <FullscreenIcon fontSize=\"small\" />\n        )}\n      </IconButton>\n      </Tooltip>\n    </Stack>\n  );\n};\n\n// Language badge, read-only marker and the four action buttons.\nexport const EditorToolbar: React.FC<{\n  language: string;\n  readOnly: boolean;\n  isWrapped: boolean;\n  isCopied: boolean;\n  isFullscreen: boolean;\n  dataTestId?: string;\n  onFormat: () => void;\n  onCopy: () => void;\n  onWrapToggle: () => void;\n  onFullscreenToggle: () => void;\n}> = ({\n  language,\n  readOnly,\n  isWrapped,\n  isCopied,\n  isFullscreen,\n  dataTestId,\n  onFormat,\n  onCopy,\n  onWrapToggle,\n  onFullscreenToggle,\n}) => {\n  const testId = makeTestId(dataTestId);\n\n  return (\n  <Toolbar data-testid={testId('toolbar')}>\n    <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n      <LanguageBadge data-testid={testId('language-badge')}>\n        <CodeIcon sx={{ fontSize: 14 }} />\n        {language}\n      </LanguageBadge>\n      {readOnly && (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          Read Only\n        </Typography>\n      )}\n    </Stack>\n\n    <EditorActions\n      readOnly={readOnly}\n      isWrapped={isWrapped}\n      isCopied={isCopied}\n      isFullscreen={isFullscreen}\n      dataTestId={dataTestId}\n      onFormat={onFormat}\n      onCopy={onCopy}\n      onWrapToggle={onWrapToggle}\n      onFullscreenToggle={onFullscreenToggle}\n    />\n  </Toolbar>\n  );\n};\n"],"mappings":"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","names":["alpha","Box","styled","Typography","makeTestId","jsx","jsxs","styled","alpha","Box","Typography"]}

package/dist/form/Command.js

@@ -0,0 +1,541 @@
+import {
+  accentFor
+} from "../chunk-OZCEKQIX.js";
+import "../chunk-PZ5AY32C.js";
+
+// src/components/form/Command/Command.tsx
+import CloseIcon from "@mui/icons-material/Close";
+import SearchIcon from "@mui/icons-material/Search";
+import {
+  alpha as alpha2,
+  Box as Box2,
+  Chip,
+  Dialog,
+  DialogContent,
+  Divider as Divider2,
+  Fade,
+  Grow,
+  IconButton,
+  InputAdornment,
+  List,
+  ListItemButton,
+  ListItemIcon,
+  ListItemText,
+  TextField,
+  Typography as Typography2,
+  useTheme
+} from "@mui/material";
+import { useMemo as useMemo2 } from "react";
+
+// src/components/form/Command/Command.hooks.ts
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+var COMMAND_DEFAULTS = {
+  open: false,
+  items: [],
+  placeholder: "Type a command or search...",
+  value: "",
+  variant: "default",
+  size: "md",
+  color: "primary",
+  glow: false,
+  pulse: false,
+  loading: false,
+  disabled: false,
+  maxHeight: 400,
+  emptyMessage: "No results found",
+  showCategories: true,
+  showShortcuts: true,
+  showDescriptions: true,
+  autoFocus: true,
+  closeOnSelect: true
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveCommandProps = (props) => ({ ...COMMAND_DEFAULTS, ...definedProps(props) });
+var matches = (item, search) => {
+  const searchTargets = [
+    item.label.toLowerCase(),
+    item.description?.toLowerCase(),
+    ...(item.keywords || []).map((k) => k.toLowerCase())
+  ];
+  return searchTargets.some((target) => target?.includes(search));
+};
+var useFilteredItems = (items, search, customFilter) => useMemo(() => {
+  if (!search) return items;
+  if (customFilter) {
+    return items.filter((item) => customFilter(item, search));
+  }
+  const searchLower = search.toLowerCase();
+  return items.filter((item) => matches(item, searchLower));
+}, [items, search, customFilter]);
+var useAutoFocus = (open, autoFocus) => {
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (open && autoFocus) {
+      window.setTimeout(() => inputRef.current?.focus(), 100);
+    }
+  }, [open, autoFocus]);
+};
+var useKeyboardNavigation = ({
+  items,
+  selectedIndex,
+  setSelectedIndex,
+  onSelect,
+  onClose
+}) => useCallback(
+  (e) => {
+    const step = (delta) => {
+      e.preventDefault();
+      setSelectedIndex((prev) => (prev + delta + items.length) % items.length);
+    };
+    switch (e.key) {
+      case "ArrowDown":
+        return step(1);
+      case "ArrowUp":
+        return step(-1);
+      case "Enter":
+        e.preventDefault();
+        if (items[selectedIndex]) {
+          onSelect(items[selectedIndex]);
+        }
+        return;
+      case "Escape":
+        e.preventDefault();
+        onClose();
+        return;
+      default:
+        return;
+    }
+  },
+  [items, selectedIndex, setSelectedIndex, onSelect, onClose]
+);
+var useCommandPalette = (props) => {
+  const { open, items, value, autoFocus, customFilter } = props;
+  const { onValueChange, onSelect, onOpenChange, closeOnSelect } = props;
+  const [internalValue, setInternalValue] = useState(value);
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  useAutoFocus(open, autoFocus);
+  useEffect(() => {
+    setInternalValue(value);
+  }, [value]);
+  const handleValueChange = useCallback(
+    (newValue) => {
+      setInternalValue(newValue);
+      onValueChange?.(newValue);
+      setSelectedIndex(0);
+    },
+    [onValueChange]
+  );
+  const filteredItems = useFilteredItems(items, internalValue, customFilter);
+  const selectableItems = useMemo(
+    () => filteredItems.filter((item) => !item.disabled),
+    [filteredItems]
+  );
+  const handleSelect = useCallback(
+    (item) => {
+      if (item.disabled) return;
+      item.action?.();
+      onSelect?.(item);
+      if (closeOnSelect) {
+        onOpenChange?.(false);
+        setInternalValue("");
+      }
+    },
+    [onSelect, onOpenChange, closeOnSelect]
+  );
+  const handleKeyDown = useKeyboardNavigation({
+    items: selectableItems,
+    selectedIndex,
+    setSelectedIndex,
+    onSelect: handleSelect,
+    onClose: () => onOpenChange?.(false)
+  });
+  return {
+    internalValue,
+    filteredItems,
+    highlightedId: selectableItems[selectedIndex]?.id,
+    handleValueChange,
+    handleSelect,
+    handleKeyDown
+  };
+};
+
+// src/components/form/Command/Command.parts.tsx
+import { Box, CircularProgress, Divider, Typography } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CommandEmpty = ({
+  message = "No results found",
+  className,
+  style,
+  dataTestId
+}) => /* @__PURE__ */ jsx(
+  Box,
+  {
+    className,
+    "data-testid": dataTestId,
+    sx: {
+      p: 4,
+      textAlign: "center",
+      color: "text.secondary",
+      ...style
+    },
+    children: /* @__PURE__ */ jsx(Typography, { variant: "body2", children: message })
+  }
+);
+var CommandLoading = ({
+  message = "Loading...",
+  className,
+  style,
+  dataTestId
+}) => /* @__PURE__ */ jsxs(
+  Box,
+  {
+    className,
+    "data-testid": dataTestId,
+    sx: {
+      p: 4,
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      gap: 2,
+      ...style
+    },
+    children: [
+      /* @__PURE__ */ jsx(CircularProgress, { size: 24 }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", children: message })
+    ]
+  }
+);
+var CommandSeparator = ({
+  className,
+  style
+}) => /* @__PURE__ */ jsx(Divider, { className, sx: { my: 1, ...style } });
+
+// src/components/form/Command/Command.styles.ts
+import { alpha } from "@mui/material";
+var SIZE_MAP = {
+  xs: { width: 400, fontSize: "0.75rem" },
+  sm: { width: 450, fontSize: "0.875rem" },
+  md: { width: 500, fontSize: "1rem" },
+  lg: { width: 550, fontSize: "1.125rem" },
+  xl: { width: 600, fontSize: "1.25rem" }
+};
+var commandSizeStyles = (size) => SIZE_MAP[size] || SIZE_MAP.md;
+var emphasisStyles = (theme, color, glow, pulse) => ({
+  ...glow && {
+    boxShadow: `0 0 20px ${alpha(accentFor(theme, color).main, 0.4)}`
+  },
+  ...pulse && {
+    animation: "pulse 2s infinite",
+    "@keyframes pulse": {
+      "0%": { boxShadow: `0 0 0 0 ${alpha(accentFor(theme, color).main, 0.4)}` },
+      "70%": { boxShadow: `0 0 0 10px ${alpha(accentFor(theme, color).main, 0)}` },
+      "100%": { boxShadow: `0 0 0 0 ${alpha(accentFor(theme, color).main, 0)}` }
+    }
+  }
+});
+var surfaceStyles = (theme, variant, color) => {
+  switch (variant) {
+    case "glass":
+      return {
+        backgroundColor: alpha(theme.palette.background.paper, 0.1),
+        backdropFilter: "blur(20px)",
+        border: `1px solid ${alpha(accentFor(theme, color).main, 0.2)}`
+      };
+    case "gradient":
+      return {
+        background: `linear-gradient(135deg, ${accentFor(theme, color).main}, ${accentFor(theme, color).dark})`,
+        color: accentFor(theme, color).contrastText
+      };
+    case "elevated":
+      return { boxShadow: theme.shadows[8] };
+    case "minimal":
+      return { border: "none", boxShadow: "none" };
+    default:
+      return {};
+  }
+};
+var commandPaperStyles = (theme, { variant, color, glow, pulse }) => ({
+  transition: theme.transitions.create(["all"], {
+    duration: theme.transitions.duration.standard
+  }),
+  ...emphasisStyles(theme, color, glow, pulse),
+  ...surfaceStyles(theme, variant, color)
+});
+
+// src/components/form/Command/Command.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var makeTestId = (dataTestId) => (suffix) => dataTestId ? `${dataTestId}-${suffix}` : void 0;
+var Command = (rawProps) => {
+  const props = resolveCommandProps(rawProps);
+  const { open, onOpenChange, variant, dataTestId } = props;
+  const theme = useTheme();
+  const testId = makeTestId(dataTestId);
+  const { internalValue, filteredItems, highlightedId, handleValueChange, handleSelect, handleKeyDown } = useCommandPalette(props);
+  return /* @__PURE__ */ jsx2(
+    Dialog,
+    {
+      open,
+      onClose: () => onOpenChange?.(false),
+      maxWidth: false,
+      PaperProps: {
+        sx: {
+          ...commandPaperStyles(theme, props),
+          ...commandSizeStyles(props.size),
+          overflow: "hidden",
+          ...props.style
+        },
+        className: props.className,
+        "data-testid": dataTestId
+      },
+      TransitionComponent: variant === "glass" ? Fade : Grow,
+      onClick: props.onClick,
+      children: /* @__PURE__ */ jsxs2(Box2, { sx: { p: 0 }, children: [
+        /* @__PURE__ */ jsx2(
+          CommandInput,
+          {
+            placeholder: props.placeholder,
+            value: internalValue,
+            onChange: handleValueChange,
+            onFocus: props.onFocus,
+            onBlur: props.onBlur,
+            disabled: props.disabled,
+            autoFocus: props.autoFocus,
+            onKeyDown: handleKeyDown,
+            dataTestId: testId("input")
+          }
+        ),
+        /* @__PURE__ */ jsx2(Divider2, {}),
+        /* @__PURE__ */ jsxs2(DialogContent, { sx: { p: 0, maxHeight: props.maxHeight, overflow: "auto" }, children: [
+          /* @__PURE__ */ jsx2(
+            CommandBody,
+            {
+              loading: props.loading,
+              items: filteredItems,
+              value: internalValue,
+              emptyMessage: props.emptyMessage,
+              onSelect: handleSelect,
+              selectedId: highlightedId,
+              showCategories: props.showCategories,
+              showShortcuts: props.showShortcuts,
+              showDescriptions: props.showDescriptions,
+              testId
+            }
+          ),
+          props.children
+        ] })
+      ] })
+    }
+  );
+};
+var CommandBody = ({ loading, emptyMessage, testId, ...list }) => {
+  if (loading) {
+    return /* @__PURE__ */ jsx2(CommandLoading, { dataTestId: testId("loading") });
+  }
+  if (!list.items?.length) {
+    return /* @__PURE__ */ jsx2(CommandEmpty, { message: emptyMessage, dataTestId: testId("empty") });
+  }
+  return /* @__PURE__ */ jsx2(CommandList, { ...list, dataTestId: testId("list") });
+};
+var CommandInput = ({
+  placeholder,
+  value,
+  onChange,
+  onFocus,
+  onBlur,
+  disabled,
+  autoFocus,
+  onKeyDown,
+  className,
+  style,
+  dataTestId
+}) => /* @__PURE__ */ jsx2(
+  TextField,
+  {
+    fullWidth: true,
+    value,
+    onChange: (e) => onChange?.(e.target.value),
+    onFocus,
+    onBlur,
+    onKeyDown,
+    placeholder,
+    disabled,
+    autoFocus,
+    variant: "standard",
+    className,
+    inputProps: {
+      "data-testid": dataTestId
+    },
+    sx: {
+      p: 2,
+      "& .MuiInput-underline:before": { border: "none" },
+      "& .MuiInput-underline:after": { border: "none" },
+      ...style
+    },
+    InputProps: {
+      startAdornment: /* @__PURE__ */ jsx2(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx2(SearchIcon, {}) }),
+      endAdornment: value && /* @__PURE__ */ jsx2(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx2(IconButton, { size: "small", onClick: () => onChange?.(""), children: /* @__PURE__ */ jsx2(CloseIcon, { fontSize: "small" }) }) })
+    }
+  }
+);
+var CommandList = ({
+  items = [],
+  onSelect,
+  selectedId,
+  emptyMessage,
+  showCategories,
+  showShortcuts,
+  showDescriptions,
+  loading,
+  className,
+  style,
+  dataTestId
+}) => {
+  const groupedItems = useMemo2(() => {
+    if (!showCategories) return { "": items };
+    const groups = {};
+    items.forEach((item) => {
+      const category = item.category || "";
+      if (!groups[category]) groups[category] = [];
+      groups[category].push(item);
+    });
+    return groups;
+  }, [items, showCategories]);
+  if (loading) return /* @__PURE__ */ jsx2(CommandLoading, { dataTestId: dataTestId ? `${dataTestId}-loading` : void 0 });
+  if (items.length === 0) return /* @__PURE__ */ jsx2(CommandEmpty, { message: emptyMessage, dataTestId: dataTestId ? `${dataTestId}-empty` : void 0 });
+  return /* @__PURE__ */ jsx2(List, { className, sx: style, "data-testid": dataTestId, children: Object.entries(groupedItems).map(([category, categoryItems]) => /* @__PURE__ */ jsx2(
+    CommandGroup,
+    {
+      heading: category,
+      items: categoryItems,
+      onSelect,
+      selectedId,
+      showShortcuts,
+      showDescriptions
+    },
+    category
+  )) });
+};
+var CommandGroup = ({
+  heading,
+  items = [],
+  onSelect,
+  selectedId,
+  showShortcuts,
+  showDescriptions,
+  className,
+  style,
+  dataTestId
+}) => {
+  const groupTestId = dataTestId || (heading ? `command-group-${heading}` : void 0);
+  return /* @__PURE__ */ jsxs2(Box2, { className, sx: style, "data-testid": groupTestId, children: [
+    heading && /* @__PURE__ */ jsx2(
+      Typography2,
+      {
+        variant: "caption",
+        sx: {
+          px: 2,
+          py: 1,
+          display: "block",
+          color: "text.secondary",
+          fontWeight: 600,
+          textTransform: "uppercase"
+        },
+        children: heading
+      }
+    ),
+    items.map((item) => /* @__PURE__ */ jsx2(
+      CommandItemComponent,
+      {
+        ...item,
+        selected: selectedId === item.id,
+        onSelect: () => onSelect?.(item),
+        showShortcut: showShortcuts,
+        showDescription: showDescriptions,
+        dataTestId: `command-item-${item.id}`
+      },
+      item.id
+    ))
+  ] });
+};
+var CommandItemComponent = ({
+  label,
+  description,
+  icon,
+  shortcut,
+  disabled,
+  selected,
+  onSelect,
+  showShortcut,
+  showDescription,
+  className,
+  style,
+  dataTestId
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs2(
+    ListItemButton,
+    {
+      onClick: onSelect,
+      disabled,
+      selected,
+      className,
+      "data-testid": dataTestId,
+      sx: {
+        py: 1.5,
+        px: 2,
+        "&:hover": {
+          backgroundColor: alpha2(theme.palette.primary.main, 0.08)
+        },
+        "&.Mui-selected": {
+          backgroundColor: alpha2(theme.palette.primary.main, 0.12),
+          "&:hover": {
+            backgroundColor: alpha2(theme.palette.primary.main, 0.16)
+          }
+        },
+        ...style
+      },
+      children: [
+        icon && /* @__PURE__ */ jsx2(ListItemIcon, { sx: { minWidth: 40 }, children: icon }),
+        /* @__PURE__ */ jsx2(
+          ListItemText,
+          {
+            primary: label,
+            secondary: showDescription && description,
+            primaryTypographyProps: {
+              fontSize: "0.875rem",
+              fontWeight: selected ? 600 : 400
+            },
+            secondaryTypographyProps: {
+              fontSize: "0.75rem"
+            }
+          }
+        ),
+        showShortcut && shortcut && /* @__PURE__ */ jsx2(
+          Chip,
+          {
+            label: shortcut,
+            size: "small",
+            variant: "outlined",
+            sx: {
+              height: 20,
+              fontSize: "0.7rem",
+              ml: 1
+            }
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandList,
+  CommandLoading,
+  CommandSeparator
+};
+//# sourceMappingURL=Command.js.map

package/dist/form/Command.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/form/Command/Command.tsx","../../src/components/form/Command/Command.hooks.ts","../../src/components/form/Command/Command.parts.tsx","../../src/components/form/Command/Command.styles.ts"],"sourcesContent":["import CloseIcon from '@mui/icons-material/Close';\nimport SearchIcon from '@mui/icons-material/Search';\nimport {\n  alpha,\n  Box,\n  Chip,\n  Dialog,\n  DialogContent,\n  Divider,\n  Fade,\n  Grow,\n  IconButton,\n  InputAdornment,\n  List,\n  ListItemButton,\n  ListItemIcon,\n  ListItemText,\n  TextField,\n  Typography,\n  useTheme,\n} from '@mui/material';\nimport React, { useMemo } from 'react';\n\nimport { resolveCommandProps, useCommandPalette } from './Command.hooks';\nimport { CommandEmpty, CommandLoading } from './Command.parts';\nimport { commandPaperStyles, commandSizeStyles } from './Command.styles';\nimport type {\n  CommandGroupProps,\n  CommandInputProps,\n  CommandItem,\n  CommandItemProps,\n  CommandListProps,\n  CommandProps,\n} from './Command.types';\n\nexport { CommandEmpty, CommandLoading, CommandSeparator } from './Command.parts';\n\nconst makeTestId = (dataTestId?: string) => (suffix: string) =>\n  dataTestId ? `${dataTestId}-${suffix}` : undefined;\n\nexport const Command: React.FC<CommandProps> = (rawProps) => {\n  const props = resolveCommandProps(rawProps);\n  const { open, onOpenChange, variant, dataTestId } = props;\n  const theme = useTheme();\n  const testId = makeTestId(dataTestId);\n\n  const { internalValue, filteredItems, highlightedId, handleValueChange, handleSelect, handleKeyDown } =\n    useCommandPalette(props);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={() => onOpenChange?.(false)}\n      maxWidth={false}\n      PaperProps={{\n        sx: {\n          ...commandPaperStyles(theme, props),\n          ...commandSizeStyles(props.size),\n          overflow: 'hidden',\n          ...props.style,\n        },\n        className: props.className,\n        'data-testid': dataTestId,\n      }}\n      TransitionComponent={variant === 'glass' ? Fade : Grow}\n      onClick={props.onClick}\n    >\n      <Box sx={{ p: 0 }}>\n        <CommandInput\n          placeholder={props.placeholder}\n          value={internalValue}\n          onChange={handleValueChange}\n          onFocus={props.onFocus}\n          onBlur={props.onBlur}\n          disabled={props.disabled}\n          autoFocus={props.autoFocus}\n          onKeyDown={handleKeyDown}\n          dataTestId={testId('input')}\n        />\n\n        <Divider />\n\n        <DialogContent sx={{ p: 0, maxHeight: props.maxHeight, overflow: 'auto' }}>\n          <CommandBody\n            loading={props.loading}\n            items={filteredItems}\n            value={internalValue}\n            emptyMessage={props.emptyMessage}\n            onSelect={handleSelect}\n            selectedId={highlightedId}\n            showCategories={props.showCategories}\n            showShortcuts={props.showShortcuts}\n            showDescriptions={props.showDescriptions}\n            testId={testId}\n          />\n          {props.children}\n        </DialogContent>\n      </Box>\n    </Dialog>\n  );\n};\n\ntype CommandBodyProps = Pick<\n  CommandListProps,\n  'items' | 'value' | 'onSelect' | 'selectedId' | 'showCategories' | 'showShortcuts' | 'showDescriptions'\n> & {\n  loading: boolean;\n  emptyMessage: string;\n  testId: (suffix: string) => string | undefined;\n};\n\n/** Three mutually exclusive states share the scrolling area: busy, empty, or a list. */\nconst CommandBody: React.FC<CommandBodyProps> = ({ loading, emptyMessage, testId, ...list }) => {\n  if (loading) {\n    return <CommandLoading dataTestId={testId('loading')} />;\n  }\n\n  if (!list.items?.length) {\n    return <CommandEmpty message={emptyMessage} dataTestId={testId('empty')} />;\n  }\n\n  return <CommandList {...list} dataTestId={testId('list')} />;\n};\n\nexport const CommandInput: React.FC<CommandInputProps> = ({\n  placeholder,\n  value,\n  onChange,\n  onFocus,\n  onBlur,\n  disabled,\n  autoFocus,\n  onKeyDown,\n  className,\n  style,\n  dataTestId,\n}) => (\n    <TextField\n      fullWidth\n      value={value}\n      onChange={(e) => onChange?.(e.target.value)}\n      onFocus={onFocus}\n      onBlur={onBlur}\n      onKeyDown={onKeyDown}\n      placeholder={placeholder}\n      disabled={disabled}\n      autoFocus={autoFocus}\n      variant=\"standard\"\n      className={className}\n      inputProps={{\n        'data-testid': dataTestId,\n      }}\n      sx={{\n        p: 2,\n        '& .MuiInput-underline:before': { border: 'none' },\n        '& .MuiInput-underline:after': { border: 'none' },\n        ...style,\n      }}\n      InputProps={{\n        startAdornment: (\n          <InputAdornment position=\"start\">\n            <SearchIcon />\n          </InputAdornment>\n        ),\n        endAdornment: value && (\n          <InputAdornment position=\"end\">\n            <IconButton size=\"small\" onClick={() => onChange?.('')}>\n              <CloseIcon fontSize=\"small\" />\n            </IconButton>\n          </InputAdornment>\n        ),\n      }}\n    />\n  );\n\nexport const CommandList: React.FC<CommandListProps> = ({\n  items = [],\n  onSelect,\n  selectedId,\n  emptyMessage,\n  showCategories,\n  showShortcuts,\n  showDescriptions,\n  loading,\n  className,\n  style,\n  dataTestId,\n}) => {\n  const groupedItems = useMemo(() => {\n    if (!showCategories) return { '': items };\n\n    const groups: Record<string, CommandItem[]> = {};\n    items.forEach(item => {\n      const category = item.category || '';\n      if (!groups[category]) groups[category] = [];\n      groups[category].push(item);\n    });\n    return groups;\n  }, [items, showCategories]);\n\n  if (loading) return <CommandLoading dataTestId={dataTestId ? `${dataTestId}-loading` : undefined} />;\n  if (items.length === 0) return <CommandEmpty message={emptyMessage} dataTestId={dataTestId ? `${dataTestId}-empty` : undefined} />;\n\n  return (\n    <List className={className} sx={style} data-testid={dataTestId}>\n      {Object.entries(groupedItems).map(([category, categoryItems]) => (\n        <CommandGroup\n          key={category}\n          heading={category}\n          items={categoryItems}\n          onSelect={onSelect}\n          selectedId={selectedId}\n          showShortcuts={showShortcuts}\n          showDescriptions={showDescriptions}\n        />\n      ))}\n    </List>\n  );\n};\n\nexport const CommandGroup: React.FC<CommandGroupProps> = ({\n  heading,\n  items = [],\n  onSelect,\n  selectedId,\n  showShortcuts,\n  showDescriptions,\n  className,\n  style,\n  dataTestId,\n}) => {\n  const groupTestId = dataTestId || (heading ? `command-group-${heading}` : undefined);\n\n  return (\n    <Box className={className} sx={style} data-testid={groupTestId}>\n      {heading && (\n        <Typography\n          variant=\"caption\"\n          sx={{\n            px: 2,\n            py: 1,\n            display: 'block',\n            color: 'text.secondary',\n            fontWeight: 600,\n            textTransform: 'uppercase',\n          }}\n        >\n          {heading}\n        </Typography>\n      )}\n      {items.map((item) => (\n        <CommandItemComponent\n          key={item.id}\n          {...item}\n          selected={selectedId === item.id}\n          onSelect={() => onSelect?.(item)}\n          showShortcut={showShortcuts}\n          showDescription={showDescriptions}\n          dataTestId={`command-item-${item.id}`}\n        />\n      ))}\n    </Box>\n  );\n};\n\nconst CommandItemComponent: React.FC<CommandItemProps> = ({\n  label,\n  description,\n  icon,\n  shortcut,\n  disabled,\n  selected,\n  onSelect,\n  showShortcut,\n  showDescription,\n  className,\n  style,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <ListItemButton\n      onClick={onSelect}\n      disabled={disabled}\n      selected={selected}\n      className={className}\n      data-testid={dataTestId}\n      sx={{\n        py: 1.5,\n        px: 2,\n        '&:hover': {\n          backgroundColor: alpha(theme.palette.primary.main, 0.08),\n        },\n        '&.Mui-selected': {\n          backgroundColor: alpha(theme.palette.primary.main, 0.12),\n          '&:hover': {\n            backgroundColor: alpha(theme.palette.primary.main, 0.16),\n          },\n        },\n        ...style,\n      }}\n    >\n      {icon && (\n        <ListItemIcon sx={{ minWidth: 40 }}>\n          {icon}\n        </ListItemIcon>\n      )}\n\n      <ListItemText\n        primary={label}\n        secondary={showDescription && description}\n        primaryTypographyProps={{\n          fontSize: '0.875rem',\n          fontWeight: selected ? 600 : 400,\n        }}\n        secondaryTypographyProps={{\n          fontSize: '0.75rem',\n        }}\n      />\n\n      {showShortcut && shortcut && (\n        <Chip\n          label={shortcut}\n          size=\"small\"\n          variant=\"outlined\"\n          sx={{\n            height: 20,\n            fontSize: '0.7rem',\n            ml: 1,\n          }}\n        />\n      )}\n    </ListItemButton>\n  );\n};\n","import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport type { CommandItem, CommandProps } from './Command.types';\n\ntype CommandDefaultedKeys =\n  | 'open'\n  | 'items'\n  | 'placeholder'\n  | 'value'\n  | 'variant'\n  | 'size'\n  | 'color'\n  | 'glow'\n  | 'pulse'\n  | 'loading'\n  | 'disabled'\n  | 'maxHeight'\n  | 'emptyMessage'\n  | 'showCategories'\n  | 'showShortcuts'\n  | 'showDescriptions'\n  | 'autoFocus'\n  | 'closeOnSelect';\n\ntype ResolvedCommandProps = CommandProps &\n  Required<Pick<CommandProps, CommandDefaultedKeys>>;\n\nconst COMMAND_DEFAULTS: Pick<CommandProps, CommandDefaultedKeys> = {\n  open: false,\n  items: [],\n  placeholder: 'Type a command or search...',\n  value: '',\n  variant: 'default',\n  size: 'md',\n  color: 'primary',\n  glow: false,\n  pulse: false,\n  loading: false,\n  disabled: false,\n  maxHeight: 400,\n  emptyMessage: 'No results found',\n  showCategories: true,\n  showShortcuts: true,\n  showDescriptions: true,\n  autoFocus: true,\n  closeOnSelect: true,\n};\n\n// Strips explicitly-undefined props before the merge, so `size={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = (props: CommandProps): Partial<CommandProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<CommandProps>;\n\nexport const resolveCommandProps = (props: CommandProps): ResolvedCommandProps =>\n  ({ ...COMMAND_DEFAULTS, ...definedProps(props) }) as ResolvedCommandProps;\n\n/** An item matches on its label, its description, or any of its keywords. */\nconst matches = (item: CommandItem, search: string): boolean => {\n  const searchTargets = [\n    item.label.toLowerCase(),\n    item.description?.toLowerCase(),\n    ...(item.keywords || []).map((k) => k.toLowerCase()),\n  ];\n  return searchTargets.some((target) => target?.includes(search));\n};\n\nconst useFilteredItems = (\n  items: CommandItem[],\n  search: string,\n  customFilter: CommandProps['customFilter'],\n) =>\n  useMemo(() => {\n    if (!search) return items;\n\n    if (customFilter) {\n      return items.filter((item) => customFilter(item, search));\n    }\n\n    const searchLower = search.toLowerCase();\n    return items.filter((item) => matches(item, searchLower));\n  }, [items, search, customFilter]);\n\n/**\n * Kept as it was: the ref is never attached to an element, so this focus call has\n * always been a no-op. The input does get focus — CommandInput passes `autoFocus`\n * straight to its TextField — so removing it is a behaviour question, not a\n * cleanup, and is left alone here.\n */\nconst useAutoFocus = (open: boolean, autoFocus: boolean) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (open && autoFocus) {\n      window.setTimeout(() => inputRef.current?.focus(), 100);\n    }\n  }, [open, autoFocus]);\n};\n\ninterface NavigationArgs {\n  items: CommandItem[];\n  selectedIndex: number;\n  setSelectedIndex: React.Dispatch<React.SetStateAction<number>>;\n  onSelect: (item: CommandItem) => void;\n  onClose: () => void;\n}\n\n/** Arrows wrap around the list; Enter takes the highlighted item, Escape closes. */\nconst useKeyboardNavigation = ({\n  items,\n  selectedIndex,\n  setSelectedIndex,\n  onSelect,\n  onClose,\n}: NavigationArgs) =>\n  useCallback(\n    (e: React.KeyboardEvent) => {\n      const step = (delta: number) => {\n        e.preventDefault();\n        setSelectedIndex((prev) => (prev + delta + items.length) % items.length);\n      };\n\n      switch (e.key) {\n        case 'ArrowDown':\n          return step(1);\n        case 'ArrowUp':\n          return step(-1);\n        case 'Enter':\n          e.preventDefault();\n          if (items[selectedIndex]) {\n            onSelect(items[selectedIndex]);\n          }\n          return;\n        case 'Escape':\n          e.preventDefault();\n          onClose();\n          return;\n        default:\n          return;\n      }\n    },\n    [items, selectedIndex, setSelectedIndex, onSelect, onClose],\n  );\n\nexport const useCommandPalette = (props: ResolvedCommandProps) => {\n  const { open, items, value, autoFocus, customFilter } = props;\n  const { onValueChange, onSelect, onOpenChange, closeOnSelect } = props;\n\n  const [internalValue, setInternalValue] = useState(value);\n  const [selectedIndex, setSelectedIndex] = useState(0);\n  useAutoFocus(open, autoFocus);\n\n  useEffect(() => {\n    setInternalValue(value);\n  }, [value]);\n\n  const handleValueChange = useCallback(\n    (newValue: string) => {\n      setInternalValue(newValue);\n      onValueChange?.(newValue);\n      setSelectedIndex(0);\n    },\n    [onValueChange],\n  );\n\n  const filteredItems = useFilteredItems(items, internalValue, customFilter);\n\n  // Arrow keys and Enter address the enabled items only, so a disabled row never\n  // becomes the highlighted one.\n  const selectableItems = useMemo(\n    () => filteredItems.filter((item) => !item.disabled),\n    [filteredItems],\n  );\n\n  const handleSelect = useCallback(\n    (item: CommandItem) => {\n      if (item.disabled) return;\n\n      item.action?.();\n      onSelect?.(item);\n\n      if (closeOnSelect) {\n        onOpenChange?.(false);\n        setInternalValue('');\n      }\n    },\n    [onSelect, onOpenChange, closeOnSelect],\n  );\n\n  const handleKeyDown = useKeyboardNavigation({\n    items: selectableItems,\n    selectedIndex,\n    setSelectedIndex,\n    onSelect: handleSelect,\n    onClose: () => onOpenChange?.(false),\n  });\n\n  return {\n    internalValue,\n    filteredItems,\n    highlightedId: selectableItems[selectedIndex]?.id,\n    handleValueChange,\n    handleSelect,\n    handleKeyDown,\n  };\n};\n","import { Box, CircularProgress, Divider, Typography } from '@mui/material';\nimport React from 'react';\n\nimport type {\n  CommandEmptyProps,\n  CommandLoadingProps,\n  CommandSeparatorProps,\n} from './Command.types';\n\nexport const CommandEmpty: React.FC<CommandEmptyProps> = ({\n  message = 'No results found',\n  className,\n  style,\n  dataTestId,\n}) => (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      sx={{\n        p: 4,\n        textAlign: 'center',\n        color: 'text.secondary',\n        ...style,\n      }}\n    >\n      <Typography variant=\"body2\">{message}</Typography>\n    </Box>\n  );\n\nexport const CommandLoading: React.FC<CommandLoadingProps> = ({\n  message = 'Loading...',\n  className,\n  style,\n  dataTestId,\n}) => (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      sx={{\n        p: 4,\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        gap: 2,\n        ...style,\n      }}\n    >\n      <CircularProgress size={24} />\n      <Typography variant=\"body2\" color=\"text.secondary\">\n        {message}\n      </Typography>\n    </Box>\n  );\n\nexport const CommandSeparator: React.FC<CommandSeparatorProps> = ({\n  className,\n  style,\n}) => <Divider className={className} sx={{ my: 1, ...style }} />;","import { alpha } from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\n\nimport type { CommandProps } from './Command.types';\nimport { accentFor } from '../../../tokens/scales';\n\ntype CommandVariant = NonNullable<CommandProps['variant']>;\ntype CommandColor = NonNullable<CommandProps['color']>;\ntype CommandSize = NonNullable<CommandProps['size']>;\n\nconst SIZE_MAP: Record<CommandSize, { width: number; fontSize: string }> = {\n  xs: { width: 400, fontSize: '0.75rem' },\n  sm: { width: 450, fontSize: '0.875rem' },\n  md: { width: 500, fontSize: '1rem' },\n  lg: { width: 550, fontSize: '1.125rem' },\n  xl: { width: 600, fontSize: '1.25rem' },\n};\n\nexport const commandSizeStyles = (size: CommandSize) => SIZE_MAP[size] || SIZE_MAP.md;\n\nconst emphasisStyles = (\n  theme: Theme,\n  color: CommandColor,\n  glow: boolean,\n  pulse: boolean,\n): CSSObject => ({\n  ...(glow && {\n    boxShadow: `0 0 20px ${alpha(accentFor(theme, color).main, 0.4)}`,\n  }),\n  ...(pulse && {\n    animation: 'pulse 2s infinite',\n    '@keyframes pulse': {\n      '0%': { boxShadow: `0 0 0 0 ${alpha(accentFor(theme, color).main, 0.4)}` },\n      '70%': { boxShadow: `0 0 0 10px ${alpha(accentFor(theme, color).main, 0)}` },\n      '100%': { boxShadow: `0 0 0 0 ${alpha(accentFor(theme, color).main, 0)}` },\n    },\n  }),\n});\n\nconst surfaceStyles = (\n  theme: Theme,\n  variant: CommandVariant,\n  color: CommandColor,\n): CSSObject => {\n  switch (variant) {\n    case 'glass':\n      return {\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: 'blur(20px)',\n        border: `1px solid ${alpha(accentFor(theme, color).main, 0.2)}`,\n      };\n    case 'gradient':\n      return {\n        background: `linear-gradient(135deg, ${accentFor(theme, color).main}, ${accentFor(theme, color).dark})`,\n        color: accentFor(theme, color).contrastText,\n      };\n    case 'elevated':\n      return { boxShadow: theme.shadows[8] };\n    case 'minimal':\n      return { border: 'none', boxShadow: 'none' };\n    default:\n      return {};\n  }\n};\n\n/**\n * Every variant shares the same transition and the same optional glow/pulse; only\n * the surface — background, border, shadow — differs.\n */\nexport const commandPaperStyles = (\n  theme: Theme,\n  { variant, color, glow, pulse }: {\n    variant: CommandVariant;\n    color: CommandColor;\n    glow: boolean;\n    pulse: boolean;\n  },\n): CSSObject => ({\n  transition: theme.transitions.create(['all'], {\n    duration: theme.transitions.duration.standard,\n  }),\n  ...emphasisStyles(theme, color, glow, pulse),\n  ...surfaceStyles(theme, variant, color),\n});\n"],"mappings":"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","names":["alpha","Box","Divider","Typography","useMemo","jsx","jsxs","Box","Divider","useMemo","Typography","alpha"]}