@comicrelief/component-library 5.4.0 → 5.7.0

package/.circleci/config.yml

@@ -8,7 +8,7 @@ jobs:
     docker:
 
       # See https://github.com/cypress-io/cypress-docker-images
-      - image: cypress/browsers:node12.18.0-chrome83-ff77
+      - image: cypress/browsers:node14.16.0-chrome89-ff77
         environment:
           TERM: xterm
           NODE_OPTIONS: --max_old_space_size=4096

package/dist/components/Atoms/Button/Button.js

@@ -19,6 +19,8 @@ var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
 
 var _breakpoint = _interopRequireDefault(require("../../../theme/shared/breakpoint"));
 
+var _excluded = ["children", "wrapper"];
+
 var StyledButton = _styledComponents.default.button.withConfig({
   displayName: "Button__StyledButton",
   componentId: "sc-1gm5vj0-0"
@@ -37,7 +39,7 @@ var StyledButton = _styledComponents.default.button.withConfig({
 var Button = /*#__PURE__*/_react.default.forwardRef(function (_ref4, ref) {
   var children = _ref4.children,
       wrapper = _ref4.wrapper,
-      rest = (0, _objectWithoutProperties2.default)(_ref4, ["children", "wrapper"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref4, _excluded);
   return /*#__PURE__*/_react.default.createElement(StyledButton, Object.assign({}, rest, {
     as: wrapper ? 'span' : 'button',
     ref: ref

package/dist/components/Atoms/ButtonWithStates/ButtonWithStates.js

@@ -0,0 +1,91 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _ScaleLoader = _interopRequireDefault(require("react-spinners/ScaleLoader"));
+
+var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
+
+var _Button = _interopRequireDefault(require("../Button/Button"));
+
+var _excluded = ["children", "loadingText", "loading", "disabled"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var ButtonWithDisabledState = (0, _styledComponents.default)(_Button.default).withConfig({
+  displayName: "ButtonWithStates__ButtonWithDisabledState",
+  componentId: "sc-7gb81g-0"
+})(["&:disabled{cursor:not-allowed;opacity:0.75;}"]);
+
+var LoaderContainer = _styledComponents.default.div.withConfig({
+  displayName: "ButtonWithStates__LoaderContainer",
+  componentId: "sc-7gb81g-1"
+})(["", ""], function (_ref) {
+  var withMargin = _ref.withMargin;
+  return withMargin ? "\n  margin-top: ".concat((0, _spacing.default)('xsm'), ";\n  margin-left: ").concat((0, _spacing.default)('md'), ";\n") : '';
+}); // A button with loading and disabled states.
+
+
+var ButtonWithStates = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+      loadingText = _ref2.loadingText,
+      loading = _ref2.loading,
+      disabled = _ref2.disabled,
+      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+
+  var _useState = (0, _react.useState)(null),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      loaderColour = _useState2[0],
+      setLoaderColour = _useState2[1]; // Can't see a simpler way to get the button's text colour, without reading the value
+  //  via JavaScript.
+  //  (e.g. the `theme.buttonColours` helper returns a CSS string split into an array -
+  //  don't really want to be parsing that.)
+  //  (And can't use inherit because ScaleLoader's color prop is actually setting its
+  //  background color.)
+
+
+  var getLoaderColour = (0, _react.useCallback)(function (node) {
+    if (node && typeof window.getComputedStyle === 'function') {
+      var textColour = window.getComputedStyle(node).color;
+
+      if (textColour) {
+        setLoaderColour(textColour);
+      }
+    }
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(ButtonWithDisabledState, Object.assign({
+    ref: ref,
+    disabled: disabled
+  }, rest), loading ? loadingText : children, /*#__PURE__*/_react.default.createElement(LoaderContainer, {
+    ref: getLoaderColour,
+    withMargin: loading
+  }, /*#__PURE__*/_react.default.createElement(_ScaleLoader.default, {
+    height: 16,
+    width: 2,
+    loading: loading,
+    color: loaderColour
+  })));
+});
+
+ButtonWithStates.defaultProps = {
+  loading: false,
+  disabled: false,
+  loadingText: 'Loading'
+};
+var _default = ButtonWithStates;
+exports.default = _default;

package/dist/components/Atoms/ButtonWithStates/ButtonWithStates.md

@@ -0,0 +1,13 @@
+## Disabled and loading
+
+```js
+import ButtonWithStates from './ButtonWithStates';
+
+<ButtonWithStates
+  type="submit"
+  loading
+  disabled
+>
+  Enter prize draw
+</ButtonWithStates>
+```

package/dist/components/Atoms/Checkbox/Checkbox.js

@@ -19,11 +19,13 @@ var _Text = _interopRequireDefault(require("../Text/Text"));
 
 var _tick = _interopRequireDefault(require("./assets/tick.svg"));
 
+var _excluded = ["label", "value", "children"];
+
 var StyledCheckboxInput = _styledComponents.default.input.attrs({
   type: 'checkbox'
 }).withConfig({
   displayName: "Checkbox__StyledCheckboxInput",
-  componentId: "ngak0-0"
+  componentId: "sc-ngak0-0"
 })(["font-size:", ";display:block;box-sizing:border-box;opacity:0;position:absolute;left:0px;width:24px;height:24px;margin:0;border:1px solid ", ";+ span{margin-right:12px;width:24px;height:24px;border-radius:4px;background-color:", ";border:1px solid ", ";float:left;}:checked + span{background:url(", ") no-repeat center;background-color:", ";border-color:", ";background-size:contain;}:focus + span{border-color:", ";border-width:1px;}"], function (_ref) {
   var theme = _ref.theme;
   return theme.fontSize('sm');
@@ -49,7 +51,7 @@ var StyledCheckboxInput = _styledComponents.default.input.attrs({
 
 var Label = _styledComponents.default.label.withConfig({
   displayName: "Checkbox__Label",
-  componentId: "ngak0-1"
+  componentId: "sc-ngak0-1"
 })(["display:flex;", " margin-bottom:8px;"], function (_ref8) {
   var hasLabelAsString = _ref8.hasLabelAsString;
   return hasLabelAsString && 'align-items: center;';
@@ -59,7 +61,7 @@ var Checkbox = /*#__PURE__*/_react.default.forwardRef(function (_ref9, ref) {
   var label = _ref9.label,
       value = _ref9.value,
       children = _ref9.children,
-      rest = (0, _objectWithoutProperties2.default)(_ref9, ["label", "value", "children"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref9, _excluded);
   return /*#__PURE__*/_react.default.createElement(Label, {
     hasLabelAsString: !!label
   }, /*#__PURE__*/_react.default.createElement(StyledCheckboxInput, Object.assign({}, rest, {

package/dist/components/Atoms/ErrorText/ErrorText.js

@@ -19,6 +19,8 @@ var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
 
 var _CR_ErrorRed = _interopRequireDefault(require("../Input/assets/CR_Error--red.svg"));
 
+var _excluded = ["children"];
+
 var ErrorIcon = _styledComponents.default.span.withConfig({
   displayName: "ErrorText__ErrorIcon",
   componentId: "sc-19bj17r-0"
@@ -32,7 +34,7 @@ var ErrorIcon = _styledComponents.default.span.withConfig({
 
 var ErrorText = function ErrorText(_ref3) {
   var children = _ref3.children,
-      rest = (0, _objectWithoutProperties2.default)(_ref3, ["children"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
   return /*#__PURE__*/_react.default.createElement(_Text.default, Object.assign({}, rest, {
     color: "red"
   }), /*#__PURE__*/_react.default.createElement(ErrorIcon, null, children));

package/dist/components/Atoms/Icons/Arrow.js

@@ -13,6 +13,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
+var _excluded = ["colour", "theme", "size", "direction"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -37,7 +39,7 @@ var Arrow = function Arrow(_ref2) {
       theme = _ref2.theme,
       size = _ref2.size,
       direction = _ref2.direction,
-      rest = (0, _objectWithoutProperties2.default)(_ref2, ["colour", "theme", "size", "direction"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   return /*#__PURE__*/_react.default.createElement(Icon, Object.assign({
     direction: direction,
     width: size,

package/dist/components/Atoms/Icons/AtSign.js

@@ -13,13 +13,14 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = require("styled-components");
 
+var _excluded = ["theme", "size", "colour"];
 var PATH_DATA = 'M40.811,9.307C36.607,4.664,30.48,2,24,2C11.458,2,2,11.458,2,24s9.458,22,22,22c10.221,0,14.032-3.779,15.29-5.031 c0.197-0.115,0.379-0.265,0.533-0.451c0.707-0.849,0.592-2.11-0.257-2.817c-0.438-0.362-1.61-1.049-3.093,0.427 C35.512,39.086,32.585,42,24,42C13.738,42,6,34.262,6,24S13.738,6,24,6c5.353,0,10.398,2.184,13.845,5.991 c3.162,3.495,4.642,8.044,4.165,12.81c-0.364,3.641-1.958,6.013-4.487,6.677c-1.853,0.487-3.658-0.145-4.269-1.011 c-1.001-1.422-0.753-4.747,0.009-8.237c1.035-3.375,2.104-6.939,2.177-7.179c0.308-1.027-0.249-2.114-1.263-2.465 c-1.012-0.349-2.122,0.161-2.515,1.159c-0.097,0.247-0.191,0.491-0.282,0.732c-1.427-1.455-3.424-2.421-5.724-2.66 c-3.983-0.41-9.547,1.602-12.107,8.643c-1.334,3.667-1.19,7.467,0.384,10.163c1.241,2.126,3.291,3.482,5.929,3.921 c4.299,0.714,7.438-0.837,9.464-3.098c0.254,0.695,0.516,1.122,0.659,1.325c1.66,2.358,5.257,3.443,8.555,2.576 c1.987-0.522,6.691-2.557,7.451-10.147C46.581,19.295,44.741,13.651,40.811,9.307z M37.871,41.195 c-0.149-0.03-0.3-0.081-0.448-0.152C37.567,41.112,37.718,41.163,37.871,41.195z M29.195,21.849 c-0.554,1.799-1.07,3.451-1.379,4.375c-0.413,1.243-2.174,5.229-7.297,4.374c-1.468-0.245-2.493-0.896-3.133-1.993 c-0.967-1.657-0.997-4.254-0.078-6.779c1.633-4.492,4.727-6.064,7.296-6.064c0.217,0,0.431,0.011,0.639,0.033 c1.952,0.203,4.068,1.433,4.396,3.726c0.01,0.074,0.024,0.146,0.043,0.217C29.49,20.479,29.329,21.181,29.195,21.849z';
 
 var AtSign = function AtSign(_ref) {
   var theme = _ref.theme,
       size = _ref.size,
       colour = _ref.colour,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["theme", "size", "colour"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
     width: size,
     height: size,

package/dist/components/Atoms/Icons/Chevron.js

@@ -13,6 +13,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
+var _excluded = ["colour", "theme", "size", "direction"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -37,7 +39,7 @@ var Chevron = function Chevron(_ref2) {
       theme = _ref2.theme,
       size = _ref2.size,
       direction = _ref2.direction,
-      rest = (0, _objectWithoutProperties2.default)(_ref2, ["colour", "theme", "size", "direction"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   return /*#__PURE__*/_react.default.createElement(Icon, Object.assign({
     direction: direction,
     width: size,

package/dist/components/Atoms/Icons/Download.js

@@ -13,11 +13,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = require("styled-components");
 
+var _excluded = ["colour", "theme", "size"];
+
 var Download = function Download(_ref) {
   var colour = _ref.colour,
       theme = _ref.theme,
       size = _ref.size,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["colour", "theme", "size"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", Object.assign({}, rest, {
     width: size,
     height: size,

package/dist/components/Atoms/Icons/External.js

@@ -13,11 +13,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = require("styled-components");
 
+var _excluded = ["colour", "theme", "size"];
+
 var External = function External(_ref) {
   var colour = _ref.colour,
       theme = _ref.theme,
       size = _ref.size,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["colour", "theme", "size"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", Object.assign({}, rest, {
     width: size,
     height: size,

package/dist/components/Atoms/Icons/Favourite.js

@@ -13,11 +13,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = require("styled-components");
 
+var _excluded = ["colour", "theme", "size"];
+
 var Favourite = function Favourite(_ref) {
   var colour = _ref.colour,
       theme = _ref.theme,
       size = _ref.size,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["colour", "theme", "size"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", Object.assign({}, rest, {
     width: size,
     height: size,

package/dist/components/Atoms/Icons/Internal.js

@@ -13,11 +13,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = require("styled-components");
 
+var _excluded = ["colour", "theme", "size"];
+
 var Internal = function Internal(_ref) {
   var colour = _ref.colour,
       theme = _ref.theme,
       size = _ref.size,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["colour", "theme", "size"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", Object.assign({}, rest, {
     width: size,
     height: size,

package/dist/components/Atoms/Input/Input.js

@@ -23,6 +23,8 @@ var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
 
 var _zIndex = _interopRequireDefault(require("../../../theme/shared/zIndex"));
 
+var _excluded = ["errorMsg", "id", "label", "showLabel", "type", "hasAria", "className", "labelProps", "prefix", "optional"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -35,7 +37,7 @@ var getPrefixWidth = function getPrefixWidth(prefixLength) {
 
 var InputField = _styledComponents.default.input.withConfig({
   displayName: "Input__InputField",
-  componentId: "bcqy1o-0"
+  componentId: "sc-bcqy1o-0"
 })(["", ""], function (_ref) {
   var theme = _ref.theme,
       error = _ref.error,
@@ -45,7 +47,7 @@ var InputField = _styledComponents.default.input.withConfig({
 
 var InputWrapper = _styledComponents.default.div.withConfig({
   displayName: "Input__InputWrapper",
-  componentId: "bcqy1o-1"
+  componentId: "sc-bcqy1o-1"
 })(["position:relative;font-size:", ";"], function (_ref2) {
   var theme = _ref2.theme;
   return theme.fontSize('m');
@@ -53,7 +55,7 @@ var InputWrapper = _styledComponents.default.div.withConfig({
 
 var Prefix = _styledComponents.default.div.withConfig({
   displayName: "Input__Prefix",
-  componentId: "bcqy1o-2"
+  componentId: "sc-bcqy1o-2"
 })(["position:absolute;left:0;top:0;", " display:flex;height:100%;width:", ";justify-content:center;align-items:center;color:", ";font-weight:700;font-size:inherit;margin-left:2px;"], (0, _zIndex.default)('high'), function (_ref3) {
   var length = _ref3.length;
   return getPrefixWidth(length);
@@ -73,7 +75,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref5, ref) {
       labelProps = _ref5.labelProps,
       prefix = _ref5.prefix,
       optional = _ref5.optional,
-      rest = (0, _objectWithoutProperties2.default)(_ref5, ["errorMsg", "id", "label", "showLabel", "type", "hasAria", "className", "labelProps", "prefix", "optional"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref5, _excluded);
   return /*#__PURE__*/_react.default.createElement(_Label.default, Object.assign({
     className: className,
     htmlFor: id,

package/dist/components/Atoms/Label/Label.js

@@ -19,6 +19,9 @@ var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
 
 var _hideVisually = _interopRequireDefault(require("../../../theme/shared/hideVisually"));
 
+var _excluded = ["label", "hideLabel"],
+    _excluded2 = ["children", "label", "hideLabel", "optional"];
+
 var LabelElement = _styledComponents.default.label.withConfig({
   displayName: "Label__LabelElement",
   componentId: "sc-2nrw50-0"
@@ -45,7 +48,7 @@ var HiddenText = (0, _styledComponents.default)(_Text.default).withConfig({
 var LabelText = function LabelText(_ref3) {
   var label = _ref3.label,
       hideLabel = _ref3.hideLabel,
-      rest = (0, _objectWithoutProperties2.default)(_ref3, ["label", "hideLabel"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
   var Component = hideLabel ? HiddenText : VisibleText;
   return /*#__PURE__*/_react.default.isValidElement(label) ? /*#__PURE__*/_react.default.createElement(Component, rest, label) : /*#__PURE__*/_react.default.createElement(Component, Object.assign({}, rest, {
     dangerouslySetInnerHTML: {
@@ -68,7 +71,7 @@ var Label = function Label(_ref4) {
       label = _ref4.label,
       hideLabel = _ref4.hideLabel,
       optional = _ref4.optional,
-      rest = (0, _objectWithoutProperties2.default)(_ref4, ["children", "label", "hideLabel", "optional"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref4, _excluded2);
   return /*#__PURE__*/_react.default.createElement(LabelElement, Object.assign({}, rest, {
     optional: optional
   }), /*#__PURE__*/_react.default.createElement(LabelText, {

package/dist/components/Atoms/Link/Link.js

@@ -7,19 +7,24 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _Link = _interopRequireWildcard(require("./Link.style"));
 
 var _whiteListed = _interopRequireDefault(require("../../../utils/whiteListed"));
 
+var _internalLinkHelper = require("../../../utils/internalLinkHelper");
+
+var _excluded = ["children", "color", "href", "target", "type", "home", "underline", "icon", "iconFirst"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var domainRegEx = new RegExp('(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]');
 var window = '';
 
 var Link = function Link(_ref) {
@@ -32,21 +37,41 @@ var Link = function Link(_ref) {
       underline = _ref.underline,
       icon = _ref.icon,
       iconFirst = _ref.iconFirst,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["children", "color", "href", "target", "type", "home", "underline", "icon", "iconFirst"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
+  var _useState = (0, _react.useState)(''),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      documentHost = _useState2[0],
+      setDocumentHost = _useState2[1];
   /**
    * If we haven't specifically set the target via props, check if
    * this is an internal link OR on our whitelist before making it a '_self' link
    */
+
+
   if (target === null) {
-    var isExternalLink = domainRegEx.test(href);
+    // Use our helper function to determine the raw domains to compare
+    var currentDomain = (0, _internalLinkHelper.getDomain)(documentHost);
+    var linkDomain = (0, _internalLinkHelper.getDomain)(href); // Additional check for applications that need more control
+
+    var isWhiteListOverridden = rest.overrideWhiteList === true;
+    /**
+     * If the link has no domain supplied (likely '/' or '#')
+     * OR has the same domain as the current page, don't open
+     * in a new tab
+     */
+
+    var isExternalLink = linkDomain !== '' && currentDomain !== linkDomain;
     var isWhiteListed = (0, _whiteListed.default)(href);
-    window = !isExternalLink || isWhiteListed ? '_self' : '_blank';
+    window = isExternalLink && (isWhiteListOverridden || !isWhiteListed) ? '_blank' : '_self';
   } else {
     window = target === 'blank' ? '_blank' : '_self';
   }
 
   var hasIcon = icon !== null;
+  (0, _react.useEffect)(function () {
+    setDocumentHost(document.location.host);
+  }, []);
   return /*#__PURE__*/_react.default.createElement(_Link.default, Object.assign({}, rest, {
     color: color,
     href: href,
@@ -54,7 +79,7 @@ var Link = function Link(_ref) {
     type: type,
     iconFirst: iconFirst,
     underline: underline
-  }), children, target === 'blank' && /*#__PURE__*/_react.default.createElement(_Link.HelperText, null, "(opens in new window)"), hasIcon && /*#__PURE__*/_react.default.createElement(_Link.IconWrapper, {
+  }), children, window === '_blank' && /*#__PURE__*/_react.default.createElement(_Link.HelperText, null, "(opens in new window)"), hasIcon && /*#__PURE__*/_react.default.createElement(_Link.IconWrapper, {
     type: type
   }, icon));
 };

package/dist/components/Atoms/Link/Link.style.js

@@ -45,7 +45,7 @@ var linkStyle = function linkStyle() {
 
 var IconWrapper = _styledComponents.default.span.withConfig({
   displayName: "Linkstyle__IconWrapper",
-  componentId: "t360tr-0"
+  componentId: "sc-t360tr-0"
 })(["display:inline-flex;margin-left:", ";align-self:center;right:", ";", ";@media ", "{width:auto;right:auto;position:relative;", ";}"], (0, _spacing.default)('md'), (0, _spacing.default)('m'), function (_ref6) {
   var type = _ref6.type;
   return type === 'standard' && (0, _styledComponents.css)(["position:absolute;right:-2rem;top:0;bottom:0;"]);
@@ -61,7 +61,7 @@ exports.IconWrapper = IconWrapper;
 
 var StyledLink = _styledComponents.default.a.withConfig({
   displayName: "Linkstyle__StyledLink",
-  componentId: "t360tr-1"
+  componentId: "sc-t360tr-1"
 })(["", " ", ";"], function (props) {
   return props.type === 'button' ? buttonStyle : linkStyle;
 }, function (_ref9) {
@@ -71,7 +71,7 @@ var StyledLink = _styledComponents.default.a.withConfig({
 
 var HelperText = _styledComponents.default.span.withConfig({
   displayName: "Linkstyle__HelperText",
-  componentId: "t360tr-2"
+  componentId: "sc-t360tr-2"
 })(["", ";"], _hideVisually.default);
 
 exports.HelperText = HelperText;

package/dist/components/Atoms/Pagination/Item/Item.js

@@ -13,10 +13,12 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Item = _interopRequireDefault(require("./Item.style"));
 
+var _excluded = ["children", "target"];
+
 var Item = function Item(_ref) {
   var children = _ref.children,
       target = _ref.target,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, ["children", "target"]);
+      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_Item.default, Object.assign({
     target: "_".concat(target)
   }, restProps), children);

package/dist/components/Atoms/Pagination/List/List.js

@@ -13,14 +13,16 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
+var _excluded = ["PageComponent", "pages", "createURL", "onSelect", "pageComponentProps"];
+
 var StyledList = _styledComponents.default.ul.withConfig({
   displayName: "List__StyledList",
-  componentId: "vcfyaz-0"
+  componentId: "sc-vcfyaz-0"
 })(["display:flex;padding-left:0;justify-content:center;flex-wrap:wrap;list-style-type:none;"]);
 
 var StyledItem = _styledComponents.default.li.withConfig({
   displayName: "List__StyledItem",
-  componentId: "vcfyaz-1"
+  componentId: "sc-vcfyaz-1"
 })(["padding:10px;"]);
 
 var List = function List(_ref) {
@@ -29,7 +31,7 @@ var List = function List(_ref) {
       createURL = _ref.createURL,
       onSelect = _ref.onSelect,
       pageComponentProps = _ref.pageComponentProps,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, ["PageComponent", "pages", "createURL", "onSelect", "pageComponentProps"]);
+      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(StyledList, null, pages.map(function (_ref2) {
     var selected = _ref2.selected,
         disabled = _ref2.disabled,

package/dist/components/Atoms/Pagination/Pagination.js

@@ -17,6 +17,8 @@ var _Item = _interopRequireDefault(require("./Item/Item"));
 
 var _PaginationCalculator = require("./Utils/PaginationCalculator");
 
+var _excluded = ["PageComponent", "totalPages", "maxPages", "currentPage", "showFirst", "firstLabel", "firstAriaLabel", "showPrevious", "previousLabel", "previousAriaLabel", "showMore", "moreLabel", "moreAriaLabel", "showNext", "nextLabel", "nextAriaLabel", "showLast", "lastLabel", "lastAriaLabel", "getPageLabel", "getPageAriaLabel", "onSelect", "createURL", "pageComponentProps"];
+
 /** Customizable Pagination component */
 var Pagination = function Pagination(_ref) {
   var PageComponent = _ref.PageComponent,
@@ -43,7 +45,7 @@ var Pagination = function Pagination(_ref) {
       onSelect = _ref.onSelect,
       createURL = _ref.createURL,
       pageComponentProps = _ref.pageComponentProps,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, ["PageComponent", "totalPages", "maxPages", "currentPage", "showFirst", "firstLabel", "firstAriaLabel", "showPrevious", "previousLabel", "previousAriaLabel", "showMore", "moreLabel", "moreAriaLabel", "showNext", "nextLabel", "nextAriaLabel", "showLast", "lastLabel", "lastAriaLabel", "getPageLabel", "getPageAriaLabel", "onSelect", "createURL", "pageComponentProps"]);
+      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   if (!totalPages) {
     return null;

package/dist/components/Atoms/Picture/Picture.js

@@ -19,6 +19,8 @@ require("lazysizes");
 
 require("lazysizes/plugins/blur-up/ls.blur-up");
 
+var _excluded = ["images", "image", "alt", "width", "height", "objectFit", "imageLow", "isBackgroundImage"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -68,7 +70,7 @@ var Picture = function Picture(_ref4) {
       objectFit = _ref4.objectFit,
       imageLow = _ref4.imageLow,
       isBackgroundImage = _ref4.isBackgroundImage,
-      rest = (0, _objectWithoutProperties2.default)(_ref4, ["images", "image", "alt", "width", "height", "objectFit", "imageLow", "isBackgroundImage"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref4, _excluded);
   var document = typeof window !== 'undefined' ? window.document : null;
 
   var _useState = (0, _react.useState)(true),

package/dist/components/Atoms/RadioButton/RadioButton.js

@@ -17,6 +17,8 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _Text = _interopRequireDefault(require("../Text/Text"));
 
+var _excluded = ["label", "name", "value"];
+
 /**
  * Input radio component
  */
@@ -57,7 +59,7 @@ var RadioButton = /*#__PURE__*/_react.default.forwardRef(function (_ref7, ref) {
   var label = _ref7.label,
       name = _ref7.name,
       value = _ref7.value,
-      rest = (0, _objectWithoutProperties2.default)(_ref7, ["label", "name", "value"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref7, _excluded);
   return /*#__PURE__*/_react.default.createElement(Label, {
     htmlFor: value
   }, /*#__PURE__*/_react.default.createElement(StyledRadioInput, Object.assign({

package/dist/components/Atoms/RichText/RichText.js

@@ -13,9 +13,11 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
+var _excluded = ["align", "markup"];
+
 var Inner = _styledComponents.default.div.withConfig({
   displayName: "RichText__Inner",
-  componentId: "sqyfgj-0"
+  componentId: "sc-sqyfgj-0"
 })(["text-align:", ";"], function (props) {
   return props.align;
 });
@@ -25,7 +27,7 @@ exports.Inner = Inner;
 var RichText = function RichText(_ref) {
   var align = _ref.align,
       markup = _ref.markup,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["align", "markup"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(Inner, Object.assign({
     align: align,
     dangerouslySetInnerHTML: {