vibes-plug 1.0.0 → 2.5.0

package/skills/dependency-upgrade-migrator/SKILL.md

@@ -0,0 +1,295 @@
+---
+name: dependency-upgrade-migrator
+description: "Expert guide for dependency upgrades, breaking change migrations, codemod automation, and package audit remediation / Panduan ahli untuk upgrade dependensi, migrasi breaking change, otomasi codemod, dan remediasi audit paket."
+author: "Roedy Rustam"
+---
+
+# Dependency Upgrade Migrator (2026 Edition)
+
+[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)
+
+---
+
+<a name="english"></a>
+## English
+
+### Description
+Production-grade guide for safely upgrading dependencies, migrating through breaking changes, and maintaining healthy dependency trees. Covers **automated upgrade tooling** (`npm-check-updates`, `taze`, Renovate Bot), **major framework migration guides** (React 18→19, Next.js 14→15, Tailwind v3→v4), **codemod automation** (jscodeshift, ts-morph), **vulnerability remediation** (`npm audit`, `pnpm audit`), **lockfile hygiene**, **monorepo alignment** (pnpm catalogs), and **breaking change detection workflows**.
+
+### Trigger Conditions
+Activate this skill when:
+- Upgrading major versions of frameworks (React, Next.js, Tailwind, etc.).
+- Running security audits and remediating vulnerabilities.
+- Setting up automated dependency update bots (Renovate, Dependabot).
+- Writing or running codemods for API migration.
+- Cleaning up dependency trees and removing unused packages.
+- Aligning dependency versions across monorepo packages.
+
+---
+
+### 1. Upgrade Strategy Matrix
+
+| Upgrade Type | Risk Level | Strategy | Tools |
+|---|---|---|---|
+| **Patch** (1.0.x) | 🟢 Low | Auto-merge after tests pass | Renovate, Dependabot |
+| **Minor** (1.x.0) | 🟡 Medium | Auto-merge with manual review | Renovate + test suite |
+| **Major** (x.0.0) | 🔴 High | Manual review, migration guide, branch | Manual + codemods |
+| **Security** (any) | 🔴 Critical | Immediate upgrade, hotfix | `npm audit fix`, manual |
+
+---
+
+### 2. Pre-Upgrade Checklist
+
+```markdown
+- [ ] Run `pnpm audit` / `npm audit` to identify vulnerabilities
+- [ ] Check changelog/migration guide for the target version
+- [ ] Ensure test suite is passing on current version (baseline)
+- [ ] Create a dedicated branch for the upgrade
+- [ ] Check peer dependency compatibility
+- [ ] Review breaking changes list
+- [ ] Identify files that need codemod transformation
+- [ ] Back up lockfile before changes
+```
+
+---
+
+### 3. Automated Upgrade Tooling
+
+#### Checking for Updates
+```bash
+# Using taze (recommended — supports monorepos)
+npx taze major          # Show available major upgrades
+npx taze minor -w       # Auto-write minor updates to package.json
+npx taze -r             # Recursive (monorepo)
+
+# Using npm-check-updates
+npx ncu                 # Show available updates
+npx ncu -u              # Auto-write updates to package.json
+npx ncu --target minor  # Only show minor updates
+```
+
+#### Renovate Bot Configuration
+```json
+// renovate.json
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "extends": ["config:best-practices"],
+  "labels": ["dependencies"],
+  "schedule": ["after 10pm and before 5am every weekday"],
+  "packageRules": [
+    {
+      "matchUpdateTypes": ["patch"],
+      "automerge": true,
+      "automergeType": "pr"
+    },
+    {
+      "matchUpdateTypes": ["minor"],
+      "automerge": true,
+      "automergeType": "pr",
+      "requiredStatusChecks": ["ci/test", "ci/build"]
+    },
+    {
+      "matchUpdateTypes": ["major"],
+      "automerge": false,
+      "labels": ["major-upgrade", "manual-review"]
+    },
+    {
+      "matchPackageNames": ["typescript", "react", "next"],
+      "automerge": false,
+      "labels": ["core-dependency"]
+    }
+  ]
+}
+```
+
+---
+
+### 4. Major Framework Migration Guides
+
+#### React 18 → 19
+```typescript
+// Key breaking changes:
+// 1. forwardRef no longer needed (ref is a regular prop)
+// ❌ Before (React 18)
+const Input = forwardRef<HTMLInputElement, Props>((props, ref) => (
+  <input ref={ref} {...props} />
+));
+
+// ✅ After (React 19)
+function Input({ ref, ...props }: Props & { ref?: React.Ref<HTMLInputElement> }) {
+  return <input ref={ref} {...props} />;
+}
+
+// 2. useActionState replaces useFormState
+// ❌ Before: import { useFormState } from 'react-dom'
+// ✅ After:  import { useActionState } from 'react'
+
+// 3. use() hook for promises and context
+// ✅ New: const data = use(fetchPromise);
+// ✅ New: const theme = use(ThemeContext);
+```
+
+#### Next.js 14 → 15
+```typescript
+// Key changes:
+// 1. params/searchParams are now async in page/layout/route
+// ❌ Before: export default function Page({ params }: { params: { id: string } })
+// ✅ After:  export default async function Page({ params }: { params: Promise<{ id: string }> }) {
+//             const { id } = await params;
+
+// 2. Caching: fetch() no longer cached by default
+// ❌ Before: fetch() was cached by default
+// ✅ After:  fetch(url, { cache: 'force-cache' }) for explicit caching
+
+// 3. Route handlers: GET is no longer cached by default
+// Add: export const dynamic = 'force-static' if you want caching
+```
+
+#### Tailwind CSS v3 → v4
+```css
+/* Key changes: */
+/* 1. Configuration moves from JS to CSS */
+/* ❌ Before: tailwind.config.js with theme.extend */
+/* ✅ After: @theme directive in CSS */
+
+@import 'tailwindcss';
+
+@theme {
+  --color-primary: oklch(0.6 0.2 260);
+  --font-sans: 'Inter', sans-serif;
+  --breakpoint-sm: 40rem;
+}
+
+/* 2. No more @tailwind directives */
+/* ❌ Before: @tailwind base; @tailwind components; @tailwind utilities; */
+/* ✅ After:  @import 'tailwindcss'; */
+
+/* 3. Renamed utilities */
+/* ❌ Before: bg-opacity-50 */
+/* ✅ After:  bg-black/50 */
+```
+
+---
+
+### 5. Codemod Automation (jscodeshift)
+
+```typescript
+// codemods/remove-forward-ref.ts
+import type { API, FileInfo } from 'jscodeshift';
+
+export default function removeForwardRef(fileInfo: FileInfo, api: API) {
+  const j = api.jscodeshift;
+  const root = j(fileInfo.source);
+
+  // Find all forwardRef calls and transform them
+  root.find(j.CallExpression, {
+    callee: { name: 'forwardRef' },
+  }).forEach((path) => {
+    // Extract the inner component function
+    const args = path.node.arguments;
+    if (args.length > 0 && (args[0].type === 'ArrowFunctionExpression' || args[0].type === 'FunctionExpression')) {
+      // Replace forwardRef(...) with the inner function
+      j(path).replaceWith(args[0]);
+    }
+  });
+
+  // Remove forwardRef import
+  root.find(j.ImportSpecifier, { imported: { name: 'forwardRef' } }).remove();
+
+  return root.toSource({ quote: 'single' });
+}
+
+// Run: npx jscodeshift -t codemods/remove-forward-ref.ts src/ --extensions=tsx,ts
+```
+
+---
+
+### 6. Vulnerability Remediation
+
+```bash
+# Audit current state
+pnpm audit                          # Show vulnerabilities
+pnpm audit --fix                    # Auto-fix where possible
+
+# For stubborn transitive dependencies
+pnpm patch <package>@<version>      # Create a local patch
+# or
+pnpm overrides                      # Force specific version in package.json
+
+# package.json — Force resolution
+{
+  "pnpm": {
+    "overrides": {
+      "vulnerable-package": ">=2.0.0"
+    }
+  }
+}
+```
+
+---
+
+### 7. Dependency Cleanup
+
+```bash
+# Find unused dependencies
+npx depcheck                        # Detect unused deps
+npx depcheck --ignores="@types/*"   # Ignore type packages
+
+# Find duplicate packages
+pnpm dedupe                         # Deduplicate lockfile
+pnpm why <package>                  # See why a package is installed
+
+# Monorepo: Align versions with pnpm catalogs
+# pnpm-workspace.yaml
+catalog:
+  react: "^19.0.0"
+  typescript: "^5.7.0"
+  "@tanstack/react-query": "^5.60.0"
+```
+
+---
+
+### Common Pitfalls to Avoid
+
+| Anti-Pattern | Problem | Correct Approach |
+|---|---|---|
+| Upgrading all deps at once | Hard to identify breaking changes | Upgrade one major dep at a time |
+| Ignoring peer dependency warnings | Runtime errors, subtle bugs | Resolve all peer dep conflicts |
+| No test suite before upgrading | Can't verify nothing broke | Ensure tests pass before AND after |
+| `npm audit fix --force` blindly | Can introduce breaking changes | Review each fix manually for major bumps |
+| Skipping changelogs | Missing breaking changes | Always read CHANGELOG/migration guide |
+| No lockfile in version control | Non-reproducible builds | Always commit `pnpm-lock.yaml` |
+
+---
+
+### Integration with Other Skills
+
+- `monorepo-architect` — pnpm catalogs, workspace dependency alignment
+- `vibe-code-gardener` — Post-upgrade cleanup, dead code removal
+- `production-ready-hardener` — Security audit phase
+- `ci-cd-devops-architect` — Renovate Bot CI/CD integration
+- `e2e-testing-expert` — Regression testing after major upgrades
+
+---
+
+<a name="bahasa-indonesia"></a>
+## Bahasa Indonesia
+
+### Deskripsi
+Panduan tingkat produksi untuk upgrade dependensi yang aman, migrasi melalui breaking change, dan pemeliharaan dependency tree yang sehat. Mencakup **tooling upgrade otomatis** (`taze`, Renovate Bot), **panduan migrasi framework utama** (React 18→19, Next.js 14→15, Tailwind v3→v4), **otomasi codemod** (jscodeshift, ts-morph), **remediasi kerentanan** (`pnpm audit`), **kebersihan lockfile**, dan **penyelarasan dependensi monorepo** (pnpm catalogs).
+
+### Kondisi Pemicu
+Aktifkan skill ini ketika:
+- Mengupgrade versi mayor framework (React, Next.js, Tailwind, dll).
+- Menjalankan audit keamanan dan memperbaiki kerentanan.
+- Menyiapkan bot update dependensi otomatis (Renovate, Dependabot).
+- Menulis atau menjalankan codemod untuk migrasi API.
+- Membersihkan dependency tree dan menghapus paket yang tidak digunakan.
+
+### Integrasi dengan Skill Lain
+
+- `monorepo-architect` — pnpm catalogs, penyelarasan dependensi workspace
+- `vibe-code-gardener` — Pembersihan pasca-upgrade, penghapusan dead code
+- `production-ready-hardener` — Fase audit keamanan
+- `ci-cd-devops-architect` — Integrasi Renovate Bot CI/CD
+- `e2e-testing-expert` — Pengujian regresi setelah upgrade mayor

