@visulima/tui 1.0.0-alpha.2 → 1.0.0-alpha.20

package/dist/components/multi-select.d.ts

@@ -0,0 +1,65 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type MultiSelectOption = {
+  readonly key?: string;
+  readonly label: string;
+  readonly value: string;
+};
+type Props = {
+  /**
+  * Color for the focused item indicator and selected checkmarks.
+  * @default "blue"
+  */
+  readonly accentColor?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Color for unselected, unfocused option labels.
+  */
+  readonly defaultColor?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Initially selected values.
+  */
+  readonly defaultValue?: ReadonlyArray<string>;
+  /**
+  * When true, all input is ignored and labels are dimmed.
+  * @default false
+  */
+  readonly isDisabled?: boolean;
+  /**
+  * Whether the parent has focus. When false, indicators are dimmed.
+  * @default true
+  */
+  readonly isFocused?: boolean;
+  /**
+  * Number of visible options before scrolling.
+  * When omitted, auto-limits to terminal height.
+  */
+  readonly limit?: number;
+  /**
+  * Fires when the set of selected values changes (space to toggle).
+  */
+  readonly onChange?: (values: ReadonlyArray<string>) => void;
+  /**
+  * Fires when the user presses Enter to submit.
+  */
+  readonly onSubmit?: (values: ReadonlyArray<string>) => void;
+  /**
+  * Available choices to pick from.
+  */
+  readonly options: ReadonlyArray<MultiSelectOption>;
+};
+/**
+* Renders a multi-choice selection list with checkboxes and keyboard navigation.
+*/
+declare function MultiSelect({
+  accentColor,
+  defaultColor,
+  defaultValue,
+  isDisabled,
+  isFocused,
+  limit: customLimit,
+  onChange,
+  onSubmit,
+  options
+}: Props): ReactElement;
+export { MultiSelect, MultiSelectOption, type Props as MultiSelectProps, Props, MultiSelect as default };

package/dist/components/multi-select.js

@@ -0,0 +1 @@
+var B=Object.defineProperty;var F=(e,i)=>B(e,"name",{value:i,configurable:!0});import{jsx as m,jsxs as D}from"react/jsx-runtime";import{useReducer as E,useState as L,useRef as a,useMemo as P,useCallback as g}from"react";import _ from"../ink/hooks/use-input.js";import q from"../ink/hooks/use-window-size.js";import{Box as O}from"./box.js";import{Text as f}from"./text.js";var z=Object.defineProperty,R=F((e,i)=>z(e,"name",{value:i,configurable:!0}),"S");const G=[],H=R((e,i)=>{switch(i.type){case"focus":return{...e,focusedIndex:i.index};case"focus-next":{const c=e.focusedIndex+1,u=c>=e.visibleFrom+i.limit;return{...e,focusedIndex:c,visibleFrom:u?e.visibleFrom+1:e.visibleFrom}}case"focus-prev":{const c=e.focusedIndex-1,u=c<e.visibleFrom;return{...e,focusedIndex:c,visibleFrom:u?e.visibleFrom-1:e.visibleFrom}}default:return e}},"multiSelectReducer");function J({accentColor:e="blue",defaultColor:i,defaultValue:c=G,isDisabled:u=!1,isFocused:v=!0,limit:C,onChange:I,onSubmit:w,options:t}){const{rows:T}=q(),l=Math.min(typeof C=="number"?C:T,t.length),[s,S]=E(H,{focusedIndex:0,visibleFrom:0}),[b,j]=L(c),y=a(b);y.current=b;const M=a(w);M.current=w;const p=a(I);p.current=I;const x=a(s);x.current=s;const V=P(()=>t.slice(s.visibleFrom,s.visibleFrom+l),[t,s.visibleFrom,l]),k=g(()=>{const r=t[x.current.focusedIndex]?.value;r&&j(o=>{const n=o.includes(r)?o.filter(d=>d!==r):[...o,r];return p.current?.(n),n})},[t]),A=g(()=>{j(r=>{const o=r.length===t.length?[]:t.map(n=>n.value);return p.current?.(o),o})},[t]);return _(g((r,o)=>{const{focusedIndex:n}=x.current;(o.downArrow||r==="j")&&n<t.length-1&&S({limit:l,type:"focus-next"}),(o.upArrow||r==="k")&&n>0&&S({limit:l,type:"focus-prev"}),r===" "&&k(),r==="a"&&A(),o.return&&M.current?.(y.current)},[t.length,l,k,A]),{isActive:!u&&v}),m(O,{flexDirection:"column",children:V.map((r,o)=>{const n=s.visibleFrom+o===s.focusedIndex,d=b.includes(r.value);let h=i;return d?h="green":n&&(h=e),D(O,{gap:1,children:[n?m(f,{color:e,dimColor:!v,children:"▸"}):m(f,{children:" "}),D(f,{color:h,dimColor:u,children:[d?"◼":"◻"," ",r.label]}),d?m(f,{color:"green",dimColor:!v,children:"✓"}):void 0]},r.key??r.value)})})}F(J,"V");R(J,"MultiSelect");export{J as MultiSelect,J as default};

