@omnitron-dev/prism 0.3.0 → 0.3.2

package/dist/chunk-WD4N72DL.js

@@ -0,0 +1,315 @@
+import { useState, useCallback, useRef, useId, useEffect, useMemo } from 'react';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import TextField from '@mui/material/TextField';
+import InputAdornment from '@mui/material/InputAdornment';
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import Divider from '@mui/material/Divider';
+import Chip from '@mui/material/Chip';
+import { alpha } from '@mui/material/styles';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/components/command-palette/command-palette.tsx
+function CommandPalette({
+  actions,
+  open: controlledOpen,
+  onOpenChange,
+  onClosed,
+  triggerKey = "k",
+  disableShortcut = false,
+  placeholder = "Type a command or search\u2026",
+  emptyMessage = "No matching commands"
+}) {
+  const [internalOpen, setInternalOpen] = useState(false);
+  const open = controlledOpen ?? internalOpen;
+  const setOpen = useCallback(
+    (next) => {
+      if (controlledOpen === void 0) setInternalOpen(next);
+      onOpenChange?.(next);
+    },
+    [controlledOpen, onOpenChange]
+  );
+  const [query, setQuery] = useState("");
+  const [highlight, setHighlight] = useState(0);
+  const inputRef = useRef(null);
+  const listId = useId();
+  useEffect(() => {
+    if (disableShortcut) return void 0;
+    const onKey = (e) => {
+      if (e.defaultPrevented || e.isComposing || e.repeat) return;
+      const meta = e.metaKey || e.ctrlKey;
+      if (meta && e.key.toLowerCase() === triggerKey.toLowerCase() && !e.altKey && !e.shiftKey) {
+        e.preventDefault();
+        setOpen(!open);
+      }
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [triggerKey, disableShortcut, open, setOpen]);
+  useEffect(() => {
+    if (open) {
+      setQuery("");
+      setHighlight(0);
+      const id = requestAnimationFrame(() => inputRef.current?.focus());
+      return () => cancelAnimationFrame(id);
+    }
+    return void 0;
+  }, [open]);
+  const filtered = useMemo(
+    () => groupActions(filterActions(actions, query)).flatMap((group) => group.items.map((item) => item.action)),
+    [actions, query]
+  );
+  useEffect(() => {
+    if (highlight >= filtered.length) setHighlight(0);
+  }, [filtered.length, highlight]);
+  const runAction = useCallback(
+    async (action) => {
+      if (action.disabled) return;
+      setOpen(false);
+      try {
+        await action.onSelect();
+      } catch {
+      }
+    },
+    [setOpen]
+  );
+  const onKeyDown = useCallback(
+    (e) => {
+      if (e.nativeEvent.isComposing) return;
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setHighlight((h) => filtered.length === 0 ? 0 : (h + 1) % filtered.length);
+      } else if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setHighlight((h) => filtered.length === 0 ? 0 : (h - 1 + filtered.length) % filtered.length);
+      } else if (e.key === "Enter") {
+        e.preventDefault();
+        const target = filtered[highlight];
+        if (target) void runAction(target);
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        setOpen(false);
+      }
+    },
+    [filtered, highlight, runAction, setOpen]
+  );
+  const grouped = useMemo(() => groupActions(filtered), [filtered]);
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      "aria-label": "Command palette",
+      open,
+      onClose: () => setOpen(false),
+      fullWidth: true,
+      maxWidth: "sm",
+      slotProps: {
+        transition: { onExited: onClosed },
+        paper: {
+          sx: { borderRadius: 2, mt: "10vh", alignSelf: "flex-start" }
+        }
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { sx: { p: 0 }, children: [
+        /* @__PURE__ */ jsx(Box, { sx: { p: 2, pb: 1 }, children: /* @__PURE__ */ jsx(
+          TextField,
+          {
+            inputRef,
+            fullWidth: true,
+            variant: "standard",
+            value: query,
+            onChange: (e) => {
+              setQuery(e.target.value);
+              setHighlight(0);
+            },
+            onKeyDown,
+            placeholder,
+            slotProps: {
+              input: {
+                disableUnderline: true,
+                startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", sx: { ml: 0.5, mr: 1 }, children: /* @__PURE__ */ jsx(Box, { component: "span", sx: { fontSize: 18, opacity: 0.6 }, children: "\u2318" }) })
+              },
+              htmlInput: {
+                role: "combobox",
+                "aria-label": placeholder,
+                "aria-autocomplete": "list",
+                "aria-expanded": open,
+                "aria-controls": listId,
+                "aria-activedescendant": filtered[highlight] ? `${listId}-${filtered[highlight].id}` : void 0
+              }
+            }
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Divider, {}),
+        /* @__PURE__ */ jsx(
+          Box,
+          {
+            id: listId,
+            role: "listbox",
+            "aria-label": "Commands",
+            sx: {
+              maxHeight: 360,
+              overflowY: "auto",
+              py: 0.5
+            },
+            children: filtered.length === 0 ? /* @__PURE__ */ jsx(Box, { sx: { p: 3, textAlign: "center" }, children: /* @__PURE__ */ jsx(
+              Typography,
+              {
+                variant: "body2",
+                sx: {
+                  color: "text.secondary"
+                },
+                children: emptyMessage
+              }
+            ) }) : grouped.map((g) => /* @__PURE__ */ jsxs(Box, { children: [
+              g.label ? /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "caption",
+                  sx: {
+                    color: "text.secondary",
+                    px: 2,
+                    py: 0.75,
+                    display: "block",
+                    textTransform: "uppercase",
+                    letterSpacing: 0.5
+                  },
+                  children: g.label
+                }
+              ) : null,
+              g.items.map((entry) => /* @__PURE__ */ jsx(
+                Row,
+                {
+                  id: `${listId}-${entry.action.id}`,
+                  action: entry.action,
+                  selected: entry.flatIndex === highlight,
+                  onSelect: () => void runAction(entry.action),
+                  onHover: () => setHighlight(entry.flatIndex)
+                },
+                entry.action.id
+              ))
+            ] }, g.label ?? "__none__"))
+          }
+        )
+      ] })
+    }
+  );
+}
+function Row({
+  id,
+  action,
+  selected,
+  onSelect,
+  onHover
+}) {
+  const ref = useRef(null);
+  useEffect(() => {
+    if (selected && ref.current) {
+      ref.current.scrollIntoView({ block: "nearest" });
+    }
+  }, [selected]);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      id,
+      role: "option",
+      "aria-selected": selected,
+      "aria-disabled": action.disabled || void 0,
+      ref,
+      onMouseEnter: onHover,
+      onClick: onSelect,
+      sx: (theme) => ({
+        px: 2,
+        py: 1.25,
+        display: "flex",
+        alignItems: "center",
+        gap: 1.5,
+        cursor: action.disabled ? "not-allowed" : "pointer",
+        opacity: action.disabled ? 0.5 : 1,
+        bgcolor: selected ? alpha(theme.palette.primary.main, 0.12) : "transparent",
+        "&:hover": {
+          bgcolor: selected ? alpha(theme.palette.primary.main, 0.16) : alpha(theme.palette.action.hover, 1)
+        }
+      }),
+      children: [
+        action.icon ? /* @__PURE__ */ jsx(Box, { sx: { display: "flex", alignItems: "center", width: 20, opacity: 0.8 }, children: action.icon }) : null,
+        /* @__PURE__ */ jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: /* @__PURE__ */ jsxs(
+          Stack,
+          {
+            direction: "row",
+            spacing: 1,
+            sx: {
+              alignItems: "baseline"
+            },
+            children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { fontWeight: 500 }, noWrap: true, children: action.title }),
+              action.subtitle ? /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "caption",
+                  noWrap: true,
+                  sx: {
+                    color: "text.secondary"
+                  },
+                  children: action.subtitle
+                }
+              ) : null
+            ]
+          }
+        ) }),
+        action.shortcut?.length ? /* @__PURE__ */ jsx(Stack, { direction: "row", spacing: 0.5, children: action.shortcut.map((k, i) => /* @__PURE__ */ jsx(
+          Chip,
+          {
+            size: "small",
+            label: k,
+            variant: "outlined",
+            sx: { height: 20, fontSize: 10, fontFamily: "monospace" }
+          },
+          i
+        )) }) : null
+      ]
+    }
+  );
+}
+function filterActions(actions, query) {
+  const q = query.trim().toLowerCase();
+  if (!q) return actions;
+  const scored = [];
+  for (const action of actions) {
+    const haystacks = [action.title.toLowerCase()];
+    if (action.subtitle) haystacks.push(action.subtitle.toLowerCase());
+    if (action.keywords?.length) {
+      for (const k of action.keywords) haystacks.push(k.toLowerCase());
+    }
+    let bestScore = -1;
+    for (const h of haystacks) {
+      const idx = h.indexOf(q);
+      if (idx === -1) continue;
+      const score = idx === 0 ? 1e3 - h.length : 100 - idx;
+      if (score > bestScore) bestScore = score;
+    }
+    if (bestScore >= 0) scored.push({ action, score: bestScore });
+  }
+  scored.sort((a, b) => b.score - a.score);
+  return scored.map((s) => s.action);
+}
+function groupActions(actions) {
+  const out = /* @__PURE__ */ new Map();
+  let flatIndex = 0;
+  for (const action of actions) {
+    const label = action.group;
+    const key = label ?? "__none__";
+    let bucket = out.get(key);
+    if (!bucket) {
+      bucket = { label, items: [] };
+      out.set(key, bucket);
+    }
+    bucket.items.push({ action, flatIndex });
+    flatIndex += 1;
+  }
+  return [...out.values()];
+}
+
+export { CommandPalette };
+//# sourceMappingURL=chunk-WD4N72DL.js.map
+//# sourceMappingURL=chunk-WD4N72DL.js.map

