@govuk-react/error-text - npm Package Compare versions

Comparing version 0.5.0 to 0.5.1

es/index.js

@@ -1,3 +0,1 @@
-var _styled;
-
 import styled from 'react-emotion';
@@ -8,3 +6,4 @@ import React from 'react';
 import { withWhiteSpace } from '@govuk-react/hoc';
-import { FONT_SIZE, LINE_HEIGHT, MEDIA_QUERIES, NTA_LIGHT } from '@govuk-react/constants';
+import { SPACING_POINTS } from '@govuk-react/constants';
+import { typography } from '@govuk-react/lib';
 var StyledError =
@@ -15,15 +14,12 @@ /*#__PURE__*/
   label: "StyledError"
-})((_styled = {
+})(typography.font({
+  size: 19,
+  weight: 'bold'
+}), {
   display: 'block',
-  fontFamily: NTA_LIGHT,
-  WebkitFontSmoothing: 'antialiased',
-  MozOsxFontSmoothing: 'grayscale',
-  fontWeight: 700,
-  textTransform: 'none',
-  fontSize: FONT_SIZE.SIZE_16,
-  lineHeight: LINE_HEIGHT.SIZE_16
-}, _styled[MEDIA_QUERIES.LARGESCREEN] = {
-  fontSize: FONT_SIZE.SIZE_19,
-  lineHeight: LINE_HEIGHT.SIZE_19
-}, _styled.color = "" + ERROR_COLOUR, _styled.paddingTop = '4px', _styled.paddingBottom = '2px', _styled));
+  // NB non-responsive spacing
+  marginBottom: SPACING_POINTS[3],
+  clear: 'both',
+  color: ERROR_COLOUR
+});
 /**
@@ -36,7 +32,7 @@ *
  * ```jsx
- * <ErrorText errorText="example">Example</ErrorText>
+ * <ErrorText>Example</ErrorText>
  * ```
  *
  * ### References
- * - https://github.com/alphagov/govuk-frontend/tree/master/src/components
+ * - https://github.com/alphagov/govuk-frontend/blob/master/src/components/error-message/_error-message.scss
  */
@@ -48,5 +44,3 @@
 
-export default withWhiteSpace({
-  marginBottom: 0
-})(ErrorText);
+export default withWhiteSpace()(ErrorText);
 //# sourceMappingURL=index.js.map

lib/index.js

@@ -18,3 +18,3 @@ "use strict";
 
-var _styled;
+var _lib = require("@govuk-react/lib");
 
@@ -28,15 +28,12 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
   label: "StyledError"
-})((_styled = {
+})(_lib.typography.font({
+  size: 19,
+  weight: 'bold'
+}), {
   display: 'block',
-  fontFamily: _constants.NTA_LIGHT,
-  WebkitFontSmoothing: 'antialiased',
-  MozOsxFontSmoothing: 'grayscale',
-  fontWeight: 700,
-  textTransform: 'none',
-  fontSize: _constants.FONT_SIZE.SIZE_16,
-  lineHeight: _constants.LINE_HEIGHT.SIZE_16
-}, _styled[_constants.MEDIA_QUERIES.LARGESCREEN] = {
-  fontSize: _constants.FONT_SIZE.SIZE_19,
-  lineHeight: _constants.LINE_HEIGHT.SIZE_19
-}, _styled.color = "" + _govukColours.ERROR_COLOUR, _styled.paddingTop = '4px', _styled.paddingBottom = '2px', _styled));
+  // NB non-responsive spacing
+  marginBottom: _constants.SPACING_POINTS[3],
+  clear: 'both',
+  color: _govukColours.ERROR_COLOUR
+});
 /**
@@ -49,7 +46,7 @@ *
  * ```jsx
- * <ErrorText errorText="example">Example</ErrorText>
+ * <ErrorText>Example</ErrorText>
  * ```
  *
  * ### References
- * - https://github.com/alphagov/govuk-frontend/tree/master/src/components
+ * - https://github.com/alphagov/govuk-frontend/blob/master/src/components/error-message/_error-message.scss
  */
