Socket
Socket
Sign inDemoInstall

@devsnicket/eunice-renderer

Package Overview
Dependencies
104
Maintainers
1
Versions
30
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 4.5.2 to 4.6.0

getSvgElementForStack/createArrows/test/readTestCaseFile.js

4

dist/getSvgElementForStack/createArrows/index.js

@@ -58,7 +58,7 @@ module.exports = ({

return {
element: createSymbolWithPolygon(createPolygon()),
height: 24,
horizontalMargin,
id,
paddingRight
paddingRight,
symbol: createSymbolWithPolygon(createPolygon())
};

@@ -65,0 +65,0 @@

@@ -34,3 +34,3 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

`g.anonymous>text{font-style:italic}g.parent>rect{fill:none;stroke:gray}g.item>rect{fill:lightgray}g.item>text{text-anchor:middle}g.dependency>text{fill:white;text-anchor:middle}${style}`,
symbols: Object.values(arrows).map(arrow => arrow.element),
symbols: Object.values(arrows).map(arrow => arrow.symbol),
withPrecision

@@ -37,0 +37,0 @@ });

@@ -66,3 +66,2 @@ module.exports =

{
element: createSymbolWithPolygon(createPolygon()),
height: 24,

@@ -72,2 +71,3 @@ horizontalMargin,

paddingRight,
symbol: createSymbolWithPolygon(createPolygon()),
});

@@ -74,0 +74,0 @@

@@ -43,3 +43,3 @@ const

Object.values(arrows)
.map(arrow => arrow.element),
.map(arrow => arrow.symbol),
withPrecision,

@@ -46,0 +46,0 @@ })