package/skills/design-system-architect/SKILL.md

@@ -1,7 +1,7 @@
 ---
 name: design-system-architect
 description: "Expert guide for designing, building, and maintaining scalable UI design systems with design tokens, headless primitives (Radix/Base UI), Tailwind v4 @theme, and WCAG 2.2 accessibility in English and Indonesian."
-author: "Roedy Rustam"
+author: vibes-plug-swarm
 ---
 
 # Design System Architect (2026 Edition — shadcn/ui Registry)
@@ -48,17 +48,17 @@ Expert guide for building and maintaining scalable UI design systems. Covers des
   --color-text-muted:  oklch(50% 0.015 250);
   --color-destructive: oklch(55% 0.22  25);    /* Red */
 
-  /* --- Typography --- */
+  /* --- Fluid Typography (clamp) --- */
   --font-sans: "Inter Variable", "Inter", ui-sans-serif, system-ui, sans-serif;
   --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
-  --font-size-xs:   0.75rem;
-  --font-size-sm:   0.875rem;
-  --font-size-base: 1rem;
-  --font-size-lg:   1.125rem;
-  --font-size-xl:   1.25rem;
-  --font-size-2xl:  1.5rem;
-  --font-size-3xl:  1.875rem;
-  --font-size-4xl:  2.25rem;
+  --font-size-xs:   clamp(0.7rem, 0.17vi + 0.66rem, 0.75rem);
+  --font-size-sm:   clamp(0.8rem, 0.17vi + 0.76rem, 0.875rem);
+  --font-size-base: clamp(0.9rem, 0.17vi + 0.86rem, 1rem);
+  --font-size-lg:   clamp(1rem, 0.17vi + 0.96rem, 1.125rem);
+  --font-size-xl:   clamp(1.1rem, 0.34vi + 1.02rem, 1.25rem);
+  --font-size-2xl:  clamp(1.2rem, 0.69vi + 1.03rem, 1.5rem);
+  --font-size-3xl:  clamp(1.5rem, 0.86vi + 1.29rem, 1.875rem);
+  --font-size-4xl:  clamp(1.8rem, 1.03vi + 1.54rem, 2.25rem);
 
   /* --- Spacing & Radius --- */
   --radius-sm:  0.25rem;
