@ntbjs/react-components 1.2.0-rc.3 → 1.2.0-rc.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/{Alert-96814023.js → Alert-163f8e98.js} +1 -1
  2. package/{AssetGallery-6899ec54.js → AssetGallery-c6953833.js} +59 -56
  3. package/{CompactTextInput-c5e38aae.js → CompactTextInput-ca975da6.js} +1 -1
  4. package/{Instructions-b955ba72.js → Instructions-b121b75d.js} +1 -1
  5. package/{TextArea-4d90d02c.js → TextArea-38615509.js} +6 -0
  6. package/data/Alert/index.js +1 -1
  7. package/data/index.js +1 -1
  8. package/inputs/CompactTextInput/index.js +2 -2
  9. package/inputs/TextArea/index.js +1 -1
  10. package/inputs/index.js +3 -3
  11. package/package.json +1 -1
  12. package/widgets/AssetGallery/index.js +5 -5
  13. package/widgets/Instructions/index.js +2 -2
  14. package/widgets/index.js +6 -6
package/{Alert-96814023.js → Alert-163f8e98.js} RENAMED
@@ -28,7 +28,7 @@ var Alert$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultThem
28
28
  }, function (props) {
29
29
  return props.align === 'center' ? 'center' : 'left';
30
30
  });
31
- var AlertRender = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n word-break: break-word;\n ", "\n ", "\n ", ";\n\n svg {\n width: 12px;\n height: 12px;\n padding-right: 5px;\n }\n\n span {\n flex: 1;\n ", "\n }\n"])), function (props) {
31
+ var AlertRender = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n word-break: break-word;\n ", "\n ", "\n ", ";\n\n svg {\n width: 12px;\n height: 12px;\n }\n\n span {\n flex: 1;\n padding-left: 5px;\n ", ";\n }\n"])), function (props) {
32
32
  return props.lineHeight ? "line-height: ".concat(props.lineHeight, "px;") : null;
33
33
  }, function (props) {
34
34
  return props.fontSize ? "font-size: ".concat(props.fontSize, "px;") : null;
package/{AssetGallery-6899ec54.js → AssetGallery-c6953833.js} RENAMED
@@ -1,13 +1,14 @@
1
1
  'use strict';
2
2
 
3
3
  var defaultTheme = require('./defaultTheme-c137e17f.js');
4
- var React = require('react');
5
4
  var lodash = require('lodash');
5
+ var React = require('react');
6
6
  var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
7
7
  var ResizeObserver = require('resize-observer-polyfill');
8
+ var styled = require('styled-components');
8
9
  var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
9
10
  var warningCircle = require('./warning-circle-24522402.js');
10
- var Alert = require('./Alert-96814023.js');
11
+ var Alert = require('./Alert-163f8e98.js');
11
12
  var Badge = require('./Badge-fa94dca8.js');
12
13
  var Popover = require('./Popover-155cbac8.js');
13
14
  require('./Tab-8fec1dba.js');
@@ -19,15 +20,14 @@ require('./Button-5071dc6b.js');
19
20
  require('./Checkbox-dd2cf216.js');
20
21
  require('./CompactAutocompleteSelect-d4147107.js');
21
22
  require('./CompactStarRating-ca1943af.js');
22
- require('./CompactTextInput-c5e38aae.js');
23
+ require('./CompactTextInput-ca975da6.js');
23
24
  require('./MultiSelect-87614192.js');
24
25
  require('./Radio-dd81f5d4.js');
25
- require('./TextArea-4d90d02c.js');
26
+ require('./TextArea-38615509.js');
26
27
  require('./TextInput-e6035fb0.js');
27
28
  require('./Switch-c004ea6d.js');
28
29
  var ContextMenu = require('./ContextMenu-bd818e55.js');
29
30
  var ContextMenuItem = require('./ContextMenuItem-10af8b2f.js');
30
- var styled = require('styled-components');
31
31
  var polished = require('polished');
32
32
 
33
33
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -113,8 +113,6 @@ function SvgPlay(props) {
113
113
  }, props), _ref);
114
114
  }
115
115
 
116
- var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
117
-
118
116
  var assetShape = {
119
117
  key: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.string, defaultTheme.PropTypes.number]).isRequired,
120
118
  previewUrl: defaultTheme.PropTypes.string,
@@ -164,6 +162,17 @@ var assetShapeWithLayout = defaultTheme._objectSpread2(defaultTheme._objectSprea
164
162
  }).isRequired
