npm - flowbook - Versions diffs - 0.1.4 → 0.1.6 - Mend

flowbook 0.1.4 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/README.ru.md DELETED Viewed

@@ -1,220 +0,0 @@
-# Flowbook
-> [English](./README.md) | [한국어](./README.ko.md) | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md) | [Español](./README.es.md) | [Português (BR)](./README.pt-BR.md) | [Français](./README.fr.md) | **Русский** | [Deutsch](./README.de.md)
-Storybook для блок-схем. Автоматически обнаруживает файлы диаграмм Mermaid в вашем коде, организует их по категориям и отображает в удобном просмотрщике.
-![Vite](https://img.shields.io/badge/vite-6.x-646CFF?logo=vite&logoColor=white)
-![React](https://img.shields.io/badge/react-19.x-61DAFB?logo=react&logoColor=white)
-![Mermaid](https://img.shields.io/badge/mermaid-11.x-FF3670?logo=mermaid&logoColor=white)
-![TypeScript](https://img.shields.io/badge/typescript-5.x-3178C6?logo=typescript&logoColor=white)
-## Быстрый Старт
-```bash
-# Инициализация — добавляет скрипты + файл-пример
-npx flowbook@latest init
-# Запуск сервера разработки
-npm run flowbook
-# → http://localhost:6200
-# Сборка статического сайта
-npm run build-flowbook
-# → flowbook-static/
-```
-## CLI
-```
-flowbook init                Настроить Flowbook в проекте
-flowbook dev  [--port 6200]  Запустить сервер разработки
-flowbook build [--out-dir d] Собрать статический сайт
-```
-### `flowbook init`
-- Добавляет скрипты `"flowbook"` и `"build-flowbook"` в ваш `package.json`
-- Создаёт `flows/example.flow.md` в качестве стартового шаблона
-### `flowbook dev`
-Запускает сервер разработки Vite на `http://localhost:6200` с поддержкой HMR. Любые изменения в файлах `.flow.md` или `.flowchart.md` отображаются мгновенно.
-### `flowbook build`
-Собирает статический сайт в `flowbook-static/` (настраивается через `--out-dir`). Разверните его где угодно.
-## Создание Файлов Потоков
-Создайте файл `.flow.md` (или `.flowchart.md`) в любом месте вашего проекта:
-````markdown
----
-title: Поток Авторизации
-category: Аутентификация
-tags: [auth, login, oauth]
-order: 1
-description: Поток аутентификации пользователя с OAuth2
----
-```mermaid
-flowchart TD
-    A[Пользователь] --> B{Авторизован?}
-    B -->|Да| C[Панель управления]
-    B -->|Нет| D[Страница входа]
-```
-````
-Flowbook автоматически обнаружит файл и добавит его в просмотрщик.
-## Схема Frontmatter
-| Поле          | Тип        | Обязательно | Описание                              |
-|---------------|------------|-------------|---------------------------------------|
-| `title`       | `string`   | Нет         | Отображаемый заголовок (по умолчанию: имя файла) |
-| `category`    | `string`   | Нет         | Категория в боковой панели (по умолчанию: "Uncategorized") |
-| `tags`        | `string[]` | Нет         | Фильтруемые теги                      |
-| `order`       | `number`   | Нет         | Порядок сортировки в категории (по умолчанию: 999) |
-| `description` | `string`   | Нет         | Описание в детальном просмотре        |
-## Обнаружение Файлов
-Flowbook по умолчанию сканирует следующие шаблоны:
-```
-**/*.flow.md
-**/*.flowchart.md
-```
-Игнорирует `node_modules/`, `.git/` и `dist/`.
-## Навык AI-агента
-`flowbook init` автоматически устанавливает навыки AI-агента во все поддерживаемые директории агентов кодирования.
-Когда агент кодирования (Claude Code, OpenAI Codex, VS Code Copilot, Cursor, Gemini CLI и т.д.) обнаружит ключевое слово **"flowbook"** в вашем промпте, он:
-1. Анализирует вашу базу кода на предмет логических потоков (API маршруты, аутентификация, управление состоянием, бизнес-логика и т.д.)
-2. Настраивает Flowbook, если он еще не инициализирован
-3. Генерирует файлы `.flow.md` с диаграммами Mermaid для каждого значимого потока
-4. Проверяет сборку
-### Установка навыка через CLI
-Вы также можете установить навык отдельно с помощью [skills.sh](https://skills.sh):
-```bash
-npx skills add Epsilondelta-ai/flowbook
-```
-Автоматически определяет установленные агенты кодирования и устанавливает навык в нужные директории.
-### Совместимые агенты
-| Агент | Местонахождение навыка |
-|-------|---------------|
-| Claude Code | `.claude/skills/flowbook/SKILL.md` |
-| OpenAI Codex | `.agents/skills/flowbook/SKILL.md` |
-| VS Code / GitHub Copilot | `.github/skills/flowbook/SKILL.md` |
-| Google Antigravity | `.agent/skills/flowbook/SKILL.md` |
-| Gemini CLI | `.gemini/skills/flowbook/SKILL.md` |
-| Cursor | `.cursor/skills/flowbook/SKILL.md` |
-| Windsurf (Codeium) | `.windsurf/skills/flowbook/SKILL.md` |
-| AmpCode | `.amp/skills/flowbook/SKILL.md` |
-| OpenCode / oh-my-opencode | `.opencode/skills/flowbook/SKILL.md` |
-<details>
-<summary>Ручная установка навыка</summary>
-Если вы не использовали `flowbook init` или `npx skills add`, скопируйте навык вручную:
-```bash
-# Пример: Claude Code
-mkdir -p .claude/skills/flowbook
-cp node_modules/flowbook/src/skills/flowbook/SKILL.md .claude/skills/flowbook/
-# Пример: Cursor
-mkdir -p .cursor/skills/flowbook
-cp node_modules/flowbook/src/skills/flowbook/SKILL.md .cursor/skills/flowbook/
-```
-Замените директорию на подходящий путь из таблицы совместимых агентов.
-</details>
-## Как Это Работает
-```
-файлы .flow.md ──→ Плагин Vite ──→ Виртуальный модуль ──→ React-просмотрщик
-                     │                    │
-                     ├─ сканирование      ├─ export default { flows: [...] }
-                     │  fast-glob         │
-                     ├─ gray-matter       └─ HMR при изменении файла
-                     │  парсинг
-                     └─ блок mermaid
-                        извлечение
-```
-1. **Обнаружение** — `fast-glob` сканирует проект в поисках `*.flow.md` / `*.flowchart.md`
-2. **Парсинг** — `gray-matter` извлекает YAML frontmatter; регулярные выражения извлекают блоки `` ```mermaid ``
-3. **Виртуальный модуль** — Плагин Vite предоставляет распарсенные данные как `virtual:flowbook-data`
-4. **Рендеринг** — React-приложение рендерит диаграммы Mermaid через `mermaid.render()`
-5. **HMR** — Изменения файлов инвалидируют виртуальный модуль, запуская перезагрузку
-## Структура Проекта
-```
-src/
-├── types.ts                    # Общие типы (FlowEntry, FlowbookData)
-├── node/
-│   ├── cli.ts                  # Точка входа CLI (init, dev, build)
-│   ├── server.ts               # Программный сервер Vite и сборка
-│   ├── init.ts                 # Логика инициализации проекта
-│   ├── discovery.ts            # Сканер файлов (fast-glob)
-│   ├── parser.ts               # Извлечение frontmatter + mermaid
-│   └── plugin.ts               # Плагин виртуального модуля Vite
-└── client/
-    ├── index.html              # Входной HTML
-    ├── main.tsx                # Точка входа React
-    ├── App.tsx                 # Макет с поиском + боковая панель + просмотрщик
-    ├── vite-env.d.ts           # Объявления типов виртуального модуля
-    ├── styles/globals.css      # Tailwind v4 + пользовательские стили
-    └── components/
-        ├── Header.tsx          # Логотип, поиск, количество потоков
-        ├── Sidebar.tsx         # Сворачиваемое дерево категорий
-        ├── MermaidRenderer.tsx # Рендеринг диаграмм Mermaid
-        ├── FlowView.tsx        # Детальный просмотр отдельного потока
-        └── EmptyState.tsx      # Пустое состояние с инструкцией
-```
-## Разработка (Вклад)
-```bash
-git clone https://github.com/Epsilondelta-ai/flowbook.git
-cd flowbook
-npm install
-# Локальная разработка (используется корневой vite.config.ts)
-npm run dev
-# Сборка CLI
-npm run build
-# Локальное тестирование CLI
-node dist/cli.js dev
-node dist/cli.js build
-```
-## Технологический Стек
-- **Vite** — Сервер разработки с HMR
-- **React 19** — Пользовательский интерфейс
-- **Mermaid 11** — Рендеринг диаграмм
-- **Tailwind CSS v4** — Стилизация
-- **gray-matter** — Парсинг YAML frontmatter
-- **fast-glob** — Обнаружение файлов
-- **tsup** — Сборщик CLI
-- **TypeScript** — Типобезопасность
-## Лицензия
-MIT

package/README.zh-CN.md DELETED Viewed

@@ -1,219 +0,0 @@
-# Flowbook
-> [English](./README.md) | [한국어](./README.ko.md) | **简体中文** | [日本語](./README.ja.md) | [Español](./README.es.md) | [Português (BR)](./README.pt-BR.md) | [Français](./README.fr.md) | [Русский](./README.ru.md) | [Deutsch](./README.de.md)
-流程图的 Storybook。自动发现代码库中的 Mermaid 图表文件，按类别组织，并在可浏览的查看器中渲染。
-![Vite](https://img.shields.io/badge/vite-6.x-646CFF?logo=vite&logoColor=white)
-![React](https://img.shields.io/badge/react-19.x-61DAFB?logo=react&logoColor=white)
-![Mermaid](https://img.shields.io/badge/mermaid-11.x-FF3670?logo=mermaid&logoColor=white)
-![TypeScript](https://img.shields.io/badge/typescript-5.x-3178C6?logo=typescript&logoColor=white)
-## 快速开始
-```bash
-# 初始化 — 添加脚本 + 示例文件
-npx flowbook@latest init
-# 启动开发服务器
-npm run flowbook
-# → http://localhost:6200
-# 构建静态站点
-npm run build-flowbook
-# → flowbook-static/
-```
-## CLI
-```
-flowbook init                在项目中设置 Flowbook
-flowbook dev  [--port 6200]  启动开发服务器
-flowbook build [--out-dir d] 构建静态站点
-```
-### `flowbook init`
-- 在 `package.json` 中添加 `"flowbook"` 和 `"build-flowbook"` 脚本
-- 创建 `flows/example.flow.md` 作为入门模板
-### `flowbook dev`
-在 `http://localhost:6200` 启动支持 HMR 的 Vite 开发服务器。任何 `.flow.md` 或 `.flowchart.md` 文件的更改都会即时生效。
-### `flowbook build`
-将静态站点构建到 `flowbook-static/` 目录（可通过 `--out-dir` 配置）。可部署到任何地方。
-## 编写流程文件
-在项目中任意位置创建 `.flow.md`（或 `.flowchart.md`）文件：
-````markdown
----
-title: 登录流程
-category: 认证
-tags: [auth, login, oauth]
-order: 1
-description: 使用 OAuth2 的用户认证流程
----
-```mermaid
-flowchart TD
-    A[用户] --> B{已认证?}
-    B -->|是| C[仪表盘]
-    B -->|否| D[登录页面]
-```
-````
-Flowbook 会自动发现文件并将其添加到查看器中。
-## Frontmatter 模式
-| 字段          | 类型       | 必填 | 说明                                |
-|---------------|------------|------|-------------------------------------|
-| `title`       | `string`   | 否   | 显示标题（默认为文件名）            |
-| `category`    | `string`   | 否   | 侧边栏分类（默认为 "Uncategorized"）|
-| `tags`        | `string[]` | 否   | 可筛选的标签                        |
-| `order`       | `number`   | 否   | 分类内排序（默认：999）             |
-| `description` | `string`   | 否   | 详情视图中显示的描述                |
-## 文件发现
-Flowbook 默认扫描以下模式：
-```
-**/*.flow.md
-**/*.flowchart.md
-```
-忽略 `node_modules/`、`.git/` 和 `dist/`。
-## AI Agent Skill
-`flowbook init` 自动将 AI 代理技能安装到所有支持的编码代理目录中。
-当编码代理（Claude Code、OpenAI Codex、VS Code Copilot、Cursor、Gemini CLI 等）检测到你的提示中有 **"flowbook"** 关键字时，它会：
-1. 分析你的代码库中的逻辑流（API 路由、认证、状态管理、业务逻辑等）
-2. 如果尚未初始化，设置 Flowbook
-3. 为每个重要流程生成包含 Mermaid 图表的 `.flow.md` 文件
-4. 验证构建
-### 通过 CLI 安装技能
-你也可以使用 [skills.sh](https://skills.sh) 独立安装技能：
-```bash
-npx skills add Epsilondelta-ai/flowbook
-```
-自动检测已安装的编码代理并将技能安装到正确的目录。
-### 兼容代理
-| 代理 | 技能位置 |
-|-------|---------------|
-| Claude Code | `.claude/skills/flowbook/SKILL.md` |
-| OpenAI Codex | `.agents/skills/flowbook/SKILL.md` |
-| VS Code / GitHub Copilot | `.github/skills/flowbook/SKILL.md` |
-| Google Antigravity | `.agent/skills/flowbook/SKILL.md` |
-| Gemini CLI | `.gemini/skills/flowbook/SKILL.md` |
-| Cursor | `.cursor/skills/flowbook/SKILL.md` |
-| Windsurf (Codeium) | `.windsurf/skills/flowbook/SKILL.md` |
-| AmpCode | `.amp/skills/flowbook/SKILL.md` |
-| OpenCode / oh-my-opencode | `.opencode/skills/flowbook/SKILL.md` |
-<details>
-<summary>手动技能安装</summary>
-如果你没有使用 `flowbook init` 或 `npx skills add`，请手动复制技能：
-```bash
-# 示例：Claude Code
-mkdir -p .claude/skills/flowbook
-cp node_modules/flowbook/src/skills/flowbook/SKILL.md .claude/skills/flowbook/
-# 示例：Cursor
-mkdir -p .cursor/skills/flowbook
-cp node_modules/flowbook/src/skills/flowbook/SKILL.md .cursor/skills/flowbook/
-```
-请参考上方兼容代理表格中的路径替换为适当的目录。
-</details>
-## 工作原理
-```
-.flow.md 文件 ──→ Vite 插件 ──→ 虚拟模块 ──→ React 查看器
-                    │                   │
-                    ├─ fast-glob 扫描   ├─ export default { flows: [...] }
-                    ├─ gray-matter      │
-                    │  解析             └─ 文件更改时 HMR
-                    └─ mermaid 块
-                       提取
-```
-1. **发现** — `fast-glob` 扫描项目中的 `*.flow.md` / `*.flowchart.md`
-2. **解析** — `gray-matter` 提取 YAML frontmatter；正则表达式提取 `` ```mermaid `` 块
-3. **虚拟模块** — Vite 插件将解析后的数据作为 `virtual:flowbook-data` 提供
-4. **渲染** — React 应用通过 `mermaid.render()` 渲染 Mermaid 图表
-5. **HMR** — 文件更改时使虚拟模块失效，触发重新加载
-## 项目结构
-```
-src/
-├── types.ts                    # 共享类型 (FlowEntry, FlowbookData)
-├── node/
-│   ├── cli.ts                  # CLI 入口 (init, dev, build)
-│   ├── server.ts               # 编程式 Vite 服务器与构建
-│   ├── init.ts                 # 项目初始化逻辑
-│   ├── discovery.ts            # 文件扫描器 (fast-glob)
-│   ├── parser.ts               # Frontmatter + mermaid 提取
-│   └── plugin.ts               # Vite 虚拟模块插件
-└── client/
-    ├── index.html              # 入口 HTML
-    ├── main.tsx                # React 入口
-    ├── App.tsx                 # 搜索 + 侧边栏 + 查看器布局
-    ├── vite-env.d.ts           # 虚拟模块类型声明
-    ├── styles/globals.css      # Tailwind v4 + 自定义样式
-    └── components/
-        ├── Header.tsx          # Logo、搜索栏、流程计数
-        ├── Sidebar.tsx         # 可折叠分类树
-        ├── MermaidRenderer.tsx # Mermaid 图表渲染
-        ├── FlowView.tsx        # 单个流程详情视图
-        └── EmptyState.tsx      # 空状态引导
-```
-## 开发（贡献）
-```bash
-git clone https://github.com/Epsilondelta-ai/flowbook.git
-cd flowbook
-npm install
-# 本地开发（使用根目录 vite.config.ts）
-npm run dev
-# 构建 CLI
-npm run build
-# 本地测试 CLI
-node dist/cli.js dev
-node dist/cli.js build
-```
-## 技术栈
-- **Vite** — 支持 HMR 的开发服务器
-- **React 19** — 用户界面
-- **Mermaid 11** — 图表渲染
-- **Tailwind CSS v4** — 样式
-- **gray-matter** — YAML frontmatter 解析
-- **fast-glob** — 文件发现
-- **tsup** — CLI 打包工具
-- **TypeScript** — 类型安全
-## 许可证
-MIT