npm - @thanhthi2895/luna-ai - Versions diffs - 2.16.2 - Mend

@thanhthi2895/luna-ai 2.16.2

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 (1275) hide show

package/agentic/opencode/.opencode/skills/mermaidjs-v11/references/integration.md ADDED Viewed

@@ -0,0 +1,310 @@
+# Mermaid.js Integration Patterns
+JavaScript API integration, HTML embedding, and platform-specific usage.
+## HTML/Browser Integration
+**Basic CDN Setup:**
+```html
+<!DOCTYPE html>
+<html>
+<head>
+  <script src="https://cdn.jsdelivr.net/npm/mermaid@latest/dist/mermaid.min.js"></script>
+</head>
+<body>
+  <pre class="mermaid">
+    flowchart TD
+      A[Client] --> B[Load Balancer]
+      B --> C[Server 1]
+      B --> D[Server 2]
+  </pre>
+  <script>
+    mermaid.initialize({ startOnLoad: true });
+  </script>
+</body>
+</html>
+```
+**ES Module (Modern):**
+```html
+<script type="module">
+  import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@latest/dist/mermaid.esm.min.mjs';
+  mermaid.initialize({ startOnLoad: true });
+</script>
+```
+## NPM/Node.js Integration
+**Installation:**
+```bash
+npm install mermaid
+# or
+yarn add mermaid
+```
+**Import and Initialize:**
+```javascript
+import mermaid from 'mermaid';
+mermaid.initialize({
+  startOnLoad: true,
+  theme: 'dark',
+  securityLevel: 'strict'
+});
+```
+**Manual Rendering:**
+```javascript
+import mermaid from 'mermaid';
+const graphDefinition = `
+  graph TD
+    A[Start] --> B[Process]
+    B --> C[End]
+`;
+const { svg } = await mermaid.render('graphId', graphDefinition);
+document.getElementById('container').innerHTML = svg;
+```
+## React Integration
+**Component Wrapper:**
+```jsx
+import { useEffect, useRef } from 'react';
+import mermaid from 'mermaid';
+function MermaidDiagram({ chart }) {
+  const ref = useRef(null);
+  useEffect(() => {
+    mermaid.initialize({ startOnLoad: false });
+    if (ref.current) {
+      mermaid.render('diagram', chart).then(({ svg }) => {
+        ref.current.innerHTML = svg;
+      });
+    }
+  }, [chart]);
+  return <div ref={ref} />;
+}
+// Usage
+<MermaidDiagram chart="graph TD\nA-->B" />
+```
+**Next.js (App Router):**
+```jsx
+'use client';
+import dynamic from 'next/dynamic';
+const Mermaid = dynamic(() => import('./MermaidDiagram'), {
+  ssr: false
+});
+export default function Page() {
+  return <Mermaid chart="flowchart TD\nA-->B" />;
+}
+```
+## Vue Integration
+**Component:**
+```vue
+<template>
+  <div ref="container"></div>
+</template>
+<script setup>
+import { ref, onMounted, watch } from 'vue';
+import mermaid from 'mermaid';
+const props = defineProps(['chart']);
+const container = ref(null);
+onMounted(() => {
+  mermaid.initialize({ startOnLoad: false });
+  renderDiagram();
+});
+watch(() => props.chart, renderDiagram);
+async function renderDiagram() {
+  const { svg } = await mermaid.render('diagram', props.chart);
+  container.value.innerHTML = svg;
+}
+</script>
+```
+## Markdown Integration
+**GitHub/GitLab:**
+````markdown
+```mermaid
+graph TD
+  A[Start] --> B[End]
+```
+````
+**MDX (Next.js/Gatsby):**
+```mdx
+import Mermaid from './Mermaid';
+# Architecture
+<Mermaid chart={`
+  flowchart LR
+    Client --> API
+    API --> Database
+`} />
+```
+## API Reference
+**mermaid.initialize(config)**
+Configure global settings.
+```javascript
+mermaid.initialize({
+  startOnLoad: true,
+  theme: 'dark',
+  logLevel: 3,
+  securityLevel: 'strict',
+  fontFamily: 'Arial'
+});
+```
+**mermaid.render(id, graphDefinition, config)**
+Programmatically render diagram.
+```javascript
+const { svg, bindFunctions } = await mermaid.render(
+  'uniqueId',
+  'graph TD\nA-->B',
+  { theme: 'forest' }
+);
+```
+**mermaid.parse(text)**
+Validate syntax without rendering.
+```javascript
+try {
+  await mermaid.parse('graph TD\nA-->B');
+  console.log('Valid');
+} catch(e) {
+  console.error('Invalid:', e);
+}
+```
+**mermaid.run(config)**
+Render all diagrams in page.
+```javascript
+await mermaid.run({
+  querySelector: '.mermaid',
+  suppressErrors: false
+});
+```
+## Event Handling
+**Click Events:**
+```javascript
+const graphDefinition = `
+  flowchart TD
+    A[Click me] --> B
+    click A callback "Tooltip text"
+`;
+window.callback = function() {
+  alert('Node clicked!');
+};
+await mermaid.render('graph', graphDefinition);
+```
+**Interactive URLs:**
+```
+flowchart TD
+  A[GitHub] --> B[Docs]
+  click A "https://github.com"
+  click B "https://mermaid.js.org" "Open docs"
+```
+## Advanced Patterns
+**Dynamic Theme Switching:**
+```javascript
+function updateTheme(isDark) {
+  mermaid.initialize({
+    theme: isDark ? 'dark' : 'default',
+    startOnLoad: false
+  });
+  // Re-render all diagrams
+  document.querySelectorAll('.mermaid').forEach(async (el) => {
+    const code = el.textContent;
+    const { svg } = await mermaid.render('id', code);
+    el.innerHTML = svg;
+  });
+}
+```
+**Lazy Loading:**
+```javascript
+const observer = new IntersectionObserver((entries) => {
+  entries.forEach(async (entry) => {
+    if (entry.isIntersecting) {
+      const code = entry.target.textContent;
+      const { svg } = await mermaid.render('id', code);
+      entry.target.innerHTML = svg;
+      observer.unobserve(entry.target);
+    }
+  });
+});
+document.querySelectorAll('.mermaid').forEach(el => observer.observe(el));
+```
+**Server-Side Rendering (SSR):**
+```javascript
+import { chromium } from 'playwright';
+async function renderServerSide(code) {
+  const browser = await chromium.launch();
+  const page = await browser.newPage();
+  await page.setContent(`
+    <script src="mermaid.min.js"></script>
+    <div class="mermaid">${code}</div>
+    <script>mermaid.initialize({ startOnLoad: true });</script>
+  `);
+  const svg = await page.locator('.mermaid svg').innerHTML();
+  await browser.close();
+  return svg;
+}
+```
+## Platform-Specific
+**Jupyter/Python:**
+Use mermaid.ink API:
+```python
+from IPython.display import Image
+diagram = "graph TD\nA-->B"
+url = f"https://mermaid.ink/svg/{diagram}"
+Image(url=url)
+```
+**VS Code:**
+Install "Markdown Preview Mermaid Support" extension.
+**Obsidian:**
+Native support in code blocks:
+````markdown
+```mermaid
+graph TD
+  A --> B
+```
+````
+**PowerPoint/Word:**
+Use mermaid.live editor → Export → Insert image.

