@visulima/tui 0.0.1 → 1.0.0-alpha.2

package/dist/packem_shared/Static-DpTd6Eed.js

@@ -0,0 +1,22 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState, useMemo, useLayoutEffect } from 'react';
+
+function Static(props) {
+  const { children: render, items, style: customStyle } = props;
+  const [index, setIndex] = useState(0);
+  const itemsToRender = useMemo(() => items.slice(index), [items, index]);
+  useLayoutEffect(() => {
+    setIndex(items.length);
+  }, [items.length]);
+  const children = itemsToRender.map((item, itemIndex) => render(item, index + itemIndex));
+  const style = useMemo(() => {
+    return {
+      flexDirection: "column",
+      position: "absolute",
+      ...customStyle
+    };
+  }, [customStyle]);
+  return jsx("ink-box", { internal_static: true, style, children });
+}
+
+export { Static as default };

package/dist/packem_shared/Static-xmD9giJj.js

@@ -0,0 +1,18 @@
+import React, { useRef, useMemo } from 'react';
+
+function Static({ children: renderItem, items, style }) {
+  const committedRef = useRef([]);
+  const lastIndexRef = useRef(0);
+  if (items.length > lastIndexRef.current) {
+    for (let i = lastIndexRef.current; i < items.length; i++) {
+      committedRef.current.push(renderItem(items[i], i));
+    }
+    lastIndexRef.current = items.length;
+  }
+  const containerStyle = useMemo(() => {
+    return { flexDirection: "column", ...style };
+  }, [style]);
+  return React.createElement("box", containerStyle, ...committedRef.current);
+}
+
+export { Static };

package/dist/packem_shared/StaticRender-tYwH6QXl.js

@@ -0,0 +1,33 @@
+import { jsx } from 'react/jsx-runtime';
+import { useRef, useLayoutEffect, useEffect, useMemo } from 'react';
+
+const StaticRender = ({ children, style, width }) => {
+  const ref = useRef(null);
+  const isRenderedRef = useRef(false);
+  useLayoutEffect(() => {
+    const node = ref.current;
+    if (node) {
+      node.internal_onRendered = () => {
+        isRenderedRef.current = true;
+      };
+    }
+  });
+  useEffect(() => {
+    return () => {
+      const node = ref.current;
+      if (node) {
+        node.cachedRender = void 0;
+        node.internal_onRendered = void 0;
+      }
+    };
+  }, []);
+  const mergedStyle = useMemo(() => {
+    return {
+      ...style,
+      width
+    };
+  }, [style, width]);
+  return jsx("ink-static-render", { ref, style: mergedStyle, children: isRenderedRef.current ? null : children() });
+};
+
+export { StaticRender as default };

package/dist/packem_shared/StatusMessage-BtSYxzwb.js

@@ -0,0 +1,14 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import Box from './Box-D_pSJ9Jp.js';
+import Text from './Text-DvAUdZcK.js';
+import { V as VARIANT_CONFIG } from './variant-config-DSZoX5TM.js';
+
+function StatusMessage({ children, variant }) {
+  const { color, icon } = VARIANT_CONFIG[variant];
+  return jsxs(Box, { gap: 1, children: [
+    jsx(Text, { color, children: icon }),
+    jsx(Text, { children })
+  ] });
+}
+
+export { StatusMessage as default };

package/dist/packem_shared/StderrContext-Bj4Mf7v7.js

@@ -0,0 +1,17 @@
+import { createRequire as __cjs_createRequire } from "node:module";
+
+const __cjs_require = __cjs_createRequire(import.meta.url);
+
+const __cjs_getProcess = typeof globalThis !== "undefined" && typeof globalThis.process !== "undefined" ? globalThis.process : process;
+
+const process = __cjs_getProcess;
+import { createContext } from 'react';
+
+const StderrContext = createContext({
+  stderr: process.stderr,
+  write() {
+  }
+});
+StderrContext.displayName = "InternalStderrContext";
+
+export { StderrContext as S };

package/dist/packem_shared/StdinContext-Bq_GNJ3z.js

