@ash-qw/dsh-theme-prts 2.5.3 → 2.5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ash-qw/dsh-theme-prts",
-  "version": "2.5.3",
+  "version": "2.5.4",
   "private": false,
   "type": "module",
   "description": "Unofficial Arknights P.R.T.S.-inspired UI theme for DeepSeek Harness Web and the official desktop client",

package/src/client/background-layout.js

@@ -5,7 +5,16 @@ export function createBackgroundLayout({window,document}) {
   const raf=window.requestAnimationFrame?.bind(window) ?? (fn=>window.setTimeout(fn,16))
   const caf=window.cancelAnimationFrame?.bind(window) ?? window.clearTimeout.bind(window)
   let state={}, frame, disposed=false, enabled=false, observing=false, hostFrame, operation, sessions
-  const set=(name,value)=>{if(root.style.getPropertyValue(name)!==value) root.style.setProperty(name,value)}
+  const sidebarTargets = new Set()
+  const set=(name,value)=>{
+    const targets=name.startsWith('--prts-protected-sidebar-')?[sessions,document.querySelector('[data-prts-nav-rail]')]:[root]
+    for(const node of targets){
+      if(!node)continue
+      if(node!==root)sidebarTargets.add(node)
+      if(value===null)node.style.removeProperty(name)
+      else if(node.style.getPropertyValue(name)!==value)node.style.setProperty(name,value)
+    }
+  }
   const update=()=>{
     frame=undefined
     if(disposed||!observing)return
@@ -17,6 +26,8 @@ export function createBackgroundLayout({window,document}) {
       for(const node of [hostFrame||operation,sessions])if(node)resize?.observe(node)
     }
     const railWidth=parseFloat(window.getComputedStyle(root).getPropertyValue('--prts-nav-width'))||0
+    const writes=[]
+    const write=(...args)=>writes.push(args)
     for(const slot of ['full','conversation','sidebar']){
       const entry=state[slot]
       const node=slot==='sidebar'?sessions:slot==='conversation'?(hostFrame||operation):operation
@@ -25,15 +36,16 @@ export function createBackgroundLayout({window,document}) {
       const active=entry?.region && width>0 && height>0
       if(active){
         const p=backgroundPlacement(entry.width,entry.height,width,height,entry.region)
-        set(`--prts-protected-${slot}-x`,`${p.x}px`)
-        set(`--prts-protected-${slot}-y`,`${p.y}px`)
-        if(slot==='sidebar')set('--prts-protected-sidebar-width',`${p.width}px`)
+        write(`--prts-protected-${slot}-x`,`${p.x}px`)
+        write(`--prts-protected-${slot}-y`,`${p.y}px`)
+        if(slot==='sidebar')write('--prts-protected-sidebar-width',`${p.width}px`)
       }else{
-        root.style.removeProperty(`--prts-protected-${slot}-x`)
-        root.style.removeProperty(`--prts-protected-${slot}-y`)
-        if(slot==='sidebar')root.style.removeProperty('--prts-protected-sidebar-width')
+        write(`--prts-protected-${slot}-x`,null)
+        write(`--prts-protected-${slot}-y`,null)
+        if(slot==='sidebar')write('--prts-protected-sidebar-width',null)
       }
     }
+    for(const args of writes)set(...args)
   }
   function schedule(){if(!disposed && observing && frame===undefined)frame=raf(update)}
   // ResizeObserver runs after layout, before paint. Deferring again to rAF
@@ -48,6 +60,8 @@ export function createBackgroundLayout({window,document}) {
   const attributes=new window.MutationObserver(schedule)
   function clear(){
     caf(frame);frame=undefined;resize?.disconnect();mutations.disconnect();attributes.disconnect();window.removeEventListener('resize',schedule)
+    for(const node of sidebarTargets)for(const axis of ['x','y','width'])node.style.removeProperty(`--prts-protected-sidebar-${axis}`)
+    sidebarTargets.clear()
     hostFrame=undefined;operation=undefined;sessions=undefined;observing=false
     for(const slot of ['full','conversation','sidebar'])for(const axis of ['x','y','width'])root.style.removeProperty(`--prts-protected-${slot}-${axis}`)
   }

package/src/client/conversation-control-adapter.js

@@ -49,6 +49,8 @@ function classify(button, operation) {
   if (approval) return hasClassSuffix(button, '_reject') ? 'danger' : 'cta'
   if (hasClassSuffix(button, '_modalAction') || button.closest('[role="dialog"]')) return 'cta'
 
+  const userRow = closestWithClassSuffix(button, '_userRow')
+  if (userRow?.matches('[data-submission-echo], [data-pending-steering]')) return 'micro'
   if (button.closest('[data-chat-flow-kind], [data-message-role]')) return 'micro'
   return null
 }
@@ -129,7 +131,7 @@ export function createConversationControlAdapter({ document, window }) {
         subtree: true,
         childList: true,
         attributes: true,
-        attributeFilter: ['class', 'data-approval-key', 'data-turn-process'],
+        attributeFilter: ['class', 'data-approval-key', 'data-turn-process', 'data-submission-echo', 'data-pending-steering', 'data-chat-flow-kind', 'data-message-role'],
       })
     },
     dispose() {
@@ -166,7 +168,15 @@ function mountBodyTargetFrame(document, window, operation) {
   }
   let target=null, hovered=null, focused=null, raf=0, pressed=false, releasePending=false, disposed=false
   let pointer={x:0,y:0}, state=null, settled=false, tween=null, bounds=null, boundsDirty=false, hitDirty=false, exitGoal=null, motionDuration=240, targetArm=7, retiringBounds=null, targetRetires=false
-  const resizeObserver=window.ResizeObserver?new window.ResizeObserver(()=>{boundsDirty=true;wake()}):null
+  let moveRaf=0, pendingMove=null
+  const resizeObserver=window.ResizeObserver?new window.ResizeObserver(entries=>{
+    if(!target)return
+    const entry=entries.find(item=>item.target===target),size=entry?.borderBoxSize?.[0]
+    if(size && bounds && Math.abs(size.inlineSize-bounds.width)<.5 && Math.abs(size.blockSize-bounds.height)<.5)return
+    const box=target.getBoundingClientRect()
+    if(bounds && ['left','top','width','height'].every(key=>bounds[key]===box[key]))return
+    boundsDirty=true;wake()
+  }):null
   const reduced=window.matchMedia?.('(prefers-reduced-motion: reduce)')
   const fine=window.matchMedia?.('(hover:hover) and (pointer:fine)')
   let activeModal=null
@@ -179,11 +189,12 @@ function mountBodyTargetFrame(document, window, operation) {
     const candidate=card || pendingAction || node.closest(selector)
     return candidate && !candidate.matches(':disabled,[aria-disabled="true"]') && !candidate.closest('[inert]') ? candidate : null
   }
-  const measure=()=>{bounds=target.getBoundingClientRect();targetArm=7+Math.max(0,Math.min(1,(Math.min(bounds.width,bounds.height)-36)/36))*5;boundsDirty=false}
+  const measure=(box)=>{bounds=box || target.getBoundingClientRect();targetArm=7+Math.max(0,Math.min(1,(Math.min(bounds.width,bounds.height)-36)/36))*5;boundsDirty=false}
   const wake=()=>{if(!raf && !disposed)raf=window.requestAnimationFrame(draw)}
   const choose=()=>{
     const next=(hovered?.isConnected?hovered:null) || (focused?.isConnected?focused:null)
     if(next!==target){
+      const nextBounds=next?.getBoundingClientRect()
       const retire=!next && target && !target.isConnected && targetRetires && releasePending && bounds && !reduced?.matches
       imageRetiring=false
       retiringBounds=retire?{left:bounds.left,top:bounds.top,width:bounds.width,height:bounds.height}:null
@@ -195,12 +206,13 @@ function mountBodyTargetFrame(document, window, operation) {
       if(target){
         targetRetires=hasClassSuffix(target,'_toBottom') || isPendingInteractionAction(target)
         target.setAttribute('data-prts-corner-target','');showFrame()
-        measure();const box=bounds
-        if(!state || state.alpha<.01)state={x:(hovered?pointer.x:box.left+box.width/2)-10,y:(hovered?pointer.y:box.top+box.height/2)-10,w:20,h:20,alpha:0,arm:7}
-        const style=window.getComputedStyle(target)
-        frame.style.color=style.getPropertyValue(target.getAttribute('data-prts-conversation-control')==='danger'?'--prts-red':'--prts-yellow')
+        measure(nextBounds);const box=bounds
+        state={x:(hovered?pointer.x:box.left+box.width/2)-10,y:(hovered?pointer.y:box.top+box.height/2)-10,w:20,h:20,alpha:0,arm:7}
+        frame.style.opacity='0'
+        frame.style.color=target.getAttribute('data-prts-conversation-control')==='danger'?window.getComputedStyle(target).getPropertyValue('--prts-red'):'var(--prts-corner-color, var(--prts-yellow))'
       }
     }
+    if(!target && !state?.alpha)hideFrame()
     if(!settled || !target && state?.alpha>0)wake()
   }
   function draw(time) {
@@ -227,7 +239,7 @@ function mountBodyTargetFrame(document, window, operation) {
       tween={from:{...state},to:{...goal},start:time,duration:remaining,pressed}
     }
     // All channels share one endpoint; no separate thresholds or late position snap.
-    const progress=reduced?.matches || settled || !tween.duration?1:Math.min(1,(time-tween.start)/tween.duration)
+    const progress=reduced?.matches || settled || !tween.duration || (!state.alpha && !goal.alpha)?1:Math.min(1,(time-tween.start)/tween.duration)
     const ease=1-(1-progress)**3
     for(const key of keys)state[key]=tween.from[key]+(goal[key]-tween.from[key])*ease
     const moving=progress<1
@@ -251,17 +263,28 @@ function mountBodyTargetFrame(document, window, operation) {
     else if(moving)wake()
     else {tween=null;if(!state.alpha)hideFrame()}
   }
-  const move=event=>{
+  const applyMove=event=>{
     if(document.hidden || event.pointerType==='touch' || !fine?.matches)return
     pointer={x:event.clientX,y:event.clientY}
     const next=find(event.target)
     if(next===hovered && (next || !state?.alpha))return
     hovered=next;choose()
   }
-  const leave=()=>{hovered=null;choose()}
+  const clearMove=()=>{window.cancelAnimationFrame(moveRaf);moveRaf=0;pendingMove=null}
+  const flushMove=()=>{
+    const event=pendingMove;clearMove()
+    if(event)applyMove(event)
+  }
+  const move=event=>{
+    if(document.hidden || event.pointerType==='touch' || !fine?.matches)return
+    pendingMove={target:event.target,clientX:event.clientX,clientY:event.clientY,pointerType:event.pointerType}
+    if(!moveRaf)moveRaf=window.requestAnimationFrame(flushMove)
+  }
+  const leave=()=>{clearMove();hovered=null;choose()}
   const focus=event=>{focused=event.target.matches?.(':focus-visible')?find(event.target):null;choose()}
   const blur=()=>{focused=null;choose()}
   const down=event=>{
+    flushMove()
     pointer={x:event.clientX,y:event.clientY}
     if(event.pointerType==='touch')hovered=find(event.target)
     choose()
@@ -275,6 +298,7 @@ function mountBodyTargetFrame(document, window, operation) {
   }
   const up=event=>{release();if(event.pointerType==='touch')hovered=null;choose()}
   const reset=()=>{
+    clearMove()
     target?.removeAttribute('data-prts-corner-target');hideFrame()
     hovered=focused=target=null;state=tween=bounds=exitGoal=retiringBounds=null
     imageRetiring=false
@@ -317,6 +341,7 @@ function mountBodyTargetFrame(document, window, operation) {
   ]
   for(const [node,event,handler] of listeners)node.addEventListener(event,handler)
   return ()=>{
+    clearMove()
     modalObserver?.disconnect();document.removeEventListener('toggle',modalToggle,true)
     disposed=true;target?.removeAttribute('data-prts-corner-target');hideFrame();window.cancelAnimationFrame(raf);resizeObserver?.disconnect()
     document.removeEventListener('scroll',scroll,true);window.removeEventListener('resize',reset)

package/src/client/cursor-adapter.js

@@ -8,7 +8,8 @@ export function createCursorAdapter({ document, window, assets }) {
   let gestureAssets = assets
   let textTarget
   let lastPoint
-  const contentSelector = '[data-markdown], [data-slot*="markdown" i], [class*="markdown" i], [data-chat-flow-kind="user"] [class$="_bubble"]'
+  const heroTextSelector = '[data-phase="hero"] [class$="_titleGroup"]'
+  const contentSelector = '[data-markdown], [data-slot*="markdown" i], [class*="markdown" i], :is([data-chat-flow-kind="user"], [data-chat-flow-kind="steering"], [data-submission-echo], [data-pending-steering]) [class$="_bubble"]'
   const controlSelector = 'a[href], button, summary, input, textarea, select, [contenteditable], [role="button"], [role="toolbar"], [role="tab"]'
   function clearTextHit() {
     textTarget?.removeAttribute('data-prts-text-hit')
@@ -25,8 +26,8 @@ export function createCursorAdapter({ document, window, assets }) {
     if (event.pointerType !== 'mouse') return
     lastPoint = { clientX: event.clientX, clientY: event.clientY, pointerType: 'mouse' }
     const target = event.target?.nodeType === 1 ? event.target : event.target?.parentElement
-    const content = target?.closest?.(contentSelector)
-    if (!content?.closest('[data-chat-flow-kind], [data-message-role]') || target.closest(controlSelector)) return
+    const content = target?.closest?.(`${contentSelector}, ${heroTextSelector}`)
+    if (!content || (!content.matches(heroTextSelector) && !content.closest('[data-chat-flow-kind], [data-message-role], [data-submission-echo], [data-pending-steering]')) || target.closest(controlSelector)) return
     const style = window.getComputedStyle(target)
     if (style.userSelect === 'none' || !style.cursor.includes('data:image/png')) return
     // Caret APIs return the nearest insertion point even over empty space.

package/src/client/host-geometry-adapter.js

@@ -17,7 +17,7 @@ export function createHostGeometryAdapter({ document, window }) {
   const root = document?.documentElement
   let frame
   let sidebar
-  let previousSidebarWidth
+  const sidebarWidths = new Map()
   let resizeObserver
   let frameRequest
   let resizeSettleTimer
@@ -35,7 +35,11 @@ export function createHostGeometryAdapter({ document, window }) {
     }
     if (sidebar?.isConnected) {
       const width = cssPixels(sidebar.getBoundingClientRect().width)
-      if (root.style.getPropertyValue('--prts-sidebar-width') !== width) root.style.setProperty('--prts-sidebar-width', width)
+      for (const node of [sidebar, document.querySelector('[data-prts-nav-rail]')]) {
+        if (!node) continue
+        if (!sidebarWidths.has(node)) sidebarWidths.set(node, [node.style.getPropertyValue('--prts-sidebar-width'), node.style.getPropertyPriority('--prts-sidebar-width')])
+        if (node.style.getPropertyValue('--prts-sidebar-width') !== width) node.style.setProperty('--prts-sidebar-width', width)
+      }
     }
     return top
   }
@@ -103,8 +107,11 @@ export function createHostGeometryAdapter({ document, window }) {
     else root.style.removeProperty(TOP_INSET_PROPERTY)
     previousValue = undefined
     previousPriority = undefined
-    if (previousSidebarWidth) root.style.setProperty('--prts-sidebar-width', previousSidebarWidth)
-    else root.style.removeProperty('--prts-sidebar-width')
+    for (const [node, [value, priority]] of sidebarWidths) {
+      if (value) node.style.setProperty('--prts-sidebar-width', value, priority)
+      else node.style.removeProperty('--prts-sidebar-width')
+    }
+    sidebarWidths.clear()
     sidebar = undefined
     frame = undefined
     observedFrameHeight = undefined
@@ -121,7 +128,6 @@ export function createHostGeometryAdapter({ document, window }) {
       if (started) dispose()
       frame = nextFrame
       sidebar = frame.querySelector?.('[data-prts-region="sessions"]')
-      previousSidebarWidth = root.style.getPropertyValue('--prts-sidebar-width')
       previousValue = root.style.getPropertyValue(TOP_INSET_PROPERTY)
       previousPriority = root.style.getPropertyPriority(TOP_INSET_PROPERTY)
       started = true

package/src/client/index.js

@@ -223,6 +223,7 @@ export function applyPrtsPlugin(ctx, environment) {
         persistAndApply(updatePreferenceValue(preferences, key, value))
       },
       onPreferencePreview(key, value) {
+        if (key === 'cornerColor') { document.documentElement.style.setProperty('--prts-corner-color', String(value)); return }
         if (key === 'particleTraversalSpeed') {
           particleField.update(updatePreferenceValue(preferences, key, value))
           return

package/src/client/preferences.js

@@ -39,6 +39,8 @@ export const DEFAULT_PREFERENCES = Object.freeze({
   bakerBlur: 8,
   classicUserBlur: 8,
   cursor: 'prts',
+  cornerColor: '#f0c800',
+  cornerCustomColor: '#f0c800',
   conversationParticleDensity: 'sparse',
   heroParticleDensity: 'light',
   particleTraversalSpeed: PARTICLE_TRAVERSAL_SPEED_DEFAULT,
@@ -105,7 +107,7 @@ export const PREFERENCE_GROUPS = Object.freeze({
   background: Object.freeze(['texture', 'backgroundMode', 'backgroundDim', 'heroContrast', 'sidebarOpacity', 'rightSidebarOpacity', 'railOpacity', 'bakerOpacity', 'classicUserOpacity', 'sidebarBlur', 'rightSidebarBlur', 'railBlur', 'bakerBlur', 'classicUserBlur']),
   particles: Object.freeze(['conversationParticleDensity', 'heroParticleDensity', 'particleTraversalSpeed']),
   material: Object.freeze(['glass', 'composerGlass']),
-  accessibility: Object.freeze(['motion', 'bootAnimation', 'cursor']),
+  accessibility: Object.freeze(['motion', 'bootAnimation', 'cursor', 'cornerColor', 'cornerCustomColor']),
   aiTools: Object.freeze(['aiToolsEnabled']),
   navigation: Object.freeze(['railDefaultHidden', 'sessionPreview', 'previewOngoing', 'previewTools', 'previewWarning', 'previewDone', 'previewDoubleClick', 'previewFollowOngoing', 'previewFollowWarning', 'previewReplyLimit']),
   conversation: Object.freeze(['sessionFlow', 'sessionGlow', 'sessionFlowPalette', 'sessionFlowColorBack', 'sessionFlowColorCore', 'sessionFlowColorFront', 'sessionFlowSpeed', 'conversationStyle', 'bakerGroupAvatars', 'bakerLoading', 'conversationEmblem']),
@@ -229,6 +231,8 @@ export function normalizePreferences(value) {
     backgroundDim: typeof input.backgroundDim === 'number' && Number.isFinite(input.backgroundDim) ? Math.min(.9, Math.max(0, input.backgroundDim)) : .45,
     composerGlass: booleanOr(input.composerGlass, DEFAULT_PREFERENCES.composerGlass),
     bootAnimation: booleanOr(input.bootAnimation, DEFAULT_PREFERENCES.bootAnimation),
+    cornerCustomColor: colorOr(input.cornerCustomColor, DEFAULT_PREFERENCES.cornerCustomColor),
+    cornerColor: colorOr(input.cornerColor, DEFAULT_PREFERENCES.cornerColor),
     cursor: input.cursor === 'system' ? 'system' : DEFAULT_PREFERENCES.cursor,
     conversationParticleDensity: enumOr(legacyDensities.conversation, PARTICLE_DENSITIES, particlePreset.conversationParticleDensity),
     heroParticleDensity: enumOr(legacyDensities.hero, PARTICLE_DENSITIES, particlePreset.heroParticleDensity),
@@ -283,6 +287,10 @@ export function updatePreferenceValue(value, key, nextValue) {
   if (key === 'preset') return applyVisualPreset(value, nextValue)
   if (key === 'particleDetail') return applyParticleDetail(value, nextValue)
   const current = normalizePreferences(value)
+  if (key === 'cornerCustomColor') {
+    const color = colorOr(nextValue, current.cornerCustomColor)
+    return normalizePreferences({ ...current, cornerColor: color, cornerCustomColor: color })
+  }
   if (key === 'sessionFlowPalette') {
     const palette = enumOr(nextValue, SESSION_FLOW_PALETTE_IDS, current.sessionFlowPalette)
     const colors = SESSION_FLOW_PALETTES[palette]

package/src/client/sidebar-control-adapter.js

@@ -862,6 +862,28 @@ export function createSidebarControlAdapter({ document, window, sessions, worksp
   }
 
 
+  let pickupRow, pickupTimer, pickupRoot
+  function clearPickup() {
+    if (pickupTimer !== undefined) window.clearTimeout(pickupTimer)
+    pickupTimer = undefined
+    pickupRow?.removeAttribute('data-prts-pickup-ready')
+    pickupRow = undefined
+  }
+  function pickupOver(event) {
+    const row = event.target.closest?.('[data-prts-session-row]')
+    if (row === pickupRow) return
+    clearPickup()
+    if (!row) return
+    pickupRow = row
+    pickupTimer = window.setTimeout(() => {
+      pickupTimer = undefined
+      if (row.isConnected && pickupRow === row) row.setAttribute('data-prts-pickup-ready', '')
+    }, 100)
+  }
+  function pickupOut(event) {
+    if (pickupRow && !pickupRow.contains(event.relatedTarget)) clearPickup()
+  }
+
   function queueScan() {
     if (!adapterActive || scanFrame !== undefined) return
     const requestFrame = window?.requestAnimationFrame?.bind(window) ?? (callback => window?.setTimeout?.(callback, 0))
@@ -1021,8 +1043,18 @@ export function createSidebarControlAdapter({ document, window, sessions, worksp
       if (observer || !window?.MutationObserver) return
       const observationRoot = document.querySelector('[data-prts-region="sessions"]')
       if (!observationRoot) return
+      pickupRoot = observationRoot
+      pickupRoot.addEventListener('pointerover', pickupOver)
+      pickupRoot.addEventListener('pointerout', pickupOut)
       observer = new window.MutationObserver(mutations => {
-        const relevant = mutations.filter(mutation => !mutation.target.closest?.('[data-prts-owned-session-summary]'))
+        const relevant = mutations.filter(mutation => {
+          if (mutation.target.closest?.('[data-prts-owned-session-summary]')) return false
+          if (mutation.type === 'attributes' && mutation.attributeName === 'class' && !mutation.target.closest('[role="treeitem"]')) {
+            const stableClasses = value => (value ?? '').split(/\s+/).filter(token => token && !token.endsWith('_quietBars')).sort().join(' ')
+            if (stableClasses(mutation.oldValue) === stableClasses(mutation.target.getAttribute('class'))) return false
+          }
+          return true
+        })
         const freshRow = 'div[role="treeitem"]:not([data-prts-session-row]):not([data-prts-workspace-row])'
         const mountsRows = relevant.some(mutation => mutation.type === 'childList'
           && Array.from(mutation.addedNodes).some(node => node.nodeType === 1
@@ -1040,9 +1072,14 @@ export function createSidebarControlAdapter({ document, window, sessions, worksp
         childList: true,
         attributes: true,
         attributeFilter: ['aria-expanded', 'aria-selected', 'class', 'data-state'],
+        attributeOldValue: true,
       })
     },
     dispose() {
+      clearPickup()
+      pickupRoot?.removeEventListener('pointerover', pickupOver)
+      pickupRoot?.removeEventListener('pointerout', pickupOut)
+      pickupRoot = undefined
       adapterActive = false
       disconnectSummarySources()
       cancelReveal()

package/src/client/theme-controller-v2.js

@@ -19,6 +19,7 @@ const ROOT_ATTRIBUTES = [
   'data-prts-background-mode',
 ]
 const SESSION_FLOW_COLOR_PROPERTIES = {
+  '--prts-corner-color': 'cornerColor',
   '--prts-session-flow-back': 'sessionFlowColorBack',
   '--prts-session-flow-core': 'sessionFlowColorCore',
   '--prts-session-flow-front': 'sessionFlowColorFront',

package/src/client/theme-controller.js

@@ -14,6 +14,7 @@ const ROOT_ATTRIBUTES = [
   'data-prts-conversation-style',
 ]
 const SESSION_FLOW_COLOR_PROPERTIES = {
+  '--prts-corner-color': 'cornerColor',
   '--prts-session-flow-back': 'sessionFlowColorBack',
   '--prts-session-flow-core': 'sessionFlowColorCore',
   '--prts-session-flow-front': 'sessionFlowColorFront',

package/src/client/theme-settings-workbench.js

@@ -171,6 +171,7 @@ export function themeSettingsMarkup() {
           <section data-prts-settings-common data-prts-settings-section="interaction" role="tabpanel" id="prts-page-interaction" aria-labelledby="prts-tab-interaction" tabindex="0" hidden>
             <div data-prts-settings-common-grid>
               ${COMMON_CONTROLS.filter(([key]) => ['cursor', 'railDefaultHidden', 'motion'].includes(key)).map(([key, label, options]) => settingButtons(key, label, options)).join('')}
+              <div data-prts-setting-row="cornerColor"><span><strong>交互提示框颜色</strong><small data-prts-setting-note>部分按钮和卡片的四角提示颜色，危险操作保持红色。</small></span><div data-prts-corner-presets role="group" aria-label="交互提示框预设颜色">${[['黄色','#f0c800'],['白色','#ffffff'],['青色','#65ddb0'],['蓝色','#6eb7f3'],['紫色','#b487ef']].map(([name,color]) => `<button type="button" data-prts-corner-preset="${color}" aria-label="${name}" title="${name}" aria-pressed="false" style="--swatch:${color}"><i aria-hidden="true"></i></button>`).join('')}<button type="button" data-prts-corner-custom title="选择自定义颜色"><i data-prts-corner-preview aria-hidden="true"></i><span>自定义</span></button><input type="color" data-prts-corner-color aria-label="交互提示框颜色" value="#f0c800" hidden></div></div>
             </div>
           </section>
           <section data-prts-settings-section="ai-tools" data-prts-ai-tools role="tabpanel" id="prts-page-ai-tools" aria-labelledby="prts-tab-ai-tools" tabindex="0" hidden>
@@ -531,6 +532,10 @@ export function createThemeSettingsOverlay({
 
   function renderState() {
     if (!panel || !currentPreferences) return
+    const cornerColor = panel.querySelector('[data-prts-corner-color]')
+    if (cornerColor) cornerColor.value = currentPreferences.cornerCustomColor
+    panel.querySelector('[data-prts-corner-preview]')?.style.setProperty('--swatch', currentPreferences.cornerCustomColor)
+    for (const preset of panel.querySelectorAll('[data-prts-corner-preset]')) preset.setAttribute('aria-pressed', String(preset.dataset.prtsCornerPreset === currentPreferences.cornerColor))
     for (const toggle of panel.querySelectorAll('[data-prts-setting-switch]')) {
       const key = toggle.dataset.prtsSettingSwitch
       const enabled = key === 'cursor' ? currentPreferences.cursor === 'prts'
@@ -625,6 +630,8 @@ export function createThemeSettingsOverlay({
     if (event.target === panel) { setOpen(false); return }
     const target = event.target?.closest?.('button')
     if (!target) return
+    if (target.hasAttribute('data-prts-corner-custom')) { panel.querySelector('[data-prts-corner-color]').click(); return }
+    if (target.hasAttribute('data-prts-corner-preset')) { onPreferenceChange('cornerColor', target.dataset.prtsCornerPreset); return }
     if (target.hasAttribute('data-prts-settings-jump')) {
       selectSection(target.dataset.prtsSettingsJump)
       return
@@ -663,6 +670,7 @@ export function createThemeSettingsOverlay({
 
   function onPanelInput(event) {
     const target = event.target
+    if (target?.matches?.('[data-prts-corner-color]')) { onPreferencePreview('cornerColor', target.value); return }
     if (target?.matches?.('[data-prts-preview-reply-limit]')) { onPreferenceChange('previewReplyLimit', Number(target.value)); return }
     if (target?.matches?.('input[data-prts-setting-color]')) {
       const key = target.dataset.prtsSettingKey
@@ -725,6 +733,7 @@ export function createThemeSettingsOverlay({
   const renderMediaState = () => renderState()
   const commitFromControl = event => {
     const target = event.target
+    if (target?.matches?.('[data-prts-corner-color]')) { if (event.type === 'change') onPreferenceChange('cornerCustomColor', target.value); return }
     if (target?.matches?.('input[data-prts-setting-color]')) {
       if (event.type === 'change' || event.type === 'focusout') commitSessionFlowColor(target.dataset.prtsSettingKey)
       return

package/src/client/theme-transfer-panel.js

@@ -13,9 +13,8 @@ export function themeTransferMarkup() {
           <button type="button" data-prts-transfer-export>导出主题文件 <span aria-hidden="true">↓</span></button>
         </section>
         <section data-prts-transfer-card="import" data-prts-transfer-drop>
-          <h3>导入主题</h3><p>选择或拖入已导出的文件，确认内容后应用。</p>
-          <div data-prts-transfer-file-hint><span aria-hidden="true">↑</span><small>.prts-theme.json · 最大 160 MB</small></div>
-          <button type="button" data-prts-transfer-choose>选择主题文件 <span aria-hidden="true">↑</span></button>
+          <h3>导入主题</h3><p>导入已导出的主题文件，确认内容后应用。</p>
+          <button type="button" data-prts-transfer-file-hint data-prts-transfer-choose><span aria-hidden="true">↑</span><strong>点击选择或拖拽主题文件到此处</strong><small>.prts-theme.json · 最大 160 MB</small></button>
           <input type="file" accept=".prts-theme.json,application/json" aria-label="导入主题文件" data-prts-transfer-file hidden>
         </section>
       </div>

package/src/styles/custom-background.css

@@ -5,9 +5,10 @@ background: linear-gradient(var(--prts-background-wash), var(--prts-background-w
 }
 html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] :is([data-prts-region="sessions"], [data-prts-region="operation"]) { background: transparent; }
 html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar] {
+& :is([data-prts-region="sessions"],[data-prts-nav-rail]) {
 --prts-wall-width:var(--prts-protected-sidebar-width,max(calc(var(--prts-sidebar-width,280px) + var(--prts-nav-width)),calc((100dvh - var(--prts-host-top-inset)) * var(--prts-sidebar-image-ratio,1))));
 --prts-wall-x:var(--prts-protected-sidebar-x,calc((var(--prts-sidebar-width,280px) + var(--prts-nav-width) - var(--prts-wall-width)) / 2));
-& :is([data-prts-region="sessions"],[data-prts-nav-rail]){background:linear-gradient(var(--prts-background-wash),var(--prts-background-wash)),var(--prts-background-sidebar) var(--prts-wall-x) var(--prts-protected-sidebar-y, 50%) / var(--prts-wall-width) auto no-repeat}
+background:linear-gradient(var(--prts-background-wash),var(--prts-background-wash)),var(--prts-background-sidebar) var(--prts-wall-x) var(--prts-protected-sidebar-y, 50%) / var(--prts-wall-width) auto no-repeat}
 & [data-prts-region="sessions"]{background-position:center,calc(var(--prts-wall-x) - var(--prts-nav-width)) var(--prts-protected-sidebar-y, 50%)}
 }
 html[data-dsh-prts][data-prts-rail-mode="overlay"]:is([data-prts-background-mode="split"][data-prts-background-sidebar],[data-prts-background-mode="full"][data-prts-background-full]) [data-prts-nav-rail] { background: transparent; }

package/src/styles/facility-vector.css

@@ -572,11 +572,11 @@ html[data-dsh-prts] [data-prts-session-pickup-bar]:nth-of-type(10) { --prts-pick
 html[data-dsh-prts] [data-prts-session-pickup-bar]:nth-of-type(11) { --prts-pickup-duration: 560ms; --prts-pickup-delay: -.3s; }
 
 @media (prefers-reduced-motion: no-preference) {
-  html[data-dsh-prts]:not([data-prts-motion="reduced"]) [data-prts-session-row]:hover [data-prts-session-pickup-indicator] {
+  html[data-dsh-prts]:not([data-prts-motion="reduced"]) [data-prts-session-row]:hover[data-prts-pickup-ready] [data-prts-session-pickup-indicator] {
     animation: prts-session-record-indicator 1.1s ease-in-out infinite;
   }
 
-  html[data-dsh-prts]:not([data-prts-motion="reduced"]) [data-prts-session-row]:hover [data-prts-session-pickup-bar] {
+  html[data-dsh-prts]:not([data-prts-motion="reduced"]) [data-prts-session-row]:hover[data-prts-pickup-ready] [data-prts-session-pickup-bar] {
     animation: prts-session-pickup-sample var(--prts-pickup-duration) ease-in-out var(--prts-pickup-delay) infinite;
   }
 }
@@ -886,3 +886,6 @@ html[data-dsh-prts] [data-prts-tool-record] > div { display:flex;align-items:bas
 html[data-dsh-prts] [data-prts-tool-record] b { flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--prts-cyan);font:11px/1.6 var(--prts-mono); }
 html[data-dsh-prts] [data-prts-tool-record] small { flex:none;color:var(--prts-muted);font-size:10px; }
 html[data-dsh-prts] [data-prts-tool-record] p { display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:4px 0 0; }
+
+/* Show the baseline immediately; only start the pickup after a deliberate hover. */
+html[data-dsh-prts] [data-prts-session-row]:not([data-prts-pickup-ready]) :is([data-prts-session-pickup-bar],[data-prts-session-pickup-indicator]) { visibility:hidden; }

package/src/styles/refinement.css

@@ -508,7 +508,7 @@ html[data-dsh-prts] [data-turn-trigger] {
 }
 
 /* Body interactions lock onto four corners; shell controls keep their own treatment. */
-html[data-dsh-prts] :is([data-chat-flow-kind],[data-message-role]) :is([data-prts-conversation-control],[data-presented-file],[data-changed-files],[data-produced-files-row] > button) {
+html[data-dsh-prts] :is([data-chat-flow-kind],[data-message-role],[data-submission-echo],[data-pending-steering]) :is([data-prts-conversation-control],[data-presented-file],[data-changed-files],[data-produced-files-row] > button) {
   position:relative;
   --prts-control-outline:var(--prts-line);
   &:is(:hover,:focus-visible,:focus-within) {

package/src/styles/theme-settings-workbench.css

@@ -967,7 +967,8 @@ html[data-dsh-prts] [data-prts-transfer] {
   & [data-prts-transfer-option] { align-items:flex-start; flex-wrap:nowrap; padding:12px 0 0; }
   & [data-prts-transfer-option] input { margin:5px 0 0; }
   & [data-prts-transfer-option] small { display:block; margin-top:4px; }
-  & [data-prts-transfer-file-hint] { display:grid; place-items:center; flex:1; gap:6px; padding:12px; border:1px dashed var(--prts-line-strong); }
+  & [data-prts-transfer-card] > [data-prts-transfer-file-hint] { display:flex; flex-direction:column; justify-content:center; flex:1; gap:6px; min-height:130px; padding:16px 12px; border:1px dashed var(--prts-line-strong); text-align:center; white-space:normal; }
+  & [data-prts-transfer-file-hint] > strong { font-size:13px; font-weight:500; }
   & [data-prts-transfer-file-hint] > span { font-size:24px; color:var(--prts-muted); }
   & [data-prts-transfer-buttons] { display:flex; gap:8px; }
   & [data-prts-transfer-compatibility] { margin:0; padding:10px 12px; border:1px solid var(--prts-yellow); overflow-wrap:anywhere; }
@@ -1032,3 +1033,15 @@ html[data-dsh-prts] [data-prts-transfer]:not([aria-busy="true"]) [data-prts-tran
 }
 html[data-prts-motion="reduced"] [data-prts-transfer-card] { transition:none; }
 @media (prefers-reduced-motion:reduce) { [data-prts-transfer-card] { transition:none; } }
+
+html[data-dsh-prts] [data-prts-setting-row="cornerColor"] { flex-wrap:wrap;gap:16px; }
+html[data-dsh-prts] [data-prts-corner-presets] { display:flex;flex-wrap:wrap;gap:6px;align-items:center;
+  & > button { position:relative;display:grid;place-items:center;width:32px;height:32px;padding:5px;border:1px solid transparent;border-radius:4px;background:transparent; }
+  & i { display:block;width:18px;height:18px;border-radius:3px;background:var(--swatch);box-shadow:inset 0 0 0 1px #8884; }
+  & > button:hover { background:var(--prts-panel-raised); }
+  & > button[aria-pressed="true"] { border-color:var(--prts-ink);background:var(--prts-panel-raised); }
+  & > button[aria-pressed="true"]::after { content:"";position:absolute;width:8px;height:4px;border-left:2px solid #172025;border-bottom:2px solid #172025;transform:translateY(-1px) rotate(-45deg); }
+  & > button:focus-visible { outline:2px solid var(--prts-ink);outline-offset:2px; }
+}
+html[data-dsh-prts] [data-prts-corner-presets] > [data-prts-corner-custom] { display:flex;align-items:center;gap:8px;width:auto;height:32px;margin-left:8px;padding:5px 10px;border:1px solid var(--prts-line-strong);border-radius:4px;background:var(--prts-panel-raised);color:var(--prts-ink);font:12px/1 var(--prts-body);white-space:nowrap; }
+html[data-dsh-prts] [data-prts-corner-presets] > [data-prts-corner-custom]:is(:hover,:focus-visible) { border-color:var(--prts-ink);background:color-mix(in srgb,var(--prts-ink) 8%,var(--prts-panel-raised)); }

package/src/vendor/react-bits/GlassSurface.jsx

@@ -407,14 +407,28 @@ const GlassSurface = ({
   useEffect(() => {
     if (!containerRef.current) return;
 
-    const resizeObserver = new ResizeObserver(() => {
+    // PRTS: keep the existing map stretched with the live container while
+    // resizing. Rebuilding its distance field on every intermediate width
+    // defeats the outer composer's settled-shape update.
+    let timer;
+    let committed = '';
+    const commit = () => {
+      timer = undefined;
       const element = containerRef.current;
-      if (element) setBoxSize(`${element.offsetWidth}x${element.offsetHeight}`);
+      if (!element || !element.offsetWidth || !element.offsetHeight) return;
+      const next = `${element.offsetWidth}x${element.offsetHeight}`;
+      if (next !== committed) { committed = next; setBoxSize(next); }
+    };
+    const resizeObserver = new ResizeObserver(() => {
+      clearTimeout(timer);
+      if (!committed) commit();
+      else timer = setTimeout(commit, 160);
     });
 
     resizeObserver.observe(containerRef.current);
 
     return () => {
+      clearTimeout(timer);
       resizeObserver.disconnect();
     };
   }, []);