@@ -139,6 +139,17 @@ Button.displayName = 'Button';
 export { Button, buttonVariants };
 ```
 
+### Component Layout (Container Queries over Media Queries)
+Avoid `@media` queries for internal component styling. Use **CSS Container Queries (`@container`)** so components respond to their wrapper, not the viewport. This makes components truly reusable anywhere.
+```tsx
+// Example of a container-aware component using Tailwind v4
+<div className="@container">
+  <div className="flex flex-col @md:flex-row gap-4">
+    <div className="p-4 bg-surface rounded-xl">Fluid Card</div>
+  </div>
+</div>
+```
+
 ### shadcn/ui Registry — Distributable Components (2026)
 
 shadcn/ui v2 introduces a **registry** system — distribute your components as a shareable library that others can `npx shadcn add` into their projects:
@@ -228,6 +239,8 @@ Definisikan semua token di CSS menggunakan direktif `@theme`. Gunakan warna OKLC
 ### Arsitektur Komponen
 Gunakan pola Headless + Styled: primitif headless (Base UI/Radix) untuk aksesibilitas, gaya melalui Tailwind + CVA (class-variance-authority) untuk varian type-safe.
 
+**Container Queries (`@container`)**: DILARANG keras menggunakan `@media` query (misal `md:`, `lg:`) untuk layout di dalam sebuah komponen. Gunakan **Container Queries (`@md:`, `@lg:`)** agar komponen dapat menyesuaikan diri dengan lebar pembungkusnya, bukan lebar layar secara keseluruhan. Ini membuat komponen Anda 100% *reusable*.
+
 ### Registry shadcn/ui — Komponen yang Dapat Didistribusikan (2026)
 shadcn/ui v2 memperkenalkan sistem registry — distribusikan komponen Anda sebagai library yang dapat dibagikan sehingga orang lain dapat menginstalnya dengan `npx shadcn add [url] [komponen]`.
 
@@ -241,3 +254,7 @@ Base UI (dari tim MUI) adalah alternatif Radix UI untuk 2026 dengan dukungan nat
 - Navigasi keyboard berfungsi untuk semua interaksi.
 - Modal menjebak fokus dan memulihkannya saat ditutup.
 - Target sentuh ≥ 24×24px (persyaratan baru WCAG 2.2).
+
+
+## Orchestration & Integration
+- Integrates with frontend orchestrators, Tailwind v4, Base UI, and shadcn/ui.

package/skills/doku-mcp-server/SKILL.md

@@ -0,0 +1,251 @@
+---
+name: doku-mcp-server
+description: "Expert guide for DOKU Model Context Protocol (MCP) Server integration. Enables AI Agentic Commerce with tools for payment links, Virtual Accounts, QRIS, transaction status checks, and client configuration (Claude Desktop, Cursor, AGY) / Panduan ahli DOKU MCP Server untuk AI Agentic Commerce."
+author: "Roedy Rustam"
+---
+
+# DOKU MCP Server / Server Model Context Protocol DOKU
+
+[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)
+
+---
+
+<a name="english"></a>
+## English
+
+### Description
+Expert guide for integrating and building Model Context Protocol (MCP) servers with DOKU Payment Gateway based on [DOKU Developers Documentation](https://developers.doku.com/). Enables AI Agents (Claude Desktop, Antigravity, Cursor, n8n, LangChain) to execute payment tasks autonomously using Agentic Commerce capabilities (generating payment links, issuing Virtual Account numbers, generating QRIS codes, querying transaction statuses).
+
+### Trigger Conditions
+Activate this skill when the user is:
+- Setting up or configuring DOKU MCP server for Claude Desktop, Antigravity (AGY), Cursor, or LLM agents.
+- Implementing AI Agentic Commerce or autonomous AI-driven checkout workflows using DOKU.
+- Building a custom TypeScript or Python MCP server wrapping DOKU Jokul API.
+- Defining MCP tools and resources for payment generation and status verification.
+
+---
+
+### Key Capabilities & Tools
+
+| MCP Tool Name | Description | Key Input Parameters |
+|---|---|---|
+| `create_checkout_payment` | Generates a DOKU Checkout URL / Payment Link for host-managed payment page | `amount`, `invoice_number`, `customer_name`, `customer_email` |
+| `create_virtual_account` | Generates a specific bank Virtual Account number (BCA, Mandiri, BRI, BNI, Permata, DOKU) | `bank_code`, `amount`, `invoice_number`, `customer_name` |
+| `create_qris_payment` | Generates a dynamic QRIS string/image for instant wallet payments | `amount`, `invoice_number`, `store_name` |
+| `check_transaction_status` | Queries real-time transaction payment status | `invoice_number` or `transaction_id` |
+
+---
+
+### Client Configuration
+
+#### 1. Antigravity & Gemini Configuration (`mcp.json`)
+
+**Location:**
+- **Global:** `~/.gemini/config/mcp.json` (Windows: `%USERPROFILE%\.gemini\config\mcp.json`)
+- **Workspace:** `.agents/mcp.json` (in your project root)
+
+```json
+{
+  "mcpServers": {
+    "doku-payment": {
+      "command": "node",
+      "args": ["/path/to/doku-mcp-server/dist/index.js"],
+      "env": {
+        "DOKU_CLIENT_ID": "YOUR_SANDBOX_OR_PROD_CLIENT_ID",
+        "DOKU_SECRET_KEY": "YOUR_SANDBOX_OR_PROD_SECRET_KEY",
+        "DOKU_IS_PRODUCTION": "false"
+      }
+    }
+  }
+}
+```
+
+#### 2. Claude Desktop Configuration (`claude_desktop_config.json`)
+
+**Location:**
+- **Windows:** `%APPDATA%\Claude\claude_desktop_config.json`
+- **macOS:** `~/Library/Application Support/Claude/claude_desktop_config.json`
+
+```json
+{
+  "mcpServers": {
+    "doku-payment": {
+      "command": "node",
+      "args": ["/path/to/doku-mcp-server/dist/index.js"],
+      "env": {
+        "DOKU_CLIENT_ID": "YOUR_SANDBOX_OR_PROD_CLIENT_ID",
+        "DOKU_SECRET_KEY": "YOUR_SANDBOX_OR_PROD_SECRET_KEY",
+        "DOKU_IS_PRODUCTION": "false"
+      }
+    }
+  }
+}
+```
+
+#### 3. Environment Variables & Authentication
+DOKU API authentication requires API Key credentials. When using standard HTTP header authentication:
+- API Keys are configured in your environment or encoded as Base64 for the MCP `Authorization` header.
+- Use Sandbox (`https://api-sandbox.doku.com`) during development and testing.
+
+---
+
+### Building a Custom TypeScript MCP Server for DOKU
+
+```typescript
+import { Server } from '@modelcontextprotocol/sdk/server/index.js';
+import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
+import { CallToolRequestSchema, ListToolsRequestSchema } from '@modelcontextprotocol/sdk/types.js';
+import crypto from 'crypto';
+
+const CLIENT_ID = process.env.DOKU_CLIENT_ID || '';
+const SECRET_KEY = process.env.DOKU_SECRET_KEY || '';
+const BASE_URL = process.env.DOKU_IS_PRODUCTION === 'true' 
+  ? 'https://api.doku.com' 
+  : 'https://api-sandbox.doku.com';
+
+function generateHeaders(targetPath: string, payload: object) {
+  const requestId = crypto.randomUUID();
+  const timestamp = new Date().toISOString().replace(/\.\d{3}Z$/, 'Z');
+  const jsonBody = JSON.stringify(payload);
+  const digest = crypto.createHash('sha256').update(jsonBody, 'utf8').digest('base64');
+
+  const component = `Client-Id:${CLIENT_ID}\nRequest-Id:${requestId}\nRequest-Timestamp:${timestamp}\nRequest-Target:${targetPath}\nDigest:${digest}`;
+  const signature = 'HMACSHA256=' + crypto.createHmac('sha256', SECRET_KEY).update(component).digest('base64');
+
+  return {
+    'Content-Type': 'application/json',
+    'Client-Id': CLIENT_ID,
+    'Request-Id': requestId,
+    'Request-Timestamp': timestamp,
+    'Request-Target': targetPath,
+    'Digest': digest,
+    'Signature': signature
+  };
+}
+
+const server = new Server(
+  { name: 'doku-mcp-server', version: '1.0.0' },
+  { capabilities: { tools: {} } }
+);
+
+server.setRequestHandler(ListToolsRequestSchema, async () => ({
+  tools: [
+    {
+      name: 'create_checkout_payment',
+      description: 'Generate a DOKU payment checkout URL for customer order',
+      inputSchema: {
+        type: 'object',
+        properties: {
+          amount: { type: 'number', description: 'Total payment amount in IDR' },
+          invoice_number: { type: 'string', description: 'Unique order invoice number' },
+          customer_name: { type: 'string', description: 'Customer full name' },
+          customer_email: { type: 'string', description: 'Customer email address' }
+        },
+        required: ['amount', 'invoice_number', 'customer_name', 'customer_email']
+      }
+    },
+    {
+      name: 'check_transaction_status',
+      description: 'Check payment status of a transaction',
+      inputSchema: {
+        type: 'object',
+        properties: {
+          invoice_number: { type: 'string', description: 'Invoice number to query' }
+        },
+        required: ['invoice_number']
+      }
+    }
+  ]
+}));
+
+server.setRequestHandler(CallToolRequestSchema, async (request) => {
+  const { name, arguments: args } = request.params;
+
+  if (name === 'create_checkout_payment') {
+    const targetPath = '/checkout/v1/payment';
+    const body = {
+      order: { amount: args?.amount, invoice_number: args?.invoice_number },
+      customer: { name: args?.customer_name, email: args?.customer_email }
+    };
+
+    const response = await fetch(`${BASE_URL}${targetPath}`, {
+      method: 'POST',
+      headers: generateHeaders(targetPath, body),
+      body: JSON.stringify(body)
+    });
+
+    const data = await response.json();
+    return {
+      content: [{ type: 'text', text: JSON.stringify(data, null, 2) }]
+    };
+  }
+
+  throw new Error(`Tool not found: ${name}`);
+});
+
+async function main() {
+  const transport = new StdioServerTransport();
+  await server.connect(transport);
+}
+
+main().catch(console.error);
+```
+
+---
+
+### Common Pitfalls to Avoid
+
+| Anti-Pattern | Issue | Solution |
+|---|---|---|
+| Hardcoding Merchant Secrets | Security vulnerability | Always load `DOKU_CLIENT_ID` and `DOKU_SECRET_KEY` from environment variables. |
+| Incomplete Tool Schema Descriptions | AI Agent misinterprets tool usage | Provide clear parameter descriptions and strict `required` fields in JSON schema. |
+| Returning Raw Errors | Unfriendly LLM agent experience | Catch API errors and return structured error JSON response in MCP tool text output. |
+
+---
+
+<a name="bahasa-indonesia"></a>
+## Bahasa Indonesia
+
+### Deskripsi
+Panduan ahli untuk mengintegrasikan dan membuat server Model Context Protocol (MCP) dengan DOKU Payment Gateway berdasarkan dokumentasi resmi [DOKU Developers Documentation](https://developers.doku.com/). Memungkinkan Agen AI (Claude Desktop, Antigravity, Cursor, n8n, LangChain) menjalankan transaksi pembayaran secara otonom dalam alur Agentic Commerce (membuat link pembayaran, membuat nomor Virtual Account, membuat kode QRIS, dan memeriksa status transaksi).
+
+### Kondisi Pemicu
+Aktifkan skill ini ketika pengguna sedang:
+- Mengatur atau mengonfigurasi server DOKU MCP untuk Claude Desktop, Antigravity (AGY), Cursor, atau agen LLM.
+- Mengimplementasikan alur kerja checkout otonom berbasis AI (AI Agentic Commerce) menggunakan DOKU.
+- Membangun server MCP TypeScript atau Python kustom yang membungkus DOKU Jokul API.
+- Mendefinisikan tool dan resource MCP untuk pembuatan dan verifikasi status pembayaran.
+
+### Konfigurasi Client untuk Antigravity & Gemini
+
+**Lokasi File Konfigurasi (`mcp.json`):**
+- **Global:** `~/.gemini/config/mcp.json` (Windows: `%USERPROFILE%\.gemini\config\mcp.json`)
+- **Workspace:** `.agents/mcp.json` (di dalam folder proyek)
+
+```json
+{
+  "mcpServers": {
+    "doku-payment": {
+      "command": "node",
+      "args": ["/path/to/doku-mcp-server/dist/index.js"],
+      "env": {
+        "DOKU_CLIENT_ID": "CLIENT_ID_SANDBOX_ATAU_PROD",
+        "DOKU_SECRET_KEY": "SECRET_KEY_SANDBOX_ATAU_PROD",
+        "DOKU_IS_PRODUCTION": "false"
+      }
+    }
+  }
+}
+```
+
+### Integrasi dengan Skill Lain
+- `mcp-server-architect` — Untuk arsitektur dan pengamanan server MCP tingkat lanjut.
+- `doku-payment-gateway` — Untuk rumus signature HMAC-SHA256 dan API spesifik DOKU.
+- `multi-agent-orchestration` — Untuk mengaitkan DOKU MCP Server dengan swarm agen AI otonom.
+
+---
+### 🚨 SNAP Integration Mandate (CRITICAL)
+**MANDATORY**: The AI Agent MUST automatically apply the SNAP API v1.0 standard (Standard Nasional Open API Pembayaran) for all DOKU integrations, instead of the legacy Jokul API v2, unless the user explicitly requests otherwise. All generated signatures, headers, and endpoints MUST follow the SNAP BI standard.
+
+### 🧪 DOKU Sandbox Simulator
+**MANDATORY**: When testing in Sandbox mode and needing to access the Payment Simulator, the AI Agent MUST use this exact URL: `https://sandbox.doku.com/gtw-config-v2/simulator`.