dsh-cuigengji-plugin 0.4.2 → 0.4.4

package/src/client/features/memory/index.jsx

@@ -1,81 +1,81 @@
-import {OverviewPage,DetailPage,DetailActions,useDetailTrail} from '../../shared/detail-page.tsx';
-import {DocumentTextarea} from '../../shared/workspace.tsx';
-import {CreateDocument} from '../../shared/creation.tsx';
-import {RelationCanvas} from './RelationCanvas.tsx';
-import {Modal,useWorkbenchPreferences} from '../../shared/preferences.tsx';
-import {ViewSwitch,FilterControl,SearchControl} from '../../shared/workspace.tsx';
-import {Groups, GroupSelect, filterGroup} from '../../shared/groups.tsx';
-import {BatchManager,BatchList} from '../../shared/batch-management.tsx';
-import React,{useEffect,useRef,useState} from 'react';
-import {useDialog} from '../../dialog.tsx';
-import {useDraft,useResource,usePreference} from '../../shared/state.js';
-import {ResourceState,SaveBar,saveShortcut} from '../../shared/ui.jsx';
-
-const kind=n=>n.type==='character_card'?'角色卡':'世界书';
+import {OverviewPage,DetailPage,DetailActions,useDetailTrail} from '../../shared/detail-page.tsx';
+import {DocumentTextarea} from '../../shared/workspace.tsx';
+import {CreateDocument} from '../../shared/creation.tsx';
+import {RelationCanvas} from './RelationCanvas.tsx';
+import {Modal,useWorkbenchPreferences} from '../../shared/preferences.tsx';
+import {ViewSwitch,FilterControl,SearchControl} from '../../shared/workspace.tsx';
+import {Groups, GroupSelect, filterGroup} from '../../shared/groups.tsx';
+import {BatchManager,BatchList} from '../../shared/batch-management.tsx';
+import React,{useEffect,useRef,useState} from 'react';
+import {useDialog} from '../../dialog.tsx';
+import {useDraft,useResource,usePreference} from '../../shared/state.js';
+import {ResourceState,SaveBar,saveShortcut} from '../../shared/ui.jsx';
+
+const kind=n=>n.type==='character_card'?'角色卡':'世界书';
 export function Memory({call,novelId,tick,run,busy,onTransfer}) {
  const {preferences}=useWorkbenchPreferences();
  const {confirm}=useDialog();
- const [view,setView]=useState(preferences.memoryView),[batch,setBatch]=useState(false),[creating,setCreating]=useState(null);
- const [selected,setSelected]=usePreference(`${novelId}:memory-selected`,null);
- const [node,setNode]=useState(null),[edge,setEdge]=useState(null),[query,setQuery]=useState(''),[filter,setFilter]=useState(''),[group,setGroup]=useState(''),[checked,setChecked]=useState([]),[error,setError]=useState(''),[poll,setPoll]=useState(0);
- const request=useRef(0),canvas=useRef(null),batchView=useRef(view);
- const trail=useDetailTrail(node?.id||null);
- const resource=useResource(()=>Promise.all([call('graph.list',{novelId,query,groupId:filterGroup(group)}),call('edge.list',{novelId}),call('graph.groups',{novelId})]),[call,novelId,tick,poll,query,group]);
- const [nodes=[],edges=[],groups=[]]=resource.value||[];
- useEffect(()=>{const timer=setInterval(()=>{if(!document.hidden)setPoll(v=>v+1);},5000);return()=>{clearInterval(timer);request.current++;};},[]);
- const open=async (id,back=false)=>{const seq=++request.current;setError('');try{const data=await call('graph.get',{novelId,nodeId:id});if(seq===request.current){if(back)trail.back(id);else trail.visit(id);setNode(data);setSelected(id);setEdge(null);}}catch(e){if(seq===request.current)setError(e.message);}};
- useEffect(()=>{if(selected)open(selected);},[]);
+ const [view,setView]=useState(preferences.memoryView),[batch,setBatch]=useState(false),[creating,setCreating]=useState(null);
+ const [selected,setSelected]=usePreference(`${novelId}:memory-selected`,null);
+ const [node,setNode]=useState(null),[edge,setEdge]=useState(null),[query,setQuery]=useState(''),[filter,setFilter]=useState(''),[group,setGroup]=useState(''),[checked,setChecked]=useState([]),[error,setError]=useState(''),[poll,setPoll]=useState(0);
+ const request=useRef(0),canvas=useRef(null),batchView=useRef(view);
+ const trail=useDetailTrail(node?.id||null);
+ const resource=useResource(()=>Promise.all([call('graph.list',{novelId,query,groupId:filterGroup(group)}),call('edge.list',{novelId}),call('graph.groups',{novelId})]),[call,novelId,tick,poll,query,group]);
+ const [nodes=[],edges=[],groups=[]]=resource.value||[];
+ useEffect(()=>{const timer=setInterval(()=>{if(!document.hidden)setPoll(v=>v+1);},5000);return()=>{clearInterval(timer);request.current++;};},[]);
+ const open=async (id,back=false)=>{const seq=++request.current;setError('');try{const data=await call('graph.get',{novelId,nodeId:id});if(seq===request.current){if(back)trail.back(id);else trail.visit(id);setNode(data);setSelected(id);setEdge(null);}}catch(e){if(seq===request.current)setError(e.message);}};
+ useEffect(()=>{if(selected)open(selected);},[]);
  const create=(type,position,connection)=>setCreating({type,position:position||canvas.current?.(),connection:connection?{...connection,expectedRevision:allNodes.find(n=>n.id===connection.id)?.revision}:undefined});
- const saved=n=>{if(n)trail.visit(n.id);else trail.clear();setNode(n);setSelected(n?.id||null);};
- const all=useResource(()=>call('graph.list',{novelId}),[call,novelId,tick,poll]);
+ const saved=n=>{if(n)trail.visit(n.id);else trail.clear();setNode(n);setSelected(n?.id||null);};
+ const all=useResource(()=>call('graph.list',{novelId}),[call,novelId,tick,poll]);
  const merged=new Map();for(const n of [...(all.value||[]),...nodes])if(!merged.has(n.id)||merged.get(n.id).revision<n.revision)merged.set(n.id,n);
  const allNodes=[...merged.values()];
- const related=edges.filter(e=>e.from===node?.id||e.to===node?.id);
- const visible=nodes.filter(n=>!filter||n.type===filter);
- const batchItems=visible.map(n=>({id:n.id,title:n.name,summary:n.summary,meta:[kind(n),groups.find(g=>g.id===n.groupId)?.name].filter(Boolean).join(' · ')}));
- const beginBatch=()=>{batchView.current=view;setBatch(true);setChecked([]);setView('list');};
- const endBatch=()=>{setBatch(false);setChecked([]);setView(batchView.current);};
- const clear=()=>{setQuery('');setFilter('');setGroup('');};
- const close=()=>{if(trail.previous){void open(trail.previous,true);return;}request.current++;trail.clear();setNode(null);setEdge(null);setSelected(null);};
- const connect=(from,to)=>setEdge({from,to,name:'',content:''});
- const connectDirect=(from,to)=>run(()=>call('edge.create',{novelId,from,to,name:'',content:'',requestId:crypto.randomUUID()}));
+ const related=edges.filter(e=>e.from===node?.id||e.to===node?.id);
+ const visible=nodes.filter(n=>!filter||n.type===filter);
+ const batchItems=visible.map(n=>({id:n.id,title:n.name,summary:n.summary,meta:[kind(n),groups.find(g=>g.id===n.groupId)?.name].filter(Boolean).join(' · ')}));
+ const beginBatch=()=>{batchView.current=view;setBatch(true);setChecked([]);setView('list');};
+ const endBatch=()=>{setBatch(false);setChecked([]);setView(batchView.current);};
+ const clear=()=>{setQuery('');setFilter('');setGroup('');};
+ const close=()=>{if(trail.previous){void open(trail.previous,true);return;}request.current++;trail.clear();setNode(null);setEdge(null);setSelected(null);};
+ const connect=(from,to)=>setEdge({from,to,name:'',content:''});
+ const connectDirect=(from,to)=>run(()=>call('edge.create',{novelId,from,to,name:'',content:'',requestId:crypto.randomUUID()}));
  const saveLayout=(points,revisions={},requestId=crypto.randomUUID())=>run(()=>call('graph.layout',{novelId,requestId,positions:Object.entries(points).map(([nodeId,position])=>({nodeId,position,expectedRevision:revisions[nodeId]??allNodes.find(n=>n.id===nodeId)?.revision}))}));
- const disconnect=items=>run(()=>call('edge.disconnect',{novelId,requestId:crypto.randomUUID(),confirm:true,edges:items.map(e=>({id:e.id,expectedRevision:e.revision}))}));
- const removeNodes=async ids=>{if(ids.length&&!busy&&await confirm(`删除选中的 ${ids.length} 张设定卡片及其关系？`))await run(()=>call('graph.remove',{novelId,requestId:crypto.randomUUID(),confirm:true,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))}));};
+ const disconnect=items=>run(()=>call('edge.disconnect',{novelId,requestId:crypto.randomUUID(),confirm:true,edges:items.map(e=>({id:e.id,expectedRevision:e.revision}))}));
+ const removeNodes=async ids=>{if(ids.length&&!busy&&await confirm(`删除选中的 ${ids.length} 张设定卡片及其关系？`))await run(()=>call('graph.remove',{novelId,requestId:crypto.randomUUID(),confirm:true,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))}));};
  const duplicateNodes=(ids,points={})=>run(()=>call('graph.duplicate',{novelId,requestId:crypto.randomUUID(),members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision,...(points[id]?{position:points[id]}:{})}))}));