165
163
  });
166
164
 
165
+ var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
166
+
167
+ var _templateObject$3, _templateObject2$3, _templateObject3$3;
168
+ var AssetGalleryBase$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$3 || (_templateObject$3 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n"])));
169
+ var GroupLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2$3 || (_templateObject2$3 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n ", "\n display: flex;\n align-items: flex-end;\n position: absolute;\n padding-bottom: 4px;\n box-sizing: border-box;\n"])), function (props) {
170
+ return props.theme.primaryFontFamily;
171
+ }, function (props) {
172
+ return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
173
+ });
174
+ var AssetGalleryCardBase = styled__default['default'].div(_templateObject3$3 || (_templateObject3$3 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n z-index: 1;\n will-change: transform, width, height;\n\n &:hover {\n z-index: 2;\n }\n"])));
175
+
167
176
  var css_248z = ".lazy-load-image-background.opacity {\n opacity: 0;\n}\n\n.lazy-load-image-background.opacity.lazy-load-image-loaded {\n opacity: 1;\n transition: opacity .3s;\n}\n";
168
177
  defaultTheme.styleInject(css_248z);
169
178
 
@@ -184,15 +193,15 @@ var convertMsToHMS = function convertMsToHMS(ms) {
184
193
  return hmsString;
185
194
  };
186
195
 
187
- var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$2, _templateObject12$2, _templateObject13$2;
188
- var SummaryCard$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$3 || (_templateObject$3 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: ", ";\n\n ", "\n"])), function (props) {
196
+ var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$2, _templateObject12$2, _templateObject13$2;
197
+ var SummaryCard$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$2 || (_templateObject$2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: ", ";\n\n ", "\n"])), function (props) {
189
198
  return props.width ? "".concat(props.width, "px") : '100%';
190
199
  }, function (props) {
191
200
  return props.useBorder ? props.theme.themeProp('border', "1px solid ".concat(props.theme.getColor('gray-500')), "1px solid ".concat(props.theme.getColor('gray-300'))) : null;
192
201
  });
193
- var Gutter = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2$3 || (_templateObject2$3 = defaultTheme._taggedTemplateLiteral(["\n ", "\n padding-bottom: ", "px;\n"])), function (props) {
202
+ var Gutter = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2$2 || (_templateObject2$2 = defaultTheme._taggedTemplateLiteral(["\n ", "\n padding-bottom: ", "px;\n"])), function (props) {
194
203
  if (props.renderAsMargin) {
195
- return styled.css(_templateObject3$3 || (_templateObject3$3 = defaultTheme._taggedTemplateLiteral(["\n margin-bottom: ", "px;\n "])), props.gutter || 8);
204
+ return styled.css(_templateObject3$2 || (_templateObject3$2 = defaultTheme._taggedTemplateLiteral(["\n margin-bottom: ", "px;\n "])), props.gutter || 8);
196
205
  } else {
197
206
  return styled.css(_templateObject4$2 || (_templateObject4$2 = defaultTheme._taggedTemplateLiteral(["\n padding-bottom: ", "px;\n "])), props.gutter || 8);
198
207
  }
@@ -282,12 +291,14 @@ SummaryCard.defaultProps = {
282
291
  useBorder: false
283
292
  };
284
293
 
285
- var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1;
286
- var AssetGalleryWrapper$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$2 || (_templateObject$2 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
287
- return props.disabled && styled.css(_templateObject2$2 || (_templateObject2$2 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
294
+ var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1;
295
+ var AssetGalleryWrapper$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$1 || (_templateObject$1 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
296
+ return props.disabled && styled.css(_templateObject2$1 || (_templateObject2$1 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
288
297
  });
289
- var AssetGalleryCompactCard$2 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3$2 || (_templateObject3$2 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n height: 100%;\n padding: ", "px;\n box-sizing: border-box;\n cursor: pointer;\n ", ";\n ", ";\n\n ", "\n video {\n width: 100%;\n height: 100%;\n }\n\n .audio {\n display: flex;\n justify-content: center;\n height: 100%;\n svg {\n width: 25%;\n }\n }\n"])), function (props) {
298
+ var AssetGalleryCompactCard$2 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3$1 || (_templateObject3$1 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n height: 100%;\n padding: ", "px;\n box-sizing: border-box;\n cursor: pointer;\n ", ";\n ", ";\n ", ";\n\n ", "\n video {\n width: 100%;\n height: 100%;\n }\n\n .audio {\n display: flex;\n justify-content: center;\n height: 100%;\n svg {\n width: 25%;\n }\n }\n"])), function (props) {
290
299
  return props.selected ? 3 : 0;
300
+ }, function (props) {
301
+ return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
291
302
  }, function (props) {
292
303
  return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-300'));
293
304
  }, function (props) {
@@ -445,6 +456,7 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
445
456
  var _asset$note, _asset$note2;
446
457
 
447
458
  var asset = props.asset,
459
+ activeSummaryCard = props.activeSummaryCard,
448
460
  selectable = props.selectable,
449
461
  hasHeightAndWidth = props.hasHeightAndWidth,
450
462
  selected = props.selected,
@@ -466,6 +478,7 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
466
478
  openedSubActions = _React$useState4[0],
467
479
  updateOpenedSubActions = _React$useState4[1];
468
480
 
481
+ console.log('activeSummaryCard', activeSummaryCard);
469
482
  React.useEffect(function () {
470
483
  var _asset$actions;
471
484
 
@@ -697,22 +710,17 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
697
710
  return React__default['default'].createElement(React__default['default'].Fragment, null, renderVersionsBadge(), renderMediaBadge());
698
711
  }, [asset]);
699
712
  var renderPopoverContent = React.useCallback(function () {
700
- var _asset$summary2, _asset$summary3, _asset$summary4, _asset$summary5;
713
+ var _asset$summary, _asset$summary2, _asset$summary3, _asset$summary4, _asset$summary5, _asset$summary6, _asset$summary7, _asset$summary8;
701
714
 
702
- var _asset$summary = asset.summary,
703
- headerLeft = _asset$summary.headerLeft,
704
- headerRight = _asset$summary.headerRight,
705
- footerLeft = _asset$summary.footerLeft,
706
- footerRight = _asset$summary.footerRight;
707
715
  return React__default['default'].createElement(SummaryCard, {
708
- title: (asset === null || asset === void 0 ? void 0 : (_asset$summary2 = asset.summary) === null || _asset$summary2 === void 0 ? void 0 : _asset$summary2.title) || '',
709
- description: (asset === null || asset === void 0 ? void 0 : (_asset$summary3 = asset.summary) === null || _asset$summary3 === void 0 ? void 0 : _asset$summary3.description) || '',
710
- instructions: (asset === null || asset === void 0 ? void 0 : (_asset$summary4 = asset.summary) === null || _asset$summary4 === void 0 ? void 0 : _asset$summary4.instructions) || '',
711
- instructionsType: (asset === null || asset === void 0 ? void 0 : (_asset$summary5 = asset.summary) === null || _asset$summary5 === void 0 ? void 0 : _asset$summary5.instructionsType) || '',
712
- headerRight: headerRight,
713
- headerLeft: React__default['default'].createElement(React__default['default'].Fragment, null, renderSummaryCardHeaderLeft(), headerLeft),
714
- footerLeft: footerLeft,
715
- footerRight: footerRight,
716
+ title: (asset === null || asset === void 0 ? void 0 : (_asset$summary = asset.summary) === null || _asset$summary === void 0 ? void 0 : _asset$summary.title) || '',
717
+ description: (asset === null || asset === void 0 ? void 0 : (_asset$summary2 = asset.summary) === null || _asset$summary2 === void 0 ? void 0 : _asset$summary2.description) || '',
718
+ instructions: (asset === null || asset === void 0 ? void 0 : (_asset$summary3 = asset.summary) === null || _asset$summary3 === void 0 ? void 0 : _asset$summary3.instructions) || '',
719
+ instructionsType: (asset === null || asset === void 0 ? void 0 : (_asset$summary4 = asset.summary) === null || _asset$summary4 === void 0 ? void 0 : _asset$summary4.instructionsType) || '',
720
+ headerRight: (asset === null || asset === void 0 ? void 0 : (_asset$summary5 = asset.summary) === null || _asset$summary5 === void 0 ? void 0 : _asset$summary5.headerRight) || '',
721
+ headerLeft: React__default['default'].createElement(React__default['default'].Fragment, null, renderSummaryCardHeaderLeft(), (asset === null || asset === void 0 ? void 0 : (_asset$summary6 = asset.summary) === null || _asset$summary6 === void 0 ? void 0 : _asset$summary6.headerLeft) || ''),
722
+ footerLeft: (asset === null || asset === void 0 ? void 0 : (_asset$summary7 = asset.summary) === null || _asset$summary7 === void 0 ? void 0 : _asset$summary7.footerLeft) || '',
723
+ footerRight: (asset === null || asset === void 0 ? void 0 : (_asset$summary8 = asset.summary) === null || _asset$summary8 === void 0 ? void 0 : _asset$summary8.footerRight) || '',
716
724
  width: 375
717
725
  });
718
726
  }, [asset]);
@@ -733,7 +741,7 @@ var AssetGalleryCompactCard = function AssetGalleryCompactCard(props) {
733
741
  }, asset.previewUrl && renderPreview(asset), React__default['default'].createElement(Popover.Popover, {
734
742
  content: renderPopoverContent(),
735
743
  placement: 'bottom',
736
- visible: isOverlayHovered && !isAnySubActionsOpened,
744
+ visible: isOverlayHovered && !isAnySubActionsOpened && activeSummaryCard,
737
745
  zIndex: 10000
738
746
  }, React__default['default'].createElement(Overlay$1, {
739
747
  ref: cardRef,
@@ -798,11 +806,11 @@ var AssetGalleryCompactCard$1 = reactLazyLoadImageComponent.trackWindowScroll(Re
798
806
  });
799
807
  }));
800
808
 
801
- var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26;
802
- var AssetGalleryWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$1 || (_templateObject$1 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
803
- return props.disabled && styled.css(_templateObject2$1 || (_templateObject2$1 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
809
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26;
810
+ var AssetGalleryWrapper = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
811
+ return props.disabled && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
804
812
  });
805
- var AssetGalleryGridCard$2 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3$1 || (_templateObject3$1 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n border-width: ", "px;\n border-style: solid;\n text-decoration: none;\n cursor: pointer;\n\n ", "\n\n ", ";\n\n ", "\n\n ", ";\n"])), function (props) {
813
+ var AssetGalleryGridCard$2 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n display: block;\n position: relative;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n border-width: ", "px;\n border-style: solid;\n text-decoration: none;\n cursor: pointer;\n\n ", "\n\n ", ";\n\n ", "\n\n ", ";\n"])), function (props) {
806
814
  var selected = props.selected,
807
815
  softSelected = props.softSelected,
808
816
  hasError = props.hasError,
@@ -1241,18 +1249,15 @@ var AssetGalleryGridCard = function AssetGalleryGridCard(props) {
1241
1249
  });
1242
1250
  }, [asset]);
1243
1251
  var renderSummary = React.useCallback(function () {
1244
- var _asset$summary2, _asset$summary3, _asset$summary4, _asset$summary5;
1252
+ var _asset$summary, _asset$summary2, _asset$summary3, _asset$summary4, _asset$summary5, _asset$summary6;
1245
1253
 
1246
- var _asset$summary = asset.summary,
1247
- footerLeft = _asset$summary.footerLeft,
1248
- footerRight = _asset$summary.footerRight;
1249
1254
  return React__default['default'].createElement(SummaryCard, {
1250
- title: (asset === null || asset === void 0 ? void 0 : (_asset$summary2 = asset.summary) === null || _asset$summary2 === void 0 ? void 0 : _asset$summary2.title) || '',
1251
- description: (asset === null || asset === void 0 ? void 0 : (_asset$summary3 = asset.summary) === null || _asset$summary3 === void 0 ? void 0 : _asset$summary3.description) || '',
1252
- instructions: (asset === null || asset === void 0 ? void 0 : (_asset$summary4 = asset.summary) === null || _asset$summary4 === void 0 ? void 0 : _asset$summary4.instructions) || '',
1253
- instructionsType: (asset === null || asset === void 0 ? void 0 : (_asset$summary5 = asset.summary) === null || _asset$summary5 === void 0 ? void 0 : _asset$summary5.instructionsType) || '',
1254
- footerLeft: footerLeft,
1255
- footerRight: footerRight
1255
+ title: (asset === null || asset === void 0 ? void 0 : (_asset$summary = asset.summary) === null || _asset$summary === void 0 ? void 0 : _asset$summary.title) || '',
1256
+ description: (asset === null || asset === void 0 ? void 0 : (_asset$summary2 = asset.summary) === null || _asset$summary2 === void 0 ? void 0 : _asset$summary2.description) || '',
1257
+ instructions: (asset === null || asset === void 0 ? void 0 : (_asset$summary3 = asset.summary) === null || _asset$summary3 === void 0 ? void 0 : _asset$summary3.instructions) || '',
1258
+ instructionsType: (asset === null || asset === void 0 ? void 0 : (_asset$summary4 = asset.summary) === null || _asset$summary4 === void 0 ? void 0 : _asset$summary4.instructionsType) || '',
1259
+ footerLeft: (asset === null || asset === void 0 ? void 0 : (_asset$summary5 = asset.summary) === null || _asset$summary5 === void 0 ? void 0 : _asset$summary5.footerLeft) || '',
1260
+ footerRight: (asset === null || asset === void 0 ? void 0 : (_asset$summary6 = asset.summary) === null || _asset$summary6 === void 0 ? void 0 : _asset$summary6.footerRight) || ''
1256
1261
  });
1257
1262
  }, [asset]);
1258
1263
  return React__default['default'].createElement(AssetGalleryWrapper, {
@@ -1302,17 +1307,9 @@ var AssetGalleryGridCard$1 = reactLazyLoadImageComponent.trackWindowScroll(React
1302
1307
  });
1303
1308
  }));
1304
1309
 
1305
- var _templateObject, _templateObject2, _templateObject3;
1306
- var AssetGalleryBase$1 = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n"])));
1307
- var GroupLabel = styled__default['default'].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n font-family: ", ";\n ", "\n display: flex;\n align-items: flex-end;\n position: absolute;\n padding-bottom: 4px;\n box-sizing: border-box;\n"])), function (props) {
1308
- return props.theme.primaryFontFamily;
1309
- }, function (props) {
1310
- return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
1311
- });
1312
- var AssetGalleryCardBase = styled__default['default'].div(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n z-index: 1;\n will-change: transform, width, height;\n\n &:hover {\n z-index: 2;\n }\n"])));
1313
-
1314
1310
  var AssetGalleryBase = React__default['default'].forwardRef(function AssetGalleryBase(_ref, forwardedRef) {
1315
1311
  var assetsProp = _ref.assets,
1312
+ activeSummaryCard = _ref.activeSummaryCard,
1316
1313
  viewMode = _ref.viewMode,
1317
1314
  thumbnailMaxHeight = _ref.thumbnailMaxHeight,
1318
1315
  selectable = _ref.selectable,
@@ -1324,7 +1321,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
1324
1321
  scrollElementProp = _ref.scrollElement,
1325
1322
  onAssetSoftSelectedChanged = _ref.onAssetSoftSelectedChanged,
1326
1323
  component = _ref.component,
1327
- props = defaultTheme._objectWithoutProperties(_ref, ["assets", "viewMode", "thumbnailMaxHeight", "selectable", "selectedAssetKeys", "onAssetSelected", "onAssetUnselected", "softSelectable", "softSelectedAssetKey", "scrollElement", "onAssetSoftSelectedChanged", "component"]);
1324
+ props = defaultTheme._objectWithoutProperties(_ref, ["assets", "activeSummaryCard", "viewMode", "thumbnailMaxHeight", "selectable", "selectedAssetKeys", "onAssetSelected", "onAssetUnselected", "softSelectable", "softSelectedAssetKey", "scrollElement", "onAssetSoftSelectedChanged", "component"]);
1328
1325
 
1329
1326
  var assetGalleryDOMNode = React.useRef();
1330
1327
  var assetGalleryCompactRef = useMergedRefs.useMergedRefs(forwardedRef, assetGalleryDOMNode);
@@ -1712,6 +1709,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
1712
1709
  component: component
1713
1710
  }) : React__default['default'].createElement(AssetGalleryCompactCard$1, {
1714
1711
  asset: asset,
1712
+ activeSummaryCard: activeSummaryCard,
1715
1713
  hasHeightAndWidth: asset.layout.hasHeightAndWidth,
1716
1714
  collapseExtraInfo: asset.layout.width < 90,
1717
1715
  selectable: 'selectable' in asset ? asset.selectable : selectable,
@@ -1726,6 +1724,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
1726
1724
  });
1727
1725
  AssetGalleryBase.propTypes = process.env.NODE_ENV !== "production" ? {
1728
1726
  assets: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.shape(assetShape)),
1727
+ activeSummaryCard: defaultTheme.PropTypes.bool,
1729
1728
  viewMode: defaultTheme.PropTypes.oneOf(['compact', 'grid']),
1730
1729
  thumbnailMaxHeight: defaultTheme.PropTypes.number,
1731
1730
  selectable: defaultTheme.PropTypes.bool,
@@ -1742,6 +1741,7 @@ AssetGalleryBase.propTypes = process.env.NODE_ENV !== "production" ? {
1742
1741
 
1743
1742
  var AssetGallery = React__default['default'].forwardRef(function AssetGallery(_ref, forwardedRef) {
1744
1743
  var assets = _ref.assets,
1744
+ activeSummaryCard = _ref.activeSummaryCard,
1745
1745
  viewMode = _ref.viewMode,
1746
1746
  thumbnailMaxHeight = _ref.thumbnailMaxHeight,
1747
1747
  selectable = _ref.selectable,
@@ -1751,7 +1751,7 @@ var AssetGallery = React__default['default'].forwardRef(function AssetGallery(_r
1751
1751
  scrollElement = _ref.scrollElement,
1752
1752
  onSoftSelectedChanged = _ref.onSoftSelectedChanged,
1753
1753
  component = _ref.component,
1754
- props = defaultTheme._objectWithoutProperties(_ref, ["assets", "viewMode", "thumbnailMaxHeight", "selectable", "selectedAssetKeys", "onSelectedChanged", "softSelectable", "scrollElement", "onSoftSelectedChanged", "component"]);
1754
+ props = defaultTheme._objectWithoutProperties(_ref, ["assets", "activeSummaryCard", "viewMode", "thumbnailMaxHeight", "selectable", "selectedAssetKeys", "onSelectedChanged", "softSelectable", "scrollElement", "onSoftSelectedChanged", "component"]);
1755
1755
 
1756
1756
  var _useState = React.useState(selectedAssetKeys || []),
1757
1757
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
@@ -1806,6 +1806,7 @@ var AssetGallery = React__default['default'].forwardRef(function AssetGallery(_r
1806
1806
  return React__default['default'].createElement(AssetGalleryBase, defaultTheme._extends({
1807
1807
  ref: forwardedRef,
1808
1808
  assets: assets,
1809
+ activeSummaryCard: activeSummaryCard,
1809
1810
  thumbnailMaxHeight: thumbnailMaxHeight,
1810
1811
  selectable: selectable,
1811
1812
  selectedAssetKeys: selectedAssetKeysInternalState,
@@ -1821,6 +1822,7 @@ var AssetGallery = React__default['default'].forwardRef(function AssetGallery(_r
1821
1822
  });
1822
1823
  AssetGallery.propTypes = process.env.NODE_ENV !== "production" ? {
1823
1824
  assets: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.shape(assetShape)),
1825
+ activeSummaryCard: defaultTheme.PropTypes.bool,
1824
1826
  viewMode: defaultTheme.PropTypes.oneOf(['compact', 'grid']),
1825
1827
  thumbnailMaxHeight: defaultTheme.PropTypes.number,
1826
1828
  selectable: defaultTheme.PropTypes.bool,
@@ -1835,7 +1837,8 @@ AssetGallery.defaultProps = {
1835
1837
  assets: [],
1836
1838
  viewMode: 'compact',
1837
1839
  thumbnailMaxHeight: 300,
1838
- selectedAssetKeys: []
1840
+ selectedAssetKeys: [],
1841
+ activeSummaryCard: false
1839
1842
  };
1840
1843
 
1841
1844
  exports.AssetGallery = AssetGallery;
package/{CompactTextInput-c5e38aae.js → CompactTextInput-ca975da6.js} RENAMED
@@ -6,7 +6,7 @@ var nanoid = require('nanoid');
6
6
  var React = require('react');
7
7
  var check = require('./check-555d831b.js');
8
8
  var editNote = require('./edit-note-c47d292e.js');
9
- require('./Alert-96814023.js');
9
+ require('./Alert-163f8e98.js');
10
10
  require('./Badge-fa94dca8.js');
11
11
  require('./Popover-155cbac8.js');
12
12
  require('./Tab-8fec1dba.js');
package/{Instructions-b955ba72.js → Instructions-b121b75d.js} RENAMED
@@ -5,7 +5,7 @@ var lodash = require('lodash');
5
5
  var React = require('react');
6
6
  var warningCircle = require('./warning-circle-24522402.js');
7
7
  var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-d4147107.js');
8
- var TextArea = require('./TextArea-4d90d02c.js');
8
+ var TextArea = require('./TextArea-38615509.js');
9
9
  var styled = require('styled-components');
10
10
 
11
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
package/{TextArea-4d90d02c.js → TextArea-38615509.js} RENAMED
@@ -234,6 +234,11 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
234
234
  React.useEffect(function () {
235
235
  calculateRows();
236
236
  }, [value, defaultValue]);
237
+ var onKeyDown = React.useCallback(function (event) {
238
+ if (event.key === 'Enter') {
239
+ event.stopPropagation();
240
+ }
241
+ }, []);
237
242
  if (hidden) return null;
238
243
  return React__default['default'].createElement(TextInput, {
239
244
  disabled: disabled,
@@ -272,6 +277,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
272
277
 
273
278
  _onChange(e);
274
279
  },
280
+ onKeyDown: onKeyDown,
275
281
  onBlur: onBlur,
276
282
  noBorder: noBorder
277
283
  }, rest)), (state === 'loading' || state === 'success') && React__default['default'].createElement(SuccessContainer, null, state === 'loading' && React__default['default'].createElement(check._default, {
package/data/Alert/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Alert = require('../../Alert-96814023.js');
3
+ var Alert = require('../../Alert-163f8e98.js');
4
4
  require('../../defaultTheme-c137e17f.js');
5
5
  require('styled-components');
6
6
  require('react');
package/data/index.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var Alert = require('../Alert-96814023.js');
5
+ var Alert = require('../Alert-163f8e98.js');
6
6
  var Badge = require('../Badge-fa94dca8.js');
7
7
  var Popover = require('../Popover-155cbac8.js');
8
8
  var Tab = require('../Tab-8fec1dba.js');
package/inputs/CompactTextInput/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var CompactTextInput = require('../../CompactTextInput-c5e38aae.js');
3
+ var CompactTextInput = require('../../CompactTextInput-ca975da6.js');
4
4
  require('../../defaultTheme-c137e17f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -8,7 +8,7 @@ require('nanoid');
8
8
  require('react');
9
9
  require('../../check-555d831b.js');
10
10
  require('../../edit-note-c47d292e.js');
11
- require('../../Alert-96814023.js');
11
+ require('../../Alert-163f8e98.js');
12
12
  require('../../Badge-fa94dca8.js');
13
13
  require('../../Popover-155cbac8.js');
14
14
  require('polished');
package/inputs/TextArea/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-4d90d02c.js');
3
+ var TextArea = require('../../TextArea-38615509.js');
4
4
  require('../../defaultTheme-c137e17f.js');
5
5
  require('styled-components');
6
6
  require('react');
package/inputs/index.js CHANGED
@@ -7,10 +7,10 @@ var Button = require('../Button-5071dc6b.js');
7
7
  var Checkbox = require('../Checkbox-dd2cf216.js');
8
8
  var CompactAutocompleteSelect = require('../CompactAutocompleteSelect-d4147107.js');
9
9
  var CompactStarRating = require('../CompactStarRating-ca1943af.js');
10
- var CompactTextInput = require('../CompactTextInput-c5e38aae.js');
10
+ var CompactTextInput = require('../CompactTextInput-ca975da6.js');
11
11
  var MultiSelect = require('../MultiSelect-87614192.js');
12
12
  var Radio = require('../Radio-dd81f5d4.js');
13
- var TextArea = require('../TextArea-4d90d02c.js');
13
+ var TextArea = require('../TextArea-38615509.js');
14
14
  var TextInput = require('../TextInput-e6035fb0.js');
15
15
  var Switch = require('../Switch-c004ea6d.js');
16
16
  require('../defaultTheme-c137e17f.js');
@@ -31,7 +31,7 @@ require('../react-select-creatable.esm-2f23d6c6.js');
31
31
  require('react-dom');
32
32
  require('../close-ebf2f3cf.js');
33
33
  require('../edit-note-c47d292e.js');
34
- require('../Alert-96814023.js');
34
+ require('../Alert-163f8e98.js');
35
35
  require('../Badge-fa94dca8.js');
36
36
  require('../Tab-8fec1dba.js');
37
37
  require('../Tabs-96e366bf.js');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.2.0-rc.3",
3
+ "version": "1.2.0-rc.5",
4
4
  "description": "NTBs common front-end design utilities and React components.",
5
5
  "scripts": {
6
6
  "build": "cross-env NODE_ENV=production rollup -c",
package/widgets/AssetGallery/index.js CHANGED
@@ -1,15 +1,15 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-6899ec54.js');
3
+ var AssetGallery = require('../../AssetGallery-c6953833.js');
4
4
  require('../../defaultTheme-c137e17f.js');
5
5
  require('styled-components');
6
- require('react');
7
6
  require('lodash');
7
+ require('react');
8
8
  require('../../useMergedRefs-b6d2f8fc.js');
9
9
  require('resize-observer-polyfill');
10
10
  require('react-lazy-load-image-component');
11
11
  require('../../warning-circle-24522402.js');
12
- require('../../Alert-96814023.js');
12
+ require('../../Alert-163f8e98.js');
13
13
  require('../../Badge-fa94dca8.js');
14
14
  require('../../Popover-155cbac8.js');
15
15
  require('polished');
@@ -33,11 +33,11 @@ require('../../react-select-creatable.esm-2f23d6c6.js');
33
33
  require('react-dom');
34
34
  require('../../close-ebf2f3cf.js');
35
35
  require('../../CompactStarRating-ca1943af.js');
36
- require('../../CompactTextInput-c5e38aae.js');
36
+ require('../../CompactTextInput-ca975da6.js');
37
37
  require('../../edit-note-c47d292e.js');
38
38
  require('../../MultiSelect-87614192.js');
39
39
  require('../../Radio-dd81f5d4.js');
40
- require('../../TextArea-4d90d02c.js');
40
+ require('../../TextArea-38615509.js');
41
41
  require('../../TextInput-e6035fb0.js');
42
42
  require('../../Switch-c004ea6d.js');
43
43
  require('../../ContextMenuItem-10af8b2f.js');
package/widgets/Instructions/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-b955ba72.js');
3
+ var Instructions = require('../../Instructions-b121b75d.js');
4
4
  require('../../defaultTheme-c137e17f.js');
5
5
  require('styled-components');
6
6
  require('lodash');
@@ -15,7 +15,7 @@ require('../../react-select-creatable.esm-2f23d6c6.js');
15
15
  require('react-dom');
16
16
  require('../../close-ebf2f3cf.js');
17
17
  require('../../expand-more-94585605.js');
18
- require('../../TextArea-4d90d02c.js');
18
+ require('../../TextArea-38615509.js');
19
19
  require('../../useMergedRefs-b6d2f8fc.js');
20
20
  require('../../edit-note-c47d292e.js');
21
21
 
package/widgets/index.js CHANGED
@@ -2,19 +2,19 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-6899ec54.js');
5
+ var AssetGallery = require('../AssetGallery-c6953833.js');
6
6
  var ContextMenu = require('../ContextMenu-bd818e55.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-ade10c15.js');
8
- var Instructions = require('../Instructions-b955ba72.js');
8
+ var Instructions = require('../Instructions-b121b75d.js');
9
9
  require('../defaultTheme-c137e17f.js');
10
10
  require('styled-components');
11
- require('react');
12
11
  require('lodash');
12
+ require('react');
13
13
  require('../useMergedRefs-b6d2f8fc.js');
14
14
  require('resize-observer-polyfill');
15
15
  require('react-lazy-load-image-component');
16
16
  require('../warning-circle-24522402.js');
17
- require('../Alert-96814023.js');
17
+ require('../Alert-163f8e98.js');
18
18
  require('../Badge-fa94dca8.js');
19
19
  require('../Popover-155cbac8.js');
20
20
  require('polished');
@@ -37,11 +37,11 @@ require('../react-select-creatable.esm-2f23d6c6.js');
37
37
  require('react-dom');
38
38
  require('../close-ebf2f3cf.js');
39
39
  require('../CompactStarRating-ca1943af.js');
40
- require('../CompactTextInput-c5e38aae.js');
40
+ require('../CompactTextInput-ca975da6.js');
41
41
  require('../edit-note-c47d292e.js');
42
42
  require('../MultiSelect-87614192.js');
43
43
  require('../Radio-dd81f5d4.js');
44
- require('../TextArea-4d90d02c.js');
44
+ require('../TextArea-38615509.js');
45
45
  require('../TextInput-e6035fb0.js');
46
46
  require('../Switch-c004ea6d.js');
47
47
  require('../ContextMenuItem-10af8b2f.js');