@visulima/tui-kit 1.0.0 → 1.0.2

package/dist/form.d.ts

@@ -3,79 +3,72 @@ import { ReactNode, ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type FormFieldProps = {
   /**
-  * The input element (TextInput, Checkbox, Select, …).
-  */
+   * The input element (TextInput, Checkbox, Select, …).
+   */
   readonly children: ReactNode;
   /**
-  * Optional helper text rendered beneath the input.
-  */
+   * Optional helper text rendered beneath the input.
+   */
   readonly description?: string;
   /**
-  * Validation error — dimmed red below the input.
-  */
+   * Validation error — dimmed red below the input.
+   */
   readonly error?: string;
   /**
-  * When true, the field's label and description are dim.
-  */
+   * When true, the field's label and description are dim.
+   */
   readonly isDisabled?: boolean;
   /**
-  * Label rendered above the input.
-  */
+   * Label rendered above the input.
+   */
   readonly label: string;
   /**
-  * Mark the field as required (adds a trailing `*`).
-  */
+   * Mark the field as required (adds a trailing `*`).
+   */
   readonly required?: boolean;
 };
 /**
-* Standard form field wrapper: label + input + helper/error.
-*/
-declare const FormField: ({
-  children,
-  description,
-  error,
-  isDisabled,
-  label,
-  required
-}: FormFieldProps) => ReactElement;
+ * Standard form field wrapper: label + input + helper/error.
+ */
+declare const FormField: ({ children, description, error, isDisabled, label, required }: FormFieldProps) => ReactElement;
 type Props = {
   /**
-  * Accent color for the form chrome.
-  * @default "blue"
-  */
+   * Accent color for the form chrome.
+   * @default "blue"
+   */
   readonly accentColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Render a border around the form.
-  * @default true
-  */
+   * Render a border around the form.
+   * @default true
+   */
   readonly bordered?: boolean;
   /**
-  * Fields composed via `&lt;FormField />`.
-  */
+   * Fields composed via `&lt;FormField />`.
+   */
   readonly children: ReactNode;
   /**
-  * Optional description rendered under the title.
-  */
+   * Optional description rendered under the title.
+   */
   readonly description?: string;
   /**
-  * Optional footer rendered below the fields (buttons, hints, summary).
-  */
+   * Optional footer rendered below the fields (buttons, hints, summary).
+   */
   readonly footer?: ReactNode;
   /**
-  * Optional heading rendered at the top.
-  */
+   * Optional heading rendered at the top.
+   */
   readonly title?: string;
   /**
-  * Fixed width.
-  */
+   * Fixed width.
+   */
   readonly width?: number;
 };
 type FormComponent = ((props: Props) => ReactElement) & {
   Field: typeof FormField;
 };
 /**
-* Stateless form layout. Pair with the `useForm` hook for state management
-* and `FormField` for consistent label/error styling.
-*/
+ * Stateless form layout. Pair with the `useForm` hook for state management
+ * and `FormField` for consistent label/error styling.
+ */
 declare const Form: FormComponent;
 export { Form, FormField, FormFieldProps, type Props as FormProps, Props, Form as default };

package/dist/gauge.d.ts

@@ -3,85 +3,74 @@ import { ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type GaugeThreshold = {
   /**
-  * Color used for the arc segment and, when the current value falls into
-  * this segment, for the value readout.
-  */
+   * Color used for the arc segment and, when the current value falls into
+   * this segment, for the value readout.
+   */
   readonly color: LiteralUnion<AnsiColors, string>;
   /**
-  * Optional label used by the legend under the gauge.
-  */
+   * Optional label used by the legend under the gauge.
+   */
   readonly label?: string;
   /**
-  * Upper bound of this threshold segment (inclusive). Segments are sorted
-  * ascending and painted in order.
-  */
+   * Upper bound of this threshold segment (inclusive). Segments are sorted
+   * ascending and painted in order.
+   */
   readonly max: number;
 };
 type GaugeSize = "large" | "medium" | "small";
 type Props = {
   /**
-  * Color of the arc background (the portion beyond `value`).
-  * @default "gray"
-  */
+   * Color of the arc background (the portion beyond `value`).
+   * @default "gray"
+   */
   readonly backgroundColor?: LiteralUnion<AnsiColors, string>;
   /**
-  * Format for the numeric readout. Defaults to rounding to an integer.
-  */
+   * Format for the numeric readout. Defaults to rounding to an integer.
+   */
   readonly formatValue?: (value: number) => string;
   /**
-  * Optional label rendered above the readout.
-  */
+   * Optional label rendered above the readout.
+   */
   readonly label?: string;
   /**
-  * Upper bound of the range.
-  * @default 100
-  */
+   * Upper bound of the range.
+   * @default 100
+   */
   readonly max?: number;
   /**
-  * Lower bound of the range.
-  * @default 0
-  */
+   * Lower bound of the range.
+   * @default 0
+   */
   readonly min?: number;
   /**
-  * Show a legend listing thresholds below the gauge.
-  * @default false
-  */
+   * Show a legend listing thresholds below the gauge.
+   * @default false
+   */
   readonly showLegend?: boolean;
   /**
-  * Show a numeric readout in the middle of the gauge.
-  * @default true
-  */
+   * Show a numeric readout in the middle of the gauge.
+   * @default true
+   */
   readonly showValue?: boolean;
   /**
-  * Overall dimension preset.
-  * @default "medium"
-  */
+   * Overall dimension preset.
+   * @default "medium"
+   */
   readonly size?: GaugeSize;
   /**
-  * Color threshold ramp. When provided, segments of the arc are painted in
-  * the corresponding colors and the value readout picks up the color for
-  * the segment `value` lands in.
-  */
+   * Color threshold ramp. When provided, segments of the arc are painted in
+   * the corresponding colors and the value readout picks up the color for
+   * the segment `value` lands in.
+   */
   readonly thresholds?: ReadonlyArray<GaugeThreshold>;
   /**
-  * Current value. Clamped into the `[min, max]` range.
-  */
+   * Current value. Clamped into the `[min, max]` range.
+   */
   readonly value: number;
 };
 /**
-* Semi-circular gauge rendered at 2x4 sub-cell resolution. Supports colored
-* threshold segments and an optional needle.
-*/
-declare function Gauge({
-  backgroundColor,
-  formatValue,
-  label,
-  max,
-  min,
-  showLegend,
-  showValue,
-  size,
-  thresholds,
-  value
-}: Props): ReactElement;
+ * Semi-circular gauge rendered at 2x4 sub-cell resolution. Supports colored
+ * threshold segments and an optional needle.
+ */
+declare function Gauge({ backgroundColor, formatValue, label, max, min, showLegend, showValue, size, thresholds, value }: Props): ReactElement;
 export { Gauge, type Props as GaugeProps, GaugeSize, GaugeThreshold, Props, Gauge as default };

package/dist/gradient.d.ts

@@ -1,42 +1,38 @@
 import { multilineGradient } from '@visulima/colorize/gradient';
 import { ReactNode, ReactElement } from 'react';
 /**
-* A color stop for the gradient — hex string, CSS color name, RGB tuple, RGB object, or positioned stop.
-*/
+ * A color stop for the gradient — hex string, CSS color name, RGB tuple, RGB object, or positioned stop.
+ */
 type GradientStop = Parameters<typeof multilineGradient>[0][number];
 /**
-* Built-in gradient presets.
-*/
+ * Built-in gradient presets.
+ */
 type GradientName = "atlas" | "cristal" | "fruit" | "instagram" | "mind" | "morning" | "pastel" | "passion" | "rainbow" | "retro" | "summer" | "teen" | "vice";
 /**
-* Custom gradient colors — an array of color stops accepted by `@visulima/colorize`'s gradient API.
-*/
+ * Custom gradient colors — an array of color stops accepted by `@visulima/colorize`'s gradient API.
+ */
 type GradientColors = GradientStop[];
 type Props = {
   /**
-  * The content to colorize.
-  *
-  * Multiple `&lt;Text>` children are treated as separate nodes, which preserves layout when `&lt;Gradient>` is placed inside a `&lt;Box flexDirection="column">`.
-  *
-  * If you want a continuous gradient across multiple lines, pass a single string or a single `&lt;Text>` with `\n`.
-  */
+   * The content to colorize.
+   *
+   * Multiple `&lt;Text>` children are treated as separate nodes, which preserves layout when `&lt;Gradient>` is placed inside a `&lt;Box flexDirection="column">`.
+   *
+   * If you want a continuous gradient across multiple lines, pass a single string or a single `&lt;Text>` with `\n`.
+   */
   readonly children: ReactNode;
   /**
-  * [Colors to use to make the gradient.](https://visulima.com/packages/colorize)
-  *
-  * Mutually exclusive with `name`.
-  */
+   * [Colors to use to make the gradient.](https://visulima.com/packages/colorize)
+   *
+   * Mutually exclusive with `name`.
+   */
   readonly colors?: GradientColors;
   /**
-  * The name of a built-in gradient preset.
-  *
-  * Mutually exclusive with `colors`.
-  */
+   * The name of a built-in gradient preset.
+   *
+   * Mutually exclusive with `colors`.
+   */
   readonly name?: GradientName;
 };
-declare function Gradient({
-  children,
-  colors,
-  name
-}: Props): ReactElement | null;
+declare function Gradient({ children, colors, name }: Props): ReactElement | null;
 export { Gradient, type GradientColors, type GradientName, type Props as GradientProps, Props, Gradient as default };

package/dist/grid.d.ts

@@ -1,40 +1,34 @@
 import { ReactNode, ReactElement } from 'react';
 type Props = {
   /**
-  * The grid cells, filled left-to-right, top-to-bottom.
-  */
+   * The grid cells, filled left-to-right, top-to-bottom.
+   */
   readonly children: ReactNode;
   /**
-  * Horizontal gap between columns, in cells.
-  * @default 1
-  */
+   * Horizontal gap between columns, in cells.
+   * @default 1
+   */
   readonly columnGap?: number;
   /**
-  * Number of columns. Children wrap into as many rows as needed.
-  * @default 2
-  */
+   * Number of columns. Children wrap into as many rows as needed.
+   * @default 2
+   */
   readonly columns?: number;
   /**
-  * Fixed width for every column, in cells. Omit to let columns size to
-  * their content.
-  */
+   * Fixed width for every column, in cells. Omit to let columns size to
+   * their content.
+   */
   readonly columnWidth?: number;
   /**
-  * Vertical gap between rows, in cells.
-  * @default 0
-  */
+   * Vertical gap between rows, in cells.
+   * @default 0
+   */
   readonly rowGap?: number;
 };
 /**
-* A simple 2D grid: children flow left-to-right into a fixed number of columns,
-* wrapping to new rows. Column and row gaps are configurable, and columns can
-* be given a fixed width for uniform cells.
-*/
-declare function Grid({
-  children,
-  columnGap,
-  columns,
-  columnWidth,
-  rowGap
-}: Props): ReactElement;
+ * A simple 2D grid: children flow left-to-right into a fixed number of columns,
+ * wrapping to new rows. Column and row gaps are configurable, and columns can
+ * be given a fixed width for uniform cells.
+ */
+declare function Grid({ children, columnGap, columns, columnWidth, rowGap }: Props): ReactElement;
 export { Grid, type Props as GridProps, Props, Grid as default };

package/dist/heading.d.ts

@@ -4,30 +4,25 @@ import { LiteralUnion } from 'type-fest';
 type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 type Props = {
   /**
-  * Heading content.
-  */
+   * Heading content.
+   */
   readonly children: ReactNode;
   /**
-  * Explicit color. By default the color is derived from the level.
-  */
+   * Explicit color. By default the color is derived from the level.
+   */
   readonly color?: LiteralUnion<AnsiColors, string>;
   /**
-  * Heading level controls decoration and color.
-  * @default 1
-  */
+   * Heading level controls decoration and color.
+   * @default 1
+   */
   readonly level?: HeadingLevel;
   /**
-  * When true, renders an underline on a second line.
-  */
+   * When true, renders an underline on a second line.
+   */
   readonly underline?: boolean;
 };
 /**
-* Semantic heading with level-based styling.
-*/
-declare function Heading({
-  children,
-  color,
-  level,
-  underline
-}: Props): ReactElement;
+ * Semantic heading with level-based styling.
+ */
+declare function Heading({ children, color, level, underline }: Props): ReactElement;
 export { Heading, HeadingLevel, type Props as HeadingProps, Props, Heading as default };

package/dist/heatmap.d.ts

@@ -3,60 +3,50 @@ import { ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type HeatmapProps = {
   /**
-  * Width of each cell in character columns.
-  * @default 2
-  */
+   * Width of each cell in character columns.
+   * @default 2
+   */
   readonly cellWidth?: number;
   /**
-  * Glyph used to paint each heatmap cell. Defaults to `█` so the
-  * background color fills the cell.
-  * @default "█" (full block)
-  */
+   * Glyph used to paint each heatmap cell. Defaults to `█` so the
+   * background color fills the cell.
+   * @default "█" (full block)
+   */
   readonly character?: string;
   /**
-  * Column labels rendered below the grid.
-  */
+   * Column labels rendered below the grid.
+   */
   readonly columnLabels?: ReadonlyArray<string>;
   /**
-  * 2D matrix, rows × cols.
-  */
+   * 2D matrix, rows × cols.
+   */
   readonly data: ReadonlyArray<ReadonlyArray<number>>;
   /**
-  * Fixed maximum (for consistent scales across multiple heatmaps).
-  */
+   * Fixed maximum (for consistent scales across multiple heatmaps).
+   */
   readonly max?: number;
   /**
-  * Fixed minimum.
-  */
+   * Fixed minimum.
+   */
   readonly min?: number;
   /**
-  * Color palette, lowest-to-highest intensity. Values are mapped into the
-  * palette by their position in the [min, max] range.
-  * @default ["#0b1e4f", "#1f3b96", "#3258c8", "#4e84ec", "#78b0ff"]
-  */
+   * Color palette, lowest-to-highest intensity. Values are mapped into the
+   * palette by their position in the [min, max] range.
+   * @default ["#0b1e4f", "#1f3b96", "#3258c8", "#4e84ec", "#78b0ff"]
+   */
   readonly palette?: ReadonlyArray<string>;
   /**
-  * Row labels rendered to the left of the grid.
-  */
+   * Row labels rendered to the left of the grid.
+   */
   readonly rowLabels?: ReadonlyArray<string>;
   /**
-  * Foreground color override (rarely needed since the character is a full block).
-  */
+   * Foreground color override (rarely needed since the character is a full block).
+   */
   readonly textColor?: LiteralUnion<AnsiColors, string>;
 };
 /**
-* 2D heatmap. Each cell's background color is derived from its value's
-* position in the [min, max] range mapped into `palette`.
-*/
-declare function Heatmap({
-  cellWidth,
-  character,
-  columnLabels,
-  data,
-  max: maxOverride,
-  min: minOverride,
-  palette,
-  rowLabels,
-  textColor
-}: HeatmapProps): ReactElement;
+ * 2D heatmap. Each cell's background color is derived from its value's
+ * position in the [min, max] range mapped into `palette`.
+ */
+declare function Heatmap({ cellWidth, character, columnLabels, data, max: maxOverride, min: minOverride, palette, rowLabels, textColor }: HeatmapProps): ReactElement;
 export { Heatmap, HeatmapProps, Heatmap as default };

package/dist/help.d.ts

@@ -2,51 +2,44 @@ import { KeyBinding } from '@visulima/tui/hooks/use-key-bindings';
 import { ReactElement } from 'react';
 type Props = {
   /**
-  * Key bindings to display. Typically the `bindings` array returned by `useKeyBindings`.
-  */
+   * Key bindings to display. Typically the `bindings` array returned by `useKeyBindings`.
+   */
   readonly bindings: ReadonlyArray<KeyBinding>;
   /**
-  * Color for description text.
-  * @default undefined (uses dimColor)
-  */
+   * Color for description text.
+   * @default undefined (uses dimColor)
+   */
   readonly descriptionColor?: string;
   /**
-  * Color for key labels.
-  * @default "cyan"
-  */
+   * Color for key labels.
+   * @default "cyan"
+   */
   readonly keyColor?: string;
   /**
-  * Maximum number of columns in full mode.
-  * @default 3
-  */
+   * Maximum number of columns in full mode.
+   * @default 3
+   */
   readonly maxColumns?: number;
   /**
-  * Display mode.
-  * - `"short"`: Single-line horizontal bar, truncated to terminal width.
-  * - `"full"`: Multi-column layout grouped by `group` field.
-  * @default "short"
-  */
+   * Display mode.
+   * - `"short"`: Single-line horizontal bar, truncated to terminal width.
+   * - `"full"`: Multi-column layout grouped by `group` field.
+   * @default "short"
+   */
   readonly mode?: "full" | "short";
   /**
-  * Separator between key-description pairs in short mode.
-  * @default " \u00b7 "
-  */
+   * Separator between key-description pairs in short mode.
+   * @default " \u00b7 "
+   */
   readonly separator?: string;
 };
 /**
-* Renders a keybinding help bar from an array of `KeyBinding` definitions.
-*
-* ```tsx
-* &lt;Help bindings={bindings} />
-* &lt;Help bindings={bindings} mode="full" />
-* ```
-*/
-declare function Help({
-  bindings,
-  descriptionColor,
-  keyColor,
-  maxColumns,
-  mode,
-  separator
-}: Props): ReactElement;
+ * Renders a keybinding help bar from an array of `KeyBinding` definitions.
+ *
+ * ```tsx
+ * &lt;Help bindings={bindings} />
+ * &lt;Help bindings={bindings} mode="full" />
+ * ```
+ */
+declare function Help({ bindings, descriptionColor, keyColor, maxColumns, mode, separator }: Props): ReactElement;
 export { Help, type Props as HelpProps, Props, Help as default };

package/dist/histogram.d.ts

@@ -3,60 +3,50 @@ import { ReactElement } from 'react';
 import { LiteralUnion } from 'type-fest';
 type Props = {
   /**
-  * Number of equal-width buckets. Ignored if `thresholds` is set.
-  * @default 10
-  */
+   * Number of equal-width buckets. Ignored if `thresholds` is set.
+   * @default 10
+   */
   readonly bins?: number;
   /**
-  * Bar color.
-  */
+   * Bar color.
+   */
   readonly color?: LiteralUnion<AnsiColors, string>;
   /**
-  * Raw values to bin.
-  */
+   * Raw values to bin.
+   */
   readonly data: ReadonlyArray<number>;
   /**
-  * Plot height in character rows.
-  * @default 10
-  */
+   * Plot height in character rows.
+   * @default 10
+   */
   readonly height?: number;
   /**
-  * Optional fixed maximum.
-  */
+   * Optional fixed maximum.
+   */
   readonly max?: number;
   /**
-  * Optional fixed minimum.
-  */
+   * Optional fixed minimum.
+   */
   readonly min?: number;
   /**
-  * Render a numeric count above each bucket.
-  * @default false
-  */
+   * Render a numeric count above each bucket.
+   * @default false
+   */
   readonly showValues?: boolean;
   /**
-  * Explicit bin edges. When provided, `bins`, `min`, and `max` are ignored.
-  * Must be strictly increasing.
-  */
+   * Explicit bin edges. When provided, `bins`, `min`, and `max` are ignored.
+   * Must be strictly increasing.
+   */
   readonly thresholds?: ReadonlyArray<number>;
   /**
-  * Plot width in character columns.
-  */
+   * Plot width in character columns.
+   */
   readonly width?: number;
 };
 /**
-* Histogram built on top of BarChart. Bins the raw values (via explicit
-* thresholds or equal-width bins) and hands the counts off to BarChart.
-* @returns A `ReactElement` rendering a BarChart of bucket counts.
-*/
-declare function Histogram({
-  bins,
-  color,
-  data,
-  height,
-  max: maxOverride,
-  min: minOverride,
-  showValues,
-  thresholds,
-  width
-}: Props): ReactElement;
+ * Histogram built on top of BarChart. Bins the raw values (via explicit
+ * thresholds or equal-width bins) and hands the counts off to BarChart.
+ * @returns A `ReactElement` rendering a BarChart of bucket counts.
+ */
+declare function Histogram({ bins, color, data, height, max: maxOverride, min: minOverride, showValues, thresholds, width }: Props): ReactElement;
 export { Histogram, type Props as HistogramProps, Props, Histogram as default };