- const moveNodes=(ids,groupId)=>run(()=>call('graph.move',{novelId,requestId:crypto.randomUUID(),groupId,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))}));
- if(creating)return <CreateDocument draftKey={`${novelId}:memory-create:${creating.type}:${creating.connection?.id||'new'}`} label={creating.type==='character_card'?'新建角色卡':'新建世界书'} context={creating.connection?'创建后自动连接到原设定':undefined} initial={{title:'',summary:'',content:'',groupId:filterGroup(group)||allNodes.find(n=>n.id===creating.connection?.id)?.groupId||null}} {...{groups,busy}} close={()=>setCreating(null)} createGroup={async name=>{let result;await run(async()=>{result=await call('graph.group.create',{novelId,name});});return result;}} save={(value,requestId)=>run(async()=>{const fields={type:creating.type,name:value.title,summary:value.summary,content:value.content,groupId:value.groupId,...(creating.position?{position:creating.position}:{})};const result=creating.connection?await call('graph.continue',{novelId,requestId,nodeId:creating.connection.id,expectedRevision:creating.connection.expectedRevision,side:creating.connection.side,value:fields}):await call('graph.create',{novelId,requestId,...fields});saved(result.node||result);})}/>;
- return <div className="memory-workspace"><OverviewPage active={!node}><header className="module-heading canvas-heading"><div className="module-toolbar">
- <Groups {...{groups,busy,call,run,novelId}} prefix="graph" value={group} onChange={value=>{setGroup(value);setChecked([]);}}/>
- <FilterControl label="类型" value={filter} change={setFilter}><option value="">全部类型</option><option value="character_card">角色卡</option><option value="world_entry">世界书</option></FilterControl>
- <span className="toolbar-spacer"/><SearchControl label="搜索设定" value={query} change={setQuery}/>{!batch&&<><ViewSwitch value={view} change={setView} graph="画布"/>
- <button className="module-select" aria-label="多选" disabled={busy} onClick={beginBatch}>多选</button><details className="menu"><summary className="primary">＋ 设定</summary><div className="menu-panel"><button disabled={busy} onClick={()=>create('character_card')}>新建角色卡</button><button disabled={busy} onClick={()=>create('world_entry')}>新建世界书</button></div></details>
- <details className="menu"><summary aria-label="设定更多操作">···</summary><div className="menu-panel"><button disabled={busy} onClick={()=>onTransfer({mode:'import',selection:{kind:'memory',novelId}})}>导入设定</button><button disabled={busy} onClick={()=>onTransfer({mode:'export',selection:{kind:'memory',novelId,nodeIds:visible.map(n=>n.id)}})}>导出当前设定范围</button></div></details></>}
- </div>{(query||group||filter)&&<div className="active-filters"><button onClick={clear}>清除筛选 <span aria-hidden="true">×</span></button></div>}</header>
- <div className="memory-layout"><div className="memory-overview">{batch&&<BatchManager items={batchItems} selected={checked} change={setChecked} groups={groups} busy={busy||resource.loading} done={endBatch} onMove={(ids,groupId)=>run(async()=>{await call('graph.move',{novelId,groupId,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))});setChecked([]);})}/>}<ResourceState resource={resource}>
- {batch?<BatchList items={batchItems} selected={checked} change={setChecked} busy={busy||resource.loading}/>:view==='canvas'?<RelationCanvas key={novelId} scopeKey={`${novelId}:settings`} nodes={visible} allNodes={allNodes} edges={edges} groups={groups} busy={busy} onReady={center=>{canvas.current=center;}} onNew={(position,connection,type)=>create(type||allNodes.find(n=>n.id===connection?.id)?.type||'character_card',position,connection)} onSelect={open} onConnect={connectDirect} onLayout={saveLayout} onEdit={setEdge} onDelete={disconnect} onRemove={removeNodes} onDuplicate={duplicateNodes} onMove={moveNodes}/>:!visible.length?<div className="empty">{query||filter||group?'没有匹配的设定，试试调整筛选。':'添加第一张角色卡或世界书。'}</div>:<div className="library-list">{visible.map(n=><div className="selectable-entry" key={n.id}><button className={`library-entry ${trail.lastOpened===n.id?'selected':''}`} aria-current={trail.lastOpened===n.id?'true':undefined} onClick={()=>open(n.id)}><span className="entry-heading"><strong>{n.name}</strong><small>{kind(n)}</small></span>{n.summary&&<p>{n.summary}</p>}{n.groupId&&<small>{groups.find(g=>g.id===n.groupId)?.name}</small>}</button></div>)}</div>}</ResourceState></div></div></OverviewPage>
- {error&&<p className="notice error" role="alert">{error}</p>}
- {node&&<DetailPage key={node.id} className="memory-detail" backLabel={trail.previous?'‹ 返回上一条':'‹ 返回设定'} onBack={close}><NodeEditor key={node.id||node.type} {...{call,novelId,run,busy,saved,groups,onTransfer}} initial={node} latest={allNodes.find(n=>n.id===node.id)}/>
- {node.id&&<section className="section-fold"><div className="row"><h3 className="grow">相关设定</h3><button disabled={busy||allNodes.length<2} onClick={()=>connect(node.id,allNodes.find(n=>n.id!==node.id)?.id)}>添加关系</button></div>{related.map(e=><div key={e.id} className="related-entry"><button onClick={()=>open(e.from===node.id?e.to:e.from)}>{allNodes.find(n=>n.id===(e.from===node.id?e.to:e.from))?.name||'设定'}</button>{e.name&&<small>{e.name}</small>}{e.content&&<p>{e.content}</p>}<button aria-label={`修改关系 ${e.name||'连线'}`} onClick={()=>setEdge(e)}>···</button></div>)}</section>}
- </DetailPage>}{edge&&<Modal title={edge.id?'编辑关系':'添加关系'} close={()=>setEdge(null)}><EdgeEditor key={edge.id||`new:${edge.from}:${edge.to}`} {...{call,novelId,run,busy}} nodes={allNodes} initial={edge} saved={()=>setEdge(null)}/></Modal>}</div>;
-}
-
-function NodeEditor({call,novelId,run,busy,initial,latest,saved,groups,onTransfer}) {
- const {value,base,change,accept,dirty,cacheError}=useDraft(`${novelId}:node:${initial.id||initial.type+':new'}`,initial);
-  const fresh=useResource(()=>initial.id?call('graph.get',{novelId,nodeId:initial.id}):Promise.resolve(null),[call,novelId,initial.id,latest?.revision]);
-  useEffect(()=>{if(!busy&&!dirty&&fresh.value?.revision>base.revision){accept(fresh.value);saved(fresh.value);}},[fresh.value,busy,dirty,base.revision]);
- const [editing,setEditing]=useState(!initial.id||dirty);const {confirm,ask}=useDialog();
- const set=(key,v)=>change(old=>({...old,[key]:v}));
- const save=()=>{if(!value.name.trim()||busy)return;run(async()=>{const result=await call(value.id?'graph.update':'graph.create',{novelId,nodeId:value.id,expectedRevision:base.revision,type:value.type==='character_card'?'character_card':'world_entry',groupId:value.groupId||null,name:value.name,summary:value.summary||'',content:value.content||''});accept(result);saved(result);setEditing(false);});};
- return <div onKeyDown={e=>saveShortcut(e,save)}><h2>{value.name||`新${kind(value)}`}</h2><DetailActions><button onClick={()=>setEditing(!editing)}>{editing?'阅读':'编辑'}</button></DetailActions>{fresh.error&&<p className="notice error" role="alert">{fresh.error}</p>}{latest&&latest.revision!==base.revision&&<p className="notice">设定已有新版本，本地草稿仍保留。保存会检查冲突。</p>}
- {editing?<fieldset disabled={busy} className="editor-fields document-fields"><label>类型<select value={value.type==='character_card'?'character_card':'world_entry'} onChange={e=>set('type',e.target.value)}><option value="character_card">角色卡</option><option value="world_entry">世界书</option></select></label><div className="creation-settings"><GroupSelect groups={groups} value={value.groupId} onChange={id=>set('groupId',id)}/><button type="button" disabled={busy} onClick={async()=>{const name=await ask('新建分组名称');if(name?.trim())run(async()=>{const g=await call('graph.group.create',{novelId,name});set('groupId',g.id);});}}>＋ 新建分组</button></div><label>名称<input value={value.name} onChange={e=>set('name',e.target.value)}/></label><label>摘要<DocumentTextarea aria-label="摘要" value={value.summary||''} onChange={e=>set('summary',e.target.value)}/></label><label>全文<DocumentTextarea aria-label="全文" className="prose" value={value.content||''} onChange={e=>set('content',e.target.value)}/></label></fieldset>:<><p className="document-summary">{value.summary||'暂无摘要'}</p><article className="document-body">{value.content||'暂无内容'}</article></>}
- {(editing||dirty)&&<SaveBar dirty={dirty||!value.id} {...{busy}} error={cacheError} invalid={!value.name.trim()?'请填写名称':null} onSave={save} label="保存设定"/>}
- {value.id&&<details className="section-fold"><summary>更多操作</summary><button disabled={busy||dirty} title={dirty?'先保存设定后导出':undefined} onClick={()=>onTransfer({mode:'export',selection:{kind:'memory',novelId,nodeIds:[value.id]}})}>导出这条设定</button><button disabled={busy} onClick={async()=>{if(!dirty||await confirm('放弃本地草稿并读取最新设定？'))run(async()=>{const n=await call('graph.get',{novelId,nodeId:value.id});accept(n);saved(n);});}}>读取最新</button><button className="danger" disabled={busy} onClick={async()=>{if(await confirm(`删除“${value.name}”及其关系？`))run(async()=>{await call('graph.delete',{novelId,nodeId:value.id,expectedRevision:base.revision,confirm:true});accept(initial);saved(null);});}}>删除设定</button></details>}
- </div>;
-}
-function EdgeEditor({call,novelId,nodes,run,busy,initial,saved}) {
-  const {value:draft,base,change,accept,dirty,cacheError}=useDraft(`${novelId}:edge:${initial.id||`new:${initial.from}:${initial.to}`}`,initial);
-  const {confirm,ask}=useDialog();
-  const save=()=>{if(draft.from&&draft.to&&!busy)run(async()=>{const e=await call(draft.id?'edge.update':'edge.create',{from:draft.from,to:draft.to,name:draft.name,content:draft.content,novelId,edgeId:draft.id,expectedRevision:base.revision});accept(e);saved(e);});};
-  return <div onKeyDown={e=>saveShortcut(e,save)}><fieldset disabled={busy} className="editor-fields">{[['from','从'],['to','到']].map(([key,label])=><label key={key}>{label}<select value={draft[key]} onChange={e=>change(d=>({...d,[key]:e.target.value}))}>{nodes.map(n=><option key={n.id} value={n.id}>{n.name}</option>)}</select></label>)}<label>关系名称（可选）<input placeholder="例如：居住于、朋友、敌对" value={draft.name||''} onChange={e=>change(d=>({...d,name:e.target.value}))}/></label><label>说明<DocumentTextarea value={draft.content||''} onChange={e=>change(d=>({...d,content:e.target.value}))}/></label></fieldset><SaveBar dirty={dirty||!draft.id} {...{busy}} error={cacheError} invalid={!draft.from||!draft.to?"请选择关系端点":null} onSave={save} label="保存关系"/>{draft.id&&<details><summary>更多操作</summary><button disabled={busy} onClick={async()=>{if(!dirty||await confirm("丢弃关系草稿并读取最新版本？"))run(async()=>{const latest=await call("edge.get",{novelId,edgeId:draft.id});accept(latest);saved(latest);});}}>读取最新关系</button><button disabled={busy} className="danger" onClick={async()=>{if(await confirm('删除这条关系？'))run(async()=>{await call('edge.delete',{novelId,edgeId:draft.id,expectedRevision:base.revision,confirm:true});accept(initial);saved(null);});}}>删除关系</button></details>}</div>;
-}
+ const moveNodes=(ids,groupId)=>run(()=>call('graph.move',{novelId,requestId:crypto.randomUUID(),groupId,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))}));
+ if(creating)return <CreateDocument draftKey={`${novelId}:memory-create:${creating.type}:${creating.connection?.id||'new'}`} label={creating.type==='character_card'?'新建角色卡':'新建世界书'} context={creating.connection?'创建后自动连接到原设定':undefined} initial={{title:'',summary:'',content:'',groupId:filterGroup(group)||allNodes.find(n=>n.id===creating.connection?.id)?.groupId||null}} {...{groups,busy}} close={()=>setCreating(null)} createGroup={async name=>{let result;await run(async()=>{result=await call('graph.group.create',{novelId,name});});return result;}} save={(value,requestId)=>run(async()=>{const fields={type:creating.type,name:value.title,summary:value.summary,content:value.content,groupId:value.groupId,...(creating.position?{position:creating.position}:{})};const result=creating.connection?await call('graph.continue',{novelId,requestId,nodeId:creating.connection.id,expectedRevision:creating.connection.expectedRevision,side:creating.connection.side,value:fields}):await call('graph.create',{novelId,requestId,...fields});saved(result.node||result);})}/>;
+ return <div className="memory-workspace"><OverviewPage active={!node}><header className="module-heading canvas-heading"><div className="module-toolbar">
+ <Groups {...{groups,busy,call,run,novelId}} prefix="graph" value={group} onChange={value=>{setGroup(value);setChecked([]);}}/>
+ <FilterControl label="类型" value={filter} change={setFilter}><option value="">全部类型</option><option value="character_card">角色卡</option><option value="world_entry">世界书</option></FilterControl>
+ <span className="toolbar-spacer"/><SearchControl label="搜索设定" value={query} change={setQuery}/>{!batch&&<><ViewSwitch value={view} change={setView} graph="画布"/>
+ <button className="module-select" aria-label="多选" disabled={busy} onClick={beginBatch}>多选</button><details className="menu"><summary className="primary">＋ 设定</summary><div className="menu-panel"><button disabled={busy} onClick={()=>create('character_card')}>新建角色卡</button><button disabled={busy} onClick={()=>create('world_entry')}>新建世界书</button></div></details>
+ <details className="menu"><summary aria-label="设定更多操作">···</summary><div className="menu-panel"><button disabled={busy} onClick={()=>onTransfer({mode:'import',selection:{kind:'memory',novelId}})}>导入设定</button><button disabled={busy} onClick={()=>onTransfer({mode:'export',selection:{kind:'memory',novelId,nodeIds:visible.map(n=>n.id)}})}>导出当前设定范围</button></div></details></>}
+ </div>{(query||group||filter)&&<div className="active-filters"><button onClick={clear}>清除筛选 <span aria-hidden="true">×</span></button></div>}</header>
+ <div className="memory-layout"><div className="memory-overview">{batch&&<BatchManager items={batchItems} selected={checked} change={setChecked} groups={groups} busy={busy||resource.loading} done={endBatch} onMove={(ids,groupId)=>run(async()=>{await call('graph.move',{novelId,groupId,members:ids.map(id=>({id,expectedRevision:allNodes.find(n=>n.id===id)?.revision}))});setChecked([]);})}/>}<ResourceState resource={resource}>
+ {batch?<BatchList items={batchItems} selected={checked} change={setChecked} busy={busy||resource.loading}/>:view==='canvas'?<RelationCanvas key={novelId} scopeKey={`${novelId}:settings`} nodes={visible} allNodes={allNodes} edges={edges} groups={groups} busy={busy} onReady={center=>{canvas.current=center;}} onNew={(position,connection,type)=>create(type||allNodes.find(n=>n.id===connection?.id)?.type||'character_card',position,connection)} onSelect={open} onConnect={connectDirect} onLayout={saveLayout} onEdit={setEdge} onDelete={disconnect} onRemove={removeNodes} onDuplicate={duplicateNodes} onMove={moveNodes}/>:!visible.length?<div className="empty">{query||filter||group?'没有匹配的设定，试试调整筛选。':'添加第一张角色卡或世界书。'}</div>:<div className="library-list">{visible.map(n=><div className="selectable-entry" key={n.id}><button className={`library-entry ${trail.lastOpened===n.id?'selected':''}`} aria-current={trail.lastOpened===n.id?'true':undefined} onClick={()=>open(n.id)}><span className="entry-heading"><strong>{n.name}</strong><small>{kind(n)}</small></span>{n.summary&&<p>{n.summary}</p>}{n.groupId&&<small>{groups.find(g=>g.id===n.groupId)?.name}</small>}</button></div>)}</div>}</ResourceState></div></div></OverviewPage>
+ {error&&<p className="notice error" role="alert">{error}</p>}
+ {node&&<DetailPage key={node.id} className="memory-detail" backLabel={trail.previous?'‹ 返回上一条':'‹ 返回设定'} onBack={close}><NodeEditor key={node.id||node.type} {...{call,novelId,run,busy,saved,groups,onTransfer}} initial={node} latest={allNodes.find(n=>n.id===node.id)}/>
+ {node.id&&<section className="section-fold"><div className="row"><h3 className="grow">相关设定</h3><button disabled={busy||allNodes.length<2} onClick={()=>connect(node.id,allNodes.find(n=>n.id!==node.id)?.id)}>添加关系</button></div>{related.map(e=><div key={e.id} className="related-entry"><button onClick={()=>open(e.from===node.id?e.to:e.from)}>{allNodes.find(n=>n.id===(e.from===node.id?e.to:e.from))?.name||'设定'}</button>{e.name&&<small>{e.name}</small>}{e.content&&<p>{e.content}</p>}<button aria-label={`修改关系 ${e.name||'连线'}`} onClick={()=>setEdge(e)}>···</button></div>)}</section>}
+ </DetailPage>}{edge&&<Modal title={edge.id?'编辑关系':'添加关系'} close={()=>setEdge(null)}><EdgeEditor key={edge.id||`new:${edge.from}:${edge.to}`} {...{call,novelId,run,busy}} nodes={allNodes} initial={edge} saved={()=>setEdge(null)}/></Modal>}</div>;
+}
+
+function NodeEditor({call,novelId,run,busy,initial,latest,saved,groups,onTransfer}) {
+ const {value,base,change,accept,dirty,cacheError}=useDraft(`${novelId}:node:${initial.id||initial.type+':new'}`,initial);
+  const fresh=useResource(()=>initial.id?call('graph.get',{novelId,nodeId:initial.id}):Promise.resolve(null),[call,novelId,initial.id,latest?.revision]);
+  useEffect(()=>{if(!busy&&!dirty&&fresh.value?.revision>base.revision){accept(fresh.value);saved(fresh.value);}},[fresh.value,busy,dirty,base.revision]);
+ const [editing,setEditing]=useState(!initial.id||dirty);const {confirm,ask}=useDialog();
+ const set=(key,v)=>change(old=>({...old,[key]:v}));
+ const save=()=>{if(!value.name.trim()||busy)return;run(async()=>{const result=await call(value.id?'graph.update':'graph.create',{novelId,nodeId:value.id,expectedRevision:base.revision,type:value.type==='character_card'?'character_card':'world_entry',groupId:value.groupId||null,name:value.name,summary:value.summary||'',content:value.content||''});accept(result);saved(result);setEditing(false);});};
+ return <div onKeyDown={e=>saveShortcut(e,save)}><h2>{value.name||`新${kind(value)}`}</h2><DetailActions><button onClick={()=>setEditing(!editing)}>{editing?'阅读':'编辑'}</button></DetailActions>{fresh.error&&<p className="notice error" role="alert">{fresh.error}</p>}{latest&&latest.revision!==base.revision&&<p className="notice">设定已有新版本，本地草稿仍保留。保存会检查冲突。</p>}
+ {editing?<fieldset disabled={busy} className="editor-fields document-fields"><label>类型<select value={value.type==='character_card'?'character_card':'world_entry'} onChange={e=>set('type',e.target.value)}><option value="character_card">角色卡</option><option value="world_entry">世界书</option></select></label><div className="creation-settings"><GroupSelect groups={groups} value={value.groupId} onChange={id=>set('groupId',id)}/><button type="button" disabled={busy} onClick={async()=>{const name=await ask('新建分组名称');if(name?.trim())run(async()=>{const g=await call('graph.group.create',{novelId,name});set('groupId',g.id);});}}>＋ 新建分组</button></div><label>名称<input value={value.name} onChange={e=>set('name',e.target.value)}/></label><label>摘要<DocumentTextarea aria-label="摘要" value={value.summary||''} onChange={e=>set('summary',e.target.value)}/></label><label>全文<DocumentTextarea aria-label="全文" className="prose" value={value.content||''} onChange={e=>set('content',e.target.value)}/></label></fieldset>:<><p className="document-summary">{value.summary||'暂无摘要'}</p><article className="document-body">{value.content||'暂无内容'}</article></>}
+ {(editing||dirty)&&<SaveBar dirty={dirty||!value.id} {...{busy}} error={cacheError} invalid={!value.name.trim()?'请填写名称':null} onSave={save} label="保存设定"/>}
+ {value.id&&<details className="section-fold"><summary>更多操作</summary><button disabled={busy||dirty} title={dirty?'先保存设定后导出':undefined} onClick={()=>onTransfer({mode:'export',selection:{kind:'memory',novelId,nodeIds:[value.id]}})}>导出这条设定</button><button disabled={busy} onClick={async()=>{if(!dirty||await confirm('放弃本地草稿并读取最新设定？'))run(async()=>{const n=await call('graph.get',{novelId,nodeId:value.id});accept(n);saved(n);});}}>读取最新</button><button className="danger" disabled={busy} onClick={async()=>{if(await confirm(`删除“${value.name}”及其关系？`))run(async()=>{await call('graph.delete',{novelId,nodeId:value.id,expectedRevision:base.revision,confirm:true});accept(initial);saved(null);});}}>删除设定</button></details>}
+ </div>;
+}
+function EdgeEditor({call,novelId,nodes,run,busy,initial,saved}) {
+  const {value:draft,base,change,accept,dirty,cacheError}=useDraft(`${novelId}:edge:${initial.id||`new:${initial.from}:${initial.to}`}`,initial);
+  const {confirm,ask}=useDialog();
+  const save=()=>{if(draft.from&&draft.to&&!busy)run(async()=>{const e=await call(draft.id?'edge.update':'edge.create',{from:draft.from,to:draft.to,name:draft.name,content:draft.content,novelId,edgeId:draft.id,expectedRevision:base.revision});accept(e);saved(e);});};
+  return <div onKeyDown={e=>saveShortcut(e,save)}><fieldset disabled={busy} className="editor-fields">{[['from','从'],['to','到']].map(([key,label])=><label key={key}>{label}<select value={draft[key]} onChange={e=>change(d=>({...d,[key]:e.target.value}))}>{nodes.map(n=><option key={n.id} value={n.id}>{n.name}</option>)}</select></label>)}<label>关系名称（可选）<input placeholder="例如：居住于、朋友、敌对" value={draft.name||''} onChange={e=>change(d=>({...d,name:e.target.value}))}/></label><label>说明<DocumentTextarea value={draft.content||''} onChange={e=>change(d=>({...d,content:e.target.value}))}/></label></fieldset><SaveBar dirty={dirty||!draft.id} {...{busy}} error={cacheError} invalid={!draft.from||!draft.to?"请选择关系端点":null} onSave={save} label="保存关系"/>{draft.id&&<details><summary>更多操作</summary><button disabled={busy} onClick={async()=>{if(!dirty||await confirm("丢弃关系草稿并读取最新版本？"))run(async()=>{const latest=await call("edge.get",{novelId,edgeId:draft.id});accept(latest);saved(latest);});}}>读取最新关系</button><button disabled={busy} className="danger" onClick={async()=>{if(await confirm('删除这条关系？'))run(async()=>{await call('edge.delete',{novelId,edgeId:draft.id,expectedRevision:base.revision,confirm:true});accept(initial);saved(null);});}}>删除关系</button></details>}</div>;
+}

