@visulima/tui-kit 0.0.0 → 1.0.1

package/dist/time-picker.d.ts

@@ -0,0 +1,57 @@
+import { AnsiColors } from '@visulima/colorize';
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type TimeValue = {
+  readonly hours: number;
+  readonly minutes: number;
+  readonly seconds?: number;
+};
+type Props = {
+  /**
+   * Accent color for the focused segment.
+   * @default "blue"
+   */
+  readonly accentColor?: LiteralUnion<AnsiColors, string>;
+  /**
+   * Auto-focus on mount.
+   */
+  readonly autoFocus?: boolean;
+  /**
+   * Initial value when uncontrolled.
+   * @default { hours: 0, minutes: 0 }
+   */
+  readonly defaultValue?: TimeValue;
+  /**
+   * Use a 12-hour clock with an AM/PM segment instead of 24-hour.
+   * @default false
+   */
+  readonly hour12?: boolean;
+  /**
+   * Disable input and dim the display.
+   */
+  readonly isDisabled?: boolean;
+  /**
+   * Fires whenever any segment changes.
+   */
+  readonly onChange?: (value: TimeValue) => void;
+  /**
+   * Fires on Enter.
+   */
+  readonly onSubmit?: (value: TimeValue) => void;
+  /**
+   * Show a seconds segment.
+   * @default false
+   */
+  readonly showSeconds?: boolean;
+  /**
+   * Controlled value. When provided, `defaultValue` is ignored.
+   */
+  readonly value?: TimeValue;
+};
+/**
+ * A keyboard-driven time input with independent hour/minute (and optional
+ * second) segments. ←/→ move between segments, ↑/↓ adjust the focused segment
+ * (wrapping), digits type directly, and Enter submits.
+ */
+declare function TimePicker({ accentColor, autoFocus, defaultValue, hour12, isDisabled, onChange, onSubmit, showSeconds, value: controlledValue }: Props): ReactElement;
+export { Props, TimePicker, type Props as TimePickerProps, TimeValue, TimePicker as default };

package/dist/time-picker.js

@@ -0,0 +1 @@
+import{jsxs as R,jsx as c,Fragment as W}from"react/jsx-runtime";import T from"@visulima/tui/components/box";import f from"@visulima/tui/components/text";import _ from"@visulima/tui/hooks/use-focus";import z from"@visulima/tui/hooks/use-input";import{useState as V,useRef as X,useCallback as A}from"react";const I=/^\d$/,K={hours:0,minutes:0};function m(a,d){return d===0?0:(a%d+d)%d}const w=a=>String(a).padStart(2,"0");function oe({accentColor:a="blue",autoFocus:d=!1,defaultValue:q=K,hour12:n=!1,isDisabled:h=!1,onChange:k,onSubmit:x,showSeconds:F=!1,value:j}){const{isFocused:g}=_({autoFocus:d,isActive:!h}),M=j!==void 0,[y,B]=V(q),e=j??y,p=["hours","minutes",...F?["seconds"]:[],...n?["ampm"]:[]],[E,$]=V(0),i=p[Math.min(E,p.length-1)],D=X(k);D.current=k;const t=X(null),u=A(r=>{M||B(r),D.current?.(r)},[M]),S=A((r,o)=>{switch(r){case"hours":{u({...e,hours:m(e.hours+o,24)});break}case"minutes":{u({...e,minutes:m(e.minutes+o,60)});break}case"seconds":{u({...e,seconds:m((e.seconds??0)+o,60)});break}default:u({...e,hours:m(e.hours+12,24)})}},[e,u]),L=A((r,o)=>{const s=t.current,N=s!==null&&s.segment===r;if(r==="minutes"||r==="seconds"){let l=N?s.value*10+o:o;l>59&&(l=o),t.current={segment:r,value:l},u(r==="minutes"?{...e,minutes:l}:{...e,seconds:l});return}const Q=n?12:23;let v=N?s.value*10+o:o;if(v>Q&&(v=o),t.current={segment:r,value:v},n){const l=e.hours>=12;u({...e,hours:v%12+(l?12:0)})}else u({...e,hours:v})},[e,n,u]),G=A((r,o)=>{if(o.leftArrow){t.current=null,$(s=>m(s-1,p.length));return}if(o.rightArrow){t.current=null,$(s=>m(s+1,p.length));return}if(o.upArrow){t.current=null,S(i,1);return}if(o.downArrow){t.current=null,S(i,-1);return}if(o.return){x?.(e);return}if(I.test(r)){i!=="ampm"&&L(i,Number.parseInt(r,10));return}(r==="a"||r==="p")&&n&&(t.current=null,e.hours>=12!=(r==="p")&&u({...e,hours:m(e.hours+12,24)}))},[S,L,e,i,n,x,p.length,u]);z(G,{isActive:g&&!h});const H=e.hours%12===0?12:e.hours%12,J=n?H:e.hours,P=e.hours>=12?"PM":"AM";function b(r){return g&&i===r?a:void 0}function C(r){return g&&i===r}return R(T,{borderColor:g?a:void 0,borderStyle:"round",paddingX:1,children:[c(f,{color:b("hours"),dimColor:h,inverse:C("hours"),children:w(J)}),c(f,{dimColor:!0,children:":"}),c(f,{color:b("minutes"),dimColor:h,inverse:C("minutes"),children:w(e.minutes)}),F?R(W,{children:[c(f,{dimColor:!0,children:":"}),c(f,{color:b("seconds"),dimColor:h,inverse:C("seconds"),children:w(e.seconds??0)})]}):void 0,n?c(T,{marginLeft:1,children:c(f,{color:b("ampm"),dimColor:h,inverse:C("ampm"),children:P})}):void 0]})}export{oe as TimePicker,oe as default};

