@chasemccoy/kit - npm Package Compare versions

Comparing version 0.5.3 to 0.6.0

dist/index.js

@@ -1435,4 +1435,21 @@ 'use strict';
 
+var COMMON = compose(color, space);
+var BORDER = compose(borders, borderColor, boxShadow, borderRadius);
+var TYPOGRAPHY = compose(fontFamily, fontSize, fontWeight, lineHeight, textAlign);
+var LAYOUT = compose(display, size, width, height, minWidth, minHeight, maxWidth, maxHeight, overflow, verticalAlign);
+var POSITION = compose(position, zIndex, top, right, bottom, left);
+var FLEX_CONTAINER = compose(flexBasis, flexDirection, flexWrap, alignContent, alignItems, justifyContent, justifyItems, order);
+var FLEX_ITEM = compose(flex, justifySelf, alignSelf);
+var styles = {
+  COMMON: COMMON,
+  BORDER: BORDER,
+  TYPOGRAPHY: TYPOGRAPHY,
+  LAYOUT: LAYOUT,
+  POSITION: POSITION,
+  FLEX_CONTAINER: FLEX_CONTAINER,
+  FLEX_ITEM: FLEX_ITEM
+};
+
 function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1445,4 +1462,3 @@ _templateObject = function _templateObject() {
 }
-var Box = styled__default.div(_templateObject(), space, width, height, boxShadow, borderRadius, display, justifyContent, alignItems, flexWrap, flex, flexDirection, minHeight, minWidth, maxWidth, color, flexBasis);
-Box.displayName = 'Box';
+var Box = styled__default.div(_templateObject(), COMMON, BORDER, LAYOUT, FLEX_CONTAINER, FLEX_ITEM);
 
@@ -1470,3 +1486,3 @@ function _templateObject3() {
 function _templateObject$1() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  ", "\n\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1479,24 +1495,70 @@ _templateObject$1 = function _templateObject() {
 }
-var Text = styled__default.div(_templateObject$1(), space, color, fontSize, fontWeight, fontFamily, lineHeight, borders, borderColor, textAlign, width, maxWidth, display, function (p) {
+var Text = styled__default.div(_templateObject$1(), function (p) {
   return p.uppercase && styled.css(_templateObject2());
 }, function (p) {
   return p.italic && styled.css(_templateObject3());
-});
-Text.p = Text.withComponent('p');
-Text.span = Text.withComponent('span');
-Text.displayName = 'Text';
+}, COMMON, TYPOGRAPHY, BORDER, LAYOUT);
+
+Text.p = function (props) {
+  return React.createElement(Text, _extends({
+    as: "p"
+  }, props));
+};
+
+Text.span = function (props) {
+  return React.createElement(Text, _extends({
+    as: "span"
+  }, props));
+};
+
 Text.p.displayName = 'Text.p';
 Text.span.displayName = 'Text.span';
 
-var Heading = Text.withComponent('h1');
-Heading.defaultProps = {
-  fontFamily: 'serif'
+var Heading = function Heading(props) {
+  return React.createElement(Text, _extends({
+    as: "h1"
+  }, props));
 };
-Heading.h1 = Heading.withComponent('h1');
-Heading.h2 = Heading.withComponent('h2');
-Heading.h3 = Heading.withComponent('h3');
-Heading.h4 = Heading.withComponent('h4');
-Heading.h5 = Heading.withComponent('h5');
-Heading.h6 = Heading.withComponent('h6');
 
+Heading.h1 = function (props) {
+  return React.createElement(Heading, props);
+};
+
+Heading.h2 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h2"
+  }, props));
+};
+
+Heading.h3 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h3"
+  }, props));
+};
+
+Heading.h4 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h4"
+  }, props));
+};
+
+Heading.h5 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h5"
+  }, props));
+};
+
+Heading.h6 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h6"
+  }, props));
+};
+
+Heading.h1.displayName = 'Heading.h1';
+Heading.h2.displayName = 'Heading.h2';
+Heading.h3.displayName = 'Heading.h3';
+Heading.h4.displayName = 'Heading.h4';
+Heading.h5.displayName = 'Heading.h5';
+Heading.h6.displayName = 'Heading.h6';
+
 function _templateObject$2() {
@@ -1543,3 +1605,3 @@ var data = _taggedTemplateLiteral(["\n\tdisplay: inline-block;\n\tborder: none;\n\tmargin: 0;\n\ttext-decoration: none;\n\tcursor: pointer;\n\ttext-align: left;\n\t-webkit-appearance: none;\n\t-moz-appearance: none;\n\tbackground: none;\n\tpadding: 0;\n\twhite-space: nowrap;\n\ttext-decoration: ", ";\n\n\t&:hover {\n\t\tcolor: ", ";\n\t}\n"]);
 function _templateObject$3() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1556,3 +1618,3 @@ _templateObject$3 = function _templateObject() {
   return props.unstyled && styled.css(_templateObject3$1());
-}, space, display, borders, borderColor);
+}, COMMON, BORDER, LAYOUT);
 
