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

package/dist/components/tag.d.ts

@@ -0,0 +1,35 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactNode, ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+type TagVariant = "outline" | "solid" | "subtle";
+type Props = {
+  /**
+  * Tag content.
+  */
+  readonly children: ReactNode;
+  /**
+  * Base color.
+  * @default "blue"
+  */
+  readonly color?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Optional symbol rendered before the label (e.g. `●`, `✔`, `★`).
+  */
+  readonly icon?: ReactNode;
+  /**
+  * Visual style.
+  * @default "subtle"
+  */
+  readonly variant?: TagVariant;
+};
+/**
+* Render a short pill-shaped label.
+* @returns A `ReactElement` rendering the tag in the requested variant.
+*/
+declare function Tag({
+  children,
+  color,
+  icon,
+  variant
+}: Props): ReactElement;
+export { Props, Tag, type Props as TagProps, TagVariant, Tag as default };

package/dist/components/tag.js

@@ -0,0 +1 @@
+var a=Object.defineProperty;var l=(o,r)=>a(o,"name",{value:r,configurable:!0});import{jsx as t,jsxs as e,Fragment as d}from"react/jsx-runtime";import{Box as u}from"./box.js";import{Text as n}from"./text.js";var v=Object.defineProperty,s=l((o,r)=>v(o,"name",{value:r,configurable:!0}),"i");function b({children:o,color:r="blue",icon:i,variant:c="subtle"}){return c==="outline"?t(u,{borderColor:r,borderStyle:"round",paddingX:1,children:e(n,{color:r,children:[i===void 0?void 0:e(d,{children:[i," "]}),o]})}):c==="solid"?e(n,{backgroundColor:r,color:"black",children:[" ",i===void 0?void 0:e(d,{children:[i," "]}),o," "]}):e(n,{color:r,children:[i===void 0?void 0:e(d,{children:[i," "]}),o]})}l(b,"l");s(b,"Tag");export{b as Tag,b as default};

package/dist/components/text-input.d.ts

@@ -0,0 +1,48 @@
+import { ReactElement } from 'react';
+type Props = {
+  /** @default "" */
+  readonly defaultValue?: string;
+  /**
+  * When true, all input is ignored and text is dimmed.
+  * @default false
+  */
+  readonly isDisabled?: boolean;
+  /**
+  * When true, renders asterisks instead of the actual characters.
+  * @default false
+  */
+  readonly mask?: boolean;
+  /**
+  * Fires on every keystroke with the updated text.
+  */
+  readonly onChange?: (value: string) => void;
+  /**
+  * Fires when the user presses Enter.
+  */
+  readonly onSubmit?: (value: string) => void;
+  /**
+  * Greyed-out text shown when the input is empty.
+  */
+  readonly placeholder?: string;
+  /**
+  * Autocomplete candidates. The first case-sensitive prefix match is shown
+  * dimmed after the current input. Press right-arrow or Enter to accept.
+  */
+  readonly suggestions?: ReadonlyArray<string>;
+};
+/**
+* A single-line text input with cursor navigation, optional placeholder,
+* autocomplete suggestions, and password masking.
+*
+* Supports arrow keys, Home/End, Ctrl+A/E, Ctrl+U/K/W, Backspace, Delete.
+*/
+declare function TextInput({
+  defaultValue,
+  isDisabled,
+  mask,
+  onChange,
+  onSubmit,
+  placeholder,
+  suggestions
+}: Props): ReactElement;
+export { Props, TextInput, type Props as TextInputProps, TextInput as default };

package/dist/components/text-input.js

