{"analyzedAt":"2023-01-09T11:06:32.196Z","collected":{"metadata":{"name":"@yozora/react-code-renderer-graphviz","scope":"yozora","version":"2.2.2","description":"render graphviz (dot) code","keywords":["mdast node renderer","graphviz renderer"],"date":"2023-01-09T10:58:01.283Z","author":{"name":"guanghechen","url":"https://github.com/guanghechen/"},"publisher":{"username":"lemonclown","email":"me.guanghechen@gmail.com"},"maintainers":[{"username":"lemonclown","email":"me.guanghechen@gmail.com"}],"repository":{"type":"git","url":"git+https://github.com/yozorajs/yozora-react.git","directory":"packages/react-code-renderer-graphviz"},"links":{"npm":"https://www.npmjs.com/package/%40yozora%2Freact-code-renderer-graphviz","homepage":"https://github.com/yozorajs/yozora-react/tree/release-2.x.x/packages/react-code-renderer-graphviz#readme","repository":"https://github.com/yozorajs/yozora-react","bugs":"https://github.com/yozorajs/yozora-react/issues"},"license":"MIT","dependencies":{"@types/d3-graphviz":"^2.6.7","d3-graphviz":"^2.6.1"},"peerDependencies":{"prop-types":"^15.7.2","react":">= 17.0.0"},"releases":[{"from":"2022-12-10T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":2},{"from":"2022-10-11T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":10},{"from":"2022-07-13T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":10},{"from":"2022-01-09T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":18},{"from":"2021-01-09T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":47}],"hasTestScript":true,"hasSelectiveFiles":true,"readme":"
\n

\n @yozora/react-code-renderer-graphviz\n

\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n
\n
\n\nThis package is designed to render graphviz (dot) in react, inspired by [graphviz-react][]. \n\n\n## Install\n\n* npm\n\n ```bash\n npm install --save @yozora/react-code-renderer-graphviz\n ```\n\n* yarn\n\n ```bash\n yarn add @yozora/react-code-renderer-graphviz\n ```\n\n## Usage\n\n* Basic:\n\n ```tsx\n import React from 'react'\n import GraphvizRenderer from '@yozora/react-code-renderer-graphviz'\n\n const code = `\n digraph finite_state_machine {\n rankdir=LR;\n size=\"8,5\"\n node [shape = doublecircle]; 0 3 4 8;\n node [shape = circle];\n 0 -> 2 [label = \"SS(B)\"];\n 0 -> 1 [label = \"SS(S)\"];\n 1 -> 3 [label = \"S($end)\"];\n 2 -> 6 [label = \"SS(b)\"];\n 2 -> 5 [label = \"SS(a)\"];\n 2 -> 4 [label = \"S(A)\"];\n 5 -> 7 [label = \"S(b)\"];\n 5 -> 5 [label = \"S(a)\"];\n 6 -> 6 [label = \"S(b)\"];\n 6 -> 5 [label = \"S(a)\"];\n 7 -> 8 [label = \"S(b)\"];\n 7 -> 5 [label = \"S(a)\"];\n 8 -> 6 [label = \"S(b)\"];\n 8 -> 5 [label = \"S(a)\"];\n }\n `\n \n ```\n\n* Custom error handler:\n\n ```tsx\n import React from 'react'\n import GraphvizRenderer from '@yozora/react-code-renderer-graphviz'\n\n function JsxPreview(props: { code: string, inline: boolean }) {\n const [error, setError] = React.useState(null)\n return (\n
\n \n 
{ error }
\n
\n )\n }\n ```\n\n### Props\n\nName | Type | Required | Default | Description\n:----------:|:---------------------------------:|:---------:|:-----------:|:-------------\n`className` | `string` | `false` | - | Root css class\n`code` | `string` | `true` | - | Source code\n`engine` | `string` | `false` | `dot` | Source code\n`onError` | `(error: string | null) => void` | `true` | - | Error callback\n`options` | `GraphvizOptions` | `false` | See below | Options passed to `ds-graphviz.options()`\n\n* `className`: The root element of this component will always bind with the\n CSS class `'yozora-code-renderer-graphviz'`.\n\n* `engine`: Sets the Graphviz layout engine name to the specified engine string.\n\n - type: `'circo' | 'dot' | 'fdp' | 'neato' | 'osage' | 'patchwork' | 'twopi'`\n - default: `dot`\n\n* `options`: The default options is \n\n ```typescript\n {\n fit: true,\n zoom: false,\n }\n ```\n\n\n## Related\n\n* [graphviz-react][]\n\n\n[graphviz-react]: https://github.com/DomParfitt/graphviz-react"},"npm":{"downloads":[{"from":"2023-01-08T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":53},{"from":"2023-01-02T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":158},{"from":"2022-12-10T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":276},{"from":"2022-10-11T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":1135},{"from":"2022-07-13T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":1604},{"from":"2022-01-09T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":2465}],"starsCount":0},"github":{"starsCount":7,"forksCount":0,"subscribersCount":2,"issues":{"count":1,"openCount":0,"distribution":{"3600":0,"10800":0,"32400":0,"97200":0,"291600":0,"874800":0,"2624400":0,"7873200":1,"23619600":0,"70858800":0,"212576400":0},"isDisabled":false},"contributors":[{"username":"guanghechen","commitsCount":515},{"username":"lemon-clown","commitsCount":101}],"commits":[{"from":"2023-01-02T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":4},{"from":"2022-12-10T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":13},{"from":"2022-10-11T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":39},{"from":"2022-07-13T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":53},{"from":"2022-01-09T00:00:00.000Z","to":"2023-01-09T00:00:00.000Z","count":109}]},"source":{"files":{"readmeSize":4523,"testsSize":2320,"hasChangelog":true},"badges":[{"urls":{"original":"https://img.shields.io/npm/v/@yozora/react-code-renderer-graphviz.svg","shields":"https://img.shields.io/npm/v/@yozora/react-code-renderer-graphviz.svg","content":"https://img.shields.io/npm/v/@yozora/react-code-renderer-graphviz.json"},"info":{"service":"npm","type":"version","modifiers":{"type":"v"}}},{"urls":{"original":"https://img.shields.io/npm/dm/@yozora/react-code-renderer-graphviz.svg","shields":"https://img.shields.io/npm/dm/@yozora/react-code-renderer-graphviz.svg","content":"https://img.shields.io/npm/dm/@yozora/react-code-renderer-graphviz.json"},"info":{"service":"npm","type":"downloads","modifiers":{"type":"dm"}}},{"urls":{"original":"https://img.shields.io/npm/l/@yozora/react-code-renderer-graphviz.svg","shields":"https://img.shields.io/npm/l/@yozora/react-code-renderer-graphviz.svg","content":"https://img.shields.io/npm/l/@yozora/react-code-renderer-graphviz.json"},"info":{"service":"npm","type":"license","modifiers":{"type":"l"}}}],"linters":["editorconfig","eslint","prettier"],"outdatedDependencies":{"d3-graphviz":{"required":"^2.6.1","stable":"5.0.2","latest":"5.0.2"}}}},"evaluation":{"quality":{"carefulness":0.9999999999999999,"tests":0.6,"health":0.75,"branding":0.44999999999999996},"popularity":{"communityInterest":11,"downloadsCount":378.3333333333333,"downloadsAcceleration":1.1510654490106544,"dependentsCount":0},"maintenance":{"releasesFrequency":1,"commitsFrequency":1,"openIssues":1,"issuesDistribution":0.9}},"score":{"final":0.6471916472769398,"detail":{"quality":0.9364106332119665,"popularity":0.04651936074280659,"maintenance":0.9999619458667646}}}