@tooee/themes 0.1.19 → 0.1.21

package/dist/CloseButton.d.ts

@@ -0,0 +1,17 @@
+interface CloseButtonProps {
+    /** Called when the button is clicked (left mouse button). */
+    onClose: () => void;
+    /** Glyph to render (default "✕"). */
+    glyph?: string;
+    /** Foreground colour (defaults to theme.textMuted). */
+    color?: string;
+}
+/**
+ * Reusable clickable close control for overlays.
+ *
+ * Renders a small themed glyph that calls `onClose` on left-click. Purely
+ * additive — overlays keep their existing Escape / cancel keyboard paths.
+ */
+export declare function CloseButton({ onClose, glyph, color }: CloseButtonProps): import("react").ReactNode;
+export {};
+//# sourceMappingURL=CloseButton.d.ts.map

package/dist/CloseButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CloseButton.d.ts","sourceRoot":"","sources":["../src/CloseButton.tsx"],"names":[],"mappings":"AAIA,UAAU,gBAAgB;IACxB,6DAA6D;IAC7D,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAW,EAAE,KAAK,EAAE,EAAE,gBAAgB,6BAmB5E"}

package/dist/CloseButton.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "@opentui/react/jsx-runtime";
+import { useCallback } from "react";
+import { useTheme } from "./context.js";
+/**
+ * Reusable clickable close control for overlays.
+ *
+ * Renders a small themed glyph that calls `onClose` on left-click. Purely
+ * additive — overlays keep their existing Escape / cancel keyboard paths.
+ */
+export function CloseButton({ onClose, glyph = "✕", color }) {
+    const { theme } = useTheme();
+    const handleMouseDown = useCallback((event) => {
+        // Left button only; let other buttons bubble.
+        if (event.button !== 0)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        onClose();
+    }, [onClose]);
+    return (_jsx("box", { flexShrink: 0, paddingLeft: 1, onMouseDown: handleMouseDown, children: _jsx("text", { content: glyph, fg: color ?? theme.textMuted }) }));
+}
+//# sourceMappingURL=CloseButton.js.map

package/dist/CloseButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CloseButton.js","sourceRoot":"","sources":["../src/CloseButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAWvC;;;;;GAKG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,GAAG,GAAG,EAAE,KAAK,EAAoB;IAC3E,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE5B,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,KAAiB,EAAE,EAAE;QACpB,8CAA8C;QAC9C,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,OAAM;QAC9B,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,OAAO,EAAE,CAAA;IACX,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAA;IAED,OAAO,CACL,cAAK,UAAU,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,WAAW,EAAE,eAAe,YAC9D,eAAM,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,IAAI,KAAK,CAAC,SAAS,GAAI,GAClD,CACP,CAAA;AACH,CAAC"}