@@ -0,0 +1,38 @@
+import { createRequire as __cjs_createRequire } from "node:module";
+
+const __cjs_require = __cjs_createRequire(import.meta.url);
+
+const __cjs_getProcess = typeof globalThis !== "undefined" && typeof globalThis.process !== "undefined" ? globalThis.process : process;
+
+const __cjs_getBuiltinModule = (module) => {
+    // Check if we're in Node.js and version supports getBuiltinModule
+    if (typeof __cjs_getProcess !== "undefined" && __cjs_getProcess.versions && __cjs_getProcess.versions.node) {
+        const [major, minor] = __cjs_getProcess.versions.node.split(".").map(Number);
+        // Node.js 20.16.0+ and 22.3.0+
+        if (major > 22 || (major === 22 && minor >= 3) || (major === 20 && minor >= 16)) {
+            return __cjs_getProcess.getBuiltinModule(module);
+        }
+    }
+    // Fallback to createRequire
+    return __cjs_require(module);
+};
+
+const {
+  EventEmitter
+} = __cjs_getBuiltinModule("node:events");
+const process = __cjs_getProcess;
+import { createContext } from 'react';
+
+const StdinContext = createContext({
+  internal_eventEmitter: new EventEmitter(),
+  internal_exitOnCtrlC: true,
+  isRawModeSupported: false,
+  setBracketedPasteMode() {
+  },
+  setRawMode() {
+  },
+  stdin: process.stdin
+});
+StdinContext.displayName = "InternalStdinContext";
+
+export { StdinContext as S };

package/dist/packem_shared/StdoutContext-CgjWeCdO.js

@@ -0,0 +1,17 @@
+import { createRequire as __cjs_createRequire } from "node:module";
+
+const __cjs_require = __cjs_createRequire(import.meta.url);
+
+const __cjs_getProcess = typeof globalThis !== "undefined" && typeof globalThis.process !== "undefined" ? globalThis.process : process;
+
+const process = __cjs_getProcess;
+import { createContext } from 'react';
+
+const StdoutContext = createContext({
+  stdout: process.stdout,
+  write() {
+  }
+});
+StdoutContext.displayName = "InternalStdoutContext";
+
+export { StdoutContext as S };

package/dist/packem_shared/Stopwatch-DjtTCyHn.js

@@ -0,0 +1,23 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useImperativeHandle } from 'react';
+import useStopwatch from './useStopwatch-qC4Beai4.js';
+import { f as formatDuration } from './format-time-BGmnDukX.js';
+import Text from './Text-DvAUdZcK.js';
+
+const Stopwatch = forwardRef(function Stopwatch2({ autoStart, bold, color, format = formatDuration, interval }, ref) {
+  const sw = useStopwatch({ autoStart, interval });
+  useImperativeHandle(
+    ref,
+    () => ({
+      lap: sw.lap,
+      reset: sw.reset,
+      start: sw.start,
+      stop: sw.stop,
+      toggle: sw.toggle
+    }),
+    [sw.lap, sw.reset, sw.start, sw.stop, sw.toggle]
+  );
+  return jsx(Text, { bold, color, children: format(sw.elapsed) });
+});
+
+export { Stopwatch as default };

package/dist/packem_shared/Tab-C6r5q4hR.js

@@ -0,0 +1,7 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+function Tab({ children }) {
+  return jsx(Fragment, { children });
+}
+
+export { Tab as default };

package/dist/packem_shared/Table-D-rSVlzb.js

