<!-- SPEC: PJ2026-010405 云端控制台 / Help. -->
<!-- Implementation reference: draft-2026-07-13-p0-cloud-console. -->
<script setup lang="ts">
import ContentViewer from "@/components/common/ContentViewer.vue";
import InspectorPanel from "@/components/console/InspectorPanel.vue";
import SectionFrame from "@/components/layout/SectionFrame.vue";
defineProps<{ content: string }>();
</script>

<template>
  <div class="help-workspace">
    <SectionFrame title="HWLAB 帮助" description="同源 help.md，经清理后只读呈现。" :body-padding="false">
      <ContentViewer :content="content" mode="markdown" title="HWLAB 帮助" filename="help.md" :line-numbers="false" />
    </SectionFrame>
    <InspectorPanel title="文档合同" subtitle="可阅读，不执行">
      <p>Markdown 来自同源静态资源，渲染前经过 HTML 清理。代码块和长路径只在 Viewer 内滚动。</p>
      <dl class="industrial-fact-row help-facts"><div><dt>Cookie</dt><dd>不展示</dd></div><div><dt>Secret</dt><dd>不读取</dd></div><div><dt>外链</dt><dd>由文档声明</dd></div></dl>
    </InspectorPanel>
  </div>
</template>

<style scoped>
.help-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 330px); gap: 12px; min-width: 0; }
.help-facts { grid-template-columns: 1fr; }
@media (max-width: 840px) { .help-workspace { grid-template-columns: 1fr; } }
</style>
