@ntbjs/react-components 0.0.1-beta.37 → 0.0.1-beta.40

package/{AssetGallery-563abf37.js → AssetGallery-b85a48c8.js}

@@ -5,7 +5,7 @@ var React = require('react');
 var lodash = require('lodash');
 var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
 var ActionButton = require('./ActionButton-10a681b9.js');
-require('./Button-89056918.js');
+require('./Button-6f6b4ed4.js');
 require('./Checkbox-791a409f.js');
 require('./Radio-9271a4b6.js');
 require('./TextArea-70a74014.js');
@@ -41,6 +41,8 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
+var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+
 var toFnRef = function toFnRef(ref) {
   return !ref || typeof ref === 'function' ? ref : function (value) {
     ref.current = value;
@@ -784,8 +786,6 @@ var GroupLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultT
 var AssetGalleryCardBase = styled__default['default'].div(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  margin: 0;\n  overflow: hidden;\n  will-change: transform, width, height;\n"])));
 
 var AssetGalleryBase = React__default['default'].forwardRef(function AssetGalleryBase(_ref, forwardedRef) {
-  var _window, _window2;
-
   var assetsProp = _ref.assets,
       viewMode = _ref.viewMode,
       thumbnailMaxHeight = _ref.thumbnailMaxHeight,
@@ -821,10 +821,11 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
   var GRID_VIEW_MODE_ASSET_HEIGHT = 403;
   var MISSING_WIDTH_PLACEHOLDER = 1920;
   var MISSING_HEIGHT_PLACEHOLDER = 1080;
-  var previousYOffset = React.useRef(((_window = window) === null || _window === void 0 ? void 0 : _window.pageYOffset) || 0);
-  var latestYOffset = React.useRef(((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.pageYOffset) || 0);
+  var isBrowser = typeof window !== 'undefined';
+  var previousYOffset = React.useRef(isBrowser ? window.pageYOffset : 0);
+  var latestYOffset = React.useRef(isBrowser ? window.pageYOffset : 0);
   var scrollDirection = React.useRef('down');
-  React.useLayoutEffect(function () {
+  useIsomorphicLayoutEffect(function () {
     if (!assetGalleryDOMNode.current) return;
     var throttledOnResize = lodash.throttle(onResize, 1);
     var resizeObserver = new ResizeObserver(throttledOnResize);
@@ -841,7 +842,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
     }
 
     return function () {
-      return resizeObserver.unobserve(assetGalleryDOMNode.current);
+      resizeObserver.unobserve(assetGalleryDOMNode.current);
     };
   }, [assetsProp, assetGalleryDOMNode, MAXIMUM_ROW_HEIGHT]);
   React.useEffect(function () {
@@ -998,22 +999,18 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
   }
 
   function setScrollPositionAndDirection() {
-    var _window3;
-
-    var newYOffset = ((_window3 = window) === null || _window3 === void 0 ? void 0 : _window3.pageYOffset) || 0;
+    var newYOffset = window.pageYOffset;
     previousYOffset.current = latestYOffset.current;
     latestYOffset.current = newYOffset;
     scrollDirection.current = latestYOffset.current > previousYOffset.current ? 'down' : 'up';
   }
 
   var calculateVisibility = function calculateVisibility() {
-    var _window4;
-
     if (!assetGalleryDOMNode.current) return;
     var bufferTop = scrollDirection.current === 'up' ? PRIMARY_SCROLL_BUFFER_HEIGHT : SECONDARY_SCROLL_BUFFER_HEIGHT;
     var bufferBottom = scrollDirection.current === 'up' ? SECONDARY_SCROLL_BUFFER_HEIGHT : PRIMARY_SCROLL_BUFFER_HEIGHT;
     var containerOffset = getOffsetTop(assetGalleryDOMNode.current);
-    var scrollerHeight = ((_window4 = window) === null || _window4 === void 0 ? void 0 : _window4.innerHeight) || 0;
+    var scrollerHeight = window.innerHeight;
     var yOffset = latestYOffset.current;
     var minTranslateYPlusHeight = yOffset - containerOffset - bufferTop;
     var maxTranslateY = yOffset - containerOffset + scrollerHeight + bufferBottom;

package/{Button-89056918.js → Button-6f6b4ed4.js}

@@ -48,7 +48,7 @@ var LoadingIndicator = styled__default['default'].div.attrs(defaultTheme.applyDe
 var LoadingIndicatorSvg = styled__default['default'].svg.attrs(defaultTheme.applyDefaultTheme)(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n  height: 100%;\n  color: inherit;\n  transform: rotate(-88deg);\n"])));
 var LoadingIndicatorSvgCircle = styled__default['default'].circle.attrs(defaultTheme.applyDefaultTheme)(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n  transition: stroke-dashoffset 300ms linear;\n  stroke-dasharray: 113;\n"])));
 
-function Button(_ref) {
+var Button = React__default['default'].forwardRef(function Button(_ref, forwardedRef) {
   var secondary = _ref.secondary,
       outlined = _ref.outlined,
       block = _ref.block,
@@ -108,6 +108,7 @@ function Button(_ref) {
     };
   }, [loading]);
   return React__default['default'].createElement(Button$1, defaultTheme._extends({
+    ref: forwardedRef,
     secondary: secondary,
     outlined: outlined,
     block: block,
@@ -135,8 +136,7 @@ function Button(_ref) {
       strokeDashoffset: "".concat(loadingStep, "px")
     }
   }))));
-}
-
+});
 Button.defaultProps = {
   size: 'normal'
 };

package/inputs/Button/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Button = require('../../Button-89056918.js');
+var Button = require('../../Button-6f6b4ed4.js');
 require('../../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');

package/inputs/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var ActionButton = require('../ActionButton-10a681b9.js');
-var Button = require('../Button-89056918.js');
+var Button = require('../Button-6f6b4ed4.js');
 var Checkbox = require('../Checkbox-791a409f.js');
 var Radio = require('../Radio-9271a4b6.js');
 var TextArea = require('../TextArea-70a74014.js');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "0.0.1-beta.37",
+  "version": "0.0.1-beta.40",
   "description": "NTBs common front-end design utilities and React components.",
   "scripts": {
     "build": "cross-env NODE_ENV=production rollup -c",

package/widgets/AssetGallery/index.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var AssetGallery = require('../../AssetGallery-563abf37.js');
+var AssetGallery = require('../../AssetGallery-b85a48c8.js');
 require('../../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
 require('lodash');
 require('react-lazy-load-image-component');
 require('../../ActionButton-10a681b9.js');
-require('../../Button-89056918.js');
+require('../../Button-6f6b4ed4.js');
 require('../../Checkbox-791a409f.js');
 require('nanoid');
 require('../../Radio-9271a4b6.js');

package/widgets/index.js

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var AssetGallery = require('../AssetGallery-563abf37.js');
+var AssetGallery = require('../AssetGallery-b85a48c8.js');
 require('../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
 require('lodash');
 require('react-lazy-load-image-component');
 require('../ActionButton-10a681b9.js');
-require('../Button-89056918.js');
+require('../Button-6f6b4ed4.js');
 require('../Checkbox-791a409f.js');
 require('nanoid');
 require('../Radio-9271a4b6.js');