@longzai-intelligence-cli/tui 0.0.5

package/dist/index.d.ts

@@ -0,0 +1,131 @@
+import "./rolldown-runtime-BqT_7tdF.js";
+import { render } from "ink";
+import { FC, ReactElement, ReactNode } from "react";
+//#region src/render-app.d.ts
+/**
+ * ink 渲染实例类型
+ *
+ * 暴露给消费方，用于等待渲染就绪与卸载
+ */
+type RenderInstance = ReturnType<typeof render>;
+/**
+ * 渲染 TUI 应用
+ *
+ * 使用 ink 的 render 函数将 React 元素渲染到终端，
+ * 返回 ink 渲染实例以支持后续卸载与等待退出操作。
+ *
+ * @example
+ *   ```tsx
+ *   import { renderApp } from '@longzai-intelligence-cli/tui';
+ *   import { DataTable } from '@longzai-intelligence-cli/tui';
+ *
+ *   const instance = renderApp(<DataTable columns={...} rows={...} />);
+ *   instance.unmount();
+ *   ```;
+ *
+ * @param element - 要渲染的 React 元素
+ * @returns ink 渲染实例
+ */
+declare function renderApp(element: ReactElement): RenderInstance;
+//#endregion
+//#region src/components/data-table.d.ts
+/** 文本对齐方式 */
+type Align = 'left' | 'right';
+/** ink Text 支持的颜色字面量 */
+type TextColor = 'black' | 'red' | 'green' | 'yellow' | 'blue' | 'magenta' | 'cyan' | 'white' | 'gray' | 'grayBright' | 'redBright' | 'greenBright' | 'yellowBright' | 'blueBright' | 'magentaBright' | 'cyanBright' | 'whiteBright';
+/** 单元格取值方式：字段名或格式化器函数 */
+type CellAccessor<T> = keyof T | ((row: T) => string);
+/**
+ * 列定义
+ *
+ * @typeParam T - 行数据类型
+ */
+type Column<T> = {
+  /** 列标题（表头显示文本） */
+  header: string;
+  /** 列宽（字符数，用于 Box width） */
+  width: number;
+  /** 单元格取值：行字段名或自定义格式化器 */
+  cell: CellAccessor<T>;
+  /** 文本对齐，默认 left */
+  align?: Align;
+  /** 数据行文本颜色，默认不染色 */
+  color?: TextColor;
+};
+/** DataTable 组件属性 */
+type DataTableProps<T> = {
+  /** 列定义列表 */
+  columns: Array<Column<T>>;
+  /** 行数据列表 */
+  rows: T[];
+  /** 表格标题（显示在表头上方） */
+  title?: string;
+  /** 总记录数（用于标题展示，通常在分页时传入） */
+  total?: number;
+  /** 空态提示文本，默认"暂无数据" */
+  emptyText?: string;
+  /** 行 key 提取器，默认使用行索引字符串 */
+  rowKey?: (row: T, index: number) => string;
+};
+/**
+ * 泛型数据表格组件
+ *
+ * 渲染表格头部与各行数据，空列表时显示空态提示。
+ * 因 React FC 不支持泛型参数透传，采用泛型函数组件形式；
+ * 消费方可通过 JSX `<DataTable columns={...} rows={...} />` 或 `createElement(DataTable, {...})` 使用。
+ *
+ * @example
+ *   ```tsx
+ *   import { DataTable, type Column } from '@longzai-intelligence-cli/tui';
+ *
+ *   type Repo = { name: string; stars: number };
+ *   const columns: Column<Repo>[] = [
+ *     { header: '名称', width: 30, cell: 'name', color: 'blue' },
+ *     { header: 'Stars', width: 10, cell: (r) => String(r.stars), align: 'right' },
+ *   ];
+ *
+ *   <DataTable title="仓库列表" total={repos.length} columns={columns} rows={repos} />
+ *   ```;
+ *
+ * @typeParam T - 行数据类型
+ */
+declare function DataTable<T>(props: DataTableProps<T>): ReactElement;
+//#endregion
+//#region src/components/info-panel.d.ts
+/** InfoPanel 组件属性 */
+type InfoPanelProps = {
+  /** 面板标题（显示在顶部） */
+  title: string;
+  /** 面板内容 */
+  children: ReactNode;
+};
+/**
+ * 信息面板组件
+ *
+ * 以青色粗体标题 + 内容区形式渲染
+ *
+ * @example
+ *   ```tsx
+ *   <InfoPanel title="统计概览">
+ *     <Text>仓库总数：{stats.totalRepos}</Text>
+ *   </InfoPanel>
+ *   ```;
+ */
+declare const InfoPanel: FC<InfoPanelProps>;
+//#endregion
+//#region src/components/empty-state.d.ts
+/** 空态提示组件属性 */
+type EmptyStateProps = {
+  /** 提示文本（默认"暂无数据"） */
+  text?: string;
+};
+/**
+ * 空态提示组件
+ *
+ * 以暗色文本居中展示空态提示
+ *
+ * @param props - 组件属性
+ */
+declare const EmptyState: FC<EmptyStateProps>;
+//#endregion
+export { type Column, DataTable, type DataTableProps, EmptyState, InfoPanel, type RenderInstance, renderApp };