package/dist/chunk-WD4N72DL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/command-palette/command-palette.tsx"],"names":[],"mappings":"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","file":"chunk-WD4N72DL.js","sourcesContent":["/**\n * CommandPalette — keyboard-driven action launcher.\n *\n * A modal palette opened by a global shortcut (default Cmd/Ctrl+K)\n * that lets the user search and trigger any `CommandAction` in the\n * registered set. Actions can be grouped (`group`) for visual\n * separation and filtered with case-insensitive matching against\n * `title`, `subtitle`, and any `keywords`. Arrow keys move the\n * highlight, Enter selects, Escape closes.\n *\n * Use cases: app-wide navigation jumps, frequently used admin\n * actions, contextual menus that need a quick-search affordance.\n *\n * @example\n * ```tsx\n * <CommandPalette\n *   actions={[\n *     {\n *       id: 'go-users',\n *       title: 'Go to Users',\n *       group: 'Navigation',\n *       keywords: ['admin', 'list'],\n *       onSelect: () => navigate('/admin/users'),\n *     },\n *   ]}\n * />\n * ```\n */\nimport { type ReactNode, useCallback, useEffect, useMemo, useId, useRef, useState } from 'react';\nimport Dialog from '@mui/material/Dialog';\nimport DialogContent from '@mui/material/DialogContent';\nimport TextField from '@mui/material/TextField';\nimport InputAdornment from '@mui/material/InputAdornment';\nimport Box from '@mui/material/Box';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\nimport Divider from '@mui/material/Divider';\nimport Chip from '@mui/material/Chip';\nimport { alpha } from '@mui/material/styles';\n\nexport interface CommandAction {\n  /** Stable action identifier — used as React key. */\n  id: string;\n  /** Primary text shown in the row. */\n  title: string;\n  /** Optional secondary text shown beside the title. */\n  subtitle?: string;\n  /** Group label — actions sharing a group are visually clustered. */\n  group?: string;\n  /** Extra search terms (synonyms, aliases). */\n  keywords?: readonly string[];\n  /** Optional leading icon. */\n  icon?: ReactNode;\n  /** Optional shortcut hint (e.g. ['⌘', 'P']) shown right-aligned. */\n  shortcut?: readonly string[];\n  /** Disable the action without removing it from the list. */\n  disabled?: boolean;\n  /** Action handler. The palette closes after `onSelect` resolves. */\n  onSelect: () => void | Promise<void>;\n}\n\nexport interface CommandPaletteProps {\n  /** Registered actions. Re-render to update; use a memoized array. */\n  actions: readonly CommandAction[];\n  /**\n   * Controlled open state. If omitted, the palette opens itself when\n   * `triggerKey` is pressed and closes on Escape/select.\n   */\n  open?: boolean;\n  /** Open-state setter for the controlled mode. */\n  onOpenChange?: (open: boolean) => void;\n  /** Runs after the modal releases focus; useful for commands that focus another control. */\n  onClosed?: () => void;\n  /**\n   * Global keyboard shortcut to open. Default `'k'` (paired with the\n   * platform meta key — ⌘ on macOS, Ctrl elsewhere).\n   */\n  triggerKey?: string;\n  /** Disable the global shortcut (useful in nested palettes). */\n  disableShortcut?: boolean;\n  /** Placeholder for the search field. */\n  placeholder?: string;\n  /** Empty-state copy shown when no actions match. */\n  emptyMessage?: string;\n}\n\nexport function CommandPalette({\n  actions,\n  open: controlledOpen,\n  onOpenChange,\n  onClosed,\n  triggerKey = 'k',\n  disableShortcut = false,\n  placeholder = 'Type a command or search…',\n  emptyMessage = 'No matching commands',\n}: CommandPaletteProps) {\n  const [internalOpen, setInternalOpen] = useState(false);\n  const open = controlledOpen ?? internalOpen;\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (controlledOpen === undefined) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [controlledOpen, onOpenChange]\n  );\n\n  const [query, setQuery] = useState('');\n  const [highlight, setHighlight] = useState(0);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const listId = useId();\n\n  // Bubble after the focused control. An editor can reserve its own shortcut.\n  useEffect(() => {\n    if (disableShortcut) return undefined;\n    const onKey = (e: KeyboardEvent) => {\n      if (e.defaultPrevented || e.isComposing || e.repeat) return;\n      const meta = e.metaKey || e.ctrlKey;\n      if (meta && e.key.toLowerCase() === triggerKey.toLowerCase() && !e.altKey && !e.shiftKey) {\n        e.preventDefault();\n        setOpen(!open);\n      }\n    };\n    window.addEventListener('keydown', onKey);\n    return () => window.removeEventListener('keydown', onKey);\n  }, [triggerKey, disableShortcut, open, setOpen]);\n\n  // Reset query + highlight every time the palette opens.\n  useEffect(() => {\n    if (open) {\n      setQuery('');\n      setHighlight(0);\n      // Defer focus to the next frame so the dialog's transition has\n      // mounted the input.\n      const id = requestAnimationFrame(() => inputRef.current?.focus());\n      return () => cancelAnimationFrame(id);\n    }\n    return undefined;\n  }, [open]);\n\n  const filtered = useMemo(\n    () => groupActions(filterActions(actions, query)).flatMap((group) => group.items.map((item) => item.action)),\n    [actions, query]\n  );\n\n  // Re-clamp the highlight when filtering changes.\n  useEffect(() => {\n    if (highlight >= filtered.length) setHighlight(0);\n  }, [filtered.length, highlight]);\n\n  const runAction = useCallback(\n    async (action: CommandAction) => {\n      if (action.disabled) return;\n      setOpen(false);\n      try {\n        await action.onSelect();\n      } catch {\n        // Swallow — the caller's onSelect is responsible for surfacing\n        // its own errors. We just don't want a rejected promise to\n        // crash the palette host.\n      }\n    },\n    [setOpen]\n  );\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.nativeEvent.isComposing) return;\n      if (e.key === 'ArrowDown') {\n        e.preventDefault();\n        setHighlight((h) => (filtered.length === 0 ? 0 : (h + 1) % filtered.length));\n      } else if (e.key === 'ArrowUp') {\n        e.preventDefault();\n        setHighlight((h) => (filtered.length === 0 ? 0 : (h - 1 + filtered.length) % filtered.length));\n      } else if (e.key === 'Enter') {\n        e.preventDefault();\n        const target = filtered[highlight];\n        if (target) void runAction(target);\n      } else if (e.key === 'Escape') {\n        e.preventDefault();\n        setOpen(false);\n      }\n    },\n    [filtered, highlight, runAction, setOpen]\n  );\n\n  // Group rows for rendering. Within each group we record the absolute\n  // index so the highlight cursor can address rows by their position\n  // in the flat filtered list.\n  const grouped = useMemo(() => groupActions(filtered), [filtered]);\n\n  return (\n    <Dialog\n      aria-label=\"Command palette\"\n      open={open}\n      onClose={() => setOpen(false)}\n      fullWidth\n      maxWidth=\"sm\"\n      slotProps={{\n        transition: { onExited: onClosed },\n        paper: {\n          sx: { borderRadius: 2, mt: '10vh', alignSelf: 'flex-start' },\n        },\n      }}\n    >\n      <DialogContent sx={{ p: 0 }}>\n        <Box sx={{ p: 2, pb: 1 }}>\n          <TextField\n            inputRef={inputRef}\n            fullWidth\n            variant=\"standard\"\n            value={query}\n            onChange={(e) => {\n              setQuery(e.target.value);\n              setHighlight(0);\n            }}\n            onKeyDown={onKeyDown}\n            placeholder={placeholder}\n            slotProps={{\n              input: {\n                disableUnderline: true,\n                startAdornment: (\n                  <InputAdornment position=\"start\" sx={{ ml: 0.5, mr: 1 }}>\n                    <Box component=\"span\" sx={{ fontSize: 18, opacity: 0.6 }}>\n                      ⌘\n                    </Box>\n                  </InputAdornment>\n                ),\n              },\n              htmlInput: {\n                role: 'combobox',\n                'aria-label': placeholder,\n                'aria-autocomplete': 'list',\n                'aria-expanded': open,\n                'aria-controls': listId,\n                'aria-activedescendant': filtered[highlight] ? `${listId}-${filtered[highlight]!.id}` : undefined,\n              },\n            }}\n          />\n        </Box>\n        <Divider />\n        <Box\n          id={listId}\n          role=\"listbox\"\n          aria-label=\"Commands\"\n          sx={{\n            maxHeight: 360,\n            overflowY: 'auto',\n            py: 0.5,\n          }}\n        >\n          {filtered.length === 0 ? (\n            <Box sx={{ p: 3, textAlign: 'center' }}>\n              <Typography\n                variant=\"body2\"\n                sx={{\n                  color: 'text.secondary',\n                }}\n              >\n                {emptyMessage}\n              </Typography>\n            </Box>\n          ) : (\n            grouped.map((g) => (\n              <Box key={g.label ?? '__none__'}>\n                {g.label ? (\n                  <Typography\n                    variant=\"caption\"\n                    sx={{\n                      color: 'text.secondary',\n                      px: 2,\n                      py: 0.75,\n                      display: 'block',\n                      textTransform: 'uppercase',\n                      letterSpacing: 0.5,\n                    }}\n                  >\n                    {g.label}\n                  </Typography>\n                ) : null}\n                {g.items.map((entry) => (\n                  <Row\n                    key={entry.action.id}\n                    id={`${listId}-${entry.action.id}`}\n                    action={entry.action}\n                    selected={entry.flatIndex === highlight}\n                    onSelect={() => void runAction(entry.action)}\n                    onHover={() => setHighlight(entry.flatIndex)}\n                  />\n                ))}\n              </Box>\n            ))\n          )}\n        </Box>\n      </DialogContent>\n    </Dialog>\n  );\n}\n\nfunction Row({\n  id,\n  action,\n  selected,\n  onSelect,\n  onHover,\n}: {\n  id: string;\n  action: CommandAction;\n  selected: boolean;\n  onSelect: () => void;\n  onHover: () => void;\n}) {\n  const ref = useRef<HTMLDivElement | null>(null);\n\n  // Keep the highlighted row in view as the user navigates.\n  useEffect(() => {\n    if (selected && ref.current) {\n      ref.current.scrollIntoView({ block: 'nearest' });\n    }\n  }, [selected]);\n\n  return (\n    <Box\n      id={id}\n      role=\"option\"\n      aria-selected={selected}\n      aria-disabled={action.disabled || undefined}\n      ref={ref}\n      onMouseEnter={onHover}\n      onClick={onSelect}\n      sx={(theme) => ({\n        px: 2,\n        py: 1.25,\n        display: 'flex',\n        alignItems: 'center',\n        gap: 1.5,\n        cursor: action.disabled ? 'not-allowed' : 'pointer',\n        opacity: action.disabled ? 0.5 : 1,\n        bgcolor: selected ? alpha(theme.palette.primary.main, 0.12) : 'transparent',\n        '&:hover': {\n          bgcolor: selected ? alpha(theme.palette.primary.main, 0.16) : alpha(theme.palette.action.hover, 1),\n        },\n      })}\n    >\n      {action.icon ? (\n        <Box sx={{ display: 'flex', alignItems: 'center', width: 20, opacity: 0.8 }}>{action.icon}</Box>\n      ) : null}\n      <Box sx={{ flex: 1, minWidth: 0 }}>\n        <Stack\n          direction=\"row\"\n          spacing={1}\n          sx={{\n            alignItems: 'baseline',\n          }}\n        >\n          <Typography variant=\"body2\" sx={{ fontWeight: 500 }} noWrap>\n            {action.title}\n          </Typography>\n          {action.subtitle ? (\n            <Typography\n              variant=\"caption\"\n              noWrap\n              sx={{\n                color: 'text.secondary',\n              }}\n            >\n              {action.subtitle}\n            </Typography>\n          ) : null}\n        </Stack>\n      </Box>\n      {action.shortcut?.length ? (\n        <Stack direction=\"row\" spacing={0.5}>\n          {action.shortcut.map((k, i) => (\n            <Chip\n              key={i}\n              size=\"small\"\n              label={k}\n              variant=\"outlined\"\n              sx={{ height: 20, fontSize: 10, fontFamily: 'monospace' }}\n            />\n          ))}\n        </Stack>\n      ) : null}\n    </Box>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Filtering — case-insensitive substring match across title, subtitle,\n// and any explicit keywords. We intentionally avoid full fuzzy matching\n// at this size; a substring score keeps the most-recently-typed prefix\n// at the top, which matches user mental models for command palettes.\n// ---------------------------------------------------------------------------\n\nfunction filterActions(actions: readonly CommandAction[], query: string): readonly CommandAction[] {\n  const q = query.trim().toLowerCase();\n  if (!q) return actions;\n\n  type Scored = { action: CommandAction; score: number };\n  const scored: Scored[] = [];\n\n  for (const action of actions) {\n    const haystacks: string[] = [action.title.toLowerCase()];\n    if (action.subtitle) haystacks.push(action.subtitle.toLowerCase());\n    if (action.keywords?.length) {\n      for (const k of action.keywords) haystacks.push(k.toLowerCase());\n    }\n\n    let bestScore = -1;\n    for (const h of haystacks) {\n      const idx = h.indexOf(q);\n      if (idx === -1) continue;\n      // Prefix matches outrank mid-string matches.\n      const score = idx === 0 ? 1000 - h.length : 100 - idx;\n      if (score > bestScore) bestScore = score;\n    }\n    if (bestScore >= 0) scored.push({ action, score: bestScore });\n  }\n\n  scored.sort((a, b) => b.score - a.score);\n  return scored.map((s) => s.action);\n}\n\ninterface GroupedRow {\n  label: string | undefined;\n  items: { action: CommandAction; flatIndex: number }[];\n}\n\nfunction groupActions(actions: readonly CommandAction[]): GroupedRow[] {\n  const out = new Map<string, GroupedRow>();\n  let flatIndex = 0;\n  for (const action of actions) {\n    const label = action.group;\n    const key = label ?? '__none__';\n    let bucket = out.get(key);\n    if (!bucket) {\n      bucket = { label, items: [] };\n      out.set(key, bucket);\n    }\n    bucket.items.push({ action, flatIndex });\n    flatIndex += 1;\n  }\n  return [...out.values()];\n}\n"]}