package/src/client/features/planning/Decorations.tsx

@@ -32,4 +32,4 @@ export function DecorationCard({value,point,zoom,busy,selected,dragProps,edit,re
     <div className="decoration-content" onDoubleClick={edit}>{value.content}</div>
     <button className="decoration-resize" aria-label={`调整批注尺寸 ${value.title||'未命名批注'}`} title="拖动调整大小" disabled={busy} onClick={e=>e.stopPropagation()} onPointerDown={e=>{if(e.button!==0)return;e.stopPropagation();e.preventDefault();gesture.current={x:e.clientX,y:e.clientY,width:size.width,height:size.height,zoom,pointer:e.pointerId,value,size};root.current?.closest<HTMLElement>('.planning-canvas-scroll')?.setAttribute('data-resizing','true');e.currentTarget.setPointerCapture(e.pointerId);}} onPointerMove={e=>{const g=gesture.current;if(!g||g.pointer!==e.pointerId)return;e.stopPropagation();g.size={width:Math.max(160,Math.min(6000,g.width+(e.clientX-g.x)/g.zoom)),height:Math.max(80,Math.min(6000,g.height+(e.clientY-g.y)/g.zoom))};setSize(g.size);}} onPointerCancel={cancel} onPointerUp={async e=>{const g=gesture.current;if(!g||g.pointer!==e.pointerId)return;e.stopPropagation();gesture.current=null;unlock();if(g.size.width===g.width&&g.size.height===g.height)return;if(!await resize(g.value,g.size))setSize({width:value.width,height:value.height});}}>◢</button>
   </section>;
-}
+}

