giggles 0.2.4 → 0.3.1

package/dist/types-ClgDW3fy.d.ts

@@ -0,0 +1,26 @@
+import { Key } from 'ink';
+
+type KeyHandler = (input: string, key: Key) => void;
+type SpecialKey = 'up' | 'down' | 'left' | 'right' | 'enter' | 'escape' | 'tab' | 'backspace' | 'pageup' | 'pagedown' | 'home' | 'end';
+type KeyName = SpecialKey | (string & {});
+type KeybindingDefinition = KeyHandler | {
+    action: KeyHandler;
+    name: string;
+    when?: 'focused' | 'mounted';
+};
+type Keybindings = Partial<Record<KeyName, KeybindingDefinition>>;
+type KeybindingOptions = {
+    capture?: boolean;
+    onKeypress?: (input: string, key: Key) => void;
+    layer?: string;
+};
+type RegisteredKeybinding = {
+    nodeId: string;
+    key: string;
+    handler: KeyHandler;
+    name?: string;
+    when?: 'focused' | 'mounted';
+    layer?: string;
+};
+
+export type { Keybindings as K, RegisteredKeybinding as R, KeybindingOptions as a, KeyHandler as b };

package/dist/ui/index.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { R as RegisteredKeybinding } from '../types-ClgDW3fy.js';
+import 'ink';
+
+type CommandPaletteRenderProps = {
+    query: string;
+    filtered: RegisteredKeybinding[];
+    selectedIndex: number;
+    onSelect: (cmd: RegisteredKeybinding) => void;
+};
+type CommandPaletteProps = {
+    onClose: () => void;
+    render?: (props: CommandPaletteRenderProps) => React__default.ReactNode;
+};
+declare function CommandPalette({ onClose, render }: CommandPaletteProps): react_jsx_runtime.JSX.Element;
+
+export { CommandPalette, type CommandPaletteRenderProps };

package/dist/ui/index.js

@@ -0,0 +1,100 @@
+import {
+  FocusTrap,
+  useFocus,
+  useKeybindingRegistry,
+  useKeybindings
+} from "../chunk-4LED4GXQ.js";
+
+// src/ui/CommandPalette.tsx
+import { useState } from "react";
+import { Box, Text } from "ink";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var EMPTY_KEY = {
+  upArrow: false,
+  downArrow: false,
+  leftArrow: false,
+  rightArrow: false,
+  pageDown: false,
+  pageUp: false,
+  home: false,
+  end: false,
+  return: false,
+  escape: false,
+  ctrl: false,
+  shift: false,
+  tab: false,
+  backspace: false,
+  delete: false,
+  meta: false,
+  super: false,
+  hyper: false,
+  capsLock: false,
+  numLock: false
+};
+function fuzzyMatch(name, query) {
+  if (!query) return true;
+  const lowerName = name.toLowerCase();
+  const lowerQuery = query.toLowerCase();
+  let qi = 0;
+  for (let i = 0; i < lowerName.length && qi < lowerQuery.length; i++) {
+    if (lowerName[i] === lowerQuery[qi]) qi++;
+  }
+  return qi === lowerQuery.length;
+}
+function Inner({ onClose, render }) {
+  const focus = useFocus();
+  const [query, setQuery] = useState("");
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  const registry = useKeybindingRegistry();
+  const filtered = registry.all.filter((cmd) => fuzzyMatch(cmd.name, query));
+  const clampedIndex = Math.min(selectedIndex, Math.max(0, filtered.length - 1));
+  const onSelect = (cmd) => {
+    cmd.handler("", EMPTY_KEY);
+    onClose();
+  };
+  useKeybindings(
+    focus,
+    {
+      escape: onClose,
+      enter: () => {
+        const cmd = filtered[clampedIndex];
+        if (cmd) onSelect(cmd);
+      },
+      up: () => setSelectedIndex((i) => Math.max(0, i - 1)),
+      down: () => setSelectedIndex((i) => Math.max(0, Math.min(filtered.length - 1, i + 1))),
+      backspace: () => {
+        setQuery((q) => q.slice(0, -1));
+        setSelectedIndex(0);
+      }
+    },
+    {
+      capture: true,
+      onKeypress: (input, key) => {
+        if (input.length === 1 && !key.ctrl) {
+          setQuery((q) => q + input);
+          setSelectedIndex(0);
+        }
+      }
+    }
+  );
+  if (render) {
+    return /* @__PURE__ */ jsx(Fragment, { children: render({ query, filtered, selectedIndex: clampedIndex, onSelect }) });
+  }
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", borderStyle: "round", width: 40, children: [
+    /* @__PURE__ */ jsxs(Box, { paddingX: 1, children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "> " }),
+      /* @__PURE__ */ jsx(Text, { children: query }),
+      /* @__PURE__ */ jsx(Text, { inverse: true, children: " " })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { flexDirection: "column", children: filtered.length === 0 ? /* @__PURE__ */ jsx(Box, { paddingX: 1, children: /* @__PURE__ */ jsx(Text, { dimColor: true, children: "No commands found" }) }) : filtered.map((cmd, i) => /* @__PURE__ */ jsxs(Box, { justifyContent: "space-between", paddingX: 1, children: [
+      /* @__PURE__ */ jsx(Text, { inverse: i === clampedIndex, children: cmd.name }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: cmd.key })
+    ] }, `${cmd.nodeId}-${cmd.key}`)) })
+  ] });
+}
+function CommandPalette({ onClose, render }) {
+  return /* @__PURE__ */ jsx(FocusTrap, { children: /* @__PURE__ */ jsx(Inner, { onClose, render }) });
+}
+export {
+  CommandPalette
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "giggles",
-  "version": "0.2.4",
+  "version": "0.3.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -13,6 +13,14 @@
     ".": {
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
+    },
+    "./terminal": {
+      "import": "./dist/terminal/index.js",
+      "types": "./dist/terminal/index.d.ts"
+    },
+    "./ui": {
+      "import": "./dist/ui/index.js",
+      "types": "./dist/ui/index.d.ts"
     }
   },
   "keywords": [
@@ -54,5 +62,8 @@
     "tsx": "^4.21.0",
     "typescript": "^5.0.3",
     "typescript-eslint": "^8.0.0"
+  },
+  "dependencies": {
+    "execa": "^9.6.1"
   }
 }