@ntbjs/react-components 1.2.0-rc.57 → 1.2.0-rc.59

package/{ActionButton-06df3d6c.js → ActionButton-46735b89.js}

@@ -11,7 +11,11 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var _templateObject, _templateObject2;
-var ActionButton$1 = styled__default['default'].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  height: 40px;\n  width: 40px;\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  ", "\n\n  ", "\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-height: 20px;\n    max-width: 20px;\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
+var ActionButton$1 = styled__default['default'].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: ", ";\n  height: ", ";\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  ", "\n\n  ", "\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-height: 20px;\n    max-width: 20px;\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
+  return "".concat(props.buttonWidthHeight[0], "px");
+}, function (props) {
+  return "".concat(props.buttonWidthHeight[1], "px");
+}, function (props) {
   var _props$backgroundColo, _props$backgroundColo2, _props$backgroundColo3, _props$backgroundColo4;
 
   var darkThemeBgColor = (_props$backgroundColo = props === null || props === void 0 ? void 0 : (_props$backgroundColo2 = props.backgroundColors) === null || _props$backgroundColo2 === void 0 ? void 0 : _props$backgroundColo2[0]) !== null && _props$backgroundColo !== void 0 ? _props$backgroundColo : props.theme.getColor('gray-600');
@@ -30,13 +34,15 @@ var ActionButton = React__default['default'].forwardRef(function ActionButton(_r
       disabled = _ref.disabled,
       active = _ref.active,
       onClick = _ref.onClick,
-      props = defaultTheme._objectWithoutProperties(_ref, ["icon", "disabled", "active", "onClick"]);
+      buttonWidthHeight = _ref.buttonWidthHeight,
+      props = defaultTheme._objectWithoutProperties(_ref, ["icon", "disabled", "active", "onClick", "buttonWidthHeight"]);
 
   return React__default['default'].createElement(ActionButton$1, defaultTheme._extends({
     ref: forwardedRef,
     disabled: disabled,
     active: active,
-    onClick: onClick
+    onClick: onClick,
+    buttonWidthHeight: buttonWidthHeight
   }, props), icon);
 });
 ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -44,10 +50,12 @@ ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
   disabled: defaultTheme.PropTypes.bool,
   active: defaultTheme.PropTypes.bool,
   onClick: defaultTheme.PropTypes.func,
-  backgroundColors: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.string)
+  backgroundColors: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.string),
+  buttonWidthHeight: defaultTheme.PropTypes.array
 } : {};
 ActionButton.defaultProps = {
-  onClick: function onClick() {}
+  onClick: function onClick() {},
+  buttonWidthHeight: [40, 40]
 };
 
 exports.ActionButton = ActionButton;

package/{AssetGallery-90a491d3.js → AssetGallery-afd76086.js}

@@ -16,7 +16,7 @@ require('./Tab-f499ecbc.js');
 require('./Tabs-4d7742bc.js');
 var Tooltip = require('./Tooltip-66daf6e3.js');
 require('./VerificationStatusIcon-b574fd21.js');
-var ActionButton = require('./ActionButton-06df3d6c.js');
+var ActionButton = require('./ActionButton-46735b89.js');
 require('./Button-49f82b31.js');
 require('./Checkbox-68dc38a8.js');
 require('./CompactAutocompleteSelect-87c8c7e7.js');
