@twreporter/react-components 9.0.2 → 9.1.0-rc.0

package/lib/bookmark-widget/index.js

@@ -1,71 +1,38 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
+var _react = require("react");
 var _reactRedux = require("react-redux");
-
+var _propTypes = _interopRequireDefault(require("prop-types"));
 var _signInHref = require("@twreporter/core/lib/utils/sign-in-href");
-
-var _propTypes = _interopRequireDefault(require("@twreporter/core/lib/constants/prop-types"));
-
-var _propTypes2 = _interopRequireDefault(require("prop-types"));
-
-var _react = _interopRequireDefault(require("react"));
-
+var _propTypes2 = _interopRequireDefault(require("@twreporter/core/lib/constants/prop-types"));
 var _redux = _interopRequireDefault(require("@twreporter/redux"));
-
 var _get = _interopRequireDefault(require("lodash/get"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-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); }
-
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } // @twreporter
+// lodash
 var _ = {
   get: _get["default"]
 };
 var _twreporterRedux$acti = _redux["default"].actions,
-    createSingleBookmark = _twreporterRedux$acti.createSingleBookmark,
-    deleteSingleBookmark = _twreporterRedux$acti.deleteSingleBookmark,
-    getSingleBookmark = _twreporterRedux$acti.getSingleBookmark;
+  createSingleBookmark = _twreporterRedux$acti.createSingleBookmark,
+  deleteSingleBookmark = _twreporterRedux$acti.deleteSingleBookmark,
+  getSingleBookmark = _twreporterRedux$acti.getSingleBookmark;
 var reduxStatePropKeys = _redux["default"].reduxStateFields;