package/dist/timer.d.ts

@@ -0,0 +1,50 @@
+import { UseTimerResult } from '@visulima/tui/hooks/use-timer';
+import { Ref, ReactElement } from 'react';
+type TimerRef = Omit<UseTimerResult, "isFinished" | "isRunning" | "remaining">;
+type Props = {
+  /**
+   * Whether to start the timer immediately.
+   * @default false
+   */
+  readonly autoStart?: boolean;
+  /**
+   * Make the rendered text bold.
+   */
+  readonly bold?: boolean;
+  /**
+   * Text color for the rendered time.
+   */
+  readonly color?: string;
+  /**
+   * Total countdown duration in milliseconds.
+   */
+  readonly duration: number;
+  /**
+   * Custom formatter for the remaining time.
+   * Receives remaining milliseconds, returns a display string.
+   * @default formatDuration (MM:SS or HH:MM:SS)
+   */
+  readonly format?: (remaining: number) => string;
+  /**
+   * Tick interval in milliseconds.
+   * @default 1000
+   */
+  readonly interval?: number;
+  /**
+   * Called once when the timer reaches zero.
+   */
+  readonly onTimeout?: () => void;
+  readonly ref?: Ref<TimerRef>;
+};
+/**
+ * A countdown timer component.
+ *
+ * Exposes `start`, `stop`, `toggle`, and `reset` methods via ref.
+ *
+ * ```tsx
+ * const ref = useRef&lt;TimerRef>(null);
+ * &lt;Timer ref={ref} duration={60_000} autoStart />
+ * ```
+ */
+declare const Timer: ({ autoStart, bold, color, duration, format, interval, onTimeout, ref }: Props) => ReactElement;
+export { Props, Timer, type Props as TimerProps, TimerRef, Timer as default };

package/dist/timer.js

@@ -0,0 +1 @@
+import{jsx as l}from"react/jsx-runtime";import u from"@visulima/tui/components/text";import p from"@visulima/tui/hooks/use-timer";import{formatDuration as f}from"@visulima/tui/utils";import{useImperativeHandle as d}from"react";const x=({autoStart:o,bold:r,color:e,duration:a,format:i=f,interval:m,onTimeout:s,ref:n})=>{const t=p({autoStart:o,duration:a,interval:m,onTimeout:s});return d(n,()=>({reset:t.reset,start:t.start,stop:t.stop,toggle:t.toggle}),[t.reset,t.start,t.stop,t.toggle]),l(u,{bold:r,color:e,children:i(t.remaining)})};export{x as Timer,x as default};

package/dist/toast.d.ts

