新建作品改为直接进入对话落盘，按本局创作方案写能力，并把楼层呈现和零层卡分开。

输入栏同时可以按分组切换模型。 Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-30 12:00:46 +08:00
parent 39fe2732fb
commit c2c9203fb0
87 changed files with 8413 additions and 3180 deletions
@@ -0,0 +1,124 @@
+# 对照
+
+## intro
+
+```intro
+正文和一块结构同时在屏上。谁占主面积按本局定。抬头可贴在这一行的上沿。
+```
+
+## layout
+
+```layout
+id: alongside
+主区: 正文与结构，并排
+可加窄带: 抬头、文字选项
+摆放:
+  抬头: 最上的一行短内容
+  正文: 一栏
+  结构: 另一栏。创作时写一次绘图渲染器并固定；游玩把运行拓扑的节点与连接灌进去出图。不把节点写成清单。折叠标题用本局这块内容的短名
+  文字选项: 最下，始终直接可见，不放进标签或折叠
+窄屏改为上下排列。未启用的区不留空位。
+```
+
+## note
+
+```note
+不替换：正文和结构同屏。窄屏改为上下。选项在最下，直接可见。结构用创作时固定的绘图器，游玩灌入拓扑。
+可替换：两栏谁更宽、抬头文字、结构块的短名、配色和字体。本局没有结构时改用阅读或正文为主。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <p id="heading"></p>
+  <div class="pair">
+    <article id="body"></article>
+    <section id="structure">
+      <div id="graph"></div>
+    </section>
+  </div>
+  <ol id="options"></ol>
+</div>
+
+css:
+:root { color: #1c1915; background: #f7f3ea; }
+#app { max-width: 56rem; margin: 0 auto; padding: 1.25rem; font: 16px/1.6 "Palatino Linotype", "Songti SC", serif; }
+.pair { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 1rem; }
+#structure { border: 1px solid #d5cbb8; border-radius: 6px; padding: 0.8rem; background: #fffdf8; }
+#graph { min-height: 8rem; }
+#options { margin: 1rem 0 0; padding-left: 1.2rem; }
+@media (max-width: 720px) { .pair { grid-template-columns: 1fr; } }
+
+js:
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putText("heading", blocks.heading);
+  putText("body", blocks.body);
+  putGraph("graph", blocks.structure);
+  putList("options", blocks.options);
+});
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+function putGraph(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  var nodes = value && Array.isArray(value.nodes) ? value.nodes : [];
+  var links = value && Array.isArray(value.links) ? value.links : [];
+  if (!nodes.length) { el.remove(); return; }
+  var step = 120;
+  var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+  svg.setAttribute("viewBox", "0 0 " + Math.max(nodes.length * step, step) + " 92");
+  svg.setAttribute("width", "100%");
+  svg.setAttribute("height", "92");
+  var at = {};
+  nodes.forEach(function (node, i) { at[node.id] = i; });
+  links.forEach(function (link) {
+    var a = at[link.from];
+    var b = at[link.to];
+    if (a == null || b == null) return;
+    var line = document.createElementNS(svg.namespaceURI, "line");
+    line.setAttribute("x1", 48 + a * step);
+    line.setAttribute("y1", 34);
+    line.setAttribute("x2", 48 + b * step);
+    line.setAttribute("y2", 34);
+    line.setAttribute("stroke", "#8a5a2b");
+    svg.appendChild(line);
+  });
+  nodes.forEach(function (node, i) {
+    var x = 48 + i * step;
+    var circle = document.createElementNS(svg.namespaceURI, "circle");
+    circle.setAttribute("cx", x);
+    circle.setAttribute("cy", 34);
+    circle.setAttribute("r", 14);
+    circle.setAttribute("fill", node.current ? "#1c1915" : "#fffdf8");
+    circle.setAttribute("stroke", "#1c1915");
+    var label = document.createElementNS(svg.namespaceURI, "text");
+    label.setAttribute("x", x);
+    label.setAttribute("y", 70);
+    label.setAttribute("text-anchor", "middle");
+    label.setAttribute("font-size", "12");
+    label.textContent = String(node.name || node.id || "");
+    svg.appendChild(circle);
+    svg.appendChild(label);
+  });
+  el.appendChild(svg);
+}
+function putList(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (!Array.isArray(value) || !value.length) { el.remove(); return; }
+  value.forEach(function (line) {
+    var li = document.createElement("li");
+    li.textContent = String(line);
+    el.appendChild(li);
+  });
+}
+```
@@ -0,0 +1,16 @@
+# 壳参考库。正文组成与 0 层正文组成读取后，按本局启用的区改一版并固定。
+# 旧 present-shells 只留给现有渲染器，不作为生成样本。
+
+shells:
+  - id: reading
+    name: 阅读
+  - id: dual-text
+    name: 正文为主
+  - id: data-cards
+    name: 数据常驻
+  - id: alongside
+    name: 对照
+  - id: paged
+    name: 分时
+  - id: piece
+    name: 成稿
@@ -0,0 +1,125 @@
+# 数据常驻
+
+## intro
+
+```intro
+数据一直铺在面上，不折叠，也不替换正文。正文仍是数百字的主文，占较宽的一栏。另一路内容占较窄的一栏。选项始终直接可见。
+```
+
+## layout
+
+```layout
+id: data-cards
+主区: 数据常驻
+附区: 正文（数百字）、窄栏
+可加窄带: 抬头、文字选项
+摆放:
+  抬头: 最上的一行
+  数据: 一直展开，紧挨抬头。当前值都短则并排；任一条较长则整组改为上下排列
+  正文: 数据之下较宽的一栏，不因数据常驻而缩成一句
+  窄栏: 较窄的一栏。栏顶标题按本局这块内容填写。窄屏改为正文在上、窄栏在下
+  文字选项: 最下，始终直接可见
+本局没有窄栏时删掉窄栏，正文占回整宽。两三条短内容用阅读壳的抬头一行，不用本壳。未启用的区不留空位。
+```
+
+## note
+
+```note
+不替换：数据区在抬头下一直展开。正文在其下较宽的一栏，篇幅仍是数百字。窄栏在较窄的一栏。选项在两栏之下，直接可见。窄屏时宽栏在上。
+可替换：数据项的名称、条数和当前值，窄栏的标题和条目，配色和字体。本局没有窄栏时删掉窄栏，正文占回整宽。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <p id="heading"></p>
+  <div id="cards"></div>
+  <div class="pair">
+    <article id="body"></article>
+    <aside class="side">
+      <p id="side-title"></p>
+      <div id="side"></div>
+    </aside>
+  </div>
+  <ol id="options"></ol>
+</div>
+
+css:
+:root { color: #1c2420; background: #d5ddd4; }
+#app { max-width: 52rem; margin: 0 auto; padding: 1rem; font: 15px/1.75 "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
+#heading { margin: 0 0 0.6rem; font-size: 13px; }
+#cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.45rem; margin-bottom: 0.75rem; }
+#cards.stack { grid-template-columns: 1fr; }
+.card { padding: 0.4rem 0.55rem; border-radius: 4px; background: rgba(255,255,255,0.72); }
+.card b { display: block; font-size: 12px; font-weight: 600; color: #5c6b62; }
+.card span { font-size: 1.05rem; font-weight: 650; }
+.pair { display: grid; grid-template-columns: 1.65fr 0.72fr; gap: 0.7rem; align-items: start; }
+#body { margin: 0; padding: 0.85rem 1rem; border-radius: 6px; background: #f7faf6; }
+.side { padding: 0.55rem 0.65rem; border-radius: 6px; background: rgba(22,28,26,0.88); color: #f2f4f2; font-size: 13px; line-height: 1.45; }
+#side-title { margin: 0 0 0.15rem; padding-bottom: 0.35rem; border-bottom: 1px solid rgba(255,255,255,0.16); font-weight: 700; }
+#options { margin: 0.75rem 0 0; padding: 0; list-style: none; }
+#options li { margin-top: 0.35rem; padding: 0.35rem 0.7rem; border-radius: 4px; background: rgba(255,255,255,0.72); }
+@media (max-width: 720px) { .pair, #cards { grid-template-columns: 1fr; } }
+
+js:
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putText("heading", blocks.heading);
+  putText("side-title", blocks.side_title);
+  putText("body", blocks.body);
+  putCards("cards", blocks.cards);
+  putLines("side", blocks.side);
+  putList("options", blocks.options);
+});
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+function putCards(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  var rows = Array.isArray(value) ? value : [];
+  if (!rows.length) { el.remove(); return; }
+  var long = rows.some(function (row) { return String(row.value ?? "").length > 8; });
+  el.classList.toggle("stack", long);
+  rows.forEach(function (row) {
+    var card = document.createElement("div");
+    card.className = "card";
+    var name = document.createElement("b");
+    var num = document.createElement("span");
+    name.textContent = String(row.name || "");
+    num.textContent = String(row.value ?? "");
+    card.appendChild(name);
+    card.appendChild(num);
+    el.appendChild(card);
+  });
+}
+function putLines(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  var rows = Array.isArray(value) ? value : [];
+  if (!rows.length) { el.remove(); return; }
+  rows.forEach(function (line) {
+    var p = document.createElement("p");
+    p.textContent = String(line && line.text != null ? line.text : line);
+    el.appendChild(p);
+  });
+}
+function putList(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (!Array.isArray(value) || !value.length) { el.remove(); return; }
+  value.forEach(function (line) {
+    var li = document.createElement("li");
+    li.textContent = String(line);
+    el.appendChild(li);
+  });
+}
+```
@@ -0,0 +1,79 @@
+# 双文
+
+## intro
+
+```intro
+正文占满阅读宽度。短文和结构用标签或折叠，点开才看。选项始终直接可见。
+```
+
+## layout
+
+```layout
+id: dual-text
+主区: 正文
+可加: 短文、结构、数据、抬头、文字选项
+摆放:
+  抬头: 最上的一行短内容
+  正文: 占满阅读宽度，按数百字来写
+  短文、结构: 标签或折叠，点开才看。标签用短显示名
+  数据: 若有，默认可收起
+  文字选项: 始终直接可见，不放进标签或折叠
+未启用的区不留空位。
+```
+
+## note
+
+```note
+不替换：正文占满阅读宽度。其余块收在标签或折叠里，默认不展开。选项在这些控件之外，直接可见。
+可替换：标签和折叠的短名、收起块里的文字、配色和字体。本局没有的块删掉。数据要一直展开时改用数据常驻。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <p id="heading"></p>
+  <article id="body"></article>
+  <details>
+    <summary id="vignette-title"></summary>
+    <div id="vignette"></div>
+  </details>
+  <ol id="options"></ol>
+</div>
+
+css:
+:root { color: #1c1915; background: #f7f3ea; }
+#app { max-width: 40rem; margin: 0 auto; padding: 1.25rem; font: 17px/1.75 "Palatino Linotype", "Songti SC", serif; }
+#heading { margin: 0 0 0.8rem; font-size: 0.95rem; }
+#vignette { font-size: 0.92rem; margin-top: 0.6rem; }
+#options { margin: 0.8rem 0 0; padding-left: 1.2rem; }
+summary { cursor: pointer; }
+
+js:
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putText("heading", blocks.heading);
+  putText("body", blocks.body);
+  putText("vignette-title", blocks.vignette_title);
+  putText("vignette", blocks.vignette);
+  putList("options", blocks.options);
+});
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+function putList(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (!Array.isArray(value) || !value.length) { el.remove(); return; }
+  value.forEach(function (line) {
+    var li = document.createElement("li");
+    li.textContent = String(line);
+    el.appendChild(li);
+  });
+}
+```
@@ -0,0 +1,84 @@
+# 分时
+
+## intro
+
+```intro
+正文、小故事、数据卡、结构里有三块以上都要单独看。一次只显示一块，其余用标签切换。切换只改变当前视图。
+```
+
+## layout
+
+```layout
+id: paged
+主区: 当前这一页
+分页: 正文、小故事、数据卡、结构中本局启用且需要单独看的区
+可加窄带: 抬头留在标签之外，始终可见
+摆放:
+  抬头: 标签之上
+  标签: 一行，当前页加下划线。标签用本局该页的短名，不写区种类名
+  页内: 按该区自己的读法排。数据卡用卡片。结构调用已固定的拓扑绘图渲染器，不输出节点清单。
+未启用的区不建标签。
+```
+
+## note
+
+```note
+不替换：同时只显示一页。页用一行标签切换。抬头在标签之外。
+可替换：每个标签的短名、页内文字和数据项、配色和字体。本局未启用的页不建标签。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <p id="heading"></p>
+  <div id="tabs"></div>
+  <div id="page"></div>
+</div>
+
+css:
+:root { color: #1c1915; background: #f7f3ea; }
+#app { max-width: 44rem; margin: 0 auto; padding: 1.25rem; font: 16px/1.65 "Segoe UI", "Source Han Sans SC", sans-serif; }
+#tabs { display: flex; gap: 0.4rem; margin-bottom: 0.9rem; }
+#tabs button { border: 0; border-bottom: 2px solid transparent; background: transparent; padding: 0.35rem 0.6rem; font: inherit; color: inherit; }
+#tabs button[aria-current="true"] { border-bottom-color: #8a5a2b; }
+
+js:
+var pages = [];
+var current = 0;
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putText("heading", blocks.heading);
+  pages = Array.isArray(blocks.pages) ? blocks.pages : [];
+  current = 0;
+  drawTabs();
+  drawPage();
+});
+function drawTabs() {
+  var el = document.getElementById("tabs");
+  el.replaceChildren();
+  pages.forEach(function (page, index) {
+    var button = document.createElement("button");
+    button.type = "button";
+    button.textContent = page.name;
+    if (index === current) button.setAttribute("aria-current", "true");
+    button.addEventListener("click", function () {
+      current = index;
+      drawTabs();
+      drawPage();
+    });
+    el.appendChild(button);
+  });
+}
+function drawPage() {
+  var el = document.getElementById("page");
+  el.textContent = pages[current] ? pages[current].text : "";
+}
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+```
@@ -0,0 +1,66 @@
+# 成稿
+
+## intro
+
+```intro
+一次只放一份能单独拿走的成稿。成稿内部的小节在创作时按这一局的范例重排。选项贴在成稿下面，始终直接可见。
+```
+
+## layout
+
+```layout
+id: piece
+主区: 一份成稿
+可加窄带: 文字选项
+摆放:
+  成稿: 居中。内部小节在创作时按范例重写
+  文字选项: 成稿之后，始终直接可见
+未启用的区不留空位。
+```
+
+## note
+
+```note
+不替换：一份成稿容器居中。选项在容器之后，直接可见。
+可替换：容器内部的标记、分段、配色和字体。按本局这一份成品重写内部。样本内部与本局不同时整段替换，保留容器和选项的前后关系。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <article id="piece"></article>
+  <ol id="options"></ol>
+</div>
+
+css:
+:root { color: #1c1916; background: #ebe6dc; }
+#app { max-width: 34rem; margin: 0 auto; padding: 1.6rem 1.25rem 2rem; font: 16px/1.65 "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
+#piece { margin: 0; }
+#options { margin: 1rem 0 0; padding-left: 1.15rem; }
+
+js:
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putText("piece", blocks.piece);
+  putList("options", blocks.options);
+});
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+function putList(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (!Array.isArray(value) || !value.length) { el.remove(); return; }
+  value.forEach(function (line) {
+    var li = document.createElement("li");
+    li.textContent = String(line);
+    el.appendChild(li);
+  });
+}
+```
@@ -0,0 +1,83 @@
+# 阅读
+
+## intro
+
+```intro
+只展示正文。抬头、文字选项需要时贴在正文前后。本局没有的区从骨架删除。
+```
+
+## layout
+
+```layout
+id: reading
+主区: 正文
+可加窄带: 抬头、文字选项
+摆放:
+  抬头: 正文之前的一行短内容
+  正文: 阅读柱，占主要宽度
+  文字选项: 正文之后，始终直接可见，不放进标签或折叠。不显示「文字选项」这个区名
+未启用的区不留空位。
+```
+
+## note
+
+```note
+不替换：单栏阅读柱。抬头在正文前，独占一行。选项在正文后，直接可见。
+可替换：抬头文字、正文文字、配色和字体。本局没有抬头时删掉抬头。
+```
+
+## sample
+
+```sample
+html:
+<div id="app">
+  <p id="heading"></p>
+  <article id="body"></article>
+  <ol id="options"></ol>
+</div>
+
+css:
+:root { color: #1c1915; background: #f7f3ea; }
+#app { max-width: 38rem; margin: 0 auto; padding: 1.5rem 1.25rem 2.5rem; font: 17px/1.75 "Palatino Linotype", "Songti SC", serif; }
+#heading { margin: 0 0 0.85rem; font-size: 0.95rem; letter-spacing: 0.04em; }
+#body { font-size: 1.05rem; }
+#options { margin: 1.25rem 0 0; padding-left: 1.2rem; }
+
+js:
+present.onData(function (data) {
+  var blocks = (data && data.blocks) || {};
+  putHeading("heading", blocks.heading);
+  putText("body", blocks.body);
+  putList("options", blocks.options);
+});
+function putHeading(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (value == null || value === "") { el.remove(); return; }
+  if (typeof value === "string") { el.textContent = value; return; }
+  Object.keys(value).forEach(function (key) {
+    var item = document.createElement("span");
+    item.textContent = key + " " + String(value[key]);
+    item.style.marginRight = "1rem";
+    el.appendChild(item);
+  });
+}
+function putText(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  if (value == null || value === "") { el.remove(); return; }
+  el.textContent = String(value);
+}
+function putList(id, value) {
+  var el = document.getElementById(id);
+  if (!el) return;
+  el.replaceChildren();
+  if (!Array.isArray(value) || !value.length) { el.remove(); return; }
+  value.forEach(function (line) {
+    var li = document.createElement("li");
+    li.textContent = String(line);
+    el.appendChild(li);
+  });
+}
+```