dsh-baleen 0.1.1 → 0.2.0

package/src/client/views/drawer.js

@@ -6,7 +6,8 @@
  */
 import { vnode } from '../vnode.js'
 import { matchInfo } from '../match.js'
-import { fmtDuration, readbackMiss, foldersUnreadNote } from '../format.js'
+import { fmtDuration, readbackMiss, foldersUnreadNote, httpUrl } from '../format.js'
+import { readerParagraphs } from './article.js'
 
 const DELTA = { dismiss: '-0.1', save: '+0.1' }
 /** 每种 body_state 一句说法：正文区与能力边界共用，别两处各写一遍再各自漂移 */
@@ -32,12 +33,56 @@ export function feedbackHint(action) {
  * 早先只回一句的话，B 站硬字幕条目会被播放器的说法盖掉，看不出内容其实读不到。
  * 播放器 M4a 没做（V5 先探后定），所以这里不许预告任何接入时间——跳转就是现状。
  */
+/**
+ * 内嵌播放器（V5 真机实证 2026-11-01：面板页 iframe 不被宿主 CSP 拦）。
+ * B 站=完整页 iframe（bilibili 试图跳出顶层会被 Chromium 自动拦，实测无害；
+ * 官方 player.html 反而是空壳）；YouTube=官方 embed，带 rel=0——播完不出
+ * 相关视频网格，跟"不让你顺着推荐刷下去"是同一条产品意图。作者关了嵌入的
+ * 视频会显示 YouTube 自己的提示，此时走「浏览器打开」。其余平台返回 null。
+ */
+export function playerEmbed(url) {
+  const s = String(url ?? '')
+  const bili = /bilibili\.com\/video\/(BV[0-9A-Za-z]+)/.exec(s)
+  if (bili) return { kind: 'bili', src: 'https://www.bilibili.com/video/' + bili[1] }
+  const yt = /[?&]v=([0-9A-Za-z_-]{11})/.exec(s) || /youtu\.be\/([0-9A-Za-z_-]{11})/.exec(s)
+  if (yt && /youtube\.com|youtu\.be/.test(s)) return { kind: 'youtube', src: 'https://www.youtube.com/embed/' + yt[1] + '?rel=0' }
+  return null
+}
+
+/**
+ * 播放器舞台：抽屉与侧栏 tab 共用这一份标记、同一套 .bl-stage* 样式。
+ * 裁切窗跟着容器宽度走（aspect-ratio 16:9 = 视频面本来的形状），不再是写死的
+ * 像素对——窄容器漏推荐流、宽容器把 B 站控制条（音量在那）裁出窗外，都是固定值惹的。
+ * B 站是完整页，多带一个 bl-stage-bili 让 CSS 做版心缩放 + 页头偏移（css.js 的
+ * --bl-frame/--bl-nav）；YouTube embed 本来就是纯 16:9 播放器，精确合围即止。
+ * 裁切模式给 iframe 加 scrolling=no：内页滚不动，推荐流连滚出来的机会都没有；
+ * 还原模式（crop=false）保留滚动——那本来就是"看完整页"的路。
+ * 音量/倍速这些控件在跨源 iframe 里面，我们够不着，也不打算假装够得着——界面上明说用原播放器的。
+ */
+export function playerStage(embed, crop) {
+  const cls = ['bl-stage']
+  if (crop) cls.push('bl-stage-crop')
+  if (crop && embed.kind === 'bili') cls.push('bl-stage-bili')
+  return vnode('div', { className: cls.join(' ') }, [
+    vnode('iframe', {
+      className: 'bl-player',
+      src: embed.src,
+      title: '视频播放器',
+      allow: 'autoplay; fullscreen',
+      allowfullscreen: true,
+      scrolling: crop ? 'no' : 'auto'
+    })
+  ])
+}
+
 export function boundaryNote(item) {
   const bits = []
   if (item?.kind === 'video') {
-    bits.push(item.source_id === 'bili'
-      ? 'B 站：抽屉内嵌播放器还没定下来，现在跳到浏览器里看。'
-      : '这个平台没有可靠的嵌入方案，只能跳到浏览器里看。')
+    bits.push(playerEmbed(item?.url)
+      ? '内嵌播放器在上方，直接看；弹幕和评论区要去原站。'
+      : item.source_id === 'bili'
+        ? '这个视频的地址解析不出嵌入形态，只能跳到浏览器里看。'
+        : '这个平台没有可靠的嵌入方案，只能跳到浏览器里看。')
   }
   if (LIMITS.has(item?.body_state)) bits.push(STATE_NOTE[item.body_state])
   return bits.join(' ')
@@ -78,7 +123,7 @@ export function drawerItemWithFolders(found, knownFolders) {
 const namesOf = (item, folders, ids) => (ids ?? []).map((id) =>
   (folders ?? []).find((f) => f.id === id)?.name ?? `#${id}（这个夹已经没了）`).join(' / ') || '（现在不在任何夹里）'
 
-export function Drawer({ item, api = {}, onClose, onDone, note, folders = [], collecting = false, newFolderName = '', onNewFolderName = () => {} }) {
+export function Drawer({ item, api = {}, onClose, onDone, note, folders = [], collecting = false, newFolderName = '', onNewFolderName = () => {}, onOpenUrl, sidebar = null }) {
   async function fire(action) {
     let res = null
     try {
@@ -139,7 +184,10 @@ export function Drawer({ item, api = {}, onClose, onDone, note, folders = [], co
 
   const m = matchInfo(item)
   const body = typeof item.body_text === 'string' ? item.body_text.trim() : ''
+  const paras = readerParagraphs(body)
   const hasFolders = (folders ?? []).length > 0
+  const link = httpUrl(item.url)
+  const embed = playerEmbed(item.url)
 
   return vnode('aside', { className: 'bl-drawer', role: 'dialog', 'aria-label': '条目详情' }, [
     vnode('header', { className: 'bl-dbar' }, [
@@ -167,11 +215,24 @@ export function Drawer({ item, api = {}, onClose, onDone, note, folders = [], co
       Section({
         title: item.kind === 'video' ? '字幕原文' : '正文',
         children: [
-          vnode('p', {}, [body || '（没有可读内容）']),
+          // 正文与阅读器同一条分段规则（readerParagraphs）：空行成段、单换行保留，
+          // 字幕在抽屉里也逐行可读；排版类 bl-reader-body 与文章页同一份。
+          vnode('div', { className: 'bl-reader-body' },
+            paras.length ? paras.map((p, i) => vnode('p', { key: i }, [p])) : ['（没有可读内容）']),
           STATE_NOTE[item.body_state] ? vnode('p', { className: 'bl-reader-hint' }, [STATE_NOTE[item.body_state]]) : null
         ]
       }),
       item.verdict_why ? Section({ title: '会话的判断', children: [vnode('p', {}, [`为什么判成「${item.verdict_tier}」：${item.verdict_why}`])] }) : null,
+      // 内嵌播放（V5 实证可行）：视频且能解析出嵌入形态就直接在抽屉里放，
+      // 不把人跳去平台——须鲸的初衷是"在你待着的地方看"。舞台用与侧栏 tab 同一份
+      // playerStage()：完整页 iframe 往下会带出平台的推荐流，裁掉是产品意图。
+      embed ? Section({
+        title: '内嵌播放',
+        children: [
+          playerStage(embed, true),
+          vnode('p', { className: 'bl-note' }, ['只露播放器本体，推荐流被裁掉是不想让你刷下去；音量、倍速用画面里的原播放器控件。'])
+        ]
+      }) : null,
       boundaryNote(item) ? Section({ title: '能力边界', children: [vnode('p', {}, [boundaryNote(item)])] }) : null,
       Section({
         title: '收藏到…',
@@ -204,7 +265,39 @@ export function Drawer({ item, api = {}, onClose, onDone, note, folders = [], co
           ])
         ]
       }),
-      item.url ? Section({ title: '链接', children: [vnode('p', { className: 'bl-url' }, [item.url])] }) : null,
+      // 原文地址：真的 <a href>。早先这里是 <p>，那句话"跳到浏览器里看"等于空头支票。
+      // 地址不是 http/https 就整段不画——不拿一个点不动的假链接充数。
+      // （2026-10-31 真机验收：本宿主把客户端页面的弹窗与外链全部静默拦下，<a> 与
+      // window.open 都到不了系统浏览器——「浏览器打开」改走宿主侧 /open 路由，面板
+      // 只报条目 id、URL 由宿主从库里取。
+      // 「侧栏播放」在 0.30.1 语义下回归：面板在前台时 openTab 进 pending 队列，
+      // 会话回到前台由 better-sidebar 的 flushPending 落进右侧栏——不是死按钮，
+      // 是异步开；前提是排队语义写在按钮提示与回显里，不让人点了没反应。）
+      link ? Section({
+        title: '原文',
+        children: [
+          vnode('p', {}, [vnode('a', { className: 'bl-url', href: link, target: '_blank', rel: 'noopener noreferrer' }, [link])]),
+          vnode('div', { className: 'bl-openbtns' }, [
+            vnode('button', { type: 'button', onClick: () => onOpenUrl?.(link, item.id) }, ['浏览器打开']),
+            item.kind === 'video' && embed && sidebar?.available
+              ? vnode('button', {
+                  type: 'button',
+                  title: '在侧栏里播这条，不去平台。面板在前台时它会先排队，切回会话页签自动出现',
+                  onClick: () => {
+                    if (sidebar.open(item.url, item.title)) {
+                      onDone?.({ message: '已请求侧栏播放——右侧栏没立刻出现的话，切回会话页签它会自动开。' })
+                    } else {
+                      onDone?.({ message: '侧栏没接住这条——先在抽屉里播，或者去浏览器打开。' })
+                    }
+                  }
+                }, ['侧栏播放'])
+              : null
+          ].filter(Boolean)),
+          vnode('p', { className: 'bl-note' }, [embed
+            ? '侧栏要是有会话在前台就当场开，否则先排队——切回会话页签它自动出现。'
+            : '这条解析不出嵌入形态，侧栏也播不了；要去系统浏览器就用上面的按钮。'])
+        ]
+      }) : null,
       vnode('p', { className: 'bl-note' }, ['下面两个按钮只调来源权重，不改你的主题词；当前偏移在设置页能看到也能一键归零。'])
     ]),
     note ? vnode('p', { className: 'bl-feedback', role: 'status' }, [note]) : null,

package/src/client/views/player-tab.js

@@ -0,0 +1,33 @@
+/**
+ * 侧栏/工作台里的播放器外壳。与抽屉共用 playerEmbed() 与 playerStage()——
+ * 嵌入正则和舞台标记抄两遍必然漂移。
+ *
+ * 这里只读：不收藏、不调权重、不提供"去浏览器"。侧栏手里只有一条 URL，而宿主的
+ * /open 只认 item_id（URL 一律从库里取），这条守卫不为了侧栏放宽。
+ * 音量/倍速在跨源 iframe 里面，我们够不着——界面上明说用画面里的原播放器控件，
+ * 不摆假滑杆。裁切窗跟容器宽度走（aspect-ratio 16:9），B 站完整页多一层页头偏移，
+ * 让视频面精确填满窗口、控制条完整可见（css.js 的 .bl-stage-* 一族）。
+ */
+import { vnode } from '../vnode.js'
+import { playerEmbed, playerStage } from './drawer.js'
+
+const KIND_LABEL = { bili: 'B 站', youtube: 'YouTube' }
+
+export function PlayerTab({ url, title = '', crop = true }) {
+  const embed = playerEmbed(url)
+  if (!embed) {
+    return vnode('div', { className: 'bl-tab' }, [
+      vnode('p', { className: 'bl-note' }, ['这个地址解析不出嵌入形态，侧栏播不了——回面板抽屉里用「浏览器打开」。'])
+    ])
+  }
+  return vnode('div', { className: 'bl-tab' }, [
+    title ? vnode('p', { className: 'bl-tab-head' }, [
+      vnode('span', { className: 'bl-badge' }, [KIND_LABEL[embed.kind] || '视频']),
+      vnode('span', { className: 'bl-tab-title' }, [title])
+    ]) : null,
+    playerStage(embed, crop),
+    vnode('p', { className: 'bl-note' }, [crop
+      ? '只露播放器本体：推荐流被裁掉，是不想让你顺着刷下去；音量、倍速用画面里的原播放器控件。设置页「裁掉推荐区」关掉就还原完整页。'
+      : '完整页在这里，往下滑会看到平台的推荐流。'])
+  ])
+}

package/src/client/views/settings.js

@@ -67,7 +67,7 @@ export function lastFetchNote(stateSources, id) {
   const s = (stateSources ?? []).find((x) => x.id === id)
   if (!s) return '还没抓过（保存后下一轮才碰它）'
   if (s.ok) return '最近抓取：正常'
-  if (s.error_class === 'needs_login') return '最近抓取：需要重新登录（去「凭据与环境」贴 cookie）'
+  if (s.error_class === 'needs_login') return '最近抓取：需要重新登录（B 站贴 cookie / 小红书扫码，都在「凭据与环境」）'
   return `最近抓取：失败（${s.error_class ?? '未知'}），游标没推进，下轮自动补`
 }
 
@@ -315,6 +315,15 @@ export function PrefsTab({ pref, themesDraft, onThemesDraft, redlinesDraft, onRe
     vnode('h4', {}, ['判断开关']),
     flag('require_theme_hit', '没有命中任何主题组的条目直接丢弃', '关掉后全靠预筛分与源权重，条目会多很多', pref?.require_theme_hit),
     flag('inject_prompt', '每轮把待判清单注入会话（判断轮的触发器）', '关掉能省一点上下文', pref?.inject_prompt),
+    // 正文补抓（M8）：RSS 只给摘要，开着就会回原文抓正文。关掉 = 文章永远只有 feed 给的那一句话，
+    // 面板里的「抓取正文」按钮仍能手动点（那是按条目单次触发，不受这个开关管）。
+    flag('fulltext', '文章只有摘要时，回原文抓一次正文', '关掉就不抓：文章只剩 feed 给的那一句，且不会有任何额外请求', pref?.fulltext),
+
+    // 侧栏播放（M7）：这两个开关只在装了 dsh-better-sidebar 的机器上有实际效果，
+    // 没装就是不注册侧栏 tab、面板照旧——界面上要说清，别让人以为关了它就能装出功能。
+    vnode('h4', {}, ['侧栏播放（需要 dsh-better-sidebar）']),
+    flag('sidebar_takeover', '会话里点 B 站 / YouTube 链接时，落进侧栏播放而不是系统浏览器', '关掉后这些链接照旧开去系统浏览器；侧栏 tab 本身还在，抽屉里的「侧栏播放」仍可用', pref?.sidebar_takeover),
+    flag('sidebar_crop', '侧栏播 B 站时裁掉下面的相关推荐', '平台改版导致裁切错位、把播放控制条也遮住了，就用这个还原完整页', pref?.sidebar_crop),
 
     vnode('h4', {}, ['章程（charter）']),
     Field({
@@ -347,7 +356,7 @@ export function PrefsTab({ pref, themesDraft, onThemesDraft, redlinesDraft, onRe
 /* ---------------- 页签三：凭据与环境 ---------------- */
 
 export function CredsTab({ cred, env, cookieDraft = '', onCookieDraft, onCookieSubmit,
-  diagText = null, onCopyDiag, busy = false }) {
+  diagText = null, onCopyDiag, busy = false, xhs = null, xhsQr = null, onXhsQr, onXhsStatus }) {
   const bili = cred?.bili
   const cookieStatus = bili == null
     ? 'B 站 cookie：状态还没读到'
@@ -362,6 +371,13 @@ export function CredsTab({ cred, env, cookieDraft = '', onCookieDraft, onCookieS
       `库大小：${fmtBytes(env.db_bytes)}`,
       `家目录：${env.home_writable === false ? '不可写（检查磁盘权限）' : '可写'}`
     ]
+  const xhsLine = xhs == null
+    ? '小红书：状态还没读到（点「刷新登录状态」，首次会拉起 MCP 子进程）'
+    : !xhs.configured
+      ? '小红书：MCP 未配置（preference.yaml 的 xhs.mcp_path 为空，通道不启用）'
+      : xhs.loggedIn
+        ? `小红书：已登录（${xhs.username || '用户名未知'}）`
+        : `小红书：未登录——${xhs.text || '点「扫码登录」'}`
   return vnode('div', { className: 'bl-setblock' }, [
     vnode('h4', {}, ['B 站凭据']),
     vnode('p', { className: 'bl-kv' }, [cookieStatus]),
@@ -376,9 +392,17 @@ export function CredsTab({ cred, env, cookieDraft = '', onCookieDraft, onCookieS
         SaveBtn({ text: '写入 cookie', disabled: busy || !String(cookieDraft).trim(), onClick: () => onCookieSubmit?.(cookieDraft) })
       ]
     }),
+    vnode('h4', {}, ['小红书（实验接入）']),
+    vnode('p', { className: 'bl-kv' }, [xhsLine]),
+    vnode('div', { className: 'bl-setrow' }, [
+      vnode('button', { type: 'button', className: 'bl-setsave', disabled: busy || undefined, onClick: () => onXhsQr?.() },
+        ['扫码登录（弹二维码，两分钟内有效）']),
+      vnode('button', { type: 'button', disabled: busy || undefined, onClick: () => onXhsStatus?.() },
+        ['刷新登录状态'])
+    ]),
+    xhsQr ? vnode('img', { src: xhsQr, className: 'bl-xhsqr', alt: '小红书登录二维码，用小红书 App 扫码' }) : null,
     vnode('h4', {}, ['环境']),
     vnode('ul', { className: 'bl-kv' }, envLines.map((l, i) => vnode('li', { key: i }, [l]))),
-    vnode('p', { className: 'bl-empty' }, ['小红书：未接入']),
     vnode('p', { className: 'bl-empty' }, ['转写依赖：未实现（随 ASR 一起）']),
     vnode('h4', {}, ['诊断']),
     vnode('div', { className: 'bl-setrow' }, [

package/src/client/views/today.js

@@ -19,7 +19,7 @@ export const REASONS_READABLE = GAP_LABELS
 const n = (v) => Number(v) || 0
 import { vnode } from '../vnode.js'
 import { reasonOf } from '../match.js'
-import { fmtDuration, judgeHint } from '../format.js'
+import { fmtDuration, judgeHint, thumbSrc } from '../format.js'
 
 /** 一轮的结局 → 面板上的说法。'interrupted' 是进程被打断，不是抓取失败，得单独说。 */
 const RUN_LABELS = {
@@ -64,7 +64,10 @@ function sourceIssues(state) {
 
 function Card({ item, onOpen }) {
   return vnode('button', { type: 'button', className: 'bl-card', onClick: () => onOpen?.(item.id) }, [
-    item.kind === 'video' ? vnode('span', { className: 'bl-thumb' }, [vnode('span', { className: 'bl-dur' }, [fmtDuration(item.duration_sec) || '—'])]) : null,
+    item.kind === 'video' ? vnode('span', { className: 'bl-thumb' }, [
+      thumbSrc(item.thumb) ? vnode('img', { src: thumbSrc(item.thumb), alt: '', loading: 'lazy' }) : null,
+      vnode('span', { className: 'bl-dur' }, [fmtDuration(item.duration_sec) || '—'])
+    ].filter(Boolean)) : null,
     vnode('span', { className: 'bl-card-title' }, [item.title || '（无标题）']),
     vnode('span', { className: 'bl-card-meta' }, [item.source_id, item.kind === 'note' ? '图文笔记' : item.kind === 'video' ? '视频' : '文章']),
     vnode('span', { className: 'bl-tier' }, [item.verdict_tier ? `已判：${item.verdict_tier}` : '待判']),

package/src/client/views/video.js

@@ -5,7 +5,8 @@
  */
 import { vnode } from '../vnode.js'
 import { reasonOf } from '../match.js'
-import { fmtDuration } from '../format.js'
+import { playerEmbed } from './drawer.js'
+import { fmtDuration, thumbSrc } from '../format.js'
 
 export const TIER_LABELS = { '值得看': 'good', '可以看': 'ok', '不值当': 'bad' }
 const STATE_LABELS = {
@@ -35,7 +36,10 @@ function Picker({ label, filterKey, view, options, value, onFilter }) {
 
 function VideoCard({ item, onOpen }) {
   return vnode('button', { type: 'button', className: 'bl-card', key: item.id, onClick: () => onOpen?.(item.id) }, [
-    vnode('span', { className: 'bl-thumb' }, [vnode('span', { className: 'bl-dur' }, [fmtDuration(item.duration_sec) || '—'])]),
+    vnode('span', { className: 'bl-thumb' }, [
+      thumbSrc(item.thumb) ? vnode('img', { src: thumbSrc(item.thumb), alt: '', loading: 'lazy' }) : null,
+      vnode('span', { className: 'bl-dur' }, [fmtDuration(item.duration_sec) || '—'])
+    ].filter(Boolean)),
     vnode('span', { className: 'bl-card-title' }, [item.title || '（无标题）']),
     vnode('span', { className: 'bl-card-meta' }, [
       item.author || item.source_id,
@@ -43,9 +47,9 @@ function VideoCard({ item, onOpen }) {
     ]),
     vnode('span', { className: 'bl-tier' }, [item.verdict_tier ? `${item.verdict_tier}：${item.verdict_why || '（这条没写理由）'}` : '待判']),
     vnode('span', { className: 'bl-why' }, [reasonOf(item)]),
-    // M4a 裁定：内嵌播放器 V5 才评估，哪个平台都还没法在抽屉里播——卡片统一只说跳转，
-    // 不许再对 B 站单独许诺"可在抽屉内播"（抽屉的能力边界同一时刻在说反话）。
-    vnode('span', { className: 'bl-play' }, ['只能跳转'])
+    // 尾标必须与抽屉的能力边界一致：能解析出嵌入形态的（B 站 BV / YouTube）就是"抽屉里能播"，
+    // 解析不出的（b23.tv 短链、别的平台）才写"只能跳转"。
+    vnode('span', { className: 'bl-play' }, [playerEmbed(item.url) ? '抽屉里能播' : '只能跳转'])
   ])
 }
 

package/tools/build-client.mjs

@@ -21,7 +21,8 @@ const OUT = path.join(ROOT, 'client.js')
 
 /** 顺序有意义：状态与取数在前，视图在后，装配（_footer）最后。加视图往这里追加。 */
 export const PARTS = ['view-state.js', 'view-api.js', 'vnode.js', 'match.js', 'format.js', 'css.js',
-  'views/shell.js', 'views/today.js', 'views/video.js', 'views/article.js', 'views/digest.js', 'views/library.js', 'views/drawer.js', 'views/collections.js', 'views/settings.js']
+  'views/shell.js', 'views/today.js', 'views/video.js', 'views/article.js', 'views/digest.js', 'views/library.js', 'views/drawer.js', 'views/collections.js', 'views/settings.js',
+  'views/player-tab.js', 'sidebar-tab.js']
 
 const HEADER = fs.readFileSync(path.join(ROOT, 'src', 'client', '_header.txt'), 'utf8')
 const FOOTER = fs.readFileSync(path.join(ROOT, 'src', 'client', '_footer.txt'), 'utf8')

package/tools/client-loader.mjs

@@ -49,7 +49,7 @@ function requireModule(name) {
   throw new Error(`桩里没有这个模块：${name}`)
 }
 
-export function makeStubs({ storage = {}, fetchImpl } = {}) {
+export function makeStubs({ storage = {}, fetchImpl, services = {} } = {}) {
   const store = { ...storage }
   const registered = []
   const injected = []
@@ -89,12 +89,13 @@ export function makeStubs({ storage = {}, fetchImpl } = {}) {
     const target = {
       get: (name) => {
         if (!set.has(name)) throw new Error(`cannot get service "${name}" without inject`)
-        return name === 'slots' ? slots : undefined
+        return name === 'slots' ? slots : services[name]
       },
       provide: () => {},
       on: () => {},
       effect: (fn) => fn(),
-      slots
+      slots,
+      ...services
     }
     return new Proxy(target, {
       get(t, prop) {

package/tools/preview.mjs

@@ -25,6 +25,7 @@ import { LibraryView } from '../src/client/views/library.js'
 import { CollectionsView } from '../src/client/views/collections.js'
 import { SettingsPage } from '../src/client/views/settings.js'
 import { Drawer } from '../src/client/views/drawer.js'
+import { PlayerTab } from '../src/client/views/player-tab.js'
 import { previewState, previewItems, previewFolders, previewPreference, previewCred, previewEnv } from '../test/fixtures/preview-data.js'
 
 const ROOT = path.join(path.dirname(fileURLToPath(import.meta.url)), '..')
@@ -129,14 +130,30 @@ export function renderPreview({ outDir = path.join(ROOT, 'out'), empty = false }
   const items = empty ? [] : previewItems
   const live = items.filter((i) => i.status !== 'archived')
   const drawerItem = items[0] ?? null
+  // 抽屉页专门换一条可嵌入的 B 站地址：内嵌播放器、「侧栏播放」按钮、原文段的排队说明
+  // 都只有可嵌入形态才出场——预览要看的就是它们的真实长相。
+  const drawerVideo = drawerItem ? { ...drawerItem, kind: 'video', source_id: 'bili', url: 'https://www.bilibili.com/video/BV1GJ411x7h7', duration_sec: 1102 } : null
   // 空态传空夹表：抽屉走"没有夹列表"那一支，收藏页走"读不到夹"那一支——诚实的缺席也要演一遍。
   const folders = empty ? [] : previewFolders
-  const drawer = drawerItem
-    ? Drawer({ item: drawerItem, api: {}, folders, note: empty ? '' : 'demo-longform 权重 +0.1——只改 tuning，你的 themes 一个字没动' })
+  const drawer = drawerVideo
+    ? Drawer({ item: drawerVideo, api: {}, folders, note: empty ? '' : 'demo-longform 权重 +0.1——只改 tuning，你的 themes 一个字没动', onOpenUrl: () => {}, sidebar: { available: true, open: () => true } })
     : Drawer({ item: null, api: {}, folders })
   const pages = {
     today: both(shell({ view: 'today', state, body: TodayView({ state, items: live, onRun: () => {}, onOpen: () => {}, onPickView: () => {} }) })),
     video: both(shell({ view: 'video', state, body: VideoView({ state, items, filters: empty ? {} : { tier: '' } }) })),
+    // 侧栏播放（M7）：裁切默认、关掉裁切、解析不出嵌入形态三种状态同屏对比。
+    // 这里给的是真 URL——裁切窗跟容器宽度走（aspect-ratio），B 站页头偏移是否对齐、
+    // 控制条（音量）完不完整，只能靠眼睛看，不能靠想。第三个容器故意给窄宽度演侧栏实况。
+    player: both(shell({
+      view: 'video',
+      state,
+      body: vnode('div', {}, [
+        PlayerTab({ url: 'https://www.bilibili.com/video/BV1GJ411x7h7', title: 'B 站完整页 · 版心缩放 + 页头偏移，窗口只剩视频面', crop: true }),
+        PlayerTab({ url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ', title: 'YouTube embed · 裁切（rel=0，播完不出相关视频）', crop: true }),
+        PlayerTab({ url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ', title: 'YouTube embed · 关掉裁切的样子', crop: false }),
+        PlayerTab({ url: 'https://b23.tv/abc', title: '短链 · 解析不出嵌入形态那一支' })
+      ])
+    })),
     article: both(shell({ view: 'article', state, body: ArticleView({ state, items, filters: {}, selectedId: items[4] ? items[4].id : null }) })),
     collections: both(shell({
       view: 'collections',