@@ -0,0 +1,41 @@
+import { ReactNode, ReactElement } from 'react';
+import { V as Variant } from "./packem_shared/variant-config.d-D5NnrrQK.js";
+type ToastVariant = Variant;
+type Props = {
+  /**
+   * Toast body.
+   */
+  readonly children: ReactNode;
+  /**
+   * Milliseconds to display before auto-dismissing. Use `0` to disable.
+   * @default 4000
+   */
+  readonly duration?: number;
+  /**
+   * Called after the toast dismisses itself.
+   */
+  readonly onDismiss?: () => void;
+  /**
+   * Optional title rendered before the body.
+   */
+  readonly title?: string;
+  /**
+   * Visual variant determining the icon and border color.
+   * @default "info"
+   */
+  readonly variant?: ToastVariant;
+  /**
+   * Manually control visibility. When provided, `duration` is ignored.
+   */
+  readonly visible?: boolean;
+  /**
+   * Optional width override.
+   */
+  readonly width?: number;
+};
+/**
+ * Ephemeral notification. Disappears automatically after `duration` ms.
+ * @returns A bordered `ReactElement` while visible; `null` once dismissed.
+ */
+declare function Toast({ children, duration, onDismiss, title, variant, visible, width }: Props): ReactElement | null;
+export { Props, Toast, type Props as ToastProps, ToastVariant, Toast as default };

package/dist/toast.js

@@ -0,0 +1 @@
+import{jsxs as s,jsx as t}from"react/jsx-runtime";import u from"@visulima/tui/components/box";import i from"@visulima/tui/components/text";import{useState as v,useRef as T,useEffect as w}from"react";import{o as g}from"./packem_shared/variant-config-BJqpNo7H.js";function E({children:f,duration:r=4e3,onDismiss:n,title:l,variant:m="info",visible:o,width:a}){const[p,h]=v(!0),e=o??p,d=T(n);if(d.current=n,w(()=>{if(o!==void 0||r<=0||!e)return;const b=setTimeout(()=>{h(!1),d.current?.()},r);return()=>{clearTimeout(b)}},[r,o,e]),!e)return null;const{color:c,icon:x}=g[m];return s(u,{borderColor:c,borderStyle:"round",gap:1,paddingX:1,width:a,children:[t(i,{color:c,children:x}),s(u,{flexDirection:"column",flexGrow:1,children:[l===void 0?void 0:t(i,{bold:!0,children:l}),t(i,{children:f})]})]})}export{E as Toast,E as default};

package/dist/token-usage.d.ts

@@ -0,0 +1,43 @@
+import { AnsiColors } from '@visulima/colorize';
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type Color = LiteralUnion<AnsiColors, string>;
+type Props = {
+  /**
+   * Width of the input/output ratio bar in cells.
+   * @default 20
+   */
+  readonly barWidth?: number;
+  /**
+   * Optional context-window size. When set, a `used / limit (pct%)` summary
+   * and a fill bar are shown instead of the input/output split.
+   */
+  readonly contextLimit?: number;
+  /**
+   * Number of input (prompt) tokens.
+   * @default 0
+   */
+  readonly input?: number;
+  /**
+   * Color for the input segment.
+   * @default "cyan"
+   */
+  readonly inputColor?: Color;
+  /**
+   * Number of output (completion) tokens.
+   * @default 0
+   */
+  readonly output?: number;
+  /**
+   * Color for the output segment.
+   * @default "magenta"
+   */
+  readonly outputColor?: Color;
+};
+/**
+ * A compact token-usage readout. By default it shows input vs output counts
+ * with a proportional two-color bar; when `contextLimit` is set, it instead
+ * shows how much of the context window is used.
+ */
+declare function TokenUsage({ barWidth, contextLimit, input, inputColor, output, outputColor }: Props): ReactElement;
+export { Props, TokenUsage, type Props as TokenUsageProps, TokenUsage as default };

package/dist/token-usage.js

