dsh-coding-sidebar 1.0.3 → 1.0.5

package/lib/types/prefs-shared.d.ts

@@ -124,22 +124,6 @@ export interface SidebarPrefs {
      * starts `strip` px below its top edge.
      */
     titleBarStripPx: number;
-    /**
-     * Whether the HTML previewer drops its sandboxed iframe. Sandbox ON (the
-     * default) renders previewed HTML in an opaque-origin iframe that cannot
-     * touch the GUI; turning it OFF runs the previewed page with the GUI's
-     * own origin — full read/write access to session files and internal
-     * APIs. Only for trusted local content; the setting copy warns.
-     */
-    htmlViewerNoSandbox: boolean;
-    /**
-     * Whether a newly opened HTML preview starts UNSANDBOXED (the per-surface
-     * temporary unlock pre-applied). Off by default: previews open sandboxed
-     * and the status row offers the one-tap unlock; when on, previews open
-     * in the red unsandboxed state and the status row offers a one-tap
-     * restore for the current file.
-     */
-    htmlViewerDefaultUnsafe: boolean;
     /**
      * Whether the browser tab drops its sandboxed iframe. Sandbox ON (the
      * default) keeps browsed sites in an opaque origin with no GUI access;
@@ -194,16 +178,9 @@ export interface SidebarPrefs {
      * own layouts" rule.
      */
     tabsEnabled: Record<string, boolean>;
-    /**
-     * Per-viewer enable switches, keyed by file viewer descriptor id
-     * (`'image'`, `'my-plugin:csv'`). An ABSENT key means enabled; a disabled
-     * viewer is skipped by `matchFileViewer` so files fall through to the
-     * next matching viewer (or the download button when none match).
-     */
-    viewersEnabled: Record<string, boolean>;
     /**
      * Plugin-owned settings blobs (v0.12.0+), keyed by descriptor id: each
-     * registered tab/viewer that declares `settings.pluginToggles` (or writes
+     * registered tab that declares `settings.pluginToggles` (or writes
      * through `settings.render`'s `updatePluginSetting`) persists its values
      * here — an open map, so third-party keys need no host PrefsSchema field.
      * Values are JSON-serializable (the row controls produce strings /

package/lib/types/wire.d.ts

@@ -6,7 +6,7 @@
  */
 import type { SidebarHttpRequest, SidebarHttpResponse } from './context-types.ts';
 /** Machine-readable error codes of the sidebar API. */
-export type SidebarErrorCode = 'bad-request' | 'not-found' | 'forbidden' | 'method-error' | 'too-large' | 'fs-error' | 'git-error' | 'pty-error' | 'pty-deps-missing' | 'job-error' | 'sidechat-error' | 'subagents-unavailable' | 'settings-rejected' | 'settings-conflict' | 'internal';
+export type SidebarErrorCode = 'bad-request' | 'not-found' | 'forbidden' | 'method-error' | 'too-large' | 'fs-error' | 'git-error' | 'pty-error' | 'pty-deps-missing' | 'job-error' | 'cdp-down' | 'sidechat-error' | 'subagents-unavailable' | 'settings-rejected' | 'settings-conflict' | 'internal';
 /** One API failure with its wire code and HTTP status. */
 export declare class SidebarError extends Error {
     readonly code: SidebarErrorCode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-coding-sidebar",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "DSH web plugin: a VSCode-like right sidebar (explorer / editor / terminal / git / browser), isolated per conversation session. Exposes the betterSidebar service for other plugins to register sidebar tabs and file viewers. KCoder-maintained fork of DSH-better-sidebar 0.17.2 (bottom panel removed, upstream-decoupled release line).",
   "type": "module",
   "repository": {
@@ -61,7 +61,6 @@
     "lib/client-registry.js",
     "lib/client-terminal.js",
     "lib/client-editor.js",
-    "lib/client-mermaid.js",
     "lib/types/**/*.d.ts",
     "src",
     "scripts/install.sh",
@@ -85,18 +84,18 @@
   "license": "MIT",
   "peerDependencies": {
     "@deepseek-ai/cordis": "^4.0.1",
-    "@deepseek-ai/dsh-agent": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-locale": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-conversation": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-settings": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-slots": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-host-webserver": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-llm": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-session": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-settings": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-subagent": "^0.1.5-rc.1",
-    "@deepseek-ai/dsh-tools": "^0.1.5-rc.1",
+    "@deepseek-ai/dsh-agent": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-locale": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-conversation": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-settings": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-slots": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-host-webserver": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-llm": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-session": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-settings": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-subagent": "^0.1.5-rc.2",
+    "@deepseek-ai/dsh-tools": "^0.1.5-rc.2",
     "@huanlin/dsh-plugin-better-locale": "^0.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
@@ -130,8 +129,6 @@
     "@codemirror/view": "^6.43.8",
     "@lezer/highlight": "^1.2.3",
     "clsx": "^2.1.1",
-    "dompurify": "^3.4.14",
-    "mermaid": "^11.16.1",
     "node-pty": "^1.1.0",
     "react-icons": "5.7.0",
     "rxjs": "^7.8.2",
@@ -139,20 +136,20 @@
     "ws": "^8.18.0"
   },
   "devDependencies": {
-    "@deepseek-ai/dsh-invariants": "0.1.5-rc.1",
+    "@deepseek-ai/dsh-invariants": "0.1.5-rc.2",
     "@cordisjs/plugin-loader": "^1.0.0-rc.5",
-    "@deepseek-ai/dsh-agent": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-locale": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-conversation": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-primitives": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-settings": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-client-ui-slots": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-host-webserver": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-llm": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-session": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-settings": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-subagent": "0.1.5-rc.1",
-    "@deepseek-ai/dsh-tools": "0.1.5-rc.1",
+    "@deepseek-ai/dsh-agent": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-locale": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-conversation": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-settings": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-client-ui-slots": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-host-webserver": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-llm": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-session": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-settings": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-subagent": "0.1.5-rc.2",
+    "@deepseek-ai/dsh-tools": "0.1.5-rc.2",
     "@huanlin/dsh-plugin-better-locale": "^0.1.0",
     "@types/node": "^24.0.0",
     "@types/react": "~18.3.1",

package/src/bundle-route.ts

@@ -19,7 +19,7 @@ import { fileURLToPath } from 'node:url'
 import type { Context, SidebarHttpRequest, SidebarHttpResponse } from './context-types.ts'
 
 /** The chunk names the client may request (mirror of src/client/chunk-loader.ts). */
-export const CHUNK_NAMES = ['terminal', 'editor', 'mermaid'] as const
+export const CHUNK_NAMES = ['terminal', 'editor'] as const
 export type ChunkName = (typeof CHUNK_NAMES)[number]
 
 /** Directory of this host-half module (lib/ — the chunk scripts live next to it). */

package/src/client/BrowserView.tsx

@@ -24,12 +24,13 @@ import {
   IconRefreshOutline14,
   IconWarningOutline16,
 } from '@deepseek-ai/dsh-client-ui-primitives'
-import { VscLinkExternal } from 'react-icons/vsc'
+import { VscLinkExternal, VscRemoteExplorer } from 'react-icons/vsc'
 import { api } from './api.ts'
 import { embeddabilityOf, isAllowedLoopbackUrl, normalizeBrowserUrl } from './browser.ts'
 import { patchTab } from './state.ts'
 import { SandboxStatusBar } from './SandboxStatusBar.tsx'
 import { t } from './locales.ts'
+import { LiveView } from './LiveView.tsx'
 import type { TabComponentProps } from './service.ts'
 import css from './sidebar.module.css'
 
@@ -101,6 +102,9 @@ export function BrowserView(props: TabComponentProps) {
   const [embedBlocked, setEmbedBlocked] = useState<string | null>(null)
   /** The user asked to load the refused site anyway (keeps the plain iframe). */
   const [forceEmbed, setForceEmbed] = useState(false)
+  /** Agent 实况模式（CDP screencast）：开启后本 tab 只显示 agent 无头
+   *  浏览器的实况画面，地址栏/iframe 暂停。会话态开关，不持久化。 */
+  const [live, setLive] = useState(false)
 
   // Probe every navigation (address bar, history, restored path): when the
   // target forbids embedding, show the reason + open-in-browser instead of
@@ -212,6 +216,16 @@ export function BrowserView(props: TabComponentProps) {
         >
           <IconLinkOutline14 />
         </button>
+        <button
+          type="button"
+          className={css.iconButton}
+          aria-label={t('browserLive')}
+          title={t('browserLive')}
+          aria-pressed={live}
+          onClick={() => { setLive(value => !value) }}
+        >
+          <VscRemoteExplorer size={15} />
+        </button>
         <button
           type="button"
           className={css.iconButton}
@@ -233,7 +247,9 @@ export function BrowserView(props: TabComponentProps) {
         onUnlock={() => { setLocalUnlock(true) }}
         onRestore={() => { setLocalUnlock(false) }}
       />
-      {url === undefined ? (
+      {live ? (
+        <LiveView />
+      ) : url === undefined ? (
         <div className={css.browserStart}>{t('browserStart')}</div>
       ) : embedBlocked !== null && !forceEmbed ? (
         <BrowserEmbedBlocked

package/src/client/EditorHost.tsx

@@ -1,10 +1,11 @@
 /**
- * The editor tab host: the single FILES WINDOW. It resolves a file's
- * previewer through the sidebar registry (`matchFileViewer`), fetches bytes
- * per the matched viewer's fetch strategy, and renders its component — or
- * the shared download pane when nothing can render the file. A tab without
- * a path (the seeded "Files" home) renders an empty-state hint instead of
- * the viewer loading flow; that path-less window IS the file explorer.
+ * The editor tab host: the single FILES WINDOW. It fetches a file's text
+ * through the host fs.read — text renders in the (chunk-lazy) sidebar text
+ * editor, a binary file renders the shared download pane. (v1.0.4: the
+ * file-viewer registry/matching was retired — file preview is the host's
+ * job now, the sidebar edits text only.) A tab without a path (the seeded
+ * "Files" home) renders an empty-state hint instead of the loading flow;
+ * that path-less window IS the file explorer.
  *
  * The chrome depends on the `editorExplorer` mode (read reactively so
  * toggling it re-renders without a reload):
@@ -18,18 +19,14 @@
  * The tree's context menu offers the explicit escapes in both modes: open
  * in a new tab (per-path dedupe) or to the side (a fresh tab in a fresh
  * rightward split of the current pane).
- *
- * The strategy dispatch is pure (planFirstMatch / planFsReadOutcome in
- * editor-load.ts); this component only wires it to the host APIs.
  */
 import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react'
-import { createElement } from 'react'
+import type { ComponentType } from 'react'
 import clsx from 'clsx'
 import { IconCheckOutline16, IconFolderOpen16, IconRefreshOutline14 } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { Context } from '../context-types.ts'
-import { api, mediaUrl, type SessionScope } from './api.ts'
+import { api, type SessionScope } from './api.ts'
 import { BinaryDownload } from './binary-download.tsx'
-import { planFirstMatch, planFsReadOutcome, type EditorLoadAction } from './editor-load.ts'
 import { baseName } from './FileTree.tsx'
 import { createFrameBatcher } from './frame-batcher.ts'
 import { openSidebarFile } from './intercept.tsx'
@@ -39,16 +36,27 @@ import { TreePanel } from './TreePanel.tsx'
 import { t } from './locales.ts'
 import { relativeTo } from './paths.ts'
 import { resolveSidebarPath } from './produced-files.ts'
-import type { EditorToolbarControls, EditorToolbarState, FileViewerDescriptor } from './service.ts'
+import type { EditorToolbarControls, EditorToolbarState } from './service.ts'
+import { lazyChunkComponent } from './lazy-chunk.tsx'
+import type { TextEditorProps } from './TextEditor.tsx'
 import { firstLeaf, insertLeafAt, leafWithTab, mintTabId, treeOf, type SidebarStore, type SidebarTab } from './state.ts'
 import css from './sidebar.module.css'
 
 type EditorLoad =
   | { status: 'loading' }
   | { status: 'error'; message: string }
-  | { status: 'ready'; viewer: FileViewerDescriptor; content?: string; truncated?: boolean; mediaUrl?: string; customData?: unknown }
+  | { status: 'ready'; content: string; truncated: boolean }
   | { status: 'binary' }
 
+/**
+ * Lazy wrapper over the chunk-resident text editor: CodeMirror and the
+ * language packs are fetched only when a file tab first renders (see
+ * chunk-loader.ts). The `pick` function is module-level (stable identity —
+ * the wrapper effect depends on it); the cast bridges the chunk exports
+ * record to the prop shape.
+ */
+const LazyTextEditor = lazyChunkComponent<TextEditorProps>('editor', (mod) => mod.TextEditor as ComponentType<TextEditorProps> | undefined)
+
 /** The docked tree panel's width bounds (drag-resize clamps into them). */
 const TREE_WIDTH_DEFAULT = 240
 const TREE_WIDTH_MIN = 160
@@ -103,11 +111,10 @@ export function EditorHost(props: {
 }) {
   const { ctx, store, scope, tab, expanded, revealed, onToggleDir, onReferenceFile } = props
   const path = tab.path ?? ''
-  const title = tab.title
   // A folder window: the model's `sidebar_open` (or any caller) opens a
   // directory as an editor tab carrying `meta.dir: true` with the directory
   // as its path. It renders the file tree rooted at that folder instead of
-  // the viewer loading flow (a directory is not a file).
+  // the file loading flow (a directory is not a file).
   const isDir = metaOf(tab).dir === true
   const [load, setLoad] = useState<EditorLoad>({ status: 'loading' })
   // Manual refresh (issue #167): bumping the sequence re-runs the load effect
@@ -223,9 +230,8 @@ export function EditorHost(props: {
     })
   }
 
-  // The viewer's toolbar, hoisted into THIS header: the text editor reports
-  // its state and registers its commands (both null/absent for viewers
-  // without a toolbar — image, pdf, binary download).
+  // The editor's toolbar, hoisted into THIS header: the text editor reports
+  // its state and registers its commands (null while nothing is loaded).
   const [toolbar, setToolbar] = useState<EditorToolbarState | null>(null)
   const controlsRef = useRef<EditorToolbarControls | null>(null)
   const onToolbarState = useCallback((next: EditorToolbarState) => {
@@ -279,77 +285,27 @@ export function EditorHost(props: {
 
   useEffect(() => {
     // A (re)load or a path-less tab clears any hoisted toolbar state — the
-    // fresh viewer re-registers its own.
+    // fresh editor re-registers its own.
     setToolbar(null)
-    // The seeded home tab (no path) never loads a viewer — the empty-state
+    // The seeded home tab (no path) never loads a file — the empty-state
     // hint renders until the user picks a file. A folder tab never loads a
-    // viewer either — its tree is rooted at the folder.
+    // file either — its tree is rooted at the folder.
     if (showEmpty || isDir) return
     let cancelled = false
-    // Aborts the matched viewer's `load` when the editor tears down (tab
-    // closed, path changed, session switched) or re-matches the viewer.
-    const controller = new AbortController()
     setLoad({ status: 'loading' })
-    const mediaUrlOf = (): string => mediaUrl(scope, path)
-    const apply = (action: EditorLoadAction): void => {
+    api.fsRead(scope, path).then((result) => {
       if (cancelled) return
-      switch (action.kind) {
-        case 'binary':
-          setLoad({ status: 'binary' })
-          return
-        case 'render':
-          setLoad({
-            status: 'ready',
-            viewer: action.viewer,
-            content: action.content,
-            truncated: action.truncated,
-            mediaUrl: action.mediaUrl,
-            customData: action.customData,
-          })
-          return
-        case 'customLoad':
-          void action.viewer.load?.(path, scope, controller.signal).then((data) => {
-            if (cancelled) return
-            setLoad({ status: 'ready', viewer: action.viewer, customData: data })
-          }).catch((error: unknown) => {
-            if (cancelled) return
-            setLoad({ status: 'error', message: error instanceof Error ? error.message : String(error) })
-          })
-          return
-        case 'fetchFsRead':
-          api.fsRead(scope, path).then((result) => {
-            if (cancelled) return
-            // Binary reads carry the head bytes for the detect re-match.
-            const outcome = planFsReadOutcome(action.viewer, {
-              binary: result.kind === 'binary',
-              content: result.kind === 'text' ? result.content : '',
-              truncated: result.truncated,
-              head: result.kind === 'binary' ? result.head : undefined,
-            }, (head) => ctx.get('betterSidebar')?.matchFileViewer(path, head), mediaUrlOf)
-            apply(outcome)
-          }).catch((error: unknown) => {
-            if (cancelled) return
-            setLoad({ status: 'error', message: error instanceof Error ? error.message : String(error) })
-          })
-          return
+      if (result.kind === 'binary') {
+        setLoad({ status: 'binary' })
+        return
       }
-    }
-    apply(planFirstMatch(ctx.get('betterSidebar')?.matchFileViewer(path), mediaUrlOf))
-    return () => { cancelled = true; controller.abort() }
-  }, [scope.sessionId, scope.cwd, path, ctx, showEmpty, isDir, reloadSeq])
-
-  // Save-then-refresh in preview mode (issue #167 part C): the edge into
-  // 'saved' (never a lingering 'saved' state) triggers exactly one reload, so
-  // a preview-mode Ctrl+S shows the fresh content immediately. Edit mode is
-  // left alone — reloading would remount the editor and drop the caret.
-  const prevSaveState = useRef<EditorToolbarState['saveState'] | undefined>(undefined)
-  useEffect(() => {
-    const current = toolbar?.saveState
-    if (prevSaveState.current !== 'saved' && current === 'saved' && toolbar?.mode === 'preview') {
-      setReloadSeq(sequence => sequence + 1)
-    }
-    prevSaveState.current = current
-  }, [toolbar?.saveState, toolbar?.mode])
+      setLoad({ status: 'ready', content: result.content, truncated: result.truncated })
+    }).catch((error: unknown) => {
+      if (cancelled) return
+      setLoad({ status: 'error', message: error instanceof Error ? error.message : String(error) })
+    })
+    return () => { cancelled = true }
+  }, [scope.sessionId, scope.cwd, path, showEmpty, isDir, reloadSeq])
 
   const treeOpen = treeOpenOf(tab)
   /** Persist the panel flag on the tab (survives reloads with the layout). */
@@ -392,33 +348,6 @@ export function EditorHost(props: {
     <div className={css.editor}>
       <div className={css.editorHeader}>
         <EditorPathInput key={path} path={path} cwd={scope.cwd} onOpen={openFile} />
-        {toolbar?.modes === true && (
-          <div className={css.editorModeToggle}>
-            <button
-              type="button"
-              className={clsx(css.editorModeButton, toolbar.mode === 'preview' && css.editorModeActive)}
-              onClick={() => {
-                // Issue #167 part B: returning from edit to preview reloads so
-                // the preview renders the just-saved content. A dirty draft
-                // (or a failed save) suppresses the reload — the draft only
-                // lives in the editor instance and a remount would drop it.
-                if (toolbar.mode === 'edit' && toolbar.dirty !== true && toolbar.saveState !== 'failed') {
-                  setReloadSeq(sequence => sequence + 1)
-                }
-                controlsRef.current?.setMode('preview')
-              }}
-            >
-              {t('preview')}
-            </button>
-            <button
-              type="button"
-              className={clsx(css.editorModeButton, toolbar.mode === 'edit' && css.editorModeActive)}
-              onClick={() => { controlsRef.current?.setMode('edit') }}
-            >
-              {t('edit')}
-            </button>
-          </div>
-        )}
         {toolbar?.dirty === true && <span className={css.dirtyDot} title={t('unsaved')} />}
         {toolbar?.editable === true && (
           <button
@@ -462,18 +391,19 @@ export function EditorHost(props: {
           {!showEmpty && load.status === 'loading' && <div className={css.editorPlaceholder}>{t('loading')}</div>}
           {!showEmpty && load.status === 'error' && <div className={css.editorError}>{load.message}</div>}
           {!showEmpty && load.status === 'binary' && <BinaryDownload scope={scope} path={path} />}
-          {!showEmpty && load.status === 'ready' && createElement(load.viewer.component, {
-            ctx, store, scope, path, title,
-            viewerId: load.viewer.id,
-            content: load.content,
-            truncated: load.truncated,
-            mediaUrl: load.mediaUrl,
-            customData: load.customData,
-            // The viewer's toolbar always hoists into this host's header.
-            toolbar: 'host',
-            onToolbarState,
-            onToolbarControls,
-          })}
+          {!showEmpty && load.status === 'ready' && (
+            <LazyTextEditor
+              ctx={ctx}
+              store={store}
+              scope={scope}
+              path={path}
+              content={load.content}
+              truncated={load.truncated}
+              toolbar="host"
+              onToolbarState={onToolbarState}
+              onToolbarControls={onToolbarControls}
+            />
+          )}
         </div>
         {treeOpen && (
           <div className={css.editorTreeDock} style={{ width: treeWidth }}>