@bbc/psammead-sitewide-links - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

CHANGELOG.md

@@ -5,2 +5,3 @@ # Psammead Sitewide Links Changelog
 |---------|-------------|
+| 0.1.1   | [PR#227](https://github.com/BBC-News/psammead/pull/227) Replace @bbc/gel-constants and @bbc/gel-foundations-styled-component with [@bbc/gel-foundations in Psammead](https://github.com/BBC-News/psammead/issues/226). |
 | 0.1.0   | [PR#154](https://github.com/BBC-News/psammead/pull/154) Create initial package with SitewideLinks component pulled in from [Simorgh](https://github.com/BBC-News/simorgh). |

dist/index.js

@@ -18,7 +18,7 @@ "use strict";
 
-var _typography = require("@bbc/gel-foundations-styled-components/typography");
+var _typography = require("@bbc/gel-foundations/typography");
 
-var _spacings = require("@bbc/gel-constants/spacings");
+var _spacings = require("@bbc/gel-foundations/spacings");
 
-var _breakpoints = require("@bbc/gel-constants/breakpoints");
+var _breakpoints = require("@bbc/gel-foundations/breakpoints");
 
@@ -33,40 +33,14 @@ var _Link = _interopRequireDefault(require("./Link"));
 
-function _templateObject3() {
-  var data = _taggedTemplateLiteral(["\n  color: ", ";\n  margin: 0;\n  padding: ", " 0;\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  ", ";\n  background-color: ", ";\n  ", ";\n  font-family: ", ";\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  @media (max-width: ", ") {\n    padding: 0 ", ";\n  }\n  @media (min-width: ", ") {\n    padding: 0 ", ";\n  }\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var layoutWrapperWithoutGrid = (0, _styledComponents.css)(_templateObject(), _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MIN, _spacings.GEL_MARGIN_BELOW_400PX, _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MIN, _spacings.GEL_MARGIN_ABOVE_400PX);
+var layoutWrapperWithoutGrid = (0, _styledComponents.css)(["@media (max-width:", "){padding:0 ", ";}@media (min-width:", "){padding:0 ", ";}"], _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MIN, _spacings.GEL_MARGIN_BELOW_400PX, _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MIN, _spacings.GEL_MARGIN_ABOVE_400PX);
 exports.layoutWrapperWithoutGrid = layoutWrapperWithoutGrid;
 
-var SitewideLinksWrapper = _styledComponents.default.div(_templateObject2(), layoutWrapperWithoutGrid, _colours.C_ORBIT_GREY, _typography.GEL_BREVIER, _fonts.FF_NEWS_SANS_REG);
+var SitewideLinksWrapper = _styledComponents.default.div.withConfig({
+  displayName: "SitewideLinksWrapper",
+  componentId: "sc-1gggobt-0"
+})(["", ";background-color:", ";", ";font-family:", ";"], layoutWrapperWithoutGrid, _colours.C_ORBIT_GREY, _typography.GEL_BREVIER, _fonts.FF_NEWS_SANS_REG);
 
-var StyledParagraph = _styledComponents.default.p(_templateObject3(), _colours.C_WHITE, _spacings.GEL_SPACING_DBL);
+var StyledParagraph = _styledComponents.default.p.withConfig({
+  displayName: "StyledParagraph",
+  componentId: "sc-1gggobt-1"
+})(["color:", ";margin:0;padding:", " 0;"], _colours.C_WHITE, _spacings.GEL_SPACING_DBL);
 
@@ -73,0 +47,0 @@ var SitewideLinks = function SitewideLinks(_ref) {

dist/Link/index.js

@@ -16,29 +16,10 @@ "use strict";
 
-var _spacings = require("@bbc/gel-constants/spacings");
+var _spacings = require("@bbc/gel-foundations/spacings");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  ", ":hover &,\n  ", ":focus & {\n    padding-bottom: 2px;\n    border-bottom: 2px solid ", ";\n  }\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  padding: ", " 0 ", ";\n  color: ", ";\n  font-weight: 700; /* Used instead of Reith Sans Bold since it is not worth the performance cost in this case. */\n  text-decoration: none;\n  display: ", ";\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledLink = _styledComponents.default.a(_templateObject(), _spacings.GEL_SPACING, _spacings.GEL_SPACING, _colours.C_WHITE, function (_ref) {
+var StyledLink = _styledComponents.default.a.withConfig({
+  displayName: "StyledLink",
+  componentId: "nhmg8j-0"
+})(["padding:", " 0 ", ";color:", ";font-weight:700;text-decoration:none;display:", ";"], _spacings.GEL_SPACING, _spacings.GEL_SPACING, _colours.C_WHITE, function (_ref) {
   var inline = _ref.inline;
@@ -48,3 +29,6 @@ return inline ? 'inline' : 'block';
 
-var StyleLinkText = _styledComponents.default.span(_templateObject2(),
+var StyleLinkText = _styledComponents.default.span.withConfig({
+  displayName: "StyleLinkText",
+  componentId: "nhmg8j-1"
+})(["", ":hover &,", ":focus &{padding-bottom:2px;border-bottom:2px solid ", ";}"],
 /* sc-selector */
@@ -51,0 +35,0 @@ StyledLink,

dist/List/index.js

@@ -18,5 +18,5 @@ "use strict";
 
-var _spacings = require("@bbc/gel-constants/spacings");
+var _spacings = require("@bbc/gel-foundations/spacings");
 
-var _breakpoints = require("@bbc/gel-constants/breakpoints");
+var _breakpoints = require("@bbc/gel-foundations/breakpoints");
 
@@ -27,28 +27,12 @@ var _Link = _interopRequireDefault(require("../Link"));
 
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  min-width: 50%;\n  @supports not (display: grid) {\n    display: inline-block;\n  }\n"]);
+var StyledList = _styledComponents.default.ul.withConfig({
+  displayName: "StyledList",
+  componentId: "sc-2e1ekc-0"
+})(["border-bottom:1px solid ", ";display:grid;grid-auto-flow:column;list-style-type:none;margin:0;padding:0 0 ", ";@media (max-width:", "){grid-column-gap:", ";grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,auto);}@media (min-width:", ") and (max-width:", "){grid-column-gap:", ";grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,auto);}@media (min-width:", ") and (max-width:", "){grid-column-gap:", ";grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,auto);}@media (min-width:", "){grid-column-gap:", ";grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,auto);}> li:first-child{border-bottom:1px solid ", ";padding:", " 0;margin-bottom:", ";grid-column:1/-1;@supports not (display:grid){width:100%;}}"], _colours.C_WHITE, _spacings.GEL_SPACING, _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING, _breakpoints.GEL_GROUP_3_SCREEN_WIDTH_MIN, _breakpoints.GEL_GROUP_3_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING_DBL, _breakpoints.GEL_GROUP_4_SCREEN_WIDTH_MIN, _breakpoints.GEL_GROUP_4_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING_DBL, _breakpoints.GEL_GROUP_5_SCREEN_WIDTH_MIN, _spacings.GEL_SPACING_DBL, _colours.C_WHITE, _spacings.GEL_SPACING, _spacings.GEL_SPACING);
 
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
+var StyledListItem = _styledComponents.default.li.withConfig({
+  displayName: "StyledListItem",
+  componentId: "sc-2e1ekc-1"
+})(["min-width:50%;@supports not (display:grid){display:inline-block;}"]);
 
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  border-bottom: 1px solid ", ";\n  display: grid;\n  grid-auto-flow: column;\n  list-style-type: none;\n  margin: 0;\n  padding: 0 0 ", ";\n  @media (max-width: ", ") {\n    grid-column-gap: ", ";\n    grid-template-columns: repeat(2, 1fr);\n    grid-template-rows: repeat(4, auto);\n  }\n  @media (min-width: ", ") and (max-width: ", ") {\n    grid-column-gap: ", ";\n    grid-template-columns: repeat(3, 1fr);\n    grid-template-rows: repeat(3, auto);\n  }\n  @media (min-width: ", ") and (max-width: ", ") {\n    grid-column-gap: ", ";\n    grid-template-columns: repeat(4, 1fr);\n    grid-template-rows: repeat(3, auto);\n  }\n  @media (min-width: ", ") {\n    grid-column-gap: ", ";\n    grid-template-columns: repeat(5, 1fr);\n    grid-template-rows: repeat(3, auto);\n  }\n  > li:first-child {\n    border-bottom: 1px solid ", ";\n    padding: ", " 0;\n    margin-bottom: ", ";\n    grid-column: 1/-1;\n    @supports not (display: grid) {\n      width: 100%;\n    }\n  }\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledList = _styledComponents.default.ul(_templateObject(), _colours.C_WHITE, _spacings.GEL_SPACING, _breakpoints.GEL_GROUP_2_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING, _breakpoints.GEL_GROUP_3_SCREEN_WIDTH_MIN, _breakpoints.GEL_GROUP_3_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING_DBL, _breakpoints.GEL_GROUP_4_SCREEN_WIDTH_MIN, _breakpoints.GEL_GROUP_4_SCREEN_WIDTH_MAX, _spacings.GEL_SPACING_DBL, _breakpoints.GEL_GROUP_5_SCREEN_WIDTH_MIN, _spacings.GEL_SPACING_DBL, _colours.C_WHITE, _spacings.GEL_SPACING, _spacings.GEL_SPACING);
-
-var StyledListItem = _styledComponents.default.li(_templateObject2());
-
 var List = function List(_ref) {
@@ -55,0 +39,0 @@ var links = _ref.links;

package.json

 {
   "name": "@bbc/psammead-sitewide-links",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "React styled component for a sitewide-links",
@@ -26,4 +26,3 @@ "main": "dist/index.js",
   "dependencies": {
-    "@bbc/gel-constants": "^0.1.1",
-    "@bbc/gel-foundations-styled-components": "^0.1.0",
+    "@bbc/gel-foundations": "^0.1.2",
     "@bbc/psammead-styles": "^0.1.3",
@@ -30,0 +29,0 @@ "nanoid": "^2.0.0",

src/index.jsx

@@ -6,3 +6,3 @@ import React from 'react';
 import { FF_NEWS_SANS_REG } from '@bbc/psammead-styles/fonts';
-import { GEL_BREVIER } from '@bbc/gel-foundations-styled-components/typography';
+import { GEL_BREVIER } from '@bbc/gel-foundations/typography';
 import {
@@ -12,4 +12,4 @@ GEL_SPACING_DBL,
   GEL_MARGIN_ABOVE_400PX,
-} from '@bbc/gel-constants/spacings';
-import { GEL_GROUP_2_SCREEN_WIDTH_MIN } from '@bbc/gel-constants/breakpoints';
+} from '@bbc/gel-foundations/spacings';
+import { GEL_GROUP_2_SCREEN_WIDTH_MIN } from '@bbc/gel-foundations/breakpoints';
 import Link from './Link';
@@ -16,0 +16,0 @@ import List from './List';

src/index.stories.jsx

 import React from 'react';
-import { storiesOf } from '@storybook/react'; // eslint-disable-line import/no-extraneous-dependencies
+import { storiesOf } from '@storybook/react';
+import { withReadme } from 'storybook-readme';
+import Readme from '../README.md';
 import SitewideLinks from './index';
@@ -12,8 +14,10 @@
 
-storiesOf('SitewideLinks', module).add('default', () => (
-  <SitewideLinks
-    links={links}
-    copyrightText="Text here. "
-    externalLink={link('last')}
-  />
-));
+storiesOf('SitewideLinks', module)
+  .addDecorator(withReadme(Readme))
+  .add('default', () => (
+    <SitewideLinks
+      links={links}
+      copyrightText="Text here. "
+      externalLink={link('last')}
+    />
+  ));

src/Link/index.jsx

@@ -5,3 +5,3 @@ import React from 'react';
 import { C_WHITE } from '@bbc/psammead-styles/colours';
-import { GEL_SPACING } from '@bbc/gel-constants/spacings';
+import { GEL_SPACING } from '@bbc/gel-foundations/spacings';
 
@@ -8,0 +8,0 @@ const StyledLink = styled.a`

src/List/index.jsx

@@ -6,3 +6,3 @@ import React from 'react';
 import { C_WHITE } from '@bbc/psammead-styles/colours';
-import { GEL_SPACING, GEL_SPACING_DBL } from '@bbc/gel-constants/spacings';
+import { GEL_SPACING, GEL_SPACING_DBL } from '@bbc/gel-foundations/spacings';
 import {
@@ -15,3 +15,3 @@ GEL_GROUP_2_SCREEN_WIDTH_MAX,
   GEL_GROUP_5_SCREEN_WIDTH_MIN,
-} from '@bbc/gel-constants/breakpoints';
+} from '@bbc/gel-foundations/breakpoints';
 
@@ -18,0 +18,0 @@ import Link from '../Link';

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Dependency count

6

decreased by-14.29%

Worsened metrics

Total package byte prevSize

24400

decreased by-6.08%

Lines of code

366

decreased by-7.58%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@bbc/gel-foundations@^0.1.2

• + Added@bbc/gel-foundations@0.1.4(transitive)

• - Removed@bbc/gel-constants@^0.1.1

• - Removed@bbc/gel-foundations-styled-components@^0.1.0

• - Removed@bbc/gel-constants@0.1.3(transitive)

• - Removed@bbc/gel-foundations-styled-components@0.1.1(transitive)