@twreporter/universal-header 2.6.0-rc.8 → 2.6.0

package/CHANGELOG.md

@@ -3,6 +3,45 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.6.0](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/universal-header@2.6.0-rc.11...@twreporter/universal-header@2.6.0) (2023-06-21)
+
+**Note:** Version bump only for package @twreporter/universal-header
+
+
+
+
+
+# [2.6.0-rc.11](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/universal-header@2.6.0-rc.10...@twreporter/universal-header@2.6.0-rc.11) (2023-06-19)
+
+
+### Bug Fixes
+
+* add isForHambuger prop for MobileIcons ([40d25d4](https://github.com/twreporter/twreporter-npm-packages/commit/40d25d4e2c45215bc3ae0b4ea757db103805a60d))
+
+
+
+
+
+# [2.6.0-rc.10](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/universal-header@2.6.0-rc.9...@twreporter/universal-header@2.6.0-rc.10) (2023-06-19)
+
+**Note:** Version bump only for package @twreporter/universal-header
+
+
+
+
+
+# [2.6.0-rc.9](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/universal-header@2.6.0-rc.8...@twreporter/universal-header@2.6.0-rc.9) (2023-06-19)
+
+
+### Bug Fixes
+
+* add isForHambuger prop for action button ([7595714](https://github.com/twreporter/twreporter-npm-packages/commit/75957143b6ea5707c08f37e65a2647c0383da5c4))
+* fix action button theme ([435a7d1](https://github.com/twreporter/twreporter-npm-packages/commit/435a7d1063af96b0f0f7b23b9e6067dce026cbed))
+
+
+
+
+
 # [2.6.0-rc.8](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/universal-header@2.6.0-rc.7...@twreporter/universal-header@2.6.0-rc.8) (2023-06-17)
 
 **Note:** Version bump only for package @twreporter/universal-header

package/lib/components/action-button-item.js

@@ -31,7 +31,7 @@ var _theme = require("@twreporter/core/lib/constants/theme");
 
 var _map = _interopRequireDefault(require("lodash/map"));
 
-var _excluded = ["actions", "direction", "textType", "buttonWidth", "buttonSize", "callback"];
+var _excluded = ["actions", "direction", "textType", "buttonWidth", "buttonSize", "callback", "isForHambuger"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -94,12 +94,25 @@ var ActionButtonItem = function ActionButtonItem(_ref) {
       _ref$buttonSize = _ref.buttonSize,
       buttonSize = _ref$buttonSize === void 0 ? _actionItemTypes.BUTTON_SIZE_TYPE.S : _ref$buttonSize,
       _ref$callback = _ref.callback,
-      callback = _ref$callback === void 0 ? defaultFunc : _ref$callback;
+      callback = _ref$callback === void 0 ? defaultFunc : _ref$callback,
+      _ref$isForHambuger = _ref.isForHambuger,
+      isForHambuger = _ref$isForHambuger === void 0 ? false : _ref$isForHambuger;
 
   var _useContext = (0, _react.useContext)(_headerContext["default"]),
       theme = _useContext.theme;
 
-  var buttonTheme = direction === _actionItemTypes.DIRECTION_TYPE.row || theme === _theme.THEME.photography ? theme : _theme.THEME.noraml;
+  var buttonTheme;
+
+  if (isForHambuger) {
+    if (theme === _theme.THEME.transparent) {
+      buttonTheme = _theme.THEME.normal;
+    } else {
+      buttonTheme = theme;
+    }
+  } else {
+    buttonTheme = theme;
+  }
+
   var actionKey = action.key;
   var actionLabel = _actions.ACTION_LABEL[textType][actionKey];
   var actionLink = (0, _links.getActionLinks)()[actionKey];
@@ -124,7 +137,8 @@ ActionButtonItem.propTypes = {
   textType: _actionItemTypes.TEXT_PROP_TYPE,
   buttonWidth: _actionItemTypes.BUTTON_WIDTH_PROP_TYPE,
   buttonSize: _actionItemTypes.BUTTON_SIZE_PROP_TYPE,
-  callback: _propTypes["default"].func
+  callback: _propTypes["default"].func,
+  isForHambuger: _propTypes["default"].bool
 };
 
 var ActionButton = function ActionButton(_ref2) {
@@ -140,6 +154,8 @@ var ActionButton = function ActionButton(_ref2) {
       buttonSize = _ref2$buttonSize === void 0 ? _actionItemTypes.BUTTON_SIZE_TYPE.S : _ref2$buttonSize,
       _ref2$callback = _ref2.callback,
       callback = _ref2$callback === void 0 ? defaultFunc : _ref2$callback,
+      _ref2$isForHambuger = _ref2.isForHambuger,
+      isForHambuger = _ref2$isForHambuger === void 0 ? false : _ref2$isForHambuger,
       rest = _objectWithoutProperties(_ref2, _excluded);
 
   return /*#__PURE__*/_react["default"].createElement(ActionsContainer, _extends({
@@ -152,7 +168,8 @@ var ActionButton = function ActionButton(_ref2) {
       textType: textType,
       buttonWidth: buttonWidth,
       buttonSize: buttonSize,
-      key: action.key
+      key: action.key,
+      isForHambuger: isForHambuger
     });
   }));
 };
@@ -163,7 +180,8 @@ ActionButton.propTypes = {
   textType: ActionButtonItem.propTypes.textType,
   buttonWidth: ActionButtonItem.propTypes.buttonWidth,
   buttonSize: ActionButtonItem.propTypes.buttonSize,
-  callback: _propTypes["default"].func
+  callback: _propTypes["default"].func,
+  isForHambuger: _propTypes["default"].bool
 };
 var _default = ActionButton;
 exports["default"] = _default;

package/lib/components/action-button-item.stories.js

@@ -21,7 +21,8 @@ var _theme = require("@twreporter/core/lib/constants/theme");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-/* eslint-disable react/prop-types */
+function _extends() { _extends = Object.assign || 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); }
+
 var _default = {
   title: 'Action Button',
   component: _actionButtonItem["default"],
@@ -108,7 +109,9 @@ var hamburger = function hamburger(props) {
     value: {
       theme: props.theme
     }
-  }, /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(_actionButtonItem["default"], props)));
+  }, /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(_actionButtonItem["default"], _extends({
+    isForHambuger: true
+  }, props))));
 };
 
 exports.hamburger = hamburger;

package/lib/components/action-button.js

@@ -62,7 +62,8 @@ var DesktopHamburgerAction = function DesktopHamburgerAction(_ref3) {
     direction: _actionItemTypes.DIRECTION_TYPE.column,
     textType: _actionItemTypes.TEXT_TYPE.full,
     buttonWidth: _actionItemTypes.BUTTON_WIDTH_TYPE.stretch,
-    buttonSize: _actionItemTypes.BUTTON_SIZE_TYPE.L
+    buttonSize: _actionItemTypes.BUTTON_SIZE_TYPE.L,
+    isForHambuger: true
   }, props));
 };
 
