react-interface - npm Package Compare versions

Comparing version 0.8.12 to 0.8.13

es/components/Icon/index.js

 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; };
 
-var _templateObject = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n\n  ", " ", " svg {\n    stroke: ", ";\n  }\n"], ["\n  display: inline-block;\n\n  ", " ", " svg {\n    stroke: ", ";\n  }\n"]);
+var _templateObject = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n  ", ";\n  ", ";\n\n  svg {\n    stroke: ", ";\n  }\n"], ["\n  display: inline-block;\n  ", ";\n  ", ";\n\n  svg {\n    stroke: ", ";\n  }\n"]);
 
@@ -5,0 +5,0 @@ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

es/components/Menu/Menu.js

@@ -1,2 +0,2 @@
-var _templateObject = _taggedTemplateLiteralLoose(['\n  background: ', ';\n  box-shadow: ', ';\n  font-family: ', ';\n  padding: .5rem;\n'], ['\n  background: ', ';\n  box-shadow: ', ';\n  font-family: ', ';\n  padding: .5rem;\n']);
+var _templateObject = _taggedTemplateLiteralLoose(['\n  background: ', ';\n  box-shadow: ', ';\n  padding: .5rem;\n'], ['\n  background: ', ';\n  box-shadow: ', ';\n  padding: .5rem;\n']);
 
@@ -8,7 +8,5 @@ function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
 export default styled.ul(_templateObject, function (props) {
-  return props.theme.colors.background;
+  return props.theme['menu.background'];
 }, function (props) {
-  return props.theme.shadow;
-}, function (props) {
-  return props.theme.fonts.primary;
+  return props.theme['menu.shadow'];
 });

es/components/Menu/MenuDivider.js

@@ -8,3 +8,3 @@ var _templateObject = _taggedTemplateLiteralLoose(['\n  border-top: 1px solid ', ';\n  margin: .5rem 7px;\n'], ['\n  border-top: 1px solid ', ';\n  margin: .5rem 7px;\n']);
 export default styled.div(_templateObject, function (props) {
-  return props.theme.colors.border;
+  return props.theme['menu.border.color'];
 });

es/components/Menu/MenuHeader.js

@@ -10,3 +10,3 @@ var _templateObject = _taggedTemplateLiteralLoose(['\n  font-size: ', ';\n  color: ', ';\n  font-weight: bold;\n  padding: .25rem .5rem;\n'], ['\n  font-size: ', ';\n  color: ', ';\n  font-weight: bold;\n  padding: .25rem .5rem;\n']);
 }, function (props) {
-  return props.theme.colors.text;
+  return props.theme['menu.header.color'];
 });

es/components/Menu/MenuItem.js