package/src/client/features/planning/Pages.tsx

@@ -1,13 +1,13 @@
-import React,{useState} from 'react';
+import React,{useState} from 'react';
 import {Modal} from '../../shared/preferences.tsx';
 import {FilterControl} from '../../shared/workspace.tsx';
-import {Icon} from '../../shared/icons.tsx';
-export interface PageIndex {id:string|null;name:string;summary:string;revision:number;nodeCount:number;decorationCount:number}
-interface Props {pages:PageIndex[];value:string;busy:boolean;change:(id:string)=>void;create:(name:string,summary:string)=>Promise<boolean|undefined>;update:(page:PageIndex,name:string,summary:string)=>Promise<boolean|undefined>;remove:(page:PageIndex)=>Promise<boolean|undefined>}
-export function PlanningPages({pages,value,busy,change,create,update,remove}:Props){
-  const [draft,setDraft]=useState<{page?:PageIndex;name:string;summary:string}|null>(null),[error,setError]=useState('');
-  const current=pages.find(p=>(p.id||'')===value);
-  return <><div className="planning-page-picker"><FilterControl label="规划页面" value={value} change={change}>{pages.map(p=><option key={p.id||'main'} value={p.id||''}>{p.name}</option>)}</FilterControl><button className="page-new" aria-label="新建规划页面" disabled={busy} onClick={()=>{setError('');setDraft({name:'',summary:''});}}>＋ 页面</button>{current?.id&&<button className="page-settings" aria-label="规划页面设置" title="重命名或管理当前页面" disabled={busy} onClick={()=>{setError('');setDraft({page:current,name:current.name,summary:current.summary});}}><Icon name="edit"/></button>}</div>
-  {draft&&<Modal title={draft.page?'页面设置':'新建规划页面'} close={()=>setDraft(null)}><form className="editor-fields" onSubmit={async e=>{e.preventDefault();const ok=draft.page?await update(draft.page,draft.name,draft.summary):await create(draft.name,draft.summary);if(ok)setDraft(null);else setError('未保存，请核对提示后重试。');}}><label>页面名称<input autoFocus required value={draft.name} onChange={e=>setDraft({...draft,name:e.target.value})}/></label><label>用途摘要<textarea placeholder="这页讨论哪段情节，方便你和 AI 找到它" value={draft.summary} onChange={e=>setDraft({...draft,summary:e.target.value})}/></label>{error&&<p role="alert">{error}</p>}<div className="row"><button type="submit" className="primary" disabled={busy||!draft.name.trim()}>保存页面</button>{draft.page&&<button type="button" disabled={busy||draft.page.nodeCount>0||draft.page.decorationCount>0} title="只删除空页面；有内容时请先移动情节并删除批注" onClick={async()=>{if(await remove(draft.page!))setDraft(null);else setError('未删除，请核对页面是否仍有内容。');}}>删除空页面</button>}</div></form></Modal>}
-  </>;
-}
+import {Icon} from '../../shared/icons.tsx';
+export interface PageIndex {id:string|null;name:string;summary:string;revision:number;nodeCount:number;decorationCount:number}
+interface Props {pages:PageIndex[];value:string;busy:boolean;change:(id:string)=>void;create:(name:string,summary:string)=>Promise<boolean|undefined>;update:(page:PageIndex,name:string,summary:string)=>Promise<boolean|undefined>;remove:(page:PageIndex)=>Promise<boolean|undefined>}
+export function PlanningPages({pages,value,busy,change,create,update,remove}:Props){
+  const [draft,setDraft]=useState<{page?:PageIndex;name:string;summary:string}|null>(null),[error,setError]=useState('');
+  const current=pages.find(p=>(p.id||'')===value);
+  return <><div className="planning-page-picker"><FilterControl label="规划页面" value={value} change={change}>{pages.map(p=><option key={p.id||'main'} value={p.id||''}>{p.name}</option>)}</FilterControl><button className="page-new" aria-label="新建规划页面" disabled={busy} onClick={()=>{setError('');setDraft({name:'',summary:''});}}>＋ 页面</button>{current?.id&&<button className="page-settings" aria-label="规划页面设置" title="重命名或管理当前页面" disabled={busy} onClick={()=>{setError('');setDraft({page:current,name:current.name,summary:current.summary});}}><Icon name="edit"/></button>}</div>
+  {draft&&<Modal title={draft.page?'页面设置':'新建规划页面'} close={()=>setDraft(null)}><form className="editor-fields" onSubmit={async e=>{e.preventDefault();const ok=draft.page?await update(draft.page,draft.name,draft.summary):await create(draft.name,draft.summary);if(ok)setDraft(null);else setError('未保存，请核对提示后重试。');}}><label>页面名称<input autoFocus required value={draft.name} onChange={e=>setDraft({...draft,name:e.target.value})}/></label><label>用途摘要<textarea placeholder="这页讨论哪段情节，方便你和 AI 找到它" value={draft.summary} onChange={e=>setDraft({...draft,summary:e.target.value})}/></label>{error&&<p role="alert">{error}</p>}<div className="row"><button type="submit" className="primary" disabled={busy||!draft.name.trim()}>保存页面</button>{draft.page&&<button type="button" disabled={busy||draft.page.nodeCount>0||draft.page.decorationCount>0} title="只删除空页面；有内容时请先移动情节并删除批注" onClick={async()=>{if(await remove(draft.page!))setDraft(null);else setError('未删除，请核对页面是否仍有内容。');}}>删除空页面</button>}</div></form></Modal>}
+  </>;
+}

