How to Generate Mermaid Diagrams for Claim Trees Using the Patent Disclosure Skill

The handsomestWei/patent-disclosure-skill repository generates Mermaid diagrams for claim trees by passing normalized JSON claim data through the claim_tree_to_mermaid function, which produces markup representing hierarchical patent dependencies as subgraphs and directed edges.

Patent claim visualization requires transforming complex hierarchical relationships into readable visual formats. The handsomestWei/patent-disclosure-skill tool accomplishes this through a pure-Python pipeline that converts structured claim data into Mermaid diagrams for claim trees without relying on external APIs. This implementation leverages local JavaScript rendering to produce publication-ready visuals directly from patent text analysis.

Understanding the Claim Tree Input Structure

The diagram generation process begins with a normalized JSON structure produced by the patent-reader pipeline. This object contains a nodes array where each element represents an individual claim with its metadata and relationships.

Schema Definition

Each claim node in the input JSON must include specific fields that define its identity, content, and hierarchical position. The schema requires integer identifiers for claim numbers, text strings for claim content, and parent references that establish dependency relationships.

• claim: Integer identifier corresponding to the claim number
• text: String containing the full claim text
• parent: Integer referencing the parent claim (or null for independent claims)
• delta: Optional string indicating new or modified content for highlighting

The following example demonstrates a simplified claim tree structure with both independent and dependent claims:

# Example claim-tree JSON (simplified)

claim_tree = {
    "nodes": [
        {"claim": 1, "text": "A device...", "parent": None, "delta": "new"},
        {"claim": 2, "text": "The device of claim 1...", "parent": 1},
        {"claim": 3, "text": "A method...", "parent": None},
    ],
    "roots": [1, 3],
}

Core Conversion Logic in obsidian.py

The primary transformation logic resides in skills/patent-reader/tools/vault/obsidian.py. The claim_tree_to_mermaid function defined around line 190 orchestrates the conversion through a systematic node-processing pipeline.

Extracting Node Metadata

The function iterates over the nodes list to extract each claim's identifier, textual label, and associated delta values. These elements form the foundational data for generating node definitions and annotation labels in the final Mermaid output.

Building Sub-graphs for Independent Claims

Independent claims—those with a null parent value—are automatically encapsulated as separate subgraphs in the Mermaid markup. This architectural decision isolates each claim family visually, allowing independent claims to serve as roots for their respective hierarchical trees.

Mapping Parent-Child Dependencies

For every claim that references a parent via the parent field, the generator creates a directed edge using the syntax parent --> child. This step captures the logical dependency relationships between claims, rendering the claim dependency tree as a directed graph.

Applying Visual Styling

Short delta strings are appended to node labels to highlight new or modified claims. The function also supports optional style directives that apply specific colors or shapes to nodes based on their status, enhancing the visual differentiation between original and modified claim elements.

Local Rendering Architecture

Once the Mermaid markup is generated, the render_mermaid function in skills/patent-disclosure/tools/mermaid_render.py handles the actual image generation. This module operates as a thin Python wrapper around the bundled mermaid.min.js library located in skills/patent-disclosure/tools/vendor/.

The rendering process executes entirely within the local environment using the bundled JavaScript runtime. This approach eliminates external API dependencies and ensures the tool functions offline while maintaining data privacy by processing sensitive patent information locally.

Implementation Example

The following workflow demonstrates the complete process of generating a claim tree diagram from JSON input through final SVG output. This example covers both the markup generation phase and the subsequent rendering step.

First, import the conversion function and generate the Mermaid markup:

from tools.vault.obsidian import claim_tree_to_mermaid

mermaid_code = claim_tree_to_mermaid(claim_tree, pub=False)
print(mermaid_code)

Typical output includes subgraph declarations and directed edges:

graph TD
  subgraph claim_1
    C1["1: A device… (new)"]
  end
  subgraph claim_2
    C2["2: The device of claim 1…"]
  end
  C1 --> C2
  subgraph claim_3
    C3["3: A method…"]
  end

Finally, render the diagram to SVG format:

from tools.mermaid_render import render_mermaid

svg = render_mermaid(mermaid_code)   # Returns an SVG string

# The SVG can be saved or inserted into an Obsidian note.

Summary

• The claim_tree_to_mermaid function in skills/patent-reader/tools/vault/obsidian.py converts JSON claim trees into valid Mermaid markup syntax
• Independent claims generate isolated subgraphs while dependent claims connect to their parents via directed edges (-->)
• The mermaid_render.py module uses the bundled mermaid.min.js library for local SVG/PNG generation without network calls
• Delta annotations and optional style directives provide visual highlighting for modified or new claim content

Frequently Asked Questions

What input format does the claim tree generator require?

The generator expects a normalized JSON object containing a nodes array and a roots list. Each node must specify integer claim and parent fields (with null indicating independent claims), a text string, and an optional delta string for highlighting changes.

How does the tool distinguish between independent and dependent claims?

Independent claims are identified by null parent values and rendered as separate subgraphs in the Mermaid output. Dependent claims receive directed edges connecting them to their specified parent claims, creating the hierarchical tree structure that reflects patent claim dependencies.

Can the generated diagrams be customized with different colors or styles?

Yes, the conversion process supports optional style directives that modify node colors and shapes. The delta field automatically appends text labels to nodes, and the function accepts parameters that inject additional Mermaid style configurations for specific claim types or statuses.

Does the tool require an internet connection to render diagrams?

No, the rendering process is entirely local. The mermaid_render.py module utilizes a bundled mermaid.min.js JavaScript runtime stored in skills/patent-disclosure/tools/vendor/ to generate SVG or PNG outputs without external API calls or network access.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}