@bonlineza/luxity-lib 2.7.3 → 2.8.0

package/BrandSelector.js

@@ -28,6 +28,9 @@
   function _createClass(Constructor, protoProps, staticProps) {
     if (protoProps) _defineProperties(Constructor.prototype, protoProps);
     if (staticProps) _defineProperties(Constructor, staticProps);
+    Object.defineProperty(Constructor, "prototype", {
+      writable: false
+    });
     return Constructor;
   }
 
@@ -47,7 +50,7 @@
   }
 
   function _extends() {
-    _extends = Object.assign || function (target) {
+    _extends = Object.assign ? Object.assign.bind() : function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
 
@@ -60,7 +63,6 @@
 
       return target;
     };
-
     return _extends.apply(this, arguments);
   }
 
@@ -76,22 +78,24 @@
         configurable: true
       }
     });
+    Object.defineProperty(subClass, "prototype", {
+      writable: false
+    });
     if (superClass) _setPrototypeOf(subClass, superClass);
   }
 
   function _getPrototypeOf(o) {
-    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
       return o.__proto__ || Object.getPrototypeOf(o);
     };
     return _getPrototypeOf(o);
   }
 
   function _setPrototypeOf(o, p) {
-    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
       o.__proto__ = p;
       return o;
     };
-
     return _setPrototypeOf(o, p);
   }
 