@@ -0,0 +1,82 @@
+import { jsx } from 'react/jsx-runtime';
+import { Table } from '@visulima/tabular';
+import { THICK_BORDER, ROUNDED_BORDER, NO_BORDER, MINIMAL_BORDER, MARKDOWN_BORDER, DOUBLE_BORDER, DOTS_BORDER, DEFAULT_BORDER, BLOCK_BORDER, ASCII_BORDER } from '@visulima/tabular/style';
+import { useMemo } from 'react';
+import Text from './Text-DvAUdZcK.js';
+
+const BORDER_PRESETS = {
+  ascii: ASCII_BORDER,
+  block: BLOCK_BORDER,
+  default: DEFAULT_BORDER,
+  dots: DOTS_BORDER,
+  double: DOUBLE_BORDER,
+  markdown: MARKDOWN_BORDER,
+  minimal: MINIMAL_BORDER,
+  none: NO_BORDER,
+  rounded: ROUNDED_BORDER,
+  thick: THICK_BORDER
+};
+function TableComponent({
+  borderStyle = "default",
+  columns: columnsProp,
+  data,
+  formatCell,
+  formatHeader,
+  maxWidth,
+  padding = 1,
+  showHeader = true,
+  skeleton = "",
+  wordWrap = false
+}) {
+  const tableString = useMemo(() => {
+    if (data.length === 0) {
+      return "";
+    }
+    let resolvedColumns;
+    if (columnsProp) {
+      resolvedColumns = columnsProp.map((col) => typeof col === "string" ? { key: col } : col);
+    } else {
+      resolvedColumns = Object.keys(data[0]).map((key) => {
+        return { key };
+      });
+    }
+    if (resolvedColumns.length === 0) {
+      return "";
+    }
+    const border = typeof borderStyle === "string" ? BORDER_PRESETS[borderStyle] ?? DEFAULT_BORDER : borderStyle;
+    const columnWidths = resolvedColumns.map((col) => col.width);
+    const hasFixedWidths = columnWidths.some((w) => w !== void 0);
+    const table = new Table({
+      columnWidths: hasFixedWidths ? columnWidths : void 0,
+      maxWidth,
+      showHeader,
+      style: {
+        border,
+        paddingLeft: padding,
+        paddingRight: padding
+      },
+      wordWrap
+    });
+    if (showHeader) {
+      const headers = resolvedColumns.map((col) => {
+        const label = col.header ?? col.key;
+        return formatHeader ? formatHeader(col.key) : label;
+      });
+      table.setHeaders(headers);
+    }
+    for (const [rowIndex, row] of data.entries()) {
+      const cells = resolvedColumns.map((col) => {
+        const value = row[col.key];
+        if (formatCell) {
+          return formatCell(value, col.key, rowIndex);
+        }
+        return value === void 0 || value === null ? skeleton : String(value);
+      });
+      table.addRow(cells);
+    }
+    return table.toString();
+  }, [borderStyle, columnsProp, data, formatCell, formatHeader, maxWidth, padding, showHeader, skeleton, wordWrap]);
+  return jsx(Text, { children: tableString });
+}
+
+export { TableComponent as default };

package/dist/packem_shared/Tabs-hki-KRnx.js

