@godxjp/ui 0.1.1 → 2.1.0

package/dist/components/screens.js

@@ -0,0 +1,806 @@
+import { Activity, BugPlay, Rocket, TrendingUp, GitBranch, ArrowLeft, ChevronRight, Send } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { useState } from 'react';
+import * as Popover from '@radix-ui/react-popover';
+
+var ACTIVITY = [
+  { id: "a1", type: "deploy", who: "satoshi", what: "production deploy v0.42.0", when: "12m" },
+  { id: "a2", type: "issue", who: "naoki", what: "moved GK-310 to In Review", when: "32m" },
+  { id: "a3", type: "plan", who: "anh", what: "PDCA-Q2-001 entered Check", when: "1h" }
+];
+function DashboardScreen({ product }) {
+  const { t } = useTranslation();
+  const totalIssues = product.projects.reduce((s, p) => s + p.openIssues, 0);
+  const totalPrs = product.projects.reduce((s, p) => s + p.prs, 0);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "page-header", children: /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsxs("h1", { className: "page-title", children: [
+        product.name,
+        " \xB7 ",
+        t("nav.dashboard")
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "page-subtitle", children: product.desc })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-4 gap-3 mb-6", children: [
+      /* @__PURE__ */ jsx(Kpi, { label: t("kpi.activeDevs"), value: String(product.devs), icon: Activity, delta: "+1" }),
+      /* @__PURE__ */ jsx(Kpi, { label: t("kpi.openIssues"), value: String(totalIssues), icon: BugPlay, delta: `${totalPrs} PR` }),
+      /* @__PURE__ */ jsx(Kpi, { label: t("kpi.deployments"), value: "14", icon: Rocket, delta: "+3" }),
+      /* @__PURE__ */ jsx(Kpi, { label: t("kpi.uptime"), value: "99.94%", icon: TrendingUp, delta: "30d" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-3", children: [
+      /* @__PURE__ */ jsxs("section", { className: "card col-span-2", children: [
+        /* @__PURE__ */ jsx("header", { className: "card-header", children: /* @__PURE__ */ jsx("h2", { className: "card-title", children: t("kpi.recentActivity") }) }),
+        /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-1", children: ACTIVITY.map((a) => /* @__PURE__ */ jsxs("li", { className: "log-line", children: [
+          /* @__PURE__ */ jsx("span", { className: "time", children: a.when }),
+          /* @__PURE__ */ jsx("span", { className: `src ${a.type === "deploy" ? "ok" : a.type === "plan" ? "" : "warn"}`, children: a.who }),
+          /* @__PURE__ */ jsx("span", { children: a.what })
+        ] }, a.id)) })
+      ] }),
+      /* @__PURE__ */ jsxs("section", { className: "card", children: [
+        /* @__PURE__ */ jsx("header", { className: "card-header", children: /* @__PURE__ */ jsx("h2", { className: "card-title", children: t("kpi.quickActions") }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+          /* @__PURE__ */ jsx("button", { className: "btn btn-secondary justify-start", children: t("nav.plans") }),
+          /* @__PURE__ */ jsx("button", { className: "btn btn-secondary justify-start", children: t("nav.issues") }),
+          /* @__PURE__ */ jsx("button", { className: "btn btn-secondary justify-start", children: t("nav.ideas") }),
+          /* @__PURE__ */ jsx("button", { className: "btn btn-secondary justify-start", children: t("nav.gantt") })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function Kpi({
+  label,
+  value,
+  icon: Icon,
+  delta
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "kpi", children: [
+    /* @__PURE__ */ jsxs("span", { className: "kpi-label", children: [
+      /* @__PURE__ */ jsx(Icon, { size: 14 }),
+      " ",
+      label
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "kpi-value", children: value }),
+    delta && /* @__PURE__ */ jsx("span", { className: "kpi-delta", children: delta })
+  ] });
+}
+
+// src/data/products.ts
+var PROJECT_KIND = {
+  service: { color: "oklch(60% 0.137 163)", label: "API" },
+  web: { color: "oklch(56% 0.15 240)", label: "Web" },
+  desktop: { color: "oklch(48% 0.16 285)", label: "Desktop" },
+  workstation: { color: "oklch(50% 0.16 30)", label: "Workstation" },
+  mobile: { color: "oklch(58% 0.18 25)", label: "Mobile" },
+  library: { color: "oklch(50% 0.05 250)", label: "Library" },
+  infra: { color: "oklch(45% 0.05 260)", label: "Infra" }
+};
+function ProjectsListScreen({ product, onSelect }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: t("nav.projects") }),
+        /* @__PURE__ */ jsxs("p", { className: "page-subtitle", children: [
+          product.name,
+          " \xB7 ",
+          product.projects.length,
+          " ",
+          t("nav.projects").toLowerCase()
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("button", { className: "btn btn-primary", children: [
+        "+ ",
+        t("common.new")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "card p-0 overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "table", children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+        /* @__PURE__ */ jsx("th", { children: "Project" }),
+        /* @__PURE__ */ jsx("th", { children: "Stack" }),
+        /* @__PURE__ */ jsx("th", { children: "Kind" }),
+        /* @__PURE__ */ jsx("th", { className: "num", children: "Devs" }),
+        /* @__PURE__ */ jsx("th", { className: "num", children: "Issues" }),
+        /* @__PURE__ */ jsx("th", { className: "num", children: "PR" }),
+        /* @__PURE__ */ jsx("th", { children: "Branch" }),
+        /* @__PURE__ */ jsx("th", { children: "Last commit" })
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: product.projects.map((p) => /* @__PURE__ */ jsxs("tr", { onClick: () => onSelect(p), className: "cursor-pointer", children: [
+        /* @__PURE__ */ jsx("td", { className: "font-medium", children: p.name }),
+        /* @__PURE__ */ jsx("td", { className: "muted", children: p.stack }),
+        /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx("span", { className: "chip", style: { color: PROJECT_KIND[p.kind].color }, children: PROJECT_KIND[p.kind].label }) }),
+        /* @__PURE__ */ jsx("td", { className: "num", children: p.devs }),
+        /* @__PURE__ */ jsx("td", { className: "num", children: p.openIssues }),
+        /* @__PURE__ */ jsx("td", { className: "num", children: p.prs }),
+        /* @__PURE__ */ jsx("td", { className: "mono", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(GitBranch, { size: 11 }),
+          " ",
+          p.branch
+        ] }) }),
+        /* @__PURE__ */ jsx("td", { className: "muted", children: p.lastCommit })
+      ] }, p.id)) })
+    ] }) })
+  ] });
+}
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var PLANS = [
+  { id: "PDCA-Q2-001", number: 1, title: "OAuth migration kickoff", phase: "check", health: "at-risk", owner: "satoshi", due: "2026-06-30", progress: 64 },
+  { id: "PDCA-Q2-002", number: 2, title: "Forge-service extraction (Plan #19)", phase: "do", health: "ok", owner: "naoki", due: "2026-07-14", progress: 41 },
+  { id: "PDCA-Q2-003", number: 3, title: "Sandbox secrets via Vault (Plan #38)", phase: "plan", health: "ok", owner: "anh", due: "2026-08-01", progress: 12 },
+  { id: "PDCA-Q2-004", number: 4, title: "Knowledge-service slug routing (Plan #18)", phase: "act", health: "ok", owner: "kira", due: "2026-05-31", progress: 92 }
+];
+var PHASE_LABEL = { plan: "Plan", do: "Do", check: "Check", act: "Act" };
+var HEALTH_TONE = {
+  ok: "badge-success",
+  "at-risk": "badge-warning",
+  "off-track": "badge-error"
+};
+function PlansScreen({ onOpenPlan }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: t("nav.plans") }),
+        /* @__PURE__ */ jsxs("p", { className: "page-subtitle", children: [
+          PLANS.length,
+          " plans \xB7 PDCA cycle"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("button", { className: "btn btn-primary", children: [
+        "+ ",
+        t("common.new")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: PLANS.map((plan) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => onOpenPlan(plan.id),
+        className: "card text-left hover:border-primary transition-colors",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-xs font-mono text-muted-foreground", children: [
+              "#",
+              plan.id
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "badge badge-neutral", children: [
+              /* @__PURE__ */ jsx("span", { className: "dot" }),
+              " ",
+              PHASE_LABEL[plan.phase]
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: cn("badge", HEALTH_TONE[plan.health]), children: [
+              /* @__PURE__ */ jsx("span", { className: "dot" }),
+              plan.health
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("h3", { className: "text-base font-medium mb-2", children: plan.title }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground mb-3", children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              "@",
+              plan.owner
+            ] }),
+            /* @__PURE__ */ jsx("span", { children: "\xB7" }),
+            /* @__PURE__ */ jsx("span", { children: plan.due })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "h-1.5 bg-surface-3 rounded-full overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "h-full bg-primary transition-all", style: { width: `${plan.progress}%` } }) }),
+          /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground mt-1 block tnum", children: [
+            plan.progress,
+            "%"
+          ] })
+        ]
+      },
+      plan.id
+    )) })
+  ] });
+}
+var ISSUES = [
+  { id: "GK-301", status: "backlog", title: "Notify SSE handshake retries when token expired", type: "bug", priority: "high", assignee: "satoshi" },
+  { id: "GK-310", status: "in-progress", title: "Wire sticky QuickComposer for backlog-style edits", type: "feature", priority: "medium", assignee: "naoki" },
+  { id: "GK-311", status: "in-progress", title: "Tweaks panel keyboard shortcut conflict", type: "task", priority: "low", assignee: "anh" },
+  { id: "GK-302", status: "review", title: "Forge nav grouping per audience", type: "task", priority: "medium", assignee: "kira" },
+  { id: "GK-298", status: "done", title: "Drop NOT NULL project_id on plans/issues", type: "bug", priority: "urgent", assignee: "satoshi" }
+];
+var COLS = [
+  { id: "backlog", label: "Backlog" },
+  { id: "in-progress", label: "In progress" },
+  { id: "review", label: "Review" },
+  { id: "done", label: "Done" }
+];
+var PRIO_DOT = {
+  low: "var(--muted-foreground)",
+  medium: "var(--info)",
+  high: "var(--warning)",
+  urgent: "var(--destructive)"
+};
+function IssuesScreen({ onOpenIssue }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: t("nav.issues") }),
+        /* @__PURE__ */ jsxs("p", { className: "page-subtitle", children: [
+          ISSUES.length,
+          " issues"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("button", { className: "btn btn-primary", children: [
+        "+ ",
+        t("common.new")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "kanban", children: COLS.map((col) => {
+      const rows = ISSUES.filter((i) => i.status === col.id);
+      return /* @__PURE__ */ jsxs("div", { className: "kanban-col", children: [
+        /* @__PURE__ */ jsxs("div", { className: "kanban-col-head", children: [
+          /* @__PURE__ */ jsx("span", { children: col.label }),
+          /* @__PURE__ */ jsx("span", { className: "kanban-col-count", children: rows.length })
+        ] }),
+        rows.map((issue) => /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => onOpenIssue(issue.id),
+            className: "issue-card text-left",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "issue-id", children: issue.id }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: "dot",
+                    style: { background: PRIO_DOT[issue.priority] },
+                    "aria-label": issue.priority
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "chip ml-auto", children: issue.type })
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "issue-title", children: issue.title }),
+              /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+                "@",
+                issue.assignee
+              ] })
+            ]
+          },
+          issue.id
+        ))
+      ] }, col.id);
+    }) })
+  ] });
+}
+var DEFAULT_TOC = [
+  { id: "intro", label: "Introduction" },
+  { id: "stack", label: "Stack" },
+  { id: "deployment", label: "Deployment" },
+  { id: "onboarding", label: "Onboarding" }
+];
+function WikiScreen({ toc = DEFAULT_TOC, children, meta }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: t("nav.wiki") }),
+        /* @__PURE__ */ jsx("p", { className: "page-subtitle", children: "Living documentation" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("button", { className: "btn btn-primary", children: [
+        "+ ",
+        t("common.new")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "wiki-layout", children: [
+      /* @__PURE__ */ jsx("nav", { className: "wiki-toc", "aria-label": "Table of contents", children: toc.map((entry, i) => /* @__PURE__ */ jsx("a", { href: `#${entry.id}`, className: i === 0 ? "active" : void 0, children: entry.label }, entry.id)) }),
+      /* @__PURE__ */ jsx("article", { className: "prose", children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("h1", { id: "intro", children: "GoDX Forge \u2014 Engineering handbook" }),
+        /* @__PURE__ */ jsxs("p", { children: [
+          "This wiki is a living reference for everyone working on the GoDX Forge platform. It mirrors the source-of-truth documentation that lives in ",
+          /* @__PURE__ */ jsx("code", { children: "docs/" }),
+          "; edits here are commits."
+        ] }),
+        /* @__PURE__ */ jsx("h2", { id: "stack", children: "Stack" }),
+        /* @__PURE__ */ jsxs("p", { children: [
+          "Each frontend service consumes ",
+          /* @__PURE__ */ jsx("code", { children: "@godxjp/ui" }),
+          " for tokens, primitives, shell, i18n. Backend kernel lives in",
+          " ",
+          /* @__PURE__ */ jsx("code", { children: "services/_sdk/" }),
+          " (Go)."
+        ] }),
+        /* @__PURE__ */ jsxs("ul", { children: [
+          /* @__PURE__ */ jsx("li", { children: "React 19 \xB7 Vite \xB7 TypeScript" }),
+          /* @__PURE__ */ jsxs("li", { children: [
+            "Tailwind v4 with CSS-first ",
+            /* @__PURE__ */ jsx("code", { children: "@theme" }),
+            " bridge"
+          ] }),
+          /* @__PURE__ */ jsx("li", { children: "i18next auto-detect + JA fallback" })
+        ] }),
+        /* @__PURE__ */ jsx("h2", { id: "deployment", children: "Deployment" }),
+        /* @__PURE__ */ jsxs("p", { children: [
+          "Compose-orchestrated; subdomains route through Caddy per",
+          /* @__PURE__ */ jsx("code", { children: "deploy/docker/Caddyfile" }),
+          "."
+        ] }),
+        /* @__PURE__ */ jsx("h2", { id: "onboarding", children: "Onboarding" }),
+        /* @__PURE__ */ jsxs("p", { children: [
+          "See ",
+          /* @__PURE__ */ jsx("code", { children: "docs/onboarding/dev.md" }),
+          " for the day-0 checklist."
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx("aside", { className: "text-xs text-muted-foreground", "aria-label": "Meta", children: meta ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wider mb-2", children: "Updated" }),
+        /* @__PURE__ */ jsx("p", { children: "2 hours ago by @satoshi" })
+      ] }) })
+    ] })
+  ] });
+}
+var IDEAS = [
+  { id: "IDEA-12", title: "Bulk action on issues board", problem: "Triaging 30+ issues requires clicking each card. Need shift-click multi-select + bulk move/edit.", appetite: "1w", status: "under_review", votes: 7, pitched_by: "satoshi" },
+  { id: "IDEA-13", title: "Sandbox snapshot for AI debugging", problem: "When agent goes off the rails I want to time-travel the sandbox FS to a known-good state.", appetite: "6w", status: "draft", votes: 4, pitched_by: "naoki" },
+  { id: "IDEA-14", title: "Workspace dark-mode default detection", problem: "First-load flicker as theme resolves from localStorage \u2014 should follow system pref pre-hydration.", appetite: "3d", status: "scored", votes: 2, pitched_by: "anh" }
+];
+var STATUS_TONE = {
+  draft: "badge-neutral",
+  under_review: "badge-info",
+  scored: "badge-warning",
+  accepted: "badge-success",
+  rejected: "badge-error"
+};
+var STATUS_LABEL = {
+  draft: "Draft",
+  under_review: "Review",
+  scored: "Scored",
+  accepted: "Accepted",
+  rejected: "Rejected"
+};
+function IdeasScreen() {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: t("nav.ideas") }),
+        /* @__PURE__ */ jsx("p", { className: "page-subtitle", children: "Shape Up \u2014 problem \xB7 appetite \xB7 solution" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("button", { className: "btn btn-primary", children: [
+        "+ ",
+        t("common.new")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-3", children: IDEAS.map((idea) => /* @__PURE__ */ jsxs("article", { className: "card flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-mono text-muted-foreground", children: idea.id }),
+        /* @__PURE__ */ jsxs("span", { className: `badge ${STATUS_TONE[idea.status]}`, children: [
+          /* @__PURE__ */ jsx("span", { className: "dot" }),
+          " ",
+          STATUS_LABEL[idea.status]
+        ] }),
+        /* @__PURE__ */ jsxs("span", { className: "chip ml-auto", children: [
+          "\u23F1 ",
+          idea.appetite
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("h3", { className: "text-base font-medium", children: idea.title }),
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground line-clamp-3", children: idea.problem }),
+      /* @__PURE__ */ jsxs("footer", { className: "flex items-center gap-2 text-[10px] text-muted-foreground mt-auto pt-2 border-t border-border", children: [
+        /* @__PURE__ */ jsxs("span", { children: [
+          "@",
+          idea.pitched_by
+        ] }),
+        /* @__PURE__ */ jsxs("span", { className: "ml-auto", children: [
+          "\u25B2 ",
+          idea.votes
+        ] })
+      ] })
+    ] }, idea.id)) })
+  ] });
+}
+var PHASES = [
+  { id: "plan", description: "Frame the goal + design contract" },
+  { id: "do", description: "Execute + track progress" },
+  { id: "check", description: "Measure outcomes + review" },
+  { id: "act", description: "Standardize + roll out" }
+];
+var LINKED_TASKS = [
+  { id: "GK-310", title: "Wire sticky QuickComposer", owner: "naoki", state: "in-progress" },
+  { id: "GK-301", title: "SSE retry on token expire", owner: "satoshi", state: "review" },
+  { id: "GK-302", title: "Forge nav grouping", owner: "kira", state: "review" }
+];
+var KPI = [
+  { label: "Activation rate", value: "62%", delta: "+8" },
+  { label: "Time to first plan", value: "4m12s", delta: "-22s" },
+  { label: "Plans per dev", value: "1.4", delta: "+0.3" },
+  { label: "Hypothesis hit", value: "3/5", delta: "" }
+];
+var ADOPTION = [
+  { tag: "ADOPT", title: "Sticky QuickComposer is now default", color: "var(--success)" },
+  { tag: "TRY", title: "Markdown preview in modal \u2014 gather 1 sprint feedback", color: "var(--info)" },
+  { tag: "DROP", title: "Auto-save every keystroke (too aggressive)", color: "var(--destructive)" },
+  { tag: "PARK", title: "AI-suggested labels (waiting on plan #21 G18)", color: "var(--muted-foreground)" }
+];
+function PlanDetailScreen({ planId, onBack, onOpenIssue }) {
+  const { t } = useTranslation();
+  const [phase, setPhase] = useState("check");
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-4 text-xs", children: [
+      /* @__PURE__ */ jsx("button", { onClick: onBack, className: "tb-icon-btn", "aria-label": t("common.back"), children: /* @__PURE__ */ jsx(ArrowLeft, { size: 14 }) }),
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: t("nav.plans") }),
+      /* @__PURE__ */ jsx(ChevronRight, { size: 12, className: "text-muted-foreground" }),
+      /* @__PURE__ */ jsx("span", { className: "font-mono", children: planId })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { className: "page-title", children: "OAuth migration kickoff" }),
+        /* @__PURE__ */ jsx("p", { className: "page-subtitle", children: "Q2 PDCA \u2014 moving the legacy admin login chain to OIDC end-to-end" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "page-actions", children: /* @__PURE__ */ jsxs("span", { className: "badge badge-warning", children: [
+        /* @__PURE__ */ jsx("span", { className: "dot" }),
+        " at risk"
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-4 gap-2 mb-6", children: PHASES.map((p, idx) => {
+      const active = p.id === phase;
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => setPhase(p.id),
+          className: cn("relative card text-left transition-colors", active && "border-primary"),
+          "aria-current": active,
+          children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground", children: [
+              "Step ",
+              idx + 1
+            ] }),
+            /* @__PURE__ */ jsx("h3", { className: "text-base font-medium mt-1", children: t(`pdca.${p.id}`) }),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: p.description }),
+            idx < PHASES.length - 1 && /* @__PURE__ */ jsx(
+              ChevronRight,
+              {
+                size: 14,
+                className: "absolute -right-2.5 top-1/2 -translate-y-1/2 bg-background border border-border rounded-full text-muted-foreground"
+              }
+            )
+          ]
+        },
+        p.id
+      );
+    }) }),
+    phase === "plan" && /* @__PURE__ */ jsxs("section", { className: "card", children: [
+      /* @__PURE__ */ jsx("h2", { className: "card-title mb-3", children: t("pdca.hypothesis") }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm", children: "Replacing the legacy admin password form with the OIDC chain will cut authentication failures by 40% within one quarter." }),
+      /* @__PURE__ */ jsx("h3", { className: "card-title mt-6 mb-2", children: t("pdca.metrics") }),
+      /* @__PURE__ */ jsxs("ul", { className: "text-sm list-disc pl-5", children: [
+        /* @__PURE__ */ jsx("li", { children: "Auth failures < 0.5% of attempts" }),
+        /* @__PURE__ */ jsx("li", { children: "Time-to-sign-in < 3s p95" }),
+        /* @__PURE__ */ jsx("li", { children: "Zero password resets logged for SSO users" })
+      ] }),
+      /* @__PURE__ */ jsx("h3", { className: "card-title mt-6 mb-2", children: t("pdca.risks") }),
+      /* @__PURE__ */ jsxs("ul", { className: "text-sm list-disc pl-5 text-muted-foreground", children: [
+        /* @__PURE__ */ jsx("li", { children: "Identity-portal cookie domain drift between envs" }),
+        /* @__PURE__ */ jsx("li", { children: "RFC 9457 problem-detail rollout coupling" })
+      ] })
+    ] }),
+    phase === "do" && /* @__PURE__ */ jsxs("section", { className: "card", children: [
+      /* @__PURE__ */ jsx("h2", { className: "card-title mb-3", children: t("pdca.linkedTasks") }),
+      /* @__PURE__ */ jsxs("table", { className: "table", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx("th", { children: "ID" }),
+          /* @__PURE__ */ jsx("th", { children: "Title" }),
+          /* @__PURE__ */ jsx("th", { children: "Owner" }),
+          /* @__PURE__ */ jsx("th", { children: "State" })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: LINKED_TASKS.map((task) => /* @__PURE__ */ jsxs("tr", { onClick: () => onOpenIssue(task.id), className: "cursor-pointer", children: [
+          /* @__PURE__ */ jsx("td", { className: "mono", children: task.id }),
+          /* @__PURE__ */ jsx("td", { children: task.title }),
+          /* @__PURE__ */ jsxs("td", { className: "muted", children: [
+            "@",
+            task.owner
+          ] }),
+          /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsxs("span", { className: "badge badge-neutral", children: [
+            /* @__PURE__ */ jsx("span", { className: "dot" }),
+            " ",
+            task.state
+          ] }) })
+        ] }, task.id)) })
+      ] })
+    ] }),
+    phase === "check" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-4 gap-3 mb-4", children: KPI.map((k) => /* @__PURE__ */ jsxs("div", { className: "kpi", children: [
+        /* @__PURE__ */ jsx("span", { className: "kpi-label", children: k.label }),
+        /* @__PURE__ */ jsx("span", { className: "kpi-value", children: k.value }),
+        k.delta && /* @__PURE__ */ jsx("span", { className: cn("kpi-delta", k.delta.startsWith("-") && "down"), children: k.delta })
+      ] }, k.label)) }),
+      /* @__PURE__ */ jsxs("section", { className: "card", children: [
+        /* @__PURE__ */ jsx("h2", { className: "card-title mb-3", children: t("pdca.review") }),
+        /* @__PURE__ */ jsx(Sparkline, {})
+      ] })
+    ] }),
+    phase === "act" && /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: ADOPTION.map((a) => /* @__PURE__ */ jsxs("div", { className: "card flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "text-[10px] font-medium uppercase tracking-wider",
+          style: { color: a.color },
+          children: a.tag
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: "text-sm", children: a.title })
+    ] }, a.tag)) })
+  ] });
+}
+function Sparkline() {
+  const points = [12, 14, 16, 13, 18, 22, 19, 24, 28, 26, 30, 34, 31, 38];
+  const max = Math.max(...points);
+  const path = points.map((y, i) => `${i === 0 ? "M" : "L"}${i / (points.length - 1) * 100},${100 - y / max * 80}`).join(" ");
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "spark", style: { height: 80 }, children: [
+    /* @__PURE__ */ jsx("path", { d: `${path} L100,100 L0,100 Z`, className: "area" }),
+    /* @__PURE__ */ jsx("path", { d: path, className: "line" })
+  ] });
+}
+var STATUS_LABEL2 = {
+  backlog: "Backlog",
+  "in-progress": "In progress",
+  review: "Review",
+  done: "Done",
+  abandoned: "Abandoned"
+};
+var PRIORITY_LABEL = {
+  low: "P3",
+  medium: "P2",
+  high: "P1",
+  urgent: "P0"
+};
+var TEAM = ["satoshi", "naoki", "anh", "kira"];
+var COMMENTS = [
+  { id: "c1", who: "satoshi", when: "2h", body: "Cloned latest design; QuickComposer collapse is 52px, expand on focus." },
+  { id: "c2", who: "naoki", when: "1h", body: "Picked P1 \u2014 release window is tight." },
+  { id: "c3", who: "anh", when: "12m", body: "Backend ON CONFLICT works; reproduced count 1\u21922 via curl." }
+];
+function IssueDetailScreen({ issueId, onBack, onOpenPlan }) {
+  const { t } = useTranslation();
+  const [tab, setTab] = useState("conversation");
+  const [composerOpen, setComposerOpen] = useState(false);
+  const [body, setBody] = useState("");
+  const [status, setStatus] = useState("in-progress");
+  const [assignee, setAssignee] = useState(TEAM[0]);
+  const [priority, setPriority] = useState("medium");
+  const initial = { status: "in-progress", assignee: TEAM[0], priority: "medium" };
+  const hasChanges = status !== initial.status || assignee !== initial.assignee || priority !== initial.priority;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex flex-col",
+      style: { minHeight: "calc(100vh - var(--header-height))" },
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-4 text-xs", children: [
+            /* @__PURE__ */ jsx("button", { onClick: onBack, className: "tb-icon-btn", "aria-label": t("common.back"), children: /* @__PURE__ */ jsx(ArrowLeft, { size: 14 }) }),
+            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: t("nav.issues") }),
+            /* @__PURE__ */ jsx(ChevronRight, { size: 12, className: "text-muted-foreground" }),
+            /* @__PURE__ */ jsx("span", { className: "font-mono", children: issueId })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "page-header", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h1", { className: "page-title", children: "Wire sticky QuickComposer for backlog-style edits" }),
+              /* @__PURE__ */ jsx("p", { className: "page-subtitle", children: "@naoki opened \xB7 2 days ago" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "page-actions", children: [
+              /* @__PURE__ */ jsxs("span", { className: "badge badge-info", children: [
+                /* @__PURE__ */ jsx("span", { className: "dot" }),
+                " ",
+                STATUS_LABEL2[status]
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "badge badge-warning", children: PRIORITY_LABEL[priority] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid gap-6", style: { gridTemplateColumns: "1fr 240px" }, children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("div", { className: "tabs mb-4", children: [
+                /* @__PURE__ */ jsx("button", { className: "tab", "data-active": tab === "conversation", onClick: () => setTab("conversation"), children: t("issue.conversation") }),
+                /* @__PURE__ */ jsx("button", { className: "tab", "data-active": tab === "checklist", onClick: () => setTab("checklist"), children: t("issue.checklist") }),
+                /* @__PURE__ */ jsx("button", { className: "tab", "data-active": tab === "code", onClick: () => setTab("code"), children: t("issue.codeChanges") }),
+                /* @__PURE__ */ jsx("button", { className: "tab", "data-active": tab === "history", onClick: () => setTab("history"), children: t("issue.history") })
+              ] }),
+              tab === "conversation" && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-3", children: COMMENTS.map((c) => /* @__PURE__ */ jsxs("li", { className: "card", children: [
+                /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-2 text-xs text-muted-foreground mb-2", children: [
+                  /* @__PURE__ */ jsx("span", { className: "avatar", style: { width: 24, height: 24, fontSize: 10 }, children: c.who[0]?.toUpperCase() }),
+                  /* @__PURE__ */ jsxs("span", { className: "font-medium text-foreground", children: [
+                    "@",
+                    c.who
+                  ] }),
+                  /* @__PURE__ */ jsx("span", { children: "\xB7" }),
+                  /* @__PURE__ */ jsx("span", { children: c.when })
+                ] }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm", children: c.body })
+              ] }, c.id)) }),
+              tab === "checklist" && /* @__PURE__ */ jsx("div", { className: "card", children: /* @__PURE__ */ jsxs("ul", { className: "flex flex-col gap-2 text-sm", children: [
+                /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("input", { type: "checkbox", defaultChecked: true }),
+                  " Sticky composer renders at 52px"
+                ] }) }),
+                /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("input", { type: "checkbox", defaultChecked: true }),
+                  " Expand on focus, collapse on outside click"
+                ] }) }),
+                /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("input", { type: "checkbox" }),
+                  " Status/assignee/priority pickers"
+                ] }) }),
+                /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("input", { type: "checkbox" }),
+                  " \u2318+Enter submit"
+                ] }) })
+              ] }) }),
+              tab === "code" && /* @__PURE__ */ jsxs("div", { className: "diff", children: [
+                /* @__PURE__ */ jsxs("div", { className: "diff-row ctx", children: [
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "12" }),
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "12" }),
+                  /* @__PURE__ */ jsx("span", { className: "body", children: "function App() {" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "diff-row del", children: [
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "13" }),
+                  /* @__PURE__ */ jsx("span", { className: "ln" }),
+                  /* @__PURE__ */ jsx("span", { className: "body", children: "  const [open, setOpen] = useState(false);" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "diff-row add", children: [
+                  /* @__PURE__ */ jsx("span", { className: "ln" }),
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "13" }),
+                  /* @__PURE__ */ jsx("span", { className: "body", children: "  const [composerOpen, setComposerOpen] = useState(false);" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "diff-row ctx", children: [
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "14" }),
+                  /* @__PURE__ */ jsx("span", { className: "ln", children: "14" }),
+                  /* @__PURE__ */ jsx("span", { className: "body", children: "  return <Shell />;" })
+                ] })
+              ] }),
+              tab === "history" && /* @__PURE__ */ jsxs("ul", { className: "flex flex-col gap-1 text-xs", children: [
+                /* @__PURE__ */ jsxs("li", { className: "log-line", children: [
+                  /* @__PURE__ */ jsx("span", { className: "time", children: "2d" }),
+                  /* @__PURE__ */ jsx("span", { className: "src", children: "@naoki" }),
+                  /* @__PURE__ */ jsx("span", { children: "opened the issue" })
+                ] }),
+                /* @__PURE__ */ jsxs("li", { className: "log-line", children: [
+                  /* @__PURE__ */ jsx("span", { className: "time", children: "1d" }),
+                  /* @__PURE__ */ jsx("span", { className: "src ok", children: "@satoshi" }),
+                  /* @__PURE__ */ jsx("span", { children: "moved to In progress" })
+                ] }),
+                /* @__PURE__ */ jsxs("li", { className: "log-line", children: [
+                  /* @__PURE__ */ jsx("span", { className: "time", children: "2h" }),
+                  /* @__PURE__ */ jsx("span", { className: "src warn", children: "@anh" }),
+                  /* @__PURE__ */ jsx("span", { children: "changed priority to P1" })
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("aside", { className: "flex flex-col gap-3 text-xs", children: [
+              /* @__PURE__ */ jsxs(SidebarField, { label: t("issue.assignee"), children: [
+                "@",
+                assignee
+              ] }),
+              /* @__PURE__ */ jsxs(SidebarField, { label: t("issue.labels"), children: [
+                /* @__PURE__ */ jsx("span", { className: "chip", children: "design-system" }),
+                /* @__PURE__ */ jsx("span", { className: "chip", children: "frontend" })
+              ] }),
+              /* @__PURE__ */ jsx(SidebarField, { label: t("issue.milestone"), children: "2026-Q2 release" }),
+              /* @__PURE__ */ jsx(SidebarField, { label: t("issue.sprint"), children: "Sprint 12" }),
+              /* @__PURE__ */ jsx(SidebarField, { label: t("issue.points"), children: "5" }),
+              /* @__PURE__ */ jsx(SidebarField, { label: t("issue.relatedPlan"), children: /* @__PURE__ */ jsx("button", { onClick: () => onOpenPlan("PDCA-Q2-001"), className: "underline text-primary", children: "PDCA-Q2-001" }) })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "sticky bottom-0 mt-6 py-2 border-t border-border bg-background/85 backdrop-blur",
+            style: { marginLeft: "calc(var(--spacing-6) * -1)", marginRight: "calc(var(--spacing-6) * -1)", paddingLeft: "var(--spacing-6)", paddingRight: "var(--spacing-6)" },
+            children: !composerOpen ? /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                className: "flex w-full items-center gap-2 text-xs text-muted-foreground hover:text-foreground py-1",
+                onClick: () => setComposerOpen(true),
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "avatar", style: { width: 24, height: 24, fontSize: 10 }, children: "S" }),
+                  /* @__PURE__ */ jsxs("span", { children: [
+                    issueId,
+                    " \xB7 ",
+                    t("issue.addComment")
+                  ] }),
+                  /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("span", { className: "chip", children: STATUS_LABEL2[status] }),
+                    /* @__PURE__ */ jsx("span", { className: "chip", children: PRIORITY_LABEL[priority] }),
+                    /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "C" })
+                  ] })
+                ]
+              }
+            ) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+              /* @__PURE__ */ jsx(
+                "textarea",
+                {
+                  autoFocus: true,
+                  value: body,
+                  onChange: (e) => setBody(e.target.value),
+                  placeholder: t("issue.addComment"),
+                  rows: 3,
+                  className: "input",
+                  onBlur: (e) => {
+                    if (!e.currentTarget.value && !e.relatedTarget) {
+                      setComposerOpen(false);
+                    }
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+                /* @__PURE__ */ jsx(PillPicker, { label: t("issue.status"), value: STATUS_LABEL2[status], changed: status !== initial.status, children: Object.keys(STATUS_LABEL2).map((s) => /* @__PURE__ */ jsx("button", { type: "button", className: "sw-pop-item w-full text-left", onClick: () => setStatus(s), children: STATUS_LABEL2[s] }, s)) }),
+                /* @__PURE__ */ jsx(PillPicker, { label: t("issue.assignee"), value: `@${assignee}`, changed: assignee !== initial.assignee, children: TEAM.map((u) => /* @__PURE__ */ jsxs("button", { type: "button", className: "sw-pop-item w-full text-left", onClick: () => setAssignee(u), children: [
+                  "@",
+                  u
+                ] }, u)) }),
+                /* @__PURE__ */ jsx(PillPicker, { label: t("issue.priority"), value: PRIORITY_LABEL[priority], changed: priority !== initial.priority, children: Object.keys(PRIORITY_LABEL).map((p) => /* @__PURE__ */ jsx("button", { type: "button", className: "sw-pop-item w-full text-left", onClick: () => setPriority(p), children: PRIORITY_LABEL[p] }, p)) }),
+                hasChanges && /* @__PURE__ */ jsxs("span", { className: "badge badge-attention", children: [
+                  "\u21BB ",
+                  t("issue.submitWithChanges")
+                ] }),
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    className: "btn btn-primary btn-sm ml-auto",
+                    onClick: () => {
+                      setBody("");
+                      setComposerOpen(false);
+                    },
+                    disabled: !body.trim(),
+                    children: [
+                      /* @__PURE__ */ jsx(Send, { size: 12 }),
+                      " ",
+                      t("common.submit")
+                    ]
+                  }
+                )
+              ] })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+function SidebarField({ label, children }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-1", children })
+  ] });
+}
+function PillPicker({
+  label,
+  value,
+  changed,
+  children
+}) {
+  return /* @__PURE__ */ jsxs(Popover.Root, { children: [
+    /* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cn(
+          "chip text-xs cursor-pointer",
+          changed && "border border-[var(--attention)] text-[var(--attention)]"
+        ),
+        children: [
+          label,
+          ": ",
+          value
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(Popover.Content, { className: "sw-pop", align: "start", sideOffset: 4, style: { width: 200 }, children: /* @__PURE__ */ jsx("div", { className: "sw-pop-list", children }) }) })
+  ] });
+}
+
+export { DashboardScreen, IdeasScreen, IssueDetailScreen, IssuesScreen, PlanDetailScreen, PlansScreen, ProjectsListScreen, WikiScreen };
+//# sourceMappingURL=screens.js.map
+//# sourceMappingURL=screens.js.map