@@ -0,0 +1 @@
+import{jsxs as c,jsx as e}from"react/jsx-runtime";import l from"@visulima/tui/components/box";import t from"@visulima/tui/components/text";function f(r){return r>.9?"red":r>.7?"yellow":"green"}const o=r=>r>=1e6?`${(r/1e6).toFixed(1)}M`:r>=1e3?`${(r/1e3).toFixed(1)}k`:String(r);function $({barWidth:r=20,contextLimit:i,input:d=0,inputColor:h="cyan",output:u=0,outputColor:m="magenta"}){const n=d+u;if(i!==void 0&&i>0){const a=Math.min(1,n/i),s=Math.round(a*r),M=f(a);return c(l,{gap:1,children:[e(t,{color:M,children:"█".repeat(s)}),e(t,{dimColor:!0,children:"░".repeat(Math.max(0,r-s))}),c(t,{children:[o(n),"/",o(i)," ","(",Math.round(a*100),"%)"]})]})}const p=n===0?0:Math.round(d/n*r),x=Math.max(0,r-p);return c(l,{gap:1,children:[c(l,{children:[e(t,{color:h,children:"█".repeat(p)}),e(t,{color:m,children:"█".repeat(x)})]}),e(t,{color:h,children:`↑${o(d)}`}),e(t,{color:m,children:`↓${o(u)}`}),e(t,{dimColor:!0,children:`Σ${o(n)}`})]})}export{$ as TokenUsage,$ as default};

package/dist/tool-call.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode, ReactElement } from 'react';
+type ToolCallStatus = "error" | "pending" | "running" | "success";
+type Props = {
+  /**
+   * The tool arguments. Objects are shown as compact `key=value` pairs;
+   * strings are shown verbatim.
+   */
+  readonly args?: Record<string, unknown> | string;
+  /**
+   * Rendered output/result of the call, shown indented beneath the header.
+   */
+  readonly children?: ReactNode;
+  /**
+   * The tool name.
+   */
+  readonly name: string;
+  /**
+   * Call status, driving the icon and color.
+   * @default "pending"
+   */
+  readonly status?: ToolCallStatus;
+};
+/**
+ * A single tool invocation: a status icon, the tool name, its arguments as
+ * compact `key=value` pairs, and any result rendered as indented children.
+ */
+declare function ToolCall({ args, children, name, status }: Props): ReactElement;
+export { Props, ToolCall, type Props as ToolCallProps, ToolCallStatus, ToolCall as default };

package/dist/tool-call.js

@@ -0,0 +1 @@
+import{jsxs as d,jsx as i}from"react/jsx-runtime";import c from"@visulima/tui/components/box";import e from"@visulima/tui/components/text";const a={error:{color:"red",icon:"✖"},pending:{color:"gray",icon:"○"},running:{color:"yellow",icon:"◐"},success:{color:"green",icon:"✔"}},g=o=>o===void 0?"":typeof o=="string"?o:Object.entries(o).map(([n,r])=>`${n}=${typeof r=="string"?r:JSON.stringify(r)}`).join(" ");function u({args:o,children:n,name:r,status:s="pending"}){const l=a[s],t=g(o);return d(c,{flexDirection:"column",children:[d(c,{gap:1,children:[i(e,{color:l.color,children:l.icon}),i(e,{bold:!0,children:r}),t.length>0?i(e,{dimColor:!0,children:t}):void 0]}),n===void 0?void 0:i(c,{marginLeft:2,children:i(e,{dimColor:!0,children:n})})]})}export{u as ToolCall,u as default};

package/dist/tooltip.d.ts

