@kud/ink-ui 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Erwann Mest
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,284 @@
+<div align="center">
+
+[![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?style=flat-square&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
+[![Node.js](https://img.shields.io/badge/Node.js-339933?style=flat-square&logo=node.js&logoColor=white)](https://nodejs.org/)
+[![npm](https://img.shields.io/badge/npm-%40kud%2Fink--ui-CB3837?style=flat-square&logo=npm&logoColor=white)](https://www.npmjs.com/package/@kud/ink-ui)
+[![MIT](https://img.shields.io/badge/licence-MIT-22C55E?style=flat-square)](./LICENSE)
+
+**Opinionated design-system library for Ink CLIs — pre-styled components and design tokens for a consistent terminal UI.**
+
+[Features](#-features) • [Quick Start](#-quick-start) • [Components](#-components) • [Tokens](#-design-tokens) • [Development](#-development)
+
+</div>
+
+---
+
+## ✨ Features
+
+- 🧱 **Five ready-made components** — Banner, Header, Badge, Spinner, and Table, all pre-styled and immediately usable
+- 🎨 **Design tokens included** — a shared colour palette and spacing scale to keep every screen consistent
+- 🟠 **Accent-driven style** — a warm `#FF8C00` accent colour gives your CLI a distinctive, coherent identity
+- ⚡ **ESM only, zero config** — ships compiled TypeScript with full type definitions; just import and render
+- 🔒 **Peer-dep friendly** — works with any Ink ≥ 4 and React ≥ 18 setup, no version lock-in
+- 🧩 **Composable** — every component accepts standard Ink primitives so you can mix them with your own layouts freely
+- 🏷 **Typed throughout** — exported types (`BadgeVariant`, `Column`, `Color`, `Spacing`) make props self-documenting in any IDE
+
+---
+
+## 🚀 Quick Start
+
+### Install
+
+```sh
+npm install @kud/ink-ui
+```
+
+`ink` and `react` are peer dependencies — add them if you haven't already:
+
+```sh
+npm install ink react
+```
+
+### Usage
+
+```tsx
+import React from "react"
+import { render } from "ink"
+import { Banner, Header, Badge, Spinner, Table } from "@kud/ink-ui"
+
+const App = () => (
+  <>
+    <Banner title="My CLI" subtitle="v1.0.0" icon="◆" />
+
+    <Header subtitle="Fetching packages…">Dependencies</Header>
+
+    <Badge variant="success">installed</Badge>
+    <Badge variant="warning">outdated</Badge>
+
+    <Spinner label="Loading…" />
+
+    <Table
+      columns={[
+        { key: "name", header: "Package", width: 20 },
+        { key: "version", header: "Version", width: 10 },
+      ]}
+      data={[
+        { name: "ink", version: "5.0.0" },
+        { name: "react", version: "18.3.1" },
+      ]}
+    />
+  </>
+)
+
+render(<App />)
+```
+
+Expected output (approximate terminal rendering):
+
+```
+◆ My CLI v1.0.0
+
+Dependencies
+Fetching packages…
+
+[installed] [outdated]
+
+⠋ Loading…
+
+Package              Version
+ink                  5.0.0
+react                18.3.1
+```
+
+---
+
+## 🧩 Components
+
+### `<Banner>`
+
+Full-width title block — ideal as an app header at the top of a screen.
+
+| Prop       | Type     | Default | Description                              |
+| ---------- | -------- | ------- | ---------------------------------------- |
+| `title`    | `string` | —       | Bold title text                          |
+| `subtitle` | `string` | —       | Optional dimmed subtitle rendered inline |
+| `icon`     | `string` | `"◆"`   | Leading icon rendered in accent colour   |
+
+```tsx
+<Banner title="Deploy Tool" subtitle="production" icon="🚀" />
+```
+
+---
+
+### `<Header>`
+
+Bold, underlined section heading. Use it to separate logical groups within a screen.
+
+| Prop       | Type     | Default | Description                                |
+| ---------- | -------- | ------- | ------------------------------------------ |
+| `children` | `string` | —       | The heading text                           |
+| `subtitle` | `string` | —       | Optional dimmed subtitle below the heading |
+
+```tsx
+<Header subtitle="3 items">Results</Header>
+```
+
+---
+
+### `<Badge>`
+
+Inline `[label]` tag with semantic colour variants.
+
+| Prop       | Type           | Default  | Description                          |
+| ---------- | -------------- | -------- | ------------------------------------ |
+| `children` | `string`       | —        | Label text displayed inside brackets |
+| `variant`  | `BadgeVariant` | `"info"` | Colour variant (see table below)     |
+
+| Variant   | Colour |
+| --------- | ------ |
+| `success` | green  |
+| `error`   | red    |
+| `warning` | yellow |
+| `info`    | cyan   |
+
+```tsx
+<Badge variant="error">failed</Badge>
+```
+
+---
+
+### `<Spinner>`
+
+Animated dots spinner in accent colour, with an optional dimmed label.
+
+| Prop    | Type     | Default | Description                               |
+| ------- | -------- | ------- | ----------------------------------------- |
+| `label` | `string` | —       | Optional text rendered beside the spinner |
+
+```tsx
+<Spinner label="Building…" />
+```
+
+---
+
+### `<Table>`
+
+Structured data grid with bold muted column headers. Supports optional fixed column widths and truncates long values cleanly.
+
+| Prop      | Type          | Description                    |
+| --------- | ------------- | ------------------------------ |
+| `data`    | `T[]`         | Array of row objects           |
+| `columns` | `Column<T>[]` | Column definitions (see below) |
+
+**`Column<T>` shape:**
+
+| Field    | Type      | Description                        |
+| -------- | --------- | ---------------------------------- |
+| `key`    | `keyof T` | Object key to read for this column |
+| `header` | `string`  | Column heading text                |
+| `width`  | `number`  | Optional fixed character width     |
+
+```tsx
+<Table
+  columns={[
+    { key: "name", header: "Name", width: 16 },
+    { key: "status", header: "Status" },
+  ]}
+  data={[
+    { name: "api", status: "ok" },
+    { name: "db", status: "degraded" },
+  ]}
+/>
+```
+
+---
+
+## 🎨 Design Tokens
+
+Import `colors` and `spacing` to keep your own components aligned with the design system.
+
+```ts
+import { colors, spacing } from "@kud/ink-ui"
+```
+
+### Colours
+
+| Token            | Value     | Semantic use                       |
+| ---------------- | --------- | ---------------------------------- |
+| `colors.accent`  | `#FF8C00` | Primary highlight, icons, spinners |
+| `colors.muted`   | `gray`    | Dimmed text, table headers         |
+| `colors.success` | `green`   | Positive states                    |
+| `colors.error`   | `red`     | Failures and errors                |
+| `colors.warning` | `yellow`  | Caution states                     |
+| `colors.info`    | `cyan`    | Neutral informational              |
+
+### Spacing
+
+| Token        | Value | Description                        |
+| ------------ | ----- | ---------------------------------- |
+| `spacing.xs` | `1`   | Tight gap between inline elements  |
+| `spacing.sm` | `2`   | Small margin between grouped items |
+| `spacing.md` | `3`   | Standard section margin            |
+| `spacing.lg` | `4`   | Large gap between major sections   |
+
+---
+
+## 🔧 Development
+
+### Project structure
+
+```
+ink-ui/
+├── src/
+│   ├── components/
+│   │   ├── Badge.tsx
+│   │   ├── Banner.tsx
+│   │   ├── Header.tsx
+│   │   ├── Spinner.tsx
+│   │   └── Table.tsx
+│   ├── index.ts        # public API
+│   └── tokens.ts       # colours + spacing
+├── dist/               # compiled output (git-ignored)
+├── tsconfig.json
+└── package.json
+```
+
+### Scripts
+
+| Script  | Command       | Description                          |
+| ------- | ------------- | ------------------------------------ |
+| `build` | `tsc`         | Compile TypeScript to `dist/`        |
+| `dev`   | `tsc --watch` | Watch mode — recompile on every save |
+
+### Local setup
+
+```sh
+git clone https://github.com/kud/ink-ui.git
+cd ink-ui
+npm install
+npm run build
+```
+
+To develop against a local project, link the package:
+
+```sh
+npm link
+cd ../your-project
+npm link @kud/ink-ui
+```
+
+---
+
+## 🏗 Tech Stack
+
+| Technology                                                 | Purpose                                |
+| ---------------------------------------------------------- | -------------------------------------- |
+| [TypeScript](https://www.typescriptlang.org/)              | Strict typing, declaration file output |
+| [Ink](https://github.com/vadimdemedes/ink)                 | React renderer for the terminal        |
+| [React](https://react.dev/)                                | Component model and JSX                |
+| [ink-spinner](https://github.com/vadimdemedes/ink-spinner) | Animated spinner primitive             |
+| ESM                                                        | Modern module format, no CommonJS      |
+
+---
+
+MIT © [kud](https://github.com/kud) — Made with ❤️

package/dist/components/Badge.d.ts

@@ -0,0 +1,8 @@
+export type BadgeVariant = "success" | "error" | "warning" | "info";
+type BadgeProps = {
+    children: string;
+    variant?: BadgeVariant;
+};
+export declare const Badge: ({ children, variant }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Badge.d.ts.map

package/dist/components/Badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAA;AAEnE,KAAK,UAAU,GAAG;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB,CAAA;AASD,eAAO,MAAM,KAAK,GAAI,uBAAgC,UAAU,4CAE/D,CAAA"}

package/dist/components/Badge.js

@@ -0,0 +1,11 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from "ink";
+import { colors } from "../tokens.js";
+const variantColor = {
+    success: colors.success,
+    error: colors.error,
+    warning: colors.warning,
+    info: colors.info,
+};
+export const Badge = ({ children, variant = "info" }) => (_jsxs(Text, { color: variantColor[variant], children: ["[", children, "]"] }));
+//# sourceMappingURL=Badge.js.map

package/dist/components/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AASrC,MAAM,YAAY,GAAiC;IACjD,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,IAAI,EAAE,MAAM,CAAC,IAAI;CAClB,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,MAAM,EAAc,EAAE,EAAE,CAAC,CACnE,MAAC,IAAI,IAAC,KAAK,EAAE,YAAY,CAAC,OAAO,CAAC,kBAAI,QAAQ,SAAS,CACxD,CAAA"}

package/dist/components/Banner.d.ts

@@ -0,0 +1,8 @@
+type BannerProps = {
+    title: string;
+    subtitle?: string;
+    icon?: string;
+};
+export declare const Banner: ({ title, subtitle, icon }: BannerProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Banner.d.ts.map

package/dist/components/Banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/components/Banner.tsx"],"names":[],"mappings":"AAIA,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,MAAM,GAAI,2BAAiC,WAAW,4CAMlE,CAAA"}

package/dist/components/Banner.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import { colors } from "../tokens.js";
+export const Banner = ({ title, subtitle, icon = "◆" }) => (_jsxs(Box, { gap: 1, marginBottom: 1, children: [_jsx(Text, { color: colors.accent, children: icon }), _jsx(Text, { bold: true, children: title }), subtitle && _jsx(Text, { dimColor: true, children: subtitle })] }));
+//# sourceMappingURL=Banner.js.map

package/dist/components/Banner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../src/components/Banner.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAQrC,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,GAAG,EAAe,EAAE,EAAE,CAAC,CACtE,MAAC,GAAG,IAAC,GAAG,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,aAC1B,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,YAAG,IAAI,GAAQ,EACzC,KAAC,IAAI,IAAC,IAAI,kBAAE,KAAK,GAAQ,EACxB,QAAQ,IAAI,KAAC,IAAI,IAAC,QAAQ,kBAAE,QAAQ,GAAQ,IACzC,CACP,CAAA"}

package/dist/components/Header.d.ts

@@ -0,0 +1,7 @@
+type HeaderProps = {
+    children: string;
+    subtitle?: string;
+};
+export declare const Header: ({ children, subtitle }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Header.d.ts.map

package/dist/components/Header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/components/Header.tsx"],"names":[],"mappings":"AAGA,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,eAAO,MAAM,MAAM,GAAI,wBAAwB,WAAW,4CAOzD,CAAA"}

package/dist/components/Header.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+export const Header = ({ children, subtitle }) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, underline: true, children: children }), subtitle && _jsx(Text, { dimColor: true, children: subtitle })] }));
+//# sourceMappingURL=Header.js.map

package/dist/components/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/components/Header.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAO/B,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAe,EAAE,EAAE,CAAC,CAC7D,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,EAAC,YAAY,EAAE,CAAC,aACzC,KAAC,IAAI,IAAC,IAAI,QAAC,SAAS,kBACjB,QAAQ,GACJ,EACN,QAAQ,IAAI,KAAC,IAAI,IAAC,QAAQ,kBAAE,QAAQ,GAAQ,IACzC,CACP,CAAA"}

package/dist/components/Spinner.d.ts

@@ -0,0 +1,6 @@
+type SpinnerProps = {
+    label?: string;
+};
+export declare const Spinner: ({ label }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Spinner.d.ts.map

package/dist/components/Spinner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/components/Spinner.tsx"],"names":[],"mappings":"AAKA,KAAK,YAAY,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,eAAO,MAAM,OAAO,GAAI,WAAW,YAAY,4CAO9C,CAAA"}

package/dist/components/Spinner.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import InkSpinner from "ink-spinner";
+import { colors } from "../tokens.js";
+export const Spinner = ({ label }) => (_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: colors.accent, children: _jsx(InkSpinner, { type: "dots" }) }), label && _jsx(Text, { dimColor: true, children: label })] }));
+//# sourceMappingURL=Spinner.js.map

package/dist/components/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../src/components/Spinner.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,UAAU,MAAM,aAAa,CAAA;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAMrC,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,KAAK,EAAgB,EAAE,EAAE,CAAC,CAClD,MAAC,GAAG,IAAC,GAAG,EAAE,CAAC,aACT,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,YACxB,KAAC,UAAU,IAAC,IAAI,EAAC,MAAM,GAAG,GACrB,EACN,KAAK,IAAI,KAAC,IAAI,IAAC,QAAQ,kBAAE,KAAK,GAAQ,IACnC,CACP,CAAA"}

package/dist/components/Table.d.ts

@@ -0,0 +1,12 @@
+export type Column<T extends Record<string, unknown>> = {
+    key: keyof T & string;
+    header: string;
+    width?: number;
+};
+type TableProps<T extends Record<string, unknown>> = {
+    data: T[];
+    columns: Column<T>[];
+};
+export declare const Table: <T extends Record<string, unknown>>({ data, columns, }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Table.d.ts.map

package/dist/components/Table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/components/Table.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,MAAM,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACtD,GAAG,EAAE,MAAM,CAAC,GAAG,MAAM,CAAA;IACrB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,KAAK,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACnD,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAA;CACrB,CAAA;AAED,eAAO,MAAM,KAAK,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,oBAGtD,UAAU,CAAC,CAAC,CAAC,4CAqBf,CAAA"}

package/dist/components/Table.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import { colors } from "../tokens.js";
+export const Table = ({ data, columns, }) => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { gap: 2, children: columns.map((col) => (_jsx(Box, { width: col.width, minWidth: col.width, children: _jsx(Text, { bold: true, color: colors.muted, children: col.header }) }, col.key))) }), data.map((row, i) => (_jsx(Box, { gap: 2, children: columns.map((col) => (_jsx(Box, { width: col.width, minWidth: col.width, children: _jsx(Text, { wrap: "truncate-end", children: String(row[col.key] ?? "") }) }, col.key))) }, i)))] }));
+//# sourceMappingURL=Table.js.map

package/dist/components/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../src/components/Table.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAarC,MAAM,CAAC,MAAM,KAAK,GAAG,CAAoC,EACvD,IAAI,EACJ,OAAO,GACO,EAAE,EAAE,CAAC,CACnB,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,aACzB,KAAC,GAAG,IAAC,GAAG,EAAE,CAAC,YACR,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,KAAC,GAAG,IAAe,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,GAAG,CAAC,KAAK,YACtD,KAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,MAAM,CAAC,KAAK,YAC3B,GAAG,CAAC,MAAM,GACN,IAHC,GAAG,CAAC,GAAG,CAIX,CACP,CAAC,GACE,EACL,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CACpB,KAAC,GAAG,IAAS,GAAG,EAAE,CAAC,YAChB,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,KAAC,GAAG,IAAe,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,GAAG,CAAC,KAAK,YACtD,KAAC,IAAI,IAAC,IAAI,EAAC,cAAc,YAAE,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,GAAQ,IADrD,GAAG,CAAC,GAAG,CAEX,CACP,CAAC,IALM,CAAC,CAML,CACP,CAAC,IACE,CACP,CAAA"}

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export { Banner } from "./components/Banner.js";
+export { Badge } from "./components/Badge.js";
+export type { BadgeVariant } from "./components/Badge.js";
+export { Header } from "./components/Header.js";
+export { Spinner } from "./components/Spinner.js";
+export { Table } from "./components/Table.js";
+export type { Column } from "./components/Table.js";
+export { colors, spacing } from "./tokens.js";
+export type { Color, Spacing } from "./tokens.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAC7C,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAA;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAC7C,YAAY,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAC7C,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA"}

package/dist/index.js

@@ -0,0 +1,7 @@
+export { Banner } from "./components/Banner.js";
+export { Badge } from "./components/Badge.js";
+export { Header } from "./components/Header.js";
+export { Spinner } from "./components/Spinner.js";
+export { Table } from "./components/Table.js";
+export { colors, spacing } from "./tokens.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAA;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAE7C,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA"}

package/dist/tokens.d.ts

@@ -0,0 +1,17 @@
+export declare const colors: {
+    readonly accent: "#FF8C00";
+    readonly muted: "gray";
+    readonly success: "green";
+    readonly error: "red";
+    readonly warning: "yellow";
+    readonly info: "cyan";
+};
+export type Color = (typeof colors)[keyof typeof colors];
+export declare const spacing: {
+    readonly xs: 1;
+    readonly sm: 2;
+    readonly md: 3;
+    readonly lg: 4;
+};
+export type Spacing = (typeof spacing)[keyof typeof spacing];
+//# sourceMappingURL=tokens.d.ts.map

package/dist/tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;CAOT,CAAA;AAEV,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,MAAM,CAAC,CAAC,MAAM,OAAO,MAAM,CAAC,CAAA;AAExD,eAAO,MAAM,OAAO;;;;;CAKV,CAAA;AAEV,MAAM,MAAM,OAAO,GAAG,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAA"}

package/dist/tokens.js

@@ -0,0 +1,15 @@
+export const colors = {
+    accent: "#FF8C00",
+    muted: "gray",
+    success: "green",
+    error: "red",
+    warning: "yellow",
+    info: "cyan",
+};
+export const spacing = {
+    xs: 1,
+    sm: 2,
+    md: 3,
+    lg: 4,
+};
+//# sourceMappingURL=tokens.js.map

package/dist/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,OAAO;IAChB,KAAK,EAAE,KAAK;IACZ,OAAO,EAAE,QAAQ;IACjB,IAAI,EAAE,MAAM;CACJ,CAAA;AAIV,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;CACG,CAAA"}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@kud/ink-ui",
+  "version": "0.1.0",
+  "description": "React component library for Ink CLIs",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc --watch"
+  },
+  "peerDependencies": {
+    "ink": ">=4.0.0",
+    "react": ">=18.0.0"
+  },
+  "dependencies": {
+    "ink-spinner": "^5.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.0",
+    "ink": "^5.0.0",
+    "react": "^18.0.0",
+    "typescript": "^5.0.0"
+  },
+  "keywords": [
+    "ink",
+    "cli",
+    "react",
+    "terminal",
+    "ui",
+    "components"
+  ],
+  "license": "MIT",
+  "homepage": "https://kud.github.io/ink-ui",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/kud/ink-ui"
+  }
+}