@comicrelief/component-library 7.22.0 → 7.23.0

package/dist/components/Molecules/Promo/_PromoVideoButton.style.js

@@ -1,37 +1,32 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Icon = exports.PlayButtonWrapper = exports.PlayButton = exports.ProgressRingCircle = exports.ProgressRingSVG = exports.ProgressRingWrapper = void 0;
-
+exports.ProgressRingWrapper = exports.ProgressRingSVG = exports.ProgressRingCircle = exports.PlayButtonWrapper = exports.PlayButton = exports.Icon = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
 var _PlayWhite = _interopRequireDefault(require("./assets/Play--white.svg"));
-
 var _PauseWhite = _interopRequireDefault(require("./assets/Pause--white.svg"));
-
 var _PlayBlack = _interopRequireDefault(require("./assets/Play--black.svg"));
-
 var _PauseBlack = _interopRequireDefault(require("./assets/Pause--black.svg"));
-
-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 PlayButton = _styledComponents.default.button.withConfig({
-  displayName: "_PromoVideoButtonstyle__PlayButton",
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) { if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } } return n.default = e, t && t.set(e, n), n; }
+var PlayButtonWrapper = exports.PlayButtonWrapper = _styledComponents.default.div.withConfig({
+  displayName: "_PromoVideoButtonstyle__PlayButtonWrapper",
   componentId: "sc-17cm3uc-0"
-})(["display:flex;width:50px;height:50px;position:absolute;top:10px;right:10px;align-items:center;justify-content:center;border:0;padding:0;margin:0;border-radius:50%;background:", ";opacity:0.75;transition:opacity 0.2s;&:hover,&:focus{opacity:1.0;}&:focus-visible{outline-style:outset;outline-width:medium;}", " ", " @media ", "{top:20px;right:20px;", "}"], function (_ref) {
+})(["width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;&:after{content:\"\";background-image:url(", "),url(", "),url(", "),url(", "),none;}"], _PlayWhite.default, _PauseWhite.default, _PlayBlack.default, _PauseBlack.default);
+var PlayButton = exports.PlayButton = _styledComponents.default.button.withConfig({
+  displayName: "_PromoVideoButtonstyle__PlayButton",
+  componentId: "sc-17cm3uc-1"
+})(["display:flex;width:50px;height:50px;position:absolute;top:10px;right:10px;align-items:center;justify-content:center;border:0;padding:0;margin:0;border-radius:50%;background:", ";opacity:0.8;transition:opacity 0.2s;&:hover,&:focus{opacity:1.0;}&:focus-visible{outline-style:outset;outline-width:medium;}", " ", " @media ", "{top:20px;right:20px;", "}"], function (_ref) {
   var theme = _ref.theme;
-  return theme.color('black');
+  return theme.color('white');
 }, function (_ref2) {
-  var lightColouredVideo = _ref2.lightColouredVideo;
-  return !lightColouredVideo && (0, _styledComponents.css)(["background:", ";"], function (_ref3) {
+  var blackPlayButton = _ref2.blackPlayButton;
+  return blackPlayButton && (0, _styledComponents.css)(["background:", ";"], function (_ref3) {
     var theme = _ref3.theme;
-    return theme.color('white');
+    return theme.color('black');
   });
 }, function (_ref4) {
   var copyLeft = _ref4.copyLeft;
@@ -43,39 +38,23 @@ var PlayButton = _styledComponents.default.button.withConfig({
   var copyLeft = _ref6.copyLeft;
   return !copyLeft && (0, _styledComponents.css)(["right:auto;left:20px;"]);
 });
-
-exports.PlayButton = PlayButton;
-
-var PlayButtonWrapper = _styledComponents.default.div.withConfig({
-  displayName: "_PromoVideoButtonstyle__PlayButtonWrapper",
-  componentId: "sc-17cm3uc-1"
-})(["width:100%;height:100%;position:absolute;top:0;left:0;"]);
-
-exports.PlayButtonWrapper = PlayButtonWrapper;
-
-var ProgressRingWrapper = _styledComponents.default.span.withConfig({
+var ProgressRingWrapper = exports.ProgressRingWrapper = _styledComponents.default.span.withConfig({
   displayName: "_PromoVideoButtonstyle__ProgressRingWrapper",
   componentId: "sc-17cm3uc-2"
 })(["position:absolute;width:100%;height:100%;display:flex;"]);
-
-exports.ProgressRingWrapper = ProgressRingWrapper;
-
-var ProgressRingSVG = _styledComponents.default.svg.withConfig({
+var ProgressRingSVG = exports.ProgressRingSVG = _styledComponents.default.svg.withConfig({
   displayName: "_PromoVideoButtonstyle__ProgressRingSVG",
   componentId: "sc-17cm3uc-3"
 })([""]);
-
-exports.ProgressRingSVG = ProgressRingSVG;
-
-var ProgressRingCircle = _styledComponents.default.circle.withConfig({
+var ProgressRingCircle = exports.ProgressRingCircle = _styledComponents.default.circle.withConfig({
   displayName: "_PromoVideoButtonstyle__ProgressRingCircle",
   componentId: "sc-17cm3uc-4"
 })(["z-index:100;transition:stroke-dashoffset 0.5s;transform:rotate(-90deg);transform-origin:50% 50%;stroke-dashoffset:", ";stroke:white;fill:transparent;", " ", ""], function (_ref7) {
   var strokeDashOffsetStyle = _ref7.strokeDashOffsetStyle;
   return strokeDashOffsetStyle;
 }, function (_ref8) {
-  var lightColouredVideo = _ref8.lightColouredVideo;
-  return !lightColouredVideo && (0, _styledComponents.css)(["stroke:", ";"], function (_ref9) {
+  var blackPlayButton = _ref8.blackPlayButton;
+  return !blackPlayButton && (0, _styledComponents.css)(["stroke:", ";"], function (_ref9) {
     var theme = _ref9.theme;
     return theme.color('black');
   });
@@ -83,28 +62,23 @@ var ProgressRingCircle = _styledComponents.default.circle.withConfig({
   var isRestarting = _ref10.isRestarting;
   return isRestarting && (0, _styledComponents.css)(["transition:none;"]);
 });
-
-exports.ProgressRingCircle = ProgressRingCircle;
-
-var Icon = _styledComponents.default.span.withConfig({
+var Icon = exports.Icon = _styledComponents.default.span.withConfig({
   displayName: "_PromoVideoButtonstyle__Icon",
   componentId: "sc-17cm3uc-5"
 })(["height:50px;width:50px;background:no-repeat center/50% url(", ") transparent;", " ", " ", " ", ""], _PlayWhite.default, function (_ref11) {
-  var lightColouredVideo = _ref11.lightColouredVideo,
-      isPlaying = _ref11.isPlaying;
-  return lightColouredVideo && !isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PlayWhite.default);
+  var blackPlayButton = _ref11.blackPlayButton,
+    isPlaying = _ref11.isPlaying;
+  return blackPlayButton && !isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PlayWhite.default);
 }, function (_ref12) {
-  var lightColouredVideo = _ref12.lightColouredVideo,
-      isPlaying = _ref12.isPlaying;
-  return lightColouredVideo && isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PauseWhite.default);
+  var blackPlayButton = _ref12.blackPlayButton,
+    isPlaying = _ref12.isPlaying;
+  return blackPlayButton && isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PauseWhite.default);
 }, function (_ref13) {
-  var lightColouredVideo = _ref13.lightColouredVideo,
-      isPlaying = _ref13.isPlaying;
-  return !lightColouredVideo && !isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PlayBlack.default);
+  var blackPlayButton = _ref13.blackPlayButton,
+    isPlaying = _ref13.isPlaying;
+  return !blackPlayButton && !isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PlayBlack.default);
 }, function (_ref14) {
-  var lightColouredVideo = _ref14.lightColouredVideo,
-      isPlaying = _ref14.isPlaying;
-  return !lightColouredVideo && isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PauseBlack.default);
-});
-
-exports.Icon = Icon;
+  var blackPlayButton = _ref14.blackPlayButton,
+    isPlaying = _ref14.isPlaying;
+  return !blackPlayButton && isPlaying && (0, _styledComponents.css)(["background-image:url(", ");"], _PauseBlack.default);
+});

package/dist/components/Molecules/Promo/__snapshots__/Promo.test.js.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders Promo correctly 1`] = `
-.c6 {
+.c7 {
   color: #FFFFFF;
   font-size: 5rem;
   line-height: 5rem;
@@ -16,7 +16,7 @@ exports[`renders Promo correctly 1`] = `
   line-height: 3rem;
 }
 
-.c7 {
+.c8 {
   color: #FFFFFF;
   font-size: 1rem;
   line-height: 1rem;
@@ -39,7 +39,7 @@ exports[`renders Promo correctly 1`] = `
   object-fit: cover;
 }
 
-.c8 {
+.c9 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -68,7 +68,7 @@ exports[`renders Promo correctly 1`] = `
   color: #000000;
 }
 
-.c8:hover {
+.c9:hover {
   background-color: #969598;
   color: #000000;
 }
@@ -102,13 +102,14 @@ exports[`renders Promo correctly 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  position: relative;
   -webkit-box-pack: end;
   -webkit-justify-content: flex-end;
   -ms-flex-pack: end;
   justify-content: flex-end;
 }
 
-.c5 {
+.c6 {
   width: 100%;
   padding: 1.5rem 1.5rem 4rem;
   z-index: 1;
@@ -123,8 +124,21 @@ exports[`renders Promo correctly 1`] = `
   object-position: center;
 }
 
+.c5 {
+  width: 100%;
+  height: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
 @media (min-width:740px) {
-  .c6 {
+  .c7 {
     font-size: 4rem;
     line-height: 4rem;
     margin-bottom: 2rem;
@@ -132,7 +146,7 @@ exports[`renders Promo correctly 1`] = `
 }
 
 @media (min-width:1024px) {
-  .c6 {
+  .c7 {
     font-size: 5rem;
     line-height: 5rem;
     margin-bottom: 2rem;
@@ -140,7 +154,7 @@ exports[`renders Promo correctly 1`] = `
 }
 
 @media (min-width:740px) {
-  .c8 {
+  .c9 {
     width: auto;
   }
 }
@@ -160,23 +174,27 @@ exports[`renders Promo correctly 1`] = `
 }
 
 @media (min-width:1024px) {
-  .c5 {
-    width: 70%;
-    padding: 4rem 1.5rem;
+  .c6 {
+    width: 100%;
+    padding: 8rem 1.5rem;
   }
 }
 
 @media (min-width:1024px) {
-  .c5 {
-    width: 50%;
-    padding: 8rem 1.5rem;
+  .c1 {
+    height: 100%;
+    position: absolute;
   }
 }
 
 @media (min-width:1024px) {
-  .c1 {
-    height: 100%;
+  .c5 {
+    width: 50%;
     position: absolute;
+    top: 0;
+    left: 0;
+    left: auto;
+    right: 0;
   }
 }
 
@@ -211,38 +229,42 @@ exports[`renders Promo correctly 1`] = `
     <div
       className="c5"
     >
-      <h1
+      <div
         className="c6"
-        color="white"
-        size="super"
-      >
-        Curabitur pretium tincidunt lacus
-      </h1>
-      <p
-        className="c7"
-        color="white"
-        size="s"
       >
-        Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo, est eros bibendum elit, nec luctus magna sollicitudin.
-      </p>
-      <span>
-        <a
+        <h1
+          className="c7"
+          color="white"
+          size="super"
+        >
+          Curabitur pretium tincidunt lacus
+        </h1>
+        <p
           className="c8"
           color="white"
-          href="/"
-          target="_self"
-          type="button"
+          size="s"
         >
-          Show me this
-        </a>
-      </span>
+          Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo, est eros bibendum elit, nec luctus magna sollicitudin.
+        </p>
+        <span>
+          <a
+            className="c9"
+            color="white"
+            href="/"
+            target="_self"
+            type="button"
+          >
+            Show me this
+          </a>
+        </span>
+      </div>
     </div>
   </div>
 </div>
 `;
 
 exports[`renders Promo correctly end position 1`] = `
-.c6 {
+.c7 {
   color: #FFFFFF;
   font-size: 5rem;
   line-height: 5rem;
@@ -257,7 +279,7 @@ exports[`renders Promo correctly end position 1`] = `
   line-height: 3rem;
 }
 
-.c7 {
+.c8 {
   color: #FFFFFF;
   font-size: 1rem;
   line-height: 1rem;
@@ -280,7 +302,7 @@ exports[`renders Promo correctly end position 1`] = `
   object-fit: cover;
 }
 
-.c8 {
+.c9 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -309,7 +331,7 @@ exports[`renders Promo correctly end position 1`] = `
   color: #000000;
 }
 
-.c8:hover {
+.c9:hover {
   background-color: #969598;
   color: #000000;
 }
@@ -346,13 +368,14 @@ exports[`renders Promo correctly end position 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  position: relative;
   -webkit-box-pack: end;
   -webkit-justify-content: flex-end;
   -ms-flex-pack: end;
   justify-content: flex-end;
 }
 
-.c5 {
+.c6 {
   width: 100%;
   padding: 1.5rem 1.5rem 4rem;
   z-index: 1;
@@ -367,8 +390,21 @@ exports[`renders Promo correctly end position 1`] = `
   object-position: center;
 }
 
+.c5 {
+  width: 100%;
+  height: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
 @media (min-width:740px) {
-  .c6 {
+  .c7 {
     font-size: 4rem;
     line-height: 4rem;
     margin-bottom: 2rem;
@@ -376,7 +412,7 @@ exports[`renders Promo correctly end position 1`] = `
 }
 
 @media (min-width:1024px) {
-  .c6 {
+  .c7 {
     font-size: 5rem;
     line-height: 5rem;
     margin-bottom: 2rem;
@@ -384,7 +420,7 @@ exports[`renders Promo correctly end position 1`] = `
 }
 
 @media (min-width:740px) {
-  .c8 {
+  .c9 {
     width: auto;
   }
 }
@@ -412,23 +448,27 @@ exports[`renders Promo correctly end position 1`] = `
 }
 
 @media (min-width:1024px) {
-  .c5 {
-    width: 70%;
-    padding: 4rem 1.5rem;
+  .c6 {
+    width: 100%;
+    padding: 8rem 1.5rem;
   }
 }
 
 @media (min-width:1024px) {
-  .c5 {
-    width: 50%;
-    padding: 8rem 1.5rem;
+  .c1 {
+    height: 100%;
+    position: absolute;
   }
 }
 
 @media (min-width:1024px) {
-  .c1 {
-    height: 100%;
+  .c5 {
+    width: 50%;
     position: absolute;
+    top: 0;
+    left: 0;
+    left: auto;
+    right: 0;
   }
 }
 
@@ -463,31 +503,35 @@ exports[`renders Promo correctly end position 1`] = `
     <div
       className="c5"
     >
-      <h1
+      <div
         className="c6"
-        color="white"
-        size="super"
-      >
-        Curabitur pretium tincidunt lacus
-      </h1>
-      <p
-        className="c7"
-        color="white"
-        size="s"
       >
-        Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo, est eros bibendum elit, nec luctus magna sollicitudin.
-      </p>
-      <span>
-        <a
+        <h1
+          className="c7"
+          color="white"
+          size="super"
+        >
+          Curabitur pretium tincidunt lacus
+        </h1>
+        <p
           className="c8"
           color="white"
-          href="/"
-          target="_self"
-          type="button"
+          size="s"
         >
-          Show me this
-        </a>
-      </span>
+          Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo, est eros bibendum elit, nec luctus magna sollicitudin.
+        </p>
+        <span>
+          <a
+            className="c9"
+            color="white"
+            href="/"
+            target="_self"
+            type="button"
+          >
+            Show me this
+          </a>
+        </span>
+      </div>
     </div>
   </div>
 </div>

package/dist/components/Molecules/SchoolLookup/SchoolLookup.js

@@ -1,28 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _axios = _interopRequireDefault(require("axios"));
-
 var _Typeahead = _interopRequireDefault(require("../Typeahead/Typeahead"));
-
 var _excluded = ["label", "placeholder", "notFoundMessage", "dropdownInstruction", "onSelect"];
-
 var optionFetcher = /*#__PURE__*/function () {
   var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(query) {
     var response;
@@ -37,11 +27,9 @@ var optionFetcher = /*#__PURE__*/function () {
               },
               timeout: 3000
             });
-
           case 2:
             response = _context.sent;
             return _context.abrupt("return", response.data.data.schools);
-
           case 4:
           case "end":
             return _context.stop();
@@ -49,23 +37,20 @@ var optionFetcher = /*#__PURE__*/function () {
       }
     }, _callee);
   }));
-
   return function optionFetcher(_x) {
     return _ref.apply(this, arguments);
   };
 }();
-
 var optionParser = function optionParser(school) {
   return "".concat(school.name, ", ").concat(school.post_code);
 };
-
 var SchoolLookup = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref) {
   var label = _ref2.label,
-      placeholder = _ref2.placeholder,
-      notFoundMessage = _ref2.notFoundMessage,
-      dropdownInstruction = _ref2.dropdownInstruction,
-      onSelect = _ref2.onSelect,
-      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    placeholder = _ref2.placeholder,
+    notFoundMessage = _ref2.notFoundMessage,
+    dropdownInstruction = _ref2.dropdownInstruction,
+    onSelect = _ref2.onSelect,
+    rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   var props = (0, _objectSpread2.default)({
     optionFetcher: optionFetcher,
     optionParser: optionParser,
@@ -81,12 +66,10 @@ var SchoolLookup = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref)
     ref: ref
   }));
 });
-
 SchoolLookup.defaultProps = {
   label: 'Enter the name or postcode of your school or nursery',
   placeholder: 'Type to start search',
   dropdownInstruction: 'Please select a school from the list below',
   notFoundMessage: "Sorry, we can't find this school"
 };
-var _default = SchoolLookup;
-exports.default = _default;
+var _default = exports.default = SchoolLookup;

package/dist/components/Molecules/SchoolLookup/SchoolLookup.test.js

@@ -1,15 +1,10 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _react = _interopRequireDefault(require("react"));
-
 require("jest-styled-components");
-
 var _shallowWithTheme = _interopRequireDefault(require("../../../hoc/shallowWithTheme"));
-
 var _SchoolLookup = _interopRequireDefault(require("./SchoolLookup"));
-
 it('renders correctly', function () {
   var renderer = (0, _shallowWithTheme.default)( /*#__PURE__*/_react.default.createElement(_SchoolLookup.default, {
     onSelect: function onSelect() {}

package/dist/components/Molecules/SearchInput/SearchInput.js

@@ -1,25 +1,19 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _SearchInput = require("./SearchInput.style");
-
 var _excluded = ["onChange", "placeholder", "value"];
-
 var SearchInput = function SearchInput(_ref) {
   var onChange = _ref.onChange,
-      placeholder = _ref.placeholder,
-      value = _ref.value,
-      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    placeholder = _ref.placeholder,
+    value = _ref.value,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_SearchInput.Wrapper, null, /*#__PURE__*/_react.default.createElement(_SearchInput.InnerWrapper, null, /*#__PURE__*/_react.default.createElement(_SearchInput.SearchBox, {
     role: "search"
   }, /*#__PURE__*/_react.default.createElement(_SearchInput.SearchWrapper, null, /*#__PURE__*/_react.default.createElement(_SearchInput.SearchField, Object.assign({
@@ -35,9 +29,7 @@ var SearchInput = function SearchInput(_ref) {
     errorMsg: ""
   }, rest))))));
 };
-
 SearchInput.defaultProps = {
   placeholder: ''
 };
-var _default = SearchInput;
-exports.default = _default;
+var _default = exports.default = SearchInput;