@twreporter/universal-header 2.3.0 → 2.4.0-rc.0

package/lib/utils/theme.js

@@ -3,19 +3,15 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.selectSloganThemeNew = void 0;
-
-var _colors = _interopRequireDefault(require("../constants/colors"));
+exports.selectHamburgerMenuTheme = exports.selectHamburgerItemTheme = exports.selectHamburgerFooterTheme = exports.selectSloganTheme = exports.selectHeaderTheme = exports.selectLogoType = void 0;
 
 var _theme = _interopRequireDefault(require("../constants/theme"));
 
-var _icon = require("./icon");
-
 var _color = require("@twreporter/core/lib/constants/color");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function selectLogoType(theme) {
+var selectLogoType = function selectLogoType(theme) {
   switch (theme) {
     case _theme["default"].photography:
     case _theme["default"].transparent:
@@ -28,88 +24,25 @@ function selectLogoType(theme) {
         return 'default';
       }
   }
-}
-
-function selectServiceIcons(theme) {
-  switch (theme) {
-    case _theme["default"].photography:
-      {
-        return _icon.ServiceIcons.photography;
-      }
-
-    case _theme["default"].transparent:
-      {
-        return _icon.ServiceIcons.transparent;
-      }
-
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return _icon.ServiceIcons.normal;
-      }
-  }
-}
-
-function selectHamburgerServiceIcons(theme) {
-  switch (theme) {
-    case _theme["default"].photography:
-      {
-        return _icon.ServiceIcons.photography;
-      }
-
-    case _theme["default"].transparent:
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return _icon.ServiceIcons.normal;
-      }
-  }
-}
-
-function selectIcons(theme) {
-  switch (theme) {
-    case _theme["default"].photography:
-      {
-        return _icon.Icons.photography;
-      }
-
-    case _theme["default"].transparent:
-      {
-        return _icon.Icons.transparent;
-      }
+};
 
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return _icon.Icons.normal;
-      }
-  }
-}
+exports.selectLogoType = selectLogoType;
 