package/dist/components/newline.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement } from 'react';
+type Props = {
+  /**
+  * Number of newlines to insert.
+  * @default 1
+  */
+  readonly count?: number;
+};
+/**
+* Adds one or more newline (`\n`) characters. Must be used within `<Text>` components.
+*/
+declare function Newline({
+  count
+}: Props): ReactElement;
+export { Newline, type Props as NewlineProps, Props, Newline as default };

package/dist/components/newline.js

@@ -0,0 +1,2 @@
+var n=Object.defineProperty;var t=(e,r)=>n(e,"name",{value:r,configurable:!0});import{jsx as a}from"react/jsx-runtime";var i=Object.defineProperty,o=t((e,r)=>i(e,"name",{value:r,configurable:!0}),"t");function u({count:e=1}){return a("ink-text",{children:`
+`.repeat(e)})}t(u,"r");o(u,"Newline");export{u as Newline,u as default};

package/dist/components/operation-tree.d.ts

@@ -0,0 +1,49 @@
+import { ReactNode, ReactElement } from 'react';
+type OperationStatus = "completed" | "error" | "pending" | "running" | "skipped";
+type OperationNode = {
+  /**
+  * Nested child operations rendered beneath this node.
+  */
+  readonly children?: ReadonlyArray<OperationNode>;
+  /**
+  * Optional supplementary info rendered on the next line (dimmed).
+  */
+  readonly details?: ReactNode;
+  /**
+  * Wall-clock duration in ms, displayed right-aligned.
+  */
+  readonly durationMs?: number;
+  /**
+  * Unique identifier within the tree.
+  */
+  readonly id: string;
+  /**
+  * Human-readable label.
+  */
+  readonly label: ReactNode;
+  /**
+  * Lifecycle state controlling icon + color.
+  */
+  readonly status: OperationStatus;
+};
+type Props = {
+  /**
+  * Tree of operations. Each node can have its own children.
+  */
+  readonly nodes: ReadonlyArray<OperationNode>;
+  /**
+  * When true, runs the running-spinner animation.
+  * @default true
+  */
+  readonly showSpinner?: boolean;
+};
+/**
+* Renders a tree of operations with per-node status. Perfect for agent
+* progress panels (reading → editing → running tests → done).
+* @returns A `ReactElement` rendering the nested tree of operation rows.
+*/
+declare function OperationTree({
+  nodes,
+  showSpinner
+}: Props): ReactElement;
+export { OperationNode, OperationStatus, OperationTree, type Props as OperationTreeProps, Props, OperationTree as default };

package/dist/components/operation-tree.js

@@ -0,0 +1 @@
+var w=Object.defineProperty;var s=(e,r)=>w(e,"name",{value:r,configurable:!0});import{jsx as n,jsxs as l,Fragment as y}from"react/jsx-runtime";import{Box as d}from"./box.js";import{Spinner as C}from"./spinner.js";import{Text as o}from"./text.js";var k=Object.defineProperty,a=s((e,r)=>k(e,"name",{value:r,configurable:!0}),"s");const $={completed:"green",error:"red",pending:"gray",running:"cyan",skipped:"yellow"},M={completed:"✔",error:"✖",pending:"○",skipped:"⊘"},b=a(e=>{if(e<1e3)return`${Math.round(e)}ms`;if(e<6e4)return`${(e/1e3).toFixed(1)}s`;const r=Math.round(e/1e3),i=Math.floor(r/60),t=r%60;return`${i}m ${t}s`},"formatDuration"),h=a(({isLast:e,node:r,prefix:i,showSpinner:t})=>{const p=$[r.status],m=e?"└─ ":"├─ ",f=i.length===0?"":m,u=i+(e?"   ":"│  "),g=t?n(C,{type:"dots"}):"…",x=r.status==="running"?g:M[r.status];return l(y,{children:[l(d,{children:[n(o,{dimColor:!0,children:i}),n(o,{dimColor:!0,children:f}),n(d,{flexShrink:0,children:n(o,{color:p,children:x})}),n(o,{children:" "}),n(d,{flexGrow:1,flexShrink:1,minWidth:0,children:n(o,{bold:r.status==="running",color:r.status==="pending"?"gray":void 0,dimColor:r.status==="skipped",wrap:"truncate-end",children:r.label})}),r.durationMs===void 0?void 0:n(d,{flexShrink:0,children:l(o,{dimColor:!0,children:[" ",b(r.durationMs)]})})]}),r.details===void 0?void 0:l(d,{children:[n(o,{dimColor:!0,children:u}),n(o,{dimColor:!0,children:r.details})]}),r.children?.map((c,v,S)=>n(h,{isLast:v===S.length-1,node:c,prefix:u,showSpinner:t},c.id))]})},"NodeLine");function L({nodes:e,showSpinner:r=!0}){return n(d,{flexDirection:"column",children:e.map((i,t)=>n(h,{isLast:t===e.length-1,node:i,prefix:"",showSpinner:r},i.id))})}s(L,"c");a(L,"OperationTree");export{L as OperationTree,L as default};

