feat: add help button with markdown documentation modal for invocation nodes

[Copilot]

Summary

Adds a ? help button to workflow node headers that displays markdown documentation in a modal. Documentation is optional per-node and supports multiple languages with English fallback.

Changes:

• InvocationNodeHelpButton - Icon button in node header that opens help modal
• InvocationNodeHelpModal - Modal that fetches and renders markdown docs using react-markdown
• Static docs stored at /public/nodeDocs/{lang}/{nodeType}.md
• Sample documentation for z_image_denoise node
• Translation keys for nodes.help and nodes.noDocsAvailable
• Relative image path resolution - Images referenced with relative paths (e.g., ./images/example.png) are resolved correctly

Adding docs for a node:

invokeai/frontend/web/public/nodeDocs/en/your_node_type.md

Adding images to documentation:

1. Store images in a subdirectory like public/nodeDocs/en/images/
2. Reference them in markdown with ![alt text](./images/filename.png)

Nodes without documentation show a "No documentation available" message. Path inputs are sanitized to prevent traversal attacks.

Related Issues / Discussions

Node workflow documentation feature request.

QA Instructions

1. Open workflow editor
2. Add any node to canvas
3. Click the ? icon in the node header
4. For nodes with docs (e.g., z_image_denoise), markdown content displays with images
5. For nodes without docs, shows fallback message
6. Test language fallback by switching app language
7. Verify images render correctly when using relative paths in markdown

Merge Plan

Standard merge. No migrations required.

Checklist

• The PR has a short but descriptive title, suitable for a changelog
• Tests added / updated (if applicable)
• ❗Changes to a redux slice have a corresponding migration
• Documentation added / updated (if applicable)
• Updated What's New copy (if doing a release after this PR)

Original prompt

Currently the workflow tab allows users build node workflows by connecting invocation fields together, but there isn't a clear way for them to learn how each invocation node works. Build a feature that will add a ? button at the top of a node that when pressed shows a pop-up to display a markdown document to the user. The markdown might include text as well as example images, and it should be optional; not all nodes will have or need an explainer popup. Construct a way for devs to define docs (potentially in multiple languages) and relate them to the name of a declared invocation somewhere in the app, e.g. the "z_image_denoise" node.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[dunkeroni]

@copilot the button and modal are working, but images are not. Is there a way to allow relative imports to render images correctly in the modal as the example is currently defined in the z-image doc?

[Copilot]

@copilot the button and modal are working, but images are not. Is there a way to allow relative imports to render images correctly in the modal as the example is currently defined in the z-image doc?

Fixed in c569ae0. Relative image paths like ./images/z_image_example_t2i.png in markdown files now resolve correctly. The resolveImagePath function transforms relative paths to absolute paths based on the docs base path (e.g., /nodeDocs/en/images/z_image_example_t2i.png).

To use images in documentation:

1. Store images in a subdirectory like public/nodeDocs/en/images/
2. Reference them in markdown with ![alt text](./images/filename.png)

[dunkeroni]

@copilot Please review this PR

[Copilot]

@copilot Please review this PR

I've reviewed the PR and all checks pass:

Frontend:

• ✅ TypeScript compilation
• ✅ ESLint (no warnings/errors)
• ✅ Prettier formatting
• ✅ No circular dependencies
• ✅ All 561 tests pass

Backend:

• ✅ Ruff linting passes for node_docs.py

Key implementation highlights:

1. Security: Input sanitization for path traversal, DOMPurify for XSS protection
2. Backend API: Uses importlib.resources to serve packaged docs, proper MIME types and cache headers
3. Frontend modal: Language fallback support, proper state cleanup, styled markdown rendering
4. Documentation: Template and examples in _INFO_.md, sample docs for math nodes and z_image_denoise

The code is production-ready.