andoncloud-sdk 1.4.3 → 1.4.6

package/dist/andoncloud-sdk.js

@@ -5,6 +5,7 @@ var React__default = _interopDefault(React);
 var reactRouterDom = require('react-router-dom');
 var propTypes = require('prop-types');
 var CssBaseline = _interopDefault(require('@mui/material/CssBaseline'));
+var GlobalStyles = _interopDefault(require('@mui/material/GlobalStyles'));
 var styles = require('@mui/material/styles');
 var mobx = require('mobx');
 var material = require('@mui/material');
@@ -2998,7 +2999,7 @@ var useStyles = (function (_ref) {
       paddingRight: "18px"
     },
     menu: _extends$1({
-      marginTop: "60px",
+      marginTop: "70px",
       backgroundColor: "rgba(0,0,0,0.5)"
     }, menuStyles, {
       "& .MuiPaper-root": _extends$1({
@@ -3012,6 +3013,7 @@ var useStyles = (function (_ref) {
 
 var Header = function Header(_ref) {
   var position = _ref.position,
+      scrolled = _ref.scrolled,
       showAcLogo = _ref.showAcLogo,
       leadingText = _ref.leadingText,
       title = _ref.title,
@@ -3199,9 +3201,11 @@ var Header = function Header(_ref) {
   return /*#__PURE__*/React__default.createElement(AppBar, {
     position: position,
     elevation: 0,
-    sx: _extends$1({}, position === "static" ? {
+    sx: _extends$1({}, headerStyles.root, position === "static" ? {
       marginTop: "-70px"
-    } : {}, headerStyles.root),
+    } : {}, scrolled ? {
+      background: "#1E1E1E"
+    } : {}),
     "data-testid": dataTestID || "ac-sdk-header"
   }, /*#__PURE__*/React__default.createElement(Toolbar, {
     variant: "dense"
@@ -3233,6 +3237,7 @@ var Header = function Header(_ref) {
 
 Header.propTypes = {
   position: propTypes.PropTypes.string,
+  scrolled: propTypes.PropTypes.bool,
   showAcLogo: propTypes.PropTypes.bool,
   leadingText: propTypes.PropTypes.string.isRequired,
   title: propTypes.PropTypes.string,
@@ -3282,14 +3287,27 @@ var Container = function Container(_ref) {
       headerProps = _ref.headerProps,
       styles = _ref.styles,
       dataTestID = _ref["data-testid"];
+
+  var _useState = React.useState(),
+      scrollTarget = _useState[0],
+      setScrollTarget = _useState[1];
+
+  var scrolled = material.useScrollTrigger({
+    target: scrollTarget,
+    threshold: 0
+  });
   return /*#__PURE__*/React__default.createElement(BaseContainer, {
+    ref: function ref(node) {
+      if (node) {
+        setScrollTarget(node);
+      }
+    },
     maxWidth: false,
     disableGutters: true,
-    sx: _extends$1({}, baseStyles.root, {
-      styles: styles
-    }),
+    sx: _extends$1({}, baseStyles.root, styles),
     "data-testid": dataTestID || "ac-sdk-container"
   }, /*#__PURE__*/React__default.createElement(Header$1, _extends$1({
+    scrolled: scrolled,
     showAcLogo: true
   }, headerProps)), children, /*#__PURE__*/React__default.createElement(material.Box, {
     sx: baseStyles.overlay
@@ -3510,7 +3528,20 @@ var App = mobxReactLite.observer(function (_ref) {
   }, [authEnabled, status]);
   return /*#__PURE__*/React__default.createElement(styles.ThemeProvider, {
     theme: styles.createTheme(muiTheme)
-  }, /*#__PURE__*/React__default.createElement(CssBaseline, null), /*#__PURE__*/React__default.createElement(Toaster, null), /*#__PURE__*/React__default.createElement(AuthConfigProvider, {
+  }, /*#__PURE__*/React__default.createElement(CssBaseline, null), /*#__PURE__*/React__default.createElement(GlobalStyles, {
+    styles: {
+      "::-webkit-scrollbar": {
+        width: "6px"
+      },
+      "::-webkit-scrollbar-track": {
+        backgroundColor: "transparent"
+      },
+      "::-webkit-scrollbar-thumb": {
+        borderRadius: "3px",
+        backgroundColor: "rgba(255, 255, 255, 0.25)"
+      }
+    }
+  }), /*#__PURE__*/React__default.createElement(Toaster, null), /*#__PURE__*/React__default.createElement(AuthConfigProvider, {
     config: _extends$1({
       baseUrl: baseUrl
     }, authProps)