package/dist/components/option-list.d.ts

@@ -0,0 +1,47 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactNode, ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type OptionListEntry = {
+  readonly description?: string;
+  readonly icon?: ReactNode;
+  readonly id: string;
+  readonly label: ReactNode;
+  readonly trailing?: ReactNode;
+};
+type Props = {
+  /**
+  * Highlight color for the row marked as current.
+  */
+  readonly accentColor?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Render the list with a border.
+  */
+  readonly bordered?: boolean;
+  /**
+  * Id of the row to highlight. No visual change if omitted.
+  */
+  readonly currentId?: string;
+  /**
+  * Icon width in characters for column alignment.
+  * @default 2
+  */
+  readonly iconColumnWidth?: number;
+  /**
+  * Entries to render.
+  */
+  readonly options: ReadonlyArray<OptionListEntry>;
+};
+/**
+* Read-only presentational option list. Like `SelectInput` but without focus,
+* input handling, or scrolling — just a styled list of rows. Useful inside
+* modals, sidebars, or summary panels.
+* @returns A `ReactElement` rendering the list; bordered when requested.
+*/
+declare function OptionList({
+  accentColor,
+  bordered,
+  currentId,
+  iconColumnWidth,
+  options
+}: Props): ReactElement;
+export { OptionList, OptionListEntry, type Props as OptionListProps, Props, OptionList as default };

package/dist/components/option-list.js

@@ -0,0 +1 @@
+var m=Object.defineProperty;var d=(r,o)=>m(r,"name",{value:o,configurable:!0});import{jsx as i,jsxs as s}from"react/jsx-runtime";import{Box as n}from"./box.js";import{Text as l}from"./text.js";var p=Object.defineProperty,x=d((r,o)=>p(r,"name",{value:o,configurable:!0}),"s");function v({accentColor:r="blue",bordered:o=!1,currentId:u,iconColumnWidth:c=2,options:f}){const a=i(n,{flexDirection:"column",children:f.map(e=>{const t=e.id===u,h=t?r:void 0;return s(n,{flexDirection:"column",children:[s(n,{children:[i(n,{flexShrink:0,width:c,children:i(l,{color:h,children:e.icon??(t?"▸":" ")})}),i(n,{flexGrow:1,flexShrink:1,minWidth:0,children:i(l,{bold:t,color:h,wrap:"truncate-end",children:e.label})}),e.trailing===void 0?void 0:i(n,{flexShrink:0,children:e.trailing})]}),e.description===void 0?void 0:i(n,{marginLeft:c,children:i(l,{dimColor:!0,wrap:"truncate-end",children:e.description})})]},e.id)})});return o?i(n,{borderStyle:"round",paddingX:1,children:a}):a}d(v,"x");x(v,"OptionList");export{v as OptionList,v as default};

package/dist/components/ordered-list.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode, ReactElement } from 'react';
+type OrderedListEntry = {
+  /**
+  * Nested sub-items, rendered as a sub-list with hierarchical numbering.
+  */
+  readonly children?: ReadonlyArray<OrderedListEntry>;
+  /**
+  * Display text for this item.
+  */
+  readonly label: ReactNode;
+};
+type Props = {
+  /**
+  * Entries to render as a numbered list.
+  */
+  readonly items: ReadonlyArray<OrderedListEntry>;
+};
+/**
+* Renders a numbered list with hierarchical nesting support.
+*/
+declare function OrderedList({
+  items
+}: Props): ReactElement;
+export { OrderedList, OrderedListEntry, type Props as OrderedListProps, Props, OrderedList as default };

package/dist/components/ordered-list.js