@@ -76,7 +77,8 @@ var MobileHamburgerAction = function MobileHamburgerAction(_ref4) {
     actions: actionProps,
     textType: _actionItemTypes.TEXT_TYPE.full,
     buttonWidth: _actionItemTypes.BUTTON_WIDTH_TYPE.stretch,
-    buttonSize: _actionItemTypes.BUTTON_SIZE_TYPE.L
+    buttonSize: _actionItemTypes.BUTTON_SIZE_TYPE.L,
+    isForHambuger: true
   }, props));
 };
 

package/lib/components/hamburger-menu.js

@@ -368,7 +368,11 @@ var HamburgerMenu = function HamburgerMenu(_ref2) {
   }), /*#__PURE__*/_react["default"].createElement(_logo.LogoHeader, {
     type: logoType,
     releaseBranch: releaseBranch
-  }))), /*#__PURE__*/_react["default"].createElement(FlexGroup, null, /*#__PURE__*/_react["default"].createElement(_actionButton.MobileHeaderAction, null), /*#__PURE__*/_react["default"].createElement(IconContainer, null, /*#__PURE__*/_react["default"].createElement(_icons.MobileIcons, null))))), /*#__PURE__*/_react["default"].createElement(SearchSection, null, /*#__PURE__*/_react["default"].createElement(_input.SearchBar, {
+  }))), /*#__PURE__*/_react["default"].createElement(FlexGroup, null, /*#__PURE__*/_react["default"].createElement(_actionButton.MobileHeaderAction, {
+    isForHambuger: true
+  }), /*#__PURE__*/_react["default"].createElement(IconContainer, null, /*#__PURE__*/_react["default"].createElement(_icons.MobileIcons, {
+    isForHambuger: true
+  }))))), /*#__PURE__*/_react["default"].createElement(SearchSection, null, /*#__PURE__*/_react["default"].createElement(_input.SearchBar, {
     onSearch: onSearch,
     autofocus: false,
     widthType: "stretch",

package/lib/components/icons.js

@@ -35,6 +35,8 @@ var _hook = require("@twreporter/react-components/lib/hook");
 
 var _color = require("@twreporter/core/lib/constants/color");
 
+var _theme = require("@twreporter/core/lib/constants/theme");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 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); }
@@ -93,7 +95,9 @@ var StyledDialog = /*#__PURE__*/(0, _styledComponents["default"])(_card.Dialog).
 
 var LogInOutIcon = function LogInOutIcon(_ref) {
   var _ref$loginButtonType = _ref.loginButtonType,
-      loginButtonType = _ref$loginButtonType === void 0 ? 'icon' : _ref$loginButtonType;
+      loginButtonType = _ref$loginButtonType === void 0 ? 'icon' : _ref$loginButtonType,
+      _ref$isForHambuger = _ref.isForHambuger,
+      isForHambuger = _ref$isForHambuger === void 0 ? false : _ref$isForHambuger;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -143,12 +147,24 @@ var LogInOutIcon = function LogInOutIcon(_ref) {
     releaseBranch: releaseBranch
   });
 
+  var buttonTheme;
+
+  if (isForHambuger) {
+    if (theme === _theme.THEME.transparent) {
+      buttonTheme = _theme.THEME.normal;
+    } else {
+      buttonTheme = theme;
+    }
+  } else {
+    buttonTheme = theme;
+  }
+
   var LoginButton = loginButtonType === 'icon' || isAuthed ? /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
     iconComponent: Icon,
-    theme: theme
+    theme: buttonTheme
   }) : /*#__PURE__*/_react["default"].createElement(_button.TextButton, {
     text: "\u767B\u5165",
-    theme: theme,
+    theme: buttonTheme,
     style: _button.TextButton.Style.DARK
   });
   return /*#__PURE__*/_react["default"].createElement(IconContainer, {
@@ -174,7 +190,8 @@ var LogInOutIcon = function LogInOutIcon(_ref) {
 };
 
 LogInOutIcon.propTypes = {
-  loginButtonType: _propTypes["default"].oneOf(['icon', 'text'])
+  loginButtonType: _propTypes["default"].oneOf(['icon', 'text']),
+  isForHambuger: _propTypes["default"].bool
 };
 
 var SearchIcon = function SearchIcon() {
@@ -264,12 +281,18 @@ var Icons = function Icons() {
   return /*#__PURE__*/_react["default"].createElement(IconsContainer, null, /*#__PURE__*/_react["default"].createElement(SearchIcon, null), /*#__PURE__*/_react["default"].createElement(BookmarkIcon, null), /*#__PURE__*/_react["default"].createElement(LogInOutIcon, null));
 };
 
-var MobileIcons = function MobileIcons() {
+var MobileIcons = function MobileIcons(_ref2) {
+  var _ref2$isForHambuger = _ref2.isForHambuger,
+      isForHambuger = _ref2$isForHambuger === void 0 ? false : _ref2$isForHambuger;
   return /*#__PURE__*/_react["default"].createElement(IconsContainer, null, /*#__PURE__*/_react["default"].createElement(LogInOutIcon, {
-    loginButtonType: "text"
+    loginButtonType: "text",
+    isForHambuger: isForHambuger
   }));
 };
 
 exports.MobileIcons = MobileIcons;
+MobileIcons.propTypes = {
+  isForHambuger: _propTypes["default"].bool
+};
 var _default = Icons;
 exports["default"] = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twreporter/universal-header",
-  "version": "2.6.0-rc.8",
+  "version": "2.6.0",
   "description": "Universal header of TWReporter sites",
   "main": "lib/index.js",
   "scripts": {
@@ -20,8 +20,8 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@twreporter/core": "^1.10.0-rc.4",
-    "@twreporter/react-components": "^8.18.0-rc.8",
+    "@twreporter/core": "^1.10.0",
+    "@twreporter/react-components": "^8.18.0",
     "lodash": "^4.17.11",
     "prop-types": "^15.6.2",
     "querystring": "^0.2.0",
@@ -48,5 +48,5 @@
     "@storybook/testing-library": "^0.0.13",
     "babel-loader": "^8.2.5"
   },
-  "gitHead": "b6ecc96fd2576a62933d408fa86a20118a003c6d"
+  "gitHead": "8bb552690874aabe203b3c8205f725eef6285282"
 }