package/src/client/features/planning/data.js

@@ -1,16 +1,16 @@
-// Keep a paginated overview on one board revision, without retrying forever during edits.
-export async function readPlanningSnapshot(call,novelId,scope={}) {
- let offset=0,items=[],result,sequence;
- do {
-  result=await call('planning.list',{novelId,...scope,offset,limit:200});
-  if(sequence!==undefined&&result.sequence!==sequence)throw new Error('读取期间规划已更新，请重试。已有画布和草稿仍保留。');
-  sequence=result.sequence;items.push(...result.items);offset=result.nextOffset;
- } while(offset!==null);
- return {...result,items};
-}
-
-export async function readDecorations(call,novelId,pageId){
- let offset=0,items=[],sequence;
- do{const result=await call('planning.decorations',{novelId,pageId,offset,limit:200});if(sequence!==undefined&&sequence!==result.sequence)throw new Error('读取期间批注已更新，请重试');sequence=result.sequence;items.push(...result.items);offset=result.nextOffset;}while(offset!==null);
- return items;
-}
+// Keep a paginated overview on one board revision, without retrying forever during edits.
+export async function readPlanningSnapshot(call,novelId,scope={}) {
+ let offset=0,items=[],result,sequence;
+ do {
+  result=await call('planning.list',{novelId,...scope,offset,limit:200});
+  if(sequence!==undefined&&result.sequence!==sequence)throw new Error('读取期间规划已更新，请重试。已有画布和草稿仍保留。');
+  sequence=result.sequence;items.push(...result.items);offset=result.nextOffset;
+ } while(offset!==null);
+ return {...result,items};
+}
+
+export async function readDecorations(call,novelId,pageId){
+ let offset=0,items=[],sequence;
+ do{const result=await call('planning.decorations',{novelId,pageId,offset,limit:200});if(sequence!==undefined&&sequence!==result.sequence)throw new Error('读取期间批注已更新，请重试');sequence=result.sequence;items.push(...result.items);offset=result.nextOffset;}while(offset!==null);
+ return items;
+}