@@ -0,0 +1 @@
+var F=Object.defineProperty;var A=(t,e)=>F(t,"name",{value:e,configurable:!0});import{jsx as f,jsxs as I}from"react/jsx-runtime";import{useState as O,useRef as S,useCallback as G}from"react";import H from"../ink/hooks/use-input.js";import{i as J}from"../packem_shared/input-utils-fAxzSlNh.js";import{Box as j}from"./box.js";import{Text as h}from"./text.js";var K=Object.defineProperty,k=A((t,e)=>K(t,"name",{value:e,configurable:!0}),"p");const L=/\S+\s*$/,w=k((t,e)=>t.length===0||!e?void 0:e.find(n=>n.startsWith(t))?.slice(t.length)??void 0,"findSuggestion"),P=-1,V=k((t,e,n,r)=>e.leftArrow?Math.max(0,n-1):e.home||e.ctrl&&t==="a"?0:e.end||e.ctrl&&t==="e"?r:P,"handleNavigation"),_=k((t,e,n,r)=>{if(e.backspace&&r>0)return[n.slice(0,r-1)+n.slice(r),r-1];if(e.delete&&r<n.length)return[n.slice(0,r)+n.slice(r+1),r];if(e.ctrl&&t==="u")return[n.slice(r),0];if(e.ctrl&&t==="k")return[n.slice(0,r),r];if(e.ctrl&&t==="w"){const d=n.slice(0,r).replace(L,"");return[d+n.slice(r),d.length]}},"handleEditing");function q({defaultValue:t="",isDisabled:e=!1,mask:n=!1,onChange:r,onSubmit:d,placeholder:v,suggestions:b}){const[o,x]=O(t),[g,u]=O(t.length),y=S(o);y.current=o;const M=S(g);M.current=g;const m=S(r);m.current=r;const T=S(d);T.current=d;const B=w(o,b),R=G((p,a)=>{const{current:s}=M,c=y.current;if(a.return){const i=w(c,b),l=i?c+i:c;i&&(x(l),u(l.length),m.current?.(l)),T.current?.(l);return}if(a.escape)return;if(a.rightArrow){const i=w(c,b);if(s===c.length&&i){const l=c+i;x(l),u(l.length),m.current?.(l);return}u(Math.min(c.length,s+1));return}const E=V(p,a,s,c.length);if(E!==P){u(E);return}const N=_(p,a,c,s);if(N){const[i,l]=N;x(i),u(l),m.current?.(i);return}if(J(p,a)){const i=c.slice(0,s)+p+c.slice(s);x(i),u(s+p.length),m.current?.(i)}},[b]);H(R,{isActive:!e});const C=n?"*".repeat(o.length):o,W=C.slice(0,g),$=C[g],D=C.slice(g+1);return e?f(j,{children:f(h,{dimColor:!0,children:C||v||""})}):o.length===0&&v?I(j,{children:[f(h,{dimColor:!0,inverse:!0,children:v[0]}),f(h,{dimColor:!0,children:v.slice(1)})]}):I(j,{children:[I(h,{children:[W,f(h,{inverse:!0,children:$??" "}),D]}),B?f(h,{dimColor:!0,children:B}):void 0]})}A(q,"y");k(q,"TextInput");export{q as TextInput,q as default};

package/dist/components/text.d.ts

@@ -0,0 +1,78 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+import { ReactNode, ReactElement } from 'react';
+import { LiteralUnion } from 'type-fest';
+import { S as Styles } from "../packem_shared/styles.d-CLJdt-kg.js";
+import 'yoga-layout';
+type Props = {
+  /**
+  * Hide the element from screen readers.
+  */
+  readonly "aria-hidden"?: boolean;
+  /**
+  * A label for the element for screen readers.
+  */
+  readonly "aria-label"?: string;
+  /**
+  * Same as `color`, but for the background.
+  */
+  readonly backgroundColor?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Make the text bold.
+  */
+  readonly bold?: boolean;
+  readonly children?: ReactNode;
+  /**
+  * Change text color. Ink uses @visulima/colorize under the hood, so all its functionality is supported.
+  */
+  readonly color?: LiteralUnion<AnsiColors, string>;
+  /**
+  * Dim the color (make it less bright).
+  */
+  readonly dimColor?: boolean;
+  /**
+  * Inverse background and foreground colors.
+  */
+  readonly inverse?: boolean;
+  /**
+  * Make the text italic.
+  */
+  readonly italic?: boolean;
+  /**
+  * Make the text crossed out with a line.
+  */
+  readonly strikethrough?: boolean;
+  /**
+  * Make the text underlined.
+  */
+  readonly underline?: boolean;
+  /**
+  * Controls how text wraps when it exceeds the container width.
+  *
+  * - `wrap` (default) — Wrap at word boundaries; break inside words only when a single word exceeds the width.
+  * - `wrap-anywhere` — Break at any character boundary, even when a whitespace break exists earlier.
+  * - `wrap-preserve-words` — Wrap at word boundaries; never break inside words (long words may overflow).
+  * - `wrap-strict` — Enforce exact width; always break at the column limit.
+  * - `truncate` / `truncate-end` — Truncate at the end with an ellipsis.
+  * - `truncate-start` — Truncate at the start with an ellipsis.
+  * - `truncate-middle` — Truncate in the middle with an ellipsis.
+  */
+  readonly wrap?: Styles["textWrap"];
+};
+/**
+* This component can display text and change its style to make it bold, underlined, italic, or strikethrough.
+*/
+declare function Text({
+  "aria-hidden": ariaHidden,
+  "aria-label": ariaLabel,
+  backgroundColor,
+  bold,
+  children,
+  color,
+  dimColor,
+  inverse,
+  italic,
+  strikethrough,
+  underline,
+  wrap
+}: Props): ReactElement | null;
+export { Props, Text, type Props as TextProps, Text as default };

