@twreporter/react-article-components 1.13.0-rc.2 → 1.13.0-rc.3

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.13.0-rc.3](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-article-components@1.13.0-rc.2...@twreporter/react-article-components@1.13.0-rc.3) (2024-03-11)
+
+
+### Bug Fixes
+
+* share container bg color & scroll throttle ([a337754](https://github.com/twreporter/twreporter-npm-packages/commit/a337754fca0f4b9cdf2810bb9ff4aaa8363cfa75))
+* translateY 200% ([b07f024](https://github.com/twreporter/twreporter-npm-packages/commit/b07f0241c0c90cb141967e2f57ffff89215a6507))
+
+
+
+
+
 # [1.13.0-rc.2](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-article-components@1.13.0-rc.1...@twreporter/react-article-components@1.13.0-rc.2) (2024-03-11)
 
 **Note:** Version bump only for package @twreporter/react-article-components

package/lib/components/article-page.js

@@ -292,7 +292,7 @@ var Article = /*#__PURE__*/function (_PureComponent) {
     };
     _this.lastY = 0;
     _this.currentY = 0;
-    _this.handleScroll = _.throttle(_this._handleScroll.bind(_assertThisInitialized(_this)), 50);
+    _this.handleScroll = _.throttle(_this._handleScroll.bind(_assertThisInitialized(_this)), 500);
     return _this;
   }
 

package/lib/components/aside/mobile-tool-bar-old.js

@@ -101,13 +101,13 @@ var ToolBarWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 })(["display:flex;width:100%;justify-content:center;padding:8px;position:fixed;left:0px;bottom:env(safe-area-inset-bottom,0);height:", ";transform:", ";transition:height 200ms,transform 200ms ease-in-out;background-color:", ";border-top:1px solid ", ";z-index:", ";", "{background-color:", ";box-shadow:", ";}", "{bottom:", ";}"], function (props) {
   return props.hideText ? '40px' : '55px';
 }, function (props) {
-  return props.isHidden ? 'translateY(100%)' : 'tanslateY(0%)';
+  return props.isHidden ? 'translateY(200%)' : 'tanslateY(0%)';
 }, function (props) {
   return props.bgColor;
 }, function (props) {
   return props.borderColor;
 }, _zIndex["default"].mobileToolBar, ShareContainer, function (props) {
-  return props.bgColor;
+  return props.shareByBgColor;
 }, function (props) {
   return props.shadow;
 }, SnackBarContainer, function (props) {
@@ -481,7 +481,8 @@ var ToolBar = function ToolBar(_ref9) {
 
   var _getToolBarTheme = (0, _theme2.getToolBarTheme)(themeContext.name),
       bgColor = _getToolBarTheme.bgColor,
-      borderColor = _getToolBarTheme.borderColor;
+      borderColor = _getToolBarTheme.borderColor,
+      shareByBgColor = _getToolBarTheme.shareByBgColor;
 
   var _useSnackBar = (0, _snackBar.useSnackBar)(),
       showSnackBar = _useSnackBar.showSnackBar,
@@ -501,6 +502,7 @@ var ToolBar = function ToolBar(_ref9) {
     value: contextValue
   }, /*#__PURE__*/_react["default"].createElement(ToolBarWrapper, {
     bgColor: bgColor,
+    shareByBgColor: shareByBgColor,
     borderColor: borderColor,
     hideText: hideText,
     className: className,

package/lib/components/aside/mobile-tool-bar.js

@@ -101,13 +101,13 @@ var ToolBarWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 })(["display:flex;width:100%;justify-content:center;padding:8px;position:fixed;left:0px;bottom:env(safe-area-inset-bottom,0);height:", ";transform:", ";transition:height 200ms,transform 200ms ease-in-out;background-color:", ";border-top:1px solid ", ";z-index:", ";", "{background-color:", ";box-shadow:", ";}", "{bottom:", ";}"], function (props) {
   return props.hideText ? '40px' : '55px';
 }, function (props) {
-  return props.isHidden ? 'translateY(100%)' : 'tanslateY(0%)';
+  return props.isHidden ? 'translateY(200%)' : 'tanslateY(0%)';
 }, function (props) {
   return props.bgColor;
 }, function (props) {
   return props.borderColor;
 }, _zIndex["default"].mobileToolBar, ShareContainer, function (props) {
-  return props.bgColor;
+  return props.shareByBgColor;
 }, function (props) {
   return props.shadow;
 }, SnackBarContainer, function (props) {
@@ -481,7 +481,8 @@ var ToolBar = function ToolBar(_ref9) {
 
   var _getToolBarTheme = (0, _theme2.getToolBarTheme)(themeContext.name),
       bgColor = _getToolBarTheme.bgColor,
-      borderColor = _getToolBarTheme.borderColor;
+      borderColor = _getToolBarTheme.borderColor,
+      shareByBgColor = _getToolBarTheme.shareByBgColor;
 
   var _useSnackBar = (0, _snackBar.useSnackBar)(),
       showSnackBar = _useSnackBar.showSnackBar,
@@ -501,6 +502,7 @@ var ToolBar = function ToolBar(_ref9) {
     value: contextValue
   }, /*#__PURE__*/_react["default"].createElement(ToolBarWrapper, {
     bgColor: bgColor,
+    shareByBgColor: shareByBgColor,
     borderColor: borderColor,
     hideText: hideText,
     className: className,

package/lib/components/aside/utils/theme.js

@@ -18,6 +18,7 @@ var getToolBarTheme = function getToolBarTheme(theme) {
     case _theme["default"].article.v2.photo:
       return {
         bgColor: _color.colorPhoto.dark,
+        shareByBgColor: _color.colorPhoto.dark,
         borderColor: _color.colorPhoto.heavy
       };
 
@@ -25,6 +26,7 @@ var getToolBarTheme = function getToolBarTheme(theme) {
     default:
       return {
         bgColor: _color.colorGrayscale.gray100,
+        shareByBgColor: _color.colorGrayscale.white,
         borderColor: _color.colorGrayscale.gray300
       };
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twreporter/react-article-components",
-  "version": "1.13.0-rc.2",
+  "version": "1.13.0-rc.3",
   "description": "The Reporter react article components, which are used in article page",
   "main": "lib/components/article-page.js",
   "repository": "https://github.com/twreporter/twreporter-npm-packages.git",
@@ -40,5 +40,5 @@
   "files": [
     "lib"
   ],
-  "gitHead": "2c56f3e507422a81486863f8b165ecc2487bf563"
+  "gitHead": "db195994d013ad71f1a7a3b0a85153aef45a6622"
 }