package/agentic/opencode/.opencode/skills/onboard/SKILL.md ADDED Viewed

@@ -0,0 +1,161 @@
+---
+name: lu:onboard
+author: luna
+description: Analyze brownfield project (no docs) and auto-generate STRUCTURE.md and onboard-summary. Use when entering new project or when STRUCTURE.md doesn't exist.
+---
+# Skill: Onboard 🚀
+> **Objective**: Kickstart documentation for old project without STRUCTURE.md, helping Luna understand codebase on first encounter.
+> **Use `onboard` for:** existing projects with code but no Luna docs — deeply analyzes codebase to generate accurate docs.
+---
+## When to Use
+- User says: _"I have an old project"_, _"onboard this project for me"_, _"no docs"_
+- Luna detects `STRUCTURE.md` doesn't exist when starting a complex task
+---
+## Process (6 Steps)
+### Step 1 — Scan Project
+Read directory tree (max 3 levels deep):
+```bash
+# Priority read these files first:
+- package.json / pyproject.toml / Cargo.toml / go.mod  (stack detection)
+- README.md / README.rst                                 (overview)
+- .gitignore                                             (know what to skip)
+- tsconfig.json / vite.config / next.config              (main config)
+```
+Record:
+- Total files (estimate)
+- Root folders and level 1-2 subfolders
+> **If > 500 files**: only scan 2 levels, note "large project — needs manual review for nested modules"
+### Step 2 — Detect Stack
+From scanned config files:
+| Indicators                         | Stack                |
+| ---------------------------------- | -------------------- |
+| `react`, `next` in package.json    | React / Next.js      |
+| `vue`, `nuxt`                      | Vue / Nuxt           |
+| `svelte`                           | SvelteKit            |
+| `fastapi`, `django`, `flask`       | Python web           |
+| `express`, `fastify`, `nestjs`     | Node.js API          |
+| `tauri`                            | Desktop (Rust + web) |
+| `react-native`, `expo`             | Mobile               |
+Record: **main language**, **framework**, **test tool** (`jest/vitest/pytest/...`), **build tool**.
+### Step 3 — Classify Modules
+Look at level 1-2 folders, group by function:
+| Common Folders                          | Module Type           |
+| --------------------------------------- | --------------------- |
+| `src/components`, `app/`, `pages/`      | UI                    |
+| `src/api`, `server/`, `routes/`         | API                   |
+| `src/store`, `src/state`, `src/zustand` | State Management      |
+| `src/utils`, `src/helpers`, `lib/`      | Utilities             |
+| `src/types`, `src/interfaces`           | Types                 |
+| `src/hooks`                             | Custom Hooks          |
+| `src/services`                          | Services / Integration|
+| `tests/`, `__tests__/`, `spec/`         | Tests                 |
+| `agentic/antigravity/.agents/`, `.claude/`, `.gemini/`      | AI Framework          |
+| `scripts/`, `bin/`                      | Scripts / CLI         |
+| `public/`, `assets/`                    | Static Assets         |
+### Step 4 — Create STRUCTURE.md
+Write directly:
+```markdown
+# STRUCTURE.md — [Project Name]
+> Generated by: onboard skill (draft — review before use)
+> Date: [YYYY-MM-DD]
+> Stack: [language] + [framework]
+## Overview
+[1-2 sentences describing project from README]
+## Modules
+### [Module 1]
+- **Path**: `src/components/`
+- **Type**: UI Components
+- **Role**: [description]
+- **Key files**: [most important files]
+### [Module 2]
+...
+```
+Create file: `STRUCTURE.md` (at project root)
+### Step 5 — Create Onboard Summary
+Create `plans/reports/onboard-summary-[project-name].md`:
+```markdown
+# Onboard Summary — [Project Name]
+> Date: [YYYY-MM-DD]
+## Clearly Understood ✅
+- Stack and dependencies
+- Main directory structure
+- [...]
+## Still Unclear ⚠️
+- [Unclear point 1 — e.g.: not sure which state management library]
+- [Unclear point 2]
+## Needs Manual Review 🔍
+- [Folder/file needing human review]
+- [...]
+## Suggested Next Steps
+- Run `gkg` to build more detailed code graph (for TS/JS/Python projects)
+```
+### Step 6 — Report to User
+```
+✅ Onboard complete for [project name]!
+📁 Created:
+  - STRUCTURE.md                    (draft — needs review)
+  - plans/reports/onboard-summary-[project-name].md
+⚠️ Still unclear: [short list from summary]
+👉 Please:
+  1. Review STRUCTURE.md and edit if needed
+  2. Confirm: "OK, reviewed" for Luna to continue
+  3. Or: edit directly then let Luna know
+```
+---
+## Notes
+- **Output is draft** — always request user review, DO NOT auto-commit
+- **Large projects** (> 500 files): warn user, only scan 2 levels
+- **Monorepo**: scan each package separately, create STRUCTURE.md per package