@@ -0,0 +1,153 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRef, useState, useEffect, useMemo, useCallback, Children } from 'react';
+import useInput from './useInput-Cfp5zB2s.js';
+import Box from './Box-D_pSJ9Jp.js';
+import Text from './Text-DvAUdZcK.js';
+
+const NUMBER_KEY_PATTERN = /^\d$/u;
+const isTabElement = (child) => child != null && typeof child === "object" && "props" in child && "name" in child.props;
+const collectTabs = (children) => {
+  const result = [];
+  for (const child of Children.toArray(children)) {
+    if (isTabElement(child)) {
+      result.push(child);
+    }
+  }
+  return result;
+};
+const matchesAnyKey = (keys, key) => keys.some((keyName) => key[keyName]);
+const getActiveTabColors = (isActive, focused, colorsProp) => {
+  if (!isActive) {
+    return { backgroundColor: void 0, color: void 0 };
+  }
+  if (focused) {
+    return {
+      backgroundColor: colorsProp?.activeTab?.backgroundColor ?? "green",
+      color: colorsProp?.activeTab?.color ?? "black"
+    };
+  }
+  return { backgroundColor: "gray", color: "black" };
+};
+function Tabs({
+  children,
+  colors: colorsProp,
+  defaultValue,
+  flexDirection = "row",
+  isFocused,
+  keyMap: keyMapProp,
+  onChange,
+  showIndex = true,
+  value,
+  width
+}) {
+  const tabs = collectTabs(children);
+  const tabCount = tabs.length;
+  const tabsRef = useRef(tabs);
+  tabsRef.current = tabs;
+  const isColumn = flexDirection === "column" || flexDirection === "column-reverse";
+  const isControlled = value !== void 0;
+  const [internalTab, setInternalTab] = useState(() => {
+    const initial = value ?? defaultValue;
+    if (initial == null || tabCount === 0) {
+      return 0;
+    }
+    const foundIndex = tabs.findIndex((tab) => tab.props.name === initial);
+    return foundIndex === -1 ? 0 : foundIndex;
+  });
+  const activeTab = isControlled ? Math.max(0, tabs.findIndex((tab) => tab.props.name === value)) : internalTab;
+  const setActiveTab = isControlled ? () => {
+  } : setInternalTab;
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  useEffect(() => {
+    if (isControlled) {
+      return;
+    }
+    const tab = tabsRef.current[activeTab];
+    if (tab) {
+      onChangeRef.current(tab.props.name, tab);
+    }
+  }, []);
+  const previousKeys = useMemo(() => keyMapProp?.previous ?? [isColumn ? "upArrow" : "leftArrow"], [keyMapProp?.previous, isColumn]);
+  const nextKeys = useMemo(() => keyMapProp?.next ?? [isColumn ? "downArrow" : "rightArrow"], [keyMapProp?.next, isColumn]);
+  const useNumbers = keyMapProp?.useNumbers ?? true;
+  const useTab = keyMapProp?.useTab ?? true;
+  const activeTabRef = useRef(activeTab);
+  activeTabRef.current = activeTab;
+  const handleTabChange = useCallback((index) => {
+    setActiveTab(index);
+    const tab = tabsRef.current[index];
+    if (tab) {
+      onChangeRef.current(tab.props.name, tab);
+    }
+  }, [setActiveTab]);
+  const moveToNext = useCallback(() => {
+    const next = (activeTabRef.current + 1) % tabCount;
+    setActiveTab(next);
+    const tab = tabsRef.current[next];
+    if (tab) {
+      onChangeRef.current(tab.props.name, tab);
+    }
+  }, [tabCount, setActiveTab]);
+  const moveToPrevious = useCallback(() => {
+    const previous = (activeTabRef.current - 1 + tabCount) % tabCount;
+    setActiveTab(previous);
+    const tab = tabsRef.current[previous];
+    if (tab) {
+      onChangeRef.current(tab.props.name, tab);
+    }
+  }, [tabCount, setActiveTab]);
+  useInput(
+    useCallback(
+      (input, key) => {
+        if (matchesAnyKey(previousKeys, key)) {
+          moveToPrevious();
+          return;
+        }
+        if (matchesAnyKey(nextKeys, key)) {
+          moveToNext();
+          return;
+        }
+        if (key.tab && useTab && isFocused == null) {
+          if (key.shift) {
+            moveToPrevious();
+          } else {
+            moveToNext();
+          }
+          return;
+        }
+        if (useNumbers && key.meta && NUMBER_KEY_PATTERN.test(input)) {
+          const tabIndex = input === "0" ? 9 : Number.parseInt(input, 10) - 1;
+          if (tabIndex < tabCount) {
+            handleTabChange(tabIndex);
+          }
+        }
+      },
+      [previousKeys, nextKeys, useTab, useNumbers, isFocused, moveToPrevious, moveToNext, tabCount, handleTabChange]
+    ),
+    { isActive: isFocused !== false }
+  );
+  const separatorWidth = typeof width === "number" ? width : 6;
+  const separator = useMemo(
+    // eslint-disable-next-line @stylistic/no-extra-parens
+    () => isColumn ? "─".repeat(separatorWidth) : " | ",
+    [isColumn, separatorWidth]
+  );
+  return jsx(Box, { flexDirection, width, children: tabs.map((child, index) => {
+    const { name } = child.props;
+    const textColors = getActiveTabColors(activeTab === index, isFocused !== false, colorsProp);
+    return jsxs(Box, { flexDirection, children: [
+      index !== 0 && jsx(Text, { color: "dim", children: separator }),
+      jsxs(Box, { children: [
+        showIndex ? jsxs(Text, { color: "grey", children: [
+          index + 1,
+          ".",
+          " "
+        ] }) : null,
+        jsx(Text, { backgroundColor: textColors.backgroundColor, color: textColors.color, children: child })
+      ] })
+    ] }, name);
+  }) });
+}
+
+export { Tabs as default };

