sanjang 0.3.1 → 0.3.3

package/dashboard/style.css

@@ -2110,3 +2110,309 @@ header.hidden {
   color: var(--text-muted, #666);
   flex: 1;
 }
+
+/* ============================================================
+   Basecamp Scene
+   ============================================================ */
+
+.bc-scene {
+  position: relative;
+  height: 200px;
+  background: linear-gradient(180deg, #080a10 0%, #0c0e14 60%, #12151e 100%);
+  border-radius: 12px;
+  overflow: hidden;
+  border: 1px solid #1c2030;
+}
+
+/* Stars */
+.bc-star {
+  position: absolute;
+  width: 4px;
+  height: 4px;
+  background: #fff;
+  image-rendering: pixelated;
+}
+
+.bc-star.twinkle {
+  animation: twinkle 2s steps(2) infinite;
+}
+
+.bc-star.twinkle-slow {
+  animation: twinkle 3.5s steps(2) infinite 0.8s;
+}
+
+@keyframes twinkle {
+  0%, 100% { opacity: 0.6; }
+  50% { opacity: 0.1; }
+}
+
+/* Mountains */
+.bc-mountain {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  image-rendering: pixelated;
+}
+
+.bc-mountain-back {
+  height: 100px;
+  background: #1a1d2a;
+  clip-path: polygon(
+    0% 100%, 0% 70%, 5% 70%, 5% 60%, 10% 60%, 10% 50%, 15% 50%, 15% 40%,
+    20% 40%, 20% 35%, 25% 35%, 25% 45%, 30% 45%, 30% 55%, 35% 55%, 35% 50%,
+    40% 50%, 40% 35%, 45% 35%, 45% 25%, 50% 25%, 50% 20%, 55% 20%, 55% 30%,
+    60% 30%, 60% 40%, 65% 40%, 65% 50%, 70% 50%, 70% 40%, 75% 40%, 75% 50%,
+    80% 50%, 80% 60%, 85% 60%, 85% 70%, 90% 70%, 90% 80%, 95% 80%, 100% 80%,
+    100% 100%
+  );
+}
+
+.bc-mountain-front {
+  height: 80px;
+  background: #12151e;
+  clip-path: polygon(
+    0% 100%, 0% 80%, 5% 80%, 5% 70%, 10% 70%, 10% 55%, 15% 55%, 15% 45%,
+    20% 45%, 20% 40%, 25% 40%, 25% 50%, 30% 50%, 30% 60%, 35% 60%, 35% 55%,
+    40% 55%, 40% 40%, 45% 40%, 45% 30%, 48% 30%, 48% 25%, 52% 25%, 52% 20%,
+    55% 20%, 55% 30%, 58% 30%, 58% 40%, 62% 40%, 62% 50%, 65% 50%, 65% 45%,
+    70% 45%, 70% 35%, 75% 35%, 75% 45%, 80% 45%, 80% 55%, 85% 55%, 85% 65%,
+    90% 65%, 90% 75%, 95% 75%, 95% 85%, 100% 85%, 100% 100%
+  );
+}
+
+/* Snow caps */
+.bc-snow {
+  position: absolute;
+  height: 4px;
+  background: rgba(255, 255, 255, 0.25);
+  image-rendering: pixelated;
+}
+
+/* Campfire glow */
+.bc-glow {
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 80px;
+  height: 40px;
+  background: radial-gradient(ellipse at center bottom, rgba(255, 140, 50, 0.15) 0%, transparent 70%);
+  animation: glow-pulse 2s ease infinite;
+}
+
+@keyframes glow-pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.6; }
+}
+
+/* Campfire pixel */
+.bc-campfire {
+  position: absolute;
+  bottom: 12px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 4px;
+  height: 4px;
+  background: #8b4513;
+  image-rendering: pixelated;
+  box-shadow:
+    -4px 0 0 #8b4513,
+     4px 0 0 #8b4513,
+     0 -4px 0 #ff6600,
+    -4px -4px 0 #ff8800,
+     4px -4px 0 #ff8800,
+     0 -8px 0 #ffaa00,
+    -4px -8px 0 #ff6600,
+     4px -8px 0 #ff6600,
+     0 -12px 0 #ffcc00;
+  animation: bc-fire 0.4s steps(1) infinite;
+}
+
+@keyframes bc-fire {
+  0% {
+    box-shadow:
+      -4px 0 0 #8b4513,
+       4px 0 0 #8b4513,
+       0 -4px 0 #ff6600,
+      -4px -4px 0 #ff8800,
+       4px -4px 0 #ff8800,
+       0 -8px 0 #ffaa00,
+      -4px -8px 0 #ff6600,
+       4px -8px 0 #ff6600,
+       0 -12px 0 #ffcc00;
+  }
+  50% {
+    box-shadow:
+      -4px 0 0 #8b4513,
+       4px 0 0 #8b4513,
+       0 -4px 0 #ff8800,
+      -4px -4px 0 #ff6600,
+       4px -4px 0 #ffaa00,
+       0 -8px 0 #ff6600,
+      -4px -8px 0 #ffcc00,
+       4px -8px 0 #ff8800,
+       0 -12px 0 #ff6600;
+  }
+}
+
+/* Sherpa pixel character (idle pose) */
+.bc-sherpa {
+  position: absolute;
+  bottom: 16px;
+  left: calc(50% + 24px);
+  width: 4px;
+  height: 4px;
+  background: transparent;
+  image-rendering: pixelated;
+  box-shadow:
+    /* Hat */
+     0 -20px 0 #e74c3c,
+    -4px -20px 0 #e74c3c,
+     4px -20px 0 #e74c3c,
+    -4px -24px 0 #e74c3c,
+     0 -24px 0 #e74c3c,
+     4px -24px 0 #e74c3c,
+    /* Face */
+    -4px -16px 0 #f5c6a0,
+     0 -16px 0 #f5c6a0,
+     4px -16px 0 #f5c6a0,
+    /* Body */
+    -4px -12px 0 #3498db,
+     0 -12px 0 #3498db,
+     4px -12px 0 #3498db,
+    -4px -8px 0 #3498db,
+     0 -8px 0 #3498db,
+     4px -8px 0 #3498db,
+    /* Backpack */
+     8px -12px 0 #8b6914,
+     8px -8px 0 #8b6914,
+    /* Legs */
+    -4px -4px 0 #2c3e50,
+     0 -4px 0 #2c3e50,
+    -4px 0 0 #2c3e50,
+     4px 0 0 #2c3e50;
+  animation: sherpa-idle 1s steps(1) infinite;
+}
+
+@keyframes sherpa-idle {
+  0%, 100% {
+    box-shadow:
+       0 -20px 0 #e74c3c,
+      -4px -20px 0 #e74c3c,
+       4px -20px 0 #e74c3c,
+      -4px -24px 0 #e74c3c,
+       0 -24px 0 #e74c3c,
+       4px -24px 0 #e74c3c,
+      -4px -16px 0 #f5c6a0,
+       0 -16px 0 #f5c6a0,
+       4px -16px 0 #f5c6a0,
+      -4px -12px 0 #3498db,
+       0 -12px 0 #3498db,
+       4px -12px 0 #3498db,
+      -4px -8px 0 #3498db,
+       0 -8px 0 #3498db,
+       4px -8px 0 #3498db,
+       8px -12px 0 #8b6914,
+       8px -8px 0 #8b6914,
+      -4px -4px 0 #2c3e50,
+       0 -4px 0 #2c3e50,
+      -4px 0 0 #2c3e50,
+       4px 0 0 #2c3e50;
+  }
+  50% {
+    box-shadow:
+       0 -20px 0 #e74c3c,
+      -4px -20px 0 #e74c3c,
+       4px -20px 0 #e74c3c,
+      -4px -24px 0 #e74c3c,
+       0 -24px 0 #e74c3c,
+       4px -24px 0 #e74c3c,
+      -4px -16px 0 #f5c6a0,
+       0 -16px 0 #f5c6a0,
+       4px -16px 0 #f5c6a0,
+      -4px -12px 0 #3498db,
+       0 -12px 0 #3498db,
+       4px -12px 0 #3498db,
+      -4px -8px 0 #3498db,
+       0 -8px 0 #3498db,
+       4px -8px 0 #3498db,
+       8px -12px 0 #8b6914,
+       8px -8px 0 #8b6914,
+      -4px -4px 0 #2c3e50,
+       4px -4px 0 #2c3e50,
+      -4px 0 0 #2c3e50,
+       0 0 0 #2c3e50;
+  }
+}
+
+/* Speech bubble */
+.bc-speech {
+  position: absolute;
+  bottom: 52px;
+  left: calc(50% + 8px);
+  background: #1c2030;
+  border: 1px solid #2a2f42;
+  border-radius: 8px;
+  padding: 6px 10px;
+  font-size: 11px;
+  white-space: nowrap;
+  color: var(--text-secondary);
+  animation: bubble-float 3s ease-in-out infinite;
+}
+
+.bc-speech::after {
+  content: '';
+  position: absolute;
+  bottom: -6px;
+  left: 20px;
+  width: 0;
+  height: 0;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-top: 6px solid #1c2030;
+}
+
+@keyframes bubble-float {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-3px); }
+}
+
+.bc-speech.fade-out {
+  opacity: 0;
+  transition: opacity 0.5s;
+}
+
+.bc-speech.fade-in {
+  opacity: 1;
+  transition: opacity 0.5s;
+}
+
+/* ============================================================
+   Activity Trail
+   ============================================================ */
+
+#activity-trail {
+  background: #0a0c11;
+  border: 1px solid #1c2030;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.activity-info {
+  padding: 12px 20px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.activity-streak {
+  font-size: 13px;
+  color: #8fbc8f;
+  font-weight: 600;
+}
+
+.activity-period {
+  font-size: 11px;
+  color: var(--text-muted);
+}