@@ -0,0 +1 @@
+var h=Object.defineProperty;var t=(r,e)=>h(r,"name",{value:e,configurable:!0});import{jsx as i,jsxs as d}from"react/jsx-runtime";import{Box as o}from"./box.js";import{Text as s}from"./text.js";var p=Object.defineProperty,a=t((r,e)=>p(r,"name",{value:e,configurable:!0}),"o");const m=a((r,e)=>{const u=String(r.length).length;return i(o,{flexDirection:"column",children:r.map((n,l)=>{const f=`${String(l+1).padStart(u)}.`,c=`${e}${f}`;return d(o,{gap:1,children:[i(s,{dimColor:!0,children:c}),d(o,{flexDirection:"column",children:[i(s,{children:n.label}),n.children?m(n.children,c):void 0]})]},l)})})},"renderList");function x({items:r}){return m(r,"")}t(x,"c");a(x,"OrderedList");export{x as OrderedList,x as default};

package/dist/components/paginator.d.ts

@@ -0,0 +1,69 @@
+import { ReactNode, ReactElement } from 'react';
+/**
+* Metadata about the current page state, passed to the render-prop children.
+*/
+type PageMeta = {
+  readonly currentPage: number;
+  readonly endIndex: number;
+  readonly isFirstPage: boolean;
+  readonly isLastPage: boolean;
+  readonly startIndex: number;
+  readonly totalPages: number;
+};
+type Props<T> = {
+  /**
+  * Render-prop that receives the current page items and page metadata.
+  */
+  readonly children: (pageItems: ReadonlyArray<T>, meta: PageMeta) => ReactNode;
+  /**
+  * Uncontrolled initial page (0-indexed).
+  * @default 0
+  */
+  readonly defaultPage?: number;
+  /**
+  * Color for the active page indicator.
+  * @default "cyan"
+  */
+  readonly indicatorColor?: string;
+  /**
+  * Whether keyboard navigation is active.
+  * @default true
+  */
+  readonly isFocused?: boolean;
+  /**
+  * The full list of items to paginate.
+  */
+  readonly items: ReadonlyArray<T>;
+  /**
+  * Called when the page changes.
+  */
+  readonly onChange?: (page: number) => void;
+  /**
+  * Controlled current page (0-indexed). When provided, the component is controlled.
+  */
+  readonly page?: number;
+  /**
+  * Number of items per page.
+  */
+  readonly pageSize: number;
+  /**
+  * Indicator style.
+  * - `"dots"`: `● ○ ○ ○`
+  * - `"numeric"`: `‹ 1 / 4 ›`
+  * - `"fraction"`: `1/4`
+  * @default "dots"
+  */
+  readonly style?: "dots" | "fraction" | "numeric";
+};
+declare const Paginator: <T>({
+  children,
+  defaultPage,
+  indicatorColor,
+  isFocused,
+  items,
+  onChange,
+  page: controlledPage,
+  pageSize,
+  style
+}: Props<T>) => ReactElement;
+export { PageMeta, Paginator, type Props as PaginatorProps, Props, Paginator as default };

package/dist/components/paginator.js

@@ -0,0 +1 @@
+var F=Object.defineProperty;var C=(e,r)=>F(e,"name",{value:r,configurable:!0});import{jsxs as m,jsx as o}from"react/jsx-runtime";import{useState as B,useCallback as M}from"react";import S from"../ink/hooks/use-input.js";import{Box as x}from"./box.js";import{Text as t}from"./text.js";var T=Object.defineProperty,v=C((e,r)=>T(e,"name",{value:r,configurable:!0}),"f");const $=v(({color:e,currentPage:r,style:u,totalPages:c})=>{if(u==="fraction")return m(t,{children:[o(t,{color:e,children:r+1}),m(t,{dimColor:!0,children:["/",c]})]});if(u==="numeric"){const s=r>0?o(t,{color:e,children:"‹ "}):o(t,{dimColor:!0,children:"‹ "}),a=r<c-1?o(t,{color:e,children:" ›"}):o(t,{dimColor:!0,children:" ›"});return m(x,{children:[s,o(t,{color:e,children:r+1}),m(t,{dimColor:!0,children:[" ","/",c]}),a]})}const d=Array.from({length:c},(s,a)=>a===r?o(t,{color:e,children:"●"},a):o(t,{dimColor:!0,children:"○"},a));return o(x,{gap:1,children:d})},"Indicator"),q=v(({children:e,defaultPage:r=0,indicatorColor:u="cyan",isFocused:c=!0,items:d,onChange:s,page:a,pageSize:g,style:A="dots"})=>{const f=a!==void 0,[b,w]=B(r),I=f?a:b,n=Math.max(1,Math.ceil(d.length/g)),l=Math.max(0,Math.min(I,n-1)),h=M(y=>{const i=Math.max(0,Math.min(y,n-1));f||w(i),s?.(i)},[n,f,s]);S(M((y,i)=>{i.leftArrow||i.pageUp?h(l-1):i.rightArrow||i.pageDown?h(l+1):i.home?h(0):i.end&&h(n-1)},[l,n,h]),{isActive:c});const p=l*g,P=Math.min(p+g,d.length),j=d.slice(p,P),D={currentPage:l,endIndex:P,isFirstPage:l===0,isLastPage:l===n-1,startIndex:p,totalPages:n};return m(x,{flexDirection:"column",children:[e(j,D),n>1&&o($,{color:u,currentPage:l,style:A,totalPages:n})]})},"Paginator");export{q as Paginator,q as default};