package/dist/packem_shared/Text-DvAUdZcK.js

@@ -0,0 +1,65 @@
+import { jsx } from 'react/jsx-runtime';
+import colorizeDefault from '@visulima/colorize';
+import { useContext, useCallback } from 'react';
+import { c as colorize } from './colorize-88_Vk8cn.js';
+import { a as accessibilityContext } from './AccessibilityContext-BLelHhNU.js';
+import { b as backgroundContext } from './BackgroundContext-BAUaxfOb.js';
+
+function Text({
+  "aria-hidden": ariaHidden = false,
+  "aria-label": ariaLabel,
+  backgroundColor,
+  bold = false,
+  children,
+  color,
+  dimColor = false,
+  inverse = false,
+  italic = false,
+  strikethrough = false,
+  underline = false,
+  wrap = "wrap"
+}) {
+  const { isScreenReaderEnabled } = useContext(accessibilityContext);
+  const inheritedBackgroundColor = useContext(backgroundContext);
+  const childrenOrAriaLabel = isScreenReaderEnabled && ariaLabel ? ariaLabel : children;
+  const transform = useCallback(
+    (children2) => {
+      if (dimColor) {
+        children2 = colorizeDefault.dim(children2);
+      }
+      if (color) {
+        children2 = colorize(children2, color, "foreground");
+      }
+      const effectiveBackgroundColor = backgroundColor ?? inheritedBackgroundColor;
+      if (effectiveBackgroundColor) {
+        children2 = colorize(children2, effectiveBackgroundColor, "background");
+      }
+      if (bold) {
+        children2 = colorizeDefault.bold(children2);
+      }
+      if (italic) {
+        children2 = colorizeDefault.italic(children2);
+      }
+      if (underline) {
+        children2 = colorizeDefault.underline(children2);
+      }
+      if (strikethrough) {
+        children2 = colorizeDefault.strikethrough(children2);
+      }
+      if (inverse) {
+        children2 = colorizeDefault.inverse(children2);
+      }
+      return children2;
+    },
+    [dimColor, color, backgroundColor, inheritedBackgroundColor, bold, italic, underline, strikethrough, inverse]
+  );
+  if (childrenOrAriaLabel === void 0 || childrenOrAriaLabel === null) {
+    return null;
+  }
+  if (isScreenReaderEnabled && ariaHidden) {
+    return null;
+  }
+  return jsx("ink-text", { internal_transform: transform, style: { flexDirection: "row", flexGrow: 0, flexShrink: 1, textWrap: wrap }, children: isScreenReaderEnabled && ariaLabel ? ariaLabel : children });
+}
+
+export { Text as default };

package/dist/packem_shared/TextInput-C79WEQ5U.js

