Create Rich Text Editor Custom Node
getlago/lago-front
Create a new custom TipTap node for the Rich Text Editor that works in edit mode, on-screen preview, and PDF download.
A skill your agent uses when changing Trilium's built-in PDF viewer — anything under packages/pdfjs-viewer (the code injected into Mozilla's PDF.js viewer: bootstrap.ts, annotations.ts, pages.ts…
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install TriliumNext/Trilium developing-pdf-viewer --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .claude/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .claude/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewerType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install TriliumNext/Trilium developing-pdf-viewer --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .agents/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .agents/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install TriliumNext/Trilium developing-pdf-viewer --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .cursor/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .cursor/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/TriliumNext/Trilium.git --path .claude/skills/developing-pdf-viewer--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install TriliumNext/Trilium developing-pdf-viewer --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .gemini/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .gemini/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install TriliumNext/Trilium developing-pdf-viewerInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .github/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .github/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .github/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install TriliumNext/Trilium developing-pdf-viewer --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TriliumNext/Trilium.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.claude/skills/developing-pdf-viewer .opencode/skills/developing-pdf-viewer && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "developing-pdf-viewer" agent skill from https://github.com/TriliumNext/Trilium/tree/main/.claude/skills/developing-pdf-viewer into .opencode/skills/developing-pdf-viewer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "developing-pdf-viewer", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
developing-pdf-viewerA skill your agent uses when changing Trilium's built-in PDF viewer — anything under packages/pdfjs-viewer (the code injected into Mozilla's PDF.js viewer: bootstrap.ts, annotations.ts, pages.ts…
Developing PDF Viewer is an agent skill from TriliumNext/Trilium. Use when changing Trilium's built-in PDF viewer — anything under packages/pdfjs-viewer (the code injected into Mozilla's PDF.js viewer: bootstrap.ts, annotations.ts, pages.ts, toc.ts, layers.ts, attachments.ts, persistence.ts, editing.ts), the client side that talks to it (apps/client/src/widgets/typewidgets/file/Pdf.tsx, PdfViewer.tsx, the sidebar panels in widgets/sidebar/pdf/), the postMessage protocol between them, PDF links (?page= / ?annotation=), or a bug where the viewer "does not pick up" a change…
Its SKILL.md is about 1.8k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Documents & Office, covering PDF and React components. It works with pnpm. The repository describes itself as: Build your personal knowledge base with Trilium Notes. The licence is AGPL-3.0.
Read from SKILL.md and the folder at commit cac2b4f. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
pnpmFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md. Its commands use pnpm, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Developing PDF Viewer loads about 1.8k tokens when it runs. Until then it costs about 182 tokens; SKILL.md has 815 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from TriliumNext/Trilium at commit cac2b4f, republished under its AGPL-3.0 licence (© TriliumNext). 815 words, ~1,792 tokens.
.claude/skills/developing-pdf-viewer/SKILL.md (or your agent's skills folder).A PDF note renders in an iframe running Mozilla's PDF.js viewer, vendored in
packages/pdfjs-viewer/viewer/ (viewer.mjs, viewer.html, refreshed by pnpm --filter @triliumnext/pdfjs-viewer update-viewer) plus Trilium's own code in packages/pdfjs-viewer/src/,
bundled into web/custom.mjs. The client never imports that code: Pdf.tsx and the viewer talk
only through postMessage.
After any edit under packages/pdfjs-viewer/ (src/, viewer/, scripts/), run the build
before testing anything in an app:
pnpm --filter @triliumnext/pdfjs-viewer buildEvery app serves the built packages/pdfjs-viewer/dist, never the sources: the server in
development (getPdfjsAssetDir() in apps/server/src/routes/assets.ts), desktop, and standalone
(apps/standalone/vite.config.mts). dist is built only by the root prepare script, i.e. on
pnpm install; pnpm server:start and the other *:start scripts do not rebuild it and do not
watch it. Vite hot-reloads the client half of a change while the viewer half stays at whatever was
built last, so a stale dist looks exactly like a bug in the new code — or like a fix that works,
when the old viewer happens to behave. Check the age when in doubt:
ls -l --time-style=+%H:%M packages/pdfjs-viewer/dist/web/custom.mjspnpm --filter @triliumnext/pdfjs-viewer watch rebuilds custom.mjs on
save. Then reload the app page: the iframe loads the viewer afresh with the note.pnpm --filter @triliumnext/pdfjs-viewer e2e) builds before
serving, but reuseExistingServer keeps a harness server that is already running — and its stale
bundle — outside CI.pnpm --filter @triliumnext/pdfjs-viewer test) import the sources directly and
need no build. Green specs therefore say nothing about what an app serves.dist was rebuilt, so the user's running instance
picks it up on reload.pdfjs-viewer-* messages, typed in apps/client/src/types-pdfjs.d.ts
(PdfMessageEvent). Every message carries noteId and ntxId (from the iframe URL, set in
bootstrap.ts), and Pdf.tsx drops any message not addressed to its own note and context,
because every viewer posts to the same parent window.trilium-* messages, posted to iframeRef.current.contentWindow; the viewer
checks event.origin. They are not typed on the viewer side.Pdf.tsx turns the viewer's data into note-context data (toc, pdfPages, pdfAnnotations,
pdfAttachments, pdfLayers), which the right sidebar panels read with useGetContextData().
Write it through publish(), not noteContext.setContextData() — see below.documentloaded and only when the note is editable (bootstrap.ts);
setupPdfAnnotations() runs for read-only PDFs too. The first pdfjs-viewer-annotations
message is the client's signal that the viewer can scroll.NoteDetailWrapper keeps each type widget mounted, hidden, while the pane shows a note of another
type, so a PDF → text note → same PDF round trip reuses the iframe with its document loaded. Two
consequences:
NoteContext.setNote() clears the context data on the way out, and the viewer never sends it
again. Pdf.tsx keeps what it last received per key and republishes it when isVisible turns
true; anything new published while hidden is recorded, not written.isVisible: a hidden viewer throws "offsetParent is not set
-- cannot scroll" and the scroll is lost. noteSwitched reaches the hidden viewer before it is
shown.documentinit and, for pages of unequal size, again after pagesPromise. trackInitialView()
in annotations.ts makes scrollToAnnotation() wait for both.onResize() reapplies an auto,
page-fit or page-width zoom and #setScaleUpdatePages() scrolls to _location, which pdf.js
records in pdfViewer.update() on the next frame's scroll event. A viewer shown again resizes,
often in the same frame as a jump. After a programmatic scroll, call pdfViewer.update() and
scroll instantly, never smoothly.page.getAnnotations(), or annotationStorage.serializable
for what was edited in this session) through pageView.viewport.convertToViewportPoint();
pdf.js 6 has no convertToViewportRectangle().12R); one drawn since the document loaded has an editor id (pdfjs_internal_editor_N) that the
next load does not reuse.| Level | What | Command |
|---|---|---|
| Viewer unit | src/*.spec.ts against real pdf.js and a thin PDFViewerApplication (src/test/viewer_app.ts, fixture PDF in src/test/fixture_pdf.ts) | pnpm --filter @triliumnext/pdfjs-viewer test --run |
| Client unit | Pdf.spec.tsx (the protocol, with PdfViewer mocked), sidebar panel specs | pnpm --filter client test src/widgets/type_widgets/file/Pdf.spec.tsx src/widgets/sidebar/pdf/ |
| Viewer e2e | built bundle + a stub parent (e2e/harness) | pnpm --filter @triliumnext/pdfjs-viewer e2e |
| App | in-memory e2e fixture with Dacia Logan.pdf (oUfFD9lugwiQ) and Layers test.pdf (n7gU3aBDPKd9) | see building-client-ui → references/inspecting-the-running-app.md — rebuild dist first |
A timing bug (a jump undone, a panel empty after navigation) usually passes in a fast headless
run. Instrument the iframe (contentWindow resize listener, PDFViewerApplication.pdfViewer
_location / currentScale, a wrapped postMessage) to read the order of events, then force the
losing order in the repro — for example resize the iframe right after the client posts — before
trusting a fix.
© TriliumNext, AGPL-3.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in .claude/skills/developing-pdf-viewer of TriliumNext/Trilium.
Open the folder on GitHubat commit cac2b4f
Developing PDF Viewer next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Developing PDF Viewer this skillTriliumNext/Trilium | 38k | — | ~1.8k | Automated safety check: Pass | AGPL-3.0 | |
| Create Rich Text Editor Custom Nodegetlago/lago-front | 163 | — | ~2k | Automated safety check: Notes | AGPL-3.0 | |
| Build With SimplepdfSimplePDF/simplepdf-embed | 407 | — | ~7k | Automated safety check: Pass | MIT | |
| React PDFtrailofbits/skills-curated | 512 | — | ~3.1k | Automated safety check: Notes | CC-BY-SA-4.0 | |
| MarkitdownImCa0/just-laws | 781 | 14 repos | ~3.2k | Automated safety check: Notes | MIT | |
| Gzh Designisjiamu/gzh-design-skill | 3.9k | 1 repos | ~2.2k | Automated safety check: Pass | AGPL-3.0 |
getlago/lago-front
Create a new custom TipTap node for the Rich Text Editor that works in edit mode, on-screen preview, and PDF download.
SimplePDF/simplepdf-embed
Integrate SimplePDF into a web application for PDF viewing, editing, filling, signing, programmatic control, AI-agent interaction, human-in-the-loop form prefilling, submissions, webhooks, or…
trailofbits/skills-curated
Generates PDF documents using the React-PDF library (@react-pdf/renderer) with TypeScript and JSX.
ImCa0/just-laws
Convert files and office documents to Markdown. An agent skill from ImCa0/just-laws.
isjiamu/gzh-design-skill
微信公众号文章排版引擎,将 Markdown 转换为可直接粘贴到公众号编辑器的 HTML。主题风格从 references/theme-index.md 注册的自定义主题库中选取,自动章节编号、关键词下划线标记、引言卡片、目录导航、代码块、图片/GIF、作者签名。支持 Markdown / Word(.docx) / PDF / 纯文本输入(非 Markdown…
pierrecomputer/pierre
Guides an agent through using @pierre/diffs to render syntax-highlighted files and diffs, and to build editing and review surfaces in React or plain JavaScript.
TriliumNext/Trilium
A skill your agent uses when cutting, preparing, or debugging a Trilium release — bumping the monorepo version, tagging, or diagnosing a failed "Release" workflow run.
TriliumNext/Trilium
A skill your agent uses when working on the Trilium Electron desktop app (apps/desktop) — adding or changing an electronApi method / IPC channel, touching preload.ts, main.ts, services/window.ts or…
TriliumNext/Trilium
A skill your agent uses when adding a DB migration or a new column/field to a Becca entity in Trilium ("add a migration", "new column on notes/attributes", "ALTER TABLE", "add a field to…
TriliumNext/Trilium
A skill your agent uses when adding, moving, or wiring an internal REST endpoint in Trilium (a new /api/ route) — choosing between a core-shared handler (packages/trilium-core/src/routes/index.ts…
TriliumNext/Trilium
A skill your agent uses when adding, changing, or reviewing an LLM/MCP tool in Trilium (the defineTools definitions under packages/trilium-core/src/services/llm/tools/ —…
TriliumNext/Trilium
Write, extend, and review CKEditor 5 plugins in the Trilium (TriliumNext Notes) monorepo — the rich-text-note editor under packages/ckeditor5, whose plugins live in src/plugins/.
Works with
Categories
A skill your agent uses when changing Trilium's built-in PDF viewer — anything under packages/pdfjs-viewer (the code injected into Mozilla's PDF.js viewer: bootstrap.ts, annotations.ts, pages.ts…. Developing PDF Viewer is an agent skill from TriliumNext/Trilium.
Developing PDF Viewer fits situations like: changing Triliums built-in PDF viewer — anything under packages/pdfjs-viewer (the code injected into Mozillas PDF.js viewer: bootstrap.ts; the client side that talks to it (apps/client/src/widgets/typewidgets/file/Pdf.tsx; the sidebar panels in widgets/sidebar/pdf/); the postMessage protocol between them.
Run `npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a claude-code`. Or copy the skill folder (.claude/skills/developing-pdf-viewer in TriliumNext/Trilium) into .claude/skills/developing-pdf-viewer in your project. Claude Code loads it when a task matches its description.
Run `npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a codex`. Or copy the skill folder (.claude/skills/developing-pdf-viewer in TriliumNext/Trilium) into .agents/skills/developing-pdf-viewer in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add TriliumNext/Trilium --skill developing-pdf-viewer -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/developing-pdf-viewer, .gemini/skills/developing-pdf-viewer, .github/skills/developing-pdf-viewer and .opencode/skills/developing-pdf-viewer in your project.
Going by SKILL.md and its folder, Developing PDF Viewer needs the command-line tools its instructions call (pnpm).
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Developing PDF Viewer is published under the AGPL-3.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 1.8k tokens (SKILL.md is roughly 7.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Developing PDF Viewer: Create Rich Text Editor Custom Node (getlago/lago-front, 163 stars), Build With Simplepdf (SimplePDF/simplepdf-embed, 407 stars), React PDF (trailofbits/skills-curated, 512 stars) and Markitdown (ImCa0/just-laws, 781 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
TriliumNext (a GitHub organization) maintains it in TriliumNext/Trilium, which has 38,248 GitHub stars. The repository holds 22 skills in this directory. The repository was last updated on October 8, 2026.
Source: TriliumNext/Trilium on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.