@@ -0,0 +1,37 @@
+import { AnsiColors } from '@visulima/colorize';
+import { ReactNode, ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type TooltipPlacement = "bottom" | "left" | "right" | "top";
+type Props = {
+  /**
+   * The element the tooltip is attached to.
+   */
+  readonly children: ReactNode;
+  /**
+   * Border color.
+   * @default "gray"
+   */
+  readonly color?: LiteralUnion<AnsiColors, string>;
+  /**
+   * Tooltip body content.
+   */
+  readonly content: ReactNode;
+  /**
+   * Controls whether the tooltip is rendered.
+   * @default true
+   */
+  readonly isVisible?: boolean;
+  /**
+   * Relative position. Terminal rendering does not support floating layers,
+   * so the tooltip is placed inline next to (or above / below) the anchor.
+   * @default "right"
+   */
+  readonly placement?: TooltipPlacement;
+};
+/**
+ * Renders supplementary text next to an anchor. Because terminals don't have
+ * a floating-layer concept, the tooltip lives inline in the layout. Hide it
+ * by toggling `isVisible`.
+ */
+declare function Tooltip({ children, color, content, isVisible, placement }: Props): ReactElement;
+export { Props, Tooltip, TooltipPlacement, type Props as TooltipProps, Tooltip as default };

package/dist/tooltip.js

@@ -0,0 +1 @@
+import{jsx as i,jsxs as s}from"react/jsx-runtime";import o from"@visulima/tui/components/box";import m from"@visulima/tui/components/text";const a={bottom:{flexDirection:"column",orderFirst:!1},left:{flexDirection:"row",orderFirst:!0},right:{flexDirection:"row",orderFirst:!1},top:{flexDirection:"column",orderFirst:!0}};function x({children:c,color:t="gray",content:r,isVisible:d=!0,placement:e="right"}){const{flexDirection:f,orderFirst:n}=a[e],l=d?i(o,{borderColor:t,borderStyle:"round",flexShrink:0,marginLeft:e==="right"?1:0,marginRight:e==="left"?1:0,paddingX:1,children:typeof r=="string"?i(m,{color:t,children:r}):r}):void 0;return s(o,{alignItems:"center",flexDirection:f,children:[n?l:void 0,i(o,{children:c}),n?void 0:l]})}export{x as Tooltip,x as default};

package/dist/transition.d.ts

@@ -0,0 +1,66 @@
+import { ReactNode, ReactElement } from 'react';
+type TransitionPreset = "fade" | "reveal" | "slide-down" | "slide-left" | "slide-right" | "slide-up";
+type TransitionPhase = "entered" | "entering" | "exited" | "exiting";
+type Props = {
+  /**
+   * Content to animate.
+   */
+  readonly children: ReactNode;
+  /**
+   * For slide presets, how many characters of offset to animate across.
+   * For the `reveal` preset, the maximum row count to scale through.
+   * @default 4
+   */
+  readonly distance?: number;
+  /**
+   * Duration of both enter and exit transitions, in milliseconds.
+   * @default 240
+   */
+  readonly duration?: number;
+  /**
+   * Called once the exit animation finishes (i.e. the component has fully
+   * transitioned out). AnimatePresence uses this to unmount the wrapper.
+   */
+  readonly onExit?: () => void;
+  /**
+   * Animation preset controlling how the content appears/disappears.
+   * @default "fade"
+   */
+  readonly preset?: TransitionPreset;
+  /**
+   * Controls the target phase. `true` drives towards `entered`, `false`
+   * drives towards `exited`. Flip the value to trigger animation.
+   * @default true
+   */
+  readonly show?: boolean;
+  /**
+   * Tick interval in milliseconds. Lower values yield smoother animation
+   * at the cost of CPU.
+   * @default 30
+   */
+  readonly tickInterval?: number;
+};
+type TransitionComponent = ((props: Props) => ReactElement | null) & {
+  isAnimatable: true;
+};
+/**
+ * Animate a child's entry and exit using a TUI-friendly preset. Drive via
+ * `show`; the component toggles between enter and exit, fires `onExit` once
+ * the exit animation completes.
+ *
+ * **Fade preset note:** `dimColor` is only applied when the child is a plain
+ * string. Non-string children (Box trees, other components) pass through
+ * untouched during the transition — wrap them in `<Text>` if you need the
+ * fade effect.
+ * @returns A `ReactElement` rendering the transitioning child, or `null`
+ * once a hidden transition has fully completed.
+ */
+declare function Transition({ children, distance, duration, onExit, preset, show, tickInterval }: Props): ReactElement | null;
+/**
+ * Static marker used by `AnimatePresence` to recognize Transition children
+ * even when the consumer hasn't explicitly passed a `show` prop. Consumers
+ * can apply the same marker to their own wrappers (`MyWrapper.isAnimatable
+ * = true`) to opt them into animation orchestration.
+ */
+declare const TransitionWithMarker: TransitionComponent;
+export { Props, Transition, TransitionPhase, TransitionPreset, type Props as TransitionProps, TransitionWithMarker as default };

package/dist/transition.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import c from"@visulima/tui/components/box";import y from"@visulima/tui/components/text";import{useState as w,useRef as a,useEffect as D}from"react";const A=(t,r)=>t>=1?e(c,{children:r}):t<=0?e(c,{}):e(c,{children:typeof r=="string"?e(y,{dimColor:t<.7,children:r}):r}),B=(t,r)=>Math.max(0,Math.min(r,Math.round((1-t)*r))),f=(t,r)=>(i,u,h)=>{const n=B(i,h);return i>=1?e(c,{children:u}):i<=0?e(c,{}):t==="x"?e(c,{paddingLeft:r===1?n:0,paddingRight:r===-1?n:0,children:u}):e(c,{flexDirection:"column",paddingBottom:r===-1?n:0,paddingTop:r===1?n:0,children:u})},C=(t,r,i)=>{if(t>=1)return e(c,{children:r});if(t<=0)return e(c,{});const u=Math.max(0,Math.min(i,Math.round(t*i)));return e(c,{flexDirection:"column",height:u,overflowY:"hidden",children:r})},O={fade:A,reveal:C,"slide-down":f("y",-1),"slide-left":f("x",-1),"slide-right":f("x",1),"slide-up":f("y",1)},T=(t,r)=>t?r>=1?"entered":"entering":r<=0?"exited":"exiting";function K({children:t,distance:r=4,duration:i=240,onExit:u,preset:h="fade",show:n=!0,tickInterval:g=30}){const[m,I]=w(n?1:0),p=a(n?1:0),M=a(Date.now()),l=a(n?1:0),d=a(!n),x=a(u);x.current=u;const[E,R]=w(0);if(D(()=>{const o=n?1:0;p.current!==o&&(p.current=o,M.current=Date.now(),l.current=m,d.current=!1,R(s=>s+1))},[n]),D(()=>{const o=p.current;if(l.current===o){o===0&&!d.current&&(d.current=!0,x.current?.());return}const s=setInterval(()=>{const j=Date.now()-M.current,v=i<=0?1:Math.min(1,j/i),k=l.current+(o-l.current)*v;I(k),v>=1&&(clearInterval(s),o===0&&!d.current&&(d.current=!0,x.current?.()))},g);return()=>{clearInterval(s)}},[E,i,g]),T(n,m)==="exited"&&!n)return null;const b=O[h];return b(m,t,r)}const Y=Object.assign(K,{isAnimatable:!0});export{K as Transition,Y as default};

package/dist/tree-select.d.ts

@@ -0,0 +1,55 @@
+import { AnsiColors } from '@visulima/colorize';
+import { ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type TreeSelectNode = {
+  readonly children?: ReadonlyArray<TreeSelectNode>;
+  readonly label: string;
+  readonly value: string;
+};
+type Props = {
+  /**
+   * Accent color for the focused row and selection marks.
+   * @default "blue"
+   */
+  readonly accentColor?: LiteralUnion<AnsiColors, string>;
+  /**
+   * Auto-focus on mount.
+   */
+  readonly autoFocus?: boolean;
+  /**
+   * Selected values when uncontrolled.
+   */
+  readonly defaultValue?: ReadonlyArray<string>;
+  /**
+   * Disable input and dim the tree.
+   */
+  readonly isDisabled?: boolean;
+  /**
+   * The tree to render.
+   */
+  readonly nodes: ReadonlyArray<TreeSelectNode>;
+  /**
+   * Fires whenever the selection changes.
+   */
+  readonly onChange?: (values: ReadonlyArray<string>) => void;
+  /**
+   * Fires on Enter with the current selection.
+   */
+  readonly onSubmit?: (values: ReadonlyArray<string>) => void;
+  /**
+   * `single` replaces the selection; `multiple` toggles values.
+   * @default "single"
+   */
+  readonly selectionMode?: "multiple" | "single";
+  /**
+   * Controlled selection. When provided, `defaultValue` is ignored.
+   */
+  readonly value?: ReadonlyArray<string>;
+};
+/**
+ * A keyboard-navigable tree with selectable leaves. ↑/↓ move the cursor, →/←
+ * expand/collapse a branch (or Space on a branch), Space selects a leaf, and
+ * Enter submits. Supports single or multiple selection.
+ */
+declare function TreeSelect({ accentColor, autoFocus, defaultValue, isDisabled, nodes, onChange, onSubmit, selectionMode, value: controlledValue }: Props): ReactElement;
+export { Props, TreeSelect, TreeSelectNode, type Props as TreeSelectProps, TreeSelect as default };

package/dist/tree-select.js

@@ -0,0 +1 @@
+import{jsx as p,jsxs as k}from"react/jsx-runtime";import B from"@visulima/tui/components/box";import w from"@visulima/tui/components/text";import V from"@visulima/tui/hooks/use-focus";import Y from"@visulima/tui/hooks/use-input";import{useState as C,useMemo as R,useRef as _,useCallback as g}from"react";const q=[];function T(i,t){return t===0?0:(i%t+t)%t}function z(i,t,s){return i?t?"▾":"▸":s?"◉":"◯"}const E=(i,t,s,u)=>{for(const l of i){const a=l.children!==void 0&&l.children.length>0;u.push({depth:s,hasChildren:a,node:l}),a&&t.has(l.value)&&E(l.children,t,s+1,u)}};function X({accentColor:i="blue",autoFocus:t=!1,defaultValue:s=q,isDisabled:u=!1,nodes:l,onChange:a,onSubmit:S,selectionMode:A="single",value:f}){const{isFocused:b}=V({autoFocus:t,isActive:!u}),x=f!==void 0,[D,H]=C(s),c=R(()=>new Set(f??D),[f,D]),[m,I]=C(()=>new Set),[v,F]=C(0),M=_(a);M.current=a;const d=R(()=>{const e=[];return E(l,m,0,e),e},[m,l]),j=g(e=>{const o=[...e];x||H(o),M.current?.(o)},[x]),h=g((e,o)=>{I(r=>{const n=new Set(r);return o??!n.has(e)?n.add(e):n.delete(e),n})},[]),J=g((e,o)=>{const r=d[v];if(o.upArrow){F(n=>T(n-1,d.length));return}if(o.downArrow){F(n=>T(n+1,d.length));return}if(r!==void 0){if(o.rightArrow&&r.hasChildren){h(r.node.value,!0);return}if(o.leftArrow&&r.hasChildren){h(r.node.value,!1);return}if(e===" "){if(r.hasChildren){h(r.node.value);return}const n=A==="single"?new Set:new Set(c);n.has(r.node.value)?n.delete(r.node.value):n.add(r.node.value),j(n);return}o.return&&S?.([...c])}},[v,j,S,d,c,A,h]);return Y(J,{isActive:b&&!u}),p(B,{flexDirection:"column",children:d.map((e,o)=>{const r=b&&o===v,n=c.has(e.node.value),K="  ".repeat(e.depth),N=z(e.hasChildren,m.has(e.node.value),n),U=!e.hasChildren&&n?i:void 0;return k(B,{children:[p(w,{color:r?i:void 0,children:r?"❯":" "}),p(w,{children:K}),k(w,{color:U,dimColor:u,children:[N," ",e.node.label]})]},o)})})}export{X as TreeSelect,X as default};

package/dist/tree-view-entry.d.ts

@@ -0,0 +1,4 @@
+export { type A as AsyncChildrenFunction, type F as FlatNode, type S as SelectionMode, type T as TreeNode, a as TreeNodeMap, type b as TreeNodeRendererProps, type c as TreeNodeState, d as TreeView, type P as TreeViewProps, type e as TreeViewState, type f as TreeViewTheme, type U as UseTreeViewProps, type g as UseTreeViewStateProps, t as treeViewTheme, u as useTreeView, h as useTreeViewState } from "./packem_shared/use-tree-view.d-DeMQ6G2r.js";
+import '@visulima/tui/components/box';
+import '@visulima/tui/components/text';
+import 'react';

package/dist/tree-view-entry.js

@@ -0,0 +1 @@
+import{theme as o}from"./packem_shared/treeViewTheme-Dq3ekRAC.js";import{TreeNodeMap as m}from"./packem_shared/TreeNodeMap-cJlYqckB.js";import{TreeView as f}from"./packem_shared/TreeView-q0l446NV.js";import{useTreeView as T}from"./packem_shared/useTreeView-D0JEqT6W.js";import{useTreeViewState as w}from"./packem_shared/useTreeViewState-BiTJakkh.js";export{m as TreeNodeMap,f as TreeView,o as treeViewTheme,T as useTreeView,w as useTreeViewState};

package/dist/unordered-list.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode, ReactElement } from 'react';
+type UnorderedListEntry = {
+  /**
+   * Content of the list entry. Can be a string or nested list.
+   */
+  readonly children?: ReadonlyArray<UnorderedListEntry>;
+  /**
+   * Display text for this item.
+   */
+  readonly label: ReactNode;
+};
+type Props = {
+  /**
+   * Entries to render as a bullet list.
+   */
+  readonly items: ReadonlyArray<UnorderedListEntry>;
+  /**
+   * Custom bullet symbol(s). A string uses the same symbol at all depths.
+   * An array cycles through symbols by nesting depth.
+   */
+  readonly marker?: ReadonlyArray<string> | string;
+};
+/**
+ * Renders a bullet list with nesting support.
+ */
+declare function UnorderedList({ items, marker }: Props): ReactElement;
+export { Props, UnorderedList, UnorderedListEntry, type Props as UnorderedListProps, UnorderedList as default };

package/dist/unordered-list.js

@@ -0,0 +1 @@
+import{jsx as o,jsxs as t}from"react/jsx-runtime";import l from"@visulima/tui/components/box";import c from"@visulima/tui/components/text";const a=["─","◦","▪"],f=r=>typeof r=="string"?[r]:Array.isArray(r)?r:a,s=(r,i,e)=>{const d=i[e%i.length]??"─";return o(l,{flexDirection:"column",children:r.map((n,m)=>t(l,{gap:1,children:[o(c,{dimColor:!0,children:d}),t(l,{flexDirection:"column",children:[o(c,{children:n.label}),n.children?s(n.children,i,e+1):void 0]})]},m))})};function x({items:r,marker:i}){const e=f(i);return s(r,e,0)}export{x as UnorderedList,x as default};

package/dist/use-linked-scroll.d.ts

@@ -0,0 +1,42 @@
+import { RefObject } from 'react';
+import { b as ScrollViewRef } from "./packem_shared/scroll-view.d-GZcgAHl4.js";
+import '@visulima/tui/components/box';
+type UseLinkedScrollReturn = {
+  /**
+   * Callback to pass to ScrollView's `onScroll` prop.
+   * Broadcasts the scroll position to all linked instances.
+   */
+  onScroll: (scrollOffset: number) => void;
+  /**
+   * Ref to attach to the ScrollView component.
+   * Used internally to call `scrollTo()` when other instances scroll.
+   */
+  ref: RefObject<ScrollViewRef | null>;
+};
+type LinkedScrollGroup = {
+  /**
+   * Hook that returns a ref and onScroll callback for linking a ScrollView
+   * to this group. Call once per ScrollView instance.
+   */
+  useLinkedScroll: () => UseLinkedScrollReturn;
+};
+/**
+ * Creates a linked scroll group that synchronizes scroll position
+ * across multiple ScrollView instances.
+ * @example
+ * ```tsx
+ * const group = createLinkedScrollGroup();
+ *
+ * const PanelA = () => {
+ *     const { ref, onScroll } = group.useLinkedScroll();
+ *     return <ScrollView ref={ref} onScroll={onScroll}>...</ScrollView>;
+ * };
+ *
+ * const PanelB = () => {
+ *     const { ref, onScroll } = group.useLinkedScroll();
+ *     return <ScrollView ref={ref} onScroll={onScroll}>...</ScrollView>;
+ * };
+ * ```
+ */
+declare const createLinkedScrollGroup: () => LinkedScrollGroup;
+export { LinkedScrollGroup, UseLinkedScrollReturn, createLinkedScrollGroup, createLinkedScrollGroup as default };

package/dist/use-linked-scroll.js

@@ -0,0 +1 @@
+import{useRef as s,useState as u,useEffect as a,useCallback as d}from"react";const S=()=>{const r=new Set;let t=!1;return{useLinkedScroll:()=>{const l=s(null),[,c]=u(0),f={ref:l,setOffset:()=>{c(e=>e+1)}},n=s(f);return n.current=f,a(()=>{const{current:e}=n;return r.add(e),()=>{r.delete(e)}},[]),{onScroll:d(e=>{if(!t){t=!0;try{for(const o of r)o.ref!==l&&o.ref.current?.scrollTo(e)}finally{t=!1}}},[]),ref:l}}}};export{S as createLinkedScrollGroup,S as default};