@@ -61,5 +58,3 @@
 
-var _default = (0, _hoc.withWhiteSpace)({
-  marginBottom: 0
-})(ErrorText);
+var _default = (0, _hoc.withWhiteSpace)()(ErrorText);
 
@@ -66,0 +61,0 @@ exports.default = _default;

package.json

 {
   "name": "@govuk-react/error-text",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "dependencies": {
-    "@govuk-react/constants": "^0.5.0",
-    "@govuk-react/hoc": "^0.5.0",
+    "@govuk-react/constants": "^0.5.1",
+    "@govuk-react/hoc": "^0.5.1",
+    "@govuk-react/lib": "^0.5.1",
     "govuk-colours": "^1.0.3"
@@ -8,0 +9,0 @@ },

README.md

@@ -15,7 +15,7 @@ ErrorText
 ```jsx
-<ErrorText errorText="example">Example</ErrorText>
+<ErrorText>Example</ErrorText>
 ```
 
 ### References
-- https://github.com/alphagov/govuk-frontend/tree/master/src/components
+- https://github.com/alphagov/govuk-frontend/blob/master/src/components/error-message/_error-message.scss
 
@@ -22,0 +22,0 @@ ### Properties

src/index.js

@@ -6,26 +6,15 @@ import styled from 'react-emotion';
 import { withWhiteSpace } from '@govuk-react/hoc';
-import {
-  FONT_SIZE,
-  LINE_HEIGHT,
-  MEDIA_QUERIES,
-  NTA_LIGHT,
-} from '@govuk-react/constants';
+import { SPACING_POINTS } from '@govuk-react/constants';
+import { typography } from '@govuk-react/lib';
 
-const StyledError = styled('span')({
-  display: 'block',
-  fontFamily: NTA_LIGHT,
-  WebkitFontSmoothing: 'antialiased',
-  MozOsxFontSmoothing: 'grayscale',
-  fontWeight: 700,
-  textTransform: 'none',
-  fontSize: FONT_SIZE.SIZE_16,
-  lineHeight: LINE_HEIGHT.SIZE_16,
-  [MEDIA_QUERIES.LARGESCREEN]: {
-    fontSize: FONT_SIZE.SIZE_19,
-    lineHeight: LINE_HEIGHT.SIZE_19,
+const StyledError = styled('span')(
+  typography.font({ size: 19, weight: 'bold' }),
+  {
+    display: 'block',
+    // NB non-responsive spacing
+    marginBottom: SPACING_POINTS[3],
+    clear: 'both',
+    color: ERROR_COLOUR,
   },
-  color: `${ERROR_COLOUR}`,
-  paddingTop: '4px',
-  paddingBottom: '2px',
-});
+);
 
@@ -39,7 +28,7 @@ /**
  * ```jsx
- * <ErrorText errorText="example">Example</ErrorText>
+ * <ErrorText>Example</ErrorText>
  * ```
  *
  * ### References
- * - https://github.com/alphagov/govuk-frontend/tree/master/src/components
+ * - https://github.com/alphagov/govuk-frontend/blob/master/src/components/error-message/_error-message.scss
  */
@@ -53,2 +42,2 @@ const ErrorText = props => <StyledError {...props} />;
 
-export default withWhiteSpace({ marginBottom: 0 })(ErrorText);
+export default withWhiteSpace()(ErrorText);

No alert changes

Worsened metrics

Total package byte prevSize

16919

-19.1%

Dependency count

7

16.67%

Number of package files

18

-5.26%

Lines of code

203

-9.37%

Dependency changes

• + Added

  @govuk-react/lib@^0.5.1

• Updated

  @govuk-react/constants@^0.5.1

• Updated

  @govuk-react/hoc@^0.5.1