-function selectChannelTheme(theme) {
+var selectHeaderTheme = function selectHeaderTheme(theme) {
   switch (theme) {
     case _theme["default"].photography:
       {
         return {
           bgColor: _color.colorPhoto.dark,
-          fontColor: _color.colorGrayscale.gray600,
-          hoverFontColor: _color.colorGrayscale.white,
-          hoverBgColor: _colors["default"].gray50,
-          borderColor: _colors["default"].gray250
+          topRowBgColor: _color.colorPhoto.dark
         };
       }
 
     case _theme["default"].transparent:
       {
         return {
-          bgColor: 'transparent',
-          fontColor: _color.colorGrayscale.white,
-          hoverFontColor: _color.colorGrayscale.gray900,
-          hoverBgColor: _color.colorGrayscale.white,
-          borderColor: _colors["default"].gray250
+          bgColor: _color.colorOpacity['black_0.2'],
+          topRowBgColor: 'unset'
         };
       }
 
@@ -117,10 +50,7 @@ function selectChannelTheme(theme) {
       {
         return {
           bgColor: _color.colorGrayscale.white,
-          fontColor: _color.colorGrayscale.gray600,
-          hoverFontColor: _color.colorGrayscale.gray900,
-          hoverBgColor: _colors["default"].gray150,
-          borderColor: _color.colorGrayscale.gray200
+          topRowBgColor: _color.colorGrayscale.white
         };
       }
 
@@ -129,91 +59,72 @@ function selectChannelTheme(theme) {
       {
         return {
           bgColor: _color.colorGrayscale.gray100,
-          fontColor: _color.colorGrayscale.gray600,
-          hoverFontColor: _color.colorGrayscale.gray900,
-          hoverBgColor: _colors["default"].gray150,
-          borderColor: _color.colorGrayscale.gray200
+          topRowBgColor: _color.colorGrayscale.gray100
         };
       }
   }
-}
+};
+
+exports.selectHeaderTheme = selectHeaderTheme;
 
-function selectHeaderTheme(theme) {
+var selectSloganTheme = function selectSloganTheme(theme) {
   switch (theme) {
     case _theme["default"].photography:
-      {
-        return {
-          bgColor: _color.colorPhoto.dark,
-          borderColor: _colors["default"].gray250
-        };
-      }
-
     case _theme["default"].transparent:
       {
-        return {
-          bgColor: _colors["default"].gray150,
-          borderColor: _colors["default"].gray250
-        };
+        return _color.colorGrayscale.white;
       }
 
     case _theme["default"].index:
-      {
-        return {
-          bgColor: _color.colorGrayscale.white,
-          borderColor: _color.colorGrayscale.gray200
-        };
-      }
-
     case _theme["default"].normal:
     default:
       {
-        return {
-          bgColor: _color.colorGrayscale.gray100,
-          borderColor: _color.colorGrayscale.gray200
-        };
+        return _color.colorGrayscale.gray800;
       }
   }
-}
+};
 
-function selectActionButtonTheme(theme) {
+exports.selectSloganTheme = selectSloganTheme;
+
+var selectHamburgerFooterTheme = function selectHamburgerFooterTheme(theme) {
   switch (theme) {
     case _theme["default"].photography:
       {
         return {
-          color: _color.colorGrayscale.white,
-          bgColor: _color.colorSupportive.main,
-          hoverBgColor: _colors["default"].brownDark
+          color: _color.colorGrayscale.gray400,
+          hoverColor: _color.colorGrayscale.gray400,
+          hoverBgColor: _color.colorOpacity['white_0.2'],
+          activeColor: _color.colorGrayscale.gray400,
+          activeBgColor: _color.colorOpacity['white_0.5']
         };
       }
 
     case _theme["default"].transparent:
-      {
-        return {
-          color: _color.colorSupportive.main,
-          bgColor: _color.colorGrayscale.white,
-          hoverBgColor: _color.colorGrayscale.gray300
-        };
-      }
-
     case _theme["default"].index:
     case _theme["default"].normal:
     default:
       {
         return {
-          color: _color.colorGrayscale.white,
-          bgColor: _color.colorBrand.heavy,
-          hoverBgColor: _colors["default"].redDark
+          color: _color.colorGrayscale.gray600,
+          hoverColor: _color.colorGrayscale.gray800,
+          hoverBgColor: _color.colorGrayscale.gray100,
+          activeColor: _color.colorGrayscale.gray800,
+          activeBgColor: _color.colorGrayscale.gray200
         };
       }
   }
-}
+};
+
+exports.selectHamburgerFooterTheme = selectHamburgerFooterTheme;
 
-function selectHamburgerMenuTheme(theme) {
+var selectHamburgerItemTheme = function selectHamburgerItemTheme(theme, active) {
   switch (theme) {
     case _theme["default"].photography:
       {
         return {
-          bgColor: _color.colorPhoto.dark
+          color: active ? _color.colorSupportive.main : _color.colorGrayscale.white,
+          hoverBgColor: _color.colorOpacity['white_0.2'],
+          activeBgColor: _color.colorOpacity['white_0.5']
         };
       }
 
@@ -223,18 +134,23 @@ function selectHamburgerMenuTheme(theme) {
     default:
       {
         return {
-          bgColor: _color.colorGrayscale.gray100
+          color: active ? _color.colorBrand.heavy : _color.colorGrayscale.gray800,
+          hoverBgColor: _color.colorGrayscale.gray100,
+          activeBgColor: _color.colorGrayscale.gray200
         };
       }
   }
-}
+};
+
+exports.selectHamburgerItemTheme = selectHamburgerItemTheme;
 
-function selectHamburgerServiceTheme(theme) {
+var selectHamburgerMenuTheme = function selectHamburgerMenuTheme(theme) {
   switch (theme) {
     case _theme["default"].photography:
       {
         return {
-          borderColor: _colors["default"].gray450
+          bgColor: _color.colorPhoto.dark,
+          scrollBarColor: _color.colorOpacity['white_0.8']
         };
       }
 
@@ -244,121 +160,11 @@ function selectHamburgerServiceTheme(theme) {
     default:
       {
         return {
-          borderColor: _colors["default"].gray250
+          bgColor: _color.colorGrayscale.white,
+          scrollBarColor: _color.colorOpacity['black_0.2']
         };
       }
   }
-}
-
-var selectSloganThemeNew = function selectSloganThemeNew(theme) {
-  switch (theme) {
-    case _theme["default"].photography:
-    case _theme["default"].transparent:
-      {
-        return _color.colorGrayscale.white;
-      }
-
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return _color.colorGrayscale.gray800;
-      }
-  }
 };
 
-exports.selectSloganThemeNew = selectSloganThemeNew;
-
-function selectSloganTheme(theme) {
-  switch (theme) {
-    case _theme["default"].photography:
-      {
-        return _color.colorSupportive.main;
-      }
-
-    case _theme["default"].transparent:
-      {
-        return _color.colorGrayscale.white;
-      }
-
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return _color.colorGrayscale.gray900;
-      }
-  }
-}
-/*
- * HB is the abbreviation of hamburger.
- * The HB series of theme functions are used in hamburger menu.
- */
-
-
-function selectActionButtonHBTheme(theme) {
-  switch (theme) {
-    case _theme["default"].transparent:
-      {
-        return selectActionButtonTheme('normal');
-      }
-
-    case _theme["default"].photography:
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return selectActionButtonTheme(theme);
-      }
-  }
-}
-
-function selectChannelHBTheme(theme) {
-  switch (theme) {
-    case _theme["default"].transparent:
-      {
-        return selectChannelTheme('normal');
-      }
-
-    case _theme["default"].photography:
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return selectChannelTheme(theme);
-      }
-  }
-}
-
-function selectSloganHBTheme(theme) {
-  switch (theme) {
-    case _theme["default"].transparent:
-      {
-        return selectSloganTheme('normal');
-      }
-
-    case _theme["default"].photography:
-    case _theme["default"].index:
-    case _theme["default"].normal:
-    default:
-      {
-        return selectSloganTheme(theme);
-      }
-  }
-}
-
-var _default = {
-  selectLogoType: selectLogoType,
-  selectServiceIcons: selectServiceIcons,
-  selectHamburgerServiceIcons: selectHamburgerServiceIcons,
-  selectIcons: selectIcons,
-  selectHeaderTheme: selectHeaderTheme,
-  selectChannelTheme: selectChannelTheme,
-  selectActionButtonTheme: selectActionButtonTheme,
-  selectSloganTheme: selectSloganTheme,
-  selectChannelHBTheme: selectChannelHBTheme,
-  selectActionButtonHBTheme: selectActionButtonHBTheme,
-  selectSloganHBTheme: selectSloganHBTheme,
-  selectHamburgerMenuTheme: selectHamburgerMenuTheme,
-  selectHamburgerServiceTheme: selectHamburgerServiceTheme
-};
-exports["default"] = _default;
+exports.selectHamburgerMenuTheme = selectHamburgerMenuTheme;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twreporter/universal-header",
-  "version": "2.3.0",
+  "version": "2.4.0-rc.0",
   "description": "Universal header of TWReporter sites",
   "main": "lib/index.js",
   "scripts": {
@@ -20,8 +20,8 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@twreporter/core": "^1.7.0",
-    "@twreporter/react-components": "^8.14.0",
+    "@twreporter/core": "^1.8.0-rc.0",
+    "@twreporter/react-components": "^8.15.0-rc.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": "7c69d3797214348fb441596bd4c78788010c8fe5"
+  "gitHead": "18f6387366e10e692e08e5356f69409d3535c1b6"
 }