package/dist/components/text.js

@@ -0,0 +1 @@
+var w=Object.defineProperty;var n=(t,e)=>w(t,"name",{value:e,configurable:!0});import{jsx as j}from"react/jsx-runtime";import{g as a,d as p}from"../packem_shared/colorize-gy_cY-wC.js";import{useContext as h,useCallback as y}from"react";import{a as S}from"../packem_shared/accessibility-context-DDyHTwmA.js";import{b as T}from"../packem_shared/background-context-rjOaWFki.js";var $=Object.defineProperty,A=n((t,e)=>$(t,"name",{value:e,configurable:!0}),"g");function D({"aria-hidden":t=!1,"aria-label":e,backgroundColor:s,bold:o=!1,children:d,color:l,dimColor:f=!1,inverse:c=!1,italic:u=!1,strikethrough:b=!1,underline:m=!1,wrap:k="wrap"}){const{isScreenReaderEnabled:i}=h(S),x=h(T),C=i&&e?e:d,v=y(r=>{f&&(r=a.dim(r)),l&&(r=p(r,l,"foreground"));const g=s??x;return g&&(r=p(r,g,"background")),o&&(r=a.bold(r)),u&&(r=a.italic(r)),m&&(r=a.underline(r)),b&&(r=a.strikethrough(r)),c&&(r=a.inverse(r)),r},[f,l,s,x,o,u,m,b,c]);return C==null||i&&t?null:j("ink-text",{internal_transform:v,style:{flexDirection:"row",flexGrow:0,flexShrink:1,textWrap:k},children:i&&e?e:d})}n(D,"c");A(D,"Text");export{D as Text,D as default};

package/dist/components/textarea.d.ts

@@ -0,0 +1,68 @@
+import { ReactElement } from 'react';
+type Props = {
+  /** @default "" */
+  readonly defaultValue?: string;
+  /**
+  * When true, all input is ignored and text is dimmed.
+  * @default false
+  */
+  readonly isDisabled?: boolean;
+  /**
+  * When true, the component responds to keyboard input.
+  * @default true
+  */
+  readonly isFocused?: boolean;
+  /**
+  * Maximum visible rows before viewport scrolling kicks in.
+  * When set, the textarea will grow from `rows` to `maxRows` before scrolling.
+  */
+  readonly maxRows?: number;
+  /**
+  * Fires on every edit with the updated text.
+  */
+  readonly onChange?: (value: string) => void;
+  /**
+  * Fires when the user presses Meta+Enter or Ctrl+Enter.
+  */
+  readonly onSubmit?: (value: string) => void;
+  /**
+  * Greyed-out text shown when the textarea is empty.
+  */
+  readonly placeholder?: string;
+  /**
+  * Number of visible rows (viewport height).
+  * @default 5
+  */
+  readonly rows?: number;
+  /**
+  * Show line numbers in the left gutter.
+  * @default false
+  */
+  readonly showLineNumbers?: boolean;
+  /**
+  * Number of spaces inserted for a Tab key press.
+  * @default 2
+  */
+  readonly tabSize?: number;
+};
+/**
+* A multi-line text input with cursor navigation, selection, clipboard, undo/redo,
+* paste support, and viewport scrolling.
+*
+* ```tsx
+* <Textarea defaultValue="Hello\nWorld" rows={10} onChange={setValue} onSubmit={handleSubmit} />
+* ```
+*/
+declare function Textarea({
+  defaultValue,
+  isDisabled,
+  isFocused,
+  maxRows,
+  onChange,
+  onSubmit,
+  placeholder,
+  rows,
+  showLineNumbers,
+  tabSize
+}: Props): ReactElement;
+export { Props, Textarea, type Props as TextareaProps, Textarea as default };

package/dist/components/textarea.js