@@ -434,7 +434,8 @@ var ComputedActionButton$1 = React__default['default'].forwardRef(function Compu
       className: className,
       icon: newProps.icon,
       backgroundColors: ['black', 'white'],
-      onClick: newProps.onClick
+      onClick: newProps.onClick,
+      buttonWidthHeight: newProps.actionButtonWidthHeight
     }));
   } else {
     newProps.children = React__default['default'].createElement(ActionButton.ActionButton, {
@@ -444,7 +445,8 @@ var ComputedActionButton$1 = React__default['default'].forwardRef(function Compu
       className: className,
       icon: newProps.icon,
       onClick: newProps.onClick,
-      backgroundColors: ['black', 'white']
+      backgroundColors: ['black', 'white'],
+      buttonWidthHeight: newProps.actionButtonWidthHeight
     });
   }
 
@@ -773,7 +775,8 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
       subActions: action.subActions,
       onClick: function onClick(event) {
         return onActionClick(event, action, index);
-      }
+      },
+      actionButtonWidthHeight: action.actionButtonWidthHeight
     }));
   })), React__default['default'].createElement(OverlayInfo$1, null, React__default['default'].createElement(OverlayInfoTop$1, null, React__default['default'].createElement(OverlayInfoTopVersions$1, {
     collapseExtraInfo: collapseExtraInfo
@@ -844,7 +847,8 @@ AssetGalleryCompactCard.propTypes = process.env.NODE_ENV !== "production" ? {
   component: defaultTheme.PropTypes.func,
   scrollPosition: defaultTheme.PropTypes.number,
   collapseExtraInfo: defaultTheme.PropTypes.bool,
-  activeSummaryCard: defaultTheme.PropTypes.bool
+  activeSummaryCard: defaultTheme.PropTypes.bool,
+  actionButtonWidthHeight: defaultTheme.PropTypes.array
 } : {};
 AssetGalleryCompactCard.defaultProps = {};
 var AssetGalleryCompactCard$1 = reactLazyLoadImageComponent.trackWindowScroll(React__default['default'].memo(AssetGalleryCompactCard, function (prevProps, nextProps) {
@@ -994,7 +998,8 @@ var ComputedActionButton = React__default['default'].forwardRef(function Compute
       className: className,
       icon: newProps.icon,
       backgroundColors: ['black', 'white'],
-      onClick: newProps.onClick
+      onClick: newProps.onClick,
+      buttonWidthHeight: newProps.actionButtonWidthHeight
     }));
   } else {
     newProps.children = React__default['default'].createElement(ActionButton.ActionButton, {
@@ -1004,7 +1009,8 @@ var ComputedActionButton = React__default['default'].forwardRef(function Compute
       className: className,
       icon: newProps.icon,
       onClick: newProps.onClick,
-      backgroundColors: ['black', 'white']
+      backgroundColors: ['black', 'white'],
+      buttonWidthHeight: newProps.actionButtonWidthHeight
     });
   }
 
@@ -1204,7 +1210,8 @@ var AssetGalleryGridCard = function AssetGalleryGridCard(props) {
         onClick: function onClick(event) {
           return onActionClick(event, action, index);
         },
-        subActions: action === null || action === void 0 ? void 0 : action.subActions
+        subActions: action === null || action === void 0 ? void 0 : action.subActions,
+        actionButtonWidthHeight: action.actionButtonWidthHeight
       }));
     }))), React__default['default'].createElement(OverlayInfoBottom, null, selectable && React__default['default'].createElement(OverlayInfoBottomSelectButton, {
       selected: selected

package/inputs/ActionButton/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var ActionButton = require('../../ActionButton-06df3d6c.js');
+var ActionButton = require('../../ActionButton-46735b89.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('react');

package/inputs/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var ActionButton = require('../ActionButton-06df3d6c.js');
+var ActionButton = require('../ActionButton-46735b89.js');
 var Button = require('../Button-49f82b31.js');
 var Checkbox = require('../Checkbox-68dc38a8.js');
 var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-87c8c7e7.js');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "1.2.0-rc.57",
+  "version": "1.2.0-rc.59",
   "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,6 +1,6 @@
 'use strict';
 
-var AssetGallery = require('../../AssetGallery-90a491d3.js');
+var AssetGallery = require('../../AssetGallery-afd76086.js');
 require('../../defaultTheme-ea44e34a.js');
 require('styled-components');
 require('lodash');
@@ -28,7 +28,7 @@ require('../../SectionSeparator-259a22ed.js');
 require('../../close-ebf2f3cf.js');
 require('react-lazy-load-image-component');
 require('../../warning-circle-24522402.js');
-require('../../ActionButton-06df3d6c.js');
+require('../../ActionButton-46735b89.js');
 require('../../Button-49f82b31.js');
 require('../../ContextMenu-4ec3d9f3.js');
 require('../../expand-more-94585605.js');

package/widgets/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var AssetGallery = require('../AssetGallery-90a491d3.js');
+var AssetGallery = require('../AssetGallery-afd76086.js');
 var ContextMenu = require('../ContextMenu-4ec3d9f3.js');
 var AssetPreviewTopBar = require('../AssetPreviewTopBar-c28715f7.js');
 var Instructions = require('../Instructions-b9f2e184.js');
@@ -33,7 +33,7 @@ require('../SectionSeparator-259a22ed.js');
 require('../close-ebf2f3cf.js');
 require('react-lazy-load-image-component');
 require('../warning-circle-24522402.js');
-require('../ActionButton-06df3d6c.js');
+require('../ActionButton-46735b89.js');
 require('../Button-49f82b31.js');
 require('../expand-more-94585605.js');
 require('../CompactAutocompleteSelect-87c8c7e7.js');