package/dist/components/paragraph.d.ts

@@ -0,0 +1,38 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactNode, ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type Props = {
+  /**
+  * Paragraph body.
+  */
+  readonly children: ReactNode;
+  /**
+  * Foreground color.
+  */
+  readonly color?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Render the paragraph with dim color.
+  */
+  readonly dimColor?: boolean;
+  /**
+  * Blank lines to add after the paragraph.
+  * @default 1
+  */
+  readonly marginBottom?: number;
+  /**
+  * Blank lines to add before the paragraph.
+  * @default 0
+  */
+  readonly marginTop?: number;
+};
+/**
+* Wraps body text with a trailing blank line. Useful for README-style layouts.
+*/
+declare function Paragraph({
+  children,
+  color,
+  dimColor,
+  marginBottom,
+  marginTop
+}: Props): ReactElement;
+export { Paragraph, type Props as ParagraphProps, Props, Paragraph as default };

package/dist/components/paragraph.js

@@ -0,0 +1 @@
+var t=Object.defineProperty;var a=(r,o)=>t(r,"name",{value:o,configurable:!0});import{jsx as e}from"react/jsx-runtime";import{Box as l}from"./box.js";import{Text as c}from"./text.js";var f=Object.defineProperty,p=a((r,o)=>f(r,"name",{value:o,configurable:!0}),"e");function d({children:r,color:o,dimColor:i=!1,marginBottom:m=1,marginTop:n=0}){return e(l,{flexDirection:"column",marginBottom:m,marginTop:n,children:e(c,{color:o,dimColor:i,children:r})})}a(d,"a");p(d,"Paragraph");export{d as Paragraph,d as default};

package/dist/components/placeholder.d.ts

@@ -0,0 +1,55 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type Props = {
+  /**
+  * Whether to pulse the skeleton blocks (shimmer).
+  * @default true
+  */
+  readonly animated?: boolean;
+  /**
+  * Glyph repeated to fill each placeholder block.
+  * @default "█" (full block)
+  */
+  readonly character?: string;
+  /**
+  * Block color.
+  * @default "gray"
+  */
+  readonly color?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Milliseconds between pulses.
+  * @default 500
+  */
+  readonly interval?: number;
+  /**
+  * Number of skeleton rows to render.
+  * @default 3
+  */
+  readonly rows?: number;
+  /**
+  * Total width reference. When omitted, the block flexes to fill its
+  * parent.
+  */
+  readonly width?: number;
+  /**
+  * Relative widths of each row (0–1). The list is sampled cyclically.
+  * @default [1, 0.85, 0.6]
+  */
+  readonly widths?: ReadonlyArray<number>;
+};
+/**
+* Skeleton loading indicator. Renders a stack of solid blocks whose widths
+* vary to mimic text placeholders. Pair with `async` data fetching.
+* @returns A `ReactElement` rendering the skeleton rows.
+*/
+declare function Placeholder({
+  animated,
+  character,
+  color,
+  interval,
+  rows,
+  width,
+  widths
+}: Props): ReactElement;
+export { Placeholder, type Props as PlaceholderProps, Props, Placeholder as default };

package/dist/components/placeholder.js

@@ -0,0 +1 @@
+var v=Object.defineProperty;var o=(r,t)=>v(r,"name",{value:t,configurable:!0});import{jsx as a}from"react/jsx-runtime";import g from"../ink/hooks/use-animation.js";import y from"../ink/hooks/use-window-size.js";import{Box as c}from"./box.js";import{Text as b}from"./text.js";var A=Object.defineProperty,M=o((r,t)=>A(r,"name",{value:t,configurable:!0}),"l");const P=[1,.85,.6];function j({animated:r=!0,character:t="█",color:m="gray",interval:h=500,rows:d=3,width:n,widths:e=P}){const{frame:f}=g({interval:h,isActive:r}),{columns:s}=y(),u=r&&f%2===0,p=n??Math.max(1,s);return a(c,{flexDirection:"column",width:n,children:Array.from({length:d},(T,i)=>{const x=e.length>0?e[i%e.length]??1:1,l=Math.max(1,Math.round(p*x)),w=t.repeat(l);return a(c,{width:l,children:a(b,{color:m,dimColor:u,wrap:"truncate-end",children:w})},i)})})}o(j,"s");M(j,"Placeholder");export{j as Placeholder,j as default};