package/dist/chunk-XBYMG4QK.js

@@ -0,0 +1,119 @@
+import { semanticSurfaceStyles } from './chunk-TZWHELY4.js';
+import { useRef, useEffect } from 'react';
+import MuiAlert from '@mui/material/Alert';
+import AlertTitle from '@mui/material/AlertTitle';
+import { useForkRef } from '@mui/material/utils';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function mergeSx(own, sx) {
+  return [own, ...Array.isArray(sx) ? sx : sx ? [sx] : []];
+}
+function Alert({
+  severity = "info",
+  variant = "standard",
+  title,
+  children,
+  onClose,
+  closable = false,
+  icon,
+  action,
+  sx,
+  ref,
+  ...other
+}) {
+  const muiVariant = variant === "soft" ? "standard" : variant;
+  return /* @__PURE__ */ jsxs(
+    MuiAlert,
+    {
+      ref,
+      ...other,
+      severity,
+      variant: muiVariant,
+      onClose: closable ? onClose : void 0,
+      icon,
+      action,
+      sx: mergeSx(
+        variant === "soft" ? (theme) => ({
+          ...semanticSurfaceStyles(theme, other.color ?? severity, 0.12, 0.16),
+          "& .MuiAlert-icon": {
+            color: "inherit"
+          }
+        }) : {},
+        sx
+      ),
+      children: [
+        title && /* @__PURE__ */ jsx(AlertTitle, { children: title }),
+        children
+      ]
+    }
+  );
+}
+function InlineAlert({ severity = "info", message, icon, sx, ref, ...other }) {
+  return /* @__PURE__ */ jsx(
+    MuiAlert,
+    {
+      ref,
+      ...other,
+      severity,
+      icon,
+      sx: mergeSx(
+        {
+          py: 0,
+          px: 1,
+          "& .MuiAlert-message": {
+            py: 0.5
+          }
+        },
+        sx
+      ),
+      children: message
+    }
+  );
+}
+function FormAlert({
+  severity = "error",
+  title,
+  children,
+  onClose,
+  autoScroll = true,
+  sx,
+  ref: outerRef,
+  ...other
+}) {
+  const ref = useRef(null);
+  const handleRef = useForkRef(ref, outerRef);
+  useEffect(() => {
+    if (!autoScroll) return void 0;
+    const id = requestAnimationFrame(() => {
+      ref.current?.scrollIntoView({ block: "nearest", behavior: "smooth" });
+    });
+    return () => cancelAnimationFrame(id);
+  }, [autoScroll]);
+  return /* @__PURE__ */ jsxs(
+    MuiAlert,
+    {
+      ref: handleRef,
+      ...other,
+      severity,
+      onClose,
+      role: "alert",
+      "aria-live": "assertive",
+      "aria-atomic": "true",
+      sx: mergeSx(
+        {
+          alignItems: "flex-start",
+          mb: 2
+        },
+        sx
+      ),
+      children: [
+        title && /* @__PURE__ */ jsx(AlertTitle, { sx: { mb: 0.5 }, children: title }),
+        children
+      ]
+    }
+  );
+}
+
+export { Alert, FormAlert, InlineAlert };
+//# sourceMappingURL=chunk-XBYMG4QK.js.map
+//# sourceMappingURL=chunk-XBYMG4QK.js.map

