react-matrix-tree - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/cjs/components/App.d.ts

@@ -17,4 +17,5 @@ /// <reference types="react" />
     isMobile: boolean;
+    color: string;
 };
-declare const Tree: ({ data, isMobile }: Props) => JSX.Element;
+declare const Tree: ({ data, isMobile, color }: Props) => JSX.Element;
 export default Tree;

dist/cjs/components/App.js

@@ -6,7 +6,4 @@ "use strict";
 var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-//
-var BottomArrow = (0, styled_components_1.default)('div')({
-    borderBottom: "5px solid ".concat(function (props) { return props.color; }),
-});
-var BottomArrowDownContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"], ["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"])));
+var BottomArrow = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  borderbottom: 5px solid ", ";\n"], ["\n  borderbottom: 5px solid ", ";\n"])), function (props) { return props.color; });
+var BottomArrowDownContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"], ["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"])));
 var TopArrowUpContainer = (0, styled_components_1.default)('div')({
@@ -16,4 +13,4 @@ display: 'flex',
 });
-var BottomArrowDown = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"])));
-var TopArrowUp = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"])));
+var BottomArrowDown = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"])));
+var TopArrowUp = styled_components_1.default.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"])));
 var Tooltiptype;
@@ -25,3 +22,3 @@ (function (Tooltiptype) {
 var Tree = function (_a) {
-    var data = _a.data, isMobile = _a.isMobile;
+    var data = _a.data, isMobile = _a.isMobile, color = _a.color;
     (0, react_1.useEffect)(function () {
@@ -50,3 +47,3 @@ if (!data) {
                             react_1.default.createElement(TopArrowUp, null)),
-                        react_1.default.createElement(BottomArrow, { color: '#6a0136' }),
+                        react_1.default.createElement(BottomArrow, { color: color }),
                         react_1.default.createElement(BottomArrowDownContainer, null, e.data.map(function (e1) {
@@ -61,3 +58,3 @@ return react_1.default.createElement(BottomArrowDown, { key: e1.title });
 exports.default = Tree;
-var templateObject_1, templateObject_2, templateObject_3;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 //# sourceMappingURL=App.js.map

dist/esm/components/App.d.ts

@@ -17,4 +17,5 @@ /// <reference types="react" />
     isMobile: boolean;
+    color: string;
 };
-declare const Tree: ({ data, isMobile }: Props) => JSX.Element;
+declare const Tree: ({ data, isMobile, color }: Props) => JSX.Element;
 export default Tree;

dist/esm/components/App.js

 import { __makeTemplateObject } from "tslib";
 import React, { useEffect } from 'react';
 import styled from 'styled-components';
-//
-var BottomArrow = styled('div')({
-    borderBottom: "5px solid ".concat(function (props) { return props.color; }),
-});
-var BottomArrowDownContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"], ["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"])));
+var BottomArrow = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  borderbottom: 5px solid ", ";\n"], ["\n  borderbottom: 5px solid ", ";\n"])), function (props) { return props.color; });
+var BottomArrowDownContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"], ["\n  display: flex,\n  justify-content: space-between,\n  &:last-child{\n    margin-right: -19px;\n    margin-left: auto;\n  }\n"])));
 var TopArrowUpContainer = styled('div')({
@@ -13,4 +10,4 @@ display: 'flex',
 });
-var BottomArrowDown = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"])));
-var TopArrowUp = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"])));
+var BottomArrowDown = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  margin-left: -19px;\n  border-top: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-top: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -2px;\n    margin-bottom: 14px;\n    position: absolute;\n    bottom: 100%;\n    right: 50%;\n  }\n"])));
+var TopArrowUp = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"], ["\n  content: '';\n  width: 0;\n  height: 0;\n  border-bottom: 15px solid #6a0136;\n  border-left: 20px solid transparent;\n  border-right: 20px solid transparent;\n  margin-bottom: 20px;\n  position: relative;\n  &:before {\n    content: '';\n    width: 4px;\n    height: 25px;\n    background: #6a0136;\n    margin-right: -3px;\n    margin-top: 14px;\n    position: absolute;\n    top: 100%;\n    right: 50%;\n  }\n"])));
 var Tooltiptype;
@@ -22,3 +19,3 @@ (function (Tooltiptype) {
 var Tree = function (_a) {
-    var data = _a.data, isMobile = _a.isMobile;
+    var data = _a.data, isMobile = _a.isMobile, color = _a.color;
     useEffect(function () {
@@ -47,3 +44,3 @@ if (!data) {
                             React.createElement(TopArrowUp, null)),
-                        React.createElement(BottomArrow, { color: '#6a0136' }),
+                        React.createElement(BottomArrow, { color: color }),
                         React.createElement(BottomArrowDownContainer, null, e.data.map(function (e1) {
@@ -58,3 +55,3 @@ return React.createElement(BottomArrowDown, { key: e1.title });
 export default Tree;
-var templateObject_1, templateObject_2, templateObject_3;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 //# sourceMappingURL=App.js.map

package.json

 {
   "name": "react-matrix-tree",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "",
@@ -5,0 +5,0 @@ "main": "./dist/cjs/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21630

increased by1.36%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Lines of code

171

decreased by-2.29%

No dependency changes