package/src/client/index.tsx

@@ -1,134 +1,134 @@
-// The workbench is the typed migration boundary; legacy JSX modules are intentionally
-// consumed without declaration generation while they are migrated incrementally.
-// @ts-nocheck
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import {PreferencesProvider, PreferencesDialog, AboutDialog, useWorkbenchPreferences} from './shared/preferences.tsx';
-import { styles } from './style.ts';
-import { DialogProvider, useDialog } from './dialog.tsx';
-import { LocaleContext, registerLocale } from './locale.js';
-import { Memory } from './features/memory/index.jsx';
+// The workbench is the typed migration boundary; legacy JSX modules are intentionally
+// consumed without declaration generation while they are migrated incrementally.
+// @ts-nocheck
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import {PreferencesProvider, PreferencesDialog, AboutDialog, useWorkbenchPreferences} from './shared/preferences.tsx';
+import { styles } from './style.ts';
+import { DialogProvider, useDialog } from './dialog.tsx';
+import { LocaleContext, registerLocale } from './locale.js';
+import { Memory } from './features/memory/index.jsx';
 import { Manage } from './features/manage/index.tsx';
-import { TransferPage } from './features/transfer/index.tsx';
-import {Welcome} from './features/welcome/index.tsx';
-import { Chapters } from './features/chapters/index.jsx';
-import { Planning } from './features/planning/index.jsx';
+import { TransferPage } from './features/transfer/index.tsx';
+import {Welcome} from './features/welcome/index.tsx';
+import { Chapters } from './features/chapters/index.jsx';
+import { Planning } from './features/planning/index.jsx';
 import { Preset } from './features/preset/index.tsx';