package/dist/bin/sanjang.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/bin/sanjang.js

@@ -0,0 +1,138 @@
+#!/usr/bin/env node
+import { execSync } from "node:child_process";
+import { existsSync } from "node:fs";
+import { resolve } from "node:path";
+const args = process.argv.slice(2);
+const command = args[0];
+// Parse options
+let projectRoot = process.cwd();
+let port = 4000;
+let force = false;
+for (let i = 0; i < args.length; i++) {
+    if (args[i] === "--project" && args[i + 1]) {
+        projectRoot = resolve(args[i + 1]);
+        i++;
+    }
+    if (args[i] === "--port" && args[i + 1]) {
+        port = parseInt(args[i + 1]);
+        i++;
+    }
+    if (args[i] === "--force") {
+        force = true;
+    }
+}
+// Find git root
+try {
+    projectRoot = execSync("git rev-parse --show-toplevel", {
+        cwd: projectRoot,
+        encoding: "utf8",
+        stdio: ["pipe", "pipe", "pipe"],
+    }).trim();
+}
+catch {
+    console.error("⛰ 산장: git 저장소를 찾을 수 없습니다.");
+    console.error("  git 저장소 안에서 실행해주세요.");
+    process.exit(1);
+}
+if (command === "init") {
+    const { generateConfig, detectApps } = await import("../lib/config.js");
+    // Detect apps in subdirectories
+    const apps = detectApps(projectRoot);
+    let appDir;
+    if (apps.length >= 2) {
+        // Multi-app interview
+        console.log("");
+        console.log("⛰ 여러 앱이 감지되었습니다:");
+        for (let i = 0; i < apps.length; i++) {
+            console.log(`  ${i + 1}) ${apps[i].dir}/\t(${apps[i].framework})`);
+        }
+        console.log("");
+        const { createInterface } = await import("node:readline");
+        const rl = createInterface({ input: process.stdin, output: process.stdout });
+        const answer = await new Promise((resolve) => {
+            rl.question("  어떤 앱을 띄울까요? [번호]: ", resolve);
+        });
+        rl.close();
+        const idx = parseInt(answer) - 1;
+        if (idx < 0 || idx >= apps.length || isNaN(idx)) {
+            console.error("⛰ 잘못된 선택입니다.");
+            process.exit(1);
+        }
+        appDir = apps[idx].dir;
+        console.log(`  → ${appDir}/ (${apps[idx].framework}) 선택됨`);
+    }
+    else if (apps.length === 1) {
+        appDir = apps[0].dir;
+    }
+    const result = generateConfig(projectRoot, { appDir, force });
+    if (result.created) {
+        console.log(`⛰ ${result.message}`);
+        console.log(`  프레임워크: ${result.framework}`);
+        console.log(`  설정 파일: ${result.configPath}`);
+    }
+    else {
+        console.log(`⛰ ${result.message}`);
+    }
+    // Add .sanjang to .gitignore if not present
+    const gitignorePath = resolve(projectRoot, ".gitignore");
+    if (existsSync(gitignorePath)) {
+        const { readFileSync, appendFileSync } = await import("node:fs");
+        const content = readFileSync(gitignorePath, "utf8");
+        if (!content.includes(".sanjang")) {
+            appendFileSync(gitignorePath, "\n# Sanjang local dev camps\n.sanjang/\n");
+            console.log("  .gitignore에 .sanjang/ 추가됨");
+        }
+    }
+    // Prebuild dependency cache
+    const { loadConfig } = await import("../lib/config.js");
+    const initConfig = await loadConfig(projectRoot);
+    if (initConfig.setup) {
+        console.log("");
+        console.log("  의존성 캐시를 빌드합니다...");
+        const { buildCache } = await import("../lib/engine/cache.js");
+        const cacheResult = await buildCache(projectRoot, initConfig, (msg) => {
+            console.log(`  ${msg}`);
+        });
+        if (cacheResult.success) {
+            console.log(`  캐시 빌드 완료 ✓ (${(cacheResult.duration / 1000).toFixed(1)}초)`);
+        }
+        else {
+            console.log(`  ⚠️ 캐시 빌드 실패: ${cacheResult.error}`);
+            console.log("  캠프 생성 시 일반 설치를 사용합니다.");
+        }
+    }
+    // Auto-start server unless --no-start
+    const noStart = args.includes("--no-start");
+    if (!noStart) {
+        console.log("");
+        console.log("  서버를 시작합니다...");
+        const { startServer } = await import("../lib/server.js");
+        await startServer(projectRoot, { port });
+    }
+    else {
+        console.log("");
+        console.log("  다음 단계: sanjang 또는 npx sanjang 으로 서버를 시작하세요.");
+    }
+}
+else if (command === "help" || command === "--help" || command === "-h") {
+    console.log(`
+⛰ 산장 (Sanjang) — 바이브코더를 위한 로컬 개발 환경 매니저
+
+사용법:
+  sanjang              서버 시작 (대시보드: http://localhost:4000)
+  sanjang init         프로젝트 분석 → sanjang.config.js 생성
+  sanjang help         이 도움말
+
+옵션:
+  --port <N>           대시보드 포트 (기본: 4000)
+  --project <path>     프로젝트 경로 (기본: 현재 디렉토리)
+  --force              기존 설정을 덮어쓰고 다시 생성
+
+자세히: https://github.com/paul-sherpas/sanjang
+`);
+}
+else {
+    // Default: start server
+    const { startServer } = await import("../lib/server.js");
+    await startServer(projectRoot, { port });
+}

package/dist/lib/config.d.ts

@@ -0,0 +1,19 @@
+import type { DetectedApp, DetectedProject, GenerateConfigResult, SanjangConfig } from "./types.ts";
+/**
+ * Load sanjang.config.js from project root.
+ * Returns merged config with defaults.
+ */
+export declare function loadConfig(projectRoot: string): Promise<SanjangConfig>;
+/**
+ * Auto-detect project type and generate config.
+ */
+export declare function detectProject(projectRoot: string): DetectedProject;
+/**
+ * Scan first-level subdirectories for app candidates.
+ * Returns array of { dir, framework, detected } sorted by dir name.
+ */
+export declare function detectApps(projectRoot: string): DetectedApp[];
+export declare function generateConfig(projectRoot: string, options?: {
+    appDir?: string;
+    force?: boolean;
+}): GenerateConfigResult;