@@ -0,0 +1,2 @@
+var O=Object.defineProperty;var x=(i,o)=>O(i,"name",{value:o,configurable:!0});import{jsx as l,jsxs as m,Fragment as T}from"react/jsx-runtime";import{useRef as b,useState as P,useEffect as j,useMemo as V,useCallback as z}from"react";import W from"../ink/hooks/use-clipboard.js";import N from"../ink/hooks/use-input.js";import X from"../ink/hooks/use-paste.js";import Y from"../ink/hooks/use-text-buffer.js";import{i as Z}from"../packem_shared/input-utils-fAxzSlNh.js";import{Box as C}from"./box.js";import{Text as c}from"./text.js";var q=Object.defineProperty,D=x((i,o)=>q(i,"name",{value:o,configurable:!0}),"C");const G=D((i,o)=>o.line<i.line||o.line===i.line&&o.col<i.col?{endCol:i.col,endLine:i.line,startCol:o.col,startLine:o.line}:{endCol:o.col,endLine:o.line,startCol:i.col,startLine:i.line},"getOrderedSelection");function J({defaultValue:i="",isDisabled:o=!1,isFocused:g=!0,maxRows:d,onChange:v,onSubmit:a,placeholder:p,rows:h=5,showLineNumbers:f=!1,tabSize:L=2}){const n=Y(i),S=b(n);S.current=n;const{copy:s}=W(),[u,A]=P(0),k=b(v);k.current=v;const y=b(a);y.current=a;const F=b(i);j(()=>{n.value!==F.current&&(F.current=n.value,k.current?.(n.value))},[n.value]);const w=V(()=>d?Math.min(Math.max(h,n.lines.length),d):h,[h,d,n.lines.length]);j(()=>{A(t=>n.cursor.line<t?n.cursor.line:n.cursor.line>=t+w?n.cursor.line-w+1:t)},[n.cursor.line,w]);const I=z((t,r)=>{const e=S.current;if(r.return&&(r.meta||r.ctrl)){y.current?.(e.value);return}if(r.return){e.newline();return}if(r.escape){e.clearSelection();return}if(r.tab){e.insert(" ".repeat(L));return}if(r.ctrl&&t==="z"){e.undo();return}if(r.ctrl&&(t==="y"||r.shift&&t==="Z")){e.redo();return}if(r.ctrl&&t==="c"&&e.hasSelection()){s(e.getSelectedText());return}if(r.ctrl&&(t==="A"||t==="a"&&r.shift)){e.selectAll();return}if(r.upArrow){e.moveCursor("up",r.shift);return}if(r.downArrow){e.moveCursor("down",r.shift);return}if(r.leftArrow){e.moveCursor("left",r.shift);return}if(r.rightArrow){e.moveCursor("right",r.shift);return}if(r.home){r.ctrl?e.moveToStart(r.shift):e.moveToLineStart(r.shift);return}if(r.end){r.ctrl?e.moveToEnd(r.shift):e.moveToLineEnd(r.shift);return}if(r.ctrl&&t==="a"){e.moveToLineStart(r.shift);return}if(r.ctrl&&t==="e"){e.moveToLineEnd(r.shift);return}if(r.backspace){e.deleteBack();return}if(r.delete){e.deleteForward();return}if(r.ctrl&&t==="u"){e.deleteToLineStart();return}if(r.ctrl&&t==="k"){e.deleteToLineEnd();return}if(r.ctrl&&t==="w"){e.deleteWord();return}Z(t,r)&&(e.hasSelection()?e.replaceSelection(t):e.insert(t))},[s,L]);N(I,{isActive:g&&!o});const M=z(t=>{const r=S.current;r.hasSelection()?r.replaceSelection(t):r.insert(t)},[]);X(M,{isActive:g&&!o});const R=n.lines.slice(u,u+w),E=f?String(n.lines.length).length+1:0,$=n.anchor?G(n.cursor,n.anchor):null;if(o)return l(C,{flexDirection:"column",children:R.map((t,r)=>{const e=u+r;return m(C,{children:[f?m(c,{dimColor:!0,children:[String(e+1).padStart(E)," "]}):void 0,l(c,{dimColor:!0,children:t||(e===0&&p?p:"")})]},e)})});if(n.value.length===0&&p){const t=p.split(`
+`).slice(0,w);return l(C,{flexDirection:"column",children:t.map((r,e)=>m(C,{children:[f?m(c,{dimColor:!0,children:[String(e+1).padStart(E)," "]}):void 0,e===0?m(c,{children:[l(c,{dimColor:!0,inverse:!0,children:r[0]??" "}),l(c,{dimColor:!0,children:r.slice(1)})]}):l(c,{dimColor:!0,children:r})]},e))})}return l(C,{flexDirection:"column",children:R.map((t,r)=>{const e=u+r,H=e===n.cursor.line;return m(C,{children:[f?m(c,{dimColor:!H,children:[String(e+1).padStart(E)," "]}):void 0,l(c,{children:B(t,e,n.cursor,$)})]},e)})})}x(J,"D");D(J,"Textarea");function B(i,o,g,d){const v=o===g.line,a=v?g.col:-1,p=d&&o>=d.startLine&&o<=d.endLine;if(!p&&!v)return l(T,{children:i});if(!p){const s=i.slice(0,a),u=i[a],A=i.slice(a+1);return m(T,{children:[s,l(c,{inverse:!0,children:u??" "}),A]})}const h=o===d.startLine?d.startCol:0,f=o===d.endLine?d.endCol:i.length,L=i.slice(0,h),n=i.slice(h,f),S=i.slice(f);if(v&&(a<h||a>=f)){const s=[];let u=0;return a<h?(s.push(l(c,{children:i.slice(0,a)},u++)),s.push(l(c,{inverse:!0,children:i[a]??" "},u++)),s.push(l(c,{children:i.slice(a+1,h)},u++)),s.push(l(c,{inverse:!0,children:n},u++)),s.push(l(c,{children:S},u++))):(s.push(l(c,{children:L},u++)),s.push(l(c,{inverse:!0,children:n},u++)),s.push(l(c,{children:i.slice(f,a)},u++)),s.push(l(c,{inverse:!0,children:i[a]??" "},u++)),s.push(l(c,{children:i.slice(a+1)},u++))),l(T,{children:s})}return m(T,{children:[L,l(c,{inverse:!0,children:n}),S]})}x(B,"Y");D(B,"renderLine");export{J as Textarea,J as default};