-import { SessionScope, usePreference, useResource } from './shared/state.js';
-import { ResourceState } from './shared/ui.jsx';
-import { Launcher } from './launcher.tsx';
-import {WorkbenchHeader} from './shared/WorkbenchHeader.tsx';
-import {RefreshProvider, useWorkbenchRefresh} from './shared/refresh.tsx';
-import {notifyLibraryChanged, subscribeLibraryChanges} from './shared/library-events.ts';
-
-const ID = 'dsh-cuigengji-plugin';
-const RPC_ENDPOINT = 'cuigengji/dispatch';
-const message = error => error?.message || String(error);
-export const inject = ['connection', 'slots', 'sidebarRight', 'sidebarRightTabs', 'locale', 'layout', 'uiWorkspace', 'workspaces'];
-export function apply(ctx) {
-  const rpc = async (action, args, sessionId) => {
-    const result = await ctx.connection.rpc.call('/api', RPC_ENDPOINT, { action, args, sessionId });
-    if (!result.ok) throw Object.assign(new Error(result.error.message), { code: result.error.code });
-    return result.value;
-  };
-  return applyWithRPC(ctx, rpc);
-}
-
-export function applyWithRPC(ctx, rpc) {
-  const t = ctx.locale ? registerLocale(ctx) : key => ({ title: '催更姬', open: '打开小说目录、正文和设定' }[key]);
-  ctx.effect(() => ctx.sidebarRightTabs.register({
-    id: ID, kind: 'cuigengji', keepMounted: true,
-    patterns: ['dsh-resource://cuigengji/**'], title: () => t('title'),
-  }));
-  ctx.slots.inject('sidebar.footer.action', () => ctx.slots.register({
-    name: 'sidebar.footer.action', id: ID, order: 40,
-    inject: () => ({
-      hooks: {novelSession:ctx.sidebarRight.mounted,novelWorkspaces:ctx.workspaces.list},
-      openNovel: sessionId => ctx.sidebarRight.openResource(`dsh-resource://cuigengji/${encodeURIComponent(sessionId)}`),
-      revealConversation: () => ctx.layout.selectPanel(null),
-      openWorkspace: (id,beforeOpen) => ctx.uiWorkspace.openWorkspace(id,beforeOpen),
-    }),
-  }, Launcher));
-  ctx.slots.inject('sidebar.right.pane.tab', () => ctx.slots.register({
-    name: 'sidebar.right.pane.tab', key: ID,
-  }, props => {
-    const tab = props.useTabInfo();
-    const address = tab.tab.navigation.address;
-    const sessionId = decodeURIComponent(address.slice(address.lastIndexOf('/') + 1));
-    return <LocaleContext.Provider value={ctx.locale}><Workbench key={sessionId} sessionId={sessionId} rpc={rpc} /></LocaleContext.Provider>;
-  }));
-}
-
-export function Workbench(props) {
-  return <SessionScope.Provider value={props.sessionId}><RefreshProvider><PreferencesProvider><DialogProvider><WorkbenchContent {...props} /></DialogProvider></PreferencesProvider></RefreshProvider></SessionScope.Provider>;
-}
-
-function WorkbenchContent({ sessionId, rpc }) {
-  const {preferences}=useWorkbenchPreferences();
-  const {refresh}=useWorkbenchRefresh();
-  const [utility,setUtility]=useState(null);
-  const [homeOpen,setHomeOpen]=useState(false);
+import { SessionScope, usePreference, useResource } from './shared/state.js';
+import { ResourceState } from './shared/ui.jsx';
+import { Launcher } from './launcher.tsx';
+import {WorkbenchHeader} from './shared/WorkbenchHeader.tsx';
+import {RefreshProvider, useWorkbenchRefresh} from './shared/refresh.tsx';
+import {notifyLibraryChanged, subscribeLibraryChanges} from './shared/library-events.ts';
+
+const ID = 'dsh-cuigengji-plugin';
+const RPC_ENDPOINT = 'cuigengji/dispatch';
+const message = error => error?.message || String(error);
+export const inject = ['connection', 'slots', 'sidebarRight', 'sidebarRightTabs', 'locale', 'layout', 'uiWorkspace', 'workspaces'];
+export function apply(ctx) {
+  const rpc = async (action, args, sessionId) => {
+    const result = await ctx.connection.rpc.call('/api', RPC_ENDPOINT, { action, args, sessionId });
+    if (!result.ok) throw Object.assign(new Error(result.error.message), { code: result.error.code });
+    return result.value;
+  };
+  return applyWithRPC(ctx, rpc);
+}
+
+export function applyWithRPC(ctx, rpc) {
+  const t = ctx.locale ? registerLocale(ctx) : key => ({ title: '催更姬', open: '打开小说目录、正文和设定' }[key]);
+  ctx.effect(() => ctx.sidebarRightTabs.register({
+    id: ID, kind: 'cuigengji', keepMounted: true,
+    patterns: ['dsh-resource://cuigengji/**'], title: () => t('title'),
+  }));
+  ctx.slots.inject('sidebar.footer.action', () => ctx.slots.register({
+    name: 'sidebar.footer.action', id: ID, order: 40,
+    inject: () => ({
+      hooks: {novelSession:ctx.sidebarRight.mounted,novelWorkspaces:ctx.workspaces.list},
+      openNovel: sessionId => ctx.sidebarRight.openResource(`dsh-resource://cuigengji/${encodeURIComponent(sessionId)}`),
+      revealConversation: () => ctx.layout.selectPanel(null),
+      openWorkspace: (id,beforeOpen) => ctx.uiWorkspace.openWorkspace(id,beforeOpen),
+    }),
+  }, Launcher));
+  ctx.slots.inject('sidebar.right.pane.tab', () => ctx.slots.register({
+    name: 'sidebar.right.pane.tab', key: ID,
+  }, props => {
+    const tab = props.useTabInfo();
+    const address = tab.tab.navigation.address;
+    const sessionId = decodeURIComponent(address.slice(address.lastIndexOf('/') + 1));
+    return <LocaleContext.Provider value={ctx.locale}><Workbench key={sessionId} sessionId={sessionId} rpc={rpc} /></LocaleContext.Provider>;
+  }));
+}
+
+export function Workbench(props) {
+  return <SessionScope.Provider value={props.sessionId}><RefreshProvider><PreferencesProvider><DialogProvider><WorkbenchContent {...props} /></DialogProvider></PreferencesProvider></RefreshProvider></SessionScope.Provider>;
+}
+
+function WorkbenchContent({ sessionId, rpc }) {
+  const {preferences}=useWorkbenchPreferences();
+  const {refresh}=useWorkbenchRefresh();
+  const [utility,setUtility]=useState(null);
+  const [homeOpen,setHomeOpen]=useState(false);
   const [tab, setTab] = usePreference('page', 'chapters');
   const [managementReturn, setManagementReturn] = usePreference('management-return', 'chapters');
-  useEffect(()=>{if(tab==='context')setTab('chapters');},[tab]);
-  const [returnTarget,setReturnTarget]=useState(null);
-  const [transferInitial,setTransferInitial]=useState(null);
-  const [transferVisit,setTransferVisit]=useState(0);
-  const [manageInitial,setManageInitial]=useState('overview');
-  const [error, setError] = useState(''), [busy, setBusy] = useState(false), [tick, setTick] = useState(0);
-  const { ask, confirm } = useDialog();
-  const call = useCallback((action, args = {}) => rpc(action, args, sessionId), [rpc, sessionId]);
-  const resource = useResource(() => Promise.all([call('novel.list', {includeArchived:true}), call('binding.get')]), [call, tick]);
-  const [library = [], binding = null] = resource.value || [];
-  const books=library.filter(book=>!book.archived), recycledCount=library.length-books.length;
-  useEffect(()=>subscribeLibraryChanges(()=>setTick(value=>value+1)),[]);
-  const novelId = binding?.novelId, novel = books.find(n => n.id === novelId);
-  const showHome=homeOpen||(!novelId&&!['data','manage'].includes(tab));
-  useEffect(()=>{
-    const outside=event=>{document.querySelectorAll('.cuigengji details.menu[open]').forEach(menu=>{if(!menu.contains(event.target))menu.open=false;});};
-    const escape=event=>{if(event.key==='Escape'){document.querySelectorAll('.cuigengji details.menu[open]').forEach(menu=>{menu.open=false;menu.querySelector('summary')?.focus();});}};
-    const activate=event=>{const menu=event.target.closest?.('details.menu');if(menu&&event.target.closest('button'))menu.open=false;};
-    document.addEventListener('click',activate);document.addEventListener('pointerdown',outside);document.addEventListener('keydown',escape);
-    return()=>{document.removeEventListener('click',activate);document.removeEventListener('pointerdown',outside);document.removeEventListener('keydown',escape);};
-  },[]);
-  const running = useRef(false);
-  const run = async fn => {
-    if (running.current) return;
-    running.current = true;
-    setBusy(true); setError('');
-    try { await fn(); setTick(x => x + 1); return true; }
-    catch (e) { setError(message(e)); return false; }
-    finally { running.current = false; setBusy(false); }
-  };
-  const create = async () => { const title = await ask('作品名称'); if (title?.trim()) run(async () => { const n = await call('novel.create', { title }); await call('binding.set', { novelId: n.id }); setHomeOpen(false);setTab('chapters'); }); };
-  const openNovel=id=>run(async()=>{await call('binding.set',{novelId:id});setHomeOpen(false);setTab('chapters');setReturnTarget(null);});
-  const openManagement=(page,initial='overview')=>{if(homeOpen||!novelId)setManagementReturn('welcome');else if(['chapters','plan','memory'].includes(tab))setManagementReturn(tab);setHomeOpen(false);setReturnTarget(null);setManageInitial(initial);setTab(page);};
-  const recycleNovel=async book=>{
-    if(busy||!await confirm(`将《${book.title}》移入回收站？\n正文、章节历史、设定、规划和写作预设会完整保留，之后可以恢复。相关会话将解除作品绑定。`))return;
-    await run(async()=>{await call('novel.archive',{novelId:book.id,expectedRevision:book.revision,requestId:crypto.randomUUID(),confirm:true});notifyLibraryChanged();});
-  };
-  const openTransfer=initial=>{if(homeOpen||!novelId)setManagementReturn('welcome');else if(['chapters','plan','memory','preset','manage'].includes(tab))setManagementReturn(tab);setHomeOpen(false);setTransferInitial(initial);setTransferVisit(value=>value+1);setReturnTarget(null);setTab('data');};
-  const returnFromManagement=()=>{setReturnTarget(null);setHomeOpen(managementReturn==='welcome');setTab(['chapters','plan','memory','preset','manage'].includes(managementReturn)?managementReturn:'chapters');};
-  const managementBack={onBack:returnFromManagement,backLabel:managementReturn==='welcome'?'返回作品首页':novelId?'返回'+({plan:'规划',memory:'设定',chapters:'正文',preset:'写作预设',manage:'作品与备份'}[managementReturn]||'正文'):'返回作品选择'};
-  const welcomeProps={books,busy,recycledCount,onOpen:openNovel,onCreate:create,onImport:()=>openTransfer({mode:'import'}),onManage:()=>openManagement('manage'),onRecycle:recycleNovel,onTrash:()=>openManagement('manage','recycle')};
-  const manageProps={call,novelId,novel,run,busy,tick,initialView:manageInitial,onTransfer:openTransfer,...managementBack};
-  const jump=(page,key,id)=>{setReturnTarget(tab);try{localStorage.setItem(`cuigengji:ui:${sessionId}:${novelId}:${key}`,JSON.stringify(id));}catch{}setTab(page);};
-  return <section className="cuigengji" data-motion={preferences.motion} style={{'--prose-size':`${preferences.fontSize}px`,'--prose-leading':preferences.leading}} aria-label="催更姬小说工作台">
-    <style>{styles}</style>
-    <WorkbenchHeader home={showHome} novelTitle={novel?.title} tab={tab} busy={busy} refreshing={resource.loading} onHome={()=>{setHomeOpen(true);setReturnTarget(null);}} onTab={page=>{setReturnTarget(null);setTab(page);}} onRefresh={refresh} onSettings={()=>setUtility('settings')} onAbout={()=>setUtility('about')}/>
-    {error && <div className="notice error" role="alert">{error}<button onClick={()=>setError('')}>关闭提示</button></div>}
-
-    <ResourceState resource={resource}>
-      {homeOpen?<Welcome {...welcomeProps}/>:tab==='data'?<TransferPage key={transferVisit} {...{call,run,busy,novelId}} {...managementBack} initial={transferInitial} onOpen={openNovel}/>:<>
-      {!novelId ? (tab==='manage'?<Manage {...manageProps}/>:<Welcome {...welcomeProps}/>) : <div className="workbench-body" key={novelId}>{returnTarget&&<div className="return-strip"><button onClick={()=>{setTab(returnTarget);setReturnTarget(null);}}>‹ 返回{({plan:'规划',memory:'设定'})[returnTarget]||'上一页'}</button></div>}
-        {tab==='chapters' && <Chapters {...{call,novelId,tick,run,busy}} onTransfer={openTransfer}/>}
-        {tab==='memory' && <Memory {...{call,novelId,tick,run,busy}} onTransfer={openTransfer} onChapter={id=>jump('chapters','chapter',id)}/>}
-        {tab==='plan' && <Planning {...{call,novelId,tick,run,busy}} onTransfer={openTransfer} onMemory={id=>jump('memory','memory-selected',id)} onChapter={id=>jump('chapters','chapter',id)}/>}
-        {tab==='preset' && <Preset {...{call,novelId,run,busy}} {...managementBack} onTransfer={openTransfer}/>}
-        {tab==='manage' && <Manage {...manageProps}/>}
-      </div>}
-      </>}
-    </ResourceState>
-    {utility==='settings'&&<PreferencesDialog close={()=>setUtility(null)} novelTitle={novel?.title} onPreset={novelId?()=>{setUtility(null);openManagement('preset');}:undefined}/>}
-    {utility==='about'&&<AboutDialog close={()=>setUtility(null)}/>}
-  </section>;
-}
+  useEffect(()=>{if(tab==='context')setTab('chapters');},[tab]);
+  const [returnTarget,setReturnTarget]=useState(null);
+  const [transferInitial,setTransferInitial]=useState(null);
+  const [transferVisit,setTransferVisit]=useState(0);
+  const [manageInitial,setManageInitial]=useState('overview');
+  const [error, setError] = useState(''), [busy, setBusy] = useState(false), [tick, setTick] = useState(0);
+  const { ask, confirm } = useDialog();
+  const call = useCallback((action, args = {}) => rpc(action, args, sessionId), [rpc, sessionId]);
+  const resource = useResource(() => Promise.all([call('novel.list', {includeArchived:true}), call('binding.get')]), [call, tick]);
+  const [library = [], binding = null] = resource.value || [];
+  const books=library.filter(book=>!book.archived), recycledCount=library.length-books.length;
+  useEffect(()=>subscribeLibraryChanges(()=>setTick(value=>value+1)),[]);
+  const novelId = binding?.novelId, novel = books.find(n => n.id === novelId);
+  const showHome=homeOpen||(!novelId&&!['data','manage'].includes(tab));
+  useEffect(()=>{
+    const outside=event=>{document.querySelectorAll('.cuigengji details.menu[open]').forEach(menu=>{if(!menu.contains(event.target))menu.open=false;});};
+    const escape=event=>{if(event.key==='Escape'){document.querySelectorAll('.cuigengji details.menu[open]').forEach(menu=>{menu.open=false;menu.querySelector('summary')?.focus();});}};
+    const activate=event=>{const menu=event.target.closest?.('details.menu');if(menu&&event.target.closest('button'))menu.open=false;};
+    document.addEventListener('click',activate);document.addEventListener('pointerdown',outside);document.addEventListener('keydown',escape);
+    return()=>{document.removeEventListener('click',activate);document.removeEventListener('pointerdown',outside);document.removeEventListener('keydown',escape);};
+  },[]);
+  const running = useRef(false);
+  const run = async fn => {
+    if (running.current) return;
+    running.current = true;
+    setBusy(true); setError('');
+    try { await fn(); setTick(x => x + 1); return true; }
+    catch (e) { setError(message(e)); return false; }
+    finally { running.current = false; setBusy(false); }
+  };
+  const create = async () => { const title = await ask('作品名称'); if (title?.trim()) run(async () => { const n = await call('novel.create', { title }); await call('binding.set', { novelId: n.id }); setHomeOpen(false);setTab('chapters'); }); };
+  const openNovel=id=>run(async()=>{await call('binding.set',{novelId:id});setHomeOpen(false);setTab('chapters');setReturnTarget(null);});
+  const openManagement=(page,initial='overview')=>{if(homeOpen||!novelId)setManagementReturn('welcome');else if(['chapters','plan','memory'].includes(tab))setManagementReturn(tab);setHomeOpen(false);setReturnTarget(null);setManageInitial(initial);setTab(page);};
+  const recycleNovel=async book=>{
+    if(busy||!await confirm(`将《${book.title}》移入回收站？\n正文、章节历史、设定、规划和写作预设会完整保留，之后可以恢复。相关会话将解除作品绑定。`))return;
+    await run(async()=>{await call('novel.archive',{novelId:book.id,expectedRevision:book.revision,requestId:crypto.randomUUID(),confirm:true});notifyLibraryChanged();});
+  };
+  const openTransfer=initial=>{if(homeOpen||!novelId)setManagementReturn('welcome');else if(['chapters','plan','memory','preset','manage'].includes(tab))setManagementReturn(tab);setHomeOpen(false);setTransferInitial(initial);setTransferVisit(value=>value+1);setReturnTarget(null);setTab('data');};
+  const returnFromManagement=()=>{setReturnTarget(null);setHomeOpen(managementReturn==='welcome');setTab(['chapters','plan','memory','preset','manage'].includes(managementReturn)?managementReturn:'chapters');};
+  const managementBack={onBack:returnFromManagement,backLabel:managementReturn==='welcome'?'返回作品首页':novelId?'返回'+({plan:'规划',memory:'设定',chapters:'正文',preset:'写作预设',manage:'作品与备份'}[managementReturn]||'正文'):'返回作品选择'};
+  const welcomeProps={books,busy,recycledCount,onOpen:openNovel,onCreate:create,onImport:()=>openTransfer({mode:'import'}),onManage:()=>openManagement('manage'),onRecycle:recycleNovel,onTrash:()=>openManagement('manage','recycle')};
+  const manageProps={call,novelId,novel,run,busy,tick,initialView:manageInitial,onTransfer:openTransfer,...managementBack};
+  const jump=(page,key,id)=>{setReturnTarget(tab);try{localStorage.setItem(`cuigengji:ui:${sessionId}:${novelId}:${key}`,JSON.stringify(id));}catch{}setTab(page);};
+  return <section className="cuigengji" data-motion={preferences.motion} style={{'--prose-size':`${preferences.fontSize}px`,'--prose-leading':preferences.leading}} aria-label="催更姬小说工作台">
+    <style>{styles}</style>
+    <WorkbenchHeader home={showHome} novelTitle={novel?.title} tab={tab} busy={busy} refreshing={resource.loading} onHome={()=>{setHomeOpen(true);setReturnTarget(null);}} onTab={page=>{setReturnTarget(null);setTab(page);}} onRefresh={refresh} onSettings={()=>setUtility('settings')} onAbout={()=>setUtility('about')}/>
+    {error && <div className="notice error" role="alert">{error}<button onClick={()=>setError('')}>关闭提示</button></div>}
+
+    <ResourceState resource={resource}>
+      {homeOpen?<Welcome {...welcomeProps}/>:tab==='data'?<TransferPage key={transferVisit} {...{call,run,busy,novelId}} {...managementBack} initial={transferInitial} onOpen={openNovel}/>:<>
+      {!novelId ? (tab==='manage'?<Manage {...manageProps}/>:<Welcome {...welcomeProps}/>) : <div className="workbench-body" key={novelId}>{returnTarget&&<div className="return-strip"><button onClick={()=>{setTab(returnTarget);setReturnTarget(null);}}>‹ 返回{({plan:'规划',memory:'设定'})[returnTarget]||'上一页'}</button></div>}
+        {tab==='chapters' && <Chapters {...{call,novelId,tick,run,busy}} onTransfer={openTransfer}/>}
+        {tab==='memory' && <Memory {...{call,novelId,tick,run,busy}} onTransfer={openTransfer} onChapter={id=>jump('chapters','chapter',id)}/>}
+        {tab==='plan' && <Planning {...{call,novelId,tick,run,busy}} onTransfer={openTransfer} onMemory={id=>jump('memory','memory-selected',id)} onChapter={id=>jump('chapters','chapter',id)}/>}
+        {tab==='preset' && <Preset {...{call,novelId,run,busy}} {...managementBack} onTransfer={openTransfer}/>}
+        {tab==='manage' && <Manage {...manageProps}/>}
+      </div>}
+      </>}
+    </ResourceState>
+    {utility==='settings'&&<PreferencesDialog close={()=>setUtility(null)} novelTitle={novel?.title} onPreset={novelId?()=>{setUtility(null);openManagement('preset');}:undefined}/>}
+    {utility==='about'&&<AboutDialog close={()=>setUtility(null)}/>}
+  </section>;
+}