{"id":13823798,"url":"https://github.com/dai0304/pegmatite","last_synced_at":"2026-02-19T02:04:55.023Z","repository":{"id":139036331,"uuid":"87994341","full_name":"dai0304/pegmatite","owner":"dai0304","description":"Google Chrome extension that replace PlantUML code blocks into preview images.","archived":false,"fork":false,"pushed_at":"2020-05-28T13:32:52.000Z","size":190,"stargazers_count":121,"open_issues_count":6,"forks_count":50,"subscribers_count":6,"default_branch":"develop","last_synced_at":"2024-11-20T01:33:18.372Z","etag":null,"topics":["chrome-extension","github","markdown","plantuml","uml-diagrams"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dai0304.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-04-12T01:12:23.000Z","updated_at":"2024-06-12T03:27:19.000Z","dependencies_parsed_at":"2024-01-13T16:22:48.078Z","dependency_job_id":"8f334eb0-564a-498b-9e9a-fa4cfcdfa104","html_url":"https://github.com/dai0304/pegmatite","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/dai0304/pegmatite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dai0304%2Fpegmatite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dai0304%2Fpegmatite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dai0304%2Fpegmatite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dai0304%2Fpegmatite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dai0304","download_url":"https://codeload.github.com/dai0304/pegmatite/tar.gz/refs/heads/develop","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dai0304%2Fpegmatite/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264323879,"owners_count":23590757,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chrome-extension","github","markdown","plantuml","uml-diagrams"],"created_at":"2024-08-04T09:00:44.572Z","updated_at":"2026-02-19T02:04:54.983Z","avatar_url":"https://github.com/dai0304.png","language":"JavaScript","readme":"# Pegmatite - Chrome ext to preview PlantUML in markdown\n\nPegmatite is Google Chrome extension that replace PlantUML code blocks into preview images.\n\n[Chrome web store](https://chrome.google.com/webstore/detail/pegmatite/jegkfbnfbfnohncpcfcimepibmhlkldo)\n\n## Summary\n\n| You will see below               | But we see\n| -------------------------------- | -------------\n| ![Code block](images/before.png) | ![UML diagraml](images/after.png)\n\n* This extension is enabled only in the whitelisted sites.\n    * `https://github.com/*`\n    * `https://gist.github.com/*`\n    * `https://gitpitch.com/*`\n    * `https://gitlab.com/*`\n    * `https://bitbucket.org/*`\n    * `https://*.backlog.jp/wiki/*`\n* Replace only code block with lang `uml` and starts with `@start`.\n    * lang `puml` or `plantuml` is also supported.\n* When the element is double-clicked, element will toggle original code block and preview image.\n\n## Sample contents\n\n### Sequence diagram with lang `uml`\n\n```uml\n@startuml\nAlice -\u003e Bob: Authentication Request\nBob --\u003e Alice: Authentication Response\n\nAlice -\u003e Bob: Another authentication Request\nAlice \u003c-- Bob: another authentication Response\n@enduml\n```\n\n### State diagram with lang `puml`\n\n```puml\n@startuml\n[*] --\u003e State1\nState1 --\u003e [*]\nState1 : this is a string\nState1 : this is another string\n\nState1 -\u003e State2\nState2 --\u003e [*]\n@enduml\n```\n\n### Other code blocks\n\nThese cannot preview.\n\n#### Code block without lang `uml`\n\n```\n@startuml\nFoo -\u003e Bar\n@enduml\n```\n\n#### `uml` code block does not starts with `@start`\n\n```uml\nfoo\nbar\nbaz\n```\n\n## Using another PlantUML server\n\nBy default, Pegmatite uses [PlantUML server](https://github.com/plantuml/plantuml-server)\ndeployed to `https://www.plantuml.com/plantuml`.\n\nHowever, if your UML is confidential and you cannot send it to an external server, you can also use any PlantUML server.\nConfiguring \"Base URL\" on the setting page, Pegmatite delegates image generation to this server.\n\nExamples.\n\n* `https://www.plantuml.com/plantuml/img/` (default)\n* `https://www.plantuml.com/plantuml/svg/`\n* `https://any-plantuml-server.example.com:8080/img/`\n\nAlso you can run PlantUML server in localhost using Docker as following command:\n\n```\n$ docker run -d -p 8080:8080 plantuml/plantuml-server\n```\n\nAnd you can specify `http://localhost:8080/img/` as *Base URL*.\n\nNote: To avoid mixed-content, if the *Base URL* is not HTTPS scheme,\ngenerated image is converted to [DATA URI](https://tools.ietf.org/html/rfc2397).\n\n## Contribution\n\n1. Fork ([https://github.com/dai0304/pegmatite/fork](https://github.com/dai0304/pegmatite/fork))\n2. Create a feature branch named like `feature/something_awesome_feature` from `develop` branch\n3. Commit your changes\n4. Rebase your local changes against the `develop` branch\n5. Create new Pull Request\n\n## Author\n\n[Daisuke Miyamoto](https://github.com/dai0304)\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdai0304%2Fpegmatite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdai0304%2Fpegmatite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdai0304%2Fpegmatite/lists"}