@@ -9,4 +9,4 @@ {

"dependencies": {
"@devsnicket/eunice-call-with-process-standard-streams": "1.0.0",
"@devsnicket/eunice-dependency-and-structure": "2.7.0",
"@devsnicket/eunice-call-with-process-standard-streams": "^1.0.0",
"@devsnicket/eunice-dependency-and-structure": "^2.8.0",
"array.prototype.flatmap": "1.2.1",

@@ -27,2 +27,3 @@ "babel-polyfill": "6.26.0",

"@types/react-dom": "16.0.11",
"@types/string-pixel-width": "1.7.0",
"babel-cli": "6.26.0",

@@ -81,3 +82,3 @@ "babel-plugin-transform-object-rest-spread": "6.26.0",

"scripts": {
"all": "npm run spellcheck && npm run lint && npm run build && npm run test",
"all": "npm run spellcheck && npm run lint && npm run typescript && npm run build && npm run test",
"build": "rm -rf dist && npx babel -d dist --ignore dist/*,dist/**/*,node_modules/**/*,**/test/**,test-coverage/**,**/test.js --plugins transform-object-rest-spread -s true . && find -type f -name \"*.d.ts\" ! -path \"./dist/*\" ! -path \"./dist/**/*\" ! -path \"./node_modules/**/*\" -exec cp --parent {} dist \";\"",

@@ -89,3 +90,3 @@ "lint": "npx eslint .",

},
"version": "4.5.2"
"version": "4.6.0"
}

@@ -1,28 +0,37 @@

# Eunice [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgElementForStack/createArrows/testCase.svg?sanitize=true)](Renderer/getSvgElementForStack/createArrows/testcase.svg)
# Eunice ![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgElementForStack/createArrows/test/withUse/testCases/default-height.svg?sanitize=true) Renderer
DevSnicket Eunice is a toolkit based on the premise that unidirectional dependencies can be beneficial to structure and modularity in software. Eunice's approach isn't limited to direct dependencies, but includes indirect dependencies as well.
[try out Eunice on Eunice 🐶🥫](https://devsnicket.github.io/Eunice/renderer/harness.html) ([created with](dogfooding/generate.sh))
[try out Eunice on Eunice 🐶🥫](https://devsnicket.github.io/Eunice) ([created with](dogfooding/generate.sh))
## Renderer
[![NPM](https://img.shields.io/npm/v/@devsnicket/eunice-renderer.svg)](https://www.npmjs.com/package/@devsnicket/eunice-renderer
) [![Build Status](https://travis-ci.org/DevSnicket/eunice-renderer.svg?branch=master)](https://travis-ci.org/DevSnicket/eunice-renderer) [![Coverage Status](https://coveralls.io/repos/github/DevSnicket/eunice-renderer/badge.svg?branch=master&c=1)](https://coveralls.io/github/DevSnicket/eunice-renderer?branch=master) [![Gitter chat](https://badges.gitter.im/devsnicket-eunice/gitter.png)](https://gitter.im/devsnicket-eunice)
[Eunice](https://www.github.com/DevSnicket/Eunice) includes a YAML file format to store dependency and structure, it also includes analyzers to produce this YAML and processors of the YAML.
This package reads dependencies and structure, defined as YAML, and renders them as SVG. The structure can include [stacks](https://github.com/DevSnicket/eunice#stacks) that are [scoped/grouped](https://github.com/DevSnicket/eunice#scopes--groups) into a hierarchy. Dependencies of each item are counted and totals are rendered with the item. Item's can have multiple totals, separated by whether the dependencies counted either match or do not match their stack.
To visualize and explore what's in the YAML files, and to statistically measure how well they match the intended structure, a SVG renderer has been implemented in Javascript. The renderer doesn't use lines between items to show dependencies and instead marks items with counts for each dependency type:
Install using [`npm`](https://www.npmjs.com/package/@devsnicket/eunice-renderer):
```bash
npm install --save-dev @devsnicket/eunice-renderer
```
Or with [`yarn`](https://yarnpkg.com/en/package/@devsnicket/eunice-renderer):
```bash
yarn add --dev @devsnicket/eunice-renderer
```
Instead of rendering dependencies as lines between items each dependency is counted into the following categories:
![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgElementForStack/createArrows/test/withUse/testCases/with-descriptions.svg?sanitize=true)
- matches stack (green down arrow)
- does not match stack (red up arrow)
- is not independent (red horizontal arrow).
- does not match stack (red up arrow)
- is not independent (red horizontal arrow)
[![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgElementForStack/createArrows/testcase.svg?sanitize=true)](Renderer/getSvgElementForStack/createArrows/testcase.svg)
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.
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. <sup>[1]</sup>.
scenario | svg | scenario | svg | scenario | svg
-------- | :-: | -------- | :-: | -------- | :-:
upper depends<br/>upon lower | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/stack/upper-depends-upon-lower/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/stack/upper-depends-upon-lower/.svg) | lower depends<br/>upon upper | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/stack/lower-depends-upon-upper/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/stack/lower-depends-upon-upper/.svg) | interdependent<br/>(stacked) | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/stack/two-interdependent/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/stack/two-interdependent/.svg)
independent | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/two/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/two/.svg) | first depends<br/>upon second | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/independency/first-depends-upon-second/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/independency/first-depends-upon-second/.svg) | interdependent<br/>(not stacked)<sup>[1]</sup> | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/independency/two-interdependent/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/independency/two-interdependent/.svg)
independent | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/two/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/two/.svg) | first depends<br/>upon second | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/independency/first-depends-upon-second/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/independency/first-depends-upon-second/.svg) | interdependent<br/>(not stacked) | [![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/testCases/independency/two-interdependent/.svg?sanitize=true)](Renderer/getSvgForYaml/testCases/independency/two-interdependent/.svg)

@@ -35,3 +44,3 @@ Dependencies within an item are also summarized and rendered inside the item box, below the identifer text.

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.
Items and sub-item can also be opened. Opening an item will show its contents and breadcrumb links for where it is in the hierarchy.

@@ -41,14 +50,1 @@ root > grandparent

[![](https://raw.githubusercontent.com/DevSnicket/eunice-renderer/master/getSvgForYaml/withSubset.testCases/upper-item-depends-upon-lower-item-with-parent.svg?sanitize=true)](Renderer/getSvgForYaml/withSubset.testCases/upper-item-depends-upon-lower-item-with-parent.svg)
>[try out JavaScript &rightarrow; YAML &rightarrow; SVG](https://devsnicket.github.io/Eunice/javascript-analyzer-and-renderer/harness.html)
Install using [`npm`](https://www.npmjs.com/package/@devsnicket/eunice-renderer):
```bash
npm install --save-dev @devsnicket/eunice-renderer
```
Or with [`yarn`](https://yarnpkg.com/en/package/@devsnicket/eunice-renderer):
```bash
yarn add --dev @devsnicket/eunice-renderer
```

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc