@visulima/tui-kit 1.0.0 → 1.0.1

package/dist/menu.d.ts

@@ -3,24 +3,24 @@ import { ReactNode, ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type MenuItem = {
   /**
-  * Optional hotkey rendered on the right side of the row (e.g. `"Ctrl+S"`).
-  */
+   * Optional hotkey rendered on the right side of the row (e.g. `"Ctrl+S"`).
+   */
   readonly hotkey?: string;
   /**
-  * Optional icon rendered before the label.
-  */
+   * Optional icon rendered before the label.
+   */
   readonly icon?: ReactNode;
   /**
-  * Identifier returned by `onSelect`.
-  */
+   * Identifier returned by `onSelect`.
+   */
   readonly id: string;
   /**
-  * When true, renders the item dimmed and skips it during navigation.
-  */
+   * When true, renders the item dimmed and skips it during navigation.
+   */
   readonly isDisabled?: boolean;
   /**
-  * Human-readable label.
-  */
+   * Human-readable label.
+   */
   readonly label: ReactNode;
 };
 type MenuSection = {
@@ -30,49 +30,41 @@ type MenuSection = {
 };
 type Props = {
   /**
-  * Accent color for the focused item.
-  * @default "blue"
-  */
+   * Accent color for the focused item.
+   * @default "blue"
+   */
   readonly accentColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Auto-focus the menu on mount.
-  */
+   * Auto-focus the menu on mount.
+   */
   readonly autoFocus?: boolean;
   /**
-  * Render a border around the menu.
-  * @default true
-  */
+   * Render a border around the menu.
+   * @default true
+   */
   readonly bordered?: boolean;
   /**
-  * Flat list of items. Ignored if `sections` is provided.
-  */
+   * Flat list of items. Ignored if `sections` is provided.
+   */
   readonly items?: ReadonlyArray<MenuItem>;
   /**
-  * Called with the item id when the user presses Enter.
-  */
+   * Called with the item id when the user presses Enter.
+   */
   readonly onSelect: (id: string) => void;
   /**
-  * Grouped items. Takes precedence over `items`.
-  */
+   * Grouped items. Takes precedence over `items`.
+   */
   readonly sections?: ReadonlyArray<MenuSection>;
   /**
-  * Optional title rendered at the top of the menu.
-  */
+   * Optional title rendered at the top of the menu.
+   */
   readonly title?: string;
 };
 /**
-* Dropdown / context menu with optional sections and disabled items.
-* Keyboard: ↑/↓ (or j/k) to navigate, Enter to select, Esc to cancel.
-* @returns A `ReactElement` rendering the menu, optionally wrapped in a
-* rounded border when `bordered` is true.
-*/
-declare function Menu({
-  accentColor,
-  autoFocus,
-  bordered,
-  items,
-  onSelect,
-  sections,
-  title
-}: Props): ReactElement;
+ * Dropdown / context menu with optional sections and disabled items.
+ * Keyboard: ↑/↓ (or j/k) to navigate, Enter to select, Esc to cancel.
+ * @returns A `ReactElement` rendering the menu, optionally wrapped in a
+ * rounded border when `bordered` is true.
+ */
+declare function Menu({ accentColor, autoFocus, bordered, items, onSelect, sections, title }: Props): ReactElement;
 export { Menu, MenuItem, type Props as MenuProps, MenuSection, Props, Menu as default };

package/dist/message-bubble.d.ts

@@ -4,40 +4,33 @@ import { LiteralUnion } from 'type-fest';
 type MessageRole = "assistant" | "system" | "tool" | "user";
 type Props = {
   /**
-  * Bubble body.
-  */
+   * Bubble body.
+   */
   readonly children: ReactNode;
   /**
-  * Color override.
-  */
+   * Color override.
+   */
   readonly color?: LiteralUnion<AnsiColors, string>;
   /**
-  * When true, draws the bubble without a border.
-  */
+   * When true, draws the bubble without a border.
+   */
   readonly flat?: boolean;
   /**
-  * Text rendered above the bubble (name, model, etc.).
-  */
+   * Text rendered above the bubble (name, model, etc.).
+   */
   readonly label?: string;
   /**
-  * Optional metadata rendered next to the label (e.g. timestamp).
-  */
+   * Optional metadata rendered next to the label (e.g. timestamp).
+   */
   readonly meta?: string;
   /**
-  * Determines the alignment, color, and icon of the bubble.
-  * @default "assistant"
-  */
+   * Determines the alignment, color, and icon of the bubble.
+   * @default "assistant"
+   */
   readonly role?: MessageRole;
 };
 /**
-* Chat-style message bubble for AI agent UIs.
-*/
-declare function MessageBubble({
-  children,
-  color,
-  flat,
-  label,
-  meta,
-  role
-}: Props): ReactElement;
+ * Chat-style message bubble for AI agent UIs.
+ */
+declare function MessageBubble({ children, color, flat, label, meta, role }: Props): ReactElement;
 export { MessageBubble, type Props as MessageBubbleProps, MessageRole, Props, MessageBubble as default };

package/dist/model-badge.d.ts

@@ -3,37 +3,31 @@ import { ReactNode, ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type Props = {
   /**
-  * Background color of the badge.
-  * @default "magenta"
-  */
+   * Background color of the badge.
+   * @default "magenta"
+   */
   readonly color?: LiteralUnion<AnsiColors, string>;
   /**
-  * Optional icon/symbol (e.g. `✨`, `◈`) shown before the label.
-  */
+   * Optional icon/symbol (e.g. `✨`, `◈`) shown before the label.
+   */
   readonly icon?: ReactNode;
   /**
-  * Short model identifier, e.g. `claude-opus-4.6`.
-  */
+   * Short model identifier, e.g. `claude-opus-4.6`.
+   */
   readonly model: string;
   /**
-  * Optional provider name rendered as a separate chip before the model.
-  */
+   * Optional provider name rendered as a separate chip before the model.
+   */
   readonly provider?: string;
   /**
-  * Visual style.
-  * @default "solid"
-  */
+   * Visual style.
+   * @default "solid"
+   */
   readonly variant?: "outline" | "solid" | "subtle";
 };
 /**
-* Pill-shaped chip identifying the active model / provider. Pair with
-* `MessageBubble` to label assistant output.
-*/
-declare function ModelBadge({
-  color,
-  icon,
-  model,
-  provider,
-  variant
-}: Props): ReactElement;
+ * Pill-shaped chip identifying the active model / provider. Pair with
+ * `MessageBubble` to label assistant output.
+ */
+declare function ModelBadge({ color, icon, model, provider, variant }: Props): ReactElement;
 export { ModelBadge, type Props as ModelBadgeProps, Props, ModelBadge as default };

package/dist/model-selector.d.ts

@@ -3,8 +3,8 @@ import { ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type ModelOption = {
   /**
-  * Optional context-window hint shown on the right (e.g. `200k`).
-  */
+   * Optional context-window hint shown on the right (e.g. `200k`).
+   */
   readonly context?: string;
   readonly id: string;
   readonly name: string;
@@ -12,41 +12,34 @@ type ModelOption = {
 };
 type Props = {
   /**
-  * Accent color for the focused row and selected marker.
-  * @default "blue"
-  */
+   * Accent color for the focused row and selected marker.
+   * @default "blue"
+   */
   readonly accentColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Auto-focus on mount.
-  */
+   * Auto-focus on mount.
+   */
   readonly autoFocus?: boolean;
   /**
-  * Selected model id when uncontrolled.
-  */
+   * Selected model id when uncontrolled.
+   */
   readonly defaultValue?: string;
   /**
-  * The models to choose from.
-  */
+   * The models to choose from.
+   */
   readonly models: ReadonlyArray<ModelOption>;
   /**
-  * Fires when the highlighted model is committed with Enter.
-  */
+   * Fires when the highlighted model is committed with Enter.
+   */
   readonly onSelect?: (model: ModelOption) => void;
   /**
-  * Controlled selected model id. When set, `defaultValue` is ignored.
-  */
+   * Controlled selected model id. When set, `defaultValue` is ignored.
+   */
   readonly value?: string;
 };
 /**
-* A selectable list of models with provider and context-window hints. ↑/↓ move
-* the cursor and Enter commits; a ● marks the currently-selected model.
-*/
-declare function ModelSelector({
-  accentColor,
-  autoFocus,
-  defaultValue,
-  models,
-  onSelect,
-  value: controlledValue
-}: Props): ReactElement;
+ * A selectable list of models with provider and context-window hints. ↑/↓ move
+ * the cursor and Enter commits; a ● marks the currently-selected model.
+ */
+declare function ModelSelector({ accentColor, autoFocus, defaultValue, models, onSelect, value: controlledValue }: Props): ReactElement;
 export { ModelOption, ModelSelector, type Props as ModelSelectorProps, Props, ModelSelector as default };

package/dist/multi-progress.d.ts

@@ -6,50 +6,43 @@ type ProgressItem = {
   readonly color?: Color;
   readonly label: string;
   /**
-  * Progress in the range [0, 1]. Values outside are clamped.
-  */
+   * Progress in the range [0, 1]. Values outside are clamped.
+   */
   readonly value: number;
 };
 type Props = {
   /**
-  * Width of each bar in cells.
-  * @default 20
-  */
+   * Width of each bar in cells.
+   * @default 20
+   */
   readonly barWidth?: number;
   /**
-  * Fallback bar color when an item has none.
-  * @default "cyan"
-  */
+   * Fallback bar color when an item has none.
+   * @default "cyan"
+   */
   readonly color?: Color;
   /**
-  * Character for the empty portion of each bar; defaults to a light shade.
-  */
+   * Character for the empty portion of each bar; defaults to a light shade.
+   */
   readonly emptyChar?: string;
   /**
-  * Character for the filled portion of each bar; defaults to a full block.
-  */
+   * Character for the filled portion of each bar; defaults to a full block.
+   */
   readonly filledChar?: string;
   /**
-  * The bars to render, top to bottom.
-  */
+   * The bars to render, top to bottom.
+   */
   readonly items: ReadonlyArray<ProgressItem>;
   /**
-  * Render the percentage after each bar.
-  * @default true
-  */
+   * Render the percentage after each bar.
+   * @default true
+   */
   readonly showPercent?: boolean;
 };
 /**
-* A stack of labeled progress bars sharing one aligned column layout — useful
-* for parallel downloads, multi-step jobs, or per-file progress. Labels are
-* right-padded to the widest so the bars line up.
-*/
-declare function MultiProgress({
-  barWidth,
-  color,
-  emptyChar,
-  filledChar,
-  items,
-  showPercent
-}: Props): ReactElement;
+ * A stack of labeled progress bars sharing one aligned column layout — useful
+ * for parallel downloads, multi-step jobs, or per-file progress. Labels are
+ * right-padded to the widest so the bars line up.
+ */
+declare function MultiProgress({ barWidth, color, emptyChar, filledChar, items, showPercent }: Props): ReactElement;
 export { MultiProgress, type Props as MultiProgressProps, ProgressItem, Props, MultiProgress as default };

package/dist/multi-select.d.ts

@@ -8,58 +8,48 @@ type MultiSelectOption = {
 };
 type Props = {
   /**
-  * Color for the focused item indicator and selected checkmarks.
-  * @default "blue"
-  */
+   * Color for the focused item indicator and selected checkmarks.
+   * @default "blue"
+   */
   readonly accentColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Color for unselected, unfocused option labels.
-  */
+   * Color for unselected, unfocused option labels.
+   */
   readonly defaultColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Initially selected values.
-  */
+   * Initially selected values.
+   */
   readonly defaultValue?: ReadonlyArray<string>;
   /**
-  * When true, all input is ignored and labels are dimmed.
-  * @default false
-  */
+   * 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
-  */
+   * 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.
-  */
+   * 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).
-  */
+   * 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.
-  */
+   * Fires when the user presses Enter to submit.
+   */
   readonly onSubmit?: (values: ReadonlyArray<string>) => void;
   /**
-  * Available choices to pick from.
-  */
+   * 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;
+ * 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/notification-badge.d.ts

@@ -3,45 +3,38 @@ import { ReactNode, ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type Props = {
   /**
-  * The element the badge is attached to (rendered before the badge).
-  */
+   * The element the badge is attached to (rendered before the badge).
+   */
   readonly children?: ReactNode;
   /**
-  * Badge background color.
-  * @default "red"
-  */
+   * Badge background color.
+   * @default "red"
+   */
   readonly color?: LiteralUnion<AnsiColors, string>;
   /**
-  * Numeric count. Values above `max` render as `{max}+`. A count of `0`
-  * hides the badge unless `showZero` is set.
-  */
+   * Numeric count. Values above `max` render as `{max}+`. A count of `0`
+   * hides the badge unless `showZero` is set.
+   */
   readonly count: number;
   /**
-  * Upper bound before the count is abbreviated with a trailing `+`.
-  * @default 99
-  */
+   * Upper bound before the count is abbreviated with a trailing `+`.
+   * @default 99
+   */
   readonly max?: number;
   /**
-  * Render the badge even when `count` is `0`.
-  * @default false
-  */
+   * Render the badge even when `count` is `0`.
+   * @default false
+   */
   readonly showZero?: boolean;
   /**
-  * Text color inside the badge.
-  * @default "white"
-  */
+   * Text color inside the badge.
+   * @default "white"
+   */
   readonly textColor?: LiteralUnion<AnsiColors, string>;
 };
 /**
-* A small count badge, optionally attached to a child element. Counts above
-* `max` are abbreviated (e.g. `99+`); a zero count is hidden unless `showZero`.
-*/
-declare function NotificationBadge({
-  children,
-  color,
-  count,
-  max,
-  showZero,
-  textColor
-}: Props): ReactElement;
+ * A small count badge, optionally attached to a child element. Counts above
+ * `max` are abbreviated (e.g. `99+`); a zero count is hidden unless `showZero`.
+ */
+declare function NotificationBadge({ children, color, count, max, showZero, textColor }: Props): ReactElement;
 export { NotificationBadge, type Props as NotificationBadgeProps, Props, NotificationBadge as default };

package/dist/number-input.d.ts

@@ -3,83 +3,69 @@ import { ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type Props = {
   /**
-  * Accent color for the border/caret when focused.
-  * @default "blue"
-  */
+   * Accent color for the border/caret when focused.
+   * @default "blue"
+   */
   readonly accentColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Auto-focus the input on mount.
-  */
+   * Auto-focus the input on mount.
+   */
   readonly autoFocus?: boolean;
   /**
-  * Initial value when uncontrolled.
-  */
+   * Initial value when uncontrolled.
+   */
   readonly defaultValue?: number;
   /**
-  * Disable input and dim the display.
-  */
+   * Disable input and dim the display.
+   */
   readonly isDisabled?: boolean;
   /**
-  * Upper bound. Values are clamped on commit and by the stepper.
-  */
+   * Upper bound. Values are clamped on commit and by the stepper.
+   */
   readonly max?: number;
   /**
-  * Lower bound. Values are clamped on commit and by the stepper.
-  */
+   * Lower bound. Values are clamped on commit and by the stepper.
+   */
   readonly min?: number;
   /**
-  * Fires whenever the numeric value changes.
-  */
+   * Fires whenever the numeric value changes.
+   */
   readonly onChange?: (value: number) => void;
   /**
-  * Fires when the user presses Enter.
-  */
+   * Fires when the user presses Enter.
+   */
   readonly onSubmit?: (value: number) => void;
   /**
-  * Placeholder rendered when the field is empty.
-  * @default "0"
-  */
+   * Placeholder rendered when the field is empty.
+   * @default "0"
+   */
   readonly placeholder?: string;
   /**
-  * Number of decimal places to allow and display. `0` restricts input to
-  * integers.
-  * @default 0
-  */
+   * Number of decimal places to allow and display. `0` restricts input to
+   * integers.
+   * @default 0
+   */
   readonly precision?: number;
   /**
-  * Show ▲/▼ stepper hints and let ↑/↓ adjust by `step`.
-  * @default true
-  */
+   * Show ▲/▼ stepper hints and let ↑/↓ adjust by `step`.
+   * @default true
+   */
   readonly showControls?: boolean;
   /**
-  * Increment applied by ↑/↓ (and Shift for 10× via PageUp/PageDown).
-  * @default 1
-  */
+   * Increment applied by ↑/↓ (and Shift for 10× via PageUp/PageDown).
+   * @default 1
+   */
   readonly step?: number;
   /**
-  * Controlled value. When provided, `defaultValue` is ignored.
-  */
+   * Controlled value. When provided, `defaultValue` is ignored.
+   */
   readonly value?: number;
 };
 /**
-* A keyboard-driven numeric input. Type digits (and `-`/`.` where allowed),
-* use ↑/↓ to step by `step`, PageUp/PageDown for 10× steps, and Enter to
-* submit. The raw text buffer is validated so partial entries like `-` or
-* `1.` are allowed while typing but clamped/parsed on change.
-*/
-declare function NumberInput({
-  accentColor,
-  autoFocus,
-  defaultValue,
-  isDisabled,
-  max,
-  min,
-  onChange,
-  onSubmit,
-  placeholder,
-  precision,
-  showControls,
-  step,
-  value: controlledValue
-}: Props): ReactElement;
+ * A keyboard-driven numeric input. Type digits (and `-`/`.` where allowed),
+ * use ↑/↓ to step by `step`, PageUp/PageDown for 10× steps, and Enter to
+ * submit. The raw text buffer is validated so partial entries like `-` or
+ * `1.` are allowed while typing but clamped/parsed on change.
+ */
+declare function NumberInput({ accentColor, autoFocus, defaultValue, isDisabled, max, min, onChange, onSubmit, placeholder, precision, showControls, step, value: controlledValue }: Props): ReactElement;
 export { NumberInput, type Props as NumberInputProps, Props, NumberInput as default };