@cli-use/tui 0.1.0

package/dist/index.cjs

@@ -0,0 +1,970 @@
+/**
+ * @license MIT
+ * cli-use - React-based Terminal UI Framework
+ * Inspired by Ratatui (https://ratatui.rs)
+ */
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  ANSI: () => ANSI,
+  Box: () => Box,
+  Buffer: () => Buffer2,
+  Button: () => Button,
+  Flex: () => Flex,
+  Grid: () => Grid,
+  Input: () => Input,
+  Progress: () => Progress,
+  React: () => import_react15.default,
+  Renderer: () => Renderer,
+  Terminal: () => Terminal,
+  Text: () => Text,
+  createRoot: () => createRoot,
+  render: () => render,
+  useApp: () => useApp,
+  useAppState: () => useAppState,
+  useFocus: () => useFocus,
+  useInput: () => useInput,
+  useInterval: () => useInterval,
+  useKey: () => useKey,
+  useList: () => useList,
+  useStdout: () => useStdout,
+  useStdoutDimensions: () => useStdoutDimensions,
+  useTimeout: () => useTimeout
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/renderer/types.ts
+var Buffer2 = class _Buffer {
+  constructor(width, height, cells = []) {
+    this.width = width;
+    this.height = height;
+    this.cells = cells;
+    this.cells = Array.from(
+      { length: height },
+      () => Array.from({ length: width }, () => ({ char: " " }))
+    );
+  }
+  setCell(x, y, cell) {
+    if (y >= 0 && y < this.height && x >= 0 && x < this.width) {
+      this.cells[y][x] = cell;
+    }
+  }
+  getCell(x, y) {
+    if (y >= 0 && y < this.height && x >= 0 && x < this.width) {
+      return this.cells[y][x];
+    }
+    return void 0;
+  }
+  clear() {
+    this.cells = Array.from(
+      { length: this.height },
+      () => Array.from({ length: this.width }, () => ({ char: " " }))
+    );
+  }
+  resize(width, height) {
+    const newCells = Array.from(
+      { length: height },
+      () => Array.from({ length: width }, () => ({ char: " " }))
+    );
+    for (let y = 0; y < Math.min(this.height, height); y++) {
+      for (let x = 0; x < Math.min(this.width, width); x++) {
+        newCells[y][x] = this.cells[y][x];
+      }
+    }
+    this.cells = newCells;
+    this.width = width;
+    this.height = height;
+  }
+  clone() {
+    const newBuffer = new _Buffer(this.width, this.height);
+    newBuffer.cells = this.cells.map((row) => row.map((cell) => ({ ...cell })));
+    return newBuffer;
+  }
+};
+
+// src/renderer/terminal.ts
+var readline = __toESM(require("readline"), 1);
+var ANSI = {
+  // Screen control
+  CLEAR_SCREEN: "\x1B[2J",
+  RESET_CURSOR: "\x1B[H",
+  ALTERNATE_SCREEN_ENABLE: "\x1B[?1049h",
+  ALTERNATE_SCREEN_DISABLE: "\x1B[?1049l",
+  // Cursor control
+  HIDE_CURSOR: "\x1B[?25l",
+  SHOW_CURSOR: "\x1B[?25h",
+  MOVE_CURSOR: (x, y) => `\x1B[${y + 1};${x + 1}H`,
+  // Colors
+  RESET_STYLE: "\x1B[0m",
+  FG_COLOR_256: (color) => `\x1B[38;5;${color}m`,
+  BG_COLOR_256: (color) => `\x1B[48;5;${color}m`,
+  FG_COLOR_RGB: (r, g, b) => `\x1B[38;2;${r};${g};${b}m`,
+  BG_COLOR_RGB: (r, g, b) => `\x1B[48;2;${r};${g};${b}m`,
+  // Text styles
+  BOLD: "\x1B[1m",
+  DIM: "\x1B[2m",
+  ITALIC: "\x1B[3m",
+  UNDERLINE: "\x1B[4m",
+  STRIKETHROUGH: "\x1B[9m",
+  // Reset individual styles
+  BOLD_OFF: "\x1B[22m",
+  DIM_OFF: "\x1B[22m",
+  ITALIC_OFF: "\x1B[23m",
+  UNDERLINE_OFF: "\x1B[24m",
+  STRIKETHROUGH_OFF: "\x1B[29m"
+};
+var Terminal = class {
+  stdin;
+  stdout;
+  _size;
+  rawMode = false;
+  alternateScreen = false;
+  constructor(stdin = process.stdin, stdout = process.stdout) {
+    this.stdin = stdin;
+    this.stdout = stdout;
+    this._size = { cols: stdout.columns || 80, rows: stdout.rows || 24 };
+  }
+  get size() {
+    return this._size;
+  }
+  /**
+   * Enable raw mode for character-by-character input
+   */
+  enableRawMode() {
+    if (this.rawMode) return;
+    this.rawMode = true;
+    readline.emitKeypressEvents(this.stdin);
+    this.stdin.setRawMode(true);
+  }
+  /**
+   * Disable raw mode
+   */
+  disableRawMode() {
+    if (!this.rawMode) return;
+    this.rawMode = false;
+    this.stdin.setRawMode(false);
+  }
+  /**
+   * Enable alternate screen buffer
+   */
+  enableAlternateScreen() {
+    if (this.alternateScreen) return;
+    this.alternateScreen = true;
+    this.stdout.write(ANSI.ALTERNATE_SCREEN_ENABLE);
+  }
+  /**
+   * Disable alternate screen buffer
+   */
+  disableAlternateScreen() {
+    if (!this.alternateScreen) return;
+    this.alternateScreen = false;
+    this.stdout.write(ANSI.ALTERNATE_SCREEN_DISABLE);
+  }
+  /**
+   * Hide cursor
+   */
+  hideCursor() {
+    this.stdout.write(ANSI.HIDE_CURSOR);
+  }
+  /**
+   * Show cursor
+   */
+  showCursor() {
+    this.stdout.write(ANSI.SHOW_CURSOR);
+  }
+  /**
+   * Clear the entire screen
+   */
+  clear() {
+    this.stdout.write(ANSI.CLEAR_SCREEN + ANSI.RESET_CURSOR);
+  }
+  /**
+   * Write buffer to terminal
+   */
+  write(buffer) {
+    let output = ANSI.RESET_STYLE;
+    let lastStyle = null;
+    for (let y = 0; y < buffer.height; y++) {
+      for (let x = 0; x < buffer.width; x++) {
+        const cell = buffer.getCell(x, y);
+        if (!cell) continue;
+        const style = this.buildStyleString(cell);
+        if (style !== lastStyle) {
+          output += style;
+          lastStyle = style;
+        }
+        output += cell.char;
+      }
+      output += "\r\n";
+    }
+    this.stdout.write(output);
+  }
+  /**
+   * Build ANSI style string from cell
+   */
+  buildStyleString(cell) {
+    let style = "";
+    if (cell.fg !== void 0) {
+      style += ANSI.FG_COLOR_256(cell.fg);
+    }
+    if (cell.bg !== void 0) {
+      style += ANSI.BG_COLOR_256(cell.bg);
+    }
+    if (cell.bold) {
+      style += ANSI.BOLD;
+    }
+    if (cell.dim) {
+      style += ANSI.DIM;
+    }
+    return style;
+  }
+  /**
+   * Set up SIGWINCH handler for terminal resize
+   */
+  onResize(callback) {
+    const handler = () => {
+      this._size = { cols: this.stdout.columns || 80, rows: this.stdout.rows || 24 };
+      callback(this._size);
+    };
+    process.on("SIGWINCH", handler);
+    return () => {
+      process.off("SIGWINCH", handler);
+    };
+  }
+  /**
+   * Set up input handler
+   */
+  onInput(callback) {
+    const handler = (chunk, key) => {
+      callback(chunk, key);
+    };
+    this.stdin.on("keypress", handler);
+    return () => {
+      this.stdin.off("keypress", handler);
+    };
+  }
+  /**
+   * Clean up terminal state
+   */
+  restore() {
+    this.showCursor();
+    this.disableAlternateScreen();
+    this.disableRawMode();
+    this.stdout.write(ANSI.RESET_STYLE);
+  }
+};
+
+// src/renderer/renderer.ts
+var Renderer = class {
+  terminal;
+  buffer;
+  previousBuffer;
+  currentSize;
+  running = false;
+  constructor(terminal = new Terminal()) {
+    this.terminal = terminal;
+    this.currentSize = terminal.size;
+  }
+  /**
+   * Start the renderer
+   */
+  start() {
+    if (this.running) return;
+    this.running = true;
+    this.terminal.enableRawMode();
+    this.terminal.enableAlternateScreen();
+    this.terminal.hideCursor();
+    this.terminal.clear();
+    this.buffer = new Buffer2(this.currentSize.cols, this.currentSize.rows);
+    this.terminal.onResize((size) => {
+      this.currentSize = size;
+      this.buffer?.resize(size.cols, size.rows);
+    });
+  }
+  /**
+   * Stop the renderer
+   */
+  stop() {
+    if (!this.running) return;
+    this.running = false;
+    this.terminal.restore();
+  }
+  /**
+   * Get a writable buffer for the current frame
+   */
+  getBuffer() {
+    if (!this.buffer) {
+      throw new Error("Renderer not started");
+    }
+    return this.buffer;
+  }
+  /**
+   * Present the current buffer to the terminal
+   */
+  present() {
+    if (!this.buffer) return;
+    this.terminal.write(this.buffer);
+    this.previousBuffer = this.buffer.clone();
+    this.buffer.clear();
+  }
+  /**
+   * Get the current terminal size
+   */
+  getSize() {
+    return this.currentSize;
+  }
+  /**
+   * Get the terminal instance for direct access
+   */
+  getTerminal() {
+    return this.terminal;
+  }
+};
+
+// src/reconciler/index.ts
+var import_react_reconciler = __toESM(require("react-reconciler"), 1);
+
+// src/reconciler/host-config.ts
+var hostConfig = {
+  supportsPersistence: false,
+  supportsMutation: true,
+  createInstance(type, props) {
+    return { type, props: { ...props }, children: [], parent: null, node: { type, props: { ...props }, children: [] } };
+  },
+  appendInitialChild(parentInstance, child) {
+    parentInstance.children.push(child);
+    child.parent = parentInstance;
+  },
+  finalizeInitialChildren() {
+    return false;
+  },
+  prepareUpdate() {
+    return {};
+  },
+  shouldSetTextContent(type) {
+    return type === "TEXT";
+  },
+  createTextInstance(text) {
+    return { type: "TEXT", props: { children: text }, children: [], parent: null, node: { type: "TEXT", props: { children: text }, children: [] } };
+  },
+  appendChildToContainer(container, child) {
+    container.root = child;
+    child.parent = null;
+  },
+  appendChild(parentInstance, child) {
+    parentInstance.children.push(child);
+    child.parent = parentInstance;
+  },
+  removeChild(parentInstance, child) {
+    const index = parentInstance.children.indexOf(child);
+    if (index !== -1) {
+      parentInstance.children.splice(index, 1);
+      child.parent = null;
+    }
+  },
+  removeChildFromContainer(_container, child) {
+    child.parent = null;
+  },
+  insertBefore(parentInstance, child, beforeChild) {
+    const index = parentInstance.children.indexOf(beforeChild);
+    if (index !== -1) {
+      parentInstance.children.splice(index, 0, child);
+    } else {
+      parentInstance.children.push(child);
+    }
+    child.parent = parentInstance;
+  },
+  insertInContainerBefore() {
+  },
+  commitUpdate(instance, _updatePayload, _type, _oldProps, newProps) {
+    instance.props = { ...newProps };
+    instance.node.props = { ...newProps };
+  },
+  commitTextUpdate(textInstance, _oldText, newText) {
+    textInstance.props.children = newText;
+    textInstance.node.props.children = newText;
+  },
+  resetTextContent(instance) {
+    if (instance.type === "TEXT") {
+      instance.props.children = "";
+      instance.node.props.children = "";
+    }
+  },
+  getPublicInstance(instance) {
+    return instance;
+  },
+  getRootHostContext(rootContainer) {
+    return rootContainer;
+  },
+  getChildHostContext(parentHostContext) {
+    return parentHostContext;
+  },
+  prepareForCommit() {
+    return null;
+  },
+  resetAfterCommit(container) {
+    if (container.root) {
+      renderToBuffer(container.root, container.buffer);
+    }
+  },
+  shouldAttemptEagerTransition() {
+    return false;
+  },
+  scheduleTimeout: setTimeout,
+  cancelTimeout: clearTimeout,
+  noTimeout: -1,
+  getCurrentEventPriority() {
+    return 0;
+  },
+  getInstanceFromNode(node) {
+    return node;
+  },
+  beforeActiveInstanceBlur() {
+  },
+  afterActiveInstanceBlur() {
+  },
+  preparePortalMount() {
+  },
+  prepareScopeUpdate() {
+  },
+  getInstanceFromScope() {
+    return null;
+  },
+  detachDeletedInstance() {
+  },
+  isPrimaryRenderer: true,
+  supportsHydration: false
+};
+function renderToBuffer(instance, buffer, x = 0, y = 0) {
+  if (!instance) return;
+  const { type, props, children } = instance;
+  const currentX = props.x ?? x;
+  const currentY = props.y ?? y;
+  if (type === "TEXT" || typeof props.children === "string") {
+    const text = String(props.children || "");
+    const style = props.style || {};
+    for (let i = 0; i < text.length; i++) {
+      const char = text[i];
+      if (char === "\n") continue;
+      buffer.setCell(currentX + i, currentY, { char, ...style });
+    }
+  }
+  if (Array.isArray(children)) {
+    for (const child of children) {
+      renderToBuffer(child, buffer, currentX, currentY);
+    }
+  } else if (children) {
+    renderToBuffer(children, buffer, currentX, currentY);
+  }
+}
+
+// src/reconciler/index.ts
+var createReconciler = () => (0, import_react_reconciler.default)(hostConfig);
+var createRoot = (renderer) => {
+  const buffer = renderer.getBuffer();
+  return {
+    buffer,
+    root: null,
+    listeners: {}
+  };
+};
+var render = (element, container, renderer) => {
+  const reconciler = createReconciler();
+  reconciler.updateContainer(element, container, null, () => {
+    renderer.present();
+  });
+};
+
+// src/components/Box.tsx
+var import_react = __toESM(require("react"), 1);
+var Box = ({
+  children,
+  style,
+  x = 0,
+  y = 0,
+  width,
+  height,
+  border = false,
+  flexDirection = "column",
+  justifyContent = "flex-start",
+  alignItems = "flex-start",
+  padding = 0
+}) => {
+  const props = {
+    children,
+    style,
+    x,
+    y,
+    width,
+    height,
+    border,
+    flexDirection,
+    justifyContent,
+    alignItems,
+    padding
+  };
+  return import_react.default.createElement("BOX", props, children);
+};
+Box.displayName = "Box";
+
+// src/components/Text.tsx
+var import_react2 = __toESM(require("react"), 1);
+var Text = ({ children, style, x = 0, y = 0 }) => {
+  const props = {
+    children: String(children),
+    style,
+    x,
+    y
+  };
+  return import_react2.default.createElement("TEXT", props);
+};
+Text.displayName = "Text";
+
+// src/components/Flex.tsx
+var import_react3 = __toESM(require("react"), 1);
+var Flex = ({
+  children,
+  grow = 0,
+  shrink = 1,
+  basis = "auto",
+  ...boxProps
+}) => {
+  const props = {
+    ...boxProps,
+    children
+  };
+  return import_react3.default.createElement("FLEX", props);
+};
+Flex.displayName = "Flex";
+
+// src/components/Grid.tsx
+var import_react4 = __toESM(require("react"), 1);
+var Grid = ({
+  children,
+  columns = 2,
+  rows,
+  gap = 1,
+  style,
+  x = 0,
+  y = 0,
+  width,
+  height
+}) => {
+  const props = {
+    children,
+    columns,
+    rows,
+    gap,
+    style,
+    x,
+    y,
+    width,
+    height
+  };
+  return import_react4.default.createElement("GRID", props, children);
+};
+Grid.displayName = "Grid";
+
+// src/components/Button.tsx
+var import_react5 = __toESM(require("react"), 1);
+var Button = ({
+  children,
+  onClick,
+  focused = false,
+  style,
+  x = 0,
+  y = 0
+}) => {
+  const activeStyle = focused ? {
+    ...style,
+    fg: style?.focusedFg || style?.fg || 0,
+    bg: style?.focusedBg || style?.bg || 7
+  } : style;
+  const props = {
+    children: `[ ${children} ]`,
+    onClick,
+    focused,
+    style: activeStyle,
+    x,
+    y
+  };
+  return import_react5.default.createElement("BUTTON", props);
+};
+Button.displayName = "Button";
+
+// src/components/Input.tsx
+var import_react6 = __toESM(require("react"), 1);
+var Input = ({
+  value,
+  onChange,
+  placeholder = "",
+  focused = false,
+  mask = false,
+  style,
+  x = 0,
+  y = 0,
+  width = 20,
+  maxLength
+}) => {
+  const displayValue = mask ? "*".repeat(value.length) : value;
+  const displayText = value.length > 0 ? displayValue : focused ? placeholder : "";
+  const props = {
+    value: displayText,
+    onChange,
+    placeholder,
+    focused,
+    mask,
+    style: focused ? style : {
+      ...style,
+      fg: style?.placeholderFg || 8
+    },
+    x,
+    y,
+    width,
+    maxLength
+  };
+  return import_react6.default.createElement("INPUT", props);
+};
+Input.displayName = "Input";
+
+// src/components/Progress.tsx
+var import_react7 = __toESM(require("react"), 1);
+var Progress = ({
+  value,
+  max = 100,
+  style,
+  x = 0,
+  y = 0,
+  width = 20,
+  label
+}) => {
+  const percentage = Math.min(Math.max(value / max, 0), 1);
+  const filledWidth = Math.floor(percentage * width);
+  const props = {
+    value,
+    max,
+    style,
+    x,
+    y,
+    width,
+    label
+  };
+  return import_react7.default.createElement("PROGRESS", props);
+};
+Progress.displayName = "Progress";
+
+// src/hooks/useApp.ts
+var import_react8 = require("react");
+var useApp = (options = {}) => {
+  const rendererRef = (0, import_react8.useRef)(null);
+  const [size, setSize] = (0, import_react8.useState)({ cols: 80, rows: 24 });
+  const [running, setRunning] = (0, import_react8.useState)(false);
+  (0, import_react8.useEffect)(() => {
+    const cleanupResize = () => {
+    };
+    setRunning(true);
+    return () => {
+      setRunning(false);
+      cleanupResize();
+    };
+  }, []);
+  const exit = () => {
+    if (rendererRef.current) {
+      setRunning(false);
+    }
+  };
+  return {
+    renderer: rendererRef.current,
+    size,
+    running,
+    exit
+  };
+};
+
+// src/hooks/useInput.ts
+var import_react9 = require("react");
+var useInput = (callback, deps = []) => {
+  (0, import_react9.useEffect)(() => {
+    const readline2 = require("readline");
+    const handler = (chunk, key) => {
+      if (!key) return;
+      callback({
+        key: key.name || "",
+        name: key.name || "",
+        ctrl: key.ctrl || false,
+        meta: key.meta || false,
+        shift: key.shift || false,
+        sequence: key.sequence || ""
+      });
+    };
+    process.stdin.setRawMode(true);
+    readline2.emitKeypressEvents(process.stdin);
+    process.stdin.on("keypress", handler);
+    return () => {
+      process.stdin.off("keypress", handler);
+    };
+  }, [callback, ...deps]);
+};
+var useKey = (keyName, callback, deps = []) => {
+  const keys = Array.isArray(keyName) ? keyName : [keyName];
+  useInput(
+    (0, import_react9.useCallback)(
+      ({ key, ctrl, meta }) => {
+        if (ctrl || meta) return;
+        if (keys.includes(key)) {
+          callback();
+        }
+      },
+      [callback, keys]
+    ),
+    deps
+  );
+};
+
+// src/hooks/useFocus.ts
+var import_react10 = require("react");
+var useFocus = (initialFocus = 0, itemCount) => {
+  const [focusedIndex, setFocusedIndex] = (0, import_react10.useState)(initialFocus);
+  const focusableRefs = (0, import_react10.useRef)(/* @__PURE__ */ new Map());
+  const focusNext = (0, import_react10.useCallback)(() => {
+    setFocusedIndex((current) => (current + 1) % itemCount);
+  }, [itemCount]);
+  const focusPrevious = (0, import_react10.useCallback)(() => {
+    setFocusedIndex((current) => (current - 1 + itemCount) % itemCount);
+  }, [itemCount]);
+  const setFocus = (0, import_react10.useCallback)((index) => {
+    if (index >= 0 && index < itemCount) {
+      setFocusedIndex(index);
+    }
+  }, [itemCount]);
+  const isFocused = (0, import_react10.useCallback)(
+    (index) => index === focusedIndex,
+    [focusedIndex]
+  );
+  (0, import_react10.useEffect)(() => {
+    const readline2 = require("readline");
+    readline2.emitKeypressEvents(process.stdin);
+    process.stdin.setRawMode(true);
+    const handleKeyPress = (_chunk, key) => {
+      if (key.name === "tab" || key.name === "right") {
+        focusNext();
+      } else if (key.name === "left") {
+        focusPrevious();
+      }
+    };
+    process.stdin.on("keypress", handleKeyPress);
+    return () => {
+      process.stdin.off("keypress", handleKeyPress);
+    };
+  }, [focusNext, focusPrevious]);
+  return {
+    focusedIndex,
+    focusNext,
+    focusPrevious,
+    setFocus,
+    isFocused
+  };
+};
+
+// src/hooks/useStdout.ts
+var import_react11 = require("react");
+var useStdoutDimensions = () => {
+  const [dimensions, setDimensions] = (0, import_react11.useState)(() => ({
+    columns: process.stdout.columns || 80,
+    rows: process.stdout.rows || 24
+  }));
+  (0, import_react11.useEffect)(() => {
+    const handleResize = () => {
+      setDimensions({
+        columns: process.stdout.columns || 80,
+        rows: process.stdout.rows || 24
+      });
+    };
+    process.stdout.on("resize", handleResize);
+    return () => {
+      process.stdout.off("resize", handleResize);
+    };
+  }, []);
+  return dimensions;
+};
+var useStdout = () => {
+  const write = (0, import_react11.useCallback)((data) => {
+    process.stdout.write(data);
+  }, []);
+  return { write };
+};
+
+// src/hooks/useInterval.ts
+var import_react12 = require("react");
+var useInterval = (callback, delay) => {
+  const savedCallback = (0, import_react12.useRef)(callback);
+  (0, import_react12.useEffect)(() => {
+    savedCallback.current = callback;
+  }, [callback]);
+  (0, import_react12.useEffect)(() => {
+    if (delay === null) return;
+    const tick = () => savedCallback.current();
+    const id = setInterval(tick, delay);
+    return () => clearInterval(id);
+  }, [delay]);
+};
+var useTimeout = (callback, delay) => {
+  const savedCallback = (0, import_react12.useRef)(callback);
+  (0, import_react12.useEffect)(() => {
+    savedCallback.current = callback;
+  }, [callback]);
+  (0, import_react12.useEffect)(() => {
+    if (delay === null) return;
+    const tick = () => savedCallback.current();
+    const id = setTimeout(tick, delay);
+    return () => clearTimeout(id);
+  }, [delay]);
+};
+
+// src/hooks/useAppState.ts
+var import_react13 = require("react");
+var useAppState = (initialState = "idle") => {
+  const [state, setState] = (0, import_react13.useState)(initialState);
+  const [error, setError] = (0, import_react13.useState)(null);
+  const setLoading = (0, import_react13.useCallback)(() => {
+    setState("loading");
+    setError(null);
+  }, []);
+  const setSuccess = (0, import_react13.useCallback)(() => {
+    setState("success");
+    setError(null);
+  }, []);
+  const setErrorState = (0, import_react13.useCallback)((err) => {
+    setState("error");
+    setError(err);
+  }, []);
+  const setIdle = (0, import_react13.useCallback)(() => {
+    setState("idle");
+    setError(null);
+  }, []);
+  const isLoading = state === "loading";
+  const isSuccess = state === "success";
+  const isError = state === "error";
+  const isIdle = state === "idle";
+  return {
+    state,
+    error,
+    isLoading,
+    isSuccess,
+    isError,
+    isIdle,
+    setLoading,
+    setSuccess,
+    setError: setErrorState,
+    setIdle
+  };
+};
+
+// src/hooks/useList.ts
+var import_react14 = require("react");
+var useList = ({
+  initialItems = [],
+  initialIndex = 0,
+  loop = true
+} = {}) => {
+  const [items, setItems] = (0, import_react14.useState)(initialItems);
+  const [index, setIndex] = (0, import_react14.useState)(initialIndex);
+  const next = (0, import_react14.useCallback)(() => {
+    setIndex((current) => {
+      if (items.length === 0) return 0;
+      const nextIndex = current + 1;
+      if (nextIndex >= items.length) {
+        return loop ? 0 : items.length - 1;
+      }
+      return nextIndex;
+    });
+  }, [items.length, loop]);
+  const previous = (0, import_react14.useCallback)(() => {
+    setIndex((current) => {
+      if (items.length === 0) return 0;
+      const prevIndex = current - 1;
+      if (prevIndex < 0) {
+        return loop ? items.length - 1 : 0;
+      }
+      return prevIndex;
+    });
+  }, [items.length, loop]);
+  const select = (0, import_react14.useCallback)((item) => {
+    const newIndex = items.indexOf(item);
+    if (newIndex !== -1) {
+      setIndex(newIndex);
+    }
+  }, [items]);
+  const selectedIndex = index;
+  const selectedItem = items[index] ?? null;
+  return {
+    items,
+    setItems,
+    index: selectedIndex,
+    setIndex,
+    selectedItem,
+    next,
+    previous,
+    select
+  };
+};
+
+// src/index.ts
+var import_react15 = __toESM(require("react"), 1);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ANSI,
+  Box,
+  Buffer,
+  Button,
+  Flex,
+  Grid,
+  Input,
+  Progress,
+  React,
+  Renderer,
+  Terminal,
+  Text,
+  createRoot,
+  render,
+  useApp,
+  useAppState,
+  useFocus,
+  useInput,
+  useInterval,
+  useKey,
+  useList,
+  useStdout,
+  useStdoutDimensions,
+  useTimeout
+});
+//# sourceMappingURL=index.cjs.map