@shopgate/engage 7.27.2-beta.2 → 7.27.2-beta.3

package/components/ScrollHeader/index.js

@@ -1,5 +1,18 @@
-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 _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState}from'react';import PropTypes from'prop-types';import classNames from'classnames';import{useScrollDirectionChange}from'@shopgate/engage/core/hooks';import{root,scrolledIn,scrolledOut,transition}from"./style";/**
- * Scroll Header component
- * @param {Object} props props
- * @returns {JSX}
- */function ScrollHeader(_ref){var className=_ref.className,children=_ref.children,hideOnScroll=_ref.hideOnScroll,scrollOffset=_ref.scrollOffset;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldHideHeader=_useState2[0],setShouldHideHeader=_useState2[1];useScrollDirectionChange({enabled:hideOnScroll,offset:scrollOffset,onScrollDown:function onScrollDown(){setShouldHideHeader(true);},onScrollUp:function onScrollUp(){setShouldHideHeader(false);}});return React.createElement("div",{className:classNames(root,transition,className,_defineProperty(_defineProperty({},scrolledIn,!shouldHideHeader),scrolledOut,shouldHideHeader))},children);}ScrollHeader.defaultProps={className:null,hideOnScroll:true,scrollOffset:100};export default ScrollHeader;
+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 _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,forwardRef,useEffect}from'react';import PropTypes from'prop-types';import classNames from'classnames';import{useScrollDirectionChange}from'@shopgate/engage/core/hooks';import{root,scrolledIn,scrolledOut,transition}from"./style";/* eslint-disable react/prop-types */ /**
+ * A container component that hides its content on scroll down and shows it on scroll up.
+ *
+ * @param {Object} props The component props.
+ * @param {boolean}  [props.hideOnScroll] Toggle hide-on-scroll (default: true).
+ * @param {number} [props.scrollOffset] Pixels to scroll before toggling (default: 100).
+ * @param {Function} [props.onChange] Callback function that is called when the header changes
+ * @param {string} [props.className] Extra CSS classes on the root element.
+ * @param {Object} [props.classes] Override internal class names.
+ * @param {string} [props.classes.scrolledIn] Override class for the scrolled-in state
+ * (content is hidden).
+ * @param {string} [props.classes.scrolledOut] Override class for the scrolled-out state
+ * (content is visible).
+ * visibility. Contains a boolean indicating whether the header is visible.
+ * @param {React.ReactNode} props.children  Content of the header.
+ * @param {React.Ref<HTMLDivElement>} ref   Forwarded ref to the header `<div>`.
+ * @returns {JSX.Element}
+ */function ScrollHeaderBase(_ref,ref){var className=_ref.className,children=_ref.children,_ref$hideOnScroll=_ref.hideOnScroll,hideOnScroll=_ref$hideOnScroll===void 0?true:_ref$hideOnScroll,_ref$scrollOffset=_ref.scrollOffset,scrollOffset=_ref$scrollOffset===void 0?100:_ref$scrollOffset,onChange=_ref.onChange,classes=_ref.classes;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldHideHeader=_useState2[0],setShouldHideHeader=_useState2[1];useScrollDirectionChange({enabled:hideOnScroll,offset:scrollOffset,onScrollDown:function onScrollDown(){setShouldHideHeader(true);},onScrollUp:function onScrollUp(){setShouldHideHeader(false);}});useEffect(function(){if(typeof onChange!=='function'){return;}onChange(!shouldHideHeader);},[onChange,shouldHideHeader]);return React.createElement("div",{ref:ref,className:classNames(root,transition,className,_defineProperty(_defineProperty({},classNames(scrolledIn,classes===null||classes===void 0?void 0:classes.scrolledIn),!shouldHideHeader),classNames(scrolledOut,classes===null||classes===void 0?void 0:classes.scrolledOut),shouldHideHeader))},children);}/* eslint-enable react/prop-types */var ScrollHeader=forwardRef(ScrollHeaderBase);ScrollHeader.displayName='ScrollHeader';ScrollHeader.propTypes={children:PropTypes.node.isRequired,classes:PropTypes.shape({scrolledIn:PropTypes.string,scrolledOut:PropTypes.string}),className:PropTypes.string,hideOnScroll:PropTypes.bool,onChange:PropTypes.func,scrollOffset:PropTypes.number};ScrollHeader.defaultProps={className:null,hideOnScroll:true,scrollOffset:100,classes:{},onChange:null};export default ScrollHeader;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopgate/engage",
-  "version": "7.27.2-beta.2",
+  "version": "7.27.2-beta.3",
   "description": "Shopgate's ENGAGE library.",
   "license": "Apache-2.0",
   "author": "Shopgate <support@shopgate.com>",
@@ -16,12 +16,12 @@
   ],
   "dependencies": {
     "@shopgate/native-modules": "1.0.0-beta.25",
-    "@shopgate/pwa-common": "7.27.2-beta.2",
-    "@shopgate/pwa-common-commerce": "7.27.2-beta.2",
-    "@shopgate/pwa-core": "7.27.2-beta.2",
-    "@shopgate/pwa-ui-ios": "7.27.2-beta.2",
-    "@shopgate/pwa-ui-material": "7.27.2-beta.2",
-    "@shopgate/pwa-ui-shared": "7.27.2-beta.2",
+    "@shopgate/pwa-common": "7.27.2-beta.3",
+    "@shopgate/pwa-common-commerce": "7.27.2-beta.3",
+    "@shopgate/pwa-core": "7.27.2-beta.3",
+    "@shopgate/pwa-ui-ios": "7.27.2-beta.3",
+    "@shopgate/pwa-ui-material": "7.27.2-beta.3",
+    "@shopgate/pwa-ui-shared": "7.27.2-beta.3",
     "@stripe/react-stripe-js": "^1.16.5",
     "@stripe/stripe-js": "^1.3.1",
     "@virtuous/conductor": "~2.5.0",