@@ -1,3 +0,3 @@
-var _templateObject = _taggedTemplateLiteralLoose(['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n'], ['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['\n    background: ', ';\n  '], ['\n    background: ', ';\n  ']),
+var _templateObject = _taggedTemplateLiteralLoose(['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n    color: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n'], ['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n    color: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n']),
+    _templateObject2 = _taggedTemplateLiteralLoose(['\n    background: ', ';\n    color: ', ';\n  '], ['\n    background: ', ';\n    color: ', ';\n  ']),
     _templateObject3 = _taggedTemplateLiteralLoose(['\n    font-size: ', ';\n  '], ['\n    font-size: ', ';\n  ']);
@@ -12,6 +12,10 @@
 }, function (props) {
-  return props.theme.colors.gray;
+  return props.theme['menu.item.hover.background'];
 }, function (props) {
+  return props.theme['menu.item.hover.color'];
+}, function (props) {
   return props.active && css(_templateObject2, function (props) {
-    return props.theme.colors.background;
+    return props.theme['menu.item.active.background'];
+  }, function (props) {
+    return props.theme['menu.item.active.color'];
   });
@@ -18,0 +22,0 @@ }, function (props) {

lib/components/Icon/index.js

@@ -7,3 +7,3 @@ "use strict";
 
-var _templateObject = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n\n  ", " ", " svg {\n    stroke: ", ";\n  }\n"], ["\n  display: inline-block;\n\n  ", " ", " svg {\n    stroke: ", ";\n  }\n"]);
+var _templateObject = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n  ", ";\n  ", ";\n\n  svg {\n    stroke: ", ";\n  }\n"], ["\n  display: inline-block;\n  ", ";\n  ", ";\n\n  svg {\n    stroke: ", ";\n  }\n"]);
 
@@ -10,0 +10,0 @@ var _react = require("react");

lib/components/Menu/Menu.js

@@ -5,3 +5,3 @@ 'use strict';
 
-var _templateObject = _taggedTemplateLiteralLoose(['\n  background: ', ';\n  box-shadow: ', ';\n  font-family: ', ';\n  padding: .5rem;\n'], ['\n  background: ', ';\n  box-shadow: ', ';\n  font-family: ', ';\n  padding: .5rem;\n']);
+var _templateObject = _taggedTemplateLiteralLoose(['\n  background: ', ';\n  box-shadow: ', ';\n  padding: .5rem;\n'], ['\n  background: ', ';\n  box-shadow: ', ';\n  padding: .5rem;\n']);
 
@@ -17,8 +17,6 @@ var _styledComponents = require('styled-components');
 exports.default = _styledComponents2.default.ul(_templateObject, function (props) {
-  return props.theme.colors.background;
+  return props.theme['menu.background'];
 }, function (props) {
-  return props.theme.shadow;
-}, function (props) {
-  return props.theme.fonts.primary;
+  return props.theme['menu.shadow'];
 });
 module.exports = exports['default'];

lib/components/Menu/MenuDivider.js

@@ -16,4 +16,4 @@ 'use strict';
 exports.default = _styledComponents2.default.div(_templateObject, function (props) {
-  return props.theme.colors.border;
+  return props.theme['menu.border.color'];
 });
 module.exports = exports['default'];

lib/components/Menu/MenuHeader.js

@@ -18,4 +18,4 @@ 'use strict';
 }, function (props) {
-  return props.theme.colors.text;
+  return props.theme['menu.header.color'];
 });
 module.exports = exports['default'];

lib/components/Menu/MenuItem.js

@@ -5,4 +5,4 @@ 'use strict';
 
-var _templateObject = _taggedTemplateLiteralLoose(['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n'], ['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['\n    background: ', ';\n  '], ['\n    background: ', ';\n  ']),
+var _templateObject = _taggedTemplateLiteralLoose(['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n    color: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n'], ['\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: normal;\n  display: block;\n  border-radius: 2px;\n  padding: 7px;\n  margin: .1rem 0;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  font-size: ', ';\n  cursor: pointer;\n\n  &:hover {\n    background: ', ';\n    color: ', ';\n  }\n\n  ', '\n\n  ', '\n\n  svg {\n    height: 18px;\n    width: 18px;\n    margin-right: 5px;\n  }\n']),
+    _templateObject2 = _taggedTemplateLiteralLoose(['\n    background: ', ';\n    color: ', ';\n  '], ['\n    background: ', ';\n    color: ', ';\n  ']),
     _templateObject3 = _taggedTemplateLiteralLoose(['\n    font-size: ', ';\n  '], ['\n    font-size: ', ';\n  ']);
@@ -21,6 +21,10 @@
 }, function (props) {
-  return props.theme.colors.gray;
+  return props.theme['menu.item.hover.background'];
 }, function (props) {
+  return props.theme['menu.item.hover.color'];
+}, function (props) {
   return props.active && (0, _styledComponents.css)(_templateObject2, function (props) {
-    return props.theme.colors.background;
+    return props.theme['menu.item.active.background'];
+  }, function (props) {
+    return props.theme['menu.item.active.color'];
   });
@@ -27,0 +31,0 @@ }, function (props) {

package.json

 {
   "name": "react-interface",
-  "version": "0.8.12",
+  "version": "0.8.13",
   "description": "react-interface React component",
@@ -5,0 +5,0 @@ "main": "lib/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

Improved metrics

Total package byte prevSize

86213

increased by0.43%

Lines of code

1758

increased by0.23%

No dependency changes