-
 function getHostFromWindowLocation() {
   var defaultHost = 'https://www.twreporter.org';
-
   try {
     var _window$location = window.location,
-        host = _window$location.host,
-        protocol = _window$location.protocol;
-
+      host = _window$location.host,
+      protocol = _window$location.protocol;
     if (host && protocol) {
       return "".concat(protocol, "//").concat(host);
     } else {
@@ -75,185 +42,89 @@ function getHostFromWindowLocation() {
   } catch (err) {
     console.warn('Error on getting `host` and `protocol` from `window.location`:', err);
   }
+  return defaultHost;
 }
-
-var BookmarkWidget = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(BookmarkWidget, _React$PureComponent);
-
-  var _super = _createSuper(BookmarkWidget);
-
-  function BookmarkWidget(props) {
-    var _this;
-
-    _classCallCheck(this, BookmarkWidget);
-
-    _this = _super.call(this, props);
-    _this.addCurrentPageToBookmarks = _this.addCurrentPageToBookmarks.bind(_assertThisInitialized(_this));
-    _this.removeCurrentPageFromBookmarks = _this.removeCurrentPageFromBookmarks.bind(_assertThisInitialized(_this));
-    return _this;
-  }
-
-  _createClass(BookmarkWidget, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      /* TODO: Implement `status` for bookmark widget in redux reducer and action:
-        There should be different states below for the bookmark widget status of an article:
-          unknown: It has not checked the bookmark status yet
-          isChecking: The request to check was made but has not gotten the response yet
-          bookmarked: The article is bookmarked
-          notBookmarked: The article is not bookmarked
-          invalid: There's an error or there's no valid authentication info
-        The current code does not distinguish the `unknown`, `notBookmarked`, `isChecking`, and `invalid` situation.
-        The best result is that we only send request to check bookmark when the status is `unknown`.
-        But now we send request when there's no bookmark data for this component in the redux store when `componentDidMount`, no matter what's the reason of it.
-       */
-      var articleSlug = _.get(this.props, 'articleMeta.slug');
-
-      if (articleSlug && typeof articleSlug === 'string') {
-        var _this$props = this.props,
-            isAuthed = _this$props.isAuthed,
-            toAutoCheck = _this$props.toAutoCheck;
-
-        if (isAuthed && toAutoCheck && !this.checkIfThisArticleBookmarked()) {
-          var _this$props2 = this.props,
-              jwt = _this$props2.jwt,
-              userID = _this$props2.userID,
-              _getSingleBookmark = _this$props2.getSingleBookmark;
-
-          _getSingleBookmark(jwt, userID, articleSlug, getHostFromWindowLocation());
-        }
-      } else {
-        console.error('`this.props.articleMeta.slug` must be an unempty string, but is', articleSlug);
+var BookmarkWidget = function BookmarkWidget(_ref) {
+  var articleMeta = _ref.articleMeta,
+    renderIcon = _ref.renderIcon,
+    _ref$toAutoCheck = _ref.toAutoCheck,
+    toAutoCheck = _ref$toAutoCheck === void 0 ? true : _ref$toAutoCheck;
+  var dispatch = (0, _reactRedux.useDispatch)();
+  var jwt = (0, _reactRedux.useSelector)(function (state) {
+    return _.get(state, [reduxStatePropKeys.auth, 'accessToken']);
+  });
+  var userID = (0, _reactRedux.useSelector)(function (state) {
+    return _.get(state, [reduxStatePropKeys.auth, 'userInfo', 'user_id']);
+  });
+  var isAuthed = (0, _reactRedux.useSelector)(function (state) {
+    return _.get(state, [reduxStatePropKeys.auth, 'isAuthed']);
+  });
+  var bookmark = (0, _reactRedux.useSelector)(function (state) {
+    var bookmarkInStore = _.get(state, [reduxStatePropKeys.bookmarkWidget, 'bookmark']);
+    var currentSlug = _.get(articleMeta, 'slug');
+    return currentSlug && currentSlug === _.get(bookmarkInStore, 'slug') ? bookmarkInStore : null;
+  });
+  (0, _react.useEffect)(function () {
+    /* TODO: Implement `status` for bookmark widget in redux reducer and action:
+      There should be different states below for the bookmark widget status of an article:
+        unknown: It has not checked the bookmark status yet
+        isChecking: The request to check was made but has not gotten the response yet
+        bookmarked: The article is bookmarked
+        notBookmarked: The article is not bookmarked
+        invalid: There's an error or there's no valid authentication info
+      The current code does not distinguish the `unknown`, `notBookmarked`, `isChecking`, and `invalid` situation.
+      The best result is that we only send request to check bookmark when the status is `unknown`.
+      But now we send request when there's no bookmark data for this component in the redux store when `componentDidMount`, no matter what's the reason of it.
+     */
+    var articleSlug = _.get(articleMeta, 'slug');
+    if (articleSlug && typeof articleSlug === 'string') {
+      if (isAuthed && toAutoCheck && !checkIfThisArticleBookmarked()) {
+        dispatch(getSingleBookmark(jwt, userID, articleSlug, getHostFromWindowLocation()));
       }
+    } else {
+      console.error('`articleMeta.slug` must be a non-empty string, but is', articleSlug);
     }
-  }, {
-    key: "redirectToLoginPageIfNotAuthorized",
-    value: function redirectToLoginPageIfNotAuthorized() {
-      var _this$props3 = this.props,
-          isAuthed = _this$props3.isAuthed,
-          jwt = _this$props3.jwt;
-
-      if (!isAuthed || !jwt) {
-        var currentHref = typeof window === 'undefined' ? '' : window.location.href;
-        window.location.href = (0, _signInHref.getSignInHref)(currentHref);
-      }
-    }
-  }, {
-    key: "addCurrentPageToBookmarks",
-    value: function addCurrentPageToBookmarks() {
-      this.redirectToLoginPageIfNotAuthorized();
-      var _this$props4 = this.props,
-          jwt = _this$props4.jwt,
-          userID = _this$props4.userID,
-          createSingleBookmark = _this$props4.createSingleBookmark,
-          articleMeta = _this$props4.articleMeta;
-
-      var bookmarkToBeCreated = _objectSpread(_objectSpread({}, articleMeta), {}, {
-        host: getHostFromWindowLocation()
-      });
-
-      return createSingleBookmark(jwt, userID, bookmarkToBeCreated);
-    }
-  }, {
-    key: "removeCurrentPageFromBookmarks",
-    value: function removeCurrentPageFromBookmarks() {
-      this.redirectToLoginPageIfNotAuthorized();
-      var _this$props5 = this.props,
-          jwt = _this$props5.jwt,
-          userID = _this$props5.userID,
-          deleteSingleBookmark = _this$props5.deleteSingleBookmark,
-          bookmark = _this$props5.bookmark;
-
-      var bookmarkID = _.get(bookmark, 'id');
-
-      if (bookmarkID) {
-        deleteSingleBookmark(jwt, userID, bookmarkID);
-      } else {
-        console.error('Error on deleting bookmark with `BookmarkWidget`: No valid bookmark id.');
-      }
+  }, [articleMeta, isAuthed, toAutoCheck, jwt, userID, dispatch]);
+  var redirectToLoginPageIfNotAuthorized = function redirectToLoginPageIfNotAuthorized() {
+    if (!isAuthed || !jwt) {
+      var currentHref = typeof window === 'undefined' ? '' : window.location.href;
+      window.location.href = (0, _signInHref.getSignInHref)(currentHref);
     }
-  }, {
-    key: "checkIfThisArticleBookmarked",
-    value: function checkIfThisArticleBookmarked() {
-      var bookmark = this.props.bookmark;
-      var isClient = typeof window !== 'undefined';
-
-      if (bookmark && isClient) {
-        var hostFromWindow = getHostFromWindowLocation();
-
-        if (_.get(bookmark, 'host') !== hostFromWindow) {
-          /* Only check the consistency of `host` when client-side rendering. */
-          console.warn('Warning on checking bookmark status in `BookmarkWidget`:', 'The `host` in the bookmark data is diffrent from the `host` in current `window`.', 'host in bookmark:', bookmark.host, 'host in `window.location`:', hostFromWindow);
-        }
-      }
-
-      return Boolean(bookmark);
+  };
+  var addCurrentPageToBookmarks = function addCurrentPageToBookmarks() {
+    redirectToLoginPageIfNotAuthorized();
+    var bookmarkToBeCreated = _objectSpread(_objectSpread({}, articleMeta), {}, {
+      host: getHostFromWindowLocation()
+    });
+    dispatch(createSingleBookmark(jwt, userID, bookmarkToBeCreated));
+  };
+  var removeCurrentPageFromBookmarks = function removeCurrentPageFromBookmarks() {
+    redirectToLoginPageIfNotAuthorized();
+    var bookmarkID = _.get(bookmark, 'id');
+    if (bookmarkID) {
+      dispatch(deleteSingleBookmark(jwt, userID, bookmarkID));
+    } else {
+      console.error('Error on deleting bookmark with `BookmarkWidget`: No valid bookmark id.');
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var articleMeta = this.props.articleMeta;
-      var slug = articleMeta.slug;
-
-      if (!slug) {
-        return null;
+  };
+  var checkIfThisArticleBookmarked = function checkIfThisArticleBookmarked() {
+    if (bookmark) {
+      var hostFromWindow = getHostFromWindowLocation();
+      if (_.get(bookmark, 'host') !== hostFromWindow) {
+        console.warn('Warning on checking bookmark status in `BookmarkWidget`:', 'The `host` in the bookmark data is different from the `host` in current `window`.', 'host in bookmark:', bookmark.host, 'host in `window.location`:', hostFromWindow);
       }
-
-      var isBookmarked = this.checkIfThisArticleBookmarked();
-      var renderIcon = this.props.renderIcon;
-      return typeof renderIcon === 'function' ? renderIcon(isBookmarked, this.addCurrentPageToBookmarks, this.removeCurrentPageFromBookmarks) : null;
     }
-  }]);
-
-  return BookmarkWidget;
-}(_react["default"].PureComponent);
-
-BookmarkWidget.defaultProps = {
-  articleMeta: {},
-  bookmark: null,
-  isAuthed: false,
-  jwt: '',
-  userID: NaN,
-  toAutoCheck: true
+    return Boolean(bookmark);
+  };
+  if (!articleMeta.slug) {
+    return null;
+  }
+  var isBookmarked = checkIfThisArticleBookmarked();
+  return typeof renderIcon === 'function' ? renderIcon(isBookmarked, addCurrentPageToBookmarks, removeCurrentPageFromBookmarks) : null;
 };
 BookmarkWidget.propTypes = {
-  articleMeta: _propTypes["default"].articleMetaForBookmark,
-  // Props below are provided by redux
-  bookmark: _propTypes["default"].bookmark,
-  createSingleBookmark: _propTypes2["default"].func.isRequired,
-  deleteSingleBookmark: _propTypes2["default"].func.isRequired,
-  getSingleBookmark: _propTypes2["default"].func.isRequired,
-  isAuthed: _propTypes2["default"].bool,
-  jwt: _propTypes2["default"].string,
-  userID: _propTypes2["default"].number,
-  renderIcon: _propTypes2["default"].func.isRequired,
-  toAutoCheck: _propTypes2["default"].bool
+  articleMeta: _propTypes2["default"].articleMetaForBookmark.isRequired,
+  renderIcon: _propTypes["default"].func.isRequired,
+  toAutoCheck: _propTypes["default"].bool
 };
-
-function mapStateToProps(state, ownProps) {
-  var currentSlug = _.get(ownProps, 'articleMeta.slug');
-
-  var jwt = _.get(state, [reduxStatePropKeys.auth, 'accessToken']);
-
-  var userID = _.get(state, [reduxStatePropKeys.auth, 'userInfo', 'user_id']);
-
-  var isAuthed = _.get(state, [reduxStatePropKeys.auth, 'isAuthed']);
-
-  var bookmarkInStore = _.get(state, [reduxStatePropKeys.bookmarkWidget, 'bookmark']);
-
-  var bookmarkForThisWidget = currentSlug && currentSlug === _.get(bookmarkInStore, 'slug') ? bookmarkInStore : null;
-  return {
-    bookmark: bookmarkForThisWidget,
-    isAuthed: isAuthed,
-    jwt: jwt,
-    userID: userID
-  };
-}
-
-var _default = (0, _reactRedux.connect)(mapStateToProps, {
-  getSingleBookmark: getSingleBookmark,
-  createSingleBookmark: createSingleBookmark,
-  deleteSingleBookmark: deleteSingleBookmark
-})(BookmarkWidget);
-
-exports["default"] = _default;
+var _default = exports["default"] = BookmarkWidget;

package/lib/button/components/iconButton.js

@@ -4,35 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _theme = require("../utils/theme");
-
 var _enums = require("../enums");
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _theme2 = require("@twreporter/core/lib/constants/theme");
-
 var _excluded = ["iconComponent", "theme", "type", "disabled", "active"];
-
-var _templateObject;
-
+var _templateObject; // utils
+// enums
+// @twreporter
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var ButtonContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "iconButton__ButtonContainer",
   componentId: "sc-1v7s35n-0"
@@ -47,32 +34,27 @@ var ButtonContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }, function (props) {
   return props.$hoverColor;
 }));
-
 var IconButton = function IconButton(_ref) {
   var iconComponent = _ref.iconComponent,
-      _ref$theme = _ref.theme,
-      theme = _ref$theme === void 0 ? _theme2.THEME.normal : _ref$theme,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? _enums.Type.PRIMARY : _ref$type,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$active = _ref.active,
-      active = _ref$active === void 0 ? false : _ref$active,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    _ref$theme = _ref.theme,
+    theme = _ref$theme === void 0 ? _theme2.THEME.normal : _ref$theme,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? _enums.Type.PRIMARY : _ref$type,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$active = _ref.active,
+    active = _ref$active === void 0 ? false : _ref$active,
+    props = _objectWithoutProperties(_ref, _excluded);
   var themeFunc = type === _enums.Type.PRIMARY ? _theme.getPrimaryIconButtonTheme : _theme.getSecondaryIconButtonTheme;
-
   var _themeFunc = themeFunc(theme, active, disabled),
-      color = _themeFunc.color,
-      hoverColor = _themeFunc.hoverColor;
-
+    color = _themeFunc.color,
+    hoverColor = _themeFunc.hoverColor;
   return /*#__PURE__*/_react["default"].createElement(ButtonContainer, _extends({
     $color: color,
     $hoverColor: hoverColor,
     $disabled: disabled
   }, props), iconComponent);
 };
-
 IconButton.propTypes = {
   iconComponent: _propTypes["default"].element.isRequired,
   theme: _propTypes["default"].oneOf(Object.values(_theme2.THEME)),
@@ -82,5 +64,4 @@ IconButton.propTypes = {
 };
 IconButton.THEME = _theme2.THEME;
 IconButton.Type = _enums.Type;
-var _default = IconButton;
-exports["default"] = _default;
+var _default = exports["default"] = IconButton;

package/lib/button/components/iconWithTextButton.js

@@ -4,27 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _theme = require("../utils/theme");
-
 var _paragraph = require("../../text/paragraph");
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _theme2 = require("@twreporter/core/lib/constants/theme");
-
-var _templateObject;
-
+var _templateObject; // utils
+// components
+// @twreporter
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var ButtonContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "iconWithTextButton__ButtonContainer",
   componentId: "sc-1f9d1q4-0"
@@ -39,7 +30,6 @@ var ButtonContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }, function (props) {
   return props.$hoverColor;
 }));