package/agentic/opencode/.opencode/skills/plan/SKILL.md ADDED Viewed

@@ -0,0 +1,137 @@
+---
+name: lu:plan
+description: "Plan implementations, design architectures, create technical roadmaps with detailed phases. Use for feature planning, system design, solution architecture, implementation strategy, phase documentation."
+argument-hint: "[task] OR archive|red-team|validate"
+license: MIT
+---
+# Planning
+Create detailed technical implementation plans through research, codebase analysis, solution design, and comprehensive documentation.
+## Default (No Arguments)
+If invoked with a task description, proceed with planning workflow. If invoked WITHOUT arguments or with unclear intent, use `AskUserQuestion` to present available operations:
+| Operation | Description |
+|-----------|-------------|
+| `(default)` | Create implementation plan for a task |
+| `archive` | Write journal entry & archive plans |
+| `red-team` | Adversarial plan review |
+| `validate` | Critical questions interview |
+Present as options via `AskUserQuestion` with header "Planning Operation", question "What would you like to do?".
+## Workflow Modes
+Default: `--auto` (analyze task complexity and auto-pick mode).
+| Flag | Mode | Research | Red Team | Validation | Cook Flag |
+|------|------|----------|----------|------------|-----------|
+| `--auto` | Auto-detect | Follows mode | Follows mode | Follows mode | Follows mode |
+| `--fast` | Fast | Skip | Skip | Skip | `--auto` |
+| `--hard` | Hard | 2 researchers | Yes | Optional | (none) |
+| `--parallel` | Parallel | 2 researchers | Yes | Optional | `--parallel` |
+| `--two` | Two approaches | 2+ researchers | After selection | After selection | (none) |
+Add `--no-tasks` to skip task hydration in any mode.
+Load: `references/workflow-modes.md` for auto-detection logic, per-mode workflows, context reminders.
+## When to Use
+- Planning new feature implementations
+- Architecting system designs
+- Evaluating technical approaches
+- Creating implementation roadmaps
+- Breaking down complex requirements
+## Core Responsibilities & Rules
+Always honoring **YAGNI**, **KISS**, and **DRY** principles.
+**Be honest, be brutal, straight to the point, and be concise.**
+### 1. Research & Analysis
+Load: `references/research-phase.md`
+**Skip if:** Fast mode or provided with researcher reports
+### 2. Codebase Understanding
+Load: `references/codebase-understanding.md`
+**Skip if:** Provided with scout reports
+### 3. Solution Design
+Load: `references/solution-design.md`
+### 4. Plan Creation & Organization
+Load: `references/plan-organization.md`
+### 5. Task Breakdown & Output Standards
+Load: `references/output-standards.md`
+## Workflow Process
+1. **Pre-Creation Check** → Check Plan Context for active/suggested/none
+2. **Mode Detection** → Auto-detect or use explicit flag (see `workflow-modes.md`)
+3. **Research Phase** → Spawn researchers (skip in fast mode)
+4. **Codebase Analysis** → Read docs, scout if needed
+5. **Plan Documentation** → Write comprehensive plan via planner subagent
+6. **Red Team Review** → Use `Skill` tool: `plan:red-team {plan-path}` (hard/parallel/two modes)
+7. **Post-Plan Validation** → Use `Skill` tool: `plan:validate {plan-path}` (hard/parallel/two modes)
+8. **Hydrate Tasks** → Create Claude Tasks from phases (default on, `--no-tasks` to skip)
+9. **Context Reminder** → Output cook command with absolute path (MANDATORY)
+## Output Requirements
+- DO NOT implement code - only create plans
+- Respond with plan file path and summary
+- Ensure self-contained plans with necessary context
+- Include code snippets/pseudocode when clarifying
+- Fully respect the `./docs/development-rules.md` file
+## Task Management
+Plan files = persistent. Tasks = session-scoped. Hydration bridges the gap.
+**Default:** Auto-hydrate tasks after plan files are written. Skip with `--no-tasks`.
+**3-Task Rule:** <3 phases → skip task creation.
+Load: `references/task-management.md` for hydration pattern, TaskCreate patterns, cook handoff protocol.
+### Hydration Workflow
+1. Write plan.md + phase files (persistent layer)
+2. TaskCreate per phase with `addBlockedBy` chain
+3. TaskCreate for critical/high-risk steps within phases
+4. Metadata: phase, priority, effort, planDir, phaseFile
+5. Cook picks up via TaskList (same session) or re-hydrates (new session)
+## Active Plan State
+Check `## Plan Context` injected by hooks:
+- **"Plan: {path}"** → Active plan. Ask "Continue? [Y/n]"
+- **"Suggested: {path}"** → Branch hint only. Ask if activate or create new.
+- **"Plan: none"** → Create new using `Plan dir:` from `## Naming`
+After creating plan: `node ~/.config/opencode/scripts/set-active-plan.cjs {plan-dir}`
+Reports: Active plans → plan-specific path. Suggested → default path.
+### Important
+DO NOT create plans or reports in USER directory.
+ALWAYS create plans or reports in CURRENT WORKING PROJECT DIRECTORY.
+## Subcommands
+| Subcommand | Reference | Purpose |
+|------------|-----------|---------|
+| `/lu:plan archive` | `references/archive-workflow.md` | Archive plans + write journal entries |
+| `/lu:plan red-team` | `references/red-team-workflow.md` | Adversarial plan review with hostile reviewers |
+| `/lu:plan validate` | `references/validate-workflow.md` | Validate plan with critical questions interview |
+## Quality Standards
+- Thorough and specific, consider long-term maintainability
+- Research thoroughly when uncertain
+- Address security and performance concerns
+- Detailed enough for junior developers
+- Validate against existing codebase patterns
+**Remember:** Plan quality determines implementation success. Be comprehensive and consider all solution aspects.