package/dist/index.js

@@ -0,0 +1 @@
+import"./rolldown-runtime-BqT_7tdF.js";import{Box as e,Text as t,render as n}from"ink";import{jsx as r,jsxs as i}from"react/jsx-runtime";function a(e){return n(e)}const o=({text:n=`暂无数据`})=>r(e,{padding:1,children:r(t,{dimColor:!0,children:n})});function s(e,t){if(typeof t==`function`)return t(e);let n=e[t];return n==null?`-`:String(n)}function c(n){let{columns:a,rows:c,title:l,total:u,emptyText:d=`暂无数据`,rowKey:f}=n;if(c.length===0)return r(o,{text:d});let p=a.reduce((e,t)=>e+t.width,0);return i(e,{flexDirection:`column`,padding:1,children:[l!==void 0&&i(t,{color:`cyan`,bold:!0,children:[l,u===void 0?``:`（共 ${u} 条）`]}),i(e,{marginTop:l===void 0?0:1,flexDirection:`column`,children:[r(e,{children:a.map(n=>r(e,{width:n.width,children:r(t,{bold:!0,color:`gray`,children:n.header})},n.header))}),r(t,{dimColor:!0,children:`─`.repeat(p)}),c.map((n,i)=>r(e,{children:a.map(i=>{let a=s(n,i.cell);return r(e,{width:i.width,children:i.color===void 0?r(t,{children:a}):r(t,{color:i.color,children:a})},i.header)})},f?.(n,i)??String(i)))]})]})}const l=({title:n,children:a})=>i(e,{flexDirection:`column`,padding:1,children:[r(t,{color:`cyan`,bold:!0,children:n}),r(e,{marginTop:1,flexDirection:`column`,children:a})]});export{c as DataTable,o as EmptyState,l as InfoPanel,a as renderApp};

package/dist/rolldown-runtime-BqT_7tdF.js

@@ -0,0 +1 @@
+import"node:module";export{};

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@longzai-intelligence-cli/tui",
+  "version": "0.0.5",
+  "private": false,
+  "keywords": [
+    "cli",
+    "ink",
+    "preset",
+    "react",
+    "tui"
+  ],
+  "license": "UNLICENSED",
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "build": "lzi-builder",
+    "build:prod": "NODE_ENV=production lzi-builder",
+    "prepublishOnly": "bun run build:prod",
+    "typecheck": "bun run typecheck:app && bun run typecheck:node && bun run typecheck:test",
+    "typecheck:app": "tsgo --noEmit -p tsconfig/app.json",
+    "typecheck:node": "tsgo --noEmit -p tsconfig/node.json",
+    "typecheck:test": "tsgo --noEmit -p tsconfig/test.json",
+    "lint": "oxlint && oxfmt --check",
+    "lint:fix": "oxlint --fix && oxfmt",
+    "test": "bun test",
+    "test:watch": "bun test --watch",
+    "test:coverage": "bun test --coverage",
+    "clean": "lzi-dev-cli clean"
+  },
+  "dependencies": {
+    "@longzai-intelligence-cli/core": "0.0.5",
+    "ink": "^5.0.1",
+    "react": "^19.2.6"
+  },
+  "devDependencies": {}
+}