-
 var StyledP4 = /*#__PURE__*/(0, _styledComponents["default"])(_paragraph.P4).withConfig({
   displayName: "iconWithTextButton__StyledP4",
   componentId: "sc-1f9d1q4-1"
@@ -48,24 +38,21 @@ var StyledP4 = /*#__PURE__*/(0, _styledComponents["default"])(_paragraph.P4).wit
 }, function (props) {
   return props.$hideText ? '0' : '1';
 });
-
 var IconWithTextButton = function IconWithTextButton(_ref) {
   var _ref$text = _ref.text,
-      text = _ref$text === void 0 ? '' : _ref$text,
-      iconComponent = _ref.iconComponent,
-      _ref$theme = _ref.theme,
-      theme = _ref$theme === void 0 ? _theme2.THEME.normal : _ref$theme,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$active = _ref.active,
-      active = _ref$active === void 0 ? false : _ref$active,
-      _ref$hideText = _ref.hideText,
-      hideText = _ref$hideText === void 0 ? false : _ref$hideText;
-
+    text = _ref$text === void 0 ? '' : _ref$text,
+    iconComponent = _ref.iconComponent,
+    _ref$theme = _ref.theme,
+    theme = _ref$theme === void 0 ? _theme2.THEME.normal : _ref$theme,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$active = _ref.active,
+    active = _ref$active === void 0 ? false : _ref$active,
+    _ref$hideText = _ref.hideText,
+    hideText = _ref$hideText === void 0 ? false : _ref$hideText;
   var _getIconWithTextButto = (0, _theme.getIconWithTextButtonTheme)(theme, active, disabled),
-      color = _getIconWithTextButto.color,
-      hoverColor = _getIconWithTextButto.hoverColor;
-
+    color = _getIconWithTextButto.color,
+    hoverColor = _getIconWithTextButto.hoverColor;
   return /*#__PURE__*/_react["default"].createElement(ButtonContainer, {
     $color: color,
     $hoverColor: hoverColor,
@@ -76,7 +63,6 @@ var IconWithTextButton = function IconWithTextButton(_ref) {
     $hideText: hideText
   }));
 };
-
 IconWithTextButton.propTypes = {
   text: _propTypes["default"].string,
   iconComponent: _propTypes["default"].element.isRequired,
@@ -86,5 +72,4 @@ IconWithTextButton.propTypes = {
   hideText: _propTypes["default"].bool
 };
 IconWithTextButton.THEME = _theme2.THEME;
-var _default = IconWithTextButton;
-exports["default"] = _default;
+var _default = exports["default"] = IconWithTextButton;