package/dist/components/timer.d.ts

@@ -0,0 +1,59 @@
+import { Ref, ReactElement } from 'react';
+import { UseTimerResult } from "../ink/hooks/use-timer.js";
+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/components/timer.js

@@ -0,0 +1 @@
+var u=Object.defineProperty;var e=(r,o)=>u(r,"name",{value:o,configurable:!0});import{jsx as f}from"react/jsx-runtime";import{useImperativeHandle as p}from"react";import c from"../ink/hooks/use-timer.js";import{f as d}from"../packem_shared/format-time-C7Q-hQZq.js";import{Text as g}from"./text.js";var v=Object.defineProperty,T=e((r,o)=>v(r,"name",{value:o,configurable:!0}),"o");const D=T(({autoStart:r,bold:o,color:a,duration:i,format:m=d,interval:n,onTimeout:s,ref:l})=>{const t=c({autoStart:r,duration:i,interval:n,onTimeout:s});return p(l,()=>({reset:t.reset,start:t.start,stop:t.stop,toggle:t.toggle}),[t.reset,t.start,t.stop,t.toggle]),f(g,{bold:o,color:a,children:m(t.remaining)})},"Timer");export{D as Timer,D as default};

package/dist/components/toast.d.ts

@@ -0,0 +1,49 @@
+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/components/toast.js

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

package/dist/components/tooltip.d.ts

@@ -0,0 +1,43 @@
+import { A as AnsiColors } from "../packem_shared/index.server.d-eZWyC2Ku.js";
+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/components/tooltip.js

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

package/dist/components/transform.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode, ReactElement } from 'react';
+type Props = {
+  /**
+  * Screen-reader-specific text to output. If this is set, all children will be ignored.
+  */
+  readonly accessibilityLabel?: string;
+  readonly children?: ReactNode;
+  /**
+  * Function that transforms children output. It accepts children and must return transformed children as well. Note that when children use `<Text>` styling props (e.g. `color`, `bold`), the string will contain ANSI escape codes.
+  */
+  readonly transform: (children: string, index: number) => string;
+};
+/**
+* Transform a string representation of React components before they're written to output. For example, you might want to apply a gradient to text, add a clickable link, or create some text effects. These use cases can't accept React nodes as input; they expect a string. That's what the <Transform> component does: it gives you an output string of its child components and lets you transform it in any way.
+*/
+declare function Transform({
+  accessibilityLabel,
+  children,
+  transform
+}: Props): ReactElement | null;
+export { Props, Transform, type Props as TransformProps, Transform as default };

package/dist/components/transform.js

@@ -0,0 +1 @@
+var o=Object.defineProperty;var n=(r,e)=>o(r,"name",{value:e,configurable:!0});import{jsx as a}from"react/jsx-runtime";import{useContext as l}from"react";import{a as s}from"../packem_shared/accessibility-context-DDyHTwmA.js";var f=Object.defineProperty,c=n((r,e)=>f(r,"name",{value:e,configurable:!0}),"t");const m={flexDirection:"row",flexGrow:0,flexShrink:1};function u({accessibilityLabel:r,children:e,transform:t}){const{isScreenReaderEnabled:i}=l(s);return e==null?null:a("ink-text",{internal_transform:t,style:m,children:i&&r?r:e})}n(u,"n");c(u,"Transform");export{u as Transform,u as default};

package/dist/components/transition.d.ts

@@ -0,0 +1,74 @@
+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/components/transition.js

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