package/dist/ThemePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemePicker.d.ts","sourceRoot":"","sources":["../src/ThemePicker.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,gBAAgB;IACxB,OAAO,EAAE,gBAAgB,EAAE,CAAA;IAC3B,YAAY,EAAE,MAAM,CAAA;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,gBAAgB,6BAqHlB"}
+{"version":3,"file":"ThemePicker.d.ts","sourceRoot":"","sources":["../src/ThemePicker.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,gBAAgB;IACxB,OAAO,EAAE,gBAAgB,EAAE,CAAA;IAC3B,YAAY,EAAE,MAAM,CAAA;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,gBAAgB,6BAuJlB"}

package/dist/ThemePicker.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
 import { useState, useMemo, useCallback } from "react";
-import { useKeyboard } from "@opentui/react";
+import { useCommand } from "@tooee/commands";
 import { fuzzyMatch } from "@tooee/fuzzy";
 import { useTheme } from "./context.js";
+import { CloseButton } from "./CloseButton.js";
 export function ThemePicker({ entries, currentTheme, onSelect, onClose, onNavigate, }) {
     const { theme } = useTheme();
     const [filter, setFilter] = useState("");
@@ -35,25 +36,45 @@ export function ThemePicker({ entries, currentTheme, onSelect, onClose, onNaviga
             onNavigate(item.id);
         }
     }, [filtered, onNavigate]);
-    useKeyboard((key) => {
-        if (key.name === "escape") {
-            key.preventDefault();
-            onClose();
-        }
-        else if (key.name === "return") {
-            key.preventDefault();
-            handleSelect();
-        }
-        else if (key.name === "up") {
-            key.preventDefault();
-            navigateTo(Math.max(0, activeIndex - 1));
-        }
-        else if (key.name === "down") {
-            key.preventDefault();
-            navigateTo(Math.min(filtered.length - 1, activeIndex + 1));
-        }
+    const moveUp = useCallback(() => {
+        navigateTo(Math.max(0, activeIndex - 1));
+    }, [activeIndex, navigateTo]);
+    const moveDown = useCallback(() => {
+        navigateTo(Math.min(filtered.length - 1, activeIndex + 1));
+    }, [activeIndex, filtered.length, navigateTo]);
+    useCommand({
+        id: "theme-picker:close",
+        title: "Close theme picker",
+        hotkey: "Escape",
+        modes: ["insert", "cursor"],
+        hidden: true,
+        handler: onClose,
+    });
+    useCommand({
+        id: "theme-picker:select",
+        title: "Select theme",
+        hotkey: "Enter",
+        modes: ["insert", "cursor"],
+        hidden: true,
+        handler: handleSelect,
+    });
+    useCommand({
+        id: "theme-picker:move-up",
+        title: "Move up",
+        hotkey: "up",
+        modes: ["insert", "cursor"],
+        hidden: true,
+        handler: moveUp,
+    });
+    useCommand({
+        id: "theme-picker:move-down",
+        title: "Move down",
+        hotkey: "down",
+        modes: ["insert", "cursor"],
+        hidden: true,
+        handler: moveDown,
     });
-    return (_jsxs("box", { position: "absolute", left: "20%", right: "20%", top: 2, maxHeight: "60%", flexDirection: "column", backgroundColor: theme.backgroundPanel, border: true, borderColor: theme.border, children: [_jsxs("box", { flexDirection: "row", paddingLeft: 1, paddingRight: 1, height: 1, children: [_jsx("text", { content: "\uD83C\uDFA8 ", fg: theme.accent }), _jsx("input", { focused: true, placeholder: "Filter themes...", onInput: (value) => {
+    return (_jsxs("box", { position: "absolute", left: "20%", right: "20%", top: 2, maxHeight: "60%", flexDirection: "column", backgroundColor: theme.backgroundPanel, border: true, borderColor: theme.border, children: [_jsxs("box", { flexDirection: "row", paddingLeft: 1, paddingRight: 1, height: 1, children: [_jsx("text", { content: "\uD83C\uDFA8 ", fg: theme.accent }), _jsx("input", { focused: true, placeholder: "Filter themes...", onSubmit: handleSelect, onInput: (value) => {
                             setFilter(value);
                             setActiveIndex(0);
                             // Preview first match
@@ -72,6 +93,13 @@ export function ThemePicker({ entries, currentTheme, onSelect, onClose, onNaviga
                                 if (results.length > 0)
                                     onNavigate(results[0].entry.id);
                             }
-                        }, backgroundColor: "transparent", focusedBackgroundColor: "transparent", textColor: theme.text, placeholderColor: theme.textMuted, cursorColor: theme.accent, style: { flexGrow: 1 } }), _jsx("text", { content: ` ${filtered.length}`, fg: theme.textMuted })] }), _jsx("box", { height: 1, width: "100%", backgroundColor: theme.border }), _jsx("scrollbox", { focused: false, style: { flexGrow: 1 }, children: filtered.map((entry, i) => (_jsx("box", { flexDirection: "row", paddingLeft: 1, paddingRight: 1, height: 1, backgroundColor: i === activeIndex ? theme.backgroundElement : undefined, children: _jsx("text", { content: entry.title, fg: theme.text, style: { flexGrow: 1 } }) }, entry.id))) })] }));
+                        }, backgroundColor: "transparent", focusedBackgroundColor: "transparent", textColor: theme.text, placeholderColor: theme.textMuted, cursorColor: theme.accent, style: { flexGrow: 1 } }), _jsx("text", { content: ` ${filtered.length}`, fg: theme.textMuted }), _jsx(CloseButton, { onClose: onClose })] }), _jsx("box", { height: 1, width: "100%", backgroundColor: theme.border }), _jsx("scrollbox", { focused: false, style: { flexGrow: 1 }, children: filtered.map((entry, i) => (_jsx("box", { flexDirection: "row", paddingLeft: 1, paddingRight: 1, height: 1, backgroundColor: i === activeIndex ? theme.backgroundElement : undefined, onMouseDown: (event) => {
+                        // Left-click applies the theme — same code path as Enter.
+                        if (event.button !== 0)
+                            return;
+                        event.preventDefault();
+                        event.stopPropagation();
+                        onSelect(entry.id);
+                    }, children: _jsx("text", { content: entry.title, fg: theme.text, style: { flexGrow: 1 } }) }, entry.id))) })] }));
 }
 //# sourceMappingURL=ThemePicker.js.map

package/dist/ThemePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemePicker.js","sourceRoot":"","sources":["../src/ThemePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ThemePicker.js","sourceRoot":"","sources":["../src/ThemePicker.tsx"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -7,4 +7,5 @@ export { ThemeProvider, ThemeSwitcherProvider, useTheme, useThemeSwitcher } from
 export type { ThemeProviderProps, ThemeSwitcherProviderProps } from "./context.js";
 export { ThemePicker } from "./ThemePicker.js";
 export type { ThemePickerEntry } from "./ThemePicker.js";
+export { CloseButton } from "./CloseButton.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AACzC,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAEpD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AACrE,YAAY,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAExC,OAAO,EAAE,aAAa,EAAE,qBAAqB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAC/F,YAAY,EAAE,kBAAkB,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAA;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,YAAY,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AACzC,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAEpD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AACrE,YAAY,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAExC,OAAO,EAAE,aAAa,EAAE,qBAAqB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAC/F,YAAY,EAAE,kBAAkB,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAA;AAElF,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,YAAY,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAExD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA"}

package/dist/index.js

@@ -3,4 +3,5 @@ export { buildSyntaxStyle } from "./syntax-rules.js";
 export { loadThemes, getThemeNames, defaultTheme } from "./loader.js";
 export { ThemeProvider, ThemeSwitcherProvider, useTheme, useThemeSwitcher } from "./context.js";
 export { ThemePicker } from "./ThemePicker.js";
+export { CloseButton } from "./CloseButton.js";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAGzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAEpD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAGrE,OAAO,EAAE,aAAa,EAAE,qBAAqB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAG/F,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAGzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAEpD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAGrE,OAAO,EAAE,aAAa,EAAE,qBAAqB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAG/F,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAG9C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tooee/themes",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "description": "Theme management with 34 bundled themes for Tooee",
   "keywords": [
     "cli",
@@ -37,8 +37,9 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@tooee/config": "0.1.19",
-    "@tooee/fuzzy": "0.1.19"
+    "@tooee/commands": "0.1.21",
+    "@tooee/config": "0.1.21",
+    "@tooee/fuzzy": "0.1.21"
   },
   "devDependencies": {
     "@opentui/core": "^0.2.15",

package/src/CloseButton.tsx

@@ -0,0 +1,39 @@
+import { useCallback } from "react"
+import type { MouseEvent } from "@opentui/core"
+import { useTheme } from "./context.js"
+
+interface CloseButtonProps {
+  /** Called when the button is clicked (left mouse button). */
+  onClose: () => void
+  /** Glyph to render (default "✕"). */
+  glyph?: string
+  /** Foreground colour (defaults to theme.textMuted). */
+  color?: string
+}
+
+/**
+ * Reusable clickable close control for overlays.
+ *
+ * Renders a small themed glyph that calls `onClose` on left-click. Purely
+ * additive — overlays keep their existing Escape / cancel keyboard paths.
+ */
+export function CloseButton({ onClose, glyph = "✕", color }: CloseButtonProps) {
+  const { theme } = useTheme()
+
+  const handleMouseDown = useCallback(
+    (event: MouseEvent) => {
+      // Left button only; let other buttons bubble.
+      if (event.button !== 0) return
+      event.preventDefault()
+      event.stopPropagation()
+      onClose()
+    },
+    [onClose],
+  )
+
+  return (
+    <box flexShrink={0} paddingLeft={1} onMouseDown={handleMouseDown}>
+      <text content={glyph} fg={color ?? theme.textMuted} />
+    </box>
+  )
+}

package/src/ThemePicker.tsx

@@ -1,7 +1,8 @@
 import { useState, useMemo, useCallback } from "react"
-import { useKeyboard } from "@opentui/react"
+import { useCommand } from "@tooee/commands"
 import { fuzzyMatch } from "@tooee/fuzzy"
 import { useTheme } from "./context.js"
+import { CloseButton } from "./CloseButton.js"
 
 export interface ThemePickerEntry {
   id: string
@@ -59,20 +60,45 @@ export function ThemePicker({
     [filtered, onNavigate],
   )
 
-  useKeyboard((key) => {
-    if (key.name === "escape") {
-      key.preventDefault()
-      onClose()
-    } else if (key.name === "return") {
-      key.preventDefault()
-      handleSelect()
-    } else if (key.name === "up") {
-      key.preventDefault()
-      navigateTo(Math.max(0, activeIndex - 1))
-    } else if (key.name === "down") {
-      key.preventDefault()
-      navigateTo(Math.min(filtered.length - 1, activeIndex + 1))
-    }
+  const moveUp = useCallback(() => {
+    navigateTo(Math.max(0, activeIndex - 1))
+  }, [activeIndex, navigateTo])
+
+  const moveDown = useCallback(() => {
+    navigateTo(Math.min(filtered.length - 1, activeIndex + 1))
+  }, [activeIndex, filtered.length, navigateTo])
+
+  useCommand({
+    id: "theme-picker:close",
+    title: "Close theme picker",
+    hotkey: "Escape",
+    modes: ["insert", "cursor"],
+    hidden: true,
+    handler: onClose,
+  })
+  useCommand({
+    id: "theme-picker:select",
+    title: "Select theme",
+    hotkey: "Enter",
+    modes: ["insert", "cursor"],
+    hidden: true,
+    handler: handleSelect,
+  })
+  useCommand({
+    id: "theme-picker:move-up",
+    title: "Move up",
+    hotkey: "up",
+    modes: ["insert", "cursor"],
+    hidden: true,
+    handler: moveUp,
+  })
+  useCommand({
+    id: "theme-picker:move-down",
+    title: "Move down",
+    hotkey: "down",
+    modes: ["insert", "cursor"],
+    hidden: true,
+    handler: moveDown,
   })
 
   return (
@@ -93,6 +119,7 @@ export function ThemePicker({
         <input
           focused
           placeholder="Filter themes..."
+          onSubmit={handleSelect}
           onInput={(value: string) => {
             setFilter(value)
             setActiveIndex(0)
@@ -117,6 +144,7 @@ export function ThemePicker({
           style={{ flexGrow: 1 }}
         />
         <text content={` ${filtered.length}`} fg={theme.textMuted} />
+        <CloseButton onClose={onClose} />
       </box>
 
       {/* Separator */}
@@ -132,6 +160,13 @@ export function ThemePicker({
             paddingRight={1}
             height={1}
             backgroundColor={i === activeIndex ? theme.backgroundElement : undefined}
+            onMouseDown={(event) => {
+              // Left-click applies the theme — same code path as Enter.
+              if (event.button !== 0) return
+              event.preventDefault()
+              event.stopPropagation()
+              onSelect(entry.id)
+            }}
           >
             <text content={entry.title} fg={theme.text} style={{ flexGrow: 1 }} />
           </box>

package/src/index.ts

@@ -11,3 +11,5 @@ export type { ThemeProviderProps, ThemeSwitcherProviderProps } from "./context.j
 
 export { ThemePicker } from "./ThemePicker.js"
 export type { ThemePickerEntry } from "./ThemePicker.js"
+
+export { CloseButton } from "./CloseButton.js"