package/dist/components/progress-bar.d.ts

@@ -0,0 +1,55 @@
+import { ReactElement } from 'react';
+import { Props as Props$1 } from "./text.js";
+import "../packem_shared/index.server.d-eZWyC2Ku.js";
+import 'type-fest';
+import "../packem_shared/styles.d-CLJdt-kg.js";
+import 'yoga-layout';
+type Props = {
+  /** Fill glyph repeated across the completed portion of the progress bar. Defaults to "█". */
+  readonly character?: string;
+  /**
+  * Override the terminal width used for calculation.
+  * When 0, uses the actual terminal width.
+  * @default 0
+  */
+  readonly columns?: number;
+  /**
+  * Number of columns reserved on the left side (e.g. for labels).
+  * @default 0
+  */
+  readonly left?: number;
+  /**
+  * Completion percentage between 0 and 1.
+  * @default 1
+  */
+  readonly percent?: number;
+  /**
+  * Number of columns reserved on the right side (e.g. for percentage text).
+  * @default 0
+  */
+  readonly right?: number;
+  /**
+  * Whether to pad the remaining space with whitespace.
+  * Useful when rendering the bar over a background color.
+  * @default false
+  */
+  readonly rightPad?: boolean;
+} & Omit<Props$1, "children">;
+/**
+* A terminal progress bar that fills proportionally to a percentage value.
+*
+* ```tsx
+* &lt;ProgressBar percent={0.5} />
+* &lt;ProgressBar percent={0.75} color="green" left={10} right={5} />
+* ```
+*/
+declare function ProgressBar({
+  character,
+  columns: columnsProp,
+  left,
+  percent,
+  right,
+  rightPad,
+  ...textProps
+}: Props): ReactElement;
+export { ProgressBar, type Props as ProgressBarProps, Props, ProgressBar as default };

package/dist/components/progress-bar.js

@@ -0,0 +1 @@
+var l=Object.defineProperty;var e=(r,a)=>l(r,"name",{value:a,configurable:!0});import{jsx as u}from"react/jsx-runtime";import p from"../ink/hooks/use-window-size.js";import{Text as d}from"./text.js";var g=Object.defineProperty,x=e((r,a)=>g(r,"name",{value:a,configurable:!0}),"n");function M({character:r="█",columns:a=0,left:n=0,percent:m=1,right:i=0,rightPad:s=!1,...c}){const{columns:f}=p(),t=Math.max(0,(a||f||80)-i-n),o=Math.min(Math.floor(t*Math.max(0,Math.min(1,m))),t),h=r.repeat(o)+(s?" ".repeat(t-o):"");return u(d,{...c,children:h})}e(M,"a");x(M,"ProgressBar");export{M as ProgressBar,M as default};

package/dist/components/radio-group.d.ts

@@ -0,0 +1,74 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type RadioOption = {
+  readonly description?: string;
+  readonly key?: string;
+  readonly label: string;
+  readonly value: string;
+};
+type Props = {
+  /**
+  * Accent color for the focused and selected indicator.
+  * @default "blue"
+  */
+  readonly accentColor?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Auto-focus when mounted.
+  */
+  readonly autoFocus?: boolean;
+  /**
+  * When true, moving focus with arrow keys immediately updates the selected
+  * value (and fires `onChange`). When false, focus moves independently and
+  * selection commits only on Space or Enter.
+  * @default true
+  */
+  readonly commitOnNavigate?: boolean;
+  /**
+  * Initial selected value when uncontrolled.
+  */
+  readonly defaultValue?: string;
+  /**
+  * Disable input and dim labels.
+  */
+  readonly isDisabled?: boolean;
+  /**
+  * Called when selection changes.
+  */
+  readonly onChange?: (value: string) => void;
+  /**
+  * Called when the user submits by pressing Enter.
+  */
+  readonly onSubmit?: (value: string) => void;
+  /**
+  * Available options.
+  */
+  readonly options: ReadonlyArray<RadioOption>;
+  /**
+  * Orientation of options.
+  * @default "vertical"
+  */
+  readonly orientation?: "horizontal" | "vertical";
+  /**
+  * Controlled selected value.
+  */
+  readonly value?: string;
+};
+/**
+* Single-choice radio group with keyboard navigation. By default, navigation
+* commits selection; set `commitOnNavigate={false}` to require an explicit
+* Space/Enter commit.
+*/
+declare function RadioGroup({
+  accentColor,
+  autoFocus,
+  commitOnNavigate,
+  defaultValue,
+  isDisabled,
+  onChange,
+  onSubmit,
+  options,
+  orientation,
+  value
+}: Props): ReactElement;
+export { Props, RadioGroup, type Props as RadioGroupProps, RadioOption, RadioGroup as default };

