Visualize, explore and statistically measure how actual dependencies match intendend structure in YAML files generated by analyzers.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
getInteractiveElementsForYaml
getSvgElementForYaml
getSvgForYaml
.devsnicket-eunice-stack.yaml
.eslintignore
.eslintrc.yml
.gitattributes
.gitignore
.npmignore
.npmrc
.travis.yml
LICENSE
README.md
jsconfig.json
package-lock.json
package.json
readTestSvgFile.js

README.md

Eunice

DevSnicket Eunice is a toolkit based on the premise that unidirectional dependencies can be beneficial to structure and modularity in software. Euince's approach isn't limited to direct dependencies, but includes indirect dependencies as well.

try out Eunice on Eunice 🐶🥫 (created with)

Renderer

NPM Build Status Coverage Status Gitter chat

Eunice includes a YAML file format to store dependency and structure, it also includes analyzers to produce this YAML and processors of the YAML.

To visualise and explorer what's in the YAML files, and to statistically measure how well they match the intended structure, a SVG renderer has been implemented. The renderer doesn't use lines between items to show dependencies and instead marks items with counts for each dependency type:

  • matches stack (green down arrow)
  • does not match stack (red up arrow)
  • is not independent (red horizontal arrow).

Dependency counts appear for both sides of the dependency, the dependent item and the item depended upon. When there are multiple counts a summary of all counts is rendered at the bottom. [1].

scenario svg scenario svg scenario svg
upper depends
upon lower
lower depends
upon upper
interdependent
(stacked)
independent first depends
upon second
interdependent
(not stacked)[1]

Dependencies within an item are also summarised and rendered inside the item box, below the identifer text.

scenario svg scenario svg scenario svg
parent depends
upon item
item depends
upon parent
first item
depends upon
second item
(not stacked)

Items and sub-item can also be opened by clicking/tapping on their box. Opening an item will show its contents and breadcrumb links for where it is in the hierarchy.

root > grandparent

try out JavaScript → YAML → SVG

Install using npm:

npm install --save-dev @devsnicket/eunice-renderer

Or with yarn:

yarn add --dev @devsnicket/eunice-renderer