@pactor-app/skills 1.24.0

package/prd-to-app/template/app/api/public/pages/[id]/route.ts

@@ -0,0 +1,40 @@
+import { cookies } from "next/headers";
+
+import { findUserBySession, SESSION_COOKIE } from "@/server/accounts";
+import { corsHeaders, corsPreflight } from "@/server/cors";
+import { getLazyPage } from "@/server/sitemap";
+
+/**
+ * 懒加载页面端点：sitemap 中未内联 pageDsl 的页面按需获取。
+ * 返回 PageResource envelope（id / version / dslVersion / schema），
+ * 接口侧鉴权——前端隐藏菜单不等于安全。
+ */
+export async function GET(
+  request: Request,
+  context: RouteContext<"/api/public/pages/[id]">,
+) {
+  const { id } = await context.params;
+  const store = await cookies();
+  const user = findUserBySession(store.get(SESSION_COOKIE)?.value);
+  const entry = getLazyPage(id, user);
+  if (!entry) {
+    return Response.json(
+      { error: "页面不存在或无权限" },
+      { status: 404, headers: corsHeaders(request) },
+    );
+  }
+  return Response.json(
+    {
+      id,
+      resourceType: "page",
+      version: entry.version,
+      dslVersion: "1.0",
+      schema: entry.pageDsl,
+      updatedAt: new Date().toISOString(),
+    },
+    { headers: { "cache-control": "no-store", ...corsHeaders(request) } },
+  );
+}
+
+/** 预检（跨源带凭据 / 自定义头时） */
+export const OPTIONS = corsPreflight;

package/prd-to-app/template/app/api/sitemap/route.ts

@@ -0,0 +1,21 @@
+import { cookies } from "next/headers";
+
+import { findUserBySession, SESSION_COOKIE } from "@/server/accounts";
+import { corsPreflight, corsHeaders } from "@/server/cors";
+import { buildSitemap } from "@/server/sitemap";
+
+/**
+ * Sitemap 端点（design/dynamic-page.md）：
+ * 会话感知——同一 URL，匿名与不同角色拿到不同 sitemap。
+ * 入口可配置多个此类 URL（src/pactor/config.ts 的 sources）。
+ */
+export async function GET(request: Request) {
+  const store = await cookies();
+  const user = findUserBySession(store.get(SESSION_COOKIE)?.value);
+  return Response.json(buildSitemap(user), {
+    headers: { "cache-control": "no-store", ...corsHeaders(request) },
+  });
+}
+
+/** 预检（跨源带凭据 / 自定义头时） */
+export const OPTIONS = corsPreflight;

package/prd-to-app/template/app/api/users/route.ts

@@ -0,0 +1,57 @@
+import { cookies } from "next/headers";
+
+import { findUserBySession, SESSION_COOKIE } from "@/server/accounts";
+import { corsHeaders, corsPreflight } from "@/server/cors";
+
+/** 演示用户数据（mock）：真实项目由后端用户体系提供 */
+const MOCK_USERS = [
+  { id: "u-1", username: "admin", name: "演示管理员", role: "admin", email: "admin@example.com", createdAt: "2026-01-05" },
+  { id: "u-2", username: "guest", name: "访客", role: "guest", email: "guest@example.com", createdAt: "2026-02-11" },
+  { id: "u-3", username: "zhangwei", name: "张伟", role: "member", email: "zhangwei@example.com", createdAt: "2026-03-02" },
+  { id: "u-4", username: "liuyang", name: "刘洋", role: "member", email: "liuyang@example.com", createdAt: "2026-03-18" },
+  { id: "u-5", username: "chenjing", name: "陈静", role: "member", email: "chenjing@example.com", createdAt: "2026-04-07" },
+  { id: "u-6", username: "wangfang", name: "王芳", role: "member", email: "wangfang@example.com", createdAt: "2026-05-21" },
+  { id: "u-7", username: "zhaolei", name: "赵磊", role: "guest", email: "zhaolei@example.com", createdAt: "2026-06-13" },
+  { id: "u-8", username: "sunna", name: "孙娜", role: "member", email: "sunna@example.com", createdAt: "2026-07-30" },
+];
+
+/**
+ * 用户列表：用户列表页的 http 数据源。
+ * 支持 keyword（姓名 / 用户名模糊匹配）与 role（精确匹配）过滤。
+ * 接口侧鉴权——前端隐藏菜单不等于安全。
+ */
+export async function GET(request: Request) {
+  const store = await cookies();
+  const user = findUserBySession(store.get(SESSION_COOKIE)?.value);
+  if (!user || !user.permissions.includes("user:view")) {
+    return Response.json(
+      { error: "未登录或无权限" },
+      { status: 401, headers: corsHeaders(request) },
+    );
+  }
+
+  const { searchParams } = new URL(request.url);
+  const keyword = (searchParams.get("keyword") ?? "").trim().toLowerCase();
+  const role = searchParams.get("role") ?? "";
+
+  const list = MOCK_USERS.filter((row) => {
+    if (role && row.role !== role) {
+      return false;
+    }
+    if (
+      keyword &&
+      !row.name.toLowerCase().includes(keyword) &&
+      !row.username.toLowerCase().includes(keyword)
+    ) {
+      return false;
+    }
+    return true;
+  });
+
+  return Response.json(list, {
+    headers: { "cache-control": "no-store", ...corsHeaders(request) },
+  });
+}
+
+/** 预检（跨源带凭据 / 自定义头时） */
+export const OPTIONS = corsPreflight;