@@ -1652,19 +1714,2 @@ function _templateObject$4() {
 
-var COMMON = compose(color, space);
-var BORDER = compose(borders, borderColor, boxShadow, borderRadius);
-var TYPOGRAPHY = compose(fontFamily, fontSize, fontWeight, lineHeight, textAlign);
-var LAYOUT = compose(display, size, width, height, minWidth, minHeight, maxWidth, maxHeight, overflow, verticalAlign);
-var POSITION = compose(position, zIndex, top, right, bottom, left);
-var FLEX_CONTAINER = compose(flexBasis, flexDirection, flexWrap, alignContent, alignItems, justifyContent, justifyItems, order);
-var FLEX_ITEM = compose(flex, justifySelf, alignSelf);
-var styles = {
-  COMMON: COMMON,
-  BORDER: BORDER,
-  TYPOGRAPHY: TYPOGRAPHY,
-  LAYOUT: LAYOUT,
-  POSITION: POSITION,
-  FLEX_CONTAINER: FLEX_CONTAINER,
-  FLEX_ITEM: FLEX_ITEM
-};
-
 var breakpoints = ['576px', '768px', '1000px', '1300px'];
@@ -1671,0 +1716,0 @@ var namedBreakpoints = {

dist/index.module.js

@@ -1428,4 +1428,21 @@ import styled, { css, createGlobalStyle } from 'styled-components';
 
+var COMMON = compose(color, space);
+var BORDER = compose(borders, borderColor, boxShadow, borderRadius);
+var TYPOGRAPHY = compose(fontFamily, fontSize, fontWeight, lineHeight, textAlign);
+var LAYOUT = compose(display, size, width, height, minWidth, minHeight, maxWidth, maxHeight, overflow, verticalAlign);
+var POSITION = compose(position, zIndex, top, right, bottom, left);
+var FLEX_CONTAINER = compose(flexBasis, flexDirection, flexWrap, alignContent, alignItems, justifyContent, justifyItems, order);
+var FLEX_ITEM = compose(flex, justifySelf, alignSelf);
+var styles = {
+  COMMON: COMMON,
+  BORDER: BORDER,
+  TYPOGRAPHY: TYPOGRAPHY,
+  LAYOUT: LAYOUT,
+  POSITION: POSITION,
+  FLEX_CONTAINER: FLEX_CONTAINER,
+  FLEX_ITEM: FLEX_ITEM
+};
+
 function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1438,4 +1455,3 @@ _templateObject = function _templateObject() {
 }
-var Box = styled.div(_templateObject(), space, width, height, boxShadow, borderRadius, display, justifyContent, alignItems, flexWrap, flex, flexDirection, minHeight, minWidth, maxWidth, color, flexBasis);
-Box.displayName = 'Box';
+var Box = styled.div(_templateObject(), COMMON, BORDER, LAYOUT, FLEX_CONTAINER, FLEX_ITEM);
 
@@ -1463,3 +1479,3 @@ function _templateObject3() {
 function _templateObject$1() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  ", "\n\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1472,24 +1488,70 @@ _templateObject$1 = function _templateObject() {
 }
-var Text = styled.div(_templateObject$1(), space, color, fontSize, fontWeight, fontFamily, lineHeight, borders, borderColor, textAlign, width, maxWidth, display, function (p) {
+var Text = styled.div(_templateObject$1(), function (p) {
   return p.uppercase && css(_templateObject2());
 }, function (p) {
   return p.italic && css(_templateObject3());
-});
-Text.p = Text.withComponent('p');
-Text.span = Text.withComponent('span');
-Text.displayName = 'Text';
+}, COMMON, TYPOGRAPHY, BORDER, LAYOUT);
+
+Text.p = function (props) {
+  return React.createElement(Text, _extends({
+    as: "p"
+  }, props));
+};
+
+Text.span = function (props) {
+  return React.createElement(Text, _extends({
+    as: "span"
+  }, props));
+};
+
 Text.p.displayName = 'Text.p';
 Text.span.displayName = 'Text.span';
 
-var Heading = Text.withComponent('h1');
-Heading.defaultProps = {
-  fontFamily: 'serif'
+var Heading = function Heading(props) {
+  return React.createElement(Text, _extends({
+    as: "h1"
+  }, props));
 };
-Heading.h1 = Heading.withComponent('h1');
-Heading.h2 = Heading.withComponent('h2');
-Heading.h3 = Heading.withComponent('h3');
-Heading.h4 = Heading.withComponent('h4');
-Heading.h5 = Heading.withComponent('h5');
-Heading.h6 = Heading.withComponent('h6');
 
+Heading.h1 = function (props) {
+  return React.createElement(Heading, props);
+};
+
+Heading.h2 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h2"
+  }, props));
+};
+
+Heading.h3 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h3"
+  }, props));
+};
+
+Heading.h4 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h4"
+  }, props));
+};
+
+Heading.h5 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h5"
+  }, props));
+};
+
+Heading.h6 = function (props) {
+  return React.createElement(Heading, _extends({
+    as: "h6"
+  }, props));
+};
+
+Heading.h1.displayName = 'Heading.h1';
+Heading.h2.displayName = 'Heading.h2';
+Heading.h3.displayName = 'Heading.h3';
+Heading.h4.displayName = 'Heading.h4';
+Heading.h5.displayName = 'Heading.h5';
+Heading.h6.displayName = 'Heading.h6';
+
 function _templateObject$2() {
@@ -1536,3 +1598,3 @@ var data = _taggedTemplateLiteral(["\n\tdisplay: inline-block;\n\tborder: none;\n\tmargin: 0;\n\ttext-decoration: none;\n\tcursor: pointer;\n\ttext-align: left;\n\t-webkit-appearance: none;\n\t-moz-appearance: none;\n\tbackground: none;\n\tpadding: 0;\n\twhite-space: nowrap;\n\ttext-decoration: ", ";\n\n\t&:hover {\n\t\tcolor: ", ";\n\t}\n"]);
 function _templateObject$3() {
-  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n"]);
+  var data = _taggedTemplateLiteral(["\n  ", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n"]);
 
@@ -1549,3 +1611,3 @@ _templateObject$3 = function _templateObject() {
   return props.unstyled && css(_templateObject3$1());
-}, space, display, borders, borderColor);
+}, COMMON, BORDER, LAYOUT);
 
@@ -1645,19 +1707,2 @@ function _templateObject$4() {
 
-var COMMON = compose(color, space);
-var BORDER = compose(borders, borderColor, boxShadow, borderRadius);
-var TYPOGRAPHY = compose(fontFamily, fontSize, fontWeight, lineHeight, textAlign);
-var LAYOUT = compose(display, size, width, height, minWidth, minHeight, maxWidth, maxHeight, overflow, verticalAlign);
-var POSITION = compose(position, zIndex, top, right, bottom, left);
-var FLEX_CONTAINER = compose(flexBasis, flexDirection, flexWrap, alignContent, alignItems, justifyContent, justifyItems, order);
-var FLEX_ITEM = compose(flex, justifySelf, alignSelf);
-var styles = {
-  COMMON: COMMON,
-  BORDER: BORDER,
-  TYPOGRAPHY: TYPOGRAPHY,
-  LAYOUT: LAYOUT,
-  POSITION: POSITION,
-  FLEX_CONTAINER: FLEX_CONTAINER,
-  FLEX_ITEM: FLEX_ITEM
-};
-
 var breakpoints = ['576px', '768px', '1000px', '1300px'];
@@ -1664,0 +1709,0 @@ var namedBreakpoints = {

package.json

 {
   "name": "@chasemccoy/kit",
-  "version": "0.5.3",
+  "version": "0.6.0",
   "description": "React component library and development kit. ",
@@ -5,0 +5,0 @@ "main": "dist/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

107335

increased by0.69%

Lines of code

3085

increased by2.32%

No dependency changes