@@ -101,7 +105,7 @@
     if (typeof Proxy === "function") return true;
 
     try {
-      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+      Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
       return true;
     } catch (e) {
       return false;
@@ -155,6 +159,8 @@
   function _possibleConstructorReturn(self, call) {
     if (call && (typeof call === "object" || typeof call === "function")) {
       return call;
+    } else if (call !== void 0) {
+      throw new TypeError("Derived constructors may only return object or undefined");
     }
 
     return _assertThisInitialized(self);
@@ -200,7 +206,7 @@
   }
 
   function _iterableToArray(iter) {
-    if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
   }
 
   function _unsupportedIterableToArray(o, minLen) {
@@ -230,7 +236,7 @@
     return message.replace(':error_code', error.status || 'Network Down');
   };
 
-  var LuxityPageReadyContext = React__default.createContext({
+  var LuxityPageReadyContext = /*#__PURE__*/React__default.createContext({
     data: null
   });
   /**
@@ -278,7 +284,7 @@
             _onData = _this$props.onData,
             children = _this$props.children;
         var data = this.state.data;
-        return React__default.createElement(PageReady, {
+        return /*#__PURE__*/React__default.createElement(PageReady, {
           ref: function ref(inst) {
             _this2.pageReadyInstance = inst;
           },
@@ -305,10 +311,10 @@
           customErrorMessage: customErrorMessage,
           customErrorHandler: customErrorHandler,
           renderCustomLoader: function renderCustomLoader() {
-            return React__default.createElement(EllipsisLoader, null);
+            return /*#__PURE__*/React__default.createElement(EllipsisLoader, null);
           },
           errorMessageInterpreter: interpretErrorMessage
-        }, React__default.createElement(LuxityPageReadyContext.Provider, {
+        }, /*#__PURE__*/React__default.createElement(LuxityPageReadyContext.Provider, {
           value: {
             data: data
           }
@@ -332,27 +338,9 @@
     }
   };
 
-  function _templateObject2() {
-    var data = _taggedTemplateLiteral(["\n  padding: 1rem 3.5rem;\n  cursor: pointer;\n  letter-spacing: 1.3px;\n  border-style: none;\n  text-transform: uppercase;\n  font-size: 12px;\n  color: #fff;\n  transition: 0.2s ease-in-out;\n  outline: none;\n  min-width: 150px;\n"]);
-
-    _templateObject2 = function _templateObject2() {
-      return data;
-    };
-
-    return data;
-  }
-
-  function _templateObject() {
-    var data = _taggedTemplateLiteral(["\n  cursor: not-allowed;\n  opacity: 0.4;\n"]);
-
-    _templateObject = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
-  var disabledButtonStyle = styled.css(_templateObject());
-  var baseButtonStyle = styled.css(_templateObject2());
+  var _templateObject, _templateObject2;
+  var disabledButtonStyle = styled.css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  cursor: not-allowed;\n  opacity: 0.4;\n"])));
+  var baseButtonStyle = styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 1rem 3.5rem;\n  cursor: pointer;\n  letter-spacing: 1.3px;\n  border-style: none;\n  text-transform: uppercase;\n  font-size: 12px;\n  color: #fff;\n  transition: 0.2s ease-in-out;\n  outline: none;\n  min-width: 150px;\n"])));
 
   var theme = {
     breakpoints: ['40em', '52em', '64em'],
@@ -375,25 +363,19 @@
   };
 
   var themed = (function (Component) {
-    return React.forwardRef(function (props, ref) {
-      return React__default.createElement(styled.ThemeProvider, {
+    return /*#__PURE__*/React.forwardRef(function (props, ref) {
+      return /*#__PURE__*/React__default.createElement(styled.ThemeProvider, {
         theme: theme
-      }, React__default.createElement(Component, _extends({}, props, {
+      }, /*#__PURE__*/React__default.createElement(Component, _extends({}, props, {
         ref: ref
       })));
     });
   });
 
-  function _templateObject$1() {
-    var data = _taggedTemplateLiteral(["\n  ", ";\n  background-color: transparent;\n  color: ", ";\n  &:hover {\n    color: ", ";\n  }\n  &:disabled {\n    ", ";\n    color: ", ";\n  }\n"]);
+  var _excluded = ["children"];
 
-    _templateObject$1 = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
-  var Button = styled__default.button(_templateObject$1(), baseButtonStyle, function (props) {
+  var _templateObject$1;
+  var Button = styled__default.button(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  ", ";\n  background-color: transparent;\n  color: ", ";\n  &:hover {\n    color: ", ";\n  }\n  &:disabled {\n    ", ";\n    color: ", ";\n  }\n"])), baseButtonStyle, function (props) {
     return props.theme.colors.base;
   }, function (props) {
     return props.theme.colors.primary;
@@ -403,9 +385,9 @@
 
   var TextButton = function TextButton(_ref) {
     var children = _ref.children,
-        restProps = _objectWithoutProperties(_ref, ["children"]);
+        restProps = _objectWithoutProperties(_ref, _excluded);
 
-    return React__default.createElement(Button, restProps, children);
+    return /*#__PURE__*/React__default.createElement(Button, restProps, children);
   };
 
   TextButton.defaultProps = {
@@ -413,16 +395,10 @@
   };
   var TextButton$1 = themed(TextButton);
 
-  function _templateObject$2() {
-    var data = _taggedTemplateLiteral(["\n  color: ", ";\n  background-color: ", ";\n  &:hover {\n    color: ", ";\n    background-color: ", ";\n  }\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n  }\n"]);
-
-    _templateObject$2 = function _templateObject() {
-      return data;
-    };
+  var _excluded$1 = ["children"];
 
-    return data;
-  }
-  var Button$1 = styled__default(TextButton$1)(_templateObject$2(), function (props) {
+  var _templateObject$2;
+  var Button$1 = styled__default(TextButton$1)(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n  color: ", ";\n  background-color: ", ";\n  &:hover {\n    color: ", ";\n    background-color: ", ";\n  }\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), function (props) {
     return props.theme.colors.ntrlMin;
   }, function (props) {
     return props.theme.colors.primary;
@@ -438,9 +414,9 @@
 
   var InvertedTextButton = function InvertedTextButton(_ref) {
     var children = _ref.children,
-        restProps = _objectWithoutProperties(_ref, ["children"]);
+        restProps = _objectWithoutProperties(_ref, _excluded$1);
 
-    return React__default.createElement(Button$1, restProps, children);
+    return /*#__PURE__*/React__default.createElement(Button$1, restProps, children);
   };
 
   var InvertedTextButton$1 = themed(InvertedTextButton);
@@ -452,33 +428,15 @@
     lg: '1200px'
   };
 
-  function _templateObject2$1() {
-    var data = _taggedTemplateLiteral(["\n  .multiselector__selected-items,\n  .multiselector__selectable-items {\n    display: flex;\n    flex-flow: wrap;\n    margin-left: calc(-1 * ", ");\n    button {\n      &:hover {\n        color: ", ";\n        background-color: ", ";\n      }\n      border-color: ", ";\n      background-color: ", ";\n      color: ", ";\n      padding: ", ";\n      text-transform: none;\n      box-sizing: border-box;\n      animation: ", " ease-in-out\n        ", " forwards;\n      flex-basis: calc(25% - ", ");\n      margin-bottom: ", ";\n      margin-left: ", ";\n      text-overflow: ellipsis;\n      overflow-x: hidden;\n      min-height: 40px;\n\n      @media (max-width: ", ") {\n        flex-basis: calc(50% - ", ");\n      }\n    }\n  }\n\n  .multiselector__footer {\n    display: flex;\n    justify-content: center;\n    button {\n      &:hover {\n        color: ", ";\n        background-color: ", ";\n      }\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"]);
-
-    _templateObject2$1 = function _templateObject2() {
-      return data;
-    };
-
-    return data;
-  }
-
-  function _templateObject$3() {
-    var data = _taggedTemplateLiteral(["\n  from {\n    margin: 0;\n    max-height: 0px;\n    opacity: 0;\n  }\n  to {\n    max-height: ", ";\n    opacity: 1;\n  }\n"]);
-
-    _templateObject$3 = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
+  var _templateObject$3, _templateObject2$1;
   var ALL_ITEM = {
     id: 'ALL',
     name: 'ALL'
   };
   var multiSelectorItemMaxHeight = '3rem';
   var multiSelectorItemAnimationDuration = '300ms';
-  var multiselectorItemFadeIn = styled.keyframes(_templateObject$3(), multiSelectorItemMaxHeight);
-  var StyledMultiselector = styled__default.div(_templateObject2$1(), function (props) {
+  var multiselectorItemFadeIn = styled.keyframes(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n  from {\n    margin: 0;\n    max-height: 0px;\n    opacity: 0;\n  }\n  to {\n    max-height: ", ";\n    opacity: 1;\n  }\n"])), multiSelectorItemMaxHeight);
+  var StyledMultiselector = styled__default.div(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n  .multiselector__selected-items,\n  .multiselector__selectable-items {\n    display: flex;\n    flex-flow: wrap;\n    margin-left: calc(-1 * ", ");\n    button {\n      &:hover {\n        color: ", ";\n        background-color: ", ";\n      }\n      border-color: ", ";\n      background-color: ", ";\n      color: ", ";\n      padding: ", ";\n      text-transform: none;\n      box-sizing: border-box;\n      animation: ", " ease-in-out\n        ", " forwards;\n      flex-basis: calc(25% - ", ");\n      margin-bottom: ", ";\n      margin-left: ", ";\n      text-overflow: ellipsis;\n      overflow-x: hidden;\n      min-height: 40px;\n\n      @media (max-width: ", ") {\n        flex-basis: calc(50% - ", ");\n      }\n    }\n  }\n\n  .multiselector__footer {\n    display: flex;\n    justify-content: center;\n    button {\n      &:hover {\n        color: ", ";\n        background-color: ", ";\n      }\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"])), function (props) {
     return props.theme.marginPaddings[2];
   }, function (props) {
     return props.theme.colors.ntrlMin;
@@ -645,19 +603,19 @@
             selected = _this$state.selected,
             pagination = _this$state.pagination,
             isLoading = _this$state.isLoading;
-        return React__default.createElement(StyledMultiselector, null, React__default.createElement("div", {
+        return /*#__PURE__*/React__default.createElement(StyledMultiselector, null, /*#__PURE__*/React__default.createElement("div", {
           "data-qe-id": identifier,
           className: "".concat(className, " ").concat(baseClass)
-        }, React__default.createElement("div", {
+        }, /*#__PURE__*/React__default.createElement("div", {
           className: "".concat(baseClass, "__selected-items")
         }, selected.map(function (item) {
-          return React__default.createElement(ItemRenderer, {
+          return /*#__PURE__*/React__default.createElement(ItemRenderer, {
             key: item.id,
             item: item,
             onSelect: _this.onRemoveItem,
             selected: true
           });
-        })), React__default.createElement(LuxityPageReady, {
+        })), /*#__PURE__*/React__default.createElement(LuxityPageReady, {
           ref: function ref(inst) {
             _this.pageReady = inst;
           },
@@ -666,18 +624,18 @@
           getRequestPromise: function getRequestPromise() {
             return triggerRequest();
           }
-        }), React__default.createElement("div", {
+        }), /*#__PURE__*/React__default.createElement("div", {
           className: "".concat(baseClass, "__selectable-items")
         }, list.map(function (item) {
-          return React__default.createElement(ItemRenderer, {
+          return /*#__PURE__*/React__default.createElement(ItemRenderer, {
             key: item.id,
             item: item,
             onSelect: _this.onAddItem,
             selected: false
           });
-        })), React__default.createElement("div", {
+        })), /*#__PURE__*/React__default.createElement("div", {
           className: "".concat(baseClass, "__footer")
-        }, React__default.createElement(InvertedTextButton$1, {
+        }, /*#__PURE__*/React__default.createElement(InvertedTextButton$1, {
           disabled: isLoading || !pagination.has_more_pages,
           onClick: _this.props.increaseLimit,
           type: "button"
@@ -693,7 +651,7 @@
       return _this;
     }
 
-    return GraphQLMultiSelector;
+    return _createClass(GraphQLMultiSelector);
   }(React__default.Component);
 
   GraphQLMultiSelector.defaultProps = {
@@ -702,41 +660,23 @@
   var GraphQLMultiSelector$1 = themed(GraphQLMultiSelector);
 
   var Search = (function (props) {
-    return React__default.createElement("svg", _extends({
+    return /*#__PURE__*/React__default.createElement("svg", _extends({
       width: "15",
       height: "15",
       viewBox: "0 0 15 15",
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
-    }, props), React__default.createElement("path", {
+    }, props), /*#__PURE__*/React__default.createElement("path", {
       d: "M14.82 13.93L11.21 10.32C12.1 9.23 12.64 7.83 12.64 6.31C12.64 2.83 9.81 0 6.32 0C2.83 0 0 2.83 0 6.32C0 9.81 2.83 12.64 6.32 12.64C7.84 12.64 9.23 12.1 10.32 11.21L13.93 14.81C14.17 15.06 14.57 15.06 14.81 14.81C15.06 14.57 15.06 14.18 14.82 13.93ZM6.32 11.38C3.53 11.38 1.25 9.11 1.25 6.32C1.25 3.53 3.52 1.25 6.32 1.25C9.11 1.25 11.39 3.52 11.39 6.32C11.39 9.12 9.11 11.38 6.32 11.38Z",
       fill: "currentColor"
     }));
   });
 
-  function _templateObject2$2() {
-    var data = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  padding-bottom: ", ";\n  border-bottom: 1px solid ", ";\n  margin-bottom: ", ";\n  margin-top: ", ";\n  width: 100%;\n  align-items: center;\n"]);
-
-    _templateObject2$2 = function _templateObject2() {
-      return data;
-    };
-
-    return data;
-  }
-
-  function _templateObject$4() {
-    var data = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: bold;\n  margin-bottom: 0;\n  text-transform: uppercase;\n"]);
-
-    _templateObject$4 = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
-  var Title = styled__default.h1(_templateObject$4(), function (props) {
+  var _templateObject$4, _templateObject2$2;
+  var Title = styled__default.h1(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: bold;\n  margin-bottom: 0;\n  text-transform: uppercase;\n"])), function (props) {
     return props.theme.fontSizes[2];
   });
-  var InterestsSubheadingContainer = styled__default.div(_templateObject2$2(), function (props) {
+  var InterestsSubheadingContainer = styled__default.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  padding-bottom: ", ";\n  border-bottom: 1px solid ", ";\n  margin-bottom: ", ";\n  margin-top: ", ";\n  width: 100%;\n  align-items: center;\n"])), function (props) {
     return props.theme.marginPaddings[1];
   }, function (props) {
     return props.theme.colors.primary;
@@ -750,20 +690,12 @@
     var title = _ref.title,
         children = _ref.children,
         className = _ref.className;
-    return React__default.createElement(InterestsSubheadingContainer, {
+    return /*#__PURE__*/React__default.createElement(InterestsSubheadingContainer, {
       className: className
-    }, React__default.createElement(Title, null, title), React__default.createElement("div", null, children));
+    }, /*#__PURE__*/React__default.createElement(Title, null, title), /*#__PURE__*/React__default.createElement("div", null, children));
   };
 
-  function _templateObject$5() {
-    var data = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n  font-size: ", ";\n\n  .title__search,\n  .title__search {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    min-height: 30px;\n    margin-bottom: ", ";\n\n    svg {\n      margin-left: ", ";\n      fill: ", ";\n      stroke: ", ";\n    }\n\n    input {\n      width: 140px;\n      border: none;\n      font-size: ", ";\n      transition: 0.2s border-color ease-in-out;\n      margin-left: ", ";\n      padding: 0;\n\n      :focus {\n        border-color: ", ";\n        border-bottom: none;\n      }\n    }\n  }\n"]);
-
-    _templateObject$5 = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
+  var _templateObject$5;
 
   var Title$1 = function Title(_ref) {
     var baseClass = _ref.baseClass,
@@ -771,12 +703,12 @@
         title = _ref.title,
         searchPlaceHolder = _ref.searchPlaceHolder,
         onSearchChanged = _ref.onSearchChanged;
-    return React__default.createElement(InterestsSubheading, {
+    return /*#__PURE__*/React__default.createElement(InterestsSubheading, {
       className: "".concat(className, " ").concat(baseClass, "__title"),
       title: title
-    }, React__default.createElement("div", {
+    }, /*#__PURE__*/React__default.createElement("div", {
       className: "title__search"
-    }, React__default.createElement(Search, null), React__default.createElement("input", {
+    }, /*#__PURE__*/React__default.createElement(Search, null), /*#__PURE__*/React__default.createElement("input", {
       placeholder: searchPlaceHolder,
       type: "text",
       name: "search",
@@ -784,7 +716,7 @@
     })));
   };
 
-  var StyledTitle = styled__default(Title$1)(_templateObject$5(), function (props) {
+  var StyledTitle = styled__default(Title$1)(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n  font-size: ", ";\n\n  .title__search,\n  .title__search {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    min-height: 30px;\n    margin-bottom: ", ";\n\n    svg {\n      margin-left: ", ";\n      fill: ", ";\n      stroke: ", ";\n    }\n\n    input {\n      width: 140px;\n      border: none;\n      font-size: ", ";\n      transition: 0.2s border-color ease-in-out;\n      margin-left: ", ";\n      padding: 0;\n\n      :focus {\n        border-color: ", ";\n        border-bottom: none;\n      }\n    }\n  }\n"])), function (props) {
     return props.theme.marginPaddings[2];
   }, function (props) {
     return props.theme.fontSizes[2];
@@ -815,19 +747,6 @@
 
     var _super = _createSuper(LuxityGraphQLMultiselector);
 
-    _createClass(LuxityGraphQLMultiselector, null, [{
-      key: "getDerivedStateFromProps",
-      value: function getDerivedStateFromProps(props, prevState) {
-        if (prevState.category !== props.category) {
-          return {
-            category: props.category
-          };
-        }
-
-        return null;
-      }
-    }]);
-
     function LuxityGraphQLMultiselector(props) {
       var _this;
 
@@ -835,7 +754,7 @@
 
       _this = _super.call(this, props);
 
-      _defineProperty(_assertThisInitialized(_this), "multiSelectorRef", React__default.createRef());
+      _defineProperty(_assertThisInitialized(_this), "multiSelectorRef", /*#__PURE__*/React__default.createRef());
 
       _defineProperty(_assertThisInitialized(_this), "increaseLimit", function () {
         _this.setState(function (prevState) {
@@ -874,14 +793,14 @@
             graphApi = _this$props.graphApi,
             identifier = _this$props.identifier,
             requestInstance = _this$props.requestInstance;
-        return React__default.createElement("div", {
+        return /*#__PURE__*/React__default.createElement("div", {
           className: baseClass
-        }, React__default.createElement(Title$2, {
+        }, /*#__PURE__*/React__default.createElement(Title$2, {
           title: title,
           baseClass: baseClass,
           searchPlaceHolder: searchPlaceHolder,
           onSearchChanged: _this.onSearchChanged
-        }), React__default.createElement(React.Fragment, null, React__default.createElement(GraphQLMultiSelector$1, {
+        }), /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(GraphQLMultiSelector$1, {
           triggerRequest: function triggerRequest() {
             return requestInstance.post(graphApi, {
               query: getGraphQuery(limit, 1, 'id|desc', category, nameFilter)
@@ -910,10 +829,21 @@
       value: function componentDidUpdate(prevProps) {
         var _this$multiSelectorRe;
 
-        if (prevProps.category !== this.props.category && ((_this$multiSelectorRe = this.multiSelectorRef) === null || _this$multiSelectorRe === void 0 ? void 0 : _this$multiSelectorRe.current)) {
+        if (prevProps.category !== this.props.category && (_this$multiSelectorRe = this.multiSelectorRef) !== null && _this$multiSelectorRe !== void 0 && _this$multiSelectorRe.current) {
           this.multiSelectorRef.current.emptySelected();
         }
       }
+    }], [{
+      key: "getDerivedStateFromProps",
+      value: function getDerivedStateFromProps(props, prevState) {
+        if (prevState.category !== props.category) {
+          return {
+            category: props.category
+          };
+        }
+
+        return null;
+      }
     }]);
 
     return LuxityGraphQLMultiselector;
@@ -926,16 +856,10 @@
     baseQueryLimit: 12
   };
 
-  function _templateObject$6() {
-    var data = _taggedTemplateLiteral(["\n  ", ";\n  background-color: ", ";\n  color: ", ";\n  &:active,\n  &:hover {\n    background-color: #fff;\n    color: ", ";\n  }\n\n  &:disabled {\n    ", "\n\n    &:hover {\n      background-color: ", ";\n      color: #ffff;\n    }\n  }\n"]);
-
-    _templateObject$6 = function _templateObject() {
-      return data;
-    };
+  var _excluded$2 = ["children"];
 
-    return data;
-  }
-  var Button$2 = styled__default.button(_templateObject$6(), baseButtonStyle, function (props) {
+  var _templateObject$6;
+  var Button$2 = styled__default.button(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n  ", ";\n  background-color: ", ";\n  color: ", ";\n  &:active,\n  &:hover {\n    background-color: #fff;\n    color: ", ";\n  }\n\n  &:disabled {\n    ", "\n\n    &:hover {\n      background-color: ", ";\n      color: #ffff;\n    }\n  }\n"])), baseButtonStyle, function (props) {
     return props.theme.colors.primary;
   }, function (props) {
     return props.theme.colors.ntrlMin;
@@ -947,23 +871,15 @@
 
   var PrimaryButton = function PrimaryButton(_ref) {
     var children = _ref.children,
-        restProps = _objectWithoutProperties(_ref, ["children"]);
+        restProps = _objectWithoutProperties(_ref, _excluded$2);
 
-    return React__default.createElement(Button$2, restProps, children);
+    return /*#__PURE__*/React__default.createElement(Button$2, restProps, children);
   };
 
   var PrimaryButton$1 = themed(PrimaryButton);
 
-  function _templateObject$7() {
-    var data = _taggedTemplateLiteral(["\n  color: ", ";\n  border: 1px solid ", ";\n  background-color: ", ";\n  &:hover {\n    color: ", ";\n    background-color: ", ";\n  }\n"]);
-
-    _templateObject$7 = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
-  var BaseButton = styled__default.button(_templateObject$7(), function (props) {
+  var _templateObject$7;
+  var BaseButton = styled__default.button(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n  color: ", ";\n  border: 1px solid ", ";\n  background-color: ", ";\n  &:hover {\n    color: ", ";\n    background-color: ", ";\n  }\n"])), function (props) {
     return props.theme.colors.base;
   }, function (props) {
     return props.theme.colors.borderColor;
@@ -986,7 +902,7 @@
         onSelect(item);
       }
     };
-    return selected ? React__default.createElement(PrimaryButton$1, props, item.name) : React__default.createElement(UnselectedButton, props, item.name);
+    return selected ? /*#__PURE__*/React__default.createElement(PrimaryButton$1, props, item.name) : /*#__PURE__*/React__default.createElement(UnselectedButton, props, item.name);
   };
 
   var BrandSelector = function BrandSelector(_ref) {
@@ -997,7 +913,7 @@
         getGraphQuery = _ref.getGraphQuery,
         resultProcessor = _ref.resultProcessor,
         requestInstance = _ref.requestInstance;
-    return React__default.createElement(LuxityGraphQLMultiselector, {
+    return /*#__PURE__*/React__default.createElement(LuxityGraphQLMultiselector, {
       baseQueryLimit: 16,
       title: "Brands",
       queryId: "getBrands",

package/Checkbox.js

@@ -8,7 +8,7 @@
   var styled__default = 'default' in styled ? styled['default'] : styled;
 
   function _extends() {
-    _extends = Object.assign || function (target) {
+    _extends = Object.assign ? Object.assign.bind() : function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
 
@@ -21,7 +21,6 @@
 
       return target;
     };
-
     return _extends.apply(this, arguments);
   }
 
@@ -46,14 +45,17 @@
   }
 
   function _iterableToArrayLimit(arr, i) {
-    if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+
+    if (_i == null) return;
     var _arr = [];
     var _n = true;
     var _d = false;
-    var _e = undefined;
+
+    var _s, _e;
 
     try {
-      for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
         _arr.push(_s.value);
 
         if (i && _arr.length === i) break;
@@ -93,20 +95,12 @@
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
 
-  function _templateObject() {
-    var data = _taggedTemplateLiteral(["\n  cursor: pointer;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  span {\n    :before {\n      content: '\\2713';\n      position: absolute;\n      display: none;\n      color: white;\n      left: 0.4em;\n      top: 0.1em;\n      font-size: ", ";\n      text-align: center;\n    }\n  }\n\n  input {\n    font-size: ", ";\n    background-color: ", ";\n    appearance: none;\n    outline: none;\n    height: 1em;\n    width: 1em;\n    margin-right: ", ";\n    border: 1px solid ", ";\n    border-radius: ", ";\n    transition-duration: 0.3s;\n    cursor: pointer;\n\n    &:checked {\n      background-color: ", ";\n    }\n\n    &:checked + span:before {\n      display: block;\n    }\n  }\n"], ["\n  cursor: pointer;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  span {\n    :before {\n      content: '\\\\2713';\n      position: absolute;\n      display: none;\n      color: white;\n      left: 0.4em;\n      top: 0.1em;\n      font-size: ", ";\n      text-align: center;\n    }\n  }\n\n  input {\n    font-size: ", ";\n    background-color: ", ";\n    appearance: none;\n    outline: none;\n    height: 1em;\n    width: 1em;\n    margin-right: ", ";\n    border: 1px solid ", ";\n    border-radius: ", ";\n    transition-duration: 0.3s;\n    cursor: pointer;\n\n    &:checked {\n      background-color: ", ";\n    }\n\n    &:checked + span:before {\n      display: block;\n    }\n  }\n"]);
-
-    _templateObject = function _templateObject() {
-      return data;
-    };
-
-    return data;
-  }
+  var _templateObject;
   var inputMarginRight = '0.2em';
-  var CheckboxLabel = styled__default.label(_templateObject(), function (props) {
+  var CheckboxLabel = styled__default.label(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  cursor: pointer;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  span {\n    :before {\n      content: '\\2713';\n      position: absolute;\n      display: none;\n      color: white;\n      left: 0.4em;\n      top: 0.1em;\n      font-size: ", ";\n      text-align: center;\n    }\n  }\n\n  input {\n    font-size: ", ";\n    background-color: ", ";\n    appearance: none;\n    outline: none;\n    height: 1em;\n    width: 1em;\n    margin-right: ", ";\n    border: 1px solid ", ";\n    border-radius: ", ";\n    transition-duration: 0.3s;\n    cursor: pointer;\n\n    &:checked {\n      background-color: ", ";\n    }\n\n    &:checked + span:before {\n      display: block;\n    }\n  }\n"], ["\n  cursor: pointer;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  span {\n    :before {\n      content: '\\\\2713';\n      position: absolute;\n      display: none;\n      color: white;\n      left: 0.4em;\n      top: 0.1em;\n      font-size: ", ";\n      text-align: center;\n    }\n  }\n\n  input {\n    font-size: ", ";\n    background-color: ", ";\n    appearance: none;\n    outline: none;\n    height: 1em;\n    width: 1em;\n    margin-right: ", ";\n    border: 1px solid ", ";\n    border-radius: ", ";\n    transition-duration: 0.3s;\n    cursor: pointer;\n\n    &:checked {\n      background-color: ", ";\n    }\n\n    &:checked + span:before {\n      display: block;\n    }\n  }\n"])), function (props) {
     var _props$theme;
 
-    return ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.fontSizes.length) ? props.theme.fontSizes[4] : '1em';
+    return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.fontSizes.length ? props.theme.fontSizes[4] : '1em';
   }, function (props) {
     return props.theme.fontSizes[4];
   }, function (props) {
@@ -146,7 +140,7 @@
       setCheckedState(!checked);
     };
 
-    return React__default.createElement(LuxityCheckbox, {
+    return /*#__PURE__*/React__default.createElement(LuxityCheckbox, {
       handleChange: handleCheckChange,
       name: name,
       innerText: innerText,
@@ -180,10 +174,10 @@
   };
 
   var themed = (function (Component) {
-    return React.forwardRef(function (props, ref) {
-      return React__default.createElement(styled.ThemeProvider, {
+    return /*#__PURE__*/React.forwardRef(function (props, ref) {
+      return /*#__PURE__*/React__default.createElement(styled.ThemeProvider, {
         theme: theme
-      }, React__default.createElement(Component, _extends({}, props, {
+      }, /*#__PURE__*/React__default.createElement(Component, _extends({}, props, {
         ref: ref
       })));
     });
@@ -210,18 +204,18 @@
     React.useEffect(function () {
       setErrMsg(errors[name] || null);
     }, [errors, name]);
-    return React__default.createElement(React.Fragment, null, React__default.createElement(CheckboxLabel, {
+    return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(CheckboxLabel, {
       htmlFor: name,
       className: baseClass
-    }, React__default.createElement("input", {
+    }, /*#__PURE__*/React__default.createElement("input", {
       type: "checkbox",
       id: name,
       name: name,
       onChange: handleChange,
       className: "".concat(baseClass, "__input")
-    }), React__default.createElement("span", {
+    }), /*#__PURE__*/React__default.createElement("span", {
       className: "".concat(baseClass, "__inner-text")
-    }, innerText)), errMsg && React__default.createElement(ErrorMessage, {
+    }, innerText)), errMsg && /*#__PURE__*/React__default.createElement(ErrorMessage, {
       className: "".concat(baseClass, "-error")
     }, errMsg));
   };