package/prd-to-app/template/app/globals.css

@@ -0,0 +1,248 @@
+@import "tailwindcss";
+
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --font-sans: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+
+body {
+  background: var(--background);
+  color: var(--foreground);
+}
+
+/* ── 外壳布局：Header 与左侧栏固定，仅中间内容区滚动 ──────────────
+   外层 Layout 锁定视口高度并裁切溢出；Sidebar（.shell-main）占满剩余
+   高度并允许收缩（需压过其自带 min-h-svh，提升选择器优先级），侧栏
+   菜单由 SidebarContent 自带 overflow-auto 滚动，Content 自身滚动。 */
+.shell-root {
+  height: 100dvh;
+  overflow: hidden;
+}
+
+.shell-root .shell-main {
+  flex: 1;
+  min-height: 0;
+}
+
+.shell-content {
+  overflow-y: auto;
+  overscroll-behavior: contain;
+}
+
+/* ── 核心概览指标牌：Grid 项默认拉伸，卡片撑满网格 → 同高自适应 ── */
+.stat-card {
+  height: 100%;
+}
+
+.stat-card [data-slot="card-content"] {
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  gap: 12px;
+}
+
+/* ── Provider 数据卡：hover 手型 + 阴影过渡；点击主体进详情（ProviderCardLink）── */
+.provider-card {
+  cursor: pointer;
+  transition:
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.provider-card:hover {
+  border-color: color-mix(in srgb, var(--foreground) 20%, transparent);
+  box-shadow: 0 8px 24px color-mix(in srgb, var(--foreground) 12%, transparent);
+}
+
+/* 操作按钮组（右上角）：仅 hover 卡片时显示 */
+.provider-card-actions {
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease;
+}
+
+.provider-card:hover .provider-card-actions {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+/* ── Provider 数据卡：内容区撑满卡片高度，能力标签行（末位区块）钉在底部 ── */
+.provider-card [data-slot="card-content"] {
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.provider-card [data-slot="card-content"] > :last-child {
+  margin-top: auto;
+}
+
+/* ── Model 数据卡：hover 手型 + 阴影过渡；点击主体进详情（ModelCardLink）── */
+.model-card {
+  cursor: pointer;
+  transition:
+    box-shadow 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.model-card:hover {
+  border-color: color-mix(in srgb, var(--foreground) 20%, transparent);
+  box-shadow: 0 8px 24px color-mix(in srgb, var(--foreground) 12%, transparent);
+}
+
+/* 操作按钮组（右上角）：仅 hover 卡片时显示 */
+.model-card-actions {
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease;
+}
+
+.model-card:hover .model-card-actions {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+/* ── Model 数据卡：内容区撑满卡片高度，路由摘要行（末位区块）钉在底部 ── */
+.model-card [data-slot="card-content"] {
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.model-card [data-slot="card-content"] > :last-child {
+  margin-top: auto;
+}
+
+/* ── 启用状态徽标：绿色底纹（Badge 的 className 叠加，暗色主题提亮文字）── */
+.badge-enabled {
+  background-color: color-mix(in srgb, #22c55e 15%, transparent);
+  border-color: color-mix(in srgb, #22c55e 45%, transparent);
+  color: #16a34a;
+}
+
+[data-pactor-theme="dark"] .badge-enabled {
+  color: #4ade80;
+}
+
+/* Statistic：标题与数值之间统一 6px 节奏 */
+[data-slot="statistic"] {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+/* 指标牌右上角图标：弱化处理，避免与主数字争夺视觉层级 */
+.stat-card-icon {
+  color: var(--muted-foreground);
+  opacity: 0.65;
+}
+
+/* ── 调试台（客户端调试 / 模型调试）：左右分栏 ────────────────────
+   ≥64rem 时左对话区 + 右 400px 配置/明细栏，窄屏上下堆叠。
+   不用 Tailwind 响应式工具类（lg:flex-row 等）：pactor 预编译样式
+   加载在本文件之后，同优先级的基础类会覆盖本文件中的响应式规则；
+   分栏容器直接挂在 pactor Flex 上（其自带方向/间距类同为单类
+   选择器），故 .debug-split 以双类选择器提升优先级压过它们。 */
+.debug-split.debug-split {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.debug-split-main {
+  min-width: 0;
+}
+
+.debug-split-side {
+  width: 100%;
+  flex-shrink: 0;
+}
+
+@media (min-width: 64rem) {
+  .debug-split.debug-split {
+    /* 吃掉 page-content 剩余高度；交叉轴默认 stretch → 双列等高 */
+    flex: 1;
+    min-height: 0;
+    flex-direction: row;
+  }
+
+  .debug-split-main {
+    flex: 1;
+    min-height: 0;
+  }
+
+  .debug-split-side {
+    width: 400px;
+    min-height: 0;
+    /* 右列内容超出时列内滚动（不产生页面级滚动条） */
+    overflow-y: auto;
+  }
+
+  /* 右列等高：末位卡片吃掉剩余高度，与左列卡片底边对齐 */
+  .debug-split-side > [data-slot="card"]:last-child {
+    flex: 1;
+    min-height: 0;
+  }
+}
+
+/* ── 调试台：双列等高、撑满标题以下区域、页面不出滚动条 ──────────
+   高度链：Page 根（撑满 Content）→ page-content（flex 列）→
+   .debug-split（行模式 flex:1）→ 左列 Card / 对话面板（flex:1 传递高度）→
+   消息列表列内滚动。以下为未分层自定义规则，优先于 Tailwind 分层工具类。 */
+.debug-page {
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.debug-page [data-slot="page-content"] {
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.debug-chat-card,
+.debug-chat-card [data-slot="card-content"] {
+  display: flex;
+  flex-direction: column;
+}
+
+@media (min-width: 64rem) {
+  /* 行模式下锁死页面高度（而非 min-height），高度链硬约束：
+     内容超出时由列内滚动吸收，页面级不出滚动条 */
+  .debug-page {
+    height: 100%;
+  }
+
+  .debug-chat-card,
+  .debug-chat-card [data-slot="card-content"],
+  .debug-chat-root {
+    flex: 1;
+    min-height: 0;
+  }
+
+  /* 行模式下列高确定：消息列表吃掉剩余高度并内部滚动（覆盖组件
+     内 h-[52vh] 兜底——窄屏上下堆叠时仍按 52vh 展示） */
+  .debug-chat-list {
+    flex: 1;
+    height: auto;
+    min-height: 0;
+  }
+}

package/prd-to-app/template/app/layout.tsx

@@ -0,0 +1,49 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import { PactorApp } from "@/pactor/App";
+// 顺序约定：globals（本项目 tailwind 工具类 + 皮肤无关的外壳规则）→
+// ui 预建样式（同层冲突时 ui 胜出，保证其内部 base/响应式变体排序生效，
+// 如 Sidebar 的 hidden md:block）→ login.css（登录页视觉，须在 ui 之后，
+// 经 data-slot 钩子压过组件默认样式）。主题令牌由 public/skins/<skin>.css
+// 经下方内联脚本在首屏注入（link 后加载者胜出）。
+import "./globals.css";
+import "@pactor-app/ui/styles.css";
+import "./login.css";
+
+export const metadata: Metadata = {
+  title: "Pactor Console",
+  description: "Pactor Console 管理台",
+};
+
+export default function RootLayout({ children }: LayoutProps<"/">) {
+  return (
+    <html
+      lang="zh-CN"
+      suppressHydrationWarning
+      className={`h-full antialiased`}
+    >
+      <head>
+        <script
+          dangerouslySetInnerHTML={{
+            // 首屏渲染前加载皮肤 link（data-pactor-skin 标记，对应 public/skins/，
+            // 由 Theme Studio 生成；运行时换肤见 src/pactor/skin.ts）并应用明暗
+            //（data-pactor-theme），避免闪烁。皮肤与明暗偏好持久化在
+            // localStorage（mc-skin / mc-mode），由 Header 的 ThemeSwitcher 写入；
+            // mc-mode 缺省时跟随系统并监听变化。
+            // suppressHydrationWarning 容忍 data-pactor-theme 造成的 hydration 差异。
+            __html: `(function(){var root=document.documentElement;var skin=localStorage.getItem("mc-skin")||"chenwunaifu";var link=document.createElement("link");link.rel="stylesheet";link.href="/skins/"+skin+".css";link.setAttribute("data-pactor-skin",skin);document.head.appendChild(link);var m=window.matchMedia("(prefers-color-scheme: dark)");function apply(){var mode=localStorage.getItem("mc-mode");var dark=mode?mode==="dark":m.matches;if(dark){root.setAttribute("data-pactor-theme","dark")}else{root.removeAttribute("data-pactor-theme")}}apply();m.addEventListener("change",apply)})()`,
+          }}
+        />
+      </head>
+      <body className="h-full flex flex-col">
+        {/*
+         * PactorApp 挂在 Next layout 而非 page：App Router 导航时 page 会
+         * 重挂载、layout 常驻——sitemap 只拉取一次，切换导航只刷新内容区。
+         * children（page）恒为 null，路由由 PactorApp 内部按 sitemap 解析。
+         */}
+        <PactorApp />
+        {children}
+      </body>
+    </html>
+  );
+}

package/prd-to-app/template/app/login.css

@@ -0,0 +1,122 @@
+/* 登录页视觉优化：居中渐变背景 + 卡片/表单细节打磨。
+   作用域限定 .login-page；DSL 不支持自定义 className，
+   故经 Pactor 组件的 data-slot 钩子定位（须在 @pactor-app/ui/styles.css 之后加载）。 */
+
+.login-page {
+  flex: 1;
+  min-height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 3rem 1rem;
+  background: radial-gradient(circle at 20% 15%, rgba(128, 165, 160, .2), transparent 32%), radial-gradient(circle at 85% 88%, rgba(223, 127, 71, .1), transparent 34%), #fff;
+}
+
+.login-card {
+    width: min(100%, 420px);
+    padding: 32px 28px;
+    border-radius: 16px;
+    background: rgba(250, 250, 249, .78);
+    backdrop-filter: blur(18px);
+    -webkit-backdrop-filter: blur(18px);
+    box-shadow: 0 24px 70px rgba(35, 42, 39, .14);
+}
+
+@media (prefers-color-scheme: dark) {
+  .login-page {
+    background:
+      radial-gradient(circle at 20% 15%, rgb(128 165 160 / 0.16), transparent 34%),
+      radial-gradient(circle at 85% 88%, rgb(223 127 71 / 0.08), transparent 36%),
+      #0e1211;
+  }
+
+  /* 登录卡片：磨砂底转为深色半透明，边框按暗场调整 */
+  .login-card {
+    background: rgb(22 27 25 / 0.72);
+    border-color: rgb(255 255 255 / 0.08);
+    box-shadow: 0 24px 70px rgba(35, 42, 39, .14);
+  }
+
+  .login-page [data-slot="button"]:hover {
+    box-shadow: 0 6px 16px -6px rgb(0 0 0 / 0.6);
+  }
+}
+
+/* 登录卡片：更圆、入场动画（全站 Card 无阴影，见 theme.css） */
+.login-page [data-slot="card"] {
+  width: 100%;
+  max-width: 26rem;
+  border-radius: calc(var(--radius) * 2);
+  animation: login-card-in 0.45s cubic-bezier(0.21, 1.02, 0.73, 1) both;
+}
+
+@keyframes login-card-in {
+  from {
+    opacity: 0;
+    transform: translateY(12px) scale(0.98);
+  }
+  to {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+/* 标题区三行文字（RESTRICTED ACCESS / 管理后台登录 / 副标题），
+   Text 组件经 className 透传定位；卡片内容 gap 较宽，用负 margin 收紧组内间距 */
+.login-page .login-eyebrow {
+  display: block;
+  font-family: var(--font-geist-mono), ui-monospace, monospace;
+  font-size: 0.75rem;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--primary);
+  margin-bottom: 12px;
+}
+
+.login-page .login-heading {
+  display: block;
+  margin-top: -0.375rem;
+  font-size: 1.5rem;
+  font-weight: 700;
+  letter-spacing: 0.01em;
+  margin-bottom: 24px;
+}
+
+.login-page .login-subtitle {
+  display: block;
+  margin-top: -0.375rem;
+  font-size: 0.875rem;
+  margin-bottom: 28px;
+}
+
+.login-page .login-demo-hint {
+  display: block;
+  font-size: 0.8125rem;
+}
+
+/* 提示条圆角跟随卡片 */
+.login-page [data-slot="alert"] {
+  border-radius: calc(var(--radius) * 1.2);
+}
+
+/* 输入框加高 */
+.login-page [data-slot="input"] {
+  height: 2.75rem;
+}
+
+/* 登录按钮：加高、加粗、悬浮/按压反馈 */
+.login-page [data-slot="button"] {
+  height: 2.75rem;
+  font-weight: 600;
+  transition:
+    transform 0.15s ease,
+    box-shadow 0.15s ease;
+}
+
+.login-page [data-slot="button"]:hover {
+  box-shadow: 0 6px 16px -6px rgb(15 23 42 / 0.35);
+}
+
+.login-page [data-slot="button"]:active {
+  transform: translateY(1px);
+}

package/prd-to-app/template/eslint.config.mjs

@@ -0,0 +1,18 @@
+import { defineConfig, globalIgnores } from "eslint/config";
+import nextVitals from "eslint-config-next/core-web-vitals";
+import nextTs from "eslint-config-next/typescript";
+
+const eslintConfig = defineConfig([
+  ...nextVitals,
+  ...nextTs,
+  // Override default ignores of eslint-config-next.
+  globalIgnores([
+    // Default ignores of eslint-config-next:
+    ".next/**",
+    "out/**",
+    "build/**",
+    "next-env.d.ts",
+  ]),
+]);
+
+export default eslintConfig;

package/prd-to-app/template/next-env.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+import "./.next/dev/types/routes.d.ts";
+import "./.next/dev/types/root-params.d.ts";
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/prd-to-app/template/next.config.js

@@ -0,0 +1,32 @@
+/**
+ * Next.js 构建配置。
+ *
+ * API_BASE_URLS：各环境默认的外部接口基准地址（SitemapApp baseUrl）。
+ * - 环境由构建命令注入（scripts/build.mjs 设置 APP_ENV：
+ *   build / build:dev / build:test → production / development / test）；
+ * - 解析结果经 env 配置内联进客户端包（src/pactor/config.ts 消费）；
+ * - test / production 为占位域名，接入真实环境时替换；
+ * - 构建环境可设 NEXT_PUBLIC_API_BASE_URL 显式覆盖（域名不符合约定时）。
+ */
+const API_BASE_URLS = {
+  /** 本地开发：dev 端口 9011 */
+  development: 'http://localhost:9011',
+  /** 测试环境：替换为实际测试环境 API 域名 */
+  test: 'https://api-test.example.com',
+  /** 生产环境：替换为实际生产 API 域名 */
+  production: 'https://api.example.com',
+};
+
+const appEnv = ['development', 'test', 'production'].includes(process.env.APP_ENV)
+  ? process.env.APP_ENV
+  : 'development';
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  env: {
+    NEXT_PUBLIC_API_BASE_URL:
+      process.env.NEXT_PUBLIC_API_BASE_URL ?? API_BASE_URLS[appEnv],
+  },
+};
+
+module.exports = nextConfig;

package/prd-to-app/template/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "prd-app-template",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev -p 9011",
+    "build": "node scripts/build.mjs production",
+    "start": "next start -p 9011",
+    "lint": "eslint",
+    "build:dev": "node scripts/build.mjs development",
+    "build:test": "node scripts/build.mjs test"
+  },
+  "dependencies": {
+    "@pactor-app/core": "^1.23.0",
+    "@pactor-app/runtime": "^1.23.0",
+    "@pactor-app/ui": "^1.23.0",
+    "lucide-react": "1.45.0",
+    "next": "16.3.5",
+    "pactor-app": "^1.23.0",
+    "react": "19.2.8",
+    "react-dom": "19.2.8",
+    "yaml": "^2.9.1"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "eslint": "^9",
+    "eslint-config-next": "16.3.5",
+    "tailwindcss": "^4",
+    "typescript": "^5"
+  }
+}