@ bendyline/ docblocks- react 页面存档备份,存于互联网档案馆
DocBlocks的回放组件——完整的编辑器 shell(文件探索器,工作空间拾取器,app菜单,导出管道)外加其从中构建的单个组件和钩子. 这是 DocBlocks 网络应用程序和桌面渲染器的软件包 .
安装
npm install @bendyline/docblocks-react react react-dom
npm install --save-dev @types/react @types/react-dom
同伴依赖性 : 反应出18或19. TypeScript 消费者必须安装
匹配 @types/react 主要(通常情况下) @types/react-dom; 反应类型
pal 是可选的,所以 JavaScript 仅限消费者不需要类型包 。 这个
DocBlocks 核心 (@bendyline/docblocks)和斯奎斯克编辑包是
常规依赖和自动安装.
使用量
import { DocBlocksShell } from '@bendyline/docblocks-react';
import '@bendyline/docblocks-react/styles';
function App() {
return <DocBlocksShell theme="auto" />;
}
视频出口工人使用模块块。 消费者必须保留 docBlocks 站点和桌面渲染器使用的相同工人设置 :
// vite.config.ts
import { defineConfig } from 'vite';
export default defineConfig({ worker: { format: 'es' } });
公式网格可以选择通过单独的IronCalc 引擎进入完整的
已建计算条目。 发布 @ironcalc/wasm/wasm_bg.wasm 以美元计
同一原产地的 URL 并保持厂房的模块范围 这样引擎仍然保留
懒惰且可重复使用 :
import { createDocBlocksCalcEngineFactory } from '@bendyline/docblocks-react/calculation';
const calcEngineFactory = createDocBlocksCalcEngineFactory({
wasmSource: '/ironcalc/wasm_bg.wasm',
});
function App() {
return <DocBlocksShell calcEngineFactory={calcEngineFactory} />;
}
构成部分
DocBlocks谢尔
Cononical DocBlocks体验在一个组件——文件探索者,工作空间取取者,应用菜单,斯奎斯克编辑器及其编辑器/Markdown / Play视图,以及导出管道.
<DocBlocksShell theme="auto" logoUrl="/logo.png" />
theme—— 说'light' | 'dark' | 'auto'(自定义如下)prefers-color-scheme(中文(简体) )logoUrl——应用菜单按钮的品牌标记calcEngineFactory— 可选懒惰计算后端; 使用上面的计算切入点启用 IronCalc 公式ffmpegWasm——可选的同源 ffmpeg 核心 URL;提供它们可以使内置的动画GIF流在跨源同源主机上. 没有第一方水面供应这个. 这个@ffmpeg/coreWebAssembly building is GPL-2.0-or-later,无法与苹果的 App Store 条款相协调,因此从每个 DocBlocks 发行中被移除. 给带自己编码器的主机的道具showCodeCopyButton——在普通被栅栏设置的代码块上显示复制控制(默认:true;美人鱼围栏仍为图表)onCopyCode— 本地主机的可选剪贴板适配器;浏览器主机倒回navigator.clipboard.writeText
存储在字节授权后抽象 FileSystemProviderV2 合同来源 @bendyline/docblocks/filesystem:浏览器-本地(IndexedDB),本地文件夹(File System Access API),瞬间内存工作空间,或Electron主机. 内置相容外观显示为 provider.v2; 第一方 shell 和文件树操作为 v2- 第一位.
文件爆炸器 / 文件端点
文件树浏览器内含创建(文件+文件夹),重命名并删除. 它跟随文件系统 当浏览器表面恢复时,自动监视事件并重新读取可见树. 长 名字轻而易举.
工作空间选择器
工作空间间切换的下拉,创建了新的,并打开了本地文件夹,加上每个工作空间设置对话框(重命名,下载,删除,版本历史覆盖).
AppMenu 软件
左上方带有全应用软件的品牌菜单 设置 对话框(主题首选,全局版本-历史默认),可选“备份所有工作空间”,一个帮助组(键盘快捷键,文档),以及 关于 对话.
导出工具栏控制/ 导出对话框
没有完整的外壳需要出口管道的消费者可以使用 公共、独立建设的切入点:
import {
DEFAULT_OPTIONS,
ExportDialog,
buildExportFilename,
runExport,
} from '@bendyline/docblocks-react/export';
外壳也会溢出 与嵌入的内容共享链接它创造了
边框 #shared(<base64>) URL 包含一个压缩的, 仅由 Markdown 复制件
和可选初始使用模式。 打开 URL 只创建会话
工作空间; 生成的链接在 4,096 个字符后警告, 并封顶于
32,768个人物.
导出流:快速再导出最后一个配置外加全对话框——格式(PDF,Word,PowerPoint,EPUB,HTML,Markdown),可视化主题,和页面大小. 视频导出在WebCodecs所在之处,并使用麻省理工学院的许可证 mp4-muxer. 供应的宿主 ffmpegWasm 附加曝光动画 GIF 有时间、方向、标题、循环和色彩控制;没有第一当事方的表面。 动画GIF仍然可以从CLI和MCP获得,它们使用一个系统FFmpeg 二进制而不是分布式.
渲染出HTML和HTML ZIP导出包括普通被栅栏所设置的代码块的复制控制;美人鱼栅栏仍然是图.
钩子
useDocumentSession(delay?)
对已修订内容具有约束力的反应 DocumentSession积极文档写道,
过渡、冲突和密切准备必须贯穿本届会议;
故意没有独立的自动救生钩.
useFileTree(provider)
文件树状态管理覆盖任何 v2- 能力提供者 —— 返回树, 选择, 和明确的创建/ 移动/ remove 函数, 由外部提供者临时 v1 倒置 .
样式
import '@bendyline/docblocks-react/styles';
一个清晰的样式表导入覆盖了 Squisq 编辑器和全部 DocBlocks 组件 主题。 主题字体由主机应用程序提供;此软件包不捆绑字体.
新UI属于何处
居住在外壳铬(文件树、工作空间拾取器、应用菜单、导出对话框)内的跨地表UI属于这里。 VS代码扩展是故意的例外——它的网页视图上挂着斯奎斯克的 EditorShell 直接因为VS代码提供了文件探索器,工作空间,以及主题本身.
许可证
麻省理工学院