package/agentic/opencode/.opencode/skills/plan/references/archive-workflow.md ADDED Viewed

@@ -0,0 +1,53 @@
+# Archive Workflow
+## Your mission
+Read and analyze the plans, then write journal entries and archive specific plans or all plans in the `plans` directory.
+## Plan Resolution
+1. If `$ARGUMENTS` provided → Use that path
+2. Else read all plans in the `plans` directory
+## Workflow
+### Step 1: Read Plan Files
+Read the plan directory:
+- `plan.md` - Overview and phases list
+- `phase-*.md` - 20 first lines of each phase file to understand the progress and status
+### Step 2: Summarize the plans and document them with `/lu:journal` slash command
+Use `AskUserQuestion` tool to ask if user wants to document journal entries or not.
+Skip this step if user selects "No".
+If user selects "Yes":
+- Analyze the information in previous steps.
+- Use Task tool with `subagent_type="journal-writer"` in parallel to document all plans.
+- Journal entries should be concise and focused on the most important events, key changes, impacts, and decisions.
+- Keep journal entries in the `./docs/journals/` directory.
+### Step 3: Ask user to confirm the action before archiving these plans
+Use `AskUserQuestion` tool to ask if user wants to proceed with archiving these plans, select specific plans to archive or all completed plans only.
+Use `AskUserQuestion` tool to ask if user wants to delete permanently or move to the `./plans/archive` directory.
+### Step 4: Archive the plans
+Start archiving the plans based on the user's choice:
+- Move the plans to the `./plans/archive` directory.
+- Delete the plans permanently: `rm -rf ./plans/<plan-1> ./plans/<plan-2> ...`
+### Step 5: Ask if user wants to commit the changes
+Use `AskUserQuestion` tool to ask if user wants to commit the changes with these options:
+- Stage and commit the changes (Use `/lu:git cm` slash command)
+- Commit and push the changes (Use `/lu:git cp` slash command)
+- Nah, I'll do it later
+## Output
+After archiving the plans, provide summary:
+- Number of plans archived
+- Number of plans deleted permanently
+- Table of plans that are archived or deleted (title, status, created date, LOC)
+- Table of journal entries that are created (title, status, created date, LOC)
+## Important Notes
+- Only ask questions about genuine decision points
+- Sacrifice grammar for concision
+- List any unresolved questions at the end
+- Ensure token efficiency while maintaining high quality