package/dist/components/radio-group.js

@@ -0,0 +1 @@
+var B=Object.defineProperty;var A=(i,e)=>B(i,"name",{value:e,configurable:!0});import{jsx as x,jsxs as D}from"react/jsx-runtime";import{useState as M,useRef as G,useCallback as R}from"react";import I from"../ink/hooks/use-focus.js";import O from"../ink/hooks/use-input.js";import{Box as k}from"./box.js";import{Text as y}from"./text.js";var T=Object.defineProperty,S=A((i,e)=>T(i,"name",{value:e,configurable:!0}),"A");const N=S((i,e)=>{if(e===void 0)return 0;const c=i.findIndex(b=>b.value===e);return Math.max(c,0)},"initialFocusIndex");function P({accentColor:i="blue",autoFocus:e=!1,commitOnNavigate:c=!0,defaultValue:b,isDisabled:v=!1,onChange:C,onSubmit:j,options:t,orientation:a="vertical",value:f}){const{isFocused:s}=I({autoFocus:e,isActive:!v}),[g,z]=M(b??t[0]?.value),m=f??g,[w,F]=M(()=>N(t,m)),l=G(w);l.current=w;const d=R(r=>{const o=t[r];if(!o)return;const u=f??g;o.value!==u&&(f===void 0&&z(o.value),C?.(o.value))},[t,f,g,C]);return O(R((r,o)=>{if(!s)return;const u=t.length;if(u===0)return;const p=o.downArrow&&a==="vertical"||o.rightArrow&&a==="horizontal"||r==="j",h=o.upArrow&&a==="vertical"||o.leftArrow&&a==="horizontal"||r==="k";if(p){const n=Math.min(u-1,l.current+1);F(n),c&&d(n);return}if(h){const n=Math.max(0,l.current-1);F(n),c&&d(n);return}if(r===" "){d(l.current);return}if(o.return){c||d(l.current);const n=t[l.current]?.value??m;n!==void 0&&j?.(n)}},[s,t,a,d,c,m,j]),{isActive:!v&&s}),x(k,{flexDirection:a==="vertical"?"column":"row",gap:a==="vertical"?0:2,children:t.map((r,o)=>{const u=r.value===m,p=s&&o===w,h=(u||p)&&s?i:void 0;return D(k,{gap:1,children:[x(y,{color:h,dimColor:v,children:u?"●":"○"}),x(y,{bold:p,color:h,dimColor:v,children:r.label}),r.description===void 0?void 0:x(y,{dimColor:!0,children:r.description})]},r.key??r.value)})})}A(P,"T");S(P,"RadioGroup");export{P as RadioGroup,P as default};

package/dist/components/scatter-plot.d.ts

@@ -0,0 +1,35 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+import { LineSeries } from "./line-chart.js";
+import "../packem_shared/buffer.d-EJkZr8uH.js";
+type Props = {
+  readonly axisColor?: LiteralUnion<AnsiColors, string>;
+  readonly height?: number;
+  readonly maxX?: number;
+  readonly maxY?: number;
+  readonly minX?: number;
+  readonly minY?: number;
+  readonly palette?: ReadonlyArray<LiteralUnion<AnsiColors, string>>;
+  readonly series: ReadonlyArray<LineSeries>;
+  readonly showLegend?: boolean;
+  readonly width?: number;
+};
+/**
+* Scatter plot rendered on a braille pixel grid. Each sample lights one
+* sub-cell pixel; overlapping points merge into denser braille glyphs.
+* @returns A `ReactElement` containing the plot and an optional legend.
+*/
+declare function ScatterPlot({
+  axisColor,
+  height,
+  maxX,
+  maxY,
+  minX,
+  minY,
+  palette,
+  series,
+  showLegend,
+  width
+}: Props): ReactElement;
+export { Props, ScatterPlot, type Props as ScatterPlotProps, ScatterPlot as default };

package/dist/components/scatter-plot.js