@@ -0,0 +1,137 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useRef, useCallback } from 'react';
+import useInput from './useInput-Cfp5zB2s.js';
+import { i as isInsertableInput } from './input-utils-ViAEXa0Z.js';
+import Box from './Box-D_pSJ9Jp.js';
+import Text from './Text-DvAUdZcK.js';
+
+const KILL_WORD_PATTERN = /\S+\s*$/;
+const findSuggestion = (value, suggestions) => {
+  if (value.length === 0 || !suggestions) {
+    return void 0;
+  }
+  const match = suggestions.find((s) => s.startsWith(value));
+  return match?.slice(value.length) ?? void 0;
+};
+const NAV_NOT_HANDLED = -1;
+const handleNavigation = (input, key, cursor, valueLength) => {
+  if (key.leftArrow) {
+    return Math.max(0, cursor - 1);
+  }
+  if (key.home || key.ctrl && input === "a") {
+    return 0;
+  }
+  if (key.end || key.ctrl && input === "e") {
+    return valueLength;
+  }
+  return NAV_NOT_HANDLED;
+};
+const handleEditing = (input, key, currentValue, cursor) => {
+  if (key.backspace && cursor > 0) {
+    return [currentValue.slice(0, cursor - 1) + currentValue.slice(cursor), cursor - 1];
+  }
+  if (key.delete && cursor < currentValue.length) {
+    return [currentValue.slice(0, cursor) + currentValue.slice(cursor + 1), cursor];
+  }
+  if (key.ctrl && input === "u") {
+    return [currentValue.slice(cursor), 0];
+  }
+  if (key.ctrl && input === "k") {
+    return [currentValue.slice(0, cursor), cursor];
+  }
+  if (key.ctrl && input === "w") {
+    const before = currentValue.slice(0, cursor);
+    const trimmed = before.replace(KILL_WORD_PATTERN, "");
+    return [trimmed + currentValue.slice(cursor), trimmed.length];
+  }
+  return void 0;
+};
+function TextInput({ defaultValue = "", isDisabled = false, mask = false, onChange, onSubmit, placeholder, suggestions }) {
+  const [value, setValueRaw] = useState(defaultValue);
+  const [cursor, setCursor] = useState(defaultValue.length);
+  const valueRef = useRef(value);
+  valueRef.current = value;
+  const cursorRef = useRef(cursor);
+  cursorRef.current = cursor;
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const onSubmitRef = useRef(onSubmit);
+  onSubmitRef.current = onSubmit;
+  const suggestion = findSuggestion(value, suggestions);
+  const inputHandler = useCallback(
+    (input, key) => {
+      const { current } = cursorRef;
+      const currentValue = valueRef.current;
+      if (key.return) {
+        const currentSuggestion = findSuggestion(currentValue, suggestions);
+        const finalValue = currentSuggestion ? currentValue + currentSuggestion : currentValue;
+        if (currentSuggestion) {
+          setValueRaw(finalValue);
+          setCursor(finalValue.length);
+          onChangeRef.current?.(finalValue);
+        }
+        onSubmitRef.current?.(finalValue);
+        return;
+      }
+      if (key.escape) {
+        return;
+      }
+      if (key.rightArrow) {
+        const currentSuggestion = findSuggestion(currentValue, suggestions);
+        if (current === currentValue.length && currentSuggestion) {
+          const completed = currentValue + currentSuggestion;
+          setValueRaw(completed);
+          setCursor(completed.length);
+          onChangeRef.current?.(completed);
+          return;
+        }
+        setCursor(Math.min(currentValue.length, current + 1));
+        return;
+      }
+      const navResult = handleNavigation(input, key, current, currentValue.length);
+      if (navResult !== NAV_NOT_HANDLED) {
+        setCursor(navResult);
+        return;
+      }
+      const editResult = handleEditing(input, key, currentValue, current);
+      if (editResult) {
+        const [newValue, newCursor] = editResult;
+        setValueRaw(newValue);
+        setCursor(newCursor);
+        onChangeRef.current?.(newValue);
+        return;
+      }
+      if (isInsertableInput(input, key)) {
+        const next = currentValue.slice(0, current) + input + currentValue.slice(current);
+        setValueRaw(next);
+        setCursor(current + input.length);
+        onChangeRef.current?.(next);
+      }
+    },
+    [suggestions]
+  );
+  useInput(inputHandler, { isActive: !isDisabled });
+  const displayValue = mask ? "*".repeat(value.length) : value;
+  const beforeCursor = displayValue.slice(0, cursor);
+  const atCursor = displayValue[cursor];
+  const afterCursor = displayValue.slice(cursor + 1);
+  if (isDisabled) {
+    return jsx(Box, { children: jsx(Text, { dimColor: true, children: displayValue || placeholder || "" }) });
+  }
+  if (value.length === 0 && placeholder) {
+    return jsxs(Box, { children: [
+      jsx(Text, { dimColor: true, inverse: true, children: placeholder[0] }),
+      jsx(Text, { dimColor: true, children: placeholder.slice(1) })
+    ] });
+  }
+  return jsxs(Box, { children: [
+    jsxs(Text, { children: [
+      beforeCursor,
+      jsx(Text, { inverse: true, children: atCursor ?? " " }),
+      afterCursor
+    ] }),
+    suggestion ? jsx(Text, { dimColor: true, children: suggestion }) : void 0
+  ] });
+}
+
+export { TextInput as default };