package/dist/chunk-XBYMG4QK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/alert/alert.tsx"],"names":[],"mappings":"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","file":"chunk-XBYMG4QK.js","sourcesContent":["'use client';\n\n/**\n * Alert Component\n *\n * Enhanced alert with custom styling and variants.\n *\n * @module components/alert\n */\n\nimport { useEffect, useRef, type ReactNode, type Ref } from 'react';\nimport MuiAlert, { type AlertProps as MuiAlertProps } from '@mui/material/Alert';\nimport AlertTitle from '@mui/material/AlertTitle';\nimport type { SxProps, Theme } from '@mui/material/styles';\nimport { useForkRef } from '@mui/material/utils';\nimport { semanticSurfaceStyles } from '../../theme/semantic-surface.js';\n\n/**\n * Every alert here takes `ref` and passes whatever else it is given to the\n * MUI root — the library's convention (see `Card`, `Avatar`, `Label`).\n *\n * These three did not, and it was measured on 2026-09-22: `Grow`, `Fade`,\n * `Zoom` and `Slide` hold their child by ref and animate it through\n * `style`, so a `<Snackbar>` (whose transition is `Grow`) around one of these\n * found no node and threw from inside MUI's `reflow` — «Cannot read\n * properties of null (reading 'scrollTop')» — taking the whole page down. The\n * console's Topology page died that way on every failed fetch. A `Tooltip`\n * around one fails quietly instead: it injects its handlers into props that\n * were thrown away.\n */\ntype MuiAlertRest<Own> = Omit<MuiAlertProps, keyof Own | 'ref'>;\n\n/** `sx` in every form MUI accepts — object, function or array — after ours. */\nfunction mergeSx(own: SxProps<Theme>, sx: SxProps<Theme> | undefined): SxProps<Theme> {\n  return [own, ...(Array.isArray(sx) ? sx : sx ? [sx] : [])] as SxProps<Theme>;\n}\n\n/**\n * Alert severity levels.\n */\nexport type AlertSeverity = 'success' | 'info' | 'warning' | 'error';\n\n/**\n * Alert variants.\n */\nexport type AlertVariant = 'standard' | 'filled' | 'outlined' | 'soft';\n\n/**\n * Props for Alert component.\n */\ninterface AlertOwnProps {\n  /** Alert severity */\n  severity?: AlertSeverity;\n  /** Alert variant */\n  variant?: AlertVariant;\n  /** Alert title */\n  title?: ReactNode;\n  /** Alert content */\n  children?: ReactNode;\n  /** On close handler */\n  onClose?: () => void;\n  /** Show close button */\n  closable?: boolean;\n  /** Custom icon */\n  icon?: ReactNode | false;\n  /** Custom action */\n  action?: ReactNode;\n  /** Custom sx props */\n  sx?: SxProps<Theme>;\n}\n\nexport type AlertProps = AlertOwnProps & MuiAlertRest<AlertOwnProps> & { ref?: Ref<HTMLDivElement> };\n\n/**\n * Alert - Enhanced alert with custom styling.\n *\n * @example\n * ```tsx\n * <Alert severity=\"success\" title=\"Success!\">\n *   Your changes have been saved.\n * </Alert>\n *\n * <Alert severity=\"error\" variant=\"filled\" closable onClose={() => {}}>\n *   An error occurred.\n * </Alert>\n * ```\n */\nexport function Alert({\n  severity = 'info',\n  variant = 'standard',\n  title,\n  children,\n  onClose,\n  closable = false,\n  icon,\n  action,\n  sx,\n  ref,\n  ...other\n}: AlertProps): ReactNode {\n  // Map 'soft' variant to 'standard' with custom styling\n  const muiVariant = variant === 'soft' ? 'standard' : variant;\n\n  return (\n    <MuiAlert\n      ref={ref}\n      {...other}\n      severity={severity}\n      variant={muiVariant}\n      onClose={closable ? onClose : undefined}\n      icon={icon}\n      action={action}\n      sx={mergeSx(\n        variant === 'soft'\n          ? (theme) => ({\n              ...semanticSurfaceStyles(theme, other.color ?? severity, 0.12, 0.16),\n              '& .MuiAlert-icon': {\n                color: 'inherit',\n              },\n            })\n          : {},\n        sx,\n      )}\n    >\n      {title && <AlertTitle>{title}</AlertTitle>}\n      {children}\n    </MuiAlert>\n  );\n}\n\n/**\n * Props for InlineAlert component.\n */\ninterface InlineAlertOwnProps {\n  /** Alert severity */\n  severity?: AlertSeverity;\n  /** Alert message */\n  message: ReactNode;\n  /** Icon to display */\n  icon?: ReactNode;\n}\n\nexport type InlineAlertProps = InlineAlertOwnProps &\n  MuiAlertRest<InlineAlertOwnProps> & { ref?: Ref<HTMLDivElement> };\n\n/**\n * InlineAlert - Compact inline alert for form feedback.\n *\n * @example\n * ```tsx\n * <InlineAlert severity=\"error\" message=\"This field is required\" />\n * ```\n */\nexport function InlineAlert({ severity = 'info', message, icon, sx, ref, ...other }: InlineAlertProps): ReactNode {\n  return (\n    <MuiAlert\n      ref={ref}\n      {...other}\n      severity={severity}\n      icon={icon}\n      sx={mergeSx(\n        {\n          py: 0,\n          px: 1,\n          '& .MuiAlert-message': {\n            py: 0.5,\n          },\n        },\n        sx,\n      )}\n    >\n      {message}\n    </MuiAlert>\n  );\n}\n\n/**\n * Props for FormAlert component.\n */\ninterface FormAlertOwnProps {\n  /** Severity — defaults to 'error' since this primitive is most\n   * commonly used to surface form submission failures. */\n  severity?: AlertSeverity;\n  /** Optional heading rendered above the message. Use for a short\n   * categorisation (\"Couldn't save\") when the message body is a\n   * detailed reason. */\n  title?: ReactNode;\n  /** The alert body. Pass `null` to keep the slot rendered but\n   * empty — useful for conditional rendering without unmounting. */\n  children?: ReactNode;\n  /** Renders a close (x) icon button when provided. Should clear the\n   * underlying error state in the parent. */\n  onClose?: () => void;\n  /** When true, scroll the alert into view on mount so the user\n   * sees it even if the dialog content has been scrolled away from\n   * the top. Default: true. */\n  autoScroll?: boolean;\n  /** Custom sx overrides for niche layouts. */\n  sx?: SxProps<Theme>;\n}\n\nexport type FormAlertProps = FormAlertOwnProps & MuiAlertRest<FormAlertOwnProps> & { ref?: Ref<HTMLDivElement> };\n\n/**\n * FormAlert — the platform's canonical surface for **form-level**\n * errors inside dialogs and inline forms.\n *\n * UX policy (see CLAUDE.md \"Error UX\"):\n *\n *   Form submission failure → `<FormAlert>` at the top of the form\n *   Background / cross-cutting event → `toast`\n *\n * Why a dedicated primitive vs. plain `<Alert>`:\n *\n *   - `role=\"alert\"` + `aria-live=\"assertive\"` so screen readers\n *     immediately announce the message, not just visually-sighted\n *     users.\n *   - Auto-scrolls into view on mount — a form often has fields\n *     below the fold; surfacing an error you can't see is a dark\n *     pattern. (Disable with `autoScroll={false}` if your dialog\n *     manages focus differently.)\n *   - Sensible defaults: `severity='error'`, top margin baked in so\n *     it sits naturally above the first field, `flex-start`\n *     alignment so multi-line messages don't push the close button\n *     out of place.\n *\n * @example\n * ```tsx\n * const [error, setError] = useState<string | null>(null);\n *\n * <DialogContent>\n *   {error && <FormAlert onClose={() => setError(null)}>{error}</FormAlert>}\n *   <TextField ... />\n * </DialogContent>\n * ```\n */\nexport function FormAlert({\n  severity = 'error',\n  title,\n  children,\n  onClose,\n  autoScroll = true,\n  sx,\n  ref: outerRef,\n  ...other\n}: FormAlertProps): ReactNode {\n  const ref = useRef<HTMLDivElement>(null);\n  // Its own ref (to scroll into view) and the caller's (a transition, a\n  // tooltip) are the same node — both have to reach it.\n  const handleRef = useForkRef(ref, outerRef);\n\n  useEffect(() => {\n    if (!autoScroll) return undefined;\n    // Schedule after paint so we measure the alert in its final\n    // position. `nearest` keeps the dialog stable instead of\n    // jumping to the very top, which would feel jarring if the\n    // alert is already visible.\n    const id = requestAnimationFrame(() => {\n      ref.current?.scrollIntoView({ block: 'nearest', behavior: 'smooth' });\n    });\n    return () => cancelAnimationFrame(id);\n  }, [autoScroll]);\n\n  return (\n    <MuiAlert\n      ref={handleRef}\n      {...other}\n      severity={severity}\n      onClose={onClose}\n      // role/aria-live are normally set by MUI based on severity, but\n      // form-level surfacing of submission errors warrants assertive\n      // announcement regardless of severity. aria-atomic ensures the\n      // whole alert is read together (title + body), not piecewise.\n      role=\"alert\"\n      aria-live=\"assertive\"\n      aria-atomic=\"true\"\n      sx={mergeSx(\n        {\n          alignItems: 'flex-start',\n          mb: 2,\n        },\n        sx,\n      )}\n    >\n      {title && <AlertTitle sx={{ mb: 0.5 }}>{title}</AlertTitle>}\n      {children}\n    </MuiAlert>\n  );\n}\n"]}

package/dist/chunk-YHM6GIHV.js

@@ -0,0 +1,3 @@
+
+//# sourceMappingURL=chunk-YHM6GIHV.js.map
+//# sourceMappingURL=chunk-YHM6GIHV.js.map

package/dist/chunk-YHM6GIHV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"chunk-YHM6GIHV.js"}

package/dist/{chunk-SNZK5X6F.js → chunk-Z2AN43YU.js}

@@ -12,6 +12,8 @@ import Typography from '@mui/material/Typography';
 import { alpha } from '@mui/material/styles';
 import { useVirtualizer } from '@tanstack/react-virtual';
 
+// src/components/emoji-picker/emoji.tsx
+
 // src/components/emoji-picker/twemoji-url.ts
 var VARIATION_SELECTOR = 65039;
 var TWEMOJI_BASE = "https://cdn.jsdelivr.net/gh/twitter/twemoji@latest/assets/svg";
@@ -590,5 +592,5 @@ function mergeI18n(override) {
 }
 
 export { Emoji, EmojiPicker };
-//# sourceMappingURL=chunk-SNZK5X6F.js.map
-//# sourceMappingURL=chunk-SNZK5X6F.js.map
+//# sourceMappingURL=chunk-Z2AN43YU.js.map
+//# sourceMappingURL=chunk-Z2AN43YU.js.map