@@ -0,0 +1 @@
+var h=Object.defineProperty;var s=(r,i)=>h(r,"name",{value:i,configurable:!0});import{jsxs as N,jsx as n}from"react/jsx-runtime";import{useMemo as E}from"react";import{Box as d}from"./box.js";import{Canvas as b}from"./canvas.js";import{t as g,p as S,D as v,c as P,d as y}from"../packem_shared/line-chart-kf7uhR0K.js";import{Text as T}from"./text.js";var C=Object.defineProperty,Y=s((r,i)=>C(r,"name",{value:i,configurable:!0}),"f");const _=v;function w({axisColor:r="gray",height:i=10,maxX:m,maxY:x,minX:c,minY:l,palette:o=_,series:I,showLegend:M=!0,width:p=40}){const u=E(()=>{const t=I.map((a,f)=>({color:S(a,f,o),points:g(a.data),series:a})),e=P(t);return{axisColor:r,palette:o,seriesList:t,xMax:m??(e.xMax===Number.NEGATIVE_INFINITY?1:e.xMax),xMin:c??(e.xMin===Number.POSITIVE_INFINITY?0:e.xMin),yMax:x??(e.yMax===Number.NEGATIVE_INFINITY?1:e.yMax),yMin:l??(e.yMin===Number.POSITIVE_INFINITY?0:e.yMin)}},[I,r,o,c,m,l,x]);return N(d,{flexDirection:"column",children:[n(b,{draw:s(t=>{y(t,"scatter",u)},"draw"),height:i,version:[I,p,i,c,m,l,x,r,o],width:p}),M?n(d,{gap:2,marginTop:1,children:u.seriesList.map(({color:t,series:e},a)=>N(d,{gap:1,children:[n(T,{color:t,children:"●"}),n(T,{children:e.label??`Series ${a+1}`})]},`${a}:${e.label??""}`))}):void 0]})}s(w,"I");Y(w,"ScatterPlot");export{w as ScatterPlot,w as default};

package/dist/components/scroll-bar-box.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import { BoxProps as Props } from "./box.js";
+import 'type-fest';
+import "../packem_shared/dom.d-DgP_exKU.js";
+import 'yoga-layout';
+import "../packem_shared/cursor-helpers.d-BONB9tky.js";
+import "../packem_shared/styles.d-CLJdt-kg.js";
+import "../packem_shared/index.server.d-eZWyC2Ku.js";
+interface ScrollBarBoxProps extends Props {
+  children?: React.ReactNode;
+  contentHeight: number;
+  scrollBarAutoHide?: boolean;
+  scrollBarPosition?: "left" | "right";
+  scrollOffset: number;
+  thumbChar?: string;
+  viewportHeight: number;
+}
+declare const ScrollBarBox: ({
+  borderColor,
+  borderDimColor,
+  borderLeftColor,
+  borderLeftDimColor,
+  borderRightColor,
+  borderRightDimColor,
+  borderStyle,
+  children,
+  contentHeight,
+  height,
+  scrollBarAutoHide,
+  scrollBarPosition,
+  scrollOffset,
+  thumbChar,
+  viewportHeight,
+  ...boxProps
+}: ScrollBarBoxProps) => React.JSX.Element;
+export { ScrollBarBox, type ScrollBarBoxProps };

package/dist/components/scroll-bar-box.js

@@ -0,0 +1 @@
+import{ScrollBarBox as l}from"../packem_shared/ScrollBarBox-DwiCxilX.js";export{l as ScrollBarBox};

package/dist/components/scroll-bar.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { BoxProps as Props } from "./box.js";
+import 'type-fest';
+import "../packem_shared/dom.d-DgP_exKU.js";
+import 'yoga-layout';
+import "../packem_shared/cursor-helpers.d-BONB9tky.js";
+import "../packem_shared/styles.d-CLJdt-kg.js";
+import "../packem_shared/index.server.d-eZWyC2Ku.js";
+type ScrollBarPlacement = "inset" | "left" | "right";
+type ScrollBarStyle = Props["borderStyle"] | "block" | "line" | "thick" | "dots";
+interface ScrollBarProps {
+  autoHide?: boolean;
+  color?: string;
+  contentHeight: number;
+  dimColor?: boolean;
+  placement?: ScrollBarPlacement;
+  scrollOffset: number;
+  style?: ScrollBarStyle;
+  thumbChar?: string;
+  trackChar?: string;
+  viewportHeight: number;
+}
+declare const ScrollBar: React.FC<ScrollBarProps>;
+export { ScrollBar, type ScrollBarPlacement, type ScrollBarProps, type ScrollBarStyle };

package/dist/components/scroll-bar.js

@@ -0,0 +1 @@
+import{ScrollBar as l}from"../packem_shared/ScrollBar-U_37hlIT.js";export{l as ScrollBar};